@kep-platform/basic-component 0.0.5 → 0.0.10

package/dist/@types/index.d.ts

@@ -1,11 +1,12 @@
 import { keyframes } from 'styled-components';
+import { PaginationProps } from '../Pagination';
 declare global {
     type SizeType = 'small' | 'large' | 'middle';
     type Keyframes = ReturnType<typeof keyframes>;
     type Direction = 'row' | 'column' | 'row-reverse' | 'column-reverse';
     type ListItemRender = (record: any, index: number) => ReactNode;
     type Align = 'left' | 'right' | 'center';
-    type Pagination = { current: number; size: number };
+    type Pagination = PaginationProps;
     type ColumnRender = (value: any, record: Record<string, any>, index: number) => ReactNode;
     type ColumnType = {
         key: string;

package/dist/Button/Button.js

@@ -33,7 +33,7 @@ var StyledButton = styled('button').withConfig({
     case 'danger':
       return css(["color:var(--kep-platform-color-white);border-color:transparent;background-color:var(--kep-platform-red);"]);
     case 'default':
-      return css(["color:", ";border-color:", ";background-color:", ";&:hover{border-color:", ";color:", ";}"], theme.color, theme.secondaryColor, theme.backgroundColor, theme.primaryColor, theme.primaryColor);
+      return css(["color:", ";border-color:var(--kep-platform-color-border);background-color:", ";&:hover{border-color:var(--kep-platform-color-primary);color:var(--kep-platform-color-primary);}"], theme.color, theme.backgroundColor);
     case 'primary':
       return css(["color:", ";border-color:transparent;background-color:", ";"], theme.backgroundColor, theme.primaryColor);
   }

package/dist/Pagination/Pagination.d.ts

@@ -0,0 +1,7 @@
+import { type PaginationProps as RCPaginationProps } from 'rc-pagination';
+import React from 'react';
+declare const Pagination: ({ justifyContent, ...rest }: PaginationProps) => React.JSX.Element;
+export default Pagination;
+export type PaginationProps = {
+    justifyContent?: string;
+} & RCPaginationProps;

package/dist/Pagination/Pagination.js

@@ -0,0 +1,44 @@
+var _excluded = ["justifyContent"];
+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; }
+import RCPagination from 'rc-pagination';
+import React from 'react';
+import styled from 'styled-components';
+import { Button } from "../Button";
+import { Select } from "../Select";
+var StyledRCPagination = styled(RCPagination).withConfig({
+  displayName: "StyledRCPagination",
+  componentId: "basic-component-347b__sc-11dkd3-0"
+})(["list-style:none;display:flex;justify-content:", ";align-items:center;& > *{margin:0 var(--kep-platform-margin-xxs);}& .rc-pagination-item{cursor:pointer;padding:var(--kep-platform-padding-xxs) var(--kep-platform-padding-xs);border:1px solid transparent;border-radius:var(--kep-platform-border-radius-sm);& a{color:var(--kep-platform-color-text);}&:hover{background-color:var(--kep-platform-color-bg-hover);}&.rc-pagination-item-active{border:1px solid var(--kep-platform-color-primary);a{color:var(--kep-platform-color-primary);}}}& .rc-pagination-prev{}& .rc-pagination-disabled{}& .rc-pagination-next{}& .rc-pagintaion-options{}& .rc-pagination-jump-next{}& .rc-pagination-options-quick-jumper{& input{margin:0 var(--kep-platform-margin-xs);border-radius:var(--kep-platform-border-radius-sm);border:1px solid var(--kep-platform-color-border);padding:var(--kep-platform-padding-xxs) var(--kep-platform-padding-xs);&:active,&:focus{border-color:var(--kep-platform-color-primary);}}}"], function (props) {
+  return props.justifyContent;
+});
+var Pagination = function Pagination(_ref) {
+  var _ref$justifyContent = _ref.justifyContent,
+    justifyContent = _ref$justifyContent === void 0 ? 'left' : _ref$justifyContent,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(StyledRCPagination, _extends({
+    justifyContent: justifyContent
+  }, rest, {
+    nextIcon: function nextIcon() {
+      return /*#__PURE__*/React.createElement(Button, null, "\u4E0B\u4E00\u9875");
+    },
+    prevIcon: function prevIcon() {
+      return /*#__PURE__*/React.createElement(Button, null, "\u4E0A\u4E00\u9875");
+    },
+    jumpNextIcon: function jumpNextIcon() {
+      return /*#__PURE__*/React.createElement("span", {
+        className: "rc-pagination-item"
+      }, "...");
+    },
+    jumpPrevIcon: function jumpPrevIcon() {
+      return /*#__PURE__*/React.createElement("span", {
+        className: "rc-pagination-item"
+      }, "...");
+    },
+    totalBoundaryShowSizeChanger: 1,
+    showSizeChanger: true,
+    selectComponentClass: Select
+  }));
+};
+export default Pagination;

package/dist/Pagination/index.d.ts

@@ -0,0 +1 @@
+export { default as Pagination, type PaginationProps } from './Pagination';

package/dist/Pagination/index.js

@@ -0,0 +1 @@
+export { default as Pagination } from "./Pagination";

package/dist/Select/Select.d.ts

@@ -0,0 +1,13 @@
+import React, { ReactNode } from 'react';
+export type SelectOption = {
+    label: ReactNode;
+    value: string;
+};
+export type SelectProps = {
+    multiple?: boolean;
+    options?: SelectOption[];
+    value?: string;
+    onChange?: (value: string) => void;
+    children?: ReactNode;
+};
+export default function Select(props: SelectProps): React.JSX.Element;

package/dist/Select/Select.js

@@ -0,0 +1,121 @@
+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."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { useClickOutsize } from '@kep-platform/hooks';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import styled, { css, keyframes } from 'styled-components';
+import { List, ListItem } from "../List";
+var SelectContainer = styled.div.withConfig({
+  displayName: "SelectContainer",
+  componentId: "basic-component-347b__sc-z3izsh-0"
+})(["width:200px;position:relative;"]);
+var SelectTrigger = styled.div.withConfig({
+  displayName: "SelectTrigger",
+  componentId: "basic-component-347b__sc-z3izsh-1"
+})(["display:flex;height:40px;line-height:calc(40px - 2 * var(--kep-platform-padding-xxs));border:1px solid var(--kep-platform-color-border);border-radius:var(--kep-platform-border-radius);padding:var(--kep-platform-padding-xxs) var(--kep-platform-padding-xs);"]);
+var SelectInput = styled.input.withConfig({
+  displayName: "SelectInput",
+  componentId: "basic-component-347b__sc-z3izsh-2"
+})(["border-width:0;"]);
+var fadeIn = keyframes(["0%{opacity:0;}100%{opacity:1;}"]);
+var SelectPannel = styled.div.withConfig({
+  displayName: "SelectPannel",
+  componentId: "basic-component-347b__sc-z3izsh-3"
+})(["position:absolute;left:0;top:40px;width:100%;box-shadow:var(--kep-platform-box-shadow);border-radius:var(--kep-platform-border-radius);z-index:var(--kep-platform-z-index-popup-base);", ""], function (props) {
+  if (props.visible) {
+    return css(["animation:", " 0.3s ease-in;"], fadeIn);
+  } else {
+    return css(["visibility:hidden;"]);
+  }
+});
+var SelectList = styled(List).withConfig({
+  displayName: "SelectList",
+  componentId: "basic-component-347b__sc-z3izsh-4"
+})([""]);
+var SelectListItem = styled(ListItem).withConfig({
+  displayName: "SelectListItem",
+  componentId: "basic-component-347b__sc-z3izsh-5"
+})(["background-color:var(--kep-platform-color-bg-base);border-radius:var(--kep-platform-border-radius-sm);margin:var(--kep-platform-margin-xxxs);padding:0 var(--kep-platform-padding-xs);height:var(--kep-platform-menu-item-height);line-height:var(--kep-platform-menu-item-line-height);&:hover{background-color:var(--kep-platform-color-bg-hover);}", ""], function (props) {
+  if (props.active) {
+    return css(["background-color:var(--kep-platform-color-bg-active) !important;color:var(--kep-platform-color-text-active) !important;"]);
+  }
+});
+export default function Select(props) {
+  var options = props.options,
+    value = props.value,
+    onChange = props.onChange,
+    children = props.children;
+  var _useState = useState(value),
+    _useState2 = _slicedToArray(_useState, 2),
+    localValue = _useState2[0],
+    setLocalValue = _useState2[1];
+  var _useState3 = useState(value),
+    _useState4 = _slicedToArray(_useState3, 2),
+    inputValue = _useState4[0],
+    setInputValue = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    pannelVisible = _useState6[0],
+    setPannelVisible = _useState6[1];
+  var pannel = useRef(null);
+  var mergeValue = useMemo(function () {
+    if (value === undefined) {
+      return localValue;
+    } else {
+      return value;
+    }
+  }, [value, localValue]);
+  useEffect(function () {
+    setInputValue(mergeValue);
+  }, [mergeValue]);
+  var selectListItemClickHandler = useCallback(function (e) {
+    var dataKey = e.target.getAttribute('data-key');
+    setLocalValue(dataKey);
+    onChange === null || onChange === void 0 || onChange(dataKey);
+    setPannelVisible(false);
+  }, []);
+  useClickOutsize('click', pannel, function () {
+    setPannelVisible(false);
+    setInputValue(mergeValue);
+  });
+  var selectItems = useMemo(function () {
+    if (options) {
+      return options === null || options === void 0 ? void 0 : options.map(function (option) {
+        return /*#__PURE__*/React.createElement(SelectListItem, {
+          key: option.value,
+          active: option.value === mergeValue,
+          "data-key": option.value,
+          onClick: selectListItemClickHandler
+        }, option.label);
+      });
+    } else {
+      return React.Children.map(children, function (child) {
+        return /*#__PURE__*/React.createElement(SelectListItem, {
+          key: child.props.value,
+          "data-key": child.props.value,
+          active: child.props.value === mergeValue,
+          onClick: selectListItemClickHandler
+        }, child.props.children);
+      });
+    }
+  }, [options, children, mergeValue]);
+  return /*#__PURE__*/React.createElement(SelectContainer, null, /*#__PURE__*/React.createElement(SelectTrigger, {
+    onClick: function onClick(e) {
+      e.stopPropagation();
+      setPannelVisible(true);
+    }
+  }, /*#__PURE__*/React.createElement(SelectInput, {
+    onChange: function onChange(e) {
+      setInputValue(e.target.value);
+    },
+    value: inputValue
+  })), /*#__PURE__*/React.createElement(SelectPannel, {
+    visible: pannelVisible,
+    ref: pannel
+  }, /*#__PURE__*/React.createElement(SelectList, {
+    direction: "column"
+  }, selectItems)));
+}

package/dist/Select/index.d.ts

@@ -0,0 +1 @@
+export { default as Select, type SelectProps } from './Select';

package/dist/Select/index.js

@@ -0,0 +1 @@
+export { default as Select } from "./Select";

package/dist/Spin/Spin.d.ts

@@ -0,0 +1,6 @@
+import React, { ReactNode } from 'react';
+export type SpinProps = {
+    spinning: boolean;
+    children: ReactNode;
+};
+export default function Spin(props: SpinProps): React.JSX.Element;

package/dist/Spin/Spin.js

@@ -0,0 +1,17 @@
+import LoadingOutlined from '@ant-design/icons/LoadingOutlined';
+import React from 'react';
+import styled from 'styled-components';
+var SpinContainer = styled.div.withConfig({
+  displayName: "SpinContainer",
+  componentId: "basic-component-347b__sc-1s1g2fa-0"
+})(["position:relative;"]);
+var SpinMark = styled.div.withConfig({
+  displayName: "SpinMark",
+  componentId: "basic-component-347b__sc-1s1g2fa-1"
+})(["position:absolute;inset:0 0 0 0;background-color:rgba(255,255,255,0.5);display:flex;justify-content:center;align-items:center;"]);
+export default function Spin(props) {
+  return /*#__PURE__*/React.createElement(SpinContainer, null, props.children, /*#__PURE__*/React.createElement(SpinMark, {
+    spinning: props.spinning,
+    hidden: !props.spinning
+  }, /*#__PURE__*/React.createElement(LoadingOutlined, null)));
+}

package/dist/Spin/index.d.ts

@@ -0,0 +1 @@
+export { default as Spin, type SpinProps } from './Spin';

package/dist/Spin/index.js

@@ -0,0 +1 @@
+export { default as Spin } from "./Spin";

package/dist/Table/Table.d.ts

@@ -11,6 +11,7 @@ export type TableProps = {
     onChange?: (pagination?: Pagination, sorter?: SorterDesc, fitler?: FilterDesc) => void;
     headerRender?: (column: ColumnType) => ReactNode;
     groupBy?: string;
+    pagination?: Pagination;
 };
-export default function Table({ columns, dataSource, rowKey, actions, title, scroll, onChange, headerRender, }: TableProps): React.JSX.Element;
+export default function Table({ columns, dataSource, rowKey, actions, title, scroll, onChange, headerRender, pagination, }: TableProps): React.JSX.Element;
 export {};

package/dist/Table/Table.js

@@ -1,5 +1,6 @@
 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); }
 var _excluded = ["render"];
+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 _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; }
@@ -20,6 +21,7 @@ import { Column, Columns } from "../Columns";
 import { DefaultColumnWidth } from "../Columns/Columns";
 import { Col, Row } from "../Grid";
 import { List, ListItem } from "../List";
+import { Pagination } from "../Pagination";
 import { Space } from "../Space";
 var TableContainer = styled.div.withConfig({
   displayName: "TableContainer",
@@ -128,8 +130,13 @@ export default function Table(_ref3) {
     actions = _ref3.actions,
     title = _ref3.title,
     scroll = _ref3.scroll,
-    onChange = _ref3.onChange,
-    headerRender = _ref3.headerRender;
+    _onChange2 = _ref3.onChange,
+    headerRender = _ref3.headerRender,
+    _ref3$pagination = _ref3.pagination,
+    pagination = _ref3$pagination === void 0 ? {
+      current: 1,
+      pageSize: 10
+    } : _ref3$pagination;
   var _useState = useState(null),
     _useState2 = _slicedToArray(_useState, 2),
     sorterController = _useState2[0],
@@ -142,22 +149,19 @@ export default function Table(_ref3) {
         column: column,
         onSorterChange: function onSorterChange(sorter) {
           var key = column.key;
-          if (onChange) {
-            onChange === null || onChange === void 0 || onChange(undefined, _defineProperty({}, key, sorter), undefined);
-          } else {
-            setSorterController({
-              columnKey: column.key,
-              sorterType: sorter
-            });
-          }
+          _onChange2 === null || _onChange2 === void 0 || _onChange2(undefined, _defineProperty({}, key, sorter), undefined);
+          setSorterController({
+            columnKey: column.key,
+            sorterType: sorter
+          });
         },
         title: (headerRender === null || headerRender === void 0 ? void 0 : headerRender(column)) || column.title,
-        sorterType: (sorterController === null || sorterController === void 0 ? void 0 : sorterController.columnKey) === column.key ? sorterController.sorterType : undefined,
+        sorterType: (sorterController === null || sorterController === void 0 ? void 0 : sorterController.columnKey) === column.key ? sorterController === null || sorterController === void 0 ? void 0 : sorterController.sorterType : undefined,
         hasSorter: !!column.sorter
       });
     });
     return data;
-  }, [columns, onChange, sorterController, setSorterController]);
+  }, [columns, _onChange2, sorterController, setSorterController]);
   var boxShadowBox = useRef(null);
   var headerColumns = useMemo(function () {
     return columns.map(function (column) {
@@ -226,5 +230,14 @@ export default function Table(_ref3) {
       columns: columns,
       isFlex: !scroll
     }));
-  }))));
+  }))), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Pagination, _extends({}, pagination, {
+    total: pagination.total || dataSource.length,
+    justifyContent: "right",
+    onChange: function onChange(current, pageSize) {
+      _onChange2 === null || _onChange2 === void 0 || _onChange2({
+        current: current,
+        pageSize: pageSize
+      });
+    }
+  })));
 }

package/dist/__styles/GlobalStyles.js

@@ -1,6 +1,6 @@
 // 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:#fafafa;--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-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:10;--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([":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-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:10;--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) {
   return props.$css;
 });
 export default GlobalStyles;

package/dist/index.d.ts

@@ -5,7 +5,10 @@ export * from './Grid';
 export * from './Indent';
 export * from './List';
 export * from './Menu';
+export * from './Pagination';
+export * from './Select';
 export * from './Space';
+export * from './Spin';
 export * from './Table';
 export * from './Tree';
 export * from './__styles';

package/dist/index.js

@@ -5,7 +5,10 @@ export * from "./Grid";
 export * from "./Indent";
 export * from "./List";
 export * from "./Menu";
+export * from "./Pagination";
+export * from "./Select";
 export * from "./Space";
+export * from "./Spin";
 export * from "./Table";
 export * from "./Tree";
 export * from "./__styles";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kep-platform/basic-component",
-  "version": "0.0.5",
+  "version": "0.0.10",
   "description": "A react library developed with dumi",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -74,11 +74,12 @@
     "react-dom": "^18.0.0",
     "stylelint": "^14.9.1"
   },
-  "gitHead": "681747f260aba6086e6e27d64c7c07578c054fbd",
+  "gitHead": "575a10d0cdee60ceb925d11ee5ac6657c93dec9d",
   "dependencies": {
     "@ant-design/icons": "^5.3.7",
-    "@kep-platform/hooks": "^0.0.5",
+    "@kep-platform/hooks": "^0.0.10",
     "color": "^4.2.3",
+    "rc-pagination": "^4.1.0",
     "styled-components": "^6.1.11"
   }
 }