UNPKG

13.8 kBTypeScriptView Raw
1import * as React from 'react';
2import { StyleProp, TextStyle, ViewStyle } from 'react-native';
3import TouchableRipple from '../TouchableRipple/TouchableRipple';
4import type { $RemoveChildren, EllipsizeProp } from '../../types';
5declare type Title = React.ReactNode | ((props: {
6 selectable: boolean;
7 ellipsizeMode: EllipsizeProp | undefined;
8 color: string;
9 fontSize: number;
10}) => React.ReactNode);
11declare type Description = React.ReactNode | ((props: {
12 selectable: boolean;
13 ellipsizeMode: EllipsizeProp | undefined;
14 color: string;
15 fontSize: number;
16}) => React.ReactNode);
17declare type Props = $RemoveChildren<typeof TouchableRipple> & {
18 /**
19 * Title text for the list item.
20 */
21 title: Title;
22 /**
23 * Description text for the list item or callback which returns a React element to display the description.
24 */
25 description?: Description;
26 /**
27 * Callback which returns a React element to display on the left side.
28 */
29 left?: (props: {
30 color: string;
31 style: {
32 marginLeft: number;
33 marginRight: number;
34 marginVertical?: number;
35 };
36 }) => React.ReactNode;
37 /**
38 * Callback which returns a React element to display on the right side.
39 */
40 right?: (props: {
41 color: string;
42 style?: {
43 marginRight: number;
44 marginVertical?: number;
45 };
46 }) => React.ReactNode;
47 /**
48 * Function to execute on press.
49 */
50 onPress?: () => void;
51 /**
52 * @optional
53 */
54 theme: ReactNativePaper.Theme;
55 /**
56 * Style that is passed to the wrapping TouchableRipple element.
57 */
58 style?: StyleProp<ViewStyle>;
59 /**
60 * Style that is passed to Title element.
61 */
62 titleStyle?: StyleProp<TextStyle>;
63 /**
64 * Style that is passed to Description element.
65 */
66 descriptionStyle?: StyleProp<TextStyle>;
67 /**
68 * Truncate Title text such that the total number of lines does not
69 * exceed this number.
70 */
71 titleNumberOfLines?: number;
72 /**
73 * Truncate Description text such that the total number of lines does not
74 * exceed this number.
75 */
76 descriptionNumberOfLines?: number;
77 /**
78 * Ellipsize Mode for the Title. One of `'head'`, `'middle'`, `'tail'`, `'clip'`.
79 *
80 * See [`ellipsizeMode`](https://reactnative.dev/docs/text#ellipsizemode)
81 */
82 titleEllipsizeMode?: EllipsizeProp;
83 /**
84 * Ellipsize Mode for the Description. One of `'head'`, `'middle'`, `'tail'`, `'clip'`.
85 *
86 * See [`ellipsizeMode`](https://reactnative.dev/docs/text#ellipsizemode)
87 */
88 descriptionEllipsizeMode?: EllipsizeProp;
89};
90declare const _default: React.ComponentType<Pick<$RemoveChildren<React.ComponentType<Pick<import("react-native").TouchableWithoutFeedbackProps & React.RefAttributes<import("react-native").TouchableWithoutFeedback> & {
91 borderless?: boolean | undefined;
92 background?: Object | undefined;
93 centered?: boolean | undefined;
94 disabled?: boolean | undefined;
95 onPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
96 onLongPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
97 rippleColor?: string | undefined;
98 underlayColor?: string | undefined;
99 children: React.ReactNode;
100 style?: StyleProp<ViewStyle>;
101 theme: ReactNativePaper.Theme;
102}, keyof import("react-native").TouchableWithoutFeedbackProps | "background" | "borderless" | "rippleColor" | "underlayColor" | "centered" | keyof React.RefAttributes<import("react-native").TouchableWithoutFeedback>> & {
103 theme?: import("@callstack/react-theme-provider").$DeepPartial<ReactNativePaper.Theme> | undefined;
104}> & import("@callstack/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<import("react-native").TouchableWithoutFeedbackProps & React.RefAttributes<import("react-native").TouchableWithoutFeedback> & {
105 borderless?: boolean | undefined;
106 background?: Object | undefined;
107 centered?: boolean | undefined;
108 disabled?: boolean | undefined;
109 onPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
110 onLongPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
111 rippleColor?: string | undefined;
112 underlayColor?: string | undefined;
113 children: React.ReactNode;
114 style?: StyleProp<ViewStyle>;
115 theme: ReactNativePaper.Theme;
116}> & {
117 ({ style, background: _background, borderless, disabled: disabledProp, rippleColor, underlayColor: _underlayColor, children, theme, ...rest }: import("react-native").TouchableWithoutFeedbackProps & React.RefAttributes<import("react-native").TouchableWithoutFeedback> & {
118 borderless?: boolean | undefined;
119 background?: Object | undefined;
120 centered?: boolean | undefined;
121 disabled?: boolean | undefined;
122 onPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
123 onLongPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
124 rippleColor?: string | undefined;
125 underlayColor?: string | undefined;
126 children: React.ReactNode;
127 style?: StyleProp<ViewStyle>;
128 theme: ReactNativePaper.Theme;
129 }): JSX.Element;
130 supported: boolean;
131}, {}>> & {
132 /**
133 * Title text for the list item.
134 */
135 title: Title;
136 /**
137 * Description text for the list item or callback which returns a React element to display the description.
138 */
139 description?: Description;
140 /**
141 * Callback which returns a React element to display on the left side.
142 */
143 left?: ((props: {
144 color: string;
145 style: {
146 marginLeft: number;
147 marginRight: number;
148 marginVertical?: number | undefined;
149 };
150 }) => React.ReactNode) | undefined;
151 /**
152 * Callback which returns a React element to display on the right side.
153 */
154 right?: ((props: {
155 color: string;
156 style?: {
157 marginRight: number;
158 marginVertical?: number | undefined;
159 } | undefined;
160 }) => React.ReactNode) | undefined;
161 /**
162 * Function to execute on press.
163 */
164 onPress?: (() => void) | undefined;
165 /**
166 * @optional
167 */
168 theme: ReactNativePaper.Theme;
169 /**
170 * Style that is passed to the wrapping TouchableRipple element.
171 */
172 style?: StyleProp<ViewStyle>;
173 /**
174 * Style that is passed to Title element.
175 */
176 titleStyle?: StyleProp<TextStyle>;
177 /**
178 * Style that is passed to Description element.
179 */
180 descriptionStyle?: StyleProp<TextStyle>;
181 /**
182 * Truncate Title text such that the total number of lines does not
183 * exceed this number.
184 */
185 titleNumberOfLines?: number | undefined;
186 /**
187 * Truncate Description text such that the total number of lines does not
188 * exceed this number.
189 */
190 descriptionNumberOfLines?: number | undefined;
191 /**
192 * Ellipsize Mode for the Title. One of `'head'`, `'middle'`, `'tail'`, `'clip'`.
193 *
194 * See [`ellipsizeMode`](https://reactnative.dev/docs/text#ellipsizemode)
195 */
196 titleEllipsizeMode?: EllipsizeProp | undefined;
197 /**
198 * Ellipsize Mode for the Description. One of `'head'`, `'middle'`, `'tail'`, `'clip'`.
199 *
200 * See [`ellipsizeMode`](https://reactnative.dev/docs/text#ellipsizemode)
201 */
202 descriptionEllipsizeMode?: EllipsizeProp | undefined;
203}, "style" | "title" | "onLayout" | "onPress" | "onPressIn" | "onPressOut" | "onLongPress" | "testID" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "left" | "right" | "key" | "hitSlop" | "delayLongPress" | "delayPressIn" | "delayPressOut" | "disabled" | "onBlur" | "onFocus" | "pressRetentionOffset" | "touchSoundDisabled" | "background" | "borderless" | "rippleColor" | "underlayColor" | "centered" | "description" | "titleStyle" | "descriptionStyle" | "titleNumberOfLines" | "descriptionNumberOfLines" | "titleEllipsizeMode" | "descriptionEllipsizeMode"> & {
204 theme?: import("@callstack/react-theme-provider").$DeepPartial<ReactNativePaper.Theme> | undefined;
205}> & import("@callstack/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<$RemoveChildren<React.ComponentType<Pick<import("react-native").TouchableWithoutFeedbackProps & React.RefAttributes<import("react-native").TouchableWithoutFeedback> & {
206 borderless?: boolean | undefined;
207 background?: Object | undefined;
208 centered?: boolean | undefined;
209 disabled?: boolean | undefined;
210 onPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
211 onLongPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
212 rippleColor?: string | undefined;
213 underlayColor?: string | undefined;
214 children: React.ReactNode;
215 style?: StyleProp<ViewStyle>;
216 theme: ReactNativePaper.Theme;
217}, keyof import("react-native").TouchableWithoutFeedbackProps | "background" | "borderless" | "rippleColor" | "underlayColor" | "centered" | keyof React.RefAttributes<import("react-native").TouchableWithoutFeedback>> & {
218 theme?: import("@callstack/react-theme-provider").$DeepPartial<ReactNativePaper.Theme> | undefined;
219}> & import("@callstack/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<import("react-native").TouchableWithoutFeedbackProps & React.RefAttributes<import("react-native").TouchableWithoutFeedback> & {
220 borderless?: boolean | undefined;
221 background?: Object | undefined;
222 centered?: boolean | undefined;
223 disabled?: boolean | undefined;
224 onPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
225 onLongPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
226 rippleColor?: string | undefined;
227 underlayColor?: string | undefined;
228 children: React.ReactNode;
229 style?: StyleProp<ViewStyle>;
230 theme: ReactNativePaper.Theme;
231}> & {
232 ({ style, background: _background, borderless, disabled: disabledProp, rippleColor, underlayColor: _underlayColor, children, theme, ...rest }: import("react-native").TouchableWithoutFeedbackProps & React.RefAttributes<import("react-native").TouchableWithoutFeedback> & {
233 borderless?: boolean | undefined;
234 background?: Object | undefined;
235 centered?: boolean | undefined;
236 disabled?: boolean | undefined;
237 onPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
238 onLongPress?: ((e: import("react-native").GestureResponderEvent) => void) | undefined;
239 rippleColor?: string | undefined;
240 underlayColor?: string | undefined;
241 children: React.ReactNode;
242 style?: StyleProp<ViewStyle>;
243 theme: ReactNativePaper.Theme;
244 }): JSX.Element;
245 supported: boolean;
246}, {}>> & {
247 /**
248 * Title text for the list item.
249 */
250 title: Title;
251 /**
252 * Description text for the list item or callback which returns a React element to display the description.
253 */
254 description?: Description;
255 /**
256 * Callback which returns a React element to display on the left side.
257 */
258 left?: ((props: {
259 color: string;
260 style: {
261 marginLeft: number;
262 marginRight: number;
263 marginVertical?: number | undefined;
264 };
265 }) => React.ReactNode) | undefined;
266 /**
267 * Callback which returns a React element to display on the right side.
268 */
269 right?: ((props: {
270 color: string;
271 style?: {
272 marginRight: number;
273 marginVertical?: number | undefined;
274 } | undefined;
275 }) => React.ReactNode) | undefined;
276 /**
277 * Function to execute on press.
278 */
279 onPress?: (() => void) | undefined;
280 /**
281 * @optional
282 */
283 theme: ReactNativePaper.Theme;
284 /**
285 * Style that is passed to the wrapping TouchableRipple element.
286 */
287 style?: StyleProp<ViewStyle>;
288 /**
289 * Style that is passed to Title element.
290 */
291 titleStyle?: StyleProp<TextStyle>;
292 /**
293 * Style that is passed to Description element.
294 */
295 descriptionStyle?: StyleProp<TextStyle>;
296 /**
297 * Truncate Title text such that the total number of lines does not
298 * exceed this number.
299 */
300 titleNumberOfLines?: number | undefined;
301 /**
302 * Truncate Description text such that the total number of lines does not
303 * exceed this number.
304 */
305 descriptionNumberOfLines?: number | undefined;
306 /**
307 * Ellipsize Mode for the Title. One of `'head'`, `'middle'`, `'tail'`, `'clip'`.
308 *
309 * See [`ellipsizeMode`](https://reactnative.dev/docs/text#ellipsizemode)
310 */
311 titleEllipsizeMode?: EllipsizeProp | undefined;
312 /**
313 * Ellipsize Mode for the Description. One of `'head'`, `'middle'`, `'tail'`, `'clip'`.
314 *
315 * See [`ellipsizeMode`](https://reactnative.dev/docs/text#ellipsizemode)
316 */
317 descriptionEllipsizeMode?: EllipsizeProp | undefined;
318}> & {
319 ({ left, right, title, description, onPress, theme, style, titleStyle, titleNumberOfLines, descriptionNumberOfLines, titleEllipsizeMode, descriptionEllipsizeMode, descriptionStyle, ...rest }: Props): JSX.Element;
320 displayName: string;
321}, {}>;
322export default _default;
323
\No newline at end of file