@delightui/components 0.1.162-alpha.1 → 0.1.162-alpha.3
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/cjs/components/molecules/FormField/FormField.presenter.d.ts +1 -0
- package/dist/cjs/components/molecules/FormField/FormField.types.d.ts +39 -9
- package/dist/cjs/components/organisms/Form/Form.presenter.d.ts +2 -2
- package/dist/cjs/components/organisms/Form/Form.types.d.ts +80 -2
- package/dist/cjs/library.js +3 -3
- package/dist/cjs/library.js.map +1 -1
- package/dist/esm/components/molecules/FormField/FormField.presenter.d.ts +1 -0
- package/dist/esm/components/molecules/FormField/FormField.types.d.ts +39 -9
- package/dist/esm/components/organisms/Form/Form.presenter.d.ts +2 -2
- package/dist/esm/components/organisms/Form/Form.types.d.ts +80 -2
- package/dist/esm/library.js +3 -3
- package/dist/esm/library.js.map +1 -1
- package/dist/index.d.ts +120 -12
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -244,6 +244,32 @@ type FieldValidationFunction<TValue = FieldValue> = (value: TValue) => string |
|
|
|
244
244
|
* Returns error message string if invalid, undefined if valid
|
|
245
245
|
*/
|
|
246
246
|
type AsyncFieldValidationFunction<TValue = FieldValue> = (value: TValue) => Promise<string | undefined>;
|
|
247
|
+
/**
|
|
248
|
+
* @deprecated This type is deprecated and maintained for backwards compatibility only.
|
|
249
|
+
* Use the new FieldValidationFunction signature that returns error messages instead.
|
|
250
|
+
*
|
|
251
|
+
* Type representing a validation function for a form field
|
|
252
|
+
* It takes an error setter function and the field value (optional) and returns a boolean indicating if the value is valid
|
|
253
|
+
* @example
|
|
254
|
+
* ```typescript
|
|
255
|
+
* const nameValidator: LegacyFieldValidationFunction = (setError, value) => {
|
|
256
|
+
* if (!value) {
|
|
257
|
+
* setError('Name is required');
|
|
258
|
+
* return false;
|
|
259
|
+
* }
|
|
260
|
+
* return true;
|
|
261
|
+
* };
|
|
262
|
+
* ```
|
|
263
|
+
*/
|
|
264
|
+
type LegacyFieldValidationFunction<T extends FieldValue = FieldValue> = (setError: (message: string) => void, value?: T) => boolean;
|
|
265
|
+
/**
|
|
266
|
+
* @deprecated This type is deprecated and maintained for backwards compatibility only.
|
|
267
|
+
* Use the new AsyncFieldValidationFunction signature that returns error messages instead.
|
|
268
|
+
*
|
|
269
|
+
* Type representing an async validation function for a form field
|
|
270
|
+
* It takes an error setter function and the field value (optional) and returns a Promise<boolean> indicating if the value is valid
|
|
271
|
+
*/
|
|
272
|
+
type LegacyAsyncFieldValidationFunction<T extends FieldValue = FieldValue> = (setError: (message: string) => void, value?: T) => Promise<boolean>;
|
|
247
273
|
/**
|
|
248
274
|
* FormField component props for use within a Form
|
|
249
275
|
*/
|
|
@@ -261,10 +287,10 @@ type FormFieldProps<TFieldValues extends FieldValues = FieldValues, TName extend
|
|
|
261
287
|
children: ReactNode;
|
|
262
288
|
/** Field is required */
|
|
263
289
|
required?: boolean;
|
|
264
|
-
/** Sync validation function */
|
|
265
|
-
validate?: FieldValidationFunction<PathValue<TFieldValues, TName>>;
|
|
266
|
-
/** Async validation function */
|
|
267
|
-
asyncValidate?: AsyncFieldValidationFunction<PathValue<TFieldValues, TName>>;
|
|
290
|
+
/** Sync validation function (supports both new and legacy signatures) */
|
|
291
|
+
validate?: FieldValidationFunction<PathValue<TFieldValues, TName>> | LegacyFieldValidationFunction<PathValue<TFieldValues, TName>>;
|
|
292
|
+
/** Async validation function (supports both new and legacy signatures) */
|
|
293
|
+
asyncValidate?: AsyncFieldValidationFunction<PathValue<TFieldValues, TName>> | LegacyAsyncFieldValidationFunction<PathValue<TFieldValues, TName>>;
|
|
268
294
|
/** Default value for this field */
|
|
269
295
|
defaultValue?: PathValue<TFieldValues, TName>;
|
|
270
296
|
/** Info message to display */
|
|
@@ -277,11 +303,13 @@ type FormFieldProps<TFieldValues extends FieldValues = FieldValues, TName extend
|
|
|
277
303
|
infoIcon?: ReactNode;
|
|
278
304
|
/** Field ID - for the input element */
|
|
279
305
|
id?: string;
|
|
306
|
+
/** @deprecated Legacy prop for backwards compatibility - use message prop instead */
|
|
307
|
+
hasMessage?: boolean;
|
|
280
308
|
};
|
|
281
309
|
/**
|
|
282
310
|
* Standalone FormField props (works without Form context)
|
|
283
311
|
*/
|
|
284
|
-
type StandaloneFieldProps<TValue = FieldValue> = Omit<HTMLAttributes<HTMLDivElement>, 'id' | 'children' | 'onChange'> & {
|
|
312
|
+
type StandaloneFieldProps<TValue extends FieldValue = FieldValue> = Omit<HTMLAttributes<HTMLDivElement>, 'id' | 'children' | 'onChange'> & {
|
|
285
313
|
/** Field name */
|
|
286
314
|
name: string;
|
|
287
315
|
/** Field label */
|
|
@@ -292,10 +320,10 @@ type StandaloneFieldProps<TValue = FieldValue> = Omit<HTMLAttributes<HTMLDivElem
|
|
|
292
320
|
children: ReactNode;
|
|
293
321
|
/** Field is required */
|
|
294
322
|
required?: boolean;
|
|
295
|
-
/** Sync validation function */
|
|
296
|
-
validate?: FieldValidationFunction<TValue>;
|
|
297
|
-
/** Async validation function */
|
|
298
|
-
asyncValidate?: AsyncFieldValidationFunction<TValue>;
|
|
323
|
+
/** Sync validation function (supports both new and legacy signatures) */
|
|
324
|
+
validate?: FieldValidationFunction<TValue> | LegacyFieldValidationFunction<TValue>;
|
|
325
|
+
/** Async validation function (supports both new and legacy signatures) */
|
|
326
|
+
asyncValidate?: AsyncFieldValidationFunction<TValue> | LegacyAsyncFieldValidationFunction<TValue>;
|
|
299
327
|
/** Controlled value */
|
|
300
328
|
value?: TValue;
|
|
301
329
|
/** Controlled onChange */
|
|
@@ -310,6 +338,8 @@ type StandaloneFieldProps<TValue = FieldValue> = Omit<HTMLAttributes<HTMLDivElem
|
|
|
310
338
|
infoIcon?: ReactNode;
|
|
311
339
|
/** Field ID - for the input element */
|
|
312
340
|
id?: string;
|
|
341
|
+
/** @deprecated Legacy prop for backwards compatibility - use message prop instead */
|
|
342
|
+
hasMessage?: boolean;
|
|
313
343
|
};
|
|
314
344
|
|
|
315
345
|
/**
|
|
@@ -1790,14 +1820,75 @@ declare const RadioGroup: (props: RadioGroupProps) => react_jsx_runtime.JSX.Elem
|
|
|
1790
1820
|
* Form submission handler
|
|
1791
1821
|
*/
|
|
1792
1822
|
type FormSubmitHandler<TFormValues extends FieldValues = FieldValues> = (values: TFormValues) => void | Promise<void>;
|
|
1823
|
+
/**
|
|
1824
|
+
* @deprecated This type is deprecated and maintained for backwards compatibility only.
|
|
1825
|
+
* Use the new FormSubmitHandler signature without setError instead.
|
|
1826
|
+
*
|
|
1827
|
+
* Type representing a function that handles form submission.
|
|
1828
|
+
* It takes updated form state and a function to set error messages for specific fields.
|
|
1829
|
+
*
|
|
1830
|
+
* @template T - The type of the form state, defaulting to FieldValues.
|
|
1831
|
+
*
|
|
1832
|
+
* @param {T} values - The updated form state values.
|
|
1833
|
+
* @param {(field: keyof T, errorMessage: string) => void} setError - A function to set error messages for specific fields.
|
|
1834
|
+
*
|
|
1835
|
+
* @example
|
|
1836
|
+
* ```typescript
|
|
1837
|
+
* const handleFormSubmit: LegacyFormSubmitHandler = (values, setError) => {
|
|
1838
|
+
* // Submit form data
|
|
1839
|
+
* console.log(values);
|
|
1840
|
+
* };
|
|
1841
|
+
* ```
|
|
1842
|
+
*/
|
|
1843
|
+
type LegacyFormSubmitHandler<T extends FieldValues = FieldValues> = (values: T, setError: (field: keyof T, errorMessage: string) => void) => void | Promise<void>;
|
|
1844
|
+
/**
|
|
1845
|
+
* @deprecated This type is deprecated and maintained for backwards compatibility only.
|
|
1846
|
+
* Use React Hook Form's built-in validation or field-level validation instead.
|
|
1847
|
+
*
|
|
1848
|
+
* Type representing a function that handles form state changes
|
|
1849
|
+
* It takes the new form state and an error setter function and doesn't return anything
|
|
1850
|
+
* @example
|
|
1851
|
+
* ```typescript
|
|
1852
|
+
* const handleFormStateChange: FormStateChangeHandler = (state, setError) => {
|
|
1853
|
+
* // Validate form state and set errors
|
|
1854
|
+
* if (!state.name) {
|
|
1855
|
+
* setError('name', 'Name is required');
|
|
1856
|
+
* }
|
|
1857
|
+
* };
|
|
1858
|
+
* ```
|
|
1859
|
+
*/
|
|
1860
|
+
type FormStateChangeHandler<T extends FieldValues = FieldValues> = (state: T, setError: (field: keyof T, errorMessage: string) => void) => void;
|
|
1861
|
+
/**
|
|
1862
|
+
* @deprecated This type is deprecated and maintained for backwards compatibility only.
|
|
1863
|
+
* Use React Hook Form's resolver or field-level validation instead.
|
|
1864
|
+
*
|
|
1865
|
+
* Type representing a function that validates the entire form
|
|
1866
|
+
* It takes the form values and an error setter function and returns a boolean indicating if the form is valid
|
|
1867
|
+
* @example
|
|
1868
|
+
* ```typescript
|
|
1869
|
+
* const validateForm: FormValidator = (state, setError) => {
|
|
1870
|
+
* let isValid = true;
|
|
1871
|
+
* if (!state.name) {
|
|
1872
|
+
* setError('name', 'Name is required');
|
|
1873
|
+
* isValid = false;
|
|
1874
|
+
* }
|
|
1875
|
+
* if (!state.age || typeof state.age !== 'number') {
|
|
1876
|
+
* setError('age', 'Age must be a number');
|
|
1877
|
+
* isValid = false;
|
|
1878
|
+
* }
|
|
1879
|
+
* return isValid;
|
|
1880
|
+
* };
|
|
1881
|
+
* ```
|
|
1882
|
+
*/
|
|
1883
|
+
type FormValidator<T extends FieldValues = FieldValues> = (state: T, setError: (field: keyof T, errorMessage: string) => void) => boolean;
|
|
1793
1884
|
/**
|
|
1794
1885
|
* Form component props
|
|
1795
1886
|
*/
|
|
1796
1887
|
type FormProps<TFormValues extends FieldValues = FieldValues> = Omit<FormHTMLAttributes<HTMLFormElement>, 'onSubmit' | 'ref'> & {
|
|
1797
1888
|
/** Initial form values (uncontrolled mode) */
|
|
1798
1889
|
defaultValues?: UseFormProps<TFormValues>['defaultValues'];
|
|
1799
|
-
/** Form submission handler - receives typed form values */
|
|
1800
|
-
onSubmit?: FormSubmitHandler<TFormValues>;
|
|
1890
|
+
/** Form submission handler - receives typed form values (supports both new and legacy signatures) */
|
|
1891
|
+
onSubmit?: FormSubmitHandler<TFormValues> | LegacyFormSubmitHandler<TFormValues>;
|
|
1801
1892
|
/** Enable autosave functionality */
|
|
1802
1893
|
autosave?: boolean;
|
|
1803
1894
|
/** Autosave debounce delay in milliseconds */
|
|
@@ -1808,6 +1899,23 @@ type FormProps<TFormValues extends FieldValues = FieldValues> = Omit<FormHTMLAtt
|
|
|
1808
1899
|
formOptions?: Omit<UseFormProps<TFormValues>, 'defaultValues' | 'mode'>;
|
|
1809
1900
|
/** Ref to the form element */
|
|
1810
1901
|
formRef?: React.Ref<HTMLFormElement>;
|
|
1902
|
+
/**
|
|
1903
|
+
* @deprecated Use defaultValues instead. This prop is maintained for backwards compatibility only.
|
|
1904
|
+
* Alias for defaultValues - initial form values
|
|
1905
|
+
*/
|
|
1906
|
+
formState?: UseFormProps<TFormValues>['defaultValues'];
|
|
1907
|
+
/**
|
|
1908
|
+
* @deprecated Use React Hook Form's useWatch hook or field-level validation instead.
|
|
1909
|
+
* This prop is maintained for backwards compatibility only.
|
|
1910
|
+
* Callback fired whenever form values change
|
|
1911
|
+
*/
|
|
1912
|
+
onFormStateChange?: FormStateChangeHandler<TFormValues>;
|
|
1913
|
+
/**
|
|
1914
|
+
* @deprecated Use React Hook Form's resolver or field-level validation instead.
|
|
1915
|
+
* This prop is maintained for backwards compatibility only.
|
|
1916
|
+
* Custom validator function for the entire form
|
|
1917
|
+
*/
|
|
1918
|
+
formValidator?: FormValidator<TFormValues>;
|
|
1811
1919
|
};
|
|
1812
1920
|
/**
|
|
1813
1921
|
* @deprecated Use FormProps instead
|
|
@@ -2786,4 +2894,4 @@ declare const NotificationContext: React__default.Context<NotificationContextVal
|
|
|
2786
2894
|
declare const NotificationProvider: React__default.FC<NotificationProviderProps>;
|
|
2787
2895
|
declare const useNotification: () => NotificationContextValue;
|
|
2788
2896
|
|
|
2789
|
-
export { type AccessibilityActions, type AccessibilityProps, Accordion, AccordionDetails, AccordionGroup, AccordionSummary, ActionCard, type ActionCardProps, ActionImage, type ActionImageProps, type AsyncFieldValidationFunction, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Breakpoint, type BreakpointProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Card, type CardProps, Checkbox, CheckboxItem, type CheckboxItemProps, type CheckboxLabelAlignmentEnum, type CheckboxProps, type CheckboxSizeEnum, type CheckboxTypeEnum, Chip, ChipInput, type ChipInputProps, type ChipProps, ConditionalView, type ConditionalViewProps, ContextMenu, type ContextMenuProps, type ControlledFormComponentProps, type CustomTimePickerConfig, CustomToggle, type CustomToggleProps, DateInput, type DateInputProps, DatePicker, type DatePickerProps, SortableItem as DraggableItem, SortableTrigger as DraggableItemTrigger, Dropzone, DropzoneClear, DropzoneContent, type DropzoneContentProps, type DropzoneContentTypeEnum, DropzoneFilename, DropzoneFilename as DropzonePreview, type DropzoneProps, DropzoneSupportedFormats as DropzoneReject, DropzoneTrigger as DropzoneRoot, DropzoneSupportedFormats, DropzoneTrigger, type FieldValidationFunction, type FieldValue, Form, FormField, type FormFieldProps, type FormProps, type FormProviderProps, type FormSubmitHandler, Grid, GridItem, type GridItemProps, GridList, type GridListProps, type GridProps, Icon, IconButton, type IconButtonProps, type IconButtonStyleEnum, type IconProps, type IconSizeEnum, type IconStyleEnum, Image, type ImageFitEnum, type ImageProps, Input, type InputProps, type InputTypeEnum, List, ListItem, type ListItemProps$1 as ListItemProps, type ListProps, Modal, type ModalComponentProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, type ModalProps, ModalProvider, type ModalProviderProps, Nav, NavItem, type NavItemProps, NavLink, type NavLinkProps, type NavProps, type Notification, type NotificationContainerProps, NotificationContext, type NotificationOffset, type NotificationPosition, NotificationProvider, type NotificationTrigger, Option, type OptionLike, type OptionLikeKey, type OptionProps, type OverlayDirectionEnum, Pagination, PaginationNumberField, type PaginationNumberFieldProps, type PaginationProps, Password, Popover, type PopoverHandle, type PopoverProps, ProgressBar, type ProgressBarProps, RadioButton, RadioButtonItem, type RadioButtonItemProps, type RadioButtonLabelAlignmentEnum, type RadioButtonProps, type RadioButtonSizeEnum, RadioGroup, type RadioGroupProps, RenderStateView, type RenderStateViewProps, RepeaterList, type RepeaterListProps, ResponsiveComponent, type ResponsiveComponentProps, Search, type SearchCallback, type SearchStyleEnum as SearchModeEnum, type SearchProps, Select, SelectListItem, type SelectListItemProps, type SelectProps, SelectProvider, SlideOutPanel, type SlideOutPanelDirectionEnum, type SlideOutPanelProps, type SlideOutPanelSizeEnum, Slider, type SliderProps, Spinner, type SpinnerProps, type StandaloneFieldProps, TabContent, type TabContentProps, TabItem, type TabItemProps, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableHeader, TableHeaderCell, type TableHeaderCellProps, type TableHeaderProps, type TableProps, TableRow, type TableRowProps, Tabs, type TabsProps, Text, TextArea, type TextAreaProps, type TextDecorationEnum, type TextProps, type TextTypeEnum, type TextWeightEnum, ThemeContext, type ThemeContextType, ThemeProvider, type ThemeProviderProps, Toggle, ToggleButton, type ToggleButtonProps, type ToggleLabelAlignmentEnum, type ToggleProps, Tooltip, type TooltipProps, type TriggerNotificationPayload, type UploadedFileMetadata, type UseModalReturn, WrapTextNodes, type WrapTextNodesProps, applyPropsToChildren, getClickAccessibilityProps, mergeRefs, useAutosave, useDebounce, useDropzoneContext, useInflateView, useModal, useNotification, useSelectContext, useTab };
|
|
2897
|
+
export { type AccessibilityActions, type AccessibilityProps, Accordion, AccordionDetails, AccordionGroup, AccordionSummary, ActionCard, type ActionCardProps, ActionImage, type ActionImageProps, type AsyncFieldValidationFunction, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Breakpoint, type BreakpointProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Card, type CardProps, Checkbox, CheckboxItem, type CheckboxItemProps, type CheckboxLabelAlignmentEnum, type CheckboxProps, type CheckboxSizeEnum, type CheckboxTypeEnum, Chip, ChipInput, type ChipInputProps, type ChipProps, ConditionalView, type ConditionalViewProps, ContextMenu, type ContextMenuProps, type ControlledFormComponentProps, type CustomTimePickerConfig, CustomToggle, type CustomToggleProps, DateInput, type DateInputProps, DatePicker, type DatePickerProps, SortableItem as DraggableItem, SortableTrigger as DraggableItemTrigger, Dropzone, DropzoneClear, DropzoneContent, type DropzoneContentProps, type DropzoneContentTypeEnum, DropzoneFilename, DropzoneFilename as DropzonePreview, type DropzoneProps, DropzoneSupportedFormats as DropzoneReject, DropzoneTrigger as DropzoneRoot, DropzoneSupportedFormats, DropzoneTrigger, type FieldValidationFunction, type FieldValue, Form, FormField, type FormFieldProps, type FormProps, type FormProviderProps, type FormSubmitHandler, Grid, GridItem, type GridItemProps, GridList, type GridListProps, type GridProps, Icon, IconButton, type IconButtonProps, type IconButtonStyleEnum, type IconProps, type IconSizeEnum, type IconStyleEnum, Image, type ImageFitEnum, type ImageProps, Input, type InputProps, type InputTypeEnum, type LegacyAsyncFieldValidationFunction, type LegacyFieldValidationFunction, List, ListItem, type ListItemProps$1 as ListItemProps, type ListProps, Modal, type ModalComponentProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, type ModalProps, ModalProvider, type ModalProviderProps, Nav, NavItem, type NavItemProps, NavLink, type NavLinkProps, type NavProps, type Notification, type NotificationContainerProps, NotificationContext, type NotificationOffset, type NotificationPosition, NotificationProvider, type NotificationTrigger, Option, type OptionLike, type OptionLikeKey, type OptionProps, type OverlayDirectionEnum, Pagination, PaginationNumberField, type PaginationNumberFieldProps, type PaginationProps, Password, Popover, type PopoverHandle, type PopoverProps, ProgressBar, type ProgressBarProps, RadioButton, RadioButtonItem, type RadioButtonItemProps, type RadioButtonLabelAlignmentEnum, type RadioButtonProps, type RadioButtonSizeEnum, RadioGroup, type RadioGroupProps, RenderStateView, type RenderStateViewProps, RepeaterList, type RepeaterListProps, ResponsiveComponent, type ResponsiveComponentProps, Search, type SearchCallback, type SearchStyleEnum as SearchModeEnum, type SearchProps, Select, SelectListItem, type SelectListItemProps, type SelectProps, SelectProvider, SlideOutPanel, type SlideOutPanelDirectionEnum, type SlideOutPanelProps, type SlideOutPanelSizeEnum, Slider, type SliderProps, Spinner, type SpinnerProps, type StandaloneFieldProps, TabContent, type TabContentProps, TabItem, type TabItemProps, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableHeader, TableHeaderCell, type TableHeaderCellProps, type TableHeaderProps, type TableProps, TableRow, type TableRowProps, Tabs, type TabsProps, Text, TextArea, type TextAreaProps, type TextDecorationEnum, type TextProps, type TextTypeEnum, type TextWeightEnum, ThemeContext, type ThemeContextType, ThemeProvider, type ThemeProviderProps, Toggle, ToggleButton, type ToggleButtonProps, type ToggleLabelAlignmentEnum, type ToggleProps, Tooltip, type TooltipProps, type TriggerNotificationPayload, type UploadedFileMetadata, type UseModalReturn, WrapTextNodes, type WrapTextNodesProps, applyPropsToChildren, getClickAccessibilityProps, mergeRefs, useAutosave, useDebounce, useDropzoneContext, useInflateView, useModal, useNotification, useSelectContext, useTab };
|