asheeui 0.6.14 → 0.7.0

package/dist/components/date-picker/date-picker-styles.js

@@ -1,47 +1,46 @@
 "use client";
-const r = {
-  sm: "size-7 text-xs",
-  md: "size-8 text-xs",
-  lg: "size-9 text-sm"
-}, e = {
-  default: {
-    bg: "bg-foreground text-background",
-    text: "text-foreground",
-    border: "border-foreground",
-    hover: "hover:text-foreground hover:bg-secondary"
-  },
-  primary: {
-    bg: "bg-primary text-primary-foreground",
-    text: "text-primary",
-    border: "border-primary",
-    hover: "hover:text-primary hover:bg-primary/10"
-  },
-  secondary: {
-    bg: "bg-secondary text-foreground/70",
-    text: "text-secondary",
-    border: "border-secondary",
-    hover: "hover:text-secondary hover:bg-secondary/10"
-  },
-  success: {
-    bg: "bg-success text-success-foreground",
-    text: "text-success",
-    border: "border-success",
-    hover: "hover:text-success hover:bg-success/10"
-  },
-  warning: {
-    bg: "bg-warning text-warning-foreground",
-    text: "text-warning",
-    border: "border-warning",
-    hover: "hover:text-warning hover:bg-warning/10"
-  },
-  danger: {
-    bg: "bg-danger text-danger-foreground",
-    text: "text-danger",
-    border: "border-danger",
-    hover: "hover:text-danger hover:bg-danger/10"
-  }
-};
-export {
-  e as CALENDAR_COLOR_CLASSES,
-  r as DATE_PICKER_CELL_SIZE_CLASS
+//#region src/components/date-picker/date-picker-styles.ts
+var e = {
+	sm: "size-7 text-xs",
+	md: "size-8 text-xs",
+	lg: "size-9 text-sm"
+}, t = {
+	default: {
+		bg: "bg-foreground text-background",
+		text: "text-foreground",
+		border: "border-foreground",
+		hover: "hover:text-foreground hover:bg-secondary"
+	},
+	primary: {
+		bg: "bg-primary text-primary-foreground",
+		text: "text-primary",
+		border: "border-primary",
+		hover: "hover:text-primary hover:bg-primary/10"
+	},
+	secondary: {
+		bg: "bg-secondary text-foreground/70",
+		text: "text-secondary",
+		border: "border-secondary",
+		hover: "hover:text-secondary hover:bg-secondary/10"
+	},
+	success: {
+		bg: "bg-success text-success-foreground",
+		text: "text-success",
+		border: "border-success",
+		hover: "hover:text-success hover:bg-success/10"
+	},
+	warning: {
+		bg: "bg-warning text-warning-foreground",
+		text: "text-warning",
+		border: "border-warning",
+		hover: "hover:text-warning hover:bg-warning/10"
+	},
+	danger: {
+		bg: "bg-danger text-danger-foreground",
+		text: "text-danger",
+		border: "border-danger",
+		hover: "hover:text-danger hover:bg-danger/10"
+	}
 };
+//#endregion
+export { t as CALENDAR_COLOR_CLASSES, e as DATE_PICKER_CELL_SIZE_CLASS };

package/dist/components/date-picker/date-picker.helpers.d.ts

@@ -19,7 +19,7 @@ export declare const MONTHS: readonly ["January", "February", "March", "April",
  * - `time`: Select only a time.
  * - `datetime`: Select both date and time.
  */
-export type PickerMode = "date" | "time" | "datetime";
+export type DatePickerMode = "date" | "time" | "datetime";
 /**
  * Pads a number with leading zero to two digits.
  * Used for formatting hours, minutes, and seconds.
@@ -49,14 +49,14 @@ export declare function pad2(n: number): string;
  * formatDisplay(date, "datetime") // "15/01/2024 14:30:45"
  * ```
  */
-export declare function formatDisplay(date: Date, mode: PickerMode): string;
+export declare function formatDisplay(date: Date, mode: DatePickerMode): string;
 /**
  * Gets the default placeholder text for the input based on mode.
  *
  * @param mode - The picker mode.
  * @returns The placeholder text.
  */
-export declare function getDefaultPlaceholder(mode: PickerMode): string;
+export declare function getDefaultPlaceholder(mode: DatePickerMode): string;
 /**
  * Builds a 2D array of day numbers for the calendar grid.
  * Returns a flat array where null values represent empty slots
@@ -90,7 +90,7 @@ export declare function buildDayCells(year: number, month: number): (number | nu
  * parseDateString("150120241430", "datetime") // Date(2024, 0, 15, 14, 30)
  * ```
  */
-export declare function parseDateString(input: string, mode: PickerMode, fallbackDate?: Date): Date | null;
+export declare function parseDateString(input: string, mode: DatePickerMode, fallbackDate?: Date): Date | null;
 /**
  * Calculates the new cursor position after input formatting.
  * Ensures the cursor stays at the correct position when the

package/dist/components/date-picker/date-picker.helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.helpers.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/date-picker.helpers.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH;;;GAGG;AACH,eAAO,MAAM,YAAY,qDAAsD,CAAC;AAEhF;;;GAGG;AACH,eAAO,MAAM,MAAM,qIAaT,CAAC;AAIX;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,CAAC;AAItD;;;;;;;;;;;;GAYG;AACH,wBAAgB,IAAI,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAEtC;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBlE;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAS9D;AAID;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAS5E;AAID;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,eAAe,CAC7B,KAAK,EAAE,MAAM,EACb,IAAI,EAAE,UAAU,EAChB,YAAY,CAAC,EAAE,IAAI,GAClB,IAAI,GAAG,IAAI,CAsDb;AAID;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,oBAAoB,CAClC,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,MAAM,EAChB,iBAAiB,EAAE,MAAM,GACxB,MAAM,CAqBR"}
+{"version":3,"file":"date-picker.helpers.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/date-picker.helpers.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH;;;GAGG;AACH,eAAO,MAAM,YAAY,qDAAsD,CAAC;AAEhF;;;GAGG;AACH,eAAO,MAAM,MAAM,qIAaT,CAAC;AAIX;;;;;GAKG;AACH,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,CAAC;AAI1D;;;;;;;;;;;;GAYG;AACH,wBAAgB,IAAI,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAEtC;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,cAAc,GAAG,MAAM,CAgBtE;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,IAAI,EAAE,cAAc,GAAG,MAAM,CASlE;AAID;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAS5E;AAID;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,eAAe,CAC7B,KAAK,EAAE,MAAM,EACb,IAAI,EAAE,cAAc,EACpB,YAAY,CAAC,EAAE,IAAI,GAClB,IAAI,GAAG,IAAI,CAsDb;AAID;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,oBAAoB,CAClC,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,MAAM,EAChB,iBAAiB,EAAE,MAAM,GACxB,MAAM,CAqBR"}

package/dist/components/date-picker/date-picker.helpers.js

@@ -1,110 +1,82 @@
 "use client";
-const d = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], D = [
-  "January",
-  "February",
-  "March",
-  "April",
-  "May",
-  "June",
-  "July",
-  "August",
-  "September",
-  "October",
-  "November",
-  "December"
+//#region src/components/date-picker/date-picker.helpers.ts
+var e = [
+	"Su",
+	"Mo",
+	"Tu",
+	"We",
+	"Th",
+	"Fr",
+	"Sa"
+], t = [
+	"January",
+	"February",
+	"March",
+	"April",
+	"May",
+	"June",
+	"July",
+	"August",
+	"September",
+	"October",
+	"November",
+	"December"
 ];
-function l(n) {
-  return String(n).padStart(2, "0");
+function n(e) {
+	return String(e).padStart(2, "0");
 }
-function p(n, r) {
-  const o = l(n.getDate()), t = l(n.getMonth() + 1), s = n.getFullYear(), i = l(n.getHours()), c = l(n.getMinutes()), e = l(n.getSeconds());
-  switch (r) {
-    case "date":
-      return `${o}/${t}/${s}`;
-    case "time":
-      return `${i}:${c}:${e}`;
-    case "datetime":
-      return `${o}/${t}/${s} ${i}:${c}:${e}`;
-  }
+function r(e, t) {
+	let r = n(e.getDate()), i = n(e.getMonth() + 1), a = e.getFullYear(), o = n(e.getHours()), s = n(e.getMinutes()), c = n(e.getSeconds());
+	switch (t) {
+		case "date": return `${r}/${i}/${a}`;
+		case "time": return `${o}:${s}:${c}`;
+		case "datetime": return `${r}/${i}/${a} ${o}:${s}:${c}`;
+	}
 }
-function M(n) {
-  switch (n) {
-    case "date":
-      return "Select date...";
-    case "time":
-      return "Select time...";
-    case "datetime":
-      return "Select date & time...";
-  }
+function i(e) {
+	switch (e) {
+		case "date": return "Select date...";
+		case "time": return "Select time...";
+		case "datetime": return "Select date & time...";
+	}
 }
-function y(n, r) {
-  const o = new Date(n, r + 1, 0).getDate(), t = new Date(n, r, 1).getDay(), s = [
-    ...Array(t).fill(null),
-    ...Array.from({ length: o }, (i, c) => c + 1)
-  ];
-  for (; s.length % 7 !== 0; ) s.push(null);
-  return s;
+function a(e, t) {
+	let n = new Date(e, t + 1, 0).getDate(), r = new Date(e, t, 1).getDay(), i = [...Array(r).fill(null), ...Array.from({ length: n }, (e, t) => t + 1)];
+	for (; i.length % 7 != 0;) i.push(null);
+	return i;
 }
-function I(n, r, o) {
-  const t = n.replace(/\D/g, "");
-  if (t.length === 0) return null;
-  const s = o ?? /* @__PURE__ */ new Date();
-  switch (r) {
-    case "date": {
-      const i = parseInt(t.slice(0, 2), 10) || 1, c = parseInt(t.slice(2, 4), 10) || 1;
-      let e = parseInt(t.slice(4, 8), 10) || s.getFullYear();
-      t.length === 4 && (e = 2e3 + e), t.length === 2 && (e = s.getFullYear());
-      const a = Math.min(c - 1, 11), u = new Date(e, a + 1, 0).getDate(), h = Math.min(i, u);
-      return new Date(e, a, h);
-    }
-    case "time": {
-      const i = parseInt(t.slice(0, 2), 10) || 0, c = parseInt(t.slice(2, 4), 10) || 0, e = parseInt(t.slice(4, 6), 10) || 0, a = s;
-      return new Date(
-        a.getFullYear(),
-        a.getMonth(),
-        a.getDate(),
-        Math.min(i, 23),
-        Math.min(c, 59),
-        Math.min(e, 59)
-      );
-    }
-    case "datetime": {
-      const i = parseInt(t.slice(0, 2), 10) || 1, c = parseInt(t.slice(2, 4), 10) || 1;
-      let e = parseInt(t.slice(4, 8), 10) || s.getFullYear();
-      t.length >= 4 && t.length < 8 && (e = 2e3 + e), t.length < 4 && (e = s.getFullYear());
-      const a = parseInt(t.slice(8, 10), 10) || 0, u = parseInt(t.slice(10, 12), 10) || 0, h = parseInt(t.slice(12, 14), 10) || 0, g = Math.min(c - 1, 11), m = new Date(e, g + 1, 0).getDate(), f = Math.min(i, m);
-      return new Date(
-        e,
-        g,
-        f,
-        Math.min(a, 23),
-        Math.min(u, 59),
-        Math.min(h, 59)
-      );
-    }
-  }
+function o(e, t, n) {
+	let r = e.replace(/\D/g, "");
+	if (r.length === 0) return null;
+	let i = n ?? /* @__PURE__ */ new Date();
+	switch (t) {
+		case "date": {
+			let e = parseInt(r.slice(0, 2), 10) || 1, t = parseInt(r.slice(2, 4), 10) || 1, n = parseInt(r.slice(4, 8), 10) || i.getFullYear();
+			r.length === 4 && (n = 2e3 + n), r.length === 2 && (n = i.getFullYear());
+			let a = Math.min(t - 1, 11), o = new Date(n, a + 1, 0).getDate();
+			return new Date(n, a, Math.min(e, o));
+		}
+		case "time": {
+			let e = parseInt(r.slice(0, 2), 10) || 0, t = parseInt(r.slice(2, 4), 10) || 0, n = parseInt(r.slice(4, 6), 10) || 0, a = i;
+			return new Date(a.getFullYear(), a.getMonth(), a.getDate(), Math.min(e, 23), Math.min(t, 59), Math.min(n, 59));
+		}
+		case "datetime": {
+			let e = parseInt(r.slice(0, 2), 10) || 1, t = parseInt(r.slice(2, 4), 10) || 1, n = parseInt(r.slice(4, 8), 10) || i.getFullYear();
+			r.length >= 4 && r.length < 8 && (n = 2e3 + n), r.length < 4 && (n = i.getFullYear());
+			let a = parseInt(r.slice(8, 10), 10) || 0, o = parseInt(r.slice(10, 12), 10) || 0, s = parseInt(r.slice(12, 14), 10) || 0, c = Math.min(t - 1, 11), l = new Date(n, c + 1, 0).getDate();
+			return new Date(n, c, Math.min(e, l), Math.min(a, 23), Math.min(o, 59), Math.min(s, 59));
+		}
+	}
 }
-function $(n, r, o) {
-  if (o >= n.length) return r.length;
-  const s = (n.slice(0, o).match(/\d/g) || []).length;
-  let i = 0;
-  for (let c = 0; c < r.length; c++)
-    if (/\d/.test(r[c]) && i++, i > s) {
-      let e = 0;
-      for (let a = 0; a < r.length; a++)
-        if (/\d/.test(r[a]) && e++, e === s + 1)
-          return a + 1;
-      return r.length;
-    }
-  return r.length;
+function s(e, t, n) {
+	if (n >= e.length) return t.length;
+	let r = (e.slice(0, n).match(/\d/g) || []).length, i = 0;
+	for (let e = 0; e < t.length; e++) if (/\d/.test(t[e]) && i++, i > r) {
+		let e = 0;
+		for (let n = 0; n < t.length; n++) if (/\d/.test(t[n]) && e++, e === r + 1) return n + 1;
+		return t.length;
+	}
+	return t.length;
 }
-export {
-  d as DAYS_OF_WEEK,
-  D as MONTHS,
-  y as buildDayCells,
-  p as formatDisplay,
-  M as getDefaultPlaceholder,
-  $ as getNewCursorPosition,
-  l as pad2,
-  I as parseDateString
-};
+//#endregion
+export { e as DAYS_OF_WEEK, t as MONTHS, a as buildDayCells, r as formatDisplay, i as getDefaultPlaceholder, s as getNewCursorPosition, n as pad2, o as parseDateString };

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.
      */
@@ -49,8 +67,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 +108,7 @@ export interface DrawerProps extends BaseDrawerProps {
  *   onClose={onClose}
  *   placement="bottom"
  *   size="full"
- *   overlayClassName="bg-black/50"
+ *   overlay={{ className: "bg-black/50" }}
  * >
  *   <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":"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"}

package/dist/components/drawer/Drawer.js

@@ -1,132 +1,55 @@
 "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 { 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";
+//#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");
+			let e = requestAnimationFrame(() => {
+				M("open");
+			});
+			return () => cancelAnimationFrame(e);
+		}
+		if (j !== "unmounted") {
+			M("closing");
+			let e = setTimeout(() => {
+				M("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
+		})]
+	});
+});
+_.displayName = "Drawer";
+//#endregion
+export { _ as Drawer };

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

@@ -1,20 +1,19 @@
 "use client";
 import { registerComponentDefaults as e } from "../../libs/registry.js";
-const t = {
-  size: "md",
-  placement: "right",
-  animated: !0,
-  closeOnOverlayClick: !0,
-  closeOnEsc: !0
+//#region src/components/drawer/drawer-config.ts
+var t = {
+	size: "md",
+	placement: "right",
+	animated: !0,
+	closeOnOverlayClick: !0,
+	closeOnEsc: !0
 }, n = {
-  size: "md",
-  placement: "right",
-  animated: !0,
-  closeOnOverlayClick: !0,
-  closeOnEsc: !0
+	size: "md",
+	placement: "right",
+	animated: !0,
+	closeOnOverlayClick: !0,
+	closeOnEsc: !0
 };
 e("drawer", t);
-export {
-  n as FALLBACK_DRAWER_CONFIG,
-  t as defaultDrawerConfig
-};
+//#endregion
+export { n as FALLBACK_DRAWER_CONFIG, t as defaultDrawerConfig };