@kep-platform/basic-component 0.0.48 → 0.0.50

package/dist/Columns/Columns.d.ts

@@ -14,7 +14,7 @@ export declare const Column: import("styled-components/dist/types").IStyledCompo
     title?: React.ReactNode;
     index?: number | undefined;
     itemRender?: ListItemRender | undefined;
-} & Omit<React.HtmlHTMLAttributes<HTMLLIElement>, "title">, Omit<ColumnType, "render" | "dataIndex"> & {
+} & Omit<React.HtmlHTMLAttributes<HTMLLIElement>, "title">, Omit<ColumnType, "dataIndex" | "render"> & {
     key: React.Key;
     title?: React.ReactNode;
     index?: number | undefined;

package/dist/Table/Table.d.ts

@@ -2,7 +2,8 @@ import React, { ReactNode } from 'react';
 type SorterDesc = Record<string, Sorter>;
 type FilterDesc = Record<string, string>;
 export type Scroll = {
-    y: number;
+    y?: number;
+    x?: number;
 };
 export type TableProps = {
     dataSource: Record<string, any>[];
@@ -18,5 +19,5 @@ export type TableProps = {
     empty?: ReactNode;
     rowSelection?: RowSelection;
 };
-export default function Table({ columns, dataSource, rowKey, actions, title, scroll, onChange, headerRender, pagination: outerPagination, empty, rowSelection, }: TableProps): React.JSX.Element;
+export default function Table({ columns, dataSource, rowKey, scroll, onChange, headerRender, pagination: outerPagination, empty, rowSelection, }: TableProps): React.JSX.Element;
 export {};

package/dist/Table/Table.js

@@ -1,6 +1,6 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _excluded = ["render"];
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -28,38 +28,44 @@ import styled, { css } from 'styled-components';
 import { BoxShadowBox } from "../BoxShadowBox";
 import { Column, Columns } from "../Columns";
 import { DefaultColumnWidth } from "../Columns/Columns";
-import { Col, Row } from "../Grid";
 import { Input } from "../Input";
 import { List, ListItem } from "../List";
 import { Pagination } from "../Pagination";
 import { Popup } from "../PopupBox";
 import { Space } from "../Space";
 var TableContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
-var TableTitle = styled.h5(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    font-weight: 600;\n    padding: var(--kep-platform-padding-sm);\n"])));
-var TableToolbar = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    text-align: right;\n    padding: var(--kep-platform-padding-sm);\n"])));
-var TableHeaderRow = styled(Columns)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    border-bottom: var(--kep-platform-line-width) solid var(--kep-platform-color-table-border);\n    position: sticky;\n    top: 0;\n    left: 0;\n    z-index: calc(var(--kep-platform-z-index-fixed) + 5);\n    & ", " {\n        background-color: var(--kep-platform-header-bg);\n        font-weight: 600;\n        position: sticky;\n        &:not(:last-child):after {\n            content: '';\n            width: 1px;\n            height: calc(100% - 2 * var(--kep-platform-padding-xs));\n            position: absolute;\n            top: var(--kep-platform-padding-xs);\n            right: 0;\n            background-color: var(--kep-platform-color-border-secondary);\n        }\n    }\n"])), Column);
-var TableBody = styled(List)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral([""])));
+var TableHeaderRow = styled(Columns)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    border-bottom: var(--kep-platform-line-width) solid var(--kep-platform-color-table-border);\n    position: sticky;\n    top: 0;\n    left: 0;\n    z-index: calc(var(--kep-platform-z-index-fixed) + 5);\n    & ", " {\n        background-color: var(--kep-platform-header-bg);\n        font-weight: 600;\n        position: sticky;\n        &:not(:last-child):after {\n            content: '';\n            width: 1px;\n            height: calc(100% - 2 * var(--kep-platform-padding-xs));\n            position: absolute;\n            top: var(--kep-platform-padding-xs);\n            right: 0;\n            background-color: var(--kep-platform-color-border-secondary);\n        }\n    }\n"])), Column);
+var TableBody = styled(List)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral([""])));
 var TableBodyRow = styled(ListItem).withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
     return !['isActive'].includes(prop);
   }
-})(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    & ", " {\n        ", "\n    }\n"])), Column, function (props) {
+})(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    & ", " {\n        ", "\n    }\n"])), Column, function (props) {
   if (props.isActive) {
-    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n                    background-color: var(--kep-platform-color-bg-active) !important;\n                "])));
+    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n                    background-color: var(--kep-platform-color-bg-active) !important;\n                "])));
   }
 });
-var TableContent = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    position: relative;\n    overflow: auto;\n    border-radius: var(--kep-platform-border-radius);\n    box-shadow: var(--kep-platform-box-shadow-tertiary);\n    ", "\n"])), function (props) {
+var TableContent = styled.div.withConfig({
+  shouldForwardProp: function shouldForwardProp(prop) {
+    return !['scroll', 'isFlex'].includes(prop);
+  }
+})(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    position: relative;\n    overflow: auto;\n    border-radius: var(--kep-platform-border-radius);\n    box-shadow: var(--kep-platform-box-shadow-tertiary);\n    width: ", ";\n    height: ", ";\n"])), function (props) {
   var _props$scroll;
-  if ((_props$scroll = props.scroll) !== null && _props$scroll !== void 0 && _props$scroll.y) {
-    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n                height: ", "px;\n            "])), props.scroll.y);
+  if (!props.isFlex && (_props$scroll = props.scroll) !== null && _props$scroll !== void 0 && _props$scroll.x) {
+    return '100%';
+  }
+}, function (props) {
+  var _props$scroll2;
+  if ((_props$scroll2 = props.scroll) !== null && _props$scroll2 !== void 0 && _props$scroll2.y) {
+    return props.scroll.y + 'px';
   }
 });
-var SortIconList = styled(List)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral([""])));
+var SortIconList = styled(List)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral([""])));
 var SortIconListItem = styled(ListItem).withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
     return !['active'].includes(prop);
   }
-})(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n    height: 10px;\n    line-height: 10px;\n    font-size: 10px;\n    cursor: pointer;\n    user-select: none;\n    color: ", ";\n"])), function (props) {
+})(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    height: 10px;\n    line-height: 10px;\n    font-size: 10px;\n    cursor: pointer;\n    user-select: none;\n    color: ", ";\n"])), function (props) {
   return props.active ? 'var(--kep-platform-color-primary)' : 'currentColor';
 });
 var SortIconGroup = function SortIconGroup(_ref) {
@@ -90,8 +96,8 @@ var SortIconGroup = function SortIconGroup(_ref) {
     active: sorter === 'desc'
   }, /*#__PURE__*/React.createElement(CaretDownOutlined, null)));
 };
-var ColumnTitle = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral([""])));
-var FilterValue = styled.span(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n    color: var(--kep-platform-color-primary);\n    cursor: pointer;\n    padding: var(--kep-platform-padding-xxs);\n    border-radius: var(--kep-platform-border-radius-sm);\n    &:hover {\n        background-color: var(--kep-platform-color-bg-active);\n    }\n"])));
+var ColumnTitle = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral([""])));
+var FilterValue = styled.span(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n    color: var(--kep-platform-color-primary);\n    cursor: pointer;\n    padding: var(--kep-platform-padding-xxs);\n    border-radius: var(--kep-platform-border-radius-sm);\n    &:hover {\n        background-color: var(--kep-platform-color-bg-active);\n    }\n"])));
 var ColumnTitleController = function ColumnTitleController(_ref2) {
   var onSorterChange = _ref2.onSorterChange,
     title = _ref2.title,
@@ -151,8 +157,6 @@ export default function Table(_ref3) {
   var columns = _ref3.columns,
     dataSource = _ref3.dataSource,
     rowKey = _ref3.rowKey,
-    actions = _ref3.actions,
-    title = _ref3.title,
     scroll = _ref3.scroll,
     _onChange2 = _ref3.onChange,
     headerRender = _ref3.headerRender,
@@ -328,20 +332,13 @@ export default function Table(_ref3) {
     formatedDataSource = filterTableRows(formatedDataSource, filterValues);
     return formatedDataSource;
   }, [sorterController, dataSource, formatedColumns, pagination, filterValues]);
-  return /*#__PURE__*/React.createElement(TableContainer, null, (title || actions) && /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
-    span: 8
-  }, /*#__PURE__*/React.createElement(TableTitle, null, title)), /*#__PURE__*/React.createElement(Col, {
-    span: 16
-  }, /*#__PURE__*/React.createElement(TableToolbar, null, /*#__PURE__*/React.createElement(Space, null, actions === null || actions === void 0 ? void 0 : actions.map(function (element) {
-    if ( /*#__PURE__*/React.isValidElement(element)) {
-      var action = element;
-      return /*#__PURE__*/React.cloneElement(action, {
-        size: 'default'
-      });
-    } else {
-      return element;
-    }
-  }))))), /*#__PURE__*/React.createElement(TableContent, {
+  var isFlex = useMemo(function () {
+    var calculateWidth = columns.reduce(function (pre, column) {
+      return pre + (column.hideInTable ? 0 : column.width || DefaultColumnWidth);
+    }, 0);
+    return !scroll || !scroll.x || calculateWidth < scroll.x;
+  }, [scroll, columns]);
+  return /*#__PURE__*/React.createElement(TableContainer, null, /*#__PURE__*/React.createElement(TableContent, {
     onScroll: function onScroll(e) {
       var tableContainer = e.target;
       if (boxShadowBox.current) {
@@ -354,8 +351,9 @@ export default function Table(_ref3) {
         boxShadowBox.current.style.top = tableContainer.scrollTop + 'px';
       }
     },
-    scroll: scroll
-  }, scroll && /*#__PURE__*/React.createElement(BoxShadowBox, {
+    scroll: scroll,
+    isFlex: isFlex
+  }, !isFlex && /*#__PURE__*/React.createElement(BoxShadowBox, {
     ref: boxShadowBox,
     width: "10px",
     height: "100%",
@@ -363,7 +361,7 @@ export default function Table(_ref3) {
   }), /*#__PURE__*/React.createElement(TableHeaderRow, {
     columns: headerColumns,
     rowData: titleRowData,
-    isFlex: !scroll
+    isFlex: isFlex
   }), dataSource.length > 0 ? /*#__PURE__*/React.createElement(TableBody, {
     direction: "column"
   }, formatedDataSource.map(function (rowData, index) {
@@ -374,7 +372,7 @@ export default function Table(_ref3) {
       rowIndex: index,
       rowData: rowData,
       columns: formatedColumns,
-      isFlex: !scroll
+      isFlex: isFlex
     }));else return undefined;
   })) : empty), pagination !== false && dataSource.length !== 0 && /*#__PURE__*/React.createElement(Pagination, _extends({}, pagination, {
     total: (pagination === null || pagination === void 0 ? void 0 : pagination.total) || dataSource.length,

package/dist/ViewPort/ViewPort.js

@@ -119,7 +119,7 @@ var ViewPortComponent = observer(function (props) {
     ref: containerRef
   }, rest), /*#__PURE__*/React.createElement(Overlay, {
     style: viewPortStore.overlayStyle
-  }), /*#__PURE__*/React.createElement(Content, _extends({
+  }), rippleManagerStore.rippleInfo, /*#__PURE__*/React.createElement(Content, _extends({
     ref: function ref(dom) {
       contentRef.current = dom;
       setNodeRef(contentRef.current);

package/dist/ViewPort/ViewPortStore.js

@@ -66,14 +66,12 @@ export var ViewPortStore = /*#__PURE__*/function () {
     value: function increaseScale() {
       this.setScale(this.scale + this.scaleStep);
       this.setTransform(this.transform.left, this.transform.top);
-      this.isTransition = true;
     }
   }, {
     key: "decreaseScale",
     value: function decreaseScale() {
       this.setScale(this.scale - this.scaleStep);
       this.setTransform(this.transform.left, this.transform.top);
-      this.isTransition = true;
     }
   }, {
     key: "validScale",

package/dist/ViewPort/test.js

@@ -74,6 +74,11 @@ export default observer(function Test() {
       window: windowStore,
       key: windowStore.id,
       title: 'xixi'
-    }, /*#__PURE__*/React.createElement("br", null));
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        height: '2000px',
+        backgroundColor: 'pink'
+      }
+    }));
   }))));
 });

package/dist/Window/Window.js

@@ -47,7 +47,9 @@ var Window = observer(function (props) {
     function stopWheel(e) {
       e.stopPropagation();
     }
-    (_windowContainerRef$c = windowContainerRef.current) === null || _windowContainerRef$c === void 0 || _windowContainerRef$c.addEventListener('wheel', stopWheel);
+    (_windowContainerRef$c = windowContainerRef.current) === null || _windowContainerRef$c === void 0 || _windowContainerRef$c.addEventListener('wheel', stopWheel, {
+      passive: false
+    });
     return function () {
       var _windowContainerRef$c2;
       (_windowContainerRef$c2 = windowContainerRef.current) === null || _windowContainerRef$c2 === void 0 || _windowContainerRef$c2.removeEventListener('wheel', stopWheel);
@@ -56,6 +58,7 @@ var Window = observer(function (props) {
 
   /* style 的原因是因为性能问题 */
   return /*#__PURE__*/React.createElement(WindowContainer, {
+    ref: windowContainerRef,
     style: window.style,
     isMinimize: !!window.isMinimize,
     onTransitionEnd: function onTransitionEnd(e) {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@kep-platform/basic-component",
-    "version": "0.0.48",
+    "version": "0.0.50",
     "description": "A react library developed with dumi",
     "license": "MIT",
     "module": "dist/index.js",
@@ -47,7 +47,7 @@
     },
     "dependencies": {
         "@ant-design/icons": "^5.3.7",
-        "@kep-platform/hooks": "^0.0.48",
+        "@kep-platform/hooks": "^0.0.50",
         "color": "^4.2.3",
         "rc-pagination": "^4.1.0"
     },
@@ -87,5 +87,5 @@
     "authors": [
         "less-step-jss 1599925910@qq.com"
     ],
-    "gitHead": "80d718030dd9b5362bbd7bdfc648b26e57dd3a74"
+    "gitHead": "27794473fb736fc66e4a87b05a5c21c67c1165dc"
 }