@aloudata/aloudata-design 2.0.0-beta.8 → 2.0.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/dist/Button/style/index.less +4 -0
- package/dist/Checkbox/style/index.less +8 -10
- package/dist/ColorPicker/index.js +4 -2
- package/dist/ColorPicker/style/index.less +1 -2
- package/dist/ConfigProvider/index.d.ts +1 -1
- package/dist/ConfigProvider/index.js +9 -1
- package/dist/DataPreviewTable/components/Body/index.js +7 -0
- package/dist/DataPreviewTable/constant.d.ts +1 -1
- package/dist/DataPreviewTable/constant.js +1 -1
- package/dist/DataPreviewTable/interface.d.ts +1 -0
- package/dist/DataPreviewTable/style/index.less +15 -12
- package/dist/Dropdown/index.js +4 -1
- package/dist/Dropdown/style/index.less +12 -2
- package/dist/Empty/index.js +2 -1
- package/dist/Empty/style/index.less +2 -2
- package/dist/Form/style/index.d.ts +1 -0
- package/dist/Form/style/index.js +1 -0
- package/dist/Form/style/index.less +15 -0
- package/dist/HighlightText/index.d.ts +12 -0
- package/dist/HighlightText/index.js +27 -0
- package/dist/HighlightText/style/index.less +5 -0
- package/dist/Icon/components/ArrowRightLightLine.d.ts +11 -0
- package/dist/Icon/components/ArrowRightLightLine.js +35 -0
- package/dist/Icon/components/TimesLightLine.d.ts +11 -0
- package/dist/Icon/components/TimesLightLine.js +35 -0
- package/dist/Icon/index.d.ts +2 -0
- package/dist/Icon/index.js +2 -0
- package/dist/Icon/svg/Arrow-Right-light-line.svg +5 -0
- package/dist/Icon/svg/Times-light-line.svg +5 -0
- package/dist/IconButton/index.js +4 -1
- package/dist/Input/components/Input/index.d.ts +2 -5
- package/dist/Input/components/Input/index.js +2 -1
- package/dist/Input/components/TextArea/index.js +7 -4
- package/dist/MemberPicker/index.js +35 -9
- package/dist/MemberPicker/interface.d.ts +1 -1
- package/dist/MemberPicker/style/index.less +13 -5
- package/dist/Menu/style/index.less +1 -2
- package/dist/Modal/index.d.ts +3 -4
- package/dist/Modal/index.js +29 -8
- package/dist/Modal/style/modal.less +4 -0
- package/dist/Modal/style/modalConfirm.less +5 -1
- package/dist/Modal/style/polyfill/index.less +0 -3
- package/dist/Popconfirm/index.js +1 -1
- package/dist/Popconfirm/style/index.less +4 -8
- package/dist/Progress/style/index.less +5 -2
- package/dist/Radio/components/Radio/index.js +26 -4
- package/dist/Radio/style/index.less +57 -3
- package/dist/Select/index.d.ts +0 -1
- package/dist/Select/index.js +19 -19
- package/dist/Select/style/emptyShowAll.less +10 -0
- package/dist/Select/style/index.less +17 -7
- package/dist/Select/style/layout.less +1 -0
- package/dist/Select/style/selectDropdown.less +1 -2
- package/dist/Select/style/status.less +45 -2
- package/dist/Table/index.js +8 -2
- package/dist/Table/style/index.less +6 -5
- package/dist/Tabs/style/index.less +2 -7
- package/dist/Tooltip/index.js +5 -3
- package/dist/Tooltip/style/index.less +6 -6
- package/dist/Tree/Tree.d.ts +3 -2
- package/dist/Tree/Tree.js +80 -10
- package/dist/Tree/demo/basic/index.js +4 -0
- package/dist/Tree/demo/filter/index.d.ts +3 -0
- package/dist/Tree/demo/filter/index.js +64 -0
- package/dist/Tree/style/checkbox.less +57 -36
- package/dist/Tree/style/index.less +27 -6
- package/dist/Tree/style/mixin.less +10 -6
- package/dist/Tree/style/var.less +1 -1
- package/dist/ald.min.css +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/index.js +1 -1
- package/dist/index.less +1 -0
- package/dist/style/index.less +3 -3
- package/dist/style/themes/default/index.less +5 -3
- package/package.json +2 -1
- package/dist/Navigator/components/Header/index.d.ts +0 -9
- package/dist/Navigator/components/Header/index.js +0 -16
- package/dist/Navigator/components/Menu/index.d.ts +0 -13
- package/dist/Navigator/components/Menu/index.js +0 -42
- package/dist/Navigator/components/MenuItem/index.d.ts +0 -21
- package/dist/Navigator/components/MenuItem/index.js +0 -36
- package/dist/Navigator/index.d.ts +0 -51
- package/dist/Navigator/index.js +0 -33
- package/dist/Navigator/style/bg.png +0 -0
- package/dist/Navigator/style/index.less +0 -159
- /package/dist/{Navigator → HighlightText}/style/index.d.ts +0 -0
- /package/dist/{Navigator → HighlightText}/style/index.js +0 -0
package/dist/index.d.ts
CHANGED
|
@@ -22,6 +22,7 @@ export type { CollapsePanelProps, CollapseProps } from './Collapse';
|
|
|
22
22
|
export { default as ColorPicker } from './ColorPicker';
|
|
23
23
|
export type { IColorPickerProps } from './ColorPicker';
|
|
24
24
|
export { default as ConfigProvider } from './ConfigProvider';
|
|
25
|
+
export type { EUserType } from './ConfigProvider/getUserList';
|
|
25
26
|
export type { SizeType } from './ConfigProvider/sizeContext';
|
|
26
27
|
export { default as DataPreviewTable } from './DataPreviewTable';
|
|
27
28
|
export type { ITableProps as DataPreviewTableProps, DataPreviewTableRef, PreviewColumn, } from './DataPreviewTable/interface';
|
|
@@ -37,6 +38,7 @@ export { default as Empty } from './Empty';
|
|
|
37
38
|
export type { IEmptyProps as EmptyProps } from './Empty';
|
|
38
39
|
export { default as Form } from './Form';
|
|
39
40
|
export type { FormInstance, FormItemProps, FormProps } from './Form';
|
|
41
|
+
export { default as HighlightText } from './HighlightText';
|
|
40
42
|
export { default as IconButton } from './IconButton';
|
|
41
43
|
export { default as Input } from './Input';
|
|
42
44
|
export type { IInputProps as InputProps, InputRef, TSize, TextAreaRef, } from './Input';
|
|
@@ -50,8 +52,6 @@ export { default as Menu } from './Menu';
|
|
|
50
52
|
export type { ItemType, IMenuProps as MenuProps } from './Menu';
|
|
51
53
|
export { default as Modal } from './Modal';
|
|
52
54
|
export type { ModalFuncProps, ModalProps } from './Modal';
|
|
53
|
-
export { default as Navigator } from './Navigator';
|
|
54
|
-
export type { IMenuItem as NavigatorMenu, INavigatorProps as NavigatorProps, ISelectedMenuInfo as SelectedMenuInfo, } from './Navigator';
|
|
55
55
|
export { default as Pagination } from './Pagination';
|
|
56
56
|
export { default as Popconfirm } from './Popconfirm';
|
|
57
57
|
export type { PopconfirmProps } from './Popconfirm';
|
package/dist/index.js
CHANGED
|
@@ -20,6 +20,7 @@ export { default as Drawer } from "./Drawer";
|
|
|
20
20
|
export { default as Dropdown } from "./Dropdown";
|
|
21
21
|
export { default as Empty } from "./Empty";
|
|
22
22
|
export { default as Form } from "./Form";
|
|
23
|
+
export { default as HighlightText } from "./HighlightText";
|
|
23
24
|
export { default as IconButton } from "./IconButton";
|
|
24
25
|
export { default as Input } from "./Input";
|
|
25
26
|
export { default as InputNumber } from "./InputNumber";
|
|
@@ -27,7 +28,6 @@ export { default as Layout } from "./Layout";
|
|
|
27
28
|
export { default as MemberPicker } from "./MemberPicker";
|
|
28
29
|
export { default as Menu } from "./Menu";
|
|
29
30
|
export { default as Modal } from "./Modal";
|
|
30
|
-
export { default as Navigator } from "./Navigator";
|
|
31
31
|
export { default as Pagination } from "./Pagination";
|
|
32
32
|
export { default as Popconfirm } from "./Popconfirm";
|
|
33
33
|
export { default as Popover } from "./Popover";
|
package/dist/index.less
CHANGED
package/dist/style/index.less
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
@ant-prefix: ant;
|
|
9
9
|
|
|
10
10
|
body {
|
|
11
|
-
font-family: Inter, 'PingFang SC',
|
|
12
|
-
|
|
13
|
-
'
|
|
11
|
+
font-family: Inter, 'PingFang SC', system-ui, -apple-system,
|
|
12
|
+
blinkmacsystemfont, 'Helvetica Neue', 'Segoe UI', helvetica, arial,
|
|
13
|
+
'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
|
|
14
14
|
}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
@import './themeColor.module.less';
|
|
2
2
|
@import './default.less';
|
|
3
3
|
/* stylelint-disable-next-line at-rule-no-unknown */
|
|
4
|
-
@font-family:inter,
|
|
4
|
+
@font-family:inter, 'PingFang SC', system-ui, -apple-system, blinkmacsystemfont,
|
|
5
|
+
'Helvetica Neue', 'Segoe UI', helvetica, arial, 'Microsoft YaHei',
|
|
6
|
+
'WenQuanYi Micro Hei', sans-serif;
|
|
5
7
|
@ald-prefix: ald;
|
|
6
8
|
@error-color: #d64343;
|
|
7
9
|
// large
|
|
@@ -20,7 +22,7 @@
|
|
|
20
22
|
@padding-bottom-middle: 6px;
|
|
21
23
|
@padding-left-middle: 12px;
|
|
22
24
|
@padding-right-middle: 12px;
|
|
23
|
-
@border-radius-middle:
|
|
25
|
+
@border-radius-middle: 6px;
|
|
24
26
|
|
|
25
27
|
// small
|
|
26
28
|
@font-size-small: 12px;
|
|
@@ -29,4 +31,4 @@
|
|
|
29
31
|
@padding-bottom-small: 6px;
|
|
30
32
|
@padding-left-small: 8px;
|
|
31
33
|
@padding-right-small: 8px;
|
|
32
|
-
@border-radius-small:
|
|
34
|
+
@border-radius-small: 4px;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@aloudata/aloudata-design",
|
|
3
|
-
"version": "2.0.0
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -60,6 +60,7 @@
|
|
|
60
60
|
"ahooks": "^3.7.8",
|
|
61
61
|
"antd": "5.4.3",
|
|
62
62
|
"compare-func": "^2.0.0",
|
|
63
|
+
"immer": "^10.0.3",
|
|
63
64
|
"memoize-one": "^6.0.0",
|
|
64
65
|
"rc-menu": "^9.8.0",
|
|
65
66
|
"umi-request": "^1.4.0",
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
function Header(props) {
|
|
3
|
-
var logoSrc = props.logoSrc;
|
|
4
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
5
|
-
className: "ald-nav-header"
|
|
6
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
7
|
-
className: "ald-nav-header-content"
|
|
8
|
-
}, /*#__PURE__*/React.createElement("img", {
|
|
9
|
-
src: logoSrc,
|
|
10
|
-
alt: "",
|
|
11
|
-
className: "ald-nav-logo-img"
|
|
12
|
-
})), /*#__PURE__*/React.createElement("div", {
|
|
13
|
-
className: "ald-nav-header-select"
|
|
14
|
-
}));
|
|
15
|
-
}
|
|
16
|
-
export default Header;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IMenuItem } from '../MenuItem';
|
|
3
|
-
export type { IMenuItem } from '../MenuItem';
|
|
4
|
-
interface IMenuProps {
|
|
5
|
-
menuList: IMenuItem[];
|
|
6
|
-
selectedKey: string;
|
|
7
|
-
onMenuSelect?: (menuInfo: {
|
|
8
|
-
key: string;
|
|
9
|
-
path: string;
|
|
10
|
-
}) => void;
|
|
11
|
-
}
|
|
12
|
-
declare function Menu(props: IMenuProps): React.JSX.Element;
|
|
13
|
-
export default Menu;
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
3
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
5
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
6
|
-
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
7
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
8
|
-
import React, { useState, useEffect, useCallback } from 'react';
|
|
9
|
-
import MenuItem from "../MenuItem";
|
|
10
|
-
function Menu(props) {
|
|
11
|
-
var menuList = props.menuList,
|
|
12
|
-
selectedKey = props.selectedKey,
|
|
13
|
-
_props$onMenuSelect = props.onMenuSelect,
|
|
14
|
-
onMenuSelectCallback = _props$onMenuSelect === void 0 ? function () {} : _props$onMenuSelect;
|
|
15
|
-
var _useState = useState(selectedKey),
|
|
16
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
17
|
-
currentSelectKey = _useState2[0],
|
|
18
|
-
setCurrentSelectKey = _useState2[1];
|
|
19
|
-
var onMenuSelect = useCallback(function (menuInfo) {
|
|
20
|
-
setCurrentSelectKey(menuInfo.key);
|
|
21
|
-
onMenuSelectCallback(menuInfo);
|
|
22
|
-
}, [onMenuSelectCallback]);
|
|
23
|
-
useEffect(function () {
|
|
24
|
-
setCurrentSelectKey(selectedKey);
|
|
25
|
-
}, [selectedKey]);
|
|
26
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, Array.isArray(menuList) && menuList.map(function (item, index) {
|
|
27
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
28
|
-
className: "ald-nav-group",
|
|
29
|
-
key: "".concat(String(index), "_key")
|
|
30
|
-
}, item.groupTitle && /*#__PURE__*/React.createElement("div", {
|
|
31
|
-
className: "ald-nav-group-title"
|
|
32
|
-
}, item.groupTitle), item.children.map(function (data) {
|
|
33
|
-
return /*#__PURE__*/React.createElement(MenuItem, _extends({}, data, {
|
|
34
|
-
key: data.key,
|
|
35
|
-
menuItemKey: data.key,
|
|
36
|
-
selectedKey: currentSelectKey,
|
|
37
|
-
onMenuSelect: onMenuSelect
|
|
38
|
-
}));
|
|
39
|
-
}));
|
|
40
|
-
}));
|
|
41
|
-
}
|
|
42
|
-
export default Menu;
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
export interface ISelectedMenuInfo {
|
|
3
|
-
key: string;
|
|
4
|
-
path: string;
|
|
5
|
-
}
|
|
6
|
-
export interface IMenuItem {
|
|
7
|
-
groupTitle: string | null;
|
|
8
|
-
children: IMenuItemContentProps[];
|
|
9
|
-
}
|
|
10
|
-
export interface IMenuItemContentProps {
|
|
11
|
-
menuIcon: React.ReactNode;
|
|
12
|
-
content: string | React.ReactNode;
|
|
13
|
-
key: string;
|
|
14
|
-
path: string;
|
|
15
|
-
}
|
|
16
|
-
declare function MenuItem(data: IMenuItemContentProps & {
|
|
17
|
-
selectedKey: string;
|
|
18
|
-
menuItemKey: string;
|
|
19
|
-
onMenuSelect?: (menuInfo: ISelectedMenuInfo) => void;
|
|
20
|
-
}): React.JSX.Element;
|
|
21
|
-
export default MenuItem;
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import React, { useCallback } from 'react';
|
|
2
|
-
import classNames from 'classnames';
|
|
3
|
-
function MenuItem(data) {
|
|
4
|
-
var menuIcon = data.menuIcon,
|
|
5
|
-
content = data.content,
|
|
6
|
-
menuItemKey = data.menuItemKey,
|
|
7
|
-
path = data.path,
|
|
8
|
-
selectedKey = data.selectedKey,
|
|
9
|
-
_data$onMenuSelect = data.onMenuSelect,
|
|
10
|
-
onMenuSelect = _data$onMenuSelect === void 0 ? function () {} : _data$onMenuSelect;
|
|
11
|
-
var onMenuItemClick = useCallback(function (menuInfo) {
|
|
12
|
-
if (menuInfo.key === selectedKey) {
|
|
13
|
-
return;
|
|
14
|
-
}
|
|
15
|
-
onMenuSelect(menuInfo);
|
|
16
|
-
}, [onMenuSelect, selectedKey]);
|
|
17
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
18
|
-
className: classNames('ald-nav-menu-item', {
|
|
19
|
-
'ald-nav-menu-item-selected': menuItemKey === selectedKey
|
|
20
|
-
}),
|
|
21
|
-
key: menuItemKey,
|
|
22
|
-
onClick: function onClick() {
|
|
23
|
-
return onMenuItemClick({
|
|
24
|
-
path: path,
|
|
25
|
-
key: menuItemKey
|
|
26
|
-
});
|
|
27
|
-
}
|
|
28
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
29
|
-
className: "ald-nav-menu-item-icon"
|
|
30
|
-
}, menuIcon), /*#__PURE__*/React.createElement("div", {
|
|
31
|
-
className: "ald-nav-menu-item-content"
|
|
32
|
-
}, typeof content === 'string' ? /*#__PURE__*/React.createElement("div", {
|
|
33
|
-
className: "ald-nav-menu-item-content-text"
|
|
34
|
-
}, content) : content));
|
|
35
|
-
}
|
|
36
|
-
export default MenuItem;
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { IMenuItem } from './components/Menu';
|
|
3
|
-
declare function Navigator(props: INavigatorProps): React.JSX.Element;
|
|
4
|
-
export interface INavigatorProps {
|
|
5
|
-
/**
|
|
6
|
-
* @description 应用logo
|
|
7
|
-
* @type {string}
|
|
8
|
-
* @default []
|
|
9
|
-
*/
|
|
10
|
-
logoSrc: string;
|
|
11
|
-
/**
|
|
12
|
-
* @description 当前选中的应用
|
|
13
|
-
* @type {string}
|
|
14
|
-
* @default --
|
|
15
|
-
*/
|
|
16
|
-
/**
|
|
17
|
-
* @description 应用切换时调用
|
|
18
|
-
* @type {(appId: string) => void}
|
|
19
|
-
* @default --
|
|
20
|
-
*/
|
|
21
|
-
/**
|
|
22
|
-
* @description 菜单数据
|
|
23
|
-
* @default []
|
|
24
|
-
*/
|
|
25
|
-
menuList: IMenuItem[];
|
|
26
|
-
/**
|
|
27
|
-
* @description 当前选中的菜单项
|
|
28
|
-
* @default --
|
|
29
|
-
*/
|
|
30
|
-
selectedKey: string;
|
|
31
|
-
/**
|
|
32
|
-
* @description logo的点击(可选)
|
|
33
|
-
* @default --
|
|
34
|
-
*/
|
|
35
|
-
/**
|
|
36
|
-
* @description 导航底部信息 可自定义
|
|
37
|
-
* @default null
|
|
38
|
-
*/
|
|
39
|
-
footer?: React.ReactNode;
|
|
40
|
-
/**
|
|
41
|
-
* @description 菜单被选中时调用(可选)
|
|
42
|
-
* @default --
|
|
43
|
-
*/
|
|
44
|
-
onMenuSelect?: (menuInfo: {
|
|
45
|
-
key: string;
|
|
46
|
-
path: string;
|
|
47
|
-
}) => void;
|
|
48
|
-
}
|
|
49
|
-
export type { IMenuItem } from './components/Menu';
|
|
50
|
-
export type { ISelectedMenuInfo, IMenuItemContentProps } from './components/MenuItem';
|
|
51
|
-
export default Navigator;
|
package/dist/Navigator/index.js
DELETED
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import React, { useCallback } from 'react';
|
|
2
|
-
import classNames from 'classnames';
|
|
3
|
-
import Menu from "./components/Menu";
|
|
4
|
-
import Header from "./components/Header";
|
|
5
|
-
function Navigator(props) {
|
|
6
|
-
var logoSrc = props.logoSrc,
|
|
7
|
-
menuList = props.menuList,
|
|
8
|
-
selectedKey = props.selectedKey,
|
|
9
|
-
_props$footer = props.footer,
|
|
10
|
-
footer = _props$footer === void 0 ? null : _props$footer,
|
|
11
|
-
onMenuSelect = props.onMenuSelect;
|
|
12
|
-
var renderMenu = useCallback(function () {
|
|
13
|
-
return /*#__PURE__*/React.createElement(Menu, {
|
|
14
|
-
menuList: menuList,
|
|
15
|
-
selectedKey: selectedKey,
|
|
16
|
-
onMenuSelect: onMenuSelect
|
|
17
|
-
});
|
|
18
|
-
}, [selectedKey, menuList, onMenuSelect]);
|
|
19
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
20
|
-
className: classNames('ald-nav')
|
|
21
|
-
}, /*#__PURE__*/React.createElement(Header, {
|
|
22
|
-
logoSrc: logoSrc
|
|
23
|
-
}), /*#__PURE__*/React.createElement("div", {
|
|
24
|
-
className: classNames('ald-nav-menu', {
|
|
25
|
-
'ald-nav-menu-has-footer': !!footer
|
|
26
|
-
})
|
|
27
|
-
}, renderMenu()), footer && /*#__PURE__*/React.createElement("div", {
|
|
28
|
-
className: "ald-nav-footer"
|
|
29
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
30
|
-
className: "ald-nav-footer-wrap"
|
|
31
|
-
}, footer)));
|
|
32
|
-
}
|
|
33
|
-
export default Navigator;
|
|
Binary file
|
|
@@ -1,159 +0,0 @@
|
|
|
1
|
-
@import '../../style/index.less';
|
|
2
|
-
@import '../../Icon/index.less';
|
|
3
|
-
|
|
4
|
-
@ald-prefix: ald;
|
|
5
|
-
@header-height: 80px;
|
|
6
|
-
@footer-height: 88px;
|
|
7
|
-
|
|
8
|
-
.ald-nav {
|
|
9
|
-
display: flex;
|
|
10
|
-
flex-direction: column;
|
|
11
|
-
width: 240px;
|
|
12
|
-
height: 100%;
|
|
13
|
-
overflow: hidden;
|
|
14
|
-
color: @ND0;
|
|
15
|
-
background-image: url('./bg.png');
|
|
16
|
-
background-repeat: no-repeat;
|
|
17
|
-
background-size: cover;
|
|
18
|
-
user-select: none;
|
|
19
|
-
|
|
20
|
-
&-header {
|
|
21
|
-
display: flex;
|
|
22
|
-
align-items: center;
|
|
23
|
-
height: @header-height;
|
|
24
|
-
padding: 0 24px;
|
|
25
|
-
background: @B20;
|
|
26
|
-
|
|
27
|
-
&-content {
|
|
28
|
-
display: flex;
|
|
29
|
-
width: 154px;
|
|
30
|
-
height: 40px;
|
|
31
|
-
|
|
32
|
-
.ald-nav-logo-img {
|
|
33
|
-
width: 100%;
|
|
34
|
-
height: 100%;
|
|
35
|
-
object-fit: fill;
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
&-select {
|
|
40
|
-
display: none;
|
|
41
|
-
width: 24px;
|
|
42
|
-
height: 24px;
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
&-menu {
|
|
47
|
-
flex: 1;
|
|
48
|
-
padding: 24px 12px;
|
|
49
|
-
overflow-x: hidden;
|
|
50
|
-
overflow-y: auto;
|
|
51
|
-
|
|
52
|
-
&::-webkit-scrollbar-thumb {
|
|
53
|
-
background: @ND90;
|
|
54
|
-
background-clip: padding-box;
|
|
55
|
-
border: 3px solid transparent;
|
|
56
|
-
border-radius: 6px;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
&::-webkit-scrollbar {
|
|
60
|
-
width: 12px;
|
|
61
|
-
height: 12px;
|
|
62
|
-
background-color: transparent;
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
.ald-nav-group {
|
|
66
|
-
&-title {
|
|
67
|
-
height: 48px;
|
|
68
|
-
margin-top: 12px;
|
|
69
|
-
padding: 0 12px;
|
|
70
|
-
.textStyle(@BG60, 14px, 48px, 400, normal);
|
|
71
|
-
}
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
.ald-nav-menu-item {
|
|
75
|
-
position: relative;
|
|
76
|
-
display: flex;
|
|
77
|
-
align-items: center;
|
|
78
|
-
height: 48px;
|
|
79
|
-
margin-bottom: 4px;
|
|
80
|
-
padding: 0 12px;
|
|
81
|
-
line-height: 48px;
|
|
82
|
-
border-radius: 8px;
|
|
83
|
-
|
|
84
|
-
&::before {
|
|
85
|
-
position: absolute;
|
|
86
|
-
top: 0;
|
|
87
|
-
left: 0;
|
|
88
|
-
display: block;
|
|
89
|
-
width: 0%;
|
|
90
|
-
height: inherit;
|
|
91
|
-
background: @ND80;
|
|
92
|
-
border-radius: inherit;
|
|
93
|
-
content: '';
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
&-icon {
|
|
97
|
-
position: relative;
|
|
98
|
-
z-index: 1;
|
|
99
|
-
display: flex;
|
|
100
|
-
align-items: center;
|
|
101
|
-
margin-right: 12px;
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
&-content {
|
|
105
|
-
position: relative;
|
|
106
|
-
z-index: 1;
|
|
107
|
-
flex: 1;
|
|
108
|
-
overflow: hidden;
|
|
109
|
-
.textStyle(@B95, 16px, 24px, 400, normal);
|
|
110
|
-
|
|
111
|
-
&-text {
|
|
112
|
-
white-space: nowrap;
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
&:hover {
|
|
117
|
-
background-color: @ND90;
|
|
118
|
-
cursor: pointer;
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
&.ald-nav-menu-item-selected {
|
|
122
|
-
.ald-nav-menu-item-content {
|
|
123
|
-
.textStyle(@ND0, 16px, 24px, 400, normal);
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
&::before {
|
|
127
|
-
animation: 0.26s linear 0s hover-bg-change;
|
|
128
|
-
animation-fill-mode: forwards;
|
|
129
|
-
}
|
|
130
|
-
}
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
&-footer {
|
|
135
|
-
height: 88px;
|
|
136
|
-
|
|
137
|
-
&-wrap {
|
|
138
|
-
height: 100%;
|
|
139
|
-
color: @ND0;
|
|
140
|
-
}
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
@keyframes hover-bg-change {
|
|
145
|
-
0% {
|
|
146
|
-
width: 0%;
|
|
147
|
-
background-color: @ND80;
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
90% {
|
|
151
|
-
width: 100%;
|
|
152
|
-
background-color: @ND80;
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
100% {
|
|
156
|
-
width: 100%;
|
|
157
|
-
background-color: @B40;
|
|
158
|
-
}
|
|
159
|
-
}
|
|
File without changes
|
|
File without changes
|