@skiddph/prui 0.9.1 → 0.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,248 +1,331 @@
1
- import { jsxs as D, jsx as y, Fragment as W } from "react/jsx-runtime";
2
- import * as a from "react";
3
- import { ChevronDown as q, Check as H } from "lucide-react";
4
- import { cn as A } from "./cn.js";
5
- import { useOverlayStack as B, useEscapeKey as G, Portal as J } from "./overlay.js";
6
- import { useAnchoredPosition as Q } from "./anchor.js";
7
- import { typeaheadIndex as X, endIndex as Y, homeIndex as Z, moveIndex as F } from "./list-nav.js";
8
- const L = a.createContext(null);
9
- function E() {
10
- const i = a.useContext(L);
11
- if (!i) throw new Error("Select parts must be used inside <Select>");
12
- return i;
1
+ import { jsxs as P, jsx as b, Fragment as G } from "react/jsx-runtime";
2
+ import * as r from "react";
3
+ import { ChevronDown as te, Search as re, Check as ae } from "lucide-react";
4
+ import { cn as V } from "./cn.js";
5
+ import { useOverlayStack as ne, useEscapeKey as se, Portal as le } from "./overlay.js";
6
+ import { useAnchoredPosition as ie } from "./anchor.js";
7
+ import { typeaheadIndex as oe, endIndex as K, homeIndex as ue, moveIndex as Q } from "./list-nav.js";
8
+ import { usePruiI18n as ce } from "../i18n.js";
9
+ const J = r.createContext(null);
10
+ function $() {
11
+ const o = r.useContext(J);
12
+ if (!o) throw new Error("Select parts must be used inside <Select>");
13
+ return o;
13
14
  }
14
- const _ = ({
15
- options: i,
16
- value: u,
17
- defaultValue: b,
18
- placeholder: d = "Select...",
19
- disabled: f,
15
+ const B = (o) => o === void 0 ? [] : Array.isArray(o) ? o : [o], de = ({
16
+ options: o,
17
+ value: m,
18
+ defaultValue: h,
19
+ placeholder: v = "Select...",
20
+ disabled: g,
20
21
  name: l,
21
- id: v,
22
- onChange: n,
23
- onOpenChange: p,
24
- children: w,
25
- ...g
22
+ onChange: c,
23
+ onOpenChange: n,
24
+ searchable: f = !1,
25
+ multiple: y = !1,
26
+ id: w,
27
+ children: N,
28
+ ...T
26
29
  }) => {
27
- var o;
28
- const [m, h] = a.useState(b ?? ""), [x, S] = a.useState(!1), [e, V] = a.useState(null), [O, P] = a.useState({}), T = u !== void 0 ? u : m, I = a.useCallback((r, c) => {
29
- P((s) => {
30
- if (c === null) {
31
- if (!(r in s)) return s;
32
- const R = { ...s };
33
- return delete R[r], R;
30
+ const [A, p] = r.useState(B(h)), [a, j] = r.useState(!1), [R, C] = r.useState(null), [F, M] = r.useState({}), U = m !== void 0, S = U ? B(m) : A, q = (t) => {
31
+ let u;
32
+ y ? u = S.includes(t) ? S.filter((k) => k !== t) : [...S, t] : u = S.includes(t) ? [] : [t], U || p(u), c == null || c(y ? u : u[0] ?? "");
33
+ }, W = (t) => {
34
+ j(t), n == null || n(t);
35
+ }, H = () => R == null ? void 0 : R.focus(), D = (t) => {
36
+ var u;
37
+ return F[t] ?? ((u = o == null ? void 0 : o.find((k) => k.value === t)) == null ? void 0 : u.label);
38
+ }, L = S.length ? S.map((t) => D(t) ?? t).join(", ") : void 0, E = r.useCallback((t, u) => {
39
+ M((k) => {
40
+ if (u === null) {
41
+ if (!(t in k)) return k;
42
+ const z = { ...k };
43
+ return delete z[t], z;
34
44
  }
35
- return s[r] === c ? s : { ...s, [r]: c };
45
+ return k[t] === u ? k : { ...k, [t]: u };
36
46
  });
37
- }, []), N = (r) => {
38
- u === void 0 && h(r), n == null || n(r);
39
- }, k = (r) => {
40
- S(r), p == null || p(r);
41
- }, j = () => e == null ? void 0 : e.focus(), t = O[T] ?? ((o = i == null ? void 0 : i.find((r) => r.value === T)) == null ? void 0 : o.label);
42
- return /* @__PURE__ */ D(
43
- L.Provider,
47
+ }, []);
48
+ return /* @__PURE__ */ P(
49
+ J.Provider,
44
50
  {
45
- value: { value: T, displayValue: t, open: x, triggerEl: e, triggerId: (e == null ? void 0 : e.id) || void 0, setValue: N, setOpen: k, registerTrigger: V, returnFocusToTrigger: j, registerLabel: I },
51
+ value: { values: S, multiple: y, searchable: f, displayValue: L, open: a, triggerEl: R, triggerId: (R == null ? void 0 : R.id) || void 0, toggleValue: q, setOpen: W, registerTrigger: C, returnFocusToTrigger: H, registerLabel: E },
46
52
  children: [
47
- l ? /* @__PURE__ */ y("input", { type: "hidden", name: l, value: T }) : null,
48
- w ?? /* @__PURE__ */ D(W, { children: [
49
- /* @__PURE__ */ y(U, { disabled: f, id: v, ...g, children: /* @__PURE__ */ y($, { placeholder: d }) }),
50
- /* @__PURE__ */ y(z, { children: (i ?? []).map((r) => /* @__PURE__ */ y(M, { value: r.value, disabled: r.disabled, children: r.label }, r.value)) })
53
+ l ? /* @__PURE__ */ b("input", { type: "hidden", name: l, value: S.join(",") }) : null,
54
+ N ?? /* @__PURE__ */ P(G, { children: [
55
+ /* @__PURE__ */ b(X, { disabled: g, id: w, ...T, children: /* @__PURE__ */ b(Y, { placeholder: v }) }),
56
+ /* @__PURE__ */ b(Z, { children: (o ?? []).map((t) => /* @__PURE__ */ b(_, { value: t.value, disabled: t.disabled, children: t.label }, t.value)) })
51
57
  ] })
52
58
  ]
53
59
  }
54
60
  );
55
61
  };
56
- _.displayName = "Select";
57
- const U = a.forwardRef(
58
- ({ className: i, children: u, onClick: b, onKeyDown: d, disabled: f, id: l, ...v }, n) => {
59
- const { open: p, setOpen: w, registerTrigger: g } = E(), m = a.useRef(null), h = a.useId(), x = l ?? `prui-select-${h}`;
60
- a.useEffect(() => (g(m.current), () => g(null)), [g]);
61
- const S = `${x}-listbox`;
62
- return /* @__PURE__ */ D(
62
+ de.displayName = "Select";
63
+ const X = r.forwardRef(
64
+ ({ className: o, children: m, onClick: h, onKeyDown: v, disabled: g, id: l, ...c }, n) => {
65
+ const { open: f, setOpen: y, registerTrigger: w } = $(), N = r.useRef(null), T = r.useId(), A = l ?? `prui-select-${T}`;
66
+ r.useEffect(() => (w(N.current), () => w(null)), [w]);
67
+ const p = `${A}-listbox`;
68
+ return /* @__PURE__ */ P(
63
69
  "button",
64
70
  {
65
- ref: (e) => {
66
- m.current = e, typeof n == "function" ? n(e) : n && (n.current = e);
71
+ ref: (a) => {
72
+ N.current = a, typeof n == "function" ? n(a) : n && (n.current = a);
67
73
  },
68
- id: x,
74
+ id: A,
69
75
  type: "button",
70
76
  role: "combobox",
71
- "aria-expanded": p,
77
+ "aria-expanded": f,
72
78
  "aria-haspopup": "listbox",
73
- "aria-controls": p ? S : void 0,
74
- disabled: f,
75
- "data-state": p ? "open" : "closed",
76
- className: A(
79
+ "aria-controls": f ? p : void 0,
80
+ disabled: g,
81
+ "data-state": f ? "open" : "closed",
82
+ className: V(
77
83
  "prui-select-trigger flex h-9 w-full items-center justify-between gap-2 border border-[var(--prui-line)]",
78
84
  "bg-[var(--prui-background)] rounded-[var(--prui-radius)] px-3 text-sm text-[var(--prui-fg)]",
79
85
  "outline-none transition-colors focus:border-[var(--prui-brand)] focus:ring-2 focus:ring-[var(--prui-brand)]/30",
80
86
  "disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer",
81
- i
87
+ o
82
88
  ),
83
- onClick: (e) => {
84
- b == null || b(e), e.defaultPrevented || w(!p);
89
+ onClick: (a) => {
90
+ h == null || h(a), a.defaultPrevented || y(!f);
85
91
  },
86
- onKeyDown: (e) => {
87
- d == null || d(e), !e.defaultPrevented && !p && (e.key === "ArrowDown" || e.key === "ArrowUp" || e.key === "Enter" || e.key === " ") && (e.preventDefault(), w(!0));
92
+ onKeyDown: (a) => {
93
+ v == null || v(a), !a.defaultPrevented && !f && (a.key === "ArrowDown" || a.key === "ArrowUp" || a.key === "Enter" || a.key === " ") && (a.preventDefault(), y(!0));
88
94
  },
89
- ...v,
95
+ ...c,
90
96
  children: [
91
- u,
92
- /* @__PURE__ */ y(q, { className: A("h-4 w-4 shrink-0 text-[var(--prui-dim)] transition-transform", p && "rotate-180"), "aria-hidden": !0 })
97
+ m,
98
+ /* @__PURE__ */ b(te, { className: V("h-4 w-4 shrink-0 text-[var(--prui-dim)] transition-transform", f && "rotate-180"), "aria-hidden": !0 })
93
99
  ]
94
100
  }
95
101
  );
96
102
  }
97
103
  );
98
- U.displayName = "SelectTrigger";
99
- const $ = a.forwardRef(
100
- ({ className: i, placeholder: u, children: b, ...d }, f) => {
101
- const { value: l, displayValue: v } = E();
102
- return /* @__PURE__ */ y("span", { ref: f, className: A("truncate", i), ...d, children: b ?? v ?? (l || /* @__PURE__ */ y("span", { className: "text-[var(--prui-dim)]", children: u })) });
104
+ X.displayName = "SelectTrigger";
105
+ const Y = r.forwardRef(
106
+ ({ className: o, placeholder: m, children: h, ...v }, g) => {
107
+ const { values: l, displayValue: c, multiple: n } = $(), f = l.length === 0;
108
+ return /* @__PURE__ */ b("span", { ref: g, className: V("truncate", o), ...v, children: h ?? (f ? /* @__PURE__ */ b("span", { className: "text-[var(--prui-dim)]", children: m }) : n && l.length > 1 ? /* @__PURE__ */ P(G, { children: [
109
+ /* @__PURE__ */ b("span", { className: "text-[var(--prui-fg)]", children: (c == null ? void 0 : c.split(", ")[0]) ?? l[0] }),
110
+ /* @__PURE__ */ P("span", { className: "ml-1 rounded-[var(--prui-radius-full)] bg-[var(--prui-raise)] px-1.5 text-xs text-[var(--prui-dim)]", children: [
111
+ "+",
112
+ l.length - 1
113
+ ] })
114
+ ] }) : c ?? l[0]) });
103
115
  }
104
116
  );
105
- $.displayName = "SelectValue";
106
- const z = a.forwardRef(
107
- ({ className: i, children: u, id: b, ...d }, f) => {
108
- const { open: l, setOpen: v, triggerEl: n, setValue: p, returnFocusToTrigger: w } = E(), g = a.useRef(null), [m, h] = a.useState(-1), x = a.useRef({ buffer: "", at: 0 }), S = a.useRef(null);
109
- S.current = n;
110
- const [e, V] = a.useState(null), { setElement: O, isTop: P } = B(l);
111
- G(l, P, () => {
112
- v(!1), w();
117
+ Y.displayName = "SelectValue";
118
+ const Z = r.forwardRef(
119
+ ({ className: o, children: m, id: h, ...v }, g) => {
120
+ const { open: l, setOpen: c, triggerEl: n, toggleValue: f, returnFocusToTrigger: y, searchable: w, multiple: N } = $(), T = r.useRef(null), A = r.useRef(null), [p, a] = r.useState(-1), [j, R] = r.useState(""), C = r.useRef({ buffer: "", at: 0 }), F = r.useRef(null);
121
+ F.current = n;
122
+ const [M, U] = r.useState(null), { t: S } = ce(), { setElement: q, isTop: W } = ne(l);
123
+ se(l, W, () => {
124
+ c(!1), y();
113
125
  });
114
- const { ref: T, position: I } = Q({ active: l, anchorRef: S, side: "bottom", align: "start" }), N = a.useCallback(() => {
115
- const t = g.current;
116
- return t ? Array.from(t.querySelectorAll("[role='option']")) : [];
117
- }, []), k = (t) => {
118
- var o;
119
- h(t), (o = N()[t]) == null || o.focus();
126
+ const { ref: H, position: D } = ie({ active: l, anchorRef: F, side: "bottom", align: "start" }), L = r.useCallback(() => {
127
+ const e = T.current;
128
+ return e ? Array.from(e.querySelectorAll("[role='option']")) : [];
129
+ }, []), E = r.useCallback(
130
+ () => L().filter((e) => e.style.display !== "none"),
131
+ [L]
132
+ ), t = (e) => {
133
+ const s = e.trim().toLowerCase();
134
+ for (const i of L())
135
+ i.style.display = (i.textContent ?? "").toLowerCase().includes(s) ? "" : "none";
136
+ a(-1);
137
+ };
138
+ r.useEffect(() => {
139
+ if (!l) {
140
+ R("");
141
+ return;
142
+ }
143
+ t("");
144
+ }, [l]);
145
+ const u = (e) => {
146
+ var d;
147
+ const s = E();
148
+ if (e < 0 || s.length === 0) return;
149
+ const i = Math.min(e, s.length - 1);
150
+ a(i), (d = s[i]) == null || d.focus();
120
151
  };
121
- if (a.useEffect(() => {
122
- var s;
123
- if (!l || !e) return;
124
- h(-1);
125
- const t = N(), o = t.findIndex((R) => R.getAttribute("aria-selected") === "true"), r = t.findIndex((R) => R.getAttribute("aria-disabled") !== "true"), c = o >= 0 ? o : r;
126
- c >= 0 && (h(c), (s = t[c]) == null || s.focus());
127
- }, [l, e, N]), !l) return null;
128
- const j = (t) => {
129
- const o = N(), r = (c) => {
130
- var s;
131
- return ((s = o[c]) == null ? void 0 : s.getAttribute("aria-disabled")) !== "true";
152
+ if (r.useEffect(() => {
153
+ var x, I;
154
+ if (!l || !M) return;
155
+ if (a(-1), w) {
156
+ (x = A.current) == null || x.focus();
157
+ return;
158
+ }
159
+ const e = L(), s = e.findIndex((O) => O.getAttribute("aria-selected") === "true"), i = e.findIndex((O) => O.getAttribute("aria-disabled") !== "true"), d = s >= 0 ? s : i;
160
+ d >= 0 && (a(d), (I = e[d]) == null || I.focus());
161
+ }, [l, M, L, w]), !l) return null;
162
+ const k = (e) => {
163
+ var d;
164
+ if (((d = e.target) == null ? void 0 : d.tagName) === "INPUT") {
165
+ e.key === "Tab" && c(!1);
166
+ return;
167
+ }
168
+ const s = E(), i = (x) => {
169
+ var I;
170
+ return ((I = s[x]) == null ? void 0 : I.getAttribute("aria-disabled")) !== "true";
132
171
  };
133
- switch (t.key) {
172
+ switch (e.key) {
134
173
  case "ArrowDown":
135
- t.preventDefault(), k(F(m, 1, o.length, { enabled: r }));
174
+ e.preventDefault(), u(Q(p, 1, s.length, { enabled: i }));
136
175
  break;
137
176
  case "ArrowUp":
138
- t.preventDefault(), k(F(m, -1, o.length, { enabled: r }));
177
+ e.preventDefault(), u(Q(p, -1, s.length, { enabled: i }));
139
178
  break;
140
179
  case "Home":
141
- t.preventDefault(), k(Z(o.length, r));
180
+ e.preventDefault(), u(ue(s.length, i));
142
181
  break;
143
182
  case "End":
144
- t.preventDefault(), k(Y(o.length, r));
183
+ e.preventDefault(), u(K(s.length, i));
145
184
  break;
146
185
  case "Enter":
147
186
  case " ": {
148
- t.preventDefault();
149
- const c = o[m];
150
- if (c && r(m)) {
151
- const s = c.dataset.value;
152
- s !== void 0 ? (p(s), v(!1), w()) : c.click();
187
+ e.preventDefault();
188
+ const x = s[p];
189
+ if (x && i(p)) {
190
+ const I = x.dataset.value;
191
+ I !== void 0 ? (f(I), N || (c(!1), y())) : x.click();
153
192
  }
154
193
  break;
155
194
  }
156
195
  case "Tab":
157
- v(!1);
196
+ c(!1);
158
197
  break;
159
198
  default:
160
- if (t.key.length === 1) {
161
- const c = () => o.map((R) => R.textContent ?? ""), { index: s } = X(c, x.current, t.key, m);
162
- s >= 0 && s !== m && (t.preventDefault(), k(s));
199
+ if (e.key.length === 1) {
200
+ const x = () => s.map((O) => O.textContent ?? ""), { index: I } = oe(x, C.current, e.key, p);
201
+ I >= 0 && I !== p && (e.preventDefault(), u(I));
163
202
  }
164
203
  }
165
- };
166
- return /* @__PURE__ */ y(J, { children: /* @__PURE__ */ y(
204
+ }, z = (e) => {
205
+ if (e.key === "ArrowDown") {
206
+ e.preventDefault();
207
+ const i = E().findIndex((d) => d.getAttribute("aria-disabled") !== "true");
208
+ i >= 0 && u(i);
209
+ } else if (e.key === "ArrowUp") {
210
+ e.preventDefault();
211
+ const s = E(), i = K(s.length, (d) => {
212
+ var x;
213
+ return ((x = s[d]) == null ? void 0 : x.getAttribute("aria-disabled")) !== "true";
214
+ });
215
+ i >= 0 && u(i);
216
+ } else if (e.key === "Enter") {
217
+ e.preventDefault();
218
+ const s = E(), i = s.findIndex((d) => d.getAttribute("aria-disabled") !== "true");
219
+ if (i >= 0) {
220
+ const d = s[i].dataset.value;
221
+ d !== void 0 && (f(d), N || (c(!1), y()));
222
+ }
223
+ }
224
+ }, ee = w && j !== "" && E().length === 0;
225
+ return /* @__PURE__ */ b(le, { children: /* @__PURE__ */ P(
167
226
  "div",
168
227
  {
169
- ref: (t) => {
170
- g.current = t, V(t), T(t), O(t), typeof f == "function" ? f(t) : f && (f.current = t);
228
+ ref: (e) => {
229
+ T.current = e, U(e), H(e), q(e), typeof g == "function" ? g(e) : g && (g.current = e);
171
230
  },
172
- id: b ?? (n != null && n.id ? `${n.id}-listbox` : void 0),
231
+ id: h ?? (n != null && n.id ? `${n.id}-listbox` : void 0),
173
232
  role: "listbox",
174
233
  "aria-labelledby": (n == null ? void 0 : n.id) || void 0,
234
+ "aria-multiselectable": N || void 0,
175
235
  tabIndex: -1,
176
236
  "data-state": l ? "open" : "closed",
177
- onKeyDown: j,
178
- className: A(
237
+ onKeyDown: k,
238
+ className: V(
179
239
  "prui-select-content fixed z-[var(--prui-z-overlay)] max-h-60 overflow-auto p-1",
180
240
  "bg-[var(--prui-surface)] border border-[var(--prui-line)] rounded-[var(--prui-radius)] shadow-[var(--prui-shadow-md)] outline-none",
181
- i
241
+ o
182
242
  ),
183
243
  style: {
184
- top: (I == null ? void 0 : I.top) ?? -9999,
185
- left: (I == null ? void 0 : I.left) ?? -9999,
244
+ top: (D == null ? void 0 : D.top) ?? -9999,
245
+ left: (D == null ? void 0 : D.left) ?? -9999,
186
246
  minWidth: n ? Math.max(n.offsetWidth, 160) : 160
187
247
  },
188
- ...d,
189
- children: u
248
+ ...v,
249
+ children: [
250
+ w ? /* @__PURE__ */ b("div", { className: "sticky top-0 z-[var(--prui-z-content)] mb-1 bg-[var(--prui-surface)] p-1", children: /* @__PURE__ */ P("div", { className: "relative", children: [
251
+ /* @__PURE__ */ b(re, { className: "pointer-events-none absolute left-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-[var(--prui-dim)]", "aria-hidden": !0 }),
252
+ /* @__PURE__ */ b(
253
+ "input",
254
+ {
255
+ ref: A,
256
+ type: "text",
257
+ role: "searchbox",
258
+ "aria-label": S.search,
259
+ value: j,
260
+ onChange: (e) => {
261
+ R(e.target.value), t(e.target.value);
262
+ },
263
+ onKeyDown: z,
264
+ placeholder: `${S.search}…`,
265
+ className: "h-8 w-full rounded-[calc(var(--prui-radius)-2px)] border border-[var(--prui-line)] bg-[var(--prui-background)] pl-8 pr-2 text-sm text-[var(--prui-fg)] placeholder:text-[var(--prui-dim)] outline-none focus:border-[var(--prui-brand)]"
266
+ }
267
+ )
268
+ ] }) }) : null,
269
+ ee ? /* @__PURE__ */ b("div", { className: "px-3 py-2 text-sm text-[var(--prui-dim)]", role: "option", "aria-selected": "false", "aria-disabled": "true", children: S.noResults }) : m
270
+ ]
190
271
  }
191
272
  ) });
192
273
  }
193
274
  );
194
- z.displayName = "SelectContent";
195
- const M = a.forwardRef(
196
- ({ className: i, value: u, disabled: b, children: d, onClick: f, tabIndex: l = -1, ...v }, n) => {
197
- const { value: p, setValue: w, setOpen: g, returnFocusToTrigger: m, registerLabel: h } = E(), x = p === u, S = typeof d == "string" || typeof d == "number" ? String(d) : void 0;
198
- return a.useEffect(() => {
199
- S !== void 0 && h(u, S);
200
- }, [u, S, h]), /* @__PURE__ */ D(
275
+ Z.displayName = "SelectContent";
276
+ const _ = r.forwardRef(
277
+ ({ className: o, value: m, disabled: h, children: v, onClick: g, tabIndex: l = -1, ...c }, n) => {
278
+ const { values: f, toggleValue: y, setOpen: w, returnFocusToTrigger: N, multiple: T, registerLabel: A } = $(), p = f.includes(m), a = typeof v == "string" || typeof v == "number" ? String(v) : void 0;
279
+ return r.useEffect(() => {
280
+ a !== void 0 && A(m, a);
281
+ }, [m, a, A]), /* @__PURE__ */ P(
201
282
  "div",
202
283
  {
203
284
  ref: n,
204
285
  role: "option",
205
- "aria-selected": x,
206
- "aria-disabled": b,
207
- "data-selected": x || void 0,
208
- "data-value": u,
286
+ "aria-selected": p,
287
+ "aria-disabled": h,
288
+ "data-selected": p || void 0,
289
+ "data-value": m,
209
290
  tabIndex: l,
210
- className: A(
291
+ className: V(
211
292
  "prui-select-item relative flex cursor-pointer items-center gap-2 rounded-[calc(var(--prui-radius)-1px)]",
212
293
  "py-1.5 pl-3 pr-8 text-sm text-[var(--prui-fg)] hover:bg-[var(--prui-raise)] focus-visible:bg-[var(--prui-raise)] outline-none",
213
- x && "font-medium",
214
- b && "opacity-50 pointer-events-none",
215
- i
294
+ p && "font-medium",
295
+ h && "opacity-50 pointer-events-none",
296
+ o
216
297
  ),
217
- onClick: (e) => {
218
- f == null || f(e), !(e.defaultPrevented || b) && (w(u), g(!1), m());
298
+ onClick: (j) => {
299
+ g == null || g(j), !(j.defaultPrevented || h) && (y(m), T || (w(!1), N()));
219
300
  },
220
- ...v,
301
+ ...c,
221
302
  children: [
222
- d,
223
- x ? /* @__PURE__ */ y(H, { className: "absolute right-2 h-4 w-4 text-[var(--prui-brand)]", "aria-hidden": !0 }) : null
303
+ v,
304
+ p ? /* @__PURE__ */ b(ae, { className: "absolute right-2 h-4 w-4 text-[var(--prui-brand)]", "aria-hidden": !0 }) : null
224
305
  ]
225
306
  }
226
307
  );
227
308
  }
228
309
  );
229
- M.displayName = "SelectItem";
230
- const ne = {
310
+ _.displayName = "SelectItem";
311
+ const xe = {
231
312
  name: "Select",
232
313
  props: [
233
314
  { name: "options", type: "SelectOption[]", default: "[]", control: "object" },
234
- { name: "value", type: "string", default: "undefined", control: "text" },
235
- { name: "defaultValue", type: "string", default: "undefined", control: "text" },
315
+ { name: "value", type: "string | string[]", default: "undefined", control: "text" },
316
+ { name: "defaultValue", type: "string | string[]", default: "undefined", control: "text" },
236
317
  { name: "placeholder", type: "string", default: "'Select...'", control: "text" },
237
318
  { name: "disabled", type: "boolean", default: "false", control: "boolean" },
238
- { name: "onChange", type: "(value: string) => void", default: null, control: "none" }
319
+ { name: "onChange", type: "(value: string | string[]) => void", default: null, control: "none", description: "string in single mode, string[] with multiple." },
320
+ { name: "searchable", type: "boolean", default: "false", control: "boolean", description: "Adds a filter input to the listbox." },
321
+ { name: "multiple", type: "boolean", default: "false", control: "boolean", description: "Multi-select; items toggle, value becomes string[]." }
239
322
  ]
240
323
  };
241
324
  export {
242
- _ as Select,
243
- z as SelectContent,
244
- M as SelectItem,
245
- U as SelectTrigger,
246
- $ as SelectValue,
247
- ne as selectPropsMeta
325
+ de as Select,
326
+ Z as SelectContent,
327
+ _ as SelectItem,
328
+ X as SelectTrigger,
329
+ Y as SelectValue,
330
+ xe as selectPropsMeta
248
331
  };
package/dist/index.js CHANGED
@@ -35,7 +35,7 @@ import { TimePanel as Wo, TimePicker as Xo, TimeRangePicker as Yo, timePickerPro
35
35
  import { FileUpload as or, fileUploadPropsMeta as rr } from "./core/file-upload.js";
36
36
  import { D as tr, a as sr, b as pr, c as ir, d as Pr, F as mr, N as lr, P as nr, T as dr, e as Mr, f as gr, g as cr } from "./chunks/data-table-toolbar-B-5J2Ozl.js";
37
37
  import { Link as fr, NavLink as xr, Navigate as Tr, Outlet as Sr, Route as br, Routes as hr } from "react-router-dom";
38
- import { A as Fr, a as Rr, b as kr, c as yr, C as Ar, F as vr, R as Ir, S as Cr, d as wr, e as Br, f as Nr, g as Er, h as Or, i as Lr, r as Kr, s as Ur, j as Gr, k as _r, u as Hr } from "./chunks/auth-shell-DQJ4UmUv.js";
38
+ import { A as Fr, a as Rr, b as kr, c as yr, C as Ar, F as vr, R as Ir, S as Cr, d as wr, e as Br, f as Nr, g as Er, h as Or, i as Lr, r as Kr, s as Ur, j as Gr, k as _r, u as Hr } from "./chunks/auth-shell-a-3J0_PB.js";
39
39
  import { AdminSetup as jr, EmptyState as qr, ErrorPage as zr, ForgotPasswordPage as Jr, LoginPage as Qr, LogoutPage as Wr, NotFoundPage as Xr, OtpPage as Yr, PagesRegistry as Zr, ProfilePage as $r, RegisterPage as ea, ResetPasswordPage as oa, SettingsPage as ra, adminSetupPropsMeta as aa, emptyStatePropsMeta as ta, errorPagePropsMeta as sa, forgotPasswordPagePropsMeta as pa, loginPagePropsMeta as ia, logoutPagePropsMeta as Pa, notFoundPagePropsMeta as ma, otpPagePropsMeta as la, profilePagePropsMeta as na, registerPagePropsMeta as da, resetPasswordPagePropsMeta as Ma, settingsPagePropsMeta as ga } from "./pages.js";
40
40
  import { PRUI_BREAKPOINTS as ua, PRUI_DESIGN_TOKENS as fa, PRUI_THEMES as xa, PRUI_TOKENS as Ta, applyTheme as Sa, applyThemeTokens as ba, clearAppliedTokens as ha, defineTheme as Da, isDarkTheme as Fa, isLightTheme as Ra, listThemes as ka, nextTheme as ya, readPersistedTheme as Aa, resolveThemeName as va, restoreAppliedTokens as Ia, themeMeta as Ca, themeMode as wa, useBreakpointAtLeast as Ba } from "./theme.js";
41
41
  import { PruiProvider as Ea, defaultDictionary as Oa, getPruiDictionary as La, resetPruiDictionary as Ka, setPruiDictionary as Ua, usePruiI18n as Ga } from "./i18n.js";