@zat-design/sisyphus-react 3.0.13

package/lib/ProLayout/components/ProCollapse/PropTypes.d.ts

@@ -0,0 +1,73 @@
+import React, { CSSProperties } from 'react';
+import { CollapseProps, CollapsePanelProps } from 'antd/lib/collapse';
+export type levelType = '1' | '2';
+export interface TitleListProps {
+    /**
+    * @description       描述的标题
+    * @default           -
+    */
+    label: string;
+    /**
+    * @description       描述的值
+    * @default           -
+    */
+    value: string | number | undefined | React.ReactNode;
+}
+export interface ProCollapseProps {
+    /**
+    * @description       折叠头部标题
+    * @default           -
+    */
+    title?: string | React.ReactNode;
+    /**
+    * @description       折叠头部多个标题
+    * @default           []
+    */
+    titleList?: TitleListProps[];
+    /**
+    * @description       id用于锚点定位
+    * @default           -
+    */
+    id?: string;
+    /**
+     * @description       内容区域样式
+     * @default           -
+     */
+    contentStyle?: CSSProperties;
+    /**
+    * @description       折叠等级
+    * @default           1
+    */
+    level?: levelType;
+    /**
+     * @description       二级折叠是否带收起
+     * @default           false
+     */
+    towCollapse?: boolean;
+    /**
+    * @description      标题右侧扩展信息
+    * @default           -
+    */
+    extra?: React.ReactNode;
+    /**
+    * @description      当有titleList显示的换行的数量
+    * @default           3
+    */
+    column?: number;
+    /**
+   * @description      一级标题是否默认折叠
+   * @default           false
+   */
+    folding?: boolean;
+    /**
+  * @description      antd Collapse属性
+  * @default           -
+  */
+    collapseProps?: CollapseProps;
+    /**
+  * @description      antd  CollapsePanel属性
+  * @default           -
+  */
+    collapsePanelProps?: CollapsePanelProps;
+    [key: string]: any;
+}

package/lib/ProLayout/components/ProCollapse/PropTypes.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/ProLayout/components/ProCollapse/index.d.ts

@@ -0,0 +1,3 @@
+import { ProCollapseProps } from './PropTypes';
+declare const ProCollapse: (props: ProCollapseProps) => JSX.Element;
+export default ProCollapse;

package/lib/ProLayout/components/ProCollapse/index.js

@@ -0,0 +1,100 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _react = _interopRequireDefault(require("react"));
+var _antd = require("antd");
+var _icons = require("@ant-design/icons");
+var _classnames = _interopRequireDefault(require("classnames"));
+var Panel = _antd.Collapse.Panel;
+var ProCollapse = function ProCollapse(props) {
+  var title = props.title,
+    id = props.id,
+    _props$contentStyle = props.contentStyle,
+    contentStyle = _props$contentStyle === void 0 ? {} : _props$contentStyle,
+    children = props.children,
+    _props$level = props.level,
+    level = _props$level === void 0 ? '1' : _props$level,
+    _props$towCollapse = props.towCollapse,
+    towCollapse = _props$towCollapse === void 0 ? false : _props$towCollapse,
+    titleList = props.titleList,
+    extra = props.extra,
+    _props$column = props.column,
+    column = _props$column === void 0 ? 3 : _props$column,
+    style = props.style,
+    _props$folding = props.folding,
+    folding = _props$folding === void 0 ? false : _props$folding,
+    collapseProps = props.collapseProps,
+    collapsePanelProps = props.collapsePanelProps;
+  var cls = (0, _classnames.default)({
+    'pro-collapse': true,
+    'pro-collapse-level2': level === '2',
+    'pro-collapse-list': titleList === null || titleList === void 0 ? void 0 : titleList.length
+  });
+  var content = /*#__PURE__*/_react.default.createElement("div", {
+    className: "pro-collapse-content",
+    style: contentStyle
+  }, children);
+  var renderPanel = function renderPanel() {
+    if (level === '2') {
+      var level2Panel = (0, _classnames.default)({
+        'pro-collapse-level2-collapse': towCollapse,
+        'pro-collapse-panel': true
+      });
+      var hasCollapse = {};
+      if (!towCollapse) {
+        hasCollapse.collapsible = 'disabled';
+      }
+      return /*#__PURE__*/_react.default.createElement(Panel, (0, _objectSpread2.default)((0, _objectSpread2.default)({
+        header: title,
+        key: "1",
+        className: level2Panel,
+        extra: /*#__PURE__*/_react.default.createElement("div", {
+          className: "extra-info"
+        }, extra),
+        forceRender: true
+      }, hasCollapse), collapsePanelProps), content);
+    }
+    return /*#__PURE__*/_react.default.createElement(Panel, (0, _objectSpread2.default)({
+      header: title,
+      key: "1",
+      className: "pro-collapse-panel",
+      extra: /*#__PURE__*/_react.default.createElement("div", {
+        className: "extra-info"
+      }, extra),
+      forceRender: true
+    }, collapsePanelProps), content);
+  };
+  var renderTitleList = function renderTitleList() {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: cls
+    }, /*#__PURE__*/_react.default.createElement(_antd.Descriptions, {
+      column: column
+    }, titleList === null || titleList === void 0 ? void 0 : titleList.map(function (item) {
+      return /*#__PURE__*/_react.default.createElement(_antd.Descriptions.Item, {
+        label: item.label
+      }, item.value || '-');
+    })), content);
+  };
+  return /*#__PURE__*/_react.default.createElement("div", {
+    id: id,
+    style: style
+  }, Array.isArray(titleList) && titleList.length ? renderTitleList() : /*#__PURE__*/_react.default.createElement(_antd.Collapse, (0, _objectSpread2.default)({
+    className: cls,
+    bordered: false,
+    expandIcon: function expandIcon(_ref) {
+      var isActive = _ref.isActive;
+      return /*#__PURE__*/_react.default.createElement(_icons.CaretRightOutlined, {
+        rotate: isActive ? -90 : 90
+      });
+    },
+    expandIconPosition: "end",
+    defaultActiveKey: folding ? [] : ['1']
+  }, collapseProps), renderPanel()));
+};
+var _default = ProCollapse;
+exports.default = _default;

package/lib/ProLayout/components/ProCollapse/style/index.less

@@ -0,0 +1,153 @@
+.pro-collapse {
+  background: #f6f8fc;
+
+  &.ant-collapse {
+    .pro-collapse-panel {
+      margin-bottom: var(--zaui-space-size-md, 16px);
+    }
+  }
+
+  .ant-collapse-header {
+    align-items: center !important;
+    padding    : 14px var(--zaui-space-size-md, 16px) !important;
+  }
+
+  .ant-collapse-header-text {
+    color      : var(--zaui-text, #343434);
+    font-weight: 500;
+    font-size  : var(--zaui-font-size-lg, 16px);
+  }
+
+  .ant-collapse-expand-icon {
+    color: #c5c7cd;
+  }
+
+  &.ant-collapse-borderless .ant-collapse-item>.ant-collapse-content>.ant-collapse-content-box {
+    padding: 0;
+  }
+
+  .ant-collapse-content-box {
+    padding   : 0;
+    background: var(--zaui-base-bg, #ffffff);
+
+    .pro-collapse-content {
+      padding       : var(--zaui-space-size-md, 16px);
+      padding-bottom: 0;
+      background    : var(--zaui-base-bg, #ffffff);
+    }
+  }
+
+  &.pro-collapse-level2 {
+    margin-bottom: 0;
+    background   : var(--zaui-base-bg, #ffffff);
+
+    .ant-collapse-header {
+      margin-bottom: var(--zaui-space-size-md, 16px);
+      padding      : 0 !important;
+      background   : var(--zaui-base-bg, #ffffff);
+
+      .ant-collapse-header-text {
+        position    : relative;
+        padding-left: var(--zaui-space-size-sm, 8px);
+        font-size   : var(--zaui-font-size, 14px);
+
+        &::before {
+          position     : absolute;
+          top          : 50%;
+          left         : 0;
+          width        : 4px;
+          height       : 14px;
+          background   : var(--zaui-brand);
+          border-radius: var(--zaui-border-radius-card, 2px);
+          transform    : translateY(-50%);
+          content      : '';
+        }
+      }
+
+      .ant-collapse-extra {
+        .extra-info {
+          margin-right: 8px;
+        }
+      }
+    }
+
+    .pro-collapse-level2-collapse {
+      .ant-collapse-extra {
+        .extra-info {
+          margin-right: 32px;
+        }
+      }
+    }
+
+    .pro-collapse-content {
+      padding: 0;
+    }
+
+    &.ant-collapse .ant-collapse-item-disabled>.ant-collapse-header,
+    .ant-collapse .ant-collapse-item-disabled>.ant-collapse-header>.arrow {
+      color : var(--zaui-text, #343434);
+      cursor: default;
+    }
+
+    .ant-collapse-expand-icon {
+      display: none;
+    }
+
+    .pro-collapse-level2-collapse {
+      .ant-collapse-expand-icon {
+        display: block;
+      }
+    }
+  }
+
+  .ant-collapse-extra {
+    .extra-info {
+      margin-right: 24px;
+    }
+  }
+
+  &.pro-collapse-list {
+
+    .ant-descriptions-row>th,
+    .ant-descriptions-row>td {
+      padding   : 15px 0;
+      background: #fafafa;
+
+      &.ant-descriptions-item {
+        padding-left: var(--zaui-space-size-md, 16px);
+      }
+    }
+
+    .ant-descriptions-row {
+      td:first-child {
+        position: relative;
+
+        &::before {
+          position     : absolute;
+          top          : 50%;
+          left         : 8px;
+          width        : 4px;
+          height       : 14px;
+          background   : var(--zaui-brand);
+          border-radius: var(--zaui-border-radius-card, 2px);
+          transform    : translateY(-50%);
+          content      : '';
+        }
+      }
+    }
+
+    .ant-descriptions-item-container {
+
+      .ant-descriptions-item-label,
+      .ant-descriptions-item-content {
+        color      : #0a0a0a !important;
+        font-weight: 500 !important;
+        font-size  : var(--zaui-font-size, 14px);
+      }
+    }
+
+    .ant-descriptions {
+      margin-bottom: var(--zaui-space-size-md, 16px);
+    }
+  }
+}

package/lib/ProLayout/components/ProFooter/PropTypes.d.ts

@@ -0,0 +1,11 @@
+export interface stateProps {
+    width?: number;
+    [key: string]: any;
+}
+export interface ProFooterProps {
+    visible?: boolean;
+    zIndex?: number;
+    sideDom?: string;
+    contentDom?: string;
+    [key: string]: any;
+}

package/lib/ProLayout/components/ProFooter/PropTypes.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/ProLayout/components/ProFooter/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ProFooterProps } from './PropTypes';
+declare const _default: React.MemoExoticComponent<(props: ProFooterProps) => JSX.Element>;
+export default _default;

package/lib/ProLayout/components/ProFooter/index.js

@@ -0,0 +1,55 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _ahooks = require("ahooks");
+var _antd = require("antd");
+var _classnames2 = _interopRequireDefault(require("classnames"));
+var _react = _interopRequireWildcard(require("react"));
+var ProFooter = function ProFooter(props) {
+  var _props$visible = props.visible,
+    visible = _props$visible === void 0 ? true : _props$visible,
+    className = props.className,
+    children = props.children,
+    _props$zIndex = props.zIndex,
+    zIndex = _props$zIndex === void 0 ? 100 : _props$zIndex,
+    _props$sideDom = props.sideDom,
+    sideDom = _props$sideDom === void 0 ? '.pro-layout-sider-nav' : _props$sideDom,
+    _props$contentDom = props.contentDom,
+    contentDom = _props$contentDom === void 0 ? '.pro-layout-content' : _props$contentDom;
+  var size = (0, _ahooks.useSize)(function () {
+    return document.querySelector(sideDom) || document.querySelector('.pro-layout-menu');
+  });
+  var boxDom = document.querySelector(contentDom);
+  (0, _react.useEffect)(function () {
+    if (boxDom && visible) {
+      boxDom.style.paddingBottom = '64px';
+    }
+    return function () {
+      if (boxDom) {
+        boxDom.style.paddingBottom = '16px';
+      }
+    };
+  }, [boxDom]);
+  if (!visible) {
+    return null;
+  }
+  var cls = (0, _classnames2.default)((0, _defineProperty2.default)({
+    'pro-footer': true
+  }, "".concat(className), className));
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: cls,
+    style: (0, _objectSpread2.default)({
+      zIndex: zIndex,
+      width: "calc(100% - ".concat(size === null || size === void 0 ? void 0 : size.width, "px)")
+    }, props.style)
+  }, /*#__PURE__*/_react.default.createElement(_antd.Space, null, children));
+};
+var _default = /*#__PURE__*/(0, _react.memo)(ProFooter);
+exports.default = _default;

package/lib/ProLayout/components/ProFooter/style/index.less

@@ -0,0 +1,10 @@
+.pro-footer {
+  position  : fixed;
+  bottom    : 0;
+  right     : 0;
+  width     : 100%;
+  padding   : var(--zaui-space-size-md, 16px) var(--zaui-space-size-lg, 32px);
+  background: var(--zaui-base-bg, #ffffff);
+  box-shadow: 3px 2px 12px 0 hsla(0, 0%, 59.2%, .32);
+  z-index   : 999;
+}

package/lib/ProLayout/components/ProHeader/PropTypes.d.ts

@@ -0,0 +1,72 @@
+import React from 'react';
+export type BreadcrumbType = 'breadcrumb' | 'copy' | 'info' | 'version' | 'tag';
+export type NavType = 'money' | 'thousandth' | 'enumName' | 'enumCodeName' | 'date' | 'dateTime';
+export interface BreadcrumbColumnsProps {
+    type?: BreadcrumbType;
+    valueType?: BreadcrumbType;
+    value: any;
+    width?: string | number;
+    show?: boolean;
+    tag?: string | React.ReactNode;
+}
+export interface SubDescribeColumnsProps {
+    label: string | React.ReactNode;
+    type?: NavType;
+    valueType?: NavType;
+    precision?: number;
+    value: any;
+    show?: boolean;
+    code?: string;
+}
+export interface DescribeColumnsProps {
+    label: string | React.ReactNode;
+    copyable?: boolean;
+    value: string | React.ReactNode;
+    show?: boolean;
+    link?: string;
+    tag?: string | React.ReactNode;
+}
+export interface ProHeaderProps {
+    title?: string | React.ReactNode;
+    /**
+     * @description       面包屑配置数据
+     * @deprecated        将于下个版本 4.0.0 被弃用
+     * @default           -
+     */
+    breadcrumbList?: BreadcrumbColumnsProps[];
+    /**
+   * @description      面包屑配置数据
+   * @default           -
+   */
+    breadcrumbColumns?: BreadcrumbColumnsProps[];
+    bodyOverFlowHidden?: boolean;
+    actionRender?: React.ReactNode | React.ReactNode[];
+    /**
+    * @description      次级描述数据源配置
+    * @deprecated        将于下个版本 4.0.0 被弃用
+    * @default           -
+    */
+    describeList?: SubDescribeColumnsProps[];
+    /**
+    * @description      主要描述数据源配置
+    * @default           -
+    */
+    describeColumns?: DescribeColumnsProps[];
+    /**
+    * @description      次级描述数据源配置
+    * @default           -
+    */
+    subDescribeColumns?: SubDescribeColumnsProps[];
+    /**
+   * @description      次级描述是否展开
+   * @default           -
+   */
+    collapsed?: boolean;
+    fixedTop?: string | number;
+    showBack?: boolean;
+    showShadow?: boolean;
+    autoBack?: number;
+    zIndex?: number;
+    onBack?: () => void;
+    [key: string]: any;
+}

package/lib/ProLayout/components/ProHeader/PropTypes.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/ProLayout/components/ProHeader/components/Copy/index.d.ts

@@ -0,0 +1,4 @@
+declare const Copy: ({ text }: {
+    text: any;
+}) => JSX.Element;
+export default Copy;

package/lib/ProLayout/components/ProHeader/components/Copy/index.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _antd = require("antd");
+var _reactSvg = require("react-svg");
+var _icons = require("@ant-design/icons");
+var _copy = _interopRequireDefault(require("../../../../../assets/copy.svg"));
+var Paragraph = _antd.Typography.Paragraph;
+var Copy = function Copy(_ref) {
+  var text = _ref.text;
+  return /*#__PURE__*/_react.default.createElement(Paragraph, {
+    className: "pro-header-copy",
+    copyable: {
+      text: text,
+      icon: [/*#__PURE__*/_react.default.createElement(_reactSvg.ReactSVG, {
+        key: "copy-icon",
+        className: "drag-icon",
+        src: _copy.default
+      }), /*#__PURE__*/_react.default.createElement(_icons.CheckOutlined, {
+        key: "copied-icon"
+      })],
+      tooltips: ['复制', '复制成功']
+    }
+  });
+};
+var _default = Copy;
+exports.default = _default;

package/lib/ProLayout/components/ProHeader/components/index.d.ts

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

package/lib/ProLayout/components/ProHeader/components/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Copy", {
+  enumerable: true,
+  get: function get() {
+    return _Copy.default;
+  }
+});
+var _Copy = _interopRequireDefault(require("./Copy"));

package/lib/ProLayout/components/ProHeader/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { ProHeaderProps } from './PropTypes';
+declare const _default: React.MemoExoticComponent<(props: ProHeaderProps) => JSX.Element>;
+export default _default;