@powerhousedao/design-system 6.2.3-dev.7 → 6.2.3-dev.70

package/dist/ui/components/radio-group-field/radio-group-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-group-field.js","names":["twMerge","forwardRef","useId","FormLabel","FormMessageList","withFieldValidation","RadioGroup","Radio","RadioGroupFieldRaw","autoFocus","className","defaultValue","description","disabled","warnings","errors","id","propId","label","name","onChange","options","required","value","props","ref","hasLabel","undefined","hasError","length","prefix","newValue","map","option","index","RadioGroupField","Component","displayName"],"sources":["../../../../src/ui/components/radio-group-field/radio-group-field.tsx"],"sourcesContent":["import { twMerge } from \"tailwind-merge\";\nimport type { HTMLAttributes, Ref } from \"react\";\nimport { forwardRef, useId } from \"react\";\nimport type { FieldErrorHandling, InputBaseProps } from \"../../types.js\";\nimport type { RadioGroupProps } from \"../enum-field/types.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { withFieldValidation } from \"../with-field-validation/with-field-validation.js\";\nimport { RadioGroup } from \"./radio-group.js\";\nimport { Radio } from \"./radio.js\";\ntype RadioGroupFieldBaseProps = Omit<\n  HTMLAttributes<HTMLDivElement>,\n  | keyof InputBaseProps<string>\n  | keyof FieldErrorHandling\n  | keyof RadioGroupProps\n  | \"dir\"\n> & {\n  dir?: \"ltr\" | \"rtl\";\n};\n\nexport type RadioGroupFieldProps = RadioGroupFieldBaseProps &\n  InputBaseProps<string> &\n  FieldErrorHandling &\n  RadioGroupProps;\n\nconst RadioGroupFieldRaw = forwardRef<HTMLDivElement, RadioGroupFieldProps>(\n  (\n    {\n      autoFocus,\n      className,\n      defaultValue,\n      description,\n      disabled,\n      warnings = [],\n      errors = [],\n      id: propId,\n      label,\n      name,\n      onChange,\n      options = [],\n      required,\n      value,\n      ...props\n    },\n    ref,\n  ) => {\n    const hasLabel = label !== undefined;\n    const hasError = errors.length > 0;\n    const prefix = useId();\n    const id = propId ?? `${prefix}-radio-group`;\n\n    return (\n      <RadioGroup\n        aria-invalid={hasError}\n        aria-label={!hasLabel ? \"Radio group\" : undefined}\n        aria-required={required}\n        autoFocus={autoFocus}\n        className={twMerge(\"flex flex-col gap-2\", className)}\n        defaultValue={defaultValue}\n        id={id}\n        name={name}\n        onValueChange={(newValue) => {\n          onChange?.(newValue);\n        }}\n        value={value}\n        disabled={disabled}\n        {...props}\n        ref={ref}\n      >\n        {hasLabel && (\n          <FormLabel\n            description={description}\n            hasError={hasError}\n            htmlFor={id}\n            required={required}\n            disabled={disabled}\n          >\n            {label}\n          </FormLabel>\n        )}\n        {options.map((option, index) => (\n          <div\n            key={`${prefix}-radio-${index}-${option.value}`}\n            className=\"flex items-center gap-2\"\n            role=\"presentation\"\n          >\n            <Radio\n              id={`${prefix}-radio-${index}-${option.value}`}\n              label={option.label}\n              value={option.value}\n              description={option.description}\n              disabled={disabled || option.disabled}\n              hasError={hasError}\n            />\n          </div>\n        ))}\n        {warnings.length > 0 && (\n          <FormMessageList messages={warnings} type=\"warning\" />\n        )}\n        {hasError && <FormMessageList messages={errors} type=\"error\" />}\n      </RadioGroup>\n    );\n  },\n);\n\nexport const RadioGroupField = forwardRef(function RadioGroupField(\n  props: RadioGroupFieldProps,\n  ref: Ref<HTMLDivElement>,\n) {\n  const Component =\n    withFieldValidation<RadioGroupFieldProps>(RadioGroupFieldRaw);\n  return <Component {...props} ref={ref} />;\n});\n\nRadioGroupField.displayName = \"RadioGroupField\";\n"],"mappings":";;;;;;;;;AAyBA,MAAMQ,qBAAqBP,4BAEvB,EACEQ,WACAC,WACAC,cACAC,aACAC,UACAC,WAAW,EAAE,EACbC,SAAS,EAAE,EACXC,IAAIC,QACJC,OACAC,MACAC,UACAC,UAAU,EAAE,EACZC,UACAC,OACA,GAAGC,SAELC,QACG;CACH,MAAMC,WAAWR,UAAUS,KAAAA;CAC3B,MAAMC,WAAWb,OAAOc,SAAS;CACjC,MAAMC,SAAS5B,OAAO;CACtB,MAAMc,KAAKC,UAAU,GAAGa,OAAM;AAE9B,QACE,qBAAC,YAAD;EACE,gBAAcF;EACd,cAAY,CAACF,WAAW,gBAAgBC,KAAAA;EACxC,iBAAeL;EACJb;EACX,WAAWT,QAAQ,uBAAuBU,UAAU;EACtCC;EACVK;EACEG;EACN,gBAAgBY,aAAa;AAC3BX,cAAWW,SAAS;;EAEfR;EACGV;EACV,GAAIW;EACCC;YAfP;GAiBGC,YACC,oBAAC,WAAD;IACed;IACHgB;IACV,SAASZ;IACCM;IACAT;cAETK;IAEJ,CAAA;GACAG,QAAQW,KAAKC,QAAQC,UACpB,oBAAC,OAAD;IAEE,WAAU;IACV,MAAK;cAEL,oBAAC,OAAD;KACE,IAAI,GAAGJ,OAAM,SAAUI,MAAK,GAAID,OAAOV;KACvC,OAAOU,OAAOf;KACd,OAAOe,OAAOV;KACd,aAAaU,OAAOrB;KACpB,UAAUC,YAAYoB,OAAOpB;KACnBe;KAAS,CAAA;IAGxB,EAbQ,GAAGE,OAAM,SAAUI,MAAK,GAAID,OAAOV,QAa3C,CAAC;GACDT,SAASe,SAAS,KACjB,oBAAC,iBAAD;IAAiB,UAAUf;IAAU,MAAK;IAC3C,CAAA;GACAc,YAAY,oBAAC,iBAAD;IAAiB,UAAUb;IAAQ,MAAK;IAAU,CAAA;GACpD;;EAGlB;AAED,MAAaoB,kBAAkBlC,2BAAW,SAASkC,gBACjDX,OACAC,KACA;AAGA,QAAO,oBADLpB,oBAA0CG,mBAAmB,EACxD;EAAW,GAAIgB;EAAYC;EAAO,CAAA;EACzC;AAEFU,gBAAgBE,cAAc"}
+{"version":3,"file":"radio-group-field.js","names":["twMerge","forwardRef","useId","FormLabel","FormMessageList","withFieldValidation","RadioGroup","Radio","RadioGroupFieldRaw","autoFocus","className","defaultValue","description","disabled","warnings","errors","id","propId","label","name","onChange","options","required","value","props","ref","hasLabel","undefined","hasError","length","prefix","newValue","map","option","index","RadioGroupField","Component","displayName"],"sources":["../../../../src/ui/components/radio-group-field/radio-group-field.tsx"],"sourcesContent":["import { twMerge } from \"tailwind-merge\";\nimport type { HTMLAttributes, Ref } from \"react\";\nimport { forwardRef, useId } from \"react\";\nimport type { FieldErrorHandling, InputBaseProps } from \"../../types.js\";\nimport type { RadioGroupProps } from \"../enum-field/types.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { withFieldValidation } from \"../with-field-validation/with-field-validation.js\";\nimport { RadioGroup } from \"./radio-group.js\";\nimport { Radio } from \"./radio.js\";\ntype RadioGroupFieldBaseProps = Omit<\n  HTMLAttributes<HTMLDivElement>,\n  | keyof InputBaseProps<string>\n  | keyof FieldErrorHandling\n  | keyof RadioGroupProps\n  | \"dir\"\n> & {\n  dir?: \"ltr\" | \"rtl\";\n};\n\nexport type RadioGroupFieldProps = RadioGroupFieldBaseProps &\n  InputBaseProps<string> &\n  FieldErrorHandling &\n  RadioGroupProps;\n\nconst RadioGroupFieldRaw = forwardRef<HTMLDivElement, RadioGroupFieldProps>(\n  (\n    {\n      autoFocus,\n      className,\n      defaultValue,\n      description,\n      disabled,\n      warnings = [],\n      errors = [],\n      id: propId,\n      label,\n      name,\n      onChange,\n      options = [],\n      required,\n      value,\n      ...props\n    },\n    ref,\n  ) => {\n    const hasLabel = label !== undefined;\n    const hasError = errors.length > 0;\n    const prefix = useId();\n    const id = propId ?? `${prefix}-radio-group`;\n\n    return (\n      <RadioGroup\n        aria-invalid={hasError}\n        aria-label={!hasLabel ? \"Radio group\" : undefined}\n        aria-required={required}\n        autoFocus={autoFocus}\n        className={twMerge(\"flex flex-col gap-2\", className)}\n        defaultValue={defaultValue}\n        id={id}\n        name={name}\n        onValueChange={(newValue) => {\n          onChange?.(newValue);\n        }}\n        value={value}\n        disabled={disabled}\n        {...props}\n        ref={ref}\n      >\n        {hasLabel && (\n          <FormLabel\n            description={description}\n            hasError={hasError}\n            htmlFor={id}\n            required={required}\n            disabled={disabled}\n          >\n            {label}\n          </FormLabel>\n        )}\n        {options.map((option, index) => (\n          <div\n            key={`${prefix}-radio-${index}-${option.value}`}\n            className=\"flex items-center gap-2\"\n            role=\"presentation\"\n          >\n            <Radio\n              id={`${prefix}-radio-${index}-${option.value}`}\n              label={option.label}\n              value={option.value}\n              description={option.description}\n              disabled={disabled || option.disabled}\n              hasError={hasError}\n            />\n          </div>\n        ))}\n        {warnings.length > 0 && (\n          <FormMessageList messages={warnings} type=\"warning\" />\n        )}\n        {hasError && <FormMessageList messages={errors} type=\"error\" />}\n      </RadioGroup>\n    );\n  },\n);\n\nexport const RadioGroupField = forwardRef(function RadioGroupField(\n  props: RadioGroupFieldProps,\n  ref: Ref<HTMLDivElement>,\n) {\n  const Component =\n    withFieldValidation<RadioGroupFieldProps>(RadioGroupFieldRaw);\n  return <Component {...props} ref={ref} />;\n});\n\nRadioGroupField.displayName = \"RadioGroupField\";\n"],"mappings":";;;;;;;;;AAyBA,MAAMQ,qBAAqBP,0BAEvB,EACEQ,WACAC,WACAC,cACAC,aACAC,UACAC,WAAW,CAAA,GACXC,SAAS,CAAA,GACTC,IAAIC,QACJC,OACAC,MACAC,UACAC,UAAU,CAAA,GACVC,UACAC,OACA,GAAGC,SAELC,QACG;CACH,MAAMC,WAAWR,UAAUS,KAAAA;CAC3B,MAAMC,WAAWb,OAAOc,SAAS;CACjC,MAAMC,SAAS5B,MAAM;CACrB,MAAMc,KAAKC,UAAU,GAAGa,OAAM;CAE9B,OACE,qBAAC,YAAD;EACE,gBAAcF;EACd,cAAY,CAACF,WAAW,gBAAgBC,KAAAA;EACxC,iBAAeL;EACJb;EACX,WAAWT,QAAQ,uBAAuBU,SAAS;EACrCC;EACVK;EACEG;EACN,gBAAgBY,aAAa;GAC3BX,WAAWW,QAAQ;EACrB;EACOR;EACGV;EACV,GAAIW;EACCC;EAfP,UAAA;GAiBGC,YACC,oBAAC,WAAD;IACed;IACHgB;IACV,SAASZ;IACCM;IACAT;IAETK,UAAAA;GACQ,CAAA;GAEZG,QAAQW,KAAKC,QAAQC,UACpB,oBAAC,OAAD;IAEE,WAAU;IACV,MAAK;IAEL,UAAA,oBAAC,OAAD;KACE,IAAI,GAAGJ,OAAM,SAAUI,MAAK,GAAID,OAAOV;KACvC,OAAOU,OAAOf;KACd,OAAOe,OAAOV;KACd,aAAaU,OAAOrB;KACpB,UAAUC,YAAYoB,OAAOpB;KACnBe;IAAS,CAAA;GAElB,GAZE,GAAGE,OAAM,SAAUI,MAAK,GAAID,OAAOV,OAYrC,CACN;GACAT,SAASe,SAAS,KACjB,oBAAC,iBAAD;IAAiB,UAAUf;IAAU,MAAK;GAAS,CAAA;GAEpDc,YAAY,oBAAC,iBAAD;IAAiB,UAAUb;IAAQ,MAAK;GAAO,CAAA;EAClD;;AAEhB,CACF;AAEA,MAAaoB,kBAAkBlC,yBAAW,SAASkC,gBACjDX,OACAC,KACA;CACA,MAAMW,YACJ/B,oBAA0CG,kBAAkB;CAC9D,OAAO,oBAAC,WAAD;EAAW,GAAIgB;EAAYC;CAAI,CAAA;AACxC,CAAC;AAEDU,gBAAgBE,cAAc"}

package/dist/ui/components/radio-group-field/radio-group.d.ts

@@ -1,2 +1,3 @@
-import { n as RadioGroup, t as CustomizableRadioGroupProps } from "../../../radio-group-Bkli6nUz.js";
-export { CustomizableRadioGroupProps, RadioGroup };
+import { n as RadioGroup, t as CustomizableRadioGroupProps } from "../../../radio-group-CROIwgYz.js";
+export { CustomizableRadioGroupProps, RadioGroup };
+export {};

package/dist/ui/components/radio-group-field/radio-group.js

@@ -2,7 +2,7 @@ import React, { useId } from "react";
 import { jsx } from "react/jsx-runtime";
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
 //#region src/ui/components/radio-group-field/radio-group.tsx
-const RadioGroup = /* @__PURE__ */ React.forwardRef(({ children, className, id: propId, name, ...props }, ref) => {
+const RadioGroup = /*#__PURE__*/ React.forwardRef(({ children, className, id: propId, name, ...props }, ref) => {
 	const prefix = useId();
 	const id = propId ?? `${prefix}-radio-group`;
 	return /* @__PURE__ */ jsx(RadioGroupPrimitive.Root, {

package/dist/ui/components/radio-group-field/radio-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-group.js","names":["React","useId","RadioGroupPrimitive","RadioGroup","forwardRef","children","className","id","propId","name","props","ref","prefix","displayName"],"sources":["../../../../src/ui/components/radio-group-field/radio-group.tsx"],"sourcesContent":["import React, { useId } from \"react\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\n\nexport interface CustomizableRadioGroupProps extends React.ComponentPropsWithoutRef<\n  typeof RadioGroupPrimitive.Root\n> {\n  children: React.ReactNode;\n  className?: string;\n  id?: string;\n  name?: string;\n}\n\nexport const RadioGroup = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\n  CustomizableRadioGroupProps\n>(({ children, className, id: propId, name, ...props }, ref) => {\n  const prefix = useId();\n  const id = propId ?? `${prefix}-radio-group`;\n\n  return (\n    <RadioGroupPrimitive.Root\n      className={className}\n      id={id}\n      name={name}\n      {...props}\n      ref={ref}\n    >\n      {children}\n    </RadioGroupPrimitive.Root>\n  );\n});\n\nRadioGroup.displayName = \"RadioGroup\";\n"],"mappings":";;;;AAYA,MAAaG,aAAaH,sBAAMI,YAG7B,EAAEC,UAAUC,WAAWC,IAAIC,QAAQC,MAAM,GAAGC,SAASC,QAAQ;CAC9D,MAAMC,SAASX,OAAO;CACtB,MAAMM,KAAKC,UAAU,GAAGI,OAAM;AAE9B,QACE,oBAAC,oBAAoB,MAArB;EACaN;EACPC;EACEE;EACN,GAAIC;EACCC;EAEJN;EACwB,CAAA;EAE7B;AAEFF,WAAWU,cAAc"}
+{"version":3,"file":"radio-group.js","names":["React","useId","RadioGroupPrimitive","RadioGroup","forwardRef","children","className","id","propId","name","props","ref","prefix","displayName"],"sources":["../../../../src/ui/components/radio-group-field/radio-group.tsx"],"sourcesContent":["import React, { useId } from \"react\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\n\nexport interface CustomizableRadioGroupProps extends React.ComponentPropsWithoutRef<\n  typeof RadioGroupPrimitive.Root\n> {\n  children: React.ReactNode;\n  className?: string;\n  id?: string;\n  name?: string;\n}\n\nexport const RadioGroup = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\n  CustomizableRadioGroupProps\n>(({ children, className, id: propId, name, ...props }, ref) => {\n  const prefix = useId();\n  const id = propId ?? `${prefix}-radio-group`;\n\n  return (\n    <RadioGroupPrimitive.Root\n      className={className}\n      id={id}\n      name={name}\n      {...props}\n      ref={ref}\n    >\n      {children}\n    </RadioGroupPrimitive.Root>\n  );\n});\n\nRadioGroup.displayName = \"RadioGroup\";\n"],"mappings":";;;;AAYA,MAAaG,aAAaH,oBAAMI,YAG7B,EAAEC,UAAUC,WAAWC,IAAIC,QAAQC,MAAM,GAAGC,SAASC,QAAQ;CAC9D,MAAMC,SAASX,MAAM;CACrB,MAAMM,KAAKC,UAAU,GAAGI,OAAM;CAE9B,OACE,oBAAC,oBAAoB,MAArB;EACaN;EACPC;EACEE;EACN,GAAIC;EACCC;EAEJN;CACuB,CAAA;AAE9B,CAAC;AAEDF,WAAWU,cAAc"}

package/dist/ui/components/radio-group-field/radio.d.ts

@@ -1,2 +1,3 @@
-import { n as RadioProps, t as Radio } from "../../../radio-eL0Oy86J.js";
-export { Radio, RadioProps };
+import { n as RadioProps, t as Radio } from "../../../radio-CTS4WsNy.js";
+export { Radio, RadioProps };
+export {};

package/dist/ui/components/radio-group-field/radio.js

@@ -4,7 +4,7 @@ import { twMerge } from "tailwind-merge";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
 //#region src/ui/components/radio-group-field/radio.tsx
-const Radio = /* @__PURE__ */ React.forwardRef(({ className, description, disabled = false, hasError = false, id: propId, label, value, ...props }, ref) => {
+const Radio = /*#__PURE__*/ React.forwardRef(({ className, description, disabled = false, hasError = false, id: propId, label, value, ...props }, ref) => {
 	const prefix = useId();
 	const id = propId ?? `${prefix}-radio`;
 	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(RadioGroupPrimitive.Item, {

package/dist/ui/components/radio-group-field/radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio.js","names":["twMerge","RadioGroupPrimitive","React","useId","FormLabel","Radio","forwardRef","className","description","disabled","hasError","id","propId","label","value","props","ref","prefix","required"],"sources":["../../../../src/ui/components/radio-group-field/radio.tsx"],"sourcesContent":["import { twMerge } from \"tailwind-merge\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\nimport React, { useId } from \"react\";\nimport { FormLabel } from \"../form-label/form-label.js\";\n\nexport interface RadioProps extends React.ComponentPropsWithoutRef<\n  typeof RadioGroupPrimitive.Item\n> {\n  className?: string;\n  description?: string;\n  disabled?: boolean;\n  hasError?: boolean;\n  id?: string;\n  label: string;\n  value: string;\n}\n\nexport const Radio = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Item>,\n  RadioProps\n>(\n  (\n    {\n      className,\n      description,\n      disabled = false,\n      hasError = false,\n      id: propId,\n      label,\n      value,\n      ...props\n    },\n    ref,\n  ) => {\n    const prefix = useId();\n    const id = propId ?? `${prefix}-radio`;\n\n    return (\n      <>\n        <RadioGroupPrimitive.Item\n          aria-disabled={disabled}\n          aria-invalid={hasError}\n          className={twMerge(\n            \"group peer\",\n            \"aspect-square size-4 rounded-full border border-foreground\",\n            \"hover:hover-effect\",\n            disabled && [\"cursor-not-allowed border-border\", \"\"],\n            hasError && [\"border-destructive\", \"\"],\n            className,\n          )}\n          disabled={disabled}\n          id={id}\n          value={value}\n          {...props}\n          ref={ref}\n        >\n          <RadioGroupPrimitive.Indicator\n            className={twMerge(\n              \"relative flex size-full items-center justify-center\",\n              \"after:absolute after:top-1/2 after:left-1/2 after:size-2.5\",\n              \"after:-translate-1/2\",\n              \"after:rounded-full after:bg-primary after:content-['']\",\n              \"\",\n              !disabled && [\n                \"group-hover:after:hover-effect dark:group-hover:after:hover-effect\",\n                \"dark:group-hover:after:hover-effect\",\n              ],\n              disabled && [\"after:bg-muted-foreground\", \"\"],\n            )}\n          />\n        </RadioGroupPrimitive.Item>\n        <FormLabel\n          className={twMerge(\n            !disabled &&\n              !hasError && [\n                \"cursor-pointer\",\n                \"peer-hover:hover-effect dark:peer-hover:hover-effect\",\n              ],\n          )}\n          description={description}\n          disabled={disabled}\n          hasError={hasError}\n          htmlFor={id}\n          required={props.required}\n          inline\n        >\n          {label}\n        </FormLabel>\n      </>\n    );\n  },\n);\n"],"mappings":";;;;;;AAiBA,MAAaK,QAAQH,sBAAMI,YAKvB,EACEC,WACAC,aACAC,WAAW,OACXC,WAAW,OACXC,IAAIC,QACJC,OACAC,OACA,GAAGC,SAELC,QACG;CACH,MAAMC,SAASd,OAAO;CACtB,MAAMQ,KAAKC,UAAU,GAAGK,OAAM;AAE9B,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,oBAAoB,MAArB;EACE,iBAAeR;EACf,gBAAcC;EACd,WAAWV,QACT,cACA,8DACA,sBACAS,YAAY,CAAC,oCAAoC,GAAG,EACpDC,YAAY,CAAC,sBAAsB,GAAG,EACtCH,UACD;EACSE;EACNE;EACGG;EACP,GAAIC;EACCC;YAEL,oBAAC,oBAAoB,WAArB,EACE,WAAWhB,QACT,uDACA,8DACA,wBACA,0DACA,IACA,CAACS,YAAY,CACX,sEACA,sCACD,EACDA,YAAY,CAAC,6BAA6B,GAC5C,CAAC,EAAC,CAAA;EAEoB,CAAA,EAC1B,oBAAC,WAAD;EACE,WAAWT,QACT,CAACS,YACC,CAACC,YAAY,CACX,kBACA,uDAEN,CAAC;EACYF;EACHC;EACAC;EACV,SAASC;EACT,UAAUI,MAAMG;EAChB,QAAA;YAECL;EACQ,CAAA,CACV,EAAA,CAAA;EAGR"}
+{"version":3,"file":"radio.js","names":["twMerge","RadioGroupPrimitive","React","useId","FormLabel","Radio","forwardRef","className","description","disabled","hasError","id","propId","label","value","props","ref","prefix","required"],"sources":["../../../../src/ui/components/radio-group-field/radio.tsx"],"sourcesContent":["import { twMerge } from \"tailwind-merge\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\nimport React, { useId } from \"react\";\nimport { FormLabel } from \"../form-label/form-label.js\";\n\nexport interface RadioProps extends React.ComponentPropsWithoutRef<\n  typeof RadioGroupPrimitive.Item\n> {\n  className?: string;\n  description?: string;\n  disabled?: boolean;\n  hasError?: boolean;\n  id?: string;\n  label: string;\n  value: string;\n}\n\nexport const Radio = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Item>,\n  RadioProps\n>(\n  (\n    {\n      className,\n      description,\n      disabled = false,\n      hasError = false,\n      id: propId,\n      label,\n      value,\n      ...props\n    },\n    ref,\n  ) => {\n    const prefix = useId();\n    const id = propId ?? `${prefix}-radio`;\n\n    return (\n      <>\n        <RadioGroupPrimitive.Item\n          aria-disabled={disabled}\n          aria-invalid={hasError}\n          className={twMerge(\n            \"group peer\",\n            \"aspect-square size-4 rounded-full border border-foreground\",\n            \"hover:hover-effect\",\n            disabled && [\"cursor-not-allowed border-border\", \"\"],\n            hasError && [\"border-destructive\", \"\"],\n            className,\n          )}\n          disabled={disabled}\n          id={id}\n          value={value}\n          {...props}\n          ref={ref}\n        >\n          <RadioGroupPrimitive.Indicator\n            className={twMerge(\n              \"relative flex size-full items-center justify-center\",\n              \"after:absolute after:top-1/2 after:left-1/2 after:size-2.5\",\n              \"after:-translate-1/2\",\n              \"after:rounded-full after:bg-primary after:content-['']\",\n              \"\",\n              !disabled && [\n                \"group-hover:after:hover-effect dark:group-hover:after:hover-effect\",\n                \"dark:group-hover:after:hover-effect\",\n              ],\n              disabled && [\"after:bg-muted-foreground\", \"\"],\n            )}\n          />\n        </RadioGroupPrimitive.Item>\n        <FormLabel\n          className={twMerge(\n            !disabled &&\n              !hasError && [\n                \"cursor-pointer\",\n                \"peer-hover:hover-effect dark:peer-hover:hover-effect\",\n              ],\n          )}\n          description={description}\n          disabled={disabled}\n          hasError={hasError}\n          htmlFor={id}\n          required={props.required}\n          inline\n        >\n          {label}\n        </FormLabel>\n      </>\n    );\n  },\n);\n"],"mappings":";;;;;;AAiBA,MAAaK,QAAQH,oBAAMI,YAKvB,EACEC,WACAC,aACAC,WAAW,OACXC,WAAW,OACXC,IAAIC,QACJC,OACAC,OACA,GAAGC,SAELC,QACG;CACH,MAAMC,SAASd,MAAM;CACrB,MAAMQ,KAAKC,UAAU,GAAGK,OAAM;CAE9B,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,oBAAoB,MAArB;EACE,iBAAeR;EACf,gBAAcC;EACd,WAAWV,QACT,cACA,8DACA,sBACAS,YAAY,CAAC,oCAAoC,EAAE,GACnDC,YAAY,CAAC,sBAAsB,EAAE,GACrCH,SACF;EACUE;EACNE;EACGG;EACP,GAAIC;EACCC;EAEL,UAAA,oBAAC,oBAAoB,WAArB,EACE,WAAWhB,QACT,uDACA,8DACA,wBACA,0DACA,IACA,CAACS,YAAY,CACX,sEACA,qCAAqC,GAEvCA,YAAY,CAAC,6BAA6B,EAAE,CAC9C,EAAE,CAAA;CAEoB,CAAA,GAC1B,oBAAC,WAAD;EACE,WAAWT,QACT,CAACS,YACC,CAACC,YAAY,CACX,kBACA,sDAAsD,CAE5D;EACaF;EACHC;EACAC;EACV,SAASC;EACT,UAAUI,MAAMG;EAChB,QAAA;EAECL,UAAAA;CACQ,CAAA,CACb,EAAA,CAAA;AAEJ,CACF"}

package/dist/ui/components/search-autocomplete/index.d.ts

@@ -1,4 +1,6 @@
-import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../../types-C04Q_Fan.js";
-import { t as SearchAutocomplete } from "../../../search-autocomplete-BJJkrZ1i.js";
-import { t as useSearchAutocomplete } from "../../../use-search-autocomplete-IfcQ_gKh.js";
-export { SearchAutocomplete, SearchAutocompleteOption, SearchAutocompleteProps, SearchAutocompleteRowContext, useSearchAutocomplete };
+import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../../types-D4CirgNk.js";
+import { t as SearchAutocomplete } from "../../../search-autocomplete-COvFRZIb.js";
+import { t as useSearchAutocomplete } from "../../../use-search-autocomplete-vSvcsvcB.js";
+import "../../../index-D6Zk5OLV.js";
+export { SearchAutocomplete, type SearchAutocompleteOption, type SearchAutocompleteProps, type SearchAutocompleteRowContext, useSearchAutocomplete };
+export {};

package/dist/ui/components/search-autocomplete/search-autocomplete.d.ts

@@ -1,2 +1,3 @@
-import { t as SearchAutocomplete } from "../../../search-autocomplete-BJJkrZ1i.js";
-export { SearchAutocomplete };
+import { t as SearchAutocomplete } from "../../../search-autocomplete-COvFRZIb.js";
+export { SearchAutocomplete };
+export {};

package/dist/ui/components/search-autocomplete/search-autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"search-autocomplete.js","names":["React","useCallback","useState","twMerge","Input","Popover","PopoverAnchor","PopoverContent","useSearchAutocomplete","SearchAutocomplete","props","fetchOptions","onSelect","selectLabel","selectingContent","placeholder","disabled","loading","externalLoading","className","renderOption","renderRow","keepOpenSelector","debounceMs","query","setQuery","results","isLoading","error","isOpen","setIsOpen","handleQueryChange","selectingValue","setSelectingValue","handleInputChange","e","target","value","handleSelect","handleSubmit","trim","handleKeyDown","key","preventDefault","length","closest","map","option","label","version","description","meta","disabledLabel"],"sources":["../../../../src/ui/components/search-autocomplete/search-autocomplete.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nimport { Input } from \"../input/input.js\";\nimport { Popover, PopoverAnchor, PopoverContent } from \"../popover/popover.js\";\nimport type { SearchAutocompleteProps } from \"./types.js\";\nimport { useSearchAutocomplete } from \"./use-search-autocomplete.js\";\n\nexport const SearchAutocomplete: React.FC<SearchAutocompleteProps> = (\n  props,\n) => {\n  const {\n    fetchOptions,\n    onSelect,\n    selectLabel = \"Select\",\n    selectingContent,\n    placeholder = \"Search...\",\n    disabled = false,\n    loading: externalLoading = false,\n    className,\n    renderOption,\n    renderRow,\n    keepOpenSelector,\n    debounceMs = 300,\n  } = props;\n\n  const {\n    query,\n    setQuery,\n    results,\n    isLoading,\n    error,\n    isOpen,\n    setIsOpen,\n    handleQueryChange,\n  } = useSearchAutocomplete({ fetchOptions, debounceMs });\n\n  const [selectingValue, setSelectingValue] = useState<string | null>(null);\n\n  const handleInputChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      handleQueryChange(e.target.value);\n    },\n    [handleQueryChange],\n  );\n\n  const handleSelect = useCallback(\n    async (value: string) => {\n      setSelectingValue(value);\n      try {\n        await onSelect(value);\n        setQuery(\"\");\n        setIsOpen(false);\n      } catch {\n        // error handled by caller\n      } finally {\n        setSelectingValue(null);\n      }\n    },\n    [onSelect, setQuery, setIsOpen],\n  );\n\n  const handleSubmit = useCallback(() => {\n    if (query.trim()) {\n      void handleSelect(query.trim());\n    }\n  }, [query, handleSelect]);\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.key === \"Enter\") {\n        e.preventDefault();\n        if (!fetchOptions && query.trim()) {\n          handleSubmit();\n        }\n      }\n    },\n    [fetchOptions, query, handleSubmit],\n  );\n\n  const loading = isLoading || externalLoading;\n\n  // Fallback: plain text input + submit when no fetchOptions\n  if (!fetchOptions) {\n    return (\n      <div className={twMerge(\"flex items-center gap-2\", className)}>\n        <Input\n          value={query}\n          onChange={handleInputChange}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          disabled={disabled || selectingValue !== null}\n          className=\"max-w-xs text-foreground\"\n        />\n        <button\n          onClick={handleSubmit}\n          disabled={disabled || !query.trim() || selectingValue !== null}\n          className=\"h-9 rounded-md bg-primary px-4 text-sm font-semibold text-primary-foreground transition-colors hover:hover-effect disabled:disabled-effect\"\n        >\n          {selectLabel}\n        </button>\n      </div>\n    );\n  }\n\n  return (\n    <div className={twMerge(\"relative\", className)}>\n      <Popover open={isOpen && results.length > 0} onOpenChange={setIsOpen}>\n        <PopoverAnchor asChild>\n          <Input\n            value={query}\n            onChange={handleInputChange}\n            onKeyDown={handleKeyDown}\n            placeholder={placeholder}\n            disabled={disabled}\n            className=\"max-w-xs text-foreground\"\n          />\n        </PopoverAnchor>\n        <PopoverContent\n          align=\"start\"\n          onOpenAutoFocus={(e) => e.preventDefault()}\n          onInteractOutside={(e) => {\n            if (keepOpenSelector) {\n              const target = e.target as HTMLElement | null;\n              if (target?.closest(keepOpenSelector)) {\n                e.preventDefault();\n                return;\n              }\n            }\n            setIsOpen(false);\n          }}\n          className=\"max-h-80 overflow-visible p-1\"\n        >\n          <div className=\"max-h-80 overflow-y-auto\">\n            {results.map((option) => {\n              if (renderRow) {\n                return (\n                  <div key={option.value} className=\"rounded-md\">\n                    {renderRow(option, {\n                      selectingValue,\n                      selectLabel,\n                      selectingContent,\n                      handleSelect: (value) => void handleSelect(value),\n                    })}\n                  </div>\n                );\n              }\n              return (\n                <div\n                  key={option.value}\n                  className=\"flex items-center justify-between gap-2 rounded-md px-2 py-1.5 hover:hover-effect\"\n                >\n                  {renderOption ? (\n                    <div className=\"min-w-0 flex-1\">{renderOption(option)}</div>\n                  ) : (\n                    <div className=\"min-w-0 flex-1\">\n                      <p className=\"truncate text-sm font-medium text-foreground\">\n                        {option.label}\n                      </p>\n                      {option.version && (\n                        <p className=\"truncate text-xs text-muted-foreground\">\n                          v{option.version}\n                        </p>\n                      )}\n                      {option.description && (\n                        <p className=\"truncate text-xs text-muted-foreground\">\n                          {option.description}\n                        </p>\n                      )}\n                      {option.meta && (\n                        <p className=\"truncate text-xs text-muted-foreground\">\n                          {option.meta}\n                        </p>\n                      )}\n                    </div>\n                  )}\n                  {selectingValue === option.value && selectingContent ? (\n                    <div className=\"flex shrink-0 items-center justify-center\">\n                      {selectingContent}\n                    </div>\n                  ) : option.disabled ? (\n                    <span className=\"shrink-0 rounded-md bg-muted px-3 py-1 text-xs font-medium text-muted-foreground\">\n                      {option.disabledLabel ?? \"Unavailable\"}\n                    </span>\n                  ) : (\n                    <button\n                      onClick={() => void handleSelect(option.value)}\n                      disabled={selectingValue === option.value}\n                      className=\"shrink-0 rounded-md bg-primary px-3 py-1 text-xs font-medium text-primary-foreground transition-colors hover:hover-effect disabled:disabled-effect\"\n                    >\n                      {selectingValue === option.value ? \"...\" : selectLabel}\n                    </button>\n                  )}\n                </div>\n              );\n            })}\n          </div>\n        </PopoverContent>\n      </Popover>\n      {loading && (\n        <p className=\"mt-1 text-xs text-muted-foreground\">Searching...</p>\n      )}\n      {error && <p className=\"mt-1 text-xs text-destructive\">{error}</p>}\n      {!loading &&\n        !error &&\n        query.trim() &&\n        results.length === 0 &&\n        !isOpen && (\n          <p className=\"mt-1 text-xs text-muted-foreground\">No results found</p>\n        )}\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"search-autocomplete.js","names":["React","useCallback","useState","twMerge","Input","Popover","PopoverAnchor","PopoverContent","useSearchAutocomplete","SearchAutocomplete","props","fetchOptions","onSelect","selectLabel","selectingContent","placeholder","disabled","loading","externalLoading","className","renderOption","renderRow","keepOpenSelector","debounceMs","query","setQuery","results","isLoading","error","isOpen","setIsOpen","handleQueryChange","selectingValue","setSelectingValue","handleInputChange","e","target","value","handleSelect","handleSubmit","trim","handleKeyDown","key","preventDefault","length","closest","map","option","label","version","description","meta","disabledLabel"],"sources":["../../../../src/ui/components/search-autocomplete/search-autocomplete.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nimport { Input } from \"../input/input.js\";\nimport { Popover, PopoverAnchor, PopoverContent } from \"../popover/popover.js\";\nimport type { SearchAutocompleteProps } from \"./types.js\";\nimport { useSearchAutocomplete } from \"./use-search-autocomplete.js\";\n\nexport const SearchAutocomplete: React.FC<SearchAutocompleteProps> = (\n  props,\n) => {\n  const {\n    fetchOptions,\n    onSelect,\n    selectLabel = \"Select\",\n    selectingContent,\n    placeholder = \"Search...\",\n    disabled = false,\n    loading: externalLoading = false,\n    className,\n    renderOption,\n    renderRow,\n    keepOpenSelector,\n    debounceMs = 300,\n  } = props;\n\n  const {\n    query,\n    setQuery,\n    results,\n    isLoading,\n    error,\n    isOpen,\n    setIsOpen,\n    handleQueryChange,\n  } = useSearchAutocomplete({ fetchOptions, debounceMs });\n\n  const [selectingValue, setSelectingValue] = useState<string | null>(null);\n\n  const handleInputChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      handleQueryChange(e.target.value);\n    },\n    [handleQueryChange],\n  );\n\n  const handleSelect = useCallback(\n    async (value: string) => {\n      setSelectingValue(value);\n      try {\n        await onSelect(value);\n        setQuery(\"\");\n        setIsOpen(false);\n      } catch {\n        // error handled by caller\n      } finally {\n        setSelectingValue(null);\n      }\n    },\n    [onSelect, setQuery, setIsOpen],\n  );\n\n  const handleSubmit = useCallback(() => {\n    if (query.trim()) {\n      void handleSelect(query.trim());\n    }\n  }, [query, handleSelect]);\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.key === \"Enter\") {\n        e.preventDefault();\n        if (!fetchOptions && query.trim()) {\n          handleSubmit();\n        }\n      }\n    },\n    [fetchOptions, query, handleSubmit],\n  );\n\n  const loading = isLoading || externalLoading;\n\n  // Fallback: plain text input + submit when no fetchOptions\n  if (!fetchOptions) {\n    return (\n      <div className={twMerge(\"flex items-center gap-2\", className)}>\n        <Input\n          value={query}\n          onChange={handleInputChange}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          disabled={disabled || selectingValue !== null}\n          className=\"max-w-xs text-foreground\"\n        />\n        <button\n          onClick={handleSubmit}\n          disabled={disabled || !query.trim() || selectingValue !== null}\n          className=\"h-9 rounded-md bg-primary px-4 text-sm font-semibold text-primary-foreground transition-colors hover:hover-effect disabled:disabled-effect\"\n        >\n          {selectLabel}\n        </button>\n      </div>\n    );\n  }\n\n  return (\n    <div className={twMerge(\"relative\", className)}>\n      <Popover open={isOpen && results.length > 0} onOpenChange={setIsOpen}>\n        <PopoverAnchor asChild>\n          <Input\n            value={query}\n            onChange={handleInputChange}\n            onKeyDown={handleKeyDown}\n            placeholder={placeholder}\n            disabled={disabled}\n            className=\"max-w-xs text-foreground\"\n          />\n        </PopoverAnchor>\n        <PopoverContent\n          align=\"start\"\n          onOpenAutoFocus={(e) => e.preventDefault()}\n          onInteractOutside={(e) => {\n            if (keepOpenSelector) {\n              const target = e.target as HTMLElement | null;\n              if (target?.closest(keepOpenSelector)) {\n                e.preventDefault();\n                return;\n              }\n            }\n            setIsOpen(false);\n          }}\n          className=\"max-h-80 overflow-visible p-1\"\n        >\n          <div className=\"max-h-80 overflow-y-auto\">\n            {results.map((option) => {\n              if (renderRow) {\n                return (\n                  <div key={option.value} className=\"rounded-md\">\n                    {renderRow(option, {\n                      selectingValue,\n                      selectLabel,\n                      selectingContent,\n                      handleSelect: (value) => void handleSelect(value),\n                    })}\n                  </div>\n                );\n              }\n              return (\n                <div\n                  key={option.value}\n                  className=\"flex items-center justify-between gap-2 rounded-md px-2 py-1.5 hover:hover-effect\"\n                >\n                  {renderOption ? (\n                    <div className=\"min-w-0 flex-1\">{renderOption(option)}</div>\n                  ) : (\n                    <div className=\"min-w-0 flex-1\">\n                      <p className=\"truncate text-sm font-medium text-foreground\">\n                        {option.label}\n                      </p>\n                      {option.version && (\n                        <p className=\"truncate text-xs text-muted-foreground\">\n                          v{option.version}\n                        </p>\n                      )}\n                      {option.description && (\n                        <p className=\"truncate text-xs text-muted-foreground\">\n                          {option.description}\n                        </p>\n                      )}\n                      {option.meta && (\n                        <p className=\"truncate text-xs text-muted-foreground\">\n                          {option.meta}\n                        </p>\n                      )}\n                    </div>\n                  )}\n                  {selectingValue === option.value && selectingContent ? (\n                    <div className=\"flex shrink-0 items-center justify-center\">\n                      {selectingContent}\n                    </div>\n                  ) : option.disabled ? (\n                    <span className=\"shrink-0 rounded-md bg-muted px-3 py-1 text-xs font-medium text-muted-foreground\">\n                      {option.disabledLabel ?? \"Unavailable\"}\n                    </span>\n                  ) : (\n                    <button\n                      onClick={() => void handleSelect(option.value)}\n                      disabled={selectingValue === option.value}\n                      className=\"shrink-0 rounded-md bg-primary px-3 py-1 text-xs font-medium text-primary-foreground transition-colors hover:hover-effect disabled:disabled-effect\"\n                    >\n                      {selectingValue === option.value ? \"...\" : selectLabel}\n                    </button>\n                  )}\n                </div>\n              );\n            })}\n          </div>\n        </PopoverContent>\n      </Popover>\n      {loading && (\n        <p className=\"mt-1 text-xs text-muted-foreground\">Searching...</p>\n      )}\n      {error && <p className=\"mt-1 text-xs text-destructive\">{error}</p>}\n      {!loading &&\n        !error &&\n        query.trim() &&\n        results.length === 0 &&\n        !isOpen && (\n          <p className=\"mt-1 text-xs text-muted-foreground\">No results found</p>\n        )}\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/ui/components/search-autocomplete/types.d.ts

@@ -1,2 +1,3 @@
-import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../../types-C04Q_Fan.js";
-export { SearchAutocompleteOption, SearchAutocompleteProps, SearchAutocompleteRowContext };
+import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../../types-D4CirgNk.js";
+export { SearchAutocompleteOption, SearchAutocompleteProps, SearchAutocompleteRowContext };
+export {};

package/dist/ui/components/search-autocomplete/use-search-autocomplete.d.ts

@@ -1,2 +1,3 @@
-import { t as useSearchAutocomplete } from "../../../use-search-autocomplete-IfcQ_gKh.js";
-export { useSearchAutocomplete };
+import { t as useSearchAutocomplete } from "../../../use-search-autocomplete-vSvcsvcB.js";
+export { useSearchAutocomplete };
+export {};

package/dist/ui/components/search-autocomplete/use-search-autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-search-autocomplete.js","names":["useCallback","useEffect","useRef","useState","useSearchAutocomplete","options","fetchOptions","debounceMs","query","setQuery","results","setResults","isLoading","setIsLoading","error","setError","isOpen","setIsOpen","debounceRef","undefined","abortRef","fetchResults","searchQuery","trim","current","abort","controller","AbortController","data","signal","aborted","length","err","Error","message","handleQueryChange","value","clearTimeout","setTimeout"],"sources":["../../../../src/ui/components/search-autocomplete/use-search-autocomplete.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport type { SearchAutocompleteOption } from \"./types.js\";\n\ninterface UseSearchAutocompleteOptions {\n  fetchOptions?: (query: string) => Promise<SearchAutocompleteOption[]>;\n  debounceMs: number;\n}\n\nexport function useSearchAutocomplete(options: UseSearchAutocompleteOptions) {\n  const { fetchOptions, debounceMs } = options;\n\n  const [query, setQuery] = useState(\"\");\n  const [results, setResults] = useState<SearchAutocompleteOption[]>([]);\n  const [isLoading, setIsLoading] = useState(false);\n  const [error, setError] = useState<string | undefined>();\n  const [isOpen, setIsOpen] = useState(false);\n\n  const debounceRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n  const abortRef = useRef<AbortController>(undefined);\n\n  const fetchResults = useCallback(\n    async (searchQuery: string) => {\n      if (!fetchOptions) return;\n\n      if (!searchQuery.trim()) {\n        setResults([]);\n        setIsLoading(false);\n        return;\n      }\n\n      abortRef.current?.abort();\n      const controller = new AbortController();\n      abortRef.current = controller;\n\n      setIsLoading(true);\n      setError(undefined);\n\n      try {\n        const data = await fetchOptions(searchQuery);\n        if (!controller.signal.aborted) {\n          setResults(data);\n          setIsOpen(data.length > 0);\n        }\n      } catch (err) {\n        if (!controller.signal.aborted) {\n          setError(\n            err instanceof Error ? err.message : \"Failed to fetch results\",\n          );\n          setResults([]);\n        }\n      } finally {\n        if (!controller.signal.aborted) {\n          setIsLoading(false);\n        }\n      }\n    },\n    [fetchOptions],\n  );\n\n  const handleQueryChange = useCallback(\n    (value: string) => {\n      setQuery(value);\n\n      if (debounceRef.current) {\n        clearTimeout(debounceRef.current);\n      }\n\n      if (!value.trim()) {\n        setResults([]);\n        setIsOpen(false);\n        setIsLoading(false);\n        return;\n      }\n\n      setIsLoading(true);\n      debounceRef.current = setTimeout(() => {\n        void fetchResults(value);\n      }, debounceMs);\n    },\n    [debounceMs, fetchResults],\n  );\n\n  useEffect(() => {\n    return () => {\n      if (debounceRef.current) {\n        clearTimeout(debounceRef.current);\n      }\n      abortRef.current?.abort();\n    };\n  }, []);\n\n  return {\n    query,\n    setQuery,\n    results,\n    isLoading,\n    error,\n    isOpen,\n    setIsOpen,\n    handleQueryChange,\n  };\n}\n"],"mappings":";;AAQA,SAAgBI,sBAAsBC,SAAuC;CAC3E,MAAM,EAAEC,cAAcC,eAAeF;CAErC,MAAM,CAACG,OAAOC,YAAYN,SAAS,GAAG;CACtC,MAAM,CAACO,SAASC,cAAcR,SAAqC,EAAE,CAAC;CACtE,MAAM,CAACS,WAAWC,gBAAgBV,SAAS,MAAM;CACjD,MAAM,CAACW,OAAOC,YAAYZ,UAA8B;CACxD,MAAM,CAACa,QAAQC,aAAad,SAAS,MAAM;CAE3C,MAAMe,cAAchB,OAAsCiB,KAAAA,EAAU;CACpE,MAAMC,WAAWlB,OAAwBiB,KAAAA,EAAU;CAEnD,MAAME,eAAerB,YACnB,OAAOsB,gBAAwB;AAC7B,MAAI,CAAChB,aAAc;AAEnB,MAAI,CAACgB,YAAYC,MAAM,EAAE;AACvBZ,cAAW,EAAE,CAAC;AACdE,gBAAa,MAAM;AACnB;;AAGFO,WAASI,SAASC,OAAO;EACzB,MAAMC,aAAa,IAAIC,iBAAiB;AACxCP,WAASI,UAAUE;AAEnBb,eAAa,KAAK;AAClBE,WAASI,KAAAA,EAAU;AAEnB,MAAI;GACF,MAAMS,OAAO,MAAMtB,aAAagB,YAAY;AAC5C,OAAI,CAACI,WAAWG,OAAOC,SAAS;AAC9BnB,eAAWiB,KAAK;AAChBX,cAAUW,KAAKG,SAAS,EAAE;;WAErBC,KAAK;AACZ,OAAI,CAACN,WAAWG,OAAOC,SAAS;AAC9Bf,aACEiB,eAAeC,QAAQD,IAAIE,UAAU,0BACtC;AACDvB,eAAW,EAAE,CAAC;;YAER;AACR,OAAI,CAACe,WAAWG,OAAOC,QACrBjB,cAAa,MAAM;;IAIzB,CAACP,aACH,CAAC;CAED,MAAM6B,oBAAoBnC,aACvBoC,UAAkB;AACjB3B,WAAS2B,MAAM;AAEf,MAAIlB,YAAYM,QACda,cAAanB,YAAYM,QAAQ;AAGnC,MAAI,CAACY,MAAMb,MAAM,EAAE;AACjBZ,cAAW,EAAE,CAAC;AACdM,aAAU,MAAM;AAChBJ,gBAAa,MAAM;AACnB;;AAGFA,eAAa,KAAK;AAClBK,cAAYM,UAAUc,iBAAiB;AAChCjB,gBAAae,MAAM;KACvB7B,WAAW;IAEhB,CAACA,YAAYc,aACf,CAAC;AAEDpB,iBAAgB;AACd,eAAa;AACX,OAAIiB,YAAYM,QACda,cAAanB,YAAYM,QAAQ;AAEnCJ,YAASI,SAASC,OAAO;;IAE1B,EAAE,CAAC;AAEN,QAAO;EACLjB;EACAC;EACAC;EACAE;EACAE;EACAE;EACAC;EACAkB;EACD"}
+{"version":3,"file":"use-search-autocomplete.js","names":["useCallback","useEffect","useRef","useState","useSearchAutocomplete","options","fetchOptions","debounceMs","query","setQuery","results","setResults","isLoading","setIsLoading","error","setError","isOpen","setIsOpen","debounceRef","undefined","abortRef","fetchResults","searchQuery","trim","current","abort","controller","AbortController","data","signal","aborted","length","err","Error","message","handleQueryChange","value","clearTimeout","setTimeout"],"sources":["../../../../src/ui/components/search-autocomplete/use-search-autocomplete.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport type { SearchAutocompleteOption } from \"./types.js\";\n\ninterface UseSearchAutocompleteOptions {\n  fetchOptions?: (query: string) => Promise<SearchAutocompleteOption[]>;\n  debounceMs: number;\n}\n\nexport function useSearchAutocomplete(options: UseSearchAutocompleteOptions) {\n  const { fetchOptions, debounceMs } = options;\n\n  const [query, setQuery] = useState(\"\");\n  const [results, setResults] = useState<SearchAutocompleteOption[]>([]);\n  const [isLoading, setIsLoading] = useState(false);\n  const [error, setError] = useState<string | undefined>();\n  const [isOpen, setIsOpen] = useState(false);\n\n  const debounceRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n  const abortRef = useRef<AbortController>(undefined);\n\n  const fetchResults = useCallback(\n    async (searchQuery: string) => {\n      if (!fetchOptions) return;\n\n      if (!searchQuery.trim()) {\n        setResults([]);\n        setIsLoading(false);\n        return;\n      }\n\n      abortRef.current?.abort();\n      const controller = new AbortController();\n      abortRef.current = controller;\n\n      setIsLoading(true);\n      setError(undefined);\n\n      try {\n        const data = await fetchOptions(searchQuery);\n        if (!controller.signal.aborted) {\n          setResults(data);\n          setIsOpen(data.length > 0);\n        }\n      } catch (err) {\n        if (!controller.signal.aborted) {\n          setError(\n            err instanceof Error ? err.message : \"Failed to fetch results\",\n          );\n          setResults([]);\n        }\n      } finally {\n        if (!controller.signal.aborted) {\n          setIsLoading(false);\n        }\n      }\n    },\n    [fetchOptions],\n  );\n\n  const handleQueryChange = useCallback(\n    (value: string) => {\n      setQuery(value);\n\n      if (debounceRef.current) {\n        clearTimeout(debounceRef.current);\n      }\n\n      if (!value.trim()) {\n        setResults([]);\n        setIsOpen(false);\n        setIsLoading(false);\n        return;\n      }\n\n      setIsLoading(true);\n      debounceRef.current = setTimeout(() => {\n        void fetchResults(value);\n      }, debounceMs);\n    },\n    [debounceMs, fetchResults],\n  );\n\n  useEffect(() => {\n    return () => {\n      if (debounceRef.current) {\n        clearTimeout(debounceRef.current);\n      }\n      abortRef.current?.abort();\n    };\n  }, []);\n\n  return {\n    query,\n    setQuery,\n    results,\n    isLoading,\n    error,\n    isOpen,\n    setIsOpen,\n    handleQueryChange,\n  };\n}\n"],"mappings":";;AAQA,SAAgBI,sBAAsBC,SAAuC;CAC3E,MAAM,EAAEC,cAAcC,eAAeF;CAErC,MAAM,CAACG,OAAOC,YAAYN,SAAS,EAAE;CACrC,MAAM,CAACO,SAASC,cAAcR,SAAqC,CAAA,CAAE;CACrE,MAAM,CAACS,WAAWC,gBAAgBV,SAAS,KAAK;CAChD,MAAM,CAACW,OAAOC,YAAYZ,SAA6B;CACvD,MAAM,CAACa,QAAQC,aAAad,SAAS,KAAK;CAE1C,MAAMe,cAAchB,OAAsCiB,KAAAA,CAAS;CACnE,MAAMC,WAAWlB,OAAwBiB,KAAAA,CAAS;CAElD,MAAME,eAAerB,YACnB,OAAOsB,gBAAwB;EAC7B,IAAI,CAAChB,cAAc;EAEnB,IAAI,CAACgB,YAAYC,KAAK,GAAG;GACvBZ,WAAW,CAAA,CAAE;GACbE,aAAa,KAAK;GAClB;EACF;EAEAO,SAASI,SAASC,MAAM;EACxB,MAAMC,aAAa,IAAIC,gBAAgB;EACvCP,SAASI,UAAUE;EAEnBb,aAAa,IAAI;EACjBE,SAASI,KAAAA,CAAS;EAElB,IAAI;GACF,MAAMS,OAAO,MAAMtB,aAAagB,WAAW;GAC3C,IAAI,CAACI,WAAWG,OAAOC,SAAS;IAC9BnB,WAAWiB,IAAI;IACfX,UAAUW,KAAKG,SAAS,CAAC;GAC3B;EACF,SAASC,KAAK;GACZ,IAAI,CAACN,WAAWG,OAAOC,SAAS;IAC9Bf,SACEiB,eAAeC,QAAQD,IAAIE,UAAU,yBACvC;IACAvB,WAAW,CAAA,CAAE;GACf;EACF,UAAU;GACR,IAAI,CAACe,WAAWG,OAAOC,SACrBjB,aAAa,KAAK;EAEtB;CACF,GACA,CAACP,YAAY,CACf;CAEA,MAAM6B,oBAAoBnC,aACvBoC,UAAkB;EACjB3B,SAAS2B,KAAK;EAEd,IAAIlB,YAAYM,SACda,aAAanB,YAAYM,OAAO;EAGlC,IAAI,CAACY,MAAMb,KAAK,GAAG;GACjBZ,WAAW,CAAA,CAAE;GACbM,UAAU,KAAK;GACfJ,aAAa,KAAK;GAClB;EACF;EAEAA,aAAa,IAAI;EACjBK,YAAYM,UAAUc,iBAAiB;GACrC,aAAkBF,KAAK;EACzB,GAAG7B,UAAU;CACf,GACA,CAACA,YAAYc,YAAY,CAC3B;CAEApB,gBAAgB;EACd,aAAa;GACX,IAAIiB,YAAYM,SACda,aAAanB,YAAYM,OAAO;GAElCJ,SAASI,SAASC,MAAM;EAC1B;CACF,GAAG,CAAA,CAAE;CAEL,OAAO;EACLjB;EACAC;EACAC;EACAE;EACAE;EACAE;EACAC;EACAkB;CACF;AACF"}

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

@@ -1,2 +1,3 @@
-import { t as Content } from "../../../content-BHWIqmio.js";
-export { Content };
+import { t as Content } from "../../../content-Ch3oDYCL.js";
+export { Content };
+export {};

package/dist/ui/components/select-field/content.js

@@ -1,4 +1,4 @@
-import { t as Icon } from "../../../icon-C4QOpsdI.js";
+import { t as Icon } from "../../../icon-CHR45tj_.js";
 import { CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "../command/command.js";
 import { CommandItemList } from "./subcomponents/CommandItemList.js";
 import { useEffect } from "react";

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

@@ -1 +1 @@
-{"version":3,"file":"content.js","names":["Icon","twMerge","useCommandState","React","useEffect","CommandEmpty","CommandGroup","CommandInput","CommandItem","CommandList","CommandItemList","Content","searchable","commandListRef","multiple","selectedValues","selectionIcon","selectionIconPosition","options","toggleAll","toggleOption","favoriteOptions","enabledOptions","filter","opt","disabled","hasAnyIcon","some","icon","cmdkSearch","state","search","current","scrollTo","top","behavior","e","isOptionsRelatedKey","includes","key","length","stopPropagation","undefined"],"sources":["../../../../src/ui/components/select-field/content.tsx"],"sourcesContent":["import { Icon } from \"#design-system\";\nimport { twMerge } from \"tailwind-merge\";\nimport { useCommandState } from \"cmdk\";\nimport React, { useEffect } from \"react\";\nimport {\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from \"../command/command.js\";\nimport type { SelectProps } from \"../enum-field/types.js\";\nimport { CommandItemList } from \"./subcomponents/CommandItemList.js\";\ninterface ContentProps {\n  searchable?: boolean;\n  commandListRef: React.RefObject<HTMLDivElement | null>;\n  multiple?: boolean;\n  selectedValues: string[];\n  selectionIcon: \"auto\" | \"checkmark\";\n  selectionIconPosition: \"left\" | \"right\";\n  options: SelectProps[\"options\"];\n  favoriteOptions?: SelectProps[\"options\"];\n  toggleAll: () => void;\n  toggleOption: (value: string) => void;\n}\n\nexport const Content: React.FC<ContentProps> = ({\n  searchable,\n  commandListRef,\n  multiple,\n  selectedValues,\n  selectionIcon,\n  selectionIconPosition,\n  options = [],\n  toggleAll,\n  toggleOption,\n  favoriteOptions = [],\n}) => {\n  const enabledOptions = options.filter((opt) => !opt.disabled);\n  const hasAnyIcon = options.some((opt) => opt.icon);\n\n  const cmdkSearch = useCommandState((state) => state.search);\n  // scroll to top when search change\n  useEffect(() => {\n    commandListRef.current?.scrollTo({ top: 0, behavior: \"instant\" });\n  }, [commandListRef, cmdkSearch]);\n\n  return (\n    <>\n      {searchable && (\n        <CommandInput\n          placeholder=\"Search...\"\n          onKeyDown={(e) => {\n            const isOptionsRelatedKey = [\n              \"ArrowUp\",\n              \"ArrowDown\",\n              \"Enter\",\n            ].includes(e.key);\n            if (!(isOptionsRelatedKey && enabledOptions.length > 0)) {\n              e.stopPropagation();\n            }\n          }}\n          wrapperClassName=\"rounded-t\"\n          className=\"text-foreground\"\n        />\n      )}\n      <CommandList ref={commandListRef} tabIndex={!searchable ? 0 : undefined}>\n        <CommandEmpty className=\"p-4 text-center text-sm/5 font-normal text-foreground\">\n          No results found.\n        </CommandEmpty>\n        {multiple && cmdkSearch === \"\" && (\n          <CommandGroup className=\"pb-0\">\n            <CommandItem\n              value=\"select-all\"\n              onSelect={toggleAll}\n              disabled={false}\n              className={twMerge(\n                \"cursor-pointer\",\n                \"data-[selected=true]:bg-accent\",\n              )}\n              role=\"option\"\n              aria-selected={selectedValues.length === enabledOptions.length}\n            >\n              <div className=\"flex w-full items-center gap-2\">\n                {selectionIcon === \"auto\" && (\n                  <div\n                    className={twMerge(\n                      \"flex size-4 items-center justify-center rounded-md border\",\n                      \"border-foreground\",\n                      selectedValues.length === enabledOptions.length &&\n                        \"bg-primary text-primary-foreground\",\n                    )}\n                  >\n                    {selectedValues.length === enabledOptions.length && (\n                      <Icon name=\"Checkmark\" size={16} />\n                    )}\n                  </div>\n                )}\n                {selectionIcon === \"checkmark\" &&\n                  !(selectionIconPosition === \"right\" && hasAnyIcon) && (\n                    <div className=\"size-4\">\n                      {selectionIconPosition === \"left\" &&\n                        selectedValues.length === enabledOptions.length && (\n                          <Icon\n                            name=\"Checkmark\"\n                            size={16}\n                            className=\"text-foreground\"\n                          />\n                        )}\n                    </div>\n                  )}\n                <span className=\"text-sm/4 font-semibold text-foreground\">\n                  {selectedValues.length === enabledOptions.length\n                    ? \"Deselect All\"\n                    : \"Select All\"}\n                </span>\n                {selectionIcon === \"checkmark\" &&\n                  selectionIconPosition === \"right\" && (\n                    <div className=\"ml-auto size-4\">\n                      {selectedValues.length === enabledOptions.length && (\n                        <Icon\n                          name=\"Checkmark\"\n                          size={16}\n                          className=\"text-foreground\"\n                        />\n                      )}\n                    </div>\n                  )}\n              </div>\n            </CommandItem>\n          </CommandGroup>\n        )}\n        <CommandGroup\n          className={multiple && cmdkSearch === \"\" ? \"pt-0\" : undefined}\n        >\n          <CommandItemList\n            options={favoriteOptions}\n            selectedValues={selectedValues}\n            multiple={multiple}\n            selectionIcon={selectionIcon}\n            selectionIconPosition={selectionIconPosition}\n            hasAnyIcon={hasAnyIcon}\n            toggleOption={toggleOption}\n            tabIndex={!searchable ? 0 : undefined}\n          />\n\n          {favoriteOptions.length > 0 && (\n            <div className=\"my-1 border-b border-border\" />\n          )}\n          <CommandItemList\n            options={options}\n            selectedValues={selectedValues}\n            multiple={multiple}\n            selectionIcon={selectionIcon}\n            selectionIconPosition={selectionIconPosition}\n            hasAnyIcon={hasAnyIcon}\n            toggleOption={toggleOption}\n            tabIndex={!searchable ? 0 : undefined}\n          />\n        </CommandGroup>\n      </CommandList>\n    </>\n  );\n};\n"],"mappings":";;;;;;;;AA0BA,MAAaW,WAAmC,EAC9CC,YACAC,gBACAC,UACAC,gBACAC,eACAC,uBACAC,UAAU,EAAE,EACZC,WACAC,cACAC,kBAAkB,EAAA,OACd;CACJ,MAAMC,iBAAiBJ,QAAQK,QAAQC,QAAQ,CAACA,IAAIC,SAAS;CAC7D,MAAMC,aAAaR,QAAQS,MAAMH,QAAQA,IAAII,KAAK;CAElD,MAAMC,aAAa3B,iBAAiB4B,UAAUA,MAAMC,OAAO;AAE3D3B,iBAAgB;AACdS,iBAAemB,SAASC,SAAS;GAAEC,KAAK;GAAGC,UAAU;GAAW,CAAC;IAChE,CAACtB,gBAAgBgB,WAAW,CAAC;AAEhC,QACE,qBAAA,YAAA,EAAA,UAAA,CACGjB,cACC,oBAAC,cAAD;EACE,aAAY;EACZ,YAAYwB,MAAM;AAMhB,OAAI,EALwB;IAC1B;IACA;IACA;IACD,CAACE,SAASF,EAAEG,IAAI,IACYjB,eAAekB,SAAS,GACnDJ,GAAEK,iBAAiB;;EAGvB,kBAAiB;EACjB,WAAU;EAEb,CAAA,EACD,qBAAC,aAAD;EAAa,KAAK5B;EAAgB,UAAU,CAACD,aAAa,IAAI8B,KAAAA;YAA9D;GACE,oBAAC,cAAD;IAAc,WAAU;cAAuD;IAEjE,CAAA;GACb5B,YAAYe,eAAe,MAC1B,oBAAC,cAAD;IAAc,WAAU;cACtB,oBAAC,aAAD;KACE,OAAM;KACN,UAAUV;KACV,UAAU;KACV,WAAWlB,QACT,kBACA,iCACD;KACD,MAAK;KACL,iBAAec,eAAeyB,WAAWlB,eAAekB;eAExD,qBAAC,OAAD;MAAK,WAAU;gBAAf;OACGxB,kBAAkB,UACjB,oBAAC,OAAD;QACE,WAAWf,QACT,6DACA,qBACAc,eAAeyB,WAAWlB,eAAekB,UACvC,qCACH;kBAEAzB,eAAeyB,WAAWlB,eAAekB,UACxC,oBAAC,MAAD;SAAM,MAAK;SAAY,MAAM;SAC9B,CAAA;QAEJ,CAAA;OACAxB,kBAAkB,eACjB,EAAEC,0BAA0B,WAAWS,eACrC,oBAAC,OAAD;QAAK,WAAU;kBACZT,0BAA0B,UACzBF,eAAeyB,WAAWlB,eAAekB,UACvC,oBAAC,MAAD;SACE,MAAK;SACL,MAAM;SACN,WAAU;SAEb,CAAA;QAEN,CAAA;OACH,oBAAC,QAAD;QAAM,WAAU;kBACbzB,eAAeyB,WAAWlB,eAAekB,SACtC,iBACA;QACA,CAAA;OACLxB,kBAAkB,eACjBC,0BAA0B,WACxB,oBAAC,OAAD;QAAK,WAAU;kBACZF,eAAeyB,WAAWlB,eAAekB,UACxC,oBAAC,MAAD;SACE,MAAK;SACL,MAAM;SACN,WAAU;SAEb,CAAA;QAEJ,CAAA;OACA;;KACM,CAAA;IAEhB,CAAA;GACD,qBAAC,cAAD;IACE,WAAW1B,YAAYe,eAAe,KAAK,SAASa,KAAAA;cADtD;KAGE,oBAAC,iBAAD;MACE,SAASrB;MACON;MACND;MACKE;MACQC;MACXS;MACEN;MACd,UAAU,CAACR,aAAa,IAAI8B,KAAAA;MAAU,CAAA;KAGvCrB,gBAAgBmB,SAAS,KACxB,oBAAC,OAAD,EAAK,WAAU,+BAChB,CAAA;KACD,oBAAC,iBAAD;MACWtB;MACOH;MACND;MACKE;MACQC;MACXS;MACEN;MACd,UAAU,CAACR,aAAa,IAAI8B,KAAAA;MAAU,CAAA;KAE5B;;GACH;IACZ,EAAA,CAAA"}
+{"version":3,"file":"content.js","names":["Icon","twMerge","useCommandState","React","useEffect","CommandEmpty","CommandGroup","CommandInput","CommandItem","CommandList","CommandItemList","Content","searchable","commandListRef","multiple","selectedValues","selectionIcon","selectionIconPosition","options","toggleAll","toggleOption","favoriteOptions","enabledOptions","filter","opt","disabled","hasAnyIcon","some","icon","cmdkSearch","state","search","current","scrollTo","top","behavior","e","isOptionsRelatedKey","includes","key","length","stopPropagation","undefined"],"sources":["../../../../src/ui/components/select-field/content.tsx"],"sourcesContent":["import { Icon } from \"#design-system\";\nimport { twMerge } from \"tailwind-merge\";\nimport { useCommandState } from \"cmdk\";\nimport React, { useEffect } from \"react\";\nimport {\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from \"../command/command.js\";\nimport type { SelectProps } from \"../enum-field/types.js\";\nimport { CommandItemList } from \"./subcomponents/CommandItemList.js\";\ninterface ContentProps {\n  searchable?: boolean;\n  commandListRef: React.RefObject<HTMLDivElement | null>;\n  multiple?: boolean;\n  selectedValues: string[];\n  selectionIcon: \"auto\" | \"checkmark\";\n  selectionIconPosition: \"left\" | \"right\";\n  options: SelectProps[\"options\"];\n  favoriteOptions?: SelectProps[\"options\"];\n  toggleAll: () => void;\n  toggleOption: (value: string) => void;\n}\n\nexport const Content: React.FC<ContentProps> = ({\n  searchable,\n  commandListRef,\n  multiple,\n  selectedValues,\n  selectionIcon,\n  selectionIconPosition,\n  options = [],\n  toggleAll,\n  toggleOption,\n  favoriteOptions = [],\n}) => {\n  const enabledOptions = options.filter((opt) => !opt.disabled);\n  const hasAnyIcon = options.some((opt) => opt.icon);\n\n  const cmdkSearch = useCommandState((state) => state.search);\n  // scroll to top when search change\n  useEffect(() => {\n    commandListRef.current?.scrollTo({ top: 0, behavior: \"instant\" });\n  }, [commandListRef, cmdkSearch]);\n\n  return (\n    <>\n      {searchable && (\n        <CommandInput\n          placeholder=\"Search...\"\n          onKeyDown={(e) => {\n            const isOptionsRelatedKey = [\n              \"ArrowUp\",\n              \"ArrowDown\",\n              \"Enter\",\n            ].includes(e.key);\n            if (!(isOptionsRelatedKey && enabledOptions.length > 0)) {\n              e.stopPropagation();\n            }\n          }}\n          wrapperClassName=\"rounded-t\"\n          className=\"text-foreground\"\n        />\n      )}\n      <CommandList ref={commandListRef} tabIndex={!searchable ? 0 : undefined}>\n        <CommandEmpty className=\"p-4 text-center text-sm/5 font-normal text-foreground\">\n          No results found.\n        </CommandEmpty>\n        {multiple && cmdkSearch === \"\" && (\n          <CommandGroup className=\"pb-0\">\n            <CommandItem\n              value=\"select-all\"\n              onSelect={toggleAll}\n              disabled={false}\n              className={twMerge(\n                \"cursor-pointer\",\n                \"data-[selected=true]:bg-accent\",\n              )}\n              role=\"option\"\n              aria-selected={selectedValues.length === enabledOptions.length}\n            >\n              <div className=\"flex w-full items-center gap-2\">\n                {selectionIcon === \"auto\" && (\n                  <div\n                    className={twMerge(\n                      \"flex size-4 items-center justify-center rounded-md border\",\n                      \"border-foreground\",\n                      selectedValues.length === enabledOptions.length &&\n                        \"bg-primary text-primary-foreground\",\n                    )}\n                  >\n                    {selectedValues.length === enabledOptions.length && (\n                      <Icon name=\"Checkmark\" size={16} />\n                    )}\n                  </div>\n                )}\n                {selectionIcon === \"checkmark\" &&\n                  !(selectionIconPosition === \"right\" && hasAnyIcon) && (\n                    <div className=\"size-4\">\n                      {selectionIconPosition === \"left\" &&\n                        selectedValues.length === enabledOptions.length && (\n                          <Icon\n                            name=\"Checkmark\"\n                            size={16}\n                            className=\"text-foreground\"\n                          />\n                        )}\n                    </div>\n                  )}\n                <span className=\"text-sm/4 font-semibold text-foreground\">\n                  {selectedValues.length === enabledOptions.length\n                    ? \"Deselect All\"\n                    : \"Select All\"}\n                </span>\n                {selectionIcon === \"checkmark\" &&\n                  selectionIconPosition === \"right\" && (\n                    <div className=\"ml-auto size-4\">\n                      {selectedValues.length === enabledOptions.length && (\n                        <Icon\n                          name=\"Checkmark\"\n                          size={16}\n                          className=\"text-foreground\"\n                        />\n                      )}\n                    </div>\n                  )}\n              </div>\n            </CommandItem>\n          </CommandGroup>\n        )}\n        <CommandGroup\n          className={multiple && cmdkSearch === \"\" ? \"pt-0\" : undefined}\n        >\n          <CommandItemList\n            options={favoriteOptions}\n            selectedValues={selectedValues}\n            multiple={multiple}\n            selectionIcon={selectionIcon}\n            selectionIconPosition={selectionIconPosition}\n            hasAnyIcon={hasAnyIcon}\n            toggleOption={toggleOption}\n            tabIndex={!searchable ? 0 : undefined}\n          />\n\n          {favoriteOptions.length > 0 && (\n            <div className=\"my-1 border-b border-border\" />\n          )}\n          <CommandItemList\n            options={options}\n            selectedValues={selectedValues}\n            multiple={multiple}\n            selectionIcon={selectionIcon}\n            selectionIconPosition={selectionIconPosition}\n            hasAnyIcon={hasAnyIcon}\n            toggleOption={toggleOption}\n            tabIndex={!searchable ? 0 : undefined}\n          />\n        </CommandGroup>\n      </CommandList>\n    </>\n  );\n};\n"],"mappings":";;;;;;;;AA0BA,MAAaW,WAAmC,EAC9CC,YACAC,gBACAC,UACAC,gBACAC,eACAC,uBACAC,UAAU,CAAA,GACVC,WACAC,cACAC,kBAAkB,CAAA,QACd;CACJ,MAAMC,iBAAiBJ,QAAQK,QAAQC,QAAQ,CAACA,IAAIC,QAAQ;CAC5D,MAAMC,aAAaR,QAAQS,MAAMH,QAAQA,IAAII,IAAI;CAEjD,MAAMC,aAAa3B,iBAAiB4B,UAAUA,MAAMC,MAAM;CAE1D3B,gBAAgB;EACdS,eAAemB,SAASC,SAAS;GAAEC,KAAK;GAAGC,UAAU;EAAU,CAAC;CAClE,GAAG,CAACtB,gBAAgBgB,UAAU,CAAC;CAE/B,OACE,qBAAA,YAAA,EAAA,UAAA,CACGjB,cACC,oBAAC,cAAD;EACE,aAAY;EACZ,YAAYwB,MAAM;GAMhB,IAAI,EALwB;IAC1B;IACA;IACA;GAAO,CACR,CAACE,SAASF,EAAEG,GACPF,KAAuBf,eAAekB,SAAS,IACnDJ,EAAEK,gBAAgB;EAEtB;EACA,kBAAiB;EACjB,WAAU;CAAiB,CAAA,GAG/B,qBAAC,aAAD;EAAa,KAAK5B;EAAgB,UAAU,CAACD,aAAa,IAAI8B,KAAAA;EAA9D,UAAA;GACE,oBAAC,cAAD;IAAc,WAAU;IAAuD,UAAA;GAEjE,CAAA;GACb5B,YAAYe,eAAe,MAC1B,oBAAC,cAAD;IAAc,WAAU;IACtB,UAAA,oBAAC,aAAD;KACE,OAAM;KACN,UAAUV;KACV,UAAU;KACV,WAAWlB,QACT,kBACA,gCACF;KACA,MAAK;KACL,iBAAec,eAAeyB,WAAWlB,eAAekB;KAExD,UAAA,qBAAC,OAAD;MAAK,WAAU;MAAf,UAAA;OACGxB,kBAAkB,UACjB,oBAAC,OAAD;QACE,WAAWf,QACT,6DACA,qBACAc,eAAeyB,WAAWlB,eAAekB,UACvC,oCACJ;QAECzB,UAAAA,eAAeyB,WAAWlB,eAAekB,UACxC,oBAAC,MAAD;SAAM,MAAK;SAAY,MAAM;QAAG,CAAA;OAE/B,CAAA;OAENxB,kBAAkB,eACjB,EAAEC,0BAA0B,WAAWS,eACrC,oBAAC,OAAD;QAAK,WAAU;QACZT,UAAAA,0BAA0B,UACzBF,eAAeyB,WAAWlB,eAAekB,UACvC,oBAAC,MAAD;SACE,MAAK;SACL,MAAM;SACN,WAAU;QAAiB,CAAA;OAG9B,CAAA;OAET,oBAAC,QAAD;QAAM,WAAU;QACbzB,UAAAA,eAAeyB,WAAWlB,eAAekB,SACtC,iBACA;OACA,CAAA;OACLxB,kBAAkB,eACjBC,0BAA0B,WACxB,oBAAC,OAAD;QAAK,WAAU;QACZF,UAAAA,eAAeyB,WAAWlB,eAAekB,UACxC,oBAAC,MAAD;SACE,MAAK;SACL,MAAM;SACN,WAAU;QAAiB,CAAA;OAG5B,CAAA;MAEN;;IACM,CAAA;GACD,CAAA;GAEhB,qBAAC,cAAD;IACE,WAAW1B,YAAYe,eAAe,KAAK,SAASa,KAAAA;IADtD,UAAA;KAGE,oBAAC,iBAAD;MACE,SAASrB;MACON;MACND;MACKE;MACQC;MACXS;MACEN;MACd,UAAU,CAACR,aAAa,IAAI8B,KAAAA;KAAU,CAAA;KAGvCrB,gBAAgBmB,SAAS,KACxB,oBAAC,OAAD,EAAK,WAAU,8BAA6B,CAAA;KAE9C,oBAAC,iBAAD;MACWtB;MACOH;MACND;MACKE;MACQC;MACXS;MACEN;MACd,UAAU,CAACR,aAAa,IAAI8B,KAAAA;KAAU,CAAA;IAE5B;;EACH;CACf,CAAA,CAAA,EAAA,CAAA;AAEJ"}

package/dist/ui/components/select-field/select-field.d.ts

@@ -1,2 +1,3 @@
-import { n as SelectFieldProps, r as SelectFieldRaw, t as SelectField } from "../../../select-field-C97QIhUL.js";
-export { SelectField, SelectFieldProps, SelectFieldRaw };
+import { n as SelectFieldProps, r as SelectFieldRaw, t as SelectField } from "../../../select-field-VZPf666l.js";
+export { SelectField, SelectFieldProps, SelectFieldRaw };
+export {};

package/dist/ui/components/select-field/select-field.js

@@ -13,7 +13,7 @@ import React, { useCallback, useId } from "react";
 import { twMerge } from "tailwind-merge";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/ui/components/select-field/select-field.tsx
-const SelectFieldRaw = /* @__PURE__ */ React.forwardRef(({ options = [], favoriteOptions = [], defaultValue, value, onChange, onBlur, id: propId, name, label, required, disabled, errors = [], warnings = [], multiple, selectionIcon = "auto", selectionIconPosition = "left", searchable, description, placeholder, className, contentClassName, contentAlign = "start", ...props }, ref) => {
+const SelectFieldRaw = /*#__PURE__*/ React.forwardRef(({ options = [], favoriteOptions = [], defaultValue, value, onChange, onBlur, id: propId, name, label, required, disabled, errors = [], warnings = [], multiple, selectionIcon = "auto", selectionIconPosition = "left", searchable, description, placeholder, className, contentClassName, contentAlign = "start", ...props }, ref) => {
 	const prefix = useId();
 	const id = propId ?? `${prefix}-select`;
 	const { selectedValues, isPopoverOpen, commandListRef, toggleOption, handleClear, toggleAll, handleOpenChange } = useSelectField({

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

@@ -1 +1 @@
-{"version":3,"file":"select-field.js","names":["twMerge","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 { twMerge } from \"tailwind-merge\";\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={twMerge(\n                \"flex h-9 w-full items-center justify-between px-3 py-2\",\n                \"rounded-md border border-border bg-background\",\n                \"hover:hover-effect\",\n                \"hover:hover-effect\",\n                \"focus:ring-1 focus:ring-ring focus:ring-offset-0 focus:outline-none\",\n                \"focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0\",\n                disabled && [\n                  \"pointer-events-auto! cursor-not-allowed bg-background\",\n                  \"hover:hover-effect\",\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,QACT,0DACA,iDACA,sBACA,sBACA,uEACA,4EACA8B,YAAY,CACV,yDACA,qBACD,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"}
+{"version":3,"file":"select-field.js","names":["twMerge","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 { twMerge } from \"tailwind-merge\";\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={twMerge(\n                \"flex h-9 w-full items-center justify-between px-3 py-2\",\n                \"rounded-md border border-border bg-background\",\n                \"hover:hover-effect\",\n                \"hover:hover-effect\",\n                \"focus:ring-1 focus:ring-ring focus:ring-offset-0 focus:outline-none\",\n                \"focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0\",\n                disabled && [\n                  \"pointer-events-auto! cursor-not-allowed bg-background\",\n                  \"hover:hover-effect\",\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,oBAAMiB,YAKhC,EAEEC,UAAU,CAAA,GACVC,kBAAkB,CAAA,GAClBC,cACAC,OACAC,UACAC,QAGAC,IAAIC,QACJC,MACAC,OACAC,UACAC,UAGAC,SAAS,CAAA,GACTC,WAAW,CAAA,GAGXC,UACAC,gBAAgB,QAChBC,wBAAwB,QACxBC,YAGAC,aACAC,aACAC,WACAC,kBACAC,eAAe,SAEf,GAAGC,SAELC,QACG;CACH,MAAMC,SAASzC,MAAM;CACrB,MAAMsB,KAAKC,UAAU,GAAGkB,OAAM;CAE9B,MAAM,EACJC,gBACAC,eACAC,gBACAC,cACAC,aACAC,WACAC,qBACEnC,eAAe;EACjBG;EACAc;EACAZ;EACAC;EACAC;CACF,CAAC;CAED,MAAM6B,gBAAgBlD,aACnBmD,MAA2C;EAC1C,IAAI,CAACP,eAGHtB,SAAS6B,CAAC;CAEd,GACA,CAAC7B,QAAQsB,aAAa,CACxB;CAEA,OACE,qBAAC,WAAD,EAAA,UAAA;EACGlB,SACC,oBAAC,WAAD;GACE,SAASH;GACCI;GACAC;GACV,UAAUC,OAAOuB,SAAS;GAC1B,QAAQ;GACR,UAAUD,MAAM;IACdA,EAAEE,eAAe;IAChBF,EAAEG,OAA4BC,SAASC,MAAM;GAChD;GAEC9B,UAAAA;EACQ,CAAA;EAEb,qBAAC,SAAD;GACE,MAAMkB;GACN,eAAea,SAAS;IACtBR,iBAAiBQ,IAAI;IAErB,IAAI,CAACA,QAAQC,SAASC,eAAepC,OAAOA,IAC1CD,SAAS,EAAEgC,QAAQ,CAAC,EAAE,CAAwC;GAElE;GARF,UAAA,CAUE,oBAAC,gBAAD;IAAgB,SAAS;IAEvB,UAAA,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,QACT,0DACA,iDACA,sBACA,sBACA,uEACA,4EACA8B,YAAY,CACV,yDACA,oBAAoB,GAEtBS,SACF;KACA,GAAIG;KACCC;KAEL,UAAA,oBAAC,iBAAD;MACkBE;MAChB,SAAS,CAAC,GAAGzB,iBAAiB,GAAGD,OAAO;MAC9Bc;MACEG;MACCE;MACAW;KAAY,CAAA;IAErB,CAAA;GACM,CAAA,GAChB,oBAAC,gBAAD;IACE,OAAOR;IACP,kBAAkBY,MAAM;KACtBA,EAAEE,eAAe;KACjBJ,iBAAiB,KAAK;IACxB;IACA,WAAWX;IAEX,UAAA,oBAAC,SAAD;KACE,cACE,CAACP,YAAYY,eAAe,KACxB1B,QAAQ4C,MAAMC,QAAQA,IAAI1C,UAAUuB,eAAe,EAAE,CAAC,EAClDjB,QACJkC,KAAAA;KAGN,UAAA,oBAAC,SAAD;MACmB1C;MACLgB;MACIW;MACNd;MACMY;MACDX;MACQC;MACdhB;MACE+B;MACGF;KAAa,CAAA;IAEtB,CAAA;GACK,CAAA,CACT;;EACRX,eAAe,oBAAC,iBAAD,EAAA,UAAkBA,YAA6B,CAAA;EAC9DL,SAASsB,SAAS,KACjB,oBAAC,iBAAD;GAAiB,UAAUtB;GAAU,MAAK;EAAS,CAAA;EAEpDD,OAAOuB,SAAS,KACf,oBAAC,iBAAD;GAAiB,UAAUvB;GAAQ,MAAK;EAAO,CAAA;CAExC,EAAA,CAAA;AAEf,CACF;AAEA,MAAakC,cACXpD,oBAAsCI,cAAc;AAEtDgD,YAAYC,cAAc"}

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

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

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

@@ -1,4 +1,4 @@
-import { t as Icon } from "../../../icon-C4QOpsdI.js";
+import { t as Icon } from "../../../icon-CHR45tj_.js";
 import React from "react";
 import { twMerge } from "tailwind-merge";
 import { jsx, jsxs } from "react/jsx-runtime";

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

@@ -1 +1 @@
-{"version":3,"file":"selected-content.js","names":["Icon","twMerge","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 { Icon } from \"#design-system\";\nimport { twMerge } from \"tailwind-merge\";\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={twMerge(\n          \"mx-auto flex w-full items-center\",\n          placeholder ? \"justify-between\" : \"justify-end\",\n        )}\n      >\n        {placeholder && (\n          <span className=\"text-sm/5 font-normal text-foreground\">\n            {placeholder}\n          </span>\n        )}\n        {searchable ? (\n          <Icon\n            name=\"CaretSort\"\n            size={16}\n            className=\"cursor-pointer text-foreground\"\n          />\n        ) : (\n          <Icon\n            name=\"ChevronDown\"\n            size={16}\n            className=\"cursor-pointer text-foreground\"\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={twMerge(\n          \"max-w-full truncate text-foreground\",\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-sm/5 font-normal\">\n                {option?.label}\n              </span>\n            </React.Fragment>\n          ) : (\n            <span\n              key={value}\n              className={twMerge(\n                \"text-sm/5 font-normal\",\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-foreground\"\n            />\n          </div>\n        )}\n        {searchable ? (\n          <Icon\n            name=\"CaretSort\"\n            size={16}\n            className=\"cursor-pointer text-foreground\"\n          />\n        ) : (\n          <Icon\n            name=\"ChevronDown\"\n            size={16}\n            className=\"cursor-pointer text-foreground\"\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;AAeA,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,WAAWX,QACT,oCACAO,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,WAAWN,QACT,uCACA,CAACK,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,WAAWb,QACT,yBACAc,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;KAAgC,CAAA;IAG/C,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"}
+{"version":3,"file":"selected-content.js","names":["Icon","twMerge","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 { Icon } from \"#design-system\";\nimport { twMerge } from \"tailwind-merge\";\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={twMerge(\n          \"mx-auto flex w-full items-center\",\n          placeholder ? \"justify-between\" : \"justify-end\",\n        )}\n      >\n        {placeholder && (\n          <span className=\"text-sm/5 font-normal text-foreground\">\n            {placeholder}\n          </span>\n        )}\n        {searchable ? (\n          <Icon\n            name=\"CaretSort\"\n            size={16}\n            className=\"cursor-pointer text-foreground\"\n          />\n        ) : (\n          <Icon\n            name=\"ChevronDown\"\n            size={16}\n            className=\"cursor-pointer text-foreground\"\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={twMerge(\n          \"max-w-full truncate text-foreground\",\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-sm/5 font-normal\">\n                {option?.label}\n              </span>\n            </React.Fragment>\n          ) : (\n            <span\n              key={value}\n              className={twMerge(\n                \"text-sm/5 font-normal\",\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-foreground\"\n            />\n          </div>\n        )}\n        {searchable ? (\n          <Icon\n            name=\"CaretSort\"\n            size={16}\n            className=\"cursor-pointer text-foreground\"\n          />\n        ) : (\n          <Icon\n            name=\"ChevronDown\"\n            size={16}\n            className=\"cursor-pointer text-foreground\"\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;AAeA,MAAaG,mBAAmD,EAC9DC,gBACAC,UAAU,CAAA,GACVC,UACAC,YACAC,aACAC,kBACI;CACJ,MAAMC,cACJC,kBAIG;EACH,IAAI,OAAOA,kBAAkB,UAC3B,OAAO,oBAAC,MAAD;GAAM,MAAMA;GAAe,MAAM;EAAG,CAAA;EAE7C,OAAOA,iBAAiB,oBAAC,eAAD,EAAe,WAAU,SAAQ,CAAA;CAC3D;CAEA,IAAIP,eAAeQ,WAAW,GAC5B,OACE,qBAAC,OAAD;EACE,WAAWX,QACT,oCACAO,cAAc,oBAAoB,aACpC;EAJF,UAAA,CAMGA,eACC,oBAAC,QAAD;GAAM,WAAU;GACbA,UAAAA;EACG,CAAA,GAEPD,aACC,oBAAC,MAAD;GACE,MAAK;GACL,MAAM;GACN,WAAU;EAAgC,CAAA,IAG5C,oBAAC,MAAD;GACE,MAAK;GACL,MAAM;GACN,WAAU;EAAgC,CAAA,CAG3C;;CAIT,OACE,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACE,oBAAC,OAAD;GACE,WAAWN,QACT,uCACA,CAACK,YAAY,yBACf;GAECF,UAAAA,eAAeS,KAAKC,OAAOC,UAAU;IACpC,MAAMC,SAASX,QAAQY,MAAMC,MAAMA,EAAEJ,UAAUA,KAAK;IACpD,OAAO,CAACR,WACN,qBAAC,MAAM,UAAP,EAAA,UAAA,CACGI,WAAWM,QAAQG,IAAI,GACxB,oBAAC,QAAD;KAAM,WAAU;KACbH,UAAAA,QAAQI;IACL,CAAA,CACQ,EAAA,GALKN,KAKL,IAEhB,oBAAC,QAAD;KAEE,WAAWb,QACT,yBACAc,UAAUX,eAAeQ,SAAS,KAAK,MACzC;KAECG,UAAAA,UAAUX,eAAeQ,SAAS,IAC/B,GAAGI,QAAQI,MAAK,KAChBJ,QAAQI;IACR,GATCN,KASD;GAEV,CAAC;EACE,CAAA,GACL,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACGR,YAAYF,eAAeQ,SAAS,KACnC,oBAAC,OAAD;IACE,UAAUS,MAAM;KACdA,EAAEC,eAAe;KACjBD,EAAEE,gBAAgB;KAClBd,YAAY;IACd;IACA,WAAU;IAEV,UAAA,oBAAC,MAAD;KACE,MAAK;KACL,MAAM;KACN,WAAU;IAAgC,CAAA;GAEzC,CAAA,GAENF,aACC,oBAAC,MAAD;IACE,MAAK;IACL,MAAM;IACN,WAAU;GAAgC,CAAA,IAG5C,oBAAC,MAAD;IACE,MAAK;IACL,MAAM;IACN,WAAU;GAAgC,CAAA,CAG3C;EACF,CAAA,CAAA;;AAET"}

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

@@ -1,6 +1,5 @@
-import { C as SelectProps } from "../../../../index--hDSfvJT.js";
+import { C as SelectProps } from "../../../../index-Ck34z7kD.js";
 import React from "react";
-
 //#region src/ui/components/select-field/subcomponents/CommandItemList.d.ts
 interface FavoriteOptionsProps {
   options: SelectProps["options"];
@@ -12,7 +11,7 @@ interface FavoriteOptionsProps {
   toggleOption: (value: string) => void;
   tabIndex?: number;
 }
-declare const CommandItemList: React.FC<FavoriteOptionsProps>;
+export declare const CommandItemList: React.FC<FavoriteOptionsProps>;
 //#endregion
-export { CommandItemList };
+export {};
 //# sourceMappingURL=CommandItemList.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"CommandItemList.d.ts","names":[],"sources":["../../../../../src/ui/components/select-field/subcomponents/CommandItemList.tsx"],"mappings":";;;;UAOU,oBAAA;EACR,OAAA,EAAS,WAAA;EACT,cAAA;EACA,QAAA;EACA,aAAA;EACA,qBAAA;EACA,UAAA;EACA,YAAA,GAAe,KAAA;EACf,QAAA;AAAA;AAAA,cAyBW,eAAA,EAAiB,KAAA,CAAM,EAAA,CAAG,oBAAA"}
+{"version":3,"file":"CommandItemList.d.ts","names":[],"sources":["../../../../../src/ui/components/select-field/subcomponents/CommandItemList.tsx"],"mappings":";;;UAOU;EACR,SAAS;EACT;EACA;EACA;EACA;EACA;EACA,eAAe;EACf;;qBAyBW,iBAAiB,MAAM,GAAG"}

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

@@ -1,4 +1,4 @@
-import { t as Icon } from "../../../../icon-C4QOpsdI.js";
+import { t as Icon } from "../../../../icon-CHR45tj_.js";
 import { CommandItem } from "../../command/command.js";
 import "react";
 import { twMerge } from "tailwind-merge";

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

@@ -1 +1 @@
-{"version":3,"file":"CommandItemList.js","names":["Icon","React","twMerge","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 { Icon } from \"#design-system\";\nimport React from \"react\";\nimport { twMerge } from \"tailwind-merge\";\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={twMerge(\"text-foreground\")}\n      />\n    );\n  }\n  return (\n    IconComponent && (\n      <IconComponent className={twMerge(\"size-4\", \"text-foreground\")} />\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={twMerge(\n              \"cursor-pointer\",\n              \"data-[selected=true]:bg-accent\",\n              opt.disabled &&\n                \"pointer-events-auto! cursor-not-allowed hover:hover-effect\",\n            )}\n            role=\"option\"\n            aria-selected={isSelected}\n          >\n            {selectionIcon === \"auto\" &&\n              (multiple ? (\n                <div\n                  className={twMerge(\n                    \"flex size-4 items-center justify-center rounded-md border\",\n                    \"border-foreground\",\n                    isSelected && \"bg-primary text-primary-foreground\",\n                  )}\n                >\n                  {isSelected && <Icon name=\"Checkmark\" size={16} />}\n                </div>\n              ) : (\n                <div\n                  className={twMerge(\n                    \"relative size-4 rounded-full border\",\n                    isSelected ? \"border-foreground\" : \"border-foreground\",\n                    \"bg-transparent\",\n                  )}\n                >\n                  {isSelected && (\n                    <div className=\"absolute top-1/2 left-1/2 size-2.5 -translate-1/2 rounded-full bg-primary\" />\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-foreground\"\n                    />\n                  )}\n                </div>\n              )}\n            {renderIcon(opt.icon)}\n            <span\n              className={twMerge(\n                \"flex-1 truncate text-sm/4 font-normal\",\n                \"text-foreground\",\n                opt.disabled && \"text-foreground\",\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-foreground\"\n                    />\n                  )}\n                </div>\n              )}\n          </CommandItem>\n        );\n      })}\n    </>\n  );\n};\n"],"mappings":";;;;;;AAkBA,MAAMI,cACJC,kBAIG;AACH,KAAI,OAAOA,kBAAkB,SAC3B,QACE,oBAAC,MAAD;EACE,MAAMA;EACN,MAAM;EACN,WAAWH,QAAQ,kBAAkB;EACrC,CAAA;AAGN,QACEG,iBACE,oBAAC,eAAD,EAAe,WAAWH,QAAQ,UAAU,kBAAkB,EAC/D,CAAA;;AAIL,MAAaI,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,WAAWnB,QACT,kBACA,kCACAc,IAAIK,YACF,6DACH;GACD,MAAK;GACL,iBAAeJ;aAbjB;IAeGP,kBAAkB,WAChBD,WACC,oBAAC,OAAD;KACE,WAAWP,QACT,6DACA,qBACAe,cAAc,qCACf;eAEAA,cAAc,oBAAC,MAAD;MAAM,MAAK;MAAY,MAAM;MAAM,CAAA;KAC9C,CAAA,GAEN,oBAAC,OAAD;KACE,WAAWf,QACT,uCACAe,aAAa,sBAAsB,qBACnC,iBACD;eAEAA,cACC,oBAAC,OAAD,EAAK,WAAU,6EAChB,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,WAAWpB,QACT,yCACA,mBACAc,IAAIK,YAAY,kBACjB;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;KAvEP,YAAYD,IAAIG,QAuET;GAEhB,EACD,CAAA"}
+{"version":3,"file":"CommandItemList.js","names":["Icon","React","twMerge","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 { Icon } from \"#design-system\";\nimport React from \"react\";\nimport { twMerge } from \"tailwind-merge\";\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={twMerge(\"text-foreground\")}\n      />\n    );\n  }\n  return (\n    IconComponent && (\n      <IconComponent className={twMerge(\"size-4\", \"text-foreground\")} />\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={twMerge(\n              \"cursor-pointer\",\n              \"data-[selected=true]:bg-accent\",\n              opt.disabled &&\n                \"pointer-events-auto! cursor-not-allowed hover:hover-effect\",\n            )}\n            role=\"option\"\n            aria-selected={isSelected}\n          >\n            {selectionIcon === \"auto\" &&\n              (multiple ? (\n                <div\n                  className={twMerge(\n                    \"flex size-4 items-center justify-center rounded-md border\",\n                    \"border-foreground\",\n                    isSelected && \"bg-primary text-primary-foreground\",\n                  )}\n                >\n                  {isSelected && <Icon name=\"Checkmark\" size={16} />}\n                </div>\n              ) : (\n                <div\n                  className={twMerge(\n                    \"relative size-4 rounded-full border\",\n                    isSelected ? \"border-foreground\" : \"border-foreground\",\n                    \"bg-transparent\",\n                  )}\n                >\n                  {isSelected && (\n                    <div className=\"absolute top-1/2 left-1/2 size-2.5 -translate-1/2 rounded-full bg-primary\" />\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-foreground\"\n                    />\n                  )}\n                </div>\n              )}\n            {renderIcon(opt.icon)}\n            <span\n              className={twMerge(\n                \"flex-1 truncate text-sm/4 font-normal\",\n                \"text-foreground\",\n                opt.disabled && \"text-foreground\",\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-foreground\"\n                    />\n                  )}\n                </div>\n              )}\n          </CommandItem>\n        );\n      })}\n    </>\n  );\n};\n"],"mappings":";;;;;;AAkBA,MAAMI,cACJC,kBAIG;CACH,IAAI,OAAOA,kBAAkB,UAC3B,OACE,oBAAC,MAAD;EACE,MAAMA;EACN,MAAM;EACN,WAAWH,QAAQ,iBAAiB;CAAE,CAAA;CAI5C,OACEG,iBACE,oBAAC,eAAD,EAAe,WAAWH,QAAQ,UAAU,iBAAiB,EAAE,CAAA;AAGrE;AAEA,MAAaI,mBAAmD,EAC9DC,UAAU,CAAA,GACVC,gBACAC,UACAC,eACAC,uBACAC,YACAC,cACAC,eACI;CACJ,OACE,oBAAA,YAAA,EAAA,UACGP,QAAQQ,KAAKC,QAAQ;EACpB,MAAMC,aAAaT,eAAeU,SAASF,IAAIG,KAAK;EACpD,OACE,qBAAC,aAAD;GACYL;GAEV,OAAOE,IAAII;GACX,gBAAgB,CAACJ,IAAIK,YAAYR,aAAaG,IAAIG,KAAK;GACvD,UAAUH,IAAIK;GACd,WAAWnB,QACT,kBACA,kCACAc,IAAIK,YACF,4DACJ;GACA,MAAK;GACL,iBAAeJ;GAbjB,UAAA;IAeGP,kBAAkB,WAChBD,WACC,oBAAC,OAAD;KACE,WAAWP,QACT,6DACA,qBACAe,cAAc,oCAChB;KAECA,UAAAA,cAAc,oBAAC,MAAD;MAAM,MAAK;MAAY,MAAM;KAAG,CAAA;IAC5C,CAAA,IAEL,oBAAC,OAAD;KACE,WAAWf,QACT,uCACAe,aAAa,sBAAsB,qBACnC,gBACF;KAECA,UAAAA,cACC,oBAAC,OAAD,EAAK,WAAU,4EAA2E,CAAA;IAEzF,CAAA;IAERP,kBAAkB,eACjB,EAAEC,0BAA0B,WAAWC,eACrC,oBAAC,OAAD;KAAK,WAAU;KACZD,UAAAA,0BAA0B,UAAUM,cACnC,oBAAC,MAAD;MACE,MAAK;MACL,MAAM;MACN,WAAU;KAAiB,CAAA;IAG5B,CAAA;IAERb,WAAWY,IAAIM,IAAI;IACpB,oBAAC,QAAD;KACE,WAAWpB,QACT,yCACA,mBACAc,IAAIK,YAAY,iBAClB;KAECL,UAAAA,IAAII;IACD,CAAA;IACLV,kBAAkB,eACjBC,0BAA0B,WACxB,oBAAC,OAAD;KAAK,WAAU;KACZM,UAAAA,cACC,oBAAC,MAAD;MACE,MAAK;MACL,MAAM;MACN,WAAU;KAAiB,CAAA;IAG5B,CAAA;GAEE;EAvEN,GAAA,YAAYD,IAAIG,OAuEV;CAEjB,CAAC,EACH,CAAA;AAEJ"}

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

@@ -1,6 +1,4 @@
-import { C as SelectProps } from "../../../index--hDSfvJT.js";
-import * as react from "react";
-
+import { C as SelectProps } from "../../../index-Ck34z7kD.js";
 //#region src/ui/components/select-field/use-select-field.d.ts
 interface UseSelectFieldProps {
   options?: SelectProps["options"];
@@ -9,21 +7,15 @@ interface UseSelectFieldProps {
   value?: string | string[];
   onChange?: (value: string | string[]) => void;
 }
-declare function useSelectField({
-  options,
-  multiple,
-  defaultValue,
-  value,
-  onChange
-}: UseSelectFieldProps): {
+export declare function useSelectField({ options, multiple, defaultValue, value, onChange }: UseSelectFieldProps): {
   selectedValues: string[];
   isPopoverOpen: boolean;
-  commandListRef: react.RefObject<HTMLDivElement | null>;
+  commandListRef: import("react").RefObject<HTMLDivElement | null>;
   toggleOption: (optionValue: string) => void;
   handleClear: () => void;
   toggleAll: () => void;
   handleOpenChange: (open: boolean) => void;
 };
 //#endregion
-export { useSelectField };
+export {};
 //# sourceMappingURL=use-select-field.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"use-select-field.d.ts","names":[],"sources":["../../../../src/ui/components/select-field/use-select-field.ts"],"mappings":";;;;UAGU,mBAAA;EACR,OAAA,GAAU,WAAA;EACV,QAAA;EACA,YAAA;EACA,KAAA;EACA,QAAA,IAAY,KAAA;AAAA;AAAA,iBAGE,cAAA,CAAA;EACd,OAAA;EACA,QAAA;EACA,YAAA;EACA,KAAA;EACA;AAAA,GACC,mBAAA"}
+{"version":3,"file":"use-select-field.d.ts","names":[],"sources":["../../../../src/ui/components/select-field/use-select-field.ts"],"mappings":";;UAGU;EACR,UAAU;EACV;EACA;EACA;EACA,YAAY;;wBAGE,iBACd,SACA,UACA,cACA,OACA,YACC;;;;EA8Be,eAAA;;;EAL4B,mBAAA"}

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

@@ -1 +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"}
+{"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,CAAA,GACVC,WAAW,OACXC,cACAC,OACAC,YACsB;CACtB,MAAMC,mBAAmBR,OAAO,KAAK;CACrC,MAAMS,iBAAiBT,OAAuB,IAAI;CAClD,MAAM,CAACU,eAAeC,oBAAoBV,SAAS,KAAK;CACxD,MAAM,CAACW,gBAAgBC,qBAAqBZ,eAAyB;EACnE,MAAMa,eAAeR,SAASD,gBAAgB,CAAA;EAC9C,IAAIS,iBAAiB,IACnB,OAAO,CAAA;EAET,OAAOC,MAAMC,QAAQF,YAAY,IAAIA,eAAe,CAACA,YAAY;CACnE,CAAC;CAEDf,gBAAgB;EACd,IAAIS,iBAAiBS,SAAS;GAC5BT,iBAAiBS,UAAU;GAC3B;EACF;EACA,MAAMC,WAAWZ,SAASD,gBAAgB,CAAA;EAC1C,IAAIa,aAAa,IACfL,kBAAkB,CAAA,CAAE;OAEpBA,kBAAkBE,MAAMC,QAAQE,QAAQ,IAAIA,WAAW,CAACA,QAAQ,CAAC;CAErE,GAAG,CAACZ,KAAK,CAAC;CAEV,MAAMa,mBAAmBrB,aAAasB,SAAkB;EACtDT,iBAAiBS,IAAI;CACvB,GAAG,CAAA,CAAE;CAEL,MAAMC,eAAevB,aAClBwB,gBAAwB;EACvBd,iBAAiBS,UAAU;EAC3B,IAAIM;EAEJ,IAAInB,UACFmB,YAAYX,eAAeY,SAASF,WAAW,IAC3CV,eAAea,QAAQC,MAAMA,MAAMJ,WAAW,IAC9C,CAAC,GAAGV,gBAAgBU,WAAW;OAC9B;GACLC,YAAYX,eAAe,OAAOU,cAAc,CAAA,IAAK,CAACA,WAAW;GAEjEX,iBAAiB,KAAK;EACxB;EAEAE,kBAAkBU,SAAS;EAC3BhB,WAAWH,WAAWmB,YAAaA,UAAU,MAAM,EAAG;CACxD,GACA;EAACnB;EAAUQ;EAAgBT;EAASI;CAAQ,CAC9C;CAEA,MAAMoB,cAAc7B,kBAAkB;EACpCU,iBAAiBS,UAAU;EAC3BJ,kBAAkB,CAAA,CAAE;EACpBN,WAAWH,WAAW,CAAA,IAAK,EAAE;CAC/B,GAAG,CAACA,UAAUG,QAAQ,CAAC;CAEvB,MAAMqB,YAAY9B,kBAAkB;EAClCU,iBAAiBS,UAAU;EAC3B,MAAMY,iBAAiB1B,QACpBsB,QAAQK,QAAQ,CAACA,IAAIC,QAAQ,CAAC,CAC9BC,KAAKF,QAAQA,IAAIxB,KAAK;EAEzB,MAAMiB,YACJX,eAAeqB,WAAWJ,eAAeI,SAAS,CAAA,IAAKJ;EAEzDhB,kBAAkBU,SAAS;EAC3BhB,WAAWH,WAAWmB,YAAYA,UAAU,EAAE;CAChD,GAAG;EAACpB;EAASS;EAAgBR;EAAUG;CAAQ,CAAC;CAGhD,MAAM2B,eAAelC,OAAOI,QAAQ;CACpCL,gBAAgB;EACd,IAAImC,aAAajB,YAAYb,UAC3B;EAEF8B,aAAajB,UAAUb;EAEvB,IAAI,CAACA,YAAYQ,eAAeqB,SAAS,GAAG;GAC1CzB,iBAAiBS,UAAU;GAC3BJ,kBAAkB,CAACD,eAAe,EAAE,CAAC;GACrCL,WAAWK,eAAe,EAAE;GAC5B;EACF;EACA,IAAIA,eAAeqB,SAAS,GAAG;GAC7BzB,iBAAiBS,UAAU;GAC3BV,WAAWH,WAAW,CAACQ,eAAe,EAAE,IAAIA,eAAe,EAAE;EAC/D;CACF,GAAG,CAACR,QAAQ,CAAC;CAEb,OAAO;EACLQ;EACAF;EACAD;EACAY;EACAM;EACAC;EACAT;CACF;AACF"}