@orangecheck/app-design 1.3.0 → 1.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/dist/chrome.d.mts +11 -5
  2. package/dist/chrome.d.ts +11 -5
  3. package/dist/chrome.js +985 -952
  4. package/dist/chrome.js.map +1 -1
  5. package/dist/chrome.mjs +986 -954
  6. package/dist/chrome.mjs.map +1 -1
  7. package/dist/code.js +3 -1
  8. package/dist/code.js.map +1 -1
  9. package/dist/code.mjs +3 -1
  10. package/dist/code.mjs.map +1 -1
  11. package/dist/components.d.mts +7 -5
  12. package/dist/components.d.ts +7 -5
  13. package/dist/components.js +697 -617
  14. package/dist/components.js.map +1 -1
  15. package/dist/components.mjs +697 -617
  16. package/dist/components.mjs.map +1 -1
  17. package/dist/{docs-Dxg4Tp_q.d.ts → docs-ByUx4t-D.d.ts} +19 -4
  18. package/dist/{docs-wJBfLS08.d.mts → docs-CFE5mU_6.d.mts} +19 -4
  19. package/dist/index.d.mts +3 -3
  20. package/dist/index.d.ts +3 -3
  21. package/dist/index.js +1665 -1519
  22. package/dist/index.js.map +1 -1
  23. package/dist/index.mjs +1665 -1520
  24. package/dist/index.mjs.map +1 -1
  25. package/dist/mdx.d.mts +6 -2
  26. package/dist/mdx.d.ts +6 -2
  27. package/dist/mdx.js +175 -76
  28. package/dist/mdx.js.map +1 -1
  29. package/dist/mdx.mjs +176 -77
  30. package/dist/mdx.mjs.map +1 -1
  31. package/dist/primitives.d.mts +3 -3
  32. package/dist/primitives.d.ts +3 -3
  33. package/dist/primitives.js +10 -1
  34. package/dist/primitives.js.map +1 -1
  35. package/dist/primitives.mjs +10 -1
  36. package/dist/primitives.mjs.map +1 -1
  37. package/dist/session.d.mts +2 -2
  38. package/dist/session.d.ts +2 -2
  39. package/dist/session.js +1 -1
  40. package/dist/session.js.map +1 -1
  41. package/dist/session.mjs +1 -1
  42. package/dist/session.mjs.map +1 -1
  43. package/dist/styles/swagger.css +252 -0
  44. package/dist/styles/tokens.css +2 -0
  45. package/dist/{tool-shell-zncroOEQ.d.mts → tool-shell-D8Q8XX11.d.mts} +3 -2
  46. package/dist/{tool-shell-Be4Q0cNN.d.ts → tool-shell-gmlj47Ie.d.ts} +3 -2
  47. package/package.json +3 -2
package/dist/index.mjs CHANGED
@@ -4,6 +4,7 @@ import { forwardRef, useContext, createContext, useRef, useState, useCallback, u
4
4
  import { clsx } from 'clsx';
5
5
  import { extendTailwindMerge } from 'tailwind-merge';
6
6
  import * as SeparatorPrimitive from '@radix-ui/react-separator';
7
+ import { useTheme } from 'next-themes';
7
8
  import { Toaster as Toaster$1 } from 'sonner';
8
9
  export { toast } from 'sonner';
9
10
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -12,16 +13,15 @@ import * as LabelPrimitive from '@radix-ui/react-label';
12
13
  import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
13
14
  import * as SelectPrimitive from '@radix-ui/react-select';
14
15
  import * as SwitchPrimitive from '@radix-ui/react-switch';
15
- import { ChevronDown, Check, X, Search, ArrowUpRight, ArrowRight, Copy, ChevronLeft, ChevronRight, CornerDownLeft, Download, FileText, Upload, Menu, PanelLeft, Sun, Moon, SunMoon, CircleUser, LogOut, ArrowLeft, Lock, CircleDashed, CircleMinus, CircleSlash, Clock, CircleX, CircleCheck } from 'lucide-react';
16
+ import { ChevronDown, Check, X, Search, ArrowUpRight, ArrowRight, Copy, ChevronLeft, ChevronRight, CornerDownLeft, Download, FileText, Upload, Menu, Sun, Moon, SunMoon, PanelLeft, CircleUser, LogOut, ArrowLeft, Lock, CircleDashed, CircleMinus, CircleSlash, Clock, CircleX, CircleCheck } from 'lucide-react';
16
17
  import * as DialogPrimitive from '@radix-ui/react-dialog';
17
18
  import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
18
19
  import * as PopoverPrimitive from '@radix-ui/react-popover';
19
20
  import * as TooltipPrimitive from '@radix-ui/react-tooltip';
20
21
  import * as TabsPrimitive from '@radix-ui/react-tabs';
21
22
  import QRCode from 'qrcode';
22
- import Link8 from 'next/link';
23
+ import Link6 from 'next/link';
23
24
  import { useRouter } from 'next/compat/router';
24
- import { useTheme } from 'next-themes';
25
25
 
26
26
  // src/tokens/index.ts
27
27
  var APP_ATTRIBUTE = "data-oc-app";
@@ -173,10 +173,18 @@ function StatusDot({
173
173
  }
174
174
  );
175
175
  }
176
- function Toaster(props) {
176
+ var TOAST_COLOURS = {
177
+ "--normal-bg": "var(--popover)",
178
+ "--normal-text": "var(--popover-foreground)",
179
+ "--normal-border": "var(--border)"
180
+ };
181
+ function Toaster({ style, ...props }) {
182
+ const { resolvedTheme } = useTheme();
177
183
  return /* @__PURE__ */ jsx(
178
184
  Toaster$1,
179
185
  {
186
+ theme: resolvedTheme === "dark" ? "dark" : resolvedTheme === "light" ? "light" : "system",
187
+ style: { ...TOAST_COLOURS, ...style },
180
188
  position: "bottom-right",
181
189
  toastOptions: {
182
190
  classNames: {
@@ -2971,11 +2979,13 @@ function forClipboard(text, lang) {
2971
2979
  if (!lines.some((l) => l.startsWith("$ "))) return text;
2972
2980
  return lines.filter((l) => l.startsWith("$ ")).map((l) => l.slice(2)).join("\n");
2973
2981
  }
2974
- function linesFromDom(pre) {
2982
+ function linesFromDom(pre, newline) {
2975
2983
  if (!pre) return null;
2976
2984
  const lines = pre.querySelectorAll("[data-line]");
2977
2985
  if (lines.length === 0) return pre.textContent ?? "";
2978
- return Array.from(lines).filter((l) => l.getAttribute("data-diff") !== "remove").map((l) => l.textContent ?? "").join("\n");
2986
+ const text = Array.from(lines).filter((l) => l.getAttribute("data-diff") !== "remove").map((l) => l.textContent ?? "").join("\n");
2987
+ return newline ? `${text}
2988
+ ` : text;
2979
2989
  }
2980
2990
  function prepare(code, lang, marks, diff) {
2981
2991
  const d = diff ? readDiff(code) : null;
@@ -2984,7 +2994,8 @@ function prepare(code, lang, marks, diff) {
2984
2994
  const kept = d ? src.split("\n").filter((_, i) => d.diff.get(i + 1) !== "remove") : null;
2985
2995
  return {
2986
2996
  html: linesToHtml(lines, { highlight: parseLineRanges(marks), diff: d?.diff }),
2987
- copy: kept ? kept.join("\n") : src,
2997
+ // Byte for byte, the final newline too: a hash printed beside the code must match a copy of it.
2998
+ copy: kept ? kept.join("\n") + (/\n$/.test(code) ? "\n" : "") : code,
2988
2999
  lines: lines.length,
2989
3000
  diff: !!d
2990
3001
  };
@@ -2997,7 +3008,8 @@ function Well({
2997
3008
  lines,
2998
3009
  maxLines,
2999
3010
  diff,
3000
- lineNumbers
3011
+ lineNumbers,
3012
+ wrap
3001
3013
  }) {
3002
3014
  const foldable = maxLines !== void 0 && lines > maxLines + 2;
3003
3015
  const [open, setOpen] = useState(false);
@@ -3016,7 +3028,8 @@ function Well({
3016
3028
  "data-diff": diff ? "" : void 0,
3017
3029
  "data-line-numbers": lineNumbers ? "" : void 0,
3018
3030
  className: cn(
3019
- "oca-code w-max min-w-full py-4 font-mono text-[0.875rem] leading-[1.625] text-oca-ink-muted [font-variant-ligatures:none]",
3031
+ "oca-code py-4 font-mono text-[0.875rem] leading-[1.625] text-oca-ink-muted [font-variant-ligatures:none]",
3032
+ wrap ? "whitespace-pre-wrap break-all" : "w-max min-w-full",
3020
3033
  !lined && "px-5"
3021
3034
  ),
3022
3035
  children: lined ? /* @__PURE__ */ jsx("code", { className: "block", "data-lang": lang, dangerouslySetInnerHTML: { __html: html } }) : /* @__PURE__ */ jsx("code", { className: "block", "data-lang": lang, children })
@@ -3049,6 +3062,7 @@ function CodeBlock({
3049
3062
  code,
3050
3063
  html,
3051
3064
  children,
3065
+ trailingNewline = false,
3052
3066
  lang,
3053
3067
  caption,
3054
3068
  copy = true,
@@ -3057,6 +3071,7 @@ function CodeBlock({
3057
3071
  highlight: marks,
3058
3072
  diff,
3059
3073
  lineNumbers,
3074
+ wrap,
3060
3075
  actions,
3061
3076
  className
3062
3077
  }) {
@@ -3069,7 +3084,7 @@ function CodeBlock({
3069
3084
  );
3070
3085
  const markup = prepared?.html ?? html;
3071
3086
  const lines = prepared?.lines ?? (html !== void 0 ? html.split("\n").length : code?.split("\n").length ?? 0);
3072
- const read = () => forClipboard(prepared?.copy ?? linesFromDom(preRef.current) ?? code ?? "", lang);
3087
+ const read = () => forClipboard(prepared?.copy ?? linesFromDom(preRef.current, trailingNewline) ?? code ?? "", lang);
3073
3088
  return /* @__PURE__ */ jsxs("figure", { className: cn(FRAME, className), children: [
3074
3089
  /* @__PURE__ */ jsxs("figcaption", { className: "flex h-11 items-center justify-between gap-3 border-b border-[var(--oca-code-line)] pl-5 pr-2", children: [
3075
3090
  /* @__PURE__ */ jsx("span", { className: "truncate text-[0.8125rem] text-oca-ink-subtle", children: caption ?? languageName(lang) ?? "Code" }),
@@ -3088,6 +3103,7 @@ function CodeBlock({
3088
3103
  maxLines,
3089
3104
  diff: prepared ? prepared.diff : isDiff,
3090
3105
  lineNumbers,
3106
+ wrap,
3091
3107
  children
3092
3108
  }
3093
3109
  )
@@ -3552,6 +3568,169 @@ var ErrorBoundary = class extends Component {
3552
3568
  ) });
3553
3569
  }
3554
3570
  };
3571
+
3572
+ // src/family/index.ts
3573
+ var OCHK_IO = "https://ochk.io";
3574
+ var DOCS_HREF = `${OCHK_IO}/docs`;
3575
+ function protocol(slug, verb, line, kinds) {
3576
+ return {
3577
+ slug,
3578
+ label: slug,
3579
+ href: `${OCHK_IO}/${slug}`,
3580
+ group: "protocol",
3581
+ line,
3582
+ status: "live",
3583
+ verb,
3584
+ pageHref: `${OCHK_IO}/${slug}`,
3585
+ toolHref: `https://${slug}.ochk.io`,
3586
+ specHref: `https://github.com/orangecheck/oc-${slug}-protocol`,
3587
+ kinds
3588
+ };
3589
+ }
3590
+ var PROTOCOLS = [
3591
+ protocol("attest", "identity", "Show that an address holds bitcoin, and for how long.", "30078"),
3592
+ protocol("lock", "confidentiality", "Encrypt to a Bitcoin address, so only its holder can open it.", "30078"),
3593
+ protocol("vote", "legitimacy", "Polls weighed in sats, that anyone can tally.", "30080\u201330082"),
3594
+ protocol("stamp", "provenance", "Prove who signed something, and when.", "30083"),
3595
+ protocol("agent", "authority", "Give software scoped, revocable permission to act for you.", "30083\u201330086"),
3596
+ protocol("pledge", "commitment", "Make a promise with bitcoin behind it, on a public record.", "30078")
3597
+ ];
3598
+ var PROTOCOL_ORDER = PROTOCOLS.map((p) => p.slug);
3599
+ var FAMILY = [
3600
+ {
3601
+ slug: "home",
3602
+ label: "ochk.io",
3603
+ href: OCHK_IO,
3604
+ group: "orangecheck",
3605
+ line: "The open protocols, and the company behind them.",
3606
+ status: "live"
3607
+ },
3608
+ {
3609
+ slug: "me",
3610
+ label: "ochk.app",
3611
+ href: "https://ochk.app",
3612
+ group: "orangecheck",
3613
+ line: "One account, with Bitcoin behind it.",
3614
+ status: "testing"
3615
+ },
3616
+ {
3617
+ slug: "docs",
3618
+ label: "docs",
3619
+ href: DOCS_HREF,
3620
+ group: "orangecheck",
3621
+ line: "Specs, SDKs and guides for every protocol.",
3622
+ status: "live"
3623
+ },
3624
+ ...PROTOCOLS,
3625
+ {
3626
+ slug: "vault",
3627
+ label: "vault",
3628
+ href: "https://vault.ochk.io",
3629
+ group: "app",
3630
+ line: "A password manager, encrypted in your browser.",
3631
+ status: "live",
3632
+ protocols: ["lock"]
3633
+ },
3634
+ {
3635
+ slug: "chat",
3636
+ label: "chat",
3637
+ href: "https://chat.ochk.io",
3638
+ group: "app",
3639
+ line: "Messages only the holder of a Bitcoin address can read.",
3640
+ status: "testing",
3641
+ protocols: ["lock"]
3642
+ },
3643
+ {
3644
+ slug: "cosign",
3645
+ label: "cosign",
3646
+ href: "https://cosign.ochk.io",
3647
+ group: "app",
3648
+ line: "Builders find co-founders and backers.",
3649
+ status: "testing",
3650
+ // Signs in with an orangecheck account and a wallet; uses none of the six directly.
3651
+ protocols: []
3652
+ },
3653
+ {
3654
+ slug: "me-demo",
3655
+ // "demo", not the made-up app's own name, so nobody takes it for ours.
3656
+ label: "demo",
3657
+ href: "https://me-demo.ochk.io",
3658
+ group: "app",
3659
+ line: "Lumen Notes, a made-up app that signs in with orangecheck.",
3660
+ status: "live"
3661
+ },
3662
+ {
3663
+ slug: "globe",
3664
+ label: "globe",
3665
+ href: "https://globe.ochk.io",
3666
+ group: "public-good",
3667
+ line: "The Bitcoin network, live, on a globe.",
3668
+ status: "live"
3669
+ },
3670
+ {
3671
+ slug: "btc",
3672
+ label: "btc",
3673
+ href: "https://btc.ochk.io",
3674
+ group: "public-good",
3675
+ line: "A free desk for reading the Bitcoin market.",
3676
+ status: "live"
3677
+ }
3678
+ ];
3679
+ var FAMILY_GROUPS = [
3680
+ { id: "orangecheck", label: "orangecheck" },
3681
+ { id: "protocol", label: "Protocols" },
3682
+ { id: "app", label: "Apps" },
3683
+ { id: "public-good", label: "Public goods" }
3684
+ ];
3685
+ var BY_SLUG = new Map(FAMILY.map((s) => [s.slug, s]));
3686
+ function familySite(slug) {
3687
+ return BY_SLUG.get(slug);
3688
+ }
3689
+ function protocolSite(slug) {
3690
+ return BY_SLUG.get(slug);
3691
+ }
3692
+ function familyByGroup() {
3693
+ return FAMILY_GROUPS.map((g) => ({ ...g, sites: FAMILY.filter((s) => s.group === g.id) }));
3694
+ }
3695
+ var LEGAL_LINKS = [
3696
+ { href: `${OCHK_IO}/privacy`, label: "Privacy" },
3697
+ { href: `${OCHK_IO}/terms`, label: "Terms" },
3698
+ { href: `${OCHK_IO}/security`, label: "Security" },
3699
+ { href: `${OCHK_IO}/trademark`, label: "Trademarks" },
3700
+ { href: `${OCHK_IO}/contact`, label: "Contact" }
3701
+ ];
3702
+ var SELF_HOSTED_LEGAL_LINKS = [
3703
+ { href: "/privacy", label: "Privacy" },
3704
+ { href: "/terms", label: "Terms" },
3705
+ { href: "/security", label: "Security" },
3706
+ { href: `${OCHK_IO}/trademark`, label: "Trademarks" },
3707
+ { href: "/contact", label: "Contact" }
3708
+ ];
3709
+ var OCHK_IO_NAV = [
3710
+ {
3711
+ href: `${OCHK_IO}/protocols`,
3712
+ label: "Protocols",
3713
+ children: PROTOCOLS.map((p) => ({ href: p.pageHref, label: p.label, description: p.line }))
3714
+ },
3715
+ { href: `${OCHK_IO}/apps`, label: "Apps" },
3716
+ { href: DOCS_HREF, label: "Docs" },
3717
+ { href: `${OCHK_IO}/trust`, label: "Trust" },
3718
+ { href: `${OCHK_IO}/about`, label: "About" }
3719
+ ];
3720
+ var OCHK_IO_FOOTER = [
3721
+ {
3722
+ heading: "Company",
3723
+ links: [
3724
+ { href: `${OCHK_IO}/about`, label: "About" },
3725
+ { href: `${OCHK_IO}/trust`, label: "Trust" },
3726
+ { href: "https://github.com/orangecheck", label: "GitHub", external: true }
3727
+ ]
3728
+ }
3729
+ ];
3730
+ var SiteHomeContext = sharedContext("site-home", void 0);
3731
+ function useSiteHome() {
3732
+ return useContext(SiteHomeContext);
3733
+ }
3555
3734
  var WORDS = {
3556
3735
  404: {
3557
3736
  name: "Not found",
@@ -3569,10 +3748,13 @@ function ErrorPage({
3569
3748
  title,
3570
3749
  detail,
3571
3750
  actions,
3572
- home = "/",
3751
+ home,
3752
+ protocol: protocol2,
3573
3753
  art,
3574
3754
  className
3575
3755
  }) {
3756
+ const shellHome = useSiteHome();
3757
+ const homeHref = home ?? (protocol2 ? protocolSite(protocol2).pageHref : shellHome ?? OCHK_IO);
3576
3758
  const words = WORDS[code] ?? (code >= 500 ? WORDS[500] : WORDS[404]);
3577
3759
  const server = code >= 500;
3578
3760
  return /* @__PURE__ */ jsx(Section, { space: "none", className: cn("flex min-h-[min(40rem,72dvh)] items-center py-16 md:py-24", className), children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 items-center gap-12 md:grid-cols-12", children: [
@@ -3586,7 +3768,7 @@ function ErrorPage({
3586
3768
  /* @__PURE__ */ jsx("p", { className: "oca-lead oca-enter [--enter-delay:150ms]", children: detail ?? words.detail }),
3587
3769
  /* @__PURE__ */ jsx("div", { className: "oca-enter flex flex-wrap gap-3 [--enter-delay:230ms]", children: actions ?? /* @__PURE__ */ jsxs(Fragment, { children: [
3588
3770
  server ? /* @__PURE__ */ jsx(Button, { onClick: () => window.location.reload(), children: "Try again" }) : null,
3589
- /* @__PURE__ */ jsx(Button, { asChild: true, variant: server ? "secondary" : "primary", children: /* @__PURE__ */ jsx(Link8, { href: home, children: "Go home" }) })
3771
+ /* @__PURE__ */ jsx(Button, { asChild: true, variant: server ? "secondary" : "primary", children: /* @__PURE__ */ jsx(Link6, { href: homeHref, children: "Go home" }) })
3590
3772
  ] }) })
3591
3773
  ] }),
3592
3774
  art !== null ? /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "oca-enter hidden justify-center md:col-span-5 md:flex [--enter-delay:120ms]", children: art ?? /* @__PURE__ */ jsx(MarkOutline, { className: "w-full max-w-[20rem] text-oca-hairline-strong" }) }) : null
@@ -3705,16 +3887,25 @@ function Faq({
3705
3887
  return /* @__PURE__ */ jsx(Accordion, { single: true, className, children: items.map((it, i) => /* @__PURE__ */ jsx(AccordionItem, { id: it.id, title: it.q, children: it.a }, it.id ?? i)) });
3706
3888
  }
3707
3889
  var LINK = "text-foreground underline decoration-foreground/35 underline-offset-4 transition-colors hover:decoration-foreground";
3890
+ var SCHEME = /^[a-z][a-z\d+.-]*:/i;
3891
+ function useResolved(href) {
3892
+ const router = useRouter();
3893
+ if (!router || !href || href.startsWith("/") || href.startsWith("#") || href.startsWith("?") || SCHEME.test(href)) return href;
3894
+ const here = router.asPath.split(/[?#]/)[0] || "/";
3895
+ const url = new URL(href, `https://page.invalid${here}`);
3896
+ return url.pathname + url.search + url.hash;
3897
+ }
3708
3898
  function TextLink({
3709
- href,
3899
+ href: written,
3710
3900
  children,
3711
3901
  external,
3712
3902
  className
3713
3903
  }) {
3904
+ const href = useResolved(written);
3714
3905
  const internal = href.startsWith("/") && !href.startsWith("/api/") && !href.startsWith("/.well-known/");
3715
3906
  const offsite = external ?? /^https?:\/\//.test(href);
3716
3907
  if (internal && !offsite) {
3717
- return /* @__PURE__ */ jsx(Link8, { href, className: cn(LINK, className), children });
3908
+ return /* @__PURE__ */ jsx(Link6, { href, className: cn(LINK, className), children });
3718
3909
  }
3719
3910
  return /* @__PURE__ */ jsxs("a", { href, className: cn(LINK, className), ...offsite ? { target: "_blank", rel: "noreferrer" } : {}, children: [
3720
3911
  children,
@@ -3823,165 +4014,10 @@ function LegalDocument({ doc, className }) {
3823
4014
  }
3824
4015
  );
3825
4016
  }
3826
-
3827
- // src/family/index.ts
3828
- var OCHK_IO = "https://ochk.io";
3829
- var DOCS_HREF = `${OCHK_IO}/docs`;
3830
- function protocol(slug, verb, line, kinds) {
3831
- return {
3832
- slug,
3833
- label: slug,
3834
- href: `${OCHK_IO}/${slug}`,
3835
- group: "protocol",
3836
- line,
3837
- status: "live",
3838
- verb,
3839
- pageHref: `${OCHK_IO}/${slug}`,
3840
- toolHref: `https://${slug}.ochk.io`,
3841
- specHref: `https://github.com/orangecheck/oc-${slug}-protocol`,
3842
- kinds
3843
- };
4017
+ var InDocsContext = sharedContext("in-docs", false);
4018
+ function useInDocs() {
4019
+ return useContext(InDocsContext);
3844
4020
  }
3845
- var PROTOCOLS = [
3846
- protocol("attest", "identity", "Show that an address holds bitcoin, and for how long.", "30078"),
3847
- protocol("lock", "confidentiality", "Encrypt to a Bitcoin address, so only its holder can open it.", "30078"),
3848
- protocol("vote", "legitimacy", "Polls weighed in sats, that anyone can tally.", "30080\u201330082"),
3849
- protocol("stamp", "provenance", "Prove who signed something, and when.", "30083"),
3850
- protocol("agent", "authority", "Give software scoped, revocable permission to act for you.", "30083\u201330086"),
3851
- protocol("pledge", "commitment", "Make a promise with bitcoin behind it, on a public record.", "30078")
3852
- ];
3853
- var PROTOCOL_ORDER = PROTOCOLS.map((p) => p.slug);
3854
- var FAMILY = [
3855
- {
3856
- slug: "home",
3857
- label: "ochk.io",
3858
- href: OCHK_IO,
3859
- group: "orangecheck",
3860
- line: "The open protocols, and the company behind them.",
3861
- status: "live"
3862
- },
3863
- {
3864
- slug: "me",
3865
- label: "ochk.app",
3866
- href: "https://ochk.app",
3867
- group: "orangecheck",
3868
- line: "One account, with Bitcoin behind it.",
3869
- status: "testing"
3870
- },
3871
- {
3872
- slug: "docs",
3873
- label: "docs",
3874
- href: DOCS_HREF,
3875
- group: "orangecheck",
3876
- line: "Specs, SDKs and guides for every protocol.",
3877
- status: "live"
3878
- },
3879
- ...PROTOCOLS,
3880
- {
3881
- slug: "vault",
3882
- label: "vault",
3883
- href: "https://vault.ochk.io",
3884
- group: "app",
3885
- line: "A password manager, encrypted in your browser.",
3886
- status: "live",
3887
- protocols: ["lock"]
3888
- },
3889
- {
3890
- slug: "chat",
3891
- label: "chat",
3892
- href: "https://chat.ochk.io",
3893
- group: "app",
3894
- line: "Messages only the holder of a Bitcoin address can read.",
3895
- status: "testing",
3896
- protocols: ["lock"]
3897
- },
3898
- {
3899
- slug: "cosign",
3900
- label: "cosign",
3901
- href: "https://cosign.ochk.io",
3902
- group: "app",
3903
- line: "Builders find co-founders and backers.",
3904
- status: "testing",
3905
- // Signs in with an orangecheck account and a wallet; uses none of the six directly.
3906
- protocols: []
3907
- },
3908
- {
3909
- slug: "me-demo",
3910
- // "demo", not the made-up app's own name, so nobody takes it for ours.
3911
- label: "demo",
3912
- href: "https://me-demo.ochk.io",
3913
- group: "app",
3914
- line: "Lumen Notes, a made-up app that signs in with orangecheck.",
3915
- status: "live"
3916
- },
3917
- {
3918
- slug: "globe",
3919
- label: "globe",
3920
- href: "https://globe.ochk.io",
3921
- group: "public-good",
3922
- line: "The Bitcoin network, live, on a globe.",
3923
- status: "live"
3924
- },
3925
- {
3926
- slug: "btc",
3927
- label: "btc",
3928
- href: "https://btc.ochk.io",
3929
- group: "public-good",
3930
- line: "A free desk for reading the Bitcoin market.",
3931
- status: "live"
3932
- }
3933
- ];
3934
- var FAMILY_GROUPS = [
3935
- { id: "orangecheck", label: "orangecheck" },
3936
- { id: "protocol", label: "Protocols" },
3937
- { id: "app", label: "Apps" },
3938
- { id: "public-good", label: "Public goods" }
3939
- ];
3940
- var BY_SLUG = new Map(FAMILY.map((s) => [s.slug, s]));
3941
- function familySite(slug) {
3942
- return BY_SLUG.get(slug);
3943
- }
3944
- function protocolSite(slug) {
3945
- return BY_SLUG.get(slug);
3946
- }
3947
- function familyByGroup() {
3948
- return FAMILY_GROUPS.map((g) => ({ ...g, sites: FAMILY.filter((s) => s.group === g.id) }));
3949
- }
3950
- var LEGAL_LINKS = [
3951
- { href: `${OCHK_IO}/privacy`, label: "Privacy" },
3952
- { href: `${OCHK_IO}/terms`, label: "Terms" },
3953
- { href: `${OCHK_IO}/security`, label: "Security" },
3954
- { href: `${OCHK_IO}/trademark`, label: "Trademarks" },
3955
- { href: `${OCHK_IO}/contact`, label: "Contact" }
3956
- ];
3957
- var SELF_HOSTED_LEGAL_LINKS = [
3958
- { href: "/privacy", label: "Privacy" },
3959
- { href: "/terms", label: "Terms" },
3960
- { href: "/security", label: "Security" },
3961
- { href: `${OCHK_IO}/trademark`, label: "Trademarks" },
3962
- { href: "/contact", label: "Contact" }
3963
- ];
3964
- var OCHK_IO_NAV = [
3965
- {
3966
- href: `${OCHK_IO}/protocols`,
3967
- label: "Protocols",
3968
- children: PROTOCOLS.map((p) => ({ href: p.pageHref, label: p.label, description: p.line }))
3969
- },
3970
- { href: `${OCHK_IO}/apps`, label: "Apps" },
3971
- { href: DOCS_HREF, label: "Docs" },
3972
- { href: `${OCHK_IO}/trust`, label: "Trust" },
3973
- { href: `${OCHK_IO}/about`, label: "About" }
3974
- ];
3975
- var OCHK_IO_FOOTER = [
3976
- {
3977
- heading: "Company",
3978
- links: [
3979
- { href: `${OCHK_IO}/about`, label: "About" },
3980
- { href: `${OCHK_IO}/trust`, label: "Trust" },
3981
- { href: "https://github.com/orangecheck", label: "GitHub", external: true }
3982
- ]
3983
- }
3984
- ];
3985
4021
  var CARD = "group relative flex h-full flex-col rounded-[1.25rem] border border-border bg-card p-6 transition-colors hover:border-oca-hairline-strong md:p-7 has-[a:focus-visible]:ring-2 has-[a:focus-visible]:ring-ring has-[a:focus-visible]:ring-offset-2 has-[a:focus-visible]:ring-offset-background";
3986
4022
  var STRETCH = 'outline-none after:absolute after:inset-0 after:rounded-[1.25rem] after:content-[""]';
3987
4023
  var pad2 = (n) => String(n + 1).padStart(2, "0");
@@ -3990,6 +4026,7 @@ function ProtocolGrid({
3990
4026
  link = "page",
3991
4027
  className
3992
4028
  }) {
4029
+ const inDocs = useInDocs();
3993
4030
  return /* @__PURE__ */ jsx("ul", { className: cn("grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 md:gap-5", className), children: protocols.map((slug) => {
3994
4031
  const p = protocolSite(slug);
3995
4032
  const i = PROTOCOL_ORDER.indexOf(slug);
@@ -4002,7 +4039,7 @@ function ProtocolGrid({
4002
4039
  ] }),
4003
4040
  p.status !== "live" ? /* @__PURE__ */ jsx(StatusBadge, { status: p.status }) : null
4004
4041
  ] }),
4005
- /* @__PURE__ */ jsx("h3", { className: "oca-display-3", children: /* @__PURE__ */ jsx(
4042
+ /* @__PURE__ */ jsx("h3", { className: "oca-display-3", children: link === "docs" && inDocs ? /* @__PURE__ */ jsx(Link6, { href: `/${p.slug}`, className: STRETCH, children: p.label }) : /* @__PURE__ */ jsx(
4006
4043
  "a",
4007
4044
  {
4008
4045
  href: link === "tool" ? p.toolHref : link === "docs" ? `${DOCS_HREF}/${p.slug}` : p.pageHref,
@@ -4060,203 +4097,627 @@ function AppGrid({
4060
4097
  const list = sites ? sites.map((slug) => FAMILY.find((s) => s.slug === slug)).filter((s) => s !== void 0) : FAMILY.filter((s) => s.group === group);
4061
4098
  return /* @__PURE__ */ jsx("ul", { className: cn("grid grid-cols-1 gap-4 sm:grid-cols-2 md:gap-5", className), children: list.map((s) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(AppCard, { name: s.label, line: s.line, href: s.href, protocols: s.protocols, status: s.status }) }, s.slug)) });
4062
4099
  }
4063
- function ProtocolHero({
4064
- protocol: protocol2,
4100
+ var isInternal = (href) => href.startsWith("/") || href.startsWith("#");
4101
+ function DocLink({ href, className, children, ...rest }) {
4102
+ return isInternal(href) ? /* @__PURE__ */ jsx(Link6, { href, className, ...rest, children }) : /* @__PURE__ */ jsx("a", { href, className, ...rest, children });
4103
+ }
4104
+ function Breadcrumbs({ items, action, className }) {
4105
+ return /* @__PURE__ */ jsxs("div", { className: cn("flex min-h-11 items-center justify-between gap-4 sm:min-h-0", className), children: [
4106
+ /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: "min-w-0", children: /* @__PURE__ */ jsx("ol", { className: "flex min-w-0 items-center gap-1.5 text-[0.875rem] text-muted-foreground", children: items.map((c, i) => {
4107
+ const last = i === items.length - 1;
4108
+ return /* @__PURE__ */ jsxs("li", { className: cn("flex items-center gap-1.5", last ? "min-w-0" : "shrink-0"), children: [
4109
+ c.href && !last ? /* @__PURE__ */ jsx(DocLink, { href: c.href, className: "inline-flex min-h-11 items-center transition-colors hover:text-foreground sm:min-h-0", children: c.label }) : /* @__PURE__ */ jsx("span", { "aria-current": last ? "page" : void 0, className: cn("truncate", last && "text-foreground"), children: c.label }),
4110
+ !last ? /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": true, className: "size-3.5 shrink-0 text-oca-subtle" }) : null
4111
+ ] }, i);
4112
+ }) }) }),
4113
+ action ? /* @__PURE__ */ jsx("div", { className: "shrink-0 text-[0.875rem]", children: action }) : null
4114
+ ] });
4115
+ }
4116
+ function DocsPager({ prev, next, className }) {
4117
+ if (!prev && !next) return null;
4118
+ const card = (l, dir) => /* @__PURE__ */ jsxs(
4119
+ DocLink,
4120
+ {
4121
+ href: l.href,
4122
+ className: cn(
4123
+ "group flex min-h-20 flex-col justify-center gap-1 rounded-2xl border border-border bg-card px-5 py-4 transition-colors hover:border-oca-hairline-strong",
4124
+ dir === "next" && "items-end text-right sm:col-start-2"
4125
+ ),
4126
+ children: [
4127
+ /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 text-[0.8125rem] text-muted-foreground", children: [
4128
+ dir === "prev" ? /* @__PURE__ */ jsx(ArrowLeft, { "aria-hidden": true, className: "size-3.5" }) : null,
4129
+ dir === "prev" ? "Previous" : "Next",
4130
+ l.section ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: "\xB7" }) : null,
4131
+ l.section ? /* @__PURE__ */ jsx("span", { className: "truncate", children: l.section }) : null,
4132
+ dir === "next" ? /* @__PURE__ */ jsx(ArrowRight, { "aria-hidden": true, className: "size-3.5" }) : null
4133
+ ] }),
4134
+ /* @__PURE__ */ jsx("span", { className: "text-[1rem] font-medium leading-snug text-foreground", children: l.label })
4135
+ ]
4136
+ }
4137
+ );
4138
+ return /* @__PURE__ */ jsxs("nav", { "aria-label": "Previous and next page", className: cn("grid grid-cols-1 gap-3 border-t border-border pt-8 sm:grid-cols-2", className), children: [
4139
+ prev ? card(prev, "prev") : null,
4140
+ next ? card(next, "next") : null
4141
+ ] });
4142
+ }
4143
+ function useHeadings(selector = "#docs-content", key) {
4144
+ const [items, setItems] = useState([]);
4145
+ useEffect(() => {
4146
+ const read = () => {
4147
+ const root = document.querySelector(selector);
4148
+ if (!root) return setItems([]);
4149
+ setItems(
4150
+ Array.from(root.querySelectorAll("h2[id], h3[id]")).map((h) => ({
4151
+ id: h.id,
4152
+ // The anchor link's "#" is not part of the name.
4153
+ label: (h.querySelector("[data-heading-text]") ?? h).textContent?.trim() ?? "",
4154
+ level: h.tagName === "H3" ? 3 : 2
4155
+ }))
4156
+ );
4157
+ };
4158
+ const raf = requestAnimationFrame(read);
4159
+ const t = setTimeout(read, 80);
4160
+ return () => {
4161
+ cancelAnimationFrame(raf);
4162
+ clearTimeout(t);
4163
+ };
4164
+ }, [selector, key]);
4165
+ const activeId = useActiveHeading(items.map((i) => i.id));
4166
+ return { items, activeId };
4167
+ }
4168
+ function OnThisPage({
4169
+ items,
4170
+ activeId,
4171
+ title = "On this page",
4172
+ onNavigate,
4173
+ className
4174
+ }) {
4175
+ const id = useId();
4176
+ if (items.length === 0) return null;
4177
+ return (
4178
+ // With no visible title (a folded list under its own summary) the name is still "On this page".
4179
+ /* @__PURE__ */ jsxs("nav", { "aria-labelledby": title ? id : void 0, "aria-label": title ? void 0 : "On this page", className, children: [
4180
+ title ? /* @__PURE__ */ jsx("p", { id, className: "mb-3 text-[0.875rem] font-medium", children: title }) : null,
4181
+ /* @__PURE__ */ jsx("ul", { children: items.map((t) => {
4182
+ const on = t.id === activeId;
4183
+ return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
4184
+ "a",
4185
+ {
4186
+ href: `#${t.id}`,
4187
+ onClick: onNavigate,
4188
+ "aria-current": on ? "location" : void 0,
4189
+ className: cn(
4190
+ "block border-l py-1.5 text-[0.875rem] leading-snug transition-colors",
4191
+ t.level === 3 ? "pl-7" : "pl-4",
4192
+ on ? "border-foreground text-foreground" : "border-border text-muted-foreground hover:text-foreground"
4193
+ ),
4194
+ children: t.label
4195
+ }
4196
+ ) }, t.id);
4197
+ }) })
4198
+ ] })
4199
+ );
4200
+ }
4201
+ var CALLOUT_TONE = { note: "neutral", warning: "brand", danger: "danger" };
4202
+ function Callout({
4203
+ tone = "note",
4065
4204
  title,
4066
- lead,
4067
- actions,
4068
- art,
4069
4205
  children,
4070
4206
  className
4071
4207
  }) {
4072
- const p = protocolSite(protocol2);
4073
4208
  return /* @__PURE__ */ jsx(
4074
- PageHero,
4209
+ Notice,
4075
4210
  {
4076
- className,
4077
- eyebrow: `Protocol \xB7 ${p.verb}`,
4211
+ tone: CALLOUT_TONE[tone],
4078
4212
  title,
4079
- lead,
4080
- actions,
4081
- art,
4082
- children: p.status !== "live" || children ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start gap-4", children: [
4083
- p.status !== "live" ? /* @__PURE__ */ jsx(StatusBadge, { status: p.status }) : null,
4084
- children
4085
- ] }) : null
4213
+ role: "note",
4214
+ className: cn("my-6 [&_p]:my-0 [&_p]:text-[0.9375rem] [&_p]:leading-relaxed [&_p+p]:mt-3", className),
4215
+ children
4086
4216
  }
4087
4217
  );
4088
4218
  }
4089
- function ProtocolNav({
4090
- current: current2,
4091
- link = "page",
4092
- className
4093
- }) {
4094
- return /* @__PURE__ */ jsx("nav", { "aria-label": "Protocols", className, children: /* @__PURE__ */ jsx(ScrollFade, { fade: "var(--background)", children: /* @__PURE__ */ jsx("ul", { className: "flex w-max min-w-full items-center gap-6 border-b border-border", children: PROTOCOLS.map((p) => {
4095
- const on = p.slug === current2;
4096
- return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
4097
- "a",
4219
+ function Step({ title, id, children }) {
4220
+ return /* @__PURE__ */ jsxs("li", { className: "relative pb-8 pl-11 last:pb-0 [counter-increment:oca-step]", children: [
4221
+ /* @__PURE__ */ jsx(
4222
+ "span",
4098
4223
  {
4099
- href: link === "tool" ? p.toolHref : p.pageHref,
4100
- "aria-current": on ? "page" : void 0,
4101
- className: cn(
4102
- "-mb-px inline-flex h-11 items-center border-b-2 text-[0.9375rem] transition-colors",
4103
- on ? "border-foreground text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"
4104
- ),
4105
- children: p.label
4224
+ "aria-hidden": true,
4225
+ className: "absolute left-0 top-0 flex size-7 items-center justify-center rounded-full border border-oca-hairline-strong bg-card text-[0.8125rem] oca-tabular text-foreground before:content-[counter(oca-step)]"
4106
4226
  }
4107
- ) }, p.slug);
4108
- }) }) }) });
4227
+ ),
4228
+ /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "absolute bottom-1 left-[0.8125rem] top-9 w-px bg-border" }),
4229
+ /* @__PURE__ */ jsx("h3", { id, className: "scroll-mt-28 pt-0.5 text-[1.0625rem] font-medium leading-snug tracking-[-0.008em] text-foreground", children: title }),
4230
+ /* @__PURE__ */ jsx("div", { className: "mt-2 text-muted-foreground [&>*:first-child]:mt-0 [&>*:last-child]:mb-0", children })
4231
+ ] });
4109
4232
  }
4110
- function SpecCard({
4111
- protocol: protocol2,
4112
- version,
4113
- license,
4114
- vectors,
4115
- size = "md",
4233
+ function Steps({ children, className }) {
4234
+ return /* @__PURE__ */ jsx("ol", { className: cn("not-prose my-8 flex flex-col [counter-reset:oca-step] [&>li:last-child>span:nth-child(2)]:hidden", className), children });
4235
+ }
4236
+ function LinkCard({
4237
+ href,
4238
+ title,
4239
+ description,
4240
+ icon,
4241
+ meta,
4116
4242
  className
4117
4243
  }) {
4118
- const p = protocolSite(protocol2);
4119
- const repo = `oc-${p.slug}-protocol`;
4120
- const facts = [
4121
- ["Version", version],
4122
- ...license ? [["Licence", license]] : [],
4123
- ["Nostr kind", p.kinds],
4124
- ...vectors !== void 0 ? [["Test vectors", String(vectors)]] : []
4125
- ];
4126
- if (size === "sm") {
4127
- return /* @__PURE__ */ jsxs(
4128
- "a",
4129
- {
4130
- href: p.specHref,
4131
- className: cn(
4132
- "group flex flex-wrap items-center gap-x-4 gap-y-1 rounded-2xl border border-border bg-card px-4 py-3 text-[0.875rem] transition-colors hover:border-oca-hairline-strong",
4133
- className
4134
- ),
4135
- children: [
4136
- /* @__PURE__ */ jsx("span", { className: "font-mono text-[0.8125rem] text-foreground", children: repo }),
4137
- /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: facts.map(([k, v]) => k === "Version" ? `v${v}` : k === "Nostr kind" ? `kind ${v}` : v).join(" \xB7 ") }),
4138
- /* @__PURE__ */ jsxs("span", { className: "ml-auto flex items-center gap-1 text-muted-foreground group-hover:text-foreground", children: [
4139
- "Read the spec ",
4140
- /* @__PURE__ */ jsx(ArrowUpRight, { "aria-hidden": true, className: "size-4" })
4141
- ] })
4142
- ]
4143
- }
4144
- );
4145
- }
4146
- return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-6 rounded-[1.25rem] border border-border bg-card p-6 md:p-8", className), children: [
4147
- /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4", children: [
4148
- /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-1.5", children: [
4149
- /* @__PURE__ */ jsx("p", { className: "text-[0.875rem] text-muted-foreground", children: "The spec" }),
4150
- /* @__PURE__ */ jsx("h3", { className: "oca-title break-all font-mono text-[1.0625rem] tracking-normal", children: repo })
4151
- ] }),
4152
- p.status !== "live" ? /* @__PURE__ */ jsx(StatusBadge, { status: p.status }) : null
4153
- ] }),
4154
- /* @__PURE__ */ jsx("dl", { className: "grid grid-cols-2 gap-x-6 gap-y-4 sm:grid-cols-4", children: facts.map(([k, v]) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
4155
- /* @__PURE__ */ jsx("dt", { className: "text-[0.8125rem] text-muted-foreground", children: k }),
4156
- /* @__PURE__ */ jsx("dd", { className: "oca-tabular text-[1.0625rem]", children: v })
4157
- ] }, k)) }),
4158
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Button, { asChild: true, variant: "secondary", size: "sm", children: /* @__PURE__ */ jsxs("a", { href: p.specHref, children: [
4159
- "Read the spec ",
4160
- /* @__PURE__ */ jsx(ArrowUpRight, { "aria-hidden": true })
4161
- ] }) }) })
4162
- ] });
4163
- }
4164
- function VerifyBox({
4165
- action,
4166
- param = "q",
4167
- title,
4168
- description,
4169
- label = "Id, envelope or link",
4170
- placeholder,
4171
- hint,
4172
- submitLabel = "Verify",
4173
- multiline = false,
4174
- onVerify,
4175
- className
4176
- }) {
4177
- const [value, setValue] = useState("");
4178
- const submit = (e) => {
4179
- if (!onVerify) return;
4180
- e.preventDefault();
4181
- if (value.trim()) onVerify(value.trim());
4182
- };
4183
- const button = /* @__PURE__ */ jsx(Button, { type: "submit", className: multiline ? void 0 : "w-full sm:w-auto", children: submitLabel });
4244
+ const Arrow = isInternal(href) ? ArrowRight : ArrowUpRight;
4184
4245
  return /* @__PURE__ */ jsxs(
4185
- "form",
4246
+ DocLink,
4186
4247
  {
4187
- action,
4188
- method: "get",
4189
- onSubmit: submit,
4190
- className: cn("flex flex-col gap-5 rounded-[1.25rem] border border-border bg-card p-6 md:p-8", className),
4248
+ href,
4249
+ className: cn(
4250
+ "group flex h-full flex-col gap-3 rounded-[1.25rem] border border-border bg-card p-5 transition-colors hover:border-oca-hairline-strong",
4251
+ className
4252
+ ),
4191
4253
  children: [
4192
- title || description ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
4193
- title ? /* @__PURE__ */ jsx("h3", { className: "oca-title", children: title }) : null,
4194
- description ? /* @__PURE__ */ jsx("p", { className: "oca-body text-[0.9375rem]", children: description }) : null
4195
- ] }) : null,
4196
- multiline ? /* @__PURE__ */ jsxs(Fragment, { children: [
4197
- /* @__PURE__ */ jsx(Field, { label, hint, children: /* @__PURE__ */ jsx(
4198
- Textarea,
4199
- {
4200
- name: param,
4201
- required: true,
4202
- value,
4203
- onChange: (e) => setValue(e.target.value),
4204
- placeholder,
4205
- spellCheck: false,
4206
- className: "min-h-32 font-mono text-base md:text-[0.8125rem]"
4207
- }
4208
- ) }),
4209
- /* @__PURE__ */ jsx("div", { children: button })
4210
- ] }) : /* @__PURE__ */ jsx(Field, { label, hint, action: button, children: /* @__PURE__ */ jsx(
4211
- Input,
4212
- {
4213
- name: param,
4214
- required: true,
4215
- value,
4216
- onChange: (e) => setValue(e.target.value),
4217
- placeholder,
4218
- spellCheck: false,
4219
- autoComplete: "off",
4220
- className: "font-mono text-base md:text-[0.875rem]"
4221
- }
4222
- ) })
4254
+ /* @__PURE__ */ jsxs("span", { className: "flex items-start justify-between gap-3", children: [
4255
+ icon ? /* @__PURE__ */ jsx("span", { className: "flex size-9 shrink-0 items-center justify-center rounded-xl bg-muted text-foreground [&_svg]:size-[1.125rem]", children: icon }) : /* @__PURE__ */ jsx("span", { className: "text-[1rem] font-medium leading-snug text-foreground", children: title }),
4256
+ /* @__PURE__ */ jsxs("span", { className: "flex shrink-0 items-center gap-2", children: [
4257
+ meta,
4258
+ /* @__PURE__ */ jsx(Arrow, { "aria-hidden": true, className: "size-4 text-muted-foreground transition-transform group-hover:translate-x-0.5 group-hover:text-foreground" })
4259
+ ] })
4260
+ ] }),
4261
+ icon ? /* @__PURE__ */ jsx("span", { className: "text-[1rem] font-medium leading-snug text-foreground", children: title }) : null,
4262
+ description ? /* @__PURE__ */ jsx("span", { className: "text-[0.9375rem] leading-relaxed text-muted-foreground", children: description }) : null
4223
4263
  ]
4224
4264
  }
4225
4265
  );
4226
4266
  }
4227
- var TINT = "bg-[color-mix(in_oklab,var(--oca-orange)_9%,var(--card))]";
4228
- function ComparisonTable({
4229
- columns,
4267
+ function CardGrid({ columns = 2, children, className }) {
4268
+ return /* @__PURE__ */ jsx("div", { className: cn("not-prose my-6 grid grid-cols-1 gap-3 sm:grid-cols-2", columns === 3 && "lg:grid-cols-3", className), children });
4269
+ }
4270
+ function MdxTable({ className, ...props }) {
4271
+ return /* @__PURE__ */ jsx("div", { className: "not-prose my-6 overflow-hidden rounded-2xl border border-border bg-card", children: /* @__PURE__ */ jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsx(
4272
+ "table",
4273
+ {
4274
+ className: cn(
4275
+ "w-full border-collapse text-left text-[0.875rem] leading-relaxed",
4276
+ "[&_th]:whitespace-nowrap [&_th]:border-b [&_th]:border-oca-hairline-strong [&_th]:bg-oca-table-head [&_th]:px-4 [&_th]:py-2.5 [&_th]:text-[0.8125rem] [&_th]:font-medium [&_th]:text-foreground",
4277
+ "[&_td]:border-t [&_td]:border-border [&_td]:px-4 [&_td]:py-2.5 [&_td]:align-top [&_td]:text-muted-foreground [&_tbody_tr:first-child_td]:border-t-0",
4278
+ "[&_td_code]:bg-transparent [&_td_code]:p-0 [&_td_code]:text-foreground [&_td:first-child]:text-foreground",
4279
+ "[&_[align=center]]:text-center [&_[align=right]]:text-right",
4280
+ // On a phone a cell keeps a readable width; the table scrolls instead of crushing it.
4281
+ "max-sm:[&_td]:min-w-[9rem]",
4282
+ className
4283
+ ),
4284
+ ...props
4285
+ }
4286
+ ) }) });
4287
+ }
4288
+ var said = (n) => n !== void 0 && n !== null && n !== false && n !== "";
4289
+ function ApiTable({
4230
4290
  rows,
4231
- label,
4232
- propertyHeading = "Property",
4291
+ caption,
4292
+ nameHeader = "Name",
4233
4293
  className
4234
4294
  }) {
4235
- const wide = columns.length > 3;
4236
- const grid = wide ? "lg:grid lg:grid-cols-[var(--oca-compare)]" : "md:grid md:grid-cols-[var(--oca-compare)]";
4237
- const desk = wide ? "lg" : "md";
4238
- const style = {
4239
- // The argued-for column gets a little more room: its answers carry the page.
4240
- "--oca-compare": ["minmax(0, 1.4fr)", ...columns.map((c) => c.highlight ? "minmax(0, 1.3fr)" : "minmax(0, 1fr)")].join(" ")
4295
+ const hasDefault = rows.some((r) => r.default !== void 0);
4296
+ const hasDescription = rows.some((r) => said(r.description));
4297
+ const hasSource = rows.some((r) => said(r.source));
4298
+ const cell = "px-4 py-3 max-sm:p-0";
4299
+ return /* @__PURE__ */ jsx("div", { className: cn("not-prose my-6 overflow-hidden rounded-2xl border border-border bg-card", className), children: /* @__PURE__ */ jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsxs("table", { className: "w-full border-collapse text-left text-[0.875rem] max-sm:block", children: [
4300
+ caption ? /* @__PURE__ */ jsx("caption", { className: "sr-only", children: caption }) : null,
4301
+ /* @__PURE__ */ jsx("thead", { className: "max-sm:sr-only", children: /* @__PURE__ */ jsxs("tr", { className: "border-b border-oca-hairline-strong bg-oca-table-head text-[0.8125rem]", children: [
4302
+ /* @__PURE__ */ jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: nameHeader }),
4303
+ /* @__PURE__ */ jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: "Type" }),
4304
+ hasDefault ? /* @__PURE__ */ jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: "Default" }) : null,
4305
+ hasDescription ? /* @__PURE__ */ jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: "Description" }) : null,
4306
+ hasSource ? /* @__PURE__ */ jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: "Defined in" }) : null
4307
+ ] }) }),
4308
+ /* @__PURE__ */ jsx("tbody", { className: "divide-y divide-border max-sm:block", children: rows.map((r) => /* @__PURE__ */ jsxs(
4309
+ "tr",
4310
+ {
4311
+ id: r.id,
4312
+ className: "scroll-mt-28 align-top target:bg-muted max-sm:flex max-sm:flex-col max-sm:gap-1.5 max-sm:px-4 max-sm:py-3.5",
4313
+ children: [
4314
+ /* @__PURE__ */ jsx("th", { scope: "row", className: cn(cell, "text-left font-normal"), children: /* @__PURE__ */ jsxs("span", { className: "flex flex-col items-start gap-1 max-sm:flex-row max-sm:flex-wrap max-sm:items-baseline max-sm:gap-x-2", children: [
4315
+ /* @__PURE__ */ jsx("code", { className: cn("font-mono text-[0.8125rem] text-foreground max-sm:text-[0.875rem]", r.deprecated && "line-through decoration-oca-subtle"), children: r.name }),
4316
+ r.required ? /* @__PURE__ */ jsx("span", { className: "text-[0.75rem] text-oca-accent-ink", children: "Required" }) : null,
4317
+ r.deprecated ? /* @__PURE__ */ jsx(Badge, { tone: "muted", children: "Deprecated" }) : null,
4318
+ r.status ? /* @__PURE__ */ jsx(StatusBadge, { status: r.status }) : null
4319
+ ] }) }),
4320
+ /* @__PURE__ */ jsx("td", { className: cn(cell, "font-mono text-[0.8125rem] text-muted-foreground max-sm:break-all", !said(r.type) && "max-sm:hidden"), children: r.type ?? "\u2014" }),
4321
+ hasDefault ? /* @__PURE__ */ jsxs("td", { className: cn(cell, "font-mono text-[0.8125rem] text-muted-foreground max-sm:order-last", r.default === void 0 && "max-sm:hidden"), children: [
4322
+ /* @__PURE__ */ jsx("span", { className: "font-sans sm:hidden", children: "Default " }),
4323
+ r.default ?? "\u2014"
4324
+ ] }) : null,
4325
+ hasDescription ? /* @__PURE__ */ jsx("td", { className: cn(cell, "leading-relaxed text-muted-foreground", !said(r.description) && "max-sm:hidden"), children: r.description }) : null,
4326
+ hasSource ? /* @__PURE__ */ jsx("td", { className: cn(cell, "text-[0.8125rem] text-muted-foreground max-sm:order-last max-sm:break-all", !said(r.source) && "max-sm:hidden"), children: r.source }) : null
4327
+ ]
4328
+ },
4329
+ r.id ?? r.name
4330
+ )) })
4331
+ ] }) }) });
4332
+ }
4333
+ function useDarkMode() {
4334
+ const [dark, setDark] = useState(false);
4335
+ useEffect(() => {
4336
+ const root = document.documentElement;
4337
+ const read = () => setDark(root.classList.contains("dark"));
4338
+ read();
4339
+ const mo = new MutationObserver(read);
4340
+ mo.observe(root, { attributes: true, attributeFilter: ["class"] });
4341
+ return () => mo.disconnect();
4342
+ }, []);
4343
+ return dark;
4344
+ }
4345
+ function mermaidTheme(el) {
4346
+ const css = getComputedStyle(el);
4347
+ const v = (name) => css.getPropertyValue(name).trim();
4348
+ const card = v("--card");
4349
+ const muted = v("--muted");
4350
+ const text = v("--foreground");
4351
+ const subtle = v("--muted-foreground");
4352
+ const line = v("--input");
4353
+ const hair = v("--oca-hairline-strong");
4354
+ return {
4355
+ background: "transparent",
4356
+ fontFamily: css.fontFamily,
4357
+ fontSize: "14px",
4358
+ textColor: text,
4359
+ mainBkg: card,
4360
+ primaryColor: card,
4361
+ primaryTextColor: text,
4362
+ primaryBorderColor: hair,
4363
+ secondaryColor: muted,
4364
+ secondaryTextColor: text,
4365
+ secondaryBorderColor: hair,
4366
+ tertiaryColor: muted,
4367
+ tertiaryTextColor: text,
4368
+ tertiaryBorderColor: hair,
4369
+ nodeBorder: hair,
4370
+ lineColor: line,
4371
+ edgeLabelBackground: card,
4372
+ clusterBkg: muted,
4373
+ clusterBorder: hair,
4374
+ titleColor: text,
4375
+ noteBkgColor: muted,
4376
+ noteTextColor: text,
4377
+ noteBorderColor: hair,
4378
+ actorBkg: card,
4379
+ actorBorder: hair,
4380
+ actorTextColor: text,
4381
+ actorLineColor: line,
4382
+ signalColor: text,
4383
+ signalTextColor: text,
4384
+ labelBoxBkgColor: card,
4385
+ labelBoxBorderColor: hair,
4386
+ labelTextColor: text,
4387
+ loopTextColor: subtle,
4388
+ activationBkgColor: muted,
4389
+ activationBorderColor: hair,
4390
+ sequenceNumberColor: card
4241
4391
  };
4242
- const ordered = [...columns].sort((a, b) => Number(Boolean(b.highlight)) - Number(Boolean(a.highlight)));
4243
- return /* @__PURE__ */ jsxs("ul", { "aria-label": label, style, className: cn("divide-y divide-border rounded-[1.25rem] border border-border bg-card", className), children: [
4244
- /* @__PURE__ */ jsxs(
4245
- "li",
4392
+ }
4393
+ var FIT = 4 / 3;
4394
+ function naturalSize(svg) {
4395
+ const w = svg.match(/viewBox="[\d.-]+ [\d.-]+ ([\d.]+) [\d.]+"/)?.[1];
4396
+ if (!w) return { svg, width: null };
4397
+ const width = Math.ceil(Number(w));
4398
+ return {
4399
+ svg: svg.replace(/<svg([^>]*?)\swidth="100%"/, `<svg$1 width="${width}"`).replace(/max-width:\s*[\d.]+px;?/, ""),
4400
+ width
4401
+ };
4402
+ }
4403
+ function useInnerWidth(ref, padding) {
4404
+ const [width, setWidth] = useState(null);
4405
+ useEffect(() => {
4406
+ const el = ref.current;
4407
+ if (!el) return;
4408
+ const ro = new ResizeObserver(() => setWidth(el.clientWidth - padding));
4409
+ ro.observe(el);
4410
+ return () => ro.disconnect();
4411
+ }, [ref, padding]);
4412
+ return width;
4413
+ }
4414
+ function Diagram({ chart, caption, load, className }) {
4415
+ const ref = useRef(null);
4416
+ const dark = useDarkMode();
4417
+ const raw = useId();
4418
+ const [drawn, setDrawn] = useState(null);
4419
+ const [failed, setFailed] = useState(false);
4420
+ const room = useInnerWidth(ref, 48);
4421
+ const fits = drawn?.width != null && room != null && drawn.width <= room * FIT;
4422
+ useEffect(() => {
4423
+ let live = true;
4424
+ const el = ref.current;
4425
+ if (!el) return;
4426
+ (async () => {
4427
+ try {
4428
+ const mod = await load();
4429
+ const mermaid = "default" in mod ? mod.default : mod;
4430
+ mermaid.initialize({ startOnLoad: false, securityLevel: "strict", theme: "base", themeVariables: mermaidTheme(el) });
4431
+ const { svg } = await mermaid.render(`oca-diagram-${raw.replace(/[^a-zA-Z0-9]/g, "")}-${dark ? "d" : "l"}`, chart);
4432
+ if (live) {
4433
+ setDrawn(naturalSize(svg));
4434
+ setFailed(false);
4435
+ }
4436
+ } catch {
4437
+ if (live) setFailed(true);
4438
+ }
4439
+ })();
4440
+ return () => {
4441
+ live = false;
4442
+ };
4443
+ }, [chart, dark, load, raw]);
4444
+ if (failed) return /* @__PURE__ */ jsx(CodeBlock, { code: chart, caption: "Diagram (shown as its source)", className: cn("my-6", className) });
4445
+ return /* @__PURE__ */ jsxs("figure", { ref, className: cn("not-prose my-6 overflow-hidden rounded-[1.25rem] border border-border bg-card", className), children: [
4446
+ drawn ? /* @__PURE__ */ jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsx(
4447
+ "div",
4246
4448
  {
4247
- "aria-hidden": true,
4449
+ "data-fit": fits ? "" : void 0,
4248
4450
  className: cn(
4249
- "hidden gap-5 px-5 py-4 text-[0.875rem] font-medium text-muted-foreground",
4250
- wide ? "lg:grid lg:px-8" : "md:grid md:px-8",
4251
- grid
4451
+ "flex justify-center p-6 [&_svg]:h-auto",
4452
+ fits ? "w-full [&_svg]:max-w-full" : "w-max min-w-full [&_svg]:max-w-none"
4252
4453
  ),
4253
- children: [
4254
- /* @__PURE__ */ jsx("span", { children: propertyHeading }),
4255
- columns.map((c) => /* @__PURE__ */ jsx("span", { className: cn(c.highlight && cn(TINT, "-my-4 px-4 py-4 text-oca-accent-ink")), children: c.label }, c.key))
4256
- ]
4454
+ role: "img",
4455
+ "aria-label": typeof caption === "string" ? caption : "Diagram",
4456
+ dangerouslySetInnerHTML: { __html: drawn.svg }
4257
4457
  }
4258
- ),
4259
- rows.map((r, ri) => /* @__PURE__ */ jsxs("li", { className: cn("grid grid-cols-1 gap-3 px-5 py-5", wide ? "lg:items-start lg:gap-5 lg:px-8" : "md:items-start md:gap-5 md:px-8", grid), children: [
4458
+ ) }) : /* @__PURE__ */ jsx("div", { role: "status", "aria-label": "Drawing the diagram", className: "p-6", children: /* @__PURE__ */ jsx(Skeleton, { className: "h-40 w-full rounded-xl" }) }),
4459
+ caption ? /* @__PURE__ */ jsx("figcaption", { className: "border-t border-border px-5 py-3 text-[0.8125rem] text-muted-foreground", children: caption }) : null
4460
+ ] });
4461
+ }
4462
+ var HEADING = {
4463
+ h1: "oca-display-3 mb-4 text-foreground",
4464
+ h2: "mb-3 mt-12 text-[1.375rem] font-medium leading-tight tracking-[-0.015em] text-foreground md:text-[1.5rem]",
4465
+ h3: "mb-2 mt-9 text-[1.125rem] font-medium leading-snug tracking-[-0.01em] text-foreground",
4466
+ h4: "mb-2 mt-7 text-[1rem] font-medium leading-snug text-foreground"
4467
+ };
4468
+ function DocsHeading({
4469
+ as: Tag,
4470
+ id,
4471
+ children,
4472
+ className,
4473
+ ...props
4474
+ }) {
4475
+ return /* @__PURE__ */ jsxs(Tag, { id, className: cn("group scroll-mt-28", HEADING[Tag], className), ...props, children: [
4476
+ /* @__PURE__ */ jsx("span", { "data-heading-text": "", children }),
4477
+ id && Tag !== "h1" ? /* @__PURE__ */ jsxs(
4478
+ "a",
4479
+ {
4480
+ href: `#${id}`,
4481
+ className: "ml-2 inline-block rounded-md px-1 align-baseline text-[0.85em] font-normal text-oca-subtle no-underline opacity-0 transition-opacity hover:text-foreground focus-visible:opacity-100 group-hover:opacity-100",
4482
+ children: [
4483
+ /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: "#" }),
4484
+ /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Link to this section" })
4485
+ ]
4486
+ }
4487
+ ) : null
4488
+ ] });
4489
+ }
4490
+ function codeText(node) {
4491
+ if (typeof node === "string") return node;
4492
+ if (typeof node === "number") return String(node);
4493
+ if (Array.isArray(node)) return node.map(codeText).join("");
4494
+ if (isValidElement(node)) return codeText(node.props.children);
4495
+ return "";
4496
+ }
4497
+ function codeLang(node) {
4498
+ const child = Children.toArray(node)[0];
4499
+ if (!isValidElement(child)) return void 0;
4500
+ const cls = child.props.className ?? "";
4501
+ return cls.match(/language-([\w+-]+)/)?.[1];
4502
+ }
4503
+ function ProtocolHero({
4504
+ protocol: protocol2,
4505
+ title,
4506
+ lead,
4507
+ actions,
4508
+ art,
4509
+ children,
4510
+ className
4511
+ }) {
4512
+ const p = protocolSite(protocol2);
4513
+ return /* @__PURE__ */ jsx(
4514
+ PageHero,
4515
+ {
4516
+ className,
4517
+ eyebrow: `Protocol \xB7 ${p.verb}`,
4518
+ title,
4519
+ lead,
4520
+ actions,
4521
+ art,
4522
+ children: p.status !== "live" || children ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start gap-4", children: [
4523
+ p.status !== "live" ? /* @__PURE__ */ jsx(StatusBadge, { status: p.status }) : null,
4524
+ children
4525
+ ] }) : null
4526
+ }
4527
+ );
4528
+ }
4529
+ function ProtocolNav({
4530
+ current: current2,
4531
+ link = "page",
4532
+ className
4533
+ }) {
4534
+ return /* @__PURE__ */ jsx("nav", { "aria-label": "Protocols", className, children: /* @__PURE__ */ jsx(ScrollFade, { fade: "var(--background)", children: /* @__PURE__ */ jsx("ul", { className: "flex w-max min-w-full items-center gap-6 border-b border-border", children: PROTOCOLS.map((p) => {
4535
+ const on = p.slug === current2;
4536
+ return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
4537
+ "a",
4538
+ {
4539
+ href: link === "tool" ? p.toolHref : p.pageHref,
4540
+ "aria-current": on ? "page" : void 0,
4541
+ className: cn(
4542
+ "-mb-px inline-flex h-11 items-center border-b-2 text-[0.9375rem] transition-colors",
4543
+ on ? "border-foreground text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"
4544
+ ),
4545
+ children: p.label
4546
+ }
4547
+ ) }, p.slug);
4548
+ }) }) }) });
4549
+ }
4550
+ var SPEC_FILE = {
4551
+ spec: {
4552
+ file: "SPEC.md",
4553
+ title: "Normative source",
4554
+ note: "This page is a human-readable summary. The authoritative copy lives in the spec repo. If the two ever drift, the repo wins."
4555
+ },
4556
+ security: {
4557
+ file: "SECURITY.md",
4558
+ title: "Normative threat model",
4559
+ note: "This page is the short form. The authoritative, numbered threat model lives in the spec repo."
4560
+ },
4561
+ rationale: {
4562
+ file: "WHY.md",
4563
+ title: "Design rationale",
4564
+ note: "This page is the short version. The full rationale and the rejected-design log live in the spec repo."
4565
+ }
4566
+ };
4567
+ function SpecCard(props) {
4568
+ return props.repo !== void 0 ? /* @__PURE__ */ jsx(SpecFileNote, { ...props }) : /* @__PURE__ */ jsx(ProtocolSpecCard, { ...props });
4569
+ }
4570
+ function SpecFileNote({ repo, file, kind = "spec", version, note, className }) {
4571
+ const d = SPEC_FILE[kind];
4572
+ const f = file ?? d.file;
4573
+ return /* @__PURE__ */ jsxs(Callout, { title: version ? `${d.title} \xB7 ${version}` : d.title, className, children: [
4574
+ /* @__PURE__ */ jsx("p", { children: note ?? d.note }),
4575
+ /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsx(TextLink, { href: `https://github.com/orangecheck/${repo}/blob/main/${f}`, className: "break-all font-mono text-[0.875rem]", children: `${repo}/${f}` }) })
4576
+ ] });
4577
+ }
4578
+ function ProtocolSpecCard({ protocol: protocol2, version, license, vectors, size = "md", className }) {
4579
+ const p = protocolSite(protocol2);
4580
+ const repo = `oc-${p.slug}-protocol`;
4581
+ const facts = [
4582
+ ["Version", version],
4583
+ ...license ? [["Licence", license]] : [],
4584
+ ["Nostr kind", p.kinds],
4585
+ ...vectors !== void 0 ? [["Test vectors", String(vectors)]] : []
4586
+ ];
4587
+ if (size === "sm") {
4588
+ return /* @__PURE__ */ jsxs(
4589
+ "a",
4590
+ {
4591
+ href: p.specHref,
4592
+ className: cn(
4593
+ "group flex flex-wrap items-center gap-x-4 gap-y-1 rounded-2xl border border-border bg-card px-4 py-3 text-[0.875rem] transition-colors hover:border-oca-hairline-strong",
4594
+ className
4595
+ ),
4596
+ children: [
4597
+ /* @__PURE__ */ jsx("span", { className: "font-mono text-[0.8125rem] text-foreground", children: repo }),
4598
+ /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: facts.map(([k, v]) => k === "Version" ? `v${v}` : k === "Nostr kind" ? `kind ${v}` : v).join(" \xB7 ") }),
4599
+ /* @__PURE__ */ jsxs("span", { className: "ml-auto flex items-center gap-1 text-muted-foreground group-hover:text-foreground", children: [
4600
+ "Read the spec ",
4601
+ /* @__PURE__ */ jsx(ArrowUpRight, { "aria-hidden": true, className: "size-4" })
4602
+ ] })
4603
+ ]
4604
+ }
4605
+ );
4606
+ }
4607
+ return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-6 rounded-[1.25rem] border border-border bg-card p-6 md:p-8", className), children: [
4608
+ /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4", children: [
4609
+ /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-1.5", children: [
4610
+ /* @__PURE__ */ jsx("p", { className: "text-[0.875rem] text-muted-foreground", children: "The spec" }),
4611
+ /* @__PURE__ */ jsx("h3", { className: "oca-title break-all font-mono text-[1.0625rem] tracking-normal", children: repo })
4612
+ ] }),
4613
+ p.status !== "live" ? /* @__PURE__ */ jsx(StatusBadge, { status: p.status }) : null
4614
+ ] }),
4615
+ /* @__PURE__ */ jsx("dl", { className: "grid grid-cols-2 gap-x-6 gap-y-4 sm:grid-cols-4", children: facts.map(([k, v]) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
4616
+ /* @__PURE__ */ jsx("dt", { className: "text-[0.8125rem] text-muted-foreground", children: k }),
4617
+ /* @__PURE__ */ jsx("dd", { className: "oca-tabular text-[1.0625rem]", children: v })
4618
+ ] }, k)) }),
4619
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Button, { asChild: true, variant: "secondary", size: "sm", children: /* @__PURE__ */ jsxs("a", { href: p.specHref, children: [
4620
+ "Read the spec ",
4621
+ /* @__PURE__ */ jsx(ArrowUpRight, { "aria-hidden": true })
4622
+ ] }) }) })
4623
+ ] });
4624
+ }
4625
+ function VerifyBox({
4626
+ action,
4627
+ param = "q",
4628
+ title,
4629
+ description,
4630
+ label = "Id, envelope or link",
4631
+ placeholder,
4632
+ hint,
4633
+ submitLabel = "Verify",
4634
+ multiline = false,
4635
+ onVerify,
4636
+ className
4637
+ }) {
4638
+ const [value, setValue] = useState("");
4639
+ const submit = (e) => {
4640
+ if (!onVerify) return;
4641
+ e.preventDefault();
4642
+ if (value.trim()) onVerify(value.trim());
4643
+ };
4644
+ const button = /* @__PURE__ */ jsx(Button, { type: "submit", className: multiline ? void 0 : "w-full sm:w-auto", children: submitLabel });
4645
+ return /* @__PURE__ */ jsxs(
4646
+ "form",
4647
+ {
4648
+ action,
4649
+ method: "get",
4650
+ onSubmit: submit,
4651
+ className: cn("flex flex-col gap-5 rounded-[1.25rem] border border-border bg-card p-6 md:p-8", className),
4652
+ children: [
4653
+ title || description ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
4654
+ title ? /* @__PURE__ */ jsx("h3", { className: "oca-title", children: title }) : null,
4655
+ description ? /* @__PURE__ */ jsx("p", { className: "oca-body text-[0.9375rem]", children: description }) : null
4656
+ ] }) : null,
4657
+ multiline ? /* @__PURE__ */ jsxs(Fragment, { children: [
4658
+ /* @__PURE__ */ jsx(Field, { label, hint, children: /* @__PURE__ */ jsx(
4659
+ Textarea,
4660
+ {
4661
+ name: param,
4662
+ required: true,
4663
+ value,
4664
+ onChange: (e) => setValue(e.target.value),
4665
+ placeholder,
4666
+ spellCheck: false,
4667
+ className: "min-h-32 font-mono text-base md:text-[0.8125rem]"
4668
+ }
4669
+ ) }),
4670
+ /* @__PURE__ */ jsx("div", { children: button })
4671
+ ] }) : /* @__PURE__ */ jsx(Field, { label, hint, action: button, children: /* @__PURE__ */ jsx(
4672
+ Input,
4673
+ {
4674
+ name: param,
4675
+ required: true,
4676
+ value,
4677
+ onChange: (e) => setValue(e.target.value),
4678
+ placeholder,
4679
+ spellCheck: false,
4680
+ autoComplete: "off",
4681
+ className: "font-mono text-base md:text-[0.875rem]"
4682
+ }
4683
+ ) })
4684
+ ]
4685
+ }
4686
+ );
4687
+ }
4688
+ var TINT = "bg-[color-mix(in_oklab,var(--oca-orange)_9%,var(--card))]";
4689
+ function ComparisonTable({
4690
+ columns,
4691
+ rows,
4692
+ label,
4693
+ propertyHeading = "Property",
4694
+ className
4695
+ }) {
4696
+ const wide = columns.length > 3;
4697
+ const grid = wide ? "lg:grid lg:grid-cols-[var(--oca-compare)]" : "md:grid md:grid-cols-[var(--oca-compare)]";
4698
+ const desk = wide ? "lg" : "md";
4699
+ const style = {
4700
+ // The argued-for column gets a little more room: its answers carry the page.
4701
+ "--oca-compare": ["minmax(0, 1.4fr)", ...columns.map((c) => c.highlight ? "minmax(0, 1.3fr)" : "minmax(0, 1fr)")].join(" ")
4702
+ };
4703
+ const ordered = [...columns].sort((a, b) => Number(Boolean(b.highlight)) - Number(Boolean(a.highlight)));
4704
+ return /* @__PURE__ */ jsxs("ul", { "aria-label": label, style, className: cn("divide-y divide-border rounded-[1.25rem] border border-border bg-card", className), children: [
4705
+ /* @__PURE__ */ jsxs(
4706
+ "li",
4707
+ {
4708
+ "aria-hidden": true,
4709
+ className: cn(
4710
+ "hidden gap-5 px-5 py-4 text-[0.875rem] font-medium text-muted-foreground",
4711
+ wide ? "lg:grid lg:px-8" : "md:grid md:px-8",
4712
+ grid
4713
+ ),
4714
+ children: [
4715
+ /* @__PURE__ */ jsx("span", { children: propertyHeading }),
4716
+ columns.map((c) => /* @__PURE__ */ jsx("span", { className: cn(c.highlight && cn(TINT, "-my-4 px-4 py-4 text-oca-accent-ink")), children: c.label }, c.key))
4717
+ ]
4718
+ }
4719
+ ),
4720
+ rows.map((r, ri) => /* @__PURE__ */ jsxs("li", { className: cn("grid grid-cols-1 gap-3 px-5 py-5", wide ? "lg:items-start lg:gap-5 lg:px-8" : "md:items-start md:gap-5 md:px-8", grid), children: [
4260
4721
  /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-1", children: [
4261
4722
  /* @__PURE__ */ jsx("span", { className: "oca-title-sm", children: r.label }),
4262
4723
  r.note ? /* @__PURE__ */ jsx("span", { className: "text-[0.875rem] leading-snug text-muted-foreground", children: r.note }) : null
@@ -4369,6 +4830,7 @@ function SignMessage({
4369
4830
  error,
4370
4831
  submitLabel = "Confirm",
4371
4832
  secondary,
4833
+ scheme = "bip322",
4372
4834
  onSignature,
4373
4835
  className
4374
4836
  }) {
@@ -4383,7 +4845,7 @@ function SignMessage({
4383
4845
  /* @__PURE__ */ jsx("span", { className: "h-px flex-1 bg-border" })
4384
4846
  ] })
4385
4847
  ] }) : null,
4386
- /* @__PURE__ */ jsx(CodeBlock, { code: message, caption: "Message to sign" }),
4848
+ /* @__PURE__ */ jsx(CodeBlock, { code: message, caption: "Message to sign", wrap: true }),
4387
4849
  /* @__PURE__ */ jsxs(
4388
4850
  "form",
4389
4851
  {
@@ -4399,7 +4861,9 @@ function SignMessage({
4399
4861
  label: "Signature",
4400
4862
  error,
4401
4863
  hint: /* @__PURE__ */ jsxs(Fragment, { children: [
4402
- "From your wallet\u2019s \u201Csign message\u201D (BIP-322), signed by",
4864
+ "From your wallet\u2019s \u201Csign message\u201D (",
4865
+ scheme === "legacy" ? "legacy, BIP-137" : "BIP-322",
4866
+ "), signed by",
4403
4867
  " ",
4404
4868
  /* @__PURE__ */ jsx("span", { className: "break-all font-mono", children: address }),
4405
4869
  "."
@@ -4425,448 +4889,67 @@ function SignMessage({
4425
4889
  )
4426
4890
  ] });
4427
4891
  }
4428
- var isInternal = (href) => href.startsWith("/") || href.startsWith("#");
4429
- function DocLink({ href, className, children, ...rest }) {
4430
- return isInternal(href) ? /* @__PURE__ */ jsx(Link8, { href, className, ...rest, children }) : /* @__PURE__ */ jsx("a", { href, className, ...rest, children });
4892
+ function useMacKeys() {
4893
+ const [mac, setMac] = useState(true);
4894
+ useEffect(() => {
4895
+ setMac(/Mac|iPhone|iPad/.test(navigator.platform || navigator.userAgent));
4896
+ }, []);
4897
+ return mac;
4431
4898
  }
4432
- function Breadcrumbs({ items, action, className }) {
4433
- return /* @__PURE__ */ jsxs("div", { className: cn("flex min-h-11 items-center justify-between gap-4 sm:min-h-0", className), children: [
4434
- /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: "min-w-0", children: /* @__PURE__ */ jsx("ol", { className: "flex min-w-0 items-center gap-1.5 text-[0.875rem] text-muted-foreground", children: items.map((c, i) => {
4435
- const last = i === items.length - 1;
4436
- return /* @__PURE__ */ jsxs("li", { className: cn("flex items-center gap-1.5", last ? "min-w-0" : "shrink-0"), children: [
4437
- c.href && !last ? /* @__PURE__ */ jsx(DocLink, { href: c.href, className: "inline-flex min-h-11 items-center transition-colors hover:text-foreground sm:min-h-0", children: c.label }) : /* @__PURE__ */ jsx("span", { "aria-current": last ? "page" : void 0, className: cn("truncate", last && "text-foreground"), children: c.label }),
4438
- !last ? /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": true, className: "size-3.5 shrink-0 text-oca-subtle" }) : null
4439
- ] }, i);
4440
- }) }) }),
4441
- action ? /* @__PURE__ */ jsx("div", { className: "shrink-0 text-[0.875rem]", children: action }) : null
4442
- ] });
4443
- }
4444
- function DocsPager({ prev, next, className }) {
4445
- if (!prev && !next) return null;
4446
- const card = (l, dir) => /* @__PURE__ */ jsxs(
4447
- DocLink,
4448
- {
4449
- href: l.href,
4450
- className: cn(
4451
- "group flex min-h-20 flex-col justify-center gap-1 rounded-2xl border border-border bg-card px-5 py-4 transition-colors hover:border-oca-hairline-strong",
4452
- dir === "next" && "items-end text-right sm:col-start-2"
4453
- ),
4454
- children: [
4455
- /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 text-[0.8125rem] text-muted-foreground", children: [
4456
- dir === "prev" ? /* @__PURE__ */ jsx(ArrowLeft, { "aria-hidden": true, className: "size-3.5" }) : null,
4457
- dir === "prev" ? "Previous" : "Next",
4458
- l.section ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: "\xB7" }) : null,
4459
- l.section ? /* @__PURE__ */ jsx("span", { className: "truncate", children: l.section }) : null,
4460
- dir === "next" ? /* @__PURE__ */ jsx(ArrowRight, { "aria-hidden": true, className: "size-3.5" }) : null
4461
- ] }),
4462
- /* @__PURE__ */ jsx("span", { className: "text-[1rem] font-medium leading-snug text-foreground", children: l.label })
4463
- ]
4464
- }
4465
- );
4466
- return /* @__PURE__ */ jsxs("nav", { "aria-label": "Previous and next page", className: cn("grid grid-cols-1 gap-3 border-t border-border pt-8 sm:grid-cols-2", className), children: [
4467
- prev ? card(prev, "prev") : null,
4468
- next ? card(next, "next") : null
4469
- ] });
4470
- }
4471
- function useHeadings(selector = "#docs-content", key) {
4472
- const [items, setItems] = useState([]);
4473
- useEffect(() => {
4474
- const read = () => {
4475
- const root = document.querySelector(selector);
4476
- if (!root) return setItems([]);
4477
- setItems(
4478
- Array.from(root.querySelectorAll("h2[id], h3[id]")).map((h) => ({
4479
- id: h.id,
4480
- // The anchor link's "#" is not part of the name.
4481
- label: (h.querySelector("[data-heading-text]") ?? h).textContent?.trim() ?? "",
4482
- level: h.tagName === "H3" ? 3 : 2
4483
- }))
4484
- );
4485
- };
4486
- const raf = requestAnimationFrame(read);
4487
- const t = setTimeout(read, 80);
4488
- return () => {
4489
- cancelAnimationFrame(raf);
4490
- clearTimeout(t);
4491
- };
4492
- }, [selector, key]);
4493
- const activeId = useActiveHeading(items.map((i) => i.id));
4494
- return { items, activeId };
4495
- }
4496
- function OnThisPage({
4497
- items,
4498
- activeId,
4499
- title = "On this page",
4500
- onNavigate,
4501
- className
4502
- }) {
4503
- const id = useId();
4504
- if (items.length === 0) return null;
4505
- return (
4506
- // With no visible title (a folded list under its own summary) the name is still "On this page".
4507
- /* @__PURE__ */ jsxs("nav", { "aria-labelledby": title ? id : void 0, "aria-label": title ? void 0 : "On this page", className, children: [
4508
- title ? /* @__PURE__ */ jsx("p", { id, className: "mb-3 text-[0.875rem] font-medium", children: title }) : null,
4509
- /* @__PURE__ */ jsx("ul", { children: items.map((t) => {
4510
- const on = t.id === activeId;
4511
- return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
4512
- "a",
4513
- {
4514
- href: `#${t.id}`,
4515
- onClick: onNavigate,
4516
- "aria-current": on ? "location" : void 0,
4517
- className: cn(
4518
- "block border-l py-1.5 text-[0.875rem] leading-snug transition-colors",
4519
- t.level === 3 ? "pl-7" : "pl-4",
4520
- on ? "border-foreground text-foreground" : "border-border text-muted-foreground hover:text-foreground"
4521
- ),
4522
- children: t.label
4523
- }
4524
- ) }, t.id);
4525
- }) })
4526
- ] })
4527
- );
4528
- }
4529
- var CALLOUT_TONE = { note: "neutral", warning: "brand", danger: "danger" };
4530
- function Callout({
4531
- tone = "note",
4532
- title,
4533
- children,
4534
- className
4535
- }) {
4536
- return /* @__PURE__ */ jsx(
4537
- Notice,
4538
- {
4539
- tone: CALLOUT_TONE[tone],
4540
- title,
4541
- role: "note",
4542
- className: cn("my-6 [&_p]:my-0 [&_p]:text-[0.9375rem] [&_p]:leading-relaxed [&_p+p]:mt-3", className),
4543
- children
4544
- }
4545
- );
4546
- }
4547
- function Step({ title, id, children }) {
4548
- return /* @__PURE__ */ jsxs("li", { className: "relative pb-8 pl-11 last:pb-0 [counter-increment:oca-step]", children: [
4549
- /* @__PURE__ */ jsx(
4550
- "span",
4551
- {
4552
- "aria-hidden": true,
4553
- className: "absolute left-0 top-0 flex size-7 items-center justify-center rounded-full border border-oca-hairline-strong bg-card text-[0.8125rem] oca-tabular text-foreground before:content-[counter(oca-step)]"
4554
- }
4555
- ),
4556
- /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "absolute bottom-1 left-[0.8125rem] top-9 w-px bg-border" }),
4557
- /* @__PURE__ */ jsx("h3", { id, className: "scroll-mt-28 pt-0.5 text-[1.0625rem] font-medium leading-snug tracking-[-0.008em] text-foreground", children: title }),
4558
- /* @__PURE__ */ jsx("div", { className: "mt-2 text-muted-foreground [&>*:first-child]:mt-0 [&>*:last-child]:mb-0", children })
4559
- ] });
4560
- }
4561
- function Steps({ children, className }) {
4562
- return /* @__PURE__ */ jsx("ol", { className: cn("not-prose my-8 flex flex-col [counter-reset:oca-step] [&>li:last-child>span:nth-child(2)]:hidden", className), children });
4563
- }
4564
- function LinkCard({
4565
- href,
4566
- title,
4567
- description,
4568
- icon,
4569
- meta,
4570
- className
4571
- }) {
4572
- const Arrow = isInternal(href) ? ArrowRight : ArrowUpRight;
4899
+ var typing = (el) => el instanceof HTMLElement && (el.isContentEditable || /^(INPUT|TEXTAREA|SELECT)$/.test(el.tagName));
4900
+ var SearchButton = forwardRef(function SearchButton2({ label = "Search", onClick, className }, ref) {
4901
+ const mac = useMacKeys();
4573
4902
  return /* @__PURE__ */ jsxs(
4574
- DocLink,
4903
+ "button",
4575
4904
  {
4576
- href,
4905
+ ref,
4906
+ type: "button",
4907
+ onClick,
4908
+ "aria-keyshortcuts": mac ? "Meta+K" : "Control+K",
4577
4909
  className: cn(
4578
- "group flex h-full flex-col gap-3 rounded-[1.25rem] border border-border bg-card p-5 transition-colors hover:border-oca-hairline-strong",
4910
+ "inline-flex size-10 items-center justify-center gap-2 rounded-full text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
4911
+ "md:h-10 md:w-56 md:justify-start md:border md:border-border md:bg-card md:pl-3.5 md:pr-2 md:hover:border-oca-hairline-strong md:hover:bg-card",
4579
4912
  className
4580
4913
  ),
4581
4914
  children: [
4582
- /* @__PURE__ */ jsxs("span", { className: "flex items-start justify-between gap-3", children: [
4583
- icon ? /* @__PURE__ */ jsx("span", { className: "flex size-9 shrink-0 items-center justify-center rounded-xl bg-muted text-foreground [&_svg]:size-[1.125rem]", children: icon }) : /* @__PURE__ */ jsx("span", { className: "text-[1rem] font-medium leading-snug text-foreground", children: title }),
4584
- /* @__PURE__ */ jsxs("span", { className: "flex shrink-0 items-center gap-2", children: [
4585
- meta,
4586
- /* @__PURE__ */ jsx(Arrow, { "aria-hidden": true, className: "size-4 text-muted-foreground transition-transform group-hover:translate-x-0.5 group-hover:text-foreground" })
4587
- ] })
4588
- ] }),
4589
- icon ? /* @__PURE__ */ jsx("span", { className: "text-[1rem] font-medium leading-snug text-foreground", children: title }) : null,
4590
- description ? /* @__PURE__ */ jsx("span", { className: "text-[0.9375rem] leading-relaxed text-muted-foreground", children: description }) : null
4915
+ /* @__PURE__ */ jsx(Search, { "aria-hidden": true, className: "size-[1.125rem] shrink-0 md:size-4" }),
4916
+ /* @__PURE__ */ jsx("span", { className: "sr-only flex-1 text-left text-[0.9375rem] md:not-sr-only", children: label }),
4917
+ /* @__PURE__ */ jsx(Kbd, { "aria-hidden": true, className: "hidden md:inline-flex", children: mac ? "\u2318K" : "Ctrl K" })
4591
4918
  ]
4592
4919
  }
4593
4920
  );
4594
- }
4595
- function CardGrid({ columns = 2, children, className }) {
4596
- return /* @__PURE__ */ jsx("div", { className: cn("not-prose my-6 grid grid-cols-1 gap-3 sm:grid-cols-2", columns === 3 && "lg:grid-cols-3", className), children });
4597
- }
4598
- function MdxTable({ className, ...props }) {
4599
- return /* @__PURE__ */ jsx("div", { className: "not-prose my-6 overflow-hidden rounded-2xl border border-border bg-card", children: /* @__PURE__ */ jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsx(
4600
- "table",
4601
- {
4602
- className: cn(
4603
- "w-full border-collapse text-left text-[0.875rem] leading-relaxed",
4604
- "[&_th]:whitespace-nowrap [&_th]:border-b [&_th]:border-oca-hairline-strong [&_th]:bg-oca-table-head [&_th]:px-4 [&_th]:py-2.5 [&_th]:text-[0.8125rem] [&_th]:font-medium [&_th]:text-foreground",
4605
- "[&_td]:border-t [&_td]:border-border [&_td]:px-4 [&_td]:py-2.5 [&_td]:align-top [&_td]:text-muted-foreground [&_tbody_tr:first-child_td]:border-t-0",
4606
- "[&_td_code]:bg-transparent [&_td_code]:p-0 [&_td_code]:text-foreground [&_td:first-child]:text-foreground",
4607
- "[&_[align=center]]:text-center [&_[align=right]]:text-right",
4608
- // On a phone a cell keeps a readable width; the table scrolls instead of crushing it.
4609
- "max-sm:[&_td]:min-w-[9rem]",
4610
- className
4611
- ),
4612
- ...props
4613
- }
4614
- ) }) });
4615
- }
4616
- function ApiTable({
4617
- rows,
4618
- caption,
4619
- nameHeader = "Name",
4921
+ });
4922
+ function SearchDialog({
4923
+ onQuery,
4924
+ open: openProp,
4925
+ onOpenChange,
4926
+ onSelect,
4927
+ button = true,
4928
+ hotkey = true,
4929
+ label = "Search",
4930
+ placeholder = "Search the docs",
4931
+ idle,
4932
+ defaultQuery = "",
4933
+ debounceMs = 120,
4620
4934
  className
4621
4935
  }) {
4622
- const hasDefault = rows.some((r) => r.default !== void 0);
4623
- const marks = (r) => /* @__PURE__ */ jsxs(Fragment, { children: [
4624
- r.required ? /* @__PURE__ */ jsx("span", { className: "text-[0.75rem] text-oca-accent-ink", children: "Required" }) : null,
4625
- r.deprecated ? /* @__PURE__ */ jsx(Badge, { tone: "muted", children: "Deprecated" }) : null,
4626
- r.status ? /* @__PURE__ */ jsx(StatusBadge, { status: r.status }) : null
4627
- ] });
4628
- return /* @__PURE__ */ jsxs("div", { className: cn("not-prose my-6", className), children: [
4629
- /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-2xl border border-border bg-card max-sm:hidden", children: /* @__PURE__ */ jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsxs("table", { className: "w-full border-collapse text-left text-[0.875rem]", children: [
4630
- caption ? /* @__PURE__ */ jsx("caption", { className: "sr-only", children: caption }) : null,
4631
- /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "border-b border-oca-hairline-strong bg-oca-table-head text-[0.8125rem]", children: [
4632
- /* @__PURE__ */ jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: nameHeader }),
4633
- /* @__PURE__ */ jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: "Type" }),
4634
- hasDefault ? /* @__PURE__ */ jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: "Default" }) : null,
4635
- /* @__PURE__ */ jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: "Description" })
4636
- ] }) }),
4637
- /* @__PURE__ */ jsx("tbody", { className: "divide-y divide-border", children: rows.map((r) => /* @__PURE__ */ jsxs("tr", { className: "align-top", children: [
4638
- /* @__PURE__ */ jsx("th", { scope: "row", className: "px-4 py-3 text-left font-normal", children: /* @__PURE__ */ jsxs("span", { className: "flex flex-col items-start gap-1", children: [
4639
- /* @__PURE__ */ jsx("code", { className: cn("font-mono text-[0.8125rem] text-foreground", r.deprecated && "line-through decoration-oca-subtle"), children: r.name }),
4640
- marks(r)
4641
- ] }) }),
4642
- /* @__PURE__ */ jsx("td", { className: "px-4 py-3 font-mono text-[0.8125rem] text-muted-foreground", children: r.type ?? "\u2014" }),
4643
- hasDefault ? /* @__PURE__ */ jsx("td", { className: "px-4 py-3 font-mono text-[0.8125rem] text-muted-foreground", children: r.default ?? "\u2014" }) : null,
4644
- /* @__PURE__ */ jsx("td", { className: "px-4 py-3 leading-relaxed text-muted-foreground", children: r.description })
4645
- ] }, r.name)) })
4646
- ] }) }) }),
4647
- /* @__PURE__ */ jsx("ul", { "aria-label": caption, className: "divide-y divide-border rounded-2xl border border-border bg-card sm:hidden", children: rows.map((r) => /* @__PURE__ */ jsxs("li", { className: "flex flex-col gap-1.5 px-4 py-3.5", children: [
4648
- /* @__PURE__ */ jsxs("span", { className: "flex flex-wrap items-baseline gap-x-2 gap-y-1", children: [
4649
- /* @__PURE__ */ jsx("code", { className: cn("font-mono text-[0.875rem] text-foreground", r.deprecated && "line-through decoration-oca-subtle"), children: r.name }),
4650
- r.type ? /* @__PURE__ */ jsx("code", { className: "break-all font-mono text-[0.8125rem] text-muted-foreground", children: r.type }) : null
4651
- ] }),
4652
- /* @__PURE__ */ jsx("span", { className: "flex flex-wrap items-center gap-2 empty:hidden", children: marks(r) }),
4653
- r.description ? /* @__PURE__ */ jsx("span", { className: "text-[0.875rem] leading-relaxed text-muted-foreground", children: r.description }) : null,
4654
- r.default !== void 0 ? /* @__PURE__ */ jsxs("span", { className: "text-[0.8125rem] text-muted-foreground", children: [
4655
- "Default ",
4656
- /* @__PURE__ */ jsx("code", { className: "font-mono text-foreground", children: r.default })
4657
- ] }) : null
4658
- ] }, r.name)) })
4659
- ] });
4660
- }
4661
- function useDarkMode() {
4662
- const [dark, setDark] = useState(false);
4663
- useEffect(() => {
4664
- const root = document.documentElement;
4665
- const read = () => setDark(root.classList.contains("dark"));
4666
- read();
4667
- const mo = new MutationObserver(read);
4668
- mo.observe(root, { attributes: true, attributeFilter: ["class"] });
4669
- return () => mo.disconnect();
4670
- }, []);
4671
- return dark;
4672
- }
4673
- function mermaidTheme(el) {
4674
- const css = getComputedStyle(el);
4675
- const v = (name) => css.getPropertyValue(name).trim();
4676
- const card = v("--card");
4677
- const muted = v("--muted");
4678
- const text = v("--foreground");
4679
- const subtle = v("--muted-foreground");
4680
- const line = v("--input");
4681
- const hair = v("--oca-hairline-strong");
4682
- return {
4683
- background: "transparent",
4684
- fontFamily: css.fontFamily,
4685
- fontSize: "14px",
4686
- textColor: text,
4687
- mainBkg: card,
4688
- primaryColor: card,
4689
- primaryTextColor: text,
4690
- primaryBorderColor: hair,
4691
- secondaryColor: muted,
4692
- secondaryTextColor: text,
4693
- secondaryBorderColor: hair,
4694
- tertiaryColor: muted,
4695
- tertiaryTextColor: text,
4696
- tertiaryBorderColor: hair,
4697
- nodeBorder: hair,
4698
- lineColor: line,
4699
- edgeLabelBackground: card,
4700
- clusterBkg: muted,
4701
- clusterBorder: hair,
4702
- titleColor: text,
4703
- noteBkgColor: muted,
4704
- noteTextColor: text,
4705
- noteBorderColor: hair,
4706
- actorBkg: card,
4707
- actorBorder: hair,
4708
- actorTextColor: text,
4709
- actorLineColor: line,
4710
- signalColor: text,
4711
- signalTextColor: text,
4712
- labelBoxBkgColor: card,
4713
- labelBoxBorderColor: hair,
4714
- labelTextColor: text,
4715
- loopTextColor: subtle,
4716
- activationBkgColor: muted,
4717
- activationBorderColor: hair,
4718
- sequenceNumberColor: card
4719
- };
4720
- }
4721
- function naturalSize(svg) {
4722
- const w = svg.match(/viewBox="[\d.-]+ [\d.-]+ ([\d.]+) [\d.]+"/)?.[1];
4723
- if (!w) return svg;
4724
- return svg.replace(/<svg([^>]*?)\swidth="100%"/, `<svg$1 width="${Math.ceil(Number(w))}"`).replace(/max-width:\s*[\d.]+px;?/, "");
4725
- }
4726
- function Diagram({ chart, caption, load, className }) {
4727
- const ref = useRef(null);
4728
- const dark = useDarkMode();
4729
- const raw = useId();
4730
- const [svg, setSvg] = useState(null);
4731
- const [failed, setFailed] = useState(false);
4732
- useEffect(() => {
4733
- let live = true;
4734
- const el = ref.current;
4735
- if (!el) return;
4736
- (async () => {
4737
- try {
4738
- const mod = await load();
4739
- const mermaid = "default" in mod ? mod.default : mod;
4740
- mermaid.initialize({ startOnLoad: false, securityLevel: "strict", theme: "base", themeVariables: mermaidTheme(el) });
4741
- const { svg: drawn } = await mermaid.render(`oca-diagram-${raw.replace(/[^a-zA-Z0-9]/g, "")}-${dark ? "d" : "l"}`, chart);
4742
- if (live) {
4743
- setSvg(naturalSize(drawn));
4744
- setFailed(false);
4745
- }
4746
- } catch {
4747
- if (live) setFailed(true);
4748
- }
4749
- })();
4750
- return () => {
4751
- live = false;
4752
- };
4753
- }, [chart, dark, load, raw]);
4754
- if (failed) return /* @__PURE__ */ jsx(CodeBlock, { code: chart, caption: "Diagram (shown as its source)", className: cn("my-6", className) });
4755
- return /* @__PURE__ */ jsxs("figure", { ref, className: cn("not-prose my-6 overflow-hidden rounded-[1.25rem] border border-border bg-card", className), children: [
4756
- svg ? /* @__PURE__ */ jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsx(
4757
- "div",
4758
- {
4759
- className: "flex w-max min-w-full justify-center p-6 [&_svg]:h-auto [&_svg]:max-w-none",
4760
- role: "img",
4761
- "aria-label": typeof caption === "string" ? caption : "Diagram",
4762
- dangerouslySetInnerHTML: { __html: svg }
4763
- }
4764
- ) }) : /* @__PURE__ */ jsx("div", { role: "status", "aria-label": "Drawing the diagram", className: "p-6", children: /* @__PURE__ */ jsx(Skeleton, { className: "h-40 w-full rounded-xl" }) }),
4765
- caption ? /* @__PURE__ */ jsx("figcaption", { className: "border-t border-border px-5 py-3 text-[0.8125rem] text-muted-foreground", children: caption }) : null
4766
- ] });
4767
- }
4768
- var HEADING = {
4769
- h1: "oca-display-3 mb-4 text-foreground",
4770
- h2: "mb-3 mt-12 text-[1.375rem] font-medium leading-tight tracking-[-0.015em] text-foreground md:text-[1.5rem]",
4771
- h3: "mb-2 mt-9 text-[1.125rem] font-medium leading-snug tracking-[-0.01em] text-foreground",
4772
- h4: "mb-2 mt-7 text-[1rem] font-medium leading-snug text-foreground"
4773
- };
4774
- function DocsHeading({
4775
- as: Tag,
4776
- id,
4777
- children,
4778
- className,
4779
- ...props
4780
- }) {
4781
- return /* @__PURE__ */ jsxs(Tag, { id, className: cn("group scroll-mt-28", HEADING[Tag], className), ...props, children: [
4782
- /* @__PURE__ */ jsx("span", { "data-heading-text": "", children }),
4783
- id && Tag !== "h1" ? /* @__PURE__ */ jsxs(
4784
- "a",
4785
- {
4786
- href: `#${id}`,
4787
- className: "ml-2 inline-block rounded-md px-1 align-baseline text-[0.85em] font-normal text-oca-subtle no-underline opacity-0 transition-opacity hover:text-foreground focus-visible:opacity-100 group-hover:opacity-100",
4788
- children: [
4789
- /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: "#" }),
4790
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Link to this section" })
4791
- ]
4792
- }
4793
- ) : null
4794
- ] });
4795
- }
4796
- function codeText(node) {
4797
- if (typeof node === "string") return node;
4798
- if (typeof node === "number") return String(node);
4799
- if (Array.isArray(node)) return node.map(codeText).join("");
4800
- if (isValidElement(node)) return codeText(node.props.children);
4801
- return "";
4802
- }
4803
- function codeLang(node) {
4804
- const child = Children.toArray(node)[0];
4805
- if (!isValidElement(child)) return void 0;
4806
- const cls = child.props.className ?? "";
4807
- return cls.match(/language-([\w+-]+)/)?.[1];
4808
- }
4809
- function useMacKeys() {
4810
- const [mac, setMac] = useState(true);
4811
- useEffect(() => {
4812
- setMac(/Mac|iPhone|iPad/.test(navigator.platform || navigator.userAgent));
4813
- }, []);
4814
- return mac;
4815
- }
4816
- var typing = (el) => el instanceof HTMLElement && (el.isContentEditable || /^(INPUT|TEXTAREA|SELECT)$/.test(el.tagName));
4817
- var SearchButton = forwardRef(function SearchButton2({ label = "Search", onClick, className }, ref) {
4818
- const mac = useMacKeys();
4819
- return /* @__PURE__ */ jsxs(
4820
- "button",
4821
- {
4822
- ref,
4823
- type: "button",
4824
- onClick,
4825
- "aria-keyshortcuts": mac ? "Meta+K" : "Control+K",
4826
- className: cn(
4827
- "inline-flex size-10 items-center justify-center gap-2 rounded-full text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
4828
- "md:h-10 md:w-56 md:justify-start md:border md:border-border md:bg-card md:pl-3.5 md:pr-2 md:hover:border-oca-hairline-strong md:hover:bg-card",
4829
- className
4830
- ),
4831
- children: [
4832
- /* @__PURE__ */ jsx(Search, { "aria-hidden": true, className: "size-[1.125rem] shrink-0 md:size-4" }),
4833
- /* @__PURE__ */ jsx("span", { className: "sr-only flex-1 text-left text-[0.9375rem] md:not-sr-only", children: label }),
4834
- /* @__PURE__ */ jsx(Kbd, { "aria-hidden": true, className: "hidden md:inline-flex", children: mac ? "\u2318K" : "Ctrl K" })
4835
- ]
4836
- }
4837
- );
4838
- });
4839
- function SearchDialog({
4840
- onQuery,
4841
- open: openProp,
4842
- onOpenChange,
4843
- onSelect,
4844
- button = true,
4845
- hotkey = true,
4846
- label = "Search",
4847
- placeholder = "Search the docs",
4848
- idle,
4849
- defaultQuery = "",
4850
- debounceMs = 120,
4851
- className
4852
- }) {
4853
- const [own, setOwn] = useState(false);
4854
- const open = openProp ?? own;
4855
- const setOpen = (v) => {
4856
- if (openProp === void 0) setOwn(v);
4857
- onOpenChange?.(v);
4858
- };
4859
- const [query, setQuery] = useState(defaultQuery);
4860
- const [groups, setGroups] = useState([]);
4861
- const [state, setState] = useState("idle");
4862
- const [active, setActive] = useState(0);
4863
- const listId = useId();
4864
- const listRef = useRef(null);
4865
- const buttonRef = useRef(null);
4866
- const returnTo = useRef(null);
4867
- const flat = useMemo(() => groups.flatMap((g) => g.results), [groups]);
4868
- const latest = useRef({ open, setOpen, onQuery });
4869
- latest.current = { open, setOpen, onQuery };
4936
+ const [own, setOwn] = useState(false);
4937
+ const open = openProp ?? own;
4938
+ const setOpen = (v) => {
4939
+ if (openProp === void 0) setOwn(v);
4940
+ onOpenChange?.(v);
4941
+ };
4942
+ const [query, setQuery] = useState(defaultQuery);
4943
+ const [groups, setGroups] = useState([]);
4944
+ const [state, setState] = useState("idle");
4945
+ const [active, setActive] = useState(0);
4946
+ const listId = useId();
4947
+ const listRef = useRef(null);
4948
+ const buttonRef = useRef(null);
4949
+ const returnTo = useRef(null);
4950
+ const flat = useMemo(() => groups.flatMap((g) => g.results), [groups]);
4951
+ const latest = useRef({ open, setOpen, onQuery });
4952
+ latest.current = { open, setOpen, onQuery };
4870
4953
  useEffect(() => {
4871
4954
  if (!hotkey) return;
4872
4955
  const onKey = (e) => {
@@ -5292,7 +5375,7 @@ function FormSection({
5292
5375
  "aria-current": status === "current" ? "step" : void 0,
5293
5376
  className: cn("scroll-mt-24 rounded-[1.25rem] border border-border bg-card", className),
5294
5377
  children: [
5295
- /* @__PURE__ */ jsxs("header", { className: cn("flex items-start gap-3.5", tight ? "px-5 pt-5" : "px-6 pt-6"), children: [
5378
+ /* @__PURE__ */ jsxs("header", { className: cn("flex flex-wrap items-start gap-x-3.5 gap-y-3", tight ? "px-5 pt-5" : "px-6 pt-6"), children: [
5296
5379
  n !== void 0 ? /* @__PURE__ */ jsx(
5297
5380
  "span",
5298
5381
  {
@@ -5319,7 +5402,7 @@ function FormSection({
5319
5402
  ] }),
5320
5403
  hint ? /* @__PURE__ */ jsx("p", { className: "text-[0.875rem] leading-snug text-muted-foreground", children: hint }) : null
5321
5404
  ] }),
5322
- action ? /* @__PURE__ */ jsx("div", { className: "shrink-0", children: action }) : null
5405
+ action ? /* @__PURE__ */ jsx("div", { className: cn("shrink-0 max-sm:basis-full", n !== void 0 && "max-sm:pl-[2.625rem]"), children: action }) : null
5323
5406
  ] }),
5324
5407
  /* @__PURE__ */ jsx("div", { className: cn("flex flex-col", tight ? "gap-4 p-5" : "gap-5 p-6", n !== void 0 && (tight ? "sm:pl-[3.875rem]" : "sm:pl-[4.125rem]")), children })
5325
5408
  ]
@@ -5549,27 +5632,30 @@ function FilterChips({
5549
5632
  onChange(cur.includes(v) ? cur.filter((x) => x !== v) : [...cur, v]);
5550
5633
  } else onChange(v);
5551
5634
  };
5552
- return /* @__PURE__ */ jsx(ScrollFade, { fade: "var(--background)", className: cn("w-full", className), children: /* @__PURE__ */ jsx("div", { role: "group", "aria-label": label, className: "flex w-max items-center gap-2 py-0.5", children: options.map((o) => {
5553
- const on = isOn(o.value);
5554
- return /* @__PURE__ */ jsxs(
5555
- "button",
5556
- {
5557
- type: "button",
5558
- "aria-pressed": on,
5559
- onClick: () => press(o.value),
5560
- className: cn(
5561
- "inline-flex shrink-0 items-center gap-1.5 rounded-full border px-3.5 text-[0.875rem] transition-colors",
5562
- tight ? "h-8" : "h-9",
5563
- on ? "border-foreground bg-foreground text-background" : "border-border bg-card text-muted-foreground hover:border-oca-hairline-strong hover:text-foreground"
5564
- ),
5565
- children: [
5566
- o.label,
5567
- o.count !== void 0 ? /* @__PURE__ */ jsx("span", { className: "oca-tabular", children: o.count.toLocaleString("en-US") }) : null
5568
- ]
5569
- },
5570
- o.value
5571
- );
5572
- }) }) });
5635
+ return (
5636
+ // Wraps rather than scrolls: every filter stays in view on a phone.
5637
+ /* @__PURE__ */ jsx("div", { role: "group", "aria-label": label, className: cn("flex flex-wrap items-center gap-2 py-0.5", className), children: options.map((o) => {
5638
+ const on = isOn(o.value);
5639
+ return /* @__PURE__ */ jsxs(
5640
+ "button",
5641
+ {
5642
+ type: "button",
5643
+ "aria-pressed": on,
5644
+ onClick: () => press(o.value),
5645
+ className: cn(
5646
+ "inline-flex shrink-0 items-center gap-1.5 rounded-full border px-3.5 text-[0.875rem] transition-colors",
5647
+ tight ? "h-8" : "h-9",
5648
+ on ? "border-foreground bg-foreground text-background" : "border-border bg-card text-muted-foreground hover:border-oca-hairline-strong hover:text-foreground"
5649
+ ),
5650
+ children: [
5651
+ o.label,
5652
+ o.count !== void 0 ? /* @__PURE__ */ jsx("span", { className: "oca-tabular", children: o.count.toLocaleString("en-US") }) : null
5653
+ ]
5654
+ },
5655
+ o.value
5656
+ );
5657
+ }) })
5658
+ );
5573
5659
  }
5574
5660
  function ToolGrid({
5575
5661
  tools,
@@ -5608,7 +5694,7 @@ function ToolGrid({
5608
5694
  ] }),
5609
5695
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
5610
5696
  /* @__PURE__ */ jsx(Heading, { className: "oca-title-sm", children: /* @__PURE__ */ jsx(
5611
- Link8,
5697
+ Link6,
5612
5698
  {
5613
5699
  href: t.href,
5614
5700
  className: "outline-none after:absolute after:inset-0 after:rounded-[1.25rem] after:content-['']",
@@ -5701,800 +5787,829 @@ function FamilyMenu({ current: current2, className }) {
5701
5787
  )
5702
5788
  ] });
5703
5789
  }
5704
- function NavLink({
5705
- item,
5706
- className,
5707
- onNavigate,
5708
- line = false
5709
- }) {
5710
- const cls = cn(
5711
- "rounded-full px-3 py-2 text-[0.9375rem] transition-colors",
5712
- item.active ? "text-foreground" : "text-muted-foreground hover:text-foreground",
5713
- line && "relative after:absolute after:inset-x-3 after:-bottom-[0.625rem] after:h-0.5 after:rounded-full",
5714
- line && item.active && "after:bg-foreground",
5715
- className
5716
- );
5717
- if (item.external) {
5718
- return /* @__PURE__ */ jsx("a", { href: item.href, className: cls, rel: "noreferrer", onClick: onNavigate, children: item.label });
5719
- }
5720
- return /* @__PURE__ */ jsx(Link8, { href: item.href, className: cls, "aria-current": item.active ? "page" : void 0, onClick: onNavigate, children: item.label });
5721
- }
5722
- function NavRow({ item, onNavigate }) {
5723
- const body = /* @__PURE__ */ jsxs(Fragment, { children: [
5724
- /* @__PURE__ */ jsx("span", { className: "text-[0.9375rem] font-medium leading-6 text-foreground", children: item.label }),
5725
- item.description ? /* @__PURE__ */ jsx("span", { className: "text-[0.8125rem] leading-snug text-muted-foreground", children: item.description }) : null
5726
- ] });
5727
- const cls = cn(
5728
- "flex flex-col gap-0.5 rounded-xl px-3 py-2 transition-colors hover:bg-accent",
5729
- item.active && "bg-muted hover:bg-muted dark:bg-white/[0.06]"
5730
- );
5731
- return item.external ? /* @__PURE__ */ jsx("a", { href: item.href, className: cls, rel: "noreferrer", onClick: onNavigate, children: body }) : /* @__PURE__ */ jsx(Link8, { href: item.href, className: cls, "aria-current": item.active ? "page" : void 0, onClick: onNavigate, children: body });
5732
- }
5733
- var seeAll = (item) => typeof item.label === "string" ? `All ${item.label.toLowerCase()}` : "See all";
5734
- function NavDropdown({ item }) {
5735
- const [open, setOpen] = useState(false);
5736
- const active = item.active || item.children?.some((c) => c.active);
5737
- return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
5738
- /* @__PURE__ */ jsxs(
5739
- PopoverTrigger,
5790
+ function SideNav({ groups, onNavigate }) {
5791
+ return /* @__PURE__ */ jsx("nav", { "aria-label": "Pages", className: "flex flex-col gap-5", children: groups.map((g, gi) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
5792
+ g.label ? /* @__PURE__ */ jsx("p", { className: "px-3 pb-1 text-[0.8125rem] text-muted-foreground", children: g.label }) : null,
5793
+ g.items.map((it) => /* @__PURE__ */ jsxs(
5794
+ Link6,
5740
5795
  {
5796
+ href: it.href,
5797
+ onClick: onNavigate,
5798
+ "aria-current": it.active ? "page" : void 0,
5741
5799
  className: cn(
5742
- "group inline-flex items-center gap-1 rounded-full py-2 pl-3 pr-2.5 text-[0.9375rem] transition-colors md:max-lg:pl-2.5 md:max-lg:pr-2",
5743
- active ? "text-foreground" : "text-muted-foreground hover:text-foreground data-[state=open]:text-foreground"
5800
+ "flex h-9 items-center gap-3 rounded-xl px-3 text-[0.9375rem] transition-colors",
5801
+ "[&_svg]:size-[1.0625rem] [&_svg]:shrink-0",
5802
+ it.active ? "bg-card text-foreground shadow-sm ring-1 ring-border [&_svg]:text-foreground" : "text-muted-foreground hover:bg-accent hover:text-foreground"
5744
5803
  ),
5745
5804
  children: [
5746
- item.label,
5747
- /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": true, className: "size-3.5 transition-transform duration-200 group-data-[state=open]:rotate-180" })
5805
+ it.icon,
5806
+ /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: it.label }),
5807
+ it.badge ? /* @__PURE__ */ jsx("span", { className: "shrink-0", children: it.badge }) : null
5748
5808
  ]
5749
- }
5750
- ),
5751
- /* @__PURE__ */ jsxs(PopoverContent, { align: "center", sideOffset: 10, className: "w-[min(calc(100vw-2rem),26rem)] p-2", children: [
5752
- /* @__PURE__ */ jsx("ul", { className: "flex flex-col", children: item.children?.map((c) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(NavRow, { item: c, onNavigate: () => setOpen(false) }) }, c.href)) }),
5753
- /* @__PURE__ */ jsx("div", { className: "mt-1.5 border-t border-border px-1 pt-1.5", children: /* @__PURE__ */ jsx(
5754
- NavLink,
5755
- {
5756
- item: { ...item, label: seeAll(item), children: void 0 },
5757
- className: "block rounded-xl px-2 py-2 text-[0.875rem]",
5758
- onNavigate: () => setOpen(false)
5759
- }
5760
- ) })
5761
- ] })
5762
- ] });
5809
+ },
5810
+ it.href
5811
+ ))
5812
+ ] }, g.label ?? gi)) });
5763
5813
  }
5764
- function SiteHeader({
5765
- home = "/",
5766
- brand,
5767
- product,
5768
- family,
5769
- nav = [],
5770
- search,
5771
- actions,
5772
- variant = "site",
5773
- navOnPhone = true,
5774
- menu: menuExtra,
5775
- className
5814
+ function SectionSwitch({
5815
+ sections,
5816
+ current: current2,
5817
+ onNavigate
5776
5818
  }) {
5777
- const [open, setOpen] = useState(false);
5778
- const tool = variant === "tool";
5779
- const size = tool ? 24 : 28;
5780
- const current2 = typeof family === "string" ? family : void 0;
5781
- const phoneNav = navOnPhone ? nav : [];
5782
- const menu = phoneNav.length > 0 || Boolean(family) || Boolean(menuExtra);
5783
- const brandNode = brand ?? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center", children: [
5784
- /* @__PURE__ */ jsx(Lockup, { size }),
5785
- product ? /* @__PURE__ */ jsxs(Fragment, { children: [
5786
- /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "mx-3 h-5 w-px bg-oca-hairline-strong" }),
5787
- /* @__PURE__ */ jsx("span", { className: "font-medium tracking-[-0.01em]", style: { fontSize: size * 0.56 }, children: product })
5788
- ] }) : null
5789
- ] });
5790
- const navigation = nav.length > 0 ? /* @__PURE__ */ jsx("nav", { "aria-label": "Main", className: "hidden items-center gap-1 md:flex", children: nav.map(
5791
- (n) => n.children?.length ? /* @__PURE__ */ jsx(NavDropdown, { item: n }, n.href) : (
5792
- // Between md and lg the family menu and the actions share the row: tighter.
5793
- /* @__PURE__ */ jsx(NavLink, { item: n, line: tool, className: tool ? void 0 : "md:max-lg:px-2.5" }, n.href)
5794
- )
5795
- ) }) : null;
5819
+ const cols = sections.length <= 3 ? sections.length : 2;
5796
5820
  return /* @__PURE__ */ jsx(
5797
- "header",
5821
+ "nav",
5798
5822
  {
5799
- className: cn(
5800
- "sticky top-0 z-40 w-full border-b bg-background/95 backdrop-blur-md supports-[backdrop-filter]:bg-background/90",
5801
- tool ? "border-border" : "border-transparent",
5802
- className
5803
- ),
5804
- children: /* @__PURE__ */ jsxs(
5823
+ "aria-label": "Sections",
5824
+ className: cn("grid gap-1 bg-muted p-1", cols === sections.length ? "rounded-full" : "rounded-[1.25rem]"),
5825
+ style: { gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` },
5826
+ children: sections.map((sec) => {
5827
+ const on = sec.id === current2.id;
5828
+ return /* @__PURE__ */ jsx(
5829
+ Link6,
5830
+ {
5831
+ href: sec.href,
5832
+ onClick: onNavigate,
5833
+ "aria-current": on ? "true" : void 0,
5834
+ className: cn(
5835
+ "flex h-8 min-w-0 items-center justify-center rounded-full px-1.5 text-[0.8125rem] font-medium transition-colors",
5836
+ on ? "bg-card text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
5837
+ ),
5838
+ children: /* @__PURE__ */ jsx("span", { className: "truncate", children: sec.label })
5839
+ },
5840
+ sec.id
5841
+ );
5842
+ })
5843
+ }
5844
+ );
5845
+ }
5846
+ function TabBar({ items }) {
5847
+ return /* @__PURE__ */ jsx(
5848
+ "nav",
5849
+ {
5850
+ "aria-label": "Pages",
5851
+ "data-oca-tabbar": "",
5852
+ className: "fixed inset-x-0 bottom-0 z-40 border-t border-border bg-background/90 pb-[env(safe-area-inset-bottom)] backdrop-blur-md md:hidden",
5853
+ children: /* @__PURE__ */ jsx(
5805
5854
  "div",
5806
5855
  {
5807
- className: cn(
5808
- "flex items-center justify-between gap-4",
5809
- tool ? "h-14 px-4 md:px-6" : "oca-container h-16 md:h-[4.5rem] md:max-lg:gap-2",
5810
- // Three columns, the outer two each at least their content: the
5811
- // navigation stays centred whatever the actions hold, so it does
5812
- // not shift when they change (signed out to signed in).
5813
- !tool && nav.length > 0 && "md:grid md:grid-cols-[minmax(max-content,1fr)_auto_minmax(max-content,1fr)]"
5814
- ),
5815
- children: [
5816
- /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 items-center gap-1", tool ? "md:gap-1" : "justify-self-start"), children: [
5817
- /* @__PURE__ */ jsxs(Link8, { href: home, className: "-ml-1 min-w-0 rounded-lg p-1", children: [
5818
- brandNode,
5819
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: " home" })
5820
- ] }),
5821
- family ? /* @__PURE__ */ jsx(FamilyMenu, { current: current2, className: "max-md:hidden" }) : null,
5822
- tool && navigation ? /* @__PURE__ */ jsx("div", { className: "ml-5", children: navigation }) : null
5823
- ] }),
5824
- !tool ? navigation : null,
5825
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 justify-self-end", children: [
5826
- search,
5827
- actions,
5828
- menu ? /* @__PURE__ */ jsxs(Sheet, { open, onOpenChange: setOpen, children: [
5829
- /* @__PURE__ */ jsx(
5830
- SheetTrigger,
5856
+ className: "mx-auto grid h-14 max-w-[32rem] px-1.5",
5857
+ style: { gridTemplateColumns: `repeat(${items.length}, minmax(0, 1fr))` },
5858
+ children: items.map((it) => /* @__PURE__ */ jsxs(
5859
+ Link6,
5860
+ {
5861
+ href: it.href,
5862
+ "aria-current": it.active ? "page" : void 0,
5863
+ className: cn(
5864
+ "flex min-w-0 flex-col items-center justify-center gap-1 rounded-2xl text-[0.6875rem] leading-none outline-none transition-colors [-webkit-tap-highlight-color:transparent] focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
5865
+ it.active ? "text-foreground" : "text-muted-foreground hover:text-foreground"
5866
+ ),
5867
+ children: [
5868
+ /* @__PURE__ */ jsxs(
5869
+ "span",
5831
5870
  {
5832
- className: "inline-flex size-10 items-center justify-center rounded-full text-foreground hover:bg-accent md:hidden",
5833
- "aria-label": "Open menu",
5834
- children: /* @__PURE__ */ jsx(Menu, { className: "size-5" })
5871
+ className: cn(
5872
+ "relative flex h-7 w-12 items-center justify-center rounded-full transition-[background-color,box-shadow] duration-200",
5873
+ "[&_svg]:size-[1.125rem] [&_svg]:shrink-0",
5874
+ it.active ? "bg-card shadow-sm ring-1 ring-border [&_svg]:stroke-2" : "[&_svg]:stroke-[1.75]"
5875
+ ),
5876
+ children: [
5877
+ it.icon,
5878
+ it.badge ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "absolute right-2.5 top-0.5 size-2 rounded-full bg-oca-orange ring-2 ring-background" }) : null
5879
+ ]
5835
5880
  }
5836
5881
  ),
5837
- /* @__PURE__ */ jsxs(SheetContent, { side: "right", className: "pt-16", children: [
5838
- /* @__PURE__ */ jsx(SheetTitle, { className: "sr-only", children: "Menu" }),
5839
- menuExtra ? /* @__PURE__ */ jsx("div", { className: cn("flex flex-col", (phoneNav.length > 0 || family) && "border-b border-border pb-3"), children: menuExtra }) : null,
5840
- phoneNav.length > 0 ? /* @__PURE__ */ jsx("nav", { "aria-label": "Main", className: "flex flex-col", children: phoneNav.map(
5841
- (n) => n.children?.length ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col py-2", children: [
5842
- /* @__PURE__ */ jsx("p", { className: "px-3 pb-1 text-[0.8125rem] text-muted-foreground", children: n.label }),
5843
- n.children.map((c) => /* @__PURE__ */ jsx(
5844
- NavLink,
5845
- {
5846
- item: c,
5847
- className: "rounded-xl px-3 py-2.5 text-[1.0625rem]",
5848
- onNavigate: () => setOpen(false)
5849
- },
5850
- c.href
5851
- ))
5852
- ] }, n.href) : /* @__PURE__ */ jsx(
5853
- NavLink,
5854
- {
5855
- item: n,
5856
- className: "rounded-xl px-3 py-3 text-[1.0625rem]",
5857
- onNavigate: () => setOpen(false)
5858
- },
5859
- n.href
5860
- )
5861
- ) }) : null,
5862
- family ? /* @__PURE__ */ jsxs("details", { className: cn("group", phoneNav.length > 0 && "mt-2 border-t border-border pt-4"), children: [
5863
- /* @__PURE__ */ jsxs("summary", { className: "flex cursor-pointer list-none items-center justify-between rounded-xl px-3 py-2.5 text-[1.0625rem] [&::-webkit-details-marker]:hidden", children: [
5864
- "All orangecheck sites",
5865
- /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": true, className: "size-4 text-muted-foreground transition-transform group-open:rotate-180" })
5866
- ] }),
5867
- /* @__PURE__ */ jsx(FamilyList, { current: current2, onNavigate: () => setOpen(false), stack: true, className: "mt-2" })
5868
- ] }) : null
5869
- ] })
5870
- ] }) : null
5871
- ] })
5872
- ]
5882
+ /* @__PURE__ */ jsx("span", { className: "max-w-full truncate px-0.5", children: it.label }),
5883
+ it.badge ? /* @__PURE__ */ jsx("span", { className: "sr-only", children: it.badge }) : null
5884
+ ]
5885
+ },
5886
+ it.href
5887
+ ))
5873
5888
  }
5874
5889
  )
5875
5890
  }
5876
5891
  );
5877
5892
  }
5878
- function SkipLink({ href = "#main-content", children = "Skip to content" }) {
5879
- return /* @__PURE__ */ jsx(
5880
- "a",
5881
- {
5882
- href,
5883
- className: "sr-only focus:not-sr-only focus:fixed focus:left-4 focus:top-3 focus:z-50 focus:rounded-full focus:border focus:border-border focus:bg-card focus:px-4 focus:py-2 focus:text-[0.9375rem] focus:font-medium focus:text-foreground focus:shadow-md",
5884
- children
5893
+ function tabsFor(groups) {
5894
+ const items = groups.flatMap((g) => g.items);
5895
+ return items.length >= 2 && items.length <= 5 && items.every((it) => it.icon) ? items : null;
5896
+ }
5897
+ var activeItem = (groups) => groups.flatMap((g) => g.items).find((it) => it.active);
5898
+ var warned = /* @__PURE__ */ new Set();
5899
+ function warnDuplicateLabels(groups) {
5900
+ if (typeof process === "undefined" || process.env.NODE_ENV === "production") return;
5901
+ const seen = /* @__PURE__ */ new Set();
5902
+ for (const it of groups.flatMap((g) => g.items)) {
5903
+ if (seen.has(it.label) && !warned.has(it.label)) {
5904
+ warned.add(it.label);
5905
+ console.warn(`AppShell: two pages are labelled "${it.label}"; give each its own name.`);
5885
5906
  }
5886
- );
5907
+ seen.add(it.label);
5908
+ }
5887
5909
  }
5888
- var BANNER_TONE = {
5889
- neutral: "border-border bg-muted",
5890
- brand: "border-[color-mix(in_oklab,var(--oca-orange)_30%,var(--border))] bg-[color-mix(in_oklab,var(--oca-orange)_9%,var(--background))]",
5891
- danger: "border-[color-mix(in_oklab,var(--destructive)_35%,var(--border))] bg-[color-mix(in_oklab,var(--destructive)_8%,var(--background))]"
5892
- };
5893
- function SiteBanner({
5894
- tone = "neutral",
5910
+ function AppShell({
5911
+ nav,
5912
+ sections,
5913
+ activeSection,
5914
+ page: pageOverride,
5915
+ persistent = [],
5916
+ home = "/",
5917
+ family,
5918
+ account,
5919
+ banner,
5920
+ footer,
5895
5921
  children,
5896
- action,
5897
- className
5898
- }) {
5899
- return /* @__PURE__ */ jsx("div", { role: "status", "aria-live": "polite", "data-tone": tone, className: cn("border-b text-[0.875rem]", BANNER_TONE[tone], className), children: /* @__PURE__ */ jsxs("div", { className: "oca-container flex flex-wrap items-center justify-between gap-x-4 gap-y-1 py-2.5", children: [
5900
- /* @__PURE__ */ jsxs("p", { className: "flex min-w-0 items-baseline gap-2.5 leading-snug", children: [
5901
- tone !== "neutral" ? /* @__PURE__ */ jsx(
5902
- "span",
5903
- {
5904
- "aria-hidden": true,
5905
- className: cn(
5906
- "size-2 shrink-0 translate-y-[-0.05em] rounded-full",
5907
- tone === "brand" ? "bg-oca-orange" : "bg-destructive"
5908
- )
5909
- }
5910
- ) : null,
5911
- /* @__PURE__ */ jsx("span", { children })
5912
- ] }),
5913
- action ? /* @__PURE__ */ jsx("div", { className: cn("shrink-0 font-medium", tone !== "neutral" && "max-sm:pl-[1.125rem]"), children: action }) : null
5914
- ] }) });
5915
- }
5916
- var FOOT_LINK = "inline-flex min-h-11 items-center transition-colors hover:text-foreground md:min-h-0";
5917
- function LegalRow({ links }) {
5918
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:items-center sm:justify-between", children: [
5919
- /* @__PURE__ */ jsx("nav", { "aria-label": "Legal", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-x-5", children: links.map((l) => /* @__PURE__ */ jsx("li", { children: l.href.startsWith("/") ? /* @__PURE__ */ jsx(Link8, { href: l.href, className: FOOT_LINK, children: l.label }) : /* @__PURE__ */ jsx("a", { href: l.href, className: FOOT_LINK, children: l.label }) }, l.href)) }) }),
5920
- /* @__PURE__ */ jsxs("p", { children: [
5921
- "\xA9 ",
5922
- (/* @__PURE__ */ new Date()).getFullYear(),
5923
- " OrangeCheck"
5924
- ] })
5925
- ] });
5926
- }
5927
- function SiteFooter({
5928
- columns = [],
5929
- family = false,
5930
- legal = false,
5931
- compact = false,
5932
- fineprint,
5933
- meta,
5934
- signature = true,
5935
5922
  className
5936
5923
  }) {
5937
- const legalLinks = legal === true ? LEGAL_LINKS : legal || null;
5938
- if (compact) {
5939
- return /* @__PURE__ */ jsx("footer", { className: cn("border-t border-border bg-background text-[0.875rem] text-muted-foreground", className), children: /* @__PURE__ */ jsxs("div", { className: "oca-container flex flex-col gap-x-8 gap-y-3 py-5 lg:flex-row lg:items-center lg:justify-between", children: [
5940
- /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-6 gap-y-1", children: [
5941
- /* @__PURE__ */ jsx("a", { href: OCHK_IO, className: "rounded-lg text-foreground", children: /* @__PURE__ */ jsx(Lockup, { size: 22 }) }),
5942
- family ? /* @__PURE__ */ jsx("nav", { "aria-label": "Protocols", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-x-4", children: PROTOCOLS.map((p) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("a", { href: p.pageHref, className: FOOT_LINK, children: p.label }) }, p.slug)) }) }) : null
5943
- ] }),
5944
- legalLinks || meta ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:flex-wrap sm:items-center", children: [
5945
- legalLinks ? /* @__PURE__ */ jsx(LegalRow, { links: legalLinks }) : null,
5946
- meta
5947
- ] }) : null
5948
- ] }) });
5949
- }
5950
- const cols = [
5951
- ...columns,
5952
- ...family ? familyByGroup().map((g) => ({
5953
- // The lockup above already says orangecheck.
5954
- heading: g.id === "orangecheck" ? "Start here" : g.label,
5955
- links: g.sites.map((s) => ({ href: s.href, label: s.label, external: true }))
5956
- })) : []
5957
- ];
5958
- const n = cols.length;
5959
- const inline = n <= 5;
5960
- const grid = {
5961
- "--oca-footer-md": `repeat(${Math.max(1, Math.min(n, 4))}, minmax(0, 1fr))`,
5962
- "--oca-footer-lg": inline ? `minmax(0, 1.3fr) repeat(${Math.max(1, n)}, minmax(0, 1fr))` : `repeat(${Math.min(n, 6)}, minmax(0, 1fr))`
5963
- };
5964
- return /* @__PURE__ */ jsxs("footer", { className: cn("border-t border-border bg-background", className), children: [
5965
- /* @__PURE__ */ jsxs(
5966
- "div",
5967
- {
5968
- style: grid,
5969
- className: "oca-container grid grid-cols-2 gap-x-6 gap-y-10 py-14 md:grid-cols-[var(--oca-footer-md)] md:py-16 lg:grid-cols-[var(--oca-footer-lg)]",
5970
- children: [
5971
- /* @__PURE__ */ jsxs("div", { className: cn("col-span-full flex flex-col gap-4", inline && "lg:col-span-1"), children: [
5972
- /* @__PURE__ */ jsx(Lockup, { size: 26 }),
5973
- fineprint ? /* @__PURE__ */ jsx("p", { className: "max-w-xs text-[0.9375rem] leading-relaxed text-muted-foreground", children: fineprint }) : null
5974
- ] }),
5975
- cols.map((col, i) => {
5976
- const spans = n % 2 === 1 && i === n - 1;
5977
- return /* @__PURE__ */ jsxs(
5978
- "div",
5979
- {
5980
- className: cn("flex min-w-0 flex-col gap-1", spans && "col-span-2 md:col-span-1"),
5981
- children: [
5982
- /* @__PURE__ */ jsx("p", { className: "mb-2 text-[0.875rem] font-medium", children: col.heading }),
5983
- /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-1", spans && "grid grid-cols-2 gap-x-6 md:flex md:flex-col"), children: col.links.map((l) => /* @__PURE__ */ jsx(
5984
- NavLink,
5985
- {
5986
- item: l,
5987
- className: "-mx-3 py-2.5 text-[0.9375rem] md:py-1.5"
5988
- },
5989
- l.href
5990
- )) })
5991
- ]
5992
- },
5993
- col.heading
5994
- );
5995
- })
5996
- ]
5997
- }
5998
- ),
5999
- signature ? /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "oca-container select-none overflow-hidden pb-8 md:pb-12", children: /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-[0.18em] text-[clamp(3rem,11.5vw,10rem)] leading-[0.78] tracking-[-0.065em] [font-family:var(--oc-font-display)]", children: [
6000
- /* @__PURE__ */ jsx("span", { className: "mb-[0.06em] inline-block w-[1.1em] shrink-0", children: /* @__PURE__ */ jsx(Mark, { className: "block h-auto w-full" }) }),
6001
- /* @__PURE__ */ jsx("span", { children: "orangecheck" })
6002
- ] }) }) : null,
6003
- legalLinks || meta ? /* @__PURE__ */ jsx("div", { className: "oca-container", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 border-t border-border py-6 text-[0.875rem] text-muted-foreground", children: [
6004
- legalLinks ? /* @__PURE__ */ jsx(LegalRow, { links: legalLinks }) : null,
6005
- meta
6006
- ] }) }) : null
6007
- ] });
6008
- }
6009
- function SignInFrame({
6010
- title = "Sign in",
6011
- lead,
6012
- children,
6013
- error,
6014
- fineprint,
6015
- brand,
6016
- home = "/",
6017
- back,
6018
- art,
6019
- caption,
6020
- className
6021
- }) {
6022
- return /* @__PURE__ */ jsxs(
6023
- "main",
5924
+ const [open, setOpen] = useState(false);
5925
+ const current2 = sections && sections.length > 0 ? sections.find((sec) => sec.id === activeSection) ?? sections.find((sec) => activeItem(sec.groups)) ?? sections[0] : void 0;
5926
+ const groups = current2 ? [...current2.groups, ...persistent] : [...nav ?? [], ...persistent];
5927
+ warnDuplicateLabels(groups);
5928
+ const tabs = current2 ? null : tabsFor(groups);
5929
+ const page = activeItem(groups);
5930
+ const place = useMemo(
5931
+ () => ({
5932
+ section: current2 ? current2.title ?? current2.label : void 0,
5933
+ page: pageOverride ?? page?.label
5934
+ }),
5935
+ [current2, page?.label, pageOverride]
5936
+ );
5937
+ const familyMenu = family ? /* @__PURE__ */ jsx(FamilyMenu, { current: typeof family === "string" ? family : void 0 }) : null;
5938
+ const switcher = sections && current2 && sections.length > 1 ? /* @__PURE__ */ jsx(SectionSwitch, { sections, current: current2, onNavigate: () => setOpen(false) }) : null;
5939
+ return /* @__PURE__ */ jsx(ShellContext.Provider, { value: place, children: /* @__PURE__ */ jsxs(
5940
+ "div",
6024
5941
  {
6025
- id: "main-content",
6026
- className: cn("grid min-h-dvh grid-cols-1 bg-background text-foreground lg:grid-cols-2", className),
5942
+ className: cn(
5943
+ "min-h-dvh bg-background",
5944
+ tabs && "max-md:pb-[calc(3.5rem_+_env(safe-area-inset-bottom))]",
5945
+ className
5946
+ ),
6027
5947
  children: [
6028
- /* @__PURE__ */ jsxs("section", { className: "flex flex-col px-4 pb-8 pt-5 sm:px-8 lg:px-14 lg:pt-8", children: [
6029
- /* @__PURE__ */ jsxs("header", { className: "flex items-center justify-between gap-4", children: [
6030
- /* @__PURE__ */ jsxs(Link8, { href: home, className: "w-fit rounded-lg", children: [
6031
- brand ?? /* @__PURE__ */ jsx(Lockup, { size: 28 }),
6032
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: " home" })
5948
+ /* @__PURE__ */ jsxs("div", { className: "sticky top-0 z-40 border-b border-border bg-background/90 backdrop-blur-md lg:hidden", children: [
5949
+ /* @__PURE__ */ jsxs("div", { className: "flex h-14 items-center gap-2 px-3", children: [
5950
+ /* @__PURE__ */ jsxs(Sheet, { open, onOpenChange: setOpen, children: [
5951
+ /* @__PURE__ */ jsx(
5952
+ SheetTrigger,
5953
+ {
5954
+ className: cn(
5955
+ "inline-flex size-10 items-center justify-center rounded-full hover:bg-accent",
5956
+ // The tab bar holds every page; the sheet is left for a footer.
5957
+ tabs && !footer && "max-md:hidden"
5958
+ ),
5959
+ "aria-label": "Open navigation",
5960
+ children: /* @__PURE__ */ jsx(Menu, { className: "size-5" })
5961
+ }
5962
+ ),
5963
+ /* @__PURE__ */ jsxs(SheetContent, { side: "left", className: "flex flex-col gap-6 overflow-y-auto p-4 pt-16", children: [
5964
+ /* @__PURE__ */ jsx(SheetTitle, { className: "sr-only", children: "Navigation" }),
5965
+ switcher,
5966
+ /* @__PURE__ */ jsx("div", { className: tabs ? "max-md:hidden" : void 0, children: /* @__PURE__ */ jsx(SideNav, { groups, onNavigate: () => setOpen(false) }) }),
5967
+ footer ? /* @__PURE__ */ jsx("div", { className: "mt-auto flex flex-col gap-3", children: footer }) : null
5968
+ ] })
6033
5969
  ] }),
6034
- back === void 0 ? /* @__PURE__ */ jsx(
6035
- Link8,
6036
- {
6037
- href: home,
6038
- className: "text-[0.9375rem] text-muted-foreground underline-offset-4 hover:text-foreground hover:underline",
6039
- children: "Back to home"
6040
- }
6041
- ) : back
5970
+ /* @__PURE__ */ jsx(Link6, { href: home, "aria-label": "Home", className: "rounded-lg p-1", children: /* @__PURE__ */ jsx(Lockup, { size: 22 }) }),
5971
+ familyMenu,
5972
+ /* @__PURE__ */ jsx("div", { className: "ml-auto flex items-center", children: account })
6042
5973
  ] }),
6043
- /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-[25rem] flex-1 flex-col justify-center gap-9 py-12", children: [
6044
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
6045
- /* @__PURE__ */ jsx("h1", { className: "oca-display-2", children: title }),
6046
- lead ? /* @__PURE__ */ jsx("p", { className: "oca-lead", children: lead }) : null
5974
+ place.page ? /* @__PURE__ */ jsxs(
5975
+ "div",
5976
+ {
5977
+ className: cn(
5978
+ "flex h-9 items-center gap-1.5 border-t border-border px-4 text-[0.875rem]",
5979
+ // The active tab already names the page.
5980
+ tabs && !pageOverride && "max-md:hidden"
5981
+ ),
5982
+ children: [
5983
+ place.section ? /* @__PURE__ */ jsxs(Fragment, { children: [
5984
+ /* @__PURE__ */ jsx("span", { className: "shrink-0 text-muted-foreground", children: place.section }),
5985
+ /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": true, className: "size-3.5 shrink-0 text-muted-foreground" })
5986
+ ] }) : null,
5987
+ /* @__PURE__ */ jsx("span", { className: "truncate font-medium", children: place.page })
5988
+ ]
5989
+ }
5990
+ ) : null
5991
+ ] }),
5992
+ /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-[90rem]", children: [
5993
+ /* @__PURE__ */ jsxs("aside", { className: "sticky top-0 hidden h-dvh w-[17rem] shrink-0 flex-col gap-6 overflow-y-auto px-4 py-6 lg:flex", children: [
5994
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
5995
+ /* @__PURE__ */ jsx(Link6, { href: home, className: "px-2", "aria-label": "Home", children: /* @__PURE__ */ jsx(Lockup, { size: 26 }) }),
5996
+ familyMenu
6047
5997
  ] }),
6048
- /* @__PURE__ */ jsx("div", { children }),
6049
- error ? /* @__PURE__ */ jsx("p", { role: "alert", className: "text-[0.9375rem] text-destructive", children: error }) : null,
6050
- fineprint ? /* @__PURE__ */ jsx("p", { className: "text-[0.8125rem] leading-relaxed text-muted-foreground", children: fineprint }) : null
5998
+ switcher,
5999
+ /* @__PURE__ */ jsx(SideNav, { groups }),
6000
+ /* @__PURE__ */ jsx("div", { className: "mt-auto flex flex-col gap-3", children: footer })
6001
+ ] }),
6002
+ /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
6003
+ /* @__PURE__ */ jsx("div", { className: "hidden h-[4.5rem] items-center justify-end gap-3 px-8 lg:flex", children: account }),
6004
+ banner ? /* @__PURE__ */ jsx("div", { className: "px-4 pb-2 pt-4 md:px-8 lg:pt-0", children: banner }) : null,
6005
+ /* @__PURE__ */ jsx("main", { id: "main-content", className: "flex-1 px-4 pb-16 pt-6 md:px-8 lg:pt-2", children: /* @__PURE__ */ jsx("div", { className: "mx-auto w-full max-w-[72rem]", children }) })
6051
6006
  ] })
6052
6007
  ] }),
6053
- /* @__PURE__ */ jsxs(
6054
- "aside",
6055
- {
6056
- "aria-hidden": true,
6057
- className: "relative hidden flex-col justify-between gap-10 overflow-hidden border-l border-[var(--oca-band-line)] bg-oca-ink p-14 text-oca-ink-foreground lg:flex",
6058
- children: [
6059
- /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center justify-center", children: art ?? /* @__PURE__ */ jsx(IsoCheck, { size: 340, settle: true, tilt: true, className: "max-w-full" }) }),
6060
- caption ? /* @__PURE__ */ jsx("div", { className: "flex max-w-[24rem] flex-col gap-3", children: caption }) : null
6061
- ]
6062
- }
6063
- )
6008
+ tabs ? /* @__PURE__ */ jsx(TabBar, { items: tabs }) : null
6064
6009
  ]
6065
6010
  }
6066
- );
6067
- }
6068
- var STATUS_WORDS = /* @__PURE__ */ new Set(["live", "testing", "not-yet", "paused", "good", "caution", "refused"]);
6069
- var pathOf = (href) => href.split(/[?#]/)[0].replace(/(.)\/$/, "$1");
6070
- function DocsNav({
6071
- sections,
6072
- current: current2,
6073
- onNavigate,
6074
- className
6075
- }) {
6076
- const here = pathOf(current2);
6077
- const activeSection = useMemo(
6078
- () => sections.findIndex((s) => s.items.some((i) => pathOf(i.href) === here)),
6079
- [sections, here]
6080
- );
6081
- const [peeked, setPeeked] = useState(() => /* @__PURE__ */ new Set());
6082
- useEffect(() => setPeeked(/* @__PURE__ */ new Set()), [activeSection]);
6083
- const activeRef = useRef(null);
6084
- useEffect(() => {
6085
- const id = requestAnimationFrame(() => activeRef.current?.scrollIntoView({ block: "nearest" }));
6086
- return () => cancelAnimationFrame(id);
6087
- }, [here]);
6088
- const base = useId();
6089
- return /* @__PURE__ */ jsx("nav", { "aria-label": "Docs", className: cn("flex flex-col gap-0.5", className), children: sections.map((section, si) => {
6090
- const isActive = si === activeSection;
6091
- const open = isActive || peeked.has(si);
6092
- const panel = `${base}-s${si}`;
6093
- return /* @__PURE__ */ jsxs("div", { children: [
6094
- /* @__PURE__ */ jsxs(
6095
- "button",
6096
- {
6097
- type: "button",
6098
- "aria-expanded": open,
6099
- "aria-controls": panel,
6100
- onClick: () => {
6101
- if (isActive) return;
6102
- setPeeked((p) => {
6103
- const n = new Set(p);
6104
- if (n.has(si)) n.delete(si);
6105
- else n.add(si);
6106
- return n;
6107
- });
6108
- },
6109
- className: cn(
6110
- "flex min-h-9 w-full items-center justify-between gap-2 rounded-lg px-2.5 py-1.5 text-left text-[0.875rem] transition-colors",
6111
- isActive ? "font-medium text-foreground" : "text-muted-foreground hover:bg-accent hover:text-foreground",
6112
- isActive && "cursor-default"
6113
- ),
6114
- children: [
6115
- section.label,
6116
- /* @__PURE__ */ jsx(
6117
- ChevronRight,
6118
- {
6119
- "aria-hidden": true,
6120
- className: cn("size-3.5 shrink-0 text-oca-subtle transition-transform duration-200", open && "rotate-90")
6121
- }
6122
- )
6123
- ]
6124
- }
6125
- ),
6126
- /* @__PURE__ */ jsx("ul", { id: panel, hidden: !open, className: "mb-2 ml-2.5 mt-0.5 border-l border-border", children: section.items.map((item) => {
6127
- const on = pathOf(item.href) === here;
6128
- const badge = typeof item.badge === "string" && STATUS_WORDS.has(item.badge) ? /* @__PURE__ */ jsx(StatusBadge, { status: item.badge }) : item.badge ? /* @__PURE__ */ jsx(Badge, { tone: "muted", children: item.badge }) : null;
6129
- return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
6130
- Link8,
6131
- {
6132
- href: item.href,
6133
- ref: on ? activeRef : void 0,
6134
- onClick: onNavigate,
6135
- "aria-current": on ? "page" : void 0,
6136
- className: cn(
6137
- "-ml-px flex min-h-9 items-center gap-2 border-l-2 py-1.5 pl-3.5 pr-2 text-[0.875rem] leading-snug transition-colors",
6138
- on ? "border-foreground font-medium text-foreground" : "border-transparent text-muted-foreground hover:border-oca-hairline-strong hover:text-foreground"
6139
- ),
6140
- children: [
6141
- /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1", children: item.label }),
6142
- badge
6143
- ]
6144
- }
6145
- ) }, item.href);
6146
- }) })
6147
- ] }, section.label);
6148
- }) });
6011
+ ) });
6149
6012
  }
6150
- var DOCS_HEADER_NAV = OCHK_IO_NAV.map((n) => n.href === DOCS_HREF ? { ...n, active: true } : n);
6151
- function DocsShell({
6152
- nav,
6153
- current: current2,
6154
- header,
6155
- search,
6156
- actions,
6157
- breadcrumbs,
6158
- toc,
6159
- pager,
6160
- footer,
6161
- children
6013
+ function AccountMenu({
6014
+ name,
6015
+ detail,
6016
+ items,
6017
+ nameFrom = "sm"
6162
6018
  }) {
6163
- const [menu, setMenu] = useState(false);
6164
- useEffect(() => setMenu(false), [current2]);
6165
- const read = useHeadings("#docs-content", current2);
6166
- const items = toc ?? read.items;
6167
- const activeId = toc ? void 0 : read.activeId;
6168
- const here = pathOf(current2);
6169
- const place = useMemo(() => {
6170
- for (const s of nav) {
6171
- const it = s.items.find((i) => pathOf(i.href) === here);
6172
- if (it) return { section: s.label, page: it.label };
6173
- }
6174
- return null;
6175
- }, [nav, here]);
6176
- return /* @__PURE__ */ jsxs("div", { className: "flex min-h-dvh flex-col bg-background", children: [
6177
- /* @__PURE__ */ jsx(SkipLink, {}),
6178
- header ?? /* @__PURE__ */ jsx(SiteHeader, { home: OCHK_IO, family: "docs", nav: DOCS_HEADER_NAV, search, actions }),
6179
- /* @__PURE__ */ jsx("div", { className: "sticky top-16 z-30 border-b border-border bg-background/95 backdrop-blur-md supports-[backdrop-filter]:bg-background/90 md:top-[4.5rem] lg:hidden", children: /* @__PURE__ */ jsx("div", { className: "oca-container flex h-12 items-center gap-2", children: /* @__PURE__ */ jsxs(Sheet, { open: menu, onOpenChange: setMenu, children: [
6180
- /* @__PURE__ */ jsxs(SheetTrigger, { className: "-ml-2 inline-flex h-10 min-w-0 items-center gap-2 rounded-full px-2.5 text-[0.875rem] hover:bg-accent", children: [
6181
- /* @__PURE__ */ jsx(PanelLeft, { "aria-hidden": true, className: "size-[1.125rem] shrink-0" }),
6182
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Docs menu. " }),
6183
- place ? /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-1.5", children: [
6184
- /* @__PURE__ */ jsx("span", { className: "shrink-0 text-muted-foreground", children: place.section }),
6185
- /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": true, className: "size-3.5 shrink-0 text-oca-subtle" }),
6186
- /* @__PURE__ */ jsx("span", { className: "truncate font-medium", children: place.page })
6187
- ] }) : /* @__PURE__ */ jsx("span", { className: "font-medium", children: "Docs" })
6188
- ] }),
6189
- /* @__PURE__ */ jsxs(SheetContent, { side: "left", className: "w-[min(88vw,22rem)] gap-0 p-0", children: [
6190
- /* @__PURE__ */ jsx("div", { className: "border-b border-border px-5 py-4 pr-14", children: /* @__PURE__ */ jsx(SheetTitle, { className: "text-[1.0625rem] font-medium", children: "Docs" }) }),
6191
- /* @__PURE__ */ jsx("div", { className: "overflow-y-auto p-3", children: /* @__PURE__ */ jsx(DocsNav, { sections: nav, current: current2, onNavigate: () => setMenu(false) }) })
6192
- ] })
6193
- ] }) }) }),
6194
- /* @__PURE__ */ jsx("div", { className: "oca-container flex-1", children: /* @__PURE__ */ jsxs("div", { className: "lg:grid lg:grid-cols-[13.5rem_minmax(0,1fr)] lg:gap-x-10 xl:grid-cols-[13.5rem_minmax(0,1fr)_11rem]", children: [
6195
- /* @__PURE__ */ jsx("div", { className: "sticky top-[4.5rem] hidden max-h-[calc(100dvh-4.5rem)] self-start overflow-y-auto overscroll-contain py-8 pr-1 lg:block", children: /* @__PURE__ */ jsx(DocsNav, { sections: nav, current: current2 }) }),
6196
- /* @__PURE__ */ jsxs("main", { id: "main-content", className: "min-w-0 pb-16 pt-6 md:pt-8", children: [
6197
- breadcrumbs ? /* @__PURE__ */ jsx("div", { className: "mb-6 max-lg:hidden", children: breadcrumbs }) : null,
6198
- items.length > 1 ? /* @__PURE__ */ jsxs("details", { className: "group mb-8 rounded-2xl border border-border bg-card xl:hidden", children: [
6199
- /* @__PURE__ */ jsxs("summary", { className: "flex min-h-12 cursor-pointer list-none items-center justify-between px-4 text-[0.9375rem] font-medium [&::-webkit-details-marker]:hidden", children: [
6200
- "On this page",
6201
- /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": true, className: "size-4 text-muted-foreground transition-transform group-open:rotate-180" })
6202
- ] }),
6203
- /* @__PURE__ */ jsx(OnThisPage, { items, activeId, title: null, className: "px-4 pb-4" })
6204
- ] }) : null,
6205
- /* @__PURE__ */ jsx("article", { id: "docs-content", className: "max-w-[46rem]", children }),
6206
- pager ? /* @__PURE__ */ jsx("div", { className: "mt-16 max-w-[46rem]", children: pager }) : null
6207
- ] }),
6208
- /* @__PURE__ */ jsx("div", { className: "sticky top-[4.5rem] hidden max-h-[calc(100dvh-4.5rem)] self-start overflow-y-auto py-10 xl:block", children: items.length > 1 ? /* @__PURE__ */ jsx(OnThisPage, { items, activeId }) : null })
6209
- ] }) }),
6210
- footer ?? /* @__PURE__ */ jsx(SiteFooter, { columns: OCHK_IO_FOOTER, family: true, legal: true, signature: false })
6211
- ] });
6212
- }
6213
- function SideNav({ groups, onNavigate }) {
6214
- return /* @__PURE__ */ jsx("nav", { "aria-label": "Pages", className: "flex flex-col gap-5", children: groups.map((g, gi) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
6215
- g.label ? /* @__PURE__ */ jsx("p", { className: "px-3 pb-1 text-[0.8125rem] text-muted-foreground", children: g.label }) : null,
6216
- g.items.map((it) => /* @__PURE__ */ jsxs(
6217
- Link8,
6019
+ const initial = name.trim().charAt(0).toUpperCase() || "\xB7";
6020
+ return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
6021
+ /* @__PURE__ */ jsxs(
6022
+ DropdownMenuTrigger,
6218
6023
  {
6219
- href: it.href,
6220
- onClick: onNavigate,
6221
- "aria-current": it.active ? "page" : void 0,
6222
6024
  className: cn(
6223
- "flex h-9 items-center gap-3 rounded-xl px-3 text-[0.9375rem] transition-colors",
6224
- "[&_svg]:size-[1.0625rem] [&_svg]:shrink-0",
6225
- it.active ? "bg-card text-foreground shadow-sm ring-1 ring-border [&_svg]:text-foreground" : "text-muted-foreground hover:bg-accent hover:text-foreground"
6025
+ "inline-flex h-10 items-center gap-2.5 rounded-full border border-border bg-card pl-1 pr-1 text-[0.9375rem] outline-none transition-colors hover:border-oca-hairline-strong focus-visible:ring-2 focus-visible:ring-ring",
6026
+ nameFrom === "lg" ? "lg:pr-3.5" : "sm:pr-3.5"
6226
6027
  ),
6028
+ "aria-label": `${name}, account menu`,
6227
6029
  children: [
6228
- it.icon,
6229
- /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: it.label }),
6230
- it.badge ? /* @__PURE__ */ jsx("span", { className: "shrink-0", children: it.badge }) : null
6030
+ /* @__PURE__ */ jsx(
6031
+ "span",
6032
+ {
6033
+ "aria-hidden": true,
6034
+ "data-initial": initial,
6035
+ className: "flex size-8 items-center justify-center rounded-full bg-foreground text-[0.8125rem] font-medium text-background before:content-[attr(data-initial)]"
6036
+ }
6037
+ ),
6038
+ /* @__PURE__ */ jsx("span", { className: cn("max-w-[10rem] truncate", nameFrom === "lg" ? "max-lg:hidden" : "max-sm:hidden"), children: name })
6231
6039
  ]
6232
- },
6233
- it.href
6234
- ))
6235
- ] }, g.label ?? gi)) });
6040
+ }
6041
+ ),
6042
+ /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: "w-64", children: [
6043
+ /* @__PURE__ */ jsxs(DropdownMenuLabel, { className: "flex flex-col gap-0.5", children: [
6044
+ /* @__PURE__ */ jsx("span", { className: "truncate text-[0.9375rem] font-medium text-foreground", children: name }),
6045
+ detail ? /* @__PURE__ */ jsx("span", { className: "truncate font-mono text-[0.75rem]", children: detail }) : null
6046
+ ] }),
6047
+ /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
6048
+ items.map(
6049
+ (it, i) => it === "separator" ? /* @__PURE__ */ jsx(DropdownMenuSeparator, {}, `sep-${i}`) : it.href ? /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, destructive: it.destructive, children: /* @__PURE__ */ jsxs(Link6, { href: it.href, children: [
6050
+ it.icon,
6051
+ it.label
6052
+ ] }) }, it.label) : /* @__PURE__ */ jsxs(DropdownMenuItem, { onSelect: it.onSelect, destructive: it.destructive, children: [
6053
+ it.icon,
6054
+ it.label
6055
+ ] }, it.label)
6056
+ )
6057
+ ] })
6058
+ ] });
6236
6059
  }
6237
- function SectionSwitch({
6238
- sections,
6239
- current: current2,
6240
- onNavigate
6241
- }) {
6242
- const cols = sections.length <= 3 ? sections.length : 2;
6060
+ function ThemeToggle({ className }) {
6061
+ const { theme, setTheme } = useTheme();
6062
+ const [mounted, setMounted] = useState(false);
6063
+ useEffect(() => setMounted(true), []);
6064
+ const current2 = mounted ? theme ?? "system" : "system";
6065
+ const next = current2 === "light" ? "dark" : current2 === "dark" ? "system" : "light";
6066
+ const Icon2 = current2 === "light" ? Sun : current2 === "dark" ? Moon : SunMoon;
6243
6067
  return /* @__PURE__ */ jsx(
6244
- "nav",
6068
+ "button",
6245
6069
  {
6246
- "aria-label": "Sections",
6247
- className: cn("grid gap-1 bg-muted p-1", cols === sections.length ? "rounded-full" : "rounded-[1.25rem]"),
6248
- style: { gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` },
6249
- children: sections.map((sec) => {
6250
- const on = sec.id === current2.id;
6251
- return /* @__PURE__ */ jsx(
6252
- Link8,
6253
- {
6254
- href: sec.href,
6255
- onClick: onNavigate,
6256
- "aria-current": on ? "true" : void 0,
6257
- className: cn(
6258
- "flex h-8 min-w-0 items-center justify-center rounded-full px-1.5 text-[0.8125rem] font-medium transition-colors",
6259
- on ? "bg-card text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
6260
- ),
6261
- children: /* @__PURE__ */ jsx("span", { className: "truncate", children: sec.label })
6262
- },
6263
- sec.id
6264
- );
6265
- })
6070
+ type: "button",
6071
+ onClick: () => setTheme(next),
6072
+ "aria-label": `Theme: ${current2}. Switch to ${next}`,
6073
+ title: `Theme: ${current2}`,
6074
+ className: cn(
6075
+ "inline-flex size-10 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
6076
+ className
6077
+ ),
6078
+ children: /* @__PURE__ */ jsx(Icon2, { className: "size-[1.125rem]" })
6266
6079
  }
6267
6080
  );
6268
6081
  }
6269
- function TabBar({ items }) {
6082
+ function NavLink({
6083
+ item,
6084
+ className,
6085
+ onNavigate,
6086
+ line = false
6087
+ }) {
6088
+ const cls = cn(
6089
+ "rounded-full px-3 py-2 text-[0.9375rem] transition-colors",
6090
+ item.active ? "text-foreground" : "text-muted-foreground hover:text-foreground",
6091
+ line && "relative after:absolute after:inset-x-3 after:-bottom-[0.625rem] after:h-0.5 after:rounded-full",
6092
+ line && item.active && "after:bg-foreground",
6093
+ className
6094
+ );
6095
+ if (item.external) {
6096
+ return /* @__PURE__ */ jsx("a", { href: item.href, className: cls, rel: "noreferrer", onClick: onNavigate, children: item.label });
6097
+ }
6098
+ return /* @__PURE__ */ jsx(Link6, { href: item.href, className: cls, "aria-current": item.active ? "page" : void 0, onClick: onNavigate, children: item.label });
6099
+ }
6100
+ function NavRow({ item, onNavigate }) {
6101
+ const body = /* @__PURE__ */ jsxs(Fragment, { children: [
6102
+ /* @__PURE__ */ jsx("span", { className: "text-[0.9375rem] font-medium leading-6 text-foreground", children: item.label }),
6103
+ item.description ? /* @__PURE__ */ jsx("span", { className: "text-[0.8125rem] leading-snug text-muted-foreground", children: item.description }) : null
6104
+ ] });
6105
+ const cls = cn(
6106
+ "flex flex-col gap-0.5 rounded-xl px-3 py-2 transition-colors hover:bg-accent",
6107
+ item.active && "bg-muted hover:bg-muted dark:bg-white/[0.06]"
6108
+ );
6109
+ return item.external ? /* @__PURE__ */ jsx("a", { href: item.href, className: cls, rel: "noreferrer", onClick: onNavigate, children: body }) : /* @__PURE__ */ jsx(Link6, { href: item.href, className: cls, "aria-current": item.active ? "page" : void 0, onClick: onNavigate, children: body });
6110
+ }
6111
+ var seeAll = (item) => typeof item.label === "string" ? `All ${item.label.toLowerCase()}` : "See all";
6112
+ function NavDropdown({ item }) {
6113
+ const [open, setOpen] = useState(false);
6114
+ const active = item.active || item.children?.some((c) => c.active);
6115
+ return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
6116
+ /* @__PURE__ */ jsxs(
6117
+ PopoverTrigger,
6118
+ {
6119
+ className: cn(
6120
+ "group inline-flex items-center gap-1 rounded-full py-2 pl-3 pr-2.5 text-[0.9375rem] transition-colors md:max-lg:pl-2.5 md:max-lg:pr-2",
6121
+ active ? "text-foreground" : "text-muted-foreground hover:text-foreground data-[state=open]:text-foreground"
6122
+ ),
6123
+ children: [
6124
+ item.label,
6125
+ /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": true, className: "size-3.5 transition-transform duration-200 group-data-[state=open]:rotate-180" })
6126
+ ]
6127
+ }
6128
+ ),
6129
+ /* @__PURE__ */ jsxs(PopoverContent, { align: "center", sideOffset: 10, className: "w-[min(calc(100vw-2rem),26rem)] p-2", children: [
6130
+ /* @__PURE__ */ jsx("ul", { className: "flex flex-col", children: item.children?.map((c) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(NavRow, { item: c, onNavigate: () => setOpen(false) }) }, c.href)) }),
6131
+ /* @__PURE__ */ jsx("div", { className: "mt-1.5 border-t border-border px-1 pt-1.5", children: /* @__PURE__ */ jsx(
6132
+ NavLink,
6133
+ {
6134
+ item: { ...item, label: seeAll(item), children: void 0 },
6135
+ className: "block rounded-xl px-2 py-2 text-[0.875rem]",
6136
+ onNavigate: () => setOpen(false)
6137
+ }
6138
+ ) })
6139
+ ] })
6140
+ ] });
6141
+ }
6142
+ function SiteHeader({
6143
+ home = "/",
6144
+ brand,
6145
+ product,
6146
+ family,
6147
+ nav = [],
6148
+ search,
6149
+ actions,
6150
+ variant = "site",
6151
+ navOnPhone = true,
6152
+ menu: menuExtra,
6153
+ className
6154
+ }) {
6155
+ const [open, setOpen] = useState(false);
6156
+ const tool = variant === "tool";
6157
+ const size = tool ? 24 : 28;
6158
+ const current2 = typeof family === "string" ? family : void 0;
6159
+ const phoneNav = navOnPhone ? nav : [];
6160
+ const menu = phoneNav.length > 0 || Boolean(family) || Boolean(menuExtra);
6161
+ const brandNode = brand ?? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center", children: [
6162
+ /* @__PURE__ */ jsx(Lockup, { size }),
6163
+ product ? /* @__PURE__ */ jsxs(Fragment, { children: [
6164
+ /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "mx-3 h-5 w-px bg-oca-hairline-strong" }),
6165
+ /* @__PURE__ */ jsx("span", { className: "font-medium tracking-[-0.01em]", style: { fontSize: size * 0.56 }, children: product })
6166
+ ] }) : null
6167
+ ] });
6168
+ const navigation = nav.length > 0 ? /* @__PURE__ */ jsx("nav", { "aria-label": "Main", className: "hidden items-center gap-1 md:flex", children: nav.map(
6169
+ (n) => n.children?.length ? /* @__PURE__ */ jsx(NavDropdown, { item: n }, n.href) : (
6170
+ // Between md and lg the family menu and the actions share the row: tighter.
6171
+ /* @__PURE__ */ jsx(NavLink, { item: n, line: tool, className: tool ? void 0 : "md:max-lg:px-2.5" }, n.href)
6172
+ )
6173
+ ) }) : null;
6270
6174
  return /* @__PURE__ */ jsx(
6271
- "nav",
6175
+ "header",
6272
6176
  {
6273
- "aria-label": "Pages",
6274
- "data-oca-tabbar": "",
6275
- className: "fixed inset-x-0 bottom-0 z-40 border-t border-border bg-background/90 pb-[env(safe-area-inset-bottom)] backdrop-blur-md md:hidden",
6276
- children: /* @__PURE__ */ jsx(
6177
+ className: cn(
6178
+ "sticky top-0 z-40 w-full border-b bg-background/95 backdrop-blur-md supports-[backdrop-filter]:bg-background/90",
6179
+ tool ? "border-border" : "border-transparent",
6180
+ className
6181
+ ),
6182
+ children: /* @__PURE__ */ jsxs(
6277
6183
  "div",
6278
6184
  {
6279
- className: "mx-auto grid h-14 max-w-[32rem] px-1.5",
6280
- style: { gridTemplateColumns: `repeat(${items.length}, minmax(0, 1fr))` },
6281
- children: items.map((it) => /* @__PURE__ */ jsxs(
6282
- Link8,
6283
- {
6284
- href: it.href,
6285
- "aria-current": it.active ? "page" : void 0,
6286
- className: cn(
6287
- "flex min-w-0 flex-col items-center justify-center gap-1 rounded-2xl text-[0.6875rem] leading-none outline-none transition-colors [-webkit-tap-highlight-color:transparent] focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
6288
- it.active ? "text-foreground" : "text-muted-foreground hover:text-foreground"
6289
- ),
6290
- children: [
6291
- /* @__PURE__ */ jsxs(
6292
- "span",
6185
+ className: cn(
6186
+ "flex items-center justify-between gap-4",
6187
+ tool ? "h-14 px-4 md:px-6" : "oca-container h-16 md:h-[4.5rem] md:max-lg:gap-2",
6188
+ // Three columns, the outer two each at least their content: the
6189
+ // navigation stays centred whatever the actions hold, so it does
6190
+ // not shift when they change (signed out to signed in).
6191
+ !tool && nav.length > 0 && "md:grid md:grid-cols-[minmax(max-content,1fr)_auto_minmax(max-content,1fr)]"
6192
+ ),
6193
+ children: [
6194
+ /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 items-center gap-1", tool ? "md:gap-1" : "justify-self-start"), children: [
6195
+ /* @__PURE__ */ jsxs(Link6, { href: home, className: "-ml-1 min-w-0 rounded-lg p-1", children: [
6196
+ brandNode,
6197
+ /* @__PURE__ */ jsx("span", { className: "sr-only", children: " home" })
6198
+ ] }),
6199
+ family ? /* @__PURE__ */ jsx(FamilyMenu, { current: current2, className: "max-md:hidden" }) : null,
6200
+ tool && navigation ? /* @__PURE__ */ jsx("div", { className: "ml-5", children: navigation }) : null
6201
+ ] }),
6202
+ !tool ? navigation : null,
6203
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 justify-self-end", children: [
6204
+ search,
6205
+ actions,
6206
+ menu ? /* @__PURE__ */ jsxs(Sheet, { open, onOpenChange: setOpen, children: [
6207
+ /* @__PURE__ */ jsx(
6208
+ SheetTrigger,
6293
6209
  {
6294
- className: cn(
6295
- "relative flex h-7 w-12 items-center justify-center rounded-full transition-[background-color,box-shadow] duration-200",
6296
- "[&_svg]:size-[1.125rem] [&_svg]:shrink-0",
6297
- it.active ? "bg-card shadow-sm ring-1 ring-border [&_svg]:stroke-2" : "[&_svg]:stroke-[1.75]"
6298
- ),
6299
- children: [
6300
- it.icon,
6301
- it.badge ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "absolute right-2.5 top-0.5 size-2 rounded-full bg-oca-orange ring-2 ring-background" }) : null
6302
- ]
6210
+ className: "inline-flex size-10 items-center justify-center rounded-full text-foreground hover:bg-accent md:hidden",
6211
+ "aria-label": "Open menu",
6212
+ children: /* @__PURE__ */ jsx(Menu, { className: "size-5" })
6303
6213
  }
6304
6214
  ),
6305
- /* @__PURE__ */ jsx("span", { className: "max-w-full truncate px-0.5", children: it.label }),
6306
- it.badge ? /* @__PURE__ */ jsx("span", { className: "sr-only", children: it.badge }) : null
6307
- ]
6308
- },
6309
- it.href
6310
- ))
6215
+ /* @__PURE__ */ jsxs(SheetContent, { side: "right", className: "pt-16", children: [
6216
+ /* @__PURE__ */ jsx(SheetTitle, { className: "sr-only", children: "Menu" }),
6217
+ menuExtra ? /* @__PURE__ */ jsx("div", { className: cn("flex flex-col", (phoneNav.length > 0 || family) && "border-b border-border pb-3"), children: menuExtra }) : null,
6218
+ phoneNav.length > 0 ? /* @__PURE__ */ jsx("nav", { "aria-label": "Main", className: "flex flex-col", children: phoneNav.map(
6219
+ (n) => n.children?.length ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col py-2", children: [
6220
+ /* @__PURE__ */ jsx("p", { className: "px-3 pb-1 text-[0.8125rem] text-muted-foreground", children: n.label }),
6221
+ n.children.map((c) => /* @__PURE__ */ jsx(
6222
+ NavLink,
6223
+ {
6224
+ item: c,
6225
+ className: "rounded-xl px-3 py-2.5 text-[1.0625rem]",
6226
+ onNavigate: () => setOpen(false)
6227
+ },
6228
+ c.href
6229
+ ))
6230
+ ] }, n.href) : /* @__PURE__ */ jsx(
6231
+ NavLink,
6232
+ {
6233
+ item: n,
6234
+ className: "rounded-xl px-3 py-3 text-[1.0625rem]",
6235
+ onNavigate: () => setOpen(false)
6236
+ },
6237
+ n.href
6238
+ )
6239
+ ) }) : null,
6240
+ family ? /* @__PURE__ */ jsxs("details", { className: cn("group", phoneNav.length > 0 && "mt-2 border-t border-border pt-4"), children: [
6241
+ /* @__PURE__ */ jsxs("summary", { className: "flex cursor-pointer list-none items-center justify-between rounded-xl px-3 py-2.5 text-[1.0625rem] [&::-webkit-details-marker]:hidden", children: [
6242
+ "All orangecheck sites",
6243
+ /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": true, className: "size-4 text-muted-foreground transition-transform group-open:rotate-180" })
6244
+ ] }),
6245
+ /* @__PURE__ */ jsx(FamilyList, { current: current2, onNavigate: () => setOpen(false), stack: true, className: "mt-2" })
6246
+ ] }) : null
6247
+ ] })
6248
+ ] }) : null
6249
+ ] })
6250
+ ]
6311
6251
  }
6312
6252
  )
6313
6253
  }
6314
6254
  );
6315
6255
  }
6316
- function tabsFor(groups) {
6317
- const items = groups.flatMap((g) => g.items);
6318
- return items.length >= 2 && items.length <= 5 && items.every((it) => it.icon) ? items : null;
6319
- }
6320
- var activeItem = (groups) => groups.flatMap((g) => g.items).find((it) => it.active);
6321
- var warned = /* @__PURE__ */ new Set();
6322
- function warnDuplicateLabels(groups) {
6323
- if (typeof process === "undefined" || process.env.NODE_ENV === "production") return;
6324
- const seen = /* @__PURE__ */ new Set();
6325
- for (const it of groups.flatMap((g) => g.items)) {
6326
- if (seen.has(it.label) && !warned.has(it.label)) {
6327
- warned.add(it.label);
6328
- console.warn(`AppShell: two pages are labelled "${it.label}"; give each its own name.`);
6256
+ function SkipLink({ href = "#main-content", children = "Skip to content" }) {
6257
+ return /* @__PURE__ */ jsx(
6258
+ "a",
6259
+ {
6260
+ href,
6261
+ className: "sr-only focus:not-sr-only focus:fixed focus:left-4 focus:top-3 focus:z-50 focus:rounded-full focus:border focus:border-border focus:bg-card focus:px-4 focus:py-2 focus:text-[0.9375rem] focus:font-medium focus:text-foreground focus:shadow-md",
6262
+ children
6329
6263
  }
6330
- seen.add(it.label);
6331
- }
6264
+ );
6332
6265
  }
6333
- function AppShell({
6334
- nav,
6335
- sections,
6336
- activeSection,
6337
- page: pageOverride,
6338
- persistent = [],
6339
- home = "/",
6340
- account,
6341
- banner,
6342
- footer,
6266
+ var BANNER_TONE = {
6267
+ neutral: "border-border bg-muted",
6268
+ brand: "border-[color-mix(in_oklab,var(--oca-orange)_30%,var(--border))] bg-[color-mix(in_oklab,var(--oca-orange)_9%,var(--background))]",
6269
+ danger: "border-[color-mix(in_oklab,var(--destructive)_35%,var(--border))] bg-[color-mix(in_oklab,var(--destructive)_8%,var(--background))]"
6270
+ };
6271
+ function SiteBanner({
6272
+ tone = "neutral",
6343
6273
  children,
6274
+ action,
6344
6275
  className
6345
6276
  }) {
6346
- const [open, setOpen] = useState(false);
6347
- const current2 = sections && sections.length > 0 ? sections.find((sec) => sec.id === activeSection) ?? sections.find((sec) => activeItem(sec.groups)) ?? sections[0] : void 0;
6348
- const groups = current2 ? [...current2.groups, ...persistent] : [...nav ?? [], ...persistent];
6349
- warnDuplicateLabels(groups);
6350
- const tabs = current2 ? null : tabsFor(groups);
6351
- const page = activeItem(groups);
6352
- const place = useMemo(
6353
- () => ({
6354
- section: current2 ? current2.title ?? current2.label : void 0,
6355
- page: pageOverride ?? page?.label
6356
- }),
6357
- [current2, page?.label, pageOverride]
6358
- );
6359
- const switcher = sections && current2 && sections.length > 1 ? /* @__PURE__ */ jsx(SectionSwitch, { sections, current: current2, onNavigate: () => setOpen(false) }) : null;
6360
- return /* @__PURE__ */ jsx(ShellContext.Provider, { value: place, children: /* @__PURE__ */ jsxs(
6361
- "div",
6362
- {
6363
- className: cn(
6364
- "min-h-dvh bg-background",
6365
- tabs && "max-md:pb-[calc(3.5rem_+_env(safe-area-inset-bottom))]",
6366
- className
6367
- ),
6368
- children: [
6369
- /* @__PURE__ */ jsxs("div", { className: "sticky top-0 z-40 border-b border-border bg-background/90 backdrop-blur-md lg:hidden", children: [
6370
- /* @__PURE__ */ jsxs("div", { className: "flex h-14 items-center gap-2 px-3", children: [
6371
- /* @__PURE__ */ jsxs(Sheet, { open, onOpenChange: setOpen, children: [
6372
- /* @__PURE__ */ jsx(
6373
- SheetTrigger,
6374
- {
6375
- className: cn(
6376
- "inline-flex size-10 items-center justify-center rounded-full hover:bg-accent",
6377
- // The tab bar holds every page; the sheet is left for a footer.
6378
- tabs && !footer && "max-md:hidden"
6379
- ),
6380
- "aria-label": "Open navigation",
6381
- children: /* @__PURE__ */ jsx(Menu, { className: "size-5" })
6382
- }
6383
- ),
6384
- /* @__PURE__ */ jsxs(SheetContent, { side: "left", className: "flex flex-col gap-6 overflow-y-auto p-4 pt-16", children: [
6385
- /* @__PURE__ */ jsx(SheetTitle, { className: "sr-only", children: "Navigation" }),
6386
- switcher,
6387
- /* @__PURE__ */ jsx("div", { className: tabs ? "max-md:hidden" : void 0, children: /* @__PURE__ */ jsx(SideNav, { groups, onNavigate: () => setOpen(false) }) }),
6388
- footer ? /* @__PURE__ */ jsx("div", { className: "mt-auto flex flex-col gap-3", children: footer }) : null
6389
- ] })
6390
- ] }),
6391
- /* @__PURE__ */ jsx(Link8, { href: home, "aria-label": "Home", className: "rounded-lg p-1", children: /* @__PURE__ */ jsx(Lockup, { size: 22 }) }),
6392
- /* @__PURE__ */ jsx("div", { className: "ml-auto flex items-center", children: account })
6277
+ return /* @__PURE__ */ jsx("div", { role: "status", "aria-live": "polite", "data-tone": tone, className: cn("border-b text-[0.875rem]", BANNER_TONE[tone], className), children: /* @__PURE__ */ jsxs("div", { className: "oca-container flex flex-wrap items-center justify-between gap-x-4 gap-y-1 py-2.5", children: [
6278
+ /* @__PURE__ */ jsxs("p", { className: "flex min-w-0 items-baseline gap-2.5 leading-snug", children: [
6279
+ tone !== "neutral" ? /* @__PURE__ */ jsx(
6280
+ "span",
6281
+ {
6282
+ "aria-hidden": true,
6283
+ className: cn(
6284
+ "size-2 shrink-0 translate-y-[-0.05em] rounded-full",
6285
+ tone === "brand" ? "bg-oca-orange" : "bg-destructive"
6286
+ )
6287
+ }
6288
+ ) : null,
6289
+ /* @__PURE__ */ jsx("span", { children })
6290
+ ] }),
6291
+ action ? /* @__PURE__ */ jsx("div", { className: cn("shrink-0 font-medium", tone !== "neutral" && "max-sm:pl-[1.125rem]"), children: action }) : null
6292
+ ] }) });
6293
+ }
6294
+ var FOOT_LINK = "inline-flex min-h-11 items-center transition-colors hover:text-foreground md:min-h-0";
6295
+ function LegalRow({ links }) {
6296
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:items-center sm:justify-between", children: [
6297
+ /* @__PURE__ */ jsx("nav", { "aria-label": "Legal", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-x-5", children: links.map((l) => /* @__PURE__ */ jsx("li", { children: l.href.startsWith("/") ? /* @__PURE__ */ jsx(Link6, { href: l.href, className: FOOT_LINK, children: l.label }) : /* @__PURE__ */ jsx("a", { href: l.href, className: FOOT_LINK, children: l.label }) }, l.href)) }) }),
6298
+ /* @__PURE__ */ jsxs("p", { children: [
6299
+ "\xA9 ",
6300
+ (/* @__PURE__ */ new Date()).getFullYear(),
6301
+ " OrangeCheck"
6302
+ ] })
6303
+ ] });
6304
+ }
6305
+ function SiteFooter({
6306
+ columns = [],
6307
+ family = false,
6308
+ legal = false,
6309
+ compact = false,
6310
+ fineprint,
6311
+ meta,
6312
+ signature = true,
6313
+ className
6314
+ }) {
6315
+ const legalLinks = legal === true ? LEGAL_LINKS : legal || null;
6316
+ if (compact) {
6317
+ return /* @__PURE__ */ jsx("footer", { className: cn("border-t border-border bg-background text-[0.875rem] text-muted-foreground", className), children: /* @__PURE__ */ jsxs("div", { className: "oca-container flex flex-col gap-x-8 gap-y-3 py-5 lg:flex-row lg:items-center lg:justify-between", children: [
6318
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-6 gap-y-1", children: [
6319
+ /* @__PURE__ */ jsx("a", { href: OCHK_IO, className: "rounded-lg text-foreground", children: /* @__PURE__ */ jsx(Lockup, { size: 22 }) }),
6320
+ family ? /* @__PURE__ */ jsx("nav", { "aria-label": "Protocols", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-x-4", children: PROTOCOLS.map((p) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("a", { href: p.pageHref, className: FOOT_LINK, children: p.label }) }, p.slug)) }) }) : null
6321
+ ] }),
6322
+ legalLinks || meta ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:flex-wrap sm:items-center", children: [
6323
+ legalLinks ? /* @__PURE__ */ jsx(LegalRow, { links: legalLinks }) : null,
6324
+ meta
6325
+ ] }) : null
6326
+ ] }) });
6327
+ }
6328
+ const cols = [
6329
+ ...columns,
6330
+ ...family ? familyByGroup().map((g) => ({
6331
+ // The lockup above already says orangecheck.
6332
+ heading: g.id === "orangecheck" ? "Start here" : g.label,
6333
+ links: g.sites.map((s) => ({ href: s.href, label: s.label, external: true }))
6334
+ })) : []
6335
+ ];
6336
+ const n = cols.length;
6337
+ const inline = n <= 5;
6338
+ const grid = {
6339
+ "--oca-footer-md": `repeat(${Math.max(1, Math.min(n, 4))}, minmax(0, 1fr))`,
6340
+ "--oca-footer-lg": inline ? `minmax(0, 1.3fr) repeat(${Math.max(1, n)}, minmax(0, 1fr))` : `repeat(${Math.min(n, 6)}, minmax(0, 1fr))`
6341
+ };
6342
+ return /* @__PURE__ */ jsxs("footer", { className: cn("border-t border-border bg-background", className), children: [
6343
+ /* @__PURE__ */ jsxs(
6344
+ "div",
6345
+ {
6346
+ style: grid,
6347
+ className: "oca-container grid grid-cols-2 gap-x-6 gap-y-10 py-14 md:grid-cols-[var(--oca-footer-md)] md:py-16 lg:grid-cols-[var(--oca-footer-lg)]",
6348
+ children: [
6349
+ /* @__PURE__ */ jsxs("div", { className: cn("col-span-full flex flex-col gap-4", inline && "lg:col-span-1"), children: [
6350
+ /* @__PURE__ */ jsx(Lockup, { size: 26 }),
6351
+ fineprint ? /* @__PURE__ */ jsx("p", { className: "max-w-xs text-[0.9375rem] leading-relaxed text-muted-foreground", children: fineprint }) : null
6393
6352
  ] }),
6394
- place.page ? /* @__PURE__ */ jsxs(
6395
- "div",
6396
- {
6397
- className: cn(
6398
- "flex h-9 items-center gap-1.5 border-t border-border px-4 text-[0.875rem]",
6399
- // The active tab already names the page.
6400
- tabs && !pageOverride && "max-md:hidden"
6401
- ),
6402
- children: [
6403
- place.section ? /* @__PURE__ */ jsxs(Fragment, { children: [
6404
- /* @__PURE__ */ jsx("span", { className: "shrink-0 text-muted-foreground", children: place.section }),
6405
- /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": true, className: "size-3.5 shrink-0 text-muted-foreground" })
6406
- ] }) : null,
6407
- /* @__PURE__ */ jsx("span", { className: "truncate font-medium", children: place.page })
6408
- ]
6409
- }
6410
- ) : null
6353
+ cols.map((col, i) => {
6354
+ const spans = n % 2 === 1 && i === n - 1;
6355
+ return /* @__PURE__ */ jsxs(
6356
+ "div",
6357
+ {
6358
+ className: cn("flex min-w-0 flex-col gap-1", spans && "col-span-2 md:col-span-1"),
6359
+ children: [
6360
+ /* @__PURE__ */ jsx("p", { className: "mb-2 text-[0.875rem] font-medium", children: col.heading }),
6361
+ /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-1", spans && "grid grid-cols-2 gap-x-6 md:flex md:flex-col"), children: col.links.map((l) => /* @__PURE__ */ jsx(
6362
+ NavLink,
6363
+ {
6364
+ item: l,
6365
+ className: "-mx-3 py-2.5 text-[0.9375rem] md:py-1.5"
6366
+ },
6367
+ l.href
6368
+ )) })
6369
+ ]
6370
+ },
6371
+ col.heading
6372
+ );
6373
+ })
6374
+ ]
6375
+ }
6376
+ ),
6377
+ signature ? /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "oca-container select-none overflow-hidden pb-8 md:pb-12", children: /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-[0.18em] text-[clamp(3rem,11.5vw,10rem)] leading-[0.78] tracking-[-0.065em] [font-family:var(--oc-font-display)]", children: [
6378
+ /* @__PURE__ */ jsx("span", { className: "mb-[0.06em] inline-block w-[1.1em] shrink-0", children: /* @__PURE__ */ jsx(Mark, { className: "block h-auto w-full" }) }),
6379
+ /* @__PURE__ */ jsx("span", { children: "orangecheck" })
6380
+ ] }) }) : null,
6381
+ legalLinks || meta ? /* @__PURE__ */ jsx("div", { className: "oca-container", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 border-t border-border py-6 text-[0.875rem] text-muted-foreground", children: [
6382
+ legalLinks ? /* @__PURE__ */ jsx(LegalRow, { links: legalLinks }) : null,
6383
+ meta
6384
+ ] }) }) : null
6385
+ ] });
6386
+ }
6387
+ function OchkIoFooter({ columns = OCHK_IO_FOOTER, className }) {
6388
+ return /* @__PURE__ */ jsx(
6389
+ SiteFooter,
6390
+ {
6391
+ columns,
6392
+ family: true,
6393
+ legal: true,
6394
+ fineprint: "Open protocols on Bitcoin. Anyone can check the result.",
6395
+ meta: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-4", children: [
6396
+ /* @__PURE__ */ jsxs("p", { children: [
6397
+ "Open-source work on orangecheck is ",
6398
+ /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap", children: "supported by OpenSats." })
6411
6399
  ] }),
6412
- /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-[90rem]", children: [
6413
- /* @__PURE__ */ jsxs("aside", { className: "sticky top-0 hidden h-dvh w-[17rem] shrink-0 flex-col gap-6 overflow-y-auto px-4 py-6 lg:flex", children: [
6414
- /* @__PURE__ */ jsx(Link8, { href: home, className: "px-2", "aria-label": "Home", children: /* @__PURE__ */ jsx(Lockup, { size: 26 }) }),
6415
- switcher,
6416
- /* @__PURE__ */ jsx(SideNav, { groups }),
6417
- /* @__PURE__ */ jsx("div", { className: "mt-auto flex flex-col gap-3", children: footer })
6400
+ /* @__PURE__ */ jsx(ThemeToggle, { className: "-mx-3" })
6401
+ ] }),
6402
+ className
6403
+ }
6404
+ );
6405
+ }
6406
+ function SignInFrame({
6407
+ title = "Sign in",
6408
+ lead,
6409
+ children,
6410
+ error,
6411
+ fineprint,
6412
+ brand,
6413
+ home,
6414
+ protocol: protocol2,
6415
+ back,
6416
+ art,
6417
+ caption,
6418
+ className
6419
+ }) {
6420
+ const homeHref = home ?? (protocol2 ? protocolSite(protocol2).pageHref : OCHK_IO);
6421
+ return /* @__PURE__ */ jsxs(
6422
+ "main",
6423
+ {
6424
+ id: "main-content",
6425
+ className: cn("grid min-h-dvh grid-cols-1 bg-background text-foreground lg:grid-cols-2", className),
6426
+ children: [
6427
+ /* @__PURE__ */ jsxs("section", { className: "flex flex-col px-4 pb-8 pt-5 sm:px-8 lg:px-14 lg:pt-8", children: [
6428
+ /* @__PURE__ */ jsxs("header", { className: "flex items-center justify-between gap-4", children: [
6429
+ /* @__PURE__ */ jsxs(Link6, { href: homeHref, className: "w-fit rounded-lg", children: [
6430
+ brand ?? /* @__PURE__ */ jsx(Lockup, { size: 28 }),
6431
+ /* @__PURE__ */ jsx("span", { className: "sr-only", children: " home" })
6432
+ ] }),
6433
+ back === void 0 ? /* @__PURE__ */ jsx(
6434
+ Link6,
6435
+ {
6436
+ href: homeHref,
6437
+ className: "text-[0.9375rem] text-muted-foreground underline-offset-4 hover:text-foreground hover:underline",
6438
+ children: "Back to home"
6439
+ }
6440
+ ) : back
6418
6441
  ] }),
6419
- /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
6420
- /* @__PURE__ */ jsx("div", { className: "hidden h-[4.5rem] items-center justify-end gap-3 px-8 lg:flex", children: account }),
6421
- banner ? /* @__PURE__ */ jsx("div", { className: "px-4 pb-2 pt-4 md:px-8 lg:pt-0", children: banner }) : null,
6422
- /* @__PURE__ */ jsx("main", { id: "main-content", className: "flex-1 px-4 pb-16 pt-6 md:px-8 lg:pt-2", children: /* @__PURE__ */ jsx("div", { className: "mx-auto w-full max-w-[72rem]", children }) })
6442
+ /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-[25rem] flex-1 flex-col justify-center gap-9 py-12", children: [
6443
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
6444
+ /* @__PURE__ */ jsx("h1", { className: "oca-display-2", children: title }),
6445
+ lead ? /* @__PURE__ */ jsx("p", { className: "oca-lead", children: lead }) : null
6446
+ ] }),
6447
+ /* @__PURE__ */ jsx("div", { children }),
6448
+ error ? /* @__PURE__ */ jsx("p", { role: "alert", className: "text-[0.9375rem] text-destructive", children: error }) : null,
6449
+ fineprint ? /* @__PURE__ */ jsx("p", { className: "text-[0.8125rem] leading-relaxed text-muted-foreground", children: fineprint }) : null
6423
6450
  ] })
6424
6451
  ] }),
6425
- tabs ? /* @__PURE__ */ jsx(TabBar, { items: tabs }) : null
6452
+ /* @__PURE__ */ jsxs(
6453
+ "aside",
6454
+ {
6455
+ "aria-hidden": true,
6456
+ className: "relative hidden flex-col justify-between gap-10 overflow-hidden border-l border-[var(--oca-band-line)] bg-oca-ink p-14 text-oca-ink-foreground lg:flex",
6457
+ children: [
6458
+ /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center justify-center", children: art ?? /* @__PURE__ */ jsx(IsoCheck, { size: 340, settle: true, tilt: true, className: "max-w-full" }) }),
6459
+ caption ? /* @__PURE__ */ jsx("div", { className: "flex max-w-[24rem] flex-col gap-3", children: caption }) : null
6460
+ ]
6461
+ }
6462
+ )
6426
6463
  ]
6427
6464
  }
6428
- ) });
6465
+ );
6429
6466
  }
6430
- function AccountMenu({
6431
- name,
6432
- detail,
6433
- items,
6434
- nameFrom = "sm"
6467
+ var STATUS_WORDS = /* @__PURE__ */ new Set(["live", "testing", "not-yet", "paused", "good", "caution", "refused"]);
6468
+ var pathOf = (href) => href.split(/[?#]/)[0].replace(/(.)\/$/, "$1");
6469
+ function DocsNav({
6470
+ sections,
6471
+ current: current2,
6472
+ onNavigate,
6473
+ className
6435
6474
  }) {
6436
- const initial = name.trim().charAt(0).toUpperCase() || "\xB7";
6437
- return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
6438
- /* @__PURE__ */ jsxs(
6439
- DropdownMenuTrigger,
6440
- {
6441
- className: cn(
6442
- "inline-flex h-10 items-center gap-2.5 rounded-full border border-border bg-card pl-1 pr-1 text-[0.9375rem] outline-none transition-colors hover:border-oca-hairline-strong focus-visible:ring-2 focus-visible:ring-ring",
6443
- nameFrom === "lg" ? "lg:pr-3.5" : "sm:pr-3.5"
6444
- ),
6445
- "aria-label": `${name}, account menu`,
6446
- children: [
6447
- /* @__PURE__ */ jsx(
6448
- "span",
6449
- {
6450
- "aria-hidden": true,
6451
- "data-initial": initial,
6452
- className: "flex size-8 items-center justify-center rounded-full bg-foreground text-[0.8125rem] font-medium text-background before:content-[attr(data-initial)]"
6453
- }
6475
+ const here = pathOf(current2);
6476
+ const activeSection = useMemo(
6477
+ () => sections.findIndex((s) => s.items.some((i) => pathOf(i.href) === here)),
6478
+ [sections, here]
6479
+ );
6480
+ const [peeked, setPeeked] = useState(() => /* @__PURE__ */ new Set());
6481
+ useEffect(() => setPeeked(/* @__PURE__ */ new Set()), [activeSection]);
6482
+ const activeRef = useRef(null);
6483
+ useEffect(() => {
6484
+ const id = requestAnimationFrame(() => activeRef.current?.scrollIntoView({ block: "nearest" }));
6485
+ return () => cancelAnimationFrame(id);
6486
+ }, [here]);
6487
+ const base = useId();
6488
+ return /* @__PURE__ */ jsx("nav", { "aria-label": "Docs", className: cn("flex flex-col gap-0.5", className), children: sections.map((section, si) => {
6489
+ const isActive = si === activeSection;
6490
+ const open = isActive || peeked.has(si);
6491
+ const panel = `${base}-s${si}`;
6492
+ return /* @__PURE__ */ jsxs("div", { children: [
6493
+ /* @__PURE__ */ jsxs(
6494
+ "button",
6495
+ {
6496
+ type: "button",
6497
+ "aria-expanded": open,
6498
+ "aria-controls": panel,
6499
+ onClick: () => {
6500
+ if (isActive) return;
6501
+ setPeeked((p) => {
6502
+ const n = new Set(p);
6503
+ if (n.has(si)) n.delete(si);
6504
+ else n.add(si);
6505
+ return n;
6506
+ });
6507
+ },
6508
+ className: cn(
6509
+ "flex min-h-9 w-full items-center justify-between gap-2 rounded-lg px-2.5 py-1.5 text-left text-[0.875rem] transition-colors",
6510
+ isActive ? "font-medium text-foreground" : "text-muted-foreground hover:bg-accent hover:text-foreground",
6511
+ isActive && "cursor-default"
6454
6512
  ),
6455
- /* @__PURE__ */ jsx("span", { className: cn("max-w-[10rem] truncate", nameFrom === "lg" ? "max-lg:hidden" : "max-sm:hidden"), children: name })
6456
- ]
6457
- }
6458
- ),
6459
- /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: "w-64", children: [
6460
- /* @__PURE__ */ jsxs(DropdownMenuLabel, { className: "flex flex-col gap-0.5", children: [
6461
- /* @__PURE__ */ jsx("span", { className: "truncate text-[0.9375rem] font-medium text-foreground", children: name }),
6462
- detail ? /* @__PURE__ */ jsx("span", { className: "truncate font-mono text-[0.75rem]", children: detail }) : null
6463
- ] }),
6464
- /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
6465
- items.map(
6466
- (it, i) => it === "separator" ? /* @__PURE__ */ jsx(DropdownMenuSeparator, {}, `sep-${i}`) : it.href ? /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, destructive: it.destructive, children: /* @__PURE__ */ jsxs(Link8, { href: it.href, children: [
6467
- it.icon,
6468
- it.label
6469
- ] }) }, it.label) : /* @__PURE__ */ jsxs(DropdownMenuItem, { onSelect: it.onSelect, destructive: it.destructive, children: [
6470
- it.icon,
6471
- it.label
6472
- ] }, it.label)
6473
- )
6474
- ] })
6475
- ] });
6476
- }
6477
- function ThemeToggle({ className }) {
6478
- const { theme, setTheme } = useTheme();
6479
- const [mounted, setMounted] = useState(false);
6480
- useEffect(() => setMounted(true), []);
6481
- const current2 = mounted ? theme ?? "system" : "system";
6482
- const next = current2 === "light" ? "dark" : current2 === "dark" ? "system" : "light";
6483
- const Icon2 = current2 === "light" ? Sun : current2 === "dark" ? Moon : SunMoon;
6484
- return /* @__PURE__ */ jsx(
6485
- "button",
6486
- {
6487
- type: "button",
6488
- onClick: () => setTheme(next),
6489
- "aria-label": `Theme: ${current2}. Switch to ${next}`,
6490
- title: `Theme: ${current2}`,
6491
- className: cn(
6492
- "inline-flex size-10 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
6493
- className
6513
+ children: [
6514
+ section.label,
6515
+ /* @__PURE__ */ jsx(
6516
+ ChevronRight,
6517
+ {
6518
+ "aria-hidden": true,
6519
+ className: cn("size-3.5 shrink-0 text-oca-subtle transition-transform duration-200", open && "rotate-90")
6520
+ }
6521
+ )
6522
+ ]
6523
+ }
6494
6524
  ),
6495
- children: /* @__PURE__ */ jsx(Icon2, { className: "size-[1.125rem]" })
6525
+ /* @__PURE__ */ jsx("ul", { id: panel, hidden: !open, className: "mb-2 ml-2.5 mt-0.5 border-l border-border", children: section.items.map((item) => {
6526
+ const on = pathOf(item.href) === here;
6527
+ const badge = typeof item.badge === "string" && STATUS_WORDS.has(item.badge) ? /* @__PURE__ */ jsx(StatusBadge, { status: item.badge }) : item.badge ? /* @__PURE__ */ jsx(Badge, { tone: "muted", children: item.badge }) : null;
6528
+ return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
6529
+ Link6,
6530
+ {
6531
+ href: item.href,
6532
+ ref: on ? activeRef : void 0,
6533
+ onClick: onNavigate,
6534
+ "aria-current": on ? "page" : void 0,
6535
+ className: cn(
6536
+ "-ml-px flex min-h-9 items-center gap-2 border-l-2 py-1.5 pl-3.5 pr-2 text-[0.875rem] leading-snug transition-colors",
6537
+ on ? "border-foreground font-medium text-foreground" : "border-transparent text-muted-foreground hover:border-oca-hairline-strong hover:text-foreground"
6538
+ ),
6539
+ children: [
6540
+ /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1", children: item.label }),
6541
+ badge
6542
+ ]
6543
+ }
6544
+ ) }, item.href);
6545
+ }) })
6546
+ ] }, section.label);
6547
+ }) });
6548
+ }
6549
+ var DOCS_HEADER_NAV = OCHK_IO_NAV.map((n) => n.href === DOCS_HREF ? { ...n, active: true } : n);
6550
+ function DocsShell({
6551
+ nav,
6552
+ current: current2,
6553
+ navCurrent,
6554
+ header,
6555
+ search,
6556
+ actions,
6557
+ breadcrumbs,
6558
+ toc,
6559
+ pager,
6560
+ footer,
6561
+ children
6562
+ }) {
6563
+ const [menu, setMenu] = useState(false);
6564
+ useEffect(() => setMenu(false), [current2]);
6565
+ const read = useHeadings("#docs-content", current2);
6566
+ const items = toc ?? read.items;
6567
+ const activeId = toc ? void 0 : read.activeId;
6568
+ const marked = navCurrent ?? current2;
6569
+ const here = pathOf(marked);
6570
+ const place = useMemo(() => {
6571
+ for (const s of nav) {
6572
+ const it = s.items.find((i) => pathOf(i.href) === here);
6573
+ if (it) return { section: s.label, page: it.label };
6496
6574
  }
6497
- );
6575
+ return null;
6576
+ }, [nav, here]);
6577
+ return /* @__PURE__ */ jsxs("div", { className: "flex min-h-dvh flex-col bg-background", children: [
6578
+ /* @__PURE__ */ jsx(SkipLink, {}),
6579
+ header ?? /* @__PURE__ */ jsx(SiteHeader, { home: OCHK_IO, family: "docs", nav: DOCS_HEADER_NAV, search, actions }),
6580
+ /* @__PURE__ */ jsx("div", { className: "sticky top-16 z-30 border-b border-border bg-background/95 backdrop-blur-md supports-[backdrop-filter]:bg-background/90 md:top-[4.5rem] lg:hidden", children: /* @__PURE__ */ jsx("div", { className: "oca-container flex h-12 items-center gap-2", children: /* @__PURE__ */ jsxs(Sheet, { open: menu, onOpenChange: setMenu, children: [
6581
+ /* @__PURE__ */ jsxs(SheetTrigger, { className: "-ml-2 inline-flex h-10 min-w-0 items-center gap-2 rounded-full px-2.5 text-[0.875rem] hover:bg-accent", children: [
6582
+ /* @__PURE__ */ jsx(PanelLeft, { "aria-hidden": true, className: "size-[1.125rem] shrink-0" }),
6583
+ /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Docs menu. " }),
6584
+ place ? /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-1.5", children: [
6585
+ /* @__PURE__ */ jsx("span", { className: "shrink-0 text-muted-foreground", children: place.section }),
6586
+ /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": true, className: "size-3.5 shrink-0 text-oca-subtle" }),
6587
+ /* @__PURE__ */ jsx("span", { className: "truncate font-medium", children: place.page })
6588
+ ] }) : /* @__PURE__ */ jsx("span", { className: "font-medium", children: "Docs" })
6589
+ ] }),
6590
+ /* @__PURE__ */ jsxs(SheetContent, { side: "left", className: "w-[min(88vw,22rem)] gap-0 p-0", children: [
6591
+ /* @__PURE__ */ jsx("div", { className: "border-b border-border px-5 py-4 pr-14", children: /* @__PURE__ */ jsx(SheetTitle, { className: "text-[1.0625rem] font-medium", children: "Docs" }) }),
6592
+ /* @__PURE__ */ jsx("div", { className: "overflow-y-auto p-3", children: /* @__PURE__ */ jsx(DocsNav, { sections: nav, current: marked, onNavigate: () => setMenu(false) }) })
6593
+ ] })
6594
+ ] }) }) }),
6595
+ /* @__PURE__ */ jsx("div", { className: "oca-container flex-1", children: /* @__PURE__ */ jsxs("div", { className: "lg:grid lg:grid-cols-[13.5rem_minmax(0,1fr)] lg:gap-x-10 xl:grid-cols-[13.5rem_minmax(0,1fr)_11rem]", children: [
6596
+ /* @__PURE__ */ jsx("div", { className: "sticky top-[4.5rem] hidden max-h-[calc(100dvh-4.5rem)] self-start overflow-y-auto overscroll-contain py-8 pr-1 lg:block", children: /* @__PURE__ */ jsx(DocsNav, { sections: nav, current: marked }) }),
6597
+ /* @__PURE__ */ jsxs("main", { id: "main-content", className: "min-w-0 pb-16 pt-6 md:pt-8", children: [
6598
+ breadcrumbs ? /* @__PURE__ */ jsx("div", { className: "mb-6 max-lg:hidden", children: breadcrumbs }) : null,
6599
+ items.length > 1 ? /* @__PURE__ */ jsxs("details", { className: "group mb-8 rounded-2xl border border-border bg-card xl:hidden", children: [
6600
+ /* @__PURE__ */ jsxs("summary", { className: "flex min-h-12 cursor-pointer list-none items-center justify-between px-4 text-[0.9375rem] font-medium [&::-webkit-details-marker]:hidden", children: [
6601
+ "On this page",
6602
+ /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": true, className: "size-4 text-muted-foreground transition-transform group-open:rotate-180" })
6603
+ ] }),
6604
+ /* @__PURE__ */ jsx(OnThisPage, { items, activeId, title: null, className: "px-4 pb-4" })
6605
+ ] }) : null,
6606
+ /* @__PURE__ */ jsx("article", { id: "docs-content", className: "max-w-[46rem]", children: /* @__PURE__ */ jsx(InDocsContext.Provider, { value: true, children }) }),
6607
+ pager ? /* @__PURE__ */ jsx("div", { className: "mt-16 max-w-[46rem]", children: pager }) : null
6608
+ ] }),
6609
+ /* @__PURE__ */ jsx("div", { className: "sticky top-[4.5rem] hidden max-h-[calc(100dvh-4.5rem)] self-start overflow-y-auto py-10 xl:block", children: items.length > 1 ? /* @__PURE__ */ jsx(OnThisPage, { items, activeId }) : null })
6610
+ ] }) }),
6611
+ footer ?? /* @__PURE__ */ jsx(OchkIoFooter, {})
6612
+ ] });
6498
6613
  }
6499
6614
  var OCHK_APP_ACCOUNT = "https://ochk.app/me/account";
6500
6615
  function onHistory(change) {
@@ -6567,6 +6682,7 @@ function ToolShell({
6567
6682
  children
6568
6683
  }) {
6569
6684
  const p = protocolSite(protocol2);
6685
+ const homeHref = home ?? p.pageHref;
6570
6686
  const app = variant === "app";
6571
6687
  const tabs = app ? null : tabsFor([{ items: [...tools] }]);
6572
6688
  const about = /* @__PURE__ */ jsxs(
@@ -6596,7 +6712,7 @@ function ToolShell({
6596
6712
  SiteHeader,
6597
6713
  {
6598
6714
  variant: "tool",
6599
- home: home ?? p.pageHref,
6715
+ home: homeHref,
6600
6716
  product: p.label,
6601
6717
  family: protocol2,
6602
6718
  nav: tools.map((t) => ({ href: t.href, label: t.label, active: t.active })),
@@ -6621,7 +6737,7 @@ function ToolShell({
6621
6737
  {
6622
6738
  id: "main-content",
6623
6739
  className: cn("min-w-0 flex-1", app ? "flex min-h-0 flex-col" : "px-4 pb-16 pt-8 md:px-8 md:pt-10"),
6624
- children: app ? children : /* @__PURE__ */ jsx("div", { className: "mx-auto w-full max-w-[72rem]", children })
6740
+ children: /* @__PURE__ */ jsx(SiteHomeContext.Provider, { value: homeHref, children: app ? children : /* @__PURE__ */ jsx("div", { className: "mx-auto w-full max-w-[72rem]", children }) })
6625
6741
  }
6626
6742
  )
6627
6743
  ] }),
@@ -6656,6 +6772,7 @@ function rehypeCode(options = {}) {
6656
6772
  if (lang && skip.has(lang)) continue;
6657
6773
  const meta = parseCodeMeta(code.data?.meta);
6658
6774
  let source = textOf(code);
6775
+ const newline = /\n$/.test(source);
6659
6776
  const diff = meta.diff || lang === "diff" ? readDiff(source) : null;
6660
6777
  if (diff) source = diff.code;
6661
6778
  const lines = options.tokenize?.(source, lang) ?? highlight(source, lang === "diff" ? void 0 : lang);
@@ -6666,7 +6783,8 @@ function rehypeCode(options = {}) {
6666
6783
  ...lang ? { dataLang: lang } : {},
6667
6784
  ...meta.title ? { dataTitle: meta.title } : {},
6668
6785
  ...diff ? { dataDiff: "" } : {},
6669
- ...meta.lineNumbers ? { dataLineNumbers: "" } : {}
6786
+ ...meta.lineNumbers ? { dataLineNumbers: "" } : {},
6787
+ ...newline ? { dataEol: "" } : {}
6670
6788
  };
6671
6789
  child.children = [];
6672
6790
  continue;
@@ -6687,6 +6805,7 @@ function createMdxComponents({ mermaid } = {}) {
6687
6805
  caption: props["data-title"],
6688
6806
  diff: props["data-diff"] !== void 0,
6689
6807
  lineNumbers: props["data-line-numbers"] !== void 0,
6808
+ trailingNewline: props["data-eol"] !== void 0,
6690
6809
  className: "my-6"
6691
6810
  }
6692
6811
  );
@@ -6713,6 +6832,9 @@ function createMdxComponents({ mermaid } = {}) {
6713
6832
  const heading = (as) => function Heading(props) {
6714
6833
  return /* @__PURE__ */ jsx(DocsHeading, { as, ...props });
6715
6834
  };
6835
+ const minor = (Tag) => function Minor({ className, ...props }) {
6836
+ return /* @__PURE__ */ jsx(Tag, { className: cn("mb-2 mt-6 scroll-mt-28 text-[0.9375rem] font-medium leading-snug text-foreground", className), ...props });
6837
+ };
6716
6838
  return {
6717
6839
  h1: heading("h1"),
6718
6840
  h2: heading("h2"),
@@ -6721,11 +6843,15 @@ function createMdxComponents({ mermaid } = {}) {
6721
6843
  p: ({ className, ...props }) => /* @__PURE__ */ jsx("p", { className: cn("my-4 text-[1rem] leading-[1.75] text-muted-foreground md:text-[1.0625rem]", className), ...props }),
6722
6844
  a: A,
6723
6845
  strong: (props) => /* @__PURE__ */ jsx("strong", { className: "font-medium text-foreground", ...props }),
6846
+ h5: minor("h5"),
6847
+ h6: minor("h6"),
6724
6848
  ul: ({ className, ...props }) => /* @__PURE__ */ jsx(
6725
6849
  "ul",
6726
6850
  {
6727
6851
  className: cn(
6728
6852
  "my-4 list-disc space-y-1.5 pl-5 text-[1rem] leading-[1.7] text-muted-foreground marker:text-oca-subtle md:text-[1.0625rem]",
6853
+ // A GitHub task list: the box replaces the bullet.
6854
+ className?.includes("contains-task-list") && "list-none pl-0",
6729
6855
  className
6730
6856
  ),
6731
6857
  ...props
@@ -6741,7 +6867,26 @@ function createMdxComponents({ mermaid } = {}) {
6741
6867
  ...props
6742
6868
  }
6743
6869
  ),
6744
- li: ({ className, ...props }) => /* @__PURE__ */ jsx("li", { className: cn("pl-1 [&>p]:my-1 [&>ul]:my-1.5 [&>ol]:my-1.5", className), ...props }),
6870
+ li: ({ className, ...props }) => /* @__PURE__ */ jsx(
6871
+ "li",
6872
+ {
6873
+ className: cn(
6874
+ "pl-1 [&>p]:my-1 [&>ul]:my-1.5 [&>ol]:my-1.5",
6875
+ // A wrapped task starts under its text, not under the box.
6876
+ className?.includes("task-list-item") && "pl-6 -indent-6",
6877
+ className
6878
+ ),
6879
+ ...props
6880
+ }
6881
+ ),
6882
+ input: (props) => props.type === "checkbox" ? /* @__PURE__ */ jsx(
6883
+ "input",
6884
+ {
6885
+ ...props,
6886
+ className: cn("mr-2 size-4 translate-y-[2px] align-baseline accent-foreground", props.className),
6887
+ "aria-label": props.checked ? "Done" : "To do"
6888
+ }
6889
+ ) : /* @__PURE__ */ jsx("input", { ...props }),
6745
6890
  blockquote: ({ children }) => /* @__PURE__ */ jsx(Callout, { children }),
6746
6891
  hr: () => /* @__PURE__ */ jsx("hr", { className: "my-10 border-border" }),
6747
6892
  table: MdxTable,
@@ -6771,6 +6916,6 @@ function createMdxComponents({ mermaid } = {}) {
6771
6916
  }
6772
6917
  var mdxComponents = createMdxComponents();
6773
6918
 
6774
- export { APP_ATTRIBUTE, APP_ID, Accent, Accordion, AccordionItem, AccountMenu, ActivityList, AnchorStatus, ApiTable, AppCard, AppGrid, AppIcon, AppShell, ArtifactView, Badge, BlockCountdown, BlockHeight, Breadcrumbs, BrowserFrame, Button, CODE_LANGS, Callout, Card, CardContent, CardDescription, CardFooter, CardGrid, CardHeader, CardNumeral, CardTitle, Checkbox, Closing, CodeBlock, CodeTabs, ComparisonTable, Container, CopyButton, Crowd, DOCS_HEADER_NAV, DOCS_HREF, DataTable, DensityProvider, Diagram, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogHost, DialogTitle, DialogTrigger, Display, DocHeader, DocLayout, DocsHeading, DocsNav, DocsPager, DocsShell, DropZone, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EmptyLine, EmptyState, EndpointList, ErrorBoundary, ErrorPage, Eyebrow, FAMILY, FAMILY_GROUPS, FactBlock, FactRows, FamilyMenu, Faq, Field, FilterChips, FloatChip, Footnote, FormSection, HalftoneCanvas, HalftoneSphere, HashChip, Input, InstallTabs, IsoCheck, Kbd, KeyValueList, LEGAL_LINKS, Label, Lead, LegalDocument, LinkCard, LoadingBlock, Lockup, MARK_FACES, Mark, MdxTable, Meter, Monogram, Notice, OCHK_APP_ACCOUNT, OCHK_IO, OCHK_IO_FOOTER, OCHK_IO_NAV, OnThisPage, PROTOCOLS, PROTOCOL_ORDER, PackageCard, PageHeader, PageHero, Pagination, PhoneFrame, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ProgressSteps, ProofStrip, Prose, ProtocolGrid, ProtocolHero, ProtocolNav, QrCode, RadioGroup, RadioGroupItem, Reveal, SELF_HOSTED_LEGAL_LINKS, SPHERE_GRADIENT, Sats, SatsFigure, ScrollFade, ScrollStory, SearchButton, SearchDialog, Section, SectionHeading, SectionIntro, Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue, Separator, SessionAccountView, Sheet, SheetClose, SheetContent, SheetDescription, SheetTitle, SheetTrigger, ShellContext, SignInFrame, SignMessage, SiteBanner, SiteFooter, SiteHeader, Skeleton, SkipLink, SpecCard, Spinner, SplitBar, StatCard, StatGrid, StateBadge, StatusBadge, StatusDot, StatusPill, Step, StepGrid, Steps, Switch, TOKEN_CLASS, Tabs, TabsContent, TabsList, TabsTrigger, TextLink, Textarea, ThemeToggle, Ticker, Toaster, ToolGrid, ToolShell, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TruthTable, UsdApprox, VerifyBox, VerifyReport, appColors, appFonts, badgeVariants, blocksToDuration, buttonVariants, cardVariants, cn, confirm, createMdxComponents, createStateBadge, escapeHtml, explorerUrl, familyByGroup, familySite, formatBlockHeight, formatBytes, formatUtc, grammarOf, highlight, highlightToHtml, languageName, linesToHtml, mdxComponents, monogramGround, monogramLetter, parseCodeMeta, parseLineRanges, portraitTone, prompt, protocolSite, readDiff, rehypeCode, satsText, sectionVariants, shortenMiddle, statusWord, useActiveHeading, useCopy, useDensity, useHeadings, useInView, useShellPlace, useSignInHref, useTimedOut };
6919
+ export { APP_ATTRIBUTE, APP_ID, Accent, Accordion, AccordionItem, AccountMenu, ActivityList, AnchorStatus, ApiTable, AppCard, AppGrid, AppIcon, AppShell, ArtifactView, Badge, BlockCountdown, BlockHeight, Breadcrumbs, BrowserFrame, Button, CODE_LANGS, Callout, Card, CardContent, CardDescription, CardFooter, CardGrid, CardHeader, CardNumeral, CardTitle, Checkbox, Closing, CodeBlock, CodeTabs, ComparisonTable, Container, CopyButton, Crowd, DOCS_HEADER_NAV, DOCS_HREF, DataTable, DensityProvider, Diagram, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogHost, DialogTitle, DialogTrigger, Display, DocHeader, DocLayout, DocsHeading, DocsNav, DocsPager, DocsShell, DropZone, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EmptyLine, EmptyState, EndpointList, ErrorBoundary, ErrorPage, Eyebrow, FAMILY, FAMILY_GROUPS, FactBlock, FactRows, FamilyMenu, Faq, Field, FilterChips, FloatChip, Footnote, FormSection, HalftoneCanvas, HalftoneSphere, HashChip, Input, InstallTabs, IsoCheck, Kbd, KeyValueList, LEGAL_LINKS, Label, Lead, LegalDocument, LinkCard, LoadingBlock, Lockup, MARK_FACES, Mark, MdxTable, Meter, Monogram, Notice, OCHK_APP_ACCOUNT, OCHK_IO, OCHK_IO_FOOTER, OCHK_IO_NAV, OchkIoFooter, OnThisPage, PROTOCOLS, PROTOCOL_ORDER, PackageCard, PageHeader, PageHero, Pagination, PhoneFrame, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ProgressSteps, ProofStrip, Prose, ProtocolGrid, ProtocolHero, ProtocolNav, QrCode, RadioGroup, RadioGroupItem, Reveal, SELF_HOSTED_LEGAL_LINKS, SPHERE_GRADIENT, Sats, SatsFigure, ScrollFade, ScrollStory, SearchButton, SearchDialog, Section, SectionHeading, SectionIntro, Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue, Separator, SessionAccountView, Sheet, SheetClose, SheetContent, SheetDescription, SheetTitle, SheetTrigger, ShellContext, SignInFrame, SignMessage, SiteBanner, SiteFooter, SiteHeader, Skeleton, SkipLink, SpecCard, Spinner, SplitBar, StatCard, StatGrid, StateBadge, StatusBadge, StatusDot, StatusPill, Step, StepGrid, Steps, Switch, TOKEN_CLASS, Tabs, TabsContent, TabsList, TabsTrigger, TextLink, Textarea, ThemeToggle, Ticker, Toaster, ToolGrid, ToolShell, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TruthTable, UsdApprox, VerifyBox, VerifyReport, appColors, appFonts, badgeVariants, blocksToDuration, buttonVariants, cardVariants, cn, confirm, createMdxComponents, createStateBadge, escapeHtml, explorerUrl, familyByGroup, familySite, formatBlockHeight, formatBytes, formatUtc, grammarOf, highlight, highlightToHtml, languageName, linesToHtml, mdxComponents, monogramGround, monogramLetter, parseCodeMeta, parseLineRanges, portraitTone, prompt, protocolSite, readDiff, rehypeCode, satsText, sectionVariants, shortenMiddle, statusWord, useActiveHeading, useCopy, useDensity, useHeadings, useInView, useShellPlace, useSignInHref, useTimedOut };
6775
6920
  //# sourceMappingURL=index.mjs.map
6776
6921
  //# sourceMappingURL=index.mjs.map