{"id":26892214,"url":"https://github.com/hossein-zare/react-native-dropdown-picker","last_synced_at":"2025-05-14T12:08:37.030Z","repository":{"id":37589382,"uuid":"252593764","full_name":"hossein-zare/react-native-dropdown-picker","owner":"hossein-zare","description":"A single / multiple, categorizable, customizable, localizable and searchable item picker (drop-down) component for react native which supports both Android \u0026 iOS.","archived":false,"fork":false,"pushed_at":"2024-02-12T18:33:25.000Z","size":1195,"stargazers_count":955,"open_issues_count":150,"forks_count":294,"subscribers_count":9,"default_branch":"dev-5.x","last_synced_at":"2024-05-16T16:46:14.058Z","etag":null,"topics":["android","categorizable","category","dropdown","ios","javascript","menu","multiple","multiple-pickers","picker","placeholder","react-native","searchable","select","single"],"latest_commit_sha":null,"homepage":"https://hossein-zare.github.io/react-native-dropdown-picker-website/","language":"JavaScript","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/hossein-zare.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","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}},"created_at":"2020-04-03T00:18:57.000Z","updated_at":"2024-06-12T17:01:55.293Z","dependencies_parsed_at":"2024-01-14T00:21:14.234Z","dependency_job_id":"904fac96-fb3d-450d-9537-3ee803970b5b","html_url":"https://github.com/hossein-zare/react-native-dropdown-picker","commit_stats":{"total_commits":611,"total_committers":51,"mean_commits":"11.980392156862745","dds":0.2585924713584288,"last_synced_commit":"09c636436833d64a43ce0a77044774969afe7b9b"},"previous_names":[],"tags_count":39,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hossein-zare%2Freact-native-dropdown-picker","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hossein-zare%2Freact-native-dropdown-picker/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hossein-zare%2Freact-native-dropdown-picker/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hossein-zare%2Freact-native-dropdown-picker/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hossein-zare","download_url":"https://codeload.github.com/hossein-zare/react-native-dropdown-picker/tar.gz/refs/heads/dev-5.x","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249003929,"owners_count":21196789,"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":["android","categorizable","category","dropdown","ios","javascript","menu","multiple","multiple-pickers","picker","placeholder","react-native","searchable","select","single"],"created_at":"2025-03-31T22:49:30.393Z","updated_at":"2025-04-15T03:37:48.577Z","avatar_url":"https://github.com/hossein-zare.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Native Dropdown Picker\n\n[![GitHub repo](https://img.shields.io/badge/GitHub_repo-grey?logo=github)](https://github.com/hossein-zare/react-native-dropdown-picker)\n[![Build Status](https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2Fhossein-zare%2Freact-native-dropdown-picker%2Fbadge%3Fref%3Ddev-5.x\u0026style=flat)](https://actions-badge.atrox.dev/hossein-zare/react-native-dropdown-picker/goto?ref=dev-5.x)\n[![PRs welcome](https://img.shields.io/badge/PRs-welcome-brightgreen)](https://github.com/hossein-zare/react-native-dropdown-picker/blob/dev-5.x/CONTRIBUTING.md)\n[![react-native-dropdown-picker is released under the MIT license.](https://img.shields.io/github/license/hossein-zare/react-native-dropdown-picker)](https://github.com/hossein-zare/react-native-dropdown-picker/blob/dev-5.x/LICENSE)\n[![Current npm package version.](https://img.shields.io/npm/v/react-native-dropdown-picker?color=brightgreen\u0026label=npm%20package)](https://www.npmjs.org/package/react-native-dropdown-picker)\n[![Weekly npm downloads](https://img.shields.io/npm/dw/react-native-dropdown-picker)](https://www.npmjs.org/package/react-native-dropdown-picker)\n[![Documentation](https://img.shields.io/badge/Documentation-grey)](https://hossein-zare.github.io/react-native-dropdown-picker-website/docs)\n\n---\n\n## 📱 Screenshots\n\n[![Screenshot showing basic dropdown](.github/assets/images/screenshots/basic.png)](https://raw.githubusercontent.com/hossein-zare/react-native-dropdown-picker/dev-5.x/.github/assets/images/screenshots/basic_full.png)\n[![Screenshot showing badges](.github/assets/images/screenshots/badges.png)](https://raw.githubusercontent.com/hossein-zare/react-native-dropdown-picker/dev-5.x/.github/assets/images/screenshots/badges_full.png)\n[![Screenshot showing dark theme and parent items](.github/assets/images/screenshots/dark_theme_parent_items.png)](https://raw.githubusercontent.com/hossein-zare/react-native-dropdown-picker/dev-5.x/.github/assets/images/screenshots/dark_theme_parent_items_full.png)\n\nThe above screenshots were taken\nfrom [this example](https://snack.expo.dev/8mHmLfcZf).\n\n## 👋 Usage\n\n### Basic usage\n\nThe following code shows basic usage of this library:\n\n```javascript\nimport React, {useState} from 'react';\nimport {View, Text} from 'react-native';\nimport DropDownPicker from 'react-native-dropdown-picker';\n\nexport default function App() {\n    const [open, setOpen] = useState(false);\n    const [value, setValue] = useState(null);\n    const [items, setItems] = useState([\n        {label: 'Apple', value: 'apple'},\n        {label: 'Banana', value: 'banana'},\n        {label: 'Pear', value: 'pear'},\n    ]);\n\n    return (\n        \u003cView style={{flex: 1}}\u003e\n            \u003cView\n                style={{\n                    flex: 1,\n                    alignItems: 'center',\n                    justifyContent: 'center',\n                    paddingHorizontal: 15,\n                }}\u003e\n                \u003cDropDownPicker\n                    open={open}\n                    value={value}\n                    items={items}\n                    setOpen={setOpen}\n                    setValue={setValue}\n                    setItems={setItems}\n                    placeholder={'Choose a fruit.'}\n                /\u003e\n            \u003c/View\u003e\n\n            \u003cView style={{\n                flex: 1,\n                alignItems: 'center',\n                justifyContent: 'center'\n            }}\u003e\n                \u003cText\u003eChosen fruit: {value === null ? 'none' : value}\u003c/Text\u003e\n            \u003c/View\u003e\n        \u003c/View\u003e\n    );\n}\n```\n\n### Further information on usage\n\nYou can find more examples in the `examples` subdirectory. This subdirectory is\na working [Expo](https://github.com/expo/expo) project demonstrating this\nlibrary. It shows how to use this library with class components as well as with\nfunction components, and in TypeScript as well as in JavaScript. Navigate into\nthe `examples` subdirectory, run `npm install`, and then run `npx expo start` to\nsee the examples working.\n\nFor further information on how to use this library,\nread [the usage documentation](https://hossein-zare.github.io/react-native-dropdown-picker-website/docs/usage).\n\n## 📄 Further documentation\n\nThe docs can be read\nat: [https://hossein-zare.github.io/react-native-dropdown-picker-website](https://hossein-zare.github.io/react-native-dropdown-picker-website)\n\nThe docs can be edited\nat: [https://github.com/hossein-zare/react-native-dropdown-picker-website](https://github.com/hossein-zare/react-native-dropdown-picker-website)\n\n## 😕 Support and issues\n\nIf you have questions or need help, you\ncan [ask a question on Stack Overflow](https://stackoverflow.com/questions/tagged/react-native-dropdown-picker)\nor [make a GitHub issue](https://github.com/hossein-zare/react-native-dropdown-picker/issues/new/choose).\nYou can also make a GitHub issue to report a bug or make a feature request.\n\n## 🚀️ Contributing\n\nSee [CONTRIBUTING.md](https://github.com/hossein-zare/react-native-dropdown-picker/blob/dev-5.x/CONTRIBUTING.md).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhossein-zare%2Freact-native-dropdown-picker","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhossein-zare%2Freact-native-dropdown-picker","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhossein-zare%2Freact-native-dropdown-picker/lists"}