@chronoter/main 0.1.4 → 0.1.6
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/cli.js +36 -54
- package/dist/index.js +23 -48
- package/dist/server/client/main.css +5373 -0
- package/dist/server/client/main.js +1643 -0
- package/dist/server/templates/index.html +3 -1
- package/package.json +1 -1
|
@@ -0,0 +1,1643 @@
|
|
|
1
|
+
import * as React5 from 'react';
|
|
2
|
+
import React5__default, { useState, useEffect, useMemo } from 'react';
|
|
3
|
+
import { createRoot } from 'react-dom/client';
|
|
4
|
+
import { Slot } from '@radix-ui/react-slot';
|
|
5
|
+
import { cva } from 'class-variance-authority';
|
|
6
|
+
import { HelpCircleIcon, BellIcon, XIcon } from 'lucide-react';
|
|
7
|
+
import { clsx } from 'clsx';
|
|
8
|
+
import { twMerge } from 'tailwind-merge';
|
|
9
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
10
|
+
import '@radix-ui/react-separator';
|
|
11
|
+
import * as SheetPrimitive from '@radix-ui/react-dialog';
|
|
12
|
+
import * as TooltipPrimitive from '@radix-ui/react-tooltip';
|
|
13
|
+
import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
|
|
14
|
+
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
|
|
15
|
+
import '@radix-ui/react-avatar';
|
|
16
|
+
|
|
17
|
+
// src/server/client/main.tsx
|
|
18
|
+
var useIsMobile = (mobileBreakpoint = 768) => {
|
|
19
|
+
const [isMobile, setIsMobile] = React5.useState(
|
|
20
|
+
void 0
|
|
21
|
+
);
|
|
22
|
+
React5.useEffect(() => {
|
|
23
|
+
const mql = window.matchMedia(`(max-width: ${mobileBreakpoint - 1}px)`);
|
|
24
|
+
const onChange = () => {
|
|
25
|
+
setIsMobile(window.innerWidth < mobileBreakpoint);
|
|
26
|
+
};
|
|
27
|
+
mql.addEventListener("change", onChange);
|
|
28
|
+
setIsMobile(window.innerWidth < mobileBreakpoint);
|
|
29
|
+
return () => mql.removeEventListener("change", onChange);
|
|
30
|
+
}, []);
|
|
31
|
+
return !!isMobile;
|
|
32
|
+
};
|
|
33
|
+
var cn = (...inputs) => {
|
|
34
|
+
return twMerge(clsx(inputs));
|
|
35
|
+
};
|
|
36
|
+
var buttonVariants = cva(
|
|
37
|
+
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
38
|
+
{
|
|
39
|
+
variants: {
|
|
40
|
+
variant: {
|
|
41
|
+
default: "bg-primary text-primary-foreground hover:bg-primary/90",
|
|
42
|
+
destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
|
|
43
|
+
outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
|
|
44
|
+
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
|
|
45
|
+
ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
|
|
46
|
+
link: "text-primary underline-offset-4 hover:underline"
|
|
47
|
+
},
|
|
48
|
+
size: {
|
|
49
|
+
default: "h-9 px-4 py-2 has-[>svg]:px-3",
|
|
50
|
+
sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
|
|
51
|
+
lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
|
|
52
|
+
icon: "size-9",
|
|
53
|
+
"icon-sm": "size-8",
|
|
54
|
+
"icon-lg": "size-10"
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
defaultVariants: {
|
|
58
|
+
variant: "default",
|
|
59
|
+
size: "default"
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
);
|
|
63
|
+
var Button = React5.forwardRef(({ className, variant, size, asChild = false, ...props }, ref) => {
|
|
64
|
+
const Comp = asChild ? Slot : "button";
|
|
65
|
+
return /* @__PURE__ */ jsx(
|
|
66
|
+
Comp,
|
|
67
|
+
{
|
|
68
|
+
ref,
|
|
69
|
+
"data-slot": "button",
|
|
70
|
+
className: cn(buttonVariants({ variant, size, className })),
|
|
71
|
+
...props
|
|
72
|
+
}
|
|
73
|
+
);
|
|
74
|
+
});
|
|
75
|
+
Button.displayName = "Button";
|
|
76
|
+
function Sheet({ ...props }) {
|
|
77
|
+
return /* @__PURE__ */ jsx(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
|
|
78
|
+
}
|
|
79
|
+
function SheetPortal({
|
|
80
|
+
...props
|
|
81
|
+
}) {
|
|
82
|
+
return /* @__PURE__ */ jsx(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
|
|
83
|
+
}
|
|
84
|
+
function SheetOverlay({
|
|
85
|
+
className,
|
|
86
|
+
...props
|
|
87
|
+
}) {
|
|
88
|
+
return /* @__PURE__ */ jsx(
|
|
89
|
+
SheetPrimitive.Overlay,
|
|
90
|
+
{
|
|
91
|
+
"data-slot": "sheet-overlay",
|
|
92
|
+
className: cn(
|
|
93
|
+
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
|
|
94
|
+
className
|
|
95
|
+
),
|
|
96
|
+
...props
|
|
97
|
+
}
|
|
98
|
+
);
|
|
99
|
+
}
|
|
100
|
+
function SheetContent({
|
|
101
|
+
className,
|
|
102
|
+
children,
|
|
103
|
+
side = "right",
|
|
104
|
+
...props
|
|
105
|
+
}) {
|
|
106
|
+
return /* @__PURE__ */ jsxs(SheetPortal, { children: [
|
|
107
|
+
/* @__PURE__ */ jsx(SheetOverlay, {}),
|
|
108
|
+
/* @__PURE__ */ jsxs(
|
|
109
|
+
SheetPrimitive.Content,
|
|
110
|
+
{
|
|
111
|
+
"data-slot": "sheet-content",
|
|
112
|
+
className: cn(
|
|
113
|
+
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
|
|
114
|
+
side === "right" && "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
|
|
115
|
+
side === "left" && "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
|
|
116
|
+
side === "top" && "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b",
|
|
117
|
+
side === "bottom" && "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t",
|
|
118
|
+
className
|
|
119
|
+
),
|
|
120
|
+
...props,
|
|
121
|
+
children: [
|
|
122
|
+
children,
|
|
123
|
+
/* @__PURE__ */ jsxs(SheetPrimitive.Close, { className: "ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none", children: [
|
|
124
|
+
/* @__PURE__ */ jsx(XIcon, { className: "size-4" }),
|
|
125
|
+
/* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
|
|
126
|
+
] })
|
|
127
|
+
]
|
|
128
|
+
}
|
|
129
|
+
)
|
|
130
|
+
] });
|
|
131
|
+
}
|
|
132
|
+
function SheetHeader({ className, ...props }) {
|
|
133
|
+
return /* @__PURE__ */ jsx(
|
|
134
|
+
"div",
|
|
135
|
+
{
|
|
136
|
+
"data-slot": "sheet-header",
|
|
137
|
+
className: cn("flex flex-col gap-1.5 p-4", className),
|
|
138
|
+
...props
|
|
139
|
+
}
|
|
140
|
+
);
|
|
141
|
+
}
|
|
142
|
+
function SheetTitle({
|
|
143
|
+
className,
|
|
144
|
+
...props
|
|
145
|
+
}) {
|
|
146
|
+
return /* @__PURE__ */ jsx(
|
|
147
|
+
SheetPrimitive.Title,
|
|
148
|
+
{
|
|
149
|
+
"data-slot": "sheet-title",
|
|
150
|
+
className: cn("text-foreground font-semibold", className),
|
|
151
|
+
...props
|
|
152
|
+
}
|
|
153
|
+
);
|
|
154
|
+
}
|
|
155
|
+
function SheetDescription({
|
|
156
|
+
className,
|
|
157
|
+
...props
|
|
158
|
+
}) {
|
|
159
|
+
return /* @__PURE__ */ jsx(
|
|
160
|
+
SheetPrimitive.Description,
|
|
161
|
+
{
|
|
162
|
+
"data-slot": "sheet-description",
|
|
163
|
+
className: cn("text-muted-foreground text-sm", className),
|
|
164
|
+
...props
|
|
165
|
+
}
|
|
166
|
+
);
|
|
167
|
+
}
|
|
168
|
+
function TooltipProvider({
|
|
169
|
+
delayDuration = 0,
|
|
170
|
+
...props
|
|
171
|
+
}) {
|
|
172
|
+
return /* @__PURE__ */ jsx(
|
|
173
|
+
TooltipPrimitive.Provider,
|
|
174
|
+
{
|
|
175
|
+
"data-slot": "tooltip-provider",
|
|
176
|
+
delayDuration,
|
|
177
|
+
...props
|
|
178
|
+
}
|
|
179
|
+
);
|
|
180
|
+
}
|
|
181
|
+
function Tooltip({
|
|
182
|
+
...props
|
|
183
|
+
}) {
|
|
184
|
+
return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
|
|
185
|
+
}
|
|
186
|
+
function TooltipTrigger({
|
|
187
|
+
...props
|
|
188
|
+
}) {
|
|
189
|
+
return /* @__PURE__ */ jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
|
|
190
|
+
}
|
|
191
|
+
function TooltipContent({
|
|
192
|
+
className,
|
|
193
|
+
sideOffset = 0,
|
|
194
|
+
children,
|
|
195
|
+
...props
|
|
196
|
+
}) {
|
|
197
|
+
return /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
|
|
198
|
+
TooltipPrimitive.Content,
|
|
199
|
+
{
|
|
200
|
+
"data-slot": "tooltip-content",
|
|
201
|
+
sideOffset,
|
|
202
|
+
className: cn(
|
|
203
|
+
"bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
|
|
204
|
+
className
|
|
205
|
+
),
|
|
206
|
+
...props,
|
|
207
|
+
children: [
|
|
208
|
+
children,
|
|
209
|
+
/* @__PURE__ */ jsx(TooltipPrimitive.Arrow, { className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
|
|
210
|
+
]
|
|
211
|
+
}
|
|
212
|
+
) });
|
|
213
|
+
}
|
|
214
|
+
var SIDEBAR_COOKIE_NAME = "sidebar_state";
|
|
215
|
+
var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
|
|
216
|
+
var SIDEBAR_WIDTH = "16rem";
|
|
217
|
+
var SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
218
|
+
var SIDEBAR_WIDTH_ICON = "3rem";
|
|
219
|
+
var SIDEBAR_KEYBOARD_SHORTCUT = "b";
|
|
220
|
+
var SidebarContext = React5.createContext(null);
|
|
221
|
+
function useSidebar() {
|
|
222
|
+
const context = React5.useContext(SidebarContext);
|
|
223
|
+
if (!context) {
|
|
224
|
+
throw new Error("useSidebar must be used within a SidebarProvider.");
|
|
225
|
+
}
|
|
226
|
+
return context;
|
|
227
|
+
}
|
|
228
|
+
function SidebarProvider({
|
|
229
|
+
defaultOpen = true,
|
|
230
|
+
open: openProp,
|
|
231
|
+
onOpenChange: setOpenProp,
|
|
232
|
+
className,
|
|
233
|
+
style,
|
|
234
|
+
children,
|
|
235
|
+
...props
|
|
236
|
+
}) {
|
|
237
|
+
const isMobile = useIsMobile();
|
|
238
|
+
const [openMobile, setOpenMobile] = React5.useState(false);
|
|
239
|
+
const [_open, _setOpen] = React5.useState(defaultOpen);
|
|
240
|
+
const open = openProp ?? _open;
|
|
241
|
+
const setOpen = React5.useCallback(
|
|
242
|
+
(value) => {
|
|
243
|
+
const openState = typeof value === "function" ? value(open) : value;
|
|
244
|
+
if (setOpenProp) {
|
|
245
|
+
setOpenProp(openState);
|
|
246
|
+
} else {
|
|
247
|
+
_setOpen(openState);
|
|
248
|
+
}
|
|
249
|
+
document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
|
|
250
|
+
},
|
|
251
|
+
[setOpenProp, open]
|
|
252
|
+
);
|
|
253
|
+
const toggleSidebar = React5.useCallback(() => {
|
|
254
|
+
return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
|
|
255
|
+
}, [isMobile, setOpen, setOpenMobile]);
|
|
256
|
+
React5.useEffect(() => {
|
|
257
|
+
const handleKeyDown = (event) => {
|
|
258
|
+
if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
|
|
259
|
+
event.preventDefault();
|
|
260
|
+
toggleSidebar();
|
|
261
|
+
}
|
|
262
|
+
};
|
|
263
|
+
window.addEventListener("keydown", handleKeyDown);
|
|
264
|
+
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
265
|
+
}, [toggleSidebar]);
|
|
266
|
+
const state = open ? "expanded" : "collapsed";
|
|
267
|
+
const contextValue = React5.useMemo(
|
|
268
|
+
() => ({
|
|
269
|
+
state,
|
|
270
|
+
open,
|
|
271
|
+
setOpen,
|
|
272
|
+
isMobile,
|
|
273
|
+
openMobile,
|
|
274
|
+
setOpenMobile,
|
|
275
|
+
toggleSidebar
|
|
276
|
+
}),
|
|
277
|
+
[state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
|
|
278
|
+
);
|
|
279
|
+
return /* @__PURE__ */ jsx(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx(
|
|
280
|
+
"div",
|
|
281
|
+
{
|
|
282
|
+
"data-slot": "sidebar-wrapper",
|
|
283
|
+
style: {
|
|
284
|
+
"--sidebar-width": SIDEBAR_WIDTH,
|
|
285
|
+
"--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
|
|
286
|
+
...style
|
|
287
|
+
},
|
|
288
|
+
className: cn(
|
|
289
|
+
"group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full",
|
|
290
|
+
className
|
|
291
|
+
),
|
|
292
|
+
...props,
|
|
293
|
+
children
|
|
294
|
+
}
|
|
295
|
+
) }) });
|
|
296
|
+
}
|
|
297
|
+
function Sidebar({
|
|
298
|
+
side = "left",
|
|
299
|
+
variant = "sidebar",
|
|
300
|
+
collapsible = "offcanvas",
|
|
301
|
+
className,
|
|
302
|
+
children,
|
|
303
|
+
...props
|
|
304
|
+
}) {
|
|
305
|
+
const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
|
|
306
|
+
if (collapsible === "none") {
|
|
307
|
+
return /* @__PURE__ */ jsx(
|
|
308
|
+
"div",
|
|
309
|
+
{
|
|
310
|
+
"data-slot": "sidebar",
|
|
311
|
+
className: cn(
|
|
312
|
+
"bg-sidebar text-sidebar-foreground flex h-full w-(--sidebar-width) flex-col",
|
|
313
|
+
className
|
|
314
|
+
),
|
|
315
|
+
...props,
|
|
316
|
+
children
|
|
317
|
+
}
|
|
318
|
+
);
|
|
319
|
+
}
|
|
320
|
+
if (isMobile) {
|
|
321
|
+
return /* @__PURE__ */ jsx(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsxs(
|
|
322
|
+
SheetContent,
|
|
323
|
+
{
|
|
324
|
+
"data-sidebar": "sidebar",
|
|
325
|
+
"data-slot": "sidebar",
|
|
326
|
+
"data-mobile": "true",
|
|
327
|
+
className: "bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden",
|
|
328
|
+
style: {
|
|
329
|
+
"--sidebar-width": SIDEBAR_WIDTH_MOBILE
|
|
330
|
+
},
|
|
331
|
+
side,
|
|
332
|
+
children: [
|
|
333
|
+
/* @__PURE__ */ jsxs(SheetHeader, { className: "sr-only", children: [
|
|
334
|
+
/* @__PURE__ */ jsx(SheetTitle, { children: "Sidebar" }),
|
|
335
|
+
/* @__PURE__ */ jsx(SheetDescription, { children: "Displays the mobile sidebar." })
|
|
336
|
+
] }),
|
|
337
|
+
/* @__PURE__ */ jsx("div", { className: "flex h-full w-full flex-col", children })
|
|
338
|
+
]
|
|
339
|
+
}
|
|
340
|
+
) });
|
|
341
|
+
}
|
|
342
|
+
return /* @__PURE__ */ jsxs(
|
|
343
|
+
"div",
|
|
344
|
+
{
|
|
345
|
+
className: "group peer text-sidebar-foreground hidden md:block",
|
|
346
|
+
"data-state": state,
|
|
347
|
+
"data-collapsible": state === "collapsed" ? collapsible : "",
|
|
348
|
+
"data-variant": variant,
|
|
349
|
+
"data-side": side,
|
|
350
|
+
"data-slot": "sidebar",
|
|
351
|
+
children: [
|
|
352
|
+
/* @__PURE__ */ jsx(
|
|
353
|
+
"div",
|
|
354
|
+
{
|
|
355
|
+
"data-slot": "sidebar-gap",
|
|
356
|
+
className: cn(
|
|
357
|
+
"relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear",
|
|
358
|
+
"group-data-[collapsible=offcanvas]:w-0",
|
|
359
|
+
"group-data-[side=right]:rotate-180",
|
|
360
|
+
variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)"
|
|
361
|
+
)
|
|
362
|
+
}
|
|
363
|
+
),
|
|
364
|
+
/* @__PURE__ */ jsx(
|
|
365
|
+
"div",
|
|
366
|
+
{
|
|
367
|
+
"data-slot": "sidebar-container",
|
|
368
|
+
className: cn(
|
|
369
|
+
"fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex",
|
|
370
|
+
side === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
|
|
371
|
+
// Adjust the padding for floating and inset variants.
|
|
372
|
+
variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l",
|
|
373
|
+
className
|
|
374
|
+
),
|
|
375
|
+
...props,
|
|
376
|
+
children: /* @__PURE__ */ jsx(
|
|
377
|
+
"div",
|
|
378
|
+
{
|
|
379
|
+
"data-sidebar": "sidebar",
|
|
380
|
+
"data-slot": "sidebar-inner",
|
|
381
|
+
className: "bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm",
|
|
382
|
+
children
|
|
383
|
+
}
|
|
384
|
+
)
|
|
385
|
+
}
|
|
386
|
+
)
|
|
387
|
+
]
|
|
388
|
+
}
|
|
389
|
+
);
|
|
390
|
+
}
|
|
391
|
+
function SidebarInset({ className, ...props }) {
|
|
392
|
+
return /* @__PURE__ */ jsx(
|
|
393
|
+
"main",
|
|
394
|
+
{
|
|
395
|
+
"data-slot": "sidebar-inset",
|
|
396
|
+
className: cn(
|
|
397
|
+
"bg-background relative flex w-full flex-1 flex-col",
|
|
398
|
+
"md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2",
|
|
399
|
+
className
|
|
400
|
+
),
|
|
401
|
+
...props
|
|
402
|
+
}
|
|
403
|
+
);
|
|
404
|
+
}
|
|
405
|
+
function SidebarFooter({ className, ...props }) {
|
|
406
|
+
return /* @__PURE__ */ jsx(
|
|
407
|
+
"div",
|
|
408
|
+
{
|
|
409
|
+
"data-slot": "sidebar-footer",
|
|
410
|
+
"data-sidebar": "footer",
|
|
411
|
+
className: cn("flex flex-col gap-2 py-2 pl-2", className),
|
|
412
|
+
...props
|
|
413
|
+
}
|
|
414
|
+
);
|
|
415
|
+
}
|
|
416
|
+
function SidebarContent({ className, ...props }) {
|
|
417
|
+
return /* @__PURE__ */ jsx(
|
|
418
|
+
"div",
|
|
419
|
+
{
|
|
420
|
+
"data-slot": "sidebar-content",
|
|
421
|
+
"data-sidebar": "content",
|
|
422
|
+
className: cn(
|
|
423
|
+
"flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
|
|
424
|
+
className
|
|
425
|
+
),
|
|
426
|
+
...props
|
|
427
|
+
}
|
|
428
|
+
);
|
|
429
|
+
}
|
|
430
|
+
function SidebarGroup({ className, ...props }) {
|
|
431
|
+
return /* @__PURE__ */ jsx(
|
|
432
|
+
"div",
|
|
433
|
+
{
|
|
434
|
+
"data-slot": "sidebar-group",
|
|
435
|
+
"data-sidebar": "group",
|
|
436
|
+
className: cn("relative flex w-full min-w-0 flex-col py-2 pl-2", className),
|
|
437
|
+
...props
|
|
438
|
+
}
|
|
439
|
+
);
|
|
440
|
+
}
|
|
441
|
+
function SidebarGroupContent({
|
|
442
|
+
className,
|
|
443
|
+
...props
|
|
444
|
+
}) {
|
|
445
|
+
return /* @__PURE__ */ jsx(
|
|
446
|
+
"div",
|
|
447
|
+
{
|
|
448
|
+
"data-slot": "sidebar-group-content",
|
|
449
|
+
"data-sidebar": "group-content",
|
|
450
|
+
className: cn("w-full text-sm", className),
|
|
451
|
+
...props
|
|
452
|
+
}
|
|
453
|
+
);
|
|
454
|
+
}
|
|
455
|
+
function SidebarMenu({ className, ...props }) {
|
|
456
|
+
return /* @__PURE__ */ jsx(
|
|
457
|
+
"ul",
|
|
458
|
+
{
|
|
459
|
+
"data-slot": "sidebar-menu",
|
|
460
|
+
"data-sidebar": "menu",
|
|
461
|
+
className: cn("flex w-full min-w-0 flex-col gap-1", className),
|
|
462
|
+
...props
|
|
463
|
+
}
|
|
464
|
+
);
|
|
465
|
+
}
|
|
466
|
+
function SidebarMenuItem({ className, ...props }) {
|
|
467
|
+
return /* @__PURE__ */ jsx(
|
|
468
|
+
"li",
|
|
469
|
+
{
|
|
470
|
+
"data-slot": "sidebar-menu-item",
|
|
471
|
+
"data-sidebar": "menu-item",
|
|
472
|
+
className: cn("group/menu-item relative", className),
|
|
473
|
+
...props
|
|
474
|
+
}
|
|
475
|
+
);
|
|
476
|
+
}
|
|
477
|
+
var sidebarMenuButtonVariants = cva(
|
|
478
|
+
"peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md pl-2 py-1 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
|
|
479
|
+
{
|
|
480
|
+
variants: {
|
|
481
|
+
variant: {
|
|
482
|
+
default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
|
|
483
|
+
outline: "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]"
|
|
484
|
+
},
|
|
485
|
+
size: {
|
|
486
|
+
default: "h-8 text-sm",
|
|
487
|
+
sm: "h-7 text-xs",
|
|
488
|
+
lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!"
|
|
489
|
+
}
|
|
490
|
+
},
|
|
491
|
+
defaultVariants: {
|
|
492
|
+
variant: "default",
|
|
493
|
+
size: "default"
|
|
494
|
+
}
|
|
495
|
+
}
|
|
496
|
+
);
|
|
497
|
+
function SidebarMenuButton({
|
|
498
|
+
asChild = false,
|
|
499
|
+
isActive = false,
|
|
500
|
+
variant = "default",
|
|
501
|
+
size = "default",
|
|
502
|
+
tooltip,
|
|
503
|
+
className,
|
|
504
|
+
...props
|
|
505
|
+
}) {
|
|
506
|
+
const Comp = asChild ? Slot : "button";
|
|
507
|
+
const { isMobile, state } = useSidebar();
|
|
508
|
+
const button = /* @__PURE__ */ jsx(
|
|
509
|
+
Comp,
|
|
510
|
+
{
|
|
511
|
+
"data-slot": "sidebar-menu-button",
|
|
512
|
+
"data-sidebar": "menu-button",
|
|
513
|
+
"data-size": size,
|
|
514
|
+
"data-active": isActive,
|
|
515
|
+
className: cn(sidebarMenuButtonVariants({ variant, size }), className),
|
|
516
|
+
...props
|
|
517
|
+
}
|
|
518
|
+
);
|
|
519
|
+
if (!tooltip) {
|
|
520
|
+
return button;
|
|
521
|
+
}
|
|
522
|
+
if (typeof tooltip === "string") {
|
|
523
|
+
tooltip = {
|
|
524
|
+
children: tooltip
|
|
525
|
+
};
|
|
526
|
+
}
|
|
527
|
+
return /* @__PURE__ */ jsxs(Tooltip, { children: [
|
|
528
|
+
/* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: button }),
|
|
529
|
+
/* @__PURE__ */ jsx(
|
|
530
|
+
TooltipContent,
|
|
531
|
+
{
|
|
532
|
+
side: "right",
|
|
533
|
+
align: "center",
|
|
534
|
+
hidden: state !== "collapsed" || isMobile,
|
|
535
|
+
...tooltip
|
|
536
|
+
}
|
|
537
|
+
)
|
|
538
|
+
] });
|
|
539
|
+
}
|
|
540
|
+
function SidebarMenuSub({ className, ...props }) {
|
|
541
|
+
return /* @__PURE__ */ jsx(
|
|
542
|
+
"ul",
|
|
543
|
+
{
|
|
544
|
+
"data-slot": "sidebar-menu-sub",
|
|
545
|
+
"data-sidebar": "menu-sub",
|
|
546
|
+
className: cn(
|
|
547
|
+
"border-sidebar-border ml-2 flex min-w-0 flex-col gap-1 border-l pl-2 py-0.5",
|
|
548
|
+
"group-data-[collapsible=icon]:hidden",
|
|
549
|
+
className
|
|
550
|
+
),
|
|
551
|
+
...props
|
|
552
|
+
}
|
|
553
|
+
);
|
|
554
|
+
}
|
|
555
|
+
function SidebarMenuSubItem({
|
|
556
|
+
className,
|
|
557
|
+
...props
|
|
558
|
+
}) {
|
|
559
|
+
return /* @__PURE__ */ jsx(
|
|
560
|
+
"li",
|
|
561
|
+
{
|
|
562
|
+
"data-slot": "sidebar-menu-sub-item",
|
|
563
|
+
"data-sidebar": "menu-sub-item",
|
|
564
|
+
className: cn("group/menu-sub-item relative", className),
|
|
565
|
+
...props
|
|
566
|
+
}
|
|
567
|
+
);
|
|
568
|
+
}
|
|
569
|
+
function SidebarMenuSubButton({
|
|
570
|
+
asChild = false,
|
|
571
|
+
size = "md",
|
|
572
|
+
isActive = false,
|
|
573
|
+
className,
|
|
574
|
+
...props
|
|
575
|
+
}) {
|
|
576
|
+
const Comp = asChild ? Slot : "a";
|
|
577
|
+
return /* @__PURE__ */ jsx(
|
|
578
|
+
Comp,
|
|
579
|
+
{
|
|
580
|
+
"data-slot": "sidebar-menu-sub-button",
|
|
581
|
+
"data-sidebar": "menu-sub-button",
|
|
582
|
+
"data-size": size,
|
|
583
|
+
"data-active": isActive,
|
|
584
|
+
className: cn(
|
|
585
|
+
"text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-6 min-w-0 items-center gap-2 overflow-hidden rounded-md pl-1.5 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
|
|
586
|
+
"data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
|
|
587
|
+
size === "sm" && "text-xs",
|
|
588
|
+
size === "md" && "text-sm",
|
|
589
|
+
"group-data-[collapsible=icon]:hidden",
|
|
590
|
+
className
|
|
591
|
+
),
|
|
592
|
+
...props
|
|
593
|
+
}
|
|
594
|
+
);
|
|
595
|
+
}
|
|
596
|
+
function NavigationMenu({
|
|
597
|
+
className,
|
|
598
|
+
children,
|
|
599
|
+
viewport = true,
|
|
600
|
+
...props
|
|
601
|
+
}) {
|
|
602
|
+
return /* @__PURE__ */ jsxs(
|
|
603
|
+
NavigationMenuPrimitive.Root,
|
|
604
|
+
{
|
|
605
|
+
"data-slot": "navigation-menu",
|
|
606
|
+
"data-viewport": viewport,
|
|
607
|
+
className: cn(
|
|
608
|
+
"group/navigation-menu relative flex max-w-max flex-1 items-center justify-center",
|
|
609
|
+
className
|
|
610
|
+
),
|
|
611
|
+
...props,
|
|
612
|
+
children: [
|
|
613
|
+
children,
|
|
614
|
+
viewport && /* @__PURE__ */ jsx(NavigationMenuViewport, {})
|
|
615
|
+
]
|
|
616
|
+
}
|
|
617
|
+
);
|
|
618
|
+
}
|
|
619
|
+
function NavigationMenuList({
|
|
620
|
+
className,
|
|
621
|
+
...props
|
|
622
|
+
}) {
|
|
623
|
+
return /* @__PURE__ */ jsx(
|
|
624
|
+
NavigationMenuPrimitive.List,
|
|
625
|
+
{
|
|
626
|
+
"data-slot": "navigation-menu-list",
|
|
627
|
+
className: cn(
|
|
628
|
+
"group flex flex-1 list-none items-center justify-center gap-1",
|
|
629
|
+
className
|
|
630
|
+
),
|
|
631
|
+
...props
|
|
632
|
+
}
|
|
633
|
+
);
|
|
634
|
+
}
|
|
635
|
+
function NavigationMenuItem({
|
|
636
|
+
className,
|
|
637
|
+
...props
|
|
638
|
+
}) {
|
|
639
|
+
return /* @__PURE__ */ jsx(
|
|
640
|
+
NavigationMenuPrimitive.Item,
|
|
641
|
+
{
|
|
642
|
+
"data-slot": "navigation-menu-item",
|
|
643
|
+
className: cn("relative", className),
|
|
644
|
+
...props
|
|
645
|
+
}
|
|
646
|
+
);
|
|
647
|
+
}
|
|
648
|
+
cva(
|
|
649
|
+
"group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50 focus-visible:ring-ring/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1"
|
|
650
|
+
);
|
|
651
|
+
function NavigationMenuViewport({
|
|
652
|
+
className,
|
|
653
|
+
...props
|
|
654
|
+
}) {
|
|
655
|
+
return /* @__PURE__ */ jsx(
|
|
656
|
+
"div",
|
|
657
|
+
{
|
|
658
|
+
className: cn(
|
|
659
|
+
"absolute top-full left-0 isolate z-50 flex justify-center"
|
|
660
|
+
),
|
|
661
|
+
children: /* @__PURE__ */ jsx(
|
|
662
|
+
NavigationMenuPrimitive.Viewport,
|
|
663
|
+
{
|
|
664
|
+
"data-slot": "navigation-menu-viewport",
|
|
665
|
+
className: cn(
|
|
666
|
+
"origin-top-center bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--radix-navigation-menu-viewport-width)]",
|
|
667
|
+
className
|
|
668
|
+
),
|
|
669
|
+
...props
|
|
670
|
+
}
|
|
671
|
+
)
|
|
672
|
+
}
|
|
673
|
+
);
|
|
674
|
+
}
|
|
675
|
+
function NavigationMenuLink({
|
|
676
|
+
className,
|
|
677
|
+
...props
|
|
678
|
+
}) {
|
|
679
|
+
return /* @__PURE__ */ jsx(
|
|
680
|
+
NavigationMenuPrimitive.Link,
|
|
681
|
+
{
|
|
682
|
+
"data-slot": "navigation-menu-link",
|
|
683
|
+
className: cn(
|
|
684
|
+
"data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-ring/50 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none focus-visible:ring-[3px] focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4",
|
|
685
|
+
className
|
|
686
|
+
),
|
|
687
|
+
...props
|
|
688
|
+
}
|
|
689
|
+
);
|
|
690
|
+
}
|
|
691
|
+
var HamburgerIcon = ({
|
|
692
|
+
className,
|
|
693
|
+
...props
|
|
694
|
+
}) => /* @__PURE__ */ jsxs(
|
|
695
|
+
"svg",
|
|
696
|
+
{
|
|
697
|
+
className: cn("pointer-events-none", className),
|
|
698
|
+
width: 16,
|
|
699
|
+
height: 16,
|
|
700
|
+
viewBox: "0 0 24 24",
|
|
701
|
+
fill: "none",
|
|
702
|
+
stroke: "currentColor",
|
|
703
|
+
strokeWidth: "2",
|
|
704
|
+
strokeLinecap: "round",
|
|
705
|
+
strokeLinejoin: "round",
|
|
706
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
707
|
+
...props,
|
|
708
|
+
children: [
|
|
709
|
+
/* @__PURE__ */ jsx(
|
|
710
|
+
"path",
|
|
711
|
+
{
|
|
712
|
+
d: "M4 12L20 12",
|
|
713
|
+
className: "origin-center -translate-y-[7px] transition-all duration-300 ease-[cubic-bezier(.5,.85,.25,1.1)] group-aria-expanded:translate-x-0 group-aria-expanded:translate-y-0 group-aria-expanded:rotate-[315deg]"
|
|
714
|
+
}
|
|
715
|
+
),
|
|
716
|
+
/* @__PURE__ */ jsx(
|
|
717
|
+
"path",
|
|
718
|
+
{
|
|
719
|
+
d: "M4 12H20",
|
|
720
|
+
className: "origin-center transition-all duration-300 ease-[cubic-bezier(.5,.85,.25,1.8)] group-aria-expanded:rotate-45"
|
|
721
|
+
}
|
|
722
|
+
),
|
|
723
|
+
/* @__PURE__ */ jsx(
|
|
724
|
+
"path",
|
|
725
|
+
{
|
|
726
|
+
d: "M4 12H20",
|
|
727
|
+
className: "origin-center translate-y-[7px] transition-all duration-300 ease-[cubic-bezier(.5,.85,.25,1.1)] group-aria-expanded:translate-y-0 group-aria-expanded:rotate-[135deg]"
|
|
728
|
+
}
|
|
729
|
+
)
|
|
730
|
+
]
|
|
731
|
+
}
|
|
732
|
+
);
|
|
733
|
+
function DropdownMenu({
|
|
734
|
+
...props
|
|
735
|
+
}) {
|
|
736
|
+
return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
|
|
737
|
+
}
|
|
738
|
+
function DropdownMenuTrigger({
|
|
739
|
+
...props
|
|
740
|
+
}) {
|
|
741
|
+
return /* @__PURE__ */ jsx(
|
|
742
|
+
DropdownMenuPrimitive.Trigger,
|
|
743
|
+
{
|
|
744
|
+
"data-slot": "dropdown-menu-trigger",
|
|
745
|
+
...props
|
|
746
|
+
}
|
|
747
|
+
);
|
|
748
|
+
}
|
|
749
|
+
function DropdownMenuContent({
|
|
750
|
+
className,
|
|
751
|
+
sideOffset = 4,
|
|
752
|
+
...props
|
|
753
|
+
}) {
|
|
754
|
+
return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
|
|
755
|
+
DropdownMenuPrimitive.Content,
|
|
756
|
+
{
|
|
757
|
+
"data-slot": "dropdown-menu-content",
|
|
758
|
+
sideOffset,
|
|
759
|
+
className: cn(
|
|
760
|
+
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
|
|
761
|
+
className
|
|
762
|
+
),
|
|
763
|
+
...props
|
|
764
|
+
}
|
|
765
|
+
) });
|
|
766
|
+
}
|
|
767
|
+
function DropdownMenuItem({
|
|
768
|
+
className,
|
|
769
|
+
inset,
|
|
770
|
+
variant = "default",
|
|
771
|
+
...props
|
|
772
|
+
}) {
|
|
773
|
+
return /* @__PURE__ */ jsx(
|
|
774
|
+
DropdownMenuPrimitive.Item,
|
|
775
|
+
{
|
|
776
|
+
"data-slot": "dropdown-menu-item",
|
|
777
|
+
"data-inset": inset,
|
|
778
|
+
"data-variant": variant,
|
|
779
|
+
className: cn(
|
|
780
|
+
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
781
|
+
className
|
|
782
|
+
),
|
|
783
|
+
...props
|
|
784
|
+
}
|
|
785
|
+
);
|
|
786
|
+
}
|
|
787
|
+
function DropdownMenuLabel({
|
|
788
|
+
className,
|
|
789
|
+
inset,
|
|
790
|
+
...props
|
|
791
|
+
}) {
|
|
792
|
+
return /* @__PURE__ */ jsx(
|
|
793
|
+
DropdownMenuPrimitive.Label,
|
|
794
|
+
{
|
|
795
|
+
"data-slot": "dropdown-menu-label",
|
|
796
|
+
"data-inset": inset,
|
|
797
|
+
className: cn(
|
|
798
|
+
"px-2 py-1.5 text-sm font-medium data-[inset]:pl-8",
|
|
799
|
+
className
|
|
800
|
+
),
|
|
801
|
+
...props
|
|
802
|
+
}
|
|
803
|
+
);
|
|
804
|
+
}
|
|
805
|
+
function DropdownMenuSeparator({
|
|
806
|
+
className,
|
|
807
|
+
...props
|
|
808
|
+
}) {
|
|
809
|
+
return /* @__PURE__ */ jsx(
|
|
810
|
+
DropdownMenuPrimitive.Separator,
|
|
811
|
+
{
|
|
812
|
+
"data-slot": "dropdown-menu-separator",
|
|
813
|
+
className: cn("bg-border -mx-1 my-1 h-px", className),
|
|
814
|
+
...props
|
|
815
|
+
}
|
|
816
|
+
);
|
|
817
|
+
}
|
|
818
|
+
var InfoMenu = ({
|
|
819
|
+
onItemClick
|
|
820
|
+
}) => /* @__PURE__ */ jsxs(DropdownMenu, { children: [
|
|
821
|
+
/* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "ghost", size: "icon", className: "h-9 w-9", children: [
|
|
822
|
+
/* @__PURE__ */ jsx(HelpCircleIcon, { className: "h-4 w-4" }),
|
|
823
|
+
/* @__PURE__ */ jsx("span", { className: "sr-only", children: "Help and Information" })
|
|
824
|
+
] }) }),
|
|
825
|
+
/* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: "w-56", children: [
|
|
826
|
+
/* @__PURE__ */ jsx(DropdownMenuLabel, { children: "Help & Support" }),
|
|
827
|
+
/* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
|
|
828
|
+
/* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => onItemClick?.("help"), children: "Help Center" }),
|
|
829
|
+
/* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => onItemClick?.("documentation"), children: "Documentation" }),
|
|
830
|
+
/* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => onItemClick?.("contact"), children: "Contact Support" }),
|
|
831
|
+
/* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => onItemClick?.("feedback"), children: "Send Feedback" })
|
|
832
|
+
] })
|
|
833
|
+
] });
|
|
834
|
+
var badgeVariants = cva(
|
|
835
|
+
"inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
|
|
836
|
+
{
|
|
837
|
+
variants: {
|
|
838
|
+
variant: {
|
|
839
|
+
default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
|
|
840
|
+
secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
|
|
841
|
+
destructive: "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
|
|
842
|
+
outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
|
|
843
|
+
}
|
|
844
|
+
},
|
|
845
|
+
defaultVariants: {
|
|
846
|
+
variant: "default"
|
|
847
|
+
}
|
|
848
|
+
}
|
|
849
|
+
);
|
|
850
|
+
function Badge({
|
|
851
|
+
className,
|
|
852
|
+
variant,
|
|
853
|
+
asChild = false,
|
|
854
|
+
...props
|
|
855
|
+
}) {
|
|
856
|
+
const Comp = asChild ? Slot : "span";
|
|
857
|
+
return /* @__PURE__ */ jsx(
|
|
858
|
+
Comp,
|
|
859
|
+
{
|
|
860
|
+
"data-slot": "badge",
|
|
861
|
+
className: cn(badgeVariants({ variant }), className),
|
|
862
|
+
...props
|
|
863
|
+
}
|
|
864
|
+
);
|
|
865
|
+
}
|
|
866
|
+
var NotificationMenu = ({
|
|
867
|
+
notificationCount = 3,
|
|
868
|
+
onItemClick
|
|
869
|
+
}) => /* @__PURE__ */ jsxs(DropdownMenu, { children: [
|
|
870
|
+
/* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "ghost", size: "icon", className: "h-9 w-9 relative", children: [
|
|
871
|
+
/* @__PURE__ */ jsx(BellIcon, { className: "h-4 w-4" }),
|
|
872
|
+
notificationCount > 0 && /* @__PURE__ */ jsx(Badge, { className: "absolute -top-1 -right-1 h-5 w-5 flex items-center justify-center p-0 text-xs", children: notificationCount > 9 ? "9+" : notificationCount }),
|
|
873
|
+
/* @__PURE__ */ jsx("span", { className: "sr-only", children: "Notifications" })
|
|
874
|
+
] }) }),
|
|
875
|
+
/* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: "w-80", children: [
|
|
876
|
+
/* @__PURE__ */ jsx(DropdownMenuLabel, { children: "Notifications" }),
|
|
877
|
+
/* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
|
|
878
|
+
/* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => onItemClick?.("notification1"), children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
|
|
879
|
+
/* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: "New message received" }),
|
|
880
|
+
/* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "2 minutes ago" })
|
|
881
|
+
] }) }),
|
|
882
|
+
/* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => onItemClick?.("notification2"), children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
|
|
883
|
+
/* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: "System update available" }),
|
|
884
|
+
/* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "1 hour ago" })
|
|
885
|
+
] }) }),
|
|
886
|
+
/* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => onItemClick?.("notification3"), children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
|
|
887
|
+
/* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: "Weekly report ready" }),
|
|
888
|
+
/* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "3 hours ago" })
|
|
889
|
+
] }) }),
|
|
890
|
+
/* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
|
|
891
|
+
/* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => onItemClick?.("view-all"), children: "View all notifications" })
|
|
892
|
+
] })
|
|
893
|
+
] });
|
|
894
|
+
var logoClass = cva("h-auto", {
|
|
895
|
+
variants: {
|
|
896
|
+
variant: {
|
|
897
|
+
default: "w-[150px]",
|
|
898
|
+
small: "my-1 w-[40px]"
|
|
899
|
+
}
|
|
900
|
+
},
|
|
901
|
+
defaultVariants: {
|
|
902
|
+
variant: "default"
|
|
903
|
+
}
|
|
904
|
+
});
|
|
905
|
+
var ChronoterLogo = (props) => {
|
|
906
|
+
const lightImgSrc = props.variant === "small" ? "/chronoter-assets/media/Chronoter_favicon.svg" : "/chronoter-assets/media/Chronoter.png";
|
|
907
|
+
const darkImgSrc = props.variant === "small" ? "/chronoter-assets/media/Chronoter_favicon-dark.svg" : "/chronoter-assets/media/Chronoter-dark.png";
|
|
908
|
+
const alt = props.variant === "small" ? `Chronoter small logo` : `Chronoter logo`;
|
|
909
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
910
|
+
/* @__PURE__ */ jsx(
|
|
911
|
+
"img",
|
|
912
|
+
{
|
|
913
|
+
alt,
|
|
914
|
+
className: cn(
|
|
915
|
+
logoClass({ variant: props.variant, className: props.className }),
|
|
916
|
+
"dark:hidden"
|
|
917
|
+
),
|
|
918
|
+
height: props.variant === "small" ? 40 : 176,
|
|
919
|
+
loading: "lazy",
|
|
920
|
+
src: lightImgSrc,
|
|
921
|
+
width: props.variant === "small" ? 40 : 508
|
|
922
|
+
}
|
|
923
|
+
),
|
|
924
|
+
/* @__PURE__ */ jsx(
|
|
925
|
+
"img",
|
|
926
|
+
{
|
|
927
|
+
alt,
|
|
928
|
+
className: cn(
|
|
929
|
+
logoClass({ variant: props.variant, className: props.className }),
|
|
930
|
+
"hidden dark:block"
|
|
931
|
+
),
|
|
932
|
+
height: props.variant === "small" ? 40 : 176,
|
|
933
|
+
loading: "lazy",
|
|
934
|
+
src: darkImgSrc,
|
|
935
|
+
width: props.variant === "small" ? 40 : 508
|
|
936
|
+
}
|
|
937
|
+
)
|
|
938
|
+
] });
|
|
939
|
+
};
|
|
940
|
+
var resolveLogoPath = (path) => {
|
|
941
|
+
if (path.startsWith("./")) {
|
|
942
|
+
return `/chronoter-assets/project/${path.slice(2)}`;
|
|
943
|
+
}
|
|
944
|
+
return path;
|
|
945
|
+
};
|
|
946
|
+
var SiteLogo = ({
|
|
947
|
+
logoPath,
|
|
948
|
+
logoPathDark,
|
|
949
|
+
className
|
|
950
|
+
}) => {
|
|
951
|
+
if (logoPath && logoPath.trim() !== "") {
|
|
952
|
+
const lightSrc = resolveLogoPath(logoPath);
|
|
953
|
+
const darkSrc = logoPathDark ? resolveLogoPath(logoPathDark) : lightSrc;
|
|
954
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
955
|
+
/* @__PURE__ */ jsx(
|
|
956
|
+
"img",
|
|
957
|
+
{
|
|
958
|
+
alt: "Site logo",
|
|
959
|
+
className: `h-auto w-[150px] dark:hidden ${className || ""}`,
|
|
960
|
+
height: 150,
|
|
961
|
+
loading: "lazy",
|
|
962
|
+
src: lightSrc,
|
|
963
|
+
width: 150
|
|
964
|
+
}
|
|
965
|
+
),
|
|
966
|
+
/* @__PURE__ */ jsx(
|
|
967
|
+
"img",
|
|
968
|
+
{
|
|
969
|
+
alt: "Site logo",
|
|
970
|
+
className: `hidden h-auto w-[150px] dark:block ${className || ""}`,
|
|
971
|
+
height: 150,
|
|
972
|
+
loading: "lazy",
|
|
973
|
+
src: darkSrc,
|
|
974
|
+
width: 150
|
|
975
|
+
}
|
|
976
|
+
)
|
|
977
|
+
] });
|
|
978
|
+
}
|
|
979
|
+
return /* @__PURE__ */ jsx(ChronoterLogo, { variant: "default", className });
|
|
980
|
+
};
|
|
981
|
+
var defaultNavigationLinks = [
|
|
982
|
+
{ href: "#", label: "Home" },
|
|
983
|
+
{ href: "#", label: "Features" },
|
|
984
|
+
{ href: "#", label: "Pricing" },
|
|
985
|
+
{ href: "#", label: "About" }
|
|
986
|
+
];
|
|
987
|
+
var ChronoterHeader = React5.forwardRef(
|
|
988
|
+
({
|
|
989
|
+
className,
|
|
990
|
+
logoHref = "#",
|
|
991
|
+
navigationLinks = defaultNavigationLinks,
|
|
992
|
+
notificationCount = 3,
|
|
993
|
+
onNavItemClick,
|
|
994
|
+
onInfoItemClick,
|
|
995
|
+
onNotificationItemClick,
|
|
996
|
+
platformComponent,
|
|
997
|
+
config: config2,
|
|
998
|
+
...props
|
|
999
|
+
}, ref) => {
|
|
1000
|
+
const { toggleSidebar } = useSidebar();
|
|
1001
|
+
return /* @__PURE__ */ jsx(
|
|
1002
|
+
"header",
|
|
1003
|
+
{
|
|
1004
|
+
ref,
|
|
1005
|
+
className: cn(
|
|
1006
|
+
"sticky top-0 z-50 w-full border-b bg-background [&_*]:no-underline",
|
|
1007
|
+
className
|
|
1008
|
+
),
|
|
1009
|
+
...props,
|
|
1010
|
+
children: /* @__PURE__ */ jsxs("div", { className: "flex h-16 items-center justify-between gap-4 px-4 md:px-6", children: [
|
|
1011
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
|
|
1012
|
+
/* @__PURE__ */ jsx(
|
|
1013
|
+
Button,
|
|
1014
|
+
{
|
|
1015
|
+
className: "group h-9 w-9 hover:bg-accent hover:text-accent-foreground md:hidden",
|
|
1016
|
+
variant: "ghost",
|
|
1017
|
+
size: "icon",
|
|
1018
|
+
onClick: (event) => {
|
|
1019
|
+
event.preventDefault();
|
|
1020
|
+
toggleSidebar();
|
|
1021
|
+
},
|
|
1022
|
+
children: /* @__PURE__ */ jsx(HamburgerIcon, {})
|
|
1023
|
+
}
|
|
1024
|
+
),
|
|
1025
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-6", children: [
|
|
1026
|
+
/* @__PURE__ */ jsx(
|
|
1027
|
+
"a",
|
|
1028
|
+
{
|
|
1029
|
+
href: logoHref,
|
|
1030
|
+
className: "flex items-center text-primary hover:text-primary/90 transition-colors cursor-pointer",
|
|
1031
|
+
children: /* @__PURE__ */ jsx(
|
|
1032
|
+
SiteLogo,
|
|
1033
|
+
{
|
|
1034
|
+
logoPath: config2?.theme?.logo,
|
|
1035
|
+
logoPathDark: config2?.theme?.logoDark
|
|
1036
|
+
}
|
|
1037
|
+
)
|
|
1038
|
+
}
|
|
1039
|
+
),
|
|
1040
|
+
/* @__PURE__ */ jsx(NavigationMenu, { className: "hidden md:flex", children: /* @__PURE__ */ jsx(NavigationMenuList, { className: "gap-1", children: navigationLinks.map((link) => /* @__PURE__ */ jsx(NavigationMenuItem, { children: /* @__PURE__ */ jsx(
|
|
1041
|
+
NavigationMenuLink,
|
|
1042
|
+
{
|
|
1043
|
+
href: link.href,
|
|
1044
|
+
onClick: (e) => {
|
|
1045
|
+
e.preventDefault();
|
|
1046
|
+
if (onNavItemClick && link.href)
|
|
1047
|
+
onNavItemClick(link.href);
|
|
1048
|
+
},
|
|
1049
|
+
className: "text-muted-foreground hover:text-primary py-1.5 font-medium transition-colors cursor-pointer group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50",
|
|
1050
|
+
children: link.label
|
|
1051
|
+
}
|
|
1052
|
+
) }, link.href || link.label)) }) })
|
|
1053
|
+
] })
|
|
1054
|
+
] }),
|
|
1055
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
|
|
1056
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
|
|
1057
|
+
/* @__PURE__ */ jsx(InfoMenu, { onItemClick: onInfoItemClick }),
|
|
1058
|
+
/* @__PURE__ */ jsx(
|
|
1059
|
+
NotificationMenu,
|
|
1060
|
+
{
|
|
1061
|
+
notificationCount,
|
|
1062
|
+
onItemClick: onNotificationItemClick
|
|
1063
|
+
}
|
|
1064
|
+
)
|
|
1065
|
+
] }),
|
|
1066
|
+
platformComponent
|
|
1067
|
+
] })
|
|
1068
|
+
] })
|
|
1069
|
+
}
|
|
1070
|
+
);
|
|
1071
|
+
}
|
|
1072
|
+
);
|
|
1073
|
+
ChronoterHeader.displayName = "ChronoterHeader";
|
|
1074
|
+
var renderNavigationItems = (items, currentPath, isActive, showStatus, getStatusByPath, StatusIndicator, depth = 1) => {
|
|
1075
|
+
return items.map((item) => {
|
|
1076
|
+
const hasPath = !!item.path;
|
|
1077
|
+
const hasChildren = item.items && item.items.length > 0;
|
|
1078
|
+
const status = hasPath && showStatus ? getStatusByPath(item.path) : void 0;
|
|
1079
|
+
const isCompact = depth >= 2;
|
|
1080
|
+
return /* @__PURE__ */ jsxs(SidebarMenuSubItem, { children: [
|
|
1081
|
+
hasPath ? /* @__PURE__ */ jsx(
|
|
1082
|
+
SidebarMenuSubButton,
|
|
1083
|
+
{
|
|
1084
|
+
asChild: true,
|
|
1085
|
+
isActive: isActive(item.path),
|
|
1086
|
+
size: isCompact ? "sm" : "md",
|
|
1087
|
+
children: /* @__PURE__ */ jsxs("a", { href: item.path, className: "relative flex items-center", children: [
|
|
1088
|
+
/* @__PURE__ */ jsx("span", { className: "truncate pr-4", children: item.title }),
|
|
1089
|
+
status && StatusIndicator && /* @__PURE__ */ jsx(
|
|
1090
|
+
StatusIndicator,
|
|
1091
|
+
{
|
|
1092
|
+
isUnread: status.isUnread,
|
|
1093
|
+
hasUpdate: status.hasUpdate,
|
|
1094
|
+
className: "absolute right-0"
|
|
1095
|
+
}
|
|
1096
|
+
)
|
|
1097
|
+
] })
|
|
1098
|
+
}
|
|
1099
|
+
) : /* @__PURE__ */ jsx(SidebarMenuSubButton, { size: isCompact ? "sm" : "md", children: /* @__PURE__ */ jsx("span", { className: depth > 0 ? "font-normal" : "font-semibold", children: item.title }) }),
|
|
1100
|
+
hasChildren && /* @__PURE__ */ jsx(SidebarMenuSub, { children: renderNavigationItems(
|
|
1101
|
+
item.items,
|
|
1102
|
+
currentPath,
|
|
1103
|
+
isActive,
|
|
1104
|
+
showStatus,
|
|
1105
|
+
getStatusByPath,
|
|
1106
|
+
StatusIndicator,
|
|
1107
|
+
depth + 1
|
|
1108
|
+
) })
|
|
1109
|
+
] }, item.path || item.title);
|
|
1110
|
+
});
|
|
1111
|
+
};
|
|
1112
|
+
var ChronoterSidebar = ({
|
|
1113
|
+
navigation,
|
|
1114
|
+
currentPath = "",
|
|
1115
|
+
platformComponent,
|
|
1116
|
+
statusIndicator: StatusIndicator,
|
|
1117
|
+
getStatusByPath = () => void 0
|
|
1118
|
+
}) => {
|
|
1119
|
+
const showStatus = !!StatusIndicator;
|
|
1120
|
+
const isActive = (path) => {
|
|
1121
|
+
if (!path) return false;
|
|
1122
|
+
return currentPath === path;
|
|
1123
|
+
};
|
|
1124
|
+
return /* @__PURE__ */ jsxs(Sidebar, { className: "md:top-16 md:h-[calc(100svh-4rem)]", children: [
|
|
1125
|
+
/* @__PURE__ */ jsx(SidebarContent, { children: /* @__PURE__ */ jsx(SidebarGroup, { children: /* @__PURE__ */ jsx(SidebarGroupContent, { children: /* @__PURE__ */ jsx(SidebarMenu, { children: navigation.map((item) => {
|
|
1126
|
+
const hasPath = !!item.path;
|
|
1127
|
+
const hasChildren = item.items && item.items.length > 0;
|
|
1128
|
+
const status = hasPath && showStatus ? getStatusByPath(item.path) : void 0;
|
|
1129
|
+
return /* @__PURE__ */ jsxs(SidebarMenuItem, { children: [
|
|
1130
|
+
hasPath ? /* @__PURE__ */ jsx(SidebarMenuButton, { asChild: true, isActive: isActive(item.path), children: /* @__PURE__ */ jsxs(
|
|
1131
|
+
"a",
|
|
1132
|
+
{
|
|
1133
|
+
href: item.path,
|
|
1134
|
+
className: "relative flex items-center",
|
|
1135
|
+
children: [
|
|
1136
|
+
/* @__PURE__ */ jsx("span", { className: "truncate pr-4", children: item.title }),
|
|
1137
|
+
status && StatusIndicator && /* @__PURE__ */ jsx(
|
|
1138
|
+
StatusIndicator,
|
|
1139
|
+
{
|
|
1140
|
+
isUnread: status.isUnread,
|
|
1141
|
+
hasUpdate: status.hasUpdate,
|
|
1142
|
+
className: "absolute right-0"
|
|
1143
|
+
}
|
|
1144
|
+
)
|
|
1145
|
+
]
|
|
1146
|
+
}
|
|
1147
|
+
) }) : /* @__PURE__ */ jsx(SidebarMenuButton, { children: /* @__PURE__ */ jsx("span", { className: "font-semibold", children: item.title }) }),
|
|
1148
|
+
hasChildren && /* @__PURE__ */ jsx(SidebarMenuSub, { children: renderNavigationItems(
|
|
1149
|
+
item.items,
|
|
1150
|
+
currentPath,
|
|
1151
|
+
isActive,
|
|
1152
|
+
showStatus,
|
|
1153
|
+
getStatusByPath,
|
|
1154
|
+
StatusIndicator,
|
|
1155
|
+
1
|
|
1156
|
+
) })
|
|
1157
|
+
] }, item.path || item.title);
|
|
1158
|
+
}) }) }) }) }),
|
|
1159
|
+
/* @__PURE__ */ jsxs(SidebarFooter, { children: [
|
|
1160
|
+
platformComponent,
|
|
1161
|
+
/* @__PURE__ */ jsx("div", { className: "px-2 py-2 text-xs text-muted-foreground", children: /* @__PURE__ */ jsx("p", { children: "\xA9 2025 Chronoter" }) })
|
|
1162
|
+
] })
|
|
1163
|
+
] });
|
|
1164
|
+
};
|
|
1165
|
+
var ChronoterLayout = ({
|
|
1166
|
+
config: config2,
|
|
1167
|
+
currentPath = "",
|
|
1168
|
+
children,
|
|
1169
|
+
navigation: navigationProp,
|
|
1170
|
+
onNavItemClick,
|
|
1171
|
+
onInfoItemClick,
|
|
1172
|
+
onNotificationItemClick,
|
|
1173
|
+
className,
|
|
1174
|
+
platformHeaderComponent,
|
|
1175
|
+
platformSidebarComponent,
|
|
1176
|
+
statusIndicator,
|
|
1177
|
+
getStatusByPath
|
|
1178
|
+
}) => {
|
|
1179
|
+
const navigation = navigationProp || config2.navigation || [];
|
|
1180
|
+
return /* @__PURE__ */ jsx(SidebarProvider, { defaultOpen: true, children: /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col min-h-screen w-full", className), children: [
|
|
1181
|
+
/* @__PURE__ */ jsx(
|
|
1182
|
+
ChronoterHeader,
|
|
1183
|
+
{
|
|
1184
|
+
config: config2,
|
|
1185
|
+
logoHref: "/",
|
|
1186
|
+
navigationLinks: [{ href: "/", label: "Home" }],
|
|
1187
|
+
notificationCount: 0,
|
|
1188
|
+
onNavItemClick,
|
|
1189
|
+
onInfoItemClick,
|
|
1190
|
+
onNotificationItemClick,
|
|
1191
|
+
platformComponent: platformHeaderComponent
|
|
1192
|
+
}
|
|
1193
|
+
),
|
|
1194
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-1", children: [
|
|
1195
|
+
/* @__PURE__ */ jsx(
|
|
1196
|
+
ChronoterSidebar,
|
|
1197
|
+
{
|
|
1198
|
+
navigation,
|
|
1199
|
+
currentPath,
|
|
1200
|
+
platformComponent: platformSidebarComponent,
|
|
1201
|
+
statusIndicator,
|
|
1202
|
+
getStatusByPath
|
|
1203
|
+
}
|
|
1204
|
+
),
|
|
1205
|
+
/* @__PURE__ */ jsx(SidebarInset, { className: "flex flex-col flex-1", children: /* @__PURE__ */ jsx("main", { className: "flex-1 p-4 md:p-6 lg:p-8", children: /* @__PURE__ */ jsx("div", { className: "mx-auto max-w-4xl", children }) }) })
|
|
1206
|
+
] })
|
|
1207
|
+
] }) });
|
|
1208
|
+
};
|
|
1209
|
+
var defaultMDXComponents = {
|
|
1210
|
+
ul: ({ children, ...props }) => /* @__PURE__ */ jsx("ul", { ...props, children: React5__default.Children.map(
|
|
1211
|
+
children,
|
|
1212
|
+
(child, index) => React5__default.isValidElement(child) ? React5__default.cloneElement(child, { key: index }) : child
|
|
1213
|
+
) }),
|
|
1214
|
+
ol: ({ children, ...props }) => /* @__PURE__ */ jsx("ol", { ...props, children: React5__default.Children.map(
|
|
1215
|
+
children,
|
|
1216
|
+
(child, index) => React5__default.isValidElement(child) ? React5__default.cloneElement(child, { key: index }) : child
|
|
1217
|
+
) })
|
|
1218
|
+
};
|
|
1219
|
+
var MDXContent = ({
|
|
1220
|
+
code,
|
|
1221
|
+
frontmatter,
|
|
1222
|
+
components = {}
|
|
1223
|
+
}) => {
|
|
1224
|
+
const MDXComponent = useMemo(() => {
|
|
1225
|
+
try {
|
|
1226
|
+
const fn = new Function(code);
|
|
1227
|
+
const jsxsWithKeys = (type, props) => {
|
|
1228
|
+
if (props?.children && Array.isArray(props.children)) {
|
|
1229
|
+
const childrenWithKeys = props.children.map(
|
|
1230
|
+
(child, index) => {
|
|
1231
|
+
if (React5__default.isValidElement(child) && !child.key) {
|
|
1232
|
+
return React5__default.cloneElement(child, { key: index });
|
|
1233
|
+
}
|
|
1234
|
+
return child;
|
|
1235
|
+
}
|
|
1236
|
+
);
|
|
1237
|
+
const { children, ...restProps } = props;
|
|
1238
|
+
return React5__default.createElement(type, restProps, ...childrenWithKeys);
|
|
1239
|
+
}
|
|
1240
|
+
return React5__default.createElement(type, props);
|
|
1241
|
+
};
|
|
1242
|
+
const runtime = {
|
|
1243
|
+
Fragment: React5__default.Fragment,
|
|
1244
|
+
jsx: React5__default.createElement,
|
|
1245
|
+
jsxs: jsxsWithKeys
|
|
1246
|
+
};
|
|
1247
|
+
const result = fn.call(null, runtime);
|
|
1248
|
+
if (!result || typeof result.default !== "function") {
|
|
1249
|
+
throw new Error("Invalid MDX output: expected { default: Component }");
|
|
1250
|
+
}
|
|
1251
|
+
const MDXContentComponent = result.default;
|
|
1252
|
+
return (props) => {
|
|
1253
|
+
try {
|
|
1254
|
+
return React5__default.createElement(MDXContentComponent, {
|
|
1255
|
+
...props,
|
|
1256
|
+
components: {
|
|
1257
|
+
...defaultMDXComponents,
|
|
1258
|
+
...components,
|
|
1259
|
+
...props.components
|
|
1260
|
+
}
|
|
1261
|
+
});
|
|
1262
|
+
} catch (renderError) {
|
|
1263
|
+
console.error("Failed to render MDX:", renderError);
|
|
1264
|
+
console.error("MDX Code:", code);
|
|
1265
|
+
return /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-red-500 bg-red-50 p-4 text-red-900", children: [
|
|
1266
|
+
/* @__PURE__ */ jsx("h3", { className: "font-semibold", children: "MDX Rendering Error" }),
|
|
1267
|
+
/* @__PURE__ */ jsx("p", { className: "mt-2 text-sm", children: renderError instanceof Error ? renderError.message : String(renderError) }),
|
|
1268
|
+
/* @__PURE__ */ jsxs("details", { className: "mt-2", children: [
|
|
1269
|
+
/* @__PURE__ */ jsx("summary", { className: "cursor-pointer text-sm font-medium", children: "Stack Trace" }),
|
|
1270
|
+
/* @__PURE__ */ jsx("pre", { className: "mt-2 text-xs bg-red-100 p-2 rounded overflow-x-auto", children: renderError instanceof Error ? renderError.stack : "No stack trace available" })
|
|
1271
|
+
] }),
|
|
1272
|
+
/* @__PURE__ */ jsxs("details", { className: "mt-2", children: [
|
|
1273
|
+
/* @__PURE__ */ jsx("summary", { className: "cursor-pointer text-sm font-medium", children: "MDX Code" }),
|
|
1274
|
+
/* @__PURE__ */ jsx("pre", { className: "mt-2 text-xs bg-red-100 p-2 rounded overflow-x-auto whitespace-pre-wrap break-words", children: code })
|
|
1275
|
+
] })
|
|
1276
|
+
] });
|
|
1277
|
+
}
|
|
1278
|
+
};
|
|
1279
|
+
} catch (error) {
|
|
1280
|
+
console.error("Failed to execute MDX:", error);
|
|
1281
|
+
console.error("MDX Code:", code);
|
|
1282
|
+
return () => /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-red-500 bg-red-50 p-4 text-red-900", children: [
|
|
1283
|
+
/* @__PURE__ */ jsx("h3", { className: "font-semibold", children: "MDX Execution Error" }),
|
|
1284
|
+
/* @__PURE__ */ jsx("p", { className: "mt-2 text-sm", children: error instanceof Error ? error.message : String(error) }),
|
|
1285
|
+
/* @__PURE__ */ jsxs("details", { className: "mt-2", children: [
|
|
1286
|
+
/* @__PURE__ */ jsx("summary", { className: "cursor-pointer text-sm font-medium", children: "Stack Trace" }),
|
|
1287
|
+
/* @__PURE__ */ jsx("pre", { className: "mt-2 text-xs bg-red-100 p-2 rounded overflow-x-auto", children: error instanceof Error ? error.stack : "No stack trace available" })
|
|
1288
|
+
] }),
|
|
1289
|
+
/* @__PURE__ */ jsxs("details", { className: "mt-2", children: [
|
|
1290
|
+
/* @__PURE__ */ jsx("summary", { className: "cursor-pointer text-sm font-medium", children: "MDX Code" }),
|
|
1291
|
+
/* @__PURE__ */ jsx("pre", { className: "mt-2 text-xs bg-red-100 p-2 rounded overflow-x-auto whitespace-pre-wrap break-words", children: code })
|
|
1292
|
+
] })
|
|
1293
|
+
] });
|
|
1294
|
+
}
|
|
1295
|
+
}, [code, components]);
|
|
1296
|
+
return /* @__PURE__ */ jsx(MDXComponent, {});
|
|
1297
|
+
};
|
|
1298
|
+
var NotFound = ({ onNavigateHome }) => {
|
|
1299
|
+
return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center min-h-[60vh] px-4 text-center", children: [
|
|
1300
|
+
/* @__PURE__ */ jsx("div", { className: "mb-8", children: /* @__PURE__ */ jsx("h1", { className: "text-9xl font-bold text-muted-foreground/20", children: "404" }) }),
|
|
1301
|
+
/* @__PURE__ */ jsxs("div", { className: "mb-8 space-y-2", children: [
|
|
1302
|
+
/* @__PURE__ */ jsx("h2", { className: "text-3xl font-bold tracking-tight", children: "\u30DA\u30FC\u30B8\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093" }),
|
|
1303
|
+
/* @__PURE__ */ jsx("p", { className: "text-muted-foreground max-w-md", children: "\u304A\u63A2\u3057\u306E\u30DA\u30FC\u30B8\u306F\u5B58\u5728\u3057\u306A\u3044\u304B\u3001\u79FB\u52D5\u307E\u305F\u306F\u524A\u9664\u3055\u308C\u305F\u53EF\u80FD\u6027\u304C\u3042\u308A\u307E\u3059\u3002" })
|
|
1304
|
+
] }),
|
|
1305
|
+
/* @__PURE__ */ jsx("div", { className: "mb-8", children: /* @__PURE__ */ jsx(Button, { size: "lg", onClick: onNavigateHome, className: "min-w-[200px]", children: "\u30DB\u30FC\u30E0\u3078\u623B\u308B" }) })
|
|
1306
|
+
] });
|
|
1307
|
+
};
|
|
1308
|
+
var Page = ({ route, config: config2 }) => {
|
|
1309
|
+
const [processedMDX, setProcessedMDX] = useState(null);
|
|
1310
|
+
const [loading, setLoading] = useState(true);
|
|
1311
|
+
const [error, setError] = useState(null);
|
|
1312
|
+
useEffect(() => {
|
|
1313
|
+
const fetchMDX = async () => {
|
|
1314
|
+
try {
|
|
1315
|
+
setLoading(true);
|
|
1316
|
+
setError(null);
|
|
1317
|
+
const response = await fetch(
|
|
1318
|
+
`/__chronoter_mdx__?path=${encodeURIComponent(route.filePath)}`
|
|
1319
|
+
);
|
|
1320
|
+
if (!response.ok) {
|
|
1321
|
+
throw new Error(
|
|
1322
|
+
`Failed to fetch MDX: ${response.status} ${response.statusText}`
|
|
1323
|
+
);
|
|
1324
|
+
}
|
|
1325
|
+
const data = await response.json();
|
|
1326
|
+
if (!data.code || !data.frontmatter) {
|
|
1327
|
+
throw new Error("Invalid MDX data received from server");
|
|
1328
|
+
}
|
|
1329
|
+
const processedMDX2 = {
|
|
1330
|
+
code: data.code,
|
|
1331
|
+
frontmatter: data.frontmatter,
|
|
1332
|
+
slug: data.slug || route.path.replace(/^\//, "") || "index"
|
|
1333
|
+
};
|
|
1334
|
+
setProcessedMDX(processedMDX2);
|
|
1335
|
+
const title = data.frontmatter.title || config2.site.title;
|
|
1336
|
+
document.title = title;
|
|
1337
|
+
} catch (err) {
|
|
1338
|
+
console.error("Failed to fetch MDX:", err);
|
|
1339
|
+
setError(err instanceof Error ? err : new Error("Failed to fetch MDX"));
|
|
1340
|
+
} finally {
|
|
1341
|
+
setLoading(false);
|
|
1342
|
+
}
|
|
1343
|
+
};
|
|
1344
|
+
fetchMDX();
|
|
1345
|
+
}, [route.path, route.filePath, route.frontmatter, config2.site.title]);
|
|
1346
|
+
if (loading) {
|
|
1347
|
+
return /* @__PURE__ */ jsx(ChronoterLayout, { config: config2, currentPath: route.path, children: /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center min-h-[400px]", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
|
|
1348
|
+
/* @__PURE__ */ jsx("div", { className: "inline-block animate-spin rounded-full h-12 w-12 border-b-2 border-primary" }),
|
|
1349
|
+
/* @__PURE__ */ jsx("p", { className: "mt-4 text-muted-foreground", children: "Loading..." })
|
|
1350
|
+
] }) }) });
|
|
1351
|
+
}
|
|
1352
|
+
if (error || !processedMDX) {
|
|
1353
|
+
return /* @__PURE__ */ jsx(ChronoterLayout, { config: config2, currentPath: route.path, children: /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-red-500 bg-red-50 p-6 text-red-900", children: [
|
|
1354
|
+
/* @__PURE__ */ jsx("h2", { className: "text-xl font-semibold mb-2", children: "Error Loading Page" }),
|
|
1355
|
+
/* @__PURE__ */ jsx("p", { className: "mb-4", children: error?.message || "Failed to load the page content." }),
|
|
1356
|
+
/* @__PURE__ */ jsxs("details", { className: "mt-4", children: [
|
|
1357
|
+
/* @__PURE__ */ jsx("summary", { className: "cursor-pointer text-sm font-medium", children: "Technical Details" }),
|
|
1358
|
+
/* @__PURE__ */ jsx("pre", { className: "mt-2 text-xs bg-red-100 p-2 rounded overflow-x-auto", children: error?.stack || "No stack trace available" })
|
|
1359
|
+
] })
|
|
1360
|
+
] }) });
|
|
1361
|
+
}
|
|
1362
|
+
return /* @__PURE__ */ jsx(ChronoterLayout, { config: config2, currentPath: route.path, children: /* @__PURE__ */ jsx("article", { className: "prose prose-slate dark:prose-invert max-w-none", children: /* @__PURE__ */ jsx(
|
|
1363
|
+
MDXContent,
|
|
1364
|
+
{
|
|
1365
|
+
code: processedMDX.code,
|
|
1366
|
+
frontmatter: processedMDX.frontmatter
|
|
1367
|
+
}
|
|
1368
|
+
) }) });
|
|
1369
|
+
};
|
|
1370
|
+
|
|
1371
|
+
// src/core/routing/navigation-generator.ts
|
|
1372
|
+
var findDirectoryRoute = (dirPath, routes) => {
|
|
1373
|
+
const indexRoute = routes.find((r) => r.path === dirPath);
|
|
1374
|
+
if (indexRoute) {
|
|
1375
|
+
return indexRoute;
|
|
1376
|
+
}
|
|
1377
|
+
const exactRoute = routes.find((r) => r.path === dirPath);
|
|
1378
|
+
if (exactRoute) {
|
|
1379
|
+
return exactRoute;
|
|
1380
|
+
}
|
|
1381
|
+
return null;
|
|
1382
|
+
};
|
|
1383
|
+
var formatTitle = (segment) => {
|
|
1384
|
+
return segment.split("-").map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
|
|
1385
|
+
};
|
|
1386
|
+
var buildHierarchy = (segments, route, routes, tree, currentPath = "") => {
|
|
1387
|
+
if (segments.length === 0) {
|
|
1388
|
+
return;
|
|
1389
|
+
}
|
|
1390
|
+
const [currentSegment, ...remainingSegments] = segments;
|
|
1391
|
+
const newPath = currentPath ? `${currentPath}/${currentSegment}` : `/${currentSegment}`;
|
|
1392
|
+
const key = newPath;
|
|
1393
|
+
let node = tree.get(key);
|
|
1394
|
+
if (!node) {
|
|
1395
|
+
const dirRoute = findDirectoryRoute(newPath, routes);
|
|
1396
|
+
const title = dirRoute?.frontmatter.title || formatTitle(currentSegment);
|
|
1397
|
+
node = {
|
|
1398
|
+
title,
|
|
1399
|
+
path: dirRoute ? newPath : void 0,
|
|
1400
|
+
items: []
|
|
1401
|
+
};
|
|
1402
|
+
tree.set(key, node);
|
|
1403
|
+
}
|
|
1404
|
+
if (remainingSegments.length === 0) {
|
|
1405
|
+
node.path = route.path;
|
|
1406
|
+
node.title = route.frontmatter.title || node.title;
|
|
1407
|
+
} else {
|
|
1408
|
+
if (!node.items) {
|
|
1409
|
+
node.items = [];
|
|
1410
|
+
}
|
|
1411
|
+
buildHierarchy(remainingSegments, route, routes, tree, newPath);
|
|
1412
|
+
}
|
|
1413
|
+
};
|
|
1414
|
+
var buildNavigationItem = (key, tree, processed) => {
|
|
1415
|
+
const item = tree.get(key);
|
|
1416
|
+
if (!item || processed.has(key)) {
|
|
1417
|
+
return null;
|
|
1418
|
+
}
|
|
1419
|
+
processed.add(key);
|
|
1420
|
+
const childKeys = Array.from(tree.keys()).filter((k) => {
|
|
1421
|
+
if (k === key || processed.has(k)) {
|
|
1422
|
+
return false;
|
|
1423
|
+
}
|
|
1424
|
+
const keySegments = key.split("/").filter(Boolean);
|
|
1425
|
+
const kSegments = k.split("/").filter(Boolean);
|
|
1426
|
+
if (kSegments.length !== keySegments.length + 1) {
|
|
1427
|
+
return false;
|
|
1428
|
+
}
|
|
1429
|
+
for (let i = 0; i < keySegments.length; i++) {
|
|
1430
|
+
if (keySegments[i] !== kSegments[i]) {
|
|
1431
|
+
return false;
|
|
1432
|
+
}
|
|
1433
|
+
}
|
|
1434
|
+
return true;
|
|
1435
|
+
}).sort();
|
|
1436
|
+
const childItems = [];
|
|
1437
|
+
for (const childKey of childKeys) {
|
|
1438
|
+
const childItem = buildNavigationItem(childKey, tree, processed);
|
|
1439
|
+
if (childItem) {
|
|
1440
|
+
childItems.push(childItem);
|
|
1441
|
+
}
|
|
1442
|
+
}
|
|
1443
|
+
return {
|
|
1444
|
+
title: item.title,
|
|
1445
|
+
path: item.path,
|
|
1446
|
+
items: childItems.length > 0 ? childItems : void 0
|
|
1447
|
+
};
|
|
1448
|
+
};
|
|
1449
|
+
var convertTreeToHierarchy = (tree) => {
|
|
1450
|
+
const result = [];
|
|
1451
|
+
const processed = /* @__PURE__ */ new Set();
|
|
1452
|
+
const rootKeys = Array.from(tree.keys()).filter((key) => {
|
|
1453
|
+
const segments = key.split("/").filter(Boolean);
|
|
1454
|
+
return segments.length === 1;
|
|
1455
|
+
}).sort();
|
|
1456
|
+
for (const rootKey of rootKeys) {
|
|
1457
|
+
const rootItem = tree.get(rootKey);
|
|
1458
|
+
if (!rootItem || processed.has(rootKey)) {
|
|
1459
|
+
continue;
|
|
1460
|
+
}
|
|
1461
|
+
const item = buildNavigationItem(rootKey, tree, processed);
|
|
1462
|
+
if (item) {
|
|
1463
|
+
result.push(item);
|
|
1464
|
+
}
|
|
1465
|
+
}
|
|
1466
|
+
return result;
|
|
1467
|
+
};
|
|
1468
|
+
var generateNavigationFromRoutes = (routes) => {
|
|
1469
|
+
const tree = /* @__PURE__ */ new Map();
|
|
1470
|
+
const sortedRoutes = [...routes].sort((a, b) => {
|
|
1471
|
+
const depthA = a.path.split("/").filter(Boolean).length;
|
|
1472
|
+
const depthB = b.path.split("/").filter(Boolean).length;
|
|
1473
|
+
if (depthA !== depthB) {
|
|
1474
|
+
return depthA - depthB;
|
|
1475
|
+
}
|
|
1476
|
+
return a.path.localeCompare(b.path);
|
|
1477
|
+
});
|
|
1478
|
+
const rootRoute = routes.find((r) => r.path === "/");
|
|
1479
|
+
if (rootRoute) {
|
|
1480
|
+
const title = rootRoute.frontmatter.title || "Home";
|
|
1481
|
+
tree.set("/", {
|
|
1482
|
+
title,
|
|
1483
|
+
path: rootRoute.path
|
|
1484
|
+
});
|
|
1485
|
+
}
|
|
1486
|
+
for (const route of sortedRoutes) {
|
|
1487
|
+
if (route.path === "/") {
|
|
1488
|
+
continue;
|
|
1489
|
+
}
|
|
1490
|
+
const segments = route.path.split("/").filter(Boolean);
|
|
1491
|
+
buildHierarchy(segments, route, routes, tree);
|
|
1492
|
+
}
|
|
1493
|
+
const navigation = [];
|
|
1494
|
+
const hierarchicalItems = convertTreeToHierarchy(tree);
|
|
1495
|
+
navigation.push(...hierarchicalItems);
|
|
1496
|
+
return navigation;
|
|
1497
|
+
};
|
|
1498
|
+
var DEFAULT_CONFIG = {
|
|
1499
|
+
site: {
|
|
1500
|
+
title: "Chronoter"
|
|
1501
|
+
}
|
|
1502
|
+
};
|
|
1503
|
+
var getConfig = () => {
|
|
1504
|
+
if (typeof document === "undefined") {
|
|
1505
|
+
return DEFAULT_CONFIG;
|
|
1506
|
+
}
|
|
1507
|
+
const configElement = document.getElementById("chronoter-config");
|
|
1508
|
+
if (configElement?.textContent) {
|
|
1509
|
+
try {
|
|
1510
|
+
return JSON.parse(configElement.textContent);
|
|
1511
|
+
} catch (e) {
|
|
1512
|
+
console.error("[Chronoter] Failed to parse config:", e);
|
|
1513
|
+
}
|
|
1514
|
+
}
|
|
1515
|
+
return DEFAULT_CONFIG;
|
|
1516
|
+
};
|
|
1517
|
+
var config = getConfig();
|
|
1518
|
+
var App = ({ initialPath }) => {
|
|
1519
|
+
React5__default.useEffect(() => {
|
|
1520
|
+
console.log("[Chronoter] Config loaded:", config);
|
|
1521
|
+
}, []);
|
|
1522
|
+
const [currentPath, setCurrentPath] = React5__default.useState(initialPath);
|
|
1523
|
+
const [route, setRoute] = React5__default.useState(null);
|
|
1524
|
+
const [navigation, setNavigation] = React5__default.useState(
|
|
1525
|
+
config.navigation || []
|
|
1526
|
+
);
|
|
1527
|
+
const [loading, setLoading] = React5__default.useState(true);
|
|
1528
|
+
const [error, setError] = React5__default.useState(null);
|
|
1529
|
+
React5__default.useEffect(() => {
|
|
1530
|
+
const handlePopState = () => {
|
|
1531
|
+
setCurrentPath(window.location.pathname);
|
|
1532
|
+
};
|
|
1533
|
+
window.addEventListener("popstate", handlePopState);
|
|
1534
|
+
return () => {
|
|
1535
|
+
window.removeEventListener("popstate", handlePopState);
|
|
1536
|
+
};
|
|
1537
|
+
}, []);
|
|
1538
|
+
React5__default.useEffect(() => {
|
|
1539
|
+
const fetchAndGenerateNavigation = async () => {
|
|
1540
|
+
if (config.navigation && config.navigation.length > 0) {
|
|
1541
|
+
return;
|
|
1542
|
+
}
|
|
1543
|
+
try {
|
|
1544
|
+
const response = await fetch("/__chronoter_all_routes__");
|
|
1545
|
+
if (!response.ok) {
|
|
1546
|
+
console.error("Failed to fetch all routes:", response.statusText);
|
|
1547
|
+
return;
|
|
1548
|
+
}
|
|
1549
|
+
const data = await response.json();
|
|
1550
|
+
if (!data.routes || !Array.isArray(data.routes)) {
|
|
1551
|
+
console.error("Invalid routes data received from server");
|
|
1552
|
+
return;
|
|
1553
|
+
}
|
|
1554
|
+
const generatedNavigation = generateNavigationFromRoutes(data.routes);
|
|
1555
|
+
console.log("[Chronoter] Generated navigation:", generatedNavigation);
|
|
1556
|
+
setNavigation(generatedNavigation);
|
|
1557
|
+
} catch (err) {
|
|
1558
|
+
console.error("Failed to generate navigation:", err);
|
|
1559
|
+
}
|
|
1560
|
+
};
|
|
1561
|
+
fetchAndGenerateNavigation();
|
|
1562
|
+
}, []);
|
|
1563
|
+
React5__default.useEffect(() => {
|
|
1564
|
+
const fetchRoute = async () => {
|
|
1565
|
+
try {
|
|
1566
|
+
setLoading(true);
|
|
1567
|
+
setError(null);
|
|
1568
|
+
const response = await fetch(
|
|
1569
|
+
`/__chronoter_routes__?path=${encodeURIComponent(currentPath)}`
|
|
1570
|
+
);
|
|
1571
|
+
if (!response.ok) {
|
|
1572
|
+
if (response.status === 404) {
|
|
1573
|
+
setRoute(null);
|
|
1574
|
+
setLoading(false);
|
|
1575
|
+
return;
|
|
1576
|
+
}
|
|
1577
|
+
throw new Error(
|
|
1578
|
+
`Failed to fetch route: ${response.status} ${response.statusText}`
|
|
1579
|
+
);
|
|
1580
|
+
}
|
|
1581
|
+
const data = await response.json();
|
|
1582
|
+
if (!data.path || !data.filePath || !data.frontmatter) {
|
|
1583
|
+
throw new Error("Invalid route data received from server");
|
|
1584
|
+
}
|
|
1585
|
+
const route2 = {
|
|
1586
|
+
path: data.path,
|
|
1587
|
+
filePath: data.filePath,
|
|
1588
|
+
frontmatter: data.frontmatter
|
|
1589
|
+
};
|
|
1590
|
+
setRoute(route2);
|
|
1591
|
+
} catch (err) {
|
|
1592
|
+
console.error("Failed to fetch route:", err);
|
|
1593
|
+
setError(
|
|
1594
|
+
err instanceof Error ? err : new Error("Failed to fetch route")
|
|
1595
|
+
);
|
|
1596
|
+
} finally {
|
|
1597
|
+
setLoading(false);
|
|
1598
|
+
}
|
|
1599
|
+
};
|
|
1600
|
+
fetchRoute();
|
|
1601
|
+
}, [currentPath]);
|
|
1602
|
+
if (loading) {
|
|
1603
|
+
return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center min-h-screen", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
|
|
1604
|
+
/* @__PURE__ */ jsx("div", { className: "inline-block animate-spin rounded-full h-16 w-16 border-b-2 border-primary" }),
|
|
1605
|
+
/* @__PURE__ */ jsx("p", { className: "mt-4 text-lg text-muted-foreground", children: "Loading..." })
|
|
1606
|
+
] }) });
|
|
1607
|
+
}
|
|
1608
|
+
if (error) {
|
|
1609
|
+
return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center min-h-screen p-4", children: /* @__PURE__ */ jsxs("div", { className: "max-w-2xl w-full rounded-md border border-red-500 bg-red-50 p-6 text-red-900", children: [
|
|
1610
|
+
/* @__PURE__ */ jsx("h2", { className: "text-2xl font-semibold mb-2", children: "Application Error" }),
|
|
1611
|
+
/* @__PURE__ */ jsx("p", { className: "mb-4", children: error.message }),
|
|
1612
|
+
/* @__PURE__ */ jsxs("details", { className: "mt-4", children: [
|
|
1613
|
+
/* @__PURE__ */ jsx("summary", { className: "cursor-pointer text-sm font-medium", children: "Technical Details" }),
|
|
1614
|
+
/* @__PURE__ */ jsx("pre", { className: "mt-2 text-xs bg-red-100 p-2 rounded overflow-x-auto", children: error.stack || "No stack trace available" })
|
|
1615
|
+
] })
|
|
1616
|
+
] }) });
|
|
1617
|
+
}
|
|
1618
|
+
if (!route) {
|
|
1619
|
+
return /* @__PURE__ */ jsx(NotFound, {});
|
|
1620
|
+
}
|
|
1621
|
+
const configWithNavigation = {
|
|
1622
|
+
...config,
|
|
1623
|
+
navigation
|
|
1624
|
+
};
|
|
1625
|
+
return /* @__PURE__ */ jsx(Page, { route, config: configWithNavigation });
|
|
1626
|
+
};
|
|
1627
|
+
var mountApp = () => {
|
|
1628
|
+
const rootElement = document.getElementById("root");
|
|
1629
|
+
if (!rootElement) {
|
|
1630
|
+
throw new Error(
|
|
1631
|
+
"Root element not found. Make sure there is a <div id='root'></div> in your HTML."
|
|
1632
|
+
);
|
|
1633
|
+
}
|
|
1634
|
+
const root = createRoot(rootElement);
|
|
1635
|
+
root.render(
|
|
1636
|
+
/* @__PURE__ */ jsx(React5__default.StrictMode, { children: /* @__PURE__ */ jsx(App, { initialPath: window.location.pathname }) })
|
|
1637
|
+
);
|
|
1638
|
+
};
|
|
1639
|
+
if (document.readyState === "loading") {
|
|
1640
|
+
document.addEventListener("DOMContentLoaded", mountApp);
|
|
1641
|
+
} else {
|
|
1642
|
+
mountApp();
|
|
1643
|
+
}
|