@kep-platform/basic-component 0.5.0 → 1.0.2

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.
Files changed (9) hide show
  1. package/dist/PopupBox/PopupBox.js +19 -5
  2. package/dist/ViewPort/ViewPortStore.js +1 -1
  3. package/dist/ViewPort/ViewPortWindow.js +2 -2
  4. package/dist/Window/Window.js +29 -36
  5. package/dist/Window/WindowOption.d.ts +1 -0
  6. package/dist/Window/WindowOption.js +7 -6
  7. package/dist/Window/WindowStore.js +4 -4
  8. package/dist/__styles/GlobalStyles.js +1 -1
  9. package/package.json +86 -87
package/dist/PopupBox/PopupBox.js CHANGED
@@ -17,6 +17,18 @@ var PopupBox = styled('div').withConfig({
17
17
  })(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background-color: var(--kep-platform-color-bg-base);\n padding: var(--kep-platform-padding-xs);\n border-radius: var(--kep-platform-border-radius-sm);\n position: fixed;\n box-shadow: var(--kep-platform-box-shadow);\n z-index: 999;\n ", ";\n"])), function (props) {
18
18
  if (props.visible) return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n left: ", "px;\n top: ", "px;\n "])), props.left || -999, props.top || -999);else return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n left: -9999px;\n top: -9999px;\n "])));
19
19
  });
20
+ var PortalComponent = function PortalComponent(_ref) {
21
+ var children = _ref.children,
22
+ rootId = _ref.rootId;
23
+ var portalRoot = document.getElementById(rootId);
24
+ if (!portalRoot) {
25
+ var newPortalRoot = document.createElement('div');
26
+ newPortalRoot.id = rootId;
27
+ document.body.appendChild(newPortalRoot);
28
+ return /*#__PURE__*/ReactDOM.createPortal(children, newPortalRoot);
29
+ }
30
+ if (portalRoot) return /*#__PURE__*/ReactDOM.createPortal(children, portalRoot);
31
+ };
20
32
  export function Popup(props) {
21
33
  var children = props.children,
22
34
  _props$trigger = props.trigger,
@@ -55,9 +67,9 @@ export function Popup(props) {
55
67
 
56
68
  var showPopupMenu = useCallback(function (e) {
57
69
  e.preventDefault();
58
- var _ref = e,
59
- clientX = _ref.clientX,
60
- clientY = _ref.clientY;
70
+ var _ref2 = e,
71
+ clientX = _ref2.clientX,
72
+ clientY = _ref2.clientY;
61
73
  setPos({
62
74
  left: clientX,
63
75
  top: clientY
@@ -82,12 +94,14 @@ export function Popup(props) {
82
94
  if (typeof outerVisible === 'boolean') setVisible(outerVisible);
83
95
  }, [outerVisible]);
84
96
  if ( /*#__PURE__*/React.isValidElement(children)) {
85
- return /*#__PURE__*/React.createElement(React.Fragment, null, window.document.body && /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement(PopupBox, {
97
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PortalComponent, {
98
+ rootId: "popupContainer"
99
+ }, /*#__PURE__*/React.createElement(PopupBox, {
86
100
  left: pos.left,
87
101
  top: pos.top,
88
102
  visible: visible,
89
103
  ref: popupBox
90
- }, content), window.document.body), /*#__PURE__*/React.cloneElement(children, mergeProps));
104
+ }, content)), /*#__PURE__*/React.cloneElement(children, mergeProps));
91
105
  } else {
92
106
  return children;
93
107
  }
package/dist/ViewPort/ViewPortStore.js CHANGED
@@ -164,7 +164,7 @@ export var ViewPortStore = /*#__PURE__*/function () {
164
164
  width: this.width * this.ratio + 'px',
165
165
  height: this.height * this.ratio + 'px',
166
166
  transformOrigin: 'left top',
167
- transition: this.isMoving ? 'none' : 'all 1s ease-in-out',
167
+ transition: this.isMoving ? 'none' : 'all 0.3s ease-in-out',
168
168
  background: '#188fff67',
169
169
  cursor: this.isMoving ? 'grab' : 'default'
170
170
  };
package/dist/ViewPort/ViewPortWindow.js CHANGED
@@ -51,7 +51,7 @@ export var ViewPortWindowStore = /*#__PURE__*/function (_WindowStore) {
51
51
  zIndex: this.zIndex,
52
52
  transform: 'scale(0)',
53
53
  transformOrigin: 'center center',
54
- transition: 'all 0.5s ease-out'
54
+ transition: 'all 0.3s ease-out'
55
55
  };
56
56
  }
57
57
  if (this.isMinimize && this.minimizePos) {
@@ -96,7 +96,7 @@ export var ViewPortWindowStore = /*#__PURE__*/function (_WindowStore) {
96
96
  height: this.height + 'px',
97
97
  zIndex: this.zIndex,
98
98
  transform: 'none',
99
- transition: 'all 0.5s ease-out'
99
+ transition: 'all 0.3s ease-out'
100
100
  };
101
101
  }
102
102
  }, {
package/dist/Window/Window.js CHANGED
@@ -1,40 +1,35 @@
1
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
1
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
2
2
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
3
- import { CloseCircleOutlined, FullscreenExitOutlined, FullscreenOutlined, MinusCircleOutlined } from '@ant-design/icons';
3
+ import { BorderOutlined, CloseOutlined, CompressOutlined, MinusOutlined } from '@ant-design/icons';
4
4
  import { runInAction } from 'mobx';
5
5
  import { observer } from 'mobx-react-lite';
6
6
  import React, { useEffect, useRef } from 'react';
7
- import styled, { css } from 'styled-components';
8
- import { Space } from "../Space";
7
+ import styled from 'styled-components';
9
8
  import WindowController from "./WindowController";
10
9
  import WindowOption from "./WindowOption";
11
10
  var WindowContainer = styled.div.withConfig({
12
11
  shouldForwardProp: function shouldForwardProp(prop) {
13
12
  return !['isMinimize'].includes(prop);
14
13
  }
15
- })(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n box-shadow: var(--kep-platform-box-shadow);\n position: absolute;\n padding: ", ";\n border-radius: 4px;\n background-color: #fff;\n overflow: hidden;\n"])), function (props) {
16
- return props.isMinimize ? '0px' : '6px';
14
+ })(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n box-shadow: var(--kep-platform-box-shadow);\n position: absolute;\n padding: 0px;\n border-radius: ", ";\n background-color: #fff;\n overflow: hidden;\n border: 1px solid rgba(50, 58, 67, 0.15);\n"])), function (props) {
15
+ return props.isFullscreen ? '4px' : '12px';
17
16
  });
18
17
  var WindowEntity = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n"])));
19
18
  var WindowHeader = styled.div.withConfig({
20
19
  shouldForwardProp: function shouldForwardProp(prop) {
21
20
  return !['isDragging'].includes(prop);
22
21
  }
23
- })(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n height: 40px;\n padding: 6px;\n border-radius: 4px;\n line-height: 26px;\n font-size: 16px;\n background-color: var(--kep-platform-color-primary);\n transition: margin 0.35s, opacity 0.7s, box-shadow 0.7s;\n position: relative;\n color: #fff;\n cursor: move;\n & > h5 {\n color: #fff;\n }\n &:hover {\n opacity: 0.9;\n }\n ", "\n"])), function (props) {
24
- if (props.isDragging) {
25
- return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n margin: 0 4px;\n "])));
26
- }
27
- });
28
- var WindowHeaderOptions = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n position: absolute;\n right: 6px;\n top: 6px;\n"])));
29
- var WindowBody = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n overflow: auto;\n padding: 12px;\n flex: 1;\n"])));
30
- var WindowControllerLeft = styled(WindowController)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n left: 0;\n top: 0;\n bottom: 0;\n cursor: e-resize;\n"])));
31
- var WindowControllerRight = styled(WindowController)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n height: 100%;\n right: 0;\n top: 0;\n bottom: 0;\n cursor: e-resize;\n"])));
32
- var WindowControllerTop = styled(WindowController)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n position: absolute;\n width: 100%;\n height: 6px;\n left: 0;\n right: 0;\n top: 0;\n cursor: n-resize;\n"])));
33
- var WindowControllerBottom = styled(WindowController)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n position: absolute;\n width: 100%;\n height: 6px;\n left: 0;\n right: 0;\n bottom: 0;\n cursor: n-resize;\n"])));
34
- var WindowControllerLeftTop = styled(WindowController)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n height: 6px;\n left: 0;\n top: 0;\n cursor: nwse-resize;\n"])));
35
- var WindowControllerLeftBottom = styled(WindowController)(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n height: 6px;\n left: 0;\n bottom: 0;\n cursor: nesw-resize;\n"])));
36
- var WindowControllerRightTop = styled(WindowController)(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n height: 6px;\n right: 0;\n top: 0;\n cursor: nesw-resize;\n"])));
37
- var WindowControllerRightBottom = styled(WindowController)(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n height: 6px;\n right: 0;\n bottom: 0;\n cursor: nwse-resize;\n"])));
22
+ })(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n height: 40px;\n padding: 6px 12px;\n line-height: 26px;\n font-size: 16px;\n background-color: var(--kep-platform-color-bg-layout-header);\n transition: margin 0.35s, opacity 0.7s, box-shadow 0.7s;\n position: relative;\n color: #000;\n cursor: move;\n & > h5 {\n color: #000;\n }\n"])));
23
+ var WindowHeaderOptions = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: absolute;\n right: 0;\n top: 0;\n height: 100%;\n display: flex;\n z-index: 3;\n"])));
24
+ var WindowBody = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n overflow: auto;\n padding: 12px;\n flex: 1;\n"])));
25
+ var WindowControllerLeft = styled(WindowController)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n left: 0;\n top: 0;\n bottom: 0;\n cursor: e-resize;\n z-index: 2;\n"])));
26
+ var WindowControllerRight = styled(WindowController)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n height: 100%;\n right: 0;\n top: 0;\n bottom: 0;\n cursor: e-resize;\n z-index: 2;\n"])));
27
+ var WindowControllerTop = styled(WindowController)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n position: absolute;\n width: 100%;\n height: 6px;\n left: 0;\n right: 0;\n top: 0;\n cursor: n-resize;\n z-index: 2;\n"])));
28
+ var WindowControllerBottom = styled(WindowController)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n position: absolute;\n width: 100%;\n height: 6px;\n left: 0;\n right: 0;\n bottom: 0;\n cursor: n-resize;\n z-index: 2;\n"])));
29
+ var WindowControllerLeftTop = styled(WindowController)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n height: 6px;\n left: 0;\n top: 0;\n cursor: nwse-resize;\n z-index: 2;\n"])));
30
+ var WindowControllerLeftBottom = styled(WindowController)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n height: 6px;\n left: 0;\n bottom: 0;\n cursor: nesw-resize;\n z-index: 2;\n"])));
31
+ var WindowControllerRightTop = styled(WindowController)(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n height: 6px;\n right: 0;\n top: 0;\n cursor: nesw-resize;\n z-index: 2;\n"])));
32
+ var WindowControllerRightBottom = styled(WindowController)(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n position: absolute;\n width: 6px;\n height: 6px;\n right: 0;\n bottom: 0;\n cursor: nwse-resize;\n z-index: 2;\n"])));
38
33
  var Window = observer(function (props) {
39
34
  var window = props.window,
40
35
  title = props.title,
@@ -61,6 +56,7 @@ var Window = observer(function (props) {
61
56
  ref: windowContainerRef,
62
57
  style: window.style,
63
58
  isMinimize: !!window.isMinimize,
59
+ isFullscreen: !!window.fullscreen,
64
60
  onTransitionEnd: function onTransitionEnd(e) {
65
61
  e.stopPropagation();
66
62
  if (e.target === e.currentTarget) {
@@ -127,34 +123,31 @@ var Window = observer(function (props) {
127
123
  onPointerDown: function onPointerDown(e) {
128
124
  e.stopPropagation();
129
125
  }
130
- }, /*#__PURE__*/React.createElement(Space, null, !window.fullscreen ? /*#__PURE__*/React.createElement(WindowOption, {
131
- color: "var(--kep-platform-orange-4)",
132
- icon: /*#__PURE__*/React.createElement(FullscreenOutlined, null),
126
+ }, /*#__PURE__*/React.createElement(WindowOption, {
127
+ icon: /*#__PURE__*/React.createElement(MinusOutlined, null),
133
128
  onClick: function onClick() {
134
129
  if (window.disabled) return;
135
- window.fullscreenWindow(onFullscreenHandler);
130
+ window.minimizeWindow();
136
131
  }
137
- }) : /*#__PURE__*/React.createElement(WindowOption, {
138
- color: "var(--kep-platform-orange-4)",
139
- icon: /*#__PURE__*/React.createElement(FullscreenExitOutlined, null),
132
+ }), !window.fullscreen ? /*#__PURE__*/React.createElement(WindowOption, {
133
+ icon: /*#__PURE__*/React.createElement(BorderOutlined, null),
140
134
  onClick: function onClick() {
141
135
  if (window.disabled) return;
142
- window.fullscreenExitWindow();
136
+ window.fullscreenWindow(onFullscreenHandler);
143
137
  }
144
- }), /*#__PURE__*/React.createElement(WindowOption, {
145
- color: "var(--kep-platform-green-3)",
146
- icon: /*#__PURE__*/React.createElement(MinusCircleOutlined, null),
138
+ }) : /*#__PURE__*/React.createElement(WindowOption, {
139
+ icon: /*#__PURE__*/React.createElement(CompressOutlined, null),
147
140
  onClick: function onClick() {
148
141
  if (window.disabled) return;
149
- window.minimizeWindow();
142
+ window.fullscreenExitWindow();
150
143
  }
151
144
  }), /*#__PURE__*/React.createElement(WindowOption, {
152
145
  onClick: function onClick() {
153
146
  if (window.disabled) return;
154
147
  window.closeWindow();
155
148
  },
156
- icon: /*#__PURE__*/React.createElement(CloseCircleOutlined, null),
157
- color: "var(--kep-platform-red)"
158
- }))))), /*#__PURE__*/React.createElement(WindowBody, null, children)));
149
+ icon: /*#__PURE__*/React.createElement(CloseOutlined, null),
150
+ danger: true
151
+ })))), /*#__PURE__*/React.createElement(WindowBody, null, children)));
159
152
  });
160
153
  export default Window;
package/dist/Window/WindowOption.d.ts CHANGED
@@ -2,6 +2,7 @@ import React, { HtmlHTMLAttributes, ReactNode } from 'react';
2
2
  type WindowOptionProps = {
3
3
  icon: ReactNode;
4
4
  color?: string;
5
+ danger?: boolean;
5
6
  } & HtmlHTMLAttributes<HTMLSpanElement>;
6
7
  export default function WindowOption(props: WindowOptionProps): React.JSX.Element;
7
8
  export {};
package/dist/Window/WindowOption.js CHANGED
@@ -1,5 +1,5 @@
1
1
  var _excluded = ["icon"];
2
- var _templateObject, _templateObject2;
2
+ var _templateObject;
3
3
  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); }
4
4
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
5
5
  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."); }
@@ -11,17 +11,18 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
11
11
  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; }
12
12
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
13
13
  import React, { useState } from 'react';
14
- import styled, { css } from 'styled-components';
14
+ import styled from 'styled-components';
15
15
  var WindowOptionContainer = styled.span.withConfig({
16
16
  shouldForwardProp: function shouldForwardProp(prop) {
17
17
  return !['active'].includes(prop);
18
18
  }
19
- })(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n cursor: pointer;\n & svg {\n transition: transform 0.5s;\n color: ", ";\n }\n &:hover {\n & svg {\n transform: scale(1.2);\n }\n }\n ", "\n"])), function (props) {
19
+ })(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n height: 100%;\n display: flex;\n padding: 0 16px;\n cursor: pointer;\n & svg {\n transition: transform 0.5s;\n }\n\n &:hover {\n & svg {\n color: ", ";\n }\n\n background-color: ", ";\n }\n"])), function (props) {
20
+ if (props.danger) {
21
+ return '#fff';
22
+ }
20
23
  return props.color || 'auto';
21
24
  }, function (props) {
22
- if (props.active) {
23
- return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n & svg {\n transform: scale(0.9) !important;\n }\n "])));
24
- }
25
+ return props.danger ? 'var(--kep-platform-red)' : 'var(--kep-platform-color-fill-tertiary)';
25
26
  });
26
27
  export default function WindowOption(props) {
27
28
  var icon = props.icon,
package/dist/Window/WindowStore.js CHANGED
@@ -176,7 +176,7 @@ var WindowStore = /*#__PURE__*/function () {
176
176
  zIndex: this.zIndex,
177
177
  transform: 'scale(0)',
178
178
  transformOrigin: 'center center',
179
- transition: 'all 1s ease-in-out'
179
+ transition: 'all 0.3s ease-in-out'
180
180
  };
181
181
  }
182
182
  if (this.isMinimize && this.minimizePos) {
@@ -188,7 +188,7 @@ var WindowStore = /*#__PURE__*/function () {
188
188
  zIndex: this.zIndex,
189
189
  transform: 'scale(0)',
190
190
  transformOrigin: 'left top',
191
- transition: 'all 1s ease-in-out'
191
+ transition: 'all 0.3s ease-in-out'
192
192
  };
193
193
  }
194
194
  if (this.fullscreen) {
@@ -199,7 +199,7 @@ var WindowStore = /*#__PURE__*/function () {
199
199
  height: this.fullscreenPos.height + 'px',
200
200
  zIndex: this.zIndex,
201
201
  transform: 'none',
202
- transition: 'all 1s ease-in-out'
202
+ transition: 'all 0.3s ease-in-out'
203
203
  };
204
204
  }
205
205
  if (this.isMoving || this.isResizing) {
@@ -220,7 +220,7 @@ var WindowStore = /*#__PURE__*/function () {
220
220
  height: this.height + 'px',
221
221
  zIndex: this.zIndex,
222
222
  transform: 'none',
223
- transition: 'all 1s ease-in-out'
223
+ transition: 'all 0.3s ease-in-out'
224
224
  };
225
225
  }
226
226
  }, {
package/dist/__styles/GlobalStyles.js CHANGED
@@ -2,7 +2,7 @@ var _templateObject;
2
2
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
3
3
  // GlobalStyles.js
4
4
  import { createGlobalStyle } from 'styled-components';
5
- var GlobalStyles = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n:root{\n --kep-platform-black:#000000;\n --kep-platform-blue: #1677ff;\n --kep-platform-purple: #722ED1;\n --kep-platform-cyan: #13C2C2;\n --kep-platform-green: #52C41A;\n --kep-platform-magenta: #EB2F96;\n --kep-platform-pink: #eb2f96;\n --kep-platform-red: #F5222D;\n --kep-platform-orange: #FA8C16;\n --kep-platform-yellow: #FADB14;\n --kep-platform-volcano: #FA541C;\n --kep-platform-geekblue: #2F54EB;\n --kep-platform-gold: #FAAD14;\n --kep-platform-lime: #A0D911;\n --kep-platform-color-primary: #1677ff;\n --kep-platform-color-success: #52c41a;\n --kep-platform-color-warning: #faad14;\n --kep-platform-color-error: #ff4d4f;\n --kep-platform-color-info: #1677ff;\n --kep-platform-color-link: #1677ff;\n --kep-platform-color-text-base: #000;\n --kep-platform-color-bg-base: #fff;\n --kep-platform-blue-1: #e6f4ff;\n --kep-platform-blue-2: #bae0ff;\n --kep-platform-blue-3: #91caff;\n --kep-platform-blue-4: #69b1ff;\n --kep-platform-blue-5: #4096ff;\n --kep-platform-blue-6: #1677ff;\n --kep-platform-blue-7: #0958d9;\n --kep-platform-blue-8: #003eb3;\n --kep-platform-blue-9: #002c8c;\n --kep-platform-blue-10: #001d66;\n --kep-platform-purple-1: #f9f0ff;\n --kep-platform-purple-2: #efdbff;\n --kep-platform-purple-3: #d3adf7;\n --kep-platform-purple-4: #b37feb;\n --kep-platform-purple-5: #9254de;\n --kep-platform-purple-6: #722ed1;\n --kep-platform-purple-7: #531dab;\n --kep-platform-purple-8: #391085;\n --kep-platform-purple-9: #22075e;\n --kep-platform-purple-10: #120338;\n --kep-platform-cyan-1: #e6fffb;\n --kep-platform-cyan-2: #b5f5ec;\n --kep-platform-cyan-3: #87e8de;\n --kep-platform-cyan-4: #5cdbd3;\n --kep-platform-cyan-5: #36cfc9;\n --kep-platform-cyan-6: #13c2c2;\n --kep-platform-cyan-7: #08979c;\n --kep-platform-cyan-8: #006d75;\n --kep-platform-cyan-9: #00474f;\n --kep-platform-cyan-10: #002329;\n --kep-platform-green-1: #f6ffed;\n --kep-platform-green-2: #d9f7be;\n --kep-platform-green-3: #b7eb8f;\n --kep-platform-green-4: #95de64;\n --kep-platform-green-5: #73d13d;\n --kep-platform-green-6: #52c41a;\n --kep-platform-green-7: #389e0d;\n --kep-platform-green-8: #237804;\n --kep-platform-green-9: #135200;\n --kep-platform-green-10: #092b00;\n --kep-platform-magenta-1: #fff0f6;\n --kep-platform-magenta-2: #ffd6e7;\n --kep-platform-magenta-3: #ffadd2;\n --kep-platform-magenta-4: #ff85c0;\n --kep-platform-magenta-5: #f759ab;\n --kep-platform-magenta-6: #eb2f96;\n --kep-platform-magenta-7: #c41d7f;\n --kep-platform-magenta-8: #9e1068;\n --kep-platform-magenta-9: #780650;\n --kep-platform-magenta-10: #520339;\n --kep-platform-pink-1: #fff0f6;\n --kep-platform-pink-2: #ffd6e7;\n --kep-platform-pink-3: #ffadd2;\n --kep-platform-pink-4: #ff85c0;\n --kep-platform-pink-5: #f759ab;\n --kep-platform-pink-6: #eb2f96;\n --kep-platform-pink-7: #c41d7f;\n --kep-platform-pink-8: #9e1068;\n --kep-platform-pink-9: #780650;\n --kep-platform-pink-10: #520339;\n --kep-platform-red-1: #fff1f0;\n --kep-platform-red-2: #ffccc7;\n --kep-platform-red-3: #ffa39e;\n --kep-platform-red-4: #ff7875;\n --kep-platform-red-5: #ff4d4f;\n --kep-platform-red-6: #f5222d;\n --kep-platform-red-7: #cf1322;\n --kep-platform-red-8: #a8071a;\n --kep-platform-red-9: #820014;\n --kep-platform-red-10: #5c0011;\n --kep-platform-orange-1: #fff7e6;\n --kep-platform-orange-2: #ffe7ba;\n --kep-platform-orange-3: #ffd591;\n --kep-platform-orange-4: #ffc069;\n --kep-platform-orange-5: #ffa940;\n --kep-platform-orange-6: #fa8c16;\n --kep-platform-orange-7: #d46b08;\n --kep-platform-orange-8: #ad4e00;\n --kep-platform-orange-9: #873800;\n --kep-platform-orange-10: #612500;\n --kep-platform-yellow-1: #feffe6;\n --kep-platform-yellow-2: #ffffb8;\n --kep-platform-yellow-3: #fffb8f;\n --kep-platform-yellow-4: #fff566;\n --kep-platform-yellow-5: #ffec3d;\n --kep-platform-yellow-6: #fadb14;\n --kep-platform-yellow-7: #d4b106;\n --kep-platform-yellow-8: #ad8b00;\n --kep-platform-yellow-9: #876800;\n --kep-platform-yellow-10: #614700;\n --kep-platform-volcano-1: #fff2e8;\n --kep-platform-volcano-2: #ffd8bf;\n --kep-platform-volcano-3: #ffbb96;\n --kep-platform-volcano-4: #ff9c6e;\n --kep-platform-volcano-5: #ff7a45;\n --kep-platform-volcano-6: #fa541c;\n --kep-platform-volcano-7: #d4380d;\n --kep-platform-volcano-8: #ad2102;\n --kep-platform-volcano-9: #871400;\n --kep-platform-volcano-10: #610b00;\n --kep-platform-geekblue-1: #f0f5ff;\n --kep-platform-geekblue-2: #d6e4ff;\n --kep-platform-geekblue-3: #adc6ff;\n --kep-platform-geekblue-4: #85a5ff;\n --kep-platform-geekblue-5: #597ef7;\n --kep-platform-geekblue-6: #2f54eb;\n --kep-platform-geekblue-7: #1d39c4;\n --kep-platform-geekblue-8: #10239e;\n --kep-platform-geekblue-9: #061178;\n --kep-platform-geekblue-10: #030852;\n --kep-platform-gold-1: #fffbe6;\n --kep-platform-gold-2: #fff1b8;\n --kep-platform-gold-3: #ffe58f;\n --kep-platform-gold-4: #ffd666;\n --kep-platform-gold-5: #ffc53d;\n --kep-platform-gold-6: #faad14;\n --kep-platform-gold-7: #d48806;\n --kep-platform-gold-8: #ad6800;\n --kep-platform-gold-9: #874d00;\n --kep-platform-gold-10: #613400;\n --kep-platform-lime-1: #fcffe6;\n --kep-platform-lime-2: #f4ffb8;\n --kep-platform-lime-3: #eaff8f;\n --kep-platform-lime-4: #d3f261;\n --kep-platform-lime-5: #bae637;\n --kep-platform-lime-6: #a0d911;\n --kep-platform-lime-7: #7cb305;\n --kep-platform-lime-8: #5b8c00;\n --kep-platform-lime-9: #3f6600;\n --kep-platform-lime-10: #254000;\n --kep-platform-color-text: rgba(0, 0, 0, 0.88);\n --kep-platform-color-text-active: var(--kep-platform-blue-6);\n --kep-platform-color-text-secondary: rgba(0, 0, 0, 0.65);\n --kep-platform-color-text-tertiary: rgba(0, 0, 0, 0.45);\n --kep-platform-color-text-quaternary: rgba(0, 0, 0, 0.25);\n --kep-platform-color-fill: rgba(0, 0, 0, 0.15);\n --kep-platform-color-fill-secondary: rgba(0, 0, 0, 0.06);\n --kep-platform-color-fill-tertiary: rgba(0, 0, 0, 0.04);\n --kep-platform-color-fill-quaternary: rgba(0, 0, 0, 0.02);\n --kep-platform-color-bg-hover:#f7f7f7;\n --kep-platform-color-bg-layout: #f5f5f5;\n --kep-platform-color-bg-container: #ffffff;\n --kep-platform-color-bg-elevated: #ffffff;\n --kep-platform-color-bg-spotlight: rgba(0, 0, 0, 0.85);\n --kep-platform-color-bg-blur: transparent;\n --kep-platform-color-border: #e4e9ec;\n --kep-platform-color-border-secondary: #f0f0f0;\n --kep-platform-color-primary-bg: #e6f4ff;\n --kep-platform-color-primary-bg-hover: #bae0ff;\n --kep-platform-color-primary-border: #91caff;\n --kep-platform-color-primary-border-hover: #69b1ff;\n --kep-platform-color-primary-hover: #4096ff;\n --kep-platform-color-primary-active: #0958d9;\n --kep-platform-color-primary-text-hover: #4096ff;\n --kep-platform-color-primary-text: #1677ff;\n --kep-platform-color-primary-text-active: #0958d9;\n --kep-platform-color-success-bg: #f6ffed;\n --kep-platform-color-success-bg-hover: #d9f7be;\n --kep-platform-color-success-border: #b7eb8f;\n --kep-platform-color-success-border-hover: #95de64;\n --kep-platform-color-success-hover: #95de64;\n --kep-platform-color-success-active: #389e0d;\n --kep-platform-color-success-text-hover: #73d13d;\n --kep-platform-color-success-text: #52c41a;\n --kep-platform-color-success-text-active: #389e0d;\n --kep-platform-color-error-bg: #fff2f0;\n --kep-platform-color-error-bg-hover: #fff1f0;\n --kep-platform-color-error-bg-active: #ffccc7;\n --kep-platform-color-error-border: #ffccc7;\n --kep-platform-color-error-border-hover: #ffa39e;\n --kep-platform-color-error-hover: #ff7875;\n --kep-platform-color-error-active: #d9363e;\n --kep-platform-color-error-text-hover: #ff7875;\n --kep-platform-color-error-text: #ff4d4f;\n --kep-platform-color-error-text-active: #d9363e;\n --kep-platform-color-warning-bg: #fffbe6;\n --kep-platform-color-warning-bg-hover: #fff1b8;\n --kep-platform-color-warning-border: #ffe58f;\n --kep-platform-color-warning-border-hover: #ffd666;\n --kep-platform-color-warning-hover: #ffd666;\n --kep-platform-color-warning-active: #d48806;\n --kep-platform-color-warning-text-hover: #ffc53d;\n --kep-platform-color-warning-text: #faad14;\n --kep-platform-color-warning-text-active: #d48806;\n --kep-platform-color-info-bg: #e6f4ff;\n --kep-platform-color-info-bg-hover: #bae0ff;\n --kep-platform-color-info-border: #91caff;\n --kep-platform-color-info-border-hover: #69b1ff;\n --kep-platform-color-info-hover: #69b1ff;\n --kep-platform-color-info-active: #0958d9;\n --kep-platform-color-info-text-hover: #4096ff;\n --kep-platform-color-info-text: #1677ff;\n --kep-platform-color-info-text-active: #0958d9;\n --kep-platform-color-link-hover: #69b1ff;\n --kep-platform-color-link-active: #0958d9;\n --kep-platform-color-bg-mask: rgba(0, 0, 0, 0.45);\n --kep-platform-color-white: #fff;\n --kep-platform-color-fill-content: rgba(0, 0, 0, 0.06);\n --kep-platform-color-fill-content-hover: rgba(0, 0, 0, 0.15);\n --kep-platform-color-fill-alter: rgba(0, 0, 0, 0.02);\n --kep-platform-color-bg-container-disabled: rgba(0, 0, 0, 0.04);\n --kep-platform-color-border-bg: #ffffff;\n --kep-platform-color-scrollbar-thumb:var(--kep-platform-color-border);\n --kep-platform-color-scrollbar-thumb-hover:var(--kep-platform-color-primary-hover);\n --kep-platform-color-split: rgba(5, 5, 5, 0.06);\n --kep-platform-color-table-border: #f0f0f0;\n --kep-platform-color-text-placeholder: rgba(0, 0, 0, 0.25);\n --kep-platform-color-text-disabled: rgba(0, 0, 0, 0.25);\n --kep-platform-color-text-heading: rgba(0, 0, 0, 0.88);\n --kep-platform-color-text-label: rgba(0, 0, 0, 0.65);\n --kep-platform-color-text-description: rgba(0, 0, 0, 0.45);\n --kep-platform-color-text-light-solid: #fff;\n --kep-platform-color-highlight: #ff4d4f;\n --kep-platform-color-bg-text-hover: rgba(0, 0, 0, 0.06);\n --kep-platform-color-bg-text-active: rgba(0, 0, 0, 0.15);\n --kep-platform-color-icon: rgba(0, 0, 0, 0.45);\n --kep-platform-color-icon-hover: rgba(0, 0, 0, 0.88);\n --kep-platform-color-error-outline: rgba(255, 38, 5, 0.06);\n --kep-platform-color-warning-outline: rgba(255, 215, 5, 0.1);\n --kep-platform-control-item-bg-hover: rgba(0, 0, 0, 0.04);\n --kep-platform-control-item-bg-active: #e6f4ff;\n --kep-platform-control-item-bg-active-hover: #bae0ff;\n --kep-platform-control-item-bg-active-disabled: rgba(0, 0, 0, 0.15);\n --kep-platform-control-tmp-outline: rgba(0, 0, 0, 0.02);\n --kep-platform-control-outline: rgba(5, 145, 255, 0.1);\n --kep-platform-box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 3px 6px -4px rgba(0, 0, 0, 0.12),\n 0 9px 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-inset: inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);\n --kep-platform-box-shadow-secondary: 0 6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 3px 6px -4px rgba(0, 0, 0, 0.12),\n 0 9px 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-tertiary: 0 1px 2px 0 rgba(0, 0, 0, 0.03),\n 0 1px 6px -1px rgba(0, 0, 0, 0.02),\n 0 2px 4px 0 rgba(0, 0, 0, 0.02);\n --kep-platform-box-shadow-popover-arrow: 2px 2px 5px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-card: 0 1px 2px -2px rgba(0, 0, 0, 0.16),\n 0 3px 6px 0 rgba(0, 0, 0, 0.12),\n 0 5px 12px 4px rgba(0, 0, 0, 0.09);\n --kep-platform-box-shadow-mask: var(--kep-platform-box-shadow-tertiary);\n --kep-platform-box-shadow-drawer-right: -6px 0 16px 0 rgba(0, 0, 0, 0.08),\n -3px 0 6px -4px rgba(0, 0, 0, 0.12),\n -9px 0 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-drawer-left: 6px 0 16px 0 rgba(0, 0, 0, 0.08),\n 3px 0 6px -4px rgba(0, 0, 0, 0.12),\n 9px 0 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-drawer-up: 0 6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 3px 6px -4px rgba(0, 0, 0, 0.12),\n 0 9px 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-drawer-down: 0 -6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 -3px 6px -4px rgba(0, 0, 0, 0.12),\n 0 -9px 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-color-tree-node-hover: #fafafa;\n --kep-platform-color-bg-active:#e6f4ff;\n --kep-platform-box-shadow-tabs-overflow-left: inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);\n --kep-platform-box-shadow-tabs-overflow-right: inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);\n --kep-platform-box-shadow-tabs-overflow-top: inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);\n --kep-platform-box-shadow-tabs-overflow-bottom: inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);\n --kep-platform-header-bg: #fafafa;\n --kep-platform-color-scrollbar-track: #fafafa;\n --kep-platform-motion-ease-out-circ: cubic-bezier(0.08, 0.82, 0.17, 1);\n --kep-platform-motion-ease-in-out-circ: cubic-bezier(0.78, 0.14, 0.15, 0.86);\n --kep-platform-motion-ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);\n --kep-platform-motion-ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);\n --kep-platform-motion-ease-out-back: cubic-bezier(0.12, 0.4, 0.29, 1.46);\n --kep-platform-motion-ease-in-back: cubic-bezier(0.71, -0.46, 0.88, 0.6);\n --kep-platform-motion-ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);\n --kep-platform-motion-ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);\n --kep-platform-motion-duration-fast: 0.1s;\n --kep-platform-motion-duration-mid: 0.2s;\n --kep-platform-motion-duration-slow: 0.3s;\n --kep-platform-font-size: 16px;\n --kep-platform-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol','Noto Color Emoji';\n --kep-platform-font-family-code: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;\n --kep-platform-font-size-sm: 14px;\n --kep-platform-font-size-lg: 18px;\n --kep-platform-font-size-xl: 20px;\n --kep-platform-font-size-heading-1: 38px;\n --kep-platform-font-size-heading-2: 30px;\n --kep-platform-font-size-heading-3: 24px;\n --kep-platform-font-size-heading-4: 20px;\n --kep-platform-font-size-heading-5: 16px;\n --kep-platform-font-height: 22px;\n --kep-platform-font-height-lg: 24px;\n --kep-platform-font-height-sm: 20px;\n --kep-platform-font-weight-base: 400;\n --kep-platform-font-weight-strong: 600;\n --kep-platform-link-decoration: none;\n --kep-platform-link-hover-decoration: none;\n --kep-platform-link-focus-decoration: none;\n --kep-platform-line-width: 1px;\n --kep-platform-line-type: solid;\n --kep-platform-line-height: 1.5714285714285714;\n --kep-platform-line-height-lg: 1.5;\n --kep-platform-line-height-sm: 1.6666666666666667;\n --kep-platform-line-height-heading-1: 1.2105263157894737;\n --kep-platform-line-height-heading-2: 1.2666666666666666;\n --kep-platform-line-height-heading-3: 1.3333333333333333;\n --kep-platform-line-height-heading-4: 1.4;\n --kep-platform-line-height-heading-5: 1.5;\n --kep-platform-line-width-bold: 2px;\n --kep-platform-font-size-icon: 12px;\n --kep-platform-font-size-code: 12px;\n --kep-platform-text-align: left;\n --kep-platform-border-radius: 6px;\n --kep-platform-border-radius-xs: 2px;\n --kep-platform-border-radius-sm: 4px;\n --kep-platform-border-radius-lg: 8px;\n --kep-platform-border-radius-outer: 4px;\n --kep-platform-z-index-base: 0;\n --kep-platform-z-index-popup-base: 1000;\n --kep-platform-z-index-fixed:5;\n --kep-platform-opacity-loading: 0.65;\n --kep-platform-control-padding-horizontal: 12px;\n --kep-platform-control-padding-horizontal-sm: 8px;\n --kep-platform-padding-xxs: 4px;\n --kep-platform-padding-xs: 8px;\n --kep-platform-padding-sm: 12px;\n --kep-platform-padding: 16px;\n --kep-platform-padding-md: 20px;\n --kep-platform-padding-lg: 24px;\n --kep-platform-padding-xl: 32px;\n --kep-platform-padding-block-sm:0;\n --kep-platform-padding-block:4px;\n --kep-platform-padding-block-lg:7px;\n --kep-platform-padding-inline-sm:7px;\n --kep-platform-padding-inline:15px;\n --kep-platform-padding-inline-lg:15px;\n\n --kep-platform-padding-content-horizontal-lg: 24px;\n --kep-platform-padding-content-vertical-lg: 16px;\n --kep-platform-padding-content-horizontal: 16px;\n --kep-platform-padding-content-vertical: 12px;\n --kep-platform-padding-content-horizontal-sm: 16px;\n --kep-platform-padding-content-vertical-sm: 8px;\n --kep-platform-margin-xxxs: 2px;\n --kep-platform-margin-xxs: 4px;\n --kep-platform-margin-xs: 8px;\n --kep-platform-margin-sm: 12px;\n --kep-platform-margin: 16px;\n --kep-platform-margin-md: 20px;\n --kep-platform-margin-lg: 24px;\n --kep-platform-margin-xl: 32px;\n --kep-platform-margin-xxl: 48px;\n --kep-platform-width-scrollbar:8px;\n --kep-platform-height-scrollbar:8px;\n --kep-platform-menu-item-height: 40px;\n --kep-platform-menu-item-line-height:40px;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\nbody {\n margin: 0;\n font-family: var(--kep-platform-font-family);\n font-size: var(--kep-platform-font-size);\n font-weight: var(--kep-platform-font-weight-base);\n line-height: var(--kep-platform-line-height);\n color: var(--kep-platform-color-text);\n text-align: var(--kep-platform-text-align);\n background-color: var(--kep-platform-color-bg-base);\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: var(--kep-platform-black);\n}\n\n\n\n[tabindex='-1']:focus:not(:focus-visible) {\n outline: 0 !important;\n}\n\n\n\nhr {\n margin: --kep-platform-margin-sm 0;\n height: var(--kep-platform-line-width);\n color: var(--kep-platform-color-border);\n background-color: currentColor;\n border: 0;\n}\n\nhr:not([size]) {\n height: var(--kep-platform-line-width);\n}\n\n\n\nh1,h2,h3,h4,h5,h6{\n margin-top: 0;\n margin-bottom: 0;\n font-family: var(--kep-platform-font-family);\n font-style: var(--kep-platform-link-decoration);\n font-weight: var(--kep-platform-font-weight-strong);\n line-height: var(--kep-platform-line-height);\n color: var(--kep-platform-color-text-secondary);\n}\n\nh1 {\n font-size: var(--kep-platform-font-size-heading-1);\n}\n\nh2 {\n font-size: var(--kep-platform-font-size-heading-2);\n}\n\nh3 {\n font-size: var(--kep-platform-font-size-heading-3);\n}\n\nh4 {\n font-size: var(--kep-platform-font-size-heading-4);\n}\n\nh5 {\n font-size: var(--kep-platform-font-size-heading-5);\n}\n\nh6 {\n font-size: var(--kep-platform-font-size-heading-6);\n}\n\n\np {\n margin-top: 0;\n margin-bottom: 0 !important;\n}\n\n\n\nabbr[title],\nabbr[data-original-title] {\n text-decoration: underline;\n text-decoration: underline dotted;\n cursor: help;\n text-decoration-skip-ink: none;\n}\n\naddress {\n margin-bottom: 1rem;\n font-style: normal;\n line-height: inherit;\n}\n\nol,\nul {\n padding-left: 0;\n list-style: none;\n}\n\nol,\nul,\ndl {\n margin-top: 0;\n margin-bottom: 0;\n}\n\nol ol,\nul ul,\nol ul,\nul ol {\n margin-bottom: 0;\n}\n\ndt {\n font-weight: var(--kep-platform-font-weight-base);\n}\n\n\ndd {\n margin-bottom: 0.5rem;\n margin-left: 0;\n}\n\nblockquote {\n margin: 0 0 1rem;\n}\n\n\nb,\nstrong {\n font-weight: var(--kep-platform-font-weight-strong);\n}\n\n\nsmall {\n font-size: var(--kep-platform-font-size-sm);\n}\n\n\n\nsub,\nsup {\n position: relative;\n font-size: var(--kep-platform-font-size-sm);\n line-height: 0;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\nsup {\n top: -0.5em;\n}\n\n\n\na {\n color: var(--kep-platform-color-link);\n text-decoration: var(--kep-platform-link-decoration);\n cursor: pointer;\n &:hover {\n color: var(--kep-platform-color-link-hover);\n text-decoration: --kep-platform-link-hover-decoration\n }\n}\n\n\npre,\ncode,\nkbd,\nsamp {\n font-family: var(--kep-platform-font-family-code);\n font-size: var(--kep-platform-font-size-code);\n}\n\n\npre {\n display: block;\n margin-top: 0;\n margin-bottom: var(--kep-platform-margin);\n overflow: auto;\n font-size: var(--kep-platform-font-size-code);\n color: var(--kep-platform-color-text-label);\n\n\n code {\n font-size: inherit;\n color: inherit;\n word-break: normal;\n }\n}\n\ncode {\n font-size: var(--kep-platform-font-size-code);\n color: var(--kep-platform-color-text-quaternary);\n word-wrap: break-word;\n\n\n a > & {\n color: inherit;\n }\n}\n\n\n\n\n\nfigure {\n margin: 0 0 1rem;\n}\n\n\n\nimg {\n vertical-align: middle;\n}\n\n\n\nsvg {\n overflow: hidden;\n vertical-align: middle;\n}\n\n\n\ntable {\n border-collapse: collapse;\n}\n\ncaption {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n color: var(--kep-platform-color-text-secondary);\n text-align: left;\n caption-side: bottom;\n}\n\n\nth {\n text-align: inherit;\n}\n\n\n\nlabel {\n display: inline-block;\n margin-bottom: 0.5rem;\n}\n\n\n\nbutton {\n border-radius: 0;\n}\n\n\n\ninput,\nbutton,\nselect,\noptgroup,\ntextarea {\n margin: 0;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n}\n\n\nbutton,\ninput {\n overflow: visible;\n}\n\n\nbutton,\nselect {\n text-transform: none;\n}\n\n\nselect {\n word-wrap: normal;\n}\n\n\n\n[list]::-webkit-calendar-picker-indicator {\n display: none;\n}\n\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n appearance: button;\n\n &:not(:disabled) {\n cursor: pointer;\n }\n}\n\nbutton:focus {\n outline: none;\n}\n\ninput:focus {\n outline: none;\n}\n\n\n::-moz-focus-inner {\n padding: 0;\n border-style: none;\n}\n\n\ninput[type='date'],\ninput[type='time'],\ninput[type='datetime-local'],\ninput[type='month'] {\n appearance: textfield;\n}\n\n\n\n/* \u6EDA\u52A8\u6761\u6574\u4F53\u6837\u5F0F */\n::-webkit-scrollbar {\n width: var(--kep-platform-width-scrollbar);\n height: var(--kep-platform-height-scrollbar);\n}\n\n/* \u6EDA\u52A8\u6761\u8F68\u9053\u6837\u5F0F */\n::-webkit-scrollbar-track {\n border-radius: var(--kep-platform-border-radius);\n background-color: var(--kep-platform-color-scrollbar-track);\n}\n\n/* \u6EDA\u52A8\u6761\u6ED1\u5757\u6837\u5F0F */\n::-webkit-scrollbar-thumb {\n background-color: var(--kep-platform-color-scrollbar-thumb);\n border-radius: var(--kep-platform-border-radius);\n}\n\n/* \u9F20\u6807\u60AC\u505C\u5728\u6ED1\u5757\u4E0A\u7684\u6837\u5F0F */\n::-webkit-scrollbar-thumb:hover {\n background-color: var(--kep-platform-color-scrollbar-thumb-hover);\n}\n\ntextarea {\n overflow: auto;\n resize: vertical;\n}\n\n\n\nfieldset {\n min-width: 0;\n padding: 0;\n margin: 0;\n border: 0;\n}\n\n\n\nlegend {\n float: left;\n width: 100%;\n padding: 0;\n margin-bottom: var(--kep-platform-margin);\n font-size: var(--kep-platform-font-size);\n font-weight: var(--kep-platform-font-weight-base);\n line-height: inherit;\n color: inherit;\n white-space: normal;\n}\n\nmark {\n padding: var(--kep-platform-padding-sm);\n background-color: var(--kep-platform-padding-sm);\n}\n\n\nprogress {\n vertical-align: baseline;\n}\n\n\n::-webkit-datetime-edit {\n overflow: visible;\n line-height: 0;\n}\n\n\n\n[type='search'] {\n outline-offset: -2px;\n appearance: textfield;\n}\n\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n\n::-webkit-color-swatch-wrapper {\n padding: 0;\n}\n\n\n\n::-webkit-file-upload-button {\n font: inherit;\n -webkit-appearance: button;\n}\n\n\noutput {\n display: inline-block;\n}\n\n\nsummary {\n display: list-item;\n cursor: pointer;\n}\n\n\ntemplate {\n display: none;\n}\n\nmain {\n display: block;\n}\n\n\n[hidden] {\n display: none !important;\n}\n\n", "\n"])), function (props) {
5
+ var GlobalStyles = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n:root{\n --kep-platform-black:#000000;\n --kep-platform-blue: #1677ff;\n --kep-platform-purple: #722ED1;\n --kep-platform-cyan: #13C2C2;\n --kep-platform-green: #52C41A;\n --kep-platform-magenta: #EB2F96;\n --kep-platform-pink: #eb2f96;\n --kep-platform-red: #F5222D;\n --kep-platform-orange: #FA8C16;\n --kep-platform-yellow: #FADB14;\n --kep-platform-volcano: #FA541C;\n --kep-platform-geekblue: #2F54EB;\n --kep-platform-gold: #FAAD14;\n --kep-platform-lime: #A0D911;\n --kep-platform-color-primary: #1677ff;\n --kep-platform-color-success: #52c41a;\n --kep-platform-color-warning: #faad14;\n --kep-platform-color-error: #ff4d4f;\n --kep-platform-color-info: #1677ff;\n --kep-platform-color-link: #1677ff;\n --kep-platform-color-text-base: #000;\n --kep-platform-color-bg-base: #fff;\n --kep-platform-blue-1: #e6f4ff;\n --kep-platform-blue-2: #bae0ff;\n --kep-platform-blue-3: #91caff;\n --kep-platform-blue-4: #69b1ff;\n --kep-platform-blue-5: #4096ff;\n --kep-platform-blue-6: #1677ff;\n --kep-platform-blue-7: #0958d9;\n --kep-platform-blue-8: #003eb3;\n --kep-platform-blue-9: #002c8c;\n --kep-platform-blue-10: #001d66;\n --kep-platform-purple-1: #f9f0ff;\n --kep-platform-purple-2: #efdbff;\n --kep-platform-purple-3: #d3adf7;\n --kep-platform-purple-4: #b37feb;\n --kep-platform-purple-5: #9254de;\n --kep-platform-purple-6: #722ed1;\n --kep-platform-purple-7: #531dab;\n --kep-platform-purple-8: #391085;\n --kep-platform-purple-9: #22075e;\n --kep-platform-purple-10: #120338;\n --kep-platform-cyan-1: #e6fffb;\n --kep-platform-cyan-2: #b5f5ec;\n --kep-platform-cyan-3: #87e8de;\n --kep-platform-cyan-4: #5cdbd3;\n --kep-platform-cyan-5: #36cfc9;\n --kep-platform-cyan-6: #13c2c2;\n --kep-platform-cyan-7: #08979c;\n --kep-platform-cyan-8: #006d75;\n --kep-platform-cyan-9: #00474f;\n --kep-platform-cyan-10: #002329;\n --kep-platform-green-1: #f6ffed;\n --kep-platform-green-2: #d9f7be;\n --kep-platform-green-3: #b7eb8f;\n --kep-platform-green-4: #95de64;\n --kep-platform-green-5: #73d13d;\n --kep-platform-green-6: #52c41a;\n --kep-platform-green-7: #389e0d;\n --kep-platform-green-8: #237804;\n --kep-platform-green-9: #135200;\n --kep-platform-green-10: #092b00;\n --kep-platform-magenta-1: #fff0f6;\n --kep-platform-magenta-2: #ffd6e7;\n --kep-platform-magenta-3: #ffadd2;\n --kep-platform-magenta-4: #ff85c0;\n --kep-platform-magenta-5: #f759ab;\n --kep-platform-magenta-6: #eb2f96;\n --kep-platform-magenta-7: #c41d7f;\n --kep-platform-magenta-8: #9e1068;\n --kep-platform-magenta-9: #780650;\n --kep-platform-magenta-10: #520339;\n --kep-platform-pink-1: #fff0f6;\n --kep-platform-pink-2: #ffd6e7;\n --kep-platform-pink-3: #ffadd2;\n --kep-platform-pink-4: #ff85c0;\n --kep-platform-pink-5: #f759ab;\n --kep-platform-pink-6: #eb2f96;\n --kep-platform-pink-7: #c41d7f;\n --kep-platform-pink-8: #9e1068;\n --kep-platform-pink-9: #780650;\n --kep-platform-pink-10: #520339;\n --kep-platform-red-1: #fff1f0;\n --kep-platform-red-2: #ffccc7;\n --kep-platform-red-3: #ffa39e;\n --kep-platform-red-4: #ff7875;\n --kep-platform-red-5: #ff4d4f;\n --kep-platform-red-6: #f5222d;\n --kep-platform-red-7: #cf1322;\n --kep-platform-red-8: #a8071a;\n --kep-platform-red-9: #820014;\n --kep-platform-red-10: #5c0011;\n --kep-platform-orange-1: #fff7e6;\n --kep-platform-orange-2: #ffe7ba;\n --kep-platform-orange-3: #ffd591;\n --kep-platform-orange-4: #ffc069;\n --kep-platform-orange-5: #ffa940;\n --kep-platform-orange-6: #fa8c16;\n --kep-platform-orange-7: #d46b08;\n --kep-platform-orange-8: #ad4e00;\n --kep-platform-orange-9: #873800;\n --kep-platform-orange-10: #612500;\n --kep-platform-yellow-1: #feffe6;\n --kep-platform-yellow-2: #ffffb8;\n --kep-platform-yellow-3: #fffb8f;\n --kep-platform-yellow-4: #fff566;\n --kep-platform-yellow-5: #ffec3d;\n --kep-platform-yellow-6: #fadb14;\n --kep-platform-yellow-7: #d4b106;\n --kep-platform-yellow-8: #ad8b00;\n --kep-platform-yellow-9: #876800;\n --kep-platform-yellow-10: #614700;\n --kep-platform-volcano-1: #fff2e8;\n --kep-platform-volcano-2: #ffd8bf;\n --kep-platform-volcano-3: #ffbb96;\n --kep-platform-volcano-4: #ff9c6e;\n --kep-platform-volcano-5: #ff7a45;\n --kep-platform-volcano-6: #fa541c;\n --kep-platform-volcano-7: #d4380d;\n --kep-platform-volcano-8: #ad2102;\n --kep-platform-volcano-9: #871400;\n --kep-platform-volcano-10: #610b00;\n --kep-platform-geekblue-1: #f0f5ff;\n --kep-platform-geekblue-2: #d6e4ff;\n --kep-platform-geekblue-3: #adc6ff;\n --kep-platform-geekblue-4: #85a5ff;\n --kep-platform-geekblue-5: #597ef7;\n --kep-platform-geekblue-6: #2f54eb;\n --kep-platform-geekblue-7: #1d39c4;\n --kep-platform-geekblue-8: #10239e;\n --kep-platform-geekblue-9: #061178;\n --kep-platform-geekblue-10: #030852;\n --kep-platform-gold-1: #fffbe6;\n --kep-platform-gold-2: #fff1b8;\n --kep-platform-gold-3: #ffe58f;\n --kep-platform-gold-4: #ffd666;\n --kep-platform-gold-5: #ffc53d;\n --kep-platform-gold-6: #faad14;\n --kep-platform-gold-7: #d48806;\n --kep-platform-gold-8: #ad6800;\n --kep-platform-gold-9: #874d00;\n --kep-platform-gold-10: #613400;\n --kep-platform-lime-1: #fcffe6;\n --kep-platform-lime-2: #f4ffb8;\n --kep-platform-lime-3: #eaff8f;\n --kep-platform-lime-4: #d3f261;\n --kep-platform-lime-5: #bae637;\n --kep-platform-lime-6: #a0d911;\n --kep-platform-lime-7: #7cb305;\n --kep-platform-lime-8: #5b8c00;\n --kep-platform-lime-9: #3f6600;\n --kep-platform-lime-10: #254000;\n --kep-platform-color-text: rgba(0, 0, 0, 0.88);\n --kep-platform-color-text-active: var(--kep-platform-blue-6);\n --kep-platform-color-text-secondary: rgba(0, 0, 0, 0.65);\n --kep-platform-color-text-tertiary: rgba(0, 0, 0, 0.45);\n --kep-platform-color-text-quaternary: rgba(0, 0, 0, 0.25);\n --kep-platform-color-fill: rgba(0, 0, 0, 0.15);\n --kep-platform-color-fill-secondary: rgba(0, 0, 0, 0.06);\n --kep-platform-color-fill-tertiary: rgba(0, 0, 0, 0.04);\n --kep-platform-color-fill-quaternary: rgba(0, 0, 0, 0.02);\n --kep-platform-color-bg-hover:#f7f7f7;\n --kep-platform-color-bg-layout: #f5f5f5;\n --kep-platform-color-bg-layout-header: #f1f4f9;\n --kep-platform-color-bg-container: #ffffff;\n --kep-platform-color-bg-elevated: #ffffff;\n --kep-platform-color-bg-spotlight: rgba(0, 0, 0, 0.85);\n --kep-platform-color-bg-blur: transparent;\n --kep-platform-color-border: #e4e9ec;\n --kep-platform-color-border-secondary: #f0f0f0;\n --kep-platform-color-primary-bg: #e6f4ff;\n --kep-platform-color-primary-bg-hover: #bae0ff;\n --kep-platform-color-primary-border: #91caff;\n --kep-platform-color-primary-border-hover: #69b1ff;\n --kep-platform-color-primary-hover: #4096ff;\n --kep-platform-color-primary-active: #0958d9;\n --kep-platform-color-primary-text-hover: #4096ff;\n --kep-platform-color-primary-text: #1677ff;\n --kep-platform-color-primary-text-active: #0958d9;\n --kep-platform-color-success-bg: #f6ffed;\n --kep-platform-color-success-bg-hover: #d9f7be;\n --kep-platform-color-success-border: #b7eb8f;\n --kep-platform-color-success-border-hover: #95de64;\n --kep-platform-color-success-hover: #95de64;\n --kep-platform-color-success-active: #389e0d;\n --kep-platform-color-success-text-hover: #73d13d;\n --kep-platform-color-success-text: #52c41a;\n --kep-platform-color-success-text-active: #389e0d;\n --kep-platform-color-error-bg: #fff2f0;\n --kep-platform-color-error-bg-hover: #fff1f0;\n --kep-platform-color-error-bg-active: #ffccc7;\n --kep-platform-color-error-border: #ffccc7;\n --kep-platform-color-error-border-hover: #ffa39e;\n --kep-platform-color-error-hover: #ff7875;\n --kep-platform-color-error-active: #d9363e;\n --kep-platform-color-error-text-hover: #ff7875;\n --kep-platform-color-error-text: #ff4d4f;\n --kep-platform-color-error-text-active: #d9363e;\n --kep-platform-color-warning-bg: #fffbe6;\n --kep-platform-color-warning-bg-hover: #fff1b8;\n --kep-platform-color-warning-border: #ffe58f;\n --kep-platform-color-warning-border-hover: #ffd666;\n --kep-platform-color-warning-hover: #ffd666;\n --kep-platform-color-warning-active: #d48806;\n --kep-platform-color-warning-text-hover: #ffc53d;\n --kep-platform-color-warning-text: #faad14;\n --kep-platform-color-warning-text-active: #d48806;\n --kep-platform-color-info-bg: #e6f4ff;\n --kep-platform-color-info-bg-hover: #bae0ff;\n --kep-platform-color-info-border: #91caff;\n --kep-platform-color-info-border-hover: #69b1ff;\n --kep-platform-color-info-hover: #69b1ff;\n --kep-platform-color-info-active: #0958d9;\n --kep-platform-color-info-text-hover: #4096ff;\n --kep-platform-color-info-text: #1677ff;\n --kep-platform-color-info-text-active: #0958d9;\n --kep-platform-color-link-hover: #69b1ff;\n --kep-platform-color-link-active: #0958d9;\n --kep-platform-color-bg-mask: rgba(0, 0, 0, 0.45);\n --kep-platform-color-white: #fff;\n --kep-platform-color-fill-content: rgba(0, 0, 0, 0.06);\n --kep-platform-color-fill-content-hover: rgba(0, 0, 0, 0.15);\n --kep-platform-color-fill-alter: rgba(0, 0, 0, 0.02);\n --kep-platform-color-bg-container-disabled: rgba(0, 0, 0, 0.04);\n --kep-platform-color-border-bg: #ffffff;\n --kep-platform-color-scrollbar-thumb:var(--kep-platform-color-border);\n --kep-platform-color-scrollbar-thumb-hover:var(--kep-platform-color-primary-hover);\n --kep-platform-color-split: rgba(5, 5, 5, 0.06);\n --kep-platform-color-table-border: #f0f0f0;\n --kep-platform-color-text-placeholder: rgba(0, 0, 0, 0.25);\n --kep-platform-color-text-disabled: rgba(0, 0, 0, 0.25);\n --kep-platform-color-text-heading: rgba(0, 0, 0, 0.88);\n --kep-platform-color-text-label: rgba(0, 0, 0, 0.65);\n --kep-platform-color-text-description: rgba(0, 0, 0, 0.45);\n --kep-platform-color-text-light-solid: #fff;\n --kep-platform-color-highlight: #ff4d4f;\n --kep-platform-color-bg-text-hover: rgba(0, 0, 0, 0.06);\n --kep-platform-color-bg-text-active: rgba(0, 0, 0, 0.15);\n --kep-platform-color-icon: rgba(0, 0, 0, 0.45);\n --kep-platform-color-icon-hover: rgba(0, 0, 0, 0.88);\n --kep-platform-color-error-outline: rgba(255, 38, 5, 0.06);\n --kep-platform-color-warning-outline: rgba(255, 215, 5, 0.1);\n --kep-platform-control-item-bg-hover: rgba(0, 0, 0, 0.04);\n --kep-platform-control-item-bg-active: #e6f4ff;\n --kep-platform-control-item-bg-active-hover: #bae0ff;\n --kep-platform-control-item-bg-active-disabled: rgba(0, 0, 0, 0.15);\n --kep-platform-control-tmp-outline: rgba(0, 0, 0, 0.02);\n --kep-platform-control-outline: rgba(5, 145, 255, 0.1);\n --kep-platform-box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 3px 6px -4px rgba(0, 0, 0, 0.12),\n 0 9px 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-inset: inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);\n --kep-platform-box-shadow-secondary: 0 6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 3px 6px -4px rgba(0, 0, 0, 0.12),\n 0 9px 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-tertiary: 0 1px 2px 0 rgba(0, 0, 0, 0.03),\n 0 1px 6px -1px rgba(0, 0, 0, 0.02),\n 0 2px 4px 0 rgba(0, 0, 0, 0.02);\n --kep-platform-box-shadow-popover-arrow: 2px 2px 5px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-card: 0 1px 2px -2px rgba(0, 0, 0, 0.16),\n 0 3px 6px 0 rgba(0, 0, 0, 0.12),\n 0 5px 12px 4px rgba(0, 0, 0, 0.09);\n --kep-platform-box-shadow-mask: var(--kep-platform-box-shadow-tertiary);\n --kep-platform-box-shadow-drawer-right: -6px 0 16px 0 rgba(0, 0, 0, 0.08),\n -3px 0 6px -4px rgba(0, 0, 0, 0.12),\n -9px 0 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-drawer-left: 6px 0 16px 0 rgba(0, 0, 0, 0.08),\n 3px 0 6px -4px rgba(0, 0, 0, 0.12),\n 9px 0 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-drawer-up: 0 6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 3px 6px -4px rgba(0, 0, 0, 0.12),\n 0 9px 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-box-shadow-drawer-down: 0 -6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 -3px 6px -4px rgba(0, 0, 0, 0.12),\n 0 -9px 28px 8px rgba(0, 0, 0, 0.05);\n --kep-platform-color-tree-node-hover: #fafafa;\n --kep-platform-color-bg-active:#e6f4ff;\n --kep-platform-box-shadow-tabs-overflow-left: inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);\n --kep-platform-box-shadow-tabs-overflow-right: inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);\n --kep-platform-box-shadow-tabs-overflow-top: inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);\n --kep-platform-box-shadow-tabs-overflow-bottom: inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);\n --kep-platform-header-bg: #fafafa;\n --kep-platform-color-scrollbar-track: #fafafa;\n --kep-platform-motion-ease-out-circ: cubic-bezier(0.08, 0.82, 0.17, 1);\n --kep-platform-motion-ease-in-out-circ: cubic-bezier(0.78, 0.14, 0.15, 0.86);\n --kep-platform-motion-ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);\n --kep-platform-motion-ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);\n --kep-platform-motion-ease-out-back: cubic-bezier(0.12, 0.4, 0.29, 1.46);\n --kep-platform-motion-ease-in-back: cubic-bezier(0.71, -0.46, 0.88, 0.6);\n --kep-platform-motion-ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);\n --kep-platform-motion-ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);\n --kep-platform-motion-duration-fast: 0.1s;\n --kep-platform-motion-duration-mid: 0.2s;\n --kep-platform-motion-duration-slow: 0.3s;\n --kep-platform-font-size: 16px;\n --kep-platform-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol','Noto Color Emoji';\n --kep-platform-font-family-code: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;\n --kep-platform-font-size-sm: 14px;\n --kep-platform-font-size-lg: 18px;\n --kep-platform-font-size-xl: 20px;\n --kep-platform-font-size-heading-1: 38px;\n --kep-platform-font-size-heading-2: 30px;\n --kep-platform-font-size-heading-3: 24px;\n --kep-platform-font-size-heading-4: 20px;\n --kep-platform-font-size-heading-5: 16px;\n --kep-platform-font-height: 22px;\n --kep-platform-font-height-lg: 24px;\n --kep-platform-font-height-sm: 20px;\n --kep-platform-font-weight-base: 400;\n --kep-platform-font-weight-strong: 600;\n --kep-platform-link-decoration: none;\n --kep-platform-link-hover-decoration: none;\n --kep-platform-link-focus-decoration: none;\n --kep-platform-line-width: 1px;\n --kep-platform-line-type: solid;\n --kep-platform-line-height: 1.5714285714285714;\n --kep-platform-line-height-lg: 1.5;\n --kep-platform-line-height-sm: 1.6666666666666667;\n --kep-platform-line-height-heading-1: 1.2105263157894737;\n --kep-platform-line-height-heading-2: 1.2666666666666666;\n --kep-platform-line-height-heading-3: 1.3333333333333333;\n --kep-platform-line-height-heading-4: 1.4;\n --kep-platform-line-height-heading-5: 1.5;\n --kep-platform-line-width-bold: 2px;\n --kep-platform-font-size-icon: 12px;\n --kep-platform-font-size-code: 12px;\n --kep-platform-text-align: left;\n --kep-platform-border-radius: 6px;\n --kep-platform-border-radius-xs: 2px;\n --kep-platform-border-radius-sm: 4px;\n --kep-platform-border-radius-lg: 8px;\n --kep-platform-border-radius-outer: 4px;\n --kep-platform-z-index-base: 0;\n --kep-platform-z-index-popup-base: 1000;\n --kep-platform-z-index-fixed:5;\n --kep-platform-opacity-loading: 0.65;\n --kep-platform-control-padding-horizontal: 12px;\n --kep-platform-control-padding-horizontal-sm: 8px;\n --kep-platform-padding-xxs: 4px;\n --kep-platform-padding-xs: 8px;\n --kep-platform-padding-sm: 12px;\n --kep-platform-padding: 16px;\n --kep-platform-padding-md: 20px;\n --kep-platform-padding-lg: 24px;\n --kep-platform-padding-xl: 32px;\n --kep-platform-padding-block-sm:0;\n --kep-platform-padding-block:4px;\n --kep-platform-padding-block-lg:7px;\n --kep-platform-padding-inline-sm:7px;\n --kep-platform-padding-inline:15px;\n --kep-platform-padding-inline-lg:15px;\n\n --kep-platform-padding-content-horizontal-lg: 24px;\n --kep-platform-padding-content-vertical-lg: 16px;\n --kep-platform-padding-content-horizontal: 16px;\n --kep-platform-padding-content-vertical: 12px;\n --kep-platform-padding-content-horizontal-sm: 16px;\n --kep-platform-padding-content-vertical-sm: 8px;\n --kep-platform-margin-xxxs: 2px;\n --kep-platform-margin-xxs: 4px;\n --kep-platform-margin-xs: 8px;\n --kep-platform-margin-sm: 12px;\n --kep-platform-margin: 16px;\n --kep-platform-margin-md: 20px;\n --kep-platform-margin-lg: 24px;\n --kep-platform-margin-xl: 32px;\n --kep-platform-margin-xxl: 48px;\n --kep-platform-width-scrollbar:8px;\n --kep-platform-height-scrollbar:8px;\n --kep-platform-menu-item-height: 40px;\n --kep-platform-menu-item-line-height:40px;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\nbody {\n margin: 0;\n font-family: var(--kep-platform-font-family);\n font-size: var(--kep-platform-font-size);\n font-weight: var(--kep-platform-font-weight-base);\n line-height: var(--kep-platform-line-height);\n color: var(--kep-platform-color-text);\n text-align: var(--kep-platform-text-align);\n background-color: var(--kep-platform-color-bg-base);\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: var(--kep-platform-black);\n}\n\n\n\n[tabindex='-1']:focus:not(:focus-visible) {\n outline: 0 !important;\n}\n\n\n\nhr {\n margin: --kep-platform-margin-sm 0;\n height: var(--kep-platform-line-width);\n color: var(--kep-platform-color-border);\n background-color: currentColor;\n border: 0;\n}\n\nhr:not([size]) {\n height: var(--kep-platform-line-width);\n}\n\n\n\nh1,h2,h3,h4,h5,h6{\n margin-top: 0;\n margin-bottom: 0;\n font-family: var(--kep-platform-font-family);\n font-style: var(--kep-platform-link-decoration);\n font-weight: var(--kep-platform-font-weight-strong);\n line-height: var(--kep-platform-line-height);\n color: var(--kep-platform-color-text-secondary);\n}\n\nh1 {\n font-size: var(--kep-platform-font-size-heading-1);\n}\n\nh2 {\n font-size: var(--kep-platform-font-size-heading-2);\n}\n\nh3 {\n font-size: var(--kep-platform-font-size-heading-3);\n}\n\nh4 {\n font-size: var(--kep-platform-font-size-heading-4);\n}\n\nh5 {\n font-size: var(--kep-platform-font-size-heading-5);\n}\n\nh6 {\n font-size: var(--kep-platform-font-size-heading-6);\n}\n\n\np {\n margin-top: 0;\n margin-bottom: 0 !important;\n}\n\n\n\nabbr[title],\nabbr[data-original-title] {\n text-decoration: underline;\n text-decoration: underline dotted;\n cursor: help;\n text-decoration-skip-ink: none;\n}\n\naddress {\n margin-bottom: 1rem;\n font-style: normal;\n line-height: inherit;\n}\n\nol,\nul {\n padding-left: 0;\n list-style: none;\n}\n\nol,\nul,\ndl {\n margin-top: 0;\n margin-bottom: 0;\n}\n\nol ol,\nul ul,\nol ul,\nul ol {\n margin-bottom: 0;\n}\n\ndt {\n font-weight: var(--kep-platform-font-weight-base);\n}\n\n\ndd {\n margin-bottom: 0.5rem;\n margin-left: 0;\n}\n\nblockquote {\n margin: 0 0 1rem;\n}\n\n\nb,\nstrong {\n font-weight: var(--kep-platform-font-weight-strong);\n}\n\n\nsmall {\n font-size: var(--kep-platform-font-size-sm);\n}\n\n\n\nsub,\nsup {\n position: relative;\n font-size: var(--kep-platform-font-size-sm);\n line-height: 0;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\nsup {\n top: -0.5em;\n}\n\n\n\na {\n color: var(--kep-platform-color-link);\n text-decoration: var(--kep-platform-link-decoration);\n cursor: pointer;\n &:hover {\n color: var(--kep-platform-color-link-hover);\n text-decoration: --kep-platform-link-hover-decoration\n }\n}\n\n\npre,\ncode,\nkbd,\nsamp {\n font-family: var(--kep-platform-font-family-code);\n font-size: var(--kep-platform-font-size-code);\n}\n\n\npre {\n display: block;\n margin-top: 0;\n margin-bottom: var(--kep-platform-margin);\n overflow: auto;\n font-size: var(--kep-platform-font-size-code);\n color: var(--kep-platform-color-text-label);\n\n\n code {\n font-size: inherit;\n color: inherit;\n word-break: normal;\n }\n}\n\ncode {\n font-size: var(--kep-platform-font-size-code);\n color: var(--kep-platform-color-text-quaternary);\n word-wrap: break-word;\n\n\n a > & {\n color: inherit;\n }\n}\n\n\n\n\n\nfigure {\n margin: 0 0 1rem;\n}\n\n\n\nimg {\n vertical-align: middle;\n}\n\n\n\nsvg {\n overflow: hidden;\n vertical-align: middle;\n}\n\n\n\ntable {\n border-collapse: collapse;\n}\n\ncaption {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n color: var(--kep-platform-color-text-secondary);\n text-align: left;\n caption-side: bottom;\n}\n\n\nth {\n text-align: inherit;\n}\n\n\n\nlabel {\n display: inline-block;\n margin-bottom: 0.5rem;\n}\n\n\n\nbutton {\n border-radius: 0;\n}\n\n\n\ninput,\nbutton,\nselect,\noptgroup,\ntextarea {\n margin: 0;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n}\n\n\nbutton,\ninput {\n overflow: visible;\n}\n\n\nbutton,\nselect {\n text-transform: none;\n}\n\n\nselect {\n word-wrap: normal;\n}\n\n\n\n[list]::-webkit-calendar-picker-indicator {\n display: none;\n}\n\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n appearance: button;\n\n &:not(:disabled) {\n cursor: pointer;\n }\n}\n\nbutton:focus {\n outline: none;\n}\n\ninput:focus {\n outline: none;\n}\n\n\n::-moz-focus-inner {\n padding: 0;\n border-style: none;\n}\n\n\ninput[type='date'],\ninput[type='time'],\ninput[type='datetime-local'],\ninput[type='month'] {\n appearance: textfield;\n}\n\n\n\n/* \u6EDA\u52A8\u6761\u6574\u4F53\u6837\u5F0F */\n::-webkit-scrollbar {\n width: var(--kep-platform-width-scrollbar);\n height: var(--kep-platform-height-scrollbar);\n}\n\n/* \u6EDA\u52A8\u6761\u8F68\u9053\u6837\u5F0F */\n::-webkit-scrollbar-track {\n border-radius: var(--kep-platform-border-radius);\n background-color: var(--kep-platform-color-scrollbar-track);\n}\n\n/* \u6EDA\u52A8\u6761\u6ED1\u5757\u6837\u5F0F */\n::-webkit-scrollbar-thumb {\n background-color: var(--kep-platform-color-scrollbar-thumb);\n border-radius: var(--kep-platform-border-radius);\n}\n\n/* \u9F20\u6807\u60AC\u505C\u5728\u6ED1\u5757\u4E0A\u7684\u6837\u5F0F */\n::-webkit-scrollbar-thumb:hover {\n background-color: var(--kep-platform-color-scrollbar-thumb-hover);\n}\n\ntextarea {\n overflow: auto;\n resize: vertical;\n}\n\n\n\nfieldset {\n min-width: 0;\n padding: 0;\n margin: 0;\n border: 0;\n}\n\n\n\nlegend {\n float: left;\n width: 100%;\n padding: 0;\n margin-bottom: var(--kep-platform-margin);\n font-size: var(--kep-platform-font-size);\n font-weight: var(--kep-platform-font-weight-base);\n line-height: inherit;\n color: inherit;\n white-space: normal;\n}\n\nmark {\n padding: var(--kep-platform-padding-sm);\n background-color: var(--kep-platform-padding-sm);\n}\n\n\nprogress {\n vertical-align: baseline;\n}\n\n\n::-webkit-datetime-edit {\n overflow: visible;\n line-height: 0;\n}\n\n\n\n[type='search'] {\n outline-offset: -2px;\n appearance: textfield;\n}\n\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n\n::-webkit-color-swatch-wrapper {\n padding: 0;\n}\n\n\n\n::-webkit-file-upload-button {\n font: inherit;\n -webkit-appearance: button;\n}\n\n\noutput {\n display: inline-block;\n}\n\n\nsummary {\n display: list-item;\n cursor: pointer;\n}\n\n\ntemplate {\n display: none;\n}\n\nmain {\n display: block;\n}\n\n\n[hidden] {\n display: none !important;\n}\n\n", "\n"])), function (props) {
6
6
  return props.$css;
7
7
  });
8
8
  export default GlobalStyles;
package/package.json CHANGED
@@ -1,91 +1,90 @@
1
1
  {
2
- "name": "@kep-platform/basic-component",
3
- "version": "0.5.0",
4
- "description": "A react library developed with dumi",
5
- "license": "MIT",
6
- "module": "dist/index.js",
7
- "types": "dist/index.d.ts",
8
- "files": [
9
- "dist"
2
+ "name": "@kep-platform/basic-component",
3
+ "version": "1.0.2",
4
+ "description": "A react library developed with dumi",
5
+ "license": "MIT",
6
+ "module": "dist/index.js",
7
+ "types": "dist/index.d.ts",
8
+ "files": [
9
+ "dist"
10
+ ],
11
+ "scripts": {
12
+ "build": "father build",
13
+ "build:watch": "father dev",
14
+ "dev": "dumi dev",
15
+ "docs:build": "dumi build",
16
+ "docs:preview": "dumi preview",
17
+ "doctor": "father doctor",
18
+ "lint": "npm run lint:es && npm run lint:css",
19
+ "lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
20
+ "lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
21
+ "prepare": "dumi setup",
22
+ "prepublishOnly": "npm run build",
23
+ "start": "npm run dev"
24
+ },
25
+ "commitlint": {
26
+ "extends": [
27
+ "@commitlint/config-conventional"
28
+ ]
29
+ },
30
+ "lint-staged": {
31
+ "*.{md,json}": [
32
+ "prettier --write --no-error-on-unmatched-pattern"
10
33
  ],
11
- "scripts": {
12
- "build": "father build",
13
- "build:watch": "father dev",
14
- "dev": "dumi dev",
15
- "docs:build": "dumi build",
16
- "docs:preview": "dumi preview",
17
- "doctor": "father doctor",
18
- "lint": "npm run lint:es && npm run lint:css",
19
- "lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
20
- "lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
21
- "prepare": "dumi setup",
22
- "prepublishOnly": "npm run build",
23
- "postpublish": "cnpm sync @kep-platform/basic-component",
24
- "start": "npm run dev"
25
- },
26
- "commitlint": {
27
- "extends": [
28
- "@commitlint/config-conventional"
29
- ]
30
- },
31
- "lint-staged": {
32
- "*.{md,json}": [
33
- "prettier --write --no-error-on-unmatched-pattern"
34
- ],
35
- "*.{css,less}": [
36
- "stylelint --fix",
37
- "prettier --write"
38
- ],
39
- "*.{js,jsx}": [
40
- "eslint --fix",
41
- "prettier --write"
42
- ],
43
- "*.{ts,tsx}": [
44
- "eslint --fix",
45
- "prettier --parser=typescript --write"
46
- ]
47
- },
48
- "dependencies": {
49
- "@ant-design/icons": "^5.3.7",
50
- "@kep-platform/hooks": "^0.5.0",
51
- "color": "^4.2.3",
52
- "rc-pagination": "^4.1.0"
53
- },
54
- "devDependencies": {
55
- "@babel/runtime": "^7.24.6",
56
- "@commitlint/cli": "^17.1.2",
57
- "@commitlint/config-conventional": "^17.1.0",
58
- "@types/color": "^3.0.6",
59
- "@types/react": "^18.0.0",
60
- "@types/react-dom": "^18.0.0",
61
- "@umijs/lint": "^4.0.0",
62
- "babel-plugin-transform-remove-console": "^6.9.4",
63
- "dumi": "^2.3.0",
64
- "eslint": "^8.23.0",
65
- "father": "^4.1.0",
66
- "husky": "^8.0.1",
67
- "lint-staged": "^13.0.3",
68
- "prettier": "^2.7.1",
69
- "prettier-plugin-organize-imports": "^3.0.0",
70
- "prettier-plugin-packagejson": "^2.2.18",
71
- "react": "^18.0.0",
72
- "react-dom": "^18.0.0",
73
- "stylelint": "^14.9.1"
74
- },
75
- "peerDependencies": {
76
- "@dnd-kit/core": ">=6.0.0",
77
- "@dnd-kit/utilities": ">=3.0.1",
78
- "mobx": "^6.12.3",
79
- "mobx-react-lite": "^4.0.7",
80
- "react": ">=16.9.0",
81
- "react-dom": ">=16.9.0",
82
- "styled-components": "^6.1.11"
83
- },
84
- "publishConfig": {
85
- "access": "public"
86
- },
87
- "authors": [
88
- "less-step-jss 1599925910@qq.com"
34
+ "*.{css,less}": [
35
+ "stylelint --fix",
36
+ "prettier --write"
89
37
  ],
90
- "gitHead": "195f0a61ad41fc052a3d273cc678ff92cab57c19"
38
+ "*.{js,jsx}": [
39
+ "eslint --fix",
40
+ "prettier --write"
41
+ ],
42
+ "*.{ts,tsx}": [
43
+ "eslint --fix",
44
+ "prettier --parser=typescript --write"
45
+ ]
46
+ },
47
+ "dependencies": {
48
+ "@ant-design/icons": "^5.3.7",
49
+ "@kep-platform/hooks": "^1.0.2",
50
+ "color": "^4.2.3",
51
+ "rc-pagination": "^4.1.0"
52
+ },
53
+ "devDependencies": {
54
+ "@babel/runtime": "^7.24.6",
55
+ "@commitlint/cli": "^17.1.2",
56
+ "@commitlint/config-conventional": "^17.1.0",
57
+ "@types/color": "^3.0.6",
58
+ "@types/react": "^18.0.0",
59
+ "@types/react-dom": "^18.0.0",
60
+ "@umijs/lint": "^4.0.0",
61
+ "babel-plugin-transform-remove-console": "^6.9.4",
62
+ "dumi": "^2.3.0",
63
+ "eslint": "^8.23.0",
64
+ "father": "^4.1.0",
65
+ "husky": "^8.0.1",
66
+ "lint-staged": "^13.0.3",
67
+ "prettier": "^2.7.1",
68
+ "prettier-plugin-organize-imports": "^3.0.0",
69
+ "prettier-plugin-packagejson": "^2.2.18",
70
+ "react": "^18.0.0",
71
+ "react-dom": "^18.0.0",
72
+ "stylelint": "^14.9.1"
73
+ },
74
+ "peerDependencies": {
75
+ "@dnd-kit/core": ">=6.0.0",
76
+ "@dnd-kit/utilities": ">=3.0.1",
77
+ "mobx": "^6.12.3",
78
+ "mobx-react-lite": "^4.0.7",
79
+ "react": ">=16.9.0",
80
+ "react-dom": ">=16.9.0",
81
+ "styled-components": "^6.1.11"
82
+ },
83
+ "publishConfig": {
84
+ "access": "public"
85
+ },
86
+ "authors": [
87
+ "less-step-jss 1599925910@qq.com"
88
+ ],
89
+ "gitHead": "9d080836f027cb44d6fdae1654c19ec9bfc55488"
91
90
  }