{"_id":"@closetothe/vision-camera-color-detector","name":"@closetothe/vision-camera-color-detector","dist-tags":{"latest":"0.6.0"},"versions":{"0.6.0":{"name":"@closetothe/vision-camera-color-detector","version":"0.6.0","description":"A React Native Vision Camera Frame Processor Plugin for detecting colors in the camera stream.","main":"lib/commonjs/index","module":"lib/module/index","types":"lib/typescript/index.d.ts","react-native":"src/index","source":"src/index","scripts":{"test":"jest","typescript":"tsc --noEmit","lint":"eslint \"**/*.{js,ts,tsx}\"","prepare":"bob build","release":"release-it","example":"yarn --cwd example","pods":"cd example && pod-install --quiet","bootstrap":"yarn example && yarn && yarn pods"},"keywords":["react-native","ios","android","pdf417","colors","detect","qr-code","ean13","data-matrix"],"repository":{"type":"git","url":"git+https://github.com/closetothe/vision-camera-color-detector.git"},"author":{"name":"Jamiel Rahi","email":"app.gildew@gmail.com","url":"https://github.com/closetothe"},"license":"MIT","bugs":{"url":"https://github.com/closetothe/vision-camera-color-detector/issues"},"homepage":"https://github.com/closetothe/vision-camera-color-detector#readme","publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"},"devDependencies":{"@commitlint/config-conventional":"^11.0.0","@react-native-community/eslint-config":"^2.0.0","@release-it/conventional-changelog":"^2.0.0","@types/jest":"^26.0.0","@types/react":"^16.9.19","@types/react-native":"0.62.13","commitlint":"^11.0.0","eslint":"^7.2.0","eslint-config-prettier":"^7.0.0","eslint-plugin-prettier":"^3.1.3","husky":"^6.0.0","jest":"^26.0.1","pod-install":"^0.1.0","prettier":"^2.0.5","react":"16.13.1","react-native":"0.63.4","react-native-builder-bob":"^0.18.0","react-native-reanimated":"^2.3.1","react-native-vision-camera":"^2.12.0","release-it":"^14.2.2","typescript":"^4.1.3"},"peerDependencies":{"react":"*","react-native":"*"},"jest":{"preset":"react-native","modulePathIgnorePatterns":["<rootDir>/example/node_modules","<rootDir>/lib/"]},"commitlint":{"extends":["@commitlint/config-conventional"]},"release-it":{"git":{"commitMessage":"chore: release ${version}","tagName":"v${version}"},"npm":{"publish":true},"github":{"release":true},"plugins":{"@release-it/conventional-changelog":{"preset":"angular"}}},"eslintConfig":{"root":true,"extends":["@react-native-community","prettier"],"rules":{"prettier/prettier":["error",{"quoteProps":"consistent","singleQuote":true,"tabWidth":2,"trailingComma":"es5","useTabs":false}]}},"eslintIgnore":["node_modules/","lib/"],"prettier":{"quoteProps":"consistent","singleQuote":true,"tabWidth":2,"trailingComma":"es5","useTabs":false},"react-native-builder-bob":{"source":"src","output":"lib","targets":["commonjs","module",["typescript",{"project":"tsconfig.build.json"}]]},"dependencies":{},"gitHead":"13038337044fbd850361d25ea4eb0c136fefb9c5","_id":"@closetothe/vision-camera-color-detector@0.6.0","_nodeVersion":"16.14.0","_npmVersion":"8.5.5","dist":{"integrity":"sha512-7ICNedV9dRPgpaFqt/xLQLWG0RRQff8GYQ328oG8Ez5pNQmq23NiA60QguZarINzLAvVG4U9k7flk2O5zx0BYQ==","shasum":"486d4afe9e2d4e66301f1b0f3948e57a86abf0c7","tarball":"https://registry.npmjs.org/@closetothe/vision-camera-color-detector/-/vision-camera-color-detector-0.6.0.tgz","fileCount":18,"unpackedSize":53329,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICF4vrhCdUuRG5DRSmAh1rdl7oZ2pSgtDFJWbh3VUdZnAiEAqDP8TJgZCTcarNMissc5ChDH8h63S5pdhq/YbAC0uGI="}]},"_npmUser":{"name":"closetothe","email":"Jamiel.nr@gmail.com"},"directories":{},"maintainers":[{"name":"closetothe","email":"Jamiel.nr@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vision-camera-color-detector_0.6.0_1693536606998_0.8222994559391812"},"_hasShrinkwrap":false}},"time":{"created":"2023-09-01T02:50:06.897Z","0.6.0":"2023-09-01T02:50:07.194Z","modified":"2023-09-01T02:50:07.452Z"},"maintainers":[{"name":"closetothe","email":"Jamiel.nr@gmail.com"}],"description":"A React Native Vision Camera Frame Processor Plugin for detecting colors in the camera stream.","homepage":"https://github.com/closetothe/vision-camera-color-detector#readme","keywords":["react-native","ios","android","pdf417","colors","detect","qr-code","ean13","data-matrix"],"repository":{"type":"git","url":"git+https://github.com/closetothe/vision-camera-color-detector.git"},"author":{"name":"Jamiel Rahi","email":"app.gildew@gmail.com","url":"https://github.com/closetothe"},"bugs":{"url":"https://github.com/closetothe/vision-camera-color-detector/issues"},"license":"MIT","readme":"# vision-camera-color-detector\n\nReact Native Vision Camera Frame Processor Plugin of the UIColors swift package.\n\n## Installation\n\n```sh\nnpm install vision-camera-color-detector\n```\n\nmake sure you correctly setup react-native-reanimated and add this to your babel.config.js\n\n```\n[\n  'react-native-reanimated/plugin',\n  {\n    globals: ['__detectColors'],\n  },\n]\n```\n\n## Usage\n\n1. Detect colors from the camera preview.\n\n   ```ts\n   import * as React from 'react';\n   import { StyleSheet, Text } from 'react-native';\n   import {\n     Camera,\n     useCameraDevices,\n     useFrameProcessor,\n   } from 'react-native-vision-camera';\n   import { detectColors } from 'vision-camera-color-detector';\n   import * as REA from 'react-native-reanimated';\n\n   export default function App() {\n     const [hasPermission, setHasPermission] = React.useState(false);\n     const [colors, setColors] = React.useState<null | {\n       background: string; // hex code including octothorp\n       detail: string;\n       primary: string;\n       secondary: string;\n     }>(null);\n     const devices = useCameraDevices();\n     const device = devices.back;\n     const frameProcessor = useFrameProcessor((frame) => {\n       'worklet';\n       const results = detectColors(frame, 'lowest');\n       if (results) {\n         REA.runOnJS(setColors)(results);\n       }\n     }, []);\n\n     React.useEffect(() => {\n       (async () => {\n         const status = await Camera.requestCameraPermission();\n         setHasPermission(status === 'authorized');\n       })();\n     }, []);\n\n     return (\n       device != null &&\n       hasPermission && (\n         <Camera\n           style={StyleSheet.absoluteFill}\n           device={device}\n           isActive={true}\n           frameProcessor={frameProcessor}\n           frameProcessorFps={5}\n         />\n       )\n     );\n   }\n   ```\n\nConfiguration:\n\nSet the camera quality (use \"lowest\" setting for better perf):\n\n```js\n'lowest' | 'low' | 'high' | 'highest';\n```\n\n## Supported Platforms\n\n- iOS\n\nSomeone else can implement the Android version.\n\n## Contributing\n\nSee the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.\n\n## License\n\nMIT\n","readmeFilename":"README.md"}