@brainfish-ai/components 0.19.7 → 0.20.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/chunks/{ChatSearch.DOH90EUx.js → ChatSearch.DBiDqJZy.js} +2 -2
- package/dist/esm/chunks/{ChatSearch.DOH90EUx.js.map → ChatSearch.DBiDqJZy.js.map} +1 -1
- package/dist/esm/{components/header-nav.js → chunks/header-nav.FxSa8fGL.js} +13 -8
- package/dist/esm/chunks/header-nav.FxSa8fGL.js.map +1 -0
- package/dist/esm/chunks/{hooks.B9tkXVNJ.js → hooks.CKojclfe.js} +2 -2
- package/dist/esm/chunks/{hooks.B9tkXVNJ.js.map → hooks.CKojclfe.js.map} +1 -1
- package/dist/esm/{components/sidebar.js → chunks/sidebar.NrHnIkbU.js} +18 -15
- package/dist/esm/chunks/sidebar.NrHnIkbU.js.map +1 -0
- package/dist/esm/components/chat-search.js +1 -1
- package/dist/esm/global.css +1 -1
- package/dist/esm/index.js +3 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/layouts/full-layout.js +407 -0
- package/dist/esm/layouts/full-layout.js.map +1 -0
- package/dist/esm/layouts/header-nav.js +2 -0
- package/dist/esm/layouts/header-nav.js.map +1 -0
- package/dist/esm/layouts/sidebar.js +2 -0
- package/dist/esm/layouts/sidebar.js.map +1 -0
- package/dist/full-layout.d.ts +155 -0
- package/dist/header-nav.d.ts +6 -0
- package/dist/index.d.ts +80 -0
- package/dist/layouts/full-layout.d.ts +4 -0
- package/dist/layouts/header-nav.d.ts +2 -0
- package/dist/layouts/sidebar.d.ts +2 -0
- package/dist/stats.html +1 -1
- package/package.json +20 -13
- package/dist/esm/components/header-nav.js.map +0 -1
- package/dist/esm/components/sidebar.js.map +0 -1
|
@@ -0,0 +1,407 @@
|
|
|
1
|
+
import React__default, { useContext, useState, useRef, useEffect, useCallback, useMemo, isValidElement } from 'react';
|
|
2
|
+
import { useMediaQuery } from 'usehooks-ts';
|
|
3
|
+
import { a as HeaderNav, H as HEADER_NAV_HEIGHT } from '../chunks/header-nav.FxSa8fGL.js';
|
|
4
|
+
import { ScrollArea } from '../components/ui/scroll-area.js';
|
|
5
|
+
import { c as cn } from '../chunks/utils.Cwtlq8dh.js';
|
|
6
|
+
import { Item } from '../components/ui/item.js';
|
|
7
|
+
import { S as Sidebar } from '../chunks/sidebar.NrHnIkbU.js';
|
|
8
|
+
|
|
9
|
+
const FullLayoutNavStateContext = React__default.createContext(null);
|
|
10
|
+
const FullLayoutContext = React__default.createContext(null);
|
|
11
|
+
function FullLayoutProvider({ value, children }) {
|
|
12
|
+
return /* @__PURE__ */ React__default.createElement(FullLayoutContext.Provider, { value }, children);
|
|
13
|
+
}
|
|
14
|
+
function useFullLayoutContext() {
|
|
15
|
+
return React__default.useContext(FullLayoutContext);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
function MainArea({ children }) {
|
|
19
|
+
return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children);
|
|
20
|
+
}
|
|
21
|
+
MainArea.displayName = "FullLayout.MainArea";
|
|
22
|
+
|
|
23
|
+
function Body({ children }) {
|
|
24
|
+
return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children);
|
|
25
|
+
}
|
|
26
|
+
Body.displayName = "FullLayout.Body";
|
|
27
|
+
|
|
28
|
+
function Header(props) {
|
|
29
|
+
const ctx = useFullLayoutContext();
|
|
30
|
+
if (!ctx) return null;
|
|
31
|
+
return /* @__PURE__ */ React__default.createElement(
|
|
32
|
+
HeaderNav,
|
|
33
|
+
{
|
|
34
|
+
...props,
|
|
35
|
+
showSidebarToggle: !ctx.disableLeftSideNav,
|
|
36
|
+
isSideNavOpen: ctx.isSideNavOpen,
|
|
37
|
+
onSideNavigationToggle: ctx.toggleSidebar,
|
|
38
|
+
onHelpClick: ctx.openRightSidebar,
|
|
39
|
+
sidebarToggleRef: ctx.sidebarToggleRef
|
|
40
|
+
}
|
|
41
|
+
);
|
|
42
|
+
}
|
|
43
|
+
Header.displayName = "FullLayout.Header";
|
|
44
|
+
|
|
45
|
+
const FullLayoutLeftSidebar = React__default.forwardRef(
|
|
46
|
+
({
|
|
47
|
+
open,
|
|
48
|
+
widthPx,
|
|
49
|
+
onResizeStart,
|
|
50
|
+
onResizeKeyDown,
|
|
51
|
+
ariaValuenow,
|
|
52
|
+
ariaValuemin,
|
|
53
|
+
ariaValuemax,
|
|
54
|
+
sidebarProps,
|
|
55
|
+
className,
|
|
56
|
+
...props
|
|
57
|
+
}, ref) => {
|
|
58
|
+
return /* @__PURE__ */ React__default.createElement(
|
|
59
|
+
"div",
|
|
60
|
+
{
|
|
61
|
+
ref,
|
|
62
|
+
id: "left-sidebar-pane",
|
|
63
|
+
"data-slot": "full-layout-left-sidebar",
|
|
64
|
+
tabIndex: -1,
|
|
65
|
+
"data-state": open ? "open" : "closed",
|
|
66
|
+
className: cn(
|
|
67
|
+
"min-w-0 overflow-hidden flex flex-col relative transition-[width] data-[state=closed]:w-0 data-[state=closed]:pointer-events-none data-[state=open]:w-full md:data-[state=open]:w-[var(--left-nav-width)]",
|
|
68
|
+
className
|
|
69
|
+
),
|
|
70
|
+
style: {
|
|
71
|
+
["--left-nav-width"]: `${widthPx}px`
|
|
72
|
+
},
|
|
73
|
+
...props
|
|
74
|
+
},
|
|
75
|
+
/* @__PURE__ */ React__default.createElement(ScrollArea, { className: "h-[calc(100dvh-var(--header-nav-height))]" }, /* @__PURE__ */ React__default.createElement(Sidebar, { ...sidebarProps, collapsed: !open, className: "w-[inherit] transition-[width]" })),
|
|
76
|
+
/* @__PURE__ */ React__default.createElement(
|
|
77
|
+
"div",
|
|
78
|
+
{
|
|
79
|
+
role: "separator",
|
|
80
|
+
"aria-orientation": "vertical",
|
|
81
|
+
"aria-valuenow": ariaValuenow,
|
|
82
|
+
"aria-valuemin": ariaValuemin,
|
|
83
|
+
"aria-valuemax": ariaValuemax,
|
|
84
|
+
"aria-label": "Resize left sidebar",
|
|
85
|
+
"aria-controls": "left-sidebar-pane",
|
|
86
|
+
"data-slot": "full-layout-left-sidebar-resize-handle",
|
|
87
|
+
tabIndex: 0,
|
|
88
|
+
onMouseDown: onResizeStart,
|
|
89
|
+
onKeyDown: onResizeKeyDown,
|
|
90
|
+
className: "hidden lg:block absolute top-0 right-0 bottom-0 w-1 bg-transparent hover:bg-blue-500 cursor-ew-resize shrink-0 [&>div]:pointer-events-none"
|
|
91
|
+
},
|
|
92
|
+
/* @__PURE__ */ React__default.createElement("div", { className: "absolute inset-y-0 -right-1 w-3" })
|
|
93
|
+
)
|
|
94
|
+
);
|
|
95
|
+
}
|
|
96
|
+
);
|
|
97
|
+
FullLayoutLeftSidebar.displayName = "FullLayoutLeftSidebar";
|
|
98
|
+
|
|
99
|
+
function LeftSidebar(props) {
|
|
100
|
+
const ctx = useFullLayoutContext();
|
|
101
|
+
const navState = useContext(FullLayoutNavStateContext);
|
|
102
|
+
if (!ctx) return null;
|
|
103
|
+
if (ctx.disableLeftSideNav) return null;
|
|
104
|
+
const sidebarProps = navState != null ? {
|
|
105
|
+
...props,
|
|
106
|
+
appNavActiveId: navState.appNavActiveId ?? props.appNavActiveId,
|
|
107
|
+
sectionNavActiveId: navState.sectionNavActiveId ?? props.sectionNavActiveId,
|
|
108
|
+
activeArticleId: navState.activeArticleId ?? props.activeArticleId
|
|
109
|
+
} : props;
|
|
110
|
+
return /* @__PURE__ */ React__default.createElement(
|
|
111
|
+
FullLayoutLeftSidebar,
|
|
112
|
+
{
|
|
113
|
+
ref: ctx.sideNavRef,
|
|
114
|
+
open: ctx.isSideNavOpen,
|
|
115
|
+
widthPx: ctx.leftNavWidth,
|
|
116
|
+
onResizeStart: ctx.handleResizeStart,
|
|
117
|
+
onResizeKeyDown: ctx.handleResizeKeyDown,
|
|
118
|
+
ariaValuenow: ctx.ariaValuenow,
|
|
119
|
+
ariaValuemin: ctx.ariaValuemin,
|
|
120
|
+
ariaValuemax: ctx.ariaValuemax,
|
|
121
|
+
sidebarProps
|
|
122
|
+
}
|
|
123
|
+
);
|
|
124
|
+
}
|
|
125
|
+
LeftSidebar.displayName = "FullLayout.LeftSidebar";
|
|
126
|
+
|
|
127
|
+
function Main({ children }) {
|
|
128
|
+
return /* @__PURE__ */ React__default.createElement(Item, { className: "p-0" }, children);
|
|
129
|
+
}
|
|
130
|
+
Main.displayName = "FullLayout.Main";
|
|
131
|
+
|
|
132
|
+
const FullLayoutRightSidebar = React__default.forwardRef(
|
|
133
|
+
({ open, className, children, ...props }, ref) => {
|
|
134
|
+
return /* @__PURE__ */ React__default.createElement(
|
|
135
|
+
"aside",
|
|
136
|
+
{
|
|
137
|
+
ref,
|
|
138
|
+
"data-slot": "full-layout-right-sidebar",
|
|
139
|
+
"data-state": open ? "open" : "closed",
|
|
140
|
+
className: cn(
|
|
141
|
+
"bg-background shadow-lg flex flex-col",
|
|
142
|
+
"fixed h-[calc(100dvh-var(--header-nav-height))] z-10 w-screen transition-transform duration-300 ease-in-out data-[state=closed]:translate-x-full data-[state=open]:translate-x-0",
|
|
143
|
+
"md:relative md:h-full md:w-80 md:top-0",
|
|
144
|
+
className
|
|
145
|
+
),
|
|
146
|
+
...props
|
|
147
|
+
},
|
|
148
|
+
/* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col flex-1 min-h-0 overflow-hidden", "data-slot": "full-layout-right-sidebar-content" }, /* @__PURE__ */ React__default.createElement(ScrollArea, { className: "h-[calc(100dvh-var(--header-nav-height))]" }, children))
|
|
149
|
+
);
|
|
150
|
+
}
|
|
151
|
+
);
|
|
152
|
+
FullLayoutRightSidebar.displayName = "FullLayoutRightSidebar";
|
|
153
|
+
|
|
154
|
+
function RightSidebar({ children }) {
|
|
155
|
+
const ctx = useFullLayoutContext();
|
|
156
|
+
if (!ctx) return null;
|
|
157
|
+
return /* @__PURE__ */ React__default.createElement(
|
|
158
|
+
FullLayoutRightSidebar,
|
|
159
|
+
{
|
|
160
|
+
ref: ctx.rightSidebarRef,
|
|
161
|
+
open: ctx.isRightSidebarOpen,
|
|
162
|
+
className: "top-[var(--header-nav-height)]"
|
|
163
|
+
},
|
|
164
|
+
children
|
|
165
|
+
);
|
|
166
|
+
}
|
|
167
|
+
RightSidebar.displayName = "FullLayout.RightSidebar";
|
|
168
|
+
|
|
169
|
+
const MIN_SIDENAV_WIDTH = 260;
|
|
170
|
+
const CLOSE_SIDENAV_THRESHOLD = MIN_SIDENAV_WIDTH - 32;
|
|
171
|
+
const MAX_SIDENAV_WIDTH = 350;
|
|
172
|
+
const RIGHT_SIDEBAR_WIDTH = 320;
|
|
173
|
+
function extractSlots(children, refs) {
|
|
174
|
+
const out = {};
|
|
175
|
+
const arr = React__default.Children.toArray(children);
|
|
176
|
+
for (const key of Object.keys(refs)) {
|
|
177
|
+
const match = arr.find((c) => isValidElement(c) && c.type === refs[key]);
|
|
178
|
+
out[key] = match ?? null;
|
|
179
|
+
}
|
|
180
|
+
return out;
|
|
181
|
+
}
|
|
182
|
+
function FullLayoutRoot({ children, disableLeftSideNav = false, className }) {
|
|
183
|
+
const [isSideNavOpen, setIsSideNavOpen] = useState(() => typeof window !== "undefined" && window.innerWidth > 767);
|
|
184
|
+
const [isRightSidebarOpen, setIsRightSidebarOpen] = useState(false);
|
|
185
|
+
const [leftNavWidth, setLeftNavWidth] = useState(MIN_SIDENAV_WIDTH);
|
|
186
|
+
const [isResizing, setIsResizing] = useState(false);
|
|
187
|
+
const [gridWidth, setGridWidth] = useState(() => typeof window !== "undefined" ? window.innerWidth : 0);
|
|
188
|
+
const sideNavRef = useRef(null);
|
|
189
|
+
const rightSidebarRef = useRef(null);
|
|
190
|
+
const sidebarToggleRef = useRef(null);
|
|
191
|
+
const gridRef = useRef(null);
|
|
192
|
+
const prevSideNavOpenRef = useRef(isSideNavOpen);
|
|
193
|
+
const resizeAcRef = useRef(null);
|
|
194
|
+
const isMobile = useMediaQuery("(max-width: 767px)");
|
|
195
|
+
const isWideDesktop = useMediaQuery("(min-width: 1280px)");
|
|
196
|
+
useEffect(() => {
|
|
197
|
+
document.body.style.overflow = "hidden";
|
|
198
|
+
return () => {
|
|
199
|
+
document.body.style.overflow = "";
|
|
200
|
+
};
|
|
201
|
+
}, []);
|
|
202
|
+
useEffect(() => {
|
|
203
|
+
const el = gridRef.current;
|
|
204
|
+
if (!el) return;
|
|
205
|
+
const ro = new ResizeObserver(([entry]) => setGridWidth(entry.contentRect.width));
|
|
206
|
+
ro.observe(el);
|
|
207
|
+
return () => ro.disconnect();
|
|
208
|
+
}, []);
|
|
209
|
+
const closeOtherSidebar = useCallback(
|
|
210
|
+
(opening) => {
|
|
211
|
+
if (isWideDesktop) return;
|
|
212
|
+
if (opening === "left") setIsRightSidebarOpen(false);
|
|
213
|
+
else setIsSideNavOpen(false);
|
|
214
|
+
},
|
|
215
|
+
[isWideDesktop]
|
|
216
|
+
);
|
|
217
|
+
const showSidenav = useCallback(() => {
|
|
218
|
+
closeOtherSidebar("left");
|
|
219
|
+
setIsSideNavOpen(true);
|
|
220
|
+
setLeftNavWidth(MIN_SIDENAV_WIDTH);
|
|
221
|
+
sideNavRef.current?.focus();
|
|
222
|
+
}, [closeOtherSidebar]);
|
|
223
|
+
const toggleSidebar = useCallback(() => {
|
|
224
|
+
closeOtherSidebar("left");
|
|
225
|
+
setIsSideNavOpen((prev) => !prev);
|
|
226
|
+
}, [closeOtherSidebar]);
|
|
227
|
+
const toggleRightSidebar = useCallback(() => {
|
|
228
|
+
closeOtherSidebar("right");
|
|
229
|
+
setIsRightSidebarOpen((prev) => !prev);
|
|
230
|
+
}, [closeOtherSidebar]);
|
|
231
|
+
const applyLeftNavWidth = useCallback((newWidth, useThreshold = true) => {
|
|
232
|
+
const threshold = useThreshold ? CLOSE_SIDENAV_THRESHOLD : MIN_SIDENAV_WIDTH;
|
|
233
|
+
if (newWidth < threshold) {
|
|
234
|
+
setLeftNavWidth(MIN_SIDENAV_WIDTH);
|
|
235
|
+
setIsSideNavOpen(false);
|
|
236
|
+
return true;
|
|
237
|
+
} else {
|
|
238
|
+
setLeftNavWidth(Math.min(MAX_SIDENAV_WIDTH, newWidth));
|
|
239
|
+
return false;
|
|
240
|
+
}
|
|
241
|
+
}, []);
|
|
242
|
+
const handleResizeStart = useCallback((e) => {
|
|
243
|
+
e.preventDefault();
|
|
244
|
+
resizeAcRef.current = new AbortController();
|
|
245
|
+
setIsResizing(true);
|
|
246
|
+
}, []);
|
|
247
|
+
const endResize = useCallback(() => {
|
|
248
|
+
setIsResizing(false);
|
|
249
|
+
document.body.style.cursor = "";
|
|
250
|
+
document.body.style.userSelect = "";
|
|
251
|
+
}, []);
|
|
252
|
+
const handleMouseMove = useCallback(
|
|
253
|
+
(e) => {
|
|
254
|
+
if (!isResizing) return;
|
|
255
|
+
if (applyLeftNavWidth(e.clientX)) {
|
|
256
|
+
endResize();
|
|
257
|
+
}
|
|
258
|
+
},
|
|
259
|
+
[isResizing, applyLeftNavWidth, endResize]
|
|
260
|
+
);
|
|
261
|
+
const handleMouseUp = useCallback(() => endResize(), [endResize]);
|
|
262
|
+
const setInert = useCallback((el, open) => {
|
|
263
|
+
if (!el) return;
|
|
264
|
+
if (open) el.removeAttribute("inert");
|
|
265
|
+
else el.setAttribute("inert", "");
|
|
266
|
+
}, []);
|
|
267
|
+
useEffect(() => {
|
|
268
|
+
setInert(sideNavRef.current, isSideNavOpen);
|
|
269
|
+
setInert(rightSidebarRef.current, isRightSidebarOpen);
|
|
270
|
+
}, [isSideNavOpen, isRightSidebarOpen]);
|
|
271
|
+
useEffect(() => {
|
|
272
|
+
if (!isResizing || !resizeAcRef.current) return;
|
|
273
|
+
const { signal } = resizeAcRef.current;
|
|
274
|
+
document.body.style.cursor = "ew-resize";
|
|
275
|
+
document.body.style.userSelect = "none";
|
|
276
|
+
document.addEventListener("mousemove", handleMouseMove, { signal });
|
|
277
|
+
document.addEventListener("mouseup", handleMouseUp, { signal });
|
|
278
|
+
window.addEventListener("mouseup", handleMouseUp, { signal });
|
|
279
|
+
setInert(sideNavRef.current, false);
|
|
280
|
+
return () => {
|
|
281
|
+
resizeAcRef.current?.abort();
|
|
282
|
+
resizeAcRef.current = null;
|
|
283
|
+
document.body.style.cursor = "";
|
|
284
|
+
document.body.style.userSelect = "";
|
|
285
|
+
setInert(sideNavRef.current, true);
|
|
286
|
+
};
|
|
287
|
+
}, [isResizing]);
|
|
288
|
+
const handleResizeKeyDown = useCallback(
|
|
289
|
+
(e) => {
|
|
290
|
+
const step = 16;
|
|
291
|
+
if (e.key === "ArrowLeft") {
|
|
292
|
+
e.preventDefault();
|
|
293
|
+
applyLeftNavWidth(leftNavWidth - step, false);
|
|
294
|
+
} else if (e.key === "ArrowRight") {
|
|
295
|
+
e.preventDefault();
|
|
296
|
+
applyLeftNavWidth(Math.min(MAX_SIDENAV_WIDTH, leftNavWidth + step));
|
|
297
|
+
}
|
|
298
|
+
},
|
|
299
|
+
[leftNavWidth]
|
|
300
|
+
);
|
|
301
|
+
const leftCol = disableLeftSideNav ? 0 : isSideNavOpen ? isMobile ? gridWidth : leftNavWidth : 0;
|
|
302
|
+
const rightCol = isMobile ? 0 : isRightSidebarOpen ? RIGHT_SIDEBAR_WIDTH : 0;
|
|
303
|
+
useEffect(() => {
|
|
304
|
+
setIsSideNavOpen(isMobile ? false : true);
|
|
305
|
+
}, [isMobile]);
|
|
306
|
+
useEffect(() => {
|
|
307
|
+
if (prevSideNavOpenRef.current && !isSideNavOpen) {
|
|
308
|
+
sidebarToggleRef.current?.focus();
|
|
309
|
+
}
|
|
310
|
+
prevSideNavOpenRef.current = isSideNavOpen;
|
|
311
|
+
}, [isSideNavOpen]);
|
|
312
|
+
const ariaValuenow = Math.round((leftNavWidth - MIN_SIDENAV_WIDTH) / (MAX_SIDENAV_WIDTH - MIN_SIDENAV_WIDTH) * 100);
|
|
313
|
+
const layoutContextValue = useMemo(
|
|
314
|
+
() => ({
|
|
315
|
+
isSideNavOpen,
|
|
316
|
+
isRightSidebarOpen,
|
|
317
|
+
toggleSidebar,
|
|
318
|
+
openRightSidebar: toggleRightSidebar,
|
|
319
|
+
showSidenav,
|
|
320
|
+
disableLeftSideNav: disableLeftSideNav ?? false,
|
|
321
|
+
leftNavWidth,
|
|
322
|
+
isMobile,
|
|
323
|
+
sideNavRef,
|
|
324
|
+
rightSidebarRef,
|
|
325
|
+
sidebarToggleRef,
|
|
326
|
+
handleResizeStart,
|
|
327
|
+
handleResizeKeyDown,
|
|
328
|
+
ariaValuenow,
|
|
329
|
+
ariaValuemin: 0,
|
|
330
|
+
ariaValuemax: 100
|
|
331
|
+
}),
|
|
332
|
+
[
|
|
333
|
+
isSideNavOpen,
|
|
334
|
+
isRightSidebarOpen,
|
|
335
|
+
toggleSidebar,
|
|
336
|
+
toggleRightSidebar,
|
|
337
|
+
showSidenav,
|
|
338
|
+
leftNavWidth,
|
|
339
|
+
isMobile,
|
|
340
|
+
disableLeftSideNav,
|
|
341
|
+
handleResizeStart,
|
|
342
|
+
handleResizeKeyDown,
|
|
343
|
+
ariaValuenow
|
|
344
|
+
]
|
|
345
|
+
);
|
|
346
|
+
const { MainArea: mainArea, RightSidebar: rightSidebar } = extractSlots(children, {
|
|
347
|
+
MainArea: MainArea,
|
|
348
|
+
RightSidebar: RightSidebar
|
|
349
|
+
});
|
|
350
|
+
const mainAreaChildren = isValidElement(mainArea) ? mainArea.props.children : null;
|
|
351
|
+
const { Header: header, Body: body } = extractSlots(mainAreaChildren ?? null, {
|
|
352
|
+
Header: Header,
|
|
353
|
+
Body: Body
|
|
354
|
+
});
|
|
355
|
+
const bodyChildren = isValidElement(body) ? body.props.children : null;
|
|
356
|
+
const { LeftSidebar: leftSidebar, Main: main } = extractSlots(bodyChildren ?? null, {
|
|
357
|
+
LeftSidebar: LeftSidebar,
|
|
358
|
+
Main: Main
|
|
359
|
+
});
|
|
360
|
+
const hasRightSidebar = rightSidebar != null;
|
|
361
|
+
return /* @__PURE__ */ React__default.createElement(FullLayoutProvider, { value: layoutContextValue }, /* @__PURE__ */ React__default.createElement(
|
|
362
|
+
"div",
|
|
363
|
+
{
|
|
364
|
+
className: cn(
|
|
365
|
+
"min-h-screen w-screen bg-background grid transition-[grid-template-columns] duration-300 ease-in-out",
|
|
366
|
+
className
|
|
367
|
+
),
|
|
368
|
+
style: {
|
|
369
|
+
gridTemplateColumns: hasRightSidebar ? "minmax(0, 1fr) var(--right-col)" : "minmax(0, 1fr)",
|
|
370
|
+
["--right-col"]: hasRightSidebar ? `${rightCol}px` : "0px",
|
|
371
|
+
["--header-nav-height"]: `${HEADER_NAV_HEIGHT}px`
|
|
372
|
+
}
|
|
373
|
+
},
|
|
374
|
+
/* @__PURE__ */ React__default.createElement("div", { className: "min-w-0 grid grid-rows-[auto_1fr]" }, header, /* @__PURE__ */ React__default.createElement(
|
|
375
|
+
"div",
|
|
376
|
+
{
|
|
377
|
+
ref: gridRef,
|
|
378
|
+
"data-sidenav-state": isSideNavOpen ? "open" : "closed",
|
|
379
|
+
"data-right-sidebar-state": isRightSidebarOpen ? "open" : "closed",
|
|
380
|
+
className: cn(
|
|
381
|
+
"group/sidenav group/rightsidebar min-h-0 min-w-0 grid transition-[grid-template-columns] ease-linear"
|
|
382
|
+
),
|
|
383
|
+
style: {
|
|
384
|
+
gridTemplateColumns: `var(--left-col) minmax(0, 1fr)`,
|
|
385
|
+
["--left-col"]: `${leftCol}px`
|
|
386
|
+
}
|
|
387
|
+
},
|
|
388
|
+
disableLeftSideNav ? /* @__PURE__ */ React__default.createElement("div", { className: "w-0" }) : leftSidebar,
|
|
389
|
+
/* @__PURE__ */ React__default.createElement("div", { className: cn("relative md:mr-4", { "md:mx-4": !isSideNavOpen || disableLeftSideNav }) }, /* @__PURE__ */ React__default.createElement(ScrollArea, { className: " bg-surface h-[calc(100dvh-var(--header-nav-height))] md:h-[calc(100dvh-var(--header-nav-height)-1rem)] md:shadow-[2px_4px_12px_0_rgba(0,0,0,0.14)] md:dark:shadow-[2px_4px_12px_0_rgba(255,255,255,0.14)] md:rounded-lg" }, /* @__PURE__ */ React__default.createElement("main", { className: cn("min-w-0 overflow-visible relative p-4 md:p-8") }, main)), /* @__PURE__ */ React__default.createElement("div", { className: "from-background via-background/90 to-background/40 bg-gradient-to-t blur-xs sticky bottom-0 md:bottom-4 z-10 h-4 md:h-8 shrink-0 rounded-lg mr-4" }))
|
|
390
|
+
)),
|
|
391
|
+
hasRightSidebar ? rightSidebar : null
|
|
392
|
+
));
|
|
393
|
+
}
|
|
394
|
+
function fullLayoutRootPropsAreEqual(prev, next) {
|
|
395
|
+
return prev.children === next.children && prev.className === next.className && prev.disableLeftSideNav === next.disableLeftSideNav;
|
|
396
|
+
}
|
|
397
|
+
const FullLayout = Object.assign(React__default.memo(FullLayoutRoot, fullLayoutRootPropsAreEqual), {
|
|
398
|
+
MainArea: MainArea,
|
|
399
|
+
Body: Body,
|
|
400
|
+
Header: Header,
|
|
401
|
+
LeftSidebar: LeftSidebar,
|
|
402
|
+
Main: Main,
|
|
403
|
+
RightSidebar: RightSidebar
|
|
404
|
+
});
|
|
405
|
+
|
|
406
|
+
export { FullLayout as default };
|
|
407
|
+
//# sourceMappingURL=full-layout.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"full-layout.js","sources":["../../../src/layouts/full-layout/context.tsx","../../../src/layouts/full-layout/components/main-area.tsx","../../../src/layouts/full-layout/components/body.tsx","../../../src/layouts/full-layout/components/header.tsx","../../../src/layouts/full-layout/left-sidebar-pane.tsx","../../../src/layouts/full-layout/components/left-sidebar.tsx","../../../src/layouts/full-layout/components/main.tsx","../../../src/layouts/full-layout/right-sidebar-pane.tsx","../../../src/layouts/full-layout/components/right-sidebar.tsx","../../../src/layouts/full-layout/layout.tsx"],"sourcesContent":["import React from 'react';\n\n/** Nav state derived from route (e.g. active ids). Provided by Platform; when null, layout uses props only. */\nexport interface FullLayoutNavState {\n appNavActiveId?: string;\n sectionNavActiveId?: string;\n activeArticleId?: string;\n}\n\nconst FullLayoutNavStateContext = React.createContext<FullLayoutNavState | null>(null);\n\nexport { FullLayoutNavStateContext };\n\nexport interface FullLayoutContextValue {\n isSideNavOpen: boolean;\n isRightSidebarOpen: boolean;\n toggleSidebar: () => void;\n openRightSidebar: () => void;\n showSidenav: () => void;\n disableLeftSideNav: boolean;\n leftNavWidth: number;\n isMobile: boolean;\n sideNavRef: React.RefObject<HTMLDivElement | null>;\n rightSidebarRef: React.RefObject<HTMLElement | null>;\n sidebarToggleRef: React.RefObject<HTMLButtonElement | null>;\n handleResizeStart: (e: React.MouseEvent) => void;\n handleResizeKeyDown: (e: React.KeyboardEvent) => void;\n ariaValuenow: number;\n ariaValuemin: number;\n ariaValuemax: number;\n}\n\nconst FullLayoutContext = React.createContext<FullLayoutContextValue | null>(null);\n\nexport interface FullLayoutProviderProps {\n value: FullLayoutContextValue;\n children: React.ReactNode;\n}\n\nexport function FullLayoutProvider({ value, children }: FullLayoutProviderProps) {\n return <FullLayoutContext.Provider value={value}>{children}</FullLayoutContext.Provider>;\n}\n\nexport function useFullLayoutContext(): FullLayoutContextValue | null {\n return React.useContext(FullLayoutContext);\n}\n","import React from 'react';\n\nexport function MainArea({ children }: { children?: React.ReactNode }) {\n return <>{children}</>;\n}\nMainArea.displayName = 'FullLayout.MainArea';\n","import React from 'react';\n\nexport function Body({ children }: { children?: React.ReactNode }) {\n return <>{children}</>;\n}\nBody.displayName = 'FullLayout.Body';\n","import React, { ComponentProps } from 'react';\n\nimport { HeaderNav } from '../../header-nav';\nimport { useFullLayoutContext } from '../context';\n\nexport function Header(props: ComponentProps<typeof HeaderNav>) {\n const ctx = useFullLayoutContext();\n if (!ctx) return null;\n\n return (\n <HeaderNav\n {...props}\n showSidebarToggle={!ctx.disableLeftSideNav}\n isSideNavOpen={ctx.isSideNavOpen}\n onSideNavigationToggle={ctx.toggleSidebar}\n onHelpClick={ctx.openRightSidebar}\n sidebarToggleRef={ctx.sidebarToggleRef as React.Ref<HTMLButtonElement>}\n />\n );\n}\nHeader.displayName = 'FullLayout.Header';\n","import React, { ComponentProps } from 'react';\n\nimport { Sidebar } from '../sidebar';\n\nimport { ScrollArea } from '@/components/ui/scroll-area';\nimport { cn } from '@/lib/utils';\n\nexport interface FullLayoutLeftSidebarProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> {\n open: boolean;\n widthPx: number;\n onResizeStart: (e: React.MouseEvent) => void;\n onResizeKeyDown: (e: React.KeyboardEvent) => void;\n ariaValuenow: number;\n ariaValuemin: number;\n ariaValuemax: number;\n sidebarProps: ComponentProps<typeof Sidebar>;\n}\n\nconst FullLayoutLeftSidebar = React.forwardRef<HTMLDivElement, FullLayoutLeftSidebarProps>(\n (\n {\n open,\n widthPx,\n onResizeStart,\n onResizeKeyDown,\n ariaValuenow,\n ariaValuemin,\n ariaValuemax,\n sidebarProps,\n className,\n ...props\n },\n ref,\n ) => {\n return (\n <div\n ref={ref}\n id=\"left-sidebar-pane\"\n data-slot=\"full-layout-left-sidebar\"\n tabIndex={-1}\n data-state={open ? 'open' : 'closed'}\n className={cn(\n 'min-w-0 overflow-hidden flex flex-col relative transition-[width] data-[state=closed]:w-0 data-[state=closed]:pointer-events-none data-[state=open]:w-full md:data-[state=open]:w-[var(--left-nav-width)]',\n className,\n )}\n style={{\n ['--left-nav-width' as string]: `${widthPx}px`,\n }}\n {...props}\n >\n <ScrollArea className=\"h-[calc(100dvh-var(--header-nav-height))]\">\n <Sidebar {...sidebarProps} collapsed={!open} className=\"w-[inherit] transition-[width]\" />\n </ScrollArea>\n {/* Window Splitter per APG: https://www.w3.org/ARIA/apg/patterns/windowsplitter/ */}\n {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- focusable separator per APG Window Splitter pattern */}\n <div\n role=\"separator\"\n aria-orientation=\"vertical\"\n aria-valuenow={ariaValuenow}\n aria-valuemin={ariaValuemin}\n aria-valuemax={ariaValuemax}\n aria-label=\"Resize left sidebar\"\n aria-controls=\"left-sidebar-pane\"\n data-slot=\"full-layout-left-sidebar-resize-handle\"\n /* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex -- focusable separator per APG Window Splitter pattern */\n tabIndex={0}\n onMouseDown={onResizeStart}\n onKeyDown={onResizeKeyDown}\n className=\"hidden lg:block absolute top-0 right-0 bottom-0 w-1 bg-transparent hover:bg-blue-500 cursor-ew-resize shrink-0 [&>div]:pointer-events-none\"\n >\n <div className=\"absolute inset-y-0 -right-1 w-3\" />\n </div>\n </div>\n );\n },\n);\n\nFullLayoutLeftSidebar.displayName = 'FullLayoutLeftSidebar';\n\nexport { FullLayoutLeftSidebar };\n","import React, { ComponentProps, useContext } from 'react';\n\nimport { Sidebar } from '../../sidebar';\nimport { FullLayoutNavStateContext, useFullLayoutContext } from '../context';\nimport { FullLayoutLeftSidebar } from '../left-sidebar-pane';\n\nexport function LeftSidebar(props: ComponentProps<typeof Sidebar>) {\n const ctx = useFullLayoutContext();\n const navState = useContext(FullLayoutNavStateContext);\n if (!ctx) return null;\n if (ctx.disableLeftSideNav) return null;\n\n const sidebarProps: ComponentProps<typeof Sidebar> =\n navState != null\n ? {\n ...props,\n appNavActiveId: navState.appNavActiveId ?? props.appNavActiveId,\n sectionNavActiveId: navState.sectionNavActiveId ?? props.sectionNavActiveId,\n activeArticleId: navState.activeArticleId ?? props.activeArticleId,\n }\n : props;\n\n return (\n <FullLayoutLeftSidebar\n ref={ctx.sideNavRef as React.Ref<HTMLDivElement>}\n open={ctx.isSideNavOpen}\n widthPx={ctx.leftNavWidth}\n onResizeStart={ctx.handleResizeStart}\n onResizeKeyDown={ctx.handleResizeKeyDown}\n ariaValuenow={ctx.ariaValuenow}\n ariaValuemin={ctx.ariaValuemin}\n ariaValuemax={ctx.ariaValuemax}\n sidebarProps={sidebarProps}\n />\n );\n}\nLeftSidebar.displayName = 'FullLayout.LeftSidebar';\n","import React from 'react';\n\nimport { Item } from '@/components/ui/item';\n\nexport function Main({ children }: { children?: React.ReactNode }) {\n return <Item className=\"p-0\">{children}</Item>;\n}\nMain.displayName = 'FullLayout.Main';\n","import React from 'react';\n\nimport { cn } from '@/lib/utils';\nimport { ScrollArea } from '@/components/ui/scroll-area';\n\nexport interface FullLayoutRightSidebarProps extends Omit<React.ComponentPropsWithoutRef<'aside'>, 'children'> {\n open: boolean;\n children: React.ReactNode;\n}\n\nconst FullLayoutRightSidebar = React.forwardRef<HTMLElement, FullLayoutRightSidebarProps>(\n ({ open, className, children, ...props }, ref) => {\n return (\n <aside\n ref={ref as React.Ref<HTMLDivElement>}\n data-slot=\"full-layout-right-sidebar\"\n data-state={open ? 'open' : 'closed'}\n className={cn(\n 'bg-background shadow-lg flex flex-col',\n 'fixed h-[calc(100dvh-var(--header-nav-height))] z-10 w-screen transition-transform duration-300 ease-in-out data-[state=closed]:translate-x-full data-[state=open]:translate-x-0',\n 'md:relative md:h-full md:w-80 md:top-0',\n className,\n )}\n {...props}\n >\n <div className=\"flex flex-col flex-1 min-h-0 overflow-hidden\" data-slot=\"full-layout-right-sidebar-content\">\n <ScrollArea className=\"h-[calc(100dvh-var(--header-nav-height))]\">{children}</ScrollArea>\n </div>\n </aside>\n );\n },\n);\n\nFullLayoutRightSidebar.displayName = 'FullLayoutRightSidebar';\n\nexport { FullLayoutRightSidebar };\n","import React from 'react';\n\nimport { useFullLayoutContext } from '../context';\nimport { FullLayoutRightSidebar } from '../right-sidebar-pane';\n\nexport function RightSidebar({ children }: { children?: React.ReactNode }) {\n const ctx = useFullLayoutContext();\n if (!ctx) return null;\n\n return (\n <FullLayoutRightSidebar\n ref={ctx.rightSidebarRef as React.Ref<HTMLElement>}\n open={ctx.isRightSidebarOpen}\n className=\"top-[var(--header-nav-height)]\"\n >\n {children}\n </FullLayoutRightSidebar>\n );\n}\nRightSidebar.displayName = 'FullLayout.RightSidebar';\n","import React, { useState, useRef, useEffect, useMemo, useCallback, isValidElement } from 'react';\nimport { useMediaQuery } from 'usehooks-ts';\n\nimport { FullLayoutProvider } from './context';\nimport { HEADER_NAV_HEIGHT } from '../header-nav';\nimport * as Compounds from './components';\n\nimport { ScrollArea } from '@/components/ui/scroll-area';\nimport { cn } from '@/lib/utils';\n\nconst MIN_SIDENAV_WIDTH = 260;\nconst CLOSE_SIDENAV_THRESHOLD = MIN_SIDENAV_WIDTH - 32;\nconst MAX_SIDENAV_WIDTH = 350;\nconst RIGHT_SIDEBAR_WIDTH = 320;\n\nexport interface FullLayoutRootProps {\n children?: React.ReactNode;\n disableLeftSideNav?: boolean;\n className?: string;\n}\n\n// Helper function to extract slots from children\nfunction extractSlots<T extends Record<string, React.ComponentType<any>>>(\n children: React.ReactNode,\n refs: T,\n): { [K in keyof T]: React.ReactElement | null } {\n const out = {} as { [K in keyof T]: React.ReactElement | null };\n const arr = React.Children.toArray(children);\n for (const key of Object.keys(refs) as (keyof T)[]) {\n const match = arr.find((c): c is React.ReactElement => isValidElement(c) && c.type === refs[key]);\n out[key] = match ?? null;\n }\n\n return out;\n}\n\n// --- Root component ---\n\nfunction FullLayoutRoot({ children, disableLeftSideNav = false, className }: FullLayoutRootProps) {\n // Match isMobile breakpoint (max-width: 767px) so no flash on 768–1023px\n const [isSideNavOpen, setIsSideNavOpen] = useState(() => typeof window !== 'undefined' && window.innerWidth > 767);\n const [isRightSidebarOpen, setIsRightSidebarOpen] = useState(false);\n const [leftNavWidth, setLeftNavWidth] = useState(MIN_SIDENAV_WIDTH);\n const [isResizing, setIsResizing] = useState(false);\n const [gridWidth, setGridWidth] = useState(() => (typeof window !== 'undefined' ? window.innerWidth : 0));\n const sideNavRef = useRef<HTMLDivElement>(null);\n const rightSidebarRef = useRef<HTMLElement>(null);\n const sidebarToggleRef = useRef<HTMLButtonElement>(null);\n const gridRef = useRef<HTMLDivElement>(null);\n const prevSideNavOpenRef = useRef(isSideNavOpen);\n const resizeAcRef = useRef<AbortController | null>(null);\n const isMobile = useMediaQuery('(max-width: 767px)');\n const isWideDesktop = useMediaQuery('(min-width: 1280px)');\n\n // Prevent native scrollbar from appearing\n useEffect(() => {\n document.body.style.overflow = 'hidden';\n\n return () => {\n document.body.style.overflow = '';\n };\n }, []);\n\n // Handle grid width changes\n useEffect(() => {\n const el = gridRef.current;\n if (!el) return;\n\n const ro = new ResizeObserver(([entry]) => setGridWidth(entry.contentRect.width));\n ro.observe(el);\n\n return () => ro.disconnect();\n }, []);\n\n // Close other sidebar if opening a new one on wide desktop\n const closeOtherSidebar = useCallback(\n (opening: 'left' | 'right') => {\n if (isWideDesktop) return;\n if (opening === 'left') setIsRightSidebarOpen(false);\n else setIsSideNavOpen(false);\n },\n [isWideDesktop],\n );\n\n // Show left sidebar\n const showSidenav = useCallback(() => {\n closeOtherSidebar('left');\n setIsSideNavOpen(true);\n setLeftNavWidth(MIN_SIDENAV_WIDTH);\n sideNavRef.current?.focus();\n }, [closeOtherSidebar]);\n\n // Toggle left sidebar\n const toggleSidebar = useCallback(() => {\n closeOtherSidebar('left');\n setIsSideNavOpen((prev) => !prev);\n }, [closeOtherSidebar]);\n\n // toggle right sidebar\n const toggleRightSidebar = useCallback(() => {\n closeOtherSidebar('right');\n setIsRightSidebarOpen((prev) => !prev);\n }, [closeOtherSidebar]);\n\n // Apply left nav width - used for resizing left sidebar\n const applyLeftNavWidth = useCallback((newWidth: number, useThreshold = true): boolean => {\n const threshold = useThreshold ? CLOSE_SIDENAV_THRESHOLD : MIN_SIDENAV_WIDTH;\n\n if (newWidth < threshold) {\n setLeftNavWidth(MIN_SIDENAV_WIDTH);\n setIsSideNavOpen(false);\n\n return true;\n } else {\n // clamp to MAX_SIDENAV_WIDTH\n setLeftNavWidth(Math.min(MAX_SIDENAV_WIDTH, newWidth));\n\n return false;\n }\n }, []);\n\n // Handle resize start\n const handleResizeStart = useCallback((e: React.MouseEvent) => {\n e.preventDefault();\n resizeAcRef.current = new AbortController();\n setIsResizing(true);\n }, []);\n\n // Handle resize end\n const endResize = useCallback(() => {\n setIsResizing(false);\n document.body.style.cursor = '';\n document.body.style.userSelect = '';\n }, []);\n\n // Handle mouse move during resize\n const handleMouseMove = useCallback(\n (e: MouseEvent) => {\n if (!isResizing) return;\n if (applyLeftNavWidth(e.clientX)) {\n endResize();\n }\n },\n [isResizing, applyLeftNavWidth, endResize],\n );\n\n // Handle mouse up during resize\n const handleMouseUp = useCallback(() => endResize(), [endResize]);\n\n // Set inert attribute on side nav and right sidebar - disables tabbing to elements inside when sidebar is closed\n const setInert = useCallback((el: HTMLElement | null, open: boolean) => {\n if (!el) return;\n if (open) el.removeAttribute('inert');\n else el.setAttribute('inert', '');\n }, []);\n\n useEffect(() => {\n setInert(sideNavRef.current, isSideNavOpen);\n setInert(rightSidebarRef.current, isRightSidebarOpen);\n }, [isSideNavOpen, isRightSidebarOpen]);\n\n // Attach resize listeners when isResizing becomes true (controller already set in handleResizeStart)\n useEffect(() => {\n if (!isResizing || !resizeAcRef.current) return;\n\n const { signal } = resizeAcRef.current;\n document.body.style.cursor = 'ew-resize';\n document.body.style.userSelect = 'none';\n document.addEventListener('mousemove', handleMouseMove, { signal });\n document.addEventListener('mouseup', handleMouseUp, { signal });\n window.addEventListener('mouseup', handleMouseUp, { signal });\n setInert(sideNavRef.current, false);\n\n return () => {\n resizeAcRef.current?.abort();\n resizeAcRef.current = null;\n document.body.style.cursor = '';\n document.body.style.userSelect = '';\n setInert(sideNavRef.current, true);\n };\n }, [isResizing]);\n\n // Handle resize key down\n const handleResizeKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n const step = 16;\n if (e.key === 'ArrowLeft') {\n e.preventDefault();\n applyLeftNavWidth(leftNavWidth - step, false);\n } else if (e.key === 'ArrowRight') {\n e.preventDefault();\n applyLeftNavWidth(Math.min(MAX_SIDENAV_WIDTH, leftNavWidth + step));\n }\n },\n [leftNavWidth],\n );\n\n const leftCol = disableLeftSideNav ? 0 : isSideNavOpen ? (isMobile ? gridWidth : leftNavWidth) : 0;\n const rightCol = isMobile ? 0 : isRightSidebarOpen ? RIGHT_SIDEBAR_WIDTH : 0;\n\n // Set left sidebar open state based on mobile\n useEffect(() => {\n setIsSideNavOpen(isMobile ? false : true);\n }, [isMobile]);\n\n // Focus sidebar toggle when left sidebar is closed\n useEffect(() => {\n if (prevSideNavOpenRef.current && !isSideNavOpen) {\n sidebarToggleRef.current?.focus();\n }\n prevSideNavOpenRef.current = isSideNavOpen;\n }, [isSideNavOpen]);\n\n const ariaValuenow = Math.round(((leftNavWidth - MIN_SIDENAV_WIDTH) / (MAX_SIDENAV_WIDTH - MIN_SIDENAV_WIDTH)) * 100);\n\n const layoutContextValue = useMemo(\n () => ({\n isSideNavOpen,\n isRightSidebarOpen,\n toggleSidebar,\n openRightSidebar: toggleRightSidebar,\n showSidenav,\n disableLeftSideNav: disableLeftSideNav ?? false,\n leftNavWidth,\n isMobile,\n sideNavRef,\n rightSidebarRef,\n sidebarToggleRef,\n handleResizeStart,\n handleResizeKeyDown,\n ariaValuenow,\n ariaValuemin: 0,\n ariaValuemax: 100,\n }),\n [\n isSideNavOpen,\n isRightSidebarOpen,\n toggleSidebar,\n toggleRightSidebar,\n showSidenav,\n leftNavWidth,\n isMobile,\n disableLeftSideNav,\n handleResizeStart,\n handleResizeKeyDown,\n ariaValuenow,\n ],\n );\n\n // --- Extract slots from children ---\n const { MainArea: mainArea, RightSidebar: rightSidebar } = extractSlots(children, {\n MainArea: Compounds.MainArea,\n RightSidebar: Compounds.RightSidebar,\n });\n const mainAreaChildren = isValidElement(mainArea)\n ? (mainArea.props as { children?: React.ReactNode }).children\n : null;\n const { Header: header, Body: body } = extractSlots(mainAreaChildren ?? null, {\n Header: Compounds.Header,\n Body: Compounds.Body,\n });\n const bodyChildren = isValidElement(body) ? (body.props as { children?: React.ReactNode }).children : null;\n const { LeftSidebar: leftSidebar, Main: main } = extractSlots(bodyChildren ?? null, {\n LeftSidebar: Compounds.LeftSidebar,\n Main: Compounds.Main,\n });\n\n const hasRightSidebar = rightSidebar != null;\n\n // --- Render the layout ---\n return (\n <FullLayoutProvider value={layoutContextValue}>\n <div\n className={cn(\n 'min-h-screen w-screen bg-background grid transition-[grid-template-columns] duration-300 ease-in-out',\n className,\n )}\n style={{\n gridTemplateColumns: hasRightSidebar ? 'minmax(0, 1fr) var(--right-col)' : 'minmax(0, 1fr)',\n ['--right-col' as string]: hasRightSidebar ? `${rightCol}px` : '0px',\n ['--header-nav-height' as string]: `${HEADER_NAV_HEIGHT}px`,\n }}\n >\n <div className=\"min-w-0 grid grid-rows-[auto_1fr]\">\n {header}\n\n <div\n ref={gridRef}\n data-sidenav-state={isSideNavOpen ? 'open' : 'closed'}\n data-right-sidebar-state={isRightSidebarOpen ? 'open' : 'closed'}\n className={cn(\n 'group/sidenav group/rightsidebar min-h-0 min-w-0 grid transition-[grid-template-columns] ease-linear',\n )}\n style={{\n gridTemplateColumns: `var(--left-col) minmax(0, 1fr)`,\n ['--left-col' as string]: `${leftCol}px`,\n }}\n >\n {disableLeftSideNav ? <div className=\"w-0\" /> : leftSidebar}\n <div className={cn('relative md:mr-4', { 'md:mx-4': !isSideNavOpen || disableLeftSideNav })}>\n <ScrollArea className=\" bg-surface h-[calc(100dvh-var(--header-nav-height))] md:h-[calc(100dvh-var(--header-nav-height)-1rem)] md:shadow-[2px_4px_12px_0_rgba(0,0,0,0.14)] md:dark:shadow-[2px_4px_12px_0_rgba(255,255,255,0.14)] md:rounded-lg\">\n <main className={cn('min-w-0 overflow-visible relative p-4 md:p-8')}>{main}</main>\n </ScrollArea>\n <div className=\"from-background via-background/90 to-background/40 bg-gradient-to-t blur-xs sticky bottom-0 md:bottom-4 z-10 h-4 md:h-8 shrink-0 rounded-lg mr-4\" />\n </div>\n </div>\n </div>\n\n {hasRightSidebar ? rightSidebar : null}\n </div>\n </FullLayoutProvider>\n );\n}\n\n/**\n * Custom memo comparator: re-render only when these props change by reference/value.\n * Use this so changing other props (e.g. from a parent) does not force the layout shell to re-render.\n */\nfunction fullLayoutRootPropsAreEqual(prev: FullLayoutRootProps, next: FullLayoutRootProps): boolean {\n return (\n prev.children === next.children &&\n prev.className === next.className &&\n prev.disableLeftSideNav === next.disableLeftSideNav\n );\n}\n\nconst FullLayout = Object.assign(React.memo(FullLayoutRoot, fullLayoutRootPropsAreEqual), {\n MainArea: Compounds.MainArea,\n Body: Compounds.Body,\n Header: Compounds.Header,\n LeftSidebar: Compounds.LeftSidebar,\n Main: Compounds.Main,\n RightSidebar: Compounds.RightSidebar,\n});\n\nexport default FullLayout;\n"],"names":["React","Compounds.MainArea","Compounds.RightSidebar","Compounds.Header","Compounds.Body","Compounds.LeftSidebar","Compounds.Main"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"header-nav.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sidebar.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -0,0 +1,155 @@
|
|
|
1
|
+
import { ComponentProps } from 'react';
|
|
2
|
+
import { default as default_2 } from 'react';
|
|
3
|
+
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
|
|
4
|
+
import { Icon } from '@phosphor-icons/react';
|
|
5
|
+
import * as React_2 from 'react';
|
|
6
|
+
|
|
7
|
+
declare type AccountDropdownItem = {
|
|
8
|
+
id: string;
|
|
9
|
+
label: string;
|
|
10
|
+
onClick: () => void;
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
declare interface AccountDropdownProps extends React_2.ComponentPropsWithoutRef<typeof DropdownMenu> {
|
|
14
|
+
accountPhoto: string;
|
|
15
|
+
accountName: string;
|
|
16
|
+
accountDropdownItems: AccountDropdownItem[];
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
declare interface ArticleNavItem extends Omit<SidebarNavItem, 'Icon' | 'items'> {
|
|
20
|
+
status?: 'discovery' | 'unpublished';
|
|
21
|
+
items?: ArticleNavItem[];
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
declare function Body_2({ children }: {
|
|
25
|
+
children?: default_2.ReactNode;
|
|
26
|
+
}): default_2.JSX.Element;
|
|
27
|
+
|
|
28
|
+
declare namespace Body_2 {
|
|
29
|
+
var displayName: string;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
declare namespace Compounds {
|
|
33
|
+
export {
|
|
34
|
+
MainArea,
|
|
35
|
+
Body_2 as Body,
|
|
36
|
+
Header,
|
|
37
|
+
LeftSidebar,
|
|
38
|
+
Main,
|
|
39
|
+
RightSidebar
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
declare const DropdownMenu: React_2.FC<DropdownMenuPrimitive.DropdownMenuProps>;
|
|
44
|
+
|
|
45
|
+
declare const FullLayout: default_2.NamedExoticComponent<FullLayoutRootProps> & {
|
|
46
|
+
readonly type: typeof FullLayoutRoot;
|
|
47
|
+
} & {
|
|
48
|
+
MainArea: typeof Compounds.MainArea;
|
|
49
|
+
Body: typeof Compounds.Body;
|
|
50
|
+
Header: typeof Compounds.Header;
|
|
51
|
+
LeftSidebar: typeof Compounds.LeftSidebar;
|
|
52
|
+
Main: typeof Compounds.Main;
|
|
53
|
+
RightSidebar: typeof Compounds.RightSidebar;
|
|
54
|
+
};
|
|
55
|
+
export default FullLayout;
|
|
56
|
+
|
|
57
|
+
declare function FullLayoutRoot({ children, disableLeftSideNav, className }: FullLayoutRootProps): default_2.JSX.Element;
|
|
58
|
+
|
|
59
|
+
declare interface FullLayoutRootProps {
|
|
60
|
+
children?: default_2.ReactNode;
|
|
61
|
+
disableLeftSideNav?: boolean;
|
|
62
|
+
className?: string;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
declare function Header(props: ComponentProps<typeof HeaderNav>): default_2.JSX.Element | null;
|
|
66
|
+
|
|
67
|
+
declare namespace Header {
|
|
68
|
+
var displayName: string;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
declare const HeaderNav: React_2.ForwardRefExoticComponent<HeaderNavProps & React_2.RefAttributes<HTMLElement>>;
|
|
72
|
+
|
|
73
|
+
declare interface HeaderNavProps extends React_2.ComponentPropsWithoutRef<'header'>, Omit<AccountDropdownProps, 'dir'> {
|
|
74
|
+
isSideNavOpen?: boolean;
|
|
75
|
+
onSideNavigationToggle: () => void;
|
|
76
|
+
onHelpClick: () => void;
|
|
77
|
+
showSuggestionAction?: boolean;
|
|
78
|
+
suggestionAction?: React_2.ReactNode;
|
|
79
|
+
onSuggestionActionClick?: () => void;
|
|
80
|
+
showSidebarToggle?: boolean;
|
|
81
|
+
/** Ref for the sidebar toggle button; used by layout to move focus here when sidebar is collapsed. */
|
|
82
|
+
sidebarToggleRef?: React_2.Ref<HTMLButtonElement>;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
declare type ItemLinkComponent = React_2.ComponentType<React_2.ComponentPropsWithoutRef<'a'> & {
|
|
86
|
+
'data-sidebar-item-id'?: string;
|
|
87
|
+
'data-sidebar-item-type'?: 'app' | 'article' | 'section';
|
|
88
|
+
}>;
|
|
89
|
+
|
|
90
|
+
declare function LeftSidebar(props: ComponentProps<typeof Sidebar>): default_2.JSX.Element | null;
|
|
91
|
+
|
|
92
|
+
declare namespace LeftSidebar {
|
|
93
|
+
var displayName: string;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
declare function Main({ children }: {
|
|
97
|
+
children?: default_2.ReactNode;
|
|
98
|
+
}): default_2.JSX.Element;
|
|
99
|
+
|
|
100
|
+
declare namespace Main {
|
|
101
|
+
var displayName: string;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
declare function MainArea({ children }: {
|
|
105
|
+
children?: default_2.ReactNode;
|
|
106
|
+
}): default_2.JSX.Element;
|
|
107
|
+
|
|
108
|
+
declare namespace MainArea {
|
|
109
|
+
var displayName: string;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
declare function RightSidebar({ children }: {
|
|
113
|
+
children?: default_2.ReactNode;
|
|
114
|
+
}): default_2.JSX.Element | null;
|
|
115
|
+
|
|
116
|
+
declare namespace RightSidebar {
|
|
117
|
+
var displayName: string;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
declare const Sidebar: React_2.ForwardRefExoticComponent<SidebarProps & React_2.RefAttributes<HTMLElement>>;
|
|
121
|
+
|
|
122
|
+
declare interface SidebarContextProps {
|
|
123
|
+
collapsed: boolean;
|
|
124
|
+
ItemLinkComponent: ItemLinkComponent;
|
|
125
|
+
activeArticleId?: string;
|
|
126
|
+
onSelectArticle?: (id: string) => void;
|
|
127
|
+
onSearchArticles?: (value: string) => void;
|
|
128
|
+
onAddArticle?: (parentId: string | null) => void;
|
|
129
|
+
onMoveArticle?: (moved: {
|
|
130
|
+
id: string;
|
|
131
|
+
parentId: string | null;
|
|
132
|
+
index: number;
|
|
133
|
+
}) => void;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
declare interface SidebarNavItem {
|
|
137
|
+
id: string;
|
|
138
|
+
label: string;
|
|
139
|
+
href: string;
|
|
140
|
+
Icon?: Icon;
|
|
141
|
+
items?: SidebarNavItem[];
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
declare interface SidebarProps extends React_2.ComponentPropsWithoutRef<'aside'>, SidebarContextProps {
|
|
145
|
+
showAppBack?: boolean;
|
|
146
|
+
onAppBack?: () => void;
|
|
147
|
+
appNavItems?: SidebarNavItem[];
|
|
148
|
+
appNavActiveId?: string;
|
|
149
|
+
showArticles?: boolean;
|
|
150
|
+
articles?: ArticleNavItem[];
|
|
151
|
+
sectionNavItems?: SidebarNavItem[];
|
|
152
|
+
sectionNavActiveId?: string;
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
export { }
|