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

package/lib/ProStepTab/index.js

@@ -1,351 +1,232 @@
-"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;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
+// src/ProStepTab/index.ts
+var ProStepTab_exports = {};
+__export(ProStepTab_exports, {
+  default: () => ProStepTab_default,
+  useStepTab: () => useStepTab,
+  useStepTabInstance: () => useStepTabInstance
 });
-exports.default = void 0;
-exports.useStepTab = useStepTab;
-exports.useStepTabInstance = useStepTabInstance;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _objectSpread3 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _isNaN2 = _interopRequireDefault(require("lodash/isNaN"));
-var _react = _interopRequireWildcard(require("react"));
-var _excluded = ["children"];
-// 存储当前的 StepTab 实例
-var StepTabInstanceContext = /*#__PURE__*/(0, _react.createContext)(null);
-/**
- * 使用原生 JS 获取 URL 搜索参数
- * @returns 当前 URL 的搜索参数和路径
- */
-var useNativeLocation = function useNativeLocation() {
-  var _useState = (0, _react.useState)({
-      search: window.location.search,
-      pathname: window.location.pathname
-    }),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    location = _useState2[0],
-    setLocation = _useState2[1];
-  // 监听 popstate 事件，更新 location 状态
-  (0, _react.useEffect)(function () {
-    var handleLocationChange = function handleLocationChange() {
+module.exports = __toCommonJS(ProStepTab_exports);
+var import_react = __toESM(require("react"));
+var import_lodash = require("lodash");
+var StepTabInstanceContext = (0, import_react.createContext)(null);
+var useNativeLocation = () => {
+  const [location, setLocation] = (0, import_react.useState)({
+    search: window.location.search,
+    pathname: window.location.pathname
+  });
+  (0, import_react.useEffect)(() => {
+    const handleLocationChange = () => {
       setLocation({
         search: window.location.search,
         pathname: window.location.pathname
       });
     };
-    window.addEventListener('popstate', handleLocationChange);
-    return function () {
-      window.removeEventListener('popstate', handleLocationChange);
+    window.addEventListener("popstate", handleLocationChange);
+    return () => {
+      window.removeEventListener("popstate", handleLocationChange);
     };
   }, []);
   return location;
 };
-/**
- * 步骤化Tab管理钩子，用于管理多步骤表单或流程的切换和验证
- *
- * @param {ProStepTabType} props 配置参数
- * @returns {ProStepTabResultType} 返回步骤Tab相关方法和状态
- */
-function useStepTab() {
-  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  var _props$routerKeep = props.routerKeep,
-    routerKeep = _props$routerKeep === void 0 ? false : _props$routerKeep,
-    _props$routerSearchKe = props.routerSearchKey,
-    routerSearchKey = _props$routerSearchKe === void 0 ? 'tab' : _props$routerSearchKe,
-    _props$validate = props.validate,
-    validate = _props$validate === void 0 ? true : _props$validate,
-    onBeforeChange = props.onBeforeChange,
-    onAfterChange = props.onAfterChange,
-    defaultActiveKey = props.defaultActiveKey,
-    _props$defaultStep = props.defaultStep,
-    defaultStep = _props$defaultStep === void 0 ? 1 : _props$defaultStep,
-    queueSteps = props.queueSteps,
-    _props$autoNext = props.autoNext,
-    autoNext = _props$autoNext === void 0 ? false : _props$autoNext;
-  // 内部状态，避免全局污染
-  var _useState3 = (0, _react.useState)({}),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    handlesState = _useState4[0],
-    setHandlesState = _useState4[1];
-  var location = useNativeLocation();
-  // 获取初始激活的tab key
-  var getInitialActiveKey = (0, _react.useCallback)(function () {
+function useStepTab(props = {}) {
+  const {
+    routerKeep = false,
+    routerSearchKey = "tab",
+    validate = true,
+    onBeforeChange,
+    onAfterChange,
+    defaultActiveKey,
+    defaultStep = 1,
+    queueSteps,
+    autoNext = false
+  } = props;
+  const [handlesState, setHandlesState] = (0, import_react.useState)({});
+  const location = useNativeLocation();
+  const getInitialActiveKey = (0, import_react.useCallback)(() => {
     if (routerKeep) {
-      var urlSearchParams = new URLSearchParams(location.search);
-      var tabValue = urlSearchParams.get(routerSearchKey);
+      const urlSearchParams = new URLSearchParams(location.search);
+      const tabValue = urlSearchParams.get(routerSearchKey);
       if (tabValue) {
         return tabValue;
       }
     }
-    return defaultActiveKey || '1';
+    return defaultActiveKey || "1";
   }, [routerKeep, routerSearchKey, location.search, defaultActiveKey]);
-  // 获取初始激活的步骤
-  var getInitialStep = (0, _react.useCallback)(function () {
+  const getInitialStep = (0, import_react.useCallback)(() => {
     if (routerKeep) {
-      var urlSearchParams = new URLSearchParams(location.search);
-      var stepValue = urlSearchParams.get(routerSearchKey);
-      // 如果stepValue是数字，则返回数字
-      if (stepValue && !(0, _isNaN2.default)(Number(stepValue))) {
+      const urlSearchParams = new URLSearchParams(location.search);
+      const stepValue = urlSearchParams.get(routerSearchKey);
+      if (stepValue && !(0, import_lodash.isNaN)(Number(stepValue))) {
         return Number(stepValue);
       }
     }
     return defaultStep;
   }, [routerKeep, routerSearchKey, location.search, defaultStep]);
-  var _useState5 = (0, _react.useState)(getInitialActiveKey()),
-    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-    activeKey = _useState6[0],
-    setActiveKeyState = _useState6[1];
-  var _useState7 = (0, _react.useState)(getInitialStep()),
-    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-    step = _useState8[0],
-    setStepState = _useState8[1]; // 当前已激活步骤
-  var _useState9 = (0, _react.useState)(false),
-    _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-    loading = _useState10[0],
-    setLoading = _useState10[1];
-  // 同步URL参数
-  (0, _react.useEffect)(function () {
+  const [activeKey, setActiveKeyState] = (0, import_react.useState)(getInitialActiveKey());
+  const [step, setStepState] = (0, import_react.useState)(getInitialStep());
+  const [loading, setLoading] = (0, import_react.useState)(false);
+  (0, import_react.useEffect)(() => {
     if (routerKeep && activeKey) {
-      // 更新URL参数
-      var urlSearchParams = new URLSearchParams(location.search);
+      const urlSearchParams = new URLSearchParams(location.search);
       urlSearchParams.set(routerSearchKey, activeKey);
-      // 使用原生 history API 更新 URL
-      var newUrl = "".concat(location.pathname, "?").concat(urlSearchParams.toString());
-      window.history.replaceState(null, '', newUrl);
+      const newUrl = `${location.pathname}?${urlSearchParams.toString()}`;
+      window.history.replaceState(null, "", newUrl);
     }
   }, [activeKey, routerKeep, routerSearchKey, location]);
-  // 创建一个包装函数，自动处理loading状态
-  var wrapHandleWithLoading = (0, _react.useCallback)(function (fn) {
-    return /*#__PURE__*/(0, _asyncToGenerator2.default)(/*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee() {
-      var result;
-      return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            setLoading(true);
-            _context.prev = 1;
-            _context.next = 4;
-            return fn();
-          case 4:
-            result = _context.sent;
-            setLoading(false);
-            return _context.abrupt("return", result);
-          case 9:
-            _context.prev = 9;
-            _context.t0 = _context["catch"](1);
-            setLoading(false);
-            return _context.abrupt("return", false);
-          case 13:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee, null, [[1, 9]]);
-    }));
+  const wrapHandleWithLoading = (0, import_react.useCallback)((fn) => {
+    return async () => {
+      setLoading(true);
+      try {
+        const result = await fn();
+        setLoading(false);
+        return result;
+      } catch (error) {
+        setLoading(false);
+        return false;
+      }
+    };
   }, []);
-  // 注册步骤处理函数
-  var registerHandle = (0, _react.useCallback)(function (key, handler) {
-    // 使用wrapHandleWithLoading包装处理函数
-    setHandlesState(function (prev) {
-      return (0, _objectSpread3.default)((0, _objectSpread3.default)({}, prev), {}, (0, _defineProperty2.default)({}, key, wrapHandleWithLoading(handler)));
-    });
+  const registerHandle = (0, import_react.useCallback)((key, handler) => {
+    setHandlesState((prev) => ({
+      ...prev,
+      [key]: wrapHandleWithLoading(handler)
+    }));
   }, [wrapHandleWithLoading]);
-  // 获取步骤处理函数
-  var getHandle = (0, _react.useCallback)(function (key) {
+  const getHandle = (0, import_react.useCallback)((key) => {
     return handlesState[key];
   }, [handlesState]);
-  // 处理表单验证和切换（内部使用）
-  var validateAndChange = (0, _react.useCallback)(/*#__PURE__*/function () {
-    var _ref2 = (0, _asyncToGenerator2.default)(/*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2(targetKey) {
-      var currentHandler, handleResult, beforeResult;
-      return (0, _regeneratorRuntime2.default)().wrap(function _callee2$(_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
-          case 0:
-            if (!(targetKey === activeKey)) {
-              _context2.next = 2;
-              break;
-            }
-            return _context2.abrupt("return", true);
-          case 2:
-            _context2.prev = 2;
-            // 执行当前步骤的保存处理, 如果validate为true，则执行验证
-            currentHandler = handlesState[activeKey];
-            if (!(currentHandler && validate)) {
-              _context2.next = 10;
-              break;
-            }
-            _context2.next = 7;
-            return currentHandler();
-          case 7:
-            handleResult = _context2.sent;
-            if (handleResult) {
-              _context2.next = 10;
-              break;
-            }
-            return _context2.abrupt("return", false);
-          case 10:
-            if (!onBeforeChange) {
-              _context2.next = 16;
-              break;
-            }
-            _context2.next = 13;
-            return onBeforeChange(activeKey, targetKey);
-          case 13:
-            beforeResult = _context2.sent;
-            if (!(beforeResult === false)) {
-              _context2.next = 16;
-              break;
-            }
-            return _context2.abrupt("return", false);
-          case 16:
-            // 更新激活的key
-            setActiveKeyState(targetKey);
-            // 执行切换后回调
-            if (onAfterChange) {
-              onAfterChange(targetKey);
-            }
-            return _context2.abrupt("return", true);
-          case 21:
-            _context2.prev = 21;
-            _context2.t0 = _context2["catch"](2);
-            // 验证失败
-            console.error('Tab切换验证失败:', _context2.t0);
-            return _context2.abrupt("return", false);
-          case 25:
-          case "end":
-            return _context2.stop();
-        }
-      }, _callee2, null, [[2, 21]]);
-    }));
-    return function (_x) {
-      return _ref2.apply(this, arguments);
-    };
-  }(), [activeKey, validate, onBeforeChange, onAfterChange, handlesState]);
-  // 设置激活的key
-  var setCheckActiveKey = (0, _react.useCallback)(/*#__PURE__*/function () {
-    var _ref3 = (0, _asyncToGenerator2.default)(/*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee3(targetKey, validate) {
-      return (0, _regeneratorRuntime2.default)().wrap(function _callee3$(_context3) {
-        while (1) switch (_context3.prev = _context3.next) {
-          case 0:
-            if (!(validate === false)) {
-              _context3.next = 3;
-              break;
-            }
-            setActiveKeyState(targetKey);
-            return _context3.abrupt("return", true);
-          case 3:
-            return _context3.abrupt("return", validateAndChange(targetKey));
-          case 4:
-          case "end":
-            return _context3.stop();
-        }
-      }, _callee3);
-    }));
-    return function (_x2, _x3) {
-      return _ref3.apply(this, arguments);
-    };
-  }(), [validateAndChange]);
-  // 执行当前步骤处理函数
-  var saveHandle = (0, _react.useCallback)(/*#__PURE__*/(0, _asyncToGenerator2.default)(/*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee4() {
-    var handler, result, currentKeyNum, nextKey;
-    return (0, _regeneratorRuntime2.default)().wrap(function _callee4$(_context4) {
-      while (1) switch (_context4.prev = _context4.next) {
-        case 0:
-          handler = handlesState[activeKey];
-          if (!handler) {
-            _context4.next = 15;
-            break;
-          }
-          _context4.next = 4;
-          return handler();
-        case 4:
-          result = _context4.sent;
-          if (!(result && autoNext)) {
-            _context4.next = 12;
-            break;
+  const validateAndChange = (0, import_react.useCallback)(
+    async (targetKey) => {
+      if (targetKey === activeKey)
+        return true;
+      try {
+        const currentHandler = handlesState[activeKey];
+        if (currentHandler && validate) {
+          const handleResult = await currentHandler();
+          if (!handleResult) {
+            return false;
           }
-          // 只有当activeKey能转换为数字时才执行自动跳转
-          currentKeyNum = Number(activeKey);
-          if ((0, _isNaN2.default)(currentKeyNum)) {
-            _context4.next = 12;
-            break;
+        }
+        if (onBeforeChange) {
+          const beforeResult = await onBeforeChange(activeKey, targetKey);
+          if (beforeResult === false) {
+            return false;
           }
-          nextKey = String(currentKeyNum + 1);
+        }
+        setActiveKeyState(targetKey);
+        if (onAfterChange) {
+          onAfterChange(targetKey);
+        }
+        return true;
+      } catch (error) {
+        console.error("Tab切换验证失败:", error);
+        return false;
+      }
+    },
+    [activeKey, validate, onBeforeChange, onAfterChange, handlesState]
+  );
+  const setCheckActiveKey = (0, import_react.useCallback)(
+    async (targetKey, validate2) => {
+      if (validate2 === false) {
+        setActiveKeyState(targetKey);
+        return true;
+      }
+      return validateAndChange(targetKey);
+    },
+    [validateAndChange]
+  );
+  const saveHandle = (0, import_react.useCallback)(async () => {
+    const handler = handlesState[activeKey];
+    if (handler) {
+      const result = await handler();
+      if (result && autoNext) {
+        const currentKeyNum = Number(activeKey);
+        if (!(0, import_lodash.isNaN)(currentKeyNum)) {
+          let nextKey = String(currentKeyNum + 1);
           if (Number(nextKey) > queueSteps) {
             nextKey = String(queueSteps);
           }
-          // 自动跳转到下一个tab
-          _context4.next = 12;
-          return setCheckActiveKey(nextKey, false);
-        case 12:
-          if (!(result === false)) {
-            _context4.next = 14;
-            break;
-          }
-          return _context4.abrupt("return", Promise.reject());
-        case 14:
-          return _context4.abrupt("return", result);
-        case 15:
-          return _context4.abrupt("return", Promise.resolve(true));
-        case 16:
-        case "end":
-          return _context4.stop();
+          await setCheckActiveKey(nextKey, false);
+        }
       }
-    }, _callee4);
-  })), [activeKey, handlesState, autoNext, queueSteps, setCheckActiveKey]);
-  // 拦截setStep, 最大值是queueSteps
-  var setStep = (0, _react.useCallback)(function (step) {
-    if (step > queueSteps) {
+      if (result === false) {
+        return Promise.reject();
+      }
+      return result;
+    }
+    return Promise.resolve(true);
+  }, [activeKey, handlesState, autoNext, queueSteps, setCheckActiveKey]);
+  const setStep = (0, import_react.useCallback)((step2) => {
+    if (step2 > queueSteps) {
       return;
     }
-    setStepState(step);
+    setStepState(step2);
   }, [queueSteps]);
-  // 重置handles，用于清空或组件卸载时调用
-  var resetHandles = (0, _react.useCallback)(function () {
+  const resetHandles = (0, import_react.useCallback)(() => {
     setHandlesState({});
   }, []);
-  var stepTabInstance = {
-    activeKey: activeKey,
-    setCheckActiveKey: setCheckActiveKey,
-    loading: loading,
-    registerHandle: registerHandle,
-    getHandle: getHandle,
-    saveHandle: saveHandle,
-    resetHandles: resetHandles,
+  const stepTabInstance = {
+    activeKey,
+    setCheckActiveKey,
+    loading,
+    registerHandle,
+    getHandle,
+    saveHandle,
+    resetHandles,
     handles: handlesState,
-    step: step,
-    setStep: setStep,
-    queueSteps: queueSteps
+    step,
+    setStep,
+    queueSteps
   };
   return stepTabInstance;
 }
-/**
- * 在子组件中获取父级 StepTab 实例的钩子
- * @returns {ProStepTabResultType} 步骤Tab实例
- */
 function useStepTabInstance() {
-  var context = (0, _react.useContext)(StepTabInstanceContext);
+  const context = (0, import_react.useContext)(StepTabInstanceContext);
   if (context === null) {
-    throw new Error('useStepTabInstance must be used inside a ProStepTab component');
+    throw new Error("useStepTabInstance must be used inside a ProStepTab component");
   }
   return context;
 }
-/**
- * ProStepTab 组件
- */
-var ProStepTab = function ProStepTab(_ref5) {
-  var children = _ref5.children,
-    rest = (0, _objectWithoutProperties2.default)(_ref5, _excluded);
-  var stepTabInstance = useStepTab(rest);
-  return /*#__PURE__*/_react.default.createElement(StepTabInstanceContext.Provider, {
-    value: stepTabInstance
-  }, children);
+var ProStepTab = ({ children, ...rest }) => {
+  const stepTabInstance = useStepTab(rest);
+  return import_react.default.createElement(
+    StepTabInstanceContext.Provider,
+    { value: stepTabInstance },
+    children
+  );
 };
-// 将 useStepTabInstance 挂载到 ProStepTab 上作为静态方法
 ProStepTab.useStepTabInstance = useStepTabInstance;
-// 导出默认组件
-var _default = exports.default = ProStepTab;
+var ProStepTab_default = ProStepTab;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useStepTab,
+  useStepTabInstance
+});

package/lib/ProStepTab/propsType.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/ProStepTab/propsType.ts
+var propsType_exports = {};
+module.exports = __toCommonJS(propsType_exports);