@intlayer/design-system 5.0.5 → 5.1.0

package/dist/{Form-DlqjTz3u.js → Form-BZUDRfoN.js}

@@ -1,15 +1,16 @@
 "use client";
 import { Button } from "./components/Button/Button.mjs";
-import { j as jsxRuntimeExports } from "./jsx-runtime-DQkoUcjV.js";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { useFormContext } from "react-hook-form";
 import { Input } from "./components/Input/Input.mjs";
-import { InputPassword } from "./components/Input/InputPassword.mjs";
+import "lucide-react";
+import "react";
 import { Checkbox } from "./components/Input/Checkbox.mjs";
+import { InputPassword } from "./components/Input/InputPassword.mjs";
 import { TextArea } from "./components/TextArea/TextArea.mjs";
 import { EditableFieldInput } from "./components/EditableField/EditableFieldInput.mjs";
 import { EditableFieldTextArea } from "./components/EditableField/EditableFieldTextArea.mjs";
 import { AutoSizedTextArea } from "./components/TextArea/AutoSizeTextArea.mjs";
-import { forwardRef } from "react";
 import { MultiSelect } from "./components/Select/Multiselect.mjs";
 import { useFormField, FormField } from "./components/Form/FormField.mjs";
 import { FormLabelLayout } from "./components/Form/layout/FormLabelLayout.mjs";
@@ -22,7 +23,6 @@ import { FormItem } from "./components/Form/FormItem.mjs";
 import { FormMessage } from "./components/Form/FormMessage.mjs";
 import "clsx";
 import "tailwind-merge";
-import "./components/Form/FormLabel.mjs";
 const FormItemLayout = ({
   label,
   description,
@@ -31,9 +31,9 @@ const FormItemLayout = ({
   children,
   showErrorMessage = true,
   htmlFor
-}) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Form.Item, { className: "w-full space-y-2", children: [
-  (description || label) && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1 leading-none", children: [
-    label && /* @__PURE__ */ jsxRuntimeExports.jsx(
+}) => /* @__PURE__ */ jsxs(Form.Item, { className: "w-full space-y-2", children: [
+  (description || label) && /* @__PURE__ */ jsxs("div", { className: "space-y-1 leading-none", children: [
+    label && /* @__PURE__ */ jsx(
       FormLabelLayout,
       {
         isRequired,
@@ -42,10 +42,10 @@ const FormItemLayout = ({
         children: label
       }
     ),
-    description && /* @__PURE__ */ jsxRuntimeExports.jsx(Form.Description, { children: description })
+    description && /* @__PURE__ */ jsx(Form.Description, { children: description })
   ] }),
-  /* @__PURE__ */ jsxRuntimeExports.jsx(Form.Control, { children }),
-  showErrorMessage && /* @__PURE__ */ jsxRuntimeExports.jsx(Form.Message, { "data-testid": "error-message" })
+  /* @__PURE__ */ jsx(Form.Control, { children }),
+  showErrorMessage && /* @__PURE__ */ jsx(Form.Message, { "data-testid": "error-message" })
 ] });
 const FormFieldElement = ({
   field,
@@ -59,7 +59,7 @@ const FormFieldElement = ({
   ...props
 }) => {
   const { error } = useFormField();
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsx(
     FormItemLayout,
     {
       htmlFor: name,
@@ -69,22 +69,22 @@ const FormFieldElement = ({
       info,
       showErrorMessage,
       "aria-invalid": !!error,
-      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Element, { "data-testid": "element", id: name, ...field, ...props, children: props.children })
+      children: /* @__PURE__ */ jsx(Element, { "data-testid": "element", id: name, ...field, ...props, children: props.children })
     }
   );
 };
 const FormElement = (props) => {
   const { control } = useFormContext();
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsx(
     Form.Field,
     {
       control,
       name: props.name,
-      render: ({ field }) => /* @__PURE__ */ jsxRuntimeExports.jsx(FormFieldElement, { ...props, field })
+      render: ({ field }) => /* @__PURE__ */ jsx(FormFieldElement, { ...props, field })
     }
   );
 };
-const InputElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+const InputElement = (props) => /* @__PURE__ */ jsx(
   FormElement,
   {
     id: props.name,
@@ -96,7 +96,7 @@ const InputElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
 const InputPasswordElement = ({
   autoComplete,
   ...props
-}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+}) => /* @__PURE__ */ jsx(
   FormElement,
   {
     Element: InputPassword,
@@ -108,7 +108,7 @@ const InputPasswordElement = ({
     ...props
   }
 );
-const TextAreaElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+const TextAreaElement = (props) => /* @__PURE__ */ jsx(
   FormElement,
   {
     Element: TextArea,
@@ -117,7 +117,7 @@ const TextAreaElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
     ...props
   }
 );
-const EditableFieldInputElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+const EditableFieldInputElement = (props) => /* @__PURE__ */ jsx(
   FormElement,
   {
     id: props.name,
@@ -126,7 +126,7 @@ const EditableFieldInputElement = (props) => /* @__PURE__ */ jsxRuntimeExports.j
     ...props
   }
 );
-const EditableFieldTextAreaElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+const EditableFieldTextAreaElement = (props) => /* @__PURE__ */ jsx(
   FormElement,
   {
     id: props.name,
@@ -135,7 +135,7 @@ const EditableFieldTextAreaElement = (props) => /* @__PURE__ */ jsxRuntimeExport
     ...props
   }
 );
-const AutoSizedTextAreaElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+const AutoSizedTextAreaElement = (props) => /* @__PURE__ */ jsx(
   FormElement,
   {
     Element: AutoSizedTextArea,
@@ -144,14 +144,14 @@ const AutoSizedTextAreaElement = (props) => /* @__PURE__ */ jsxRuntimeExports.js
     ...props
   }
 );
-const CheckboxComponent = forwardRef(
-  ({ inputLabel, ...props }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx(Checkbox, { ref, ...props, label: inputLabel })
-);
-CheckboxComponent.displayName = "CheckboxComponent";
+const CheckboxComponent = ({
+  inputLabel,
+  ...props
+}) => /* @__PURE__ */ jsx(Checkbox, { ...props, label: inputLabel });
 const CheckboxElement = ({
   autoComplete,
   ...props
-}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+}) => /* @__PURE__ */ jsx(
   FormElement,
   {
     Element: CheckboxComponent,
@@ -174,14 +174,14 @@ const MultiSelectElement = ({
   ...props
 }) => {
   const { control } = useFormContext();
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsx(
     Form.Field,
     {
       control,
       name,
       render: ({ field }) => {
         const { error } = useFormField();
-        return /* @__PURE__ */ jsxRuntimeExports.jsx(
+        return /* @__PURE__ */ jsx(
           FormItemLayout,
           {
             htmlFor: name,
@@ -191,7 +191,7 @@ const MultiSelectElement = ({
             info,
             showErrorMessage,
             "aria-invalid": !!error,
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+            children: /* @__PURE__ */ jsx(
               MultiSelect,
               {
                 onValueChange: field.onChange,
@@ -217,14 +217,14 @@ const SelectElement = ({
   ...props
 }) => {
   const { control } = useFormContext();
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsx(
     Form.Field,
     {
       control,
       name,
       render: ({ field }) => {
         const { error } = useFormField();
-        return /* @__PURE__ */ jsxRuntimeExports.jsx(
+        return /* @__PURE__ */ jsx(
           FormItemLayout,
           {
             htmlFor: name,
@@ -234,7 +234,7 @@ const SelectElement = ({
             info,
             showErrorMessage,
             "aria-invalid": !!error,
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+            children: /* @__PURE__ */ jsx(
               Select,
               {
                 onValueChange: field.onChange,
@@ -260,14 +260,14 @@ const SwitchSelectorElement = ({
   ...props
 }) => {
   const { control } = useFormContext();
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsx(
     Form.Field,
     {
       control,
       name,
       render: ({ field }) => {
         const { error } = useFormField();
-        return /* @__PURE__ */ jsxRuntimeExports.jsx(
+        return /* @__PURE__ */ jsx(
           FormItemLayout,
           {
             htmlFor: name,
@@ -277,7 +277,7 @@ const SwitchSelectorElement = ({
             info,
             showErrorMessage,
             "aria-invalid": !!error,
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(SwitchSelector, { ...field, ...props, children })
+            children: /* @__PURE__ */ jsx(SwitchSelector, { ...field, ...props, children })
           }
         );
       }
@@ -318,4 +318,4 @@ export {
   FormItemLayout as d,
   SwitchSelectorElement as e
 };
-//# sourceMappingURL=Form-DlqjTz3u.js.map
+//# sourceMappingURL=Form-BZUDRfoN.js.map

package/dist/Form-BZUDRfoN.js.map

@@ -0,0 +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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"}

package/dist/{Form-CSMiPnjC.cjs → Form-yi0CMK-a.cjs}

@@ -1,16 +1,17 @@
 "use client";
 "use strict";
 const components_Button_Button = require("./components/Button/Button.cjs");
-const jsxRuntime = require("./jsx-runtime-CgFM7lM3.cjs");
+const jsxRuntime = require("react/jsx-runtime");
 const reactHookForm = require("react-hook-form");
 const components_Input_Input = require("./components/Input/Input.cjs");
-const components_Input_InputPassword = require("./components/Input/InputPassword.cjs");
+require("lucide-react");
+require("react");
 const components_Input_Checkbox = require("./components/Input/Checkbox.cjs");
+const components_Input_InputPassword = require("./components/Input/InputPassword.cjs");
 const components_TextArea_TextArea = require("./components/TextArea/TextArea.cjs");
 const components_EditableField_EditableFieldInput = require("./components/EditableField/EditableFieldInput.cjs");
 const components_EditableField_EditableFieldTextArea = require("./components/EditableField/EditableFieldTextArea.cjs");
 const components_TextArea_AutoSizeTextArea = require("./components/TextArea/AutoSizeTextArea.cjs");
-const require$$0 = require("react");
 const components_Select_Multiselect = require("./components/Select/Multiselect.cjs");
 const components_Form_FormField = require("./components/Form/FormField.cjs");
 const components_Form_layout_FormLabelLayout = require("./components/Form/layout/FormLabelLayout.cjs");
@@ -23,7 +24,6 @@ const components_Form_FormItem = require("./components/Form/FormItem.cjs");
 const components_Form_FormMessage = require("./components/Form/FormMessage.cjs");
 require("clsx");
 require("tailwind-merge");
-require("./components/Form/FormLabel.cjs");
 const FormItemLayout = ({
   label,
   description,
@@ -32,9 +32,9 @@ const FormItemLayout = ({
   children,
   showErrorMessage = true,
   htmlFor
-}) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(Form.Item, { className: "w-full space-y-2", children: [
-  (description || label) && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "space-y-1 leading-none", children: [
-    label && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+}) => /* @__PURE__ */ jsxRuntime.jsxs(Form.Item, { className: "w-full space-y-2", children: [
+  (description || label) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1 leading-none", children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx(
       components_Form_layout_FormLabelLayout.FormLabelLayout,
       {
         isRequired,
@@ -43,10 +43,10 @@ const FormItemLayout = ({
         children: label
       }
     ),
-    description && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Form.Description, { children: description })
+    description && /* @__PURE__ */ jsxRuntime.jsx(Form.Description, { children: description })
   ] }),
-  /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Form.Control, { children }),
-  showErrorMessage && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Form.Message, { "data-testid": "error-message" })
+  /* @__PURE__ */ jsxRuntime.jsx(Form.Control, { children }),
+  showErrorMessage && /* @__PURE__ */ jsxRuntime.jsx(Form.Message, { "data-testid": "error-message" })
 ] });
 const FormFieldElement = ({
   field,
@@ -60,7 +60,7 @@ const FormFieldElement = ({
   ...props
 }) => {
   const { error } = components_Form_FormField.useFormField();
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     FormItemLayout,
     {
       htmlFor: name,
@@ -70,22 +70,22 @@ const FormFieldElement = ({
       info,
       showErrorMessage,
       "aria-invalid": !!error,
-      children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Element, { "data-testid": "element", id: name, ...field, ...props, children: props.children })
+      children: /* @__PURE__ */ jsxRuntime.jsx(Element, { "data-testid": "element", id: name, ...field, ...props, children: props.children })
     }
   );
 };
 const FormElement = (props) => {
   const { control } = reactHookForm.useFormContext();
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     Form.Field,
     {
       control,
       name: props.name,
-      render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(FormFieldElement, { ...props, field })
+      render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsx(FormFieldElement, { ...props, field })
     }
   );
 };
-const InputElement = (props) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+const InputElement = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   FormElement,
   {
     id: props.name,
@@ -97,7 +97,7 @@ const InputElement = (props) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx
 const InputPasswordElement = ({
   autoComplete,
   ...props
-}) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+}) => /* @__PURE__ */ jsxRuntime.jsx(
   FormElement,
   {
     Element: components_Input_InputPassword.InputPassword,
@@ -109,7 +109,7 @@ const InputPasswordElement = ({
     ...props
   }
 );
-const TextAreaElement = (props) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+const TextAreaElement = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   FormElement,
   {
     Element: components_TextArea_TextArea.TextArea,
@@ -118,7 +118,7 @@ const TextAreaElement = (props) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.
     ...props
   }
 );
-const EditableFieldInputElement = (props) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+const EditableFieldInputElement = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   FormElement,
   {
     id: props.name,
@@ -127,7 +127,7 @@ const EditableFieldInputElement = (props) => /* @__PURE__ */ jsxRuntime.jsxRunti
     ...props
   }
 );
-const EditableFieldTextAreaElement = (props) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+const EditableFieldTextAreaElement = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   FormElement,
   {
     id: props.name,
@@ -136,7 +136,7 @@ const EditableFieldTextAreaElement = (props) => /* @__PURE__ */ jsxRuntime.jsxRu
     ...props
   }
 );
-const AutoSizedTextAreaElement = (props) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+const AutoSizedTextAreaElement = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   FormElement,
   {
     Element: components_TextArea_AutoSizeTextArea.AutoSizedTextArea,
@@ -145,14 +145,14 @@ const AutoSizedTextAreaElement = (props) => /* @__PURE__ */ jsxRuntime.jsxRuntim
     ...props
   }
 );
-const CheckboxComponent = require$$0.forwardRef(
-  ({ inputLabel, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(components_Input_Checkbox.Checkbox, { ref, ...props, label: inputLabel })
-);
-CheckboxComponent.displayName = "CheckboxComponent";
+const CheckboxComponent = ({
+  inputLabel,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(components_Input_Checkbox.Checkbox, { ...props, label: inputLabel });
 const CheckboxElement = ({
   autoComplete,
   ...props
-}) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+}) => /* @__PURE__ */ jsxRuntime.jsx(
   FormElement,
   {
     Element: CheckboxComponent,
@@ -175,14 +175,14 @@ const MultiSelectElement = ({
   ...props
 }) => {
   const { control } = reactHookForm.useFormContext();
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     Form.Field,
     {
       control,
       name,
       render: ({ field }) => {
         const { error } = components_Form_FormField.useFormField();
-        return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+        return /* @__PURE__ */ jsxRuntime.jsx(
           FormItemLayout,
           {
             htmlFor: name,
@@ -192,7 +192,7 @@ const MultiSelectElement = ({
             info,
             showErrorMessage,
             "aria-invalid": !!error,
-            children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+            children: /* @__PURE__ */ jsxRuntime.jsx(
               components_Select_Multiselect.MultiSelect,
               {
                 onValueChange: field.onChange,
@@ -218,14 +218,14 @@ const SelectElement = ({
   ...props
 }) => {
   const { control } = reactHookForm.useFormContext();
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     Form.Field,
     {
       control,
       name,
       render: ({ field }) => {
         const { error } = components_Form_FormField.useFormField();
-        return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+        return /* @__PURE__ */ jsxRuntime.jsx(
           FormItemLayout,
           {
             htmlFor: name,
@@ -235,7 +235,7 @@ const SelectElement = ({
             info,
             showErrorMessage,
             "aria-invalid": !!error,
-            children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+            children: /* @__PURE__ */ jsxRuntime.jsx(
               components_Select_Select.Select,
               {
                 onValueChange: field.onChange,
@@ -261,14 +261,14 @@ const SwitchSelectorElement = ({
   ...props
 }) => {
   const { control } = reactHookForm.useFormContext();
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     Form.Field,
     {
       control,
       name,
       render: ({ field }) => {
         const { error } = components_Form_FormField.useFormField();
-        return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+        return /* @__PURE__ */ jsxRuntime.jsx(
           FormItemLayout,
           {
             htmlFor: name,
@@ -278,7 +278,7 @@ const SwitchSelectorElement = ({
             info,
             showErrorMessage,
             "aria-invalid": !!error,
-            children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(components_SwitchSelector_index.SwitchSelector, { ...field, ...props, children })
+            children: /* @__PURE__ */ jsxRuntime.jsx(components_SwitchSelector_index.SwitchSelector, { ...field, ...props, children })
           }
         );
       }
@@ -317,4 +317,4 @@ exports.MultiSelectElement = MultiSelectElement;
 exports.SelectElement = SelectElement;
 exports.SwitchSelectorElement = SwitchSelectorElement;
 exports.TextAreaElement = TextAreaElement;
-//# sourceMappingURL=Form-CSMiPnjC.cjs.map
+//# sourceMappingURL=Form-yi0CMK-a.cjs.map

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

@@ -0,0 +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":"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"}

package/dist/components/Accordion/Accordion.cjs

@@ -1,9 +1,9 @@
 "use client";
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("../../jsx-runtime-CgFM7lM3.cjs");
+const jsxRuntime = require("react/jsx-runtime");
 const lucideReact = require("lucide-react");
-const require$$0 = require("react");
+const ReactExports = require("react");
 const utils_cn = require("../../utils/cn.cjs");
 const components_Button_Button = require("../Button/Button.cjs");
 const components_MaxHeightSmoother_index = require("../MaxHeightSmoother/index.cjs");
@@ -14,15 +14,15 @@ const Accordion = ({
   onClick,
   ...props
 }) => {
-  const [isOpen, setIsOpen] = require$$0.useState(isOpenDefault);
+  const [isOpen, setIsOpen] = ReactExports.useState(isOpenDefault);
   const isHidden = isOpen == void 0 ? void 0 : !isOpen;
-  require$$0.useEffect(() => {
+  ReactExports.useEffect(() => {
     if (isOpenDefault != void 0) {
       setIsOpen(isOpenDefault);
     }
   }, [isOpenDefault]);
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "w-full", children: [
-    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
       components_Button_Button.Button,
       {
         variant: "hoverable",
@@ -42,7 +42,7 @@ const Accordion = ({
         children: header
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+    /* @__PURE__ */ jsxRuntime.jsx(
       components_MaxHeightSmoother_index.MaxHeightSmoother,
       {
         tabIndex: isHidden !== false ? void 0 : -1,

package/dist/components/Accordion/Accordion.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.cjs","sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport { ChevronDown } from 'lucide-react';\nimport { useEffect, useState, type FC, type ReactNode } from 'react';\nimport { cn } from '../../utils/cn';\nimport { Button, ButtonProps } from '../Button';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\n\ntype AccordionProps = {\n  header: ReactNode;\n  children: ReactNode;\n  isOpen?: boolean;\n} & ButtonProps;\n\n/**\n * Accordion component that allows the user to expand and collapse content.\n * It provides a header with a chevron icon that controls the visibility of the content.\n *\n * @param header - The content of the header.\n * @param children - The content to be expanded and collapsed.\n * @param isOpen - Whether the content is expanded or collapsed by default.\n *\n * @example\n * <Accordion header=\"Accordion Header\" isOpen={true}>\n *   <p>Accordion content</p>\n * </Accordion>\n *\n */\nexport const Accordion: FC<AccordionProps> = ({\n  children,\n  header,\n  isOpen: isOpenDefault = false,\n  onClick,\n  ...props\n}) => {\n  const [isOpen, setIsOpen] = useState(isOpenDefault);\n  const isHidden = isOpen == undefined ? undefined : !isOpen;\n\n  useEffect(() => {\n    if (isOpenDefault != undefined) {\n      setIsOpen(isOpenDefault);\n    }\n  }, [isOpenDefault]);\n\n  return (\n    <div className=\"w-full\">\n      <Button\n        variant=\"hoverable\"\n        color=\"text\"\n        onClick={(e) => {\n          setIsOpen((prevIsOpen) => !prevIsOpen);\n          onClick?.(e);\n        }}\n        isFullWidth\n        className=\"flex items-center justify-between gap-2 bg-red-300\"\n        IconRight={ChevronDown}\n        iconClassName={cn(\n          'transform transition-transform duration-500 ease-in-out',\n          isOpen ? 'rotate-0' : '-rotate-180'\n        )}\n        {...props}\n      >\n        {header}\n      </Button>\n\n      <MaxHeightSmoother\n        tabIndex={isHidden !== false ? undefined : -1}\n        isHidden={isHidden}\n      >\n        {children}\n      </MaxHeightSmoother>\n    </div>\n  );\n};\n"],"names":["useState","useEffect","jsxs","jsx","Button","ChevronDown","cn","MaxHeightSmoother"],"mappings":";;;;;;;;;AA4BO,MAAM,YAAgC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA,QAAQ,gBAAgB;AAAA,EACxB;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,QAAQ,SAAS,IAAIA,WAAAA,SAAS,aAAa;AAClD,QAAM,WAAW,UAAU,SAAY,SAAY,CAAC;AAEpDC,aAAAA,UAAU,MAAM;AACd,QAAI,iBAAiB,QAAW;AAC9B,gBAAU,aAAa;AAAA,IAAA;AAAA,EACzB,GACC,CAAC,aAAa,CAAC;AAGhB,SAAAC,2BAAA,kBAAA,KAAC,OAAI,EAAA,WAAU,UACb,UAAA;AAAA,IAAAC,2BAAA,kBAAA;AAAA,MAACC,yBAAA;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,SAAS,CAAC,MAAM;AACJ,oBAAA,CAAC,eAAe,CAAC,UAAU;AACrC,oBAAU,CAAC;AAAA,QACb;AAAA,QACA,aAAW;AAAA,QACX,WAAU;AAAA,QACV,WAAWC,YAAA;AAAA,QACX,eAAeC,SAAA;AAAA,UACb;AAAA,UACA,SAAS,aAAa;AAAA,QACxB;AAAA,QACC,GAAG;AAAA,QAEH,UAAA;AAAA,MAAA;AAAA,IACH;AAAA,IAEAH,2BAAA,kBAAA;AAAA,MAACI,mCAAA;AAAA,MAAA;AAAA,QACC,UAAU,aAAa,QAAQ,SAAY;AAAA,QAC3C;AAAA,QAEC;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;;"}
+{"version":3,"file":"Accordion.cjs","sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport { ChevronDown } from 'lucide-react';\nimport { useEffect, useState, type FC, type ReactNode } from 'react';\nimport { cn } from '../../utils/cn';\nimport { type ButtonProps, Button } from '../Button';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\n\ntype AccordionProps = {\n  header: ReactNode;\n  children: ReactNode;\n  isOpen?: boolean;\n} & ButtonProps;\n\n/**\n * Accordion component that allows the user to expand and collapse content.\n * It provides a header with a chevron icon that controls the visibility of the content.\n *\n * @param header - The content of the header.\n * @param children - The content to be expanded and collapsed.\n * @param isOpen - Whether the content is expanded or collapsed by default.\n *\n * @example\n * <Accordion header=\"Accordion Header\" isOpen={true}>\n *   <p>Accordion content</p>\n * </Accordion>\n *\n */\nexport const Accordion: FC<AccordionProps> = ({\n  children,\n  header,\n  isOpen: isOpenDefault = false,\n  onClick,\n  ...props\n}) => {\n  const [isOpen, setIsOpen] = useState(isOpenDefault);\n  const isHidden = isOpen == undefined ? undefined : !isOpen;\n\n  useEffect(() => {\n    if (isOpenDefault != undefined) {\n      setIsOpen(isOpenDefault);\n    }\n  }, [isOpenDefault]);\n\n  return (\n    <div className=\"w-full\">\n      <Button\n        variant=\"hoverable\"\n        color=\"text\"\n        onClick={(e) => {\n          setIsOpen((prevIsOpen) => !prevIsOpen);\n          onClick?.(e);\n        }}\n        isFullWidth\n        className=\"flex items-center justify-between gap-2 bg-red-300\"\n        IconRight={ChevronDown}\n        iconClassName={cn(\n          'transform transition-transform duration-500 ease-in-out',\n          isOpen ? 'rotate-0' : '-rotate-180'\n        )}\n        {...props}\n      >\n        {header}\n      </Button>\n\n      <MaxHeightSmoother\n        tabIndex={isHidden !== false ? undefined : -1}\n        isHidden={isHidden}\n      >\n        {children}\n      </MaxHeightSmoother>\n    </div>\n  );\n};\n"],"names":["useState","useEffect","jsxs","jsx","Button","ChevronDown","cn","MaxHeightSmoother"],"mappings":";;;;;;;;;AA4BO,MAAM,YAAgC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA,QAAQ,gBAAgB;AAAA,EACxB;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,QAAQ,SAAS,IAAIA,aAAAA,SAAS,aAAa;AAClD,QAAM,WAAW,UAAU,SAAY,SAAY,CAAC;AAEpDC,eAAAA,UAAU,MAAM;AACd,QAAI,iBAAiB,QAAW;AAC9B,gBAAU,aAAa;AAAA,IAAA;AAAA,EACzB,GACC,CAAC,aAAa,CAAC;AAGhB,SAAAC,2BAAA,KAAC,OAAI,EAAA,WAAU,UACb,UAAA;AAAA,IAAAC,2BAAA;AAAA,MAACC,yBAAA;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,SAAS,CAAC,MAAM;AACJ,oBAAA,CAAC,eAAe,CAAC,UAAU;AACrC,oBAAU,CAAC;AAAA,QACb;AAAA,QACA,aAAW;AAAA,QACX,WAAU;AAAA,QACV,WAAWC,YAAA;AAAA,QACX,eAAeC,SAAA;AAAA,UACb;AAAA,UACA,SAAS,aAAa;AAAA,QACxB;AAAA,QACC,GAAG;AAAA,QAEH,UAAA;AAAA,MAAA;AAAA,IACH;AAAA,IAEAH,2BAAA;AAAA,MAACI,mCAAA;AAAA,MAAA;AAAA,QACC,UAAU,aAAa,QAAQ,SAAY;AAAA,QAC3C;AAAA,QAEC;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;;"}

package/dist/components/Accordion/Accordion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAErE,OAAO,EAAU,WAAW,EAAE,MAAM,WAAW,CAAC;AAGhD,KAAK,cAAc,GAAG;IACpB,MAAM,EAAE,SAAS,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,GAAG,WAAW,CAAC;AAEhB;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CA6CxC,CAAC"}
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAErE,OAAO,EAAE,KAAK,WAAW,EAAU,MAAM,WAAW,CAAC;AAGrD,KAAK,cAAc,GAAG;IACpB,MAAM,EAAE,SAAS,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,GAAG,WAAW,CAAC;AAEhB;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CA6CxC,CAAC"}