@skiddph/prui 0.7.0 → 0.8.0

package/dist/core/date-picker.js

@@ -0,0 +1,202 @@
+import { jsxs as x, Fragment as $, jsx as a } from "react/jsx-runtime";
+import * as s from "react";
+import { CalendarDays as z } from "lucide-react";
+import { cn as j } from "./cn.js";
+import { useOverlayStack as E, useEscapeKey as F, Portal as T } from "./overlay.js";
+import { useAnchoredPosition as H } from "./anchor.js";
+import { Calendar as U } from "./calendar.js";
+import { usePruiI18n as I } from "../i18n.js";
+const K = s.forwardRef(function({ value: v, defaultValue: D, onChange: t, min: h, max: M, placeholder: R = "YYYY-MM-DD", disabled: b, className: k, ariaLabel: w }, l) {
+  const [g, N] = s.useState(D ?? ""), m = v !== void 0, f = m ? v : g, [r, o] = s.useState(!1), i = s.useRef(null), [u, y] = s.useState(""), { setElement: P, isTop: S } = E(r);
+  F(r, S, () => {
+    var e;
+    o(!1), (e = i.current) == null || e.focus();
+  });
+  const { ref: d, position: c } = H({ active: r, anchorRef: i, side: "bottom", align: "start", offsetHeight: 360 }), Y = (e) => {
+    var n;
+    m || N(e), t == null || t(e), o(!1), (n = i.current) == null || n.focus();
+  };
+  return /* @__PURE__ */ x($, { children: [
+    /* @__PURE__ */ a(
+      "input",
+      {
+        ref: (e) => {
+          i.current = e, typeof l == "function" ? l(e) : l && (l.current = e);
+        },
+        type: "text",
+        readOnly: !0,
+        role: "combobox",
+        "aria-expanded": r,
+        "aria-haspopup": "dialog",
+        "aria-label": w,
+        placeholder: R,
+        disabled: b,
+        value: u !== "" ? u : f,
+        onFocus: () => {
+          !b && !r && o(!0);
+        },
+        onClick: () => o(!0),
+        onChange: (e) => {
+          const n = e.target.value;
+          y(n), /^\d{4}-\d{2}-\d{2}$/.test(n) && (y(""), Y(n));
+        },
+        className: j(
+          "prui-date-picker flex h-9 w-full cursor-pointer items-center gap-2 border border-[var(--prui-line)]",
+          "bg-[var(--prui-background)] rounded-[var(--prui-radius)] px-3 text-sm text-[var(--prui-fg)] placeholder:text-[var(--prui-dim)]",
+          "outline-none transition-colors focus:border-[var(--prui-brand)] focus:ring-2 focus:ring-[var(--prui-brand)]/30",
+          "disabled:opacity-50 disabled:cursor-not-allowed",
+          k
+        )
+      }
+    ),
+    /* @__PURE__ */ a(z, { className: "pointer-events-none -ml-7 h-4 w-4 text-[var(--prui-dim)]", "aria-hidden": !0 }),
+    r ? /* @__PURE__ */ a(T, { children: /* @__PURE__ */ a(
+      "div",
+      {
+        ref: (e) => {
+          d(e), P(e);
+        },
+        role: "dialog",
+        "aria-label": "Choose date",
+        className: "fixed z-[var(--prui-z-overlay)]",
+        style: { top: (c == null ? void 0 : c.top) ?? -9999, left: (c == null ? void 0 : c.left) ?? -9999 },
+        children: /* @__PURE__ */ a(U, { value: f, onSelect: Y, min: h, max: M, className: "shadow-[var(--prui-shadow-lg)]" })
+      }
+    ) }) : null
+  ] });
+});
+K.displayName = "DatePicker";
+const q = s.forwardRef(function({ value: v, defaultValue: D, onChange: t, min: h, max: M, placeholder: R = "YYYY-MM-DD – YYYY-MM-DD", disabled: b, className: k, ariaLabel: w }, l) {
+  const { t: g } = I(), [N, m] = s.useState(D ?? {}), f = v !== void 0, r = f ? v : N, [o, i] = s.useState(!1), u = s.useRef(null), { setElement: y, isTop: P } = E(o);
+  F(o, P, () => {
+    var e;
+    i(!1), (e = u.current) == null || e.focus();
+  });
+  const { ref: S, position: d } = H({ active: o, anchorRef: u, side: "bottom", align: "start", offsetHeight: 360 }), c = (e) => {
+    var O;
+    const { from: n, to: A } = r;
+    let p;
+    if (!n || n && A)
+      p = { from: e };
+    else if (e < n)
+      p = { from: e };
+    else {
+      p = { from: n, to: e }, t == null || t(p), f || m(p), i(!1), (O = u.current) == null || O.focus();
+      return;
+    }
+    f || m(p), t == null || t(p);
+  }, Y = r.from ? r.to ? `${r.from} – ${r.to}` : `${r.from} – …` : "";
+  return /* @__PURE__ */ x($, { children: [
+    /* @__PURE__ */ a(
+      "input",
+      {
+        ref: (e) => {
+          u.current = e, typeof l == "function" ? l(e) : l && (l.current = e);
+        },
+        type: "text",
+        readOnly: !0,
+        role: "combobox",
+        "aria-expanded": o,
+        "aria-haspopup": "dialog",
+        "aria-label": w,
+        placeholder: R,
+        disabled: b,
+        value: Y,
+        onClick: () => i(!0),
+        onFocus: () => {
+          !b && !o && i(!0);
+        },
+        className: j(
+          "prui-date-range-picker flex h-9 w-full cursor-pointer items-center border border-[var(--prui-line)]",
+          "bg-[var(--prui-background)] rounded-[var(--prui-radius)] px-3 text-sm text-[var(--prui-fg)] placeholder:text-[var(--prui-dim)]",
+          "outline-none transition-colors focus:border-[var(--prui-brand)] focus:ring-2 focus:ring-[var(--prui-brand)]/30",
+          "disabled:opacity-50 disabled:cursor-not-allowed",
+          k
+        )
+      }
+    ),
+    /* @__PURE__ */ a(z, { className: "pointer-events-none -ml-7 h-4 w-4 text-[var(--prui-dim)]", "aria-hidden": !0 }),
+    o ? /* @__PURE__ */ a(T, { children: /* @__PURE__ */ a(
+      "div",
+      {
+        ref: (e) => {
+          S(e), y(e);
+        },
+        role: "dialog",
+        "aria-label": "Choose date range",
+        className: "fixed z-[var(--prui-z-overlay)]",
+        style: { top: (d == null ? void 0 : d.top) ?? -9999, left: (d == null ? void 0 : d.left) ?? -9999 },
+        children: /* @__PURE__ */ x("div", { className: "shadow-[var(--prui-shadow-lg)]", children: [
+          /* @__PURE__ */ a(
+            U,
+            {
+              value: r.to ?? r.from,
+              month: r.from ? `${r.from.slice(0, 7)}` : void 0,
+              onSelect: c,
+              min: h,
+              max: M,
+              showToday: !1,
+              className: "border-0 shadow-none",
+              "data-range-from": r.from ?? "",
+              "data-range-to": r.to ?? ""
+            }
+          ),
+          /* @__PURE__ */ x("div", { className: "flex items-center justify-between gap-2 border-t border-[var(--prui-line)] px-3 py-2 text-xs text-[var(--prui-dim)]", children: [
+            /* @__PURE__ */ a("span", { "data-testid": "range-label", children: Y || g.today }),
+            /* @__PURE__ */ x("div", { className: "flex gap-2", children: [
+              /* @__PURE__ */ a(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => {
+                    f || m({}), t == null || t({});
+                  },
+                  className: "cursor-pointer rounded-[var(--prui-radius-1)] px-2 py-1 transition-colors hover:bg-[var(--prui-raise)]",
+                  children: g.clear
+                }
+              ),
+              /* @__PURE__ */ a(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => {
+                    var e;
+                    i(!1), (e = u.current) == null || e.focus();
+                  },
+                  className: "cursor-pointer rounded-[var(--prui-radius-1)] bg-[var(--prui-brand)]/15 px-2 py-1 text-[var(--prui-brand)] transition-colors hover:bg-[var(--prui-brand)]/25",
+                  children: g.apply
+                }
+              )
+            ] })
+          ] })
+        ] })
+      }
+    ) }) : null
+  ] });
+});
+q.displayName = "DateRangePicker";
+const Z = {
+  name: "DatePicker",
+  props: [
+    { name: "value", type: "string 'YYYY-MM-DD'", default: "undefined", control: "date" },
+    { name: "defaultValue", type: "string 'YYYY-MM-DD'", default: "undefined", control: "date" },
+    { name: "onChange", type: "(date: string) => void", default: null, control: "none" },
+    { name: "min", type: "string 'YYYY-MM-DD'", default: "undefined", control: "date" },
+    { name: "max", type: "string 'YYYY-MM-DD'", default: "undefined", control: "date" }
+  ]
+}, _ = {
+  name: "DateRangePicker",
+  props: [
+    { name: "value", type: "{ from?: string, to?: string }", default: "{}", control: "daterange" },
+    { name: "defaultValue", type: "{ from?: string, to?: string }", default: "{}", control: "daterange" },
+    { name: "onChange", type: "(range: DateRange) => void", default: null, control: "none" },
+    { name: "min", type: "string 'YYYY-MM-DD'", default: "undefined", control: "date" },
+    { name: "max", type: "string 'YYYY-MM-DD'", default: "undefined", control: "date" }
+  ]
+};
+export {
+  K as DatePicker,
+  q as DateRangePicker,
+  Z as datePickerPropsMeta,
+  _ as dateRangePickerPropsMeta
+};

package/dist/core/dialog.d.ts

@@ -1,5 +1,11 @@
 import { PropsMeta } from './props-meta';
 import * as React from "react";
+/**
+ * Dialog: the compound, declarative modal surface (<Dialog> + <DialogContent/
+ * Header/Title/Description/Footer>). Built on the shared overlay
+ * infrastructure: portaled, focus-trapped with focus restoration, topmost
+ * Escape, scroll-locked, background aria-hidden/inert while open.
+ */
 export interface DialogProps {
     open?: boolean;
     defaultOpen?: boolean;
@@ -16,6 +22,8 @@ export interface DialogContentProps extends React.HTMLAttributes<HTMLDivElement>
     /** Accessibility label when no DialogTitle is rendered. */
     ariaLabel?: string;
     hideClose?: boolean;
+    /** Initial focus target: first focusable (default), the dialog itself, a specific element, or none. */
+    initialFocus?: React.RefObject<HTMLElement | null> | "first" | "container" | false;
 }
 export declare const DialogContent: React.ForwardRefExoticComponent<DialogContentProps & React.RefAttributes<HTMLDivElement>>;
 export declare const DialogHeader: ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element;

package/dist/core/dialog.js

@@ -1,102 +1,100 @@
-import { jsx as a, jsxs as y } from "react/jsx-runtime";
-import * as l from "react";
-import { X as x } from "lucide-react";
-import { cn as d } from "./cn.js";
-const m = l.createContext(null);
-function v() {
-  const e = l.useContext(m);
+import { jsx as t, jsxs as y } from "react/jsx-runtime";
+import * as a from "react";
+import { X as D } from "lucide-react";
+import { cn as n } from "./cn.js";
+import { useOverlay as h, Portal as w } from "./overlay.js";
+import { usePruiI18n as N } from "../i18n.js";
+const v = a.createContext(null);
+function g() {
+  const e = a.useContext(v);
   if (!e) throw new Error("Dialog parts must be used inside <Dialog>");
   return e;
 }
-const w = ({ open: e, defaultOpen: o = !1, onOpenChange: t, children: n }) => {
-  const [c, p] = l.useState(o), u = e !== void 0, s = u ? e : c, i = l.useId(), f = (r) => {
-    u || p(r), t == null || t(r);
+const I = ({ open: e, defaultOpen: o = !1, onOpenChange: r, children: i }) => {
+  const [c, p] = a.useState(o), s = e !== void 0, f = s ? e : c, d = a.useId(), l = (u) => {
+    s || p(u), r == null || r(u);
   };
-  return /* @__PURE__ */ a(m.Provider, { value: { open: s, setOpen: f, labelId: i }, children: n });
+  return /* @__PURE__ */ t(v.Provider, { value: { open: f, setOpen: l, labelId: d }, children: i });
 };
-w.displayName = "Dialog";
-const D = l.forwardRef(
-  ({ className: e, children: o, ariaLabel: t, hideClose: n, onClick: c, ...p }, u) => {
-    const { open: s, setOpen: i, labelId: f } = v();
-    return l.useEffect(() => {
-      if (!s) return;
-      const r = (b) => {
-        b.key === "Escape" && i(!1);
-      };
-      document.addEventListener("keydown", r);
-      const g = document.body.style.overflow;
-      return document.body.style.overflow = "hidden", () => {
-        document.removeEventListener("keydown", r), document.body.style.overflow = g;
-      };
-    }, [s, i]), s ? /* @__PURE__ */ a(
+I.displayName = "Dialog";
+const C = a.forwardRef(
+  ({ className: e, children: o, ariaLabel: r, hideClose: i, initialFocus: c = "first", onClick: p, ...s }, f) => {
+    const { open: d, setOpen: l, labelId: u } = g(), { t: b } = N(), { ref: x } = h({
+      open: d,
+      onEscape: () => l(!1),
+      initialFocus: c
+    });
+    return d ? /* @__PURE__ */ t(w, { children: /* @__PURE__ */ t("div", { ref: x, children: /* @__PURE__ */ t(
       "div",
       {
-        className: "prui-dialog-overlay fixed inset-0 z-50 flex items-center justify-center p-4",
-        style: { backgroundColor: "rgba(0,0,0,0.55)" },
-        onMouseDown: (r) => {
-          r.target === r.currentTarget && i(!1);
+        className: "prui-dialog-overlay fixed inset-0 z-[var(--prui-z-overlay)] flex items-center justify-center p-4",
+        style: { backgroundColor: "var(--prui-scrim)" },
+        onMouseDown: (m) => {
+          m.target === m.currentTarget && l(!1);
         },
         children: /* @__PURE__ */ y(
           "div",
           {
-            ref: u,
+            ref: f,
             role: "dialog",
             "aria-modal": "true",
-            "aria-label": t,
-            "aria-labelledby": t ? void 0 : f,
-            className: d(
-              "prui-dialog-content relative z-10 w-full max-w-lg rounded-[var(--prui-radius)]",
-              "border border-[var(--prui-line)] bg-[var(--prui-surface)] shadow-xl",
+            "aria-label": r,
+            "aria-labelledby": r ? void 0 : u,
+            tabIndex: -1,
+            className: n(
+              "prui-dialog-content relative z-[var(--prui-z-content)] w-full max-w-lg rounded-[var(--prui-radius)]",
+              "border border-[var(--prui-line)] bg-[var(--prui-surface)] shadow-[var(--prui-shadow-lg)]",
               "max-h-[85vh] overflow-auto outline-none",
               e
             ),
-            onClick: c,
-            ...p,
+            onClick: p,
+            ...s,
             children: [
               o,
-              n ? null : /* @__PURE__ */ a(
+              i ? null : /* @__PURE__ */ t(
                 "button",
                 {
                   type: "button",
-                  "aria-label": "Close",
-                  onClick: () => i(!1),
+                  "aria-label": b.close,
+                  onClick: () => l(!1),
                   className: "absolute right-3 top-3 rounded-[var(--prui-radius-1)] p-1 text-[var(--prui-dim)] hover:text-[var(--prui-fg)] hover:bg-[var(--prui-raise)] cursor-pointer",
-                  children: /* @__PURE__ */ a(x, { className: "h-4 w-4", "aria-hidden": !0 })
+                  children: /* @__PURE__ */ t(D, { className: "h-4 w-4", "aria-hidden": !0 })
                 }
               )
             ]
           }
         )
       }
-    ) : null;
+    ) }) }) : null;
   }
 );
-D.displayName = "DialogContent";
-const j = ({ className: e, ...o }) => /* @__PURE__ */ a("div", { className: d("prui-dialog-header flex flex-col gap-1 p-4 pb-2", e), ...o }), h = l.forwardRef(
-  ({ className: e, ...o }, t) => {
-    const { labelId: n } = v();
-    return /* @__PURE__ */ a("h2", { ref: t, id: n, className: d("prui-dialog-title text-base font-semibold text-[var(--prui-fg)]", e), ...o });
+C.displayName = "DialogContent";
+const F = ({ className: e, ...o }) => /* @__PURE__ */ t("div", { className: n("prui-dialog-header flex flex-col gap-1 p-4 pb-2", e), ...o }), R = a.forwardRef(
+  ({ className: e, ...o }, r) => {
+    const { labelId: i } = g();
+    return /* @__PURE__ */ t("h2", { ref: r, id: i, className: n("prui-dialog-title text-base font-semibold text-[var(--prui-fg)]", e), ...o });
   }
 );
-h.displayName = "DialogTitle";
-const N = l.forwardRef(
-  ({ className: e, ...o }, t) => /* @__PURE__ */ a("p", { ref: t, className: d("prui-dialog-description text-sm text-[var(--prui-dim)]", e), ...o })
+R.displayName = "DialogTitle";
+const j = a.forwardRef(
+  ({ className: e, ...o }, r) => /* @__PURE__ */ t("p", { ref: r, className: n("prui-dialog-description text-sm text-[var(--prui-dim)]", e), ...o })
 );
-N.displayName = "DialogDescription";
-const I = ({ className: e, ...o }) => /* @__PURE__ */ a("div", { className: d("prui-dialog-footer flex items-center justify-end gap-2 p-4 pt-2", e), ...o }), R = {
+j.displayName = "DialogDescription";
+const M = ({ className: e, ...o }) => /* @__PURE__ */ t("div", { className: n("prui-dialog-footer flex items-center justify-end gap-2 p-4 pt-2", e), ...o }), H = {
   name: "Dialog",
   props: [
     { name: "open", type: "boolean", default: "undefined", control: "boolean" },
     { name: "defaultOpen", type: "boolean", default: "false", control: "boolean" },
-    { name: "onOpenChange", type: "(open: boolean) => void", default: null, control: "none" }
+    { name: "onOpenChange", type: "(open: boolean) => void", default: null, control: "none" },
+    { name: "initialFocus", type: 'ref | "first" | "container" | false', default: '"first"', control: "none" }
   ]
 };
 export {
-  w as Dialog,
-  D as DialogContent,
-  N as DialogDescription,
-  I as DialogFooter,
-  j as DialogHeader,
-  h as DialogTitle,
-  R as dialogPropsMeta
+  I as Dialog,
+  C as DialogContent,
+  j as DialogDescription,
+  M as DialogFooter,
+  F as DialogHeader,
+  R as DialogTitle,
+  H as dialogPropsMeta
 };

package/dist/core/drawer.d.ts

@@ -0,0 +1,34 @@
+import { PropsMeta } from './props-meta';
+import * as React from "react";
+/**
+ * Drawer: a side-anchored modal panel (left/right/top/bottom) built on the
+ * shared overlay infrastructure: portaled, focus-trapped, scroll-locked,
+ * background inert, topmost Escape, focus restoration, reduced motion.
+ * Sheet is the same surface preset to bottom (mobile-first) with a drag
+ * handle. Controlled and uncontrolled open.
+ */
+export type DrawerSide = "left" | "right" | "top" | "bottom";
+export interface DrawerProps {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Anchor edge. Default right. */
+    side?: DrawerSide;
+    /** Panel width for left/right (any CSS length). Default 400px. */
+    size?: number | string;
+    children?: React.ReactNode;
+    /** Accessible label. */
+    ariaLabel?: string;
+    /** Hide the close button. */
+    hideClose?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const Drawer: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Sheet: the bottom-anchored Drawer preset (mobile-first detail surface).
+ * Same overlay guarantees; size sets max height.
+ */
+export declare const Sheet: React.ForwardRefExoticComponent<Omit<DrawerProps, "side"> & React.RefAttributes<HTMLDivElement>>;
+export declare const drawerPropsMeta: PropsMeta;
+export declare const sheetPropsMeta: PropsMeta;

package/dist/core/drawer.js

@@ -0,0 +1,129 @@
+import { jsx as t, jsxs as Y } from "react/jsx-runtime";
+import * as a from "react";
+import { X as k } from "lucide-react";
+import { cn as P } from "./cn.js";
+import { useReducedMotion as j, useOverlay as A, Portal as E } from "./overlay.js";
+import { usePruiI18n as F } from "../i18n.js";
+const L = {
+  left: "left-0 top-0 h-full prui-drawer-panel",
+  right: "right-0 top-0 h-full prui-drawer-panel",
+  top: "left-0 top-0 w-full prui-drawer-panel",
+  bottom: "left-0 bottom-0 w-full prui-drawer-panel"
+}, $ = {
+  left: "translateX(0)",
+  right: "translateX(0)",
+  top: "translateY(0)",
+  bottom: "translateY(0)"
+}, q = {
+  left: "translateX(-100%)",
+  right: "translateX(100%)",
+  top: "translateY(-100%)",
+  bottom: "translateY(100%)"
+}, h = a.forwardRef(function({ open: n, defaultOpen: i = !1, onOpenChange: s, side: r = "right", size: o, children: v, ariaLabel: w, hideClose: y, className: g, style: x }, S) {
+  const [N, D] = a.useState(i), m = n !== void 0, l = m ? n : N, [M, u] = a.useState(l), [p, d] = a.useState(!1), f = j(), { t: R } = F(), c = (e) => {
+    m || D(e), s == null || s(e);
+  };
+  a.useEffect(() => {
+    if (l) {
+      if (u(!0), f) {
+        d(!0);
+        return;
+      }
+      const C = requestAnimationFrame(() => d(!0));
+      return () => cancelAnimationFrame(C);
+    }
+    if (d(!1), f) {
+      u(!1);
+      return;
+    }
+    const e = setTimeout(() => u(!1), 300);
+    return () => clearTimeout(e);
+  }, [l, f]);
+  const { ref: T } = A({
+    open: l,
+    onEscape: () => c(!1)
+  });
+  if (!M) return null;
+  const X = {
+    transform: p ? $[r] : q[r],
+    transition: "transform var(--prui-duration-slow) var(--prui-ease-out)",
+    ...r === "left" || r === "right" ? { width: typeof o == "number" ? `${o}px` : o ?? "400px" } : { maxHeight: typeof o == "number" ? `${o}px` : o ?? "80vh" },
+    ...x
+  };
+  return /* @__PURE__ */ t(E, { children: /* @__PURE__ */ t("div", { ref: T, children: /* @__PURE__ */ t(
+    "div",
+    {
+      className: "prui-drawer-overlay fixed inset-0 z-[var(--prui-z-modal)]",
+      style: {
+        backgroundColor: "var(--prui-scrim)",
+        opacity: p ? 1 : 0,
+        transition: "opacity var(--prui-duration-slow) var(--prui-ease-out)"
+      },
+      onMouseDown: (e) => {
+        e.target === e.currentTarget && c(!1);
+      },
+      children: /* @__PURE__ */ Y(
+        "div",
+        {
+          ref: S,
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": w,
+          "data-state": p ? "open" : "closed",
+          className: P(
+            "absolute flex flex-col overflow-y-auto border border-[var(--prui-line)] bg-[var(--prui-surface)]",
+            "text-[var(--prui-fg)] shadow-[var(--prui-shadow-modal)] outline-none",
+            L[r],
+            g
+          ),
+          style: X,
+          children: [
+            r === "bottom" ? /* @__PURE__ */ t("div", { "aria-hidden": !0, className: "mx-auto mt-2 mb-1 h-1 w-10 shrink-0 rounded-[var(--prui-radius-full)] bg-[var(--prui-line)]" }) : null,
+            v,
+            y ? null : /* @__PURE__ */ t(
+              "button",
+              {
+                type: "button",
+                "aria-label": R.close,
+                onClick: () => c(!1),
+                className: "absolute right-3 top-3 rounded-[var(--prui-radius-1)] p-1 text-[var(--prui-dim)] transition-colors hover:bg-[var(--prui-raise)] hover:text-[var(--prui-fg)] cursor-pointer",
+                children: /* @__PURE__ */ t(k, { className: "h-4 w-4", "aria-hidden": !0 })
+              }
+            )
+          ]
+        }
+      )
+    }
+  ) }) });
+});
+h.displayName = "Drawer";
+const H = a.forwardRef(function(n, i) {
+  return /* @__PURE__ */ t(h, { ref: i, side: "bottom", ...n });
+});
+H.displayName = "Sheet";
+const J = {
+  name: "Drawer",
+  props: [
+    { name: "open", type: "boolean", default: "undefined", control: "boolean" },
+    { name: "defaultOpen", type: "boolean", default: "false", control: "boolean" },
+    { name: "onOpenChange", type: "(open: boolean) => void", default: null, control: "none" },
+    { name: "side", type: "'left' | 'right' | 'top' | 'bottom'", default: "'right'", control: "select", options: ["left", "right", "top", "bottom"] },
+    { name: "size", type: "number | string (CSS length)", default: "400px / 80vh", control: "text" },
+    { name: "ariaLabel", type: "string", default: null, control: "text" },
+    { name: "hideClose", type: "boolean", default: "false", control: "boolean" }
+  ]
+}, K = {
+  name: "Sheet",
+  props: [
+    { name: "open", type: "boolean", default: "undefined", control: "boolean" },
+    { name: "onOpenChange", type: "(open: boolean) => void", default: null, control: "none" },
+    { name: "size", type: "number | string (max height)", default: "80vh", control: "text" },
+    { name: "ariaLabel", type: "string", default: null, control: "text" }
+  ]
+};
+export {
+  h as Drawer,
+  H as Sheet,
+  J as drawerPropsMeta,
+  K as sheetPropsMeta
+};

package/dist/core/dropdown.d.ts

@@ -1,5 +1,12 @@
 import { PropsMeta } from './props-meta';
 import * as React from "react";
+/**
+ * Dropdown: an anchored menu over a trigger. Full WAI-ARIA menu keyboard
+ * support: Enter/Space/ArrowDown open, ArrowUp/Down + Home/End move,
+ * printable-character typeahead selects, Escape (topmost overlay only)
+ * closes and restores focus to the trigger, Tab closes. Non-modal: no scroll
+ * lock and no background inertness.
+ */
 export interface DropdownItem {
     label: string;
     onSelect?: () => void;
@@ -17,8 +24,5 @@ export interface DropdownProps {
     align?: "start" | "end";
     className?: string;
 }
-export declare const Dropdown: {
-    ({ items, trigger, children, open: openProp, defaultOpen, onOpenChange, align, className, }: DropdownProps): React.JSX.Element;
-    displayName: string;
-};
+export declare const Dropdown: React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLDivElement>>;
 export declare const dropdownPropsMeta: PropsMeta;