@spatika/react 1.0.0 → 1.2.0

package/dist/lib/webgl-scatter.js

@@ -0,0 +1,185 @@
+/**
+ * Raw WebGL scatter renderer — no three.js.
+ * Canvas sits behind SVG axes; hit-testing stays on the CPU.
+ */
+export const WEBGL_AUTO_THRESHOLD = 2000;
+export function shouldUseWebGL(renderer, pointCount) {
+    if (renderer === "webgl")
+        return true;
+    if (renderer === "auto")
+        return pointCount >= WEBGL_AUTO_THRESHOLD;
+    return false;
+}
+export function parseCssColor(css) {
+    const hex = css.trim();
+    const hexMatch = /^#([0-9a-f]{3,8})$/i.exec(hex);
+    if (hexMatch) {
+        let h = hexMatch[1];
+        if (h.length === 3 || h.length === 4)
+            h = [...h].map((c) => c + c).join("");
+        const n = Number.parseInt(h.slice(0, 6), 16);
+        const a = h.length === 8 ? Number.parseInt(h.slice(6, 8), 16) / 255 : 1;
+        return [((n >> 16) & 255) / 255, ((n >> 8) & 255) / 255, (n & 255) / 255, a];
+    }
+    const rgb = /^rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)(?:\s*,\s*([\d.]+))?\s*\)$/i.exec(hex);
+    if (rgb) {
+        return [
+            Number(rgb[1]) / 255,
+            Number(rgb[2]) / 255,
+            Number(rgb[3]) / 255,
+            rgb[4] != null ? Number(rgb[4]) : 1,
+        ];
+    }
+    return null;
+}
+export function resolveCssColor(color, el) {
+    const parsed = parseCssColor(color);
+    if (parsed)
+        return parsed;
+    if (typeof document === "undefined" || !el)
+        return [0.35, 0.55, 0.95, 1];
+    const probe = document.createElement("span");
+    probe.style.color = color;
+    probe.style.position = "absolute";
+    probe.style.pointerEvents = "none";
+    probe.style.opacity = "0";
+    el.appendChild(probe);
+    const computed = getComputedStyle(probe).color;
+    probe.remove();
+    return parseCssColor(computed) ?? [0.35, 0.55, 0.95, 1];
+}
+export function nearestScatterHit(candidates, px, py, pad = 4) {
+    let best = null;
+    let bestDist = Infinity;
+    for (const item of candidates) {
+        const dx = item.x - px;
+        const dy = item.y - py;
+        const dist = Math.hypot(dx, dy);
+        if (dist <= item.r + pad && dist < bestDist) {
+            best = item;
+            bestDist = dist;
+        }
+    }
+    return best;
+}
+export function svgPointerPosition(svg, clientX, clientY, width, height) {
+    const bounds = svg.getBoundingClientRect();
+    const w = bounds.width || width;
+    const h = bounds.height || height;
+    return {
+        x: ((clientX - bounds.left) / w) * width,
+        y: ((clientY - bounds.top) / h) * height,
+    };
+}
+const VS = `
+attribute vec2 a_position;
+attribute float a_size;
+uniform vec2 u_resolution;
+uniform float u_dpr;
+void main() {
+  vec2 zeroToOne = a_position / u_resolution;
+  vec2 clip = zeroToOne * 2.0 - 1.0;
+  gl_Position = vec4(clip.x, -clip.y, 0.0, 1.0);
+  gl_PointSize = max(1.0, a_size * u_dpr);
+}
+`;
+const FS = `
+precision mediump float;
+uniform vec4 u_color;
+void main() {
+  vec2 c = gl_PointCoord - vec2(0.5);
+  if (dot(c, c) > 0.25) discard;
+  gl_FragColor = u_color;
+}
+`;
+function compile(gl, type, source) {
+    const shader = gl.createShader(type);
+    if (!shader)
+        return null;
+    gl.shaderSource(shader, source);
+    gl.compileShader(shader);
+    if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+        gl.deleteShader(shader);
+        return null;
+    }
+    return shader;
+}
+export function createScatterGL(canvas) {
+    const gl = canvas.getContext("webgl", {
+        alpha: true,
+        antialias: true,
+        premultipliedAlpha: true,
+    });
+    if (!gl)
+        return null;
+    const vs = compile(gl, gl.VERTEX_SHADER, VS);
+    const fs = compile(gl, gl.FRAGMENT_SHADER, FS);
+    if (!vs || !fs)
+        return null;
+    const program = gl.createProgram();
+    if (!program)
+        return null;
+    gl.attachShader(program, vs);
+    gl.attachShader(program, fs);
+    gl.linkProgram(program);
+    if (!gl.getProgramParameter(program, gl.LINK_STATUS))
+        return null;
+    const buffer = gl.createBuffer();
+    if (!buffer)
+        return null;
+    gl.enable(gl.BLEND);
+    gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
+    return {
+        gl,
+        program,
+        buffer,
+        aPosition: gl.getAttribLocation(program, "a_position"),
+        aSize: gl.getAttribLocation(program, "a_size"),
+        uResolution: gl.getUniformLocation(program, "u_resolution"),
+        uDpr: gl.getUniformLocation(program, "u_dpr"),
+        uColor: gl.getUniformLocation(program, "u_color"),
+    };
+}
+export function drawScatterGL(gpu, canvas, width, height, series) {
+    const dpr = typeof window !== "undefined" ? Math.min(window.devicePixelRatio || 1, 2) : 1;
+    const pixelW = Math.max(1, Math.round(width * dpr));
+    const pixelH = Math.max(1, Math.round(height * dpr));
+    if (canvas.width !== pixelW)
+        canvas.width = pixelW;
+    if (canvas.height !== pixelH)
+        canvas.height = pixelH;
+    canvas.style.width = `${width}px`;
+    canvas.style.height = `${height}px`;
+    const { gl } = gpu;
+    gl.viewport(0, 0, pixelW, pixelH);
+    gl.clearColor(0, 0, 0, 0);
+    gl.clear(gl.COLOR_BUFFER_BIT);
+    gl.useProgram(gpu.program);
+    gl.uniform2f(gpu.uResolution, width, height);
+    gl.uniform1f(gpu.uDpr, dpr);
+    gl.bindBuffer(gl.ARRAY_BUFFER, gpu.buffer);
+    const stride = 3 * 4;
+    for (const item of series) {
+        if (!item.positions.length)
+            continue;
+        const data = new Float32Array(item.positions.length * 3);
+        item.positions.forEach((point, i) => {
+            data[i * 3] = point.x;
+            data[i * 3 + 1] = point.y;
+            data[i * 3 + 2] = point.size;
+        });
+        gl.bufferData(gl.ARRAY_BUFFER, data, gl.DYNAMIC_DRAW);
+        gl.enableVertexAttribArray(gpu.aPosition);
+        gl.vertexAttribPointer(gpu.aPosition, 2, gl.FLOAT, false, stride, 0);
+        gl.enableVertexAttribArray(gpu.aSize);
+        gl.vertexAttribPointer(gpu.aSize, 1, gl.FLOAT, false, stride, 8);
+        const [r, g, b, a] = resolveCssColor(item.color, canvas.parentElement ?? canvas);
+        gl.uniform4f(gpu.uColor, r, g, b, a);
+        gl.drawArrays(gl.POINTS, 0, item.positions.length);
+    }
+}
+export function destroyScatterGL(gpu) {
+    const { gl } = gpu;
+    gl.deleteBuffer(gpu.buffer);
+    gl.deleteProgram(gpu.program);
+}

package/dist/primitives/Accordion.d.ts

@@ -1,24 +1,48 @@
 import * as React from "react";
-declare function Accordion({ type, defaultValue, className, children, }: {
-    type?: "single" | "multiple";
+type AccordionType = "single" | "multiple";
+export type AccordionProps = Omit<React.ComponentPropsWithoutRef<"div">, "onChange"> & {
+    type?: AccordionType;
+    value?: string | string[];
     defaultValue?: string | string[];
-    className?: string;
-    children: React.ReactNode;
-}): React.JSX.Element;
-declare function AccordionItem({ value, className, children, }: {
+    onValueChange?: (value: string | string[]) => void;
+    disabled?: boolean;
+    /** Remove the gap between items and stack them as a single surface. */
+    disableGutters?: boolean;
+};
+declare function Accordion({ type, value: valueProp, defaultValue, onValueChange, disabled, disableGutters, className, children, ...props }: AccordionProps): React.JSX.Element;
+declare namespace Accordion {
+    var displayName: string;
+}
+export type AccordionItemProps = React.ComponentPropsWithoutRef<"div"> & {
     value: string;
-    className?: string;
-    children: React.ReactNode;
-}): React.JSX.Element;
-declare function AccordionTrigger({ value, className, children, }: {
-    value: string;
-    className?: string;
-    children: React.ReactNode;
-}): React.JSX.Element;
-declare function AccordionContent({ value, className, children, }: {
-    value: string;
-    className?: string;
-    children: React.ReactNode;
-}): React.JSX.Element | null;
-export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
+    disabled?: boolean;
+};
+declare function AccordionItem({ value, disabled, className, children, ...props }: AccordionItemProps): React.JSX.Element;
+declare namespace AccordionItem {
+    var displayName: string;
+}
+export type AccordionTriggerProps = React.ComponentPropsWithoutRef<"button"> & {
+    /** @deprecated Prefer wrapping with AccordionItem — value is inherited. */
+    value?: string;
+};
+declare function AccordionTrigger({ value: valueProp, className, children, onClick, ...props }: AccordionTriggerProps): React.JSX.Element;
+declare namespace AccordionTrigger {
+    var displayName: string;
+}
+export type AccordionContentProps = React.ComponentPropsWithoutRef<"div"> & {
+    /** @deprecated Prefer wrapping with AccordionItem — value is inherited. */
+    value?: string;
+};
+declare function AccordionContent({ value: valueProp, className, children, ...props }: AccordionContentProps): React.JSX.Element;
+declare namespace AccordionContent {
+    var displayName: string;
+}
+declare function AccordionActions({ className, ...props }: React.ComponentPropsWithoutRef<"div">): React.JSX.Element;
+declare namespace AccordionActions {
+    var displayName: string;
+}
+/** MUI-compatible aliases. */
+declare const AccordionSummary: typeof AccordionTrigger;
+declare const AccordionDetails: typeof AccordionContent;
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent, AccordionActions, AccordionSummary, AccordionDetails, };
 //# sourceMappingURL=Accordion.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../src/primitives/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,iBAAS,SAAS,CAAC,EACjB,IAAe,EACf,YAAY,EACZ,SAAS,EACT,QAAQ,GACT,EAAE;IACD,IAAI,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,qBAqBA;AAED,iBAAS,aAAa,CAAC,EACrB,KAAK,EACL,SAAS,EACT,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,qBAUA;AAED,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,EACT,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,qBAoBA;AAED,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,EACT,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,4BAQA;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAC"}
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../src/primitives/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,KAAK,aAAa,GAAG,QAAQ,GAAG,UAAU,CAAC;AAiC3C,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IACrF,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACjC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uEAAuE;IACvE,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAOF,iBAAS,SAAS,CAAC,EACjB,IAAe,EACf,KAAK,EAAE,SAAS,EAChB,YAAY,EACZ,aAAa,EACb,QAAgB,EAChB,cAAsB,EACtB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAkChB;kBA5CQ,SAAS;;;AA+ClB,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,GAAG;IACvE,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,iBAAS,aAAa,CAAC,EACrB,KAAK,EACL,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,qBAmCpB;kBAzCQ,aAAa;;;AA4CtB,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,GAAG;IAC7E,2EAA2E;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EAAE,SAAS,EAChB,SAAS,EACT,QAAQ,EACR,OAAO,EACP,GAAG,KAAK,EACT,EAAE,qBAAqB,qBA2CvB;kBAjDQ,gBAAgB;;;AAoDzB,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAC1E,2EAA2E;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EAAE,SAAS,EAChB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,qBAAqB,qBAsBvB;kBA3BQ,gBAAgB;;;AA8BzB,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,qBAWvF;kBAXQ,gBAAgB;;;AAczB,8BAA8B;AAC9B,QAAA,MAAM,gBAAgB,yBAAmB,CAAC;AAC1C,QAAA,MAAM,gBAAgB,yBAAmB,CAAC;AAE1C,OAAO,EACL,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,gBAAgB,EAChB,gBAAgB,EAChB,gBAAgB,GACjB,CAAC"}

package/dist/primitives/Accordion.js

@@ -1,37 +1,97 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { ChevronDown } from "lucide-react";
+import { useControllableState } from "../lib/use-controllable-state";
 import { cn } from "../lib/cn";
+import { Collapse } from "./Collapse";
 const AccordionContext = React.createContext(null);
-function Accordion({ type = "single", defaultValue, className, children, }) {
-    const initial = Array.isArray(defaultValue)
-        ? defaultValue
-        : defaultValue
-            ? [defaultValue]
-            : [];
-    const [open, setOpen] = React.useState(initial);
+const AccordionItemContext = React.createContext(null);
+function useAccordion(component) {
+    const ctx = React.useContext(AccordionContext);
+    if (!ctx)
+        throw new Error(`${component} must be used within <Accordion>`);
+    return ctx;
+}
+function useAccordionItem(component) {
+    const ctx = React.useContext(AccordionItemContext);
+    if (!ctx)
+        throw new Error(`${component} must be used within <AccordionItem>`);
+    return ctx;
+}
+function toArray(value) {
+    if (value == null || value === "")
+        return [];
+    return Array.isArray(value) ? value : [value];
+}
+function Accordion({ type = "single", value: valueProp, defaultValue, onValueChange, disabled = false, disableGutters = false, className, children, ...props }) {
+    const [open = [], setOpen] = useControllableState({
+        prop: valueProp === undefined ? undefined : toArray(valueProp),
+        defaultProp: toArray(defaultValue),
+        onChange: (next) => {
+            onValueChange?.(type === "single" ? (next[0] ?? "") : next);
+        },
+    });
     const toggle = (id) => {
+        if (disabled)
+            return;
         setOpen((prev) => {
-            const isOpen = prev.includes(id);
+            const current = prev ?? [];
+            const isOpen = current.includes(id);
             if (type === "single")
                 return isOpen ? [] : [id];
-            return isOpen ? prev.filter((x) => x !== id) : [...prev, id];
+            return isOpen ? current.filter((x) => x !== id) : [...current, id];
         });
     };
-    return (_jsx(AccordionContext.Provider, { value: { open, toggle, type }, children: _jsx("div", { "data-slot": "accordion", className: cn("space-y-2", className), children: children }) }));
+    return (_jsx(AccordionContext.Provider, { value: { open: open ?? [], toggle, type, disabled, disableGutters }, children: _jsx("div", { "data-slot": "accordion", "data-disabled": disabled ? "" : undefined, "data-gutters": disableGutters ? "false" : "true", className: cn(disableGutters ? "overflow-hidden rounded-xl" : "space-y-2", className), ...props, children: children }) }));
 }
-function AccordionItem({ value, className, children, }) {
-    return (_jsx("div", { "data-slot": "accordion-item", "data-value": value, className: cn("overflow-hidden rounded-xl border border-border/40 bg-card/40", className), children: children }));
+Accordion.displayName = "Accordion";
+function AccordionItem({ value, disabled = false, className, children, ...props }) {
+    const accordion = useAccordion("AccordionItem");
+    const reactId = React.useId();
+    const expanded = accordion.open.includes(value);
+    const isDisabled = disabled || accordion.disabled;
+    return (_jsx(AccordionItemContext.Provider, { value: {
+            value,
+            disabled: isDisabled,
+            expanded,
+            triggerId: `${reactId}-trigger`,
+            contentId: `${reactId}-content`,
+        }, children: _jsx("div", { "data-slot": "accordion-item", "data-value": value, "data-state": expanded ? "open" : "closed", "data-disabled": isDisabled ? "" : undefined, className: cn("overflow-hidden border-border/40 bg-card/40", accordion.disableGutters
+                ? "border-x border-b first:rounded-t-xl first:border-t last:rounded-b-xl"
+                : "rounded-xl border", isDisabled && "pointer-events-none opacity-50", className), ...props, children: children }) }));
 }
-function AccordionTrigger({ value, className, children, }) {
-    const ctx = React.useContext(AccordionContext);
-    const isOpen = ctx?.open.includes(value);
-    return (_jsxs("button", { type: "button", "data-slot": "accordion-trigger", "aria-expanded": isOpen, className: cn("flex w-full items-center justify-between gap-2 px-4 py-3 text-left text-sm font-bold", className), onClick: () => ctx?.toggle(value), children: [children, _jsx(ChevronDown, { className: cn("size-4 shrink-0 transition-transform", isOpen && "rotate-180") })] }));
+AccordionItem.displayName = "AccordionItem";
+function AccordionTrigger({ value: valueProp, className, children, onClick, ...props }) {
+    const accordion = useAccordion("AccordionTrigger");
+    const item = React.useContext(AccordionItemContext);
+    const value = valueProp ?? item?.value;
+    if (!value)
+        throw new Error("AccordionTrigger requires AccordionItem or a value prop");
+    const expanded = item?.expanded ?? accordion.open.includes(value);
+    const disabled = item?.disabled ?? accordion.disabled;
+    return (_jsx("h3", { className: "m-0", children: _jsxs("button", { type: "button", id: item?.triggerId, "data-slot": "accordion-trigger", "data-state": expanded ? "open" : "closed", "aria-expanded": expanded, "aria-controls": item?.contentId, disabled: disabled, className: cn("flex w-full items-center justify-between gap-2 px-4 py-3 text-left text-sm font-bold outline-none transition-colors", "hover:bg-muted/30 focus-visible:ring-ring/50 focus-visible:ring-[3px]", "disabled:cursor-not-allowed", className), onClick: (event) => {
+                onClick?.(event);
+                if (event.defaultPrevented || disabled)
+                    return;
+                accordion.toggle(value);
+            }, ...props, children: [children, _jsx(ChevronDown, { "aria-hidden": true, className: cn("size-4 shrink-0 text-muted-foreground transition-transform duration-300", expanded && "rotate-180") })] }) }));
 }
-function AccordionContent({ value, className, children, }) {
-    const ctx = React.useContext(AccordionContext);
-    if (!ctx?.open.includes(value))
-        return null;
-    return (_jsx("div", { "data-slot": "accordion-content", className: cn("border-t border-border/30 px-4 py-3 text-sm", className), children: children }));
+AccordionTrigger.displayName = "AccordionTrigger";
+function AccordionContent({ value: valueProp, className, children, ...props }) {
+    const accordion = useAccordion("AccordionContent");
+    const item = React.useContext(AccordionItemContext);
+    const value = valueProp ?? item?.value;
+    if (!value)
+        throw new Error("AccordionContent requires AccordionItem or a value prop");
+    const expanded = item?.expanded ?? accordion.open.includes(value);
+    return (_jsx(Collapse, { in: expanded, children: _jsx("div", { id: item?.contentId, role: "region", "aria-labelledby": item?.triggerId, "data-slot": "accordion-content", className: cn("border-t border-border/30 px-4 py-3 text-sm", className), ...props, children: children }) }));
+}
+AccordionContent.displayName = "AccordionContent";
+function AccordionActions({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "accordion-actions", className: cn("flex flex-wrap items-center justify-end gap-2 border-t border-border/30 px-4 py-2.5", className), ...props }));
 }
-export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
+AccordionActions.displayName = "AccordionActions";
+/** MUI-compatible aliases. */
+const AccordionSummary = AccordionTrigger;
+const AccordionDetails = AccordionContent;
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent, AccordionActions, AccordionSummary, AccordionDetails, };

package/dist/primitives/AppBar.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const appBarVariants: (props?: ({
+    position?: "fixed" | "relative" | "static" | "sticky" | null | undefined;
+    color?: "transparent" | "default" | "primary" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type AppBarProps = Omit<React.ComponentPropsWithoutRef<"header">, "color"> & VariantProps<typeof appBarVariants>;
+declare function AppBar({ className, position, color, ...props }: AppBarProps): React.JSX.Element;
+declare namespace AppBar {
+    var displayName: string;
+}
+export { AppBar, appBarVariants };
+//# sourceMappingURL=AppBar.d.ts.map

package/dist/primitives/AppBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppBar.d.ts","sourceRoot":"","sources":["../../src/primitives/AppBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,QAAA,MAAM,cAAc;;;8EAkBlB,CAAC;AAEH,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,GAC/E,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAEtC,iBAAS,MAAM,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,qBAQpE;kBARQ,MAAM;;;AAWf,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAC"}

package/dist/primitives/AppBar.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/cn";
+const appBarVariants = cva("z-40 flex w-full items-center border-b border-border/50", {
+    variants: {
+        position: {
+            static: "relative",
+            sticky: "sticky top-0",
+            fixed: "fixed inset-x-0 top-0",
+            relative: "relative",
+        },
+        color: {
+            default: "glass-header text-foreground",
+            primary: "bg-primary text-primary-foreground border-transparent",
+            transparent: "border-transparent bg-transparent",
+        },
+    },
+    defaultVariants: {
+        position: "sticky",
+        color: "default",
+    },
+});
+function AppBar({ className, position, color, ...props }) {
+    return (_jsx("header", { "data-slot": "app-bar", className: cn(appBarVariants({ position, color }), className), ...props }));
+}
+AppBar.displayName = "AppBar";
+export { AppBar, appBarVariants };

package/dist/primitives/Autocomplete.d.ts

@@ -0,0 +1,28 @@
+import * as React from "react";
+export type AutocompleteOption = {
+    label: string;
+    value: string;
+    disabled?: boolean;
+};
+export type AutocompleteProps = Omit<React.ComponentPropsWithoutRef<"div">, "onChange" | "defaultValue"> & {
+    options: Array<string | AutocompleteOption>;
+    value?: string | string[] | null;
+    defaultValue?: string | string[] | null;
+    onChange?: (value: string | string[] | null, option?: AutocompleteOption | AutocompleteOption[] | null) => void;
+    multiple?: boolean;
+    freeSolo?: boolean;
+    label?: React.ReactNode;
+    placeholder?: string;
+    disabled?: boolean;
+    fullWidth?: boolean;
+    noOptionsText?: string;
+};
+/**
+ * Filterable combobox. Supports single, multiple, and free-solo entry.
+ */
+declare function Autocomplete({ options: optionsProp, value: valueProp, defaultValue, onChange, multiple, freeSolo, label, placeholder, disabled, fullWidth, noOptionsText, className, id, ...props }: AutocompleteProps): React.JSX.Element;
+declare namespace Autocomplete {
+    var displayName: string;
+}
+export { Autocomplete };
+//# sourceMappingURL=Autocomplete.d.ts.map

package/dist/primitives/Autocomplete.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../src/primitives/Autocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAQF,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAClC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EACrC,UAAU,GAAG,cAAc,CAC5B,GAAG;IACF,OAAO,EAAE,KAAK,CAAC,MAAM,GAAG,kBAAkB,CAAC,CAAC;IAC5C,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,IAAI,CAAC;IACjC,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,IAAI,EAAE,MAAM,CAAC,EAAE,kBAAkB,GAAG,kBAAkB,EAAE,GAAG,IAAI,KAAK,IAAI,CAAC;IAChH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAOF;;GAEG;AACH,iBAAS,YAAY,CAAC,EACpB,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,SAAS,EAChB,YAAY,EACZ,QAAQ,EACR,QAAgB,EAChB,QAAgB,EAChB,KAAK,EACL,WAAuB,EACvB,QAAQ,EACR,SAAS,EACT,aAA4B,EAC5B,SAAS,EACT,EAAE,EACF,GAAG,KAAK,EACT,EAAE,iBAAiB,qBA4KnB;kBA3LQ,YAAY;;;AA8LrB,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/dist/primitives/Autocomplete.js

@@ -0,0 +1,118 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Check, ChevronsUpDown, X } from "lucide-react";
+import { useControllableState } from "../lib/use-controllable-state";
+import { useDismissable } from "../lib/use-dismissable";
+import { cn } from "../lib/cn";
+import { Input } from "./Input";
+import { Label } from "./Label";
+function normalizeOptions(options) {
+    return options.map((option) => typeof option === "string" ? { label: option, value: option } : option);
+}
+function asList(value) {
+    if (value == null || value === "")
+        return [];
+    return Array.isArray(value) ? value : [value];
+}
+/**
+ * Filterable combobox. Supports single, multiple, and free-solo entry.
+ */
+function Autocomplete({ options: optionsProp, value: valueProp, defaultValue, onChange, multiple = false, freeSolo = false, label, placeholder = "Search…", disabled, fullWidth, noOptionsText = "No options", className, id, ...props }) {
+    const autoId = React.useId();
+    const fieldId = id ?? autoId;
+    const options = React.useMemo(() => normalizeOptions(optionsProp), [optionsProp]);
+    const [value, setValue] = useControllableState({
+        prop: valueProp,
+        defaultProp: defaultValue ?? (multiple ? [] : null),
+        onChange: (next) => {
+            const list = asList(next);
+            const matched = options.filter((opt) => list.includes(opt.value));
+            onChange?.(next, multiple ? matched : (matched[0] ?? null));
+        },
+    });
+    const selected = asList(value);
+    const [query, setQuery] = React.useState("");
+    const [open, setOpen] = React.useState(false);
+    const [highlight, setHighlight] = React.useState(0);
+    const rootRef = React.useRef(null);
+    const listRef = React.useRef(null);
+    const filtered = options.filter((opt) => {
+        if (multiple && selected.includes(opt.value) && !query)
+            return true;
+        return opt.label.toLowerCase().includes(query.toLowerCase());
+    });
+    useDismissable({
+        enabled: open,
+        onDismiss: () => setOpen(false),
+        refs: [rootRef, listRef],
+    });
+    const commit = (next) => {
+        if (disabled)
+            return;
+        if (multiple) {
+            const list = selected.includes(next)
+                ? selected.filter((item) => item !== next)
+                : [...selected, next];
+            setValue(list);
+            setQuery("");
+        }
+        else {
+            setValue(next);
+            setQuery("");
+            setOpen(false);
+        }
+    };
+    const display = multiple
+        ? query
+        : open
+            ? query
+            : (options.find((opt) => opt.value === selected[0])?.label ?? selected[0] ?? "");
+    return (_jsxs("div", { ref: rootRef, "data-slot": "autocomplete", className: cn("relative", fullWidth && "w-full", className), ...props, children: [label ? _jsx(Label, { htmlFor: fieldId, children: label }) : null, _jsxs("div", { className: cn("mt-1.5 flex min-h-9 flex-wrap items-center gap-1 rounded-md border border-input bg-input-background px-2 py-1", "focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]", disabled && "opacity-50"), children: [multiple
+                        ? selected.map((item) => {
+                            const opt = options.find((option) => option.value === item);
+                            return (_jsxs("span", { className: "inline-flex items-center gap-1 rounded-full border border-border/50 bg-muted/50 px-2 py-0.5 text-xs font-bold", children: [opt?.label ?? item, _jsx("button", { type: "button", "aria-label": `Remove ${opt?.label ?? item}`, className: "text-muted-foreground hover:text-foreground", onClick: () => commit(item), children: _jsx(X, { className: "size-3" }) })] }, item));
+                        })
+                        : null, _jsx(Input, { id: fieldId, disabled: disabled, role: "combobox", "aria-expanded": open, "aria-autocomplete": "list", placeholder: selected.length && multiple ? undefined : placeholder, value: multiple ? query : display, className: "h-7 min-w-16 flex-1 border-0 bg-transparent px-1 shadow-none focus-visible:ring-0", onFocus: () => {
+                            setOpen(true);
+                            if (!multiple) {
+                                const current = options.find((opt) => opt.value === selected[0])?.label ?? selected[0] ?? "";
+                                setQuery(current);
+                            }
+                        }, onChange: (event) => {
+                            setQuery(event.target.value);
+                            setOpen(true);
+                            setHighlight(0);
+                            if (!multiple && !freeSolo) {
+                                /* keep typing local until a selection is committed */
+                            }
+                        }, onKeyDown: (event) => {
+                            if (event.key === "ArrowDown") {
+                                event.preventDefault();
+                                setOpen(true);
+                                setHighlight((index) => Math.min(filtered.length - 1, index + 1));
+                            }
+                            else if (event.key === "ArrowUp") {
+                                event.preventDefault();
+                                setHighlight((index) => Math.max(0, index - 1));
+                            }
+                            else if (event.key === "Enter") {
+                                event.preventDefault();
+                                const hit = filtered[highlight];
+                                if (hit)
+                                    commit(hit.value);
+                                else if (freeSolo && query.trim())
+                                    commit(query.trim());
+                            }
+                            else if (event.key === "Escape") {
+                                setOpen(false);
+                            }
+                            else if (event.key === "Backspace" && multiple && !query && selected.length) {
+                                commit(selected[selected.length - 1]);
+                            }
+                        } }), _jsx(ChevronsUpDown, { className: "size-3.5 shrink-0 text-muted-foreground" })] }), open ? (_jsx("div", { ref: listRef, role: "listbox", "data-slot": "autocomplete-list", className: "glass-menu absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-xl border border-border/50 p-1 shadow-xl", children: filtered.length === 0 ? (_jsx("div", { className: "px-3 py-2 text-sm text-muted-foreground", children: noOptionsText })) : (filtered.map((opt, index) => {
+                    const active = selected.includes(opt.value);
+                    return (_jsxs("button", { type: "button", role: "option", "aria-selected": active, disabled: opt.disabled, className: cn("flex w-full items-center justify-between rounded-lg px-3 py-2 text-left text-sm font-medium", index === highlight ? "bg-muted/60" : "hover:bg-muted/40", opt.disabled && "opacity-40"), onMouseEnter: () => setHighlight(index), onClick: () => commit(opt.value), children: [opt.label, active ? _jsx(Check, { className: "size-3.5 text-primary" }) : null] }, opt.value));
+                })) })) : null] }));
+}
+Autocomplete.displayName = "Autocomplete";
+export { Autocomplete };

package/dist/primitives/Avatar.d.ts

@@ -11,5 +11,17 @@ declare function InitialsAvatar({ name, className, textClassName, }: {
     className?: string;
     textClassName?: string;
 }): React.JSX.Element;
-export { Avatar, AvatarImage, AvatarFallback, InitialsAvatar };
+export type AvatarGroupProps = React.ComponentPropsWithoutRef<"div"> & {
+    max?: number;
+    total?: number;
+    spacing?: "sm" | "md" | "lg";
+};
+/**
+ * Overlapping avatar stack with an overflow count.
+ */
+declare function AvatarGroup({ max, total, spacing, className, children, ...props }: AvatarGroupProps): React.JSX.Element;
+declare namespace AvatarGroup {
+    var displayName: string;
+}
+export { Avatar, AvatarImage, AvatarFallback, InitialsAvatar, AvatarGroup };
 //# sourceMappingURL=Avatar.d.ts.map

package/dist/primitives/Avatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/primitives/Avatar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,QAAA,MAAM,MAAM,sKA6BV,CAAC;AAGH,QAAA,MAAM,WAAW,4KAsCf,CAAC;AAGH,QAAA,MAAM,cAAc,sKAoBlB,CAAC;AAGH;;;GAGG;AACH,iBAAS,cAAc,CAAC,EACtB,IAAI,EACJ,SAAS,EACT,aAAa,GACd,EAAE;IACD,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,qBAcA;AAED,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,cAAc,EAAE,CAAC"}
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/primitives/Avatar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,QAAA,MAAM,MAAM,sKA6BV,CAAC;AAGH,QAAA,MAAM,WAAW,4KAsCf,CAAC;AAGH,QAAA,MAAM,cAAc,sKAoBlB,CAAC;AAGH;;;GAGG;AACH,iBAAS,cAAc,CAAC,EACtB,IAAI,EACJ,SAAS,EACT,aAAa,GACd,EAAE;IACD,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,qBAcA;AAED,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,GAAG;IACrE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC9B,CAAC;AAQF;;GAEG;AACH,iBAAS,WAAW,CAAC,EACnB,GAAO,EACP,KAAK,EACL,OAAc,EACd,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,gBAAgB,qBA0BlB;kBAjCQ,WAAW;;;AAoCpB,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC"}

package/dist/primitives/Avatar.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { getAvatarColor, getInitials } from "../lib/avatar-utils";
 import { cn } from "../lib/cn";
@@ -49,4 +49,19 @@ function InitialsAvatar({ name, className, textClassName, }) {
     const initials = getInitials(n) || "?";
     return (_jsx("div", { className: cn("relative flex shrink-0 select-none items-center justify-center overflow-hidden rounded-full text-white", getAvatarColor(n), className), children: _jsx("span", { className: cn("leading-none", textClassName), children: initials }) }));
 }
-export { Avatar, AvatarImage, AvatarFallback, InitialsAvatar };
+const spacingClass = {
+    sm: "-space-x-1",
+    md: "-space-x-2",
+    lg: "-space-x-3",
+};
+/**
+ * Overlapping avatar stack with an overflow count.
+ */
+function AvatarGroup({ max = 5, total, spacing = "md", className, children, ...props }) {
+    const avatars = React.Children.toArray(children);
+    const extra = Math.max(0, (total ?? avatars.length) - max);
+    const shown = extra > 0 ? avatars.slice(0, max) : avatars;
+    return (_jsxs("div", { "data-slot": "avatar-group", className: cn("flex items-center [&_[data-slot=avatar]]:ring-2 [&_[data-slot=avatar]]:ring-background", spacingClass[spacing], className), ...props, children: [shown, extra > 0 ? (_jsxs("span", { "data-slot": "avatar-group-surplus", className: "relative z-[1] flex size-10 shrink-0 items-center justify-center rounded-full border-2 border-background bg-muted text-xs font-bold text-muted-foreground", children: ["+", extra] })) : null] }));
+}
+AvatarGroup.displayName = "AvatarGroup";
+export { Avatar, AvatarImage, AvatarFallback, InitialsAvatar, AvatarGroup };