@mage-ui/components 1.0.168 → 1.0.170

package/dist/components/controls/dropdown/autocomplete/Autocomplete.d.mts

@@ -2,11 +2,12 @@ import { DropdownValue } from "../DropdownContextProvider.mjs";
 import { ComboboxTargetProps } from "../combobox/ComboboxTarget.mjs";
 import { ComboboxProps } from "../combobox/Combobox.mjs";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { ReactNode } from "react";
 
 //#region src/components/controls/dropdown/autocomplete/Autocomplete.d.ts
 type AutocompleteProps = Omit<ComboboxProps, 'options' | 'classNames'> & {
   name: string;
-  description?: string;
+  description?: ReactNode;
   error?: string;
   url?: string;
   fetcher: (params: {

package/dist/components/controls/dropdown/autocomplete/Autocomplete.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Autocomplete.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/Autocomplete.tsx"],"mappings":";;;;;;KAkCY,iBAAA,GAAoB,IAAA,CAC9B,aAAA;EAGA,IAAA;EACA,WAAA;EACA,KAAA;EACA,GAAA;EACA,OAAA,GAAU,MAAA;IACR,GAAA;IACA,KAAA;EAAA,MACI,OAAA,CAAQ,aAAA;EACd,SAAA;EACA,QAAA;EACA,KAAA;EACA,UAAA,GAAa,IAAA,CAAK,WAAA,CAAY,aAAA;IAC5B,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;IAAA;EAAA;AAAA;AAAA,cAMK,YAAA;EAAgB,IAAA;EAAA,KAAA;EAAA,QAAA;EAAA,YAAA;EAAA,WAAA;EAAA,KAAA;EAAA,WAAA;EAAA,SAAA;EAAA,GAAA;EAAA,OAAA;EAAA,KAAA;EAAA,QAAA;EAAA,SAAA;EAAA,eAAA;EAAA,UAAA;EAAA,SAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAmB1B,iBAAA,KAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"Autocomplete.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/Autocomplete.tsx"],"mappings":";;;;;;;KAkCY,iBAAA,GAAoB,IAAA,CAC9B,aAAA;EAGA,IAAA;EACA,WAAA,GAAc,SAAA;EACd,KAAA;EACA,GAAA;EACA,OAAA,GAAU,MAAA;IACR,GAAA;IACA,KAAA;EAAA,MACI,OAAA,CAAQ,aAAA;EACd,SAAA;EACA,QAAA;EACA,KAAA;EACA,UAAA,GAAa,IAAA,CAAK,WAAA,CAAY,aAAA;IAC5B,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;IAAA;EAAA;AAAA;AAAA,cAMK,YAAA;EAAgB,IAAA;EAAA,KAAA;EAAA,QAAA;EAAA,YAAA;EAAA,WAAA;EAAA,KAAA;EAAA,WAAA;EAAA,SAAA;EAAA,GAAA;EAAA,OAAA;EAAA,KAAA;EAAA,QAAA;EAAA,SAAA;EAAA,eAAA;EAAA,UAAA;EAAA,SAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAmB1B,iBAAA,KAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/dropdown/autocomplete/Autocomplete.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Autocomplete.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/Autocomplete.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport {\n  autocomplete,\n  autocompleteClearButton,\n  autocompleteClearButtonIcon,\n  autocompleteClearButtonIconRaw,\n  autocompleteClearButtonIconRawRoot,\n  autocompleteClearButtonRoot,\n  autocompleteEmpty,\n  autocompleteOption,\n  autocompleteOptions,\n  autocompleteRoot,\n  autocompleteScrollAreaAutosize,\n  autocompleteTextInput,\n  autocompleteTextInputDescription,\n  autocompleteTextInputError,\n  autocompleteTextInputInput,\n  autocompleteTextInputLabel,\n  autocompleteTextInputRequired,\n  autocompleteTextInputRoot,\n  autocompleteTextInputSection,\n  autocompleteTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { useDebouncedCallback } from '@mantine/hooks';\nimport { useQuery } from '@tanstack/react-query';\n\nimport type { ComboboxProps } from '../combobox/Combobox';\nimport { ComboboxOptions } from '../combobox/ComboboxOptions';\nimport type { ComboboxTargetProps } from '../combobox/ComboboxTarget';\nimport { Dropdown } from '../Dropdown';\nimport type { DropdownValue } from '../DropdownContextProvider';\nimport { AutocompleteTarget } from './AutocompleteTarget';\n\nexport type AutocompleteProps = Omit<\n  ComboboxProps,\n  'options' | 'classNames'\n> & {\n  name: string;\n  description?: string;\n  error?: string;\n  url?: string;\n  fetcher: (params: {\n    url?: string;\n    query: string;\n  }) => Promise<DropdownValue[]>;\n  threshold?: number;\n  debounce?: number;\n  query?: string;\n  classNames?: Omit<NonNullable<ComboboxProps['classNames']>, 'target'> & {\n    target?: ComboboxTargetProps['classNames'] & {\n      clearButton?: NonNullable<\n        ComboboxTargetProps['clearButtonProps']\n      >['classNames'];\n    };\n  };\n};\n\nexport const Autocomplete = ({\n  name,\n  label,\n  required,\n  autoComplete,\n  description,\n  error,\n  placeholder,\n  creatable,\n  url,\n  fetcher,\n  query = '',\n  debounce = 500,\n  threshold = 3,\n  clearButtonText,\n  createText,\n  emptyText = 'No hay resultados',\n  classNames,\n  ...props\n}: AutocompleteProps) => {\n  const [searchValue, setSearchValue] = useState(query);\n  const [isTyping, setIsTyping] = useState(false);\n\n  const { data, isFetching } = useQuery<DropdownValue[]>({\n    queryKey: [name, url, searchValue],\n    queryFn: () => {\n      return fetcher({\n        url,\n        query: searchValue,\n      });\n    },\n    initialData: [],\n    enabled: searchValue.length >= threshold,\n  });\n\n  const debounced = useDebouncedCallback((value: string) => {\n    setSearchValue(value);\n    setIsTyping(false);\n  }, debounce);\n\n  const handleSearch = (value: string) => {\n    setIsTyping(true);\n    debounced(value);\n  };\n\n  const {\n    creatable: creatableClassNames,\n    empty: emptyClassNames,\n    target: targetClassNames,\n    scrollArea: scrollAreaClassNames,\n    ...dropdownClassNames\n  } = classNames || {};\n\n  const { clearButton: clearButtonClassNames, ...restTargetClassNames } =\n    targetClassNames || {};\n\n  const targetProps = {\n    placeholder,\n    label,\n    required,\n    autoComplete,\n    description,\n    error,\n    classNames: {\n      dropdownTextInput:\n        restTargetClassNames?.dropdownTextInput ?? autocompleteTextInput(),\n      root: restTargetClassNames?.root ?? autocompleteTextInputRoot(),\n      label: restTargetClassNames?.label ?? autocompleteTextInputLabel(),\n      description:\n        restTargetClassNames?.description ?? autocompleteTextInputDescription(),\n      error: restTargetClassNames?.error ?? autocompleteTextInputError(),\n      wrapper: restTargetClassNames?.wrapper ?? autocompleteTextInputWrapper(),\n      input: restTargetClassNames?.input ?? autocompleteTextInputInput(),\n      section: restTargetClassNames?.section ?? autocompleteTextInputSection(),\n      required:\n        restTargetClassNames?.required ?? autocompleteTextInputRequired(),\n    },\n    clearButtonProps: {\n      label: clearButtonText,\n      classNames: {\n        clearButton:\n          clearButtonClassNames?.clearButton ?? autocompleteClearButton(),\n        root: clearButtonClassNames?.root ?? autocompleteClearButtonRoot(),\n        icon: clearButtonClassNames?.icon ?? autocompleteClearButtonIcon(),\n        iconRaw: {\n          iconRaw:\n            clearButtonClassNames?.iconRaw?.iconRaw ??\n            autocompleteClearButtonIconRaw(),\n          root:\n            clearButtonClassNames?.iconRaw?.root ??\n            autocompleteClearButtonIconRawRoot(),\n        },\n      },\n    },\n  };\n\n  const emptyProps = {\n    emptyText,\n    classNames: {\n      empty: emptyClassNames?.empty ?? autocompleteEmpty(),\n    },\n  };\n\n  const creatableProps = {\n    creatable: creatable ?? false,\n    createText,\n    classNames: creatableClassNames,\n  };\n\n  return (\n    <Dropdown\n      shouldFilter={false}\n      classNames={{\n        dropdown: dropdownClassNames?.dropdown ?? autocomplete(),\n        root: dropdownClassNames?.root ?? autocompleteRoot(),\n        options: dropdownClassNames?.options ?? autocompleteOptions(),\n        option: dropdownClassNames?.option ?? autocompleteOption(),\n        empty: emptyClassNames?.empty ?? autocompleteEmpty(),\n        search: dropdownClassNames?.search,\n      }}\n      scrollAreaProps={{\n        classNames: {\n          dropdownScrollAreaAutosize:\n            scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n            autocompleteScrollAreaAutosize(),\n        },\n      }}\n      target={\n        <AutocompleteTarget\n          debounced={handleSearch}\n          isLoading={isFetching || isTyping}\n          threshold={threshold}\n          showEmpty={emptyText !== undefined}\n          {...targetProps}\n        />\n      }\n      options={data}\n      {...props}\n    >\n      <ComboboxOptions\n        emptyProps={emptyProps}\n        creatableProps={creatableProps}\n      />\n    </Dropdown>\n  );\n};\n"],"mappings":"i/BA0DA,MAAa,GAAgB,CAC3B,OACA,QACA,WACA,eACA,cACA,QACA,cACA,YACA,MACA,UACA,QAAQ,GACR,WAAW,IACX,YAAY,EACZ,kBACA,aACA,YAAY,oBACZ,aACA,GAAG,KACoB,CACvB,GAAM,CAAC,EAAa,GAAkB,EAAS,EAAM,CAC/C,CAAC,EAAU,GAAe,EAAS,GAAM,CAEzC,CAAE,OAAM,cAAe,EAA0B,CACrD,SAAU,CAAC,EAAM,EAAK,EAAY,CAClC,YACS,EAAQ,CACb,MACA,MAAO,EACR,CAAC,CAEJ,YAAa,EAAE,CACf,QAAS,EAAY,QAAU,EAChC,CAAC,CAEI,EAAY,EAAsB,GAAkB,CACxD,EAAe,EAAM,CACrB,EAAY,GAAM,EACjB,EAAS,CAEN,EAAgB,GAAkB,CACtC,EAAY,GAAK,CACjB,EAAU,EAAM,EAGZ,CACJ,UAAW,EACX,MAAO,EACP,OAAQ,GACR,WAAY,GACZ,GAAG,GACD,GAAc,EAAE,CAEd,CAAE,YAAa,EAAuB,GAAG,GAC7C,IAAoB,EAAE,CAElB,GAAc,CAClB,cACA,QACA,WACA,eACA,cACA,QACA,WAAY,CACV,kBACE,GAAsB,mBAAqB,IAAuB,CACpE,KAAM,GAAsB,MAAQ,GAA2B,CAC/D,MAAO,GAAsB,OAAS,GAA4B,CAClE,YACE,GAAsB,aAAe,IAAkC,CACzE,MAAO,GAAsB,OAAS,GAA4B,CAClE,QAAS,GAAsB,SAAW,GAA8B,CACxE,MAAO,GAAsB,OAAS,GAA4B,CAClE,QAAS,GAAsB,SAAW,GAA8B,CACxE,SACE,GAAsB,UAAY,GAA+B,CACpE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YACE,GAAuB,aAAe,GAAyB,CACjE,KAAM,GAAuB,MAAQ,GAA6B,CAClE,KAAM,GAAuB,MAAQ,GAA6B,CAClE,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAAgC,CAClC,KACE,GAAuB,SAAS,MAChC,IAAoC,CACvC,CACF,CACF,CACF,CAEK,GAAa,CACjB,YACA,WAAY,CACV,MAAO,GAAiB,OAAS,GAAmB,CACrD,CACF,CAEK,GAAiB,CACrB,UAAW,GAAa,GACxB,aACA,WAAY,EACb,CAED,OACE,EAAC,EAAD,CACE,aAAc,GACd,WAAY,CACV,SAAU,GAAoB,UAAY,GAAc,CACxD,KAAM,GAAoB,MAAQ,GAAkB,CACpD,QAAS,GAAoB,SAAW,GAAqB,CAC7D,OAAQ,GAAoB,QAAU,GAAoB,CAC1D,MAAO,GAAiB,OAAS,GAAmB,CACpD,OAAQ,GAAoB,OAC7B,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,IAAsB,4BACtB,IAAgC,CACnC,CACF,CACD,OACE,EAAC,EAAD,CACE,UAAW,EACX,UAAW,GAAc,EACd,YACX,UAAW,IAAc,IAAA,GACzB,GAAI,GACJ,CAAA,CAEJ,QAAS,EACT,GAAI,WAEJ,EAAC,EAAD,CACc,cACI,kBAChB,CAAA,CACO,CAAA"}
+{"version":3,"file":"Autocomplete.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/autocomplete/Autocomplete.tsx"],"sourcesContent":["import { type ReactNode, useState } from 'react';\n\nimport {\n  autocomplete,\n  autocompleteClearButton,\n  autocompleteClearButtonIcon,\n  autocompleteClearButtonIconRaw,\n  autocompleteClearButtonIconRawRoot,\n  autocompleteClearButtonRoot,\n  autocompleteEmpty,\n  autocompleteOption,\n  autocompleteOptions,\n  autocompleteRoot,\n  autocompleteScrollAreaAutosize,\n  autocompleteTextInput,\n  autocompleteTextInputDescription,\n  autocompleteTextInputError,\n  autocompleteTextInputInput,\n  autocompleteTextInputLabel,\n  autocompleteTextInputRequired,\n  autocompleteTextInputRoot,\n  autocompleteTextInputSection,\n  autocompleteTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { useDebouncedCallback } from '@mantine/hooks';\nimport { useQuery } from '@tanstack/react-query';\n\nimport type { ComboboxProps } from '../combobox/Combobox';\nimport { ComboboxOptions } from '../combobox/ComboboxOptions';\nimport type { ComboboxTargetProps } from '../combobox/ComboboxTarget';\nimport { Dropdown } from '../Dropdown';\nimport type { DropdownValue } from '../DropdownContextProvider';\nimport { AutocompleteTarget } from './AutocompleteTarget';\n\nexport type AutocompleteProps = Omit<\n  ComboboxProps,\n  'options' | 'classNames'\n> & {\n  name: string;\n  description?: ReactNode;\n  error?: string;\n  url?: string;\n  fetcher: (params: {\n    url?: string;\n    query: string;\n  }) => Promise<DropdownValue[]>;\n  threshold?: number;\n  debounce?: number;\n  query?: string;\n  classNames?: Omit<NonNullable<ComboboxProps['classNames']>, 'target'> & {\n    target?: ComboboxTargetProps['classNames'] & {\n      clearButton?: NonNullable<\n        ComboboxTargetProps['clearButtonProps']\n      >['classNames'];\n    };\n  };\n};\n\nexport const Autocomplete = ({\n  name,\n  label,\n  required,\n  autoComplete,\n  description,\n  error,\n  placeholder,\n  creatable,\n  url,\n  fetcher,\n  query = '',\n  debounce = 500,\n  threshold = 3,\n  clearButtonText,\n  createText,\n  emptyText = 'No hay resultados',\n  classNames,\n  ...props\n}: AutocompleteProps) => {\n  const [searchValue, setSearchValue] = useState(query);\n  const [isTyping, setIsTyping] = useState(false);\n\n  const { data, isFetching } = useQuery<DropdownValue[]>({\n    queryKey: [name, url, searchValue],\n    queryFn: () => {\n      return fetcher({\n        url,\n        query: searchValue,\n      });\n    },\n    initialData: [],\n    enabled: searchValue.length >= threshold,\n  });\n\n  const debounced = useDebouncedCallback((value: string) => {\n    setSearchValue(value);\n    setIsTyping(false);\n  }, debounce);\n\n  const handleSearch = (value: string) => {\n    setIsTyping(true);\n    debounced(value);\n  };\n\n  const {\n    creatable: creatableClassNames,\n    empty: emptyClassNames,\n    target: targetClassNames,\n    scrollArea: scrollAreaClassNames,\n    ...dropdownClassNames\n  } = classNames || {};\n\n  const { clearButton: clearButtonClassNames, ...restTargetClassNames } =\n    targetClassNames || {};\n\n  const targetProps = {\n    placeholder,\n    label,\n    required,\n    autoComplete,\n    description,\n    error,\n    classNames: {\n      dropdownTextInput:\n        restTargetClassNames?.dropdownTextInput ?? autocompleteTextInput(),\n      root: restTargetClassNames?.root ?? autocompleteTextInputRoot(),\n      label: restTargetClassNames?.label ?? autocompleteTextInputLabel(),\n      description:\n        restTargetClassNames?.description ?? autocompleteTextInputDescription(),\n      error: restTargetClassNames?.error ?? autocompleteTextInputError(),\n      wrapper: restTargetClassNames?.wrapper ?? autocompleteTextInputWrapper(),\n      input: restTargetClassNames?.input ?? autocompleteTextInputInput(),\n      section: restTargetClassNames?.section ?? autocompleteTextInputSection(),\n      required:\n        restTargetClassNames?.required ?? autocompleteTextInputRequired(),\n    },\n    clearButtonProps: {\n      label: clearButtonText,\n      classNames: {\n        clearButton:\n          clearButtonClassNames?.clearButton ?? autocompleteClearButton(),\n        root: clearButtonClassNames?.root ?? autocompleteClearButtonRoot(),\n        icon: clearButtonClassNames?.icon ?? autocompleteClearButtonIcon(),\n        iconRaw: {\n          iconRaw:\n            clearButtonClassNames?.iconRaw?.iconRaw ??\n            autocompleteClearButtonIconRaw(),\n          root:\n            clearButtonClassNames?.iconRaw?.root ??\n            autocompleteClearButtonIconRawRoot(),\n        },\n      },\n    },\n  };\n\n  const emptyProps = {\n    emptyText,\n    classNames: {\n      empty: emptyClassNames?.empty ?? autocompleteEmpty(),\n    },\n  };\n\n  const creatableProps = {\n    creatable: creatable ?? false,\n    createText,\n    classNames: creatableClassNames,\n  };\n\n  return (\n    <Dropdown\n      shouldFilter={false}\n      classNames={{\n        dropdown: dropdownClassNames?.dropdown ?? autocomplete(),\n        root: dropdownClassNames?.root ?? autocompleteRoot(),\n        options: dropdownClassNames?.options ?? autocompleteOptions(),\n        option: dropdownClassNames?.option ?? autocompleteOption(),\n        empty: emptyClassNames?.empty ?? autocompleteEmpty(),\n        search: dropdownClassNames?.search,\n      }}\n      scrollAreaProps={{\n        classNames: {\n          dropdownScrollAreaAutosize:\n            scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n            autocompleteScrollAreaAutosize(),\n        },\n      }}\n      target={\n        <AutocompleteTarget\n          debounced={handleSearch}\n          isLoading={isFetching || isTyping}\n          threshold={threshold}\n          showEmpty={emptyText !== undefined}\n          {...targetProps}\n        />\n      }\n      options={data}\n      {...props}\n    >\n      <ComboboxOptions\n        emptyProps={emptyProps}\n        creatableProps={creatableProps}\n      />\n    </Dropdown>\n  );\n};\n"],"mappings":"i/BA0DA,MAAa,GAAgB,CAC3B,OACA,QACA,WACA,eACA,cACA,QACA,cACA,YACA,MACA,UACA,QAAQ,GACR,WAAW,IACX,YAAY,EACZ,kBACA,aACA,YAAY,oBACZ,aACA,GAAG,KACoB,CACvB,GAAM,CAAC,EAAa,GAAkB,EAAS,EAAM,CAC/C,CAAC,EAAU,GAAe,EAAS,GAAM,CAEzC,CAAE,OAAM,cAAe,EAA0B,CACrD,SAAU,CAAC,EAAM,EAAK,EAAY,CAClC,YACS,EAAQ,CACb,MACA,MAAO,EACR,CAAC,CAEJ,YAAa,EAAE,CACf,QAAS,EAAY,QAAU,EAChC,CAAC,CAEI,EAAY,EAAsB,GAAkB,CACxD,EAAe,EAAM,CACrB,EAAY,GAAM,EACjB,EAAS,CAEN,EAAgB,GAAkB,CACtC,EAAY,GAAK,CACjB,EAAU,EAAM,EAGZ,CACJ,UAAW,EACX,MAAO,EACP,OAAQ,GACR,WAAY,GACZ,GAAG,GACD,GAAc,EAAE,CAEd,CAAE,YAAa,EAAuB,GAAG,GAC7C,IAAoB,EAAE,CAElB,GAAc,CAClB,cACA,QACA,WACA,eACA,cACA,QACA,WAAY,CACV,kBACE,GAAsB,mBAAqB,IAAuB,CACpE,KAAM,GAAsB,MAAQ,GAA2B,CAC/D,MAAO,GAAsB,OAAS,GAA4B,CAClE,YACE,GAAsB,aAAe,IAAkC,CACzE,MAAO,GAAsB,OAAS,GAA4B,CAClE,QAAS,GAAsB,SAAW,GAA8B,CACxE,MAAO,GAAsB,OAAS,GAA4B,CAClE,QAAS,GAAsB,SAAW,GAA8B,CACxE,SACE,GAAsB,UAAY,GAA+B,CACpE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YACE,GAAuB,aAAe,GAAyB,CACjE,KAAM,GAAuB,MAAQ,GAA6B,CAClE,KAAM,GAAuB,MAAQ,GAA6B,CAClE,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAAgC,CAClC,KACE,GAAuB,SAAS,MAChC,IAAoC,CACvC,CACF,CACF,CACF,CAEK,GAAa,CACjB,YACA,WAAY,CACV,MAAO,GAAiB,OAAS,GAAmB,CACrD,CACF,CAEK,GAAiB,CACrB,UAAW,GAAa,GACxB,aACA,WAAY,EACb,CAED,OACE,EAAC,EAAD,CACE,aAAc,GACd,WAAY,CACV,SAAU,GAAoB,UAAY,GAAc,CACxD,KAAM,GAAoB,MAAQ,GAAkB,CACpD,QAAS,GAAoB,SAAW,GAAqB,CAC7D,OAAQ,GAAoB,QAAU,GAAoB,CAC1D,MAAO,GAAiB,OAAS,GAAmB,CACpD,OAAQ,GAAoB,OAC7B,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,IAAsB,4BACtB,IAAgC,CACnC,CACF,CACD,OACE,EAAC,EAAD,CACE,UAAW,EACX,UAAW,GAAc,EACd,YACX,UAAW,IAAc,IAAA,GACzB,GAAI,GACJ,CAAA,CAEJ,QAAS,EACT,GAAI,WAEJ,EAAC,EAAD,CACc,cACI,kBAChB,CAAA,CACO,CAAA"}

package/dist/components/controls/dropdown/combobox/Combobox.d.mts

@@ -7,7 +7,8 @@ import { ReactNode } from "react";
 
 //#region src/components/controls/dropdown/combobox/Combobox.d.ts
 type ComboboxProps = Omit<DropdownProps, 'classNames' | 'target' | 'children'> & {
-  label?: string;
+  label?: ReactNode;
+  description?: ReactNode;
   placeholder?: string;
   creatable?: boolean;
   createText?: string;
@@ -29,6 +30,7 @@ type ComboboxProps = Omit<DropdownProps, 'classNames' | 'target' | 'children'> &
 };
 declare const Combobox: ({
   label,
+  description,
   placeholder,
   required,
   autoComplete,

package/dist/components/controls/dropdown/combobox/Combobox.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"mappings":";;;;;;;;KAuCY,aAAA,GAAgB,IAAA,CAC1B,aAAA;EAGA,KAAA;EACA,WAAA;EACA,SAAA;EACA,UAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA,GAAY,SAAA;EACZ,KAAA;EACA,QAAA;EACA,YAAA;EACA,UAAA,GAAa,aAAA;IACX,SAAA,GAAY,4BAAA;IACZ,KAAA,GAAQ,wBAAA;IACR,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;MAEF,OAAA,GAAU,WAAA,CAAY,mBAAA;IAAA;IAExB,UAAA,GAAa,WAAA,CAAY,aAAA;EAAA;AAAA;AAAA,cAIhB,QAAA;EAAY,KAAA;EAAA,WAAA;EAAA,QAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,eAAA;EAAA,SAAA;EAAA,SAAA;EAAA,KAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAatB,aAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"Combobox.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"mappings":";;;;;;;;KAuCY,aAAA,GAAgB,IAAA,CAC1B,aAAA;EAGA,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,WAAA;EACA,SAAA;EACA,UAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA,GAAY,SAAA;EACZ,KAAA;EACA,QAAA;EACA,YAAA;EACA,UAAA,GAAa,aAAA;IACX,SAAA,GAAY,4BAAA;IACZ,KAAA,GAAQ,wBAAA;IACR,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;MAEF,OAAA,GAAU,WAAA,CAAY,mBAAA;IAAA;IAExB,UAAA,GAAa,WAAA,CAAY,aAAA;EAAA;AAAA;AAAA,cAIhB,QAAA;EAAY,KAAA;EAAA,WAAA;EAAA,WAAA;EAAA,QAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,eAAA;EAAA,SAAA;EAAA,SAAA;EAAA,KAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GActB,aAAA,KAAa,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/dropdown/combobox/Combobox.mjs

@@ -1,2 +1,2 @@
-import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"./ComboboxOptions.mjs";import{ComboboxTarget as n}from"./ComboboxTarget.mjs";import{combobox as r,comboboxChevron as i,comboboxChevronIcon as a,comboboxChevronIconRoot as o,comboboxChevronRoot as s,comboboxClearButton as c,comboboxClearButtonIcon as l,comboboxClearButtonIconRaw as u,comboboxClearButtonIconRawRoot as d,comboboxClearButtonRoot as ee,comboboxEmpty as f,comboboxOption as p,comboboxOptionCreateIcon as m,comboboxOptionCreateIconIconRaw as h,comboboxOptionCreateIconIconRawRoot as g,comboboxOptionCreateIconRoot as _,comboboxOptions as v,comboboxRoot as y,comboboxScrollAreaAutosize as b,comboboxTextInput as x,comboboxTextInputDescription as S,comboboxTextInputError as C,comboboxTextInputInput as w,comboboxTextInputLabel as T,comboboxTextInputRequired as E,comboboxTextInputRoot as D,comboboxTextInputSection as O,comboboxTextInputWrapper as k}from"@mage-ui/styled-system/recipes";import{jsx as A}from"react/jsx-runtime";const j=({label:j,placeholder:M,required:N,autoComplete:P,creatable:te,createText:F,clearButtonText:I,emptyText:L=`No results`,startSlot:R,error:z,classNames:B,...V})=>{let{creatable:H,empty:U,target:W,scrollArea:G,...K}=B||{},{clearButton:q,chevron:J,...Y}=W||{},X={placeholder:M,label:j,required:N,autoComplete:P,error:z,startSlot:R,classNames:{dropdownTextInput:Y?.dropdownTextInput??x(),root:Y?.root??D(),label:Y?.label??T(),description:Y?.description??S(),error:Y?.error??C(),wrapper:Y?.wrapper??k(),input:Y?.input??w(),section:Y?.section??O(),required:Y?.required??E()},clearButtonProps:{label:I,classNames:{clearButton:q?.clearButton??c(),root:q?.root??ee(),icon:q?.icon??l(),iconRaw:{iconRaw:q?.iconRaw?.iconRaw??u(),root:q?.iconRaw?.root??d()}}},chevronProps:{classNames:{chevron:J?.chevron??i(),root:J?.root??s(),open:{iconRaw:J?.open?.iconRaw??a(),root:J?.open?.root??o()},close:{iconRaw:J?.close?.iconRaw??a(),root:J?.close?.root??o()}}}},Z=K?.dropdown??r(),Q=K?.root??y(),ne=K?.options??v(),re=K?.option??p(),$=U?.empty??f(),ie=K?.search,ae={emptyText:L,classNames:{empty:U?.empty??$}},oe={creatable:te??!1,createText:F,classNames:{create:H?.create,createIcon:{createIcon:H?.createIcon?.createIcon??m(),root:H?.createIcon?.root??_(),iconRaw:{iconRaw:H?.createIcon?.iconRaw?.iconRaw??h(),root:H?.createIcon?.iconRaw?.root??g()}}}};return A(e,{classNames:{dropdown:Z,root:Q,options:ne,option:re,empty:$,search:ie},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:G?.dropdownScrollAreaAutosize??b()}},target:A(n,{...X}),...V,children:A(t,{emptyProps:ae,creatableProps:oe})})};export{j as Combobox};
+import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"./ComboboxOptions.mjs";import{ComboboxTarget as n}from"./ComboboxTarget.mjs";import{combobox as r,comboboxChevron as i,comboboxChevronIcon as a,comboboxChevronIconRoot as o,comboboxChevronRoot as s,comboboxClearButton as c,comboboxClearButtonIcon as l,comboboxClearButtonIconRaw as u,comboboxClearButtonIconRawRoot as d,comboboxClearButtonRoot as ee,comboboxEmpty as f,comboboxOption as p,comboboxOptionCreateIcon as m,comboboxOptionCreateIconIconRaw as h,comboboxOptionCreateIconIconRawRoot as g,comboboxOptionCreateIconRoot as _,comboboxOptions as v,comboboxRoot as y,comboboxScrollAreaAutosize as b,comboboxTextInput as x,comboboxTextInputDescription as S,comboboxTextInputError as C,comboboxTextInputInput as w,comboboxTextInputLabel as T,comboboxTextInputRequired as E,comboboxTextInputRoot as D,comboboxTextInputSection as O,comboboxTextInputWrapper as k}from"@mage-ui/styled-system/recipes";import{jsx as A}from"react/jsx-runtime";const j=({label:j,description:M,placeholder:N,required:P,autoComplete:te,creatable:F,createText:I,clearButtonText:L,emptyText:R=`No results`,startSlot:z,error:B,classNames:V,...H})=>{let{creatable:U,empty:W,target:G,scrollArea:K,...q}=V||{},{clearButton:J,chevron:Y,...X}=G||{},Z={placeholder:N,label:j,description:M,required:P,autoComplete:te,error:B,startSlot:z,classNames:{dropdownTextInput:X?.dropdownTextInput??x(),root:X?.root??D(),label:X?.label??T(),description:X?.description??S(),error:X?.error??C(),wrapper:X?.wrapper??k(),input:X?.input??w(),section:X?.section??O(),required:X?.required??E()},clearButtonProps:{label:L,classNames:{clearButton:J?.clearButton??c(),root:J?.root??ee(),icon:J?.icon??l(),iconRaw:{iconRaw:J?.iconRaw?.iconRaw??u(),root:J?.iconRaw?.root??d()}}},chevronProps:{classNames:{chevron:Y?.chevron??i(),root:Y?.root??s(),open:{iconRaw:Y?.open?.iconRaw??a(),root:Y?.open?.root??o()},close:{iconRaw:Y?.close?.iconRaw??a(),root:Y?.close?.root??o()}}}},Q=q?.dropdown??r(),ne=q?.root??y(),re=q?.options??v(),ie=q?.option??p(),$=W?.empty??f(),ae=q?.search,oe={emptyText:R,classNames:{empty:W?.empty??$}},se={creatable:F??!1,createText:I,classNames:{create:U?.create,createIcon:{createIcon:U?.createIcon?.createIcon??m(),root:U?.createIcon?.root??_(),iconRaw:{iconRaw:U?.createIcon?.iconRaw?.iconRaw??h(),root:U?.createIcon?.iconRaw?.root??g()}}}};return A(e,{classNames:{dropdown:Q,root:ne,options:re,option:ie,empty:$,search:ae},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:K?.dropdownScrollAreaAutosize??b()}},target:A(n,{...Z}),...H,children:A(t,{emptyProps:oe,creatableProps:se})})};export{j as Combobox};
 //# sourceMappingURL=Combobox.mjs.map

package/dist/components/controls/dropdown/combobox/Combobox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  combobox,\n  comboboxChevron,\n  comboboxChevronIcon,\n  comboboxChevronIconRoot,\n  comboboxChevronRoot,\n  comboboxClearButton,\n  comboboxClearButtonIcon,\n  comboboxClearButtonIconRaw,\n  comboboxClearButtonIconRawRoot,\n  comboboxClearButtonRoot,\n  comboboxEmpty,\n  comboboxOption,\n  comboboxOptionCreateIcon,\n  comboboxOptionCreateIconIconRaw,\n  comboboxOptionCreateIconIconRawRoot,\n  comboboxOptionCreateIconRoot,\n  comboboxOptions,\n  comboboxRoot,\n  comboboxScrollAreaAutosize,\n  comboboxTextInput,\n  comboboxTextInputDescription,\n  comboboxTextInputError,\n  comboboxTextInputInput,\n  comboboxTextInputLabel,\n  comboboxTextInputRequired,\n  comboboxTextInputRoot,\n  comboboxTextInputSection,\n  comboboxTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { Dropdown, type DropdownProps } from '../Dropdown';\nimport type { ComboboxCreatableOptionProps } from './ComboboxCreatableOption';\nimport type { ComboboxEmptyOptionProps } from './ComboboxEmptyOption';\nimport { ComboboxOptions } from './ComboboxOptions';\nimport { ComboboxTarget, type ComboboxTargetProps } from './ComboboxTarget';\n\nexport type ComboboxProps = Omit<\n  DropdownProps,\n  'classNames' | 'target' | 'children'\n> & {\n  label?: string;\n  placeholder?: string;\n  creatable?: boolean;\n  createText?: string;\n  emptyText?: string;\n  clearButtonText?: string;\n  startSlot?: ReactNode;\n  error?: string;\n  required?: boolean;\n  autoComplete?: string;\n  classNames?: DropdownProps['classNames'] & {\n    creatable?: ComboboxCreatableOptionProps['classNames'];\n    empty?: ComboboxEmptyOptionProps['classNames'];\n    target?: ComboboxTargetProps['classNames'] & {\n      clearButton?: NonNullable<\n        ComboboxTargetProps['clearButtonProps']\n      >['classNames'];\n      chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];\n    };\n    scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];\n  };\n};\n\nexport const Combobox = ({\n  label,\n  placeholder,\n  required,\n  autoComplete,\n  creatable,\n  createText,\n  clearButtonText,\n  emptyText = 'No results',\n  startSlot,\n  error,\n  classNames,\n  ...props\n}: ComboboxProps) => {\n  const {\n    creatable: creatableClassNames,\n    empty: emptyClassNames,\n    target: targetClassNames,\n    scrollArea: scrollAreaClassNames,\n    ...dropdownClassNames\n  } = classNames || {};\n\n  const {\n    clearButton: clearButtonClassNames,\n    chevron: chevronClassNames,\n    ...restTargetClassNames\n  } = targetClassNames || {};\n\n  const targetProps = {\n    placeholder,\n    label,\n    required,\n    autoComplete,\n    error,\n    startSlot,\n    classNames: {\n      dropdownTextInput:\n        restTargetClassNames?.dropdownTextInput ?? comboboxTextInput(),\n      root: restTargetClassNames?.root ?? comboboxTextInputRoot(),\n      label: restTargetClassNames?.label ?? comboboxTextInputLabel(),\n      description:\n        restTargetClassNames?.description ?? comboboxTextInputDescription(),\n      error: restTargetClassNames?.error ?? comboboxTextInputError(),\n      wrapper: restTargetClassNames?.wrapper ?? comboboxTextInputWrapper(),\n      input: restTargetClassNames?.input ?? comboboxTextInputInput(),\n      section: restTargetClassNames?.section ?? comboboxTextInputSection(),\n      required: restTargetClassNames?.required ?? comboboxTextInputRequired(),\n    },\n    clearButtonProps: {\n      label: clearButtonText,\n      classNames: {\n        clearButton:\n          clearButtonClassNames?.clearButton ?? comboboxClearButton(),\n        root: clearButtonClassNames?.root ?? comboboxClearButtonRoot(),\n        icon: clearButtonClassNames?.icon ?? comboboxClearButtonIcon(),\n        iconRaw: {\n          iconRaw:\n            clearButtonClassNames?.iconRaw?.iconRaw ??\n            comboboxClearButtonIconRaw(),\n          root:\n            clearButtonClassNames?.iconRaw?.root ??\n            comboboxClearButtonIconRawRoot(),\n        },\n      },\n    },\n    chevronProps: {\n      classNames: {\n        chevron: chevronClassNames?.chevron ?? comboboxChevron(),\n        root: chevronClassNames?.root ?? comboboxChevronRoot(),\n        open: {\n          iconRaw: chevronClassNames?.open?.iconRaw ?? comboboxChevronIcon(),\n          root: chevronClassNames?.open?.root ?? comboboxChevronIconRoot(),\n        },\n        close: {\n          iconRaw: chevronClassNames?.close?.iconRaw ?? comboboxChevronIcon(),\n          root: chevronClassNames?.close?.root ?? comboboxChevronIconRoot(),\n        },\n      },\n    },\n  };\n\n  const dropdownClassName = dropdownClassNames?.dropdown ?? combobox();\n  const rootClassName = dropdownClassNames?.root ?? comboboxRoot();\n  const optionsClassName = dropdownClassNames?.options ?? comboboxOptions();\n  const optionClassName = dropdownClassNames?.option ?? comboboxOption();\n  const emptyClassName = emptyClassNames?.empty ?? comboboxEmpty();\n  const searchClassName = dropdownClassNames?.search;\n\n  const emptyProps = {\n    emptyText,\n    classNames: {\n      empty: emptyClassNames?.empty ?? emptyClassName,\n    },\n  };\n\n  const creatableProps = {\n    creatable: creatable ?? false,\n    createText,\n    classNames: {\n      create: creatableClassNames?.create,\n      createIcon: {\n        createIcon:\n          creatableClassNames?.createIcon?.createIcon ??\n          comboboxOptionCreateIcon(),\n        root:\n          creatableClassNames?.createIcon?.root ??\n          comboboxOptionCreateIconRoot(),\n        iconRaw: {\n          iconRaw:\n            creatableClassNames?.createIcon?.iconRaw?.iconRaw ??\n            comboboxOptionCreateIconIconRaw(),\n          root:\n            creatableClassNames?.createIcon?.iconRaw?.root ??\n            comboboxOptionCreateIconIconRawRoot(),\n        },\n      },\n    },\n  };\n\n  return (\n    <Dropdown\n      classNames={{\n        dropdown: dropdownClassName,\n        root: rootClassName,\n        options: optionsClassName,\n        option: optionClassName,\n        empty: emptyClassName,\n        search: searchClassName,\n      }}\n      scrollAreaProps={{\n        classNames: {\n          dropdownScrollAreaAutosize:\n            scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n            comboboxScrollAreaAutosize(),\n        },\n      }}\n      target={<ComboboxTarget {...targetProps} />}\n      {...props}\n    >\n      <ComboboxOptions\n        emptyProps={emptyProps}\n        creatableProps={creatableProps}\n      />\n    </Dropdown>\n  );\n};\n"],"mappings":"s/BAkEA,MAAa,GAAY,CACvB,QACA,cACA,WACA,eACA,aACA,aACA,kBACA,YAAY,aACZ,YACA,QACA,aACA,GAAG,KACgB,CACnB,GAAM,CACJ,UAAW,EACX,MAAO,EACP,OAAQ,EACR,WAAY,EACZ,GAAG,GACD,GAAc,EAAE,CAEd,CACJ,YAAa,EACb,QAAS,EACT,GAAG,GACD,GAAoB,EAAE,CAEpB,EAAc,CAClB,cACA,QACA,WACA,eACA,QACA,YACA,WAAY,CACV,kBACE,GAAsB,mBAAqB,GAAmB,CAChE,KAAM,GAAsB,MAAQ,GAAuB,CAC3D,MAAO,GAAsB,OAAS,GAAwB,CAC9D,YACE,GAAsB,aAAe,GAA8B,CACrE,MAAO,GAAsB,OAAS,GAAwB,CAC9D,QAAS,GAAsB,SAAW,GAA0B,CACpE,MAAO,GAAsB,OAAS,GAAwB,CAC9D,QAAS,GAAsB,SAAW,GAA0B,CACpE,SAAU,GAAsB,UAAY,GAA2B,CACxE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YACE,GAAuB,aAAe,GAAqB,CAC7D,KAAM,GAAuB,MAAQ,IAAyB,CAC9D,KAAM,GAAuB,MAAQ,GAAyB,CAC9D,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAA4B,CAC9B,KACE,GAAuB,SAAS,MAChC,GAAgC,CACnC,CACF,CACF,CACD,aAAc,CACZ,WAAY,CACV,QAAS,GAAmB,SAAW,GAAiB,CACxD,KAAM,GAAmB,MAAQ,GAAqB,CACtD,KAAM,CACJ,QAAS,GAAmB,MAAM,SAAW,GAAqB,CAClE,KAAM,GAAmB,MAAM,MAAQ,GAAyB,CACjE,CACD,MAAO,CACL,QAAS,GAAmB,OAAO,SAAW,GAAqB,CACnE,KAAM,GAAmB,OAAO,MAAQ,GAAyB,CAClE,CACF,CACF,CACF,CAEK,EAAoB,GAAoB,UAAY,GAAU,CAC9D,EAAgB,GAAoB,MAAQ,GAAc,CAC1D,GAAmB,GAAoB,SAAW,GAAiB,CACnE,GAAkB,GAAoB,QAAU,GAAgB,CAChE,EAAiB,GAAiB,OAAS,GAAe,CAC1D,GAAkB,GAAoB,OAEtC,GAAa,CACjB,YACA,WAAY,CACV,MAAO,GAAiB,OAAS,EAClC,CACF,CAEK,GAAiB,CACrB,UAAW,IAAa,GACxB,aACA,WAAY,CACV,OAAQ,GAAqB,OAC7B,WAAY,CACV,WACE,GAAqB,YAAY,YACjC,GAA0B,CAC5B,KACE,GAAqB,YAAY,MACjC,GAA8B,CAChC,QAAS,CACP,QACE,GAAqB,YAAY,SAAS,SAC1C,GAAiC,CACnC,KACE,GAAqB,YAAY,SAAS,MAC1C,GAAqC,CACxC,CACF,CACF,CACF,CAED,OACE,EAAC,EAAD,CACE,WAAY,CACV,SAAU,EACV,KAAM,EACN,QAAS,GACT,OAAQ,GACR,MAAO,EACP,OAAQ,GACT,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,GAAsB,4BACtB,GAA4B,CAC/B,CACF,CACD,OAAQ,EAAC,EAAD,CAAgB,GAAI,EAAe,CAAA,CAC3C,GAAI,WAEJ,EAAC,EAAD,CACc,cACI,kBAChB,CAAA,CACO,CAAA"}
+{"version":3,"file":"Combobox.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/combobox/Combobox.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  combobox,\n  comboboxChevron,\n  comboboxChevronIcon,\n  comboboxChevronIconRoot,\n  comboboxChevronRoot,\n  comboboxClearButton,\n  comboboxClearButtonIcon,\n  comboboxClearButtonIconRaw,\n  comboboxClearButtonIconRawRoot,\n  comboboxClearButtonRoot,\n  comboboxEmpty,\n  comboboxOption,\n  comboboxOptionCreateIcon,\n  comboboxOptionCreateIconIconRaw,\n  comboboxOptionCreateIconIconRawRoot,\n  comboboxOptionCreateIconRoot,\n  comboboxOptions,\n  comboboxRoot,\n  comboboxScrollAreaAutosize,\n  comboboxTextInput,\n  comboboxTextInputDescription,\n  comboboxTextInputError,\n  comboboxTextInputInput,\n  comboboxTextInputLabel,\n  comboboxTextInputRequired,\n  comboboxTextInputRoot,\n  comboboxTextInputSection,\n  comboboxTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { Dropdown, type DropdownProps } from '../Dropdown';\nimport type { ComboboxCreatableOptionProps } from './ComboboxCreatableOption';\nimport type { ComboboxEmptyOptionProps } from './ComboboxEmptyOption';\nimport { ComboboxOptions } from './ComboboxOptions';\nimport { ComboboxTarget, type ComboboxTargetProps } from './ComboboxTarget';\n\nexport type ComboboxProps = Omit<\n  DropdownProps,\n  'classNames' | 'target' | 'children'\n> & {\n  label?: ReactNode;\n  description?: ReactNode;\n  placeholder?: string;\n  creatable?: boolean;\n  createText?: string;\n  emptyText?: string;\n  clearButtonText?: string;\n  startSlot?: ReactNode;\n  error?: string;\n  required?: boolean;\n  autoComplete?: string;\n  classNames?: DropdownProps['classNames'] & {\n    creatable?: ComboboxCreatableOptionProps['classNames'];\n    empty?: ComboboxEmptyOptionProps['classNames'];\n    target?: ComboboxTargetProps['classNames'] & {\n      clearButton?: NonNullable<\n        ComboboxTargetProps['clearButtonProps']\n      >['classNames'];\n      chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];\n    };\n    scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];\n  };\n};\n\nexport const Combobox = ({\n  label,\n  description,\n  placeholder,\n  required,\n  autoComplete,\n  creatable,\n  createText,\n  clearButtonText,\n  emptyText = 'No results',\n  startSlot,\n  error,\n  classNames,\n  ...props\n}: ComboboxProps) => {\n  const {\n    creatable: creatableClassNames,\n    empty: emptyClassNames,\n    target: targetClassNames,\n    scrollArea: scrollAreaClassNames,\n    ...dropdownClassNames\n  } = classNames || {};\n\n  const {\n    clearButton: clearButtonClassNames,\n    chevron: chevronClassNames,\n    ...restTargetClassNames\n  } = targetClassNames || {};\n\n  const targetProps = {\n    placeholder,\n    label,\n    description,\n    required,\n    autoComplete,\n    error,\n    startSlot,\n    classNames: {\n      dropdownTextInput:\n        restTargetClassNames?.dropdownTextInput ?? comboboxTextInput(),\n      root: restTargetClassNames?.root ?? comboboxTextInputRoot(),\n      label: restTargetClassNames?.label ?? comboboxTextInputLabel(),\n      description:\n        restTargetClassNames?.description ?? comboboxTextInputDescription(),\n      error: restTargetClassNames?.error ?? comboboxTextInputError(),\n      wrapper: restTargetClassNames?.wrapper ?? comboboxTextInputWrapper(),\n      input: restTargetClassNames?.input ?? comboboxTextInputInput(),\n      section: restTargetClassNames?.section ?? comboboxTextInputSection(),\n      required: restTargetClassNames?.required ?? comboboxTextInputRequired(),\n    },\n    clearButtonProps: {\n      label: clearButtonText,\n      classNames: {\n        clearButton:\n          clearButtonClassNames?.clearButton ?? comboboxClearButton(),\n        root: clearButtonClassNames?.root ?? comboboxClearButtonRoot(),\n        icon: clearButtonClassNames?.icon ?? comboboxClearButtonIcon(),\n        iconRaw: {\n          iconRaw:\n            clearButtonClassNames?.iconRaw?.iconRaw ??\n            comboboxClearButtonIconRaw(),\n          root:\n            clearButtonClassNames?.iconRaw?.root ??\n            comboboxClearButtonIconRawRoot(),\n        },\n      },\n    },\n    chevronProps: {\n      classNames: {\n        chevron: chevronClassNames?.chevron ?? comboboxChevron(),\n        root: chevronClassNames?.root ?? comboboxChevronRoot(),\n        open: {\n          iconRaw: chevronClassNames?.open?.iconRaw ?? comboboxChevronIcon(),\n          root: chevronClassNames?.open?.root ?? comboboxChevronIconRoot(),\n        },\n        close: {\n          iconRaw: chevronClassNames?.close?.iconRaw ?? comboboxChevronIcon(),\n          root: chevronClassNames?.close?.root ?? comboboxChevronIconRoot(),\n        },\n      },\n    },\n  };\n\n  const dropdownClassName = dropdownClassNames?.dropdown ?? combobox();\n  const rootClassName = dropdownClassNames?.root ?? comboboxRoot();\n  const optionsClassName = dropdownClassNames?.options ?? comboboxOptions();\n  const optionClassName = dropdownClassNames?.option ?? comboboxOption();\n  const emptyClassName = emptyClassNames?.empty ?? comboboxEmpty();\n  const searchClassName = dropdownClassNames?.search;\n\n  const emptyProps = {\n    emptyText,\n    classNames: {\n      empty: emptyClassNames?.empty ?? emptyClassName,\n    },\n  };\n\n  const creatableProps = {\n    creatable: creatable ?? false,\n    createText,\n    classNames: {\n      create: creatableClassNames?.create,\n      createIcon: {\n        createIcon:\n          creatableClassNames?.createIcon?.createIcon ??\n          comboboxOptionCreateIcon(),\n        root:\n          creatableClassNames?.createIcon?.root ??\n          comboboxOptionCreateIconRoot(),\n        iconRaw: {\n          iconRaw:\n            creatableClassNames?.createIcon?.iconRaw?.iconRaw ??\n            comboboxOptionCreateIconIconRaw(),\n          root:\n            creatableClassNames?.createIcon?.iconRaw?.root ??\n            comboboxOptionCreateIconIconRawRoot(),\n        },\n      },\n    },\n  };\n\n  return (\n    <Dropdown\n      classNames={{\n        dropdown: dropdownClassName,\n        root: rootClassName,\n        options: optionsClassName,\n        option: optionClassName,\n        empty: emptyClassName,\n        search: searchClassName,\n      }}\n      scrollAreaProps={{\n        classNames: {\n          dropdownScrollAreaAutosize:\n            scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n            comboboxScrollAreaAutosize(),\n        },\n      }}\n      target={<ComboboxTarget {...targetProps} />}\n      {...props}\n    >\n      <ComboboxOptions\n        emptyProps={emptyProps}\n        creatableProps={creatableProps}\n      />\n    </Dropdown>\n  );\n};\n"],"mappings":"s/BAmEA,MAAa,GAAY,CACvB,QACA,cACA,cACA,WACA,gBACA,YACA,aACA,kBACA,YAAY,aACZ,YACA,QACA,aACA,GAAG,KACgB,CACnB,GAAM,CACJ,UAAW,EACX,MAAO,EACP,OAAQ,EACR,WAAY,EACZ,GAAG,GACD,GAAc,EAAE,CAEd,CACJ,YAAa,EACb,QAAS,EACT,GAAG,GACD,GAAoB,EAAE,CAEpB,EAAc,CAClB,cACA,QACA,cACA,WACA,gBACA,QACA,YACA,WAAY,CACV,kBACE,GAAsB,mBAAqB,GAAmB,CAChE,KAAM,GAAsB,MAAQ,GAAuB,CAC3D,MAAO,GAAsB,OAAS,GAAwB,CAC9D,YACE,GAAsB,aAAe,GAA8B,CACrE,MAAO,GAAsB,OAAS,GAAwB,CAC9D,QAAS,GAAsB,SAAW,GAA0B,CACpE,MAAO,GAAsB,OAAS,GAAwB,CAC9D,QAAS,GAAsB,SAAW,GAA0B,CACpE,SAAU,GAAsB,UAAY,GAA2B,CACxE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YACE,GAAuB,aAAe,GAAqB,CAC7D,KAAM,GAAuB,MAAQ,IAAyB,CAC9D,KAAM,GAAuB,MAAQ,GAAyB,CAC9D,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAA4B,CAC9B,KACE,GAAuB,SAAS,MAChC,GAAgC,CACnC,CACF,CACF,CACD,aAAc,CACZ,WAAY,CACV,QAAS,GAAmB,SAAW,GAAiB,CACxD,KAAM,GAAmB,MAAQ,GAAqB,CACtD,KAAM,CACJ,QAAS,GAAmB,MAAM,SAAW,GAAqB,CAClE,KAAM,GAAmB,MAAM,MAAQ,GAAyB,CACjE,CACD,MAAO,CACL,QAAS,GAAmB,OAAO,SAAW,GAAqB,CACnE,KAAM,GAAmB,OAAO,MAAQ,GAAyB,CAClE,CACF,CACF,CACF,CAEK,EAAoB,GAAoB,UAAY,GAAU,CAC9D,GAAgB,GAAoB,MAAQ,GAAc,CAC1D,GAAmB,GAAoB,SAAW,GAAiB,CACnE,GAAkB,GAAoB,QAAU,GAAgB,CAChE,EAAiB,GAAiB,OAAS,GAAe,CAC1D,GAAkB,GAAoB,OAEtC,GAAa,CACjB,YACA,WAAY,CACV,MAAO,GAAiB,OAAS,EAClC,CACF,CAEK,GAAiB,CACrB,UAAW,GAAa,GACxB,aACA,WAAY,CACV,OAAQ,GAAqB,OAC7B,WAAY,CACV,WACE,GAAqB,YAAY,YACjC,GAA0B,CAC5B,KACE,GAAqB,YAAY,MACjC,GAA8B,CAChC,QAAS,CACP,QACE,GAAqB,YAAY,SAAS,SAC1C,GAAiC,CACnC,KACE,GAAqB,YAAY,SAAS,MAC1C,GAAqC,CACxC,CACF,CACF,CACF,CAED,OACE,EAAC,EAAD,CACE,WAAY,CACV,SAAU,EACV,KAAM,GACN,QAAS,GACT,OAAQ,GACR,MAAO,EACP,OAAQ,GACT,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,GAAsB,4BACtB,GAA4B,CAC/B,CACF,CACD,OAAQ,EAAC,EAAD,CAAgB,GAAI,EAAe,CAAA,CAC3C,GAAI,WAEJ,EAAC,EAAD,CACc,cACI,kBAChB,CAAA,CACO,CAAA"}

package/dist/components/controls/dropdown/select/Select.d.mts

@@ -6,7 +6,8 @@ import { ReactNode } from "react";
 
 //#region src/components/controls/dropdown/select/Select.d.ts
 type SelectProps = Omit<DropdownProps, 'children' | 'classNames' | 'target'> & {
-  label?: string;
+  label?: ReactNode;
+  description?: ReactNode;
   placeholder?: string;
   clearable?: boolean;
   clearButtonText?: string;
@@ -29,6 +30,7 @@ type SelectProps = Omit<DropdownProps, 'children' | 'classNames' | 'target'> & {
 };
 declare const Select: ({
   label,
+  description,
   placeholder,
   required,
   autoComplete,

package/dist/components/controls/dropdown/select/Select.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/select/Select.tsx"],"mappings":";;;;;;;KAsCY,WAAA,GAAc,IAAA,CACxB,aAAA;EAGA,KAAA;EACA,WAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA;EACA,UAAA;EACA,iBAAA;EACA,eAAA,GAAkB,SAAA;EAClB,gBAAA,GAAmB,sBAAA;EACnB,SAAA,GAAY,SAAA;EACZ,KAAA;EACA,QAAA;EACA,YAAA;EACA,UAAA,GAAa,aAAA;IACX,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;MAEF,OAAA,GAAU,WAAA,CAAY,mBAAA;IAAA;IAExB,UAAA,GAAa,WAAA,CAAY,aAAA;EAAA;AAAA;AAAA,cAIhB,MAAA;EAAU,KAAA;EAAA,WAAA;EAAA,QAAA;EAAA,YAAA;EAAA,SAAA;EAAA,eAAA;EAAA,SAAA;EAAA,UAAA;EAAA,iBAAA;EAAA,eAAA;EAAA,gBAAA;EAAA,SAAA;EAAA,KAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAgBpB,WAAA,KAAW,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"Select.d.mts","names":[],"sources":["../../../../../src/components/controls/dropdown/select/Select.tsx"],"mappings":";;;;;;;KAsCY,WAAA,GAAc,IAAA,CACxB,aAAA;EAGA,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,WAAA;EACA,SAAA;EACA,eAAA;EACA,SAAA;EACA,UAAA;EACA,iBAAA;EACA,eAAA,GAAkB,SAAA;EAClB,gBAAA,GAAmB,sBAAA;EACnB,SAAA,GAAY,SAAA;EACZ,KAAA;EACA,QAAA;EACA,YAAA;EACA,UAAA,GAAa,aAAA;IACX,MAAA,GAAS,mBAAA;MACP,WAAA,GAAc,WAAA,CACZ,mBAAA;MAEF,OAAA,GAAU,WAAA,CAAY,mBAAA;IAAA;IAExB,UAAA,GAAa,WAAA,CAAY,aAAA;EAAA;AAAA;AAAA,cAIhB,MAAA;EAAU,KAAA;EAAA,WAAA;EAAA,WAAA;EAAA,QAAA;EAAA,YAAA;EAAA,SAAA;EAAA,eAAA;EAAA,SAAA;EAAA,UAAA;EAAA,iBAAA;EAAA,eAAA;EAAA,gBAAA;EAAA,SAAA;EAAA,KAAA;EAAA,UAAA;EAAA,GAAA;AAAA,GAiBpB,WAAA,KAAW,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/dropdown/select/Select.mjs

@@ -1,2 +1,2 @@
-import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"../combobox/ComboboxOptions.mjs";import{ComboboxTarget as ee}from"../combobox/ComboboxTarget.mjs";import{SelectSearch as n}from"./SelectSearch.mjs";import{select as r,selectChevron as i,selectChevronIcon as a,selectChevronIconRoot as o,selectChevronRoot as s,selectClearButton as c,selectClearButtonIcon as l,selectClearButtonIconRaw as u,selectClearButtonIconRawRoot as d,selectClearButtonRoot as f,selectEmpty as p,selectOption as m,selectOptions as h,selectRoot as g,selectScrollAreaAutosize as _,selectSearchInput as v,selectSearchSection as y,selectSearchWrapper as b,selectTextInput as x,selectTextInputDescription as S,selectTextInputError as C,selectTextInputInput as w,selectTextInputLabel as T,selectTextInputRequired as E,selectTextInputRoot as D,selectTextInputSection as O,selectTextInputWrapper as k}from"@mage-ui/styled-system/recipes";import{jsx as A}from"react/jsx-runtime";const j=({label:j,placeholder:M,required:N,autoComplete:P,clearable:F=!1,clearButtonText:I,emptyText:L,searchable:R,searchPlaceholder:z,searchStartSlot:B,searchClassNames:V,startSlot:H,error:U,classNames:W,...G})=>{let{target:K,scrollArea:q,...J}=W||{},{clearButton:Y,chevron:X,...Z}=K||{},Q=L??(R?`No results`:void 0),$={placeholder:M,label:j,required:N,autoComplete:P,error:U,clearable:F,readOnly:!0,closeOnBlur:!R,startSlot:H,displayQuery:!1,classNames:{dropdownTextInput:Z?.dropdownTextInput??x(),root:Z?.root??D(),label:Z?.label??T(),description:Z?.description??S(),error:Z?.error??C(),wrapper:Z?.wrapper??k(),input:Z?.input??w(),section:Z?.section??O(),required:Z?.required??E()},clearButtonProps:{label:I,classNames:{clearButton:Y?.clearButton??c(),root:Y?.root??f(),icon:Y?.icon??l(),iconRaw:{iconRaw:Y?.iconRaw?.iconRaw??u(),root:Y?.iconRaw?.root??d()}}},chevronProps:{classNames:{chevron:X?.chevron??i(),root:X?.root??s(),open:{iconRaw:X?.open?.iconRaw??a(),root:X?.open?.root??o()},close:{iconRaw:X?.close?.iconRaw??a(),root:X?.close?.root??o()}}}};return A(e,{"data-searchable":R,classNames:{dropdown:J?.dropdown??r(),root:J?.root??g(),options:J?.options??h(),option:J?.option??m(),empty:J?.empty??p(),search:J?.search},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:q?.dropdownScrollAreaAutosize??_()}},target:A(ee,{...$}),dropdownTopSlot:R&&A(n,{searchPlaceholder:z,startSlot:B,classNames:{input:V?.input??v(),wrapper:V?.wrapper??b(),section:V?.section??y()}}),...G,children:A(t,{emptyProps:{emptyText:Q,classNames:{empty:J?.empty??p()}},creatableProps:{creatable:!1}})})};export{j as Select};
+import{Dropdown as e}from"../Dropdown.mjs";import{ComboboxOptions as t}from"../combobox/ComboboxOptions.mjs";import{ComboboxTarget as ee}from"../combobox/ComboboxTarget.mjs";import{SelectSearch as n}from"./SelectSearch.mjs";import{select as r,selectChevron as i,selectChevronIcon as a,selectChevronIconRoot as o,selectChevronRoot as s,selectClearButton as c,selectClearButtonIcon as l,selectClearButtonIconRaw as u,selectClearButtonIconRawRoot as d,selectClearButtonRoot as f,selectEmpty as p,selectOption as m,selectOptions as h,selectRoot as g,selectScrollAreaAutosize as _,selectSearchInput as v,selectSearchSection as y,selectSearchWrapper as b,selectTextInput as x,selectTextInputDescription as S,selectTextInputError as C,selectTextInputInput as w,selectTextInputLabel as T,selectTextInputRequired as E,selectTextInputRoot as D,selectTextInputSection as O,selectTextInputWrapper as k}from"@mage-ui/styled-system/recipes";import{jsx as A}from"react/jsx-runtime";const j=({label:j,description:M,placeholder:N,required:P,autoComplete:F,clearable:I=!1,clearButtonText:L,emptyText:R,searchable:z,searchPlaceholder:B,searchStartSlot:V,searchClassNames:H,startSlot:U,error:W,classNames:G,...K})=>{let{target:q,scrollArea:J,...Y}=G||{},{clearButton:X,chevron:Z,...Q}=q||{},$=R??(z?`No results`:void 0),te={placeholder:N,label:j,description:M,required:P,autoComplete:F,error:W,clearable:I,readOnly:!0,closeOnBlur:!z,startSlot:U,displayQuery:!1,classNames:{dropdownTextInput:Q?.dropdownTextInput??x(),root:Q?.root??D(),label:Q?.label??T(),description:Q?.description??S(),error:Q?.error??C(),wrapper:Q?.wrapper??k(),input:Q?.input??w(),section:Q?.section??O(),required:Q?.required??E()},clearButtonProps:{label:L,classNames:{clearButton:X?.clearButton??c(),root:X?.root??f(),icon:X?.icon??l(),iconRaw:{iconRaw:X?.iconRaw?.iconRaw??u(),root:X?.iconRaw?.root??d()}}},chevronProps:{classNames:{chevron:Z?.chevron??i(),root:Z?.root??s(),open:{iconRaw:Z?.open?.iconRaw??a(),root:Z?.open?.root??o()},close:{iconRaw:Z?.close?.iconRaw??a(),root:Z?.close?.root??o()}}}};return A(e,{"data-searchable":z,classNames:{dropdown:Y?.dropdown??r(),root:Y?.root??g(),options:Y?.options??h(),option:Y?.option??m(),empty:Y?.empty??p(),search:Y?.search},scrollAreaProps:{classNames:{dropdownScrollAreaAutosize:J?.dropdownScrollAreaAutosize??_()}},target:A(ee,{...te}),dropdownTopSlot:z&&A(n,{searchPlaceholder:B,startSlot:V,classNames:{input:H?.input??v(),wrapper:H?.wrapper??b(),section:H?.section??y()}}),...K,children:A(t,{emptyProps:{emptyText:$,classNames:{empty:Y?.empty??p()}},creatableProps:{creatable:!1}})})};export{j as Select};
 //# sourceMappingURL=Select.mjs.map

package/dist/components/controls/dropdown/select/Select.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Select.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/select/Select.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  select,\n  selectChevron,\n  selectChevronIcon,\n  selectChevronIconRoot,\n  selectChevronRoot,\n  selectClearButton,\n  selectClearButtonIcon,\n  selectClearButtonIconRaw,\n  selectClearButtonIconRawRoot,\n  selectClearButtonRoot,\n  selectEmpty,\n  selectOption,\n  selectOptions,\n  selectRoot,\n  selectScrollAreaAutosize,\n  selectSearchInput,\n  selectSearchSection,\n  selectSearchWrapper,\n  selectTextInput,\n  selectTextInputDescription,\n  selectTextInputError,\n  selectTextInputInput,\n  selectTextInputLabel,\n  selectTextInputRequired,\n  selectTextInputRoot,\n  selectTextInputSection,\n  selectTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { ComboboxOptions } from '../combobox/ComboboxOptions';\nimport type { ComboboxTargetProps } from '../combobox/ComboboxTarget';\nimport { ComboboxTarget } from '../combobox/ComboboxTarget';\nimport { Dropdown, type DropdownProps } from '../Dropdown';\nimport { SelectSearch, type SelectSearchClassNames } from './SelectSearch';\n\nexport type SelectProps = Omit<\n  DropdownProps,\n  'children' | 'classNames' | 'target'\n> & {\n  label?: string;\n  placeholder?: string;\n  clearable?: boolean;\n  clearButtonText?: string;\n  emptyText?: string;\n  searchable?: boolean;\n  searchPlaceholder?: string;\n  searchStartSlot?: ReactNode;\n  searchClassNames?: SelectSearchClassNames;\n  startSlot?: ReactNode;\n  error?: string;\n  required?: boolean;\n  autoComplete?: string;\n  classNames?: DropdownProps['classNames'] & {\n    target?: ComboboxTargetProps['classNames'] & {\n      clearButton?: NonNullable<\n        ComboboxTargetProps['clearButtonProps']\n      >['classNames'];\n      chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];\n    };\n    scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];\n  };\n};\n\nexport const Select = ({\n  label,\n  placeholder,\n  required,\n  autoComplete,\n  clearable = false,\n  clearButtonText,\n  emptyText,\n  searchable,\n  searchPlaceholder,\n  searchStartSlot,\n  searchClassNames,\n  startSlot,\n  error,\n  classNames,\n  ...props\n}: SelectProps) => {\n  const {\n    target: targetClassNames,\n    scrollArea: scrollAreaClassNames,\n    ...dropdownClassNames\n  } = classNames || {};\n\n  const {\n    clearButton: clearButtonClassNames,\n    chevron: chevronClassNames,\n    ...restTargetClassNames\n  } = targetClassNames || {};\n  const resolvedEmptyText =\n    emptyText ?? (searchable ? 'No results' : undefined);\n\n  const targetProps = {\n    placeholder,\n    label,\n    required,\n    autoComplete,\n    error,\n    clearable,\n    readOnly: true,\n    closeOnBlur: !searchable,\n    startSlot,\n    displayQuery: false,\n    classNames: {\n      dropdownTextInput:\n        restTargetClassNames?.dropdownTextInput ?? selectTextInput(),\n      root: restTargetClassNames?.root ?? selectTextInputRoot(),\n      label: restTargetClassNames?.label ?? selectTextInputLabel(),\n      description:\n        restTargetClassNames?.description ?? selectTextInputDescription(),\n      error: restTargetClassNames?.error ?? selectTextInputError(),\n      wrapper: restTargetClassNames?.wrapper ?? selectTextInputWrapper(),\n      input: restTargetClassNames?.input ?? selectTextInputInput(),\n      section: restTargetClassNames?.section ?? selectTextInputSection(),\n      required: restTargetClassNames?.required ?? selectTextInputRequired(),\n    },\n    clearButtonProps: {\n      label: clearButtonText,\n      classNames: {\n        clearButton: clearButtonClassNames?.clearButton ?? selectClearButton(),\n        root: clearButtonClassNames?.root ?? selectClearButtonRoot(),\n        icon: clearButtonClassNames?.icon ?? selectClearButtonIcon(),\n        iconRaw: {\n          iconRaw:\n            clearButtonClassNames?.iconRaw?.iconRaw ??\n            selectClearButtonIconRaw(),\n          root:\n            clearButtonClassNames?.iconRaw?.root ??\n            selectClearButtonIconRawRoot(),\n        },\n      },\n    },\n    chevronProps: {\n      classNames: {\n        chevron: chevronClassNames?.chevron ?? selectChevron(),\n        root: chevronClassNames?.root ?? selectChevronRoot(),\n        open: {\n          iconRaw: chevronClassNames?.open?.iconRaw ?? selectChevronIcon(),\n          root: chevronClassNames?.open?.root ?? selectChevronIconRoot(),\n        },\n        close: {\n          iconRaw: chevronClassNames?.close?.iconRaw ?? selectChevronIcon(),\n          root: chevronClassNames?.close?.root ?? selectChevronIconRoot(),\n        },\n      },\n    },\n  };\n\n  return (\n    <Dropdown\n      data-searchable={searchable}\n      classNames={{\n        dropdown: dropdownClassNames?.dropdown ?? select(),\n        root: dropdownClassNames?.root ?? selectRoot(),\n        options: dropdownClassNames?.options ?? selectOptions(),\n        option: dropdownClassNames?.option ?? selectOption(),\n        empty: dropdownClassNames?.empty ?? selectEmpty(),\n        search: dropdownClassNames?.search,\n      }}\n      scrollAreaProps={{\n        classNames: {\n          dropdownScrollAreaAutosize:\n            scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n            selectScrollAreaAutosize(),\n        },\n      }}\n      target={<ComboboxTarget {...targetProps} />}\n      dropdownTopSlot={\n        searchable && (\n          <SelectSearch\n            searchPlaceholder={searchPlaceholder}\n            startSlot={searchStartSlot}\n            classNames={{\n              input: searchClassNames?.input ?? selectSearchInput(),\n              wrapper: searchClassNames?.wrapper ?? selectSearchWrapper(),\n              section: searchClassNames?.section ?? selectSearchSection(),\n            }}\n          />\n        )\n      }\n      {...props}\n    >\n      <ComboboxOptions\n        emptyProps={{\n          emptyText: resolvedEmptyText,\n          classNames: {\n            empty: dropdownClassNames?.empty ?? selectEmpty(),\n          },\n        }}\n        creatableProps={{\n          creatable: false,\n        }}\n      />\n    </Dropdown>\n  );\n};\n"],"mappings":"u8BAkEA,MAAa,GAAU,CACrB,QACA,cACA,WACA,eACA,YAAY,GACZ,kBACA,YACA,aACA,oBACA,kBACA,mBACA,YACA,QACA,aACA,GAAG,KACc,CACjB,GAAM,CACJ,OAAQ,EACR,WAAY,EACZ,GAAG,GACD,GAAc,EAAE,CAEd,CACJ,YAAa,EACb,QAAS,EACT,GAAG,GACD,GAAoB,EAAE,CACpB,EACJ,IAAc,EAAa,aAAe,IAAA,IAEtC,EAAc,CAClB,cACA,QACA,WACA,eACA,QACA,YACA,SAAU,GACV,YAAa,CAAC,EACd,YACA,aAAc,GACd,WAAY,CACV,kBACE,GAAsB,mBAAqB,GAAiB,CAC9D,KAAM,GAAsB,MAAQ,GAAqB,CACzD,MAAO,GAAsB,OAAS,GAAsB,CAC5D,YACE,GAAsB,aAAe,GAA4B,CACnE,MAAO,GAAsB,OAAS,GAAsB,CAC5D,QAAS,GAAsB,SAAW,GAAwB,CAClE,MAAO,GAAsB,OAAS,GAAsB,CAC5D,QAAS,GAAsB,SAAW,GAAwB,CAClE,SAAU,GAAsB,UAAY,GAAyB,CACtE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YAAa,GAAuB,aAAe,GAAmB,CACtE,KAAM,GAAuB,MAAQ,GAAuB,CAC5D,KAAM,GAAuB,MAAQ,GAAuB,CAC5D,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAA0B,CAC5B,KACE,GAAuB,SAAS,MAChC,GAA8B,CACjC,CACF,CACF,CACD,aAAc,CACZ,WAAY,CACV,QAAS,GAAmB,SAAW,GAAe,CACtD,KAAM,GAAmB,MAAQ,GAAmB,CACpD,KAAM,CACJ,QAAS,GAAmB,MAAM,SAAW,GAAmB,CAChE,KAAM,GAAmB,MAAM,MAAQ,GAAuB,CAC/D,CACD,MAAO,CACL,QAAS,GAAmB,OAAO,SAAW,GAAmB,CACjE,KAAM,GAAmB,OAAO,MAAQ,GAAuB,CAChE,CACF,CACF,CACF,CAED,OACE,EAAC,EAAD,CACE,kBAAiB,EACjB,WAAY,CACV,SAAU,GAAoB,UAAY,GAAQ,CAClD,KAAM,GAAoB,MAAQ,GAAY,CAC9C,QAAS,GAAoB,SAAW,GAAe,CACvD,OAAQ,GAAoB,QAAU,GAAc,CACpD,MAAO,GAAoB,OAAS,GAAa,CACjD,OAAQ,GAAoB,OAC7B,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,GAAsB,4BACtB,GAA0B,CAC7B,CACF,CACD,OAAQ,EAAC,GAAD,CAAgB,GAAI,EAAe,CAAA,CAC3C,gBACE,GACE,EAAC,EAAD,CACqB,oBACnB,UAAW,EACX,WAAY,CACV,MAAO,GAAkB,OAAS,GAAmB,CACrD,QAAS,GAAkB,SAAW,GAAqB,CAC3D,QAAS,GAAkB,SAAW,GAAqB,CAC5D,CACD,CAAA,CAGN,GAAI,WAEJ,EAAC,EAAD,CACE,WAAY,CACV,UAAW,EACX,WAAY,CACV,MAAO,GAAoB,OAAS,GAAa,CAClD,CACF,CACD,eAAgB,CACd,UAAW,GACZ,CACD,CAAA,CACO,CAAA"}
+{"version":3,"file":"Select.mjs","names":[],"sources":["../../../../../src/components/controls/dropdown/select/Select.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n  select,\n  selectChevron,\n  selectChevronIcon,\n  selectChevronIconRoot,\n  selectChevronRoot,\n  selectClearButton,\n  selectClearButtonIcon,\n  selectClearButtonIconRaw,\n  selectClearButtonIconRawRoot,\n  selectClearButtonRoot,\n  selectEmpty,\n  selectOption,\n  selectOptions,\n  selectRoot,\n  selectScrollAreaAutosize,\n  selectSearchInput,\n  selectSearchSection,\n  selectSearchWrapper,\n  selectTextInput,\n  selectTextInputDescription,\n  selectTextInputError,\n  selectTextInputInput,\n  selectTextInputLabel,\n  selectTextInputRequired,\n  selectTextInputRoot,\n  selectTextInputSection,\n  selectTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\n\nimport { ComboboxOptions } from '../combobox/ComboboxOptions';\nimport type { ComboboxTargetProps } from '../combobox/ComboboxTarget';\nimport { ComboboxTarget } from '../combobox/ComboboxTarget';\nimport { Dropdown, type DropdownProps } from '../Dropdown';\nimport { SelectSearch, type SelectSearchClassNames } from './SelectSearch';\n\nexport type SelectProps = Omit<\n  DropdownProps,\n  'children' | 'classNames' | 'target'\n> & {\n  label?: ReactNode;\n  description?: ReactNode;\n  placeholder?: string;\n  clearable?: boolean;\n  clearButtonText?: string;\n  emptyText?: string;\n  searchable?: boolean;\n  searchPlaceholder?: string;\n  searchStartSlot?: ReactNode;\n  searchClassNames?: SelectSearchClassNames;\n  startSlot?: ReactNode;\n  error?: string;\n  required?: boolean;\n  autoComplete?: string;\n  classNames?: DropdownProps['classNames'] & {\n    target?: ComboboxTargetProps['classNames'] & {\n      clearButton?: NonNullable<\n        ComboboxTargetProps['clearButtonProps']\n      >['classNames'];\n      chevron?: NonNullable<ComboboxTargetProps['chevronProps']>['classNames'];\n    };\n    scrollArea?: NonNullable<DropdownProps['scrollAreaProps']>['classNames'];\n  };\n};\n\nexport const Select = ({\n  label,\n  description,\n  placeholder,\n  required,\n  autoComplete,\n  clearable = false,\n  clearButtonText,\n  emptyText,\n  searchable,\n  searchPlaceholder,\n  searchStartSlot,\n  searchClassNames,\n  startSlot,\n  error,\n  classNames,\n  ...props\n}: SelectProps) => {\n  const {\n    target: targetClassNames,\n    scrollArea: scrollAreaClassNames,\n    ...dropdownClassNames\n  } = classNames || {};\n\n  const {\n    clearButton: clearButtonClassNames,\n    chevron: chevronClassNames,\n    ...restTargetClassNames\n  } = targetClassNames || {};\n  const resolvedEmptyText =\n    emptyText ?? (searchable ? 'No results' : undefined);\n\n  const targetProps = {\n    placeholder,\n    label,\n    description,\n    required,\n    autoComplete,\n    error,\n    clearable,\n    readOnly: true,\n    closeOnBlur: !searchable,\n    startSlot,\n    displayQuery: false,\n    classNames: {\n      dropdownTextInput:\n        restTargetClassNames?.dropdownTextInput ?? selectTextInput(),\n      root: restTargetClassNames?.root ?? selectTextInputRoot(),\n      label: restTargetClassNames?.label ?? selectTextInputLabel(),\n      description:\n        restTargetClassNames?.description ?? selectTextInputDescription(),\n      error: restTargetClassNames?.error ?? selectTextInputError(),\n      wrapper: restTargetClassNames?.wrapper ?? selectTextInputWrapper(),\n      input: restTargetClassNames?.input ?? selectTextInputInput(),\n      section: restTargetClassNames?.section ?? selectTextInputSection(),\n      required: restTargetClassNames?.required ?? selectTextInputRequired(),\n    },\n    clearButtonProps: {\n      label: clearButtonText,\n      classNames: {\n        clearButton: clearButtonClassNames?.clearButton ?? selectClearButton(),\n        root: clearButtonClassNames?.root ?? selectClearButtonRoot(),\n        icon: clearButtonClassNames?.icon ?? selectClearButtonIcon(),\n        iconRaw: {\n          iconRaw:\n            clearButtonClassNames?.iconRaw?.iconRaw ??\n            selectClearButtonIconRaw(),\n          root:\n            clearButtonClassNames?.iconRaw?.root ??\n            selectClearButtonIconRawRoot(),\n        },\n      },\n    },\n    chevronProps: {\n      classNames: {\n        chevron: chevronClassNames?.chevron ?? selectChevron(),\n        root: chevronClassNames?.root ?? selectChevronRoot(),\n        open: {\n          iconRaw: chevronClassNames?.open?.iconRaw ?? selectChevronIcon(),\n          root: chevronClassNames?.open?.root ?? selectChevronIconRoot(),\n        },\n        close: {\n          iconRaw: chevronClassNames?.close?.iconRaw ?? selectChevronIcon(),\n          root: chevronClassNames?.close?.root ?? selectChevronIconRoot(),\n        },\n      },\n    },\n  };\n\n  return (\n    <Dropdown\n      data-searchable={searchable}\n      classNames={{\n        dropdown: dropdownClassNames?.dropdown ?? select(),\n        root: dropdownClassNames?.root ?? selectRoot(),\n        options: dropdownClassNames?.options ?? selectOptions(),\n        option: dropdownClassNames?.option ?? selectOption(),\n        empty: dropdownClassNames?.empty ?? selectEmpty(),\n        search: dropdownClassNames?.search,\n      }}\n      scrollAreaProps={{\n        classNames: {\n          dropdownScrollAreaAutosize:\n            scrollAreaClassNames?.dropdownScrollAreaAutosize ??\n            selectScrollAreaAutosize(),\n        },\n      }}\n      target={<ComboboxTarget {...targetProps} />}\n      dropdownTopSlot={\n        searchable && (\n          <SelectSearch\n            searchPlaceholder={searchPlaceholder}\n            startSlot={searchStartSlot}\n            classNames={{\n              input: searchClassNames?.input ?? selectSearchInput(),\n              wrapper: searchClassNames?.wrapper ?? selectSearchWrapper(),\n              section: searchClassNames?.section ?? selectSearchSection(),\n            }}\n          />\n        )\n      }\n      {...props}\n    >\n      <ComboboxOptions\n        emptyProps={{\n          emptyText: resolvedEmptyText,\n          classNames: {\n            empty: dropdownClassNames?.empty ?? selectEmpty(),\n          },\n        }}\n        creatableProps={{\n          creatable: false,\n        }}\n      />\n    </Dropdown>\n  );\n};\n"],"mappings":"u8BAmEA,MAAa,GAAU,CACrB,QACA,cACA,cACA,WACA,eACA,YAAY,GACZ,kBACA,YACA,aACA,oBACA,kBACA,mBACA,YACA,QACA,aACA,GAAG,KACc,CACjB,GAAM,CACJ,OAAQ,EACR,WAAY,EACZ,GAAG,GACD,GAAc,EAAE,CAEd,CACJ,YAAa,EACb,QAAS,EACT,GAAG,GACD,GAAoB,EAAE,CACpB,EACJ,IAAc,EAAa,aAAe,IAAA,IAEtC,GAAc,CAClB,cACA,QACA,cACA,WACA,eACA,QACA,YACA,SAAU,GACV,YAAa,CAAC,EACd,YACA,aAAc,GACd,WAAY,CACV,kBACE,GAAsB,mBAAqB,GAAiB,CAC9D,KAAM,GAAsB,MAAQ,GAAqB,CACzD,MAAO,GAAsB,OAAS,GAAsB,CAC5D,YACE,GAAsB,aAAe,GAA4B,CACnE,MAAO,GAAsB,OAAS,GAAsB,CAC5D,QAAS,GAAsB,SAAW,GAAwB,CAClE,MAAO,GAAsB,OAAS,GAAsB,CAC5D,QAAS,GAAsB,SAAW,GAAwB,CAClE,SAAU,GAAsB,UAAY,GAAyB,CACtE,CACD,iBAAkB,CAChB,MAAO,EACP,WAAY,CACV,YAAa,GAAuB,aAAe,GAAmB,CACtE,KAAM,GAAuB,MAAQ,GAAuB,CAC5D,KAAM,GAAuB,MAAQ,GAAuB,CAC5D,QAAS,CACP,QACE,GAAuB,SAAS,SAChC,GAA0B,CAC5B,KACE,GAAuB,SAAS,MAChC,GAA8B,CACjC,CACF,CACF,CACD,aAAc,CACZ,WAAY,CACV,QAAS,GAAmB,SAAW,GAAe,CACtD,KAAM,GAAmB,MAAQ,GAAmB,CACpD,KAAM,CACJ,QAAS,GAAmB,MAAM,SAAW,GAAmB,CAChE,KAAM,GAAmB,MAAM,MAAQ,GAAuB,CAC/D,CACD,MAAO,CACL,QAAS,GAAmB,OAAO,SAAW,GAAmB,CACjE,KAAM,GAAmB,OAAO,MAAQ,GAAuB,CAChE,CACF,CACF,CACF,CAED,OACE,EAAC,EAAD,CACE,kBAAiB,EACjB,WAAY,CACV,SAAU,GAAoB,UAAY,GAAQ,CAClD,KAAM,GAAoB,MAAQ,GAAY,CAC9C,QAAS,GAAoB,SAAW,GAAe,CACvD,OAAQ,GAAoB,QAAU,GAAc,CACpD,MAAO,GAAoB,OAAS,GAAa,CACjD,OAAQ,GAAoB,OAC7B,CACD,gBAAiB,CACf,WAAY,CACV,2BACE,GAAsB,4BACtB,GAA0B,CAC7B,CACF,CACD,OAAQ,EAAC,GAAD,CAAgB,GAAI,GAAe,CAAA,CAC3C,gBACE,GACE,EAAC,EAAD,CACqB,oBACnB,UAAW,EACX,WAAY,CACV,MAAO,GAAkB,OAAS,GAAmB,CACrD,QAAS,GAAkB,SAAW,GAAqB,CAC3D,QAAS,GAAkB,SAAW,GAAqB,CAC5D,CACD,CAAA,CAGN,GAAI,WAEJ,EAAC,EAAD,CACE,WAAY,CACV,UAAW,EACX,WAAY,CACV,MAAO,GAAoB,OAAS,GAAa,CAClD,CACF,CACD,eAAgB,CACd,UAAW,GACZ,CACD,CAAA,CACO,CAAA"}

package/dist/components/forms/Form.d.mts

@@ -3,7 +3,9 @@ import { TextareaProps } from "../controls/textarea/Textarea.mjs";
 import { FormDropzoneS3Props } from "./controls/FormDropzoneS3.mjs";
 import { FormSubmitProps } from "./controls/FormSubmit.mjs";
 import { FormCheckboxProps } from "./controls/FormCheckbox.mjs";
+import { FormCheckboxGroupProps } from "./controls/FormCheckboxGroup.mjs";
 import { FormCheckboxTreeProps } from "./controls/FormCheckboxTree.mjs";
+import { FormRadioGroupProps } from "./controls/FormRadioGroup.mjs";
 import { FormPasswordProps } from "./controls/FormPassword.mjs";
 import { FormSelectProps } from "./controls/FormSelect.mjs";
 import { FormComboboxProps } from "./controls/FormCombobox.mjs";
@@ -112,6 +114,17 @@ declare const Form: {
     }: FormCheckboxProps): react_jsx_runtime0.JSX.Element;
     displayName: string;
   };
+  CheckboxGroup: {
+    ({
+      $rule: _$rule,
+      defaultValue,
+      isSubmitting,
+      name,
+      disabled,
+      ...props
+    }: FormCheckboxGroupProps): react_jsx_runtime0.JSX.Element;
+    displayName: string;
+  };
   CheckboxTree: {
     ({
       $rule,
@@ -123,6 +136,16 @@ declare const Form: {
     }: FormCheckboxTreeProps): react_jsx_runtime0.JSX.Element;
     displayName: string;
   };
+  RadioGroup: {
+    ({
+      $rule: _$rule,
+      defaultValue,
+      isSubmitting: _isSubmitting,
+      name,
+      ...props
+    }: FormRadioGroupProps): react_jsx_runtime0.JSX.Element;
+    displayName: string;
+  };
   Password: {
     ({
       $rule,

package/dist/components/forms/Form.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Form.d.mts","names":[],"sources":["../../../src/components/forms/Form.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;KA8BK,YAAA;EACH,IAAA;EACA,OAAA;EACA,MAAA;EACA,GAAA;AAAA;AAAA,KAGU,SAAA,WAAoB,WAAA;EAC9B,QAAA,GAAW,MAAA;IAAU,IAAA,EAAM,CAAA;EAAA,MAAQ,OAAA;EACnC,aAAA,IAAiB,QAAA,EAAU,YAAA;EAC3B,eAAA,IAAmB,MAAA;IACjB,OAAA;IACA,QAAA,EAAU,eAAA,CAAgB,CAAA;IAC1B,MAAA;EAAA;EAEF,aAAA;EACA,QAAA,EAAU,SAAA;EACV,MAAA,GAAS,SAAA,CAAU,MAAA,SAAe,UAAA;EAClC,CAAA,IACE,GAAA,UACA,QAAA,GAAW,MAAA,kBACX,QAAA,uBACY,KAAA,CAAM,SAAA;EAEpB,oBAAA;EACA,UAAA;IACE,IAAA;IACA,IAAA;EAAA;AAAA;AAAA,cAYS,IAAA;EAAA,WAAkB,WAAA;IAAW,QAAA;IAAA,aAAA;IAAA,eAAA;IAAA,aAAA;IAAA,QAAA;IAAA,MAAA;IAAA,CAAA;IAAA,oBAAA;IAAA;EAAA,GAUvC,SAAA,CAAU,CAAA,IAAE,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"Form.d.mts","names":[],"sources":["../../../src/components/forms/Form.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;KAgCK,YAAA;EACH,IAAA;EACA,OAAA;EACA,MAAA;EACA,GAAA;AAAA;AAAA,KAGU,SAAA,WAAoB,WAAA;EAC9B,QAAA,GAAW,MAAA;IAAU,IAAA,EAAM,CAAA;EAAA,MAAQ,OAAA;EACnC,aAAA,IAAiB,QAAA,EAAU,YAAA;EAC3B,eAAA,IAAmB,MAAA;IACjB,OAAA;IACA,QAAA,EAAU,eAAA,CAAgB,CAAA;IAC1B,MAAA;EAAA;EAEF,aAAA;EACA,QAAA,EAAU,SAAA;EACV,MAAA,GAAS,SAAA,CAAU,MAAA,SAAe,UAAA;EAClC,CAAA,IACE,GAAA,UACA,QAAA,GAAW,MAAA,kBACX,QAAA,uBACY,KAAA,CAAM,SAAA;EAEpB,oBAAA;EACA,UAAA;IACE,IAAA;IACA,IAAA;EAAA;AAAA;AAAA,cAYS,IAAA;EAAA,WAAkB,WAAA;IAAW,QAAA;IAAA,aAAA;IAAA,eAAA;IAAA,aAAA;IAAA,QAAA;IAAA,MAAA;IAAA,CAAA;IAAA,oBAAA;IAAA;EAAA,GAUvC,SAAA,CAAU,CAAA,IAAE,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/forms/Form.mjs

@@ -1,2 +1,2 @@
-import{FormAutocomplete as e}from"./controls/FormAutocomplete.mjs";import{FormCheckbox as t}from"./controls/FormCheckbox.mjs";import{FormCheckboxTree as n}from"./controls/FormCheckboxTree.mjs";import{FormCombobox as r}from"./controls/FormCombobox.mjs";import{FormDatePicker as i}from"./controls/FormDatePicker.mjs";import{FormDateTimePicker as a}from"./controls/FormDateTimePicker.mjs";import{FormDropzone as o}from"./controls/FormDropzone.mjs";import{FormS3Context as s}from"./FormS3Context.mjs";import{FormDropzoneS3 as c}from"./controls/FormDropzoneS3.mjs";import{FormFileInput as l}from"./controls/FormFileInput.mjs";import{FormFileInputMultiple as u}from"./controls/FormFileInputMultiple.mjs";import{FormFileInputMultipleS3 as d}from"./controls/FormFileInputMultipleS3.mjs";import{FormFileInputS3 as f}from"./controls/FormFileInputS3.mjs";import{FormHidden as p}from"./controls/FormHidden.mjs";import{FormPassword as m}from"./controls/FormPassword.mjs";import{FormSelect as h}from"./controls/FormSelect.mjs";import{FormSubmit as g}from"./controls/FormSubmit.mjs";import{FormTextarea as _}from"./controls/FormTextarea.mjs";import{FormTextInput as v}from"./controls/FormTextInput.mjs";import{FormBase as y}from"./FormBase.mjs";import{FormErrorBox as b}from"./FormErrorBox.mjs";import{form as x,formRoot as S}from"@mage-ui/styled-system/recipes";import{jsx as C}from"react/jsx-runtime";import{useRef as w}from"react";const T=({$fetcher:e,onValidSubmit:t,onInvalidSubmit:n,invalidStatus:r=[],children:i,schema:a,t:o,s3UploadErrorMessage:c,classNames:l})=>{let u=w(new Map),d={registerS3Upload:(e,t)=>{u.current.set(e,t)},unregisterS3Upload:e=>{u.current.delete(e)}},f=async e=>{let t=Array.from(u.current.values());await Promise.all(t.map(t=>t(e)))};return C(s.Provider,{value:d,children:C(y,{onSubmit:async({data:i,setError:a})=>{await e({data:i}).then(async e=>{let n=e;if(n?.statusCode&&n.statusCode>=400)throw n;try{await f(e)}catch(e){console.error(`S3 upload error:`,e),a(`root.serverError`,{type:`s3`,message:c??`Failed to upload files`});return}t?.(e||{})}).catch(e=>{if((e.statusCode===400||e.statusCode===422)&&e.cause?.issues&&Object.keys(e.cause.issues).forEach(t=>{a(t,{type:`server`,message:e.cause?.issues?.[t]})}),r.includes(e.statusCode)&&n)n({message:e?.message??`Something went wrong`,setError:a,status:e.statusCode});else if(e.statusCode===400||e.statusCode===422)a(`root.serverError`,{type:`server`,message:e?.message??`Something went wrong`});else throw e})},schema:a,errorBox:b,t:o,classNames:{form:l?.form??x(),root:l?.root??S()},children:i})})};T.displayName=`Form`,T.TextInput=v,T.Textarea=_,T.Submit=g,T.Hidden=p,T.Checkbox=t,T.CheckboxTree=n,T.Password=m,T.Select=h,T.Combobox=r,T.Autocomplete=e,T.DatePicker=i,T.DateTimePicker=a,T.FileInput=l,T.FileInputMultiple=u,T.FileInputS3=f,T.FileInputMultipleS3=d,T.Dropzone=o,T.DropzoneS3=c;export{T as Form};
+import{FormAutocomplete as e}from"./controls/FormAutocomplete.mjs";import{FormCheckbox as t}from"./controls/FormCheckbox.mjs";import{FormCheckboxGroup as n}from"./controls/FormCheckboxGroup.mjs";import{FormCheckboxTree as r}from"./controls/FormCheckboxTree.mjs";import{FormCombobox as i}from"./controls/FormCombobox.mjs";import{FormDatePicker as a}from"./controls/FormDatePicker.mjs";import{FormDateTimePicker as o}from"./controls/FormDateTimePicker.mjs";import{FormDropzone as s}from"./controls/FormDropzone.mjs";import{FormS3Context as c}from"./FormS3Context.mjs";import{FormDropzoneS3 as l}from"./controls/FormDropzoneS3.mjs";import{FormFileInput as u}from"./controls/FormFileInput.mjs";import{FormFileInputMultiple as d}from"./controls/FormFileInputMultiple.mjs";import{FormFileInputMultipleS3 as f}from"./controls/FormFileInputMultipleS3.mjs";import{FormFileInputS3 as p}from"./controls/FormFileInputS3.mjs";import{FormHidden as m}from"./controls/FormHidden.mjs";import{FormPassword as h}from"./controls/FormPassword.mjs";import{FormRadioGroup as g}from"./controls/FormRadioGroup.mjs";import{FormSelect as _}from"./controls/FormSelect.mjs";import{FormSubmit as v}from"./controls/FormSubmit.mjs";import{FormTextarea as y}from"./controls/FormTextarea.mjs";import{FormTextInput as b}from"./controls/FormTextInput.mjs";import{FormBase as x}from"./FormBase.mjs";import{FormErrorBox as S}from"./FormErrorBox.mjs";import{form as C,formRoot as w}from"@mage-ui/styled-system/recipes";import{jsx as T}from"react/jsx-runtime";import{useRef as E}from"react";const D=({$fetcher:e,onValidSubmit:t,onInvalidSubmit:n,invalidStatus:r=[],children:i,schema:a,t:o,s3UploadErrorMessage:s,classNames:l})=>{let u=E(new Map),d={registerS3Upload:(e,t)=>{u.current.set(e,t)},unregisterS3Upload:e=>{u.current.delete(e)}},f=async e=>{let t=Array.from(u.current.values());await Promise.all(t.map(t=>t(e)))};return T(c.Provider,{value:d,children:T(x,{onSubmit:async({data:i,setError:a})=>{await e({data:i}).then(async e=>{let n=e;if(n?.statusCode&&n.statusCode>=400)throw n;try{await f(e)}catch(e){console.error(`S3 upload error:`,e),a(`root.serverError`,{type:`s3`,message:s??`Failed to upload files`});return}t?.(e||{})}).catch(e=>{if((e.statusCode===400||e.statusCode===422)&&e.cause?.issues&&Object.keys(e.cause.issues).forEach(t=>{a(t,{type:`server`,message:e.cause?.issues?.[t]})}),r.includes(e.statusCode)&&n)n({message:e?.message??`Something went wrong`,setError:a,status:e.statusCode});else if(e.statusCode===400||e.statusCode===422)a(`root.serverError`,{type:`server`,message:e?.message??`Something went wrong`});else throw e})},schema:a,errorBox:S,t:o,classNames:{form:l?.form??C(),root:l?.root??w()},children:i})})};D.displayName=`Form`,D.TextInput=b,D.Textarea=y,D.Submit=v,D.Hidden=m,D.Checkbox=t,D.CheckboxGroup=n,D.CheckboxTree=r,D.RadioGroup=g,D.Password=h,D.Select=_,D.Combobox=i,D.Autocomplete=e,D.DatePicker=a,D.DateTimePicker=o,D.FileInput=u,D.FileInputMultiple=d,D.FileInputS3=p,D.FileInputMultipleS3=f,D.Dropzone=s,D.DropzoneS3=l;export{D as Form};
 //# sourceMappingURL=Form.mjs.map

package/dist/components/forms/Form.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Form.mjs","names":[],"sources":["../../../src/components/forms/Form.tsx"],"sourcesContent":["import type React from 'react';\nimport type { ReactNode } from 'react';\nimport { useRef } from 'react';\nimport type { FieldValues, UseFormSetError } from 'react-hook-form';\nimport type { ZodObject, ZodTypeAny } from 'zod';\n\nimport { form, formRoot } from '@mage-ui/styled-system/recipes';\n\nimport { FormAutocomplete } from './controls/FormAutocomplete';\nimport { FormCheckbox } from './controls/FormCheckbox';\nimport { FormCheckboxTree } from './controls/FormCheckboxTree';\nimport { FormCombobox } from './controls/FormCombobox';\nimport { FormDatePicker } from './controls/FormDatePicker';\nimport { FormDateTimePicker } from './controls/FormDateTimePicker';\nimport { FormDropzone } from './controls/FormDropzone';\nimport { FormDropzoneS3 } from './controls/FormDropzoneS3';\nimport { FormFileInput } from './controls/FormFileInput';\nimport { FormFileInputMultiple } from './controls/FormFileInputMultiple';\nimport { FormFileInputMultipleS3 } from './controls/FormFileInputMultipleS3';\nimport { FormFileInputS3 } from './controls/FormFileInputS3';\nimport { FormHidden } from './controls/FormHidden';\nimport { FormPassword } from './controls/FormPassword';\nimport { FormSelect } from './controls/FormSelect';\nimport { FormSubmit } from './controls/FormSubmit';\nimport { FormTextarea } from './controls/FormTextarea';\nimport { FormTextInput } from './controls/FormTextInput';\nimport { FormBase } from './FormBase';\nimport { FormErrorBox } from './FormErrorBox';\nimport { FormS3Context, type S3UploadCallback } from './FormS3Context';\n\ntype FormResponse = {\n  body?: object;\n  details?: string;\n  status?: number;\n  url?: string;\n};\n\nexport type FormProps<T extends FieldValues> = {\n  $fetcher: (params: { data: T }) => Promise<unknown>;\n  onValidSubmit?: (response: FormResponse) => void;\n  onInvalidSubmit?: (params: {\n    message: string;\n    setError: UseFormSetError<T>;\n    status: number;\n  }) => void;\n  invalidStatus?: number[];\n  children: ReactNode;\n  schema?: ZodObject<Record<string, ZodTypeAny>>;\n  t?: (\n    key: string,\n    bindings?: Record<string, string>,\n    fallback?: string,\n  ) => string | React.ReactNode;\n  /** Mensaje mostrado al usuario si falla la subida de archivos a S3 tras el submit. */\n  s3UploadErrorMessage?: string;\n  classNames?: {\n    form?: string;\n    root?: string;\n  };\n};\n\ntype FormError = {\n  statusCode: number;\n  message: string;\n  cause?: {\n    issues: Record<string, string>;\n  };\n};\n\nexport const Form = <T extends FieldValues>({\n  $fetcher,\n  onValidSubmit,\n  onInvalidSubmit,\n  invalidStatus = [],\n  children,\n  schema,\n  t,\n  s3UploadErrorMessage,\n  classNames,\n}: FormProps<T>) => {\n  const s3CallbacksRef = useRef<Map<string, S3UploadCallback>>(new Map());\n\n  const s3ContextValue = {\n    registerS3Upload: (name: string, cb: S3UploadCallback) => {\n      s3CallbacksRef.current.set(name, cb);\n    },\n    unregisterS3Upload: (name: string) => {\n      s3CallbacksRef.current.delete(name);\n    },\n  };\n\n  const runS3Uploads = async (response: unknown): Promise<void> => {\n    const callbacks = Array.from(s3CallbacksRef.current.values());\n    await Promise.all(callbacks.map((cb) => cb(response)));\n  };\n\n  const onSubmit = async ({\n    data,\n    setError,\n  }: {\n    data: FieldValues;\n    setError: UseFormSetError<FieldValues>;\n  }) => {\n    await $fetcher({ data: data as T })\n      .then(async (response) => {\n        const res = response as FormError & FormResponse;\n        if (res?.statusCode && res.statusCode >= 400) {\n          throw res;\n        }\n\n        try {\n          await runS3Uploads(response);\n        } catch (e) {\n          console.error('S3 upload error:', e);\n          setError('root.serverError', {\n            type: 's3',\n            message: s3UploadErrorMessage ?? 'Failed to upload files',\n          });\n          return;\n        }\n        onValidSubmit?.((response || {}) as FormResponse);\n      })\n      .catch((error: FormError) => {\n        if (\n          (error.statusCode === 400 || error.statusCode === 422) &&\n          error.cause?.issues\n        ) {\n          Object.keys(error.cause.issues).forEach((key) => {\n            setError(key, {\n              type: 'server',\n              message: error.cause?.issues?.[key],\n            });\n          });\n        }\n\n        if (invalidStatus.includes(error.statusCode) && onInvalidSubmit) {\n          onInvalidSubmit({\n            message: error?.message ?? 'Something went wrong',\n            setError: setError as UseFormSetError<T>,\n            status: error.statusCode,\n          });\n        } else if (error.statusCode === 400 || error.statusCode === 422) {\n          setError('root.serverError', {\n            type: 'server',\n            message: error?.message ?? 'Something went wrong',\n          });\n        } else {\n          throw error;\n        }\n      });\n  };\n\n  return (\n    <FormS3Context.Provider value={s3ContextValue}>\n      <FormBase\n        onSubmit={onSubmit}\n        schema={schema}\n        errorBox={FormErrorBox}\n        t={t}\n        classNames={{\n          form: classNames?.form ?? form(),\n          root: classNames?.root ?? formRoot(),\n        }}\n      >\n        {children}\n      </FormBase>\n    </FormS3Context.Provider>\n  );\n};\n\nForm.displayName = 'Form';\nForm.TextInput = FormTextInput;\nForm.Textarea = FormTextarea;\nForm.Submit = FormSubmit;\nForm.Hidden = FormHidden;\nForm.Checkbox = FormCheckbox;\nForm.CheckboxTree = FormCheckboxTree;\nForm.Password = FormPassword;\nForm.Select = FormSelect;\nForm.Combobox = FormCombobox;\nForm.Autocomplete = FormAutocomplete;\nForm.DatePicker = FormDatePicker;\nForm.DateTimePicker = FormDateTimePicker;\nForm.FileInput = FormFileInput;\nForm.FileInputMultiple = FormFileInputMultiple;\nForm.FileInputS3 = FormFileInputS3;\nForm.FileInputMultipleS3 = FormFileInputMultipleS3;\nForm.Dropzone = FormDropzone;\nForm.DropzoneS3 = FormDropzoneS3;\n"],"mappings":"24CAqEA,MAAa,GAA+B,CAC1C,WACA,gBACA,kBACA,gBAAgB,EAAE,CAClB,WACA,SACA,IACA,uBACA,gBACkB,CAClB,IAAM,EAAiB,EAAsC,IAAI,IAAM,CAEjE,EAAiB,CACrB,kBAAmB,EAAc,IAAyB,CACxD,EAAe,QAAQ,IAAI,EAAM,EAAG,EAEtC,mBAAqB,GAAiB,CACpC,EAAe,QAAQ,OAAO,EAAK,EAEtC,CAEK,EAAe,KAAO,IAAqC,CAC/D,IAAM,EAAY,MAAM,KAAK,EAAe,QAAQ,QAAQ,CAAC,CAC7D,MAAM,QAAQ,IAAI,EAAU,IAAK,GAAO,EAAG,EAAS,CAAC,CAAC,EA2DxD,OACE,EAAC,EAAc,SAAf,CAAwB,MAAO,WAC7B,EAAC,EAAD,CACY,SA3DC,MAAO,CACtB,OACA,cAII,CACJ,MAAM,EAAS,CAAQ,OAAW,CAAC,CAChC,KAAK,KAAO,IAAa,CACxB,IAAM,EAAM,EACZ,GAAI,GAAK,YAAc,EAAI,YAAc,IACvC,MAAM,EAGR,GAAI,CACF,MAAM,EAAa,EAAS,OACrB,EAAG,CACV,QAAQ,MAAM,mBAAoB,EAAE,CACpC,EAAS,mBAAoB,CAC3B,KAAM,KACN,QAAS,GAAwB,yBAClC,CAAC,CACF,OAEF,IAAiB,GAAY,EAAE,CAAkB,EACjD,CACD,MAAO,GAAqB,CAa3B,IAXG,EAAM,aAAe,KAAO,EAAM,aAAe,MAClD,EAAM,OAAO,QAEb,OAAO,KAAK,EAAM,MAAM,OAAO,CAAC,QAAS,GAAQ,CAC/C,EAAS,EAAK,CACZ,KAAM,SACN,QAAS,EAAM,OAAO,SAAS,GAChC,CAAC,EACF,CAGA,EAAc,SAAS,EAAM,WAAW,EAAI,EAC9C,EAAgB,CACd,QAAS,GAAO,SAAW,uBACjB,WACV,OAAQ,EAAM,WACf,CAAC,SACO,EAAM,aAAe,KAAO,EAAM,aAAe,IAC1D,EAAS,mBAAoB,CAC3B,KAAM,SACN,QAAS,GAAO,SAAW,uBAC5B,CAAC,MAEF,MAAM,GAER,EAOQ,SACR,SAAU,EACP,IACH,WAAY,CACV,KAAM,GAAY,MAAQ,GAAM,CAChC,KAAM,GAAY,MAAQ,GAAU,CACrC,CAEA,WACQ,CAAA,CACY,CAAA,EAI7B,EAAK,YAAc,OACnB,EAAK,UAAY,EACjB,EAAK,SAAW,EAChB,EAAK,OAAS,EACd,EAAK,OAAS,EACd,EAAK,SAAW,EAChB,EAAK,aAAe,EACpB,EAAK,SAAW,EAChB,EAAK,OAAS,EACd,EAAK,SAAW,EAChB,EAAK,aAAe,EACpB,EAAK,WAAa,EAClB,EAAK,eAAiB,EACtB,EAAK,UAAY,EACjB,EAAK,kBAAoB,EACzB,EAAK,YAAc,EACnB,EAAK,oBAAsB,EAC3B,EAAK,SAAW,EAChB,EAAK,WAAa"}
+{"version":3,"file":"Form.mjs","names":[],"sources":["../../../src/components/forms/Form.tsx"],"sourcesContent":["import type React from 'react';\nimport type { ReactNode } from 'react';\nimport { useRef } from 'react';\nimport type { FieldValues, UseFormSetError } from 'react-hook-form';\nimport type { ZodObject, ZodTypeAny } from 'zod';\n\nimport { form, formRoot } from '@mage-ui/styled-system/recipes';\n\nimport { FormAutocomplete } from './controls/FormAutocomplete';\nimport { FormCheckbox } from './controls/FormCheckbox';\nimport { FormCheckboxGroup } from './controls/FormCheckboxGroup';\nimport { FormCheckboxTree } from './controls/FormCheckboxTree';\nimport { FormCombobox } from './controls/FormCombobox';\nimport { FormDatePicker } from './controls/FormDatePicker';\nimport { FormDateTimePicker } from './controls/FormDateTimePicker';\nimport { FormDropzone } from './controls/FormDropzone';\nimport { FormDropzoneS3 } from './controls/FormDropzoneS3';\nimport { FormFileInput } from './controls/FormFileInput';\nimport { FormFileInputMultiple } from './controls/FormFileInputMultiple';\nimport { FormFileInputMultipleS3 } from './controls/FormFileInputMultipleS3';\nimport { FormFileInputS3 } from './controls/FormFileInputS3';\nimport { FormHidden } from './controls/FormHidden';\nimport { FormPassword } from './controls/FormPassword';\nimport { FormRadioGroup } from './controls/FormRadioGroup';\nimport { FormSelect } from './controls/FormSelect';\nimport { FormSubmit } from './controls/FormSubmit';\nimport { FormTextarea } from './controls/FormTextarea';\nimport { FormTextInput } from './controls/FormTextInput';\nimport { FormBase } from './FormBase';\nimport { FormErrorBox } from './FormErrorBox';\nimport { FormS3Context, type S3UploadCallback } from './FormS3Context';\n\ntype FormResponse = {\n  body?: object;\n  details?: string;\n  status?: number;\n  url?: string;\n};\n\nexport type FormProps<T extends FieldValues> = {\n  $fetcher: (params: { data: T }) => Promise<unknown>;\n  onValidSubmit?: (response: FormResponse) => void;\n  onInvalidSubmit?: (params: {\n    message: string;\n    setError: UseFormSetError<T>;\n    status: number;\n  }) => void;\n  invalidStatus?: number[];\n  children: ReactNode;\n  schema?: ZodObject<Record<string, ZodTypeAny>>;\n  t?: (\n    key: string,\n    bindings?: Record<string, string>,\n    fallback?: string,\n  ) => string | React.ReactNode;\n  /** Mensaje mostrado al usuario si falla la subida de archivos a S3 tras el submit. */\n  s3UploadErrorMessage?: string;\n  classNames?: {\n    form?: string;\n    root?: string;\n  };\n};\n\ntype FormError = {\n  statusCode: number;\n  message: string;\n  cause?: {\n    issues: Record<string, string>;\n  };\n};\n\nexport const Form = <T extends FieldValues>({\n  $fetcher,\n  onValidSubmit,\n  onInvalidSubmit,\n  invalidStatus = [],\n  children,\n  schema,\n  t,\n  s3UploadErrorMessage,\n  classNames,\n}: FormProps<T>) => {\n  const s3CallbacksRef = useRef<Map<string, S3UploadCallback>>(new Map());\n\n  const s3ContextValue = {\n    registerS3Upload: (name: string, cb: S3UploadCallback) => {\n      s3CallbacksRef.current.set(name, cb);\n    },\n    unregisterS3Upload: (name: string) => {\n      s3CallbacksRef.current.delete(name);\n    },\n  };\n\n  const runS3Uploads = async (response: unknown): Promise<void> => {\n    const callbacks = Array.from(s3CallbacksRef.current.values());\n    await Promise.all(callbacks.map((cb) => cb(response)));\n  };\n\n  const onSubmit = async ({\n    data,\n    setError,\n  }: {\n    data: FieldValues;\n    setError: UseFormSetError<FieldValues>;\n  }) => {\n    await $fetcher({ data: data as T })\n      .then(async (response) => {\n        const res = response as FormError & FormResponse;\n        if (res?.statusCode && res.statusCode >= 400) {\n          throw res;\n        }\n\n        try {\n          await runS3Uploads(response);\n        } catch (e) {\n          console.error('S3 upload error:', e);\n          setError('root.serverError', {\n            type: 's3',\n            message: s3UploadErrorMessage ?? 'Failed to upload files',\n          });\n          return;\n        }\n        onValidSubmit?.((response || {}) as FormResponse);\n      })\n      .catch((error: FormError) => {\n        if (\n          (error.statusCode === 400 || error.statusCode === 422) &&\n          error.cause?.issues\n        ) {\n          Object.keys(error.cause.issues).forEach((key) => {\n            setError(key, {\n              type: 'server',\n              message: error.cause?.issues?.[key],\n            });\n          });\n        }\n\n        if (invalidStatus.includes(error.statusCode) && onInvalidSubmit) {\n          onInvalidSubmit({\n            message: error?.message ?? 'Something went wrong',\n            setError: setError as UseFormSetError<T>,\n            status: error.statusCode,\n          });\n        } else if (error.statusCode === 400 || error.statusCode === 422) {\n          setError('root.serverError', {\n            type: 'server',\n            message: error?.message ?? 'Something went wrong',\n          });\n        } else {\n          throw error;\n        }\n      });\n  };\n\n  return (\n    <FormS3Context.Provider value={s3ContextValue}>\n      <FormBase\n        onSubmit={onSubmit}\n        schema={schema}\n        errorBox={FormErrorBox}\n        t={t}\n        classNames={{\n          form: classNames?.form ?? form(),\n          root: classNames?.root ?? formRoot(),\n        }}\n      >\n        {children}\n      </FormBase>\n    </FormS3Context.Provider>\n  );\n};\n\nForm.displayName = 'Form';\nForm.TextInput = FormTextInput;\nForm.Textarea = FormTextarea;\nForm.Submit = FormSubmit;\nForm.Hidden = FormHidden;\nForm.Checkbox = FormCheckbox;\nForm.CheckboxGroup = FormCheckboxGroup;\nForm.CheckboxTree = FormCheckboxTree;\nForm.RadioGroup = FormRadioGroup;\nForm.Password = FormPassword;\nForm.Select = FormSelect;\nForm.Combobox = FormCombobox;\nForm.Autocomplete = FormAutocomplete;\nForm.DatePicker = FormDatePicker;\nForm.DateTimePicker = FormDateTimePicker;\nForm.FileInput = FormFileInput;\nForm.FileInputMultiple = FormFileInputMultiple;\nForm.FileInputS3 = FormFileInputS3;\nForm.FileInputMultipleS3 = FormFileInputMultipleS3;\nForm.Dropzone = FormDropzone;\nForm.DropzoneS3 = FormDropzoneS3;\n"],"mappings":"+gDAuEA,MAAa,GAA+B,CAC1C,WACA,gBACA,kBACA,gBAAgB,EAAE,CAClB,WACA,SACA,IACA,uBACA,gBACkB,CAClB,IAAM,EAAiB,EAAsC,IAAI,IAAM,CAEjE,EAAiB,CACrB,kBAAmB,EAAc,IAAyB,CACxD,EAAe,QAAQ,IAAI,EAAM,EAAG,EAEtC,mBAAqB,GAAiB,CACpC,EAAe,QAAQ,OAAO,EAAK,EAEtC,CAEK,EAAe,KAAO,IAAqC,CAC/D,IAAM,EAAY,MAAM,KAAK,EAAe,QAAQ,QAAQ,CAAC,CAC7D,MAAM,QAAQ,IAAI,EAAU,IAAK,GAAO,EAAG,EAAS,CAAC,CAAC,EA2DxD,OACE,EAAC,EAAc,SAAf,CAAwB,MAAO,WAC7B,EAAC,EAAD,CACY,SA3DC,MAAO,CACtB,OACA,cAII,CACJ,MAAM,EAAS,CAAQ,OAAW,CAAC,CAChC,KAAK,KAAO,IAAa,CACxB,IAAM,EAAM,EACZ,GAAI,GAAK,YAAc,EAAI,YAAc,IACvC,MAAM,EAGR,GAAI,CACF,MAAM,EAAa,EAAS,OACrB,EAAG,CACV,QAAQ,MAAM,mBAAoB,EAAE,CACpC,EAAS,mBAAoB,CAC3B,KAAM,KACN,QAAS,GAAwB,yBAClC,CAAC,CACF,OAEF,IAAiB,GAAY,EAAE,CAAkB,EACjD,CACD,MAAO,GAAqB,CAa3B,IAXG,EAAM,aAAe,KAAO,EAAM,aAAe,MAClD,EAAM,OAAO,QAEb,OAAO,KAAK,EAAM,MAAM,OAAO,CAAC,QAAS,GAAQ,CAC/C,EAAS,EAAK,CACZ,KAAM,SACN,QAAS,EAAM,OAAO,SAAS,GAChC,CAAC,EACF,CAGA,EAAc,SAAS,EAAM,WAAW,EAAI,EAC9C,EAAgB,CACd,QAAS,GAAO,SAAW,uBACjB,WACV,OAAQ,EAAM,WACf,CAAC,SACO,EAAM,aAAe,KAAO,EAAM,aAAe,IAC1D,EAAS,mBAAoB,CAC3B,KAAM,SACN,QAAS,GAAO,SAAW,uBAC5B,CAAC,MAEF,MAAM,GAER,EAOQ,SACR,SAAU,EACP,IACH,WAAY,CACV,KAAM,GAAY,MAAQ,GAAM,CAChC,KAAM,GAAY,MAAQ,GAAU,CACrC,CAEA,WACQ,CAAA,CACY,CAAA,EAI7B,EAAK,YAAc,OACnB,EAAK,UAAY,EACjB,EAAK,SAAW,EAChB,EAAK,OAAS,EACd,EAAK,OAAS,EACd,EAAK,SAAW,EAChB,EAAK,cAAgB,EACrB,EAAK,aAAe,EACpB,EAAK,WAAa,EAClB,EAAK,SAAW,EAChB,EAAK,OAAS,EACd,EAAK,SAAW,EAChB,EAAK,aAAe,EACpB,EAAK,WAAa,EAClB,EAAK,eAAiB,EACtB,EAAK,UAAY,EACjB,EAAK,kBAAoB,EACzB,EAAK,YAAc,EACnB,EAAK,oBAAsB,EAC3B,EAAK,SAAW,EAChB,EAAK,WAAa"}

package/dist/components/forms/controls/FormCheckboxGroup.d.mts

@@ -0,0 +1,12 @@
+import { CheckboxGroupProps } from "../../controls/checkbox-group/CheckboxGroup.mjs";
+//#region src/components/forms/controls/FormCheckboxGroup.d.ts
+type FormCheckboxGroupProps = Omit<CheckboxGroupProps, 'value' | 'onChange'> & {
+  $rule?: string;
+  defaultValue?: string[];
+  error?: string;
+  isSubmitting?: boolean;
+  name: string;
+};
+//#endregion
+export { FormCheckboxGroupProps };
+//# sourceMappingURL=FormCheckboxGroup.d.mts.map

package/dist/components/forms/controls/FormCheckboxGroup.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormCheckboxGroup.d.mts","names":[],"sources":["../../../../src/components/forms/controls/FormCheckboxGroup.tsx"],"mappings":";;KAOY,sBAAA,GAAyB,IAAA,CACnC,kBAAA;EAGA,KAAA;EACA,YAAA;EACA,KAAA;EACA,YAAA;EACA,IAAA;AAAA"}

package/dist/components/forms/controls/FormCheckboxGroup.mjs

@@ -0,0 +1,2 @@
+import{CheckboxGroup as e}from"../../controls/checkbox-group/CheckboxGroup.mjs";import{jsx as t}from"react/jsx-runtime";import{Controller as n}from"react-hook-form";const r=({$rule:r,defaultValue:i,isSubmitting:a,name:o,disabled:s,...c})=>t(n,{name:o,defaultValue:i??[],render:({field:{onChange:n,value:r}})=>t(e,{...c,disabled:a||s,value:r??[],onChange:n})});r.displayName=`Form.CheckboxGroup`;export{r as FormCheckboxGroup};
+//# sourceMappingURL=FormCheckboxGroup.mjs.map

package/dist/components/forms/controls/FormCheckboxGroup.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormCheckboxGroup.mjs","names":[],"sources":["../../../../src/components/forms/controls/FormCheckboxGroup.tsx"],"sourcesContent":["import { Controller } from 'react-hook-form';\n\nimport {\n  CheckboxGroup,\n  type CheckboxGroupProps,\n} from '@/components/controls/checkbox-group/CheckboxGroup';\n\nexport type FormCheckboxGroupProps = Omit<\n  CheckboxGroupProps,\n  'value' | 'onChange'\n> & {\n  $rule?: string;\n  defaultValue?: string[];\n  error?: string;\n  isSubmitting?: boolean;\n  name: string;\n};\n\nexport const FormCheckboxGroup = ({\n  $rule: _$rule,\n  defaultValue,\n  isSubmitting,\n  name,\n  disabled,\n  ...props\n}: FormCheckboxGroupProps) => {\n  return (\n    <Controller\n      name={name}\n      defaultValue={defaultValue ?? []}\n      render={({ field: { onChange, value } }) => (\n        <CheckboxGroup\n          {...props}\n          disabled={isSubmitting || disabled}\n          value={value ?? []}\n          onChange={onChange}\n        />\n      )}\n    />\n  );\n};\n\nFormCheckboxGroup.displayName = 'Form.CheckboxGroup';\n"],"mappings":"qKAkBA,MAAa,GAAqB,CAChC,MAAO,EACP,eACA,eACA,OACA,WACA,GAAG,KAGD,EAAC,EAAD,CACQ,OACN,aAAc,GAAgB,EAAE,CAChC,QAAS,CAAE,MAAO,CAAE,WAAU,YAC5B,EAAC,EAAD,CACE,GAAI,EACJ,SAAU,GAAgB,EAC1B,MAAO,GAAS,EAAE,CACR,WACV,CAAA,CAEJ,CAAA,CAIN,EAAkB,YAAc"}

package/dist/components/forms/controls/FormRadioGroup.d.mts

@@ -0,0 +1,12 @@
+import { RadioGroupProps } from "../../controls/radio-group/RadioGroup.mjs";
+//#region src/components/forms/controls/FormRadioGroup.d.ts
+type FormRadioGroupProps = Omit<RadioGroupProps, 'value' | 'onChange'> & {
+  $rule?: string;
+  defaultValue?: string;
+  error?: string;
+  isSubmitting?: boolean;
+  name: string;
+};
+//#endregion
+export { FormRadioGroupProps };
+//# sourceMappingURL=FormRadioGroup.d.mts.map

package/dist/components/forms/controls/FormRadioGroup.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormRadioGroup.d.mts","names":[],"sources":["../../../../src/components/forms/controls/FormRadioGroup.tsx"],"mappings":";;KAOY,mBAAA,GAAsB,IAAA,CAChC,eAAA;EAGA,KAAA;EACA,YAAA;EACA,KAAA;EACA,YAAA;EACA,IAAA;AAAA"}

package/dist/components/forms/controls/FormRadioGroup.mjs

@@ -0,0 +1,2 @@
+import{RadioGroup as e}from"../../controls/radio-group/RadioGroup.mjs";import{jsx as t}from"react/jsx-runtime";import{Controller as n}from"react-hook-form";const r=({$rule:r,defaultValue:i,isSubmitting:a,name:o,...s})=>t(n,{name:o,defaultValue:i,render:({field:{onChange:n,value:r}})=>t(e,{...s,value:r,onChange:n})});r.displayName=`Form.RadioGroup`;export{r as FormRadioGroup};
+//# sourceMappingURL=FormRadioGroup.mjs.map

package/dist/components/forms/controls/FormRadioGroup.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormRadioGroup.mjs","names":[],"sources":["../../../../src/components/forms/controls/FormRadioGroup.tsx"],"sourcesContent":["import { Controller } from 'react-hook-form';\n\nimport {\n  RadioGroup,\n  type RadioGroupProps,\n} from '@/components/controls/radio-group/RadioGroup';\n\nexport type FormRadioGroupProps = Omit<\n  RadioGroupProps,\n  'value' | 'onChange'\n> & {\n  $rule?: string;\n  defaultValue?: string;\n  error?: string;\n  isSubmitting?: boolean;\n  name: string;\n};\n\nexport const FormRadioGroup = ({\n  $rule: _$rule,\n  defaultValue,\n  isSubmitting: _isSubmitting,\n  name,\n  ...props\n}: FormRadioGroupProps) => {\n  return (\n    <Controller\n      name={name}\n      defaultValue={defaultValue}\n      render={({ field: { onChange, value } }) => (\n        <RadioGroup {...props} value={value} onChange={onChange} />\n      )}\n    />\n  );\n};\n\nFormRadioGroup.displayName = 'Form.RadioGroup';\n"],"mappings":"4JAkBA,MAAa,GAAkB,CAC7B,MAAO,EACP,eACA,aAAc,EACd,OACA,GAAG,KAGD,EAAC,EAAD,CACQ,OACQ,eACd,QAAS,CAAE,MAAO,CAAE,WAAU,YAC5B,EAAC,EAAD,CAAY,GAAI,EAAc,QAAiB,WAAY,CAAA,CAE7D,CAAA,CAIN,EAAe,YAAc"}

package/dist/components/forms/controls/index.mjs

@@ -1,2 +1,2 @@
-import{FormAutocomplete as e}from"./FormAutocomplete.mjs";import{FormCheckbox as t}from"./FormCheckbox.mjs";import{FormCheckboxTree as n}from"./FormCheckboxTree.mjs";import{FormCombobox as r}from"./FormCombobox.mjs";import{FormDatePicker as i}from"./FormDatePicker.mjs";import{FormDateTimePicker as a}from"./FormDateTimePicker.mjs";import{FormDropzone as o}from"./FormDropzone.mjs";import{FormDropzoneS3 as s}from"./FormDropzoneS3.mjs";import{FormFileInput as c}from"./FormFileInput.mjs";import{FormFileInputMultiple as l}from"./FormFileInputMultiple.mjs";import{FormFileInputMultipleS3 as u}from"./FormFileInputMultipleS3.mjs";import{FormFileInputS3 as d}from"./FormFileInputS3.mjs";import{FormHidden as f}from"./FormHidden.mjs";import{FormPassword as p}from"./FormPassword.mjs";import{FormSelect as m}from"./FormSelect.mjs";import{FormSubmit as h}from"./FormSubmit.mjs";import{FormTextarea as g}from"./FormTextarea.mjs";import{FormTextInput as _}from"./FormTextInput.mjs";const v=[h,_,g,p,f,t,n,m,r,e,i,a,c,l,d,u,o,s];export{v as controls};
+import{FormAutocomplete as e}from"./FormAutocomplete.mjs";import{FormCheckbox as t}from"./FormCheckbox.mjs";import{FormCheckboxGroup as n}from"./FormCheckboxGroup.mjs";import{FormCheckboxTree as r}from"./FormCheckboxTree.mjs";import{FormCombobox as i}from"./FormCombobox.mjs";import{FormDatePicker as a}from"./FormDatePicker.mjs";import{FormDateTimePicker as o}from"./FormDateTimePicker.mjs";import{FormDropzone as s}from"./FormDropzone.mjs";import{FormDropzoneS3 as c}from"./FormDropzoneS3.mjs";import{FormFileInput as l}from"./FormFileInput.mjs";import{FormFileInputMultiple as u}from"./FormFileInputMultiple.mjs";import{FormFileInputMultipleS3 as d}from"./FormFileInputMultipleS3.mjs";import{FormFileInputS3 as f}from"./FormFileInputS3.mjs";import{FormHidden as p}from"./FormHidden.mjs";import{FormPassword as m}from"./FormPassword.mjs";import{FormRadioGroup as h}from"./FormRadioGroup.mjs";import{FormSelect as g}from"./FormSelect.mjs";import{FormSubmit as _}from"./FormSubmit.mjs";import{FormTextarea as v}from"./FormTextarea.mjs";import{FormTextInput as y}from"./FormTextInput.mjs";const b=[_,y,v,m,p,t,n,r,h,g,i,e,a,o,l,u,f,d,s,c];export{b as controls};
 //# sourceMappingURL=index.mjs.map

package/dist/components/forms/controls/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/forms/controls/index.ts"],"sourcesContent":["import { FormAutocomplete } from './FormAutocomplete';\nimport { FormCheckbox } from './FormCheckbox';\nimport { FormCheckboxTree } from './FormCheckboxTree';\nimport { FormCombobox } from './FormCombobox';\nimport { FormDatePicker } from './FormDatePicker';\nimport { FormDateTimePicker } from './FormDateTimePicker';\nimport { FormDropzone } from './FormDropzone';\nimport { FormDropzoneS3 } from './FormDropzoneS3';\nimport { FormFileInput } from './FormFileInput';\nimport { FormFileInputMultiple } from './FormFileInputMultiple';\nimport { FormFileInputMultipleS3 } from './FormFileInputMultipleS3';\nimport { FormFileInputS3 } from './FormFileInputS3';\nimport { FormHidden } from './FormHidden';\nimport { FormPassword } from './FormPassword';\nimport { FormSelect } from './FormSelect';\nimport { FormSubmit } from './FormSubmit';\nimport { FormTextarea } from './FormTextarea';\nimport { FormTextInput } from './FormTextInput';\n\nexport const controls = [\n  FormSubmit,\n  FormTextInput,\n  FormTextarea,\n  FormPassword,\n  FormHidden,\n  FormCheckbox,\n  FormCheckboxTree,\n  FormSelect,\n  FormCombobox,\n  FormAutocomplete,\n  FormDatePicker,\n  FormDateTimePicker,\n  FormFileInput,\n  FormFileInputMultiple,\n  FormFileInputS3,\n  FormFileInputMultipleS3,\n  FormDropzone,\n  FormDropzoneS3,\n] as React.ComponentType[];\n"],"mappings":"88BAmBA,MAAa,EAAW,CACtB,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACD"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/forms/controls/index.ts"],"sourcesContent":["import { FormAutocomplete } from './FormAutocomplete';\nimport { FormCheckbox } from './FormCheckbox';\nimport { FormCheckboxGroup } from './FormCheckboxGroup';\nimport { FormCheckboxTree } from './FormCheckboxTree';\nimport { FormCombobox } from './FormCombobox';\nimport { FormDatePicker } from './FormDatePicker';\nimport { FormDateTimePicker } from './FormDateTimePicker';\nimport { FormDropzone } from './FormDropzone';\nimport { FormDropzoneS3 } from './FormDropzoneS3';\nimport { FormFileInput } from './FormFileInput';\nimport { FormFileInputMultiple } from './FormFileInputMultiple';\nimport { FormFileInputMultipleS3 } from './FormFileInputMultipleS3';\nimport { FormFileInputS3 } from './FormFileInputS3';\nimport { FormHidden } from './FormHidden';\nimport { FormPassword } from './FormPassword';\nimport { FormRadioGroup } from './FormRadioGroup';\nimport { FormSelect } from './FormSelect';\nimport { FormSubmit } from './FormSubmit';\nimport { FormTextarea } from './FormTextarea';\nimport { FormTextInput } from './FormTextInput';\n\nexport const controls = [\n  FormSubmit,\n  FormTextInput,\n  FormTextarea,\n  FormPassword,\n  FormHidden,\n  FormCheckbox,\n  FormCheckboxGroup,\n  FormCheckboxTree,\n  FormRadioGroup,\n  FormSelect,\n  FormCombobox,\n  FormAutocomplete,\n  FormDatePicker,\n  FormDateTimePicker,\n  FormFileInput,\n  FormFileInputMultiple,\n  FormFileInputS3,\n  FormFileInputMultipleS3,\n  FormDropzone,\n  FormDropzoneS3,\n] as React.ComponentType[];\n"],"mappings":"gkCAqBA,MAAa,EAAW,CACtB,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACA,EACD"}

package/dist/components/forms/controls/register-components.mjs

@@ -1,2 +1,2 @@
-"use client";import{Fragment as e,jsx as t}from"react/jsx-runtime";import{Children as n,cloneElement as r,isValidElement as i}from"react";const a=new Set([`Form.Password`,`Form.Checkbox`,`Form.CheckboxTree`,`Form.Select`,`Form.Combobox`,`Form.Autocomplete`,`Form.DatePicker`,`Form.DateTimePicker`,`Form.Hidden`,`Form.FileInput`,`Form.FileInputMultiple`,`Form.Dropzone`,`Form.DropzoneS3`,`Form.FileInputS3`,`Form.FileInputMultipleS3`]),o=(e,t,n)=>{if(e)try{let r=JSON.parse(e),i={...r.bindings,attribute:t},a=n?n(r.key,i,r.fallback):r.fallback;return String(a).replace(/{attribute}/g,t)}catch{return e.replace(/{attribute}/g,t)}},s=({children:s,register:c,componentTypes:l,errors:u={},t:d})=>{let f=e=>n.map(e,e=>{if(!i(e))return e;let t=e.props;if(l.some(t=>e.type===t)){let n=t.name,i=u[n??``]?.message?.toString(),s=n?o(i,n,d):void 0,l=e.type.displayName;return r(e,{...n!==void 0&&!a.has(l??``)&&n?c(n):{},error:s})}return t.children?r(e,{children:f(t.children)}):e});return t(e,{children:f(s)})};export{s as RegisteredFormChildren};
+"use client";import{Fragment as e,jsx as t}from"react/jsx-runtime";import{Children as n,cloneElement as r,isValidElement as i}from"react";const a=new Set([`Form.Password`,`Form.Checkbox`,`Form.CheckboxGroup`,`Form.CheckboxTree`,`Form.RadioGroup`,`Form.Select`,`Form.Combobox`,`Form.Autocomplete`,`Form.DatePicker`,`Form.DateTimePicker`,`Form.Hidden`,`Form.FileInput`,`Form.FileInputMultiple`,`Form.Dropzone`,`Form.DropzoneS3`,`Form.FileInputS3`,`Form.FileInputMultipleS3`]),o=(e,t,n)=>{if(e)try{let r=JSON.parse(e),i={...r.bindings,attribute:t},a=n?n(r.key,i,r.fallback):r.fallback;return String(a).replace(/{attribute}/g,t)}catch{return e.replace(/{attribute}/g,t)}},s=({children:s,register:c,componentTypes:l,errors:u={},t:d})=>{let f=e=>n.map(e,e=>{if(!i(e))return e;let t=e.props;if(l.some(t=>e.type===t)){let n=t.name,i=u[n??``]?.message?.toString(),s=n?o(i,n,d):void 0,l=e.type.displayName;return r(e,{...n!==void 0&&!a.has(l??``)&&n?c(n):{},error:s})}return t.children?r(e,{children:f(t.children)}):e});return t(e,{children:f(s)})};export{s as RegisteredFormChildren};
 //# sourceMappingURL=register-components.mjs.map

package/dist/components/forms/controls/register-components.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"register-components.mjs","names":[],"sources":["../../../../src/components/forms/controls/register-components.tsx"],"sourcesContent":["'use client';\n\nimport type React from 'react';\nimport { Children, cloneElement, isValidElement } from 'react';\nimport type { FieldErrors, UseFormRegister } from 'react-hook-form';\n\ninterface TranslationMessage {\n  key: string;\n  bindings: Record<string, string>;\n  fallback: string;\n}\n\nconst controllerDisplayNames = new Set([\n  'Form.Password',\n  'Form.Checkbox',\n  'Form.CheckboxTree',\n  'Form.Select',\n  'Form.Combobox',\n  'Form.Autocomplete',\n  'Form.DatePicker',\n  'Form.DateTimePicker',\n  'Form.Hidden',\n  'Form.FileInput',\n  'Form.FileInputMultiple',\n  'Form.Dropzone',\n  'Form.DropzoneS3',\n  'Form.FileInputS3',\n  'Form.FileInputMultipleS3',\n]);\n\nconst parseAndTranslate = (\n  message: string | undefined,\n  fieldName: string,\n  t?: (\n    key: string,\n    bindings?: Record<string, string>,\n    fallback?: string,\n  ) => string | React.ReactNode,\n): string | undefined => {\n  if (!message) return undefined;\n\n  try {\n    const parsed: TranslationMessage = JSON.parse(message);\n    const bindings = { ...parsed.bindings, attribute: fieldName };\n    const result = t\n      ? t(parsed.key, bindings, parsed.fallback)\n      : parsed.fallback;\n    return String(result).replace(/{attribute}/g, fieldName);\n  } catch {\n    return message.replace(/{attribute}/g, fieldName);\n  }\n};\n\ninterface RegisteredFormChildrenProps {\n  children: React.ReactNode;\n  register: UseFormRegister<Record<string, unknown>>;\n  componentTypes: React.ComponentType[];\n  errors?: FieldErrors<Record<string, unknown>>;\n  t?: (\n    key: string,\n    bindings?: Record<string, string>,\n    fallback?: string,\n  ) => string | React.ReactNode;\n}\n\nexport const RegisteredFormChildren = ({\n  children,\n  register,\n  componentTypes,\n  errors = {},\n  t,\n}: RegisteredFormChildrenProps): React.ReactNode => {\n  const processChildren = (nodes: React.ReactNode): React.ReactNode => {\n    return Children.map(nodes, (child) => {\n      if (!isValidElement(child)) {\n        return child;\n      }\n\n      const childProps = child.props as {\n        name?: string;\n        children?: React.ReactNode;\n      };\n\n      if (\n        componentTypes.some((type: React.ComponentType) => child.type === type)\n      ) {\n        const fieldName = childProps.name;\n        const errorMessage = errors[fieldName ?? '']?.message?.toString();\n        const translatedError = fieldName\n          ? parseAndTranslate(errorMessage, fieldName, t)\n          : undefined;\n        const displayName = (\n          child.type as React.ComponentType & { displayName?: string }\n        ).displayName;\n        const shouldRegister =\n          fieldName !== undefined &&\n          !controllerDisplayNames.has(displayName ?? '');\n        const registrationProps =\n          shouldRegister && fieldName ? register(fieldName) : {};\n\n        return cloneElement(child, {\n          ...registrationProps,\n          error: translatedError,\n        } as Partial<typeof child.props>);\n      }\n\n      if (childProps.children) {\n        return cloneElement(child, {\n          children: processChildren(childProps.children),\n        } as Partial<typeof child.props>);\n      }\n\n      return child;\n    });\n  };\n\n  return <>{processChildren(children)}</>;\n};\n"],"mappings":"0IAYA,MAAM,EAAyB,IAAI,IAAI,CACrC,gBACA,gBACA,oBACA,cACA,gBACA,oBACA,kBACA,sBACA,cACA,iBACA,yBACA,gBACA,kBACA,mBACA,2BACD,CAAC,CAEI,GACJ,EACA,EACA,IAKuB,CAClB,KAEL,GAAI,CACF,IAAM,EAA6B,KAAK,MAAM,EAAQ,CAChD,EAAW,CAAE,GAAG,EAAO,SAAU,UAAW,EAAW,CACvD,EAAS,EACX,EAAE,EAAO,IAAK,EAAU,EAAO,SAAS,CACxC,EAAO,SACX,OAAO,OAAO,EAAO,CAAC,QAAQ,eAAgB,EAAU,MAClD,CACN,OAAO,EAAQ,QAAQ,eAAgB,EAAU,GAgBxC,GAA0B,CACrC,WACA,WACA,iBACA,SAAS,EAAE,CACX,OACkD,CAClD,IAAM,EAAmB,GAChB,EAAS,IAAI,EAAQ,GAAU,CACpC,GAAI,CAAC,EAAe,EAAM,CACxB,OAAO,EAGT,IAAM,EAAa,EAAM,MAKzB,GACE,EAAe,KAAM,GAA8B,EAAM,OAAS,EAAK,CACvE,CACA,IAAM,EAAY,EAAW,KACvB,EAAe,EAAO,GAAa,KAAK,SAAS,UAAU,CAC3D,EAAkB,EACpB,EAAkB,EAAc,EAAW,EAAE,CAC7C,IAAA,GACE,EACJ,EAAM,KACN,YAOF,OAAO,EAAa,EAAO,CACzB,GANA,IAAc,IAAA,IACd,CAAC,EAAuB,IAAI,GAAe,GAAG,EAE5B,EAAY,EAAS,EAAU,CAAG,EAAE,CAItD,MAAO,EACR,CAAgC,CASnC,OANI,EAAW,SACN,EAAa,EAAO,CACzB,SAAU,EAAgB,EAAW,SAAS,CAC/C,CAAgC,CAG5B,GACP,CAGJ,OAAO,EAAA,EAAA,CAAA,SAAG,EAAgB,EAAS,CAAI,CAAA"}
+{"version":3,"file":"register-components.mjs","names":[],"sources":["../../../../src/components/forms/controls/register-components.tsx"],"sourcesContent":["'use client';\n\nimport type React from 'react';\nimport { Children, cloneElement, isValidElement } from 'react';\nimport type { FieldErrors, UseFormRegister } from 'react-hook-form';\n\ninterface TranslationMessage {\n  key: string;\n  bindings: Record<string, string>;\n  fallback: string;\n}\n\nconst controllerDisplayNames = new Set([\n  'Form.Password',\n  'Form.Checkbox',\n  'Form.CheckboxGroup',\n  'Form.CheckboxTree',\n  'Form.RadioGroup',\n  'Form.Select',\n  'Form.Combobox',\n  'Form.Autocomplete',\n  'Form.DatePicker',\n  'Form.DateTimePicker',\n  'Form.Hidden',\n  'Form.FileInput',\n  'Form.FileInputMultiple',\n  'Form.Dropzone',\n  'Form.DropzoneS3',\n  'Form.FileInputS3',\n  'Form.FileInputMultipleS3',\n]);\n\nconst parseAndTranslate = (\n  message: string | undefined,\n  fieldName: string,\n  t?: (\n    key: string,\n    bindings?: Record<string, string>,\n    fallback?: string,\n  ) => string | React.ReactNode,\n): string | undefined => {\n  if (!message) return undefined;\n\n  try {\n    const parsed: TranslationMessage = JSON.parse(message);\n    const bindings = { ...parsed.bindings, attribute: fieldName };\n    const result = t\n      ? t(parsed.key, bindings, parsed.fallback)\n      : parsed.fallback;\n    return String(result).replace(/{attribute}/g, fieldName);\n  } catch {\n    return message.replace(/{attribute}/g, fieldName);\n  }\n};\n\ninterface RegisteredFormChildrenProps {\n  children: React.ReactNode;\n  register: UseFormRegister<Record<string, unknown>>;\n  componentTypes: React.ComponentType[];\n  errors?: FieldErrors<Record<string, unknown>>;\n  t?: (\n    key: string,\n    bindings?: Record<string, string>,\n    fallback?: string,\n  ) => string | React.ReactNode;\n}\n\nexport const RegisteredFormChildren = ({\n  children,\n  register,\n  componentTypes,\n  errors = {},\n  t,\n}: RegisteredFormChildrenProps): React.ReactNode => {\n  const processChildren = (nodes: React.ReactNode): React.ReactNode => {\n    return Children.map(nodes, (child) => {\n      if (!isValidElement(child)) {\n        return child;\n      }\n\n      const childProps = child.props as {\n        name?: string;\n        children?: React.ReactNode;\n      };\n\n      if (\n        componentTypes.some((type: React.ComponentType) => child.type === type)\n      ) {\n        const fieldName = childProps.name;\n        const errorMessage = errors[fieldName ?? '']?.message?.toString();\n        const translatedError = fieldName\n          ? parseAndTranslate(errorMessage, fieldName, t)\n          : undefined;\n        const displayName = (\n          child.type as React.ComponentType & { displayName?: string }\n        ).displayName;\n        const shouldRegister =\n          fieldName !== undefined &&\n          !controllerDisplayNames.has(displayName ?? '');\n        const registrationProps =\n          shouldRegister && fieldName ? register(fieldName) : {};\n\n        return cloneElement(child, {\n          ...registrationProps,\n          error: translatedError,\n        } as Partial<typeof child.props>);\n      }\n\n      if (childProps.children) {\n        return cloneElement(child, {\n          children: processChildren(childProps.children),\n        } as Partial<typeof child.props>);\n      }\n\n      return child;\n    });\n  };\n\n  return <>{processChildren(children)}</>;\n};\n"],"mappings":"0IAYA,MAAM,EAAyB,IAAI,IAAI,CACrC,gBACA,gBACA,qBACA,oBACA,kBACA,cACA,gBACA,oBACA,kBACA,sBACA,cACA,iBACA,yBACA,gBACA,kBACA,mBACA,2BACD,CAAC,CAEI,GACJ,EACA,EACA,IAKuB,CAClB,KAEL,GAAI,CACF,IAAM,EAA6B,KAAK,MAAM,EAAQ,CAChD,EAAW,CAAE,GAAG,EAAO,SAAU,UAAW,EAAW,CACvD,EAAS,EACX,EAAE,EAAO,IAAK,EAAU,EAAO,SAAS,CACxC,EAAO,SACX,OAAO,OAAO,EAAO,CAAC,QAAQ,eAAgB,EAAU,MAClD,CACN,OAAO,EAAQ,QAAQ,eAAgB,EAAU,GAgBxC,GAA0B,CACrC,WACA,WACA,iBACA,SAAS,EAAE,CACX,OACkD,CAClD,IAAM,EAAmB,GAChB,EAAS,IAAI,EAAQ,GAAU,CACpC,GAAI,CAAC,EAAe,EAAM,CACxB,OAAO,EAGT,IAAM,EAAa,EAAM,MAKzB,GACE,EAAe,KAAM,GAA8B,EAAM,OAAS,EAAK,CACvE,CACA,IAAM,EAAY,EAAW,KACvB,EAAe,EAAO,GAAa,KAAK,SAAS,UAAU,CAC3D,EAAkB,EACpB,EAAkB,EAAc,EAAW,EAAE,CAC7C,IAAA,GACE,EACJ,EAAM,KACN,YAOF,OAAO,EAAa,EAAO,CACzB,GANA,IAAc,IAAA,IACd,CAAC,EAAuB,IAAI,GAAe,GAAG,EAE5B,EAAY,EAAS,EAAU,CAAG,EAAE,CAItD,MAAO,EACR,CAAgC,CASnC,OANI,EAAW,SACN,EAAa,EAAO,CACzB,SAAU,EAAgB,EAAW,SAAS,CAC/C,CAAgC,CAG5B,GACP,CAGJ,OAAO,EAAA,EAAA,CAAA,SAAG,EAAgB,EAAS,CAAI,CAAA"}

package/dist/components/forms/rules/extract-form-rules.mjs

@@ -1,2 +1,2 @@
-import{findFormComponents as e}from"../controls/find-form-components.mjs";import{PASSWORD_RULES as t}from"./password-rules.mjs";import n from"./password.mjs";import{parseRules as r}from"./zod.mjs";import{z as i}from"zod";const a=(e,t)=>{if(!e.name||!e.$rule?.includes(`confirmed`))return;let n=e.$rule.split(`|`).find(e=>e.startsWith(`confirmed`)),r=n?.includes(`:`)?n.split(`:`)[1]:`${e.name}_confirmation`;t.confirmedFields.push({field:e.name,target:r})},o=(e,t)=>{e.name&&(e.$rule?.includes(`required`)?(t.rules[e.name]=i.boolean().optional().or(i.literal(!1)),t.requiredBooleanFields.push(e.name)):t.rules[e.name]=i.boolean().optional())},s=(e,t)=>{e.name&&(e.$rule?.includes(`required`)?t.rules[e.name]=i.any().refine(e=>Array.isArray(e)&&e.length>0,{message:f}):t.rules[e.name]=i.array(i.string()).optional())},c=(e,a)=>{if(!e.name)return;let o=i.string(),s=e.$rule?e.$rule.split(`|`).filter(e=>e.trim()!==`password`).join(`|`):``;s&&(o=r(s));let c=e.rules||(e.$rule?.includes(`password`)?t:[]);c.length>0&&(o=n(o,c));let l=!e.$rule||e.$rule.includes(`optional`)||s.includes(`optional`);a.rules[e.name]=l?o.optional():o},l=(e,t)=>{e.name&&(t.rules[e.name]=e.$rule?r(e.$rule):i.string().optional())},u=(e,t)=>{e.name&&(t.rules[e.name]=i.any().optional())},d=(e,t)=>{e.name&&(t.rules[e.name]=e.$rule?r(e.$rule):i.string().nullable().optional())},f=JSON.stringify({key:`required`,fallback:`El campo {attribute} es obligatorio.`,bindings:{}}),p=(e,t,n)=>{e.name&&(e.$rule?.includes(`required`)?t.rules[e.name]=n?i.any().refine(e=>Array.isArray(e)&&e.length>0,{message:f}):i.any().refine(e=>e instanceof File,{message:f}):t.rules[e.name]=i.any().optional())},m=(e,t)=>t.confirmedFields.length===0&&t.requiredBooleanFields.length===0?e:e.superRefine((e,n)=>{t.confirmedFields.forEach(({field:t,target:r})=>{e[t]!==e[r]&&n.addIssue({code:i.ZodIssueCode.custom,message:JSON.stringify({key:`confirmed`,fallback:`La confirmación no coincide.`,bindings:{}}),path:[r]})}),t.requiredBooleanFields.forEach(t=>{e[t]!==!0&&n.addIssue({code:i.ZodIssueCode.custom,message:JSON.stringify({key:`required`,fallback:`El campo {attribute} es obligatorio.`,bindings:{}}),path:[t]})})}),h=(t,n)=>{let r={rules:{},confirmedFields:[],requiredBooleanFields:[]};return e(t,n).forEach(e=>{let t=e.props,n=e.type.displayName;t.name&&(a(t,r),n===`Form.Checkbox`?o(t,r):n===`Form.CheckboxTree`?s(t,r):n===`Form.Password`?c(t,r):n===`Form.Select`||n===`Form.Combobox`||n===`Form.Autocomplete`?u(t,r):n===`Form.DatePicker`||n===`Form.DateTimePicker`?d(t,r):n===`Form.FileInput`?p(t,r,!1):n===`Form.FileInputMultiple`||n===`Form.Dropzone`||n===`Form.DropzoneS3`?p(t,r,!0):l(t,r))}),m(i.object(r.rules).loose(),r)};export{h as extractFormRules};
+import{findFormComponents as e}from"../controls/find-form-components.mjs";import{PASSWORD_RULES as t}from"./password-rules.mjs";import n from"./password.mjs";import{parseRules as r}from"./zod.mjs";import{z as i}from"zod";const a=(e,t)=>{if(!e.name||!e.$rule?.includes(`confirmed`))return;let n=e.$rule.split(`|`).find(e=>e.startsWith(`confirmed`)),r=n?.includes(`:`)?n.split(`:`)[1]:`${e.name}_confirmation`;t.confirmedFields.push({field:e.name,target:r})},o=(e,t)=>{e.name&&(e.$rule?.includes(`required`)?(t.rules[e.name]=i.boolean().optional().or(i.literal(!1)),t.requiredBooleanFields.push(e.name)):t.rules[e.name]=i.boolean().optional())},s=(e,t)=>{e.name&&(e.$rule?.includes(`required`)?t.rules[e.name]=i.any().refine(e=>Array.isArray(e)&&e.length>0,{message:f}):t.rules[e.name]=i.array(i.string()).optional())},c=(e,a)=>{if(!e.name)return;let o=i.string(),s=e.$rule?e.$rule.split(`|`).filter(e=>e.trim()!==`password`).join(`|`):``;s&&(o=r(s));let c=e.rules||(e.$rule?.includes(`password`)?t:[]);c.length>0&&(o=n(o,c));let l=!e.$rule||e.$rule.includes(`optional`)||s.includes(`optional`);a.rules[e.name]=l?o.optional():o},l=(e,t)=>{e.name&&(t.rules[e.name]=e.$rule?r(e.$rule):i.string().optional())},u=(e,t)=>{e.name&&(t.rules[e.name]=i.any().optional())},d=(e,t)=>{e.name&&(t.rules[e.name]=e.$rule?r(e.$rule):i.string().nullable().optional())},f=JSON.stringify({key:`required`,fallback:`El campo {attribute} es obligatorio.`,bindings:{}}),p=(e,t,n)=>{e.name&&(e.$rule?.includes(`required`)?t.rules[e.name]=n?i.any().refine(e=>Array.isArray(e)&&e.length>0,{message:f}):i.any().refine(e=>e instanceof File,{message:f}):t.rules[e.name]=i.any().optional())},m=(e,t)=>t.confirmedFields.length===0&&t.requiredBooleanFields.length===0?e:e.superRefine((e,n)=>{t.confirmedFields.forEach(({field:t,target:r})=>{e[t]!==e[r]&&n.addIssue({code:i.ZodIssueCode.custom,message:JSON.stringify({key:`confirmed`,fallback:`La confirmación no coincide.`,bindings:{}}),path:[r]})}),t.requiredBooleanFields.forEach(t=>{e[t]!==!0&&n.addIssue({code:i.ZodIssueCode.custom,message:JSON.stringify({key:`required`,fallback:`El campo {attribute} es obligatorio.`,bindings:{}}),path:[t]})})}),h=(t,n)=>{let r={rules:{},confirmedFields:[],requiredBooleanFields:[]};return e(t,n).forEach(e=>{let t=e.props,n=e.type.displayName;t.name&&(a(t,r),n===`Form.Checkbox`?o(t,r):n===`Form.CheckboxTree`||n===`Form.CheckboxGroup`?s(t,r):n===`Form.Password`?c(t,r):n===`Form.Select`||n===`Form.Combobox`||n===`Form.Autocomplete`?u(t,r):n===`Form.DatePicker`||n===`Form.DateTimePicker`?d(t,r):n===`Form.FileInput`?p(t,r,!1):n===`Form.FileInputMultiple`||n===`Form.Dropzone`||n===`Form.DropzoneS3`?p(t,r,!0):l(t,r))}),m(i.object(r.rules).loose(),r)};export{h as extractFormRules};
 //# sourceMappingURL=extract-form-rules.mjs.map

package/dist/components/forms/rules/extract-form-rules.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"extract-form-rules.mjs","names":["passwordRule"],"sources":["../../../../src/components/forms/rules/extract-form-rules.ts"],"sourcesContent":["import type React from 'react';\nimport type { FieldValues } from 'react-hook-form';\nimport { type ZodTypeAny, z } from 'zod';\n\nimport type { PasswordRuleDefinition } from '@/components/controls/password-input/usePasswordRules';\n\nimport { findFormComponents } from '../controls/find-form-components';\nimport passwordRule from './password';\nimport { PASSWORD_RULES } from './password-rules';\nimport { parseRules } from './zod';\n\ntype FormRuleContext = {\n  rules: Record<string, ZodTypeAny>;\n  confirmedFields: { field: string; target: string }[];\n  requiredBooleanFields: string[];\n};\n\ntype ComponentProps = {\n  name?: string;\n  $rule?: string;\n  rules?: PasswordRuleDefinition[];\n};\n\nconst processConfirmedRule = (\n  props: ComponentProps,\n  context: FormRuleContext,\n) => {\n  if (!props.name || !props.$rule?.includes('confirmed')) return;\n\n  const rulesList = props.$rule.split('|');\n  const confirmedRule = rulesList.find((r) => r.startsWith('confirmed'));\n  const target = confirmedRule?.includes(':')\n    ? confirmedRule.split(':')[1]\n    : `${props.name}_confirmation`;\n\n  context.confirmedFields.push({ field: props.name, target });\n};\n\nconst processCheckbox = (props: ComponentProps, context: FormRuleContext) => {\n  if (!props.name) return;\n\n  if (props.$rule?.includes('required')) {\n    context.rules[props.name] = z.boolean().optional().or(z.literal(false));\n    context.requiredBooleanFields.push(props.name);\n  } else {\n    context.rules[props.name] = z.boolean().optional();\n  }\n};\n\nconst processCheckboxTree = (\n  props: ComponentProps,\n  context: FormRuleContext,\n) => {\n  if (!props.name) return;\n\n  if (props.$rule?.includes('required')) {\n    context.rules[props.name] = z\n      .any()\n      .refine((val) => Array.isArray(val) && val.length > 0, {\n        message: requiredMessage,\n      });\n  } else {\n    context.rules[props.name] = z.array(z.string()).optional();\n  }\n};\n\nconst processPassword = (props: ComponentProps, context: FormRuleContext) => {\n  if (!props.name) return;\n\n  let baseSchema: ZodTypeAny = z.string();\n  const otherRules = props.$rule\n    ? props.$rule\n        .split('|')\n        .filter((r) => r.trim() !== 'password')\n        .join('|')\n    : '';\n\n  if (otherRules) {\n    baseSchema = parseRules(otherRules);\n  }\n\n  const passwordRules =\n    props.rules || (props.$rule?.includes('password') ? PASSWORD_RULES : []);\n\n  if (passwordRules.length > 0) {\n    baseSchema = passwordRule(baseSchema, passwordRules);\n  }\n\n  const isOptional =\n    !props.$rule ||\n    props.$rule.includes('optional') ||\n    otherRules.includes('optional');\n\n  context.rules[props.name] = isOptional ? baseSchema.optional() : baseSchema;\n};\n\nconst processDefault = (props: ComponentProps, context: FormRuleContext) => {\n  if (!props.name) return;\n  context.rules[props.name] = props.$rule\n    ? parseRules(props.$rule)\n    : z.string().optional();\n};\n\nconst processDropdown = (props: ComponentProps, context: FormRuleContext) => {\n  if (!props.name) return;\n  context.rules[props.name] = z.any().optional();\n};\n\nconst processDatePicker = (props: ComponentProps, context: FormRuleContext) => {\n  if (!props.name) return;\n  context.rules[props.name] = props.$rule\n    ? parseRules(props.$rule)\n    : z.string().nullable().optional();\n};\n\nconst requiredMessage = JSON.stringify({\n  key: 'required',\n  fallback: 'El campo {attribute} es obligatorio.',\n  bindings: {},\n});\n\nconst processFileInput = (\n  props: ComponentProps,\n  context: FormRuleContext,\n  multiple: boolean,\n) => {\n  if (!props.name) return;\n\n  if (props.$rule?.includes('required')) {\n    context.rules[props.name] = multiple\n      ? z.any().refine((val) => Array.isArray(val) && val.length > 0, {\n          message: requiredMessage,\n        })\n      : z\n          .any()\n          .refine((val) => val instanceof File, { message: requiredMessage });\n  } else {\n    context.rules[props.name] = z.any().optional();\n  }\n};\n\nconst applyRefinements = (\n  schema: z.ZodObject<FieldValues>,\n  context: FormRuleContext,\n) => {\n  if (\n    context.confirmedFields.length === 0 &&\n    context.requiredBooleanFields.length === 0\n  ) {\n    return schema;\n  }\n\n  return schema.superRefine((data, ctx) => {\n    context.confirmedFields.forEach(({ field, target }) => {\n      if (data[field] !== data[target]) {\n        ctx.addIssue({\n          code: z.ZodIssueCode.custom,\n          message: JSON.stringify({\n            key: 'confirmed',\n            fallback: 'La confirmación no coincide.',\n            bindings: {},\n          }),\n          path: [target],\n        });\n      }\n    });\n\n    context.requiredBooleanFields.forEach((field) => {\n      if (data[field] !== true) {\n        ctx.addIssue({\n          code: z.ZodIssueCode.custom,\n          message: JSON.stringify({\n            key: 'required',\n            fallback: 'El campo {attribute} es obligatorio.',\n            bindings: {},\n          }),\n          path: [field],\n        });\n      }\n    });\n  });\n};\n\nexport const extractFormRules = (\n  children: React.ReactNode,\n  componentTypes: React.ComponentType[],\n): ZodTypeAny => {\n  const context: FormRuleContext = {\n    rules: {},\n    confirmedFields: [],\n    requiredBooleanFields: [],\n  };\n\n  const components = findFormComponents(children, componentTypes);\n\n  components.forEach((component) => {\n    const props = component.props as ComponentProps;\n    const displayName = (component.type as { displayName?: string })\n      .displayName;\n\n    if (props.name) {\n      processConfirmedRule(props, context);\n\n      if (displayName === 'Form.Checkbox') {\n        processCheckbox(props, context);\n      } else if (displayName === 'Form.CheckboxTree') {\n        processCheckboxTree(props, context);\n      } else if (displayName === 'Form.Password') {\n        processPassword(props, context);\n      } else if (\n        displayName === 'Form.Select' ||\n        displayName === 'Form.Combobox' ||\n        displayName === 'Form.Autocomplete'\n      ) {\n        processDropdown(props, context);\n      } else if (\n        displayName === 'Form.DatePicker' ||\n        displayName === 'Form.DateTimePicker'\n      ) {\n        processDatePicker(props, context);\n      } else if (displayName === 'Form.FileInput') {\n        processFileInput(props, context, false);\n      } else if (\n        displayName === 'Form.FileInputMultiple' ||\n        displayName === 'Form.Dropzone' ||\n        displayName === 'Form.DropzoneS3'\n      ) {\n        processFileInput(props, context, true);\n      } else {\n        processDefault(props, context);\n      }\n    }\n  });\n\n  return applyRefinements(z.object(context.rules).loose(), context);\n};\n"],"mappings":"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"}
+{"version":3,"file":"extract-form-rules.mjs","names":["passwordRule"],"sources":["../../../../src/components/forms/rules/extract-form-rules.ts"],"sourcesContent":["import type React from 'react';\nimport type { FieldValues } from 'react-hook-form';\nimport { type ZodTypeAny, z } from 'zod';\n\nimport type { PasswordRuleDefinition } from '@/components/controls/password-input/usePasswordRules';\n\nimport { findFormComponents } from '../controls/find-form-components';\nimport passwordRule from './password';\nimport { PASSWORD_RULES } from './password-rules';\nimport { parseRules } from './zod';\n\ntype FormRuleContext = {\n  rules: Record<string, ZodTypeAny>;\n  confirmedFields: { field: string; target: string }[];\n  requiredBooleanFields: string[];\n};\n\ntype ComponentProps = {\n  name?: string;\n  $rule?: string;\n  rules?: PasswordRuleDefinition[];\n};\n\nconst processConfirmedRule = (\n  props: ComponentProps,\n  context: FormRuleContext,\n) => {\n  if (!props.name || !props.$rule?.includes('confirmed')) return;\n\n  const rulesList = props.$rule.split('|');\n  const confirmedRule = rulesList.find((r) => r.startsWith('confirmed'));\n  const target = confirmedRule?.includes(':')\n    ? confirmedRule.split(':')[1]\n    : `${props.name}_confirmation`;\n\n  context.confirmedFields.push({ field: props.name, target });\n};\n\nconst processCheckbox = (props: ComponentProps, context: FormRuleContext) => {\n  if (!props.name) return;\n\n  if (props.$rule?.includes('required')) {\n    context.rules[props.name] = z.boolean().optional().or(z.literal(false));\n    context.requiredBooleanFields.push(props.name);\n  } else {\n    context.rules[props.name] = z.boolean().optional();\n  }\n};\n\nconst processCheckboxTree = (\n  props: ComponentProps,\n  context: FormRuleContext,\n) => {\n  if (!props.name) return;\n\n  if (props.$rule?.includes('required')) {\n    context.rules[props.name] = z\n      .any()\n      .refine((val) => Array.isArray(val) && val.length > 0, {\n        message: requiredMessage,\n      });\n  } else {\n    context.rules[props.name] = z.array(z.string()).optional();\n  }\n};\n\nconst processPassword = (props: ComponentProps, context: FormRuleContext) => {\n  if (!props.name) return;\n\n  let baseSchema: ZodTypeAny = z.string();\n  const otherRules = props.$rule\n    ? props.$rule\n        .split('|')\n        .filter((r) => r.trim() !== 'password')\n        .join('|')\n    : '';\n\n  if (otherRules) {\n    baseSchema = parseRules(otherRules);\n  }\n\n  const passwordRules =\n    props.rules || (props.$rule?.includes('password') ? PASSWORD_RULES : []);\n\n  if (passwordRules.length > 0) {\n    baseSchema = passwordRule(baseSchema, passwordRules);\n  }\n\n  const isOptional =\n    !props.$rule ||\n    props.$rule.includes('optional') ||\n    otherRules.includes('optional');\n\n  context.rules[props.name] = isOptional ? baseSchema.optional() : baseSchema;\n};\n\nconst processDefault = (props: ComponentProps, context: FormRuleContext) => {\n  if (!props.name) return;\n  context.rules[props.name] = props.$rule\n    ? parseRules(props.$rule)\n    : z.string().optional();\n};\n\nconst processDropdown = (props: ComponentProps, context: FormRuleContext) => {\n  if (!props.name) return;\n  context.rules[props.name] = z.any().optional();\n};\n\nconst processDatePicker = (props: ComponentProps, context: FormRuleContext) => {\n  if (!props.name) return;\n  context.rules[props.name] = props.$rule\n    ? parseRules(props.$rule)\n    : z.string().nullable().optional();\n};\n\nconst requiredMessage = JSON.stringify({\n  key: 'required',\n  fallback: 'El campo {attribute} es obligatorio.',\n  bindings: {},\n});\n\nconst processFileInput = (\n  props: ComponentProps,\n  context: FormRuleContext,\n  multiple: boolean,\n) => {\n  if (!props.name) return;\n\n  if (props.$rule?.includes('required')) {\n    context.rules[props.name] = multiple\n      ? z.any().refine((val) => Array.isArray(val) && val.length > 0, {\n          message: requiredMessage,\n        })\n      : z\n          .any()\n          .refine((val) => val instanceof File, { message: requiredMessage });\n  } else {\n    context.rules[props.name] = z.any().optional();\n  }\n};\n\nconst applyRefinements = (\n  schema: z.ZodObject<FieldValues>,\n  context: FormRuleContext,\n) => {\n  if (\n    context.confirmedFields.length === 0 &&\n    context.requiredBooleanFields.length === 0\n  ) {\n    return schema;\n  }\n\n  return schema.superRefine((data, ctx) => {\n    context.confirmedFields.forEach(({ field, target }) => {\n      if (data[field] !== data[target]) {\n        ctx.addIssue({\n          code: z.ZodIssueCode.custom,\n          message: JSON.stringify({\n            key: 'confirmed',\n            fallback: 'La confirmación no coincide.',\n            bindings: {},\n          }),\n          path: [target],\n        });\n      }\n    });\n\n    context.requiredBooleanFields.forEach((field) => {\n      if (data[field] !== true) {\n        ctx.addIssue({\n          code: z.ZodIssueCode.custom,\n          message: JSON.stringify({\n            key: 'required',\n            fallback: 'El campo {attribute} es obligatorio.',\n            bindings: {},\n          }),\n          path: [field],\n        });\n      }\n    });\n  });\n};\n\nexport const extractFormRules = (\n  children: React.ReactNode,\n  componentTypes: React.ComponentType[],\n): ZodTypeAny => {\n  const context: FormRuleContext = {\n    rules: {},\n    confirmedFields: [],\n    requiredBooleanFields: [],\n  };\n\n  const components = findFormComponents(children, componentTypes);\n\n  components.forEach((component) => {\n    const props = component.props as ComponentProps;\n    const displayName = (component.type as { displayName?: string })\n      .displayName;\n\n    if (props.name) {\n      processConfirmedRule(props, context);\n\n      if (displayName === 'Form.Checkbox') {\n        processCheckbox(props, context);\n      } else if (\n        displayName === 'Form.CheckboxTree' ||\n        displayName === 'Form.CheckboxGroup'\n      ) {\n        processCheckboxTree(props, context);\n      } else if (displayName === 'Form.Password') {\n        processPassword(props, context);\n      } else if (\n        displayName === 'Form.Select' ||\n        displayName === 'Form.Combobox' ||\n        displayName === 'Form.Autocomplete'\n      ) {\n        processDropdown(props, context);\n      } else if (\n        displayName === 'Form.DatePicker' ||\n        displayName === 'Form.DateTimePicker'\n      ) {\n        processDatePicker(props, context);\n      } else if (displayName === 'Form.FileInput') {\n        processFileInput(props, context, false);\n      } else if (\n        displayName === 'Form.FileInputMultiple' ||\n        displayName === 'Form.Dropzone' ||\n        displayName === 'Form.DropzoneS3'\n      ) {\n        processFileInput(props, context, true);\n      } else {\n        processDefault(props, context);\n      }\n    }\n  });\n\n  return applyRefinements(z.object(context.rules).loose(), context);\n};\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mage-ui/components",
-  "version": "1.0.168",
+  "version": "1.0.170",
   "private": false,
   "description": "",
   "keywords": [],
@@ -25,7 +25,7 @@
     "rimraf": "^6.1.3",
     "tsdown": "^0.21.4",
     "typescript": "^5.9.3",
-    "@mage-ui/preset": "1.0.168",
+    "@mage-ui/preset": "1.0.170",
     "@mage-ui/styled-system": "1.0.8"
   },
   "peerDependencies": {