@kep-platform/basic-component 0.0.24 → 0.0.27

Sign up to get free protection for your applications and to get access to all the features.
@@ -21,6 +21,7 @@ declare global {
21
21
  right?: string;
22
22
  bordered?: boolean;
23
23
  sorter?: boolean | SorterFunc;
24
+ filter?: boolean;
24
25
  };
25
26
  type SorterFunc = (a: any, b: any) => number;
26
27
  type Sorter = 'desc' | 'asc' | undefined;
@@ -57,4 +58,15 @@ declare global {
57
58
  nativeEvent: React.MouseEvent;
58
59
  },
59
60
  ) => void;
61
+ type RowSelection = {
62
+ selectedKeys?: Key[];
63
+ onSelect: (
64
+ keys: Key[],
65
+ info: {
66
+ type: 'row' | 'all';
67
+ selected: boolean;
68
+ nativeEvent: React.ChangeEvent;
69
+ },
70
+ ) => void;
71
+ };
60
72
  }
@@ -4,5 +4,7 @@ export type BoxShadowBoxProps = {
4
4
  offsetLeft?: string;
5
5
  height: string;
6
6
  };
7
- declare const BoxShadowBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, BoxShadowBoxProps>> & string;
7
+ declare const BoxShadowBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
8
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
9
+ }, BoxShadowBoxProps>> & string;
8
10
  export default BoxShadowBox;
@@ -1,5 +1,9 @@
1
1
  import styled from 'styled-components';
2
- var BoxShadowBox = styled.div.withConfig({
2
+ var BoxShadowBox = styled('div').withConfig({
3
+ shouldForwardProp: function shouldForwardProp(prop) {
4
+ return !['offsetLeft'].includes(prop);
5
+ }
6
+ }).withConfig({
3
7
  displayName: "BoxShadowBox",
4
8
  componentId: "basic-component-347b__sc-18cvhyx-0"
5
9
  })(["z-index:", ";width:", ";box-shadow:var(--kep-platform-box-shadow-inset);background-color:transparent;position:absolute;top:0;left:", ";height:", ";transition:opacity 0.5s;"], function (props) {
@@ -1,4 +1,5 @@
1
1
  import React, { HtmlHTMLAttributes } from 'react';
2
+ import { ListItemProps } from '../List/List';
2
3
  export declare const DefaultColumnWidth = 200;
3
4
  export type ColumnsProps = {
4
5
  columns: ColumnType[];
@@ -8,9 +9,12 @@ export type ColumnsProps = {
8
9
  leftBase?: number;
9
10
  columnsKey?: string;
10
11
  } & HtmlHTMLAttributes<HTMLUListElement>;
11
- export declare const Column: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>, "ref"> & {
12
- ref?: ((instance: HTMLLIElement | null) => void) | React.RefObject<HTMLLIElement> | null | undefined;
13
- }, Omit<ColumnType, "render" | "dataIndex"> & {
12
+ export declare const Column: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<{
13
+ key: React.Key;
14
+ title?: React.ReactNode;
15
+ index?: number | undefined;
16
+ itemRender?: ListItemRender | undefined;
17
+ } & Omit<React.HtmlHTMLAttributes<HTMLLIElement>, "title">, Omit<ColumnType, "render" | "dataIndex"> & {
14
18
  key: React.Key;
15
19
  title?: React.ReactNode;
16
20
  index?: number | undefined;
@@ -18,8 +22,9 @@ export declare const Column: import("styled-components/dist/types").IStyledCompo
18
22
  } & Omit<React.HtmlHTMLAttributes<HTMLLIElement>, "title"> & {
19
23
  isFlex: boolean;
20
24
  bordered?: boolean | undefined;
25
+ focused?: boolean | undefined;
21
26
  } & {
22
27
  left?: string | undefined;
23
28
  right?: string | undefined;
24
- }>> & string;
29
+ }>> & string & Omit<React.FC<ListItemProps>, keyof React.Component<any, {}, any>>;
25
30
  export default function Columns({ columns, rowData, rowIndex, isFlex, leftBase, columnsKey, ...columnsRestProps }: ColumnsProps): React.JSX.Element;
@@ -10,7 +10,7 @@ export var DefaultColumnWidth = 200;
10
10
  //如果是flex模式的话,就不使用宽度来控制,而是直接交给flex布局
11
11
  var ColumnList = styled(List).withConfig({
12
12
  shouldForwardProp: function shouldForwardProp(prop) {
13
- return !['widthSum', 'isFlex'].includes(prop);
13
+ return !['widthSum', 'bordered', 'isFlex', 'rowIndex'].includes(prop);
14
14
  }
15
15
  }).withConfig({
16
16
  displayName: "ColumnList",
@@ -24,7 +24,7 @@ var ColumnList = styled(List).withConfig({
24
24
  });
25
25
  export var Column = styled(ListItem).withConfig({
26
26
  shouldForwardProp: function shouldForwardProp(prop) {
27
- return !['width', 'isFlex', 'border'].includes(prop);
27
+ return !['width', 'isFlex', 'bordered', 'hideInTable', 'filter', 'sorter', 'rowIndex', 'focused'].includes(prop);
28
28
  }
29
29
  }).withConfig({
30
30
  displayName: "Column",
@@ -52,6 +52,9 @@ export var Column = styled(ListItem).withConfig({
52
52
  if (props.fixed === 'right' && !props.isFlex) {
53
53
  return css(["right:", ";z-index:var(--kep-platform-z-index-fixed) - 1;"], props.right);
54
54
  }
55
+ if (props.focused) {
56
+ return css(["z-index:20 !important;"]);
57
+ }
55
58
  });
56
59
  var displayColumnsCache = {};
57
60
  export default function Columns(_ref) {
@@ -0,0 +1,6 @@
1
+ import React, { HtmlHTMLAttributes } from 'react';
2
+ export type InputProps = Omit<HtmlHTMLAttributes<HTMLInputElement>, 'onChange'> & {
3
+ value?: string;
4
+ onChange?: (value: string) => void;
5
+ };
6
+ export default function Input(props: InputProps): React.JSX.Element;
@@ -0,0 +1,21 @@
1
+ var _excluded = ["value", "onChange"];
2
+ 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); }
3
+ 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; }
4
+ 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; }
5
+ import React from 'react';
6
+ import styled from 'styled-components';
7
+ var StyledInput = styled.input.withConfig({
8
+ displayName: "StyledInput",
9
+ componentId: "basic-component-347b__sc-ojuww7-0"
10
+ })(["outline:none;box-shadow:none;border:1px solid var(--kep-platform-color-border);border-radius:var(--kep-platform-border-radius-sm);&:hover{border-color:var(--kep-platform-color-primary);}"]);
11
+ export default function Input(props) {
12
+ var value = props.value,
13
+ _onChange = props.onChange,
14
+ rest = _objectWithoutProperties(props, _excluded);
15
+ return /*#__PURE__*/React.createElement(StyledInput, _extends({}, rest, {
16
+ value: value,
17
+ onChange: function onChange(e) {
18
+ _onChange === null || _onChange === void 0 || _onChange(e.target.value);
19
+ }
20
+ }));
21
+ }
@@ -0,0 +1 @@
1
+ export { default as Input, type InputProps } from './Input';
@@ -0,0 +1 @@
1
+ export { default as Input } from "./Input";
@@ -14,6 +14,16 @@ export type ListItemProps = {
14
14
  index?: number;
15
15
  itemRender?: ListItemRender;
16
16
  } & Omit<HtmlHTMLAttributes<HTMLLIElement>, 'title'>;
17
- export declare const ListItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;
17
+ export declare const StyledLi: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
18
+ ref?: ((instance: HTMLLIElement | null) => void) | React.RefObject<HTMLLIElement> | null | undefined;
19
+ }, {
20
+ key: Key;
21
+ title?: ReactNode;
22
+ index?: number | undefined;
23
+ itemRender?: ListItemRender | undefined;
24
+ } & Omit<React.HtmlHTMLAttributes<HTMLLIElement>, "title"> & {
25
+ focused: boolean;
26
+ }>> & string;
27
+ export declare const ListItem: React.FC<ListItemProps>;
18
28
  declare const List: React.FC<ListProps>;
19
29
  export default List;
package/dist/List/List.js CHANGED
@@ -1,10 +1,18 @@
1
- var _excluded = ["items", "direction", "itemRender", "children"],
2
- _excluded2 = ["key", "title"];
1
+ var _excluded = ["onClick"],
2
+ _excluded2 = ["items", "direction", "itemRender", "children"],
3
+ _excluded3 = ["key", "title"];
3
4
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
5
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
6
+ 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."); }
7
+ 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); }
8
+ 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; }
9
+ 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; } }
10
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
4
11
  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; }
5
12
  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; }
6
- import React from 'react';
7
- import styled from 'styled-components';
13
+ import { useClickOutsize } from '@kep-platform/hooks';
14
+ import React, { useCallback, useRef, useState } from 'react';
15
+ import styled, { css } from 'styled-components';
8
16
 
9
17
  //因为UL自带有title属性
10
18
 
@@ -14,10 +22,40 @@ var StyledUL = styled.ul.withConfig({
14
22
  })(["display:flex;flex-direction:", ";"], function (props) {
15
23
  return props.direction || 'row';
16
24
  });
17
- export var ListItem = styled.li.withConfig({
18
- displayName: "ListItem",
25
+ export var StyledLi = styled('li').withConfig({
26
+ shouldForwardProp: function shouldForwardProp(prop) {
27
+ return !['focused'].includes(prop);
28
+ }
29
+ }).withConfig({
30
+ displayName: "StyledLi",
19
31
  componentId: "basic-component-347b__sc-1ombcxm-1"
20
- })(["flex:0 0 auto;"]);
32
+ })(["flex:0 0 auto;", ""], function (props) {
33
+ if (props.focused) {
34
+ return css(["z-index:20 !important;"]);
35
+ }
36
+ });
37
+ export var ListItem = function ListItem(props) {
38
+ var onClick = props.onClick,
39
+ rest = _objectWithoutProperties(props, _excluded);
40
+ var ref = useRef(null);
41
+ var _useState = useState(false),
42
+ _useState2 = _slicedToArray(_useState, 2),
43
+ focused = _useState2[0],
44
+ setFocused = _useState2[1];
45
+ var onClickHandler = useCallback(function (e) {
46
+ onClick === null || onClick === void 0 || onClick(e);
47
+ setFocused(true);
48
+ }, [onClick, setFocused]);
49
+ useClickOutsize('click', ref, function () {
50
+ setFocused(false);
51
+ });
52
+ return /*#__PURE__*/React.createElement(StyledLi, _extends({}, rest, {
53
+ title: "li",
54
+ focused: focused,
55
+ onClick: onClickHandler,
56
+ ref: ref
57
+ }));
58
+ };
21
59
 
22
60
  /* 理论上来说所有list相关的数据结构都应该交给List组件来完成,但是List组件只处理List结构不处理任何其他样式问题 */
23
61
  var List = function List(_ref) {
@@ -26,13 +64,13 @@ var List = function List(_ref) {
26
64
  direction = _ref$direction === void 0 ? 'row' : _ref$direction,
27
65
  itemRender = _ref.itemRender,
28
66
  children = _ref.children,
29
- rest = _objectWithoutProperties(_ref, _excluded);
67
+ rest = _objectWithoutProperties(_ref, _excluded2);
30
68
  return /*#__PURE__*/React.createElement(StyledUL, _extends({
31
69
  direction: direction
32
70
  }, rest), items && Array.isArray(items) ? items.map(function (item, index) {
33
71
  var key = item.key,
34
72
  title = item.title,
35
- rest = _objectWithoutProperties(item, _excluded2);
73
+ rest = _objectWithoutProperties(item, _excluded3);
36
74
  return /*#__PURE__*/React.createElement(ListItem, _extends({
37
75
  key: key
38
76
  }, rest), itemRender ? itemRender(item, index) : title);
@@ -12,5 +12,5 @@ declare namespace Menu {
12
12
  export declare function PopupMenu(props: MenuProps & {
13
13
  children: ReactNode;
14
14
  trigger?: TriggerType;
15
- }): React.JSX.Element | undefined;
15
+ }): React.JSX.Element;
16
16
  export default Menu;
package/dist/Menu/Menu.js CHANGED
@@ -8,16 +8,19 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
8
8
  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; }
9
9
  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; } }
10
10
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
11
- import { useClickOutsize } from '@kep-platform/hooks';
12
- import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
11
+ import React, { useCallback, useEffect, useState } from 'react';
13
12
  import styled, { css } from 'styled-components';
14
13
  import { List, ListItem } from "../List";
15
- import { PopupBox } from "../PopupBox";
14
+ import { Popup } from "../PopupBox";
16
15
  var MenuList = styled(List).withConfig({
17
16
  displayName: "MenuList",
18
17
  componentId: "basic-component-347b__sc-d665dh-0"
19
18
  })([""]);
20
19
  var MenuListItem = styled(ListItem).withConfig({
20
+ shouldForwardProp: function shouldForwardProp(prop) {
21
+ return !['active'].includes(prop);
22
+ }
23
+ }).withConfig({
21
24
  displayName: "MenuListItem",
22
25
  componentId: "basic-component-347b__sc-d665dh-1"
23
26
  })(["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);color:var(--kep-platform-color-text) !important;&:hover{background-color:var(--kep-platform-color-bg-hover);}", ""], function (props) {
@@ -65,63 +68,30 @@ export function PopupMenu(props) {
65
68
  _useState4 = _slicedToArray(_useState3, 2),
66
69
  activeKey = _useState4[0],
67
70
  setActiveKey = _useState4[1];
68
- var _useState5 = useState({
69
- left: 0,
70
- top: 0
71
- }),
71
+ var _useState5 = useState(false),
72
72
  _useState6 = _slicedToArray(_useState5, 2),
73
- pos = _useState6[0],
74
- setPos = _useState6[1];
75
- var triggerController = useRef(null);
76
- var popupBox = useRef(null);
77
- var mergeProps = useMemo(function () {
78
- return {
79
- ref: triggerController
80
- };
81
- }, []);
82
- var showPopupMenu = useCallback(function (e) {
83
- e.preventDefault();
84
- var _ref2 = e,
85
- clientX = _ref2.clientX,
86
- clientY = _ref2.clientY;
87
- setPos({
88
- left: clientX,
89
- top: clientY
90
- });
91
- setActiveKey(undefined);
92
- }, []);
93
- var hidePopupMenu = useCallback(function () {
94
- setPos({
95
- left: -999,
96
- top: -999
97
- });
98
- }, []);
73
+ visible = _useState6[0],
74
+ setVisible = _useState6[1];
99
75
  var onSelectHandler = useCallback(function (key, item) {
100
76
  onSelect === null || onSelect === void 0 || onSelect(key, item);
101
77
  setActiveKey(key);
102
- hidePopupMenu();
103
- }, [onSelect, hidePopupMenu]);
104
- useClickOutsize('mousedown', popupBox, hidePopupMenu);
105
- useClickOutsize('scroll', popupBox, hidePopupMenu);
106
- useEffect(function () {
107
- var triggerTarget = triggerController.current;
108
- if (trigger) triggerTarget === null || triggerTarget === void 0 || triggerTarget.addEventListener(trigger, showPopupMenu);
109
- return function () {
110
- triggerTarget === null || triggerTarget === void 0 || triggerTarget.removeEventListener(trigger, showPopupMenu);
111
- };
112
- }, [trigger, showPopupMenu]);
113
- if ( /*#__PURE__*/React.isValidElement(children)) {
114
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PopupBox, {
115
- left: pos.left,
116
- top: pos.top,
117
- ref: popupBox,
118
- onClick: hidePopupMenu
119
- }, /*#__PURE__*/React.createElement(Menu, _extends({}, rest, {
78
+ setVisible(false);
79
+ }, [onSelect]);
80
+ return /*#__PURE__*/React.createElement(Popup, {
81
+ onVisibleChange: function onVisibleChange(v) {
82
+ setVisible(v);
83
+ if (v === true) {
84
+ setActiveKey(undefined);
85
+ }
86
+ },
87
+ visible: visible,
88
+ trigger: trigger,
89
+ content: /*#__PURE__*/React.createElement(Menu, _extends({}, rest, {
120
90
  activeKey: outerActiveKey || activeKey,
121
91
  onSelect: onSelectHandler,
122
92
  direction: "column"
123
- }))), /*#__PURE__*/React.cloneElement(children, mergeProps));
124
- } else console.warn('PopupMenu需要一个触发元素!');
93
+ }))
94
+ }, children);
125
95
  }
126
96
  Menu.Popup = PopupMenu;
127
97
  export default Menu;
@@ -1,4 +1,4 @@
1
- import { HtmlHTMLAttributes, type ReactNode } from 'react';
1
+ import React, { HtmlHTMLAttributes, type ReactNode } from 'react';
2
2
  export type PopupBoxProps = {
3
3
  children?: ReactNode;
4
4
  left?: number;
@@ -6,7 +6,16 @@ export type PopupBoxProps = {
6
6
  right?: number;
7
7
  bottom?: number;
8
8
  } & HtmlHTMLAttributes<HTMLDivElement>;
9
- declare const PopupBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
10
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
11
- }, Omit<PopupBoxProps, "children">>> & string;
9
+ declare const PopupBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
10
+ ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
11
+ }, Omit<PopupBoxProps, "children"> & {
12
+ visible?: boolean | undefined;
13
+ }>> & string;
14
+ export declare function Popup(props: {
15
+ children: ReactNode;
16
+ visible?: boolean;
17
+ trigger?: TriggerType;
18
+ content?: ReactNode;
19
+ onVisibleChange?: (visible: boolean) => void;
20
+ }): React.JSX.Element | undefined;
12
21
  export default PopupBox;
@@ -1,12 +1,82 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+ 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."); }
3
+ 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); }
4
+ 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; }
5
+ 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; } }
6
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
+ import { useClickOutsize } from '@kep-platform/hooks';
8
+ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
1
9
  import styled, { css } from 'styled-components';
2
10
  var PopupBox = styled('div').withConfig({
3
11
  shouldForwardProp: function shouldForwardProp(prop) {
4
- return !['left', 'right', 'top', 'bottom'].includes(prop);
12
+ return !['left', 'right', 'top', 'bottom', 'visible'].includes(prop);
5
13
  }
6
14
  }).withConfig({
7
15
  displayName: "PopupBox",
8
16
  componentId: "basic-component-347b__sc-80rdwc-0"
9
- })(["background-color:var(--kep-platform-color-bg-base);padding:var(--kep-platform-padding-xs);border-radius:var(--kep-platform-border-radius-sm);position:fixed;box-shadow:var(--kep-platform-box-shadow);z-index:var(--kep-platform-z-index-popup-base);", ";"], function (props) {
10
- return css(["left:", "px;top:", "px;"], props.left || -999, props.top || -999);
17
+ })(["background-color:var(--kep-platform-color-bg-base);padding:var(--kep-platform-padding-xs);border-radius:var(--kep-platform-border-radius-sm);position:fixed;box-shadow:var(--kep-platform-box-shadow);z-index:999;", ";"], function (props) {
18
+ if (props.visible) return css(["left:", "px;top:", "px;"], props.left || -999, props.top || -999);else return css(["left:-9999px;top:-9999px;"]);
11
19
  });
20
+ export function Popup(props) {
21
+ var children = props.children,
22
+ _props$trigger = props.trigger,
23
+ trigger = _props$trigger === void 0 ? 'click' : _props$trigger,
24
+ outerVisible = props.visible,
25
+ onVisibleChange = props.onVisibleChange,
26
+ content = props.content;
27
+ var _useState = useState({
28
+ left: 0,
29
+ top: 0
30
+ }),
31
+ _useState2 = _slicedToArray(_useState, 2),
32
+ pos = _useState2[0],
33
+ setPos = _useState2[1];
34
+ var _useState3 = useState(outerVisible),
35
+ _useState4 = _slicedToArray(_useState3, 2),
36
+ visible = _useState4[0],
37
+ setVisible = _useState4[1];
38
+ var triggerController = useRef(null);
39
+ var popupBox = useRef(null);
40
+ var mergeProps = useMemo(function () {
41
+ return {
42
+ ref: triggerController
43
+ };
44
+ }, []);
45
+ var showPopupMenu = useCallback(function (e) {
46
+ e.preventDefault();
47
+ var _ref = e,
48
+ clientX = _ref.clientX,
49
+ clientY = _ref.clientY;
50
+ setPos({
51
+ left: clientX,
52
+ top: clientY
53
+ });
54
+ setVisible(true);
55
+ onVisibleChange === null || onVisibleChange === void 0 || onVisibleChange(true);
56
+ }, []);
57
+ var hidePopupMenu = useCallback(function () {
58
+ setVisible(false);
59
+ onVisibleChange === null || onVisibleChange === void 0 || onVisibleChange(false);
60
+ }, []);
61
+ useClickOutsize('mousedown', popupBox, hidePopupMenu);
62
+ useClickOutsize('scroll', popupBox, hidePopupMenu);
63
+ useEffect(function () {
64
+ var triggerTarget = triggerController.current;
65
+ if (trigger) triggerTarget === null || triggerTarget === void 0 || triggerTarget.addEventListener(trigger, showPopupMenu);
66
+ return function () {
67
+ triggerTarget === null || triggerTarget === void 0 || triggerTarget.removeEventListener(trigger, showPopupMenu);
68
+ };
69
+ }, [trigger, showPopupMenu, visible]);
70
+ useEffect(function () {
71
+ if (typeof outerVisible === 'boolean') setVisible(outerVisible);
72
+ }, [outerVisible]);
73
+ if ( /*#__PURE__*/React.isValidElement(children)) {
74
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PopupBox, {
75
+ left: pos.left,
76
+ top: pos.top,
77
+ visible: visible,
78
+ ref: popupBox
79
+ }, content), /*#__PURE__*/React.cloneElement(children, mergeProps));
80
+ } else console.warn('PopupMenu需要一个触发元素!');
81
+ }
12
82
  export default PopupBox;
@@ -1 +1 @@
1
- export { default as PopupBox } from './PopupBox';
1
+ export { Popup, default as PopupBox } from './PopupBox';
@@ -1 +1 @@
1
- export { default as PopupBox } from "./PopupBox";
1
+ export { Popup, default as PopupBox } from "./PopupBox";
@@ -1,4 +1,5 @@
1
1
  import React, { ReactNode } from 'react';
2
+ import { ListItemProps } from '../List/List';
2
3
  export type SelectOption = {
3
4
  label: ReactNode;
4
5
  value: string;
@@ -10,4 +11,16 @@ export type SelectProps = {
10
11
  onChange?: (value: string) => void;
11
12
  children?: ReactNode;
12
13
  };
13
- export default function Select(props: SelectProps): React.JSX.Element;
14
+ type SelectListItemProps = ListItemProps & {
15
+ active?: boolean;
16
+ };
17
+ declare function Select(props: SelectProps): React.JSX.Element;
18
+ declare namespace Select {
19
+ var Option: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<{
20
+ key: React.Key;
21
+ title?: React.ReactNode;
22
+ index?: number | undefined;
23
+ itemRender?: ListItemRender | undefined;
24
+ } & Omit<React.HtmlHTMLAttributes<HTMLLIElement>, "title">, SelectListItemProps>> & string & Omit<React.FC<ListItemProps>, keyof React.Component<any, {}, any>>;
25
+ }
26
+ export default Select;
@@ -21,7 +21,11 @@ var SelectInput = styled.input.withConfig({
21
21
  componentId: "basic-component-347b__sc-z3izsh-2"
22
22
  })(["border-width:0;"]);
23
23
  var fadeIn = keyframes(["0%{opacity:0;}100%{opacity:1;}"]);
24
- var SelectPannel = styled.div.withConfig({
24
+ var SelectPannel = styled('div').withConfig({
25
+ shouldForwardProp: function shouldForwardProp(prop) {
26
+ return !['visible'].includes(prop);
27
+ }
28
+ }).withConfig({
25
29
  displayName: "SelectPannel",
26
30
  componentId: "basic-component-347b__sc-z3izsh-3"
27
31
  })(["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) {
@@ -36,6 +40,10 @@ var SelectList = styled(List).withConfig({
36
40
  componentId: "basic-component-347b__sc-z3izsh-4"
37
41
  })([""]);
38
42
  var SelectListItem = styled(ListItem).withConfig({
43
+ shouldForwardProp: function shouldForwardProp(prop) {
44
+ return !['active'].includes(prop);
45
+ }
46
+ }).withConfig({
39
47
  displayName: "SelectListItem",
40
48
  componentId: "basic-component-347b__sc-z3izsh-5"
41
49
  })(["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) {
@@ -83,7 +91,7 @@ export default function Select(props) {
83
91
  });
84
92
  var selectItems = useMemo(function () {
85
93
  if (options) {
86
- return options === null || options === void 0 ? void 0 : options.map(function (option) {
94
+ return options.map(function (option) {
87
95
  return /*#__PURE__*/React.createElement(SelectListItem, {
88
96
  key: option.value,
89
97
  active: option.value === mergeValue,
@@ -93,7 +101,7 @@ export default function Select(props) {
93
101
  });
94
102
  } else {
95
103
  return React.Children.map(children, function (child) {
96
- return /*#__PURE__*/React.createElement(SelectListItem, {
104
+ if ( /*#__PURE__*/React.isValidElement(child)) return /*#__PURE__*/React.createElement(SelectListItem, {
97
105
  key: child.props.value,
98
106
  "data-key": child.props.value,
99
107
  active: child.props.value === mergeValue,
@@ -118,4 +126,5 @@ export default function Select(props) {
118
126
  }, /*#__PURE__*/React.createElement(SelectList, {
119
127
  direction: "column"
120
128
  }, selectItems)));
121
- }
129
+ }
130
+ Select.Option = SelectListItem;
package/dist/Spin/Spin.js CHANGED
@@ -5,10 +5,14 @@ var SpinContainer = styled.div.withConfig({
5
5
  displayName: "SpinContainer",
6
6
  componentId: "basic-component-347b__sc-1s1g2fa-0"
7
7
  })(["position:relative;"]);
8
- var SpinMark = styled.div.withConfig({
8
+ var SpinMark = styled('div').withConfig({
9
+ shouldForwardProp: function shouldForwardProp(prop) {
10
+ return !['spinning'].includes(prop);
11
+ }
12
+ }).withConfig({
9
13
  displayName: "SpinMark",
10
14
  componentId: "basic-component-347b__sc-1s1g2fa-1"
11
- })(["position:absolute;inset:0 0 0 0;background-color:rgba(255,255,255,0.5);display:flex;justify-content:center;align-items:center;"]);
15
+ })(["position:absolute;inset:0 0 0 0;background-color:rgba(255,255,255,0.706);display:flex;justify-content:center;align-items:center;color:var(--kep-platform-color-primary);"]);
12
16
  export default function Spin(props) {
13
17
  return /*#__PURE__*/React.createElement(SpinContainer, null, props.children, /*#__PURE__*/React.createElement(SpinMark, {
14
18
  spinning: props.spinning,
@@ -16,6 +16,7 @@ export type TableProps = {
16
16
  groupBy?: string;
17
17
  pagination?: Pagination | false;
18
18
  empty?: ReactNode;
19
+ rowSelection?: RowSelection;
19
20
  };
20
- export default function Table({ columns, dataSource, rowKey, actions, title, scroll, onChange, headerRender, pagination: outerPagination, empty, }: TableProps): React.JSX.Element;
21
+ export default function Table({ columns, dataSource, rowKey, actions, title, scroll, onChange, headerRender, pagination: outerPagination, empty, rowSelection, }: TableProps): React.JSX.Element;
21
22
  export {};
@@ -3,9 +3,15 @@ var _excluded = ["render"];
3
3
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
4
4
  function _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; }
5
5
  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; }
6
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
7
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
6
8
  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; }
7
9
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
8
10
  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); }
11
+ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
12
+ function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
13
+ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
14
+ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
9
15
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
10
16
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
11
17
  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); }
@@ -14,14 +20,17 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
14
20
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
15
21
  import CaretDownOutlined from '@ant-design/icons/CaretDownOutlined';
16
22
  import CaretUpOutlined from '@ant-design/icons/CaretUpOutlined';
23
+ import FilterOutlined from '@ant-design/icons/FilterOutlined';
17
24
  import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
18
25
  import styled, { css } from 'styled-components';
19
26
  import { BoxShadowBox } from "../BoxShadowBox";
20
27
  import { Column, Columns } from "../Columns";
21
28
  import { DefaultColumnWidth } from "../Columns/Columns";
22
29
  import { Col, Row } from "../Grid";
30
+ import { Input } from "../Input";
23
31
  import { List, ListItem } from "../List";
24
32
  import { Pagination } from "../Pagination";
33
+ import { Popup } from "../PopupBox";
25
34
  import { Space } from "../Space";
26
35
  var TableContainer = styled.div.withConfig({
27
36
  displayName: "TableContainer",
@@ -44,9 +53,17 @@ var TableBody = styled(List).withConfig({
44
53
  componentId: "basic-component-347b__sc-12r61fm-4"
45
54
  })([""]);
46
55
  var TableBodyRow = styled(ListItem).withConfig({
56
+ shouldForwardProp: function shouldForwardProp(prop) {
57
+ return !['isActive'].includes(prop);
58
+ }
59
+ }).withConfig({
47
60
  displayName: "TableBodyRow",
48
61
  componentId: "basic-component-347b__sc-12r61fm-5"
49
- })([""]);
62
+ })(["& ", "{", "}"], Column, function (props) {
63
+ if (props.isActive) {
64
+ return css(["background-color:var(--kep-platform-color-bg-active) !important;"]);
65
+ }
66
+ });
50
67
  var TableContent = styled.div.withConfig({
51
68
  displayName: "TableContent",
52
69
  componentId: "basic-component-347b__sc-12r61fm-6"
@@ -61,6 +78,10 @@ var SortIconList = styled(List).withConfig({
61
78
  componentId: "basic-component-347b__sc-12r61fm-7"
62
79
  })([""]);
63
80
  var SortIconListItem = styled(ListItem).withConfig({
81
+ shouldForwardProp: function shouldForwardProp(prop) {
82
+ return !['active'].includes(prop);
83
+ }
84
+ }).withConfig({
64
85
  displayName: "SortIconListItem",
65
86
  componentId: "basic-component-347b__sc-12r61fm-8"
66
87
  })(["height:10px;line-height:10px;font-size:10px;cursor:pointer;user-select:none;color:", ";"], function (props) {
@@ -87,8 +108,10 @@ var SortIconGroup = function SortIconGroup(_ref) {
87
108
  onClick: onSortIconGroupClickHandler,
88
109
  hidden: hidden
89
110
  }, /*#__PURE__*/React.createElement(SortIconListItem, {
111
+ key: "asc",
90
112
  active: sorter === 'asc'
91
113
  }, /*#__PURE__*/React.createElement(CaretUpOutlined, null)), /*#__PURE__*/React.createElement(SortIconListItem, {
114
+ key: "desc",
92
115
  active: sorter === 'desc'
93
116
  }, /*#__PURE__*/React.createElement(CaretDownOutlined, null)));
94
117
  };
@@ -96,18 +119,35 @@ var ColumnTitle = styled.div.withConfig({
96
119
  displayName: "ColumnTitle",
97
120
  componentId: "basic-component-347b__sc-12r61fm-9"
98
121
  })([""]);
122
+ var FilterValue = styled.span.withConfig({
123
+ displayName: "FilterValue",
124
+ componentId: "basic-component-347b__sc-12r61fm-10"
125
+ })(["color:var(--kep-platform-color-primary);cursor:pointer;padding:var(--kep-platform-padding-xxs);border-radius:var(--kep-platform-border-radius-sm);&:hover{background-color:var(--kep-platform-color-bg-active);}"]);
99
126
  var ColumnTitleController = function ColumnTitleController(_ref2) {
100
127
  var onSorterChange = _ref2.onSorterChange,
101
128
  title = _ref2.title,
102
129
  sorterType = _ref2.sorterType,
103
- hasSorter = _ref2.hasSorter;
130
+ hasSorter = _ref2.hasSorter,
131
+ hasFilter = _ref2.hasFilter,
132
+ filterValue = _ref2.filterValue,
133
+ onFilterValueChange = _ref2.onFilterValueChange;
134
+ var filter = useMemo(function () {
135
+ return /*#__PURE__*/React.createElement(FilterValue, null, filterValue ? filterValue : /*#__PURE__*/React.createElement(FilterOutlined, null));
136
+ }, [filterValue]);
104
137
  return /*#__PURE__*/React.createElement(ColumnTitle, null, /*#__PURE__*/React.createElement(Space, {
105
138
  size: "small"
106
139
  }, title, /*#__PURE__*/React.createElement(SortIconGroup, {
107
140
  sorter: sorterType,
108
141
  onSorterChange: onSorterChange,
109
142
  hidden: !hasSorter
110
- })));
143
+ }), hasFilter && /*#__PURE__*/React.createElement(Popup, {
144
+ content: /*#__PURE__*/React.createElement(Input, {
145
+ value: filterValue || '',
146
+ onChange: function onChange(value) {
147
+ onFilterValueChange === null || onFilterValueChange === void 0 || onFilterValueChange(value);
148
+ }
149
+ })
150
+ }, filter)));
111
151
  };
112
152
  function sortObjectsByProperty(objects, property, sorterType, func) {
113
153
  var sorterOffset = sorterType === 'asc' ? 1 : sorterType === 'desc' ? -1 : 0;
@@ -128,6 +168,16 @@ function sortObjectsByProperty(objects, property, sorterType, func) {
128
168
  return objects.slice().sort(sorterFunc).reverse();
129
169
  }
130
170
  }
171
+ function filterTableRows(rows, filters) {
172
+ return rows.filter(function (row) {
173
+ if (row === undefined) {
174
+ return false;
175
+ }
176
+ return Object.keys(filters).every(function (key) {
177
+ return row[key] && row[key].toString().includes(filters[key]);
178
+ });
179
+ });
180
+ }
131
181
  export default function Table(_ref3) {
132
182
  var columns = _ref3.columns,
133
183
  dataSource = _ref3.dataSource,
@@ -139,7 +189,8 @@ export default function Table(_ref3) {
139
189
  headerRender = _ref3.headerRender,
140
190
  outerPagination = _ref3.pagination,
141
191
  _ref3$empty = _ref3.empty,
142
- empty = _ref3$empty === void 0 ? /*#__PURE__*/React.createElement(React.Fragment, null) : _ref3$empty;
192
+ empty = _ref3$empty === void 0 ? /*#__PURE__*/React.createElement(React.Fragment, null) : _ref3$empty,
193
+ rowSelection = _ref3.rowSelection;
143
194
  var _useState = useState(null),
144
195
  _useState2 = _slicedToArray(_useState, 2),
145
196
  sorterController = _useState2[0],
@@ -151,12 +202,99 @@ export default function Table(_ref3) {
151
202
  _useState4 = _slicedToArray(_useState3, 2),
152
203
  pagination = _useState4[0],
153
204
  setPagination = _useState4[1];
205
+ var _useState5 = useState([]),
206
+ _useState6 = _slicedToArray(_useState5, 2),
207
+ selectedRows = _useState6[0],
208
+ setSelectedRows = _useState6[1];
209
+ var _useState7 = useState({}),
210
+ _useState8 = _slicedToArray(_useState7, 2),
211
+ filterValues = _useState8[0],
212
+ setFilterValues = _useState8[1];
154
213
  useEffect(function () {
155
214
  if (outerPagination !== undefined) setPagination(outerPagination);
156
215
  }, [outerPagination]);
216
+ useEffect(function () {
217
+ if (rowSelection) {
218
+ var selectedKeys = rowSelection.selectedKeys;
219
+ if (selectedKeys) setSelectedRows(dataSource.filter(function (row) {
220
+ return selectedKeys.includes(row[rowKey]);
221
+ }));
222
+ }
223
+ }, [rowSelection]);
224
+ var formatedColumns = useMemo(function () {
225
+ if (rowSelection) {
226
+ return [{
227
+ key: 'selectRow',
228
+ dataIndex: 'selectRow',
229
+ title: /*#__PURE__*/React.createElement("input", {
230
+ type: "checkbox",
231
+ checked: selectedRows.length === dataSource.length,
232
+ onChange: function onChange(e) {
233
+ if (e.target.checked) {
234
+ var _rowSelection$onSelec;
235
+ setSelectedRows(dataSource);
236
+ (_rowSelection$onSelec = rowSelection.onSelect) === null || _rowSelection$onSelec === void 0 || _rowSelection$onSelec.call(rowSelection, dataSource.map(function (r) {
237
+ return r[rowKey];
238
+ }), {
239
+ type: 'all',
240
+ selected: true,
241
+ nativeEvent: e
242
+ });
243
+ } else {
244
+ var _rowSelection$onSelec2;
245
+ setSelectedRows([]);
246
+ (_rowSelection$onSelec2 = rowSelection.onSelect) === null || _rowSelection$onSelec2 === void 0 || _rowSelection$onSelec2.call(rowSelection, [], {
247
+ type: 'all',
248
+ selected: false,
249
+ nativeEvent: e
250
+ });
251
+ }
252
+ }
253
+ }),
254
+ render: function render(_, record) {
255
+ return /*#__PURE__*/React.createElement("input", {
256
+ type: "checkbox",
257
+ checked: selectedRows.includes(record),
258
+ onChange: function onChange(e) {
259
+ if (e.target.checked) {
260
+ var _rowSelection$onSelec3;
261
+ var rows = selectedRows.concat(record);
262
+ (_rowSelection$onSelec3 = rowSelection.onSelect) === null || _rowSelection$onSelec3 === void 0 || _rowSelection$onSelec3.call(rowSelection, rows.map(function (row) {
263
+ return row[rowKey];
264
+ }), {
265
+ type: 'row',
266
+ selected: true,
267
+ nativeEvent: e
268
+ });
269
+ setSelectedRows(rows);
270
+ } else {
271
+ var _rowSelection$onSelec4;
272
+ var _rows = selectedRows.filter(function (row) {
273
+ return row[rowKey] !== record[rowKey];
274
+ });
275
+ setSelectedRows(_rows);
276
+ (_rowSelection$onSelec4 = rowSelection.onSelect) === null || _rowSelection$onSelec4 === void 0 || _rowSelection$onSelec4.call(rowSelection, _rows.map(function (row) {
277
+ return row[rowKey];
278
+ }), {
279
+ type: 'row',
280
+ selected: false,
281
+ nativeEvent: e
282
+ });
283
+ }
284
+ }
285
+ });
286
+ },
287
+ width: 72,
288
+ fixed: 'left',
289
+ hideInTable: false
290
+ }].concat(_toConsumableArray(columns));
291
+ } else {
292
+ return columns;
293
+ }
294
+ }, [columns, rowSelection, dataSource, selectedRows]);
157
295
  var titleRowData = useMemo(function () {
158
296
  var data = {};
159
- columns.forEach(function (column) {
297
+ formatedColumns.forEach(function (column) {
160
298
  var dataIndex = column.dataIndex;
161
299
  data[dataIndex] = /*#__PURE__*/React.createElement(ColumnTitleController, {
162
300
  column: column,
@@ -168,27 +306,34 @@ export default function Table(_ref3) {
168
306
  sorterType: sorter
169
307
  });
170
308
  },
309
+ onFilterValueChange: function onFilterValueChange(value) {
310
+ var newFilterValues = _objectSpread(_objectSpread({}, filterValues), {}, _defineProperty({}, dataIndex, value));
311
+ _onChange2 === null || _onChange2 === void 0 || _onChange2(undefined, undefined, newFilterValues);
312
+ setFilterValues(newFilterValues);
313
+ },
171
314
  title: (headerRender === null || headerRender === void 0 ? void 0 : headerRender(column)) || column.title,
172
315
  sorterType: (sorterController === null || sorterController === void 0 ? void 0 : sorterController.columnKey) === column.key ? sorterController === null || sorterController === void 0 ? void 0 : sorterController.sorterType : undefined,
173
- hasSorter: !!column.sorter
316
+ hasSorter: !!column.sorter,
317
+ hasFilter: !!column.filter,
318
+ filterValue: filterValues[dataIndex]
174
319
  });
175
320
  });
176
321
  return data;
177
- }, [columns, _onChange2, sorterController, setSorterController]);
322
+ }, [formatedColumns, _onChange2, sorterController, setSorterController, rowSelection, filterValues, setFilterValues]);
178
323
  var boxShadowBox = useRef(null);
179
324
  var headerColumns = useMemo(function () {
180
- return columns.map(function (column) {
325
+ return formatedColumns.map(function (column) {
326
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
181
327
  var render = column.render,
182
328
  rest = _objectWithoutProperties(column, _excluded);
183
- console.log('exclude render', render);
184
329
  return rest;
185
330
  });
186
- }, [columns]);
331
+ }, [formatedColumns]);
187
332
  var scrollLeftOffset = useMemo(function () {
188
- return columns.reduce(function (pre, current) {
333
+ return formatedColumns.reduce(function (pre, current) {
189
334
  return pre + (current.hideInTable ? 0 : current.fixed === 'left' ? current.width || DefaultColumnWidth : 0);
190
335
  }, 0);
191
- }, [columns]);
336
+ }, [formatedColumns]);
192
337
  var formatedDataSource = useMemo(function () {
193
338
  var formatedDataSource = dataSource;
194
339
  if (pagination !== false) {
@@ -204,15 +349,16 @@ export default function Table(_ref3) {
204
349
  }
205
350
  /* 排序 */
206
351
  if (sorterController && sorterController.sorterType !== undefined) {
207
- var sortedColumn = columns.find(function (column) {
352
+ var sortedColumn = formatedColumns.find(function (column) {
208
353
  return column.key === sorterController.columnKey;
209
354
  });
210
355
  var sorterFunc = typeof (sortedColumn === null || sortedColumn === void 0 ? void 0 : sortedColumn.sorter) === 'function' ? sortedColumn.sorter : undefined;
211
356
  formatedDataSource = sortObjectsByProperty(formatedDataSource, sorterController.columnKey, sorterController.sorterType, sorterFunc);
212
357
  }
213
358
  /* 条件过滤 */
359
+ formatedDataSource = filterTableRows(formatedDataSource, filterValues);
214
360
  return formatedDataSource;
215
- }, [sorterController, dataSource, columns, pagination]);
361
+ }, [sorterController, dataSource, formatedColumns, pagination, filterValues]);
216
362
  return /*#__PURE__*/React.createElement(TableContainer, null, (title || actions) && /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
217
363
  span: 8
218
364
  }, /*#__PURE__*/React.createElement(TableTitle, null, title)), /*#__PURE__*/React.createElement(Col, {
@@ -253,11 +399,12 @@ export default function Table(_ref3) {
253
399
  direction: "column"
254
400
  }, formatedDataSource.map(function (rowData, index) {
255
401
  if (rowData) return /*#__PURE__*/React.createElement(TableBodyRow, {
256
- key: rowData[rowKey]
402
+ key: rowData[rowKey],
403
+ isActive: selectedRows.includes(rowData)
257
404
  }, /*#__PURE__*/React.createElement(Columns, {
258
405
  rowIndex: index,
259
406
  rowData: rowData,
260
- columns: columns,
407
+ columns: formatedColumns,
261
408
  isFlex: !scroll
262
409
  }));else return undefined;
263
410
  })) : empty), pagination !== false && dataSource.length !== 0 && /*#__PURE__*/React.createElement(Pagination, _extends({}, pagination, {
package/dist/Tree/Tree.js CHANGED
@@ -10,7 +10,11 @@ import { DefaultColumnWidth } from "../Columns/Columns";
10
10
  import { List } from "../List";
11
11
  import { MainArea, MainProperty } from "./MainProperties";
12
12
  import { TreeNodeController, nodeTypeMap } from "./TreeNode";
13
- var TreeContainer = styled.div.withConfig({
13
+ var TreeContainer = styled('div').withConfig({
14
+ shouldForwardProp: function shouldForwardProp(prop) {
15
+ return !['bordered'].includes(prop);
16
+ }
17
+ }).withConfig({
14
18
  displayName: "TreeContainer",
15
19
  componentId: "basic-component-347b__sc-n4lkq9-0"
16
20
  })(["position:relative;overflow-x:auto;border:1px solid var(--kep-platform-color-border-secondary);border-width:", ";"], function (props) {
@@ -20,7 +24,11 @@ var TreeBody = styled(List).withConfig({
20
24
  displayName: "TreeBody",
21
25
  componentId: "basic-component-347b__sc-n4lkq9-1"
22
26
  })([""]);
23
- var TreeHeader = styled.div.withConfig({
27
+ var TreeHeader = styled('div').withConfig({
28
+ shouldForwardProp: function shouldForwardProp(prop) {
29
+ return !['width', 'isFlex'].includes(prop);
30
+ }
31
+ }).withConfig({
24
32
  displayName: "TreeHeader",
25
33
  componentId: "basic-component-347b__sc-n4lkq9-2"
26
34
  })(["", " background-color:var(--kep-platform-header-bg);& ", ",& ", "{background-color:var(--kep-platform-header-bg);font-weight:600;position:sticky;}"], function (props) {
@@ -14,6 +14,10 @@ import { ListItem } from "../List";
14
14
  import { Menu } from "../Menu";
15
15
  import { MainArea, MainProperty } from "./MainProperties";
16
16
  var ExpandedIcon = styled(CaretRightOutlined).withConfig({
17
+ shouldForwardProp: function shouldForwardProp(prop) {
18
+ return !['expanded'].includes(prop);
19
+ }
20
+ }).withConfig({
17
21
  displayName: "ExpandedIcon",
18
22
  componentId: "basic-component-347b__sc-tzoomn-0"
19
23
  })(["transition:transform 0.5s;display:block;user-select:none;", ";font-size:var(--kep-platform-font-size-sm);&:hover{color:var(--kep-platform-color-primary);}"], function (props) {
@@ -204,6 +208,7 @@ export var TreeNodeController = function TreeNodeController(_ref) {
204
208
  })
205
209
  });
206
210
  return /*#__PURE__*/React.createElement(React.Fragment, null, node.nodeType !== nodeTypeMap.virtual && /*#__PURE__*/React.createElement(TreeNode, {
211
+ key: node[fieldNames.key],
207
212
  selected: selectedKeys.includes(node[fieldNames.key]),
208
213
  width: width,
209
214
  onClick: onClickNodeHandler,
@@ -1,6 +1,6 @@
1
1
  // GlobalStyles.js
2
2
  import { createGlobalStyle } from 'styled-components';
3
- 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: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) {
3
+ 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) {
4
4
  return props.$css;
5
5
  });
6
6
  export default GlobalStyles;
package/dist/index.d.ts CHANGED
@@ -6,6 +6,7 @@ export * from './Indent';
6
6
  export * from './List';
7
7
  export * from './Menu';
8
8
  export * from './Pagination';
9
+ export * from './PopupBox';
9
10
  export * from './Select';
10
11
  export * from './Space';
11
12
  export * from './Spin';
package/dist/index.js CHANGED
@@ -6,6 +6,7 @@ export * from "./Indent";
6
6
  export * from "./List";
7
7
  export * from "./Menu";
8
8
  export * from "./Pagination";
9
+ export * from "./PopupBox";
9
10
  export * from "./Select";
10
11
  export * from "./Space";
11
12
  export * from "./Spin";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kep-platform/basic-component",
3
- "version": "0.0.24",
3
+ "version": "0.0.27",
4
4
  "description": "A react library developed with dumi",
5
5
  "module": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -74,10 +74,10 @@
74
74
  "react-dom": "^18.0.0",
75
75
  "stylelint": "^14.9.1"
76
76
  },
77
- "gitHead": "1f2ef83b49da934cc5f6cbfd0d452b82622ea3e9",
77
+ "gitHead": "e15c151ba5b1e41e42047a5b438620cf13c9c1bc",
78
78
  "dependencies": {
79
79
  "@ant-design/icons": "^5.3.7",
80
- "@kep-platform/hooks": "^0.0.24",
80
+ "@kep-platform/hooks": "^0.0.27",
81
81
  "color": "^4.2.3",
82
82
  "rc-pagination": "^4.1.0",
83
83
  "styled-components": "^6.1.11"