1 | import * as React from 'react';
|
2 | import { ColorValue, GestureResponderEvent, StyleProp, TextStyle, ViewProps, ViewStyle, PressableAndroidRippleConfig } from 'react-native';
|
3 | import type { Style } from './utils';
|
4 | import type { ThemeProp } from '../../types';
|
5 | export declare type Props = {
|
6 | /**
|
7 | * Title text for the list accordion.
|
8 | */
|
9 | title: React.ReactNode;
|
10 | /**
|
11 | * Description text for the list accordion.
|
12 | */
|
13 | description?: React.ReactNode;
|
14 | /**
|
15 | * Callback which returns a React element to display on the left side.
|
16 | */
|
17 | left?: (props: {
|
18 | color: string;
|
19 | style: Style;
|
20 | }) => React.ReactNode;
|
21 | /**
|
22 | * Callback which returns a React element to display on the right side.
|
23 | */
|
24 | right?: (props: {
|
25 | isExpanded: boolean;
|
26 | }) => React.ReactNode;
|
27 | /**
|
28 | * Whether the accordion is expanded
|
29 | * If this prop is provided, the accordion will behave as a "controlled component".
|
30 | * You'll need to update this prop when you want to toggle the component or on `onPress`.
|
31 | */
|
32 | expanded?: boolean;
|
33 | /**
|
34 | * Function to execute on press.
|
35 | */
|
36 | onPress?: (e: GestureResponderEvent) => void;
|
37 | /**
|
38 | * Function to execute on long press.
|
39 | */
|
40 | onLongPress?: (e: GestureResponderEvent) => void;
|
41 | /**
|
42 | * The number of milliseconds a user must touch the element before executing `onLongPress`.
|
43 | */
|
44 | delayLongPress?: number;
|
45 | /**
|
46 | * Content of the section.
|
47 | */
|
48 | children: React.ReactNode;
|
49 | /**
|
50 | * @optional
|
51 | */
|
52 | theme?: ThemeProp;
|
53 | /**
|
54 | * Type of background drawabale to display the feedback (Android).
|
55 | * https://reactnative.dev/docs/pressable#rippleconfig
|
56 | */
|
57 | background?: PressableAndroidRippleConfig;
|
58 | /**
|
59 | * Style that is passed to the wrapping TouchableRipple element.
|
60 | */
|
61 | style?: StyleProp<ViewStyle>;
|
62 | /**
|
63 | * Style that is passed to Title element.
|
64 | */
|
65 | titleStyle?: StyleProp<TextStyle>;
|
66 | /**
|
67 | * Style that is passed to Description element.
|
68 | */
|
69 | descriptionStyle?: StyleProp<TextStyle>;
|
70 | /**
|
71 | * Color of the ripple effect.
|
72 | */
|
73 | rippleColor?: ColorValue;
|
74 | /**
|
75 | * Truncate Title text such that the total number of lines does not
|
76 | * exceed this number.
|
77 | */
|
78 | titleNumberOfLines?: number;
|
79 | /**
|
80 | * Truncate Description text such that the total number of lines does not
|
81 | * exceed this number.
|
82 | */
|
83 | descriptionNumberOfLines?: number;
|
84 | /**
|
85 | * Specifies the largest possible scale a title font can reach.
|
86 | */
|
87 | titleMaxFontSizeMultiplier?: number;
|
88 | /**
|
89 | * Specifies the largest possible scale a description font can reach.
|
90 | */
|
91 | descriptionMaxFontSizeMultiplier?: number;
|
92 | /**
|
93 | * Id is used for distinguishing specific accordion when using List.AccordionGroup. Property is required when using List.AccordionGroup and has no impact on behavior when using standalone List.Accordion.
|
94 | */
|
95 | id?: string | number;
|
96 | /**
|
97 | * TestID used for testing purposes
|
98 | */
|
99 | testID?: string;
|
100 | /**
|
101 | * Accessibility label for the TouchableRipple. This is read by the screen reader when the user taps the touchable.
|
102 | */
|
103 | accessibilityLabel?: string;
|
104 | /**
|
105 | * `pointerEvents` passed to the `View` container
|
106 | */
|
107 | pointerEvents?: ViewProps['pointerEvents'];
|
108 | };
|
109 | /**
|
110 | * A component used to display an expandable list item.
|
111 | *
|
112 | * ## Usage
|
113 | * ```js
|
114 | * import * as React from 'react';
|
115 | * import { List } from 'react-native-paper';
|
116 | *
|
117 | * const MyComponent = () => {
|
118 | * const [expanded, setExpanded] = React.useState(true);
|
119 | *
|
120 | * const handlePress = () => setExpanded(!expanded);
|
121 | *
|
122 | * return (
|
123 | * <List.Section title="Accordions">
|
124 | * <List.Accordion
|
125 | * title="Uncontrolled Accordion"
|
126 | * left={props => <List.Icon {...props} icon="folder" />}>
|
127 | * <List.Item title="First item" />
|
128 | * <List.Item title="Second item" />
|
129 | * </List.Accordion>
|
130 | *
|
131 | * <List.Accordion
|
132 | * title="Controlled Accordion"
|
133 | * left={props => <List.Icon {...props} icon="folder" />}
|
134 | * expanded={expanded}
|
135 | * onPress={handlePress}>
|
136 | * <List.Item title="First item" />
|
137 | * <List.Item title="Second item" />
|
138 | * </List.Accordion>
|
139 | * </List.Section>
|
140 | * );
|
141 | * };
|
142 | *
|
143 | * export default MyComponent;
|
144 | * ```
|
145 | */
|
146 | declare const ListAccordion: {
|
147 | ({ left, right, title, description, children, theme: themeOverrides, titleStyle, descriptionStyle, titleNumberOfLines, descriptionNumberOfLines, rippleColor: customRippleColor, style, id, testID, background, onPress, onLongPress, delayLongPress, expanded: expandedProp, accessibilityLabel, pointerEvents, titleMaxFontSizeMultiplier, descriptionMaxFontSizeMultiplier, }: Props): React.JSX.Element;
|
148 | displayName: string;
|
149 | };
|
150 | export default ListAccordion;
|
151 | //# sourceMappingURL=ListAccordion.d.ts.map |
\ | No newline at end of file |