@vhyxui/react 0.1.3-alpha → 0.2.0-alpha

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.
Files changed (42) hide show
  1. package/dist/{Badge-Fuc7l-1E.js → Badge-Bbxb4wyt.js} +7 -7
  2. package/dist/{Badge-RM7n86Rq.cjs → Badge-SBO9tGzn.cjs} +1 -1
  3. package/dist/{Button-D7eX45GC.js → Button-DDMc7-3S.js} +28 -28
  4. package/dist/{Button-AkUYT9eN.cjs → Button-akOSYEu9.cjs} +1 -1
  5. package/dist/Card-DSCA-Igh.cjs +1 -0
  6. package/dist/Card-Dh9Pcmfa.js +79 -0
  7. package/dist/Popover-BHGX_cC4.cjs +1 -0
  8. package/dist/Popover-u9vlClum.js +211 -0
  9. package/dist/Select-CGfKq69f.cjs +1 -0
  10. package/dist/Select-DHalg36V.js +344 -0
  11. package/dist/{SelectField-BYmKwRVU.cjs → SelectField-DG7SlT9m.cjs} +1 -1
  12. package/dist/{SelectField-DL7K4ZhA.js → SelectField-DTfYCDWa.js} +1 -1
  13. package/dist/{Spinner-CZSz1OpT.js → Spinner-BYi9eTfl.js} +19 -19
  14. package/dist/Spinner-CeIDpqkx.cjs +1 -0
  15. package/dist/badge.cjs +1 -1
  16. package/dist/badge.js +1 -1
  17. package/dist/button.cjs +1 -1
  18. package/dist/button.js +1 -1
  19. package/dist/card.cjs +1 -1
  20. package/dist/card.js +1 -1
  21. package/dist/index.cjs +1 -1
  22. package/dist/index.d.ts +26 -6
  23. package/dist/index.js +7 -7
  24. package/dist/popover.cjs +1 -1
  25. package/dist/popover.d.ts +7 -1
  26. package/dist/popover.js +1 -1
  27. package/dist/select.cjs +1 -1
  28. package/dist/select.d.ts +19 -5
  29. package/dist/select.js +1 -1
  30. package/dist/selectfield.cjs +1 -1
  31. package/dist/selectfield.js +1 -1
  32. package/dist/spinner.cjs +1 -1
  33. package/dist/spinner.js +1 -1
  34. package/dist/style.css +1 -1
  35. package/package.json +1 -1
  36. package/dist/Card-D7ZNeWtE.js +0 -75
  37. package/dist/Card-d5xrWgQS.cjs +0 -1
  38. package/dist/Popover-BPFkS4xn.cjs +0 -1
  39. package/dist/Popover-MxUovsIt.js +0 -194
  40. package/dist/Select-C9yB2B8M.cjs +0 -1
  41. package/dist/Select-DjeJOdb7.js +0 -327
  42. package/dist/Spinner-BZGPmp9c.cjs +0 -1
@@ -1,327 +0,0 @@
1
- import { j as f } from "./jsx-runtime-CL69jGNW.js";
2
- import L, { useState as E, useRef as N, useEffect as C, useCallback as m, useMemo as q, createContext as ae, useContext as le } from "react";
3
- import de from "react-dom";
4
- import { selectContract as K, Slot as ue, VhyxUIError as fe, VhyxUIErrorCode as pe } from "@vhyxui/core";
5
- import { withAgentContract as ge } from "@vhyxseal/react";
6
- import { u as T } from "./useId-BGRmH6iF.js";
7
- const me = "_trigger_rs2m0_3", he = "_content_rs2m0_81", xe = "_item_rs2m0_101", ye = "_group_rs2m0_142", ve = "_label_rs2m0_148", Se = "_separator_rs2m0_160", S = {
8
- trigger: me,
9
- "trigger-value": "_trigger-value_rs2m0_62",
10
- "trigger-icon": "_trigger-icon_rs2m0_70",
11
- content: he,
12
- item: xe,
13
- "item-check": "_item-check_rs2m0_131",
14
- group: ye,
15
- label: ve,
16
- separator: Se
17
- }, Q = ae(null);
18
- function H(n) {
19
- const o = le(Q);
20
- if (!o)
21
- throw new fe({
22
- code: pe.VHYXUI_MISSING_CONTEXT,
23
- message: `${n} must be used within <Select>`,
24
- suggestion: "Wrap your component tree with <Select>"
25
- });
26
- return o;
27
- }
28
- const Z = L.forwardRef(
29
- ({
30
- value: n,
31
- defaultValue: o,
32
- onValueChange: l,
33
- disabled: t = !1,
34
- size: d = "md",
35
- placeholder: e,
36
- contract: x,
37
- children: g,
38
- className: c,
39
- ...y
40
- }, b) => {
41
- const i = T("vhyx-select-trigger"), u = T("vhyx-select-content"), R = T("vhyx-select"), h = n !== void 0, [j, r] = E(o), v = h ? n : j, [k, B] = E(!1), [V, I] = E(void 0), O = N(null), z = N(null), M = N(/* @__PURE__ */ new Map()), D = N([]), U = N(/* @__PURE__ */ new Map()), [W, A] = E(void 0), G = N(v);
42
- G.current = v, C(() => {
43
- if (v === void 0) {
44
- A(void 0);
45
- return;
46
- }
47
- const s = M.current.get(v);
48
- A(s ? s.label : void 0);
49
- }, [v]);
50
- const P = m(
51
- (s, a, p) => {
52
- M.current.has(s) || D.current.push(s);
53
- const w = { label: a };
54
- p !== void 0 && (w.disabled = p), M.current.set(s, w), s === G.current && A(a);
55
- },
56
- []
57
- ), F = m(() => W, [W]), X = m(
58
- (s) => {
59
- var w;
60
- const a = D.current.filter(
61
- (_) => {
62
- var $;
63
- return !(($ = M.current.get(_)) != null && $.disabled);
64
- }
65
- );
66
- if (a.length === 0) return;
67
- let p;
68
- if (s === "home")
69
- p = a[0];
70
- else if (s === "end")
71
- p = a[a.length - 1];
72
- else {
73
- const _ = V !== void 0 ? a.indexOf(V) : -1;
74
- p = s === "down" ? a[Math.min(_ + 1, a.length - 1)] : a[Math.max(_ - 1, 0)];
75
- }
76
- p !== void 0 && (I(p), (w = U.current.get(p)) == null || w.focus());
77
- },
78
- [V]
79
- ), Y = m(
80
- (s) => {
81
- var a;
82
- h || r(s), l == null || l(s), B(!1), I(void 0), (a = O.current) == null || a.focus();
83
- },
84
- [h, l]
85
- ), J = m(
86
- (s) => {
87
- if (B(s), s) {
88
- const a = v ?? D.current[0];
89
- I(a);
90
- } else
91
- I(void 0);
92
- },
93
- [v]
94
- ), ce = q(
95
- () => ({ ...K, id: R, ...x }),
96
- [R, x]
97
- ), ie = q(
98
- () => ({
99
- value: v,
100
- onValueChange: Y,
101
- open: k,
102
- onOpenChange: J,
103
- disabled: t,
104
- size: d,
105
- placeholder: e,
106
- triggerId: i,
107
- contentId: u,
108
- triggerRef: O,
109
- contentRef: z,
110
- focusedValue: V,
111
- setFocusedValue: I,
112
- registerItem: P,
113
- getSelectedLabel: F,
114
- navigateItems: X,
115
- itemElementsRef: U,
116
- itemOrderRef: D,
117
- itemRegistryRef: M
118
- }),
119
- [
120
- v,
121
- Y,
122
- k,
123
- J,
124
- t,
125
- d,
126
- e,
127
- i,
128
- u,
129
- V,
130
- P,
131
- F,
132
- X
133
- ]
134
- );
135
- return C(() => {
136
- if (!k) return;
137
- function s(a) {
138
- var p;
139
- a.key === "Escape" && (B(!1), I(void 0), (p = O.current) == null || p.focus());
140
- }
141
- return document.addEventListener("keydown", s), () => document.removeEventListener("keydown", s);
142
- }, [k]), C(() => {
143
- if (!k) return;
144
- function s(a) {
145
- var w, _;
146
- const p = a.target;
147
- (w = O.current) != null && w.contains(p) || (_ = z.current) != null && _.contains(p) || (B(!1), I(void 0));
148
- }
149
- return document.addEventListener("mousedown", s), () => document.removeEventListener("mousedown", s);
150
- }, [k]), /* @__PURE__ */ f.jsx(Q.Provider, { value: ie, children: /* @__PURE__ */ f.jsx(
151
- "div",
152
- {
153
- ref: b,
154
- className: c,
155
- "data-size": d,
156
- "data-disabled": t ? !0 : void 0,
157
- "data-vhyx-contract": JSON.stringify(ce),
158
- ...y,
159
- children: g
160
- }
161
- ) });
162
- }
163
- );
164
- Z.displayName = "VhyxSelect";
165
- const ee = L.forwardRef(
166
- ({ icon: n, className: o, asChild: l = !1, ...t }, d) => {
167
- const e = H("Select.Trigger"), x = e.getSelectedLabel(), g = m(
168
- (u) => {
169
- e.triggerRef.current = u, typeof d == "function" ? d(u) : d && (d.current = u);
170
- },
171
- [d, e.triggerRef]
172
- ), c = m(() => {
173
- e.disabled || e.onOpenChange(!e.open);
174
- }, [e]), y = m(
175
- (u) => {
176
- (u.key === "ArrowDown" || u.key === "ArrowUp") && (u.preventDefault(), e.open || e.onOpenChange(!0));
177
- },
178
- [e]
179
- ), b = [S.trigger, o].filter(Boolean).join(" "), i = {
180
- id: e.triggerId,
181
- role: "combobox",
182
- "aria-haspopup": "listbox",
183
- "aria-expanded": e.open,
184
- "aria-controls": e.open ? e.contentId : void 0,
185
- disabled: e.disabled,
186
- onClick: c,
187
- onKeyDown: y,
188
- className: b,
189
- "data-size": e.size,
190
- "data-state": e.open ? "open" : "closed",
191
- "data-placeholder": x ? void 0 : !0,
192
- ...t
193
- };
194
- return l ? /* @__PURE__ */ f.jsx(ue, { ref: g, ...i, children: t.children }) : /* @__PURE__ */ f.jsxs("button", { ref: g, type: "button", ...i, children: [
195
- /* @__PURE__ */ f.jsx("span", { className: S["trigger-value"], children: x ?? e.placeholder ?? "Select…" }),
196
- /* @__PURE__ */ f.jsx("span", { className: S["trigger-icon"], "aria-hidden": "true", children: n ?? /* @__PURE__ */ f.jsx("svg", { viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, children: /* @__PURE__ */ f.jsx("path", { d: "M2.5 4.5L6 8L9.5 4.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) })
197
- ] });
198
- }
199
- );
200
- ee.displayName = "VhyxSelectTrigger";
201
- function te({ children: n, className: o, ...l }) {
202
- const t = H("Select.Content"), [d, e] = E(!1), [x, g] = E({
203
- position: "fixed",
204
- top: 0,
205
- left: 0,
206
- minWidth: 0,
207
- zIndex: "var(--vhyx-z-dropdown)"
208
- });
209
- C(() => {
210
- e(!0);
211
- }, []), C(() => {
212
- var r;
213
- if (!t.open || !t.triggerRef.current) return;
214
- const i = t.triggerRef.current.getBoundingClientRect(), u = window.innerHeight - i.bottom, R = i.top, h = ((r = t.contentRef.current) == null ? void 0 : r.scrollHeight) ?? 300, j = u < h && R > u;
215
- g({
216
- position: "fixed",
217
- top: j ? i.top - h - 4 : i.bottom + 4,
218
- left: i.left,
219
- minWidth: i.width,
220
- zIndex: "var(--vhyx-z-dropdown)",
221
- maxHeight: j ? Math.min(h, R - 8) : Math.min(h, u - 8),
222
- overflowY: "auto"
223
- });
224
- }, [t.open, t.triggerRef]), C(() => {
225
- var i;
226
- !t.open || !t.focusedValue || (i = t.itemElementsRef.current.get(t.focusedValue)) == null || i.focus();
227
- }, [t.open]);
228
- const c = m(
229
- (i) => {
230
- t.contentRef.current = i;
231
- },
232
- [t.contentRef]
233
- );
234
- if (!d) return null;
235
- const y = [S.content, o].filter(Boolean).join(" "), b = /* @__PURE__ */ f.jsx(
236
- "div",
237
- {
238
- ref: c,
239
- id: t.contentId,
240
- role: "listbox",
241
- "aria-labelledby": t.triggerId,
242
- className: y,
243
- "data-state": t.open ? "open" : "closed",
244
- style: x,
245
- ...l,
246
- children: n
247
- }
248
- );
249
- return de.createPortal(b, document.body);
250
- }
251
- te.displayName = "VhyxSelectContent";
252
- const ne = L.forwardRef(
253
- ({ value: n, disabled: o, children: l, className: t, onClick: d, onKeyDown: e, ...x }, g) => {
254
- const c = H("Select.Item"), y = c.value === n, b = c.focusedValue === n, i = typeof l == "string" ? l : "";
255
- C(() => {
256
- c.registerItem(n, i, o);
257
- }, [c, n, i, o]);
258
- const u = m(
259
- (r) => {
260
- r ? c.itemElementsRef.current.set(n, r) : c.itemElementsRef.current.delete(n), typeof g == "function" ? g(r) : g && (g.current = r);
261
- },
262
- [g, c, n]
263
- ), R = m(
264
- (r) => {
265
- d == null || d(r), o || c.onValueChange(n);
266
- },
267
- [d, o, c, n]
268
- ), h = m(
269
- (r) => {
270
- e == null || e(r), r.key === "Enter" || r.key === " " ? (r.preventDefault(), o || c.onValueChange(n)) : r.key === "ArrowDown" ? (r.preventDefault(), c.navigateItems("down")) : r.key === "ArrowUp" ? (r.preventDefault(), c.navigateItems("up")) : r.key === "Home" ? (r.preventDefault(), c.navigateItems("home")) : r.key === "End" && (r.preventDefault(), c.navigateItems("end"));
271
- },
272
- [e, o, c, n]
273
- ), j = [S.item, t].filter(Boolean).join(" ");
274
- return /* @__PURE__ */ f.jsxs(
275
- "div",
276
- {
277
- ref: u,
278
- role: "option",
279
- "aria-selected": y,
280
- "aria-disabled": o ? !0 : void 0,
281
- tabIndex: b ? 0 : -1,
282
- onClick: R,
283
- onKeyDown: h,
284
- className: j,
285
- "data-state": y ? "selected" : "unselected",
286
- "data-disabled": o ? !0 : void 0,
287
- "data-focused": b ? !0 : void 0,
288
- ...x,
289
- children: [
290
- l,
291
- y && /* @__PURE__ */ f.jsx("span", { className: S["item-check"], "aria-hidden": "true", children: /* @__PURE__ */ f.jsx("svg", { viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", children: /* @__PURE__ */ f.jsx("polyline", { points: "2,6 5,9 10,3" }) }) })
292
- ]
293
- }
294
- );
295
- }
296
- );
297
- ne.displayName = "VhyxSelectItem";
298
- function re({ children: n, className: o, ...l }) {
299
- const t = T("vhyx-select-group-label"), d = [S.group, o].filter(Boolean).join(" ");
300
- return /* @__PURE__ */ f.jsx("div", { role: "group", "aria-labelledby": t, className: d, ...l, children: L.Children.map(n, (e) => L.isValidElement(e) && e.type.displayName === "VhyxSelectLabel" ? L.cloneElement(e, { id: t }) : e) });
301
- }
302
- re.displayName = "VhyxSelectGroup";
303
- function oe({ children: n, className: o, ...l }) {
304
- const t = [S.label, o].filter(Boolean).join(" ");
305
- return /* @__PURE__ */ f.jsx("span", { className: t, ...l, children: n });
306
- }
307
- oe.displayName = "VhyxSelectLabel";
308
- function se({ className: n, ...o }) {
309
- const l = [S.separator, n].filter(Boolean).join(" ");
310
- return /* @__PURE__ */ f.jsx("hr", { "aria-hidden": "true", className: l, ...o });
311
- }
312
- se.displayName = "VhyxSelectSeparator";
313
- const be = { ...K, id: "vhyxui-select" }, we = Object.assign(
314
- ge(Z, be),
315
- {
316
- Trigger: ee,
317
- Content: te,
318
- Item: ne,
319
- Group: re,
320
- Label: oe,
321
- Separator: se
322
- }
323
- );
324
- we.displayName = "VhyxSelect";
325
- export {
326
- we as S
327
- };
@@ -1 +0,0 @@
1
- "use strict";const n=require("./jsx-runtime-BRMkMA8J.cjs"),x=require("react"),d=require("@vhyxui/core"),u=require("@vhyxseal/react"),h="_spinner_1udc2_1",m={spinner:h},r={xs:12,sm:20,md:32,lg:48,xl:64},s=x.forwardRef(({size:t="md",variant:o="default",label:e="Loading",className:a,...c},p)=>{const l=[m.spinner,a].filter(Boolean).join(" ");return n.jsxRuntimeExports.jsxs("svg",{ref:p,role:"status","aria-label":e,width:r[t],height:r[t],viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:l,"data-size":t,"data-variant":o,...c,children:[n.jsxRuntimeExports.jsx("title",{children:e}),n.jsxRuntimeExports.jsx("circle",{cx:12,cy:12,r:9,strokeWidth:2.5,stroke:"currentColor",opacity:.2}),n.jsxRuntimeExports.jsx("path",{d:"M12 3a9 9 0 0 1 9 9",strokeWidth:2.5,stroke:"currentColor",strokeLinecap:"round"})]})});s.displayName="VhyxSpinner";const j={...d.spinnerContract,id:"vhyxui-spinner"},i=u.withAgentContract(s,j);i.displayName="VhyxSpinner";exports.Spinner=i;