@photon-ai/pho-ui 2.3.0 → 2.5.0

package/dist/chunks/basic-page-BkLG3Ybg.js

@@ -1,942 +0,0 @@
-"use client";
-import { t as u } from "./cn-ChIgwEl3.js";
-import { n as ie } from "./link-provider-9TFNyDqO.js";
-import { a as re, o as se } from "./button-DNNs5RsT.js";
-import { t as be } from "./createReactComponent-BqCmnqfX.js";
-import { t as Ne } from "./error-Crs-wqMC.js";
-import { t as H } from "./IconChevronLeft-CSWMKQ4C.js";
-import { t as we } from "./animated-height-C2eQstGy.js";
-import { t as Ce } from "./form-AiHbbw4m.js";
-import { i as T } from "./menu-BQeprfxB.js";
-import { Children as W, Fragment as Ae, createContext as V, isValidElement as _e, useContext as S, useEffect as P, useLayoutEffect as D, useMemo as X, useRef as k, useState as N } from "react";
-import { Fragment as Ee, jsx as n, jsxs as g } from "react/jsx-runtime";
-import { AnimatePresence as z, motion as v, useIsPresent as Re, useReducedMotion as E } from "motion/react";
-var ke = [["path", {
-  d: "M9 6l6 6l-6 6",
-  key: "svg-0"
-}]], Se = be("outline", "chevron-right", "ChevronRight", ke), Y = "rounded-base border border-pho-secondary bg-pho-primary", F = "divide-y divide-pho-secondary [&>:has(+[data-basic-page-alert])]:border-b-0", Ie = `${Y} ${F}`, J = "flex min-w-0 flex-col gap-3 rounded-base border border-pho-secondary bg-pho-page p-5", Te = "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", Oe = "flex flex-col gap-3 px-5 py-4", Le = "-mx-5 -mb-4 flex items-center rounded-b-[calc(0.75rem-1px)] bg-pho-secondary py-1 pr-3 pl-5", Pe = "-mx-2 -mt-1.5 flex items-center rounded-sm bg-pho-secondary px-2 py-0.5", b = {
-  type: "spring",
-  stiffness: 400,
-  damping: 40
-}, A = {
-  duration: 0.25,
-  ease: "easeOut"
-}, L = 12;
-function Be({ condense: e = !0, className: t, children: a, ...i }) {
-  const [r, o] = N(null), [c, l] = N(null), s = X(() => ({
-    setTitle: o,
-    setTail: l
-  }), []);
-  return /* @__PURE__ */ g("div", {
-    "data-basic-page-root": "",
-    className: u("relative flex min-h-full w-full min-w-0 flex-col", t),
-    ...i,
-    children: [e && /* @__PURE__ */ n(Me, {
-      title: r,
-      tail: c
-    }), /* @__PURE__ */ n("div", {
-      "data-basic-page-column": "",
-      className: "mx-auto flex w-full max-w-[44.5rem] min-w-0 flex-1 flex-col px-5 pt-12 pb-12 *:min-w-0 has-[[data-basic-page-back]]:pt-16",
-      children: e ? /* @__PURE__ */ n(q.Provider, {
-        value: s,
-        children: a
-      }) : a
-    })]
-  });
-}
-function Me({ title: e, tail: t }) {
-  const a = E(), [i, r] = N(!1), o = e?.el ?? null;
-  return P(() => {
-    if (o == null || typeof IntersectionObserver > "u") return;
-    const c = new IntersectionObserver(([l]) => r(l != null && !l.isIntersecting), { root: Xe(o) });
-    return c.observe(o), () => c.disconnect();
-  }, [o]), /* @__PURE__ */ n("div", {
-    "data-basic-page-condense": "",
-    className: "sticky top-0 z-20 h-0 overflow-visible",
-    children: /* @__PURE__ */ n(z, { children: i && /* @__PURE__ */ g(v.div, {
-      initial: {
-        opacity: 0,
-        y: a ? 0 : te
-      },
-      animate: {
-        opacity: 1,
-        y: 0
-      },
-      exit: {
-        opacity: 0,
-        y: a ? 0 : te
-      },
-      transition: We,
-      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",
-      children: [/* @__PURE__ */ n("div", {
-        className: "flex min-w-0 items-center justify-start",
-        children: t != null && /* @__PURE__ */ n(se, {
-          variant: "ghost",
-          size: "sm",
-          href: t.href,
-          onClick: t.onClick,
-          prefix: /* @__PURE__ */ n("span", {
-            className: "inline-flex [&>svg]:size-[1.125em] [&>svg]:shrink-0",
-            children: /* @__PURE__ */ n(H, {})
-          }),
-          className: "min-w-max",
-          children: t.label
-        })
-      }), /* @__PURE__ */ n("span", {
-        className: "text-pho-primary block max-w-full min-w-0 truncate text-center text-base font-medium",
-        children: e?.label
-      })]
-    }) })
-  });
-}
-function He(e) {
-  return e.normalize("NFKD").replace(/[\u0300-\u036f]/g, "").toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
-}
-function De(e) {
-  if (!(typeof e != "string" && typeof e != "number"))
-    return He(String(e)) || void 0;
-}
-function U(e, t) {
-  if (e !== "")
-    return e ?? De(t);
-}
-var Fe = (e) => `basic-page-morph-${e}`, Ge = { layout: b }, Z = 10, ee = {
-  delay: 0.2,
-  duration: 0.12,
-  ease: "easeOut"
-}, Ve = {
-  duration: 0.18,
-  ease: "easeOut"
-}, ze = -8, $e = {
-  duration: 0.16,
-  ease: "easeOut"
-}, je = {
-  delay: 0.14,
-  duration: 0.16,
-  ease: "easeOut"
-}, oe = {
-  duration: 0.12,
-  ease: "easeOut"
-}, O = [];
-function Ke(e) {
-  const t = k({ labels: e });
-  t.current.labels = e, D(() => {
-    const a = t.current;
-    return O.push(a), () => {
-      O.splice(O.indexOf(a), 1);
-    };
-  }, []);
-}
-function le() {
-  const [e] = N(() => {
-    const t = O[O.length - 1];
-    return t ? { labels: [...t.labels] } : null;
-  });
-  return e;
-}
-var q = V(null), We = {
-  duration: 0.2,
-  ease: "easeOut"
-}, te = -8;
-function Xe(e) {
-  if (typeof getComputedStyle != "function") return null;
-  for (let t = e.parentElement; t != null && t !== document.body; t = t.parentElement) {
-    const { overflowY: a } = getComputedStyle(t);
-    if (a === "auto" || a === "scroll") return t;
-  }
-  return null;
-}
-var j = /* @__PURE__ */ new Map(), Ye = 96;
-function Ue(e) {
-  const t = e.closest("[data-basic-page-root]"), a = t?.querySelector("[data-basic-page-column]");
-  return !t || !a ? 0 : a.getBoundingClientRect().left - t.getBoundingClientRect().left;
-}
-function ce(e) {
-  const [t] = N(() => {
-    if (e == null) return !1;
-    const i = j.get(e);
-    return i != null && i.visible && i.el.isConnected && Ue(i.el) <= Ye;
-  }), a = k(null);
-  return P(() => {
-    if (e == null || typeof IntersectionObserver > "u") return;
-    const i = a.current;
-    if (!i) return;
-    const r = new IntersectionObserver(([o]) => {
-      o && j.set(e, {
-        visible: o.isIntersecting,
-        el: i
-      });
-    });
-    return r.observe(i), () => {
-      r.disconnect(), j.delete(e);
-    };
-  }, [e]), {
-    fly: t,
-    ref: a
-  };
-}
-var qe = {
-  fade: {
-    initial: { opacity: 0 },
-    animate: { opacity: 1 },
-    transition: { opacity: A }
-  },
-  rise: {
-    initial: {
-      opacity: 0,
-      y: L
-    },
-    animate: {
-      opacity: 1,
-      y: 0
-    },
-    transition: {
-      y: b,
-      opacity: A
-    }
-  },
-  slide: {
-    initial: { x: "-100%" },
-    animate: { x: 0 },
-    transition: { x: je }
-  }
-};
-function ue({ morphId: e, fromClassName: t, fly: a, morphRef: i, arrival: r, className: o, children: c }) {
-  const [l, s] = N(!1), d = !a && r != null ? qe[r] : null;
-  return /* @__PURE__ */ g(v.span, {
-    ref: i,
-    layoutId: Fe(e),
-    initial: d?.initial,
-    animate: d?.animate,
-    transition: a ? Ge : {
-      layout: { duration: 0 },
-      ...d?.transition
-    },
-    onLayoutAnimationStart: () => {
-      a && s(!0);
-    },
-    onLayoutAnimationComplete: () => s(!1),
-    className: u("relative inline-block", o),
-    children: [c, l && /* @__PURE__ */ n(v.span, {
-      "aria-hidden": !0,
-      initial: { opacity: 1 },
-      animate: { opacity: 0 },
-      transition: Ve,
-      onAnimationComplete: () => s(!1),
-      className: u("absolute inset-0", t),
-      children: c
-    })]
-  });
-}
-var ne = "max-w-full min-w-0 truncate align-top";
-function Qe({ id: e, morphId: t, enter: a, className: i, children: r, ...o }) {
-  const c = U(e, r), l = E(), s = ce(t), d = le(), p = !l && (t != null || a === !0), m = a || d != null ? "rise" : void 0, f = S(q), y = k(null);
-  D(() => {
-    if (f != null)
-      return f.setTitle({
-        label: r,
-        el: y.current
-      }), () => f.setTitle(null);
-  }, [f, r]);
-  const [x, w] = N(s.fly && d != null);
-  return D(() => {
-    O.length > 0 && w(!1);
-  }, []), /* @__PURE__ */ g("h1", {
-    id: c,
-    className: u("text-display-base text-pho-primary max-w-full min-w-0 scroll-mt-12 px-5 font-medium", p ? "whitespace-nowrap" : "truncate", i),
-    ...o,
-    ref: (h) => {
-      y.current = h;
-      const _ = o.ref;
-      typeof _ == "function" ? _(h) : _ != null && (_.current = h);
-    },
-    children: [t != null && !l ? /* @__PURE__ */ n(ue, {
-      morphId: t,
-      fromClassName: "text-pho-secondary",
-      fly: s.fly,
-      morphRef: s.ref,
-      arrival: m,
-      className: ne,
-      children: r
-    }) : a && !l ? /* @__PURE__ */ n(v.span, {
-      initial: {
-        opacity: 0,
-        y: L
-      },
-      animate: {
-        opacity: 1,
-        y: 0
-      },
-      transition: {
-        y: b,
-        opacity: A
-      },
-      className: u("inline-block", ne),
-      children: r
-    }) : r, x && /* @__PURE__ */ n(v.span, {
-      "aria-hidden": !0,
-      initial: { opacity: 1 },
-      animate: { opacity: 0 },
-      transition: oe,
-      onAnimationComplete: () => w(!1),
-      className: u("text-pho-secondary pointer-events-none absolute inline-flex items-center", Ct),
-      children: /* @__PURE__ */ n(H, {})
-    })]
-  });
-}
-var de = V(!1);
-function Je() {
-  const e = S(de), t = E(), [a] = N(() => e && !t);
-  return a;
-}
-var Ze = {
-  height: 0,
-  opacity: 0,
-  paddingTop: 0,
-  paddingBottom: 0,
-  borderTopWidth: 0
-}, et = {
-  y: b,
-  opacity: A,
-  height: b,
-  paddingTop: b,
-  paddingBottom: b,
-  borderTopWidth: b
-};
-function Q() {
-  const e = Je(), t = Re(), a = E();
-  return {
-    initial: e ? {
-      opacity: 0,
-      y: L
-    } : !1,
-    animate: {
-      opacity: 1,
-      y: 0
-    },
-    exit: Ze,
-    transition: a ? { duration: 0 } : et,
-    leaving: !t
-  };
-}
-var tt = typeof process < "u" && process.env.NODE_ENV !== "production";
-function me(e, t, a, i) {
-  P(() => {
-    if (!tt || e.current == null || typeof getComputedStyle != "function") return;
-    const r = (c) => {
-      const l = getComputedStyle(c).rowGap;
-      return l === "" || l === "normal" ? null : parseFloat(l);
-    }, o = r(e.current);
-    o != null && o !== a && console.warn(`[BasicPage.${t}] spaced at ${o}px instead of ${a}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);
-    for (const c of Array.from(e.current.children)) {
-      const l = i(c);
-      if (l == null || getComputedStyle(c).display === "contents") continue;
-      const s = r(c);
-      s != null && s !== l && console.warn(`[BasicPage.${t}] a child is spaced at ${s}px instead of ${l}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.`, c);
-    }
-  });
-}
-function nt({ className: e, children: t, ...a }) {
-  const i = E(), r = k(null);
-  me(r, "Stack", 40, (d) => d.hasAttribute("data-basic-page-fields") ? 20 : 12);
-  const o = a["aria-busy"], c = o === !0 || o === "true", l = k(c), s = l.current && !c;
-  return P(() => {
-    l.current = c;
-  }), /* @__PURE__ */ n(v.div, {
-    ref: (d) => {
-      r.current = d;
-      const p = a.ref;
-      typeof p == "function" ? p(d) : p != null && (p.current = d);
-    },
-    "data-basic-page-stack": "",
-    initial: i ? !1 : {
-      opacity: 0,
-      y: L
-    },
-    animate: {
-      opacity: 1,
-      y: 0
-    },
-    transition: {
-      y: b,
-      opacity: A
-    },
-    className: u("mt-6 flex min-w-0 flex-col gap-10", "*:flex *:min-w-0 *:flex-col [&>*:not([data-basic-page-fields])]:gap-3", e),
-    ...a,
-    children: /* @__PURE__ */ n(de.Provider, {
-      value: s,
-      children: t
-    })
-  });
-}
-var ae = "flex min-w-0 flex-col mb-3 [[data-basic-page-stack]>*>&]:mb-0";
-function at({ enter: e, className: t, ...a }) {
-  const i = E();
-  return e && !i ? /* @__PURE__ */ n(v.div, {
-    initial: {
-      opacity: 0,
-      y: L
-    },
-    animate: {
-      opacity: 1,
-      y: 0
-    },
-    transition: {
-      y: b,
-      opacity: A
-    },
-    "data-basic-page-header": "",
-    className: u(ae, t),
-    ...a
-  }) : /* @__PURE__ */ n("div", {
-    "data-basic-page-header": "",
-    className: u(ae, t),
-    ...a
-  });
-}
-function it({ id: e, className: t, children: a, ...i }) {
-  const r = U(e, a);
-  return /* @__PURE__ */ n("h2", {
-    id: r,
-    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-header]>&]:mb-0 [[data-basic-page-stack]>*>&]:mb-0", t),
-    ...i,
-    children: a
-  });
-}
-function rt({ className: e, ...t }) {
-  return /* @__PURE__ */ n("p", {
-    className: u("text-display-xs text-pho-description px-5 font-normal", e),
-    ...t
-  });
-}
-function st({ className: e, ...t }) {
-  return /* @__PURE__ */ n("p", {
-    className: u("text-pho-description px-5 text-xs font-normal", "mt-3 [[data-basic-page-stack]>*>&]:mt-0", e),
-    ...t
-  });
-}
-function ot({ animateHeight: e, className: t, children: a, ...i }) {
-  const r = /* @__PURE__ */ n(z, { children: W.toArray(a) });
-  return e ? /* @__PURE__ */ n("div", {
-    className: u(Y, "min-h-0 overflow-hidden", t),
-    ...i,
-    children: /* @__PURE__ */ n(we, {
-      transition: b,
-      className: F,
-      children: r
-    })
-  }) : /* @__PURE__ */ n("div", {
-    className: u(Ie, t),
-    ...i,
-    children: r
-  });
-}
-function lt({ className: e, ...t }) {
-  const { leaving: a, ...i } = Q();
-  return /* @__PURE__ */ n(v.div, {
-    ...i,
-    className: u(Oe, a && "overflow-hidden", e),
-    ...t
-  });
-}
-function ct({ divided: e = !1, className: t, ...a }) {
-  return /* @__PURE__ */ n("div", {
-    className: u(e ? Pe : Le, t),
-    ...a
-  });
-}
-function ut({ className: e, icon: t, children: a, ...i }) {
-  if (t == null || t === !1 || t === !0) return /* @__PURE__ */ n("div", {
-    className: u(J, e),
-    ...i,
-    children: a
-  });
-  const [r, ...o] = W.toArray(a);
-  return /* @__PURE__ */ g("div", {
-    className: u(J, e),
-    ...i,
-    children: [/* @__PURE__ */ g("div", {
-      className: "relative",
-      children: [/* @__PURE__ */ n("div", {
-        className: "min-w-0 pr-16",
-        children: r
-      }), /* @__PURE__ */ n("div", {
-        "aria-hidden": !0,
-        className: "text-pho-description pointer-events-none absolute top-1/2 right-0 size-14 -translate-y-1/2 opacity-50 [&>svg]:size-full",
-        children: t
-      })]
-    }), o]
-  });
-}
-function dt({ id: e, className: t, children: a, ...i }) {
-  const r = U(e, a);
-  return /* @__PURE__ */ n("h2", {
-    id: r,
-    className: u("text-display-xs text-pho-primary max-w-full min-w-0 scroll-mt-12 truncate font-medium", t),
-    ...i,
-    children: a
-  });
-}
-function mt({ className: e, ...t }) {
-  return /* @__PURE__ */ n("p", {
-    className: u("text-display-xs text-pho-description font-normal", e),
-    ...t
-  });
-}
-function pt({ label: e, description: t, htmlFor: a, stacked: i = !1, className: r, children: o, ...c }) {
-  const { leaving: l, ...s } = Q();
-  return /* @__PURE__ */ g(v.div, {
-    ...s,
-    className: u(Te, i && "sm:flex-col sm:items-stretch sm:justify-start sm:gap-3", l && "overflow-hidden", r),
-    ...c,
-    children: [/* @__PURE__ */ g("div", {
-      className: "min-w-0",
-      children: [a ? /* @__PURE__ */ n("label", {
-        htmlFor: a,
-        className: "text-pho-primary block text-base font-normal",
-        children: e
-      }) : /* @__PURE__ */ n("div", {
-        className: "text-pho-primary text-base font-normal",
-        children: e
-      }), t ? /* @__PURE__ */ n("p", {
-        className: "text-pho-description text-xs",
-        children: t
-      }) : null]
-    }), /* @__PURE__ */ n("div", {
-      className: u("flex w-full min-w-0 items-center gap-2 sm:w-auto", i && "sm:w-full"),
-      children: o
-    })]
-  });
-}
-function ft({ className: e, ...t }) {
-  return /* @__PURE__ */ n("p", {
-    className: u("text-pho-description max-w-full min-w-0 truncate text-base", e),
-    ...t
-  });
-}
-function ht({ error: e, show: t, className: a, children: i, ...r }) {
-  const o = E(), c = S($), l = e ?? c?.error ?? void 0;
-  return /* @__PURE__ */ n(z, {
-    initial: !1,
-    children: (t ?? !0) && (l != null || i != null) ? /* @__PURE__ */ n(v.div, {
-      "data-basic-page-alert": "",
-      className: "overflow-hidden",
-      initial: {
-        height: 0,
-        opacity: 0
-      },
-      animate: {
-        height: "auto",
-        opacity: 1
-      },
-      exit: {
-        height: 0,
-        opacity: 0
-      },
-      transition: o ? { duration: 0 } : {
-        height: b,
-        opacity: A
-      },
-      children: /* @__PURE__ */ n(Ne, {
-        error: l,
-        className: u("px-5 pb-3", a),
-        ...r,
-        children: i
-      })
-    }) : null
-  });
-}
-var $ = V(null);
-function gt({ action: e, errors: t, className: a, children: i, onChange: r, ...o }) {
-  const [c, l] = N(!1), [s, d] = N(!1), [p, m] = N(null), [f, y] = N(t ?? {}), x = X(() => ({
-    pending: c,
-    dirty: s,
-    error: p
-  }), [
-    c,
-    s,
-    p
-  ]);
-  return /* @__PURE__ */ n($.Provider, {
-    value: x,
-    children: /* @__PURE__ */ n(Ce, {
-      errors: f,
-      onFormSubmit: async (w) => {
-        if (e != null) {
-          l(!0), m(null);
-          try {
-            const h = (await e(w))?.errors;
-            if (h != null && Object.keys(h).length > 0) {
-              y(h);
-              return;
-            }
-            y({}), d(!1);
-          } catch (h) {
-            m(h);
-          } finally {
-            l(!1);
-          }
-        }
-      },
-      onChange: (w) => {
-        d(!0), m(null);
-        const h = w.target.name;
-        h && h in f && y((_) => {
-          const { [h]: R, ...C } = _;
-          return C;
-        }), r?.(w);
-      },
-      className: u("contents [[data-basic-page-stack]>&]:flex [[data-basic-page-stack]>&]:min-w-0 [[data-basic-page-stack]>&]:flex-col", a),
-      ...o,
-      children: /* @__PURE__ */ n("fieldset", {
-        disabled: c,
-        "aria-busy": c || void 0,
-        className: "contents",
-        children: i
-      })
-    })
-  });
-}
-var vt = "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";
-function yt({ className: e, ...t }) {
-  const a = k(null);
-  return me(a, "Fields", 20, () => null), /* @__PURE__ */ n("div", {
-    "data-basic-page-fields": "",
-    className: u(Y, vt, e),
-    ...t,
-    ref: (i) => {
-      a.current = i;
-      const r = t.ref;
-      typeof r == "function" ? r(i) : r != null && (r.current = i);
-    }
-  });
-}
-function xt({ className: e, ...t }) {
-  return /* @__PURE__ */ n("div", {
-    className: u("flex min-w-0 flex-col gap-5 *:min-w-0 sm:flex-row sm:gap-3 sm:*:flex-1", e),
-    ...t
-  });
-}
-function bt({ children: e = "Save changes", ...t }) {
-  const a = S($);
-  return /* @__PURE__ */ n(re, {
-    type: "submit",
-    variant: "effect",
-    size: "sm",
-    loading: a?.pending,
-    ...t,
-    children: e
-  });
-}
-function Nt({ show: e, className: t, ...a }) {
-  const i = S($), r = e === "dirty" ? i?.dirty ?? !1 : e, o = /* @__PURE__ */ n("div", {
-    "data-basic-page-footer": "",
-    className: u("flex items-center justify-end gap-3 pr-[calc(1.25rem+2.5px)]", t),
-    ...a
-  });
-  return r === void 0 ? o : /* @__PURE__ */ n(pe, {
-    show: r,
-    gap: "block",
-    clip: !1,
-    children: o
-  });
-}
-var wt = {
-  stack: "-2.5rem",
-  block: "-0.75rem",
-  fields: "-1.25rem",
-  none: "0px"
-};
-function pe({ show: e, clip: t = !0, gap: a = "stack", dividers: i, className: r, ...o }) {
-  const c = E(), l = wt[i ? "none" : a], s = k(null), d = k(e !== !0);
-  P(() => {
-    d.current = !0;
-  }, []);
-  const p = () => {
-    t && s.current && (s.current.style.overflow = "hidden");
-  }, m = () => {
-    s.current && (s.current.style.overflow = "");
-  };
-  return e === void 0 ? /* @__PURE__ */ n(v.div, {
-    initial: c ? !1 : {
-      opacity: 0,
-      y: L
-    },
-    animate: {
-      opacity: 1,
-      y: 0
-    },
-    transition: {
-      y: b,
-      opacity: A
-    },
-    className: u(i && F, r),
-    ...o
-  }) : /* @__PURE__ */ n(z, {
-    initial: !1,
-    children: e ? /* @__PURE__ */ n(v.div, {
-      "data-basic-page-reveal": "",
-      ref: (f) => {
-        s.current = f, t && f && d.current && (f.style.overflow = "hidden");
-      },
-      onAnimationStart: p,
-      onAnimationComplete: m,
-      initial: {
-        height: 0,
-        opacity: 0,
-        marginTop: l
-      },
-      animate: {
-        height: "auto",
-        opacity: 1,
-        marginTop: 0
-      },
-      exit: {
-        height: 0,
-        opacity: 0,
-        marginTop: l
-      },
-      transition: c ? { duration: 0 } : {
-        height: b,
-        marginTop: b,
-        opacity: A
-      },
-      className: u(i && F, r),
-      ...o
-    }) : null
-  });
-}
-var Ct = "top-4 left-5 h-8 text-base [&>svg]:size-[1.125em] [&>svg]:shrink-0", At = "(min-width: 40rem)";
-function _t() {
-  return typeof window < "u" && typeof window.matchMedia == "function" && !window.matchMedia(At).matches;
-}
-var fe = V(null);
-function he({ className: e, children: t, ...a }) {
-  const i = W.toArray(t).filter(_e), r = i.map((R) => R.props.children ?? null), o = le();
-  Ke(r);
-  const [c] = N(_t), l = E(), s = i.length, d = ie(), p = !c && s >= Et, m = S(q), f = s > 0 ? i[s - 1]?.props : null, y = f?.children ?? "Back", x = f?.href, w = f?.onClick;
-  D(() => {
-    if (!(m == null || x == null))
-      return m.setTail({
-        label: y,
-        href: x,
-        onClick: w
-      }), () => m.setTail(null);
-  }, [
-    m,
-    y,
-    x,
-    w
-  ]);
-  const [h, _] = N(!l && !c && o != null && o.labels.length > s);
-  return /* @__PURE__ */ n("nav", {
-    "aria-label": "Breadcrumb",
-    "data-basic-page-back": "",
-    className: u("absolute top-4 left-3 flex min-w-max items-center", e),
-    ...a,
-    children: /* @__PURE__ */ g("ol", {
-      className: "m-0 flex list-none items-center p-0",
-      children: [i.map((R, C) => p && C > 0 && C < s - 2 ? null : /* @__PURE__ */ g(Ae, { children: [p && C === s - 2 && /* @__PURE__ */ g("li", {
-        className: "m-0 flex items-center max-sm:hidden",
-        children: [/* @__PURE__ */ n("span", {
-          "aria-hidden": !0,
-          className: K,
-          children: G
-        }), /* @__PURE__ */ g(T.Root, { children: [/* @__PURE__ */ n(T.Trigger, { render: /* @__PURE__ */ n(re, {
-          variant: "ghost",
-          size: "sm",
-          "aria-label": "Hidden pages",
-          className: "px-2",
-          children: Rt
-        }) }), /* @__PURE__ */ n(T.Portal, { children: /* @__PURE__ */ n(T.Positioner, {
-          align: "start",
-          sideOffset: 4,
-          children: /* @__PURE__ */ n(T.Popup, { children: i.slice(1, s - 2).map((B, M) => {
-            const I = B.props;
-            return /* @__PURE__ */ n(T.LinkItem, {
-              render: /* @__PURE__ */ n(d, {
-                href: I.href,
-                onClick: I.onClick
-              }),
-              children: I.children ?? "Back"
-            }, B.key ?? M);
-          }) })
-        }) })] })]
-      }), /* @__PURE__ */ n("li", {
-        className: u("m-0 flex items-center", C < s - 1 && "max-sm:hidden"),
-        children: /* @__PURE__ */ n(fe.Provider, {
-          value: {
-            index: C,
-            count: s,
-            departing: o,
-            narrow: c
-          },
-          children: R
-        })
-      })] }, R.key ?? C)), h && /* @__PURE__ */ n("li", {
-        "aria-hidden": !0,
-        className: "m-0 flex items-center max-sm:hidden",
-        children: /* @__PURE__ */ n(v.span, {
-          initial: { opacity: 1 },
-          animate: { opacity: 0 },
-          transition: oe,
-          onAnimationComplete: () => _(!1),
-          className: K,
-          children: G
-        })
-      })]
-    })
-  });
-}
-var K = "text-pho-description -mx-1 inline-flex shrink-0 text-base select-none", G = "/", Et = 4, Rt = "…";
-function ge({ href: e, className: t, morphId: a, children: i = "Back", ...r }) {
-  const o = S(fe), c = E(), l = a != null && !c, s = ce(l ? a : void 0);
-  if (o == null) throw new Error("BasicPage.Crumb must be rendered inside BasicPage.Breadcrumbs");
-  const { index: d, count: p, departing: m, narrow: f } = o, y = d === 0, x = d === p - 1, w = m != null && m.labels.length < p, h = m != null && m.labels.length > p, _ = x && (m == null || w || f), R = y || x, C = y && x ? "" : y ? "max-sm:hidden" : "sm:hidden", B = m != null, M = x ? f ? h ? "slide" : "fade" : _ ? "fade" : void 0 : void 0, [I, ve] = N(l && f && s.fly && m != null && !h ? m.labels[m.labels.length - 1] : null), ye = l && R && !B, xe = l && !y && x && (m == null || w);
-  return /* @__PURE__ */ g(Ee, { children: [!y && /* @__PURE__ */ n("span", {
-    "aria-hidden": !0,
-    className: u(K, "max-sm:hidden"),
-    children: xe ? /* @__PURE__ */ n(v.span, {
-      initial: s.fly ? {
-        opacity: 0,
-        x: Z
-      } : { opacity: 0 },
-      animate: s.fly ? {
-        opacity: 1,
-        x: 0
-      } : { opacity: 1 },
-      transition: s.fly ? ee : A,
-      className: "inline-flex",
-      children: G
-    }) : G
-  }), /* @__PURE__ */ n(se, {
-    variant: "ghost",
-    size: "sm",
-    href: e,
-    prefix: R ? ye ? /* @__PURE__ */ n(v.span, {
-      initial: s.fly ? {
-        opacity: 0,
-        x: Z
-      } : { opacity: 0 },
-      animate: s.fly ? {
-        opacity: 1,
-        x: 0
-      } : { opacity: 1 },
-      transition: s.fly ? ee : A,
-      className: u("inline-flex [&>svg]:size-[1.125em] [&>svg]:shrink-0", C),
-      children: /* @__PURE__ */ n(H, {})
-    }) : /* @__PURE__ */ n("span", {
-      className: u("inline-flex [&>svg]:size-[1.125em] [&>svg]:shrink-0", C),
-      children: /* @__PURE__ */ n(H, {})
-    }) : /* @__PURE__ */ n("span", { className: "hidden" }),
-    className: u("min-w-max", t),
-    ...r,
-    children: l && a != null ? /* @__PURE__ */ g("span", {
-      className: u("relative block", !s.fly && M === "slide" && "overflow-hidden", !x && "max-w-40 truncate"),
-      children: [/* @__PURE__ */ n(ue, {
-        morphId: a,
-        fromClassName: "text-pho-primary",
-        fly: s.fly,
-        morphRef: s.ref,
-        arrival: M,
-        children: i
-      }), I != null && /* @__PURE__ */ n(v.span, {
-        "aria-hidden": !0,
-        initial: {
-          x: 0,
-          opacity: 1
-        },
-        animate: {
-          x: ze,
-          opacity: 0
-        },
-        transition: $e,
-        onAnimationComplete: () => ve(null),
-        className: "pointer-events-none absolute inset-y-0 left-0 whitespace-nowrap",
-        children: I
-      })]
-    }) : /* @__PURE__ */ n("span", {
-      className: u("block", !x && "max-w-40 truncate"),
-      children: i
-    })
-  })] });
-}
-function kt({ className: e, ...t }) {
-  return /* @__PURE__ */ n(he, {
-    className: e,
-    children: /* @__PURE__ */ n(ge, { ...t })
-  });
-}
-function St({ label: e, description: t, leading: a, href: i, className: r, children: o, ...c }) {
-  const l = ie(), s = X(() => v.create(l), [l]), { leaving: d, ...p } = Q();
-  return /* @__PURE__ */ g(s, {
-    href: i,
-    ...p,
-    ...c,
-    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", "first:rounded-t-[calc(var(--radius-base)-1px)] last:rounded-b-[calc(var(--radius-base)-1px)]", d && "overflow-hidden", r),
-    children: [/* @__PURE__ */ g("div", {
-      className: u("flex min-w-0 flex-1 items-center", a != null && "gap-3"),
-      children: [a, /* @__PURE__ */ g("div", {
-        className: "min-w-0",
-        children: [/* @__PURE__ */ n("div", {
-          className: "flex min-w-0 items-center gap-1",
-          children: typeof e == "string" || typeof e == "number" ? /* @__PURE__ */ n("p", {
-            className: "text-pho-primary truncate text-base font-medium",
-            children: e
-          }) : e
-        }), t ? /* @__PURE__ */ n("div", {
-          className: "text-pho-description truncate text-xs",
-          children: t
-        }) : null]
-      })]
-    }), /* @__PURE__ */ g("div", {
-      className: "flex min-w-0 items-center justify-end gap-2",
-      children: [o != null ? /* @__PURE__ */ n("div", {
-        className: "min-w-0",
-        children: o
-      }) : null, /* @__PURE__ */ n(Se, {
-        "aria-hidden": !0,
-        className: "text-pho-secondary group-hover:text-pho-secondary-hover size-4 shrink-0 transition-colors"
-      })]
-    })]
-  });
-}
-var zt = {
-  Root: Be,
-  Breadcrumbs: he,
-  Crumb: ge,
-  Back: kt,
-  Title: Qe,
-  Stack: nt,
-  Header: at,
-  SectionTitle: it,
-  Description: rt,
-  SectionFooter: st,
-  Card: ot,
-  Item: lt,
-  ItemPanel: ct,
-  Callout: ut,
-  CalloutTitle: dt,
-  CalloutDescription: mt,
-  Row: pt,
-  RowLink: St,
-  Value: ft,
-  Alert: ht,
-  Footer: Nt,
-  Form: gt,
-  Fields: yt,
-  Inline: xt,
-  Submit: bt,
-  Reveal: pe
-};
-export {
-  Pe as a,
-  Le as i,
-  Ie as n,
-  Te as o,
-  Oe as r,
-  zt as s,
-  J as t
-};
-
-//# sourceMappingURL=basic-page-BkLG3Ybg.js.map