npm - @powerhousedao/design-system - Versions diffs - 6.0.0-dev.196 → 6.0.0-dev.197 - Mend

@powerhousedao/design-system 6.0.0-dev.196 → 6.0.0-dev.197

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

Files changed (239) hide show

package/dist/ui/components/select-field/select-field.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-field.js","names":[],"sources":["../../../../src/ui/components/select-field/select-field.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport React, { useCallback, useId } from \"react\";\nimport type { FieldErrorHandling, InputBaseProps } from \"../../types.js\";\nimport { Button } from \"../button/button.js\";\nimport { Command } from \"../command/command.js\";\nimport type { SelectOption, SelectProps } from \"../enum-field/types.js\";\nimport { FormDescription } from \"../form-description/form-description.js\";\nimport { FormGroup } from \"../form-group/form-group.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/popover.js\";\nimport { withFieldValidation } from \"../with-field-validation/with-field-validation.js\";\nimport { Content } from \"./content.js\";\nimport { SelectedContent } from \"./selected-content.js\";\nimport { useSelectField } from \"./use-select-field.js\";\n\ntype SelectFieldBaseProps = Omit<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n \| keyof InputBaseProps<string \| string[]>\n \| keyof FieldErrorHandling\n \| keyof SelectProps\n>;\n\nexport type SelectFieldProps = SelectFieldBaseProps &\n InputBaseProps<string \| string[]> &\n FieldErrorHandling & {\n options?: SelectOption[];\n favoriteOptions?: SelectOption[];\n } & Omit<SelectProps, \"options\" \| \"favoriteOptions\">;\n\nexport const SelectFieldRaw = React.forwardRef<\n HTMLButtonElement,\n SelectFieldProps\n>(\n (\n {\n // core functionality props\n options = [],\n favoriteOptions = [],\n defaultValue,\n value,\n onChange,\n onBlur,\n\n // form-related props\n id: propId,\n name,\n label,\n required,\n disabled,\n\n // validation props\n errors = [],\n warnings = [],\n\n // behavior props\n multiple,\n selectionIcon = \"auto\",\n selectionIconPosition = \"left\",\n searchable,\n\n // display props\n description,\n placeholder,\n className,\n contentClassName,\n contentAlign = \"start\",\n\n ...props\n },\n ref,\n ) => {\n const prefix = useId();\n const id = propId ?? `${prefix}-select`;\n\n const {\n selectedValues,\n isPopoverOpen,\n commandListRef,\n toggleOption,\n handleClear,\n toggleAll,\n handleOpenChange,\n } = useSelectField({\n options,\n multiple,\n defaultValue,\n value,\n onChange,\n });\n\n const onTriggerBlur = useCallback(\n (e: React.FocusEvent<HTMLButtonElement>) => {\n if (!isPopoverOpen) {\n // trigger the blur event when the trigger loses focus but the popover is not open,\n // because when the popover is open, the trigger loses focus but the select as a component still has the focus\n onBlur?.(e);\n }\n },\n [onBlur, isPopoverOpen],\n );\n\n return (\n <FormGroup>\n {label && (\n <FormLabel\n htmlFor={id}\n required={required}\n disabled={disabled}\n hasError={errors.length > 0}\n inline={false}\n onClick={(e) => {\n e.preventDefault();\n (e.target as HTMLLabelElement).control?.focus();\n }}\n >\n {label}\n </FormLabel>\n )}\n <Popover\n open={isPopoverOpen}\n onOpenChange={(open) => {\n handleOpenChange(open);\n // if the popover is closing and it was not by the trigger button\n if (!open && document.activeElement?.id !== id) {\n onBlur?.({ target: {} } as React.FocusEvent<HTMLButtonElement>);\n }\n }}\n >\n <PopoverTrigger asChild={true}>\n {/* TODO: create a trigger component */}\n <Button\n id={id}\n name={name}\n type=\"button\"\n role=\"combobox\"\n onBlur={onTriggerBlur}\n disabled={disabled}\n aria-invalid={errors.length > 0}\n aria-label={\n label ? undefined : multiple ? \"Multi select\" : \"Select\"\n }\n aria-required={required}\n aria-expanded={isPopoverOpen}\n className={cn(\n \"flex h-9 w-full items-center justify-between px-3 py-2\",\n \"dark:border-charcoal-700 dark:bg-charcoal-900 rounded-md border border-gray-300 bg-white\",\n \"hover:border-gray-300 hover:bg-gray-100\",\n \"dark:hover:border-charcoal-700 dark:hover:bg-charcoal-800\",\n \"dark:focus:ring-charcoal-300 focus:outline-none focus:ring-1 focus:ring-gray-900 focus:ring-offset-0\",\n \"dark:focus-visible:ring-charcoal-300 focus-visible:ring-1 focus-visible:ring-gray-900 focus-visible:ring-offset-0\",\n disabled && [\n \"!pointer-events-auto cursor-not-allowed bg-gray-50\",\n \"dark:hover:border-charcoal-700 dark:hover:bg-charcoal-900 hover:border-gray-300 hover:bg-gray-50\",\n ],\n className,\n )}\n {...props}\n ref={ref}\n >\n <SelectedContent\n selectedValues={selectedValues}\n options={[...favoriteOptions, ...options]}\n multiple={multiple}\n searchable={searchable}\n placeholder={placeholder}\n handleClear={handleClear}\n />\n </Button>\n </PopoverTrigger>\n <PopoverContent\n align={contentAlign}\n onEscapeKeyDown={(e) => {\n e.preventDefault();\n handleOpenChange(false);\n }}\n className={contentClassName}\n >\n <Command\n defaultValue={\n !multiple && selectedValues[0]\n ? options.find((opt) => opt.value === selectedValues[0])\n ?.label\n : undefined\n }\n >\n <Content\n favoriteOptions={favoriteOptions}\n searchable={searchable}\n commandListRef={commandListRef}\n multiple={multiple}\n selectedValues={selectedValues}\n selectionIcon={selectionIcon}\n selectionIconPosition={selectionIconPosition}\n options={options}\n toggleAll={toggleAll}\n toggleOption={toggleOption}\n />\n </Command>\n </PopoverContent>\n </Popover>\n {description && <FormDescription>{description}</FormDescription>}\n {warnings.length > 0 && (\n <FormMessageList messages={warnings} type=\"warning\" />\n )}\n {errors.length > 0 && (\n <FormMessageList messages={errors} type=\"error\" />\n )}\n </FormGroup>\n );\n },\n);\n\nexport const SelectField =\n withFieldValidation<SelectFieldProps>(SelectFieldRaw);\n\nSelectField.displayName = \"SelectField\";\n"],"mappings":";;;;;;;;;;;;;;;AA8BA,MAAa,iBAAiB,MAAM,YAKhC,EAEE,UAAU,EAAE,EACZ,kBAAkB,EAAE,EACpB,cACA,OACA,UACA,QAGA,IAAI,QACJ,MACA,OACA,UACA,UAGA,SAAS,EAAE,EACX,WAAW,EAAE,EAGb,UACA,gBAAgB,QAChB,wBAAwB,QACxB,YAGA,aACA,aACA,WACA,kBACA,eAAe,SAEf,GAAG,SAEL,QACG;CACH,MAAM,SAAS,OAAO;CACtB,MAAM,KAAK,UAAU,GAAG,OAAO;CAE/B,MAAM,EACJ,gBACA,eACA,gBACA,cACA,aACA,WACA,qBACE,eAAe;EACjB;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,gBAAgB,aACnB,MAA2C;AAC1C,MAAI,CAAC,cAGH,UAAS,EAAE;IAGf,CAAC,QAAQ,cAAc,CACxB;AAED,QACE,qBAAC,WAAD,EAAA,UAAA;EACG,SACC,oBAAC,WAAD;GACE,SAAS;GACC;GACA;GACV,UAAU,OAAO,SAAS;GAC1B,QAAQ;GACR,UAAU,MAAM;AACd,MAAE,gBAAgB;AACjB,MAAE,OAA4B,SAAS,OAAO;;aAGhD;GACS,CAAA;EAEd,qBAAC,SAAD;GACE,MAAM;GACN,eAAe,SAAS;AACtB,qBAAiB,KAAK;AAEtB,QAAI,CAAC,QAAQ,SAAS,eAAe,OAAO,GAC1C,UAAS,EAAE,QAAQ,EAAE,EAAE,CAAwC;;aANrE,CAUE,oBAAC,gBAAD;IAAgB,SAAS;cAEvB,oBAAC,QAAD;KACM;KACE;KACN,MAAK;KACL,MAAK;KACL,QAAQ;KACE;KACV,gBAAc,OAAO,SAAS;KAC9B,cACE,QAAQ,KAAA,IAAY,WAAW,iBAAiB;KAElD,iBAAe;KACf,iBAAe;KACf,WAAW,GACT,0DACA,4FACA,2CACA,6DACA,wGACA,qHACA,YAAY,CACV,sDACA,mGACD,EACD,UACD;KACD,GAAI;KACC;eAEL,oBAAC,iBAAD;MACkB;MAChB,SAAS,CAAC,GAAG,iBAAiB,GAAG,QAAQ;MAC/B;MACE;MACC;MACA;MACb,CAAA;KACK,CAAA;IACM,CAAA,EACjB,oBAAC,gBAAD;IACE,OAAO;IACP,kBAAkB,MAAM;AACtB,OAAE,gBAAgB;AAClB,sBAAiB,MAAM;;IAEzB,WAAW;cAEX,oBAAC,SAAD;KACE,cACE,CAAC,YAAY,eAAe,KACxB,QAAQ,MAAM,QAAQ,IAAI,UAAU,eAAe,GAAG,EAClD,QACJ,KAAA;eAGN,oBAAC,SAAD;MACmB;MACL;MACI;MACN;MACM;MACD;MACQ;MACd;MACE;MACG;MACd,CAAA;KACM,CAAA;IACK,CAAA,CACT;;EACT,eAAe,oBAAC,iBAAD,EAAA,UAAkB,aAA8B,CAAA;EAC/D,SAAS,SAAS,KACjB,oBAAC,iBAAD;GAAiB,UAAU;GAAU,MAAK;GAAY,CAAA;EAEvD,OAAO,SAAS,KACf,oBAAC,iBAAD;GAAiB,UAAU;GAAQ,MAAK;GAAU,CAAA;EAE1C,EAAA,CAAA;EAGjB;AAED,MAAa,cACX,oBAAsC,eAAe;AAEvD,YAAY,cAAc"}
1	+ {"version":3,"file":"select-field.js","names":["cn","React","useCallback","useId","Button","Command","FormDescription","FormGroup","FormLabel","FormMessageList","Popover","PopoverContent","PopoverTrigger","withFieldValidation","Content","SelectedContent","useSelectField","SelectFieldRaw","forwardRef","options","favoriteOptions","defaultValue","value","onChange","onBlur","id","propId","name","label","required","disabled","errors","warnings","multiple","selectionIcon","selectionIconPosition","searchable","description","placeholder","className","contentClassName","contentAlign","props","ref","prefix","selectedValues","isPopoverOpen","commandListRef","toggleOption","handleClear","toggleAll","handleOpenChange","onTriggerBlur","e","length","preventDefault","target","control","focus","open","document","activeElement","undefined","find","opt","SelectField","displayName"],"sources":["../../../../src/ui/components/select-field/select-field.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport React, { useCallback, useId } from \"react\";\nimport type { FieldErrorHandling, InputBaseProps } from \"../../types.js\";\nimport { Button } from \"../button/button.js\";\nimport { Command } from \"../command/command.js\";\nimport type { SelectOption, SelectProps } from \"../enum-field/types.js\";\nimport { FormDescription } from \"../form-description/form-description.js\";\nimport { FormGroup } from \"../form-group/form-group.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/popover.js\";\nimport { withFieldValidation } from \"../with-field-validation/with-field-validation.js\";\nimport { Content } from \"./content.js\";\nimport { SelectedContent } from \"./selected-content.js\";\nimport { useSelectField } from \"./use-select-field.js\";\n\ntype SelectFieldBaseProps = Omit<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n \| keyof InputBaseProps<string \| string[]>\n \| keyof FieldErrorHandling\n \| keyof SelectProps\n>;\n\nexport type SelectFieldProps = SelectFieldBaseProps &\n InputBaseProps<string \| string[]> &\n FieldErrorHandling & {\n options?: SelectOption[];\n favoriteOptions?: SelectOption[];\n } & Omit<SelectProps, \"options\" \| \"favoriteOptions\">;\n\nexport const SelectFieldRaw = React.forwardRef<\n HTMLButtonElement,\n SelectFieldProps\n>(\n (\n {\n // core functionality props\n options = [],\n favoriteOptions = [],\n defaultValue,\n value,\n onChange,\n onBlur,\n\n // form-related props\n id: propId,\n name,\n label,\n required,\n disabled,\n\n // validation props\n errors = [],\n warnings = [],\n\n // behavior props\n multiple,\n selectionIcon = \"auto\",\n selectionIconPosition = \"left\",\n searchable,\n\n // display props\n description,\n placeholder,\n className,\n contentClassName,\n contentAlign = \"start\",\n\n ...props\n },\n ref,\n ) => {\n const prefix = useId();\n const id = propId ?? `${prefix}-select`;\n\n const {\n selectedValues,\n isPopoverOpen,\n commandListRef,\n toggleOption,\n handleClear,\n toggleAll,\n handleOpenChange,\n } = useSelectField({\n options,\n multiple,\n defaultValue,\n value,\n onChange,\n });\n\n const onTriggerBlur = useCallback(\n (e: React.FocusEvent<HTMLButtonElement>) => {\n if (!isPopoverOpen) {\n // trigger the blur event when the trigger loses focus but the popover is not open,\n // because when the popover is open, the trigger loses focus but the select as a component still has the focus\n onBlur?.(e);\n }\n },\n [onBlur, isPopoverOpen],\n );\n\n return (\n <FormGroup>\n {label && (\n <FormLabel\n htmlFor={id}\n required={required}\n disabled={disabled}\n hasError={errors.length > 0}\n inline={false}\n onClick={(e) => {\n e.preventDefault();\n (e.target as HTMLLabelElement).control?.focus();\n }}\n >\n {label}\n </FormLabel>\n )}\n <Popover\n open={isPopoverOpen}\n onOpenChange={(open) => {\n handleOpenChange(open);\n // if the popover is closing and it was not by the trigger button\n if (!open && document.activeElement?.id !== id) {\n onBlur?.({ target: {} } as React.FocusEvent<HTMLButtonElement>);\n }\n }}\n >\n <PopoverTrigger asChild={true}>\n {/* TODO: create a trigger component */}\n <Button\n id={id}\n name={name}\n type=\"button\"\n role=\"combobox\"\n onBlur={onTriggerBlur}\n disabled={disabled}\n aria-invalid={errors.length > 0}\n aria-label={\n label ? undefined : multiple ? \"Multi select\" : \"Select\"\n }\n aria-required={required}\n aria-expanded={isPopoverOpen}\n className={cn(\n \"flex h-9 w-full items-center justify-between px-3 py-2\",\n \"dark:border-charcoal-700 dark:bg-charcoal-900 rounded-md border border-gray-300 bg-white\",\n \"hover:border-gray-300 hover:bg-gray-100\",\n \"dark:hover:border-charcoal-700 dark:hover:bg-charcoal-800\",\n \"dark:focus:ring-charcoal-300 focus:outline-none focus:ring-1 focus:ring-gray-900 focus:ring-offset-0\",\n \"dark:focus-visible:ring-charcoal-300 focus-visible:ring-1 focus-visible:ring-gray-900 focus-visible:ring-offset-0\",\n disabled && [\n \"!pointer-events-auto cursor-not-allowed bg-gray-50\",\n \"dark:hover:border-charcoal-700 dark:hover:bg-charcoal-900 hover:border-gray-300 hover:bg-gray-50\",\n ],\n className,\n )}\n {...props}\n ref={ref}\n >\n <SelectedContent\n selectedValues={selectedValues}\n options={[...favoriteOptions, ...options]}\n multiple={multiple}\n searchable={searchable}\n placeholder={placeholder}\n handleClear={handleClear}\n />\n </Button>\n </PopoverTrigger>\n <PopoverContent\n align={contentAlign}\n onEscapeKeyDown={(e) => {\n e.preventDefault();\n handleOpenChange(false);\n }}\n className={contentClassName}\n >\n <Command\n defaultValue={\n !multiple && selectedValues[0]\n ? options.find((opt) => opt.value === selectedValues[0])\n ?.label\n : undefined\n }\n >\n <Content\n favoriteOptions={favoriteOptions}\n searchable={searchable}\n commandListRef={commandListRef}\n multiple={multiple}\n selectedValues={selectedValues}\n selectionIcon={selectionIcon}\n selectionIconPosition={selectionIconPosition}\n options={options}\n toggleAll={toggleAll}\n toggleOption={toggleOption}\n />\n </Command>\n </PopoverContent>\n </Popover>\n {description && <FormDescription>{description}</FormDescription>}\n {warnings.length > 0 && (\n <FormMessageList messages={warnings} type=\"warning\" />\n )}\n {errors.length > 0 && (\n <FormMessageList messages={errors} type=\"error\" />\n )}\n </FormGroup>\n );\n },\n);\n\nexport const SelectField =\n withFieldValidation<SelectFieldProps>(SelectFieldRaw);\n\nSelectField.displayName = \"SelectField\";\n"],"mappings":";;;;;;;;;;;;;;;AA8BA,MAAaiB,iBAAiBhB,sBAAMiB,YAKhC,EAEEC,UAAU,EAAE,EACZC,kBAAkB,EAAE,EACpBC,cACAC,OACAC,UACAC,QAGAC,IAAIC,QACJC,MACAC,OACAC,UACAC,UAGAC,SAAS,EAAE,EACXC,WAAW,EAAE,EAGbC,UACAC,gBAAgB,QAChBC,wBAAwB,QACxBC,YAGAC,aACAC,aACAC,WACAC,kBACAC,eAAe,SAEf,GAAGC,SAELC,QACG;CACH,MAAMC,SAASzC,OAAO;CACtB,MAAMsB,KAAKC,UAAU,GAAGkB,OAAM;CAE9B,MAAM,EACJC,gBACAC,eACAC,gBACAC,cACAC,aACAC,WACAC,qBACEnC,eAAe;EACjBG;EACAc;EACAZ;EACAC;EACAC;EACD,CAAC;CAEF,MAAM6B,gBAAgBlD,aACnBmD,MAA2C;AAC1C,MAAI,CAACP,cAGHtB,UAAS6B,EAAE;IAGf,CAAC7B,QAAQsB,cACX,CAAC;AAED,QACE,qBAAC,WAAD,EAAA,UAAA;EACGlB,SACC,oBAAC,WAAD;GACE,SAASH;GACCI;GACAC;GACV,UAAUC,OAAOuB,SAAS;GAC1B,QAAQ;GACR,UAAUD,MAAM;AACdA,MAAEE,gBAAgB;AACjBF,MAAEG,OAA4BC,SAASC,OAAO;;aAGhD9B;GAEJ,CAAA;EACD,qBAAC,SAAD;GACE,MAAMkB;GACN,eAAea,SAAS;AACtBR,qBAAiBQ,KAAK;AAEtB,QAAI,CAACA,QAAQC,SAASC,eAAepC,OAAOA,GAC1CD,UAAS,EAAEgC,QAAQ,EAAC,EAA0C,CAAC;;aANrE,CAUE,oBAAC,gBAAD;IAAgB,SAAS;cAEvB,oBAAC,QAAD;KACM/B;KACEE;KACN,MAAK;KACL,MAAK;KACL,QAAQyB;KACEtB;KACV,gBAAcC,OAAOuB,SAAS;KAC9B,cACE1B,QAAQkC,KAAAA,IAAY7B,WAAW,iBAAiB;KAElD,iBAAeJ;KACf,iBAAeiB;KACf,WAAW9C,GACT,0DACA,4FACA,2CACA,6DACA,wGACA,qHACA8B,YAAY,CACV,sDACA,mGACD,EACDS,UACD;KACD,GAAIG;KACCC;eAEL,oBAAC,iBAAD;MACkBE;MAChB,SAAS,CAAC,GAAGzB,iBAAiB,GAAGD,QAAQ;MAC/Bc;MACEG;MACCE;MACAW;MAAY,CAAA;KAErB,CAAA;IACM,CAAA,EAChB,oBAAC,gBAAD;IACE,OAAOR;IACP,kBAAkBY,MAAM;AACtBA,OAAEE,gBAAgB;AAClBJ,sBAAiB,MAAM;;IAEzB,WAAWX;cAEX,oBAAC,SAAD;KACE,cACE,CAACP,YAAYY,eAAe,KACxB1B,QAAQ4C,MAAMC,QAAQA,IAAI1C,UAAUuB,eAAe,GAAG,EAClDjB,QACJkC,KAAAA;eAGN,oBAAC,SAAD;MACmB1C;MACLgB;MACIW;MACNd;MACMY;MACDX;MACQC;MACdhB;MACE+B;MACGF;MAAa,CAAA;KAEtB,CAAA;IACK,CAAA,CACT;;EACRX,eAAe,oBAAC,iBAAD,EAAA,UAAkBA,aAA8B,CAAA;EAC/DL,SAASsB,SAAS,KACjB,oBAAC,iBAAD;GAAiB,UAAUtB;GAAU,MAAK;GAC3C,CAAA;EACAD,OAAOuB,SAAS,KACf,oBAAC,iBAAD;GAAiB,UAAUvB;GAAQ,MAAK;GACzC,CAAA;EACS,EAAA,CAAA;EAGjB;AAED,MAAakC,cACXpD,oBAAsCI,eAAe;AAEvDgD,YAAYC,cAAc"}

package/dist/ui/components/select-field/selected-content.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import { t as SelectedContent } from "../../../selected-content-DPH03IS_.js";
+import { t as SelectedContent } from "../../../selected-content-CdIw4hcC.js";
 export { SelectedContent };

package/dist/ui/components/select-field/selected-content.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { h as Icon, t as cn } from "../../../src-BX8sU0Tq.js";
+import { h as Icon, t as cn } from "../../../src-8xf1ueaA.js";
 import React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/ui/components/select-field/selected-content.tsx

package/dist/ui/components/select-field/selected-content.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"selected-content.js","names":[],"sources":["../../../../src/ui/components/select-field/selected-content.tsx"],"sourcesContent":["import type { IconName } from \"#design-system\";\nimport { cn, Icon } from \"#design-system\";\nimport React from \"react\";\nimport type { SelectProps } from \"../enum-field/types.js\";\n\ninterface SelectedContentProps {\n selectedValues: string[];\n options: SelectProps[\"options\"];\n multiple?: boolean;\n searchable?: boolean;\n placeholder?: string;\n handleClear: () => void;\n}\n\nexport const SelectedContent: React.FC<SelectedContentProps> = ({\n selectedValues,\n options = [],\n multiple,\n searchable,\n placeholder,\n handleClear,\n}) => {\n const renderIcon = (\n IconComponent:\n \| IconName\n \| React.ComponentType<{ className?: string }>\n \| undefined,\n ) => {\n if (typeof IconComponent === \"string\") {\n return <Icon name={IconComponent} size={16} />;\n }\n return IconComponent && <IconComponent className=\"size-4\" />;\n };\n\n if (selectedValues.length === 0) {\n return (\n <div\n className={cn(\n \"mx-auto flex w-full items-center\",\n placeholder ? \"justify-between\" : \"justify-end\",\n )}\n >\n {placeholder && (\n <span className=\"text-[14px] font-normal leading-5 text-gray-600 dark:text-gray-500\">\n {placeholder}\n </span>\n )}\n {searchable ? (\n <Icon\n name=\"CaretSort\"\n size={16}\n className=\"cursor-pointer text-gray-700 dark:text-gray-400\"\n />\n ) : (\n <Icon\n name=\"ChevronDown\"\n size={16}\n className=\"cursor-pointer text-gray-700 dark:text-gray-400\"\n />\n )}\n </div>\n );\n }\n\n return (\n <div className=\"flex w-full items-center justify-between gap-2\">\n <div\n className={cn(\n \"max-w-full truncate text-gray-900 dark:text-gray-50\",\n !multiple && \"flex items-center gap-2\",\n )}\n >\n {selectedValues.map((value, index) => {\n const option = options.find((o) => o.value === value);\n return !multiple ? (\n <React.Fragment key={value}>\n {renderIcon(option?.icon)}\n <span className=\"truncate text-[14px] font-normal leading-5\">\n {option?.label}\n </span>\n </React.Fragment>\n ) : (\n <span\n key={value}\n className={cn(\n \"text-[14px] font-normal leading-5\",\n index !== selectedValues.length - 1 && \"mr-1\",\n )}\n >\n {index !== selectedValues.length - 1\n ? `${option?.label},`\n : option?.label}\n </span>\n );\n })}\n </div>\n <div className=\"flex items-center justify-between gap-2\">\n {multiple && selectedValues.length > 0 && (\n <div\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n handleClear();\n }}\n className=\"size-4 p-0\"\n >\n <Icon\n name=\"XmarkLight\"\n size={16}\n className=\"cursor-pointer text-gray-700 dark:text-gray-400\"\n />\n </div>\n )}\n {searchable ? (\n <Icon\n name=\"CaretSort\"\n size={16}\n className=\"cursor-pointer text-gray-700 dark:text-gray-400\"\n />\n ) : (\n <Icon\n name=\"ChevronDown\"\n size={16}\n className=\"cursor-pointer text-gray-700 dark:text-gray-400\"\n />\n )}\n </div>\n </div>\n );\n};\n"],"mappings":";;;;AAcA,~~MAAa~~,mBAAmD,~~EAC9D~~,~~gBACA~~,UAAU,EAAE,~~EACZ~~,~~UACA~~,~~YACA~~,~~aACA~~,kBACI;CACJ,~~MAAM~~,~~cACJ~~,kBAIG;AACH,MAAI,~~OAAO~~,kBAAkB,SAC3B,QAAO,oBAAC,MAAD;GAAM,~~MAAM~~;GAAe,MAAM;GAAM,CAAA;AAEhD,~~SAAO~~,iBAAiB,oBAAC,eAAD,EAAe,WAAU,UAAW,CAAA;;AAG9D,~~KAAI~~,~~eAAe~~,WAAW,EAC5B,QACE,qBAAC,OAAD;EACE,~~WAAW~~,GACT,~~oCACA~~,cAAc,oBAAoB,cACnC;YAJH,~~CAMG~~,eACC,oBAAC,QAAD;GAAM,WAAU;~~aACb~~;~~GACI~~,CAAA,~~EAER~~,aACC,oBAAC,MAAD;GACE,MAAK;GACL,MAAM;GACN,WAAU;GACV,CAAA,GAEF,oBAAC,MAAD;GACE,MAAK;GACL,MAAM;GACN,WAAU;~~GACV~~,CAAA,~~CAEA~~;;AAIV,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,OAAD;GACE,~~WAAW~~,GACT,uDACA,~~CAAC~~,YAAY,0BACd;~~aAEA~~,~~eAAe~~,~~KAAK~~,~~OAAO~~,UAAU;IACpC,~~MAAM~~,~~SAAS~~,~~QAAQ~~,~~MAAM~~,~~MAAM~~,~~EAAE~~,~~UAAU~~,MAAM;AACrD,WAAO,~~CAAC~~,WACN,qBAAC,MAAM,UAAP,EAAA,UAAA,~~CACG~~,~~WAAW~~,~~QAAQ~~,KAAK,EACzB,oBAAC,QAAD;KAAM,WAAU;~~eACb~~,~~QAAQ~~;~~KACJ~~,CAAA,~~CACQ~~,EAAA,~~EALI~~,MAKJ,GAEjB,oBAAC,QAAD;KAEE,~~WAAW~~,GACT,~~qCACA~~,~~UAAU~~,~~eAAe~~,SAAS,KAAK,OACxC;~~eAEA~~,~~UAAU~~,~~eAAe~~,SAAS,IAC/B,~~GAAG~~,~~QAAQ~~,~~MAAM~~,~~KACjB~~,~~QAAQ~~;~~KACP~~,~~EATA~~,~~MASA~~;~~KAET~~;~~GACE~~,CAAA,~~EACN~~,qBAAC,OAAD;GAAK,WAAU;aAAf,~~CACG~~,~~YAAY~~,~~eAAe~~,SAAS,KACnC,oBAAC,OAAD;IACE,~~UAAU~~,MAAM;~~AACd~~,~~OAAE~~,gBAAgB;~~AAClB~~,~~OAAE~~,iBAAiB;~~AACnB~~,kBAAa;;IAEf,WAAU;cAEV,oBAAC,MAAD;KACE,MAAK;KACL,MAAM;KACN,WAAU;~~KACV~~,CAAA;~~IACE~~,CAAA,~~EAEP~~,aACC,oBAAC,MAAD;IACE,MAAK;IACL,MAAM;IACN,WAAU;IACV,CAAA,GAEF,oBAAC,MAAD;IACE,MAAK;IACL,MAAM;IACN,WAAU;~~IACV~~,CAAA,~~CAEA~~;~~KACF~~"}
1	+ {"version":3,"file":"selected-content.js","names":["cn","Icon","React","SelectedContent","selectedValues","options","multiple","searchable","placeholder","handleClear","renderIcon","IconComponent","length","map","value","index","option","find","o","icon","label","e","preventDefault","stopPropagation"],"sources":["../../../../src/ui/components/select-field/selected-content.tsx"],"sourcesContent":["import type { IconName } from \"#design-system\";\nimport { cn, Icon } from \"#design-system\";\nimport React from \"react\";\nimport type { SelectProps } from \"../enum-field/types.js\";\n\ninterface SelectedContentProps {\n selectedValues: string[];\n options: SelectProps[\"options\"];\n multiple?: boolean;\n searchable?: boolean;\n placeholder?: string;\n handleClear: () => void;\n}\n\nexport const SelectedContent: React.FC<SelectedContentProps> = ({\n selectedValues,\n options = [],\n multiple,\n searchable,\n placeholder,\n handleClear,\n}) => {\n const renderIcon = (\n IconComponent:\n \| IconName\n \| React.ComponentType<{ className?: string }>\n \| undefined,\n ) => {\n if (typeof IconComponent === \"string\") {\n return <Icon name={IconComponent} size={16} />;\n }\n return IconComponent && <IconComponent className=\"size-4\" />;\n };\n\n if (selectedValues.length === 0) {\n return (\n <div\n className={cn(\n \"mx-auto flex w-full items-center\",\n placeholder ? \"justify-between\" : \"justify-end\",\n )}\n >\n {placeholder && (\n <span className=\"text-[14px] font-normal leading-5 text-gray-600 dark:text-gray-500\">\n {placeholder}\n </span>\n )}\n {searchable ? (\n <Icon\n name=\"CaretSort\"\n size={16}\n className=\"cursor-pointer text-gray-700 dark:text-gray-400\"\n />\n ) : (\n <Icon\n name=\"ChevronDown\"\n size={16}\n className=\"cursor-pointer text-gray-700 dark:text-gray-400\"\n />\n )}\n </div>\n );\n }\n\n return (\n <div className=\"flex w-full items-center justify-between gap-2\">\n <div\n className={cn(\n \"max-w-full truncate text-gray-900 dark:text-gray-50\",\n !multiple && \"flex items-center gap-2\",\n )}\n >\n {selectedValues.map((value, index) => {\n const option = options.find((o) => o.value === value);\n return !multiple ? (\n <React.Fragment key={value}>\n {renderIcon(option?.icon)}\n <span className=\"truncate text-[14px] font-normal leading-5\">\n {option?.label}\n </span>\n </React.Fragment>\n ) : (\n <span\n key={value}\n className={cn(\n \"text-[14px] font-normal leading-5\",\n index !== selectedValues.length - 1 && \"mr-1\",\n )}\n >\n {index !== selectedValues.length - 1\n ? `${option?.label},`\n : option?.label}\n </span>\n );\n })}\n </div>\n <div className=\"flex items-center justify-between gap-2\">\n {multiple && selectedValues.length > 0 && (\n <div\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n handleClear();\n }}\n className=\"size-4 p-0\"\n >\n <Icon\n name=\"XmarkLight\"\n size={16}\n className=\"cursor-pointer text-gray-700 dark:text-gray-400\"\n />\n </div>\n )}\n {searchable ? (\n <Icon\n name=\"CaretSort\"\n size={16}\n className=\"cursor-pointer text-gray-700 dark:text-gray-400\"\n />\n ) : (\n <Icon\n name=\"ChevronDown\"\n size={16}\n className=\"cursor-pointer text-gray-700 dark:text-gray-400\"\n />\n )}\n </div>\n </div>\n );\n};\n"],"mappings":";;;;AAcA,MAAaG,mBAAmD,EAC9DC,gBACAC,UAAU,EAAE,EACZC,UACAC,YACAC,aACAC,kBACI;CACJ,MAAMC,cACJC,kBAIG;AACH,MAAI,OAAOA,kBAAkB,SAC3B,QAAO,oBAAC,MAAD;GAAM,MAAMA;GAAe,MAAM;GAAM,CAAA;AAEhD,SAAOA,iBAAiB,oBAAC,eAAD,EAAe,WAAU,UAAW,CAAA;;AAG9D,KAAIP,eAAeQ,WAAW,EAC5B,QACE,qBAAC,OAAD;EACE,WAAWZ,GACT,oCACAQ,cAAc,oBAAoB,cACnC;YAJH,CAMGA,eACC,oBAAC,QAAD;GAAM,WAAU;aACbA;GAEJ,CAAA,EACAD,aACC,oBAAC,MAAD;GACE,MAAK;GACL,MAAM;GACN,WAAU;GACV,CAAA,GAEF,oBAAC,MAAD;GACE,MAAK;GACL,MAAM;GACN,WAAU;GAEb,CAAA,CACG;;AAIV,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,OAAD;GACE,WAAWP,GACT,uDACA,CAACM,YAAY,0BACd;aAEAF,eAAeS,KAAKC,OAAOC,UAAU;IACpC,MAAMC,SAASX,QAAQY,MAAMC,MAAMA,EAAEJ,UAAUA,MAAM;AACrD,WAAO,CAACR,WACN,qBAAC,MAAM,UAAP,EAAA,UAAA,CACGI,WAAWM,QAAQG,KAAK,EACzB,oBAAC,QAAD;KAAM,WAAU;eACbH,QAAQI;KACL,CAAA,CACS,EAAA,EALIN,MAKJ,GAEjB,oBAAC,QAAD;KAEE,WAAWd,GACT,qCACAe,UAAUX,eAAeQ,SAAS,KAAK,OACxC;eAEAG,UAAUX,eAAeQ,SAAS,IAC/B,GAAGI,QAAQI,MAAK,KAChBJ,QAAQI;KAEf,EAVQN,MAUR;KACD;GACC,CAAA,EACL,qBAAC,OAAD;GAAK,WAAU;aAAf,CACGR,YAAYF,eAAeQ,SAAS,KACnC,oBAAC,OAAD;IACE,UAAUS,MAAM;AACdA,OAAEC,gBAAgB;AAClBD,OAAEE,iBAAiB;AACnBd,kBAAa;;IAEf,WAAU;cAEV,oBAAC,MAAD;KACE,MAAK;KACL,MAAM;KACN,WAAU;KAAiD,CAAA;IAGhE,CAAA,EACAF,aACC,oBAAC,MAAD;IACE,MAAK;IACL,MAAM;IACN,WAAU;IACV,CAAA,GAEF,oBAAC,MAAD;IACE,MAAK;IACL,MAAM;IACN,WAAU;IAEb,CAAA,CACE;KACD"}

package/dist/ui/components/select-field/subcomponents/CommandItemList.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { C as SelectProps } from "../../../../index-CuSjRT5A.js";
+import { C as SelectProps } from "../../../../index-B6YyDoT1.js";
 import React from "react";
 //#region src/ui/components/select-field/subcomponents/CommandItemList.d.ts

package/dist/ui/components/select-field/subcomponents/CommandItemList.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { h as Icon, t as cn } from "../../../../src-BX8sU0Tq.js";
+import { h as Icon, t as cn } from "../../../../src-8xf1ueaA.js";
 import { CommandItem } from "../../command/command.js";
 import "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";

package/dist/ui/components/select-field/subcomponents/CommandItemList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CommandItemList.js","names":[],"sources":["../../../../../src/ui/components/select-field/subcomponents/CommandItemList.tsx"],"sourcesContent":["import type { IconName } from \"#design-system\";\nimport { cn, Icon } from \"#design-system\";\nimport React from \"react\";\nimport { CommandItem } from \"../../command/command.js\";\nimport type { SelectProps } from \"../../enum-field/types.js\";\n\ninterface FavoriteOptionsProps {\n options: SelectProps[\"options\"];\n selectedValues: string[];\n multiple?: boolean;\n selectionIcon: \"auto\" \| \"checkmark\";\n selectionIconPosition: \"left\" \| \"right\";\n hasAnyIcon: boolean;\n toggleOption: (value: string) => void;\n tabIndex?: number;\n}\n\nconst renderIcon = (\n IconComponent:\n \| IconName\n \| React.ComponentType<{ className?: string }>\n \| undefined,\n) => {\n if (typeof IconComponent === \"string\") {\n return (\n <Icon\n name={IconComponent}\n size={16}\n className={cn(\"text-gray-700 dark:text-gray-400\")}\n />\n );\n }\n return (\n IconComponent && (\n <IconComponent\n className={cn(\"size-4\", \"text-gray-700 dark:text-gray-400\")}\n />\n )\n );\n};\n\nexport const CommandItemList: React.FC<FavoriteOptionsProps> = ({\n options = [],\n selectedValues,\n multiple,\n selectionIcon,\n selectionIconPosition,\n hasAnyIcon,\n toggleOption,\n tabIndex,\n}) => {\n return (\n <>\n {options.map((opt) => {\n const isSelected = selectedValues.includes(opt.value);\n return (\n <CommandItem\n tabIndex={tabIndex}\n key={`favorite-${opt.value}`}\n value={opt.label}\n onSelect={() => !opt.disabled && toggleOption(opt.value)}\n disabled={opt.disabled}\n className={cn(\n \"cursor-pointer\",\n \"data-[selected=true]:bg-gray-100 dark:data-[selected=true]:bg-gray-900\",\n opt.disabled &&\n \"!pointer-events-auto cursor-not-allowed hover:bg-transparent dark:hover:bg-transparent\",\n )}\n role=\"option\"\n aria-selected={isSelected}\n >\n {selectionIcon === \"auto\" &&\n (multiple ? (\n <div\n className={cn(\n \"flex size-4 items-center justify-center rounded-md border\",\n \"border-gray-700 dark:border-gray-400\",\n isSelected &&\n \"bg-gray-900 text-slate-50 dark:bg-gray-400 dark:text-black\",\n )}\n >\n {isSelected && <Icon name=\"Checkmark\" size={16} />}\n </div>\n ) : (\n <div\n className={cn(\n \"relative size-4 rounded-full border\",\n isSelected\n ? \"border-gray-900 dark:border-gray-400\"\n : \"border-gray-800 dark:border-gray-400\",\n \"bg-transparent dark:bg-transparent\",\n )}\n >\n {isSelected && (\n <div className=\"absolute left-1/2 top-1/2 size-2.5 -translate-x-1/2 -translate-y-1/2 rounded-full bg-gray-900 dark:bg-gray-400\" />\n )}\n </div>\n ))}\n {selectionIcon === \"checkmark\" &&\n !(selectionIconPosition === \"right\" && hasAnyIcon) && (\n <div className=\"size-4\">\n {selectionIconPosition === \"left\" && isSelected && (\n <Icon\n name=\"Checkmark\"\n size={16}\n className=\"text-gray-900 dark:text-gray-50\"\n />\n )}\n </div>\n )}\n {renderIcon(opt.icon)}\n <span\n className={cn(\n \"flex-1 truncate text-[14px] font-normal leading-4\",\n \"text-gray-700 dark:text-gray-500\",\n opt.disabled && \"text-gray-600 dark:text-gray-600\",\n )}\n >\n {opt.label}\n </span>\n {selectionIcon === \"checkmark\" &&\n selectionIconPosition === \"right\" && (\n <div className=\"size-4\">\n {isSelected && (\n <Icon\n name=\"Checkmark\"\n size={16}\n className=\"text-gray-900 dark:text-gray-50\"\n />\n )}\n </div>\n )}\n </CommandItem>\n );\n })}\n </>\n );\n};\n"],"mappings":";;;;;AAiBA,~~MAAM~~,~~cACJ~~,kBAIG;AACH,KAAI,~~OAAO~~,kBAAkB,SAC3B,QACE,oBAAC,MAAD;EACE,~~MAAM~~;EACN,MAAM;EACN,~~WAAW~~,GAAG,mCAAmC;EACjD,CAAA;AAGN,~~QACE~~,iBACE,oBAAC,eAAD,EACE,~~WAAW~~,GAAG,UAAU,mCAAmC,~~EAC3D~~,CAAA;;~~AAKR~~,~~MAAa~~,mBAAmD,~~EAC9D~~,UAAU,EAAE,~~EACZ~~,~~gBACA~~,~~UACA~~,~~eACA~~,~~uBACA~~,~~YACA~~,~~cACA~~,eACI;AACJ,QACE,oBAAA,YAAA,EAAA,~~UACG~~,~~QAAQ~~,~~KAAK~~,QAAQ;EACpB,~~MAAM~~,~~aAAa~~,~~eAAe~~,~~SAAS~~,~~IAAI~~,MAAM;AACrD,SACE,qBAAC,aAAD;~~GACY~~;GAEV,~~OAAO~~,~~IAAI~~;GACX,gBAAgB,~~CAAC~~,~~IAAI~~,~~YAAY~~,~~aAAa~~,~~IAAI~~,MAAM;GACxD,~~UAAU~~,~~IAAI~~;GACd,~~WAAW~~,GACT,kBACA,~~0EACA~~,~~IAAI~~,YACF,yFACH;GACD,MAAK;GACL,~~iBAAe~~;aAbjB;~~IAeG~~,kBAAkB,~~WAChB~~,WACC,oBAAC,OAAD;KACE,~~WAAW~~,GACT,6DACA,~~wCACA~~,cACE,6DACH;~~eAEA~~,cAAc,oBAAC,MAAD;MAAM,MAAK;MAAY,MAAM;MAAM,CAAA;KAC9C,CAAA,GAEN,oBAAC,OAAD;KACE,~~WAAW~~,GACT,~~uCACA~~,aACI,yCACA,wCACJ,qCACD;~~eAEA~~,cACC,oBAAC,OAAD,EAAK,WAAU,~~kHAAmH~~,CAAA;~~KAEhI~~,CAAA;~~IAET~~,kBAAkB,eACjB,~~EAAE~~,0BAA0B,~~WAAW~~,eACrC,oBAAC,OAAD;KAAK,WAAU;~~eACZ~~,0BAA0B,~~UAAU~~,cACnC,oBAAC,MAAD;MACE,MAAK;MACL,MAAM;MACN,WAAU;~~MACV~~,CAAA;~~KAEA~~,CAAA;~~IAET~~,~~WAAW~~,~~IAAI~~,KAAK;IACrB,oBAAC,QAAD;KACE,~~WAAW~~,GACT,qDACA,~~oCACA~~,~~IAAI~~,YAAY,mCACjB;~~eAEA~~,~~IAAI~~;~~KACA~~,CAAA;~~IACN~~,kBAAkB,~~eACjB~~,0BAA0B,WACxB,oBAAC,OAAD;KAAK,WAAU;~~eACZ~~,cACC,oBAAC,MAAD;MACE,MAAK;MACL,MAAM;MACN,WAAU;~~MACV~~,CAAA;~~KAEA~~,CAAA;~~IAEE~~;KA1EP,~~YAAY~~,~~IAAI~~,QA0ET;GAEhB,EACD,CAAA"}
1	+ {"version":3,"file":"CommandItemList.js","names":["cn","Icon","React","CommandItem","renderIcon","IconComponent","CommandItemList","options","selectedValues","multiple","selectionIcon","selectionIconPosition","hasAnyIcon","toggleOption","tabIndex","map","opt","isSelected","includes","value","label","disabled","icon"],"sources":["../../../../../src/ui/components/select-field/subcomponents/CommandItemList.tsx"],"sourcesContent":["import type { IconName } from \"#design-system\";\nimport { cn, Icon } from \"#design-system\";\nimport React from \"react\";\nimport { CommandItem } from \"../../command/command.js\";\nimport type { SelectProps } from \"../../enum-field/types.js\";\n\ninterface FavoriteOptionsProps {\n options: SelectProps[\"options\"];\n selectedValues: string[];\n multiple?: boolean;\n selectionIcon: \"auto\" \| \"checkmark\";\n selectionIconPosition: \"left\" \| \"right\";\n hasAnyIcon: boolean;\n toggleOption: (value: string) => void;\n tabIndex?: number;\n}\n\nconst renderIcon = (\n IconComponent:\n \| IconName\n \| React.ComponentType<{ className?: string }>\n \| undefined,\n) => {\n if (typeof IconComponent === \"string\") {\n return (\n <Icon\n name={IconComponent}\n size={16}\n className={cn(\"text-gray-700 dark:text-gray-400\")}\n />\n );\n }\n return (\n IconComponent && (\n <IconComponent\n className={cn(\"size-4\", \"text-gray-700 dark:text-gray-400\")}\n />\n )\n );\n};\n\nexport const CommandItemList: React.FC<FavoriteOptionsProps> = ({\n options = [],\n selectedValues,\n multiple,\n selectionIcon,\n selectionIconPosition,\n hasAnyIcon,\n toggleOption,\n tabIndex,\n}) => {\n return (\n <>\n {options.map((opt) => {\n const isSelected = selectedValues.includes(opt.value);\n return (\n <CommandItem\n tabIndex={tabIndex}\n key={`favorite-${opt.value}`}\n value={opt.label}\n onSelect={() => !opt.disabled && toggleOption(opt.value)}\n disabled={opt.disabled}\n className={cn(\n \"cursor-pointer\",\n \"data-[selected=true]:bg-gray-100 dark:data-[selected=true]:bg-gray-900\",\n opt.disabled &&\n \"!pointer-events-auto cursor-not-allowed hover:bg-transparent dark:hover:bg-transparent\",\n )}\n role=\"option\"\n aria-selected={isSelected}\n >\n {selectionIcon === \"auto\" &&\n (multiple ? (\n <div\n className={cn(\n \"flex size-4 items-center justify-center rounded-md border\",\n \"border-gray-700 dark:border-gray-400\",\n isSelected &&\n \"bg-gray-900 text-slate-50 dark:bg-gray-400 dark:text-black\",\n )}\n >\n {isSelected && <Icon name=\"Checkmark\" size={16} />}\n </div>\n ) : (\n <div\n className={cn(\n \"relative size-4 rounded-full border\",\n isSelected\n ? \"border-gray-900 dark:border-gray-400\"\n : \"border-gray-800 dark:border-gray-400\",\n \"bg-transparent dark:bg-transparent\",\n )}\n >\n {isSelected && (\n <div className=\"absolute left-1/2 top-1/2 size-2.5 -translate-x-1/2 -translate-y-1/2 rounded-full bg-gray-900 dark:bg-gray-400\" />\n )}\n </div>\n ))}\n {selectionIcon === \"checkmark\" &&\n !(selectionIconPosition === \"right\" && hasAnyIcon) && (\n <div className=\"size-4\">\n {selectionIconPosition === \"left\" && isSelected && (\n <Icon\n name=\"Checkmark\"\n size={16}\n className=\"text-gray-900 dark:text-gray-50\"\n />\n )}\n </div>\n )}\n {renderIcon(opt.icon)}\n <span\n className={cn(\n \"flex-1 truncate text-[14px] font-normal leading-4\",\n \"text-gray-700 dark:text-gray-500\",\n opt.disabled && \"text-gray-600 dark:text-gray-600\",\n )}\n >\n {opt.label}\n </span>\n {selectionIcon === \"checkmark\" &&\n selectionIconPosition === \"right\" && (\n <div className=\"size-4\">\n {isSelected && (\n <Icon\n name=\"Checkmark\"\n size={16}\n className=\"text-gray-900 dark:text-gray-50\"\n />\n )}\n </div>\n )}\n </CommandItem>\n );\n })}\n </>\n );\n};\n"],"mappings":";;;;;AAiBA,MAAMI,cACJC,kBAIG;AACH,KAAI,OAAOA,kBAAkB,SAC3B,QACE,oBAAC,MAAD;EACE,MAAMA;EACN,MAAM;EACN,WAAWL,GAAG,mCAAmC;EACjD,CAAA;AAGN,QACEK,iBACE,oBAAC,eAAD,EACE,WAAWL,GAAG,UAAU,mCAAmC,EAE9D,CAAA;;AAIL,MAAaM,mBAAmD,EAC9DC,UAAU,EAAE,EACZC,gBACAC,UACAC,eACAC,uBACAC,YACAC,cACAC,eACI;AACJ,QACE,oBAAA,YAAA,EAAA,UACGP,QAAQQ,KAAKC,QAAQ;EACpB,MAAMC,aAAaT,eAAeU,SAASF,IAAIG,MAAM;AACrD,SACE,qBAAC,aAAD;GACYL;GAEV,OAAOE,IAAII;GACX,gBAAgB,CAACJ,IAAIK,YAAYR,aAAaG,IAAIG,MAAM;GACxD,UAAUH,IAAIK;GACd,WAAWrB,GACT,kBACA,0EACAgB,IAAIK,YACF,yFACH;GACD,MAAK;GACL,iBAAeJ;aAbjB;IAeGP,kBAAkB,WAChBD,WACC,oBAAC,OAAD;KACE,WAAWT,GACT,6DACA,wCACAiB,cACE,6DACH;eAEAA,cAAc,oBAAC,MAAD;MAAM,MAAK;MAAY,MAAM;MAAM,CAAA;KAC9C,CAAA,GAEN,oBAAC,OAAD;KACE,WAAWjB,GACT,uCACAiB,aACI,yCACA,wCACJ,qCACD;eAEAA,cACC,oBAAC,OAAD,EAAK,WAAU,kHAChB,CAAA;KAEJ,CAAA;IACFP,kBAAkB,eACjB,EAAEC,0BAA0B,WAAWC,eACrC,oBAAC,OAAD;KAAK,WAAU;eACZD,0BAA0B,UAAUM,cACnC,oBAAC,MAAD;MACE,MAAK;MACL,MAAM;MACN,WAAU;MAEb,CAAA;KAEJ,CAAA;IACFb,WAAWY,IAAIM,KAAK;IACrB,oBAAC,QAAD;KACE,WAAWtB,GACT,qDACA,oCACAgB,IAAIK,YAAY,mCACjB;eAEAL,IAAII;KACD,CAAA;IACLV,kBAAkB,eACjBC,0BAA0B,WACxB,oBAAC,OAAD;KAAK,WAAU;eACZM,cACC,oBAAC,MAAD;MACE,MAAK;MACL,MAAM;MACN,WAAU;MAEb,CAAA;KAEJ,CAAA;IACS;KA1EP,YAAYD,IAAIG,QA0ET;GAEhB,EACD,CAAA"}

package/dist/ui/components/select-field/use-select-field.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { C as SelectProps } from "../../../index-CuSjRT5A.js";
+import { C as SelectProps } from "../../../index-B6YyDoT1.js";
 import * as react from "react";
 //#region src/ui/components/select-field/use-select-field.d.ts

package/dist/ui/components/select-field/use-select-field.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-select-field.js","names":[],"sources":["../../../../src/ui/components/select-field/use-select-field.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport type { SelectProps } from \"../enum-field/types.js\";\n\ninterface UseSelectFieldProps {\n options?: SelectProps[\"options\"];\n multiple?: boolean;\n defaultValue?: string \| string[];\n value?: string \| string[];\n onChange?: (value: string \| string[]) => void;\n}\n\nexport function useSelectField({\n options = [],\n multiple = false,\n defaultValue,\n value,\n onChange,\n}: UseSelectFieldProps) {\n const isInternalChange = useRef(false);\n const commandListRef = useRef<HTMLDivElement>(null);\n const [isPopoverOpen, setIsPopoverOpen] = useState(false);\n const [selectedValues, setSelectedValues] = useState<string[]>(() => {\n const initialValue = value ?? defaultValue ?? [];\n if (initialValue === \"\") {\n return [];\n }\n return Array.isArray(initialValue) ? initialValue : [initialValue];\n });\n\n useEffect(() => {\n if (isInternalChange.current) {\n isInternalChange.current = false;\n return;\n }\n const newValue = value ?? defaultValue ?? [];\n if (newValue === \"\") {\n setSelectedValues([]);\n } else {\n setSelectedValues(Array.isArray(newValue) ? newValue : [newValue]);\n }\n }, [value]);\n\n const handleOpenChange = useCallback((open: boolean) => {\n setIsPopoverOpen(open);\n }, []);\n\n const toggleOption = useCallback(\n (optionValue: string) => {\n isInternalChange.current = true;\n let newValues: string[];\n\n if (multiple) {\n newValues = selectedValues.includes(optionValue)\n ? selectedValues.filter((v) => v !== optionValue)\n : [...selectedValues, optionValue];\n } else {\n newValues = selectedValues[0] === optionValue ? [] : [optionValue];\n\n setIsPopoverOpen(false);\n }\n\n setSelectedValues(newValues);\n onChange?.(multiple ? newValues : (newValues[0] ?? \"\"));\n },\n [multiple, selectedValues, options, onChange],\n );\n\n const handleClear = useCallback(() => {\n isInternalChange.current = true;\n setSelectedValues([]);\n onChange?.(multiple ? [] : \"\");\n }, [multiple, onChange]);\n\n const toggleAll = useCallback(() => {\n isInternalChange.current = true;\n const enabledOptions = options\n .filter((opt) => !opt.disabled)\n .map((opt) => opt.value);\n\n const newValues =\n selectedValues.length === enabledOptions.length ? [] : enabledOptions;\n\n setSelectedValues(newValues);\n onChange?.(multiple ? newValues : newValues[0]);\n }, [options, selectedValues, multiple, onChange]);\n\n // handles changes to the \"multiple\" prop avoiding calling onChange on mount\n const prevMultiple = useRef(multiple);\n useEffect(() => {\n if (prevMultiple.current === multiple) {\n return;\n }\n prevMultiple.current = multiple;\n\n if (!multiple && selectedValues.length > 1) {\n isInternalChange.current = true;\n setSelectedValues([selectedValues[0]]);\n onChange?.(selectedValues[0]);\n return;\n }\n if (selectedValues.length > 0) {\n isInternalChange.current = true;\n onChange?.(multiple ? [selectedValues[0]] : selectedValues[0]);\n }\n }, [multiple]);\n\n return {\n selectedValues,\n isPopoverOpen,\n commandListRef,\n toggleOption,\n handleClear,\n toggleAll,\n handleOpenChange,\n };\n}\n"],"mappings":";;AAWA,~~SAAgB~~,eAAe,~~EAC7B~~,UAAU,EAAE,~~EACZ~~,WAAW,~~OACX~~,~~cACA~~,~~OACA~~,YACsB;CACtB,~~MAAM~~,~~mBAAmB~~,OAAO,MAAM;CACtC,~~MAAM~~,~~iBAAiB~~,OAAuB,KAAK;CACnD,MAAM,~~CAAC~~,~~eAAe~~,~~oBAAoB~~,SAAS,MAAM;CACzD,MAAM,~~CAAC~~,~~gBAAgB~~,~~qBAAqB~~,eAAyB;EACnE,~~MAAM~~,~~eAAe~~,~~SAAS~~,gBAAgB,EAAE;AAChD,~~MAAI~~,iBAAiB,GACnB,QAAO,EAAE;AAEX,~~SAAO~~,~~MAAM~~,~~QAAQ~~,aAAa,~~GAAG~~,eAAe,~~CAAC~~,aAAa;GAClE;~~AAEF~~,iBAAgB;AACd,~~MAAI~~,~~iBAAiB~~,SAAS;~~AAC5B~~,~~oBAAiB~~,UAAU;AAC3B;;EAEF,~~MAAM~~,~~WAAW~~,~~SAAS~~,gBAAgB,EAAE;AAC5C,~~MAAI~~,aAAa,~~GACf~~,mBAAkB,EAAE,CAAC;~~MAErB~~,~~mBAAkB~~,~~MAAM~~,~~QAAQ~~,SAAS,~~GAAG~~,WAAW,~~CAAC~~,SAAS,CAAC;IAEnE,~~CAAC~~,MAAM,CAAC;CAEX,~~MAAM~~,~~mBAAmB~~,~~aAAa~~,SAAkB;~~AACtD~~,~~mBAAiB~~,KAAK;IACrB,EAAE,CAAC;CAEN,~~MAAM~~,~~eAAe~~,~~aAClB~~,gBAAwB;~~AACvB~~,~~mBAAiB~~,UAAU;EAC3B,~~IAAI~~;AAEJ,~~MAAI~~,~~SACF~~,~~aAAY~~,~~eAAe~~,~~SAAS~~,YAAY,~~GAC5C~~,~~eAAe~~,~~QAAQ~~,~~MAAM~~,~~MAAM~~,YAAY,GAC/C,CAAC,~~GAAG~~,~~gBAAgB~~,YAAY;OAC/B;~~AACL~~,~~eAAY~~,eAAe,~~OAAO~~,cAAc,EAAE,GAAG,~~CAAC~~,YAAY;~~AAElE~~,oBAAiB,MAAM;;~~AAGzB~~,~~oBAAkB~~,UAAU;~~AAC5B~~,~~aAAW~~,~~WAAW~~,~~YAAa~~,UAAU,MAAM,GAAI;IAEzD;~~EAAC~~;~~EAAU~~;~~EAAgB~~;~~EAAS~~;~~EAAS~~,~~CAC9C~~;CAED,~~MAAM~~,~~cAAc~~,kBAAkB;~~AACpC~~,~~mBAAiB~~,UAAU;~~AAC3B~~,oBAAkB,EAAE,CAAC;~~AACrB~~,~~aAAW~~,WAAW,EAAE,GAAG,GAAG;IAC7B,~~CAAC~~,~~UAAU~~,SAAS,CAAC;CAExB,~~MAAM~~,~~YAAY~~,kBAAkB;~~AAClC~~,~~mBAAiB~~,UAAU;EAC3B,~~MAAM~~,~~iBAAiB~~,~~QACpB~~,~~QAAQ~~,QAAQ,~~CAAC~~,~~IAAI~~,SAAS,~~CAC9B~~,~~KAAK~~,~~QAAQ~~,~~IAAI~~,MAAM;EAE1B,~~MAAM~~,~~YACJ~~,~~eAAe~~,~~WAAW~~,~~eAAe~~,SAAS,EAAE,~~GAAG~~;~~AAEzD~~,~~oBAAkB~~,UAAU;~~AAC5B~~,~~aAAW~~,~~WAAW~~,~~YAAY~~,UAAU,GAAG;IAC9C;~~EAAC~~;~~EAAS~~;~~EAAgB~~;~~EAAU~~;EAAS,CAAC;CAGjD,~~MAAM~~,~~eAAe~~,~~OAAO~~,SAAS;~~AACrC~~,iBAAgB;AACd,~~MAAI~~,~~aAAa~~,~~YAAY~~,SAC3B;~~AAEF~~,~~eAAa~~,~~UAAU~~;AAEvB,MAAI,~~CAAC~~,~~YAAY~~,~~eAAe~~,SAAS,GAAG;~~AAC1C~~,~~oBAAiB~~,UAAU;~~AAC3B~~,qBAAkB,~~CAAC~~,eAAe,GAAG,CAAC;~~AACtC~~,~~cAAW~~,eAAe,GAAG;AAC7B;;AAEF,~~MAAI~~,~~eAAe~~,SAAS,GAAG;~~AAC7B~~,~~oBAAiB~~,UAAU;~~AAC3B~~,~~cAAW~~,WAAW,~~CAAC~~,eAAe,GAAG,~~GAAG~~,eAAe,GAAG;;IAE/D,~~CAAC~~,SAAS,CAAC;AAEd,QAAO;~~EACL~~;~~EACA~~;~~EACA~~;~~EACA~~;~~EACA~~;~~EACA~~;~~EACA~~;EACD"}
1	+ {"version":3,"file":"use-select-field.js","names":["useCallback","useEffect","useRef","useState","useSelectField","options","multiple","defaultValue","value","onChange","isInternalChange","commandListRef","isPopoverOpen","setIsPopoverOpen","selectedValues","setSelectedValues","initialValue","Array","isArray","current","newValue","handleOpenChange","open","toggleOption","optionValue","newValues","includes","filter","v","handleClear","toggleAll","enabledOptions","opt","disabled","map","length","prevMultiple"],"sources":["../../../../src/ui/components/select-field/use-select-field.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport type { SelectProps } from \"../enum-field/types.js\";\n\ninterface UseSelectFieldProps {\n options?: SelectProps[\"options\"];\n multiple?: boolean;\n defaultValue?: string \| string[];\n value?: string \| string[];\n onChange?: (value: string \| string[]) => void;\n}\n\nexport function useSelectField({\n options = [],\n multiple = false,\n defaultValue,\n value,\n onChange,\n}: UseSelectFieldProps) {\n const isInternalChange = useRef(false);\n const commandListRef = useRef<HTMLDivElement>(null);\n const [isPopoverOpen, setIsPopoverOpen] = useState(false);\n const [selectedValues, setSelectedValues] = useState<string[]>(() => {\n const initialValue = value ?? defaultValue ?? [];\n if (initialValue === \"\") {\n return [];\n }\n return Array.isArray(initialValue) ? initialValue : [initialValue];\n });\n\n useEffect(() => {\n if (isInternalChange.current) {\n isInternalChange.current = false;\n return;\n }\n const newValue = value ?? defaultValue ?? [];\n if (newValue === \"\") {\n setSelectedValues([]);\n } else {\n setSelectedValues(Array.isArray(newValue) ? newValue : [newValue]);\n }\n }, [value]);\n\n const handleOpenChange = useCallback((open: boolean) => {\n setIsPopoverOpen(open);\n }, []);\n\n const toggleOption = useCallback(\n (optionValue: string) => {\n isInternalChange.current = true;\n let newValues: string[];\n\n if (multiple) {\n newValues = selectedValues.includes(optionValue)\n ? selectedValues.filter((v) => v !== optionValue)\n : [...selectedValues, optionValue];\n } else {\n newValues = selectedValues[0] === optionValue ? [] : [optionValue];\n\n setIsPopoverOpen(false);\n }\n\n setSelectedValues(newValues);\n onChange?.(multiple ? newValues : (newValues[0] ?? \"\"));\n },\n [multiple, selectedValues, options, onChange],\n );\n\n const handleClear = useCallback(() => {\n isInternalChange.current = true;\n setSelectedValues([]);\n onChange?.(multiple ? [] : \"\");\n }, [multiple, onChange]);\n\n const toggleAll = useCallback(() => {\n isInternalChange.current = true;\n const enabledOptions = options\n .filter((opt) => !opt.disabled)\n .map((opt) => opt.value);\n\n const newValues =\n selectedValues.length === enabledOptions.length ? [] : enabledOptions;\n\n setSelectedValues(newValues);\n onChange?.(multiple ? newValues : newValues[0]);\n }, [options, selectedValues, multiple, onChange]);\n\n // handles changes to the \"multiple\" prop avoiding calling onChange on mount\n const prevMultiple = useRef(multiple);\n useEffect(() => {\n if (prevMultiple.current === multiple) {\n return;\n }\n prevMultiple.current = multiple;\n\n if (!multiple && selectedValues.length > 1) {\n isInternalChange.current = true;\n setSelectedValues([selectedValues[0]]);\n onChange?.(selectedValues[0]);\n return;\n }\n if (selectedValues.length > 0) {\n isInternalChange.current = true;\n onChange?.(multiple ? [selectedValues[0]] : selectedValues[0]);\n }\n }, [multiple]);\n\n return {\n selectedValues,\n isPopoverOpen,\n commandListRef,\n toggleOption,\n handleClear,\n toggleAll,\n handleOpenChange,\n };\n}\n"],"mappings":";;AAWA,SAAgBI,eAAe,EAC7BC,UAAU,EAAE,EACZC,WAAW,OACXC,cACAC,OACAC,YACsB;CACtB,MAAMC,mBAAmBR,OAAO,MAAM;CACtC,MAAMS,iBAAiBT,OAAuB,KAAK;CACnD,MAAM,CAACU,eAAeC,oBAAoBV,SAAS,MAAM;CACzD,MAAM,CAACW,gBAAgBC,qBAAqBZ,eAAyB;EACnE,MAAMa,eAAeR,SAASD,gBAAgB,EAAE;AAChD,MAAIS,iBAAiB,GACnB,QAAO,EAAE;AAEX,SAAOC,MAAMC,QAAQF,aAAa,GAAGA,eAAe,CAACA,aAAa;GAClE;AAEFf,iBAAgB;AACd,MAAIS,iBAAiBS,SAAS;AAC5BT,oBAAiBS,UAAU;AAC3B;;EAEF,MAAMC,WAAWZ,SAASD,gBAAgB,EAAE;AAC5C,MAAIa,aAAa,GACfL,mBAAkB,EAAE,CAAC;MAErBA,mBAAkBE,MAAMC,QAAQE,SAAS,GAAGA,WAAW,CAACA,SAAS,CAAC;IAEnE,CAACZ,MAAM,CAAC;CAEX,MAAMa,mBAAmBrB,aAAasB,SAAkB;AACtDT,mBAAiBS,KAAK;IACrB,EAAE,CAAC;CAEN,MAAMC,eAAevB,aAClBwB,gBAAwB;AACvBd,mBAAiBS,UAAU;EAC3B,IAAIM;AAEJ,MAAInB,SACFmB,aAAYX,eAAeY,SAASF,YAAY,GAC5CV,eAAea,QAAQC,MAAMA,MAAMJ,YAAY,GAC/C,CAAC,GAAGV,gBAAgBU,YAAY;OAC/B;AACLC,eAAYX,eAAe,OAAOU,cAAc,EAAE,GAAG,CAACA,YAAY;AAElEX,oBAAiB,MAAM;;AAGzBE,oBAAkBU,UAAU;AAC5BhB,aAAWH,WAAWmB,YAAaA,UAAU,MAAM,GAAI;IAEzD;EAACnB;EAAUQ;EAAgBT;EAASI;EACtC,CAAC;CAED,MAAMoB,cAAc7B,kBAAkB;AACpCU,mBAAiBS,UAAU;AAC3BJ,oBAAkB,EAAE,CAAC;AACrBN,aAAWH,WAAW,EAAE,GAAG,GAAG;IAC7B,CAACA,UAAUG,SAAS,CAAC;CAExB,MAAMqB,YAAY9B,kBAAkB;AAClCU,mBAAiBS,UAAU;EAC3B,MAAMY,iBAAiB1B,QACpBsB,QAAQK,QAAQ,CAACA,IAAIC,SAAS,CAC9BC,KAAKF,QAAQA,IAAIxB,MAAM;EAE1B,MAAMiB,YACJX,eAAeqB,WAAWJ,eAAeI,SAAS,EAAE,GAAGJ;AAEzDhB,oBAAkBU,UAAU;AAC5BhB,aAAWH,WAAWmB,YAAYA,UAAU,GAAG;IAC9C;EAACpB;EAASS;EAAgBR;EAAUG;EAAS,CAAC;CAGjD,MAAM2B,eAAelC,OAAOI,SAAS;AACrCL,iBAAgB;AACd,MAAImC,aAAajB,YAAYb,SAC3B;AAEF8B,eAAajB,UAAUb;AAEvB,MAAI,CAACA,YAAYQ,eAAeqB,SAAS,GAAG;AAC1CzB,oBAAiBS,UAAU;AAC3BJ,qBAAkB,CAACD,eAAe,GAAG,CAAC;AACtCL,cAAWK,eAAe,GAAG;AAC7B;;AAEF,MAAIA,eAAeqB,SAAS,GAAG;AAC7BzB,oBAAiBS,UAAU;AAC3BV,cAAWH,WAAW,CAACQ,eAAe,GAAG,GAAGA,eAAe,GAAG;;IAE/D,CAACR,SAAS,CAAC;AAEd,QAAO;EACLQ;EACAF;EACAD;EACAY;EACAM;EACAC;EACAT;EACD"}

package/dist/ui/components/text-field/text-field.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import { n as TextFieldProps, t as TextField } from "../../../text-field-D_SU7LsS.js";
+import { n as TextFieldProps, t as TextField } from "../../../text-field-Bi7Ze25A.js";
 export { TextField, TextFieldProps };

package/dist/ui/components/text-field/text-field.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { TextInput } from "../text-input/text-input.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/ui/components/text-field/text-field.tsx
-const TextField = forwardRef(function TextField(props, ref) {
+const TextField = /* @__PURE__ */ forwardRef(function TextField(props, ref) {
 	return /* @__PURE__ */ jsx(withFieldValidation(TextInput), {
 		...props,
 		ref

package/dist/ui/components/text-field/text-field.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"text-field.js","names":[],"sources":["../../../../src/ui/components/text-field/text-field.tsx"],"sourcesContent":["import type { Ref } from \"react\";\nimport { forwardRef } from \"react\";\nimport type { FieldErrorHandling, WithDifference } from \"../../types.js\";\nimport { type TextInputProps, TextInput } from \"../text-input/text-input.js\";\nimport { withFieldValidation } from \"../with-field-validation/with-field-validation.js\";\n\nexport type TextFieldProps = TextInputProps &\n FieldErrorHandling &\n WithDifference<string>;\n\nexport const TextField = forwardRef(function TextField(\n props: TextFieldProps,\n ref: Ref<HTMLInputElement>,\n) {\n const Component = withFieldValidation<TextFieldProps>(TextInput);\n return <Component {...props} ref={ref} />;\n});\n\nTextField.displayName = \"TextField\";\n"],"mappings":";;;;;AAUA,~~MAAa~~,~~YAAY~~,~~WAAW~~,~~SAAS~~,~~UAC3C~~,~~OACA~~,KACA;AAEA,QAAO,~~oBADW~~,~~oBAAoC~~,UAAU,EACzD;EAAW,~~GAAI~~;~~EAAY~~;EAAO,CAAA;EACzC;~~AAEF~~,~~UAAU~~,cAAc"}
1	+ {"version":3,"file":"text-field.js","names":["forwardRef","TextInput","withFieldValidation","TextField","props","ref","Component","displayName"],"sources":["../../../../src/ui/components/text-field/text-field.tsx"],"sourcesContent":["import type { Ref } from \"react\";\nimport { forwardRef } from \"react\";\nimport type { FieldErrorHandling, WithDifference } from \"../../types.js\";\nimport { type TextInputProps, TextInput } from \"../text-input/text-input.js\";\nimport { withFieldValidation } from \"../with-field-validation/with-field-validation.js\";\n\nexport type TextFieldProps = TextInputProps &\n FieldErrorHandling &\n WithDifference<string>;\n\nexport const TextField = forwardRef(function TextField(\n props: TextFieldProps,\n ref: Ref<HTMLInputElement>,\n) {\n const Component = withFieldValidation<TextFieldProps>(TextInput);\n return <Component {...props} ref={ref} />;\n});\n\nTextField.displayName = \"TextField\";\n"],"mappings":";;;;;AAUA,MAAaG,YAAYH,2BAAW,SAASG,UAC3CC,OACAC,KACA;AAEA,QAAO,oBADWH,oBAAoCD,UAAU,EACzD;EAAW,GAAIG;EAAYC;EAAO,CAAA;EACzC;AAEFF,UAAUI,cAAc"}

package/dist/ui/components/text-input/text-input-diff.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import { t as TextInputDiff } from "../../../text-input-diff-BX11t5bF.js";
+import { t as TextInputDiff } from "../../../text-input-diff-Bx-zFOZd.js";
 export { TextInputDiff as default };

package/dist/ui/components/text-input/text-input-diff.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"text-input-diff.js","names":[],"sources":["../../../../src/ui/components/text-input/text-input-diff.tsx"],"sourcesContent":["import type { WithDifference } from \"../../types.js\";\nimport { FormGroup } from \"../form-group/form-group.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { SplittedInputDiff } from \"../input/splitted-input-diff.js\";\n\ninterface TextInputDiffProps extends WithDifference<string> {\n value: string;\n label?: React.ReactNode;\n required?: boolean;\n}\nconst TextInputDiff = ({\n value,\n label,\n required,\n baseValue = \"\",\n viewMode = \"edition\",\n diffMode = \"sentences\",\n}: TextInputDiffProps) => {\n return (\n <FormGroup>\n {label && (\n <FormLabel disabled={true} required={required}>\n {label}\n </FormLabel>\n )}\n <SplittedInputDiff\n value={value}\n baseValue={baseValue}\n diffMode={diffMode}\n viewMode={viewMode}\n />\n </FormGroup>\n );\n};\n\nexport default TextInputDiff;\n"],"mappings":";;;;;AAUA,~~MAAM~~,iBAAiB,~~EACrB~~,~~OACA~~,~~OACA~~,~~UACA~~,YAAY,~~IACZ~~,WAAW,~~WACX~~,WAAW,kBACa;AACxB,QACE,qBAAC,WAAD,EAAA,UAAA,~~CACG~~,SACC,oBAAC,WAAD;EAAW,UAAU;~~EAAgB~~;~~YAClC~~;~~EACS~~,CAAA,~~EAEd~~,oBAAC,mBAAD;~~EACS~~;~~EACI~~;~~EACD~~;~~EACA~~;~~EACV~~,CAAA,~~CACQ~~,EAAA,CAAA"}
1	+ {"version":3,"file":"text-input-diff.js","names":["FormGroup","FormLabel","SplittedInputDiff","TextInputDiff","value","label","required","baseValue","viewMode","diffMode"],"sources":["../../../../src/ui/components/text-input/text-input-diff.tsx"],"sourcesContent":["import type { WithDifference } from \"../../types.js\";\nimport { FormGroup } from \"../form-group/form-group.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { SplittedInputDiff } from \"../input/splitted-input-diff.js\";\n\ninterface TextInputDiffProps extends WithDifference<string> {\n value: string;\n label?: React.ReactNode;\n required?: boolean;\n}\nconst TextInputDiff = ({\n value,\n label,\n required,\n baseValue = \"\",\n viewMode = \"edition\",\n diffMode = \"sentences\",\n}: TextInputDiffProps) => {\n return (\n <FormGroup>\n {label && (\n <FormLabel disabled={true} required={required}>\n {label}\n </FormLabel>\n )}\n <SplittedInputDiff\n value={value}\n baseValue={baseValue}\n diffMode={diffMode}\n viewMode={viewMode}\n />\n </FormGroup>\n );\n};\n\nexport default TextInputDiff;\n"],"mappings":";;;;;AAUA,MAAMG,iBAAiB,EACrBC,OACAC,OACAC,UACAC,YAAY,IACZC,WAAW,WACXC,WAAW,kBACa;AACxB,QACE,qBAAC,WAAD,EAAA,UAAA,CACGJ,SACC,oBAAC,WAAD;EAAW,UAAU;EAAgBC;YAClCD;EAEJ,CAAA,EACD,oBAAC,mBAAD;EACSD;EACIG;EACDE;EACAD;EAAS,CAAA,CAEX,EAAA,CAAA"}

package/dist/ui/components/text-input/text-input.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import { n as TextInputProps, t as TextInput } from "../../../text-input-BHnj0vwk.js";
+import { n as TextInputProps, t as TextInput } from "../../../text-input-BAO78Lzx.js";
 export { TextInput, TextInputProps };

package/dist/ui/components/text-input/text-input.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { t as cn } from "../../../src-BX8sU0Tq.js";
+import { t as cn } from "../../../src-8xf1ueaA.js";
 import { CharacterCounter } from "../character-counter/character-counter.js";
 import { FormLabel } from "../form-label/form-label.js";
 import { FormMessageList } from "../form-message/message-list.js";
@@ -11,7 +11,7 @@ import TextInputDiff from "./text-input-diff.js";
 import { forwardRef, useId, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/ui/components/text-input/text-input.tsx
-const TextInput = forwardRef(({ label, description, value, defaultValue, onChange, errors, warnings, pattern, trim, uppercase, lowercase, maxLength, autoComplete, baseValue, viewMode = "edition", diffMode, ...props }, ref) => {
+const TextInput = /* @__PURE__ */ forwardRef(({ label, description, value, defaultValue, onChange, errors, warnings, pattern, trim, uppercase, lowercase, maxLength, autoComplete, baseValue, viewMode = "edition", diffMode, ...props }, ref) => {
 	const idGenerated = useId();
 	const id = props.id ?? idGenerated;
 	const autoCompleteValue = autoComplete === void 0 ? void 0 : autoComplete ? "on" : "off";

package/dist/ui/components/text-input/text-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"text-input.js","names":[],"sources":["../../../../src/ui/components/text-input/text-input.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport { forwardRef, useId, useMemo } from \"react\";\nimport { sharedValueTransformers } from \"#design-system/ui/lib\";\nimport type { DiffMode, InputBaseProps, WithDifference } from \"../../types.js\";\nimport { CharacterCounter } from \"../character-counter/character-counter.js\";\nimport { FormDescription } from \"../form-description/form-description.js\";\nimport { FormGroup } from \"../form-group/form-group.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { Input } from \"../input/input.js\";\nimport type { TransformerType } from \"#design-system\";\nimport { ValueTransformer } from \"../value-transformer/value-transformer.js\";\nimport TextInputDiff from \"./text-input-diff.js\";\nimport type { CommonTextProps } from \"./types.js\";\n\ninterface TextInputProps\n extends\n Omit<\n InputBaseProps<string> &\n Omit<React.InputHTMLAttributes<HTMLInputElement>, \"pattern\"> &\n CommonTextProps,\n \"value\" \| \"autoComplete\"\n >,\n Omit<WithDifference<string>, \"diffMode\"> {\n value?: string;\n autoComplete?: boolean;\n diffMode?: Extract<DiffMode, \"sentences\">;\n}\n\nconst TextInput = forwardRef<HTMLInputElement, TextInputProps>(\n (\n {\n label,\n description,\n value,\n defaultValue,\n onChange,\n errors,\n warnings,\n // TextProps\n pattern,\n trim,\n uppercase,\n lowercase,\n maxLength,\n autoComplete,\n // Difference Props\n baseValue,\n viewMode = \"edition\",\n diffMode,\n ...props\n },\n ref,\n ) => {\n const idGenerated = useId();\n const id = props.id ?? idGenerated;\n const autoCompleteValue =\n autoComplete === undefined ? undefined : autoComplete ? \"on\" : \"off\";\n const hasContentBelow =\n !!description \|\|\n (Array.isArray(warnings) && warnings.length > 0) \|\|\n (Array.isArray(errors) && errors.length > 0);\n\n const transformers: TransformerType = useMemo(\n () => [\n sharedValueTransformers.trimOnBlur(!!trim),\n sharedValueTransformers.lowercaseOnChange(!!lowercase),\n sharedValueTransformers.uppercaseOnChange(!!uppercase),\n sharedValueTransformers.trimOnEnter(!!trim),\n ],\n [trim, lowercase, uppercase],\n );\n\n if (viewMode === \"edition\") {\n return (\n <FormGroup>\n {label && (\n <FormLabel\n htmlFor={id}\n required={props.required}\n disabled={props.disabled}\n hasError={!!errors?.length}\n >\n {label}\n </FormLabel>\n )}\n <ValueTransformer transformers={transformers}>\n <Input\n id={id}\n value={value ?? defaultValue ?? \"\"}\n onChange={onChange}\n pattern={pattern?.toString()}\n autoComplete={autoCompleteValue}\n {...props}\n ref={ref}\n />\n </ValueTransformer>\n {typeof maxLength === \"number\" && maxLength > 0 && (\n <div\n className={cn(\n \"mt-[-6px] flex justify-end\",\n hasContentBelow && \"-mb-1\",\n )}\n >\n <CharacterCounter maxLength={maxLength} value={value ?? \"\"} />\n </div>\n )}\n {description && <FormDescription>{description}</FormDescription>}\n {warnings && <FormMessageList messages={warnings} type=\"warning\" />}\n {errors && <FormMessageList messages={errors} type=\"error\" />}\n </FormGroup>\n );\n }\n\n // Diff mode\n return (\n <TextInputDiff\n value={value ?? defaultValue ?? \"\"}\n viewMode={viewMode}\n diffMode={diffMode}\n baseValue={baseValue}\n label={label}\n required={props.required}\n />\n );\n },\n);\n\nTextInput.displayName = \"TextInput\";\n\nexport { TextInput, type TextInputProps };\n"],"mappings":";;;;;;;;;;;;;AA6BA,~~MAAM~~,~~YAAY~~,~~YAEd~~,~~EACE~~,~~OACA~~,~~aACA~~,~~OACA~~,~~cACA~~,~~UACA~~,~~QACA~~,~~UAEA~~,~~SACA~~,~~MACA~~,~~WACA~~,~~WACA~~,~~WACA~~,~~cAEA~~,~~WACA~~,WAAW,~~WACX~~,UACA,~~GAAG~~,~~SAEL~~,QACG;CACH,~~MAAM~~,~~cAAc~~,OAAO;CAC3B,MAAM,~~KAAK~~,~~MAAM~~,~~MAAM~~;CACvB,~~MAAM~~,~~oBACJ~~,~~iBAAiB~~,~~KAAA~~,~~IAAY~~,~~KAAA~~,~~IAAY~~,eAAe,OAAO;CACjE,~~MAAM~~,kBACJ,CAAC,~~CAAC~~,~~eACD~~,~~MAAM~~,~~QAAQ~~,SAAS,~~IAAI~~,~~SAAS~~,SAAS,~~KAC7C~~,~~MAAM~~,~~QAAQ~~,OAAO,~~IAAI~~,~~OAAO~~,SAAS;CAE5C,~~MAAM~~,~~eAAgC~~,cAC9B;~~EACJ~~,~~wBAAwB~~,WAAW,CAAC,~~CAAC~~,KAAK;~~EAC1C~~,~~wBAAwB~~,kBAAkB,CAAC,~~CAAC~~,UAAU;~~EACtD~~,~~wBAAwB~~,kBAAkB,CAAC,~~CAAC~~,UAAU;~~EACtD~~,~~wBAAwB~~,YAAY,CAAC,~~CAAC~~,KAAK;EAC5C,EACD;~~EAAC~~;~~EAAM~~;~~EAAW~~;~~EAAU~~,~~CAC7B~~;AAED,~~KAAI~~,aAAa,UACf,QACE,qBAAC,WAAD,EAAA,UAAA;~~EACG~~,SACC,oBAAC,WAAD;GACE,~~SAAS~~;GACT,~~UAAU~~,~~MAAM~~;GAChB,~~UAAU~~,~~MAAM~~;GAChB,UAAU,CAAC,~~CAAC~~,~~QAAQ~~;~~aAEnB~~;~~GACS~~,CAAA;~~EAEd~~,oBAAC,kBAAD;~~GAAgC~~;aAC9B,oBAAC,OAAD;~~IACM~~;IACJ,~~OAAO~~,~~SAAS~~,gBAAgB;~~IACtB~~;IACV,~~SAAS~~,~~SAAS~~,UAAU;IAC5B,~~cAAc~~;IACd,~~GAAI~~;~~IACC~~;~~IACL~~,CAAA;~~GACe~~,CAAA;~~EAClB~~,~~OAAO~~,cAAc,~~YAAY~~,YAAY,KAC5C,oBAAC,OAAD;GACE,~~WAAW~~,GACT,~~8BACA~~,mBAAmB,QACpB;aAED,oBAAC,kBAAD;~~IAA6B~~;IAAW,~~OAAO~~,SAAS;~~IAAM~~,CAAA;~~GAC1D~~,CAAA;~~EAEP~~,eAAe,oBAAC,iBAAD,EAAA,~~UAAkB~~,aAA8B,CAAA;EAC/D,YAAY,oBAAC,iBAAD;GAAiB,~~UAAU~~;GAAU,MAAK;GAAY,CAAA;~~EAClE~~,UAAU,oBAAC,iBAAD;GAAiB,~~UAAU~~;GAAQ,MAAK;GAAU,CAAA;EACnD,EAAA,CAAA;AAKhB,QACE,oBAAC,eAAD;EACE,~~OAAO~~,~~SAAS~~,gBAAgB;~~EACtB~~;~~EACA~~;~~EACC~~;~~EACJ~~;EACP,~~UAAU~~,~~MAAM~~;EAChB,CAAA;EAGP;~~AAED~~,~~UAAU~~,cAAc"}
1	+ {"version":3,"file":"text-input.js","names":["cn","forwardRef","useId","useMemo","sharedValueTransformers","CharacterCounter","FormDescription","FormGroup","FormLabel","FormMessageList","Input","ValueTransformer","TextInputDiff","TextInput","label","description","value","defaultValue","onChange","errors","warnings","pattern","trim","uppercase","lowercase","maxLength","autoComplete","baseValue","viewMode","diffMode","props","ref","idGenerated","id","autoCompleteValue","undefined","hasContentBelow","Array","isArray","length","transformers","trimOnBlur","lowercaseOnChange","uppercaseOnChange","trimOnEnter","required","disabled","toString","displayName"],"sources":["../../../../src/ui/components/text-input/text-input.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport { forwardRef, useId, useMemo } from \"react\";\nimport { sharedValueTransformers } from \"#design-system/ui/lib\";\nimport type { DiffMode, InputBaseProps, WithDifference } from \"../../types.js\";\nimport { CharacterCounter } from \"../character-counter/character-counter.js\";\nimport { FormDescription } from \"../form-description/form-description.js\";\nimport { FormGroup } from \"../form-group/form-group.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { Input } from \"../input/input.js\";\nimport type { TransformerType } from \"#design-system\";\nimport { ValueTransformer } from \"../value-transformer/value-transformer.js\";\nimport TextInputDiff from \"./text-input-diff.js\";\nimport type { CommonTextProps } from \"./types.js\";\n\ninterface TextInputProps\n extends\n Omit<\n InputBaseProps<string> &\n Omit<React.InputHTMLAttributes<HTMLInputElement>, \"pattern\"> &\n CommonTextProps,\n \"value\" \| \"autoComplete\"\n >,\n Omit<WithDifference<string>, \"diffMode\"> {\n value?: string;\n autoComplete?: boolean;\n diffMode?: Extract<DiffMode, \"sentences\">;\n}\n\nconst TextInput = forwardRef<HTMLInputElement, TextInputProps>(\n (\n {\n label,\n description,\n value,\n defaultValue,\n onChange,\n errors,\n warnings,\n // TextProps\n pattern,\n trim,\n uppercase,\n lowercase,\n maxLength,\n autoComplete,\n // Difference Props\n baseValue,\n viewMode = \"edition\",\n diffMode,\n ...props\n },\n ref,\n ) => {\n const idGenerated = useId();\n const id = props.id ?? idGenerated;\n const autoCompleteValue =\n autoComplete === undefined ? undefined : autoComplete ? \"on\" : \"off\";\n const hasContentBelow =\n !!description \|\|\n (Array.isArray(warnings) && warnings.length > 0) \|\|\n (Array.isArray(errors) && errors.length > 0);\n\n const transformers: TransformerType = useMemo(\n () => [\n sharedValueTransformers.trimOnBlur(!!trim),\n sharedValueTransformers.lowercaseOnChange(!!lowercase),\n sharedValueTransformers.uppercaseOnChange(!!uppercase),\n sharedValueTransformers.trimOnEnter(!!trim),\n ],\n [trim, lowercase, uppercase],\n );\n\n if (viewMode === \"edition\") {\n return (\n <FormGroup>\n {label && (\n <FormLabel\n htmlFor={id}\n required={props.required}\n disabled={props.disabled}\n hasError={!!errors?.length}\n >\n {label}\n </FormLabel>\n )}\n <ValueTransformer transformers={transformers}>\n <Input\n id={id}\n value={value ?? defaultValue ?? \"\"}\n onChange={onChange}\n pattern={pattern?.toString()}\n autoComplete={autoCompleteValue}\n {...props}\n ref={ref}\n />\n </ValueTransformer>\n {typeof maxLength === \"number\" && maxLength > 0 && (\n <div\n className={cn(\n \"mt-[-6px] flex justify-end\",\n hasContentBelow && \"-mb-1\",\n )}\n >\n <CharacterCounter maxLength={maxLength} value={value ?? \"\"} />\n </div>\n )}\n {description && <FormDescription>{description}</FormDescription>}\n {warnings && <FormMessageList messages={warnings} type=\"warning\" />}\n {errors && <FormMessageList messages={errors} type=\"error\" />}\n </FormGroup>\n );\n }\n\n // Diff mode\n return (\n <TextInputDiff\n value={value ?? defaultValue ?? \"\"}\n viewMode={viewMode}\n diffMode={diffMode}\n baseValue={baseValue}\n label={label}\n required={props.required}\n />\n );\n },\n);\n\nTextInput.displayName = \"TextInput\";\n\nexport { TextInput, type TextInputProps };\n"],"mappings":";;;;;;;;;;;;;AA6BA,MAAMa,YAAYZ,4BAEd,EACEa,OACAC,aACAC,OACAC,cACAC,UACAC,QACAC,UAEAC,SACAC,MACAC,WACAC,WACAC,WACAC,cAEAC,WACAC,WAAW,WACXC,UACA,GAAGC,SAELC,QACG;CACH,MAAMC,cAAc9B,OAAO;CAC3B,MAAM+B,KAAKH,MAAMG,MAAMD;CACvB,MAAME,oBACJR,iBAAiBS,KAAAA,IAAYA,KAAAA,IAAYT,eAAe,OAAO;CACjE,MAAMU,kBACJ,CAAC,CAACrB,eACDsB,MAAMC,QAAQlB,SAAS,IAAIA,SAASmB,SAAS,KAC7CF,MAAMC,QAAQnB,OAAO,IAAIA,OAAOoB,SAAS;CAE5C,MAAMC,eAAgCrC,cAC9B;EACJC,wBAAwBqC,WAAW,CAAC,CAACnB,KAAK;EAC1ClB,wBAAwBsC,kBAAkB,CAAC,CAAClB,UAAU;EACtDpB,wBAAwBuC,kBAAkB,CAAC,CAACpB,UAAU;EACtDnB,wBAAwBwC,YAAY,CAAC,CAACtB,KAAK;EAC5C,EACD;EAACA;EAAME;EAAWD;EACpB,CAAC;AAED,KAAIK,aAAa,UACf,QACE,qBAAC,WAAD,EAAA,UAAA;EACGd,SACC,oBAAC,WAAD;GACE,SAASmB;GACT,UAAUH,MAAMe;GAChB,UAAUf,MAAMgB;GAChB,UAAU,CAAC,CAAC3B,QAAQoB;aAEnBzB;GAEJ,CAAA;EACD,oBAAC,kBAAD;GAAgC0B;aAC9B,oBAAC,OAAD;IACMP;IACJ,OAAOjB,SAASC,gBAAgB;IACtBC;IACV,SAASG,SAAS0B,UAAU;IAC5B,cAAcb;IACd,GAAIJ;IACCC;IAAI,CAAA;GAEK,CAAA;EACjB,OAAON,cAAc,YAAYA,YAAY,KAC5C,oBAAC,OAAD;GACE,WAAWzB,GACT,8BACAoC,mBAAmB,QACpB;aAED,oBAAC,kBAAD;IAA6BX;IAAW,OAAOT,SAAS;IAAG,CAAA;GAE9D,CAAA;EACAD,eAAe,oBAAC,iBAAD,EAAA,UAAkBA,aAA8B,CAAA;EAC/DK,YAAY,oBAAC,iBAAD;GAAiB,UAAUA;GAAU,MAAK;GAAY,CAAA;EAClED,UAAU,oBAAC,iBAAD;GAAiB,UAAUA;GAAQ,MAAK;GAAU,CAAA;EACnD,EAAA,CAAA;AAKhB,QACE,oBAAC,eAAD;EACE,OAAOH,SAASC,gBAAgB;EACtBW;EACAC;EACCF;EACJb;EACP,UAAUgB,MAAMe;EAChB,CAAA;EAGP;AAEDhC,UAAUmC,cAAc"}

package/dist/ui/components/text-input/types.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import { t as CommonTextProps } from "../../../types-xiS8yRsl.js";
+import { t as CommonTextProps } from "../../../types-Bsn62tJB.js";
 export { CommonTextProps };

package/dist/ui/components/tooltip/tooltip.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import { a as TooltipProps, i as TooltipContent, n as Root, o as Trigger, r as Tooltip, t as Provider } from "../../../tooltip-CJfsoXUL.js";
+import { a as TooltipProps, i as TooltipContent, n as Root, o as Trigger, r as Tooltip, t as Provider } from "../../../tooltip-CsucyiCV.js";
 export { Tooltip, TooltipContent, TooltipProps, Provider as TooltipProvider, Root as TooltipRoot, Trigger as TooltipTrigger };

package/dist/ui/components/tooltip/tooltip.js CHANGED Viewed

@@ -1,9 +1,9 @@
-import { t as cn } from "../../../src-BX8sU0Tq.js";
+import { t as cn } from "../../../src-8xf1ueaA.js";
 import { forwardRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Content, Portal, Provider, Root, Trigger } from "@radix-ui/react-tooltip";
 //#region src/ui/components/tooltip/tooltip.tsx
-const TooltipContent = forwardRef(({ children, className, ...props }, ref) => {
+const TooltipContent = /* @__PURE__ */ forwardRef(({ children, className, ...props }, ref) => {
 	return /* @__PURE__ */ jsx(Content, {
 		ref,
 		...props,

package/dist/ui/components/tooltip/tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tooltip.js","names":[],"sources":["../../../../src/ui/components/tooltip/tooltip.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport type {\n TooltipContentProps,\n TooltipProps as TooltipPrimitiveProps,\n} from \"@radix-ui/react-tooltip\";\nimport {\n Content,\n Portal,\n Provider,\n Root,\n Trigger,\n} from \"@radix-ui/react-tooltip\";\nimport { forwardRef } from \"react\";\n\ninterface TooltipProps\n extends TooltipPrimitiveProps, Omit<TooltipContentProps, \"content\"> {\n content: React.ReactNode;\n className?: string;\n triggerAsChild?: boolean;\n}\n\nconst TooltipContent = forwardRef<\n React.ElementRef<typeof Content>,\n TooltipContentProps\n>(({ children, className, ...props }, ref) => {\n return (\n <Content\n ref={ref}\n {...props}\n className={cn(\n // Base styles\n \"z-50 overflow-hidden rounded-md text-sm\",\n // Colors & Border\n \"border border-gray-200 bg-white text-gray-900 dark:border-gray-900 dark:bg-slate-900 dark:text-gray-200\",\n // Padding & Shadow\n \"px-3 py-1.5 shadow-md\",\n // Animations\n \"data-[state=open]:animate-fade-in data-[state=open]:animate-zoom-in\",\n \"data-[state=closed]:animate-fade-out data-[state=closed]:animate-zoom-out\",\n // Slide animations based on position\n \"data-[side=bottom]:animate-slide-in-from-top\",\n \"data-[side=left]:animate-slide-in-from-right\",\n \"data-[side=right]:animate-slide-in-from-left\",\n \"data-[side=top]:animate-slide-in-from-bottom\",\n className,\n )}\n >\n {children}\n </Content>\n );\n});\n\nconst Tooltip: React.FC<TooltipProps> = ({\n content,\n children,\n triggerAsChild = false,\n delayDuration = 0,\n ...props\n}) => {\n const { open, defaultOpen, onOpenChange, ...rest } = props;\n\n return (\n <Root\n defaultOpen={defaultOpen}\n delayDuration={delayDuration}\n onOpenChange={onOpenChange}\n open={open}\n >\n <Trigger\n asChild={triggerAsChild}\n type={triggerAsChild ? undefined : \"button\"} // Prevent form submission when default trigger is clicked\n >\n {children}\n </Trigger>\n <Portal>\n <TooltipContent sideOffset={3} {...rest}>\n {content}\n </TooltipContent>\n </Portal>\n </Root>\n );\n};\n\nexport {\n Tooltip,\n TooltipContent,\n Provider as TooltipProvider,\n Root as TooltipRoot,\n Trigger as TooltipTrigger,\n type TooltipProps,\n};\n"],"mappings":";;;;;AAqBA,~~MAAM~~,~~iBAAiB~~,~~YAGpB~~,~~EAAE~~,~~UAAU~~,WAAW,~~GAAG~~,~~SAAS~~,QAAQ;AAC5C,QACE,oBAAC,SAAD;~~EACO~~;EACL,~~GAAI~~;EACJ,~~WAAW~~,GAET,2CAEA,2GAEA,yBAEA,uEACA,6EAEA,gDACA,gDACA,gDACA,~~gDACA~~,UACD;~~EAEA~~;EACO,CAAA;EAEZ;AAEF,~~MAAM~~,WAAmC,~~EACvC~~,~~SACA~~,~~UACA~~,iBAAiB,~~OACjB~~,gBAAgB,GAChB,~~GAAG~~,YACC;CACJ,MAAM,~~EAAE~~,~~MAAM~~,~~aAAa~~,cAAc,~~GAAG~~,~~SAAS~~;AAErD,QACE,qBAAC,MAAD;~~EACe~~;~~EACE~~;~~EACD~~;~~EACR~~;YAJR,CAME,oBAAC,SAAD;GACE,~~SAAS~~;GACT,~~MAAM~~,~~iBAAiB~~,~~KAAA~~,IAAY;~~GAElC~~;~~GACO~~,CAAA,~~EACV~~,oBAAC,QAAD,EAAA,UACE,oBAAC,gBAAD;GAAgB,YAAY;GAAG,~~GAAI~~;~~aAChC~~;~~GACc~~,CAAA,EACV,CAAA,~~CACJ~~"}
1	+ {"version":3,"file":"tooltip.js","names":["cn","Content","Portal","Provider","Root","Trigger","forwardRef","TooltipContent","children","className","props","ref","Tooltip","content","triggerAsChild","delayDuration","open","defaultOpen","onOpenChange","rest","undefined","TooltipProvider","TooltipRoot","TooltipTrigger"],"sources":["../../../../src/ui/components/tooltip/tooltip.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport type {\n TooltipContentProps,\n TooltipProps as TooltipPrimitiveProps,\n} from \"@radix-ui/react-tooltip\";\nimport {\n Content,\n Portal,\n Provider,\n Root,\n Trigger,\n} from \"@radix-ui/react-tooltip\";\nimport { forwardRef } from \"react\";\n\ninterface TooltipProps\n extends TooltipPrimitiveProps, Omit<TooltipContentProps, \"content\"> {\n content: React.ReactNode;\n className?: string;\n triggerAsChild?: boolean;\n}\n\nconst TooltipContent = forwardRef<\n React.ElementRef<typeof Content>,\n TooltipContentProps\n>(({ children, className, ...props }, ref) => {\n return (\n <Content\n ref={ref}\n {...props}\n className={cn(\n // Base styles\n \"z-50 overflow-hidden rounded-md text-sm\",\n // Colors & Border\n \"border border-gray-200 bg-white text-gray-900 dark:border-gray-900 dark:bg-slate-900 dark:text-gray-200\",\n // Padding & Shadow\n \"px-3 py-1.5 shadow-md\",\n // Animations\n \"data-[state=open]:animate-fade-in data-[state=open]:animate-zoom-in\",\n \"data-[state=closed]:animate-fade-out data-[state=closed]:animate-zoom-out\",\n // Slide animations based on position\n \"data-[side=bottom]:animate-slide-in-from-top\",\n \"data-[side=left]:animate-slide-in-from-right\",\n \"data-[side=right]:animate-slide-in-from-left\",\n \"data-[side=top]:animate-slide-in-from-bottom\",\n className,\n )}\n >\n {children}\n </Content>\n );\n});\n\nconst Tooltip: React.FC<TooltipProps> = ({\n content,\n children,\n triggerAsChild = false,\n delayDuration = 0,\n ...props\n}) => {\n const { open, defaultOpen, onOpenChange, ...rest } = props;\n\n return (\n <Root\n defaultOpen={defaultOpen}\n delayDuration={delayDuration}\n onOpenChange={onOpenChange}\n open={open}\n >\n <Trigger\n asChild={triggerAsChild}\n type={triggerAsChild ? undefined : \"button\"} // Prevent form submission when default trigger is clicked\n >\n {children}\n </Trigger>\n <Portal>\n <TooltipContent sideOffset={3} {...rest}>\n {content}\n </TooltipContent>\n </Portal>\n </Root>\n );\n};\n\nexport {\n Tooltip,\n TooltipContent,\n Provider as TooltipProvider,\n Root as TooltipRoot,\n Trigger as TooltipTrigger,\n type TooltipProps,\n};\n"],"mappings":";;;;;AAqBA,MAAMO,iBAAiBD,4BAGpB,EAAEE,UAAUC,WAAW,GAAGC,SAASC,QAAQ;AAC5C,QACE,oBAAC,SAAD;EACOA;EACL,GAAID;EACJ,WAAWV,GAET,2CAEA,2GAEA,yBAEA,uEACA,6EAEA,gDACA,gDACA,gDACA,gDACAS,UACD;EAEAD;EACO,CAAA;EAEZ;AAEF,MAAMI,WAAmC,EACvCC,SACAL,UACAM,iBAAiB,OACjBC,gBAAgB,GAChB,GAAGL,YACC;CACJ,MAAM,EAAEM,MAAMC,aAAaC,cAAc,GAAGC,SAAST;AAErD,QACE,qBAAC,MAAD;EACeO;EACEF;EACDG;EACRF;YAJR,CAME,oBAAC,SAAD;GACE,SAASF;GACT,MAAMA,iBAAiBM,KAAAA,IAAY;GAElCZ;GACM,CAAA,EACT,oBAAC,QAAD,EAAA,UACE,oBAAC,gBAAD;GAAgB,YAAY;GAAG,GAAIW;aAChCN;GACa,CAAA,EACV,CAAA,CACH"}

package/dist/ui/components/types.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import { C as SelectProps, S as SelectOption, b as RadioGroupProps, v as IdAutocompleteOption, x as SelectBaseProps, y as IdAutocompleteProps } from "../../index-CuSjRT5A.js";
+import { C as SelectProps, S as SelectOption, b as RadioGroupProps, v as IdAutocompleteOption, x as SelectBaseProps, y as IdAutocompleteProps } from "../../index-B6YyDoT1.js";
 export { IdAutocompleteOption, IdAutocompleteProps, RadioGroupProps, SelectBaseProps, SelectOption, SelectProps };

package/dist/ui/components/value-transformer/value-transformer.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import { t as ValueTransformer } from "../../../value-transformer-BDrKuBqy.js";
+import { t as ValueTransformer } from "../../../value-transformer-2yvrA5Rp.js";
 export { ValueTransformer };

package/dist/ui/components/value-transformer/value-transformer.js CHANGED Viewed

@@ -62,7 +62,7 @@ function ValueTransformer({ transformers, children }) {
 		if (!deepEqual(transformedValue, value)) if (typeof setValue === "function") setValue(children.props.name, transformedValue);
 		else children.props.onChange?.({ target: { value: transformedValue } });
 	}, [transformers, setValue]);
-	return React.cloneElement(children, {
+	return /* @__PURE__ */ React.cloneElement(children, {
 		...children.props,
 		onChange: (event) => {
 			const transformedValue = _applyTransformers(transformers, event.target.value, "change");

package/dist/ui/components/value-transformer/value-transformer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"value-transformer.js","names":[],"sources":["../../../../src/ui/components/value-transformer/value-transformer.tsx"],"sourcesContent":["import type {\n TransformerTrigger,\n TransformerType,\n ValueTransformerProps,\n} from \"#design-system\";\nimport { deepEqual } from \"#design-system/ui/lib\";\nimport React, { useEffect } from \"react\";\nimport { useFormContext } from \"react-hook-form\";\n\n// Workaround to set the value of an input element\n// following react core team recommendation\n// https://github.com/facebook/react/issues/10135\nfunction setNativeValue(element: HTMLInputElement, value: any) {\n const valueSetter = Object.getOwnPropertyDescriptor(element, \"value\")?.set;\n const prototype = Object.getPrototypeOf(element) as HTMLInputElement;\n const prototypeValueSetter = Object.getOwnPropertyDescriptor(\n prototype,\n \"value\",\n )?.set;\n\n if (valueSetter && valueSetter !== prototypeValueSetter) {\n prototypeValueSetter?.call(element, value);\n } else {\n valueSetter?.call(element, value);\n }\n}\n\n// apply transformers to the value\nfunction _applyTransformers(\n transformers: TransformerType,\n value: unknown,\n filter: TransformerTrigger \| \"all\" = \"blur\",\n) {\n return transformers.reduce<unknown>((value, transformer) => {\n if (typeof transformer === \"function\") {\n if (filter === \"blur\" \|\| filter === \"all\") {\n // array of transformers are only applied on blur\n return transformer(value);\n }\n return value;\n }\n\n // it is a transformer object\n if (\n (transformer.options?.trigger ?? \"blur\") !== filter &&\n filter !== \"all\"\n ) {\n return value;\n }\n // if no set, we assume true\n if (transformer.options?.if === undefined \|\| transformer.options.if) {\n return transformer.transformer(value);\n }\n return value;\n }, value);\n}\n\n/*\n Apply transformers to the value of the input element. A transformer is a function that\n * will be applied to the value of the input element modifying the value.\n \n @param transformers - An array of transformers. A transformer is an object with a\n * `transformer` property, which is a function that will be applied to the value of\n * the input element, and an optional `options` property. The `options` property can\n * have a `trigger` property, which is the event that triggers the transformer, and\n * an `if` property, which is a boolean that indicates if the transformer should be\n * applied.\n * @param children - The input element to apply the transformers to as children\n \n @example\n * <ValueTransformer transformers={[\n * {\n * transformer: (value) => value.toUpperCase(),\n * options: {\n * trigger: \"change\",\n * },\n * },\n * ]}>\n * <Input />\n * </ValueTransformer>\n \n @example\n * <ValueTransformer transformers={[\n * {\n * // trim the value on blur\n * transformer: (value) => (value as string).trim(),\n * },\n * ]}>\n * <Input />\n * </ValueTransformer>\n */\nexport function ValueTransformer({\n transformers,\n children,\n}: ValueTransformerProps) {\n const formContext = useFormContext();\n const setValue = formContext?.setValue;\n\n useEffect(() => {\n // apply all the transformers on mount to prevent untransformed values\n // if the field is not touched by the user\n const value = (children.props as { value: unknown }).value;\n const transformedValue = _applyTransformers(transformers, value, \"all\");\n\n if (!deepEqual(transformedValue, value)) {\n if (typeof setValue === \"function\") {\n setValue((children.props as { name: string }).name, transformedValue);\n } else {\n // if setValue is not available, then we're not inside a form context\n // so we need to update the value using onChange if available\n (children.props as React.HTMLAttributes<HTMLInputElement>).onChange?.({\n target: { value: transformedValue },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n }\n }, [transformers, setValue]);\n\n return React.cloneElement(children, {\n // @ts-expect-error - React.HTMLAttributes is not typed\n ...children.props,\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => {\n // apply transformers on change\n const transformedValue = _applyTransformers(\n transformers,\n event.target.value,\n \"change\",\n );\n\n if (transformedValue !== event.target.value && setValue) {\n setValue((children.props as { name: string }).name, transformedValue);\n setNativeValue(event.target, transformedValue);\n }\n\n // call the original onChange\n (children.props as React.HTMLAttributes<HTMLInputElement>).onChange?.(\n event,\n );\n },\n // apply transformers on blur\n onBlur: (event: React.FocusEvent<HTMLInputElement>) => {\n // call the original onBlur\n (children.props as React.HTMLAttributes<HTMLInputElement>).onBlur?.(\n event,\n );\n\n // apply the transformers\n const target = event.target;\n const transformedValue = _applyTransformers(\n transformers,\n target.value,\n \"blur\",\n );\n\n if (!deepEqual(transformedValue, target.value)) {\n // only dispatch change if the value has changed\n setNativeValue(target, transformedValue);\n const changeEvent = new Event(\"change\", { bubbles: true });\n target.dispatchEvent(changeEvent);\n }\n },\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n // call the original onKeyDown\n (children.props as React.HTMLAttributes<HTMLInputElement>).onKeyDown?.(\n event,\n );\n\n // apply the transformers\n if (event.key === \"Enter\") {\n const target = event.target as HTMLInputElement;\n const transformedValue = _applyTransformers(\n transformers,\n target.value,\n \"keyDown\",\n );\n\n // only dispatch change if the value has changed\n if (!deepEqual(transformedValue, target.value)) {\n setNativeValue(target, transformedValue);\n const changeEvent = new Event(\"change\", { bubbles: true });\n target.dispatchEvent(changeEvent);\n }\n }\n },\n });\n}\n"],"mappings":";;;;AAYA,~~SAAS~~,~~eAAe~~,~~SAA2B~~,OAAY;CAC7D,~~MAAM~~,~~cAAc~~,~~OAAO~~,~~yBAAyB~~,SAAS,QAAQ,~~EAAE~~;CACvE,~~MAAM~~,~~YAAY~~,~~OAAO~~,~~eAAe~~,~~QAAQ~~;~~CAChD~~,~~MAAM~~,~~uBAAuB~~,~~OAAO~~,~~yBAClC~~,WACA,QACD,~~EAAE~~;AAEH,~~KAAI~~,~~eAAe~~,~~gBAAgB~~,~~qBACjC~~,~~uBAAsB~~,~~KAAK~~,~~SAAS~~,MAAM;~~KAE1C~~,~~cAAa~~,~~KAAK~~,~~SAAS~~,MAAM;;AAKrC,~~SAAS~~,~~mBACP~~,~~cACA~~,~~OACA~~,SAAqC,QACrC;AACA,~~QAAO~~,~~aAAa~~,~~QAAiB~~,~~OAAO~~,gBAAgB;AAC1D,MAAI,~~OAAO~~,gBAAgB,YAAY;AACrC,~~OAAI~~,WAAW,~~UAAU~~,WAAW,MAElC,~~QAAO~~,~~YAAY~~,MAAM;AAE3B,~~UAAO~~;;AAIT,~~OACG~~,~~YAAY~~,~~SAAS~~,WAAW,~~YAAY~~,~~UAC7C~~,WAAW,MAEX,~~QAAO~~;AAGT,~~MAAI~~,~~YAAY~~,~~SAAS~~,~~OAAO~~,~~KAAA~~,~~KAAa~~,~~YAAY~~,~~QAAQ~~,GAC/D,~~QAAO~~,~~YAAY~~,~~YAAY~~,MAAM;AAEvC,~~SAAO~~;~~IACN~~,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCX,~~SAAgB~~,iBAAiB,EAC/B,~~cACA~~,YACwB;CAExB,~~MAAM~~,~~WADc~~,gBAAgB,~~EACN~~;~~AAE9B~~,iBAAgB;EAGd,~~MAAM~~,~~QAAS~~,~~SAAS~~,~~MAA6B~~;EACrD,~~MAAM~~,~~mBAAmB~~,~~mBAAmB~~,~~cAAc~~,OAAO,MAAM;AAEvE,MAAI,~~CAAC~~,~~UAAU~~,~~kBAAkB~~,MAAM,CACrC,KAAI,~~OAAO~~,aAAa,~~WACtB~~,~~UAAU~~,~~SAAS~~,~~MAA2B~~,~~MAAM~~,iBAAiB;~~MAIpE~~,~~UAAS~~,~~MAAiD~~,WAAW,~~EACpE~~,QAAQ,~~EAAE~~,~~OAAO~~,~~kBAAkB~~,~~EACpC~~,~~CAAwC~~;IAG5C,~~CAAC~~,~~cAAc~~,SAAS,CAAC;AAE5B,~~QAAO~~,~~MAAM~~,~~aAAa~~,UAAU;EAElC,~~GAAG~~,~~SAAS~~;~~EACZ~~,~~WAAW~~,UAA+C;GAExD,~~MAAM~~,~~mBAAmB~~,~~mBACvB~~,~~cACA~~,~~MAAM~~,~~OAAO~~,OACb,SACD;AAED,~~OAAI~~,~~qBAAqB~~,~~MAAM~~,~~OAAO~~,~~SAAS~~,UAAU;~~AACvD~~,~~aAAU~~,~~SAAS~~,~~MAA2B~~,~~MAAM~~,iBAAiB;~~AACrE~~,~~mBAAe~~,~~MAAM~~,~~QAAQ~~,iBAAiB;;AAI/C,~~YAAS~~,~~MAAiD~~,~~WACzD~~,MACD;;~~EAGH~~,~~SAAS~~,UAA8C;~~AAEpD~~,~~YAAS~~,~~MAAiD~~,~~SACzD~~,MACD;GAGD,~~MAAM~~,~~SAAS~~,~~MAAM~~;GACrB,~~MAAM~~,~~mBAAmB~~,~~mBACvB~~,~~cACA~~,~~OAAO~~,OACP,OACD;AAED,OAAI,~~CAAC~~,~~UAAU~~,~~kBAAkB~~,~~OAAO~~,MAAM,EAAE;~~AAE9C~~,~~mBAAe~~,~~QAAQ~~,iBAAiB;IACxC,~~MAAM~~,cAAc,~~IAAI~~,MAAM,UAAU,~~EAAE~~,SAAS,MAAM,CAAC;~~AAC1D~~,~~WAAO~~,~~cAAc~~,YAAY;;;~~EAGrC~~,~~YAAY~~,UAAiD;~~AAE1D~~,~~YAAS~~,~~MAAiD~~,~~YACzD~~,MACD;AAGD,~~OAAI~~,~~MAAM~~,QAAQ,SAAS;IACzB,~~MAAM~~,~~SAAS~~,~~MAAM~~;IACrB,~~MAAM~~,~~mBAAmB~~,~~mBACvB~~,~~cACA~~,~~OAAO~~,OACP,UACD;AAGD,QAAI,~~CAAC~~,~~UAAU~~,~~kBAAkB~~,~~OAAO~~,MAAM,EAAE;~~AAC9C~~,~~oBAAe~~,~~QAAQ~~,iBAAiB;KACxC,~~MAAM~~,cAAc,~~IAAI~~,MAAM,UAAU,~~EAAE~~,SAAS,MAAM,CAAC;~~AAC1D~~,~~YAAO~~,~~cAAc~~,YAAY;;;;EAIxC,CAAC"}
1	+ {"version":3,"file":"value-transformer.js","names":["deepEqual","React","useEffect","useFormContext","setNativeValue","element","value","valueSetter","Object","getOwnPropertyDescriptor","set","prototype","getPrototypeOf","prototypeValueSetter","call","_applyTransformers","transformers","filter","reduce","transformer","options","trigger","if","undefined","ValueTransformer","children","formContext","setValue","props","transformedValue","name","onChange","target","cloneElement","event","onBlur","changeEvent","Event","bubbles","dispatchEvent","onKeyDown","key"],"sources":["../../../../src/ui/components/value-transformer/value-transformer.tsx"],"sourcesContent":["import type {\n TransformerTrigger,\n TransformerType,\n ValueTransformerProps,\n} from \"#design-system\";\nimport { deepEqual } from \"#design-system/ui/lib\";\nimport React, { useEffect } from \"react\";\nimport { useFormContext } from \"react-hook-form\";\n\n// Workaround to set the value of an input element\n// following react core team recommendation\n// https://github.com/facebook/react/issues/10135\nfunction setNativeValue(element: HTMLInputElement, value: any) {\n const valueSetter = Object.getOwnPropertyDescriptor(element, \"value\")?.set;\n const prototype = Object.getPrototypeOf(element) as HTMLInputElement;\n const prototypeValueSetter = Object.getOwnPropertyDescriptor(\n prototype,\n \"value\",\n )?.set;\n\n if (valueSetter && valueSetter !== prototypeValueSetter) {\n prototypeValueSetter?.call(element, value);\n } else {\n valueSetter?.call(element, value);\n }\n}\n\n// apply transformers to the value\nfunction _applyTransformers(\n transformers: TransformerType,\n value: unknown,\n filter: TransformerTrigger \| \"all\" = \"blur\",\n) {\n return transformers.reduce<unknown>((value, transformer) => {\n if (typeof transformer === \"function\") {\n if (filter === \"blur\" \|\| filter === \"all\") {\n // array of transformers are only applied on blur\n return transformer(value);\n }\n return value;\n }\n\n // it is a transformer object\n if (\n (transformer.options?.trigger ?? \"blur\") !== filter &&\n filter !== \"all\"\n ) {\n return value;\n }\n // if no set, we assume true\n if (transformer.options?.if === undefined \|\| transformer.options.if) {\n return transformer.transformer(value);\n }\n return value;\n }, value);\n}\n\n/*\n Apply transformers to the value of the input element. A transformer is a function that\n * will be applied to the value of the input element modifying the value.\n \n @param transformers - An array of transformers. A transformer is an object with a\n * `transformer` property, which is a function that will be applied to the value of\n * the input element, and an optional `options` property. The `options` property can\n * have a `trigger` property, which is the event that triggers the transformer, and\n * an `if` property, which is a boolean that indicates if the transformer should be\n * applied.\n * @param children - The input element to apply the transformers to as children\n \n @example\n * <ValueTransformer transformers={[\n * {\n * transformer: (value) => value.toUpperCase(),\n * options: {\n * trigger: \"change\",\n * },\n * },\n * ]}>\n * <Input />\n * </ValueTransformer>\n \n @example\n * <ValueTransformer transformers={[\n * {\n * // trim the value on blur\n * transformer: (value) => (value as string).trim(),\n * },\n * ]}>\n * <Input />\n * </ValueTransformer>\n */\nexport function ValueTransformer({\n transformers,\n children,\n}: ValueTransformerProps) {\n const formContext = useFormContext();\n const setValue = formContext?.setValue;\n\n useEffect(() => {\n // apply all the transformers on mount to prevent untransformed values\n // if the field is not touched by the user\n const value = (children.props as { value: unknown }).value;\n const transformedValue = _applyTransformers(transformers, value, \"all\");\n\n if (!deepEqual(transformedValue, value)) {\n if (typeof setValue === \"function\") {\n setValue((children.props as { name: string }).name, transformedValue);\n } else {\n // if setValue is not available, then we're not inside a form context\n // so we need to update the value using onChange if available\n (children.props as React.HTMLAttributes<HTMLInputElement>).onChange?.({\n target: { value: transformedValue },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n }\n }, [transformers, setValue]);\n\n return React.cloneElement(children, {\n // @ts-expect-error - React.HTMLAttributes is not typed\n ...children.props,\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => {\n // apply transformers on change\n const transformedValue = _applyTransformers(\n transformers,\n event.target.value,\n \"change\",\n );\n\n if (transformedValue !== event.target.value && setValue) {\n setValue((children.props as { name: string }).name, transformedValue);\n setNativeValue(event.target, transformedValue);\n }\n\n // call the original onChange\n (children.props as React.HTMLAttributes<HTMLInputElement>).onChange?.(\n event,\n );\n },\n // apply transformers on blur\n onBlur: (event: React.FocusEvent<HTMLInputElement>) => {\n // call the original onBlur\n (children.props as React.HTMLAttributes<HTMLInputElement>).onBlur?.(\n event,\n );\n\n // apply the transformers\n const target = event.target;\n const transformedValue = _applyTransformers(\n transformers,\n target.value,\n \"blur\",\n );\n\n if (!deepEqual(transformedValue, target.value)) {\n // only dispatch change if the value has changed\n setNativeValue(target, transformedValue);\n const changeEvent = new Event(\"change\", { bubbles: true });\n target.dispatchEvent(changeEvent);\n }\n },\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n // call the original onKeyDown\n (children.props as React.HTMLAttributes<HTMLInputElement>).onKeyDown?.(\n event,\n );\n\n // apply the transformers\n if (event.key === \"Enter\") {\n const target = event.target as HTMLInputElement;\n const transformedValue = _applyTransformers(\n transformers,\n target.value,\n \"keyDown\",\n );\n\n // only dispatch change if the value has changed\n if (!deepEqual(transformedValue, target.value)) {\n setNativeValue(target, transformedValue);\n const changeEvent = new Event(\"change\", { bubbles: true });\n target.dispatchEvent(changeEvent);\n }\n }\n },\n });\n}\n"],"mappings":";;;;AAYA,SAASI,eAAeC,SAA2BC,OAAY;CAC7D,MAAMC,cAAcC,OAAOC,yBAAyBJ,SAAS,QAAQ,EAAEK;CACvE,MAAMC,YAAYH,OAAOI,eAAeP,QAA4B;CACpE,MAAMQ,uBAAuBL,OAAOC,yBAClCE,WACA,QACD,EAAED;AAEH,KAAIH,eAAeA,gBAAgBM,qBACjCA,uBAAsBC,KAAKT,SAASC,MAAM;KAE1CC,cAAaO,KAAKT,SAASC,MAAM;;AAKrC,SAASS,mBACPC,cACAV,OACAW,SAAqC,QACrC;AACA,QAAOD,aAAaE,QAAiBZ,OAAOa,gBAAgB;AAC1D,MAAI,OAAOA,gBAAgB,YAAY;AACrC,OAAIF,WAAW,UAAUA,WAAW,MAElC,QAAOE,YAAYb,MAAM;AAE3B,UAAOA;;AAIT,OACGa,YAAYC,SAASC,WAAW,YAAYJ,UAC7CA,WAAW,MAEX,QAAOX;AAGT,MAAIa,YAAYC,SAASE,OAAOC,KAAAA,KAAaJ,YAAYC,QAAQE,GAC/D,QAAOH,YAAYA,YAAYb,MAAM;AAEvC,SAAOA;IACNA,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCX,SAAgBkB,iBAAiB,EAC/BR,cACAS,YACwB;CAExB,MAAME,WADcxB,gBAAgB,EACNwB;AAE9BzB,iBAAgB;EAGd,MAAMI,QAASmB,SAASG,MAA6BtB;EACrD,MAAMuB,mBAAmBd,mBAAmBC,cAAcV,OAAO,MAAM;AAEvE,MAAI,CAACN,UAAU6B,kBAAkBvB,MAAM,CACrC,KAAI,OAAOqB,aAAa,WACtBA,UAAUF,SAASG,MAA2BE,MAAMD,iBAAiB;MAIpEJ,UAASG,MAAiDG,WAAW,EACpEC,QAAQ,EAAE1B,OAAOuB,kBAAiB,EACI,CAAC;IAG5C,CAACb,cAAcW,SAAS,CAAC;AAE5B,QAAO1B,sBAAMgC,aAAaR,UAAU;EAElC,GAAGA,SAASG;EACZG,WAAWG,UAA+C;GAExD,MAAML,mBAAmBd,mBACvBC,cACAkB,MAAMF,OAAO1B,OACb,SACD;AAED,OAAIuB,qBAAqBK,MAAMF,OAAO1B,SAASqB,UAAU;AACvDA,aAAUF,SAASG,MAA2BE,MAAMD,iBAAiB;AACrEzB,mBAAe8B,MAAMF,QAAQH,iBAAiB;;AAI/CJ,YAASG,MAAiDG,WACzDG,MACD;;EAGHC,SAASD,UAA8C;AAEpDT,YAASG,MAAiDO,SACzDD,MACD;GAGD,MAAMF,SAASE,MAAMF;GACrB,MAAMH,mBAAmBd,mBACvBC,cACAgB,OAAO1B,OACP,OACD;AAED,OAAI,CAACN,UAAU6B,kBAAkBG,OAAO1B,MAAM,EAAE;AAE9CF,mBAAe4B,QAAQH,iBAAiB;IACxC,MAAMO,cAAc,IAAIC,MAAM,UAAU,EAAEC,SAAS,MAAM,CAAC;AAC1DN,WAAOO,cAAcH,YAAY;;;EAGrCI,YAAYN,UAAiD;AAE1DT,YAASG,MAAiDY,YACzDN,MACD;AAGD,OAAIA,MAAMO,QAAQ,SAAS;IACzB,MAAMT,SAASE,MAAMF;IACrB,MAAMH,mBAAmBd,mBACvBC,cACAgB,OAAO1B,OACP,UACD;AAGD,QAAI,CAACN,UAAU6B,kBAAkBG,OAAO1B,MAAM,EAAE;AAC9CF,oBAAe4B,QAAQH,iBAAiB;KACxC,MAAMO,cAAc,IAAIC,MAAM,UAAU,EAAEC,SAAS,MAAM,CAAC;AAC1DN,YAAOO,cAAcH,YAAY;;;;EAIxC,CAAC"}

package/dist/ui/components/with-field-validation/with-field-validation.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import { n as withFieldValidation, t as ValidationOptions } from "../../../with-field-validation-DQwlMTzr.js";
+import { n as withFieldValidation, t as ValidationOptions } from "../../../with-field-validation-YcGrdIrv.js";
 export { ValidationOptions, withFieldValidation };

package/dist/ui/components/with-field-validation/with-field-validation.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { jsx } from "react/jsx-runtime";
 import { Controller, useFormContext, useFormState } from "react-hook-form";
 //#region src/ui/components/with-field-validation/with-field-validation.tsx
 const withFieldValidation = (Component, options) => {
-	return forwardRef(({ value, name, showErrorOnBlur, showErrorOnChange, validators: customValidators, ...props }, ref) => {
+	return /* @__PURE__ */ forwardRef(({ value, name, showErrorOnBlur, showErrorOnChange, validators: customValidators, ...props }, ref) => {
 		const { onChange: onChangeProp, onBlur: onBlurProp } = props;
 		const { control, formState: { errors: formErrors, defaultValues }, trigger, setValue, getValues } = useFormContext();
 		const { submitCount } = useFormState();

package/dist/ui/components/with-field-validation/with-field-validation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"with-field-validation.js","names":[],"sources":["../../../../src/ui/components/with-field-validation/with-field-validation.tsx"],"sourcesContent":["import type {\n ChangeEvent,\n ComponentType,\n ElementRef,\n FocusEvent,\n ForwardRefExoticComponent,\n PropsWithoutRef,\n RefAttributes,\n} from \"react\";\nimport { forwardRef, useCallback, useEffect, useState } from \"react\";\nimport { Controller, useFormContext, useFormState } from \"react-hook-form\";\nimport type {\n FieldErrorHandling,\n InputBaseProps,\n ValidatorHandler,\n} from \"../../types.js\";\n\ninterface PossibleProps extends InputBaseProps<unknown>, FieldErrorHandling {\n pattern?: RegExp;\n maxLength?: number;\n minLength?: number;\n minValue?: number;\n maxValue?: number;\n}\n\ninterface PossibleEventsProps {\n onChange?: (event: ChangeEvent<unknown>) => unknown;\n onBlur?: (event: FocusEvent<unknown>) => unknown;\n}\n\nexport interface ValidationOptions<T> {\n validations?: Record<string, (parentProps: T) => ValidatorHandler>;\n transformValue?: (value: any) => any;\n}\n\nexport const withFieldValidation = <\n T extends PossibleProps,\n R extends ElementRef<any> = ElementRef<any>,\n>(\n Component: ComponentType<T>,\n options?: ValidationOptions<T>,\n): ForwardRefExoticComponent<PropsWithoutRef<T> & RefAttributes<R>> => {\n return forwardRef<R, T>(\n (\n {\n value,\n name,\n showErrorOnBlur,\n showErrorOnChange,\n validators: customValidators,\n ...props\n },\n ref,\n ) => {\n const { onChange: onChangeProp, onBlur: onBlurProp } =\n props as PossibleEventsProps;\n const {\n control,\n formState: { errors: formErrors, defaultValues },\n trigger,\n setValue,\n getValues,\n } = useFormContext();\n const { submitCount } = useFormState();\n\n if (!name) {\n throw new Error(\n `[Field: ${Component.displayName}] The name prop is required.`,\n );\n }\n\n const errors = [\n ...(formErrors[name]?.types\n ? (Object.values(formErrors[name].types ?? []) as string[])\n : []),\n ];\n if (errors.length === 0 && !!formErrors[name]) {\n // the field is invalid but no error message was provided\n errors.push(\"Invalid value\");\n }\n\n useEffect(() => {\n if (submitCount > 0) {\n void trigger(name);\n }\n // we should trigger a re-validation after the form is submitted, the errors are shown\n // and the required prop is changed. Other deps can not be added, otherwise a revalidation\n // will be triggered unnecessarily\n }, [props.required]);\n\n useEffect(() => {\n // if custom errors are provided, then we need to trigger the validation\n // otherwise the errors will not be shown till the form is submitted\n if (props.errors && props.errors.length > 0) {\n void trigger(name);\n }\n }, [name, props.errors, trigger]);\n\n const [initialized, setInitialized] = useState(false);\n useEffect(() => {\n if (initialized) {\n setValue(name, value);\n }\n setInitialized(true);\n // initialized can not be in the dependencies because it would cause\n // a change of the value on initial render\n }, [name, value]);\n\n if (value !== undefined && !onChangeProp) {\n console.warn(\n `[Field: ${name}] Value prop provided without onChange so it will be ignored. Use disabled/readOnly if you want to prevent changes.`,\n );\n }\n\n return (\n <Controller\n control={control}\n name={name}\n defaultValue={(value ?? props.defaultValue) as unknown}\n disabled={props.disabled}\n render={({\n field: {\n // just preventing that onChange is included in the rest of the props\n onChange: _,\n onBlur: onBlurController,\n value: internalValue,\n ...rest\n },\n }) => {\n // ignore eslint that flags an error here:\n // React Hook \"useCallback\" cannot be called inside a callback.\n // React Hooks must be called in a React function component or a custom React Hook function.\n\n const onBlurCallback = useCallback(\n (event: FocusEvent<HTMLInputElement>) => {\n if (showErrorOnBlur) {\n void trigger(name);\n } else {\n onBlurController(); // default behavior\n }\n\n // trigger parent onBlur\n if (onBlurProp) {\n onBlurProp(event);\n }\n },\n [onBlurController, showErrorOnBlur],\n );\n\n // ignore eslint that flags an error here:\n // React Hook \"useCallback\" cannot be called inside a callback.\n // React Hooks must be called in a React function component or a custom React Hook function.\n\n const onChangeCallback = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n // update value state\n if (onChangeProp) {\n if (Object.hasOwn(event, \"target\")) {\n // it is probably an actual event\n setValue(name, event.target.value);\n } else {\n // it is a custom onChange and it pass the value directly\n setValue(name, event);\n }\n\n // the fields is controlled by the parent\n onChangeProp(event);\n } else {\n // sometimes the onChange is overridden by the parent and use the new value as parameter instead of event\n let value: unknown = event;\n if (\n event instanceof Event \|\|\n event.target instanceof HTMLElement\n ) {\n value = event.target.value;\n }\n setValue(name, value); // default behavior\n }\n\n // now let's validate the field\n if (\n showErrorOnChange === undefined &&\n showErrorOnBlur === undefined\n ) {\n // use form validation mode...\n // if previously validated, then validate on change\n if (submitCount > 0) {\n void trigger(name);\n }\n } else {\n // default validation behavior was overridden\n if (showErrorOnChange) {\n void trigger(name);\n }\n }\n },\n // `internalValue` is the value of the field that is controlled by the form\n // it is used to trigger the validation on change, so we need to add it to the dependencies\n // otherwise the validation will not be triggered on change\n [internalValue, showErrorOnChange, showErrorOnBlur, submitCount],\n );\n\n // extract ref from rest\n const { ref: formFieldRef } = rest;\n\n // create a combined ref\n const combinedRef = (element: R) => {\n // apply external ref if exists\n if (typeof ref === \"function\") {\n ref(element);\n } else if (ref) {\n ref.current = element;\n }\n // apply field ref\n formFieldRef(element);\n };\n\n return (\n <Component\n {...(props as unknown as T)}\n {...rest}\n value={internalValue as unknown}\n onBlur={onBlurCallback}\n onChange={onChangeCallback}\n errors={errors}\n ref={combinedRef}\n />\n );\n }}\n rules={{\n ...(props.required\n ? {\n required: {\n value: props.required,\n message: \"This field is required\",\n },\n }\n : {\n required: undefined,\n }),\n ...(props.pattern && {\n pattern: {\n value: new RegExp(props.pattern),\n message: \"This field does not match the required pattern\",\n },\n }),\n ...(props.maxLength !== undefined && props.maxLength >= 0\n ? {\n maxLength: {\n value: props.maxLength,\n message: `This field must be at most ${props.maxLength} characters`,\n },\n }\n : {\n maxLength: undefined,\n }),\n ...(props.minLength !== undefined && props.minLength >= 0\n ? {\n minLength: {\n value: props.minLength,\n message: `This field must be at least ${props.minLength} characters`,\n },\n }\n : {\n minLength: undefined,\n }),\n ...(props.minValue && {\n min: {\n value: props.minValue,\n message: `This field must be greater than or equal to ${props.minValue}`,\n },\n }),\n ...(props.maxValue && {\n max: {\n value: props.maxValue,\n message: `This field must be less than or equal to ${props.maxValue}`,\n },\n }),\n validate: {\n // custom errors provided as props\n ...(props.errors\n ? Object.fromEntries(\n Array.isArray(props.errors)\n ? props.errors.map((error, index) => [\n `_propError${index}`,\n () => error,\n ])\n : [],\n )\n : {}),\n // built in validations by the field in the library\n ...(options?.validations\n ? Object.fromEntries(\n Object.entries(options.validations).map(\n ([key, validatorFactory]) => {\n const propsWithValues = {\n value: getValues(name) as unknown, // get the actual value of the field in the form\n name,\n showErrorOnBlur,\n showErrorOnChange,\n ...props,\n };\n return [\n key,\n validatorFactory(propsWithValues as unknown as T),\n ];\n },\n ),\n )\n : {}),\n // custom validations by the user/developer\n ...(customValidators !== undefined\n ? Object.fromEntries(\n (Array.isArray(customValidators)\n ? customValidators\n : [customValidators]\n ).map((validator, index) => [\n `customValidation${index}`,\n validator,\n ]),\n )\n : {}),\n },\n }}\n />\n );\n },\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"with-field-validation.js","names":["forwardRef","useCallback","useEffect","useState","Controller","useFormContext","useFormState","withFieldValidation","Component","options","value","name","showErrorOnBlur","showErrorOnChange","validators","customValidators","props","ref","onChange","onChangeProp","onBlur","onBlurProp","control","formState","errors","formErrors","defaultValues","trigger","setValue","getValues","submitCount","Error","displayName","types","Object","values","length","push","required","initialized","setInitialized","undefined","console","warn","defaultValue","disabled","field","_","onBlurController","internalValue","rest","onBlurCallback","event","onChangeCallback","hasOwn","target","Event","HTMLElement","formFieldRef","combinedRef","element","current","message","pattern","RegExp","maxLength","minLength","minValue","min","maxValue","max","validate","fromEntries","Array","isArray","map","error","index","validations","entries","key","validatorFactory","propsWithValues","validator"],"sources":["../../../../src/ui/components/with-field-validation/with-field-validation.tsx"],"sourcesContent":["import type {\n ChangeEvent,\n ComponentType,\n ElementRef,\n FocusEvent,\n ForwardRefExoticComponent,\n PropsWithoutRef,\n RefAttributes,\n} from \"react\";\nimport { forwardRef, useCallback, useEffect, useState } from \"react\";\nimport { Controller, useFormContext, useFormState } from \"react-hook-form\";\nimport type {\n FieldErrorHandling,\n InputBaseProps,\n ValidatorHandler,\n} from \"../../types.js\";\n\ninterface PossibleProps extends InputBaseProps<unknown>, FieldErrorHandling {\n pattern?: RegExp;\n maxLength?: number;\n minLength?: number;\n minValue?: number;\n maxValue?: number;\n}\n\ninterface PossibleEventsProps {\n onChange?: (event: ChangeEvent<unknown>) => unknown;\n onBlur?: (event: FocusEvent<unknown>) => unknown;\n}\n\nexport interface ValidationOptions<T> {\n validations?: Record<string, (parentProps: T) => ValidatorHandler>;\n transformValue?: (value: any) => any;\n}\n\nexport const withFieldValidation = <\n T extends PossibleProps,\n R extends ElementRef<any> = ElementRef<any>,\n>(\n Component: ComponentType<T>,\n options?: ValidationOptions<T>,\n): ForwardRefExoticComponent<PropsWithoutRef<T> & RefAttributes<R>> => {\n return forwardRef<R, T>(\n (\n {\n value,\n name,\n showErrorOnBlur,\n showErrorOnChange,\n validators: customValidators,\n ...props\n },\n ref,\n ) => {\n const { onChange: onChangeProp, onBlur: onBlurProp } =\n props as PossibleEventsProps;\n const {\n control,\n formState: { errors: formErrors, defaultValues },\n trigger,\n setValue,\n getValues,\n } = useFormContext();\n const { submitCount } = useFormState();\n\n if (!name) {\n throw new Error(\n `[Field: ${Component.displayName}] The name prop is required.`,\n );\n }\n\n const errors = [\n ...(formErrors[name]?.types\n ? (Object.values(formErrors[name].types ?? []) as string[])\n : []),\n ];\n if (errors.length === 0 && !!formErrors[name]) {\n // the field is invalid but no error message was provided\n errors.push(\"Invalid value\");\n }\n\n useEffect(() => {\n if (submitCount > 0) {\n void trigger(name);\n }\n // we should trigger a re-validation after the form is submitted, the errors are shown\n // and the required prop is changed. Other deps can not be added, otherwise a revalidation\n // will be triggered unnecessarily\n }, [props.required]);\n\n useEffect(() => {\n // if custom errors are provided, then we need to trigger the validation\n // otherwise the errors will not be shown till the form is submitted\n if (props.errors && props.errors.length > 0) {\n void trigger(name);\n }\n }, [name, props.errors, trigger]);\n\n const [initialized, setInitialized] = useState(false);\n useEffect(() => {\n if (initialized) {\n setValue(name, value);\n }\n setInitialized(true);\n // initialized can not be in the dependencies because it would cause\n // a change of the value on initial render\n }, [name, value]);\n\n if (value !== undefined && !onChangeProp) {\n console.warn(\n `[Field: ${name}] Value prop provided without onChange so it will be ignored. Use disabled/readOnly if you want to prevent changes.`,\n );\n }\n\n return (\n <Controller\n control={control}\n name={name}\n defaultValue={(value ?? props.defaultValue) as unknown}\n disabled={props.disabled}\n render={({\n field: {\n // just preventing that onChange is included in the rest of the props\n onChange: _,\n onBlur: onBlurController,\n value: internalValue,\n ...rest\n },\n }) => {\n // ignore eslint that flags an error here:\n // React Hook \"useCallback\" cannot be called inside a callback.\n // React Hooks must be called in a React function component or a custom React Hook function.\n\n const onBlurCallback = useCallback(\n (event: FocusEvent<HTMLInputElement>) => {\n if (showErrorOnBlur) {\n void trigger(name);\n } else {\n onBlurController(); // default behavior\n }\n\n // trigger parent onBlur\n if (onBlurProp) {\n onBlurProp(event);\n }\n },\n [onBlurController, showErrorOnBlur],\n );\n\n // ignore eslint that flags an error here:\n // React Hook \"useCallback\" cannot be called inside a callback.\n // React Hooks must be called in a React function component or a custom React Hook function.\n\n const onChangeCallback = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n // update value state\n if (onChangeProp) {\n if (Object.hasOwn(event, \"target\")) {\n // it is probably an actual event\n setValue(name, event.target.value);\n } else {\n // it is a custom onChange and it pass the value directly\n setValue(name, event);\n }\n\n // the fields is controlled by the parent\n onChangeProp(event);\n } else {\n // sometimes the onChange is overridden by the parent and use the new value as parameter instead of event\n let value: unknown = event;\n if (\n event instanceof Event \|\|\n event.target instanceof HTMLElement\n ) {\n value = event.target.value;\n }\n setValue(name, value); // default behavior\n }\n\n // now let's validate the field\n if (\n showErrorOnChange === undefined &&\n showErrorOnBlur === undefined\n ) {\n // use form validation mode...\n // if previously validated, then validate on change\n if (submitCount > 0) {\n void trigger(name);\n }\n } else {\n // default validation behavior was overridden\n if (showErrorOnChange) {\n void trigger(name);\n }\n }\n },\n // `internalValue` is the value of the field that is controlled by the form\n // it is used to trigger the validation on change, so we need to add it to the dependencies\n // otherwise the validation will not be triggered on change\n [internalValue, showErrorOnChange, showErrorOnBlur, submitCount],\n );\n\n // extract ref from rest\n const { ref: formFieldRef } = rest;\n\n // create a combined ref\n const combinedRef = (element: R) => {\n // apply external ref if exists\n if (typeof ref === \"function\") {\n ref(element);\n } else if (ref) {\n ref.current = element;\n }\n // apply field ref\n formFieldRef(element);\n };\n\n return (\n <Component\n {...(props as unknown as T)}\n {...rest}\n value={internalValue as unknown}\n onBlur={onBlurCallback}\n onChange={onChangeCallback}\n errors={errors}\n ref={combinedRef}\n />\n );\n }}\n rules={{\n ...(props.required\n ? {\n required: {\n value: props.required,\n message: \"This field is required\",\n },\n }\n : {\n required: undefined,\n }),\n ...(props.pattern && {\n pattern: {\n value: new RegExp(props.pattern),\n message: \"This field does not match the required pattern\",\n },\n }),\n ...(props.maxLength !== undefined && props.maxLength >= 0\n ? {\n maxLength: {\n value: props.maxLength,\n message: `This field must be at most ${props.maxLength} characters`,\n },\n }\n : {\n maxLength: undefined,\n }),\n ...(props.minLength !== undefined && props.minLength >= 0\n ? {\n minLength: {\n value: props.minLength,\n message: `This field must be at least ${props.minLength} characters`,\n },\n }\n : {\n minLength: undefined,\n }),\n ...(props.minValue && {\n min: {\n value: props.minValue,\n message: `This field must be greater than or equal to ${props.minValue}`,\n },\n }),\n ...(props.maxValue && {\n max: {\n value: props.maxValue,\n message: `This field must be less than or equal to ${props.maxValue}`,\n },\n }),\n validate: {\n // custom errors provided as props\n ...(props.errors\n ? Object.fromEntries(\n Array.isArray(props.errors)\n ? props.errors.map((error, index) => [\n `_propError${index}`,\n () => error,\n ])\n : [],\n )\n : {}),\n // built in validations by the field in the library\n ...(options?.validations\n ? Object.fromEntries(\n Object.entries(options.validations).map(\n ([key, validatorFactory]) => {\n const propsWithValues = {\n value: getValues(name) as unknown, // get the actual value of the field in the form\n name,\n showErrorOnBlur,\n showErrorOnChange,\n ...props,\n };\n return [\n key,\n validatorFactory(propsWithValues as unknown as T),\n ];\n },\n ),\n )\n : {}),\n // custom validations by the user/developer\n ...(customValidators !== undefined\n ? Object.fromEntries(\n (Array.isArray(customValidators)\n ? customValidators\n : [customValidators]\n ).map((validator, index) => [\n `customValidation${index}`,\n validator,\n ]),\n )\n : {}),\n },\n }}\n />\n );\n },\n );\n};\n"],"mappings":"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"}