asheeui 0.6.15 → 1.0.0

package/dist/components/chip/Chip.js

@@ -1,192 +1,85 @@
 "use client";
-import { jsxs as F, jsx as i } from "react/jsx-runtime";
-import { forwardRef as O } from "react";
-import { CloseIcon as X } from "../../icons/CloseIcon.js";
-import { useAsheeConfig as Y } from "../../libs/context.js";
-import { resolveCascade as p, resolveRadiusKey as T, resolveClassKey as o } from "../../utils/resolve-token.js";
-import { FALLBACK_CHIP_CONFIG as s } from "./chip-config.js";
-import { CHIP_HEIGHT_CLASS as B, CHIP_PADDING_CLASS as M, CHIP_FONT_CLASS as U, CHIP_GAP_CLASS as Z, CHIP_ICON_SIZE_CLASS as q } from "./chip-styles.js";
-import { RADIUS_CLASS as D } from "../../shared/radius.js";
-import { cn as c } from "../../utils/cn.js";
-import { resolveVariantClass as J } from "../../shared/variant.js";
-const Q = O(
-  ({
-    variant: S,
-    color: C,
-    size: _,
-    radius: A,
-    isDisabled: t = !1,
-    startIcon: y,
-    endIcon: h,
-    avatar: d,
-    dot: m,
-    onClose: a,
-    closeIcon: I,
-    children: N,
-    className: b,
-    style: g,
-    onClick: n,
-    ...w
-  }, x) => {
-    var K;
-    const u = Y(), r = (K = u.components) == null ? void 0 : K.chip, v = p(
-      S,
-      r == null ? void 0 : r.variant,
-      u.defaultVariant,
-      s.variant
-    ), z = v === "underlined" ? "bordered" : v, P = p(
-      C,
-      r == null ? void 0 : r.color,
-      u.defaultColor,
-      s.color
-    ), l = p(
-      _,
-      r == null ? void 0 : r.size,
-      void 0,
-      s.size
-    ), H = T(
-      A,
-      r == null ? void 0 : r.radius,
-      u.defaultRadius,
-      s.radius
-    ), L = o(
-      l,
-      B,
-      s.size
-    ), j = o(
-      l,
-      M,
-      s.size
-    ), R = o(
-      l,
-      U,
-      s.size
-    ), k = o(
-      l,
-      Z,
-      s.size
-    ), f = o(
-      l,
-      q,
-      s.size
-    ), E = o(
-      H,
-      D,
-      s.radius
-    ), G = (e) => {
-      e.stopPropagation(), !t && (a == null || a(e));
-    };
-    return /* @__PURE__ */ F(
-      "div",
-      {
-        ref: x,
-        tabIndex: t ? -1 : 0,
-        "aria-disabled": t,
-        onClick: (e) => {
-          t || n == null || n(e);
-        },
-        onKeyDown: (e) => {
-          if (!t && (e.key === "Enter" || e.key === " ")) {
-            e.preventDefault();
-            const V = {
-              ...e,
-              button: 0,
-              buttons: 1,
-              clientX: 0,
-              clientY: 0,
-              pageX: 0,
-              pageY: 0,
-              screenX: 0,
-              screenY: 0,
-              altKey: e.altKey,
-              ctrlKey: e.ctrlKey,
-              metaKey: e.metaKey,
-              shiftKey: e.shiftKey,
-              type: "click"
-            };
-            n == null || n(V);
-          }
-        },
-        className: c(
-          "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",
-          J(z, P),
-          L,
-          j,
-          R,
-          k,
-          E,
-          t && "opacity-50 pointer-events-none cursor-not-allowed",
-          n && !t && "cursor-pointer hover:opacity-90 active:scale-[0.98]",
-          b
-        ),
-        style: g,
-        ...w,
-        children: [
-          m && /* @__PURE__ */ i(
-            "span",
-            {
-              className: "shrink-0 rounded-full",
-              style: {
-                width: "0.5em",
-                height: "0.5em",
-                backgroundColor: typeof m == "string" ? m : "currentColor"
-              }
-            }
-          ),
-          d && /* @__PURE__ */ i(
-            "span",
-            {
-              className: c(
-                "inline-flex items-center justify-center shrink-0 scrollbar-hide overflow-hidden rounded-full",
-                f
-              ),
-              children: d
-            }
-          ),
-          y && !d && /* @__PURE__ */ i(
-            "span",
-            {
-              className: c(
-                "inline-flex items-center justify-center shrink-0",
-                f
-              ),
-              children: y
-            }
-          ),
-          N,
-          h && !a && /* @__PURE__ */ i(
-            "span",
-            {
-              className: c(
-                "inline-flex items-center justify-center shrink-0",
-                f
-              ),
-              children: h
-            }
-          ),
-          a && /* @__PURE__ */ i(
-            "button",
-            {
-              type: "button",
-              "aria-label": "Remove chip",
-              disabled: t,
-              onClick: G,
-              className: c(
-                "inline-flex items-center justify-center shrink-0 rounded-full transition-opacity",
-                "hover:opacity-70 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-current",
-                "opacity-80 -mr-1",
-                f
-              ),
-              children: I ?? /* @__PURE__ */ i(X, { className: "w-full h-full" })
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-Q.displayName = "Chip";
-export {
-  Q as Chip
-};
+"use client";
+import { cn as e } from "../../utils/cn.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";
+import { CHIP_FONT_CLASS as l, CHIP_GAP_CLASS as u, CHIP_HEIGHT_CLASS as d, CHIP_ICON_SIZE_CLASS as f, CHIP_PADDING_CLASS as p } from "./chip-styles.js";
+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 = 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", {
+		ref: M,
+		tabIndex: b ? -1 : 0,
+		"aria-disabled": b,
+		onClick: (e) => {
+			b || A?.(e);
+		},
+		onKeyDown: (e) => {
+			if (!b && (e.key === "Enter" || e.key === " ")) {
+				e.preventDefault();
+				let t = {
+					...e,
+					button: 0,
+					buttons: 1,
+					clientX: 0,
+					clientY: 0,
+					pageX: 0,
+					pageY: 0,
+					screenX: 0,
+					screenY: 0,
+					altKey: e.altKey,
+					ctrlKey: e.ctrlKey,
+					metaKey: e.metaKey,
+					shiftKey: e.shiftKey,
+					type: "click"
+				};
+				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", 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: [
+			w && /* @__PURE__ */ h("span", {
+				className: "shrink-0 rounded-full",
+				style: {
+					width: "0.5em",
+					height: "0.5em",
+					backgroundColor: typeof w == "string" ? w : "currentColor"
+				}
+			}),
+			C && /* @__PURE__ */ h("span", {
+				className: e("inline-flex items-center justify-center shrink-0 scrollbar-hide overflow-hidden rounded-full", W),
+				children: C
+			}),
+			x && !C && /* @__PURE__ */ h("span", {
+				className: e("inline-flex items-center justify-center shrink-0", W),
+				children: x
+			}),
+			D,
+			S && !T && /* @__PURE__ */ h("span", {
+				className: e("inline-flex items-center justify-center shrink-0", W),
+				children: S
+			}),
+			T && /* @__PURE__ */ h("button", {
+				type: "button",
+				"aria-label": "Remove chip",
+				disabled: b,
+				onClick: K,
+				className: e("inline-flex items-center justify-center shrink-0 rounded-full transition-opacity", "hover:opacity-70 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-current", "opacity-80 -mr-1", W),
+				children: E ?? /* @__PURE__ */ h(s, { className: "w-full h-full" })
+			})
+		]
+	});
+});
+_.displayName = "Chip";
+//#endregion
+export { _ as Chip };

package/dist/components/chip/chip-config.js

@@ -1,16 +1,15 @@
 "use client";
-import { registerComponentDefaults as r } from "../../libs/registry.js";
-const e = {
-  size: "md",
-  radius: "full"
-}, o = {
-  size: "md",
-  variant: "bordered",
-  color: "primary",
-  radius: "full"
-};
-r("chip", e);
-export {
-  o as FALLBACK_CHIP_CONFIG,
-  e as defaultChipConfig
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+//#region src/components/chip/chip-config.ts
+var t = {
+	size: "md",
+	radius: "full"
+}, n = {
+	size: "md",
+	variant: "bordered",
+	color: "primary",
+	radius: "full"
 };
+e("chip", t);
+//#endregion
+export { n as FALLBACK_CHIP_CONFIG, t as defaultChipConfig };

package/dist/components/chip/chip-styles.js

@@ -1,29 +1,25 @@
 "use client";
-const s = {
-  sm: "h-6",
-  md: "h-7",
-  lg: "h-8"
+//#region src/components/chip/chip-styles.ts
+var e = {
+	sm: "h-6",
+	md: "h-7",
+	lg: "h-8"
 }, t = {
-  sm: "px-2",
-  md: "px-2.5",
-  lg: "px-3"
-}, m = {
-  sm: "text-xs",
-  md: "text-sm",
-  lg: "text-base"
-}, C = {
-  sm: "gap-1",
-  md: "gap-1.5",
-  lg: "gap-2"
-}, S = {
-  sm: "w-3 h-3",
-  md: "w-3.5 h-3.5",
-  lg: "w-4 h-4"
-};
-export {
-  m as CHIP_FONT_CLASS,
-  C as CHIP_GAP_CLASS,
-  s as CHIP_HEIGHT_CLASS,
-  S as CHIP_ICON_SIZE_CLASS,
-  t as CHIP_PADDING_CLASS
+	sm: "px-2",
+	md: "px-2.5",
+	lg: "px-3"
+}, n = {
+	sm: "text-xs",
+	md: "text-sm",
+	lg: "text-base"
+}, r = {
+	sm: "gap-1",
+	md: "gap-1.5",
+	lg: "gap-2"
+}, i = {
+	sm: "w-3 h-3",
+	md: "w-3.5 h-3.5",
+	lg: "w-4 h-4"
 };
+//#endregion
+export { n as CHIP_FONT_CLASS, r as CHIP_GAP_CLASS, e as CHIP_HEIGHT_CLASS, i as CHIP_ICON_SIZE_CLASS, t as CHIP_PADDING_CLASS };

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

@@ -1,6 +1,24 @@
 import { HTMLAttributes, ReactNode } from 'react';
 import { DrawerConfig } from './drawer-config';
-type BaseDrawerProps = DrawerConfig & HTMLAttributes<HTMLDivElement>;
+type BaseDrawerProps = DrawerConfig & Omit<HTMLAttributes<HTMLDivElement>, "content">;
+/**
+ * Props for the drawer's backdrop overlay.
+ */
+export interface DrawerOverlayProps {
+    /**
+     * Extra classes applied to the overlay.
+     */
+    className?: string;
+}
+/**
+ * Props for the drawer's content panel.
+ */
+export interface DrawerContentProps {
+    /**
+     * Extra classes applied to the drawer content.
+     */
+    className?: string;
+}
 /**
  * Configuration options for the Drawer component.
  */
@@ -16,13 +34,13 @@ export interface DrawerProps extends BaseDrawerProps {
      */
     onClose?: () => void;
     /**
-     * Extra classes applied to the overlay.
+     * Backdrop overlay overrides, including its class override.
      */
-    overlayClassName?: string;
+    overlay?: DrawerOverlayProps;
     /**
-     * Extra classes applied to the drawer content.
+     * Content panel overrides, including its class override.
      */
-    contentClassName?: string;
+    content?: DrawerContentProps;
     /**
      * The content to display inside the drawer.
      */
@@ -37,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.
@@ -49,8 +71,8 @@ export interface DrawerProps extends BaseDrawerProps {
  * @param props.animated - Whether the drawer has slide animations. Defaults to true.
  * @param props.closeOnOverlayClick - Whether clicking the overlay closes the drawer. Defaults to true.
  * @param props.closeOnEsc - Whether pressing Escape closes the drawer. Defaults to true.
- * @param props.overlayClassName - Extra classes for the overlay.
- * @param props.contentClassName - Extra classes for the drawer content.
+ * @param props.overlay - Backdrop overlay overrides (className).
+ * @param props.content - Content panel overrides (className).
  * @param props.children - The content to display inside the drawer.
  * @param props.className - Extra classes for the container.
  *
@@ -90,7 +112,7 @@ export interface DrawerProps extends BaseDrawerProps {
  *   onClose={onClose}
  *   placement="bottom"
  *   size="full"
- *   overlayClassName="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;AAIf,OAAO,EACL,KAAK,YAAY,EAIlB,MAAM,iBAAiB,CAAC;AASzB,KAAK,eAAe,GAAG,YAAY,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAErE;;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,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwEG;AACH,eAAO,MAAM,MAAM,wGAwLlB,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

@@ -1,132 +1,71 @@
 "use client";
-import { jsxs as G, jsx as w } from "react/jsx-runtime";
-import { forwardRef as q, useState as V, useEffect as C, useCallback as J } from "react";
-import { useAsheeConfig as Q } from "../../libs/context.js";
-import { resolveCascade as a, resolveClassKey as R } from "../../utils/resolve-token.js";
-import { FALLBACK_DRAWER_CONFIG as t } from "./drawer-config.js";
-import { DRAWER_WIDTH_CLASS as U, DRAWER_HEIGHT_CLASS as X, DRAWER_ANIMATION_STATE as Y, DRAWER_BORDER_PLACEMENT_CLASS as b, DRAWER_CONTAINER_PLACEMENT_CLASS as y } from "./drawer-styles.js";
-import { cn as d } from "../../utils/cn.js";
-const Z = q(
-  ({
-    isOpen: c,
-    onClose: r,
-    placement: N,
-    size: h,
-    animated: O,
-    closeOnOverlayClick: S,
-    closeOnEsc: _,
-    overlayClassName: k,
-    contentClassName: D,
-    className: L,
-    children: T,
-    style: x,
-    ...z
-  }, W) => {
-    var f;
-    const e = (f = Q().components) == null ? void 0 : f.drawer, [o, l] = V(c ? "open" : "unmounted");
-    C(() => {
-      if (c) {
-        l("opening");
-        const s = requestAnimationFrame(() => {
-          l("open");
-        });
-        return () => cancelAnimationFrame(s);
-      } else if (o !== "unmounted") {
-        l("closing");
-        const s = setTimeout(() => {
-          l("unmounted");
-        }, 250);
-        return () => clearTimeout(s);
-      }
-    }, [c]);
-    const m = a(
-      h,
-      e == null ? void 0 : e.size,
-      void 0,
-      t.size
-    ), n = a(
-      N,
-      e == null ? void 0 : e.placement,
-      void 0,
-      t.placement
-    ), I = a(
-      S,
-      e == null ? void 0 : e.closeOnOverlayClick,
-      void 0,
-      t.closeOnOverlayClick
-    ), u = a(
-      _,
-      e == null ? void 0 : e.closeOnEsc,
-      void 0,
-      t.closeOnEsc
-    ), p = a(
-      O,
-      e == null ? void 0 : e.animated,
-      void 0,
-      t.animated
-    ), g = k ?? "bg-black/70 backdrop-blur-md", F = D ?? "bg-secondary", A = n === "left" || n === "right", H = A ? R(
-      m,
-      U,
-      t.size
-    ) : "w-full", K = A ? "h-full" : R(
-      m,
-      X,
-      t.size
-    ), P = y[n] ?? y.right, M = b[n] ?? b.right, E = Y[n], v = o === "open" || o === "opening", j = p ? v ? E.open : E.closed : "", B = p ? v ? "drawer-backdrop-in" : "drawer-backdrop-out" : "", i = J(
-      (s) => {
-        u && s.key === "Escape" && r && r();
-      },
-      [u, r]
-    );
-    return C(() => {
-      if (o !== "unmounted")
-        return window.addEventListener("keydown", i), () => window.removeEventListener("keydown", i);
-    }, [o, i]), o === "unmounted" ? null : /* @__PURE__ */ G(
-      "div",
-      {
-        ref: W,
-        role: "dialog",
-        "aria-modal": "true",
-        className: d(
-          "fixed inset-0 z-50 flex w-full h-full",
-          P,
-          L
-        ),
-        ...z,
-        children: [
-          /* @__PURE__ */ w(
-            "button",
-            {
-              type: "button",
-              onClick: I ? r : void 0,
-              className: d(
-                "absolute inset-0",
-                g,
-                B
-              )
-            }
-          ),
-          /* @__PURE__ */ w(
-            "div",
-            {
-              style: x,
-              className: d(
-                "relative z-10 flex flex-col text-foreground shadow-2xl border-border",
-                M,
-                H,
-                K,
-                F,
-                j
-              ),
-              children: T
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-Z.displayName = "Drawer";
-export {
-  Z as Drawer
-};
+"use client";
+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 { 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 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(() => {
+				P("open");
+			});
+			return () => cancelAnimationFrame(e);
+		}
+		if (N !== "unmounted") {
+			P("closing");
+			let e = setTimeout(() => {
+				P("unmounted");
+			}, 250);
+			return () => clearTimeout(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
+			})]
+		})
+	}) });
+});
+x.displayName = "Drawer";
+//#endregion
+export { x as Drawer };