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