@photon-ai/pho-ui 2.15.0 → 2.17.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 (97) hide show
  1. package/dist/chunks/IconArrowsMinimize-BfPUGuCB.js +75 -0
  2. package/dist/chunks/IconArrowsMinimize-BfPUGuCB.js.map +1 -0
  3. package/dist/chunks/IconChevronUp-CrpWSgIl.js +11 -0
  4. package/dist/chunks/IconChevronUp-CrpWSgIl.js.map +1 -0
  5. package/dist/chunks/{bar-chart-BJfr3eyd.js → bar-chart-DIALC2_z.js} +2 -2
  6. package/dist/chunks/bar-chart-DIALC2_z.js.map +1 -0
  7. package/dist/chunks/basic-page-CogcwGx3.js +1749 -0
  8. package/dist/chunks/basic-page-CogcwGx3.js.map +1 -0
  9. package/dist/chunks/card-DhDwtSi9.js +56 -0
  10. package/dist/chunks/card-DhDwtSi9.js.map +1 -0
  11. package/dist/chunks/code-block-BuDIo8Q0.js +197 -0
  12. package/dist/chunks/code-block-BuDIo8Q0.js.map +1 -0
  13. package/dist/chunks/collapsible-if7ncPbI.js +28 -0
  14. package/dist/chunks/collapsible-if7ncPbI.js.map +1 -0
  15. package/dist/chunks/{command-Ck8IAgV7.js → command-CTYrSz9a.js} +2 -2
  16. package/dist/chunks/{command-Ck8IAgV7.js.map → command-CTYrSz9a.js.map} +1 -1
  17. package/dist/chunks/data-table-DcwCgXJU.js +293 -0
  18. package/dist/chunks/data-table-DcwCgXJU.js.map +1 -0
  19. package/dist/chunks/date-range-picker-DwFDUNRL.js +88 -0
  20. package/dist/chunks/date-range-picker-DwFDUNRL.js.map +1 -0
  21. package/dist/chunks/{dialog-BxKACOj5.js → dialog-BwfUFn6B.js} +2 -2
  22. package/dist/chunks/{dialog-BxKACOj5.js.map → dialog-BwfUFn6B.js.map} +1 -1
  23. package/dist/chunks/{filter-bar-Cjjq38xo.js → filter-bar-BsvdXwzc.js} +2 -2
  24. package/dist/chunks/{filter-bar-Cjjq38xo.js.map → filter-bar-BsvdXwzc.js.map} +1 -1
  25. package/dist/chunks/ghost-search-BvBFa9su.js +25 -0
  26. package/dist/chunks/ghost-search-BvBFa9su.js.map +1 -0
  27. package/dist/chunks/{line-chart-CUR3AxrR.js → line-chart-VuMYKzW3.js} +2 -2
  28. package/dist/chunks/{line-chart-CUR3AxrR.js.map → line-chart-VuMYKzW3.js.map} +1 -1
  29. package/dist/chunks/{log-list-0AXnjFrk.js → log-list-BERiO4UJ.js} +2 -2
  30. package/dist/chunks/{log-list-0AXnjFrk.js.map → log-list-BERiO4UJ.js.map} +1 -1
  31. package/dist/chunks/scroll-area-Zik8t1Mk.js +168 -0
  32. package/dist/chunks/scroll-area-Zik8t1Mk.js.map +1 -0
  33. package/dist/chunks/sidebar-DRPe5CAh.js +306 -0
  34. package/dist/chunks/sidebar-DRPe5CAh.js.map +1 -0
  35. package/dist/chunks/{toast-iSf6NuAS.js → toast-72Wwlzg9.js} +2 -2
  36. package/dist/chunks/{toast-iSf6NuAS.js.map → toast-72Wwlzg9.js.map} +1 -1
  37. package/dist/chunks/trace-Ba1RMBfk.js +1645 -0
  38. package/dist/chunks/trace-Ba1RMBfk.js.map +1 -0
  39. package/dist/chunks/use-measure-C-i54AC6.js +629 -0
  40. package/dist/chunks/use-measure-C-i54AC6.js.map +1 -0
  41. package/dist/components/bar-chart.js +1 -1
  42. package/dist/components/card.js +1 -1
  43. package/dist/components/code-block.js +1 -1
  44. package/dist/components/collapsible.js +2 -25
  45. package/dist/components/command.js +1 -1
  46. package/dist/components/data-table.js +9 -8
  47. package/dist/components/date-range-picker.js +10 -0
  48. package/dist/components/dialog.js +1 -1
  49. package/dist/components/filter-bar.js +1 -1
  50. package/dist/components/line-chart.js +1 -1
  51. package/dist/components/log-list.js +1 -1
  52. package/dist/components/scroll-area.js +1 -1
  53. package/dist/components/toast.js +1 -1
  54. package/dist/components/trace.js +41 -6
  55. package/dist/index.js +166 -121
  56. package/dist/primitives.js +2 -2
  57. package/dist/sections/basic-page.js +5 -5
  58. package/dist/sections/sidebar.js +9 -6
  59. package/dist/src/components/card/card.d.ts +5 -1
  60. package/dist/src/components/chart/scale.d.ts +6 -1
  61. package/dist/src/components/code-block/code-block.d.ts +24 -5
  62. package/dist/src/components/code-block/index.d.ts +1 -1
  63. package/dist/src/components/data-table/data-table.d.ts +54 -13
  64. package/dist/src/components/date-range-picker/date-range-picker.d.ts +31 -0
  65. package/dist/src/components/date-range-picker/index.d.ts +1 -0
  66. package/dist/src/components/scroll-area/scroll-area.d.ts +9 -1
  67. package/dist/src/components/trace/decorations.d.ts +32 -0
  68. package/dist/src/components/trace/index.d.ts +5 -2
  69. package/dist/src/components/trace/layout.d.ts +57 -29
  70. package/dist/src/components/trace/span-primitive.d.ts +168 -0
  71. package/dist/src/components/trace/span-tree.d.ts +148 -0
  72. package/dist/src/components/trace/trace.d.ts +98 -16
  73. package/dist/src/index.d.ts +1 -0
  74. package/dist/src/sections/basic-page/basic-page.d.ts +139 -29
  75. package/dist/src/sections/basic-page/index.d.ts +1 -1
  76. package/dist/src/sections/sidebar/index.d.ts +1 -1
  77. package/dist/src/sections/sidebar/sidebar.d.ts +72 -0
  78. package/dist/src/utils/ghost-search.d.ts +11 -0
  79. package/package.json +5 -1
  80. package/dist/chunks/bar-chart-BJfr3eyd.js.map +0 -1
  81. package/dist/chunks/basic-page-CVZT_zaH.js +0 -1611
  82. package/dist/chunks/basic-page-CVZT_zaH.js.map +0 -1
  83. package/dist/chunks/card-DSW3Uhag.js +0 -56
  84. package/dist/chunks/card-DSW3Uhag.js.map +0 -1
  85. package/dist/chunks/code-block-CdozzaHM.js +0 -139
  86. package/dist/chunks/code-block-CdozzaHM.js.map +0 -1
  87. package/dist/chunks/data-table-CHLJfGkS.js +0 -279
  88. package/dist/chunks/data-table-CHLJfGkS.js.map +0 -1
  89. package/dist/chunks/scroll-area-BO-9PMM7.js +0 -167
  90. package/dist/chunks/scroll-area-BO-9PMM7.js.map +0 -1
  91. package/dist/chunks/sidebar-DVzZsCts.js +0 -223
  92. package/dist/chunks/sidebar-DVzZsCts.js.map +0 -1
  93. package/dist/chunks/trace-CbH0IohX.js +0 -314
  94. package/dist/chunks/trace-CbH0IohX.js.map +0 -1
  95. package/dist/chunks/use-measure-CMVgLouO.js +0 -616
  96. package/dist/chunks/use-measure-CMVgLouO.js.map +0 -1
  97. package/dist/components/collapsible.js.map +0 -1
@@ -1,1611 +0,0 @@
1
- "use client";
2
- import { t as p } from "./cn-ChIgwEl3.js";
3
- import { n as De } from "./link-provider-DXzDQ08N.js";
4
- import { FADE_ENTRANCE as it, FADE_SWAP as st, SPRING_ENTRANCE as lt, TRAVEL_LINEAR as ot, fadeThroughBlur as ee } from "../motion.js";
5
- import { a as ie, o as pe } from "./button-CdqS_t5a.js";
6
- import { t as ct } from "./error-D0yoFxCv.js";
7
- import { t as ae } from "./IconChevronLeft-CSWMKQ4C.js";
8
- import { t as ut } from "./IconChevronRight-CzoJnYNI.js";
9
- import { a as fe, i as dt, n as pt, r as ft, s as mt } from "./data-table-CHLJfGkS.js";
10
- import { t as Ee } from "./IconSearch-BKAHkLyX.js";
11
- import { t as ht } from "./IconX-pZ9vrtSr.js";
12
- import { t as gt } from "./toast-iSf6NuAS.js";
13
- import { t as le } from "./input-group-fc9_jD4d.js";
14
- import { t as bt } from "./animated-height-CCO-Ocoz.js";
15
- import { n as He, t as Q } from "./scroll-area-BO-9PMM7.js";
16
- import { i as yt } from "./checkbox-CLPmblNA.js";
17
- import { t as vt } from "./form-AiHbbw4m.js";
18
- import { i as W } from "./menu-BQeprfxB.js";
19
- import { Children as Y, Fragment as xt, createContext as z, isValidElement as Fe, useCallback as Ge, useContext as T, useEffect as L, useId as wt, useLayoutEffect as V, useMemo as $, useRef as _, useState as x, useSyncExternalStore as me } from "react";
20
- import { Fragment as he, jsx as t, jsxs as v } from "react/jsx-runtime";
21
- import { AnimatePresence as G, motion as N, useIsPresent as Nt, useReducedMotion as B } from "motion/react";
22
- import { Dialog as te } from "@base-ui/react/dialog";
23
- import { createPortal as Ce } from "react-dom";
24
- var ge = "rounded-base border border-pho-secondary bg-pho-primary", ne = "divide-y divide-pho-secondary [&>:has(+[data-basic-page-alert])]:border-b-0", ze = `${ge} ${ne}`, Se = "flex min-w-0 flex-col gap-3 rounded-base border border-pho-secondary bg-pho-page p-5", At = "flex min-h-[4.25rem] min-w-0 flex-col gap-3 px-5 py-4 sm:flex-row sm:items-center sm:justify-between sm:gap-6", _t = "flex flex-col gap-3 px-5 py-4", Et = "-mx-5 -mb-4 flex items-center rounded-b-[calc(0.75rem-1px)] bg-pho-secondary py-1 pr-3 pl-5", Ct = "-mx-2 -mt-1.5 flex items-center rounded-sm bg-pho-secondary px-2 py-0.5", P = lt, M = it, q = 12, St = 768;
25
- function kt(e) {
26
- return Math.round(Math.min(Math.max(e * 0.4, 320), 448));
27
- }
28
- var Ve = z(null), $e = z(null);
29
- function Tt(e) {
30
- const [a, n] = x(null), [r, s] = x(!1), [l, o] = x(!1), [c, i] = x(() => ({
31
- width: typeof window > "u" ? 0 : window.innerWidth,
32
- height: null
33
- }));
34
- return V(() => {
35
- const d = e.current;
36
- if (!r || d == null) return;
37
- const f = we(d), u = () => {
38
- const h = d.offsetWidth, b = f?.clientHeight ?? null;
39
- i((g) => g.width === h && g.height === b ? g : {
40
- width: h,
41
- height: b
42
- });
43
- };
44
- if (u(), typeof ResizeObserver > "u") return;
45
- const m = new ResizeObserver(u);
46
- return m.observe(d), f != null && m.observe(f), () => m.disconnect();
47
- }, [e, r]), {
48
- host: $(() => ({
49
- slot: a,
50
- presentation: c.width >= St ? "panel" : "page",
51
- width: kt(c.width),
52
- paneHeight: c.height,
53
- setOpen: o,
54
- setPresent: s
55
- }), [a, c]),
56
- setSlot: n,
57
- open: l
58
- };
59
- }
60
- function Rt(e) {
61
- return e == null ? window.scrollY : e.scrollTop;
62
- }
63
- function ke(e, a) {
64
- e == null ? window.scrollTo({ top: a }) : e.scrollTop = a;
65
- }
66
- function Pt({ condense: e = !0, width: a, className: n, children: r, ref: s, ...l }) {
67
- const o = T(se)?.adopt ?? !1, c = T($e), [i, d] = x(!1), f = _(0), u = Ge((H) => {
68
- f.current += H ? 1 : -1, d(f.current > 0);
69
- }, []), m = a === "wide" || a == null && i, [h] = x(mt), b = _(null), [g, E] = x(null), [y, C] = x(null), w = $(() => ({
70
- setTitle: E,
71
- setTail: C
72
- }), []);
73
- L(() => {
74
- if (c != null)
75
- return c.setBack(y), () => c.setBack(null);
76
- }, [c, y]);
77
- const { host: S, setSlot: O, open: R } = Tt(b), I = R && S.presentation === "page", D = _(!1), j = _(0);
78
- V(() => {
79
- const H = b.current;
80
- if (I === D.current || H == null) return;
81
- D.current = I;
82
- const A = we(H);
83
- I ? (j.current = Rt(A), ke(A, 0)) : ke(A, j.current);
84
- }, [I]);
85
- const U = e ? /* @__PURE__ */ t(It, {
86
- title: g,
87
- tail: c == null ? y : null,
88
- silent: I || c != null
89
- }) : null, J = /* @__PURE__ */ t("div", {
90
- "data-basic-page-column": "",
91
- className: p("mx-auto flex w-full min-w-0 flex-1 flex-col px-5 pt-12 pb-12 *:min-w-0", m ? "max-w-[84rem] md:px-8" : "max-w-[44.5rem]", o || c != null ? "[&_[data-basic-page-back]]:hidden" : "has-[[data-basic-page-back]]:pt-16"),
92
- children: e ? /* @__PURE__ */ t(ye.Provider, {
93
- value: w,
94
- children: r
95
- }) : r
96
- });
97
- return /* @__PURE__ */ t("div", {
98
- "data-basic-page-root": "",
99
- "data-basic-page-width": m ? "wide" : void 0,
100
- className: p("relative flex min-h-full w-full min-w-0 flex-row", n),
101
- ...l,
102
- ref: (H) => {
103
- b.current = H, typeof s == "function" ? s(H) : s != null && (s.current = H);
104
- },
105
- children: /* @__PURE__ */ t(Ve.Provider, {
106
- value: S,
107
- children: /* @__PURE__ */ t(dt.Provider, {
108
- value: u,
109
- children: /* @__PURE__ */ v(fe.Provider, {
110
- value: h,
111
- children: [/* @__PURE__ */ v("div", {
112
- "data-basic-page-main": "",
113
- className: p("flex min-w-0 flex-1 flex-col", I && "hidden"),
114
- children: [U, J]
115
- }), /* @__PURE__ */ t("div", {
116
- ref: O,
117
- className: "contents"
118
- })]
119
- })
120
- })
121
- })
122
- });
123
- }
124
- function It({ title: e, tail: a, silent: n = !1 }) {
125
- const r = B(), [s, l] = x(!1), o = T(se), c = wt();
126
- L(() => {
127
- if (o != null) {
128
- if (n) {
129
- o.store.clear(c);
130
- return;
131
- }
132
- o.store.set(c, {
133
- condensed: s,
134
- title: e?.label ?? null,
135
- back: a
136
- });
137
- }
138
- }, [
139
- o,
140
- c,
141
- s,
142
- e,
143
- a,
144
- n
145
- ]), L(() => {
146
- if (o != null)
147
- return () => o.store.clear(c);
148
- }, [o, c]);
149
- const i = e?.el ?? null;
150
- return L(() => {
151
- if (i == null || typeof IntersectionObserver > "u") return;
152
- const d = new IntersectionObserver(([f]) => l(f != null && !f.isIntersecting), { root: we(i) });
153
- return d.observe(i), () => d.disconnect();
154
- }, [i]), /* @__PURE__ */ t("div", {
155
- "data-basic-page-condense": "",
156
- className: "sticky top-0 z-20 h-0 overflow-visible",
157
- children: /* @__PURE__ */ t(G, { children: s && !(o?.adopt ?? !1) && /* @__PURE__ */ v(N.div, {
158
- initial: {
159
- opacity: 0,
160
- y: r ? 0 : Ie
161
- },
162
- animate: {
163
- opacity: 1,
164
- y: 0
165
- },
166
- exit: {
167
- opacity: 0,
168
- y: r ? 0 : Ie
169
- },
170
- transition: {
171
- ...xe,
172
- y: $t
173
- },
174
- className: "border-pho-secondary bg-pho-page/85 relative grid h-12 grid-cols-[1fr_minmax(0,auto)_1fr] items-center border-b px-3 backdrop-blur",
175
- children: [/* @__PURE__ */ t("div", {
176
- className: "flex min-w-0 items-center justify-start",
177
- children: a != null && /* @__PURE__ */ t(pe, {
178
- variant: "ghost",
179
- size: "sm",
180
- href: a.href,
181
- onClick: a.onClick,
182
- prefix: /* @__PURE__ */ t("span", {
183
- className: "inline-flex [&>svg]:size-[1.125em] [&>svg]:shrink-0",
184
- children: /* @__PURE__ */ t(ae, {})
185
- }),
186
- className: "min-w-max",
187
- children: a.label
188
- })
189
- }), /* @__PURE__ */ t("span", {
190
- className: "text-pho-primary block max-w-full min-w-0 truncate text-center text-base font-medium",
191
- children: e?.label
192
- })]
193
- }) })
194
- });
195
- }
196
- function Ot(e) {
197
- return e.normalize("NFKD").replace(/[\u0300-\u036f]/g, "").toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
198
- }
199
- function Lt(e) {
200
- if (!(typeof e != "string" && typeof e != "number"))
201
- return Ot(String(e)) || void 0;
202
- }
203
- function be(e, a) {
204
- if (e !== "")
205
- return e ?? Lt(a);
206
- }
207
- var Bt = (e) => `basic-page-morph-${e}`, Mt = { layout: P }, Te = 10, Re = {
208
- delay: 0.2,
209
- duration: 0.12,
210
- ease: "easeOut"
211
- }, Dt = {
212
- duration: 0.18,
213
- ease: "easeOut"
214
- }, Ht = -8, Ft = {
215
- duration: 0.16,
216
- ease: "easeOut"
217
- }, Gt = {
218
- delay: 0.14,
219
- duration: 0.16,
220
- ease: "easeOut"
221
- }, qe = {
222
- duration: 0.12,
223
- ease: "easeOut"
224
- }, K = [];
225
- function zt(e) {
226
- const a = _({ labels: e });
227
- a.current.labels = e, V(() => {
228
- const n = a.current;
229
- return K.push(n), () => {
230
- K.splice(K.indexOf(n), 1);
231
- };
232
- }, []);
233
- }
234
- function je() {
235
- const [e] = x(() => {
236
- const a = K[K.length - 1];
237
- return a ? { labels: [...a.labels] } : null;
238
- });
239
- return e;
240
- }
241
- var ye = z(null), ue = {
242
- condensed: !1,
243
- title: null,
244
- back: null
245
- }, se = z(null), ve = () => () => {
246
- }, Pe = () => ue;
247
- function Vt({ adopt: e = !0, children: a }) {
248
- const [n] = x(() => {
249
- let s = ue, l = null;
250
- const o = /* @__PURE__ */ new Set(), c = () => {
251
- for (const i of o) i();
252
- };
253
- return {
254
- get: () => s,
255
- set(i, d) {
256
- l = i, s = d, c();
257
- },
258
- clear(i) {
259
- l === i && (l = null, s = ue, c());
260
- },
261
- subscribe(i) {
262
- return o.add(i), () => o.delete(i);
263
- }
264
- };
265
- }), r = $(() => ({
266
- store: n,
267
- adopt: e
268
- }), [n, e]);
269
- return /* @__PURE__ */ t(se.Provider, {
270
- value: r,
271
- children: a
272
- });
273
- }
274
- function fn() {
275
- const e = T(se);
276
- return me(e?.store.subscribe ?? ve, e?.store.get ?? Pe, e?.store.get ?? Pe);
277
- }
278
- var xe = st, $t = ot, Ie = -8;
279
- function we(e) {
280
- if (typeof getComputedStyle != "function") return null;
281
- for (let a = e.parentElement; a != null && a !== document.body; a = a.parentElement) {
282
- const { overflowY: n } = getComputedStyle(a);
283
- if (n === "auto" || n === "scroll") return a;
284
- }
285
- return null;
286
- }
287
- var oe = /* @__PURE__ */ new Map(), qt = 96;
288
- function jt(e) {
289
- const a = e.closest("[data-basic-page-root]"), n = a?.querySelector("[data-basic-page-column]");
290
- return !a || !n ? 0 : n.getBoundingClientRect().left - a.getBoundingClientRect().left;
291
- }
292
- function We(e) {
293
- const [a] = x(() => {
294
- if (e == null) return !1;
295
- const r = oe.get(e);
296
- return r != null && r.visible && r.el.isConnected && jt(r.el) <= qt;
297
- }), n = _(null);
298
- return L(() => {
299
- if (e == null || typeof IntersectionObserver > "u") return;
300
- const r = n.current;
301
- if (!r) return;
302
- const s = new IntersectionObserver(([l]) => {
303
- l && oe.set(e, {
304
- visible: l.isIntersecting,
305
- el: r
306
- });
307
- });
308
- return s.observe(r), () => {
309
- s.disconnect(), oe.delete(e);
310
- };
311
- }, [e]), {
312
- fly: a,
313
- ref: n
314
- };
315
- }
316
- var Wt = {
317
- fade: {
318
- initial: { opacity: 0 },
319
- animate: { opacity: 1 },
320
- transition: { opacity: M }
321
- },
322
- rise: {
323
- initial: {
324
- opacity: 0,
325
- y: q
326
- },
327
- animate: {
328
- opacity: 1,
329
- y: 0
330
- },
331
- transition: {
332
- y: P,
333
- opacity: M
334
- }
335
- },
336
- slide: {
337
- initial: { x: "-100%" },
338
- animate: { x: 0 },
339
- transition: { x: Gt }
340
- }
341
- };
342
- function Ke({ morphId: e, fromClassName: a, fly: n, morphRef: r, arrival: s, className: l, children: o }) {
343
- const [c, i] = x(!1), d = !n && s != null ? Wt[s] : null;
344
- return /* @__PURE__ */ v(N.span, {
345
- ref: r,
346
- layoutId: Bt(e),
347
- initial: d?.initial,
348
- animate: d?.animate,
349
- transition: n ? Mt : {
350
- layout: { duration: 0 },
351
- ...d?.transition
352
- },
353
- onLayoutAnimationStart: () => {
354
- n && i(!0);
355
- },
356
- onLayoutAnimationComplete: () => i(!1),
357
- className: p("relative inline-block", l),
358
- children: [o, c && /* @__PURE__ */ t(N.span, {
359
- "aria-hidden": !0,
360
- initial: { opacity: 1 },
361
- animate: { opacity: 0 },
362
- transition: Dt,
363
- onAnimationComplete: () => i(!1),
364
- className: p("absolute inset-0", a),
365
- children: o
366
- })]
367
- });
368
- }
369
- var Oe = "max-w-full min-w-0 truncate align-top";
370
- function Kt({ id: e, morphId: a, enter: n, trailing: r, className: s, children: l, ...o }) {
371
- const c = be(e, l), i = B(), d = Ae(n === !0), f = We(a), u = je(), m = !i && (a != null || d === !0), h = d || u != null ? "rise" : void 0, b = T(ye), g = _(null);
372
- V(() => {
373
- if (b != null)
374
- return b.setTitle({
375
- label: l,
376
- el: g.current
377
- }), () => b.setTitle(null);
378
- }, [b, l]);
379
- const [E, y] = x(f.fly && u != null);
380
- V(() => {
381
- K.length > 0 && y(!1);
382
- }, []);
383
- const C = r != null && r !== !1, w = !i && (a != null ? f.fly || h != null : d === !0), S = a != null && !i ? /* @__PURE__ */ t(Ke, {
384
- morphId: a,
385
- fromClassName: "text-pho-secondary",
386
- fly: f.fly,
387
- morphRef: f.ref,
388
- arrival: h,
389
- className: Oe,
390
- children: l
391
- }) : d && !i ? /* @__PURE__ */ t(N.span, {
392
- initial: {
393
- opacity: 0,
394
- y: q
395
- },
396
- animate: {
397
- opacity: 1,
398
- y: 0
399
- },
400
- transition: {
401
- y: P,
402
- opacity: M
403
- },
404
- className: p("inline-block", Oe),
405
- children: l
406
- }) : C ? /* @__PURE__ */ t("span", {
407
- className: "min-w-0 truncate",
408
- children: l
409
- }) : l;
410
- return /* @__PURE__ */ v("h1", {
411
- id: c,
412
- "data-basic-page-title": "",
413
- className: p("text-display-base text-pho-primary max-w-full min-w-0 scroll-mt-12 px-5 font-medium", m ? "whitespace-nowrap" : "truncate", s),
414
- ...o,
415
- ref: (O) => {
416
- g.current = O;
417
- const R = o.ref;
418
- typeof R == "function" ? R(O) : R != null && (R.current = O);
419
- },
420
- children: [C ? /* @__PURE__ */ v("span", {
421
- className: "flex max-w-full min-w-0 items-center gap-2",
422
- children: [S, w ? /* @__PURE__ */ t(N.span, {
423
- "data-basic-page-title-trailing": "",
424
- initial: {
425
- opacity: 0,
426
- y: q
427
- },
428
- animate: {
429
- opacity: 1,
430
- y: 0
431
- },
432
- transition: {
433
- y: P,
434
- opacity: M
435
- },
436
- className: "shrink-0",
437
- children: r
438
- }) : /* @__PURE__ */ t("span", {
439
- "data-basic-page-title-trailing": "",
440
- className: "shrink-0",
441
- children: r
442
- })]
443
- }) : S, E && /* @__PURE__ */ t(N.span, {
444
- "aria-hidden": !0,
445
- initial: { opacity: 1 },
446
- animate: { opacity: 0 },
447
- transition: qe,
448
- onAnimationComplete: () => y(!1),
449
- className: p("text-pho-secondary pointer-events-none absolute inline-flex items-center", Ta),
450
- children: /* @__PURE__ */ t(ae, {})
451
- })]
452
- });
453
- }
454
- var Xe = z(!1);
455
- function Xt() {
456
- const e = T(Xe), a = B(), [n] = x(() => e && !a);
457
- return n;
458
- }
459
- var Qt = {
460
- height: 0,
461
- opacity: 0,
462
- paddingTop: 0,
463
- paddingBottom: 0,
464
- borderTopWidth: 0
465
- }, Yt = {
466
- y: P,
467
- opacity: M,
468
- height: P,
469
- paddingTop: P,
470
- paddingBottom: P,
471
- borderTopWidth: P
472
- };
473
- function Ne() {
474
- const e = Xt(), a = Nt(), n = B();
475
- return {
476
- initial: e ? {
477
- opacity: 0,
478
- y: q
479
- } : !1,
480
- animate: {
481
- opacity: 1,
482
- y: 0
483
- },
484
- exit: Qt,
485
- transition: n ? { duration: 0 } : Yt,
486
- leaving: !a
487
- };
488
- }
489
- var Ut = typeof process < "u" && process.env.NODE_ENV !== "production";
490
- function Qe(e, a, n, r) {
491
- L(() => {
492
- if (!Ut || e.current == null || typeof getComputedStyle != "function") return;
493
- const s = (o) => {
494
- const c = getComputedStyle(o).rowGap;
495
- return c === "" || c === "normal" ? null : parseFloat(c);
496
- }, l = s(e.current);
497
- l != null && l !== n && console.warn(`[BasicPage.${a}] spaced at ${l}px instead of ${n}px. Spacing is the system's: Stack gap-10 between blocks, a block gap-3, Fields gap-5. Remove the class and move the wrapper instead.`, e.current);
498
- for (const o of Array.from(e.current.children)) {
499
- const c = r(o);
500
- if (c == null || getComputedStyle(o).display === "contents") continue;
501
- const i = s(o);
502
- i != null && i !== c && console.warn(`[BasicPage.${a}] a child is spaced at ${i}px instead of ${c}px. Spacing is the system's: Stack gap-10 between blocks, a block gap-3, Fields gap-5. Remove the class and move the wrapper instead.`, o);
503
- }
504
- });
505
- }
506
- function Jt() {
507
- return typeof document > "u" ? !1 : Array.from(document.querySelectorAll("[data-basic-page-stack], [data-basic-page-title], [data-basic-page-header]")).some((e) => e.closest('[aria-busy="true"]') != null);
508
- }
509
- function Ae(e, a = !1) {
510
- const [n] = x(() => e && typeof document < "u" && (a || !Jt()));
511
- return n;
512
- }
513
- function Zt({ enter: e, className: a, children: n, ref: r, ...s }) {
514
- const l = B(), o = _(null);
515
- Qe(o, "Stack", 40, (m) => m.hasAttribute("data-basic-page-fields") ? 20 : 12);
516
- const c = Ae(e ?? !0, e === !0), i = s["aria-busy"], d = i === !0 || i === "true", f = _(d), u = f.current && !d;
517
- return L(() => {
518
- f.current = d;
519
- }), /* @__PURE__ */ t(N.div, {
520
- ref: (m) => {
521
- o.current = m, typeof r == "function" ? r(m) : r != null && (r.current = m);
522
- },
523
- "data-basic-page-stack": "",
524
- initial: l || !c ? !1 : {
525
- opacity: 0,
526
- y: q
527
- },
528
- animate: {
529
- opacity: 1,
530
- y: 0
531
- },
532
- transition: {
533
- y: P,
534
- opacity: M
535
- },
536
- className: p("mt-7 flex min-w-0 flex-col gap-10", "[&:has(>*:first-child:not([data-basic-page-callout])>[data-basic-page-header]:first-child)]:mt-6 [&:has(>*:first-child:not([data-basic-page-callout])>h2:first-child)]:mt-6 [&:has(>[data-basic-page-header]:first-child)]:mt-6 [&:has(>h2:first-child)]:mt-6", "*:flex *:min-w-0 *:flex-col [&>*:not([data-basic-page-fields])]:gap-3", a),
537
- ...s,
538
- children: /* @__PURE__ */ t(Xe.Provider, {
539
- value: u,
540
- children: n
541
- })
542
- });
543
- }
544
- var Le = "@container grid min-w-0 grid-cols-[minmax(0,1fr)_auto_auto] mb-3 [&>:not([data-basic-page-search]):not([data-basic-page-header-action])]:col-start-1 [&>:nth-child(1_of_:not([data-basic-page-search]):not([data-basic-page-header-action])):nth-last-child(1_of_:not([data-basic-page-search]):not([data-basic-page-header-action]))]:row-span-2 [&>:nth-child(1_of_:not([data-basic-page-search]):not([data-basic-page-header-action])):nth-last-child(1_of_:not([data-basic-page-search]):not([data-basic-page-header-action]))]:self-center [&>:nth-child(1_of_:not([data-basic-page-search]):not([data-basic-page-header-action])):not(:nth-last-child(1_of_:not([data-basic-page-search]):not([data-basic-page-header-action])))]:self-end [&>:not([data-basic-page-search]):not([data-basic-page-header-action]):not(:nth-child(1_of_:not([data-basic-page-search]):not([data-basic-page-header-action])))]:self-start [[data-basic-page-callout]_&]:mb-0 [[data-basic-page-stack]>*>&]:mb-0";
545
- function ea({ enter: e, className: a, ...n }) {
546
- const r = B();
547
- return Ae(e === !0) && !r ? /* @__PURE__ */ t(N.div, {
548
- initial: {
549
- opacity: 0,
550
- y: q
551
- },
552
- animate: {
553
- opacity: 1,
554
- y: 0
555
- },
556
- transition: {
557
- y: P,
558
- opacity: M
559
- },
560
- "data-basic-page-header": "",
561
- className: p(Le, a),
562
- ...n
563
- }) : /* @__PURE__ */ t("div", {
564
- "data-basic-page-header": "",
565
- className: p(Le, a),
566
- ...n
567
- });
568
- }
569
- function ta({ className: e, ...a }) {
570
- return /* @__PURE__ */ t("div", {
571
- "data-basic-page-header-action": "",
572
- className: p("flex items-center gap-2", "[[data-basic-page-header]>&]:col-start-3 [[data-basic-page-header]>&]:row-span-2 [[data-basic-page-header]>&]:row-start-1 [[data-basic-page-header]>&]:ml-4 [[data-basic-page-header]>&]:self-start [[data-basic-page-header]>&]:justify-self-end", e),
573
- ...a
574
- });
575
- }
576
- function aa({ id: e, className: a, children: n, ...r }) {
577
- const s = be(e, n);
578
- return /* @__PURE__ */ t("h2", {
579
- id: s,
580
- className: p("text-display-xs text-pho-primary max-w-full min-w-0 scroll-mt-12 truncate px-5 font-medium", "mb-3 [[data-basic-page-callout]_&]:mb-0 [[data-basic-page-header]>&]:mb-0 [[data-basic-page-stack]>*>&]:mb-0", a),
581
- ...r,
582
- children: n
583
- });
584
- }
585
- function Ye({ className: e, ...a }) {
586
- return /* @__PURE__ */ t("p", {
587
- className: p("text-display-xs text-pho-description px-5 font-normal", e),
588
- ...a
589
- });
590
- }
591
- function na({ one: e, other: a, ...n }) {
592
- const r = T(fe), s = me(r?.subscribe ?? ve, () => r?.get().api ?? null, () => null);
593
- if (s == null) return null;
594
- const l = s.query.trim() !== "" ? `${s.matched} of ${s.total}.` : `${s.total} ${s.total === 1 ? e : a}.`;
595
- return /* @__PURE__ */ t(Ye, {
596
- ...n,
597
- children: l
598
- });
599
- }
600
- function ra({ className: e, ...a }) {
601
- return /* @__PURE__ */ t("p", {
602
- className: p("text-pho-description px-5 text-xs font-normal", "mt-3 [[data-basic-page-callout]_&]:mt-0 [[data-basic-page-stack]>*>&]:mt-0", e),
603
- ...a
604
- });
605
- }
606
- function ia({ animateHeight: e, className: a, children: n, ...r }) {
607
- const s = /* @__PURE__ */ t(G, { children: Y.toArray(n) });
608
- return e ? /* @__PURE__ */ t("div", {
609
- className: p(ge, "min-h-0 overflow-hidden", a),
610
- ...r,
611
- children: /* @__PURE__ */ t(bt, {
612
- transition: P,
613
- className: ne,
614
- children: s
615
- })
616
- }) : /* @__PURE__ */ t("div", {
617
- className: p(ze, a),
618
- ...r,
619
- children: s
620
- });
621
- }
622
- function sa({ className: e, ...a }) {
623
- const { leaving: n, ...r } = Ne();
624
- return /* @__PURE__ */ t(N.div, {
625
- ...r,
626
- className: p(_t, n && "overflow-hidden", e),
627
- ...a
628
- });
629
- }
630
- function la({ divided: e = !1, className: a, ...n }) {
631
- return /* @__PURE__ */ t("div", {
632
- className: p(e ? Ct : Et, a),
633
- ...n
634
- });
635
- }
636
- function oa({ className: e, icon: a, children: n, ...r }) {
637
- if (a == null || a === !1 || a === !0) return /* @__PURE__ */ t("div", {
638
- "data-basic-page-callout": "",
639
- className: p(Se, e),
640
- ...r,
641
- children: n
642
- });
643
- const [s, ...l] = Y.toArray(n);
644
- return /* @__PURE__ */ v("div", {
645
- "data-basic-page-callout": "",
646
- className: p(Se, e),
647
- ...r,
648
- children: [/* @__PURE__ */ v("div", {
649
- className: "relative",
650
- children: [/* @__PURE__ */ t("div", {
651
- className: "min-w-0 pr-16",
652
- children: s
653
- }), /* @__PURE__ */ t("div", {
654
- "aria-hidden": !0,
655
- className: "text-pho-primary pointer-events-none absolute top-0 right-0 size-14 opacity-[0.275] [&>svg]:size-full",
656
- children: a
657
- })]
658
- }), l]
659
- });
660
- }
661
- function ca({ id: e, className: a, children: n, ...r }) {
662
- const s = be(e, n);
663
- return /* @__PURE__ */ t("h2", {
664
- id: s,
665
- className: p("text-display-xs text-pho-primary max-w-full min-w-0 scroll-mt-12 truncate font-medium", a),
666
- ...r,
667
- children: n
668
- });
669
- }
670
- function ua({ className: e, ...a }) {
671
- return /* @__PURE__ */ t("p", {
672
- className: p("text-display-xs text-pho-description font-normal", e),
673
- ...a
674
- });
675
- }
676
- var Ue = z(null), Je = z(!1);
677
- function da({ className: e, children: a, ...n }) {
678
- let r = !1;
679
- const s = Y.toArray(a).map((l, o) => {
680
- if (!Fe(l)) return l;
681
- let c;
682
- return l.props.done ? c = "done" : r ? c = "upcoming" : (r = !0, c = l.props.working ? "working" : l.props.pending ? "pending" : "current"), /* @__PURE__ */ t(Ue.Provider, {
683
- value: {
684
- number: o + 1,
685
- state: c
686
- },
687
- children: l
688
- }, l.key ?? o);
689
- });
690
- return /* @__PURE__ */ t("ol", {
691
- "data-basic-page-onboard": "",
692
- className: p(ze, "m-0 list-none p-0", e),
693
- ...n,
694
- children: s
695
- });
696
- }
697
- var pa = "relative grid size-5 shrink-0 place-items-center rounded-full border text-xs font-medium tabular-nums transition-[background-color,border-color,color] duration-200 ease-out *:[grid-area:1/1]", fa = {
698
- done: "border-pho-ink text-pho-primary",
699
- current: "bg-pho-brand-solid text-pho-on-brand border-transparent",
700
- working: "border-transparent text-pho-primary",
701
- pending: "border-pho-ink text-pho-primary border-dashed",
702
- upcoming: "border-pho-primary text-pho-description"
703
- }, ma = "pointer-events-none absolute -inset-px rounded-full border border-pho-ink opacity-30", ha = "pointer-events-none absolute -inset-px rounded-full border border-pho-ink border-r-transparent border-b-transparent border-l-transparent animate-pho-spinner", ga = {
704
- done: "Done.",
705
- working: "In progress.",
706
- pending: "Waiting."
707
- };
708
- function ba({ icon: e, aside: a, title: n, description: r, done: s, working: l, pending: o, className: c, children: i, ...d }) {
709
- const f = T(Ue), u = f?.state ?? (s ? "done" : l ? "working" : o ? "pending" : "current"), m = B(), h = u === "current" || u === "working" || u === "pending", b = u === "upcoming", g = ga[u], E = i != null && i !== !1, y = e != null && e !== !1, C = a != null && a !== !1;
710
- return /* @__PURE__ */ t("li", {
711
- "data-basic-page-step": u,
712
- "aria-current": h ? "step" : void 0,
713
- className: p("relative m-0 grid min-w-0 grid-cols-[auto_minmax(0,1fr)] grid-rows-[auto_minmax(0,1fr)] items-center gap-x-3 px-5 py-4", "transition-[background-color] duration-200 ease-out first:rounded-t-[calc(0.75rem-1px)] last:rounded-b-[calc(0.75rem-1px)] motion-reduce:transition-none", h && "bg-pho-page", c),
714
- ...d,
715
- children: /* @__PURE__ */ v(Je.Provider, {
716
- value: !0,
717
- children: [
718
- /* @__PURE__ */ v("span", {
719
- "aria-hidden": !0,
720
- className: p(pa, fa[u], "col-start-1 row-start-1"),
721
- children: [/* @__PURE__ */ t(G, {
722
- initial: !1,
723
- children: u === "done" ? /* @__PURE__ */ t(N.span, {
724
- ...ee(m),
725
- className: "flex",
726
- children: /* @__PURE__ */ t(yt, { className: "size-3" })
727
- }, "check") : /* @__PURE__ */ t(N.span, {
728
- ...ee(m),
729
- children: f?.number ?? 1
730
- }, "number")
731
- }), u === "working" ? /* @__PURE__ */ v(he, { children: [/* @__PURE__ */ t("span", { className: ma }), /* @__PURE__ */ t("span", { className: ha })] }) : null]
732
- }),
733
- /* @__PURE__ */ v("div", {
734
- "data-basic-page-step-title": "",
735
- className: p("text-display-xs col-start-2 row-start-1 min-w-0 font-medium transition-colors duration-200 ease-out", b ? "text-pho-description" : "text-pho-primary"),
736
- children: [g ? /* @__PURE__ */ v("span", {
737
- className: "sr-only",
738
- children: [g, " "]
739
- }) : null, n]
740
- }),
741
- /* @__PURE__ */ t(_e, {
742
- show: h,
743
- gap: "none",
744
- clip: !1,
745
- className: "col-start-2 row-start-2 flex min-w-0 flex-col self-stretch",
746
- children: /* @__PURE__ */ v("div", {
747
- "data-basic-page-step-body": "",
748
- className: "flex min-w-0 flex-1 flex-col",
749
- children: [r ? /* @__PURE__ */ t("div", {
750
- className: "text-display-xs text-pho-description font-normal",
751
- children: r
752
- }) : null, E ? /* @__PURE__ */ t("div", {
753
- className: "mt-auto flex flex-wrap items-center gap-2 pt-3",
754
- children: i
755
- }) : null]
756
- })
757
- }),
758
- u === "done" && E ? /* @__PURE__ */ t("div", {
759
- className: "col-start-3 row-start-1 flex min-w-0 items-center gap-2",
760
- children: i
761
- }) : C ? /* @__PURE__ */ t(G, {
762
- initial: !1,
763
- children: h ? /* @__PURE__ */ t(N.div, {
764
- ...ee(m),
765
- className: "col-start-3 row-span-2 row-start-1 self-start",
766
- children: a
767
- }, "aside") : null
768
- }) : y ? /* @__PURE__ */ t(G, {
769
- initial: !1,
770
- children: h ? /* @__PURE__ */ t(N.div, {
771
- "aria-hidden": !0,
772
- ...ee(m),
773
- className: "pointer-events-none col-start-3 row-span-2 row-start-1 size-14 self-start",
774
- children: /* @__PURE__ */ t("div", {
775
- className: "text-pho-primary size-full opacity-[0.275] [&>svg]:size-full",
776
- children: e
777
- })
778
- }, "icon") : null
779
- }) : null
780
- ]
781
- })
782
- });
783
- }
784
- function ya({ label: e, description: a, htmlFor: n, stacked: r = !1, className: s, children: l, ...o }) {
785
- const { leaving: c, ...i } = Ne();
786
- return /* @__PURE__ */ v(N.div, {
787
- ...i,
788
- className: p(At, r && "sm:flex-col sm:items-stretch sm:justify-start sm:gap-3", c && "overflow-hidden", s),
789
- ...o,
790
- children: [/* @__PURE__ */ v("div", {
791
- className: "min-w-0",
792
- children: [n ? /* @__PURE__ */ t("label", {
793
- htmlFor: n,
794
- className: "text-pho-primary block text-base font-normal",
795
- children: e
796
- }) : /* @__PURE__ */ t("div", {
797
- className: "text-pho-primary text-base font-normal",
798
- children: e
799
- }), a ? /* @__PURE__ */ t("p", {
800
- className: "text-pho-description text-xs",
801
- children: a
802
- }) : null]
803
- }), /* @__PURE__ */ t("div", {
804
- className: p("flex w-full min-w-0 items-center gap-2 sm:w-auto", r && "sm:w-full"),
805
- children: l
806
- })]
807
- });
808
- }
809
- function va({ className: e, ...a }) {
810
- const n = T(Je);
811
- return /* @__PURE__ */ t("p", {
812
- className: p("text-pho-description max-w-full min-w-0 truncate", n ? "text-display-xs font-normal" : "text-base", e),
813
- ...a
814
- });
815
- }
816
- function xa({ error: e, show: a, className: n, children: r, ...s }) {
817
- const l = B(), o = T(X), c = e ?? o?.error ?? void 0;
818
- return /* @__PURE__ */ t(G, {
819
- initial: !1,
820
- children: (a ?? !0) && (c != null || r != null) ? /* @__PURE__ */ t(N.div, {
821
- "data-basic-page-alert": "",
822
- className: "overflow-hidden",
823
- initial: {
824
- height: 0,
825
- opacity: 0
826
- },
827
- animate: {
828
- height: "auto",
829
- opacity: 1
830
- },
831
- exit: {
832
- height: 0,
833
- opacity: 0
834
- },
835
- transition: l ? { duration: 0 } : {
836
- height: P,
837
- opacity: M
838
- },
839
- children: /* @__PURE__ */ t(ct, {
840
- error: c,
841
- className: p("px-5 pb-3", n),
842
- ...s,
843
- children: r
844
- })
845
- }) : null
846
- });
847
- }
848
- function mn() {
849
- return T(X)?.requestSave ?? null;
850
- }
851
- var hn = 800, ce = gt.createToastManager(), X = z(null);
852
- function wa({ action: e, errors: a, autoSave: n = !1, className: r, children: s, onChange: l, onBlur: o, ...c }) {
853
- const [i, d] = x(!1), [f, u] = x(!1), [m, h] = x(null), [b, g] = x(a ?? {}), [E, y] = x(null), C = _(null), w = _(null), S = _(null), O = _(!1), R = _(!1), I = _(null), D = _(async () => {
854
- });
855
- L(() => () => {
856
- w.current != null && clearTimeout(w.current);
857
- }, []);
858
- const j = async () => {
859
- const A = C.current;
860
- if (A == null || e == null) return;
861
- if (O.current) {
862
- R.current = !0;
863
- return;
864
- }
865
- if (!A.checkValidity()) return;
866
- const k = Object.fromEntries(new FormData(A).entries()), Z = S.current;
867
- O.current = !0, y({
868
- field: Z,
869
- phase: "saving"
870
- }), h(null);
871
- try {
872
- const F = (await e(k))?.errors;
873
- if (F != null && Object.keys(F).length > 0) {
874
- g(F), y(null);
875
- return;
876
- }
877
- g({}), u(!1), y({
878
- field: Z,
879
- phase: "saved"
880
- }), I.current != null && (ce.close(I.current), I.current = null);
881
- } catch (F) {
882
- y(null), h(F), I.current != null && ce.close(I.current), I.current = ce.add({
883
- type: "error",
884
- title: "Couldn't save",
885
- description: F instanceof Error && F.message !== "" ? F.message : "The change is still here — try again.",
886
- timeout: 0,
887
- actionProps: {
888
- children: "Retry",
889
- onClick: () => {
890
- D.current();
891
- }
892
- }
893
- });
894
- } finally {
895
- O.current = !1, R.current && (R.current = !1, D.current());
896
- }
897
- };
898
- D.current = j;
899
- const U = () => {
900
- w.current != null && clearTimeout(w.current), w.current = setTimeout(() => {
901
- w.current = null, D.current();
902
- }, 800);
903
- }, J = $(() => n ? (A) => {
904
- A != null && (S.current = A), u(!0), U();
905
- } : null, [n]), H = $(() => ({
906
- pending: i,
907
- dirty: f,
908
- error: m,
909
- auto: E,
910
- requestSave: J
911
- }), [
912
- i,
913
- f,
914
- m,
915
- E,
916
- J
917
- ]);
918
- return /* @__PURE__ */ t(X.Provider, {
919
- value: H,
920
- children: /* @__PURE__ */ t(vt, {
921
- errors: b,
922
- onFormSubmit: async (A) => {
923
- if (e != null) {
924
- d(!0), h(null);
925
- try {
926
- const k = (await e(A))?.errors;
927
- if (k != null && Object.keys(k).length > 0) {
928
- g(k);
929
- return;
930
- }
931
- g({}), u(!1);
932
- } catch (k) {
933
- h(k);
934
- } finally {
935
- d(!1);
936
- }
937
- }
938
- },
939
- onChange: (A) => {
940
- u(!0), h(null);
941
- const k = A.target.name;
942
- k && k in b && g((Z) => {
943
- const { [k]: F, ...rt } = Z;
944
- return rt;
945
- }), n && (k && (S.current = k), U()), l?.(A);
946
- },
947
- onBlur: (A) => {
948
- n && f && w.current != null && (clearTimeout(w.current), w.current = null, D.current()), o?.(A);
949
- },
950
- className: p("contents [[data-basic-page-stack]>&]:flex [[data-basic-page-stack]>&]:min-w-0 [[data-basic-page-stack]>&]:flex-col", r),
951
- ...c,
952
- ref: (A) => {
953
- C.current = A;
954
- const k = c.ref;
955
- typeof k == "function" ? k(A) : k != null && (k.current = A);
956
- },
957
- children: /* @__PURE__ */ t("fieldset", {
958
- disabled: i,
959
- "aria-busy": i || void 0,
960
- className: "contents",
961
- children: s
962
- })
963
- })
964
- });
965
- }
966
- function Na({ name: e, className: a, ...n }) {
967
- const r = T(X), s = B(), l = r?.auto ?? null, o = l != null && (e == null || l.field === e), [c, i] = x(!1), d = o ? l.phase : null;
968
- L(() => {
969
- if (d !== "saved") return;
970
- i(!0);
971
- const m = setTimeout(() => i(!1), 1800);
972
- return () => clearTimeout(m);
973
- }, [d, l]);
974
- const f = d === "saving" ? "Saving…" : d === "saved" && c ? "Saved" : null, u = s ? "blur(0px)" : `blur(${He}px)`;
975
- return /* @__PURE__ */ t("span", {
976
- className: "grid justify-items-end",
977
- children: /* @__PURE__ */ t(G, {
978
- initial: !1,
979
- children: f != null && /* @__PURE__ */ t(N.output, {
980
- initial: {
981
- opacity: 0,
982
- filter: u
983
- },
984
- animate: {
985
- opacity: 1,
986
- filter: "blur(0px)"
987
- },
988
- exit: {
989
- opacity: 0,
990
- filter: u
991
- },
992
- transition: xe,
993
- className: p("text-pho-description pl-8 [grid-area:1/1]", a),
994
- style: { background: "linear-gradient(to left, var(--background-color-pho-primary) calc(100% - 2rem), transparent)" },
995
- ...n,
996
- children: f
997
- }, f)
998
- })
999
- });
1000
- }
1001
- var Aa = "flex min-w-0 flex-col gap-5 p-5 [&>[data-basic-page-alert]]:-mx-5 [&>[data-basic-page-alert]]:-mt-2 [&>[data-basic-page-alert]]:-mb-5 [&>[data-basic-page-footer]]:pr-0 [&>[data-basic-page-reveal]]:flex [&>[data-basic-page-reveal]]:flex-col [&>[data-basic-page-reveal]]:gap-5";
1002
- function _a({ className: e, ...a }) {
1003
- const n = _(null);
1004
- return Qe(n, "Fields", 20, () => null), /* @__PURE__ */ t("div", {
1005
- "data-basic-page-fields": "",
1006
- className: p(ge, Aa, e),
1007
- ...a,
1008
- ref: (r) => {
1009
- n.current = r;
1010
- const s = a.ref;
1011
- typeof s == "function" ? s(r) : s != null && (s.current = r);
1012
- }
1013
- });
1014
- }
1015
- function Ea({ className: e, ...a }) {
1016
- return /* @__PURE__ */ t("div", {
1017
- className: p("flex min-w-0 flex-col gap-5 *:min-w-0 sm:flex-row sm:gap-3 sm:*:flex-1", e),
1018
- ...a
1019
- });
1020
- }
1021
- function Ca({ children: e = "Save changes", ...a }) {
1022
- const n = T(X);
1023
- return /* @__PURE__ */ t(ie, {
1024
- type: "submit",
1025
- variant: "effect",
1026
- size: "sm",
1027
- loading: n?.pending,
1028
- ...a,
1029
- children: e
1030
- });
1031
- }
1032
- function Sa({ show: e, className: a, ...n }) {
1033
- const r = T(X), s = e === "dirty" ? r?.dirty ?? !1 : e, l = /* @__PURE__ */ t("div", {
1034
- "data-basic-page-footer": "",
1035
- className: p("flex items-center justify-end gap-3 pr-[calc(1.25rem+2.5px)]", a),
1036
- ...n
1037
- });
1038
- return s === void 0 ? l : /* @__PURE__ */ t(_e, {
1039
- show: s,
1040
- gap: "block",
1041
- clip: !1,
1042
- children: l
1043
- });
1044
- }
1045
- var ka = {
1046
- stack: "-2.5rem",
1047
- block: "-0.75rem",
1048
- fields: "-1.25rem",
1049
- none: "0px"
1050
- };
1051
- function _e({ show: e, clip: a = !0, gap: n = "stack", dividers: r, className: s, ...l }) {
1052
- const o = B(), c = ka[r ? "none" : n], i = _(null), d = _(e !== !0);
1053
- L(() => {
1054
- d.current = !0;
1055
- }, []);
1056
- const f = () => {
1057
- a && i.current && (i.current.style.overflow = "hidden");
1058
- }, u = () => {
1059
- i.current && (i.current.style.overflow = "");
1060
- };
1061
- return e === void 0 ? /* @__PURE__ */ t(N.div, {
1062
- initial: o ? !1 : {
1063
- opacity: 0,
1064
- y: q
1065
- },
1066
- animate: {
1067
- opacity: 1,
1068
- y: 0
1069
- },
1070
- transition: {
1071
- y: P,
1072
- opacity: M
1073
- },
1074
- className: p(r && ne, s),
1075
- ...l
1076
- }) : /* @__PURE__ */ t(G, {
1077
- initial: !1,
1078
- children: e ? /* @__PURE__ */ t(N.div, {
1079
- "data-basic-page-reveal": "",
1080
- ref: (m) => {
1081
- i.current = m, a && m && d.current && (m.style.overflow = "hidden");
1082
- },
1083
- onAnimationStart: f,
1084
- onAnimationComplete: u,
1085
- initial: {
1086
- height: 0,
1087
- opacity: 0,
1088
- marginTop: c
1089
- },
1090
- animate: {
1091
- height: "auto",
1092
- opacity: 1,
1093
- marginTop: 0
1094
- },
1095
- exit: {
1096
- height: 0,
1097
- opacity: 0,
1098
- marginTop: c
1099
- },
1100
- transition: o ? { duration: 0 } : {
1101
- height: P,
1102
- marginTop: P,
1103
- opacity: M
1104
- },
1105
- className: p(r && ne, s),
1106
- ...l
1107
- }) : null
1108
- });
1109
- }
1110
- var Ta = "top-4 left-5 h-8 text-base [&>svg]:size-[1.125em] [&>svg]:shrink-0", Ra = "(min-width: 40rem)";
1111
- function Pa() {
1112
- return typeof window < "u" && typeof window.matchMedia == "function" && !window.matchMedia(Ra).matches;
1113
- }
1114
- var Ze = z(null);
1115
- function et({ className: e, children: a, ...n }) {
1116
- const r = Y.toArray(a).filter(Fe), s = r.map((C) => C.props.children ?? null), l = je();
1117
- zt(s);
1118
- const [o] = x(Pa), c = B(), i = r.length, d = De(), f = !o && i >= Ia, u = T(ye), m = i > 0 ? r[i - 1]?.props : null, h = m?.children ?? "Back", b = m?.href, g = m?.onClick;
1119
- V(() => {
1120
- if (!(u == null || b == null))
1121
- return u.setTail({
1122
- label: h,
1123
- href: b,
1124
- onClick: g
1125
- }), () => u.setTail(null);
1126
- }, [
1127
- u,
1128
- h,
1129
- b,
1130
- g
1131
- ]);
1132
- const [E, y] = x(!c && !o && l != null && l.labels.length > i);
1133
- return /* @__PURE__ */ t("nav", {
1134
- "aria-label": "Breadcrumb",
1135
- "data-basic-page-back": "",
1136
- className: p("absolute top-4 left-3 flex min-w-max items-center", e),
1137
- ...n,
1138
- children: /* @__PURE__ */ v("ol", {
1139
- className: "m-0 flex list-none items-center p-0",
1140
- children: [r.map((C, w) => f && w > 0 && w < i - 2 ? null : /* @__PURE__ */ v(xt, { children: [f && w === i - 2 && /* @__PURE__ */ v("li", {
1141
- className: "m-0 flex items-center max-sm:hidden",
1142
- children: [/* @__PURE__ */ t("span", {
1143
- "aria-hidden": !0,
1144
- className: de,
1145
- children: re
1146
- }), /* @__PURE__ */ v(W.Root, { children: [/* @__PURE__ */ t(W.Trigger, { render: /* @__PURE__ */ t(ie, {
1147
- variant: "ghost",
1148
- size: "sm",
1149
- "aria-label": "Hidden pages",
1150
- className: "px-2",
1151
- children: Oa
1152
- }) }), /* @__PURE__ */ t(W.Portal, { children: /* @__PURE__ */ t(W.Positioner, {
1153
- align: "start",
1154
- sideOffset: 4,
1155
- children: /* @__PURE__ */ t(W.Popup, { children: r.slice(1, i - 2).map((S, O) => {
1156
- const R = S.props;
1157
- return /* @__PURE__ */ t(W.LinkItem, {
1158
- render: /* @__PURE__ */ t(d, {
1159
- href: R.href,
1160
- onClick: R.onClick
1161
- }),
1162
- children: R.children ?? "Back"
1163
- }, S.key ?? O);
1164
- }) })
1165
- }) })] })]
1166
- }), /* @__PURE__ */ t("li", {
1167
- className: p("m-0 flex items-center", w < i - 1 && "max-sm:hidden"),
1168
- children: /* @__PURE__ */ t(Ze.Provider, {
1169
- value: {
1170
- index: w,
1171
- count: i,
1172
- departing: l,
1173
- narrow: o
1174
- },
1175
- children: C
1176
- })
1177
- })] }, C.key ?? w)), E && /* @__PURE__ */ t("li", {
1178
- "aria-hidden": !0,
1179
- className: "m-0 flex items-center max-sm:hidden",
1180
- children: /* @__PURE__ */ t(N.span, {
1181
- initial: { opacity: 1 },
1182
- animate: { opacity: 0 },
1183
- transition: qe,
1184
- onAnimationComplete: () => y(!1),
1185
- className: de,
1186
- children: re
1187
- })
1188
- })]
1189
- })
1190
- });
1191
- }
1192
- var de = "text-pho-description -mx-1 inline-flex shrink-0 text-base select-none", re = "/", Ia = 4, Oa = "…";
1193
- function tt({ href: e, className: a, morphId: n, children: r = "Back", ...s }) {
1194
- const l = T(Ze), o = B(), c = n != null && !o, i = We(c ? n : void 0);
1195
- if (l == null) throw new Error("BasicPage.Crumb must be rendered inside BasicPage.Breadcrumbs");
1196
- const { index: d, count: f, departing: u, narrow: m } = l, h = d === 0, b = d === f - 1, g = u != null && u.labels.length < f, E = u != null && u.labels.length > f, y = b && (u == null || g || m), C = h || b, w = h && b ? "" : h ? "max-sm:hidden" : "sm:hidden", S = u != null, O = b ? m ? E ? "slide" : "fade" : y ? "fade" : void 0 : void 0, [R, I] = x(c && m && i.fly && u != null && !E ? u.labels[u.labels.length - 1] : null), D = c && C && !S, j = c && !h && b && (u == null || g);
1197
- return /* @__PURE__ */ v(he, { children: [!h && /* @__PURE__ */ t("span", {
1198
- "aria-hidden": !0,
1199
- className: p(de, "max-sm:hidden"),
1200
- children: j ? /* @__PURE__ */ t(N.span, {
1201
- initial: i.fly ? {
1202
- opacity: 0,
1203
- x: Te
1204
- } : { opacity: 0 },
1205
- animate: i.fly ? {
1206
- opacity: 1,
1207
- x: 0
1208
- } : { opacity: 1 },
1209
- transition: i.fly ? Re : M,
1210
- className: "inline-flex",
1211
- children: re
1212
- }) : re
1213
- }), /* @__PURE__ */ t(pe, {
1214
- variant: "ghost",
1215
- size: "sm",
1216
- href: e,
1217
- prefix: C ? D ? /* @__PURE__ */ t(N.span, {
1218
- initial: i.fly ? {
1219
- opacity: 0,
1220
- x: Te
1221
- } : { opacity: 0 },
1222
- animate: i.fly ? {
1223
- opacity: 1,
1224
- x: 0
1225
- } : { opacity: 1 },
1226
- transition: i.fly ? Re : M,
1227
- className: p("inline-flex [&>svg]:size-[1.125em] [&>svg]:shrink-0", w),
1228
- children: /* @__PURE__ */ t(ae, {})
1229
- }) : /* @__PURE__ */ t("span", {
1230
- className: p("inline-flex [&>svg]:size-[1.125em] [&>svg]:shrink-0", w),
1231
- children: /* @__PURE__ */ t(ae, {})
1232
- }) : /* @__PURE__ */ t("span", { className: "hidden" }),
1233
- className: p("min-w-max", a),
1234
- ...s,
1235
- children: c && n != null ? /* @__PURE__ */ v("span", {
1236
- className: p("relative block", !i.fly && O === "slide" && "overflow-hidden", !b && "max-w-40 truncate"),
1237
- children: [/* @__PURE__ */ t(Ke, {
1238
- morphId: n,
1239
- fromClassName: "text-pho-primary",
1240
- fly: i.fly,
1241
- morphRef: i.ref,
1242
- arrival: O,
1243
- children: r
1244
- }), R != null && /* @__PURE__ */ t(N.span, {
1245
- "aria-hidden": !0,
1246
- initial: {
1247
- x: 0,
1248
- opacity: 1
1249
- },
1250
- animate: {
1251
- x: Ht,
1252
- opacity: 0
1253
- },
1254
- transition: Ft,
1255
- onAnimationComplete: () => I(null),
1256
- className: "pointer-events-none absolute inset-y-0 left-0 whitespace-nowrap",
1257
- children: R
1258
- })]
1259
- }) : /* @__PURE__ */ t("span", {
1260
- className: p("block", !b && "max-w-40 truncate"),
1261
- children: r
1262
- })
1263
- })] });
1264
- }
1265
- function La({ className: e, ...a }) {
1266
- return /* @__PURE__ */ t(et, {
1267
- className: e,
1268
- children: /* @__PURE__ */ t(tt, { ...a })
1269
- });
1270
- }
1271
- function Ba({ label: e, description: a, leading: n, href: r, className: s, children: l, ...o }) {
1272
- const c = De(), i = $(() => N.create(c), [c]), { leaving: d, ...f } = Ne();
1273
- return /* @__PURE__ */ v(i, {
1274
- href: r,
1275
- ...f,
1276
- ...o,
1277
- className: p("flex min-h-[4.25rem] min-w-0 flex-row items-center justify-between gap-6 px-5 py-4", "group outline-pho-brand hover:bg-pho-primary-hover cursor-pointer transition-colors focus-visible:outline-2 focus-visible:-outline-offset-2", "aria-[current=page]:bg-pho-primary-hover", "first:rounded-t-[calc(var(--radius-base)-1px)] last:rounded-b-[calc(var(--radius-base)-1px)]", d && "overflow-hidden", s),
1278
- children: [/* @__PURE__ */ v("div", {
1279
- className: p("flex min-w-0 flex-1 items-center", n != null && "gap-3"),
1280
- children: [n, /* @__PURE__ */ v("div", {
1281
- className: "min-w-0",
1282
- children: [/* @__PURE__ */ t("div", {
1283
- className: "flex min-w-0 items-center gap-1",
1284
- children: typeof e == "string" || typeof e == "number" ? /* @__PURE__ */ t("p", {
1285
- className: "text-pho-primary truncate text-base font-medium",
1286
- children: e
1287
- }) : e
1288
- }), a ? /* @__PURE__ */ t("div", {
1289
- className: "text-pho-description truncate text-xs",
1290
- children: a
1291
- }) : null]
1292
- })]
1293
- }), /* @__PURE__ */ v("div", {
1294
- className: "flex min-w-0 items-center justify-end gap-2",
1295
- children: [l != null ? /* @__PURE__ */ t("div", {
1296
- className: "min-w-0",
1297
- children: l
1298
- }) : null, /* @__PURE__ */ t(ut, {
1299
- "aria-hidden": !0,
1300
- className: "text-pho-secondary group-hover:text-pho-secondary-hover size-4 shrink-0 transition-colors"
1301
- })]
1302
- })]
1303
- });
1304
- }
1305
- function Ma({ open: e, variant: a = "overlay", modal: n = !1, placeholder: r, onClose: s, children: l }) {
1306
- const o = T(Ve), c = e ?? Y.toArray(l).length > 0, i = o?.setOpen, d = o?.setPresent;
1307
- return V(() => {
1308
- if (d != null)
1309
- return d(!0), () => d(!1);
1310
- }, [d]), V(() => {
1311
- if (i != null)
1312
- return i(c), () => i(!1);
1313
- }, [i, c]), L(() => {
1314
- o == null && typeof process < "u" && process.env.NODE_ENV !== "production" && console.warn("BasicPage.Aside: needs a `BasicPage.Root` around it.");
1315
- }, [o]), o == null || o.slot == null ? null : o.presentation === "page" ? Ce(c ? /* @__PURE__ */ t("div", {
1316
- "data-basic-page-aside": "page",
1317
- className: "flex min-w-0 flex-1 flex-col",
1318
- children: l
1319
- }) : null, o.slot) : a === "inline" ? Ce(/* @__PURE__ */ t(Da, {
1320
- width: o.width,
1321
- paneHeight: o.paneHeight,
1322
- onClose: s,
1323
- open: c,
1324
- placeholder: r,
1325
- children: l
1326
- }), o.slot) : /* @__PURE__ */ t(Ha, {
1327
- container: o.slot,
1328
- width: o.width,
1329
- paneHeight: o.paneHeight,
1330
- onClose: s,
1331
- open: c,
1332
- modal: n,
1333
- children: l
1334
- });
1335
- }
1336
- function at() {
1337
- const [e, a] = x(null), n = $(() => ({ setBack: a }), []), r = _(null);
1338
- return {
1339
- back: e,
1340
- panel: n,
1341
- closeRef: r,
1342
- leave: Ge(() => {
1343
- const s = r.current?.querySelector("a, button");
1344
- return s == null ? !1 : (s.click(), !0);
1345
- }, [])
1346
- };
1347
- }
1348
- var Be = {
1349
- variant: "ghost",
1350
- size: "sm",
1351
- svgOnly: !0,
1352
- "aria-label": "Close",
1353
- children: /* @__PURE__ */ t(ht, {})
1354
- };
1355
- function nt({ back: e, onClose: a, closeRef: n, panel: r, children: s }) {
1356
- return /* @__PURE__ */ v(he, { children: [/* @__PURE__ */ t("span", {
1357
- ref: n,
1358
- className: "absolute top-2 right-2 z-30",
1359
- children: e != null ? /* @__PURE__ */ t(pe, {
1360
- ...Be,
1361
- href: e.href,
1362
- onClick: e.onClick
1363
- }) : a != null ? /* @__PURE__ */ t(ie, {
1364
- ...Be,
1365
- onClick: a
1366
- }) : null
1367
- }), /* @__PURE__ */ v(Q.Root, {
1368
- className: "min-h-0 flex-1",
1369
- children: [/* @__PURE__ */ t(Q.Viewport, { children: /* @__PURE__ */ t(Q.Content, {
1370
- className: "flex min-h-full flex-col",
1371
- children: /* @__PURE__ */ t($e.Provider, {
1372
- value: r,
1373
- children: s
1374
- })
1375
- }) }), /* @__PURE__ */ t(Q.Scrollbar, { children: /* @__PURE__ */ t(Q.Thumb, {}) })]
1376
- })] });
1377
- }
1378
- function Da({ width: e, paneHeight: a, onClose: n, open: r, placeholder: s, children: l }) {
1379
- const o = B(), { back: c, panel: i, closeRef: d, leave: f } = at(), u = o ? "blur(0px)" : `blur(${He}px)`, m = a ?? "100dvh";
1380
- L(() => {
1381
- const b = (g) => {
1382
- g.key !== "Escape" || g.defaultPrevented || f() && g.preventDefault();
1383
- };
1384
- return document.addEventListener("keydown", b), () => document.removeEventListener("keydown", b);
1385
- }, [f]);
1386
- const h = {
1387
- initial: {
1388
- opacity: 0,
1389
- filter: u
1390
- },
1391
- animate: {
1392
- opacity: 1,
1393
- filter: "blur(0px)"
1394
- },
1395
- exit: {
1396
- opacity: 0,
1397
- filter: u
1398
- },
1399
- transition: o ? { duration: 0 } : xe
1400
- };
1401
- return /* @__PURE__ */ t("aside", {
1402
- "data-basic-page-aside": "panel",
1403
- "data-basic-page-aside-variant": "inline",
1404
- className: "relative flex shrink-0 flex-col",
1405
- style: {
1406
- width: e,
1407
- minHeight: m
1408
- },
1409
- children: /* @__PURE__ */ t("div", {
1410
- className: "border-pho-secondary bg-pho-primary sticky top-0 grid border-l *:min-h-0 *:[grid-area:1/1]",
1411
- style: { height: m },
1412
- children: /* @__PURE__ */ t(G, {
1413
- initial: !1,
1414
- children: r ? /* @__PURE__ */ t(N.div, {
1415
- ...h,
1416
- className: "relative flex flex-col",
1417
- children: /* @__PURE__ */ t(nt, {
1418
- back: c,
1419
- onClose: n,
1420
- closeRef: d,
1421
- panel: i,
1422
- children: l
1423
- })
1424
- }, "page") : /* @__PURE__ */ t(N.div, {
1425
- ...h,
1426
- className: "flex flex-col",
1427
- children: s
1428
- }, "empty")
1429
- })
1430
- })
1431
- });
1432
- }
1433
- function Ha({ container: e, width: a, paneHeight: n, onClose: r, open: s, modal: l, children: o }) {
1434
- const { back: c, panel: i, closeRef: d, leave: f } = at(), u = n ?? "100dvh";
1435
- return /* @__PURE__ */ t(te.Root, {
1436
- open: s,
1437
- modal: l ? "trap-focus" : !1,
1438
- disablePointerDismissal: !0,
1439
- onOpenChange: (m, h) => {
1440
- m || (h.cancel(), f());
1441
- },
1442
- children: /* @__PURE__ */ v(te.Portal, {
1443
- container: e,
1444
- className: "contents",
1445
- children: [l ? /* @__PURE__ */ t(te.Backdrop, {
1446
- "data-basic-page-aside-backdrop": "",
1447
- className: p("bg-pho-overlay absolute inset-0 z-30 transition-opacity duration-200 ease-out motion-reduce:transition-none", "data-[ending-style]:opacity-0 data-[starting-style]:opacity-0"),
1448
- onClick: f
1449
- }) : null, /* @__PURE__ */ t(te.Popup, {
1450
- "data-basic-page-aside": "panel",
1451
- "data-basic-page-aside-variant": "overlay",
1452
- initialFocus: l ? void 0 : !1,
1453
- finalFocus: l ? void 0 : !1,
1454
- className: p("absolute inset-y-0 right-0 z-30 flex flex-col outline-none", "transition-[translate,opacity] duration-250 ease-out motion-reduce:transition-none", "data-[ending-style]:translate-x-3 data-[ending-style]:opacity-0 data-[ending-style]:duration-200 data-[starting-style]:translate-x-3 data-[starting-style]:opacity-0"),
1455
- style: { width: a },
1456
- children: /* @__PURE__ */ t("div", {
1457
- className: "border-pho-secondary bg-pho-primary shadow-pho-xl sticky top-0 flex flex-col border-l",
1458
- style: { height: u },
1459
- children: /* @__PURE__ */ t(nt, {
1460
- back: c,
1461
- onClose: r,
1462
- closeRef: d,
1463
- panel: i,
1464
- children: o
1465
- })
1466
- })
1467
- })]
1468
- })
1469
- });
1470
- }
1471
- var Fa = "14rem", Ga = "transition-[width] duration-[330ms] ease-pho-spring motion-reduce:transition-none", Me = "transition-[opacity,visibility] duration-200 ease-out motion-reduce:transition-none";
1472
- function za({ variant: e = "box", fold: a = "auto", value: n, onValueChange: r, placeholder: s, label: l, className: o, ...c }) {
1473
- const i = T(fe), d = me(i?.subscribe ?? ve, () => i?.get().api ?? null, () => null), f = n != null;
1474
- L(() => {
1475
- if (!(i == null || f))
1476
- return i.adopt(!0), () => i.adopt(!1);
1477
- }, [i, f]);
1478
- const u = f ? {
1479
- query: n,
1480
- setQuery: r,
1481
- placeholder: s ?? "Search",
1482
- label: l ?? s ?? "Search"
1483
- } : d == null ? null : {
1484
- query: d.query,
1485
- setQuery: d.setQuery,
1486
- placeholder: d.placeholder,
1487
- label: l ?? d.placeholder
1488
- }, [m, h] = x(!1), b = _(null), g = m || (u?.query ?? "") !== "";
1489
- if (L(() => {
1490
- if (!m) return;
1491
- let y = 0, C = 0;
1492
- const w = () => {
1493
- const S = b.current;
1494
- S != null && (S.focus(), document.activeElement !== S && C++ < 5 && (y = requestAnimationFrame(w)));
1495
- };
1496
- return y = requestAnimationFrame(w), () => cancelAnimationFrame(y);
1497
- }, [m]), e === "ghost") return /* @__PURE__ */ t("div", {
1498
- "data-basic-page-search": "",
1499
- "data-variant": "ghost",
1500
- className: p("flex min-w-0 flex-1", u == null && "hidden", o),
1501
- ...c,
1502
- children: u != null && /* @__PURE__ */ t(ft, {
1503
- value: u.query,
1504
- onChange: u.setQuery,
1505
- placeholder: u.placeholder,
1506
- "aria-label": u.label,
1507
- onKeyDown: (y) => {
1508
- y.key === "Escape" && (y.preventDefault(), u.setQuery(""), y.currentTarget.blur());
1509
- }
1510
- })
1511
- });
1512
- const E = a === "auto";
1513
- return /* @__PURE__ */ t("div", {
1514
- "data-basic-page-search": "",
1515
- "data-expanded": g || void 0,
1516
- className: p("grid min-w-0 content-center", "[[data-basic-page-header]>&]:col-start-2 [[data-basic-page-header]>&]:row-span-2 [[data-basic-page-header]>&]:row-start-1 [[data-basic-page-header]>&]:ml-4 [[data-basic-page-header]>&]:justify-items-end [[data-basic-page-header]>&]:self-start", u == null && "hidden", o),
1517
- ...c,
1518
- children: u != null && /* @__PURE__ */ v("div", {
1519
- className: p("grid w-9 max-w-full justify-items-end *:[grid-area:1/1]", Ga, E && "@[36rem]:w-56"),
1520
- style: g ? { width: Fa } : void 0,
1521
- children: [/* @__PURE__ */ t(ie, {
1522
- variant: "outlined",
1523
- size: "sm",
1524
- shape: "circle",
1525
- svgOnly: !0,
1526
- "aria-label": u.label,
1527
- "aria-hidden": g || void 0,
1528
- tabIndex: g ? -1 : void 0,
1529
- onClick: () => h(!0),
1530
- className: p(Me, g ? "pointer-events-none invisible opacity-0" : "visible opacity-100", E && "@[36rem]:pointer-events-none @[36rem]:invisible @[36rem]:opacity-0"),
1531
- children: /* @__PURE__ */ t(Ee, {})
1532
- }), /* @__PURE__ */ t("div", {
1533
- inert: !E && !g,
1534
- className: p("w-full min-w-0", Me, g ? "visible opacity-100" : "pointer-events-none invisible opacity-0", E && "@[36rem]:pointer-events-auto @[36rem]:visible @[36rem]:opacity-100"),
1535
- children: /* @__PURE__ */ v(le.Root, {
1536
- size: "sm",
1537
- className: "w-full",
1538
- children: [/* @__PURE__ */ t(le.Addon, { children: /* @__PURE__ */ t(Ee, {}) }), /* @__PURE__ */ t(le.Input, {
1539
- ref: b,
1540
- type: "search",
1541
- value: u.query,
1542
- onChange: (y) => u.setQuery(y.target.value),
1543
- onBlur: () => {
1544
- u.query === "" && h(!1);
1545
- },
1546
- onKeyDown: (y) => {
1547
- y.key === "Escape" && (y.preventDefault(), u.setQuery(""), h(!1), y.currentTarget.blur());
1548
- },
1549
- placeholder: u.placeholder,
1550
- "aria-label": u.label
1551
- })]
1552
- })
1553
- })]
1554
- })
1555
- });
1556
- }
1557
- var gn = {
1558
- Root: Pt,
1559
- Aside: Ma,
1560
- Search: za,
1561
- Table: pt,
1562
- CondenseScope: Vt,
1563
- Breadcrumbs: et,
1564
- Crumb: tt,
1565
- Back: La,
1566
- Title: Kt,
1567
- Stack: Zt,
1568
- Header: ea,
1569
- HeaderAction: ta,
1570
- SectionTitle: aa,
1571
- Description: Ye,
1572
- TableCount: na,
1573
- SectionFooter: ra,
1574
- Card: ia,
1575
- Item: sa,
1576
- ItemPanel: la,
1577
- Callout: oa,
1578
- CalloutTitle: ca,
1579
- CalloutDescription: ua,
1580
- Onboard: da,
1581
- Step: ba,
1582
- Row: ya,
1583
- RowLink: Ba,
1584
- Value: va,
1585
- Alert: xa,
1586
- Footer: Sa,
1587
- Form: wa,
1588
- Saved: Na,
1589
- Fields: _a,
1590
- Inline: Ea,
1591
- Submit: Ca,
1592
- Reveal: _e
1593
- };
1594
- export {
1595
- Et as a,
1596
- gn as c,
1597
- $t as d,
1598
- ce as f,
1599
- _t as i,
1600
- xe as l,
1601
- fn as m,
1602
- Se as n,
1603
- Ct as o,
1604
- mn as p,
1605
- ze as r,
1606
- At as s,
1607
- hn as t,
1608
- Ie as u
1609
- };
1610
-
1611
- //# sourceMappingURL=basic-page-CVZT_zaH.js.map