@kep-platform/basic-component 0.0.44 → 0.0.46

package/dist/Window/Window.js

@@ -1,4 +1,7 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { CloseCircleOutlined, FullscreenExitOutlined, FullscreenOutlined, MinusCircleOutlined } from '@ant-design/icons';
+import { runInAction } from 'mobx';
 import { observer } from 'mobx-react-lite';
 import React, { useEffect, useRef } from 'react';
 import styled, { css } from 'styled-components';
@@ -9,68 +12,29 @@ var WindowContainer = styled.div.withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
     return !['isMinimize'].includes(prop);
   }
-}).withConfig({
-  displayName: "WindowContainer",
-  componentId: "basic-component-347b__sc-7yonmq-0"
-})(["box-shadow:var(--kep-platform-box-shadow);position:absolute;padding:", ";border-radius:4px;background-color:#fff;overflow:hidden;"], function (props) {
+})(_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) {
   return props.isMinimize ? '0px' : '6px';
 });
-var WindowEntity = styled.div.withConfig({
-  displayName: "WindowEntity",
-  componentId: "basic-component-347b__sc-7yonmq-1"
-})(["width:100%;height:100%;"]);
+var WindowEntity = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    width: 100%;\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n"])));
 var WindowHeader = styled.div.withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
     return !['isDragging'].includes(prop);
   }
-}).withConfig({
-  displayName: "WindowHeader",
-  componentId: "basic-component-347b__sc-7yonmq-2"
-})(["height:40px;padding:6px;border-radius:4px;line-height:26px;font-size:16px;background-color:var(--kep-platform-color-primary);transition:margin 0.35s,opacity 0.7s,box-shadow 0.7s;position:relative;color:#fff;cursor:move;& > h5{color:#fff;}&:hover{opacity:0.9;}", ""], function (props) {
+})(_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) {
   if (props.isDragging) {
-    return css(["margin:0 4px;"]);
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n                margin: 0 4px;\n            "])));
   }
 });
-var WindowHeaderOptions = styled.div.withConfig({
-  displayName: "WindowHeaderOptions",
-  componentId: "basic-component-347b__sc-7yonmq-3"
-})(["position:absolute;right:6px;top:6px;"]);
-var WindowBody = styled.div.withConfig({
-  displayName: "WindowBody",
-  componentId: "basic-component-347b__sc-7yonmq-4"
-})(["overflow:auto;padding:12px;"]);
-var WindowControllerLeft = styled(WindowController).withConfig({
-  displayName: "WindowControllerLeft",
-  componentId: "basic-component-347b__sc-7yonmq-5"
-})(["position:absolute;width:6px;left:0;top:0;bottom:0;cursor:e-resize;"]);
-var WindowControllerRight = styled(WindowController).withConfig({
-  displayName: "WindowControllerRight",
-  componentId: "basic-component-347b__sc-7yonmq-6"
-})(["position:absolute;width:6px;height:100%;right:0;top:0;bottom:0;cursor:e-resize;"]);
-var WindowControllerTop = styled(WindowController).withConfig({
-  displayName: "WindowControllerTop",
-  componentId: "basic-component-347b__sc-7yonmq-7"
-})(["position:absolute;width:100%;height:6px;left:0;right:0;top:0;cursor:n-resize;"]);
-var WindowControllerBottom = styled(WindowController).withConfig({
-  displayName: "WindowControllerBottom",
-  componentId: "basic-component-347b__sc-7yonmq-8"
-})(["position:absolute;width:100%;height:6px;left:0;right:0;bottom:0;cursor:n-resize;"]);
-var WindowControllerLeftTop = styled(WindowController).withConfig({
-  displayName: "WindowControllerLeftTop",
-  componentId: "basic-component-347b__sc-7yonmq-9"
-})(["position:absolute;width:6px;height:6px;left:0;top:0;cursor:nwse-resize;"]);
-var WindowControllerLeftBottom = styled(WindowController).withConfig({
-  displayName: "WindowControllerLeftBottom",
-  componentId: "basic-component-347b__sc-7yonmq-10"
-})(["position:absolute;width:6px;height:6px;left:0;bottom:0;cursor:nesw-resize;"]);
-var WindowControllerRightTop = styled(WindowController).withConfig({
-  displayName: "WindowControllerRightTop",
-  componentId: "basic-component-347b__sc-7yonmq-11"
-})(["position:absolute;width:6px;height:6px;right:0;top:0;cursor:nesw-resize;"]);
-var WindowControllerRightBottom = styled(WindowController).withConfig({
-  displayName: "WindowControllerRightBottom",
-  componentId: "basic-component-347b__sc-7yonmq-12"
-})(["position:absolute;width:6px;height:6px;right:0;bottom:0;cursor:nwse-resize;"]);
+var WindowHeaderOptions = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    position: absolute;\n    right: 6px;\n    top: 6px;\n"])));
+var WindowBody = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    overflow: auto;\n    padding: 12px;\n    flex: 1;\n"])));
+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"])));
+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"])));
+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"])));
+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"])));
+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"])));
+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"])));
+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"])));
+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"])));
 var Window = observer(function (props) {
   var window = props.window,
     title = props.title,
@@ -82,7 +46,6 @@ var Window = observer(function (props) {
     var _windowContainerRef$c;
     function stopWheel(e) {
       e.stopPropagation();
-      e.preventDefault();
     }
     (_windowContainerRef$c = windowContainerRef.current) === null || _windowContainerRef$c === void 0 || _windowContainerRef$c.addEventListener('wheel', stopWheel);
     return function () {
@@ -90,22 +53,31 @@ var Window = observer(function (props) {
       (_windowContainerRef$c2 = windowContainerRef.current) === null || _windowContainerRef$c2 === void 0 || _windowContainerRef$c2.removeEventListener('wheel', stopWheel);
     };
   }, []);
+
   /* style 的原因是因为性能问题 */
   return /*#__PURE__*/React.createElement(WindowContainer, {
     style: window.style,
     isMinimize: !!window.isMinimize,
     onTransitionEnd: function onTransitionEnd(e) {
+      if (e.target === e.currentTarget) {
+        runInAction(function () {
+          window.isTransition = false;
+        });
+      }
       if (e.target === e.currentTarget && window.isClosed && e.nativeEvent.propertyName === 'transform') {
         var _window$onClosedHandl;
         (_window$onClosedHandl = window.onClosedHandler) === null || _window$onClosedHandl === void 0 || _window$onClosedHandl.call(window, window.id);
       }
     },
+    onDoubleClick: function onDoubleClick(e) {
+      e.stopPropagation();
+    },
     onPointerDown: function onPointerDown(e) {
+      if (window.disabled) return;
       e.stopPropagation();
       window.focus();
       onFocusHandler === null || onFocusHandler === void 0 || onFocusHandler();
-    },
-    ref: windowContainerRef
+    }
   }, /*#__PURE__*/React.createElement(WindowControllerLeft, {
     window: window,
     type: "left"
@@ -135,6 +107,9 @@ var Window = observer(function (props) {
     type: "move"
   }, /*#__PURE__*/React.createElement(WindowHeader, {
     isDragging: window.isMoving,
+    onPointerDown: function onPointerDown(e) {
+      if (window.disabled) e.stopPropagation();
+    },
     onDoubleClick: function onDoubleClick(e) {
       e.stopPropagation();
       e.preventDefault();
@@ -152,22 +127,26 @@ var Window = observer(function (props) {
     color: "var(--kep-platform-orange-4)",
     icon: /*#__PURE__*/React.createElement(FullscreenOutlined, null),
     onClick: function onClick() {
+      if (window.disabled) return;
       window.fullscreenWindow(onFullscreenHandler);
     }
   }) : /*#__PURE__*/React.createElement(WindowOption, {
     color: "var(--kep-platform-orange-4)",
     icon: /*#__PURE__*/React.createElement(FullscreenExitOutlined, null),
     onClick: function onClick() {
+      if (window.disabled) return;
       window.fullscreenExitWindow();
     }
   }), /*#__PURE__*/React.createElement(WindowOption, {
     color: "var(--kep-platform-green-3)",
     icon: /*#__PURE__*/React.createElement(MinusCircleOutlined, null),
     onClick: function onClick() {
+      if (window.disabled) return;
       window.minimizeWindow();
     }
   }), /*#__PURE__*/React.createElement(WindowOption, {
     onClick: function onClick() {
+      if (window.disabled) return;
       window.closeWindow();
     },
     icon: /*#__PURE__*/React.createElement(CloseCircleOutlined, null),

package/dist/Window/WindowController.d.ts

@@ -6,5 +6,5 @@ type WindowControllerProps = {
     window: WindowStore;
     children?: ReactNode;
 };
-export default function WindowController(props: WindowControllerProps): React.JSX.Element;
-export {};
+declare const _default: React.FunctionComponent<WindowControllerProps>;
+export default _default;

package/dist/Window/WindowController.js

@@ -1,22 +1,22 @@
 var _excluded = ["type", "window", "children"];
+var _templateObject;
 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); }
 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; }
 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; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { useDraggable } from '@dnd-kit/core';
+import { observer } from 'mobx-react-lite';
 import React, { useEffect } from 'react';
 import styled from 'styled-components';
-var WindowControllerContainer = styled.div.withConfig({
-  displayName: "WindowControllerContainer",
-  componentId: "basic-component-347b__sc-1rv6ocd-0"
-})(["&:active,&:focus{outline:none;}"]);
-export default function WindowController(props) {
+var WindowControllerContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    &:active,\n    &:focus {\n        outline: none;\n    }\n"])));
+export default observer(function WindowController(props) {
   var type = props.type,
     window = props.window,
     children = props.children,
     rest = _objectWithoutProperties(props, _excluded);
   var _useDraggable = useDraggable({
       id: "".concat(window.id, "/").concat(type),
-      disabled: window.fullscreen
+      disabled: window.disabled
     }),
     attributes = _useDraggable.attributes,
     transform = _useDraggable.transform,
@@ -34,4 +34,4 @@ export default function WindowController(props) {
     ref: setNodeRef,
     role: "div"
   }), children);
-}
+});

package/dist/Window/WindowOption.js

@@ -1,4 +1,5 @@
 var _excluded = ["icon"];
+var _templateObject, _templateObject2;
 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); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 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."); }
@@ -8,20 +9,18 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 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; }
 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; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import React, { useState } from 'react';
 import styled, { css } from 'styled-components';
 var WindowOptionContainer = styled.span.withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
     return !['active'].includes(prop);
   }
-}).withConfig({
-  displayName: "WindowOptionContainer",
-  componentId: "basic-component-347b__sc-1ebf27x-0"
-})(["cursor:pointer;& svg{transition:transform 0.5s;color:", ";}&:hover{& svg{transform:scale(1.2);}}", ""], function (props) {
+})(_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) {
   return props.color || 'auto';
 }, function (props) {
   if (props.active) {
-    return css(["& svg{transform:scale(0.9) !important;}"]);
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n                & svg {\n                    transform: scale(0.9) !important;\n                }\n            "])));
   }
 });
 export default function WindowOption(props) {

package/dist/Window/WindowStore.d.ts

@@ -1,4 +1,5 @@
 import { Transform } from '@dnd-kit/utilities';
+import { CSSProperties } from 'react';
 import { WindowControllerType } from './WindowController';
 export default class WindowStore {
     width: number;
@@ -7,6 +8,7 @@ export default class WindowStore {
     top: number;
     zIndex: number;
     fullscreen: boolean;
+    isTransition: boolean;
     id: string;
     transform: {
         x: number;
@@ -31,6 +33,7 @@ export default class WindowStore {
     fullscreenWindow(func?: () => void): void;
     fullscreenExitWindow(): void;
     resetState(): void;
+    get disabled(): boolean;
     calculateTransform(transform: Transform): {
         x: number;
         y: number;
@@ -41,24 +44,6 @@ export default class WindowStore {
     normalizeWindow(): void;
     closeWindow(): void;
     focus(): void;
-    get style(): {
-        left: string;
-        top: string;
-        width: string;
-        height: string;
-        zIndex: number;
-        transform: string;
-        transformOrigin: string;
-        transition: string;
-    } | {
-        left: string;
-        top: string;
-        width: string;
-        height: string;
-        zIndex: number;
-        transform: string;
-        transition: string;
-        transformOrigin?: undefined;
-    };
+    get style(): CSSProperties;
     get info(): string;
 }

package/dist/Window/WindowStore.js

@@ -15,6 +15,7 @@ var WindowStore = /*#__PURE__*/function () {
     _defineProperty(this, "top", 0);
     _defineProperty(this, "zIndex", 1);
     _defineProperty(this, "fullscreen", false);
+    _defineProperty(this, "isTransition", false);
     _defineProperty(this, "id", '');
     _defineProperty(this, "transform", null);
     _defineProperty(this, "isMoving", false);
@@ -41,6 +42,7 @@ var WindowStore = /*#__PURE__*/function () {
       fullscreen: observable,
       transform: observable.struct,
       isMoving: observable,
+      isTransition: observable,
       isResizing: observable,
       isClosed: observable,
       fullscreenExitWindow: action,
@@ -56,7 +58,8 @@ var WindowStore = /*#__PURE__*/function () {
       closeWindow: action,
       resetState: action,
       focus: action,
-      info: computed
+      info: computed,
+      disabled: computed
     });
     this.id = id;
     this.onClosedHandler = onClosedHandler;
@@ -66,12 +69,14 @@ var WindowStore = /*#__PURE__*/function () {
     value: function fullscreenWindow(func) {
       this.resetState();
       this.fullscreen = true;
+      this.isTransition = true;
       func === null || func === void 0 || func();
     }
   }, {
     key: "fullscreenExitWindow",
     value: function fullscreenExitWindow() {
       this.resetState();
+      this.isTransition = true;
       this.fullscreen = false;
     }
   }, {
@@ -79,6 +84,11 @@ var WindowStore = /*#__PURE__*/function () {
     value: function resetState() {
       this.transform = null;
     }
+  }, {
+    key: "disabled",
+    get: function get() {
+      return this.isTransition;
+    }
   }, {
     key: "calculateTransform",
     value: function calculateTransform(transform) {
@@ -131,6 +141,7 @@ var WindowStore = /*#__PURE__*/function () {
     value: function minimizeWindow() {
       this.isMinimize = true;
       this.fullscreen = false;
+      this.isTransition = true;
       this.resetState();
     }
   }, {
@@ -138,12 +149,14 @@ var WindowStore = /*#__PURE__*/function () {
     value: function normalizeWindow() {
       this.isMinimize = false;
       this.fullscreen = false;
+      this.isTransition = true;
       this.resetState();
     }
   }, {
     key: "closeWindow",
     value: function closeWindow() {
       this.isClosed = true;
+      this.isTransition = true;
       this.resetState();
     }
   }, {

package/dist/Window/test.js

@@ -1,55 +1,28 @@
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-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; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { DndContext } from '@dnd-kit/core';
-import { makeAutoObservable } from 'mobx';
 import { observer, useLocalObservable } from 'mobx-react-lite';
 import React from 'react';
-import { ViewPort, ViewPortStore } from "../ViewPort";
 import { GlobalStyles } from "../__styles";
 import Window from "./Window";
 import { WindowStore } from "./index";
-var WindowManager = /*#__PURE__*/function () {
-  function WindowManager() {
-    _classCallCheck(this, WindowManager);
-    _defineProperty(this, "windows", [new WindowStore('jss', this.closeWindowHanlder.bind(this)), new WindowStore('jx', this.closeWindowHanlder.bind(this)), new WindowStore('jiangxin', this.closeWindowHanlder.bind(this)), new WindowStore('xixi', this.closeWindowHanlder.bind(this))]);
-    makeAutoObservable(this);
-  }
-  _createClass(WindowManager, [{
-    key: "closeWindowHanlder",
-    value: function closeWindowHanlder(id) {
-      this.windows = this.windows.filter(function (window) {
-        return window.id !== id;
-      });
-    }
-  }, {
-    key: "report",
-    get: function get() {
-      return this.windows.map(function (window) {
-        return window.id;
-      }).join(',');
-    }
-  }]);
-  return WindowManager;
-}();
-var windowManager = new WindowManager();
 export default observer(function Test() {
-  var viewPortStore = useLocalObservable(function () {
-    return new ViewPortStore();
+  var windowStore = useLocalObservable(function () {
+    return new WindowStore('jss');
   });
   return /*#__PURE__*/React.createElement(DndContext, null, /*#__PURE__*/React.createElement(GlobalStyles, {
     $css: []
-  }), /*#__PURE__*/React.createElement(ViewPort, {
-    viewPortStore: viewPortStore
-  }, windowManager.windows.map(function (windowStore) {
-    return /*#__PURE__*/React.createElement(Window, {
-      window: windowStore,
-      key: windowStore.id,
-      title: 'xixi'
-    }, "123");
-  })));
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      position: 'relative',
+      height: '1000px'
+    }
+  }, /*#__PURE__*/React.createElement(Window, {
+    window: windowStore,
+    key: windowStore.id,
+    title: 'xixi'
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: 'pink',
+      width: '1000px'
+    }
+  }, "121asdjklfjikasdhujikfh awkldjnfhb qweuijfklasdbnhuifwoqnf jkhweuof jkhwuifhqwdh jknwjkd klfhwdujih fuoqwjn klnfkmsdhnajikfh jklasdkl jdklajkl jfklasdjkl jkldjiof1huihfklnsdjklf2", /*#__PURE__*/React.createElement("br", null), "asdjklfjasdklj kljasdkldjf iawhjio jkldjnsajhnfujihnfffffffffffffffffffffffffffffffffffffffffffffffffklasdnmkdlf djkafljkdlfjkl;asdf fjklasdjkl;fjdaskl;jfk;asdf asdjfkasdjkf;f asjfiko;djaskl;fjas fjikasdjfk;asd", /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), "djklasdjkl;jaksdjkl; askdjkl jaksdjk l;asd"))));
 });

package/dist/__styles/GlobalStyles.js

@@ -1,6 +1,8 @@
+var _templateObject;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 // GlobalStyles.js
 import { createGlobalStyle } from 'styled-components';
-var GlobalStyles = createGlobalStyle([":root{--kep-platform-black:#000000;--kep-platform-blue:#1677ff;--kep-platform-purple:#722ED1;--kep-platform-cyan:#13C2C2;--kep-platform-green:#52C41A;--kep-platform-magenta:#EB2F96;--kep-platform-pink:#eb2f96;--kep-platform-red:#F5222D;--kep-platform-orange:#FA8C16;--kep-platform-yellow:#FADB14;--kep-platform-volcano:#FA541C;--kep-platform-geekblue:#2F54EB;--kep-platform-gold:#FAAD14;--kep-platform-lime:#A0D911;--kep-platform-color-primary:#1677ff;--kep-platform-color-success:#52c41a;--kep-platform-color-warning:#faad14;--kep-platform-color-error:#ff4d4f;--kep-platform-color-info:#1677ff;--kep-platform-color-link:#1677ff;--kep-platform-color-text-base:#000;--kep-platform-color-bg-base:#fff;--kep-platform-blue-1:#e6f4ff;--kep-platform-blue-2:#bae0ff;--kep-platform-blue-3:#91caff;--kep-platform-blue-4:#69b1ff;--kep-platform-blue-5:#4096ff;--kep-platform-blue-6:#1677ff;--kep-platform-blue-7:#0958d9;--kep-platform-blue-8:#003eb3;--kep-platform-blue-9:#002c8c;--kep-platform-blue-10:#001d66;--kep-platform-purple-1:#f9f0ff;--kep-platform-purple-2:#efdbff;--kep-platform-purple-3:#d3adf7;--kep-platform-purple-4:#b37feb;--kep-platform-purple-5:#9254de;--kep-platform-purple-6:#722ed1;--kep-platform-purple-7:#531dab;--kep-platform-purple-8:#391085;--kep-platform-purple-9:#22075e;--kep-platform-purple-10:#120338;--kep-platform-cyan-1:#e6fffb;--kep-platform-cyan-2:#b5f5ec;--kep-platform-cyan-3:#87e8de;--kep-platform-cyan-4:#5cdbd3;--kep-platform-cyan-5:#36cfc9;--kep-platform-cyan-6:#13c2c2;--kep-platform-cyan-7:#08979c;--kep-platform-cyan-8:#006d75;--kep-platform-cyan-9:#00474f;--kep-platform-cyan-10:#002329;--kep-platform-green-1:#f6ffed;--kep-platform-green-2:#d9f7be;--kep-platform-green-3:#b7eb8f;--kep-platform-green-4:#95de64;--kep-platform-green-5:#73d13d;--kep-platform-green-6:#52c41a;--kep-platform-green-7:#389e0d;--kep-platform-green-8:#237804;--kep-platform-green-9:#135200;--kep-platform-green-10:#092b00;--kep-platform-magenta-1:#fff0f6;--kep-platform-magenta-2:#ffd6e7;--kep-platform-magenta-3:#ffadd2;--kep-platform-magenta-4:#ff85c0;--kep-platform-magenta-5:#f759ab;--kep-platform-magenta-6:#eb2f96;--kep-platform-magenta-7:#c41d7f;--kep-platform-magenta-8:#9e1068;--kep-platform-magenta-9:#780650;--kep-platform-magenta-10:#520339;--kep-platform-pink-1:#fff0f6;--kep-platform-pink-2:#ffd6e7;--kep-platform-pink-3:#ffadd2;--kep-platform-pink-4:#ff85c0;--kep-platform-pink-5:#f759ab;--kep-platform-pink-6:#eb2f96;--kep-platform-pink-7:#c41d7f;--kep-platform-pink-8:#9e1068;--kep-platform-pink-9:#780650;--kep-platform-pink-10:#520339;--kep-platform-red-1:#fff1f0;--kep-platform-red-2:#ffccc7;--kep-platform-red-3:#ffa39e;--kep-platform-red-4:#ff7875;--kep-platform-red-5:#ff4d4f;--kep-platform-red-6:#f5222d;--kep-platform-red-7:#cf1322;--kep-platform-red-8:#a8071a;--kep-platform-red-9:#820014;--kep-platform-red-10:#5c0011;--kep-platform-orange-1:#fff7e6;--kep-platform-orange-2:#ffe7ba;--kep-platform-orange-3:#ffd591;--kep-platform-orange-4:#ffc069;--kep-platform-orange-5:#ffa940;--kep-platform-orange-6:#fa8c16;--kep-platform-orange-7:#d46b08;--kep-platform-orange-8:#ad4e00;--kep-platform-orange-9:#873800;--kep-platform-orange-10:#612500;--kep-platform-yellow-1:#feffe6;--kep-platform-yellow-2:#ffffb8;--kep-platform-yellow-3:#fffb8f;--kep-platform-yellow-4:#fff566;--kep-platform-yellow-5:#ffec3d;--kep-platform-yellow-6:#fadb14;--kep-platform-yellow-7:#d4b106;--kep-platform-yellow-8:#ad8b00;--kep-platform-yellow-9:#876800;--kep-platform-yellow-10:#614700;--kep-platform-volcano-1:#fff2e8;--kep-platform-volcano-2:#ffd8bf;--kep-platform-volcano-3:#ffbb96;--kep-platform-volcano-4:#ff9c6e;--kep-platform-volcano-5:#ff7a45;--kep-platform-volcano-6:#fa541c;--kep-platform-volcano-7:#d4380d;--kep-platform-volcano-8:#ad2102;--kep-platform-volcano-9:#871400;--kep-platform-volcano-10:#610b00;--kep-platform-geekblue-1:#f0f5ff;--kep-platform-geekblue-2:#d6e4ff;--kep-platform-geekblue-3:#adc6ff;--kep-platform-geekblue-4:#85a5ff;--kep-platform-geekblue-5:#597ef7;--kep-platform-geekblue-6:#2f54eb;--kep-platform-geekblue-7:#1d39c4;--kep-platform-geekblue-8:#10239e;--kep-platform-geekblue-9:#061178;--kep-platform-geekblue-10:#030852;--kep-platform-gold-1:#fffbe6;--kep-platform-gold-2:#fff1b8;--kep-platform-gold-3:#ffe58f;--kep-platform-gold-4:#ffd666;--kep-platform-gold-5:#ffc53d;--kep-platform-gold-6:#faad14;--kep-platform-gold-7:#d48806;--kep-platform-gold-8:#ad6800;--kep-platform-gold-9:#874d00;--kep-platform-gold-10:#613400;--kep-platform-lime-1:#fcffe6;--kep-platform-lime-2:#f4ffb8;--kep-platform-lime-3:#eaff8f;--kep-platform-lime-4:#d3f261;--kep-platform-lime-5:#bae637;--kep-platform-lime-6:#a0d911;--kep-platform-lime-7:#7cb305;--kep-platform-lime-8:#5b8c00;--kep-platform-lime-9:#3f6600;--kep-platform-lime-10:#254000;--kep-platform-color-text:rgba(0,0,0,0.88);--kep-platform-color-text-active:var(--kep-platform-blue-6);--kep-platform-color-text-secondary:rgba(0,0,0,0.65);--kep-platform-color-text-tertiary:rgba(0,0,0,0.45);--kep-platform-color-text-quaternary:rgba(0,0,0,0.25);--kep-platform-color-fill:rgba(0,0,0,0.15);--kep-platform-color-fill-secondary:rgba(0,0,0,0.06);--kep-platform-color-fill-tertiary:rgba(0,0,0,0.04);--kep-platform-color-fill-quaternary:rgba(0,0,0,0.02);--kep-platform-color-bg-hover:#f7f7f7;--kep-platform-color-bg-layout:#f5f5f5;--kep-platform-color-bg-container:#ffffff;--kep-platform-color-bg-elevated:#ffffff;--kep-platform-color-bg-spotlight:rgba(0,0,0,0.85);--kep-platform-color-bg-blur:transparent;--kep-platform-color-border:#e4e9ec;--kep-platform-color-border-secondary:#f0f0f0;--kep-platform-color-primary-bg:#e6f4ff;--kep-platform-color-primary-bg-hover:#bae0ff;--kep-platform-color-primary-border:#91caff;--kep-platform-color-primary-border-hover:#69b1ff;--kep-platform-color-primary-hover:#4096ff;--kep-platform-color-primary-active:#0958d9;--kep-platform-color-primary-text-hover:#4096ff;--kep-platform-color-primary-text:#1677ff;--kep-platform-color-primary-text-active:#0958d9;--kep-platform-color-success-bg:#f6ffed;--kep-platform-color-success-bg-hover:#d9f7be;--kep-platform-color-success-border:#b7eb8f;--kep-platform-color-success-border-hover:#95de64;--kep-platform-color-success-hover:#95de64;--kep-platform-color-success-active:#389e0d;--kep-platform-color-success-text-hover:#73d13d;--kep-platform-color-success-text:#52c41a;--kep-platform-color-success-text-active:#389e0d;--kep-platform-color-error-bg:#fff2f0;--kep-platform-color-error-bg-hover:#fff1f0;--kep-platform-color-error-bg-active:#ffccc7;--kep-platform-color-error-border:#ffccc7;--kep-platform-color-error-border-hover:#ffa39e;--kep-platform-color-error-hover:#ff7875;--kep-platform-color-error-active:#d9363e;--kep-platform-color-error-text-hover:#ff7875;--kep-platform-color-error-text:#ff4d4f;--kep-platform-color-error-text-active:#d9363e;--kep-platform-color-warning-bg:#fffbe6;--kep-platform-color-warning-bg-hover:#fff1b8;--kep-platform-color-warning-border:#ffe58f;--kep-platform-color-warning-border-hover:#ffd666;--kep-platform-color-warning-hover:#ffd666;--kep-platform-color-warning-active:#d48806;--kep-platform-color-warning-text-hover:#ffc53d;--kep-platform-color-warning-text:#faad14;--kep-platform-color-warning-text-active:#d48806;--kep-platform-color-info-bg:#e6f4ff;--kep-platform-color-info-bg-hover:#bae0ff;--kep-platform-color-info-border:#91caff;--kep-platform-color-info-border-hover:#69b1ff;--kep-platform-color-info-hover:#69b1ff;--kep-platform-color-info-active:#0958d9;--kep-platform-color-info-text-hover:#4096ff;--kep-platform-color-info-text:#1677ff;--kep-platform-color-info-text-active:#0958d9;--kep-platform-color-link-hover:#69b1ff;--kep-platform-color-link-active:#0958d9;--kep-platform-color-bg-mask:rgba(0,0,0,0.45);--kep-platform-color-white:#fff;--kep-platform-color-fill-content:rgba(0,0,0,0.06);--kep-platform-color-fill-content-hover:rgba(0,0,0,0.15);--kep-platform-color-fill-alter:rgba(0,0,0,0.02);--kep-platform-color-bg-container-disabled:rgba(0,0,0,0.04);--kep-platform-color-border-bg:#ffffff;--kep-platform-color-scrollbar-thumb:var(--kep-platform-color-border);--kep-platform-color-scrollbar-thumb-hover:var(--kep-platform-color-primary-hover);--kep-platform-color-split:rgba(5,5,5,0.06);--kep-platform-color-table-border:#f0f0f0;--kep-platform-color-text-placeholder:rgba(0,0,0,0.25);--kep-platform-color-text-disabled:rgba(0,0,0,0.25);--kep-platform-color-text-heading:rgba(0,0,0,0.88);--kep-platform-color-text-label:rgba(0,0,0,0.65);--kep-platform-color-text-description:rgba(0,0,0,0.45);--kep-platform-color-text-light-solid:#fff;--kep-platform-color-highlight:#ff4d4f;--kep-platform-color-bg-text-hover:rgba(0,0,0,0.06);--kep-platform-color-bg-text-active:rgba(0,0,0,0.15);--kep-platform-color-icon:rgba(0,0,0,0.45);--kep-platform-color-icon-hover:rgba(0,0,0,0.88);--kep-platform-color-error-outline:rgba(255,38,5,0.06);--kep-platform-color-warning-outline:rgba(255,215,5,0.1);--kep-platform-control-item-bg-hover:rgba(0,0,0,0.04);--kep-platform-control-item-bg-active:#e6f4ff;--kep-platform-control-item-bg-active-hover:#bae0ff;--kep-platform-control-item-bg-active-disabled:rgba(0,0,0,0.15);--kep-platform-control-tmp-outline:rgba(0,0,0,0.02);--kep-platform-control-outline:rgba(5,145,255,0.1);--kep-platform-box-shadow:0 6px 16px 0 rgba(0,0,0,0.08),0 3px 6px -4px rgba(0,0,0,0.12),0 9px 28px 8px rgba(0,0,0,0.05);--kep-platform-box-shadow-inset:inset  10px 0 8px -8px rgba(0,0,0,0.08);--kep-platform-box-shadow-secondary:0 6px 16px 0 rgba(0,0,0,0.08),0 3px 6px -4px rgba(0,0,0,0.12),0 9px 28px 8px rgba(0,0,0,0.05);--kep-platform-box-shadow-tertiary:0 1px 2px 0 rgba(0,0,0,0.03),0 1px 6px -1px rgba(0,0,0,0.02),0 2px 4px 0 rgba(0,0,0,0.02);--kep-platform-box-shadow-popover-arrow:2px 2px 5px rgba(0,0,0,0.05);--kep-platform-box-shadow-card:0 1px 2px -2px rgba(0,0,0,0.16),0 3px 6px 0 rgba(0,0,0,0.12),0 5px 12px 4px rgba(0,0,0,0.09);--kep-platform-box-shadow-mask:var(--kep-platform-box-shadow-tertiary);--kep-platform-box-shadow-drawer-right:-6px 0 16px 0 rgba(0,0,0,0.08),-3px 0 6px -4px rgba(0,0,0,0.12),-9px 0 28px 8px rgba(0,0,0,0.05);--kep-platform-box-shadow-drawer-left:6px 0 16px 0 rgba(0,0,0,0.08),3px 0 6px -4px rgba(0,0,0,0.12),9px 0 28px 8px rgba(0,0,0,0.05);--kep-platform-box-shadow-drawer-up:0 6px 16px 0 rgba(0,0,0,0.08),0 3px 6px -4px rgba(0,0,0,0.12),0 9px 28px 8px rgba(0,0,0,0.05);--kep-platform-box-shadow-drawer-down:0 -6px 16px 0 rgba(0,0,0,0.08),0 -3px 6px -4px rgba(0,0,0,0.12),0 -9px 28px 8px rgba(0,0,0,0.05);--kep-platform-color-tree-node-hover:#fafafa;--kep-platform-color-bg-active:#e6f4ff;--kep-platform-box-shadow-tabs-overflow-left:inset 10px 0 8px -8px rgba(0,0,0,0.08);--kep-platform-box-shadow-tabs-overflow-right:inset -10px 0 8px -8px rgba(0,0,0,0.08);--kep-platform-box-shadow-tabs-overflow-top:inset 0 10px 8px -8px rgba(0,0,0,0.08);--kep-platform-box-shadow-tabs-overflow-bottom:inset 0 -10px 8px -8px rgba(0,0,0,0.08);--kep-platform-header-bg:#fafafa;--kep-platform-color-scrollbar-track:#fafafa;--kep-platform-motion-ease-out-circ:cubic-bezier(0.08,0.82,0.17,1);--kep-platform-motion-ease-in-out-circ:cubic-bezier(0.78,0.14,0.15,0.86);--kep-platform-motion-ease-out:cubic-bezier(0.215,0.61,0.355,1);--kep-platform-motion-ease-in-out:cubic-bezier(0.645,0.045,0.355,1);--kep-platform-motion-ease-out-back:cubic-bezier(0.12,0.4,0.29,1.46);--kep-platform-motion-ease-in-back:cubic-bezier(0.71,-0.46,0.88,0.6);--kep-platform-motion-ease-in-quint:cubic-bezier(0.755,0.05,0.855,0.06);--kep-platform-motion-ease-out-quint:cubic-bezier(0.23,1,0.32,1);--kep-platform-motion-duration-fast:0.1s;--kep-platform-motion-duration-mid:0.2s;--kep-platform-motion-duration-slow:0.3s;--kep-platform-font-size:16px;--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';--kep-platform-font-family-code:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,Courier,monospace;--kep-platform-font-size-sm:14px;--kep-platform-font-size-lg:18px;--kep-platform-font-size-xl:20px;--kep-platform-font-size-heading-1:38px;--kep-platform-font-size-heading-2:30px;--kep-platform-font-size-heading-3:24px;--kep-platform-font-size-heading-4:20px;--kep-platform-font-size-heading-5:16px;--kep-platform-font-height:22px;--kep-platform-font-height-lg:24px;--kep-platform-font-height-sm:20px;--kep-platform-font-weight-base:400;--kep-platform-font-weight-strong:600;--kep-platform-link-decoration:none;--kep-platform-link-hover-decoration:none;--kep-platform-link-focus-decoration:none;--kep-platform-line-width:1px;--kep-platform-line-type:solid;--kep-platform-line-height:1.5714285714285714;--kep-platform-line-height-lg:1.5;--kep-platform-line-height-sm:1.6666666666666667;--kep-platform-line-height-heading-1:1.2105263157894737;--kep-platform-line-height-heading-2:1.2666666666666666;--kep-platform-line-height-heading-3:1.3333333333333333;--kep-platform-line-height-heading-4:1.4;--kep-platform-line-height-heading-5:1.5;--kep-platform-line-width-bold:2px;--kep-platform-font-size-icon:12px;--kep-platform-font-size-code:12px;--kep-platform-text-align:left;--kep-platform-border-radius:6px;--kep-platform-border-radius-xs:2px;--kep-platform-border-radius-sm:4px;--kep-platform-border-radius-lg:8px;--kep-platform-border-radius-outer:4px;--kep-platform-z-index-base:0;--kep-platform-z-index-popup-base:1000;--kep-platform-z-index-fixed:5;--kep-platform-opacity-loading:0.65;--kep-platform-control-padding-horizontal:12px;--kep-platform-control-padding-horizontal-sm:8px;--kep-platform-padding-xxs:4px;--kep-platform-padding-xs:8px;--kep-platform-padding-sm:12px;--kep-platform-padding:16px;--kep-platform-padding-md:20px;--kep-platform-padding-lg:24px;--kep-platform-padding-xl:32px;--kep-platform-padding-block-sm:0;--kep-platform-padding-block:4px;--kep-platform-padding-block-lg:7px;--kep-platform-padding-inline-sm:7px;--kep-platform-padding-inline:15px;--kep-platform-padding-inline-lg:15px;--kep-platform-padding-content-horizontal-lg:24px;--kep-platform-padding-content-vertical-lg:16px;--kep-platform-padding-content-horizontal:16px;--kep-platform-padding-content-vertical:12px;--kep-platform-padding-content-horizontal-sm:16px;--kep-platform-padding-content-vertical-sm:8px;--kep-platform-margin-xxxs:2px;--kep-platform-margin-xxs:4px;--kep-platform-margin-xs:8px;--kep-platform-margin-sm:12px;--kep-platform-margin:16px;--kep-platform-margin-md:20px;--kep-platform-margin-lg:24px;--kep-platform-margin-xl:32px;--kep-platform-margin-xxl:48px;--kep-platform-width-scrollbar:8px;--kep-platform-height-scrollbar:8px;--kep-platform-menu-item-height:40px;--kep-platform-menu-item-line-height:40px;}*,*::before,*::after{box-sizing:border-box;}body{margin:0;font-family:var(--kep-platform-font-family);font-size:var(--kep-platform-font-size);font-weight:var(--kep-platform-font-weight-base);line-height:var(--kep-platform-line-height);color:var(--kep-platform-color-text);text-align:var(--kep-platform-text-align);background-color:var(--kep-platform-color-bg-base);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:var(--kep-platform-black);}[tabindex='-1']:focus:not(:focus-visible){outline:0 !important;}hr{margin:--kep-platform-margin-sm 0;height:var(--kep-platform-line-width);color:var(--kep-platform-color-border);background-color:currentColor;border:0;}hr:not([size]){height:var(--kep-platform-line-width);}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:0;font-family:var(--kep-platform-font-family);font-style:var(--kep-platform-link-decoration);font-weight:var(--kep-platform-font-weight-strong);line-height:var(--kep-platform-line-height);color:var(--kep-platform-color-text-secondary);}h1{font-size:var(--kep-platform-font-size-heading-1);}h2{font-size:var(--kep-platform-font-size-heading-2);}h3{font-size:var(--kep-platform-font-size-heading-3);}h4{font-size:var(--kep-platform-font-size-heading-4);}h5{font-size:var(--kep-platform-font-size-heading-5);}h6{font-size:var(--kep-platform-font-size-heading-6);}p{margin-top:0;margin-bottom:0 !important;}abbr[title],abbr[data-original-title]{text-decoration:underline;text-decoration:underline dotted;cursor:help;text-decoration-skip-ink:none;}address{margin-bottom:1rem;font-style:normal;line-height:inherit;}ol,ul{padding-left:0;list-style:none;}ol,ul,dl{margin-top:0;margin-bottom:0;}ol ol,ul ul,ol ul,ul ol{margin-bottom:0;}dt{font-weight:var(--kep-platform-font-weight-base);}dd{margin-bottom:0.5rem;margin-left:0;}blockquote{margin:0 0 1rem;}b,strong{font-weight:var(--kep-platform-font-weight-strong);}small{font-size:var(--kep-platform-font-size-sm);}sub,sup{position:relative;font-size:var(--kep-platform-font-size-sm);line-height:0;vertical-align:baseline;}sub{bottom:-0.25em;}sup{top:-0.5em;}a{color:var(--kep-platform-color-link);text-decoration:var(--kep-platform-link-decoration);cursor:pointer;&:hover{color:var(--kep-platform-color-link-hover);text-decoration:--kep-platform-link-hover-decoration}}pre,code,kbd,samp{font-family:var(--kep-platform-font-family-code);font-size:var(--kep-platform-font-size-code);}pre{display:block;margin-top:0;margin-bottom:var(--kep-platform-margin);overflow:auto;font-size:var(--kep-platform-font-size-code);color:var(--kep-platform-color-text-label);code{font-size:inherit;color:inherit;word-break:normal;}}code{font-size:var(--kep-platform-font-size-code);color:var(--kep-platform-color-text-quaternary);word-wrap:break-word;a > &{color:inherit;}}figure{margin:0 0 1rem;}img{vertical-align:middle;}svg{overflow:hidden;vertical-align:middle;}table{border-collapse:collapse;}caption{padding-top:0.5rem;padding-bottom:0.5rem;color:var(--kep-platform-color-text-secondary);text-align:left;caption-side:bottom;}th{text-align:inherit;}label{display:inline-block;margin-bottom:0.5rem;}button{border-radius:0;}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit;}button,input{overflow:visible;}button,select{text-transform:none;}select{word-wrap:normal;}[list]::-webkit-calendar-picker-indicator{display:none;}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{appearance:button;&:not(:disabled){cursor:pointer;}}button:focus{outline:none;}input:focus{outline:none;}::-moz-focus-inner{padding:0;border-style:none;}input[type='date'],input[type='time'],input[type='datetime-local'],input[type='month']{appearance:textfield;}::-webkit-scrollbar{width:var(--kep-platform-width-scrollbar);height:var(--kep-platform-height-scrollbar);}::-webkit-scrollbar-track{border-radius:var(--kep-platform-border-radius);background-color:var(--kep-platform-color-scrollbar-track);}::-webkit-scrollbar-thumb{background-color:var(--kep-platform-color-scrollbar-thumb);border-radius:var(--kep-platform-border-radius);}::-webkit-scrollbar-thumb:hover{background-color:var(--kep-platform-color-scrollbar-thumb-hover);}textarea{overflow:auto;resize:vertical;}fieldset{min-width:0;padding:0;margin:0;border:0;}legend{float:left;width:100%;padding:0;margin-bottom:var(--kep-platform-margin);font-size:var(--kep-platform-font-size);font-weight:var(--kep-platform-font-weight-base);line-height:inherit;color:inherit;white-space:normal;}mark{padding:var(--kep-platform-padding-sm);background-color:var(--kep-platform-padding-sm);}progress{vertical-align:baseline;}::-webkit-datetime-edit{overflow:visible;line-height:0;}[type='search']{outline-offset:-2px;appearance:textfield;}::-webkit-search-decoration{-webkit-appearance:none;}::-webkit-color-swatch-wrapper{padding:0;}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button;}output{display:inline-block;}summary{display:list-item;cursor:pointer;}template{display:none;}main{display:block;}[hidden]{display:none !important;}", ""], function (props) {
+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) {
   return props.$css;
 });
 export default GlobalStyles;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@kep-platform/basic-component",
-    "version": "0.0.44",
+    "version": "0.0.46",
     "description": "A react library developed with dumi",
     "license": "MIT",
     "module": "dist/index.js",
@@ -47,10 +47,9 @@
     },
     "dependencies": {
         "@ant-design/icons": "^5.3.7",
-        "@kep-platform/hooks": "^0.0.44",
+        "@kep-platform/hooks": "^0.0.46",
         "color": "^4.2.3",
-        "rc-pagination": "^4.1.0",
-        "styled-components": "^6.1.11"
+        "rc-pagination": "^4.1.0"
     },
     "devDependencies": {
         "@babel/runtime": "^7.24.6",
@@ -79,13 +78,14 @@
         "mobx": "^6.12.3",
         "mobx-react-lite": "^4.0.7",
         "react": ">=16.9.0",
-        "react-dom": ">=16.9.0"
+        "react-dom": ">=16.9.0",
+        "styled-components": "^6.1.11"
     },
     "publishConfig": {
         "access": "public"
     },
     "authors": [
-        "lee-step-jss 1599925910@qq.com"
+        "less-step-jss 1599925910@qq.com"
     ],
-    "gitHead": "d7ee92047ae7296763e391b3f01553d4105500bb"
+    "gitHead": "a68fe348236a6319c9232ac8d12e9cd567c1fe91"
 }