dishui 0.0.83 → 0.0.84
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/components/Demo/index.js +2 -2
- package/dist/components/Demo/index.js.map +1 -1
- package/dist/components/Page/index.d.ts +18 -4
- package/dist/components/Page/index.js +47 -35
- package/dist/components/Page/index.js.map +1 -1
- package/dist/components/Text/index.d.ts +1 -1
- package/dist/components/Text/index.js +2 -2
- package/dist/components/Text/index.js.map +1 -1
- package/dist/dishui.css +1 -1
- package/dist/layouts/Sidebar.d.ts +3 -1
- package/dist/layouts/Sidebar.js +131 -122
- package/dist/layouts/Sidebar.js.map +1 -1
- package/dist/utils/i18n.js +1 -1
- package/dist/utils/i18n.js.map +1 -1
- package/package.json +1 -1
|
@@ -11,7 +11,9 @@ export type SidebarProps = {
|
|
|
11
11
|
/**
|
|
12
12
|
* Opt-in typography for levels 1–3; deeper nodes reuse level 3.
|
|
13
13
|
* Omitted: preserve legacy Sidebar/LayoutSuite typography. When supplied,
|
|
14
|
-
* missing values default to base/sm/sm
|
|
14
|
+
* missing values default to base/sm/sm and semibold/medium/normal.
|
|
15
|
+
* Levels 3+ default to theme-adaptive neutral gray, even without levelText.
|
|
16
|
+
* Explicit colors retain Text semantics (secondary may be a theme accent).
|
|
15
17
|
* Selected labels always inherit the active row color.
|
|
16
18
|
*/
|
|
17
19
|
levelText?: readonly [SidebarLevelText?, SidebarLevelText?, SidebarLevelText?];
|
package/dist/layouts/Sidebar.js
CHANGED
|
@@ -5,9 +5,9 @@ import r from "../components/Tree/Tree.js";
|
|
|
5
5
|
import { DesktopSidebarToggleButton as i } from "../components/SidebarToggleButton/index.js";
|
|
6
6
|
import { useEffect as a, useMemo as o, useRef as s, useState as c } from "react";
|
|
7
7
|
import { jsx as l, jsxs as u } from "react/jsx-runtime";
|
|
8
|
-
import {
|
|
8
|
+
import { Link as d, useNavigate as f, useRouterState as p } from "@tanstack/react-router";
|
|
9
9
|
//#region src/layouts/Sidebar.tsx
|
|
10
|
-
var
|
|
10
|
+
var m = [
|
|
11
11
|
{
|
|
12
12
|
size: "base",
|
|
13
13
|
weight: "semibold"
|
|
@@ -20,36 +20,36 @@ var p = [
|
|
|
20
20
|
size: "sm",
|
|
21
21
|
weight: "normal"
|
|
22
22
|
}
|
|
23
|
-
],
|
|
24
|
-
let [
|
|
23
|
+
], h = ({ isCollapsed: h, side: g = "left", language: _, items: v, levelText: y, getMenuItems: b, onWidthChange: x, initialWidth: S = 280, collapsedWidth: C = 64, onToggle: w, minWidth: T = 160, maxWidth: E = 400 }) => {
|
|
24
|
+
let [D, O] = c([]), [k, A] = c(""), [j, M] = c(() => Math.max(T, Math.min(S, E))), N = s(null), P = s(null), F = p({ select: (e) => e.location }), I = f();
|
|
25
25
|
a(() => {
|
|
26
|
-
|
|
26
|
+
M(Math.max(T, Math.min(S, E)));
|
|
27
27
|
}, [
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
28
|
+
S,
|
|
29
|
+
T,
|
|
30
|
+
E
|
|
31
31
|
]);
|
|
32
|
-
let
|
|
33
|
-
let t = Math.max(
|
|
34
|
-
|
|
32
|
+
let L = (e) => {
|
|
33
|
+
let t = Math.max(T, Math.min(e, E));
|
|
34
|
+
M(t), x?.(t);
|
|
35
35
|
};
|
|
36
36
|
a(() => {
|
|
37
|
-
|
|
37
|
+
O(v === void 0 ? b ? b(_) : t(_) : v);
|
|
38
38
|
}, [
|
|
39
|
-
g,
|
|
40
39
|
_,
|
|
41
|
-
|
|
40
|
+
v,
|
|
41
|
+
b
|
|
42
42
|
]), a(() => {
|
|
43
|
-
if (!
|
|
43
|
+
if (!k) return;
|
|
44
44
|
let e = setTimeout(() => {
|
|
45
|
-
|
|
45
|
+
P.current?.querySelector(h ? "[aria-current=\"page\"]" : ".tree-node-content-active")?.scrollIntoView({
|
|
46
46
|
block: "nearest",
|
|
47
|
-
behavior: "smooth"
|
|
47
|
+
behavior: window.matchMedia("(prefers-reduced-motion: reduce)").matches ? "instant" : "smooth"
|
|
48
48
|
});
|
|
49
49
|
}, 350);
|
|
50
50
|
return () => clearTimeout(e);
|
|
51
|
-
}, [
|
|
52
|
-
let e =
|
|
51
|
+
}, [k, h]), a(() => {
|
|
52
|
+
let e = P.current;
|
|
53
53
|
if (!e) return;
|
|
54
54
|
let t = (t) => {
|
|
55
55
|
if (e.scrollHeight <= e.clientHeight) return;
|
|
@@ -59,8 +59,8 @@ var p = [
|
|
|
59
59
|
e.scrollTop = r + n, e.scrollTop !== r && t.preventDefault();
|
|
60
60
|
};
|
|
61
61
|
return e.addEventListener("wheel", t, { passive: !1 }), () => e.removeEventListener("wheel", t);
|
|
62
|
-
}, []);
|
|
63
|
-
let
|
|
62
|
+
}, [h]);
|
|
63
|
+
let R = (e, t = !0) => e.map((e) => ({
|
|
64
64
|
id: e.id,
|
|
65
65
|
label: e.label,
|
|
66
66
|
icon: e.icon || (t ? void 0 : /* @__PURE__ */ l("svg", {
|
|
@@ -76,19 +76,19 @@ var p = [
|
|
|
76
76
|
d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
|
|
77
77
|
})
|
|
78
78
|
})),
|
|
79
|
-
children: e.children ?
|
|
79
|
+
children: e.children ? R(e.children, !1) : void 0,
|
|
80
80
|
meta: { path: e.path }
|
|
81
|
-
})),
|
|
82
|
-
if (
|
|
81
|
+
})), z = o(() => R(D, !0), [D]), B = o(() => {
|
|
82
|
+
if (D.length === 0) return [];
|
|
83
83
|
let e = (t) => {
|
|
84
84
|
let n = [];
|
|
85
85
|
for (let r of t) r.children?.length && (n.push(r.id), n = [...n, ...e(r.children)]);
|
|
86
86
|
return n;
|
|
87
87
|
};
|
|
88
|
-
return e(
|
|
89
|
-
}, [
|
|
90
|
-
|
|
91
|
-
let e =
|
|
88
|
+
return e(D);
|
|
89
|
+
}, [D]);
|
|
90
|
+
a(() => {
|
|
91
|
+
let e = F.pathname, t = (n) => {
|
|
92
92
|
for (let r of n) {
|
|
93
93
|
if (r.path === e) return r.id;
|
|
94
94
|
if (r.children) {
|
|
@@ -97,79 +97,87 @@ var p = [
|
|
|
97
97
|
}
|
|
98
98
|
}
|
|
99
99
|
return null;
|
|
100
|
-
}, n = t(
|
|
101
|
-
n
|
|
102
|
-
}, [
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
100
|
+
}, n = t(D);
|
|
101
|
+
A(n ?? "");
|
|
102
|
+
}, [D, F.pathname]);
|
|
103
|
+
let V = (e) => {
|
|
104
|
+
if (e.meta?.path) {
|
|
105
|
+
A(e.id), I({ to: e.meta.path });
|
|
106
|
+
return;
|
|
107
|
+
}
|
|
108
|
+
if (e.children && e.children.length > 0) {
|
|
109
|
+
let t = (e) => {
|
|
110
|
+
for (let n of e) {
|
|
111
|
+
if (n.meta?.path) return n;
|
|
112
|
+
if (n.children && n.children.length > 0) {
|
|
113
|
+
let e = t(n.children);
|
|
114
|
+
if (e) return e;
|
|
115
|
+
}
|
|
116
|
+
}
|
|
117
|
+
return null;
|
|
118
|
+
}, n = t(e.children);
|
|
119
|
+
n ? (A(n.id), I({ to: n.meta.path })) : A(e.id);
|
|
120
|
+
} else A(e.id);
|
|
121
|
+
}, H = (e, t = []) => e.flatMap((e) => {
|
|
122
|
+
let n = [...t, e.label];
|
|
123
|
+
return [...e.path ? [{
|
|
124
|
+
item: e,
|
|
125
|
+
trail: n.join(" / ")
|
|
126
|
+
}] : [], ...H(e.children ?? [], n)];
|
|
127
|
+
}), U = h ? /* @__PURE__ */ l("nav", {
|
|
128
|
+
ref: P,
|
|
129
|
+
className: "sidebar-rail",
|
|
130
|
+
"aria-label": _ === "zh" ? "侧边导航" : "Sidebar navigation",
|
|
131
|
+
children: D.map((e) => {
|
|
132
|
+
let t = H([e]);
|
|
133
|
+
return t.length > 0 ? /* @__PURE__ */ l("div", {
|
|
134
|
+
role: "group",
|
|
120
135
|
"aria-label": e.label,
|
|
121
|
-
className: "
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
})
|
|
144
|
-
}) }, e.id))
|
|
145
|
-
})]
|
|
146
|
-
}) : /* @__PURE__ */ u("div", {
|
|
147
|
-
ref: M,
|
|
148
|
-
className: "blade-sidebar h-full bg-base-200 overflow-visible flex flex-col transition-colors duration-200 ease-in-out relative",
|
|
149
|
-
style: {
|
|
150
|
-
width: `${A}px`,
|
|
151
|
-
maxWidth: T,
|
|
152
|
-
minWidth: w
|
|
136
|
+
className: "sidebar-rail-group",
|
|
137
|
+
children: t.map(({ item: e, trail: t }) => /* @__PURE__ */ l(d, {
|
|
138
|
+
to: e.path,
|
|
139
|
+
className: "sidebar-rail-link",
|
|
140
|
+
"aria-label": t,
|
|
141
|
+
title: t,
|
|
142
|
+
"aria-current": F.pathname === e.path ? "page" : void 0,
|
|
143
|
+
children: /* @__PURE__ */ l("span", {
|
|
144
|
+
"aria-hidden": "true",
|
|
145
|
+
children: e.icon || /* @__PURE__ */ l("span", { children: e.label.charAt(0) })
|
|
146
|
+
})
|
|
147
|
+
}, e.id))
|
|
148
|
+
}, e.id) : null;
|
|
149
|
+
})
|
|
150
|
+
}) : null;
|
|
151
|
+
return /* @__PURE__ */ u("div", {
|
|
152
|
+
ref: N,
|
|
153
|
+
className: "blade-sidebar sidebar-container h-full bg-base-200 overflow-visible flex flex-col transition-colors duration-200 ease-in-out relative",
|
|
154
|
+
style: h ? { width: C } : {
|
|
155
|
+
width: j,
|
|
156
|
+
maxWidth: E,
|
|
157
|
+
minWidth: T
|
|
153
158
|
},
|
|
154
159
|
children: [
|
|
155
|
-
|
|
156
|
-
isCollapsed:
|
|
157
|
-
side:
|
|
158
|
-
onToggle:
|
|
159
|
-
sidebarWidth:
|
|
160
|
-
collapsedWidth:
|
|
161
|
-
onWidthChange:
|
|
162
|
-
minWidth:
|
|
163
|
-
maxWidth:
|
|
164
|
-
anchorRef:
|
|
160
|
+
w && /* @__PURE__ */ l(i, {
|
|
161
|
+
isCollapsed: h,
|
|
162
|
+
side: g,
|
|
163
|
+
onToggle: w,
|
|
164
|
+
sidebarWidth: j,
|
|
165
|
+
collapsedWidth: C,
|
|
166
|
+
onWidthChange: x ? L : void 0,
|
|
167
|
+
minWidth: T,
|
|
168
|
+
maxWidth: E,
|
|
169
|
+
anchorRef: N
|
|
165
170
|
}),
|
|
171
|
+
U,
|
|
166
172
|
/* @__PURE__ */ l("div", {
|
|
167
|
-
|
|
173
|
+
hidden: h,
|
|
174
|
+
style: h ? { display: "none" } : void 0,
|
|
175
|
+
ref: h ? void 0 : P,
|
|
168
176
|
className: "sidebar-scroll min-h-0 flex-grow overflow-y-auto scrollbar-thin scrollbar-thumb-base-300 scrollbar-track-transparent",
|
|
169
177
|
children: /* @__PURE__ */ l(r, {
|
|
170
|
-
data:
|
|
171
|
-
activeNodeId:
|
|
172
|
-
defaultExpandedIds:
|
|
178
|
+
data: z,
|
|
179
|
+
activeNodeId: k,
|
|
180
|
+
defaultExpandedIds: B,
|
|
173
181
|
showSearch: !1,
|
|
174
182
|
showExpandAll: !1,
|
|
175
183
|
showIcon: !0,
|
|
@@ -178,43 +186,44 @@ var p = [
|
|
|
178
186
|
indent: 1,
|
|
179
187
|
togglePosition: "right",
|
|
180
188
|
maxHeight: "100%",
|
|
181
|
-
className: `sidebar-tree${
|
|
189
|
+
className: `sidebar-tree${y === void 0 ? "" : " sidebar-tree-level-text"}`,
|
|
182
190
|
renderLabel: (t, n) => {
|
|
183
|
-
let r = Math.min(n, 2), i =
|
|
191
|
+
let r = Math.min(n, 2), i = y?.[r], a = m[r];
|
|
184
192
|
return /* @__PURE__ */ l(e, {
|
|
185
193
|
size: i?.size ?? a.size,
|
|
186
194
|
weight: i?.weight ?? a.weight,
|
|
187
|
-
color:
|
|
188
|
-
style:
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
195
|
+
color: k === t.id ? "inherit" : i?.color ?? "inherit",
|
|
196
|
+
style: {
|
|
197
|
+
...y === void 0 ? {
|
|
198
|
+
fontSize: "inherit",
|
|
199
|
+
lineHeight: "inherit",
|
|
200
|
+
fontWeight: "inherit"
|
|
201
|
+
} : {},
|
|
202
|
+
...r === 2 && i?.color === void 0 && k !== t.id ? { color: "var(--sidebar-level-muted)" } : {}
|
|
203
|
+
},
|
|
193
204
|
children: t.label
|
|
194
205
|
});
|
|
195
206
|
},
|
|
196
|
-
onNodeClick:
|
|
197
|
-
if (e.meta?.path) {
|
|
198
|
-
k(e.id), F({ to: e.meta.path });
|
|
199
|
-
return;
|
|
200
|
-
}
|
|
201
|
-
if (e.children && e.children.length > 0) {
|
|
202
|
-
let t = (e) => {
|
|
203
|
-
for (let n of e) {
|
|
204
|
-
if (n.meta?.path) return n;
|
|
205
|
-
if (n.children && n.children.length > 0) {
|
|
206
|
-
let e = t(n.children);
|
|
207
|
-
if (e) return e;
|
|
208
|
-
}
|
|
209
|
-
}
|
|
210
|
-
return null;
|
|
211
|
-
}, n = t(e.children);
|
|
212
|
-
n ? (k(n.id), F({ to: n.meta.path })) : k(e.id);
|
|
213
|
-
} else k(e.id);
|
|
214
|
-
}
|
|
207
|
+
onNodeClick: V
|
|
215
208
|
})
|
|
216
209
|
}),
|
|
217
210
|
/* @__PURE__ */ l("style", { children: `
|
|
211
|
+
.sidebar-container {
|
|
212
|
+
--sidebar-level-muted: oklch(from color-mix(in oklab, var(--color-base-content) 76%, var(--color-base-200)) l 0 0);
|
|
213
|
+
}
|
|
214
|
+
/* LayoutSuite uses semantic surfaces even in colorful themes. Match its text luminance. */
|
|
215
|
+
.dishui-layout-suite-sidebar > .sidebar-container {
|
|
216
|
+
--sidebar-level-muted: oklch(from var(--dishui-text-tertiary) l 0 0);
|
|
217
|
+
}
|
|
218
|
+
.sidebar-rail { min-height: 0; height: 100%; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; padding: 6px; }
|
|
219
|
+
.sidebar-rail-group { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 4px 2px; margin-bottom: 8px; border: 1px solid var(--dishui-border-hairline, var(--color-base-300)); border-radius: 10px; }
|
|
220
|
+
.sidebar-rail-link { display: flex; align-items: center; justify-content: center; width: 100%; max-width: 36px; min-height: 36px; flex-shrink: 0; border-radius: 6px; color: var(--sidebar-level-muted); text-decoration: none; transition: background-color 150ms, color 150ms; }
|
|
221
|
+
.sidebar-rail-link > span { display: flex; align-items: center; justify-content: center; }
|
|
222
|
+
.sidebar-rail-link svg { width: 18px; height: 18px; }
|
|
223
|
+
.sidebar-rail-link:hover { background: var(--color-base-300); }
|
|
224
|
+
.sidebar-rail-link[aria-current="page"] { color: var(--color-primary); background: color-mix(in oklab, var(--color-primary) 12%, var(--color-base-200)); box-shadow: inset 2px 0 var(--color-primary); }
|
|
225
|
+
.sidebar-rail-link:focus-visible { outline: 2px solid var(--dishui-ring, var(--color-primary)); outline-offset: -2px; }
|
|
226
|
+
@media (prefers-reduced-motion: reduce) { .sidebar-rail-link { transition: none; } }
|
|
218
227
|
/* Sidebar Tree 自定义样式 */
|
|
219
228
|
.sidebar-tree {
|
|
220
229
|
background: transparent;
|
|
@@ -349,6 +358,6 @@ var p = [
|
|
|
349
358
|
});
|
|
350
359
|
};
|
|
351
360
|
//#endregion
|
|
352
|
-
export {
|
|
361
|
+
export { h as default };
|
|
353
362
|
|
|
354
363
|
//# sourceMappingURL=Sidebar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Sidebar.js","names":[],"sources":["../../src/layouts/Sidebar.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useMemo } from 'react';\nimport { useNavigate, useRouterState } from '@tanstack/react-router';\nimport { MenuItem } from '../types/menu';\nimport { getMenuItems as defaultGetMenuItems } from '../utils/menu';\nimport { Tree, TreeNode } from '../components/Tree';\nimport { generateSidebarActiveStyles } from '../styles/themeStyles';\nimport { DesktopSidebarToggleButton } from '../components/SidebarToggleButton';\nimport Text, { type TextProps } from '../components/Text';\n\nexport type SidebarLevelText = Pick<TextProps, 'size' | 'weight' | 'color'>;\n\nconst DEFAULT_LEVEL_TEXT = [\n { size: 'base', weight: 'semibold' },\n { size: 'sm', weight: 'medium' },\n { size: 'sm', weight: 'normal' },\n] as const satisfies readonly SidebarLevelText[];\n\n// 组件属性\nexport type SidebarProps = {\n isCollapsed: boolean;\n /** 侧栏所在侧,控制内侧 pill 的位置与调宽方向。 */\n side?: 'left' | 'right';\n language: 'zh' | 'en';\n items?: MenuItem[];\n /**\n * Opt-in typography for levels 1–3; deeper nodes reuse level 3.\n * Omitted: preserve legacy Sidebar/LayoutSuite typography. When supplied,\n * missing values default to base/sm/sm, semibold/medium/normal and inherited color.\n * Selected labels always inherit the active row color.\n */\n levelText?: readonly [SidebarLevelText?, SidebarLevelText?, SidebarLevelText?];\n getMenuItems?: (language: 'zh' | 'en') => MenuItem[];\n onWidthChange?: (width: number) => void;\n initialWidth?: number;\n collapsedWidth?: number;\n /**\n * 折叠 / 展开切换回调。传入后,侧边栏会在其边缘渲染统一的悬浮 pill 控制条\n * (点击折叠、拖拽调节宽度),无需再在外层单独渲染 SidebarToggleButtons。\n */\n onToggle?: () => void;\n /** 拖拽调节宽度的最小值(px) */\n minWidth?: number;\n /** 拖拽调节宽度的最大值(px) */\n maxWidth?: number;\n};\n\nconst Sidebar: React.FC<SidebarProps> = ({\n isCollapsed,\n side = 'left',\n language,\n items: propItems,\n levelText,\n getMenuItems,\n onWidthChange,\n initialWidth = 280,\n collapsedWidth = 64,\n onToggle,\n minWidth = 160,\n maxWidth = 400,\n}) => {\n const [items, setItems] = useState<MenuItem[]>([]);\n const [activeNodeId, setActiveNodeId] = useState<string | number>('');\n const [sidebarWidth, setSidebarWidth] = useState(() => Math.max(minWidth, Math.min(initialWidth, maxWidth)));\n const sidebarRef = useRef<HTMLDivElement>(null);\n const scrollRef = useRef<HTMLDivElement>(null);\n const routerState = useRouterState({ select: (s: { location: { pathname: string } }) => s.location });\n const navigate = useNavigate();\n\n // 当 initialWidth 改变时,更新侧边栏宽度\n useEffect(() => {\n setSidebarWidth(Math.max(minWidth, Math.min(initialWidth, maxWidth)));\n }, [initialWidth, minWidth, maxWidth]);\n\n // 统一的宽度变更处理:同步内部状态并通知父组件。\n // pill 拖拽与外部同步都通过此入口,避免必须回传 initialWidth 才能生效。\n const handleInternalWidthChange = (width: number) => {\n const next = Math.max(minWidth, Math.min(width, maxWidth));\n setSidebarWidth(next);\n onWidthChange?.(next);\n };\n\n // 当语言改变或传入items prop时,更新菜单项\n useEffect(() => {\n if (propItems !== undefined) {\n setItems(propItems);\n } else if (getMenuItems) {\n setItems(getMenuItems(language));\n } else {\n setItems(defaultGetMenuItems(language));\n }\n }, [language, propItems, getMenuItems]);\n\n // 活跃节点变化时,自动滚动到可见区域(菜单过长时保证当前页可见)。\n // 延迟 350ms:Tree 展开动画(max-height 0.3s)期间布局仍在变化,立即\n // scrollIntoView 会计算到动画中途的位置而滚动不到位。\n useEffect(() => {\n if (!activeNodeId) return;\n const t = setTimeout(() => {\n scrollRef.current\n ?.querySelector('.tree-node-content-active')\n ?.scrollIntoView({ block: 'nearest', behavior: 'smooth' });\n }, 350);\n return () => clearTimeout(t);\n }, [activeNodeId]);\n\n // 兜底:确保鼠标悬停在菜单任意位置都能滚轮滚动。\n // 部分浏览器/嵌套滚动场景下原生滚轮可能不作用于该容器,这里用非被动\n // 监听手动滚动;成功滚动后 preventDefault,避免浏览器默认行为造成双重滚动。\n useEffect(() => {\n const el = scrollRef.current;\n if (!el) return;\n const onWheel = (e: WheelEvent) => {\n if (el.scrollHeight <= el.clientHeight) return;\n const dy = e.deltaMode === 1 ? e.deltaY * 16 : e.deltaY; // 行模式 → 像素\n if (dy === 0) return;\n const before = el.scrollTop;\n el.scrollTop = before + dy;\n if (el.scrollTop !== before) e.preventDefault();\n };\n el.addEventListener('wheel', onWheel, { passive: false });\n return () => el.removeEventListener('wheel', onWheel);\n }, []);\n\n // 将 MenuItem 转换为 TreeNode\n const convertToTreeNodes = (menuItems: MenuItem[], isTopLevel: boolean = true): TreeNode[] => {\n return menuItems.map(item => ({\n id: item.id,\n label: item.label,\n icon: item.icon || (!isTopLevel ? (\n <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\" />\n </svg>\n ) : undefined),\n children: item.children ? convertToTreeNodes(item.children, false) : undefined,\n meta: {\n path: item.path,\n },\n }));\n };\n\n // 转换后的树形数据\n const treeData = useMemo(() => convertToTreeNodes(items, true), [items]);\n\n // 获取默认展开的节点ID(默认全部展开)\n const defaultExpandedIds = useMemo(() => {\n if (items.length === 0) return [];\n\n // 收集所有有子节点的项的ID,使其默认全展开\n const collectAllExpandableIds = (menuItems: MenuItem[]): string[] => {\n let result: string[] = [];\n for (const item of menuItems) {\n if (item.children?.length) {\n result.push(item.id);\n result = [...result, ...collectAllExpandableIds(item.children)];\n }\n }\n return result;\n };\n\n return collectAllExpandableIds(items);\n }, [items]);\n\n // 更新活跃节点ID\n useEffect(() => {\n const currentPath = routerState.pathname;\n const findNodeByPath = (menuItems: MenuItem[]): string | null => {\n for (const item of menuItems) {\n if (item.path === currentPath) {\n return item.id;\n }\n if (item.children) {\n const found = findNodeByPath(item.children);\n if (found) return found;\n }\n }\n return null;\n };\n\n const nodeId = findNodeByPath(items);\n if (nodeId) {\n setActiveNodeId(nodeId);\n }\n }, [items, routerState.pathname]);\n\n\n\n // 处理节点点击\n const handleNodeClick = (node: TreeNode) => {\n // 如果节点有路径,直接导航\n if (node.meta?.path) {\n setActiveNodeId(node.id);\n navigate({ to: node.meta.path });\n return;\n }\n\n // 如果没有路径但有子节点,寻找第一个有路径的后代节点\n if (node.children && node.children.length > 0) {\n const findFirstPath = (nodes: TreeNode[]): TreeNode | null => {\n for (const n of nodes) {\n if (n.meta?.path) return n;\n if (n.children && n.children.length > 0) {\n const found = findFirstPath(n.children);\n if (found) return found;\n }\n }\n return null;\n };\n\n const firstNodeWithPath = findFirstPath(node.children);\n if (firstNodeWithPath) {\n setActiveNodeId(firstNodeWithPath.id);\n navigate({ to: firstNodeWithPath.meta!.path });\n } else {\n // 全都没有路径则激活当前节点\n setActiveNodeId(node.id);\n }\n } else {\n setActiveNodeId(node.id);\n }\n };\n\n if (isCollapsed) {\n return (\n <div\n ref={sidebarRef}\n className=\"blade-sidebar h-full bg-base-200 overflow-visible transition-all duration-200 ease-in-out relative\"\n style={{ width: `${collapsedWidth}px` }}\n >\n {onToggle && (\n <DesktopSidebarToggleButton\n isCollapsed={isCollapsed}\n side={side}\n onToggle={onToggle}\n sidebarWidth={sidebarWidth}\n collapsedWidth={collapsedWidth}\n onWidthChange={onWidthChange ? handleInternalWidthChange : undefined}\n minWidth={minWidth}\n maxWidth={maxWidth}\n anchorRef={sidebarRef}\n />\n )}\n <ul className=\"flex flex-col p-2 gap-1 h-full overflow-y-auto overflow-x-hidden\">\n {items.map(item => (\n <li key={item.id}>\n {item.path ? (\n <button\n onClick={() => navigate({ to: item.path! })}\n aria-label={item.label}\n className=\"flex justify-center items-center rounded-lg hover:bg-base-300 transition-colors w-full\"\n style={{\n WebkitTapHighlightColor: 'transparent',\n height: `${Math.min(collapsedWidth - 16, 40)}px`,\n width: `${Math.min(collapsedWidth - 16, 40)}px`,\n margin: '0 auto'\n }}\n >\n {item.icon || <span className=\"text-sm\">{item.label.charAt(0)}</span>}\n </button>\n ) : (\n <div\n className=\"flex justify-center items-center\"\n style={{\n WebkitTapHighlightColor: 'transparent',\n height: `${Math.min(collapsedWidth - 16, 40)}px`,\n width: `${Math.min(collapsedWidth - 16, 40)}px`,\n margin: '0 auto'\n }}\n >\n {item.icon || <span className=\"text-sm\">{item.label.charAt(0)}</span>}\n </div>\n )}\n </li>\n ))}\n </ul>\n </div>\n );\n }\n\n return (\n <div\n ref={sidebarRef}\n className=\"blade-sidebar h-full bg-base-200 overflow-visible flex flex-col transition-colors duration-200 ease-in-out relative\"\n style={{ width: `${sidebarWidth}px`, maxWidth, minWidth }}\n >\n {onToggle && (\n <DesktopSidebarToggleButton\n isCollapsed={isCollapsed}\n side={side}\n onToggle={onToggle}\n sidebarWidth={sidebarWidth}\n collapsedWidth={collapsedWidth}\n onWidthChange={onWidthChange ? handleInternalWidthChange : undefined}\n minWidth={minWidth}\n maxWidth={maxWidth}\n anchorRef={sidebarRef}\n />\n )}\n <div ref={scrollRef} className=\"sidebar-scroll min-h-0 flex-grow overflow-y-auto scrollbar-thin scrollbar-thumb-base-300 scrollbar-track-transparent\">\n <Tree\n data={treeData}\n activeNodeId={activeNodeId}\n defaultExpandedIds={defaultExpandedIds}\n showSearch={false}\n showExpandAll={false}\n showIcon={true}\n showCount={false}\n showLine={true}\n indent={1}\n togglePosition=\"right\"\n maxHeight=\"100%\"\n className={`sidebar-tree${levelText !== undefined ? ' sidebar-tree-level-text' : ''}`}\n renderLabel={(node, depth) => {\n const level = Math.min(depth, 2);\n const text = levelText?.[level];\n const defaults = DEFAULT_LEVEL_TEXT[level];\n return (\n <Text\n size={text?.size ?? defaults.size}\n weight={text?.weight ?? defaults.weight}\n color={activeNodeId === node.id ? 'inherit' : text?.color ?? 'inherit'}\n style={levelText === undefined\n ? { fontSize: 'inherit', lineHeight: 'inherit', fontWeight: 'inherit' }\n : undefined}\n >\n {node.label}\n </Text>\n );\n }}\n onNodeClick={handleNodeClick}\n />\n </div>\n\n <style>{`\n /* Sidebar Tree 自定义样式 */\n .sidebar-tree {\n background: transparent;\n border: none;\n padding: 0.5rem;\n }\n \n .sidebar-tree .tree-node-content {\n padding: 0.5rem 1rem;\n border-radius: 0.5rem;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n }\n \n /* 活跃状态 - 为每个主题设置匹配的配色 */\n .sidebar-tree .tree-node-content-active {\n font-weight: 600 !important;\n padding-left: calc(1rem - 4px) !important;\n }\n \n /* 主题活跃状态样式 - 从共用配置生成 */\n ${generateSidebarActiveStyles()}\n \n /* 悬停状态 */\n .sidebar-tree .tree-node-content:hover:not(.tree-node-active .tree-node-content):not(.tree-node-content-active) {\n background-color: var(--color-base-200);\n }\n \n /* 右侧展开按钮样式 */\n .sidebar-tree .tree-node-toggle-right {\n width: auto;\n height: auto;\n min-width: auto;\n min-height: auto;\n padding: 0.25rem;\n opacity: 0.6;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n border-radius: 0.25rem;\n }\n \n .sidebar-tree .tree-node-toggle-right:hover {\n opacity: 1;\n background-color: var(--color-base-300);\n }\n \n /* 右侧按钮图标旋转 */\n .sidebar-tree .tree-node-toggle-right svg {\n width: 1rem;\n height: 1rem;\n transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n }\n \n .sidebar-tree .tree-node-toggle-right.tree-node-toggle-expanded svg {\n transform: rotate(90deg);\n }\n \n /* 图标样式 */\n .sidebar-tree .tree-node-icon {\n width: 1.25rem;\n height: 1.25rem;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n transition: color 0.2s ease;\n }\n \n .sidebar-tree .tree-node-icon svg {\n width: 1.25rem;\n height: 1.25rem;\n }\n \n /* 子节点图标稍小 */\n .sidebar-tree .tree-node-children .tree-node-icon svg {\n width: 1rem;\n height: 1rem;\n opacity: 0.8;\n }\n \n /* Preserve the legacy all-level appearance only when typography is not configured. */\n .sidebar-tree:not(.sidebar-tree-level-text) .tree-node-label {\n font-size: 1rem;\n line-height: 1.4rem;\n font-weight: 500;\n }\n \n /* 连接线样式 - 强制显示!向右移动并加粗,增加整体左边距 */\n /* 使用双重选择器增加优先级,避免被其他 Tree 组件样式覆盖 */\n .sidebar-tree.sidebar-tree .tree-show-line .tree-node-children-expanded,\n .sidebar-tree.sidebar-tree .tree-node-children.tree-node-children-expanded,\n div.sidebar-tree .tree-show-line .tree-node-children-expanded,\n div.sidebar-tree .tree-node-children.tree-node-children-expanded {\n border-left: 3px solid rgba(128, 128, 128, 0.35) !important;\n margin-left: 24px !important;\n padding-left: 8px !important;\n box-sizing: border-box !important;\n }\n \n /* 隐藏 Tree 组件的圆点装饰 - 避免与 Sidebar 样式冲突 */\n .sidebar-tree.sidebar-tree .tree-show-line .tree-node-children-expanded::before,\n div.sidebar-tree .tree-show-line .tree-node-children-expanded::before {\n display: none !important;\n }\n \n /* 隐藏 Tree 组件的标题和操作按钮 */\n .sidebar-tree .tree-header,\n .sidebar-tree .tree-search,\n .sidebar-tree .tree-actions {\n display: none;\n }\n \n /* 移除内边距 */\n .sidebar-tree > div:first-child {\n padding: 0;\n }\n \n /* 子节点动画优化 - 减小间距 */\n .sidebar-tree .tree-node-children {\n margin-top: 0.125rem !important;\n }\n \n /* 一级菜单项间距 */\n .sidebar-tree > div > .tree-nodes > .tree-node {\n margin-bottom: 0.375rem;\n }\n \n /* 二级菜单项间距 */\n .sidebar-tree .tree-node-children > .tree-node {\n margin-bottom: 0.125rem;\n }\n `}</style>\n </div>\n );\n};\n\nexport default Sidebar; "],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Sidebar.js","names":[],"sources":["../../src/layouts/Sidebar.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useMemo } from 'react';\nimport { Link, useNavigate, useRouterState } from '@tanstack/react-router';\nimport { MenuItem } from '../types/menu';\nimport { getMenuItems as defaultGetMenuItems } from '../utils/menu';\nimport { Tree, TreeNode } from '../components/Tree';\nimport { generateSidebarActiveStyles } from '../styles/themeStyles';\nimport { DesktopSidebarToggleButton } from '../components/SidebarToggleButton';\nimport Text, { type TextProps } from '../components/Text';\n\nexport type SidebarLevelText = Pick<TextProps, 'size' | 'weight' | 'color'>;\n\nconst DEFAULT_LEVEL_TEXT = [\n { size: 'base', weight: 'semibold' },\n { size: 'sm', weight: 'medium' },\n { size: 'sm', weight: 'normal' },\n] as const satisfies readonly SidebarLevelText[];\n\n// 组件属性\nexport type SidebarProps = {\n isCollapsed: boolean;\n /** 侧栏所在侧,控制内侧 pill 的位置与调宽方向。 */\n side?: 'left' | 'right';\n language: 'zh' | 'en';\n items?: MenuItem[];\n /**\n * Opt-in typography for levels 1–3; deeper nodes reuse level 3.\n * Omitted: preserve legacy Sidebar/LayoutSuite typography. When supplied,\n * missing values default to base/sm/sm and semibold/medium/normal.\n * Levels 3+ default to theme-adaptive neutral gray, even without levelText.\n * Explicit colors retain Text semantics (secondary may be a theme accent).\n * Selected labels always inherit the active row color.\n */\n levelText?: readonly [SidebarLevelText?, SidebarLevelText?, SidebarLevelText?];\n getMenuItems?: (language: 'zh' | 'en') => MenuItem[];\n onWidthChange?: (width: number) => void;\n initialWidth?: number;\n collapsedWidth?: number;\n /**\n * 折叠 / 展开切换回调。传入后,侧边栏会在其边缘渲染统一的悬浮 pill 控制条\n * (点击折叠、拖拽调节宽度),无需再在外层单独渲染 SidebarToggleButtons。\n */\n onToggle?: () => void;\n /** 拖拽调节宽度的最小值(px) */\n minWidth?: number;\n /** 拖拽调节宽度的最大值(px) */\n maxWidth?: number;\n};\n\nconst Sidebar: React.FC<SidebarProps> = ({\n isCollapsed,\n side = 'left',\n language,\n items: propItems,\n levelText,\n getMenuItems,\n onWidthChange,\n initialWidth = 280,\n collapsedWidth = 64,\n onToggle,\n minWidth = 160,\n maxWidth = 400,\n}) => {\n const [items, setItems] = useState<MenuItem[]>([]);\n const [activeNodeId, setActiveNodeId] = useState<string | number>('');\n const [sidebarWidth, setSidebarWidth] = useState(() => Math.max(minWidth, Math.min(initialWidth, maxWidth)));\n const sidebarRef = useRef<HTMLDivElement>(null);\n const scrollRef = useRef<HTMLDivElement>(null);\n const routerState = useRouterState({ select: (s: { location: { pathname: string } }) => s.location });\n const navigate = useNavigate();\n\n // 当 initialWidth 改变时,更新侧边栏宽度\n useEffect(() => {\n setSidebarWidth(Math.max(minWidth, Math.min(initialWidth, maxWidth)));\n }, [initialWidth, minWidth, maxWidth]);\n\n // 统一的宽度变更处理:同步内部状态并通知父组件。\n // pill 拖拽与外部同步都通过此入口,避免必须回传 initialWidth 才能生效。\n const handleInternalWidthChange = (width: number) => {\n const next = Math.max(minWidth, Math.min(width, maxWidth));\n setSidebarWidth(next);\n onWidthChange?.(next);\n };\n\n // 当语言改变或传入items prop时,更新菜单项\n useEffect(() => {\n if (propItems !== undefined) {\n setItems(propItems);\n } else if (getMenuItems) {\n setItems(getMenuItems(language));\n } else {\n setItems(defaultGetMenuItems(language));\n }\n }, [language, propItems, getMenuItems]);\n\n // 活跃节点变化时,自动滚动到可见区域(菜单过长时保证当前页可见)。\n // 延迟 350ms:Tree 展开动画(max-height 0.3s)期间布局仍在变化,立即\n // scrollIntoView 会计算到动画中途的位置而滚动不到位。\n useEffect(() => {\n if (!activeNodeId) return;\n const t = setTimeout(() => {\n scrollRef.current\n ?.querySelector(isCollapsed ? '[aria-current=\"page\"]' : '.tree-node-content-active')\n ?.scrollIntoView({ block: 'nearest', behavior: window.matchMedia('(prefers-reduced-motion: reduce)').matches ? 'instant' : 'smooth' });\n }, 350);\n return () => clearTimeout(t);\n }, [activeNodeId, isCollapsed]);\n\n // 兜底:确保鼠标悬停在菜单任意位置都能滚轮滚动。\n // 部分浏览器/嵌套滚动场景下原生滚轮可能不作用于该容器,这里用非被动\n // 监听手动滚动;成功滚动后 preventDefault,避免浏览器默认行为造成双重滚动。\n useEffect(() => {\n const el = scrollRef.current;\n if (!el) return;\n const onWheel = (e: WheelEvent) => {\n if (el.scrollHeight <= el.clientHeight) return;\n const dy = e.deltaMode === 1 ? e.deltaY * 16 : e.deltaY; // 行模式 → 像素\n if (dy === 0) return;\n const before = el.scrollTop;\n el.scrollTop = before + dy;\n if (el.scrollTop !== before) e.preventDefault();\n };\n el.addEventListener('wheel', onWheel, { passive: false });\n return () => el.removeEventListener('wheel', onWheel);\n }, [isCollapsed]);\n\n // 将 MenuItem 转换为 TreeNode\n const convertToTreeNodes = (menuItems: MenuItem[], isTopLevel: boolean = true): TreeNode[] => {\n return menuItems.map(item => ({\n id: item.id,\n label: item.label,\n icon: item.icon || (!isTopLevel ? (\n <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\" />\n </svg>\n ) : undefined),\n children: item.children ? convertToTreeNodes(item.children, false) : undefined,\n meta: {\n path: item.path,\n },\n }));\n };\n\n // 转换后的树形数据\n const treeData = useMemo(() => convertToTreeNodes(items, true), [items]);\n\n // 获取默认展开的节点ID(默认全部展开)\n const defaultExpandedIds = useMemo(() => {\n if (items.length === 0) return [];\n\n // 收集所有有子节点的项的ID,使其默认全展开\n const collectAllExpandableIds = (menuItems: MenuItem[]): string[] => {\n let result: string[] = [];\n for (const item of menuItems) {\n if (item.children?.length) {\n result.push(item.id);\n result = [...result, ...collectAllExpandableIds(item.children)];\n }\n }\n return result;\n };\n\n return collectAllExpandableIds(items);\n }, [items]);\n\n // 更新活跃节点ID\n useEffect(() => {\n const currentPath = routerState.pathname;\n const findNodeByPath = (menuItems: MenuItem[]): string | null => {\n for (const item of menuItems) {\n if (item.path === currentPath) {\n return item.id;\n }\n if (item.children) {\n const found = findNodeByPath(item.children);\n if (found) return found;\n }\n }\n return null;\n };\n\n const nodeId = findNodeByPath(items);\n setActiveNodeId(nodeId ?? '');\n }, [items, routerState.pathname]);\n\n\n\n // 处理节点点击\n const handleNodeClick = (node: TreeNode) => {\n // 如果节点有路径,直接导航\n if (node.meta?.path) {\n setActiveNodeId(node.id);\n navigate({ to: node.meta.path });\n return;\n }\n\n // 如果没有路径但有子节点,寻找第一个有路径的后代节点\n if (node.children && node.children.length > 0) {\n const findFirstPath = (nodes: TreeNode[]): TreeNode | null => {\n for (const n of nodes) {\n if (n.meta?.path) return n;\n if (n.children && n.children.length > 0) {\n const found = findFirstPath(n.children);\n if (found) return found;\n }\n }\n return null;\n };\n\n const firstNodeWithPath = findFirstPath(node.children);\n if (firstNodeWithPath) {\n setActiveNodeId(firstNodeWithPath.id);\n navigate({ to: firstNodeWithPath.meta!.path });\n } else {\n // 全都没有路径则激活当前节点\n setActiveNodeId(node.id);\n }\n } else {\n setActiveNodeId(node.id);\n }\n };\n\n const collectLinks = (nodes: MenuItem[], parents: string[] = []): { item: MenuItem; trail: string }[] =>\n nodes.flatMap(item => {\n const trail = [...parents, item.label];\n return [\n ...(item.path ? [{ item, trail: trail.join(' / ') }] : []),\n ...collectLinks(item.children ?? [], trail),\n ];\n });\n\n /* Keep Tree mounted so rail toggles do not reset the user's expanded branches. */\n const rail = isCollapsed ? (\n <nav ref={scrollRef} className=\"sidebar-rail\" aria-label={language === 'zh' ? '侧边导航' : 'Sidebar navigation'}>\n {items.map(group => {\n const links = collectLinks([group]);\n return links.length > 0 ? (\n <div key={group.id} role=\"group\" aria-label={group.label} className=\"sidebar-rail-group\">\n {links.map(({ item, trail }) => (\n <Link\n key={item.id}\n to={item.path!}\n className=\"sidebar-rail-link\"\n aria-label={trail}\n title={trail}\n aria-current={routerState.pathname === item.path ? 'page' : undefined}\n >\n <span aria-hidden=\"true\">{item.icon || <span>{item.label.charAt(0)}</span>}</span>\n </Link>\n ))}\n </div>\n ) : null;\n })}\n </nav>\n ) : null;\n\n return (\n <div\n ref={sidebarRef}\n className=\"blade-sidebar sidebar-container h-full bg-base-200 overflow-visible flex flex-col transition-colors duration-200 ease-in-out relative\"\n style={isCollapsed ? { width: collapsedWidth } : { width: sidebarWidth, maxWidth, minWidth }}\n >\n {onToggle && (\n <DesktopSidebarToggleButton\n isCollapsed={isCollapsed}\n side={side}\n onToggle={onToggle}\n sidebarWidth={sidebarWidth}\n collapsedWidth={collapsedWidth}\n onWidthChange={onWidthChange ? handleInternalWidthChange : undefined}\n minWidth={minWidth}\n maxWidth={maxWidth}\n anchorRef={sidebarRef}\n />\n )}\n {rail}\n <div hidden={isCollapsed} style={isCollapsed ? { display: 'none' } : undefined} ref={isCollapsed ? undefined : scrollRef} className=\"sidebar-scroll min-h-0 flex-grow overflow-y-auto scrollbar-thin scrollbar-thumb-base-300 scrollbar-track-transparent\">\n <Tree\n data={treeData}\n activeNodeId={activeNodeId}\n defaultExpandedIds={defaultExpandedIds}\n showSearch={false}\n showExpandAll={false}\n showIcon={true}\n showCount={false}\n showLine={true}\n indent={1}\n togglePosition=\"right\"\n maxHeight=\"100%\"\n className={`sidebar-tree${levelText !== undefined ? ' sidebar-tree-level-text' : ''}`}\n renderLabel={(node, depth) => {\n const level = Math.min(depth, 2);\n const text = levelText?.[level];\n const defaults = DEFAULT_LEVEL_TEXT[level];\n return (\n <Text\n size={text?.size ?? defaults.size}\n weight={text?.weight ?? defaults.weight}\n color={activeNodeId === node.id ? 'inherit' : text?.color ?? 'inherit'}\n style={{\n ...(levelText === undefined ? { fontSize: 'inherit', lineHeight: 'inherit', fontWeight: 'inherit' } : {}),\n ...(level === 2 && text?.color === undefined && activeNodeId !== node.id\n ? { color: 'var(--sidebar-level-muted)' } : {}),\n }}\n >\n {node.label}\n </Text>\n );\n }}\n onNodeClick={handleNodeClick}\n />\n </div>\n\n <style>{`\n .sidebar-container {\n --sidebar-level-muted: oklch(from color-mix(in oklab, var(--color-base-content) 76%, var(--color-base-200)) l 0 0);\n }\n /* LayoutSuite uses semantic surfaces even in colorful themes. Match its text luminance. */\n .dishui-layout-suite-sidebar > .sidebar-container {\n --sidebar-level-muted: oklch(from var(--dishui-text-tertiary) l 0 0);\n }\n .sidebar-rail { min-height: 0; height: 100%; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; padding: 6px; }\n .sidebar-rail-group { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 4px 2px; margin-bottom: 8px; border: 1px solid var(--dishui-border-hairline, var(--color-base-300)); border-radius: 10px; }\n .sidebar-rail-link { display: flex; align-items: center; justify-content: center; width: 100%; max-width: 36px; min-height: 36px; flex-shrink: 0; border-radius: 6px; color: var(--sidebar-level-muted); text-decoration: none; transition: background-color 150ms, color 150ms; }\n .sidebar-rail-link > span { display: flex; align-items: center; justify-content: center; }\n .sidebar-rail-link svg { width: 18px; height: 18px; }\n .sidebar-rail-link:hover { background: var(--color-base-300); }\n .sidebar-rail-link[aria-current=\"page\"] { color: var(--color-primary); background: color-mix(in oklab, var(--color-primary) 12%, var(--color-base-200)); box-shadow: inset 2px 0 var(--color-primary); }\n .sidebar-rail-link:focus-visible { outline: 2px solid var(--dishui-ring, var(--color-primary)); outline-offset: -2px; }\n @media (prefers-reduced-motion: reduce) { .sidebar-rail-link { transition: none; } }\n /* Sidebar Tree 自定义样式 */\n .sidebar-tree {\n background: transparent;\n border: none;\n padding: 0.5rem;\n }\n \n .sidebar-tree .tree-node-content {\n padding: 0.5rem 1rem;\n border-radius: 0.5rem;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n }\n \n /* 活跃状态 - 为每个主题设置匹配的配色 */\n .sidebar-tree .tree-node-content-active {\n font-weight: 600 !important;\n padding-left: calc(1rem - 4px) !important;\n }\n \n /* 主题活跃状态样式 - 从共用配置生成 */\n ${generateSidebarActiveStyles()}\n \n /* 悬停状态 */\n .sidebar-tree .tree-node-content:hover:not(.tree-node-active .tree-node-content):not(.tree-node-content-active) {\n background-color: var(--color-base-200);\n }\n \n /* 右侧展开按钮样式 */\n .sidebar-tree .tree-node-toggle-right {\n width: auto;\n height: auto;\n min-width: auto;\n min-height: auto;\n padding: 0.25rem;\n opacity: 0.6;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n border-radius: 0.25rem;\n }\n \n .sidebar-tree .tree-node-toggle-right:hover {\n opacity: 1;\n background-color: var(--color-base-300);\n }\n \n /* 右侧按钮图标旋转 */\n .sidebar-tree .tree-node-toggle-right svg {\n width: 1rem;\n height: 1rem;\n transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n }\n \n .sidebar-tree .tree-node-toggle-right.tree-node-toggle-expanded svg {\n transform: rotate(90deg);\n }\n \n /* 图标样式 */\n .sidebar-tree .tree-node-icon {\n width: 1.25rem;\n height: 1.25rem;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n transition: color 0.2s ease;\n }\n \n .sidebar-tree .tree-node-icon svg {\n width: 1.25rem;\n height: 1.25rem;\n }\n \n /* 子节点图标稍小 */\n .sidebar-tree .tree-node-children .tree-node-icon svg {\n width: 1rem;\n height: 1rem;\n opacity: 0.8;\n }\n \n /* Preserve the legacy all-level appearance only when typography is not configured. */\n .sidebar-tree:not(.sidebar-tree-level-text) .tree-node-label {\n font-size: 1rem;\n line-height: 1.4rem;\n font-weight: 500;\n }\n \n /* 连接线样式 - 强制显示!向右移动并加粗,增加整体左边距 */\n /* 使用双重选择器增加优先级,避免被其他 Tree 组件样式覆盖 */\n .sidebar-tree.sidebar-tree .tree-show-line .tree-node-children-expanded,\n .sidebar-tree.sidebar-tree .tree-node-children.tree-node-children-expanded,\n div.sidebar-tree .tree-show-line .tree-node-children-expanded,\n div.sidebar-tree .tree-node-children.tree-node-children-expanded {\n border-left: 3px solid rgba(128, 128, 128, 0.35) !important;\n margin-left: 24px !important;\n padding-left: 8px !important;\n box-sizing: border-box !important;\n }\n \n /* 隐藏 Tree 组件的圆点装饰 - 避免与 Sidebar 样式冲突 */\n .sidebar-tree.sidebar-tree .tree-show-line .tree-node-children-expanded::before,\n div.sidebar-tree .tree-show-line .tree-node-children-expanded::before {\n display: none !important;\n }\n \n /* 隐藏 Tree 组件的标题和操作按钮 */\n .sidebar-tree .tree-header,\n .sidebar-tree .tree-search,\n .sidebar-tree .tree-actions {\n display: none;\n }\n \n /* 移除内边距 */\n .sidebar-tree > div:first-child {\n padding: 0;\n }\n \n /* 子节点动画优化 - 减小间距 */\n .sidebar-tree .tree-node-children {\n margin-top: 0.125rem !important;\n }\n \n /* 一级菜单项间距 */\n .sidebar-tree > div > .tree-nodes > .tree-node {\n margin-bottom: 0.375rem;\n }\n \n /* 二级菜单项间距 */\n .sidebar-tree .tree-node-children > .tree-node {\n margin-bottom: 0.125rem;\n }\n `}</style>\n </div>\n );\n};\n\nexport default Sidebar; "],"mappings":"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"}
|