{"id":13927,"library":"redux-bundler-react","title":"Redux-Bundler React Bindings","description":"Redux-bundler-react offers dedicated bindings to integrate the redux-bundler state management pattern with React applications. It provides two primary exports: `Provider` for making the redux-bundler store available via React context, and a `connect` higher-order component. Unlike `react-redux`, `connect` in this library takes string names of selectors and action creators, which it then resolves from the store. This string-based approach is a key differentiator, designed to simplify component subscriptions and optimize diffing outside the component itself. The current stable version is 1.2.0, last updated in 2020, indicating a mature but slow-moving project. It emphasizes a clear separation of concerns and runtime validation of requested store elements.","status":"active","version":"1.2.0","language":"javascript","source_language":"en","source_url":null,"tags":["javascript","react","redux"],"install":[{"cmd":"npm install redux-bundler-react","lang":"bash","label":"npm"},{"cmd":"yarn add redux-bundler-react","lang":"bash","label":"yarn"},{"cmd":"pnpm add redux-bundler-react","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency for React component rendering.","package":"react","optional":false},{"reason":"Core state management library that these bindings connect to.","package":"redux-bundler","optional":false}],"imports":[{"note":"Used to pass the redux-bundler store down the React component tree via context.","wrong":"const { Provider } = require('redux-bundler-react')","symbol":"Provider","correct":"import { Provider } from 'redux-bundler-react'"},{"note":"Higher-order component. Connects a React component to specific selectors and action creators by their string names.","wrong":"const { connect } = require('redux-bundler-react')","symbol":"connect","correct":"import { connect } from 'redux-bundler-react'"},{"note":"Both `Provider` and `connect` are named exports, not default exports.","wrong":"import connect from 'redux-bundler-react'","symbol":"{ Provider, connect }","correct":"import { Provider, connect } from 'redux-bundler-react'"}],"quickstart":{"code":"import { connect, Provider } from 'redux-bundler-react';\nimport { createStore } from 'redux-bundler'; // Assuming redux-bundler is installed\nimport React from 'react';\nimport ReactDOM from 'react-dom';\n\n// Minimal example bundle\nconst myBundle = {\n name: 'myBundle',\n getSelectors: () => ({\n selectMyValue: (state) => state.myValue,\n selectOtherValue: (state) => state.otherValue\n }),\n doUpdateMyValue: (value) => ({ dispatch }) => {\n dispatch({ type: 'UPDATE_MY_VALUE', payload: value });\n },\n reducer: (state = { myValue: 'Hello', otherValue: 'World' }, action) => {\n if (action.type === 'UPDATE_MY_VALUE') {\n return { ...state, myValue: action.payload };\n }\n return state;\n }\n};\n\nconst getStore = () => createStore(myBundle);\n\nconst MyConnectedComponent = ({ myValue, otherValue, doUpdateMyValue }) => (\n
\n);\n\nReactDOM.render(\n \n \n ,\n document.getElementById('root')\n);\n","lang":"javascript","description":"Demonstrates setting up a basic redux-bundler store, providing it to React via `Provider`, and connecting a component using `connect` to access selectors and action creators by name."},"warnings":[{"fix":"Ensure all string names passed to `connect` correspond exactly to existing selector or action creator names defined within your redux-bundler bundles.","message":"When using `connect`, if a specified selector or action creator (by its string name) does not exist in the redux-bundler store, the library will throw a runtime error. This is intentional for easier debugging.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Review any component inspection or debugging tools that rely on specific `displayName` values for connected components. No code change is typically required for application functionality.","message":"Version 1.2.0 introduced a fix for display name wrapping, decorating connected components with `connect(WrappedComponent)`. While not strictly 'breaking' in functionality, if your code relied on specific `displayName` properties for connected components prior to 1.2.0, this change might affect tools that inspect component names.","severity":"breaking","affected_versions":">=1.2.0"}],"env_vars":null,"search_vec":"'1.2.0':98 '2020':102 'action':63 'applic':24 'approach':76 'avail':38 'base':75 'bind':5,12 'bundler':3,8,18,36 'clear':114 'compon':48,84,91 'concern':117 'connect':44,53 'context':41 'creator':64 'current':94 'dedic':11 'design':81 'dif':88 'differenti':80 'element':124 'emphas':112 'export':29 'higher':46 'higher-ord':45 'indic':103 'integr':14 'javascript':125 'key':79 'last':99 'librari':56 'make':32 'manag':20 'matur':105 'move':109 'name':59 'offer':10 'optim':87 'order':47 'outsid':89 'pattern':21 'primari':28 'project':110 'provid':26,30 'react':4,9,23,40,51,126 'react-redux':50 'redux':2,7,17,35,52,127 'redux-bundl':1,16,34 'redux-bundler-react':6 'request':122 'resolv':68 'runtim':119 'selector':61 'separ':115 'simplifi':83 'slow':108 'slow-mov':107 'stabl':95 'state':19 'store':37,71,123 'string':58,74 'string-bas':73 'subscript':85 'take':57 'two':27 'unlik':49 'updat':100 'valid':120 'version':96 'via':39","created_at":"2026-04-20T01:57:02.031687+00:00","updated_at":"2026-04-20T01:57:02.031687+00:00","problems":[{"fix":"Ensure your top-level React application is wrapped with `` and that `getStore()` returns a valid redux-bundler store instance.","cause":"A component tried to access the redux-bundler store via context, but no `Provider` component was rendered higher in the component tree, or the `store` prop was not passed to `Provider`.","error":"Cannot read properties of undefined (reading 'store')"},{"fix":"Double-check the spelling and casing of the selector/action creator names passed to `connect`. Verify that the corresponding bundle is correctly loaded into your redux-bundler store.","cause":"The string name provided to `connect` (e.g., 'selectXYZ') does not match any existing selector or action creator defined in your redux-bundler bundles.","error":"Error: 'selectXYZ' does not exist in the store"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":"","cli_version":null,"type":"library","homepage":null,"github":null,"docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/redux-bundler-react","openapi_spec":null,"status_page":null,"smithery":null,"categories":["web-framework"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-17","next_check":"2026-07-18","install_tag":null}}