{"library":"react-icon-base","title":"React Icon Base Component","description":"react-icon-base is a foundational React component designed to provide a consistent base for rendering SVG icons, primarily intended for internal use by icon libraries, such as older iterations of `react-icons`. It encapsulates an SVG element, allowing for a custom `viewBox` and direct SVG children, while also facilitating consistent styling, sizing, and color propagation via React's now-legacy context API (`childContextTypes`). The package's current stable version is 2.1.2, with its last publish occurring over seven years ago. Its deep reliance on `React.Component` and the deprecated `childContextTypes` API renders it largely incompatible with modern React versions (16.3+ for new context API, 18+ for complete removal of legacy context) without substantial compatibility layers or downgrading the React version. It is no longer actively maintained and should be considered abandoned for new project development.","language":"javascript","status":"abandoned","last_verified":"Tue Apr 21","install":{"commands":["npm install react-icon-base"],"cli":null},"imports":["import IconBase from 'react-icon-base';"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import React from 'react';\nimport IconBase from 'react-icon-base';\n\n// Example: Creating a Heart icon using IconBase\nclass FaHeart extends React.Component {\n    render() {\n        return (\n            <IconBase viewBox=\"0 0 1792 1896.0833\" {...this.props}>\n                <g><path d=\"m896 1664q-26 0-44-18l-624-602q-10-8-27.5-26t-55.5-65.5-68-97.5-53.5-121-23.5-138q0-220 127-344t351-124q62 0 126.5 21.5t120 58 95.5 68.5 76 68q36-36 76-68t95.5-68.5 120-58 126.5-21.5q224 0 351 124t127 344q0 221-229 450l-623 600q-18 18-44 18z\"/></g>\n            </IconBase>\n        )\n    }\n}\n\n// To provide global configuration via legacy context:\nimport PropTypes from 'prop-types';\nclass IconWrapper extends React.Component {\n    static childContextTypes = {\n        reactIconBase: PropTypes.object\n    };\n\n    getChildContext() {\n        return {\n            reactIconBase: {\n                color: 'blue',\n                size: 32,\n                style: { margin: '5px' }\n            }\n        }\n    }\n\n    render() {\n        return <FaHeart />;\n    }\n}\n\nexport default IconWrapper;","lang":"javascript","description":"This quickstart demonstrates how to create a custom SVG icon using `IconBase` and how to configure its default props globally using the legacy `childContextTypes` API. The `FaHeart` component wraps the SVG path in `IconBase`, while `IconWrapper` provides context.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}