{"id":27767885,"url":"https://github.com/asifsha/react-picker-cascader","last_synced_at":"2026-04-10T23:02:37.395Z","repository":{"id":39453589,"uuid":"268323700","full_name":"asifsha/react-picker-cascader","owner":"asifsha","description":"React Picker Cascader Dropdown","archived":false,"fork":false,"pushed_at":"2024-05-11T17:52:35.000Z","size":2400,"stargazers_count":0,"open_issues_count":17,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-02T11:56:56.125Z","etag":null,"topics":["cascader","ci-cd","dropdown","github-actions","multilevel","npm-package","picker","reactjs","select","snapshot-testing"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/asifsha.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2020-05-31T16:54:57.000Z","updated_at":"2024-05-11T17:43:43.000Z","dependencies_parsed_at":"2024-05-11T18:51:37.670Z","dependency_job_id":null,"html_url":"https://github.com/asifsha/react-picker-cascader","commit_stats":{"total_commits":36,"total_committers":1,"mean_commits":36.0,"dds":0.0,"last_synced_commit":"19f58bfad0287901001e8b7b352c86176cfce73a"},"previous_names":[],"tags_count":15,"template":false,"template_full_name":null,"purl":"pkg:github/asifsha/react-picker-cascader","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/asifsha%2Freact-picker-cascader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/asifsha%2Freact-picker-cascader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/asifsha%2Freact-picker-cascader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/asifsha%2Freact-picker-cascader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/asifsha","download_url":"https://codeload.github.com/asifsha/react-picker-cascader/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/asifsha%2Freact-picker-cascader/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259730873,"owners_count":22902927,"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","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":["cascader","ci-cd","dropdown","github-actions","multilevel","npm-package","picker","reactjs","select","snapshot-testing"],"created_at":"2025-04-29T19:54:28.456Z","updated_at":"2026-04-10T23:02:32.352Z","avatar_url":"https://github.com/asifsha.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-picker-cascader / multilevel-dropdown\n\nReact Picker Cascader / Multilevel  Dropdown\n\n## Installation\n\n```\nnpm install --save r-picker-cascader\n```\n\n## How to Use\n\n```\nimport PickerCascader from \"r-picker-cascader\";\n\n\u003cPickerCascader\n            style={{ width: \"15rem\" }}\n            placeHolder={\"City\"}\n            data={[\n              {\n                key: \"1\",\n                text: \"Australia\",\n                children: [\n                  {\n                    key: \"2\",\n                    text: \"New South Wales\",\n                    children: [\n                      { key: \"3\", text: \"Sydney\" },\n                      { key: \"4\", text: \"Wollongong\" }\n                    ]\n                  },\n                  {\n                    key: \"5\",\n                    text: \"Victoria\",\n                    children: [\n                      { key: \"6\", text: \"Melbourne\" },\n                      { key: \"7\", text: \"Geelong\" }\n                    ]\n                  }\n                ]\n              },\n              {\n                key: \"10\",\n                text: \"Canada\",\n                children: [\n                  {\n                    key: \"11\",\n                    text: \"Alberta\",\n                    children: [\n                      { key: \"12\", text: \"Calgary\" },\n                      { key: \"13\", text: \"Brooks\" }\n                    ]\n                  },\n                  {\n                    key: \"14\",\n                    text: \"British Columbia\",\n                    children: [\n                      { key: \"15\", text: \"Vancouver\" },\n                      { key: \"16\", text: \"Vernon\" }\n                    ]\n                  }\n                ]\n              },\n              {\n                key: \"20\",\n                text: \"United States\",\n                children: [\n                  {\n                    key: \"21\",\n                    text: \"New York\",\n                    children: [\n                      { key: \"22\", text: \"Albany\" },\n                      { key: \"23\", text: \"Norwich\" }\n                    ]\n                  },\n                  {\n                    key: \"24\",\n                    text: \"Pennsylvania\",\n                    children: [\n                      { key: \"25\", text: \"Farrell\" },\n                      { key: \"26\", text: \"Parker\" }\n                    ]\n                  }\n                ]\n              }\n            ]}\n            onValueSelected={item =\u003e setCity(item)}\n          /\u003e\n```\n\nhttps://picker-cascader-demo.herokuapp.com\n\n![demo](https://raw.githubusercontent.com/asifsha/r-cascader-demo/master/demo/demo.gif)\n\n## props\n\n| prop | Description |\n| --- | --- |\n| data | Datasource for control, JavaScript object, if you want to bind json use json.Parse() to convert to JS object |\n| onValueSelected | Event, will give you selected item, key as '~' separated and values as \\| separated |\n\n\n## npm\nhttps://www.npmjs.com/package/r-picker-cascader\n\n## Developed By\nAsif Sharif\n\n## License\nMIT\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fasifsha%2Freact-picker-cascader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fasifsha%2Freact-picker-cascader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fasifsha%2Freact-picker-cascader/lists"}