@oneplatformdev/ui 0.1.99-beta.2 → 0.1.99-beta.201
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/.storybook/Wrappers.js.map +1 -1
- package/Accordion/Accordion.d.ts +1 -1
- package/Accordion/Accordion.d.ts.map +1 -1
- package/Accordion/Accordion.js +48 -26
- package/Accordion/Accordion.js.map +1 -1
- package/Alert/Alert.js.map +1 -1
- package/Alert/alertVariants.js.map +1 -1
- package/AlertDialog/AlertDialog.js.map +1 -1
- package/AlertDialog/AlertDialog.stories.js +2 -3
- package/AlertDialog/AlertDialog.stories.js.map +1 -1
- package/AlertDialog/AlertDialogRoot.d.ts.map +1 -1
- package/AlertDialog/AlertDialogRoot.js +23 -23
- package/AlertDialog/AlertDialogRoot.js.map +1 -1
- package/AreaChart/AreaChart.js.map +1 -1
- package/Aside/Aside.js.map +1 -1
- package/Aside/AsideSidebar.js.map +1 -1
- package/AspectRatio/AspectRatio.js.map +1 -1
- package/Avatar/Avatar.js.map +1 -1
- package/Badge/Badge.js.map +1 -1
- package/Badge/badgeVariants.d.ts +1 -1
- package/Badge/badgeVariants.js.map +1 -1
- package/Breadcrumb/Breadcrumb.js.map +1 -1
- package/Button/Button.d.ts +12 -6
- package/Button/Button.d.ts.map +1 -1
- package/Button/Button.js +46 -45
- package/Button/Button.js.map +1 -1
- package/Button/Button.stories.js +45 -53
- package/Button/Button.stories.js.map +1 -1
- package/Button/Button.types.d.ts +24 -1
- package/Button/Button.types.d.ts.map +1 -1
- package/Button/Button.utils.d.ts +3 -0
- package/Button/Button.utils.d.ts.map +1 -0
- package/Button/Button.utils.js +14 -0
- package/Button/Button.utils.js.map +1 -0
- package/Button/ButtonCounterBadge.d.ts +7 -0
- package/Button/ButtonCounterBadge.d.ts.map +1 -0
- package/Button/ButtonCounterBadge.js +20 -0
- package/Button/ButtonCounterBadge.js.map +1 -0
- package/Button/buttonVariants.d.ts +11 -20
- package/Button/buttonVariants.d.ts.map +1 -1
- package/Button/buttonVariants.js +76 -12
- package/Button/buttonVariants.js.map +1 -1
- package/Button/index.d.ts +1 -0
- package/Button/index.d.ts.map +1 -1
- package/Button/index.js +6 -3
- package/Button/index.js.map +1 -1
- package/ButtonIcon/ButtonIcon.d.ts +55 -0
- package/ButtonIcon/ButtonIcon.d.ts.map +1 -1
- package/ButtonIcon/ButtonIcon.js +69 -46
- package/ButtonIcon/ButtonIcon.js.map +1 -1
- package/ButtonIcon/ButtonIcon.stories.js +123 -78
- package/ButtonIcon/ButtonIcon.stories.js.map +1 -1
- package/ButtonIcon/ButtonIcon.types.d.ts +2 -1
- package/ButtonIcon/ButtonIcon.types.d.ts.map +1 -1
- package/ButtonIcon/buttonIconVariants.d.ts +1 -1
- package/ButtonIcon/buttonIconVariants.d.ts.map +1 -1
- package/ButtonIcon/buttonIconVariants.js +7 -6
- package/ButtonIcon/buttonIconVariants.js.map +1 -1
- package/CHANGELOG.md +2674 -1527
- package/Calendar/Calendar.js +0 -1
- package/Calendar/Calendar.js.map +1 -1
- package/Card/Card.js.map +1 -1
- package/Carousel/Carousel.js +6 -7
- package/Carousel/Carousel.js.map +1 -1
- package/Chart/Chart.js.map +1 -1
- package/Checkbox/Checkbox.d.ts.map +1 -1
- package/Checkbox/Checkbox.js +34 -33
- package/Checkbox/Checkbox.js.map +1 -1
- package/Checkbox/Checkbox.stories.js +108 -0
- package/Checkbox/Checkbox.stories.js.map +1 -0
- package/Collapsible/Collapsible.js.map +1 -1
- package/Combobox/Combobox.d.ts +1 -1
- package/Combobox/Combobox.d.ts.map +1 -1
- package/Combobox/Combobox.js +205 -192
- package/Combobox/Combobox.js.map +1 -1
- package/Combobox/Combobox.stories.js +212 -0
- package/Combobox/Combobox.stories.js.map +1 -0
- package/Combobox/Combobox.types.d.ts +34 -19
- package/Combobox/Combobox.types.d.ts.map +1 -1
- package/Combobox/ComboboxOptionItem.d.ts +4 -3
- package/Combobox/ComboboxOptionItem.d.ts.map +1 -1
- package/Combobox/ComboboxOptionItem.js +49 -22
- package/Combobox/ComboboxOptionItem.js.map +1 -1
- package/Combobox/ComboboxOptions.d.ts +2 -2
- package/Combobox/ComboboxOptions.d.ts.map +1 -1
- package/Combobox/ComboboxOptions.js +48 -49
- package/Combobox/ComboboxOptions.js.map +1 -1
- package/Command/Command.d.ts +6 -1
- package/Command/Command.d.ts.map +1 -1
- package/Command/Command.js +61 -47
- package/Command/Command.js.map +1 -1
- package/DataTable/DataTable.js +12 -13
- package/DataTable/DataTable.js.map +1 -1
- package/DataTable/DataTableColumnFilter.js +6 -7
- package/DataTable/DataTableColumnFilter.js.map +1 -1
- package/DataTable/useDataTable.js.map +1 -1
- package/DatePicker/DatePicker.js +12 -13
- package/DatePicker/DatePicker.js.map +1 -1
- package/Dialog/Dialog.d.ts +4 -1
- package/Dialog/Dialog.d.ts.map +1 -1
- package/Dialog/Dialog.js +70 -37
- package/Dialog/Dialog.js.map +1 -1
- package/Dialog/Dialog.stories.js +101 -0
- package/Dialog/Dialog.stories.js.map +1 -0
- package/Dialog/Dialog.types.d.ts +4 -0
- package/Dialog/Dialog.types.d.ts.map +1 -0
- package/Dialog/Dialog.types.js +2 -0
- package/Dialog/Dialog.types.js.map +1 -0
- package/Dialog/DialogOverlayScope.js.map +1 -1
- package/Dialog/index.d.ts +1 -0
- package/Dialog/index.d.ts.map +1 -1
- package/Drawer/Drawer.js.map +1 -1
- package/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/DropdownMenu/DropdownMenu.js +33 -20
- package/DropdownMenu/DropdownMenu.js.map +1 -1
- package/Dropzone/Dropzone.d.ts.map +1 -1
- package/Dropzone/Dropzone.js +46 -28
- package/Dropzone/Dropzone.js.map +1 -1
- package/Dropzone/Dropzone.stories.js +100 -0
- package/Dropzone/Dropzone.stories.js.map +1 -0
- package/Dropzone/Dropzone.types.js.map +1 -1
- package/Dropzone/DropzoneFilePreview.js.map +1 -1
- package/Dropzone/DropzoneSinglePickPreview.js.map +1 -1
- package/Dropzone/DropzoneUtils.js.map +1 -1
- package/Form/Form.d.ts.map +1 -1
- package/Form/Form.js +14 -15
- package/Form/Form.js.map +1 -1
- package/Form/FormRenderControl.d.ts +1 -1
- package/Form/FormRenderControl.d.ts.map +1 -1
- package/Form/FormRenderControl.js +53 -14
- package/Form/FormRenderControl.js.map +1 -1
- package/Form/FormRenderControl.types.d.ts +4 -1
- package/Form/FormRenderControl.types.d.ts.map +1 -1
- package/Form/Form_old.js +4 -5
- package/Form/Form_old.js.map +1 -1
- package/FormCheckbox/FormCheckbox.js +4 -4
- package/FormCheckbox/FormCheckbox.js.map +1 -1
- package/FormCombobox/FormCombobox.d.ts.map +1 -1
- package/FormCombobox/FormCombobox.js +15 -13
- package/FormCombobox/FormCombobox.js.map +1 -1
- package/FormDatePicker/FormDatePicker.d.ts.map +1 -1
- package/FormDatePicker/FormDatePicker.js +18 -16
- package/FormDatePicker/FormDatePicker.js.map +1 -1
- package/FormDropzone/FormDropzone.d.ts.map +1 -1
- package/FormDropzone/FormDropzone.js +13 -11
- package/FormDropzone/FormDropzone.js.map +1 -1
- package/FormInput/FormInput.d.ts.map +1 -1
- package/FormInput/FormInput.js +47 -27
- package/FormInput/FormInput.js.map +1 -1
- package/FormInput/FormInput.stories.js +61 -0
- package/FormInput/FormInput.stories.js.map +1 -0
- package/FormInput/FormInput.types.d.ts +1 -0
- package/FormInput/FormInput.types.d.ts.map +1 -1
- package/FormRadio/FormRadio.js.map +1 -1
- package/FormSelect/FormSelect.d.ts.map +1 -1
- package/FormSelect/FormSelect.js +19 -18
- package/FormSelect/FormSelect.js.map +1 -1
- package/FormTextarea/FormTextarea.d.ts.map +1 -1
- package/FormTextarea/FormTextarea.js +13 -11
- package/FormTextarea/FormTextarea.js.map +1 -1
- package/Header/Header.js.map +1 -1
- package/HoverCard/HoverCard.js.map +1 -1
- package/InfoBlock/InfoBlock.d.ts +7 -0
- package/InfoBlock/InfoBlock.d.ts.map +1 -0
- package/InfoBlock/InfoBlock.js +28 -0
- package/InfoBlock/InfoBlock.js.map +1 -0
- package/InfoBlock/InfoBlock.stories.js +50 -0
- package/InfoBlock/InfoBlock.stories.js.map +1 -0
- package/InfoBlock/InfoBlock.types.d.ts +9 -0
- package/InfoBlock/InfoBlock.types.d.ts.map +1 -0
- package/InfoBlock/InfoBlock.types.js +2 -0
- package/InfoBlock/InfoBlock.types.js.map +1 -0
- package/InfoBlock/index.d.ts +3 -0
- package/InfoBlock/index.d.ts.map +1 -0
- package/InfoBlock/index.js +5 -0
- package/InfoBlock/index.js.map +1 -0
- package/InfoBlock/infoBlockVariants.d.ts +6 -0
- package/InfoBlock/infoBlockVariants.d.ts.map +1 -0
- package/InfoBlock/infoBlockVariants.js +27 -0
- package/InfoBlock/infoBlockVariants.js.map +1 -0
- package/Input/Input.d.ts.map +1 -1
- package/Input/Input.js +80 -53
- package/Input/Input.js.map +1 -1
- package/Input/Input.types.d.ts +2 -0
- package/Input/Input.types.d.ts.map +1 -1
- package/Input/inputVariants.d.ts.map +1 -1
- package/Input/inputVariants.js +5 -4
- package/Input/inputVariants.js.map +1 -1
- package/InputOTP/InputOTP.d.ts.map +1 -1
- package/InputOTP/InputOTP.js.map +1 -1
- package/LICENSE +21 -21
- package/Label/Label.js.map +1 -1
- package/Label/labelVariants.js.map +1 -1
- package/LazyLoader/LazyLoader.js +4 -5
- package/LazyLoader/LazyLoader.js.map +1 -1
- package/LoadedIcon/LoadedIcon.d.ts.map +1 -1
- package/LoadedIcon/LoadedIcon.js +3 -1
- package/LoadedIcon/LoadedIcon.js.map +1 -1
- package/LoadingMask/LoadingMask.d.ts +1 -2
- package/LoadingMask/LoadingMask.d.ts.map +1 -1
- package/LoadingMask/LoadingMask.js +8 -8
- package/LoadingMask/LoadingMask.js.map +1 -1
- package/LoadingMask/LoadingMask.types.d.ts +1 -0
- package/LoadingMask/LoadingMask.types.d.ts.map +1 -1
- package/LoadingMask/RenderLoadingMask.js.map +1 -1
- package/LoadingProgress/LoadingProgress.js.map +1 -1
- package/LoadingProgress/loadingProgressVariants.js.map +1 -1
- package/Menubar/Menubar.js.map +1 -1
- package/NavigationMenu/NavigationMenu.js.map +1 -1
- package/NavigationMenu/navigationMenuVariants.js.map +1 -1
- package/Pagination/Pagination.js +0 -1
- package/Pagination/Pagination.js.map +1 -1
- package/Popover/Popover.js.map +1 -1
- package/Progress/Progress.js.map +1 -1
- package/README.md +7 -7
- package/Radio/Radio.js.map +1 -1
- package/RadioGroup/RadioGroup.js.map +1 -1
- package/Resizable/Resizable.d.ts +5 -20
- package/Resizable/Resizable.d.ts.map +1 -1
- package/Resizable/Resizable.js +48 -31
- package/Resizable/Resizable.js.map +1 -1
- package/Resizable/Resizable.stories.js +140 -0
- package/Resizable/Resizable.stories.js.map +1 -0
- package/ScrollArea/ScrollArea.js.map +1 -1
- package/Search/Search.d.ts.map +1 -1
- package/Search/Search.js +40 -31
- package/Search/Search.js.map +1 -1
- package/Search/Search.stories.js +17 -0
- package/Search/Search.stories.js.map +1 -0
- package/Select/Select.d.ts.map +1 -1
- package/Select/Select.js +53 -49
- package/Select/Select.js.map +1 -1
- package/Select/Select.stories.js.map +1 -1
- package/Select/Select.types.d.ts +4 -0
- package/Select/Select.types.d.ts.map +1 -1
- package/Select/SelectRoot.js +1 -1
- package/Select/SelectRoot.js.map +1 -1
- package/Separator/Separator.js.map +1 -1
- package/Sheet/Sheet.js.map +1 -1
- package/Sidebar/Sidebar.js +20 -21
- package/Sidebar/Sidebar.js.map +1 -1
- package/Skeleton/Skeleton.js.map +1 -1
- package/Slider/Slider.js.map +1 -1
- package/Sonner/Sonner.js.map +1 -1
- package/Switch/Switch.js.map +1 -1
- package/Table/Table.js.map +1 -1
- package/TablePagination/TablePagination.js +17 -21
- package/TablePagination/TablePagination.js.map +1 -1
- package/Tabs/Tabs.js.map +1 -1
- package/Tabs/TabsRoot.js.map +1 -1
- package/Textarea/Textarea.d.ts.map +1 -1
- package/Textarea/Textarea.js +50 -45
- package/Textarea/Textarea.js.map +1 -1
- package/Textarea/Textarea.stories.js +12 -0
- package/Textarea/Textarea.stories.js.map +1 -0
- package/Textarea/Textarea.types.d.ts +3 -1
- package/Textarea/Textarea.types.d.ts.map +1 -1
- package/Textarea/useAutosizeTextArea.d.ts +1 -1
- package/Textarea/useAutosizeTextArea.d.ts.map +1 -1
- package/Textarea/useAutosizeTextArea.js.map +1 -1
- package/Theme/ThemeModeToggle.js +3 -4
- package/Theme/ThemeModeToggle.js.map +1 -1
- package/Theme/ThemeProvider.js.map +1 -1
- package/Toast/Toast.d.ts +1 -1
- package/Toast/Toast.js.map +1 -1
- package/Toast/toast.constants.js.map +1 -1
- package/Toast/toastVariants.d.ts +1 -1
- package/Toast/toastVariants.js.map +1 -1
- package/Toast/useToast.js.map +1 -1
- package/Toaster/Toaster.js.map +1 -1
- package/Toggle/Toggle.js.map +1 -1
- package/ToggleGroup/ToggleGroup.js.map +1 -1
- package/Tooltip/Tooltip.d.ts.map +1 -1
- package/Tooltip/Tooltip.js +41 -29
- package/Tooltip/Tooltip.js.map +1 -1
- package/Tooltip/Tooltip.types.d.ts +1 -0
- package/Tooltip/Tooltip.types.d.ts.map +1 -1
- package/Tooltip/TooltipRoot.js.map +1 -1
- package/Tooltip/tooltipVariants.d.ts +4 -0
- package/Tooltip/tooltipVariants.d.ts.map +1 -0
- package/Tooltip/tooltipVariants.js +23 -0
- package/Tooltip/tooltipVariants.js.map +1 -0
- package/index.d.ts +1 -0
- package/index.d.ts.map +1 -1
- package/index.js +335 -330
- package/index.js.map +1 -1
- package/package.json +9 -5
- package/Button/Button.s.d.ts +0 -83
- package/Button/Button.s.d.ts.map +0 -1
- package/Button/Button.s.js +0 -163
- package/Button/Button.s.js.map +0 -1
package/Form/Form.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form.js","sources":["../../src/Form/Form.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport {\n Controller,\n FormProvider,\n useFormContext,\n useFormState,\n type ControllerProps,\n type FieldPath,\n type FieldValues,\n} from \"react-hook-form\"\n\nimport { cn } from \"@oneplatformdev/utils\"\nimport { Label } from \"../Label\"\n\nconst Form = FormProvider\n\ntype FormFieldContextValue<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = {\n name: TName\n}\n\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\n {} as FormFieldContextValue\n)\n\nconst FormField = <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n ...props\n }: ControllerProps<TFieldValues, TName>) => {\n return (\n <FormFieldContext.Provider value={{ name: props.name }}>\n <Controller {...props} />\n </FormFieldContext.Provider>\n )\n}\n\nconst useFormField = () => {\n const fieldContext = React.useContext(FormFieldContext)\n const itemContext = React.useContext(FormItemContext)\n const { getFieldState } = useFormContext()\n const formState = useFormState({ name: fieldContext.name })\n const fieldState = getFieldState(fieldContext.name, formState)\n\n if (!fieldContext) {\n throw new Error(\"useFormField should be used within <FormField>\")\n }\n\n const { id } = itemContext\n\n return {\n id,\n name: fieldContext.name,\n formItemId: `${id}-form-item`,\n formDescriptionId: `${id}-form-item-description`,\n formMessageId: `${id}-form-item-message`,\n ...fieldState,\n }\n}\n\ntype FormItemContextValue = {\n id: string\n}\n\nconst FormItemContext = React.createContext<FormItemContextValue>(\n {} as FormItemContextValue\n)\n\nfunction FormItem({ className, ...props }: React.ComponentProps<\"div\">) {\n const id = React.useId()\n\n return (\n <FormItemContext.Provider value={{ id }}>\n <div\n data-slot=\"form-item\"\
|
|
1
|
+
{"version":3,"file":"Form.js","sources":["../../src/Form/Form.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\r\nimport { Slot } from \"@radix-ui/react-slot\"\r\nimport {\r\n Controller,\r\n FormProvider,\r\n useFormContext,\r\n useFormState,\r\n type ControllerProps,\r\n type FieldPath,\r\n type FieldValues,\r\n} from \"react-hook-form\"\r\n\r\nimport { cn } from \"@oneplatformdev/utils\"\r\nimport { Label } from \"../Label\"\r\n\r\nconst Form = FormProvider\r\n\r\ntype FormFieldContextValue<\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n> = {\r\n name: TName\r\n}\r\n\r\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\r\n {} as FormFieldContextValue\r\n)\r\n\r\nconst FormField = <\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\r\n>({\r\n ...props\r\n }: ControllerProps<TFieldValues, TName>) => {\r\n return (\r\n <FormFieldContext.Provider value={{ name: props.name }}>\r\n <Controller {...props} />\r\n </FormFieldContext.Provider>\r\n )\r\n}\r\n\r\nconst useFormField = () => {\r\n const fieldContext = React.useContext(FormFieldContext)\r\n const itemContext = React.useContext(FormItemContext)\r\n const { getFieldState } = useFormContext()\r\n const formState = useFormState({ name: fieldContext.name })\r\n const fieldState = getFieldState(fieldContext.name, formState)\r\n\r\n if (!fieldContext) {\r\n throw new Error(\"useFormField should be used within <FormField>\")\r\n }\r\n\r\n const { id } = itemContext\r\n\r\n return {\r\n id,\r\n name: fieldContext.name,\r\n formItemId: `${id}-form-item`,\r\n formDescriptionId: `${id}-form-item-description`,\r\n formMessageId: `${id}-form-item-message`,\r\n ...fieldState,\r\n }\r\n}\r\n\r\ntype FormItemContextValue = {\r\n id: string\r\n}\r\n\r\nconst FormItemContext = React.createContext<FormItemContextValue>(\r\n {} as FormItemContextValue\r\n)\r\n\r\nfunction FormItem({ className, ...props }: React.ComponentProps<\"div\">) {\r\n const id = React.useId()\r\n\r\n return (\r\n <FormItemContext.Provider value={{ id }}>\r\n <div\r\n data-slot=\"form-item\"\r\n className={cn(\"flex flex-col gap-2\", className)}\r\n {...props}\r\n />\r\n </FormItemContext.Provider>\r\n )\r\n}\r\n\r\nfunction FormLabel({\r\n className,\r\n ...props\r\n }: React.ComponentProps<typeof LabelPrimitive.Root>) {\r\n const { error, formItemId } = useFormField()\r\n\r\n return (\r\n <Label\r\n data-slot=\"form-label\"\r\n data-error={!!error}\r\n className={cn(\"data-[error=true]:text-destructive\", className)}\r\n htmlFor={formItemId}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction FormControl({ ...props }: React.ComponentProps<typeof Slot>) {\r\n const { error, formItemId, formDescriptionId, formMessageId } = useFormField()\r\n\r\n return (\r\n <Slot\r\n data-slot=\"form-control\"\r\n id={formItemId}\r\n aria-describedby={\r\n !error\r\n ? `${formDescriptionId}`\r\n : `${formDescriptionId} ${formMessageId}`\r\n }\r\n aria-invalid={!!error}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction FormDescription({ className, ...props }: React.ComponentProps<\"p\">) {\r\n const { formDescriptionId } = useFormField()\r\n\r\n return (\r\n <p\r\n data-slot=\"form-description\"\r\n id={formDescriptionId}\r\n className={cn(\"text-muted-foreground text-sm\", className)}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction FormMessage({ className, ...props }: React.ComponentProps<\"p\">) {\r\n const { error, formMessageId } = useFormField()\r\n const body = error ? String(error?.message ?? \"\") : props.children\r\n\r\n if (!body) {\r\n return null\r\n }\r\n\r\n return (\r\n <p\r\n data-slot=\"form-message\"\r\n id={formMessageId}\r\n className={cn(\"text-destructive text-sm\", className)}\r\n {...props}\r\n >\r\n {body}\r\n </p>\r\n )\r\n}\r\n\r\nexport {\r\n useFormField,\r\n Form,\r\n FormItem,\r\n FormLabel,\r\n FormControl,\r\n FormDescription,\r\n FormMessage,\r\n FormField,\r\n}\r\n"],"names":["Form","FormProvider","FormFieldContext","React","FormField","props","jsx","Controller","useFormField","fieldContext","itemContext","FormItemContext","getFieldState","useFormContext","formState","useFormState","fieldState","id","FormItem","className","cn","FormLabel","error","formItemId","Label","FormControl","formDescriptionId","formMessageId","Slot","FormDescription","FormMessage","body"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { FormRenderControlProps } from './FormRenderControl.types';
|
|
2
1
|
import { FieldValues } from 'react-hook-form';
|
|
2
|
+
import { FormRenderControlProps } from './FormRenderControl.types';
|
|
3
3
|
export declare const FormRenderControl: <Data extends FieldValues = FieldValues>(props: FormRenderControlProps<Data>) => import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
//# sourceMappingURL=FormRenderControl.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormRenderControl.d.ts","sourceRoot":"","sources":["../../src/Form/FormRenderControl.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FormRenderControl.d.ts","sourceRoot":"","sources":["../../src/Form/FormRenderControl.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAG9C,OAAO,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AAqCnE,eAAO,MAAM,iBAAiB,GAC5B,IAAI,SAAS,WAAW,GAAG,WAAW,EAEtC,OAAO,sBAAsB,CAAC,IAAI,CAAC,4CA+CpC,CAAC"}
|
|
@@ -1,22 +1,61 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { FormField as
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
import { jsx as e, jsxs as g } from "react/jsx-runtime";
|
|
2
|
+
import { FormField as u, FormItem as d, FormMessage as f, FormLabel as h } from "./Form.js";
|
|
3
|
+
import { cloneElement as F } from "react";
|
|
4
|
+
import { cn as l } from "@oneplatformdev/utils";
|
|
5
|
+
import { Tooltip as P } from "../Tooltip/Tooltip.js";
|
|
6
|
+
const b = (n) => {
|
|
7
|
+
const { label: t, tooltip: s, tooltipProps: r } = n, o = /* @__PURE__ */ e(h, { children: t });
|
|
8
|
+
return t ? s ? /* @__PURE__ */ e(
|
|
9
|
+
P,
|
|
7
10
|
{
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
message: s,
|
|
12
|
+
showQuestionMark: !0,
|
|
13
|
+
questionIconSize: "sm",
|
|
14
|
+
contentProps: {
|
|
15
|
+
side: "right",
|
|
16
|
+
align: "center"
|
|
17
|
+
},
|
|
18
|
+
...r,
|
|
19
|
+
triggerProps: {
|
|
20
|
+
...r?.triggerProps,
|
|
21
|
+
className: l("cursor-help", r?.triggerProps?.className)
|
|
22
|
+
},
|
|
23
|
+
children: F(o, { className: l("cursor-help", o.props.classNames) })
|
|
24
|
+
}
|
|
25
|
+
) : o : null;
|
|
26
|
+
}, M = (n) => {
|
|
27
|
+
const {
|
|
28
|
+
form: t,
|
|
29
|
+
name: s,
|
|
30
|
+
label: r,
|
|
31
|
+
tooltip: o,
|
|
32
|
+
tooltipProps: i,
|
|
33
|
+
render: m,
|
|
34
|
+
containerProps: p = {},
|
|
35
|
+
...c
|
|
36
|
+
} = n;
|
|
37
|
+
return /* @__PURE__ */ e(
|
|
38
|
+
u,
|
|
39
|
+
{
|
|
40
|
+
control: t.control,
|
|
41
|
+
name: s,
|
|
42
|
+
render: (a) => /* @__PURE__ */ g(d, { ...p, children: [
|
|
43
|
+
/* @__PURE__ */ e(
|
|
44
|
+
b,
|
|
45
|
+
{
|
|
46
|
+
label: r,
|
|
47
|
+
tooltip: o,
|
|
48
|
+
tooltipProps: i
|
|
49
|
+
}
|
|
50
|
+
),
|
|
51
|
+
m(a),
|
|
52
|
+
/* @__PURE__ */ e(f, {})
|
|
14
53
|
] }),
|
|
15
|
-
...
|
|
54
|
+
...c
|
|
16
55
|
}
|
|
17
56
|
);
|
|
18
57
|
};
|
|
19
58
|
export {
|
|
20
|
-
|
|
59
|
+
M as FormRenderControl
|
|
21
60
|
};
|
|
22
61
|
//# sourceMappingURL=FormRenderControl.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormRenderControl.js","sources":["../../src/Form/FormRenderControl.tsx"],"sourcesContent":["import { FormField, FormItem, FormLabel, FormMessage } from
|
|
1
|
+
{"version":3,"file":"FormRenderControl.js","sources":["../../src/Form/FormRenderControl.tsx"],"sourcesContent":["import { FieldValues } from \"react-hook-form\";\r\n\r\nimport { FormField, FormItem, FormLabel, FormMessage } from \"./Form\";\r\nimport { FormRenderControlProps } from \"./FormRenderControl.types\";\r\nimport { Tooltip } from \"../Tooltip\";\r\nimport { cloneElement } from \"react\";\r\nimport { cn } from \"@oneplatformdev/utils\";\r\n\r\ninterface IFormLabelWithTooltipProps<\r\n Data extends FieldValues = FieldValues,\r\n> extends Pick<FormRenderControlProps<Data>, 'label' | 'tooltip' | 'tooltipProps'> {\r\n}\r\n\r\nconst FormLabelWithTooltip = <\r\n Data extends FieldValues = FieldValues,\r\n>(props: IFormLabelWithTooltipProps<Data>) => {\r\n const { label, tooltip, tooltipProps } = props;\r\n const cmp = <FormLabel>{label}</FormLabel>;\r\n if (!label) return null;\r\n if (!tooltip) return cmp;\r\n return (\r\n <Tooltip\r\n message={tooltip}\r\n showQuestionMark\r\n questionIconSize=\"sm\"\r\n contentProps={{\r\n side: \"right\",\r\n align: \"center\"\r\n }}\r\n {...tooltipProps}\r\n triggerProps={{\r\n ...tooltipProps?.triggerProps,\r\n className: cn('cursor-help', tooltipProps?.triggerProps?.className),\r\n }}\r\n >\r\n {cloneElement(cmp, { className: cn('cursor-help', cmp.props.classNames) })}\r\n </Tooltip>\r\n )\r\n}\r\n\r\nexport const FormRenderControl = <\r\n Data extends FieldValues = FieldValues,\r\n>(\r\n props: FormRenderControlProps<Data>\r\n) => {\r\n const {\r\n form,\r\n name,\r\n label,\r\n tooltip,\r\n tooltipProps,\r\n render,\r\n containerProps = {},\r\n ...rest\r\n } = props;\r\n return (\r\n <FormField\r\n control={form.control}\r\n name={name}\r\n render={(params) => (\r\n <FormItem {...containerProps}>\r\n <FormLabelWithTooltip\r\n label={label}\r\n tooltip={tooltip}\r\n tooltipProps={tooltipProps}\r\n />\r\n {/*{(label || tooltip) && (*/}\r\n {/* <FormLabel className={cn(\"flex items-center gap-1\")}>*/}\r\n {/* {label && <span>{label}</span>}*/}\r\n {/* {tooltip && (*/}\r\n {/* <Tooltip*/}\r\n {/* message={tooltip}*/}\r\n {/* showQuestionMark*/}\r\n {/* questionIconSize=\"xs\"*/}\r\n {/* contentProps={{*/}\r\n {/* side: \"right\",*/}\r\n {/* align: \"center\"*/}\r\n {/* }}*/}\r\n {/* {...props.tooltipProps}*/}\r\n {/* />*/}\r\n {/* )}*/}\r\n {/* </FormLabel>*/}\r\n {/*)}*/}\r\n {render(params)}\r\n <FormMessage/>\r\n </FormItem>\r\n )}\r\n {...rest}\r\n />\r\n );\r\n};\r\n"],"names":["FormLabelWithTooltip","props","label","tooltip","tooltipProps","cmp","jsx","FormLabel","Tooltip","cn","cloneElement","FormRenderControl","form","name","render","containerProps","rest","FormField","params","jsxs","FormItem","FormMessage"],"mappings":";;;;;AAaA,MAAMA,IAAuB,CAE3BC,MAA4C;AAC5C,QAAM,EAAE,OAAAC,GAAO,SAAAC,GAAS,cAAAC,EAAA,IAAiBH,GACnCI,IAAM,gBAAAC,EAACC,GAAA,EAAW,UAAAL,EAAA,CAAM;AAC9B,SAAKA,IACAC,IAEH,gBAAAG;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,SAASL;AAAA,MACT,kBAAgB;AAAA,MAChB,kBAAiB;AAAA,MACjB,cAAc;AAAA,QACZ,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,MAER,GAAGC;AAAA,MACJ,cAAc;AAAA,QACZ,GAAGA,GAAc;AAAA,QACjB,WAAWK,EAAG,eAAeL,GAAc,cAAc,SAAS;AAAA,MAAA;AAAA,MAGnE,UAAAM,EAAaL,GAAK,EAAE,WAAWI,EAAG,eAAeJ,EAAI,MAAM,UAAU,EAAA,CAAG;AAAA,IAAA;AAAA,EAAA,IAhBxDA,IADF;AAoBrB,GAEaM,IAAoB,CAG/BV,MACG;AACH,QAAM;AAAA,IACJ,MAAAW;AAAA,IACA,MAAAC;AAAA,IACA,OAAAX;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,QAAAU;AAAA,IACA,gBAAAC,IAAiB,CAAA;AAAA,IACjB,GAAGC;AAAA,EAAA,IACDf;AACJ,SACE,gBAAAK;AAAA,IAACW;AAAA,IAAA;AAAA,MACC,SAASL,EAAK;AAAA,MACd,MAAAC;AAAA,MACA,QAAQ,CAACK,MACP,gBAAAC,EAACC,GAAA,EAAU,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAT;AAAA,UAACN;AAAA,UAAA;AAAA,YACC,OAAAE;AAAA,YACA,SAAAC;AAAA,YACA,cAAAC;AAAA,UAAA;AAAA,QAAA;AAAA,QAmBDU,EAAOI,CAAM;AAAA,0BACbG,GAAA,CAAA,CAAW;AAAA,MAAA,GACd;AAAA,MAED,GAAGL;AAAA,IAAA;AAAA,EAAA;AAGV;"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { HTMLAttributes, ReactElement } from 'react';
|
|
1
|
+
import { HTMLAttributes, ReactElement, ReactNode } from 'react';
|
|
2
2
|
import { ControllerFieldState, ControllerRenderProps, FieldPath, FieldValues, UseFormReturn, UseFormStateReturn } from 'react-hook-form';
|
|
3
|
+
import { TooltipProps } from '../Tooltip';
|
|
3
4
|
export type FormRenderProps<Data extends FieldValues> = ({ field, fieldState, formState, }: {
|
|
4
5
|
field: ControllerRenderProps<Data, FieldPath<Data>>;
|
|
5
6
|
fieldState: ControllerFieldState;
|
|
@@ -9,6 +10,8 @@ export interface FormRenderControlProps<Data extends FieldValues = FieldValues>
|
|
|
9
10
|
form: UseFormReturn<Data>;
|
|
10
11
|
name: FieldPath<Data>;
|
|
11
12
|
label?: string;
|
|
13
|
+
tooltip?: ReactNode;
|
|
14
|
+
tooltipProps?: Omit<TooltipProps, "message">;
|
|
12
15
|
render: FormRenderProps<Data>;
|
|
13
16
|
containerProps?: HTMLAttributes<HTMLDivElement>;
|
|
14
17
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormRenderControl.types.d.ts","sourceRoot":"","sources":["../../src/Form/FormRenderControl.types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"FormRenderControl.types.d.ts","sourceRoot":"","sources":["../../src/Form/FormRenderControl.types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,KAAK,EACV,oBAAoB,EACpB,qBAAqB,EACrB,SAAS,EACT,WAAW,EACX,aAAa,EACb,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,MAAM,MAAM,eAAe,CAAC,IAAI,SAAS,WAAW,IAAI,CAAC,EACvD,KAAK,EACL,UAAU,EACV,SAAS,GACV,EAAE;IACD,KAAK,EAAE,qBAAqB,CAAC,IAAI,EAAE,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;IACpD,UAAU,EAAE,oBAAoB,CAAC;IACjC,SAAS,EAAE,kBAAkB,CAAC,IAAI,CAAC,CAAC;CACrC,KAAK,YAAY,CAAC;AAEnB,MAAM,WAAW,sBAAsB,CACrC,IAAI,SAAS,WAAW,GAAG,WAAW;IAEtC,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAC1B,IAAI,EAAE,SAAS,CAAC,IAAI,CAAC,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;IAC7C,MAAM,EAAE,eAAe,CAAC,IAAI,CAAC,CAAC;IAC9B,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,MAAM,MAAM,4BAA4B,CACtC,IAAI,SAAS,WAAW,GAAG,WAAW,IACpC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,CAAA"}
|
package/Form/Form_old.js
CHANGED
|
@@ -4,10 +4,9 @@ import { Slot as F } from "@radix-ui/react-slot";
|
|
|
4
4
|
import { useFormContext as u, FormProvider as p, Controller as x } from "react-hook-form";
|
|
5
5
|
import { cn as a } from "@oneplatformdev/utils";
|
|
6
6
|
import { Label as I } from "../Label/Label.js";
|
|
7
|
-
|
|
8
|
-
const M = p, l = m.createContext(
|
|
7
|
+
const D = p, l = m.createContext(
|
|
9
8
|
{}
|
|
10
|
-
),
|
|
9
|
+
), M = ({
|
|
11
10
|
...e
|
|
12
11
|
}) => /* @__PURE__ */ n(l.Provider, { value: { name: e.name }, children: /* @__PURE__ */ n(x, { ...e }) }), c = () => {
|
|
13
12
|
const e = m.useContext(l), t = m.useContext(f), { getFieldState: o, formState: r } = u(), i = o(e.name, r);
|
|
@@ -87,10 +86,10 @@ const w = m.forwardRef(({ className: e, children: t, ...o }, r) => {
|
|
|
87
86
|
});
|
|
88
87
|
w.displayName = "FormMessage";
|
|
89
88
|
export {
|
|
90
|
-
|
|
89
|
+
D as Form,
|
|
91
90
|
g as FormControl,
|
|
92
91
|
N as FormDescription,
|
|
93
|
-
|
|
92
|
+
M as FormField,
|
|
94
93
|
v as FormItem,
|
|
95
94
|
C as FormLabel,
|
|
96
95
|
w as FormMessage,
|
package/Form/Form_old.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form_old.js","sources":["../../src/Form/Form_old.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport * as LabelPrimitive from '@radix-ui/react-label';\nimport { Slot } from '@radix-ui/react-slot';\nimport {\n Controller,\n ControllerProps,\n FieldPath,\n FieldValues,\n FormProvider,\n useFormContext,\n} from 'react-hook-form';\n\nimport { cn } from '@oneplatformdev/utils';\nimport { Label } from '../Label';\n\nconst Form = FormProvider;\n\ntype FormFieldContextValue<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> = {\n name: TName\n}\n\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\n {} as FormFieldContextValue\n)\n\nconst FormField = <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n>({\n ...props\n}: ControllerProps<TFieldValues, TName>) => {\n return (\n <FormFieldContext.Provider value={{ name: props.name }}>\n <Controller {...props} />\n </FormFieldContext.Provider>\n )\n}\n\nconst useFormField = () => {\n const fieldContext = React.useContext(FormFieldContext)\n const itemContext = React.useContext(FormItemContext)\n const { getFieldState, formState } = useFormContext()\n\n const fieldState = getFieldState(fieldContext.name, formState)\n\n if (!fieldContext) {\n throw new Error(\"useFormField should be used within <FormField>\")\n }\n\n const { id } = itemContext\n\n return {\n id,\n name: fieldContext.name,\n formItemId: `${id}-form-item`,\n formDescriptionId: `${id}-form-item-description`,\n formMessageId: `${id}-form-item-message`,\n ...fieldState,\n }\n}\n\ntype FormItemContextValue = {\n id: string\n}\n\nconst FormItemContext = React.createContext<FormItemContextValue>(\n {} as FormItemContextValue\n)\n\nconst FormItem = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => {\n const id = React.useId()\n\n return (\n <FormItemContext.Provider value={{ id }}>\n <div ref={ref} className={cn(\"space-y-1\", className)} {...props} />\n </FormItemContext.Provider>\n )\n})\nFormItem.displayName = \"FormItem\"\n\nconst FormLabel = React.forwardRef<\n React.ElementRef<typeof LabelPrimitive.Root>,\n React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>\n>(({ className, ...props }, ref) => {\n const { error, formItemId } = useFormField()\n\n return (\n <Label\n ref={ref}\n data-state={error ? \"invalid\" : \"valid\"}\n className={cn(error && \"text-destructive\", className)}\n htmlFor={formItemId}\n {...props}\n />\n )\n})\nFormLabel.displayName = \"FormLabel\"\n\nconst FormControl = React.forwardRef<\n React.ElementRef<typeof Slot>,\n React.ComponentPropsWithoutRef<typeof Slot>\n>(({ className, ...props }, ref) => {\n const { error, formItemId, formDescriptionId, formMessageId } = useFormField()\n\n return (\n <Slot\n ref={ref}\n id={formItemId}\n data-state={error ? \"invalid\" : \"valid\"}\n aria-describedby={\n !error\n ? `${formDescriptionId}`\n : `${formDescriptionId} ${formMessageId}`\n }\n aria-invalid={!!error}\n className={cn('group/form-control', className)}\n {...props}\n />\n )\n})\nFormControl.displayName = \"FormControl\"\n\nconst FormDescription = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n const { formDescriptionId } = useFormField()\n\n return (\n <p\n ref={ref}\n id={formDescriptionId}\n className={cn(\"text-[0.8rem] text-muted-foreground\", className)}\n {...props}\n />\n )\n})\nFormDescription.displayName = \"FormDescription\"\n\nconst FormMessage = React.forwardRef<\n HTMLParagraphElement,\n React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, children, ...props }, ref) => {\n const { error, formMessageId } = useFormField()\n const body = error ? String(error?.message) : children\n\n if (!body) {\n return null\n }\n\n return (\n <p\n ref={ref}\n id={formMessageId}\n className={cn(\"text-[0.8rem] font-medium text-destructive\", className)}\n {...props}\n >\n {body}\n </p>\n )\n})\nFormMessage.displayName = \"FormMessage\"\n\nexport {\n useFormField,\n Form,\n FormItem,\n FormLabel,\n FormControl,\n FormDescription,\n FormMessage,\n FormField,\n}\n"],"names":["Form","FormProvider","FormFieldContext","React","FormField","props","jsx","Controller","useFormField","fieldContext","itemContext","FormItemContext","getFieldState","formState","useFormContext","fieldState","id","FormItem","className","ref","cn","FormLabel","error","formItemId","Label","FormControl","formDescriptionId","formMessageId","Slot","FormDescription","FormMessage","children","body"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Form_old.js","sources":["../../src/Form/Form_old.tsx"],"sourcesContent":["'use client';\r\n\r\nimport * as React from 'react';\r\nimport * as LabelPrimitive from '@radix-ui/react-label';\r\nimport { Slot } from '@radix-ui/react-slot';\r\nimport {\r\n Controller,\r\n ControllerProps,\r\n FieldPath,\r\n FieldValues,\r\n FormProvider,\r\n useFormContext,\r\n} from 'react-hook-form';\r\n\r\nimport { cn } from '@oneplatformdev/utils';\r\nimport { Label } from '../Label';\r\n\r\nconst Form = FormProvider;\r\n\r\ntype FormFieldContextValue<\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\r\n> = {\r\n name: TName\r\n}\r\n\r\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\r\n {} as FormFieldContextValue\r\n)\r\n\r\nconst FormField = <\r\n TFieldValues extends FieldValues = FieldValues,\r\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\r\n>({\r\n ...props\r\n}: ControllerProps<TFieldValues, TName>) => {\r\n return (\r\n <FormFieldContext.Provider value={{ name: props.name }}>\r\n <Controller {...props} />\r\n </FormFieldContext.Provider>\r\n )\r\n}\r\n\r\nconst useFormField = () => {\r\n const fieldContext = React.useContext(FormFieldContext)\r\n const itemContext = React.useContext(FormItemContext)\r\n const { getFieldState, formState } = useFormContext()\r\n\r\n const fieldState = getFieldState(fieldContext.name, formState)\r\n\r\n if (!fieldContext) {\r\n throw new Error(\"useFormField should be used within <FormField>\")\r\n }\r\n\r\n const { id } = itemContext\r\n\r\n return {\r\n id,\r\n name: fieldContext.name,\r\n formItemId: `${id}-form-item`,\r\n formDescriptionId: `${id}-form-item-description`,\r\n formMessageId: `${id}-form-item-message`,\r\n ...fieldState,\r\n }\r\n}\r\n\r\ntype FormItemContextValue = {\r\n id: string\r\n}\r\n\r\nconst FormItemContext = React.createContext<FormItemContextValue>(\r\n {} as FormItemContextValue\r\n)\r\n\r\nconst FormItem = React.forwardRef<\r\n HTMLDivElement,\r\n React.HTMLAttributes<HTMLDivElement>\r\n>(({ className, ...props }, ref) => {\r\n const id = React.useId()\r\n\r\n return (\r\n <FormItemContext.Provider value={{ id }}>\r\n <div ref={ref} className={cn(\"space-y-1\", className)} {...props} />\r\n </FormItemContext.Provider>\r\n )\r\n})\r\nFormItem.displayName = \"FormItem\"\r\n\r\nconst FormLabel = React.forwardRef<\r\n React.ElementRef<typeof LabelPrimitive.Root>,\r\n React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>\r\n>(({ className, ...props }, ref) => {\r\n const { error, formItemId } = useFormField()\r\n\r\n return (\r\n <Label\r\n ref={ref}\r\n data-state={error ? \"invalid\" : \"valid\"}\r\n className={cn(error && \"text-destructive\", className)}\r\n htmlFor={formItemId}\r\n {...props}\r\n />\r\n )\r\n})\r\nFormLabel.displayName = \"FormLabel\"\r\n\r\nconst FormControl = React.forwardRef<\r\n React.ElementRef<typeof Slot>,\r\n React.ComponentPropsWithoutRef<typeof Slot>\r\n>(({ className, ...props }, ref) => {\r\n const { error, formItemId, formDescriptionId, formMessageId } = useFormField()\r\n\r\n return (\r\n <Slot\r\n ref={ref}\r\n id={formItemId}\r\n data-state={error ? \"invalid\" : \"valid\"}\r\n aria-describedby={\r\n !error\r\n ? `${formDescriptionId}`\r\n : `${formDescriptionId} ${formMessageId}`\r\n }\r\n aria-invalid={!!error}\r\n className={cn('group/form-control', className)}\r\n {...props}\r\n />\r\n )\r\n})\r\nFormControl.displayName = \"FormControl\"\r\n\r\nconst FormDescription = React.forwardRef<\r\n HTMLParagraphElement,\r\n React.HTMLAttributes<HTMLParagraphElement>\r\n>(({ className, ...props }, ref) => {\r\n const { formDescriptionId } = useFormField()\r\n\r\n return (\r\n <p\r\n ref={ref}\r\n id={formDescriptionId}\r\n className={cn(\"text-[0.8rem] text-muted-foreground\", className)}\r\n {...props}\r\n />\r\n )\r\n})\r\nFormDescription.displayName = \"FormDescription\"\r\n\r\nconst FormMessage = React.forwardRef<\r\n HTMLParagraphElement,\r\n React.HTMLAttributes<HTMLParagraphElement>\r\n>(({ className, children, ...props }, ref) => {\r\n const { error, formMessageId } = useFormField()\r\n const body = error ? String(error?.message) : children\r\n\r\n if (!body) {\r\n return null\r\n }\r\n\r\n return (\r\n <p\r\n ref={ref}\r\n id={formMessageId}\r\n className={cn(\"text-[0.8rem] font-medium text-destructive\", className)}\r\n {...props}\r\n >\r\n {body}\r\n </p>\r\n )\r\n})\r\nFormMessage.displayName = \"FormMessage\"\r\n\r\nexport {\r\n useFormField,\r\n Form,\r\n FormItem,\r\n FormLabel,\r\n FormControl,\r\n FormDescription,\r\n FormMessage,\r\n FormField,\r\n}\r\n"],"names":["Form","FormProvider","FormFieldContext","React","FormField","props","jsx","Controller","useFormField","fieldContext","itemContext","FormItemContext","getFieldState","formState","useFormContext","fieldState","id","FormItem","className","ref","cn","FormLabel","error","formItemId","Label","FormControl","formDescriptionId","formMessageId","Slot","FormDescription","FormMessage","children","body"],"mappings":"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"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { FormRenderControl as a } from "../Form/FormRenderControl.js";
|
|
3
|
+
import { FormControl as l } from "../Form/Form.js";
|
|
4
4
|
import { CheckboxLabel as k } from "../Checkbox/Checkbox.js";
|
|
5
5
|
const f = (m) => {
|
|
6
6
|
const { form: t, label: c, name: h, onCheckedChange: C, ...r } = m;
|
|
7
7
|
return /* @__PURE__ */ e(
|
|
8
|
-
|
|
8
|
+
a,
|
|
9
9
|
{
|
|
10
10
|
form: t,
|
|
11
11
|
name: h,
|
|
12
|
-
render: ({ field: o }) => /* @__PURE__ */ e(
|
|
12
|
+
render: ({ field: o }) => /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(
|
|
13
13
|
k,
|
|
14
14
|
{
|
|
15
15
|
...o,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormCheckbox.js","sources":["../../src/FormCheckbox/FormCheckbox.tsx"],"sourcesContent":["import { FieldValues } from 'react-hook-form';\n\nimport { FormControl, FormRenderControl } from '../Form';\n\nimport { FormCheckboxProps } from './FormCheckbox.types';\nimport { CheckboxLabel } from '../Checkbox';\n\n// TODO: move to @oneplatformdev/ui/FormCheckbox\nexport const FormCheckbox = <Data extends FieldValues>(\n\tprops: FormCheckboxProps<Data>\n) => {\n\tconst { form, label, name, onCheckedChange, ...rest } = props;\n\treturn (\n\t\t<FormRenderControl\n\t\t\tform={form}\n\t\t\tname={name}\n\t\t\trender={({ field }) => (\n\t\t\t\t<FormControl>\n\t\t\t\t\t<CheckboxLabel\n\t\t\t\t\t\t{...field}\n\t\t\t\t\t\t{...rest}\n\t\t\t\t\t\tlabel={label}\n\t\t\t\t\t\tchecked={field.value || false}\n\t\t\t\t\t\tonCheckedChange={(v) => {\n\t\t\t\t\t\t\tfield.onChange(v);\n\t\t\t\t\t\t\tonCheckedChange?.(v);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</FormControl>\n\t\t\t)}\n\t\t\t{...rest}\n\t\t/>\n\t);\n};\n"],"names":["FormCheckbox","props","form","label","name","onCheckedChange","rest","jsx","FormRenderControl","field","FormControl","CheckboxLabel","v"],"mappings":";;;;AAQO,MAAMA,IAAe,CAC3BC,MACI;AACJ,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,MAAAC,GAAM,iBAAAC,GAAiB,GAAGC,MAASL;AACxD,SACC,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,MAAAN;AAAA,MACA,MAAAE;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAK,EAAA,wBACTC,GAAA,EACA,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,GAAGF;AAAA,UACH,GAAGH;AAAA,UACJ,OAAAH;AAAA,UACA,SAASM,EAAM,SAAS;AAAA,UACxB,iBAAiB,CAACG,MAAM;AACvB,YAAAH,EAAM,SAASG,CAAC,GAChBP,IAAkBO,CAAC;AAAA,UACpB;AAAA,QAAA;AAAA,MAAA,GAEF;AAAA,MAEA,GAAGN;AAAA,IAAA;AAAA,EAAA;AAGP;"}
|
|
1
|
+
{"version":3,"file":"FormCheckbox.js","sources":["../../src/FormCheckbox/FormCheckbox.tsx"],"sourcesContent":["import { FieldValues } from 'react-hook-form';\r\n\r\nimport { FormControl, FormRenderControl } from '../Form';\r\n\r\nimport { FormCheckboxProps } from './FormCheckbox.types';\r\nimport { CheckboxLabel } from '../Checkbox';\r\n\r\n// TODO: move to @oneplatformdev/ui/FormCheckbox\r\nexport const FormCheckbox = <Data extends FieldValues>(\r\n\tprops: FormCheckboxProps<Data>\r\n) => {\r\n\tconst { form, label, name, onCheckedChange, ...rest } = props;\r\n\treturn (\r\n\t\t<FormRenderControl\r\n\t\t\tform={form}\r\n\t\t\tname={name}\r\n\t\t\trender={({ field }) => (\r\n\t\t\t\t<FormControl>\r\n\t\t\t\t\t<CheckboxLabel\r\n\t\t\t\t\t\t{...field}\r\n\t\t\t\t\t\t{...rest}\r\n\t\t\t\t\t\tlabel={label}\r\n\t\t\t\t\t\tchecked={field.value || false}\r\n\t\t\t\t\t\tonCheckedChange={(v) => {\r\n\t\t\t\t\t\t\tfield.onChange(v);\r\n\t\t\t\t\t\t\tonCheckedChange?.(v);\r\n\t\t\t\t\t\t}}\r\n\t\t\t\t\t/>\r\n\t\t\t\t</FormControl>\r\n\t\t\t)}\r\n\t\t\t{...rest}\r\n\t\t/>\r\n\t);\r\n};\r\n"],"names":["FormCheckbox","props","form","label","name","onCheckedChange","rest","jsx","FormRenderControl","field","FormControl","CheckboxLabel","v"],"mappings":";;;;AAQO,MAAMA,IAAe,CAC3BC,MACI;AACJ,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,MAAAC,GAAM,iBAAAC,GAAiB,GAAGC,MAASL;AACxD,SACC,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,MAAAN;AAAA,MACA,MAAAE;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAK,EAAA,wBACTC,GAAA,EACA,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,GAAGF;AAAA,UACH,GAAGH;AAAA,UACJ,OAAAH;AAAA,UACA,SAASM,EAAM,SAAS;AAAA,UACxB,iBAAiB,CAACG,MAAM;AACvB,YAAAH,EAAM,SAASG,CAAC,GAChBP,IAAkBO,CAAC;AAAA,UACpB;AAAA,QAAA;AAAA,MAAA,GAEF;AAAA,MAEA,GAAGN;AAAA,IAAA;AAAA,EAAA;AAGP;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormCombobox.d.ts","sourceRoot":"","sources":["../../src/FormCombobox/FormCombobox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAG9C,eAAO,MAAM,YAAY,GAAI,IAAI,SAAS,WAAW,EACnD,OAAO,iBAAiB,CAAC,IAAI,CAAC,
|
|
1
|
+
{"version":3,"file":"FormCombobox.d.ts","sourceRoot":"","sources":["../../src/FormCombobox/FormCombobox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAG9C,eAAO,MAAM,YAAY,GAAI,IAAI,SAAS,WAAW,EACnD,OAAO,iBAAiB,CAAC,IAAI,CAAC,4CAqB/B,CAAC"}
|
|
@@ -1,19 +1,21 @@
|
|
|
1
1
|
import { jsx as o } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
3
|
-
import { FormRenderControl as
|
|
4
|
-
import {
|
|
5
|
-
const
|
|
6
|
-
const { form:
|
|
2
|
+
import { Combobox as C } from "../Combobox/Combobox.js";
|
|
3
|
+
import { FormRenderControl as b } from "../Form/FormRenderControl.js";
|
|
4
|
+
import { FormControl as s } from "../Form/Form.js";
|
|
5
|
+
const h = (m) => {
|
|
6
|
+
const { form: t, label: n, tooltip: e, tooltipProps: p, name: i, ...l } = m;
|
|
7
7
|
return /* @__PURE__ */ o(
|
|
8
|
-
|
|
8
|
+
b,
|
|
9
9
|
{
|
|
10
|
-
form:
|
|
11
|
-
label:
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
10
|
+
form: t,
|
|
11
|
+
label: n,
|
|
12
|
+
tooltip: e,
|
|
13
|
+
tooltipProps: p,
|
|
14
|
+
name: i,
|
|
15
|
+
render: ({ field: r }) => /* @__PURE__ */ o(s, { children: /* @__PURE__ */ o(
|
|
16
|
+
C,
|
|
15
17
|
{
|
|
16
|
-
...
|
|
18
|
+
...l,
|
|
17
19
|
...r,
|
|
18
20
|
onChange: r.onChange
|
|
19
21
|
}
|
|
@@ -22,6 +24,6 @@ const x = (m) => {
|
|
|
22
24
|
);
|
|
23
25
|
};
|
|
24
26
|
export {
|
|
25
|
-
|
|
27
|
+
h as FormCombobox
|
|
26
28
|
};
|
|
27
29
|
//# sourceMappingURL=FormCombobox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormCombobox.js","sources":["../../src/FormCombobox/FormCombobox.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\nimport { Combobox } from '../Combobox';\nimport { FormComboboxProps } from './FormCombobox.types';\nimport { FieldValues } from 'react-hook-form';\n\n// TODO: add description\nexport const FormCombobox = <Data extends FieldValues>(\n props: FormComboboxProps<Data>\n) => {\n const { form, label, name, ...rest } = props;\n return (\n <FormRenderControl\n form={form}\n label={label}\n name={name}\n render={({ field }) => (\n <FormControl>\n <Combobox\n {...rest}\n {...field}\n onChange={field.onChange}\n />\n </FormControl>\n )}\n />\n );\n};\n"],"names":["FormCombobox","props","form","label","name","rest","jsx","FormRenderControl","field","FormControl","Combobox"],"mappings":";;;;AAMO,MAAMA,IAAe,CAC1BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,MAAAC,GAAM,GAAGC,
|
|
1
|
+
{"version":3,"file":"FormCombobox.js","sources":["../../src/FormCombobox/FormCombobox.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\r\nimport { Combobox } from '../Combobox';\r\nimport { FormComboboxProps } from './FormCombobox.types';\r\nimport { FieldValues } from 'react-hook-form';\r\n\r\n// TODO: add description\r\nexport const FormCombobox = <Data extends FieldValues>(\r\n props: FormComboboxProps<Data>\r\n) => {\r\n const { form, label, tooltip, tooltipProps, name, ...rest } = props;\r\n return (\r\n <FormRenderControl\r\n form={form}\r\n label={label}\r\n tooltip={tooltip}\r\n tooltipProps={tooltipProps} \r\n name={name}\r\n render={({ field }) => (\r\n <FormControl>\r\n <Combobox\r\n {...rest}\r\n {...field}\r\n onChange={field.onChange}\r\n />\r\n </FormControl>\r\n )}\r\n />\r\n );\r\n};\r\n"],"names":["FormCombobox","props","form","label","tooltip","tooltipProps","name","rest","jsx","FormRenderControl","field","FormControl","Combobox"],"mappings":";;;;AAMO,MAAMA,IAAe,CAC1BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,GAAGC,MAASN;AAC9D,SACE,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAP;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAI,EAAA,wBACRC,GAAA,EACC,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAGL;AAAA,UACH,GAAGG;AAAA,UACJ,UAAUA,EAAM;AAAA,QAAA;AAAA,MAAA,EAClB,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormDatePicker.d.ts","sourceRoot":"","sources":["../../src/FormDatePicker/FormDatePicker.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAG7D,eAAO,MAAM,cAAc,GAAI,IAAI,SAAS,WAAW,EACrD,OAAO,mBAAmB,CAAC,IAAI,CAAC,
|
|
1
|
+
{"version":3,"file":"FormDatePicker.d.ts","sourceRoot":"","sources":["../../src/FormDatePicker/FormDatePicker.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAG7D,eAAO,MAAM,cAAc,GAAI,IAAI,SAAS,WAAW,EACrD,OAAO,mBAAmB,CAAC,IAAI,CAAC,4CAyBjC,CAAC"}
|
|
@@ -1,23 +1,25 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { DatePicker as
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
const
|
|
6
|
-
const { form: n, name: m,
|
|
7
|
-
return /* @__PURE__ */
|
|
8
|
-
|
|
1
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { DatePicker as s } from "../DatePicker/DatePicker.js";
|
|
3
|
+
import { FormRenderControl as C } from "../Form/FormRenderControl.js";
|
|
4
|
+
import { FormControl as D } from "../Form/Form.js";
|
|
5
|
+
const P = (t) => {
|
|
6
|
+
const { form: n, name: m, tooltip: a, tooltipProps: p, label: i, onDateChange: l, ...c } = t;
|
|
7
|
+
return /* @__PURE__ */ r(
|
|
8
|
+
C,
|
|
9
9
|
{
|
|
10
10
|
form: n,
|
|
11
11
|
name: m,
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
12
|
+
tooltip: a,
|
|
13
|
+
tooltipProps: p,
|
|
14
|
+
label: i,
|
|
15
|
+
render: ({ field: o }) => /* @__PURE__ */ r(D, { children: /* @__PURE__ */ r(
|
|
16
|
+
s,
|
|
15
17
|
{
|
|
16
|
-
...
|
|
17
|
-
...
|
|
18
|
-
selectedDate:
|
|
18
|
+
...o,
|
|
19
|
+
...c,
|
|
20
|
+
selectedDate: o.value,
|
|
19
21
|
onDateChange: (e) => {
|
|
20
|
-
|
|
22
|
+
o.onChange(e), l?.(e);
|
|
21
23
|
}
|
|
22
24
|
}
|
|
23
25
|
) })
|
|
@@ -25,6 +27,6 @@ const g = (t) => {
|
|
|
25
27
|
);
|
|
26
28
|
};
|
|
27
29
|
export {
|
|
28
|
-
|
|
30
|
+
P as FormDatePicker
|
|
29
31
|
};
|
|
30
32
|
//# sourceMappingURL=FormDatePicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormDatePicker.js","sources":["../../src/FormDatePicker/FormDatePicker.tsx"],"sourcesContent":["'use client';\n\nimport { DatePicker } from '../DatePicker';\nimport { FormControl, FormRenderControl } from '../Form';\nimport { FieldValues } from 'react-hook-form';\nimport { FormDatePickerProps } from './FormDatePicker.types';\n\n// TODO: add description\nexport const FormDatePicker = <Data extends FieldValues>(\n props: FormDatePickerProps<Data>\n) => {\n const { form, name, label, onDateChange, ...rest } = props;\n return (\n <FormRenderControl\n form={form}\n name={name}\n label={label}\n render={({ field }) => (\n <FormControl>\n <DatePicker\n { ...field }\n { ...rest }\n selectedDate={field.value}\n onDateChange={(date: Date | undefined) => {\n field.onChange(date);\n onDateChange?.(date);\n }}\n />\n </FormControl>\n )}\n />\n );\n};\n"],"names":["FormDatePicker","props","form","name","label","onDateChange","rest","jsx","FormRenderControl","field","FormControl","DatePicker","date"],"mappings":";;;;AAQO,MAAMA,IAAiB,CAC5BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,MAAAC,GAAM,OAAAC,GAAO,cAAAC,GAAc,GAAGC,
|
|
1
|
+
{"version":3,"file":"FormDatePicker.js","sources":["../../src/FormDatePicker/FormDatePicker.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { DatePicker } from '../DatePicker';\r\nimport { FormControl, FormRenderControl } from '../Form';\r\nimport { FieldValues } from 'react-hook-form';\r\nimport { FormDatePickerProps } from './FormDatePicker.types';\r\n\r\n// TODO: add description\r\nexport const FormDatePicker = <Data extends FieldValues>(\r\n props: FormDatePickerProps<Data>\r\n) => {\r\n const { form, name, tooltip, tooltipProps, label, onDateChange, ...rest } = props;\r\n return (\r\n <FormRenderControl\r\n form={form}\r\n name={name}\r\n tooltip={tooltip}\r\n tooltipProps={tooltipProps}\r\n label={label}\r\n render={({ field }) => (\r\n <FormControl>\r\n <DatePicker\r\n { ...field }\r\n { ...rest }\r\n selectedDate={field.value}\r\n onDateChange={(date: Date | undefined) => {\r\n field.onChange(date);\r\n onDateChange?.(date);\r\n }}\r\n />\r\n </FormControl>\r\n )}\r\n />\r\n );\r\n};\r\n"],"names":["FormDatePicker","props","form","name","tooltip","tooltipProps","label","onDateChange","rest","jsx","FormRenderControl","field","FormControl","DatePicker","date"],"mappings":";;;;AAQO,MAAMA,IAAiB,CAC5BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,OAAAC,GAAO,cAAAC,GAAc,GAAGC,EAAA,IAASP;AAC5E,SACE,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAR;AAAA,MACA,MAAAC;AAAA,MACA,SAAAC;AAAA,MACA,cAAAC;AAAA,MACA,OAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAK,EAAA,wBACRC,GAAA,EACC,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACG,GAAGF;AAAA,UACH,GAAGH;AAAA,UACL,cAAcG,EAAM;AAAA,UACpB,cAAc,CAACG,MAA2B;AACxC,YAAAH,EAAM,SAASG,CAAI,GACnBP,IAAeO,CAAI;AAAA,UACrB;AAAA,QAAA;AAAA,MAAA,EACF,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormDropzone.d.ts","sourceRoot":"","sources":["../../src/FormDropzone/FormDropzone.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzD,eAAO,MAAM,YAAY,GAAI,IAAI,SAAS,WAAW,EACnD,OAAO,iBAAiB,CAAC,IAAI,CAAC,
|
|
1
|
+
{"version":3,"file":"FormDropzone.d.ts","sourceRoot":"","sources":["../../src/FormDropzone/FormDropzone.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzD,eAAO,MAAM,YAAY,GAAI,IAAI,SAAS,WAAW,EACnD,OAAO,iBAAiB,CAAC,IAAI,CAAC,4CAkB/B,CAAC"}
|
|
@@ -1,20 +1,22 @@
|
|
|
1
1
|
import { jsx as o } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
3
|
-
import { FormRenderControl as
|
|
4
|
-
import {
|
|
5
|
-
const
|
|
6
|
-
const { form:
|
|
2
|
+
import { Dropzone as a } from "../Dropzone/Dropzone.js";
|
|
3
|
+
import { FormRenderControl as s } from "../Form/FormRenderControl.js";
|
|
4
|
+
import { FormControl as f } from "../Form/Form.js";
|
|
5
|
+
const d = (n) => {
|
|
6
|
+
const { form: t, label: e, tooltip: m, tooltipProps: p, name: l, ...i } = n;
|
|
7
7
|
return /* @__PURE__ */ o(
|
|
8
|
-
|
|
8
|
+
s,
|
|
9
9
|
{
|
|
10
|
-
form:
|
|
11
|
-
label:
|
|
12
|
-
|
|
13
|
-
|
|
10
|
+
form: t,
|
|
11
|
+
label: e,
|
|
12
|
+
tooltip: m,
|
|
13
|
+
tooltipProps: p,
|
|
14
|
+
name: l,
|
|
15
|
+
render: ({ field: r }) => /* @__PURE__ */ o(f, { children: /* @__PURE__ */ o(a, { ...i, ...r, onChangeValue: r.onChange }) })
|
|
14
16
|
}
|
|
15
17
|
);
|
|
16
18
|
};
|
|
17
19
|
export {
|
|
18
|
-
|
|
20
|
+
d as FormDropzone
|
|
19
21
|
};
|
|
20
22
|
//# sourceMappingURL=FormDropzone.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormDropzone.js","sources":["../../src/FormDropzone/FormDropzone.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\nimport { Dropzone } from '../Dropzone';\nimport { FieldValues } from 'react-hook-form';\nimport { FormDropzoneProps } from './FormDropzone.types';\n\nexport const FormDropzone = <Data extends FieldValues>(\n props: FormDropzoneProps<Data>\n) => {\n const { form, label, name, ...rest } = props;\n\n return (\n <FormRenderControl\n form={form}\n label={label}\n name={name}\n render={({ field }) => (\n <FormControl>\n <Dropzone {...rest} {...field} onChangeValue={field.onChange} />\n </FormControl>\n )}\n />\n );\n};\n"],"names":["FormDropzone","props","form","label","name","rest","jsx","FormRenderControl","field","FormControl","Dropzone"],"mappings":";;;;AAKO,MAAMA,IAAe,CAC1BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,MAAAC,GAAM,GAAGC,
|
|
1
|
+
{"version":3,"file":"FormDropzone.js","sources":["../../src/FormDropzone/FormDropzone.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\r\nimport { Dropzone } from '../Dropzone';\r\nimport { FieldValues } from 'react-hook-form';\r\nimport { FormDropzoneProps } from './FormDropzone.types';\r\n\r\nexport const FormDropzone = <Data extends FieldValues>(\r\n props: FormDropzoneProps<Data>\r\n) => {\r\n const { form, label, tooltip, tooltipProps, name, ...rest } = props;\r\n\r\n return (\r\n <FormRenderControl\r\n form={form}\r\n label={label}\r\n tooltip={tooltip}\r\n tooltipProps={tooltipProps}\r\n name={name}\r\n render={({ field }) => (\r\n <FormControl>\r\n <Dropzone {...rest} {...field} onChangeValue={field.onChange} />\r\n </FormControl>\r\n )}\r\n />\r\n );\r\n};\r\n"],"names":["FormDropzone","props","form","label","tooltip","tooltipProps","name","rest","jsx","FormRenderControl","field","FormControl","Dropzone"],"mappings":";;;;AAKO,MAAMA,IAAe,CAC1BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,GAAGC,MAASN;AAE9D,SACE,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAP;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAI,EAAA,wBACRC,GAAA,EACC,UAAA,gBAAAH,EAACI,GAAA,EAAU,GAAGL,GAAO,GAAGG,GAAO,eAAeA,EAAM,UAAU,EAAA,CAChE;AAAA,IAAA;AAAA,EAAA;AAIR;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormInput.d.ts","sourceRoot":"","sources":["../../src/FormInput/FormInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAmB,MAAM,iBAAiB,CAAC;AAC/D,OAAO,EAAc,YAAY,EAAE,GAAG,EAAa,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"FormInput.d.ts","sourceRoot":"","sources":["../../src/FormInput/FormInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAmB,MAAM,iBAAiB,CAAC;AAC/D,OAAO,EAAc,YAAY,EAAE,GAAG,EAAa,MAAM,OAAO,CAAC;AA4IjE,eAAO,MAAM,SAAS,EAAiC,CAAC,IAAI,SAAS,WAAW,EAC9E,KAAK,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAA;CAAE,KAC1D,YAAY,CAAC"}
|
package/FormInput/FormInput.js
CHANGED
|
@@ -1,49 +1,69 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import {
|
|
3
|
-
import { FormRenderControl as
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
function
|
|
7
|
-
const { form:
|
|
8
|
-
return /* @__PURE__ */
|
|
9
|
-
|
|
1
|
+
import { jsx as m } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as T } from "react";
|
|
3
|
+
import { FormRenderControl as S } from "../Form/FormRenderControl.js";
|
|
4
|
+
import { FormControl as V } from "../Form/Form.js";
|
|
5
|
+
import { Input as j } from "../Input/Input.js";
|
|
6
|
+
function q(D, o) {
|
|
7
|
+
const { form: a, tooltip: x, tooltipProps: P, label: b, name: u, maxLength: s, counter: y, onChange: C, onBlur: F, onPaste: w, style: I, onPastePrepare: p, ...B } = D;
|
|
8
|
+
return /* @__PURE__ */ m(
|
|
9
|
+
S,
|
|
10
10
|
{
|
|
11
|
-
form:
|
|
12
|
-
name:
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
11
|
+
form: a,
|
|
12
|
+
name: u,
|
|
13
|
+
tooltip: x,
|
|
14
|
+
tooltipProps: P,
|
|
15
|
+
label: b,
|
|
16
|
+
render: ({ field: n }) => /* @__PURE__ */ m(V, { children: /* @__PURE__ */ m(
|
|
17
|
+
j,
|
|
16
18
|
{
|
|
17
19
|
...n,
|
|
18
|
-
...
|
|
20
|
+
...B,
|
|
21
|
+
counter: y,
|
|
22
|
+
maxLength: s,
|
|
19
23
|
ref: (t) => {
|
|
20
|
-
n.ref(t), typeof
|
|
24
|
+
n.ref(t), typeof o == "function" ? o(t) : o && (o.current = t);
|
|
21
25
|
},
|
|
22
|
-
style:
|
|
26
|
+
style: I,
|
|
23
27
|
value: n.value || "",
|
|
24
28
|
onChange: (...t) => {
|
|
25
|
-
n.onChange?.(...t),
|
|
29
|
+
n.onChange?.(...t), C?.(...t);
|
|
26
30
|
},
|
|
27
31
|
onPaste: (t) => {
|
|
28
|
-
const
|
|
29
|
-
let
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
32
|
+
const h = t.clipboardData.getData("text"), e = t.currentTarget, f = e.selectionStart ?? e.value.length, g = e.selectionEnd ?? e.value.length, r = e.value;
|
|
33
|
+
let c = r.slice(0, f) + h + r.slice(g);
|
|
34
|
+
if (p && (c = p(c, t)), typeof s != "number") {
|
|
35
|
+
t.preventDefault(), a.setValue(u, c, {
|
|
36
|
+
shouldDirty: !0,
|
|
37
|
+
shouldTouch: !0
|
|
38
|
+
});
|
|
39
|
+
return;
|
|
40
|
+
}
|
|
41
|
+
const l = r.slice(0, f), d = r.slice(g), v = s - (l.length + d.length);
|
|
42
|
+
if (v <= 0) {
|
|
43
|
+
t.preventDefault();
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
const i = h.slice(0, v), R = l + i + d;
|
|
47
|
+
t.preventDefault(), a.setValue(u, R, {
|
|
33
48
|
shouldDirty: !0,
|
|
34
49
|
shouldTouch: !0
|
|
35
|
-
}),
|
|
50
|
+
}), requestAnimationFrame(() => {
|
|
51
|
+
e.setSelectionRange(
|
|
52
|
+
l.length + i.length,
|
|
53
|
+
l.length + i.length
|
|
54
|
+
);
|
|
55
|
+
});
|
|
36
56
|
},
|
|
37
57
|
onBlur: (...t) => {
|
|
38
|
-
n.onBlur?.(),
|
|
58
|
+
n.onBlur?.(), F?.(...t);
|
|
39
59
|
}
|
|
40
60
|
}
|
|
41
61
|
) })
|
|
42
62
|
}
|
|
43
63
|
);
|
|
44
64
|
}
|
|
45
|
-
const
|
|
65
|
+
const z = T(q);
|
|
46
66
|
export {
|
|
47
|
-
|
|
67
|
+
z as FormInput
|
|
48
68
|
};
|
|
49
69
|
//# sourceMappingURL=FormInput.js.map
|