@oneplatformdev/ui 0.1.99-beta.262 → 0.1.99-beta.265
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/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 -4
- package/AlertDialog/AlertDialog.stories.js.map +1 -1
- package/AlertDialog/AlertDialogRoot.js +18 -20
- 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.js.map +1 -1
- package/Breadcrumb/Breadcrumb.js.map +1 -1
- package/Button/Button.js +10 -11
- package/Button/Button.js.map +1 -1
- package/Button/Button.stories.js +1 -1
- package/Button/Button.stories.js.map +1 -1
- package/Button/Button.utils.js.map +1 -1
- package/Button/ButtonCounterBadge.js.map +1 -1
- package/Button/buttonVariants.js.map +1 -1
- package/ButtonIcon/ButtonIcon.js +19 -22
- package/ButtonIcon/ButtonIcon.js.map +1 -1
- package/ButtonIcon/ButtonIcon.stories.js +1 -1
- package/ButtonIcon/ButtonIcon.stories.js.map +1 -1
- package/ButtonIcon/buttonIconVariants.js.map +1 -1
- package/CHANGELOG.md +3401 -3385
- package/Calendar/Calendar.js +4 -6
- 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.js +0 -1
- package/Checkbox/Checkbox.js.map +1 -1
- package/Checkbox/Checkbox.stories.js.map +1 -1
- package/Collapsible/Collapsible.js.map +1 -1
- package/Combobox/Combobox.js +10 -10
- package/Combobox/Combobox.js.map +1 -1
- package/Combobox/Combobox.stories.js.map +1 -1
- package/Combobox/Combobox.types.js.map +1 -1
- package/Combobox/ComboboxOptionItem.js +18 -19
- package/Combobox/ComboboxOptionItem.js.map +1 -1
- package/Combobox/ComboboxRenderContent.js +26 -27
- package/Combobox/ComboboxRenderContent.js.map +1 -1
- package/Combobox/ComboboxRenderOptions.js +5 -5
- package/Combobox/ComboboxRenderOptions.js.map +1 -1
- package/Combobox/ComboboxRenderTrigger.js +28 -30
- package/Combobox/ComboboxRenderTrigger.js.map +1 -1
- package/Command/Command.js +21 -22
- package/Command/Command.js.map +1 -1
- package/ContextPopover/ContextDropdownMenu.js.map +1 -1
- package/ContextPopover/ContextPopover.js.map +1 -1
- package/ContextPopover/useContextPopoverHandler.js.map +1 -1
- package/DataTable/DataTable.js +24 -26
- 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.js +20 -21
- package/Dialog/Dialog.js.map +1 -1
- package/Dialog/Dialog.stories.js +14 -15
- package/Dialog/Dialog.stories.js.map +1 -1
- package/Dialog/DialogOverlayScope.js.map +1 -1
- package/Dialog/useDialogClosePosition.js.map +1 -1
- package/Drawer/Drawer.js.map +1 -1
- package/DropdownMenu/DropdownMenu.js.map +1 -1
- package/Dropzone/Dropzone.d.ts.map +1 -1
- package/Dropzone/Dropzone.js +321 -159
- package/Dropzone/Dropzone.js.map +1 -1
- package/Dropzone/Dropzone.stories.js +257 -63
- package/Dropzone/Dropzone.stories.js.map +1 -1
- package/Dropzone/Dropzone.types.d.ts +17 -1
- package/Dropzone/Dropzone.types.d.ts.map +1 -1
- package/Dropzone/Dropzone.types.js +18 -7
- package/Dropzone/Dropzone.types.js.map +1 -1
- package/Dropzone/DropzoneFilePreview.d.ts.map +1 -1
- package/Dropzone/DropzoneFilePreview.js +45 -24
- package/Dropzone/DropzoneFilePreview.js.map +1 -1
- package/Dropzone/DropzoneSinglePickPreview.d.ts +5 -2
- package/Dropzone/DropzoneSinglePickPreview.d.ts.map +1 -1
- package/Dropzone/DropzoneSinglePickPreview.js +120 -22
- package/Dropzone/DropzoneSinglePickPreview.js.map +1 -1
- package/Dropzone/DropzoneUtils.js.map +1 -1
- package/Dropzone/index.js +7 -5
- package/Form/Form.js +14 -15
- package/Form/Form.js.map +1 -1
- package/Form/FormRenderControl.js +6 -7
- package/Form/FormRenderControl.js.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.js +4 -4
- package/FormCombobox/FormCombobox.js.map +1 -1
- package/FormDatePicker/FormDatePicker.js +4 -4
- package/FormDatePicker/FormDatePicker.js.map +1 -1
- package/FormDropzone/FormDropzone.js +3 -3
- package/FormDropzone/FormDropzone.js.map +1 -1
- package/FormInput/FormInput.js +6 -6
- package/FormInput/FormInput.js.map +1 -1
- package/FormInput/FormInput.stories.js.map +1 -1
- package/FormRadio/FormRadio.js.map +1 -1
- package/FormSelect/FormSelect.js +6 -9
- package/FormSelect/FormSelect.js.map +1 -1
- package/FormTextarea/FormTextarea.js +4 -4
- package/FormTextarea/FormTextarea.js.map +1 -1
- package/Header/Header.js.map +1 -1
- package/HoverCard/HoverCard.js.map +1 -1
- package/InfoBlock/InfoBlock.js.map +1 -1
- package/InfoBlock/InfoBlock.stories.js.map +1 -1
- package/InfoBlock/infoBlockVariants.js.map +1 -1
- package/Input/Input.d.ts.map +1 -1
- package/Input/Input.js +95 -58
- package/Input/Input.js.map +1 -1
- package/Input/Input.stories.js +112 -41
- package/Input/Input.stories.js.map +1 -1
- package/Input/Input.types.d.ts +4 -0
- package/Input/Input.types.d.ts.map +1 -1
- 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.js.map +1 -1
- package/LoadingMask/LoadingMask.js.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.js.map +1 -1
- package/Resizable/Resizable.stories.js.map +1 -1
- package/ScrollArea/ScrollArea.js.map +1 -1
- package/Search/Search.js +9 -9
- package/Search/Search.js.map +1 -1
- package/Search/Search.stories.js.map +1 -1
- package/Select/Select.js +6 -7
- package/Select/Select.js.map +1 -1
- package/Select/Select.stories.js.map +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/Switch/Switch.stories.js.map +1 -1
- package/Table/Table.js.map +1 -1
- package/TablePagination/TablePagination.js +21 -26
- package/TablePagination/TablePagination.js.map +1 -1
- package/Tabs/Tabs.js.map +1 -1
- package/Tabs/TabsRoot.js.map +1 -1
- package/Textarea/Textarea.js.map +1 -1
- package/Textarea/Textarea.stories.js.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.js.map +1 -1
- package/Toast/toast.constants.js.map +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.js.map +1 -1
- package/Tooltip/TooltipRoot.js.map +1 -1
- package/Tooltip/tooltipVariants.js.map +1 -1
- package/index.js +298 -296
- package/package.json +7 -5
- package/packages/ui/.storybook/Wrappers.js.map +1 -0
- package/styles.css +1 -0
- package/vite-env.d.ts +7 -7
- package/.storybook/Wrappers.js.map +0 -1
- /package/{.storybook → packages/ui/.storybook}/Wrappers.js +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormCombobox.js","sources":["../../src/FormCombobox/FormCombobox.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\nimport { Combobox, ComboboxSelectedType } from '../Combobox';\nimport {\n FormComboboxMultiProps, FormComboboxProps,\n FormComboboxSingleProps\n} from './FormCombobox.types';\nimport { FieldValues } from 'react-hook-form';\nimport { JSX } from \"react\";\n\ntype RestOmitedType<T> = Omit<T, 'form' | 'label' | 'tooltip' | 'tooltipProps' | 'name'>;\n\ntype RestPropsType<\n T extends ComboboxSelectedType,\n Data extends FieldValues,\n Node extends object = object,\n> = T extends 'single'\n ? RestOmitedType<FormComboboxSingleProps<Data, Node>>\n : RestOmitedType<FormComboboxMultiProps<Data, Node>>\n\nexport function FormCombobox<\n Data extends FieldValues,\n Node extends object = object\n>(props: FormComboboxSingleProps<Data, Node>): JSX.Element;\nexport function FormCombobox<\n Data extends FieldValues,\n Node extends object = object\n>(props: FormComboboxMultiProps<Data, Node>): JSX.Element;\n\nexport function FormCombobox<\n Data extends object = object,\n Node extends object = object\n>(\n props: FormComboboxProps<Data, Node>\n): JSX.Element {\n const { form, label, tooltip, tooltipProps, name, imperativeRef, ...rest } = props;\n const type = (props.type ?? 'single') as 'single' | 'multi';\n return (\n <FormRenderControl\n form={form}\n label={label}\n tooltip={tooltip}\n tooltipProps={tooltipProps}\n name={name}\n render={({ field }) => (\n <FormControl>\n {type === 'multi' ? (\n <Combobox<Node>\n {...(rest as RestPropsType<'multi', Data, Node>)}\n {...field}\n type=\"multi\"\n imperativeRef={imperativeRef}\n onChange={field.onChange}\n />\n ) : (\n <Combobox<Node>\n {...(rest as RestPropsType<'single', Data, Node>)}\n {...field}\n type=\"single\"\n imperativeRef={imperativeRef}\n onChange={field.onChange}\n />\n )}\n </FormControl>\n )}\n />\n );\n};\n"],"names":["FormCombobox","props","form","label","tooltip","tooltipProps","name","imperativeRef","rest","type","jsx","FormRenderControl","field","FormControl","Combobox"],"mappings":";;;;AA4BO,SAASA,EAIdC,GACa;AACb,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,eAAAC,GAAe,GAAGC,EAAA,IAASP,GACvEQ,IAAQR,EAAM,QAAQ;AAC5B,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAT;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAM,EAAA,MACT,gBAAAF,EAACG,GAAA,EACE,gBAAS,UACR,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAIN;AAAA,UACJ,GAAGI;AAAA,UACJ,MAAK;AAAA,UACL,eAAAL;AAAA,UACA,UAAUK,EAAM;AAAA,QAAA;AAAA,MAAA,IAGlB,gBAAAF;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAIN;AAAA,UACJ,GAAGI;AAAA,UACJ,MAAK;AAAA,UACL,eAAAL;AAAA,UACA,UAAUK,EAAM;AAAA,QAAA;AAAA,MAAA,EAClB,CAEJ;AAAA,IAAA;AAAA,EAAA;AAIR;"}
|
|
1
|
+
{"version":3,"file":"FormCombobox.js","sources":["../../src/FormCombobox/FormCombobox.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\r\nimport { Combobox, ComboboxSelectedType } from '../Combobox';\r\nimport {\r\n FormComboboxMultiProps, FormComboboxProps,\r\n FormComboboxSingleProps\r\n} from './FormCombobox.types';\r\nimport { FieldValues } from 'react-hook-form';\r\nimport { JSX } from \"react\";\r\n\r\ntype RestOmitedType<T> = Omit<T, 'form' | 'label' | 'tooltip' | 'tooltipProps' | 'name'>;\r\n\r\ntype RestPropsType<\r\n T extends ComboboxSelectedType,\r\n Data extends FieldValues,\r\n Node extends object = object,\r\n> = T extends 'single'\r\n ? RestOmitedType<FormComboboxSingleProps<Data, Node>>\r\n : RestOmitedType<FormComboboxMultiProps<Data, Node>>\r\n\r\nexport function FormCombobox<\r\n Data extends FieldValues,\r\n Node extends object = object\r\n>(props: FormComboboxSingleProps<Data, Node>): JSX.Element;\r\nexport function FormCombobox<\r\n Data extends FieldValues,\r\n Node extends object = object\r\n>(props: FormComboboxMultiProps<Data, Node>): JSX.Element;\r\n\r\nexport function FormCombobox<\r\n Data extends object = object,\r\n Node extends object = object\r\n>(\r\n props: FormComboboxProps<Data, Node>\r\n): JSX.Element {\r\n const { form, label, tooltip, tooltipProps, name, imperativeRef, ...rest } = props;\r\n const type = (props.type ?? 'single') as 'single' | 'multi';\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 {type === 'multi' ? (\r\n <Combobox<Node>\r\n {...(rest as RestPropsType<'multi', Data, Node>)}\r\n {...field}\r\n type=\"multi\"\r\n imperativeRef={imperativeRef}\r\n onChange={field.onChange}\r\n />\r\n ) : (\r\n <Combobox<Node>\r\n {...(rest as RestPropsType<'single', Data, Node>)}\r\n {...field}\r\n type=\"single\"\r\n imperativeRef={imperativeRef}\r\n onChange={field.onChange}\r\n />\r\n )}\r\n </FormControl>\r\n )}\r\n />\r\n );\r\n};\r\n"],"names":["FormCombobox","props","form","label","tooltip","tooltipProps","name","imperativeRef","rest","type","jsx","FormRenderControl","field","FormControl","Combobox"],"mappings":";;;;AA4BO,SAASA,EAIdC,GACa;AACb,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,eAAAC,GAAe,GAAGC,EAAA,IAASP,GACvEQ,IAAQR,EAAM,QAAQ;AAC5B,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAT;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAM,EAAA,MACT,gBAAAF,EAACG,GAAA,EACE,gBAAS,UACR,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAIN;AAAA,UACJ,GAAGI;AAAA,UACJ,MAAK;AAAA,UACL,eAAAL;AAAA,UACA,UAAUK,EAAM;AAAA,QAAA;AAAA,MAAA,IAGlB,gBAAAF;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAIN;AAAA,UACJ,GAAGI;AAAA,UACJ,MAAK;AAAA,UACL,eAAAL;AAAA,UACA,UAAUK,EAAM;AAAA,QAAA;AAAA,MAAA,EAClB,CAEJ;AAAA,IAAA;AAAA,EAAA;AAIR;"}
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { jsx as r } from "react/jsx-runtime";
|
|
2
2
|
import { DatePicker as s } from "../DatePicker/DatePicker.js";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
3
|
+
import { FormRenderControl as C } from "../Form/FormRenderControl.js";
|
|
4
|
+
import { FormControl as D } from "../Form/Form.js";
|
|
5
5
|
const P = (t) => {
|
|
6
6
|
const { form: n, name: m, tooltip: a, tooltipProps: p, label: i, onDateChange: l, ...c } = t;
|
|
7
7
|
return /* @__PURE__ */ r(
|
|
8
|
-
|
|
8
|
+
C,
|
|
9
9
|
{
|
|
10
10
|
form: n,
|
|
11
11
|
name: m,
|
|
12
12
|
tooltip: a,
|
|
13
13
|
tooltipProps: p,
|
|
14
14
|
label: i,
|
|
15
|
-
render: ({ field: o }) => /* @__PURE__ */ r(
|
|
15
|
+
render: ({ field: o }) => /* @__PURE__ */ r(D, { children: /* @__PURE__ */ r(
|
|
16
16
|
s,
|
|
17
17
|
{
|
|
18
18
|
...o,
|
|
@@ -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, tooltip, tooltipProps, label, onDateChange, ...rest } = props;\n return (\n <FormRenderControl\n form={form}\n name={name}\n tooltip={tooltip}\n tooltipProps={tooltipProps}\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","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
|
+
{"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,7 +1,7 @@
|
|
|
1
1
|
import { jsx as o } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { Dropzone as a } from "../Dropzone/Dropzone.js";
|
|
3
3
|
import { FormRenderControl as s } from "../Form/FormRenderControl.js";
|
|
4
|
-
import {
|
|
4
|
+
import { FormControl as f } from "../Form/Form.js";
|
|
5
5
|
const d = (n) => {
|
|
6
6
|
const { form: t, label: e, tooltip: m, tooltipProps: p, name: l, ...i } = n;
|
|
7
7
|
return /* @__PURE__ */ o(
|
|
@@ -12,7 +12,7 @@ const d = (n) => {
|
|
|
12
12
|
tooltip: m,
|
|
13
13
|
tooltipProps: p,
|
|
14
14
|
name: l,
|
|
15
|
-
render: ({ field: r }) => /* @__PURE__ */ o(
|
|
15
|
+
render: ({ field: r }) => /* @__PURE__ */ o(f, { children: /* @__PURE__ */ o(a, { ...i, ...r, onChangeValue: r.onChange }) })
|
|
16
16
|
}
|
|
17
17
|
);
|
|
18
18
|
};
|
|
@@ -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, tooltip, tooltipProps, name, ...rest } = props;\n\n return (\n <FormRenderControl\n form={form}\n label={label}\n tooltip={tooltip}\n tooltipProps={tooltipProps}\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","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
|
+
{"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;"}
|
package/FormInput/FormInput.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as m } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { forwardRef as S } from "react";
|
|
3
3
|
import { FormRenderControl as V } from "../Form/FormRenderControl.js";
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
4
|
+
import { FormControl as j } from "../Form/Form.js";
|
|
5
|
+
import { Input as q } from "../Input/Input.js";
|
|
6
6
|
function w(D, o) {
|
|
7
7
|
const { form: a, tooltip: x, tooltipProps: P, label: b, name: u, maxLength: s, counter: y, onChange: C, onBlur: F, onPaste: A, style: I, onPastePrepare: p, ...B } = D;
|
|
8
8
|
return /* @__PURE__ */ m(
|
|
@@ -13,8 +13,8 @@ function w(D, o) {
|
|
|
13
13
|
tooltip: x,
|
|
14
14
|
tooltipProps: P,
|
|
15
15
|
label: b,
|
|
16
|
-
render: ({ field: n, fieldState: R }) => /* @__PURE__ */ m(
|
|
17
|
-
|
|
16
|
+
render: ({ field: n, fieldState: R }) => /* @__PURE__ */ m(j, { children: /* @__PURE__ */ m(
|
|
17
|
+
q,
|
|
18
18
|
{
|
|
19
19
|
...n,
|
|
20
20
|
...B,
|
|
@@ -62,7 +62,7 @@ function w(D, o) {
|
|
|
62
62
|
}
|
|
63
63
|
);
|
|
64
64
|
}
|
|
65
|
-
const G =
|
|
65
|
+
const G = S(w);
|
|
66
66
|
export {
|
|
67
67
|
G as FormInput
|
|
68
68
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormInput.js","sources":["../../src/FormInput/FormInput.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\nimport { Input } from '../Input';\nimport { FormInputProps } from './FormInput.types';\nimport { FieldValues, Path, PathValue } from 'react-hook-form';\nimport { forwardRef, ReactElement, Ref, RefObject } from 'react';\n\n// TODO: add description\n// export const FormInput = <Data extends FieldValues>(\n// props: FormInputProps<Data> & { inputRef?: Ref<HTMLInputElement> }\n// ) => {\n// const { inputRef, form, label, name, onChange, onBlur, style, ...rest } =\n// props;\n// return (\n// <FormRenderControl\n// form={form}\n// name={name}\n// label={label}\n// render={({ field }) => (\n// <FormControl>\n// <Input\n// {...field}\n// {...rest}\n// ref={(el) => {\n// field.ref(el);\n// if (typeof inputRef === 'function') {\n// inputRef(el);\n// } else if (inputRef) {\n// (inputRef as RefObject<HTMLInputElement | null>).current = el;\n// }\n// }}\n// style={style}\n// value={field.value || ''}\n// onChange={(...rest) => {\n// field.onChange?.(...rest);\n// onChange?.(...rest);\n// }}\n// onBlur={(...rest) => {\n// field.onBlur?.();\n// onBlur?.(...rest);\n// }}\n// />\n// </FormControl>\n// )}\n// />\n// );\n// };\n\nfunction FormInputInner<Data extends FieldValues>(\n props: FormInputProps<Data>,\n ref: Ref<HTMLInputElement>\n) {\n const { form, tooltip, tooltipProps, label, name, maxLength, counter, onChange, onBlur, onPaste, style, onPastePrepare, ...rest } = props;\n return (\n <FormRenderControl\n form={form}\n name={name}\n tooltip={tooltip}\n tooltipProps={tooltipProps}\n label={label}\n render={({ field, fieldState }) => (\n <FormControl>\n <Input\n {...field}\n {...rest}\n counter={!!fieldState.error ? false : counter}\n maxLength={maxLength}\n ref={(el) => {\n field.ref(el);\n if (typeof ref === 'function') {\n ref(el);\n } else if (ref) {\n (ref as RefObject<HTMLInputElement | null>).current = el;\n }\n }}\n style={style}\n value={field.value || ''}\n onChange={(...rest) => {\n field.onChange?.(...rest);\n onChange?.(...rest);\n }}\n onPaste={(e) => {\n const pasted = e.clipboardData.getData('text');\n const input = e.currentTarget;\n\n const start = input.selectionStart ?? input.value.length;\n const end = input.selectionEnd ?? input.value.length;\n\n const current = input.value;\n\n let next = current.slice(0, start) + pasted + current.slice(end);\n\n if (onPastePrepare) {\n next = onPastePrepare(next, e);\n }\n\n if (typeof maxLength !== 'number') {\n e.preventDefault();\n\n form.setValue(name, next as PathValue<Data, Path<Data>>, {\n shouldDirty: true,\n shouldTouch: true,\n });\n\n return;\n }\n\n const before = current.slice(0, start);\n const after = current.slice(end);\n\n const available = maxLength - (before.length + after.length);\n\n if (available <= 0) {\n e.preventDefault();\n return;\n }\n\n const limitedPaste = pasted.slice(0, available);\n const limitedNext = before + limitedPaste + after;\n\n e.preventDefault();\n\n form.setValue(name, limitedNext as PathValue<Data, Path<Data>>, {\n shouldDirty: true,\n shouldTouch: true,\n });\n\n requestAnimationFrame(() => {\n input.setSelectionRange(\n before.length + limitedPaste.length,\n before.length + limitedPaste.length\n );\n });\n }}\n onBlur={(...rest) => {\n field.onBlur?.();\n onBlur?.(...rest);\n }}\n />\n </FormControl>\n )}\n />\n );\n}\n\nexport const FormInput = forwardRef(FormInputInner) as <Data extends FieldValues>(\n props: FormInputProps<Data> & { ref?: Ref<HTMLInputElement> }\n) => ReactElement;\n"],"names":["FormInputInner","props","ref","form","tooltip","tooltipProps","label","name","maxLength","counter","onChange","onBlur","onPaste","style","onPastePrepare","rest","jsx","FormRenderControl","field","fieldState","FormControl","Input","el","e","pasted","input","start","end","current","next","before","after","available","limitedPaste","limitedNext","FormInput","forwardRef"],"mappings":";;;;;AA+CA,SAASA,EACPC,GACAC,GACA;AACA,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,OAAAC,GAAO,MAAAC,GAAM,WAAAC,GAAW,SAAAC,GAAS,UAAAC,GAAU,QAAAC,GAAQ,SAAAC,GAAS,OAAAC,GAAO,gBAAAC,GAAgB,GAAGC,MAASd;AACpI,SACE,gBAAAe;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAd;AAAA,MACA,MAAAI;AAAA,MACA,SAAAH;AAAA,MACA,cAAAC;AAAA,MACA,OAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAY,GAAO,YAAAC,EAAA,wBACfC,GAAA,EACC,UAAA,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACE,GAAGH;AAAA,UACH,GAAGH;AAAA,UACJ,SAAWI,EAAW,QAAQ,KAAQV;AAAA,UACtC,WAAAD;AAAA,UACA,KAAK,CAACc,MAAO;AACX,YAAAJ,EAAM,IAAII,CAAE,GACR,OAAOpB,KAAQ,aACjBA,EAAIoB,CAAE,IACGpB,MACRA,EAA2C,UAAUoB;AAAA,UAE1D;AAAA,UACA,OAAAT;AAAA,UACA,OAAOK,EAAM,SAAS;AAAA,UACtB,UAAU,IAAIH,MAAS;AACrB,YAAAG,EAAM,WAAW,GAAGH,CAAI,GACxBL,IAAW,GAAGK,CAAI;AAAA,UACpB;AAAA,UACA,SAAS,CAACQ,MAAM;AACd,kBAAMC,IAASD,EAAE,cAAc,QAAQ,MAAM,GACvCE,IAAQF,EAAE,eAEVG,IAAQD,EAAM,kBAAkBA,EAAM,MAAM,QAC5CE,IAAMF,EAAM,gBAAgBA,EAAM,MAAM,QAExCG,IAAUH,EAAM;AAEtB,gBAAII,IAAOD,EAAQ,MAAM,GAAGF,CAAK,IAAIF,IAASI,EAAQ,MAAMD,CAAG;AAM/D,gBAJIb,MACFe,IAAOf,EAAee,GAAMN,CAAC,IAG3B,OAAOf,KAAc,UAAU;AACjC,cAAAe,EAAE,eAAA,GAEFpB,EAAK,SAASI,GAAMsB,GAAqC;AAAA,gBACvD,aAAa;AAAA,gBACb,aAAa;AAAA,cAAA,CACd;AAED;AAAA,YACF;AAEA,kBAAMC,IAASF,EAAQ,MAAM,GAAGF,CAAK,GAC/BK,IAAQH,EAAQ,MAAMD,CAAG,GAEzBK,IAAYxB,KAAasB,EAAO,SAASC,EAAM;AAErD,gBAAIC,KAAa,GAAG;AAClB,cAAAT,EAAE,eAAA;AACF;AAAA,YACF;AAEA,kBAAMU,IAAeT,EAAO,MAAM,GAAGQ,CAAS,GACxCE,IAAcJ,IAASG,IAAeF;AAE5C,YAAAR,EAAE,eAAA,GAEFpB,EAAK,SAASI,GAAM2B,GAA4C;AAAA,cAC9D,aAAa;AAAA,cACb,aAAa;AAAA,YAAA,CACd,GAED,sBAAsB,MAAM;AAC1B,cAAAT,EAAM;AAAA,gBACJK,EAAO,SAASG,EAAa;AAAA,gBAC7BH,EAAO,SAASG,EAAa;AAAA,cAAA;AAAA,YAEjC,CAAC;AAAA,UACH;AAAA,UACA,QAAQ,IAAIlB,MAAS;AACnB,YAAAG,EAAM,SAAA,GACNP,IAAS,GAAGI,CAAI;AAAA,UAClB;AAAA,QAAA;AAAA,MAAA,EACF,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;AAEO,MAAMoB,IAAYC,EAAWpC,CAAc;"}
|
|
1
|
+
{"version":3,"file":"FormInput.js","sources":["../../src/FormInput/FormInput.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\r\nimport { Input } from '../Input';\r\nimport { FormInputProps } from './FormInput.types';\r\nimport { FieldValues, Path, PathValue } from 'react-hook-form';\r\nimport { forwardRef, ReactElement, Ref, RefObject } from 'react';\r\n\r\n// TODO: add description\r\n// export const FormInput = <Data extends FieldValues>(\r\n// props: FormInputProps<Data> & { inputRef?: Ref<HTMLInputElement> }\r\n// ) => {\r\n// const { inputRef, form, label, name, onChange, onBlur, style, ...rest } =\r\n// props;\r\n// return (\r\n// <FormRenderControl\r\n// form={form}\r\n// name={name}\r\n// label={label}\r\n// render={({ field }) => (\r\n// <FormControl>\r\n// <Input\r\n// {...field}\r\n// {...rest}\r\n// ref={(el) => {\r\n// field.ref(el);\r\n// if (typeof inputRef === 'function') {\r\n// inputRef(el);\r\n// } else if (inputRef) {\r\n// (inputRef as RefObject<HTMLInputElement | null>).current = el;\r\n// }\r\n// }}\r\n// style={style}\r\n// value={field.value || ''}\r\n// onChange={(...rest) => {\r\n// field.onChange?.(...rest);\r\n// onChange?.(...rest);\r\n// }}\r\n// onBlur={(...rest) => {\r\n// field.onBlur?.();\r\n// onBlur?.(...rest);\r\n// }}\r\n// />\r\n// </FormControl>\r\n// )}\r\n// />\r\n// );\r\n// };\r\n\r\nfunction FormInputInner<Data extends FieldValues>(\r\n props: FormInputProps<Data>,\r\n ref: Ref<HTMLInputElement>\r\n) {\r\n const { form, tooltip, tooltipProps, label, name, maxLength, counter, onChange, onBlur, onPaste, style, onPastePrepare, ...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, fieldState }) => (\r\n <FormControl>\r\n <Input\r\n {...field}\r\n {...rest}\r\n counter={!!fieldState.error ? false : counter}\r\n maxLength={maxLength}\r\n ref={(el) => {\r\n field.ref(el);\r\n if (typeof ref === 'function') {\r\n ref(el);\r\n } else if (ref) {\r\n (ref as RefObject<HTMLInputElement | null>).current = el;\r\n }\r\n }}\r\n style={style}\r\n value={field.value || ''}\r\n onChange={(...rest) => {\r\n field.onChange?.(...rest);\r\n onChange?.(...rest);\r\n }}\r\n onPaste={(e) => {\r\n const pasted = e.clipboardData.getData('text');\r\n const input = e.currentTarget;\r\n\r\n const start = input.selectionStart ?? input.value.length;\r\n const end = input.selectionEnd ?? input.value.length;\r\n\r\n const current = input.value;\r\n\r\n let next = current.slice(0, start) + pasted + current.slice(end);\r\n\r\n if (onPastePrepare) {\r\n next = onPastePrepare(next, e);\r\n }\r\n\r\n if (typeof maxLength !== 'number') {\r\n e.preventDefault();\r\n\r\n form.setValue(name, next as PathValue<Data, Path<Data>>, {\r\n shouldDirty: true,\r\n shouldTouch: true,\r\n });\r\n\r\n return;\r\n }\r\n\r\n const before = current.slice(0, start);\r\n const after = current.slice(end);\r\n\r\n const available = maxLength - (before.length + after.length);\r\n\r\n if (available <= 0) {\r\n e.preventDefault();\r\n return;\r\n }\r\n\r\n const limitedPaste = pasted.slice(0, available);\r\n const limitedNext = before + limitedPaste + after;\r\n\r\n e.preventDefault();\r\n\r\n form.setValue(name, limitedNext as PathValue<Data, Path<Data>>, {\r\n shouldDirty: true,\r\n shouldTouch: true,\r\n });\r\n\r\n requestAnimationFrame(() => {\r\n input.setSelectionRange(\r\n before.length + limitedPaste.length,\r\n before.length + limitedPaste.length\r\n );\r\n });\r\n }}\r\n onBlur={(...rest) => {\r\n field.onBlur?.();\r\n onBlur?.(...rest);\r\n }}\r\n />\r\n </FormControl>\r\n )}\r\n />\r\n );\r\n}\r\n\r\nexport const FormInput = forwardRef(FormInputInner) as <Data extends FieldValues>(\r\n props: FormInputProps<Data> & { ref?: Ref<HTMLInputElement> }\r\n) => ReactElement;\r\n"],"names":["FormInputInner","props","ref","form","tooltip","tooltipProps","label","name","maxLength","counter","onChange","onBlur","onPaste","style","onPastePrepare","rest","jsx","FormRenderControl","field","fieldState","FormControl","Input","el","e","pasted","input","start","end","current","next","before","after","available","limitedPaste","limitedNext","FormInput","forwardRef"],"mappings":";;;;;AA+CA,SAASA,EACPC,GACAC,GACA;AACA,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,OAAAC,GAAO,MAAAC,GAAM,WAAAC,GAAW,SAAAC,GAAS,UAAAC,GAAU,QAAAC,GAAQ,SAAAC,GAAS,OAAAC,GAAO,gBAAAC,GAAgB,GAAGC,MAASd;AACpI,SACE,gBAAAe;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAd;AAAA,MACA,MAAAI;AAAA,MACA,SAAAH;AAAA,MACA,cAAAC;AAAA,MACA,OAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAY,GAAO,YAAAC,EAAA,wBACfC,GAAA,EACC,UAAA,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACE,GAAGH;AAAA,UACH,GAAGH;AAAA,UACJ,SAAWI,EAAW,QAAQ,KAAQV;AAAA,UACtC,WAAAD;AAAA,UACA,KAAK,CAACc,MAAO;AACX,YAAAJ,EAAM,IAAII,CAAE,GACR,OAAOpB,KAAQ,aACjBA,EAAIoB,CAAE,IACGpB,MACRA,EAA2C,UAAUoB;AAAA,UAE1D;AAAA,UACA,OAAAT;AAAA,UACA,OAAOK,EAAM,SAAS;AAAA,UACtB,UAAU,IAAIH,MAAS;AACrB,YAAAG,EAAM,WAAW,GAAGH,CAAI,GACxBL,IAAW,GAAGK,CAAI;AAAA,UACpB;AAAA,UACA,SAAS,CAACQ,MAAM;AACd,kBAAMC,IAASD,EAAE,cAAc,QAAQ,MAAM,GACvCE,IAAQF,EAAE,eAEVG,IAAQD,EAAM,kBAAkBA,EAAM,MAAM,QAC5CE,IAAMF,EAAM,gBAAgBA,EAAM,MAAM,QAExCG,IAAUH,EAAM;AAEtB,gBAAII,IAAOD,EAAQ,MAAM,GAAGF,CAAK,IAAIF,IAASI,EAAQ,MAAMD,CAAG;AAM/D,gBAJIb,MACFe,IAAOf,EAAee,GAAMN,CAAC,IAG3B,OAAOf,KAAc,UAAU;AACjC,cAAAe,EAAE,eAAA,GAEFpB,EAAK,SAASI,GAAMsB,GAAqC;AAAA,gBACvD,aAAa;AAAA,gBACb,aAAa;AAAA,cAAA,CACd;AAED;AAAA,YACF;AAEA,kBAAMC,IAASF,EAAQ,MAAM,GAAGF,CAAK,GAC/BK,IAAQH,EAAQ,MAAMD,CAAG,GAEzBK,IAAYxB,KAAasB,EAAO,SAASC,EAAM;AAErD,gBAAIC,KAAa,GAAG;AAClB,cAAAT,EAAE,eAAA;AACF;AAAA,YACF;AAEA,kBAAMU,IAAeT,EAAO,MAAM,GAAGQ,CAAS,GACxCE,IAAcJ,IAASG,IAAeF;AAE5C,YAAAR,EAAE,eAAA,GAEFpB,EAAK,SAASI,GAAM2B,GAA4C;AAAA,cAC9D,aAAa;AAAA,cACb,aAAa;AAAA,YAAA,CACd,GAED,sBAAsB,MAAM;AAC1B,cAAAT,EAAM;AAAA,gBACJK,EAAO,SAASG,EAAa;AAAA,gBAC7BH,EAAO,SAASG,EAAa;AAAA,cAAA;AAAA,YAEjC,CAAC;AAAA,UACH;AAAA,UACA,QAAQ,IAAIlB,MAAS;AACnB,YAAAG,EAAM,SAAA,GACNP,IAAS,GAAGI,CAAI;AAAA,UAClB;AAAA,QAAA;AAAA,MAAA,EACF,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;AAEO,MAAMoB,IAAYC,EAAWpC,CAAc;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormInput.stories.js","sources":["../../src/FormInput/FormInput.stories.tsx"],"sourcesContent":["import React from 'react';\nimport type { Meta, StoryObj } from '@storybook/react';\nimport { FormProvider, useForm } from 'react-hook-form';\n\nimport { FormInput } from './FormInput';\n\ntype FormValues = {\n name: string;\n};\n\ntype ControlledProps = Omit<\n React.ComponentProps<typeof FormInput<FormValues>>,\n 'form' | 'name'\n> & {\n initialValue?: string;\n};\n\nfunction ControlledFormInput({ initialValue = '', ...args }: ControlledProps) {\n const form = useForm<FormValues>({\n defaultValues: {\n name: initialValue,\n },\n });\n\n const value = form.watch('name');\n const tooltip = \"UX/UI принципи, композиція, типографіка, колір, дизайн-системи та робота з інтерфейсами\"\n return (\n <FormProvider {...form}>\n <div className=\"max-w-sm space-y-3\">\n <FormInput<FormValues>\n form={form}\n name=\"name\"\n counter\n maxLength={255}\n tooltip={tooltip}\n label={\"Label\"}\n />\n\n <div className=\"text-xs text-muted-foreground\">\n value: <span className=\"font-mono\">{value}</span>\n </div>\n\n <div className=\"text-xs text-muted-foreground\">\n length: <span className=\"font-mono\">\n {value?.length ?? 0}\n </span>\n </div>\n </div>\n </FormProvider>\n );\n}\n\nconst meta = {\n title: 'FormInput',\n component: FormInput,\n parameters: {\n layout: 'centered',\n },\n args: {\n label: 'Input label',\n placeholder: 'Type something...',\n disabled: false,\n },\n argTypes: {\n form: { control: false },\n name: { control: false },\n onChange: { control: false },\n onBlur: { control: false },\n onPaste: { control: false },\n onPastePrepare: { control: false },\n },\n decorators: [\n (Story) => (\n <div className=\"p-6 w-[420px]\">\n <Story />\n </div>\n ),\n ],\n} satisfies Meta<typeof FormInput>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n render: (args) => <ControlledFormInput {...args} />,\n};\n"],"names":["ControlledFormInput","initialValue","args","form","useForm","value","FormProvider","jsxs","jsx","FormInput","meta","Story","Default"],"mappings":";;;AAiBA,SAASA,EAAoB,EAAE,cAAAC,IAAe,IAAI,GAAGC,KAAyB;AAC5E,QAAMC,IAAOC,EAAoB;AAAA,IAC/B,eAAe;AAAA,MACb,MAAMH;AAAA,IAAA;AAAA,EACR,CACD,GAEKI,IAAQF,EAAK,MAAM,MAAM;AAE/B,2BACGG,GAAA,EAAc,GAAGH,GAChB,UAAA,gBAAAI,EAAC,OAAA,EAAI,WAAU,sBACb,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAAN;AAAA,QACA,MAAK;AAAA,QACL,SAAO;AAAA,QACP,WAAW;AAAA,QACX,SATQ;AAAA,QAUR,OAAO;AAAA,MAAA;AAAA,IAAA;AAAA,IAGT,gBAAAI,EAAC,OAAA,EAAI,WAAU,iCAAgC,UAAA;AAAA,MAAA;AAAA,MACtC,gBAAAC,EAAC,QAAA,EAAK,WAAU,aAAa,UAAAH,EAAA,CAAM;AAAA,IAAA,GAC5C;AAAA,IAEA,gBAAAE,EAAC,OAAA,EAAI,WAAU,iCAAgC,UAAA;AAAA,MAAA;AAAA,wBACpC,QAAA,EAAK,WAAU,aACrB,UAAAF,GAAO,UAAU,EAAA,CACpB;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;AAEA,MAAMK,IAAO;AAAA,EACX,OAAO;AAAA,EACP,WAAWD;AAAA,EACX,YAAY;AAAA,IACV,QAAQ;AAAA,EAAA;AAAA,EAEV,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,aAAa;AAAA,IACb,UAAU;AAAA,EAAA;AAAA,EAEZ,UAAU;AAAA,IACR,MAAM,EAAE,SAAS,GAAA;AAAA,IACjB,MAAM,EAAE,SAAS,GAAA;AAAA,IACjB,UAAU,EAAE,SAAS,GAAA;AAAA,IACrB,QAAQ,EAAE,SAAS,GAAA;AAAA,IACnB,SAAS,EAAE,SAAS,GAAA;AAAA,IACpB,gBAAgB,EAAE,SAAS,GAAA;AAAA,EAAM;AAAA,EAEnC,YAAY;AAAA,IACV,CAACE,MACC,gBAAAH,EAAC,OAAA,EAAI,WAAU,iBACb,UAAA,gBAAAA,EAACG,KAAM,EAAA,CACT;AAAA,EAAA;AAGN,GAMaC,IAAiB;AAAA,EAC5B,QAAQ,CAACV,MAAS,gBAAAM,EAACR,GAAA,EAAqB,GAAGE,EAAA,CAAM;AACnD;"}
|
|
1
|
+
{"version":3,"file":"FormInput.stories.js","sources":["../../src/FormInput/FormInput.stories.tsx"],"sourcesContent":["import React from 'react';\r\nimport type { Meta, StoryObj } from '@storybook/react';\r\nimport { FormProvider, useForm } from 'react-hook-form';\r\n\r\nimport { FormInput } from './FormInput';\r\n\r\ntype FormValues = {\r\n name: string;\r\n};\r\n\r\ntype ControlledProps = Omit<\r\n React.ComponentProps<typeof FormInput<FormValues>>,\r\n 'form' | 'name'\r\n> & {\r\n initialValue?: string;\r\n};\r\n\r\nfunction ControlledFormInput({ initialValue = '', ...args }: ControlledProps) {\r\n const form = useForm<FormValues>({\r\n defaultValues: {\r\n name: initialValue,\r\n },\r\n });\r\n\r\n const value = form.watch('name');\r\n const tooltip = \"UX/UI принципи, композиція, типографіка, колір, дизайн-системи та робота з інтерфейсами\"\r\n return (\r\n <FormProvider {...form}>\r\n <div className=\"max-w-sm space-y-3\">\r\n <FormInput<FormValues>\r\n form={form}\r\n name=\"name\"\r\n counter\r\n maxLength={255}\r\n tooltip={tooltip}\r\n label={\"Label\"}\r\n />\r\n\r\n <div className=\"text-xs text-muted-foreground\">\r\n value: <span className=\"font-mono\">{value}</span>\r\n </div>\r\n\r\n <div className=\"text-xs text-muted-foreground\">\r\n length: <span className=\"font-mono\">\r\n {value?.length ?? 0}\r\n </span>\r\n </div>\r\n </div>\r\n </FormProvider>\r\n );\r\n}\r\n\r\nconst meta = {\r\n title: 'FormInput',\r\n component: FormInput,\r\n parameters: {\r\n layout: 'centered',\r\n },\r\n args: {\r\n label: 'Input label',\r\n placeholder: 'Type something...',\r\n disabled: false,\r\n },\r\n argTypes: {\r\n form: { control: false },\r\n name: { control: false },\r\n onChange: { control: false },\r\n onBlur: { control: false },\r\n onPaste: { control: false },\r\n onPastePrepare: { control: false },\r\n },\r\n decorators: [\r\n (Story) => (\r\n <div className=\"p-6 w-[420px]\">\r\n <Story />\r\n </div>\r\n ),\r\n ],\r\n} satisfies Meta<typeof FormInput>;\r\n\r\nexport default meta;\r\n\r\ntype Story = StoryObj<typeof meta>;\r\n\r\nexport const Default: Story = {\r\n render: (args) => <ControlledFormInput {...args} />,\r\n};\r\n"],"names":["ControlledFormInput","initialValue","args","form","useForm","value","FormProvider","jsxs","jsx","FormInput","meta","Story","Default"],"mappings":";;;AAiBA,SAASA,EAAoB,EAAE,cAAAC,IAAe,IAAI,GAAGC,KAAyB;AAC5E,QAAMC,IAAOC,EAAoB;AAAA,IAC/B,eAAe;AAAA,MACb,MAAMH;AAAA,IAAA;AAAA,EACR,CACD,GAEKI,IAAQF,EAAK,MAAM,MAAM;AAE/B,2BACGG,GAAA,EAAc,GAAGH,GAChB,UAAA,gBAAAI,EAAC,OAAA,EAAI,WAAU,sBACb,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAAN;AAAA,QACA,MAAK;AAAA,QACL,SAAO;AAAA,QACP,WAAW;AAAA,QACX,SATQ;AAAA,QAUR,OAAO;AAAA,MAAA;AAAA,IAAA;AAAA,IAGT,gBAAAI,EAAC,OAAA,EAAI,WAAU,iCAAgC,UAAA;AAAA,MAAA;AAAA,MACtC,gBAAAC,EAAC,QAAA,EAAK,WAAU,aAAa,UAAAH,EAAA,CAAM;AAAA,IAAA,GAC5C;AAAA,IAEA,gBAAAE,EAAC,OAAA,EAAI,WAAU,iCAAgC,UAAA;AAAA,MAAA;AAAA,wBACpC,QAAA,EAAK,WAAU,aACrB,UAAAF,GAAO,UAAU,EAAA,CACpB;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;AAEA,MAAMK,IAAO;AAAA,EACX,OAAO;AAAA,EACP,WAAWD;AAAA,EACX,YAAY;AAAA,IACV,QAAQ;AAAA,EAAA;AAAA,EAEV,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,aAAa;AAAA,IACb,UAAU;AAAA,EAAA;AAAA,EAEZ,UAAU;AAAA,IACR,MAAM,EAAE,SAAS,GAAA;AAAA,IACjB,MAAM,EAAE,SAAS,GAAA;AAAA,IACjB,UAAU,EAAE,SAAS,GAAA;AAAA,IACrB,QAAQ,EAAE,SAAS,GAAA;AAAA,IACnB,SAAS,EAAE,SAAS,GAAA;AAAA,IACpB,gBAAgB,EAAE,SAAS,GAAA;AAAA,EAAM;AAAA,EAEnC,YAAY;AAAA,IACV,CAACE,MACC,gBAAAH,EAAC,OAAA,EAAI,WAAU,iBACb,UAAA,gBAAAA,EAACG,KAAM,EAAA,CACT;AAAA,EAAA;AAGN,GAMaC,IAAiB;AAAA,EAC5B,QAAQ,CAACV,MAAS,gBAAAM,EAACR,GAAA,EAAqB,GAAGE,EAAA,CAAM;AACnD;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormRadio.js","sources":["../../src/FormRadio/FormRadio.tsx"],"sourcesContent":["import { FieldValues } from 'react-hook-form';\n\nimport { FormControl, FormItem } from '../Form/Form';\nimport { FormRenderControl } from '../Form/FormRenderControl';\nimport { Radio } from '../Radio';\n\nimport type { FormRadioGroupProps } from './FormRadio.types.ts';\n\nexport const FormRadio = <Data extends FieldValues>(\n props: FormRadioGroupProps<Data>\n) => {\n const {\n form,\n name,\n label,\n onValueChange,\n value,\n defaultValue,\n renderOption,\n ...rest\n } = props;\n return (\n <FormRenderControl\n form={form}\n name={name}\n label={label}\n render={({ field }) => (\n <FormControl>\n <Radio\n {...field}\n {...rest}\n defaultValue={defaultValue || field.value}\n value={value || field.value}\n onValueChange={(value) => {\n field.onChange(value);\n onValueChange?.(value);\n }}\n renderOption={(option, DefaultOptionComponent) => {\n return (\n <FormItem key={option.value}>\n <FormControl>\n {renderOption?.(option, DefaultOptionComponent) || (\n <DefaultOptionComponent {...option} />\n )}\n </FormControl>\n </FormItem>\n );\n }}\n />\n </FormControl>\n )}\n />\n );\n};\n"],"names":["FormRadio","props","form","name","label","onValueChange","value","defaultValue","renderOption","rest","jsx","FormRenderControl","field","FormControl","Radio","option","DefaultOptionComponent","FormItem"],"mappings":";;;;AAQO,MAAMA,IAAY,CACvBC,MACG;AACH,QAAM;AAAA,IACJ,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,eAAAC;AAAA,IACA,OAAAC;AAAA,IACA,cAAAC;AAAA,IACA,cAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDR;AACJ,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAT;AAAA,MACA,MAAAC;AAAA,MACA,OAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAQ,EAAA,wBACRC,GAAA,EACC,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAGF;AAAA,UACH,GAAGH;AAAA,UACJ,cAAcF,KAAgBK,EAAM;AAAA,UACpC,OAAON,KAASM,EAAM;AAAA,UACtB,eAAe,CAACN,MAAU;AACxB,YAAAM,EAAM,SAASN,CAAK,GACpBD,IAAgBC,CAAK;AAAA,UACvB;AAAA,UACA,cAAc,CAACS,GAAQC,MAEnB,gBAAAN,EAACO,GAAA,EACC,UAAA,gBAAAP,EAACG,GAAA,EACE,cAAeE,GAAQC,CAAsB,KAC5C,gBAAAN,EAACM,KAAwB,GAAGD,EAAA,CAAQ,GAExC,EAAA,GALaA,EAAO,KAMtB;AAAA,QAEJ;AAAA,MAAA,EACF,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;"}
|
|
1
|
+
{"version":3,"file":"FormRadio.js","sources":["../../src/FormRadio/FormRadio.tsx"],"sourcesContent":["import { FieldValues } from 'react-hook-form';\r\n\r\nimport { FormControl, FormItem } from '../Form/Form';\r\nimport { FormRenderControl } from '../Form/FormRenderControl';\r\nimport { Radio } from '../Radio';\r\n\r\nimport type { FormRadioGroupProps } from './FormRadio.types.ts';\r\n\r\nexport const FormRadio = <Data extends FieldValues>(\r\n props: FormRadioGroupProps<Data>\r\n) => {\r\n const {\r\n form,\r\n name,\r\n label,\r\n onValueChange,\r\n value,\r\n defaultValue,\r\n renderOption,\r\n ...rest\r\n } = props;\r\n return (\r\n <FormRenderControl\r\n form={form}\r\n name={name}\r\n label={label}\r\n render={({ field }) => (\r\n <FormControl>\r\n <Radio\r\n {...field}\r\n {...rest}\r\n defaultValue={defaultValue || field.value}\r\n value={value || field.value}\r\n onValueChange={(value) => {\r\n field.onChange(value);\r\n onValueChange?.(value);\r\n }}\r\n renderOption={(option, DefaultOptionComponent) => {\r\n return (\r\n <FormItem key={option.value}>\r\n <FormControl>\r\n {renderOption?.(option, DefaultOptionComponent) || (\r\n <DefaultOptionComponent {...option} />\r\n )}\r\n </FormControl>\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n </FormControl>\r\n )}\r\n />\r\n );\r\n};\r\n"],"names":["FormRadio","props","form","name","label","onValueChange","value","defaultValue","renderOption","rest","jsx","FormRenderControl","field","FormControl","Radio","option","DefaultOptionComponent","FormItem"],"mappings":";;;;AAQO,MAAMA,IAAY,CACvBC,MACG;AACH,QAAM;AAAA,IACJ,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,eAAAC;AAAA,IACA,OAAAC;AAAA,IACA,cAAAC;AAAA,IACA,cAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDR;AACJ,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAT;AAAA,MACA,MAAAC;AAAA,MACA,OAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAQ,EAAA,wBACRC,GAAA,EACC,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAGF;AAAA,UACH,GAAGH;AAAA,UACJ,cAAcF,KAAgBK,EAAM;AAAA,UACpC,OAAON,KAASM,EAAM;AAAA,UACtB,eAAe,CAACN,MAAU;AACxB,YAAAM,EAAM,SAASN,CAAK,GACpBD,IAAgBC,CAAK;AAAA,UACvB;AAAA,UACA,cAAc,CAACS,GAAQC,MAEnB,gBAAAN,EAACO,GAAA,EACC,UAAA,gBAAAP,EAACG,GAAA,EACE,cAAeE,GAAQC,CAAsB,KAC5C,gBAAAN,EAACM,KAAwB,GAAGD,EAAA,CAAQ,GAExC,EAAA,GALaA,EAAO,KAMtB;AAAA,QAEJ;AAAA,MAAA,EACF,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;"}
|
package/FormSelect/FormSelect.js
CHANGED
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { Select as u } from "../Select/Select.js";
|
|
3
3
|
import { FormRenderControl as x } from "../Form/FormRenderControl.js";
|
|
4
|
-
import "
|
|
5
|
-
|
|
6
|
-
import "@oneplatformdev/utils";
|
|
7
|
-
import { Select as F } from "../Select/Select.js";
|
|
8
|
-
const V = (m) => {
|
|
4
|
+
import { FormControl as F } from "../Form/Form.js";
|
|
5
|
+
const b = (m) => {
|
|
9
6
|
const {
|
|
10
7
|
value: i = void 0,
|
|
11
8
|
form: p,
|
|
@@ -30,7 +27,7 @@ const V = (m) => {
|
|
|
30
27
|
label: a,
|
|
31
28
|
containerProps: C,
|
|
32
29
|
render: ({ field: t }) => /* @__PURE__ */ e(
|
|
33
|
-
|
|
30
|
+
u,
|
|
34
31
|
{
|
|
35
32
|
value: t.value ?? (i || ""),
|
|
36
33
|
options: c,
|
|
@@ -38,7 +35,7 @@ const V = (m) => {
|
|
|
38
35
|
const o = n ? n(r) : r;
|
|
39
36
|
t.onChange(o), h?.(r, o);
|
|
40
37
|
},
|
|
41
|
-
renderTrigger: (r, o) => /* @__PURE__ */ e(
|
|
38
|
+
renderTrigger: (r, o) => /* @__PURE__ */ e(F, { children: d?.(r, o) || o }),
|
|
42
39
|
...f
|
|
43
40
|
}
|
|
44
41
|
)
|
|
@@ -46,6 +43,6 @@ const V = (m) => {
|
|
|
46
43
|
);
|
|
47
44
|
};
|
|
48
45
|
export {
|
|
49
|
-
|
|
46
|
+
b as FormSelect
|
|
50
47
|
};
|
|
51
48
|
//# sourceMappingURL=FormSelect.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormSelect.js","sources":["../../src/FormSelect/FormSelect.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\nimport { Select } from '../Select';\nimport { FormSelectProps } from './FormSelect.types';\nimport { FieldValues } from 'react-hook-form';\n\n// TODO: add description\nexport const FormSelect = <Data extends FieldValues, ExtendOptionData>(\n props: FormSelectProps<Data, ExtendOptionData>\n) => {\n const {\n value = undefined,\n form,\n label,\n tooltip,\n tooltipProps,\n name,\n options = [],\n onChange,\n containerProps,\n renderTrigger,\n onChangePrepare,\n ...rest\n } = props;\n\n return (\n <FormRenderControl\n form={form}\n name={name}\n tooltip={tooltip}\n tooltipProps={tooltipProps}\n label={label}\n containerProps={containerProps}\n render={({ field }) => (\n <Select<ExtendOptionData>\n value={field.value ?? (value || '')}\n options={options}\n onChange={(value) => {\n const nextValue = onChangePrepare ? onChangePrepare(value) : value;\n field.onChange(nextValue);\n onChange?.(value, nextValue);\n }}\n renderTrigger={(p, defaultComponent) => {\n return (\n <FormControl>\n {renderTrigger?.(p, defaultComponent) || defaultComponent}\n </FormControl>\n )\n }}\n {...rest}\n />\n )}\n />\n );\n};\n"],"names":["FormSelect","props","value","form","label","tooltip","tooltipProps","name","options","onChange","containerProps","renderTrigger","onChangePrepare","rest","jsx","FormRenderControl","field","Select","nextValue","p","defaultComponent","FormControl"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FormSelect.js","sources":["../../src/FormSelect/FormSelect.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\r\nimport { Select } from '../Select';\r\nimport { FormSelectProps } from './FormSelect.types';\r\nimport { FieldValues } from 'react-hook-form';\r\n\r\n// TODO: add description\r\nexport const FormSelect = <Data extends FieldValues, ExtendOptionData>(\r\n props: FormSelectProps<Data, ExtendOptionData>\r\n) => {\r\n const {\r\n value = undefined,\r\n form,\r\n label,\r\n tooltip,\r\n tooltipProps,\r\n name,\r\n options = [],\r\n onChange,\r\n containerProps,\r\n renderTrigger,\r\n onChangePrepare,\r\n ...rest\r\n } = props;\r\n\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 containerProps={containerProps}\r\n render={({ field }) => (\r\n <Select<ExtendOptionData>\r\n value={field.value ?? (value || '')}\r\n options={options}\r\n onChange={(value) => {\r\n const nextValue = onChangePrepare ? onChangePrepare(value) : value;\r\n field.onChange(nextValue);\r\n onChange?.(value, nextValue);\r\n }}\r\n renderTrigger={(p, defaultComponent) => {\r\n return (\r\n <FormControl>\r\n {renderTrigger?.(p, defaultComponent) || defaultComponent}\r\n </FormControl>\r\n )\r\n }}\r\n {...rest}\r\n />\r\n )}\r\n />\r\n );\r\n};\r\n"],"names":["FormSelect","props","value","form","label","tooltip","tooltipProps","name","options","onChange","containerProps","renderTrigger","onChangePrepare","rest","jsx","FormRenderControl","field","Select","nextValue","p","defaultComponent","FormControl"],"mappings":";;;;AAMO,MAAMA,IAAa,CACxBC,MACG;AACH,QAAM;AAAA,IACJ,OAAAC,IAAQ;AAAA,IACR,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,MAAAC;AAAA,IACA,SAAAC,IAAU,CAAA;AAAA,IACV,UAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDZ;AAEJ,SACE,gBAAAa;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAZ;AAAA,MACA,MAAAI;AAAA,MACA,SAAAF;AAAA,MACA,cAAAC;AAAA,MACA,OAAAF;AAAA,MACA,gBAAAM;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAM,EAAA,MACT,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,OAAOD,EAAM,UAAUd,KAAS;AAAA,UAChC,SAAAM;AAAA,UACA,UAAU,CAACN,MAAU;AACnB,kBAAMgB,IAAYN,IAAkBA,EAAgBV,CAAK,IAAIA;AAC7D,YAAAc,EAAM,SAASE,CAAS,GACxBT,IAAWP,GAAOgB,CAAS;AAAA,UAC7B;AAAA,UACA,eAAe,CAACC,GAAGC,wBAEdC,GAAA,EACE,UAAAV,IAAgBQ,GAAGC,CAAgB,KAAKA,GAC3C;AAAA,UAGH,GAAGP;AAAA,QAAA;AAAA,MAAA;AAAA,IACN;AAAA,EAAA;AAIR;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { Textarea as f } from "../Textarea/Textarea.js";
|
|
3
3
|
import { FormRenderControl as u } from "../Form/FormRenderControl.js";
|
|
4
|
-
import {
|
|
4
|
+
import { FormControl as x } from "../Form/Form.js";
|
|
5
5
|
const P = (e) => {
|
|
6
6
|
const { form: t, label: m, tooltip: n, tooltipProps: a, name: l, containerProps: p, counter: i, ...s } = e;
|
|
7
7
|
return /* @__PURE__ */ r(
|
|
@@ -13,8 +13,8 @@ const P = (e) => {
|
|
|
13
13
|
name: l,
|
|
14
14
|
label: m,
|
|
15
15
|
containerProps: p,
|
|
16
|
-
render: ({ field: o, fieldState: c }) => /* @__PURE__ */ r(
|
|
17
|
-
|
|
16
|
+
render: ({ field: o, fieldState: c }) => /* @__PURE__ */ r(x, { children: /* @__PURE__ */ r(
|
|
17
|
+
f,
|
|
18
18
|
{
|
|
19
19
|
...o,
|
|
20
20
|
value: o.value || "",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormTextarea.js","sources":["../../src/FormTextarea/FormTextarea.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\nimport { FormTextareaProps } from './FormTextarea.types';\nimport { FieldValues } from 'react-hook-form';\nimport { Textarea } from '../Textarea';\n\n// TODO: add description\nexport const FormTextarea = <Data extends FieldValues>(\n props: FormTextareaProps<Data>\n) => {\n const { form, label, tooltip, tooltipProps, name, containerProps, counter, ...rest } = props;\n return (\n <FormRenderControl\n form={form}\n tooltip={tooltip}\n tooltipProps={tooltipProps}\n name={name}\n label={label}\n containerProps={containerProps}\n render={({ field, fieldState }) => (\n <FormControl>\n <Textarea\n {...field}\n value={field.value || ''}\n {...rest}\n counter={!!fieldState.error ? false : counter}\n />\n </FormControl>\n )}\n />\n )\n};\n"],"names":["FormTextarea","props","form","label","tooltip","tooltipProps","name","containerProps","counter","rest","jsx","FormRenderControl","field","fieldState","FormControl","Textarea"],"mappings":";;;;AAMO,MAAMA,IAAe,CAC1BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,gBAAAC,GAAgB,SAAAC,GAAS,GAAGC,EAAA,IAASR;AACvF,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAT;AAAA,MACA,SAAAE;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,OAAAH;AAAA,MACA,gBAAAI;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAK,GAAO,YAAAC,EAAA,wBACfC,GAAA,EACC,UAAA,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACE,GAAGH;AAAA,UACJ,OAAOA,EAAM,SAAS;AAAA,UACrB,GAAGH;AAAA,UACJ,SAAWI,EAAW,QAAQ,KAAQL;AAAA,QAAA;AAAA,MAAA,EACxC,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;"}
|
|
1
|
+
{"version":3,"file":"FormTextarea.js","sources":["../../src/FormTextarea/FormTextarea.tsx"],"sourcesContent":["import { FormControl, FormRenderControl } from '../Form';\r\nimport { FormTextareaProps } from './FormTextarea.types';\r\nimport { FieldValues } from 'react-hook-form';\r\nimport { Textarea } from '../Textarea';\r\n\r\n// TODO: add description\r\nexport const FormTextarea = <Data extends FieldValues>(\r\n props: FormTextareaProps<Data>\r\n) => {\r\n const { form, label, tooltip, tooltipProps, name, containerProps, counter, ...rest } = props;\r\n return (\r\n <FormRenderControl\r\n form={form}\r\n tooltip={tooltip}\r\n tooltipProps={tooltipProps}\r\n name={name}\r\n label={label}\r\n containerProps={containerProps}\r\n render={({ field, fieldState }) => (\r\n <FormControl>\r\n <Textarea\r\n {...field}\r\n value={field.value || ''}\r\n {...rest}\r\n counter={!!fieldState.error ? false : counter}\r\n />\r\n </FormControl>\r\n )}\r\n />\r\n )\r\n};\r\n"],"names":["FormTextarea","props","form","label","tooltip","tooltipProps","name","containerProps","counter","rest","jsx","FormRenderControl","field","fieldState","FormControl","Textarea"],"mappings":";;;;AAMO,MAAMA,IAAe,CAC1BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,gBAAAC,GAAgB,SAAAC,GAAS,GAAGC,EAAA,IAASR;AACvF,SACE,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAT;AAAA,MACA,SAAAE;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,OAAAH;AAAA,MACA,gBAAAI;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAK,GAAO,YAAAC,EAAA,wBACfC,GAAA,EACC,UAAA,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACE,GAAGH;AAAA,UACJ,OAAOA,EAAM,SAAS;AAAA,UACrB,GAAGH;AAAA,UACJ,SAAWI,EAAW,QAAQ,KAAQL;AAAA,QAAA;AAAA,MAAA,EACxC,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;"}
|
package/Header/Header.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.js","sources":["../../src/Header/Header.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { SidebarTrigger } from \"../Sidebar\";\nimport { Separator } from \"../Separator\";\nimport { HeaderProps } from \"./Header.types\";\n\nexport const Header: React.FC<React.PropsWithChildren<HeaderProps>> = (props) => {\n const {\n children,\n hideTrigger = false,\n } = props;\n return (\n <header\n className=\"flex h-16 shrink-0 items-center justify-between gap-2 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-12\"\n >\n {!hideTrigger && (\n <div className=\"flex items-center gap-2\">\n <SidebarTrigger className=\"ml-1\"/>\n <Separator orientation=\"vertical\" className=\"mr-2 h-4\"/>\n </div>\n )}\n {Boolean(hideTrigger)\n ? children\n : (\n <div className=\"flex-1 text-right pr-6\">\n {children}\n </div>\n )\n }\n </header>\n )\n}\n\nexport default Header;\n"],"names":["Header","props","children","hideTrigger","jsxs","jsx","SidebarTrigger","Separator"],"mappings":";;;AAMO,MAAMA,IAAyD,CAACC,MAAU;AAC/E,QAAM;AAAA,IACJ,UAAAC;AAAA,IACA,aAAAC,IAAc;AAAA,EAAA,IACZF;AACJ,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MAET,UAAA;AAAA,QAAA,CAACD,KACA,gBAAAC,EAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,UAAA,gBAAAC,EAACC,GAAA,EAAe,WAAU,OAAA,CAAM;AAAA,UAChC,gBAAAD,EAACE,GAAA,EAAU,aAAY,YAAW,WAAU,WAAA,CAAU;AAAA,QAAA,GACxD;AAAA,QAEOJ,IACLD,sBAEC,OAAA,EAAI,WAAU,0BACZ,UAAAA,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAKV;"}
|
|
1
|
+
{"version":3,"file":"Header.js","sources":["../../src/Header/Header.tsx"],"sourcesContent":["import * as React from \"react\";\r\n\r\nimport { SidebarTrigger } from \"../Sidebar\";\r\nimport { Separator } from \"../Separator\";\r\nimport { HeaderProps } from \"./Header.types\";\r\n\r\nexport const Header: React.FC<React.PropsWithChildren<HeaderProps>> = (props) => {\r\n const {\r\n children,\r\n hideTrigger = false,\r\n } = props;\r\n return (\r\n <header\r\n className=\"flex h-16 shrink-0 items-center justify-between gap-2 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-12\"\r\n >\r\n {!hideTrigger && (\r\n <div className=\"flex items-center gap-2\">\r\n <SidebarTrigger className=\"ml-1\"/>\r\n <Separator orientation=\"vertical\" className=\"mr-2 h-4\"/>\r\n </div>\r\n )}\r\n {Boolean(hideTrigger)\r\n ? children\r\n : (\r\n <div className=\"flex-1 text-right pr-6\">\r\n {children}\r\n </div>\r\n )\r\n }\r\n </header>\r\n )\r\n}\r\n\r\nexport default Header;\r\n"],"names":["Header","props","children","hideTrigger","jsxs","jsx","SidebarTrigger","Separator"],"mappings":";;;AAMO,MAAMA,IAAyD,CAACC,MAAU;AAC/E,QAAM;AAAA,IACJ,UAAAC;AAAA,IACA,aAAAC,IAAc;AAAA,EAAA,IACZF;AACJ,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MAET,UAAA;AAAA,QAAA,CAACD,KACA,gBAAAC,EAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,UAAA,gBAAAC,EAACC,GAAA,EAAe,WAAU,OAAA,CAAM;AAAA,UAChC,gBAAAD,EAACE,GAAA,EAAU,aAAY,YAAW,WAAU,WAAA,CAAU;AAAA,QAAA,GACxD;AAAA,QAEOJ,IACLD,sBAEC,OAAA,EAAI,WAAU,0BACZ,UAAAA,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAKV;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HoverCard.js","sources":["../../src/HoverCard/HoverCard.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as HoverCardPrimitive from \"@radix-ui/react-hover-card\"\n\nimport { cn } from \"@oneplatformdev/utils\"\n\nconst HoverCard = HoverCardPrimitive.Root\n\nconst HoverCardTrigger = HoverCardPrimitive.Trigger\n\nconst HoverCardContent = React.forwardRef<\n React.ElementRef<typeof HoverCardPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof HoverCardPrimitive.Content>\n>(({ className, align = \"center\", sideOffset = 4, ...props }, ref) => (\n <HoverCardPrimitive.Content\n ref={ref}\n align={align}\n sideOffset={sideOffset}\n className={cn(\n \"z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\",\n className\n )}\n {...props}\n />\n))\nHoverCardContent.displayName = HoverCardPrimitive.Content.displayName\n\nexport { HoverCard, HoverCardTrigger, HoverCardContent }\n"],"names":["HoverCard","HoverCardPrimitive","HoverCardTrigger","HoverCardContent","React","className","align","sideOffset","props","ref","jsx","cn"],"mappings":";;;;AAOA,MAAMA,IAAYC,EAAmB,MAE/BC,IAAmBD,EAAmB,SAEtCE,IAAmBC,EAAM,WAG7B,CAAC,EAAE,WAAAC,GAAW,OAAAC,IAAQ,UAAU,YAAAC,IAAa,GAAG,GAAGC,EAAA,GAASC,MAC5D,gBAAAC;AAAA,EAACT,EAAmB;AAAA,EAAnB;AAAA,IACC,KAAAQ;AAAA,IACA,OAAAH;AAAA,IACA,YAAAC;AAAA,IACA,WAAWI;AAAA,MACT;AAAA,MACAN;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,EAAA;AACN,CACD;AACDL,EAAiB,cAAcF,EAAmB,QAAQ;"}
|
|
1
|
+
{"version":3,"file":"HoverCard.js","sources":["../../src/HoverCard/HoverCard.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport * as HoverCardPrimitive from \"@radix-ui/react-hover-card\"\r\n\r\nimport { cn } from \"@oneplatformdev/utils\"\r\n\r\nconst HoverCard = HoverCardPrimitive.Root\r\n\r\nconst HoverCardTrigger = HoverCardPrimitive.Trigger\r\n\r\nconst HoverCardContent = React.forwardRef<\r\n React.ElementRef<typeof HoverCardPrimitive.Content>,\r\n React.ComponentPropsWithoutRef<typeof HoverCardPrimitive.Content>\r\n>(({ className, align = \"center\", sideOffset = 4, ...props }, ref) => (\r\n <HoverCardPrimitive.Content\r\n ref={ref}\r\n align={align}\r\n sideOffset={sideOffset}\r\n className={cn(\r\n \"z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\",\r\n className\r\n )}\r\n {...props}\r\n />\r\n))\r\nHoverCardContent.displayName = HoverCardPrimitive.Content.displayName\r\n\r\nexport { HoverCard, HoverCardTrigger, HoverCardContent }\r\n"],"names":["HoverCard","HoverCardPrimitive","HoverCardTrigger","HoverCardContent","React","className","align","sideOffset","props","ref","jsx","cn"],"mappings":";;;;AAOA,MAAMA,IAAYC,EAAmB,MAE/BC,IAAmBD,EAAmB,SAEtCE,IAAmBC,EAAM,WAG7B,CAAC,EAAE,WAAAC,GAAW,OAAAC,IAAQ,UAAU,YAAAC,IAAa,GAAG,GAAGC,EAAA,GAASC,MAC5D,gBAAAC;AAAA,EAACT,EAAmB;AAAA,EAAnB;AAAA,IACC,KAAAQ;AAAA,IACA,OAAAH;AAAA,IACA,YAAAC;AAAA,IACA,WAAWI;AAAA,MACT;AAAA,MACAN;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,EAAA;AACN,CACD;AACDL,EAAiB,cAAcF,EAAmB,QAAQ;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InfoBlock.js","sources":["../../src/InfoBlock/InfoBlock.tsx"],"sourcesContent":["import { InfoBlockIconType, InfoBlockProps } from \"./InfoBlock.types\";\nimport { cn } from \"@oneplatformdev/utils\";\nimport { infoBlockVariants } from \"./infoBlockVariants\";\nimport { createElement, isValidElement } from \"react\";\nimport { TriangleAlertIcon, InfoIcon } from \"lucide-react\";\n\nconst renderInnerIcon = (Icon?: InfoBlockIconType) => {\n if (!Icon) return null;\n if (isValidElement(Icon)) return Icon;\n return createElement(Icon);\n};\n\nconst iconByVariant: Record<NonNullable<InfoBlockProps['variant']>, InfoBlockIconType> = {\n error: <TriangleAlertIcon className='fill-[#DC2626] text-white!'/>,\n info: <InfoIcon className='fill-[#9368FF] text-white!'/>\n}\n\nexport const InfoBlock = (props: InfoBlockProps) => {\n const { className, variant = 'error', content, icon, children, node, ...rest } = props;\n return (\n <div\n {...rest}\n className={cn(infoBlockVariants({ className, variant }))}\n >\n {children ?? (\n <>\n {renderInnerIcon(icon ?? iconByVariant[variant!])}\n {node ?? (\n <span className='whitespace-pre-wrap wrap-break-word line-clamp-10'>\n {content}\n </span>\n )}\n </>\n )}\n </div>\n )\n}\nInfoBlock.displayName = 'InfoBlock';\nexport default InfoBlock;\n\n"],"names":["renderInnerIcon","Icon","isValidElement","createElement","iconByVariant","jsx","TriangleAlertIcon","InfoIcon","InfoBlock","props","className","variant","content","icon","children","node","rest","cn","infoBlockVariants","jsxs","Fragment"],"mappings":";;;;;AAMA,MAAMA,IAAkB,CAACC,MAClBA,IACDC,EAAeD,CAAI,IAAUA,IAC1BE,EAAcF,CAAI,IAFP,MAKdG,IAAmF;AAAA,EACvF,OAAO,gBAAAC,EAACC,GAAA,EAAkB,WAAU,6BAAA,CAA4B;AAAA,EAChE,MAAM,gBAAAD,EAACE,GAAA,EAAS,WAAU,6BAAA,CAA4B;AACxD,GAEaC,IAAY,CAACC,MAA0B;AAClD,QAAM,EAAE,WAAAC,GAAW,SAAAC,IAAU,SAAS,SAAAC,GAAS,MAAAC,GAAM,UAAAC,GAAU,MAAAC,GAAM,GAAGC,EAAA,IAASP;AACjF,SACE,gBAAAJ;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGW;AAAA,MACJ,WAAWC,EAAGC,EAAkB,EAAE,WAAAR,GAAW,SAAAC,EAAA,CAAS,CAAC;AAAA,MAEtD,eACC,gBAAAQ,EAAAC,GAAA,EACG,UAAA;AAAA,QAAApB,EAAgBa,KAAQT,EAAcO,CAAQ,CAAC;AAAA,QAC/CI,KACC,gBAAAV,EAAC,QAAA,EAAK,WAAU,qDACf,UAAAO,EAAA,CACH;AAAA,MAAA,EAAA,CAEF;AAAA,IAAA;AAAA,EAAA;AAIR;AACAJ,EAAU,cAAc;"}
|
|
1
|
+
{"version":3,"file":"InfoBlock.js","sources":["../../src/InfoBlock/InfoBlock.tsx"],"sourcesContent":["import { InfoBlockIconType, InfoBlockProps } from \"./InfoBlock.types\";\r\nimport { cn } from \"@oneplatformdev/utils\";\r\nimport { infoBlockVariants } from \"./infoBlockVariants\";\r\nimport { createElement, isValidElement } from \"react\";\r\nimport { TriangleAlertIcon, InfoIcon } from \"lucide-react\";\r\n\r\nconst renderInnerIcon = (Icon?: InfoBlockIconType) => {\r\n if (!Icon) return null;\r\n if (isValidElement(Icon)) return Icon;\r\n return createElement(Icon);\r\n};\r\n\r\nconst iconByVariant: Record<NonNullable<InfoBlockProps['variant']>, InfoBlockIconType> = {\r\n error: <TriangleAlertIcon className='fill-[#DC2626] text-white!'/>,\r\n info: <InfoIcon className='fill-[#9368FF] text-white!'/>\r\n}\r\n\r\nexport const InfoBlock = (props: InfoBlockProps) => {\r\n const { className, variant = 'error', content, icon, children, node, ...rest } = props;\r\n return (\r\n <div\r\n {...rest}\r\n className={cn(infoBlockVariants({ className, variant }))}\r\n >\r\n {children ?? (\r\n <>\r\n {renderInnerIcon(icon ?? iconByVariant[variant!])}\r\n {node ?? (\r\n <span className='whitespace-pre-wrap wrap-break-word line-clamp-10'>\r\n {content}\r\n </span>\r\n )}\r\n </>\r\n )}\r\n </div>\r\n )\r\n}\r\nInfoBlock.displayName = 'InfoBlock';\r\nexport default InfoBlock;\r\n\r\n"],"names":["renderInnerIcon","Icon","isValidElement","createElement","iconByVariant","jsx","TriangleAlertIcon","InfoIcon","InfoBlock","props","className","variant","content","icon","children","node","rest","cn","infoBlockVariants","jsxs","Fragment"],"mappings":";;;;;AAMA,MAAMA,IAAkB,CAACC,MAClBA,IACDC,EAAeD,CAAI,IAAUA,IAC1BE,EAAcF,CAAI,IAFP,MAKdG,IAAmF;AAAA,EACvF,OAAO,gBAAAC,EAACC,GAAA,EAAkB,WAAU,6BAAA,CAA4B;AAAA,EAChE,MAAM,gBAAAD,EAACE,GAAA,EAAS,WAAU,6BAAA,CAA4B;AACxD,GAEaC,IAAY,CAACC,MAA0B;AAClD,QAAM,EAAE,WAAAC,GAAW,SAAAC,IAAU,SAAS,SAAAC,GAAS,MAAAC,GAAM,UAAAC,GAAU,MAAAC,GAAM,GAAGC,EAAA,IAASP;AACjF,SACE,gBAAAJ;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGW;AAAA,MACJ,WAAWC,EAAGC,EAAkB,EAAE,WAAAR,GAAW,SAAAC,EAAA,CAAS,CAAC;AAAA,MAEtD,eACC,gBAAAQ,EAAAC,GAAA,EACG,UAAA;AAAA,QAAApB,EAAgBa,KAAQT,EAAcO,CAAQ,CAAC;AAAA,QAC/CI,KACC,gBAAAV,EAAC,QAAA,EAAK,WAAU,qDACf,UAAAO,EAAA,CACH;AAAA,MAAA,EAAA,CAEF;AAAA,IAAA;AAAA,EAAA;AAIR;AACAJ,EAAU,cAAc;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InfoBlock.stories.js","sources":["../../src/InfoBlock/InfoBlock.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react-vite';\nimport { InfoBlock } from './InfoBlock';\nimport { CircleAlert } from 'lucide-react';\n\nconst meta = {\n title: 'UI/InfoBlock',\n component: InfoBlock,\n argTypes: {\n variant: {\n control: 'select',\n options: ['error', 'info'],\n description: 'Defines the color scheme and default icon',\n },\n content: {\n control: 'text',\n description: 'Text or content inside the block',\n },\n },\n parameters: {\n layout: 'centered',\n },\n} satisfies Meta<typeof InfoBlock>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Error: Story = {\n args: {\n variant: 'error',\n content: 'Увага! Перш ніж архівувати підрозділ “Підрозділ дизайну”, переведіть співробітників до іншого — інакше вони будуть автоматично звільнені.',\n },\n};\n\nexport const Info: Story = {\n args: {\n variant: 'info',\n content: 'Зміни вступлять в силу після збереження налаштувань профілю.',\n },\n};\n\nexport const CustomIcon: Story = {\n args: {\n variant: 'info',\n icon: <CircleAlert className=\"text-blue-500\" />,\n content: 'Цей блок використовує передану вручну іконку замість стандартної.',\n },\n};\n\nexport const LongContent: Story = {\n args: {\n variant: 'error',\n content: 'Дуже довгий текст: '.repeat(20),\n },\n};\n"],"names":["meta","InfoBlock","Error","Info","CustomIcon","jsx","CircleAlert","LongContent"],"mappings":";;;AAIA,MAAMA,IAAO;AAAA,EACX,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS,CAAC,SAAS,MAAM;AAAA,MACzB,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAAA,EAEF,YAAY;AAAA,IACV,QAAQ;AAAA,EAAA;AAEZ,GAMaC,IAAe;AAAA,EAC1B,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,SAAS;AAAA,EAAA;AAEb,GAEaC,IAAc;AAAA,EACzB,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,SAAS;AAAA,EAAA;AAEb,GAEaC,IAAoB;AAAA,EAC/B,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,MAAM,gBAAAC,EAACC,GAAA,EAAY,WAAU,gBAAA,CAAgB;AAAA,IAC7C,SAAS;AAAA,EAAA;AAEb,GAEaC,IAAqB;AAAA,EAChC,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,SAAS,sBAAsB,OAAO,EAAE;AAAA,EAAA;AAE5C;"}
|
|
1
|
+
{"version":3,"file":"InfoBlock.stories.js","sources":["../../src/InfoBlock/InfoBlock.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react-vite';\r\nimport { InfoBlock } from './InfoBlock';\r\nimport { CircleAlert } from 'lucide-react';\r\n\r\nconst meta = {\r\n title: 'UI/InfoBlock',\r\n component: InfoBlock,\r\n argTypes: {\r\n variant: {\r\n control: 'select',\r\n options: ['error', 'info'],\r\n description: 'Defines the color scheme and default icon',\r\n },\r\n content: {\r\n control: 'text',\r\n description: 'Text or content inside the block',\r\n },\r\n },\r\n parameters: {\r\n layout: 'centered',\r\n },\r\n} satisfies Meta<typeof InfoBlock>;\r\n\r\nexport default meta;\r\n\r\ntype Story = StoryObj<typeof meta>;\r\n\r\nexport const Error: Story = {\r\n args: {\r\n variant: 'error',\r\n content: 'Увага! Перш ніж архівувати підрозділ “Підрозділ дизайну”, переведіть співробітників до іншого — інакше вони будуть автоматично звільнені.',\r\n },\r\n};\r\n\r\nexport const Info: Story = {\r\n args: {\r\n variant: 'info',\r\n content: 'Зміни вступлять в силу після збереження налаштувань профілю.',\r\n },\r\n};\r\n\r\nexport const CustomIcon: Story = {\r\n args: {\r\n variant: 'info',\r\n icon: <CircleAlert className=\"text-blue-500\" />,\r\n content: 'Цей блок використовує передану вручну іконку замість стандартної.',\r\n },\r\n};\r\n\r\nexport const LongContent: Story = {\r\n args: {\r\n variant: 'error',\r\n content: 'Дуже довгий текст: '.repeat(20),\r\n },\r\n};\r\n"],"names":["meta","InfoBlock","Error","Info","CustomIcon","jsx","CircleAlert","LongContent"],"mappings":";;;AAIA,MAAMA,IAAO;AAAA,EACX,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS,CAAC,SAAS,MAAM;AAAA,MACzB,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAAA,EAEF,YAAY;AAAA,IACV,QAAQ;AAAA,EAAA;AAEZ,GAMaC,IAAe;AAAA,EAC1B,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,SAAS;AAAA,EAAA;AAEb,GAEaC,IAAc;AAAA,EACzB,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,SAAS;AAAA,EAAA;AAEb,GAEaC,IAAoB;AAAA,EAC/B,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,MAAM,gBAAAC,EAACC,GAAA,EAAY,WAAU,gBAAA,CAAgB;AAAA,IAC7C,SAAS;AAAA,EAAA;AAEb,GAEaC,IAAqB;AAAA,EAChC,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,SAAS,sBAAsB,OAAO,EAAE;AAAA,EAAA;AAE5C;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"infoBlockVariants.js","sources":["../../src/InfoBlock/infoBlockVariants.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const infoBlockVariants = cva(\n [\n 'flex items-start gap-2',\n 'p-2.5 rounded-lg',\n 'font-medium text-base leading-normal text-[#06080D]',\n 'whitespace-pre-wrap break-words',\n '[&>p]:m-0 [&>p]:p-0',\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:size-6\",\n 'transition-transform duration-200 [&_svg]:transition-transform [&_svg]:duration-200',\n ],\n {\n variants: {\n variant: {\n error: 'bg-[#DC26260F] [&>svg]:text-[#DC2626]',\n info: 'bg-[#9368FF0F] [&>svg]:text-[#9368FF]',\n },\n },\n defaultVariants: {\n variant: 'error',\n },\n }\n)\n\nexport type InfoBlockVariantsProps = VariantProps<typeof infoBlockVariants>;\n"],"names":["infoBlockVariants","cva"],"mappings":";AAEO,MAAMA,IAAoBC;AAAA,EAC/B;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,OAAO;AAAA,QACP,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ;"}
|
|
1
|
+
{"version":3,"file":"infoBlockVariants.js","sources":["../../src/InfoBlock/infoBlockVariants.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\nexport const infoBlockVariants = cva(\r\n [\r\n 'flex items-start gap-2',\r\n 'p-2.5 rounded-lg',\r\n 'font-medium text-base leading-normal text-[#06080D]',\r\n 'whitespace-pre-wrap break-words',\r\n '[&>p]:m-0 [&>p]:p-0',\r\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:size-6\",\r\n 'transition-transform duration-200 [&_svg]:transition-transform [&_svg]:duration-200',\r\n ],\r\n {\r\n variants: {\r\n variant: {\r\n error: 'bg-[#DC26260F] [&>svg]:text-[#DC2626]',\r\n info: 'bg-[#9368FF0F] [&>svg]:text-[#9368FF]',\r\n },\r\n },\r\n defaultVariants: {\r\n variant: 'error',\r\n },\r\n }\r\n)\r\n\r\nexport type InfoBlockVariantsProps = VariantProps<typeof infoBlockVariants>;\r\n"],"names":["infoBlockVariants","cva"],"mappings":";AAEO,MAAMA,IAAoBC;AAAA,EAC/B;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,OAAO;AAAA,QACP,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ;"}
|
package/Input/Input.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgD,MAAM,OAAO,CAAC;AAKrE,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAa3C,eAAO,MAAM,SAAS,qFA+GrB,CAAC;AAGF,eAAO,MAAM,aAAa,qFAiBzB,CAAC;AAkBF,eAAO,MAAM,KAAK,qFAKjB,CAAC"}
|
package/Input/Input.js
CHANGED
|
@@ -1,100 +1,137 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import
|
|
3
|
-
import { Eye as
|
|
4
|
-
import { inputVariants as
|
|
5
|
-
import { cn as
|
|
6
|
-
const
|
|
7
|
-
(
|
|
1
|
+
import { jsxs as b, jsx as t } from "react/jsx-runtime";
|
|
2
|
+
import g, { useRef as H, useImperativeHandle as L, useState as E } from "react";
|
|
3
|
+
import { X as M, Eye as _, EyeOff as A } from "lucide-react";
|
|
4
|
+
import { inputVariants as U } from "./inputVariants.js";
|
|
5
|
+
import { cn as s } from "@oneplatformdev/utils";
|
|
6
|
+
const X = (e) => {
|
|
7
|
+
if (!e) return;
|
|
8
|
+
Object.getOwnPropertyDescriptor(
|
|
9
|
+
HTMLInputElement.prototype,
|
|
10
|
+
"value"
|
|
11
|
+
)?.set?.call(e, ""), e.dispatchEvent(new Event("input", { bubbles: !0 })), e.dispatchEvent(new Event("change", { bubbles: !0 }));
|
|
12
|
+
}, v = g.forwardRef(
|
|
13
|
+
(e, r) => {
|
|
8
14
|
const {
|
|
9
15
|
className: a,
|
|
10
16
|
variant: o,
|
|
11
|
-
type:
|
|
12
|
-
slotProps: { input:
|
|
13
|
-
onChange:
|
|
14
|
-
onTransform:
|
|
15
|
-
counter:
|
|
16
|
-
maxLength:
|
|
17
|
+
type: i,
|
|
18
|
+
slotProps: { input: u, wrapper: y } = {},
|
|
19
|
+
onChange: h,
|
|
20
|
+
onTransform: w,
|
|
21
|
+
counter: S = !1,
|
|
22
|
+
maxLength: c,
|
|
17
23
|
fullSize: N = !1,
|
|
18
|
-
value:
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
24
|
+
value: p,
|
|
25
|
+
defaultValue: d,
|
|
26
|
+
disabled: x,
|
|
27
|
+
readOnly: I,
|
|
28
|
+
clearable: C = !1,
|
|
29
|
+
onClear: j,
|
|
30
|
+
...z
|
|
31
|
+
} = e, {
|
|
32
|
+
startAdornment: f,
|
|
33
|
+
className: B,
|
|
34
|
+
...O
|
|
35
|
+
} = u || {}, l = H(null);
|
|
36
|
+
L(r, () => l.current);
|
|
37
|
+
const m = p !== void 0, [D, V] = E(
|
|
38
|
+
d !== void 0 ? String(d) : ""
|
|
39
|
+
), P = m ? String(p ?? "") : D, T = C && !x && !I && P.length > 0, k = () => {
|
|
40
|
+
X(l.current), m || V(""), l.current?.focus(), j?.();
|
|
41
|
+
};
|
|
42
|
+
return /* @__PURE__ */ b(
|
|
26
43
|
"div",
|
|
27
44
|
{
|
|
28
|
-
...
|
|
29
|
-
className:
|
|
45
|
+
...y || {},
|
|
46
|
+
className: s(
|
|
30
47
|
"relative",
|
|
31
48
|
N && "w-full",
|
|
32
|
-
|
|
49
|
+
y?.className
|
|
33
50
|
),
|
|
34
51
|
children: [
|
|
35
|
-
!!
|
|
36
|
-
/* @__PURE__ */
|
|
52
|
+
!!f && /* @__PURE__ */ t("span", { className: "absolute left-[10px] top-1/2 -translate-y-1/2", children: f }),
|
|
53
|
+
/* @__PURE__ */ t(
|
|
37
54
|
"input",
|
|
38
55
|
{
|
|
39
|
-
type:
|
|
40
|
-
className:
|
|
41
|
-
|
|
42
|
-
!!
|
|
43
|
-
|
|
56
|
+
type: i,
|
|
57
|
+
className: s(
|
|
58
|
+
U({ variant: o, className: a }),
|
|
59
|
+
!!f && "pl-10",
|
|
60
|
+
C && "pr-8",
|
|
61
|
+
B,
|
|
44
62
|
N && "min-w-auto"
|
|
45
63
|
),
|
|
46
|
-
ref:
|
|
47
|
-
maxLength:
|
|
48
|
-
value:
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
64
|
+
ref: l,
|
|
65
|
+
maxLength: c,
|
|
66
|
+
value: p,
|
|
67
|
+
defaultValue: d,
|
|
68
|
+
disabled: x,
|
|
69
|
+
readOnly: I,
|
|
70
|
+
...O,
|
|
71
|
+
...z,
|
|
72
|
+
onChange: (n) => {
|
|
73
|
+
typeof w?.(n.target.value, n) == "string" && (n.target.value = w(n.target.value, n)), m || V(n.target.value), h && h(n);
|
|
53
74
|
}
|
|
54
75
|
}
|
|
55
76
|
),
|
|
56
|
-
|
|
77
|
+
T && /* @__PURE__ */ t(
|
|
78
|
+
"button",
|
|
79
|
+
{
|
|
80
|
+
type: "button",
|
|
81
|
+
tabIndex: -1,
|
|
82
|
+
"aria-label": "Clear input",
|
|
83
|
+
onMouseDown: (n) => n.preventDefault(),
|
|
84
|
+
onClick: k,
|
|
85
|
+
className: s(
|
|
86
|
+
"absolute top-1/2 right-3 -translate-y-1/2",
|
|
87
|
+
"text-muted-foreground hover:text-foreground",
|
|
88
|
+
"inline-flex items-center justify-center"
|
|
89
|
+
),
|
|
90
|
+
children: /* @__PURE__ */ t(M, { size: 16 })
|
|
91
|
+
}
|
|
92
|
+
),
|
|
93
|
+
S && typeof c == "number" && /* @__PURE__ */ b("div", { className: s(
|
|
57
94
|
"w-full text-right inline-flex items-center justify-end",
|
|
58
95
|
"text-xs font-medium leading-[1.2] text-muted-foreground",
|
|
59
96
|
"peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
|
|
60
97
|
), children: [
|
|
61
|
-
|
|
98
|
+
P.length,
|
|
62
99
|
"/",
|
|
63
|
-
|
|
100
|
+
c
|
|
64
101
|
] })
|
|
65
102
|
]
|
|
66
103
|
}
|
|
67
104
|
);
|
|
68
105
|
}
|
|
69
106
|
);
|
|
70
|
-
|
|
71
|
-
const
|
|
72
|
-
(
|
|
73
|
-
const [a, o] =
|
|
107
|
+
v.displayName = "Input";
|
|
108
|
+
const R = g.forwardRef(
|
|
109
|
+
(e, r) => {
|
|
110
|
+
const [a, o] = E(!1), i = a ? "text" : "password", u = () => {
|
|
74
111
|
o(!a);
|
|
75
112
|
};
|
|
76
|
-
return /* @__PURE__ */
|
|
77
|
-
/* @__PURE__ */
|
|
78
|
-
/* @__PURE__ */
|
|
113
|
+
return /* @__PURE__ */ b("div", { ...e?.slotProps?.wrapper || {}, className: s("relative", e?.slotProps?.wrapper?.className), children: [
|
|
114
|
+
/* @__PURE__ */ t(v, { ...e, type: i, className: "pr-8", ref: r }),
|
|
115
|
+
/* @__PURE__ */ t(q, { isVisible: a, onClick: u })
|
|
79
116
|
] });
|
|
80
117
|
}
|
|
81
118
|
);
|
|
82
|
-
|
|
83
|
-
const
|
|
119
|
+
R.displayName = "PasswordInput";
|
|
120
|
+
const q = ({ isVisible: e, onClick: r }) => /* @__PURE__ */ t(
|
|
84
121
|
"button",
|
|
85
122
|
{
|
|
86
123
|
type: "button",
|
|
87
|
-
onClick:
|
|
124
|
+
onClick: r,
|
|
88
125
|
className: "absolute top-1/2 right-3 transform -translate-y-1/2",
|
|
89
|
-
children:
|
|
126
|
+
children: e ? /* @__PURE__ */ t(_, { size: 16 }) : /* @__PURE__ */ t(A, { size: 16 })
|
|
90
127
|
}
|
|
91
|
-
),
|
|
92
|
-
({ type:
|
|
128
|
+
), F = g.forwardRef(
|
|
129
|
+
({ type: e, ...r }, a) => e === "password" ? /* @__PURE__ */ t(R, { type: e, ...r, ref: a }) : /* @__PURE__ */ t(v, { type: e, ...r, ref: a })
|
|
93
130
|
);
|
|
94
|
-
|
|
131
|
+
F.displayName = "Input";
|
|
95
132
|
export {
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
133
|
+
v as BaseInput,
|
|
134
|
+
F as Input,
|
|
135
|
+
R as PasswordInput
|
|
99
136
|
};
|
|
100
137
|
//# sourceMappingURL=Input.js.map
|