tntd 1.4.18 → 1.4.20
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/components/Ellipsis/index.js +1 -1
- package/components/Layout/Avatar.js +4 -4
- package/components/Layout/EnterpriseLayout/Avatar.js +10 -7
- package/components/Layout/EnterpriseLayout/Language.js +5 -3
- package/components/Layout/EnterpriseLayout/Theme.js +6 -7
- package/components/Layout/EnterpriseLayout/index.js +1 -1
- package/components/Layout/HeaderActions.js +13 -10
- package/components/Layout/HeaderTabs.js +13 -14
- package/components/Layout/Layout.js +2 -0
- package/components/Layout/index.js +2 -1
- package/components/Layout/storage.js +12 -2
- package/components/Page/index.js +2 -2
- package/components/locale.js +7 -2
- package/dist/1.tntd.js +1 -12
- package/dist/stats.json +28426 -28000
- package/dist/tntd.css +1 -1
- package/dist/tntd.js +13 -7
- package/es/ArrayInput/icon.js +5 -5
- package/es/ArrayInput/index.js +76 -108
- package/es/AuthContext.js +1 -1
- package/es/Columns/index.js +31 -38
- package/es/DevelopmentLogin/LoginModal.js +32 -45
- package/es/DevelopmentLogin/index.js +13 -17
- package/es/Ellipsis/Svg/CopySVG.js +13 -13
- package/es/Ellipsis/Svg/TickSVG.js +8 -8
- package/es/Ellipsis/index.js +59 -70
- package/es/Handle/index.js +25 -35
- package/es/Icon/fonts/iconfont.js +7 -12
- package/es/Icon/index.js +10 -13
- package/es/Img/Contain.js +24 -29
- package/es/Img/Cover.js +40 -54
- package/es/Img/index.js +36 -45
- package/es/Layout/ActionsContext.js +3 -2
- package/es/Layout/AppList.js +37 -92
- package/es/Layout/Application.js +26 -72
- package/es/Layout/Avatar.js +32 -69
- package/es/Layout/CompatibleLanguage.js +39 -94
- package/es/Layout/EnterpriseLayout/Avatar.js +49 -79
- package/es/Layout/EnterpriseLayout/Language.js +19 -34
- package/es/Layout/EnterpriseLayout/Theme.js +23 -37
- package/es/Layout/EnterpriseLayout/index.js +14 -16
- package/es/Layout/GlobalNavigation/NavigationPopup.js +59 -170
- package/es/Layout/GlobalNavigation/index.js +20 -54
- package/es/Layout/Header.js +25 -46
- package/es/Layout/HeaderActions.js +52 -63
- package/es/Layout/HeaderNavs.js +20 -47
- package/es/Layout/HeaderTabs.js +61 -115
- package/es/Layout/Iconfont.js +1 -1
- package/es/Layout/Language.js +14 -32
- package/es/Layout/Layout.js +88 -108
- package/es/Layout/Logo.js +16 -32
- package/es/Layout/OrgAppList.js +62 -107
- package/es/Layout/SideMenu.js +63 -124
- package/es/Layout/Theme.js +23 -61
- package/es/Layout/index.js +29 -36
- package/es/Layout/paaslayout/CompactSideMenu.js +35 -74
- package/es/Layout/paaslayout/Header.js +22 -45
- package/es/Layout/paaslayout/Logo.js +3 -13
- package/es/Layout/paaslayout/SideMenu.js +39 -78
- package/es/Layout/paaslayout/index.js +75 -102
- package/es/Layout/storage.js +26 -9
- package/es/LoadingButton/index.js +15 -24
- package/es/Modal/index.js +38 -46
- package/es/Page/Box.js +34 -41
- package/es/Page/index.js +54 -68
- package/es/Page/utils.js +0 -5
- package/es/QueryForm/Field/Checkbox.js +5 -9
- package/es/QueryForm/Field/Select.js +31 -41
- package/es/QueryForm/Field/SelectInput.js +26 -41
- package/es/QueryForm/Field/fieldsMap.js +0 -1
- package/es/QueryForm/Field/index.js +41 -71
- package/es/QueryForm/createActions.js +6 -7
- package/es/QueryForm/index.js +76 -135
- package/es/QueryListScene/List.js +74 -128
- package/es/QueryListScene/QueryForm.js +46 -81
- package/es/QueryListScene/QueryListScene.js +25 -40
- package/es/QueryListScene/Title.js +3 -3
- package/es/QueryListScene/Toolbar.js +11 -12
- package/es/Select/DropDownWrap.js +29 -50
- package/es/Select/index.js +135 -231
- package/es/Table/ResizableTable/index.js +26 -40
- package/es/Table/index.js +18 -16
- package/es/Title/index.js +21 -23
- package/es/locale.js +9 -7
- package/es/utils/checkAuth.js +3 -5
- package/es/utils/findMenuInfoByPath.js +0 -4
- package/es/utils/index.js +12 -23
- package/lib/ArrayInput/icon.js +6 -6
- package/lib/ArrayInput/index.js +78 -127
- package/lib/AuthContext.js +1 -4
- package/lib/Columns/index.js +31 -47
- package/lib/DevelopmentLogin/LoginModal.js +32 -58
- package/lib/DevelopmentLogin/index.js +16 -27
- package/lib/Ellipsis/Svg/CopySVG.js +13 -15
- package/lib/Ellipsis/Svg/TickSVG.js +8 -10
- package/lib/Ellipsis/index.js +58 -81
- package/lib/Handle/index.js +25 -47
- package/lib/Icon/fonts/iconfont.js +7 -12
- package/lib/Icon/index.js +11 -20
- package/lib/Img/Contain.js +24 -34
- package/lib/Img/Cover.js +42 -65
- package/lib/Img/index.js +36 -51
- package/lib/Layout/ActionsContext.js +1 -4
- package/lib/Layout/AppList.js +40 -118
- package/lib/Layout/Application.js +26 -86
- package/lib/Layout/Avatar.js +35 -89
- package/lib/Layout/CompatibleLanguage.js +39 -110
- package/lib/Layout/EnterpriseLayout/Avatar.js +52 -101
- package/lib/Layout/EnterpriseLayout/Language.js +21 -49
- package/lib/Layout/EnterpriseLayout/Theme.js +22 -46
- package/lib/Layout/EnterpriseLayout/index.js +14 -23
- package/lib/Layout/GlobalNavigation/NavigationPopup.js +59 -186
- package/lib/Layout/GlobalNavigation/index.js +23 -74
- package/lib/Layout/Header.js +28 -63
- package/lib/Layout/HeaderActions.js +48 -74
- package/lib/Layout/HeaderNavs.js +23 -61
- package/lib/Layout/HeaderTabs.js +58 -126
- package/lib/Layout/Iconfont.js +1 -5
- package/lib/Layout/Language.js +17 -48
- package/lib/Layout/Layout.js +90 -128
- package/lib/Layout/Logo.js +19 -43
- package/lib/Layout/OrgAppList.js +64 -127
- package/lib/Layout/SideMenu.js +65 -143
- package/lib/Layout/Theme.js +23 -73
- package/lib/Layout/createActions.js +0 -5
- package/lib/Layout/images/index.js +0 -28
- package/lib/Layout/index.js +33 -57
- package/lib/Layout/paaslayout/CompactSideMenu.js +35 -84
- package/lib/Layout/paaslayout/Header.js +22 -55
- package/lib/Layout/paaslayout/Logo.js +3 -19
- package/lib/Layout/paaslayout/SideMenu.js +39 -87
- package/lib/Layout/paaslayout/index.js +77 -122
- package/lib/Layout/storage.js +29 -35
- package/lib/LoadingButton/index.js +15 -29
- package/lib/Modal/index.js +38 -53
- package/lib/Page/Box.js +34 -45
- package/lib/Page/index.js +54 -78
- package/lib/Page/utils.js +1 -9
- package/lib/QueryForm/Field/Checkbox.js +5 -13
- package/lib/QueryForm/Field/Select.js +33 -53
- package/lib/QueryForm/Field/SelectInput.js +28 -56
- package/lib/QueryForm/Field/fieldsMap.js +1 -15
- package/lib/QueryForm/Field/index.js +43 -81
- package/lib/QueryForm/createActions.js +6 -12
- package/lib/QueryForm/index.js +78 -157
- package/lib/QueryForm/useForm.js +0 -5
- package/lib/QueryListScene/List.js +76 -140
- package/lib/QueryListScene/QueryForm.js +46 -86
- package/lib/QueryListScene/QueryListScene.js +25 -46
- package/lib/QueryListScene/Title.js +3 -7
- package/lib/QueryListScene/Toolbar.js +11 -16
- package/lib/QueryListScene/createActions.js +0 -5
- package/lib/QueryListScene/index.js +0 -10
- package/lib/QueryListScene/useActions.js +0 -5
- package/lib/Select/DropDownWrap.js +31 -56
- package/lib/Select/index.js +135 -241
- package/lib/Table/ResizableTable/index.js +26 -48
- package/lib/Table/index.js +17 -28
- package/lib/Title/index.js +21 -28
- package/lib/index.js +35 -56
- package/lib/locale.js +11 -12
- package/lib/utils/checkAuth.js +4 -9
- package/lib/utils/findMenuInfoByPath.js +1 -8
- package/lib/utils/index.js +15 -42
- package/package.json +2 -2
- package/es/Layout/checkAuth.js +0 -29
- package/es/Layout/utils.js +0 -136
- package/lib/Layout/EnterpriseLayout/Header.js +0 -113
- package/lib/Layout/EnterpriseLayout/HeaderActions.js +0 -104
- package/lib/Layout/checkAuth.js +0 -39
- package/lib/Layout/utils.js +0 -166
package/es/Layout/HeaderTabs.js
CHANGED
|
@@ -1,62 +1,30 @@
|
|
|
1
|
-
function
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
function
|
|
6
|
-
|
|
7
|
-
function
|
|
8
|
-
|
|
9
|
-
function
|
|
10
|
-
|
|
1
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
2
|
+
var _excluded = ["theme", "className", "tabs", "onTabChange", "onTabSelect", "onTabClose", "appListVisible", "orgListVisible", "orgAppListVisible", "language"];
|
|
3
|
+
var _templateObject, _templateObject2, _templateObject3;
|
|
4
|
+
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); }
|
|
5
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
6
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
7
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
8
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
9
|
+
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."); }
|
|
10
|
+
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); }
|
|
11
|
+
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; }
|
|
12
|
+
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; } }
|
|
11
13
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
12
|
-
|
|
13
14
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
14
|
-
|
|
15
15
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
16
|
-
|
|
17
|
-
function _templateObject3() {
|
|
18
|
-
var data = _taggedTemplateLiteral(["\n position: relative;\n margin: 0;\n padding: 0 20px 0 10px;\n cursor: pointer;\n display: inline-block;\n line-height: ", ";\n /* transition: background-color .5; */\n width: 130px;\n color: rgba(255,255,255,.6);\n\n .tnt-icon[type=close] {\n display: none;\n position: absolute;\n right: 0;\n top: 0;\n font-size: 10px;\n padding: 0 10px;\n cursor: pointer;\n z-index: 1;\n }\n\n &:not(:last-child):after {\n position: absolute;\n content: \"\";\n right: 0;\n top: 6px;\n height: 24px;\n width: 1px;\n // opacity: .5;\n // background: #fff;\n background: #E1E6EE;\n opacity: .5;\n // .tnt-themeS1 & {\n // background: #E1E6EE;\n // opacity: 1;\n // }\n }\n\n &.active,\n &.activeTabPreSibling {\n &:after {\n display: none;\n }\n }\n\n a {\n font-size: 14px;\n color: ", ";//rgba(255,255,255,.6);\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n transition: none;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: inline-block;\n line-height: 36px;\n width: 100%;\n // &:hover {\n // color: rgba(255,255,255,.8);\n // }\n // .tnt-themeS1 & {\n // color: ", ";\n // }\n }\n\n &:hover,\n &.active {\n .tnt-icon[type=close] {\n display: unset;\n color: #455064;\n // .tnt-themeS1 & {\n // color: #455064;\n // }\n }\n }\n\n &.active {\n background: #F1F2F5;\n border-radius: 2px 2px 0 0;\n color: ", ";\n font-weight: 600;\n\n a {\n color: ", ";\n }\n }\n"]);
|
|
19
|
-
|
|
20
|
-
_templateObject3 = function _templateObject3() {
|
|
21
|
-
return data;
|
|
22
|
-
};
|
|
23
|
-
|
|
24
|
-
return data;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
function _templateObject2() {
|
|
28
|
-
var data = _taggedTemplateLiteral(["\n margin: 14px 0 0;\n padding: 0;\n list-style: none;\n text-align: left;\n height: 36px;\n line-height: 36px;\n flex: 1;\n white-space: nowrap;\n padding-right: 40px;\n transition: transform 0.25s linear;\n position: absolute;\n"]);
|
|
29
|
-
|
|
30
|
-
_templateObject2 = function _templateObject2() {
|
|
31
|
-
return data;
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
return data;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
function _templateObject() {
|
|
38
|
-
var data = _taggedTemplateLiteral(["\n display: flex;\n flex: 1;\n overflow: hidden;\n position: relative;\n margin-right: 12px;\n margin-left: 4px;\n\n .tnt-layout-header-tabs-arrows {\n position: absolute;\n right: 0;\n bottom: 0;\n font-size: 16px;\n line-height: 36px;\n height: 36px;\n background: #fff !important;\n color: rgba(255,255,255,.8) !important;\n .tnt-icon {\n cursor: pointer;\n color: rgba(139,145,158,1);\n &[disabled] {\n color: rgba(139, 145, 158, .5);\n pointer-events: none;\n cursor: not-allowed;\n }\n }\n // background: #191D29;\n // .tnt-icon {\n // cursor: pointer;\n // &[disabled] {\n // color: rgba(139, 145, 158, .5);\n // pointer-events: none;\n // cursor: not-allowed;\n // }\n // }\n // .tnt-themeS1 & {\n // background: #fff;\n // .tnt-icon {\n // color: rgba(139,145,158,1);\n // }\n // }\n // \u591A\u7B7E\u9875\u7684\u7BAD\u5934\u6837\u5F0F\n // .tnt-themeS3 & {\n // background: ", "; //#1D4295;\n // .tnt-icon {\n // color: rgba(255, 255, 255, .5);\n // &[disabled] {\n // color: rgba(139, 145, 158, .5);\n // pointer-events: none;\n // cursor: not-allowed;\n // }\n // }\n // }\n }\n"]);
|
|
39
|
-
|
|
40
|
-
_templateObject = function _templateObject() {
|
|
41
|
-
return data;
|
|
42
|
-
};
|
|
43
|
-
|
|
44
|
-
return data;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
16
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
48
|
-
|
|
49
|
-
import
|
|
50
|
-
import
|
|
51
|
-
import
|
|
52
|
-
import
|
|
53
|
-
|
|
54
|
-
var TabsContainer = styled.div(_templateObject(), function (props) {
|
|
17
|
+
import { useState, useEffect, useRef } from 'react';
|
|
18
|
+
import styled, { withTheme } from 'styled-components';
|
|
19
|
+
import cn from 'classnames';
|
|
20
|
+
import { get } from 'lodash';
|
|
21
|
+
import Icon from '../Icon';
|
|
22
|
+
var TabsContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex: 1;\n overflow: hidden;\n position: relative;\n margin-right: 12px;\n margin-left: 4px;\n\n .tnt-layout-header-tabs-arrows {\n position: absolute;\n right: 0;\n bottom: 0;\n font-size: 16px;\n line-height: 36px;\n height: 36px;\n background: #fff !important;\n color: rgba(255,255,255,.8) !important;\n .tnt-icon {\n cursor: pointer;\n color: rgba(139,145,158,1);\n &[disabled] {\n color: rgba(139, 145, 158, .5);\n pointer-events: none;\n cursor: not-allowed;\n }\n }\n // background: #191D29;\n // .tnt-icon {\n // cursor: pointer;\n // &[disabled] {\n // color: rgba(139, 145, 158, .5);\n // pointer-events: none;\n // cursor: not-allowed;\n // }\n // }\n // .tnt-themeS1 & {\n // background: #fff;\n // .tnt-icon {\n // color: rgba(139,145,158,1);\n // }\n // }\n // \u591A\u7B7E\u9875\u7684\u7BAD\u5934\u6837\u5F0F\n // .tnt-themeS3 & {\n // background: ", "; //#1D4295;\n // .tnt-icon {\n // color: rgba(255, 255, 255, .5);\n // &[disabled] {\n // color: rgba(139, 145, 158, .5);\n // pointer-events: none;\n // cursor: not-allowed;\n // }\n // }\n // }\n }\n"])), function (props) {
|
|
55
23
|
return "".concat(props.theme.blueBgColor);
|
|
56
24
|
});
|
|
57
|
-
var Tabs = styled.ul(_templateObject2());
|
|
58
|
-
var TabItem = styled.li(_templateObject3(), function (props) {
|
|
59
|
-
return props.theme.size ===
|
|
25
|
+
var Tabs = styled.ul(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n margin: 14px 0 0;\n padding: 0;\n list-style: none;\n text-align: left;\n height: 36px;\n line-height: 36px;\n flex: 1;\n white-space: nowrap;\n padding-right: 40px;\n transition: transform 0.25s linear;\n position: absolute;\n"])));
|
|
26
|
+
var TabItem = styled.li(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n position: relative;\n margin: 0;\n padding: 0 20px 0 10px;\n cursor: pointer;\n display: inline-block;\n line-height: ", ";\n /* transition: background-color .5; */\n width: 130px;\n color: rgba(255,255,255,.6);\n\n .tnt-icon[type=close] {\n display: none;\n position: absolute;\n right: 0;\n top: 0;\n font-size: 10px;\n padding: 0 10px;\n cursor: pointer;\n z-index: 1;\n }\n\n &:not(:last-child):after {\n position: absolute;\n content: \"\";\n right: 0;\n top: 6px;\n height: 24px;\n width: 1px;\n // opacity: .5;\n // background: #fff;\n background: #E1E6EE;\n opacity: .5;\n // .tnt-themeS1 & {\n // background: #E1E6EE;\n // opacity: 1;\n // }\n }\n\n &.active,\n &.activeTabPreSibling {\n &:after {\n display: none;\n }\n }\n\n a {\n font-size: 14px;\n color: ", ";//rgba(255,255,255,.6);\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n transition: none;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: inline-block;\n line-height: 36px;\n width: 100%;\n // &:hover {\n // color: rgba(255,255,255,.8);\n // }\n // .tnt-themeS1 & {\n // color: ", ";\n // }\n }\n\n &:hover,\n &.active {\n .tnt-icon[type=close] {\n display: unset;\n color: #455064;\n // .tnt-themeS1 & {\n // color: #455064;\n // }\n }\n }\n\n &.active {\n background: #F1F2F5;\n border-radius: 2px 2px 0 0;\n color: ", ";\n font-weight: 600;\n\n a {\n color: ", ";\n }\n }\n"])), function (props) {
|
|
27
|
+
return props.theme.size === 'large' ? '46px' : '36px';
|
|
60
28
|
}, function (props) {
|
|
61
29
|
return props.theme.headerActionsColor;
|
|
62
30
|
}, function (props) {
|
|
@@ -68,56 +36,47 @@ var TabItem = styled.li(_templateObject3(), function (props) {
|
|
|
68
36
|
});
|
|
69
37
|
export var HeaderTabs = withTheme(function (_ref) {
|
|
70
38
|
var theme = _ref.theme,
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
setSelectedKey = _useState2[1];
|
|
87
|
-
|
|
39
|
+
className = _ref.className,
|
|
40
|
+
_ref$tabs = _ref.tabs,
|
|
41
|
+
tabs = _ref$tabs === void 0 ? [] : _ref$tabs,
|
|
42
|
+
onTabChange = _ref.onTabChange,
|
|
43
|
+
onTabSelect = _ref.onTabSelect,
|
|
44
|
+
onTabClose = _ref.onTabClose,
|
|
45
|
+
appListVisible = _ref.appListVisible,
|
|
46
|
+
orgListVisible = _ref.orgListVisible,
|
|
47
|
+
orgAppListVisible = _ref.orgAppListVisible,
|
|
48
|
+
language = _ref.language,
|
|
49
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
50
|
+
var _useState = useState(props.selectedKey || get(tabs, '0.key')),
|
|
51
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
52
|
+
selectedKey = _useState2[0],
|
|
53
|
+
setSelectedKey = _useState2[1];
|
|
88
54
|
var _useState3 = useState(tabs || []),
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
55
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
56
|
+
tabItems = _useState4[0],
|
|
57
|
+
setTabItems = _useState4[1];
|
|
93
58
|
var _useState5 = useState(false),
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
59
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
60
|
+
arrowVisible = _useState6[0],
|
|
61
|
+
setArrowVisible = _useState6[1];
|
|
98
62
|
var _useState7 = useState({
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
63
|
+
start: true,
|
|
64
|
+
end: true
|
|
65
|
+
}),
|
|
66
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
67
|
+
tabsPositionFlags = _useState8[0],
|
|
68
|
+
setTabsPositionFlags = _useState8[1];
|
|
106
69
|
var tabsRef = useRef();
|
|
107
|
-
|
|
108
70
|
var getTabsDom = function getTabsDom() {
|
|
109
71
|
return tabsRef.current;
|
|
110
72
|
};
|
|
111
|
-
|
|
112
73
|
var onTabClick = function onTabClick(tab, index) {
|
|
113
74
|
setSelectedKey(tab.key);
|
|
114
75
|
onTabSelect == null ? void 0 : onTabSelect(tab);
|
|
115
|
-
|
|
116
76
|
if (selectedKey !== tab.key) {
|
|
117
77
|
onTabChange == null ? void 0 : onTabChange(tab);
|
|
118
78
|
}
|
|
119
79
|
};
|
|
120
|
-
|
|
121
80
|
var closeTabHandle = function closeTabHandle(tab, index, evt) {
|
|
122
81
|
evt.stopPropagation();
|
|
123
82
|
var newTabItems = tabItems.filter(function (_ref2) {
|
|
@@ -126,25 +85,21 @@ export var HeaderTabs = withTheme(function (_ref) {
|
|
|
126
85
|
});
|
|
127
86
|
var newSelectedKey = selectedKey;
|
|
128
87
|
setTabItems(newTabItems);
|
|
129
|
-
|
|
130
88
|
if (tab.key === selectedKey) {
|
|
131
89
|
var _newTabItems$, _newTabItems;
|
|
132
|
-
|
|
133
90
|
newSelectedKey = index === 0 ? (_newTabItems$ = newTabItems[0]) == null ? void 0 : _newTabItems$.key : (_newTabItems = newTabItems[index - 1]) == null ? void 0 : _newTabItems.key;
|
|
134
91
|
setSelectedKey(newSelectedKey);
|
|
135
92
|
}
|
|
136
|
-
|
|
137
93
|
onTabClose == null ? void 0 : onTabClose(tab, newTabItems, newTabItems.find(function (_ref3) {
|
|
138
94
|
var key = _ref3.key;
|
|
139
95
|
return key === newSelectedKey;
|
|
140
96
|
}));
|
|
141
97
|
};
|
|
142
|
-
|
|
143
98
|
var onMoveToLeft = function onMoveToLeft() {
|
|
144
99
|
var tabsDom = getTabsDom();
|
|
145
100
|
var parentBBox = tabsDom.parentNode.getBoundingClientRect();
|
|
146
101
|
var parentWidth = parentBBox.width - 32;
|
|
147
|
-
var x = Math.abs(+tabsDom.style.transform.replace(/[^\d.-]/g,
|
|
102
|
+
var x = Math.abs(+tabsDom.style.transform.replace(/[^\d.-]/g, ''));
|
|
148
103
|
var index = Math.ceil(x / 130);
|
|
149
104
|
var trueX = index * 130;
|
|
150
105
|
var newX = Math.min(0, -(trueX - parentWidth));
|
|
@@ -155,13 +110,12 @@ export var HeaderTabs = withTheme(function (_ref) {
|
|
|
155
110
|
end: Math.abs(newX) < width - parentWidth
|
|
156
111
|
});
|
|
157
112
|
};
|
|
158
|
-
|
|
159
113
|
var onMoveToRight = function onMoveToRight() {
|
|
160
114
|
var tabsDom = getTabsDom();
|
|
161
115
|
var parentBBox = tabsDom.parentNode.getBoundingClientRect();
|
|
162
116
|
var parentWidth = parentBBox.width - 32;
|
|
163
117
|
var width = tabItems.length * 130;
|
|
164
|
-
var x = Math.abs(+tabsDom.style.transform.replace(/[^\d.-]/g,
|
|
118
|
+
var x = Math.abs(+tabsDom.style.transform.replace(/[^\d.-]/g, ''));
|
|
165
119
|
var index = Math.floor(x / 130);
|
|
166
120
|
var trueX = index * 130;
|
|
167
121
|
var newX = Math.max(-(width - parentWidth), -(trueX + parentWidth));
|
|
@@ -171,7 +125,6 @@ export var HeaderTabs = withTheme(function (_ref) {
|
|
|
171
125
|
end: Math.abs(newX) < width - parentWidth
|
|
172
126
|
});
|
|
173
127
|
};
|
|
174
|
-
|
|
175
128
|
var translateTabsDom = function translateTabsDom(tabs, selectedKey) {
|
|
176
129
|
if (!selectedKey) return;
|
|
177
130
|
var index = tabs.indexOf(tabs.find(function (_ref4) {
|
|
@@ -180,7 +133,7 @@ export var HeaderTabs = withTheme(function (_ref) {
|
|
|
180
133
|
}));
|
|
181
134
|
if (index === -1) return;
|
|
182
135
|
var tabsDom = getTabsDom();
|
|
183
|
-
var x = -+tabsDom.style.transform.replace(/[^\d.-]/g,
|
|
136
|
+
var x = -+tabsDom.style.transform.replace(/[^\d.-]/g, '');
|
|
184
137
|
var bbox = {
|
|
185
138
|
left: index * 130,
|
|
186
139
|
right: (index + 1) * 130
|
|
@@ -189,19 +142,15 @@ export var HeaderTabs = withTheme(function (_ref) {
|
|
|
189
142
|
var parentWidth = parentBBox.width - 36;
|
|
190
143
|
var width = tabItems.length * 130;
|
|
191
144
|
var tailX = x + parentWidth; //当前滑动窗口尾部坐标
|
|
192
|
-
|
|
193
145
|
var newX = -x;
|
|
194
|
-
|
|
195
146
|
if (bbox.left < x) {
|
|
196
147
|
newX = -bbox.left;
|
|
197
148
|
} else if (bbox.right >= tailX) {
|
|
198
149
|
newX = parentWidth - bbox.right;
|
|
199
150
|
}
|
|
200
|
-
|
|
201
151
|
if (newX + width < parentWidth) {
|
|
202
152
|
newX = -(width - parentWidth);
|
|
203
153
|
}
|
|
204
|
-
|
|
205
154
|
newX = Math.min(0, newX);
|
|
206
155
|
tabsDom.style.transform = "translateX(".concat(newX, "px)");
|
|
207
156
|
setTabsPositionFlags({
|
|
@@ -209,10 +158,8 @@ export var HeaderTabs = withTheme(function (_ref) {
|
|
|
209
158
|
end: Math.abs(newX) < width - parentWidth
|
|
210
159
|
});
|
|
211
160
|
};
|
|
212
|
-
|
|
213
161
|
useEffect(function () {
|
|
214
|
-
setSelectedKey(props.selectedKey || get(tabs,
|
|
215
|
-
|
|
162
|
+
setSelectedKey(props.selectedKey || get(tabs, '0.key'));
|
|
216
163
|
setTabItems(tabs);
|
|
217
164
|
}, [tabs, props.selectedKey]);
|
|
218
165
|
useEffect(function () {}, [props.orgAppListVisible]);
|
|
@@ -223,15 +170,14 @@ export var HeaderTabs = withTheme(function (_ref) {
|
|
|
223
170
|
useEffect(function () {
|
|
224
171
|
translateTabsDom(tabItems, selectedKey);
|
|
225
172
|
}, [tabItems, selectedKey, appListVisible, orgListVisible, orgAppListVisible]);
|
|
226
|
-
return React.createElement(TabsContainer, _extends({}, props, {
|
|
227
|
-
className: cn(
|
|
228
|
-
}), React.createElement(Tabs, {
|
|
173
|
+
return /*#__PURE__*/React.createElement(TabsContainer, _extends({}, props, {
|
|
174
|
+
className: cn('tnt-layout-header-tabs', _defineProperty({}, className, className))
|
|
175
|
+
}), /*#__PURE__*/React.createElement(Tabs, {
|
|
229
176
|
className: "tnt-layout-header-tabs-content",
|
|
230
177
|
ref: tabsRef
|
|
231
178
|
}, tabItems.map(function (tab, index) {
|
|
232
179
|
var _tabItems;
|
|
233
|
-
|
|
234
|
-
return React.createElement(TabItem, {
|
|
180
|
+
return /*#__PURE__*/React.createElement(TabItem, {
|
|
235
181
|
key: tab.key,
|
|
236
182
|
theme: theme,
|
|
237
183
|
className: cn({
|
|
@@ -241,7 +187,7 @@ export var HeaderTabs = withTheme(function (_ref) {
|
|
|
241
187
|
onClick: function onClick() {
|
|
242
188
|
return onTabClick(tab, index);
|
|
243
189
|
}
|
|
244
|
-
}, React.createElement("a", {
|
|
190
|
+
}, /*#__PURE__*/React.createElement("a", {
|
|
245
191
|
href: tab.key,
|
|
246
192
|
onClick: function onClick(evt) {
|
|
247
193
|
return evt.preventDefault();
|
|
@@ -249,17 +195,17 @@ export var HeaderTabs = withTheme(function (_ref) {
|
|
|
249
195
|
}, {
|
|
250
196
|
cn: tab.name,
|
|
251
197
|
en: tab.enName || tab.name
|
|
252
|
-
}[language ||
|
|
198
|
+
}[language || 'cn']), tab.closable !== false && tabItems.length > 1 && /*#__PURE__*/React.createElement(Icon, {
|
|
253
199
|
type: "close",
|
|
254
200
|
onClick: closeTabHandle.bind(null, tab, index)
|
|
255
201
|
}));
|
|
256
|
-
})), arrowVisible && React.createElement("div", {
|
|
202
|
+
})), arrowVisible && /*#__PURE__*/React.createElement("div", {
|
|
257
203
|
className: "tnt-layout-header-tabs-arrows"
|
|
258
|
-
}, React.createElement(Icon, {
|
|
204
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
259
205
|
type: "left",
|
|
260
206
|
onClick: onMoveToLeft,
|
|
261
207
|
disabled: !tabsPositionFlags.start
|
|
262
|
-
}), React.createElement(Icon, {
|
|
208
|
+
}), /*#__PURE__*/React.createElement(Icon, {
|
|
263
209
|
type: "right",
|
|
264
210
|
onClick: onMoveToRight,
|
|
265
211
|
disabled: !tabsPositionFlags.end
|
package/es/Layout/Iconfont.js
CHANGED
package/es/Layout/Language.js
CHANGED
|
@@ -1,23 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
|
|
4
|
-
|
|
5
|
-
function
|
|
6
|
-
|
|
1
|
+
var _templateObject;
|
|
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
7
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
8
|
-
|
|
9
|
-
function _templateObject() {
|
|
10
|
-
var data = _taggedTemplateLiteral(["\n font-size: ", ";\n .tnt-icon {\n font-size: ", ";\n margin-right: 4px;\n }\n span {\n position: relative;\n font-size: ", ";\n top: ", ";\n font-family: auto;\n .tnt-themeS1 & {\n /* color: rgba(255,255,255,.85); */\n }\n }\n .isInIframe & {\n display: none;\n }\n"]);
|
|
11
|
-
|
|
12
|
-
_templateObject = function _templateObject() {
|
|
13
|
-
return data;
|
|
14
|
-
};
|
|
15
|
-
|
|
16
|
-
return data;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
8
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
20
|
-
|
|
21
9
|
import { useState } from 'react';
|
|
22
10
|
import styled, { withTheme } from 'styled-components';
|
|
23
11
|
import { get } from 'lodash';
|
|
@@ -34,7 +22,7 @@ var languagesMap = languages.reduce(function (acc, cur) {
|
|
|
34
22
|
acc[cur.value] = cur;
|
|
35
23
|
return acc;
|
|
36
24
|
}, {});
|
|
37
|
-
var Language = styled.li(_templateObject(), function (_ref) {
|
|
25
|
+
var Language = styled.li(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: ", ";\n .tnt-icon {\n font-size: ", ";\n margin-right: 4px;\n }\n span {\n position: relative;\n font-size: ", ";\n top: ", ";\n font-family: auto;\n .tnt-themeS1 & {\n /* color: rgba(255,255,255,.85); */\n }\n }\n .isInIframe & {\n display: none;\n }\n"])), function (_ref) {
|
|
38
26
|
var size = _ref.theme.size;
|
|
39
27
|
return size === 'large' ? '14px' : '12px';
|
|
40
28
|
}, function (_ref2) {
|
|
@@ -49,33 +37,27 @@ var Language = styled.li(_templateObject(), function (_ref) {
|
|
|
49
37
|
});
|
|
50
38
|
export default withTheme(function (props) {
|
|
51
39
|
var onChange = props.onChange;
|
|
52
|
-
|
|
53
40
|
var getLanguage = function getLanguage() {
|
|
54
41
|
var lang = getLanguageStore() || props.language;
|
|
55
|
-
|
|
56
42
|
if (!languagesMap[lang]) {
|
|
57
43
|
lang = get(languages, '0.value');
|
|
58
44
|
}
|
|
59
|
-
|
|
60
45
|
return lang;
|
|
61
46
|
};
|
|
62
|
-
|
|
63
47
|
var _useState = useState(getLanguage()),
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
48
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
49
|
+
_useState2$ = _useState2[0],
|
|
50
|
+
language = _useState2$ === void 0 ? 'cn' : _useState2$,
|
|
51
|
+
setLanguage = _useState2[1];
|
|
69
52
|
var switchLanguage = function switchLanguage() {
|
|
70
53
|
var lang = language === 'cn' ? 'en' : 'cn';
|
|
71
54
|
setLanguage(lang);
|
|
72
55
|
setLanguageStore(lang);
|
|
73
56
|
onChange && onChange(lang);
|
|
74
57
|
};
|
|
75
|
-
|
|
76
|
-
return React.createElement(Language, {
|
|
58
|
+
return /*#__PURE__*/React.createElement(Language, {
|
|
77
59
|
onClick: switchLanguage
|
|
78
|
-
}, React.createElement(Iconfont, {
|
|
60
|
+
}, /*#__PURE__*/React.createElement(Iconfont, {
|
|
79
61
|
type: "flag-".concat(language)
|
|
80
|
-
}), React.createElement("span", null, get(languagesMap[language], 'name')));
|
|
62
|
+
}), /*#__PURE__*/React.createElement("span", null, get(languagesMap[language], 'name')));
|
|
81
63
|
});
|