@intlayer/design-system 8.1.2 → 8.1.3

package/dist/esm/components/Form/elements/MultiselectElement.mjs

@@ -1,50 +1,2 @@
-'use client';
-
-import { MultiSelect } from "../../Select/Multiselect.mjs";
-import { useFormField } from "../FormField.mjs";
-import { FormItemLayout } from "../layout/FormItemLayout.mjs";
-import { Form } from "../Form.mjs";
-import { jsx } from "react/jsx-runtime";
-import { useFormContext } from "react-hook-form";
-
-//#region src/components/Form/elements/MultiselectElement.tsx
-const MultiSelectFieldContent = ({ field, name, label, description, isRequired, info, showErrorMessage, children, ...props }) => {
-	const { error } = useFormField();
-	return /* @__PURE__ */ jsx(FormItemLayout, {
-		htmlFor: name,
-		label,
-		description,
-		isRequired,
-		info,
-		showErrorMessage,
-		"aria-invalid": !!error,
-		children: /* @__PURE__ */ jsx(MultiSelect, {
-			onValueChange: field.onChange,
-			values: field.value,
-			...props,
-			children
-		})
-	});
-};
-const MultiSelectElement = ({ name, description, label, isRequired, info, showErrorMessage, children, ...props }) => {
-	const { control } = useFormContext();
-	return /* @__PURE__ */ jsx(Form.Field, {
-		control,
-		name,
-		render: ({ field }) => /* @__PURE__ */ jsx(MultiSelectFieldContent, {
-			field,
-			name,
-			label,
-			description,
-			isRequired,
-			info,
-			showErrorMessage,
-			...props,
-			children
-		})
-	});
-};
-
-//#endregion
-export { MultiSelectElement };
+"use client";import{MultiSelect as e}from"../../Select/Multiselect.mjs";import{useFormField as t}from"../FormField.mjs";import{FormItemLayout as n}from"../layout/FormItemLayout.mjs";import{Form as r}from"../Form.mjs";import{jsx as i}from"react/jsx-runtime";import{useFormContext as a}from"react-hook-form";const o=({field:r,name:a,label:o,description:s,isRequired:c,info:l,showErrorMessage:u,children:d,...f})=>{let{error:p}=t();return i(n,{htmlFor:a,label:o,description:s,isRequired:c,info:l,showErrorMessage:u,"aria-invalid":!!p,children:i(e,{onValueChange:r.onChange,values:r.value,...f,children:d})})},s=({name:e,description:t,label:n,isRequired:s,info:c,showErrorMessage:l,children:u,...d})=>{let{control:f}=a();return i(r.Field,{control:f,name:e,render:({field:r})=>i(o,{field:r,name:e,label:n,description:t,isRequired:s,info:c,showErrorMessage:l,...d,children:u})})};export{s as MultiSelectElement};
 //# sourceMappingURL=MultiselectElement.mjs.map

package/dist/esm/components/Form/elements/MultiselectElement.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MultiselectElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/MultiselectElement.tsx"],"sourcesContent":["'use client';\n\nimport { MultiSelect } from '@components/Select/Multiselect';\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\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\nconst MultiSelectFieldContent = ({\n  field,\n  name,\n  label,\n  description,\n  isRequired,\n  info,\n  showErrorMessage,\n  children,\n  ...props\n}: Omit<SelectElementsProps, 'control'> & { field: any }) => {\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\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        <MultiSelectFieldContent\n          field={field}\n          name={name}\n          label={label}\n          description={description}\n          isRequired={isRequired}\n          info={info}\n          showErrorMessage={showErrorMessage}\n          {...props}\n        >\n          {children}\n        </MultiSelectFieldContent>\n      )}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;AAsBA,MAAM,2BAA2B,EAC/B,OACA,MACA,OACA,aACA,YACA,MACA,kBACA,UACA,GAAG,YACwD;CAC3D,MAAM,EAAE,UAAU,cAAc;AAEhC,QACE,oBAAC;EACC,SAAS;EACF;EACM;EACD;EACN;EACY;EAClB,gBAAc,CAAC,CAAC;YAEhB,oBAAC;GACC,eAAe,MAAM;GACrB,QAAQ,MAAM;GACd,GAAI;GAEH;IACW;GACC;;AAIrB,MAAa,sBAAsB,EACjC,MACA,aACA,OACA,YACA,MACA,kBACA,UACA,GAAG,YACsB;CACzB,MAAM,EAAE,YAAY,gBAAgB;AAEpC,QACE,oBAAC,KAAK;EACK;EACH;EACN,SAAS,EAAE,YACT,oBAAC;GACQ;GACD;GACC;GACM;GACD;GACN;GACY;GAClB,GAAI;GAEH;IACuB;GAE5B"}
+{"version":3,"file":"MultiselectElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/MultiselectElement.tsx"],"sourcesContent":["'use client';\n\nimport { MultiSelect } from '@components/Select/Multiselect';\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\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\nconst MultiSelectFieldContent = ({\n  field,\n  name,\n  label,\n  description,\n  isRequired,\n  info,\n  showErrorMessage,\n  children,\n  ...props\n}: Omit<SelectElementsProps, 'control'> & { field: any }) => {\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\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        <MultiSelectFieldContent\n          field={field}\n          name={name}\n          label={label}\n          description={description}\n          isRequired={isRequired}\n          info={info}\n          showErrorMessage={showErrorMessage}\n          {...props}\n        >\n          {children}\n        </MultiSelectFieldContent>\n      )}\n    />\n  );\n};\n"],"mappings":"kTAsBA,MAAM,GAA2B,CAC/B,QACA,OACA,QACA,cACA,aACA,OACA,mBACA,WACA,GAAG,KACwD,CAC3D,GAAM,CAAE,SAAU,GAAc,CAEhC,OACE,EAAC,EAAA,CACC,QAAS,EACF,QACM,cACD,aACN,OACY,mBAClB,eAAc,CAAC,CAAC,WAEhB,EAAC,EAAA,CACC,cAAe,EAAM,SACrB,OAAQ,EAAM,MACd,GAAI,EAEH,YACW,EACC,EAIR,GAAsB,CACjC,OACA,cACA,QACA,aACA,OACA,mBACA,WACA,GAAG,KACsB,CACzB,GAAM,CAAE,WAAY,GAAgB,CAEpC,OACE,EAAC,EAAK,MAAA,CACK,UACH,OACN,QAAS,CAAE,WACT,EAAC,EAAA,CACQ,QACD,OACC,QACM,cACD,aACN,OACY,mBAClB,GAAI,EAEH,YACuB,EAE5B"}

package/dist/esm/components/Form/elements/OTPElement.mjs

@@ -1,109 +1,2 @@
-'use client';
-
-import { InputIndicator, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot } from "../../Input/OTPInput.mjs";
-import { useItemSelector } from "../../../hooks/useItemSelector.mjs";
-import { useFormField } from "../FormField.mjs";
-import { FormItemLayout } from "../layout/FormItemLayout.mjs";
-import { Form } from "../Form.mjs";
-import { useEffect, useRef } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { useFormContext } from "react-hook-form";
-
-//#region src/components/Form/elements/OTPElement.tsx
-const selector = (option) => option?.getAttribute("aria-selected") === "true";
-const OTPFieldContent = ({ field, name, label, description, isRequired, info, showErrorMessage, children, slots = 6, maxLength = 6, ...props }) => {
-	const { error } = useFormField();
-	const optionsRefs = useRef([]);
-	const { choiceIndicatorPosition, calculatePosition } = useItemSelector(optionsRefs, {
-		selector,
-		isHoverable: true
-	});
-	useEffect(() => {
-		calculatePosition();
-	}, []);
-	return /* @__PURE__ */ jsx(FormItemLayout, {
-		htmlFor: name,
-		label,
-		description,
-		isRequired,
-		info,
-		showErrorMessage,
-		"aria-invalid": !!error,
-		children: /* @__PURE__ */ jsx(InputOTP, {
-			onChange: field.onChange,
-			defaultValue: field.value,
-			maxLength,
-			pattern: "^[0-9]+$",
-			onActiveSlotChange: calculatePosition,
-			...props,
-			children: children ?? /* @__PURE__ */ jsxs(Fragment$1, { children: [
-				/* @__PURE__ */ jsxs(InputOTPGroup, { children: [
-					/* @__PURE__ */ jsx(InputOTPSlot, {
-						index: 0,
-						ref: (el) => {
-							optionsRefs.current[0] = el;
-						}
-					}),
-					/* @__PURE__ */ jsx(InputOTPSlot, {
-						index: 1,
-						ref: (el) => {
-							optionsRefs.current[1] = el;
-						}
-					}),
-					/* @__PURE__ */ jsx(InputOTPSlot, {
-						index: 2,
-						ref: (el) => {
-							optionsRefs.current[2] = el;
-						}
-					})
-				] }),
-				/* @__PURE__ */ jsx(InputOTPSeparator, {}),
-				/* @__PURE__ */ jsxs(InputOTPGroup, { children: [
-					/* @__PURE__ */ jsx(InputOTPSlot, {
-						index: 3,
-						ref: (el) => {
-							optionsRefs.current[3] = el;
-						}
-					}),
-					/* @__PURE__ */ jsx(InputOTPSlot, {
-						index: 4,
-						ref: (el) => {
-							optionsRefs.current[4] = el;
-						}
-					}),
-					/* @__PURE__ */ jsx(InputOTPSlot, {
-						index: 5,
-						ref: (el) => {
-							optionsRefs.current[5] = el;
-						}
-					})
-				] }),
-				choiceIndicatorPosition && /* @__PURE__ */ jsx(InputIndicator, { style: choiceIndicatorPosition })
-			] })
-		})
-	});
-};
-const OTPElement = ({ name, description, label, isRequired, info, showErrorMessage, children, slots = 6, maxLength = 6, ...props }) => {
-	const { control } = useFormContext();
-	return /* @__PURE__ */ jsx(Form.Field, {
-		control,
-		name,
-		render: ({ field }) => /* @__PURE__ */ jsx(OTPFieldContent, {
-			field,
-			name,
-			label,
-			description,
-			isRequired,
-			info,
-			showErrorMessage,
-			slots,
-			maxLength,
-			...props,
-			children
-		})
-	});
-};
-
-//#endregion
-export { OTPElement };
+"use client";import{InputIndicator as e,InputOTP as t,InputOTPGroup as n,InputOTPSeparator as r,InputOTPSlot as i}from"../../Input/OTPInput.mjs";import{useItemSelector as a}from"../../../hooks/useItemSelector.mjs";import{useFormField as o}from"../FormField.mjs";import{FormItemLayout as s}from"../layout/FormItemLayout.mjs";import{Form as c}from"../Form.mjs";import{useEffect as l,useRef as u}from"react";import{Fragment as d,jsx as f,jsxs as p}from"react/jsx-runtime";import{useFormContext as m}from"react-hook-form";const h=e=>e?.getAttribute(`aria-selected`)===`true`,g=({field:c,name:m,label:g,description:_,isRequired:v,info:y,showErrorMessage:b,children:x,slots:S=6,maxLength:C=6,...w})=>{let{error:T}=o(),E=u([]),{choiceIndicatorPosition:D,calculatePosition:O}=a(E,{selector:h,isHoverable:!0});return l(()=>{O()},[]),f(s,{htmlFor:m,label:g,description:_,isRequired:v,info:y,showErrorMessage:b,"aria-invalid":!!T,children:f(t,{onChange:c.onChange,defaultValue:c.value,maxLength:C,pattern:`^[0-9]+$`,onActiveSlotChange:O,...w,children:x??p(d,{children:[p(n,{children:[f(i,{index:0,ref:e=>{E.current[0]=e}}),f(i,{index:1,ref:e=>{E.current[1]=e}}),f(i,{index:2,ref:e=>{E.current[2]=e}})]}),f(r,{}),p(n,{children:[f(i,{index:3,ref:e=>{E.current[3]=e}}),f(i,{index:4,ref:e=>{E.current[4]=e}}),f(i,{index:5,ref:e=>{E.current[5]=e}})]}),D&&f(e,{style:D})]})})})},_=({name:e,description:t,label:n,isRequired:r,info:i,showErrorMessage:a,children:o,slots:s=6,maxLength:l=6,...u})=>{let{control:d}=m();return f(c.Field,{control:d,name:e,render:({field:c})=>f(g,{field:c,name:e,label:n,description:t,isRequired:r,info:i,showErrorMessage:a,slots:s,maxLength:l,...u,children:o})})};export{_ as OTPElement};
 //# sourceMappingURL=OTPElement.mjs.map

package/dist/esm/components/Form/elements/OTPElement.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"OTPElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/OTPElement.tsx"],"sourcesContent":["'use client';\n\nimport {\n  InputIndicator,\n  InputOTP,\n  InputOTPGroup,\n  InputOTPSeparator,\n  InputOTPSlot,\n} from '@components/Input/OTPInput';\nimport { useItemSelector } from '@hooks/useItemSelector';\nimport { type ComponentProps, type ReactNode, useEffect, useRef } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype OTPElementsProps = Omit<FormElementProps<typeof InputOTP>, 'Element'> &\n  Omit<ComponentProps<typeof InputOTP>, 'children'> & {\n    name: string;\n    description?: string;\n    placeholder?: string;\n    className?: string;\n    children?: ReactNode;\n    /** Number of OTP slots (default: 6) */\n    slots?: number;\n  };\n\nconst selector = (option: HTMLElement) =>\n  option?.getAttribute('aria-selected') === 'true';\n\nconst OTPFieldContent = ({\n  field,\n  name,\n  label,\n  description,\n  isRequired,\n  info,\n  showErrorMessage,\n  children,\n  slots = 6,\n  maxLength = 6,\n  ...props\n}: Omit<OTPElementsProps, 'control'> & { field: any }) => {\n  const { error } = useFormField();\n\n  const optionsRefs = useRef<HTMLElement[]>([]);\n  const { choiceIndicatorPosition, calculatePosition } = useItemSelector(\n    optionsRefs,\n    {\n      selector,\n      isHoverable: true,\n    }\n  );\n\n  useEffect(() => {\n    calculatePosition();\n  }, []);\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      <InputOTP\n        onChange={field.onChange}\n        defaultValue={field.value}\n        maxLength={maxLength}\n        pattern=\"^[0-9]+$\"\n        onActiveSlotChange={calculatePosition}\n        {...(props as any)}\n      >\n        {children ?? (\n          <>\n            <InputOTPGroup>\n              <InputOTPSlot\n                index={0}\n                ref={(el) => {\n                  optionsRefs.current[0] = el!;\n                }}\n              />\n              <InputOTPSlot\n                index={1}\n                ref={(el) => {\n                  optionsRefs.current[1] = el!;\n                }}\n              />\n              <InputOTPSlot\n                index={2}\n                ref={(el) => {\n                  optionsRefs.current[2] = el!;\n                }}\n              />\n            </InputOTPGroup>\n            <InputOTPSeparator />\n            <InputOTPGroup>\n              <InputOTPSlot\n                index={3}\n                ref={(el) => {\n                  optionsRefs.current[3] = el!;\n                }}\n              />\n              <InputOTPSlot\n                index={4}\n                ref={(el) => {\n                  optionsRefs.current[4] = el!;\n                }}\n              />\n              <InputOTPSlot\n                index={5}\n                ref={(el) => {\n                  optionsRefs.current[5] = el!;\n                }}\n              />\n            </InputOTPGroup>\n            {choiceIndicatorPosition && (\n              <InputIndicator style={choiceIndicatorPosition} />\n            )}\n          </>\n        )}\n      </InputOTP>\n    </FormItemLayout>\n  );\n};\n\nexport const OTPElement = ({\n  name,\n  description,\n  label,\n  isRequired,\n  info,\n  showErrorMessage,\n  children,\n  slots = 6,\n  maxLength = 6,\n  ...props\n}: OTPElementsProps) => {\n  const { control } = useFormContext();\n\n  return (\n    <Form.Field\n      control={control}\n      name={name}\n      render={({ field }) => (\n        <OTPFieldContent\n          field={field}\n          name={name}\n          label={label}\n          description={description}\n          isRequired={isRequired}\n          info={info}\n          showErrorMessage={showErrorMessage}\n          slots={slots}\n          maxLength={maxLength}\n          {...props}\n        >\n          {children}\n        </OTPFieldContent>\n      )}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;;AA4BA,MAAM,YAAY,WAChB,QAAQ,aAAa,gBAAgB,KAAK;AAE5C,MAAM,mBAAmB,EACvB,OACA,MACA,OACA,aACA,YACA,MACA,kBACA,UACA,QAAQ,GACR,YAAY,GACZ,GAAG,YACqD;CACxD,MAAM,EAAE,UAAU,cAAc;CAEhC,MAAM,cAAc,OAAsB,EAAE,CAAC;CAC7C,MAAM,EAAE,yBAAyB,sBAAsB,gBACrD,aACA;EACE;EACA,aAAa;EACd,CACF;AAED,iBAAgB;AACd,qBAAmB;IAClB,EAAE,CAAC;AAEN,QACE,oBAAC;EACC,SAAS;EACF;EACM;EACD;EACN;EACY;EAClB,gBAAc,CAAC,CAAC;YAEhB,oBAAC;GACC,UAAU,MAAM;GAChB,cAAc,MAAM;GACT;GACX,SAAQ;GACR,oBAAoB;GACpB,GAAK;aAEJ,YACC;IACE,qBAAC;KACC,oBAAC;MACC,OAAO;MACP,MAAM,OAAO;AACX,mBAAY,QAAQ,KAAK;;OAE3B;KACF,oBAAC;MACC,OAAO;MACP,MAAM,OAAO;AACX,mBAAY,QAAQ,KAAK;;OAE3B;KACF,oBAAC;MACC,OAAO;MACP,MAAM,OAAO;AACX,mBAAY,QAAQ,KAAK;;OAE3B;QACY;IAChB,oBAAC,sBAAoB;IACrB,qBAAC;KACC,oBAAC;MACC,OAAO;MACP,MAAM,OAAO;AACX,mBAAY,QAAQ,KAAK;;OAE3B;KACF,oBAAC;MACC,OAAO;MACP,MAAM,OAAO;AACX,mBAAY,QAAQ,KAAK;;OAE3B;KACF,oBAAC;MACC,OAAO;MACP,MAAM,OAAO;AACX,mBAAY,QAAQ,KAAK;;OAE3B;QACY;IACf,2BACC,oBAAC,kBAAe,OAAO,0BAA2B;OAEnD;IAEI;GACI;;AAIrB,MAAa,cAAc,EACzB,MACA,aACA,OACA,YACA,MACA,kBACA,UACA,QAAQ,GACR,YAAY,GACZ,GAAG,YACmB;CACtB,MAAM,EAAE,YAAY,gBAAgB;AAEpC,QACE,oBAAC,KAAK;EACK;EACH;EACN,SAAS,EAAE,YACT,oBAAC;GACQ;GACD;GACC;GACM;GACD;GACN;GACY;GACX;GACI;GACX,GAAI;GAEH;IACe;GAEpB"}
+{"version":3,"file":"OTPElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/OTPElement.tsx"],"sourcesContent":["'use client';\n\nimport {\n  InputIndicator,\n  InputOTP,\n  InputOTPGroup,\n  InputOTPSeparator,\n  InputOTPSlot,\n} from '@components/Input/OTPInput';\nimport { useItemSelector } from '@hooks/useItemSelector';\nimport { type ComponentProps, type ReactNode, useEffect, useRef } from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport { Form } from '../Form';\nimport { useFormField } from '../FormField';\nimport { FormItemLayout } from '../layout/FormItemLayout';\nimport type { FormElementProps } from './FormElement';\n\ntype OTPElementsProps = Omit<FormElementProps<typeof InputOTP>, 'Element'> &\n  Omit<ComponentProps<typeof InputOTP>, 'children'> & {\n    name: string;\n    description?: string;\n    placeholder?: string;\n    className?: string;\n    children?: ReactNode;\n    /** Number of OTP slots (default: 6) */\n    slots?: number;\n  };\n\nconst selector = (option: HTMLElement) =>\n  option?.getAttribute('aria-selected') === 'true';\n\nconst OTPFieldContent = ({\n  field,\n  name,\n  label,\n  description,\n  isRequired,\n  info,\n  showErrorMessage,\n  children,\n  slots = 6,\n  maxLength = 6,\n  ...props\n}: Omit<OTPElementsProps, 'control'> & { field: any }) => {\n  const { error } = useFormField();\n\n  const optionsRefs = useRef<HTMLElement[]>([]);\n  const { choiceIndicatorPosition, calculatePosition } = useItemSelector(\n    optionsRefs,\n    {\n      selector,\n      isHoverable: true,\n    }\n  );\n\n  useEffect(() => {\n    calculatePosition();\n  }, []);\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      <InputOTP\n        onChange={field.onChange}\n        defaultValue={field.value}\n        maxLength={maxLength}\n        pattern=\"^[0-9]+$\"\n        onActiveSlotChange={calculatePosition}\n        {...(props as any)}\n      >\n        {children ?? (\n          <>\n            <InputOTPGroup>\n              <InputOTPSlot\n                index={0}\n                ref={(el) => {\n                  optionsRefs.current[0] = el!;\n                }}\n              />\n              <InputOTPSlot\n                index={1}\n                ref={(el) => {\n                  optionsRefs.current[1] = el!;\n                }}\n              />\n              <InputOTPSlot\n                index={2}\n                ref={(el) => {\n                  optionsRefs.current[2] = el!;\n                }}\n              />\n            </InputOTPGroup>\n            <InputOTPSeparator />\n            <InputOTPGroup>\n              <InputOTPSlot\n                index={3}\n                ref={(el) => {\n                  optionsRefs.current[3] = el!;\n                }}\n              />\n              <InputOTPSlot\n                index={4}\n                ref={(el) => {\n                  optionsRefs.current[4] = el!;\n                }}\n              />\n              <InputOTPSlot\n                index={5}\n                ref={(el) => {\n                  optionsRefs.current[5] = el!;\n                }}\n              />\n            </InputOTPGroup>\n            {choiceIndicatorPosition && (\n              <InputIndicator style={choiceIndicatorPosition} />\n            )}\n          </>\n        )}\n      </InputOTP>\n    </FormItemLayout>\n  );\n};\n\nexport const OTPElement = ({\n  name,\n  description,\n  label,\n  isRequired,\n  info,\n  showErrorMessage,\n  children,\n  slots = 6,\n  maxLength = 6,\n  ...props\n}: OTPElementsProps) => {\n  const { control } = useFormContext();\n\n  return (\n    <Form.Field\n      control={control}\n      name={name}\n      render={({ field }) => (\n        <OTPFieldContent\n          field={field}\n          name={name}\n          label={label}\n          description={description}\n          isRequired={isRequired}\n          info={info}\n          showErrorMessage={showErrorMessage}\n          slots={slots}\n          maxLength={maxLength}\n          {...props}\n        >\n          {children}\n        </OTPFieldContent>\n      )}\n    />\n  );\n};\n"],"mappings":"sgBA4BA,MAAM,EAAY,GAChB,GAAQ,aAAa,gBAAgB,GAAK,OAEtC,GAAmB,CACvB,QACA,OACA,QACA,cACA,aACA,OACA,mBACA,WACA,QAAQ,EACR,YAAY,EACZ,GAAG,KACqD,CACxD,GAAM,CAAE,SAAU,GAAc,CAE1B,EAAc,EAAsB,EAAE,CAAC,CACvC,CAAE,0BAAyB,qBAAsB,EACrD,EACA,CACE,WACA,YAAa,GACd,CACF,CAMD,OAJA,MAAgB,CACd,GAAmB,EAClB,EAAE,CAAC,CAGJ,EAAC,EAAA,CACC,QAAS,EACF,QACM,cACD,aACN,OACY,mBAClB,eAAc,CAAC,CAAC,WAEhB,EAAC,EAAA,CACC,SAAU,EAAM,SAChB,aAAc,EAAM,MACT,YACX,QAAQ,WACR,mBAAoB,EACpB,GAAK,WAEJ,GACC,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CACC,MAAO,EACP,IAAM,GAAO,CACX,EAAY,QAAQ,GAAK,IAE3B,CACF,EAAC,EAAA,CACC,MAAO,EACP,IAAM,GAAO,CACX,EAAY,QAAQ,GAAK,IAE3B,CACF,EAAC,EAAA,CACC,MAAO,EACP,IAAM,GAAO,CACX,EAAY,QAAQ,GAAK,IAE3B,GACY,CAChB,EAAC,EAAA,EAAA,CAAoB,CACrB,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CACC,MAAO,EACP,IAAM,GAAO,CACX,EAAY,QAAQ,GAAK,IAE3B,CACF,EAAC,EAAA,CACC,MAAO,EACP,IAAM,GAAO,CACX,EAAY,QAAQ,GAAK,IAE3B,CACF,EAAC,EAAA,CACC,MAAO,EACP,IAAM,GAAO,CACX,EAAY,QAAQ,GAAK,IAE3B,GACY,CACf,GACC,EAAC,EAAA,CAAe,MAAO,EAAA,CAA2B,GAEnD,EAEI,EACI,EAIR,GAAc,CACzB,OACA,cACA,QACA,aACA,OACA,mBACA,WACA,QAAQ,EACR,YAAY,EACZ,GAAG,KACmB,CACtB,GAAM,CAAE,WAAY,GAAgB,CAEpC,OACE,EAAC,EAAK,MAAA,CACK,UACH,OACN,QAAS,CAAE,WACT,EAAC,EAAA,CACQ,QACD,OACC,QACM,cACD,aACN,OACY,mBACX,QACI,YACX,GAAI,EAEH,YACe,EAEpB"}

package/dist/esm/components/Form/elements/SearchInputElement.mjs

@@ -1,17 +1,2 @@
-import { SearchInput } from "../../Input/SearchInput.mjs";
-import { FormElement } from "./FormElement.mjs";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/Form/elements/SearchInputElement.tsx
-const SearchInputElement = (props) => /* @__PURE__ */ jsx(FormElement, {
-	id: props.name,
-	"data-testid": props.name,
-	Element: SearchInput,
-	"aria-labelledby": props.label ? `${props.name}-label` : void 0,
-	"aria-label": props.label ? void 0 : props.name,
-	...props
-});
-
-//#endregion
-export { SearchInputElement };
+import{SearchInput as e}from"../../Input/SearchInput.mjs";import{FormElement as t}from"./FormElement.mjs";import{jsx as n}from"react/jsx-runtime";const r=r=>n(t,{id:r.name,"data-testid":r.name,Element:e,"aria-labelledby":r.label?`${r.name}-label`:void 0,"aria-label":r.label?void 0:r.name,...r});export{r as SearchInputElement};
 //# sourceMappingURL=SearchInputElement.mjs.map

package/dist/esm/components/Form/elements/SearchInputElement.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInputElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/SearchInputElement.tsx"],"sourcesContent":["import { SearchInput } from '@components/Input';\nimport type { ComponentProps, FC } from 'react';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype SearchInputElementProps = Omit<\n  FormElementProps<typeof SearchInput>,\n  'Element'\n> &\n  Omit<\n    ComponentProps<typeof SearchInput> & {\n      name: string;\n    },\n    'aria-label' | 'aria-labelledby'\n  >;\n\nexport const SearchInputElement: FC<SearchInputElementProps> = (props) => (\n  <FormElement\n    id={props.name}\n    data-testid={props.name}\n    Element={SearchInput}\n    aria-labelledby={props.label ? `${props.name}-label` : undefined}\n    aria-label={props.label ? undefined : props.name}\n    {...props}\n  />\n);\n"],"mappings":";;;;;AAeA,MAAa,sBAAmD,UAC9D,oBAAC;CACC,IAAI,MAAM;CACV,eAAa,MAAM;CACnB,SAAS;CACT,mBAAiB,MAAM,QAAQ,GAAG,MAAM,KAAK,UAAU;CACvD,cAAY,MAAM,QAAQ,SAAY,MAAM;CAC5C,GAAI;EACJ"}
+{"version":3,"file":"SearchInputElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/SearchInputElement.tsx"],"sourcesContent":["import { SearchInput } from '@components/Input';\nimport type { ComponentProps, FC } from 'react';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype SearchInputElementProps = Omit<\n  FormElementProps<typeof SearchInput>,\n  'Element'\n> &\n  Omit<\n    ComponentProps<typeof SearchInput> & {\n      name: string;\n    },\n    'aria-label' | 'aria-labelledby'\n  >;\n\nexport const SearchInputElement: FC<SearchInputElementProps> = (props) => (\n  <FormElement\n    id={props.name}\n    data-testid={props.name}\n    Element={SearchInput}\n    aria-labelledby={props.label ? `${props.name}-label` : undefined}\n    aria-label={props.label ? undefined : props.name}\n    {...props}\n  />\n);\n"],"mappings":"kJAeA,MAAa,EAAmD,GAC9D,EAAC,EAAA,CACC,GAAI,EAAM,KACV,cAAa,EAAM,KACnB,QAAS,EACT,kBAAiB,EAAM,MAAQ,GAAG,EAAM,KAAK,QAAU,IAAA,GACvD,aAAY,EAAM,MAAQ,IAAA,GAAY,EAAM,KAC5C,GAAI,GACJ"}

package/dist/esm/components/Form/elements/SelectElement.mjs

@@ -1,50 +1,2 @@
-'use client';
-
-import { Select } from "../../Select/Select.mjs";
-import { useFormField } from "../FormField.mjs";
-import { FormItemLayout } from "../layout/FormItemLayout.mjs";
-import { Form } from "../Form.mjs";
-import { jsx } from "react/jsx-runtime";
-import { useFormContext } from "react-hook-form";
-
-//#region src/components/Form/elements/SelectElement.tsx
-const SelectFieldContent = ({ field, name, label, description, isRequired, info, showErrorMessage, children, ...props }) => {
-	const { error } = useFormField();
-	return /* @__PURE__ */ jsx(FormItemLayout, {
-		htmlFor: name,
-		label,
-		description,
-		isRequired,
-		info,
-		showErrorMessage,
-		"aria-invalid": !!error,
-		children: /* @__PURE__ */ jsx(Select, {
-			onValueChange: field.onChange,
-			defaultValue: field.value,
-			...props,
-			children
-		})
-	});
-};
-const SelectElement = ({ name, description, label, isRequired, info, showErrorMessage, children, ...props }) => {
-	const { control } = useFormContext();
-	return /* @__PURE__ */ jsx(Form.Field, {
-		control,
-		name,
-		render: ({ field }) => /* @__PURE__ */ jsx(SelectFieldContent, {
-			field,
-			name,
-			label,
-			description,
-			isRequired,
-			info,
-			showErrorMessage,
-			...props,
-			children
-		})
-	});
-};
-
-//#endregion
-export { SelectElement };
+"use client";import{Select as e}from"../../Select/Select.mjs";import{useFormField as t}from"../FormField.mjs";import{FormItemLayout as n}from"../layout/FormItemLayout.mjs";import{Form as r}from"../Form.mjs";import{jsx as i}from"react/jsx-runtime";import{useFormContext as a}from"react-hook-form";const o=({field:r,name:a,label:o,description:s,isRequired:c,info:l,showErrorMessage:u,children:d,...f})=>{let{error:p}=t();return i(n,{htmlFor:a,label:o,description:s,isRequired:c,info:l,showErrorMessage:u,"aria-invalid":!!p,children:i(e,{onValueChange:r.onChange,defaultValue:r.value,...f,children:d})})},s=({name:e,description:t,label:n,isRequired:s,info:c,showErrorMessage:l,children:u,...d})=>{let{control:f}=a();return i(r.Field,{control:f,name:e,render:({field:r})=>i(o,{field:r,name:e,label:n,description:t,isRequired:s,info:c,showErrorMessage:l,...d,children:u})})};export{s as SelectElement};
 //# sourceMappingURL=SelectElement.mjs.map

package/dist/esm/components/Form/elements/SelectElement.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/SelectElement.tsx"],"sourcesContent":["'use client';\n\nimport { Select } from '@components/Select/Select';\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\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\nconst SelectFieldContent = ({\n  field,\n  name,\n  label,\n  description,\n  isRequired,\n  info,\n  showErrorMessage,\n  children,\n  ...props\n}: Omit<SelectElementsProps, 'control'> & { field: any }) => {\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\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        <SelectFieldContent\n          field={field}\n          name={name}\n          label={label}\n          description={description}\n          isRequired={isRequired}\n          info={info}\n          showErrorMessage={showErrorMessage}\n          {...props}\n        >\n          {children}\n        </SelectFieldContent>\n      )}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;AAmBA,MAAM,sBAAsB,EAC1B,OACA,MACA,OACA,aACA,YACA,MACA,kBACA,UACA,GAAG,YACwD;CAC3D,MAAM,EAAE,UAAU,cAAc;AAEhC,QACE,oBAAC;EACC,SAAS;EACF;EACM;EACD;EACN;EACY;EAClB,gBAAc,CAAC,CAAC;YAEhB,oBAAC;GACC,eAAe,MAAM;GACrB,cAAc,MAAM;GACpB,GAAI;GAEH;IACM;GACM;;AAIrB,MAAa,iBAAiB,EAC5B,MACA,aACA,OACA,YACA,MACA,kBACA,UACA,GAAG,YACsB;CACzB,MAAM,EAAE,YAAY,gBAAgB;AAEpC,QACE,oBAAC,KAAK;EACK;EACH;EACN,SAAS,EAAE,YACT,oBAAC;GACQ;GACD;GACC;GACM;GACD;GACN;GACY;GAClB,GAAI;GAEH;IACkB;GAEvB"}
+{"version":3,"file":"SelectElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/SelectElement.tsx"],"sourcesContent":["'use client';\n\nimport { Select } from '@components/Select/Select';\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\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\nconst SelectFieldContent = ({\n  field,\n  name,\n  label,\n  description,\n  isRequired,\n  info,\n  showErrorMessage,\n  children,\n  ...props\n}: Omit<SelectElementsProps, 'control'> & { field: any }) => {\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\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        <SelectFieldContent\n          field={field}\n          name={name}\n          label={label}\n          description={description}\n          isRequired={isRequired}\n          info={info}\n          showErrorMessage={showErrorMessage}\n          {...props}\n        >\n          {children}\n        </SelectFieldContent>\n      )}\n    />\n  );\n};\n"],"mappings":"wSAmBA,MAAM,GAAsB,CAC1B,QACA,OACA,QACA,cACA,aACA,OACA,mBACA,WACA,GAAG,KACwD,CAC3D,GAAM,CAAE,SAAU,GAAc,CAEhC,OACE,EAAC,EAAA,CACC,QAAS,EACF,QACM,cACD,aACN,OACY,mBAClB,eAAc,CAAC,CAAC,WAEhB,EAAC,EAAA,CACC,cAAe,EAAM,SACrB,aAAc,EAAM,MACpB,GAAI,EAEH,YACM,EACM,EAIR,GAAiB,CAC5B,OACA,cACA,QACA,aACA,OACA,mBACA,WACA,GAAG,KACsB,CACzB,GAAM,CAAE,WAAY,GAAgB,CAEpC,OACE,EAAC,EAAK,MAAA,CACK,UACH,OACN,QAAS,CAAE,WACT,EAAC,EAAA,CACQ,QACD,OACC,QACM,cACD,aACN,OACY,mBAClB,GAAI,EAEH,YACkB,EAEvB"}

package/dist/esm/components/Form/elements/SwitchSelectorElement.mjs

@@ -1,49 +1,2 @@
-'use client';
-
-import { SwitchSelector } from "../../SwitchSelector/index.mjs";
-import { useFormField } from "../FormField.mjs";
-import { FormItemLayout } from "../layout/FormItemLayout.mjs";
-import { Form } from "../Form.mjs";
-import { jsx } from "react/jsx-runtime";
-import { useFormContext } from "react-hook-form";
-
-//#region src/components/Form/elements/SwitchSelectorElement.tsx
-const SwitchSelectorFieldContent = ({ field, name, label, description, isRequired, info, showErrorMessage, children, ...props }) => {
-	const { error } = useFormField();
-	return /* @__PURE__ */ jsx(FormItemLayout, {
-		htmlFor: name,
-		label,
-		description,
-		isRequired,
-		info,
-		showErrorMessage,
-		"aria-invalid": !!error,
-		children: /* @__PURE__ */ jsx(SwitchSelector, {
-			...field,
-			...props,
-			children
-		})
-	});
-};
-const SwitchSelectorElement = ({ name, description, label, isRequired, info, showErrorMessage, children, ...props }) => {
-	const { control } = useFormContext();
-	return /* @__PURE__ */ jsx(Form.Field, {
-		control,
-		name,
-		render: ({ field }) => /* @__PURE__ */ jsx(SwitchSelectorFieldContent, {
-			field,
-			name,
-			label,
-			description,
-			isRequired,
-			info,
-			showErrorMessage,
-			...props,
-			children
-		})
-	});
-};
-
-//#endregion
-export { SwitchSelectorElement };
+"use client";import{SwitchSelector as e}from"../../SwitchSelector/index.mjs";import{useFormField as t}from"../FormField.mjs";import{FormItemLayout as n}from"../layout/FormItemLayout.mjs";import{Form as r}from"../Form.mjs";import{jsx as i}from"react/jsx-runtime";import{useFormContext as a}from"react-hook-form";const o=({field:r,name:a,label:o,description:s,isRequired:c,info:l,showErrorMessage:u,children:d,...f})=>{let{error:p}=t();return i(n,{htmlFor:a,label:o,description:s,isRequired:c,info:l,showErrorMessage:u,"aria-invalid":!!p,children:i(e,{...r,...f,children:d})})},s=({name:e,description:t,label:n,isRequired:s,info:c,showErrorMessage:l,children:u,...d})=>{let{control:f}=a();return i(r.Field,{control:f,name:e,render:({field:r})=>i(o,{field:r,name:e,label:n,description:t,isRequired:s,info:c,showErrorMessage:l,...d,children:u})})};export{s as SwitchSelectorElement};
 //# sourceMappingURL=SwitchSelectorElement.mjs.map

package/dist/esm/components/Form/elements/SwitchSelectorElement.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SwitchSelectorElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/SwitchSelectorElement.tsx"],"sourcesContent":["'use client';\n\nimport { SwitchSelector } from '@components/SwitchSelector';\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\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\nconst SwitchSelectorFieldContent = ({\n  field,\n  name,\n  label,\n  description,\n  isRequired,\n  info,\n  showErrorMessage,\n  children,\n  ...props\n}: Omit<SwitchSelectorElementProps, 'control'> & { field: any }) => {\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\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        <SwitchSelectorFieldContent\n          field={field}\n          name={name}\n          label={label}\n          description={description}\n          isRequired={isRequired}\n          info={info}\n          showErrorMessage={showErrorMessage}\n          {...props}\n        >\n          {children}\n        </SwitchSelectorFieldContent>\n      )}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;AAsBA,MAAM,8BAA8B,EAClC,OACA,MACA,OACA,aACA,YACA,MACA,kBACA,UACA,GAAG,YAC+D;CAClE,MAAM,EAAE,UAAU,cAAc;AAEhC,QACE,oBAAC;EACC,SAAS;EACF;EACM;EACD;EACN;EACY;EAClB,gBAAc,CAAC,CAAC;YAEhB,oBAAC;GAAe,GAAI;GAAO,GAAI;GAC5B;IACc;GACF;;AAIrB,MAAa,yBAAyB,EACpC,MACA,aACA,OACA,YACA,MACA,kBACA,UACA,GAAG,YAC6B;CAChC,MAAM,EAAE,YAAY,gBAAgB;AAEpC,QACE,oBAAC,KAAK;EACK;EACH;EACN,SAAS,EAAE,YACT,oBAAC;GACQ;GACD;GACC;GACM;GACD;GACN;GACY;GAClB,GAAI;GAEH;IAC0B;GAE/B"}
+{"version":3,"file":"SwitchSelectorElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/SwitchSelectorElement.tsx"],"sourcesContent":["'use client';\n\nimport { SwitchSelector } from '@components/SwitchSelector';\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useFormContext } from 'react-hook-form';\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\nconst SwitchSelectorFieldContent = ({\n  field,\n  name,\n  label,\n  description,\n  isRequired,\n  info,\n  showErrorMessage,\n  children,\n  ...props\n}: Omit<SwitchSelectorElementProps, 'control'> & { field: any }) => {\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\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        <SwitchSelectorFieldContent\n          field={field}\n          name={name}\n          label={label}\n          description={description}\n          isRequired={isRequired}\n          info={info}\n          showErrorMessage={showErrorMessage}\n          {...props}\n        >\n          {children}\n        </SwitchSelectorFieldContent>\n      )}\n    />\n  );\n};\n"],"mappings":"uTAsBA,MAAM,GAA8B,CAClC,QACA,OACA,QACA,cACA,aACA,OACA,mBACA,WACA,GAAG,KAC+D,CAClE,GAAM,CAAE,SAAU,GAAc,CAEhC,OACE,EAAC,EAAA,CACC,QAAS,EACF,QACM,cACD,aACN,OACY,mBAClB,eAAc,CAAC,CAAC,WAEhB,EAAC,EAAA,CAAe,GAAI,EAAO,GAAI,EAC5B,YACc,EACF,EAIR,GAAyB,CACpC,OACA,cACA,QACA,aACA,OACA,mBACA,WACA,GAAG,KAC6B,CAChC,GAAM,CAAE,WAAY,GAAgB,CAEpC,OACE,EAAC,EAAK,MAAA,CACK,UACH,OACN,QAAS,CAAE,WACT,EAAC,EAAA,CACQ,QACD,OACC,QACM,cACD,aACN,OACY,mBAClB,GAAI,EAEH,YAC0B,EAE/B"}

package/dist/esm/components/Form/elements/TextAreaElement.mjs

@@ -1,17 +1,2 @@
-import { TextArea } from "../../TextArea/TextArea.mjs";
-import { FormElement } from "./FormElement.mjs";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/Form/elements/TextAreaElement.tsx
-const TextAreaElement = (props) => /* @__PURE__ */ jsx(FormElement, {
-	Element: TextArea,
-	id: props.name,
-	"aria-labelledby": props.label ? `${props.name}-label` : void 0,
-	"aria-label": props.label ? void 0 : props.name,
-	"data-testid": props.name,
-	...props
-});
-
-//#endregion
-export { TextAreaElement };
+import{TextArea as e}from"../../TextArea/TextArea.mjs";import{FormElement as t}from"./FormElement.mjs";import{jsx as n}from"react/jsx-runtime";const r=r=>n(t,{Element:e,id:r.name,"aria-labelledby":r.label?`${r.name}-label`:void 0,"aria-label":r.label?void 0:r.name,"data-testid":r.name,...r});export{r as TextAreaElement};
 //# sourceMappingURL=TextAreaElement.mjs.map

package/dist/esm/components/Form/elements/TextAreaElement.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextAreaElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/TextAreaElement.tsx"],"sourcesContent":["import { TextArea } from '@components/TextArea/TextArea';\nimport type { ComponentProps, FC } from 'react';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype TextAreaElementsProps = Omit<\n  FormElementProps<typeof TextArea>,\n  'Element'\n> &\n  Omit<\n    ComponentProps<typeof TextArea> & {\n      name: string;\n    },\n    'aria-label' | 'aria-labelledby'\n  >;\n\nexport const TextAreaElement: FC<TextAreaElementsProps> = (props) => (\n  <FormElement\n    Element={TextArea}\n    id={props.name}\n    aria-labelledby={props.label ? `${props.name}-label` : undefined}\n    aria-label={props.label ? undefined : props.name}\n    data-testid={props.name}\n    {...props}\n  />\n);\n"],"mappings":";;;;;AAeA,MAAa,mBAA8C,UACzD,oBAAC;CACC,SAAS;CACT,IAAI,MAAM;CACV,mBAAiB,MAAM,QAAQ,GAAG,MAAM,KAAK,UAAU;CACvD,cAAY,MAAM,QAAQ,SAAY,MAAM;CAC5C,eAAa,MAAM;CACnB,GAAI;EACJ"}
+{"version":3,"file":"TextAreaElement.mjs","names":[],"sources":["../../../../../src/components/Form/elements/TextAreaElement.tsx"],"sourcesContent":["import { TextArea } from '@components/TextArea/TextArea';\nimport type { ComponentProps, FC } from 'react';\nimport { FormElement, type FormElementProps } from './FormElement';\n\ntype TextAreaElementsProps = Omit<\n  FormElementProps<typeof TextArea>,\n  'Element'\n> &\n  Omit<\n    ComponentProps<typeof TextArea> & {\n      name: string;\n    },\n    'aria-label' | 'aria-labelledby'\n  >;\n\nexport const TextAreaElement: FC<TextAreaElementsProps> = (props) => (\n  <FormElement\n    Element={TextArea}\n    id={props.name}\n    aria-labelledby={props.label ? `${props.name}-label` : undefined}\n    aria-label={props.label ? undefined : props.name}\n    data-testid={props.name}\n    {...props}\n  />\n);\n"],"mappings":"+IAeA,MAAa,EAA8C,GACzD,EAAC,EAAA,CACC,QAAS,EACT,GAAI,EAAM,KACV,kBAAiB,EAAM,MAAQ,GAAG,EAAM,KAAK,QAAU,IAAA,GACvD,aAAY,EAAM,MAAQ,IAAA,GAAY,EAAM,KAC5C,cAAa,EAAM,KACnB,GAAI,GACJ"}

package/dist/esm/components/Form/elements/index.mjs

@@ -1,10 +1 @@
-import { FormElement } from "./FormElement.mjs";
-import { EditableFieldInputElement } from "./EditableFieldInputElement.mjs";
-import { EditableFieldTextAreaElement } from "./EditableFieldTextAreaElement.mjs";
-import { InputElement } from "./InputElement.mjs";
-import { InputPasswordElement } from "./InputPasswordElement.mjs";
-import { OTPElement } from "./OTPElement.mjs";
-import { SearchInputElement } from "./SearchInputElement.mjs";
-import { TextAreaElement } from "./TextAreaElement.mjs";
-
-export { EditableFieldInputElement, EditableFieldTextAreaElement, FormElement, InputElement, InputPasswordElement, OTPElement, SearchInputElement, TextAreaElement };
+import{FormElement as e}from"./FormElement.mjs";import{EditableFieldInputElement as t}from"./EditableFieldInputElement.mjs";import{EditableFieldTextAreaElement as n}from"./EditableFieldTextAreaElement.mjs";import{InputElement as r}from"./InputElement.mjs";import{InputPasswordElement as i}from"./InputPasswordElement.mjs";import{OTPElement as a}from"./OTPElement.mjs";import{SearchInputElement as o}from"./SearchInputElement.mjs";import{TextAreaElement as s}from"./TextAreaElement.mjs";export{t as EditableFieldInputElement,n as EditableFieldTextAreaElement,e as FormElement,r as InputElement,i as InputPasswordElement,a as OTPElement,o as SearchInputElement,s as TextAreaElement};

package/dist/esm/components/Form/index.mjs

@@ -1,5 +1 @@
-import { useFormField } from "./FormField.mjs";
-import { useForm } from "./FormBase.mjs";
-import { Form } from "./Form.mjs";
-
-export { Form, useForm, useFormField };
+import{useFormField as e}from"./FormField.mjs";import{useForm as t}from"./FormBase.mjs";import{Form as n}from"./Form.mjs";export{n as Form,t as useForm,e as useFormField};

package/dist/esm/components/Form/layout/FormItemLayout.mjs

@@ -1,25 +1,2 @@
-import { FormLabelLayout } from "./FormLabelLayout.mjs";
-import { Form } from "../Form.mjs";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/Form/layout/FormItemLayout.tsx
-const FormItemLayout = ({ label, description, isRequired, info, children, showErrorMessage = true, htmlFor }) => /* @__PURE__ */ jsxs(Form.Item, {
-	className: "flex w-full flex-col flex-wrap gap-2 px-1 py-2",
-	children: [
-		(description || label) && /* @__PURE__ */ jsxs("div", {
-			className: "flex flex-col gap-1 p-1 leading-none",
-			children: [label && /* @__PURE__ */ jsx(FormLabelLayout, {
-				isRequired,
-				info,
-				htmlFor,
-				children: label
-			}), description && /* @__PURE__ */ jsx(Form.Description, { children: description })]
-		}),
-		/* @__PURE__ */ jsx(Form.Control, { children }),
-		showErrorMessage && /* @__PURE__ */ jsx(Form.Message, { "data-testid": "error-message" })
-	]
-});
-
-//#endregion
-export { FormItemLayout };
+import{FormLabelLayout as e}from"./FormLabelLayout.mjs";import{Form as t}from"../Form.mjs";import{jsx as n,jsxs as r}from"react/jsx-runtime";const i=({label:i,description:a,isRequired:o,info:s,children:c,showErrorMessage:l=!0,htmlFor:u})=>r(t.Item,{className:`flex w-full flex-col flex-wrap gap-2 px-1 py-2`,children:[(a||i)&&r(`div`,{className:`flex flex-col gap-1 p-1 leading-none`,children:[i&&n(e,{isRequired:o,info:s,htmlFor:u,children:i}),a&&n(t.Description,{children:a})]}),n(t.Control,{children:c}),l&&n(t.Message,{"data-testid":`error-message`})]});export{i as FormItemLayout};
 //# sourceMappingURL=FormItemLayout.mjs.map

package/dist/esm/components/Form/layout/FormItemLayout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FormItemLayout.mjs","names":[],"sources":["../../../../../src/components/Form/layout/FormItemLayout.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=\"flex w-full flex-col flex-wrap gap-2 px-1 py-2\">\n    {(description || label) && (\n      <div className=\"flex flex-col gap-1 p-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"],"mappings":";;;;;AAWA,MAAa,kBAA2C,EACtD,OACA,aACA,YACA,MACA,UACA,mBAAmB,MACnB,cAEA,qBAAC,KAAK;CAAK,WAAU;;GACjB,eAAe,UACf,qBAAC;GAAI,WAAU;cACZ,SACC,oBAAC;IACa;IACN;IACG;cAER;KACe,EAEnB,eAAe,oBAAC,KAAK,yBAAa,cAA+B;IAC9D;EAER,oBAAC,KAAK,WAAS,WAAwB;EAEtC,oBAAoB,oBAAC,KAAK,WAAQ,eAAY,kBAAkB;;EACvD"}
+{"version":3,"file":"FormItemLayout.mjs","names":[],"sources":["../../../../../src/components/Form/layout/FormItemLayout.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=\"flex w-full flex-col flex-wrap gap-2 px-1 py-2\">\n    {(description || label) && (\n      <div className=\"flex flex-col gap-1 p-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"],"mappings":"6IAWA,MAAa,GAA2C,CACtD,QACA,cACA,aACA,OACA,WACA,mBAAmB,GACnB,aAEA,EAAC,EAAK,KAAA,CAAK,UAAU,4DACjB,GAAe,IACf,EAAC,MAAA,CAAI,UAAU,iDACZ,GACC,EAAC,EAAA,CACa,aACN,OACG,mBAER,GACe,CAEnB,GAAe,EAAC,EAAK,YAAA,CAAA,SAAa,EAAA,CAA+B,CAAA,EAC9D,CAER,EAAC,EAAK,QAAA,CAAS,WAAA,CAAwB,CAEtC,GAAoB,EAAC,EAAK,QAAA,CAAQ,cAAY,gBAAA,CAAkB,GACvD"}

package/dist/esm/components/Form/layout/FormLabelLayout.mjs

@@ -1,21 +1,2 @@
-import { InformationTag } from "../../InformationTag/index.mjs";
-import { FormLabel } from "../FormLabel.mjs";
-import { RequiredStar } from "./RequiredStar.mjs";
-import { clsx } from "clsx";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/Form/layout/FormLabelLayout.tsx
-const FormLabelLayout = ({ children, isRequired, info, htmlFor, className }) => /* @__PURE__ */ jsxs("div", {
-	className: "ml-1 flex gap-1 align-middle text-base leading-none",
-	children: [children && /* @__PURE__ */ jsxs(FormLabel, {
-		htmlFor,
-		id: `${htmlFor}-label`,
-		suppressHydrationWarning: true,
-		className: clsx("font-bold", className),
-		children: [children, /* @__PURE__ */ jsx(RequiredStar, { isRequired })]
-	}), info && /* @__PURE__ */ jsx(InformationTag, { content: info })]
-});
-
-//#endregion
-export { FormLabelLayout };
+import{InformationTag as e}from"../../InformationTag/index.mjs";import{FormLabel as t}from"../FormLabel.mjs";import{RequiredStar as n}from"./RequiredStar.mjs";import{clsx as r}from"clsx";import{jsx as i,jsxs as a}from"react/jsx-runtime";const o=({children:o,isRequired:s,info:c,htmlFor:l,className:u})=>a(`div`,{className:`ml-1 flex gap-1 align-middle text-base leading-none`,children:[o&&a(t,{htmlFor:l,id:`${l}-label`,suppressHydrationWarning:!0,className:r(`font-bold`,u),children:[o,i(n,{isRequired:s})]}),c&&i(e,{content:c})]});export{o as FormLabelLayout};
 //# sourceMappingURL=FormLabelLayout.mjs.map

package/dist/esm/components/Form/layout/FormLabelLayout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FormLabelLayout.mjs","names":[],"sources":["../../../../../src/components/Form/layout/FormLabelLayout.tsx"],"sourcesContent":["import { InformationTag } from '@components/InformationTag';\nimport { clsx } from 'clsx';\nimport type { FC, ReactNode } from 'react';\nimport { FormLabel } from '../FormLabel';\nimport { RequiredStar } from './RequiredStar';\n\nexport type FormLabelLayoutProps = {\n  children?: ReactNode;\n  isRequired?: boolean;\n  info?: string;\n  htmlFor?: string;\n  className?: string;\n};\n\nexport const FormLabelLayout: FC<FormLabelLayoutProps> = ({\n  children,\n  isRequired,\n  info,\n  htmlFor,\n  className,\n}) => (\n  <div className=\"ml-1 flex gap-1 align-middle text-base leading-none\">\n    {children && (\n      <FormLabel\n        htmlFor={htmlFor}\n        id={`${htmlFor}-label`}\n        suppressHydrationWarning\n        className={clsx('font-bold', className)}\n      >\n        {children}\n        <RequiredStar isRequired={isRequired} />\n      </FormLabel>\n    )}\n    {info && <InformationTag content={info} />}\n  </div>\n);\n"],"mappings":";;;;;;;AAcA,MAAa,mBAA6C,EACxD,UACA,YACA,MACA,SACA,gBAEA,qBAAC;CAAI,WAAU;YACZ,YACC,qBAAC;EACU;EACT,IAAI,GAAG,QAAQ;EACf;EACA,WAAW,KAAK,aAAa,UAAU;aAEtC,UACD,oBAAC,gBAAyB,aAAc;GAC9B,EAEb,QAAQ,oBAAC,kBAAe,SAAS,OAAQ;EACtC"}
+{"version":3,"file":"FormLabelLayout.mjs","names":[],"sources":["../../../../../src/components/Form/layout/FormLabelLayout.tsx"],"sourcesContent":["import { InformationTag } from '@components/InformationTag';\nimport { clsx } from 'clsx';\nimport type { FC, ReactNode } from 'react';\nimport { FormLabel } from '../FormLabel';\nimport { RequiredStar } from './RequiredStar';\n\nexport type FormLabelLayoutProps = {\n  children?: ReactNode;\n  isRequired?: boolean;\n  info?: string;\n  htmlFor?: string;\n  className?: string;\n};\n\nexport const FormLabelLayout: FC<FormLabelLayoutProps> = ({\n  children,\n  isRequired,\n  info,\n  htmlFor,\n  className,\n}) => (\n  <div className=\"ml-1 flex gap-1 align-middle text-base leading-none\">\n    {children && (\n      <FormLabel\n        htmlFor={htmlFor}\n        id={`${htmlFor}-label`}\n        suppressHydrationWarning\n        className={clsx('font-bold', className)}\n      >\n        {children}\n        <RequiredStar isRequired={isRequired} />\n      </FormLabel>\n    )}\n    {info && <InformationTag content={info} />}\n  </div>\n);\n"],"mappings":"6OAcA,MAAa,GAA6C,CACxD,WACA,aACA,OACA,UACA,eAEA,EAAC,MAAA,CAAI,UAAU,gEACZ,GACC,EAAC,EAAA,CACU,UACT,GAAI,GAAG,EAAQ,QACf,yBAAA,GACA,UAAW,EAAK,YAAa,EAAU,WAEtC,EACD,EAAC,EAAA,CAAyB,aAAA,CAAc,CAAA,EAC9B,CAEb,GAAQ,EAAC,EAAA,CAAe,QAAS,EAAA,CAAQ,CAAA,EACtC"}

package/dist/esm/components/Form/layout/RequiredStar.mjs

@@ -1,11 +1,2 @@
-import { Fragment, jsx } from "react/jsx-runtime";
-
-//#region src/components/Form/layout/RequiredStar.tsx
-const RequiredStar = ({ isRequired }) => isRequired ? /* @__PURE__ */ jsx("span", {
-	"aria-label": "Asterisk meaning the field is required",
-	children: "*"
-}) : /* @__PURE__ */ jsx(Fragment, {});
-
-//#endregion
-export { RequiredStar };
+import{Fragment as e,jsx as t}from"react/jsx-runtime";const n=({isRequired:n})=>n?t(`span`,{"aria-label":`Asterisk meaning the field is required`,children:`*`}):t(e,{});export{n as RequiredStar};
 //# sourceMappingURL=RequiredStar.mjs.map

package/dist/esm/components/Form/layout/RequiredStar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"RequiredStar.mjs","names":[],"sources":["../../../../../src/components/Form/layout/RequiredStar.tsx"],"sourcesContent":["import type { FC } from 'react';\n\ntype RequiredStarProps = {\n  isRequired?: boolean;\n};\n\nexport const RequiredStar: FC<RequiredStarProps> = ({ isRequired }) =>\n  isRequired ? (\n    <span aria-label=\"Asterisk meaning the field is required\">*</span>\n  ) : (\n    <></>\n  );\n"],"mappings":";;;AAMA,MAAa,gBAAuC,EAAE,iBACpD,aACE,oBAAC;CAAK,cAAW;WAAyC;EAAQ,GAElE,iCAAK"}
+{"version":3,"file":"RequiredStar.mjs","names":[],"sources":["../../../../../src/components/Form/layout/RequiredStar.tsx"],"sourcesContent":["import type { FC } from 'react';\n\ntype RequiredStarProps = {\n  isRequired?: boolean;\n};\n\nexport const RequiredStar: FC<RequiredStarProps> = ({ isRequired }) =>\n  isRequired ? (\n    <span aria-label=\"Asterisk meaning the field is required\">*</span>\n  ) : (\n    <></>\n  );\n"],"mappings":"sDAMA,MAAa,GAAuC,CAAE,gBACpD,EACE,EAAC,OAAA,CAAK,aAAW,kDAAyC,KAAQ,CAElE,EAAA,EAAA,EAAA,CAAK"}

package/dist/esm/components/Form/layout/index.mjs

@@ -1,4 +1 @@
-import { FormLabelLayout } from "./FormLabelLayout.mjs";
-import { FormItemLayout } from "./FormItemLayout.mjs";
-
-export { FormItemLayout, FormLabelLayout };
+import{FormLabelLayout as e}from"./FormLabelLayout.mjs";import{FormItemLayout as t}from"./FormItemLayout.mjs";export{t as FormItemLayout,e as FormLabelLayout};

package/dist/esm/components/HTMLRender/HTMLRender.mjs

@@ -1,66 +1,2 @@
-import { Link } from "../Link/Link.mjs";
-import { H1, H2, H3, H4, H5, H6 } from "../Headers/index.mjs";
-import { Fragment, jsx } from "react/jsx-runtime";
-import { renderHTML } from "react-intlayer";
-
-//#region src/components/HTMLRender/HTMLRender.tsx
-const getIntlayerHTMLOptions = () => ({ components: {
-	h1: (props) => /* @__PURE__ */ jsx(H1, {
-		isClickable: true,
-		...props
-	}),
-	h2: (props) => /* @__PURE__ */ jsx(H2, {
-		isClickable: true,
-		className: "mt-16",
-		...props
-	}),
-	h3: (props) => /* @__PURE__ */ jsx(H3, {
-		isClickable: true,
-		className: "mt-5",
-		...props
-	}),
-	h4: (props) => /* @__PURE__ */ jsx(H4, {
-		isClickable: true,
-		className: "mt-3",
-		...props
-	}),
-	h5: (props) => /* @__PURE__ */ jsx(H5, {
-		isClickable: true,
-		className: "mt-3",
-		...props
-	}),
-	h6: (props) => /* @__PURE__ */ jsx(H6, {
-		isClickable: true,
-		className: "mt-3",
-		...props
-	}),
-	a: (props) => /* @__PURE__ */ jsx(Link, {
-		color: "neutral",
-		isExternalLink: props.href?.startsWith("http"),
-		underlined: true,
-		...props
-	})
-} });
-/**
-* HTMLRenderer Component
-*
-* A comprehensive HTML renderer that transforms HTML text into rich,
-* interactive content with custom styling and Intlayer integration.
-*/
-const HTMLRenderer = ({ children, isDarkMode, locale, components: componentsProp }) => {
-	return /* @__PURE__ */ jsx(Fragment, { children: renderHTML(children, { components: {
-		...getIntlayerHTMLOptions(isDarkMode ?? false).components,
-		a: (props) => /* @__PURE__ */ jsx(Link, {
-			color: "neutral",
-			isExternalLink: props.href?.startsWith("http"),
-			underlined: true,
-			locale,
-			...props
-		}),
-		...componentsProp
-	} }) });
-};
-
-//#endregion
-export { HTMLRenderer, getIntlayerHTMLOptions };
+import{Link as e}from"../Link/Link.mjs";import{H1 as t,H2 as n,H3 as r,H4 as i,H5 as a,H6 as o}from"../Headers/index.mjs";import{Fragment as s,jsx as c}from"react/jsx-runtime";import{renderHTML as l}from"react-intlayer";const u=()=>({components:{h1:e=>c(t,{isClickable:!0,...e}),h2:e=>c(n,{isClickable:!0,className:`mt-16`,...e}),h3:e=>c(r,{isClickable:!0,className:`mt-5`,...e}),h4:e=>c(i,{isClickable:!0,className:`mt-3`,...e}),h5:e=>c(a,{isClickable:!0,className:`mt-3`,...e}),h6:e=>c(o,{isClickable:!0,className:`mt-3`,...e}),a:t=>c(e,{isExternalLink:t.href?.startsWith(`http`),underlined:!0,label:``,...t,color:`neutral`})}}),d=({children:t,isDarkMode:n,locale:r,components:i})=>c(s,{children:l(t,{components:{...u(n??!1).components,a:t=>c(e,{isExternalLink:t.href?.startsWith(`http`),underlined:!0,locale:r,label:``,...t,color:`neutral`}),...i}})});export{d as HTMLRenderer,u as getIntlayerHTMLOptions};
 //# sourceMappingURL=HTMLRender.mjs.map