@aloudata/aloudata-design 2.7.4 → 2.7.5

package/dist/DataPreviewTable/components/Body/index.d.ts

@@ -6,6 +6,7 @@ interface IHeader {
     columnRange: [number, number];
     datasource: TValue[][];
     rowRange: [number, number];
+    headerHeight: number;
 }
 declare function Body(props: IHeader): React.JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof Body>;

package/dist/DataPreviewTable/components/Body/index.js

@@ -5,7 +5,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { memo } from 'react';
-import { CELL_HEIGHT, HEADER_HEIGHT } from "../../constant";
+import { CELL_HEIGHT } from "../../constant";
 import Cell from "./Cell";
 function Body(props) {
   var columns = props.columns,
@@ -16,7 +16,8 @@ function Body(props) {
     endIndex = _props$columnRange[1],
     _props$rowRange = _slicedToArray(props.rowRange, 2),
     startRowIndex = _props$rowRange[0],
-    endRowIndex = _props$rowRange[1];
+    endRowIndex = _props$rowRange[1],
+    headerHeight = props.headerHeight;
   return /*#__PURE__*/React.createElement("div", {
     className: "ald-data-preview-table-body"
   }, datasource.slice(startRowIndex, endRowIndex).map(function (row, rowIndex) {
@@ -28,7 +29,7 @@ function Body(props) {
       var style = {
         height: CELL_HEIGHT,
         width: columnLayout[columns[columnIndex].id].width,
-        top: currentRowIndex * CELL_HEIGHT + HEADER_HEIGHT,
+        top: currentRowIndex * CELL_HEIGHT + headerHeight,
         left: columnLayout[columns[columnIndex].id].left,
         position: 'absolute',
         textAlign: columns[columnIndex].align || 'left'

package/dist/DataPreviewTable/components/DragBar/index.d.ts

@@ -3,6 +3,7 @@ declare function DragBar(props: {
     wrapWidth: number;
     columnId: string;
     onChange: (columnId: string, width: number) => void;
+    headerHeight: number;
 }): React.JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof DragBar>;
 export default _default;

package/dist/DataPreviewTable/components/DragBar/index.js

@@ -16,7 +16,8 @@ import Mask from "./Mask";
 function DragBar(props) {
   var wrapWidth = props.wrapWidth,
     columnId = props.columnId,
-    onChange = props.onChange;
+    onChange = props.onChange,
+    headerHeight = props.headerHeight;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     show = _useState2[0],
@@ -52,7 +53,8 @@ function DragBar(props) {
       e.stopPropagation();
     },
     style: {
-      right: dragBarLeft
+      right: dragBarLeft,
+      height: headerHeight
     },
     className: classNames('ald-data-preview-header-drag-bar', _defineProperty({}, 'ald-data-preview-header-drag-bar-active', show))
   }, show ? /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement(Mask, {

package/dist/DataPreviewTable/components/Header/index.d.ts

@@ -6,6 +6,7 @@ interface IHeader {
     columnLayout: IColumnLayout;
     setWidth: (columnId: string, width: number) => void;
     columnRange: [number, number];
+    headerHeight: number;
 }
 export default function Header(props: IHeader): React.JSX.Element;
 export {};

package/dist/DataPreviewTable/components/Header/index.js

@@ -5,7 +5,6 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React from 'react';
-import { HEADER_HEIGHT } from "../../constant";
 import DragBar from "../DragBar";
 export default function Header(props) {
   var contentWidth = props.contentWidth,
@@ -14,7 +13,8 @@ export default function Header(props) {
     setWidth = props.setWidth,
     _props$columnRange = _slicedToArray(props.columnRange, 2),
     startIndex = _props$columnRange[0],
-    endIndex = _props$columnRange[1];
+    endIndex = _props$columnRange[1],
+    headerHeight = props.headerHeight;
   return /*#__PURE__*/React.createElement("div", {
     className: "ald-data-preview-header",
     style: {
@@ -24,7 +24,7 @@ export default function Header(props) {
     var _column$renderHeader;
     var innerCell = (_column$renderHeader = column.renderHeader) === null || _column$renderHeader === void 0 ? void 0 : _column$renderHeader.call(column, column);
     var style = {
-      height: HEADER_HEIGHT,
+      height: headerHeight,
       width: columnLayout[column.id].width,
       top: 0,
       left: columnLayout[column.id].left,
@@ -43,7 +43,8 @@ export default function Header(props) {
     }, column.name)), /*#__PURE__*/React.createElement(DragBar, {
       columnId: column.id,
       wrapWidth: columnLayout[column.id].width,
-      onChange: setWidth
+      onChange: setWidth,
+      headerHeight: headerHeight
     }));
   }));
 }

package/dist/DataPreviewTable/constant.d.ts

@@ -1,5 +1,5 @@
 export declare const CELL_HEIGHT = 20;
-export declare const HEADER_HEIGHT = 32;
+export declare const DEFAULT_HEADER_HEIGHT = 32;
 export declare const DEFAULT_COLUMN_WIDTH = 100;
 export declare const PRE_RENDER_RANGE = 100;
 export declare const UNDEFINED_INDEX = -1;

package/dist/DataPreviewTable/constant.js

@@ -1,5 +1,5 @@
 export var CELL_HEIGHT = 20;
-export var HEADER_HEIGHT = 32;
+export var DEFAULT_HEADER_HEIGHT = 32;
 export var DEFAULT_COLUMN_WIDTH = 100;
 export var PRE_RENDER_RANGE = 100; //预渲染范围
 

package/dist/DataPreviewTable/index.js

@@ -6,7 +6,7 @@ import Spin from "../Spin";
 import Body from "./components/Body";
 import Error from "./components/Body/Error";
 import Header from "./components/Header";
-import { CELL_HEIGHT, HEADER_HEIGHT } from "./constant";
+import { CELL_HEIGHT, DEFAULT_HEADER_HEIGHT } from "./constant";
 import useDirection from "./hooks/useDirection";
 var DataPreviewTable = /*#__PURE__*/forwardRef(function (props, ref) {
   var _wrapRef$current5;
@@ -16,13 +16,16 @@ var DataPreviewTable = /*#__PURE__*/forwardRef(function (props, ref) {
     datasource = _props$datasource === void 0 ? [] : _props$datasource,
     width = props.width,
     height = props.height,
+    _props$headerHeight = props.headerHeight,
+    headerHeight = _props$headerHeight === void 0 ? 0 : _props$headerHeight,
     loading = props.loading,
     dataStatus = props.dataStatus,
     _props$errorMsg = props.errorMsg,
     errorMsg = _props$errorMsg === void 0 ? '数据加载失败' : _props$errorMsg;
+  var realHeaderHeight = Math.max(headerHeight, DEFAULT_HEADER_HEIGHT);
   var contentHeight = useMemo(function () {
-    return datasource.length * CELL_HEIGHT + HEADER_HEIGHT;
-  }, [datasource]);
+    return datasource.length * CELL_HEIGHT + realHeaderHeight;
+  }, [datasource, realHeaderHeight]);
   var wrapRef = useRef(null);
   var progressRef = useRef(null);
   var _useDirection = useDirection(columns, wrapRef),
@@ -71,9 +74,9 @@ var DataPreviewTable = /*#__PURE__*/forwardRef(function (props, ref) {
   var skeletonRows = useMemo(function () {
     var _wrapRef$current4;
     if (!wrapRef.current) return 0;
-    var rows = Math.ceil(((((_wrapRef$current4 = wrapRef.current) === null || _wrapRef$current4 === void 0 ? void 0 : _wrapRef$current4.clientHeight) || 0) - HEADER_HEIGHT) / CELL_HEIGHT);
+    var rows = Math.ceil(((((_wrapRef$current4 = wrapRef.current) === null || _wrapRef$current4 === void 0 ? void 0 : _wrapRef$current4.clientHeight) || 0) - realHeaderHeight) / CELL_HEIGHT);
     return rows - 1 < 0 ? 0 : rows - 1;
-  }, []);
+  }, [realHeaderHeight]);
   return /*#__PURE__*/React.createElement(ScrollArea, {
     ref: wrapRef,
     style: {
@@ -90,7 +93,7 @@ var DataPreviewTable = /*#__PURE__*/forwardRef(function (props, ref) {
     })
   }, /*#__PURE__*/React.createElement("div", {
     style: {
-      height: dataStatus === 'pending' ? skeletonRows * CELL_HEIGHT + HEADER_HEIGHT : contentHeight,
+      height: dataStatus === 'pending' ? skeletonRows * CELL_HEIGHT + realHeaderHeight : contentHeight,
       position: 'relative'
     }
   }, /*#__PURE__*/React.createElement("div", {
@@ -101,6 +104,7 @@ var DataPreviewTable = /*#__PURE__*/forwardRef(function (props, ref) {
     ref: progressRef
   }), /*#__PURE__*/React.createElement(Header, {
     contentWidth: contentWidth,
+    headerHeight: realHeaderHeight,
     columns: tableColumns,
     columnLayout: columnLayout,
     setWidth: setColumnsWidth,
@@ -112,7 +116,8 @@ var DataPreviewTable = /*#__PURE__*/forwardRef(function (props, ref) {
     columnRange: columnRange,
     columnLayout: columnLayout,
     datasource: datasource,
-    rowRange: rowRange
+    rowRange: rowRange,
+    headerHeight: realHeaderHeight
   }), dataStatus === 'error' && /*#__PURE__*/React.createElement(Error, {
     errorMsg: errorMsg,
     wrapWidth: ((_wrapRef$current5 = wrapRef.current) === null || _wrapRef$current5 === void 0 ? void 0 : _wrapRef$current5.clientWidth) || 0

package/dist/DataPreviewTable/interface.d.ts

@@ -4,6 +4,7 @@ export interface ITableProps {
     datasource?: TValue[][];
     width?: CSSProperties['width'];
     height?: CSSProperties['height'];
+    headerHeight?: number;
     dataStatus?: 'pending' | 'success' | 'error';
     loading?: boolean;
     errorMsg?: string | React.ReactNode;

package/dist/DataPreviewTable/style/index.less

@@ -22,13 +22,12 @@
 }
 
 .ald-data-preview-header {
-  height: 32px;
   z-index: 2;
-  background: var(--alias-colors-bg-skeleton-subtle, #f9fafb);
   width: 100%;
 }
 
 .ald-data-preview-header-cell {
+  background: var(--alias-colors-bg-skeleton-subtle, #f9fafb);
   height: 100%;
   position: relative;
   border: 1px solid var(--alias-colors-border-default, #e5e7eb);

package/dist/Empty/style/index.less

@@ -32,13 +32,13 @@
   }
 
   .ald-empty-title-small {
-    color: #858585;
+    color: #4b5563;
     font-weight: 400;
     font-size: 14px;
   }
 
   .ald-empty-description {
-    color: var(--alias-colors-text-subtlest, #9ca3af);
+    color: #4b5563;
     font-size: 12px;
     line-height: 20px;
     font-weight: 400;