@payfit/unity-components 2.5.4 → 2.5.5
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/esm/components/form-field/parts/TanstackFormFeedbackText.js +11 -11
- package/dist/esm/components/form-field/parts/TanstackFormHelperText.js +9 -8
- package/dist/esm/components/password-field/TanstackPasswordField.d.ts +113 -0
- package/dist/esm/components/password-field/TanstackPasswordField.js +83 -0
- package/dist/esm/components/password-field/hooks/use-caps-lock.d.ts +5 -0
- package/dist/esm/components/password-field/hooks/use-caps-lock.js +12 -0
- package/dist/esm/components/password-field/parts/PasswordFieldDetails.d.ts +16 -0
- package/dist/esm/components/password-field/parts/PasswordFieldDetails.js +42 -0
- package/dist/esm/components/password-field/parts/PasswordInput.d.ts +25 -0
- package/dist/esm/components/password-field/parts/PasswordInput.js +188 -0
- package/dist/esm/components/password-field/parts/ValidationRuleItem.d.ts +16 -0
- package/dist/esm/components/password-field/parts/ValidationRuleItem.js +45 -0
- package/dist/esm/components/password-field/types.d.ts +12 -0
- package/dist/esm/hooks/use-tanstack-form.d.ts +6 -0
- package/dist/esm/hooks/use-tanstack-form.js +24 -19
- package/dist/esm/index.d.ts +2 -0
- package/dist/esm/index.js +51 -49
- package/dist/esm/utils/field-revalidate-logic.d.ts +55 -0
- package/dist/esm/utils/field-revalidate-logic.js +41 -0
- package/i18n/en-GB.json +9 -0
- package/i18n/es-ES.json +9 -0
- package/i18n/fr-FR.json +9 -0
- package/package.json +8 -7
|
@@ -39,6 +39,7 @@ export declare const useTanstackUnityForm: <TFormData, TOnMount extends import('
|
|
|
39
39
|
displayName: string;
|
|
40
40
|
};
|
|
41
41
|
readonly NumberField: import('react').ForwardRefExoticComponent<import('../components/number-field/TanstackNumberField.js').FieldProps & import('../components/number-input/TanstackNumberInput.js').TanstackNumberInputProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
42
|
+
readonly PasswordField: import('react').ForwardRefExoticComponent<import('../components/password-field/TanstackPasswordField.js').TanstackPasswordFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
42
43
|
readonly PhoneNumberField: import('react').ForwardRefExoticComponent<import('../components/phone-number-field/TanstackPhoneNumberField.js').PhoneNumberFieldProps & import('react').RefAttributes<unknown>>;
|
|
43
44
|
readonly RadioButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/radio-button-group-field/TanstackRadioButtonGroupField.js').TanstackRadioButtonGroupFieldProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
44
45
|
readonly SelectableButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/selectable-button-group/TanstackSelectableButtonGroup.js').TanstackSelectableButtonGroupProps & Pick<import('../index.js').LabelProps, "isRequired" | "requiredVariant"> & {
|
|
@@ -110,6 +111,7 @@ export declare const withForm: <TFormData, TOnMount extends import('@tanstack/fo
|
|
|
110
111
|
displayName: string;
|
|
111
112
|
};
|
|
112
113
|
readonly NumberField: import('react').ForwardRefExoticComponent<import('../components/number-field/TanstackNumberField.js').FieldProps & import('../components/number-input/TanstackNumberInput.js').TanstackNumberInputProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
114
|
+
readonly PasswordField: import('react').ForwardRefExoticComponent<import('../components/password-field/TanstackPasswordField.js').TanstackPasswordFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
113
115
|
readonly PhoneNumberField: import('react').ForwardRefExoticComponent<import('../components/phone-number-field/TanstackPhoneNumberField.js').PhoneNumberFieldProps & import('react').RefAttributes<unknown>>;
|
|
114
116
|
readonly RadioButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/radio-button-group-field/TanstackRadioButtonGroupField.js').TanstackRadioButtonGroupFieldProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
115
117
|
readonly SelectableButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/selectable-button-group/TanstackSelectableButtonGroup.js').TanstackSelectableButtonGroupProps & Pick<import('../index.js').LabelProps, "isRequired" | "requiredVariant"> & {
|
|
@@ -181,6 +183,7 @@ export declare const withForm: <TFormData, TOnMount extends import('@tanstack/fo
|
|
|
181
183
|
displayName: string;
|
|
182
184
|
};
|
|
183
185
|
readonly NumberField: import('react').ForwardRefExoticComponent<import('../components/number-field/TanstackNumberField.js').FieldProps & import('../components/number-input/TanstackNumberInput.js').TanstackNumberInputProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
186
|
+
readonly PasswordField: import('react').ForwardRefExoticComponent<import('../components/password-field/TanstackPasswordField.js').TanstackPasswordFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
184
187
|
readonly PhoneNumberField: import('react').ForwardRefExoticComponent<import('../components/phone-number-field/TanstackPhoneNumberField.js').PhoneNumberFieldProps & import('react').RefAttributes<unknown>>;
|
|
185
188
|
readonly RadioButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/radio-button-group-field/TanstackRadioButtonGroupField.js').TanstackRadioButtonGroupFieldProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
186
189
|
readonly SelectableButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/selectable-button-group/TanstackSelectableButtonGroup.js').TanstackSelectableButtonGroupProps & Pick<import('../index.js').LabelProps, "isRequired" | "requiredVariant"> & {
|
|
@@ -253,6 +256,7 @@ export declare const withFieldGroup: <TFieldGroupData, TSubmitMeta, TRenderProps
|
|
|
253
256
|
displayName: string;
|
|
254
257
|
};
|
|
255
258
|
readonly NumberField: import('react').ForwardRefExoticComponent<import('../components/number-field/TanstackNumberField.js').FieldProps & import('../components/number-input/TanstackNumberInput.js').TanstackNumberInputProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
259
|
+
readonly PasswordField: import('react').ForwardRefExoticComponent<import('../components/password-field/TanstackPasswordField.js').TanstackPasswordFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
256
260
|
readonly PhoneNumberField: import('react').ForwardRefExoticComponent<import('../components/phone-number-field/TanstackPhoneNumberField.js').PhoneNumberFieldProps & import('react').RefAttributes<unknown>>;
|
|
257
261
|
readonly RadioButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/radio-button-group-field/TanstackRadioButtonGroupField.js').TanstackRadioButtonGroupFieldProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
258
262
|
readonly SelectableButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/selectable-button-group/TanstackSelectableButtonGroup.js').TanstackSelectableButtonGroupProps & Pick<import('../index.js').LabelProps, "isRequired" | "requiredVariant"> & {
|
|
@@ -324,6 +328,7 @@ export declare const withFieldGroup: <TFieldGroupData, TSubmitMeta, TRenderProps
|
|
|
324
328
|
displayName: string;
|
|
325
329
|
};
|
|
326
330
|
readonly NumberField: import('react').ForwardRefExoticComponent<import('../components/number-field/TanstackNumberField.js').FieldProps & import('../components/number-input/TanstackNumberInput.js').TanstackNumberInputProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
331
|
+
readonly PasswordField: import('react').ForwardRefExoticComponent<import('../components/password-field/TanstackPasswordField.js').TanstackPasswordFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
327
332
|
readonly PhoneNumberField: import('react').ForwardRefExoticComponent<import('../components/phone-number-field/TanstackPhoneNumberField.js').PhoneNumberFieldProps & import('react').RefAttributes<unknown>>;
|
|
328
333
|
readonly RadioButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/radio-button-group-field/TanstackRadioButtonGroupField.js').TanstackRadioButtonGroupFieldProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
329
334
|
readonly SelectableButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/selectable-button-group/TanstackSelectableButtonGroup.js').TanstackSelectableButtonGroupProps & Pick<import('../index.js').LabelProps, "isRequired" | "requiredVariant"> & {
|
|
@@ -394,6 +399,7 @@ export declare const withFieldGroup: <TFieldGroupData, TSubmitMeta, TRenderProps
|
|
|
394
399
|
displayName: string;
|
|
395
400
|
};
|
|
396
401
|
readonly NumberField: import('react').ForwardRefExoticComponent<import('../components/number-field/TanstackNumberField.js').FieldProps & import('../components/number-input/TanstackNumberInput.js').TanstackNumberInputProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
402
|
+
readonly PasswordField: import('react').ForwardRefExoticComponent<import('../components/password-field/TanstackPasswordField.js').TanstackPasswordFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
397
403
|
readonly PhoneNumberField: import('react').ForwardRefExoticComponent<import('../components/phone-number-field/TanstackPhoneNumberField.js').PhoneNumberFieldProps & import('react').RefAttributes<unknown>>;
|
|
398
404
|
readonly RadioButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/radio-button-group-field/TanstackRadioButtonGroupField.js').TanstackRadioButtonGroupFieldProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
399
405
|
readonly SelectableButtonGroupField: import('react').ForwardRefExoticComponent<import('../components/selectable-button-group/TanstackSelectableButtonGroup.js').TanstackSelectableButtonGroupProps & Pick<import('../index.js').LabelProps, "isRequired" | "requiredVariant"> & {
|
|
@@ -20,13 +20,13 @@ const i = e(
|
|
|
20
20
|
() => import("../components/form-field/parts/TanstackFormLabel.js").then((t) => ({
|
|
21
21
|
default: t.TanstackFormLabel
|
|
22
22
|
}))
|
|
23
|
-
),
|
|
23
|
+
), s = e(
|
|
24
24
|
() => import("../components/form-field/parts/TanstackRawFormContextualLink.js").then(
|
|
25
25
|
(t) => ({
|
|
26
26
|
default: t.TanstackRawFormContextualLink
|
|
27
27
|
})
|
|
28
28
|
)
|
|
29
|
-
),
|
|
29
|
+
), p = e(
|
|
30
30
|
() => import("../components/form-field/TanstackFormField.js").then((t) => ({
|
|
31
31
|
default: t.TanstackFormField
|
|
32
32
|
}))
|
|
@@ -96,17 +96,17 @@ const i = e(
|
|
|
96
96
|
default: t.TanstackToggleSwitchGroup
|
|
97
97
|
})
|
|
98
98
|
)
|
|
99
|
-
),
|
|
99
|
+
), P = e(
|
|
100
100
|
() => import("../components/toggle-switch/TanstackToggleSwitch.js").then((t) => ({
|
|
101
101
|
default: t.TanstackToggleSwitch
|
|
102
102
|
}))
|
|
103
|
-
),
|
|
103
|
+
), B = e(
|
|
104
104
|
() => import("../components/checkbox-group-field/TanstackCheckGroupField.js").then(
|
|
105
105
|
(t) => ({
|
|
106
106
|
default: t.TanstackCheckGroupField
|
|
107
107
|
})
|
|
108
108
|
)
|
|
109
|
-
),
|
|
109
|
+
), N = e(
|
|
110
110
|
() => import("../components/date-picker-field/TanstackDatePickerField.js").then(
|
|
111
111
|
(t) => ({
|
|
112
112
|
default: t.TanstackDatePickerField
|
|
@@ -175,14 +175,18 @@ const i = e(
|
|
|
175
175
|
default: t.InlineFieldGroupEditView
|
|
176
176
|
}))
|
|
177
177
|
), K = e(
|
|
178
|
+
() => import("../components/password-field/TanstackPasswordField.js").then((t) => ({
|
|
179
|
+
default: t.TanstackPasswordField
|
|
180
|
+
}))
|
|
181
|
+
), O = e(
|
|
178
182
|
() => import("../components/inline-field/parts/InlineFieldEditView.js").then((t) => ({
|
|
179
183
|
default: t.InlineFieldEditView
|
|
180
184
|
}))
|
|
181
|
-
),
|
|
185
|
+
), Q = e(
|
|
182
186
|
() => import("../components/inline-field/parts/InlineFieldReadView.js").then((t) => ({
|
|
183
187
|
default: t.InlineFieldReadView
|
|
184
188
|
}))
|
|
185
|
-
),
|
|
189
|
+
), W = e(
|
|
186
190
|
() => import("../components/inline-field/InlineField.js").then((t) => ({
|
|
187
191
|
default: t.InlineField
|
|
188
192
|
}))
|
|
@@ -192,8 +196,8 @@ const i = e(
|
|
|
192
196
|
FieldFeedbackText: r,
|
|
193
197
|
FieldHelperText: d,
|
|
194
198
|
FieldLabel: u,
|
|
195
|
-
FieldRawContextualLink:
|
|
196
|
-
Field:
|
|
199
|
+
FieldRawContextualLink: s,
|
|
200
|
+
Field: p,
|
|
197
201
|
// bound input components
|
|
198
202
|
CheckboxGroupInput: k,
|
|
199
203
|
CheckboxInput: T,
|
|
@@ -209,13 +213,14 @@ const i = e(
|
|
|
209
213
|
TextAreaInput: w,
|
|
210
214
|
TextInput: g,
|
|
211
215
|
ToggleSwitchGroupInput: R,
|
|
212
|
-
ToggleSwitchInput:
|
|
216
|
+
ToggleSwitchInput: P,
|
|
213
217
|
// Field organisms
|
|
214
218
|
CheckboxField: i,
|
|
215
|
-
CheckboxGroupField:
|
|
216
|
-
DatePickerField:
|
|
219
|
+
CheckboxGroupField: B,
|
|
220
|
+
DatePickerField: N,
|
|
217
221
|
MultiSelectField: V,
|
|
218
222
|
NumberField: H,
|
|
223
|
+
PasswordField: K,
|
|
219
224
|
PhoneNumberField: b,
|
|
220
225
|
RadioButtonGroupField: D,
|
|
221
226
|
SelectableButtonGroupField: M,
|
|
@@ -226,9 +231,9 @@ const i = e(
|
|
|
226
231
|
ToggleSwitchField: z,
|
|
227
232
|
ToggleSwitchGroupField: U,
|
|
228
233
|
// Inline Edition components
|
|
229
|
-
InlineField:
|
|
230
|
-
InlineFieldReadView:
|
|
231
|
-
InlineFieldEditView:
|
|
234
|
+
InlineField: W,
|
|
235
|
+
InlineFieldReadView: Q,
|
|
236
|
+
InlineFieldEditView: O
|
|
232
237
|
},
|
|
233
238
|
formComponents: {
|
|
234
239
|
Form: o,
|
|
@@ -240,9 +245,9 @@ const i = e(
|
|
|
240
245
|
},
|
|
241
246
|
fieldContext: c,
|
|
242
247
|
formContext: l
|
|
243
|
-
}),
|
|
248
|
+
}), $ = a.useAppForm, tt = a.withForm, et = a.withFieldGroup;
|
|
244
249
|
export {
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
250
|
+
$ as useTanstackUnityForm,
|
|
251
|
+
et as withFieldGroup,
|
|
252
|
+
tt as withForm
|
|
248
253
|
};
|
package/dist/esm/index.d.ts
CHANGED
|
@@ -200,4 +200,6 @@ export * from './components/toggle-switch-group-field/ToggleSwitchGroupField.js'
|
|
|
200
200
|
export * from './hooks/use-tanstack-form.js';
|
|
201
201
|
export { useFormContext, useFieldContext } from './hooks/tanstack-form-context.js';
|
|
202
202
|
export { useFieldA11yContext } from './components/form-field/TanstackFormField.context.js';
|
|
203
|
+
export { fieldRevalidateLogic } from './utils/field-revalidate-logic.js';
|
|
204
|
+
export type { FieldRevalidateLogicProps } from './utils/field-revalidate-logic.js';
|
|
203
205
|
export * from './providers/router/RouterProvider.js';
|
package/dist/esm/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Actionable as r } from "./components/actionable/Actionable.js";
|
|
2
2
|
import { ActionBar as p, actionBar as a } from "./components/action-bar/ActionBar.js";
|
|
3
3
|
import { ActionBarAction as x } from "./components/action-bar/parts/ActionBarAction.js";
|
|
4
|
-
import { ActionBarRoot as
|
|
4
|
+
import { ActionBarRoot as n, actionBarRoot as i } from "./components/action-bar/parts/ActionBarRoot.js";
|
|
5
5
|
import { Alert as u } from "./components/alert/Alert.js";
|
|
6
6
|
import { AlertActions as g } from "./components/alert/parts/AlertActions.js";
|
|
7
7
|
import { AlertContent as b } from "./components/alert/parts/AlertContent.js";
|
|
@@ -12,7 +12,7 @@ import { AppMenu as A } from "./components/app-menu/AppMenu.js";
|
|
|
12
12
|
import { AppMenuContext as w, AppMenuContextProvider as R, useAppMenuContext as G } from "./components/app-menu/parts/AppMenu.context.js";
|
|
13
13
|
import { AppMenuFooter as I } from "./components/app-menu/parts/AppMenuFooter.js";
|
|
14
14
|
import { AppMenuHeader as D } from "./components/app-menu/parts/AppMenuHeader.js";
|
|
15
|
-
import { AppMenuNavContent as
|
|
15
|
+
import { AppMenuNavContent as M } from "./components/app-menu/parts/AppMenuNavContent.js";
|
|
16
16
|
import { Autocomplete as H } from "./components/autocomplete/Autocomplete.js";
|
|
17
17
|
import { AutocompleteItem as E, autocompleteItem as O } from "./components/autocomplete/parts/AutocompleteItem.js";
|
|
18
18
|
import { AutocompleteItemGroup as _, autocompleteItemGroup as U } from "./components/autocomplete/parts/AutocompleteItemGroup.js";
|
|
@@ -24,7 +24,7 @@ import { AvatarPair as Z } from "./components/avatar/parts/AvatarPair.js";
|
|
|
24
24
|
import { getInitials as oo } from "./components/avatar/utils.js";
|
|
25
25
|
import { Badge as ro } from "./components/badge/Badge.js";
|
|
26
26
|
import { BottomSheet as po, bottomSheet as ao } from "./components/bottom-sheet/BottomSheet.js";
|
|
27
|
-
import { BottomSheetContent as xo, bottomSheetContent as
|
|
27
|
+
import { BottomSheetContent as xo, bottomSheetContent as fo } from "./components/bottom-sheet/parts/BottomSheetContent.js";
|
|
28
28
|
import { BottomSheetFooter as io, bottomSheetFooter as lo } from "./components/bottom-sheet/parts/BottomSheetFooter.js";
|
|
29
29
|
import { BottomSheetHeader as go, bottomSheetHeader as co } from "./components/bottom-sheet/parts/BottomSheetHeader.js";
|
|
30
30
|
import { Breadcrumbs as so } from "./components/breadcrumbs/Breadcrumbs.js";
|
|
@@ -34,7 +34,7 @@ import { Button as Ao } from "./components/button/Button.js";
|
|
|
34
34
|
import { Card as wo, card as Ro } from "./components/card/Card.js";
|
|
35
35
|
import { CardTitle as ho } from "./components/card/parts/CardTitle.js";
|
|
36
36
|
import { CardContent as Lo } from "./components/card/parts/CardContent.js";
|
|
37
|
-
import { CheckboxGroup as
|
|
37
|
+
import { CheckboxGroup as vo, checkboxGroup as Mo } from "./components/checkbox-group/CheckboxGroup.js";
|
|
38
38
|
import { Checkbox as Ho } from "./components/checkbox/Checkbox.js";
|
|
39
39
|
import { CheckboxStandalone as Eo } from "./components/checkbox/CheckboxStandalone.js";
|
|
40
40
|
import { Collapsible as Vo } from "./components/collapsible/Collapsible.js";
|
|
@@ -47,7 +47,7 @@ import { DateCalendar as $o } from "./components/date-calendar/DateCalendar.js";
|
|
|
47
47
|
import { DatePicker as ee } from "./components/date-picker/DatePicker.js";
|
|
48
48
|
import { DefinitionTooltip as te } from "./components/definition-tooltip/DefinitionTooltip.js";
|
|
49
49
|
import { Dialog as ae, dialog as me } from "./components/dialog/Dialog.js";
|
|
50
|
-
import { DialogActions as
|
|
50
|
+
import { DialogActions as fe } from "./components/dialog/parts/DialogActions.js";
|
|
51
51
|
import { DialogButton as ie } from "./components/dialog/parts/DialogActions/DialogButton.js";
|
|
52
52
|
import { DialogContent as ue } from "./components/dialog/parts/DialogContent.js";
|
|
53
53
|
import { DialogTitle as ge } from "./components/dialog/parts/DialogTitle.js";
|
|
@@ -58,7 +58,7 @@ import { PromoDialogContent as Be } from "./components/promo-dialog/parts/PromoD
|
|
|
58
58
|
import { PromoDialogActions as ke } from "./components/promo-dialog/parts/PromoDialogActions.js";
|
|
59
59
|
import { PromoDialogTitle as Re } from "./components/promo-dialog/parts/PromoDialogTitle.js";
|
|
60
60
|
import { ErrorState as he, errorState as Ie } from "./components/error-state/ErrorState.js";
|
|
61
|
-
import { Fieldset as De, fieldset as
|
|
61
|
+
import { Fieldset as De, fieldset as ve } from "./components/fieldset/Fieldset.js";
|
|
62
62
|
import { FieldGroup as ye } from "./components/fieldset/parts/FieldGroup.js";
|
|
63
63
|
import { Filter as Ne, FilterControls as Ee, FilterLabels as Oe, filterContainer as Ve, filterDismissButton as _e } from "./components/filter/Filter.js";
|
|
64
64
|
import { FilterToolbar as Qe, filterToolbar as We } from "./components/filter-toolbar/FilterToolbar.js";
|
|
@@ -68,7 +68,7 @@ import { FlexItem as Ze, StackItem as $e } from "./components/flex/FlexItem.js";
|
|
|
68
68
|
import { Form as er } from "./components/form/Form.js";
|
|
69
69
|
import { FullPageLoader as tr, fullPageLoader as pr } from "./components/full-page-loader/FullPageLoader.js";
|
|
70
70
|
import { FunnelLayout as mr, funnelLayout as xr } from "./components/funnel-layout/FunnelLayout.js";
|
|
71
|
-
import { FunnelBody as
|
|
71
|
+
import { FunnelBody as nr, funnelBody as ir } from "./components/funnel-layout/parts/FunnelBody.js";
|
|
72
72
|
import { FunnelPage as ur, funnelPage as dr } from "./components/funnel-layout/parts/FunnelPage.js";
|
|
73
73
|
import { FunnelPageAction as cr } from "./components/funnel-layout/parts/FunnelPageAction.js";
|
|
74
74
|
import { FunnelPageActions as sr, funnelPageActions as Sr } from "./components/funnel-layout/parts/FunnelPageActions.js";
|
|
@@ -76,7 +76,7 @@ import { FunnelPageContent as Tr, funnelPageContent as Cr } from "./components/f
|
|
|
76
76
|
import { FunnelPageFooter as Br, funnelPageFooter as Ar } from "./components/funnel-layout/parts/FunnelPageFooter.js";
|
|
77
77
|
import { FunnelPageHeader as wr, funnelPageHeader as Rr } from "./components/funnel-layout/parts/FunnelPageHeader.js";
|
|
78
78
|
import { FunnelSidebar as hr, funnelSidebar as Ir } from "./components/funnel-layout/parts/FunnelSidebar.js";
|
|
79
|
-
import { FunnelTopBar as Dr, funnelTopBar as
|
|
79
|
+
import { FunnelTopBar as Dr, funnelTopBar as vr } from "./components/funnel-layout/parts/FunnelTopBar.js";
|
|
80
80
|
import { Grid as yr } from "./components/grid/Grid.js";
|
|
81
81
|
import { grid as Nr, gridItem as Er } from "./components/grid/Grid.variants.js";
|
|
82
82
|
import { GridItem as Vr } from "./components/grid/GridItem.js";
|
|
@@ -88,7 +88,7 @@ import { Label as Yr } from "./components/label/Label.js";
|
|
|
88
88
|
import { RawLink as $r, link as ot } from "./components/link/RawLink.js";
|
|
89
89
|
import { ListView as rt } from "./components/list-view/ListView.js";
|
|
90
90
|
import { RawListViewItem as pt, listViewItem as at } from "./components/list-view/parts/RawListViewItem.js";
|
|
91
|
-
import { ListViewSection as xt, listViewSection as
|
|
91
|
+
import { ListViewSection as xt, listViewSection as ft } from "./components/list-view/parts/ListViewSection.js";
|
|
92
92
|
import { ListViewItemLabel as it } from "./components/list-view/parts/ListViewItemLabel.js";
|
|
93
93
|
import { ListViewItemText as ut } from "./components/list-view/parts/ListViewItemText.js";
|
|
94
94
|
import { Menu as gt } from "./components/menu/Menu.js";
|
|
@@ -101,7 +101,7 @@ import { MultiSelect as wt } from "./components/multi-select/MultiSelect.js";
|
|
|
101
101
|
import { MultiSelectOptGroup as Gt } from "./components/multi-select/parts/MultiSelectOptGroup.js";
|
|
102
102
|
import { MultiSelectOption as It } from "./components/multi-select/parts/MultiSelectOption.js";
|
|
103
103
|
import { Nav as Dt } from "./components/nav/Nav.js";
|
|
104
|
-
import { NavGroup as
|
|
104
|
+
import { NavGroup as Mt } from "./components/nav/parts/NavGroup.js";
|
|
105
105
|
import { RawNavItem as Ht, navItemBase as Nt } from "./components/nav/parts/RawNavItem.js";
|
|
106
106
|
import { RawNavigationCard as Ot } from "./components/navigation-card/NavigationCard.js";
|
|
107
107
|
import { NavigationCardGroup as _t, navigationCardGroup as Ut } from "./components/navigation-card/parts/NavigationCardGroup.js";
|
|
@@ -112,7 +112,7 @@ import { Page as Yt, page as Zt } from "./components/page/Page.js";
|
|
|
112
112
|
import { PageHeader as op, pageHeader as ep } from "./components/page/parts/PageHeader.js";
|
|
113
113
|
import { PageHeading as tp } from "./components/page/parts/PageHeading.js";
|
|
114
114
|
import { Pagination as ap, pagination as mp } from "./components/pagination/Pagination.js";
|
|
115
|
-
import { PaginationContent as
|
|
115
|
+
import { PaginationContent as fp, paginationContent as np } from "./components/pagination/parts/PaginationContent.js";
|
|
116
116
|
import { PaginationItem as lp } from "./components/pagination/parts/PaginationItem.js";
|
|
117
117
|
import { RawPaginationLink as dp, paginationLink as gp } from "./components/pagination/parts/RawPaginationLink.js";
|
|
118
118
|
import { RawPaginationPrevious as bp } from "./components/pagination/parts/RawPaginationPrevious.js";
|
|
@@ -124,7 +124,7 @@ import { PayFitBrand as wp } from "./components/payfit-brand/PayFitBrand.js";
|
|
|
124
124
|
import { PayFitBrandPreprod as Gp } from "./components/payfit-brand/PayFitPreprod.js";
|
|
125
125
|
import { PhoneNumberInput as Ip } from "./components/phone-number/PhoneNumberInput.js";
|
|
126
126
|
import { Pill as Dp } from "./components/pill/Pill.js";
|
|
127
|
-
import { Popover as
|
|
127
|
+
import { Popover as Mp } from "./components/popover/Popover.js";
|
|
128
128
|
import { ProgressBar as Hp } from "./components/progress-bar/ProgressBar.js";
|
|
129
129
|
import { RadioButtonGroup as Ep } from "./components/radio-button-group/RadioButtonGroup.js";
|
|
130
130
|
import { RadioButton as Vp, radioButton as _p } from "./components/radio-button-group/parts/RadioButton.js";
|
|
@@ -136,7 +136,7 @@ import { SelectableButtonGroup as Zp, selectableButtonGroup as $p } from "./comp
|
|
|
136
136
|
import { SelectableButton as ea, selectableButton as ra } from "./components/selectable-button-group/parts/SelectableButton.js";
|
|
137
137
|
import { SelectableCardCheckboxGroup as pa } from "./components/selectable-card/selectable-card-checkbox-group/SelectableCardCheckboxGroup.js";
|
|
138
138
|
import { SelectableCardCheckbox as ma } from "./components/selectable-card/selectable-card-checkbox-group/parts/SelectableCardCheckbox.js";
|
|
139
|
-
import { SelectableCardRadioGroup as
|
|
139
|
+
import { SelectableCardRadioGroup as fa } from "./components/selectable-card/selectable-card-radio-group/SelectableCardRadioGroup.js";
|
|
140
140
|
import { SelectableCardRadio as ia } from "./components/selectable-card/selectable-card-radio-group/parts/SelectableCardRadio.js";
|
|
141
141
|
import { Select as ua } from "./components/select/Select.js";
|
|
142
142
|
import { SelectButton as ga } from "./components/select/parts/SelectButton.js";
|
|
@@ -147,7 +147,7 @@ import { SidePanel as Pa, sidePanel as Ba } from "./components/side-panel/SidePa
|
|
|
147
147
|
import { SidePanelContent as ka, sidePanelContent as wa } from "./components/side-panel/parts/SidePanelContent.js";
|
|
148
148
|
import { SidePanelFooter as Ga, sidePanelFooter as ha } from "./components/side-panel/parts/SidePanelFooter.js";
|
|
149
149
|
import { SidePanelHeader as La, sidePanelHeader as Da } from "./components/side-panel/parts/SidePanelHeader.js";
|
|
150
|
-
import { SkipLink as
|
|
150
|
+
import { SkipLink as Ma, SkipLinks as ya } from "./components/skip-links/SkipLinks.js";
|
|
151
151
|
import { Spinner as Na } from "./components/spinner/Spinner.js";
|
|
152
152
|
import { Table as Oa, TableRoot as Va } from "./components/table/Table.js";
|
|
153
153
|
import { TableBody as Ua, tableBody as Qa } from "./components/table/parts/TableBody.js";
|
|
@@ -155,7 +155,7 @@ import { TableCell as Xa, tableCell as ja } from "./components/table/parts/Table
|
|
|
155
155
|
import { TableColumnHeader as za, tableColumnHeader as Ja } from "./components/table/parts/TableColumnHeader.js";
|
|
156
156
|
import { TableEmptyState as Ya, TableEmptyStateError as Za, TableEmptyStateLoading as $a, TableEmptyStateNoData as om, TableEmptyStateText as em, tableEmptyState as rm } from "./components/table/parts/TableEmptyState.js";
|
|
157
157
|
import { TableHeader as pm, tableHeader as am } from "./components/table/parts/TableHeader.js";
|
|
158
|
-
import { TablePagination as xm, tablePagination as
|
|
158
|
+
import { TablePagination as xm, tablePagination as fm } from "./components/table/parts/TablePagination.js";
|
|
159
159
|
import { TableRow as im, tableRow as lm } from "./components/table/parts/TableRow.js";
|
|
160
160
|
import { Tabs as dm } from "./components/tabs/Tabs.js";
|
|
161
161
|
import { RawTab as cm } from "./components/tabs/parts/RawTab.js";
|
|
@@ -165,7 +165,7 @@ import { TaskMenu as Cm, taskMenu as Pm } from "./components/task-menu/TaskMenu.
|
|
|
165
165
|
import { RawSubTask as Am, rawSubTask as km } from "./components/task-menu/parts/RawSubTask.js";
|
|
166
166
|
import { RawTask as Rm, rawTask as Gm } from "./components/task-menu/parts/RawTask.js";
|
|
167
167
|
import { TaskGroup as Im } from "./components/task-menu/parts/TaskGroup.js";
|
|
168
|
-
import { TextArea as Dm, textArea as
|
|
168
|
+
import { TextArea as Dm, textArea as vm } from "./components/text-area/TextArea.js";
|
|
169
169
|
import { Text as ym } from "./components/text/Text.js";
|
|
170
170
|
import { text as Nm } from "./components/text/Text.variants.js";
|
|
171
171
|
import { TOAST_CONFIG as Om, ToastManager as Vm } from "./components/toast/ToastManager.js";
|
|
@@ -178,7 +178,7 @@ import { useContainerQueryLevel as ox } from "./hooks/use-container-query-level.
|
|
|
178
178
|
import { useMediaQuery as rx } from "./hooks/use-media-query.js";
|
|
179
179
|
import { useUnityForm as px } from "./hooks/use-form.js";
|
|
180
180
|
import { CheckboxField as mx } from "./components/checkbox-field/CheckboxField.js";
|
|
181
|
-
import { CheckboxGroupField as
|
|
181
|
+
import { CheckboxGroupField as fx } from "./components/checkbox-group-field/CheckboxGroupField.js";
|
|
182
182
|
import { DatePickerField as ix } from "./components/date-picker-field/DatePickerField.js";
|
|
183
183
|
import { FormField as ux } from "./components/form-field/FormField.js";
|
|
184
184
|
import { RawFormContextualLink as gx } from "./components/form-field/parts/RawFormContextualLink.js";
|
|
@@ -190,7 +190,7 @@ import { MultiSelectField as Ax } from "./components/multi-select-field/MultiSel
|
|
|
190
190
|
import { NumberField as wx, numberField as Rx } from "./components/number-field/NumberField.js";
|
|
191
191
|
import { RadioButtonGroupField as hx } from "./components/radio-button-group-field/RadioButtonGroupField.js";
|
|
192
192
|
import { SelectableButtonGroupField as Lx } from "./components/selectable-button-group-field/SelectableButtonGroupField.js";
|
|
193
|
-
import { SelectableCardCheckboxGroupField as
|
|
193
|
+
import { SelectableCardCheckboxGroupField as vx } from "./components/selectable-card-checkbox-group-field/SelectableCardCheckboxGroupField.js";
|
|
194
194
|
import { SelectableCardRadioGroupField as yx } from "./components/selectable-card-radio-group-field/SelectableCardRadioGroupField.js";
|
|
195
195
|
import { SelectField as Nx } from "./components/select-field/SelectField.js";
|
|
196
196
|
import { TextField as Ox } from "./components/text-field/TextField.js";
|
|
@@ -199,14 +199,15 @@ import { ToggleSwitchGroupField as Qx } from "./components/toggle-switch-group-f
|
|
|
199
199
|
import { useTanstackUnityForm as Xx, withFieldGroup as jx, withForm as qx } from "./hooks/use-tanstack-form.js";
|
|
200
200
|
import { useFieldContext as Jx, useFormContext as Kx } from "./hooks/tanstack-form-context.js";
|
|
201
201
|
import { useFieldA11yContext as Zx } from "./components/form-field/TanstackFormField.context.js";
|
|
202
|
-
import {
|
|
203
|
-
import {
|
|
204
|
-
import {
|
|
205
|
-
import {
|
|
202
|
+
import { fieldRevalidateLogic as of } from "./utils/field-revalidate-logic.js";
|
|
203
|
+
import { NoopRouterProvider as rf, RouterProvider as tf, useRouter as pf } from "./providers/router/RouterProvider.js";
|
|
204
|
+
import { DialogTrigger as mf, DialogTrigger as xf } from "react-aria-components";
|
|
205
|
+
import { FilterAdapters as nf } from "./components/filter-toolbar/utils/filter-adapters.js";
|
|
206
|
+
import { useAsyncList as uf } from "react-stately";
|
|
206
207
|
export {
|
|
207
208
|
p as ActionBar,
|
|
208
209
|
x as ActionBarAction,
|
|
209
|
-
|
|
210
|
+
n as ActionBarRoot,
|
|
210
211
|
r as Actionable,
|
|
211
212
|
u as Alert,
|
|
212
213
|
g as AlertActions,
|
|
@@ -219,7 +220,7 @@ export {
|
|
|
219
220
|
R as AppMenuContextProvider,
|
|
220
221
|
I as AppMenuFooter,
|
|
221
222
|
D as AppMenuHeader,
|
|
222
|
-
|
|
223
|
+
M as AppMenuNavContent,
|
|
223
224
|
H as Autocomplete,
|
|
224
225
|
E as AutocompleteItem,
|
|
225
226
|
_ as AutocompleteItemGroup,
|
|
@@ -242,8 +243,8 @@ export {
|
|
|
242
243
|
ho as CardTitle,
|
|
243
244
|
Ho as Checkbox,
|
|
244
245
|
mx as CheckboxField,
|
|
245
|
-
|
|
246
|
-
|
|
246
|
+
vo as CheckboxGroup,
|
|
247
|
+
fx as CheckboxGroupField,
|
|
247
248
|
Eo as CheckboxStandalone,
|
|
248
249
|
Wr as CircularIconButton,
|
|
249
250
|
Vo as Collapsible,
|
|
@@ -257,16 +258,16 @@ export {
|
|
|
257
258
|
ix as DatePickerField,
|
|
258
259
|
te as DefinitionTooltip,
|
|
259
260
|
ae as Dialog,
|
|
260
|
-
|
|
261
|
+
fe as DialogActions,
|
|
261
262
|
ie as DialogButton,
|
|
262
263
|
ue as DialogContent,
|
|
263
264
|
ge as DialogTitle,
|
|
264
|
-
|
|
265
|
+
mf as DialogTrigger,
|
|
265
266
|
he as ErrorState,
|
|
266
267
|
ye as FieldGroup,
|
|
267
268
|
De as Fieldset,
|
|
268
269
|
Ne as Filter,
|
|
269
|
-
|
|
270
|
+
nf as FilterAdapters,
|
|
270
271
|
Ee as FilterControls,
|
|
271
272
|
Oe as FilterLabels,
|
|
272
273
|
Qe as FilterToolbar,
|
|
@@ -279,7 +280,7 @@ export {
|
|
|
279
280
|
Tx as FormHelperText,
|
|
280
281
|
Px as FormLabel,
|
|
281
282
|
tr as FullPageLoader,
|
|
282
|
-
|
|
283
|
+
nr as FunnelBody,
|
|
283
284
|
mr as FunnelLayout,
|
|
284
285
|
ur as FunnelPage,
|
|
285
286
|
cr as FunnelPageAction,
|
|
@@ -309,26 +310,26 @@ export {
|
|
|
309
310
|
Gt as MultiSelectOptGroup,
|
|
310
311
|
It as MultiSelectOption,
|
|
311
312
|
Dt as Nav,
|
|
312
|
-
|
|
313
|
+
Mt as NavGroup,
|
|
313
314
|
jt as NavigationCardDescription,
|
|
314
315
|
_t as NavigationCardGroup,
|
|
315
316
|
Wt as NavigationCardLabel,
|
|
316
|
-
|
|
317
|
+
rf as NoopRouterProvider,
|
|
317
318
|
wx as NumberField,
|
|
318
319
|
zt as NumberInput,
|
|
319
320
|
Yt as Page,
|
|
320
321
|
op as PageHeader,
|
|
321
322
|
tp as PageHeading,
|
|
322
323
|
ap as Pagination,
|
|
323
|
-
|
|
324
|
+
fp as PaginationContent,
|
|
324
325
|
Tp as PaginationEllipsis,
|
|
325
326
|
lp as PaginationItem,
|
|
326
327
|
wp as PayFitBrand,
|
|
327
328
|
Gp as PayFitBrandPreprod,
|
|
328
329
|
Ip as PhoneNumberInput,
|
|
329
330
|
Dp as Pill,
|
|
330
|
-
|
|
331
|
-
|
|
331
|
+
Mp as Popover,
|
|
332
|
+
xf as PopoverTrigger,
|
|
332
333
|
Hp as ProgressBar,
|
|
333
334
|
be as PromoDialog,
|
|
334
335
|
ke as PromoDialogActions,
|
|
@@ -353,7 +354,7 @@ export {
|
|
|
353
354
|
Am as RawSubTask,
|
|
354
355
|
cm as RawTab,
|
|
355
356
|
Rm as RawTask,
|
|
356
|
-
|
|
357
|
+
tf as RouterProvider,
|
|
357
358
|
Xp as Search,
|
|
358
359
|
zp as SegmentedButtonGroup,
|
|
359
360
|
ua as Select,
|
|
@@ -367,15 +368,15 @@ export {
|
|
|
367
368
|
Lx as SelectableButtonGroupField,
|
|
368
369
|
ma as SelectableCardCheckbox,
|
|
369
370
|
pa as SelectableCardCheckboxGroup,
|
|
370
|
-
|
|
371
|
+
vx as SelectableCardCheckboxGroupField,
|
|
371
372
|
ia as SelectableCardRadio,
|
|
372
|
-
|
|
373
|
+
fa as SelectableCardRadioGroup,
|
|
373
374
|
yx as SelectableCardRadioGroupField,
|
|
374
375
|
Pa as SidePanel,
|
|
375
376
|
ka as SidePanelContent,
|
|
376
377
|
Ga as SidePanelFooter,
|
|
377
378
|
La as SidePanelHeader,
|
|
378
|
-
|
|
379
|
+
Ma as SkipLink,
|
|
379
380
|
ya as SkipLinks,
|
|
380
381
|
Na as Spinner,
|
|
381
382
|
qe as Stack,
|
|
@@ -414,16 +415,17 @@ export {
|
|
|
414
415
|
O as autocompleteItem,
|
|
415
416
|
U as autocompleteItemGroup,
|
|
416
417
|
ao as bottomSheet,
|
|
417
|
-
|
|
418
|
+
fo as bottomSheetContent,
|
|
418
419
|
lo as bottomSheetFooter,
|
|
419
420
|
co as bottomSheetHeader,
|
|
420
421
|
Ro as card,
|
|
421
|
-
|
|
422
|
+
Mo as checkboxGroup,
|
|
422
423
|
Xr as circularIconButton,
|
|
423
424
|
Jo as dataTableRoot,
|
|
424
425
|
me as dialog,
|
|
425
426
|
Ie as errorState,
|
|
426
|
-
|
|
427
|
+
of as fieldRevalidateLogic,
|
|
428
|
+
ve as fieldset,
|
|
427
429
|
Ve as filterContainer,
|
|
428
430
|
_e as filterDismissButton,
|
|
429
431
|
We as filterToolbar,
|
|
@@ -438,13 +440,13 @@ export {
|
|
|
438
440
|
Ar as funnelPageFooter,
|
|
439
441
|
Rr as funnelPageHeader,
|
|
440
442
|
Ir as funnelSidebar,
|
|
441
|
-
|
|
443
|
+
vr as funnelTopBar,
|
|
442
444
|
oo as getInitials,
|
|
443
445
|
Nr as grid,
|
|
444
446
|
Er as gridItem,
|
|
445
447
|
ot as link,
|
|
446
448
|
at as listViewItem,
|
|
447
|
-
|
|
449
|
+
ft as listViewSection,
|
|
448
450
|
Nt as navItemBase,
|
|
449
451
|
Ut as navigationCardGroup,
|
|
450
452
|
Rx as numberField,
|
|
@@ -452,7 +454,7 @@ export {
|
|
|
452
454
|
Zt as page,
|
|
453
455
|
ep as pageHeader,
|
|
454
456
|
mp as pagination,
|
|
455
|
-
|
|
457
|
+
np as paginationContent,
|
|
456
458
|
gp as paginationLink,
|
|
457
459
|
se as promoDialog,
|
|
458
460
|
_p as radioButton,
|
|
@@ -470,16 +472,16 @@ export {
|
|
|
470
472
|
Ja as tableColumnHeader,
|
|
471
473
|
rm as tableEmptyState,
|
|
472
474
|
am as tableHeader,
|
|
473
|
-
|
|
475
|
+
fm as tablePagination,
|
|
474
476
|
lm as tableRow,
|
|
475
477
|
Pm as taskMenu,
|
|
476
478
|
Nm as text,
|
|
477
|
-
|
|
479
|
+
vm as textArea,
|
|
478
480
|
Um as toast,
|
|
479
481
|
zm as toggleSwitch,
|
|
480
482
|
Xm as toggleSwitchGroup,
|
|
481
483
|
G as useAppMenuContext,
|
|
482
|
-
|
|
484
|
+
uf as useAsyncList,
|
|
483
485
|
Zm as useBreakpointListener,
|
|
484
486
|
ox as useContainerQueryLevel,
|
|
485
487
|
Zx as useFieldA11yContext,
|
|
@@ -488,7 +490,7 @@ export {
|
|
|
488
490
|
rx as useMediaQuery,
|
|
489
491
|
Ap as usePaginationState,
|
|
490
492
|
Pp as usePaginationWindow,
|
|
491
|
-
|
|
493
|
+
pf as useRouter,
|
|
492
494
|
Xx as useTanstackUnityForm,
|
|
493
495
|
px as useUnityForm,
|
|
494
496
|
jx as withFieldGroup,
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { ValidationLogicFn } from '@tanstack/form-core';
|
|
2
|
+
type ValidationEvent = 'blur' | 'change' | 'submit';
|
|
3
|
+
export interface FieldRevalidateLogicProps {
|
|
4
|
+
/** Event to trigger onDynamic when observed fields have not been blurred yet (default: 'blur') */
|
|
5
|
+
whenPristine?: ValidationEvent;
|
|
6
|
+
/** Event to trigger onDynamic after the first blur (default: 'change') */
|
|
7
|
+
whenDirty?: ValidationEvent;
|
|
8
|
+
/** Fields observed by this validation logic */
|
|
9
|
+
fields: string[];
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* A `ValidationLogicFn` that controls when `onDynamic` / `onDynamicAsync`
|
|
13
|
+
* validators fire based on per-field blur state.
|
|
14
|
+
*
|
|
15
|
+
* Before the first blur → `onDynamic` fires on `whenPristine` (default: `'blur'`).
|
|
16
|
+
* After the first blur → `onDynamic` fires on `whenDirty` (default: `'change'`).
|
|
17
|
+
*
|
|
18
|
+
* **Important**: Fields listed in `fields` **must** use `onDynamic` (or
|
|
19
|
+
* `onDynamicAsync`) as their sole validation mechanism and be **excluded**
|
|
20
|
+
* from form-level validation schemas (e.g. `onBlur`, `onChange`).
|
|
21
|
+
* Mixing `onDynamic` with other validators on the same field leads to
|
|
22
|
+
* stale errors because standard validators are not re-run outside their
|
|
23
|
+
* original event.
|
|
24
|
+
*
|
|
25
|
+
* Validators without `onDynamic` (e.g. other fields validated via
|
|
26
|
+
* form-level `onBlur` schemas) are delegated to `defaultValidationLogic`.
|
|
27
|
+
* @example
|
|
28
|
+
* ```tsx
|
|
29
|
+
* const form = useTanstackUnityForm({
|
|
30
|
+
* defaultValues: { password: '', email: '' },
|
|
31
|
+
* validationLogic: fieldRevalidateLogic({
|
|
32
|
+
* whenPristine: 'blur',
|
|
33
|
+
* whenDirty: 'change',
|
|
34
|
+
* fields: ['password'],
|
|
35
|
+
* }),
|
|
36
|
+
* // Form-level schema validates non-dynamic fields only.
|
|
37
|
+
* // The password field is excluded — it uses onDynamic instead.
|
|
38
|
+
* validators: { onBlur: z.object({ email: z.string().email() }) },
|
|
39
|
+
* })
|
|
40
|
+
*
|
|
41
|
+
* <form.AppField
|
|
42
|
+
* name="password"
|
|
43
|
+
* validators={{
|
|
44
|
+
* onDynamic: ({ value }) => {
|
|
45
|
+
* const result = passwordSchema.safeParse(value)
|
|
46
|
+
* return result.success ? undefined : result.error.issues[0].message
|
|
47
|
+
* },
|
|
48
|
+
* }}
|
|
49
|
+
* >
|
|
50
|
+
* {field => <field.PasswordField label="Password" />}
|
|
51
|
+
* </form.AppField>
|
|
52
|
+
* ```
|
|
53
|
+
*/
|
|
54
|
+
export declare const fieldRevalidateLogic: ({ whenPristine, whenDirty, }: FieldRevalidateLogicProps) => ValidationLogicFn;
|
|
55
|
+
export {};
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { defaultValidationLogic as l } from "@tanstack/form-core";
|
|
2
|
+
const m = {
|
|
3
|
+
change: ["change", "blur", "submit"],
|
|
4
|
+
blur: ["blur", "submit"],
|
|
5
|
+
submit: ["submit"]
|
|
6
|
+
}, v = ({
|
|
7
|
+
whenPristine: r = "blur",
|
|
8
|
+
whenDirty: d = "change"
|
|
9
|
+
}) => {
|
|
10
|
+
let n = !1;
|
|
11
|
+
return (a) => {
|
|
12
|
+
if (Object.keys(a.validators ?? {}).length === 0)
|
|
13
|
+
return a.runValidation({ validators: [], form: a.form });
|
|
14
|
+
const e = a.event.async ? a.validators?.onDynamicAsync : a.validators?.onDynamic;
|
|
15
|
+
if (!e)
|
|
16
|
+
return l(a);
|
|
17
|
+
a.event.type === "blur" && (n = !0);
|
|
18
|
+
const o = {
|
|
19
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TanStack FormValidators properties are typed as `any`
|
|
20
|
+
fn: e,
|
|
21
|
+
cause: "dynamic"
|
|
22
|
+
}, u = n ? d : r, t = [];
|
|
23
|
+
m[u].includes(a.event.type) && t.push(o);
|
|
24
|
+
let i = [];
|
|
25
|
+
return l({
|
|
26
|
+
...a,
|
|
27
|
+
runValidation: (c) => {
|
|
28
|
+
i = c.validators;
|
|
29
|
+
}
|
|
30
|
+
}), t.length === 0 ? a.runValidation({
|
|
31
|
+
validators: i,
|
|
32
|
+
form: a.form
|
|
33
|
+
}) : a.runValidation({
|
|
34
|
+
validators: [...i, ...t],
|
|
35
|
+
form: a.form
|
|
36
|
+
});
|
|
37
|
+
};
|
|
38
|
+
};
|
|
39
|
+
export {
|
|
40
|
+
v as fieldRevalidateLogic
|
|
41
|
+
};
|