# react-native-da-expandable
> Expandable element
Latest version **0.1.3** (published 2019-07-08) · MIT license · 0 weekly downloads
## Install
```sh
npm install react-native-da-expandable
pnpm add react-native-da-expandable
yarn add react-native-da-expandable
bun add react-native-da-expandable
```
## Health
**Score 15/100 (F)** — status: abandoned.
Positive: no vulnerabilities.
Warnings: low downloads; no types; no esm support; pre 1.0.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 0.1.3 |
| Published | 2019-07-08 |
| First published | 2019-07-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 786.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Diogo Aleixo |
| Maintainers | diogoaleixo |
| Keywords | react-native |
## Links
- npm: https://www.npmjs.com/package/react-native-da-expandable
- Repository: https://github.com/aleixo/react-native-da-expandable
- Homepage: https://github.com/aleixo/react-native-da-expandable#readme
- Issues: https://github.com/aleixo/react-native-da-expandable/issues
- npm.io page: https://npm.io/package/react-native-da-expandable
## Recent versions
- 0.1.3 (latest) — 2019-07-08
- 0.1.2 — 2019-07-08
- 0.1.1 — 2019-07-08
- 0.1.0 — 2019-07-08
## README
# react-native-da-expandable
You have two main elements
- CONTAINER
The container goal is for you to wrapp the collapsible elements inside of it. THis element allows you to scroll and collapse
its children
- COLLAPSIBLE
The collapsible element itself
## Properties
### Container
| prop | default | type | isRequired | description | example |
|:--------------:|---------|--------|------------|:---------------------------------------------------------------------------------------------------------------------------------:|:------------------------------------------------:|
| separator | null | Object | false | One react component to use as separator between the container childs | () => |
| footer | Object | Object | false | One react component to use as the container footer | () => FOOTER |
| listRef | null | Object | false | You can get the reference for the Container in order to scroll for ex | ref => this.containerRef = ref |
| changedLayouts | Object | Object | false | This property lets you get all the layouts of the container childs. Then you can perform your logic and scroll to where you want | |
### Collapsible
| prop | default | type | isRequired | description | example |
|---------------|-----------|--------|------------|---------------------------------------------------------------------------------------------------------------------------------------------------:|---------------------------------------------|
| id | null | Object | false | One react component to use as separator between the container childs | 'myid' |
| namespace | undefined | string | false | The collapsible element can have one namespace. The container will then make sure only one element on the same namespace is expanded | 'expandall' |
| renderHeader | | Object | true | One component to be rendered has the header. Here you will get toggle one function to toggle manually and one boolean indicating if it is expanded | (toggle, isExpanded) => HEADER |
| renderContent | | Object | true | One component to be rendered has the content. | () => HEADER |
## TODO
- Animate the while toggling expandable state
- Add JSDOcs
---
_Source: https://npm.io/package/react-native-da-expandable · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._