{"_id":"@amy_blankenship/react-use-reducer-gateway","_rev":"2-4ea23a1a94eee116de922b1abae8ae06","name":"@amy_blankenship/react-use-reducer-gateway","dist-tags":{"latest":"0.1.0"},"versions":{"0.0.6":{"name":"@amy_blankenship/react-use-reducer-gateway","version":"0.0.6","description":"\"Gateway drug\" for developers hesitant to use React's useReducer. Covers 80% of cases, getting you hooked so you can take on the other 20% when you're ready.","publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"},"private":false,"main":"dist/cjs/index.js","scripts":{"test":"jest","rollup":"rollup -c"},"repository":{"type":"git","url":"git+https://github.com/amyblankenship/react-use-reducer-gateway.git"},"keywords":["react","hooks","useReducer"],"author":{"name":"Amy Blankenship"},"license":"MIT","bugs":{"url":"https://github.com/AmyBlankenship/react-use-reducer-gateway/issues"},"homepage":"https://github.com/AmyBlankenship/react-use-reducer-gateway#readme","devDependencies":{"@rollup/plugin-commonjs":"^25.0.7","@rollup/plugin-node-resolve":"^15.2.3","@rollup/plugin-typescript":"^11.1.5","@testing-library/react":"^14.1.0","@types/jest":"^29.5.8","@types/react":"^18.2.37","babel-jest":"^29.7.0","jest":"^29.7.0","jest-environment-jsdom":"^29.7.0","jsdom":"^22.1.0","rollup":"^4.5.0","rollup-plugin-dts":"^6.1.0","ts-jest":"^29.1.1","tslib":"^2.6.2","typescript":"^5.2.2"},"peerDependencies":{"react":"^18.2.0","react-dom":"^18.2.0"},"module":"dist/esm/index.js","types":"dist/index.d.ts","_id":"@amy_blankenship/react-use-reducer-gateway@0.0.6","gitHead":"0aabb5fc29e5a9b646be48683663fc723eb77ed8","_nodeVersion":"20.9.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-rUXlmAcqyLktXMH33snMW5FMikutl3L1xNauK2tIIm5fx3jKRmz3fBZPkPR2/9BtR34xmsFzzmTindJrk/oLng==","shasum":"6fb521a8551966ba15bb85ab46d3faba30c53b34","tarball":"https://registry.npmjs.org/@amy_blankenship/react-use-reducer-gateway/-/react-use-reducer-gateway-0.0.6.tgz","fileCount":24,"unpackedSize":609472,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFyB3H3d4iG0X064lDiyxs9Aovm8gJxHViqWr6vvAw13AiASa2PUwe3N8Qcccqn0iShSXKdb/HSm54SNuORHijb0TA=="}]},"_npmUser":{"name":"amy_blankenship","email":"amy@iso-200.com"},"directories":{},"maintainers":[{"name":"amy_blankenship","email":"amy@iso-200.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-use-reducer-gateway_0.0.6_1700535179873_0.9311224293952856"},"_hasShrinkwrap":false},"0.0.8":{"name":"@amy_blankenship/react-use-reducer-gateway","version":"0.0.8","description":"\"Gateway drug\" for developers hesitant to use React's useReducer. Covers 80% of cases, getting you hooked so you can take on the other 20% when you're ready.","publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"},"private":false,"main":"dist/cjs/index.js","scripts":{"test":"jest","rollup":"rollup -c"},"repository":{"type":"git","url":"git+https://github.com/amyblankenship/react-use-reducer-gateway.git"},"keywords":["react","hooks","useReducer"],"author":{"name":"Amy Blankenship"},"license":"MIT","bugs":{"url":"https://github.com/AmyBlankenship/react-use-reducer-gateway/issues"},"homepage":"https://github.com/AmyBlankenship/react-use-reducer-gateway#readme","devDependencies":{"@rollup/plugin-commonjs":"^25.0.7","@rollup/plugin-node-resolve":"^15.2.3","@rollup/plugin-typescript":"^11.1.5","@testing-library/react":"^14.1.0","@types/jest":"^29.5.8","@types/react":"^18.2.37","babel-jest":"^29.7.0","jest":"^29.7.0","jest-environment-jsdom":"^29.7.0","jsdom":"^22.1.0","react":"^18.2.0","react-dom":"^18.2.0","rollup":"^4.5.0","rollup-plugin-dts":"^6.1.0","rollup-plugin-peer-deps-external":"^2.2.4","ts-jest":"^29.1.1","tslib":"^2.6.2","typescript":"^5.2.2"},"peerDependencies":{"react":"^18.2.0","react-dom":"^18.2.0"},"module":"dist/esm/index.js","types":"dist/index.d.ts","_id":"@amy_blankenship/react-use-reducer-gateway@0.0.8","gitHead":"1fd25426769d8d6f701498c30829e9ceca3fd666","_nodeVersion":"20.9.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-er6v9+xejpRUNF6f/9rRwJeuIUX8aypb12vFk30ulm/0BxfvqrNjmPUS/hJ1w06XJ74qKxFXQ093LvQXbc207A==","shasum":"7f02d51be9d7470dc21f30e548706f847472495d","tarball":"https://registry.npmjs.org/@amy_blankenship/react-use-reducer-gateway/-/react-use-reducer-gateway-0.0.8.tgz","fileCount":24,"unpackedSize":68658,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEPiQ2B/l/7r7FHCTJkvpBqKDWte1OmjGE671uK/cNY7AiAs2LW1FA9Iz02T7gzQpR67pkZcm9ut2b26EKytsUK49g=="}]},"_npmUser":{"name":"amy_blankenship","email":"amy@iso-200.com"},"directories":{},"maintainers":[{"name":"amy_blankenship","email":"amy@iso-200.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-use-reducer-gateway_0.0.8_1700788026532_0.21565856534847927"},"_hasShrinkwrap":false},"0.1.0":{"name":"@amy_blankenship/react-use-reducer-gateway","version":"0.1.0","description":"\"Gateway drug\" for developers hesitant to use React's useReducer. Covers 80% of cases, getting you hooked so you can take on the other 20% when you're ready.","publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"},"private":false,"main":"dist/cjs/index.js","scripts":{"test":"jest","rollup":"rollup -c"},"repository":{"type":"git","url":"git+https://github.com/amyblankenship/react-use-reducer-gateway.git"},"keywords":["react","hooks","useReducer"],"author":{"name":"Amy Blankenship"},"license":"MIT","bugs":{"url":"https://github.com/AmyBlankenship/react-use-reducer-gateway/issues"},"homepage":"https://github.com/AmyBlankenship/react-use-reducer-gateway#readme","devDependencies":{"@rollup/plugin-commonjs":"^25.0.7","@rollup/plugin-node-resolve":"^15.2.3","@rollup/plugin-typescript":"^11.1.5","@testing-library/react":"^14.1.0","@types/jest":"^29.5.8","@types/react":"^18.2.37","babel-jest":"^29.7.0","jest":"^29.7.0","jest-environment-jsdom":"^29.7.0","jsdom":"^22.1.0","react":"^18.2.0","react-dom":"^18.2.0","rollup":"^4.5.0","rollup-plugin-dts":"^6.1.0","rollup-plugin-peer-deps-external":"^2.2.4","ts-jest":"^29.1.1","tslib":"^2.6.2","typescript":"^5.2.2"},"peerDependencies":{"react":"^18.2.0","react-dom":"^18.2.0"},"module":"dist/esm/index.js","types":"dist/index.d.ts","_id":"@amy_blankenship/react-use-reducer-gateway@0.1.0","gitHead":"aa4dac6bd2a2101c25f7cd9d8466d1e178bebcd8","_nodeVersion":"20.9.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-ImPh5P8oYGorgsB1lMFvRA1WFXF3cGY0JcYZ+SHEWmU8Iv06e60oW09sJvEK2eIkY4lGC6Mg2eUnIl+bux+kEw==","shasum":"b49ede702fd10755edd363179b00ac9e8c84cb88","tarball":"https://registry.npmjs.org/@amy_blankenship/react-use-reducer-gateway/-/react-use-reducer-gateway-0.1.0.tgz","fileCount":24,"unpackedSize":72504,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE8z2uDQU/EaQAjMAIjqUjH6nVGje0WDE9Pu04APjtgDAiAP6HiW4Gm3VOh1JOGJBzxT2/ag4S8UVtJ3D56J4ph+Sg=="}]},"_npmUser":{"name":"amy_blankenship","email":"amy@iso-200.com"},"directories":{},"maintainers":[{"name":"amy_blankenship","email":"amy@iso-200.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-use-reducer-gateway_0.1.0_1701053171957_0.36873248835268413"},"_hasShrinkwrap":false}},"time":{"created":"2023-11-21T02:52:59.792Z","0.0.6":"2023-11-21T02:53:00.049Z","modified":"2023-11-27T02:46:12.318Z","0.0.8":"2023-11-24T01:07:06.708Z","0.1.0":"2023-11-27T02:46:12.159Z"},"maintainers":[{"name":"amy_blankenship","email":"amy@iso-200.com"}],"description":"\"Gateway drug\" for developers hesitant to use React's useReducer. Covers 80% of cases, getting you hooked so you can take on the other 20% when you're ready.","homepage":"https://github.com/AmyBlankenship/react-use-reducer-gateway#readme","keywords":["react","hooks","useReducer"],"repository":{"type":"git","url":"git+https://github.com/amyblankenship/react-use-reducer-gateway.git"},"author":{"name":"Amy Blankenship"},"bugs":{"url":"https://github.com/AmyBlankenship/react-use-reducer-gateway/issues"},"license":"MIT","readme":"# react-use-reducer-gateway\r\n\r\n\"Gateway drug\" for developers hesitant to use React's useReducer. Covers 80% of cases, getting you hooked so you can\r\ntake on the other 20% when you're ready. `useReducerGateway` handles the Typescript typing around editing a complex\r\nobject, and provides some handy utilities to reduce the amount of code you need to write (no pun intended). Many of the\r\ncomponents used in the hook are also exposed so that you can use them to produce your own solutions.\r\n\r\n**Install:**\r\n\r\n```\r\nnpm install @amy_blankenship/react-use-reducer-gateway\r\n```\r\n\r\n**Example:**\r\n\r\n[Repo](https://github.com/AmyBlankenship/react-use-reducer-gateway-example) | [Codesandbox](https://codesandbox.io/p/devbox/github/AmyBlankenship/react-use-reducer-gateway-example/tree/main)\r\n\r\n**Basic usage**\r\n\r\n```\r\nconst {\r\n    value,\r\n    isChanged,\r\n    getInputHandlerFor,\r\n    initialize,\r\n    update\r\n} = useReducerGateway<YourObjectType>(yourObject)\r\n```\r\n\r\nIn many cases, you don't have to supply the type of your object,\r\nas it will be inferred from usage. However, if you want to have \r\nTypescript help you prevent editing some properties such as database\r\nids, you can provide a type that omits these properties. Note that\r\nthe properties will still exist on the object and you can still edit \r\nthem if you can get your code to compile, but Typescript will give you\r\nan error reminding you not to try.\r\n\r\n**Returns:**\r\n\r\n| Property           | Type                                                                                 | Description                                                                        |\r\n|--------------------|--------------------------------------------------------------------------------------|------------------------------------------------------------------------------------|\r\n| value              | inferred/provided                                                                    | object being edited                                                                |\r\n| isChanged          | boolean                                                                              | true if object has ben updated since it was initialized                            |\r\n| getInputHandlerFor | (propertyName: YourObjectType) => (e: ChangeEvent<HTMLInputElement>) => void         | gets a function that can be usedto handle a change event on a text or number input |\r\n| initialize         | (value: YourObjectType) => void                                                      | sets the managed value to the new value and resets isChanged                       |\r\n| update             | (propertyName: keyof YourObjectType, newValue: YourObjectType[propertyName]) => void | updates the named property on the object to the new value                          |  \r\n\r\nIf you provide a new object to `useReducerGateway`, it will initialize itself to the new value, setting `isChanged` \r\nto false in the process.\r\n\r\n`getInputHanderFor` is designed to provide change handlers for the two most common cases: \r\na `text` input control and a `number` input control. Calling `getInputHandlerFor('someProp')` will return a function with\r\na stable reference that will update that property from an input control, reducing the need to manually write `useCallback` handlers.\r\nIt will attempt to use `value` for string properties and `valueAsNumber` for numeric properties.\r\n\r\nUse the `update` method, with or without `useCallback`, for values of other types or if you're\r\nnot using HTMLInputElements.\r\n\r\n**Exposed Utilities**\r\n\r\n`createUpdateAction<T>(fieldName: keyof T, newVal: T[fieldName])` : creates an action with the following signature:\r\n```\r\n{\r\n    type: `update_${fieldName}`,\r\n    payload: T[fieldName]\r\n}\r\n```\r\n\r\n`genericReducer`: `<S extends AnyObject>(state: S, action: UpdateActions<S> | InitializeAction<S>) => S & { isChanged: boolean}`\r\nA generic reducer that takes update actions with the signature createAction creates or an initialize action, and returns an\r\nobject of the provided type that also has an `isChanged` property for tracking if it has been edited or not.\r\n","readmeFilename":"README.md"}