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	() => <View style={{marginVertical: 10}}>
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