revdev-components 0.11.0 → 0.13.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/build/back-layout/index.d.ts +2 -2
- package/build/index.d.ts +1 -0
- package/build/index.js +12 -5
- package/build/styles.css +33 -4
- package/package.json +2 -2
|
@@ -2,16 +2,16 @@ import React from "react";
|
|
|
2
2
|
import { BackSidebarProps } from "src/back-sidebar";
|
|
3
3
|
interface Props {
|
|
4
4
|
loading?: boolean;
|
|
5
|
-
shortMode?: boolean;
|
|
6
5
|
header?: React.ReactNode;
|
|
7
6
|
sidebar?: React.ReactNode;
|
|
8
7
|
children?: React.ReactNode;
|
|
8
|
+
sidebarTitle?: React.ReactNode;
|
|
9
9
|
className?: string;
|
|
10
10
|
headerClassName?: string;
|
|
11
11
|
sidebarClassName?: string;
|
|
12
12
|
contentClassName?: string;
|
|
13
13
|
loadingClassName?: string;
|
|
14
|
-
sidebarProps: BackSidebarProps
|
|
14
|
+
sidebarProps: Omit<BackSidebarProps, "shortMode">;
|
|
15
15
|
}
|
|
16
16
|
export declare const BackLayout: React.FC<Props>;
|
|
17
17
|
export {};
|
package/build/index.d.ts
CHANGED
package/build/index.js
CHANGED
|
@@ -4916,7 +4916,7 @@ var BackSidebarMenuItem = function (_a) {
|
|
|
4916
4916
|
React.createElement("span", { className: s$4.title__label }, label),
|
|
4917
4917
|
React.createElement(RegularIcon, { name: open ? "keyboard-arrow-down" : "keyboard-arrow-right" })),
|
|
4918
4918
|
React.createElement("div", { className: classNames(s$4.list, (_c = {}, _c[s$4.list__open] = open, _c)) }, options.map(function (x, i) {
|
|
4919
|
-
return React.createElement(BackSidebarSubMenuItem, { key: i, option: x });
|
|
4919
|
+
return React.createElement(BackSidebarSubMenuItem, { key: i, option: x, activePath: activePath });
|
|
4920
4920
|
}))));
|
|
4921
4921
|
};
|
|
4922
4922
|
|
|
@@ -4955,15 +4955,22 @@ var BackSidebar = function (_a) {
|
|
|
4955
4955
|
}))));
|
|
4956
4956
|
};
|
|
4957
4957
|
|
|
4958
|
-
var s = {"root":"index-module_root__BkOp7","root__short":"index-module_root__short__maBe-","header":"index-module_header__34B0-","sidebar":"index-module_sidebar__xjW3v","content":"index-module_content__cMuen","loading":"index-module_loading__KxkST"};
|
|
4958
|
+
var s = {"root":"index-module_root__BkOp7","root__short":"index-module_root__short__maBe-","header":"index-module_header__34B0-","sidebar":"index-module_sidebar__xjW3v","content":"index-module_content__cMuen","loading":"index-module_loading__KxkST","menu":"index-module_menu__IwQDu","menu__icon":"index-module_menu__icon__KNyXp"};
|
|
4959
4959
|
|
|
4960
4960
|
var BackLayout = function (_a) {
|
|
4961
4961
|
var _b;
|
|
4962
|
-
var className = _a.className, loading = _a.loading,
|
|
4963
|
-
|
|
4962
|
+
var className = _a.className, loading = _a.loading, header = _a.header, sidebarTitle = _a.sidebarTitle, children = _a.children, headerClassName = _a.headerClassName, sidebarClassName = _a.sidebarClassName, contentClassName = _a.contentClassName, loadingClassName = _a.loadingClassName, sidebarProps = _a.sidebarProps;
|
|
4963
|
+
var _c = React.useState(false), short = _c[0], setShort = _c[1];
|
|
4964
|
+
var handleMenu = React.useCallback(function () {
|
|
4965
|
+
setShort(!short);
|
|
4966
|
+
}, [short]);
|
|
4967
|
+
return (React.createElement("div", { className: classNames(s.root, className, (_b = {}, _b[s.root__short] = short, _b)) },
|
|
4964
4968
|
React.createElement("div", { className: classNames(s.header, headerClassName) }, header),
|
|
4965
4969
|
React.createElement("div", { className: classNames(s.sidebar, sidebarClassName) },
|
|
4966
|
-
React.createElement(
|
|
4970
|
+
React.createElement("div", { className: s.menu },
|
|
4971
|
+
React.createElement(RegularIcon, { className: s.menu__icon, name: "menu", onClick: handleMenu }),
|
|
4972
|
+
!short && React.createElement("div", { className: s.menu__title }, sidebarTitle)),
|
|
4973
|
+
React.createElement(BackSidebar, __assign({}, sidebarProps, { shortMode: short }))),
|
|
4967
4974
|
loading ? (React.createElement("div", { className: classNames(s.loading, loadingClassName) },
|
|
4968
4975
|
React.createElement(antd.Spin, { size: "large" }))) : (React.createElement("div", { className: classNames(s.content, contentClassName) }, children))));
|
|
4969
4976
|
};
|
package/build/styles.css
CHANGED
|
@@ -1,3 +1,16 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--linkColor: #332e56;
|
|
3
|
+
--backSidebarBackgroundColor: rgb(58 63 81);
|
|
4
|
+
--backSidebarColor: #aaadb7;
|
|
5
|
+
--backSidebarActiveColor: white;
|
|
6
|
+
--backSidebarHoverItemBackgroundColor: rgb(97 102 122);
|
|
7
|
+
--backSidebarSubItemBackgroundColor: #2e3344;
|
|
8
|
+
--backHeaderHeight: 50px;
|
|
9
|
+
--backHeaderBoxShadow: 0 2px 5px 0 rgb(0 0 0 / 16%);
|
|
10
|
+
--backLayoutBorderColor: #ccc;
|
|
11
|
+
--backLayoutBackgroundColor: white;
|
|
12
|
+
--backLayoutHeaderBackgroundColor: white;
|
|
13
|
+
}
|
|
1
14
|
.index-module_root__-LDR1 {
|
|
2
15
|
display: inline-block;
|
|
3
16
|
height: 1em;
|
|
@@ -177,14 +190,14 @@
|
|
|
177
190
|
color: var(--backSidebarActiveColor) !important;
|
|
178
191
|
text-decoration: none !important;
|
|
179
192
|
}
|
|
180
|
-
.index-module_root__active__32aMB > svg,
|
|
181
|
-
.index-module_root__active__32aMB span {
|
|
182
|
-
color: var(--backSidebarActiveColor) !important;
|
|
183
|
-
}
|
|
184
193
|
.index-module_root__En9mt > svg,
|
|
185
194
|
.index-module_root__En9mt span {
|
|
186
195
|
color: var(--backSidebarColor) !important;
|
|
187
196
|
}
|
|
197
|
+
.index-module_root__active__32aMB > svg,
|
|
198
|
+
.index-module_root__active__32aMB > span {
|
|
199
|
+
color: var(--backSidebarActiveColor) !important;
|
|
200
|
+
}
|
|
188
201
|
.index-module_root__v-d7O {
|
|
189
202
|
position: relative;
|
|
190
203
|
}
|
|
@@ -257,4 +270,20 @@
|
|
|
257
270
|
display: flex;
|
|
258
271
|
justify-content: center;
|
|
259
272
|
align-items: center;
|
|
273
|
+
}
|
|
274
|
+
|
|
275
|
+
.index-module_menu__IwQDu {
|
|
276
|
+
padding: 15px 15px 0;
|
|
277
|
+
display: flex;
|
|
278
|
+
flex-direction: row;
|
|
279
|
+
gap: 15px;
|
|
280
|
+
align-items: center;
|
|
281
|
+
color: var(--backSidebarActiveColor);
|
|
282
|
+
}
|
|
283
|
+
.index-module_menu__icon__KNyXp {
|
|
284
|
+
font-size: 20px;
|
|
285
|
+
cursor: pointer;
|
|
286
|
+
}
|
|
287
|
+
.index-module_menu__icon__KNyXp:hover {
|
|
288
|
+
opacity: 0.9;
|
|
260
289
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "revdev-components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.13.0",
|
|
4
4
|
"main": "build/index.js",
|
|
5
5
|
"module": "build/index.esm.js",
|
|
6
6
|
"scripts": {
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"next": ">=13",
|
|
28
28
|
"react": ">=18",
|
|
29
29
|
"react-dom": ">=18",
|
|
30
|
-
"page-path": ">=0.
|
|
30
|
+
"page-path": ">=0.7"
|
|
31
31
|
},
|
|
32
32
|
"devDependencies": {
|
|
33
33
|
"@chromatic-com/storybook": "^3.2.2",
|