@intlayer/design-system 3.5.6 → 3.5.8

package/dist/Form-OK9zfg6E.js

@@ -0,0 +1,321 @@
+"use client";
+import { Button } from "./components/Button/Button.mjs";
+import { j as jsxRuntimeExports } from "./jsx-runtime-DaNGiM0W.js";
+import { useFormContext } from "react-hook-form";
+import { Input } from "./components/Input/Input.mjs";
+import { InputPassword } from "./components/Input/InputPassword.mjs";
+import { Checkbox } from "./components/Input/Checkbox.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";
+import { Select } from "./components/Select/Select.mjs";
+import { SwitchSelector } from "./components/SwitchSelector/index.mjs";
+import { Form as Form$1 } from "./components/Form/FormBase.mjs";
+import { FormControl } from "./components/Form/FormControl.mjs";
+import { FormDescription } from "./components/Form/FormDescription.mjs";
+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,
+  isRequired,
+  info,
+  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(
+      FormLabelLayout,
+      {
+        isRequired,
+        info,
+        htmlFor,
+        children: label
+      }
+    ),
+    description && /* @__PURE__ */ jsxRuntimeExports.jsx(Form.Description, { children: description })
+  ] }),
+  /* @__PURE__ */ jsxRuntimeExports.jsx(Form.Control, { children }),
+  showErrorMessage && /* @__PURE__ */ jsxRuntimeExports.jsx(Form.Message, { "data-testid": "error-message" })
+] });
+const FormFieldElement = ({
+  field,
+  name,
+  label,
+  Element,
+  isRequired = false,
+  info,
+  description,
+  showErrorMessage = true,
+  ...props
+}) => {
+  const { error } = useFormField();
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    FormItemLayout,
+    {
+      htmlFor: name,
+      label,
+      description,
+      isRequired,
+      info,
+      showErrorMessage,
+      "aria-invalid": !!error,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Element, { "data-testid": "element", id: name, ...field, ...props, children: props.children })
+    }
+  );
+};
+const FormElement = (props) => {
+  const { control } = useFormContext();
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    Form.Field,
+    {
+      control,
+      name: props.name,
+      render: ({ field }) => /* @__PURE__ */ jsxRuntimeExports.jsx(FormFieldElement, { ...props, field })
+    }
+  );
+};
+const InputElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  FormElement,
+  {
+    id: props.name,
+    "data-testid": props.name,
+    Element: Input,
+    ...props
+  }
+);
+const InputPasswordElement = ({
+  autoComplete,
+  ...props
+}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  FormElement,
+  {
+    Element: InputPassword,
+    id: props.name,
+    "data-testid": props.name,
+    autoComplete,
+    minLength: 6,
+    maxLength: 255,
+    ...props
+  }
+);
+const TextAreaElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  FormElement,
+  {
+    Element: TextArea,
+    id: props.name,
+    "data-testid": props.name,
+    ...props
+  }
+);
+const EditableFieldInputElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  FormElement,
+  {
+    id: props.name,
+    "data-testid": props.name,
+    Element: EditableFieldInput,
+    ...props
+  }
+);
+const EditableFieldTextAreaElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  FormElement,
+  {
+    id: props.name,
+    "data-testid": props.name,
+    Element: EditableFieldTextArea,
+    ...props
+  }
+);
+const AutoSizedTextAreaElement = (props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  FormElement,
+  {
+    Element: AutoSizedTextArea,
+    id: props.name,
+    "data-testid": props.name,
+    ...props
+  }
+);
+const CheckboxComponent = forwardRef(
+  ({ inputLabel, ...props }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx(Checkbox, { ref, ...props, label: inputLabel })
+);
+CheckboxComponent.displayName = "CheckboxComponent";
+const CheckboxElement = ({
+  autoComplete,
+  ...props
+}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  FormElement,
+  {
+    Element: CheckboxComponent,
+    id: props.name,
+    "data-testid": props.name,
+    autoComplete,
+    minLength: 6,
+    maxLength: 255,
+    ...props
+  }
+);
+const MultiSelectElement = ({
+  name,
+  description,
+  label,
+  isRequired,
+  info,
+  showErrorMessage,
+  children,
+  ...props
+}) => {
+  const { control } = useFormContext();
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    Form.Field,
+    {
+      control,
+      name,
+      render: ({ field }) => {
+        const { error } = useFormField();
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(
+          FormItemLayout,
+          {
+            htmlFor: name,
+            label,
+            description,
+            isRequired,
+            info,
+            showErrorMessage,
+            "aria-invalid": !!error,
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+              MultiSelect,
+              {
+                onValueChange: field.onChange,
+                values: field.value,
+                ...props,
+                children
+              }
+            )
+          }
+        );
+      }
+    }
+  );
+};
+const SelectElement = ({
+  name,
+  description,
+  label,
+  isRequired,
+  info,
+  showErrorMessage,
+  children,
+  ...props
+}) => {
+  const { control } = useFormContext();
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    Form.Field,
+    {
+      control,
+      name,
+      render: ({ field }) => {
+        const { error } = useFormField();
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(
+          FormItemLayout,
+          {
+            htmlFor: name,
+            label,
+            description,
+            isRequired,
+            info,
+            showErrorMessage,
+            "aria-invalid": !!error,
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Select,
+              {
+                onValueChange: field.onChange,
+                defaultValue: field.value,
+                ...props,
+                children
+              }
+            )
+          }
+        );
+      }
+    }
+  );
+};
+const SwitchSelectorElement = ({
+  name,
+  description,
+  label,
+  isRequired,
+  info,
+  showErrorMessage,
+  children,
+  ...props
+}) => {
+  const { control } = useFormContext();
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    Form.Field,
+    {
+      control,
+      name,
+      render: ({ field }) => {
+        const { error } = useFormField();
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(
+          FormItemLayout,
+          {
+            htmlFor: name,
+            label,
+            description,
+            isRequired,
+            info,
+            showErrorMessage,
+            "aria-invalid": !!error,
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(SwitchSelector, { ...field, ...props, children })
+          }
+        );
+      }
+    }
+  );
+};
+const Form = Form$1;
+Form.Description = FormDescription;
+Form.Control = FormControl;
+Form.Field = FormField;
+Form.Item = FormItem;
+Form.Label = FormLabelLayout;
+Form.Message = FormMessage;
+Form.Element = FormElement;
+Form.Input = InputElement;
+Form.InputPassword = InputPasswordElement;
+Form.Checkbox = CheckboxElement;
+Form.TextArea = TextAreaElement;
+Form.AutoSizedTextArea = AutoSizedTextAreaElement;
+Form.Button = Button;
+Form.Select = SelectElement;
+Form.MultiSelect = MultiSelectElement;
+Form.EditableFieldInput = EditableFieldInputElement;
+Form.EditableFieldTextArea = EditableFieldTextAreaElement;
+Form.SwitchSelector = SwitchSelectorElement;
+export {
+  AutoSizedTextAreaElement as A,
+  CheckboxElement as C,
+  EditableFieldInputElement as E,
+  Form as F,
+  InputElement as I,
+  MultiSelectElement as M,
+  SelectElement as S,
+  TextAreaElement as T,
+  FormElement as a,
+  InputPasswordElement as b,
+  EditableFieldTextAreaElement as c,
+  FormItemLayout as d,
+  SwitchSelectorElement as e
+};
+//# sourceMappingURL=Form-OK9zfg6E.js.map

package/dist/Form-OK9zfg6E.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form-OK9zfg6E.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":["/* eslint-disable import/no-cycle */\nimport 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","/* eslint-disable import/no-cycle */\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 { FormItemLayout, FormItemLayoutProps } 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","/* eslint-disable import/no-cycle */\nimport type { ComponentProps, FC } from 'react';\nimport { Input } from '../../../components/Input';\nimport { 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","/* eslint-disable import/no-cycle */\nimport type { ComponentProps, FC } from 'react';\nimport { InputPassword } from '../../Input';\nimport { 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","/* eslint-disable import/no-cycle */\nimport 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","/* eslint-disable import/no-cycle */\nimport 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","/* eslint-disable import/no-cycle */\n\nimport 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","/* eslint-disable import/no-cycle */\nimport { forwardRef, type ComponentProps, type FC } from 'react';\nimport { Checkbox } from '../../Input';\nimport { 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 = forwardRef<HTMLInputElement, CheckboxComponentProps>(\n  ({ inputLabel, ...props }, ref) => (\n    <Checkbox ref={ref} {...props} label={inputLabel} />\n  )\n);\nCheckboxComponent.displayName = 'CheckboxComponent';\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 import/no-cycle */\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        // eslint-disable-next-line react-hooks/rules-of-hooks, sonarjs/rules-of-hooks\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/* eslint-disable import/no-cycle */\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 import/no-cycle */\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        // eslint-disable-next-line react-hooks/rules-of-hooks\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","/* eslint-disable import/no-cycle */\nimport { 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","FormRoot"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAYO,MAAM,iBAA0C,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,MACGA,kCAAAA,KAAA,KAAK,MAAL,EAAU,WAAU,oBACjB,UAAA;AAAA,GAAA,eAAe,UACfA,kCAAA,KAAC,OAAI,EAAA,WAAU,0BACZ,UAAA;AAAA,IACC,SAAAC,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QAEC,UAAA;AAAA,MAAA;AAAA,IACH;AAAA,IAED,eAAeA,kCAAA,IAAC,KAAK,aAAL,EAAkB,UAAY,YAAA,CAAA;AAAA,EAAA,GACjD;AAAA,EAEDA,kCAAAA,IAAA,KAAK,SAAL,EAAc,SAAS,CAAA;AAAA,EAEvB,oBAAqBA,kCAAA,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,IAAI,aAAa;AAG7B,SAAAA,kCAAA;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,kCAAAA,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,IAAI,eAAe;AAGjC,SAAAA,kCAAA;AAAA,IAAC,KAAK;AAAA,IAAL;AAAA,MACC;AAAA,MACA,MAAM,MAAM;AAAA,MACZ,QAAQ,CAAC,EAAE,YAAaA,kCAAAA,IAAA,kBAAA,EAAkB,GAAG,OAAO,MAAc,CAAA;AAAA,IAAA;AAAA,EACpE;AAEJ;ACnEa,MAAA,eAAsC,CAAC,UAClDA,kCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IACnB,SAAS;AAAA,IACR,GAAG;AAAA,EAAA;AACN;ACFK,MAAM,uBAAsD,CAAC;AAAA,EAClE;AAAA,EACA,GAAG;AACL,MACEA,kCAAA;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;ACbW,MAAA,kBAA6C,CAAC,UACzDA,kCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAAS;AAAA,IACT,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IAClB,GAAG;AAAA,EAAA;AACN;ACFW,MAAA,4BAA4B,CACvC,UAEAA,kCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IACnB,SAAS;AAAA,IACR,GAAG;AAAA,EAAA;AACN;ACPW,MAAA,+BAA+B,CAC1C,UAEAA,kCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IACnB,SAAS;AAAA,IACR,GAAG;AAAA,EAAA;AACN;ACdW,MAAA,2BAA+D,CAC1E,UAEAA,kCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAAS;AAAA,IACT,IAAI,MAAM;AAAA,IACV,eAAa,MAAM;AAAA,IAClB,GAAG;AAAA,EAAA;AACN;ACJF,MAAM,oBAAoB;AAAA,EACxB,CAAC,EAAE,YAAY,GAAG,MAAM,GAAG,QACzBA,kCAAAA,IAAC,UAAS,EAAA,KAAW,GAAG,OAAO,OAAO,WAAY,CAAA;AAEtD;AACA,kBAAkB,cAAc;AAEzB,MAAM,kBAA4C,CAAC;AAAA,EACxD;AAAA,EACA,GAAG;AACL,MACEA,kCAAA;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;ACdK,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,IAAI,eAAe;AAGjC,SAAAA,kCAAA;AAAA,IAAC,KAAK;AAAA,IAAL;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ,CAAC,EAAE,YAAY;AAEf,cAAA,EAAE,MAAM,IAAI,aAAa;AAG7B,eAAAA,kCAAA;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,kCAAA;AAAA,cAAC;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;AC5CO,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,IAAI,eAAe;AAGjC,SAAAA,kCAAA;AAAA,IAAC,KAAK;AAAA,IAAL;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ,CAAC,EAAE,YAAY;AACf,cAAA,EAAE,MAAM,IAAI,aAAa;AAG7B,eAAAA,kCAAA;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,kCAAA;AAAA,cAAC;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;ACvCO,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,IAAI,eAAe;AAGjC,SAAAA,kCAAA;AAAA,IAAC,KAAK;AAAA,IAAL;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ,CAAC,EAAE,YAAY;AAEf,cAAA,EAAE,MAAM,IAAI,aAAa;AAG7B,eAAAA,kCAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,gBAAc,CAAC,CAAC;AAAA,YAEhB,gDAAC,gBAAgB,EAAA,GAAG,OAAQ,GAAG,OAC5B,SACH,CAAA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ;AAAA,EACF;AAEJ;ACGO,MAAM,OAAOC;AACpB,KAAK,cAAc;AACnB,KAAK,UAAU;AACf,KAAK,QAAQ;AACb,KAAK,OAAO;AACZ,KAAK,QAAQ;AACb,KAAK,UAAU;AACf,KAAK,UAAU;AACf,KAAK,QAAQ;AACb,KAAK,gBAAgB;AACrB,KAAK,WAAW;AAChB,KAAK,WAAW;AAChB,KAAK,oBAAoB;AACzB,KAAK,SAAS;AACd,KAAK,SAAS;AACd,KAAK,cAAc;AACnB,KAAK,qBAAqB;AAC1B,KAAK,wBAAwB;AAC7B,KAAK,iBAAiB;"}

package/dist/components/Accordion/Accordion.cjs

@@ -21,20 +21,7 @@ const Accordion = ({
       setIsOpen(isOpenDefault);
     }
   }, [isOpenDefault]);
-  const Icon = require$$0.useCallback(
-    () => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-      lucideReact.ChevronDown,
-      {
-        size: 16,
-        className: utils_cn.cn(
-          "transform transition-transform duration-500 ease-in-out",
-          isOpen ? "rotate-0" : "rotate-180"
-        )
-      }
-    ),
-    [isOpen]
-  );
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment, { children: [
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs("div", { children: [
     /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
       components_Button_Button.Button,
       {
@@ -45,7 +32,12 @@ const Accordion = ({
           onClick?.(e);
         },
         isFullWidth: true,
-        IconRight: Icon,
+        className: "flex items-center justify-between gap-2 bg-red-300",
+        IconRight: lucideReact.ChevronDown,
+        iconClassName: utils_cn.cn(
+          "transform transition-transform duration-500 ease-in-out",
+          isOpen ? "rotate-0" : "-rotate-180"
+        ),
         ...props,
         children: header
       }

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 {\n  useCallback,\n  useEffect,\n  useState,\n  type FC,\n  type ReactNode,\n} from 'react';\nimport { cn } from '../../utils/cn';\nimport { Button, ButtonProps } from '../Button';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\n\ntype AccordionProps = {\n  identifier: string;\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  const Icon = useCallback(\n    () => (\n      <ChevronDown\n        size={16}\n        className={cn(\n          'transform transition-transform duration-500 ease-in-out',\n          isOpen ? 'rotate-0' : 'rotate-180'\n        )}\n      />\n    ),\n    [isOpen]\n  );\n\n  return (\n    <>\n      <Button\n        variant=\"hoverable\"\n        color=\"text\"\n        onClick={(e) => {\n          setIsOpen((prevIsOpen) => !prevIsOpen);\n          onClick?.(e);\n        }}\n        isFullWidth\n        IconRight={Icon}\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    </>\n  );\n};\n"],"names":["useState","useEffect","useCallback","jsx","ChevronDown","cn","jsxs","Fragment","Button","MaxHeightSmoother"],"mappings":";;;;;;;;;AAmCO,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;AAElB,QAAM,OAAOC,WAAA;AAAA,IACX,MACEC,2BAAA,kBAAA;AAAA,MAACC,YAAA;AAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,WAAWC,SAAA;AAAA,UACT;AAAA,UACA,SAAS,aAAa;AAAA,QAAA;AAAA,MACxB;AAAA,IACF;AAAA,IAEF,CAAC,MAAM;AAAA,EACT;AAEA,SAEIC,2BAAA,kBAAA,KAAAC,uCAAA,EAAA,UAAA;AAAA,IAAAJ,2BAAA,kBAAA;AAAA,MAACK,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,WAAW;AAAA,QACV,GAAG;AAAA,QAEH,UAAA;AAAA,MAAA;AAAA,IACH;AAAA,IAEAL,2BAAA,kBAAA;AAAA,MAACM,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 { 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>\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","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;AAElB,2DACG,OACC,EAAA,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;;"}

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

@@ -1,7 +1,6 @@
 import { FC, ReactNode } from 'react';
 import { ButtonProps } from '../Button';
 type AccordionProps = {
-    identifier: string;
     header: ReactNode;
     children: ReactNode;
     isOpen?: boolean;

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,EAIL,KAAK,EAAE,EACP,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAU,WAAW,EAAE,MAAM,WAAW,CAAC;AAGhD,KAAK,cAAc,GAAG;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,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,CAqDxC,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,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"}

package/dist/components/Accordion/Accordion.mjs

@@ -1,7 +1,7 @@
 "use client";
 import { j as jsxRuntimeExports } from "../../jsx-runtime-DaNGiM0W.js";
 import { ChevronDown } from "lucide-react";
-import { useState, useEffect, useCallback } from "react";
+import { useState, useEffect } from "react";
 import { cn } from "../../utils/cn.mjs";
 import { Button } from "../Button/Button.mjs";
 import { MaxHeightSmoother } from "../MaxHeightSmoother/index.mjs";
@@ -19,20 +19,7 @@ const Accordion = ({
       setIsOpen(isOpenDefault);
     }
   }, [isOpenDefault]);
-  const Icon = useCallback(
-    () => /* @__PURE__ */ jsxRuntimeExports.jsx(
-      ChevronDown,
-      {
-        size: 16,
-        className: cn(
-          "transform transition-transform duration-500 ease-in-out",
-          isOpen ? "rotate-0" : "rotate-180"
-        )
-      }
-    ),
-    [isOpen]
-  );
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(
       Button,
       {
@@ -43,7 +30,12 @@ const Accordion = ({
           onClick?.(e);
         },
         isFullWidth: true,
-        IconRight: Icon,
+        className: "flex items-center justify-between gap-2 bg-red-300",
+        IconRight: ChevronDown,
+        iconClassName: cn(
+          "transform transition-transform duration-500 ease-in-out",
+          isOpen ? "rotate-0" : "-rotate-180"
+        ),
         ...props,
         children: header
       }

package/dist/components/Accordion/Accordion.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.mjs","sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\nimport { ChevronDown } from 'lucide-react';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  type FC,\n  type ReactNode,\n} from 'react';\nimport { cn } from '../../utils/cn';\nimport { Button, ButtonProps } from '../Button';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\n\ntype AccordionProps = {\n  identifier: string;\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  const Icon = useCallback(\n    () => (\n      <ChevronDown\n        size={16}\n        className={cn(\n          'transform transition-transform duration-500 ease-in-out',\n          isOpen ? 'rotate-0' : 'rotate-180'\n        )}\n      />\n    ),\n    [isOpen]\n  );\n\n  return (\n    <>\n      <Button\n        variant=\"hoverable\"\n        color=\"text\"\n        onClick={(e) => {\n          setIsOpen((prevIsOpen) => !prevIsOpen);\n          onClick?.(e);\n        }}\n        isFullWidth\n        IconRight={Icon}\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    </>\n  );\n};\n"],"names":["jsx","jsxs","Fragment"],"mappings":";;;;;;;AAmCO,MAAM,YAAgC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA,QAAQ,gBAAgB;AAAA,EACxB;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,aAAa;AAClD,QAAM,WAAW,UAAU,SAAY,SAAY,CAAC;AAEpD,YAAU,MAAM;AACd,QAAI,iBAAiB,QAAW;AAC9B,gBAAU,aAAa;AAAA,IAAA;AAAA,EACzB,GACC,CAAC,aAAa,CAAC;AAElB,QAAM,OAAO;AAAA,IACX,MACEA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,WAAW;AAAA,UACT;AAAA,UACA,SAAS,aAAa;AAAA,QAAA;AAAA,MACxB;AAAA,IACF;AAAA,IAEF,CAAC,MAAM;AAAA,EACT;AAEA,SAEIC,kCAAA,KAAAC,4BAAA,EAAA,UAAA;AAAA,IAAAF,kCAAA;AAAA,MAAC;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,WAAW;AAAA,QACV,GAAG;AAAA,QAEH,UAAA;AAAA,MAAA;AAAA,IACH;AAAA,IAEAA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,UAAU,aAAa,QAAQ,SAAY;AAAA,QAC3C;AAAA,QAEC;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;"}
+{"version":3,"file":"Accordion.mjs","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>\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":["jsx"],"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,IAAI,SAAS,aAAa;AAClD,QAAM,WAAW,UAAU,SAAY,SAAY,CAAC;AAEpD,YAAU,MAAM;AACd,QAAI,iBAAiB,QAAW;AAC9B,gBAAU,aAAa;AAAA,IAAA;AAAA,EACzB,GACC,CAAC,aAAa,CAAC;AAElB,gDACG,OACC,EAAA,UAAA;AAAA,IAAAA,kCAAA;AAAA,MAAC;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,WAAW;AAAA,QACX,eAAe;AAAA,UACb;AAAA,UACA,SAAS,aAAa;AAAA,QACxB;AAAA,QACC,GAAG;AAAA,QAEH,UAAA;AAAA,MAAA;AAAA,IACH;AAAA,IAEAA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,UAAU,aAAa,QAAQ,SAAY;AAAA,QAC3C;AAAA,QAEC;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;"}

package/dist/components/Auth/ChangePasswordForm/ChangePasswordForm.cjs

@@ -4,7 +4,7 @@ const jsxRuntime = require("../../../jsx-runtime-XHKiWCTo.cjs");
 const reactIntlayer = require("react-intlayer");
 const components_Form_FormBase = require("../../Form/FormBase.cjs");
 require("../../Form/FormField.cjs");
-const components_Form_layout_FormItemLayout = require("../../../Form-BDcoNTLV.cjs");
+const components_Form_layout_FormItemLayout = require("../../../Form-7BqwvjVI.cjs");
 const components_Auth_useUser_index = require("../useUser/index.cjs");
 const components_Auth_ChangePasswordForm_changePasswordForm_content = require("./changePasswordForm.content.cjs");
 const components_Auth_ChangePasswordForm_useChangePasswordSchema = require("./useChangePasswordSchema.cjs");

package/dist/components/Auth/ChangePasswordForm/ChangePasswordForm.mjs

@@ -2,7 +2,7 @@ import { j as jsxRuntimeExports } from "../../../jsx-runtime-DaNGiM0W.js";
 import { useDictionary } from "react-intlayer";
 import { useForm } from "../../Form/FormBase.mjs";
 import "../../Form/FormField.mjs";
-import { F as Form } from "../../../Form-DhsgC7kB.js";
+import { F as Form } from "../../../Form-OK9zfg6E.js";
 import { useUser } from "../useUser/index.mjs";
 import { changePasswordContent } from "./changePasswordForm.content.mjs";
 import { useChangePasswordSchema } from "./useChangePasswordSchema.mjs";

package/dist/components/Auth/ChangePasswordForm/useChangePasswordSchema.d.ts

@@ -4,20 +4,20 @@ export declare const useChangePasswordSchema: () => z.ZodEffects<z.ZodObject<{
     newPassword: z.ZodString;
     newPasswordConfirmation: z.ZodString;
 }, "strip", z.ZodTypeAny, {
-    newPassword: string;
     currentPassword: string;
+    newPassword: string;
     newPasswordConfirmation: string;
 }, {
-    newPassword: string;
     currentPassword: string;
+    newPassword: string;
     newPasswordConfirmation: string;
 }>, {
-    newPassword: string;
     currentPassword: string;
+    newPassword: string;
     newPasswordConfirmation: string;
 }, {
-    newPassword: string;
     currentPassword: string;
+    newPassword: string;
     newPasswordConfirmation: string;
 }>;
 export type ChangePassword = z.infer<ReturnType<typeof useChangePasswordSchema>>;

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("../../../jsx-runtime-XHKiWCTo.cjs");
 const reactIntlayer = require("react-intlayer");
-const libs_intlayerApi_index = require("../../../libs/intlayer-api/index.cjs");
+const index = require("../../../index-DFc7og1d.cjs");
 const components_Button_Button = require("../../Button/Button.cjs");
 const components_Auth_ExternalsLoginButtons_assets_GithubLogo = require("./assets/GithubLogo.cjs");
 const components_Auth_ExternalsLoginButtons_assets_GoogleLogo = require("./assets/GoogleLogo.cjs");
@@ -12,7 +12,7 @@ const GitHubLoginButton = () => {
   const externalsLoginButtons = reactIntlayer.useDictionary(components_Auth_ExternalsLoginButtons_externalsLoginButtons_content.externalsLoginButtonsContent);
   const loginWithGitHub = () => {
     const origin = window.location.href;
-    const authURL = libs_intlayerApi_index.intlayerAPI.auth.getLoginWithGitHubURL({ origin });
+    const authURL = index.intlayerAPI.auth.getLoginWithGitHubURL({ origin });
     window.location.href = authURL;
   };
   return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
@@ -30,7 +30,7 @@ const GoogleLoginButton = () => {
   const externalsLoginButtons = reactIntlayer.useDictionary(components_Auth_ExternalsLoginButtons_externalsLoginButtons_content.externalsLoginButtonsContent);
   const loginWithGoogle = () => {
     const origin = window.location.href;
-    const authURL = libs_intlayerApi_index.intlayerAPI.auth.getLoginWithGoogleURL({ origin });
+    const authURL = index.intlayerAPI.auth.getLoginWithGoogleURL({ origin });
     window.location.href = authURL;
   };
   return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(

package/dist/components/Auth/ExternalsLoginButtons/ExternalsLoginButtons.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ExternalsLoginButtons.cjs","sources":["../../../../src/components/Auth/ExternalsLoginButtons/ExternalsLoginButtons.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\n// @ts-ignore react-intlayer not build yet\nimport { useDictionary } from 'react-intlayer';\nimport { intlayerAPI } from '../../../libs/intlayer-api';\nimport { Button } from '../../Button';\nimport { GithubLogo } from './assets/GithubLogo';\nimport { GoogleLogo } from './assets/GoogleLogo';\nimport { externalsLoginButtonsContent } from './externalsLoginButtons.content';\n\nexport const GitHubLoginButton: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n  const loginWithGitHub = () => {\n    const origin = window.location.href;\n\n    const authURL = intlayerAPI.auth.getLoginWithGitHubURL({ origin });\n\n    window.location.href = authURL;\n  };\n\n  return (\n    <Button\n      label={externalsLoginButtons.github.label}\n      Icon={GithubLogo}\n      onClick={loginWithGitHub}\n      color=\"text\"\n    >\n      {externalsLoginButtons.github.label}\n    </Button>\n  );\n};\n\nexport const GoogleLoginButton: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n  const loginWithGoogle = () => {\n    const origin = window.location.href;\n\n    const authURL = intlayerAPI.auth.getLoginWithGoogleURL({ origin });\n\n    window.location.href = authURL;\n  };\n\n  return (\n    <Button\n      className=\"bg-red-400 hover:bg-red-500 dark:hover:bg-red-300\"\n      label={externalsLoginButtons.google.label}\n      Icon={GoogleLogo}\n      onClick={loginWithGoogle}\n      color=\"custom\"\n    >\n      {externalsLoginButtons.google.label}\n    </Button>\n  );\n};\n\nexport const ExternalsLoginButtons: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n\n  return (\n    <div className=\"relative flex flex-col justify-center gap-y-3\">\n      <div className=\"mb-3 flex w-full items-center gap-3 text-center text-base\">\n        <div className=\"bg-neutral dark:bg-neutral-dark h-px w-full\" />\n        <div className=\"text-neutral dark:text-neutral-dark\">\n          {externalsLoginButtons.span}\n        </div>\n        <div className=\"bg-neutral dark:bg-neutral-dark h-px w-full\" />\n      </div>\n      <GoogleLoginButton />\n      <GitHubLoginButton />\n    </div>\n  );\n};\n"],"names":["useDictionary","externalsLoginButtonsContent","intlayerAPI","jsx","Button","GithubLogo","GoogleLogo","jsxs"],"mappings":";;;;;;;;;;AAWO,MAAM,oBAAwB,MAAM;AACnC,QAAA,wBAAwBA,4BAAcC,gGAA4B;AACxE,QAAM,kBAAkB,MAAM;AACtB,UAAA,SAAS,OAAO,SAAS;AAE/B,UAAM,UAAUC,uBAAAA,YAAY,KAAK,sBAAsB,EAAE,QAAQ;AAEjE,WAAO,SAAS,OAAO;AAAA,EACzB;AAGE,SAAAC,2BAAA,kBAAA;AAAA,IAACC,yBAAA;AAAA,IAAA;AAAA,MACC,OAAO,sBAAsB,OAAO;AAAA,MACpC,MAAMC,wDAAA;AAAA,MACN,SAAS;AAAA,MACT,OAAM;AAAA,MAEL,gCAAsB,OAAO;AAAA,IAAA;AAAA,EAChC;AAEJ;AAEO,MAAM,oBAAwB,MAAM;AACnC,QAAA,wBAAwBL,4BAAcC,gGAA4B;AACxE,QAAM,kBAAkB,MAAM;AACtB,UAAA,SAAS,OAAO,SAAS;AAE/B,UAAM,UAAUC,uBAAAA,YAAY,KAAK,sBAAsB,EAAE,QAAQ;AAEjE,WAAO,SAAS,OAAO;AAAA,EACzB;AAGE,SAAAC,2BAAA,kBAAA;AAAA,IAACC,yBAAA;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO,sBAAsB,OAAO;AAAA,MACpC,MAAME,wDAAA;AAAA,MACN,SAAS;AAAA,MACT,OAAM;AAAA,MAEL,gCAAsB,OAAO;AAAA,IAAA;AAAA,EAChC;AAEJ;AAEO,MAAM,wBAA4B,MAAM;AACvC,QAAA,wBAAwBN,4BAAcC,gGAA4B;AAGtE,SAAAM,2BAAA,kBAAA,KAAC,OAAI,EAAA,WAAU,iDACb,UAAA;AAAA,IAACA,2BAAAA,kBAAAA,KAAA,OAAA,EAAI,WAAU,6DACb,UAAA;AAAA,MAACJ,2BAAAA,kBAAAA,IAAA,OAAA,EAAI,WAAU,8CAA8C,CAAA;AAAA,MAC5DA,2BAAA,kBAAA,IAAA,OAAA,EAAI,WAAU,uCACZ,gCAAsB,MACzB;AAAA,MACAA,2BAAAA,kBAAAA,IAAC,OAAI,EAAA,WAAU,8CAA8C,CAAA;AAAA,IAAA,GAC/D;AAAA,qDACC,mBAAkB,EAAA;AAAA,qDAClB,mBAAkB,CAAA,CAAA;AAAA,EAAA,GACrB;AAEJ;;;;"}
+{"version":3,"file":"ExternalsLoginButtons.cjs","sources":["../../../../src/components/Auth/ExternalsLoginButtons/ExternalsLoginButtons.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\n// @ts-ignore react-intlayer not build yet\nimport { useDictionary } from 'react-intlayer';\nimport { intlayerAPI } from '../../../../../api/src';\nimport { Button } from '../../Button';\nimport { GithubLogo } from './assets/GithubLogo';\nimport { GoogleLogo } from './assets/GoogleLogo';\nimport { externalsLoginButtonsContent } from './externalsLoginButtons.content';\n\nexport const GitHubLoginButton: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n  const loginWithGitHub = () => {\n    const origin = window.location.href;\n\n    const authURL = intlayerAPI.auth.getLoginWithGitHubURL({ origin });\n\n    window.location.href = authURL;\n  };\n\n  return (\n    <Button\n      label={externalsLoginButtons.github.label}\n      Icon={GithubLogo}\n      onClick={loginWithGitHub}\n      color=\"text\"\n    >\n      {externalsLoginButtons.github.label}\n    </Button>\n  );\n};\n\nexport const GoogleLoginButton: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n  const loginWithGoogle = () => {\n    const origin = window.location.href;\n\n    const authURL = intlayerAPI.auth.getLoginWithGoogleURL({ origin });\n\n    window.location.href = authURL;\n  };\n\n  return (\n    <Button\n      className=\"bg-red-400 hover:bg-red-500 dark:hover:bg-red-300\"\n      label={externalsLoginButtons.google.label}\n      Icon={GoogleLogo}\n      onClick={loginWithGoogle}\n      color=\"custom\"\n    >\n      {externalsLoginButtons.google.label}\n    </Button>\n  );\n};\n\nexport const ExternalsLoginButtons: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n\n  return (\n    <div className=\"relative flex flex-col justify-center gap-y-3\">\n      <div className=\"mb-3 flex w-full items-center gap-3 text-center text-base\">\n        <div className=\"bg-neutral dark:bg-neutral-dark h-px w-full\" />\n        <div className=\"text-neutral dark:text-neutral-dark\">\n          {externalsLoginButtons.span}\n        </div>\n        <div className=\"bg-neutral dark:bg-neutral-dark h-px w-full\" />\n      </div>\n      <GoogleLoginButton />\n      <GitHubLoginButton />\n    </div>\n  );\n};\n"],"names":["useDictionary","externalsLoginButtonsContent","intlayerAPI","jsx","Button","GithubLogo","GoogleLogo","jsxs"],"mappings":";;;;;;;;;;AAWO,MAAM,oBAAwB,MAAM;AACnC,QAAA,wBAAwBA,4BAAcC,gGAA4B;AACxE,QAAM,kBAAkB,MAAM;AACtB,UAAA,SAAS,OAAO,SAAS;AAE/B,UAAM,UAAUC,MAAAA,YAAY,KAAK,sBAAsB,EAAE,QAAQ;AAEjE,WAAO,SAAS,OAAO;AAAA,EACzB;AAGE,SAAAC,2BAAA,kBAAA;AAAA,IAACC,yBAAA;AAAA,IAAA;AAAA,MACC,OAAO,sBAAsB,OAAO;AAAA,MACpC,MAAMC,wDAAA;AAAA,MACN,SAAS;AAAA,MACT,OAAM;AAAA,MAEL,gCAAsB,OAAO;AAAA,IAAA;AAAA,EAChC;AAEJ;AAEO,MAAM,oBAAwB,MAAM;AACnC,QAAA,wBAAwBL,4BAAcC,gGAA4B;AACxE,QAAM,kBAAkB,MAAM;AACtB,UAAA,SAAS,OAAO,SAAS;AAE/B,UAAM,UAAUC,MAAAA,YAAY,KAAK,sBAAsB,EAAE,QAAQ;AAEjE,WAAO,SAAS,OAAO;AAAA,EACzB;AAGE,SAAAC,2BAAA,kBAAA;AAAA,IAACC,yBAAA;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO,sBAAsB,OAAO;AAAA,MACpC,MAAME,wDAAA;AAAA,MACN,SAAS;AAAA,MACT,OAAM;AAAA,MAEL,gCAAsB,OAAO;AAAA,IAAA;AAAA,EAChC;AAEJ;AAEO,MAAM,wBAA4B,MAAM;AACvC,QAAA,wBAAwBN,4BAAcC,gGAA4B;AAGtE,SAAAM,2BAAA,kBAAA,KAAC,OAAI,EAAA,WAAU,iDACb,UAAA;AAAA,IAACA,2BAAAA,kBAAAA,KAAA,OAAA,EAAI,WAAU,6DACb,UAAA;AAAA,MAACJ,2BAAAA,kBAAAA,IAAA,OAAA,EAAI,WAAU,8CAA8C,CAAA;AAAA,MAC5DA,2BAAA,kBAAA,IAAA,OAAA,EAAI,WAAU,uCACZ,gCAAsB,MACzB;AAAA,MACAA,2BAAAA,kBAAAA,IAAC,OAAI,EAAA,WAAU,8CAA8C,CAAA;AAAA,IAAA,GAC/D;AAAA,qDACC,mBAAkB,EAAA;AAAA,qDAClB,mBAAkB,CAAA,CAAA;AAAA,EAAA,GACrB;AAEJ;;;;"}

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

@@ -1,7 +1,7 @@
 "use client";
 import { j as jsxRuntimeExports } from "../../../jsx-runtime-DaNGiM0W.js";
 import { useDictionary } from "react-intlayer";
-import { intlayerAPI } from "../../../libs/intlayer-api/index.mjs";
+import { i as intlayerAPI } from "../../../index-DcWYZrJW.js";
 import { Button } from "../../Button/Button.mjs";
 import { GithubLogo } from "./assets/GithubLogo.mjs";
 import { GoogleLogo } from "./assets/GoogleLogo.mjs";

package/dist/components/Auth/ExternalsLoginButtons/ExternalsLoginButtons.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ExternalsLoginButtons.mjs","sources":["../../../../src/components/Auth/ExternalsLoginButtons/ExternalsLoginButtons.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\n// @ts-ignore react-intlayer not build yet\nimport { useDictionary } from 'react-intlayer';\nimport { intlayerAPI } from '../../../libs/intlayer-api';\nimport { Button } from '../../Button';\nimport { GithubLogo } from './assets/GithubLogo';\nimport { GoogleLogo } from './assets/GoogleLogo';\nimport { externalsLoginButtonsContent } from './externalsLoginButtons.content';\n\nexport const GitHubLoginButton: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n  const loginWithGitHub = () => {\n    const origin = window.location.href;\n\n    const authURL = intlayerAPI.auth.getLoginWithGitHubURL({ origin });\n\n    window.location.href = authURL;\n  };\n\n  return (\n    <Button\n      label={externalsLoginButtons.github.label}\n      Icon={GithubLogo}\n      onClick={loginWithGitHub}\n      color=\"text\"\n    >\n      {externalsLoginButtons.github.label}\n    </Button>\n  );\n};\n\nexport const GoogleLoginButton: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n  const loginWithGoogle = () => {\n    const origin = window.location.href;\n\n    const authURL = intlayerAPI.auth.getLoginWithGoogleURL({ origin });\n\n    window.location.href = authURL;\n  };\n\n  return (\n    <Button\n      className=\"bg-red-400 hover:bg-red-500 dark:hover:bg-red-300\"\n      label={externalsLoginButtons.google.label}\n      Icon={GoogleLogo}\n      onClick={loginWithGoogle}\n      color=\"custom\"\n    >\n      {externalsLoginButtons.google.label}\n    </Button>\n  );\n};\n\nexport const ExternalsLoginButtons: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n\n  return (\n    <div className=\"relative flex flex-col justify-center gap-y-3\">\n      <div className=\"mb-3 flex w-full items-center gap-3 text-center text-base\">\n        <div className=\"bg-neutral dark:bg-neutral-dark h-px w-full\" />\n        <div className=\"text-neutral dark:text-neutral-dark\">\n          {externalsLoginButtons.span}\n        </div>\n        <div className=\"bg-neutral dark:bg-neutral-dark h-px w-full\" />\n      </div>\n      <GoogleLoginButton />\n      <GitHubLoginButton />\n    </div>\n  );\n};\n"],"names":["jsx","jsxs"],"mappings":";;;;;;;;AAWO,MAAM,oBAAwB,MAAM;AACnC,QAAA,wBAAwB,cAAc,4BAA4B;AACxE,QAAM,kBAAkB,MAAM;AACtB,UAAA,SAAS,OAAO,SAAS;AAE/B,UAAM,UAAU,YAAY,KAAK,sBAAsB,EAAE,QAAQ;AAEjE,WAAO,SAAS,OAAO;AAAA,EACzB;AAGE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO,sBAAsB,OAAO;AAAA,MACpC,MAAM;AAAA,MACN,SAAS;AAAA,MACT,OAAM;AAAA,MAEL,gCAAsB,OAAO;AAAA,IAAA;AAAA,EAChC;AAEJ;AAEO,MAAM,oBAAwB,MAAM;AACnC,QAAA,wBAAwB,cAAc,4BAA4B;AACxE,QAAM,kBAAkB,MAAM;AACtB,UAAA,SAAS,OAAO,SAAS;AAE/B,UAAM,UAAU,YAAY,KAAK,sBAAsB,EAAE,QAAQ;AAEjE,WAAO,SAAS,OAAO;AAAA,EACzB;AAGE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO,sBAAsB,OAAO;AAAA,MACpC,MAAM;AAAA,MACN,SAAS;AAAA,MACT,OAAM;AAAA,MAEL,gCAAsB,OAAO;AAAA,IAAA;AAAA,EAChC;AAEJ;AAEO,MAAM,wBAA4B,MAAM;AACvC,QAAA,wBAAwB,cAAc,4BAA4B;AAGtE,SAAAC,kCAAA,KAAC,OAAI,EAAA,WAAU,iDACb,UAAA;AAAA,IAACA,kCAAAA,KAAA,OAAA,EAAI,WAAU,6DACb,UAAA;AAAA,MAACD,kCAAAA,IAAA,OAAA,EAAI,WAAU,8CAA8C,CAAA;AAAA,MAC5DA,kCAAA,IAAA,OAAA,EAAI,WAAU,uCACZ,gCAAsB,MACzB;AAAA,MACAA,kCAAAA,IAAC,OAAI,EAAA,WAAU,8CAA8C,CAAA;AAAA,IAAA,GAC/D;AAAA,0CACC,mBAAkB,EAAA;AAAA,0CAClB,mBAAkB,CAAA,CAAA;AAAA,EAAA,GACrB;AAEJ;"}
+{"version":3,"file":"ExternalsLoginButtons.mjs","sources":["../../../../src/components/Auth/ExternalsLoginButtons/ExternalsLoginButtons.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\n// @ts-ignore react-intlayer not build yet\nimport { useDictionary } from 'react-intlayer';\nimport { intlayerAPI } from '../../../../../api/src';\nimport { Button } from '../../Button';\nimport { GithubLogo } from './assets/GithubLogo';\nimport { GoogleLogo } from './assets/GoogleLogo';\nimport { externalsLoginButtonsContent } from './externalsLoginButtons.content';\n\nexport const GitHubLoginButton: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n  const loginWithGitHub = () => {\n    const origin = window.location.href;\n\n    const authURL = intlayerAPI.auth.getLoginWithGitHubURL({ origin });\n\n    window.location.href = authURL;\n  };\n\n  return (\n    <Button\n      label={externalsLoginButtons.github.label}\n      Icon={GithubLogo}\n      onClick={loginWithGitHub}\n      color=\"text\"\n    >\n      {externalsLoginButtons.github.label}\n    </Button>\n  );\n};\n\nexport const GoogleLoginButton: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n  const loginWithGoogle = () => {\n    const origin = window.location.href;\n\n    const authURL = intlayerAPI.auth.getLoginWithGoogleURL({ origin });\n\n    window.location.href = authURL;\n  };\n\n  return (\n    <Button\n      className=\"bg-red-400 hover:bg-red-500 dark:hover:bg-red-300\"\n      label={externalsLoginButtons.google.label}\n      Icon={GoogleLogo}\n      onClick={loginWithGoogle}\n      color=\"custom\"\n    >\n      {externalsLoginButtons.google.label}\n    </Button>\n  );\n};\n\nexport const ExternalsLoginButtons: FC = () => {\n  const externalsLoginButtons = useDictionary(externalsLoginButtonsContent);\n\n  return (\n    <div className=\"relative flex flex-col justify-center gap-y-3\">\n      <div className=\"mb-3 flex w-full items-center gap-3 text-center text-base\">\n        <div className=\"bg-neutral dark:bg-neutral-dark h-px w-full\" />\n        <div className=\"text-neutral dark:text-neutral-dark\">\n          {externalsLoginButtons.span}\n        </div>\n        <div className=\"bg-neutral dark:bg-neutral-dark h-px w-full\" />\n      </div>\n      <GoogleLoginButton />\n      <GitHubLoginButton />\n    </div>\n  );\n};\n"],"names":["jsx","jsxs"],"mappings":";;;;;;;;AAWO,MAAM,oBAAwB,MAAM;AACnC,QAAA,wBAAwB,cAAc,4BAA4B;AACxE,QAAM,kBAAkB,MAAM;AACtB,UAAA,SAAS,OAAO,SAAS;AAE/B,UAAM,UAAU,YAAY,KAAK,sBAAsB,EAAE,QAAQ;AAEjE,WAAO,SAAS,OAAO;AAAA,EACzB;AAGE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO,sBAAsB,OAAO;AAAA,MACpC,MAAM;AAAA,MACN,SAAS;AAAA,MACT,OAAM;AAAA,MAEL,gCAAsB,OAAO;AAAA,IAAA;AAAA,EAChC;AAEJ;AAEO,MAAM,oBAAwB,MAAM;AACnC,QAAA,wBAAwB,cAAc,4BAA4B;AACxE,QAAM,kBAAkB,MAAM;AACtB,UAAA,SAAS,OAAO,SAAS;AAE/B,UAAM,UAAU,YAAY,KAAK,sBAAsB,EAAE,QAAQ;AAEjE,WAAO,SAAS,OAAO;AAAA,EACzB;AAGE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO,sBAAsB,OAAO;AAAA,MACpC,MAAM;AAAA,MACN,SAAS;AAAA,MACT,OAAM;AAAA,MAEL,gCAAsB,OAAO;AAAA,IAAA;AAAA,EAChC;AAEJ;AAEO,MAAM,wBAA4B,MAAM;AACvC,QAAA,wBAAwB,cAAc,4BAA4B;AAGtE,SAAAC,kCAAA,KAAC,OAAI,EAAA,WAAU,iDACb,UAAA;AAAA,IAACA,kCAAAA,KAAA,OAAA,EAAI,WAAU,6DACb,UAAA;AAAA,MAACD,kCAAAA,IAAA,OAAA,EAAI,WAAU,8CAA8C,CAAA;AAAA,MAC5DA,kCAAA,IAAA,OAAA,EAAI,WAAU,uCACZ,gCAAsB,MACzB;AAAA,MACAA,kCAAAA,IAAC,OAAI,EAAA,WAAU,8CAA8C,CAAA;AAAA,IAAA,GAC/D;AAAA,0CACC,mBAAkB,EAAA;AAAA,0CAClB,mBAAkB,CAAA,CAAA;AAAA,EAAA,GACrB;AAEJ;"}

package/dist/components/Auth/ResetPasswordForm/ResetPasswordForm.cjs

@@ -6,7 +6,7 @@ const require$$0 = require("react");
 const reactIntlayer = require("react-intlayer");
 const components_Form_FormBase = require("../../Form/FormBase.cjs");
 require("../../Form/FormField.cjs");
-const components_Form_layout_FormItemLayout = require("../../../Form-BDcoNTLV.cjs");
+const components_Form_layout_FormItemLayout = require("../../../Form-7BqwvjVI.cjs");
 const components_Auth_ResetPasswordForm_resetPasswordContent_content = require("./resetPasswordContent.content.cjs");
 const components_Auth_ResetPasswordForm_useResetPasswordSchema = require("./useResetPasswordSchema.cjs");
 const ResetPasswordForm = ({