@hi-ui/menu 5.0.0-experimental.2 → 5.0.0-rc.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +42 -84
- package/lib/cjs/SideMenu.js +24 -3
- package/lib/cjs/styles/index.scss.js +1 -1
- package/lib/esm/SideMenu.js +24 -3
- package/lib/esm/styles/index.scss.js +1 -1
- package/lib/types/GroupMenu.d.ts +4 -4
- package/lib/types/Menu.d.ts +4 -4
- package/lib/types/MenuSearch.d.ts +14 -14
- package/lib/types/SideMenu.d.ts +4 -4
- package/lib/types/context.d.ts +13 -13
- package/lib/types/util.d.ts +1 -1
- package/package.json +29 -29
package/CHANGELOG.md
CHANGED
|
@@ -1,47 +1,6 @@
|
|
|
1
1
|
# @hi-ui/menu
|
|
2
2
|
|
|
3
|
-
## 5.0.0-
|
|
4
|
-
|
|
5
|
-
### Minor Changes
|
|
6
|
-
|
|
7
|
-
- 59cef699f: feat: 组件语义化样式改造，增加 styles 和 classNames 属性 (5.0)
|
|
8
|
-
|
|
9
|
-
### Patch Changes
|
|
10
|
-
|
|
11
|
-
- eb17c4697: style: 修复 UI/样式问题 (5.0)
|
|
12
|
-
- Updated dependencies [7f204c892]
|
|
13
|
-
- Updated dependencies [66bc9c3e2]
|
|
14
|
-
- Updated dependencies [eb17c4697]
|
|
15
|
-
- Updated dependencies [eb17c4697]
|
|
16
|
-
- Updated dependencies [c407744fe]
|
|
17
|
-
- Updated dependencies [59cef699f]
|
|
18
|
-
- @hi-ui/icons@5.0.0-experimental.1
|
|
19
|
-
- @hi-ui/ellipsis-tooltip@5.0.0-experimental.1
|
|
20
|
-
- @hi-ui/core@5.0.0-experimental.1
|
|
21
|
-
- @hi-ui/button@5.0.0-experimental.1
|
|
22
|
-
- @hi-ui/highlighter@5.0.0-experimental.1
|
|
23
|
-
- @hi-ui/icon-button@5.0.0-experimental.1
|
|
24
|
-
- @hi-ui/input@5.0.0-experimental.2
|
|
25
|
-
- @hi-ui/picker@5.0.0-experimental.2
|
|
26
|
-
- @hi-ui/popper@5.0.0-experimental.1
|
|
27
|
-
- @hi-ui/scrollbar@5.0.0-experimental.1
|
|
28
|
-
- @hi-ui/tooltip@5.0.0-experimental.1
|
|
29
|
-
- @hi-ui/use-merge-semantic@5.0.0-experimental.0
|
|
30
|
-
|
|
31
|
-
## 5.0.0-experimental.1
|
|
32
|
-
|
|
33
|
-
### Patch Changes
|
|
34
|
-
|
|
35
|
-
- ec6005193: style(layout,menu): 样式和示例调整 (5.0)
|
|
36
|
-
- 发布 hiui experimental 版本
|
|
37
|
-
- Updated dependencies [8f23e9322]
|
|
38
|
-
- Updated dependencies [b27483796]
|
|
39
|
-
- Updated dependencies [900c6c2f0]
|
|
40
|
-
- Updated dependencies
|
|
41
|
-
- @hi-ui/input@5.0.0-experimental.1
|
|
42
|
-
- @hi-ui/picker@5.0.0-experimental.1
|
|
43
|
-
|
|
44
|
-
## 5.0.0-experimental.0
|
|
3
|
+
## 5.0.0-rc.0
|
|
45
4
|
|
|
46
5
|
### Major Changes
|
|
47
6
|
|
|
@@ -49,109 +8,108 @@
|
|
|
49
8
|
|
|
50
9
|
### Minor Changes
|
|
51
10
|
|
|
11
|
+
- d49302358: feat(menu): title 支持显示 2 行 (5.0)
|
|
52
12
|
- 5828ae8ab: feat(menu): 增加 GroupMenu 和 SideMenu 组件 (5.0)
|
|
53
13
|
- c38e6e4bf: feat(menu): GroupMenu 组件增加 titleRender 参数 (5.0)
|
|
54
14
|
- a5937df94: feat(menu): add showTitleOnMini api (5.0)
|
|
15
|
+
- 59cef699f: feat: 组件语义化样式改造，增加 styles 和 classNames 属性 (5.0)
|
|
55
16
|
- bfc1cb7c8: chore(menu): 增加变更记录文件 (5.0)
|
|
56
17
|
|
|
57
18
|
### Patch Changes
|
|
58
19
|
|
|
59
|
-
- 6fb223e3a: style: fix ui bug (5.0)
|
|
60
20
|
- 1e226cd66: chore: 修改 react-compat 依赖管理方式 & 更新 react-transition-group 依赖 (5.0)
|
|
61
21
|
- 9b34d99bc: chore: 将代码中 v4 改为 v5 (5.0)
|
|
62
|
-
- 1662753e0: style: fix ui bug (5.0)
|
|
63
22
|
- e785237b1: <br />
|
|
64
23
|
- perf(layout): 优化导航菜单交互体验 (5.0)
|
|
65
24
|
- perf(menu): 优化搜索菜单组件的样式和交互逻辑 & 修改分组菜单样式问题 (5.0)
|
|
66
25
|
- 8c0ee78f0: perf: 优化全局 size 配置,对于组件中没有的 size 值,取最接近的尺寸展示 (5.0)
|
|
67
|
-
- c021539a3: style: fix ui bug (5.0)
|
|
68
|
-
- be5a59325: style: 修改样式问题 (5.0)
|
|
69
26
|
- 79ea480f3: feat(global-context): 增加 size api 全局配置 (5.0)
|
|
70
|
-
- 2b6cfd655: style: fix ui bug (5.0)
|
|
71
27
|
- 2e56529f7: styles: 主题定制功能完善&&样式变量化写法改造&&兼容 RTL (5.0)
|
|
72
28
|
- 95abba983: fix: 修改 UI 问题 (5.0)
|
|
29
|
+
- eb17c4697: style: 修复 UI/样式问题 (5.0)
|
|
73
30
|
- c2e765ada: style(layout): 修改 Sider 收起时宽度为 60px & 增加 width 参数 (5.0)
|
|
74
31
|
- 52d25f630: perf(layout&menu): 优化 FloatMenuContainer 组件的折叠逻辑 & 修改 SideMenu 组件 hover 样式 (5.0)
|
|
75
32
|
- 1b824c9ad: style(menu): 优化 GroupMenu 组件的样式和交互逻辑 (5.0)
|
|
33
|
+
- ec6005193: style(layout,menu): 样式和示例调整 (5.0)
|
|
76
34
|
- 33da3144e: build: 将 package.json 中 exports 配置中的 types 配置放在最上面 (5.0)
|
|
77
|
-
- 7f3abee55: style: fix ui bug (5.0)
|
|
78
|
-
- a0f0c9d6b: style: 修改 UI 问题 (5.0)
|
|
79
35
|
- Updated dependencies [0b34e1c15]
|
|
80
|
-
- Updated dependencies [6fb223e3a]
|
|
81
36
|
- Updated dependencies [da2e63a14]
|
|
82
37
|
- Updated dependencies [1e226cd66]
|
|
83
38
|
- Updated dependencies [eea29eade]
|
|
84
39
|
- Updated dependencies [b9989e482]
|
|
85
|
-
- Updated dependencies [
|
|
40
|
+
- Updated dependencies [7f204c892]
|
|
41
|
+
- Updated dependencies [66bc9c3e2]
|
|
86
42
|
- Updated dependencies [122d1d859]
|
|
87
43
|
- Updated dependencies [f1ab51725]
|
|
88
44
|
- Updated dependencies [41552be0b]
|
|
45
|
+
- Updated dependencies [eb17c4697]
|
|
89
46
|
- Updated dependencies [8c0ee78f0]
|
|
90
47
|
- Updated dependencies [9b34d99bc]
|
|
91
48
|
- Updated dependencies [8f3aa85e4]
|
|
92
|
-
- Updated dependencies [f4fc0ef30]
|
|
93
|
-
- Updated dependencies [c021539a3]
|
|
94
49
|
- Updated dependencies [ec4c7faa2]
|
|
95
50
|
- Updated dependencies [29cae09ea]
|
|
96
51
|
- Updated dependencies [95dd766b9]
|
|
97
52
|
- Updated dependencies [fd4c20bbd]
|
|
98
|
-
- Updated dependencies [be5a59325]
|
|
99
|
-
- Updated dependencies [71fc15e5c]
|
|
100
53
|
- Updated dependencies [79ea480f3]
|
|
101
54
|
- Updated dependencies [fa5a60b56]
|
|
102
55
|
- Updated dependencies [2e56529f7]
|
|
56
|
+
- Updated dependencies [3a7186e4b]
|
|
103
57
|
- Updated dependencies [277c5033a]
|
|
104
58
|
- Updated dependencies [95abba983]
|
|
59
|
+
- Updated dependencies [8f23e9322]
|
|
105
60
|
- Updated dependencies [8a92ec660]
|
|
106
61
|
- Updated dependencies [4a31cea53]
|
|
62
|
+
- Updated dependencies [b27483796]
|
|
107
63
|
- Updated dependencies [1429eced2]
|
|
64
|
+
- Updated dependencies [eb17c4697]
|
|
108
65
|
- Updated dependencies [9b34d99bc]
|
|
109
66
|
- Updated dependencies [976ec929d]
|
|
110
67
|
- Updated dependencies [d021b4fa6]
|
|
111
68
|
- Updated dependencies [f1ab51725]
|
|
112
69
|
- Updated dependencies [6dca7795c]
|
|
70
|
+
- Updated dependencies [900c6c2f0]
|
|
113
71
|
- Updated dependencies [5210770d9]
|
|
114
|
-
- Updated dependencies [
|
|
72
|
+
- Updated dependencies [c407744fe]
|
|
73
|
+
- Updated dependencies [d91a8bb0f]
|
|
115
74
|
- Updated dependencies [77d969c2e]
|
|
116
75
|
- Updated dependencies [4006b2c8c]
|
|
117
76
|
- Updated dependencies [e42e2badf]
|
|
118
77
|
- Updated dependencies [33da3144e]
|
|
119
|
-
- Updated dependencies [0a8cc07a7]
|
|
120
|
-
- Updated dependencies [7f3abee55]
|
|
121
78
|
- Updated dependencies [6fcda9bf2]
|
|
122
79
|
- Updated dependencies [0a4e90dbd]
|
|
123
80
|
- Updated dependencies [58ad82e94]
|
|
124
|
-
- Updated dependencies [a0f0c9d6b]
|
|
125
81
|
- Updated dependencies [0f4794deb]
|
|
82
|
+
- Updated dependencies [95d930354]
|
|
126
83
|
- Updated dependencies [f2be367e9]
|
|
127
84
|
- Updated dependencies [1972fd16a]
|
|
85
|
+
- Updated dependencies [59cef699f]
|
|
128
86
|
- Updated dependencies [99801c2d1]
|
|
129
|
-
- Updated dependencies [86910f5e2]
|
|
130
87
|
- Updated dependencies [cb7b794d0]
|
|
131
|
-
- @hi-ui/picker@5.0.0-
|
|
132
|
-
- @hi-ui/
|
|
133
|
-
- @hi-ui/
|
|
134
|
-
- @hi-ui/
|
|
135
|
-
- @hi-ui/button@5.0.0-
|
|
136
|
-
- @hi-ui/icons@5.0.0-
|
|
137
|
-
- @hi-ui/
|
|
138
|
-
- @hi-ui/core@5.0.0-
|
|
139
|
-
- @hi-ui/use-id@5.0.0-
|
|
140
|
-
- @hi-ui/use-latest@5.0.0-
|
|
141
|
-
- @hi-ui/use-merge-refs@5.0.0-
|
|
142
|
-
- @hi-ui/use-outside-click@5.0.0-
|
|
143
|
-
- @hi-ui/use-resize-observer@5.0.0-
|
|
144
|
-
- @hi-ui/use-toggle@5.0.0-
|
|
145
|
-
- @hi-ui/use-uncontrolled-state@5.0.0-
|
|
146
|
-
- @hi-ui/
|
|
147
|
-
- @hi-ui/
|
|
148
|
-
- @hi-ui/scrollbar@5.0.0-
|
|
149
|
-
- @hi-ui/array-utils@5.0.0-
|
|
150
|
-
- @hi-ui/classname@5.0.0-
|
|
151
|
-
- @hi-ui/env@5.0.0-
|
|
152
|
-
- @hi-ui/times@5.0.0-
|
|
153
|
-
- @hi-ui/tree-utils@5.0.0-
|
|
154
|
-
- @hi-ui/type-assertion@5.0.0-
|
|
88
|
+
- @hi-ui/picker@5.0.0-rc.0
|
|
89
|
+
- @hi-ui/input@5.0.0-rc.0
|
|
90
|
+
- @hi-ui/popper@5.0.0-rc.0
|
|
91
|
+
- @hi-ui/tooltip@5.0.0-rc.0
|
|
92
|
+
- @hi-ui/button@5.0.0-rc.0
|
|
93
|
+
- @hi-ui/icons@5.0.0-rc.0
|
|
94
|
+
- @hi-ui/ellipsis-tooltip@5.0.0-rc.0
|
|
95
|
+
- @hi-ui/core@5.0.0-rc.0
|
|
96
|
+
- @hi-ui/use-id@5.0.0-rc.0
|
|
97
|
+
- @hi-ui/use-latest@5.0.0-rc.0
|
|
98
|
+
- @hi-ui/use-merge-refs@5.0.0-rc.0
|
|
99
|
+
- @hi-ui/use-outside-click@5.0.0-rc.0
|
|
100
|
+
- @hi-ui/use-resize-observer@5.0.0-rc.0
|
|
101
|
+
- @hi-ui/use-toggle@5.0.0-rc.0
|
|
102
|
+
- @hi-ui/use-uncontrolled-state@5.0.0-rc.0
|
|
103
|
+
- @hi-ui/highlighter@5.0.0-rc.0
|
|
104
|
+
- @hi-ui/icon-button@5.0.0-rc.0
|
|
105
|
+
- @hi-ui/scrollbar@5.0.0-rc.0
|
|
106
|
+
- @hi-ui/array-utils@5.0.0-rc.0
|
|
107
|
+
- @hi-ui/classname@5.0.0-rc.0
|
|
108
|
+
- @hi-ui/env@5.0.0-rc.0
|
|
109
|
+
- @hi-ui/times@5.0.0-rc.0
|
|
110
|
+
- @hi-ui/tree-utils@5.0.0-rc.0
|
|
111
|
+
- @hi-ui/type-assertion@5.0.0-rc.0
|
|
112
|
+
- @hi-ui/use-merge-semantic@5.0.0-rc.0
|
|
155
113
|
|
|
156
114
|
## 4.3.2
|
|
157
115
|
|
package/lib/cjs/SideMenu.js
CHANGED
|
@@ -115,9 +115,17 @@ var SideMenu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
|
115
115
|
onMouseEnter: function onMouseEnter(evt) {
|
|
116
116
|
var currentTarget = evt.currentTarget;
|
|
117
117
|
var titleElement = currentTarget.querySelector("." + prefixCls + "-item__title");
|
|
118
|
+
if (!titleElement) {
|
|
119
|
+
handleMouseEnter(evt, id, item);
|
|
120
|
+
return;
|
|
121
|
+
}
|
|
118
122
|
var scrollWidth = titleElement.scrollWidth,
|
|
119
|
-
clientWidth = titleElement.clientWidth
|
|
120
|
-
|
|
123
|
+
clientWidth = titleElement.clientWidth,
|
|
124
|
+
scrollHeight = titleElement.scrollHeight,
|
|
125
|
+
clientHeight = titleElement.clientHeight;
|
|
126
|
+
// 单行溢出：scrollWidth > clientWidth；多行（如 mini 2 行）溢出：scrollHeight > clientHeight
|
|
127
|
+
var isOverflow = scrollWidth > clientWidth || scrollHeight > clientHeight;
|
|
128
|
+
if (isOverflow) {
|
|
121
129
|
Tooltip__default["default"].open(currentTarget, {
|
|
122
130
|
key: "side-menu-tooltip-" + id,
|
|
123
131
|
title: title,
|
|
@@ -139,7 +147,20 @@ var SideMenu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
|
139
147
|
style: styles === null || styles === void 0 ? void 0 : styles.itemIcon
|
|
140
148
|
}, icon), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
141
149
|
className: classname.cx(prefixCls + "-item__title", classNames === null || classNames === void 0 ? void 0 : classNames.itemTitle),
|
|
142
|
-
style: styles === null || styles === void 0 ? void 0 : styles.itemTitle
|
|
150
|
+
style: styles === null || styles === void 0 ? void 0 : styles.itemTitle,
|
|
151
|
+
ref: function ref(el) {
|
|
152
|
+
if (el) {
|
|
153
|
+
if (mini) {
|
|
154
|
+
if (el.clientHeight > 28) {
|
|
155
|
+
el.style.marginBlockEnd = '-28px';
|
|
156
|
+
} else {
|
|
157
|
+
el.style.marginBlockEnd = '';
|
|
158
|
+
}
|
|
159
|
+
} else {
|
|
160
|
+
el.style.marginBlockEnd = '';
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
}
|
|
143
164
|
}, title)));
|
|
144
165
|
})));
|
|
145
166
|
});
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
Object.defineProperty(exports, '__esModule', {
|
|
13
13
|
value: true
|
|
14
14
|
});
|
|
15
|
-
var css_248z = ".hi-v5-menu-fat-menu {background-color: var(--hi-v5-color-static-white, #fff);margin: 0;font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-4, 8px);display: -webkit-box;display: -ms-flexbox;display: flex;color: var(--hi-v5-color-gray-800, #1a1d26);border-radius: var(--hi-v5-border-radius-lg, 6px);-ms-flex-wrap: wrap;flex-wrap: wrap;}.hi-v5-menu-fat-menu__group:not(:last-of-type) {-webkit-margin-end: var(--hi-v5-spacing-18, 36px);margin-inline-end: var(--hi-v5-spacing-18, 36px);}.hi-v5-menu-fat-menu .hi-v5-menu-group-item {height: var(--hi-v5-height-10, 40px);margin: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-6, 12px);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-fat-menu .hi-v5-menu-item {height: var(--hi-v5-height-10, 40px);margin: 0;border-radius: var(--hi-v5-border-radius-lg, 6px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);}.hi-v5-menu-fat-menu .hi-v5-menu-item--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu-fat-menu .hi-v5-menu-item:not(.hi-v5-menu-item--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-fat-menu .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu-fat-menu ul {padding: 0;margin: 0;}.hi-v5-menu-fat-menu ul li {list-style-type: none;}.hi-v5-menu-popmenu {background-color: var(--hi-v5-color-static-white, #fff);border-radius: var(--hi-v5-border-radius-xl, 8px);margin: 0;font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-4, 8px);color: var(--hi-v5-color-gray-800, #1a1d26);width: 216px;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu-popmenu .hi-v5-menu-item {margin: 0;}.hi-v5-menu-popmenu .hi-v5-menu-item__inner {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--expanded {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner:not(.hi-v5-menu-item__inner--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu-popmenu .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width: 100%;-webkit-padding-end: var(--hi-v5-spacing-4, 8px);padding-inline-end: var(--hi-v5-spacing-4, 8px);}.hi-v5-menu-popmenu.hi-v5-menu--size-sm .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);}.hi-v5-menu-popmenu.hi-v5-menu--size-md .hi-v5-menu-item__inner {height: var(--hi-v5-height-9, 36px);}.hi-v5-menu-popmenu.hi-v5-menu--size-lg .hi-v5-menu-item__inner {height: var(--hi-v5-height-10, 40px);}.hi-v5-menu {background-color: var(--hi-v5-color-static-white, #fff);color: var(--hi-v5-color-gray-800, #1a1d26);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu ul {margin: 0;padding: 0;}.hi-v5-menu-item {list-style: none;-webkit-box-sizing: border-box;box-sizing: border-box;cursor: pointer;-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-item__arrow {font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-menu-item__indent {display: inline-block;width: 24px;height: 100%;-ms-flex-negative: 0;flex-shrink: 0;}.hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu__wrapper {padding: 0;margin: 0;}.hi-v5-menu--horizontal {width: 100%;overflow: hidden;}.hi-v5-menu--horizontal .hi-v5-menu__wrapper {display: -webkit-box;display: -ms-flexbox;display: flex;overflow: visible;width: -webkit-max-content;width: -moz-max-content;width: max-content;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu--horizontal .hi-v5-menu-item {padding: 0 var(--hi-v5-spacing-10, 20px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: 56px;border: none;font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-menu--horizontal .hi-v5-menu-item__arrow {-webkit-margin-start: var(--hi-v5-spacing-2, 4px);margin-inline-start: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--horizontal .hi-v5-menu-item:hover {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item:hover .hi-v5-menu-item__inner {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active .hi-v5-menu-item__inner {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item__inner {height: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-border-after: 2px solid transparent;border-block-end: 2px solid transparent;}.hi-v5-menu--horizontal .hi-v5-menu-item__inner--expanded {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;white-space: nowrap;max-width: none;}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled:hover .hi-v5-menu-item__inner {border-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled .hi-v5-menu-item__content {color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-menu--vertical {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-4, 8px);width: 216px;-webkit-box-sizing: border-box;box-sizing: border-box;height: 100%;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-menu--vertical .hi-v5-menu__wrapper {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: auto;}.hi-v5-menu--vertical.hi-v5-menu--mini {width: 56px;overflow-x: hidden;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini {-webkit-padding-start: var(--hi-v5-spacing-2, 4px);padding-inline-start: var(--hi-v5-spacing-2, 4px);-webkit-padding-end: var(--hi-v5-spacing-2, 4px);padding-inline-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--vertical.hi-v5-menu--popup .hi-v5-menu-item__inner--expanded {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical.hi-v5-menu--popup:not(.hi-v5-menu--mini) .hi-v5-menu__wrapper > .hi-v5-menu-item:last-child .hi-v5-menu-item__inner {-webkit-margin-after: 0;margin-block-end: 0;}.hi-v5-menu--vertical .hi-v5-menu__toggle {height: var(--hi-v5-height-10, 40px);line-height: var(--hi-v5-height-10, 40px);padding: 0 var(--hi-v5-spacing-6, 12px);cursor: pointer;border-radius: var(--hi-v5-border-radius-lg, 6px);color: var(--hi-v5-color-gray-600, #91959e);font-size: var(--hi-v5-text-size-lg, 1rem);-ms-flex-negative: 0;flex-shrink: 0;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));-webkit-transition-property: background-color;transition-property: background-color;}.hi-v5-menu--vertical .hi-v5-menu__toggle:hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical .hi-v5-menu-item__inner {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);border-radius: var(--hi-v5-border-radius-lg, 6px);-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner:not(.hi-v5-menu-item__inner--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-indent: 0.5px;}.hi-v5-menu--vertical .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini {width: 60px;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-sizing: border-box;box-sizing: border-box;width: 52px;height: 48px;padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-3, 6px) 0;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__icon {-webkit-margin-end: 0;margin-inline-end: 0;-webkit-margin-after: var(--hi-v5-spacing-1, 2px);margin-block-end: var(--hi-v5-spacing-1, 2px);display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__icon svg[class^=hi-v5-icon] {font-size: var(--hi-v5-text-size-xl, 1.125rem);}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__content {-webkit-transform: scale(0.5);transform: scale(0.5);width: 200%;font-size: calc(var(--hi-v5-text-size-xl, 1.125rem) + 2px);text-align: center;text-indent: 0;}.hi-v5-menu--vertical.hi-v5-menu--size-lg .hi-v5-menu-item__inner {height: var(--hi-v5-height-10, 40px);-webkit-margin-after: var(--hi-v5-spacing-4, 8px);margin-block-end: var(--hi-v5-spacing-4, 8px);}.hi-v5-menu--vertical.hi-v5-menu--size-md .hi-v5-menu-item__inner {height: var(--hi-v5-height-9, 36px);-webkit-margin-after: var(--hi-v5-spacing-2, 4px);margin-block-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--vertical.hi-v5-menu--size-sm .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);-webkit-margin-after: var(--hi-v5-spacing-1, 2px);margin-block-end: var(--hi-v5-spacing-1, 2px);}.hi-v5-sidebar-wrapper {position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;height: 100%;}.hi-v5-sidebar-wrapper:not(.hi-v5-sidebar-wrapper-showMenuArrow) .hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__arrow {display: none;}.hi-v5-sidebar-wrapper--showMenu .hi-v5-sidebar-menu-wrapper {-webkit-border-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);}.hi-v5-sidebar-wrapper--showMenu .hi-v5-sidebar-toggle svg[class^=hi-v5-icon] {-webkit-transform: rotate(180deg);transform: rotate(180deg);}.hi-v5-sidebar-wrapper:not(.hi-v5-sidebar-wrapper--collapsible) .hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--expanded:hover {background-color: transparent;cursor: default;}.hi-v5-sidebar {-webkit-box-sizing: border-box;box-sizing: border-box;width: 64px;height: 100%;padding: var(--hi-v5-spacing-4, 8px) 0;overflow: auto;-webkit-border-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);background-color: #fff;}.hi-v5-sidebar-list {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;}.hi-v5-sidebar-item {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;margin: var(--hi-v5-spacing-6, 12px) var(--hi-v5-spacing-2, 4px) 0;padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-1, 2px);width: 52px;overflow: hidden;text-align: center;border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-sidebar-item:first-child {-webkit-margin-before: 0;margin-block-start: 0;}.hi-v5-sidebar-item:hover {cursor: pointer;}.hi-v5-sidebar-item:not(.hi-v5-sidebar-item--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-sidebar-item--active {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-sidebar-item--active .hi-v5-sidebar-item__icon, .hi-v5-sidebar-item--active .hi-v5-sidebar-item__title {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-sidebar-item__icon {height: 20px;color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-sidebar-item__icon svg[class^=hi-v5-icon] {width: 20px;height: 20px;}.hi-v5-sidebar-item__title {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-sidebar-menu-wrapper {width: 0;-webkit-border-end: none;border-inline-end: none;overflow: hidden;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);-webkit-margin-after: 0;margin-block-end: 0;padding: 0 var(--hi-v5-spacing-4, 8px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item .hi-v5-menu-item__inner--hasIcon + div .hi-v5-menu-submenu .hi-v5-menu-item__indent {width: 20px;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__icon {color: var(--hi-v5-color-gray-700, #60636b);-webkit-margin-end: var(--hi-v5-spacing-2, 4px);margin-inline-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__indent {width: 14px;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__content {font-weight: 550;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-submenu .hi-v5-menu-item__inner .hi-v5-menu-item__content {font-size: var(--hi-v5-text-size-sm, 0.75rem);font-weight: var(--hi-v5-text-weight-normal, 400);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu__wrapper > .hi-v5-menu-item {-webkit-margin-before: var(--hi-v5-spacing-4, 8px);margin-block-start: var(--hi-v5-spacing-4, 8px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu__wrapper > .hi-v5-menu-item:first-child {-webkit-margin-before: 0;margin-block-start: 0;}.hi-v5-sidebar-toggle {-webkit-box-sizing: border-box;box-sizing: border-box;position: absolute;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;width: 12px;height: 60px;inset-inline-end: -11px;inset-block-start: 50%;-webkit-transform: translate3d(0, -50%, 0);transform: translate3d(0, -50%, 0);border-start-end-radius: 16px 8px;border-end-end-radius: 16px 8px;border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);-webkit-border-start: none;border-inline-start: none;cursor: pointer;color: var(--hi-v5-color-gray-700, #60636b);background-color: #fff;}.hi-v5-sidebar-toggle svg[class^=hi-v5-icon] {-webkit-margin-start: -4px;margin-inline-start: -4px;}.hi-v5-menu-search {min-width: 360px;border-radius: var(--hi-v5-border-radius-xl, 8px);overflow: hidden;background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-menu-search__input-wrapper {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-8, 16px) 0 calc(var(--hi-v5-spacing-2, 4px) + 1px);height: var(--hi-v5-height-12, 48px);}.hi-v5-menu-search--open .hi-v5-menu-search__input-wrapper {border-end-start-radius: 0;border-end-end-radius: 0;}.hi-v5-menu-search__input .hi-v5-input__inner:hover {background-color: transparent !important;}.hi-v5-menu-search__input-prefix {color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-menu-search__input-clear {font-size: var(--hi-v5-text-size-sm, 0.75rem);}.hi-v5-menu-search__close {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;height: var(--hi-v5-height-4, 16px);-webkit-padding-start: var(--hi-v5-spacing-5, 10px);padding-inline-start: var(--hi-v5-spacing-5, 10px);-webkit-border-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);}.hi-v5-menu-search__content {-webkit-box-sizing: border-box;box-sizing: border-box;display: none;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-4, 8px);max-height: 550px;-webkit-border-before: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #edeff2);border-block-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-search__content--visible {display: -webkit-box;display: -ms-flexbox;display: flex;}.hi-v5-menu-search__header {padding: 0 var(--hi-v5-spacing-4, 8px) var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-search__header-count {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-search__list {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow-y: auto;position: relative;outline: none;}.hi-v5-menu-search__list:focus {outline: none;}.hi-v5-menu-search__list-item {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;height: var(--hi-v5-height-10, 40px);padding: calc(var(--hi-v5-spacing-4, 8px) + 1px) var(--hi-v5-spacing-4, 8px);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-menu-search__list-item__title {font-size: var(--hi-v5-text-size-md, 0.875rem);color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-menu-search__list-item--selected, .hi-v5-menu-search__list-item:hover {cursor: pointer;background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-search__empty {padding: calc(var(--hi-v5-spacing-2, 4px) + 1px) var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-menu-search__footer {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: var(--hi-v5-spacing-5, 10px) var(--hi-v5-spacing-8, 16px);background-color: #f5f7fa;}.hi-v5-menu-search__footer-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-margin-end: var(--hi-v5-spacing-8, 16px);margin-inline-end: var(--hi-v5-spacing-8, 16px);font-size: var(--hi-v5-text-size-sm, 0.75rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-search__footer-item__icon {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;gap: var(--hi-v5-spacing-1, 2px);-webkit-margin-end: var(--hi-v5-spacing-2, 4px);margin-inline-end: var(--hi-v5-spacing-2, 4px);padding: 0 var(--hi-v5-spacing-2, 4px);height: var(--hi-v5-height-5, 20px);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-radius: var(--hi-v5-border-radius-md, 4px);}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-container {min-width: 360px;border-start-start-radius: 0;border-start-end-radius: 0;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-panel {border-top: none;border-start-start-radius: 0;border-start-end-radius: 0;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-body {max-height: 544px;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-footer {-webkit-box-shadow: none;box-shadow: none;background-color: #f5f7fa;}.hi-v5-group-menu {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;height: 100%;padding: var(--hi-v5-spacing-4, 8px) 0;}.hi-v5-group-menu-item:not(:first-child) {-webkit-margin-before: var(--hi-v5-spacing-4, 8px);margin-block-start: var(--hi-v5-spacing-4, 8px);}.hi-v5-group-menu-item__content {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: var(--hi-v5-height-8, 32px);padding: 0 var(--hi-v5-spacing-4, 8px);margin: 0 var(--hi-v5-spacing-4, 8px);border-radius: var(--hi-v5-border-radius-lg, 6px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-800, rgba(26, 29, 38, 0.8));}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled) {cursor: pointer;}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled):hover .hi-v5-group-menu-item__content {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled).hi-v5-group-menu-item--active > .hi-v5-group-menu-item__content {font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled).hi-v5-group-menu-item--active:hover > .hi-v5-group-menu-item__content {background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));}.hi-v5-group-menu-item--disabled > .hi-v5-group-menu-item__content {color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-group-menu-item--empty > .hi-v5-group-menu-item__content {display: none;}.hi-v5-group-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-group-menu-parent-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}.hi-v5-group-menu-parent-item > .hi-v5-group-menu-item__content {height: var(--hi-v5-height-7, 28px);font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-group-menu-parent-item > .hi-v5-group-menu-item__content .hi-v5-group-menu-item__title {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);}.hi-v5-group-menu-parent-item:not(:first-child) > .hi-v5-group-menu-item__content {-webkit-margin-before: var(--hi-v5-spacing-12, 24px);margin-block-start: var(--hi-v5-spacing-12, 24px);}.hi-v5-group-menu-parent-item + .hi-v5-group-menu-item {-webkit-margin-before: var(--hi-v5-spacing-12, 24px);margin-block-start: var(--hi-v5-spacing-12, 24px);}.hi-v5-side-menu {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-2, 4px) 0;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-side-menu-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: var(--hi-v5-height-8, 32px);padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-800, #1a1d26);border-radius: var(--hi-v5-border-radius-lg, 6px);cursor: pointer;position: relative;}.hi-v5-side-menu-item:hover, .hi-v5-side-menu-item--selected {background-color: rgba(124, 135, 166, 0.15);}.hi-v5-side-menu-item-wrapper {padding: var(--hi-v5-spacing-2, 4px) var(--hi-v5-spacing-4, 8px);}.hi-v5-side-menu-item--active {font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-side-menu-item--active:hover {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-side-menu-item--active .hi-v5-side-menu-item__icon,.hi-v5-side-menu-item--active .hi-v5-side-menu-item__title {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-side-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);color: #7c87a6;}.hi-v5-side-menu-item__title {min-width: 1px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}.hi-v5-side-menu-item--mini {-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-3, 6px) 0;width: 52px;height: 48px;color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-side-menu-item--mini .hi-v5-side-menu-item__icon {-webkit-margin-end: 0;margin-inline-end: 0;font-size: var(--hi-v5-text-size-xl, 1.125rem);}.hi-v5-side-menu-item--mini .hi-v5-side-menu-item__title {width: 200%;font-size: calc(var(--hi-v5-text-size-xl, 1.125rem) + 2px);text-align: center;text-indent: 0;-webkit-transform: scale(0.5);transform: scale(0.5);}.hi-v5-side-menu--mini .hi-v5-side-menu-item-wrapper {padding: var(--hi-v5-spacing-2, 4px);}.hi-v5-side-menu .hi-v5-scrollbar__wrapper {width: 100%;}";
|
|
15
|
+
var css_248z = ".hi-v5-menu-fat-menu {background-color: var(--hi-v5-color-static-white, #fff);margin: 0;font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-4, 8px);display: -webkit-box;display: -ms-flexbox;display: flex;color: var(--hi-v5-color-gray-800, #1a1d26);border-radius: var(--hi-v5-border-radius-lg, 6px);-ms-flex-wrap: wrap;flex-wrap: wrap;}.hi-v5-menu-fat-menu__group:not(:last-of-type) {-webkit-margin-end: var(--hi-v5-spacing-18, 36px);margin-inline-end: var(--hi-v5-spacing-18, 36px);}.hi-v5-menu-fat-menu .hi-v5-menu-group-item {height: var(--hi-v5-height-10, 40px);margin: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-6, 12px);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-fat-menu .hi-v5-menu-item {height: var(--hi-v5-height-10, 40px);margin: 0;border-radius: var(--hi-v5-border-radius-lg, 6px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);}.hi-v5-menu-fat-menu .hi-v5-menu-item--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu-fat-menu .hi-v5-menu-item:not(.hi-v5-menu-item--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-fat-menu .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu-fat-menu ul {padding: 0;margin: 0;}.hi-v5-menu-fat-menu ul li {list-style-type: none;}.hi-v5-menu-popmenu {background-color: var(--hi-v5-color-static-white, #fff);border-radius: var(--hi-v5-border-radius-xl, 8px);margin: 0;font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-4, 8px);color: var(--hi-v5-color-gray-800, #1a1d26);width: 216px;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu-popmenu .hi-v5-menu-item {margin: 0;}.hi-v5-menu-popmenu .hi-v5-menu-item__inner {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--expanded {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner:not(.hi-v5-menu-item__inner--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu-popmenu .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width: 100%;-webkit-padding-end: var(--hi-v5-spacing-4, 8px);padding-inline-end: var(--hi-v5-spacing-4, 8px);}.hi-v5-menu-popmenu.hi-v5-menu--size-sm .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);}.hi-v5-menu-popmenu.hi-v5-menu--size-md .hi-v5-menu-item__inner {height: var(--hi-v5-height-9, 36px);}.hi-v5-menu-popmenu.hi-v5-menu--size-lg .hi-v5-menu-item__inner {height: var(--hi-v5-height-10, 40px);}.hi-v5-menu {background-color: var(--hi-v5-color-static-white, #fff);color: var(--hi-v5-color-gray-800, #1a1d26);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu ul {margin: 0;padding: 0;}.hi-v5-menu-item {list-style: none;-webkit-box-sizing: border-box;box-sizing: border-box;cursor: pointer;-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-item__arrow {font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-menu-item__indent {display: inline-block;width: 24px;height: 100%;-ms-flex-negative: 0;flex-shrink: 0;}.hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu__wrapper {padding: 0;margin: 0;}.hi-v5-menu--horizontal {width: 100%;overflow: hidden;}.hi-v5-menu--horizontal .hi-v5-menu__wrapper {display: -webkit-box;display: -ms-flexbox;display: flex;overflow: visible;width: -webkit-max-content;width: -moz-max-content;width: max-content;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu--horizontal .hi-v5-menu-item {padding: 0 var(--hi-v5-spacing-10, 20px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: 56px;border: none;font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-menu--horizontal .hi-v5-menu-item__arrow {-webkit-margin-start: var(--hi-v5-spacing-2, 4px);margin-inline-start: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--horizontal .hi-v5-menu-item:hover {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item:hover .hi-v5-menu-item__inner {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active .hi-v5-menu-item__inner {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item__inner {height: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-border-after: 2px solid transparent;border-block-end: 2px solid transparent;}.hi-v5-menu--horizontal .hi-v5-menu-item__inner--expanded {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;white-space: nowrap;max-width: none;}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled:hover .hi-v5-menu-item__inner {border-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled .hi-v5-menu-item__content {color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-menu--vertical {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-4, 8px);width: 216px;-webkit-box-sizing: border-box;box-sizing: border-box;height: 100%;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-menu--vertical .hi-v5-menu__wrapper {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: auto;}.hi-v5-menu--vertical.hi-v5-menu--mini {width: 56px;overflow-x: hidden;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini {-webkit-padding-start: var(--hi-v5-spacing-2, 4px);padding-inline-start: var(--hi-v5-spacing-2, 4px);-webkit-padding-end: var(--hi-v5-spacing-2, 4px);padding-inline-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--vertical.hi-v5-menu--popup .hi-v5-menu-item__inner--expanded {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical.hi-v5-menu--popup:not(.hi-v5-menu--mini) .hi-v5-menu__wrapper > .hi-v5-menu-item:last-child .hi-v5-menu-item__inner {-webkit-margin-after: 0;margin-block-end: 0;}.hi-v5-menu--vertical .hi-v5-menu__toggle {height: var(--hi-v5-height-10, 40px);line-height: var(--hi-v5-height-10, 40px);padding: 0 var(--hi-v5-spacing-6, 12px);cursor: pointer;border-radius: var(--hi-v5-border-radius-lg, 6px);color: var(--hi-v5-color-gray-600, #91959e);font-size: var(--hi-v5-text-size-lg, 1rem);-ms-flex-negative: 0;flex-shrink: 0;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));-webkit-transition-property: background-color;transition-property: background-color;}.hi-v5-menu--vertical .hi-v5-menu__toggle:hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical .hi-v5-menu-item__inner {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);border-radius: var(--hi-v5-border-radius-lg, 6px);-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner:not(.hi-v5-menu-item__inner--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-indent: 0.5px;}.hi-v5-menu--vertical .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini {width: 60px;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-sizing: border-box;box-sizing: border-box;width: 52px;height: 48px;padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-3, 6px) 0;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__icon {-webkit-margin-end: 0;margin-inline-end: 0;-webkit-margin-after: var(--hi-v5-spacing-1, 2px);margin-block-end: var(--hi-v5-spacing-1, 2px);display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__icon svg[class^=hi-v5-icon] {font-size: var(--hi-v5-text-size-xl, 1.125rem);}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__content {-webkit-transform: scale(0.5);transform: scale(0.5);width: 200%;font-size: calc(var(--hi-v5-text-size-xl, 1.125rem) + 2px);text-align: center;text-indent: 0;}.hi-v5-menu--vertical.hi-v5-menu--size-lg .hi-v5-menu-item__inner {height: var(--hi-v5-height-10, 40px);-webkit-margin-after: var(--hi-v5-spacing-4, 8px);margin-block-end: var(--hi-v5-spacing-4, 8px);}.hi-v5-menu--vertical.hi-v5-menu--size-md .hi-v5-menu-item__inner {height: var(--hi-v5-height-9, 36px);-webkit-margin-after: var(--hi-v5-spacing-2, 4px);margin-block-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--vertical.hi-v5-menu--size-sm .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);-webkit-margin-after: var(--hi-v5-spacing-1, 2px);margin-block-end: var(--hi-v5-spacing-1, 2px);}.hi-v5-sidebar-wrapper {position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;height: 100%;}.hi-v5-sidebar-wrapper:not(.hi-v5-sidebar-wrapper-showMenuArrow) .hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__arrow {display: none;}.hi-v5-sidebar-wrapper--showMenu .hi-v5-sidebar-menu-wrapper {-webkit-border-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);}.hi-v5-sidebar-wrapper--showMenu .hi-v5-sidebar-toggle svg[class^=hi-v5-icon] {-webkit-transform: rotate(180deg);transform: rotate(180deg);}.hi-v5-sidebar-wrapper:not(.hi-v5-sidebar-wrapper--collapsible) .hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--expanded:hover {background-color: transparent;cursor: default;}.hi-v5-sidebar {-webkit-box-sizing: border-box;box-sizing: border-box;width: 64px;height: 100%;padding: var(--hi-v5-spacing-4, 8px) 0;overflow: auto;-webkit-border-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);background-color: #fff;}.hi-v5-sidebar-list {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;}.hi-v5-sidebar-item {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;margin: var(--hi-v5-spacing-6, 12px) var(--hi-v5-spacing-2, 4px) 0;padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-1, 2px);width: 52px;overflow: hidden;text-align: center;border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-sidebar-item:first-child {-webkit-margin-before: 0;margin-block-start: 0;}.hi-v5-sidebar-item:hover {cursor: pointer;}.hi-v5-sidebar-item:not(.hi-v5-sidebar-item--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-sidebar-item--active {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-sidebar-item--active .hi-v5-sidebar-item__icon, .hi-v5-sidebar-item--active .hi-v5-sidebar-item__title {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-sidebar-item__icon {height: 20px;color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-sidebar-item__icon svg[class^=hi-v5-icon] {width: 20px;height: 20px;}.hi-v5-sidebar-item__title {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-sidebar-menu-wrapper {width: 0;-webkit-border-end: none;border-inline-end: none;overflow: hidden;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);-webkit-margin-after: 0;margin-block-end: 0;padding: 0 var(--hi-v5-spacing-4, 8px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item .hi-v5-menu-item__inner--hasIcon + div .hi-v5-menu-submenu .hi-v5-menu-item__indent {width: 20px;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__icon {color: var(--hi-v5-color-gray-700, #60636b);-webkit-margin-end: var(--hi-v5-spacing-2, 4px);margin-inline-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__indent {width: 14px;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__content {font-weight: 550;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-submenu .hi-v5-menu-item__inner .hi-v5-menu-item__content {font-size: var(--hi-v5-text-size-sm, 0.75rem);font-weight: var(--hi-v5-text-weight-normal, 400);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu__wrapper > .hi-v5-menu-item {-webkit-margin-before: var(--hi-v5-spacing-4, 8px);margin-block-start: var(--hi-v5-spacing-4, 8px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu__wrapper > .hi-v5-menu-item:first-child {-webkit-margin-before: 0;margin-block-start: 0;}.hi-v5-sidebar-toggle {-webkit-box-sizing: border-box;box-sizing: border-box;position: absolute;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;width: 12px;height: 60px;inset-inline-end: -11px;inset-block-start: 50%;-webkit-transform: translate3d(0, -50%, 0);transform: translate3d(0, -50%, 0);border-start-end-radius: 16px 8px;border-end-end-radius: 16px 8px;border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);-webkit-border-start: none;border-inline-start: none;cursor: pointer;color: var(--hi-v5-color-gray-700, #60636b);background-color: #fff;}.hi-v5-sidebar-toggle svg[class^=hi-v5-icon] {-webkit-margin-start: -4px;margin-inline-start: -4px;}.hi-v5-menu-search {min-width: 360px;border-radius: var(--hi-v5-border-radius-xl, 8px);overflow: hidden;background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-menu-search__input-wrapper {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-8, 16px) 0 calc(var(--hi-v5-spacing-2, 4px) + 1px);height: var(--hi-v5-height-12, 48px);}.hi-v5-menu-search--open .hi-v5-menu-search__input-wrapper {border-end-start-radius: 0;border-end-end-radius: 0;}.hi-v5-menu-search__input .hi-v5-input__inner:hover {background-color: transparent !important;}.hi-v5-menu-search__input-prefix {color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-menu-search__input-clear {font-size: var(--hi-v5-text-size-sm, 0.75rem);}.hi-v5-menu-search__close {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;height: var(--hi-v5-height-4, 16px);-webkit-padding-start: var(--hi-v5-spacing-5, 10px);padding-inline-start: var(--hi-v5-spacing-5, 10px);-webkit-border-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);}.hi-v5-menu-search__content {-webkit-box-sizing: border-box;box-sizing: border-box;display: none;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-4, 8px);max-height: 550px;-webkit-border-before: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #edeff2);border-block-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-search__content--visible {display: -webkit-box;display: -ms-flexbox;display: flex;}.hi-v5-menu-search__header {padding: 0 var(--hi-v5-spacing-4, 8px) var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-search__header-count {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-search__list {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow-y: auto;position: relative;outline: none;}.hi-v5-menu-search__list:focus {outline: none;}.hi-v5-menu-search__list-item {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;height: var(--hi-v5-height-10, 40px);padding: calc(var(--hi-v5-spacing-4, 8px) + 1px) var(--hi-v5-spacing-4, 8px);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-menu-search__list-item__title {font-size: var(--hi-v5-text-size-md, 0.875rem);color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-menu-search__list-item--selected, .hi-v5-menu-search__list-item:hover {cursor: pointer;background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-search__empty {padding: calc(var(--hi-v5-spacing-2, 4px) + 1px) var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-menu-search__footer {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: var(--hi-v5-spacing-5, 10px) var(--hi-v5-spacing-8, 16px);background-color: #f5f7fa;}.hi-v5-menu-search__footer-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-margin-end: var(--hi-v5-spacing-8, 16px);margin-inline-end: var(--hi-v5-spacing-8, 16px);font-size: var(--hi-v5-text-size-sm, 0.75rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-search__footer-item__icon {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;gap: var(--hi-v5-spacing-1, 2px);-webkit-margin-end: var(--hi-v5-spacing-2, 4px);margin-inline-end: var(--hi-v5-spacing-2, 4px);padding: 0 var(--hi-v5-spacing-2, 4px);height: var(--hi-v5-height-5, 20px);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-radius: var(--hi-v5-border-radius-md, 4px);}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-container {min-width: 360px;border-start-start-radius: 0;border-start-end-radius: 0;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-panel {border-top: none;border-start-start-radius: 0;border-start-end-radius: 0;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-body {max-height: 544px;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-footer {-webkit-box-shadow: none;box-shadow: none;background-color: #f5f7fa;}.hi-v5-group-menu {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;height: 100%;padding: var(--hi-v5-spacing-4, 8px) 0;}.hi-v5-group-menu-item:not(:first-child) {-webkit-margin-before: var(--hi-v5-spacing-4, 8px);margin-block-start: var(--hi-v5-spacing-4, 8px);}.hi-v5-group-menu-item__content {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: var(--hi-v5-height-8, 32px);padding: 0 var(--hi-v5-spacing-4, 8px);margin: 0 var(--hi-v5-spacing-4, 8px);border-radius: var(--hi-v5-border-radius-lg, 6px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-800, rgba(26, 29, 38, 0.8));}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled) {cursor: pointer;}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled):hover .hi-v5-group-menu-item__content {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled).hi-v5-group-menu-item--active > .hi-v5-group-menu-item__content {font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled).hi-v5-group-menu-item--active:hover > .hi-v5-group-menu-item__content {background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));}.hi-v5-group-menu-item--disabled > .hi-v5-group-menu-item__content {color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-group-menu-item--empty > .hi-v5-group-menu-item__content {display: none;}.hi-v5-group-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-group-menu-parent-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}.hi-v5-group-menu-parent-item > .hi-v5-group-menu-item__content {height: var(--hi-v5-height-7, 28px);font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-group-menu-parent-item > .hi-v5-group-menu-item__content .hi-v5-group-menu-item__title {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);}.hi-v5-group-menu-parent-item:not(:first-child) > .hi-v5-group-menu-item__content {-webkit-margin-before: var(--hi-v5-spacing-12, 24px);margin-block-start: var(--hi-v5-spacing-12, 24px);}.hi-v5-group-menu-parent-item + .hi-v5-group-menu-item {-webkit-margin-before: var(--hi-v5-spacing-12, 24px);margin-block-start: var(--hi-v5-spacing-12, 24px);}.hi-v5-side-menu {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-2, 4px) 0;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-side-menu-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-800, #1a1d26);border-radius: var(--hi-v5-border-radius-lg, 6px);cursor: pointer;position: relative;}.hi-v5-side-menu-item:hover, .hi-v5-side-menu-item--selected {background-color: rgba(124, 135, 166, 0.15);}.hi-v5-side-menu-item:not(.hi-v5-side-menu-item--mini) {height: var(--hi-v5-height-8, 32px);}.hi-v5-side-menu-item:not(.hi-v5-side-menu-item--mini) .hi-v5-side-menu-item__title {min-width: 1px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}.hi-v5-side-menu-item-wrapper {padding: var(--hi-v5-spacing-2, 4px) var(--hi-v5-spacing-4, 8px);}.hi-v5-side-menu-item--active {font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-side-menu-item--active:hover {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-side-menu-item--active .hi-v5-side-menu-item__icon,.hi-v5-side-menu-item--active .hi-v5-side-menu-item__title {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-side-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);color: #7c87a6;}.hi-v5-side-menu-item--mini {-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;padding: var(--hi-v5-spacing-3, 6px);width: 52px;max-height: 64px;color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-side-menu-item--mini .hi-v5-side-menu-item__icon {-webkit-margin-end: 0;margin-inline-end: 0;-webkit-margin-after: var(--hi-v5-spacing-3, 6px);margin-block-end: var(--hi-v5-spacing-3, 6px);font-size: var(--hi-v5-text-size-xl, 1.125rem);}.hi-v5-side-menu-item--mini .hi-v5-side-menu-item__title {font-size: 20px;line-height: 28px;text-align: center;text-indent: 0;-webkit-transform: scale(0.5);transform: scale(0.5);width: 200%;-webkit-margin-after: -14px;margin-block-end: -14px;-webkit-transform-origin: top;transform-origin: top;white-space: normal;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;line-clamp: 2;word-break: break-word;overflow: hidden;text-overflow: ellipsis;}.hi-v5-side-menu--mini .hi-v5-side-menu-item-wrapper {padding: var(--hi-v5-spacing-2, 4px);}.hi-v5-side-menu .hi-v5-scrollbar__wrapper {width: 100%;}";
|
|
16
16
|
var __styleInject__ = require('@hi-ui/style-inject')["default"];
|
|
17
17
|
__styleInject__(css_248z);
|
|
18
18
|
exports["default"] = css_248z;
|
package/lib/esm/SideMenu.js
CHANGED
|
@@ -101,9 +101,17 @@ var SideMenu = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
101
101
|
onMouseEnter: function onMouseEnter(evt) {
|
|
102
102
|
var currentTarget = evt.currentTarget;
|
|
103
103
|
var titleElement = currentTarget.querySelector("." + prefixCls + "-item__title");
|
|
104
|
+
if (!titleElement) {
|
|
105
|
+
handleMouseEnter(evt, id, item);
|
|
106
|
+
return;
|
|
107
|
+
}
|
|
104
108
|
var scrollWidth = titleElement.scrollWidth,
|
|
105
|
-
clientWidth = titleElement.clientWidth
|
|
106
|
-
|
|
109
|
+
clientWidth = titleElement.clientWidth,
|
|
110
|
+
scrollHeight = titleElement.scrollHeight,
|
|
111
|
+
clientHeight = titleElement.clientHeight;
|
|
112
|
+
// 单行溢出：scrollWidth > clientWidth；多行（如 mini 2 行）溢出：scrollHeight > clientHeight
|
|
113
|
+
var isOverflow = scrollWidth > clientWidth || scrollHeight > clientHeight;
|
|
114
|
+
if (isOverflow) {
|
|
107
115
|
Tooltip.open(currentTarget, {
|
|
108
116
|
key: "side-menu-tooltip-" + id,
|
|
109
117
|
title: title,
|
|
@@ -125,7 +133,20 @@ var SideMenu = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
125
133
|
style: styles === null || styles === void 0 ? void 0 : styles.itemIcon
|
|
126
134
|
}, icon), /*#__PURE__*/React.createElement("div", {
|
|
127
135
|
className: cx(prefixCls + "-item__title", classNames === null || classNames === void 0 ? void 0 : classNames.itemTitle),
|
|
128
|
-
style: styles === null || styles === void 0 ? void 0 : styles.itemTitle
|
|
136
|
+
style: styles === null || styles === void 0 ? void 0 : styles.itemTitle,
|
|
137
|
+
ref: function ref(el) {
|
|
138
|
+
if (el) {
|
|
139
|
+
if (mini) {
|
|
140
|
+
if (el.clientHeight > 28) {
|
|
141
|
+
el.style.marginBlockEnd = '-28px';
|
|
142
|
+
} else {
|
|
143
|
+
el.style.marginBlockEnd = '';
|
|
144
|
+
}
|
|
145
|
+
} else {
|
|
146
|
+
el.style.marginBlockEnd = '';
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
}
|
|
129
150
|
}, title)));
|
|
130
151
|
})));
|
|
131
152
|
});
|
|
@@ -8,6 +8,6 @@
|
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
9
|
*/
|
|
10
10
|
import __styleInject__ from '@hi-ui/style-inject';
|
|
11
|
-
var css_248z = ".hi-v5-menu-fat-menu {background-color: var(--hi-v5-color-static-white, #fff);margin: 0;font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-4, 8px);display: -webkit-box;display: -ms-flexbox;display: flex;color: var(--hi-v5-color-gray-800, #1a1d26);border-radius: var(--hi-v5-border-radius-lg, 6px);-ms-flex-wrap: wrap;flex-wrap: wrap;}.hi-v5-menu-fat-menu__group:not(:last-of-type) {-webkit-margin-end: var(--hi-v5-spacing-18, 36px);margin-inline-end: var(--hi-v5-spacing-18, 36px);}.hi-v5-menu-fat-menu .hi-v5-menu-group-item {height: var(--hi-v5-height-10, 40px);margin: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-6, 12px);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-fat-menu .hi-v5-menu-item {height: var(--hi-v5-height-10, 40px);margin: 0;border-radius: var(--hi-v5-border-radius-lg, 6px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);}.hi-v5-menu-fat-menu .hi-v5-menu-item--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu-fat-menu .hi-v5-menu-item:not(.hi-v5-menu-item--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-fat-menu .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu-fat-menu ul {padding: 0;margin: 0;}.hi-v5-menu-fat-menu ul li {list-style-type: none;}.hi-v5-menu-popmenu {background-color: var(--hi-v5-color-static-white, #fff);border-radius: var(--hi-v5-border-radius-xl, 8px);margin: 0;font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-4, 8px);color: var(--hi-v5-color-gray-800, #1a1d26);width: 216px;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu-popmenu .hi-v5-menu-item {margin: 0;}.hi-v5-menu-popmenu .hi-v5-menu-item__inner {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--expanded {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner:not(.hi-v5-menu-item__inner--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu-popmenu .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width: 100%;-webkit-padding-end: var(--hi-v5-spacing-4, 8px);padding-inline-end: var(--hi-v5-spacing-4, 8px);}.hi-v5-menu-popmenu.hi-v5-menu--size-sm .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);}.hi-v5-menu-popmenu.hi-v5-menu--size-md .hi-v5-menu-item__inner {height: var(--hi-v5-height-9, 36px);}.hi-v5-menu-popmenu.hi-v5-menu--size-lg .hi-v5-menu-item__inner {height: var(--hi-v5-height-10, 40px);}.hi-v5-menu {background-color: var(--hi-v5-color-static-white, #fff);color: var(--hi-v5-color-gray-800, #1a1d26);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu ul {margin: 0;padding: 0;}.hi-v5-menu-item {list-style: none;-webkit-box-sizing: border-box;box-sizing: border-box;cursor: pointer;-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-item__arrow {font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-menu-item__indent {display: inline-block;width: 24px;height: 100%;-ms-flex-negative: 0;flex-shrink: 0;}.hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu__wrapper {padding: 0;margin: 0;}.hi-v5-menu--horizontal {width: 100%;overflow: hidden;}.hi-v5-menu--horizontal .hi-v5-menu__wrapper {display: -webkit-box;display: -ms-flexbox;display: flex;overflow: visible;width: -webkit-max-content;width: -moz-max-content;width: max-content;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu--horizontal .hi-v5-menu-item {padding: 0 var(--hi-v5-spacing-10, 20px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: 56px;border: none;font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-menu--horizontal .hi-v5-menu-item__arrow {-webkit-margin-start: var(--hi-v5-spacing-2, 4px);margin-inline-start: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--horizontal .hi-v5-menu-item:hover {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item:hover .hi-v5-menu-item__inner {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active .hi-v5-menu-item__inner {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item__inner {height: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-border-after: 2px solid transparent;border-block-end: 2px solid transparent;}.hi-v5-menu--horizontal .hi-v5-menu-item__inner--expanded {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;white-space: nowrap;max-width: none;}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled:hover .hi-v5-menu-item__inner {border-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled .hi-v5-menu-item__content {color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-menu--vertical {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-4, 8px);width: 216px;-webkit-box-sizing: border-box;box-sizing: border-box;height: 100%;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-menu--vertical .hi-v5-menu__wrapper {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: auto;}.hi-v5-menu--vertical.hi-v5-menu--mini {width: 56px;overflow-x: hidden;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini {-webkit-padding-start: var(--hi-v5-spacing-2, 4px);padding-inline-start: var(--hi-v5-spacing-2, 4px);-webkit-padding-end: var(--hi-v5-spacing-2, 4px);padding-inline-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--vertical.hi-v5-menu--popup .hi-v5-menu-item__inner--expanded {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical.hi-v5-menu--popup:not(.hi-v5-menu--mini) .hi-v5-menu__wrapper > .hi-v5-menu-item:last-child .hi-v5-menu-item__inner {-webkit-margin-after: 0;margin-block-end: 0;}.hi-v5-menu--vertical .hi-v5-menu__toggle {height: var(--hi-v5-height-10, 40px);line-height: var(--hi-v5-height-10, 40px);padding: 0 var(--hi-v5-spacing-6, 12px);cursor: pointer;border-radius: var(--hi-v5-border-radius-lg, 6px);color: var(--hi-v5-color-gray-600, #91959e);font-size: var(--hi-v5-text-size-lg, 1rem);-ms-flex-negative: 0;flex-shrink: 0;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));-webkit-transition-property: background-color;transition-property: background-color;}.hi-v5-menu--vertical .hi-v5-menu__toggle:hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical .hi-v5-menu-item__inner {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);border-radius: var(--hi-v5-border-radius-lg, 6px);-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner:not(.hi-v5-menu-item__inner--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-indent: 0.5px;}.hi-v5-menu--vertical .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini {width: 60px;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-sizing: border-box;box-sizing: border-box;width: 52px;height: 48px;padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-3, 6px) 0;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__icon {-webkit-margin-end: 0;margin-inline-end: 0;-webkit-margin-after: var(--hi-v5-spacing-1, 2px);margin-block-end: var(--hi-v5-spacing-1, 2px);display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__icon svg[class^=hi-v5-icon] {font-size: var(--hi-v5-text-size-xl, 1.125rem);}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__content {-webkit-transform: scale(0.5);transform: scale(0.5);width: 200%;font-size: calc(var(--hi-v5-text-size-xl, 1.125rem) + 2px);text-align: center;text-indent: 0;}.hi-v5-menu--vertical.hi-v5-menu--size-lg .hi-v5-menu-item__inner {height: var(--hi-v5-height-10, 40px);-webkit-margin-after: var(--hi-v5-spacing-4, 8px);margin-block-end: var(--hi-v5-spacing-4, 8px);}.hi-v5-menu--vertical.hi-v5-menu--size-md .hi-v5-menu-item__inner {height: var(--hi-v5-height-9, 36px);-webkit-margin-after: var(--hi-v5-spacing-2, 4px);margin-block-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--vertical.hi-v5-menu--size-sm .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);-webkit-margin-after: var(--hi-v5-spacing-1, 2px);margin-block-end: var(--hi-v5-spacing-1, 2px);}.hi-v5-sidebar-wrapper {position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;height: 100%;}.hi-v5-sidebar-wrapper:not(.hi-v5-sidebar-wrapper-showMenuArrow) .hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__arrow {display: none;}.hi-v5-sidebar-wrapper--showMenu .hi-v5-sidebar-menu-wrapper {-webkit-border-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);}.hi-v5-sidebar-wrapper--showMenu .hi-v5-sidebar-toggle svg[class^=hi-v5-icon] {-webkit-transform: rotate(180deg);transform: rotate(180deg);}.hi-v5-sidebar-wrapper:not(.hi-v5-sidebar-wrapper--collapsible) .hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--expanded:hover {background-color: transparent;cursor: default;}.hi-v5-sidebar {-webkit-box-sizing: border-box;box-sizing: border-box;width: 64px;height: 100%;padding: var(--hi-v5-spacing-4, 8px) 0;overflow: auto;-webkit-border-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);background-color: #fff;}.hi-v5-sidebar-list {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;}.hi-v5-sidebar-item {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;margin: var(--hi-v5-spacing-6, 12px) var(--hi-v5-spacing-2, 4px) 0;padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-1, 2px);width: 52px;overflow: hidden;text-align: center;border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-sidebar-item:first-child {-webkit-margin-before: 0;margin-block-start: 0;}.hi-v5-sidebar-item:hover {cursor: pointer;}.hi-v5-sidebar-item:not(.hi-v5-sidebar-item--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-sidebar-item--active {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-sidebar-item--active .hi-v5-sidebar-item__icon, .hi-v5-sidebar-item--active .hi-v5-sidebar-item__title {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-sidebar-item__icon {height: 20px;color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-sidebar-item__icon svg[class^=hi-v5-icon] {width: 20px;height: 20px;}.hi-v5-sidebar-item__title {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-sidebar-menu-wrapper {width: 0;-webkit-border-end: none;border-inline-end: none;overflow: hidden;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);-webkit-margin-after: 0;margin-block-end: 0;padding: 0 var(--hi-v5-spacing-4, 8px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item .hi-v5-menu-item__inner--hasIcon + div .hi-v5-menu-submenu .hi-v5-menu-item__indent {width: 20px;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__icon {color: var(--hi-v5-color-gray-700, #60636b);-webkit-margin-end: var(--hi-v5-spacing-2, 4px);margin-inline-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__indent {width: 14px;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__content {font-weight: 550;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-submenu .hi-v5-menu-item__inner .hi-v5-menu-item__content {font-size: var(--hi-v5-text-size-sm, 0.75rem);font-weight: var(--hi-v5-text-weight-normal, 400);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu__wrapper > .hi-v5-menu-item {-webkit-margin-before: var(--hi-v5-spacing-4, 8px);margin-block-start: var(--hi-v5-spacing-4, 8px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu__wrapper > .hi-v5-menu-item:first-child {-webkit-margin-before: 0;margin-block-start: 0;}.hi-v5-sidebar-toggle {-webkit-box-sizing: border-box;box-sizing: border-box;position: absolute;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;width: 12px;height: 60px;inset-inline-end: -11px;inset-block-start: 50%;-webkit-transform: translate3d(0, -50%, 0);transform: translate3d(0, -50%, 0);border-start-end-radius: 16px 8px;border-end-end-radius: 16px 8px;border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);-webkit-border-start: none;border-inline-start: none;cursor: pointer;color: var(--hi-v5-color-gray-700, #60636b);background-color: #fff;}.hi-v5-sidebar-toggle svg[class^=hi-v5-icon] {-webkit-margin-start: -4px;margin-inline-start: -4px;}.hi-v5-menu-search {min-width: 360px;border-radius: var(--hi-v5-border-radius-xl, 8px);overflow: hidden;background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-menu-search__input-wrapper {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-8, 16px) 0 calc(var(--hi-v5-spacing-2, 4px) + 1px);height: var(--hi-v5-height-12, 48px);}.hi-v5-menu-search--open .hi-v5-menu-search__input-wrapper {border-end-start-radius: 0;border-end-end-radius: 0;}.hi-v5-menu-search__input .hi-v5-input__inner:hover {background-color: transparent !important;}.hi-v5-menu-search__input-prefix {color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-menu-search__input-clear {font-size: var(--hi-v5-text-size-sm, 0.75rem);}.hi-v5-menu-search__close {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;height: var(--hi-v5-height-4, 16px);-webkit-padding-start: var(--hi-v5-spacing-5, 10px);padding-inline-start: var(--hi-v5-spacing-5, 10px);-webkit-border-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);}.hi-v5-menu-search__content {-webkit-box-sizing: border-box;box-sizing: border-box;display: none;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-4, 8px);max-height: 550px;-webkit-border-before: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #edeff2);border-block-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-search__content--visible {display: -webkit-box;display: -ms-flexbox;display: flex;}.hi-v5-menu-search__header {padding: 0 var(--hi-v5-spacing-4, 8px) var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-search__header-count {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-search__list {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow-y: auto;position: relative;outline: none;}.hi-v5-menu-search__list:focus {outline: none;}.hi-v5-menu-search__list-item {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;height: var(--hi-v5-height-10, 40px);padding: calc(var(--hi-v5-spacing-4, 8px) + 1px) var(--hi-v5-spacing-4, 8px);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-menu-search__list-item__title {font-size: var(--hi-v5-text-size-md, 0.875rem);color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-menu-search__list-item--selected, .hi-v5-menu-search__list-item:hover {cursor: pointer;background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-search__empty {padding: calc(var(--hi-v5-spacing-2, 4px) + 1px) var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-menu-search__footer {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: var(--hi-v5-spacing-5, 10px) var(--hi-v5-spacing-8, 16px);background-color: #f5f7fa;}.hi-v5-menu-search__footer-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-margin-end: var(--hi-v5-spacing-8, 16px);margin-inline-end: var(--hi-v5-spacing-8, 16px);font-size: var(--hi-v5-text-size-sm, 0.75rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-search__footer-item__icon {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;gap: var(--hi-v5-spacing-1, 2px);-webkit-margin-end: var(--hi-v5-spacing-2, 4px);margin-inline-end: var(--hi-v5-spacing-2, 4px);padding: 0 var(--hi-v5-spacing-2, 4px);height: var(--hi-v5-height-5, 20px);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-radius: var(--hi-v5-border-radius-md, 4px);}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-container {min-width: 360px;border-start-start-radius: 0;border-start-end-radius: 0;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-panel {border-top: none;border-start-start-radius: 0;border-start-end-radius: 0;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-body {max-height: 544px;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-footer {-webkit-box-shadow: none;box-shadow: none;background-color: #f5f7fa;}.hi-v5-group-menu {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;height: 100%;padding: var(--hi-v5-spacing-4, 8px) 0;}.hi-v5-group-menu-item:not(:first-child) {-webkit-margin-before: var(--hi-v5-spacing-4, 8px);margin-block-start: var(--hi-v5-spacing-4, 8px);}.hi-v5-group-menu-item__content {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: var(--hi-v5-height-8, 32px);padding: 0 var(--hi-v5-spacing-4, 8px);margin: 0 var(--hi-v5-spacing-4, 8px);border-radius: var(--hi-v5-border-radius-lg, 6px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-800, rgba(26, 29, 38, 0.8));}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled) {cursor: pointer;}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled):hover .hi-v5-group-menu-item__content {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled).hi-v5-group-menu-item--active > .hi-v5-group-menu-item__content {font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled).hi-v5-group-menu-item--active:hover > .hi-v5-group-menu-item__content {background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));}.hi-v5-group-menu-item--disabled > .hi-v5-group-menu-item__content {color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-group-menu-item--empty > .hi-v5-group-menu-item__content {display: none;}.hi-v5-group-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-group-menu-parent-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}.hi-v5-group-menu-parent-item > .hi-v5-group-menu-item__content {height: var(--hi-v5-height-7, 28px);font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-group-menu-parent-item > .hi-v5-group-menu-item__content .hi-v5-group-menu-item__title {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);}.hi-v5-group-menu-parent-item:not(:first-child) > .hi-v5-group-menu-item__content {-webkit-margin-before: var(--hi-v5-spacing-12, 24px);margin-block-start: var(--hi-v5-spacing-12, 24px);}.hi-v5-group-menu-parent-item + .hi-v5-group-menu-item {-webkit-margin-before: var(--hi-v5-spacing-12, 24px);margin-block-start: var(--hi-v5-spacing-12, 24px);}.hi-v5-side-menu {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-2, 4px) 0;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-side-menu-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: var(--hi-v5-height-8, 32px);padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-800, #1a1d26);border-radius: var(--hi-v5-border-radius-lg, 6px);cursor: pointer;position: relative;}.hi-v5-side-menu-item:hover, .hi-v5-side-menu-item--selected {background-color: rgba(124, 135, 166, 0.15);}.hi-v5-side-menu-item-wrapper {padding: var(--hi-v5-spacing-2, 4px) var(--hi-v5-spacing-4, 8px);}.hi-v5-side-menu-item--active {font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-side-menu-item--active:hover {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-side-menu-item--active .hi-v5-side-menu-item__icon,.hi-v5-side-menu-item--active .hi-v5-side-menu-item__title {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-side-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);color: #7c87a6;}.hi-v5-side-menu-item__title {min-width: 1px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}.hi-v5-side-menu-item--mini {-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-3, 6px) 0;width: 52px;height: 48px;color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-side-menu-item--mini .hi-v5-side-menu-item__icon {-webkit-margin-end: 0;margin-inline-end: 0;font-size: var(--hi-v5-text-size-xl, 1.125rem);}.hi-v5-side-menu-item--mini .hi-v5-side-menu-item__title {width: 200%;font-size: calc(var(--hi-v5-text-size-xl, 1.125rem) + 2px);text-align: center;text-indent: 0;-webkit-transform: scale(0.5);transform: scale(0.5);}.hi-v5-side-menu--mini .hi-v5-side-menu-item-wrapper {padding: var(--hi-v5-spacing-2, 4px);}.hi-v5-side-menu .hi-v5-scrollbar__wrapper {width: 100%;}";
|
|
11
|
+
var css_248z = ".hi-v5-menu-fat-menu {background-color: var(--hi-v5-color-static-white, #fff);margin: 0;font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-4, 8px);display: -webkit-box;display: -ms-flexbox;display: flex;color: var(--hi-v5-color-gray-800, #1a1d26);border-radius: var(--hi-v5-border-radius-lg, 6px);-ms-flex-wrap: wrap;flex-wrap: wrap;}.hi-v5-menu-fat-menu__group:not(:last-of-type) {-webkit-margin-end: var(--hi-v5-spacing-18, 36px);margin-inline-end: var(--hi-v5-spacing-18, 36px);}.hi-v5-menu-fat-menu .hi-v5-menu-group-item {height: var(--hi-v5-height-10, 40px);margin: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-6, 12px);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-fat-menu .hi-v5-menu-item {height: var(--hi-v5-height-10, 40px);margin: 0;border-radius: var(--hi-v5-border-radius-lg, 6px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);}.hi-v5-menu-fat-menu .hi-v5-menu-item--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu-fat-menu .hi-v5-menu-item:not(.hi-v5-menu-item--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-fat-menu .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu-fat-menu ul {padding: 0;margin: 0;}.hi-v5-menu-fat-menu ul li {list-style-type: none;}.hi-v5-menu-popmenu {background-color: var(--hi-v5-color-static-white, #fff);border-radius: var(--hi-v5-border-radius-xl, 8px);margin: 0;font-size: var(--hi-v5-text-size-md, 0.875rem);padding: var(--hi-v5-spacing-4, 8px);color: var(--hi-v5-color-gray-800, #1a1d26);width: 216px;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu-popmenu .hi-v5-menu-item {margin: 0;}.hi-v5-menu-popmenu .hi-v5-menu-item__inner {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--expanded {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner:not(.hi-v5-menu-item__inner--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-popmenu .hi-v5-menu-item__inner--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu-popmenu .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width: 100%;-webkit-padding-end: var(--hi-v5-spacing-4, 8px);padding-inline-end: var(--hi-v5-spacing-4, 8px);}.hi-v5-menu-popmenu.hi-v5-menu--size-sm .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);}.hi-v5-menu-popmenu.hi-v5-menu--size-md .hi-v5-menu-item__inner {height: var(--hi-v5-height-9, 36px);}.hi-v5-menu-popmenu.hi-v5-menu--size-lg .hi-v5-menu-item__inner {height: var(--hi-v5-height-10, 40px);}.hi-v5-menu {background-color: var(--hi-v5-color-static-white, #fff);color: var(--hi-v5-color-gray-800, #1a1d26);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu ul {margin: 0;padding: 0;}.hi-v5-menu-item {list-style: none;-webkit-box-sizing: border-box;box-sizing: border-box;cursor: pointer;-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-item__arrow {font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-menu-item__indent {display: inline-block;width: 24px;height: 100%;-ms-flex-negative: 0;flex-shrink: 0;}.hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu__wrapper {padding: 0;margin: 0;}.hi-v5-menu--horizontal {width: 100%;overflow: hidden;}.hi-v5-menu--horizontal .hi-v5-menu__wrapper {display: -webkit-box;display: -ms-flexbox;display: flex;overflow: visible;width: -webkit-max-content;width: -moz-max-content;width: max-content;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-menu--horizontal .hi-v5-menu-item {padding: 0 var(--hi-v5-spacing-10, 20px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: 56px;border: none;font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-menu--horizontal .hi-v5-menu-item__arrow {-webkit-margin-start: var(--hi-v5-spacing-2, 4px);margin-inline-start: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--horizontal .hi-v5-menu-item:hover {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item:hover .hi-v5-menu-item__inner {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active .hi-v5-menu-item__inner {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item__inner {height: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-border-after: 2px solid transparent;border-block-end: 2px solid transparent;}.hi-v5-menu--horizontal .hi-v5-menu-item__inner--expanded {-webkit-border-after: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-block-end: 2px solid var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--horizontal .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;white-space: nowrap;max-width: none;}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled:hover .hi-v5-menu-item__inner {border-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-menu--horizontal .hi-v5-menu-item--disabled .hi-v5-menu-item__content {color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-menu--vertical {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-4, 8px);width: 216px;-webkit-box-sizing: border-box;box-sizing: border-box;height: 100%;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-menu--vertical .hi-v5-menu__wrapper {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: auto;}.hi-v5-menu--vertical.hi-v5-menu--mini {width: 56px;overflow-x: hidden;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini {-webkit-padding-start: var(--hi-v5-spacing-2, 4px);padding-inline-start: var(--hi-v5-spacing-2, 4px);-webkit-padding-end: var(--hi-v5-spacing-2, 4px);padding-inline-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--vertical.hi-v5-menu--popup .hi-v5-menu-item__inner--expanded {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical.hi-v5-menu--popup:not(.hi-v5-menu--mini) .hi-v5-menu__wrapper > .hi-v5-menu-item:last-child .hi-v5-menu-item__inner {-webkit-margin-after: 0;margin-block-end: 0;}.hi-v5-menu--vertical .hi-v5-menu__toggle {height: var(--hi-v5-height-10, 40px);line-height: var(--hi-v5-height-10, 40px);padding: 0 var(--hi-v5-spacing-6, 12px);cursor: pointer;border-radius: var(--hi-v5-border-radius-lg, 6px);color: var(--hi-v5-color-gray-600, #91959e);font-size: var(--hi-v5-text-size-lg, 1rem);-ms-flex-negative: 0;flex-shrink: 0;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));-webkit-transition-property: background-color;transition-property: background-color;}.hi-v5-menu--vertical .hi-v5-menu__toggle:hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical .hi-v5-menu-item__inner {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);border-radius: var(--hi-v5-border-radius-lg, 6px);-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu--vertical .hi-v5-menu-item__inner:not(.hi-v5-menu-item__inner--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu--vertical .hi-v5-menu-item__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-indent: 0.5px;}.hi-v5-menu--vertical .hi-v5-menu-item--disabled {color: var(--hi-v5-color-gray-500, #babcc2);cursor: not-allowed;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini {width: 60px;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-sizing: border-box;box-sizing: border-box;width: 52px;height: 48px;padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-3, 6px) 0;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__icon {-webkit-margin-end: 0;margin-inline-end: 0;-webkit-margin-after: var(--hi-v5-spacing-1, 2px);margin-block-end: var(--hi-v5-spacing-1, 2px);display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__icon svg[class^=hi-v5-icon] {font-size: var(--hi-v5-text-size-xl, 1.125rem);}.hi-v5-menu--vertical.hi-v5-menu--mini.hi-v5-menu--show-title-on-mini .hi-v5-menu-item__inner .hi-v5-menu-item__content {-webkit-transform: scale(0.5);transform: scale(0.5);width: 200%;font-size: calc(var(--hi-v5-text-size-xl, 1.125rem) + 2px);text-align: center;text-indent: 0;}.hi-v5-menu--vertical.hi-v5-menu--size-lg .hi-v5-menu-item__inner {height: var(--hi-v5-height-10, 40px);-webkit-margin-after: var(--hi-v5-spacing-4, 8px);margin-block-end: var(--hi-v5-spacing-4, 8px);}.hi-v5-menu--vertical.hi-v5-menu--size-md .hi-v5-menu-item__inner {height: var(--hi-v5-height-9, 36px);-webkit-margin-after: var(--hi-v5-spacing-2, 4px);margin-block-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-menu--vertical.hi-v5-menu--size-sm .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);-webkit-margin-after: var(--hi-v5-spacing-1, 2px);margin-block-end: var(--hi-v5-spacing-1, 2px);}.hi-v5-sidebar-wrapper {position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;height: 100%;}.hi-v5-sidebar-wrapper:not(.hi-v5-sidebar-wrapper-showMenuArrow) .hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__arrow {display: none;}.hi-v5-sidebar-wrapper--showMenu .hi-v5-sidebar-menu-wrapper {-webkit-border-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);}.hi-v5-sidebar-wrapper--showMenu .hi-v5-sidebar-toggle svg[class^=hi-v5-icon] {-webkit-transform: rotate(180deg);transform: rotate(180deg);}.hi-v5-sidebar-wrapper:not(.hi-v5-sidebar-wrapper--collapsible) .hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--expanded:hover {background-color: transparent;cursor: default;}.hi-v5-sidebar {-webkit-box-sizing: border-box;box-sizing: border-box;width: 64px;height: 100%;padding: var(--hi-v5-spacing-4, 8px) 0;overflow: auto;-webkit-border-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-end: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);background-color: #fff;}.hi-v5-sidebar-list {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;}.hi-v5-sidebar-item {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;list-style: none;margin: var(--hi-v5-spacing-6, 12px) var(--hi-v5-spacing-2, 4px) 0;padding: var(--hi-v5-spacing-3, 6px) var(--hi-v5-spacing-1, 2px);width: 52px;overflow: hidden;text-align: center;border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-sidebar-item:first-child {-webkit-margin-before: 0;margin-block-start: 0;}.hi-v5-sidebar-item:hover {cursor: pointer;}.hi-v5-sidebar-item:not(.hi-v5-sidebar-item--active):hover {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-sidebar-item--active {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-sidebar-item--active .hi-v5-sidebar-item__icon, .hi-v5-sidebar-item--active .hi-v5-sidebar-item__title {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-sidebar-item__icon {height: 20px;color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-sidebar-item__icon svg[class^=hi-v5-icon] {width: 20px;height: 20px;}.hi-v5-sidebar-item__title {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-sidebar-menu-wrapper {width: 0;-webkit-border-end: none;border-inline-end: none;overflow: hidden;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item .hi-v5-menu-item__inner {height: var(--hi-v5-height-8, 32px);-webkit-margin-after: 0;margin-block-end: 0;padding: 0 var(--hi-v5-spacing-4, 8px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item .hi-v5-menu-item__inner--hasIcon + div .hi-v5-menu-submenu .hi-v5-menu-item__indent {width: 20px;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__icon {color: var(--hi-v5-color-gray-700, #60636b);-webkit-margin-end: var(--hi-v5-spacing-2, 4px);margin-inline-end: var(--hi-v5-spacing-2, 4px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__indent {width: 14px;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__content {font-weight: 550;}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--active-p {color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-item__inner--active-p .hi-v5-menu-item__icon {color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu-submenu .hi-v5-menu-item__inner .hi-v5-menu-item__content {font-size: var(--hi-v5-text-size-sm, 0.75rem);font-weight: var(--hi-v5-text-weight-normal, 400);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu__wrapper > .hi-v5-menu-item {-webkit-margin-before: var(--hi-v5-spacing-4, 8px);margin-block-start: var(--hi-v5-spacing-4, 8px);}.hi-v5-sidebar-menu-wrapper .hi-v5-menu__wrapper > .hi-v5-menu-item:first-child {-webkit-margin-before: 0;margin-block-start: 0;}.hi-v5-sidebar-toggle {-webkit-box-sizing: border-box;box-sizing: border-box;position: absolute;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;width: 12px;height: 60px;inset-inline-end: -11px;inset-block-start: 50%;-webkit-transform: translate3d(0, -50%, 0);transform: translate3d(0, -50%, 0);border-start-end-radius: 16px 8px;border-end-end-radius: 16px 8px;border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);-webkit-border-start: none;border-inline-start: none;cursor: pointer;color: var(--hi-v5-color-gray-700, #60636b);background-color: #fff;}.hi-v5-sidebar-toggle svg[class^=hi-v5-icon] {-webkit-margin-start: -4px;margin-inline-start: -4px;}.hi-v5-menu-search {min-width: 360px;border-radius: var(--hi-v5-border-radius-xl, 8px);overflow: hidden;background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-menu-search__input-wrapper {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-8, 16px) 0 calc(var(--hi-v5-spacing-2, 4px) + 1px);height: var(--hi-v5-height-12, 48px);}.hi-v5-menu-search--open .hi-v5-menu-search__input-wrapper {border-end-start-radius: 0;border-end-end-radius: 0;}.hi-v5-menu-search__input .hi-v5-input__inner:hover {background-color: transparent !important;}.hi-v5-menu-search__input-prefix {color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-menu-search__input-clear {font-size: var(--hi-v5-text-size-sm, 0.75rem);}.hi-v5-menu-search__close {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;height: var(--hi-v5-height-4, 16px);-webkit-padding-start: var(--hi-v5-spacing-5, 10px);padding-inline-start: var(--hi-v5-spacing-5, 10px);-webkit-border-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-inline-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);}.hi-v5-menu-search__content {-webkit-box-sizing: border-box;box-sizing: border-box;display: none;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-4, 8px);max-height: 550px;-webkit-border-before: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #edeff2);border-block-start: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-search__content--visible {display: -webkit-box;display: -ms-flexbox;display: flex;}.hi-v5-menu-search__header {padding: 0 var(--hi-v5-spacing-4, 8px) var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-search__header-count {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-menu-search__list {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;overflow-y: auto;position: relative;outline: none;}.hi-v5-menu-search__list:focus {outline: none;}.hi-v5-menu-search__list-item {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;height: var(--hi-v5-height-10, 40px);padding: calc(var(--hi-v5-spacing-4, 8px) + 1px) var(--hi-v5-spacing-4, 8px);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);}.hi-v5-menu-search__list-item__title {font-size: var(--hi-v5-text-size-md, 0.875rem);color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-menu-search__list-item--selected, .hi-v5-menu-search__list-item:hover {cursor: pointer;background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-menu-search__empty {padding: calc(var(--hi-v5-spacing-2, 4px) + 1px) var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-menu-search__footer {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: var(--hi-v5-spacing-5, 10px) var(--hi-v5-spacing-8, 16px);background-color: #f5f7fa;}.hi-v5-menu-search__footer-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-margin-end: var(--hi-v5-spacing-8, 16px);margin-inline-end: var(--hi-v5-spacing-8, 16px);font-size: var(--hi-v5-text-size-sm, 0.75rem);color: var(--hi-v5-color-gray-600, #91959e);}.hi-v5-menu-search__footer-item__icon {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;gap: var(--hi-v5-spacing-1, 2px);-webkit-margin-end: var(--hi-v5-spacing-2, 4px);margin-inline-end: var(--hi-v5-spacing-2, 4px);padding: 0 var(--hi-v5-spacing-2, 4px);height: var(--hi-v5-height-5, 20px);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-400, #dbdde0);border-radius: var(--hi-v5-border-radius-md, 4px);}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-container {min-width: 360px;border-start-start-radius: 0;border-start-end-radius: 0;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-panel {border-top: none;border-start-start-radius: 0;border-start-end-radius: 0;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-body {max-height: 544px;}.hi-v5-menu-search__picker-overlay .hi-v5-menu-search__picker-footer {-webkit-box-shadow: none;box-shadow: none;background-color: #f5f7fa;}.hi-v5-group-menu {-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;height: 100%;padding: var(--hi-v5-spacing-4, 8px) 0;}.hi-v5-group-menu-item:not(:first-child) {-webkit-margin-before: var(--hi-v5-spacing-4, 8px);margin-block-start: var(--hi-v5-spacing-4, 8px);}.hi-v5-group-menu-item__content {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: var(--hi-v5-height-8, 32px);padding: 0 var(--hi-v5-spacing-4, 8px);margin: 0 var(--hi-v5-spacing-4, 8px);border-radius: var(--hi-v5-border-radius-lg, 6px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-800, rgba(26, 29, 38, 0.8));}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled) {cursor: pointer;}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled):hover .hi-v5-group-menu-item__content {background-color: var(--hi-v5-color-gray-200, #edeff2);}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled).hi-v5-group-menu-item--active > .hi-v5-group-menu-item__content {font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));}.hi-v5-group-menu-item:not(.hi-v5-group-menu-item--parent):not(.hi-v5-group-menu-item--disabled).hi-v5-group-menu-item--active:hover > .hi-v5-group-menu-item__content {background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));}.hi-v5-group-menu-item--disabled > .hi-v5-group-menu-item__content {color: var(--hi-v5-color-gray-500, #babcc2);}.hi-v5-group-menu-item--empty > .hi-v5-group-menu-item__content {display: none;}.hi-v5-group-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-group-menu-parent-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}.hi-v5-group-menu-parent-item > .hi-v5-group-menu-item__content {height: var(--hi-v5-height-7, 28px);font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-gray-800, #1a1d26);}.hi-v5-group-menu-parent-item > .hi-v5-group-menu-item__content .hi-v5-group-menu-item__title {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);}.hi-v5-group-menu-parent-item:not(:first-child) > .hi-v5-group-menu-item__content {-webkit-margin-before: var(--hi-v5-spacing-12, 24px);margin-block-start: var(--hi-v5-spacing-12, 24px);}.hi-v5-group-menu-parent-item + .hi-v5-group-menu-item {-webkit-margin-before: var(--hi-v5-spacing-12, 24px);margin-block-start: var(--hi-v5-spacing-12, 24px);}.hi-v5-side-menu {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: var(--hi-v5-spacing-2, 4px) 0;-webkit-transition: width 0.3s;transition: width 0.3s;}.hi-v5-side-menu-item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 var(--hi-v5-spacing-4, 8px) 0 var(--hi-v5-spacing-6, 12px);font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);color: var(--hi-v5-color-gray-800, #1a1d26);border-radius: var(--hi-v5-border-radius-lg, 6px);cursor: pointer;position: relative;}.hi-v5-side-menu-item:hover, .hi-v5-side-menu-item--selected {background-color: rgba(124, 135, 166, 0.15);}.hi-v5-side-menu-item:not(.hi-v5-side-menu-item--mini) {height: var(--hi-v5-height-8, 32px);}.hi-v5-side-menu-item:not(.hi-v5-side-menu-item--mini) .hi-v5-side-menu-item__title {min-width: 1px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}.hi-v5-side-menu-item-wrapper {padding: var(--hi-v5-spacing-2, 4px) var(--hi-v5-spacing-4, 8px);}.hi-v5-side-menu-item--active {font-weight: var(--hi-v5-text-weight-medium, 500);color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-side-menu-item--active:hover {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-side-menu-item--active .hi-v5-side-menu-item__icon,.hi-v5-side-menu-item--active .hi-v5-side-menu-item__title {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-side-menu-item__icon {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-margin-end: var(--hi-v5-spacing-4, 8px);margin-inline-end: var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-lg, 1rem);color: #7c87a6;}.hi-v5-side-menu-item--mini {-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;padding: var(--hi-v5-spacing-3, 6px);width: 52px;max-height: 64px;color: var(--hi-v5-color-gray-700, #60636b);}.hi-v5-side-menu-item--mini .hi-v5-side-menu-item__icon {-webkit-margin-end: 0;margin-inline-end: 0;-webkit-margin-after: var(--hi-v5-spacing-3, 6px);margin-block-end: var(--hi-v5-spacing-3, 6px);font-size: var(--hi-v5-text-size-xl, 1.125rem);}.hi-v5-side-menu-item--mini .hi-v5-side-menu-item__title {font-size: 20px;line-height: 28px;text-align: center;text-indent: 0;-webkit-transform: scale(0.5);transform: scale(0.5);width: 200%;-webkit-margin-after: -14px;margin-block-end: -14px;-webkit-transform-origin: top;transform-origin: top;white-space: normal;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;line-clamp: 2;word-break: break-word;overflow: hidden;text-overflow: ellipsis;}.hi-v5-side-menu--mini .hi-v5-side-menu-item-wrapper {padding: var(--hi-v5-spacing-2, 4px);}.hi-v5-side-menu .hi-v5-scrollbar__wrapper {width: 100%;}";
|
|
12
12
|
__styleInject__(css_248z);
|
|
13
13
|
export { css_248z as default };
|
package/lib/types/GroupMenu.d.ts
CHANGED
|
@@ -6,10 +6,10 @@ import { MenuDataItem } from './types';
|
|
|
6
6
|
* 分组菜单
|
|
7
7
|
*/
|
|
8
8
|
export declare const GroupMenu: React.ForwardRefExoticComponent<GroupMenuProps & React.RefAttributes<HTMLDivElement | null>>;
|
|
9
|
-
export type GroupMenuSemanticName = 'root' | 'wrapper' | 'item' | 'itemContent' | 'itemIcon' | 'itemTitle';
|
|
10
|
-
export type GroupMenuSemanticClassNames = SemanticClassNamesType<GroupMenuProps, GroupMenuSemanticName>;
|
|
11
|
-
export type GroupMenuSemanticStyles = SemanticStylesType<GroupMenuProps, GroupMenuSemanticName>;
|
|
12
|
-
export type GroupMenuSemantic = ComponentSemantic<GroupMenuSemanticClassNames, GroupMenuSemanticStyles>;
|
|
9
|
+
export declare type GroupMenuSemanticName = 'root' | 'wrapper' | 'item' | 'itemContent' | 'itemIcon' | 'itemTitle';
|
|
10
|
+
export declare type GroupMenuSemanticClassNames = SemanticClassNamesType<GroupMenuProps, GroupMenuSemanticName>;
|
|
11
|
+
export declare type GroupMenuSemanticStyles = SemanticStylesType<GroupMenuProps, GroupMenuSemanticName>;
|
|
12
|
+
export declare type GroupMenuSemantic = ComponentSemantic<GroupMenuSemanticClassNames, GroupMenuSemanticStyles>;
|
|
13
13
|
export interface GroupMenuProps extends Omit<HiBaseHTMLProps<'div'>, 'onClick'>, GroupMenuSemantic {
|
|
14
14
|
/**
|
|
15
15
|
* 菜单项数据列表
|
package/lib/types/Menu.d.ts
CHANGED
|
@@ -6,10 +6,10 @@ import { MenuDataItem, MenuFooterRenderProps } from './types';
|
|
|
6
6
|
* 菜单
|
|
7
7
|
*/
|
|
8
8
|
export declare const Menu: React.ForwardRefExoticComponent<MenuProps & React.RefAttributes<HTMLDivElement | null>>;
|
|
9
|
-
export type MenuSemanticName = 'root' | 'wrapper' | 'footer' | 'toggle' | 'item' | 'itemInner' | 'itemIcon' | 'itemContent' | 'itemArrow' | 'submenu' | 'popmenu';
|
|
10
|
-
export type MenuSemanticClassNames = SemanticClassNamesType<MenuProps, MenuSemanticName>;
|
|
11
|
-
export type MenuSemanticStyles = SemanticStylesType<MenuProps, MenuSemanticName>;
|
|
12
|
-
export type MenuSemantic = ComponentSemantic<MenuSemanticClassNames, MenuSemanticStyles>;
|
|
9
|
+
export declare type MenuSemanticName = 'root' | 'wrapper' | 'footer' | 'toggle' | 'item' | 'itemInner' | 'itemIcon' | 'itemContent' | 'itemArrow' | 'submenu' | 'popmenu';
|
|
10
|
+
export declare type MenuSemanticClassNames = SemanticClassNamesType<MenuProps, MenuSemanticName>;
|
|
11
|
+
export declare type MenuSemanticStyles = SemanticStylesType<MenuProps, MenuSemanticName>;
|
|
12
|
+
export declare type MenuSemantic = ComponentSemantic<MenuSemanticClassNames, MenuSemanticStyles>;
|
|
13
13
|
export interface MenuProps extends Omit<HiBaseHTMLProps<'div'>, 'onClick'>, MenuSemantic {
|
|
14
14
|
/**
|
|
15
15
|
* 菜单项数据列表
|
|
@@ -8,10 +8,10 @@ export interface MenuSearchHelper {
|
|
|
8
8
|
hide: () => void;
|
|
9
9
|
focus: () => void;
|
|
10
10
|
}
|
|
11
|
-
export type MenuSearchSemanticName = 'root' | 'inputWrapper' | 'input' | 'inputClear' | 'close' | 'content' | 'header' | 'list' | 'listItem' | 'listItemTitle' | 'empty' | 'footer' | 'footerItem' | 'footerItemIcon' | 'footerItemText';
|
|
12
|
-
export type MenuSearchSemanticClassNames = SemanticClassNamesType<MenuSearchProps, MenuSearchSemanticName>;
|
|
13
|
-
export type MenuSearchSemanticStyles = SemanticStylesType<MenuSearchProps, MenuSearchSemanticName>;
|
|
14
|
-
export type MenuSearchSemantic = ComponentSemantic<MenuSearchSemanticClassNames, MenuSearchSemanticStyles>;
|
|
11
|
+
export declare type MenuSearchSemanticName = 'root' | 'inputWrapper' | 'input' | 'inputClear' | 'close' | 'content' | 'header' | 'list' | 'listItem' | 'listItemTitle' | 'empty' | 'footer' | 'footerItem' | 'footerItemIcon' | 'footerItemText';
|
|
12
|
+
export declare type MenuSearchSemanticClassNames = SemanticClassNamesType<MenuSearchProps, MenuSearchSemanticName>;
|
|
13
|
+
export declare type MenuSearchSemanticStyles = SemanticStylesType<MenuSearchProps, MenuSearchSemanticName>;
|
|
14
|
+
export declare type MenuSearchSemantic = ComponentSemantic<MenuSearchSemanticClassNames, MenuSearchSemanticStyles>;
|
|
15
15
|
export interface MenuSearchProps extends HiBaseHTMLProps<'div'>, MenuSearchSemantic {
|
|
16
16
|
innerRef?: React.RefObject<MenuSearchHelper>;
|
|
17
17
|
clearText?: React.ReactNode;
|
|
@@ -31,14 +31,14 @@ export interface MenuSearchProps extends HiBaseHTMLProps<'div'>, MenuSearchSeman
|
|
|
31
31
|
}
|
|
32
32
|
export declare const MenuSearchInput: React.ForwardRefExoticComponent<{
|
|
33
33
|
prefixCls: string;
|
|
34
|
-
placeholder?: string;
|
|
35
|
-
inputRef?: React.Dispatch<React.SetStateAction<HTMLInputElement | null
|
|
36
|
-
width?: React.CSSProperties[
|
|
37
|
-
value?: string;
|
|
38
|
-
onChange?: (value: string) => void;
|
|
39
|
-
onClear?: () => void;
|
|
40
|
-
onClose?: () => void;
|
|
41
|
-
onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
|
|
42
|
-
semanticClassNames?: Record<string, string | undefined
|
|
43
|
-
semanticStyles?: Record<string, React.CSSProperties | undefined
|
|
34
|
+
placeholder?: string | undefined;
|
|
35
|
+
inputRef?: React.Dispatch<React.SetStateAction<HTMLInputElement | null>> | undefined;
|
|
36
|
+
width?: React.CSSProperties['width'];
|
|
37
|
+
value?: string | undefined;
|
|
38
|
+
onChange?: ((value: string) => void) | undefined;
|
|
39
|
+
onClear?: (() => void) | undefined;
|
|
40
|
+
onClose?: (() => void) | undefined;
|
|
41
|
+
onKeyDown?: ((e: React.KeyboardEvent<HTMLInputElement>) => void) | undefined;
|
|
42
|
+
semanticClassNames?: Record<string, string | undefined> | undefined;
|
|
43
|
+
semanticStyles?: Record<string, React.CSSProperties | undefined> | undefined;
|
|
44
44
|
} & React.RefAttributes<HTMLInputElement>>;
|
package/lib/types/SideMenu.d.ts
CHANGED
|
@@ -6,10 +6,10 @@ import { MenuDataItem } from './types';
|
|
|
6
6
|
* 侧边菜单组件
|
|
7
7
|
*/
|
|
8
8
|
export declare const SideMenu: React.ForwardRefExoticComponent<SideMenuProps & React.RefAttributes<HTMLDivElement | null>>;
|
|
9
|
-
export type SideMenuSemanticName = 'root' | 'wrapper' | 'itemWrapper' | 'item' | 'itemIcon' | 'itemTitle';
|
|
10
|
-
export type SideMenuSemanticClassNames = SemanticClassNamesType<SideMenuProps, SideMenuSemanticName>;
|
|
11
|
-
export type SideMenuSemanticStyles = SemanticStylesType<SideMenuProps, SideMenuSemanticName>;
|
|
12
|
-
export type SideMenuSemantic = ComponentSemantic<SideMenuSemanticClassNames, SideMenuSemanticStyles>;
|
|
9
|
+
export declare type SideMenuSemanticName = 'root' | 'wrapper' | 'itemWrapper' | 'item' | 'itemIcon' | 'itemTitle';
|
|
10
|
+
export declare type SideMenuSemanticClassNames = SemanticClassNamesType<SideMenuProps, SideMenuSemanticName>;
|
|
11
|
+
export declare type SideMenuSemanticStyles = SemanticStylesType<SideMenuProps, SideMenuSemanticName>;
|
|
12
|
+
export declare type SideMenuSemantic = ComponentSemantic<SideMenuSemanticClassNames, SideMenuSemanticStyles>;
|
|
13
13
|
export interface SideMenuProps extends Omit<HiBaseHTMLProps<'div'>, 'onClick' | 'onMouseEnter' | 'onMouseLeave'>, SideMenuSemantic {
|
|
14
14
|
/**
|
|
15
15
|
* 侧边菜单宽度
|
package/lib/types/context.d.ts
CHANGED
|
@@ -6,18 +6,18 @@ export interface MenuSemanticContext {
|
|
|
6
6
|
semanticStyles?: Record<string, React.CSSProperties | undefined>;
|
|
7
7
|
}
|
|
8
8
|
declare const MenuContext: React.Context<{
|
|
9
|
-
placement?: "
|
|
10
|
-
expandedType?: "collapse" | "pop";
|
|
11
|
-
showAllSubMenus?: boolean;
|
|
12
|
-
mini?: boolean;
|
|
13
|
-
showTitleOnMini?: boolean;
|
|
14
|
-
expandedIds?: React.ReactText[];
|
|
15
|
-
activeId?: React.ReactText;
|
|
16
|
-
activeParents?: React.ReactText[];
|
|
17
|
-
overlayClassName?: string;
|
|
18
|
-
clickMenu?: (id: React.ReactText, raw: MenuDataItem) => void;
|
|
19
|
-
clickSubMenu?: (id: React.ReactText) => void;
|
|
20
|
-
closePopper?: (id: React.ReactText) => void;
|
|
21
|
-
closeAllPopper?: () => void;
|
|
9
|
+
placement?: "horizontal" | "vertical" | undefined;
|
|
10
|
+
expandedType?: "collapse" | "pop" | undefined;
|
|
11
|
+
showAllSubMenus?: boolean | undefined;
|
|
12
|
+
mini?: boolean | undefined;
|
|
13
|
+
showTitleOnMini?: boolean | undefined;
|
|
14
|
+
expandedIds?: React.ReactText[] | undefined;
|
|
15
|
+
activeId?: React.ReactText | undefined;
|
|
16
|
+
activeParents?: React.ReactText[] | undefined;
|
|
17
|
+
overlayClassName?: string | undefined;
|
|
18
|
+
clickMenu?: ((id: React.ReactText, raw: MenuDataItem) => void) | undefined;
|
|
19
|
+
clickSubMenu?: ((id: React.ReactText) => void) | undefined;
|
|
20
|
+
closePopper?: ((id: React.ReactText) => void) | undefined;
|
|
21
|
+
closeAllPopper?: (() => void) | undefined;
|
|
22
22
|
} & MenuSemanticContext>;
|
|
23
23
|
export default MenuContext;
|
package/lib/types/util.d.ts
CHANGED
|
@@ -5,7 +5,7 @@ export declare const getParentId: (id: string | number, data: Record<string, any
|
|
|
5
5
|
export declare const getAncestorIds: (id: string | number, data: Record<string, any>[], arr?: (string | number)[]) => (string | number)[];
|
|
6
6
|
export declare const getIdsWithChildren: (treeData: MenuDataItem[]) => React.ReactText[];
|
|
7
7
|
export declare const filterTreeData: (treeData: MenuDataItem[], searchKey: string, activeId: string | number) => MenuDataItem[];
|
|
8
|
-
export declare const transformTreeData: (data: MenuDataItem[], fieldNames?: HiBaseFieldNames) => MenuDataItem[];
|
|
8
|
+
export declare const transformTreeData: (data: MenuDataItem[], fieldNames?: HiBaseFieldNames | undefined) => MenuDataItem[];
|
|
9
9
|
/**
|
|
10
10
|
* 根据关键字匹配菜单数据的算法
|
|
11
11
|
* @param data 菜单数据数组
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hi-ui/menu",
|
|
3
|
-
"version": "5.0.0-
|
|
3
|
+
"version": "5.0.0-rc.0",
|
|
4
4
|
"description": "A sub-package for @hi-ui/hiui.",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"author": "HiUI <mi-hiui@xiaomi.com>",
|
|
@@ -44,40 +44,40 @@
|
|
|
44
44
|
"url": "https://github.com/XiaoMi/hiui/issues"
|
|
45
45
|
},
|
|
46
46
|
"dependencies": {
|
|
47
|
-
"@hi-ui/array-utils": "^5.0.0-
|
|
48
|
-
"@hi-ui/button": "^5.0.0-
|
|
49
|
-
"@hi-ui/classname": "^5.0.0-
|
|
50
|
-
"@hi-ui/ellipsis-tooltip": "^5.0.0-
|
|
51
|
-
"@hi-ui/env": "^5.0.0-
|
|
52
|
-
"@hi-ui/highlighter": "^5.0.0-
|
|
53
|
-
"@hi-ui/icon-button": "^5.0.0-
|
|
54
|
-
"@hi-ui/icons": "^5.0.0-
|
|
55
|
-
"@hi-ui/input": "^5.0.0-
|
|
56
|
-
"@hi-ui/picker": "^5.0.0-
|
|
57
|
-
"@hi-ui/popper": "^5.0.0-
|
|
58
|
-
"@hi-ui/scrollbar": "^5.0.0-
|
|
59
|
-
"@hi-ui/times": "^5.0.0-
|
|
60
|
-
"@hi-ui/tooltip": "^5.0.0-
|
|
61
|
-
"@hi-ui/tree-utils": "^5.0.0-
|
|
62
|
-
"@hi-ui/type-assertion": "^5.0.0-
|
|
63
|
-
"@hi-ui/use-id": "^5.0.0-
|
|
64
|
-
"@hi-ui/use-latest": "^5.0.0-
|
|
65
|
-
"@hi-ui/use-merge-refs": "^5.0.0-
|
|
66
|
-
"@hi-ui/use-
|
|
67
|
-
"@hi-ui/use-
|
|
68
|
-
"@hi-ui/use-
|
|
69
|
-
"@hi-ui/use-
|
|
70
|
-
"
|
|
71
|
-
"
|
|
47
|
+
"@hi-ui/array-utils": "^5.0.0-rc.0",
|
|
48
|
+
"@hi-ui/button": "^5.0.0-rc.0",
|
|
49
|
+
"@hi-ui/classname": "^5.0.0-rc.0",
|
|
50
|
+
"@hi-ui/ellipsis-tooltip": "^5.0.0-rc.0",
|
|
51
|
+
"@hi-ui/env": "^5.0.0-rc.0",
|
|
52
|
+
"@hi-ui/highlighter": "^5.0.0-rc.0",
|
|
53
|
+
"@hi-ui/icon-button": "^5.0.0-rc.0",
|
|
54
|
+
"@hi-ui/icons": "^5.0.0-rc.0",
|
|
55
|
+
"@hi-ui/input": "^5.0.0-rc.0",
|
|
56
|
+
"@hi-ui/picker": "^5.0.0-rc.0",
|
|
57
|
+
"@hi-ui/popper": "^5.0.0-rc.0",
|
|
58
|
+
"@hi-ui/scrollbar": "^5.0.0-rc.0",
|
|
59
|
+
"@hi-ui/times": "^5.0.0-rc.0",
|
|
60
|
+
"@hi-ui/tooltip": "^5.0.0-rc.0",
|
|
61
|
+
"@hi-ui/tree-utils": "^5.0.0-rc.0",
|
|
62
|
+
"@hi-ui/type-assertion": "^5.0.0-rc.0",
|
|
63
|
+
"@hi-ui/use-id": "^5.0.0-rc.0",
|
|
64
|
+
"@hi-ui/use-latest": "^5.0.0-rc.0",
|
|
65
|
+
"@hi-ui/use-merge-refs": "^5.0.0-rc.0",
|
|
66
|
+
"@hi-ui/use-merge-semantic": "^5.0.0-rc.0",
|
|
67
|
+
"@hi-ui/use-outside-click": "^5.0.0-rc.0",
|
|
68
|
+
"@hi-ui/use-resize-observer": "^5.0.0-rc.0",
|
|
69
|
+
"@hi-ui/use-toggle": "^5.0.0-rc.0",
|
|
70
|
+
"@hi-ui/use-uncontrolled-state": "^5.0.0-rc.0",
|
|
71
|
+
"react-transition-group": "^4.4.5"
|
|
72
72
|
},
|
|
73
73
|
"peerDependencies": {
|
|
74
|
-
"@hi-ui/core": ">=5.0.0-
|
|
74
|
+
"@hi-ui/core": ">=5.0.0-rc.0",
|
|
75
75
|
"react": ">=16.8.6",
|
|
76
76
|
"react-dom": ">=16.8.6"
|
|
77
77
|
},
|
|
78
78
|
"devDependencies": {
|
|
79
|
-
"@hi-ui/core": "^5.0.0-
|
|
80
|
-
"@hi-ui/core-css": "^5.0.0-
|
|
79
|
+
"@hi-ui/core": "^5.0.0-rc.0",
|
|
80
|
+
"@hi-ui/core-css": "^5.0.0-rc.0",
|
|
81
81
|
"react": "^17.0.1",
|
|
82
82
|
"react-dom": "^17.0.1"
|
|
83
83
|
}
|