@orangecheck/design 0.6.1 → 0.7.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.
package/dist/chrome.js ADDED
@@ -0,0 +1,1633 @@
1
+ 'use strict';
2
+
3
+ var lucideReact = require('lucide-react');
4
+ var Link5 = require('next/link');
5
+ var react = require('react');
6
+ var jsxRuntime = require('react/jsx-runtime');
7
+ var router = require('next/router');
8
+ var authClient = require('@orangecheck/auth-client');
9
+ var clsx = require('clsx');
10
+ var tailwindMerge = require('tailwind-merge');
11
+
12
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
13
+
14
+ var Link5__default = /*#__PURE__*/_interopDefault(Link5);
15
+
16
+ // src/chrome/ecosystem-switcher.tsx
17
+ var ENTRIES = [
18
+ {
19
+ slug: "home",
20
+ href: "https://ochk.io",
21
+ label: "orangecheck",
22
+ sub: "umbrella",
23
+ docsHref: "https://docs.ochk.io"
24
+ },
25
+ {
26
+ slug: "docs",
27
+ href: "https://docs.ochk.io",
28
+ label: "oc\xB7docs",
29
+ sub: "unified docs",
30
+ docsHref: "https://docs.ochk.io"
31
+ },
32
+ {
33
+ slug: "fleet",
34
+ href: "https://fleet.ochk.io",
35
+ label: "oc\xB7fleet",
36
+ sub: "managed \u2014 agent fleet",
37
+ docsHref: "https://docs.ochk.io/fleet"
38
+ },
39
+ {
40
+ slug: "me",
41
+ href: "https://me.ochk.io",
42
+ label: "oc\xB7me",
43
+ sub: "earn \u2014 consumer identity",
44
+ docsHref: "https://docs.ochk.io/me"
45
+ },
46
+ {
47
+ slug: "vault",
48
+ href: "https://vault.ochk.io",
49
+ label: "oc\xB7vault",
50
+ sub: "keep \u2014 encrypted secrets",
51
+ docsHref: "https://docs.ochk.io/vault"
52
+ },
53
+ {
54
+ slug: "attest",
55
+ href: "https://attest.ochk.io",
56
+ label: "oc\xB7attest",
57
+ sub: "am \u2014 sybil resistance",
58
+ docsHref: "https://docs.ochk.io/attest"
59
+ },
60
+ {
61
+ slug: "lock",
62
+ href: "https://lock.ochk.io",
63
+ label: "oc\xB7lock",
64
+ sub: "whisper \u2014 encryption",
65
+ docsHref: "https://docs.ochk.io/lock"
66
+ },
67
+ {
68
+ slug: "vote",
69
+ href: "https://vote.ochk.io",
70
+ label: "oc\xB7vote",
71
+ sub: "decide \u2014 polls",
72
+ docsHref: "https://docs.ochk.io/vote"
73
+ },
74
+ {
75
+ slug: "stamp",
76
+ href: "https://stamp.ochk.io",
77
+ label: "oc\xB7stamp",
78
+ sub: "declare \u2014 block-anchored",
79
+ docsHref: "https://docs.ochk.io/stamp"
80
+ },
81
+ {
82
+ slug: "agent",
83
+ href: "https://agent.ochk.io",
84
+ label: "oc\xB7agent",
85
+ sub: "delegate \u2014 scoped auth",
86
+ docsHref: "https://docs.ochk.io/agent"
87
+ },
88
+ {
89
+ slug: "pledge",
90
+ href: "https://pledge.ochk.io",
91
+ label: "oc\xB7pledge",
92
+ sub: "swear \u2014 bonded commitment",
93
+ docsHref: "https://docs.ochk.io/pledge"
94
+ }
95
+ ];
96
+ var OWNER_ENTRIES = [
97
+ {
98
+ slug: "analytics",
99
+ href: "https://analytics.ochk.io",
100
+ label: "oc\xB7analytics",
101
+ sub: "owner cockpit",
102
+ docsHref: "https://analytics.ochk.io"
103
+ }
104
+ ];
105
+ function EcosystemSwitcher({
106
+ current,
107
+ className,
108
+ showOwnerEntries = false
109
+ }) {
110
+ const [open, setOpen] = react.useState(false);
111
+ const containerRef = react.useRef(null);
112
+ react.useEffect(() => {
113
+ if (!open) return;
114
+ function onDoc(e) {
115
+ if (!containerRef.current) return;
116
+ if (!containerRef.current.contains(e.target)) setOpen(false);
117
+ }
118
+ function onKey(e) {
119
+ if (e.key === "Escape") setOpen(false);
120
+ }
121
+ document.addEventListener("mousedown", onDoc);
122
+ document.addEventListener("keydown", onKey);
123
+ return () => {
124
+ document.removeEventListener("mousedown", onDoc);
125
+ document.removeEventListener("keydown", onKey);
126
+ };
127
+ }, [open]);
128
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: "relative " + (className ?? ""), children: [
129
+ /* @__PURE__ */ jsxRuntime.jsxs(
130
+ "button",
131
+ {
132
+ type: "button",
133
+ "aria-haspopup": "menu",
134
+ "aria-expanded": open,
135
+ "aria-label": "Switch OrangeCheck product",
136
+ title: "Switch product",
137
+ onClick: () => setOpen((v) => !v),
138
+ className: "inline-flex items-center gap-1 px-2 py-1 transition-colors " + (open ? "text-foreground" : "text-muted-foreground hover:text-foreground"),
139
+ children: [
140
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Boxes, { className: "h-4 w-4" }),
141
+ /* @__PURE__ */ jsxRuntime.jsx(
142
+ lucideReact.ChevronDown,
143
+ {
144
+ className: "h-3.5 w-3.5 transition-transform " + (open ? "rotate-180" : "")
145
+ }
146
+ )
147
+ ]
148
+ }
149
+ ),
150
+ open && /* @__PURE__ */ jsxRuntime.jsxs(
151
+ "div",
152
+ {
153
+ role: "menu",
154
+ "aria-label": "Switch OrangeCheck product",
155
+ className: "bg-background absolute right-0 top-full z-[60] mt-2 w-72 border shadow-lg",
156
+ children: [
157
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "label-mono text-primary border-b px-4 py-2", children: "\xA7 the family" }),
158
+ /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "py-1", children: [...ENTRIES, ...showOwnerEntries ? OWNER_ENTRIES : []].map((e) => {
159
+ const isActive2 = e.slug === current;
160
+ return /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(
161
+ Link5__default.default,
162
+ {
163
+ href: e.href,
164
+ onClick: () => setOpen(false),
165
+ "aria-current": isActive2 ? "page" : void 0,
166
+ className: "group flex items-baseline gap-3 px-4 py-2 transition-colors " + (isActive2 ? "bg-primary/5" : "hover:bg-muted"),
167
+ children: [
168
+ /* @__PURE__ */ jsxRuntime.jsx(
169
+ "span",
170
+ {
171
+ className: "font-display flex-1 text-[12px] font-semibold tracking-tight " + (isActive2 ? "text-primary" : "text-foreground group-hover:text-primary transition-colors"),
172
+ children: e.label
173
+ }
174
+ ),
175
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground font-mono text-[10px] tracking-wider uppercase", children: e.sub }),
176
+ isActive2 && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "text-primary h-3 w-3" })
177
+ ]
178
+ }
179
+ ) }, e.slug);
180
+ }) }),
181
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t px-4 py-2 font-mono text-[10px] tracking-widest uppercase", children: /* @__PURE__ */ jsxRuntime.jsx(
182
+ Link5__default.default,
183
+ {
184
+ href: "https://docs.ochk.io",
185
+ onClick: () => setOpen(false),
186
+ className: "text-muted-foreground hover:text-foreground inline-block transition-colors",
187
+ children: "docs.ochk.io \u2192"
188
+ }
189
+ ) })
190
+ ]
191
+ }
192
+ )
193
+ ] });
194
+ }
195
+
196
+ // src/chrome/family-properties.ts
197
+ var FAMILY_PROPERTIES = [
198
+ {
199
+ slug: "home",
200
+ origin: "https://ochk.io",
201
+ hostname: "ochk.io",
202
+ label: "orangecheck",
203
+ sub: "umbrella \xB7 sign-in",
204
+ docsHref: "https://docs.ochk.io",
205
+ category: "hub"
206
+ },
207
+ {
208
+ slug: "docs",
209
+ origin: "https://docs.ochk.io",
210
+ hostname: "docs.ochk.io",
211
+ label: "oc\xB7docs",
212
+ sub: "unified reference",
213
+ docsHref: "https://docs.ochk.io",
214
+ category: "hub"
215
+ },
216
+ {
217
+ slug: "me",
218
+ origin: "https://me.ochk.io",
219
+ hostname: "me.ochk.io",
220
+ label: "oc\xB7me",
221
+ sub: "earn \u2014 consumer identity",
222
+ docsHref: "https://docs.ochk.io/me",
223
+ category: "product"
224
+ },
225
+ {
226
+ slug: "vault",
227
+ origin: "https://vault.ochk.io",
228
+ hostname: "vault.ochk.io",
229
+ label: "oc\xB7vault",
230
+ sub: "keep \u2014 encrypted secrets",
231
+ docsHref: "https://docs.ochk.io/vault",
232
+ category: "product"
233
+ },
234
+ {
235
+ slug: "fleet",
236
+ origin: "https://fleet.ochk.io",
237
+ hostname: "fleet.ochk.io",
238
+ label: "oc\xB7fleet",
239
+ sub: "managed \u2014 agent fleet",
240
+ docsHref: "https://docs.ochk.io/fleet",
241
+ category: "product"
242
+ },
243
+ {
244
+ slug: "attest",
245
+ origin: "https://attest.ochk.io",
246
+ hostname: "attest.ochk.io",
247
+ label: "oc\xB7attest",
248
+ sub: "am \u2014 sybil resistance",
249
+ docsHref: "https://docs.ochk.io/attest",
250
+ category: "protocol"
251
+ },
252
+ {
253
+ slug: "lock",
254
+ origin: "https://lock.ochk.io",
255
+ hostname: "lock.ochk.io",
256
+ label: "oc\xB7lock",
257
+ sub: "whisper \u2014 encryption",
258
+ docsHref: "https://docs.ochk.io/lock",
259
+ category: "protocol"
260
+ },
261
+ {
262
+ slug: "vote",
263
+ origin: "https://vote.ochk.io",
264
+ hostname: "vote.ochk.io",
265
+ label: "oc\xB7vote",
266
+ sub: "decide \u2014 polls",
267
+ docsHref: "https://docs.ochk.io/vote",
268
+ category: "protocol"
269
+ },
270
+ {
271
+ slug: "stamp",
272
+ origin: "https://stamp.ochk.io",
273
+ hostname: "stamp.ochk.io",
274
+ label: "oc\xB7stamp",
275
+ sub: "declare \u2014 block-anchored",
276
+ docsHref: "https://docs.ochk.io/stamp",
277
+ category: "protocol"
278
+ },
279
+ {
280
+ slug: "agent",
281
+ origin: "https://agent.ochk.io",
282
+ hostname: "agent.ochk.io",
283
+ label: "oc\xB7agent",
284
+ sub: "delegate \u2014 scoped auth",
285
+ docsHref: "https://docs.ochk.io/agent",
286
+ category: "protocol"
287
+ },
288
+ {
289
+ slug: "pledge",
290
+ origin: "https://pledge.ochk.io",
291
+ hostname: "pledge.ochk.io",
292
+ label: "oc\xB7pledge",
293
+ sub: "swear \u2014 bonded commitment",
294
+ docsHref: "https://docs.ochk.io/pledge",
295
+ category: "protocol"
296
+ },
297
+ {
298
+ slug: "analytics",
299
+ origin: "https://analytics.ochk.io",
300
+ hostname: "analytics.ochk.io",
301
+ label: "oc\xB7analytics",
302
+ sub: "owner cockpit",
303
+ docsHref: "https://analytics.ochk.io",
304
+ category: "owner"
305
+ }
306
+ ];
307
+ var SITE_STATE_LABEL = {
308
+ alpha: "alpha",
309
+ beta: "beta"
310
+ };
311
+ function findFamilyProperty(slug) {
312
+ return FAMILY_PROPERTIES.find((p) => p.slug === slug);
313
+ }
314
+ var SECTIONS = [
315
+ { category: "hub", label: "hub" },
316
+ { category: "product", label: "products" },
317
+ { category: "protocol", label: "protocols" },
318
+ { category: "owner", label: "owner" }
319
+ ];
320
+ function CategoryChip({ category }) {
321
+ if (category === "hub") return null;
322
+ const label = category === "product" ? "product" : category === "protocol" ? "protocol" : "owner";
323
+ const tone = category === "product" ? "border-primary/25 bg-primary/10 text-primary" : category === "protocol" ? "border-muted-foreground/20 bg-muted/40 text-muted-foreground/85" : "border-warning/30 bg-warning/10 text-warning";
324
+ return /* @__PURE__ */ jsxRuntime.jsx(
325
+ "span",
326
+ {
327
+ "aria-label": category === "product" ? "commercial product" : category === "protocol" ? "protocol reference" : "owner-only surface",
328
+ className: "ml-1 hidden rounded-sm border px-1.5 py-[1px] font-mono text-[9px] font-medium tracking-widest uppercase sm:inline-block " + tone,
329
+ "data-oc-category": category,
330
+ children: label
331
+ }
332
+ );
333
+ }
334
+ function SiteStateBadge({ state }) {
335
+ if (state === "live") return null;
336
+ return /* @__PURE__ */ jsxRuntime.jsx(
337
+ "span",
338
+ {
339
+ "aria-label": `site lifecycle: ${state}`,
340
+ className: "text-muted-foreground/70 ml-1 hidden font-mono text-[9px] font-medium tracking-widest uppercase sm:inline-block",
341
+ "data-oc-site-state": state,
342
+ children: SITE_STATE_LABEL[state]
343
+ }
344
+ );
345
+ }
346
+ function MenuCategoryChip({ category }) {
347
+ if (category === "hub") return null;
348
+ const label = category === "product" ? "pro" : category === "protocol" ? "spec" : "own";
349
+ const tone = category === "product" ? "bg-primary/10 text-primary" : category === "protocol" ? "bg-muted/60 text-muted-foreground/80" : "bg-warning/15 text-warning";
350
+ return /* @__PURE__ */ jsxRuntime.jsx(
351
+ "span",
352
+ {
353
+ "aria-hidden": true,
354
+ className: "inline-block shrink-0 rounded-sm px-1 py-[1px] font-mono text-[9px] font-medium tracking-widest uppercase " + tone,
355
+ children: label
356
+ }
357
+ );
358
+ }
359
+ function OcLogoDropdown({
360
+ current,
361
+ homeHref = "/",
362
+ siteState = "live",
363
+ children,
364
+ className,
365
+ triggerClassName,
366
+ popoverClassName,
367
+ showOwnerEntries = false
368
+ }) {
369
+ const [open, setOpen] = react.useState(false);
370
+ const containerRef = react.useRef(null);
371
+ const menuId = react.useId();
372
+ const router$1 = router.useRouter();
373
+ const currentCategory = findFamilyProperty(current)?.category ?? "hub";
374
+ function handleTriggerClick(e) {
375
+ if (e.detail >= 2) {
376
+ e.preventDefault();
377
+ setOpen(false);
378
+ void router$1.push(homeHref);
379
+ return;
380
+ }
381
+ setOpen((v) => !v);
382
+ }
383
+ react.useEffect(() => {
384
+ if (!open) return;
385
+ function onDoc(e) {
386
+ if (!containerRef.current) return;
387
+ if (!containerRef.current.contains(e.target)) setOpen(false);
388
+ }
389
+ function onKey(e) {
390
+ if (e.key === "Escape") setOpen(false);
391
+ }
392
+ document.addEventListener("mousedown", onDoc);
393
+ document.addEventListener("keydown", onKey);
394
+ return () => {
395
+ document.removeEventListener("mousedown", onDoc);
396
+ document.removeEventListener("keydown", onKey);
397
+ };
398
+ }, [open]);
399
+ return /* @__PURE__ */ jsxRuntime.jsxs(
400
+ "div",
401
+ {
402
+ ref: containerRef,
403
+ className: "relative inline-flex items-center " + (className ?? ""),
404
+ "data-oc-logo-dropdown": "",
405
+ "data-oc-current-category": currentCategory,
406
+ "data-oc-site-state": siteState,
407
+ children: [
408
+ /* @__PURE__ */ jsxRuntime.jsxs(
409
+ "button",
410
+ {
411
+ type: "button",
412
+ "aria-haspopup": "menu",
413
+ "aria-expanded": open,
414
+ "aria-controls": menuId,
415
+ "aria-label": "OrangeCheck family \xB7 click to open property menu, double-click to go home",
416
+ title: "single-click \xB7 family menu \xB7 double-click \xB7 go home",
417
+ onClick: handleTriggerClick,
418
+ className: triggerClassName ?? "group hover:bg-accent/30 -mx-1.5 -my-1 flex min-h-[40px] items-center gap-2 rounded-sm px-1.5 py-1 transition-colors " + (open ? "bg-accent/20" : ""),
419
+ "data-oc-logo-dropdown-trigger": "",
420
+ "data-oc-logo-dropdown-open": open ? "true" : "false",
421
+ children: [
422
+ children,
423
+ /* @__PURE__ */ jsxRuntime.jsx(CategoryChip, { category: currentCategory }),
424
+ /* @__PURE__ */ jsxRuntime.jsx(SiteStateBadge, { state: siteState }),
425
+ /* @__PURE__ */ jsxRuntime.jsx(
426
+ lucideReact.ChevronDown,
427
+ {
428
+ "aria-hidden": true,
429
+ className: "text-muted-foreground/70 group-hover:text-foreground/80 h-3.5 w-3.5 shrink-0 transition-transform duration-200 " + (open ? "rotate-180" : "")
430
+ }
431
+ )
432
+ ]
433
+ }
434
+ ),
435
+ /* @__PURE__ */ jsxRuntime.jsxs(
436
+ Link5__default.default,
437
+ {
438
+ href: homeHref,
439
+ "aria-label": "go to " + homeHref + " (this site's home)",
440
+ onClick: () => setOpen(false),
441
+ tabIndex: open ? 0 : -1,
442
+ className: "hover:text-primary group/home -ml-1 hidden items-center gap-1 rounded-sm px-1.5 py-1 font-mono text-[9px] tracking-widest uppercase transition-all duration-200 sm:inline-flex " + (open ? "pointer-events-auto translate-x-0 text-muted-foreground/70 opacity-100 hover:bg-accent/30" : "pointer-events-none -translate-x-1 opacity-0"),
443
+ "data-oc-logo-dropdown-home-hint": "",
444
+ children: [
445
+ /* @__PURE__ */ jsxRuntime.jsx(
446
+ lucideReact.CornerDownLeft,
447
+ {
448
+ "aria-hidden": true,
449
+ className: "h-3 w-3 group-hover/home:text-primary " + (open ? "motion-safe:animate-pulse" : "")
450
+ }
451
+ ),
452
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary/70 group-hover/home:text-primary", children: "home" })
453
+ ]
454
+ }
455
+ ),
456
+ open && /* @__PURE__ */ jsxRuntime.jsxs(
457
+ "div",
458
+ {
459
+ id: menuId,
460
+ role: "menu",
461
+ "aria-label": "OrangeCheck family",
462
+ className: popoverClassName ?? "bg-background absolute top-full left-0 z-[60] mt-2 w-[min(20rem,calc(100vw-1rem))] border shadow-lg",
463
+ "data-oc-logo-dropdown-popover": "",
464
+ children: [
465
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "label-mono text-primary border-b px-4 py-2", children: "\xA7 the orangecheck family" }),
466
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-h-[min(28rem,70vh)] overflow-y-auto py-1", role: "none", children: SECTIONS.map(({ category, label }) => {
467
+ if (category === "owner" && !showOwnerEntries) return null;
468
+ const sectionEntries = FAMILY_PROPERTIES.filter(
469
+ (e) => e.category === category
470
+ );
471
+ if (sectionEntries.length === 0) return null;
472
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { role: "none", "data-oc-section": category, children: [
473
+ /* @__PURE__ */ jsxRuntime.jsx(
474
+ "div",
475
+ {
476
+ role: "separator",
477
+ "aria-hidden": true,
478
+ className: "text-muted-foreground/60 px-4 pt-2.5 pb-1 font-mono text-[9px] font-medium tracking-widest uppercase " + (category === "hub" ? "" : "border-t mt-1"),
479
+ children: label
480
+ }
481
+ ),
482
+ /* @__PURE__ */ jsxRuntime.jsx("ul", { role: "none", className: "pb-1", children: sectionEntries.map((e) => {
483
+ const isActive2 = e.slug === current;
484
+ const href = isActive2 ? homeHref : e.origin;
485
+ return /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", children: /* @__PURE__ */ jsxRuntime.jsxs(
486
+ Link5__default.default,
487
+ {
488
+ href,
489
+ role: "menuitem",
490
+ onClick: () => setOpen(false),
491
+ "aria-current": isActive2 ? "page" : void 0,
492
+ className: "group flex items-center gap-2 px-4 py-2 transition-colors " + (isActive2 ? "bg-primary/8 border-primary -ml-px border-l-2" : "hover:bg-muted -ml-px border-l-2 border-transparent"),
493
+ "data-oc-logo-dropdown-item": isActive2 ? "current" : "sibling",
494
+ "data-oc-entry-category": e.category,
495
+ children: [
496
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-1 flex-col leading-tight", children: [
497
+ /* @__PURE__ */ jsxRuntime.jsx(
498
+ "span",
499
+ {
500
+ className: "font-display text-[12px] font-semibold tracking-tight " + (isActive2 ? "text-primary" : "text-foreground group-hover:text-primary transition-colors"),
501
+ children: e.label
502
+ }
503
+ ),
504
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground mt-0.5 font-mono text-[10px] tracking-wide", children: e.sub })
505
+ ] }),
506
+ /* @__PURE__ */ jsxRuntime.jsx(MenuCategoryChip, { category: e.category }),
507
+ isActive2 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-primary inline-flex shrink-0 items-center gap-1 font-mono text-[10px] tracking-widest uppercase", children: [
508
+ "home",
509
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-3 w-3" })
510
+ ] }) : null
511
+ ]
512
+ }
513
+ ) }, e.slug);
514
+ }) })
515
+ ] }, category);
516
+ }) }),
517
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t px-4 py-2 font-mono text-[10px] tracking-widest uppercase", children: /* @__PURE__ */ jsxRuntime.jsx(
518
+ Link5__default.default,
519
+ {
520
+ href: "https://docs.ochk.io",
521
+ onClick: () => setOpen(false),
522
+ className: "text-muted-foreground hover:text-foreground inline-block transition-colors",
523
+ children: "docs.ochk.io \u2192"
524
+ }
525
+ ) })
526
+ ]
527
+ }
528
+ )
529
+ ]
530
+ }
531
+ );
532
+ }
533
+ function obscureIdentity(value) {
534
+ if (value.length <= 12) {
535
+ return `${value.slice(0, 4)}\u2026${value.slice(-3)}`;
536
+ }
537
+ return `${value.slice(0, 6)}\u2026${value.slice(-4)}`;
538
+ }
539
+ var IDENTITY_KIND_LABEL = {
540
+ did: "did:oc",
541
+ btc: "bitcoin",
542
+ email: "email",
543
+ nostr: "nostr"
544
+ };
545
+ async function writeClipboard(text) {
546
+ try {
547
+ if (navigator.clipboard?.writeText) {
548
+ await navigator.clipboard.writeText(text);
549
+ return true;
550
+ }
551
+ } catch {
552
+ }
553
+ try {
554
+ const ta = document.createElement("textarea");
555
+ ta.value = text;
556
+ ta.setAttribute("readonly", "");
557
+ ta.style.position = "fixed";
558
+ ta.style.top = "-1000px";
559
+ ta.style.opacity = "0";
560
+ document.body.appendChild(ta);
561
+ ta.select();
562
+ const ok = document.execCommand("copy");
563
+ document.body.removeChild(ta);
564
+ return ok;
565
+ } catch {
566
+ return false;
567
+ }
568
+ }
569
+ function CopyableDid({ did }) {
570
+ const [copied, setCopied] = react.useState(false);
571
+ const timerRef = react.useRef(null);
572
+ react.useEffect(
573
+ () => () => {
574
+ if (timerRef.current) clearTimeout(timerRef.current);
575
+ },
576
+ []
577
+ );
578
+ const onCopy = async () => {
579
+ const ok = await writeClipboard(did);
580
+ if (!ok) return;
581
+ setCopied(true);
582
+ if (timerRef.current) clearTimeout(timerRef.current);
583
+ timerRef.current = setTimeout(() => setCopied(false), 1600);
584
+ };
585
+ return /* @__PURE__ */ jsxRuntime.jsxs(
586
+ "button",
587
+ {
588
+ type: "button",
589
+ onClick: onCopy,
590
+ "aria-label": copied ? "OrangeCheck identity copied to clipboard" : `Copy OrangeCheck identity ${did} to clipboard`,
591
+ title: "Copy identity",
592
+ "data-oc-account-menu-copy-did": "",
593
+ "data-copied": copied ? "" : void 0,
594
+ className: "group/did hover:bg-accent focus-visible:ring-ring/60 -mx-1.5 mt-px flex w-[calc(100%+0.75rem)] items-start gap-1.5 rounded px-1.5 py-1 text-left transition-colors focus-visible:ring-2 focus-visible:outline-none",
595
+ children: [
596
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground/90 min-w-0 flex-1 font-mono text-[11px] leading-tight break-all", children: did }),
597
+ /* @__PURE__ */ jsxRuntime.jsx(
598
+ "span",
599
+ {
600
+ className: "mt-px shrink-0 transition-colors " + (copied ? "text-primary" : "text-muted-foreground/50 group-hover/did:text-foreground/80"),
601
+ "aria-hidden": true,
602
+ children: copied ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "size-3.5" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, { className: "size-3.5" })
603
+ }
604
+ ),
605
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", "aria-live": "polite", children: copied ? "Copied to clipboard" : "" })
606
+ ]
607
+ }
608
+ );
609
+ }
610
+ function PromoteRow({
611
+ kind,
612
+ value,
613
+ active,
614
+ busy,
615
+ disabled,
616
+ onPromote
617
+ }) {
618
+ const [copied, setCopied] = react.useState(false);
619
+ const timerRef = react.useRef(null);
620
+ react.useEffect(
621
+ () => () => {
622
+ if (timerRef.current) clearTimeout(timerRef.current);
623
+ },
624
+ []
625
+ );
626
+ const onCopy = async () => {
627
+ const ok = await writeClipboard(value);
628
+ if (!ok) return;
629
+ setCopied(true);
630
+ if (timerRef.current) clearTimeout(timerRef.current);
631
+ timerRef.current = setTimeout(() => setCopied(false), 1600);
632
+ };
633
+ const kindLabel = IDENTITY_KIND_LABEL[kind];
634
+ return /* @__PURE__ */ jsxRuntime.jsxs(
635
+ "div",
636
+ {
637
+ className: "hover:bg-accent flex items-center gap-1 pr-2 transition-colors",
638
+ "data-oc-account-menu-promote-row": kind,
639
+ "data-active": active ? "" : void 0,
640
+ children: [
641
+ /* @__PURE__ */ jsxRuntime.jsxs(
642
+ "button",
643
+ {
644
+ type: "button",
645
+ role: "menuitemradio",
646
+ "aria-checked": active,
647
+ "aria-label": active ? `Showing as ${kindLabel}` : `Show as ${kindLabel}`,
648
+ disabled: disabled || active,
649
+ onClick: onPromote,
650
+ "data-oc-account-menu-promote": kind,
651
+ className: "flex min-w-0 flex-1 items-center gap-2 py-2 pl-3 text-left font-mono text-[11px] tracking-wide disabled:cursor-default",
652
+ children: [
653
+ /* @__PURE__ */ jsxRuntime.jsx(
654
+ "span",
655
+ {
656
+ className: "flex size-3.5 shrink-0 items-center justify-center rounded-full border " + (active ? "border-primary" : "border-muted-foreground/40"),
657
+ "aria-hidden": true,
658
+ children: active ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-primary size-1.5 rounded-full" }) : null
659
+ }
660
+ ),
661
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground/90 min-w-0 flex-1 truncate", children: obscureIdentity(value) })
662
+ ]
663
+ }
664
+ ),
665
+ /* @__PURE__ */ jsxRuntime.jsx(
666
+ "button",
667
+ {
668
+ type: "button",
669
+ onClick: () => void onCopy(),
670
+ "aria-label": copied ? `${kindLabel} copied to clipboard` : `Copy ${kindLabel} to clipboard`,
671
+ title: "Copy",
672
+ "data-oc-account-menu-promote-copy": kind,
673
+ "data-copied": copied ? "" : void 0,
674
+ className: "hover:bg-background/70 focus-visible:ring-ring/60 flex size-6 shrink-0 items-center justify-center rounded transition-colors focus-visible:ring-2 focus-visible:outline-none",
675
+ children: copied ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "text-primary size-3.5" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, { className: "text-muted-foreground/50 size-3.5" })
676
+ }
677
+ ),
678
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground/50 w-14 shrink-0 text-right text-[9px] tracking-widest uppercase", children: busy ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "ml-auto size-3 animate-spin" }) : kindLabel }),
679
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", "aria-live": "polite", children: copied ? "Copied to clipboard" : "" })
680
+ ]
681
+ }
682
+ );
683
+ }
684
+ function IdentityPromoteSection({
685
+ didOc,
686
+ nostrNpub,
687
+ current,
688
+ open,
689
+ setDisplayIdentity
690
+ }) {
691
+ const [identities, setIdentities] = react.useState(null);
692
+ const [loadFailed, setLoadFailed] = react.useState(false);
693
+ const [promoting, setPromoting] = react.useState(null);
694
+ const [promoteErr, setPromoteErr] = react.useState(null);
695
+ const lastFetchKeyRef = react.useRef(null);
696
+ react.useEffect(() => {
697
+ if (!open) return;
698
+ if (lastFetchKeyRef.current === didOc) return;
699
+ lastFetchKeyRef.current = didOc;
700
+ let cancelled = false;
701
+ setIdentities(null);
702
+ setLoadFailed(false);
703
+ void authClient.fetchOcLinkedIdentities().then((rows) => {
704
+ if (!cancelled) setIdentities(rows);
705
+ }).catch(() => {
706
+ if (!cancelled) setLoadFailed(true);
707
+ });
708
+ return () => {
709
+ cancelled = true;
710
+ };
711
+ }, [open, didOc]);
712
+ if (identities === null && !loadFailed) return null;
713
+ const btc = identities?.find((i) => i.kind === "btc" && i.is_primary && i.value) ?? identities?.find((i) => i.kind === "btc" && i.value);
714
+ const email = identities?.find((i) => i.kind === "email" && i.is_primary && i.value) ?? identities?.find((i) => i.kind === "email" && i.value);
715
+ const options = [
716
+ { kind: "did", value: didOc }
717
+ ];
718
+ if (btc?.value) options.push({ kind: "btc", value: btc.value });
719
+ if (email?.value) options.push({ kind: "email", value: email.value });
720
+ if (nostrNpub) options.push({ kind: "nostr", value: nostrNpub });
721
+ if (options.length < 2) return null;
722
+ const promote = async (kind) => {
723
+ if (promoting || kind === current.kind) return;
724
+ setPromoting(kind);
725
+ setPromoteErr(null);
726
+ try {
727
+ await setDisplayIdentity(kind);
728
+ } catch (e) {
729
+ setPromoteErr(e instanceof Error ? e.message : "promotion failed");
730
+ } finally {
731
+ setPromoting(null);
732
+ }
733
+ };
734
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-border border-b p-1", "data-oc-account-menu-section": "show-as", children: [
735
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/60 px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 show as" }),
736
+ options.map((opt) => /* @__PURE__ */ jsxRuntime.jsx(
737
+ PromoteRow,
738
+ {
739
+ kind: opt.kind,
740
+ value: opt.value,
741
+ active: opt.kind === current.kind,
742
+ busy: promoting === opt.kind,
743
+ disabled: promoting !== null,
744
+ onPromote: () => void promote(opt.kind)
745
+ },
746
+ opt.kind
747
+ )),
748
+ promoteErr ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-destructive/80 px-3 pt-1 pb-2 font-mono text-[10px]", children: promoteErr }) : null
749
+ ] });
750
+ }
751
+ function OcAccountMenu(props) {
752
+ const session = authClient.useOcSession();
753
+ return /* @__PURE__ */ jsxRuntime.jsx(
754
+ OcAccountMenuView,
755
+ {
756
+ ...props,
757
+ session: {
758
+ status: session.status,
759
+ account: session.account ? {
760
+ didOc: session.account.didOc,
761
+ displayName: session.account.displayName ?? null,
762
+ displayIdentity: session.account.displayIdentity,
763
+ nostrNpub: session.account.nostrNpub ?? null
764
+ } : null,
765
+ signOut: session.signOut,
766
+ refresh: session.refresh,
767
+ setDisplayIdentity: session.setDisplayIdentity,
768
+ // Multi-account · the connected variant always forwards
769
+ // these from useOcSession(). The View variant accepts
770
+ // them as optional so sites running their own auth
771
+ // context (oc-www) can opt in incrementally.
772
+ roster: session.roster,
773
+ switchAccount: session.switchAccount,
774
+ addAccountUrl: session.addAccountUrl
775
+ }
776
+ }
777
+ );
778
+ }
779
+ function OcAccountMenuView({
780
+ current,
781
+ signInUrl = "/signin",
782
+ signInLabel = "sign in",
783
+ signOutRedirect = "/",
784
+ menuItems,
785
+ primaryNavLinks,
786
+ secondaryNavLinks,
787
+ showFamilyDashboard,
788
+ build,
789
+ siteState,
790
+ className,
791
+ triggerClassName,
792
+ popoverClassName,
793
+ session
794
+ }) {
795
+ const {
796
+ status,
797
+ account,
798
+ signOut,
799
+ refresh,
800
+ setDisplayIdentity,
801
+ roster,
802
+ switchAccount,
803
+ addAccountUrl
804
+ } = session;
805
+ const [hydrated, setHydrated] = react.useState(false);
806
+ const [open, setOpen] = react.useState(false);
807
+ const wrapRef = react.useRef(null);
808
+ const property = findFamilyProperty(current);
809
+ const hostname = property?.hostname ?? `${current}.ochk.io`;
810
+ const isHome = current === "home";
811
+ const familyDashboardEnabled = showFamilyDashboard ?? !isHome;
812
+ react.useEffect(() => setHydrated(true), []);
813
+ react.useEffect(() => {
814
+ const onWake = () => {
815
+ if (document.visibilityState === "visible") void refresh();
816
+ };
817
+ const onFocus = () => void refresh();
818
+ document.addEventListener("visibilitychange", onWake);
819
+ window.addEventListener("focus", onFocus);
820
+ return () => {
821
+ document.removeEventListener("visibilitychange", onWake);
822
+ window.removeEventListener("focus", onFocus);
823
+ };
824
+ }, [refresh]);
825
+ react.useEffect(() => {
826
+ if (!open) return;
827
+ const onClick = (e) => {
828
+ if (wrapRef.current && !wrapRef.current.contains(e.target)) setOpen(false);
829
+ };
830
+ const onKey = (e) => {
831
+ if (e.key === "Escape") setOpen(false);
832
+ };
833
+ document.addEventListener("mousedown", onClick);
834
+ document.addEventListener("keydown", onKey);
835
+ return () => {
836
+ document.removeEventListener("mousedown", onClick);
837
+ document.removeEventListener("keydown", onKey);
838
+ };
839
+ }, [open]);
840
+ const signInTrigger = /* @__PURE__ */ jsxRuntime.jsx(
841
+ "a",
842
+ {
843
+ href: signInUrl,
844
+ "aria-label": signInLabel,
845
+ "data-oc-account-menu-signin": "",
846
+ className: triggerClassName ?? "border-input bg-background hover:bg-accent inline-flex h-8 items-center justify-center rounded-md border px-3 font-mono text-[11px] font-semibold tracking-widest uppercase transition-colors",
847
+ children: signInLabel
848
+ }
849
+ );
850
+ if (!hydrated || status === "loading") {
851
+ return signInTrigger;
852
+ }
853
+ if (status !== "authenticated" || !account) {
854
+ return signInTrigger;
855
+ }
856
+ const displayName = account.displayName ?? null;
857
+ const label = displayName ?? obscureIdentity(account.displayIdentity.value);
858
+ return /* @__PURE__ */ jsxRuntime.jsxs(
859
+ "div",
860
+ {
861
+ ref: wrapRef,
862
+ className: "relative inline-block " + (className ?? ""),
863
+ "data-oc-account-menu": "",
864
+ children: [
865
+ /* @__PURE__ */ jsxRuntime.jsxs(
866
+ "button",
867
+ {
868
+ type: "button",
869
+ onClick: () => setOpen((v) => !v),
870
+ "aria-haspopup": "menu",
871
+ "aria-expanded": open,
872
+ "aria-label": `Signed in as ${account.didOc}. Open account menu.`,
873
+ className: triggerClassName ?? "border-primary/40 bg-card hover:bg-accent inline-flex h-8 items-center gap-1.5 rounded-md border px-3 font-mono text-[11px] tracking-wide transition-colors",
874
+ "data-oc-account-menu-trigger": "",
875
+ children: [
876
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-primary inline-block size-1.5 rounded-full", "aria-hidden": true }),
877
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground", children: label }),
878
+ /* @__PURE__ */ jsxRuntime.jsx(
879
+ "svg",
880
+ {
881
+ width: "9",
882
+ height: "9",
883
+ viewBox: "0 0 10 10",
884
+ "aria-hidden": true,
885
+ className: "opacity-60 transition-transform " + (open ? "rotate-180" : "rotate-0"),
886
+ children: /* @__PURE__ */ jsxRuntime.jsx(
887
+ "path",
888
+ {
889
+ d: "M2 4 L5 7 L8 4",
890
+ stroke: "currentColor",
891
+ strokeWidth: "1.5",
892
+ fill: "none",
893
+ strokeLinecap: "round"
894
+ }
895
+ )
896
+ }
897
+ )
898
+ ]
899
+ }
900
+ ),
901
+ open && /* @__PURE__ */ jsxRuntime.jsxs(
902
+ "div",
903
+ {
904
+ role: "menu",
905
+ "aria-label": "Account menu",
906
+ className: popoverClassName ?? "border-border bg-popover text-popover-foreground absolute top-[calc(100%+6px)] right-0 z-50 w-[min(20rem,calc(100vw-1rem))] border shadow-xl",
907
+ "data-oc-account-menu-popover": "",
908
+ children: [
909
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-border border-b p-3", children: [
910
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-primary mb-1 font-mono text-[10px] tracking-widest uppercase", children: [
911
+ "\xA7 signed in \xB7 ",
912
+ hostname
913
+ ] }),
914
+ /* @__PURE__ */ jsxRuntime.jsx(CopyableDid, { did: account.didOc }),
915
+ displayName ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/80 mt-1 font-mono text-[10px] tracking-wide", children: displayName }) : null
916
+ ] }),
917
+ /* @__PURE__ */ jsxRuntime.jsx(
918
+ IdentityPromoteSection,
919
+ {
920
+ didOc: account.didOc,
921
+ nostrNpub: account.nostrNpub ?? null,
922
+ current: account.displayIdentity,
923
+ open,
924
+ setDisplayIdentity
925
+ }
926
+ ),
927
+ /* @__PURE__ */ jsxRuntime.jsx(
928
+ AccountsSection,
929
+ {
930
+ roster: roster ?? [],
931
+ switchAccount,
932
+ addAccountUrl,
933
+ signOut,
934
+ onActionStart: () => setOpen(false)
935
+ }
936
+ ),
937
+ primaryNavLinks && primaryNavLinks.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
938
+ PopoverSection,
939
+ {
940
+ label: "navigate",
941
+ items: primaryNavLinks,
942
+ onItemClick: () => setOpen(false)
943
+ }
944
+ ) : null,
945
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-1", "data-oc-account-menu-section": "account", children: [
946
+ primaryNavLinks && primaryNavLinks.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/60 px-3 pb-1 pt-2 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 account" }) : null,
947
+ menuItems?.map((item) => {
948
+ const onClick = () => setOpen(false);
949
+ const cls = "hover:bg-accent flex items-center gap-2 px-3 py-2 font-mono text-[11px] tracking-wide transition-colors";
950
+ const inner = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
951
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: "\u2192" }),
952
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: item.label }),
953
+ item.external ? /* @__PURE__ */ jsxRuntime.jsx(
954
+ "span",
955
+ {
956
+ className: "text-muted-foreground/70 text-[10px]",
957
+ "aria-hidden": true,
958
+ children: "\u2197"
959
+ }
960
+ ) : null
961
+ ] });
962
+ return item.external ? /* @__PURE__ */ jsxRuntime.jsx(
963
+ "a",
964
+ {
965
+ href: item.href,
966
+ target: "_blank",
967
+ rel: "noreferrer",
968
+ onClick,
969
+ role: "menuitem",
970
+ className: cls,
971
+ "data-oc-account-menu-item": "",
972
+ children: inner
973
+ },
974
+ item.href
975
+ ) : /* @__PURE__ */ jsxRuntime.jsx(
976
+ Link5__default.default,
977
+ {
978
+ href: item.href,
979
+ onClick,
980
+ role: "menuitem",
981
+ className: cls,
982
+ "data-oc-account-menu-item": "",
983
+ children: inner
984
+ },
985
+ item.href
986
+ );
987
+ }),
988
+ familyDashboardEnabled ? /* @__PURE__ */ jsxRuntime.jsxs(
989
+ "a",
990
+ {
991
+ href: "https://ochk.io/dashboard",
992
+ target: "_blank",
993
+ rel: "noreferrer",
994
+ onClick: () => setOpen(false),
995
+ role: "menuitem",
996
+ className: "hover:bg-accent flex items-center gap-2 px-3 py-2 font-mono text-[11px] tracking-wide transition-colors",
997
+ "data-oc-account-menu-item": "",
998
+ "data-oc-account-menu-family-dashboard": "",
999
+ children: [
1000
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: "\u2192" }),
1001
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: "family dashboard" }),
1002
+ /* @__PURE__ */ jsxRuntime.jsx(
1003
+ "span",
1004
+ {
1005
+ className: "text-muted-foreground/70 text-[10px]",
1006
+ "aria-hidden": true,
1007
+ children: "\u2197"
1008
+ }
1009
+ )
1010
+ ]
1011
+ }
1012
+ ) : null,
1013
+ /* @__PURE__ */ jsxRuntime.jsxs(
1014
+ "button",
1015
+ {
1016
+ type: "button",
1017
+ role: "menuitem",
1018
+ onClick: () => {
1019
+ setOpen(false);
1020
+ void (async () => {
1021
+ await signOut();
1022
+ if (typeof window !== "undefined") {
1023
+ window.location.assign(signOutRedirect);
1024
+ }
1025
+ })();
1026
+ },
1027
+ className: "hover:bg-accent flex w-full items-center gap-2 px-3 py-2 text-left font-mono text-[11px] tracking-wide transition-colors",
1028
+ "data-oc-account-menu-item": "",
1029
+ "data-oc-account-menu-signout": "",
1030
+ children: [
1031
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: "\u2192" }),
1032
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: "sign out" })
1033
+ ]
1034
+ }
1035
+ )
1036
+ ] }),
1037
+ secondaryNavLinks && secondaryNavLinks.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
1038
+ PopoverSection,
1039
+ {
1040
+ label: "more",
1041
+ items: secondaryNavLinks,
1042
+ onItemClick: () => setOpen(false),
1043
+ bordered: true
1044
+ }
1045
+ ) : null,
1046
+ build ? /* @__PURE__ */ jsxRuntime.jsx(BuildFooter, { hostname, build, state: siteState }) : null
1047
+ ]
1048
+ }
1049
+ )
1050
+ ]
1051
+ }
1052
+ );
1053
+ }
1054
+ function AccountsSection({
1055
+ roster,
1056
+ switchAccount,
1057
+ addAccountUrl,
1058
+ signOut,
1059
+ onActionStart
1060
+ }) {
1061
+ const [switching, setSwitching] = react.useState(null);
1062
+ const [err, setErr] = react.useState(null);
1063
+ if (!addAccountUrl) return null;
1064
+ const onSwitch = async (didOc) => {
1065
+ if (!switchAccount || switching) return;
1066
+ setSwitching(didOc);
1067
+ setErr(null);
1068
+ try {
1069
+ await switchAccount(didOc);
1070
+ } catch (e) {
1071
+ setErr(e instanceof Error ? e.message : "switch failed");
1072
+ } finally {
1073
+ setSwitching(null);
1074
+ }
1075
+ };
1076
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-border border-b p-1", "data-oc-account-menu-section": "accounts", children: [
1077
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/60 px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 accounts" }),
1078
+ roster.map((peer) => /* @__PURE__ */ jsxRuntime.jsx(
1079
+ SwitchRow,
1080
+ {
1081
+ peer,
1082
+ busy: switching === peer.didOc,
1083
+ disabled: switching !== null,
1084
+ onSwitch: () => void onSwitch(peer.didOc)
1085
+ },
1086
+ peer.didOc
1087
+ )),
1088
+ /* @__PURE__ */ jsxRuntime.jsxs(
1089
+ "a",
1090
+ {
1091
+ href: addAccountUrl(),
1092
+ onClick: () => onActionStart(),
1093
+ role: "menuitem",
1094
+ "data-oc-account-menu-add-account": "",
1095
+ className: "hover:bg-accent flex items-center gap-2 px-3 py-2 font-mono text-[11px] tracking-wide transition-colors",
1096
+ children: [
1097
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "text-muted-foreground size-3.5 shrink-0", "aria-hidden": true }),
1098
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: roster.length === 0 ? "add another account" : "add another" })
1099
+ ]
1100
+ }
1101
+ ),
1102
+ roster.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(
1103
+ "button",
1104
+ {
1105
+ type: "button",
1106
+ role: "menuitem",
1107
+ onClick: () => {
1108
+ onActionStart();
1109
+ void (async () => {
1110
+ try {
1111
+ await signOut({ scope: "current" });
1112
+ } catch {
1113
+ }
1114
+ })();
1115
+ },
1116
+ "data-oc-account-menu-leave-current": "",
1117
+ className: "hover:bg-accent flex w-full items-center gap-2 px-3 py-2 text-left font-mono text-[11px] tracking-wide transition-colors",
1118
+ children: [
1119
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: "\u2192" }),
1120
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: "leave this account" })
1121
+ ]
1122
+ }
1123
+ ) : null,
1124
+ err ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-destructive/80 px-3 pt-1 pb-2 font-mono text-[10px]", children: err }) : null
1125
+ ] });
1126
+ }
1127
+ function SwitchRow({
1128
+ peer,
1129
+ busy,
1130
+ disabled,
1131
+ onSwitch
1132
+ }) {
1133
+ const label = peer.displayName ?? obscureIdentity(peer.displayIdentity.value);
1134
+ const kindLabel = IDENTITY_KIND_LABEL[peer.displayIdentity.kind];
1135
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1136
+ "button",
1137
+ {
1138
+ type: "button",
1139
+ role: "menuitemradio",
1140
+ "aria-checked": false,
1141
+ "aria-label": `Switch to ${peer.didOc}`,
1142
+ disabled,
1143
+ onClick: onSwitch,
1144
+ "data-oc-account-menu-switch-row": "",
1145
+ className: "hover:bg-accent flex w-full items-center gap-2 px-3 py-2 text-left font-mono text-[11px] tracking-wide transition-colors disabled:cursor-default",
1146
+ children: [
1147
+ /* @__PURE__ */ jsxRuntime.jsx(
1148
+ "span",
1149
+ {
1150
+ className: "border-muted-foreground/40 flex size-3.5 shrink-0 items-center justify-center rounded-full border",
1151
+ "aria-hidden": true
1152
+ }
1153
+ ),
1154
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground/90 min-w-0 flex-1 truncate", children: label }),
1155
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground/50 w-14 shrink-0 text-right text-[9px] tracking-widest uppercase", children: busy ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "ml-auto size-3 animate-spin" }) : kindLabel })
1156
+ ]
1157
+ }
1158
+ );
1159
+ }
1160
+ function PopoverSection({
1161
+ label,
1162
+ items,
1163
+ onItemClick,
1164
+ bordered
1165
+ }) {
1166
+ const cls = "hover:bg-accent flex items-center gap-2 px-3 py-2 font-mono text-[11px] tracking-wide transition-colors";
1167
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1168
+ "div",
1169
+ {
1170
+ className: "p-1 " + (bordered ? "border-border border-t" : ""),
1171
+ "data-oc-account-menu-section": label,
1172
+ children: [
1173
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-muted-foreground/60 px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: [
1174
+ "\xA7 ",
1175
+ label
1176
+ ] }),
1177
+ items.map((item) => {
1178
+ const inner = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1179
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: "\u2192" }),
1180
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: item.label }),
1181
+ item.external ? /* @__PURE__ */ jsxRuntime.jsx(
1182
+ "span",
1183
+ {
1184
+ className: "text-muted-foreground/70 text-[10px]",
1185
+ "aria-hidden": true,
1186
+ children: "\u2197"
1187
+ }
1188
+ ) : null
1189
+ ] });
1190
+ return item.external ? /* @__PURE__ */ jsxRuntime.jsx(
1191
+ "a",
1192
+ {
1193
+ href: item.href,
1194
+ target: "_blank",
1195
+ rel: "noreferrer",
1196
+ onClick: onItemClick,
1197
+ role: "menuitem",
1198
+ className: cls,
1199
+ "data-oc-account-menu-item": "",
1200
+ children: inner
1201
+ },
1202
+ item.href
1203
+ ) : /* @__PURE__ */ jsxRuntime.jsx(
1204
+ Link5__default.default,
1205
+ {
1206
+ href: item.href,
1207
+ onClick: onItemClick,
1208
+ role: "menuitem",
1209
+ className: cls,
1210
+ "data-oc-account-menu-item": "",
1211
+ children: inner
1212
+ },
1213
+ item.href
1214
+ );
1215
+ })
1216
+ ]
1217
+ }
1218
+ );
1219
+ }
1220
+ function BuildFooter({
1221
+ hostname,
1222
+ build,
1223
+ state
1224
+ }) {
1225
+ const sha = build.sha;
1226
+ const showSha = !!sha && sha !== "dev";
1227
+ const commitUrl = showSha && build.repo ? `https://github.com/${build.repo}/commit/${sha}` : null;
1228
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1229
+ "div",
1230
+ {
1231
+ className: "text-muted-foreground/60 border-border border-t px-3 py-2 font-mono text-[9.5px] tracking-widest uppercase",
1232
+ "data-oc-account-menu-build": "",
1233
+ children: [
1234
+ hostname,
1235
+ state && state !== "live" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1236
+ " \xB7 ",
1237
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground/80", children: state })
1238
+ ] }) : null,
1239
+ " ",
1240
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground/80", children: [
1241
+ "v",
1242
+ build.version,
1243
+ showSha ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1244
+ " \xB7 ",
1245
+ commitUrl ? /* @__PURE__ */ jsxRuntime.jsx(
1246
+ "a",
1247
+ {
1248
+ href: commitUrl,
1249
+ target: "_blank",
1250
+ rel: "noreferrer",
1251
+ className: "hover:text-foreground/90 underline decoration-dotted underline-offset-2",
1252
+ children: sha
1253
+ }
1254
+ ) : sha
1255
+ ] }) : null
1256
+ ] })
1257
+ ]
1258
+ }
1259
+ );
1260
+ }
1261
+ function isActive(pathname, link) {
1262
+ if (link.external) return false;
1263
+ if (link.matchExact) return pathname === link.href;
1264
+ if (link.href === "/") return pathname === "/";
1265
+ return pathname === link.href || pathname.startsWith(link.href + "/");
1266
+ }
1267
+ function OcPrimaryNav({ activePath, links, className }) {
1268
+ return /* @__PURE__ */ jsxRuntime.jsx(
1269
+ "nav",
1270
+ {
1271
+ "aria-label": "primary",
1272
+ className: "flex min-w-0 items-center justify-start overflow-x-auto gap-0.5 sm:gap-1 whitespace-nowrap [scrollbar-width:none] [&::-webkit-scrollbar]:hidden " + (className ?? ""),
1273
+ "data-oc-primary-nav": "",
1274
+ children: links.map((link) => {
1275
+ const active = isActive(activePath, link);
1276
+ const className2 = "font-display relative shrink-0 px-2 py-1 sm:px-3 text-[11px] sm:text-[12px] font-semibold tracking-wider uppercase transition-colors " + (active ? 'text-primary after:bg-primary after:absolute after:inset-x-2 after:-bottom-[13px] after:h-px after:content-[""]' : "text-muted-foreground hover:text-foreground");
1277
+ const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1278
+ link.label,
1279
+ link.external ? /* @__PURE__ */ jsxRuntime.jsx(
1280
+ "span",
1281
+ {
1282
+ "aria-hidden": true,
1283
+ className: "text-muted-foreground/60 ml-1 text-[9px]",
1284
+ children: "\u2197"
1285
+ }
1286
+ ) : null
1287
+ ] });
1288
+ return link.external ? /* @__PURE__ */ jsxRuntime.jsx(
1289
+ "a",
1290
+ {
1291
+ href: link.href,
1292
+ target: "_blank",
1293
+ rel: "noreferrer",
1294
+ className: className2,
1295
+ "data-oc-primary-nav-item": "",
1296
+ children: content
1297
+ },
1298
+ link.href
1299
+ ) : /* @__PURE__ */ jsxRuntime.jsx(
1300
+ Link5__default.default,
1301
+ {
1302
+ href: link.href,
1303
+ "aria-current": active ? "page" : void 0,
1304
+ className: className2,
1305
+ "data-oc-primary-nav-item": active ? "active" : "sibling",
1306
+ children: content
1307
+ },
1308
+ link.href
1309
+ );
1310
+ })
1311
+ }
1312
+ );
1313
+ }
1314
+ function OcDashboardShell({
1315
+ rootHref = "/dashboard",
1316
+ siteLabel,
1317
+ tools,
1318
+ active,
1319
+ eyebrow,
1320
+ title,
1321
+ description,
1322
+ children,
1323
+ className
1324
+ }) {
1325
+ const [drawerOpen, setDrawerOpen] = react.useState(false);
1326
+ react.useEffect(() => {
1327
+ if (!drawerOpen) return;
1328
+ function onKey(e) {
1329
+ if (e.key === "Escape") setDrawerOpen(false);
1330
+ }
1331
+ document.addEventListener("keydown", onKey);
1332
+ const prevOverflow = document.body.style.overflow;
1333
+ document.body.style.overflow = "hidden";
1334
+ return () => {
1335
+ document.removeEventListener("keydown", onKey);
1336
+ document.body.style.overflow = prevOverflow;
1337
+ };
1338
+ }, [drawerOpen]);
1339
+ const hasHeader = Boolean(title) || Boolean(eyebrow);
1340
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1341
+ "div",
1342
+ {
1343
+ className: "container " + (className ?? ""),
1344
+ "data-oc-dashboard-shell": "",
1345
+ children: [
1346
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-[calc(100vh-3rem)] flex-col md:flex-row md:gap-8", children: [
1347
+ /* @__PURE__ */ jsxRuntime.jsx(
1348
+ Sidebar,
1349
+ {
1350
+ rootHref,
1351
+ siteLabel,
1352
+ tools,
1353
+ active,
1354
+ variant: "desktop"
1355
+ }
1356
+ ),
1357
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
1358
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-border flex items-center justify-between border-b py-3 md:hidden", children: [
1359
+ /* @__PURE__ */ jsxRuntime.jsxs(
1360
+ "button",
1361
+ {
1362
+ type: "button",
1363
+ onClick: () => setDrawerOpen(true),
1364
+ className: "text-muted-foreground hover:text-foreground inline-flex h-9 items-center gap-2 px-1 font-mono text-[11px] tracking-widest uppercase transition-colors",
1365
+ "aria-label": "open dashboard tools",
1366
+ "aria-expanded": drawerOpen,
1367
+ "data-oc-dashboard-mobile-trigger": "",
1368
+ children: [
1369
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[14px] leading-none", children: "\u2261" }),
1370
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "tools" })
1371
+ ]
1372
+ }
1373
+ ),
1374
+ /* @__PURE__ */ jsxRuntime.jsx(
1375
+ Link5__default.default,
1376
+ {
1377
+ href: rootHref,
1378
+ className: "text-primary font-mono text-[11px] tracking-widest uppercase",
1379
+ children: "\xA7 dashboard"
1380
+ }
1381
+ )
1382
+ ] }),
1383
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-6 md:pt-3", children: [
1384
+ hasHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-3xl", children: [
1385
+ eyebrow ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "label-mono text-primary mb-3 font-mono text-[10px] tracking-widest uppercase", children: eyebrow }) : null,
1386
+ title ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "font-display text-2xl font-bold tracking-tight sm:text-3xl", children: title }) : null,
1387
+ description ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground mt-3 max-w-[64ch] text-sm leading-relaxed", children: description }) : null
1388
+ ] }),
1389
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: hasHeader ? "mt-8 pb-12" : "pb-12", children })
1390
+ ] })
1391
+ ] })
1392
+ ] }),
1393
+ drawerOpen ? /* @__PURE__ */ jsxRuntime.jsxs(
1394
+ "div",
1395
+ {
1396
+ className: "fixed inset-0 z-50 md:hidden",
1397
+ role: "dialog",
1398
+ "aria-modal": "true",
1399
+ "aria-label": "dashboard tools",
1400
+ "data-oc-dashboard-drawer": "",
1401
+ children: [
1402
+ /* @__PURE__ */ jsxRuntime.jsx(
1403
+ "div",
1404
+ {
1405
+ className: "absolute inset-0 bg-background/80 backdrop-blur-sm",
1406
+ onClick: () => setDrawerOpen(false),
1407
+ "aria-hidden": true
1408
+ }
1409
+ ),
1410
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-background absolute top-0 left-0 h-full w-[85vw] max-w-sm border-r shadow-xl", children: /* @__PURE__ */ jsxRuntime.jsx(
1411
+ Sidebar,
1412
+ {
1413
+ rootHref,
1414
+ siteLabel,
1415
+ tools,
1416
+ active,
1417
+ variant: "drawer",
1418
+ onClose: () => setDrawerOpen(false)
1419
+ }
1420
+ ) })
1421
+ ]
1422
+ }
1423
+ ) : null
1424
+ ]
1425
+ }
1426
+ );
1427
+ }
1428
+ function Sidebar({
1429
+ rootHref,
1430
+ siteLabel,
1431
+ tools,
1432
+ active,
1433
+ variant,
1434
+ onClose
1435
+ }) {
1436
+ const isDrawer = variant === "drawer";
1437
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1438
+ "aside",
1439
+ {
1440
+ className: isDrawer ? "flex h-full w-full flex-col bg-card" : "hidden md:sticky md:top-4 md:flex md:h-[calc(100vh-2rem)] md:w-56 md:shrink-0 md:flex-col md:self-start md:overflow-y-auto md:rounded md:border md:bg-card/40 lg:w-60",
1441
+ "aria-label": "dashboard tools",
1442
+ "data-oc-dashboard-sidebar": variant,
1443
+ children: [
1444
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b px-4 py-3", children: [
1445
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
1446
+ /* @__PURE__ */ jsxRuntime.jsx(
1447
+ Link5__default.default,
1448
+ {
1449
+ href: rootHref,
1450
+ onClick: onClose,
1451
+ className: "hover:text-foreground font-display text-sm font-bold tracking-tight",
1452
+ children: "\xA7 dashboard"
1453
+ }
1454
+ ),
1455
+ isDrawer ? /* @__PURE__ */ jsxRuntime.jsx(
1456
+ "button",
1457
+ {
1458
+ type: "button",
1459
+ onClick: onClose,
1460
+ className: "text-muted-foreground hover:text-foreground -mr-2 inline-flex h-8 w-8 items-center justify-center rounded font-mono text-lg",
1461
+ "aria-label": "close navigation",
1462
+ children: "\xD7"
1463
+ }
1464
+ ) : null
1465
+ ] }),
1466
+ siteLabel ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/70 mt-1 font-mono text-[10px] tracking-widest uppercase", children: siteLabel }) : null
1467
+ ] }),
1468
+ /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "flex-1 overflow-y-auto px-2 py-3", children: [
1469
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/60 mb-1 px-3 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 tools" }),
1470
+ /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-0.5", children: tools.map((tool) => {
1471
+ const isActive2 = tool.id === active;
1472
+ const innerCls = "flex items-baseline gap-2 rounded px-3 py-1.5 text-[12.5px] transition-colors " + (isActive2 ? "bg-primary/10 text-primary font-semibold" : "text-muted-foreground hover:text-foreground hover:bg-muted/30");
1473
+ const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1474
+ tool.icon ? /* @__PURE__ */ jsxRuntime.jsx(
1475
+ "span",
1476
+ {
1477
+ className: "shrink-0 font-mono text-[11px] " + (isActive2 ? "text-primary" : "text-muted-foreground/70"),
1478
+ "aria-hidden": true,
1479
+ children: tool.icon
1480
+ }
1481
+ ) : null,
1482
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex-1 leading-tight", children: [
1483
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: tool.label }),
1484
+ tool.tagline ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground/60 mt-0.5 block font-mono text-[10px] tracking-wide normal-case", children: tool.tagline }) : null
1485
+ ] }),
1486
+ tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
1487
+ "span",
1488
+ {
1489
+ className: "text-muted-foreground/60 text-[10px]",
1490
+ "aria-hidden": true,
1491
+ children: "\u2197"
1492
+ }
1493
+ ) : null
1494
+ ] });
1495
+ return /* @__PURE__ */ jsxRuntime.jsx("li", { children: tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
1496
+ "a",
1497
+ {
1498
+ href: tool.href,
1499
+ target: "_blank",
1500
+ rel: "noreferrer",
1501
+ onClick: onClose,
1502
+ className: innerCls,
1503
+ "data-oc-dashboard-tool": isActive2 ? "active" : "sibling",
1504
+ children: content
1505
+ }
1506
+ ) : /* @__PURE__ */ jsxRuntime.jsx(
1507
+ Link5__default.default,
1508
+ {
1509
+ href: tool.href,
1510
+ onClick: onClose,
1511
+ "aria-current": isActive2 ? "page" : void 0,
1512
+ className: innerCls,
1513
+ "data-oc-dashboard-tool": isActive2 ? "active" : "sibling",
1514
+ children: content
1515
+ }
1516
+ ) }, tool.id);
1517
+ }) })
1518
+ ] })
1519
+ ]
1520
+ }
1521
+ );
1522
+ }
1523
+ function OcDashboardHub({ tools, className }) {
1524
+ return /* @__PURE__ */ jsxRuntime.jsx(
1525
+ "ul",
1526
+ {
1527
+ className: "grid gap-px border-t border-l sm:grid-cols-2 " + (className ?? ""),
1528
+ "data-oc-dashboard-hub": "",
1529
+ children: tools.map((tool) => {
1530
+ const content = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex h-full flex-col gap-3 p-5 transition-colors", children: [
1531
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-baseline gap-3", children: [
1532
+ tool.icon ? /* @__PURE__ */ jsxRuntime.jsx(
1533
+ "span",
1534
+ {
1535
+ className: "text-primary font-mono text-[13px]",
1536
+ "aria-hidden": true,
1537
+ children: tool.icon
1538
+ }
1539
+ ) : null,
1540
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-display text-foreground text-base font-bold tracking-tight", children: tool.label }),
1541
+ tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
1542
+ "span",
1543
+ {
1544
+ className: "text-muted-foreground/60 ml-auto text-xs",
1545
+ "aria-hidden": true,
1546
+ children: "\u2197"
1547
+ }
1548
+ ) : /* @__PURE__ */ jsxRuntime.jsx(
1549
+ "span",
1550
+ {
1551
+ className: "text-muted-foreground/60 ml-auto text-xs",
1552
+ "aria-hidden": true,
1553
+ children: "\u2192"
1554
+ }
1555
+ )
1556
+ ] }),
1557
+ tool.tagline ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-sm leading-relaxed", children: tool.tagline }) : null
1558
+ ] });
1559
+ const cls = "hover:bg-muted/30 group block border-r border-b transition-colors";
1560
+ return /* @__PURE__ */ jsxRuntime.jsx("li", { children: tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
1561
+ "a",
1562
+ {
1563
+ href: tool.href,
1564
+ target: "_blank",
1565
+ rel: "noreferrer",
1566
+ className: cls,
1567
+ children: content
1568
+ }
1569
+ ) : /* @__PURE__ */ jsxRuntime.jsx(Link5__default.default, { href: tool.href, className: cls, children: content }) }, tool.id);
1570
+ })
1571
+ }
1572
+ );
1573
+ }
1574
+ function AppShell({
1575
+ eyebrow,
1576
+ title,
1577
+ description,
1578
+ headerActions,
1579
+ children,
1580
+ className
1581
+ }) {
1582
+ const hasHeader = Boolean(title);
1583
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "container " + (className ?? ""), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-h-[calc(100vh-3rem)] flex-col", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-w-0 flex-1 flex-col", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-6 md:pt-8", children: [
1584
+ hasHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between", children: [
1585
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-3xl", children: [
1586
+ eyebrow && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "label-mono text-primary mb-3", children: eyebrow }),
1587
+ /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "font-display text-2xl font-bold tracking-tight sm:text-3xl", children: title }),
1588
+ description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground mt-3 max-w-[64ch] text-sm leading-relaxed", children: description })
1589
+ ] }),
1590
+ headerActions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex shrink-0 items-center gap-2", children: headerActions })
1591
+ ] }),
1592
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: hasHeader ? "mt-8 pb-12" : "pb-12", children })
1593
+ ] }) }) }) });
1594
+ }
1595
+ function cn(...inputs) {
1596
+ return tailwindMerge.twMerge(clsx.clsx(inputs));
1597
+ }
1598
+ var HIDE = {
1599
+ sm: "hidden sm:inline",
1600
+ md: "hidden md:inline",
1601
+ lg: "hidden lg:inline"
1602
+ };
1603
+ function LayoutSubHeader({
1604
+ product,
1605
+ status = "live \xB7 mainnet",
1606
+ tags = [],
1607
+ noHeartbeat = false,
1608
+ className
1609
+ }) {
1610
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("border-b", className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "container flex flex-wrap items-center justify-between gap-x-6 gap-y-1 py-2 font-mono text-[11px]", children: [
1611
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
1612
+ !noHeartbeat && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-primary inline-block h-1.5 w-1.5 animate-pulse rounded-full" }),
1613
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground tracking-widest uppercase", children: status }),
1614
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground", children: product })
1615
+ ] }),
1616
+ tags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground flex flex-wrap items-center gap-x-4 gap-y-1 tracking-widest uppercase", children: tags.map((tag, i) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: tag.hideBelow ? HIDE[tag.hideBelow] : void 0, children: tag.label }, i)) })
1617
+ ] }) });
1618
+ }
1619
+
1620
+ exports.AppShell = AppShell;
1621
+ exports.EcosystemSwitcher = EcosystemSwitcher;
1622
+ exports.FAMILY_PROPERTIES = FAMILY_PROPERTIES;
1623
+ exports.LayoutSubHeader = LayoutSubHeader;
1624
+ exports.OcAccountMenu = OcAccountMenu;
1625
+ exports.OcAccountMenuView = OcAccountMenuView;
1626
+ exports.OcDashboardHub = OcDashboardHub;
1627
+ exports.OcDashboardShell = OcDashboardShell;
1628
+ exports.OcLogoDropdown = OcLogoDropdown;
1629
+ exports.OcPrimaryNav = OcPrimaryNav;
1630
+ exports.SITE_STATE_LABEL = SITE_STATE_LABEL;
1631
+ exports.findFamilyProperty = findFamilyProperty;
1632
+ //# sourceMappingURL=chrome.js.map
1633
+ //# sourceMappingURL=chrome.js.map