React Native Accordion Component
npm install @jazebjaved/accordion
or
yarn add @jazebjaved/accordion
Install the following dependency if not already installed.
react-native-svg
npm install react-native-svg
or
yarn add react-native-svg
import Accordion from '@jazebjaved/accordion'
<Accordion title={<string>} content={<ReactNode>}/>
<Accordion title="Title" content={<View><Text>Content</Text></View>}/>
Prop | Type | Description | Required | Default Value |
---|---|---|---|---|
title | string | Title of the accordion | ✔ | - |
content | ReactNode | Content of the accordion | ✔ | - |
px | number | Padding on x-axis | ❌ | 10 |
py | number | Padding on y-axis | ❌ | 6 |
bgC | string | Background color of the accordion | ❌ | #eee |
borderRadius | number | Border radius of the accordion | ❌ | 6 |
gap | number | Gap between title and content | ❌ | 10 |
titleColor | string | Color of the title | ❌ | #000 |
titleFontSize | number | Font size of the title | ❌ | 16 |
titleFontWeight | string | Font weight of the title | ❌ | 600 |
contentBgC | string | Background color of the content | ❌ | #fff |
contentPx | number | Padding on x-axis of the content | ❌ | 10 |
contentPy | number | Padding on y-axis of the content | ❌ | 6 |
import React from 'react';
import {View, Text} from 'react-native';
import Accordion from '@jazebjaved/accordion';
const App = () => {
return (
<View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
<Accordion
title="Title"
content={
<View>
<Text>Content</Text>
</View>
}
/>
</View>
);
};
export default App;
New : custom styling for accordion title and content.
Updated deafult styling of accordion.
Updated Readme.md
Added basic accordion functionality.
Initial release of accordion package.