@ztocwst/rc-pro-materials 0.2.38 → 0.2.39

package/lib/components/z-data-stat/components/CardDetail/index.less

@@ -0,0 +1,164 @@
+@gap: 16px;
+
+.rc-card-detail {
+  width: 100%;
+  // height: 200px;
+  // background-color: #F8F8F9;
+  border-radius: 8px;
+
+  .rc-card-detail_header-data {
+    display: flex;
+    // gap: @gap;
+    justify-content: space-between;
+  }
+  // .rc-card-detail_header-target-item {
+  //   border: 1px solid rgba(0, 0, 0, 0);
+  // }
+  .rc-card-detail_header-target {
+    z-index: 1;
+    display: flex;
+    flex: 1;
+    gap: @gap;
+    justify-content: space-between;
+    padding: 0 @gap @gap @gap;
+    background-color: #fff;
+    border-radius: 8px;
+    &:hover {
+      .rc-card-detail_header-target-item {
+        border: 1px solid #487ffb;
+      }
+    }
+  }
+
+  // .rc-card-detail_filter {
+  //   width: 120px;
+  //   padding: @gap 0;
+  // }
+
+  .rc-card-detail_filter-content {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 100%;
+    background-color: #f8f8f9;
+    border-radius: 8px;
+  }
+
+  .rc-card-detail_filter {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 120px;
+    padding: 0 0 @gap 0;
+  }
+
+  .rc-card-detail_filter-content-before {
+    &::before {
+      position: absolute;
+      bottom: -20px;
+      left: 0;
+      width: 104%;
+      height: 30px;
+      background-color: #f8f8f9;
+      content: '';
+    }
+  }
+
+  .rc-card-detail_target-before {
+    position: relative;
+
+    &::before {
+      position: absolute;
+      width: 100%;
+      content: '';
+    }
+  }
+
+  .rc-card-detail_list {
+    position: relative;
+    // height: 200px;
+    width: 100%;
+    background-color: #f8f8f9;
+    border-top-right-radius: 8px;
+    border-bottom-right-radius: 8px;
+    border-bottom-left-radius: 8px;
+
+    &::before {
+      position: absolute;
+      width: 100%;
+      content: '';
+    }
+
+    .rc-dard-detail_list-empty {
+      position: absolute;
+      top: 50%;
+      right: 0;
+      left: 0;
+      margin: 0;
+      transform: translateY(-50%);
+    }
+  }
+
+  .rc-card-detail_filter-name {
+    // margin-right: 12px;
+    // color: #008dff;
+    font-size: 16px;
+
+    .rc-card-detail_setting {
+      font-size: 14px;
+      cursor: pointer;
+      &:hover {
+        color: #008dff;
+      }
+    }
+  }
+
+  .rc-card-detail_list-item {
+    display: flex;
+    gap: @gap;
+    width: 100%;
+    cursor: pointer;
+    &:hover {
+      .rc-card-detail_header-target-item {
+        border: 1px solid #487ffb;
+      }
+    }
+  }
+
+  .rc-card-detail_list-header {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #262626;
+    font-weight: 500;
+    font-size: 14px;
+  }
+}
+
+.rc-card-detail_popover-content {
+  .rc-card-detail_popover-content_item {
+    position: relative;
+    display: flex;
+    align-items: center;
+    width: 155px;
+    padding: 10px 12px;
+    color: #262626;
+    font-size: 14px;
+    cursor: pointer;
+
+    &:hover {
+      background: #f5f5f5;
+      border-radius: 4px;
+    }
+
+    .active {
+      position: absolute;
+      top: 50%;
+      right: 12px;
+      transform: translateY(-50%);
+    }
+  }
+}

package/lib/components/z-data-stat/components/CardDetail/interface.d.ts

@@ -0,0 +1,30 @@
+import type { TargetBlockProps } from '../TargetBlock/interface';
+export interface CardDetailProps {
+    loading: boolean;
+    columns: TargetBlockProps[];
+    request: (data: any) => Promise<any>;
+    handleClick?: (data?: any) => void;
+    filter: {
+        columns: Array<{
+            label: string;
+            key: string;
+            dim: Array<{
+                name: string;
+                description: string;
+                alias: string;
+            }>;
+        }>;
+    };
+    list: {
+        columns: TargetBlockProps[];
+        formatter: (data: any) => any;
+        request: (data: any) => Promise<any>;
+        handleClick: (data: {
+            record: any;
+            filter: any;
+        }) => void;
+    };
+}
+export interface CardDetailRef {
+    refresh: (params: any) => void;
+}

package/lib/components/z-data-stat/components/CardDetail/interface.js

@@ -0,0 +1,3 @@
+"use strict";
+
+exports.__esModule = true;

package/lib/components/z-data-stat/components/StepBlock/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { StepBlockProps } from './interface';
+import './index.less';
+declare const StepBlock: React.FC<StepBlockProps>;
+export default StepBlock;

package/lib/components/z-data-stat/components/StepBlock/index.js

@@ -0,0 +1,109 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _TargetBlock = _interopRequireDefault(require("../TargetBlock"));
+require("./index.less");
+var _icons = _interopRequireDefault(require("@ant-design/icons"));
+var SvgIcon = function SvgIcon(props) {
+  var color = props.color;
+  return /*#__PURE__*/_react["default"].createElement(_icons["default"], (0, _extends2["default"])({}, props, {
+    component: function component() {
+      return /*#__PURE__*/_react["default"].createElement("svg", {
+        width: "29px",
+        height: "14px",
+        viewBox: "0 0 29 14"
+      }, /*#__PURE__*/_react["default"].createElement("defs", null, /*#__PURE__*/_react["default"].createElement("linearGradient", {
+        x1: "50%",
+        y1: "9.31946221%",
+        x2: "50%",
+        y2: "100%",
+        id: "" + color
+      }, /*#__PURE__*/_react["default"].createElement("stop", {
+        stopColor: color,
+        stopOpacity: "0",
+        offset: "0%"
+      }), /*#__PURE__*/_react["default"].createElement("stop", {
+        stopColor: color,
+        stopOpacity: "0.851234703",
+        offset: "100%"
+      }))), /*#__PURE__*/_react["default"].createElement("g", {
+        stroke: "none",
+        strokeWidth: "1",
+        fill: "none",
+        fillRule: "evenodd"
+      }, /*#__PURE__*/_react["default"].createElement("g", {
+        transform: "translate(-1147.000000, -709.000000)",
+        fill: "url(#" + color + ")"
+      }, /*#__PURE__*/_react["default"].createElement("path", {
+        d: "M1148.1208,715 L1154.57983,715 L1154.57983,715 L1152.36141,707.93602 C1152.27868,707.672564 1152.42518,707.391919 1152.68863,707.309181 C1152.78332,707.279445 1152.88471,707.27856 1152.9799,707.306639 L1161.5,709.819817 L1161.5,709.819817 L1169.72517,707.31419 C1169.98932,707.23372 1170.2687,707.382628 1170.34917,707.646785 C1170.37803,707.74152 1170.3781,707.842691 1170.34939,707.937469 L1168.20961,715 L1168.20961,715 L1174.8792,715 C1175.15534,715 1175.3792,715.223858 1175.3792,715.5 C1175.3792,715.689491 1175.27208,715.8627 1175.10254,715.947344 L1161.72335,722.627174 C1161.58272,722.697381 1161.41728,722.697381 1161.27665,722.627174 L1147.89746,715.947344 C1147.6504,715.823994 1147.55011,715.523716 1147.67346,715.276655 C1147.7581,715.107119 1147.93131,715 1148.1208,715 Z",
+        id: "\u77E9\u5F62\u5907\u4EFD-11"
+      }))));
+    }
+  }));
+};
+var StepBlock = function StepBlock(props) {
+  var _data$dataIndex;
+  var title = props.title,
+    _props$style = props.style,
+    style = _props$style === void 0 ? {} : _props$style,
+    data = props.data,
+    dataIndex = props.dataIndex,
+    _props$valueStyle = props.valueStyle,
+    valueStyle = _props$valueStyle === void 0 ? {} : _props$valueStyle,
+    _props$columns = props.columns,
+    columns = _props$columns === void 0 ? [] : _props$columns,
+    _props$direction = props.direction,
+    direction = _props$direction === void 0 ? 'vertical' : _props$direction;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "rc-step-block",
+    style: style
+  }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "rc-step-block_title"
+  }, title), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "rc-step-block_value",
+    style: valueStyle
+  }, (_data$dataIndex = data === null || data === void 0 ? void 0 : data[dataIndex]) !== null && _data$dataIndex !== void 0 ? _data$dataIndex : '')), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "rc-step-block_content",
+    style: direction === 'horizontal' ? {
+      flexDirection: direction === 'horizontal' ? 'row' : 'column',
+      flex: 1,
+      display: 'flex'
+    } : {}
+  }, columns.map(function (column) {
+    var _column$;
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      key: "" + (column === null || column === void 0 ? void 0 : (_column$ = column[0]) === null || _column$ === void 0 ? void 0 : _column$.dataIndex),
+      className: "rc-step-block_content-item",
+      style: direction === 'horizontal' ? {
+        flexDirection: direction === 'horizontal' ? 'row' : 'column',
+        flex: 1,
+        display: 'flex',
+        gap: '24px'
+      } : {}
+    }, Array.isArray(column) && (column === null || column === void 0 ? void 0 : column.map(function (target, idx) {
+      var _target$valueStyle;
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        key: target === null || target === void 0 ? void 0 : target.dataIndex,
+        className: "rc-step-block_content-target",
+        style: idx === column.length - 1 ? {} : {
+          marginBottom: '24px'
+        }
+      }, /*#__PURE__*/_react["default"].createElement(_TargetBlock["default"], (0, _extends2["default"])({}, target, {
+        valueStyle: (0, _extends2["default"])({
+          color: valueStyle.color
+        }, (_target$valueStyle = target === null || target === void 0 ? void 0 : target.valueStyle) !== null && _target$valueStyle !== void 0 ? _target$valueStyle : {}),
+        data: data,
+        style: (0, _extends2["default"])({
+          border: 'none'
+        }, target === null || target === void 0 ? void 0 : target.style)
+      })), idx < column.length - 1 && (target === null || target === void 0 ? void 0 : target.svgProps) && /*#__PURE__*/_react["default"].createElement("div", {
+        className: "rc-step-block_item-svg"
+      }, /*#__PURE__*/_react["default"].createElement(SvgIcon, target === null || target === void 0 ? void 0 : target.svgProps)));
+    })));
+  })));
+};
+var _default = exports["default"] = StepBlock;

package/lib/components/z-data-stat/components/StepBlock/index.less

@@ -0,0 +1,40 @@
+@gap: 12px;
+
+.rc-step-block {
+  padding: 12px;
+  border-radius: 8px;
+
+  .rc-step-block_title {
+    margin-right: 16px;
+    color: #262626;
+    font-weight: 500;
+    font-size: 15px;
+  }
+
+  .rc-step-block_value {
+    font-weight: 600;
+    font-size: 18px;
+  }
+
+  .rc-step-block_content {
+    display: flex;
+    gap: @gap;
+    margin-top: 16px;
+  }
+
+  .rc-step-block_content-item {
+    flex: 1;
+  }
+
+  .rc-step-block_content-target {
+    position: relative;
+    flex: 1;
+  }
+
+  .rc-step-block_item-svg {
+    position: absolute;
+    bottom: -24px;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}

package/lib/components/z-data-stat/components/StepBlock/interface.d.ts

@@ -0,0 +1,11 @@
+import type { CSSProperties } from 'react';
+import type { TargetBlockProps } from '../TargetBlock/interface';
+export interface StepBlockProps {
+    title: string;
+    dataIndex: string;
+    columns: TargetBlockProps[][];
+    data?: Record<string, any>;
+    direction?: string;
+    style?: CSSProperties | undefined;
+    valueStyle?: CSSProperties | undefined;
+}

package/lib/components/z-data-stat/components/StepBlock/interface.js

@@ -0,0 +1,3 @@
+"use strict";
+
+exports.__esModule = true;

package/lib/components/z-data-stat/components/TargetBlock/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './index.less';
+import type { TargetBlockProps } from './interface';
+declare const TargetBlock: React.FC<TargetBlockProps>;
+export default TargetBlock;

package/lib/components/z-data-stat/components/TargetBlock/index.js

@@ -0,0 +1,111 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports["default"] = void 0;
+var _progress = _interopRequireDefault(require("antd/lib/progress"));
+var _react = _interopRequireDefault(require("react"));
+require("./index.less");
+var _util = require("../../util");
+var TargetBlock = function TargetBlock(props) {
+  var _processValue, _processValue2, _data$progress$dataIn;
+  var name = props.name,
+    _props$style = props.style,
+    style = _props$style === void 0 ? {} : _props$style,
+    _props$valueStyle = props.valueStyle,
+    valueStyle = _props$valueStyle === void 0 ? {} : _props$valueStyle,
+    progress = props.progress,
+    cTargets = props.cTargets,
+    icon = props.icon,
+    data = props.data,
+    dataIndex = props.dataIndex,
+    _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className,
+    _props$direction = props.direction,
+    direction = _props$direction === void 0 ? 'vertical' : _props$direction,
+    handleClick = props.handleClick,
+    valueType = props.valueType;
+  // const _iconProps = {
+  //   ...(iconProps ?? {}),
+  //   style: {
+  //     fontSize: '14px',
+  //     position: 'absolute',
+  //     top: '-1px',
+  //     left: '0',
+  //     ...(iconProps?.style ?? {}),
+  //   },
+  // };
+  var targetNameClass = "rc-target-block_name " + (handleClick ? 'rc-target-block_name_underline' : '');
+  var processValue = function processValue(value) {
+    if (!valueType) {
+      return value;
+    }
+    switch (valueType) {
+      case 'thousandth':
+        return (0, _util.handleValueFormat)(value);
+      case 'percent':
+        return (0, _util.handlePercent)(value);
+      default:
+        return value;
+    }
+  };
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "rc-target-block " + className,
+    style: style,
+    onClick: function onClick() {
+      handleClick === null || handleClick === void 0 ? void 0 : handleClick(data, dataIndex, cTargets);
+    }
+  }, direction === 'vertical' ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: "rc-target-block_name-value"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: targetNameClass
+  }, name), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "rc-target-block_value",
+    style: valueStyle
+  }, (_processValue = processValue(data === null || data === void 0 ? void 0 : data[dataIndex])) !== null && _processValue !== void 0 ? _processValue : '-')) : /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("span", {
+    className: targetNameClass,
+    style: {
+      marginRight: '12px'
+    }
+  }, name), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "rc-target-block_value",
+    style: valueStyle
+  }, (_processValue2 = processValue(data === null || data === void 0 ? void 0 : data[dataIndex])) !== null && _processValue2 !== void 0 ? _processValue2 : '-')), progress && /*#__PURE__*/_react["default"].createElement("div", {
+    className: "rc-target-block_progress",
+    style: progress.style
+  }, /*#__PURE__*/_react["default"].createElement(_progress["default"], {
+    size: "small",
+    percent: data === null || data === void 0 ? void 0 : data[progress.dataIndex],
+    showInfo: false
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      fontWeight: '400',
+      fontSize: '12px',
+      color: '#487FFB',
+      width: '110px',
+      background: '#EEF2FD',
+      borderRadius: '4px',
+      padding: '2px 4px',
+      marginLeft: '8px',
+      textAlign: 'center'
+    }
+  }, /*#__PURE__*/_react["default"].createElement("span", null, (_data$progress$dataIn = data === null || data === void 0 ? void 0 : data[progress.dataIndex]) !== null && _data$progress$dataIn !== void 0 ? _data$progress$dataIn : '-', "%"), /*#__PURE__*/_react["default"].createElement("span", null, progress === null || progress === void 0 ? void 0 : progress.text))), icon && icon, cTargets && /*#__PURE__*/_react["default"].createElement("div", {
+    className: "rc-target-block_ctarget"
+  }, cTargets.map(function (item, i) {
+    var _ref, _data$item$dataIndex;
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: "rc-target-block_ctarget-content",
+      style: (i + 1) % 2 === 0 ? {
+        justifySelf: 'end',
+        textAlign: 'right'
+      } : {},
+      key: (item === null || item === void 0 ? void 0 : item.name) || i
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: "rc-target-block_ctarget-name"
+    }, (item === null || item === void 0 ? void 0 : item.prefix) || '', item === null || item === void 0 ? void 0 : item.name), /*#__PURE__*/_react["default"].createElement("span", {
+      className: "rc-target-block_ctarget-value",
+      style: (item === null || item === void 0 ? void 0 : item.style) || {}
+    }, (_ref = (_data$item$dataIndex = data === null || data === void 0 ? void 0 : data[item === null || item === void 0 ? void 0 : item.dataIndex]) !== null && _data$item$dataIndex !== void 0 ? _data$item$dataIndex : item === null || item === void 0 ? void 0 : item.value) !== null && _ref !== void 0 ? _ref : '-', (item === null || item === void 0 ? void 0 : item.suffix) || ''));
+  })));
+};
+var _default = exports["default"] = TargetBlock;

package/lib/components/z-data-stat/components/TargetBlock/index.less

@@ -0,0 +1,65 @@
+.rc-target-block {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  padding: 10px;
+  background-color: #fff;
+  border: 1px solid #f0f0f0;
+  border-radius: 8px;
+
+  .rc-target-block_name-value {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+  }
+
+  .rc-target-block_name {
+    margin-right: 4px;
+    color: #666;
+    font-weight: bold;
+    font-size: 14px;
+  }
+
+  .rc-target-block_name_underline {
+    text-decoration: underline;
+    cursor: pointer;
+    text-underline-offset: 4px;
+  }
+
+  .rc-target-block_value {
+    font-weight: 700;
+    font-size: 14px;
+    text-align: right;
+  }
+
+  .rc-target-block_progress {
+    display: flex;
+    width: 100%;
+    margin-top: 4px;
+  }
+
+  .rc-target-block_ctarget {
+    // display: grid;
+    // grid-template-columns: 1fr 1fr;
+    display: flex;
+    justify-content: space-between;
+    margin-top: 4px;
+  }
+
+  // .rc-target-block_ctarget-content {
+  //   // display: flex;
+  //   // justify-content: space-between;
+  // }
+
+  .rc-target-block_ctarget-name {
+    margin-right: 4px;
+    color: #898989;
+    font-size: 12px;
+  }
+
+  .rc-target-block_ctarget-value {
+    font-weight: bold;
+    font-size: 12px;
+    text-align: right;
+  }
+}

package/lib/components/z-data-stat/components/TargetBlock/interface.d.ts

@@ -0,0 +1,31 @@
+import type { CSSProperties } from 'react';
+export interface Target {
+    name: string;
+    dataIndex?: string;
+    value?: string;
+    prefix?: string | React.ReactElement;
+    suffix?: string | React.ReactElement;
+    style?: CSSProperties | undefined;
+}
+export interface TargetBlockProps {
+    data?: Record<string, any>;
+    name: string;
+    dataIndex: string;
+    handleClick?: (data: any, dataIndex: string, indexes: Target[]) => void;
+    suffix?: string | React.ReactElement;
+    style?: CSSProperties | undefined;
+    valueStyle?: CSSProperties | undefined;
+    className?: string;
+    hiddenArrow?: boolean;
+    icon?: React.ReactNode;
+    progress?: {
+        dataIndex: string;
+        text: string;
+        style?: CSSProperties | undefined;
+    };
+    direction?: string;
+    /** 额外指标 */
+    cTargets?: Target[];
+    /** 千分位 | 百分比(保留两位小数) */
+    valueType?: 'thousandth' | 'percent';
+}

package/lib/components/z-data-stat/components/TargetBlock/interface.js

@@ -0,0 +1,3 @@
+"use strict";
+
+exports.__esModule = true;

package/lib/components/z-data-stat/components/index.d.ts

@@ -0,0 +1,7 @@
+import { StepBlockProps } from './StepBlock/interface';
+import TargetBlock from './TargetBlock';
+import CardDetail, { useCardDetailRef } from './CardDetail';
+import StepBlock from './StepBlock';
+import type { CardDetailProps, CardDetailRef } from './CardDetail/interface';
+export { TargetBlock, CardDetail, StepBlock, useCardDetailRef };
+export type { CardDetailProps, CardDetailRef, StepBlockProps };

package/lib/components/z-data-stat/components/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+var _TargetBlock = _interopRequireDefault(require("./TargetBlock"));
+exports.TargetBlock = _TargetBlock["default"];
+var _CardDetail = _interopRequireWildcard(require("./CardDetail"));
+exports.CardDetail = _CardDetail["default"];
+exports.useCardDetailRef = _CardDetail.useCardDetailRef;
+var _StepBlock = _interopRequireDefault(require("./StepBlock"));
+exports.StepBlock = _StepBlock["default"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }

package/lib/components/z-data-stat/data-stat.d.ts

@@ -0,0 +1,19 @@
+/// <reference types="react" />
+import type { CardDetailProps } from './components/CardDetail/interface';
+import type { StepBlockProps } from './components/StepBlock/interface';
+export type TypeZDataStatProps = {
+    /** 查询参数 */
+    queryParams: Record<string, any> | (() => Promise<Record<string, any>>);
+    /** 自动加载 */
+    autoLoad?: boolean;
+    /** 数据集 */
+    datasetName: string;
+    /** 头部指标 */
+    dataStatColumns: CardDetailProps['columns'];
+    /** 详情维度 */
+    filter: CardDetailProps['filter'];
+    /** 卡片指标组 */
+    stepList: StepBlockProps[];
+};
+declare const ZDataStat: import("react").ForwardRefExoticComponent<TypeZDataStatProps & import("react").RefAttributes<any>>;
+export default ZDataStat;