Registry / web-framework / react-component-managers

react-component-managers

library3.2.2jsnpmunverified

react-component-managers is a utility library designed to simplify the composition of functionality into React components, serving as an alternative to traditional mixins. Released in 2018, its stable version is `3.2.2`. The library aims to provide a lightweight composition solution, similar to `recompose` but without introducing Higher-Order Component (HoC) wrappers, which can lead to deeper component hierarchies. Its primary use case was to address concerns around mixin deprecation and the overhead of HoCs, offering a direct way to inject behavior. Given its last update in July 2018, prior to the widespread adoption of React Hooks, the library is no longer actively developed and reflects a component design paradigm that has largely been superseded by modern React patterns. Its release cadence was slow, and development has ceased.

web-framework

npm install react-component-managers

github ↗package ↗

INSTALL

IMPORT

SIG · REACT-COMPONENT-MA

react-component-managers

web-frameworkjavascriptv3.2.2

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

manager

✓ import { manager } from 'react-component-managers'

✗ const { manager } = require('react-component-managers');

Primarily used for creating stateful component logic. CommonJS `require` is also possible but less idiomatic in modern React contexts.

compose

✓ import { compose } from 'react-component-managers'

✗ const compose = require('react-component-managers').compose;

Used for combining multiple manager functions. `require` syntax is prone to errors if not destructuring correctly.

✓ import * as ComponentManagers from 'react-component-managers'

✗ import ComponentManagers from 'react-component-managers'

The library exports named modules, not a default export. Attempting a default import will result in `undefined`.

Demonstrates the composition of two managers, `counter` and `logger`, into a class component `MyComponent` using the `compose` helper. The `manager` function defines behavior that can interact with component lifecycle events or props.

import React from 'react'; import { manager, compose } from 'react-component-managers'; const counter = manager((_props, { on }) => { let count = 0; return on('click', () => count++); }); const logger = manager((_props, { on }) => { on('mount', () => console.log('Component mounted!')); on('unmount', () => console.log('Component unmounted!')); }); class MyComponent extends React.Component { render() { return ( <div> <h1>Count: {this.state.count}</h1> <button onClick={this.props.onClick}>Increment</button> </div> ); } } // Compose the managers with the component const ManagedComponent = compose(counter, logger)(MyComponent); // Example usage (e.g., in App.js) // function App() { // return <ManagedComponent />; // } // export default App; // For quickstart, just render to demonstrate the pattern // This isn't a full runnable example without a React renderer // but illustrates the composition.

Debug

Known issues

breakingThe library is abandoned and not actively maintained. It was last updated in 2018, before the introduction of React Hooks (React 16.8 in 2019), which dramatically changed how state and side effects are managed in functional components.

fix

Migrate to modern React Hooks for state and side effect management in functional components (e.g., `useState`, `useEffect`, custom hooks) or consider alternative state management libraries if using class components (e.g., Redux, MobX) or other component composition patterns like render props or contemporary Higher-Order Components.

affects: >=3.0.0

gotchaThis library is designed for class components and older React patterns, primarily as an alternative to mixins. It does not natively support React functional components or hooks.

fix

Use this library exclusively with React class components or refactor your application to use modern functional components with hooks. Do not attempt to use `manager` or `compose` with functional components as it is not designed for that paradigm.

affects: <=3.2.2

deprecatedThe patterns addressed by `react-component-managers` (mixins, pre-hooks component composition) are largely considered deprecated or suboptimal in modern React development, favoring hooks and more explicit dependency injection patterns.

fix

For new development, adopt React Hooks for component logic and state. For existing codebases using this library, consider a progressive migration strategy to functional components and hooks.

affects: <=3.2.2

Errors

Common errors & fixes

TypeError: Cannot read properties of undefined (reading 'on') or similar method-not-found errors

Attempting to use `manager` or `compose` with a non-React component, or incorrectly calling the `manager` function outside of its intended lifecycle hook.

fix

Ensure `manager` is correctly invoked and integrated within a React class component's context, as it expects a specific signature to inject behavior. Double-check the usage against the library's examples, which typically involve passing the manager's output to `compose`.

Module not found: Can't resolve 'react-component-managers'

The package is not installed or there's a typo in the import path.

fix

Run `npm install react-component-managers` or `yarn add react-component-managers`. Verify the spelling of the package name in your import statements.

Upgrade

Version history

3.2.2latest on npm

Audit

Dependencies

reactrequiredPeer dependency for React applications.

react-domrequiredPeer dependency for rendering React components.

Agent activity

2 hits · last 30 days

node

Resources

githubhttps://github.com/jquense/react-component-managers ↗

packagehttps://www.npmjs.com/package/react-component-managers ↗