@powerhousedao/design-system 6.0.0-dev.247 → 6.0.0-dev.249

package/dist/ui/components/button/button.js

@@ -1,14 +1,14 @@
-import { t as cn } from "../../../src-D4e3Wkrz.js";
+import { t as cn } from "../../../src-BgCjYazJ.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 import { Slot } from "@radix-ui/react-slot";
 import { cva } from "class-variance-authority";
 //#region src/ui/components/button/button.tsx
-const buttonVariants = cva(cn("inline-flex items-center justify-center gap-2", "whitespace-nowrap rounded-md text-sm font-medium", "transition-colors", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2", "disabled:pointer-events-none", "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0"), {
+const buttonVariants = cva(cn("inline-flex items-center justify-center gap-2", "rounded-md text-sm font-medium whitespace-nowrap", "transition-colors", "focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none", "disabled:pointer-events-none", "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0"), {
 	variants: { variant: {
 		default: "",
-		outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
-		ghost: "hover:bg-accent hover:text-accent-foreground"
+		outline: "border",
+		ghost: ""
 	} },
 	defaultVariants: { variant: "default" }
 });

package/dist/ui/components/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","names":["cn","Slot","cva","forwardRef","buttonVariants","variants","variant","default","outline","ghost","defaultVariants","Button","className","asChild","props","ref","Comp"],"sources":["../../../../src/ui/components/button/button.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport { cva } from \"class-variance-authority\";\nimport { forwardRef } from \"react\";\n\nconst buttonVariants = cva(\n  cn(\n    \"inline-flex items-center justify-center gap-2\",\n    \"whitespace-nowrap rounded-md text-sm font-medium\",\n    \"transition-colors\",\n    \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2\",\n    \"disabled:pointer-events-none\",\n    \"[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0\",\n  ),\n  {\n    variants: {\n      variant: {\n        default: \"\",\n        outline:\n          \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n        ghost: \"hover:bg-accent hover:text-accent-foreground\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  },\n);\n\nexport interface ButtonProps\n  extends\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    VariantProps<typeof buttonVariants> {\n  asChild?: boolean;\n}\n\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ variant, className, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : \"button\";\n    return (\n      <Comp\n        className={cn(buttonVariants({ variant, className }))}\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\n\nexport { Button, buttonVariants };\n"],"mappings":";;;;;;AAMA,MAAMI,iBAAiBF,IACrBF,GACE,iDACA,oDACA,qBACA,+EACA,gCACA,8DACD,EACD;CACEK,UAAU,EACRC,SAAS;EACPC,SAAS;EACTC,SACE;EACFC,OAAO;EACT,EACD;CACDC,iBAAiB,EACfJ,SAAS,WACX;CAEJ,CAAC;AASD,MAAMK,SAASR,4BACZ,EAAEG,SAASM,WAAWC,UAAU,OAAO,GAAGC,SAASC,QAAQ;AAE1D,QACE,oBAFWF,UAAUZ,OAAO,UAE5B;EACE,WAAWD,GAAGI,eAAe;GAAEE;GAASM;GAAW,CAAC,CAAC;EAChDG;EACL,GAAID;EACJ,CAAA;EAGP"}
+{"version":3,"file":"button.js","names":["cn","Slot","cva","forwardRef","buttonVariants","variants","variant","default","outline","ghost","defaultVariants","Button","className","asChild","props","ref","Comp"],"sources":["../../../../src/ui/components/button/button.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport { cva } from \"class-variance-authority\";\nimport { forwardRef } from \"react\";\n\nconst buttonVariants = cva(\n  cn(\n    \"inline-flex items-center justify-center gap-2\",\n    \"rounded-md text-sm font-medium whitespace-nowrap\",\n    \"transition-colors\",\n    \"focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none\",\n    \"disabled:pointer-events-none\",\n    \"[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0\",\n  ),\n  {\n    variants: {\n      variant: {\n        default: \"\",\n        outline: \"border\",\n        ghost: \"\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  },\n);\n\nexport interface ButtonProps\n  extends\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    VariantProps<typeof buttonVariants> {\n  asChild?: boolean;\n}\n\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ variant, className, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : \"button\";\n    return (\n      <Comp\n        className={cn(buttonVariants({ variant, className }))}\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\n\nexport { Button, buttonVariants };\n"],"mappings":";;;;;;AAMA,MAAMI,iBAAiBF,IACrBF,GACE,iDACA,oDACA,qBACA,+EACA,gCACA,8DACD,EACD;CACEK,UAAU,EACRC,SAAS;EACPC,SAAS;EACTC,SAAS;EACTC,OAAO;EACT,EACD;CACDC,iBAAiB,EACfJ,SAAS,WACX;CAEJ,CAAC;AASD,MAAMK,SAASR,4BACZ,EAAEG,SAASM,WAAWC,UAAU,OAAO,GAAGC,SAASC,QAAQ;AAE1D,QACE,oBAFWF,UAAUZ,OAAO,UAE5B;EACE,WAAWD,GAAGI,eAAe;GAAEE;GAASM;GAAW,CAAC,CAAC;EAChDG;EACL,GAAID;EACJ,CAAA;EAGP"}

package/dist/ui/components/character-counter/character-counter.js

@@ -7,14 +7,14 @@ const counterVariants = {
 };
 const maxLengthVariants = {
 	normal: "text-gray-300 dark:text-gray-700",
-	warning: "text-yellow-400 dark:text-[#644E00]",
-	error: "text-red-400 dark:text-[#7D3D37]"
+	warning: "text-yellow-400 dark:text-yellow-900",
+	error: "text-red-400 dark:text-red-900"
 };
 const CharacterCounter = ({ maxLength, value }) => {
 	const remaining = value.length / maxLength * 100;
 	const state = remaining < 90 ? "normal" : remaining <= 100 ? "warning" : "error";
 	return /* @__PURE__ */ jsxs("div", {
-		className: "flex items-center text-[10px] leading-3",
+		className: "flex items-center text-xs/3",
 		children: [/* @__PURE__ */ jsx("span", {
 			className: counterVariants[state],
 			children: value.length

package/dist/ui/components/character-counter/character-counter.js.map

@@ -1 +1 @@
-{"version":3,"file":"character-counter.js","names":["counterVariants","normal","warning","error","maxLengthVariants","CharacterCounter","maxLength","value","remaining","length","state"],"sources":["../../../../src/ui/components/character-counter/character-counter.tsx"],"sourcesContent":["export interface CharacterCounterProps {\n  maxLength: number;\n  value: string;\n}\n\nconst counterVariants = {\n  normal: \"text-gray-500\",\n  warning: \"text-yellow-900\",\n  error: \"text-red-900\",\n};\n\nconst maxLengthVariants = {\n  normal: \"text-gray-300 dark:text-gray-700\",\n  warning: \"text-yellow-400 dark:text-[#644E00]\",\n  error: \"text-red-400 dark:text-[#7D3D37]\",\n};\n\nexport const CharacterCounter: React.FC<CharacterCounterProps> = ({\n  maxLength,\n  value,\n}) => {\n  const remaining = (value.length / maxLength) * 100;\n  const state =\n    remaining < 90 ? \"normal\" : remaining <= 100 ? \"warning\" : \"error\";\n\n  return (\n    <div className=\"flex items-center text-[10px] leading-3\">\n      <span className={counterVariants[state]}>{value.length}</span>\n      <span className={maxLengthVariants[state]}>/{maxLength}</span>\n    </div>\n  );\n};\n"],"mappings":";;AAKA,MAAMA,kBAAkB;CACtBC,QAAQ;CACRC,SAAS;CACTC,OAAO;CACR;AAED,MAAMC,oBAAoB;CACxBH,QAAQ;CACRC,SAAS;CACTC,OAAO;CACR;AAED,MAAaE,oBAAqD,EAChEC,WACAC,YACI;CACJ,MAAMC,YAAaD,MAAME,SAASH,YAAa;CAC/C,MAAMI,QACJF,YAAY,KAAK,WAAWA,aAAa,MAAM,YAAY;AAE7D,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,QAAD;GAAM,WAAWR,gBAAgBU;aAASH,MAAME;GAAa,CAAA,EAC7D,qBAAC,QAAD;GAAM,WAAWL,kBAAkBM;aAAnC,CAA2C,KAAEJ,UAAgB;KACzD"}
+{"version":3,"file":"character-counter.js","names":["counterVariants","normal","warning","error","maxLengthVariants","CharacterCounter","maxLength","value","remaining","length","state"],"sources":["../../../../src/ui/components/character-counter/character-counter.tsx"],"sourcesContent":["export interface CharacterCounterProps {\n  maxLength: number;\n  value: string;\n}\n\nconst counterVariants = {\n  normal: \"text-gray-500\",\n  warning: \"text-yellow-900\",\n  error: \"text-red-900\",\n};\n\nconst maxLengthVariants = {\n  normal: \"text-gray-300 dark:text-gray-700\",\n  warning: \"text-yellow-400 dark:text-yellow-900\",\n  error: \"text-red-400 dark:text-red-900\",\n};\n\nexport const CharacterCounter: React.FC<CharacterCounterProps> = ({\n  maxLength,\n  value,\n}) => {\n  const remaining = (value.length / maxLength) * 100;\n  const state =\n    remaining < 90 ? \"normal\" : remaining <= 100 ? \"warning\" : \"error\";\n\n  return (\n    <div className=\"flex items-center text-xs/3\">\n      <span className={counterVariants[state]}>{value.length}</span>\n      <span className={maxLengthVariants[state]}>/{maxLength}</span>\n    </div>\n  );\n};\n"],"mappings":";;AAKA,MAAMA,kBAAkB;CACtBC,QAAQ;CACRC,SAAS;CACTC,OAAO;CACR;AAED,MAAMC,oBAAoB;CACxBH,QAAQ;CACRC,SAAS;CACTC,OAAO;CACR;AAED,MAAaE,oBAAqD,EAChEC,WACAC,YACI;CACJ,MAAMC,YAAaD,MAAME,SAASH,YAAa;CAC/C,MAAMI,QACJF,YAAY,KAAK,WAAWA,aAAa,MAAM,YAAY;AAE7D,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,QAAD;GAAM,WAAWR,gBAAgBU;aAASH,MAAME;GAAa,CAAA,EAC7D,qBAAC,QAAD;GAAM,WAAWL,kBAAkBM;aAAnC,CAA2C,KAAEJ,UAAgB;KACzD"}

package/dist/ui/components/checkbox/checkbox-base.js

@@ -1,11 +1,11 @@
-import { t as cn } from "../../../src-D4e3Wkrz.js";
+import { t as cn } from "../../../src-BgCjYazJ.js";
 import * as React$1 from "react";
 import { jsx } from "react/jsx-runtime";
 import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
 //#region src/ui/components/checkbox/checkbox-base.tsx
 const CheckboxBase = /* @__PURE__ */ React$1.forwardRef(({ className, checked, invalid, ...props }, ref) => /* @__PURE__ */ jsx(CheckboxPrimitive.Root, {
 	ref,
-	className: cn("peer size-4 shrink-0 rounded", "border-input border shadow-sm shadow-black/[.04]", "ring-offset-background transition-shadow", "focus-visible:border-ring focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2", "disabled:cursor-not-allowed disabled:border-gray-700 disabled:data-[invalid=false]:data-[state=checked]:bg-gray-700 disabled:data-[invalid=false]:data-[state=indeterminate]:bg-gray-700 dark:disabled:data-[invalid=false]:data-[state=checked]:bg-gray-500 dark:disabled:data-[invalid=false]:data-[state=indeterminate]:bg-gray-500", "data-[state]:border-gray-700 dark:data-[state]:border-gray-500", "data-[state=checked]:bg-gray-900 data-[state=indeterminate]:bg-gray-900 dark:data-[state=checked]:bg-gray-400 dark:data-[state=indeterminate]:bg-gray-400", "data-[state=checked]:text-slate-50 data-[state=indeterminate]:text-slate-50 dark:data-[state=checked]:text-gray-900 dark:data-[state=indeterminate]:text-gray-900", !props.disabled && ["group-hover:border-gray-900 data-[state=checked]:group-hover:bg-gray-900 data-[state=indeterminate]:group-hover:bg-gray-900", "dark:group-hover:border-slate-50 dark:data-[state=checked]:group-hover:bg-slate-50 dark:data-[state=indeterminate]:group-hover:bg-slate-50"], "data-[invalid=true]:data-[state]:!border-red-800 data-[invalid=true]:data-[state=checked]:!bg-red-800 data-[invalid=true]:data-[state=indeterminate]:!bg-red-800", "dark:data-[invalid=true]:data-[state]:!border-red-800 dark:data-[invalid=true]:data-[state=checked]:!bg-red-800 dark:data-[invalid=true]:data-[state=indeterminate]:!bg-red-800", "data-[invalid=true]:group-hover:!border-red-900 data-[invalid=true]:data-[state=checked]:group-hover:!bg-red-900 data-[invalid=true]:data-[state=indeterminate]:group-hover:!bg-red-900", className),
+	className: cn("peer size-4 shrink-0 rounded-sm", "border shadow-sm shadow-black/4", "transition-shadow", "focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none", "disabled:cursor-not-allowed disabled:border-gray-700 disabled:data-[invalid=false]:data-[state=checked]:bg-gray-700 disabled:data-[invalid=false]:data-[state=indeterminate]:bg-gray-700 dark:disabled:data-[invalid=false]:data-[state=checked]:bg-gray-500 dark:disabled:data-[invalid=false]:data-[state=indeterminate]:bg-gray-500", "data-state:border-gray-700 dark:data-state:border-gray-500", "data-[state=checked]:bg-gray-900 data-[state=indeterminate]:bg-gray-900 dark:data-[state=checked]:bg-gray-400 dark:data-[state=indeterminate]:bg-gray-400", "data-[state=checked]:text-slate-50 data-[state=indeterminate]:text-slate-50 dark:data-[state=checked]:text-gray-900 dark:data-[state=indeterminate]:text-gray-900", !props.disabled && ["group-hover:border-gray-900 data-[state=checked]:group-hover:bg-gray-900 data-[state=indeterminate]:group-hover:bg-gray-900", "dark:group-hover:border-slate-50 dark:data-[state=checked]:group-hover:bg-slate-50 dark:data-[state=indeterminate]:group-hover:bg-slate-50"], "data-[invalid=true]:data-state:border-red-800! data-[invalid=true]:data-[state=checked]:bg-red-800! data-[invalid=true]:data-[state=indeterminate]:bg-red-800!", "dark:data-[invalid=true]:data-state:border-red-800! dark:data-[invalid=true]:data-[state=checked]:bg-red-800! dark:data-[invalid=true]:data-[state=indeterminate]:bg-red-800!", "data-[invalid=true]:group-hover:border-red-900! data-[invalid=true]:data-[state=checked]:group-hover:bg-red-900! data-[invalid=true]:data-[state=indeterminate]:group-hover:bg-red-900!", className),
 	checked,
 	"data-invalid": invalid,
 	...props,

package/dist/ui/components/checkbox/checkbox-base.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-base.js","names":["cn","CheckboxPrimitive","React","CheckboxBase","forwardRef","className","checked","invalid","props","ref","disabled","displayName"],"sources":["../../../../src/ui/components/checkbox/checkbox-base.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport * as CheckboxPrimitive from \"@radix-ui/react-checkbox\";\nimport * as React from \"react\";\n\ntype CheckboxValue = boolean | \"indeterminate\";\n\ntype CheckboxBaseProps = React.ComponentPropsWithoutRef<\n  typeof CheckboxPrimitive.Root\n> & {\n  invalid?: boolean;\n};\n\nconst CheckboxBase = React.forwardRef<\n  React.ElementRef<typeof CheckboxPrimitive.Root>,\n  CheckboxBaseProps\n>(({ className, checked, invalid, ...props }, ref) => (\n  <CheckboxPrimitive.Root\n    ref={ref}\n    className={cn(\n      // Base styles\n      \"peer size-4 shrink-0 rounded\",\n      // Border & Shadow\n      \"border-input border shadow-sm shadow-black/[.04]\",\n      // Background & Ring\n      \"ring-offset-background transition-shadow\",\n      // Focus styles\n      \"focus-visible:border-ring focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2\",\n      // Disabled state\n      \"disabled:cursor-not-allowed disabled:border-gray-700 disabled:data-[invalid=false]:data-[state=checked]:bg-gray-700 disabled:data-[invalid=false]:data-[state=indeterminate]:bg-gray-700 dark:disabled:data-[invalid=false]:data-[state=checked]:bg-gray-500 dark:disabled:data-[invalid=false]:data-[state=indeterminate]:bg-gray-500\",\n      // Checked & Indeterminate states\n      \"data-[state]:border-gray-700 dark:data-[state]:border-gray-500\",\n      \"data-[state=checked]:bg-gray-900 data-[state=indeterminate]:bg-gray-900 dark:data-[state=checked]:bg-gray-400 dark:data-[state=indeterminate]:bg-gray-400\",\n      \"data-[state=checked]:text-slate-50 data-[state=indeterminate]:text-slate-50 dark:data-[state=checked]:text-gray-900 dark:data-[state=indeterminate]:text-gray-900\",\n      // hover states\n      !props.disabled && [\n        \"group-hover:border-gray-900 data-[state=checked]:group-hover:bg-gray-900 data-[state=indeterminate]:group-hover:bg-gray-900\",\n        \"dark:group-hover:border-slate-50 dark:data-[state=checked]:group-hover:bg-slate-50 dark:data-[state=indeterminate]:group-hover:bg-slate-50\",\n      ],\n      // Error state\n      \"data-[invalid=true]:data-[state]:!border-red-800 data-[invalid=true]:data-[state=checked]:!bg-red-800 data-[invalid=true]:data-[state=indeterminate]:!bg-red-800\",\n      \"dark:data-[invalid=true]:data-[state]:!border-red-800 dark:data-[invalid=true]:data-[state=checked]:!bg-red-800 dark:data-[invalid=true]:data-[state=indeterminate]:!bg-red-800\",\n      // error hover states\n      \"data-[invalid=true]:group-hover:!border-red-900 data-[invalid=true]:data-[state=checked]:group-hover:!bg-red-900 data-[invalid=true]:data-[state=indeterminate]:group-hover:!bg-red-900\",\n      className,\n    )}\n    checked={checked}\n    data-invalid={invalid}\n    {...props}\n  >\n    <CheckboxPrimitive.Indicator className=\"flex items-center justify-center text-current\">\n      {checked === \"indeterminate\" ? (\n        <svg\n          width=\"9\"\n          height=\"9\"\n          viewBox=\"0 0 9 9\"\n          fill=\"currentcolor\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path\n            fillRule=\"evenodd\"\n            clipRule=\"evenodd\"\n            d=\"M0.75 4.5C0.75 4.08579 1.08579 3.75 1.5 3.75H7.5C7.91421 3.75 8.25 4.08579 8.25 4.5C8.25 4.91421 7.91421 5.25 7.5 5.25H1.5C1.08579 5.25 0.75 4.91421 0.75 4.5Z\"\n          />\n        </svg>\n      ) : checked ? (\n        <svg\n          width=\"9\"\n          height=\"9\"\n          viewBox=\"0 0 9 9\"\n          fill=\"currentcolor\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path\n            fillRule=\"evenodd\"\n            clipRule=\"evenodd\"\n            d=\"M8.53547 0.62293C8.88226 0.849446 8.97976 1.3142 8.75325 1.66099L4.5083 8.1599C4.38833 8.34356 4.19397 8.4655 3.9764 8.49358C3.75883 8.52167 3.53987 8.45309 3.3772 8.30591L0.616113 5.80777C0.308959 5.52987 0.285246 5.05559 0.563148 4.74844C0.84105 4.44128 1.31533 4.41757 1.62249 4.69547L3.73256 6.60459L7.49741 0.840706C7.72393 0.493916 8.18868 0.396414 8.53547 0.62293Z\"\n          />\n        </svg>\n      ) : null}\n    </CheckboxPrimitive.Indicator>\n  </CheckboxPrimitive.Root>\n));\n\nCheckboxBase.displayName = \"CheckboxBase\";\n\nexport { CheckboxBase, type CheckboxValue };\n"],"mappings":";;;;;AAYA,MAAMG,eAAeD,wBAAME,YAGxB,EAAEC,WAAWC,SAASC,SAAS,GAAGC,SAASC,QAC5C,oBAAC,kBAAkB,MAAnB;CACOA;CACL,WAAWT,GAET,gCAEA,oDAEA,4CAEA,iIAEA,0UAEA,kEACA,6JACA,qKAEA,CAACQ,MAAME,YAAY,CACjB,+HACA,6IACD,EAED,oKACA,mLAEA,2LACAL,UACD;CACQC;CACT,gBAAcC;CACd,GAAIC;WAEJ,oBAAC,kBAAkB,WAAnB;EAA6B,WAAU;YACpCF,YAAY,kBACX,oBAAC,OAAD;GACE,OAAM;GACN,QAAO;GACP,SAAQ;GACR,MAAK;GACL,OAAM;aAEN,oBAAC,QAAD;IACE,UAAS;IACT,UAAS;IACT,GAAE;IAAgK,CAAA;GAEhK,CAAA,GACJA,UACF,oBAAC,OAAD;GACE,OAAM;GACN,QAAO;GACP,SAAQ;GACR,MAAK;GACL,OAAM;aAEN,oBAAC,QAAD;IACE,UAAS;IACT,UAAS;IACT,GAAE;IAAqX,CAAA;GAErX,CAAA,GACJ;EACuB,CAAA;CAEhC,CAAA,CAAC;AAEFH,aAAaQ,cAAc"}
+{"version":3,"file":"checkbox-base.js","names":["cn","CheckboxPrimitive","React","CheckboxBase","forwardRef","className","checked","invalid","props","ref","disabled","displayName"],"sources":["../../../../src/ui/components/checkbox/checkbox-base.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport * as CheckboxPrimitive from \"@radix-ui/react-checkbox\";\nimport * as React from \"react\";\n\ntype CheckboxValue = boolean | \"indeterminate\";\n\ntype CheckboxBaseProps = React.ComponentPropsWithoutRef<\n  typeof CheckboxPrimitive.Root\n> & {\n  invalid?: boolean;\n};\n\nconst CheckboxBase = React.forwardRef<\n  React.ElementRef<typeof CheckboxPrimitive.Root>,\n  CheckboxBaseProps\n>(({ className, checked, invalid, ...props }, ref) => (\n  <CheckboxPrimitive.Root\n    ref={ref}\n    className={cn(\n      // Base styles\n      \"peer size-4 shrink-0 rounded-sm\",\n      // Border & Shadow\n      \"border shadow-sm shadow-black/4\",\n      // Background & Ring\n      \"transition-shadow\",\n      // Focus styles\n      \"focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none\",\n      // Disabled state\n      \"disabled:cursor-not-allowed disabled:border-gray-700 disabled:data-[invalid=false]:data-[state=checked]:bg-gray-700 disabled:data-[invalid=false]:data-[state=indeterminate]:bg-gray-700 dark:disabled:data-[invalid=false]:data-[state=checked]:bg-gray-500 dark:disabled:data-[invalid=false]:data-[state=indeterminate]:bg-gray-500\",\n      // Checked & Indeterminate states\n      \"data-state:border-gray-700 dark:data-state:border-gray-500\",\n      \"data-[state=checked]:bg-gray-900 data-[state=indeterminate]:bg-gray-900 dark:data-[state=checked]:bg-gray-400 dark:data-[state=indeterminate]:bg-gray-400\",\n      \"data-[state=checked]:text-slate-50 data-[state=indeterminate]:text-slate-50 dark:data-[state=checked]:text-gray-900 dark:data-[state=indeterminate]:text-gray-900\",\n      // hover states\n      !props.disabled && [\n        \"group-hover:border-gray-900 data-[state=checked]:group-hover:bg-gray-900 data-[state=indeterminate]:group-hover:bg-gray-900\",\n        \"dark:group-hover:border-slate-50 dark:data-[state=checked]:group-hover:bg-slate-50 dark:data-[state=indeterminate]:group-hover:bg-slate-50\",\n      ],\n      // Error state\n      \"data-[invalid=true]:data-state:border-red-800! data-[invalid=true]:data-[state=checked]:bg-red-800! data-[invalid=true]:data-[state=indeterminate]:bg-red-800!\",\n      \"dark:data-[invalid=true]:data-state:border-red-800! dark:data-[invalid=true]:data-[state=checked]:bg-red-800! dark:data-[invalid=true]:data-[state=indeterminate]:bg-red-800!\",\n      // error hover states\n      \"data-[invalid=true]:group-hover:border-red-900! data-[invalid=true]:data-[state=checked]:group-hover:bg-red-900! data-[invalid=true]:data-[state=indeterminate]:group-hover:bg-red-900!\",\n      className,\n    )}\n    checked={checked}\n    data-invalid={invalid}\n    {...props}\n  >\n    <CheckboxPrimitive.Indicator className=\"flex items-center justify-center text-current\">\n      {checked === \"indeterminate\" ? (\n        <svg\n          width=\"9\"\n          height=\"9\"\n          viewBox=\"0 0 9 9\"\n          fill=\"currentcolor\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path\n            fillRule=\"evenodd\"\n            clipRule=\"evenodd\"\n            d=\"M0.75 4.5C0.75 4.08579 1.08579 3.75 1.5 3.75H7.5C7.91421 3.75 8.25 4.08579 8.25 4.5C8.25 4.91421 7.91421 5.25 7.5 5.25H1.5C1.08579 5.25 0.75 4.91421 0.75 4.5Z\"\n          />\n        </svg>\n      ) : checked ? (\n        <svg\n          width=\"9\"\n          height=\"9\"\n          viewBox=\"0 0 9 9\"\n          fill=\"currentcolor\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path\n            fillRule=\"evenodd\"\n            clipRule=\"evenodd\"\n            d=\"M8.53547 0.62293C8.88226 0.849446 8.97976 1.3142 8.75325 1.66099L4.5083 8.1599C4.38833 8.34356 4.19397 8.4655 3.9764 8.49358C3.75883 8.52167 3.53987 8.45309 3.3772 8.30591L0.616113 5.80777C0.308959 5.52987 0.285246 5.05559 0.563148 4.74844C0.84105 4.44128 1.31533 4.41757 1.62249 4.69547L3.73256 6.60459L7.49741 0.840706C7.72393 0.493916 8.18868 0.396414 8.53547 0.62293Z\"\n          />\n        </svg>\n      ) : null}\n    </CheckboxPrimitive.Indicator>\n  </CheckboxPrimitive.Root>\n));\n\nCheckboxBase.displayName = \"CheckboxBase\";\n\nexport { CheckboxBase, type CheckboxValue };\n"],"mappings":";;;;;AAYA,MAAMG,eAAeD,wBAAME,YAGxB,EAAEC,WAAWC,SAASC,SAAS,GAAGC,SAASC,QAC5C,oBAAC,kBAAkB,MAAnB;CACOA;CACL,WAAWT,GAET,mCAEA,mCAEA,qBAEA,+EAEA,0UAEA,8DACA,6JACA,qKAEA,CAACQ,MAAME,YAAY,CACjB,+HACA,6IACD,EAED,kKACA,iLAEA,2LACAL,UACD;CACQC;CACT,gBAAcC;CACd,GAAIC;WAEJ,oBAAC,kBAAkB,WAAnB;EAA6B,WAAU;YACpCF,YAAY,kBACX,oBAAC,OAAD;GACE,OAAM;GACN,QAAO;GACP,SAAQ;GACR,MAAK;GACL,OAAM;aAEN,oBAAC,QAAD;IACE,UAAS;IACT,UAAS;IACT,GAAE;IAAgK,CAAA;GAEhK,CAAA,GACJA,UACF,oBAAC,OAAD;GACE,OAAM;GACN,QAAO;GACP,SAAQ;GACR,MAAK;GACL,OAAM;aAEN,oBAAC,QAAD;IACE,UAAS;IACT,UAAS;IACT,GAAE;IAAqX,CAAA;GAErX,CAAA,GACJ;EACuB,CAAA;CAEhC,CAAA,CAAC;AAEFH,aAAaQ,cAAc"}

package/dist/ui/components/checkbox/checkbox.js

@@ -1,4 +1,4 @@
-import { t as cn } from "../../../src-D4e3Wkrz.js";
+import { t as cn } from "../../../src-BgCjYazJ.js";
 import { CheckboxBase } from "./checkbox-base.js";
 import { FormLabel } from "../form-label/form-label.js";
 import { FormMessageList } from "../form-message/message-list.js";

package/dist/ui/components/command/command.d.ts

@@ -1,2 +1,2 @@
-import { a as CommandItem, i as CommandInput, n as CommandEmpty, o as CommandList, r as CommandGroup, s as CommandLoading, t as Command } from "../../../command-CThXmS49.js";
+import { a as CommandItem, i as CommandInput, n as CommandEmpty, o as CommandList, r as CommandGroup, s as CommandLoading, t as Command } from "../../../command-CjupIOR8.js";
 export { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading };

package/dist/ui/components/command/command.js

@@ -1,11 +1,11 @@
-import { h as Icon, t as cn } from "../../../src-D4e3Wkrz.js";
+import { h as Icon, t as cn } from "../../../src-BgCjYazJ.js";
 import React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Command as Command$1 } from "cmdk";
 //#region src/ui/components/command/command.tsx
 const Command = /* @__PURE__ */ React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Command$1, {
 	ref,
-	className: cn("flex size-full flex-col rounded-md [&_[cmdk-label]]:hidden", className),
+	className: cn("flex size-full flex-col rounded-md **:[[cmdk-label]]:hidden", className),
 	...props
 }));
 Command.displayName = Command$1.displayName;
@@ -15,17 +15,17 @@ const CommandInput = /* @__PURE__ */ React.forwardRef(({ wrapperClassName, class
 	children: [/* @__PURE__ */ jsx(Icon, {
 		name: "Search",
 		size: 16,
-		className: cn("pointer-events-none absolute left-2 top-3.5 text-gray-500 dark:text-gray-700", "group-hover:text-gray-700 dark:group-hover:text-gray-500", "group-focus-within:!text-gray-900 dark:group-focus-within:!text-gray-50")
+		className: cn("pointer-events-none absolute top-3.5 left-2 text-gray-500 dark:text-gray-700", "group-hover:text-gray-700 dark:group-hover:text-gray-500", "group-focus-within:text-gray-900! dark:group-focus-within:text-gray-50!")
 	}), /* @__PURE__ */ jsx(Command$1.Input, {
 		ref,
-		className: cn("flex w-full bg-transparent pb-2 pl-8 pr-3 pt-3 text-[14px] font-normal leading-5 outline-none", "placeholder:text-gray-500 dark:placeholder:text-gray-700", "group-hover:placeholder:text-gray-700 dark:group-hover:placeholder:text-gray-500", "group-focus-within:placeholder:!text-gray-700 dark:group-focus-within:placeholder:!text-gray-300", "disabled:cursor-not-allowed", className),
+		className: cn("flex w-full bg-transparent pt-3 pr-3 pb-2 pl-8 text-sm/5 font-normal outline-none", "placeholder:text-gray-500 dark:placeholder:text-gray-700", "group-hover:placeholder:text-gray-700 dark:group-hover:placeholder:text-gray-500", "group-focus-within:placeholder:text-gray-700! dark:group-focus-within:placeholder:text-gray-300!", "disabled:cursor-not-allowed", className),
 		...props
 	})]
 }));
 CommandInput.displayName = Command$1.Input.displayName;
 const CommandList = /* @__PURE__ */ React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Command$1.List, {
 	ref,
-	className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden", "focus:outline-none", "scrollbar-thin scrollbar-gutter-stable", "scrollbar-track-transparent", "scrollbar-thumb-gray-300 hover:scrollbar-thumb-gray-300", "dark:scrollbar-thumb-charcoal-700 dark:hover:scrollbar-thumb-charcoal-700", "scrollbar-thumb-rounded-md", className),
+	className: cn("max-h-75 overflow-x-hidden overflow-y-auto", "focus:outline-none", "scrollbar-thin", "scrollbar-track-transparent", "scrollbar-thumb-gray-300 hover:scrollbar-thumb-gray-300", "dark:scrollbar-thumb-charcoal-700 dark:hover:scrollbar-thumb-charcoal-700", "scrollbar-thumb-rounded-md", className),
 	...props
 }));
 CommandList.displayName = Command$1.List.displayName;
@@ -41,13 +41,13 @@ const CommandEmpty = /* @__PURE__ */ React.forwardRef((props, ref) => /* @__PURE
 CommandEmpty.displayName = Command$1.Empty.displayName;
 const CommandGroup = /* @__PURE__ */ React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Command$1.Group, {
 	ref,
-	className: cn("overflow-hidden px-0.5 py-1", "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium", className),
+	className: cn("overflow-hidden px-0.5 py-1", "**:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium", className),
 	...props
 }));
 CommandGroup.displayName = Command$1.Group.displayName;
 const CommandItem = /* @__PURE__ */ React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Command$1.Item, {
 	ref,
-	className: cn("relative flex select-none items-center justify-between", "h-8 gap-2 rounded-md py-1.5 pl-1.5 pr-2.5", "text-[14px] leading-4 outline-none", "border-y-2 border-white dark:border-slate-600", "data-[disabled=true]:pointer-events-none", "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", className),
+	className: cn("relative flex items-center justify-between select-none", "h-8 gap-2 rounded-md py-1.5 pr-2.5 pl-1.5", "text-sm/4 outline-none", "border-y-2 border-white dark:border-slate-600", "data-[disabled=true]:pointer-events-none", "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", className),
 	...props
 }));
 CommandItem.displayName = Command$1.Item.displayName;

package/dist/ui/components/command/command.js.map

@@ -1 +1 @@
-{"version":3,"file":"command.js","names":["cn","Icon","Command","CommandPrimitive","React","forwardRef","className","props","ref","displayName","CommandInput","wrapperClassName","Input","CommandList","List","CommandLoading","Loading","CommandEmpty","Empty","CommandGroup","Group","CommandItem","Item"],"sources":["../../../../src/ui/components/command/command.tsx"],"sourcesContent":["import { cn, Icon } from \"#design-system\";\nimport { Command as CommandPrimitive } from \"cmdk\";\nimport React from \"react\";\n\nconst Command = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive\n    ref={ref}\n    className={cn(\n      \"flex size-full flex-col rounded-md [&_[cmdk-label]]:hidden\",\n      className,\n    )}\n    {...props}\n  />\n));\nCommand.displayName = CommandPrimitive.displayName;\n\nconst CommandInput = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Input>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input> & {\n    wrapperClassName?: string;\n  }\n>(({ wrapperClassName, className, ...props }, ref) => (\n  <div\n    className={cn(\n      \"group relative flex items-center border-b\",\n      \"border-b-gray-300 dark:border-b-gray-900\",\n      \"hover:border-b-gray-300 dark:hover:border-b-gray-800\",\n      \"hover:bg-gray-100 dark:hover:bg-gray-900\",\n      \"focus-within:border-b-gray-300 dark:focus-within:border-b-gray-800\",\n      \"focus-within:bg-gray-100 dark:focus-within:bg-gray-900\",\n      wrapperClassName,\n    )}\n    cmdk-input-wrapper=\"\"\n  >\n    <Icon\n      name=\"Search\"\n      size={16}\n      className={cn(\n        \"pointer-events-none absolute left-2 top-3.5 text-gray-500 dark:text-gray-700\",\n        \"group-hover:text-gray-700 dark:group-hover:text-gray-500\",\n        \"group-focus-within:!text-gray-900 dark:group-focus-within:!text-gray-50\",\n      )}\n    />\n    <CommandPrimitive.Input\n      ref={ref}\n      className={cn(\n        \"flex w-full bg-transparent pb-2 pl-8 pr-3 pt-3 text-[14px] font-normal leading-5 outline-none\",\n        \"placeholder:text-gray-500 dark:placeholder:text-gray-700\",\n        \"group-hover:placeholder:text-gray-700 dark:group-hover:placeholder:text-gray-500\",\n        \"group-focus-within:placeholder:!text-gray-700 dark:group-focus-within:placeholder:!text-gray-300\",\n        \"disabled:cursor-not-allowed\",\n        className,\n      )}\n      {...props}\n    />\n  </div>\n));\nCommandInput.displayName = CommandPrimitive.Input.displayName;\n\nconst CommandList = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.List\n    ref={ref}\n    className={cn(\n      \"max-h-[300px] overflow-y-auto overflow-x-hidden\",\n      \"focus:outline-none\",\n      \"scrollbar-thin scrollbar-gutter-stable\",\n      \"scrollbar-track-transparent\",\n      \"scrollbar-thumb-gray-300 hover:scrollbar-thumb-gray-300\",\n      \"dark:scrollbar-thumb-charcoal-700 dark:hover:scrollbar-thumb-charcoal-700\",\n      \"scrollbar-thumb-rounded-md\",\n      className,\n    )}\n    {...props}\n  />\n));\nCommandList.displayName = CommandPrimitive.List.displayName;\n\nconst CommandLoading = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Loading>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Loading>\n>((props, ref) => <CommandPrimitive.Loading ref={ref} {...props} />);\nCommandLoading.displayName = CommandPrimitive.Loading.displayName;\n\nconst CommandEmpty = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Empty>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>((props, ref) => <CommandPrimitive.Empty ref={ref} {...props} />);\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName;\n\nconst CommandGroup = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Group>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Group\n    ref={ref}\n    className={cn(\n      \"overflow-hidden px-0.5 py-1\",\n      \"[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium\",\n      className,\n    )}\n    {...props}\n  />\n));\nCommandGroup.displayName = CommandPrimitive.Group.displayName;\n\nconst CommandItem = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"relative flex select-none items-center justify-between\",\n      \"h-8 gap-2 rounded-md py-1.5 pl-1.5 pr-2.5\",\n      \"text-[14px] leading-4 outline-none\",\n      \"border-y-2 border-white dark:border-slate-600\",\n      \"data-[disabled=true]:pointer-events-none\",\n      \"[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0\",\n      className,\n    )}\n    {...props}\n  />\n));\nCommandItem.displayName = CommandPrimitive.Item.displayName;\n\nexport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandLoading,\n};\n"],"mappings":";;;;;AAIA,MAAME,UAAUE,sBAAMC,YAGnB,EAAEC,WAAW,GAAGC,SAASC,QAC1B,oBAAC,WAAD;CACOA;CACL,WAAWR,GACT,8DACAM,UACD;CACD,GAAIC;CAEP,CAAA,CAAC;AACFL,QAAQO,cAAcN,UAAiBM;AAEvC,MAAMC,eAAeN,sBAAMC,YAKxB,EAAEM,kBAAkBL,WAAW,GAAGC,SAASC,QAC5C,qBAAC,OAAD;CACE,WAAWR,GACT,6CACA,4CACA,wDACA,4CACA,sEACA,0DACAW,iBACD;CACD,sBAAmB;WAVrB,CAYE,oBAAC,MAAD;EACE,MAAK;EACL,MAAM;EACN,WAAWX,GACT,gFACA,4DACA,0EACD;EAAC,CAAA,EAEJ,oBAAC,UAAiB,OAAlB;EACOQ;EACL,WAAWR,GACT,iGACA,4DACA,oFACA,oGACA,+BACAM,UACD;EACD,GAAIC;EAAM,CAAA,CAGf;GAAC;AACFG,aAAaD,cAAcN,UAAiBS,MAAMH;AAElD,MAAMI,cAAcT,sBAAMC,YAGvB,EAAEC,WAAW,GAAGC,SAASC,QAC1B,oBAAC,UAAiB,MAAlB;CACOA;CACL,WAAWR,GACT,mDACA,sBACA,0CACA,+BACA,2DACA,6EACA,8BACAM,UACD;CACD,GAAIC;CAEP,CAAA,CAAC;AACFM,YAAYJ,cAAcN,UAAiBW,KAAKL;AAEhD,MAAMM,iBAAiBX,sBAAMC,YAG1BE,OAAOC,QAAQ,oBAAC,UAAiB,SAAlB;CAA+BA;CAAK,GAAID;CAAS,CAAA,CAAC;AACpEQ,eAAeN,cAAcN,UAAiBa,QAAQP;AAEtD,MAAMQ,eAAeb,sBAAMC,YAGxBE,OAAOC,QAAQ,oBAAC,UAAiB,OAAlB;CAA6BA;CAAK,GAAID;CAAS,CAAA,CAAC;AAClEU,aAAaR,cAAcN,UAAiBe,MAAMT;AAElD,MAAMU,eAAef,sBAAMC,YAGxB,EAAEC,WAAW,GAAGC,SAASC,QAC1B,oBAAC,UAAiB,OAAlB;CACOA;CACL,WAAWR,GACT,+BACA,uIACAM,UACD;CACD,GAAIC;CAEP,CAAA,CAAC;AACFY,aAAaV,cAAcN,UAAiBiB,MAAMX;AAElD,MAAMY,cAAcjB,sBAAMC,YAGvB,EAAEC,WAAW,GAAGC,SAASC,QAC1B,oBAAC,UAAiB,MAAlB;CACOA;CACL,WAAWR,GACT,0DACA,6CACA,sCACA,iDACA,4CACA,+DACAM,UACD;CACD,GAAIC;CAEP,CAAA,CAAC;AACFc,YAAYZ,cAAcN,UAAiBmB,KAAKb"}
+{"version":3,"file":"command.js","names":["cn","Icon","Command","CommandPrimitive","React","forwardRef","className","props","ref","displayName","CommandInput","wrapperClassName","Input","CommandList","List","CommandLoading","Loading","CommandEmpty","Empty","CommandGroup","Group","CommandItem","Item"],"sources":["../../../../src/ui/components/command/command.tsx"],"sourcesContent":["import { cn, Icon } from \"#design-system\";\nimport { Command as CommandPrimitive } from \"cmdk\";\nimport React from \"react\";\n\nconst Command = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive\n    ref={ref}\n    className={cn(\n      \"flex size-full flex-col rounded-md **:[[cmdk-label]]:hidden\",\n      className,\n    )}\n    {...props}\n  />\n));\nCommand.displayName = CommandPrimitive.displayName;\n\nconst CommandInput = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Input>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input> & {\n    wrapperClassName?: string;\n  }\n>(({ wrapperClassName, className, ...props }, ref) => (\n  <div\n    className={cn(\n      \"group relative flex items-center border-b\",\n      \"border-b-gray-300 dark:border-b-gray-900\",\n      \"hover:border-b-gray-300 dark:hover:border-b-gray-800\",\n      \"hover:bg-gray-100 dark:hover:bg-gray-900\",\n      \"focus-within:border-b-gray-300 dark:focus-within:border-b-gray-800\",\n      \"focus-within:bg-gray-100 dark:focus-within:bg-gray-900\",\n      wrapperClassName,\n    )}\n    cmdk-input-wrapper=\"\"\n  >\n    <Icon\n      name=\"Search\"\n      size={16}\n      className={cn(\n        \"pointer-events-none absolute top-3.5 left-2 text-gray-500 dark:text-gray-700\",\n        \"group-hover:text-gray-700 dark:group-hover:text-gray-500\",\n        \"group-focus-within:text-gray-900! dark:group-focus-within:text-gray-50!\",\n      )}\n    />\n    <CommandPrimitive.Input\n      ref={ref}\n      className={cn(\n        \"flex w-full bg-transparent pt-3 pr-3 pb-2 pl-8 text-sm/5 font-normal outline-none\",\n        \"placeholder:text-gray-500 dark:placeholder:text-gray-700\",\n        \"group-hover:placeholder:text-gray-700 dark:group-hover:placeholder:text-gray-500\",\n        \"group-focus-within:placeholder:text-gray-700! dark:group-focus-within:placeholder:text-gray-300!\",\n        \"disabled:cursor-not-allowed\",\n        className,\n      )}\n      {...props}\n    />\n  </div>\n));\nCommandInput.displayName = CommandPrimitive.Input.displayName;\n\nconst CommandList = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.List\n    ref={ref}\n    className={cn(\n      \"max-h-75 overflow-x-hidden overflow-y-auto\",\n      \"focus:outline-none\",\n      \"scrollbar-thin\",\n      \"scrollbar-track-transparent\",\n      \"scrollbar-thumb-gray-300 hover:scrollbar-thumb-gray-300\",\n      \"dark:scrollbar-thumb-charcoal-700 dark:hover:scrollbar-thumb-charcoal-700\",\n      \"scrollbar-thumb-rounded-md\",\n      className,\n    )}\n    {...props}\n  />\n));\nCommandList.displayName = CommandPrimitive.List.displayName;\n\nconst CommandLoading = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Loading>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Loading>\n>((props, ref) => <CommandPrimitive.Loading ref={ref} {...props} />);\nCommandLoading.displayName = CommandPrimitive.Loading.displayName;\n\nconst CommandEmpty = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Empty>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>((props, ref) => <CommandPrimitive.Empty ref={ref} {...props} />);\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName;\n\nconst CommandGroup = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Group>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Group\n    ref={ref}\n    className={cn(\n      \"overflow-hidden px-0.5 py-1\",\n      \"**:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium\",\n      className,\n    )}\n    {...props}\n  />\n));\nCommandGroup.displayName = CommandPrimitive.Group.displayName;\n\nconst CommandItem = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"relative flex items-center justify-between select-none\",\n      \"h-8 gap-2 rounded-md py-1.5 pr-2.5 pl-1.5\",\n      \"text-sm/4 outline-none\",\n      \"border-y-2 border-white dark:border-slate-600\",\n      \"data-[disabled=true]:pointer-events-none\",\n      \"[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0\",\n      className,\n    )}\n    {...props}\n  />\n));\nCommandItem.displayName = CommandPrimitive.Item.displayName;\n\nexport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandLoading,\n};\n"],"mappings":";;;;;AAIA,MAAME,UAAUE,sBAAMC,YAGnB,EAAEC,WAAW,GAAGC,SAASC,QAC1B,oBAAC,WAAD;CACOA;CACL,WAAWR,GACT,+DACAM,UACD;CACD,GAAIC;CAEP,CAAA,CAAC;AACFL,QAAQO,cAAcN,UAAiBM;AAEvC,MAAMC,eAAeN,sBAAMC,YAKxB,EAAEM,kBAAkBL,WAAW,GAAGC,SAASC,QAC5C,qBAAC,OAAD;CACE,WAAWR,GACT,6CACA,4CACA,wDACA,4CACA,sEACA,0DACAW,iBACD;CACD,sBAAmB;WAVrB,CAYE,oBAAC,MAAD;EACE,MAAK;EACL,MAAM;EACN,WAAWX,GACT,gFACA,4DACA,0EACD;EAAC,CAAA,EAEJ,oBAAC,UAAiB,OAAlB;EACOQ;EACL,WAAWR,GACT,qFACA,4DACA,oFACA,oGACA,+BACAM,UACD;EACD,GAAIC;EAAM,CAAA,CAGf;GAAC;AACFG,aAAaD,cAAcN,UAAiBS,MAAMH;AAElD,MAAMI,cAAcT,sBAAMC,YAGvB,EAAEC,WAAW,GAAGC,SAASC,QAC1B,oBAAC,UAAiB,MAAlB;CACOA;CACL,WAAWR,GACT,8CACA,sBACA,kBACA,+BACA,2DACA,6EACA,8BACAM,UACD;CACD,GAAIC;CAEP,CAAA,CAAC;AACFM,YAAYJ,cAAcN,UAAiBW,KAAKL;AAEhD,MAAMM,iBAAiBX,sBAAMC,YAG1BE,OAAOC,QAAQ,oBAAC,UAAiB,SAAlB;CAA+BA;CAAK,GAAID;CAAS,CAAA,CAAC;AACpEQ,eAAeN,cAAcN,UAAiBa,QAAQP;AAEtD,MAAMQ,eAAeb,sBAAMC,YAGxBE,OAAOC,QAAQ,oBAAC,UAAiB,OAAlB;CAA6BA;CAAK,GAAID;CAAS,CAAA,CAAC;AAClEU,aAAaR,cAAcN,UAAiBe,MAAMT;AAElD,MAAMU,eAAef,sBAAMC,YAGxB,EAAEC,WAAW,GAAGC,SAASC,QAC1B,oBAAC,UAAiB,OAAlB;CACOA;CACL,WAAWR,GACT,+BACA,2IACAM,UACD;CACD,GAAIC;CAEP,CAAA,CAAC;AACFY,aAAaV,cAAcN,UAAiBiB,MAAMX;AAElD,MAAMY,cAAcjB,sBAAMC,YAGvB,EAAEC,WAAW,GAAGC,SAASC,QAC1B,oBAAC,UAAiB,MAAlB;CACOA;CACL,WAAWR,GACT,0DACA,6CACA,0BACA,iDACA,4CACA,+DACAM,UACD;CACD,GAAIC;CAEP,CAAA,CAAC;AACFc,YAAYZ,cAAcN,UAAiBmB,KAAKb"}

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

@@ -1,2 +1,2 @@
-import { n as EnumFieldProps, t as EnumField } from "../../../enum-field-8s8P6tjO.js";
+import { n as EnumFieldProps, t as EnumField } from "../../../enum-field-Db9I-jO3.js";
 export { EnumField, EnumFieldProps };

package/dist/ui/components/form-description/form-description.js

@@ -1,9 +1,9 @@
-import { t as cn } from "../../../src-D4e3Wkrz.js";
+import { t as cn } from "../../../src-BgCjYazJ.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/ui/components/form-description/form-description.tsx
 const FormDescription = ({ children, as, className }) => {
 	return /* @__PURE__ */ jsx(as ?? "p", {
-		className: cn("font-sans text-sm font-normal leading-5 text-gray-600 dark:text-gray-500", className),
+		className: cn("font-sans text-sm/5 font-normal text-gray-600 dark:text-gray-500", className),
 		children
 	});
 };

package/dist/ui/components/form-description/form-description.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-description.js","names":["cn","FormDescription","children","as","className","Component"],"sources":["../../../../src/ui/components/form-description/form-description.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\n\nexport interface FormDescriptionProps extends React.PropsWithChildren {\n  as?: React.ElementType;\n  className?: string;\n}\n\nconst FormDescription: React.FC<FormDescriptionProps> = ({\n  children,\n  as,\n  className,\n}) => {\n  const Component = as ?? \"p\";\n\n  return (\n    <Component\n      className={cn(\n        \"font-sans text-sm font-normal leading-5 text-gray-600 dark:text-gray-500\",\n        className,\n      )}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport { FormDescription };\n"],"mappings":";;;AAOA,MAAMC,mBAAmD,EACvDC,UACAC,IACAC,gBACI;AAGJ,QACE,oBAHgBD,MAAM,KAGtB;EACE,WAAWH,GACT,4EACAI,UACD;EAEAF;EACS,CAAA"}
+{"version":3,"file":"form-description.js","names":["cn","FormDescription","children","as","className","Component"],"sources":["../../../../src/ui/components/form-description/form-description.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\n\nexport interface FormDescriptionProps extends React.PropsWithChildren {\n  as?: React.ElementType;\n  className?: string;\n}\n\nconst FormDescription: React.FC<FormDescriptionProps> = ({\n  children,\n  as,\n  className,\n}) => {\n  const Component = as ?? \"p\";\n\n  return (\n    <Component\n      className={cn(\n        \"font-sans text-sm/5 font-normal text-gray-600 dark:text-gray-500\",\n        className,\n      )}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport { FormDescription };\n"],"mappings":";;;AAOA,MAAMC,mBAAmD,EACvDC,UACAC,IACAC,gBACI;AAGJ,QACE,oBAHgBD,MAAM,KAGtB;EACE,WAAWH,GACT,oEACAI,UACD;EAEAF;EACS,CAAA"}

package/dist/ui/components/form-label/form-label.js

@@ -1,9 +1,9 @@
-import { h as Icon, t as cn } from "../../../src-D4e3Wkrz.js";
+import { h as Icon, t as cn } from "../../../src-BgCjYazJ.js";
 import { Tooltip, TooltipProvider as Provider } from "../tooltip/tooltip.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/ui/components/form-label/form-label.tsx
 const FormLabel = ({ children, required, disabled, description, hasError, inline, className, ...htmlLabelProps }) => {
-	const classes = cn("inline-flex items-center text-sm font-medium", inline ? "leading-[22px]" : "leading-4", `text-gray-900 ${inline ? "dark:text-gray-400" : "dark:text-gray-50"}`, hasError && "group-hover:!text-red-900 dark:group-hover:!text-red-900", hasError && inline && "text-red-800 dark:text-red-800", hasError && !inline && "text-red-900 dark:text-red-900", disabled && `cursor-not-allowed text-gray-700 ${inline ? "dark:text-gray-600" : "dark:text-gray-300"}`, inline ? !disabled && "group-hover:text-gray-900 dark:group-hover:text-slate-50" : "mb-[3px]", className);
+	const classes = cn("inline-flex items-center text-sm font-medium", inline ? "leading-[22px]" : "leading-4", `text-gray-900 ${inline ? "dark:text-gray-400" : "dark:text-gray-50"}`, hasError && "group-hover:text-red-900! dark:group-hover:text-red-900!", hasError && inline && "text-red-800 dark:text-red-800", hasError && !inline && "text-red-900 dark:text-red-900", disabled && `cursor-not-allowed text-gray-700 ${inline ? "dark:text-gray-600" : "dark:text-gray-300"}`, inline ? !disabled && "group-hover:text-gray-900 dark:group-hover:text-slate-50" : "mb-[3px]", className);
 	if (!children) return null;
 	return /* @__PURE__ */ jsxs("label", {
 		className: classes,
@@ -11,7 +11,7 @@ const FormLabel = ({ children, required, disabled, description, hasError, inline
 		children: [
 			children,
 			required && /* @__PURE__ */ jsx("span", {
-				className: cn("ml-1 text-gray-800 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-slate-50", hasError && `${inline ? "!text-red-800" : "!text-red-900"} group-hover:!text-red-900`),
+				className: cn("ml-1 text-gray-800 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-slate-50", hasError && `${inline ? "text-red-800!" : "text-red-900!"} group-hover:text-red-900!`),
 				children: "*"
 			}),
 			description && /* @__PURE__ */ jsx(Provider, { children: /* @__PURE__ */ jsx(Tooltip, {

package/dist/ui/components/form-label/form-label.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-label.js","names":["cn","Icon","Tooltip","TooltipProvider","FormLabel","children","required","disabled","description","hasError","inline","className","htmlLabelProps","classes","extraProps"],"sources":["../../../../src/ui/components/form-label/form-label.tsx"],"sourcesContent":["import { cn, Icon } from \"#design-system\";\nimport { Tooltip, TooltipProvider } from \"../tooltip/tooltip.js\";\n\nexport interface FormLabelProps\n  extends React.PropsWithChildren, React.LabelHTMLAttributes<HTMLLabelElement> {\n  required?: boolean;\n  disabled?: boolean;\n  description?: string;\n  hasError?: boolean;\n  inline?: boolean;\n  className?: string;\n}\n\nexport const FormLabel: React.FC<FormLabelProps> = ({\n  children,\n  required,\n  disabled,\n  description,\n  hasError,\n  inline,\n  className,\n  ...htmlLabelProps\n}) => {\n  const classes = cn(\n    \"inline-flex items-center text-sm font-medium\",\n    inline ? \"leading-[22px]\" : \"leading-4\",\n    `text-gray-900 ${inline ? \"dark:text-gray-400\" : \"dark:text-gray-50\"}`,\n    hasError && \"group-hover:!text-red-900 dark:group-hover:!text-red-900\",\n    hasError && inline && \"text-red-800 dark:text-red-800\",\n    hasError && !inline && \"text-red-900 dark:text-red-900\",\n    disabled &&\n      `cursor-not-allowed text-gray-700 ${\n        inline ? \"dark:text-gray-600\" : \"dark:text-gray-300\"\n      }`,\n    inline\n      ? !disabled && \"group-hover:text-gray-900 dark:group-hover:text-slate-50\"\n      : \"mb-[3px]\",\n    className,\n  );\n\n  if (!children) {\n    // no label provided\n    return null;\n  }\n\n  const extraProps = {\n    ...htmlLabelProps,\n  };\n\n  return (\n    <label className={classes} {...extraProps}>\n      {children}\n      {required && (\n        <span\n          className={cn(\n            \"ml-1 text-gray-800 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-slate-50\",\n            hasError &&\n              `${inline ? \"!text-red-800\" : \"!text-red-900\"} group-hover:!text-red-900`,\n          )}\n        >\n          *\n        </span>\n      )}\n\n      {description && (\n        <TooltipProvider>\n          <Tooltip content={description}>\n            <Icon\n              name=\"CircleInfo\"\n              size={16}\n              className={cn(\n                \"ml-1 cursor-pointer text-gray-600 hover:text-gray-500 dark:text-gray-500 dark:hover:text-gray-500\",\n                disabled && \"text-gray-500\",\n              )}\n            />\n          </Tooltip>\n        </TooltipProvider>\n      )}\n    </label>\n  );\n};\n"],"mappings":";;;;AAaA,MAAaI,aAAuC,EAClDC,UACAC,UACAC,UACAC,aACAC,UACAC,QACAC,WACA,GAAGC,qBACC;CACJ,MAAMC,UAAUb,GACd,gDACAU,SAAS,mBAAmB,aAC5B,iBAAiBA,SAAS,uBAAuB,uBACjDD,YAAY,4DACZA,YAAYC,UAAU,kCACtBD,YAAY,CAACC,UAAU,kCACvBH,YACE,oCACEG,SAAS,uBAAuB,wBAEpCA,SACI,CAACH,YAAY,6DACb,YACJI,UACD;AAED,KAAI,CAACN,SAEH,QAAO;AAOT,QACE,qBAAC,SAAD;EAAO,WAAWQ;EAJlB,GAAGD;YAIH;GACGP;GACAC,YACC,oBAAC,QAAD;IACE,WAAWN,GACT,kGACAS,YACE,GAAGC,SAAS,kBAAkB,gBAAe,4BAChD;cAAC;IAIL,CAAA;GAEAF,eACC,oBAAC,UAAD,EAAA,UACE,oBAAC,SAAD;IAAS,SAASA;cAChB,oBAAC,MAAD;KACE,MAAK;KACL,MAAM;KACN,WAAWR,GACT,qGACAO,YAAY,gBACb;KAAC,CAAA;IAEG,CAAA,EAEZ,CAAA;GACK"}
+{"version":3,"file":"form-label.js","names":["cn","Icon","Tooltip","TooltipProvider","FormLabel","children","required","disabled","description","hasError","inline","className","htmlLabelProps","classes","extraProps"],"sources":["../../../../src/ui/components/form-label/form-label.tsx"],"sourcesContent":["import { cn, Icon } from \"#design-system\";\nimport { Tooltip, TooltipProvider } from \"../tooltip/tooltip.js\";\n\nexport interface FormLabelProps\n  extends React.PropsWithChildren, React.LabelHTMLAttributes<HTMLLabelElement> {\n  required?: boolean;\n  disabled?: boolean;\n  description?: string;\n  hasError?: boolean;\n  inline?: boolean;\n  className?: string;\n}\n\nexport const FormLabel: React.FC<FormLabelProps> = ({\n  children,\n  required,\n  disabled,\n  description,\n  hasError,\n  inline,\n  className,\n  ...htmlLabelProps\n}) => {\n  const classes = cn(\n    \"inline-flex items-center text-sm font-medium\",\n    inline ? \"leading-[22px]\" : \"leading-4\",\n    `text-gray-900 ${inline ? \"dark:text-gray-400\" : \"dark:text-gray-50\"}`,\n    hasError && \"group-hover:text-red-900! dark:group-hover:text-red-900!\",\n    hasError && inline && \"text-red-800 dark:text-red-800\",\n    hasError && !inline && \"text-red-900 dark:text-red-900\",\n    disabled &&\n      `cursor-not-allowed text-gray-700 ${\n        inline ? \"dark:text-gray-600\" : \"dark:text-gray-300\"\n      }`,\n    inline\n      ? !disabled && \"group-hover:text-gray-900 dark:group-hover:text-slate-50\"\n      : \"mb-[3px]\",\n    className,\n  );\n\n  if (!children) {\n    // no label provided\n    return null;\n  }\n\n  const extraProps = {\n    ...htmlLabelProps,\n  };\n\n  return (\n    <label className={classes} {...extraProps}>\n      {children}\n      {required && (\n        <span\n          className={cn(\n            \"ml-1 text-gray-800 group-hover:text-gray-900 dark:text-gray-400 dark:group-hover:text-slate-50\",\n            hasError &&\n              `${inline ? \"text-red-800!\" : \"text-red-900!\"} group-hover:text-red-900!`,\n          )}\n        >\n          *\n        </span>\n      )}\n\n      {description && (\n        <TooltipProvider>\n          <Tooltip content={description}>\n            <Icon\n              name=\"CircleInfo\"\n              size={16}\n              className={cn(\n                \"ml-1 cursor-pointer text-gray-600 hover:text-gray-500 dark:text-gray-500 dark:hover:text-gray-500\",\n                disabled && \"text-gray-500\",\n              )}\n            />\n          </Tooltip>\n        </TooltipProvider>\n      )}\n    </label>\n  );\n};\n"],"mappings":";;;;AAaA,MAAaI,aAAuC,EAClDC,UACAC,UACAC,UACAC,aACAC,UACAC,QACAC,WACA,GAAGC,qBACC;CACJ,MAAMC,UAAUb,GACd,gDACAU,SAAS,mBAAmB,aAC5B,iBAAiBA,SAAS,uBAAuB,uBACjDD,YAAY,4DACZA,YAAYC,UAAU,kCACtBD,YAAY,CAACC,UAAU,kCACvBH,YACE,oCACEG,SAAS,uBAAuB,wBAEpCA,SACI,CAACH,YAAY,6DACb,YACJI,UACD;AAED,KAAI,CAACN,SAEH,QAAO;AAOT,QACE,qBAAC,SAAD;EAAO,WAAWQ;EAJlB,GAAGD;YAIH;GACGP;GACAC,YACC,oBAAC,QAAD;IACE,WAAWN,GACT,kGACAS,YACE,GAAGC,SAAS,kBAAkB,gBAAe,4BAChD;cAAC;IAIL,CAAA;GAEAF,eACC,oBAAC,UAAD,EAAA,UACE,oBAAC,SAAD;IAAS,SAASA;cAChB,oBAAC,MAAD;KACE,MAAK;KACL,MAAM;KACN,WAAWR,GACT,qGACAO,YAAY,gBACb;KAAC,CAAA;IAEG,CAAA,EAEZ,CAAA;GACK"}

package/dist/ui/components/form-message/form-message.js

@@ -1,4 +1,4 @@
-import { t as cn } from "../../../src-D4e3Wkrz.js";
+import { t as cn } from "../../../src-BgCjYazJ.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/ui/components/form-message/form-message.tsx
 const defaultElement = "p";

package/dist/ui/components/form-message/message-list.js

@@ -1,4 +1,4 @@
-import { t as cn } from "../../../src-D4e3Wkrz.js";
+import { t as cn } from "../../../src-BgCjYazJ.js";
 import { FormMessage } from "./form-message.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/ui/components/form-message/message-list.tsx
@@ -20,7 +20,7 @@ const FormMessageList = ({ messages, type = "info", className, ...props }) => {
 		children: messages.map((message) => /* @__PURE__ */ jsx(FormMessage, {
 			as: "li",
 			type,
-			className: cn("relative pl-4", "before:absolute before:left-0 before:top-[0.4em] before:size-2 before:rounded-full", typeClasses[type]),
+			className: cn("relative pl-4", "before:absolute before:top-[0.4em] before:left-0 before:size-2 before:rounded-full", typeClasses[type]),
 			children: message
 		}, message))
 	});

package/dist/ui/components/form-message/message-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"message-list.js","names":["cn","FormMessage","FormMessageList","messages","type","className","props","length","typeClasses","error","info","warning","map","message"],"sources":["../../../../src/ui/components/form-message/message-list.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport type { FormMessageType } from \"./form-message.js\";\nimport { FormMessage } from \"./form-message.js\";\n\ninterface FormMessageListProps {\n  messages: string[];\n  type?: FormMessageType;\n  className?: string;\n}\n\nexport const FormMessageList: React.FC<FormMessageListProps> = ({\n  messages,\n  type = \"info\",\n  className,\n  ...props\n}) => {\n  if (messages.length === 0) {\n    return null;\n  }\n\n  if (messages.length === 1) {\n    return (\n      <FormMessage type={type} {...props}>\n        {messages[0]}\n      </FormMessage>\n    );\n  }\n\n  const typeClasses: Record<FormMessageType, string> = {\n    error: \"before:bg-red-900 dark:before:bg-red-900\",\n    info: \"before:bg-blue-900 dark:before:bg-blue-900\",\n    warning: \"before:bg-orange-900 dark:before:bg-orange-900\",\n  };\n\n  return (\n    <ul className={cn(\"flex flex-col gap-1\", className)} {...props}>\n      {messages.map((message) => (\n        <FormMessage\n          key={message}\n          as=\"li\"\n          type={type}\n          className={cn(\n            // Layout\n            \"relative pl-4\",\n            // Visual styles\n            \"before:absolute before:left-0 before:top-[0.4em] before:size-2 before:rounded-full\",\n            typeClasses[type],\n          )}\n        >\n          {message}\n        </FormMessage>\n      ))}\n    </ul>\n  );\n};\n"],"mappings":";;;;AAUA,MAAaE,mBAAmD,EAC9DC,UACAC,OAAO,QACPC,WACA,GAAGC,YACC;AACJ,KAAIH,SAASI,WAAW,EACtB,QAAO;AAGT,KAAIJ,SAASI,WAAW,EACtB,QACE,oBAAC,aAAD;EAAmBH;EAAM,GAAIE;YAC1BH,SAAS;EACE,CAAA;CAIlB,MAAMK,cAA+C;EACnDC,OAAO;EACPC,MAAM;EACNC,SAAS;EACV;AAED,QACE,oBAAC,MAAD;EAAI,WAAWX,GAAG,uBAAuBK,UAAU;EAAE,GAAIC;YACtDH,SAASS,KAAKC,YACb,oBAAC,aAAD;GAEE,IAAG;GACGT;GACN,WAAWJ,GAET,iBAEA,sFACAQ,YAAYJ,MACb;aAEAS;GAEJ,EAbQA,QAaR,CAAC;EACC,CAAA"}
+{"version":3,"file":"message-list.js","names":["cn","FormMessage","FormMessageList","messages","type","className","props","length","typeClasses","error","info","warning","map","message"],"sources":["../../../../src/ui/components/form-message/message-list.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport type { FormMessageType } from \"./form-message.js\";\nimport { FormMessage } from \"./form-message.js\";\n\ninterface FormMessageListProps {\n  messages: string[];\n  type?: FormMessageType;\n  className?: string;\n}\n\nexport const FormMessageList: React.FC<FormMessageListProps> = ({\n  messages,\n  type = \"info\",\n  className,\n  ...props\n}) => {\n  if (messages.length === 0) {\n    return null;\n  }\n\n  if (messages.length === 1) {\n    return (\n      <FormMessage type={type} {...props}>\n        {messages[0]}\n      </FormMessage>\n    );\n  }\n\n  const typeClasses: Record<FormMessageType, string> = {\n    error: \"before:bg-red-900 dark:before:bg-red-900\",\n    info: \"before:bg-blue-900 dark:before:bg-blue-900\",\n    warning: \"before:bg-orange-900 dark:before:bg-orange-900\",\n  };\n\n  return (\n    <ul className={cn(\"flex flex-col gap-1\", className)} {...props}>\n      {messages.map((message) => (\n        <FormMessage\n          key={message}\n          as=\"li\"\n          type={type}\n          className={cn(\n            // Layout\n            \"relative pl-4\",\n            // Visual styles\n            \"before:absolute before:top-[0.4em] before:left-0 before:size-2 before:rounded-full\",\n            typeClasses[type],\n          )}\n        >\n          {message}\n        </FormMessage>\n      ))}\n    </ul>\n  );\n};\n"],"mappings":";;;;AAUA,MAAaE,mBAAmD,EAC9DC,UACAC,OAAO,QACPC,WACA,GAAGC,YACC;AACJ,KAAIH,SAASI,WAAW,EACtB,QAAO;AAGT,KAAIJ,SAASI,WAAW,EACtB,QACE,oBAAC,aAAD;EAAmBH;EAAM,GAAIE;YAC1BH,SAAS;EACE,CAAA;CAIlB,MAAMK,cAA+C;EACnDC,OAAO;EACPC,MAAM;EACNC,SAAS;EACV;AAED,QACE,oBAAC,MAAD;EAAI,WAAWX,GAAG,uBAAuBK,UAAU;EAAE,GAAIC;YACtDH,SAASS,KAAKC,YACb,oBAAC,aAAD;GAEE,IAAG;GACGT;GACN,WAAWJ,GAET,iBAEA,sFACAQ,YAAYJ,MACb;aAEAS;GAEJ,EAbQA,QAaR,CAAC;EACC,CAAA"}

package/dist/ui/components/id-autocomplete/id-autocomplete-input-container.js

@@ -1,4 +1,4 @@
-import { h as Icon, t as cn } from "../../../src-D4e3Wkrz.js";
+import { h as Icon, t as cn } from "../../../src-BgCjYazJ.js";
 import { Tooltip, TooltipProvider as Provider } from "../tooltip/tooltip.js";
 import { sharedValueTransformers } from "../../lib/shared-value-transformers.js";
 import { Input } from "../input/input.js";
@@ -67,7 +67,7 @@ const IdAutocompleteInputContainer = /* @__PURE__ */ React.forwardRef(({ id, nam
 				})
 			})
 		}), /* @__PURE__ */ jsxs("div", {
-			className: cn("absolute right-3 top-1/2 flex size-4 -translate-y-1/2 items-center", !isLoading && !haveFetchError && !selectedOption && "pointer-events-none"),
+			className: cn("absolute top-1/2 right-3 flex size-4 -translate-y-1/2 items-center", !isLoading && !haveFetchError && !selectedOption && "pointer-events-none"),
 			children: [
 				isLoading && /* @__PURE__ */ jsx(Icon, {
 					name: "Reload",

package/dist/ui/components/id-autocomplete/id-autocomplete-input-container.js.map

@@ -1 +1 @@
-{"version":3,"file":"id-autocomplete-input-container.js","names":["cn","Icon","sharedValueTransformers","Command","CommandPrimitive","React","useMemo","useState","useMediaQuery","Input","Tooltip","TooltipProvider","ValueTransformer","IdAutocompleteInputContainer","forwardRef","id","name","value","className","isLoading","haveFetchError","disabled","onChange","onBlur","onClick","selectedOption","optionsLength","handleOpenChange","onKeyDown","onMouseDown","placeholder","hasError","label","required","isPopoverOpen","maxLength","handlePaste","onPaste","props","ref","hasCopied","setHasCopied","hasHover","transformers","trimOnBlur","trimOnEnter","e","input","target","isOptionsRelatedKey","includes","key","preventDefault","stopPropagation","contains","document","activeElement","requestAnimationFrame","select","undefined","navigator","clipboard","writeText","then","setTimeout","catch","error","console"],"sources":["../../../../src/ui/components/id-autocomplete/id-autocomplete-input-container.tsx"],"sourcesContent":["import type { TransformerType } from \"#design-system\";\nimport { cn, Icon } from \"#design-system\";\nimport { sharedValueTransformers } from \"#design-system/ui/lib\";\nimport { Command as CommandPrimitive } from \"cmdk\";\nimport React, { useMemo, useState } from \"react\";\nimport { useMediaQuery } from \"usehooks-ts\";\nimport type { InputBaseProps } from \"../../types.js\";\nimport { Input } from \"../input/input.js\";\nimport { Tooltip, TooltipProvider } from \"../tooltip/tooltip.js\";\nimport { ValueTransformer } from \"../value-transformer/value-transformer.js\";\nimport type { IdAutocompleteOption } from \"./types.js\";\n\ninterface IdAutocompleteInputContainerProps extends Omit<\n  InputBaseProps<string>,\n  \"defaultValue\" | \"errors\" | \"warnings\"\n> {\n  isLoading: boolean;\n  haveFetchError: boolean;\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  onClick?: (e: React.MouseEvent<HTMLInputElement>) => void;\n  selectedOption?: IdAutocompleteOption;\n  optionsLength: number;\n  handleOpenChange?: (open: boolean) => void;\n  onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n  onMouseDown?: (e: React.MouseEvent<HTMLInputElement>) => void;\n  placeholder?: string;\n  hasError: boolean;\n  isPopoverOpen: boolean;\n  maxLength?: number;\n  handlePaste?: (e: React.ClipboardEvent<HTMLInputElement>) => void;\n  onPaste?: (e: React.ClipboardEvent<HTMLInputElement>) => void;\n}\n\nconst IdAutocompleteInputContainer = React.forwardRef<\n  HTMLInputElement,\n  IdAutocompleteInputContainerProps\n>(\n  (\n    {\n      id,\n      name,\n      value,\n      className,\n      isLoading,\n      haveFetchError,\n      disabled,\n      onChange,\n      onBlur,\n      onClick,\n      selectedOption,\n      optionsLength,\n      handleOpenChange,\n      onKeyDown,\n      onMouseDown,\n      placeholder,\n      hasError,\n      label,\n      required,\n      isPopoverOpen,\n      maxLength,\n      handlePaste,\n      onPaste,\n      ...props\n    },\n    ref,\n  ) => {\n    const [hasCopied, setHasCopied] = useState(false);\n    const hasHover = useMediaQuery(\"(hover: hover) and (pointer: fine)\");\n\n    const transformers: TransformerType = useMemo(\n      () => [\n        sharedValueTransformers.trimOnBlur(),\n        sharedValueTransformers.trimOnEnter(),\n      ],\n      [],\n    );\n\n    return (\n      <div className={cn(\"group relative\")}>\n        <ValueTransformer transformers={transformers}>\n          <CommandPrimitive.Input asChild>\n            <Input\n              id={id}\n              name={name}\n              value={value}\n              className={cn(\"pr-9\", className)}\n              disabled={disabled}\n              onChange={onChange}\n              onBlur={onBlur}\n              onClick={(e) => {\n                const input = e.target as HTMLInputElement;\n                if (\n                  !(isLoading || haveFetchError) &&\n                  !selectedOption &&\n                  input.value !== \"\"\n                ) {\n                  handleOpenChange?.(true);\n                }\n                onClick?.(e);\n              }}\n              onKeyDown={(e) => {\n                onKeyDown?.(e);\n                const isOptionsRelatedKey = [\n                  \"ArrowUp\",\n                  \"ArrowDown\",\n                  \"Enter\",\n                ].includes(e.key);\n\n                if (e.key === \"Enter\" && isPopoverOpen && optionsLength === 0) {\n                  handleOpenChange?.(false);\n                  e.preventDefault();\n                  return;\n                }\n                if (\n                  !(isOptionsRelatedKey && isPopoverOpen && optionsLength > 0)\n                ) {\n                  e.stopPropagation();\n                }\n              }}\n              onMouseDown={(e) => {\n                const input = e.target as HTMLInputElement;\n                if (!input.contains(document.activeElement)) {\n                  // wait for the next tick to ensure the focus occurs first\n                  requestAnimationFrame(() => {\n                    input.select();\n                  });\n                }\n                onMouseDown?.(e);\n              }}\n              onPaste={(e) => {\n                handlePaste?.(e);\n                onPaste?.(e);\n              }}\n              placeholder={placeholder}\n              aria-invalid={hasError}\n              aria-label={!label ? \"Id Autocomplete\" : undefined}\n              aria-required={required}\n              aria-expanded={isPopoverOpen}\n              maxLength={maxLength}\n              {...props}\n              ref={ref}\n            />\n          </CommandPrimitive.Input>\n        </ValueTransformer>\n        <div\n          className={cn(\n            \"absolute right-3 top-1/2 flex size-4 -translate-y-1/2 items-center\",\n            !isLoading &&\n              !haveFetchError &&\n              !selectedOption &&\n              \"pointer-events-none\",\n          )}\n        >\n          {isLoading && (\n            <Icon\n              name=\"Reload\"\n              size={16}\n              className={cn(\"animate-spin text-gray-500 dark:text-gray-600\")}\n            />\n          )}\n          {haveFetchError && (\n            <TooltipProvider>\n              <Tooltip content=\"Network error!\">\n                <Icon name=\"Error\" size={16} className={cn(\"text-red-900\")} />\n              </Tooltip>\n            </TooltipProvider>\n          )}\n          {selectedOption && !isLoading && !haveFetchError && (\n            <TooltipProvider>\n              <Tooltip content=\"Copied!\" open={hasCopied} triggerAsChild>\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    navigator.clipboard\n                      .writeText(selectedOption.value)\n                      .then(() => {\n                        setHasCopied(true);\n                        setTimeout(() => setHasCopied(false), 2000);\n                      })\n                      .catch((error) => {\n                        console.error(\"Failed to copy value: \", error);\n                      });\n                  }}\n                  className={cn(\n                    \"focus-visible:outline-none [&_svg]:pointer-events-none\",\n                    hasHover &&\n                      \"opacity-0 transition-opacity duration-500 group-hover:opacity-100\",\n                  )}\n                >\n                  <Icon\n                    name=\"Copy\"\n                    size={16}\n                    className={cn(\"text-gray-500 dark:text-gray-600\")}\n                  />\n                </button>\n              </Tooltip>\n            </TooltipProvider>\n          )}\n        </div>\n      </div>\n    );\n  },\n);\n\nexport { IdAutocompleteInputContainer, type IdAutocompleteInputContainerProps };\n"],"mappings":"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"}
+{"version":3,"file":"id-autocomplete-input-container.js","names":["cn","Icon","sharedValueTransformers","Command","CommandPrimitive","React","useMemo","useState","useMediaQuery","Input","Tooltip","TooltipProvider","ValueTransformer","IdAutocompleteInputContainer","forwardRef","id","name","value","className","isLoading","haveFetchError","disabled","onChange","onBlur","onClick","selectedOption","optionsLength","handleOpenChange","onKeyDown","onMouseDown","placeholder","hasError","label","required","isPopoverOpen","maxLength","handlePaste","onPaste","props","ref","hasCopied","setHasCopied","hasHover","transformers","trimOnBlur","trimOnEnter","e","input","target","isOptionsRelatedKey","includes","key","preventDefault","stopPropagation","contains","document","activeElement","requestAnimationFrame","select","undefined","navigator","clipboard","writeText","then","setTimeout","catch","error","console"],"sources":["../../../../src/ui/components/id-autocomplete/id-autocomplete-input-container.tsx"],"sourcesContent":["import type { TransformerType } from \"#design-system\";\nimport { cn, Icon } from \"#design-system\";\nimport { sharedValueTransformers } from \"#design-system/ui/lib\";\nimport { Command as CommandPrimitive } from \"cmdk\";\nimport React, { useMemo, useState } from \"react\";\nimport { useMediaQuery } from \"usehooks-ts\";\nimport type { InputBaseProps } from \"../../types.js\";\nimport { Input } from \"../input/input.js\";\nimport { Tooltip, TooltipProvider } from \"../tooltip/tooltip.js\";\nimport { ValueTransformer } from \"../value-transformer/value-transformer.js\";\nimport type { IdAutocompleteOption } from \"./types.js\";\n\ninterface IdAutocompleteInputContainerProps extends Omit<\n  InputBaseProps<string>,\n  \"defaultValue\" | \"errors\" | \"warnings\"\n> {\n  isLoading: boolean;\n  haveFetchError: boolean;\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  onClick?: (e: React.MouseEvent<HTMLInputElement>) => void;\n  selectedOption?: IdAutocompleteOption;\n  optionsLength: number;\n  handleOpenChange?: (open: boolean) => void;\n  onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n  onMouseDown?: (e: React.MouseEvent<HTMLInputElement>) => void;\n  placeholder?: string;\n  hasError: boolean;\n  isPopoverOpen: boolean;\n  maxLength?: number;\n  handlePaste?: (e: React.ClipboardEvent<HTMLInputElement>) => void;\n  onPaste?: (e: React.ClipboardEvent<HTMLInputElement>) => void;\n}\n\nconst IdAutocompleteInputContainer = React.forwardRef<\n  HTMLInputElement,\n  IdAutocompleteInputContainerProps\n>(\n  (\n    {\n      id,\n      name,\n      value,\n      className,\n      isLoading,\n      haveFetchError,\n      disabled,\n      onChange,\n      onBlur,\n      onClick,\n      selectedOption,\n      optionsLength,\n      handleOpenChange,\n      onKeyDown,\n      onMouseDown,\n      placeholder,\n      hasError,\n      label,\n      required,\n      isPopoverOpen,\n      maxLength,\n      handlePaste,\n      onPaste,\n      ...props\n    },\n    ref,\n  ) => {\n    const [hasCopied, setHasCopied] = useState(false);\n    const hasHover = useMediaQuery(\"(hover: hover) and (pointer: fine)\");\n\n    const transformers: TransformerType = useMemo(\n      () => [\n        sharedValueTransformers.trimOnBlur(),\n        sharedValueTransformers.trimOnEnter(),\n      ],\n      [],\n    );\n\n    return (\n      <div className={cn(\"group relative\")}>\n        <ValueTransformer transformers={transformers}>\n          <CommandPrimitive.Input asChild>\n            <Input\n              id={id}\n              name={name}\n              value={value}\n              className={cn(\"pr-9\", className)}\n              disabled={disabled}\n              onChange={onChange}\n              onBlur={onBlur}\n              onClick={(e) => {\n                const input = e.target as HTMLInputElement;\n                if (\n                  !(isLoading || haveFetchError) &&\n                  !selectedOption &&\n                  input.value !== \"\"\n                ) {\n                  handleOpenChange?.(true);\n                }\n                onClick?.(e);\n              }}\n              onKeyDown={(e) => {\n                onKeyDown?.(e);\n                const isOptionsRelatedKey = [\n                  \"ArrowUp\",\n                  \"ArrowDown\",\n                  \"Enter\",\n                ].includes(e.key);\n\n                if (e.key === \"Enter\" && isPopoverOpen && optionsLength === 0) {\n                  handleOpenChange?.(false);\n                  e.preventDefault();\n                  return;\n                }\n                if (\n                  !(isOptionsRelatedKey && isPopoverOpen && optionsLength > 0)\n                ) {\n                  e.stopPropagation();\n                }\n              }}\n              onMouseDown={(e) => {\n                const input = e.target as HTMLInputElement;\n                if (!input.contains(document.activeElement)) {\n                  // wait for the next tick to ensure the focus occurs first\n                  requestAnimationFrame(() => {\n                    input.select();\n                  });\n                }\n                onMouseDown?.(e);\n              }}\n              onPaste={(e) => {\n                handlePaste?.(e);\n                onPaste?.(e);\n              }}\n              placeholder={placeholder}\n              aria-invalid={hasError}\n              aria-label={!label ? \"Id Autocomplete\" : undefined}\n              aria-required={required}\n              aria-expanded={isPopoverOpen}\n              maxLength={maxLength}\n              {...props}\n              ref={ref}\n            />\n          </CommandPrimitive.Input>\n        </ValueTransformer>\n        <div\n          className={cn(\n            \"absolute top-1/2 right-3 flex size-4 -translate-y-1/2 items-center\",\n            !isLoading &&\n              !haveFetchError &&\n              !selectedOption &&\n              \"pointer-events-none\",\n          )}\n        >\n          {isLoading && (\n            <Icon\n              name=\"Reload\"\n              size={16}\n              className={cn(\"animate-spin text-gray-500 dark:text-gray-600\")}\n            />\n          )}\n          {haveFetchError && (\n            <TooltipProvider>\n              <Tooltip content=\"Network error!\">\n                <Icon name=\"Error\" size={16} className={cn(\"text-red-900\")} />\n              </Tooltip>\n            </TooltipProvider>\n          )}\n          {selectedOption && !isLoading && !haveFetchError && (\n            <TooltipProvider>\n              <Tooltip content=\"Copied!\" open={hasCopied} triggerAsChild>\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    navigator.clipboard\n                      .writeText(selectedOption.value)\n                      .then(() => {\n                        setHasCopied(true);\n                        setTimeout(() => setHasCopied(false), 2000);\n                      })\n                      .catch((error) => {\n                        console.error(\"Failed to copy value: \", error);\n                      });\n                  }}\n                  className={cn(\n                    \"focus-visible:outline-none [&_svg]:pointer-events-none\",\n                    hasHover &&\n                      \"opacity-0 transition-opacity duration-500 group-hover:opacity-100\",\n                  )}\n                >\n                  <Icon\n                    name=\"Copy\"\n                    size={16}\n                    className={cn(\"text-gray-500 dark:text-gray-600\")}\n                  />\n                </button>\n              </Tooltip>\n            </TooltipProvider>\n          )}\n        </div>\n      </div>\n    );\n  },\n);\n\nexport { IdAutocompleteInputContainer, type IdAutocompleteInputContainerProps };\n"],"mappings":"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"}

package/dist/ui/components/id-autocomplete/id-autocomplete-list-option.js

@@ -1,4 +1,4 @@
-import { h as Icon, t as cn } from "../../../src-D4e3Wkrz.js";
+import { h as Icon, t as cn } from "../../../src-BgCjYazJ.js";
 import React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/ui/components/id-autocomplete/id-autocomplete-list-option.tsx
@@ -25,14 +25,14 @@ const ReloadButton = ({ isLoadingSelectedOption, handleFetchSelectedOption, isFe
 	children: /* @__PURE__ */ jsx(Icon, {
 		name: isFetchSelectedOptionSync ? "Checkmark" : "Reload",
 		size: 16,
-		className: cn("text-gray-500 dark:text-gray-600", isLoadingSelectedOption && "animate-spin", isFetchSelectedOptionSync && "animate-in fade-in duration-500")
+		className: cn("text-gray-500 dark:text-gray-600", isLoadingSelectedOption && "animate-spin", isFetchSelectedOptionSync && "animate-fade-in duration-500")
 	})
 }) });
 const IdAutocompleteListOption = ({ variant = "withValue", icon, title = "Title not available", path = "Path not available", value, description = "Description not available", asPlaceholder, showValue = true, isLoadingSelectedOption, handleFetchSelectedOption, isFetchSelectedOptionSync, className, placeholderIcon = "PowerhouseLogoSmall", ...extraProps }) => {
 	const renderWithValue = () => /* @__PURE__ */ jsx("div", {
 		className: cn("flex w-full items-center"),
 		children: /* @__PURE__ */ jsx("span", {
-			className: cn("truncate text-xs leading-5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-500 dark:text-gray-600"),
+			className: cn("truncate text-xs/5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-500 dark:text-gray-600"),
 			children: value
 		})
 	});
@@ -49,16 +49,16 @@ const IdAutocompleteListOption = ({ variant = "withValue", icon, title = "Title
 					/* @__PURE__ */ jsxs("div", {
 						className: cn("flex min-w-0 grow flex-col gap-[-2px]"),
 						children: [/* @__PURE__ */ jsx("span", {
-							className: cn("truncate text-sm font-bold leading-5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-900 dark:text-gray-300"),
+							className: cn("truncate text-sm/5 font-bold", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-900 dark:text-gray-300"),
 							children: title
 						}), !showValue && typeof path === "object" ? /* @__PURE__ */ jsx("a", {
 							href: path.url,
 							target: "_blank",
 							rel: "noopener noreferrer",
-							className: cn("truncate text-xs leading-5 text-blue-900 hover:underline focus-visible:outline-none"),
+							className: cn("truncate text-xs/5 text-blue-900 hover:underline focus-visible:outline-none"),
 							children: path.text
 						}) : /* @__PURE__ */ jsx("span", {
-							className: cn("truncate text-xs leading-5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-500 dark:text-gray-600"),
+							className: cn("truncate text-xs/5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-500 dark:text-gray-600"),
 							children: typeof path === "object" ? path.text : path
 						})]
 					}),
@@ -73,21 +73,21 @@ const IdAutocompleteListOption = ({ variant = "withValue", icon, title = "Title
 			showValue && /* @__PURE__ */ jsx("div", {
 				className: cn("flex max-w-full items-center"),
 				children: /* @__PURE__ */ jsx("span", {
-					className: cn("truncate text-xs leading-5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-500 dark:text-gray-600"),
+					className: cn("truncate text-xs/5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-500 dark:text-gray-600"),
 					children: value
 				})
 			}),
 			showDescription && /* @__PURE__ */ jsx("div", {
 				className: cn("flex flex-col"),
 				children: /* @__PURE__ */ jsx("p", {
-					className: cn("line-clamp-2 text-xs leading-5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-900 dark:text-gray-300"),
+					className: cn("line-clamp-2 text-xs/5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-900 dark:text-gray-300"),
 					children: description
 				})
 			}),
 			showDescription && "agentType" in extraProps && typeof extraProps.agentType === "string" && /* @__PURE__ */ jsx("div", {
 				className: cn("flex max-w-full items-center justify-end"),
 				children: /* @__PURE__ */ jsx("span", {
-					className: cn("truncate text-xs leading-5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-500 dark:text-gray-600"),
+					className: cn("truncate text-xs/5", asPlaceholder ? "text-gray-400 dark:text-gray-700" : "text-gray-500 dark:text-gray-600"),
 					children: extraProps.agentType
 				})
 			})

package/dist/ui/components/id-autocomplete/id-autocomplete-list-option.js.map

@@ -1 +1 @@
-{"version":3,"file":"id-autocomplete-list-option.js","names":["cn","Icon","React","IconRenderer","customIcon","asPlaceholder","isValidElement","ReloadButton","isLoadingSelectedOption","handleFetchSelectedOption","isFetchSelectedOptionSync","value","IdAutocompleteListOption","variant","icon","title","path","description","showValue","className","placeholderIcon","extraProps","renderWithValue","renderWithValueTitleAndDescription","showDescription","url","text","agentType"],"sources":["../../../../src/ui/components/id-autocomplete/id-autocomplete-list-option.tsx"],"sourcesContent":["import type { IconName } from \"#design-system\";\nimport { cn, Icon } from \"#design-system\";\nimport React from \"react\";\nimport type { IdAutocompleteOption, IdAutocompleteProps } from \"./types.js\";\n\nconst IconRenderer: React.FC<{\n  customIcon?: IconName | React.ReactElement;\n  asPlaceholder?: boolean;\n}> = ({ customIcon, asPlaceholder }) => {\n  if (typeof customIcon === \"string\") {\n    return (\n      <Icon\n        name={customIcon}\n        size={24}\n        className={cn(\n          \"shrink-0\",\n          asPlaceholder\n            ? \"text-gray-400 dark:text-gray-700\"\n            : \"text-gray-900 dark:text-gray-300\",\n        )}\n      />\n    );\n  }\n  if (React.isValidElement(customIcon)) {\n    return <div className=\"size-6 shrink-0 overflow-hidden\">{customIcon}</div>;\n  }\n  return null;\n};\n\nconst ReloadButton: React.FC<{\n  isLoadingSelectedOption?: boolean;\n  handleFetchSelectedOption: (value: string) => void;\n  isFetchSelectedOptionSync?: boolean;\n  value: string;\n}> = ({\n  isLoadingSelectedOption,\n  handleFetchSelectedOption,\n  isFetchSelectedOptionSync,\n  value,\n}) => (\n  <div>\n    <button\n      type=\"button\"\n      disabled={isLoadingSelectedOption || isFetchSelectedOptionSync}\n      onClick={() => {\n        if (!isLoadingSelectedOption && !isFetchSelectedOptionSync) {\n          handleFetchSelectedOption(value);\n        }\n      }}\n      className={cn(\n        \"mt-0.5 focus-visible:outline-none\",\n        \"disabled:pointer-events-none [&_svg]:pointer-events-none\",\n      )}\n      aria-label={\n        isLoadingSelectedOption\n          ? \"Loading\"\n          : isFetchSelectedOptionSync\n            ? \"Success\"\n            : \"Reload\"\n      }\n    >\n      <Icon\n        name={isFetchSelectedOptionSync ? \"Checkmark\" : \"Reload\"}\n        size={16}\n        className={cn(\n          \"text-gray-500 dark:text-gray-600\",\n          isLoadingSelectedOption && \"animate-spin\",\n          isFetchSelectedOptionSync && \"animate-in fade-in duration-500\",\n        )}\n      />\n    </button>\n  </div>\n);\n\ntype IdAutocompleteListOptionProps = {\n  variant: IdAutocompleteProps[\"variant\"];\n  asPlaceholder?: boolean;\n  showValue?: boolean;\n  isLoadingSelectedOption?: boolean;\n  handleFetchSelectedOption?: (value: string) => void;\n  isFetchSelectedOptionSync?: boolean;\n  className?: string;\n  placeholderIcon?: IconName | React.ReactElement;\n} & IdAutocompleteOption<Record<string, unknown>>;\n\nconst IdAutocompleteListOption: React.FC<IdAutocompleteListOptionProps> = ({\n  variant = \"withValue\",\n  icon,\n  title = \"Title not available\",\n  path = \"Path not available\",\n  value,\n  description = \"Description not available\",\n  asPlaceholder,\n  showValue = true,\n  isLoadingSelectedOption,\n  handleFetchSelectedOption,\n  isFetchSelectedOptionSync,\n  className,\n  placeholderIcon = \"PowerhouseLogoSmall\",\n  ...extraProps\n}) => {\n  const renderWithValue = () => (\n    <div className={cn(\"flex w-full items-center\")}>\n      <span\n        className={cn(\n          \"truncate text-xs leading-5\",\n          asPlaceholder\n            ? \"text-gray-400 dark:text-gray-700\"\n            : \"text-gray-500 dark:text-gray-600\",\n        )}\n      >\n        {value}\n      </span>\n    </div>\n  );\n\n  const renderWithValueTitleAndDescription = (showDescription = true) => (\n    <div className={cn(\"flex w-full flex-col gap-1\")}>\n      <div className={cn(\"flex gap-2\")}>\n        <IconRenderer\n          customIcon={asPlaceholder ? placeholderIcon : icon}\n          asPlaceholder={asPlaceholder}\n        />\n        <div className={cn(\"flex min-w-0 grow flex-col gap-[-2px]\")}>\n          <span\n            className={cn(\n              \"truncate text-sm font-bold leading-5\",\n              asPlaceholder\n                ? \"text-gray-400 dark:text-gray-700\"\n                : \"text-gray-900 dark:text-gray-300\",\n            )}\n          >\n            {title}\n          </span>\n          {!showValue && typeof path === \"object\" ? (\n            <a\n              href={path.url}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className={cn(\n                \"truncate text-xs leading-5 text-blue-900 hover:underline focus-visible:outline-none\",\n              )}\n            >\n              {path.text}\n            </a>\n          ) : (\n            <span\n              className={cn(\n                \"truncate text-xs leading-5\",\n                asPlaceholder\n                  ? \"text-gray-400 dark:text-gray-700\"\n                  : \"text-gray-500 dark:text-gray-600\",\n              )}\n            >\n              {typeof path === \"object\" ? path.text : path}\n            </span>\n          )}\n        </div>\n        {asPlaceholder === false && handleFetchSelectedOption && (\n          <ReloadButton\n            isLoadingSelectedOption={isLoadingSelectedOption}\n            handleFetchSelectedOption={handleFetchSelectedOption}\n            isFetchSelectedOptionSync={isFetchSelectedOptionSync}\n            value={value}\n          />\n        )}\n      </div>\n      {showValue && (\n        <div className={cn(\"flex max-w-full items-center\")}>\n          <span\n            className={cn(\n              \"truncate text-xs leading-5\",\n              asPlaceholder\n                ? \"text-gray-400 dark:text-gray-700\"\n                : \"text-gray-500 dark:text-gray-600\",\n            )}\n          >\n            {value}\n          </span>\n        </div>\n      )}\n      {showDescription && (\n        <div className={cn(\"flex flex-col\")}>\n          <p\n            className={cn(\n              \"line-clamp-2 text-xs leading-5\",\n              asPlaceholder\n                ? \"text-gray-400 dark:text-gray-700\"\n                : \"text-gray-900 dark:text-gray-300\",\n            )}\n          >\n            {description}\n          </p>\n        </div>\n      )}\n      {showDescription &&\n        \"agentType\" in extraProps &&\n        typeof extraProps.agentType === \"string\" && (\n          <div className={cn(\"flex max-w-full items-center justify-end\")}>\n            <span\n              className={cn(\n                \"truncate text-xs leading-5\",\n                asPlaceholder\n                  ? \"text-gray-400 dark:text-gray-700\"\n                  : \"text-gray-500 dark:text-gray-600\",\n              )}\n            >\n              {extraProps.agentType}\n            </span>\n          </div>\n        )}\n    </div>\n  );\n\n  return (\n    <div\n      className={cn(\n        \"w-full max-w-full rounded-md bg-transparent px-3 pb-2\",\n        variant === \"withValue\" ? \"pt-2\" : \"pt-3\",\n        className,\n      )}\n    >\n      {variant === \"withValue\" && renderWithValue()}\n      {variant === \"withValueAndTitle\" &&\n        renderWithValueTitleAndDescription(false)}\n      {variant === \"withValueTitleAndDescription\" &&\n        renderWithValueTitleAndDescription()}\n    </div>\n  );\n};\n\nexport { IdAutocompleteListOption, type IdAutocompleteListOptionProps };\n"],"mappings":"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"}
+{"version":3,"file":"id-autocomplete-list-option.js","names":["cn","Icon","React","IconRenderer","customIcon","asPlaceholder","isValidElement","ReloadButton","isLoadingSelectedOption","handleFetchSelectedOption","isFetchSelectedOptionSync","value","IdAutocompleteListOption","variant","icon","title","path","description","showValue","className","placeholderIcon","extraProps","renderWithValue","renderWithValueTitleAndDescription","showDescription","url","text","agentType"],"sources":["../../../../src/ui/components/id-autocomplete/id-autocomplete-list-option.tsx"],"sourcesContent":["import type { IconName } from \"#design-system\";\nimport { cn, Icon } from \"#design-system\";\nimport React from \"react\";\nimport type { IdAutocompleteOption, IdAutocompleteProps } from \"./types.js\";\n\nconst IconRenderer: React.FC<{\n  customIcon?: IconName | React.ReactElement;\n  asPlaceholder?: boolean;\n}> = ({ customIcon, asPlaceholder }) => {\n  if (typeof customIcon === \"string\") {\n    return (\n      <Icon\n        name={customIcon}\n        size={24}\n        className={cn(\n          \"shrink-0\",\n          asPlaceholder\n            ? \"text-gray-400 dark:text-gray-700\"\n            : \"text-gray-900 dark:text-gray-300\",\n        )}\n      />\n    );\n  }\n  if (React.isValidElement(customIcon)) {\n    return <div className=\"size-6 shrink-0 overflow-hidden\">{customIcon}</div>;\n  }\n  return null;\n};\n\nconst ReloadButton: React.FC<{\n  isLoadingSelectedOption?: boolean;\n  handleFetchSelectedOption: (value: string) => void;\n  isFetchSelectedOptionSync?: boolean;\n  value: string;\n}> = ({\n  isLoadingSelectedOption,\n  handleFetchSelectedOption,\n  isFetchSelectedOptionSync,\n  value,\n}) => (\n  <div>\n    <button\n      type=\"button\"\n      disabled={isLoadingSelectedOption || isFetchSelectedOptionSync}\n      onClick={() => {\n        if (!isLoadingSelectedOption && !isFetchSelectedOptionSync) {\n          handleFetchSelectedOption(value);\n        }\n      }}\n      className={cn(\n        \"mt-0.5 focus-visible:outline-none\",\n        \"disabled:pointer-events-none [&_svg]:pointer-events-none\",\n      )}\n      aria-label={\n        isLoadingSelectedOption\n          ? \"Loading\"\n          : isFetchSelectedOptionSync\n            ? \"Success\"\n            : \"Reload\"\n      }\n    >\n      <Icon\n        name={isFetchSelectedOptionSync ? \"Checkmark\" : \"Reload\"}\n        size={16}\n        className={cn(\n          \"text-gray-500 dark:text-gray-600\",\n          isLoadingSelectedOption && \"animate-spin\",\n          isFetchSelectedOptionSync && \"animate-fade-in duration-500\",\n        )}\n      />\n    </button>\n  </div>\n);\n\ntype IdAutocompleteListOptionProps = {\n  variant: IdAutocompleteProps[\"variant\"];\n  asPlaceholder?: boolean;\n  showValue?: boolean;\n  isLoadingSelectedOption?: boolean;\n  handleFetchSelectedOption?: (value: string) => void;\n  isFetchSelectedOptionSync?: boolean;\n  className?: string;\n  placeholderIcon?: IconName | React.ReactElement;\n} & IdAutocompleteOption<Record<string, unknown>>;\n\nconst IdAutocompleteListOption: React.FC<IdAutocompleteListOptionProps> = ({\n  variant = \"withValue\",\n  icon,\n  title = \"Title not available\",\n  path = \"Path not available\",\n  value,\n  description = \"Description not available\",\n  asPlaceholder,\n  showValue = true,\n  isLoadingSelectedOption,\n  handleFetchSelectedOption,\n  isFetchSelectedOptionSync,\n  className,\n  placeholderIcon = \"PowerhouseLogoSmall\",\n  ...extraProps\n}) => {\n  const renderWithValue = () => (\n    <div className={cn(\"flex w-full items-center\")}>\n      <span\n        className={cn(\n          \"truncate text-xs/5\",\n          asPlaceholder\n            ? \"text-gray-400 dark:text-gray-700\"\n            : \"text-gray-500 dark:text-gray-600\",\n        )}\n      >\n        {value}\n      </span>\n    </div>\n  );\n\n  const renderWithValueTitleAndDescription = (showDescription = true) => (\n    <div className={cn(\"flex w-full flex-col gap-1\")}>\n      <div className={cn(\"flex gap-2\")}>\n        <IconRenderer\n          customIcon={asPlaceholder ? placeholderIcon : icon}\n          asPlaceholder={asPlaceholder}\n        />\n        <div className={cn(\"flex min-w-0 grow flex-col gap-[-2px]\")}>\n          <span\n            className={cn(\n              \"truncate text-sm/5 font-bold\",\n              asPlaceholder\n                ? \"text-gray-400 dark:text-gray-700\"\n                : \"text-gray-900 dark:text-gray-300\",\n            )}\n          >\n            {title}\n          </span>\n          {!showValue && typeof path === \"object\" ? (\n            <a\n              href={path.url}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className={cn(\n                \"truncate text-xs/5 text-blue-900 hover:underline focus-visible:outline-none\",\n              )}\n            >\n              {path.text}\n            </a>\n          ) : (\n            <span\n              className={cn(\n                \"truncate text-xs/5\",\n                asPlaceholder\n                  ? \"text-gray-400 dark:text-gray-700\"\n                  : \"text-gray-500 dark:text-gray-600\",\n              )}\n            >\n              {typeof path === \"object\" ? path.text : path}\n            </span>\n          )}\n        </div>\n        {asPlaceholder === false && handleFetchSelectedOption && (\n          <ReloadButton\n            isLoadingSelectedOption={isLoadingSelectedOption}\n            handleFetchSelectedOption={handleFetchSelectedOption}\n            isFetchSelectedOptionSync={isFetchSelectedOptionSync}\n            value={value}\n          />\n        )}\n      </div>\n      {showValue && (\n        <div className={cn(\"flex max-w-full items-center\")}>\n          <span\n            className={cn(\n              \"truncate text-xs/5\",\n              asPlaceholder\n                ? \"text-gray-400 dark:text-gray-700\"\n                : \"text-gray-500 dark:text-gray-600\",\n            )}\n          >\n            {value}\n          </span>\n        </div>\n      )}\n      {showDescription && (\n        <div className={cn(\"flex flex-col\")}>\n          <p\n            className={cn(\n              \"line-clamp-2 text-xs/5\",\n              asPlaceholder\n                ? \"text-gray-400 dark:text-gray-700\"\n                : \"text-gray-900 dark:text-gray-300\",\n            )}\n          >\n            {description}\n          </p>\n        </div>\n      )}\n      {showDescription &&\n        \"agentType\" in extraProps &&\n        typeof extraProps.agentType === \"string\" && (\n          <div className={cn(\"flex max-w-full items-center justify-end\")}>\n            <span\n              className={cn(\n                \"truncate text-xs/5\",\n                asPlaceholder\n                  ? \"text-gray-400 dark:text-gray-700\"\n                  : \"text-gray-500 dark:text-gray-600\",\n              )}\n            >\n              {extraProps.agentType}\n            </span>\n          </div>\n        )}\n    </div>\n  );\n\n  return (\n    <div\n      className={cn(\n        \"w-full max-w-full rounded-md bg-transparent px-3 pb-2\",\n        variant === \"withValue\" ? \"pt-2\" : \"pt-3\",\n        className,\n      )}\n    >\n      {variant === \"withValue\" && renderWithValue()}\n      {variant === \"withValueAndTitle\" &&\n        renderWithValueTitleAndDescription(false)}\n      {variant === \"withValueTitleAndDescription\" &&\n        renderWithValueTitleAndDescription()}\n    </div>\n  );\n};\n\nexport { IdAutocompleteListOption, type IdAutocompleteListOptionProps };\n"],"mappings":"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"}

package/dist/ui/components/id-autocomplete/id-autocomplete-list.js

@@ -1,4 +1,4 @@
-import { t as cn } from "../../../src-D4e3Wkrz.js";
+import { t as cn } from "../../../src-BgCjYazJ.js";
 import { CommandEmpty, CommandGroup, CommandItem, CommandList } from "../command/command.js";
 import { IdAutocompleteListOption } from "./id-autocomplete-list-option.js";
 import { useEffect } from "react";

package/dist/ui/components/id-autocomplete/id-autocomplete.js

@@ -1,4 +1,4 @@
-import { t as cn } from "../../../src-D4e3Wkrz.js";
+import { t as cn } from "../../../src-BgCjYazJ.js";
 import { FormLabel } from "../form-label/form-label.js";
 import { FormMessageList } from "../form-message/message-list.js";
 import { FormDescription } from "../form-description/form-description.js";
@@ -62,7 +62,7 @@ const IdAutocomplete = /* @__PURE__ */ React.forwardRef(({ id: idProp, name, cla
 				shouldFilter: false,
 				value: commandValue,
 				onValueChange: handleCommandValue,
-				className: cn("dark:bg-charcoal-900 bg-gray-100"),
+				className: cn("bg-gray-100 dark:bg-charcoal-900"),
 				children: [
 					/* @__PURE__ */ jsx(PopoverAnchor, {
 						asChild: true,