@zat-design/sisyphus-react 4.0.0-beta.2 → 4.0.0-beta.4

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

@@ -1,166 +1,187 @@
-"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
+// src/ProLayout/components/ProCollapse/index.tsx
+var ProCollapse_exports = {};
+__export(ProCollapse_exports, {
+  default: () => ProCollapse_default
 });
-exports.default = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _isBoolean2 = _interopRequireDefault(require("lodash/isBoolean"));
-var _jsxRuntime = require("react/jsx-runtime");
-var _react = require("react");
-var _antd = require("antd");
-var _icons = require("@ant-design/icons");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _fold = _interopRequireDefault(require("../../../assets/fold.svg"));
-var _index = _interopRequireDefault(require("../../../ProIcon/index"));
-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,
-    _props$collapseProps = props.collapseProps,
-    collapseProps = _props$collapseProps === void 0 ? {} : _props$collapseProps,
-    collapsePanelProps = props.collapsePanelProps,
-    className = props.className,
-    icon = props.icon,
-    _props$autoHeight = props.autoHeight,
-    autoHeight = _props$autoHeight === void 0 ? true : _props$autoHeight,
-    onChange = props.onChange,
-    open = props.open;
-  // 当同时设置了open和collapseProps.activeKey时，以collapseProps.activeKey为准
-  // 这样保证了与已有代码的兼容性，并提供了更简便的控制面板展开状态的方式
-  var finalCollapseProps = (0, _objectSpread2.default)({}, collapseProps);
-  if (open !== undefined && !('activeKey' in finalCollapseProps)) {
-    finalCollapseProps.activeKey = open ? ['1'] : [];
+module.exports = __toCommonJS(ProCollapse_exports);
+var import_react = require("react");
+var import_antd = require("antd");
+var import_icons = require("@ant-design/icons");
+var import_classnames = __toESM(require("classnames"));
+var import_fold = __toESM(require("../../../assets/fold.svg"));
+var import_ProIcon = __toESM(require("../../../ProIcon/index"));
+var ProCollapse = (props) => {
+  const {
+    title,
+    id,
+    contentStyle = {},
+    children,
+    level = "1",
+    towCollapse = false,
+    threeCollapse = false,
+    titleList,
+    extra,
+    column = 3,
+    style,
+    folding = false,
+    collapseProps = {},
+    collapsePanelProps,
+    className,
+    icon,
+    autoHeight = true,
+    onChange,
+    open
+  } = props;
+  const finalCollapseProps = { ...collapseProps };
+  if (open !== void 0 && !("activeKey" in finalCollapseProps)) {
+    finalCollapseProps.activeKey = open ? ["1"] : [];
   }
-  var cls = (0, _classnames.default)((0, _defineProperty2.default)({
-    'pro-collapse': true,
-    'pro-collapse-level2': level === '2',
-    'pro-collapse-list': titleList === null || titleList === void 0 ? void 0 : titleList.length,
-    'pro-collapse-no-title': !title,
-    'pro-collapse-no-level1-title': !title && level !== '2'
-  }, "".concat(className), className));
-  var content = (0, _jsxRuntime.jsx)("div", {
-    className: "pro-collapse-content",
-    style: contentStyle,
-    children: children
+  const cls = (0, import_classnames.default)({
+    "pro-collapse": true,
+    "pro-collapse-level2": level === "2",
+    "pro-collapse-level3": level === "3",
+    "pro-collapse-list": titleList == null ? void 0 : titleList.length,
+    "pro-collapse-no-title": !title,
+    "pro-collapse-no-level1-title": !title && level !== "2" && level !== "3",
+    [`${className}`]: className
   });
-  // 生成 Collapse items 配置
-  var getCollapseItems = function getCollapseItems() {
-    var _title = title;
-    var panelClassName = 'pro-collapse-panel';
-    var panelProps = {};
-    if (level === '2') {
-      panelClassName = (0, _classnames.default)({
-        'pro-collapse-level2-collapse': towCollapse,
-        'pro-collapse-level2-no-collapse': !towCollapse,
-        'pro-collapse-panel': true
+  const content = /* @__PURE__ */ React.createElement("div", { className: "pro-collapse-content", style: contentStyle }, children);
+  const getCollapseItems = () => {
+    let _title = title;
+    let panelClassName = "pro-collapse-panel";
+    const panelProps = {};
+    if (level === "2") {
+      panelClassName = (0, import_classnames.default)({
+        "pro-collapse-level2-collapse": towCollapse,
+        "pro-collapse-level2-no-collapse": !towCollapse,
+        "pro-collapse-panel": true
       });
       if (!towCollapse) {
-        panelProps.collapsible = 'disabled';
+        panelProps.collapsible = "disabled";
       }
     }
-    if (icon) {
-      _title = (0, _jsxRuntime.jsxs)(_antd.Space, {
-        size: 8,
-        align: "center",
-        children: [(0, _jsxRuntime.jsx)("div", {
-          className: "pro-collapse-icon",
-          children: (0, _isBoolean2.default)(icon) ? (0, _jsxRuntime.jsx)(_index.default, {
-            src: _fold.default,
-            actionMap: {
-              fill: []
-            }
-          }) : icon
-        }), title]
+    if (level === "3") {
+      const level3Panel = (0, import_classnames.default)({
+        "pro-collapse-level3-collapse": threeCollapse,
+        "pro-collapse-level3-no-collapse": !threeCollapse,
+        "pro-collapse-panel": true
       });
+      const hasCollapse = {};
+      if (!threeCollapse) {
+        hasCollapse.collapsible = "disabled";
+      }
+      return [
+        {
+          key: "1",
+          label: _title,
+          children: content,
+          extra: /* @__PURE__ */ React.createElement("div", { className: "extra-info" }, extra),
+          className: level3Panel,
+          forceRender: true,
+          ...hasCollapse,
+          ...collapsePanelProps
+        }
+      ];
     }
-    return [(0, _objectSpread2.default)((0, _objectSpread2.default)({
-      key: '1',
-      label: _title,
-      children: content,
-      extra: (0, _jsxRuntime.jsx)("div", {
-        className: "extra-info",
-        children: extra
-      }),
-      className: panelClassName,
-      forceRender: true
-    }, panelProps), collapsePanelProps)];
+    if (icon) {
+      _title = /* @__PURE__ */ React.createElement(import_antd.Space, { size: 8, align: "center" }, /* @__PURE__ */ React.createElement("div", { className: "pro-collapse-icon" }, typeof icon === "boolean" ? /* @__PURE__ */ React.createElement(
+        import_ProIcon.default,
+        {
+          src: import_fold.default,
+          actionMap: {
+            fill: []
+          }
+        }
+      ) : icon), title);
+    }
+    return [
+      {
+        key: "1",
+        label: _title,
+        children: content,
+        extra: /* @__PURE__ */ React.createElement("div", { className: "extra-info" }, extra),
+        className: panelClassName,
+        forceRender: true,
+        ...panelProps,
+        ...collapsePanelProps
+      }
+    ];
   };
-  var renderTitleList = function renderTitleList() {
-    return (0, _jsxRuntime.jsxs)("div", {
-      className: cls,
-      children: [(0, _jsxRuntime.jsx)(_antd.Descriptions, {
-        column: column,
-        children: titleList === null || titleList === void 0 ? void 0 : titleList.map(function (item) {
-          return (0, _jsxRuntime.jsx)(_antd.Descriptions.Item, {
-            label: item.label,
-            children: item.value || '-'
-          }, item.label);
-        })
-      }), content]
-    });
+  const renderTitleList = () => {
+    return /* @__PURE__ */ React.createElement("div", { className: cls }, /* @__PURE__ */ React.createElement(import_antd.Descriptions, { column }, titleList == null ? void 0 : titleList.map((item) => {
+      return /* @__PURE__ */ React.createElement(import_antd.Descriptions.Item, { label: item.label, key: item.label }, item.value || "-");
+    })), content);
   };
-  // 当pro-layout-content只存在一个card时，高度动态计算
-  (0, _react.useLayoutEffect)(function () {
+  (0, import_react.useLayoutEffect)(() => {
     if (!autoHeight) {
       return;
     }
-    var proCollapseContent = document.querySelector('.pro-layout-content');
+    const proCollapseContent = document.querySelector(".pro-layout-content");
     if (!proCollapseContent) {
       return;
     }
-    var proCollapseNoTitles = proCollapseContent.querySelectorAll('.pro-collapse-no-level1-title');
-    var proFooterNode = proCollapseContent.querySelector('.pro-footer');
-    var proCollapses = proCollapseContent.querySelectorAll('.pro-collapse');
-    if ((proCollapseNoTitles === null || proCollapseNoTitles === void 0 ? void 0 : proCollapseNoTitles.length) === 1 && proCollapses.length === 1) {
-      var rect = proCollapseNoTitles[0].getBoundingClientRect();
-      if ((rect === null || rect === void 0 ? void 0 : rect.height) < window.innerHeight - rect.top) {
-        proCollapseNoTitles[0].style.minHeight = "calc(100vh - ".concat(rect.top + 16, "px)");
+    const proCollapseNoTitles = proCollapseContent.querySelectorAll(
+      ".pro-collapse-no-level1-title"
+    );
+    const proFooterNode = proCollapseContent.querySelector(".pro-footer");
+    const proCollapses = proCollapseContent.querySelectorAll(".pro-collapse");
+    if ((proCollapseNoTitles == null ? void 0 : proCollapseNoTitles.length) === 1 && proCollapses.length === 1) {
+      const rect = proCollapseNoTitles[0].getBoundingClientRect();
+      if ((rect == null ? void 0 : rect.height) < window.innerHeight - rect.top) {
+        proCollapseNoTitles[0].style.minHeight = `calc(100vh - ${rect.top + 16}px)`;
       } else {
-        proCollapseNoTitles[0].style.minHeight = 'auto';
+        proCollapseNoTitles[0].style.minHeight = "auto";
       }
       if (proFooterNode) {
-        proCollapseNoTitles[0].style.minHeight = "calc(100vh - ".concat(rect.top + proFooterNode.offsetHeight + 16, "px)");
+        proCollapseNoTitles[0].style.minHeight = `calc(100vh - ${rect.top + proFooterNode.offsetHeight + 16}px)`;
       }
     }
-    return function () {
+    return () => {
       if (proCollapseNoTitles.length === 1 && proCollapses.length === 1) {
-        proCollapseNoTitles[0].style.minHeight = 'auto'; // 移除 minHeight 的设置
+        proCollapseNoTitles[0].style.minHeight = "auto";
       }
     };
   });
-  return (0, _jsxRuntime.jsx)("div", {
-    id: id,
-    style: style,
-    children: Array.isArray(titleList) && titleList.length ? renderTitleList() : (0, _jsxRuntime.jsx)(_antd.Collapse, (0, _objectSpread2.default)({
+  return /* @__PURE__ */ React.createElement("div", { id, style }, Array.isArray(titleList) && titleList.length ? renderTitleList() : /* @__PURE__ */ React.createElement(
+    import_antd.Collapse,
+    {
       className: cls,
       bordered: false,
-      expandIcon: function expandIcon(_ref) {
-        var isActive = _ref.isActive;
-        return (0, _jsxRuntime.jsx)(_icons.CaretRightOutlined, {
-          rotate: isActive ? -90 : 90
-        });
-      },
+      expandIcon: ({ isActive }) => /* @__PURE__ */ React.createElement(import_icons.CaretRightOutlined, { rotate: isActive ? -90 : 90 }),
       expandIconPosition: "end",
-      defaultActiveKey: folding ? [] : ['1'],
-      onChange: onChange,
-      items: getCollapseItems()
-    }, finalCollapseProps))
-  });
+      defaultActiveKey: folding ? [] : ["1"],
+      onChange,
+      items: getCollapseItems(),
+      ...finalCollapseProps
+    }
+  ));
 };
-var _default = exports.default = ProCollapse;
+var ProCollapse_default = ProCollapse;

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

@@ -1,5 +1,3 @@
-/* @root-entry-name: 'default'; */
-/* @import (reference) '~antd/es/style/themes/index.less'; */
 
 .pro-collapse {
   .pro-collapse-icon{
@@ -33,7 +31,8 @@
   .@{ant-prefix}-collapse-header {
     align-items: center !important;
     padding: 10px var(--zaui-space-size-md, 16px) !important;
-    background: var(--zaui-area, #fafafa);
+    background: #e4f2fe;
+    border-radius: 8px !important;
   }
 
   .@{ant-prefix}-collapse-header-text {
@@ -99,7 +98,7 @@
     }
 
     .pro-collapse-content {
-      padding: var(--zaui-space-size-sm, 8px) 0 !important;
+      padding: var(--zaui-space-size-md, 16px) !important;
     }
 
     .pro-collapse-level2-collapse {
@@ -111,6 +110,7 @@
         padding: 0 8px 6px !important;
         border-bottom: 1px solid #dee0e3;
         margin: 0 -8px;
+        border-radius: 0 !important;
         .@{ant-prefix}-collapse-arrow{
           right: 8px;
         }
@@ -150,6 +150,9 @@
       .@{ant-prefix}-collapse-expand-icon {
         display: none;
       }
+      .pro-collapse-content{
+        padding: var(--zaui-space-size-sm, 8px) 0 !important;
+      }
     }
   }
 
@@ -201,4 +204,145 @@
     }
 
   }
+
+  &.pro-collapse-level3 {
+    margin-bottom: var(--zaui-space-size-md, 16px);
+
+    .pro-collapse-level2{
+      margin-top: 8px !important;
+      .pro-collapse-panel {
+        border: none !important;
+      }
+      .@{ant-prefix}-collapse-header {
+        height: auto !important;
+        background: #fff !important;
+        &:hover{
+          background: #fff !important;
+        }
+        .@{ant-prefix}-collapse-header-text {
+          &:before{
+            display: block;
+          }
+        }
+  
+        .@{ant-prefix}-collapse-extra {
+          .extra-info {
+            font-size: var(--zaui-font-size, 14px);
+            color: var(--zaui-text, #343434);
+          }
+        }
+      }
+      .@{ant-prefix}-collapse-content{
+        .@{ant-prefix}-collapse-content-box{
+          .pro-collapse-content{
+            padding: var(--zaui-space-size-sm, 8px) 0 !important;
+          }
+        }
+      }
+     
+    }
+   
+    .@{ant-prefix}-collapse-item-active{
+      margin-bottom: 0 !important;
+    }
+    .pro-collapse-panel {
+      border: 1px solid #d9d9d9;
+      margin-bottom: var(--zaui-space-size-md, 16px);
+      overflow: hidden;
+      border-radius: 8px !important;
+      
+      &:last-child {
+        margin-bottom: 0;
+        border-bottom: 1px solid #d9d9d9;
+      }
+    }
+
+    .pro-collapse-level3-no-collapse{
+      .@{ant-prefix}-collapse-header{
+        padding: 0 !important;
+      }
+    }
+
+    .@{ant-prefix}-collapse-header {
+      height: 48px !important;
+      padding: 0 var(--zaui-space-size-md, 16px) !important;
+      background: #F8F8F8 !important;
+      border-radius: 8px;
+      align-items: center !important;
+      justify-content: center !important;
+      display: flex !important;
+      margin: 0 !important;
+      border-bottom: none !important;
+
+      .@{ant-prefix}-collapse-header-text {
+        font-size: var(--zaui-font-size, 14px);
+        font-weight: 500;
+        color: var(--zaui-text, #343434);
+        padding-left: 16px !important;
+        &:before{
+          display: none;
+        }
+      }
+
+      .@{ant-prefix}-collapse-extra {
+        .extra-info {
+          font-size: var(--zaui-font-size, 14px);
+          color: var(--zaui-text, #343434);
+        }
+      }
+    }
+
+    .@{ant-prefix}-collapse-content {
+      .@{ant-prefix}-collapse-content-box {
+        .pro-collapse-content {
+          padding: var(--zaui-space-size-md, 16px) !important;
+          background: var(--zaui-base-bg, #ffffff);
+        }
+      }
+    }
+
+    // 可折叠样式
+    .pro-collapse-level3-collapse {
+      .@{ant-prefix}-collapse-expand-icon {
+        display: block !important;
+        color: #999;
+        margin-right: 8px;
+      }
+      
+      .@{ant-prefix}-collapse-header {
+        cursor: pointer;
+        padding: 0 !important;
+        &:hover {
+          background: #f0f0f0;
+        }
+      }
+    }
+
+    // 不可折叠样式
+    .pro-collapse-level3-no-collapse {
+      .@{ant-prefix}-collapse-expand-icon {
+        display: none !important;
+      }
+      
+      .@{ant-prefix}-collapse-header {
+        cursor: default;
+      }
+    }
+
+    // 禁用折叠时的样式
+    &.@{ant-prefix}-collapse .@{ant-prefix}-collapse-item-disabled > .@{ant-prefix}-collapse-header,
+    .@{ant-prefix}-collapse
+      .@{ant-prefix}-collapse-item-disabled
+      > .@{ant-prefix}-collapse-header
+      > .arrow {
+      color: var(--zaui-text, #343434);
+      cursor: default;
+      background: #F8F8F8 !important;
+    }
+  }
+  // 当pro-collapse-content直接包含level3且不包含level2时，添加padding
+ .pro-collapse-level2 .pro-collapse-content:has(.pro-collapse-level3) {
+    padding: var(--zaui-space-size-md, 16px) !important;
+    padding-right: 0 !important;
+  } 
 }

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

@@ -1,5 +1,17 @@
-"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
+// src/ProLayout/components/ProFooter/PropTypes.ts
+var PropTypes_exports = {};
+module.exports = __toCommonJS(PropTypes_exports);

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

@@ -1,57 +1,71 @@
-"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
+// src/ProLayout/components/ProFooter/index.tsx
+var ProFooter_exports = {};
+__export(ProFooter_exports, {
+  default: () => ProFooter_default
 });
-exports.default = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _jsxRuntime = require("react/jsx-runtime");
-var _ahooks = require("ahooks");
-var _antd = require("antd");
-var _classnames2 = _interopRequireDefault(require("classnames"));
-var _react = 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 ? 98 : _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 () {
+module.exports = __toCommonJS(ProFooter_exports);
+var import_ahooks = require("ahooks");
+var import_antd = require("antd");
+var import_classnames = __toESM(require("classnames"));
+var import_react = require("react");
+var ProFooter = (props) => {
+  const {
+    visible = true,
+    className,
+    children,
+    zIndex = 98,
+    sideDom = ".pro-layout-sider-nav",
+    contentDom = ".pro-layout-content"
+  } = props;
+  const size = (0, import_ahooks.useSize)(
+    () => document.querySelector(sideDom) || document.querySelector(".pro-layout-menu")
+  );
+  const boxDom = document.querySelector(contentDom);
+  (0, import_react.useEffect)(() => {
     if (boxDom && visible) {
-      boxDom.style.paddingBottom = '64px';
+      boxDom.style.paddingBottom = "64px";
     }
-    return function () {
+    return () => {
       if (boxDom) {
-        boxDom.style.paddingBottom = '0px';
+        boxDom.style.paddingBottom = "0px";
       }
     };
   }, [boxDom]);
   if (!visible) {
     return null;
   }
-  var cls = (0, _classnames2.default)((0, _defineProperty2.default)({
-    'pro-footer': true
-  }, "".concat(className), className));
-  return (0, _jsxRuntime.jsx)("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),
-    children: (0, _jsxRuntime.jsx)(_antd.Space, {
-      children: children
-    })
+  const cls = (0, import_classnames.default)({
+    "pro-footer": true,
+    [`${className}`]: className
   });
+  return /* @__PURE__ */ React.createElement("div", { className: cls, style: { zIndex, width: `calc(100% - ${size == null ? void 0 : size.width}px)`, ...props.style } }, /* @__PURE__ */ React.createElement(import_antd.Space, null, children));
 };
-var _default = exports.default = /*#__PURE__*/(0, _react.memo)(ProFooter);
+var ProFooter_default = (0, import_react.memo)(ProFooter);

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

@@ -1,5 +1,3 @@
-/* @root-entry-name: 'default'; */
-/* @import (reference) '~antd/es/style/themes/index.less'; */
 
 .pro-footer {
   position: fixed;