@jfrader/ui 0.6.0 → 0.7.1
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/README.md +11 -6
- package/dist/avatar-BuM1zB_f.js +164 -0
- package/dist/{avatar-group-DvP8mAE-.js → avatar-group-D1UEihvh.js} +1 -1
- package/dist/avatar-group.js +1 -1
- package/dist/avatar.js +1 -1
- package/dist/card-frame-CcLa6NQ4.js +13 -0
- package/dist/{chat-thread-DVa17BRC.js → chat-thread-CMhwxhoA.js} +1 -1
- package/dist/chat-thread.js +1 -1
- package/dist/{comment-thread-BnUHxviq.js → comment-thread-DbOzYr0q.js} +1 -1
- package/dist/comment-thread.js +1 -1
- package/dist/emblem-DnXmpZCh.js +166 -0
- package/dist/emblem.js +2 -0
- package/dist/flip-game-card-xmcR_QSq.js +100 -0
- package/dist/flip-game-card.js +2 -0
- package/dist/game-card-Bnhpz78f.js +187 -0
- package/dist/game-card.js +2 -0
- package/dist/{hover-card-DN1EAlQA.js → hover-card--ijYr1cd.js} +1 -1
- package/dist/hover-card.js +1 -1
- package/dist/in-view-title-BUZCMqge.js +225 -0
- package/dist/in-view-title.js +2 -0
- package/dist/index.js +70 -65
- package/dist/initials-DEdwNe9_.js +18 -0
- package/dist/locale-switcher-DTkySKsM.js +375 -0
- package/dist/locale-switcher.js +1 -1
- package/dist/{thread-parts-DfZNz70v.js → thread-parts-DbKhuwVU.js} +1 -1
- package/dist/{timeline-DaldDMX7.js → timeline-BPKY94mT.js} +1 -1
- package/dist/timeline.js +1 -1
- package/dist/types/components/activity-rings/activity-rings.d.ts +7 -9
- package/dist/types/components/avatar/avatar.d.ts +3 -1
- package/dist/types/components/avatar-group/avatar-group.d.ts +3 -3
- package/dist/types/components/button/button.d.ts +7 -7
- package/dist/types/components/card/card.d.ts +4 -1
- package/dist/types/components/chip-group/chip-group.d.ts +2 -2
- package/dist/types/components/combobox/combobox.d.ts +2 -2
- package/dist/types/components/command-palette/command-palette.d.ts +1 -1
- package/dist/types/components/comment-thread/comment-thread.d.ts +4 -4
- package/dist/types/components/copy-button/copy-button.d.ts +6 -6
- package/dist/types/components/countdown/countdown.d.ts +2 -2
- package/dist/types/components/dialog/dialog.d.ts +18 -20
- package/dist/types/components/drawer/drawer.d.ts +2 -2
- package/dist/types/components/emblem/emblem.d.ts +59 -0
- package/dist/types/components/emblem/index.d.ts +2 -0
- package/dist/types/components/empty-state/empty-state.d.ts +2 -2
- package/dist/types/components/file-dropzone/file-dropzone.d.ts +3 -4
- package/dist/types/components/filter-toolbar/filter-toolbar.d.ts +2 -2
- package/dist/types/components/flip-game-card/flip-game-card.d.ts +22 -0
- package/dist/types/components/flip-game-card/index.d.ts +2 -0
- package/dist/types/components/game-card/card-frame.d.ts +16 -0
- package/dist/types/components/game-card/decks.d.ts +27 -0
- package/dist/types/components/game-card/game-card.d.ts +37 -0
- package/dist/types/components/game-card/index.d.ts +4 -0
- package/dist/types/components/hold-to-confirm/hold-to-confirm.d.ts +1 -1
- package/dist/types/components/hover-card/hover-card.d.ts +5 -5
- package/dist/types/components/in-view-title/in-view-title.d.ts +23 -0
- package/dist/types/components/in-view-title/index.d.ts +1 -0
- package/dist/types/components/inline-edit/inline-edit.d.ts +6 -6
- package/dist/types/components/json-viewer/json-viewer.d.ts +7 -9
- package/dist/types/components/keycap-keyboard/keycap-keyboard.d.ts +1 -1
- package/dist/types/components/link-unfurl/link-unfurl.d.ts +17 -7
- package/dist/types/components/locale-switcher/locale-switcher.d.ts +17 -11
- package/dist/types/components/mention-input/mention-input.d.ts +7 -7
- package/dist/types/components/metric-card/metric-card.d.ts +2 -2
- package/dist/types/components/navigation/navigation.d.ts +1 -1
- package/dist/types/components/next/emotion-registry.d.ts +3 -5
- package/dist/types/components/now-playing/now-playing.d.ts +2 -2
- package/dist/types/components/password-field/password-field.d.ts +1 -1
- package/dist/types/components/progress/progress.d.ts +1 -1
- package/dist/types/components/select/select.d.ts +1 -1
- package/dist/types/components/sheet-stack/sheet-stack.d.ts +19 -16
- package/dist/types/components/signature-pad/signature-pad.d.ts +2 -2
- package/dist/types/components/split-button/split-button.d.ts +3 -4
- package/dist/types/components/swipe-actions/swipe-actions.d.ts +1 -2
- package/dist/types/components/tag-input/tag-input.d.ts +2 -3
- package/dist/types/components/theme-root/theme-root.d.ts +5 -6
- package/dist/types/components/theme-switch/theme-switch.d.ts +3 -3
- package/dist/types/components/time-picker/time-picker.d.ts +2 -2
- package/dist/types/components/timeline/timeline.d.ts +4 -4
- package/dist/types/components/toast/toast.d.ts +3 -3
- package/dist/types/components/tree-view/tree-view.d.ts +4 -3
- package/dist/types/components/typewriter-terminal/index.d.ts +2 -0
- package/dist/types/components/typewriter-terminal/typewriter-terminal.d.ts +87 -0
- package/dist/types/components/usage-meter/usage-meter.d.ts +4 -4
- package/dist/types/components/usage-meter/usage-model.d.ts +1 -1
- package/dist/types/components/user-menu/user-menu.d.ts +3 -4
- package/dist/types/index.d.ts +5 -0
- package/dist/types/styling/motion-timings.d.ts +5 -0
- package/dist/types/styling/sx.d.ts +1 -1
- package/dist/types/styling/theme.d.ts +13 -0
- package/dist/types/utils/initials.d.ts +2 -0
- package/dist/typewriter-terminal-BUEsMzo3.js +588 -0
- package/dist/typewriter-terminal.js +2 -0
- package/dist/{user-menu-DzELTg1x.js → user-menu-Czrrk93A.js} +1 -1
- package/dist/user-menu.js +1 -1
- package/package.json +22 -2
- package/dist/avatar-B6idYC59.js +0 -146
- package/dist/locale-switcher-CZF7XNYG.js +0 -295
|
@@ -0,0 +1,375 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { i as e } from "./css-BYJhdGh-.js";
|
|
3
|
+
import { n as t } from "./focus-ring-BK5W5_NY.js";
|
|
4
|
+
import { n, r } from "./media-8yrN85VT.js";
|
|
5
|
+
import { t as i } from "./sx-BJXJ2xJK.js";
|
|
6
|
+
import { t as a } from "./visually-hidden-DgVO3NaB.js";
|
|
7
|
+
import { t as o } from "./renderable-DzcIj1Lo.js";
|
|
8
|
+
import { t as s } from "./icon-wrapper-C-zMD0uL.js";
|
|
9
|
+
import { t as c } from "./trigger-style-CtOrdPk4.js";
|
|
10
|
+
import { o as l, r as u, s as d } from "./listbox-style-DNOxAulu.js";
|
|
11
|
+
import { a as f, i as p, l as m, r as h, s as g, u as _ } from "./menu-CVzpsyXn.js";
|
|
12
|
+
import { useEffect as v, useId as y } from "react";
|
|
13
|
+
import { vars as b } from "@jfrader/tokens/vars";
|
|
14
|
+
import { Fragment as x, jsx as S, jsxs as C } from "@emotion/react/jsx-runtime";
|
|
15
|
+
import { useMergeRefs as w } from "@floating-ui/react";
|
|
16
|
+
//#region src/components/locale-switcher/locale-switcher.tsx
|
|
17
|
+
var T = "LocaleSwitcher", E = "✓", D = e({
|
|
18
|
+
display: "inline-flex",
|
|
19
|
+
alignItems: "center",
|
|
20
|
+
minInlineSize: 0,
|
|
21
|
+
maxInlineSize: "100%",
|
|
22
|
+
fontFamily: b.font.sans,
|
|
23
|
+
lineHeight: b.lineHeight.tight,
|
|
24
|
+
color: b.color.text
|
|
25
|
+
}), O = {
|
|
26
|
+
sm: e({ fontSize: b.textSize.sm }),
|
|
27
|
+
md: e({ fontSize: b.textSize.sm }),
|
|
28
|
+
lg: e({ fontSize: b.textSize.md })
|
|
29
|
+
}, k = e({
|
|
30
|
+
gap: b.space[2],
|
|
31
|
+
maxInlineSize: "100%",
|
|
32
|
+
fontSize: "inherit",
|
|
33
|
+
whiteSpace: "nowrap"
|
|
34
|
+
}), A = {
|
|
35
|
+
sm: e({
|
|
36
|
+
minBlockSize: b.space[8],
|
|
37
|
+
paddingInline: b.space[3]
|
|
38
|
+
}),
|
|
39
|
+
md: e({
|
|
40
|
+
minBlockSize: b.space[10],
|
|
41
|
+
paddingInline: b.space[4]
|
|
42
|
+
}),
|
|
43
|
+
lg: e({
|
|
44
|
+
minBlockSize: b.space[12],
|
|
45
|
+
paddingInline: b.space[5]
|
|
46
|
+
})
|
|
47
|
+
}, j = e({
|
|
48
|
+
display: "inline-flex",
|
|
49
|
+
transitionProperty: "transform",
|
|
50
|
+
transitionDuration: b.motion.duration.fast,
|
|
51
|
+
transitionTimingFunction: b.motion.easeStandard,
|
|
52
|
+
"& svg": {
|
|
53
|
+
inlineSize: "1em",
|
|
54
|
+
blockSize: "1em"
|
|
55
|
+
},
|
|
56
|
+
"[aria-expanded=\"true\"] > &": { transform: "rotate(180deg)" },
|
|
57
|
+
[r]: { transitionDuration: "0s" }
|
|
58
|
+
}), M = e({
|
|
59
|
+
gap: b.space[2],
|
|
60
|
+
textDecoration: "none",
|
|
61
|
+
"&[aria-current=\"true\"]": { fontWeight: b.fontWeight.medium }
|
|
62
|
+
}), N = e({ marginInlineStart: "auto" }), P = e({
|
|
63
|
+
display: "flex",
|
|
64
|
+
flexWrap: "wrap",
|
|
65
|
+
alignItems: "center",
|
|
66
|
+
gap: b.space[3],
|
|
67
|
+
margin: 0,
|
|
68
|
+
padding: 0,
|
|
69
|
+
listStyle: "none"
|
|
70
|
+
}), F = e({
|
|
71
|
+
display: "inline-flex",
|
|
72
|
+
alignItems: "center",
|
|
73
|
+
minBlockSize: b.space[8],
|
|
74
|
+
borderRadius: b.radius.sm
|
|
75
|
+
}), I = e({
|
|
76
|
+
color: b.color.accentText,
|
|
77
|
+
textDecoration: "underline",
|
|
78
|
+
textUnderlineOffset: "0.2em",
|
|
79
|
+
transitionProperty: "color",
|
|
80
|
+
transitionDuration: b.motion.duration.fast,
|
|
81
|
+
transitionTimingFunction: b.motion.easeStandard,
|
|
82
|
+
"&:hover": { color: b.color.text },
|
|
83
|
+
"&:focus-visible": { ...t },
|
|
84
|
+
[r]: { transitionDuration: "0s" }
|
|
85
|
+
}), L = e({
|
|
86
|
+
color: b.color.text,
|
|
87
|
+
fontWeight: b.fontWeight.medium
|
|
88
|
+
}), R = e({
|
|
89
|
+
display: "inline-flex",
|
|
90
|
+
alignItems: "center",
|
|
91
|
+
gap: `calc(${b.space[1]} / 2)`,
|
|
92
|
+
margin: 0,
|
|
93
|
+
padding: `calc(${b.space[1]} * 0.75)`,
|
|
94
|
+
listStyle: "none",
|
|
95
|
+
border: `1px solid ${b.color.borderControl}`,
|
|
96
|
+
borderRadius: b.radius.full,
|
|
97
|
+
backgroundColor: b.color.surfaceRaised,
|
|
98
|
+
"& > li": { display: "flex" },
|
|
99
|
+
[n]: { borderColor: "CanvasText" }
|
|
100
|
+
}), z = e({
|
|
101
|
+
justifyContent: "center",
|
|
102
|
+
boxSizing: "border-box",
|
|
103
|
+
borderRadius: b.radius.full,
|
|
104
|
+
whiteSpace: "nowrap"
|
|
105
|
+
}), B = {
|
|
106
|
+
sm: e({
|
|
107
|
+
minBlockSize: b.space[6],
|
|
108
|
+
minInlineSize: b.space[10],
|
|
109
|
+
paddingInline: b.space[2]
|
|
110
|
+
}),
|
|
111
|
+
md: e({
|
|
112
|
+
minBlockSize: b.space[8],
|
|
113
|
+
minInlineSize: b.space[12],
|
|
114
|
+
paddingInline: b.space[3]
|
|
115
|
+
}),
|
|
116
|
+
lg: e({
|
|
117
|
+
minBlockSize: b.space[10],
|
|
118
|
+
minInlineSize: `calc(${b.space[12]} + ${b.space[2]})`,
|
|
119
|
+
paddingInline: b.space[3]
|
|
120
|
+
})
|
|
121
|
+
}, V = e({
|
|
122
|
+
color: b.color.textMuted,
|
|
123
|
+
textDecoration: "none",
|
|
124
|
+
transitionProperty: "color",
|
|
125
|
+
transitionDuration: b.motion.duration.fast,
|
|
126
|
+
transitionTimingFunction: b.motion.easeStandard,
|
|
127
|
+
"&:hover": { color: b.color.text },
|
|
128
|
+
"&:focus-visible": { ...t },
|
|
129
|
+
[r]: { transitionDuration: "0s" }
|
|
130
|
+
}), H = e({
|
|
131
|
+
backgroundColor: b.color.accent,
|
|
132
|
+
color: b.color.accentContrast,
|
|
133
|
+
fontWeight: b.fontWeight.medium,
|
|
134
|
+
[n]: {
|
|
135
|
+
forcedColorAdjust: "none",
|
|
136
|
+
backgroundColor: "SelectedItem",
|
|
137
|
+
color: "SelectedItemText"
|
|
138
|
+
}
|
|
139
|
+
}), U = /* @__PURE__ */ C("svg", {
|
|
140
|
+
viewBox: "0 0 24 24",
|
|
141
|
+
fill: "none",
|
|
142
|
+
stroke: "currentColor",
|
|
143
|
+
strokeWidth: "2",
|
|
144
|
+
strokeLinecap: "round",
|
|
145
|
+
focusable: "false",
|
|
146
|
+
children: [/* @__PURE__ */ S("circle", {
|
|
147
|
+
cx: "12",
|
|
148
|
+
cy: "12",
|
|
149
|
+
r: "9"
|
|
150
|
+
}), /* @__PURE__ */ S("path", { d: "M3 12h18M12 3c2.5 2.5 3.75 5.5 3.75 9S14.5 18.5 12 21c-2.5-2.5-3.75-5.5-3.75-9S9.5 5.5 12 3Z" })]
|
|
151
|
+
}), W = /* @__PURE__ */ S("svg", {
|
|
152
|
+
viewBox: "0 0 16 16",
|
|
153
|
+
fill: "none",
|
|
154
|
+
stroke: "currentColor",
|
|
155
|
+
strokeWidth: "1.5",
|
|
156
|
+
strokeLinecap: "round",
|
|
157
|
+
strokeLinejoin: "round",
|
|
158
|
+
children: /* @__PURE__ */ S("path", { d: "M4 6l4 4 4-4" })
|
|
159
|
+
});
|
|
160
|
+
function G({ option: e, current: t, link: n, adornment: r, ...i }) {
|
|
161
|
+
let o = /* @__PURE__ */ C(x, { children: [e.label, r] }), s = e.ariaLabel ? /* @__PURE__ */ C(x, { children: [
|
|
162
|
+
o,
|
|
163
|
+
" ",
|
|
164
|
+
/* @__PURE__ */ S("span", {
|
|
165
|
+
css: a,
|
|
166
|
+
children: e.ariaLabel
|
|
167
|
+
})
|
|
168
|
+
] }) : o, c = {
|
|
169
|
+
...i,
|
|
170
|
+
lang: e.lang,
|
|
171
|
+
dir: "auto",
|
|
172
|
+
"aria-current": t ? "true" : void 0,
|
|
173
|
+
children: s
|
|
174
|
+
};
|
|
175
|
+
if (!n) return /* @__PURE__ */ S("span", { ...c });
|
|
176
|
+
let l = {
|
|
177
|
+
...c,
|
|
178
|
+
href: e.href,
|
|
179
|
+
hrefLang: e.lang
|
|
180
|
+
};
|
|
181
|
+
return e.render ? e.render(l) : /* @__PURE__ */ S("a", { ...l });
|
|
182
|
+
}
|
|
183
|
+
function K({ styles: e, slot: t, ...n }) {
|
|
184
|
+
return /* @__PURE__ */ S(i, {
|
|
185
|
+
className: t?.className,
|
|
186
|
+
styles: [
|
|
187
|
+
F,
|
|
188
|
+
e,
|
|
189
|
+
t?.css
|
|
190
|
+
],
|
|
191
|
+
children: (e) => /* @__PURE__ */ S(G, {
|
|
192
|
+
...n,
|
|
193
|
+
"data-ui": "locale-switcher-option",
|
|
194
|
+
className: e
|
|
195
|
+
})
|
|
196
|
+
});
|
|
197
|
+
}
|
|
198
|
+
function q({ options: e, value: t, current: n, size: r, triggerLabel: i, icon: v, open: b, defaultOpen: w, onOpenChange: D, placement: O, slotProps: P }) {
|
|
199
|
+
let F = y(), I = `${F}-action`, L = `${F}-current`, { className: R, css: z, ...B } = P?.trigger ?? {}, { className: V, css: H, ...U } = P?.content ?? {}, K = P?.option;
|
|
200
|
+
return /* @__PURE__ */ C(p, {
|
|
201
|
+
open: b,
|
|
202
|
+
defaultOpen: w,
|
|
203
|
+
onOpenChange: D,
|
|
204
|
+
placement: O,
|
|
205
|
+
children: [/* @__PURE__ */ C(g, {
|
|
206
|
+
...B,
|
|
207
|
+
"aria-labelledby": m(i ? I : void 0, n ? L : void 0),
|
|
208
|
+
family: T,
|
|
209
|
+
marker: "locale-switcher-trigger",
|
|
210
|
+
styles: [
|
|
211
|
+
c,
|
|
212
|
+
k,
|
|
213
|
+
A[r],
|
|
214
|
+
z
|
|
215
|
+
],
|
|
216
|
+
className: R,
|
|
217
|
+
children: [
|
|
218
|
+
i && /* @__PURE__ */ S("span", {
|
|
219
|
+
id: I,
|
|
220
|
+
css: a,
|
|
221
|
+
children: i
|
|
222
|
+
}),
|
|
223
|
+
o(v) && /* @__PURE__ */ S("span", {
|
|
224
|
+
"aria-hidden": "true",
|
|
225
|
+
css: s,
|
|
226
|
+
children: v
|
|
227
|
+
}),
|
|
228
|
+
n && /* @__PURE__ */ C("span", {
|
|
229
|
+
id: L,
|
|
230
|
+
lang: n.lang,
|
|
231
|
+
dir: "auto",
|
|
232
|
+
children: [n.label, n.ariaLabel && /* @__PURE__ */ C(x, { children: [" ", /* @__PURE__ */ S("span", {
|
|
233
|
+
css: a,
|
|
234
|
+
children: n.ariaLabel
|
|
235
|
+
})] })]
|
|
236
|
+
}),
|
|
237
|
+
/* @__PURE__ */ S("span", {
|
|
238
|
+
"aria-hidden": "true",
|
|
239
|
+
css: j,
|
|
240
|
+
children: W
|
|
241
|
+
})
|
|
242
|
+
]
|
|
243
|
+
}), /* @__PURE__ */ S(h, {
|
|
244
|
+
...U,
|
|
245
|
+
family: T,
|
|
246
|
+
marker: "locale-switcher-menu",
|
|
247
|
+
styles: [
|
|
248
|
+
d,
|
|
249
|
+
l,
|
|
250
|
+
H
|
|
251
|
+
],
|
|
252
|
+
className: V,
|
|
253
|
+
defaultLabelledBy: i ? I : void 0,
|
|
254
|
+
children: e.map((e) => {
|
|
255
|
+
let n = e.value === t;
|
|
256
|
+
return /* @__PURE__ */ S(f, {
|
|
257
|
+
family: T,
|
|
258
|
+
marker: "locale-switcher-option",
|
|
259
|
+
styles: [
|
|
260
|
+
_,
|
|
261
|
+
M,
|
|
262
|
+
K?.css
|
|
263
|
+
],
|
|
264
|
+
className: K?.className,
|
|
265
|
+
render: (t) => /* @__PURE__ */ S(G, {
|
|
266
|
+
...t,
|
|
267
|
+
option: e,
|
|
268
|
+
current: n,
|
|
269
|
+
link: !0,
|
|
270
|
+
adornment: n && /* @__PURE__ */ S("span", {
|
|
271
|
+
"aria-hidden": "true",
|
|
272
|
+
css: [u, N],
|
|
273
|
+
children: E
|
|
274
|
+
})
|
|
275
|
+
})
|
|
276
|
+
}, e.value);
|
|
277
|
+
})
|
|
278
|
+
})]
|
|
279
|
+
});
|
|
280
|
+
}
|
|
281
|
+
function J({ options: e, value: t, slotProps: n }) {
|
|
282
|
+
let r = e.find((e) => e.value !== t);
|
|
283
|
+
return r ? /* @__PURE__ */ S(K, {
|
|
284
|
+
option: r,
|
|
285
|
+
current: !1,
|
|
286
|
+
link: !0,
|
|
287
|
+
styles: I,
|
|
288
|
+
slot: n?.option
|
|
289
|
+
}) : null;
|
|
290
|
+
}
|
|
291
|
+
function Y({ options: e, value: t, slotProps: n, listStyles: r, linkStyles: i, currentStyles: a }) {
|
|
292
|
+
return /* @__PURE__ */ S("ul", {
|
|
293
|
+
css: r,
|
|
294
|
+
children: e.map((e) => {
|
|
295
|
+
let r = e.value === t;
|
|
296
|
+
return /* @__PURE__ */ S("li", { children: /* @__PURE__ */ S(K, {
|
|
297
|
+
option: e,
|
|
298
|
+
current: r,
|
|
299
|
+
link: !r,
|
|
300
|
+
styles: r ? a : i,
|
|
301
|
+
slot: n?.option
|
|
302
|
+
}) }, e.value);
|
|
303
|
+
})
|
|
304
|
+
});
|
|
305
|
+
}
|
|
306
|
+
function X(e) {
|
|
307
|
+
return /* @__PURE__ */ S(Y, {
|
|
308
|
+
...e,
|
|
309
|
+
listStyles: P,
|
|
310
|
+
linkStyles: I,
|
|
311
|
+
currentStyles: L
|
|
312
|
+
});
|
|
313
|
+
}
|
|
314
|
+
function Z(e) {
|
|
315
|
+
let t = [z, B[e.size]];
|
|
316
|
+
return /* @__PURE__ */ S(Y, {
|
|
317
|
+
...e,
|
|
318
|
+
listStyles: R,
|
|
319
|
+
linkStyles: [t, V],
|
|
320
|
+
currentStyles: [t, H]
|
|
321
|
+
});
|
|
322
|
+
}
|
|
323
|
+
var Q = {
|
|
324
|
+
menu: q,
|
|
325
|
+
swap: J,
|
|
326
|
+
inline: X,
|
|
327
|
+
segmented: Z
|
|
328
|
+
}, ee = {
|
|
329
|
+
menu: "div",
|
|
330
|
+
swap: "div",
|
|
331
|
+
inline: "nav",
|
|
332
|
+
segmented: "nav"
|
|
333
|
+
};
|
|
334
|
+
function $({ ref: e, options: t, value: n, variant: r = "menu", size: a = "md", triggerLabel: o, label: s, icon: c = U, open: l, defaultOpen: u, onOpenChange: d, placement: f, slotProps: p, className: m, sx: h, ...g }) {
|
|
335
|
+
let _ = w([e]), y = t.find((e) => e.value === n), b = t.length, x = y !== void 0, C = !!o;
|
|
336
|
+
v(() => {
|
|
337
|
+
process.env.NODE_ENV !== "production" && (x || console.warn(`LocaleSwitcher: value "${n}" matches no option.`), r === "swap" && b !== 2 && console.warn(`LocaleSwitcher: the swap variant expects exactly two options and got ${b}; it links to the first option that is not current.`), r === "menu" && !C && console.warn("LocaleSwitcher: the menu variant needs a triggerLabel that names its action."));
|
|
338
|
+
}, [
|
|
339
|
+
r,
|
|
340
|
+
n,
|
|
341
|
+
x,
|
|
342
|
+
b,
|
|
343
|
+
C
|
|
344
|
+
]);
|
|
345
|
+
let T = ee[r], E = Q[r];
|
|
346
|
+
return /* @__PURE__ */ S(i, {
|
|
347
|
+
className: m,
|
|
348
|
+
styles: [D, O[a]],
|
|
349
|
+
sx: h,
|
|
350
|
+
children: (e) => /* @__PURE__ */ S(T, {
|
|
351
|
+
...g,
|
|
352
|
+
ref: _,
|
|
353
|
+
"aria-label": g["aria-label"] ?? (T === "nav" ? s : void 0),
|
|
354
|
+
"data-ui": "locale-switcher",
|
|
355
|
+
"data-variant": r,
|
|
356
|
+
className: e,
|
|
357
|
+
children: /* @__PURE__ */ S(E, {
|
|
358
|
+
options: t,
|
|
359
|
+
value: n,
|
|
360
|
+
current: y,
|
|
361
|
+
size: a,
|
|
362
|
+
triggerLabel: o,
|
|
363
|
+
icon: c,
|
|
364
|
+
open: l,
|
|
365
|
+
defaultOpen: u,
|
|
366
|
+
onOpenChange: d,
|
|
367
|
+
placement: f,
|
|
368
|
+
slotProps: p
|
|
369
|
+
})
|
|
370
|
+
})
|
|
371
|
+
});
|
|
372
|
+
}
|
|
373
|
+
$.displayName = "LocaleSwitcher";
|
|
374
|
+
//#endregion
|
|
375
|
+
export { $ as t };
|
package/dist/locale-switcher.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
export { t as LocaleSwitcher } from "./locale-switcher-
|
|
2
|
+
export { t as LocaleSwitcher } from "./locale-switcher-DTkySKsM.js";
|
|
@@ -4,7 +4,7 @@ import { n as t } from "./media-8yrN85VT.js";
|
|
|
4
4
|
import { n } from "./roving-focus-CYlo_Kf8.js";
|
|
5
5
|
import { t as r } from "./visually-hidden-DgVO3NaB.js";
|
|
6
6
|
import { t as i } from "./button-C6OV0C7J.js";
|
|
7
|
-
import { t as a } from "./avatar-
|
|
7
|
+
import { t as a } from "./avatar-BuM1zB_f.js";
|
|
8
8
|
import { n as o, o as s, s as c, t as l } from "./listbox-style-DNOxAulu.js";
|
|
9
9
|
import { t as u } from "./overlay-portal-C9igMHnC.js";
|
|
10
10
|
import { t as d } from "./part-id-D0zksy32.js";
|
|
@@ -9,7 +9,7 @@ import { t as c } from "./use-controlled-state-DpeVQZNR.js";
|
|
|
9
9
|
import { t as l } from "./visually-hidden-DgVO3NaB.js";
|
|
10
10
|
import { t as u } from "./renderable-DzcIj1Lo.js";
|
|
11
11
|
import { t as d } from "./icon-wrapper-C-zMD0uL.js";
|
|
12
|
-
import { t as f } from "./avatar-
|
|
12
|
+
import { t as f } from "./avatar-BuM1zB_f.js";
|
|
13
13
|
import { t as p } from "./part-id-D0zksy32.js";
|
|
14
14
|
import { useEffect as ee, useId as te, useLayoutEffect as ne, useMemo as m, useRef as h, useState as re } from "react";
|
|
15
15
|
import { vars as g } from "@jfrader/tokens/vars";
|
package/dist/timeline.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
export { t as Timeline } from "./timeline-
|
|
2
|
+
export { t as Timeline } from "./timeline-BPKY94mT.js";
|
|
@@ -10,10 +10,10 @@ export interface ActivityMetric {
|
|
|
10
10
|
label: string;
|
|
11
11
|
/** Positive target; nonpositive or nonfinite goals render the metric as unavailable. */
|
|
12
12
|
goal: number;
|
|
13
|
-
/**
|
|
13
|
+
/** Unit supported by `Intl.NumberFormat` (`'kilometer'`, `'minute'`, `'hour'`, …); otherwise use `formatValue`. */
|
|
14
14
|
unit?: string;
|
|
15
15
|
tone?: ActivityTone;
|
|
16
|
-
/** Formats amounts for units Intl does not
|
|
16
|
+
/** Formats amounts for units Intl does not support. Use Intl in the formatter. */
|
|
17
17
|
formatValue?: (value: number, locale: string | undefined) => string;
|
|
18
18
|
}
|
|
19
19
|
export interface ActivityDay {
|
|
@@ -61,9 +61,8 @@ interface ActivityRingsSlotProps {
|
|
|
61
61
|
/** Metric slot props shared by the toggle-button and plain-row legend elements. */
|
|
62
62
|
export type ActivityRingsMetricProps = Pick<ActivityRingsPartProps<'button'> & ActivityRingsPartProps<'div'>, keyof ActivityRingsPartProps<'button'> & keyof ActivityRingsPartProps<'div'>>;
|
|
63
63
|
/**
|
|
64
|
-
* The metric slot targets
|
|
65
|
-
*
|
|
66
|
-
* both when the flag is a runtime boolean.
|
|
64
|
+
* The metric slot targets a toggle button when `interactiveLegend` is `true`, or a row when false
|
|
65
|
+
* or omitted. A runtime boolean accepts only props shared by both elements.
|
|
67
66
|
*/
|
|
68
67
|
type LegendMode = {
|
|
69
68
|
/** Legend rows become toggle buttons that isolate one ring. */
|
|
@@ -103,10 +102,9 @@ export type ActivityRingsProps = Omit<ComponentPropsWithRef<'section'>, 'childre
|
|
|
103
102
|
hideLegend?: boolean;
|
|
104
103
|
};
|
|
105
104
|
/**
|
|
106
|
-
*
|
|
107
|
-
*
|
|
108
|
-
*
|
|
109
|
-
* (Enter/Space isolate one ring).
|
|
105
|
+
* Compare each metric with its goal using the UsageMeter value rules. The SVG is decorative;
|
|
106
|
+
* the legend gives amounts, goals, and percentages. The optional day picker uses native radios
|
|
107
|
+
* with arrows and Home/End. Enable legend toggle buttons to isolate a ring with Enter/Space.
|
|
110
108
|
*/
|
|
111
109
|
export declare function ActivityRings({ ref, metrics, values: valuesProp, days: daysProp, value, defaultValue, onValueChange, focusedMetric, defaultFocusedMetric, onFocusedMetricChange, interactiveLegend, onRingClose, size, locale, labels: labelsProp, hideLegend, slotProps, className, sx, 'aria-label': ariaLabel, 'aria-labelledby': labelledBy, ...rest }: ActivityRingsProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
112
110
|
export declare namespace ActivityRings {
|
|
@@ -13,6 +13,8 @@ export interface AvatarProps extends Omit<ComponentPropsWithRef<'span'>, 'childr
|
|
|
13
13
|
src?: string;
|
|
14
14
|
size?: AvatarSize;
|
|
15
15
|
status?: AvatarStatus;
|
|
16
|
+
/** Pulse the presence ring only when `status="online"`. Defaults to `false`. */
|
|
17
|
+
pulse?: boolean;
|
|
16
18
|
/** Spoken status word; defaults to the `status` value. Pass a translated word for other locales. */
|
|
17
19
|
statusLabel?: string;
|
|
18
20
|
slotProps?: {
|
|
@@ -21,7 +23,7 @@ export interface AvatarProps extends Omit<ComponentPropsWithRef<'span'>, 'childr
|
|
|
21
23
|
status?: AvatarPartProps;
|
|
22
24
|
};
|
|
23
25
|
}
|
|
24
|
-
export declare function Avatar({ ref, name, src, size, status, statusLabel, slotProps, className, sx, ...rest }: AvatarProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
26
|
+
export declare function Avatar({ ref, name, src, size, status, pulse, statusLabel, slotProps, className, sx, ...rest }: AvatarProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
25
27
|
export declare namespace Avatar {
|
|
26
28
|
var displayName: string;
|
|
27
29
|
}
|
|
@@ -14,7 +14,7 @@ export interface AvatarGroupPartProps {
|
|
|
14
14
|
css?: Interpolation<Theme>;
|
|
15
15
|
}
|
|
16
16
|
export interface AvatarGroupProps extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'role'>, SxProps {
|
|
17
|
-
/**
|
|
17
|
+
/** People in display order. Treat this array as immutable. */
|
|
18
18
|
members: readonly AvatarGroupMember[];
|
|
19
19
|
/** Maximum number of visible people; overflow does not consume a person slot. Defaults to 4. */
|
|
20
20
|
max?: number;
|
|
@@ -22,7 +22,7 @@ export interface AvatarGroupProps extends Omit<ComponentPropsWithRef<'div'>, 'ch
|
|
|
22
22
|
size?: AvatarSize;
|
|
23
23
|
/** Fallback accessible name for the group landmark. Defaults to 'Team members'. */
|
|
24
24
|
label?: string;
|
|
25
|
-
/** Locale for
|
|
25
|
+
/** Locale for counts. Set it for SSR; otherwise uses the environment's Intl locale. */
|
|
26
26
|
locale?: Intl.LocalesArgument;
|
|
27
27
|
/** Formats the accessible name of the overflow image. Defaults to English plural wording. */
|
|
28
28
|
getOverflowLabel?: (hidden: number, formatted: string) => string;
|
|
@@ -34,7 +34,7 @@ export interface AvatarGroupProps extends Omit<ComponentPropsWithRef<'div'>, 'ch
|
|
|
34
34
|
overflow?: AvatarGroupPartProps;
|
|
35
35
|
summary?: AvatarGroupPartProps;
|
|
36
36
|
};
|
|
37
|
-
/**
|
|
37
|
+
/** Style overrides for each Avatar. Cannot override id/name/status. */
|
|
38
38
|
avatarProps?: Pick<AvatarProps, 'slotProps' | 'sx' | 'className'>;
|
|
39
39
|
}
|
|
40
40
|
export declare function AvatarGroup({ ref, members, max, size, label, locale, getOverflowLabel, getSummaryLabel, slotProps, avatarProps, className, sx, ...rest }: AvatarGroupProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
@@ -20,15 +20,15 @@ export interface ButtonProps extends Omit<ComponentPropsWithRef<'button'>, 'colo
|
|
|
20
20
|
/** Consumer style overrides, merged after the component's own styles. */
|
|
21
21
|
css?: Interpolation<Theme>;
|
|
22
22
|
/**
|
|
23
|
-
* Replaces the native button. Spread
|
|
24
|
-
*
|
|
25
|
-
*
|
|
26
|
-
*
|
|
23
|
+
* Replaces the native button. Spread all supplied props onto the element and attach the supplied
|
|
24
|
+
* ref. Both refs target that element, even when it is not a button. The public ref type remains
|
|
25
|
+
* HTMLButtonElement for compatibility.
|
|
26
|
+
* Your handlers, className, and style override the supplied ones. Compose handlers to keep both:
|
|
27
27
|
* `onClick={(e) => { p.onClick?.(e); mine(e); }}`.
|
|
28
|
-
*
|
|
28
|
+
* This render path joins data-ui markers into a token list. Library selectors should use
|
|
29
29
|
* `[data-ui~="button"]`. The default button always has data-ui="button".
|
|
30
|
-
* Disabled anchors receive aria-disabled and
|
|
31
|
-
*
|
|
30
|
+
* Disabled anchors receive aria-disabled and stay focusable. The supplied handler blocks primary
|
|
31
|
+
* click and Enter activation; it does not block auxiliary or middle-click navigation.
|
|
32
32
|
*/
|
|
33
33
|
render?: (props: ButtonRenderProps) => ReactNode;
|
|
34
34
|
}
|
|
@@ -18,7 +18,10 @@ export interface CardSlotProps {
|
|
|
18
18
|
}
|
|
19
19
|
export interface CardProps extends ComponentPropsWithRef<'div'>, SxProps {
|
|
20
20
|
variant?: CardVariant;
|
|
21
|
-
/**
|
|
21
|
+
/**
|
|
22
|
+
* `contrast` uses the dark palette with a charcoal surface on any page theme.
|
|
23
|
+
* Omit this prop or use `default` to keep the enclosing theme.
|
|
24
|
+
*/
|
|
22
25
|
appearance?: SurfaceAppearance;
|
|
23
26
|
slotProps?: CardSlotProps;
|
|
24
27
|
}
|
|
@@ -45,8 +45,8 @@ export interface ChipGroupMultipleProps extends ChipGroupBaseProps {
|
|
|
45
45
|
onValueChange?: (value: string[]) => void;
|
|
46
46
|
}
|
|
47
47
|
export type ChipGroupProps = ChipGroupSingleProps | ChipGroupMultipleProps;
|
|
48
|
-
/**
|
|
49
|
-
* Enter/Space toggle. Multiple values are
|
|
48
|
+
/** Choose and clear filters. Arrows and Home/End move focus; horizontal arrows reverse in RTL.
|
|
49
|
+
* Enter/Space toggle selection. Multiple values are reported in option order. */
|
|
50
50
|
export declare function ChipGroup({ ref, options, type, value: valueProp, defaultValue, onValueChange, label, allowEmpty, disabled, size, maxVisible, expanded: expandedProp, defaultExpanded, onExpandedChange, locale, moreLabel, lessLabel, slotProps, className, sx, onKeyDown, onBlur, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, ...rest }: ChipGroupProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
51
51
|
export declare namespace ChipGroup {
|
|
52
52
|
var displayName: string;
|
|
@@ -12,14 +12,14 @@ export interface ComboboxProps {
|
|
|
12
12
|
onOpenChange?: (open: boolean) => void;
|
|
13
13
|
/** Renders a hidden input so the value takes part in native form submission. */
|
|
14
14
|
name?: string;
|
|
15
|
-
/**
|
|
15
|
+
/** Matches an option label to the query. Defaults to a case-insensitive substring match. */
|
|
16
16
|
filter?: (label: string, query: string) => boolean;
|
|
17
17
|
/** Fires with the new input text when the user types and when a selection or Escape writes a label. */
|
|
18
18
|
onInputChange?: (query: string) => void;
|
|
19
19
|
children?: ReactNode;
|
|
20
20
|
}
|
|
21
21
|
export interface ComboboxInputProps extends Omit<TextFieldProps, 'value' | 'defaultValue' | 'onValueChange'> {
|
|
22
|
-
/** Root `name`
|
|
22
|
+
/** Root `name` submits the selected value. Input `name` submits an extra text entry. */
|
|
23
23
|
name?: string;
|
|
24
24
|
/** Controlled input text. */
|
|
25
25
|
inputValue?: string;
|
|
@@ -6,7 +6,7 @@ export interface CommandPaletteProps {
|
|
|
6
6
|
onOpenChange?: (open: boolean) => void;
|
|
7
7
|
/** Accessible name of the dialog, input and listbox. */
|
|
8
8
|
label?: string;
|
|
9
|
-
/**
|
|
9
|
+
/** Matches an item's label or keywords to the query. Defaults to a case-insensitive substring match. */
|
|
10
10
|
filter?: (text: string, query: string) => boolean;
|
|
11
11
|
/** Rendered by CommandPalette.Empty when nothing matches. */
|
|
12
12
|
emptyMessage?: ReactNode;
|
|
@@ -8,7 +8,7 @@ export type CommentReaction = ThreadReaction;
|
|
|
8
8
|
export type CommentThreadSize = ThreadSize;
|
|
9
9
|
export type CommentThreadHeadingLevel = 2 | 3 | 4 | 5 | 6;
|
|
10
10
|
export type CommentThreadPartProps = ThreadPartProps;
|
|
11
|
-
/**
|
|
11
|
+
/** Describes a proposed change. `parentId` is the reply's attachment point after applying `maxDepth`. */
|
|
12
12
|
export type CommentThreadEvent = {
|
|
13
13
|
type: 'reply';
|
|
14
14
|
comment: ThreadComment;
|
|
@@ -65,9 +65,9 @@ export interface CommentThreadLabels extends ThreadReactionLabels {
|
|
|
65
65
|
}
|
|
66
66
|
type CommentThreadPart = 'header' | 'title' | 'list' | 'item' | 'article' | 'time' | 'body' | 'replies' | 'actions' | 'reaction' | 'composer' | 'resolved' | 'status';
|
|
67
67
|
export type CommentThreadSlotProps = Partial<Record<CommentThreadPart, CommentThreadPartProps>> & {
|
|
68
|
-
/**
|
|
68
|
+
/** Textarea props for every composer and editor. Handlers are combined with the thread's handlers. */
|
|
69
69
|
textarea?: ThreadTextareaProps;
|
|
70
|
-
/**
|
|
70
|
+
/** Button props for Send/Save. `onClick` runs first and can call `preventDefault()`. */
|
|
71
71
|
send?: ThreadButtonProps;
|
|
72
72
|
};
|
|
73
73
|
export interface CommentThreadProps extends Omit<ComponentPropsWithRef<'section'>, 'defaultValue' | 'onChange' | 'children' | 'title'>, SxProps {
|
|
@@ -76,7 +76,7 @@ export interface CommentThreadProps extends Omit<ComponentPropsWithRef<'section'
|
|
|
76
76
|
defaultValue?: readonly ThreadComment[];
|
|
77
77
|
/** The full proposed tree plus what changed. */
|
|
78
78
|
onValueChange?: (next: ThreadComment[], event: CommentThreadEvent) => void;
|
|
79
|
-
/**
|
|
79
|
+
/** Determines whose comments can be edited. Enforce authorization on the server. */
|
|
80
80
|
currentUser: CommentAuthor;
|
|
81
81
|
/** Mention candidates; defaults to every author plus `currentUser`. Deduped by id. */
|
|
82
82
|
people?: readonly CommentAuthor[];
|
|
@@ -15,17 +15,17 @@ export interface CopyButtonSlotProps {
|
|
|
15
15
|
export interface CopyButtonProps extends Omit<ComponentPropsWithRef<'button'>, 'children' | 'value' | 'defaultValue' | 'color' | 'type'>, SxProps {
|
|
16
16
|
/** The string written to the clipboard. An empty string is a valid payload. */
|
|
17
17
|
text: string;
|
|
18
|
-
/** Accessible name and idle
|
|
18
|
+
/** Accessible name and label while idle, e.g. "Copy command". */
|
|
19
19
|
label: string;
|
|
20
|
-
/**
|
|
20
|
+
/** Label and announcement while copying. */
|
|
21
21
|
pendingLabel: string;
|
|
22
|
-
/**
|
|
22
|
+
/** Label and announcement after copying succeeds. */
|
|
23
23
|
copiedLabel: string;
|
|
24
|
-
/**
|
|
24
|
+
/** Label and announcement when copying fails or is unavailable. */
|
|
25
25
|
errorLabel: string;
|
|
26
26
|
/** Hides the visible label; the accessible name and announcements stay. */
|
|
27
27
|
iconOnly?: boolean;
|
|
28
|
-
/**
|
|
28
|
+
/** Icon for each state. A supplied key replaces the default; `null` removes it. */
|
|
29
29
|
icons?: CopyButtonIcons;
|
|
30
30
|
value?: CopyButtonValue;
|
|
31
31
|
defaultValue?: CopyButtonValue;
|
|
@@ -34,7 +34,7 @@ export interface CopyButtonProps extends Omit<ComponentPropsWithRef<'button'>, '
|
|
|
34
34
|
onCopied?: (text: string) => void;
|
|
35
35
|
/** Called once per failed write, including a missing Clipboard API. */
|
|
36
36
|
onCopyError?: (error: unknown) => void;
|
|
37
|
-
/** Milliseconds before `copied`/`error` request `idle`; 0 keeps the result
|
|
37
|
+
/** Milliseconds before `copied`/`error` request `idle`; 0 keeps the result label. */
|
|
38
38
|
resetAfterMs?: number;
|
|
39
39
|
variant?: ButtonVariant;
|
|
40
40
|
tone?: ButtonTone;
|
|
@@ -20,7 +20,7 @@ export interface CountdownProps extends Omit<ComponentPropsWithRef<'div'>, 'chil
|
|
|
20
20
|
pendingLabel?: ReactNode;
|
|
21
21
|
invalidLabel?: ReactNode;
|
|
22
22
|
invalidText?: string;
|
|
23
|
-
/**
|
|
23
|
+
/** Clock source in epoch milliseconds. Background callbacks run when execution next becomes possible. */
|
|
24
24
|
clock?: () => number;
|
|
25
25
|
/** Shared server snapshot for identical SSR and hydration output. */
|
|
26
26
|
initialNow?: number;
|
|
@@ -30,7 +30,7 @@ export interface CountdownProps extends Omit<ComponentPropsWithRef<'div'>, 'chil
|
|
|
30
30
|
completionIcon?: ReactNode;
|
|
31
31
|
slotProps?: Partial<Record<'label' | 'content' | 'unit' | 'number' | 'complete' | 'icon' | 'description', CountdownPartProps>>;
|
|
32
32
|
}
|
|
33
|
-
/**
|
|
33
|
+
/** Show an ARIA timer without controls. Tab and other keys pass through; it cannot be focused or edited. */
|
|
34
34
|
export declare function Countdown({ ref, target, variant, units, label, locale, unitDisplay, completeLabel, completeText, pendingLabel, invalidLabel, invalidText, clock, initialNow, onComplete, announceCompletion, completionIcon, slotProps, className, sx, 'aria-labelledby': externalLabel, 'aria-describedby': externalDescription, 'aria-label': ariaLabel, ...rest }: CountdownProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
35
35
|
export declare namespace Countdown {
|
|
36
36
|
var displayName: string;
|