@alfadocs/ui-kit 1.42.0 → 1.43.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.
Files changed (27) hide show
  1. package/dist/_chunks/{calendar-workspace-qlxrxCqm.js → calendar-workspace-DhXqqu-D.js} +2 -2
  2. package/dist/_chunks/control-room-rail-Cv7GpMqX.js +354 -0
  3. package/dist/_chunks/{marketplace-app-shell-D_g9BaDI.js → marketplace-app-shell-DdwPj03y.js} +3 -3
  4. package/dist/_chunks/{sidebar-ClTY9lLI.js → sidebar-DbZXLl8h.js} +2 -2
  5. package/dist/_chunks/tab-bar-Cw9UK18Z.js +228 -0
  6. package/dist/_chunks/{tool-rail-D89USYE6.js → tool-rail-CCFqDfAn.js} +282 -276
  7. package/dist/_chunks/use-edge-resize-BHesP0kg.js +149 -0
  8. package/dist/_chunks/use-scroll-overflow-UbLrUfBo.js +72 -0
  9. package/dist/agent-catalog.json +1 -1
  10. package/dist/components/control-room-rail/control-room-rail.d.ts +9 -0
  11. package/dist/components/control-room-rail/index.js +1 -1
  12. package/dist/components/sidebar/index.js +1 -1
  13. package/dist/components/tab-bar/index.js +1 -1
  14. package/dist/components/tool-rail/index.js +1 -1
  15. package/dist/components/tool-rail/tool-rail.d.ts +16 -0
  16. package/dist/hooks/index.d.ts +2 -0
  17. package/dist/hooks/index.js +35 -32
  18. package/dist/hooks/use-edge-resize.d.ts +13 -1
  19. package/dist/index.js +5 -5
  20. package/dist/patterns/calendar/index.js +1 -1
  21. package/dist/patterns/marketplace-app-shell/index.js +1 -1
  22. package/dist/tokens.css +1 -1
  23. package/package.json +1 -1
  24. package/dist/_chunks/control-room-rail-CnNZusR5.js +0 -337
  25. package/dist/_chunks/tab-bar-rDkLiaA6.js +0 -268
  26. package/dist/_chunks/use-edge-resize-ZnGG7gyO.js +0 -139
  27. package/dist/_chunks/use-overflow-collapse-BIOzKbni.js +0 -32
@@ -13,7 +13,7 @@ import { C as yr } from "./check-DrFSN__t.js";
13
13
  import { S as fs } from "./stethoscope-sZXGC43m.js";
14
14
  import { C as si } from "./clock-Drd4Wtis.js";
15
15
  import { a as Nr } from "./entity-card-I-Gio5wo.js";
16
- import { C as Eo, a as Ro, u as xr, d as Mo } from "./control-room-rail-CnNZusR5.js";
16
+ import { C as Eo, a as Ro, u as xr, d as Mo } from "./control-room-rail-Cv7GpMqX.js";
17
17
  import { S as ii } from "./scroll-area-BZOvUhwQ.js";
18
18
  import { d as Gn, c as _i, b as St } from "./toast-ZZfhA5u0.js";
19
19
  import { T as ca, a as Oo } from "./tooltip-Cp-PLePW.js";
@@ -11389,4 +11389,4 @@ export {
11389
11389
  jp as r,
11390
11390
  Pn as u
11391
11391
  };
11392
- //# sourceMappingURL=calendar-workspace-qlxrxCqm.js.map
11392
+ //# sourceMappingURL=calendar-workspace-DhXqqu-D.js.map
@@ -0,0 +1,354 @@
1
+ import { jsx as T, jsxs as U, Fragment as go } from "react/jsx-runtime";
2
+ import { useState as E, useCallback as p, useMemo as b, useRef as X, useContext as N, useId as vo, useEffect as ho, createContext as To, forwardRef as bo } from "react";
3
+ import { useTranslation as Co } from "react-i18next";
4
+ import { I as Y } from "./icon-button-CehAeZoP.js";
5
+ import { a as xo } from "./panel-header-D_mTdhUp.js";
6
+ import { T as yo } from "./tool-rail-CCFqDfAn.js";
7
+ import { u as Z } from "./use-persistent-state-nZwZAnE9.js";
8
+ import { S as Ao } from "./star-Bf9L2Uot.js";
9
+ import { X as So } from "./x-B5YnXwCz.js";
10
+ const wo = {
11
+ id: "control-room-rail",
12
+ capabilities: ["open", "close", "select_single"],
13
+ state: {
14
+ activeToolId: {
15
+ type: "string | null",
16
+ descriptionKey: "ui.toolRail.agent.state.activeToolId",
17
+ description: "Id of the tool whose panel is currently open, or null when the rail is collapsed to its strip. No panel content is ever exposed.",
18
+ read: (t) => t.getActiveToolId()
19
+ }
20
+ },
21
+ actions: {
22
+ open: {
23
+ // Pure ephemeral panel state (open) — no data loss, no external effect.
24
+ safety: "read",
25
+ argsType: "{ id: string }",
26
+ argsSchema: {
27
+ type: "object",
28
+ properties: { id: { type: "string" } },
29
+ required: ["id"]
30
+ },
31
+ idempotent: !0,
32
+ descriptionKey: "ui.toolRail.agent.actions.open",
33
+ description: "Open the given tool's panel.",
34
+ examples: [{ args: { id: "inbox" }, note: "Open the inbox tool panel." }],
35
+ invoke: (t, n) => {
36
+ t.open(n.id);
37
+ }
38
+ },
39
+ close: {
40
+ safety: "read",
41
+ idempotent: !0,
42
+ descriptionKey: "ui.toolRail.agent.actions.close",
43
+ description: "Collapse the rail to its strip (no active tool).",
44
+ invoke: (t) => {
45
+ t.close();
46
+ }
47
+ },
48
+ select_tool: {
49
+ safety: "read",
50
+ argsType: "{ id: string | null }",
51
+ argsSchema: {
52
+ type: "object",
53
+ properties: { id: { type: ["string", "null"] } },
54
+ required: ["id"]
55
+ },
56
+ idempotent: !0,
57
+ descriptionKey: "ui.toolRail.agent.actions.selectTool",
58
+ description: "Set the active tool by id (opens its panel), or pass null to collapse.",
59
+ invoke: (t, n) => {
60
+ t.setActiveTool(n.id);
61
+ }
62
+ }
63
+ },
64
+ domHooks: {
65
+ root: {
66
+ attr: "data-component",
67
+ value: "control-room-rail",
68
+ description: "Marks the ControlRoomRail wrapper."
69
+ },
70
+ instanceId: {
71
+ attr: "data-component-id",
72
+ sourceProp: "id",
73
+ description: "Sourced from the id prop. Required to address a specific rail from the agent."
74
+ },
75
+ item: {
76
+ attr: "data-tool-id",
77
+ description: "Stable tool id emitted on each strip IconButton. The active icon also carries data-active set to its id."
78
+ }
79
+ }
80
+ }, M = To(null);
81
+ function Oo({
82
+ globalTools: t = [],
83
+ children: n
84
+ }) {
85
+ const [c, s] = E(
86
+ () => /* @__PURE__ */ new Map()
87
+ ), f = p(
88
+ (l, i) => {
89
+ s((u) => {
90
+ const j = new Map(u);
91
+ return j.set(l, i), j;
92
+ });
93
+ },
94
+ []
95
+ ), V = p((l) => {
96
+ s((i) => {
97
+ if (!i.has(l)) return i;
98
+ const u = new Map(i);
99
+ return u.delete(l), u;
100
+ });
101
+ }, []), m = b(
102
+ () => Array.from(c.values()).flat(),
103
+ [c]
104
+ ), h = X(null), P = p((l) => {
105
+ h.current = l;
106
+ }, []), R = p((l) => {
107
+ var i;
108
+ (i = h.current) == null || i.setActiveTool(l);
109
+ }, []), A = p(() => {
110
+ var l;
111
+ (l = h.current) == null || l.setActiveTool(null);
112
+ }, []), C = b(
113
+ () => ({
114
+ globalTools: t,
115
+ contextualTools: m,
116
+ registerContextualTools: f,
117
+ unregisterContextualTools: V,
118
+ registerRail: P,
119
+ openTool: R,
120
+ closeTool: A
121
+ }),
122
+ [
123
+ t,
124
+ m,
125
+ f,
126
+ V,
127
+ P,
128
+ R,
129
+ A
130
+ ]
131
+ );
132
+ return /* @__PURE__ */ T(M.Provider, { value: C, children: n });
133
+ }
134
+ function Eo(t) {
135
+ const n = N(M), c = n == null ? void 0 : n.registerContextualTools, s = n == null ? void 0 : n.unregisterContextualTools, f = vo();
136
+ ho(() => {
137
+ if (!(!c || !s))
138
+ return c(f, t), () => s(f);
139
+ }, [c, s, f, t]);
140
+ }
141
+ function ko() {
142
+ const t = N(M);
143
+ return b(() => {
144
+ if (!t) return [];
145
+ const n = t.contextualTools.map((s) => ({
146
+ ...s,
147
+ scope: "contextual"
148
+ })), c = t.globalTools.map((s) => ({
149
+ ...s,
150
+ scope: "global"
151
+ }));
152
+ return [...n, ...c];
153
+ }, [t]);
154
+ }
155
+ function Xo() {
156
+ const t = N(M), n = p(() => {
157
+ }, []);
158
+ return {
159
+ openTool: (t == null ? void 0 : t.openTool) ?? n,
160
+ closeTool: (t == null ? void 0 : t.closeTool) ?? n
161
+ };
162
+ }
163
+ function Mo() {
164
+ const t = N(M), n = p((c) => {
165
+ }, []);
166
+ return (t == null ? void 0 : t.registerRail) ?? n;
167
+ }
168
+ const $o = bo(function({
169
+ tools: n,
170
+ railLabel: c,
171
+ reorderable: s = !0,
172
+ favoriteIds: f,
173
+ defaultFavoriteIds: V,
174
+ pinnedFavoriteIds: m,
175
+ onFavoriteIdsChange: h,
176
+ persistFavoritesKey: P = "ui.controlRoom.favorites",
177
+ activeToolId: R,
178
+ defaultActiveToolId: A = null,
179
+ onActiveToolChange: C,
180
+ panelWidth: l,
181
+ onPanelWidthChange: i,
182
+ persistPanelWidthKey: u,
183
+ ...j
184
+ }, S) {
185
+ const { t: g } = Co(), [F, W] = E(
186
+ R ?? A ?? null
187
+ ), $ = R !== void 0 ? R : F, I = p(
188
+ (o) => {
189
+ R === void 0 && W(o), C == null || C(o);
190
+ },
191
+ [R, C]
192
+ ), oo = ko(), x = n ?? oo, _ = f !== void 0, [to, eo] = Z(
193
+ P,
194
+ () => V ?? x.filter((o) => o.scope === "global").map((o) => o.id),
195
+ { disabled: _ }
196
+ ), B = _ ? f : to, w = b(() => m != null && m.length ? [
197
+ ...m,
198
+ ...B.filter((o) => !m.includes(o))
199
+ ] : B, [m, B]), H = l !== void 0, [no, D] = Z(u ?? "ui.controlRoom.panelWidth.unused", null, {
200
+ disabled: H || !u
201
+ }), ro = H ? l : u ? no : void 0, so = p(
202
+ (o) => {
203
+ !H && u && D(o), i == null || i(o);
204
+ },
205
+ [
206
+ H,
207
+ u,
208
+ D,
209
+ i
210
+ ]
211
+ ), d = b(() => {
212
+ const o = /* @__PURE__ */ new Map();
213
+ for (const r of x) o.set(r.id, r);
214
+ return o;
215
+ }, [x]), k = b(
216
+ () => new Set(w.filter((o) => d.has(o))),
217
+ [w, d]
218
+ ), G = (o) => {
219
+ const r = o(w.filter((e) => d.has(e)));
220
+ _ || eo((e) => o(e.filter((a) => d.has(a)))), h == null || h(r);
221
+ }, J = b(() => {
222
+ if (!s) return x;
223
+ const o = w.filter((e) => d.has(e)).map((e) => ({
224
+ ...d.get(e),
225
+ scope: "global",
226
+ reorderable: !0
227
+ })), r = x.filter((e) => !k.has(e.id)).map((e) => ({
228
+ ...e,
229
+ scope: "contextual",
230
+ reorderable: !0
231
+ }));
232
+ return [...o, ...r];
233
+ }, [s, x, w, d, k]), [lo, io] = E(""), L = X(!1), ao = (o, r) => {
234
+ const e = r ? g("controlRoom.pinnedAnnounce", {
235
+ tool: o,
236
+ defaultValue: "Pinned {{tool}} to favourites"
237
+ }) : g("controlRoom.unpinnedAnnounce", {
238
+ tool: o,
239
+ defaultValue: "Removed {{tool}} from favourites"
240
+ });
241
+ L.current = !L.current, io(L.current ? e : `${e}​`);
242
+ }, co = (o) => {
243
+ var r;
244
+ ao(((r = d.get(o)) == null ? void 0 : r.label) ?? o, !k.has(o)), G(
245
+ (e) => e.includes(o) ? e.filter((a) => a !== o) : [...e, o]
246
+ );
247
+ }, uo = (o, r) => {
248
+ var a;
249
+ const e = (a = J[o]) == null ? void 0 : a.id;
250
+ e !== void 0 && G((y) => {
251
+ const q = y.filter((v) => d.has(v)), z = q.length;
252
+ if (o < z) {
253
+ if (r >= z) return q.filter((Ro) => Ro !== e);
254
+ const v = q.slice();
255
+ return v.splice(o, 1), v.splice(r, 0, e), v;
256
+ }
257
+ if (r <= z) {
258
+ const v = q.slice();
259
+ return v.splice(Math.min(r, z), 0, e), v;
260
+ }
261
+ return y;
262
+ });
263
+ }, po = ({
264
+ tool: o,
265
+ from: r,
266
+ to: e
267
+ }) => {
268
+ const a = k.size, y = r < a;
269
+ return y && e >= a ? g("controlRoom.unpinnedAnnounce", {
270
+ tool: o.label,
271
+ defaultValue: "Removed {{tool}} from favourites"
272
+ }) : !y && e <= a ? g("controlRoom.pinnedAnnounce", {
273
+ tool: o.label,
274
+ defaultValue: "Pinned {{tool}} to favourites"
275
+ }) : y && e < a ? g("controlRoom.reorderAnnounce", {
276
+ tool: o.label,
277
+ to: e + 1,
278
+ total: a,
279
+ defaultValue: "{{tool}} moved to position {{to}} of {{total}}"
280
+ }) : "";
281
+ }, K = X(null), Q = Mo(), fo = p(
282
+ (o) => {
283
+ K.current = o, Q(o), typeof S == "function" ? S(o) : S && (S.current = o);
284
+ },
285
+ [Q, S]
286
+ ), O = $ != null ? d.get($) ?? null : null, mo = O ? /* @__PURE__ */ U(go, { children: [
287
+ s ? (() => {
288
+ const o = k.has(O.id);
289
+ return /* @__PURE__ */ T(
290
+ Y,
291
+ {
292
+ icon: /* @__PURE__ */ T(
293
+ Ao,
294
+ {
295
+ "aria-hidden": "true",
296
+ fill: o ? "currentColor" : "none",
297
+ className: o ? "ds:text-[color:var(--accent)]" : void 0
298
+ }
299
+ ),
300
+ intent: "ghost",
301
+ size: "sm",
302
+ "aria-pressed": o,
303
+ "aria-label": g("controlRoom.favorite", {
304
+ defaultValue: "Favourite"
305
+ }),
306
+ onClick: () => co(O.id)
307
+ }
308
+ );
309
+ })() : null,
310
+ /* @__PURE__ */ T(
311
+ Y,
312
+ {
313
+ icon: /* @__PURE__ */ T(So, { "aria-hidden": "true" }),
314
+ intent: "ghost",
315
+ size: "sm",
316
+ "aria-label": g("controlRoom.close", { defaultValue: "Close" }),
317
+ onClick: () => {
318
+ var o;
319
+ return (o = K.current) == null ? void 0 : o.close();
320
+ }
321
+ }
322
+ )
323
+ ] }) : null;
324
+ return /* @__PURE__ */ U(xo, { actions: mo, children: [
325
+ /* @__PURE__ */ T(
326
+ yo,
327
+ {
328
+ ref: fo,
329
+ dataComponent: "control-room-rail",
330
+ agentAdapter: wo,
331
+ tools: J,
332
+ activeToolId: R,
333
+ defaultActiveToolId: A,
334
+ onActiveToolChange: I,
335
+ panelWidth: ro,
336
+ onPanelWidthChange: so,
337
+ railLabel: c ?? g("controlRoom.railLabel", { defaultValue: "Control room" }),
338
+ onReorder: s ? uo : void 0,
339
+ formatReorderAnnouncement: s ? po : void 0,
340
+ ...j
341
+ }
342
+ ),
343
+ s ? /* @__PURE__ */ T("span", { role: "status", "aria-live": "polite", className: "ds:sr-only", children: lo }) : null
344
+ ] });
345
+ });
346
+ export {
347
+ Oo as C,
348
+ $o as a,
349
+ ko as b,
350
+ wo as c,
351
+ Eo as d,
352
+ Xo as u
353
+ };
354
+ //# sourceMappingURL=control-room-rail-Cv7GpMqX.js.map
@@ -7,11 +7,11 @@ import { A as S } from "./avatar-CkDeQOSI.js";
7
7
  import { A as F } from "./alert-CiQ5Pa3Q.js";
8
8
  import { C as w } from "./card-DPmk26CL.js";
9
9
  import { D as m } from "./dropdown-menu-DU-Hrf33.js";
10
- import { T as q } from "./tab-bar-rDkLiaA6.js";
10
+ import { T as q } from "./tab-bar-Cw9UK18Z.js";
11
11
  import { a as A, H as G, g as J, f as z, e as K, c as Q, d as U } from "./header-3o9o9v_T.js";
12
12
  import { H as X } from "./header-settings-CTe45iDy.js";
13
13
  import { S as Y } from "./sign-in-with-alfadocs-button-DWwBJtyE.js";
14
- import { S as Z, g as _, b as aa, a as ea, j as sa, k as ta, i as ra, h as I } from "./sidebar-ClTY9lLI.js";
14
+ import { S as Z, g as _, b as aa, a as ea, j as sa, k as ta, i as ra, h as I } from "./sidebar-DbZXLl8h.js";
15
15
  import { T as na } from "./theme-root-BOO73p5t.js";
16
16
  import { a as da } from "./tooltip-Cp-PLePW.js";
17
17
  import { u as ia } from "./use-theme-CAuo6EYT.js";
@@ -529,4 +529,4 @@ export {
529
529
  ka as M,
530
530
  g as P
531
531
  };
532
- //# sourceMappingURL=marketplace-app-shell-D_g9BaDI.js.map
532
+ //# sourceMappingURL=marketplace-app-shell-DdwPj03y.js.map
@@ -10,7 +10,7 @@ import { Slot as ls } from "@radix-ui/react-slot";
10
10
  import { c as T } from "./index-D2ZczOXr.js";
11
11
  import { useTranslation as A } from "react-i18next";
12
12
  import { u as cs } from "./registry-DvAUVLHh.js";
13
- import { u as us } from "./use-edge-resize-ZnGG7gyO.js";
13
+ import { u as us } from "./use-edge-resize-BHesP0kg.js";
14
14
  import { c as ms } from "./compose-refs-C0k0tdqF.js";
15
15
  import { a as vs, b as ps, d as fs } from "./input-surface-xyERuLU_.js";
16
16
  import { X as gs } from "./x-B5YnXwCz.js";
@@ -1347,4 +1347,4 @@ export {
1347
1347
  Ss as s,
1348
1348
  N as u
1349
1349
  };
1350
- //# sourceMappingURL=sidebar-ClTY9lLI.js.map
1350
+ //# sourceMappingURL=sidebar-DbZXLl8h.js.map
@@ -0,0 +1,228 @@
1
+ import { jsx as a, jsxs as d, Fragment as D } from "react/jsx-runtime";
2
+ import { forwardRef as F, Fragment as O } from "react";
3
+ import { c } from "./index-D2ZczOXr.js";
4
+ import { useTranslation as E } from "react-i18next";
5
+ import { B as M } from "./badge-BudgzTe_.js";
6
+ import { D as o } from "./dropdown-menu-DU-Hrf33.js";
7
+ import { u as P } from "./use-media-query-CcAx5SMM.js";
8
+ import { u as Q, a as q } from "./use-scroll-overflow-UbLrUfBo.js";
9
+ import { C as G } from "./chevron-down-DWE7GSq9.js";
10
+ import { C as H } from "./check-DrFSN__t.js";
11
+ import { C as I } from "./chevron-left-B8cOyH-V.js";
12
+ import { C as J } from "./chevron-right-I9AeSxH2.js";
13
+ function K(r) {
14
+ return r > 99 ? "99+" : String(r);
15
+ }
16
+ const U = c("ds:shrink-0", {
17
+ variants: {
18
+ position: {
19
+ top: "ds:pt-[var(--spacing-md)]",
20
+ bottom: "ds:pb-[var(--spacing-md)]"
21
+ },
22
+ fill: {
23
+ false: "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
24
+ true: ""
25
+ }
26
+ },
27
+ defaultVariants: { position: "top", fill: !1 }
28
+ }), W = "ds:rounded-[var(--radius-lg)] ds:border ds:border-[color:var(--card-border)] ds:bg-[var(--card)]/80 ds:backdrop-blur-md ds:shadow-[var(--shadow-md)]", X = [
29
+ "ds:flex ds:[justify-content:safe_center] ds:overflow-x-auto ds:py-[var(--spacing-xs)]",
30
+ "ds:[--tabbar-mask-start:black] ds:[--tabbar-mask-end:black]",
31
+ "ds:ltr:data-[fade-start=true]:[--tabbar-mask-start:transparent]",
32
+ "ds:ltr:data-[fade-end=true]:[--tabbar-mask-end:transparent]",
33
+ "ds:rtl:data-[fade-start=true]:[--tabbar-mask-end:transparent]",
34
+ "ds:rtl:data-[fade-end=true]:[--tabbar-mask-start:transparent]",
35
+ "ds:[mask-image:linear-gradient(to_right,var(--tabbar-mask-start)_0,black_var(--tabbar-fade-distance,var(--spacing-lg)),black_calc(100%-var(--tabbar-fade-distance,var(--spacing-lg))),var(--tabbar-mask-end)_100%)]",
36
+ "ds:motion-reduce:[mask-image:none]",
37
+ "ds:[.theme-accessible_&]:[mask-image:none]",
38
+ "ds:forced-colors:[mask-image:none]"
39
+ ].join(" "), Y = c(
40
+ "ds:flex ds:items-stretch ds:gap-[var(--spacing-xs)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
41
+ {
42
+ variants: {
43
+ fill: { false: "ds:shrink-0", true: "ds:w-full" }
44
+ },
45
+ defaultVariants: { fill: !1 }
46
+ }
47
+ ), w = c(
48
+ "ds:group ds:flex ds:items-center ds:justify-center ds:gap-[var(--spacing-xs)] ds:min-h-[var(--min-target-size)] ds:rounded-[var(--radius-sm)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)] ds:whitespace-nowrap ds:cursor-pointer ds:appearance-none ds:border-0 ds:bg-transparent ds:text-[length:var(--font-size-sm)] ds:font-[var(--font-weight-regular)] ds:text-[color:var(--foreground)] ds:no-underline ds:hover:bg-[var(--muted)]/20 ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]",
49
+ {
50
+ variants: {
51
+ fill: {
52
+ // Responsive: label under the icon below `sm`, beside it at `sm`+.
53
+ false: "ds:flex-col ds:sm:flex-row ds:sm:gap-[var(--spacing-sm)]",
54
+ // Fill the bar, always icon-over-label. No `min-w-0`, so a tab never
55
+ // shrinks below its label (labels never overlap); if the full set can't
56
+ // fit, the pill scrolls instead.
57
+ true: "ds:flex-1 ds:basis-0 ds:flex-col"
58
+ }
59
+ },
60
+ defaultVariants: { fill: !1 }
61
+ }
62
+ ), N = "ds:inline-flex ds:items-center ds:text-[color:var(--accent)] ds:[&>svg]:size-4", Z = "ds:group-aria-[current=page]:underline ds:group-aria-[current=page]:decoration-2 ds:group-aria-[current=page]:decoration-[color:var(--accent)] ds:group-aria-[current=page]:underline-offset-[var(--spacing-xs)]", L = "ds:flex ds:w-full ds:items-center ds:gap-[var(--spacing-sm)] ds:min-h-[var(--min-target-size)] ds:rounded-[var(--radius-sm)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)] ds:cursor-pointer ds:appearance-none ds:border-0 ds:bg-transparent ds:text-[length:var(--font-size-sm)] ds:font-[var(--font-weight-regular)] ds:text-[color:var(--foreground)] ds:hover:bg-[var(--muted)]/20 ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]", y = "ds:absolute ds:top-px ds:bottom-px ds:z-10 ds:flex ds:min-w-[var(--min-target-size)] ds:items-center ds:cursor-pointer ds:appearance-none ds:border-0 ds:bg-transparent ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]", S = "ds:start-px ds:justify-start ds:ps-[var(--spacing-xs)]", ss = "ds:end-px ds:justify-end ds:pe-[var(--spacing-xs)]", z = "ds:size-4 ds:shrink-0 ds:text-[color:var(--accent)] ds:rtl:-scale-x-100", as = F(
63
+ ({
64
+ items: r,
65
+ id: B,
66
+ ariaLabel: f,
67
+ onSelect: n,
68
+ renderLink: u,
69
+ fill: t = !1,
70
+ position: T = "top",
71
+ collapseToMenu: p = !1,
72
+ className: v
73
+ }, $) => {
74
+ const { t: g } = E(), j = P("(max-width: 640px)"), { containerRef: A, contentRef: _, isOverflowing: R } = Q(p), b = p && (j || R), {
75
+ ref: V,
76
+ canScrollStart: m,
77
+ canScrollEnd: h,
78
+ scrollByPage: x
79
+ } = q(!b), e = r.find((s) => s.isActive) ?? r[0];
80
+ return /* @__PURE__ */ a(
81
+ "div",
82
+ {
83
+ ref: $,
84
+ "data-component": "tab-bar",
85
+ "data-component-id": B,
86
+ className: `${U({ position: T, fill: t })}${v ? ` ${v}` : ""}`,
87
+ children: /* @__PURE__ */ d("div", { className: "ds:relative", children: [
88
+ /* @__PURE__ */ a("div", { ref: A, className: W, children: b ? /* @__PURE__ */ a("nav", { "aria-label": f, className: "ds:w-full", children: /* @__PURE__ */ d(o.Root, { children: [
89
+ /* @__PURE__ */ d(o.Trigger, { className: L, children: [
90
+ e != null && e.icon ? /* @__PURE__ */ a("span", { "aria-hidden": "true", className: N, children: e.icon }) : null,
91
+ /* @__PURE__ */ a("span", { className: "ds:flex-1 ds:truncate ds:text-start", children: e == null ? void 0 : e.label }),
92
+ /* @__PURE__ */ a(
93
+ G,
94
+ {
95
+ "aria-hidden": "true",
96
+ className: "ds:size-4 ds:shrink-0 ds:text-[color:var(--muted-foreground)]"
97
+ }
98
+ )
99
+ ] }),
100
+ /* @__PURE__ */ a(
101
+ o.Content,
102
+ {
103
+ align: "start",
104
+ className: "ds:min-w-[12rem]",
105
+ children: r.map((s) => /* @__PURE__ */ a(
106
+ o.Item,
107
+ {
108
+ "data-tab-id": s.id,
109
+ startIcon: s.icon,
110
+ endIcon: s.isActive ? /* @__PURE__ */ a(
111
+ H,
112
+ {
113
+ "aria-hidden": "true",
114
+ className: "ds:text-[color:var(--accent)]"
115
+ }
116
+ ) : void 0,
117
+ "aria-current": s.isActive ? "page" : void 0,
118
+ onSelect: () => {
119
+ s.href ? window.location.assign(s.href) : n == null || n(s.id);
120
+ },
121
+ children: s.label
122
+ },
123
+ s.id
124
+ ))
125
+ }
126
+ )
127
+ ] }) }) : /* @__PURE__ */ a(
128
+ "div",
129
+ {
130
+ ref: V,
131
+ "data-fade-start": m ? "true" : void 0,
132
+ "data-fade-end": h ? "true" : void 0,
133
+ className: X,
134
+ children: /* @__PURE__ */ a(
135
+ "nav",
136
+ {
137
+ ref: _,
138
+ "aria-label": f,
139
+ className: Y({ fill: t }),
140
+ children: r.map((s) => {
141
+ const C = typeof s.badgeCount == "number" && s.badgeCount > 0 ? s.badgeCount : void 0, i = s.isActive ? "page" : void 0, l = /* @__PURE__ */ d(D, { children: [
142
+ s.icon ? /* @__PURE__ */ a("span", { "aria-hidden": "true", className: N, children: s.icon }) : null,
143
+ /* @__PURE__ */ d("span", { className: "ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
144
+ /* @__PURE__ */ a("span", { className: Z, children: s.label }),
145
+ C !== void 0 ? /* @__PURE__ */ a(M, { variant: "neutral", children: K(C) }) : null
146
+ ] })
147
+ ] });
148
+ if (s.href !== void 0) {
149
+ const k = w({ fill: t });
150
+ return u ? /* @__PURE__ */ a(O, { children: u({
151
+ href: s.href,
152
+ className: k,
153
+ children: l,
154
+ "aria-current": i,
155
+ "data-tab-id": s.id,
156
+ onClick: s.onClick
157
+ }) }, s.id) : /* @__PURE__ */ a(
158
+ "a",
159
+ {
160
+ href: s.href,
161
+ "data-tab-id": s.id,
162
+ "aria-current": i,
163
+ className: k,
164
+ ...s.onClick ? { onClick: s.onClick } : {},
165
+ children: l
166
+ },
167
+ s.id
168
+ );
169
+ }
170
+ return /* @__PURE__ */ a(
171
+ "button",
172
+ {
173
+ type: "button",
174
+ "data-tab-id": s.id,
175
+ "aria-current": i,
176
+ className: w({ fill: t }),
177
+ onClick: () => n == null ? void 0 : n(s.id),
178
+ children: l
179
+ },
180
+ s.id
181
+ );
182
+ })
183
+ }
184
+ )
185
+ }
186
+ ) }),
187
+ m ? /* @__PURE__ */ a(
188
+ "button",
189
+ {
190
+ type: "button",
191
+ "aria-label": g("navigation.tabBar.scrollBack"),
192
+ onClick: () => x(-1),
193
+ className: `${y} ${S}`,
194
+ children: /* @__PURE__ */ a(
195
+ I,
196
+ {
197
+ "aria-hidden": "true",
198
+ className: z
199
+ }
200
+ )
201
+ }
202
+ ) : null,
203
+ h ? /* @__PURE__ */ a(
204
+ "button",
205
+ {
206
+ type: "button",
207
+ "aria-label": g("navigation.tabBar.scrollForward"),
208
+ onClick: () => x(1),
209
+ className: `${y} ${ss}`,
210
+ children: /* @__PURE__ */ a(
211
+ J,
212
+ {
213
+ "aria-hidden": "true",
214
+ className: z
215
+ }
216
+ )
217
+ }
218
+ ) : null
219
+ ] })
220
+ }
221
+ );
222
+ }
223
+ );
224
+ as.displayName = "TabBar";
225
+ export {
226
+ as as T
227
+ };
228
+ //# sourceMappingURL=tab-bar-Cw9UK18Z.js.map