@countermeasure-platform/web-components 0.2.0

package/dist/react/primitives/collapsible.js

@@ -0,0 +1,51 @@
+import { t as e } from "../../utils-B7XIe3qq.js";
+import { t } from "../../chevron-down-CsLpP_71.js";
+import { t as n } from "../../chevron-up-BhaePjuF.js";
+import { jsx as r } from "react/jsx-runtime";
+import { createContext as i, useContext as a, useState as o } from "react";
+//#region src/react/primitives/collapsible.tsx
+var s = i(null);
+function c() {
+	let e = a(s);
+	if (!e) throw Error("Collapsible components must be used within a Collapsible");
+	return e;
+}
+function l({ children: e, defaultOpen: t = !0, open: n, onOpenChange: i, className: a }) {
+	let [c, l] = o(t), u = n !== void 0, d = u ? n : c;
+	return /* @__PURE__ */ r(s.Provider, {
+		value: {
+			isOpen: d,
+			toggle: () => {
+				u ? i?.(!n) : l((e) => !e);
+			}
+		},
+		children: /* @__PURE__ */ r("div", {
+			className: a,
+			children: e
+		})
+	});
+}
+function u({ children: i, className: a, showIcon: o = !0 }) {
+	let { isOpen: s, toggle: l } = c();
+	return /* @__PURE__ */ r("button", {
+		type: "button",
+		onClick: l,
+		className: e("text-foreground-muted hover:bg-accent hover:text-foreground-secondary rounded-lg p-1.5 transition-colors", a),
+		"aria-expanded": s,
+		children: i || o && r(s ? n : t, { className: "h-4 w-4" })
+	});
+}
+function d({ children: t, className: n }) {
+	let { isOpen: i } = c();
+	return /* @__PURE__ */ r("div", {
+		className: e("grid transition-[grid-template-rows] duration-300 ease-out", i ? "grid-rows-[1fr]" : "grid-rows-[0fr]"),
+		children: /* @__PURE__ */ r("div", {
+			className: e("overflow-hidden", n),
+			children: t
+		})
+	});
+}
+//#endregion
+export { l as Collapsible, d as CollapsibleContent, u as CollapsibleTrigger };
+
+//# sourceMappingURL=collapsible.js.map

package/dist/react/primitives/collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.js","names":[],"sources":["../../../src/react/primitives/collapsible.tsx"],"sourcesContent":["/**\n * Collapsible - Animated expand/collapse container\n *\n * Uses CSS grid for smooth height animation without JavaScript measurement.\n * Provides both controlled and uncontrolled modes.\n */\n\nimport { createContext, useContext, useState, type ReactNode } from 'react'\nimport { ChevronDown, ChevronUp } from 'lucide-react'\nimport { cn } from './utils'\n\ninterface CollapsibleContextValue {\n  isOpen: boolean\n  toggle: () => void\n}\n\nconst CollapsibleContext = createContext<CollapsibleContextValue | null>(null)\n\nfunction useCollapsible() {\n  const context = useContext(CollapsibleContext)\n  if (!context) {\n    throw new Error('Collapsible components must be used within a Collapsible')\n  }\n  return context\n}\n\ninterface CollapsibleProps {\n  children: ReactNode\n  defaultOpen?: boolean\n  open?: boolean\n  onOpenChange?: (open: boolean) => void\n  className?: string\n}\n\n/**\n * Root collapsible container\n */\nfunction Collapsible({\n  children,\n  defaultOpen = true,\n  open: controlledOpen,\n  onOpenChange,\n  className,\n}: CollapsibleProps) {\n  const [internalOpen, setInternalOpen] = useState(defaultOpen)\n\n  const isControlled = controlledOpen !== undefined\n  const isOpen = isControlled ? controlledOpen : internalOpen\n\n  const toggle = () => {\n    if (isControlled) {\n      onOpenChange?.(!controlledOpen)\n    } else {\n      setInternalOpen(prev => !prev)\n    }\n  }\n\n  return (\n    <CollapsibleContext.Provider value={{ isOpen, toggle }}>\n      <div className={className}>{children}</div>\n    </CollapsibleContext.Provider>\n  )\n}\n\ninterface CollapsibleTriggerProps {\n  children?: ReactNode\n  className?: string\n  showIcon?: boolean\n}\n\n/**\n * Button that toggles the collapsible\n */\nfunction CollapsibleTrigger({ children, className, showIcon = true }: CollapsibleTriggerProps) {\n  const { isOpen, toggle } = useCollapsible()\n\n  return (\n    <button\n      type=\"button\"\n      onClick={toggle}\n      className={cn(\n        'text-foreground-muted hover:bg-accent hover:text-foreground-secondary rounded-lg p-1.5 transition-colors',\n        className\n      )}\n      aria-expanded={isOpen}\n    >\n      {children ||\n        (showIcon &&\n          (isOpen ? <ChevronUp className=\"h-4 w-4\" /> : <ChevronDown className=\"h-4 w-4\" />))}\n    </button>\n  )\n}\n\ninterface CollapsibleContentProps {\n  children: ReactNode\n  className?: string\n}\n\n/**\n * Animated content container\n * Uses CSS grid trick for smooth height animation\n */\nfunction CollapsibleContent({ children, className }: CollapsibleContentProps) {\n  const { isOpen } = useCollapsible()\n\n  return (\n    <div\n      className={cn(\n        'grid transition-[grid-template-rows] duration-300 ease-out',\n        isOpen ? 'grid-rows-[1fr]' : 'grid-rows-[0fr]'\n      )}\n    >\n      <div className={cn('overflow-hidden', className)}>{children}</div>\n    </div>\n  )\n}\n\nexport { Collapsible, CollapsibleTrigger, CollapsibleContent }\n"],"mappings":";;;;;;AAgBA,IAAM,IAAqB,EAA8C,KAAK;AAE9E,SAAS,IAAiB;CACxB,IAAM,IAAU,EAAW,EAAmB;AAC9C,KAAI,CAAC,EACH,OAAU,MAAM,2DAA2D;AAE7E,QAAO;;AAcT,SAAS,EAAY,EACnB,aACA,iBAAc,IACd,MAAM,GACN,iBACA,gBACmB;CACnB,IAAM,CAAC,GAAc,KAAmB,EAAS,EAAY,EAEvD,IAAe,MAAmB,KAAA,GAClC,IAAS,IAAe,IAAiB;AAU/C,QACE,kBAAC,EAAmB,UAApB;EAA6B,OAAO;GAAE;GAAQ,cAT3B;AACnB,IAAI,IACF,IAAe,CAAC,EAAe,GAE/B,GAAgB,MAAQ,CAAC,EAAK;;GAKsB;YACpD,kBAAC,OAAD;GAAgB;GAAY;GAAe,CAAA;EACf,CAAA;;AAalC,SAAS,EAAmB,EAAE,aAAU,cAAW,cAAW,MAAiC;CAC7F,IAAM,EAAE,WAAQ,cAAW,GAAgB;AAE3C,QACE,kBAAC,UAAD;EACE,MAAK;EACL,SAAS;EACT,WAAW,EACT,4GACA,EACD;EACD,iBAAe;YAEd,KACE,KACW,EAAT,IAAU,IAAoC,GAArC,EAAW,WAAU,WAAY,CAAsC;EAC9E,CAAA;;AAab,SAAS,EAAmB,EAAE,aAAU,gBAAsC;CAC5E,IAAM,EAAE,cAAW,GAAgB;AAEnC,QACE,kBAAC,OAAD;EACE,WAAW,EACT,8DACA,IAAS,oBAAoB,kBAC9B;YAED,kBAAC,OAAD;GAAK,WAAW,EAAG,mBAAmB,EAAU;GAAG;GAAe,CAAA;EAC9D,CAAA"}

package/dist/react/primitives/color-picker.d.ts

@@ -0,0 +1,18 @@
+export type ColorFormat = 'hex' | 'rgb' | 'hsl';
+export interface ColorPickerProps {
+    /** Current color value (hex string) */
+    value?: string;
+    /** Output format */
+    format?: ColorFormat;
+    /** Show alpha/opacity slider */
+    showAlpha?: boolean;
+    /** Preset color swatches */
+    presets?: string[];
+    /** Additional class name */
+    className?: string;
+    /** Callback when color changes */
+    onChange?: (color: string) => void;
+}
+declare function ColorPicker({ value, format, showAlpha, presets, className, onChange, }: ColorPickerProps): import("react/jsx-runtime").JSX.Element;
+export { ColorPicker };
+//# sourceMappingURL=color-picker.d.ts.map

package/dist/react/primitives/color-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-picker.d.ts","sourceRoot":"","sources":["../../../src/react/primitives/color-picker.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,WAAW,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAA;AAE/C,MAAM,WAAW,gBAAgB;IAC/B,uCAAuC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oBAAoB;IACpB,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,gCAAgC;IAChC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,4BAA4B;IAC5B,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AA+ID,iBAAS,WAAW,CAAC,EACnB,KAAiB,EACjB,MAAc,EACd,SAAiB,EACjB,OAAO,EACP,SAAS,EACT,QAAQ,GACT,EAAE,gBAAgB,2CAkSlB;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/react/primitives/color-picker.js

@@ -0,0 +1,287 @@
+import { t as e } from "../../utils-B7XIe3qq.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import * as r from "react";
+//#region src/react/primitives/color-picker.tsx
+function i(e, t, n) {
+	return Math.max(t, Math.min(n, e));
+}
+function a(e) {
+	let t = e.replace(/^#/, "");
+	(t.length === 3 || t.length === 4) && (t = t.split("").map((e) => e + e).join(""));
+	let n = parseInt(t.slice(0, 2), 16), r = parseInt(t.slice(2, 4), 16), i = parseInt(t.slice(4, 6), 16), a = t.length === 8 ? parseInt(t.slice(6, 8), 16) / 255 : 1;
+	return {
+		r: isNaN(n) ? 0 : n,
+		g: isNaN(r) ? 0 : r,
+		b: isNaN(i) ? 0 : i,
+		a: isNaN(a) ? 1 : a
+	};
+}
+function o(e, t) {
+	let n = i(Math.round(e.r), 0, 255).toString(16).padStart(2, "0"), r = i(Math.round(e.g), 0, 255).toString(16).padStart(2, "0"), a = i(Math.round(e.b), 0, 255).toString(16).padStart(2, "0");
+	return t && e.a < 1 ? `#${n}${r}${a}${i(Math.round(e.a * 255), 0, 255).toString(16).padStart(2, "0")}` : `#${n}${r}${a}`;
+}
+function s(e) {
+	let t = e.r / 255, n = e.g / 255, r = e.b / 255, i = Math.max(t, n, r), a = Math.min(t, n, r), o = (i + a) / 2, s = 0, c = 0;
+	if (i !== a) {
+		let e = i - a;
+		c = o > .5 ? e / (2 - i - a) : e / (i + a), s = i === t ? ((n - r) / e + (n < r ? 6 : 0)) / 6 : i === n ? ((r - t) / e + 2) / 6 : ((t - n) / e + 4) / 6;
+	}
+	return {
+		h: s * 360,
+		s: c * 100,
+		l: o * 100,
+		a: e.a
+	};
+}
+function c(e) {
+	let t = e.r / 255, n = e.g / 255, r = e.b / 255, i = Math.max(t, n, r), a = i - Math.min(t, n, r), o = 0;
+	a !== 0 && (o = i === t ? ((n - r) / a + (n < r ? 6 : 0)) * 60 : i === n ? ((r - t) / a + 2) * 60 : ((t - n) / a + 4) * 60);
+	let s = i === 0 ? 0 : a / i;
+	return {
+		h: o,
+		s,
+		v: i
+	};
+}
+function l(e, t, n, r) {
+	let i = Math.floor(e / 60) % 6, a = e / 60 - Math.floor(e / 60), o = n * (1 - t), s = n * (1 - a * t), c = n * (1 - (1 - a) * t), l, u, d;
+	switch (i) {
+		case 0:
+			l = n, u = c, d = o;
+			break;
+		case 1:
+			l = s, u = n, d = o;
+			break;
+		case 2:
+			l = o, u = n, d = c;
+			break;
+		case 3:
+			l = o, u = s, d = n;
+			break;
+		case 4:
+			l = c, u = o, d = n;
+			break;
+		default:
+			l = n, u = o, d = s;
+			break;
+	}
+	return {
+		r: Math.round(l * 255),
+		g: Math.round(u * 255),
+		b: Math.round(d * 255),
+		a: r
+	};
+}
+function u(e, t, n) {
+	switch (t) {
+		case "rgb": return e.a < 1 ? `rgba(${Math.round(e.r)}, ${Math.round(e.g)}, ${Math.round(e.b)}, ${Math.round(e.a * 100) / 100})` : `rgb(${Math.round(e.r)}, ${Math.round(e.g)}, ${Math.round(e.b)})`;
+		case "hsl": {
+			let t = s(e);
+			return t.a < 1 ? `hsla(${Math.round(t.h)}, ${Math.round(t.s)}%, ${Math.round(t.l)}%, ${Math.round(t.a * 100) / 100})` : `hsl(${Math.round(t.h)}, ${Math.round(t.s)}%, ${Math.round(t.l)}%)`;
+		}
+		default: return o(e, n);
+	}
+}
+function d({ value: s = "#000000", format: d = "hex", showAlpha: f = !1, presets: p, className: m, onChange: h }) {
+	let [g, _] = r.useState(!1), v = r.useRef(null), y = r.useMemo(() => a(s), [s]), b = r.useMemo(() => c(y), [y]), [x, S] = r.useState(b.h), [C, w] = r.useState(b.s), [T, E] = r.useState(b.v), [D, O] = r.useState(y.a), [k, A] = r.useState(s);
+	r.useEffect(() => {
+		let e = a(s), t = c(e);
+		S(t.h), w(t.s), E(t.v), O(e.a), A(s);
+	}, [s]);
+	let j = r.useMemo(() => l(x, C, T, D), [
+		x,
+		C,
+		T,
+		D
+	]), M = r.useMemo(() => o(j, f), [j, f]);
+	function N(e) {
+		h?.(u(e, d, f));
+	}
+	r.useEffect(() => {
+		if (!g) return;
+		function e(e) {
+			v.current && !v.current.contains(e.target) && _(!1);
+		}
+		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+	}, [g]);
+	let P = r.useRef(null);
+	function F(e) {
+		if (!P.current) return;
+		let t = P.current.getBoundingClientRect(), n = i((e - t.left) / t.width, 0, 1) * 360;
+		S(n);
+		let r = l(n, C, T, D);
+		A(o(r, f)), N(r);
+	}
+	let I = r.useRef(null);
+	function L(e) {
+		if (!I.current) return;
+		let t = I.current.getBoundingClientRect(), n = i((e - t.left) / t.width, 0, 1);
+		O(n);
+		let r = l(x, C, T, n);
+		A(o(r, f)), N(r);
+	}
+	let R = r.useRef(null);
+	function z(e, t) {
+		if (!R.current) return;
+		let n = R.current.getBoundingClientRect(), r = i((e - n.left) / n.width, 0, 1), a = i(1 - (t - n.top) / n.height, 0, 1);
+		w(r), E(a);
+		let s = l(x, r, a, D);
+		A(o(s, f)), N(s);
+	}
+	function B(e) {
+		return (t) => {
+			t.preventDefault(), e(t.clientX, t.clientY);
+			function n(t) {
+				t.preventDefault(), e(t.clientX, t.clientY);
+			}
+			function r() {
+				document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", r);
+			}
+			document.addEventListener("mousemove", n), document.addEventListener("mouseup", r);
+		};
+	}
+	function V() {
+		let e = k.trim(), t = e.startsWith("#") ? e : `#${e}`;
+		if (/^#([0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(t)) {
+			let e = a(t), n = c(e);
+			S(n.h), w(n.s), E(n.v), O(e.a), N(e);
+		}
+	}
+	function H(e, t) {
+		let n = {
+			...j,
+			[e]: i(t, 0, 255)
+		}, r = c(n);
+		S(r.h), w(r.s), E(r.v), A(o(n, f)), N(n);
+	}
+	function U(e) {
+		let t = a(e), n = c(t);
+		S(n.h), w(n.s), E(n.v), O(t.a), A(e), N(t);
+	}
+	let W = o(l(x, 1, 1, 1), !1), G = e("border-border-glass bg-glass h-8 w-full rounded-lg border px-2 text-[12px] text-foreground", "outline-none transition-all duration-200 focus:border-primary focus:shadow-glow backdrop-blur-[20px]");
+	return /* @__PURE__ */ n("div", {
+		ref: v,
+		"data-slot": "color-picker",
+		className: e("relative inline-block", m),
+		children: [/* @__PURE__ */ t("button", {
+			type: "button",
+			"aria-label": "Open color picker",
+			"aria-expanded": g,
+			onClick: () => _((e) => !e),
+			className: e("h-10 w-10 rounded-xl border border-border-glass shadow-sm transition-all duration-200", "hover:shadow-glow focus:border-primary focus:shadow-glow focus:outline-none"),
+			style: { backgroundColor: M }
+		}), g && /* @__PURE__ */ n("div", {
+			className: e("absolute top-full left-0 z-50 mt-2 w-64 rounded-xl border border-border-glass bg-glass p-3 shadow-lg backdrop-blur-[20px]", "animate-in fade-in-0 zoom-in-95 slide-in-from-top-2"),
+			onClick: (e) => e.stopPropagation(),
+			children: [
+				/* @__PURE__ */ n("div", {
+					ref: R,
+					className: "relative mb-3 h-40 w-full cursor-crosshair overflow-hidden rounded-lg",
+					style: { backgroundColor: W },
+					onMouseDown: B((e, t) => z(e, t)),
+					children: [
+						/* @__PURE__ */ t("div", { className: "pointer-events-none absolute inset-0 bg-gradient-to-r from-white to-transparent" }),
+						/* @__PURE__ */ t("div", { className: "pointer-events-none absolute inset-0 bg-gradient-to-b from-transparent to-black" }),
+						/* @__PURE__ */ t("div", {
+							className: "pointer-events-none absolute h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow-sm",
+							style: {
+								left: `${C * 100}%`,
+								top: `${(1 - T) * 100}%`
+							}
+						})
+					]
+				}),
+				/* @__PURE__ */ t("div", {
+					ref: P,
+					className: "relative mb-2 h-3 w-full cursor-pointer rounded-full",
+					style: { background: "linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%)" },
+					onMouseDown: B((e) => F(e)),
+					children: /* @__PURE__ */ t("div", {
+						className: "pointer-events-none absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow-sm",
+						style: { left: `${x / 360 * 100}%` }
+					})
+				}),
+				f && /* @__PURE__ */ t("div", {
+					ref: I,
+					className: "relative mb-2 h-3 w-full cursor-pointer rounded-full",
+					style: { backgroundImage: `linear-gradient(to right, transparent, ${o({
+						...j,
+						a: 1
+					}, !1)}), repeating-conic-gradient(#ccc 0% 25%, #fff 0% 50%) 0 0 / 8px 8px` },
+					onMouseDown: B((e) => L(e)),
+					children: /* @__PURE__ */ t("div", {
+						className: "pointer-events-none absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow-sm",
+						style: { left: `${D * 100}%` }
+					})
+				}),
+				/* @__PURE__ */ n("div", {
+					className: "mt-3 grid grid-cols-4 gap-2",
+					children: [
+						/* @__PURE__ */ n("div", {
+							className: "col-span-1",
+							children: [/* @__PURE__ */ t("label", {
+								className: "mb-1 block text-[10px] font-medium text-foreground-muted",
+								children: "Hex"
+							}), /* @__PURE__ */ t("input", {
+								type: "text",
+								className: G,
+								value: k,
+								maxLength: 9,
+								onChange: (e) => A(e.target.value),
+								onBlur: V,
+								onKeyDown: (e) => e.key === "Enter" && V()
+							})]
+						}),
+						/* @__PURE__ */ n("div", { children: [/* @__PURE__ */ t("label", {
+							className: "mb-1 block text-[10px] font-medium text-foreground-muted",
+							children: "R"
+						}), /* @__PURE__ */ t("input", {
+							type: "number",
+							className: G,
+							min: 0,
+							max: 255,
+							value: Math.round(j.r),
+							onChange: (e) => H("r", parseInt(e.target.value, 10) || 0)
+						})] }),
+						/* @__PURE__ */ n("div", { children: [/* @__PURE__ */ t("label", {
+							className: "mb-1 block text-[10px] font-medium text-foreground-muted",
+							children: "G"
+						}), /* @__PURE__ */ t("input", {
+							type: "number",
+							className: G,
+							min: 0,
+							max: 255,
+							value: Math.round(j.g),
+							onChange: (e) => H("g", parseInt(e.target.value, 10) || 0)
+						})] }),
+						/* @__PURE__ */ n("div", { children: [/* @__PURE__ */ t("label", {
+							className: "mb-1 block text-[10px] font-medium text-foreground-muted",
+							children: "B"
+						}), /* @__PURE__ */ t("input", {
+							type: "number",
+							className: G,
+							min: 0,
+							max: 255,
+							value: Math.round(j.b),
+							onChange: (e) => H("b", parseInt(e.target.value, 10) || 0)
+						})] })
+					]
+				}),
+				p && p.length > 0 && /* @__PURE__ */ t("div", {
+					className: "mt-3 flex flex-wrap gap-1.5",
+					children: p.map((e) => /* @__PURE__ */ t("button", {
+						type: "button",
+						"aria-label": `Select color ${e}`,
+						className: "h-6 w-6 rounded-md border border-border-glass transition-all duration-200 hover:scale-110 hover:shadow-glow",
+						style: { backgroundColor: e },
+						onClick: () => U(e)
+					}, e))
+				})
+			]
+		})]
+	});
+}
+//#endregion
+export { d as ColorPicker };
+
+//# sourceMappingURL=color-picker.js.map

package/dist/react/primitives/color-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-picker.js","names":[],"sources":["../../../src/react/primitives/color-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from './utils'\n\nexport type ColorFormat = 'hex' | 'rgb' | 'hsl'\n\nexport interface ColorPickerProps {\n  /** Current color value (hex string) */\n  value?: string\n  /** Output format */\n  format?: ColorFormat\n  /** Show alpha/opacity slider */\n  showAlpha?: boolean\n  /** Preset color swatches */\n  presets?: string[]\n  /** Additional class name */\n  className?: string\n  /** Callback when color changes */\n  onChange?: (color: string) => void\n}\n\ninterface RGBA {\n  r: number\n  g: number\n  b: number\n  a: number\n}\n\nfunction clamp(value: number, min: number, max: number): number {\n  return Math.max(min, Math.min(max, value))\n}\n\nfunction hexToRgba(hex: string): RGBA {\n  let h = hex.replace(/^#/, '')\n  if (h.length === 3 || h.length === 4) {\n    h = h\n      .split('')\n      .map(c => c + c)\n      .join('')\n  }\n  const r = parseInt(h.slice(0, 2), 16)\n  const g = parseInt(h.slice(2, 4), 16)\n  const b = parseInt(h.slice(4, 6), 16)\n  const a = h.length === 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1\n  return {\n    r: isNaN(r) ? 0 : r,\n    g: isNaN(g) ? 0 : g,\n    b: isNaN(b) ? 0 : b,\n    a: isNaN(a) ? 1 : a,\n  }\n}\n\nfunction rgbaToHex(rgba: RGBA, includeAlpha: boolean): string {\n  const r = clamp(Math.round(rgba.r), 0, 255).toString(16).padStart(2, '0')\n  const g = clamp(Math.round(rgba.g), 0, 255).toString(16).padStart(2, '0')\n  const b = clamp(Math.round(rgba.b), 0, 255).toString(16).padStart(2, '0')\n  if (includeAlpha && rgba.a < 1) {\n    const a = clamp(Math.round(rgba.a * 255), 0, 255)\n      .toString(16)\n      .padStart(2, '0')\n    return `#${r}${g}${b}${a}`\n  }\n  return `#${r}${g}${b}`\n}\n\nfunction rgbaToHsla(rgba: RGBA): { h: number; s: number; l: number; a: number } {\n  const r = rgba.r / 255\n  const g = rgba.g / 255\n  const b = rgba.b / 255\n  const max = Math.max(r, g, b)\n  const min = Math.min(r, g, b)\n  const l = (max + min) / 2\n  let h = 0\n  let s = 0\n  if (max !== min) {\n    const d = max - min\n    s = l > 0.5 ? d / (2 - max - min) : d / (max + min)\n    if (max === r) h = ((g - b) / d + (g < b ? 6 : 0)) / 6\n    else if (max === g) h = ((b - r) / d + 2) / 6\n    else h = ((r - g) / d + 4) / 6\n  }\n  return { h: h * 360, s: s * 100, l: l * 100, a: rgba.a }\n}\n\nfunction rgbaToHsv(rgba: RGBA): { h: number; s: number; v: number } {\n  const r = rgba.r / 255\n  const g = rgba.g / 255\n  const b = rgba.b / 255\n  const max = Math.max(r, g, b)\n  const min = Math.min(r, g, b)\n  const d = max - min\n  let h = 0\n  if (d !== 0) {\n    if (max === r) h = ((g - b) / d + (g < b ? 6 : 0)) * 60\n    else if (max === g) h = ((b - r) / d + 2) * 60\n    else h = ((r - g) / d + 4) * 60\n  }\n  const s = max === 0 ? 0 : d / max\n  return { h, s, v: max }\n}\n\nfunction hsvToRgba(h: number, s: number, v: number, a: number): RGBA {\n  const i = Math.floor(h / 60) % 6\n  const f = h / 60 - Math.floor(h / 60)\n  const p = v * (1 - s)\n  const q = v * (1 - f * s)\n  const t = v * (1 - (1 - f) * s)\n  let r: number, g: number, b: number\n  switch (i) {\n    case 0:\n      r = v\n      g = t\n      b = p\n      break\n    case 1:\n      r = q\n      g = v\n      b = p\n      break\n    case 2:\n      r = p\n      g = v\n      b = t\n      break\n    case 3:\n      r = p\n      g = q\n      b = v\n      break\n    case 4:\n      r = t\n      g = p\n      b = v\n      break\n    default:\n      r = v\n      g = p\n      b = q\n      break\n  }\n  return { r: Math.round(r * 255), g: Math.round(g * 255), b: Math.round(b * 255), a }\n}\n\nfunction formatOutput(rgba: RGBA, format: ColorFormat, showAlpha: boolean): string {\n  switch (format) {\n    case 'rgb': {\n      if (rgba.a < 1)\n        return `rgba(${Math.round(rgba.r)}, ${Math.round(rgba.g)}, ${Math.round(rgba.b)}, ${Math.round(rgba.a * 100) / 100})`\n      return `rgb(${Math.round(rgba.r)}, ${Math.round(rgba.g)}, ${Math.round(rgba.b)})`\n    }\n    case 'hsl': {\n      const hsla = rgbaToHsla(rgba)\n      if (hsla.a < 1)\n        return `hsla(${Math.round(hsla.h)}, ${Math.round(hsla.s)}%, ${Math.round(hsla.l)}%, ${Math.round(hsla.a * 100) / 100})`\n      return `hsl(${Math.round(hsla.h)}, ${Math.round(hsla.s)}%, ${Math.round(hsla.l)}%)`\n    }\n    case 'hex':\n    default:\n      return rgbaToHex(rgba, showAlpha)\n  }\n}\n\nfunction ColorPicker({\n  value = '#000000',\n  format = 'hex',\n  showAlpha = false,\n  presets,\n  className,\n  onChange,\n}: ColorPickerProps) {\n  const [isOpen, setIsOpen] = React.useState(false)\n  const rootRef = React.useRef<HTMLDivElement>(null)\n\n  const initialRgba = React.useMemo(() => hexToRgba(value), [value])\n  const initialHsv = React.useMemo(() => rgbaToHsv(initialRgba), [initialRgba])\n\n  const [hue, setHue] = React.useState(initialHsv.h)\n  const [saturation, setSaturation] = React.useState(initialHsv.s)\n  const [brightness, setBrightness] = React.useState(initialHsv.v)\n  const [alpha, setAlpha] = React.useState(initialRgba.a)\n  const [hexInput, setHexInput] = React.useState(value)\n\n  // Sync from external value prop\n  React.useEffect(() => {\n    const rgba = hexToRgba(value)\n    const hsv = rgbaToHsv(rgba)\n    setHue(hsv.h)\n    setSaturation(hsv.s)\n    setBrightness(hsv.v)\n    setAlpha(rgba.a)\n    setHexInput(value)\n  }, [value])\n\n  const rgba = React.useMemo(\n    () => hsvToRgba(hue, saturation, brightness, alpha),\n    [hue, saturation, brightness, alpha]\n  )\n\n  const currentHex = React.useMemo(() => rgbaToHex(rgba, showAlpha), [rgba, showAlpha])\n\n  function emitChange(r: RGBA) {\n    onChange?.(formatOutput(r, format, showAlpha))\n  }\n\n  // Close on outside click\n  React.useEffect(() => {\n    if (!isOpen) return\n    function handleClick(e: MouseEvent) {\n      if (rootRef.current && !rootRef.current.contains(e.target as Node)) {\n        setIsOpen(false)\n      }\n    }\n    document.addEventListener('mousedown', handleClick)\n    return () => document.removeEventListener('mousedown', handleClick)\n  }, [isOpen])\n\n  // Hue slider\n  const hueRef = React.useRef<HTMLDivElement>(null)\n  function handleHueInteraction(clientX: number) {\n    if (!hueRef.current) return\n    const rect = hueRef.current.getBoundingClientRect()\n    const x = clamp((clientX - rect.left) / rect.width, 0, 1)\n    const newHue = x * 360\n    setHue(newHue)\n    const newRgba = hsvToRgba(newHue, saturation, brightness, alpha)\n    setHexInput(rgbaToHex(newRgba, showAlpha))\n    emitChange(newRgba)\n  }\n\n  // Alpha slider\n  const alphaRef = React.useRef<HTMLDivElement>(null)\n  function handleAlphaInteraction(clientX: number) {\n    if (!alphaRef.current) return\n    const rect = alphaRef.current.getBoundingClientRect()\n    const x = clamp((clientX - rect.left) / rect.width, 0, 1)\n    setAlpha(x)\n    const newRgba = hsvToRgba(hue, saturation, brightness, x)\n    setHexInput(rgbaToHex(newRgba, showAlpha))\n    emitChange(newRgba)\n  }\n\n  // Saturation/brightness area\n  const satRef = React.useRef<HTMLDivElement>(null)\n  function handleSatInteraction(clientX: number, clientY: number) {\n    if (!satRef.current) return\n    const rect = satRef.current.getBoundingClientRect()\n    const s = clamp((clientX - rect.left) / rect.width, 0, 1)\n    const b = clamp(1 - (clientY - rect.top) / rect.height, 0, 1)\n    setSaturation(s)\n    setBrightness(b)\n    const newRgba = hsvToRgba(hue, s, b, alpha)\n    setHexInput(rgbaToHex(newRgba, showAlpha))\n    emitChange(newRgba)\n  }\n\n  function makeDragHandler(handler: (clientX: number, clientY: number) => void) {\n    return (e: React.MouseEvent) => {\n      e.preventDefault()\n      handler(e.clientX, e.clientY)\n      function onMove(ev: MouseEvent) {\n        ev.preventDefault()\n        handler(ev.clientX, ev.clientY)\n      }\n      function onUp() {\n        document.removeEventListener('mousemove', onMove)\n        document.removeEventListener('mouseup', onUp)\n      }\n      document.addEventListener('mousemove', onMove)\n      document.addEventListener('mouseup', onUp)\n    }\n  }\n\n  function handleHexCommit() {\n    const val = hexInput.trim()\n    const normalized = val.startsWith('#') ? val : `#${val}`\n    if (/^#([0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(normalized)) {\n      const newRgba = hexToRgba(normalized)\n      const hsv = rgbaToHsv(newRgba)\n      setHue(hsv.h)\n      setSaturation(hsv.s)\n      setBrightness(hsv.v)\n      setAlpha(newRgba.a)\n      emitChange(newRgba)\n    }\n  }\n\n  function handleRgbChange(channel: 'r' | 'g' | 'b', val: number) {\n    const newRgba = { ...rgba, [channel]: clamp(val, 0, 255) }\n    const hsv = rgbaToHsv(newRgba)\n    setHue(hsv.h)\n    setSaturation(hsv.s)\n    setBrightness(hsv.v)\n    setHexInput(rgbaToHex(newRgba, showAlpha))\n    emitChange(newRgba)\n  }\n\n  function selectPreset(color: string) {\n    const newRgba = hexToRgba(color)\n    const hsv = rgbaToHsv(newRgba)\n    setHue(hsv.h)\n    setSaturation(hsv.s)\n    setBrightness(hsv.v)\n    setAlpha(newRgba.a)\n    setHexInput(color)\n    emitChange(newRgba)\n  }\n\n  const baseHueHex = rgbaToHex(hsvToRgba(hue, 1, 1, 1), false)\n\n  const inputClass = cn(\n    'border-border-glass bg-glass h-8 w-full rounded-lg border px-2 text-[12px] text-foreground',\n    'outline-none transition-all duration-200 focus:border-primary focus:shadow-glow backdrop-blur-[20px]'\n  )\n\n  return (\n    <div ref={rootRef} data-slot=\"color-picker\" className={cn('relative inline-block', className)}>\n      {/* Swatch trigger */}\n      <button\n        type=\"button\"\n        aria-label=\"Open color picker\"\n        aria-expanded={isOpen}\n        onClick={() => setIsOpen(o => !o)}\n        className={cn(\n          'h-10 w-10 rounded-xl border border-border-glass shadow-sm transition-all duration-200',\n          'hover:shadow-glow focus:border-primary focus:shadow-glow focus:outline-none'\n        )}\n        style={{ backgroundColor: currentHex }}\n      />\n\n      {/* Popover panel */}\n      {isOpen && (\n        <div\n          className={cn(\n            'absolute top-full left-0 z-50 mt-2 w-64 rounded-xl border border-border-glass bg-glass p-3 shadow-lg backdrop-blur-[20px]',\n            'animate-in fade-in-0 zoom-in-95 slide-in-from-top-2'\n          )}\n          onClick={e => e.stopPropagation()}\n        >\n          {/* Saturation/Brightness area */}\n          <div\n            ref={satRef}\n            className=\"relative mb-3 h-40 w-full cursor-crosshair overflow-hidden rounded-lg\"\n            style={{ backgroundColor: baseHueHex }}\n            onMouseDown={makeDragHandler((x, y) => handleSatInteraction(x, y))}\n          >\n            <div className=\"pointer-events-none absolute inset-0 bg-gradient-to-r from-white to-transparent\" />\n            <div className=\"pointer-events-none absolute inset-0 bg-gradient-to-b from-transparent to-black\" />\n            <div\n              className=\"pointer-events-none absolute h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow-sm\"\n              style={{\n                left: `${saturation * 100}%`,\n                top: `${(1 - brightness) * 100}%`,\n              }}\n            />\n          </div>\n\n          {/* Hue slider */}\n          <div\n            ref={hueRef}\n            className=\"relative mb-2 h-3 w-full cursor-pointer rounded-full\"\n            style={{\n              background:\n                'linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%)',\n            }}\n            onMouseDown={makeDragHandler(x => handleHueInteraction(x))}\n          >\n            <div\n              className=\"pointer-events-none absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow-sm\"\n              style={{ left: `${(hue / 360) * 100}%` }}\n            />\n          </div>\n\n          {/* Alpha slider */}\n          {showAlpha && (\n            <div\n              ref={alphaRef}\n              className=\"relative mb-2 h-3 w-full cursor-pointer rounded-full\"\n              style={{\n                backgroundImage: `linear-gradient(to right, transparent, ${rgbaToHex({ ...rgba, a: 1 }, false)}), repeating-conic-gradient(#ccc 0% 25%, #fff 0% 50%) 0 0 / 8px 8px`,\n              }}\n              onMouseDown={makeDragHandler(x => handleAlphaInteraction(x))}\n            >\n              <div\n                className=\"pointer-events-none absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border-2 border-white shadow-sm\"\n                style={{ left: `${alpha * 100}%` }}\n              />\n            </div>\n          )}\n\n          {/* Input fields */}\n          <div className=\"mt-3 grid grid-cols-4 gap-2\">\n            <div className=\"col-span-1\">\n              <label className=\"mb-1 block text-[10px] font-medium text-foreground-muted\">\n                Hex\n              </label>\n              <input\n                type=\"text\"\n                className={inputClass}\n                value={hexInput}\n                maxLength={9}\n                onChange={e => setHexInput(e.target.value)}\n                onBlur={handleHexCommit}\n                onKeyDown={e => e.key === 'Enter' && handleHexCommit()}\n              />\n            </div>\n            <div>\n              <label className=\"mb-1 block text-[10px] font-medium text-foreground-muted\">R</label>\n              <input\n                type=\"number\"\n                className={inputClass}\n                min={0}\n                max={255}\n                value={Math.round(rgba.r)}\n                onChange={e => handleRgbChange('r', parseInt(e.target.value, 10) || 0)}\n              />\n            </div>\n            <div>\n              <label className=\"mb-1 block text-[10px] font-medium text-foreground-muted\">G</label>\n              <input\n                type=\"number\"\n                className={inputClass}\n                min={0}\n                max={255}\n                value={Math.round(rgba.g)}\n                onChange={e => handleRgbChange('g', parseInt(e.target.value, 10) || 0)}\n              />\n            </div>\n            <div>\n              <label className=\"mb-1 block text-[10px] font-medium text-foreground-muted\">B</label>\n              <input\n                type=\"number\"\n                className={inputClass}\n                min={0}\n                max={255}\n                value={Math.round(rgba.b)}\n                onChange={e => handleRgbChange('b', parseInt(e.target.value, 10) || 0)}\n              />\n            </div>\n          </div>\n\n          {/* Presets */}\n          {presets && presets.length > 0 && (\n            <div className=\"mt-3 flex flex-wrap gap-1.5\">\n              {presets.map(preset => (\n                <button\n                  key={preset}\n                  type=\"button\"\n                  aria-label={`Select color ${preset}`}\n                  className=\"h-6 w-6 rounded-md border border-border-glass transition-all duration-200 hover:scale-110 hover:shadow-glow\"\n                  style={{ backgroundColor: preset }}\n                  onClick={() => selectPreset(preset)}\n                />\n              ))}\n            </div>\n          )}\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport { ColorPicker }\n"],"mappings":"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"}

package/dist/react/primitives/context-menu.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+interface ContextMenuProps {
+    children: React.ReactNode;
+    onOpenChange?: (open: boolean) => void;
+}
+interface ContextMenuTriggerProps extends React.ComponentProps<'div'> {
+    asChild?: boolean;
+}
+interface ContextMenuContentProps extends React.ComponentProps<'div'> {
+    /** Offset in px from the pointer position */
+    alignOffset?: number;
+}
+declare function ContextMenu({ children, onOpenChange }: ContextMenuProps): import("react/jsx-runtime").JSX.Element;
+declare function ContextMenuTrigger({ className, children, ...props }: ContextMenuTriggerProps): import("react/jsx-runtime").JSX.Element;
+declare function ContextMenuContent({ className, children, ...props }: ContextMenuContentProps): import("react/jsx-runtime").JSX.Element | null;
+declare function ContextMenuItem({ className, disabled, onSelect, children, ...props }: React.ComponentProps<'div'> & {
+    disabled?: boolean;
+    onSelect?: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+declare function ContextMenuSeparator({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function ContextMenuLabel({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function ContextMenuShortcut({ className, ...props }: React.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+export { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem, ContextMenuSeparator, ContextMenuLabel, ContextMenuShortcut, };
+//# sourceMappingURL=context-menu.d.ts.map

package/dist/react/primitives/context-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.d.ts","sourceRoot":"","sources":["../../../src/react/primitives/context-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,UAAU,gBAAgB;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;CACvC;AAED,UAAU,uBAAwB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACnE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,UAAU,uBAAwB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACnE,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AA2BD,iBAAS,WAAW,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,EAAE,gBAAgB,2CAkBhE;AAMD,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,uBAAuB,2CAsBrF;AAMD,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,uBAAuB,kDAmErF;AAMD,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CACtB,2CA0BA;AAMD,iBAAS,oBAAoB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CASjF;AAMD,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7E;AAMD,iBAAS,mBAAmB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,2CAQjF;AAED,OAAO,EACL,WAAW,EACX,kBAAkB,EAClB,kBAAkB,EAClB,eAAe,EACf,oBAAoB,EACpB,gBAAgB,EAChB,mBAAmB,GACpB,CAAA"}

package/dist/react/primitives/context-menu.js

@@ -0,0 +1,127 @@
+import { t as e } from "../../utils-B7XIe3qq.js";
+import { jsx as t } from "react/jsx-runtime";
+import * as n from "react";
+//#region src/react/primitives/context-menu.tsx
+var r = n.createContext(null);
+function i() {
+	let e = n.useContext(r);
+	if (!e) throw Error("ContextMenu compound components must be used within <ContextMenu>");
+	return e;
+}
+function a({ children: e, onOpenChange: i }) {
+	let [a, o] = n.useState(!1), [s, c] = n.useState({
+		x: 0,
+		y: 0
+	}), l = n.useCallback((e) => {
+		o(e), i?.(e);
+	}, [i]), u = n.useMemo(() => ({
+		open: a,
+		position: s,
+		setOpen: l,
+		setPosition: c
+	}), [
+		a,
+		s,
+		l
+	]);
+	return /* @__PURE__ */ t(r.Provider, {
+		value: u,
+		children: e
+	});
+}
+function o({ className: e, children: r, ...a }) {
+	let o = i(), s = n.useCallback((e) => {
+		e.preventDefault(), o.setPosition({
+			x: e.clientX,
+			y: e.clientY
+		}), o.setOpen(!0);
+	}, [o]);
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "context-menu-trigger",
+		className: e,
+		onContextMenu: s,
+		...a,
+		children: r
+	});
+}
+function s({ className: r, children: a, ...o }) {
+	let s = i(), c = n.useRef(null);
+	n.useEffect(() => {
+		if (!s.open) return;
+		let e = (e) => {
+			c.current && !c.current.contains(e.target) && s.setOpen(!1);
+		}, t = (e) => {
+			e.key === "Escape" && s.setOpen(!1);
+		};
+		return document.addEventListener("click", e, !0), document.addEventListener("keydown", t), () => {
+			document.removeEventListener("click", e, !0), document.removeEventListener("keydown", t);
+		};
+	}, [s, s.open]);
+	let [l, u] = n.useState(s.position);
+	return n.useEffect(() => {
+		if (!s.open || !c.current) {
+			u(s.position);
+			return;
+		}
+		let e = c.current.getBoundingClientRect(), t = s.position.x, n = s.position.y;
+		t + e.width > window.innerWidth && (t = window.innerWidth - e.width - 4), n + e.height > window.innerHeight && (n = window.innerHeight - e.height - 4), t < 0 && (t = 4), n < 0 && (n = 4), u({
+			x: t,
+			y: n
+		});
+	}, [s.open, s.position]), s.open ? /* @__PURE__ */ t("div", {
+		ref: c,
+		"data-slot": "context-menu-content",
+		role: "menu",
+		className: e("fixed z-50 min-w-[10rem] overflow-hidden rounded-xl border p-1 shadow-xl", "border-border-glass bg-popover backdrop-blur-xl", "animate-in fade-in-0 zoom-in-95", r),
+		style: {
+			left: l.x,
+			top: l.y
+		},
+		...o,
+		children: a
+	}) : null;
+}
+function c({ className: r, disabled: a, onSelect: o, children: s, ...c }) {
+	let l = i(), u = n.useCallback(() => {
+		a !== !0 && (o?.(), l.setOpen(!1));
+	}, [
+		l,
+		a,
+		o
+	]);
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "context-menu-item",
+		role: "menuitem",
+		"aria-disabled": a === !0 ? !0 : void 0,
+		className: e("relative flex cursor-pointer items-center rounded-lg px-3 py-2 text-sm transition-colors outline-none select-none", "text-foreground hover:bg-accent focus:bg-accent", a === !0 && "pointer-events-none opacity-50", r),
+		onClick: u,
+		...c,
+		children: s
+	});
+}
+function l({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "context-menu-separator",
+		role: "separator",
+		className: e("bg-border-glass my-1 h-px", n),
+		...r
+	});
+}
+function u({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "context-menu-label",
+		className: e("text-foreground-muted px-3 py-1.5 text-xs font-semibold", n),
+		...r
+	});
+}
+function d({ className: n, ...r }) {
+	return /* @__PURE__ */ t("span", {
+		"data-slot": "context-menu-shortcut",
+		className: e("text-foreground-muted ml-auto pl-4 text-xs tracking-widest", n),
+		...r
+	});
+}
+//#endregion
+export { a as ContextMenu, s as ContextMenuContent, c as ContextMenuItem, u as ContextMenuLabel, l as ContextMenuSeparator, d as ContextMenuShortcut, o as ContextMenuTrigger };
+
+//# sourceMappingURL=context-menu.js.map

package/dist/react/primitives/context-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.js","names":[],"sources":["../../../src/react/primitives/context-menu.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from './utils'\n\n/* ------------------------------------------------------------------ */\n/* Types                                                               */\n/* ------------------------------------------------------------------ */\n\ninterface ContextMenuProps {\n  children: React.ReactNode\n  onOpenChange?: (open: boolean) => void\n}\n\ninterface ContextMenuTriggerProps extends React.ComponentProps<'div'> {\n  asChild?: boolean\n}\n\ninterface ContextMenuContentProps extends React.ComponentProps<'div'> {\n  /** Offset in px from the pointer position */\n  alignOffset?: number\n}\n\n/* ------------------------------------------------------------------ */\n/* Context                                                             */\n/* ------------------------------------------------------------------ */\n\ninterface ContextMenuContext {\n  open: boolean\n  position: { x: number; y: number }\n  setOpen: (open: boolean) => void\n  setPosition: (pos: { x: number; y: number }) => void\n}\n\nconst ContextMenuCtx = React.createContext<ContextMenuContext | null>(null)\n\nfunction useContextMenuContext() {\n  const ctx = React.useContext(ContextMenuCtx)\n  if (!ctx) {\n    throw new Error('ContextMenu compound components must be used within <ContextMenu>')\n  }\n  return ctx\n}\n\n/* ------------------------------------------------------------------ */\n/* Root                                                                */\n/* ------------------------------------------------------------------ */\n\nfunction ContextMenu({ children, onOpenChange }: ContextMenuProps) {\n  const [open, setOpenState] = React.useState(false)\n  const [position, setPosition] = React.useState({ x: 0, y: 0 })\n\n  const setOpen = React.useCallback(\n    (value: boolean) => {\n      setOpenState(value)\n      onOpenChange?.(value)\n    },\n    [onOpenChange]\n  )\n\n  const value = React.useMemo(\n    () => ({ open, position, setOpen, setPosition }),\n    [open, position, setOpen]\n  )\n\n  return <ContextMenuCtx.Provider value={value}>{children}</ContextMenuCtx.Provider>\n}\n\n/* ------------------------------------------------------------------ */\n/* Trigger                                                             */\n/* ------------------------------------------------------------------ */\n\nfunction ContextMenuTrigger({ className, children, ...props }: ContextMenuTriggerProps) {\n  const ctx = useContextMenuContext()\n\n  const handleContextMenu = React.useCallback(\n    (e: React.MouseEvent) => {\n      e.preventDefault()\n      ctx.setPosition({ x: e.clientX, y: e.clientY })\n      ctx.setOpen(true)\n    },\n    [ctx]\n  )\n\n  return (\n    <div\n      data-slot=\"context-menu-trigger\"\n      className={className}\n      onContextMenu={handleContextMenu}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n\n/* ------------------------------------------------------------------ */\n/* Content                                                             */\n/* ------------------------------------------------------------------ */\n\nfunction ContextMenuContent({ className, children, ...props }: ContextMenuContentProps) {\n  const ctx = useContextMenuContext()\n  const contentRef = React.useRef<HTMLDivElement>(null)\n\n  // Close on outside click or Escape\n  React.useEffect(() => {\n    if (!ctx.open) return\n\n    const handleClick = (e: MouseEvent) => {\n      if (contentRef.current && !contentRef.current.contains(e.target as Node)) {\n        ctx.setOpen(false)\n      }\n    }\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        ctx.setOpen(false)\n      }\n    }\n\n    document.addEventListener('click', handleClick, true)\n    document.addEventListener('keydown', handleKeyDown)\n    return () => {\n      document.removeEventListener('click', handleClick, true)\n      document.removeEventListener('keydown', handleKeyDown)\n    }\n  }, [ctx, ctx.open])\n\n  // Adjust position to stay within viewport\n  const [adjusted, setAdjusted] = React.useState(ctx.position)\n  React.useEffect(() => {\n    if (!ctx.open || !contentRef.current) {\n      setAdjusted(ctx.position)\n      return\n    }\n\n    const rect = contentRef.current.getBoundingClientRect()\n    let x = ctx.position.x\n    let y = ctx.position.y\n\n    if (x + rect.width > window.innerWidth) x = window.innerWidth - rect.width - 4\n    if (y + rect.height > window.innerHeight) y = window.innerHeight - rect.height - 4\n    if (x < 0) x = 4\n    if (y < 0) y = 4\n\n    setAdjusted({ x, y })\n  }, [ctx.open, ctx.position])\n\n  if (!ctx.open) return null\n\n  return (\n    <div\n      ref={contentRef}\n      data-slot=\"context-menu-content\"\n      role=\"menu\"\n      className={cn(\n        'fixed z-50 min-w-[10rem] overflow-hidden rounded-xl border p-1 shadow-xl',\n        'border-border-glass bg-popover backdrop-blur-xl',\n        'animate-in fade-in-0 zoom-in-95',\n        className\n      )}\n      style={{ left: adjusted.x, top: adjusted.y }}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n\n/* ------------------------------------------------------------------ */\n/* Item                                                                */\n/* ------------------------------------------------------------------ */\n\nfunction ContextMenuItem({\n  className,\n  disabled,\n  onSelect,\n  children,\n  ...props\n}: React.ComponentProps<'div'> & {\n  disabled?: boolean\n  onSelect?: () => void\n}) {\n  const ctx = useContextMenuContext()\n\n  const handleClick = React.useCallback(() => {\n    if (disabled === true) return\n    onSelect?.()\n    ctx.setOpen(false)\n  }, [ctx, disabled, onSelect])\n\n  return (\n    <div\n      data-slot=\"context-menu-item\"\n      role=\"menuitem\"\n      aria-disabled={disabled === true ? true : undefined}\n      className={cn(\n        'relative flex cursor-pointer items-center rounded-lg px-3 py-2 text-sm transition-colors outline-none select-none',\n        'text-foreground hover:bg-accent focus:bg-accent',\n        disabled === true && 'pointer-events-none opacity-50',\n        className\n      )}\n      onClick={handleClick}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n\n/* ------------------------------------------------------------------ */\n/* Separator                                                           */\n/* ------------------------------------------------------------------ */\n\nfunction ContextMenuSeparator({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"context-menu-separator\"\n      role=\"separator\"\n      className={cn('bg-border-glass my-1 h-px', className)}\n      {...props}\n    />\n  )\n}\n\n/* ------------------------------------------------------------------ */\n/* Label                                                               */\n/* ------------------------------------------------------------------ */\n\nfunction ContextMenuLabel({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"context-menu-label\"\n      className={cn('text-foreground-muted px-3 py-1.5 text-xs font-semibold', className)}\n      {...props}\n    />\n  )\n}\n\n/* ------------------------------------------------------------------ */\n/* Shortcut                                                            */\n/* ------------------------------------------------------------------ */\n\nfunction ContextMenuShortcut({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"context-menu-shortcut\"\n      className={cn('text-foreground-muted ml-auto pl-4 text-xs tracking-widest', className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  ContextMenu,\n  ContextMenuTrigger,\n  ContextMenuContent,\n  ContextMenuItem,\n  ContextMenuSeparator,\n  ContextMenuLabel,\n  ContextMenuShortcut,\n}\n"],"mappings":"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"}

package/dist/react/primitives/copy-button.d.ts

@@ -0,0 +1,23 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const copyButtonVariants: (props?: ({
+    variant?: "default" | "ghost" | null | undefined;
+    size?: "default" | "sm" | "icon" | "icon-sm" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface CopyButtonProps extends Omit<React.ComponentProps<'button'>, 'children'>, VariantProps<typeof copyButtonVariants> {
+    /** The text to copy to clipboard */
+    value: string;
+    /** Label shown before copying */
+    label?: string;
+    /** Label shown after copying */
+    copiedLabel?: string;
+    /** Duration in ms to show the copied state */
+    copiedDuration?: number;
+    /** Callback fired after successful copy */
+    onCopy?: () => void;
+    /** When true, renders only the icon without text */
+    iconOnly?: boolean;
+}
+declare function CopyButton({ className, variant, size, value, label, copiedLabel, copiedDuration, onCopy, iconOnly, ...props }: CopyButtonProps): import("react/jsx-runtime").JSX.Element;
+export { CopyButton, copyButtonVariants };
+//# sourceMappingURL=copy-button.d.ts.map

package/dist/react/primitives/copy-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"copy-button.d.ts","sourceRoot":"","sources":["../../../src/react/primitives/copy-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAKjE,QAAA,MAAM,kBAAkB;;;8EAqBvB,CAAA;AAED,MAAM,WAAW,eACf,SACE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,EAChD,YAAY,CAAC,OAAO,kBAAkB,CAAC;IACzC,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAA;IACb,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,gCAAgC;IAChC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,8CAA8C;IAC9C,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,2CAA2C;IAC3C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,oDAAoD;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,OAAO,EACP,IAAI,EACJ,KAAK,EACL,KAAc,EACd,WAAuB,EACvB,cAAqB,EACrB,MAAM,EACN,QAAgB,EAChB,GAAG,KAAK,EACT,EAAE,eAAe,2CAuDjB;AAED,OAAO,EAAE,UAAU,EAAE,kBAAkB,EAAE,CAAA"}