{"id":17113310,"url":"https://github.com/hyochan/react-native-drop-down-item","last_synced_at":"2025-04-13T03:32:39.679Z","repository":{"id":38960900,"uuid":"155969661","full_name":"hyochan/react-native-drop-down-item","owner":"hyochan","description":"Dropdown list item for react-native.","archived":false,"fork":false,"pushed_at":"2022-12-08T18:03:27.000Z","size":1433,"stargazers_count":52,"open_issues_count":20,"forks_count":12,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-04T15:08:18.622Z","etag":null,"topics":["dropdown","react-native"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"isc","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/hyochan.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-11-03T09:45:40.000Z","updated_at":"2024-05-17T14:20:35.000Z","dependencies_parsed_at":"2023-01-25T19:32:08.870Z","dependency_job_id":null,"html_url":"https://github.com/hyochan/react-native-drop-down-item","commit_stats":null,"previous_names":["react-native-seoul/react-native-drop-down-item"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hyochan%2Freact-native-drop-down-item","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hyochan%2Freact-native-drop-down-item/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hyochan%2Freact-native-drop-down-item/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hyochan%2Freact-native-drop-down-item/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hyochan","download_url":"https://codeload.github.com/hyochan/react-native-drop-down-item/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248659645,"owners_count":21141152,"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":["dropdown","react-native"],"created_at":"2024-10-14T17:06:19.253Z","updated_at":"2025-04-13T03:32:39.648Z","avatar_url":"https://github.com/hyochan.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-native-drop-down-item (`Deprecated!`)\n\n\u003e Current package has been moved to [@dooboo-ui/native-accordion](https://www.npmjs.com/package/@dooboo-ui/native-accordion)\n\n[![Npm Version](http://img.shields.io/npm/v/react-native-drop-down-item.svg?style=flat-square)](https://npmjs.org/package/react-native-drop-down-item)\n[![Downloads](http://img.shields.io/npm/dm/react-native-drop-down-item.svg?style=flat-square)](https://npmjs.org/package/react-native-drop-down-item)\n[![Build Status](https://travis-ci.com/dooboolab/react-native-drop-down-item.svg?branch=master)](https://travis-ci.com/dooboolab/react-native-drop-down-item)\n![License](http://img.shields.io/npm/l/react-native-drop-down-item.svg?style=flat-square)\n\nSimple drop down item component for react-native. This component supports drop down toggle with animation.\u003cbr/\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/27461460/47951961-a7a7e500-dfab-11e8-9189-86c0eddb6e12.gif\"/\u003e\n\n## Npm repo\n\nhttps://www.npmjs.com/package/react-native-drop-down-item\n\n## Git repo\n\nhttps://github.com/dooboolab/react-native-drop-down-item\n\n## Props\n\n|                   | necessary | types   | default       |\n| ----------------- | --------- | ------- | ------------- |\n| contentVisible    |           | boolean | `false`       |\n| header            | ✓         | any     | `\u003cView/\u003e`     |\n| backgroundColor   |           | string  | `transparent` |\n| titleBackground   |           | string  | `transparent` |\n| contentBackground |           | string  | `transparent` |\n| underlineColor    |           | string  | `transparent` |\n| visibleImage      |           | any     | `undefined`   |\n| invisibleImage    |           | any     | `undefined`   |\n\n## Getting started\n\n`$ npm install react-native-drop-down-item --save`\n\n- Import\n\n  ```javascript\n  import DropDownItem from \"react-native-drop-down-item\";\n  ```\n\n- Data\n\n  ```javascript\n  state = {\n    contents: [\n      {\n        title: \"Title 1\",\n        body: \"Hi. I love this component. What do you think?\"\n      },\n      {\n        title: \"See this one too\",\n        body: \"Yes. You can have more items.\"\n      },\n      {\n        title: \"Thrid thing\",\n        body:\n          \"What about very long text? What about very long text? What about very long text? What about very long text? What about very long text? What about very long text? What about very long text? What about very long text? What about very long text? What about very long text? What about very long text? What about very long text?\"\n      }\n    ]\n  };\n  ```\n\n- Usage\n  ```javascript\n  \u003cView style={styles.container}\u003e\n    \u003cScrollView style={{ alignSelf: 'stretch' }}\u003e\n      {\n        this.state.contents\n          ? this.state.contents.map((param, i) =\u003e {\n            return (\n              \u003cDropDownItem\n                key={i}\n                style={styles.dropDownItem}\n                contentVisible={false}\n                invisibleImage={IC_ARR_DOWN}\n                visibleImage={IC_ARR_UP}\n                header={\n                  \u003cView\u003e\n                    \u003cText style={{\n                      fontSize: 16,\n                      color: 'blue',\n                    }}\u003e{param.title}\u003c/Text\u003e\n                  \u003c/View\u003e\n                }\n              \u003e\n                \u003cText style={[\n                  styles.txt,\n                  {\n                    fontSize: 20,\n                  }\n                ]}\u003e\n                  {param.body}\n                \u003c/Text\u003e\n              \u003c/DropDownItem\u003e\n            );\n          })\n          : null\n      }\n      \u003cView style={{ height: 96 }}/\u003e\n    \u003c/ScrollView\u003e\n  \u003c/View\u003e\n  });\n  ```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhyochan%2Freact-native-drop-down-item","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhyochan%2Freact-native-drop-down-item","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhyochan%2Freact-native-drop-down-item/lists"}