asheeui 0.7.0 → 1.0.0

package/dist/components/carousel/Carousel.js

@@ -1,124 +1,126 @@
 "use client";
 "use client";
 import { cn as e } from "../../utils/cn.js";
-import { useAsheeConfig as t } from "../../libs/context.js";
-import { RADIUS_CLASS as n } from "../../shared/radius.js";
-import { resolveCascade as r, resolveClassKey as i, resolveRadiusKey as a } from "../../utils/resolve-token.js";
-import { ChevronLeftIcon as ee } from "../../icons/ChevronLeftIcon.js";
+import { RADIUS_CLASS as t } from "../../shared/radius.js";
+import { useAsheeConfig as n } from "../../libs/context.js";
+import { resolveCascade as r, resolveClassKey as i, resolveRadiusKey as ee } from "../../utils/resolve-token.js";
 import { ChevronRightIcon as te } from "../../icons/ChevronRightIcon.js";
-import { FALLBACK_CAROUSEL_CONFIG as o } from "./carousel-config.js";
-import { CAROUSEL_HEIGHT_CLASS as ne, CAROUSEL_PADDING_CLASS as s, CAROUSEL_VARIANT_CLASS as c } from "./carousel-styles.js";
-import { forwardRef as l, useCallback as u, useEffect as re, useId as ie, useMemo as ae, useRef as oe, useState as d } from "react";
-import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+import { ChevronLeftIcon as ne } from "../../icons/ChevronLeftIcon.js";
+import { usePrefersReducedMotion as re } from "../../libs/use-prefers-reduced-motion.js";
+import { FALLBACK_CAROUSEL_CONFIG as a } from "./carousel-config.js";
+import { CAROUSEL_HEIGHT_CLASS as o, CAROUSEL_PADDING_CLASS as s, CAROUSEL_VARIANT_CLASS as c } from "./carousel-styles.js";
+import { forwardRef as l, useCallback as u, useEffect as ie, useId as ae, useMemo as oe, useRef as se, useState as d } from "react";
+import { Fragment as ce, jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/components/carousel/Carousel.tsx
-var h = 50, g = l(({ items: l = [], variant: g, size: se, radius: ce, autoPlay: le, autoPlayInterval: ue, loop: de, showControls: fe, showIndicators: _, pauseOnHover: v, disableAnimation: pe = !1, defaultIndex: me = 0, index: y, onIndexChange: b, renderPrevControl: x, renderNextControl: S, itemClassName: he, controlClassName: C, indicatorClassName: ge, className: _e, style: ve, children: w, id: T, ...E }, D) => {
-	let O = t(), k = O.components?.carousel, A = ie(), j = T ?? A, M = r(se, k?.size, void 0, o.size), N = r(g, k?.variant, O.defaultVariant, o.variant), P = a(ce, k?.radius, O.defaultRadius, o.radius), F = r(le, k?.autoPlay, void 0, o.autoPlay), I = r(ue, k?.autoPlayInterval, void 0, o.autoPlayInterval), L = r(de, k?.loop, void 0, o.loop), ye = r(fe, k?.showControls, void 0, o.showControls), be = r(_, k?.showIndicators, void 0, o.showIndicators), R = r(v, k?.pauseOnHover, void 0, o.pauseOnHover), xe = i(M, ne, o.size), Se = i(M, s, o.size), Ce = i(P, n, o.radius), we = c[N] ?? c.bordered, z = ae(() => l.length > 0 ? l : w ? (Array.isArray(w) ? w : [w]).map((e, t) => ({
+var le = 50, m = l(({ items: l = [], variant: m, size: ue, radius: de, autoPlay: h, autoPlayInterval: g, loop: fe, showControls: pe, showIndicators: me, pauseOnHover: he, disableAnimation: ge = !1, defaultIndex: _e = 0, index: _, onIndexChange: v, renderPrevControl: y, renderNextControl: b, itemClassName: ve, controlClassName: x, indicatorClassName: ye, className: be, style: xe, children: S, id: C, ...w }, T) => {
+	let E = n(), D = E.components?.carousel, O = ae(), k = C ?? O, A = r(ue, D?.size, void 0, a.size), j = r(m, D?.variant, E.defaultVariant, a.variant), M = ee(de, D?.radius, E.defaultRadius, a.radius), N = r(h, D?.autoPlay, void 0, a.autoPlay), P = r(g, D?.autoPlayInterval, void 0, a.autoPlayInterval), F = r(fe, D?.loop, void 0, a.loop), I = r(pe, D?.showControls, void 0, a.showControls), Se = r(me, D?.showIndicators, void 0, a.showIndicators), L = r(he, D?.pauseOnHover, void 0, a.pauseOnHover), Ce = i(A, o, a.size), we = i(A, s, a.size), Te = i(M, t, a.radius), Ee = c[j] ?? c.bordered, R = oe(() => l.length > 0 ? l : S ? (Array.isArray(S) ? S : [S]).map((e, t) => ({
 		id: `slide-${t}`,
 		content: e
-	})) : [], [l, w]), B = y !== void 0, [Te, V] = d(me), H = B ? y : Te, [U, W] = d(!1), [G, K] = d(!1), [q, J] = d(0), Y = oe(0), X = u((e) => {
-		if (z.length <= 1) return;
-		let t = H + e;
-		t < 0 ? t = L ? z.length - 1 : 0 : t >= z.length && (t = L ? 0 : z.length - 1), t !== H && (B || V(t), b?.(t));
+	})) : [], [l, S]), z = _ !== void 0, [De, B] = d(_e), V = z ? _ : De, [H, U] = d(!1), [W, G] = d(!1), [K, q] = d(0), J = se(0), Y = u((e) => {
+		if (R.length <= 1) return;
+		let t = V + e;
+		t < 0 ? t = F ? R.length - 1 : 0 : t >= R.length && (t = F ? 0 : R.length - 1), t !== V && (z || B(t), v?.(t));
 	}, [
-		H,
-		z.length,
-		L,
-		B,
-		b
-	]), Ee = u((e) => {
-		e === H || e < 0 || e >= z.length || (B || V(e), b?.(e));
+		V,
+		R.length,
+		F,
+		z,
+		v
+	]), Oe = u((e) => {
+		e === V || e < 0 || e >= R.length || (z || B(e), v?.(e));
 	}, [
-		H,
-		z.length,
-		B,
-		b
-	]);
-	re(() => {
-		if (!F || R && U || G || z.length <= 1) return;
+		V,
+		R.length,
+		z,
+		v
+	]), X = re();
+	ie(() => {
+		if (!N || X || L && H || W || R.length <= 1) return;
 		let e = setInterval(() => {
-			X(1);
-		}, I);
+			Y(1);
+		}, P);
 		return () => clearInterval(e);
 	}, [
-		F,
-		I,
-		R,
-		U,
-		G,
-		z.length,
-		X
+		N,
+		P,
+		L,
+		H,
+		W,
+		X,
+		R.length,
+		Y
 	]);
-	let De = (e) => {
-		e.target.closest("button") || (K(!0), Y.current = e.clientX, J(0), e.currentTarget.setPointerCapture(e.pointerId));
-	}, Oe = (e) => {
-		if (!G) return;
-		let t = e.clientX - Y.current;
-		J(t);
+	let ke = (e) => {
+		e.target.closest("button") || (G(!0), J.current = e.clientX, q(0), e.currentTarget.setPointerCapture(e.pointerId));
+	}, Ae = (e) => {
+		if (!W) return;
+		let t = e.clientX - J.current;
+		q(t);
 	}, Z = () => {
-		G && (K(!1), q < -50 ? X(1) : q > h && X(-1), J(0));
-	}, Q = !L && H === 0, $ = !L && H === z.length - 1;
-	return /* @__PURE__ */ m("div", {
-		ref: D,
-		id: j,
-		onMouseEnter: () => W(!0),
-		onMouseLeave: () => W(!1),
-		onFocus: () => W(!0),
-		onBlur: () => W(!1),
-		className: e("relative scrollbar-hide overflow-hidden w-full select-none flex flex-col group", we, Ce, xe, _e),
-		style: ve,
-		...E,
+		W && (G(!1), K < -50 ? Y(1) : K > le && Y(-1), q(0));
+	}, Q = !F && V === 0, $ = !F && V === R.length - 1;
+	return /* @__PURE__ */ p("div", {
+		ref: T,
+		id: k,
+		onMouseEnter: () => U(!0),
+		onMouseLeave: () => U(!1),
+		onFocus: () => U(!0),
+		onBlur: () => U(!1),
+		className: e("relative scrollbar-hide overflow-hidden w-full select-none flex flex-col group", Ee, Te, Ce, be),
+		style: xe,
+		...w,
 		children: [
-			/* @__PURE__ */ p("div", {
-				onPointerDown: De,
-				onPointerMove: Oe,
+			/* @__PURE__ */ f("div", {
+				onPointerDown: ke,
+				onPointerMove: Ae,
 				onPointerUp: Z,
 				onPointerCancel: Z,
 				className: "relative w-full h-full scrollbar-hide overflow-hidden flex-1 touch-pan-y cursor-grab active:cursor-grabbing",
-				children: /* @__PURE__ */ p("div", {
-					className: e("flex w-full h-full", !G && !pe && "transition-transform duration-300 ease-out"),
-					style: { transform: `translate3d(calc(${-H * 100}% + ${q}px), 0, 0)` },
-					children: z.map((t, n) => /* @__PURE__ */ p("div", {
-						className: e("w-full h-full shrink-0 flex items-center justify-center scrollbar-hide overflow-hidden", Se, he),
+				children: /* @__PURE__ */ f("div", {
+					className: e("flex w-full h-full", !W && !ge && !X && "transition-transform duration-300 ease-out"),
+					style: { transform: `translate3d(calc(${-V * 100}% + ${K}px), 0, 0)` },
+					children: R.map((t, n) => /* @__PURE__ */ f("div", {
+						className: e("w-full h-full shrink-0 flex items-center justify-center scrollbar-hide overflow-hidden", we, ve),
 						children: t.content
 					}, t.id || n))
 				})
 			}),
-			ye && z.length > 1 && /* @__PURE__ */ m(f, { children: [x ? x({
-				onClick: () => X(-1),
+			I && R.length > 1 && /* @__PURE__ */ p(ce, { children: [y ? y({
+				onClick: () => Y(-1),
 				disabled: Q
-			}) : /* @__PURE__ */ p("button", {
+			}) : /* @__PURE__ */ f("button", {
 				type: "button",
 				"aria-label": "Previous Slide",
 				disabled: Q,
-				onClick: () => X(-1),
-				className: e("absolute left-3 top-1/2 -translate-y-1/2 z-20 p-2.5 rounded-full bg-background/80 hover:bg-background text-foreground border border-border/50 backdrop-blur-md shadow-md transition-all duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary disabled:opacity-30 disabled:cursor-not-allowed", C),
-				children: /* @__PURE__ */ p(ee, { className: "w-5 h-5" })
-			}), S ? S({
-				onClick: () => X(1),
+				onClick: () => Y(-1),
+				className: e("absolute left-3 top-1/2 -translate-y-1/2 z-20 p-2.5 rounded-full bg-background/80 hover:bg-background text-foreground border border-border/50 backdrop-blur-md shadow-md transition-all duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary disabled:opacity-30 disabled:cursor-not-allowed", x),
+				children: /* @__PURE__ */ f(ne, { className: "w-5 h-5" })
+			}), b ? b({
+				onClick: () => Y(1),
 				disabled: $
-			}) : /* @__PURE__ */ p("button", {
+			}) : /* @__PURE__ */ f("button", {
 				type: "button",
 				"aria-label": "Next Slide",
 				disabled: $,
-				onClick: () => X(1),
-				className: e("absolute right-3 top-1/2 -translate-y-1/2 z-20 p-2.5 rounded-full bg-background/80 hover:bg-background text-foreground border border-border/50 backdrop-blur-md shadow-md transition-all duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary disabled:opacity-30 disabled:cursor-not-allowed", C),
-				children: /* @__PURE__ */ p(te, { className: "w-5 h-5" })
+				onClick: () => Y(1),
+				className: e("absolute right-3 top-1/2 -translate-y-1/2 z-20 p-2.5 rounded-full bg-background/80 hover:bg-background text-foreground border border-border/50 backdrop-blur-md shadow-md transition-all duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary disabled:opacity-30 disabled:cursor-not-allowed", x),
+				children: /* @__PURE__ */ f(te, { className: "w-5 h-5" })
 			})] }),
-			be && z.length > 1 && /* @__PURE__ */ p("div", {
+			Se && R.length > 1 && /* @__PURE__ */ f("div", {
 				className: "absolute bottom-3 inset-x-0 z-20 flex justify-center items-center gap-1.5 pointer-events-none",
-				children: /* @__PURE__ */ p("div", {
-					className: "flex items-center gap-1.5 p-1.5 rounded-full bg-background/40 backdrop-blur-md pointer-events-auto border border-white/10",
-					children: z.map((t, n) => /* @__PURE__ */ p("button", {
+				children: /* @__PURE__ */ f("div", {
+					className: "flex items-center gap-1.5 p-1.5 rounded-full bg-background/40 backdrop-blur-md pointer-events-auto border border-foreground/10",
+					children: R.map((t, n) => /* @__PURE__ */ f("button", {
 						type: "button",
 						"aria-label": `Go to slide ${n + 1}`,
-						onClick: () => Ee(n),
-						className: e("h-2 rounded-full transition-all duration-300 focus:outline-none focus-visible:ring-1 focus-visible:ring-primary", n === H ? "w-6 bg-primary" : "w-2 bg-foreground/40 hover:bg-foreground/70", ge)
+						onClick: () => Oe(n),
+						className: e("h-2 rounded-full transition-all duration-300 focus:outline-none focus-visible:ring-1 focus-visible:ring-primary", n === V ? "w-6 bg-primary" : "w-2 bg-foreground/40 hover:bg-foreground/70", ye)
 					}, t.id || n))
 				})
 			})
 		]
 	});
 });
-g.displayName = "Carousel";
+m.displayName = "Carousel";
 //#endregion
-export { g as Carousel };
+export { m as Carousel };

package/dist/components/carousel/carousel-styles.d.ts

@@ -10,26 +10,7 @@ export declare const CAROUSEL_HEIGHT_CLASS: Record<Size, string>;
  * Controls the internal padding of each slide.
  */
 export declare const CAROUSEL_PADDING_CLASS: Record<Size, string>;
-/**import type { Size } from "../../shared";
-import type { CarouselVariant } from "./carousel-config";
-
-export const CAROUSEL_HEIGHT_CLASS: Record<Size, string> = {
-  sm: "h-60 md:h-80",
-  md: "h-80 md:h-[420px]",
-  lg: "h-[400px] md:h-[520px]",
-};
-
-export const CAROUSEL_PADDING_CLASS: Record<Size, string> = {
-  sm: "p-4",
-  md: "p-6",
-  lg: "p-8",
-};
-
-export const CAROUSEL_VARIANT_CLASS: Record<CarouselVariant, string> = {
-  bordered: "bg-background border-2 border-border",
-  ghost: "bg-transparent",
-};
-
+/**
  * CSS classes for carousel variants.
  * Each variant has a distinct background and border treatment.
  */

package/dist/components/carousel/carousel-styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"carousel-styles.d.ts","sourceRoot":"","sources":["../../../src/components/carousel/carousel-styles.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEzD;;;GAGG;AACH,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAItD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAIvD,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,eAAe,EAAE,MAAM,CAGlE,CAAC"}
+{"version":3,"file":"carousel-styles.d.ts","sourceRoot":"","sources":["../../../src/components/carousel/carousel-styles.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEzD;;;GAGG;AACH,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAItD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAIvD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,eAAe,EAAE,MAAM,CAGlE,CAAC"}

package/dist/components/chip/Chip.js

@@ -1,9 +1,9 @@
 "use client";
 "use client";
 import { cn as e } from "../../utils/cn.js";
-import { useAsheeConfig as t } from "../../libs/context.js";
-import { RADIUS_CLASS as n } from "../../shared/radius.js";
-import { resolveVariantClass as r } from "../../shared/variant.js";
+import { RADIUS_CLASS as t } from "../../shared/radius.js";
+import { resolveVariantClass as n } from "../../shared/variant.js";
+import { useAsheeConfig as r } from "../../libs/context.js";
 import { resolveCascade as i, resolveClassKey as a, resolveRadiusKey as o } from "../../utils/resolve-token.js";
 import { CloseIcon as s } from "../../icons/CloseIcon.js";
 import { FALLBACK_CHIP_CONFIG as c } from "./chip-config.js";
@@ -12,7 +12,7 @@ import { forwardRef as m } from "react";
 import { jsx as h, jsxs as g } from "react/jsx-runtime";
 //#region src/components/chip/Chip.tsx
 var _ = m(({ variant: m, color: _, size: v, radius: y, isDisabled: b = !1, startIcon: x, endIcon: S, avatar: C, dot: w, onClose: T, closeIcon: E, children: D, className: O, style: k, onClick: A, ...j }, M) => {
-	let N = t(), P = N.components?.chip, F = i(m, P?.variant, N.defaultVariant, c.variant), I = F === "underlined" ? "bordered" : F, L = i(_, P?.color, N.defaultColor, c.color), R = i(v, P?.size, void 0, c.size), z = o(y, P?.radius, N.defaultRadius, c.radius), B = a(R, d, c.size), V = a(R, p, c.size), H = a(R, l, c.size), U = a(R, u, c.size), W = a(R, f, c.size), G = a(z, n, c.radius), K = (e) => {
+	let N = r(), P = N.components?.chip, F = i(m, P?.variant, N.defaultVariant, c.variant), I = F === "underlined" ? "bordered" : F, L = i(_, P?.color, N.defaultColor, c.color), R = i(v, P?.size, void 0, c.size), z = o(y, P?.radius, N.defaultRadius, c.radius), B = a(R, d, c.size), V = a(R, p, c.size), H = a(R, l, c.size), U = a(R, u, c.size), W = a(R, f, c.size), G = a(z, t, c.radius), K = (e) => {
 		e.stopPropagation(), !b && T?.(e);
 	};
 	return /* @__PURE__ */ g("div", {
@@ -44,7 +44,7 @@ var _ = m(({ variant: m, color: _, size: v, radius: y, isDisabled: b = !1, start
 				A?.(t);
 			}
 		},
-		className: e("inline-flex items-center font-medium transition-all duration-200 select-none shrink-0", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2", r(I, L), B, V, H, U, G, b && "opacity-50 pointer-events-none cursor-not-allowed", A && !b && "cursor-pointer hover:opacity-90 active:scale-[0.98]", O),
+		className: e("inline-flex items-center font-medium transition-all duration-200 select-none shrink-0", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2", n(I, L), B, V, H, U, G, b && "opacity-50 pointer-events-none cursor-not-allowed", A && !b && "cursor-pointer hover:opacity-90 active:scale-[0.98]", O),
 		style: k,
 		...j,
 		children: [

package/dist/components/drawer/Drawer.d.ts

@@ -55,9 +55,13 @@ export interface DrawerProps extends BaseDrawerProps {
  * the standard AsheeUI cascade: prop, component config, global theme
  * defaults, and the built-in fallback.
  *
- * The component automatically handles accessibility attributes including
- * role="dialog", aria-modal, and proper focus management. It manages
- * its own animation states to prevent transition flashes.
+ * The drawer renders in a portal with dialog semantics and locks body scroll
+ * while it is open. Focus moves into the drawer, cannot leave it, and returns
+ * to the element that was focused before it opened. The dialog element is the
+ * container that receives the consumer's attributes, so a consumer names the
+ * drawer with the standard `aria-label` or `aria-labelledby` attribute.
+ * The component manages its own animation states to prevent transition
+ * flashes.
  *
  * @param props - Drawer configuration options and HTML div props.
  * @param props.isOpen - Whether the drawer is open.
@@ -108,7 +112,7 @@ export interface DrawerProps extends BaseDrawerProps {
  *   onClose={onClose}
  *   placement="bottom"
  *   size="full"
- *   overlay={{ className: "bg-black/50" }}
+ *   overlay={{ className: "bg-background/80" }}
  * >
  *   <div className="p-6 max-h-[80vh] overflow-y-auto">
  *     {content}

package/dist/components/drawer/Drawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/Drawer.tsx"],"names":[],"mappings":"AASA,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,SAAS,EAIf,MAAM,OAAO,CAAC;AAKf,OAAO,EACL,KAAK,YAAY,EAIlB,MAAM,iBAAiB,CAAC;AASzB,KAAK,eAAe,GAAG,YAAY,GACjC,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC,CAAC;AAElD;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD;;;OAGG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAE7B;;OAEG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAE7B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwEG;AACH,eAAO,MAAM,MAAM,wGAyLlB,CAAC"}
+{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/drawer/Drawer.tsx"],"names":[],"mappings":"AAUA,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAOf,OAAO,EACL,KAAK,YAAY,EAIlB,MAAM,iBAAiB,CAAC;AASzB,KAAK,eAAe,GAAG,YAAY,GACjC,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC,CAAC;AAElD;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD;;;OAGG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAE7B;;OAEG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAE7B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4EG;AACH,eAAO,MAAM,MAAM,wGA4NlB,CAAC"}

package/dist/components/drawer/Drawer.js

@@ -4,52 +4,68 @@ import { cn as e } from "../../utils/cn.js";
 import { ASHEE_GLOBAL_LAYER as t } from "../../utils/stacking.js";
 import { useAsheeConfig as n } from "../../libs/context.js";
 import { resolveCascade as r, resolveClassKey as i } from "../../utils/resolve-token.js";
-import { FALLBACK_DRAWER_CONFIG as a } from "./drawer-config.js";
-import { DRAWER_ANIMATION_STATE as o, DRAWER_BORDER_PLACEMENT_CLASS as s, DRAWER_CONTAINER_PLACEMENT_CLASS as c, DRAWER_HEIGHT_CLASS as l, DRAWER_WIDTH_CLASS as u } from "./drawer-styles.js";
-import { forwardRef as d, useCallback as f, useEffect as p, useState as m } from "react";
-import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { useBodyScrollLock as a } from "../../libs/use-body-scroll-lock.js";
+import { useDialogOverlay as o } from "../../libs/use-dialog-overlay.js";
+import { FALLBACK_DRAWER_CONFIG as s } from "./drawer-config.js";
+import { DRAWER_ANIMATION_STATE as c, DRAWER_BORDER_PLACEMENT_CLASS as l, DRAWER_CONTAINER_PLACEMENT_CLASS as u, DRAWER_HEIGHT_CLASS as d, DRAWER_WIDTH_CLASS as f } from "./drawer-styles.js";
+import { forwardRef as p, useCallback as m, useEffect as h, useRef as g, useState as _ } from "react";
+import { jsx as v, jsxs as y } from "react/jsx-runtime";
+import { FloatingFocusManager as ee, FloatingPortal as b } from "@floating-ui/react";
 //#region src/components/drawer/Drawer.tsx
-var _ = d(({ isOpen: d, onClose: _, placement: v, size: y, animated: b, closeOnOverlayClick: x, closeOnEsc: S, overlay: C, content: w, className: T, children: E, style: D, ...O }, k) => {
-	let A = n().components?.drawer, [j, M] = m(d ? "open" : "unmounted");
-	p(() => {
-		if (d) {
-			M("opening");
+var x = p(({ isOpen: p, onClose: x, placement: S, size: te, animated: ne, closeOnOverlayClick: C, closeOnEsc: w, overlay: T, content: E, className: D, children: O, style: k, ...A }, j) => {
+	let M = n().components?.drawer, [N, P] = _(p ? "open" : "unmounted");
+	h(() => {
+		if (p) {
+			P("opening");
 			let e = requestAnimationFrame(() => {
-				M("open");
+				P("open");
 			});
 			return () => cancelAnimationFrame(e);
 		}
-		if (j !== "unmounted") {
-			M("closing");
+		if (N !== "unmounted") {
+			P("closing");
 			let e = setTimeout(() => {
-				M("unmounted");
+				P("unmounted");
 			}, 250);
 			return () => clearTimeout(e);
 		}
-	}, [d]);
-	let N = r(y, A?.size, void 0, a.size), P = r(v, A?.placement, void 0, a.placement), F = r(x, A?.closeOnOverlayClick, void 0, a.closeOnOverlayClick), I = r(S, A?.closeOnEsc, void 0, a.closeOnEsc), L = r(b, A?.animated, void 0, a.animated), R = C?.className ?? "bg-black/70 backdrop-blur-md", z = w?.className ?? "bg-secondary", B = P === "left" || P === "right", V = B ? i(N, u, a.size) : "w-full", H = B ? "h-full" : i(N, l, a.size), U = c[P] ?? c.right, W = s[P] ?? s.right, G = o[P], K = j === "open" || j === "opening", q = L ? K ? G.open : G.closed : "", J = L ? K ? "drawer-backdrop-in" : "drawer-backdrop-out" : "", Y = f((e) => {
-		I && e.key === "Escape" && _ && _();
-	}, [I, _]);
-	return p(() => {
-		if (j !== "unmounted") return window.addEventListener("keydown", Y), () => window.removeEventListener("keydown", Y);
-	}, [j, Y]), j === "unmounted" ? null : /* @__PURE__ */ g("div", {
-		ref: k,
-		role: "dialog",
-		"aria-modal": "true",
-		className: e("fixed inset-0 flex w-full h-full", U, T),
-		style: { zIndex: t.overlay },
-		...O,
-		children: [/* @__PURE__ */ h("button", {
-			type: "button",
-			onClick: F ? _ : void 0,
-			className: e("absolute inset-0", R, J)
-		}), /* @__PURE__ */ h("div", {
-			style: D,
-			className: e("relative z-10 flex flex-col text-foreground shadow-2xl border-border", W, V, H, z, q),
-			children: E
-		})]
-	});
+	}, [p]);
+	let { context: F, setDialogRef: I } = o(p), L = g(null), R = m((e) => {
+		L.current = e, I(e), typeof j == "function" ? j(e) : j && (j.current = e);
+	}, [j, I]);
+	a(p);
+	let z = r(te, M?.size, void 0, s.size), B = r(S, M?.placement, void 0, s.placement), V = r(C, M?.closeOnOverlayClick, void 0, s.closeOnOverlayClick), H = r(w, M?.closeOnEsc, void 0, s.closeOnEsc), U = r(ne, M?.animated, void 0, s.animated), W = T?.className ?? "bg-background/80 backdrop-blur-md", G = E?.className ?? "bg-secondary", K = B === "left" || B === "right", q = K ? i(z, f, s.size) : "w-full", J = K ? "h-full" : i(z, d, s.size), Y = u[B] ?? u.right, X = l[B] ?? l.right, Z = c[B], Q = N === "open" || N === "opening", re = U ? Q ? Z.open : Z.closed : "", ie = U ? Q ? "drawer-backdrop-in" : "drawer-backdrop-out" : "", $ = m((e) => {
+		H && e.key === "Escape" && x && x();
+	}, [H, x]);
+	return h(() => {
+		if (N !== "unmounted") return window.addEventListener("keydown", $), () => window.removeEventListener("keydown", $);
+	}, [N, $]), N === "unmounted" ? null : /* @__PURE__ */ v(b, { children: /* @__PURE__ */ v(ee, {
+		context: F,
+		modal: !0,
+		initialFocus: L,
+		returnFocus: !0,
+		closeOnFocusOut: !1,
+		children: /* @__PURE__ */ y("div", {
+			ref: R,
+			role: "dialog",
+			"aria-modal": "true",
+			tabIndex: -1,
+			className: e("fixed inset-0 flex w-full h-full outline-none", Y, D),
+			style: { zIndex: t.overlay },
+			...A,
+			children: [/* @__PURE__ */ v("div", {
+				"data-ashee-backdrop": "",
+				"aria-hidden": "true",
+				onClick: V ? x : void 0,
+				className: e("absolute inset-0", W, ie)
+			}), /* @__PURE__ */ v("div", {
+				style: k,
+				className: e("relative z-10 flex flex-col text-foreground shadow-2xl border-border", X, q, J, G, re),
+				children: O
+			})]
+		})
+	}) });
 });
-_.displayName = "Drawer";
+x.displayName = "Drawer";
 //#endregion
-export { _ as Drawer };
+export { x as Drawer };

package/dist/components/{select/Select.d.ts → dropmenu/Dropmenu.d.ts}

@@ -1,24 +1,24 @@
 import { ReactNode } from 'react';
 import { InputProps } from '../input/Input';
-import { MenuProps } from '../select-menu/SelectMenu';
-import { SelectMenuOption } from '../select-menu/select-menu-config';
-import { SelectConfig } from './select-config';
+import { MenuProps } from '../menu/Menu';
+import { MenuOption } from '../menu/menu-config';
+import { DropmenuConfig } from './dropmenu-config';
 /**
- * Field-related props that Select inherits from Input.
+ * Field-related props that Dropmenu inherits from Input.
  * Picked to avoid conflicts with Button-specific props.
  */
 type SelectFieldProps = Pick<InputProps, "label" | "description" | "message" | "required" | "isLoading" | "status" | "labelAlign" | "className" | "id" | "style">;
 /**
- * Configuration options for the Select component.
- * Extends field props from Input, and SelectConfig for
+ * Configuration options for the Dropmenu component.
+ * Extends field props from Input, and DropmenuConfig for
  * component-specific options. Uses Button for trigger styling.
  */
-export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"> {
+export interface DropmenuProps extends SelectFieldProps, Omit<DropmenuConfig, "menu"> {
     /**
      * Available options to select from.
      * Each option must have a label and a unique value.
      */
-    options: SelectMenuOption[];
+    options: MenuOption[];
     /**
      * Controlled selected value.
      */
@@ -63,7 +63,7 @@ export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"
     /**
      * Placeholder text shown when no value is selected.
      *
-     * @default "Select..."
+     * @default "Dropmenu..."
      */
     placeholder?: string;
     /**
@@ -95,7 +95,7 @@ export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"
 /**
  * A dropdown selector with search, label, validation, and configurable styles.
  *
- * Select renders a dropdown that allows selecting a single option from a list.
+ * Dropmenu renders a dropdown that allows selecting a single option from a list.
  * It supports search filtering, controlled and uncontrolled selection state,
  * validation states, custom menu and trigger styles, and start/end content
  * slots. Visual tokens resolve through the standard AsheeUI cascade system.
@@ -108,10 +108,10 @@ export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"
  * By default, the dropdown menu uses Floating UI's FloatingPortal to render
  * at the document body level. This ensures the menu escapes CSS containment,
  * overflow clipping, and stacking context issues. The portal can be disabled
- * via the `menu.portal` prop or `components.select.menu.portal` in the config
+ * via the `menu.portal` prop or `components.dropmenu.menu.portal` in the config
  * if the menu needs to stay within a specific parent container.
  *
- * @param props - Select configuration options.
+ * @param props - Dropmenu configuration options.
  * @param props.options - Available options to select from.
  * @param props.value - Controlled selected value.
  * @param props.onChange - Native change event handler.
@@ -127,7 +127,7 @@ export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"
  * @param props.searchInputName - Name attribute for the search input. Defaults to "select-search".
  * @param props.initialValue - Initial value for uncontrolled usage.
  * @param props.belowList - Content below the options list.
- * @param props.placeholder - Placeholder text. Defaults to "Select...".
+ * @param props.placeholder - Placeholder text. Defaults to "Dropmenu...".
  * @param props.size - Size of the trigger. Defaults to "md".
  * @param props.radius - Corner rounding. Defaults to "md".
  * @param props.variant - Visual style variant. Defaults to "bordered".
@@ -143,7 +143,7 @@ export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"
  *
  * @example
  * ```tsx
- * import { Select } from "asheeui";
+ * import { Dropmenu } from "asheeui";
  * import { useState } from "react";
  *
  * export function Example() {
@@ -156,11 +156,11 @@ export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"
  *   ];
  *
  *   return (
- *     <Select
+ *     <Dropmenu
  *       options={options}
  *       value={value}
  *       onValueChange={setValue}
- *       label="Select Framework"
+ *       label="Dropmenu Framework"
  *       placeholder="Choose a framework..."
  *     />
  *   );
@@ -170,7 +170,7 @@ export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"
  * @example
  * ```tsx
  * // With search, validation, and menu configuration
- * <Select
+ * <Dropmenu
  *   options={fruits}
  *   label="Favorite Fruit"
  *   isSearch
@@ -187,12 +187,12 @@ export interface SelectProps extends SelectFieldProps, Omit<SelectConfig, "menu"
  * />
  * ```
  *
- * @see SelectConfig - The configuration type for component defaults.
+ * @see DropmenuConfig - The configuration type for component defaults.
  * @see Input - The input component that provides field capabilities.
  * @see Button - The button component used as the trigger.
- * @see SelectMenu - The dropdown menu component.
+ * @see Menu - The dropdown menu component.
  * @see FieldShell - The wrapper component for label and validation.
  */
-export declare const Select: import('react').ForwardRefExoticComponent<SelectProps & import('react').RefAttributes<HTMLButtonElement>>;
+export declare const Dropmenu: import('react').ForwardRefExoticComponent<DropmenuProps & import('react').RefAttributes<HTMLButtonElement>>;
 export {};
-//# sourceMappingURL=Select.d.ts.map
+//# sourceMappingURL=Dropmenu.d.ts.map

package/dist/components/{select/Select.d.ts.map → dropmenu/Dropmenu.d.ts.map}

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/select/Select.tsx"],"names":[],"mappings":"AAWA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEjD,OAAO,EAAE,KAAK,SAAS,EAAc,MAAM,2BAA2B,CAAC;AACvE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAC1E,OAAO,EAA0B,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAK5E;;;GAGG;AACH,KAAK,gBAAgB,GAAG,IAAI,CAC1B,UAAU,EACR,OAAO,GACP,aAAa,GACb,SAAS,GACT,UAAU,GACV,WAAW,GACX,QAAQ,GACR,YAAY,GACZ,WAAW,GACX,IAAI,GACJ,OAAO,CACV,CAAC;AAEF;;;;GAIG;AACH,MAAM,WAAW,WACf,SAAQ,gBAAgB,EACtB,IAAI,CAAC,YAAY,EAAE,MAAM,CAAC;IAC5B;;;OAGG;IACH,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAE5B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAE7D;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAEjD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE/B;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoGG;AACH,eAAO,MAAM,MAAM,2GAsPlB,CAAC"}
+{"version":3,"file":"Dropmenu.d.ts","sourceRoot":"","sources":["../../../src/components/dropmenu/Dropmenu.tsx"],"names":[],"mappings":"AAWA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEjD,OAAO,EAAE,KAAK,SAAS,EAAQ,MAAM,cAAc,CAAC;AACpD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAA0B,KAAK,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAKhF;;;GAGG;AACH,KAAK,gBAAgB,GAAG,IAAI,CAC1B,UAAU,EACR,OAAO,GACP,aAAa,GACb,SAAS,GACT,UAAU,GACV,WAAW,GACX,QAAQ,GACR,YAAY,GACZ,WAAW,GACX,IAAI,GACJ,OAAO,CACV,CAAC;AAEF;;;;GAIG;AACH,MAAM,WAAW,aACf,SAAQ,gBAAgB,EACtB,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC;IAC9B;;;OAGG;IACH,OAAO,EAAE,UAAU,EAAE,CAAC;IAEtB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAE7D;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAEjD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE/B;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoGG;AACH,eAAO,MAAM,QAAQ,6GA8QpB,CAAC"}