UNPKG

2.39 kBTypeScriptView Raw
1import * as React from 'react';
2import { EasingMode } from './index';
3
4export interface AccordionProps {
5 /**
6 * An array of sections passed to the render methods
7 */
8 sections: any[];
9
10 /**
11 * A function that should return a renderable representing the header
12 */
13 renderHeader(
14 content: any,
15 index: number,
16 isActive: boolean,
17 sections: any[]
18 ): React.ReactElement<{}>;
19
20 /**
21 * A function that should return a renderable representing the section title above the touchable
22 */
23 renderSectionTitle?(
24 content: any,
25 index: number,
26 isActive: boolean,
27 sections: any[]
28 ): React.ReactElement<{}>;
29
30 /**
31 * A function that should return a renderable representing the content
32 */
33 renderContent(
34 content: any,
35 index: number,
36 isActive: boolean,
37 sections: any[]
38 ): React.ReactElement<{}>;
39
40 /**
41 * An optional function that is called when currently active section is changed, index === false when collapsed
42 */
43 onChange?(index: number): void;
44
45 /**
46 * Expand content from the bottom instead of the top
47 *
48 * @default false
49 */
50 expandFromBottom?: boolean;
51
52 /**
53 * Set which index in the sections array is initially open. Defaults to none.
54 */
55 initiallyActiveSection?: number;
56
57 /**
58 * Control which index in the sections array is currently open. Defaults to none. If false, closes all sections.
59 */
60 activeSection?: boolean | number;
61
62 /**
63 * The color of the underlay that will show through when tapping on headers.
64 *
65 * @default black
66 */
67 underlayColor?: string;
68
69 /**
70 * Alignment of the content when transitioning, can be top, center or bottom
71 *
72 * @default top
73 */
74 align?: 'top' | 'center' | 'bottom';
75
76 /**
77 * Duration of transition in milliseconds
78 *
79 * @default 300
80 */
81 duration?: number;
82
83 /**
84 * Function or function name from Easing (or tween-functions if < RN 0.8). Collapsible will try to combine Easing functions for you if you name them like tween-functions.
85 *
86 * @default easeOutCubic
87 */
88 easing?: EasingMode | any;
89
90 /**
91 * Component to use for the Touchable
92 *
93 * @default TouchableHighlight
94 */
95 touchableComponent?: React.ComponentClass;
96
97 /**
98 * Object of props to pass to the touchable component
99 */
100 touchableProps?: {};
101}
102
103export default class Accordion extends React.Component<AccordionProps, any> {}
104