{"id":15814,"library":"safe-framework","title":"Safe Framework (React 15 / Material-UI 0.x era)","description":"The `safe-framework` package, currently at version `0.0.45`, is a JavaScript framework built on a foundational stack from the React 15.x and Material-UI 0.x era. Its core functionality likely revolves around providing UI components and utilities, integrating with older versions of `material-ui` for Google's Material Design principles and `react-leaflet` for map-based interfaces. Key peer dependencies like `react@^15.4.0` (released November 2016), `material-ui@^0.16.5`, and the now-deprecated `react-tap-event-plugin` (deprecated as of React 16.4) firmly place this framework in a significantly older ecosystem. Given its `0.0.x` version and reliance on unmaintained dependencies, this project is considered abandoned, with no ongoing development, bug fixes, or security updates. It is distinct from other projects sharing the 'safe framework' name, such as those related to supply chain security or AI agent frameworks.","status":"abandoned","version":"0.0.45","language":"javascript","source_language":"en","source_url":"https://github.com/jeffshaver/safe-framework","tags":["javascript"],"install":[{"cmd":"npm install safe-framework","lang":"bash","label":"npm"},{"cmd":"yarn add safe-framework","lang":"bash","label":"yarn"},{"cmd":"pnpm add safe-framework","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Provides fullscreen capability for Leaflet maps integrated via react-leaflet.","package":"leaflet-fullscreen","optional":false},{"reason":"Core UI components based on Google's Material Design (version 0.16.x).","package":"material-ui","optional":false},{"reason":"Handles inline styling and advanced styling features for React components.","package":"radium","optional":false},{"reason":"The foundational library for building user interfaces (version 15.4.x).","package":"react","optional":false},{"reason":"Provides DOM-specific rendering methods for React (version 15.4.x).","package":"react-dom","optional":false},{"reason":"React components for Leaflet maps (version 0.12.x).","package":"react-leaflet","optional":false},{"reason":"Required for Material-UI v0.x to address 300ms tap delay on mobile browsers. This plugin is now deprecated and incompatible with modern React.","package":"react-tap-event-plugin","optional":false}],"imports":[{"note":"Given the era, default exports from specific paths or CommonJS were common. This is a best guess for a primary application component.","wrong":"import { App } from 'safe-framework';","symbol":"App","correct":"import App from 'safe-framework/lib/App';"},{"note":"It's likely that safe-framework re-exported or wrapped Material-UI v0.x components. Direct import from `material-ui` would bypass safe-framework's wrappers.","wrong":"import { SomeMaterialComponent } from 'material-ui';","symbol":"SomeMaterialComponent","correct":"import { SomeMaterialComponent } from 'safe-framework/lib/material-components';"},{"note":"Similar to Material-UI, it's probable that `safe-framework` provided its own styled or integrated map components based on `react-leaflet`.","wrong":"import { MapComponent } from 'react-leaflet';","symbol":"MapComponent","correct":"import { MapComponent } from 'safe-framework/lib/map';"}],"quickstart":{"code":"import React from 'react';\nimport ReactDOM from 'react-dom';\nimport injectTapEventPlugin from 'react-tap-event-plugin';\nimport MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';\nimport getMuiTheme from 'material-ui/styles/getMuiTheme';\nimport { Card, CardText } from 'material-ui/Card';\nimport RaisedButton from 'material-ui/RaisedButton';\n\n// Required for Material-UI v0.x touch events\ninjectTapEventPlugin();\n\nconst App = () => (\n  <MuiThemeProvider muiTheme={getMuiTheme()}>\n    <div style={{ padding: 20 }}>\n      <h1>Welcome to Safe Framework (Legacy Demo)</h1>\n      <Card>\n        <CardText>\n          This is a demonstration of a basic component setup using\n          the `safe-framework`'s underlying Material-UI v0.x dependencies.\n          This example uses React {React.version} and Material-UI {process.env.MATERIAL_UI_VERSION ?? '0.x'}.\n        </CardText>\n      </Card>\n      <RaisedButton label=\"Click Me\" primary={true} style={{ marginTop: 20 }} />\n      <p style={{ marginTop: 20, fontSize: '0.8em', color: '#666' }}>\n        Note: This framework is built on very old dependencies and is not maintained.\n        Modern React and Material-UI versions are incompatible with this setup.\n      </p>\n    </div>\n  </MuiThemeProvider>\n);\n\nReactDOM.render(\n  <App />,\n  document.getElementById('root')\n);\n","lang":"javascript","description":"This quickstart demonstrates a minimal React 15 application using Material-UI v0.x components, illustrating the environment `safe-framework` operated within. It includes the mandatory `injectTapEventPlugin` for older Material-UI versions."},"warnings":[{"fix":"Migrate to a modern React framework (e.g., React 18+) and component library (e.g., MUI v5+ or Ant Design).","message":"This package is incompatible with modern React (v16+) and its ecosystem. React has undergone significant architectural changes, including Context API, Hooks, Concurrent Mode, and changes to event systems, making direct upgrades impossible.","severity":"breaking","affected_versions":">=0.0.1"},{"fix":"There is no direct fix to update these dependencies while maintaining `safe-framework` functionality. A complete re-implementation with modern libraries is required.","message":"All core peer dependencies (React 15.x, Material-UI 0.x, react-tap-event-plugin, Radium) are long deprecated and unmaintained. 'react-tap-event-plugin' is specifically noted as incompatible with React 16.4 and higher.","severity":"deprecated","affected_versions":">=0.0.1"},{"fix":"Remove `react-tap-event-plugin` and update to a modern Material-UI (now MUI) version that does not require it. This effectively means abandoning `safe-framework`.","message":"The `injectTapEventPlugin()` call, crucial for Material-UI v0.x's touch event handling, causes errors in React 16+ due to changes in React's internal event system.","severity":"breaking","affected_versions":">=0.0.1"},{"fix":"Avoid using this package in production environments. If legacy applications must run, isolate them in secure, sandboxed environments and ensure no sensitive data is processed.","message":"Using unmaintained software with very old dependencies can introduce significant security vulnerabilities, as known exploits in these versions will not be patched. This poses a supply chain risk.","severity":"gotcha","affected_versions":">=0.0.1"},{"fix":"Do not consider `safe-framework` for new projects. For existing projects using it, plan for a complete migration to a current, actively maintained technology stack.","message":"The low version number (0.0.45) coupled with the outdated dependencies indicates that this project was likely an internal or experimental framework that never reached maturity or stable release.","severity":"gotcha","affected_versions":">=0.0.1"}],"env_vars":null,"last_verified":"2026-04-21T00:00:00.000Z","next_check":"2026-07-20T00:00:00.000Z","problems":[{"fix":"Ensure `injectTapEventPlugin()` is called exactly once at the entry point of your application. If using React 16+, remove `react-tap-event-plugin` entirely.","cause":"`react-tap-event-plugin` is being called multiple times in a React 15 context, or a new React version is being used.","error":"Uncaught Invariant Violation: injectTapEventPlugin(): Can only be called once."},{"fix":"Verify all imports are correct and that you are using a React 15 compatible environment. If encountering this in a modern React setup, the components are fundamentally incompatible and require re-implementation.","cause":"Attempting to render a `safe-framework` or Material-UI v0.x component that is either not correctly imported, or its API has drastically changed in a newer React context.","error":"Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined."},{"fix":"Ensure consistent module import styles (`import` vs `require`). Verify that the component's export type matches the import statement. More broadly, this indicates fundamental incompatibility with current React if trying to use this framework.","cause":"Often seen when mixing CommonJS `require()` with ES module `import` for modules that provide a default export, or trying to use components designed for React 15 in a different React version's context.","error":"Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object."}],"ecosystem":"npm"}