{"id":20061659,"url":"https://github.com/tylerrick/react-value-adapter","last_synced_at":"2025-10-24T11:07:50.812Z","repository":{"id":39297376,"uuid":"226272687","full_name":"TylerRick/react-value-adapter","owner":"TylerRick","description":"Map/adapt a component's value/onChange props using a Map or function","archived":false,"fork":false,"pushed_at":"2023-01-05T02:26:08.000Z","size":3975,"stargazers_count":0,"open_issues_count":25,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-09-15T12:23:40.705Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/TylerRick.png","metadata":{"files":{"readme":"Readme.md","changelog":null,"contributing":null,"funding":null,"license":"License","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-12-06T07:38:30.000Z","updated_at":"2019-12-06T07:39:52.000Z","dependencies_parsed_at":"2023-02-03T06:00:14.399Z","dependency_job_id":null,"html_url":"https://github.com/TylerRick/react-value-adapter","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/TylerRick/react-value-adapter","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TylerRick%2Freact-value-adapter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TylerRick%2Freact-value-adapter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TylerRick%2Freact-value-adapter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TylerRick%2Freact-value-adapter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/TylerRick","download_url":"https://codeload.github.com/TylerRick/react-value-adapter/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TylerRick%2Freact-value-adapter/sbom","scorecard":{"id":144798,"data":{"date":"2025-08-11","repo":{"name":"github.com/TylerRick/react-value-adapter","commit":"0172597f0cf0177fe84455e44bcb59492366b780"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":1.7,"checks":[{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"Code-Review","score":0,"reason":"Found 0/1 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"SAST","score":0,"reason":"no SAST tool detected","details":["Warn: no pull requests merged into dev branch"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: License:0","Info: FSF or OSI recognized license: MIT License: License:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Vulnerabilities","score":0,"reason":"111 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8","Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92","Warn: Project is vulnerable to: GHSA-6chw-6frg-f759","Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw","Warn: Project is vulnerable to: GHSA-whgm-jr23-g3j9","Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw","Warn: Project is vulnerable to: GHSA-fwr7-v2mv-hh25","Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw","Warn: Project is vulnerable to: GHSA-w8qv-6jwh-64r5","Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x","Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275","Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c","Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq","Warn: Project is vulnerable to: GHSA-3wcq-x3mq-6r9p","Warn: Project is vulnerable to: GHSA-vh7m-p724-62c2","Warn: Project is vulnerable to: GHSA-r9p9-mrjm-926w","Warn: Project is vulnerable to: GHSA-434g-2637-qmqr","Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m","Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw","Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p","Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747","Warn: Project is vulnerable to: GHSA-vjh7-7g9h-fjfh","Warn: Project is vulnerable to: GHSA-6h5x-7c5m-7cr7","Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc","Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx","Warn: Project is vulnerable to: GHSA-74fj-2j2h-c42q","Warn: Project is vulnerable to: GHSA-pw2r-vq6v-hr8c","Warn: Project is vulnerable to: GHSA-jchw-25xp-jwwc","Warn: Project is vulnerable to: GHSA-cxjh-pqwp-8mfp","Warn: Project is vulnerable to: GHSA-fjxv-7rqg-78g4","Warn: Project is vulnerable to: GHSA-8r6j-v8pm-fqw3","Warn: Project is vulnerable to: MAL-2023-462","Warn: Project is vulnerable to: GHSA-ww39-953v-wcq6","Warn: Project is vulnerable to: GHSA-765h-qjxv-5f44","Warn: Project is vulnerable to: GHSA-f2jv-r9rf-7988","Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj","Warn: Project is vulnerable to: GHSA-pfq8-rq6v-vf5m","Warn: Project is vulnerable to: GHSA-6x33-pw7p-hmpq","Warn: Project is vulnerable to: GHSA-c7qv-q95q-8v27","Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37","Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22","Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp","Warn: Project is vulnerable to: GHSA-896r-f27r-55mw","Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h","Warn: Project is vulnerable to: GHSA-6c8f-qphg-qjgp","Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq","Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488","Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g","Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw","Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9","Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3","Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m","Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h","Warn: Project is vulnerable to: GHSA-92xj-mqp7-vmcj","Warn: Project is vulnerable to: GHSA-wxgw-qj99-44c2","Warn: Project is vulnerable to: GHSA-5rrq-pxf6-6jx5","Warn: Project is vulnerable to: GHSA-8fr3-hfg3-gpgp","Warn: Project is vulnerable to: GHSA-gf8q-jrpm-jvxq","Warn: Project is vulnerable to: GHSA-2r2c-g63r-vccr","Warn: Project is vulnerable to: GHSA-cfm4-qjh2-4765","Warn: Project is vulnerable to: GHSA-x4jg-mjrx-434g","Warn: Project is vulnerable to: GHSA-5fw9-fq32-wv5p","Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr","Warn: Project is vulnerable to: GHSA-76c9-3jph-rj3q","Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9","Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j","Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w","Warn: Project is vulnerable to: GHSA-h7cp-r72f-jxh6","Warn: Project is vulnerable to: GHSA-v62p-rq8g-8h59","Warn: Project is vulnerable to: GHSA-566m-qj78-rww5","Warn: Project is vulnerable to: GHSA-hwj9-h5mp-3pm3","Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j","Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp","Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw","Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg","Warn: Project is vulnerable to: GHSA-h9rv-jmmf-4pgx","Warn: Project is vulnerable to: GHSA-hxcc-f52p-wc94","Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p","Warn: Project is vulnerable to: GHSA-c9g6-9335-x697","Warn: Project is vulnerable to: GHSA-vx3p-948g-6vhq","Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9","Warn: Project is vulnerable to: GHSA-r628-mhmh-qjhw","Warn: Project is vulnerable to: GHSA-9r2w-394v-53qc","Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh","Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p","Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36","Warn: Project is vulnerable to: GHSA-4wf5-vphf-c2xc","Warn: Project is vulnerable to: GHSA-52f5-9888-hmc6","Warn: Project is vulnerable to: GHSA-jgrx-mgxx-jf9v","Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3","Warn: Project is vulnerable to: GHSA-9m6j-fcg5-2442","Warn: Project is vulnerable to: GHSA-hh27-ffr2-f2jc","Warn: Project is vulnerable to: GHSA-rqff-837h-mm52","Warn: Project is vulnerable to: GHSA-8v38-pw62-9cw2","Warn: Project is vulnerable to: GHSA-hgjh-723h-mx2j","Warn: Project is vulnerable to: GHSA-jf5r-8hm2-f872","Warn: Project is vulnerable to: GHSA-wr3j-pwj9-hqq6","Warn: Project is vulnerable to: GHSA-4v9v-hfq4-rm2v","Warn: Project is vulnerable to: GHSA-9jgg-88mc-972h","Warn: Project is vulnerable to: GHSA-g78m-2chm-r7qv","Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7","Warn: Project is vulnerable to: GHSA-6fc8-4gx4-v693","Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q","Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh","Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-16T09:10:39.830Z","repository_id":39297376,"created_at":"2025-08-16T09:10:39.831Z","updated_at":"2025-08-16T09:10:39.831Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":280783897,"owners_count":26390288,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-24T02:00:06.418Z","response_time":73,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-13T13:21:25.383Z","updated_at":"2025-10-24T11:07:50.782Z","avatar_url":"https://github.com/TylerRick.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-value-adapter\n\n[![npm version](https://badge.fury.io/js/react-value-adapter.svg)](https://badge.fury.io/js/react-value-adapter)\n\nMap/adapt a component's `value`/`onChange` props using a Map or function.\n\n# Getting started\n\n```\nyarn add react-value-adapter\n```\n\n# Usage\n\n## [Tri-state checkbox](https://www.npmjs.com/package/mui-tri-state-checkbox)\n\nLet's say you have a tri-state enum field in your database, whose values can be one of 'never', 'sometimes', or 'always'.\n\nBut your [tri-state checkbox](https://www.npmjs.com/package/mui-tri-state-checkbox) requires its value prop to be one of `false`, `null`, or `true`, respectively.\n\nSo you have to convert between the value from your database and the value required by your child component.\n\nYou would use a mapping like this:\n- `\"never\"` maps to `false`\n- `\"sometimes\"` maps to `null`\n- `\"always\"` maps to `true`\n\nSure, you could write your own conversion logic in the parent component. But keep in mind that you not only have to map *from* the parent value, you also have to take the value provided to the child component's onChange handler and map it *back to* a parent value.\n\n`react-value-adapter` encapsulates that concern, providing an adapter\ncomponent that maps between the values required by one component and those\nrequired by the other component (both directions).\n\nYou tell it what mapping to use, and how to extract the `value` out of the `onChange` handler, and it handles the rest:\n\nExample:\n```js\nconst onChangeAdapterTriStateCheckbox = (onChangeFromParent, parentToChildValues) =\u003e (\n  (event, checked) =\u003e {\n    if (!onChangeFromParent) return\n    const parentValue = parentToChildValues.get(checked)\n    onChangeFromParent(parentValue, checked)\n  }\n)\n\nconst parentToChildValues = new Map([\n  ['never',     false],\n  ['sometimes', null],\n  ['always',    true],\n])\n```\n```jsx\n        \u003cAdaptValue\n          // How to extract the value out of the onChange handler\n          onChangeAdapter={onChangeAdapterTriStateCheckbox}\n          // What mapping to use\n          parentToChildValues={parentToChildValues}\n\n          // The props that you would like to be able to just pass to your child\n          // component\n          childValueProp='checked'\n          value={parentValue}\n          onChange={(parentValue, childValue) =\u003e {\n            setChildValue(childValue)\n            setParentValue(parentValue)\n          }}\n        \u003e\n          {({checked, onChange}) =\u003e (\u003c\u003e\n            \u003cMuiTriStateCheckbox\n              value=\"value\"\n              checked={checked}\n              onChange={onChange}\n            /\u003e\n          \u003c/\u003e)}\n        \u003c/AdaptValue\u003e\n```\n\nAt this point you're probably thinking that seems a bit verbose for what it's trying to do. Couldn't we extract things further to make this even simpler and cleaner?\n\nAnd the answer is yes, of course we can. This child-as-a-function option is\nthe most flexible approach, but it tends to be kind of verbose. Read on for\nsome other options...\n\n## Extracting an adapter component using higher-order component / currying\n\nWhat if we could create a new component *based* on another component, and it would automatically convert between values of one type (the values our parent component provides) and the values our child component expects?\n\nThen we could easily reuse it anywhere in our app without having to pass all the adapter configuration around each time we used it (like we would if we were using `\u003cAdaptValue\u003e` directly).\n\nHow about something like this?\n```js\nexport const MuiTriStateCheckbox_MappedValues = withAdaptValue(MuiTriStateCheckbox, {\n    parentValueProp: 'value',\n    childValueProp: 'checked',\n    onChangeAdapter,\n  }\n)\n```\nor even:\n```js\nexport const AlwaysSometimesNever_MuiTriStateCheckbox = withAdaptValue(MuiTriStateCheckbox, {\n    parentValueProp: 'value',\n    childValueProp: 'checked',\n    onChangeAdapter,\n    parentToChildValues: parentToChildValues\n  }\n)\n```\n\nThis example says \"I want a component that is the `MuiTriStateCheckbox` except that it accepts a `value` and translates it to a `checked` prop that gets passed to the underlying `MuiTriStateCheckbox`. It extracts the value from the onChange handler thusly.\"\n\nThe `withAdaptValue` [higher-order component](https://reactjs.org/docs/higher-order-components.html) returns an adapted component according to the configuration given.\n\nIt can then be used like a stand-in for the original `MuiTriStateCheckbox`:\n\n```jsx\n        \u003cAlwaysSometimesNever_MuiTriStateCheckbox\n          value={map_parentValue}\n          onChange={(parentValue, checked) =\u003e { setParentValue(parentValue); setChecked(checked) } }\n        /\u003e\n```\n\n... with the values transparently being converted between your \"parent value\" domain and the \"child value\" domain, and the name of the value prop translated as you specified, all in the background. You wouldn't even have to notice or care that that's what it's doing for you.\n\n# Other examples\n\n## Checkbox\n\nLet's say you have a checkbox and you want to map a 'yes' value to checked={true} in the checkbox.\n\n(To do: simplify and explain)\n\n```jsx\n        \u003cAdaptValue\n          onChangeAdapter={onChangeAdapterUsingMapFromChecked}\n          parentToChildValues={check_parentToChildValues}\n          childValueProp={'checked'}\n          value={check_parentValue}\n          onChange={(parentValue, childValue) =\u003e {\n            check_setChildValue(childValue)\n            check_setParentValue(parentValue)\n          }}\n        \u003e\n          {({parentValue, childValue, onChange}) =\u003e (\u003c\u003e\n            \u003clabel\u003e\n              \u003cinput type=\"checkbox\" name=\"check_demo\"\n                checked={childValue}\n                onChange={onChange}\n              /\u003e\n              Checkbox\n            \u003c/label\u003e\n            (parentValue: {JSON.stringify(parentValue)}, childValue: {JSON.stringify(childValue)})\n          \u003c/\u003e)}\n        \u003c/AdaptValue\u003e\n```\n\n\n## Other examples\nSee the demo (`yarn start`) for more examples.\n\n\n## Use composition: create your own wrapper components\n\nTo avoid duplication, you can wrap `\u003cAdaptValue\u003e` in your own wrapper component:\n\n```js\nfunction Rot13ValueAdapter(props) {\n  return (\n    \u003cAdaptValue\n      parentToChildValue={rot13}\n      onChangeAdapter={onChangeForParent =\u003e ({ target: { value } }) =\u003e onChangeForParent(rot13(value), value)}\n      {...props}\n    /\u003e\n  )\n}\n\n        \u003cRot13ValueAdapter\n          onChange={(parentValue, value) =\u003e { setParentValue(parentValue) }}\n          value={text_parentValue}\n        \u003e\n          {({childValue, onChange}) =\u003e (\u003c\u003e\n            \u003cinput type=\"text\"\n              value={childValue}\n              onChange={onChange}\n            /\u003e\n          \u003c/\u003e)}\n        \u003c/Rot13ValueAdapter\u003e\n```\n\n...\n\nIf you need even more control, you can use the provided `useAdaptValue` hook.\n\n\n\n# API reference\n(Coming soon!)\n\n## Value adapters\n\n```\nuseAdaptValue\n\u003cAdaptValue\u003e\n\u003cAdaptValue_\u003e\n\n```\n\n## HiddenInput\n\n```\nwithHiddenInput\n```\n\n## StateWrapper\n\n```\n      \u003cStateWrapper defaultValue=\"text\"\u003e\n        {({onChange, ...props}) =\u003e (\n          \u003cinput type=\"text\" {...props} onChange={({target: {value}}) =\u003e onChange(value)} /\u003e\n        )}\n      \u003c/StateWrapper\u003e\n```\n\n\n# Frequently anticipated questions\n\n## Why is a `Map` used for the mapping instead of a regular object literal?\n\nBecause object literals only support string keys and we want to be able to\nmap between any object and any object. That is exactly what a [Map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) gives us.\n\n## Should I use `AdaptValue` or `AdaptValue_`?\n\nYou should probably use `AdaptValue`.\n`AdaptValue_` is an [injector\ncomponent](https://medium.com/@kylpo/a-naming-convention-for-injector-components-c421a07debe5) and\nprovides a more concise syntax. That is its main advantage. Its disadvantages are:\n\n1. It is inflexibile. You can't, for example, wrap multiple elements.\n2. It is harder to understand\n3. Since it uses `React.cloneElement`, it adds no new components/elements to the tree, so if you\n   inspect it in the React Components dev tool, you may be surprised to see `AdaptValue_` listed in\n   the tree — without any children. Your child component won't be listed because this component\n   takes its place.\n\n`AdaptValue` uses the \"children as function\" pattern, which means you have to provide a children prop\nthat is a function. That function, when called, can return any elements, it is more flexible than\nthe injector component pattern.\n\nThe `AdaptValue` option is also more explicit: You can see exactly which values are yielded to your\nchildren, and you are responsible for connecting those values to your child element(s), which makes\nit easier to follow the flow of data and understand what it is doing.\n\n# Contributing\n\nPull requests welcome!\n\n# To do\n\nSee [to-do](/ToDo.md) list or list of open issues.\n\n# License\n\nThis project is free software, licensed under the terms of the [MIT license](/License).\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftylerrick%2Freact-value-adapter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftylerrick%2Freact-value-adapter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftylerrick%2Freact-value-adapter/lists"}