@photon-ai/pho-ui 2.4.0 → 2.5.0

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

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