@enadhq/enad-react-sdk 1.0.2 → 1.2.0

package/dist/client/ui/sheet.mjs

@@ -1,130 +1,114 @@
 "use client";
+import { useIcon } from "../icons/icon-context.mjs";
+import { cn } from "./utils.mjs";
+import { defineSlotRecipe } from "../ui-resolver/recipe.mjs";
+import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useIcon } from "../icons/icon-context";
-import { Dialog as SheetPrimitive } from "radix-ui";
-import { cn } from "./utils";
+import { Dialog } from "radix-ui";
+//#region src/client/ui/sheet.tsx
+const sheetRecipe = defineSlotRecipe({
+	slots: [
+		"overlay",
+		"content",
+		"header",
+		"footer",
+		"title",
+		"description"
+	],
+	base: {
+		overlay: "fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0",
+		content: "fixed z-50 flex flex-col gap-4 bg-background shadow-[var(--enad-shadow-lg)] transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:animate-in data-[state=open]:duration-500",
+		header: "flex flex-col gap-1.5 p-4 border-b",
+		footer: "mt-auto flex flex-col gap-2 p-4",
+		title: "font-semibold text-foreground",
+		description: "text-sm text-muted-foreground"
+	},
+	variants: { side: {
+		right: { content: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm" },
+		left: { content: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm" },
+		top: { content: "inset-x-0 top-0 h-auto border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top" },
+		bottom: { content: "inset-x-0 bottom-0 h-auto border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom" }
+	} },
+	defaultVariants: { side: "right" }
+});
+const defaultClasses = sheetRecipe();
 function Sheet({ ...props }) {
-  return /* @__PURE__ */ jsx(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
+	return /* @__PURE__ */ jsx(Dialog.Root, {
+		"data-slot": "sheet",
+		...props
+	});
 }
-function SheetTrigger({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(SheetPrimitive.Trigger, { "data-slot": "sheet-trigger", ...props });
+function SheetTrigger({ ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Trigger, {
+		"data-slot": "sheet-trigger",
+		...props
+	});
 }
-function SheetClose({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(SheetPrimitive.Close, { "data-slot": "sheet-close", ...props });
+function SheetClose({ ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Close, {
+		"data-slot": "sheet-close",
+		...props
+	});
 }
-function SheetPortal({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
+function SheetPortal({ ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Portal, {
+		"data-slot": "sheet-portal",
+		...props
+	});
 }
-function SheetOverlay({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    SheetPrimitive.Overlay,
-    {
-      "data-slot": "sheet-overlay",
-      className: cn(
-        "fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0",
-        className
-      ),
-      ...props
-    }
-  );
+function SheetOverlay({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Overlay, {
+		"data-slot": "sheet-overlay",
+		className: cn(defaultClasses.overlay, className),
+		...props
+	});
 }
-function SheetContent({
-  className,
-  children,
-  side = "right",
-  showCloseButton = true,
-  ...props
-}) {
-  const CloseIcon = useIcon("close");
-  return /* @__PURE__ */ jsxs(SheetPortal, { children: [
-    /* @__PURE__ */ jsx(SheetOverlay, {}),
-    /* @__PURE__ */ jsxs(
-      SheetPrimitive.Content,
-      {
-        "data-slot": "sheet-content",
-        className: cn(
-          "fixed z-50 flex flex-col gap-4 bg-background shadow-[var(--enad-shadow-lg)] transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:animate-in data-[state=open]:duration-500",
-          side === "right" && "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
-          side === "left" && "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
-          side === "top" && "inset-x-0 top-0 h-auto border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
-          side === "bottom" && "inset-x-0 bottom-0 h-auto border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
-          className
-        ),
-        ...props,
-        children: [
-          children,
-          showCloseButton && /* @__PURE__ */ jsxs(SheetPrimitive.Close, { className: "absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hit-area-4 hover:opacity-100 focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
-            /* @__PURE__ */ jsx(CloseIcon, { className: "size-4" }),
-            /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
-          ] })
-        ]
-      }
-    )
-  ] });
+function SheetContent({ className, children, side = "right", ...props }) {
+	const classes = sheetRecipe({ side });
+	return /* @__PURE__ */ jsxs(SheetPortal, { children: [/* @__PURE__ */ jsx(SheetOverlay, {}), /* @__PURE__ */ jsx(Dialog.Content, {
+		"data-slot": "sheet-content",
+		className: cn(classes.content, className),
+		...props,
+		children
+	})] });
 }
 function SheetHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "sheet-header",
-      className: cn("flex flex-col gap-1.5 p-4", className),
-      ...props
-    }
-  );
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "sheet-header",
+		className: cn(defaultClasses.header, className),
+		...props
+	});
 }
 function SheetFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "sheet-footer",
-      className: cn("mt-auto flex flex-col gap-2 p-4", className),
-      ...props
-    }
-  );
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "sheet-footer",
+		className: cn(defaultClasses.footer, className),
+		...props
+	});
 }
-function SheetTitle({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    SheetPrimitive.Title,
-    {
-      "data-slot": "sheet-title",
-      className: cn("font-semibold text-foreground", className),
-      ...props
-    }
-  );
+function SheetTitle({ className, children, showClose = true, ...props }) {
+	const CloseIcon = useIcon("close");
+	return /* @__PURE__ */ jsxs(Dialog.Title, {
+		"data-slot": "sheet-title",
+		className: cn(defaultClasses.title, className),
+		...props,
+		children: [children, showClose && /* @__PURE__ */ jsxs(Dialog.Close, {
+			className: "absolute top-4 right-4 flex items-center justify-center rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 hover:bg-accent focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none cursor-pointer",
+			children: [/* @__PURE__ */ jsx(CloseIcon, { className: "size-4" }), /* @__PURE__ */ jsx("span", {
+				className: "sr-only",
+				children: "Close"
+			})]
+		})]
+	});
 }
-function SheetDescription({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    SheetPrimitive.Description,
-    {
-      "data-slot": "sheet-description",
-      className: cn("text-sm text-muted-foreground", className),
-      ...props
-    }
-  );
+function SheetDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Description, {
+		"data-slot": "sheet-description",
+		className: cn(defaultClasses.description, className),
+		...props
+	});
 }
-export {
-  Sheet,
-  SheetClose,
-  SheetContent,
-  SheetDescription,
-  SheetFooter,
-  SheetHeader,
-  SheetTitle,
-  SheetTrigger
-};
+//#endregion
+export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, sheetRecipe };
+
 //# sourceMappingURL=sheet.mjs.map

package/dist/client/ui/sheet.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/client/ui/sheet.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { useIcon } from \"../icons/icon-context\"\nimport { Dialog as SheetPrimitive } from \"radix-ui\"\n\nimport { cn } from \"./utils\"\n\nfunction Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />\n}\n\nfunction SheetTrigger({\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Trigger>) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\nfunction SheetClose({\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Close>) {\n  return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />\n}\n\nfunction SheetPortal({\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Portal>) {\n  return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />\n}\n\nfunction SheetOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Overlay>) {\n  return (\n    <SheetPrimitive.Overlay\n      data-slot=\"sheet-overlay\"\n      className={cn(\n        \"fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction SheetContent({\n  className,\n  children,\n  side = \"right\",\n  showCloseButton = true,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Content> & {\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\"\n  showCloseButton?: boolean\n}) {\n  const CloseIcon = useIcon(\"close\")\n\n  return (\n    <SheetPortal>\n      <SheetOverlay />\n      <SheetPrimitive.Content\n        data-slot=\"sheet-content\"\n        className={cn(\n          \"fixed z-50 flex flex-col gap-4 bg-background shadow-[var(--enad-shadow-lg)] transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:animate-in data-[state=open]:duration-500\",\n          side === \"right\" &&\n            \"inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm\",\n          side === \"left\" &&\n            \"inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm\",\n          side === \"top\" &&\n            \"inset-x-0 top-0 h-auto border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n          side === \"bottom\" &&\n            \"inset-x-0 bottom-0 h-auto border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        {showCloseButton && (\n          <SheetPrimitive.Close className=\"absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hit-area-4 hover:opacity-100 focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none data-[state=open]:bg-secondary\">\n            <CloseIcon className=\"size-4\" />\n            <span className=\"sr-only\">Close</span>\n          </SheetPrimitive.Close>\n        )}\n      </SheetPrimitive.Content>\n    </SheetPortal>\n  )\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sheet-header\"\n      className={cn(\"flex flex-col gap-1.5 p-4\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sheet-footer\"\n      className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction SheetTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Title>) {\n  return (\n    <SheetPrimitive.Title\n      data-slot=\"sheet-title\"\n      className={cn(\"font-semibold text-foreground\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction SheetDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n  return (\n    <SheetPrimitive.Description\n      data-slot=\"sheet-description\"\n      className={cn(\"text-sm text-muted-foreground\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Sheet,\n  SheetTrigger,\n  SheetClose,\n  SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetTitle,\n  SheetDescription,\n}\n"],"mappings":";AASS,cAsEC,YAtED;AANT,SAAS,eAAe;AACxB,SAAS,UAAU,sBAAsB;AAEzC,SAAS,UAAU;AAEnB,SAAS,MAAM,EAAE,GAAG,MAAM,GAAqD;AAC7E,SAAO,oBAAC,eAAe,MAAf,EAAoB,aAAU,SAAS,GAAG,OAAO;AAC3D;AAEA,SAAS,aAAa;AAAA,EACpB,GAAG;AACL,GAAwD;AACtD,SAAO,oBAAC,eAAe,SAAf,EAAuB,aAAU,iBAAiB,GAAG,OAAO;AACtE;AAEA,SAAS,WAAW;AAAA,EAClB,GAAG;AACL,GAAsD;AACpD,SAAO,oBAAC,eAAe,OAAf,EAAqB,aAAU,eAAe,GAAG,OAAO;AAClE;AAEA,SAAS,YAAY;AAAA,EACnB,GAAG;AACL,GAAuD;AACrD,SAAO,oBAAC,eAAe,QAAf,EAAsB,aAAU,gBAAgB,GAAG,OAAO;AACpE;AAEA,SAAS,aAAa;AAAA,EACpB;AAAA,EACA,GAAG;AACL,GAAwD;AACtD,SACE;AAAA,IAAC,eAAe;AAAA,IAAf;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,aAAa;AAAA,EACpB;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,kBAAkB;AAAA,EAClB,GAAG;AACL,GAGG;AACD,QAAM,YAAY,QAAQ,OAAO;AAEjC,SACE,qBAAC,eACC;AAAA,wBAAC,gBAAa;AAAA,IACd;AAAA,MAAC,eAAe;AAAA,MAAf;AAAA,QACC,aAAU;AAAA,QACV,WAAW;AAAA,UACT;AAAA,UACA,SAAS,WACP;AAAA,UACF,SAAS,UACP;AAAA,UACF,SAAS,SACP;AAAA,UACF,SAAS,YACP;AAAA,UACF;AAAA,QACF;AAAA,QACC,GAAG;AAAA,QAEH;AAAA;AAAA,UACA,mBACC,qBAAC,eAAe,OAAf,EAAqB,WAAU,yPAC9B;AAAA,gCAAC,aAAU,WAAU,UAAS;AAAA,YAC9B,oBAAC,UAAK,WAAU,WAAU,mBAAK;AAAA,aACjC;AAAA;AAAA;AAAA,IAEJ;AAAA,KACF;AAEJ;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,MAAM,GAAgC;AACzE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,6BAA6B,SAAS;AAAA,MACnD,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,MAAM,GAAgC;AACzE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,mCAAmC,SAAS;AAAA,MACzD,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,WAAW;AAAA,EAClB;AAAA,EACA,GAAG;AACL,GAAsD;AACpD,SACE;AAAA,IAAC,eAAe;AAAA,IAAf;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,iCAAiC,SAAS;AAAA,MACvD,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,iBAAiB;AAAA,EACxB;AAAA,EACA,GAAG;AACL,GAA4D;AAC1D,SACE;AAAA,IAAC,eAAe;AAAA,IAAf;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,iCAAiC,SAAS;AAAA,MACvD,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}
+{"version":3,"file":"sheet.mjs","names":["SheetPrimitive"],"sources":["../../../src/client/ui/sheet.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { useIcon } from \"../icons/icon-context\";\nimport { Dialog as SheetPrimitive } from \"radix-ui\";\n\nimport { defineSlotRecipe } from \"../ui-resolver/recipe\";\nimport { cn } from \"./utils\";\n\nconst sheetRecipe = defineSlotRecipe({\n  slots: [\"overlay\", \"content\", \"header\", \"footer\", \"title\", \"description\"] as const,\n  base: {\n    overlay:\n      \"fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0\",\n    content:\n      \"fixed z-50 flex flex-col gap-4 bg-background shadow-[var(--enad-shadow-lg)] transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:animate-in data-[state=open]:duration-500\",\n    header: \"flex flex-col gap-1.5 p-4 border-b\",\n    footer: \"mt-auto flex flex-col gap-2 p-4\",\n    title: \"font-semibold text-foreground\",\n    description: \"text-sm text-muted-foreground\",\n  },\n  variants: {\n    side: {\n      right: {\n        content:\n          \"inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm\",\n      },\n      left: {\n        content:\n          \"inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm\",\n      },\n      top: {\n        content:\n          \"inset-x-0 top-0 h-auto border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n      },\n      bottom: {\n        content:\n          \"inset-x-0 bottom-0 h-auto border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n      },\n    },\n  },\n  defaultVariants: {\n    side: \"right\",\n  },\n});\n\nconst defaultClasses = sheetRecipe();\n\nfunction Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />;\n}\n\nfunction SheetTrigger({ ...props }: React.ComponentProps<typeof SheetPrimitive.Trigger>) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />;\n}\n\nfunction SheetClose({ ...props }: React.ComponentProps<typeof SheetPrimitive.Close>) {\n  return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />;\n}\n\nfunction SheetPortal({ ...props }: React.ComponentProps<typeof SheetPrimitive.Portal>) {\n  return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />;\n}\n\nfunction SheetOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Overlay>) {\n  return (\n    <SheetPrimitive.Overlay\n      data-slot=\"sheet-overlay\"\n      className={cn(defaultClasses.overlay, className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetContent({\n  className,\n  children,\n  side = \"right\",\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Content> & {\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n}) {\n  const classes = sheetRecipe({ side });\n\n  return (\n    <SheetPortal>\n      <SheetOverlay />\n      <SheetPrimitive.Content\n        data-slot=\"sheet-content\"\n        className={cn(classes.content, className)}\n        {...props}\n      >\n        {children}\n      </SheetPrimitive.Content>\n    </SheetPortal>\n  );\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div data-slot=\"sheet-header\" className={cn(defaultClasses.header, className)} {...props} />\n  );\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div data-slot=\"sheet-footer\" className={cn(defaultClasses.footer, className)} {...props} />\n  );\n}\n\nfunction SheetTitle({\n  className,\n  children,\n  showClose = true,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Title> & {\n  showClose?: boolean;\n}) {\n  const CloseIcon = useIcon(\"close\");\n\n  return (\n    <SheetPrimitive.Title\n      data-slot=\"sheet-title\"\n      className={cn(defaultClasses.title, className)}\n      {...props}\n    >\n      {children}\n      {showClose && (\n        <SheetPrimitive.Close className=\"absolute top-4 right-4 flex items-center justify-center rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 hover:bg-accent focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none cursor-pointer\">\n          <CloseIcon className=\"size-4\" />\n          <span className=\"sr-only\">Close</span>\n        </SheetPrimitive.Close>\n      )}\n    </SheetPrimitive.Title>\n  );\n}\n\nfunction SheetDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n  return (\n    <SheetPrimitive.Description\n      data-slot=\"sheet-description\"\n      className={cn(defaultClasses.description, className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Sheet,\n  SheetTrigger,\n  SheetClose,\n  SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetTitle,\n  SheetDescription,\n  sheetRecipe,\n};\n"],"mappings":";;;;;;;;AASA,MAAM,cAAc,iBAAiB;CACnC,OAAO;EAAC;EAAW;EAAW;EAAU;EAAU;EAAS;EAAc;CACzE,MAAM;EACJ,SACE;EACF,SACE;EACF,QAAQ;EACR,QAAQ;EACR,OAAO;EACP,aAAa;EACd;CACD,UAAU,EACR,MAAM;EACJ,OAAO,EACL,SACE,oIACH;EACD,MAAM,EACJ,SACE,iIACH;EACD,KAAK,EACH,SACE,4GACH;EACD,QAAQ,EACN,SACE,qHACH;EACF,EACF;CACD,iBAAiB,EACf,MAAM,SACP;CACF,CAAC;AAEF,MAAM,iBAAiB,aAAa;AAEpC,SAAS,MAAM,EAAE,GAAG,SAA2D;AAC7E,QAAO,oBAACA,OAAe,MAAhB;EAAqB,aAAU;EAAQ,GAAI;EAAS,CAAA;;AAG7D,SAAS,aAAa,EAAE,GAAG,SAA8D;AACvF,QAAO,oBAACA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;EAAS,CAAA;;AAGxE,SAAS,WAAW,EAAE,GAAG,SAA4D;AACnF,QAAO,oBAACA,OAAe,OAAhB;EAAsB,aAAU;EAAc,GAAI;EAAS,CAAA;;AAGpE,SAAS,YAAY,EAAE,GAAG,SAA6D;AACrF,QAAO,oBAACA,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;EAAS,CAAA;;AAGtE,SAAS,aAAa,EACpB,WACA,GAAG,SACmD;AACtD,QACE,oBAACA,OAAe,SAAhB;EACE,aAAU;EACV,WAAW,GAAG,eAAe,SAAS,UAAU;EAChD,GAAI;EACJ,CAAA;;AAIN,SAAS,aAAa,EACpB,WACA,UACA,OAAO,SACP,GAAG,SAGF;CACD,MAAM,UAAU,YAAY,EAAE,MAAM,CAAC;AAErC,QACE,qBAAC,aAAD,EAAA,UAAA,CACE,oBAAC,cAAD,EAAgB,CAAA,EAChB,oBAACA,OAAe,SAAhB;EACE,aAAU;EACV,WAAW,GAAG,QAAQ,SAAS,UAAU;EACzC,GAAI;EAEH;EACsB,CAAA,CACb,EAAA,CAAA;;AAIlB,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;AACzE,QACE,oBAAC,OAAD;EAAK,aAAU;EAAe,WAAW,GAAG,eAAe,QAAQ,UAAU;EAAE,GAAI;EAAS,CAAA;;AAIhG,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;AACzE,QACE,oBAAC,OAAD;EAAK,aAAU;EAAe,WAAW,GAAG,eAAe,QAAQ,UAAU;EAAE,GAAI;EAAS,CAAA;;AAIhG,SAAS,WAAW,EAClB,WACA,UACA,YAAY,MACZ,GAAG,SAGF;CACD,MAAM,YAAY,QAAQ,QAAQ;AAElC,QACE,qBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAAG,eAAe,OAAO,UAAU;EAC9C,GAAI;YAHN,CAKG,UACA,aACC,qBAACA,OAAe,OAAhB;GAAsB,WAAU;aAAhC,CACE,oBAAC,WAAD,EAAW,WAAU,UAAW,CAAA,EAChC,oBAAC,QAAD;IAAM,WAAU;cAAU;IAAY,CAAA,CACjB;KAEJ;;;AAI3B,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;AAC1D,QACE,oBAACA,OAAe,aAAhB;EACE,aAAU;EACV,WAAW,GAAG,eAAe,aAAa,UAAU;EACpD,GAAI;EACJ,CAAA"}

package/dist/client/ui/simple-select.d.ts

@@ -0,0 +1,32 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
+
+//#region src/client/ui/simple-select.d.ts
+type SimpleSelectOption = {
+  value: string;
+  label: string;
+};
+declare const triggerVariants: (props?: ({
+  variant?: "bordered" | "minimal" | null | undefined;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
+type SimpleSelectProps = {
+  options: SimpleSelectOption[];
+  value: string;
+  onChange: (value: string) => void;
+  label?: string;
+  placeholder?: string;
+  className?: string;
+} & VariantProps<typeof triggerVariants>;
+declare function SimpleSelect({
+  options,
+  value,
+  onChange,
+  label,
+  placeholder,
+  className,
+  variant
+}: SimpleSelectProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { SimpleSelect, type SimpleSelectOption, type SimpleSelectProps, triggerVariants };
+//# sourceMappingURL=simple-select.d.ts.map

package/dist/client/ui/simple-select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"simple-select.d.ts","names":[],"sources":["../../../src/client/ui/simple-select.tsx"],"mappings":";;;;;KASK,kBAAA;EACH,KAAA;EACA,KAAA;AAAA;AAAA,cAGI,eAAA,GAAe,KAAA;;IAuBpB,+BAAA,CAAA,SAAA;AAAA,KAEI,iBAAA;EACH,OAAA,EAAS,kBAAA;EACT,KAAA;EACA,QAAA,GAAW,KAAA;EACX,KAAA;EACA,WAAA;EACA,SAAA;AAAA,IACE,YAAA,QAAoB,eAAA;AAAA,iBAEf,YAAA,CAAA;EACP,OAAA;EACA,KAAA;EACA,QAAA;EACA,KAAA;EACA,WAAA;EACA,SAAA;EACA;AAAA,GACC,iBAAA,GAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/client/ui/simple-select.mjs

@@ -0,0 +1,128 @@
+"use client";
+import { useIcon } from "../icons/icon-context.mjs";
+import { cn } from "./utils.mjs";
+import { useCallback, useEffect, useId, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+//#region src/client/ui/simple-select.tsx
+const triggerVariants = cva(cn("flex w-full items-center justify-between", "text-base transition-colors duration-200", "focus:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50"), {
+	variants: { variant: {
+		bordered: cn("h-9 rounded-[var(--enad-input-radius)] border border-input bg-background px-3 py-1 shadow-xs", "hover:border-ring data-[state=open]:border-ring"),
+		minimal: cn("border border-input bg-transparent px-4 py-3", "hover:border-foreground/50 data-[state=open]:border-foreground")
+	} },
+	defaultVariants: { variant: "bordered" }
+});
+function SimpleSelect({ options, value, onChange, label, placeholder = "Select...", className = "", variant = "bordered" }) {
+	const [open, setOpen] = useState(false);
+	const [focusedIndex, setFocusedIndex] = useState(-1);
+	const containerRef = useRef(null);
+	const listboxRef = useRef(null);
+	const labelId = useId();
+	const listboxId = useId();
+	const ChevronDown = useIcon("chevronDown");
+	const ChevronUp = useIcon("chevronUp");
+	const selectedOption = options.find((o) => o.value === value);
+	const close = useCallback(() => {
+		setOpen(false);
+		setFocusedIndex(-1);
+	}, []);
+	useEffect(() => {
+		const handleClickOutside = (e) => {
+			if (containerRef.current && !containerRef.current.contains(e.target)) close();
+		};
+		document.addEventListener("mousedown", handleClickOutside);
+		return () => document.removeEventListener("mousedown", handleClickOutside);
+	}, [close]);
+	useEffect(() => {
+		if (open && focusedIndex >= 0 && listboxRef.current) listboxRef.current.querySelectorAll("[role=\"option\"]")[focusedIndex]?.scrollIntoView({ block: "nearest" });
+	}, [focusedIndex, open]);
+	const handleKeyDown = (e) => {
+		switch (e.key) {
+			case "Enter":
+			case " ":
+				e.preventDefault();
+				if (open && focusedIndex >= 0 && options[focusedIndex]) {
+					onChange(options[focusedIndex].value);
+					close();
+				} else {
+					setOpen(true);
+					setFocusedIndex(options.findIndex((o) => o.value === value));
+				}
+				break;
+			case "ArrowDown":
+				e.preventDefault();
+				if (!open) {
+					setOpen(true);
+					setFocusedIndex(0);
+				} else setFocusedIndex((i) => Math.min(i + 1, options.length - 1));
+				break;
+			case "ArrowUp":
+				e.preventDefault();
+				if (open) setFocusedIndex((i) => Math.max(i - 1, 0));
+				break;
+			case "Escape":
+				close();
+				break;
+			case "Tab":
+				close();
+				break;
+		}
+	};
+	const ChevronIcon = open ? ChevronUp : ChevronDown;
+	return /* @__PURE__ */ jsxs("div", {
+		ref: containerRef,
+		"data-slot": "simple-select",
+		className: cn("relative", className),
+		children: [
+			label && /* @__PURE__ */ jsx("span", {
+				id: labelId,
+				className: "mb-2 block text-sm font-medium text-foreground",
+				children: label
+			}),
+			/* @__PURE__ */ jsxs("button", {
+				type: "button",
+				role: "combobox",
+				"aria-expanded": open,
+				"aria-controls": listboxId,
+				"aria-labelledby": label ? labelId : void 0,
+				"data-state": open ? "open" : "closed",
+				onClick: () => {
+					setOpen((o) => !o);
+					if (!open) setFocusedIndex(options.findIndex((o) => o.value === value));
+				},
+				onKeyDown: handleKeyDown,
+				className: triggerVariants({ variant }),
+				children: [/* @__PURE__ */ jsx("span", {
+					className: selectedOption ? "text-foreground" : "text-muted-foreground",
+					children: selectedOption ? selectedOption.label : placeholder
+				}), /* @__PURE__ */ jsx(ChevronIcon, {
+					className: "size-4 shrink-0 text-muted-foreground",
+					"aria-hidden": true
+				})]
+			}),
+			open && /* @__PURE__ */ jsx("ul", {
+				ref: listboxRef,
+				id: listboxId,
+				role: "listbox",
+				"aria-labelledby": label ? labelId : void 0,
+				className: "absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-[var(--enad-input-radius)] border border-input bg-background shadow-lg",
+				children: options.map((option, index) => /* @__PURE__ */ jsx("li", {
+					role: "option",
+					"aria-selected": option.value === value,
+					"data-focused": focusedIndex === index ? "" : void 0,
+					className: cn("cursor-pointer px-4 py-2 text-sm transition-colors duration-150", option.value === value ? "bg-accent font-medium text-foreground" : "text-foreground", focusedIndex === index && "bg-accent", "hover:bg-accent"),
+					onClick: () => {
+						onChange(option.value);
+						close();
+					},
+					onMouseEnter: () => setFocusedIndex(index),
+					children: option.label
+				}, option.value))
+			})
+		]
+	});
+}
+//#endregion
+export { SimpleSelect, triggerVariants };
+
+//# sourceMappingURL=simple-select.mjs.map

package/dist/client/ui/simple-select.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"simple-select.mjs","names":[],"sources":["../../../src/client/ui/simple-select.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { useState, useRef, useEffect, useId, useCallback } from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"./utils\";\nimport { useIcon } from \"../icons/icon-context\";\n\ntype SimpleSelectOption = {\n  value: string;\n  label: string;\n};\n\nconst triggerVariants = cva(\n  cn(\n    \"flex w-full items-center justify-between\",\n    \"text-base transition-colors duration-200\",\n    \"focus:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50\",\n  ),\n  {\n    variants: {\n      variant: {\n        bordered: cn(\n          \"h-9 rounded-[var(--enad-input-radius)] border border-input bg-background px-3 py-1 shadow-xs\",\n          \"hover:border-ring data-[state=open]:border-ring\",\n        ),\n        minimal: cn(\n          \"border border-input bg-transparent px-4 py-3\",\n          \"hover:border-foreground/50 data-[state=open]:border-foreground\",\n        ),\n      },\n    },\n    defaultVariants: {\n      variant: \"bordered\",\n    },\n  },\n);\n\ntype SimpleSelectProps = {\n  options: SimpleSelectOption[];\n  value: string;\n  onChange: (value: string) => void;\n  label?: string;\n  placeholder?: string;\n  className?: string;\n} & VariantProps<typeof triggerVariants>;\n\nfunction SimpleSelect({\n  options,\n  value,\n  onChange,\n  label,\n  placeholder = \"Select...\",\n  className = \"\",\n  variant = \"bordered\",\n}: SimpleSelectProps) {\n  const [open, setOpen] = useState(false);\n  const [focusedIndex, setFocusedIndex] = useState(-1);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const listboxRef = useRef<HTMLUListElement>(null);\n  const labelId = useId();\n  const listboxId = useId();\n\n  const ChevronDown = useIcon(\"chevronDown\");\n  const ChevronUp = useIcon(\"chevronUp\");\n\n  const selectedOption = options.find((o) => o.value === value);\n\n  const close = useCallback(() => {\n    setOpen(false);\n    setFocusedIndex(-1);\n  }, []);\n\n  useEffect(() => {\n    const handleClickOutside = (e: MouseEvent) => {\n      if (containerRef.current && !containerRef.current.contains(e.target as Node)) {\n        close();\n      }\n    };\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    return () => document.removeEventListener(\"mousedown\", handleClickOutside);\n  }, [close]);\n\n  useEffect(() => {\n    if (open && focusedIndex >= 0 && listboxRef.current) {\n      const items = listboxRef.current.querySelectorAll('[role=\"option\"]');\n      (items[focusedIndex] as HTMLElement)?.scrollIntoView({ block: \"nearest\" });\n    }\n  }, [focusedIndex, open]);\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    switch (e.key) {\n      case \"Enter\":\n      case \" \":\n        e.preventDefault();\n        if (open && focusedIndex >= 0 && options[focusedIndex]) {\n          onChange(options[focusedIndex].value);\n          close();\n        } else {\n          setOpen(true);\n          setFocusedIndex(options.findIndex((o) => o.value === value));\n        }\n        break;\n      case \"ArrowDown\":\n        e.preventDefault();\n        if (!open) {\n          setOpen(true);\n          setFocusedIndex(0);\n        } else {\n          setFocusedIndex((i) => Math.min(i + 1, options.length - 1));\n        }\n        break;\n      case \"ArrowUp\":\n        e.preventDefault();\n        if (open) {\n          setFocusedIndex((i) => Math.max(i - 1, 0));\n        }\n        break;\n      case \"Escape\":\n        close();\n        break;\n      case \"Tab\":\n        close();\n        break;\n    }\n  };\n\n  const ChevronIcon = open ? ChevronUp : ChevronDown;\n\n  return (\n    <div ref={containerRef} data-slot=\"simple-select\" className={cn(\"relative\", className)}>\n      {label && (\n        <span id={labelId} className=\"mb-2 block text-sm font-medium text-foreground\">\n          {label}\n        </span>\n      )}\n      <button\n        type=\"button\"\n        role=\"combobox\"\n        aria-expanded={open}\n        aria-controls={listboxId}\n        aria-labelledby={label ? labelId : undefined}\n        data-state={open ? \"open\" : \"closed\"}\n        onClick={() => {\n          setOpen((o) => !o);\n          if (!open) setFocusedIndex(options.findIndex((o) => o.value === value));\n        }}\n        onKeyDown={handleKeyDown}\n        className={triggerVariants({ variant })}\n      >\n        <span className={selectedOption ? \"text-foreground\" : \"text-muted-foreground\"}>\n          {selectedOption ? selectedOption.label : placeholder}\n        </span>\n        <ChevronIcon className=\"size-4 shrink-0 text-muted-foreground\" aria-hidden />\n      </button>\n\n      {open && (\n        <ul\n          ref={listboxRef}\n          id={listboxId}\n          role=\"listbox\"\n          aria-labelledby={label ? labelId : undefined}\n          className=\"absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-[var(--enad-input-radius)] border border-input bg-background shadow-lg\"\n        >\n          {options.map((option, index) => (\n            <li\n              key={option.value}\n              role=\"option\"\n              aria-selected={option.value === value}\n              data-focused={focusedIndex === index ? \"\" : undefined}\n              className={cn(\n                \"cursor-pointer px-4 py-2 text-sm transition-colors duration-150\",\n                option.value === value\n                  ? \"bg-accent font-medium text-foreground\"\n                  : \"text-foreground\",\n                focusedIndex === index && \"bg-accent\",\n                \"hover:bg-accent\",\n              )}\n              onClick={() => {\n                onChange(option.value);\n                close();\n              }}\n              onMouseEnter={() => setFocusedIndex(index)}\n            >\n              {option.label}\n            </li>\n          ))}\n        </ul>\n      )}\n    </div>\n  );\n}\n\nexport { SimpleSelect, triggerVariants, type SimpleSelectOption, type SimpleSelectProps };\n"],"mappings":"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"}

package/dist/client/ui/slot-wrapper.d.ts

@@ -0,0 +1,28 @@
+import * as React$1 from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/client/ui/slot-wrapper.d.ts
+interface SlotWrapperProps extends React$1.ComponentProps<"div"> {
+  startSlot?: React$1.ReactNode;
+  endSlot?: React$1.ReactNode;
+}
+/**
+ * Decorator slot wrapper for form components (Input, Button, Select, etc.).
+ *
+ * Renders startSlot → children → endSlot in a flex row. Slot icons scale
+ * to --slot-icon-size (set by the parent component's recipe). Padding
+ * compensation uses CSS logical properties for RTL support.
+ *
+ * Decorative slots get aria-hidden so screen readers skip icons/badges
+ * that don't add semantic meaning.
+ */
+declare function SlotWrapper({
+  startSlot,
+  endSlot,
+  children,
+  className,
+  ...props
+}: SlotWrapperProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { SlotWrapper, type SlotWrapperProps };
+//# sourceMappingURL=slot-wrapper.d.ts.map

package/dist/client/ui/slot-wrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot-wrapper.d.ts","names":[],"sources":["../../../src/client/ui/slot-wrapper.tsx"],"mappings":";;;;UAIU,gBAAA,SAAyB,OAAA,CAAM,cAAA;EACvC,SAAA,GAAY,OAAA,CAAM,SAAA;EAClB,OAAA,GAAU,OAAA,CAAM,SAAA;AAAA;;;;;;;;;;;iBAaT,WAAA,CAAA;EAAc,SAAA;EAAW,OAAA;EAAS,QAAA;EAAU,SAAA;EAAA,GAAc;AAAA,GAAS,gBAAA,GAAgB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/client/ui/slot-wrapper.mjs

@@ -0,0 +1,38 @@
+import { cn } from "./utils.mjs";
+import "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/client/ui/slot-wrapper.tsx
+/**
+* Decorator slot wrapper for form components (Input, Button, Select, etc.).
+*
+* Renders startSlot → children → endSlot in a flex row. Slot icons scale
+* to --slot-icon-size (set by the parent component's recipe). Padding
+* compensation uses CSS logical properties for RTL support.
+*
+* Decorative slots get aria-hidden so screen readers skip icons/badges
+* that don't add semantic meaning.
+*/
+function SlotWrapper({ startSlot, endSlot, children, className, ...props }) {
+	if (!startSlot && !endSlot) return /* @__PURE__ */ jsx(Fragment, { children });
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex items-center gap-[var(--slot-gap,0.5rem)]", className),
+		...props,
+		children: [
+			startSlot && /* @__PURE__ */ jsx("span", {
+				"aria-hidden": "true",
+				className: "shrink-0 [&_svg]:size-[var(--slot-icon-size,1rem)]",
+				children: startSlot
+			}),
+			children,
+			endSlot && /* @__PURE__ */ jsx("span", {
+				"aria-hidden": "true",
+				className: "shrink-0 [&_svg]:size-[var(--slot-icon-size,1rem)]",
+				children: endSlot
+			})
+		]
+	});
+}
+//#endregion
+export { SlotWrapper };
+
+//# sourceMappingURL=slot-wrapper.mjs.map

package/dist/client/ui/slot-wrapper.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot-wrapper.mjs","names":[],"sources":["../../../src/client/ui/slot-wrapper.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"./utils\";\n\ninterface SlotWrapperProps extends React.ComponentProps<\"div\"> {\n  startSlot?: React.ReactNode;\n  endSlot?: React.ReactNode;\n}\n\n/**\n * Decorator slot wrapper for form components (Input, Button, Select, etc.).\n *\n * Renders startSlot → children → endSlot in a flex row. Slot icons scale\n * to --slot-icon-size (set by the parent component's recipe). Padding\n * compensation uses CSS logical properties for RTL support.\n *\n * Decorative slots get aria-hidden so screen readers skip icons/badges\n * that don't add semantic meaning.\n */\nfunction SlotWrapper({ startSlot, endSlot, children, className, ...props }: SlotWrapperProps) {\n  if (!startSlot && !endSlot) {\n    return <>{children}</>;\n  }\n\n  return (\n    <div className={cn(\"flex items-center gap-[var(--slot-gap,0.5rem)]\", className)} {...props}>\n      {startSlot && (\n        <span aria-hidden=\"true\" className=\"shrink-0 [&_svg]:size-[var(--slot-icon-size,1rem)]\">\n          {startSlot}\n        </span>\n      )}\n      {children}\n      {endSlot && (\n        <span aria-hidden=\"true\" className=\"shrink-0 [&_svg]:size-[var(--slot-icon-size,1rem)]\">\n          {endSlot}\n        </span>\n      )}\n    </div>\n  );\n}\n\nexport { SlotWrapper, type SlotWrapperProps };\n"],"mappings":";;;;;;;;;;;;;;AAmBA,SAAS,YAAY,EAAE,WAAW,SAAS,UAAU,WAAW,GAAG,SAA2B;AAC5F,KAAI,CAAC,aAAa,CAAC,QACjB,QAAO,oBAAA,UAAA,EAAG,UAAY,CAAA;AAGxB,QACE,qBAAC,OAAD;EAAK,WAAW,GAAG,kDAAkD,UAAU;EAAE,GAAI;YAArF;GACG,aACC,oBAAC,QAAD;IAAM,eAAY;IAAO,WAAU;cAChC;IACI,CAAA;GAER;GACA,WACC,oBAAC,QAAD;IAAM,eAAY;IAAO,WAAU;cAChC;IACI,CAAA;GAEL"}

package/dist/client/ui/stepper.d.ts

@@ -0,0 +1,38 @@
+import * as React$1 from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/client/ui/stepper.d.ts
+type StepperOrientation = "horizontal" | "vertical";
+declare function Stepper({
+  activeStep,
+  orientation,
+  className,
+  children,
+  ...props
+}: React$1.ComponentProps<"div"> & {
+  activeStep?: number;
+  orientation?: StepperOrientation;
+}): react_jsx_runtime0.JSX.Element;
+declare function StepperItem({
+  step,
+  className,
+  children,
+  ...props
+}: React$1.ComponentProps<"div"> & {
+  step: number;
+}): react_jsx_runtime0.JSX.Element;
+declare function StepperTitle({
+  className,
+  ...props
+}: React$1.ComponentProps<"span">): react_jsx_runtime0.JSX.Element;
+declare function StepperDescription({
+  className,
+  ...props
+}: React$1.ComponentProps<"span">): react_jsx_runtime0.JSX.Element;
+declare function StepperSeparator({
+  className,
+  ...props
+}: React$1.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Stepper, StepperDescription, StepperItem, StepperSeparator, StepperTitle };
+//# sourceMappingURL=stepper.d.ts.map

package/dist/client/ui/stepper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stepper.d.ts","names":[],"sources":["../../../src/client/ui/stepper.tsx"],"mappings":";;;;KAMK,kBAAA;AAAA,iBAgBI,OAAA,CAAA;EACP,UAAA;EACA,WAAA;EACA,SAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA;EACP,UAAA;EACA,WAAA,GAAc,kBAAA;AAAA,IACf,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAsBQ,WAAA,CAAA;EACP,IAAA;EACA,SAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA;EAA0B,IAAA;AAAA,IAAc,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAmDxC,YAAA,CAAA;EAAe,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,WAAsB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAMlE,kBAAA,CAAA;EAAqB,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,WAAsB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAUxE,gBAAA,CAAA;EAAmB,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}