@vhyxui/react 0.2.0-alpha → 0.3.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.
- package/dist/Popover-BlCmIF9J.cjs +1 -0
- package/dist/Popover-j9pNswBn.js +215 -0
- package/dist/Select-BkJNe4Lc.cjs +1 -0
- package/dist/Select-DfV10hZt.js +350 -0
- package/dist/{SelectField-DTfYCDWa.js → SelectField-B6N0uub8.js} +1 -1
- package/dist/{SelectField-DG7SlT9m.cjs → SelectField-Dxl2Mgbv.cjs} +1 -1
- package/dist/floatingPosition-UeYoO5K4.js +18 -0
- package/dist/floatingPosition-oslPPzF_.cjs +1 -0
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +8 -0
- package/dist/index.js +3 -3
- package/dist/popover.cjs +1 -1
- package/dist/popover.d.ts +8 -0
- package/dist/popover.js +1 -1
- package/dist/select.cjs +1 -1
- package/dist/select.js +1 -1
- package/dist/selectfield.cjs +1 -1
- package/dist/selectfield.js +1 -1
- package/package.json +1 -1
- package/dist/Popover-BHGX_cC4.cjs +0 -1
- package/dist/Popover-u9vlClum.js +0 -211
- package/dist/Select-CGfKq69f.cjs +0 -1
- package/dist/Select-DHalg36V.js +0 -344
package/dist/index.js
CHANGED
|
@@ -2,13 +2,13 @@ import { V as l } from "./VhyxUIProvider-DVFSW4q-.js";
|
|
|
2
2
|
import { B as p } from "./Button-DDMc7-3S.js";
|
|
3
3
|
import { I as S } from "./Input-BS_t1bl-.js";
|
|
4
4
|
import { T as P } from "./Textarea-CLrctxHU.js";
|
|
5
|
-
import { S as v } from "./Select-
|
|
5
|
+
import { S as v } from "./Select-DfV10hZt.js";
|
|
6
6
|
import { C as D } from "./Checkbox-DWl91ci_.js";
|
|
7
7
|
import { R as A, a as C } from "./RadioItem-CzHSS_qK.js";
|
|
8
8
|
import { S as R } from "./Switch-DOAZfSV0.js";
|
|
9
9
|
import { F as y, a as U, u as V } from "./Field-Bv07PL2M.js";
|
|
10
10
|
import { T as E } from "./TextField-DtXQQJJk.js";
|
|
11
|
-
import { S as L } from "./SelectField-
|
|
11
|
+
import { S as L } from "./SelectField-B6N0uub8.js";
|
|
12
12
|
import { T as O } from "./TextareaField-CpqPinvx.js";
|
|
13
13
|
import { b as s, c as i, d as m } from "./Toast-0acAjZTB.js";
|
|
14
14
|
import { T as j, a as q } from "./Toast-0acAjZTB.js";
|
|
@@ -19,7 +19,7 @@ import { S as X } from "./Spinner-BYi9eTfl.js";
|
|
|
19
19
|
import { D as Z } from "./Dialog-CtYu14zl.js";
|
|
20
20
|
import { D as rr } from "./Drawer-BFJxsPG1.js";
|
|
21
21
|
import { T as er } from "./Tooltip-BAmErB_g.js";
|
|
22
|
-
import { P as sr } from "./Popover-
|
|
22
|
+
import { P as sr } from "./Popover-j9pNswBn.js";
|
|
23
23
|
import { C as fr } from "./Card-Dh9Pcmfa.js";
|
|
24
24
|
import { S as mr } from "./Separator-DQT58t90.js";
|
|
25
25
|
import { T as xr } from "./Tabs-BTfm4LbV.js";
|
package/dist/popover.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Popover-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Popover-BlCmIF9J.cjs");exports.Popover=e.Popover;
|
package/dist/popover.d.ts
CHANGED
|
@@ -38,6 +38,14 @@ export declare interface PopoverCloseProps extends default_2.ButtonHTMLAttribute
|
|
|
38
38
|
* eliminating both a hydration mismatch and a `document is not defined`
|
|
39
39
|
* crash from `ReactDOM.createPortal(..., document.body)` if this is open
|
|
40
40
|
* on first render (`document` doesn't exist during SSR).
|
|
41
|
+
*
|
|
42
|
+
* Position is computed as plain pixel coordinates (not a CSS `transform`
|
|
43
|
+
* trick) precisely so the result can be clamped to the viewport — `align`
|
|
44
|
+
* previously had no effect at all (only `side` was read), and even a
|
|
45
|
+
* correct anchor computation would still let content overflow past a
|
|
46
|
+
* viewport edge near the trigger (e.g. a right-aligned header popover) with
|
|
47
|
+
* no boundary awareness. Both are fixed together here since they share the
|
|
48
|
+
* same measurement (the content's own rendered size).
|
|
41
49
|
*/
|
|
42
50
|
declare function PopoverContent({ children, className, side, align, style, ...rest }: PopoverContentProps): default_2.ReactPortal | null;
|
|
43
51
|
|
package/dist/popover.js
CHANGED
package/dist/select.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Select-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Select-BkJNe4Lc.cjs");exports.Select=e.Select;
|
package/dist/select.js
CHANGED
package/dist/selectfield.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./SelectField-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./SelectField-Dxl2Mgbv.cjs");exports.SelectField=e.SelectField;
|
package/dist/selectfield.js
CHANGED
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";const d=require("./jsx-runtime-BRMkMA8J.cjs"),o=require("react"),B=require("react-dom"),h=require("@vhyxui/core"),T=require("@vhyxseal/react"),A=require("./useId-D2AEOm2G.cjs"),O="_trigger_5e049_1",X="_content_5e049_7",z="_arrow_5e049_21",U="_close_5e049_29",E={trigger:O,content:X,arrow:z,close:U},_=o.createContext(null);function j(n){const i=o.useContext(_);if(!i)throw new h.VhyxUIError({code:h.VhyxUIErrorCode.VHYXUI_MISSING_CONTEXT,message:`${n} must be used within <Popover>`,suggestion:"Wrap your component tree with <Popover>"});return i}const N=o.forwardRef(({open:n,defaultOpen:i=!1,onOpenChange:t,contract:g,children:m},a)=>{const e=A.useId("vhyx-popover"),u=`${e}-trigger`,x=`${e}-content`,c=n!==void 0,[v,f]=o.useState(i),p=c?n:v,P=o.useRef(null),l=o.useRef(null),r=o.useCallback(s=>{c||f(s),t==null||t(s)},[c,t]);o.useEffect(()=>{if(!p)return;function s(R){var C;R.key==="Escape"&&(r(!1),(C=P.current)==null||C.focus())}return document.addEventListener("keydown",s),()=>document.removeEventListener("keydown",s)},[p,r]),o.useEffect(()=>{if(!p)return;function s(R){var b,I;const C=R.target;(b=P.current)!=null&&b.contains(C)||(I=l.current)!=null&&I.contains(C)||r(!1)}return document.addEventListener("mousedown",s),()=>document.removeEventListener("mousedown",s)},[p,r]);const y=o.useMemo(()=>({...h.popoverContract,id:e,...g}),[e,g]),w=o.useMemo(()=>({open:p,onOpenChange:r,triggerId:u,contentId:x,triggerRef:P,contentRef:l}),[p,r,u,x]);return d.jsxRuntimeExports.jsx(_.Provider,{value:w,children:d.jsxRuntimeExports.jsx("div",{ref:a,"data-state":p?"open":"closed","data-vhyx-contract":JSON.stringify(y),children:m})})});N.displayName="VhyxPopover";const L=o.forwardRef(({children:n,className:i,onClick:t,asChild:g=!1,...m},a)=>{const e=j("Popover.Trigger"),u=o.useCallback(f=>{e.triggerRef.current=f,typeof a=="function"?a(f):a&&(a.current=f)},[a,e.triggerRef]),x=o.useCallback(f=>{t==null||t(f),e.onOpenChange(!e.open)},[t,e]),c=[E.trigger,i].filter(Boolean).join(" "),v={id:e.triggerId,"aria-haspopup":"dialog","aria-expanded":e.open,"aria-controls":e.open?e.contentId:void 0,onClick:x,className:c,...m};return g?d.jsxRuntimeExports.jsx(h.Slot,{ref:u,...v,children:n}):d.jsxRuntimeExports.jsx("button",{ref:u,type:"button",...v,children:n})});L.displayName="VhyxPopoverTrigger";function S({children:n,className:i,side:t="bottom",align:g="center",style:m,...a}){const e=j("Popover.Content"),[u,x]=o.useState(!1),[c,v]=o.useState({top:0,left:0,transform:"translateX(-50%)"});o.useEffect(()=>{x(!0)},[]),o.useEffect(()=>{if(!e.open||!e.triggerRef.current)return;const l=()=>{const r=e.triggerRef.current.getBoundingClientRect(),y=8;let w=0,s=0,R="translateX(-50%)";t==="bottom"?(w=r.bottom+y,s=r.left+r.width/2):t==="top"?(w=r.top-y,s=r.left+r.width/2):t==="right"?(w=r.top+r.height/2,s=r.right+y):(w=r.top+r.height/2,s=r.left-y,R="translateX(-100%)"),v({top:w,left:s,transform:R})};return l(),window.addEventListener("scroll",l,!0),window.addEventListener("resize",l),()=>{window.removeEventListener("scroll",l,!0),window.removeEventListener("resize",l)}},[e.open,e.triggerRef,t]);const f=o.useCallback(l=>{e.contentRef.current=l},[e.contentRef]);if(!u||!e.open)return null;const p=[E.content,i].filter(Boolean).join(" "),P=d.jsxRuntimeExports.jsx("div",{ref:f,id:e.contentId,role:"dialog","aria-modal":"false","aria-labelledby":e.triggerId,className:p,"data-state":"open","data-side":t,"data-align":g,...a,style:{...m,position:"fixed",top:c.top,left:c.left,zIndex:450,transform:c.transform},children:n});return B.createPortal(P,document.body)}S.displayName="VhyxPopoverContent";function V({className:n,...i}){const t=[E.arrow,n].filter(Boolean).join(" ");return d.jsxRuntimeExports.jsx("svg",{"aria-hidden":"true",className:t,viewBox:"0 0 10 5",...i,children:d.jsxRuntimeExports.jsx("path",{d:"M0 5L5 0L10 5",fill:"currentColor"})})}V.displayName="VhyxPopoverArrow";const M=o.forwardRef(({children:n,className:i,onClick:t,asChild:g=!1,...m},a)=>{const e=j("Popover.Close"),u=o.useCallback(v=>{t==null||t(v),e.onOpenChange(!1)},[t,e]),x=[E.close,i].filter(Boolean).join(" "),c={onClick:u,className:x,...m};return g?d.jsxRuntimeExports.jsx(h.Slot,{ref:a,...c,children:n}):d.jsxRuntimeExports.jsx("button",{ref:a,type:"button",...c,children:n??"Close"})});M.displayName="VhyxPopoverClose";const $={...h.popoverContract,id:"vhyxui-popover"},q=Object.assign(T.withAgentContract(N,$),{Trigger:L,Content:S,Arrow:V,Close:M});q.displayName="VhyxPopover";exports.Popover=q;
|
package/dist/Popover-u9vlClum.js
DELETED
|
@@ -1,211 +0,0 @@
|
|
|
1
|
-
import { j as d } from "./jsx-runtime-CL69jGNW.js";
|
|
2
|
-
import E, { useState as I, useRef as L, useCallback as C, useEffect as R, useMemo as V, createContext as U, useContext as $ } from "react";
|
|
3
|
-
import D from "react-dom";
|
|
4
|
-
import { popoverContract as B, Slot as M, VhyxUIError as G, VhyxUIErrorCode as H } from "@vhyxui/core";
|
|
5
|
-
import { withAgentContract as J } from "@vhyxseal/react";
|
|
6
|
-
import { u as K } from "./useId-BGRmH6iF.js";
|
|
7
|
-
const W = "_trigger_5e049_1", Y = "_content_5e049_7", q = "_arrow_5e049_21", F = "_close_5e049_29", j = {
|
|
8
|
-
trigger: W,
|
|
9
|
-
content: Y,
|
|
10
|
-
arrow: q,
|
|
11
|
-
close: F
|
|
12
|
-
}, S = U(null);
|
|
13
|
-
function _(r) {
|
|
14
|
-
const s = $(S);
|
|
15
|
-
if (!s)
|
|
16
|
-
throw new G({
|
|
17
|
-
code: H.VHYXUI_MISSING_CONTEXT,
|
|
18
|
-
message: `${r} must be used within <Popover>`,
|
|
19
|
-
suggestion: "Wrap your component tree with <Popover>"
|
|
20
|
-
});
|
|
21
|
-
return s;
|
|
22
|
-
}
|
|
23
|
-
const T = E.forwardRef(
|
|
24
|
-
({
|
|
25
|
-
open: r,
|
|
26
|
-
defaultOpen: s = !1,
|
|
27
|
-
onOpenChange: t,
|
|
28
|
-
contract: p,
|
|
29
|
-
children: v
|
|
30
|
-
}, i) => {
|
|
31
|
-
const e = K("vhyx-popover"), l = `${e}-trigger`, g = `${e}-content`, a = r !== void 0, [m, f] = I(s), u = a ? r : m, h = L(null), c = L(null), o = C(
|
|
32
|
-
(n) => {
|
|
33
|
-
a || f(n), t == null || t(n);
|
|
34
|
-
},
|
|
35
|
-
[a, t]
|
|
36
|
-
);
|
|
37
|
-
R(() => {
|
|
38
|
-
if (!u) return;
|
|
39
|
-
function n(y) {
|
|
40
|
-
var P;
|
|
41
|
-
y.key === "Escape" && (o(!1), (P = h.current) == null || P.focus());
|
|
42
|
-
}
|
|
43
|
-
return document.addEventListener("keydown", n), () => document.removeEventListener("keydown", n);
|
|
44
|
-
}, [u, o]), R(() => {
|
|
45
|
-
if (!u) return;
|
|
46
|
-
function n(y) {
|
|
47
|
-
var b, N;
|
|
48
|
-
const P = y.target;
|
|
49
|
-
(b = h.current) != null && b.contains(P) || (N = c.current) != null && N.contains(P) || o(!1);
|
|
50
|
-
}
|
|
51
|
-
return document.addEventListener("mousedown", n), () => document.removeEventListener("mousedown", n);
|
|
52
|
-
}, [u, o]);
|
|
53
|
-
const w = V(
|
|
54
|
-
() => ({ ...B, id: e, ...p }),
|
|
55
|
-
[e, p]
|
|
56
|
-
), x = V(
|
|
57
|
-
() => ({
|
|
58
|
-
open: u,
|
|
59
|
-
onOpenChange: o,
|
|
60
|
-
triggerId: l,
|
|
61
|
-
contentId: g,
|
|
62
|
-
triggerRef: h,
|
|
63
|
-
contentRef: c
|
|
64
|
-
}),
|
|
65
|
-
[u, o, l, g]
|
|
66
|
-
);
|
|
67
|
-
return /* @__PURE__ */ d.jsx(S.Provider, { value: x, children: /* @__PURE__ */ d.jsx(
|
|
68
|
-
"div",
|
|
69
|
-
{
|
|
70
|
-
ref: i,
|
|
71
|
-
"data-state": u ? "open" : "closed",
|
|
72
|
-
"data-vhyx-contract": JSON.stringify(w),
|
|
73
|
-
children: v
|
|
74
|
-
}
|
|
75
|
-
) });
|
|
76
|
-
}
|
|
77
|
-
);
|
|
78
|
-
T.displayName = "VhyxPopover";
|
|
79
|
-
const A = E.forwardRef(
|
|
80
|
-
({ children: r, className: s, onClick: t, asChild: p = !1, ...v }, i) => {
|
|
81
|
-
const e = _("Popover.Trigger"), l = C(
|
|
82
|
-
(f) => {
|
|
83
|
-
e.triggerRef.current = f, typeof i == "function" ? i(f) : i && (i.current = f);
|
|
84
|
-
},
|
|
85
|
-
[i, e.triggerRef]
|
|
86
|
-
), g = C(
|
|
87
|
-
(f) => {
|
|
88
|
-
t == null || t(f), e.onOpenChange(!e.open);
|
|
89
|
-
},
|
|
90
|
-
[t, e]
|
|
91
|
-
), a = [j.trigger, s].filter(Boolean).join(" "), m = {
|
|
92
|
-
id: e.triggerId,
|
|
93
|
-
"aria-haspopup": "dialog",
|
|
94
|
-
"aria-expanded": e.open,
|
|
95
|
-
"aria-controls": e.open ? e.contentId : void 0,
|
|
96
|
-
onClick: g,
|
|
97
|
-
className: a,
|
|
98
|
-
...v
|
|
99
|
-
};
|
|
100
|
-
return p ? /* @__PURE__ */ d.jsx(M, { ref: l, ...m, children: r }) : /* @__PURE__ */ d.jsx("button", { ref: l, type: "button", ...m, children: r });
|
|
101
|
-
}
|
|
102
|
-
);
|
|
103
|
-
A.displayName = "VhyxPopoverTrigger";
|
|
104
|
-
function O({
|
|
105
|
-
children: r,
|
|
106
|
-
className: s,
|
|
107
|
-
side: t = "bottom",
|
|
108
|
-
align: p = "center",
|
|
109
|
-
style: v,
|
|
110
|
-
...i
|
|
111
|
-
}) {
|
|
112
|
-
const e = _("Popover.Content"), [l, g] = I(!1), [a, m] = I({
|
|
113
|
-
top: 0,
|
|
114
|
-
left: 0,
|
|
115
|
-
transform: "translateX(-50%)"
|
|
116
|
-
});
|
|
117
|
-
R(() => {
|
|
118
|
-
g(!0);
|
|
119
|
-
}, []), R(() => {
|
|
120
|
-
if (!e.open || !e.triggerRef.current) return;
|
|
121
|
-
const c = () => {
|
|
122
|
-
const o = e.triggerRef.current.getBoundingClientRect(), w = 8;
|
|
123
|
-
let x = 0, n = 0, y = "translateX(-50%)";
|
|
124
|
-
t === "bottom" ? (x = o.bottom + w, n = o.left + o.width / 2) : t === "top" ? (x = o.top - w, n = o.left + o.width / 2) : t === "right" ? (x = o.top + o.height / 2, n = o.right + w) : (x = o.top + o.height / 2, n = o.left - w, y = "translateX(-100%)"), m({ top: x, left: n, transform: y });
|
|
125
|
-
};
|
|
126
|
-
return c(), window.addEventListener("scroll", c, !0), window.addEventListener("resize", c), () => {
|
|
127
|
-
window.removeEventListener("scroll", c, !0), window.removeEventListener("resize", c);
|
|
128
|
-
};
|
|
129
|
-
}, [e.open, e.triggerRef, t]);
|
|
130
|
-
const f = C(
|
|
131
|
-
(c) => {
|
|
132
|
-
e.contentRef.current = c;
|
|
133
|
-
},
|
|
134
|
-
[e.contentRef]
|
|
135
|
-
);
|
|
136
|
-
if (!l || !e.open) return null;
|
|
137
|
-
const u = [j.content, s].filter(Boolean).join(" "), h = /* @__PURE__ */ d.jsx(
|
|
138
|
-
"div",
|
|
139
|
-
{
|
|
140
|
-
ref: f,
|
|
141
|
-
id: e.contentId,
|
|
142
|
-
role: "dialog",
|
|
143
|
-
"aria-modal": "false",
|
|
144
|
-
"aria-labelledby": e.triggerId,
|
|
145
|
-
className: u,
|
|
146
|
-
"data-state": "open",
|
|
147
|
-
"data-side": t,
|
|
148
|
-
"data-align": p,
|
|
149
|
-
...i,
|
|
150
|
-
style: {
|
|
151
|
-
// Consumer's cosmetic style first — internal positioning keys below
|
|
152
|
-
// are applied explicitly afterward so they always win, instead of
|
|
153
|
-
// letting a whole `style` object from a blind `{...rest}` spread
|
|
154
|
-
// replace this element's positioning outright.
|
|
155
|
-
...v,
|
|
156
|
-
position: "fixed",
|
|
157
|
-
top: a.top,
|
|
158
|
-
left: a.left,
|
|
159
|
-
zIndex: 450,
|
|
160
|
-
// --vhyx-z-popover
|
|
161
|
-
transform: a.transform
|
|
162
|
-
},
|
|
163
|
-
children: r
|
|
164
|
-
}
|
|
165
|
-
);
|
|
166
|
-
return D.createPortal(h, document.body);
|
|
167
|
-
}
|
|
168
|
-
O.displayName = "VhyxPopoverContent";
|
|
169
|
-
function X({ className: r, ...s }) {
|
|
170
|
-
const t = [j.arrow, r].filter(Boolean).join(" ");
|
|
171
|
-
return /* @__PURE__ */ d.jsx(
|
|
172
|
-
"svg",
|
|
173
|
-
{
|
|
174
|
-
"aria-hidden": "true",
|
|
175
|
-
className: t,
|
|
176
|
-
viewBox: "0 0 10 5",
|
|
177
|
-
...s,
|
|
178
|
-
children: /* @__PURE__ */ d.jsx("path", { d: "M0 5L5 0L10 5", fill: "currentColor" })
|
|
179
|
-
}
|
|
180
|
-
);
|
|
181
|
-
}
|
|
182
|
-
X.displayName = "VhyxPopoverArrow";
|
|
183
|
-
const z = E.forwardRef(
|
|
184
|
-
({ children: r, className: s, onClick: t, asChild: p = !1, ...v }, i) => {
|
|
185
|
-
const e = _("Popover.Close"), l = C(
|
|
186
|
-
(m) => {
|
|
187
|
-
t == null || t(m), e.onOpenChange(!1);
|
|
188
|
-
},
|
|
189
|
-
[t, e]
|
|
190
|
-
), g = [j.close, s].filter(Boolean).join(" "), a = {
|
|
191
|
-
onClick: l,
|
|
192
|
-
className: g,
|
|
193
|
-
...v
|
|
194
|
-
};
|
|
195
|
-
return p ? /* @__PURE__ */ d.jsx(M, { ref: i, ...a, children: r }) : /* @__PURE__ */ d.jsx("button", { ref: i, type: "button", ...a, children: r ?? "Close" });
|
|
196
|
-
}
|
|
197
|
-
);
|
|
198
|
-
z.displayName = "VhyxPopoverClose";
|
|
199
|
-
const Q = { ...B, id: "vhyxui-popover" }, Z = Object.assign(
|
|
200
|
-
J(T, Q),
|
|
201
|
-
{
|
|
202
|
-
Trigger: A,
|
|
203
|
-
Content: O,
|
|
204
|
-
Arrow: X,
|
|
205
|
-
Close: z
|
|
206
|
-
}
|
|
207
|
-
);
|
|
208
|
-
Z.displayName = "VhyxPopover";
|
|
209
|
-
export {
|
|
210
|
-
Z as P
|
|
211
|
-
};
|
package/dist/Select-CGfKq69f.cjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";const p=require("./jsx-runtime-BRMkMA8J.cjs"),e=require("react"),re=require("react-dom"),L=require("@vhyxui/core"),oe=require("@vhyxseal/react"),O=require("./useId-D2AEOm2G.cjs"),ce="_trigger_1t193_3",ie="_content_1t193_81",ae="_item_1t193_101",le="_group_1t193_152",ue="_label_1t193_158",de="_separator_1t193_170",b={trigger:ce,"trigger-value":"_trigger-value_1t193_62","trigger-icon":"_trigger-icon_1t193_70",content:ie,item:ae,"item-check":"_item-check_1t193_141",group:le,label:ue,separator:de},X=e.createContext(null);function D(r){const n=e.useContext(X);if(!n)throw new L.VhyxUIError({code:L.VhyxUIErrorCode.VHYXUI_MISSING_CONTEXT,message:`${r} must be used within <Select>`,suggestion:"Wrap your component tree with <Select>"});return n}const Y=e.forwardRef(({value:r,defaultValue:n,onValueChange:l,disabled:m=!1,size:s="md",placeholder:f,contract:y,children:o,className:v,...c},R)=>{const S=O.useId("vhyx-select-trigger"),u=O.useId("vhyx-select-content"),x=O.useId("vhyx-select"),d=r!==void 0,[k,C]=e.useState(n),h=d?r:k,[t,N]=e.useState(!1),[I,E]=e.useState(void 0),V=e.useRef(null),T=e.useRef(null),_=e.useRef(new Map),B=e.useRef([]),z=e.useRef(new Map),[A,M]=e.useState(void 0),q=e.useRef(h);q.current=h,e.useEffect(()=>{if(h===void 0){M(void 0);return}const i=_.current.get(h);M(i?i.label:void 0)},[h]);const H=e.useCallback((i,a,g)=>{_.current.has(i)||B.current.push(i);const j={label:a};g!==void 0&&(j.disabled=g),_.current.set(i,j),i===q.current&&M(a)},[]),P=e.useCallback(()=>A,[A]),U=e.useCallback(i=>{var j;const a=B.current.filter(w=>{var F;return!((F=_.current.get(w))!=null&&F.disabled)});if(a.length===0)return;let g;if(i==="home")g=a[0];else if(i==="end")g=a[a.length-1];else{const w=I!==void 0?a.indexOf(I):-1;g=i==="down"?a[Math.min(w+1,a.length-1)]:a[Math.max(w-1,0)]}g!==void 0&&(E(g),(j=z.current.get(g))==null||j.focus())},[I]),W=e.useCallback(i=>{var a;d||C(i),l==null||l(i),N(!1),E(void 0),(a=V.current)==null||a.focus()},[d,l]),G=e.useCallback(i=>{if(N(i),i){const a=h??B.current[0];E(a)}else E(void 0)},[h]),ne=e.useMemo(()=>({...L.selectContract,id:x,...y}),[x,y]),se=e.useMemo(()=>({value:h,onValueChange:W,open:t,onOpenChange:G,disabled:m,size:s,placeholder:f,triggerId:S,contentId:u,triggerRef:V,contentRef:T,focusedValue:I,setFocusedValue:E,registerItem:H,getSelectedLabel:P,navigateItems:U,itemElementsRef:z,itemOrderRef:B,itemRegistryRef:_}),[h,W,t,G,m,s,f,S,u,I,H,P,U]);return e.useEffect(()=>{if(!t)return;function i(a){var g;a.key==="Escape"&&(N(!1),E(void 0),(g=V.current)==null||g.focus())}return document.addEventListener("keydown",i),()=>document.removeEventListener("keydown",i)},[t]),e.useEffect(()=>{if(!t)return;function i(a){var j,w;const g=a.target;(j=V.current)!=null&&j.contains(g)||(w=T.current)!=null&&w.contains(g)||(N(!1),E(void 0))}return document.addEventListener("mousedown",i),()=>document.removeEventListener("mousedown",i)},[t]),p.jsxRuntimeExports.jsx(X.Provider,{value:se,children:p.jsxRuntimeExports.jsx("div",{ref:R,className:v,"data-size":s,"data-disabled":m?!0:void 0,"data-vhyx-contract":JSON.stringify(ne),...c,children:o})})});Y.displayName="VhyxSelect";const J=e.forwardRef((r,n)=>{const{icon:l,className:m,asChild:s=!1,children:f,...y}=r,o=D("Select.Trigger"),v=o.getSelectedLabel(),c=e.useCallback(d=>{o.triggerRef.current=d,typeof n=="function"?n(d):n&&(n.current=d)},[n,o.triggerRef]),R=e.useCallback(()=>{o.disabled||o.onOpenChange(!o.open)},[o]),S=e.useCallback(d=>{(d.key==="ArrowDown"||d.key==="ArrowUp")&&(d.preventDefault(),o.open||o.onOpenChange(!0))},[o]),u=[b.trigger,m].filter(Boolean).join(" "),x={id:o.triggerId,role:"combobox","aria-haspopup":"listbox","aria-expanded":o.open,"aria-controls":o.open?o.contentId:void 0,disabled:o.disabled,onClick:R,onKeyDown:S,className:u,"data-size":o.size,"data-state":o.open?"open":"closed","data-placeholder":v?void 0:!0,...y};return s?p.jsxRuntimeExports.jsx(L.Slot,{ref:c,...x,children:f}):p.jsxRuntimeExports.jsxs("button",{ref:c,type:"button",...x,children:[p.jsxRuntimeExports.jsx("span",{className:b["trigger-value"],children:v??o.placeholder??"Select…"}),p.jsxRuntimeExports.jsx("span",{className:b["trigger-icon"],"aria-hidden":"true",children:l??p.jsxRuntimeExports.jsx("svg",{viewBox:"0 0 12 12",fill:"none",stroke:"currentColor",strokeWidth:1.5,children:p.jsxRuntimeExports.jsx("path",{d:"M2.5 4.5L6 8L9.5 4.5",strokeLinecap:"round",strokeLinejoin:"round"})})})]})});J.displayName="VhyxSelectTrigger";function $({children:r,className:n,style:l,...m}){const s=D("Select.Content"),[f,y]=e.useState(!1),[o,v]=e.useState({position:"fixed",top:0,left:0,minWidth:0,zIndex:"var(--vhyx-z-dropdown)"});e.useEffect(()=>{y(!0)},[]),e.useEffect(()=>{if(!s.open||!s.triggerRef.current)return;const u=()=>{var t;const x=s.triggerRef.current.getBoundingClientRect(),d=window.innerHeight-x.bottom,k=x.top,C=((t=s.contentRef.current)==null?void 0:t.scrollHeight)??300,h=d<C&&k>d;v({position:"fixed",top:h?x.top-C-4:x.bottom+4,left:x.left,minWidth:x.width,zIndex:"var(--vhyx-z-dropdown)",maxHeight:h?Math.min(C,k-8):Math.min(C,d-8),overflowY:"auto"})};return u(),window.addEventListener("scroll",u,!0),window.addEventListener("resize",u),()=>{window.removeEventListener("scroll",u,!0),window.removeEventListener("resize",u)}},[s.open,s.triggerRef]),e.useEffect(()=>{var u;!s.open||!s.focusedValue||(u=s.itemElementsRef.current.get(s.focusedValue))==null||u.focus()},[s.open]);const c=e.useCallback(u=>{s.contentRef.current=u},[s.contentRef]);if(!f)return null;const R=[b.content,n].filter(Boolean).join(" "),S=p.jsxRuntimeExports.jsx("div",{ref:c,id:s.contentId,role:"listbox","aria-labelledby":s.triggerId,className:R,"data-state":s.open?"open":"closed",...m,style:{...l,...o},children:r});return re.createPortal(S,document.body)}$.displayName="VhyxSelectContent";const K=e.forwardRef(({value:r,disabled:n,children:l,className:m,onClick:s,onKeyDown:f,onMouseEnter:y,...o},v)=>{const c=D("Select.Item"),R=c.value===r,S=c.focusedValue===r,u=typeof l=="string"?l:"";e.useEffect(()=>{c.registerItem(r,u,n)},[c,r,u,n]);const x=e.useCallback(t=>{t?c.itemElementsRef.current.set(r,t):c.itemElementsRef.current.delete(r),typeof v=="function"?v(t):v&&(v.current=t)},[v,c,r]),d=e.useCallback(t=>{s==null||s(t),n||c.onValueChange(r)},[s,n,c,r]),k=e.useCallback(t=>{f==null||f(t),t.key==="Enter"||t.key===" "?(t.preventDefault(),n||c.onValueChange(r)):t.key==="ArrowDown"?(t.preventDefault(),c.navigateItems("down")):t.key==="ArrowUp"?(t.preventDefault(),c.navigateItems("up")):t.key==="Home"?(t.preventDefault(),c.navigateItems("home")):t.key==="End"&&(t.preventDefault(),c.navigateItems("end"))},[f,n,c,r]),C=e.useCallback(t=>{y==null||y(t),!n&&(c.setFocusedValue(r),t.currentTarget.focus())},[y,n,c,r]),h=[b.item,m].filter(Boolean).join(" ");return p.jsxRuntimeExports.jsxs("div",{ref:x,role:"option","aria-selected":R,"aria-disabled":n?!0:void 0,tabIndex:S?0:-1,onClick:d,onKeyDown:k,onMouseEnter:C,className:h,"data-state":R?"selected":"unselected","data-disabled":n?!0:void 0,"data-focused":S?!0:void 0,...o,children:[l,R&&p.jsxRuntimeExports.jsx("span",{className:b["item-check"],"aria-hidden":"true",children:p.jsxRuntimeExports.jsx("svg",{viewBox:"0 0 12 12",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",children:p.jsxRuntimeExports.jsx("polyline",{points:"2,6 5,9 10,3"})})})]})});K.displayName="VhyxSelectItem";function Q({children:r,className:n,...l}){const m=O.useId("vhyx-select-group-label"),s=[b.group,n].filter(Boolean).join(" ");return p.jsxRuntimeExports.jsx("div",{role:"group","aria-labelledby":m,className:s,...l,children:e.Children.map(r,f=>e.isValidElement(f)&&f.type.displayName==="VhyxSelectLabel"?e.cloneElement(f,{id:m}):f)})}Q.displayName="VhyxSelectGroup";function Z({children:r,className:n,...l}){const m=[b.label,n].filter(Boolean).join(" ");return p.jsxRuntimeExports.jsx("span",{className:m,...l,children:r})}Z.displayName="VhyxSelectLabel";function ee({className:r,...n}){const l=[b.separator,r].filter(Boolean).join(" ");return p.jsxRuntimeExports.jsx("hr",{"aria-hidden":"true",className:l,...n})}ee.displayName="VhyxSelectSeparator";const fe={...L.selectContract,id:"vhyxui-select"},te=Object.assign(oe.withAgentContract(Y,fe),{Trigger:J,Content:$,Item:K,Group:Q,Label:Z,Separator:ee});te.displayName="VhyxSelect";exports.Select=te;
|
package/dist/Select-DHalg36V.js
DELETED
|
@@ -1,344 +0,0 @@
|
|
|
1
|
-
import { j as f } from "./jsx-runtime-CL69jGNW.js";
|
|
2
|
-
import E, { useState as k, useRef as N, useEffect as j, useCallback as x, 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 z } from "./useId-BGRmH6iF.js";
|
|
7
|
-
const me = "_trigger_1t193_3", he = "_content_1t193_81", xe = "_item_1t193_101", ve = "_group_1t193_152", ye = "_label_1t193_158", Se = "_separator_1t193_170", b = {
|
|
8
|
-
trigger: me,
|
|
9
|
-
"trigger-value": "_trigger-value_1t193_62",
|
|
10
|
-
"trigger-icon": "_trigger-icon_1t193_70",
|
|
11
|
-
content: he,
|
|
12
|
-
item: xe,
|
|
13
|
-
"item-check": "_item-check_1t193_141",
|
|
14
|
-
group: ve,
|
|
15
|
-
label: ye,
|
|
16
|
-
separator: Se
|
|
17
|
-
}, Q = ae(null);
|
|
18
|
-
function A(r) {
|
|
19
|
-
const t = le(Q);
|
|
20
|
-
if (!t)
|
|
21
|
-
throw new fe({
|
|
22
|
-
code: pe.VHYXUI_MISSING_CONTEXT,
|
|
23
|
-
message: `${r} must be used within <Select>`,
|
|
24
|
-
suggestion: "Wrap your component tree with <Select>"
|
|
25
|
-
});
|
|
26
|
-
return t;
|
|
27
|
-
}
|
|
28
|
-
const Z = E.forwardRef(
|
|
29
|
-
({
|
|
30
|
-
value: r,
|
|
31
|
-
defaultValue: t,
|
|
32
|
-
onValueChange: a,
|
|
33
|
-
disabled: g = !1,
|
|
34
|
-
size: n = "md",
|
|
35
|
-
placeholder: u,
|
|
36
|
-
contract: y,
|
|
37
|
-
children: o,
|
|
38
|
-
className: v,
|
|
39
|
-
...s
|
|
40
|
-
}, S) => {
|
|
41
|
-
const w = z("vhyx-select-trigger"), l = z("vhyx-select-content"), m = z("vhyx-select"), d = r !== void 0, [L, R] = k(t), h = d ? r : L, [e, O] = k(!1), [V, I] = k(void 0), M = N(null), H = N(null), B = N(/* @__PURE__ */ new Map()), D = N([]), P = N(/* @__PURE__ */ new Map()), [U, T] = k(void 0), W = N(h);
|
|
42
|
-
W.current = h, j(() => {
|
|
43
|
-
if (h === void 0) {
|
|
44
|
-
T(void 0);
|
|
45
|
-
return;
|
|
46
|
-
}
|
|
47
|
-
const i = B.current.get(h);
|
|
48
|
-
T(i ? i.label : void 0);
|
|
49
|
-
}, [h]);
|
|
50
|
-
const G = x(
|
|
51
|
-
(i, c, p) => {
|
|
52
|
-
B.current.has(i) || D.current.push(i);
|
|
53
|
-
const C = { label: c };
|
|
54
|
-
p !== void 0 && (C.disabled = p), B.current.set(i, C), i === W.current && T(c);
|
|
55
|
-
},
|
|
56
|
-
[]
|
|
57
|
-
), F = x(() => U, [U]), X = x(
|
|
58
|
-
(i) => {
|
|
59
|
-
var C;
|
|
60
|
-
const c = D.current.filter(
|
|
61
|
-
(_) => {
|
|
62
|
-
var $;
|
|
63
|
-
return !(($ = B.current.get(_)) != null && $.disabled);
|
|
64
|
-
}
|
|
65
|
-
);
|
|
66
|
-
if (c.length === 0) return;
|
|
67
|
-
let p;
|
|
68
|
-
if (i === "home")
|
|
69
|
-
p = c[0];
|
|
70
|
-
else if (i === "end")
|
|
71
|
-
p = c[c.length - 1];
|
|
72
|
-
else {
|
|
73
|
-
const _ = V !== void 0 ? c.indexOf(V) : -1;
|
|
74
|
-
p = i === "down" ? c[Math.min(_ + 1, c.length - 1)] : c[Math.max(_ - 1, 0)];
|
|
75
|
-
}
|
|
76
|
-
p !== void 0 && (I(p), (C = P.current.get(p)) == null || C.focus());
|
|
77
|
-
},
|
|
78
|
-
[V]
|
|
79
|
-
), Y = x(
|
|
80
|
-
(i) => {
|
|
81
|
-
var c;
|
|
82
|
-
d || R(i), a == null || a(i), O(!1), I(void 0), (c = M.current) == null || c.focus();
|
|
83
|
-
},
|
|
84
|
-
[d, a]
|
|
85
|
-
), J = x(
|
|
86
|
-
(i) => {
|
|
87
|
-
if (O(i), i) {
|
|
88
|
-
const c = h ?? D.current[0];
|
|
89
|
-
I(c);
|
|
90
|
-
} else
|
|
91
|
-
I(void 0);
|
|
92
|
-
},
|
|
93
|
-
[h]
|
|
94
|
-
), ie = q(
|
|
95
|
-
() => ({ ...K, id: m, ...y }),
|
|
96
|
-
[m, y]
|
|
97
|
-
), ce = q(
|
|
98
|
-
() => ({
|
|
99
|
-
value: h,
|
|
100
|
-
onValueChange: Y,
|
|
101
|
-
open: e,
|
|
102
|
-
onOpenChange: J,
|
|
103
|
-
disabled: g,
|
|
104
|
-
size: n,
|
|
105
|
-
placeholder: u,
|
|
106
|
-
triggerId: w,
|
|
107
|
-
contentId: l,
|
|
108
|
-
triggerRef: M,
|
|
109
|
-
contentRef: H,
|
|
110
|
-
focusedValue: V,
|
|
111
|
-
setFocusedValue: I,
|
|
112
|
-
registerItem: G,
|
|
113
|
-
getSelectedLabel: F,
|
|
114
|
-
navigateItems: X,
|
|
115
|
-
itemElementsRef: P,
|
|
116
|
-
itemOrderRef: D,
|
|
117
|
-
itemRegistryRef: B
|
|
118
|
-
}),
|
|
119
|
-
[
|
|
120
|
-
h,
|
|
121
|
-
Y,
|
|
122
|
-
e,
|
|
123
|
-
J,
|
|
124
|
-
g,
|
|
125
|
-
n,
|
|
126
|
-
u,
|
|
127
|
-
w,
|
|
128
|
-
l,
|
|
129
|
-
V,
|
|
130
|
-
G,
|
|
131
|
-
F,
|
|
132
|
-
X
|
|
133
|
-
]
|
|
134
|
-
);
|
|
135
|
-
return j(() => {
|
|
136
|
-
if (!e) return;
|
|
137
|
-
function i(c) {
|
|
138
|
-
var p;
|
|
139
|
-
c.key === "Escape" && (O(!1), I(void 0), (p = M.current) == null || p.focus());
|
|
140
|
-
}
|
|
141
|
-
return document.addEventListener("keydown", i), () => document.removeEventListener("keydown", i);
|
|
142
|
-
}, [e]), j(() => {
|
|
143
|
-
if (!e) return;
|
|
144
|
-
function i(c) {
|
|
145
|
-
var C, _;
|
|
146
|
-
const p = c.target;
|
|
147
|
-
(C = M.current) != null && C.contains(p) || (_ = H.current) != null && _.contains(p) || (O(!1), I(void 0));
|
|
148
|
-
}
|
|
149
|
-
return document.addEventListener("mousedown", i), () => document.removeEventListener("mousedown", i);
|
|
150
|
-
}, [e]), /* @__PURE__ */ f.jsx(Q.Provider, { value: ce, children: /* @__PURE__ */ f.jsx(
|
|
151
|
-
"div",
|
|
152
|
-
{
|
|
153
|
-
ref: S,
|
|
154
|
-
className: v,
|
|
155
|
-
"data-size": n,
|
|
156
|
-
"data-disabled": g ? !0 : void 0,
|
|
157
|
-
"data-vhyx-contract": JSON.stringify(ie),
|
|
158
|
-
...s,
|
|
159
|
-
children: o
|
|
160
|
-
}
|
|
161
|
-
) });
|
|
162
|
-
}
|
|
163
|
-
);
|
|
164
|
-
Z.displayName = "VhyxSelect";
|
|
165
|
-
const ee = E.forwardRef((r, t) => {
|
|
166
|
-
const { icon: a, className: g, asChild: n = !1, children: u, ...y } = r, o = A("Select.Trigger"), v = o.getSelectedLabel(), s = x(
|
|
167
|
-
(d) => {
|
|
168
|
-
o.triggerRef.current = d, typeof t == "function" ? t(d) : t && (t.current = d);
|
|
169
|
-
},
|
|
170
|
-
[t, o.triggerRef]
|
|
171
|
-
), S = x(() => {
|
|
172
|
-
o.disabled || o.onOpenChange(!o.open);
|
|
173
|
-
}, [o]), w = x(
|
|
174
|
-
(d) => {
|
|
175
|
-
(d.key === "ArrowDown" || d.key === "ArrowUp") && (d.preventDefault(), o.open || o.onOpenChange(!0));
|
|
176
|
-
},
|
|
177
|
-
[o]
|
|
178
|
-
), l = [b.trigger, g].filter(Boolean).join(" "), m = {
|
|
179
|
-
id: o.triggerId,
|
|
180
|
-
role: "combobox",
|
|
181
|
-
"aria-haspopup": "listbox",
|
|
182
|
-
"aria-expanded": o.open,
|
|
183
|
-
"aria-controls": o.open ? o.contentId : void 0,
|
|
184
|
-
disabled: o.disabled,
|
|
185
|
-
onClick: S,
|
|
186
|
-
onKeyDown: w,
|
|
187
|
-
className: l,
|
|
188
|
-
"data-size": o.size,
|
|
189
|
-
"data-state": o.open ? "open" : "closed",
|
|
190
|
-
"data-placeholder": v ? void 0 : !0,
|
|
191
|
-
...y
|
|
192
|
-
};
|
|
193
|
-
return n ? /* @__PURE__ */ f.jsx(ue, { ref: s, ...m, children: u }) : /* @__PURE__ */ f.jsxs("button", { ref: s, type: "button", ...m, children: [
|
|
194
|
-
/* @__PURE__ */ f.jsx("span", { className: b["trigger-value"], children: v ?? o.placeholder ?? "Select…" }),
|
|
195
|
-
/* @__PURE__ */ f.jsx("span", { className: b["trigger-icon"], "aria-hidden": "true", children: a ?? /* @__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" }) }) })
|
|
196
|
-
] });
|
|
197
|
-
});
|
|
198
|
-
ee.displayName = "VhyxSelectTrigger";
|
|
199
|
-
function te({ children: r, className: t, style: a, ...g }) {
|
|
200
|
-
const n = A("Select.Content"), [u, y] = k(!1), [o, v] = k({
|
|
201
|
-
position: "fixed",
|
|
202
|
-
top: 0,
|
|
203
|
-
left: 0,
|
|
204
|
-
minWidth: 0,
|
|
205
|
-
zIndex: "var(--vhyx-z-dropdown)"
|
|
206
|
-
});
|
|
207
|
-
j(() => {
|
|
208
|
-
y(!0);
|
|
209
|
-
}, []), j(() => {
|
|
210
|
-
if (!n.open || !n.triggerRef.current) return;
|
|
211
|
-
const l = () => {
|
|
212
|
-
var e;
|
|
213
|
-
const m = n.triggerRef.current.getBoundingClientRect(), d = window.innerHeight - m.bottom, L = m.top, R = ((e = n.contentRef.current) == null ? void 0 : e.scrollHeight) ?? 300, h = d < R && L > d;
|
|
214
|
-
v({
|
|
215
|
-
position: "fixed",
|
|
216
|
-
top: h ? m.top - R - 4 : m.bottom + 4,
|
|
217
|
-
left: m.left,
|
|
218
|
-
minWidth: m.width,
|
|
219
|
-
zIndex: "var(--vhyx-z-dropdown)",
|
|
220
|
-
maxHeight: h ? Math.min(R, L - 8) : Math.min(R, d - 8),
|
|
221
|
-
overflowY: "auto"
|
|
222
|
-
});
|
|
223
|
-
};
|
|
224
|
-
return l(), window.addEventListener("scroll", l, !0), window.addEventListener("resize", l), () => {
|
|
225
|
-
window.removeEventListener("scroll", l, !0), window.removeEventListener("resize", l);
|
|
226
|
-
};
|
|
227
|
-
}, [n.open, n.triggerRef]), j(() => {
|
|
228
|
-
var l;
|
|
229
|
-
!n.open || !n.focusedValue || (l = n.itemElementsRef.current.get(n.focusedValue)) == null || l.focus();
|
|
230
|
-
}, [n.open]);
|
|
231
|
-
const s = x(
|
|
232
|
-
(l) => {
|
|
233
|
-
n.contentRef.current = l;
|
|
234
|
-
},
|
|
235
|
-
[n.contentRef]
|
|
236
|
-
);
|
|
237
|
-
if (!u) return null;
|
|
238
|
-
const S = [b.content, t].filter(Boolean).join(" "), w = /* @__PURE__ */ f.jsx(
|
|
239
|
-
"div",
|
|
240
|
-
{
|
|
241
|
-
ref: s,
|
|
242
|
-
id: n.contentId,
|
|
243
|
-
role: "listbox",
|
|
244
|
-
"aria-labelledby": n.triggerId,
|
|
245
|
-
className: S,
|
|
246
|
-
"data-state": n.open ? "open" : "closed",
|
|
247
|
-
...g,
|
|
248
|
-
style: {
|
|
249
|
-
// Consumer's cosmetic style first — internal positioning/sizing keys
|
|
250
|
-
// (position/top/left/minWidth/zIndex/maxHeight/overflowY) are spread
|
|
251
|
-
// explicitly afterward so they always win, instead of letting a
|
|
252
|
-
// whole `style` object from a blind `{...rest}` spread replace this
|
|
253
|
-
// element's positioning outright.
|
|
254
|
-
...a,
|
|
255
|
-
...o
|
|
256
|
-
},
|
|
257
|
-
children: r
|
|
258
|
-
}
|
|
259
|
-
);
|
|
260
|
-
return de.createPortal(w, document.body);
|
|
261
|
-
}
|
|
262
|
-
te.displayName = "VhyxSelectContent";
|
|
263
|
-
const ne = E.forwardRef(
|
|
264
|
-
({ value: r, disabled: t, children: a, className: g, onClick: n, onKeyDown: u, onMouseEnter: y, ...o }, v) => {
|
|
265
|
-
const s = A("Select.Item"), S = s.value === r, w = s.focusedValue === r, l = typeof a == "string" ? a : "";
|
|
266
|
-
j(() => {
|
|
267
|
-
s.registerItem(r, l, t);
|
|
268
|
-
}, [s, r, l, t]);
|
|
269
|
-
const m = x(
|
|
270
|
-
(e) => {
|
|
271
|
-
e ? s.itemElementsRef.current.set(r, e) : s.itemElementsRef.current.delete(r), typeof v == "function" ? v(e) : v && (v.current = e);
|
|
272
|
-
},
|
|
273
|
-
[v, s, r]
|
|
274
|
-
), d = x(
|
|
275
|
-
(e) => {
|
|
276
|
-
n == null || n(e), t || s.onValueChange(r);
|
|
277
|
-
},
|
|
278
|
-
[n, t, s, r]
|
|
279
|
-
), L = x(
|
|
280
|
-
(e) => {
|
|
281
|
-
u == null || u(e), e.key === "Enter" || e.key === " " ? (e.preventDefault(), t || s.onValueChange(r)) : e.key === "ArrowDown" ? (e.preventDefault(), s.navigateItems("down")) : e.key === "ArrowUp" ? (e.preventDefault(), s.navigateItems("up")) : e.key === "Home" ? (e.preventDefault(), s.navigateItems("home")) : e.key === "End" && (e.preventDefault(), s.navigateItems("end"));
|
|
282
|
-
},
|
|
283
|
-
[u, t, s, r]
|
|
284
|
-
), R = x(
|
|
285
|
-
(e) => {
|
|
286
|
-
y == null || y(e), !t && (s.setFocusedValue(r), e.currentTarget.focus());
|
|
287
|
-
},
|
|
288
|
-
[y, t, s, r]
|
|
289
|
-
), h = [b.item, g].filter(Boolean).join(" ");
|
|
290
|
-
return /* @__PURE__ */ f.jsxs(
|
|
291
|
-
"div",
|
|
292
|
-
{
|
|
293
|
-
ref: m,
|
|
294
|
-
role: "option",
|
|
295
|
-
"aria-selected": S,
|
|
296
|
-
"aria-disabled": t ? !0 : void 0,
|
|
297
|
-
tabIndex: w ? 0 : -1,
|
|
298
|
-
onClick: d,
|
|
299
|
-
onKeyDown: L,
|
|
300
|
-
onMouseEnter: R,
|
|
301
|
-
className: h,
|
|
302
|
-
"data-state": S ? "selected" : "unselected",
|
|
303
|
-
"data-disabled": t ? !0 : void 0,
|
|
304
|
-
"data-focused": w ? !0 : void 0,
|
|
305
|
-
...o,
|
|
306
|
-
children: [
|
|
307
|
-
a,
|
|
308
|
-
S && /* @__PURE__ */ f.jsx("span", { className: b["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" }) }) })
|
|
309
|
-
]
|
|
310
|
-
}
|
|
311
|
-
);
|
|
312
|
-
}
|
|
313
|
-
);
|
|
314
|
-
ne.displayName = "VhyxSelectItem";
|
|
315
|
-
function re({ children: r, className: t, ...a }) {
|
|
316
|
-
const g = z("vhyx-select-group-label"), n = [b.group, t].filter(Boolean).join(" ");
|
|
317
|
-
return /* @__PURE__ */ f.jsx("div", { role: "group", "aria-labelledby": g, className: n, ...a, children: E.Children.map(r, (u) => E.isValidElement(u) && u.type.displayName === "VhyxSelectLabel" ? E.cloneElement(u, { id: g }) : u) });
|
|
318
|
-
}
|
|
319
|
-
re.displayName = "VhyxSelectGroup";
|
|
320
|
-
function oe({ children: r, className: t, ...a }) {
|
|
321
|
-
const g = [b.label, t].filter(Boolean).join(" ");
|
|
322
|
-
return /* @__PURE__ */ f.jsx("span", { className: g, ...a, children: r });
|
|
323
|
-
}
|
|
324
|
-
oe.displayName = "VhyxSelectLabel";
|
|
325
|
-
function se({ className: r, ...t }) {
|
|
326
|
-
const a = [b.separator, r].filter(Boolean).join(" ");
|
|
327
|
-
return /* @__PURE__ */ f.jsx("hr", { "aria-hidden": "true", className: a, ...t });
|
|
328
|
-
}
|
|
329
|
-
se.displayName = "VhyxSelectSeparator";
|
|
330
|
-
const we = { ...K, id: "vhyxui-select" }, be = Object.assign(
|
|
331
|
-
ge(Z, we),
|
|
332
|
-
{
|
|
333
|
-
Trigger: ee,
|
|
334
|
-
Content: te,
|
|
335
|
-
Item: ne,
|
|
336
|
-
Group: re,
|
|
337
|
-
Label: oe,
|
|
338
|
-
Separator: se
|
|
339
|
-
}
|
|
340
|
-
);
|
|
341
|
-
be.displayName = "VhyxSelect";
|
|
342
|
-
export {
|
|
343
|
-
be as S
|
|
344
|
-
};
|