@skiddph/prui 0.9.0 → 0.10.0

package/dist/core/input.d.ts

@@ -12,6 +12,10 @@ export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElem
     size?: InputSize;
     /** Visual variant: outlined (default) or filled. */
     variant?: "default" | "filled";
+    /** Icon rendered inside the field's leading edge. */
+    icon?: React.ReactNode;
+    /** Icon rendered inside the field's trailing edge. */
+    trailingIcon?: React.ReactNode;
 }
 export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
 export declare const inputPropsMeta: PropsMeta;

package/dist/core/input.js

@@ -1,46 +1,59 @@
-import { jsx as o } from "react/jsx-runtime";
-import * as l from "react";
-import { resolveSurface as v, withSurface as h } from "./surface.js";
-import { cn as s } from "./cn.js";
-const u = "prui-f-control prui-input w-full bg-[var(--prui-s-bg,var(--prui-background))] text-[var(--prui-s-fg,var(--prui-fg))] placeholder:text-[var(--prui-dim)] border border-[var(--prui-line)] rounded-[var(--prui-s-radius,var(--prui-radius))] text-sm 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", w = {
+import { jsx as a, jsxs as N } from "react/jsx-runtime";
+import * as d from "react";
+import { resolveSurface as R, withSurface as j } from "./surface.js";
+import { cn as u } from "./cn.js";
+const p = "prui-f-control prui-input w-full bg-[var(--prui-s-bg,var(--prui-background))] text-[var(--prui-s-fg,var(--prui-fg))] placeholder:text-[var(--prui-dim)] border border-[var(--prui-line)] rounded-[var(--prui-s-radius,var(--prui-radius))] text-sm 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", z = {
   sm: "h-8 px-2.5",
   md: "h-9 px-3",
   lg: "h-11 px-4 text-base"
-}, N = l.forwardRef(
-  ({ className: e, style: t, type: r = "text", size: a = "md", variant: i = "default", bg: p, fg: d, radius: c, texture: m, textureColor: f, elevation: x, ...b }, g) => {
-    const y = v({ bg: p, fg: d, radius: c, texture: m, textureColor: f, elevation: x }), n = h(
-      s(u, w[a], i === "filled" && "bg-[var(--prui-s-bg,var(--prui-raise))] border-transparent", e),
-      t,
-      y
-    );
-    return /* @__PURE__ */ o("input", { ref: g, type: r, className: n.className, style: n.style, ...b });
+}, C = d.forwardRef(
+  ({ className: r, style: n, type: l = "text", size: o = "md", variant: c = "default", icon: e, trailingIcon: t, bg: m, fg: f, radius: g, texture: x, textureColor: v, elevation: y, ...b }, h) => {
+    const w = R({ bg: m, fg: f, radius: g, texture: x, textureColor: v, elevation: y }), s = j(
+      u(
+        p,
+        z[o],
+        c === "filled" && "bg-[var(--prui-s-bg,var(--prui-raise))] border-transparent",
+        e && "pl-9",
+        t && "pr-9",
+        r
+      ),
+      n,
+      w
+    ), i = /* @__PURE__ */ a("input", { ref: h, type: l, className: s.className, style: s.style, ...b });
+    return !e && !t ? i : /* @__PURE__ */ N("span", { className: "relative inline-flex w-full", children: [
+      e ? /* @__PURE__ */ a("span", { "aria-hidden": !0, className: "pointer-events-none absolute left-3 top-1/2 flex -translate-y-1/2 items-center text-[var(--prui-dim)] [&>svg]:h-4 [&>svg]:w-4", children: e }) : null,
+      i,
+      t ? /* @__PURE__ */ a("span", { "aria-hidden": !0, className: "pointer-events-none absolute right-3 top-1/2 flex -translate-y-1/2 items-center text-[var(--prui-dim)] [&>svg]:h-4 [&>svg]:w-4", children: t }) : null
+    ] });
   }
 );
-N.displayName = "Input";
-const S = {
+C.displayName = "Input";
+const P = {
   name: "Input",
   props: [
     { name: "type", type: "string", default: "'text'", control: "select", options: ["text", "password", "email", "number", "search"] },
     { name: "size", type: "'sm' | 'md' | 'lg'", default: "'md'", control: "select", options: ["sm", "md", "lg"] },
     { name: "variant", type: "'default' | 'filled'", default: "'default'", control: "select", options: ["default", "filled"] },
+    { name: "icon", type: "ReactNode", default: "undefined", control: "none", description: "Icon inside the leading edge (padding adjusts)." },
+    { name: "trailingIcon", type: "ReactNode", default: "undefined", control: "none", description: "Icon inside the trailing edge." },
     { name: "value", type: "string", default: null, control: "text" },
     { name: "placeholder", type: "string", default: "undefined", control: "text" },
     { name: "disabled", type: "boolean", default: "false", control: "boolean" },
     { name: "onChange", type: "(e) => void", default: null, control: "none" }
   ]
-}, z = l.forwardRef(
-  ({ className: e, style: t, ...r }, a) => /* @__PURE__ */ o(
+}, I = d.forwardRef(
+  ({ className: r, style: n, ...l }, o) => /* @__PURE__ */ a(
     "textarea",
     {
-      ref: a,
-      style: t,
-      className: s(u, "h-auto min-h-20 py-2 resize-y", e),
-      ...r
+      ref: o,
+      style: n,
+      className: u(p, "h-auto min-h-20 resize-y px-3 py-2", r),
+      ...l
     }
   )
 );
-z.displayName = "Textarea";
-const T = {
+I.displayName = "Textarea";
+const k = {
   name: "Textarea",
   props: [
     { name: "value", type: "string", default: null, control: "textarea" },
@@ -50,8 +63,8 @@ const T = {
   ]
 };
 export {
-  N as Input,
-  z as Textarea,
-  S as inputPropsMeta,
-  T as textareaPropsMeta
+  C as Input,
+  I as Textarea,
+  P as inputPropsMeta,
+  k as textareaPropsMeta
 };

package/dist/core/modal.js

@@ -1,79 +1,86 @@
-import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import * as o from "react";
-import { createRoot as X } from "react-dom/client";
-import { X as q } from "lucide-react";
-import { cn as G } from "./cn.js";
-import { useReducedMotion as B, useOverlay as F, Portal as H } from "./overlay.js";
-import { getPruiDictionary as J } from "../i18n.js";
-const O = {
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import * as r from "react";
+import { createRoot as q } from "react-dom/client";
+import { X as G } from "lucide-react";
+import { cn as H } from "./cn.js";
+import { useReducedMotion as F, useOverlay as O, Portal as J } from "./overlay.js";
+import { getPruiDictionary as K } from "../i18n.js";
+const Y = {
   xs: { width: "320px", minWidth: "280px" },
   sm: { width: "448px", minWidth: "320px" },
   md: { width: "640px", minWidth: "384px" },
   lg: { width: "896px", minWidth: "512px" },
   xl: { width: "1152px", minWidth: "640px" }
-}, K = {
+}, Q = {
   xs: "24px 32px",
   sm: "24px 32px",
   md: "32px 40px",
   lg: "32px 40px",
   xl: "40px 48px"
-}, Q = o.forwardRef(function({
-  open: r,
-  onClose: n,
+}, U = r.forwardRef(function({
+  open: t,
+  onClose: a,
   children: W,
-  disableDefaultClose: p = !1,
+  disableDefaultClose: m = !1,
   closeOnOverlayClick: M = !0,
-  size: y,
-  xs: S,
-  sm: T,
+  size: w,
+  xs: R,
+  sm: S,
   md: N,
-  lg: m,
+  lg: f,
   xl: b,
-  maxWidth: R,
-  padding: z,
-  noPadding: w = !1,
-  showCloseButton: k = !0,
-  ariaLabel: f,
-  className: h,
+  maxWidth: z,
+  padding: P,
+  noPadding: k = !1,
+  showCloseButton: C = !0,
+  ariaLabel: h,
+  className: v,
   style: s,
-  initialFocus: P = "first"
+  initialFocus: j = "first"
 }, l) {
-  const v = y ?? (S ? "xs" : T ? "sm" : m ? "lg" : b ? "xl" : "md"), [x, i] = o.useState(r), [d, u] = o.useState(!1), [g, L] = o.useState(!1), A = o.useRef(null), C = B(), E = () => {
-    C || (L(!0), setTimeout(() => L(!1), 500));
+  const x = w ?? (R ? "xs" : S ? "sm" : f ? "lg" : b ? "xl" : "md"), [g, i] = r.useState(t), [u, c] = r.useState(!1), [y, E] = r.useState(!1), V = r.useRef(null), T = F(), d = r.useRef(null), I = () => {
+    T || (E(!0), d.current != null && window.clearTimeout(d.current), d.current = window.setTimeout(() => {
+      d.current = null, E(!1);
+    }, 500));
   };
-  o.useEffect(() => {
-    if (r) {
-      if (i(!0), C) {
-        u(!0);
+  r.useEffect(
+    () => () => {
+      d.current != null && window.clearTimeout(d.current);
+    },
+    []
+  ), r.useEffect(() => {
+    if (t) {
+      if (i(!0), T) {
+        c(!0);
         return;
       }
-      const t = setTimeout(() => {
-        u(!0);
+      const o = setTimeout(() => {
+        c(!0);
       }, 10);
-      return () => clearTimeout(t);
+      return () => clearTimeout(o);
     }
-    u(!1), C && i(!1);
-  }, [r, C]);
-  const { ref: V } = F({
-    open: r,
+    c(!1), T && i(!1);
+  }, [t, T]);
+  const { ref: D } = O({
+    open: t,
     onEscape: () => {
-      if (p)
-        return E(), !1;
-      n();
+      if (m)
+        return I(), !1;
+      a();
     },
-    initialFocus: P
+    initialFocus: j
   });
-  if (!x && !d) return null;
-  const I = (t) => {
-    if (t.target === t.currentTarget) {
-      if (p || !M) {
-        E();
+  if (!g && !u) return null;
+  const B = (o) => {
+    if (o.target === o.currentTarget) {
+      if (m || !M) {
+        I();
         return;
       }
-      n();
+      a();
     }
-  }, j = O[v], D = w ? "0" : z ?? K[v];
-  return /* @__PURE__ */ e(H, { children: /* @__PURE__ */ e("div", { ref: V, children: /* @__PURE__ */ e(
+  }, L = Y[x], X = k ? "0" : P ?? Q[x];
+  return /* @__PURE__ */ e(J, { children: /* @__PURE__ */ e("div", { ref: D, children: /* @__PURE__ */ e(
     "div",
     {
       className: "prui-modal-overlay fixed inset-0 z-[var(--prui-z-modal)] flex justify-center overflow-y-auto p-4",
@@ -82,55 +89,55 @@ const O = {
         paddingTop: "10vh",
         backgroundColor: "var(--prui-scrim)",
         backdropFilter: "blur(4px)",
-        opacity: d ? 1 : 0,
+        opacity: u ? 1 : 0,
         transition: "opacity var(--prui-duration-slow) var(--prui-ease-out)"
       },
-      onClick: I,
-      onMouseDown: (t) => {
-        t.target === t.currentTarget && I(t);
+      onClick: B,
+      onMouseDown: (o) => {
+        o.target === o.currentTarget && B(o);
       },
-      children: /* @__PURE__ */ a(
+      children: /* @__PURE__ */ n(
         "div",
         {
-          ref: (t) => {
-            A.current = t, typeof l == "function" ? l(t) : l && (l.current = t);
+          ref: (o) => {
+            V.current = o, typeof l == "function" ? l(o) : l && (l.current = o);
           },
           role: "dialog",
           "aria-modal": "true",
-          "aria-label": f,
-          className: G(
+          "aria-label": h,
+          className: H(
             "prui-modal-content relative h-fit m-auto w-full",
-            g && "prui-modal-shake",
-            h
+            y && "prui-modal-shake",
+            v
           ),
           style: {
-            width: j.width,
-            minWidth: j.minWidth,
-            maxWidth: R ?? j.width,
-            padding: D,
+            width: L.width,
+            minWidth: L.minWidth,
+            maxWidth: z ?? L.width,
+            padding: X,
             backgroundColor: "var(--prui-surface)",
             border: "1px solid var(--prui-line)",
             borderRadius: "var(--prui-radius-3)",
             boxShadow: "var(--prui-shadow-modal)",
             color: "var(--prui-fg)",
-            transform: d ? "scale(1) translateY(0)" : "scale(0.95) translateY(8px)",
-            opacity: d ? 1 : 0,
+            transform: u ? "scale(1) translateY(0)" : "scale(0.95) translateY(8px)",
+            opacity: u ? 1 : 0,
             transition: "transform var(--prui-duration-slow) var(--prui-ease-out), opacity var(--prui-duration-slow) var(--prui-ease-out)",
             ...s
           },
           onTransitionEnd: () => {
-            r || i(!1);
+            t || i(!1);
           },
           children: [
             W,
-            k && !p ? /* @__PURE__ */ e(
+            C && !m ? /* @__PURE__ */ e(
               "button",
               {
                 type: "button",
-                onClick: n,
+                onClick: a,
                 "aria-label": "Close modal",
                 className: "absolute right-4 top-4 flex h-10 w-10 cursor-pointer items-center justify-center rounded-[var(--prui-radius)] text-[var(--prui-dim)] transition-all hover:bg-[var(--prui-raise)] hover:text-[var(--prui-fg)]",
-                children: /* @__PURE__ */ e(q, { className: "h-4 w-4", "aria-hidden": !0 })
+                children: /* @__PURE__ */ e(G, { className: "h-4 w-4", "aria-hidden": !0 })
               }
             ) : null
           ]
@@ -139,32 +146,32 @@ const O = {
     }
   ) }) });
 });
-Q.displayName = "Modal";
-const Y = {
+U.displayName = "Modal";
+const A = {
   success: "var(--prui-ok)",
   warning: "var(--prui-warn)",
   danger: "var(--prui-danger)",
   error: "var(--prui-danger)",
   info: "var(--prui-brand)",
   default: "var(--prui-brand)"
-}, U = ({ type: c }) => {
-  const r = Y[c ?? "default"];
-  switch (c) {
+}, Z = ({ type: p }) => {
+  const t = A[p ?? "default"];
+  switch (p) {
     case "success":
-      return /* @__PURE__ */ a("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", style: { color: r }, "aria-hidden": !0, children: [
+      return /* @__PURE__ */ n("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", style: { color: t }, "aria-hidden": !0, children: [
         /* @__PURE__ */ e("path", { d: "M9 12l2 2 4-4", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
         /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "9", stroke: "currentColor", strokeWidth: "2" })
       ] });
     case "warning":
-      return /* @__PURE__ */ e("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", style: { color: r }, "aria-hidden": !0, children: /* @__PURE__ */ e("path", { d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.694-.833-2.464 0L4.34 16.5c-.77.833.192 2.5 1.732 2.5z", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
+      return /* @__PURE__ */ e("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", style: { color: t }, "aria-hidden": !0, children: /* @__PURE__ */ e("path", { d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.694-.833-2.464 0L4.34 16.5c-.77.833.192 2.5 1.732 2.5z", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
     case "danger":
     case "error":
-      return /* @__PURE__ */ a("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", style: { color: r }, "aria-hidden": !0, children: [
+      return /* @__PURE__ */ n("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", style: { color: t }, "aria-hidden": !0, children: [
         /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "9", stroke: "currentColor", strokeWidth: "2" }),
         /* @__PURE__ */ e("path", { d: "M15 9l-6 6m0-6l6 6", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" })
       ] });
     case "info":
-      return /* @__PURE__ */ a("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", style: { color: r }, "aria-hidden": !0, children: [
+      return /* @__PURE__ */ n("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", style: { color: t }, "aria-hidden": !0, children: [
         /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "9", stroke: "currentColor", strokeWidth: "2" }),
         /* @__PURE__ */ e("path", { d: "M12 8v4m0 4h.01", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" })
       ] });
@@ -172,39 +179,39 @@ const Y = {
       return null;
   }
 };
-function oe(c) {
-  const r = J(), { title: n, message: W, confirmText: p = r.confirm, cancelText: M = r.cancel, type: y, size: S = "sm" } = c, T = Y[y ?? "default"];
+function ne(p) {
+  const t = K(), { title: a, message: W, confirmText: m = t.confirm, cancelText: M = t.cancel, type: w, size: R = "sm" } = p, S = A[w ?? "default"];
   return new Promise((N) => {
-    const m = document.createElement("div");
-    document.body.appendChild(m);
-    const b = X(m), R = () => {
+    const f = document.createElement("div");
+    document.body.appendChild(f);
+    const b = q(f), z = () => {
       setTimeout(() => {
-        b.unmount(), m.remove();
+        b.unmount(), f.remove();
       }, 320);
-    }, z = () => {
-      const [w, k] = o.useState(!1), [f, h] = o.useState(!1), [s, P] = o.useState(!1), l = o.useRef(null), v = o.useRef(null), x = B();
-      o.useEffect(() => {
-        if (x) {
-          k(!0), h(!0);
+    }, P = () => {
+      const [k, C] = r.useState(!1), [h, v] = r.useState(!1), [s, j] = r.useState(!1), l = r.useRef(null), x = r.useRef(null), g = F();
+      r.useEffect(() => {
+        if (g) {
+          C(!0), v(!0);
           return;
         }
-        const g = setTimeout(() => {
-          k(!0), h(!0);
+        const y = setTimeout(() => {
+          C(!0), v(!0);
         }, 10);
-        return () => clearTimeout(g);
-      }, [x]);
-      const i = (g) => {
-        P(!0), h(!1), setTimeout(() => {
-          R(), N(g);
-        }, x ? 0 : 300);
-      }, { ref: d } = F({
-        open: w && !s,
+        return () => clearTimeout(y);
+      }, [g]);
+      const i = (y) => {
+        j(!0), v(!1), setTimeout(() => {
+          z(), N(y);
+        }, g ? 0 : 300);
+      }, { ref: u } = O({
+        open: k && !s,
         onEscape: () => (s || i(!1), !1),
-        initialFocus: v
+        initialFocus: x
       });
-      if (!w) return null;
-      const u = O[S];
-      return /* @__PURE__ */ e("div", { ref: d, children: /* @__PURE__ */ e(
+      if (!k) return null;
+      const c = Y[R];
+      return /* @__PURE__ */ e("div", { ref: u, children: /* @__PURE__ */ e(
         "div",
         {
           className: "prui-modal-overlay fixed inset-0 z-[var(--prui-z-confirm)] flex justify-center overflow-y-auto p-4",
@@ -213,37 +220,37 @@ function oe(c) {
             paddingTop: "12vh",
             backgroundColor: "var(--prui-scrim)",
             backdropFilter: "blur(4px)",
-            opacity: f ? 1 : 0,
+            opacity: h ? 1 : 0,
             transition: "opacity var(--prui-duration-slow) var(--prui-ease-out)"
           },
-          children: /* @__PURE__ */ a(
+          children: /* @__PURE__ */ n(
             "div",
             {
               role: "alertdialog",
               "aria-modal": "true",
-              "aria-label": n,
+              "aria-label": a,
               className: "prui-modal-content relative m-auto w-full",
               style: {
-                width: u.width,
-                minWidth: u.minWidth,
+                width: c.width,
+                minWidth: c.minWidth,
                 backgroundColor: "var(--prui-surface)",
                 border: "1px solid var(--prui-line)",
                 borderRadius: "var(--prui-radius-3)",
                 boxShadow: "var(--prui-shadow-modal)",
                 color: "var(--prui-fg)",
-                transform: f ? "scale(1) translateY(0)" : "scale(0.95) translateY(8px)",
-                opacity: f ? 1 : 0,
+                transform: h ? "scale(1) translateY(0)" : "scale(0.95) translateY(8px)",
+                opacity: h ? 1 : 0,
                 transition: "transform var(--prui-duration-slow) var(--prui-ease-out), opacity var(--prui-duration-slow) var(--prui-ease-out)"
               },
               children: [
-                /* @__PURE__ */ a("div", { className: "flex items-start gap-3 p-4 pb-2", children: [
-                  /* @__PURE__ */ e(U, { type: y }),
-                  /* @__PURE__ */ a("div", { className: "min-w-0", children: [
-                    /* @__PURE__ */ e("h2", { className: "m-0 text-lg font-semibold leading-normal", style: { color: "var(--prui-fg)" }, children: n }),
+                /* @__PURE__ */ n("div", { className: "flex items-start gap-3 p-4 pb-2", children: [
+                  /* @__PURE__ */ e(Z, { type: w }),
+                  /* @__PURE__ */ n("div", { className: "min-w-0", children: [
+                    /* @__PURE__ */ e("h2", { className: "m-0 text-lg font-semibold leading-normal", style: { color: "var(--prui-fg)" }, children: a }),
                     /* @__PURE__ */ e("p", { className: "mt-2 text-sm leading-normal", style: { color: "var(--prui-dim)" }, children: W })
                   ] })
                 ] }),
-                /* @__PURE__ */ a("div", { className: "flex items-center justify-end gap-3 px-4 pb-4", children: [
+                /* @__PURE__ */ n("div", { className: "flex items-center justify-end gap-3 px-4 pb-4", children: [
                   /* @__PURE__ */ e(
                     "button",
                     {
@@ -260,12 +267,12 @@ function oe(c) {
                     "button",
                     {
                       type: "button",
-                      ref: v,
+                      ref: x,
                       disabled: s,
                       onClick: () => i(!0),
                       className: "cursor-pointer rounded-[var(--prui-radius)] border border-transparent px-4 py-2 text-sm font-medium text-white transition-all disabled:opacity-60",
-                      style: { backgroundColor: T },
-                      children: p
+                      style: { backgroundColor: S },
+                      children: m
                     }
                   )
                 ] })
@@ -275,10 +282,10 @@ function oe(c) {
         }
       ) });
     };
-    b.render(/* @__PURE__ */ e(z, {}));
+    b.render(/* @__PURE__ */ e(P, {}));
   });
 }
-const ae = {
+const ie = {
   name: "Modal",
   props: [
     { name: "open", type: "boolean", default: null, control: "boolean" },
@@ -292,7 +299,7 @@ const ae = {
     { name: "maxWidth", type: "string (CSS)", default: "per-size", control: "text" },
     { name: "initialFocus", type: 'ref | "first" | "container" | false', default: '"first"', control: "none" }
   ]
-}, ie = {
+}, ae = {
   name: "confirmModal",
   props: [
     { name: "title", type: "string", default: null, control: "text" },
@@ -303,8 +310,8 @@ const ae = {
   ]
 };
 export {
-  Q as Modal,
-  oe as confirmModal,
-  ie as confirmModalPropsMeta,
-  ae as modalPropsMeta
+  U as Modal,
+  ne as confirmModal,
+  ae as confirmModalPropsMeta,
+  ie as modalPropsMeta
 };

package/dist/core/select.d.ts

@@ -1,28 +1,44 @@
 import { PropsMeta } from './props-meta';
 import * as React from "react";
 /**
- * Select: a native-feeling single-select listbox. Full keyboard support:
- * Enter/Space/ArrowDown open, ArrowUp/Down/Home/End move, Enter/Space pick,
- * Escape (topmost overlay only) closes and restores focus, Tab closes,
- * printable-character typeahead jumps. Non-modal: no scroll lock.
+ * Select: a native-feeling single/multiple select listbox.
+ *
+ * - searchable: a filter input pins to the top of the listbox; typing
+ *   narrows the options in place (works with the options prop and with
+ *   compound <SelectItem> children alike).
+ * - multiple: multi-select — clicking toggles without closing; value and
+ *   onChange become string[] and the trigger shows the first selected
+ *   label plus a +N count.
+ *
+ * Keyboard: Enter/Space/ArrowDown open, ArrowUp/Down/Home/End move,
+ * Enter/Space pick, Escape (topmost overlay only) closes and restores
+ * focus, Tab closes, printable-character typeahead jumps. Non-modal: no
+ * scroll lock. The listbox portals to the body and anchors under the
+ * trigger, so no ancestor can clip or displace it.
  */
 export interface SelectOption {
     label: string;
     value: string;
     disabled?: boolean;
 }
-export interface SelectProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "value"> {
+export interface SelectProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "value" | "defaultValue" | "multiple"> {
     options?: SelectOption[];
-    value?: string;
-    defaultValue?: string;
+    /** string in single mode, string[] with multiple. */
+    value?: string | string[];
+    defaultValue?: string | string[];
     placeholder?: string;
     disabled?: boolean;
     name?: string;
-    onChange?: (value: string) => void;
+    /** Emits string in single mode, string[] with multiple. */
+    onChange?: (value: string | string[]) => void;
     onOpenChange?: (open: boolean) => void;
+    /** Type-to-filter the options inside the listbox. */
+    searchable?: boolean;
+    /** Multi-select: value/onChange become string[], items toggle. */
+    multiple?: boolean;
 }
 export declare const Select: {
-    ({ options, value: valueProp, defaultValue, placeholder, disabled, name, id, onChange, onOpenChange, children, ...rest }: SelectProps): React.JSX.Element;
+    ({ options, value: valueProp, defaultValue, placeholder, disabled, name, onChange, onOpenChange, searchable, multiple, id, children, ...rest }: SelectProps): React.JSX.Element;
     displayName: string;
 };
 export type SelectTriggerProps = React.ButtonHTMLAttributes<HTMLButtonElement>;