@orangecheck/ui 0.6.1 → 0.8.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 +43 -2
- package/dist/index.d.ts +43 -2
- package/dist/index.js +417 -21
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +414 -21
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
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),
|
|
@@ -498,6 +498,8 @@ function OcAccountMenuView({
|
|
|
498
498
|
signInUrl = "/signin",
|
|
499
499
|
signInLabel = "sign in",
|
|
500
500
|
menuItems,
|
|
501
|
+
primaryNavLinks,
|
|
502
|
+
secondaryNavLinks,
|
|
501
503
|
showFamilyDashboard,
|
|
502
504
|
build,
|
|
503
505
|
siteState,
|
|
@@ -619,7 +621,16 @@ function OcAccountMenuView({
|
|
|
619
621
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-foreground/90 font-mono text-[11px] leading-tight break-all", children: account.didOc }),
|
|
620
622
|
displayName ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/80 mt-1 font-mono text-[10px] tracking-wide", children: displayName }) : null
|
|
621
623
|
] }),
|
|
622
|
-
/* @__PURE__ */ jsxRuntime.
|
|
624
|
+
primaryNavLinks && primaryNavLinks.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
625
|
+
PopoverSection,
|
|
626
|
+
{
|
|
627
|
+
label: "navigate",
|
|
628
|
+
items: primaryNavLinks,
|
|
629
|
+
onItemClick: () => setOpen(false)
|
|
630
|
+
}
|
|
631
|
+
) : null,
|
|
632
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-1", "data-oc-account-menu-section": "account", children: [
|
|
633
|
+
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,
|
|
623
634
|
menuItems?.map((item) => {
|
|
624
635
|
const onClick = () => setOpen(false);
|
|
625
636
|
const cls = "hover:bg-accent flex items-center gap-2 px-3 py-2 font-mono text-[11px] tracking-wide transition-colors";
|
|
@@ -649,7 +660,7 @@ function OcAccountMenuView({
|
|
|
649
660
|
},
|
|
650
661
|
item.href
|
|
651
662
|
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
652
|
-
|
|
663
|
+
Link5__default.default,
|
|
653
664
|
{
|
|
654
665
|
href: item.href,
|
|
655
666
|
onClick,
|
|
@@ -705,6 +716,15 @@ function OcAccountMenuView({
|
|
|
705
716
|
}
|
|
706
717
|
)
|
|
707
718
|
] }),
|
|
719
|
+
secondaryNavLinks && secondaryNavLinks.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
720
|
+
PopoverSection,
|
|
721
|
+
{
|
|
722
|
+
label: "more",
|
|
723
|
+
items: secondaryNavLinks,
|
|
724
|
+
onItemClick: () => setOpen(false),
|
|
725
|
+
bordered: true
|
|
726
|
+
}
|
|
727
|
+
) : null,
|
|
708
728
|
build ? /* @__PURE__ */ jsxRuntime.jsx(BuildFooter, { hostname, build, state: siteState }) : null
|
|
709
729
|
]
|
|
710
730
|
}
|
|
@@ -713,6 +733,66 @@ function OcAccountMenuView({
|
|
|
713
733
|
}
|
|
714
734
|
);
|
|
715
735
|
}
|
|
736
|
+
function PopoverSection({
|
|
737
|
+
label,
|
|
738
|
+
items,
|
|
739
|
+
onItemClick,
|
|
740
|
+
bordered
|
|
741
|
+
}) {
|
|
742
|
+
const cls = "hover:bg-accent flex items-center gap-2 px-3 py-2 font-mono text-[11px] tracking-wide transition-colors";
|
|
743
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
744
|
+
"div",
|
|
745
|
+
{
|
|
746
|
+
className: "p-1 " + (bordered ? "border-border border-t" : ""),
|
|
747
|
+
"data-oc-account-menu-section": label,
|
|
748
|
+
children: [
|
|
749
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-muted-foreground/60 px-3 pt-2 pb-1 font-mono text-[10px] tracking-widest uppercase", children: [
|
|
750
|
+
"\xA7 ",
|
|
751
|
+
label
|
|
752
|
+
] }),
|
|
753
|
+
items.map((item) => {
|
|
754
|
+
const inner = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
755
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: "\u2192" }),
|
|
756
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: item.label }),
|
|
757
|
+
item.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
758
|
+
"span",
|
|
759
|
+
{
|
|
760
|
+
className: "text-muted-foreground/70 text-[10px]",
|
|
761
|
+
"aria-hidden": true,
|
|
762
|
+
children: "\u2197"
|
|
763
|
+
}
|
|
764
|
+
) : null
|
|
765
|
+
] });
|
|
766
|
+
return item.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
767
|
+
"a",
|
|
768
|
+
{
|
|
769
|
+
href: item.href,
|
|
770
|
+
target: "_blank",
|
|
771
|
+
rel: "noreferrer",
|
|
772
|
+
onClick: onItemClick,
|
|
773
|
+
role: "menuitem",
|
|
774
|
+
className: cls,
|
|
775
|
+
"data-oc-account-menu-item": "",
|
|
776
|
+
children: inner
|
|
777
|
+
},
|
|
778
|
+
item.href
|
|
779
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
780
|
+
Link5__default.default,
|
|
781
|
+
{
|
|
782
|
+
href: item.href,
|
|
783
|
+
onClick: onItemClick,
|
|
784
|
+
role: "menuitem",
|
|
785
|
+
className: cls,
|
|
786
|
+
"data-oc-account-menu-item": "",
|
|
787
|
+
children: inner
|
|
788
|
+
},
|
|
789
|
+
item.href
|
|
790
|
+
);
|
|
791
|
+
})
|
|
792
|
+
]
|
|
793
|
+
}
|
|
794
|
+
);
|
|
795
|
+
}
|
|
716
796
|
function BuildFooter({
|
|
717
797
|
hostname,
|
|
718
798
|
build,
|
|
@@ -754,6 +834,319 @@ function BuildFooter({
|
|
|
754
834
|
}
|
|
755
835
|
);
|
|
756
836
|
}
|
|
837
|
+
function isActive(pathname, link) {
|
|
838
|
+
if (link.external) return false;
|
|
839
|
+
if (link.matchExact) return pathname === link.href;
|
|
840
|
+
if (link.href === "/") return pathname === "/";
|
|
841
|
+
return pathname === link.href || pathname.startsWith(link.href + "/");
|
|
842
|
+
}
|
|
843
|
+
function OcPrimaryNav({ activePath, links, className }) {
|
|
844
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
845
|
+
"nav",
|
|
846
|
+
{
|
|
847
|
+
"aria-label": "primary",
|
|
848
|
+
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 ?? ""),
|
|
849
|
+
"data-oc-primary-nav": "",
|
|
850
|
+
children: links.map((link) => {
|
|
851
|
+
const active = isActive(activePath, link);
|
|
852
|
+
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");
|
|
853
|
+
const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
854
|
+
link.label,
|
|
855
|
+
link.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
856
|
+
"span",
|
|
857
|
+
{
|
|
858
|
+
"aria-hidden": true,
|
|
859
|
+
className: "text-muted-foreground/60 ml-1 text-[9px]",
|
|
860
|
+
children: "\u2197"
|
|
861
|
+
}
|
|
862
|
+
) : null
|
|
863
|
+
] });
|
|
864
|
+
return link.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
865
|
+
"a",
|
|
866
|
+
{
|
|
867
|
+
href: link.href,
|
|
868
|
+
target: "_blank",
|
|
869
|
+
rel: "noreferrer",
|
|
870
|
+
className: className2,
|
|
871
|
+
"data-oc-primary-nav-item": "",
|
|
872
|
+
children: content
|
|
873
|
+
},
|
|
874
|
+
link.href
|
|
875
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
876
|
+
Link5__default.default,
|
|
877
|
+
{
|
|
878
|
+
href: link.href,
|
|
879
|
+
"aria-current": active ? "page" : void 0,
|
|
880
|
+
className: className2,
|
|
881
|
+
"data-oc-primary-nav-item": active ? "active" : "sibling",
|
|
882
|
+
children: content
|
|
883
|
+
},
|
|
884
|
+
link.href
|
|
885
|
+
);
|
|
886
|
+
})
|
|
887
|
+
}
|
|
888
|
+
);
|
|
889
|
+
}
|
|
890
|
+
function OcDashboardShell({
|
|
891
|
+
rootHref = "/dashboard",
|
|
892
|
+
siteLabel,
|
|
893
|
+
tools,
|
|
894
|
+
active,
|
|
895
|
+
eyebrow,
|
|
896
|
+
title,
|
|
897
|
+
description,
|
|
898
|
+
children,
|
|
899
|
+
className
|
|
900
|
+
}) {
|
|
901
|
+
const [drawerOpen, setDrawerOpen] = react.useState(false);
|
|
902
|
+
react.useEffect(() => {
|
|
903
|
+
if (!drawerOpen) return;
|
|
904
|
+
function onKey(e) {
|
|
905
|
+
if (e.key === "Escape") setDrawerOpen(false);
|
|
906
|
+
}
|
|
907
|
+
document.addEventListener("keydown", onKey);
|
|
908
|
+
const prevOverflow = document.body.style.overflow;
|
|
909
|
+
document.body.style.overflow = "hidden";
|
|
910
|
+
return () => {
|
|
911
|
+
document.removeEventListener("keydown", onKey);
|
|
912
|
+
document.body.style.overflow = prevOverflow;
|
|
913
|
+
};
|
|
914
|
+
}, [drawerOpen]);
|
|
915
|
+
const hasHeader = Boolean(title) || Boolean(eyebrow);
|
|
916
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
917
|
+
"div",
|
|
918
|
+
{
|
|
919
|
+
className: "container " + (className ?? ""),
|
|
920
|
+
"data-oc-dashboard-shell": "",
|
|
921
|
+
children: [
|
|
922
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-[calc(100vh-3rem)] flex-col md:flex-row md:gap-8", children: [
|
|
923
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
924
|
+
Sidebar,
|
|
925
|
+
{
|
|
926
|
+
rootHref,
|
|
927
|
+
siteLabel,
|
|
928
|
+
tools,
|
|
929
|
+
active,
|
|
930
|
+
variant: "desktop"
|
|
931
|
+
}
|
|
932
|
+
),
|
|
933
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
|
|
934
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-border flex items-center justify-between border-b py-3 md:hidden", children: [
|
|
935
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
936
|
+
"button",
|
|
937
|
+
{
|
|
938
|
+
type: "button",
|
|
939
|
+
onClick: () => setDrawerOpen(true),
|
|
940
|
+
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",
|
|
941
|
+
"aria-label": "open dashboard tools",
|
|
942
|
+
"aria-expanded": drawerOpen,
|
|
943
|
+
"data-oc-dashboard-mobile-trigger": "",
|
|
944
|
+
children: [
|
|
945
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[14px] leading-none", children: "\u2261" }),
|
|
946
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: "tools" })
|
|
947
|
+
]
|
|
948
|
+
}
|
|
949
|
+
),
|
|
950
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
951
|
+
Link5__default.default,
|
|
952
|
+
{
|
|
953
|
+
href: rootHref,
|
|
954
|
+
className: "text-primary font-mono text-[11px] tracking-widest uppercase",
|
|
955
|
+
children: "\xA7 dashboard"
|
|
956
|
+
}
|
|
957
|
+
)
|
|
958
|
+
] }),
|
|
959
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-6 md:pt-3", children: [
|
|
960
|
+
hasHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-3xl", children: [
|
|
961
|
+
eyebrow ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "label-mono text-primary mb-3 font-mono text-[10px] tracking-widest uppercase", children: eyebrow }) : null,
|
|
962
|
+
title ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "font-display text-2xl font-bold tracking-tight sm:text-3xl", children: title }) : null,
|
|
963
|
+
description ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground mt-3 max-w-[64ch] text-sm leading-relaxed", children: description }) : null
|
|
964
|
+
] }),
|
|
965
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: hasHeader ? "mt-8 pb-12" : "pb-12", children })
|
|
966
|
+
] })
|
|
967
|
+
] })
|
|
968
|
+
] }),
|
|
969
|
+
drawerOpen ? /* @__PURE__ */ jsxRuntime.jsxs(
|
|
970
|
+
"div",
|
|
971
|
+
{
|
|
972
|
+
className: "fixed inset-0 z-50 md:hidden",
|
|
973
|
+
role: "dialog",
|
|
974
|
+
"aria-modal": "true",
|
|
975
|
+
"aria-label": "dashboard tools",
|
|
976
|
+
"data-oc-dashboard-drawer": "",
|
|
977
|
+
children: [
|
|
978
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
979
|
+
"div",
|
|
980
|
+
{
|
|
981
|
+
className: "absolute inset-0 bg-background/80 backdrop-blur-sm",
|
|
982
|
+
onClick: () => setDrawerOpen(false),
|
|
983
|
+
"aria-hidden": true
|
|
984
|
+
}
|
|
985
|
+
),
|
|
986
|
+
/* @__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(
|
|
987
|
+
Sidebar,
|
|
988
|
+
{
|
|
989
|
+
rootHref,
|
|
990
|
+
siteLabel,
|
|
991
|
+
tools,
|
|
992
|
+
active,
|
|
993
|
+
variant: "drawer",
|
|
994
|
+
onClose: () => setDrawerOpen(false)
|
|
995
|
+
}
|
|
996
|
+
) })
|
|
997
|
+
]
|
|
998
|
+
}
|
|
999
|
+
) : null
|
|
1000
|
+
]
|
|
1001
|
+
}
|
|
1002
|
+
);
|
|
1003
|
+
}
|
|
1004
|
+
function Sidebar({
|
|
1005
|
+
rootHref,
|
|
1006
|
+
siteLabel,
|
|
1007
|
+
tools,
|
|
1008
|
+
active,
|
|
1009
|
+
variant,
|
|
1010
|
+
onClose
|
|
1011
|
+
}) {
|
|
1012
|
+
const isDrawer = variant === "drawer";
|
|
1013
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1014
|
+
"aside",
|
|
1015
|
+
{
|
|
1016
|
+
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",
|
|
1017
|
+
"aria-label": "dashboard tools",
|
|
1018
|
+
"data-oc-dashboard-sidebar": variant,
|
|
1019
|
+
children: [
|
|
1020
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b px-4 py-3", children: [
|
|
1021
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
|
|
1022
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1023
|
+
Link5__default.default,
|
|
1024
|
+
{
|
|
1025
|
+
href: rootHref,
|
|
1026
|
+
onClick: onClose,
|
|
1027
|
+
className: "hover:text-foreground font-display text-sm font-bold tracking-tight",
|
|
1028
|
+
children: "\xA7 dashboard"
|
|
1029
|
+
}
|
|
1030
|
+
),
|
|
1031
|
+
isDrawer ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1032
|
+
"button",
|
|
1033
|
+
{
|
|
1034
|
+
type: "button",
|
|
1035
|
+
onClick: onClose,
|
|
1036
|
+
className: "text-muted-foreground hover:text-foreground -mr-2 inline-flex h-8 w-8 items-center justify-center rounded font-mono text-lg",
|
|
1037
|
+
"aria-label": "close navigation",
|
|
1038
|
+
children: "\xD7"
|
|
1039
|
+
}
|
|
1040
|
+
) : null
|
|
1041
|
+
] }),
|
|
1042
|
+
siteLabel ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/70 mt-1 font-mono text-[10px] tracking-widest uppercase", children: siteLabel }) : null
|
|
1043
|
+
] }),
|
|
1044
|
+
/* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "flex-1 overflow-y-auto px-2 py-3", children: [
|
|
1045
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground/60 mb-1 px-3 font-mono text-[10px] tracking-widest uppercase", children: "\xA7 tools" }),
|
|
1046
|
+
/* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-0.5", children: tools.map((tool) => {
|
|
1047
|
+
const isActive2 = tool.id === active;
|
|
1048
|
+
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");
|
|
1049
|
+
const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1050
|
+
tool.icon ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1051
|
+
"span",
|
|
1052
|
+
{
|
|
1053
|
+
className: "shrink-0 font-mono text-[11px] " + (isActive2 ? "text-primary" : "text-muted-foreground/70"),
|
|
1054
|
+
"aria-hidden": true,
|
|
1055
|
+
children: tool.icon
|
|
1056
|
+
}
|
|
1057
|
+
) : null,
|
|
1058
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex-1 leading-tight", children: [
|
|
1059
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: tool.label }),
|
|
1060
|
+
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
|
|
1061
|
+
] }),
|
|
1062
|
+
tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1063
|
+
"span",
|
|
1064
|
+
{
|
|
1065
|
+
className: "text-muted-foreground/60 text-[10px]",
|
|
1066
|
+
"aria-hidden": true,
|
|
1067
|
+
children: "\u2197"
|
|
1068
|
+
}
|
|
1069
|
+
) : null
|
|
1070
|
+
] });
|
|
1071
|
+
return /* @__PURE__ */ jsxRuntime.jsx("li", { children: tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1072
|
+
"a",
|
|
1073
|
+
{
|
|
1074
|
+
href: tool.href,
|
|
1075
|
+
target: "_blank",
|
|
1076
|
+
rel: "noreferrer",
|
|
1077
|
+
onClick: onClose,
|
|
1078
|
+
className: innerCls,
|
|
1079
|
+
"data-oc-dashboard-tool": isActive2 ? "active" : "sibling",
|
|
1080
|
+
children: content
|
|
1081
|
+
}
|
|
1082
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
1083
|
+
Link5__default.default,
|
|
1084
|
+
{
|
|
1085
|
+
href: tool.href,
|
|
1086
|
+
onClick: onClose,
|
|
1087
|
+
"aria-current": isActive2 ? "page" : void 0,
|
|
1088
|
+
className: innerCls,
|
|
1089
|
+
"data-oc-dashboard-tool": isActive2 ? "active" : "sibling",
|
|
1090
|
+
children: content
|
|
1091
|
+
}
|
|
1092
|
+
) }, tool.id);
|
|
1093
|
+
}) })
|
|
1094
|
+
] })
|
|
1095
|
+
]
|
|
1096
|
+
}
|
|
1097
|
+
);
|
|
1098
|
+
}
|
|
1099
|
+
function OcDashboardHub({ tools, className }) {
|
|
1100
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1101
|
+
"ul",
|
|
1102
|
+
{
|
|
1103
|
+
className: "grid gap-px border-t border-l sm:grid-cols-2 " + (className ?? ""),
|
|
1104
|
+
"data-oc-dashboard-hub": "",
|
|
1105
|
+
children: tools.map((tool) => {
|
|
1106
|
+
const content = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex h-full flex-col gap-3 p-5 transition-colors", children: [
|
|
1107
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-baseline gap-3", children: [
|
|
1108
|
+
tool.icon ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1109
|
+
"span",
|
|
1110
|
+
{
|
|
1111
|
+
className: "text-primary font-mono text-[13px]",
|
|
1112
|
+
"aria-hidden": true,
|
|
1113
|
+
children: tool.icon
|
|
1114
|
+
}
|
|
1115
|
+
) : null,
|
|
1116
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-display text-foreground text-base font-bold tracking-tight", children: tool.label }),
|
|
1117
|
+
tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1118
|
+
"span",
|
|
1119
|
+
{
|
|
1120
|
+
className: "text-muted-foreground/60 ml-auto text-xs",
|
|
1121
|
+
"aria-hidden": true,
|
|
1122
|
+
children: "\u2197"
|
|
1123
|
+
}
|
|
1124
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
1125
|
+
"span",
|
|
1126
|
+
{
|
|
1127
|
+
className: "text-muted-foreground/60 ml-auto text-xs",
|
|
1128
|
+
"aria-hidden": true,
|
|
1129
|
+
children: "\u2192"
|
|
1130
|
+
}
|
|
1131
|
+
)
|
|
1132
|
+
] }),
|
|
1133
|
+
tool.tagline ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-sm leading-relaxed", children: tool.tagline }) : null
|
|
1134
|
+
] });
|
|
1135
|
+
const cls = "hover:bg-muted/30 group block border-r border-b transition-colors";
|
|
1136
|
+
return /* @__PURE__ */ jsxRuntime.jsx("li", { children: tool.external ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1137
|
+
"a",
|
|
1138
|
+
{
|
|
1139
|
+
href: tool.href,
|
|
1140
|
+
target: "_blank",
|
|
1141
|
+
rel: "noreferrer",
|
|
1142
|
+
className: cls,
|
|
1143
|
+
children: content
|
|
1144
|
+
}
|
|
1145
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(Link5__default.default, { href: tool.href, className: cls, children: content }) }, tool.id);
|
|
1146
|
+
})
|
|
1147
|
+
}
|
|
1148
|
+
);
|
|
1149
|
+
}
|
|
757
1150
|
function AppShell({
|
|
758
1151
|
eyebrow,
|
|
759
1152
|
title,
|
|
@@ -837,7 +1230,7 @@ function CtaLink({
|
|
|
837
1230
|
if (external) {
|
|
838
1231
|
return /* @__PURE__ */ jsxRuntime.jsx("a", { href, target: "_blank", rel: "noreferrer", className: cls, children: text });
|
|
839
1232
|
}
|
|
840
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1233
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Link5__default.default, { href, className: cls, children: text });
|
|
841
1234
|
}
|
|
842
1235
|
var TONE_CLASS3 = {
|
|
843
1236
|
default: "",
|
|
@@ -883,7 +1276,10 @@ exports.EmptyState = EmptyState;
|
|
|
883
1276
|
exports.FAMILY_PROPERTIES = FAMILY_PROPERTIES;
|
|
884
1277
|
exports.OcAccountMenu = OcAccountMenu;
|
|
885
1278
|
exports.OcAccountMenuView = OcAccountMenuView;
|
|
1279
|
+
exports.OcDashboardHub = OcDashboardHub;
|
|
1280
|
+
exports.OcDashboardShell = OcDashboardShell;
|
|
886
1281
|
exports.OcLogoDropdown = OcLogoDropdown;
|
|
1282
|
+
exports.OcPrimaryNav = OcPrimaryNav;
|
|
887
1283
|
exports.SITE_STATE_LABEL = SITE_STATE_LABEL;
|
|
888
1284
|
exports.SectionHeader = SectionHeader;
|
|
889
1285
|
exports.StatGrid = StatGrid;
|