{"id":28208973,"url":"https://github.com/candlefinance/slider","last_synced_at":"2025-10-10T22:41:19.844Z","repository":{"id":63642450,"uuid":"568659836","full_name":"candlefinance/slider","owner":"candlefinance","description":"A little (horizontal) animated slider component for React Native.","archived":false,"fork":false,"pushed_at":"2022-11-22T21:14:35.000Z","size":404,"stargazers_count":21,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-09-21T04:48:44.246Z","etag":null,"topics":["expo","react-native","react-native-component","slider","slider-component","slider-range"],"latest_commit_sha":null,"homepage":"https://trycandle.com","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/candlefinance.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-11-21T06:09:08.000Z","updated_at":"2024-12-05T18:35:27.000Z","dependencies_parsed_at":"2022-11-23T01:01:18.968Z","dependency_job_id":null,"html_url":"https://github.com/candlefinance/slider","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/candlefinance/slider","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/candlefinance%2Fslider","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/candlefinance%2Fslider/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/candlefinance%2Fslider/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/candlefinance%2Fslider/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/candlefinance","download_url":"https://codeload.github.com/candlefinance/slider/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/candlefinance%2Fslider/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279005458,"owners_count":26083902,"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-10T02:00:06.843Z","response_time":62,"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":["expo","react-native","react-native-component","slider","slider-component","slider-range"],"created_at":"2025-05-17T15:13:04.537Z","updated_at":"2025-10-10T22:41:19.827Z","avatar_url":"https://github.com/candlefinance.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Slider\n\nA little (horizontal) animated slider component for React Native. Inspired by [rn-vertical-slider](https://github.com/sacmii/rn-vertical-slider).\n\n\u003cimg center width=\"400px\" src=\"https://user-images.githubusercontent.com/12258850/202975094-f3547c27-7b1c-42e8-8edc-6efc71766f21.gif\" /\u003e\n\n## Features\n* Vanilla React Native animation API\n* Compatible with Expo, try it out in the [snack](https://snack.expo.dev/@candlefinance/candle-slider-demo)\n\n## Caveats\n* This implementation of the pan gesture animation runs on the JS thread.\n\n## Installation\n\n```sh\nyarn add @candlefinance/slider\n```\n\n## Usage\n\nCheck out the [example](./example/) project for a demo project.\n\n```jsx\nimport Slider from '@candlefinance/slider';\n\n\u003cSlider\n  value={myValue}\n  disabled={false}\n  min={1}\n  max={99}\n  onChange={(value) =\u003e {\n    console.log('CHANGE', value);\n    setMyValue(value);\n  }}\n  onComplete={(value) =\u003e {\n    console.log('COMPLETE', value);\n  }}\n  width={300}\n  height={54}\n  step={1}\n  maximumTrackTintColor=\"#c7c7c7\"\n  minimumTrackTintColor=\"#ff0067\"\n  ballIndicatorColor=\"#4f4f4f\"\n  ballIndicatorTextColor=\"#ffffff\"\n/\u003e\n```\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","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcandlefinance%2Fslider","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcandlefinance%2Fslider","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcandlefinance%2Fslider/lists"}