@orangecheck/ui 0.6.0 → 0.7.0
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/index.d.mts +54 -2
- package/dist/index.d.ts +54 -2
- package/dist/index.js +358 -23
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +354 -23
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -44,6 +44,15 @@ interface OcAccountMenuBuildInfo {
|
|
|
44
44
|
sha?: string;
|
|
45
45
|
repo?: string;
|
|
46
46
|
}
|
|
47
|
+
interface OcAccountMenuSession {
|
|
48
|
+
status: 'loading' | 'authenticated' | 'anonymous' | 'error';
|
|
49
|
+
account: {
|
|
50
|
+
didOc: string;
|
|
51
|
+
displayName: string | null;
|
|
52
|
+
} | null;
|
|
53
|
+
signOut: () => void | Promise<void>;
|
|
54
|
+
refresh: () => void | Promise<void>;
|
|
55
|
+
}
|
|
47
56
|
interface OcAccountMenuProps {
|
|
48
57
|
current: EcosystemSlug;
|
|
49
58
|
signInUrl?: string;
|
|
@@ -56,7 +65,50 @@ interface OcAccountMenuProps {
|
|
|
56
65
|
triggerClassName?: string;
|
|
57
66
|
popoverClassName?: string;
|
|
58
67
|
}
|
|
59
|
-
declare function OcAccountMenu(
|
|
68
|
+
declare function OcAccountMenu(props: OcAccountMenuProps): react_jsx_runtime.JSX.Element;
|
|
69
|
+
interface OcAccountMenuViewProps extends OcAccountMenuProps {
|
|
70
|
+
session: OcAccountMenuSession;
|
|
71
|
+
}
|
|
72
|
+
declare function OcAccountMenuView({ current, signInUrl, signInLabel, menuItems, showFamilyDashboard, build, siteState, className, triggerClassName, popoverClassName, session, }: OcAccountMenuViewProps): react_jsx_runtime.JSX.Element;
|
|
73
|
+
|
|
74
|
+
interface OcPrimaryNavLink {
|
|
75
|
+
href: string;
|
|
76
|
+
label: string;
|
|
77
|
+
external?: boolean;
|
|
78
|
+
matchExact?: boolean;
|
|
79
|
+
}
|
|
80
|
+
interface OcPrimaryNavProps {
|
|
81
|
+
activePath: string;
|
|
82
|
+
links: ReadonlyArray<OcPrimaryNavLink>;
|
|
83
|
+
className?: string;
|
|
84
|
+
}
|
|
85
|
+
declare function OcPrimaryNav({ activePath, links, className }: OcPrimaryNavProps): react_jsx_runtime.JSX.Element;
|
|
86
|
+
|
|
87
|
+
interface OcDashboardTool {
|
|
88
|
+
id: string;
|
|
89
|
+
href: string;
|
|
90
|
+
label: string;
|
|
91
|
+
tagline?: string;
|
|
92
|
+
icon?: ReactNode;
|
|
93
|
+
external?: boolean;
|
|
94
|
+
}
|
|
95
|
+
interface OcDashboardShellProps {
|
|
96
|
+
rootHref?: string;
|
|
97
|
+
siteLabel?: ReactNode;
|
|
98
|
+
tools: ReadonlyArray<OcDashboardTool>;
|
|
99
|
+
active?: string;
|
|
100
|
+
eyebrow?: ReactNode;
|
|
101
|
+
title?: ReactNode;
|
|
102
|
+
description?: ReactNode;
|
|
103
|
+
children: ReactNode;
|
|
104
|
+
className?: string;
|
|
105
|
+
}
|
|
106
|
+
declare function OcDashboardShell({ rootHref, siteLabel, tools, active, eyebrow, title, description, children, className, }: OcDashboardShellProps): react_jsx_runtime.JSX.Element;
|
|
107
|
+
interface OcDashboardHubProps {
|
|
108
|
+
tools: ReadonlyArray<OcDashboardTool>;
|
|
109
|
+
className?: string;
|
|
110
|
+
}
|
|
111
|
+
declare function OcDashboardHub({ tools, className }: OcDashboardHubProps): react_jsx_runtime.JSX.Element;
|
|
60
112
|
|
|
61
113
|
interface AppShellProps {
|
|
62
114
|
eyebrow?: ReactNode;
|
|
@@ -108,4 +160,4 @@ declare function StatTile({ children, ...item }: StatItem & {
|
|
|
108
160
|
children?: ReactNode;
|
|
109
161
|
}): react_jsx_runtime.JSX.Element;
|
|
110
162
|
|
|
111
|
-
export { AppShell, type AppShellProps, type EcosystemSlug, EcosystemSwitcher, type EcosystemSwitcherProps, EmptyState, type EmptyStateCta, type EmptyStateProps, FAMILY_PROPERTIES, type FamilyCategory, type FamilyProperty, OcAccountMenu, type OcAccountMenuBuildInfo, type OcAccountMenuItem, type OcAccountMenuProps, OcLogoDropdown, type OcLogoDropdownProps, SITE_STATE_LABEL, SectionHeader, type SectionHeaderProps, type SiteState, StatGrid, type StatGridProps, type StatItem, StatTile, findFamilyProperty };
|
|
163
|
+
export { AppShell, type AppShellProps, type EcosystemSlug, EcosystemSwitcher, type EcosystemSwitcherProps, EmptyState, type EmptyStateCta, type EmptyStateProps, FAMILY_PROPERTIES, type FamilyCategory, type FamilyProperty, OcAccountMenu, type OcAccountMenuBuildInfo, type OcAccountMenuItem, type OcAccountMenuProps, type OcAccountMenuSession, OcAccountMenuView, type OcAccountMenuViewProps, OcDashboardHub, type OcDashboardHubProps, OcDashboardShell, type OcDashboardShellProps, type OcDashboardTool, OcLogoDropdown, type OcLogoDropdownProps, OcPrimaryNav, type OcPrimaryNavLink, type OcPrimaryNavProps, SITE_STATE_LABEL, SectionHeader, type SectionHeaderProps, type SiteState, StatGrid, type StatGridProps, type StatItem, StatTile, findFamilyProperty };
|
package/dist/index.d.ts
CHANGED
|
@@ -44,6 +44,15 @@ interface OcAccountMenuBuildInfo {
|
|
|
44
44
|
sha?: string;
|
|
45
45
|
repo?: string;
|
|
46
46
|
}
|
|
47
|
+
interface OcAccountMenuSession {
|
|
48
|
+
status: 'loading' | 'authenticated' | 'anonymous' | 'error';
|
|
49
|
+
account: {
|
|
50
|
+
didOc: string;
|
|
51
|
+
displayName: string | null;
|
|
52
|
+
} | null;
|
|
53
|
+
signOut: () => void | Promise<void>;
|
|
54
|
+
refresh: () => void | Promise<void>;
|
|
55
|
+
}
|
|
47
56
|
interface OcAccountMenuProps {
|
|
48
57
|
current: EcosystemSlug;
|
|
49
58
|
signInUrl?: string;
|
|
@@ -56,7 +65,50 @@ interface OcAccountMenuProps {
|
|
|
56
65
|
triggerClassName?: string;
|
|
57
66
|
popoverClassName?: string;
|
|
58
67
|
}
|
|
59
|
-
declare function OcAccountMenu(
|
|
68
|
+
declare function OcAccountMenu(props: OcAccountMenuProps): react_jsx_runtime.JSX.Element;
|
|
69
|
+
interface OcAccountMenuViewProps extends OcAccountMenuProps {
|
|
70
|
+
session: OcAccountMenuSession;
|
|
71
|
+
}
|
|
72
|
+
declare function OcAccountMenuView({ current, signInUrl, signInLabel, menuItems, showFamilyDashboard, build, siteState, className, triggerClassName, popoverClassName, session, }: OcAccountMenuViewProps): react_jsx_runtime.JSX.Element;
|
|
73
|
+
|
|
74
|
+
interface OcPrimaryNavLink {
|
|
75
|
+
href: string;
|
|
76
|
+
label: string;
|
|
77
|
+
external?: boolean;
|
|
78
|
+
matchExact?: boolean;
|
|
79
|
+
}
|
|
80
|
+
interface OcPrimaryNavProps {
|
|
81
|
+
activePath: string;
|
|
82
|
+
links: ReadonlyArray<OcPrimaryNavLink>;
|
|
83
|
+
className?: string;
|
|
84
|
+
}
|
|
85
|
+
declare function OcPrimaryNav({ activePath, links, className }: OcPrimaryNavProps): react_jsx_runtime.JSX.Element;
|
|
86
|
+
|
|
87
|
+
interface OcDashboardTool {
|
|
88
|
+
id: string;
|
|
89
|
+
href: string;
|
|
90
|
+
label: string;
|
|
91
|
+
tagline?: string;
|
|
92
|
+
icon?: ReactNode;
|
|
93
|
+
external?: boolean;
|
|
94
|
+
}
|
|
95
|
+
interface OcDashboardShellProps {
|
|
96
|
+
rootHref?: string;
|
|
97
|
+
siteLabel?: ReactNode;
|
|
98
|
+
tools: ReadonlyArray<OcDashboardTool>;
|
|
99
|
+
active?: string;
|
|
100
|
+
eyebrow?: ReactNode;
|
|
101
|
+
title?: ReactNode;
|
|
102
|
+
description?: ReactNode;
|
|
103
|
+
children: ReactNode;
|
|
104
|
+
className?: string;
|
|
105
|
+
}
|
|
106
|
+
declare function OcDashboardShell({ rootHref, siteLabel, tools, active, eyebrow, title, description, children, className, }: OcDashboardShellProps): react_jsx_runtime.JSX.Element;
|
|
107
|
+
interface OcDashboardHubProps {
|
|
108
|
+
tools: ReadonlyArray<OcDashboardTool>;
|
|
109
|
+
className?: string;
|
|
110
|
+
}
|
|
111
|
+
declare function OcDashboardHub({ tools, className }: OcDashboardHubProps): react_jsx_runtime.JSX.Element;
|
|
60
112
|
|
|
61
113
|
interface AppShellProps {
|
|
62
114
|
eyebrow?: ReactNode;
|
|
@@ -108,4 +160,4 @@ declare function StatTile({ children, ...item }: StatItem & {
|
|
|
108
160
|
children?: ReactNode;
|
|
109
161
|
}): react_jsx_runtime.JSX.Element;
|
|
110
162
|
|
|
111
|
-
export { AppShell, type AppShellProps, type EcosystemSlug, EcosystemSwitcher, type EcosystemSwitcherProps, EmptyState, type EmptyStateCta, type EmptyStateProps, FAMILY_PROPERTIES, type FamilyCategory, type FamilyProperty, OcAccountMenu, type OcAccountMenuBuildInfo, type OcAccountMenuItem, type OcAccountMenuProps, OcLogoDropdown, type OcLogoDropdownProps, SITE_STATE_LABEL, SectionHeader, type SectionHeaderProps, type SiteState, StatGrid, type StatGridProps, type StatItem, StatTile, findFamilyProperty };
|
|
163
|
+
export { AppShell, type AppShellProps, type EcosystemSlug, EcosystemSwitcher, type EcosystemSwitcherProps, EmptyState, type EmptyStateCta, type EmptyStateProps, FAMILY_PROPERTIES, type FamilyCategory, type FamilyProperty, OcAccountMenu, type OcAccountMenuBuildInfo, type OcAccountMenuItem, type OcAccountMenuProps, type OcAccountMenuSession, OcAccountMenuView, type OcAccountMenuViewProps, OcDashboardHub, type OcDashboardHubProps, OcDashboardShell, type OcDashboardShellProps, type OcDashboardTool, OcLogoDropdown, type OcLogoDropdownProps, OcPrimaryNav, type OcPrimaryNavLink, type OcPrimaryNavProps, SITE_STATE_LABEL, SectionHeader, type SectionHeaderProps, type SiteState, StatGrid, type StatGridProps, type StatItem, StatTile, findFamilyProperty };
|
package/dist/index.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var lucideReact = require('lucide-react');
|
|
4
|
-
var
|
|
4
|
+
var Link5 = require('next/link');
|
|
5
5
|
var react = require('react');
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
7
7
|
var authClient = require('@orangecheck/auth-client');
|
|
8
8
|
|
|
9
9
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
10
|
|
|
11
|
-
var
|
|
11
|
+
var Link5__default = /*#__PURE__*/_interopDefault(Link5);
|
|
12
12
|
|
|
13
13
|
// src/ecosystem-switcher.tsx
|
|
14
14
|
var ENTRIES = [
|
|
@@ -143,30 +143,30 @@ function EcosystemSwitcher({
|
|
|
143
143
|
children: [
|
|
144
144
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "label-mono text-primary border-b px-4 py-2", children: "\xA7 the family" }),
|
|
145
145
|
/* @__PURE__ */ jsxRuntime.jsx("ul", { className: "py-1", children: ENTRIES.map((e) => {
|
|
146
|
-
const
|
|
146
|
+
const isActive2 = e.slug === current;
|
|
147
147
|
return /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
148
|
-
|
|
148
|
+
Link5__default.default,
|
|
149
149
|
{
|
|
150
150
|
href: e.href,
|
|
151
151
|
onClick: () => setOpen(false),
|
|
152
|
-
"aria-current":
|
|
153
|
-
className: "group flex items-baseline gap-3 px-4 py-2 transition-colors " + (
|
|
152
|
+
"aria-current": isActive2 ? "page" : void 0,
|
|
153
|
+
className: "group flex items-baseline gap-3 px-4 py-2 transition-colors " + (isActive2 ? "bg-primary/5" : "hover:bg-muted"),
|
|
154
154
|
children: [
|
|
155
155
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
156
156
|
"span",
|
|
157
157
|
{
|
|
158
|
-
className: "font-display flex-1 text-[12px] font-semibold tracking-tight " + (
|
|
158
|
+
className: "font-display flex-1 text-[12px] font-semibold tracking-tight " + (isActive2 ? "text-primary" : "text-foreground group-hover:text-primary transition-colors"),
|
|
159
159
|
children: e.label
|
|
160
160
|
}
|
|
161
161
|
),
|
|
162
162
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground font-mono text-[10px] tracking-wider uppercase", children: e.sub }),
|
|
163
|
-
|
|
163
|
+
isActive2 && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "text-primary h-3 w-3" })
|
|
164
164
|
]
|
|
165
165
|
}
|
|
166
166
|
) }, e.slug);
|
|
167
167
|
}) }),
|
|
168
168
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t px-4 py-2 font-mono text-[10px] tracking-widest uppercase", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
169
|
-
|
|
169
|
+
Link5__default.default,
|
|
170
170
|
{
|
|
171
171
|
href: "https://docs.ochk.io",
|
|
172
172
|
onClick: () => setOpen(false),
|
|
@@ -421,31 +421,31 @@ function OcLogoDropdown({
|
|
|
421
421
|
}
|
|
422
422
|
),
|
|
423
423
|
/* @__PURE__ */ jsxRuntime.jsx("ul", { role: "none", className: "pb-1", children: sectionEntries.map((e) => {
|
|
424
|
-
const
|
|
425
|
-
const href =
|
|
424
|
+
const isActive2 = e.slug === current;
|
|
425
|
+
const href = isActive2 ? homeHref : e.origin;
|
|
426
426
|
return /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
427
|
-
|
|
427
|
+
Link5__default.default,
|
|
428
428
|
{
|
|
429
429
|
href,
|
|
430
430
|
role: "menuitem",
|
|
431
431
|
onClick: () => setOpen(false),
|
|
432
|
-
"aria-current":
|
|
433
|
-
className: "group flex items-center gap-2 px-4 py-2 transition-colors " + (
|
|
434
|
-
"data-oc-logo-dropdown-item":
|
|
432
|
+
"aria-current": isActive2 ? "page" : void 0,
|
|
433
|
+
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"),
|
|
434
|
+
"data-oc-logo-dropdown-item": isActive2 ? "current" : "sibling",
|
|
435
435
|
"data-oc-entry-category": e.category,
|
|
436
436
|
children: [
|
|
437
437
|
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-1 flex-col leading-tight", children: [
|
|
438
438
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
439
439
|
"span",
|
|
440
440
|
{
|
|
441
|
-
className: "font-display text-[12px] font-semibold tracking-tight " + (
|
|
441
|
+
className: "font-display text-[12px] font-semibold tracking-tight " + (isActive2 ? "text-primary" : "text-foreground group-hover:text-primary transition-colors"),
|
|
442
442
|
children: e.label
|
|
443
443
|
}
|
|
444
444
|
),
|
|
445
445
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground mt-0.5 font-mono text-[10px] tracking-wide", children: e.sub })
|
|
446
446
|
] }),
|
|
447
447
|
/* @__PURE__ */ jsxRuntime.jsx(MenuCategoryChip, { category: e.category }),
|
|
448
|
-
|
|
448
|
+
isActive2 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-primary inline-flex shrink-0 items-center gap-1 font-mono text-[10px] tracking-widest uppercase", children: [
|
|
449
449
|
"home",
|
|
450
450
|
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-3 w-3" })
|
|
451
451
|
] }) : null
|
|
@@ -456,7 +456,7 @@ function OcLogoDropdown({
|
|
|
456
456
|
] }, category);
|
|
457
457
|
}) }),
|
|
458
458
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t px-4 py-2 font-mono text-[10px] tracking-widest uppercase", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
459
|
-
|
|
459
|
+
Link5__default.default,
|
|
460
460
|
{
|
|
461
461
|
href: "https://docs.ochk.io",
|
|
462
462
|
onClick: () => setOpen(false),
|
|
@@ -475,7 +475,25 @@ function shortenDid(s) {
|
|
|
475
475
|
if (s.length <= 14) return s;
|
|
476
476
|
return `${s.slice(0, 7)}\u2026${s.slice(-5)}`;
|
|
477
477
|
}
|
|
478
|
-
function OcAccountMenu({
|
|
478
|
+
function OcAccountMenu(props) {
|
|
479
|
+
const session = authClient.useOcSession();
|
|
480
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
481
|
+
OcAccountMenuView,
|
|
482
|
+
{
|
|
483
|
+
...props,
|
|
484
|
+
session: {
|
|
485
|
+
status: session.status,
|
|
486
|
+
account: session.account ? {
|
|
487
|
+
didOc: session.account.didOc,
|
|
488
|
+
displayName: session.account.displayName ?? null
|
|
489
|
+
} : null,
|
|
490
|
+
signOut: session.signOut,
|
|
491
|
+
refresh: session.refresh
|
|
492
|
+
}
|
|
493
|
+
}
|
|
494
|
+
);
|
|
495
|
+
}
|
|
496
|
+
function OcAccountMenuView({
|
|
479
497
|
current,
|
|
480
498
|
signInUrl = "/signin",
|
|
481
499
|
signInLabel = "sign in",
|
|
@@ -485,9 +503,9 @@ function OcAccountMenu({
|
|
|
485
503
|
siteState,
|
|
486
504
|
className,
|
|
487
505
|
triggerClassName,
|
|
488
|
-
popoverClassName
|
|
506
|
+
popoverClassName,
|
|
507
|
+
session
|
|
489
508
|
}) {
|
|
490
|
-
const session = authClient.useOcSession();
|
|
491
509
|
const { status, account, signOut, refresh } = session;
|
|
492
510
|
const [hydrated, setHydrated] = react.useState(false);
|
|
493
511
|
const [open, setOpen] = react.useState(false);
|
|
@@ -631,7 +649,7 @@ function OcAccountMenu({
|
|
|
631
649
|
},
|
|
632
650
|
item.href
|
|
633
651
|
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
634
|
-
|
|
652
|
+
Link5__default.default,
|
|
635
653
|
{
|
|
636
654
|
href: item.href,
|
|
637
655
|
onClick,
|
|
@@ -736,6 +754,319 @@ function BuildFooter({
|
|
|
736
754
|
}
|
|
737
755
|
);
|
|
738
756
|
}
|
|
757
|
+
function isActive(pathname, link) {
|
|
758
|
+
if (link.external) return false;
|
|
759
|
+
if (link.matchExact) return pathname === link.href;
|
|
760
|
+
if (link.href === "/") return pathname === "/";
|
|
761
|
+
return pathname === link.href || pathname.startsWith(link.href + "/");
|
|
762
|
+
}
|
|
763
|
+
function OcPrimaryNav({ activePath, links, className }) {
|
|
764
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
765
|
+
"nav",
|
|
766
|
+
{
|
|
767
|
+
"aria-label": "primary",
|
|
768
|
+
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 ?? ""),
|
|
769
|
+
"data-oc-primary-nav": "",
|
|
770
|
+
children: links.map((link) => {
|
|
771
|
+
const active = isActive(activePath, link);
|
|
772
|
+
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");
|
|
773
|
+
const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
774
|
+
link.label,
|
|
775
|
+
link.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
776
|
+
"span",
|
|
777
|
+
{
|
|
778
|
+
"aria-hidden": true,
|
|
779
|
+
className: "text-muted-foreground/60 ml-1 text-[9px]",
|
|
780
|
+
children: "\u2197"
|
|
781
|
+
}
|
|
782
|
+
) : null
|
|
783
|
+
] });
|
|
784
|
+
return link.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
785
|
+
"a",
|
|
786
|
+
{
|
|
787
|
+
href: link.href,
|
|
788
|
+
target: "_blank",
|
|
789
|
+
rel: "noreferrer",
|
|
790
|
+
className: className2,
|
|
791
|
+
"data-oc-primary-nav-item": "",
|
|
792
|
+
children: content
|
|
793
|
+
},
|
|
794
|
+
link.href
|
|
795
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
796
|
+
Link5__default.default,
|
|
797
|
+
{
|
|
798
|
+
href: link.href,
|
|
799
|
+
"aria-current": active ? "page" : void 0,
|
|
800
|
+
className: className2,
|
|
801
|
+
"data-oc-primary-nav-item": active ? "active" : "sibling",
|
|
802
|
+
children: content
|
|
803
|
+
},
|
|
804
|
+
link.href
|
|
805
|
+
);
|
|
806
|
+
})
|
|
807
|
+
}
|
|
808
|
+
);
|
|
809
|
+
}
|
|
810
|
+
function OcDashboardShell({
|
|
811
|
+
rootHref = "/dashboard",
|
|
812
|
+
siteLabel,
|
|
813
|
+
tools,
|
|
814
|
+
active,
|
|
815
|
+
eyebrow,
|
|
816
|
+
title,
|
|
817
|
+
description,
|
|
818
|
+
children,
|
|
819
|
+
className
|
|
820
|
+
}) {
|
|
821
|
+
const [drawerOpen, setDrawerOpen] = react.useState(false);
|
|
822
|
+
react.useEffect(() => {
|
|
823
|
+
if (!drawerOpen) return;
|
|
824
|
+
function onKey(e) {
|
|
825
|
+
if (e.key === "Escape") setDrawerOpen(false);
|
|
826
|
+
}
|
|
827
|
+
document.addEventListener("keydown", onKey);
|
|
828
|
+
const prevOverflow = document.body.style.overflow;
|
|
829
|
+
document.body.style.overflow = "hidden";
|
|
830
|
+
return () => {
|
|
831
|
+
document.removeEventListener("keydown", onKey);
|
|
832
|
+
document.body.style.overflow = prevOverflow;
|
|
833
|
+
};
|
|
834
|
+
}, [drawerOpen]);
|
|
835
|
+
const hasHeader = Boolean(title) || Boolean(eyebrow);
|
|
836
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
837
|
+
"div",
|
|
838
|
+
{
|
|
839
|
+
className: "container " + (className ?? ""),
|
|
840
|
+
"data-oc-dashboard-shell": "",
|
|
841
|
+
children: [
|
|
842
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-[calc(100vh-3rem)] flex-col md:flex-row md:gap-8", children: [
|
|
843
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
844
|
+
Sidebar,
|
|
845
|
+
{
|
|
846
|
+
rootHref,
|
|
847
|
+
siteLabel,
|
|
848
|
+
tools,
|
|
849
|
+
active,
|
|
850
|
+
variant: "desktop"
|
|
851
|
+
}
|
|
852
|
+
),
|
|
853
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
|
|
854
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-border flex items-center justify-between border-b py-3 md:hidden", children: [
|
|
855
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
856
|
+
"button",
|
|
857
|
+
{
|
|
858
|
+
type: "button",
|
|
859
|
+
onClick: () => setDrawerOpen(true),
|
|
860
|
+
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",
|
|
861
|
+
"aria-label": "open dashboard tools",
|
|
862
|
+
"aria-expanded": drawerOpen,
|
|
863
|
+
"data-oc-dashboard-mobile-trigger": "",
|
|
864
|
+
children: [
|
|
865
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[14px] leading-none", children: "\u2261" }),
|
|
866
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: "tools" })
|
|
867
|
+
]
|
|
868
|
+
}
|
|
869
|
+
),
|
|
870
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
871
|
+
Link5__default.default,
|
|
872
|
+
{
|
|
873
|
+
href: rootHref,
|
|
874
|
+
className: "text-primary font-mono text-[11px] tracking-widest uppercase",
|
|
875
|
+
children: "\xA7 dashboard"
|
|
876
|
+
}
|
|
877
|
+
)
|
|
878
|
+
] }),
|
|
879
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-6 md:pt-3", children: [
|
|
880
|
+
hasHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-3xl", children: [
|
|
881
|
+
eyebrow ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "label-mono text-primary mb-3 font-mono text-[10px] tracking-widest uppercase", children: eyebrow }) : null,
|
|
882
|
+
title ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "font-display text-2xl font-bold tracking-tight sm:text-3xl", children: title }) : null,
|
|
883
|
+
description ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground mt-3 max-w-[64ch] text-sm leading-relaxed", children: description }) : null
|
|
884
|
+
] }),
|
|
885
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: hasHeader ? "mt-8 pb-12" : "pb-12", children })
|
|
886
|
+
] })
|
|
887
|
+
] })
|
|
888
|
+
] }),
|
|
889
|
+
drawerOpen ? /* @__PURE__ */ jsxRuntime.jsxs(
|
|
890
|
+
"div",
|
|
891
|
+
{
|
|
892
|
+
className: "fixed inset-0 z-50 md:hidden",
|
|
893
|
+
role: "dialog",
|
|
894
|
+
"aria-modal": "true",
|
|
895
|
+
"aria-label": "dashboard tools",
|
|
896
|
+
"data-oc-dashboard-drawer": "",
|
|
897
|
+
children: [
|
|
898
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
899
|
+
"div",
|
|
900
|
+
{
|
|
901
|
+
className: "absolute inset-0 bg-background/80 backdrop-blur-sm",
|
|
902
|
+
onClick: () => setDrawerOpen(false),
|
|
903
|
+
"aria-hidden": true
|
|
904
|
+
}
|
|
905
|
+
),
|
|
906
|
+
/* @__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(
|
|
907
|
+
Sidebar,
|
|
908
|
+
{
|
|
909
|
+
rootHref,
|
|
910
|
+
siteLabel,
|
|
911
|
+
tools,
|
|
912
|
+
active,
|
|
913
|
+
variant: "drawer",
|
|
914
|
+
onClose: () => setDrawerOpen(false)
|
|
915
|
+
}
|
|
916
|
+
) })
|
|
917
|
+
]
|
|
918
|
+
}
|
|
919
|
+
) : null
|
|
920
|
+
]
|
|
921
|
+
}
|
|
922
|
+
);
|
|
923
|
+
}
|
|
924
|
+
function Sidebar({
|
|
925
|
+
rootHref,
|
|
926
|
+
siteLabel,
|
|
927
|
+
tools,
|
|
928
|
+
active,
|
|
929
|
+
variant,
|
|
930
|
+
onClose
|
|
931
|
+
}) {
|
|
932
|
+
const isDrawer = variant === "drawer";
|
|
933
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
934
|
+
"aside",
|
|
935
|
+
{
|
|
936
|
+
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",
|
|
937
|
+
"aria-label": "dashboard tools",
|
|
938
|
+
"data-oc-dashboard-sidebar": variant,
|
|
939
|
+
children: [
|
|
940
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b px-4 py-3", children: [
|
|
941
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
|
|
942
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
943
|
+
Link5__default.default,
|
|
944
|
+
{
|
|
945
|
+
href: rootHref,
|
|
946
|
+
onClick: onClose,
|
|
947
|
+
className: "hover:text-foreground font-display text-sm font-bold tracking-tight",
|
|
948
|
+
children: "\xA7 dashboard"
|
|
949
|
+
}
|
|
950
|
+
),
|
|
951
|
+
isDrawer ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
952
|
+
"button",
|
|
953
|
+
{
|
|
954
|
+
type: "button",
|
|
955
|
+
onClick: onClose,
|
|
956
|
+
className: "text-muted-foreground hover:text-foreground -mr-2 inline-flex h-8 w-8 items-center justify-center rounded font-mono text-lg",
|
|
957
|
+
"aria-label": "close navigation",
|
|
958
|
+
children: "\xD7"
|
|
959
|
+
}
|
|
960
|
+
) : null
|
|
961
|
+
] }),
|
|
962
|
+
siteLabel ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/70 mt-1 font-mono text-[10px] tracking-widest uppercase", children: siteLabel }) : null
|
|
963
|
+
] }),
|
|
964
|
+
/* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "flex-1 overflow-y-auto px-2 py-3", children: [
|
|
965
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/60 mb-1 px-3 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 tools" }),
|
|
966
|
+
/* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-0.5", children: tools.map((tool) => {
|
|
967
|
+
const isActive2 = tool.id === active;
|
|
968
|
+
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");
|
|
969
|
+
const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
970
|
+
tool.icon ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
971
|
+
"span",
|
|
972
|
+
{
|
|
973
|
+
className: "shrink-0 font-mono text-[11px] " + (isActive2 ? "text-primary" : "text-muted-foreground/70"),
|
|
974
|
+
"aria-hidden": true,
|
|
975
|
+
children: tool.icon
|
|
976
|
+
}
|
|
977
|
+
) : null,
|
|
978
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex-1 leading-tight", children: [
|
|
979
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: tool.label }),
|
|
980
|
+
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
|
|
981
|
+
] }),
|
|
982
|
+
tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
983
|
+
"span",
|
|
984
|
+
{
|
|
985
|
+
className: "text-muted-foreground/60 text-[10px]",
|
|
986
|
+
"aria-hidden": true,
|
|
987
|
+
children: "\u2197"
|
|
988
|
+
}
|
|
989
|
+
) : null
|
|
990
|
+
] });
|
|
991
|
+
return /* @__PURE__ */ jsxRuntime.jsx("li", { children: tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
992
|
+
"a",
|
|
993
|
+
{
|
|
994
|
+
href: tool.href,
|
|
995
|
+
target: "_blank",
|
|
996
|
+
rel: "noreferrer",
|
|
997
|
+
onClick: onClose,
|
|
998
|
+
className: innerCls,
|
|
999
|
+
"data-oc-dashboard-tool": isActive2 ? "active" : "sibling",
|
|
1000
|
+
children: content
|
|
1001
|
+
}
|
|
1002
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
1003
|
+
Link5__default.default,
|
|
1004
|
+
{
|
|
1005
|
+
href: tool.href,
|
|
1006
|
+
onClick: onClose,
|
|
1007
|
+
"aria-current": isActive2 ? "page" : void 0,
|
|
1008
|
+
className: innerCls,
|
|
1009
|
+
"data-oc-dashboard-tool": isActive2 ? "active" : "sibling",
|
|
1010
|
+
children: content
|
|
1011
|
+
}
|
|
1012
|
+
) }, tool.id);
|
|
1013
|
+
}) })
|
|
1014
|
+
] })
|
|
1015
|
+
]
|
|
1016
|
+
}
|
|
1017
|
+
);
|
|
1018
|
+
}
|
|
1019
|
+
function OcDashboardHub({ tools, className }) {
|
|
1020
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1021
|
+
"ul",
|
|
1022
|
+
{
|
|
1023
|
+
className: "grid gap-px border-t border-l sm:grid-cols-2 " + (className ?? ""),
|
|
1024
|
+
"data-oc-dashboard-hub": "",
|
|
1025
|
+
children: tools.map((tool) => {
|
|
1026
|
+
const content = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex h-full flex-col gap-3 p-5 transition-colors", children: [
|
|
1027
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-baseline gap-3", children: [
|
|
1028
|
+
tool.icon ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1029
|
+
"span",
|
|
1030
|
+
{
|
|
1031
|
+
className: "text-primary font-mono text-[13px]",
|
|
1032
|
+
"aria-hidden": true,
|
|
1033
|
+
children: tool.icon
|
|
1034
|
+
}
|
|
1035
|
+
) : null,
|
|
1036
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-display text-foreground text-base font-bold tracking-tight", children: tool.label }),
|
|
1037
|
+
tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1038
|
+
"span",
|
|
1039
|
+
{
|
|
1040
|
+
className: "text-muted-foreground/60 ml-auto text-xs",
|
|
1041
|
+
"aria-hidden": true,
|
|
1042
|
+
children: "\u2197"
|
|
1043
|
+
}
|
|
1044
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
1045
|
+
"span",
|
|
1046
|
+
{
|
|
1047
|
+
className: "text-muted-foreground/60 ml-auto text-xs",
|
|
1048
|
+
"aria-hidden": true,
|
|
1049
|
+
children: "\u2192"
|
|
1050
|
+
}
|
|
1051
|
+
)
|
|
1052
|
+
] }),
|
|
1053
|
+
tool.tagline ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-sm leading-relaxed", children: tool.tagline }) : null
|
|
1054
|
+
] });
|
|
1055
|
+
const cls = "hover:bg-muted/30 group block border-r border-b transition-colors";
|
|
1056
|
+
return /* @__PURE__ */ jsxRuntime.jsx("li", { children: tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1057
|
+
"a",
|
|
1058
|
+
{
|
|
1059
|
+
href: tool.href,
|
|
1060
|
+
target: "_blank",
|
|
1061
|
+
rel: "noreferrer",
|
|
1062
|
+
className: cls,
|
|
1063
|
+
children: content
|
|
1064
|
+
}
|
|
1065
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(Link5__default.default, { href: tool.href, className: cls, children: content }) }, tool.id);
|
|
1066
|
+
})
|
|
1067
|
+
}
|
|
1068
|
+
);
|
|
1069
|
+
}
|
|
739
1070
|
function AppShell({
|
|
740
1071
|
eyebrow,
|
|
741
1072
|
title,
|
|
@@ -819,7 +1150,7 @@ function CtaLink({
|
|
|
819
1150
|
if (external) {
|
|
820
1151
|
return /* @__PURE__ */ jsxRuntime.jsx("a", { href, target: "_blank", rel: "noreferrer", className: cls, children: text });
|
|
821
1152
|
}
|
|
822
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1153
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Link5__default.default, { href, className: cls, children: text });
|
|
823
1154
|
}
|
|
824
1155
|
var TONE_CLASS3 = {
|
|
825
1156
|
default: "",
|
|
@@ -864,7 +1195,11 @@ exports.EcosystemSwitcher = EcosystemSwitcher;
|
|
|
864
1195
|
exports.EmptyState = EmptyState;
|
|
865
1196
|
exports.FAMILY_PROPERTIES = FAMILY_PROPERTIES;
|
|
866
1197
|
exports.OcAccountMenu = OcAccountMenu;
|
|
1198
|
+
exports.OcAccountMenuView = OcAccountMenuView;
|
|
1199
|
+
exports.OcDashboardHub = OcDashboardHub;
|
|
1200
|
+
exports.OcDashboardShell = OcDashboardShell;
|
|
867
1201
|
exports.OcLogoDropdown = OcLogoDropdown;
|
|
1202
|
+
exports.OcPrimaryNav = OcPrimaryNav;
|
|
868
1203
|
exports.SITE_STATE_LABEL = SITE_STATE_LABEL;
|
|
869
1204
|
exports.SectionHeader = SectionHeader;
|
|
870
1205
|
exports.StatGrid = StatGrid;
|