@oneplatformdev/ui 0.1.99-beta.20 → 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.js.map +1 -1
- package/Breadcrumb/Breadcrumb.js.map +1 -1
- package/Button/Button.d.ts.map +1 -1
- package/Button/Button.js +40 -41
- package/Button/Button.js.map +1 -1
- package/Button/Button.stories.js.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.js.map +1 -1
- package/Button/buttonVariants.d.ts.map +1 -1
- package/Button/buttonVariants.js +2 -1
- 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 +8 -6
- package/Button/index.js.map +1 -1
- package/ButtonIcon/ButtonIcon.d.ts.map +1 -1
- package/ButtonIcon/ButtonIcon.js +49 -50
- package/ButtonIcon/ButtonIcon.js.map +1 -1
- package/ButtonIcon/ButtonIcon.stories.js +35 -33
- package/ButtonIcon/ButtonIcon.stories.js.map +1 -1
- package/ButtonIcon/buttonIconVariants.d.ts.map +1 -1
- package/ButtonIcon/buttonIconVariants.js +3 -2
- package/ButtonIcon/buttonIconVariants.js.map +1 -1
- package/CHANGELOG.md +2674 -1802
- 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 +65 -51
- package/Input/Input.js.map +1 -1
- package/Input/Input.types.d.ts +1 -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.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.js.map +1 -1
- package/Resizable/Resizable.stories.js.map +1 -1
- 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 +48 -43
- package/Textarea/Textarea.js.map +1 -1
- package/Textarea/Textarea.stories.js +1 -1
- package/Textarea/Textarea.stories.js.map +1 -1
- package/Textarea/Textarea.types.d.ts +3 -1
- package/Textarea/Textarea.types.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 +332 -328
- package/index.js.map +1 -1
- package/package.json +6 -5
|
@@ -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, label, name, onChange, onBlur, onPaste, style, onPastePrepare, ...rest } = 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 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
|
|
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 }) => (\r\n <FormControl>\r\n <Input\r\n {...field}\r\n {...rest}\r\n counter={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","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,EAAA,wBACRC,GAAA,EACC,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAGF;AAAA,UACH,GAAGH;AAAA,UACJ,SAAAN;AAAA,UACA,WAAAD;AAAA,UACA,KAAK,CAACa,MAAO;AACX,YAAAH,EAAM,IAAIG,CAAE,GACR,OAAOnB,KAAQ,aACjBA,EAAImB,CAAE,IACGnB,MACRA,EAA2C,UAAUmB;AAAA,UAE1D;AAAA,UACA,OAAAR;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,CAACO,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,gBAJIZ,MACFc,IAAOd,EAAec,GAAMN,CAAC,IAG3B,OAAOd,KAAc,UAAU;AACjC,cAAAc,EAAE,eAAA,GAEFnB,EAAK,SAASI,GAAMqB,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,IAAYvB,KAAaqB,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,GAEFnB,EAAK,SAASI,GAAM0B,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,IAAIjB,MAAS;AACnB,YAAAG,EAAM,SAAA,GACNP,IAAS,GAAGI,CAAI;AAAA,UAClB;AAAA,QAAA;AAAA,MAAA,EACF,CACF;AAAA,IAAA;AAAA,EAAA;AAIR;AAEO,MAAMmB,IAAYC,EAAWnC,CAAc;"}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { jsx as e, jsxs as a } from "react/jsx-runtime";
|
|
2
|
+
import { useForm as l, FormProvider as s } from "react-hook-form";
|
|
3
|
+
import { FormInput as r } from "./FormInput.js";
|
|
4
|
+
function m({ initialValue: o = "", ...c }) {
|
|
5
|
+
const t = l({
|
|
6
|
+
defaultValues: {
|
|
7
|
+
name: o
|
|
8
|
+
}
|
|
9
|
+
}), n = t.watch("name");
|
|
10
|
+
return /* @__PURE__ */ e(s, { ...t, children: /* @__PURE__ */ a("div", { className: "max-w-sm space-y-3", children: [
|
|
11
|
+
/* @__PURE__ */ e(
|
|
12
|
+
r,
|
|
13
|
+
{
|
|
14
|
+
form: t,
|
|
15
|
+
name: "name",
|
|
16
|
+
counter: !0,
|
|
17
|
+
maxLength: 255,
|
|
18
|
+
tooltip: "Test",
|
|
19
|
+
label: "Label"
|
|
20
|
+
}
|
|
21
|
+
),
|
|
22
|
+
/* @__PURE__ */ a("div", { className: "text-xs text-muted-foreground", children: [
|
|
23
|
+
"value: ",
|
|
24
|
+
/* @__PURE__ */ e("span", { className: "font-mono", children: n })
|
|
25
|
+
] }),
|
|
26
|
+
/* @__PURE__ */ a("div", { className: "text-xs text-muted-foreground", children: [
|
|
27
|
+
"length: ",
|
|
28
|
+
/* @__PURE__ */ e("span", { className: "font-mono", children: n?.length ?? 0 })
|
|
29
|
+
] })
|
|
30
|
+
] }) });
|
|
31
|
+
}
|
|
32
|
+
const i = {
|
|
33
|
+
title: "FormInput",
|
|
34
|
+
component: r,
|
|
35
|
+
parameters: {
|
|
36
|
+
layout: "centered"
|
|
37
|
+
},
|
|
38
|
+
args: {
|
|
39
|
+
label: "Input label",
|
|
40
|
+
placeholder: "Type something...",
|
|
41
|
+
disabled: !1
|
|
42
|
+
},
|
|
43
|
+
argTypes: {
|
|
44
|
+
form: { control: !1 },
|
|
45
|
+
name: { control: !1 },
|
|
46
|
+
onChange: { control: !1 },
|
|
47
|
+
onBlur: { control: !1 },
|
|
48
|
+
onPaste: { control: !1 },
|
|
49
|
+
onPastePrepare: { control: !1 }
|
|
50
|
+
},
|
|
51
|
+
decorators: [
|
|
52
|
+
(o) => /* @__PURE__ */ e("div", { className: "p-6 w-[420px]", children: /* @__PURE__ */ e(o, {}) })
|
|
53
|
+
]
|
|
54
|
+
}, p = {
|
|
55
|
+
render: (o) => /* @__PURE__ */ e(m, { ...o })
|
|
56
|
+
};
|
|
57
|
+
export {
|
|
58
|
+
p as Default,
|
|
59
|
+
i as default
|
|
60
|
+
};
|
|
61
|
+
//# sourceMappingURL=FormInput.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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\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={\"Test\"}\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,SAAS;AAAA,QACT,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;"}
|
|
@@ -2,5 +2,6 @@ import { FieldValues } from 'react-hook-form';
|
|
|
2
2
|
import { FormRenderControlExtendProps } from '../Form';
|
|
3
3
|
import { InputProps } from '../Input';
|
|
4
4
|
export interface FormInputProps<Data extends FieldValues> extends FormRenderControlExtendProps<Data>, Omit<InputProps, 'form' | 'name'> {
|
|
5
|
+
counter?: boolean;
|
|
5
6
|
}
|
|
6
7
|
//# sourceMappingURL=FormInput.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormInput.types.d.ts","sourceRoot":"","sources":["../../src/FormInput/FormInput.types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAEtC,MAAM,WAAW,cAAc,CAAC,IAAI,SAAS,WAAW,CACtD,SAAQ,4BAA4B,CAAC,IAAI,CAAC,EACxC,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"FormInput.types.d.ts","sourceRoot":"","sources":["../../src/FormInput/FormInput.types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAEtC,MAAM,WAAW,cAAc,CAAC,IAAI,SAAS,WAAW,CACtD,SAAQ,4BAA4B,CAAC,IAAI,CAAC,EACxC,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB"}
|
|
@@ -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;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormSelect.d.ts","sourceRoot":"","sources":["../../src/FormSelect/FormSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAG9C,eAAO,MAAM,UAAU,GAAI,IAAI,SAAS,WAAW,EAAE,gBAAgB,EACnE,OAAO,eAAe,CAAC,IAAI,EAAE,gBAAgB,CAAC,
|
|
1
|
+
{"version":3,"file":"FormSelect.d.ts","sourceRoot":"","sources":["../../src/FormSelect/FormSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAG9C,eAAO,MAAM,UAAU,GAAI,IAAI,SAAS,WAAW,EAAE,gBAAgB,EACnE,OAAO,eAAe,CAAC,IAAI,EAAE,gBAAgB,CAAC,4CA8C/C,CAAC"}
|
package/FormSelect/FormSelect.js
CHANGED
|
@@ -1,30 +1,31 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import { FormControl as d } from "../Form/Form.js";
|
|
3
|
-
import { FormRenderControl as f } from "../Form/FormRenderControl.js";
|
|
4
|
-
import "@radix-ui/react-select";
|
|
5
|
-
import "lucide-react";
|
|
6
|
-
import "@oneplatformdev/utils";
|
|
7
2
|
import { Select as u } from "../Select/Select.js";
|
|
8
|
-
|
|
3
|
+
import { FormRenderControl as x } from "../Form/FormRenderControl.js";
|
|
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,
|
|
12
9
|
label: a,
|
|
13
|
-
|
|
10
|
+
tooltip: l,
|
|
11
|
+
tooltipProps: g,
|
|
12
|
+
name: s,
|
|
14
13
|
options: c = [],
|
|
15
|
-
onChange:
|
|
16
|
-
containerProps:
|
|
17
|
-
renderTrigger:
|
|
14
|
+
onChange: h,
|
|
15
|
+
containerProps: C,
|
|
16
|
+
renderTrigger: d,
|
|
18
17
|
onChangePrepare: n,
|
|
19
|
-
...
|
|
18
|
+
...f
|
|
20
19
|
} = m;
|
|
21
20
|
return /* @__PURE__ */ e(
|
|
22
|
-
|
|
21
|
+
x,
|
|
23
22
|
{
|
|
24
23
|
form: p,
|
|
25
|
-
name:
|
|
24
|
+
name: s,
|
|
25
|
+
tooltip: l,
|
|
26
|
+
tooltipProps: g,
|
|
26
27
|
label: a,
|
|
27
|
-
containerProps:
|
|
28
|
+
containerProps: C,
|
|
28
29
|
render: ({ field: t }) => /* @__PURE__ */ e(
|
|
29
30
|
u,
|
|
30
31
|
{
|
|
@@ -32,16 +33,16 @@ const j = (m) => {
|
|
|
32
33
|
options: c,
|
|
33
34
|
onChange: (r) => {
|
|
34
35
|
const o = n ? n(r) : r;
|
|
35
|
-
t.onChange(o),
|
|
36
|
+
t.onChange(o), h?.(r, o);
|
|
36
37
|
},
|
|
37
|
-
renderTrigger: (r, o) => /* @__PURE__ */ e(
|
|
38
|
-
...
|
|
38
|
+
renderTrigger: (r, o) => /* @__PURE__ */ e(F, { children: d?.(r, o) || o }),
|
|
39
|
+
...f
|
|
39
40
|
}
|
|
40
41
|
)
|
|
41
42
|
}
|
|
42
43
|
);
|
|
43
44
|
};
|
|
44
45
|
export {
|
|
45
|
-
|
|
46
|
+
b as FormSelect
|
|
46
47
|
};
|
|
47
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 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 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","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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormTextarea.d.ts","sourceRoot":"","sources":["../../src/FormTextarea/FormTextarea.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAI9C,eAAO,MAAM,YAAY,GAAI,IAAI,SAAS,WAAW,EACnD,OAAO,iBAAiB,CAAC,IAAI,CAAC,
|
|
1
|
+
{"version":3,"file":"FormTextarea.d.ts","sourceRoot":"","sources":["../../src/FormTextarea/FormTextarea.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAI9C,eAAO,MAAM,YAAY,GAAI,IAAI,SAAS,WAAW,EACnD,OAAO,iBAAiB,CAAC,IAAI,CAAC,4CAsB/B,CAAC"}
|
|
@@ -1,28 +1,30 @@
|
|
|
1
1
|
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
-
import { FormControl as p } from "../Form/Form.js";
|
|
3
|
-
import { FormRenderControl as i } from "../Form/FormRenderControl.js";
|
|
4
2
|
import { Textarea as s } from "../Textarea/Textarea.js";
|
|
5
|
-
|
|
6
|
-
|
|
3
|
+
import { FormRenderControl as c } from "../Form/FormRenderControl.js";
|
|
4
|
+
import { FormControl as f } from "../Form/Form.js";
|
|
5
|
+
const v = (t) => {
|
|
6
|
+
const { form: e, label: m, tooltip: n, tooltipProps: a, name: p, containerProps: l, ...i } = t;
|
|
7
7
|
return /* @__PURE__ */ r(
|
|
8
|
-
|
|
8
|
+
c,
|
|
9
9
|
{
|
|
10
|
-
form:
|
|
11
|
-
|
|
10
|
+
form: e,
|
|
11
|
+
tooltip: n,
|
|
12
|
+
tooltipProps: a,
|
|
13
|
+
name: p,
|
|
12
14
|
label: m,
|
|
13
|
-
containerProps:
|
|
14
|
-
render: ({ field: o }) => /* @__PURE__ */ r(
|
|
15
|
+
containerProps: l,
|
|
16
|
+
render: ({ field: o }) => /* @__PURE__ */ r(f, { children: /* @__PURE__ */ r(
|
|
15
17
|
s,
|
|
16
18
|
{
|
|
17
19
|
...o,
|
|
18
20
|
value: o.value || "",
|
|
19
|
-
...
|
|
21
|
+
...i
|
|
20
22
|
}
|
|
21
23
|
) })
|
|
22
24
|
}
|
|
23
25
|
);
|
|
24
26
|
};
|
|
25
27
|
export {
|
|
26
|
-
|
|
28
|
+
v as FormTextarea
|
|
27
29
|
};
|
|
28
30
|
//# sourceMappingURL=FormTextarea.js.map
|
|
@@ -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) => {\nconst { form, label, name, containerProps, ...rest } = props;\n return (\n <FormRenderControl\n form={form}\n name={name}\n label={label}\n containerProps={containerProps}\n render={({ field }) => (\n <FormControl>\n <Textarea\n {...field}\n value={field.value || ''}\n {...rest}\n />\n </FormControl>\n )}\n />\n )\n};\n"],"names":["FormTextarea","props","form","label","name","containerProps","rest","jsx","FormRenderControl","field","FormControl","Textarea"],"mappings":";;;;AAMO,MAAMA,IAAe,CAC1BC,MACG;AACL,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,MAAAC,GAAM,gBAAAC,GAAgB,GAAGC,
|
|
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\nconst { form, label, tooltip, tooltipProps, name, containerProps, ...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 }) => (\r\n <FormControl>\r\n <Textarea\r\n {...field}\r\n value={field.value || ''}\r\n {...rest}\r\n />\r\n </FormControl>\r\n )}\r\n />\r\n )\r\n};\r\n"],"names":["FormTextarea","props","form","label","tooltip","tooltipProps","name","containerProps","rest","jsx","FormRenderControl","field","FormControl","Textarea"],"mappings":";;;;AAMO,MAAMA,IAAe,CAC1BC,MACG;AACL,QAAM,EAAE,MAAAC,GAAM,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,MAAAC,GAAM,gBAAAC,GAAgB,GAAGC,EAAA,IAASP;AAC1E,SACI,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,MAAAR;AAAA,MACA,SAAAE;AAAA,MACA,cAAAC;AAAA,MACA,MAAAC;AAAA,MACA,OAAAH;AAAA,MACA,gBAAAI;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAI,EAAA,wBACRC,GAAA,EACC,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAGF;AAAA,UACJ,OAAOA,EAAM,SAAS;AAAA,UACrB,GAAGH;AAAA,QAAA;AAAA,MAAA,EACN,CACF;AAAA,IAAA;AAAA,EAAA;AAId;"}
|
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;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InfoBlock.d.ts","sourceRoot":"","sources":["../../src/InfoBlock/InfoBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAiBtE,eAAO,MAAM,SAAS;YAAW,cAAc;;CAmB9C,CAAA;AAED,eAAe,SAAS,CAAC"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { jsx as e, jsxs as c, Fragment as m } from "react/jsx-runtime";
|
|
2
|
+
import { cn as f } from "@oneplatformdev/utils";
|
|
3
|
+
import { infoBlockVariants as p } from "./infoBlockVariants.js";
|
|
4
|
+
import { isValidElement as d, createElement as h } from "react";
|
|
5
|
+
import { InfoIcon as u, TriangleAlertIcon as w } from "lucide-react";
|
|
6
|
+
const N = (r) => r ? d(r) ? r : h(r) : null, x = {
|
|
7
|
+
error: /* @__PURE__ */ e(w, { className: "fill-[#DC2626] text-white!" }),
|
|
8
|
+
info: /* @__PURE__ */ e(u, { className: "fill-[#9368FF] text-white!" })
|
|
9
|
+
}, k = (r) => {
|
|
10
|
+
const { className: t, variant: n = "error", content: a, icon: o, children: i, node: l, ...s } = r;
|
|
11
|
+
return /* @__PURE__ */ e(
|
|
12
|
+
"div",
|
|
13
|
+
{
|
|
14
|
+
...s,
|
|
15
|
+
className: f(p({ className: t, variant: n })),
|
|
16
|
+
children: i ?? /* @__PURE__ */ c(m, { children: [
|
|
17
|
+
N(o ?? x[n]),
|
|
18
|
+
l ?? /* @__PURE__ */ e("span", { className: "whitespace-pre-wrap wrap-break-word line-clamp-10", children: a })
|
|
19
|
+
] })
|
|
20
|
+
}
|
|
21
|
+
);
|
|
22
|
+
};
|
|
23
|
+
k.displayName = "InfoBlock";
|
|
24
|
+
export {
|
|
25
|
+
k as InfoBlock,
|
|
26
|
+
k as default
|
|
27
|
+
};
|
|
28
|
+
//# sourceMappingURL=InfoBlock.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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;"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
2
|
+
import { InfoBlock as o } from "./InfoBlock.js";
|
|
3
|
+
import { CircleAlert as n } from "lucide-react";
|
|
4
|
+
const a = {
|
|
5
|
+
title: "UI/InfoBlock",
|
|
6
|
+
component: o,
|
|
7
|
+
argTypes: {
|
|
8
|
+
variant: {
|
|
9
|
+
control: "select",
|
|
10
|
+
options: ["error", "info"],
|
|
11
|
+
description: "Defines the color scheme and default icon"
|
|
12
|
+
},
|
|
13
|
+
content: {
|
|
14
|
+
control: "text",
|
|
15
|
+
description: "Text or content inside the block"
|
|
16
|
+
}
|
|
17
|
+
},
|
|
18
|
+
parameters: {
|
|
19
|
+
layout: "centered"
|
|
20
|
+
}
|
|
21
|
+
}, i = {
|
|
22
|
+
args: {
|
|
23
|
+
variant: "error",
|
|
24
|
+
content: "Увага! Перш ніж архівувати підрозділ “Підрозділ дизайну”, переведіть співробітників до іншого — інакше вони будуть автоматично звільнені."
|
|
25
|
+
}
|
|
26
|
+
}, s = {
|
|
27
|
+
args: {
|
|
28
|
+
variant: "info",
|
|
29
|
+
content: "Зміни вступлять в силу після збереження налаштувань профілю."
|
|
30
|
+
}
|
|
31
|
+
}, l = {
|
|
32
|
+
args: {
|
|
33
|
+
variant: "info",
|
|
34
|
+
icon: /* @__PURE__ */ t(n, { className: "text-blue-500" }),
|
|
35
|
+
content: "Цей блок використовує передану вручну іконку замість стандартної."
|
|
36
|
+
}
|
|
37
|
+
}, f = {
|
|
38
|
+
args: {
|
|
39
|
+
variant: "error",
|
|
40
|
+
content: "Дуже довгий текст: ".repeat(20)
|
|
41
|
+
}
|
|
42
|
+
};
|
|
43
|
+
export {
|
|
44
|
+
l as CustomIcon,
|
|
45
|
+
i as Error,
|
|
46
|
+
s as Info,
|
|
47
|
+
f as LongContent,
|
|
48
|
+
a as default
|
|
49
|
+
};
|
|
50
|
+
//# sourceMappingURL=InfoBlock.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { InfoBlockVariantsProps } from './infoBlockVariants';
|
|
2
|
+
import { ComponentType, HTMLAttributes, PropsWithChildren, ReactElement, ReactNode, SVGProps } from 'react';
|
|
3
|
+
export type InfoBlockIconType = ComponentType<SVGProps<SVGSVGElement>> | ReactElement<SVGProps<SVGSVGElement>>;
|
|
4
|
+
export interface InfoBlockProps extends PropsWithChildren, InfoBlockVariantsProps, Omit<HTMLAttributes<HTMLDivElement>, 'color' | 'content'> {
|
|
5
|
+
content?: ReactNode;
|
|
6
|
+
node?: ReactNode;
|
|
7
|
+
icon?: InfoBlockIconType;
|
|
8
|
+
}
|
|
9
|
+
//# sourceMappingURL=InfoBlock.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InfoBlock.types.d.ts","sourceRoot":"","sources":["../../src/InfoBlock/InfoBlock.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EACL,aAAa,EACb,cAAc,EACd,iBAAiB,EACjB,YAAY,EACZ,SAAS,EACT,QAAQ,EACT,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,iBAAiB,GACzB,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,GACtC,YAAY,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;AAE1C,MAAM,WAAW,cACf,SAAQ,iBAAiB,EACvB,sBAAsB,EACtB,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC3D,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InfoBlock.types.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/InfoBlock/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,mBAAmB,mBAAmB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { VariantProps } from 'class-variance-authority';
|
|
2
|
+
export declare const infoBlockVariants: (props?: ({
|
|
3
|
+
variant?: "error" | "info" | null | undefined;
|
|
4
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
5
|
+
export type InfoBlockVariantsProps = VariantProps<typeof infoBlockVariants>;
|
|
6
|
+
//# sourceMappingURL=infoBlockVariants.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"infoBlockVariants.d.ts","sourceRoot":"","sources":["../../src/InfoBlock/infoBlockVariants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAElE,eAAO,MAAM,iBAAiB;;8EAqB7B,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,CAAC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { cva as t } from "class-variance-authority";
|
|
2
|
+
const a = t(
|
|
3
|
+
[
|
|
4
|
+
"flex items-start gap-2",
|
|
5
|
+
"p-2.5 rounded-lg",
|
|
6
|
+
"font-medium text-base leading-normal text-[#06080D]",
|
|
7
|
+
"whitespace-pre-wrap break-words",
|
|
8
|
+
"[&>p]:m-0 [&>p]:p-0",
|
|
9
|
+
"[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:size-6",
|
|
10
|
+
"transition-transform duration-200 [&_svg]:transition-transform [&_svg]:duration-200"
|
|
11
|
+
],
|
|
12
|
+
{
|
|
13
|
+
variants: {
|
|
14
|
+
variant: {
|
|
15
|
+
error: "bg-[#DC26260F] [&>svg]:text-[#DC2626]",
|
|
16
|
+
info: "bg-[#9368FF0F] [&>svg]:text-[#9368FF]"
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
defaultVariants: {
|
|
20
|
+
variant: "error"
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
);
|
|
24
|
+
export {
|
|
25
|
+
a as infoBlockVariants
|
|
26
|
+
};
|
|
27
|
+
//# sourceMappingURL=infoBlockVariants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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,KAAmB,MAAM,OAAO,CAAC;AAKxC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,eAAO,MAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAKxC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,eAAO,MAAM,SAAS,qFAiErB,CAAC;AAGF,eAAO,MAAM,aAAa,qFAiBzB,CAAC;AAkBF,eAAO,MAAM,KAAK,qFAKjB,CAAC"}
|