@psnext/design-system 1.0.0 → 1.2.0

package/dist/primitives/Accordion/index.cjs

@@ -0,0 +1,54 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_cn = require("../../cn.cjs");
+let lucide_react = require("lucide-react");
+let radix_ui = require("radix-ui");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/primitives/Accordion/Accordion.tsx
+/** A vertically stacked set of collapsible sections built on Radix Accordion. */
+function Accordion({ className, variant = "line", ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Accordion.Root, {
+		"data-slot": "accordion",
+		"data-variant": variant,
+		className: require_cn.cn("group/accordion", variant === "bordered" && "rounded-md border", className),
+		...props
+	});
+}
+/** A single collapsible section; identified by its required `value`. */
+function AccordionItem({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Accordion.Item, {
+		"data-slot": "accordion-item",
+		className: require_cn.cn("border-b last:border-b-0", className),
+		...props
+	});
+}
+/** The clickable header that toggles its section open or closed. */
+function AccordionTrigger({ className, children, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Accordion.Header, {
+		className: "flex",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(radix_ui.Accordion.Trigger, {
+			"data-slot": "accordion-trigger",
+			className: require_cn.cn("focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180", "group-data-[variant=bordered]/accordion:px-4", className),
+			...props,
+			children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronDownIcon, { className: "text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" })]
+		})
+	});
+}
+/** The animated collapsible panel revealed when its section is open. */
+function AccordionContent({ className, children, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Accordion.Content, {
+		"data-slot": "accordion-content",
+		className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm",
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: require_cn.cn("pt-0 pb-4 group-data-[variant=bordered]/accordion:px-4", className),
+			children
+		})
+	});
+}
+//#endregion
+exports.Accordion = Accordion;
+exports.AccordionContent = AccordionContent;
+exports.AccordionItem = AccordionItem;
+exports.AccordionTrigger = AccordionTrigger;
+
+//# sourceMappingURL=index.cjs.map

package/dist/primitives/Accordion/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["AccordionPrimitive","cn","ChevronDownIcon"],"sources":["../../../src/primitives/Accordion/Accordion.tsx"],"sourcesContent":["import { cn } from \"@/utils\";\nimport { ChevronDownIcon } from \"lucide-react\";\nimport { Accordion as AccordionPrimitive } from \"radix-ui\";\n\n/** A vertically stacked set of collapsible sections built on Radix Accordion. */\nfunction Accordion({\n  className,\n  variant = \"line\",\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Root> & {\n  /** Visual style: `line` (divider rows) or `bordered` (rounded border with inset rows). */\n  variant?: \"line\" | \"bordered\";\n}) {\n  return (\n    <AccordionPrimitive.Root\n      data-slot=\"accordion\"\n      data-variant={variant}\n      // `bordered` wraps the group in a rounded border; items keep their\n      // dividers and triggers/content inset via the group-data selector below.\n      className={cn(\"group/accordion\", variant === \"bordered\" && \"rounded-md border\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A single collapsible section; identified by its required `value`. */\nfunction AccordionItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Item>) {\n  return (\n    <AccordionPrimitive.Item\n      data-slot=\"accordion-item\"\n      className={cn(\"border-b last:border-b-0\", className)}\n      {...props}\n    />\n  );\n}\n\n/** The clickable header that toggles its section open or closed. */\nfunction AccordionTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          \"focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180\",\n          \"group-data-[variant=bordered]/accordion:px-4\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        <ChevronDownIcon className=\"text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200\" />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  );\n}\n\n/** The animated collapsible panel revealed when its section is open. */\nfunction AccordionContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Content>) {\n  return (\n    <AccordionPrimitive.Content\n      data-slot=\"accordion-content\"\n      className=\"data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm\"\n      {...props}\n    >\n      <div className={cn(\"pt-0 pb-4 group-data-[variant=bordered]/accordion:px-4\", className)}>\n        {children}\n      </div>\n    </AccordionPrimitive.Content>\n  );\n}\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent };\n"],"mappings":";;;;;;;AAKA,SAAS,UAAU,EACjB,WACA,UAAU,QACV,GAAG,SAIF;CACD,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,UAAmB,MAApB;EACE,aAAU;EACV,gBAAc;EAGd,WAAWC,WAAAA,GAAG,mBAAmB,YAAY,cAAc,qBAAqB,SAAS;EACzF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,cAAc,EACrB,WACA,GAAG,SACoD;CACvD,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,UAAmB,MAApB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,4BAA4B,SAAS;EACnD,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,iBAAiB,EACxB,WACA,UACA,GAAG,SACuD;CAC1D,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,UAAmB,QAApB;EAA2B,WAAU;YACnC,iBAAA,GAAA,kBAAA,MAACA,SAAAA,UAAmB,SAApB;GACE,aAAU;GACV,WAAWC,WAAAA,GACT,8SACA,gDACA,SACF;GACA,GAAI;aAPN,CASG,UACD,iBAAA,GAAA,kBAAA,KAACC,aAAAA,iBAAD,EAAiB,WAAU,8GAA+G,CAAA,CAChH;;CACH,CAAA;AAE/B;;AAGA,SAAS,iBAAiB,EACxB,WACA,UACA,GAAG,SACuD;CAC1D,OACE,iBAAA,GAAA,kBAAA,KAACF,SAAAA,UAAmB,SAApB;EACE,aAAU;EACV,WAAU;EACV,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,WAAWC,WAAAA,GAAG,0DAA0D,SAAS;GACnF;EACE,CAAA;CACqB,CAAA;AAEhC"}

package/dist/primitives/Accordion/index.d.cts

@@ -0,0 +1,2 @@
+import { i as AccordionTrigger, n as AccordionContent, r as AccordionItem, t as Accordion } from "../../index.cjs";
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/dist/primitives/Accordion/index.d.ts

@@ -0,0 +1,2 @@
+import { i as AccordionTrigger, n as AccordionContent, r as AccordionItem, t as Accordion } from "../../index.js";
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/dist/primitives/Accordion/index.js

@@ -0,0 +1,50 @@
+import { t as cn } from "../../cn.js";
+import { ChevronDownIcon } from "lucide-react";
+import { Accordion as Accordion$1 } from "radix-ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/primitives/Accordion/Accordion.tsx
+/** A vertically stacked set of collapsible sections built on Radix Accordion. */
+function Accordion({ className, variant = "line", ...props }) {
+	return /* @__PURE__ */ jsx(Accordion$1.Root, {
+		"data-slot": "accordion",
+		"data-variant": variant,
+		className: cn("group/accordion", variant === "bordered" && "rounded-md border", className),
+		...props
+	});
+}
+/** A single collapsible section; identified by its required `value`. */
+function AccordionItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion$1.Item, {
+		"data-slot": "accordion-item",
+		className: cn("border-b last:border-b-0", className),
+		...props
+	});
+}
+/** The clickable header that toggles its section open or closed. */
+function AccordionTrigger({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion$1.Header, {
+		className: "flex",
+		children: /* @__PURE__ */ jsxs(Accordion$1.Trigger, {
+			"data-slot": "accordion-trigger",
+			className: cn("focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180", "group-data-[variant=bordered]/accordion:px-4", className),
+			...props,
+			children: [children, /* @__PURE__ */ jsx(ChevronDownIcon, { className: "text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" })]
+		})
+	});
+}
+/** The animated collapsible panel revealed when its section is open. */
+function AccordionContent({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion$1.Content, {
+		"data-slot": "accordion-content",
+		className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm",
+		...props,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("pt-0 pb-4 group-data-[variant=bordered]/accordion:px-4", className),
+			children
+		})
+	});
+}
+//#endregion
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
+
+//# sourceMappingURL=index.js.map

package/dist/primitives/Accordion/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["AccordionPrimitive"],"sources":["../../../src/primitives/Accordion/Accordion.tsx"],"sourcesContent":["import { cn } from \"@/utils\";\nimport { ChevronDownIcon } from \"lucide-react\";\nimport { Accordion as AccordionPrimitive } from \"radix-ui\";\n\n/** A vertically stacked set of collapsible sections built on Radix Accordion. */\nfunction Accordion({\n  className,\n  variant = \"line\",\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Root> & {\n  /** Visual style: `line` (divider rows) or `bordered` (rounded border with inset rows). */\n  variant?: \"line\" | \"bordered\";\n}) {\n  return (\n    <AccordionPrimitive.Root\n      data-slot=\"accordion\"\n      data-variant={variant}\n      // `bordered` wraps the group in a rounded border; items keep their\n      // dividers and triggers/content inset via the group-data selector below.\n      className={cn(\"group/accordion\", variant === \"bordered\" && \"rounded-md border\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A single collapsible section; identified by its required `value`. */\nfunction AccordionItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Item>) {\n  return (\n    <AccordionPrimitive.Item\n      data-slot=\"accordion-item\"\n      className={cn(\"border-b last:border-b-0\", className)}\n      {...props}\n    />\n  );\n}\n\n/** The clickable header that toggles its section open or closed. */\nfunction AccordionTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          \"focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180\",\n          \"group-data-[variant=bordered]/accordion:px-4\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        <ChevronDownIcon className=\"text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200\" />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  );\n}\n\n/** The animated collapsible panel revealed when its section is open. */\nfunction AccordionContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Content>) {\n  return (\n    <AccordionPrimitive.Content\n      data-slot=\"accordion-content\"\n      className=\"data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm\"\n      {...props}\n    >\n      <div className={cn(\"pt-0 pb-4 group-data-[variant=bordered]/accordion:px-4\", className)}>\n        {children}\n      </div>\n    </AccordionPrimitive.Content>\n  );\n}\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent };\n"],"mappings":";;;;;;AAKA,SAAS,UAAU,EACjB,WACA,UAAU,QACV,GAAG,SAIF;CACD,OACE,oBAACA,YAAmB,MAApB;EACE,aAAU;EACV,gBAAc;EAGd,WAAW,GAAG,mBAAmB,YAAY,cAAc,qBAAqB,SAAS;EACzF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,cAAc,EACrB,WACA,GAAG,SACoD;CACvD,OACE,oBAACA,YAAmB,MAApB;EACE,aAAU;EACV,WAAW,GAAG,4BAA4B,SAAS;EACnD,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,iBAAiB,EACxB,WACA,UACA,GAAG,SACuD;CAC1D,OACE,oBAACA,YAAmB,QAApB;EAA2B,WAAU;YACnC,qBAACA,YAAmB,SAApB;GACE,aAAU;GACV,WAAW,GACT,8SACA,gDACA,SACF;GACA,GAAI;aAPN,CASG,UACD,oBAAC,iBAAD,EAAiB,WAAU,8GAA+G,CAAA,CAChH;;CACH,CAAA;AAE/B;;AAGA,SAAS,iBAAiB,EACxB,WACA,UACA,GAAG,SACuD;CAC1D,OACE,oBAACA,YAAmB,SAApB;EACE,aAAU;EACV,WAAU;EACV,GAAI;YAEJ,oBAAC,OAAD;GAAK,WAAW,GAAG,0DAA0D,SAAS;GACnF;EACE,CAAA;CACqB,CAAA;AAEhC"}

package/dist/primitives/Alert/index.cjs

@@ -0,0 +1,61 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_cn = require("../../cn.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/primitives/Alert/Alert.tsx
+const alertVariants = (0, require("class-variance-authority").cva)(require_cn.cn("relative flex w-full items-start gap-3 rounded-lg border px-4 py-3 text-sm", "[&>svg]:order-1 [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:translate-y-0.5 [&>svg]:text-current", "data-[flip-icon=true]:[&>svg]:order-3"), {
+	variants: { variant: {
+		default: "bg-card text-card-foreground",
+		destructive: "text-destructive bg-card [&_[data-slot=alert-description]]:text-destructive/90"
+	} },
+	defaultVariants: { variant: "default" }
+});
+/** Callout banner for surfacing contextual messages, statuses, and errors. */
+function Alert({ className, variant, flipIcon = false, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "alert",
+		"data-flip-icon": flipIcon,
+		role: "alert",
+		className: require_cn.cn(alertVariants({ variant }), className),
+		...props
+	});
+}
+/** Wraps the title + description so the icon and action can sit beside them. */
+function AlertContent({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "alert-content",
+		className: require_cn.cn("order-2 flex min-w-0 flex-1 flex-col gap-0.5", className),
+		...props
+	});
+}
+/** Primary heading line of the alert. */
+function AlertTitle({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h5", {
+		"data-slot": "alert-title",
+		className: require_cn.cn("min-h-4 font-medium tracking-tight", className),
+		...props
+	});
+}
+/** Secondary supporting text shown beneath the title. */
+function AlertDescription({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "alert-description",
+		className: require_cn.cn("text-muted-foreground text-sm [&_p]:leading-relaxed", className),
+		...props
+	});
+}
+/** Trailing action slot (Figma "Show Button"); always sits at the trailing edge. */
+function AlertAction({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "alert-action",
+		className: require_cn.cn("order-4 flex shrink-0 items-center self-center", className),
+		...props
+	});
+}
+//#endregion
+exports.Alert = Alert;
+exports.AlertAction = AlertAction;
+exports.AlertContent = AlertContent;
+exports.AlertDescription = AlertDescription;
+exports.AlertTitle = AlertTitle;
+
+//# sourceMappingURL=index.cjs.map

package/dist/primitives/Alert/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["cn"],"sources":["../../../src/primitives/Alert/Alert.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport type * as React from \"react\";\n\nimport { cn } from \"../../utils\";\n\nconst alertVariants = cva(\n  cn(\n    \"relative flex w-full items-start gap-3 rounded-lg border px-4 py-3 text-sm\",\n    \"[&>svg]:order-1 [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:translate-y-0.5 [&>svg]:text-current\",\n    // `flipIcon` moves the icon to the trailing edge (Figma \"Flip Icon\").\n    \"data-[flip-icon=true]:[&>svg]:order-3\",\n  ),\n  {\n    variants: {\n      variant: {\n        default: \"bg-card text-card-foreground\",\n        destructive:\n          \"text-destructive bg-card [&_[data-slot=alert-description]]:text-destructive/90\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  },\n);\n\n/** Callout banner for surfacing contextual messages, statuses, and errors. */\nfunction Alert({\n  className,\n  variant,\n  flipIcon = false,\n  ...props\n}: React.ComponentProps<\"div\"> &\n  VariantProps<typeof alertVariants> & {\n    /** Visual tone of the alert. */\n    variant?: VariantProps<typeof alertVariants>[\"variant\"];\n    /** Moves the leading icon to the trailing edge (Figma \"Flip Icon\"). */\n    flipIcon?: boolean;\n  }) {\n  return (\n    <div\n      data-slot=\"alert\"\n      data-flip-icon={flipIcon}\n      role=\"alert\"\n      className={cn(alertVariants({ variant }), className)}\n      {...props}\n    />\n  );\n}\n\n/** Wraps the title + description so the icon and action can sit beside them. */\nfunction AlertContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-content\"\n      className={cn(\"order-2 flex min-w-0 flex-1 flex-col gap-0.5\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Primary heading line of the alert. */\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"h5\">) {\n  return (\n    <h5\n      data-slot=\"alert-title\"\n      className={cn(\"min-h-4 font-medium tracking-tight\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Secondary supporting text shown beneath the title. */\nfunction AlertDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(\"text-muted-foreground text-sm [&_p]:leading-relaxed\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Trailing action slot (Figma \"Show Button\"); always sits at the trailing edge. */\nfunction AlertAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-action\"\n      className={cn(\"order-4 flex shrink-0 items-center self-center\", className)}\n      {...props}\n    />\n  );\n}\n\nexport { Alert, AlertTitle, AlertDescription, AlertContent, AlertAction };\n"],"mappings":";;;;AAKA,MAAM,iBAAA,qCAAA,EAAA,KACJA,WAAAA,GACE,8EACA,gGAEA,uCACF,GACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,aACE;CACJ,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CACF;;AAGA,SAAS,MAAM,EACb,WACA,SACA,WAAW,OACX,GAAG,SAOA;CACH,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,kBAAgB;EAChB,MAAK;EACL,WAAWA,WAAAA,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;EACnD,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAqC;CACvE,OACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,sCAAsC,SAAS;EAC7D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAsC;CAC9E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,uDAAuD,SAAS;EAC9E,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,kDAAkD,SAAS;EACzE,GAAI;CACL,CAAA;AAEL"}

package/dist/primitives/Alert/index.d.cts

@@ -0,0 +1,2 @@
+import { a as AlertTitle, i as AlertDescription, n as AlertAction, r as AlertContent, t as Alert } from "../../index2.cjs";
+export { Alert, AlertAction, AlertContent, AlertDescription, AlertTitle };

package/dist/primitives/Alert/index.d.ts

@@ -0,0 +1,2 @@
+import { a as AlertTitle, i as AlertDescription, n as AlertAction, r as AlertContent, t as Alert } from "../../index2.js";
+export { Alert, AlertAction, AlertContent, AlertDescription, AlertTitle };

package/dist/primitives/Alert/index.js

@@ -0,0 +1,57 @@
+import { t as cn } from "../../cn.js";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+//#region src/primitives/Alert/Alert.tsx
+const alertVariants = cva(cn("relative flex w-full items-start gap-3 rounded-lg border px-4 py-3 text-sm", "[&>svg]:order-1 [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:translate-y-0.5 [&>svg]:text-current", "data-[flip-icon=true]:[&>svg]:order-3"), {
+	variants: { variant: {
+		default: "bg-card text-card-foreground",
+		destructive: "text-destructive bg-card [&_[data-slot=alert-description]]:text-destructive/90"
+	} },
+	defaultVariants: { variant: "default" }
+});
+/** Callout banner for surfacing contextual messages, statuses, and errors. */
+function Alert({ className, variant, flipIcon = false, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert",
+		"data-flip-icon": flipIcon,
+		role: "alert",
+		className: cn(alertVariants({ variant }), className),
+		...props
+	});
+}
+/** Wraps the title + description so the icon and action can sit beside them. */
+function AlertContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-content",
+		className: cn("order-2 flex min-w-0 flex-1 flex-col gap-0.5", className),
+		...props
+	});
+}
+/** Primary heading line of the alert. */
+function AlertTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx("h5", {
+		"data-slot": "alert-title",
+		className: cn("min-h-4 font-medium tracking-tight", className),
+		...props
+	});
+}
+/** Secondary supporting text shown beneath the title. */
+function AlertDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-description",
+		className: cn("text-muted-foreground text-sm [&_p]:leading-relaxed", className),
+		...props
+	});
+}
+/** Trailing action slot (Figma "Show Button"); always sits at the trailing edge. */
+function AlertAction({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-action",
+		className: cn("order-4 flex shrink-0 items-center self-center", className),
+		...props
+	});
+}
+//#endregion
+export { Alert, AlertAction, AlertContent, AlertDescription, AlertTitle };
+
+//# sourceMappingURL=index.js.map

package/dist/primitives/Alert/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/primitives/Alert/Alert.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport type * as React from \"react\";\n\nimport { cn } from \"../../utils\";\n\nconst alertVariants = cva(\n  cn(\n    \"relative flex w-full items-start gap-3 rounded-lg border px-4 py-3 text-sm\",\n    \"[&>svg]:order-1 [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:translate-y-0.5 [&>svg]:text-current\",\n    // `flipIcon` moves the icon to the trailing edge (Figma \"Flip Icon\").\n    \"data-[flip-icon=true]:[&>svg]:order-3\",\n  ),\n  {\n    variants: {\n      variant: {\n        default: \"bg-card text-card-foreground\",\n        destructive:\n          \"text-destructive bg-card [&_[data-slot=alert-description]]:text-destructive/90\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  },\n);\n\n/** Callout banner for surfacing contextual messages, statuses, and errors. */\nfunction Alert({\n  className,\n  variant,\n  flipIcon = false,\n  ...props\n}: React.ComponentProps<\"div\"> &\n  VariantProps<typeof alertVariants> & {\n    /** Visual tone of the alert. */\n    variant?: VariantProps<typeof alertVariants>[\"variant\"];\n    /** Moves the leading icon to the trailing edge (Figma \"Flip Icon\"). */\n    flipIcon?: boolean;\n  }) {\n  return (\n    <div\n      data-slot=\"alert\"\n      data-flip-icon={flipIcon}\n      role=\"alert\"\n      className={cn(alertVariants({ variant }), className)}\n      {...props}\n    />\n  );\n}\n\n/** Wraps the title + description so the icon and action can sit beside them. */\nfunction AlertContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-content\"\n      className={cn(\"order-2 flex min-w-0 flex-1 flex-col gap-0.5\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Primary heading line of the alert. */\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"h5\">) {\n  return (\n    <h5\n      data-slot=\"alert-title\"\n      className={cn(\"min-h-4 font-medium tracking-tight\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Secondary supporting text shown beneath the title. */\nfunction AlertDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(\"text-muted-foreground text-sm [&_p]:leading-relaxed\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Trailing action slot (Figma \"Show Button\"); always sits at the trailing edge. */\nfunction AlertAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-action\"\n      className={cn(\"order-4 flex shrink-0 items-center self-center\", className)}\n      {...props}\n    />\n  );\n}\n\nexport { Alert, AlertTitle, AlertDescription, AlertContent, AlertAction };\n"],"mappings":";;;;AAKA,MAAM,gBAAgB,IACpB,GACE,8EACA,gGAEA,uCACF,GACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,aACE;CACJ,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CACF;;AAGA,SAAS,MAAM,EACb,WACA,SACA,WAAW,OACX,GAAG,SAOA;CACH,OACE,oBAAC,OAAD;EACE,aAAU;EACV,kBAAgB;EAChB,MAAK;EACL,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;EACnD,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAqC;CACvE,OACE,oBAAC,MAAD;EACE,aAAU;EACV,WAAW,GAAG,sCAAsC,SAAS;EAC7D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAsC;CAC9E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,uDAAuD,SAAS;EAC9E,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,kDAAkD,SAAS;EACzE,GAAI;CACL,CAAA;AAEL"}

package/dist/primitives/AlertDialog/index.cjs

@@ -0,0 +1,102 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_cn = require("../../cn.cjs");
+const require_primitives_Button_index = require("../Button/index.cjs");
+let radix_ui = require("radix-ui");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/primitives/AlertDialog/AlertDialog.tsx
+/** A modal confirmation dialog that interrupts the user and expects a deliberate response. */
+function AlertDialog({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.AlertDialog.Root, {
+		"data-slot": "alert-dialog",
+		...props
+	});
+}
+function AlertDialogTrigger({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.AlertDialog.Trigger, {
+		"data-slot": "alert-dialog-trigger",
+		...props
+	});
+}
+function AlertDialogPortal({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.AlertDialog.Portal, {
+		"data-slot": "alert-dialog-portal",
+		...props
+	});
+}
+function AlertDialogOverlay({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.AlertDialog.Overlay, {
+		"data-slot": "alert-dialog-overlay",
+		className: require_cn.cn("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-[var(--overlay)]", className),
+		...props
+	});
+}
+function AlertDialogContent({ className, size = "default", ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(AlertDialogPortal, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(AlertDialogOverlay, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.AlertDialog.Content, {
+		"data-slot": "alert-dialog-content",
+		"data-size": size,
+		className: require_cn.cn("group/alert-dialog-content bg-background fixed top-[50%] left-[50%] z-50 flex w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] flex-col gap-4 rounded-lg border p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", "data-[size=default]:sm:max-w-sm data-[size=large]:sm:max-w-lg", className),
+		...props
+	})] });
+}
+function AlertDialogHeader({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "alert-dialog-header",
+		className: require_cn.cn("flex flex-col gap-2", "group-data-[size=default]/alert-dialog-content:items-center group-data-[size=default]/alert-dialog-content:text-center", "group-data-[size=large]/alert-dialog-content:text-left", className),
+		...props
+	});
+}
+function AlertDialogFooter({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "alert-dialog-footer",
+		className: require_cn.cn("flex gap-2", "group-data-[size=default]/alert-dialog-content:flex-row group-data-[size=default]/alert-dialog-content:[&>*]:flex-1", "group-data-[size=large]/alert-dialog-content:flex-row group-data-[size=large]/alert-dialog-content:justify-end", className),
+		...props
+	});
+}
+function AlertDialogTitle({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.AlertDialog.Title, {
+		"data-slot": "alert-dialog-title",
+		className: require_cn.cn("text-lg font-semibold", className),
+		...props
+	});
+}
+function AlertDialogDescription({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.AlertDialog.Description, {
+		"data-slot": "alert-dialog-description",
+		className: require_cn.cn("text-muted-foreground text-sm", className),
+		...props
+	});
+}
+function AlertDialogMedia({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "alert-dialog-media",
+		className: require_cn.cn("flex items-center [&>svg]:size-5", "group-data-[size=default]/alert-dialog-content:justify-center", className),
+		...props
+	});
+}
+function AlertDialogAction({ className, variant = "default", ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.AlertDialog.Action, {
+		className: require_cn.cn(require_primitives_Button_index.buttonVariants({ variant }), className),
+		...props
+	});
+}
+function AlertDialogCancel({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.AlertDialog.Cancel, {
+		className: require_cn.cn(require_primitives_Button_index.buttonVariants({ variant: "outline" }), className),
+		...props
+	});
+}
+//#endregion
+exports.AlertDialog = AlertDialog;
+exports.AlertDialogAction = AlertDialogAction;
+exports.AlertDialogCancel = AlertDialogCancel;
+exports.AlertDialogContent = AlertDialogContent;
+exports.AlertDialogDescription = AlertDialogDescription;
+exports.AlertDialogFooter = AlertDialogFooter;
+exports.AlertDialogHeader = AlertDialogHeader;
+exports.AlertDialogMedia = AlertDialogMedia;
+exports.AlertDialogOverlay = AlertDialogOverlay;
+exports.AlertDialogPortal = AlertDialogPortal;
+exports.AlertDialogTitle = AlertDialogTitle;
+exports.AlertDialogTrigger = AlertDialogTrigger;
+
+//# sourceMappingURL=index.cjs.map

package/dist/primitives/AlertDialog/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["AlertDialogPrimitive","cn","buttonVariants"],"sources":["../../../src/primitives/AlertDialog/AlertDialog.tsx"],"sourcesContent":["import { AlertDialog as AlertDialogPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\nimport { buttonVariants } from \"../Button\";\n\n/** A modal confirmation dialog that interrupts the user and expects a deliberate response. */\nfunction AlertDialog({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />;\n}\n\nfunction AlertDialogTrigger({\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {\n  return <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />;\n}\n\nfunction AlertDialogPortal({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {\n  return <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />;\n}\n\nfunction AlertDialogOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>) {\n  return (\n    <AlertDialogPrimitive.Overlay\n      data-slot=\"alert-dialog-overlay\"\n      className={cn(\n        \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-[var(--overlay)]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogContent({\n  className,\n  size = \"default\",\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {\n  /** Layout preset: `default` is compact + centered, `large` is wide + left-aligned. */\n  size?: \"default\" | \"large\";\n}) {\n  return (\n    <AlertDialogPortal>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Content\n        data-slot=\"alert-dialog-content\"\n        data-size={size}\n        className={cn(\n          \"group/alert-dialog-content bg-background fixed top-[50%] left-[50%] z-50 flex w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] flex-col gap-4 rounded-lg border p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n          // Width by size: default = compact / centered, large = wide / left-aligned.\n          \"data-[size=default]:sm:max-w-sm data-[size=large]:sm:max-w-lg\",\n          className,\n        )}\n        {...props}\n      />\n    </AlertDialogPortal>\n  );\n}\n\nfunction AlertDialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(\n        \"flex flex-col gap-2\",\n        \"group-data-[size=default]/alert-dialog-content:items-center group-data-[size=default]/alert-dialog-content:text-center\",\n        \"group-data-[size=large]/alert-dialog-content:text-left\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(\n        \"flex gap-2\",\n        // default: buttons share the width side-by-side; large: trailing-aligned.\n        \"group-data-[size=default]/alert-dialog-content:flex-row group-data-[size=default]/alert-dialog-content:[&>*]:flex-1\",\n        \"group-data-[size=large]/alert-dialog-content:flex-row group-data-[size=large]/alert-dialog-content:justify-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n  return (\n    <AlertDialogPrimitive.Title\n      data-slot=\"alert-dialog-title\"\n      className={cn(\"text-lg font-semibold\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n  return (\n    <AlertDialogPrimitive.Description\n      data-slot=\"alert-dialog-description\"\n      className={cn(\"text-muted-foreground text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\n// Small icon slot — centered for the default size, leading for large.\nfunction AlertDialogMedia({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-media\"\n      className={cn(\n        \"flex items-center [&>svg]:size-5\",\n        \"group-data-[size=default]/alert-dialog-content:justify-center\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogAction({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Action> & {\n  /** Button style for the confirming action; use `destructive` for irreversible actions. */\n  variant?: \"default\" | \"destructive\";\n}) {\n  return (\n    <AlertDialogPrimitive.Action\n      className={cn(buttonVariants({ variant }), className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogCancel({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>) {\n  return (\n    <AlertDialogPrimitive.Cancel\n      className={cn(buttonVariants({ variant: \"outline\" }), className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogMedia,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n};\n"],"mappings":";;;;;;;AAOA,SAAS,YAAY,EAAE,GAAG,SAAiE;CACzF,OAAO,iBAAA,GAAA,kBAAA,KAACA,SAAAA,YAAqB,MAAtB;EAA2B,aAAU;EAAe,GAAI;CAAQ,CAAA;AACzE;AAEA,SAAS,mBAAmB,EAC1B,GAAG,SACyD;CAC5D,OAAO,iBAAA,GAAA,kBAAA,KAACA,SAAAA,YAAqB,SAAtB;EAA8B,aAAU;EAAuB,GAAI;CAAQ,CAAA;AACpF;AAEA,SAAS,kBAAkB,EAAE,GAAG,SAAmE;CACjG,OAAO,iBAAA,GAAA,kBAAA,KAACA,SAAAA,YAAqB,QAAtB;EAA6B,aAAU;EAAsB,GAAI;CAAQ,CAAA;AAClF;AAEA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,YAAqB,SAAtB;EACE,aAAU;EACV,WAAWC,WAAAA,GACT,kKACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,mBAAmB,EAC1B,WACA,OAAO,WACP,GAAG,SAIF;CACD,OACE,iBAAA,GAAA,kBAAA,MAAC,mBAAD,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,KAAC,oBAAD,CAAqB,CAAA,GACrB,iBAAA,GAAA,kBAAA,KAACD,SAAAA,YAAqB,SAAtB;EACE,aAAU;EACV,aAAW;EACX,WAAWC,WAAAA,GACT,uYAEA,iEACA,SACF;EACA,GAAI;CACL,CAAA,CACgB,EAAA,CAAA;AAEvB;AAEA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAsC;CAC/E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GACT,uBACA,0HACA,0DACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAsC;CAC/E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GACT,cAEA,uHACA,kHACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,YAAqB,OAAtB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,yBAAyB,SAAS;EAChD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;CAChE,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,YAAqB,aAAtB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,iCAAiC,SAAS;EACxD,GAAI;CACL,CAAA;AAEL;AAGA,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAsC;CAC9E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GACT,oCACA,iEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,UAAU,WACV,GAAG,SAIF;CACD,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,YAAqB,QAAtB;EACE,WAAWC,WAAAA,GAAGC,gCAAAA,eAAe,EAAE,QAAQ,CAAC,GAAG,SAAS;EACpD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SACwD;CAC3D,OACE,iBAAA,GAAA,kBAAA,KAACF,SAAAA,YAAqB,QAAtB;EACE,WAAWC,WAAAA,GAAGC,gCAAAA,eAAe,EAAE,SAAS,UAAU,CAAC,GAAG,SAAS;EAC/D,GAAI;CACL,CAAA;AAEL"}

package/dist/primitives/AlertDialog/index.d.cts

@@ -0,0 +1,2 @@
+import { a as AlertDialogDescription, c as AlertDialogMedia, d as AlertDialogTitle, f as AlertDialogTrigger, i as AlertDialogContent, l as AlertDialogOverlay, n as AlertDialogAction, o as AlertDialogFooter, r as AlertDialogCancel, s as AlertDialogHeader, t as AlertDialog, u as AlertDialogPortal } from "../../index3.cjs";
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };

package/dist/primitives/AlertDialog/index.d.ts

@@ -0,0 +1,2 @@
+import { a as AlertDialogDescription, c as AlertDialogMedia, d as AlertDialogTitle, f as AlertDialogTrigger, i as AlertDialogContent, l as AlertDialogOverlay, n as AlertDialogAction, o as AlertDialogFooter, r as AlertDialogCancel, s as AlertDialogHeader, t as AlertDialog, u as AlertDialogPortal } from "../../index3.js";
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };

package/dist/primitives/AlertDialog/index.js

@@ -0,0 +1,90 @@
+import { t as cn } from "../../cn.js";
+import { buttonVariants } from "../Button/index.js";
+import { AlertDialog as AlertDialog$1 } from "radix-ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/primitives/AlertDialog/AlertDialog.tsx
+/** A modal confirmation dialog that interrupts the user and expects a deliberate response. */
+function AlertDialog({ ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Root, {
+		"data-slot": "alert-dialog",
+		...props
+	});
+}
+function AlertDialogTrigger({ ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Trigger, {
+		"data-slot": "alert-dialog-trigger",
+		...props
+	});
+}
+function AlertDialogPortal({ ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Portal, {
+		"data-slot": "alert-dialog-portal",
+		...props
+	});
+}
+function AlertDialogOverlay({ className, ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Overlay, {
+		"data-slot": "alert-dialog-overlay",
+		className: cn("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-[var(--overlay)]", className),
+		...props
+	});
+}
+function AlertDialogContent({ className, size = "default", ...props }) {
+	return /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [/* @__PURE__ */ jsx(AlertDialogOverlay, {}), /* @__PURE__ */ jsx(AlertDialog$1.Content, {
+		"data-slot": "alert-dialog-content",
+		"data-size": size,
+		className: cn("group/alert-dialog-content bg-background fixed top-[50%] left-[50%] z-50 flex w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] flex-col gap-4 rounded-lg border p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", "data-[size=default]:sm:max-w-sm data-[size=large]:sm:max-w-lg", className),
+		...props
+	})] });
+}
+function AlertDialogHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-dialog-header",
+		className: cn("flex flex-col gap-2", "group-data-[size=default]/alert-dialog-content:items-center group-data-[size=default]/alert-dialog-content:text-center", "group-data-[size=large]/alert-dialog-content:text-left", className),
+		...props
+	});
+}
+function AlertDialogFooter({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-dialog-footer",
+		className: cn("flex gap-2", "group-data-[size=default]/alert-dialog-content:flex-row group-data-[size=default]/alert-dialog-content:[&>*]:flex-1", "group-data-[size=large]/alert-dialog-content:flex-row group-data-[size=large]/alert-dialog-content:justify-end", className),
+		...props
+	});
+}
+function AlertDialogTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Title, {
+		"data-slot": "alert-dialog-title",
+		className: cn("text-lg font-semibold", className),
+		...props
+	});
+}
+function AlertDialogDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Description, {
+		"data-slot": "alert-dialog-description",
+		className: cn("text-muted-foreground text-sm", className),
+		...props
+	});
+}
+function AlertDialogMedia({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-dialog-media",
+		className: cn("flex items-center [&>svg]:size-5", "group-data-[size=default]/alert-dialog-content:justify-center", className),
+		...props
+	});
+}
+function AlertDialogAction({ className, variant = "default", ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Action, {
+		className: cn(buttonVariants({ variant }), className),
+		...props
+	});
+}
+function AlertDialogCancel({ className, ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Cancel, {
+		className: cn(buttonVariants({ variant: "outline" }), className),
+		...props
+	});
+}
+//#endregion
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };
+
+//# sourceMappingURL=index.js.map

package/dist/primitives/AlertDialog/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["AlertDialogPrimitive"],"sources":["../../../src/primitives/AlertDialog/AlertDialog.tsx"],"sourcesContent":["import { AlertDialog as AlertDialogPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\nimport { buttonVariants } from \"../Button\";\n\n/** A modal confirmation dialog that interrupts the user and expects a deliberate response. */\nfunction AlertDialog({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />;\n}\n\nfunction AlertDialogTrigger({\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {\n  return <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />;\n}\n\nfunction AlertDialogPortal({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {\n  return <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />;\n}\n\nfunction AlertDialogOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>) {\n  return (\n    <AlertDialogPrimitive.Overlay\n      data-slot=\"alert-dialog-overlay\"\n      className={cn(\n        \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-[var(--overlay)]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogContent({\n  className,\n  size = \"default\",\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {\n  /** Layout preset: `default` is compact + centered, `large` is wide + left-aligned. */\n  size?: \"default\" | \"large\";\n}) {\n  return (\n    <AlertDialogPortal>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Content\n        data-slot=\"alert-dialog-content\"\n        data-size={size}\n        className={cn(\n          \"group/alert-dialog-content bg-background fixed top-[50%] left-[50%] z-50 flex w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] flex-col gap-4 rounded-lg border p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n          // Width by size: default = compact / centered, large = wide / left-aligned.\n          \"data-[size=default]:sm:max-w-sm data-[size=large]:sm:max-w-lg\",\n          className,\n        )}\n        {...props}\n      />\n    </AlertDialogPortal>\n  );\n}\n\nfunction AlertDialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(\n        \"flex flex-col gap-2\",\n        \"group-data-[size=default]/alert-dialog-content:items-center group-data-[size=default]/alert-dialog-content:text-center\",\n        \"group-data-[size=large]/alert-dialog-content:text-left\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(\n        \"flex gap-2\",\n        // default: buttons share the width side-by-side; large: trailing-aligned.\n        \"group-data-[size=default]/alert-dialog-content:flex-row group-data-[size=default]/alert-dialog-content:[&>*]:flex-1\",\n        \"group-data-[size=large]/alert-dialog-content:flex-row group-data-[size=large]/alert-dialog-content:justify-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n  return (\n    <AlertDialogPrimitive.Title\n      data-slot=\"alert-dialog-title\"\n      className={cn(\"text-lg font-semibold\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n  return (\n    <AlertDialogPrimitive.Description\n      data-slot=\"alert-dialog-description\"\n      className={cn(\"text-muted-foreground text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\n// Small icon slot — centered for the default size, leading for large.\nfunction AlertDialogMedia({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-media\"\n      className={cn(\n        \"flex items-center [&>svg]:size-5\",\n        \"group-data-[size=default]/alert-dialog-content:justify-center\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogAction({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Action> & {\n  /** Button style for the confirming action; use `destructive` for irreversible actions. */\n  variant?: \"default\" | \"destructive\";\n}) {\n  return (\n    <AlertDialogPrimitive.Action\n      className={cn(buttonVariants({ variant }), className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogCancel({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>) {\n  return (\n    <AlertDialogPrimitive.Cancel\n      className={cn(buttonVariants({ variant: \"outline\" }), className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogMedia,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n};\n"],"mappings":";;;;;;AAOA,SAAS,YAAY,EAAE,GAAG,SAAiE;CACzF,OAAO,oBAACA,cAAqB,MAAtB;EAA2B,aAAU;EAAe,GAAI;CAAQ,CAAA;AACzE;AAEA,SAAS,mBAAmB,EAC1B,GAAG,SACyD;CAC5D,OAAO,oBAACA,cAAqB,SAAtB;EAA8B,aAAU;EAAuB,GAAI;CAAQ,CAAA;AACpF;AAEA,SAAS,kBAAkB,EAAE,GAAG,SAAmE;CACjG,OAAO,oBAACA,cAAqB,QAAtB;EAA6B,aAAU;EAAsB,GAAI;CAAQ,CAAA;AAClF;AAEA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,oBAACA,cAAqB,SAAtB;EACE,aAAU;EACV,WAAW,GACT,kKACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,mBAAmB,EAC1B,WACA,OAAO,WACP,GAAG,SAIF;CACD,OACE,qBAAC,mBAAD,EAAA,UAAA,CACE,oBAAC,oBAAD,CAAqB,CAAA,GACrB,oBAACA,cAAqB,SAAtB;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,uYAEA,iEACA,SACF;EACA,GAAI;CACL,CAAA,CACgB,EAAA,CAAA;AAEvB;AAEA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAsC;CAC/E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,uBACA,0HACA,0DACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAsC;CAC/E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,cAEA,uHACA,kHACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,oBAACA,cAAqB,OAAtB;EACE,aAAU;EACV,WAAW,GAAG,yBAAyB,SAAS;EAChD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;CAChE,OACE,oBAACA,cAAqB,aAAtB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,SAAS;EACxD,GAAI;CACL,CAAA;AAEL;AAGA,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAsC;CAC9E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,oCACA,iEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,UAAU,WACV,GAAG,SAIF;CACD,OACE,oBAACA,cAAqB,QAAtB;EACE,WAAW,GAAG,eAAe,EAAE,QAAQ,CAAC,GAAG,SAAS;EACpD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SACwD;CAC3D,OACE,oBAACA,cAAqB,QAAtB;EACE,WAAW,GAAG,eAAe,EAAE,SAAS,UAAU,CAAC,GAAG,SAAS;EAC/D,GAAI;CACL,CAAA;AAEL"}

package/dist/primitives/AspectRatio/index.cjs

@@ -0,0 +1,15 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let radix_ui = require("radix-ui");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/primitives/AspectRatio/AspectRatio.tsx
+/** Constrains its children to a fixed width-to-height `ratio` (e.g. media, thumbnails, embeds). */
+function AspectRatio({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.AspectRatio.Root, {
+		"data-slot": "aspect-ratio",
+		...props
+	});
+}
+//#endregion
+exports.AspectRatio = AspectRatio;
+
+//# sourceMappingURL=index.cjs.map

package/dist/primitives/AspectRatio/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["AspectRatioPrimitive"],"sources":["../../../src/primitives/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import { AspectRatio as AspectRatioPrimitive } from \"radix-ui\";\n\n/** Constrains its children to a fixed width-to-height `ratio` (e.g. media, thumbnails, embeds). */\nfunction AspectRatio({ ...props }: React.ComponentProps<typeof AspectRatioPrimitive.Root>) {\n  return <AspectRatioPrimitive.Root data-slot=\"aspect-ratio\" {...props} />;\n}\n\nexport { AspectRatio };\n"],"mappings":";;;;;AAGA,SAAS,YAAY,EAAE,GAAG,SAAiE;CACzF,OAAO,iBAAA,GAAA,kBAAA,KAACA,SAAAA,YAAqB,MAAtB;EAA2B,aAAU;EAAe,GAAI;CAAQ,CAAA;AACzE"}

package/dist/primitives/AspectRatio/index.d.cts

@@ -0,0 +1,2 @@
+import { t as AspectRatio } from "../../index4.cjs";
+export { AspectRatio };

package/dist/primitives/AspectRatio/index.d.ts

@@ -0,0 +1,2 @@
+import { t as AspectRatio } from "../../index4.js";
+export { AspectRatio };

package/dist/primitives/AspectRatio/index.js

@@ -0,0 +1,14 @@
+import { AspectRatio as AspectRatio$1 } from "radix-ui";
+import { jsx } from "react/jsx-runtime";
+//#region src/primitives/AspectRatio/AspectRatio.tsx
+/** Constrains its children to a fixed width-to-height `ratio` (e.g. media, thumbnails, embeds). */
+function AspectRatio({ ...props }) {
+	return /* @__PURE__ */ jsx(AspectRatio$1.Root, {
+		"data-slot": "aspect-ratio",
+		...props
+	});
+}
+//#endregion
+export { AspectRatio };
+
+//# sourceMappingURL=index.js.map

package/dist/primitives/AspectRatio/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["AspectRatioPrimitive"],"sources":["../../../src/primitives/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import { AspectRatio as AspectRatioPrimitive } from \"radix-ui\";\n\n/** Constrains its children to a fixed width-to-height `ratio` (e.g. media, thumbnails, embeds). */\nfunction AspectRatio({ ...props }: React.ComponentProps<typeof AspectRatioPrimitive.Root>) {\n  return <AspectRatioPrimitive.Root data-slot=\"aspect-ratio\" {...props} />;\n}\n\nexport { AspectRatio };\n"],"mappings":";;;;AAGA,SAAS,YAAY,EAAE,GAAG,SAAiE;CACzF,OAAO,oBAACA,cAAqB,MAAtB;EAA2B,aAAU;EAAe,GAAI;CAAQ,CAAA;AACzE"}