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

package/lib/ProDrawerForm/components/ProDrawer/index.js

@@ -1,259 +1,192 @@
-"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 _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
+// src/ProDrawerForm/components/ProDrawer/index.tsx
+var ProDrawer_exports = {};
+__export(ProDrawer_exports, {
+  default: () => ProDrawer_default
 });
-exports.default = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _isArray2 = _interopRequireDefault(require("lodash/isArray"));
-var _jsxRuntime = require("react/jsx-runtime");
-var _antd = require("antd");
-var _react = _interopRequireWildcard(require("react"));
-var _ahooks = require("ahooks");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _reactSvg = require("react-svg");
-var _close = _interopRequireDefault(require("../../../assets/close.svg"));
-var _locale = _interopRequireDefault(require("../../../locale"));
-function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
-function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { if (r) i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n;else { var o = function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); }; o("next", 0), o("throw", 1), o("return", 2); } }, _regeneratorDefine2(e, r, n, t); }
-/**
- * 抽屉组件
- */
-var ProDrawer = function ProDrawer(_ref) {
-  var form = _ref.form,
-    title = _ref.title,
-    width = _ref.width,
-    footer = _ref.footer,
-    open = _ref.open,
-    isView = _ref.isView,
-    maskClosable = _ref.maskClosable,
-    isConfirmClose = _ref.isConfirmClose,
-    isConfirmCloseModalProps = _ref.isConfirmCloseModalProps,
-    okText = _ref.okText,
-    cancelText = _ref.cancelText,
-    okLoading = _ref.okLoading,
-    okDisabled = _ref.okDisabled,
-    onOk = _ref.onOk,
-    onCancel = _ref.onCancel,
-    children = _ref.children,
-    className = _ref.className,
-    zIndex = _ref.zIndex,
-    drawerProps = _ref.drawerProps;
-  var ref = (0, _react.useRef)(null);
-  var modalRef = (0, _react.useRef)(null);
-  var _ref2 = (0, _ahooks.useScroll)(ref) || {},
-    top = _ref2.top;
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    loading = _useState2[0],
-    toggleLoading = _useState2[1];
-  var _useState3 = (0, _react.useState)(''),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    initialSnapshot = _useState4[0],
-    setInitialSnapshot = _useState4[1];
-  var noRenderFooter = isView || footer === false || footer === null;
-  // 使用 useEffect 在 open 变更时延迟捕获 初始DOM 快照
-  (0, _react.useEffect)(function () {
+module.exports = __toCommonJS(ProDrawer_exports);
+var import_antd = require("antd");
+var import_react = __toESM(require("react"));
+var import_ahooks = require("ahooks");
+var import_classnames = __toESM(require("classnames"));
+var import_lodash = require("lodash");
+var import_react_svg = require("react-svg");
+var import_close = __toESM(require("../../../assets/close.svg"));
+var import_locale = __toESM(require("../../../locale"));
+var ProDrawer = ({
+  form,
+  title,
+  width,
+  footer,
+  open,
+  isView,
+  maskClosable,
+  isConfirmClose,
+  isConfirmCloseModalProps,
+  okText,
+  cancelText,
+  okLoading,
+  okDisabled,
+  onOk,
+  onCancel,
+  children,
+  className,
+  zIndex,
+  drawerProps
+}) => {
+  const ref = (0, import_react.useRef)(null);
+  const modalRef = (0, import_react.useRef)(null);
+  const { top } = (0, import_ahooks.useScroll)(ref) || {};
+  const [loading, toggleLoading] = (0, import_react.useState)(false);
+  const [initialSnapshot, setInitialSnapshot] = (0, import_react.useState)("");
+  const noRenderFooter = isView || footer === false || footer === null;
+  (0, import_react.useEffect)(() => {
     if (open) {
-      // 延迟到下一个事件循环，确保 Drawer 已经渲染
-      var timeoutId = setTimeout(function () {
+      const timeoutId = setTimeout(() => {
         if (ref.current) {
-          setInitialSnapshot(ref.current.innerHTML); // 捕获 DOM 快照
+          setInitialSnapshot(ref.current.innerHTML);
         }
-      }, 100); // 使用 setTimeout 让 DOM 渲染完成后再执行
-      return function () {
-        return clearTimeout(timeoutId);
-      }; // 清理定时器
+      }, 100);
+      return () => clearTimeout(timeoutId);
     }
-    setInitialSnapshot('');
-  }, [open]); // 当 open 变化时执行
-  // 快照对比
-  var compareSnapshots = function compareSnapshots() {
-    if (!ref.current) return false;
+    setInitialSnapshot("");
+  }, [open]);
+  const compareSnapshots = () => {
+    if (!ref.current)
+      return false;
     return ref.current.innerHTML === initialSnapshot;
   };
-  var onConfirm = (0, _react.useCallback)(/*#__PURE__*/(0, _asyncToGenerator2.default)(/*#__PURE__*/_regenerator().m(function _callee() {
-    var _locale$ProDrawerForm, _locale$ProDrawerForm2, _locale$ProDrawerForm3, _locale$ProDrawerForm4;
-    return _regenerator().w(function (_context) {
-      while (1) switch (_context.n) {
-        case 0:
-          // 如果当前是查看状态，或者不需要确认关闭，或者快照对比一致，则直接关闭
-          if (isView || !isConfirmClose || compareSnapshots()) {
-            onCancel && onCancel();
-          } else if (!modalRef.current) {
-            modalRef.current = _antd.Modal.confirm((0, _objectSpread2.default)({
-              className: 'width430',
-              title: _locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProDrawerForm = _locale.default.ProDrawerForm) === null || _locale$ProDrawerForm === void 0 ? void 0 : _locale$ProDrawerForm.isSureClose,
-              okText: _locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProDrawerForm2 = _locale.default.ProDrawerForm) === null || _locale$ProDrawerForm2 === void 0 ? void 0 : _locale$ProDrawerForm2.confirm,
-              cancelText: _locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProDrawerForm3 = _locale.default.ProDrawerForm) === null || _locale$ProDrawerForm3 === void 0 ? void 0 : _locale$ProDrawerForm3.cancel,
-              content: _locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProDrawerForm4 = _locale.default.ProDrawerForm) === null || _locale$ProDrawerForm4 === void 0 ? void 0 : _locale$ProDrawerForm4.secondTipsWhenSave,
-              onOk: function onOk() {
-                onCancel && onCancel();
-              },
-              onCancel: function onCancel() {
-                modalRef.current = null;
-              }
-            }, isConfirmCloseModalProps));
-          }
-        case 1:
-          return _context.a(2);
-      }
-    }, _callee);
-  })), [onCancel, modalRef.current, ref.current]);
-  var handleFinish = (0, _react.useCallback)(/*#__PURE__*/(0, _asyncToGenerator2.default)(/*#__PURE__*/_regenerator().m(function _callee2() {
-    var values, _t, _t2, _t3, _t4, _t5;
-    return _regenerator().w(function (_context2) {
-      while (1) switch (_context2.p = _context2.n) {
-        case 0:
-          _context2.p = 0;
-          if (!open) {
-            _context2.n = 8;
-            break;
-          }
-          _context2.n = 1;
-          return form.validateFields();
-        case 1:
-          values = _context2.v;
-          if (!(okLoading !== undefined)) {
-            _context2.n = 5;
-            break;
-          }
-          _t = onOk;
-          if (!_t) {
-            _context2.n = 3;
-            break;
-          }
-          _context2.n = 2;
-          return onOk(values, form);
-        case 2:
-          _t2 = _context2.v;
-          _t = _t2 === true;
-        case 3:
-          if (!_t) {
-            _context2.n = 4;
-            break;
-          }
+  const onConfirm = (0, import_react.useCallback)(async () => {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    if (isView || !isConfirmClose || compareSnapshots()) {
+      onCancel && onCancel();
+    } else if (!modalRef.current) {
+      modalRef.current = import_antd.Modal.confirm({
+        className: "width430",
+        title: (_b = (_a = import_locale.default) == null ? void 0 : _a.ProDrawerForm) == null ? void 0 : _b.isSureClose,
+        okText: (_d = (_c = import_locale.default) == null ? void 0 : _c.ProDrawerForm) == null ? void 0 : _d.confirm,
+        cancelText: (_f = (_e = import_locale.default) == null ? void 0 : _e.ProDrawerForm) == null ? void 0 : _f.cancel,
+        content: (_h = (_g = import_locale.default) == null ? void 0 : _g.ProDrawerForm) == null ? void 0 : _h.secondTipsWhenSave,
+        onOk: () => {
           onCancel && onCancel();
-        case 4:
-          return _context2.a(2, true);
-        case 5:
-          toggleLoading(true);
-          _t3 = onOk;
-          if (!_t3) {
-            _context2.n = 7;
-            break;
-          }
-          _context2.n = 6;
-          return onOk(values, form);
-        case 6:
-          _t4 = _context2.v;
-          _t3 = _t4 === true;
-        case 7:
-          if (!_t3) {
-            _context2.n = 8;
-            break;
+        },
+        onCancel: () => {
+          modalRef.current = null;
+        },
+        ...isConfirmCloseModalProps
+      });
+    }
+  }, [onCancel, modalRef.current, ref.current]);
+  const handleFinish = (0, import_react.useCallback)(async () => {
+    try {
+      if (open) {
+        const values = await form.validateFields();
+        if (okLoading !== void 0) {
+          if (onOk && await onOk(values, form) === true) {
+            onCancel && onCancel();
           }
+          return true;
+        }
+        toggleLoading(true);
+        if (onOk && await onOk(values, form) === true) {
           onCancel && onCancel();
-        case 8:
-          _context2.n = 10;
-          break;
-        case 9:
-          _context2.p = 9;
-          _t5 = _context2.v;
-          /** 使用setTimeout确保DOM已经更新，错误标记已经渲染 */
-          setTimeout(function () {
-            var _ref$current, _error$errorFields;
-            var errorElement = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.querySelector('[class*="form-item-has-error"]');
-            if (errorElement && (_t5 === null || _t5 === void 0 ? void 0 : (_error$errorFields = _t5.errorFields) === null || _error$errorFields === void 0 ? void 0 : _error$errorFields.length)) {
-              errorElement.scrollIntoView({
-                behavior: 'smooth',
-                block: 'center'
-              });
-            }
-          }, 100);
-        case 10:
-          _context2.p = 10;
-          toggleLoading(false);
-          return _context2.f(10);
-        case 11:
-          return _context2.a(2);
+        }
       }
-    }, _callee2, null, [[0, 9, 10, 11]]);
-  })), [onOk, onCancel, form]);
-  /**
-   * 描述：默认底部操作按钮
-   *
-   */
-  var defaultFooter = (0, _jsxRuntime.jsxs)("div", {
-    className: "pro-drawer-footer",
-    children: [(0, _jsxRuntime.jsx)(_antd.Button, {
+    } catch (error) {
+      setTimeout(() => {
+        var _a, _b;
+        const errorElement = (_a = ref.current) == null ? void 0 : _a.querySelector('[class*="form-item-has-error"]');
+        if (errorElement && ((_b = error == null ? void 0 : error.errorFields) == null ? void 0 : _b.length)) {
+          errorElement.scrollIntoView({ behavior: "smooth", block: "center" });
+        }
+      }, 100);
+    } finally {
+      toggleLoading(false);
+    }
+  }, [onOk, onCancel, form]);
+  const defaultFooter = /* @__PURE__ */ import_react.default.createElement("div", { className: "pro-drawer-footer" }, /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Button,
+    {
       type: "primary",
       onClick: handleFinish,
-      loading: okLoading !== null && okLoading !== void 0 ? okLoading : loading,
-      disabled: okDisabled !== null && okDisabled !== void 0 ? okDisabled : loading,
-      children: okText
-    }), (0, _jsxRuntime.jsx)(_antd.Button, {
-      onClick: onCancel,
-      children: cancelText
-    })]
-  });
-  var renderFooter = function renderFooter() {
+      loading: okLoading ?? loading,
+      disabled: okDisabled ?? loading
+    },
+    okText
+  ), /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: onCancel }, cancelText));
+  const renderFooter = () => {
     if (noRenderFooter) {
       return null;
     }
-    if (/*#__PURE__*/_react.default.isValidElement(footer)) {
-      return (0, _jsxRuntime.jsx)("div", {
-        className: "pro-drawer-footer",
-        children: footer
-      });
+    if (import_react.default.isValidElement(footer)) {
+      return /* @__PURE__ */ import_react.default.createElement("div", { className: "pro-drawer-footer" }, footer);
     }
-    if ((0, _isArray2.default)(footer) && (footer === null || footer === void 0 ? void 0 : footer.length)) {
-      return (0, _jsxRuntime.jsx)("div", {
-        className: "pro-drawer-footer",
-        children: footer.map(function (item) {
-          if (/*#__PURE__*/_react.default.isValidElement(item)) {
-            return item;
-          }
-          return false;
-        })
-      });
+    if ((0, import_lodash.isArray)(footer) && (footer == null ? void 0 : footer.length)) {
+      return /* @__PURE__ */ import_react.default.createElement("div", { className: "pro-drawer-footer" }, footer.map((item) => {
+        if (import_react.default.isValidElement(item)) {
+          return item;
+        }
+        return false;
+      }));
     }
     return defaultFooter;
   };
-  return (0, _jsxRuntime.jsxs)(_antd.Drawer, (0, _objectSpread2.default)((0, _objectSpread2.default)({
-    width: width,
-    open: open,
-    maskClosable: maskClosable,
-    placement: "right",
-    rootClassName: (0, _classnames.default)(className, 'pro-drawer'),
-    closable: false,
-    onClose: onCancel,
-    zIndex: zIndex
-  }, drawerProps), {}, {
-    children: [(0, _jsxRuntime.jsx)("div", {
-      className: "pro-drawer-close",
-      onClick: onConfirm,
-      children: (0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, {
-        className: "close-icon",
-        src: _close.default
-      })
-    }), title ? (0, _jsxRuntime.jsx)("div", {
-      className: "pro-drawer-title ".concat(top > 0 ? 'pro-drawer-scrolling' : ''),
-      children: title
-    }) : null, (0, _jsxRuntime.jsx)("div", {
-      ref: ref,
-      className: "pro-drawer-content",
-      style: {
-        marginTop: title ? 64 : 0,
-        paddingBottom: noRenderFooter ? 0 : 64,
-        height: "calc(100% - ".concat(title ? 64 : 0, "px)")
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Drawer,
+    {
+      width,
+      open,
+      maskClosable,
+      placement: "right",
+      rootClassName: (0, import_classnames.default)(className, "pro-drawer"),
+      closable: false,
+      onClose: onCancel,
+      zIndex,
+      ...drawerProps
+    },
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "pro-drawer-close", onClick: onConfirm }, /* @__PURE__ */ import_react.default.createElement(import_react_svg.ReactSVG, { className: "close-icon", src: import_close.default })),
+    title ? /* @__PURE__ */ import_react.default.createElement("div", { className: `pro-drawer-title ${top > 0 ? "pro-drawer-scrolling" : ""}` }, title) : null,
+    /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        ref,
+        className: "pro-drawer-content",
+        style: {
+          marginTop: title ? 64 : 0,
+          paddingBottom: noRenderFooter ? 0 : 64,
+          height: `calc(100% - ${title ? 64 : 0}px)`
+        }
       },
-      children: children
-    }), renderFooter()]
-  }));
+      children
+    ),
+    renderFooter()
+  );
 };
-var _default = exports.default = ProDrawer;
+var ProDrawer_default = ProDrawer;