@kestack/web-platform 0.0.0-stage → 0.0.0

package/dist/components/hooks/use-scroll.js

@@ -0,0 +1,198 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+//#region src/components/hooks/use-scroll.ts
+/**
+* How close to the bottom (px) the user must be for auto-scroll to
+* re-engage.  Generous enough that momentum-deceleration, content
+* streaming between frames, and sub-pixel rounding can't prevent it.
+*/
+const REENGAGE_THRESHOLD = 80;
+function getEl(el) {
+	return el ?? document.scrollingElement ?? document.documentElement;
+}
+function getRootEl() {
+	return document.scrollingElement ?? document.documentElement;
+}
+function getScrollTop(el) {
+	return el ? el.scrollTop : window.scrollY;
+}
+function maxScroll(el) {
+	if (!el) {
+		const rootEl = getRootEl();
+		return rootEl.scrollHeight - rootEl.clientHeight;
+	}
+	return el.scrollHeight - el.clientHeight;
+}
+function nearBottom(el) {
+	return maxScroll(el) - getScrollTop(el) <= REENGAGE_THRESHOLD;
+}
+/**
+* Returns `true` on touch devices when an input-like element is focused.
+* Used to skip auto-scroll during virtual-keyboard resize events that
+* change the viewport but not the content.
+*/
+function hasVirtualKeyboardInput() {
+	if (!window.matchMedia("(pointer: coarse)").matches) return false;
+	const el = document.activeElement;
+	if (!el || el === document.body) return false;
+	const tag = el.tagName;
+	return tag === "INPUT" || tag === "TEXTAREA" || el.closest("[contenteditable]") != null;
+}
+function useScroll(element) {
+	const isRoot = element == null;
+	const stickyRef = useRef(true);
+	const [isAutoScrolling, setIsAutoScrolling] = useState(true);
+	const rafIdRef = useRef(null);
+	const cancelRaf = useCallback(() => {
+		if (rafIdRef.current !== null) {
+			cancelAnimationFrame(rafIdRef.current);
+			rafIdRef.current = null;
+		}
+	}, []);
+	const engage = useCallback(() => {
+		stickyRef.current = true;
+		setIsAutoScrolling(true);
+	}, []);
+	const disengage = useCallback(() => {
+		stickyRef.current = false;
+		setIsAutoScrolling(false);
+		cancelRaf();
+	}, [cancelRaf]);
+	const animateScrollTo = useCallback((target) => {
+		cancelRaf();
+		const el = getEl(element);
+		const start = isRoot ? getRootEl().scrollTop : el.scrollTop;
+		const distance = target - start;
+		if (Math.abs(distance) < 1) return;
+		const duration = Math.min(300, Math.max(150, Math.abs(distance) * .5));
+		const startTime = performance.now();
+		const step = (now) => {
+			const t = Math.min((now - startTime) / duration, 1);
+			const eased = 1 - Math.pow(1 - t, 3);
+			const next = start + distance * eased;
+			if (isRoot) getRootEl().scrollTop = next;
+			else el.scrollTop = next;
+			if (t < 1) rafIdRef.current = requestAnimationFrame(step);
+			else rafIdRef.current = null;
+		};
+		rafIdRef.current = requestAnimationFrame(step);
+	}, [element, cancelRaf]);
+	useEffect(() => {
+		const el = getEl(element);
+		const scrollEl = isRoot ? void 0 : el;
+		const observeTarget = isRoot ? document.body : el;
+		const snapToBottom = () => {
+			if (rafIdRef.current !== null) {
+				cancelAnimationFrame(rafIdRef.current);
+				rafIdRef.current = null;
+			}
+			if (isRoot) getRootEl().scrollTop = maxScroll();
+			else el.scrollTop = maxScroll(el);
+		};
+		if (stickyRef.current) snapToBottom();
+		const observer = new ResizeObserver(() => {
+			if (hasVirtualKeyboardInput()) return;
+			if (stickyRef.current) snapToBottom();
+			else if (nearBottom(scrollEl)) {
+				engage();
+				snapToBottom();
+			}
+		});
+		observer.observe(observeTarget);
+		return () => observer.disconnect();
+	}, [element, engage]);
+	useEffect(() => {
+		const scrollEl = isRoot ? void 0 : getEl(element);
+		const target = isRoot ? window : getEl(element);
+		let lastScrollTop = getScrollTop(scrollEl);
+		const handleScroll = () => {
+			const current = getScrollTop(scrollEl);
+			const goingDown = current >= lastScrollTop;
+			lastScrollTop = current;
+			if (stickyRef.current) return;
+			if (goingDown && nearBottom(scrollEl)) engage();
+		};
+		const handleWheel = (e) => {
+			const { deltaY } = e;
+			if (deltaY < 0 && stickyRef.current && maxScroll(scrollEl) > 0) {
+				disengage();
+				return;
+			}
+			if (deltaY > 0 && !stickyRef.current && nearBottom(scrollEl)) engage();
+		};
+		const handleTouchMove = () => {
+			if (stickyRef.current) disengage();
+		};
+		target.addEventListener("scroll", handleScroll, { passive: true });
+		target.addEventListener("wheel", handleWheel, { passive: true });
+		target.addEventListener("touchmove", handleTouchMove, { passive: true });
+		return () => {
+			target.removeEventListener("scroll", handleScroll);
+			target.removeEventListener("wheel", handleWheel);
+			target.removeEventListener("touchmove", handleTouchMove);
+		};
+	}, [
+		element,
+		engage,
+		disengage,
+		isRoot
+	]);
+	const scrollDownBy = useCallback((px) => {
+		const el = getEl(element);
+		animateScrollTo(getScrollTop(isRoot ? void 0 : el) + px);
+	}, [
+		element,
+		animateScrollTo,
+		isRoot
+	]);
+	const scrollUpBy = useCallback((px) => {
+		const el = getEl(element);
+		animateScrollTo(getScrollTop(isRoot ? void 0 : el) - px);
+	}, [
+		element,
+		animateScrollTo,
+		isRoot
+	]);
+	const scrollToTop = useCallback(() => {
+		animateScrollTo(0);
+	}, [animateScrollTo]);
+	const scrollToEnd = useCallback(() => {
+		animateScrollTo(maxScroll(isRoot ? void 0 : getEl(element)));
+	}, [
+		element,
+		animateScrollTo,
+		isRoot
+	]);
+	/** Engage sticky mode and smooth-scroll to bottom. */
+	const alwaysScrollToBottom = useCallback(() => {
+		if (stickyRef.current) return;
+		engage();
+		animateScrollTo(maxScroll(isRoot ? void 0 : getEl(element)));
+	}, [
+		element,
+		engage,
+		animateScrollTo,
+		isRoot
+	]);
+	/** Disengage sticky mode. */
+	const stopAlwaysScrollToBottom = useCallback(() => {
+		disengage();
+	}, [disengage]);
+	useEffect(() => {
+		return () => {
+			if (rafIdRef.current !== null) cancelAnimationFrame(rafIdRef.current);
+		};
+	}, []);
+	return {
+		scrollDownBy,
+		scrollUpBy,
+		scrollToTop,
+		scrollToEnd,
+		alwaysScrollToBottom,
+		stopAlwaysScrollToBottom,
+		isAutoScrolling
+	};
+}
+//#endregion
+export { useScroll };
+
+//# sourceMappingURL=use-scroll.js.map

package/dist/components/hooks/use-scroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-scroll.js","names":[],"sources":["../../../src/components/hooks/use-scroll.ts"],"sourcesContent":["import { useRef, useState, useCallback, useEffect } from 'react';\n\n// ── Helpers ─────────────────────────────────────────────────────────────\n\n/**\n * How close to the bottom (px) the user must be for auto-scroll to\n * re-engage.  Generous enough that momentum-deceleration, content\n * streaming between frames, and sub-pixel rounding can't prevent it.\n */\nconst REENGAGE_THRESHOLD = 80;\n\nfunction getEl(el?: HTMLElement | null): HTMLElement {\n  return (\n    el ??\n    (document.scrollingElement as HTMLElement | null) ??\n    document.documentElement\n  );\n}\n\nfunction getRootEl(): HTMLElement {\n  return (\n    (document.scrollingElement as HTMLElement | null) ??\n    document.documentElement\n  );\n}\n\nfunction getScrollTop(el?: HTMLElement | null): number {\n  return el ? el.scrollTop : window.scrollY;\n}\n\nfunction maxScroll(el?: HTMLElement | null): number {\n  if (!el) {\n    const rootEl = getRootEl();\n    return rootEl.scrollHeight - rootEl.clientHeight;\n  }\n  return el.scrollHeight - el.clientHeight;\n}\n\nfunction nearBottom(el?: HTMLElement | null): boolean {\n  return maxScroll(el) - getScrollTop(el) <= REENGAGE_THRESHOLD;\n}\n\n/**\n * Returns `true` on touch devices when an input-like element is focused.\n * Used to skip auto-scroll during virtual-keyboard resize events that\n * change the viewport but not the content.\n */\nfunction hasVirtualKeyboardInput(): boolean {\n  if (!window.matchMedia('(pointer: coarse)').matches) return false;\n  const el = document.activeElement;\n  if (!el || el === document.body) return false;\n  const tag = el.tagName;\n  return (\n    tag === 'INPUT' ||\n    tag === 'TEXTAREA' ||\n    el.closest('[contenteditable]') != null\n  );\n}\n\n// ─────────────────────────────────────────────────────────────────────────\n// useScroll\n//\n// sticky=true  → pinned to bottom; content growth auto-tracked\n// sticky=false → user is in control\n//\n// Four mechanisms:\n//   1. Content tracking : ResizeObserver → snap when sticky,\n//                         re-engage + snap when user is near bottom\n//   2. Smooth scroll    : rAF + easeOutCubic (button click / API)\n//   3. Re-engage        : scroll-down near bottom, wheel-down near bottom\n//   4. Disengage        : wheel-up, touchmove\n// ─────────────────────────────────────────────────────────────────────────\n\nexport function useScroll(element?: HTMLElement | null) {\n  const isRoot = element == null;\n  const stickyRef = useRef(true);\n  const [isAutoScrolling, setIsAutoScrolling] = useState(true);\n  const rafIdRef = useRef<number | null>(null);\n\n  // ── Internal helpers ──────────────────────────────────────────────────\n\n  const cancelRaf = useCallback(() => {\n    if (rafIdRef.current !== null) {\n      cancelAnimationFrame(rafIdRef.current);\n      rafIdRef.current = null;\n    }\n  }, []);\n\n  const engage = useCallback(() => {\n    stickyRef.current = true;\n    setIsAutoScrolling(true);\n  }, []);\n\n  const disengage = useCallback(() => {\n    stickyRef.current = false;\n    setIsAutoScrolling(false);\n    cancelRaf();\n  }, [cancelRaf]);\n\n  // ── rAF smooth scroll ────────────────────────────────────────────────\n\n  const animateScrollTo = useCallback(\n    (target: number) => {\n      cancelRaf();\n      const el = getEl(element);\n      const start = isRoot ? getRootEl().scrollTop : el.scrollTop;\n      const distance = target - start;\n      if (Math.abs(distance) < 1) return;\n\n      const duration = Math.min(300, Math.max(150, Math.abs(distance) * 0.5));\n      const startTime = performance.now();\n\n      const step = (now: number) => {\n        const t = Math.min((now - startTime) / duration, 1);\n        const eased = 1 - Math.pow(1 - t, 3); // easeOutCubic\n        const next = start + distance * eased;\n        if (isRoot) {\n          getRootEl().scrollTop = next;\n        } else {\n          el.scrollTop = next;\n        }\n        if (t < 1) {\n          rafIdRef.current = requestAnimationFrame(step);\n        } else {\n          rafIdRef.current = null;\n        }\n      };\n\n      rafIdRef.current = requestAnimationFrame(step);\n    },\n    [element, cancelRaf],\n  );\n\n  // ── ResizeObserver ────────────────────────────────────────────────────\n  // When sticky → snap to bottom on any content growth.\n  // When NOT sticky but user is near bottom → re-engage and snap.\n  // This handles the streaming case where the user has parked near the\n  // bottom but no more scroll events fire (scrollTop didn't change).\n\n  useEffect(() => {\n    const el = getEl(element);\n    const scrollEl = isRoot ? undefined : el;\n    const observeTarget = isRoot ? document.body : el;\n\n    const snapToBottom = () => {\n      if (rafIdRef.current !== null) {\n        cancelAnimationFrame(rafIdRef.current);\n        rafIdRef.current = null;\n      }\n      if (isRoot) {\n        getRootEl().scrollTop = maxScroll();\n      } else {\n        el.scrollTop = maxScroll(el);\n      }\n    };\n\n    // Initial snap\n    if (stickyRef.current) snapToBottom();\n\n    const observer = new ResizeObserver(() => {\n      // On touch devices, skip all resize-driven snapping while an input\n      // is focused.  Virtual keyboard open/close AND input-field growth\n      // (typing more lines) both fire this observer and cause jarring\n      // jumps on mobile.\n      if (hasVirtualKeyboardInput()) return;\n\n      if (stickyRef.current) {\n        snapToBottom();\n      } else if (nearBottom(scrollEl)) {\n        engage();\n        snapToBottom();\n      }\n    });\n\n    observer.observe(observeTarget);\n    return () => observer.disconnect();\n  }, [element, engage]);\n\n  // ── Scroll / wheel / touch — engage & disengage ──────────────────────\n  //\n  // Re-engage (any one is sufficient):\n  //   • scroll event while scrolling DOWN and within REENGAGE_THRESHOLD\n  //   • wheel event with deltaY > 0  and within REENGAGE_THRESHOLD\n  //     (catches the edge where scrollTop === maxScroll → no scroll fires)\n  //\n  // Disengage:\n  //   • wheel event with deltaY < 0  (user scrolling up)\n  //   • touchmove event              (mobile drag)\n\n  useEffect(() => {\n    const scrollEl = isRoot ? undefined : getEl(element);\n    const target = isRoot ? window : getEl(element);\n    let lastScrollTop = getScrollTop(scrollEl);\n\n    // ── scroll: fires when scrollTop actually changes ──\n    const handleScroll = () => {\n      const current = getScrollTop(scrollEl);\n      const goingDown = current >= lastScrollTop;\n      lastScrollTop = current;\n\n      if (stickyRef.current) return;\n      if (goingDown && nearBottom(scrollEl)) {\n        engage();\n      }\n    };\n\n    // ── wheel: fires even at edges where scrollTop can't move ──\n    const handleWheel = (e: Event) => {\n      const { deltaY } = e as WheelEvent;\n\n      // Scrolling up → disengage (always, regardless of position).\n      if (deltaY < 0 && stickyRef.current && maxScroll(scrollEl) > 0) {\n        disengage();\n        return;\n      }\n\n      // Scrolling down while disengaged → re-engage if near bottom.\n      if (deltaY > 0 && !stickyRef.current && nearBottom(scrollEl)) {\n        engage();\n      }\n    };\n\n    // ── touch: any drag disengages (mobile) ──\n    const handleTouchMove = () => {\n      if (stickyRef.current) disengage();\n    };\n\n    target.addEventListener('scroll', handleScroll, { passive: true });\n    target.addEventListener('wheel', handleWheel, { passive: true });\n    target.addEventListener('touchmove', handleTouchMove, { passive: true });\n    return () => {\n      target.removeEventListener('scroll', handleScroll);\n      target.removeEventListener('wheel', handleWheel);\n      target.removeEventListener('touchmove', handleTouchMove);\n    };\n  }, [element, engage, disengage, isRoot]);\n\n  // ── Public API ────────────────────────────────────────────────────────\n\n  const scrollDownBy = useCallback(\n    (px: number) => {\n      const el = getEl(element);\n      animateScrollTo(getScrollTop(isRoot ? undefined : el) + px);\n    },\n    [element, animateScrollTo, isRoot],\n  );\n\n  const scrollUpBy = useCallback(\n    (px: number) => {\n      const el = getEl(element);\n      animateScrollTo(getScrollTop(isRoot ? undefined : el) - px);\n    },\n    [element, animateScrollTo, isRoot],\n  );\n\n  const scrollToTop = useCallback(() => {\n    animateScrollTo(0);\n  }, [animateScrollTo]);\n\n  const scrollToEnd = useCallback(() => {\n    animateScrollTo(maxScroll(isRoot ? undefined : getEl(element)));\n  }, [element, animateScrollTo, isRoot]);\n\n  /** Engage sticky mode and smooth-scroll to bottom. */\n  const alwaysScrollToBottom = useCallback(() => {\n    if (stickyRef.current) return;\n    engage();\n    animateScrollTo(maxScroll(isRoot ? undefined : getEl(element)));\n  }, [element, engage, animateScrollTo, isRoot]);\n\n  /** Disengage sticky mode. */\n  const stopAlwaysScrollToBottom = useCallback(() => {\n    disengage();\n  }, [disengage]);\n\n  // ── Cleanup ───────────────────────────────────────────────────────────\n  useEffect(() => {\n    return () => {\n      if (rafIdRef.current !== null) cancelAnimationFrame(rafIdRef.current);\n    };\n  }, []);\n\n  return {\n    scrollDownBy,\n    scrollUpBy,\n    scrollToTop,\n    scrollToEnd,\n    alwaysScrollToBottom,\n    stopAlwaysScrollToBottom,\n    isAutoScrolling,\n  };\n}\n"],"mappings":"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"}

package/dist/components/lib/lucide.d.ts

@@ -0,0 +1 @@
+export * from "lucide-react";

package/dist/components/lib/lucide.js

@@ -0,0 +1,10 @@
+import { __exportAll, __reExport } from "../../_virtual/_rolldown/runtime.js";
+export * from "lucide-react";
+//#region src/components/lib/lucide.ts
+var lucide_exports = /* @__PURE__ */ __exportAll({});
+import * as import_lucide_react from "lucide-react";
+__reExport(lucide_exports, import_lucide_react);
+//#endregion
+export { lucide_exports };
+
+//# sourceMappingURL=lucide.js.map

package/dist/components/lib/lucide.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lucide.js","names":[],"sources":["../../../src/components/lib/lucide.ts"],"sourcesContent":["export * from 'lucide-react';\n"],"mappings":""}

package/dist/components/lib/motion.d.ts

@@ -0,0 +1 @@
+export * from "motion/react";

package/dist/components/lib/motion.js

@@ -0,0 +1 @@
+export * from "motion/react";

package/dist/components/lib/scrollStyles.d.ts

@@ -0,0 +1,13 @@
+//#region src/components/lib/scrollStyles.d.ts
+/**
+ * Returns custom scrollbar styling classes for webkit browsers.
+ * Uses pointer-fine media query to only apply on devices with precise pointing (desktop).
+ *
+ * @returns String of Tailwind classes for custom scrollbars
+ */
+export declare const scrollbarStyles: string;
+export declare const scrollBar: (variant: 'default' | 'small' | 'none', { direction }?: {
+  direction: 'both' | 'vertical' | 'horizontal';
+}) => string;
+//#endregion
+//# sourceMappingURL=scrollStyles.d.ts.map

package/dist/components/lib/scrollStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollStyles.d.ts","names":[],"sources":["../../../src/components/lib/scrollStyles.ts"],"mappings":";;;;;;;qBAiBa;qBAMA,YAAS,yCACiB;EACX"}

package/dist/components/lib/scrollStyles.js

@@ -0,0 +1,19 @@
+import { cn } from "./utils.js";
+//#region src/components/lib/scrollStyles.ts
+const baseStyles = cn("pointer-fine:[&::-webkit-scrollbar-track]:bg-transparent", "pointer-fine:[&::-webkit-scrollbar-thumb]:bg-foreground/20", "pointer-fine:[&::-webkit-scrollbar-thumb]:rounded-full", "pointer-fine:[&::-webkit-scrollbar-thumb]:border-2", "pointer-fine:[&::-webkit-scrollbar-thumb]:border-transparent", "pointer-fine:[&::-webkit-scrollbar-thumb:hover]:bg-foreground/30", "pointer-fine:[&::-webkit-scrollbar-corner]:bg-transparent");
+/**
+* Returns custom scrollbar styling classes for webkit browsers.
+* Uses pointer-fine media query to only apply on devices with precise pointing (desktop).
+*
+* @returns String of Tailwind classes for custom scrollbars
+*/
+const scrollbarStyles = cn(baseStyles, "pointer-fine:[&::-webkit-scrollbar]:h-2", "pointer-fine:[&::-webkit-scrollbar]:w-2");
+const scrollBar = (variant, { direction = "both" } = { direction: "both" }) => cn(baseStyles, {
+	[cn((direction === "vertical" || direction === "both") && "pointer-fine:[&::-webkit-scrollbar]:h-0.5", (direction === "horizontal" || direction === "both") && "pointer-fine:[&::-webkit-scrollbar]:w-0.5")]: variant === "small",
+	"pointer-fine:[&::-webkit-scrollbar]:hidden": variant === "none",
+	[cn((direction === "vertical" || direction === "both") && "pointer-fine:[&::-webkit-scrollbar]:h-2", (direction === "horizontal" || direction === "both") && "pointer-fine:[&::-webkit-scrollbar]:w-2")]: variant === "default"
+});
+//#endregion
+export { scrollBar, scrollbarStyles };
+
+//# sourceMappingURL=scrollStyles.js.map

package/dist/components/lib/scrollStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollStyles.js","names":[],"sources":["../../../src/components/lib/scrollStyles.ts"],"sourcesContent":["import { cn } from '#lib/utils';\n\nconst baseStyles = cn(\n  'pointer-fine:[&::-webkit-scrollbar-track]:bg-transparent',\n  'pointer-fine:[&::-webkit-scrollbar-thumb]:bg-foreground/20',\n  'pointer-fine:[&::-webkit-scrollbar-thumb]:rounded-full',\n  'pointer-fine:[&::-webkit-scrollbar-thumb]:border-2',\n  'pointer-fine:[&::-webkit-scrollbar-thumb]:border-transparent',\n  'pointer-fine:[&::-webkit-scrollbar-thumb:hover]:bg-foreground/30',\n  'pointer-fine:[&::-webkit-scrollbar-corner]:bg-transparent',\n);\n/**\n * Returns custom scrollbar styling classes for webkit browsers.\n * Uses pointer-fine media query to only apply on devices with precise pointing (desktop).\n *\n * @returns String of Tailwind classes for custom scrollbars\n */\nexport const scrollbarStyles = cn(\n  baseStyles,\n  'pointer-fine:[&::-webkit-scrollbar]:h-2',\n  'pointer-fine:[&::-webkit-scrollbar]:w-2',\n);\n\nexport const scrollBar = (\n  variant: 'default' | 'small' | 'none',\n  { direction = 'both' }: { direction: 'both' | 'vertical' | 'horizontal' } = {\n    direction: 'both',\n  },\n) =>\n  cn(baseStyles, {\n    [cn(\n      (direction === 'vertical' || direction === 'both') &&\n        'pointer-fine:[&::-webkit-scrollbar]:h-0.5',\n      (direction === 'horizontal' || direction === 'both') &&\n        'pointer-fine:[&::-webkit-scrollbar]:w-0.5',\n    )]: variant === 'small',\n    'pointer-fine:[&::-webkit-scrollbar]:hidden': variant === 'none',\n    [cn(\n      (direction === 'vertical' || direction === 'both') &&\n        'pointer-fine:[&::-webkit-scrollbar]:h-2',\n      (direction === 'horizontal' || direction === 'both') &&\n        'pointer-fine:[&::-webkit-scrollbar]:w-2',\n    )]: variant === 'default',\n  });\n"],"mappings":";;AAEA,MAAM,aAAa,GACjB,4DACA,8DACA,0DACA,sDACA,gEACA,oEACA,2DACF;;;;;;;AAOA,MAAa,kBAAkB,GAC7B,YACA,2CACA,yCACF;AAEA,MAAa,aACX,SACA,EAAE,YAAY,WAA8D,EAC1E,WAAW,OACb,MAEA,GAAG,YAAY;EACZ,IACE,cAAc,cAAc,cAAc,WACzC,8CACD,cAAc,gBAAgB,cAAc,WAC3C,2CACJ,IAAI,YAAY;CAChB,8CAA8C,YAAY;EACzD,IACE,cAAc,cAAc,cAAc,WACzC,4CACD,cAAc,gBAAgB,cAAc,WAC3C,yCACJ,IAAI,YAAY;AAClB,CAAC"}

package/dist/components/lib/shadow-dom.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+//#region src/components/lib/shadow-dom.d.ts
+interface ShadowScopeProps extends React.HTMLAttributes<HTMLDivElement> {
+  css: string;
+  children: React.ReactNode;
+  theme?: 'dark' | 'light';
+}
+interface ShadowScopeContext {
+  shadowRoot: ShadowRoot | null;
+  portalContainer: HTMLDivElement | null;
+  theme?: 'dark' | 'light';
+}
+declare const ShadowScopeContext: React.Context<ShadowScopeContext>;
+export declare const useShadowScope: () => ShadowScopeContext;
+export declare const ShadowScope: ({ css, children, className, theme, style, ...props }: ShadowScopeProps) => React.JSX.Element;
+//#endregion
+//# sourceMappingURL=shadow-dom.d.ts.map

package/dist/components/lib/shadow-dom.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shadow-dom.d.ts","names":[],"sources":["../../../src/components/lib/shadow-dom.tsx"],"mappings":";;UASU,yBAAyB,MAAM,eAAe;EACtD;EACA,UAAU,MAAM;EAChB;;UAGQ;EACR,YAAY;EACZ,iBAAiB;EACjB;;cAGI,oBAAkB,MAAA,QAAA;qBAMX,sBAAc;qBAEd,gBAAW,KAAA,UAAA,WAAA,OAAA,UAAA,SAOrB,qBAAgB,MAAA,IAAA"}

package/dist/components/lib/shadow-dom.js

@@ -0,0 +1,50 @@
+import { createContext, useContext, useLayoutEffect, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { createPortal } from "react-dom";
+//#region src/components/lib/shadow-dom.tsx
+const ShadowScopeContext = createContext({
+	shadowRoot: null,
+	portalContainer: null,
+	theme: "dark"
+});
+const useShadowScope = () => useContext(ShadowScopeContext);
+const ShadowScope = ({ css, children, className, theme = "dark", style, ...props }) => {
+	const hostRef = useRef(null);
+	const [shadowRoot, setShadowRoot] = useState(null);
+	const [portalContainer, setPortalContainer] = useState(null);
+	useLayoutEffect(() => {
+		if (hostRef.current && !shadowRoot) {
+			const root = hostRef.current.attachShadow({ mode: "open" });
+			setShadowRoot(root);
+		}
+	}, []);
+	useLayoutEffect(() => {
+		if (shadowRoot) {
+			const sheet = new CSSStyleSheet();
+			sheet.replaceSync(css);
+			shadowRoot.adoptedStyleSheets = [sheet];
+		}
+	}, [shadowRoot, css]);
+	return /* @__PURE__ */ jsx("div", {
+		ref: hostRef,
+		children: shadowRoot && /* @__PURE__ */ jsx(ShadowScopeContext.Provider, {
+			value: {
+				shadowRoot,
+				portalContainer,
+				theme
+			},
+			children: createPortal(/* @__PURE__ */ jsx("div", {
+				...props,
+				ref: setPortalContainer,
+				className,
+				style,
+				"data-ktheme": theme,
+				children
+			}), shadowRoot)
+		})
+	});
+};
+//#endregion
+export { ShadowScope, useShadowScope };
+
+//# sourceMappingURL=shadow-dom.js.map

package/dist/components/lib/shadow-dom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shadow-dom.js","names":[],"sources":["../../../src/components/lib/shadow-dom.tsx"],"sourcesContent":["import React, {\n  useLayoutEffect,\n  useRef,\n  useState,\n  createContext,\n  useContext,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\ninterface ShadowScopeProps extends React.HTMLAttributes<HTMLDivElement> {\n  css: string; // Raw CSS string\n  children: React.ReactNode;\n  theme?: 'dark' | 'light';\n}\n\ninterface ShadowScopeContext {\n  shadowRoot: ShadowRoot | null;\n  portalContainer: HTMLDivElement | null;\n  theme?: 'dark' | 'light';\n}\n\nconst ShadowScopeContext = createContext<ShadowScopeContext>({\n  shadowRoot: null,\n  portalContainer: null,\n  theme: 'dark',\n});\n\nexport const useShadowScope = () => useContext(ShadowScopeContext);\n\nexport const ShadowScope = ({\n  css,\n  children,\n  className,\n  theme = 'dark',\n  style,\n  ...props\n}: ShadowScopeProps) => {\n  const hostRef = useRef<HTMLDivElement>(null);\n  const [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(null);\n  const [portalContainer, setPortalContainer] = useState<HTMLDivElement | null>(\n    null,\n  );\n\n  // 1. Initialize Shadow DOM (Runs once)\n  useLayoutEffect(() => {\n    if (hostRef.current && !shadowRoot) {\n      const root = hostRef.current.attachShadow({ mode: 'open' });\n      setShadowRoot(root);\n    }\n  }, []);\n\n  // 2. Sync Styles (Runs on mount + whenever css string changes)\n  useLayoutEffect(() => {\n    if (shadowRoot) {\n      const sheet = new CSSStyleSheet();\n      sheet.replaceSync(css);\n      shadowRoot.adoptedStyleSheets = [sheet];\n    }\n  }, [shadowRoot, css]);\n\n  // 3. Render\n  // We render the HOST div, but portal the children INSIDE the shadow root.\n  // Wrap in a div with className/style so portaled content (dropdowns) inherit theme.\n  return (\n    <div ref={hostRef}>\n      {shadowRoot && (\n        <ShadowScopeContext.Provider\n          value={{ shadowRoot, portalContainer, theme }}\n        >\n          {createPortal(\n            <div\n              {...props}\n              ref={setPortalContainer}\n              className={className}\n              style={style}\n              data-ktheme={theme}\n            >\n              {children}\n            </div>,\n            shadowRoot,\n          )}\n        </ShadowScopeContext.Provider>\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;;AAqBA,MAAM,qBAAqB,cAAkC;CAC3D,YAAY;CACZ,iBAAiB;CACjB,OAAO;AACT,CAAC;AAED,MAAa,uBAAuB,WAAW,kBAAkB;AAEjE,MAAa,eAAe,EAC1B,KACA,UACA,WACA,QAAQ,QACR,OACA,GAAG,YACmB;CACtB,MAAM,UAAU,OAAuB,IAAI;CAC3C,MAAM,CAAC,YAAY,iBAAiB,SAA4B,IAAI;CACpE,MAAM,CAAC,iBAAiB,sBAAsB,SAC5C,IACF;CAGA,sBAAsB;EACpB,IAAI,QAAQ,WAAW,CAAC,YAAY;GAClC,MAAM,OAAO,QAAQ,QAAQ,aAAa,EAAE,MAAM,OAAO,CAAC;GAC1D,cAAc,IAAI;EACpB;CACF,GAAG,CAAC,CAAC;CAGL,sBAAsB;EACpB,IAAI,YAAY;GACd,MAAM,QAAQ,IAAI,cAAc;GAChC,MAAM,YAAY,GAAG;GACrB,WAAW,qBAAqB,CAAC,KAAK;EACxC;CACF,GAAG,CAAC,YAAY,GAAG,CAAC;CAKpB,OACE,oBAAC,OAAD;EAAK,KAAK;EACP,UAAA,cACC,oBAAC,mBAAmB,UAApB;GACE,OAAO;IAAE;IAAY;IAAiB;GAAM;GAE3C,UAAA,aACC,oBAAC,OAAD;IACE,GAAI;IACJ,KAAK;IACM;IACJ;IACP,eAAa;IAEZ;GACE,CAAA,GACL,UACF;EAC2B,CAAA;CAE5B,CAAA;AAET"}

package/dist/components/lib/utils.d.ts

@@ -0,0 +1,5 @@
+import { ClassValue } from "clsx";
+//#region src/components/lib/utils.d.ts
+export declare function cn(...inputs: ClassValue[]): string;
+//#endregion
+//# sourceMappingURL=utils.d.ts.map

package/dist/components/lib/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","names":[],"sources":["../../../src/components/lib/utils.ts"],"mappings":";;wBAGgB,MAAM,QAAQ"}

package/dist/components/lib/utils.js

@@ -0,0 +1,10 @@
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+//#region src/components/lib/utils.ts
+function cn(...inputs) {
+	return twMerge(clsx(inputs));
+}
+//#endregion
+export { cn };
+
+//# sourceMappingURL=utils.js.map

package/dist/components/lib/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","names":[],"sources":["../../../src/components/lib/utils.ts"],"sourcesContent":["import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n"],"mappings":";;;AAGA,SAAgB,GAAG,GAAG,QAAsB;CAC1C,OAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B"}

package/dist/components/ui/accordion.d.ts

@@ -0,0 +1,9 @@
+import { Accordion as Accordion$1 } from "@base-ui/react/accordion";
+//#region src/components/ui/accordion.d.ts
+declare function Accordion({ className, ...props }: Accordion$1.Root.Props): import("react").JSX.Element;
+declare function AccordionItem({ className, ...props }: Accordion$1.Item.Props): import("react").JSX.Element;
+declare function AccordionTrigger({ className, children, ...props }: Accordion$1.Trigger.Props): import("react").JSX.Element;
+declare function AccordionContent({ className, children, ...props }: Accordion$1.Panel.Props): import("react").JSX.Element;
+//#endregion
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
+//# sourceMappingURL=accordion.d.ts.map

package/dist/components/ui/accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.d.ts","names":["AccordionPrimitive"],"sources":["../../../src/components/ui/accordion.tsx"],"mappings":";;iBAIS,YAAY,cAAc,SAASA,YAAmB,KAAK,wBAAK,IAAA;iBAUhE,gBAAgB,cAAc,SAASA,YAAmB,KAAK,wBAAK,IAAA;iBAUpE,mBACP,WACA,aACG,SACFA,YAAmB,QAAQ,wBAAK,IAAA;iBAmB1B,mBACP,WACA,aACG,SACFA,YAAmB,MAAM,wBAAK,IAAA"}

package/dist/components/ui/accordion.js

@@ -0,0 +1,55 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "cn";
+import { ChevronDownIcon, ChevronUpIcon } from "lucide-react";
+import { Accordion as Accordion$1 } from "@base-ui/react/accordion";
+//#region src/components/ui/accordion.tsx
+function Accordion({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion$1.Root, {
+		"data-slot": "accordion",
+		className: cn("flex w-full flex-col", className),
+		...props
+	});
+}
+function AccordionItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion$1.Item, {
+		"data-slot": "accordion-item",
+		className: cn("not-last:border-b", className),
+		...props
+	});
+}
+function AccordionTrigger({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion$1.Header, {
+		className: "flex",
+		children: /* @__PURE__ */ jsxs(Accordion$1.Trigger, {
+			"data-slot": "accordion-trigger",
+			className: cn("group/accordion-trigger relative flex flex-1 items-start justify-between rounded-md border border-transparent py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground", className),
+			...props,
+			children: [
+				children,
+				/* @__PURE__ */ jsx(ChevronDownIcon, {
+					"data-slot": "accordion-trigger-icon",
+					className: "pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden"
+				}),
+				/* @__PURE__ */ jsx(ChevronUpIcon, {
+					"data-slot": "accordion-trigger-icon",
+					className: "pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline"
+				})
+			]
+		})
+	});
+}
+function AccordionContent({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Accordion$1.Panel, {
+		"data-slot": "accordion-content",
+		className: "overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up",
+		...props,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("h-(--accordion-panel-height) pt-0 pb-4 data-ending-style:h-0 data-starting-style:h-0 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4", className),
+			children
+		})
+	});
+}
+//#endregion
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
+
+//# sourceMappingURL=accordion.js.map

package/dist/components/ui/accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.js","names":["AccordionPrimitive"],"sources":["../../../src/components/ui/accordion.tsx"],"sourcesContent":["import { Accordion as AccordionPrimitive } from \"@base-ui/react/accordion\"\nimport { cn } from \"cn\"\nimport { ChevronDownIcon, ChevronUpIcon } from \"lucide-react\"\n\nfunction Accordion({ className, ...props }: AccordionPrimitive.Root.Props) {\n  return (\n    <AccordionPrimitive.Root\n      data-slot=\"accordion\"\n      className={cn(\"flex w-full flex-col\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionItem({ className, ...props }: AccordionPrimitive.Item.Props) {\n  return (\n    <AccordionPrimitive.Item\n      data-slot=\"accordion-item\"\n      className={cn(\"not-last:border-b\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionTrigger({\n  className,\n  children,\n  ...props\n}: AccordionPrimitive.Trigger.Props) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          \"group/accordion-trigger relative flex flex-1 items-start justify-between rounded-md border border-transparent py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <ChevronDownIcon data-slot=\"accordion-trigger-icon\" className=\"pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden\" />\n        <ChevronUpIcon data-slot=\"accordion-trigger-icon\" className=\"pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline\" />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  )\n}\n\nfunction AccordionContent({\n  className,\n  children,\n  ...props\n}: AccordionPrimitive.Panel.Props) {\n  return (\n    <AccordionPrimitive.Panel\n      data-slot=\"accordion-content\"\n      className=\"overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up\"\n      {...props}\n    >\n      <div\n        className={cn(\n          \"h-(--accordion-panel-height) pt-0 pb-4 data-ending-style:h-0 data-starting-style:h-0 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4\",\n          className\n        )}\n      >\n        {children}\n      </div>\n    </AccordionPrimitive.Panel>\n  )\n}\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent }\n"],"mappings":";;;;;AAIA,SAAS,UAAU,EAAE,WAAW,GAAG,SAAwC;CACzE,OACE,oBAACA,YAAmB,MAApB;EACE,aAAU;EACV,WAAW,GAAG,wBAAwB,SAAS;EAC/C,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAwC;CAC7E,OACE,oBAACA,YAAmB,MAApB;EACE,aAAU;EACV,WAAW,GAAG,qBAAqB,SAAS;EAC5C,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,UACA,GAAG,SACgC;CACnC,OACE,oBAACA,YAAmB,QAApB;EAA2B,WAAU;EACnC,UAAA,qBAACA,YAAmB,SAApB;GACE,aAAU;GACV,WAAW,GACT,4fACA,SACF;GACA,GAAI;GANN,UAAA;IAQG;IACD,oBAAC,iBAAD;KAAiB,aAAU;KAAyB,WAAU;IAA6E,CAAA;IAC3I,oBAAC,eAAD;KAAe,aAAU;KAAyB,WAAU;IAAoF,CAAA;GACtH;;CACH,CAAA;AAE/B;AAEA,SAAS,iBAAiB,EACxB,WACA,UACA,GAAG,SAC8B;CACjC,OACE,oBAACA,YAAmB,OAApB;EACE,aAAU;EACV,WAAU;EACV,GAAI;EAEJ,UAAA,oBAAC,OAAD;GACE,WAAW,GACT,yLACA,SACF;GAEC;EACE,CAAA;CACmB,CAAA;AAE9B"}

package/dist/components/ui/alert-dialog.d.ts

@@ -0,0 +1,21 @@
+import { Button } from "./button.js";
+import * as React$1 from "react";
+import { AlertDialog as AlertDialog$1 } from "@base-ui/react/alert-dialog";
+//#region src/components/ui/alert-dialog.d.ts
+declare function AlertDialog({ ...props }: AlertDialog$1.Root.Props): React$1.JSX.Element;
+declare function AlertDialogTrigger({ ...props }: AlertDialog$1.Trigger.Props): React$1.JSX.Element;
+declare function AlertDialogPortal({ ...props }: AlertDialog$1.Portal.Props): React$1.JSX.Element;
+declare function AlertDialogOverlay({ className, ...props }: AlertDialog$1.Backdrop.Props): React$1.JSX.Element;
+declare function AlertDialogContent({ className, size, ...props }: AlertDialog$1.Popup.Props & {
+  size?: "default" | "sm";
+}): React$1.JSX.Element;
+declare function AlertDialogHeader({ className, ...props }: React$1.ComponentProps<"div">): React$1.JSX.Element;
+declare function AlertDialogFooter({ className, ...props }: React$1.ComponentProps<"div">): React$1.JSX.Element;
+declare function AlertDialogMedia({ className, ...props }: React$1.ComponentProps<"div">): React$1.JSX.Element;
+declare function AlertDialogTitle({ className, ...props }: React$1.ComponentProps<typeof AlertDialog$1.Title>): React$1.JSX.Element;
+declare function AlertDialogDescription({ className, ...props }: React$1.ComponentProps<typeof AlertDialog$1.Description>): React$1.JSX.Element;
+declare function AlertDialogAction({ className, ...props }: React$1.ComponentProps<typeof Button>): React$1.JSX.Element;
+declare function AlertDialogCancel({ className, variant, size, ...props }: AlertDialog$1.Close.Props & Pick<React$1.ComponentProps<typeof Button>, "variant" | "size">): React$1.JSX.Element;
+//#endregion
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };
+//# sourceMappingURL=alert-dialog.d.ts.map

package/dist/components/ui/alert-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog.d.ts","names":["AlertDialogPrimitive","React"],"sources":["../../../src/components/ui/alert-dialog.tsx"],"mappings":";;;;iBAMS,iBAAiB,SAASA,cAAqB,KAAK,QAAKC,QAAA,IAAA;iBAIzD,wBAAwB,SAASD,cAAqB,QAAQ,QAAKC,QAAA,IAAA;iBAMnE,uBAAuB,SAASD,cAAqB,OAAO,QAAKC,QAAA,IAAA;iBAMjE,qBACP,cACG,SACFD,cAAqB,SAAS,QAAKC,QAAA,IAAA;iBAa7B,qBACP,WACA,SACG,SACFD,cAAqB,MAAM;EAC5B;IACDC,QAAA,IAAA;iBAiBQ,oBACP,cACG,SACFA,QAAM,wBAAqBA,QAAA,IAAA;iBAarB,oBACP,cACG,SACFA,QAAM,wBAAqBA,QAAA,IAAA;iBAarB,mBACP,cACG,SACFA,QAAM,wBAAqBA,QAAA,IAAA;iBAarB,mBACP,cACG,SACFA,QAAM,sBAAsBD,cAAqB,SAAMC,QAAA,IAAA;iBAajD,yBACP,cACG,SACFA,QAAM,sBAAsBD,cAAqB,eAAYC,QAAA,IAAA;iBAavD,oBACP,cACG,SACFA,QAAM,sBAAsB,UAAOA,QAAA,IAAA;iBAU7B,oBACP,WACA,SACA,SACG,SACFD,cAAqB,MAAM,QAC5B,KAAKC,QAAM,sBAAsB,+BAA4BA,QAAA,IAAA"}

package/dist/components/ui/alert-dialog.js

@@ -0,0 +1,96 @@
+import { Button } from "./button.js";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "cn";
+import { AlertDialog as AlertDialog$1 } from "@base-ui/react/alert-dialog";
+//#region src/components/ui/alert-dialog.tsx
+function AlertDialog({ ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Root, {
+		"data-slot": "alert-dialog",
+		...props
+	});
+}
+function AlertDialogTrigger({ ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Trigger, {
+		"data-slot": "alert-dialog-trigger",
+		...props
+	});
+}
+function AlertDialogPortal({ ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Portal, {
+		"data-slot": "alert-dialog-portal",
+		...props
+	});
+}
+function AlertDialogOverlay({ className, ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Backdrop, {
+		"data-slot": "alert-dialog-overlay",
+		className: cn("fixed inset-0 isolate z-50 bg-black/10 dark:bg-black/75 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0", className),
+		...props
+	});
+}
+function AlertDialogContent({ className, size = "default", ...props }) {
+	return /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [/* @__PURE__ */ jsx(AlertDialogOverlay, {}), /* @__PURE__ */ jsx(AlertDialog$1.Popup, {
+		"data-slot": "alert-dialog-content",
+		"data-size": size,
+		className: cn("group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-6 rounded-xl bg-dialog p-6 text-popover-foreground ring-1 ring-edge duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-lg data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className),
+		...props
+	})] });
+}
+function AlertDialogHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-dialog-header",
+		className: cn("grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]", className),
+		...props
+	});
+}
+function AlertDialogFooter({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-dialog-footer",
+		className: cn("flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end", className),
+		...props
+	});
+}
+function AlertDialogMedia({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-dialog-media",
+		className: cn("mb-2 inline-flex size-16 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-8", className),
+		...props
+	});
+}
+function AlertDialogTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Title, {
+		"data-slot": "alert-dialog-title",
+		className: cn("text-lg font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2", className),
+		...props
+	});
+}
+function AlertDialogDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Description, {
+		"data-slot": "alert-dialog-description",
+		className: cn("text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground", className),
+		...props
+	});
+}
+function AlertDialogAction({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Button, {
+		"data-slot": "alert-dialog-action",
+		className: cn(className),
+		...props
+	});
+}
+function AlertDialogCancel({ className, variant = "outline", size = "default", ...props }) {
+	return /* @__PURE__ */ jsx(AlertDialog$1.Close, {
+		"data-slot": "alert-dialog-cancel",
+		className: cn(className),
+		render: /* @__PURE__ */ jsx(Button, {
+			variant,
+			size
+		}),
+		...props
+	});
+}
+//#endregion
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };
+
+//# sourceMappingURL=alert-dialog.js.map

package/dist/components/ui/alert-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog.js","names":["AlertDialogPrimitive"],"sources":["../../../src/components/ui/alert-dialog.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-dialog\"\nimport { cn } from \"cn\"\n\nimport { Button } from \"#components/ui/button\"\n\nfunction AlertDialog({ ...props }: AlertDialogPrimitive.Root.Props) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />\n}\n\nfunction AlertDialogTrigger({ ...props }: AlertDialogPrimitive.Trigger.Props) {\n  return (\n    <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n  )\n}\n\nfunction AlertDialogPortal({ ...props }: AlertDialogPrimitive.Portal.Props) {\n  return (\n    <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n  )\n}\n\nfunction AlertDialogOverlay({\n  className,\n  ...props\n}: AlertDialogPrimitive.Backdrop.Props) {\n  return (\n    <AlertDialogPrimitive.Backdrop\n      data-slot=\"alert-dialog-overlay\"\n      className={cn(\n        \"fixed inset-0 isolate z-50 bg-black/10 dark:bg-black/75 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogContent({\n  className,\n  size = \"default\",\n  ...props\n}: AlertDialogPrimitive.Popup.Props & {\n  size?: \"default\" | \"sm\"\n}) {\n  return (\n    <AlertDialogPortal>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Popup\n        data-slot=\"alert-dialog-content\"\n        data-size={size}\n        className={cn(\n          \"group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-6 rounded-xl bg-dialog p-6 text-popover-foreground ring-1 ring-edge duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-lg data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\",\n          className\n        )}\n        {...props}\n      />\n    </AlertDialogPortal>\n  )\n}\n\nfunction AlertDialogHeader({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(\n        \"grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogFooter({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(\n        \"flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogMedia({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-media\"\n      className={cn(\n        \"mb-2 inline-flex size-16 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-8\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n  return (\n    <AlertDialogPrimitive.Title\n      data-slot=\"alert-dialog-title\"\n      className={cn(\n        \"text-lg font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n  return (\n    <AlertDialogPrimitive.Description\n      data-slot=\"alert-dialog-description\"\n      className={cn(\n        \"text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogAction({\n  className,\n  ...props\n}: React.ComponentProps<typeof Button>) {\n  return (\n    <Button\n      data-slot=\"alert-dialog-action\"\n      className={cn(className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogCancel({\n  className,\n  variant = \"outline\",\n  size = \"default\",\n  ...props\n}: AlertDialogPrimitive.Close.Props &\n  Pick<React.ComponentProps<typeof Button>, \"variant\" | \"size\">) {\n  return (\n    <AlertDialogPrimitive.Close\n      data-slot=\"alert-dialog-cancel\"\n      className={cn(className)}\n      render={<Button variant={variant} size={size} />}\n      {...props}\n    />\n  )\n}\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogMedia,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n}\n"],"mappings":";;;;;;AAMA,SAAS,YAAY,EAAE,GAAG,SAA0C;CAClE,OAAO,oBAACA,cAAqB,MAAtB;EAA2B,aAAU;EAAe,GAAI;CAAQ,CAAA;AACzE;AAEA,SAAS,mBAAmB,EAAE,GAAG,SAA6C;CAC5E,OACE,oBAACA,cAAqB,SAAtB;EAA8B,aAAU;EAAuB,GAAI;CAAQ,CAAA;AAE/E;AAEA,SAAS,kBAAkB,EAAE,GAAG,SAA4C;CAC1E,OACE,oBAACA,cAAqB,QAAtB;EAA6B,aAAU;EAAsB,GAAI;CAAQ,CAAA;AAE7E;AAEA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACmC;CACtC,OACE,oBAACA,cAAqB,UAAtB;EACE,aAAU;EACV,WAAW,GACT,0MACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,mBAAmB,EAC1B,WACA,OAAO,WACP,GAAG,SAGF;CACD,OACE,qBAAC,mBAAD,EAAA,UAAA,CACE,oBAAC,oBAAD,CAAqB,CAAA,GACrB,oBAACA,cAAqB,OAAtB;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,oaACA,SACF;EACA,GAAI;CACL,CAAA,CACgB,EAAA,CAAA;AAEvB;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SAC2B;CAC9B,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,sZACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SAC2B;CAC9B,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,+JACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SAC2B;CAC9B,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,8KACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,oBAACA,cAAqB,OAAtB;EACE,aAAU;EACV,WAAW,GACT,mJACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;CAChE,OACE,oBAACA,cAAqB,aAAtB;EACE,aAAU;EACV,WAAW,GACT,kIACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SACmC;CACtC,OACE,oBAAC,QAAD;EACE,aAAU;EACV,WAAW,GAAG,SAAS;EACvB,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,UAAU,WACV,OAAO,WACP,GAAG,SAE4D;CAC/D,OACE,oBAACA,cAAqB,OAAtB;EACE,aAAU;EACV,WAAW,GAAG,SAAS;EACvB,QAAQ,oBAAC,QAAD;GAAiB;GAAe;EAAO,CAAA;EAC/C,GAAI;CACL,CAAA;AAEL"}