@photon-ai/pho-ui 2.5.0 → 2.7.0

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

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