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