npm - @intlayer/design-system - Versions diffs - 5.1.4 → 5.1.5 - Mend

@intlayer/design-system 5.1.4 → 5.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (160) hide show

package/dist/.vite/manifest.json CHANGED Viewed

@@ -47,6 +47,10 @@
       "src/components/Form/FormMessage.tsx"
     ]
   },
+  "_index-B1w5h_6-.js": {
+    "file": "index-B1w5h_6-.js",
+    "name": "index"
+  },
   "_index-BCuMWKyy.js": {
     "file": "index-BCuMWKyy.js",
     "name": "index",
@@ -55,10 +59,6 @@
       "src/hooks/useScrollBlockage/useScrollBlockageStore.ts"
     ]
   },
-  "_index-BTDHuTxL.js": {
-    "file": "index-BTDHuTxL.js",
-    "name": "index"
-  },
   "_index-BUe-qmA0.js": {
     "file": "index-BUe-qmA0.js",
     "name": "index",
@@ -75,8 +75,8 @@
       "src/hooks/useScrollBlockage/useScrollBlockageStore.ts"
     ]
   },
-  "_index-Db5Dym4h.cjs": {
-    "file": "index-Db5Dym4h.cjs",
+  "_index-U1U6ySIn.cjs": {
+    "file": "index-U1U6ySIn.cjs",
     "name": "index"
   },
   "_index-cg9H6eBs.cjs": {
@@ -222,7 +222,7 @@
     "src": "src/components/Auth/ExternalsLoginButtons/ExternalsLoginButtons.tsx",
     "isEntry": true,
     "imports": [
-      "_index-Db5Dym4h.cjs",
+      "_index-U1U6ySIn.cjs",
       "src/components/Button/Button.tsx",
       "src/components/Auth/ExternalsLoginButtons/assets/GithubLogo.tsx",
       "src/components/Auth/ExternalsLoginButtons/assets/GoogleLogo.tsx",
@@ -655,8 +655,8 @@
     "src": "src/components/DictionaryEditor/DictionaryEditor.tsx",
     "isEntry": true,
     "imports": [
-      "_index-cg9H6eBs.cjs",
-      "src/components/DictionaryEditor/ValidDictionaryChangeButtons.tsx"
+      "src/components/DictionaryFieldEditor/SaveForm/SaveForm.tsx",
+      "_index-cg9H6eBs.cjs"
     ]
   },
   "src/components/DictionaryEditor/ItemLayout.tsx": {
@@ -748,22 +748,6 @@
       "src/components/DictionaryEditor/NodeWrapper/StringWrapper.tsx"
     ]
   },
-  "src/components/DictionaryEditor/ValidDictionaryChangeButtons.tsx": {
-    "file": "components/DictionaryEditor/ValidDictionaryChangeButtons.cjs",
-    "name": "components/DictionaryEditor/ValidDictionaryChangeButtons",
-    "src": "src/components/DictionaryEditor/ValidDictionaryChangeButtons.tsx",
-    "isEntry": true,
-    "imports": [
-      "src/hooks/useScrollBlockage/useScrollBlockageStore.ts",
-      "src/hooks/useAsync/useAsyncStateStore.tsx",
-      "src/hooks/intlayerAPIHooks.ts",
-      "src/components/Form/FormBase.tsx",
-      "src/components/Form/FormField.tsx",
-      "_Form-yi0CMK-a.cjs",
-      "src/components/DictionaryEditor/validDictionaryChangeButtons.content.tsx",
-      "src/components/DictionaryEditor/validDictionaryChangeButtonsSchema.ts"
-    ]
-  },
   "src/components/DictionaryEditor/index.tsx": {
     "file": "components/DictionaryEditor/index.cjs",
     "name": "components/DictionaryEditor/index",
@@ -773,18 +757,6 @@
       "src/components/DictionaryEditor/DictionaryEditor.tsx"
     ]
   },
-  "src/components/DictionaryEditor/validDictionaryChangeButtons.content.tsx": {
-    "file": "components/DictionaryEditor/validDictionaryChangeButtons.content.cjs",
-    "name": "components/DictionaryEditor/validDictionaryChangeButtons.content",
-    "src": "src/components/DictionaryEditor/validDictionaryChangeButtons.content.tsx",
-    "isEntry": true
-  },
-  "src/components/DictionaryEditor/validDictionaryChangeButtonsSchema.ts": {
-    "file": "components/DictionaryEditor/validDictionaryChangeButtonsSchema.cjs",
-    "name": "components/DictionaryEditor/validDictionaryChangeButtonsSchema",
-    "src": "src/components/DictionaryEditor/validDictionaryChangeButtonsSchema.ts",
-    "isEntry": true
-  },
   "src/components/DictionaryFieldEditor/ContentEditor.tsx": {
     "file": "components/DictionaryFieldEditor/ContentEditor.cjs",
     "name": "components/DictionaryFieldEditor/ContentEditor",
@@ -826,27 +798,6 @@
       "src/components/DictionaryFieldEditor/NavigationView/navigationViewNode.content.ts"
     ]
   },
-  "src/components/DictionaryFieldEditor/DictionariesSelector/DictionariesSelector.tsx": {
-    "file": "components/DictionaryFieldEditor/DictionariesSelector/DictionariesSelector.cjs",
-    "name": "components/DictionaryFieldEditor/DictionariesSelector/DictionariesSelector",
-    "src": "src/components/DictionaryFieldEditor/DictionariesSelector/DictionariesSelector.tsx",
-    "isEntry": true,
-    "imports": [
-      "src/hooks/useScrollBlockage/useScrollBlockageStore.ts",
-      "src/hooks/useAsync/useAsyncStateStore.tsx",
-      "src/components/Toaster/Toast.tsx",
-      "src/hooks/useGetAllDictionaries.tsx",
-      "src/components/Loader/index.tsx",
-      "src/components/DictionaryFieldEditor/DictionaryFieldEditor.tsx",
-      "src/components/DictionaryFieldEditor/DictionariesSelector/dictionariesSelector.content.ts"
-    ]
-  },
-  "src/components/DictionaryFieldEditor/DictionariesSelector/dictionariesSelector.content.ts": {
-    "file": "components/DictionaryFieldEditor/DictionariesSelector/dictionariesSelector.content.cjs",
-    "name": "components/DictionaryFieldEditor/DictionariesSelector/dictionariesSelector.content",
-    "src": "src/components/DictionaryFieldEditor/DictionariesSelector/dictionariesSelector.content.ts",
-    "isEntry": true
-  },
   "src/components/DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm.tsx": {
     "file": "components/DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm.cjs",
     "name": "components/DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm",
@@ -854,7 +805,7 @@
     "isEntry": true,
     "imports": [
       "src/hooks/intlayerAPIHooks.ts",
-      "_index-Db5Dym4h.cjs",
+      "_index-U1U6ySIn.cjs",
       "src/components/Button/Button.tsx",
       "src/components/Auth/ExternalsLoginButtons/externalsLoginButtons.content.ts",
       "src/components/Form/FormBase.tsx",
@@ -909,7 +860,7 @@
       "src/hooks/useScrollBlockage/useScrollBlockageStore.ts",
       "src/hooks/useAsync/useAsyncStateStore.tsx",
       "src/hooks/intlayerAPIHooks.ts",
-      "_index-Db5Dym4h.cjs",
+      "_index-U1U6ySIn.cjs",
       "src/components/Button/Button.tsx",
       "src/components/Auth/ExternalsLoginButtons/externalsLoginButtons.content.ts",
       "src/components/Form/FormBase.tsx",
@@ -962,10 +913,10 @@
     "isEntry": true,
     "imports": [
       "src/components/Button/Button.tsx",
-      "src/components/Container/index.tsx",
       "src/hooks/useScrollBlockage/useScrollBlockageStore.ts",
       "src/hooks/useAsync/useAsyncStateStore.tsx",
       "src/components/Toaster/Toast.tsx",
+      "src/components/Container/index.tsx",
       "src/components/DropDown/index.tsx",
       "src/components/Input/Input.tsx",
       "src/components/Input/Checkbox.tsx",
@@ -1050,33 +1001,12 @@
       "src/hooks/useScrollBlockage/useScrollBlockageStore.ts",
       "src/hooks/useAsync/useAsyncStateStore.tsx",
       "src/hooks/intlayerAPIHooks.ts",
-      "_index-Db5Dym4h.cjs",
-      "src/components/Button/Button.tsx",
-      "src/components/Auth/ExternalsLoginButtons/externalsLoginButtons.content.ts",
-      "src/components/Form/FormBase.tsx",
+      "src/utils/cn.ts",
       "src/components/Form/FormField.tsx",
       "_Form-yi0CMK-a.cjs",
-      "src/components/Auth/SignInForm/signIn.content.ts",
-      "src/components/Auth/SignInForm/useSignInSchema.content.ts",
-      "src/components/Auth/SignUpForm/signUpForm.content.ts",
-      "src/components/Auth/SignUpForm/useSignUpSchema.content.ts",
-      "src/components/Auth/useAuth/index.tsx",
-      "src/components/Auth/ChangePasswordForm/changePasswordForm.content.ts",
-      "src/components/Auth/ChangePasswordForm/useChangePasswordSchema.content.ts",
-      "src/components/Auth/ResetPasswordForm/resetPasswordContent.content.ts",
-      "src/components/Auth/ResetPasswordForm/useResetPasswordSchema.content.ts",
-      "src/components/Modal/Modal.tsx",
-      "src/components/Auth/VerifyEmailForm/index.content.ts",
-      "src/components/DictionaryFieldEditor/SaveForm/saveForm.content.tsx",
-      "src/components/DictionaryFieldEditor/SaveForm/SaveFormSchema.ts"
+      "src/components/DictionaryFieldEditor/SaveForm/saveForm.content.tsx"
     ]
   },
-  "src/components/DictionaryFieldEditor/SaveForm/SaveFormSchema.ts": {
-    "file": "components/DictionaryFieldEditor/SaveForm/SaveFormSchema.cjs",
-    "name": "components/DictionaryFieldEditor/SaveForm/SaveFormSchema",
-    "src": "src/components/DictionaryFieldEditor/SaveForm/SaveFormSchema.ts",
-    "isEntry": true
-  },
   "src/components/DictionaryFieldEditor/SaveForm/saveForm.content.tsx": {
     "file": "components/DictionaryFieldEditor/SaveForm/saveForm.content.cjs",
     "name": "components/DictionaryFieldEditor/SaveForm/saveForm.content",
@@ -1173,7 +1103,6 @@
     "src": "src/components/DictionaryFieldEditor/index.ts",
     "isEntry": true,
     "imports": [
-      "src/components/DictionaryFieldEditor/DictionariesSelector/DictionariesSelector.tsx",
       "src/components/DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm.tsx",
       "src/components/DictionaryFieldEditor/DictionaryFieldEditor.tsx",
       "src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.tsx",
@@ -1757,6 +1686,16 @@
       "src/components/Input/Checkbox.tsx"
     ]
   },
+  "src/components/KeyboardScreenAdapter/index.tsx": {
+    "file": "components/KeyboardScreenAdapter/index.cjs",
+    "name": "components/KeyboardScreenAdapter/index",
+    "src": "src/components/KeyboardScreenAdapter/index.tsx",
+    "isEntry": true,
+    "imports": [
+      "src/hooks/useKeyboardDetector.ts",
+      "src/utils/cn.ts"
+    ]
+  },
   "src/components/Label/index.tsx": {
     "file": "components/Label/index.cjs",
     "name": "components/Label/index",
@@ -2379,7 +2318,6 @@
       "src/components/PressableSpan/PressableSpan.tsx",
       "src/components/ContentSelector/ContentSelector.tsx",
       "src/components/DictionaryEditor/DictionaryEditor.tsx",
-      "src/components/DictionaryFieldEditor/DictionariesSelector/DictionariesSelector.tsx",
       "src/components/DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm.tsx",
       "src/components/DictionaryFieldEditor/DictionaryFieldEditor.tsx",
       "src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.tsx",
@@ -2450,7 +2388,8 @@
       "src/components/LocaleSwitcherDropDown/LocaleSwitcher.tsx",
       "src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.tsx",
       "src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.tsx",
-      "src/components/ClickOutsideDiv/index.tsx"
+      "src/components/ClickOutsideDiv/index.tsx",
+      "src/components/KeyboardScreenAdapter/index.tsx"
     ]
   },
   "src/hooks/index.ts": {
@@ -2470,7 +2409,8 @@
       "src/hooks/useItemSelector.ts",
       "src/hooks/useGetAllDictionaries.tsx",
       "src/hooks/usePersistedStore.ts",
-      "src/hooks/useIsDarkMode.ts"
+      "src/hooks/useIsDarkMode.ts",
+      "src/hooks/useKeyboardDetector.ts"
     ]
   },
   "src/hooks/intlayerAPIHooks.ts": {
@@ -2568,6 +2508,12 @@
     "src": "src/hooks/useItemSelector.ts",
     "isEntry": true
   },
+  "src/hooks/useKeyboardDetector.ts": {
+    "file": "hooks/useKeyboardDetector.cjs",
+    "name": "hooks/useKeyboardDetector",
+    "src": "src/hooks/useKeyboardDetector.ts",
+    "isEntry": true
+  },
   "src/hooks/usePersistedStore.ts": {
     "file": "hooks/usePersistedStore.cjs",
     "name": "hooks/usePersistedStore",

package/dist/Form-BZUDRfoN.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Form-BZUDRfoN.js","sources":["../src/components/Form/layout/FormItemLayout.tsx","../src/components/Form/elements/FormElement.tsx","../src/components/Form/elements/InputElement.tsx","../src/components/Form/elements/InputPasswordElement.tsx","../src/components/Form/elements/TextAreaElement.tsx","../src/components/Form/elements/EditableFieldInputElement.tsx","../src/components/Form/elements/EditableFieldTextAreaElement.tsx","../src/components/Form/elements/AutoSizeTextAreaElement.tsx","../src/components/Form/elements/CheckboxElement.tsx","../src/components/Form/elements/MultiselectElement.tsx","../src/components/Form/elements/SelectElement.tsx","../src/components/Form/elements/SwitchSelectorElement.tsx","../src/components/Form/Form.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react';\nimport { Form } from '../Form';\nimport { FormLabelLayout, type FormLabelLayoutProps } from './FormLabelLayout';\n\nexport type FormItemLayoutProps = Omit<FormLabelLayoutProps, 'children'> & {\n label?: ReactNode;\n description?: ReactNode;\n children: ReactNode;\n showErrorMessage?: boolean;\n};\n\nexport const FormItemLayout: FC<FormItemLayoutProps> = ({\n label,\n description,\n isRequired,\n info,\n children,\n showErrorMessage = true,\n htmlFor,\n}) => (\n <Form.Item className=\"w-full space-y-2\">\n {(description \|\| label) && (\n <div className=\"space-y-1 leading-none\">\n {label && (\n <FormLabelLayout\n isRequired={isRequired}\n info={info}\n htmlFor={htmlFor}\n >\n {label}\n </FormLabelLayout>\n )}\n {description && <Form.Description>{description}</Form.Description>}\n </div>\n )}\n <Form.Control>{children}</Form.Control>\n\n {showErrorMessage && <Form.Message data-testid=\"error-message\" />}\n </Form.Item>\n);\n","'use client';\n\nimport type { ComponentProps, ElementType, ReactNode } from 'react';\nimport {\n useFormContext,\n type ControllerRenderProps,\n type FieldValues,\n} from 'react-hook-form';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { type FormItemLayoutProps, FormItemLayout } from '../layout';\n\nexport type FormElementProps<T extends ElementType> = {\n name: string;\n Element: T;\n label?: ReactNode;\n isRequired?: boolean;\n info?: string;\n showErrorMessage?: boolean;\n focus?: boolean;\n} & Omit<FormItemLayoutProps, 'children'>;\n\ntype FormFieldElementProps<T extends ElementType> = FormElementProps<T> &\n ComponentProps<T> & {\n field: ControllerRenderProps<FieldValues, string>;\n };\n\nconst FormFieldElement = <T extends ElementType>({\n field,\n name,\n label,\n Element,\n isRequired = false,\n info,\n description,\n showErrorMessage = true,\n ...props\n}: FormFieldElementProps<T>) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <Element data-testid=\"element\" id={name} {...field} {...props}>\n {props.children}\n </Element>\n </FormItemLayout>\n );\n};\n\n/*\n FormElement is a component that allows you to create a form element with a label, description, error message, and validation.\n \n The Element prop is the type of the element that will be rendered.\n * This element will interact with the FormContext and will be controlled by the FormControl component.\n * The props used to control the element will be `value` and `onChange`.\n /\nexport const FormElement = <T extends ElementType>(\n props: FormElementProps<T> & ComponentProps<T>\n) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={props.name}\n render={({ field }) => <FormFieldElement {...props} field={field} />}\n />\n );\n};\n","import type { ComponentProps, FC } from 'react';\nimport { Input } from '../../../components/Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype InputElementProps = Omit<FormElementProps<typeof Input>, 'Element'> &\n ComponentProps<typeof Input> & {\n name: string;\n };\n\nexport const InputElement: FC<InputElementProps> = (props) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={Input}\n {...props}\n />\n);\n","import type { ComponentProps, FC } from 'react';\nimport { InputPassword } from '../../Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype InputPasswordElementProps = Omit<\n FormElementProps<typeof InputPassword>,\n 'Element'\n> &\n ComponentProps<typeof InputPassword> & {\n name: string;\n autoComplete: 'current-password' \| 'new-password';\n };\n\nexport const InputPasswordElement: FC<InputPasswordElementProps> = ({\n autoComplete,\n ...props\n}) => (\n <FormElement\n Element={InputPassword}\n id={props.name}\n data-testid={props.name}\n autoComplete={autoComplete}\n minLength={6}\n maxLength={255}\n {...props}\n />\n);\n","import type { FC } from 'react';\nimport { TextArea } from '../../TextArea/TextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype TextAreaElementsProps = Omit<\n FormElementProps<typeof TextArea>,\n 'Element'\n> &\n React.ComponentProps<typeof TextArea> & {\n name: string;\n };\n\nexport const TextAreaElement: FC<TextAreaElementsProps> = (props) => (\n <FormElement\n Element={TextArea}\n id={props.name}\n data-testid={props.name}\n {...props}\n />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { EditableFieldInput } from '../../EditableField/EditableFieldInput';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype EditableFieldInputElementProps = Omit<\n FormElementProps<typeof EditableFieldInput>,\n 'Element'\n> &\n Omit<ComponentProps<typeof EditableFieldInput>, 'onChange'> & {\n name: string;\n description?: ReactNode;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const EditableFieldInputElement = (\n props: EditableFieldInputElementProps\n) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={EditableFieldInput}\n {...props}\n />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { EditableFieldTextArea } from '../../EditableField/EditableFieldTextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype EditableFieldTextAreaElementProps = Omit<\n FormElementProps<typeof EditableFieldTextArea>,\n 'Element'\n> &\n Omit<ComponentProps<typeof EditableFieldTextArea>, 'onChange'> & {\n name: string;\n description?: ReactNode;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const EditableFieldTextAreaElement = (\n props: EditableFieldTextAreaElementProps\n) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={EditableFieldTextArea}\n {...props}\n />\n);\n","import type { FC } from 'react';\nimport { AutoSizedTextArea } from '../../TextArea/AutoSizeTextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype AutoSizedTextAreaElementsProps = Omit<\n FormElementProps<typeof AutoSizedTextArea>,\n 'Element'\n> &\n React.ComponentProps<typeof AutoSizedTextArea> & {\n name: string;\n };\n\nexport const AutoSizedTextAreaElement: FC<AutoSizedTextAreaElementsProps> = (\n props\n) => (\n <FormElement\n Element={AutoSizedTextArea}\n id={props.name}\n data-testid={props.name}\n {...props}\n />\n);\n","import { type ComponentProps, type FC } from 'react';\nimport { Checkbox } from '../../Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype CheckboxElementProps = Omit<FormElementProps<typeof Checkbox>, 'Element'> &\n ComponentProps<typeof Checkbox> & {\n name: string;\n inputLabel?: string;\n };\n\ntype CheckboxComponentProps = Omit<ComponentProps<typeof Checkbox>, 'label'> & {\n name: string;\n inputLabel?: ComponentProps<typeof Checkbox>['label'];\n};\n\nconst CheckboxComponent: FC<CheckboxComponentProps> = ({\n inputLabel,\n ...props\n}) => <Checkbox {...props} label={inputLabel} />;\n\nexport const CheckboxElement: FC<CheckboxElementProps> = ({\n autoComplete,\n ...props\n}) => (\n <FormElement\n Element={CheckboxComponent}\n id={props.name}\n data-testid={props.name}\n autoComplete={autoComplete}\n minLength={6}\n maxLength={255}\n {...props}\n />\n);\n","/ eslint-disable react-hooks/rules-of-hooks /\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { MultiSelect } from '../../Select/Multiselect';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SelectElementsProps = Omit<\n FormElementProps<typeof MultiSelect>,\n 'Element'\n> &\n ComponentProps<typeof MultiSelect> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const MultiSelectElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SelectElementsProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <MultiSelect\n onValueChange={field.onChange}\n values={field.value}\n {...props}\n >\n {children}\n </MultiSelect>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","/ eslint-disable react-hooks/rules-of-hooks /\n\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { Select } from '../../Select/Select';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SelectElementsProps = Omit<FormElementProps<typeof Select>, 'Element'> &\n ComponentProps<typeof Select> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const SelectElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SelectElementsProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <Select\n onValueChange={field.onChange}\n defaultValue={field.value}\n {...props}\n >\n {children}\n </Select>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","/ eslint-disable react-hooks/rules-of-hooks /\n\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { SwitchSelector } from '../../SwitchSelector';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SwitchSelectorElementProps = Omit<\n FormElementProps<typeof SwitchSelector>,\n 'Element'\n> &\n ComponentProps<typeof SwitchSelector> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const SwitchSelectorElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SwitchSelectorElementProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <SwitchSelector {...field} {...props}>\n {children}\n </SwitchSelector>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","import { Button } from '../Button';\nimport {\n FormElement,\n InputElement,\n InputPasswordElement,\n TextAreaElement,\n} from './elements';\nimport { AutoSizedTextAreaElement } from './elements/AutoSizeTextAreaElement';\nimport { CheckboxElement } from './elements/CheckboxElement';\nimport { EditableFieldInputElement } from './elements/EditableFieldInputElement';\nimport { EditableFieldTextAreaElement } from './elements/EditableFieldTextAreaElement';\nimport { MultiSelectElement } from './elements/MultiselectElement';\nimport { SelectElement } from './elements/SelectElement';\nimport { SwitchSelectorElement } from './elements/SwitchSelectorElement';\nimport { Form as FormRoot } from './FormBase';\nimport { FormControl } from './FormControl';\nimport { FormDescription } from './FormDescription';\nimport { FormField } from './FormField';\nimport { FormItem } from './FormItem';\nimport { FormMessage } from './FormMessage';\nimport { FormLabelLayout } from './layout';\n\ntype FormType = typeof FormRoot & {\n Description: typeof FormDescription;\n Control: typeof FormControl;\n Field: typeof FormField;\n Item: typeof FormItem;\n Label: typeof FormLabelLayout;\n Message: typeof FormMessage;\n Element: typeof FormElement;\n Button: typeof Button;\n Input: typeof InputElement;\n InputPassword: typeof InputPasswordElement;\n Checkbox: typeof CheckboxElement;\n TextArea: typeof TextAreaElement;\n AutoSizedTextArea: typeof AutoSizedTextAreaElement;\n MultiSelect: typeof MultiSelectElement;\n Select: typeof SelectElement;\n EditableFieldInput: typeof EditableFieldInputElement;\n EditableFieldTextArea: typeof EditableFieldTextAreaElement;\n SwitchSelector: typeof SwitchSelectorElement;\n};\n\n/\n Form components\n \n Example of usage:\n * ```jsx\n * <Form\n * schema={ZodSchema}\n * onSubmitSuccess={onSubmitSuccess}\n * onSubmitError={onSubmitError}\n * autoComplete\n * >\n * <Form.Input name=\"name\" label=\"Name\" />\n * <Form.Button type=\"submit\" label=\"Click to submit\">\n * Submit\n * </Form.Button>\n * </Form>\n * ```\n */\nexport const Form = FormRoot as FormType;\nForm.Description = FormDescription;\nForm.Control = FormControl;\nForm.Field = FormField;\nForm.Item = FormItem;\nForm.Label = FormLabelLayout;\nForm.Message = FormMessage;\nForm.Element = FormElement;\nForm.Input = InputElement;\nForm.InputPassword = InputPasswordElement;\nForm.Checkbox = CheckboxElement;\nForm.TextArea = TextAreaElement;\nForm.AutoSizedTextArea = AutoSizedTextAreaElement;\nForm.Button = Button;\nForm.Select = SelectElement;\nForm.MultiSelect = MultiSelectElement;\nForm.EditableFieldInput = EditableFieldInputElement;\nForm.EditableFieldTextArea = EditableFieldTextAreaElement;\nForm.SwitchSelector = SwitchSelectorElement;\n"],"names":["FormRoot"],"mappings":"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"}
1	+ {"version":3,"file":"Form-BZUDRfoN.js","sources":["../src/components/Form/layout/FormItemLayout.tsx","../src/components/Form/elements/FormElement.tsx","../src/components/Form/elements/InputElement.tsx","../src/components/Form/elements/InputPasswordElement.tsx","../src/components/Form/elements/TextAreaElement.tsx","../src/components/Form/elements/EditableFieldInputElement.tsx","../src/components/Form/elements/EditableFieldTextAreaElement.tsx","../src/components/Form/elements/AutoSizeTextAreaElement.tsx","../src/components/Form/elements/CheckboxElement.tsx","../src/components/Form/elements/MultiselectElement.tsx","../src/components/Form/elements/SelectElement.tsx","../src/components/Form/elements/SwitchSelectorElement.tsx","../src/components/Form/Form.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react';\nimport { Form } from '../Form';\nimport { FormLabelLayout, type FormLabelLayoutProps } from './FormLabelLayout';\n\nexport type FormItemLayoutProps = Omit<FormLabelLayoutProps, 'children'> & {\n label?: ReactNode;\n description?: ReactNode;\n children: ReactNode;\n showErrorMessage?: boolean;\n};\n\nexport const FormItemLayout: FC<FormItemLayoutProps> = ({\n label,\n description,\n isRequired,\n info,\n children,\n showErrorMessage = true,\n htmlFor,\n}) => (\n <Form.Item className=\"w-full space-y-2\">\n {(description \|\| label) && (\n <div className=\"space-y-1 leading-none\">\n {label && (\n <FormLabelLayout\n isRequired={isRequired}\n info={info}\n htmlFor={htmlFor}\n >\n {label}\n </FormLabelLayout>\n )}\n {description && <Form.Description>{description}</Form.Description>}\n </div>\n )}\n <Form.Control>{children}</Form.Control>\n\n {showErrorMessage && <Form.Message data-testid=\"error-message\" />}\n </Form.Item>\n);\n","'use client';\n\nimport type { ComponentProps, ElementType, ReactNode } from 'react';\nimport {\n useFormContext,\n type ControllerRenderProps,\n type FieldValues,\n} from 'react-hook-form';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { type FormItemLayoutProps, FormItemLayout } from '../layout';\n\nexport type FormElementProps<T extends ElementType> = {\n name: string;\n Element: T;\n label?: ReactNode;\n isRequired?: boolean;\n info?: string;\n showErrorMessage?: boolean;\n focus?: boolean;\n} & Omit<FormItemLayoutProps, 'children'>;\n\ntype FormFieldElementProps<T extends ElementType> = FormElementProps<T> &\n ComponentProps<T> & {\n field: ControllerRenderProps<FieldValues, string>;\n };\n\nconst FormFieldElement = <T extends ElementType>({\n field,\n name,\n label,\n Element,\n isRequired = false,\n info,\n description,\n showErrorMessage = true,\n ...props\n}: FormFieldElementProps<T>) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <Element data-testid=\"element\" id={name} {...field} {...props}>\n {props.children}\n </Element>\n </FormItemLayout>\n );\n};\n\n/*\n FormElement is a component that allows you to create a form element with a label, description, error message, and validation.\n \n The Element prop is the type of the element that will be rendered.\n * This element will interact with the FormContext and will be controlled by the FormControl component.\n * The props used to control the element will be `value` and `onChange`.\n /\nexport const FormElement = <T extends ElementType>(\n props: FormElementProps<T> & ComponentProps<T>\n) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={props.name}\n render={({ field }) => <FormFieldElement {...props} field={field} />}\n />\n );\n};\n","import type { ComponentProps, FC } from 'react';\nimport { Input } from '../../../components/Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype InputElementProps = Omit<FormElementProps<typeof Input>, 'Element'> &\n ComponentProps<typeof Input> & {\n name: string;\n };\n\nexport const InputElement: FC<InputElementProps> = (props) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={Input}\n {...props}\n />\n);\n","import type { ComponentProps, FC } from 'react';\nimport { InputPassword } from '../../Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype InputPasswordElementProps = Omit<\n FormElementProps<typeof InputPassword>,\n 'Element'\n> &\n ComponentProps<typeof InputPassword> & {\n name: string;\n autoComplete: 'current-password' \| 'new-password';\n };\n\nexport const InputPasswordElement: FC<InputPasswordElementProps> = ({\n autoComplete,\n ...props\n}) => (\n <FormElement\n Element={InputPassword}\n id={props.name}\n data-testid={props.name}\n autoComplete={autoComplete}\n minLength={6}\n maxLength={255}\n {...props}\n />\n);\n","import type { FC } from 'react';\nimport { TextArea } from '../../TextArea/TextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype TextAreaElementsProps = Omit<\n FormElementProps<typeof TextArea>,\n 'Element'\n> &\n React.ComponentProps<typeof TextArea> & {\n name: string;\n };\n\nexport const TextAreaElement: FC<TextAreaElementsProps> = (props) => (\n <FormElement\n Element={TextArea}\n id={props.name}\n data-testid={props.name}\n {...props}\n />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { EditableFieldInput } from '../../EditableField/EditableFieldInput';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype EditableFieldInputElementProps = Omit<\n FormElementProps<typeof EditableFieldInput>,\n 'Element'\n> &\n ComponentProps<typeof EditableFieldInput> & {\n name: string;\n description?: ReactNode;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const EditableFieldInputElement = (\n props: EditableFieldInputElementProps\n) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={EditableFieldInput}\n {...props}\n />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { EditableFieldTextArea } from '../../EditableField/EditableFieldTextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype EditableFieldTextAreaElementProps = Omit<\n FormElementProps<typeof EditableFieldTextArea>,\n 'Element'\n> &\n ComponentProps<typeof EditableFieldTextArea> & {\n name: string;\n description?: ReactNode;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const EditableFieldTextAreaElement = (\n props: EditableFieldTextAreaElementProps\n) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={EditableFieldTextArea}\n {...props}\n />\n);\n","import type { FC } from 'react';\nimport { AutoSizedTextArea } from '../../TextArea/AutoSizeTextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype AutoSizedTextAreaElementsProps = Omit<\n FormElementProps<typeof AutoSizedTextArea>,\n 'Element'\n> &\n React.ComponentProps<typeof AutoSizedTextArea> & {\n name: string;\n };\n\nexport const AutoSizedTextAreaElement: FC<AutoSizedTextAreaElementsProps> = (\n props\n) => (\n <FormElement\n Element={AutoSizedTextArea}\n id={props.name}\n data-testid={props.name}\n {...props}\n />\n);\n","import { type ComponentProps, type FC } from 'react';\nimport { Checkbox } from '../../Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype CheckboxElementProps = Omit<FormElementProps<typeof Checkbox>, 'Element'> &\n ComponentProps<typeof Checkbox> & {\n name: string;\n inputLabel?: string;\n };\n\ntype CheckboxComponentProps = Omit<ComponentProps<typeof Checkbox>, 'label'> & {\n name: string;\n inputLabel?: ComponentProps<typeof Checkbox>['label'];\n};\n\nconst CheckboxComponent: FC<CheckboxComponentProps> = ({\n inputLabel,\n ...props\n}) => <Checkbox {...props} label={inputLabel} />;\n\nexport const CheckboxElement: FC<CheckboxElementProps> = ({\n autoComplete,\n ...props\n}) => (\n <FormElement\n Element={CheckboxComponent}\n id={props.name}\n data-testid={props.name}\n autoComplete={autoComplete}\n minLength={6}\n maxLength={255}\n {...props}\n />\n);\n","/ eslint-disable react-hooks/rules-of-hooks /\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { MultiSelect } from '../../Select/Multiselect';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SelectElementsProps = Omit<\n FormElementProps<typeof MultiSelect>,\n 'Element'\n> &\n ComponentProps<typeof MultiSelect> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const MultiSelectElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SelectElementsProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <MultiSelect\n onValueChange={field.onChange}\n values={field.value}\n {...props}\n >\n {children}\n </MultiSelect>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","/ eslint-disable react-hooks/rules-of-hooks /\n\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { Select } from '../../Select/Select';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SelectElementsProps = Omit<FormElementProps<typeof Select>, 'Element'> &\n ComponentProps<typeof Select> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const SelectElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SelectElementsProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <Select\n onValueChange={field.onChange}\n defaultValue={field.value}\n {...props}\n >\n {children}\n </Select>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","/ eslint-disable react-hooks/rules-of-hooks /\n\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { SwitchSelector } from '../../SwitchSelector';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SwitchSelectorElementProps = Omit<\n FormElementProps<typeof SwitchSelector>,\n 'Element'\n> &\n ComponentProps<typeof SwitchSelector> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const SwitchSelectorElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SwitchSelectorElementProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <SwitchSelector {...field} {...props}>\n {children}\n </SwitchSelector>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","import { Button } from '../Button';\nimport {\n FormElement,\n InputElement,\n InputPasswordElement,\n TextAreaElement,\n} from './elements';\nimport { AutoSizedTextAreaElement } from './elements/AutoSizeTextAreaElement';\nimport { CheckboxElement } from './elements/CheckboxElement';\nimport { EditableFieldInputElement } from './elements/EditableFieldInputElement';\nimport { EditableFieldTextAreaElement } from './elements/EditableFieldTextAreaElement';\nimport { MultiSelectElement } from './elements/MultiselectElement';\nimport { SelectElement } from './elements/SelectElement';\nimport { SwitchSelectorElement } from './elements/SwitchSelectorElement';\nimport { Form as FormRoot } from './FormBase';\nimport { FormControl } from './FormControl';\nimport { FormDescription } from './FormDescription';\nimport { FormField } from './FormField';\nimport { FormItem } from './FormItem';\nimport { FormMessage } from './FormMessage';\nimport { FormLabelLayout } from './layout';\n\ntype FormType = typeof FormRoot & {\n Description: typeof FormDescription;\n Control: typeof FormControl;\n Field: typeof FormField;\n Item: typeof FormItem;\n Label: typeof FormLabelLayout;\n Message: typeof FormMessage;\n Element: typeof FormElement;\n Button: typeof Button;\n Input: typeof InputElement;\n InputPassword: typeof InputPasswordElement;\n Checkbox: typeof CheckboxElement;\n TextArea: typeof TextAreaElement;\n AutoSizedTextArea: typeof AutoSizedTextAreaElement;\n MultiSelect: typeof MultiSelectElement;\n Select: typeof SelectElement;\n EditableFieldInput: typeof EditableFieldInputElement;\n EditableFieldTextArea: typeof EditableFieldTextAreaElement;\n SwitchSelector: typeof SwitchSelectorElement;\n};\n\n/\n Form components\n \n Example of usage:\n * ```jsx\n * <Form\n * schema={ZodSchema}\n * onSubmitSuccess={onSubmitSuccess}\n * onSubmitError={onSubmitError}\n * autoComplete\n * >\n * <Form.Input name=\"name\" label=\"Name\" />\n * <Form.Button type=\"submit\" label=\"Click to submit\">\n * Submit\n * </Form.Button>\n * </Form>\n * ```\n */\nexport const Form = FormRoot as FormType;\nForm.Description = FormDescription;\nForm.Control = FormControl;\nForm.Field = FormField;\nForm.Item = FormItem;\nForm.Label = FormLabelLayout;\nForm.Message = FormMessage;\nForm.Element = FormElement;\nForm.Input = InputElement;\nForm.InputPassword = InputPasswordElement;\nForm.Checkbox = CheckboxElement;\nForm.TextArea = TextAreaElement;\nForm.AutoSizedTextArea = AutoSizedTextAreaElement;\nForm.Button = Button;\nForm.Select = SelectElement;\nForm.MultiSelect = MultiSelectElement;\nForm.EditableFieldInput = EditableFieldInputElement;\nForm.EditableFieldTextArea = EditableFieldTextAreaElement;\nForm.SwitchSelector = SwitchSelectorElement;\n"],"names":["FormRoot"],"mappings":"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"}

package/dist/Form-yi0CMK-a.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Form-yi0CMK-a.cjs","sources":["../src/components/Form/layout/FormItemLayout.tsx","../src/components/Form/elements/FormElement.tsx","../src/components/Form/elements/InputElement.tsx","../src/components/Form/elements/InputPasswordElement.tsx","../src/components/Form/elements/TextAreaElement.tsx","../src/components/Form/elements/EditableFieldInputElement.tsx","../src/components/Form/elements/EditableFieldTextAreaElement.tsx","../src/components/Form/elements/AutoSizeTextAreaElement.tsx","../src/components/Form/elements/CheckboxElement.tsx","../src/components/Form/elements/MultiselectElement.tsx","../src/components/Form/elements/SelectElement.tsx","../src/components/Form/elements/SwitchSelectorElement.tsx","../src/components/Form/Form.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react';\nimport { Form } from '../Form';\nimport { FormLabelLayout, type FormLabelLayoutProps } from './FormLabelLayout';\n\nexport type FormItemLayoutProps = Omit<FormLabelLayoutProps, 'children'> & {\n label?: ReactNode;\n description?: ReactNode;\n children: ReactNode;\n showErrorMessage?: boolean;\n};\n\nexport const FormItemLayout: FC<FormItemLayoutProps> = ({\n label,\n description,\n isRequired,\n info,\n children,\n showErrorMessage = true,\n htmlFor,\n}) => (\n <Form.Item className=\"w-full space-y-2\">\n {(description \|\| label) && (\n <div className=\"space-y-1 leading-none\">\n {label && (\n <FormLabelLayout\n isRequired={isRequired}\n info={info}\n htmlFor={htmlFor}\n >\n {label}\n </FormLabelLayout>\n )}\n {description && <Form.Description>{description}</Form.Description>}\n </div>\n )}\n <Form.Control>{children}</Form.Control>\n\n {showErrorMessage && <Form.Message data-testid=\"error-message\" />}\n </Form.Item>\n);\n","'use client';\n\nimport type { ComponentProps, ElementType, ReactNode } from 'react';\nimport {\n useFormContext,\n type ControllerRenderProps,\n type FieldValues,\n} from 'react-hook-form';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { type FormItemLayoutProps, FormItemLayout } from '../layout';\n\nexport type FormElementProps<T extends ElementType> = {\n name: string;\n Element: T;\n label?: ReactNode;\n isRequired?: boolean;\n info?: string;\n showErrorMessage?: boolean;\n focus?: boolean;\n} & Omit<FormItemLayoutProps, 'children'>;\n\ntype FormFieldElementProps<T extends ElementType> = FormElementProps<T> &\n ComponentProps<T> & {\n field: ControllerRenderProps<FieldValues, string>;\n };\n\nconst FormFieldElement = <T extends ElementType>({\n field,\n name,\n label,\n Element,\n isRequired = false,\n info,\n description,\n showErrorMessage = true,\n ...props\n}: FormFieldElementProps<T>) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <Element data-testid=\"element\" id={name} {...field} {...props}>\n {props.children}\n </Element>\n </FormItemLayout>\n );\n};\n\n/*\n FormElement is a component that allows you to create a form element with a label, description, error message, and validation.\n \n The Element prop is the type of the element that will be rendered.\n * This element will interact with the FormContext and will be controlled by the FormControl component.\n * The props used to control the element will be `value` and `onChange`.\n /\nexport const FormElement = <T extends ElementType>(\n props: FormElementProps<T> & ComponentProps<T>\n) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={props.name}\n render={({ field }) => <FormFieldElement {...props} field={field} />}\n />\n );\n};\n","import type { ComponentProps, FC } from 'react';\nimport { Input } from '../../../components/Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype InputElementProps = Omit<FormElementProps<typeof Input>, 'Element'> &\n ComponentProps<typeof Input> & {\n name: string;\n };\n\nexport const InputElement: FC<InputElementProps> = (props) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={Input}\n {...props}\n />\n);\n","import type { ComponentProps, FC } from 'react';\nimport { InputPassword } from '../../Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype InputPasswordElementProps = Omit<\n FormElementProps<typeof InputPassword>,\n 'Element'\n> &\n ComponentProps<typeof InputPassword> & {\n name: string;\n autoComplete: 'current-password' \| 'new-password';\n };\n\nexport const InputPasswordElement: FC<InputPasswordElementProps> = ({\n autoComplete,\n ...props\n}) => (\n <FormElement\n Element={InputPassword}\n id={props.name}\n data-testid={props.name}\n autoComplete={autoComplete}\n minLength={6}\n maxLength={255}\n {...props}\n />\n);\n","import type { FC } from 'react';\nimport { TextArea } from '../../TextArea/TextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype TextAreaElementsProps = Omit<\n FormElementProps<typeof TextArea>,\n 'Element'\n> &\n React.ComponentProps<typeof TextArea> & {\n name: string;\n };\n\nexport const TextAreaElement: FC<TextAreaElementsProps> = (props) => (\n <FormElement\n Element={TextArea}\n id={props.name}\n data-testid={props.name}\n {...props}\n />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { EditableFieldInput } from '../../EditableField/EditableFieldInput';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype EditableFieldInputElementProps = Omit<\n FormElementProps<typeof EditableFieldInput>,\n 'Element'\n> &\n Omit<ComponentProps<typeof EditableFieldInput>, 'onChange'> & {\n name: string;\n description?: ReactNode;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const EditableFieldInputElement = (\n props: EditableFieldInputElementProps\n) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={EditableFieldInput}\n {...props}\n />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { EditableFieldTextArea } from '../../EditableField/EditableFieldTextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype EditableFieldTextAreaElementProps = Omit<\n FormElementProps<typeof EditableFieldTextArea>,\n 'Element'\n> &\n Omit<ComponentProps<typeof EditableFieldTextArea>, 'onChange'> & {\n name: string;\n description?: ReactNode;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const EditableFieldTextAreaElement = (\n props: EditableFieldTextAreaElementProps\n) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={EditableFieldTextArea}\n {...props}\n />\n);\n","import type { FC } from 'react';\nimport { AutoSizedTextArea } from '../../TextArea/AutoSizeTextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype AutoSizedTextAreaElementsProps = Omit<\n FormElementProps<typeof AutoSizedTextArea>,\n 'Element'\n> &\n React.ComponentProps<typeof AutoSizedTextArea> & {\n name: string;\n };\n\nexport const AutoSizedTextAreaElement: FC<AutoSizedTextAreaElementsProps> = (\n props\n) => (\n <FormElement\n Element={AutoSizedTextArea}\n id={props.name}\n data-testid={props.name}\n {...props}\n />\n);\n","import { type ComponentProps, type FC } from 'react';\nimport { Checkbox } from '../../Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype CheckboxElementProps = Omit<FormElementProps<typeof Checkbox>, 'Element'> &\n ComponentProps<typeof Checkbox> & {\n name: string;\n inputLabel?: string;\n };\n\ntype CheckboxComponentProps = Omit<ComponentProps<typeof Checkbox>, 'label'> & {\n name: string;\n inputLabel?: ComponentProps<typeof Checkbox>['label'];\n};\n\nconst CheckboxComponent: FC<CheckboxComponentProps> = ({\n inputLabel,\n ...props\n}) => <Checkbox {...props} label={inputLabel} />;\n\nexport const CheckboxElement: FC<CheckboxElementProps> = ({\n autoComplete,\n ...props\n}) => (\n <FormElement\n Element={CheckboxComponent}\n id={props.name}\n data-testid={props.name}\n autoComplete={autoComplete}\n minLength={6}\n maxLength={255}\n {...props}\n />\n);\n","/ eslint-disable react-hooks/rules-of-hooks /\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { MultiSelect } from '../../Select/Multiselect';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SelectElementsProps = Omit<\n FormElementProps<typeof MultiSelect>,\n 'Element'\n> &\n ComponentProps<typeof MultiSelect> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const MultiSelectElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SelectElementsProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <MultiSelect\n onValueChange={field.onChange}\n values={field.value}\n {...props}\n >\n {children}\n </MultiSelect>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","/ eslint-disable react-hooks/rules-of-hooks /\n\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { Select } from '../../Select/Select';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SelectElementsProps = Omit<FormElementProps<typeof Select>, 'Element'> &\n ComponentProps<typeof Select> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const SelectElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SelectElementsProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <Select\n onValueChange={field.onChange}\n defaultValue={field.value}\n {...props}\n >\n {children}\n </Select>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","/ eslint-disable react-hooks/rules-of-hooks /\n\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { SwitchSelector } from '../../SwitchSelector';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SwitchSelectorElementProps = Omit<\n FormElementProps<typeof SwitchSelector>,\n 'Element'\n> &\n ComponentProps<typeof SwitchSelector> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const SwitchSelectorElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SwitchSelectorElementProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <SwitchSelector {...field} {...props}>\n {children}\n </SwitchSelector>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","import { Button } from '../Button';\nimport {\n FormElement,\n InputElement,\n InputPasswordElement,\n TextAreaElement,\n} from './elements';\nimport { AutoSizedTextAreaElement } from './elements/AutoSizeTextAreaElement';\nimport { CheckboxElement } from './elements/CheckboxElement';\nimport { EditableFieldInputElement } from './elements/EditableFieldInputElement';\nimport { EditableFieldTextAreaElement } from './elements/EditableFieldTextAreaElement';\nimport { MultiSelectElement } from './elements/MultiselectElement';\nimport { SelectElement } from './elements/SelectElement';\nimport { SwitchSelectorElement } from './elements/SwitchSelectorElement';\nimport { Form as FormRoot } from './FormBase';\nimport { FormControl } from './FormControl';\nimport { FormDescription } from './FormDescription';\nimport { FormField } from './FormField';\nimport { FormItem } from './FormItem';\nimport { FormMessage } from './FormMessage';\nimport { FormLabelLayout } from './layout';\n\ntype FormType = typeof FormRoot & {\n Description: typeof FormDescription;\n Control: typeof FormControl;\n Field: typeof FormField;\n Item: typeof FormItem;\n Label: typeof FormLabelLayout;\n Message: typeof FormMessage;\n Element: typeof FormElement;\n Button: typeof Button;\n Input: typeof InputElement;\n InputPassword: typeof InputPasswordElement;\n Checkbox: typeof CheckboxElement;\n TextArea: typeof TextAreaElement;\n AutoSizedTextArea: typeof AutoSizedTextAreaElement;\n MultiSelect: typeof MultiSelectElement;\n Select: typeof SelectElement;\n EditableFieldInput: typeof EditableFieldInputElement;\n EditableFieldTextArea: typeof EditableFieldTextAreaElement;\n SwitchSelector: typeof SwitchSelectorElement;\n};\n\n/\n Form components\n \n Example of usage:\n * ```jsx\n * <Form\n * schema={ZodSchema}\n * onSubmitSuccess={onSubmitSuccess}\n * onSubmitError={onSubmitError}\n * autoComplete\n * >\n * <Form.Input name=\"name\" label=\"Name\" />\n * <Form.Button type=\"submit\" label=\"Click to submit\">\n * Submit\n * </Form.Button>\n * </Form>\n * ```\n */\nexport const Form = FormRoot as FormType;\nForm.Description = FormDescription;\nForm.Control = FormControl;\nForm.Field = FormField;\nForm.Item = FormItem;\nForm.Label = FormLabelLayout;\nForm.Message = FormMessage;\nForm.Element = FormElement;\nForm.Input = InputElement;\nForm.InputPassword = InputPasswordElement;\nForm.Checkbox = CheckboxElement;\nForm.TextArea = TextAreaElement;\nForm.AutoSizedTextArea = AutoSizedTextAreaElement;\nForm.Button = Button;\nForm.Select = SelectElement;\nForm.MultiSelect = MultiSelectElement;\nForm.EditableFieldInput = EditableFieldInputElement;\nForm.EditableFieldTextArea = EditableFieldTextAreaElement;\nForm.SwitchSelector = SwitchSelectorElement;\n"],"names":["jsxs","jsx","FormLabelLayout","useFormField","useFormContext","Input","InputPassword","TextArea","EditableFieldInput","EditableFieldTextArea","AutoSizedTextArea","Checkbox","MultiSelect","Select","SwitchSelector","FormRoot","FormDescription","FormControl","FormField","FormItem","FormMessage","Button"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAWO,MAAM,iBAA0C,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,MACGA,2BAAAA,KAAA,KAAK,MAAL,EAAU,WAAU,oBACjB,UAAA;AAAA,GAAA,eAAe,UACfA,2BAAA,KAAC,OAAI,EAAA,WAAU,0BACZ,UAAA;AAAA,IACC,SAAAC,2BAAA;AAAA,MAACC,uCAAA;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QAEC,UAAA;AAAA,MAAA;AAAA,IACH;AAAA,IAED,eAAeD,2BAAA,IAAC,KAAK,aAAL,EAAkB,UAAY,YAAA,CAAA;AAAA,EAAA,GACjD;AAAA,EAEDA,2BAAAA,IAAA,KAAK,SAAL,EAAc,SAAS,CAAA;AAAA,EAEvB,oBAAqBA,2BAAA,IAAA,KAAK,SAAL,EAAa,eAAY,gBAAgB,CAAA;AAAA,EACjE,CAAA;ACXF,MAAM,mBAAmB,CAAwB;AAAA,EAC/C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB,GAAG;AACL,MAAgC;AACxB,QAAA,EAAE,MAAM,IAAIE,uCAAa;AAG7B,SAAAF,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAc,CAAC,CAAC;AAAA,MAEhB,UAAAA,2BAAAA,IAAC,SAAQ,EAAA,eAAY,WAAU,IAAI,MAAO,GAAG,OAAQ,GAAG,OACrD,UAAA,MAAM,SACT,CAAA;AAAA,IAAA;AAAA,EACF;AAEJ;AASa,MAAA,cAAc,CACzB,UACG;AACG,QAAA,EAAE,QAAQ,IAAIG,6BAAe;AAGjC,SAAAH,2BAAA;AAAA,IAAC,KAAK;AAAA,IAAL;AAAA,MACC;AAAA,MACA,MAAM,MAAM;AAAA,MACZ,QAAQ,CAAC,EAAE,YAAaA,2BAAAA,IAAA,kBAAA,EAAkB,GAAG,OAAO,MAAc,CAAA;AAAA,IAAA;AAAA,EACpE;AAEJ;ACnEa,MAAA,eAAsC,CAAC,UAClDA,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IACnB,SAASI,uBAAA;AAAA,IACR,GAAG;AAAA,EAAA;AACN;ACFK,MAAM,uBAAsD,CAAC;AAAA,EAClE;AAAA,EACA,GAAG;AACL,MACEJ,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAASK,+BAAA;AAAA,IACT,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IACnB;AAAA,IACA,WAAW;AAAA,IACX,WAAW;AAAA,IACV,GAAG;AAAA,EAAA;AACN;ACbW,MAAA,kBAA6C,CAAC,UACzDL,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAASM,6BAAA;AAAA,IACT,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IAClB,GAAG;AAAA,EAAA;AACN;ACFW,MAAA,4BAA4B,CACvC,UAEAN,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IACnB,SAASO,4CAAA;AAAA,IACR,GAAG;AAAA,EAAA;AACN;ACRW,MAAA,+BAA+B,CAC1C,UAEAP,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IACnB,SAASQ,+CAAA;AAAA,IACR,GAAG;AAAA,EAAA;AACN;ACZW,MAAA,2BAA+D,CAC1E,UAEAR,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAASS,qCAAA;AAAA,IACT,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IAClB,GAAG;AAAA,EAAA;AACN;ACLF,MAAM,oBAAgD,CAAC;AAAA,EACrD;AAAA,EACA,GAAG;AACL,MAAOT,2BAAAA,IAAAU,0BAAAA,UAAA,EAAU,GAAG,OAAO,OAAO,YAAY;AAEvC,MAAM,kBAA4C,CAAC;AAAA,EACxD;AAAA,EACA,GAAG;AACL,MACEV,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAAS;AAAA,IACT,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IACnB;AAAA,IACA,WAAW;AAAA,IACX,WAAW;AAAA,IACV,GAAG;AAAA,EAAA;AACN;ACXK,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA2B;AACnB,QAAA,EAAE,QAAQ,IAAIG,6BAAe;AAGjC,SAAAH,2BAAA;AAAA,IAAC,KAAK;AAAA,IAAL;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ,CAAC,EAAE,YAAY;AACf,cAAA,EAAE,MAAM,IAAIE,uCAAa;AAG7B,eAAAF,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,gBAAc,CAAC,CAAC;AAAA,YAEhB,UAAAA,2BAAA;AAAA,cAACW,8BAAA;AAAA,cAAA;AAAA,gBACC,eAAe,MAAM;AAAA,gBACrB,QAAQ,MAAM;AAAA,gBACb,GAAG;AAAA,gBAEH;AAAA,cAAA;AAAA,YAAA;AAAA,UACH;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ;AAAA,EACF;AAEJ;AC3CO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA2B;AACnB,QAAA,EAAE,QAAQ,IAAIR,6BAAe;AAGjC,SAAAH,2BAAA;AAAA,IAAC,KAAK;AAAA,IAAL;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ,CAAC,EAAE,YAAY;AACf,cAAA,EAAE,MAAM,IAAIE,uCAAa;AAG7B,eAAAF,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,gBAAc,CAAC,CAAC;AAAA,YAEhB,UAAAA,2BAAA;AAAA,cAACY,yBAAA;AAAA,cAAA;AAAA,gBACC,eAAe,MAAM;AAAA,gBACrB,cAAc,MAAM;AAAA,gBACnB,GAAG;AAAA,gBAEH;AAAA,cAAA;AAAA,YAAA;AAAA,UACH;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ;AAAA,EACF;AAEJ;ACtCO,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAkC;AAC1B,QAAA,EAAE,QAAQ,IAAIT,6BAAe;AAGjC,SAAAH,2BAAA;AAAA,IAAC,KAAK;AAAA,IAAL;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ,CAAC,EAAE,YAAY;AACf,cAAA,EAAE,MAAM,IAAIE,uCAAa;AAG7B,eAAAF,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,gBAAc,CAAC,CAAC;AAAA,YAEhB,yCAACa,gDAAgB,EAAA,GAAG,OAAQ,GAAG,OAC5B,SACH,CAAA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ;AAAA,EACF;AAEJ;ACEO,MAAM,OAAOC,yBAAAA;AACpB,KAAK,cAAcC,gCAAA;AACnB,KAAK,UAAUC,4BAAA;AACf,KAAK,QAAQC,0BAAA;AACb,KAAK,OAAOC,yBAAA;AACZ,KAAK,QAAQjB,uCAAA;AACb,KAAK,UAAUkB,4BAAA;AACf,KAAK,UAAU;AACf,KAAK,QAAQ;AACb,KAAK,gBAAgB;AACrB,KAAK,WAAW;AAChB,KAAK,WAAW;AAChB,KAAK,oBAAoB;AACzB,KAAK,SAASC,yBAAA;AACd,KAAK,SAAS;AACd,KAAK,cAAc;AACnB,KAAK,qBAAqB;AAC1B,KAAK,wBAAwB;AAC7B,KAAK,iBAAiB;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"Form-yi0CMK-a.cjs","sources":["../src/components/Form/layout/FormItemLayout.tsx","../src/components/Form/elements/FormElement.tsx","../src/components/Form/elements/InputElement.tsx","../src/components/Form/elements/InputPasswordElement.tsx","../src/components/Form/elements/TextAreaElement.tsx","../src/components/Form/elements/EditableFieldInputElement.tsx","../src/components/Form/elements/EditableFieldTextAreaElement.tsx","../src/components/Form/elements/AutoSizeTextAreaElement.tsx","../src/components/Form/elements/CheckboxElement.tsx","../src/components/Form/elements/MultiselectElement.tsx","../src/components/Form/elements/SelectElement.tsx","../src/components/Form/elements/SwitchSelectorElement.tsx","../src/components/Form/Form.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react';\nimport { Form } from '../Form';\nimport { FormLabelLayout, type FormLabelLayoutProps } from './FormLabelLayout';\n\nexport type FormItemLayoutProps = Omit<FormLabelLayoutProps, 'children'> & {\n label?: ReactNode;\n description?: ReactNode;\n children: ReactNode;\n showErrorMessage?: boolean;\n};\n\nexport const FormItemLayout: FC<FormItemLayoutProps> = ({\n label,\n description,\n isRequired,\n info,\n children,\n showErrorMessage = true,\n htmlFor,\n}) => (\n <Form.Item className=\"w-full space-y-2\">\n {(description \|\| label) && (\n <div className=\"space-y-1 leading-none\">\n {label && (\n <FormLabelLayout\n isRequired={isRequired}\n info={info}\n htmlFor={htmlFor}\n >\n {label}\n </FormLabelLayout>\n )}\n {description && <Form.Description>{description}</Form.Description>}\n </div>\n )}\n <Form.Control>{children}</Form.Control>\n\n {showErrorMessage && <Form.Message data-testid=\"error-message\" />}\n </Form.Item>\n);\n","'use client';\n\nimport type { ComponentProps, ElementType, ReactNode } from 'react';\nimport {\n useFormContext,\n type ControllerRenderProps,\n type FieldValues,\n} from 'react-hook-form';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { type FormItemLayoutProps, FormItemLayout } from '../layout';\n\nexport type FormElementProps<T extends ElementType> = {\n name: string;\n Element: T;\n label?: ReactNode;\n isRequired?: boolean;\n info?: string;\n showErrorMessage?: boolean;\n focus?: boolean;\n} & Omit<FormItemLayoutProps, 'children'>;\n\ntype FormFieldElementProps<T extends ElementType> = FormElementProps<T> &\n ComponentProps<T> & {\n field: ControllerRenderProps<FieldValues, string>;\n };\n\nconst FormFieldElement = <T extends ElementType>({\n field,\n name,\n label,\n Element,\n isRequired = false,\n info,\n description,\n showErrorMessage = true,\n ...props\n}: FormFieldElementProps<T>) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <Element data-testid=\"element\" id={name} {...field} {...props}>\n {props.children}\n </Element>\n </FormItemLayout>\n );\n};\n\n/*\n FormElement is a component that allows you to create a form element with a label, description, error message, and validation.\n \n The Element prop is the type of the element that will be rendered.\n * This element will interact with the FormContext and will be controlled by the FormControl component.\n * The props used to control the element will be `value` and `onChange`.\n /\nexport const FormElement = <T extends ElementType>(\n props: FormElementProps<T> & ComponentProps<T>\n) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={props.name}\n render={({ field }) => <FormFieldElement {...props} field={field} />}\n />\n );\n};\n","import type { ComponentProps, FC } from 'react';\nimport { Input } from '../../../components/Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype InputElementProps = Omit<FormElementProps<typeof Input>, 'Element'> &\n ComponentProps<typeof Input> & {\n name: string;\n };\n\nexport const InputElement: FC<InputElementProps> = (props) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={Input}\n {...props}\n />\n);\n","import type { ComponentProps, FC } from 'react';\nimport { InputPassword } from '../../Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype InputPasswordElementProps = Omit<\n FormElementProps<typeof InputPassword>,\n 'Element'\n> &\n ComponentProps<typeof InputPassword> & {\n name: string;\n autoComplete: 'current-password' \| 'new-password';\n };\n\nexport const InputPasswordElement: FC<InputPasswordElementProps> = ({\n autoComplete,\n ...props\n}) => (\n <FormElement\n Element={InputPassword}\n id={props.name}\n data-testid={props.name}\n autoComplete={autoComplete}\n minLength={6}\n maxLength={255}\n {...props}\n />\n);\n","import type { FC } from 'react';\nimport { TextArea } from '../../TextArea/TextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype TextAreaElementsProps = Omit<\n FormElementProps<typeof TextArea>,\n 'Element'\n> &\n React.ComponentProps<typeof TextArea> & {\n name: string;\n };\n\nexport const TextAreaElement: FC<TextAreaElementsProps> = (props) => (\n <FormElement\n Element={TextArea}\n id={props.name}\n data-testid={props.name}\n {...props}\n />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { EditableFieldInput } from '../../EditableField/EditableFieldInput';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype EditableFieldInputElementProps = Omit<\n FormElementProps<typeof EditableFieldInput>,\n 'Element'\n> &\n ComponentProps<typeof EditableFieldInput> & {\n name: string;\n description?: ReactNode;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const EditableFieldInputElement = (\n props: EditableFieldInputElementProps\n) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={EditableFieldInput}\n {...props}\n />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { EditableFieldTextArea } from '../../EditableField/EditableFieldTextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype EditableFieldTextAreaElementProps = Omit<\n FormElementProps<typeof EditableFieldTextArea>,\n 'Element'\n> &\n ComponentProps<typeof EditableFieldTextArea> & {\n name: string;\n description?: ReactNode;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const EditableFieldTextAreaElement = (\n props: EditableFieldTextAreaElementProps\n) => (\n <FormElement\n id={props.name}\n data-testid={props.name}\n Element={EditableFieldTextArea}\n {...props}\n />\n);\n","import type { FC } from 'react';\nimport { AutoSizedTextArea } from '../../TextArea/AutoSizeTextArea';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype AutoSizedTextAreaElementsProps = Omit<\n FormElementProps<typeof AutoSizedTextArea>,\n 'Element'\n> &\n React.ComponentProps<typeof AutoSizedTextArea> & {\n name: string;\n };\n\nexport const AutoSizedTextAreaElement: FC<AutoSizedTextAreaElementsProps> = (\n props\n) => (\n <FormElement\n Element={AutoSizedTextArea}\n id={props.name}\n data-testid={props.name}\n {...props}\n />\n);\n","import { type ComponentProps, type FC } from 'react';\nimport { Checkbox } from '../../Input';\nimport { type FormElementProps, FormElement } from './FormElement';\n\ntype CheckboxElementProps = Omit<FormElementProps<typeof Checkbox>, 'Element'> &\n ComponentProps<typeof Checkbox> & {\n name: string;\n inputLabel?: string;\n };\n\ntype CheckboxComponentProps = Omit<ComponentProps<typeof Checkbox>, 'label'> & {\n name: string;\n inputLabel?: ComponentProps<typeof Checkbox>['label'];\n};\n\nconst CheckboxComponent: FC<CheckboxComponentProps> = ({\n inputLabel,\n ...props\n}) => <Checkbox {...props} label={inputLabel} />;\n\nexport const CheckboxElement: FC<CheckboxElementProps> = ({\n autoComplete,\n ...props\n}) => (\n <FormElement\n Element={CheckboxComponent}\n id={props.name}\n data-testid={props.name}\n autoComplete={autoComplete}\n minLength={6}\n maxLength={255}\n {...props}\n />\n);\n","/ eslint-disable react-hooks/rules-of-hooks /\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { MultiSelect } from '../../Select/Multiselect';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SelectElementsProps = Omit<\n FormElementProps<typeof MultiSelect>,\n 'Element'\n> &\n ComponentProps<typeof MultiSelect> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const MultiSelectElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SelectElementsProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <MultiSelect\n onValueChange={field.onChange}\n values={field.value}\n {...props}\n >\n {children}\n </MultiSelect>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","/ eslint-disable react-hooks/rules-of-hooks /\n\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { Select } from '../../Select/Select';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SelectElementsProps = Omit<FormElementProps<typeof Select>, 'Element'> &\n ComponentProps<typeof Select> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const SelectElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SelectElementsProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <Select\n onValueChange={field.onChange}\n defaultValue={field.value}\n {...props}\n >\n {children}\n </Select>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","/ eslint-disable react-hooks/rules-of-hooks /\n\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { SwitchSelector } from '../../SwitchSelector';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype SwitchSelectorElementProps = Omit<\n FormElementProps<typeof SwitchSelector>,\n 'Element'\n> &\n ComponentProps<typeof SwitchSelector> & {\n name: string;\n description?: string;\n placeholder?: string;\n className?: string;\n children?: ReactNode;\n };\n\nexport const SwitchSelectorElement = ({\n name,\n description,\n label,\n isRequired,\n info,\n showErrorMessage,\n children,\n ...props\n}: SwitchSelectorElementProps) => {\n const { control } = useFormContext();\n\n return (\n <Form.Field\n control={control}\n name={name}\n render={({ field }) => {\n const { error } = useFormField();\n\n return (\n <FormItemLayout\n htmlFor={name}\n label={label}\n description={description}\n isRequired={isRequired}\n info={info}\n showErrorMessage={showErrorMessage}\n aria-invalid={!!error}\n >\n <SwitchSelector {...field} {...props}>\n {children}\n </SwitchSelector>\n </FormItemLayout>\n );\n }}\n />\n );\n};\n","import { Button } from '../Button';\nimport {\n FormElement,\n InputElement,\n InputPasswordElement,\n TextAreaElement,\n} from './elements';\nimport { AutoSizedTextAreaElement } from './elements/AutoSizeTextAreaElement';\nimport { CheckboxElement } from './elements/CheckboxElement';\nimport { EditableFieldInputElement } from './elements/EditableFieldInputElement';\nimport { EditableFieldTextAreaElement } from './elements/EditableFieldTextAreaElement';\nimport { MultiSelectElement } from './elements/MultiselectElement';\nimport { SelectElement } from './elements/SelectElement';\nimport { SwitchSelectorElement } from './elements/SwitchSelectorElement';\nimport { Form as FormRoot } from './FormBase';\nimport { FormControl } from './FormControl';\nimport { FormDescription } from './FormDescription';\nimport { FormField } from './FormField';\nimport { FormItem } from './FormItem';\nimport { FormMessage } from './FormMessage';\nimport { FormLabelLayout } from './layout';\n\ntype FormType = typeof FormRoot & {\n Description: typeof FormDescription;\n Control: typeof FormControl;\n Field: typeof FormField;\n Item: typeof FormItem;\n Label: typeof FormLabelLayout;\n Message: typeof FormMessage;\n Element: typeof FormElement;\n Button: typeof Button;\n Input: typeof InputElement;\n InputPassword: typeof InputPasswordElement;\n Checkbox: typeof CheckboxElement;\n TextArea: typeof TextAreaElement;\n AutoSizedTextArea: typeof AutoSizedTextAreaElement;\n MultiSelect: typeof MultiSelectElement;\n Select: typeof SelectElement;\n EditableFieldInput: typeof EditableFieldInputElement;\n EditableFieldTextArea: typeof EditableFieldTextAreaElement;\n SwitchSelector: typeof SwitchSelectorElement;\n};\n\n/\n Form components\n \n Example of usage:\n * ```jsx\n * <Form\n * schema={ZodSchema}\n * onSubmitSuccess={onSubmitSuccess}\n * onSubmitError={onSubmitError}\n * autoComplete\n * >\n * <Form.Input name=\"name\" label=\"Name\" />\n * <Form.Button type=\"submit\" label=\"Click to submit\">\n * Submit\n * </Form.Button>\n * </Form>\n * ```\n */\nexport const Form = FormRoot as FormType;\nForm.Description = FormDescription;\nForm.Control = FormControl;\nForm.Field = FormField;\nForm.Item = FormItem;\nForm.Label = FormLabelLayout;\nForm.Message = FormMessage;\nForm.Element = FormElement;\nForm.Input = InputElement;\nForm.InputPassword = InputPasswordElement;\nForm.Checkbox = CheckboxElement;\nForm.TextArea = TextAreaElement;\nForm.AutoSizedTextArea = AutoSizedTextAreaElement;\nForm.Button = Button;\nForm.Select = SelectElement;\nForm.MultiSelect = MultiSelectElement;\nForm.EditableFieldInput = EditableFieldInputElement;\nForm.EditableFieldTextArea = EditableFieldTextAreaElement;\nForm.SwitchSelector = SwitchSelectorElement;\n"],"names":["jsxs","jsx","FormLabelLayout","useFormField","useFormContext","Input","InputPassword","TextArea","EditableFieldInput","EditableFieldTextArea","AutoSizedTextArea","Checkbox","MultiSelect","Select","SwitchSelector","FormRoot","FormDescription","FormControl","FormField","FormItem","FormMessage","Button"],"mappings":"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"}

package/dist/components/Auth/ExternalsLoginButtons/ExternalsLoginButtons.cjs CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const reactIntlayer = require("react-intlayer");
-const index = require("../../../index-Db5Dym4h.cjs");
+const index = require("../../../index-U1U6ySIn.cjs");
 require("@intlayer/config/client");
 const components_Button_Button = require("../../Button/Button.cjs");
 const components_Auth_ExternalsLoginButtons_assets_GithubLogo = require("./assets/GithubLogo.cjs");

package/dist/components/Auth/ExternalsLoginButtons/ExternalsLoginButtons.mjs CHANGED Viewed

@@ -1,7 +1,7 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useDictionary } from "react-intlayer";
-import { i as intlayerAPI } from "../../../index-BTDHuTxL.js";
+import { i as intlayerAPI } from "../../../index-B1w5h_6-.js";
 import "@intlayer/config/client";
 import { Button } from "../../Button/Button.mjs";
 import { GithubLogo } from "./assets/GithubLogo.mjs";

package/dist/components/Command/index.d.ts CHANGED Viewed

@@ -25,7 +25,7 @@ export declare const Command: {
         ref?: React.Ref<HTMLInputElement>;
     } & {
         asChild?: boolean;
-    }, "key" | keyof import('react').InputHTMLAttributes<HTMLInputElement> | "asChild">, "onChange" | "type" | "value"> & {
+    }, "key" | "asChild" | keyof import('react').InputHTMLAttributes<HTMLInputElement>>, "onChange" | "type" | "value"> & {
         value?: string;
         onValueChange?: (search: string) => void;
     } & import('react').RefAttributes<HTMLInputElement>>;

package/dist/components/Container/index.cjs CHANGED Viewed

@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const classVarianceAuthority = require("class-variance-authority");
 const utils_cn = require("../../utils/cn.cjs");
 const containerVariants = classVarianceAuthority.cva(
-  "flex flex-col p-10 text-text backdrop-blur dark:text-text-dark",
+  "flex text-text flex-col backdrop-blur dark:text-text-dark",
   {
     variants: {
       roundedSize: {
@@ -20,10 +20,10 @@ const containerVariants = classVarianceAuthority.cva(
       transparency: {
         none: "",
         full: "bg-none",
-        sm: "dark:bg-opacity-90",
-        md: "dark:bg-opacity-70",
-        lg: "dark:bg-opacity-40",
-        xl: "dark:bg-opacity-20"
+        sm: "bg-opacity-90 dark:bg-opacity-90",
+        md: "bg-opacity-70 dark:bg-opacity-70",
+        lg: "bg-opacity-40 dark:bg-opacity-40",
+        xl: "bg-opacity-20 dark:bg-opacity-20"
       },
       backgroundColor: {
         none: "bg-card dark:bg-card-dark",
@@ -118,6 +118,5 @@ const Container = ({
     children
   }
 );
-Container.displayName = "Container";
 exports.Container = Container;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Container/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs","sources":["../../../src/components/Container/index.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport {\n type PropsWithChildren,\n type HTMLAttributes,\n type FC,\n type DetailedHTMLProps,\n} from 'react';\nimport { cn } from '../../utils/cn';\n\nconst containerVariants = cva(\n 'flex flex-col ~~p-10 text-text~~ backdrop-blur dark:text-text-dark',\n {\n variants: {\n roundedSize: {\n none: 'rounded-none',\n sm: 'rounded-sm',\n md: 'rounded-md',\n lg: 'rounded-lg',\n xl: 'rounded-xl',\n '2xl': 'rounded-2xl',\n '3xl': 'rounded-3xl',\n full: 'rounded-full',\n },\n transparency: {\n none: '',\n full: 'bg-none',\n sm: 'dark:bg-opacity-90',\n md: 'dark:bg-opacity-70',\n lg: 'dark:bg-opacity-40',\n xl: 'dark:bg-opacity-20',\n },\n backgroundColor: {\n none: 'bg-card dark:bg-card-dark',\n primary: 'bg-primary dark:bg-primary-dark',\n secondary: 'bg-secondary dark:bg-secondary-dark',\n neutral: 'bg-neutral dark:bg-neutral-dark',\n text: 'bg-text dark:bg-text-dark',\n card: 'bg-card dark:bg-card-dark',\n contrast: 'bg-background-dark dark:bg-background',\n },\n padding: {\n none: 'p-0',\n sm: 'p-1',\n md: 'p-2',\n lg: 'p-3',\n xl: 'p-4',\n },\n separator: {\n without: '',\n x: 'divide-x divide-dashed divide-text/20 dark:divide-text-dark/20',\n y: 'divide-y divide-dashed divide-text/20 dark:divide-text-dark/20',\n both: 'divide-x divide-y divide-dashed divide-text/20 dark:divide-text-dark/20',\n },\n border: {\n none: '',\n with: 'border-[1.5px]',\n },\n borderColor: {\n primary: 'border-primary dark:border-primary-dark',\n secondary: 'border-secondary dark:border-secondary-dark',\n neutral: 'border-neutral dark:border-neutral-dark',\n text: 'border-text dark:border-text-dark',\n error: 'border-error dark:border-error-dark',\n warning: 'border-warning dark:border-warning-dark',\n success: 'border-success dark:border-success-dark',\n },\n background: {\n none: 'bg-inherit dark:bg-inherit',\n hoverable:\n '!bg-opacity-5 backdrop-blur-0 hover:!bg-opacity-10 hover:backdrop-blur focus:!bg-opacity-10 focus:backdrop-blur aria-selected:!bg-opacity-15 aria-selected:backdrop-blur',\n with: '',\n },\n gap: {\n none: 'gap-0',\n sm: 'gap-1',\n md: 'gap-3',\n lg: 'gap-5',\n xl: 'gap-8',\n '2xl': 'gap-10',\n },\n },\n\n defaultVariants: {\n roundedSize: 'md',\n border: 'none',\n borderColor: 'text',\n backgroundColor: 'card',\n transparency: 'md',\n padding: 'none',\n separator: 'without',\n gap: 'none',\n },\n }\n);\n\nexport type ContainerProps = PropsWithChildren<\n Omit<VariantProps<typeof containerVariants>, 'border'>\n> &\n DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> & {\n border?: boolean;\n };\n\nexport const Container: FC<ContainerProps> = ({\n children,\n roundedSize,\n padding,\n transparency,\n separator,\n className,\n border,\n borderColor,\n backgroundColor,\n background,\n ...props\n}) => (\n <div\n className={cn(\n containerVariants({\n roundedSize,\n transparency,\n padding,\n separator,\n border:\n typeof border === 'boolean' ? (border ? 'with' : 'none') : undefined,\n background,\n backgroundColor,\n borderColor,\n className,\n })\n )}\n {...props}\n >\n {children}\n </div>\n);\n~~\nContainer.displayName = 'Container';\n~~"],"names":["cva","jsx","cn"],"mappings":";;;;;AASA,MAAM,oBAAoBA,uBAAA;AAAA,EACxB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,aAAa;AAAA,QACX,MAAM;AAAA,QACN,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,OAAO;AAAA,QACP,MAAM;AAAA,MACR;AAAA,MACA,cAAc;AAAA,QACZ,MAAM;AAAA,QACN,MAAM;AAAA,QACN,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MACN;AAAA,MACA,iBAAiB;AAAA,QACf,MAAM;AAAA,QACN,SAAS;AAAA,QACT,WAAW;AAAA,QACX,SAAS;AAAA,QACT,MAAM;AAAA,QACN,MAAM;AAAA,QACN,UAAU;AAAA,MACZ;AAAA,MACA,SAAS;AAAA,QACP,MAAM;AAAA,QACN,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MACN;AAAA,MACA,WAAW;AAAA,QACT,SAAS;AAAA,QACT,GAAG;AAAA,QACH,GAAG;AAAA,QACH,MAAM;AAAA,MACR;AAAA,MACA,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,MAAM;AAAA,MACR;AAAA,MACA,aAAa;AAAA,QACX,SAAS;AAAA,QACT,WAAW;AAAA,QACX,SAAS;AAAA,QACT,MAAM;AAAA,QACN,OAAO;AAAA,QACP,SAAS;AAAA,QACT,SAAS;AAAA,MACX;AAAA,MACA,YAAY;AAAA,QACV,MAAM;AAAA,QACN,WACE;AAAA,QACF,MAAM;AAAA,MACR;AAAA,MACA,KAAK;AAAA,QACH,MAAM;AAAA,QACN,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,OAAO;AAAA,MAAA;AAAA,IAEX;AAAA,IAEA,iBAAiB;AAAA,MACf,aAAa;AAAA,MACb,QAAQ;AAAA,MACR,aAAa;AAAA,MACb,iBAAiB;AAAA,MACjB,cAAc;AAAA,MACd,SAAS;AAAA,MACT,WAAW;AAAA,MACX,KAAK;AAAA,IAAA;AAAA,EACP;AAEJ;AASO,MAAM,YAAgC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACEC,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,SAAA;AAAA,MACT,kBAAkB;AAAA,QAChB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,QACE,OAAO,WAAW,YAAa,SAAS,SAAS,SAAU;AAAA,QAC7D;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD,CAAA;AAAA,IACH;AAAA,IACC,GAAG;AAAA,IAEH;AAAA,EAAA;AACH~~;AAGF,UAAU,cAAc~~;;"}
1	+ {"version":3,"file":"index.cjs","sources":["../../../src/components/Container/index.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport {\n type PropsWithChildren,\n type HTMLAttributes,\n type FC,\n type DetailedHTMLProps,\n} from 'react';\nimport { cn } from '../../utils/cn';\n\nconst containerVariants = cva(\n 'flex text-text flex-col backdrop-blur dark:text-text-dark',\n {\n variants: {\n roundedSize: {\n none: 'rounded-none',\n sm: 'rounded-sm',\n md: 'rounded-md',\n lg: 'rounded-lg',\n xl: 'rounded-xl',\n '2xl': 'rounded-2xl',\n '3xl': 'rounded-3xl',\n full: 'rounded-full',\n },\n transparency: {\n none: '',\n full: 'bg-none',\n sm: 'bg-opacity-90 dark:bg-opacity-90',\n md: 'bg-opacity-70 dark:bg-opacity-70',\n lg: 'bg-opacity-40 dark:bg-opacity-40',\n xl: 'bg-opacity-20 dark:bg-opacity-20',\n },\n backgroundColor: {\n none: 'bg-card dark:bg-card-dark',\n primary: 'bg-primary dark:bg-primary-dark',\n secondary: 'bg-secondary dark:bg-secondary-dark',\n neutral: 'bg-neutral dark:bg-neutral-dark',\n text: 'bg-text dark:bg-text-dark',\n card: 'bg-card dark:bg-card-dark',\n contrast: 'bg-background-dark dark:bg-background',\n },\n padding: {\n none: 'p-0',\n sm: 'p-1',\n md: 'p-2',\n lg: 'p-3',\n xl: 'p-4',\n },\n separator: {\n without: '',\n x: 'divide-x divide-dashed divide-text/20 dark:divide-text-dark/20',\n y: 'divide-y divide-dashed divide-text/20 dark:divide-text-dark/20',\n both: 'divide-x divide-y divide-dashed divide-text/20 dark:divide-text-dark/20',\n },\n border: {\n none: '',\n with: 'border-[1.5px]',\n },\n borderColor: {\n primary: 'border-primary dark:border-primary-dark',\n secondary: 'border-secondary dark:border-secondary-dark',\n neutral: 'border-neutral dark:border-neutral-dark',\n text: 'border-text dark:border-text-dark',\n error: 'border-error dark:border-error-dark',\n warning: 'border-warning dark:border-warning-dark',\n success: 'border-success dark:border-success-dark',\n },\n background: {\n none: 'bg-inherit dark:bg-inherit',\n hoverable:\n '!bg-opacity-5 backdrop-blur-0 hover:!bg-opacity-10 hover:backdrop-blur focus:!bg-opacity-10 focus:backdrop-blur aria-selected:!bg-opacity-15 aria-selected:backdrop-blur',\n with: '',\n },\n gap: {\n none: 'gap-0',\n sm: 'gap-1',\n md: 'gap-3',\n lg: 'gap-5',\n xl: 'gap-8',\n '2xl': 'gap-10',\n },\n },\n\n defaultVariants: {\n roundedSize: 'md',\n border: 'none',\n borderColor: 'text',\n backgroundColor: 'card',\n transparency: 'md',\n padding: 'none',\n separator: 'without',\n gap: 'none',\n },\n }\n);\n\nexport type ContainerProps = PropsWithChildren<\n Omit<VariantProps<typeof containerVariants>, 'border'>\n> &\n DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> & {\n border?: boolean;\n };\n\nexport const Container: FC<ContainerProps> = ({\n children,\n roundedSize,\n padding,\n transparency,\n separator,\n className,\n border,\n borderColor,\n backgroundColor,\n background,\n ...props\n}) => (\n <div\n className={cn(\n containerVariants({\n roundedSize,\n transparency,\n padding,\n separator,\n border:\n typeof border === 'boolean' ? (border ? 'with' : 'none') : undefined,\n background,\n backgroundColor,\n borderColor,\n className,\n })\n )}\n {...props}\n >\n {children}\n </div>\n);\n"],"names":["cva","jsx","cn"],"mappings":";;;;;AASA,MAAM,oBAAoBA,uBAAA;AAAA,EACxB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,aAAa;AAAA,QACX,MAAM;AAAA,QACN,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,OAAO;AAAA,QACP,MAAM;AAAA,MACR;AAAA,MACA,cAAc;AAAA,QACZ,MAAM;AAAA,QACN,MAAM;AAAA,QACN,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MACN;AAAA,MACA,iBAAiB;AAAA,QACf,MAAM;AAAA,QACN,SAAS;AAAA,QACT,WAAW;AAAA,QACX,SAAS;AAAA,QACT,MAAM;AAAA,QACN,MAAM;AAAA,QACN,UAAU;AAAA,MACZ;AAAA,MACA,SAAS;AAAA,QACP,MAAM;AAAA,QACN,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MACN;AAAA,MACA,WAAW;AAAA,QACT,SAAS;AAAA,QACT,GAAG;AAAA,QACH,GAAG;AAAA,QACH,MAAM;AAAA,MACR;AAAA,MACA,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,MAAM;AAAA,MACR;AAAA,MACA,aAAa;AAAA,QACX,SAAS;AAAA,QACT,WAAW;AAAA,QACX,SAAS;AAAA,QACT,MAAM;AAAA,QACN,OAAO;AAAA,QACP,SAAS;AAAA,QACT,SAAS;AAAA,MACX;AAAA,MACA,YAAY;AAAA,QACV,MAAM;AAAA,QACN,WACE;AAAA,QACF,MAAM;AAAA,MACR;AAAA,MACA,KAAK;AAAA,QACH,MAAM;AAAA,QACN,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,OAAO;AAAA,MAAA;AAAA,IAEX;AAAA,IAEA,iBAAiB;AAAA,MACf,aAAa;AAAA,MACb,QAAQ;AAAA,MACR,aAAa;AAAA,MACb,iBAAiB;AAAA,MACjB,cAAc;AAAA,MACd,SAAS;AAAA,MACT,WAAW;AAAA,MACX,KAAK;AAAA,IAAA;AAAA,EACP;AAEJ;AASO,MAAM,YAAgC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACEC,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,SAAA;AAAA,MACT,kBAAkB;AAAA,QAChB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,QACE,OAAO,WAAW,YAAa,SAAS,SAAS,SAAU;AAAA,QAC7D;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD,CAAA;AAAA,IACH;AAAA,IACC,GAAG;AAAA,IAEH;AAAA,EAAA;AACH;;"}

package/dist/components/Container/index.mjs CHANGED Viewed

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { cn } from "../../utils/cn.mjs";
 const containerVariants = cva(
-  "flex flex-col p-10 text-text backdrop-blur dark:text-text-dark",
+  "flex text-text flex-col backdrop-blur dark:text-text-dark",
   {
     variants: {
       roundedSize: {
@@ -18,10 +18,10 @@ const containerVariants = cva(
       transparency: {
         none: "",
         full: "bg-none",
-        sm: "dark:bg-opacity-90",
-        md: "dark:bg-opacity-70",
-        lg: "dark:bg-opacity-40",
-        xl: "dark:bg-opacity-20"
+        sm: "bg-opacity-90 dark:bg-opacity-90",
+        md: "bg-opacity-70 dark:bg-opacity-70",
+        lg: "bg-opacity-40 dark:bg-opacity-40",
+        xl: "bg-opacity-20 dark:bg-opacity-20"
       },
       backgroundColor: {
         none: "bg-card dark:bg-card-dark",
@@ -116,7 +116,6 @@ const Container = ({
     children
   }
 );
-Container.displayName = "Container";
 export {
   Container
 };