{"_id":"@adamtyler/react-native-scrub","_rev":"1-6300d8564bdb7f352ccbb2a9652cb371","name":"@adamtyler/react-native-scrub","dist-tags":{"latest":"0.2.2"},"versions":{"0.2.2":{"version":"0.2.2","license":"MIT","main":"dist/index.js","typings":"dist/index.d.ts","scripts":{"start":"tsdx watch","dev":"tsdx watch --localDev","build":"tsdx build","test":"tsdx test","lint":"tsdx lint","prepare":"tsdx build"},"peerDependencies":{"react":">=16","react-native":">=0.60","react-native-camera":">=3","react-native-reanimated":">=1.4"},"husky":{"hooks":{"pre-commit":"tsdx lint"}},"prettier":{"printWidth":80,"semi":true,"singleQuote":true,"trailingComma":"es5"},"name":"@adamtyler/react-native-scrub","author":{"name":"Adam Tyler"},"module":"dist/react-native-scrub.esm.js","devDependencies":{"@types/jest":"^24.9.0","@types/lodash-es":"^4.17.3","@types/react":"16.9.17","@types/react-native":"0.60.26","husky":"^4.0.10","react":"16.12.0","react-native":"0.61.5","tsdx":"^0.12.3","tslib":"^1.10.0","typescript":"^3.7.4"},"dependencies":{"lodash-es":"^4.17.15","react-native-gesture-handler":"^1.5.3"},"description":"React Native Number Scrubber","directories":{"example":"example","test":"test"},"repository":{"type":"git","url":"git+https://github.com/AdamTyler/react-native-scrub.git"},"keywords":["react-native","scrubber","number","scrubber","dynamic"],"bugs":{"url":"https://github.com/AdamTyler/react-native-scrub/issues"},"homepage":"https://github.com/AdamTyler/react-native-scrub#readme","gitHead":"fa6e980e4bbe8bf14a70bd1dd8ef203b768f2e81","_id":"@adamtyler/react-native-scrub@0.2.2","_nodeVersion":"12.20.1","_npmVersion":"6.14.10","dist":{"integrity":"sha512-XvFwV8acIE4dd4GPLMBoom2/wmsX1lVl2QsYSE810oJjU69ekCkCkzh1u8piUysGkl1yU9rCGKVk3OQKqugmxw==","shasum":"1a26b5d8ee6f380b211ae22e4366bb272c796eb8","tarball":"https://registry.npmjs.org/@adamtyler/react-native-scrub/-/react-native-scrub-0.2.2.tgz","fileCount":13,"unpackedSize":70346,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhQiBMCRA9TVsSAnZWagAAyQAP/jLgvQ/4mMMr5fWgP4NN\naQMBgaXfwKAiqz9qPzV/WLivo/fQwhCoZdlvs31WvdT9MEgC6Eg+ZyAJxPQX\njukr9CwCEC3dscJrZswxmKJeeUoCGqOAycIGlAN1Eubj/AMN5aaHmk4V8Tlo\nW9xEP9cNz4hpPplt6LoWGMhvhGTuTFSi6VIHX3YwOD6ABmhlS1qV8zVa5kAr\nLjmrgbOUVQlFoM5M0wg4uA7RFSVFOICZUkk+VofRrC4lGkkdnnyf8ukPgBGM\n/kVfW/S7DjYThJCuWhdrXB3Ner5U1SwuSHkIEJ1LaTZdGPdyFMxUODiAq1w7\n11gpDTdac+dbBwvlIca/wXGPevR/a+Jo3Xqx8WYivinekfoFFOtsXZbqzl42\n4rZcuLn5Dt/uEku7pSHyGzQNWzQR4ksiN9SVRYUWWC2AemLXgzGuXdUAJjXa\nc2EXq9TEyTTOcMTdLPkbcY3oZm1VdcmezGjvuRvESDxC95V4RAyca2VRATtI\n0nlQaTOfyPmmBUXVN2Sr08CSoavqs0+wlMOXpxqZpu/CoSBwJHgXne5xj7kP\n+kNHgbK7zCuFWzTHfJW0d+YWYTupUrH/P0afZl3UVHnvn3WR/31nVOR9FSTQ\nz651L4s7PBtKt/opC0ZqAUrZPkI8lFakiUf6r16/G2bpXOGrfOvzmFpYxU3Y\nqNWD\r\n=SO1j\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCRNjiQBuYUXqhakf2DIF3NEZvhuQAeRf3pw9TOuT+j/gIhAJP8K713D5/DlHnazWfB85MGHpZ5xKVES8wktLuoc28S"}]},"_npmUser":{"name":"adamtyler","email":"adam.tyler@utexas.edu"},"maintainers":[{"name":"adamtyler","email":"adam.tyler@utexas.edu"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-native-scrub_0.2.2_1631723596847_0.16087778550616494"},"_hasShrinkwrap":false}},"time":{"created":"2021-09-15T16:33:16.812Z","0.2.2":"2021-09-15T16:33:16.987Z","modified":"2022-04-04T11:25:41.400Z"},"maintainers":[{"name":"adamtyler","email":"adam.tyler@utexas.edu"}],"description":"React Native Number Scrubber","homepage":"https://github.com/AdamTyler/react-native-scrub#readme","keywords":["react-native","scrubber","number","scrubber","dynamic"],"repository":{"type":"git","url":"git+https://github.com/AdamTyler/react-native-scrub.git"},"author":{"name":"Adam Tyler"},"bugs":{"url":"https://github.com/AdamTyler/react-native-scrub/issues"},"license":"MIT","readme":"# React Native Scrub\n\nA React Native number scrubber using React Native Gesture Handler\n\n## Install\n\n```\nyarn add react-native-scrub react-native-gesture-handler\n\ncd ios\npod install\n```\n\nOn Android, make sure to [finish integrating](https://software-mansion.github.io/react-native-gesture-handler/docs/getting-started.html#android) `react-native-gesture-handler`, if you haven't already.\n\n## How To Use\n\n`onUpdate` will return each scrub which should be used to update a display value.\n\n`onChange` will return when the user stops scrubbing. This can be used to update the display, and update the value passed into the component again. If you adjust the value another way the `Scrubber` will spring to the new value.\n\n`min` is the minimum value that is allowed\n\n`max` is the maximum value that is allowed\n\n`step` is how the scrubber should create the range from the `min` to the `max`.\n\n`renderTick` will be called with the current index, step value, and allow you to control how each tick is rendered. You can use the one provided or write your own.\n\n\n## Demo\n\n```jsx\nimport React, { useState } from 'react';\nimport { SafeAreaView, View, Text } from 'react-native';\nimport { Slider, Tick, CenterLine } from 'react-native-scrub';\n\nconst App = () => {\n  const [display, setDisplay] = useState(50);\n  const [value, setValue] = useState(50);\n\n  return (\n    <SafeAreaView>\n      <Text\n        style={{\n          paddingVertical: 20,\n          fontSize: 40,\n          fontWeight: 'bold',\n          textAlign: 'center',\n        }}\n      >\n        {display}\n      </Text>\n      <Slider\n        min={10}\n        max={100}\n        step={1}\n        value={value}\n        onUpdate={v => {\n          setDisplay(v);\n        }}\n        onChange={v => {\n          setDisplay(v);\n          setValue(v);\n        }}\n        renderTick={tick => <Tick key={tick.index} {...tick} />}\n      >\n        <CenterLine\n          style={{\n            backgroundColor: 'red',\n          }}\n        />\n      </Slider>\n    </SafeAreaView>\n  );\n};\n\nexport default App;\n```\n\n![](./demo.gif)\n","readmeFilename":"README.md"}