@react-native-ama/forms 1.1.0 → 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/FormField.js +0 -1
- package/dist/components/FormSwitch.d.ts +1 -1
- package/dist/components/TextInput.d.ts +3 -16
- package/dist/components/TextInput.js +2 -4
- package/dist/hooks/useTextInput.d.ts +22 -21
- package/dist/index.d.ts +4 -4
- package/package.json +4 -4
- package/src/components/FormField.tsx +0 -1
- package/src/components/FormSwitch.tsx +1 -1
- package/src/components/TextInput.tsx +13 -16
- package/src/hooks/useTextInput.ts +1 -1
- package/src/index.ts +4 -4
|
@@ -41,7 +41,6 @@ const useFormField_1 = require("../hooks/useFormField");
|
|
|
41
41
|
const FormField = (_a) => {
|
|
42
42
|
var { children, wrapInsideAccessibleView = true } = _a, props = __rest(_a, ["children", "wrapInsideAccessibleView"]);
|
|
43
43
|
const viewRef = React.useRef(null);
|
|
44
|
-
// @ts-ignore
|
|
45
44
|
const formProps = (0, useFormField_1.useFormField)(Object.assign({ hasFocusCallback: false, ref: viewRef }, props));
|
|
46
45
|
return wrapInsideAccessibleView ? (<react_native_1.TouchableWithoutFeedback {...props} ref={viewRef} {...formProps}>
|
|
47
46
|
<react_native_1.View accessible>{children}</react_native_1.View>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { SwitchListItemProps } from '@react-native-ama/react-native';
|
|
1
|
+
import { type SwitchListItemProps } from '@react-native-ama/react-native';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
export type FormSwitchProps = SwitchListItemProps;
|
|
4
4
|
export declare const FormSwitch: (props: FormSwitchProps) => React.JSX.Element;
|
|
@@ -1,26 +1,13 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { TextInput as RNTextInput, TextInputProps as RNTextInputProps } from 'react-native';
|
|
3
|
-
|
|
3
|
+
import { UseTextInput } from '../hooks/useTextInput';
|
|
4
|
+
export type TextInputProps = RNTextInputProps & Omit<UseTextInput, 'required' | 'accessibilityLabel'> & {
|
|
4
5
|
labelComponent: JSX.Element;
|
|
5
6
|
labelPosition?: 'beforeInput' | 'afterInput';
|
|
6
7
|
nextFormField?: React.RefObject<RNTextInput>;
|
|
7
8
|
id?: string;
|
|
8
9
|
nextFieldId?: string;
|
|
9
|
-
hasValidation: boolean;
|
|
10
10
|
errorComponent?: JSX.Element;
|
|
11
|
-
hasError?: boolean;
|
|
12
11
|
errorPosition?: 'belowLabel' | 'afterInput';
|
|
13
|
-
errorMessage?: string;
|
|
14
12
|
};
|
|
15
|
-
export declare const TextInput: React.ForwardRefExoticComponent<
|
|
16
|
-
labelComponent: JSX.Element;
|
|
17
|
-
labelPosition?: "beforeInput" | "afterInput" | undefined;
|
|
18
|
-
nextFormField?: React.RefObject<RNTextInput> | undefined;
|
|
19
|
-
id?: string | undefined;
|
|
20
|
-
nextFieldId?: string | undefined;
|
|
21
|
-
hasValidation: boolean;
|
|
22
|
-
errorComponent?: JSX.Element | undefined;
|
|
23
|
-
hasError?: boolean | undefined;
|
|
24
|
-
errorPosition?: "afterInput" | "belowLabel" | undefined;
|
|
25
|
-
errorMessage?: string | undefined;
|
|
26
|
-
} & React.RefAttributes<RNTextInput>>;
|
|
13
|
+
export declare const TextInput: React.ForwardRefExoticComponent<Omit<TextInputProps, "ref"> & React.RefAttributes<RNTextInput>>;
|
|
@@ -49,12 +49,10 @@ exports.TextInput = React.forwardRef((_a, forwardedRef) => {
|
|
|
49
49
|
React.useImperativeHandle(forwardedRef, () => inputRef.current);
|
|
50
50
|
const showLabelBeforeInput = labelPosition === 'beforeInput';
|
|
51
51
|
const accessibilityLabel = React.useMemo(() => (0, internal_2.maybeGenerateStringFromElement)(labelComponent, rest.accessibilityLabel), [labelComponent, rest.accessibilityLabel]);
|
|
52
|
-
|
|
53
|
-
const textInputProps = (0, useTextInput_1.useTextInput)(Object.assign({ required: false, ref: inputRef, id,
|
|
52
|
+
const textInputProps = (0, useTextInput_1.useTextInput)(Object.assign(Object.assign({}, rest), { ref: inputRef, id,
|
|
54
53
|
nextFieldId, nextFormFieldRef: nextFormField, hasError,
|
|
55
54
|
hasValidation,
|
|
56
|
-
errorMessage,
|
|
57
|
-
accessibilityLabel }, rest));
|
|
55
|
+
errorMessage, required: false, accessibilityLabel }));
|
|
58
56
|
const checks = __DEV__ ? core_2.useChecks === null || core_2.useChecks === void 0 ? void 0 : (0, core_2.useChecks)() : undefined;
|
|
59
57
|
__DEV__ &&
|
|
60
58
|
(checks === null || checks === void 0 ? void 0 : checks.noUndefinedProperty({
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import type { LayoutChangeEvent, NativeSyntheticEvent, ReturnKeyTypeOptions, StyleProp, TextInputSubmitEditingEventData, TextStyle, ViewStyle } from 'react-native';
|
|
3
3
|
import { UseFormField } from './useFormField';
|
|
4
|
-
type UseTextInput = Omit<UseFormField, 'hasFocusCallback'> & {
|
|
4
|
+
export type UseTextInput = Omit<UseFormField, 'hasFocusCallback'> & {
|
|
5
5
|
onLayout?: (event: LayoutChangeEvent) => void;
|
|
6
6
|
returnKeyType?: ReturnKeyTypeOptions;
|
|
7
7
|
onSubmitEditing?: (event: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void;
|
|
@@ -40,7 +40,7 @@ export declare const useTextInput: ({ onLayout, returnKeyType, onSubmitEditing,
|
|
|
40
40
|
onPressOut?: ((e: NativeSyntheticEvent<import("react-native").NativeTouchEvent>) => void) | undefined;
|
|
41
41
|
onFocus?: ((e: NativeSyntheticEvent<import("react-native").TextInputFocusEventData>) => void) | undefined;
|
|
42
42
|
onSelectionChange?: ((e: NativeSyntheticEvent<import("react-native").TextInputSelectionChangeEventData>) => void) | undefined;
|
|
43
|
-
onSubmitEditing?: ((e: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void) | undefined;
|
|
43
|
+
onSubmitEditing?: (((e: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void) & ((event: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void)) | undefined;
|
|
44
44
|
onScroll?: ((e: NativeSyntheticEvent<import("react-native").TextInputScrollEventData>) => void) | undefined;
|
|
45
45
|
onKeyPress?: ((e: NativeSyntheticEvent<import("react-native").TextInputKeyPressEventData>) => void) | undefined;
|
|
46
46
|
placeholder?: string | undefined;
|
|
@@ -64,7 +64,7 @@ export declare const useTextInput: ({ onLayout, returnKeyType, onSubmitEditing,
|
|
|
64
64
|
hitSlop?: number | import("react-native").Insets | null | undefined;
|
|
65
65
|
id?: string | undefined;
|
|
66
66
|
needsOffscreenAlphaCompositing?: boolean | undefined;
|
|
67
|
-
onLayout?: ((event: LayoutChangeEvent) => void) | undefined;
|
|
67
|
+
onLayout?: (((event: LayoutChangeEvent) => void) & ((event: LayoutChangeEvent) => void)) | undefined;
|
|
68
68
|
pointerEvents?: "box-none" | "none" | "box-only" | "auto" | undefined;
|
|
69
69
|
removeClippedSubviews?: boolean | undefined;
|
|
70
70
|
nativeID?: string | undefined;
|
|
@@ -171,20 +171,21 @@ export declare const useTextInput: ({ onLayout, returnKeyType, onSubmitEditing,
|
|
|
171
171
|
textAlignVertical?: "center" | "auto" | "top" | "bottom" | undefined;
|
|
172
172
|
showSoftInputOnFocus?: boolean | undefined;
|
|
173
173
|
verticalAlign?: "auto" | "top" | "bottom" | "middle" | undefined;
|
|
174
|
+
ref?: React.RefObject<any> | React.ForwardedRef<any> | undefined;
|
|
175
|
+
suppressError?: boolean | undefined;
|
|
176
|
+
hasValidation: boolean;
|
|
177
|
+
hasError?: boolean | undefined;
|
|
178
|
+
nextFieldId?: string | undefined;
|
|
179
|
+
nextFormFieldRef?: React.RefObject<any> | undefined;
|
|
180
|
+
errorMessage?: string | undefined;
|
|
181
|
+
requiredMessage?: string | undefined;
|
|
174
182
|
labelComponent?: JSX.Element | undefined;
|
|
175
183
|
labelPosition?: "beforeInput" | "afterInput" | undefined;
|
|
176
184
|
nextFormField?: React.RefObject<import("react-native").TextInput> | undefined;
|
|
177
|
-
nextFieldId?: string | undefined;
|
|
178
|
-
hasValidation: boolean;
|
|
179
185
|
errorComponent?: JSX.Element | undefined;
|
|
180
|
-
hasError?: boolean | undefined;
|
|
181
186
|
errorPosition?: "afterInput" | "belowLabel" | undefined;
|
|
182
|
-
errorMessage?: string | undefined;
|
|
183
187
|
focusNextFormField: () => void;
|
|
184
188
|
isLastField: () => boolean;
|
|
185
|
-
ref?: React.RefObject<any> | React.ForwardedRef<any> | undefined;
|
|
186
|
-
suppressError?: boolean | undefined;
|
|
187
|
-
nextFormFieldRef?: React.RefObject<any> | undefined;
|
|
188
189
|
} | {
|
|
189
190
|
allowFontScaling?: boolean | undefined;
|
|
190
191
|
autoCapitalize?: "none" | "sentences" | "words" | "characters" | undefined;
|
|
@@ -210,7 +211,7 @@ export declare const useTextInput: ({ onLayout, returnKeyType, onSubmitEditing,
|
|
|
210
211
|
onPressOut?: ((e: NativeSyntheticEvent<import("react-native").NativeTouchEvent>) => void) | undefined;
|
|
211
212
|
onFocus?: ((e: NativeSyntheticEvent<import("react-native").TextInputFocusEventData>) => void) | undefined;
|
|
212
213
|
onSelectionChange?: ((e: NativeSyntheticEvent<import("react-native").TextInputSelectionChangeEventData>) => void) | undefined;
|
|
213
|
-
onSubmitEditing?: ((e: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void) | undefined;
|
|
214
|
+
onSubmitEditing?: (((e: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void) & ((event: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void)) | undefined;
|
|
214
215
|
onScroll?: ((e: NativeSyntheticEvent<import("react-native").TextInputScrollEventData>) => void) | undefined;
|
|
215
216
|
onKeyPress?: ((e: NativeSyntheticEvent<import("react-native").TextInputKeyPressEventData>) => void) | undefined;
|
|
216
217
|
placeholder?: string | undefined;
|
|
@@ -225,7 +226,7 @@ export declare const useTextInput: ({ onLayout, returnKeyType, onSubmitEditing,
|
|
|
225
226
|
end?: number | undefined;
|
|
226
227
|
} | undefined;
|
|
227
228
|
selectionColor?: import("react-native").ColorValue | undefined;
|
|
228
|
-
style?:
|
|
229
|
+
style?: ViewStyle | undefined;
|
|
229
230
|
textAlign?: "center" | "left" | "right" | undefined;
|
|
230
231
|
testID?: string | undefined;
|
|
231
232
|
inputAccessoryViewID?: string | undefined;
|
|
@@ -235,7 +236,7 @@ export declare const useTextInput: ({ onLayout, returnKeyType, onSubmitEditing,
|
|
|
235
236
|
hitSlop?: number | import("react-native").Insets | null | undefined;
|
|
236
237
|
id?: string | undefined;
|
|
237
238
|
needsOffscreenAlphaCompositing?: boolean | undefined;
|
|
238
|
-
onLayout?: ((event: LayoutChangeEvent) => void) | undefined;
|
|
239
|
+
onLayout?: (((event: LayoutChangeEvent) => void) & ((event: LayoutChangeEvent) => void)) | undefined;
|
|
239
240
|
pointerEvents?: "box-none" | "none" | "box-only" | "auto" | undefined;
|
|
240
241
|
removeClippedSubviews?: boolean | undefined;
|
|
241
242
|
nativeID?: string | undefined;
|
|
@@ -342,19 +343,19 @@ export declare const useTextInput: ({ onLayout, returnKeyType, onSubmitEditing,
|
|
|
342
343
|
textAlignVertical?: "center" | "auto" | "top" | "bottom" | undefined;
|
|
343
344
|
showSoftInputOnFocus?: boolean | undefined;
|
|
344
345
|
verticalAlign?: "auto" | "top" | "bottom" | "middle" | undefined;
|
|
346
|
+
ref?: React.RefObject<any> | React.ForwardedRef<any> | undefined;
|
|
347
|
+
suppressError?: boolean | undefined;
|
|
348
|
+
hasValidation: boolean;
|
|
349
|
+
hasError?: boolean | undefined;
|
|
350
|
+
nextFieldId?: string | undefined;
|
|
351
|
+
nextFormFieldRef?: React.RefObject<any> | undefined;
|
|
352
|
+
errorMessage?: string | undefined;
|
|
353
|
+
requiredMessage?: string | undefined;
|
|
345
354
|
labelComponent?: JSX.Element | undefined;
|
|
346
355
|
labelPosition?: "beforeInput" | "afterInput" | undefined;
|
|
347
356
|
nextFormField?: React.RefObject<import("react-native").TextInput> | undefined;
|
|
348
|
-
nextFieldId?: string | undefined;
|
|
349
|
-
hasValidation: boolean;
|
|
350
357
|
errorComponent?: JSX.Element | undefined;
|
|
351
|
-
hasError?: boolean | undefined;
|
|
352
358
|
errorPosition?: "afterInput" | "belowLabel" | undefined;
|
|
353
|
-
errorMessage?: string | undefined;
|
|
354
359
|
focusNextFormField: () => void;
|
|
355
360
|
isLastField: () => boolean;
|
|
356
|
-
ref?: React.RefObject<any> | React.ForwardedRef<any> | undefined;
|
|
357
|
-
suppressError?: boolean | undefined;
|
|
358
|
-
nextFormFieldRef?: React.RefObject<any> | undefined;
|
|
359
361
|
};
|
|
360
|
-
export {};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { isFocused } from '@react-native-ama/internal';
|
|
3
|
-
import { FormActions, FormProps } from './components/Form';
|
|
3
|
+
import { FormActions, type FormProps } from './components/Form';
|
|
4
4
|
import { FormField, FormFieldProps } from './components/FormField';
|
|
5
5
|
import { FormSubmit, FormSubmitProps } from './components/FormSubmit';
|
|
6
6
|
import { FormSwitch, FormSwitchProps } from './components/FormSwitch';
|
|
@@ -11,8 +11,8 @@ type FormComponent = React.FunctionComponent<FormProps> & {
|
|
|
11
11
|
};
|
|
12
12
|
declare const Form: FormComponent;
|
|
13
13
|
export { Form, FormField, FormSubmit, FormSwitch };
|
|
14
|
-
export { TextInput } from './components/TextInput';
|
|
15
|
-
export { useFormField } from './hooks/useFormField';
|
|
16
|
-
export { useTextInput } from './hooks/useTextInput';
|
|
14
|
+
export { TextInput, type TextInputProps } from './components/TextInput';
|
|
15
|
+
export { useFormField, type UseFormField } from './hooks/useFormField';
|
|
16
|
+
export { useTextInput, type UseTextInput } from './hooks/useTextInput';
|
|
17
17
|
export { isFocused };
|
|
18
18
|
export { type FormProps, type FormActions, type FormFieldProps, type FormSubmitProps, type FormSwitchProps, };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-native-ama/forms",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.1",
|
|
4
4
|
"react-native": "src/index",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -23,9 +23,9 @@
|
|
|
23
23
|
"test": "jest"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@react-native-ama/core": "~1.1.
|
|
27
|
-
"@react-native-ama/internal": "~1.1.
|
|
28
|
-
"@react-native-ama/react-native": "~1.1.
|
|
26
|
+
"@react-native-ama/core": "~1.1.1",
|
|
27
|
+
"@react-native-ama/internal": "~1.1.1",
|
|
28
|
+
"@react-native-ama/react-native": "~1.1.1"
|
|
29
29
|
},
|
|
30
30
|
"peerDependencies": {
|
|
31
31
|
"react": "*",
|
|
@@ -8,20 +8,18 @@ import {
|
|
|
8
8
|
TextInputProps as RNTextInputProps,
|
|
9
9
|
} from 'react-native';
|
|
10
10
|
|
|
11
|
-
import { useTextInput } from '../hooks/useTextInput';
|
|
11
|
+
import { UseTextInput, useTextInput } from '../hooks/useTextInput';
|
|
12
12
|
|
|
13
|
-
export type TextInputProps = RNTextInputProps &
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
errorMessage?: string;
|
|
24
|
-
};
|
|
13
|
+
export type TextInputProps = RNTextInputProps &
|
|
14
|
+
Omit<UseTextInput, 'required' | 'accessibilityLabel'> & {
|
|
15
|
+
labelComponent: JSX.Element;
|
|
16
|
+
labelPosition?: 'beforeInput' | 'afterInput';
|
|
17
|
+
nextFormField?: React.RefObject<RNTextInput>;
|
|
18
|
+
id?: string;
|
|
19
|
+
nextFieldId?: string;
|
|
20
|
+
errorComponent?: JSX.Element;
|
|
21
|
+
errorPosition?: 'belowLabel' | 'afterInput';
|
|
22
|
+
};
|
|
25
23
|
|
|
26
24
|
export const TextInput = React.forwardRef<RNTextInput, TextInputProps>(
|
|
27
25
|
(
|
|
@@ -55,9 +53,8 @@ export const TextInput = React.forwardRef<RNTextInput, TextInputProps>(
|
|
|
55
53
|
[labelComponent, rest.accessibilityLabel],
|
|
56
54
|
);
|
|
57
55
|
|
|
58
|
-
// @ts-ignore
|
|
59
56
|
const textInputProps = useTextInput({
|
|
60
|
-
|
|
57
|
+
...rest,
|
|
61
58
|
ref: inputRef,
|
|
62
59
|
id,
|
|
63
60
|
nextFieldId,
|
|
@@ -65,8 +62,8 @@ export const TextInput = React.forwardRef<RNTextInput, TextInputProps>(
|
|
|
65
62
|
hasError,
|
|
66
63
|
hasValidation,
|
|
67
64
|
errorMessage,
|
|
65
|
+
required: false,
|
|
68
66
|
accessibilityLabel,
|
|
69
|
-
...rest,
|
|
70
67
|
});
|
|
71
68
|
|
|
72
69
|
const checks = __DEV__ ? useChecks?.() : undefined;
|
|
@@ -14,7 +14,7 @@ import type {
|
|
|
14
14
|
import { TextInputProps } from '../components/TextInput';
|
|
15
15
|
import { UseFormField, useFormField } from './useFormField';
|
|
16
16
|
|
|
17
|
-
type UseTextInput = Omit<UseFormField, 'hasFocusCallback'> & {
|
|
17
|
+
export type UseTextInput = Omit<UseFormField, 'hasFocusCallback'> & {
|
|
18
18
|
onLayout?: (event: LayoutChangeEvent) => void;
|
|
19
19
|
returnKeyType?: ReturnKeyTypeOptions;
|
|
20
20
|
onSubmitEditing?: (
|
package/src/index.ts
CHANGED
|
@@ -4,8 +4,8 @@ import { isFocused } from '@react-native-ama/internal';
|
|
|
4
4
|
|
|
5
5
|
import {
|
|
6
6
|
FormActions,
|
|
7
|
-
FormProps,
|
|
8
7
|
Form as FormProvider,
|
|
8
|
+
type FormProps,
|
|
9
9
|
} from './components/Form';
|
|
10
10
|
import { FormField, FormFieldProps } from './components/FormField';
|
|
11
11
|
import { FormSubmit, FormSubmitProps } from './components/FormSubmit';
|
|
@@ -26,11 +26,11 @@ Form.Switch = FormSwitch;
|
|
|
26
26
|
export { Form, FormField, FormSubmit, FormSwitch };
|
|
27
27
|
|
|
28
28
|
// Components
|
|
29
|
-
export { TextInput } from './components/TextInput';
|
|
29
|
+
export { TextInput, type TextInputProps } from './components/TextInput';
|
|
30
30
|
|
|
31
31
|
// Hooks
|
|
32
|
-
export { useFormField } from './hooks/useFormField';
|
|
33
|
-
export { useTextInput } from './hooks/useTextInput';
|
|
32
|
+
export { useFormField, type UseFormField } from './hooks/useFormField';
|
|
33
|
+
export { useTextInput, type UseTextInput } from './hooks/useTextInput';
|
|
34
34
|
|
|
35
35
|
// utils
|
|
36
36
|
export { isFocused };
|