@spatika/react 1.0.0

package/dist/lib/use-dismissable.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+type UseDismissableOptions = {
+    enabled?: boolean;
+    onDismiss: () => void;
+    /** Refs whose nodes count as "inside" (content + trigger). */
+    refs: React.RefObject<HTMLElement | null>[];
+};
+/**
+ * Closes on Escape and pointer-down outside the provided refs.
+ */
+export declare function useDismissable({ enabled, onDismiss, refs, }: UseDismissableOptions): void;
+export {};
+//# sourceMappingURL=use-dismissable.d.ts.map

package/dist/lib/use-dismissable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-dismissable.d.ts","sourceRoot":"","sources":["../../src/lib/use-dismissable.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,KAAK,qBAAqB,GAAG;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,8DAA8D;IAC9D,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC;CAC7C,CAAC;AAEF;;GAEG;AACH,wBAAgB,cAAc,CAAC,EAC7B,OAAc,EACd,SAAS,EACT,IAAI,GACL,EAAE,qBAAqB,QAgCvB"}

package/dist/lib/use-dismissable.js

@@ -0,0 +1,33 @@
+import * as React from "react";
+/**
+ * Closes on Escape and pointer-down outside the provided refs.
+ */
+export function useDismissable({ enabled = true, onDismiss, refs, }) {
+    const onDismissRef = React.useRef(onDismiss);
+    onDismissRef.current = onDismiss;
+    React.useEffect(() => {
+        if (!enabled)
+            return;
+        const handleKeyDown = (event) => {
+            if (event.key === "Escape") {
+                event.stopPropagation();
+                onDismissRef.current();
+            }
+        };
+        const handlePointerDown = (event) => {
+            const target = event.target;
+            if (!target)
+                return;
+            const isInside = refs.some((ref) => ref.current?.contains(target));
+            if (!isInside) {
+                onDismissRef.current();
+            }
+        };
+        document.addEventListener("keydown", handleKeyDown);
+        document.addEventListener("pointerdown", handlePointerDown, true);
+        return () => {
+            document.removeEventListener("keydown", handleKeyDown);
+            document.removeEventListener("pointerdown", handlePointerDown, true);
+        };
+    }, [enabled, refs]);
+}

package/dist/lib/use-floating-position.d.ts

@@ -0,0 +1,27 @@
+import * as React from "react";
+export type FloatingSide = "top" | "right" | "bottom" | "left";
+export type FloatingAlign = "start" | "center" | "end";
+export type FloatingPosition = {
+    top: number;
+    left: number;
+    side: FloatingSide;
+    /** Measured trigger size for consumers that match width. */
+    triggerWidth: number;
+    triggerHeight: number;
+};
+type UseFloatingPositionOptions = {
+    open: boolean;
+    triggerRef: React.RefObject<HTMLElement | null>;
+    contentRef: React.RefObject<HTMLElement | null>;
+    side?: FloatingSide;
+    align?: FloatingAlign;
+    sideOffset?: number;
+    collisionPadding?: number;
+};
+/**
+ * Positions floating content relative to a trigger using getBoundingClientRect.
+ * Returns fixed-position coordinates suitable for `position: fixed` portals.
+ */
+export declare function useFloatingPosition({ open, triggerRef, contentRef, side, align, sideOffset, collisionPadding, }: UseFloatingPositionOptions): FloatingPosition | null;
+export {};
+//# sourceMappingURL=use-floating-position.d.ts.map

package/dist/lib/use-floating-position.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-floating-position.d.ts","sourceRoot":"","sources":["../../src/lib/use-floating-position.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAC/D,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAEvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,YAAY,CAAC;IACnB,4DAA4D;IAC5D,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,KAAK,0BAA0B,GAAG;IAChC,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAChD,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAChD,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,UAAU,EACV,UAAU,EACV,IAAe,EACf,KAAgB,EAChB,UAAc,EACd,gBAAoB,GACrB,EAAE,0BAA0B,GAAG,gBAAgB,GAAG,IAAI,CAmItD"}

package/dist/lib/use-floating-position.js

@@ -0,0 +1,115 @@
+import * as React from "react";
+/**
+ * Positions floating content relative to a trigger using getBoundingClientRect.
+ * Returns fixed-position coordinates suitable for `position: fixed` portals.
+ */
+export function useFloatingPosition({ open, triggerRef, contentRef, side = "bottom", align = "center", sideOffset = 4, collisionPadding = 8, }) {
+    const [position, setPosition] = React.useState(null);
+    const update = React.useCallback(() => {
+        const trigger = triggerRef.current;
+        const content = contentRef.current;
+        if (!trigger || !content)
+            return;
+        const triggerRect = trigger.getBoundingClientRect();
+        // Prefer laid-out size; fall back to trigger size (min 1) so first paint /
+        // happy-dom still yields a position — avoids `visibility: hidden` menus that
+        // testing-library cannot query by role.
+        const contentWidth = content.offsetWidth > 0 ? content.offsetWidth : Math.max(triggerRect.width, 1);
+        const contentHeight = content.offsetHeight > 0 ? content.offsetHeight : Math.max(triggerRect.height, 1);
+        let resolvedSide = side;
+        const viewportW = window.innerWidth;
+        const viewportH = window.innerHeight;
+        // Prefer requested side; flip if clearly overflowing.
+        if (side === "bottom" &&
+            triggerRect.bottom + sideOffset + contentHeight > viewportH - collisionPadding) {
+            if (triggerRect.top - sideOffset - contentHeight > collisionPadding) {
+                resolvedSide = "top";
+            }
+        }
+        else if (side === "top" &&
+            triggerRect.top - sideOffset - contentHeight < collisionPadding) {
+            if (triggerRect.bottom + sideOffset + contentHeight <
+                viewportH - collisionPadding) {
+                resolvedSide = "bottom";
+            }
+        }
+        else if (side === "right" &&
+            triggerRect.right + sideOffset + contentWidth > viewportW - collisionPadding) {
+            if (triggerRect.left - sideOffset - contentWidth > collisionPadding) {
+                resolvedSide = "left";
+            }
+        }
+        else if (side === "left" &&
+            triggerRect.left - sideOffset - contentWidth < collisionPadding) {
+            if (triggerRect.right + sideOffset + contentWidth <
+                viewportW - collisionPadding) {
+                resolvedSide = "right";
+            }
+        }
+        let top = 0;
+        let left = 0;
+        if (resolvedSide === "bottom") {
+            top = triggerRect.bottom + sideOffset;
+        }
+        else if (resolvedSide === "top") {
+            top = triggerRect.top - contentHeight - sideOffset;
+        }
+        else if (resolvedSide === "left" || resolvedSide === "right") {
+            if (align === "start")
+                top = triggerRect.top;
+            else if (align === "end")
+                top = triggerRect.bottom - contentHeight;
+            else
+                top = triggerRect.top + (triggerRect.height - contentHeight) / 2;
+        }
+        if (resolvedSide === "right") {
+            left = triggerRect.right + sideOffset;
+        }
+        else if (resolvedSide === "left") {
+            left = triggerRect.left - contentWidth - sideOffset;
+        }
+        else if (align === "start") {
+            left = triggerRect.left;
+        }
+        else if (align === "end") {
+            left = triggerRect.right - contentWidth;
+        }
+        else {
+            left = triggerRect.left + (triggerRect.width - contentWidth) / 2;
+        }
+        // Keep the panel fully inside the viewport.
+        left = Math.min(Math.max(collisionPadding, left), Math.max(collisionPadding, viewportW - contentWidth - collisionPadding));
+        top = Math.min(Math.max(collisionPadding, top), Math.max(collisionPadding, viewportH - contentHeight - collisionPadding));
+        setPosition({
+            top,
+            left,
+            side: resolvedSide,
+            triggerWidth: triggerRect.width,
+            triggerHeight: triggerRect.height,
+        });
+    }, [align, collisionPadding, contentRef, side, sideOffset, triggerRef]);
+    React.useLayoutEffect(() => {
+        if (!open) {
+            setPosition(null);
+            return;
+        }
+        update();
+        // Remeasure after paint in case fonts/layout settle one frame later.
+        const raf = window.requestAnimationFrame(() => update());
+        const handle = () => update();
+        window.addEventListener("resize", handle);
+        window.addEventListener("scroll", handle, true);
+        const ro = typeof ResizeObserver !== "undefined" ? new ResizeObserver(handle) : null;
+        if (contentRef.current && ro)
+            ro.observe(contentRef.current);
+        if (triggerRef.current && ro)
+            ro.observe(triggerRef.current);
+        return () => {
+            window.cancelAnimationFrame(raf);
+            window.removeEventListener("resize", handle);
+            window.removeEventListener("scroll", handle, true);
+            ro?.disconnect();
+        };
+    }, [open, update, contentRef, triggerRef]);
+    return position;
+}

package/dist/lib/use-focus-trap.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+/**
+ * Locks body scroll and restores focus to the previously focused element on cleanup.
+ * Also traps Tab within the container while enabled.
+ */
+export declare function useFocusTrap(containerRef: React.RefObject<HTMLElement | null>, enabled: boolean): void;
+//# sourceMappingURL=use-focus-trap.d.ts.map

package/dist/lib/use-focus-trap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-focus-trap.d.ts","sourceRoot":"","sources":["../../src/lib/use-focus-trap.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B;;;GAGG;AACH,wBAAgB,YAAY,CAC1B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EACjD,OAAO,EAAE,OAAO,QA6DjB"}

package/dist/lib/use-focus-trap.js

@@ -0,0 +1,61 @@
+import * as React from "react";
+const FOCUSABLE_SELECTOR = 'a[href],button:not([disabled]),textarea:not([disabled]),input:not([disabled]),select:not([disabled]),[tabindex]:not([tabindex="-1"])';
+/**
+ * Locks body scroll and restores focus to the previously focused element on cleanup.
+ * Also traps Tab within the container while enabled.
+ */
+export function useFocusTrap(containerRef, enabled) {
+    React.useEffect(() => {
+        if (!enabled)
+            return;
+        const previouslyFocused = document.activeElement;
+        const previousOverflow = document.body.style.overflow;
+        document.body.style.overflow = "hidden";
+        const focusFirst = () => {
+            const container = containerRef.current;
+            if (!container)
+                return;
+            const focusable = container.querySelectorAll(FOCUSABLE_SELECTOR);
+            if (focusable.length > 0) {
+                focusable[0].focus();
+            }
+            else {
+                container.focus();
+            }
+        };
+        // Defer so portal content is mounted.
+        const id = window.setTimeout(focusFirst, 0);
+        const handleKeyDown = (event) => {
+            if (event.key !== "Tab")
+                return;
+            const container = containerRef.current;
+            if (!container)
+                return;
+            const focusable = Array.from(container.querySelectorAll(FOCUSABLE_SELECTOR)).filter((el) => !el.hasAttribute("disabled") && el.tabIndex !== -1);
+            if (focusable.length === 0) {
+                event.preventDefault();
+                return;
+            }
+            const first = focusable[0];
+            const last = focusable[focusable.length - 1];
+            const active = document.activeElement;
+            if (event.shiftKey) {
+                if (active === first || !container.contains(active)) {
+                    event.preventDefault();
+                    last.focus();
+                }
+            }
+            else if (active === last || !container.contains(active)) {
+                event.preventDefault();
+                first.focus();
+            }
+        };
+        document.addEventListener("keydown", handleKeyDown);
+        return () => {
+            window.clearTimeout(id);
+            document.removeEventListener("keydown", handleKeyDown);
+            document.body.style.overflow = previousOverflow;
+            previouslyFocused?.focus?.();
+        };
+    }, [containerRef, enabled]);
+}

package/dist/lib/use-media-query.d.ts

@@ -0,0 +1,5 @@
+/** Subscribe to a CSS media query. Defaults to `false` until mounted. */
+export declare function useMediaQuery(query: string): boolean;
+/** True when the viewport is below the `md` breakpoint (768px). */
+export declare function useIsMobile(): boolean;
+//# sourceMappingURL=use-media-query.d.ts.map

package/dist/lib/use-media-query.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-media-query.d.ts","sourceRoot":"","sources":["../../src/lib/use-media-query.ts"],"names":[],"mappings":"AAEA,yEAAyE;AACzE,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAapD;AAED,mEAAmE;AACnE,wBAAgB,WAAW,IAAI,OAAO,CAErC"}

package/dist/lib/use-media-query.js

@@ -0,0 +1,19 @@
+import { useEffect, useState } from "react";
+/** Subscribe to a CSS media query. Defaults to `false` until mounted. */
+export function useMediaQuery(query) {
+    const [matches, setMatches] = useState(false);
+    useEffect(() => {
+        if (typeof window.matchMedia !== "function")
+            return;
+        const media = window.matchMedia(query);
+        const update = () => setMatches(media.matches);
+        update();
+        media.addEventListener("change", update);
+        return () => media.removeEventListener("change", update);
+    }, [query]);
+    return matches;
+}
+/** True when the viewport is below the `md` breakpoint (768px). */
+export function useIsMobile() {
+    return useMediaQuery("(max-width: 767px)");
+}

package/dist/primitives/Accordion.d.ts

@@ -0,0 +1,24 @@
+import * as React from "react";
+declare function Accordion({ type, defaultValue, className, children, }: {
+    type?: "single" | "multiple";
+    defaultValue?: string | string[];
+    className?: string;
+    children: React.ReactNode;
+}): React.JSX.Element;
+declare function AccordionItem({ value, className, children, }: {
+    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 };
+//# sourceMappingURL=Accordion.d.ts.map

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

@@ -0,0 +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"}

package/dist/primitives/Accordion.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { ChevronDown } from "lucide-react";
+import { cn } from "../lib/cn";
+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 toggle = (id) => {
+        setOpen((prev) => {
+            const isOpen = prev.includes(id);
+            if (type === "single")
+                return isOpen ? [] : [id];
+            return isOpen ? prev.filter((x) => x !== id) : [...prev, id];
+        });
+    };
+    return (_jsx(AccordionContext.Provider, { value: { open, toggle, type }, children: _jsx("div", { "data-slot": "accordion", className: cn("space-y-2", className), 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 }));
+}
+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") })] }));
+}
+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 }));
+}
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };

package/dist/primitives/Alert.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const alertVariants: (props?: ({
+    variant?: "default" | "info" | "warm" | "highlight" | "danger" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Alert({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof alertVariants>): React.JSX.Element;
+declare function AlertTitle({ className, ...props }: React.ComponentProps<"h5">): React.JSX.Element;
+declare function AlertDescription({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+export { Alert, AlertTitle, AlertDescription, alertVariants };
+//# sourceMappingURL=Alert.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../src/primitives/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,QAAA,MAAM,aAAa;;8EAelB,CAAC;AAEF,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,OAAO,EACP,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,qBASlE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,qBAQtE;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQ7E;AAED,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,aAAa,EAAE,CAAC"}

package/dist/primitives/Alert.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/cn";
+const alertVariants = cva("relative w-full rounded-[var(--radius-card)] border px-4 py-3 text-sm", {
+    variants: {
+        variant: {
+            default: "border-border/50 bg-card/60 text-foreground",
+            info: "border-[color-mix(in_srgb,var(--accent-info)_35%,transparent)] bg-[var(--accent-info-bg)] text-[var(--accent-info)]",
+            warm: "border-[color-mix(in_srgb,var(--accent-warm)_35%,transparent)] bg-[var(--accent-warm-bg)] text-[var(--accent-warm)]",
+            highlight: "border-[color-mix(in_srgb,var(--accent-highlight)_35%,transparent)] bg-[var(--accent-highlight-bg)] text-[var(--accent-highlight)]",
+            danger: "border-destructive/40 bg-[var(--accent-danger-bg)] text-destructive",
+        },
+    },
+    defaultVariants: { variant: "default" },
+});
+function Alert({ className, variant, ...props }) {
+    return (_jsx("div", { role: "alert", "data-slot": "alert", className: cn(alertVariants({ variant }), className), ...props }));
+}
+function AlertTitle({ className, ...props }) {
+    return (_jsx("h5", { "data-slot": "alert-title", className: cn("mb-1 font-black tracking-tight", className), ...props }));
+}
+function AlertDescription({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "alert-description", className: cn("text-sm font-medium opacity-90", className), ...props }));
+}
+export { Alert, AlertTitle, AlertDescription, alertVariants };

package/dist/primitives/AlertDialog.d.ts

@@ -0,0 +1,33 @@
+import * as React from "react";
+type AlertDialogProps = {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    children?: React.ReactNode;
+};
+declare function AlertDialog({ open: openProp, defaultOpen, onOpenChange, children, }: AlertDialogProps): React.JSX.Element;
+declare const AlertDialogTrigger: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    asChild?: boolean;
+} & React.RefAttributes<HTMLButtonElement>>;
+declare function AlertDialogPortal({ children }: {
+    children?: React.ReactNode;
+}): React.JSX.Element;
+declare const AlertDialogOverlay: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    /** Extra classes for the dimmer (z-index, backdrop tweaks, etc.). */
+    overlayClassName?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    displayName: string;
+};
+declare const AlertDialogFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    displayName: string;
+};
+declare const AlertDialogTitle: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const AlertDialogDescription: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+declare const AlertDialogAction: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogCancel: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export { AlertDialog, AlertDialogPortal, AlertDialogOverlay, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, };
+//# sourceMappingURL=AlertDialog.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../src/primitives/AlertDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA4B/B,KAAK,gBAAgB,GAAG;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAEF,iBAAS,WAAW,CAAC,EACnB,IAAI,EAAE,QAAQ,EACd,WAAW,EACX,YAAY,EACZ,QAAQ,GACT,EAAE,gBAAgB,qBAiBlB;AAED,QAAA,MAAM,kBAAkB;cAEiC,OAAO;2CAiB9D,CAAC;AAGH,iBAAS,iBAAiB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,qBAEtE;AAED,QAAA,MAAM,kBAAkB,mKAoBtB,CAAC;AAGH,QAAA,MAAM,kBAAkB;IAGpB,qEAAqE;uBAClD,MAAM;wCAuC3B,CAAC;AAGH,QAAA,MAAM,iBAAiB;8BAGpB,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;;CAMtC,CAAC;AAGF,QAAA,MAAM,iBAAiB;8BAGpB,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;;CAStC,CAAC;AAGF,QAAA,MAAM,gBAAgB,+KAapB,CAAC;AAGH,QAAA,MAAM,sBAAsB,qLAa1B,CAAC;AAGH,QAAA,MAAM,iBAAiB,kLAiBrB,CAAC;AAGH,QAAA,MAAM,iBAAiB,kLAqBrB,CAAC;AAGH,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,GAClB,CAAC"}

package/dist/primitives/AlertDialog.js

@@ -0,0 +1,96 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { composeRefs } from "../lib/compose-refs";
+import { Portal } from "../lib/portal";
+import { Slot } from "../lib/slot";
+import { useControllableState } from "../lib/use-controllable-state";
+import { useFocusTrap } from "../lib/use-focus-trap";
+import { cn } from "../lib/cn";
+import { OVERLAY_Z_INDEX, fixedLayerStyle } from "../lib/overlay-stack";
+import { buttonVariants } from "./Button";
+const AlertDialogContext = React.createContext(null);
+function useAlertDialogContext(component) {
+    const ctx = React.useContext(AlertDialogContext);
+    if (!ctx) {
+        throw new Error(`${component} must be used within <AlertDialog>`);
+    }
+    return ctx;
+}
+function AlertDialog({ open: openProp, defaultOpen, onOpenChange, children, }) {
+    const [open = false, setOpen] = useControllableState({
+        prop: openProp,
+        defaultProp: defaultOpen ?? false,
+        onChange: onOpenChange,
+    });
+    const contentRef = React.useRef(null);
+    // Provider-only root — no DOM wrapper (matches Radix Root / Dialog / Select).
+    // A wrapper div becomes an extra CSS grid/flex item when AlertDialog is a Fragment sibling.
+    return (_jsx(AlertDialogContext.Provider, { value: { open, setOpen: (next) => setOpen(next), contentRef }, children: children }));
+}
+const AlertDialogTrigger = React.forwardRef(({ asChild = false, onClick, ...props }, ref) => {
+    const { setOpen } = useAlertDialogContext("AlertDialogTrigger");
+    const Comp = asChild ? Slot : "button";
+    return (_jsx(Comp, { ref: ref, type: asChild ? undefined : "button", "data-slot": "alert-dialog-trigger", ...props, onClick: (event) => {
+            onClick?.(event);
+            if (!event.defaultPrevented)
+                setOpen(true);
+        } }));
+});
+AlertDialogTrigger.displayName = "AlertDialogTrigger";
+function AlertDialogPortal({ children }) {
+    return _jsx(Portal, { children: children });
+}
+const AlertDialogOverlay = React.forwardRef(({ className, style, ...props }, ref) => {
+    const { open } = useAlertDialogContext("AlertDialogOverlay");
+    if (!open)
+        return null;
+    return (_jsx("div", { ref: ref, "data-slot": "alert-dialog-overlay", "data-state": "open", className: cn("fixed inset-0 z-[11000] bg-[var(--modal-overlay-bg)] backdrop-blur-[var(--modal-overlay-blur)] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className), ...props, style: fixedLayerStyle(OVERLAY_Z_INDEX.modal, style) }));
+});
+AlertDialogOverlay.displayName = "AlertDialogOverlay";
+const AlertDialogContent = React.forwardRef(({ className, overlayClassName, style, ...props }, ref) => {
+    const { open, setOpen, contentRef } = useAlertDialogContext("AlertDialogContent");
+    useFocusTrap(contentRef, open);
+    React.useEffect(() => {
+        if (!open)
+            return;
+        const handleKeyDown = (event) => {
+            if (event.key === "Escape") {
+                event.stopPropagation();
+                setOpen(false);
+            }
+        };
+        document.addEventListener("keydown", handleKeyDown);
+        return () => document.removeEventListener("keydown", handleKeyDown);
+    }, [open, setOpen]);
+    if (!open)
+        return null;
+    return (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, { className: overlayClassName }), _jsx("div", { ref: composeRefs(ref, contentRef), role: "alertdialog", "aria-modal": "true", "data-slot": "alert-dialog-content", "data-state": "open", tabIndex: -1, className: cn("glass 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 fixed top-[50%] left-[50%] z-[11000] grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-2xl p-6 shadow-2xl duration-200 sm:max-w-lg overflow-hidden", className), ...props, style: fixedLayerStyle(OVERLAY_Z_INDEX.modal, style) })] }));
+});
+AlertDialogContent.displayName = "AlertDialogContent";
+const AlertDialogHeader = ({ className, ...props }) => (_jsx("div", { "data-slot": "alert-dialog-header", className: cn("flex flex-col gap-2 text-center", className), ...props }));
+AlertDialogHeader.displayName = "AlertDialogHeader";
+const AlertDialogFooter = ({ className, ...props }) => (_jsx("div", { "data-slot": "alert-dialog-footer", className: cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-between border-t border-border/50 pt-4", className), ...props }));
+AlertDialogFooter.displayName = "AlertDialogFooter";
+const AlertDialogTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx("h2", { ref: ref, "data-slot": "alert-dialog-title", className: cn("text-xl font-bold leading-tight tracking-tight text-center", className), ...props })));
+AlertDialogTitle.displayName = "AlertDialogTitle";
+const AlertDialogDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx("p", { ref: ref, "data-slot": "alert-dialog-description", className: cn("text-sm leading-relaxed text-foreground/70 text-center", className), ...props })));
+AlertDialogDescription.displayName = "AlertDialogDescription";
+const AlertDialogAction = React.forwardRef(({ className, onClick, ...props }, ref) => {
+    const { setOpen } = useAlertDialogContext("AlertDialogAction");
+    return (_jsx("button", { ref: ref, type: "button", className: cn(buttonVariants({ size: "lg" }), "px-8", className), ...props, onClick: (event) => {
+            onClick?.(event);
+            if (!event.defaultPrevented)
+                setOpen(false);
+        } }));
+});
+AlertDialogAction.displayName = "AlertDialogAction";
+const AlertDialogCancel = React.forwardRef(({ className, onClick, ...props }, ref) => {
+    const { setOpen } = useAlertDialogContext("AlertDialogCancel");
+    return (_jsx("button", { ref: ref, type: "button", className: cn(buttonVariants({ variant: "outline", size: "lg" }), "px-8 border-2", className), ...props, onClick: (event) => {
+            onClick?.(event);
+            if (!event.defaultPrevented)
+                setOpen(false);
+        } }));
+});
+AlertDialogCancel.displayName = "AlertDialogCancel";
+export { AlertDialog, AlertDialogPortal, AlertDialogOverlay, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, };

package/dist/primitives/Avatar.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+declare const Avatar: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+declare const AvatarImage: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>>;
+declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+/**
+ * Plain initials circle — use when {@link AvatarFallback} would stay hidden
+ * without an image load cycle (e.g. no {@link AvatarImage} child).
+ */
+declare function InitialsAvatar({ name, className, textClassName, }: {
+    name?: string | null;
+    className?: string;
+    textClassName?: string;
+}): React.JSX.Element;
+export { Avatar, AvatarImage, AvatarFallback, InitialsAvatar };
+//# sourceMappingURL=Avatar.d.ts.map

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

@@ -0,0 +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"}

package/dist/primitives/Avatar.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { getAvatarColor, getInitials } from "../lib/avatar-utils";
+import { cn } from "../lib/cn";
+const AvatarContext = React.createContext(null);
+const Avatar = React.forwardRef(({ className, children, ...props }, ref) => {
+    const [imageStatus, setImageStatus] = React.useState("idle");
+    const hasImage = React.Children.toArray(children).some((child) => React.isValidElement(child) &&
+        child.type?.displayName === "AvatarImage" &&
+        !!child.props.src);
+    return (_jsx(AvatarContext.Provider, { value: { imageStatus, setImageStatus }, children: _jsx("span", { ref: ref, "data-slot": "avatar", className: cn("relative flex size-10 shrink-0 overflow-hidden rounded-full", className), ...props, children: children }, hasImage ? "has-image" : "no-image") }));
+});
+Avatar.displayName = "Avatar";
+const AvatarImage = React.forwardRef(({ src, className, onLoad, onError, ...props }, ref) => {
+    const ctx = React.useContext(AvatarContext);
+    const setImageStatus = ctx?.setImageStatus;
+    React.useEffect(() => {
+        if (!src) {
+            setImageStatus?.("error");
+            return;
+        }
+        setImageStatus?.("loading");
+    }, [src, setImageStatus]);
+    if (!src)
+        return null;
+    return (_jsx("img", { ref: ref, "data-slot": "avatar-image", className: cn("aspect-square size-full", ctx?.imageStatus !== "loaded" && "hidden", className), src: src, onLoad: (event) => {
+            setImageStatus?.("loaded");
+            onLoad?.(event);
+        }, onError: (event) => {
+            setImageStatus?.("error");
+            onError?.(event);
+        }, ...props }));
+});
+AvatarImage.displayName = "AvatarImage";
+const AvatarFallback = React.forwardRef(({ className, ...props }, ref) => {
+    const ctx = React.useContext(AvatarContext);
+    const show = !ctx || ctx.imageStatus !== "loaded";
+    if (!show)
+        return null;
+    return (_jsx("span", { ref: ref, "data-slot": "avatar-fallback", className: cn("bg-muted flex size-full items-center justify-center rounded-full", className), ...props }));
+});
+AvatarFallback.displayName = "AvatarFallback";
+/**
+ * Plain initials circle — use when {@link AvatarFallback} would stay hidden
+ * without an image load cycle (e.g. no {@link AvatarImage} child).
+ */
+function InitialsAvatar({ name, className, textClassName, }) {
+    const n = name?.trim() || "User";
+    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 };