{"_id":"@archer-oss/dependency-checker-react","_rev":"1-b8e4affbed213a0a556068b2deb33f9b","name":"@archer-oss/dependency-checker-react","dist-tags":{"latest":"1.3.3"},"versions":{"1.3.3":{"name":"@archer-oss/dependency-checker-react","version":"1.3.3","description":"A React Context Provider for state management that's powered by a dependency checker","main":"dist/index.cjs.js","module":"dist/index.esm.js","typings":"dist/types/dependency-checker.context.d.ts","repository":{"type":"git","url":"git+ssh://git@gitlab.com/archer-oss/form-builder/dependency-checker-react.git"},"publishConfig":{"registry":"https://registry.npmjs.org/","tag":"latest","access":"public"},"author":{"name":"Sai Hari"},"license":"MIT","scripts":{"build":"npm-run-all --parallel build:app build:types","build:app":"rollup -c","build:types":"tsc -p tsconfig.build.json","format:files":"prettier --ignore-path .gitignore .","format:check":"npm run format:files -- --check","format":"npm run format:files -- --write","lint":"eslint .","test":"jest","typecheck":"tsc --noEmit --emitDeclarationOnly false","validate":"npm-run-all --parallel format:check lint test typecheck"},"peerDependencies":{"@types/react":">=16.x","@types/react-dom":">=16.x","react":">=16.x","react-dom":">=16.x"},"dependencies":{"@archer-oss/dependency-checker-core":"^1.1.2","@babel/runtime":"^7.15.4","use-effect-reducer":"^0.7.0"},"devDependencies":{"@archer-oss/dev-scripts":"^1.2.0","@types/react":"^17.0.3","@types/react-dom":"^17.0.3","jest":"^27.3.0","lodash.isequal":"^4.5.0","react":"^17.0.2","react-dom":"^17.0.2","typescript":"^4.4.4","prettier":"2.6.2","@testing-library/react":"^12.0.0","@testing-library/react-hooks":"^8.0.0"},"gitHead":"141efd67ffcb5ce8676e8ea35d8d4aaebc6594a8","bugs":{"url":"https://gitlab.com/archer-oss/form-builder/dependency-checker-react/issues"},"homepage":"https://gitlab.com/archer-oss/form-builder/dependency-checker-react#readme","_id":"@archer-oss/dependency-checker-react@1.3.3","_nodeVersion":"17.9.0","_npmVersion":"7.24.2","dist":{"integrity":"sha512-2LV5JCOI1TyD/4yuFIbxsjq9fJShXJ2S/HN5CKtGZFvhh72j3kfcmvi4uiQhsFmA0mCrvZYeBMahVCeCLOr/cQ==","shasum":"2e27287d99ad467f3340ee96ba38728e3c16cc17","tarball":"https://registry.npmjs.org/@archer-oss/dependency-checker-react/-/dependency-checker-react-1.3.3.tgz","fileCount":15,"unpackedSize":283018,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDtTqXeR2vfwI7Qq+Ehxg2s97a8VXIYcbShv3+MtPEcyAiBpuh3lIgqmTucwtYMaRO3ui9tTGfzwSg9TdR9PIs7UfA=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiXalaACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmphVA//SrGeOyqkEwzeNGEwB47TsC5oZaKJ7QYet49HFZKWbBWKqNag\r\nsutKkwJ3Elikd5c4IQNgOsmZCznXlnSPu2fDBiU+Xt7MfOiTagWohR4b60Ym\r\nuWuYnR4+szK3JtymU44kjDuHwieN7xTId8SkyQ3SX2qmm9jdt4h1gmjn+Qho\r\njHG5tn51zMdsv6CYj90R4VyWeRzab933MmM6g9ZlQVpxqLBMgpLP+fWFEKit\r\n9jqe7s1UwrmagYKYt/dWmldnPFGTiBDXYwWv+cZg7tV1NwLZ8gSo6nmInleu\r\nTgSb6nz6vHt/oy8fiF5HOz5O6UPSR7xB5TwY+latRZhKkMsWqDyDycsWflPm\r\nXKqcVZOSgcqmF3cVuYhN5bdBMFDd04lus1vlMTU42OoDGzal0iqXHZfb2DhU\r\njoyf4wOPpD7gvenS91mc7YdnpgvHveRmmrklwbcbBnAsd3/ib9U2gjJYwgzX\r\nKhNzgvMAyGixVkdrou3c1ORd6lL9vDSIT327EILx7LWQpt1vHCNiYtEXd8Sh\r\nlSit5itBjFR47nh6asdhQaaIZmDXSlti4UFh9rVXLSna4VeCNjcEt3S9FOs4\r\ndx+UF/8C+hyKpTtu1Jdn2lKDGhw6HMhWg02WkgNGrIBrrS57ajE9i3oDmRM0\r\nZGdCYb5qEaq9YvabpdWOCuaBeDZLXXKt/7c=\r\n=jrWL\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"barkerd427","email":"barkerd427@gmail.com"},"directories":{},"maintainers":[{"name":"sai.hari","email":"sai.hari@archerirm.com"},{"name":"barkerd427","email":"barkerd427@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/dependency-checker-react_1.3.3_1650305370162_0.2108095713014091"},"_hasShrinkwrap":false}},"time":{"created":"2022-04-18T18:09:30.085Z","1.3.3":"2022-04-18T18:09:30.294Z","modified":"2022-04-19T15:05:15.107Z"},"maintainers":[{"email":"ryandoll@gmail.com","name":"ryandoll"},{"email":"sai.hari@archerirm.com","name":"sai.hari"},{"email":"barkerd427@gmail.com","name":"barkerd427"}],"description":"A React Context Provider for state management that's powered by a dependency checker","homepage":"https://gitlab.com/archer-oss/form-builder/dependency-checker-react#readme","repository":{"type":"git","url":"git+ssh://git@gitlab.com/archer-oss/form-builder/dependency-checker-react.git"},"author":{"name":"Sai Hari"},"bugs":{"url":"https://gitlab.com/archer-oss/form-builder/dependency-checker-react/issues"},"license":"MIT","readme":"# dependency-checker-react\n\nA React Context Provider for state management that's powered by a dependency checker. The context provider takes `data`, `metaData` and `dependencies` to allow for state and state relationships to be modeled declaratively.\n\n## Props\n\n### onChange (optional)\n\n```ts\nonChange: (\n    data: DataCollection,\n    metaData: MetaDataCollection,\n    details: { type: 'key-update'; key: string } | { type: 'dependency-calculation'; keys: string[] },\n  ) => void;\n```\n\nAn event handler which is triggered anytime the internal data is updated, either by explicit data updates or through data updates which are triggered through dependency calculations.\n\n### onGetSnapshot (optional)\n\n```ts\nonGetSnapshot: (data: DataCollection, metaData: MetaDataCollection) => void;\n```\n\nAn event handler which can be manually triggered at anytime by using the `generateSnapshot` action handler with the Dependency Checker dispatcher.\n\n```tsx\nimport { generateSnapshot, useDependencyCheckerDispatch } from 'dependency-checker-react';\n\n// Rendered inside the provider\nfunction MyComponent() {\n  const dispatch = useDependencyCheckerDispatch();\n\n  // Clicking this will fire the `onGetSnapshot` callback\n  // which was passed to the wrapping provider component.\n  return <button onClick={() => generateSnapshot(dispatch)}>Click Me</button>;\n}\n```\n\n### data\n\nA collection of key value pairs where the key is the unique identifier for subscriptions and dependencies. The value is an object containing any properties.\n\n```ts\ntype Data = Record<string, any>;\ntype DataCollection = Record<string, Data>;\n\nconst data: DataCollection = {\n  'key-one': { someProperty: 'some value' },\n  'key-two': { someOtherProperty: 'some other value' },\n};\n```\n\n### metaData\n\nA collection of key value pairs where the key is the unique identifier for subscriptions and dependencies. The value is an object containing any properties.\n\n```ts\ntype MetaData = Record<string, any>;\ntype MetaDataCollection = Record<string, MetaData>;\n\nconst metaData: MetaDataCollection = {\n  'key-one': { someProperty: 'some value' },\n  'key-two': { someOtherProperty: 'some other value' },\n};\n```\n\n### dependencies (optional)\n\nA collection of key value pairs where the key is the unique identifier. The value is an array of dependency objects which are used for internal calculations. Each array of dependency objects are assigned to the unique identifier.\n\n```ts\ntype Dependency = {\n  // The key which its dependent on.\n  key: 'unique-identifier',\n  type: 'type used for typescript support',\n  // A condition which gets the data and metaData\n  // for the unique identifier (`key`) above and\n  // returns a boolean. If the condition is `true`\n  // apply the effects on top of the data.\n  cond: (data: Data, metaData: MetaData) => boolean,\n  effects: Data | ((data: Data, metaData: MetaData) => Data)\n};\n\ntype DependencyCollection: Record<string, Dependency[]>;\n\nconst dependencies: DependencyCollection = {\n  'key-one': [\n    {\n      // `key-one` is dependent on `key-two`\n      // (i.e. if `key-two` state changes then rerun this dependency for `key-one`)\n      key: 'key-two',\n      type: 'used for typescript support',\n      // data and metaData are for `key-two`\n      cond: (data, metaData) => data.someProperty === 'some value' || metaData.someOtherProperty === 'some other value',\n      // If the cond above is `true` then stack\n      // the effects object on top of the data for `key-one`.\n      // Effects always stack, which means an effect which targets\n      // the same property as another effect but comes later\n      // in the list will take priority. The underlying data\n      // is not affected. If the dependency is rerun at a later\n      // point and the cond is `false` then the effects are just\n      // removed from the stack and the underlying data is used.\n      // NOTE: `effects` can also just be an object (i.e. { someProperty: 'some other value' })\n      effects: (data, metaData) => {\n          return { someProperty: metaData.someOtherProperty };\n      }\n    }\n  ]\n};\n```\n\n### dependencyCheckerRate (optional)\n\nA number that determines how long the dependency checker should wait between state updates to recalculate dependencies. Internally the dependency checker operation is debounced. If no dependency checker rate is provided or the rate is set to `0` then the calculation will be synchronous (i.e. it will run after every state update).\n\n### resetConfig (optional)\n\n```ts\ntype ResetStateUpdater<State> = State | ((nextState: State, prevState: State) => State);\n\ntype ResetConfig = {\n  resetKeys?: {\n    data?: any[];\n    metaData?: any[];\n  };\n  resetStateRef?: React.MutableRefObject<\n    | {\n        resetData: (updater?: ResetStateUpdater<DataCollection>) => void;\n        resetMetaData: (updater?: ResetStateUpdater<MetaDataCollection>) => void;\n      }\n    | undefined\n  >;\n};\n```\n\nAn object containing a `resetKeys` and a `resetStateRef` property. Both properties can be used to control when the dependency checker resets its internal state.\n\n#### resetKeys\n\nAn object containing a `data` and `metaData` property which are both arrays containing any values. If the values in the array change between renders then that property will be updated internally. This behavior is similar to how a `React.useEffect` dependency array works.\n\n- If the `data` property is `undefined` that means that the data will be reset on every render.\n- If the `data` property is an empty array that means that the data will never be reset between renders.\n- If the data property is an array with the variable `someVariable` in it (i.e. `{ data: [someVariable] }`) then the data will be reset only if `someVariable` changes between renders.\n\n**Note:** This behavior is consistent for the `metaData` property as well.\n\n#### resetStateRef\n\nA standard `React.useRef` value which is modified using `React.useImperativeHandle` to provide utility functions which can be used to reset the data or metaData at any point. If the utility functions are invoked without any arguments then the state will be reset using the latest props that were passed into the provider.\n\n```tsx\nfunction MyComponent() {\n  const resetStateRef = React.useRef();\n  // Other props left out for the sake of brevity\n  const dependencyCheckerProps = { ... };\n\n  return (\n    <React.Fragment>\n      <DependencyCheckerProvider {...dependencyCheckerProps} resetConfig={{ resetStateRef }} />\n      <button\n        onClick={() => {\n          resetStateRef.current?.resetData({ newDataProperty: 'new value' });\n          resetStateRef.current?.resetMetaData({ newMetaDataProperty: 'new value' });\n\n          // Updater functions can be used as well.\n          // The next value is the latest data or metaData\n          // for a key which have been passed in as props.\n          // The prev value is the current data or metaData\n          // for a key which is stored in the provider's state.\n          resetStateRef.current?.resetData((nextData, prevData) => ({ ...prevData, newDataProperty: 'new value' }));\n          resetStateRef.current?.resetMetaData((nextMetaData, prevMetaData) => nextMetaData);\n        }}\n      >\n        Click Me\n      </button>\n    </React.Fragment>\n  );\n}\n```\n","readmeFilename":"README.md"}