1 | import * as React from 'react';
|
2 | import { TextInput as NativeTextInput, StyleProp, TextStyle } from 'react-native';
|
3 | import { Props as TextInputIconProps } from './Adornment/TextInputIcon';
|
4 | import { Props as TextInputAffixProps } from './Adornment/TextInputAffix';
|
5 | import type { RenderProps, TextInputLabelProp } from './types';
|
6 | export declare type TextInputProps = React.ComponentPropsWithRef<typeof NativeTextInput> & {
|
7 | |
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 |
|
14 |
|
15 | mode?: 'flat' | 'outlined';
|
16 | left?: React.ReactNode;
|
17 | right?: React.ReactNode;
|
18 | |
19 |
|
20 |
|
21 | disabled?: boolean;
|
22 | |
23 |
|
24 |
|
25 | label?: TextInputLabelProp;
|
26 | |
27 |
|
28 |
|
29 | placeholder?: string;
|
30 | |
31 |
|
32 |
|
33 | error?: boolean;
|
34 | |
35 |
|
36 |
|
37 | onChangeText?: Function;
|
38 | |
39 |
|
40 |
|
41 | selectionColor?: string;
|
42 | |
43 |
|
44 |
|
45 | underlineColor?: string;
|
46 | |
47 |
|
48 |
|
49 | activeUnderlineColor?: string;
|
50 | |
51 |
|
52 |
|
53 | outlineColor?: string;
|
54 | |
55 |
|
56 |
|
57 | activeOutlineColor?: string;
|
58 | |
59 |
|
60 |
|
61 |
|
62 |
|
63 |
|
64 |
|
65 | dense?: boolean;
|
66 | |
67 |
|
68 |
|
69 | multiline?: boolean;
|
70 | |
71 |
|
72 |
|
73 | numberOfLines?: number;
|
74 | |
75 |
|
76 |
|
77 | onFocus?: (args: any) => void;
|
78 | |
79 |
|
80 |
|
81 | onBlur?: (args: any) => void;
|
82 | |
83 |
|
84 |
|
85 |
|
86 |
|
87 |
|
88 |
|
89 |
|
90 |
|
91 |
|
92 |
|
93 |
|
94 |
|
95 |
|
96 |
|
97 |
|
98 |
|
99 |
|
100 | render?: (props: RenderProps) => React.ReactNode;
|
101 | |
102 |
|
103 |
|
104 | value?: string;
|
105 | |
106 |
|
107 |
|
108 |
|
109 |
|
110 |
|
111 |
|
112 | style?: StyleProp<TextStyle>;
|
113 | |
114 |
|
115 |
|
116 | theme: ReactNativePaper.Theme;
|
117 | };
|
118 | interface CompoundedComponent extends React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<TextInputHandles>> {
|
119 | Icon: React.FunctionComponent<TextInputIconProps>;
|
120 | Affix: React.FunctionComponent<Partial<TextInputAffixProps>>;
|
121 | }
|
122 | declare type TextInputHandles = Pick<NativeTextInput, 'focus' | 'clear' | 'blur' | 'isFocused' | 'setNativeProps'>;
|
123 | declare const _default: React.ComponentType<Pick<import("react-native").TextInputProps & React.RefAttributes<NativeTextInput> & {
|
124 | |
125 |
|
126 |
|
127 |
|
128 |
|
129 |
|
130 |
|
131 |
|
132 | mode?: "flat" | "outlined" | undefined;
|
133 | left?: React.ReactNode;
|
134 | right?: React.ReactNode;
|
135 | |
136 |
|
137 |
|
138 | disabled?: boolean | undefined;
|
139 | |
140 |
|
141 |
|
142 | label?: TextInputLabelProp | undefined;
|
143 | |
144 |
|
145 |
|
146 | placeholder?: string | undefined;
|
147 | |
148 |
|
149 |
|
150 | error?: boolean | undefined;
|
151 | |
152 |
|
153 |
|
154 | onChangeText?: Function | undefined;
|
155 | |
156 |
|
157 |
|
158 | selectionColor?: string | undefined;
|
159 | |
160 |
|
161 |
|
162 | underlineColor?: string | undefined;
|
163 | |
164 |
|
165 |
|
166 | activeUnderlineColor?: string | undefined;
|
167 | |
168 |
|
169 |
|
170 | outlineColor?: string | undefined;
|
171 | |
172 |
|
173 |
|
174 | activeOutlineColor?: string | undefined;
|
175 | |
176 |
|
177 |
|
178 |
|
179 |
|
180 |
|
181 |
|
182 | dense?: boolean | undefined;
|
183 | |
184 |
|
185 |
|
186 | multiline?: boolean | undefined;
|
187 | |
188 |
|
189 |
|
190 | numberOfLines?: number | undefined;
|
191 | |
192 |
|
193 |
|
194 | onFocus?: ((args: any) => void) | undefined;
|
195 | /**
|
196 | * Callback that is called when the text input is blurred.
|
197 | */
|
198 | onBlur?: ((args: any) => void) | undefined;
|
199 | /**
|
200 | *
|
201 | * Callback to render a custom input component such as `react-native-text-input-mask`
|
202 | * instead of the default `TextInput` component from `react-native`.
|
203 | *
|
204 | * Example:
|
205 | * ```js
|
206 | * <TextInput
|
207 | * label="Phone number"
|
208 | * render={props =>
|
209 | * <TextInputMask
|
210 | * {...props}
|
211 | * mask="+[00] [000] [000] [000]"
|
212 | * />
|
213 | * }
|
214 | * />
|
215 | * ```
|
216 | */
|
217 | render?: ((props: RenderProps) => React.ReactNode) | undefined;
|
218 | /**
|
219 | * Value of the text input.
|
220 | */
|
221 | value?: string | undefined;
|
222 | /**
|
223 | * Pass `fontSize` prop to modify the font size inside `TextInput`.
|
224 | * Pass `height` prop to set `TextInput` height. When `height` is passed,
|
225 | * `dense` prop will affect only input's `paddingVertical`.
|
226 | * Pass `paddingHorizontal` to modify horizontal padding.
|
227 | * This can be used to get MD Guidelines v1 TextInput look.
|
228 | */
|
229 | style?: StyleProp<TextStyle>;
|
230 | /**
|
231 | * @optional
|
232 | */
|
233 | theme: ReactNativePaper.Theme;
|
234 | } & React.RefAttributes<TextInputHandles>, "label" | "style" | "children" | "pointerEvents" | "allowFontScaling" | "numberOfLines" | "onLayout" | "onPressIn" | "onPressOut" | "testID" | "nativeID" | "maxFontSizeMultiplier" | "selectionColor" | "textBreakStrategy" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "left" | "right" | "ref" | "key" | "hitSlop" | "removeClippedSubviews" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "value" | "mode" | "textAlign" | "render" | "textAlignVertical" | "disabled" | "onBlur" | "onFocus" | "multiline" | "error" | "placeholder" | "onContentSizeChange" | "onScroll" | "scrollEnabled" | "autoCapitalize" | "autoCorrect" | "autoFocus" | "blurOnSubmit" | "caretHidden" | "contextMenuHidden" | "defaultValue" | "editable" | "keyboardType" | "maxLength" | "onChange" | "onChangeText" | "onEndEditing" | "onSelectionChange" | "onSubmitEditing" | "onTextInput" | "onKeyPress" | "placeholderTextColor" | "returnKeyType" | "secureTextEntry" | "selectTextOnFocus" | "selection" | "inputAccessoryViewID" | "clearButtonMode" | "clearTextOnFocus" | "dataDetectorTypes" | "enablesReturnKeyAutomatically" | "keyboardAppearance" | "passwordRules" | "rejectResponderTermination" | "selectionState" | "spellCheck" | "textContentType" | "autoComplete" | "importantForAutofill" | "disableFullscreenUI" | "inlineImageLeft" | "inlineImagePadding" | "returnKeyLabel" | "underlineColorAndroid" | "showSoftInputOnFocus" | "underlineColor" | "activeUnderlineColor" | "outlineColor" | "activeOutlineColor" | "dense"> & {
|
235 | theme?: import("@callstack/react-theme-provider").$DeepPartial<ReactNativePaper.Theme> | undefined;
|
236 | }> & import("@callstack/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics<React.ComponentType<import("react-native").TextInputProps & React.RefAttributes<NativeTextInput> & {
|
237 | /**
|
238 | * Mode of the TextInput.
|
239 | * - `flat` - flat input with an underline.
|
240 | * - `outlined` - input with an outline.
|
241 | *
|
242 | * In `outlined` mode, the background color of the label is derived from `colors.background` in theme or the `backgroundColor` style.
|
243 | * This component render TextInputOutlined or TextInputFlat based on that props
|
244 | */
|
245 | mode?: "flat" | "outlined" | undefined;
|
246 | left?: React.ReactNode;
|
247 | right?: React.ReactNode;
|
248 | /**
|
249 | * If true, user won't be able to interact with the component.
|
250 | */
|
251 | disabled?: boolean | undefined;
|
252 | /**
|
253 | * The text or component to use for the floating label.
|
254 | */
|
255 | label?: TextInputLabelProp | undefined;
|
256 | /**
|
257 | * Placeholder for the input.
|
258 | */
|
259 | placeholder?: string | undefined;
|
260 | /**
|
261 | * Whether to style the TextInput with error style.
|
262 | */
|
263 | error?: boolean | undefined;
|
264 | /**
|
265 | * Callback that is called when the text input's text changes. Changed text is passed as an argument to the callback handler.
|
266 | */
|
267 | onChangeText?: Function | undefined;
|
268 | /**
|
269 | * Selection color of the input
|
270 | */
|
271 | selectionColor?: string | undefined;
|
272 | /**
|
273 | * Inactive underline color of the input.
|
274 | */
|
275 | underlineColor?: string | undefined;
|
276 | /**
|
277 | * Active underline color of the input.
|
278 | */
|
279 | activeUnderlineColor?: string | undefined;
|
280 | /**
|
281 | * Inactive outline color of the input.
|
282 | */
|
283 | outlineColor?: string | undefined;
|
284 | /**
|
285 | * Active outline color of the input.
|
286 | */
|
287 | activeOutlineColor?: string | undefined;
|
288 | /**
|
289 | * Sets min height with densed layout. For `TextInput` in `flat` mode
|
290 | * height is `64dp` or in dense layout - `52dp` with label or `40dp` without label.
|
291 | * For `TextInput` in `outlined` mode
|
292 | * height is `56dp` or in dense layout - `40dp` regardless of label.
|
293 | * When you apply `height` prop in style the `dense` prop affects only `paddingVertical` inside `TextInput`
|
294 | */
|
295 | dense?: boolean | undefined;
|
296 | /**
|
297 | * Whether the input can have multiple lines.
|
298 | */
|
299 | multiline?: boolean | undefined;
|
300 | /**
|
301 | * The number of lines to show in the input (Android only).
|
302 | */
|
303 | numberOfLines?: number | undefined;
|
304 | /**
|
305 | * Callback that is called when the text input is focused.
|
306 | */
|
307 | onFocus?: ((args: any) => void) | undefined;
|
308 | /**
|
309 | * Callback that is called when the text input is blurred.
|
310 | */
|
311 | onBlur?: ((args: any) => void) | undefined;
|
312 | /**
|
313 | *
|
314 | * Callback to render a custom input component such as `react-native-text-input-mask`
|
315 | * instead of the default `TextInput` component from `react-native`.
|
316 | *
|
317 | * Example:
|
318 | * ```js
|
319 | * <TextInput
|
320 | * label="Phone number"
|
321 | * render={props =>
|
322 | * <TextInputMask
|
323 | * {...props}
|
324 | * mask="+[00] [000] [000] [000]"
|
325 | * />
|
326 | * }
|
327 | * />
|
328 | * ```
|
329 | */
|
330 | render?: ((props: RenderProps) => React.ReactNode) | undefined;
|
331 | /**
|
332 | * Value of the text input.
|
333 | */
|
334 | value?: string | undefined;
|
335 | /**
|
336 | * Pass `fontSize` prop to modify the font size inside `TextInput`.
|
337 | * Pass `height` prop to set `TextInput` height. When `height` is passed,
|
338 | * `dense` prop will affect only input's `paddingVertical`.
|
339 | * Pass `paddingHorizontal` to modify horizontal padding.
|
340 | * This can be used to get MD Guidelines v1 TextInput look.
|
341 | */
|
342 | style?: StyleProp<TextStyle>;
|
343 | /**
|
344 | * @optional
|
345 | */
|
346 | theme: ReactNativePaper.Theme;
|
347 | } & React.RefAttributes<TextInputHandles>> & CompoundedComponent, {}>;
|
348 | export default _default;
|
349 |
|
\ | No newline at end of file |