@pisell/materials 1.0.983 → 1.0.988

package/lib/components/PisellProcedure/components/FooterActions.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+/**
+ * FooterActions 底部操作区组件 Props
+ */
+export interface FooterActionsProps {
+    /** 左侧插槽（自定义内容） */
+    leftSlot?: React.ReactNode;
+    /** 操作按钮插槽（右侧按钮组） */
+    children?: React.ReactNode;
+    /** 自定义类名 */
+    className?: string;
+    /** More 按钮文案 */
+    moreText?: string;
+    /** 按钮间距 */
+    gap?: number;
+}
+/**
+ * FooterActions 底部操作区组件
+ * @description 实现底部操作区的左右布局：左侧自定义内容 + 右侧操作按钮（支持溢出收纳）
+ * 收纳规则：从左到右依次收纳（优先级低的先收纳），保留右侧的主要操作按钮
+ * @author Pisell Team
+ */
+declare const FooterActions: React.FC<FooterActionsProps>;
+export default FooterActions;

package/lib/components/PisellProcedure/components/FooterActions.js

@@ -0,0 +1,96 @@
+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);
+
+// src/components/PisellProcedure/components/FooterActions.tsx
+var FooterActions_exports = {};
+__export(FooterActions_exports, {
+  default: () => FooterActions_default
+});
+module.exports = __toCommonJS(FooterActions_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_UpOutlined = __toESM(require("@ant-design/icons/UpOutlined"));
+var import_useOverflowActions = require("../hooks/useOverflowActions");
+var import_utils = require("../utils");
+var FooterActions = ({
+  leftSlot,
+  children,
+  className,
+  moreText = "More",
+  gap = 16
+}) => {
+  const {
+    containerRef,
+    measureRef,
+    moreButtonRef,
+    leftSlotRef,
+    actionItems,
+    visibleActions,
+    hasOverflow,
+    moreMenuItems
+  } = (0, import_useOverflowActions.useOverflowActions)({ children, gap, moreText });
+  const containerCls = (0, import_utils.mergeClassNames)(
+    "pisell-procedure-footer__content",
+    className
+  );
+  const hasLeftSlot = leftSlot !== void 0 && leftSlot !== null;
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      ref: measureRef,
+      style: {
+        position: "absolute",
+        visibility: "hidden",
+        pointerEvents: "none",
+        display: "flex",
+        gap,
+        whiteSpace: "nowrap",
+        left: -9999,
+        top: -9999
+      },
+      "aria-hidden": "true"
+    },
+    actionItems.map((item, index) => /* @__PURE__ */ import_react.default.createElement("div", { key: index, "data-measure-item": true, style: { flexShrink: 0 } }, item))
+  ), /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      ref: moreButtonRef,
+      style: {
+        position: "absolute",
+        visibility: "hidden",
+        pointerEvents: "none",
+        left: -9999,
+        top: -9999
+      },
+      "aria-hidden": "true"
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { icon: /* @__PURE__ */ import_react.default.createElement(import_UpOutlined.default, null) }, moreText)
+  ), /* @__PURE__ */ import_react.default.createElement("div", { ref: containerRef, className: containerCls, style: { gap } }, hasLeftSlot && /* @__PURE__ */ import_react.default.createElement("div", { ref: leftSlotRef, className: "pisell-procedure-footer__left" }, leftSlot), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-procedure-footer__actions", style: { gap } }, hasOverflow && /* @__PURE__ */ import_react.default.createElement(import_antd.Dropdown, { menu: { items: moreMenuItems } }, /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { icon: /* @__PURE__ */ import_react.default.createElement(import_UpOutlined.default, null) }, moreText)), visibleActions)));
+};
+FooterActions.displayName = "FooterActions";
+var FooterActions_default = FooterActions;

package/lib/components/PisellProcedure/components/ProcedureBody.d.ts

@@ -0,0 +1,39 @@
+import React from 'react';
+import type { ProcedureBodyProps as BodyProps, ProcedureFooterProps, FooterPositionMode, ProcedureMode } from '../types';
+/**
+ * ProcedureBody 子组件 Props
+ */
+export interface ProcedureBodyProps {
+    /** 主体配置 */
+    bodyProps?: BodyProps;
+    /** 底部配置 */
+    footerProps?: ProcedureFooterProps;
+    /** 底部位置模式 */
+    footerPosition: FooterPositionMode;
+    /** 是否显示底部 */
+    showFooter?: boolean;
+    /** 是否显示信息区 */
+    showSidebar?: boolean;
+    /** 自定义类名 */
+    className?: string;
+    /** 移动端弹窗是否打开 */
+    summaryModalOpen?: boolean;
+    /** 打开移动端弹窗 */
+    onOpenSummaryModal?: () => void;
+    /** 关闭移动端弹窗 */
+    onCloseSummaryModal?: () => void;
+    /** 上一步回调 */
+    goPrev?: () => void;
+    /** 下一步回调 */
+    goNext?: () => void;
+    /** 组件使用模式 */
+    mode?: ProcedureMode;
+}
+/**
+ * ProcedureBody 主体区域组件
+ *
+ * @description 包含内容区和信息区的布局容器，支持固定宽度和比例两种布局模式
+ * @author Pisell Team
+ */
+declare const ProcedureBody: React.FC<ProcedureBodyProps>;
+export default ProcedureBody;

package/lib/components/PisellProcedure/components/ProcedureBody.js

@@ -0,0 +1,157 @@
+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);
+
+// src/components/PisellProcedure/components/ProcedureBody.tsx
+var ProcedureBody_exports = {};
+__export(ProcedureBody_exports, {
+  default: () => ProcedureBody_default
+});
+module.exports = __toCommonJS(ProcedureBody_exports);
+var import_react = __toESM(require("react"));
+var import_pisellLayout = __toESM(require("../../pisellLayout"));
+var import_ProcedureContent = __toESM(require("./ProcedureContent"));
+var import_ProcedureSidebar = __toESM(require("./ProcedureSidebar"));
+var import_ProcedureFooter = __toESM(require("./ProcedureFooter"));
+var import_utils = require("../utils");
+var ProcedureBody = ({
+  bodyProps,
+  footerProps,
+  footerPosition,
+  showFooter = true,
+  showSidebar = true,
+  className,
+  summaryModalOpen,
+  onOpenSummaryModal,
+  onCloseSummaryModal,
+  goPrev,
+  goNext,
+  mode = "page"
+}) => {
+  const direction = (bodyProps == null ? void 0 : bodyProps.direction) || "horizontal";
+  const contentOrder = (bodyProps == null ? void 0 : bodyProps.contentOrder) || "content-first";
+  const layoutMode = (bodyProps == null ? void 0 : bodyProps.layoutMode) || "fixed";
+  const layoutRatio = (bodyProps == null ? void 0 : bodyProps.layoutRatio) || "7:3";
+  const bodyCls = (0, import_react.useMemo)(() => {
+    return (0, import_utils.mergeClassNames)(
+      "pisell-procedure-body",
+      className,
+      bodyProps == null ? void 0 : bodyProps.className,
+      // 添加排列方向类名
+      `pisell-procedure-body--${direction}`,
+      // 添加布局模式类名
+      `pisell-procedure-body--${layoutMode}`,
+      // 添加内容顺序类名
+      `pisell-procedure-body--${contentOrder}`
+    );
+  }, [className, bodyProps == null ? void 0 : bodyProps.className, direction, layoutMode, contentOrder]);
+  const ratioStyles = (0, import_react.useMemo)(() => {
+    if (layoutMode !== "ratio") return null;
+    return (0, import_utils.generateRatioStyles)(layoutRatio, 16);
+  }, [layoutMode, layoutRatio]);
+  const contentStyle = (0, import_react.useMemo)(() => {
+    if (layoutMode === "ratio" && ratioStyles) {
+      return { ...ratioStyles.contentStyle, ...bodyProps == null ? void 0 : bodyProps.contentStyle };
+    }
+    return bodyProps == null ? void 0 : bodyProps.contentStyle;
+  }, [layoutMode, ratioStyles, bodyProps == null ? void 0 : bodyProps.contentStyle]);
+  const sidebarStyle = (0, import_react.useMemo)(() => {
+    if (layoutMode === "ratio" && ratioStyles) {
+      return { ...ratioStyles.sidebarStyle, ...bodyProps == null ? void 0 : bodyProps.sidebarStyle };
+    }
+    return bodyProps == null ? void 0 : bodyProps.sidebarStyle;
+  }, [layoutMode, ratioStyles, bodyProps == null ? void 0 : bodyProps.sidebarStyle]);
+  const sidebarContent = bodyProps == null ? void 0 : bodyProps.sidebarSlot;
+  const contentFooter = (0, import_react.useMemo)(() => {
+    if (!showFooter || !(0, import_utils.isFooterInContent)(footerPosition)) return null;
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_ProcedureFooter.default,
+      {
+        footerProps,
+        position: footerPosition,
+        sidebarContent,
+        summaryModalOpen,
+        onOpenSummaryModal,
+        onCloseSummaryModal,
+        goPrev,
+        goNext,
+        mode
+      }
+    );
+  }, [showFooter, footerPosition, footerProps, sidebarContent, summaryModalOpen, onOpenSummaryModal, onCloseSummaryModal, goPrev, goNext, mode]);
+  const sidebarFooter = (0, import_react.useMemo)(() => {
+    if (!showFooter || !(0, import_utils.isFooterInSidebar)(footerPosition)) return null;
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_ProcedureFooter.default,
+      {
+        footerProps,
+        position: footerPosition,
+        sidebarContent,
+        summaryModalOpen,
+        onOpenSummaryModal,
+        onCloseSummaryModal,
+        goPrev,
+        goNext,
+        mode
+      }
+    );
+  }, [showFooter, footerPosition, footerProps, sidebarContent, summaryModalOpen, onOpenSummaryModal, onCloseSummaryModal, goPrev, goNext, mode]);
+  const layoutStyle = (0, import_react.useMemo)(() => ({
+    flexDirection: direction === "vertical" ? "column" : "row"
+  }), [direction]);
+  const contentComponent = /* @__PURE__ */ import_react.default.createElement(
+    import_ProcedureContent.default,
+    {
+      className: bodyProps == null ? void 0 : bodyProps.contentClassName,
+      style: contentStyle,
+      extra: contentFooter
+    },
+    bodyProps == null ? void 0 : bodyProps.contentSlot
+  );
+  const sidebarComponent = showSidebar ? /* @__PURE__ */ import_react.default.createElement(
+    import_ProcedureSidebar.default,
+    {
+      className: bodyProps == null ? void 0 : bodyProps.sidebarClassName,
+      style: sidebarStyle,
+      extra: sidebarFooter,
+      isRatioMode: layoutMode === "ratio",
+      containerSelector: bodyProps == null ? void 0 : bodyProps.sidebarContainerSelector,
+      mode,
+      direction
+    },
+    bodyProps == null ? void 0 : bodyProps.sidebarSlot
+  ) : null;
+  const orderedChildren = (0, import_react.useMemo)(() => {
+    if (contentOrder === "sidebar-first") {
+      return [sidebarComponent, contentComponent].filter(Boolean);
+    }
+    return [contentComponent, sidebarComponent].filter(Boolean);
+  }, [contentOrder, contentComponent, sidebarComponent]);
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: bodyCls, style: bodyProps == null ? void 0 : bodyProps.style }, /* @__PURE__ */ import_react.default.createElement(import_pisellLayout.default, { style: layoutStyle }, orderedChildren));
+};
+ProcedureBody.displayName = "ProcedureBody";
+var ProcedureBody_default = ProcedureBody;

package/lib/components/PisellProcedure/components/ProcedureContent.d.ts

@@ -1,8 +1,23 @@
 import React from 'react';
-import type { ProcedureContentProps } from '../types';
+import type { CSSProperties, ReactNode } from 'react';
 /**
- * ProcedureContent 组件
- * 内容区域，渲染当前步骤的内容
+ * ProcedureContent 子组件 Props
+ */
+export interface ProcedureContentProps {
+    /** 内容区类名 */
+    className?: string;
+    /** 内容区样式 */
+    style?: CSSProperties;
+    /** 内容区插槽 */
+    children?: ReactNode;
+    /** 额外内容（如底部操作区） */
+    extra?: ReactNode;
+}
+/**
+ * ProcedureContent 内容区组件
+ *
+ * @description 流程容器的主要内容展示区域
+ * @author Pisell Team
  */
 declare const ProcedureContent: React.FC<ProcedureContentProps>;
 export default ProcedureContent;

package/lib/components/PisellProcedure/components/ProcedureContent.js

@@ -33,28 +33,18 @@ __export(ProcedureContent_exports, {
 });
 module.exports = __toCommonJS(ProcedureContent_exports);
 var import_react = __toESM(require("react"));
-var import_antd = require("antd");
-var import_classnames = __toESM(require("classnames"));
+var import_content = __toESM(require("../../pisellLayout/content"));
+var import_utils = require("../utils");
 var ProcedureContent = ({
-  current,
-  contentRender,
-  width,
   className,
   style,
-  loading
+  children,
+  extra
 }) => {
-  const mergedClassName = (0, import_react.useMemo)(() => {
-    return (0, import_classnames.default)("pisell-procedure-content", className);
+  const contentCls = (0, import_react.useMemo)(() => {
+    return (0, import_utils.mergeClassNames)("pisell-procedure-content", className);
   }, [className]);
-  const mergedStyle = (0, import_react.useMemo)(() => {
-    const baseStyle = {
-      ...style
-    };
-    if (width) {
-      baseStyle.width = typeof width === "number" ? `${width}px` : width;
-    }
-    return baseStyle;
-  }, [style, width]);
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: mergedClassName, style: mergedStyle }, /* @__PURE__ */ import_react.default.createElement(import_antd.Spin, { spinning: loading }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-procedure-content-inner" }, contentRender(current))));
+  return /* @__PURE__ */ import_react.default.createElement(import_content.default, { className: contentCls, style }, children, extra);
 };
+ProcedureContent.displayName = "ProcedureContent";
 var ProcedureContent_default = ProcedureContent;

package/lib/components/PisellProcedure/components/ProcedureFooter.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+import type { ProcedureFooterProps as FooterProps, FooterPositionMode, ProcedureMode } from '../types';
+import type { ReactNode } from 'react';
+/**
+ * ProcedureFooter 子组件 Props
+ */
+export interface ProcedureFooterProps {
+    /** 底部配置 */
+    footerProps?: FooterProps;
+    /** 底部位置模式 */
+    position: FooterPositionMode;
+    /** 自定义类名 */
+    className?: string;
+    /** 是否作为全局底部（使用 PisellFooter 包裹） */
+    isGlobal?: boolean;
+    /** 信息区内容（用于移动端弹窗展示） */
+    sidebarContent?: ReactNode;
+    /** 移动端弹窗是否打开（受控） */
+    summaryModalOpen?: boolean;
+    /** 打开移动端弹窗 */
+    onOpenSummaryModal?: () => void;
+    /** 关闭移动端弹窗 */
+    onCloseSummaryModal?: () => void;
+    /** 上一步回调 */
+    goPrev?: () => void;
+    /** 下一步回调 */
+    goNext?: () => void;
+    /** 组件使用模式 */
+    mode?: ProcedureMode;
+}
+/**
+ * ProcedureFooter 底部操作区组件
+ *
+ * @description 包含左侧自定义内容和右侧操作按钮（支持溢出收纳功能）
+ * @author Pisell Team
+ */
+declare const ProcedureFooter: React.FC<ProcedureFooterProps>;
+export default ProcedureFooter;

package/lib/components/PisellProcedure/components/ProcedureFooter.js

@@ -0,0 +1,156 @@
+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);
+
+// src/components/PisellProcedure/components/ProcedureFooter.tsx
+var ProcedureFooter_exports = {};
+__export(ProcedureFooter_exports, {
+  default: () => ProcedureFooter_default
+});
+module.exports = __toCommonJS(ProcedureFooter_exports);
+var import_react = __toESM(require("react"));
+var import_footer = __toESM(require("../../pisellLayout/footer"));
+var import_pisellModal = __toESM(require("../../pisellModal"));
+var import_FooterActions = __toESM(require("./FooterActions"));
+var import_utils = require("../utils");
+var ProcedureFooter = ({
+  footerProps,
+  position,
+  className,
+  isGlobal = false,
+  sidebarContent,
+  summaryModalOpen = false,
+  onOpenSummaryModal,
+  onCloseSummaryModal,
+  goPrev,
+  goNext,
+  mode = "page"
+}) => {
+  const footerCls = (0, import_react.useMemo)(() => {
+    return (0, import_utils.mergeClassNames)(
+      "pisell-procedure-footer",
+      className,
+      footerProps == null ? void 0 : footerProps.className,
+      (0, import_utils.modifierClassName)("pisell-procedure-footer", position)
+    );
+  }, [className, footerProps == null ? void 0 : footerProps.className, position]);
+  const processedActions = (0, import_react.useMemo)(() => {
+    const actions = footerProps == null ? void 0 : footerProps.actions;
+    if (!actions) return null;
+    const childrenArray = import_react.Children.toArray(actions);
+    if (childrenArray.length === 0) return null;
+    return import_react.Children.map(actions, (child, index) => {
+      if (!(0, import_react.isValidElement)(child)) return child;
+      const childProps = child.props;
+      const dataAction = childProps == null ? void 0 : childProps["data-action"];
+      const originalOnClick = childProps == null ? void 0 : childProps.onClick;
+      let injectedAction;
+      if (dataAction === "prev") {
+        injectedAction = goPrev;
+      } else if (dataAction === "next") {
+        injectedAction = goNext;
+      }
+      if (injectedAction) {
+        return (0, import_react.cloneElement)(child, {
+          onClick: (...args) => {
+            originalOnClick == null ? void 0 : originalOnClick(...args);
+            injectedAction == null ? void 0 : injectedAction();
+          }
+        });
+      }
+      return child;
+    });
+  }, [footerProps == null ? void 0 : footerProps.actions, goPrev, goNext]);
+  const actionsContent = processedActions;
+  const wrappedSummaryButton = (0, import_react.useMemo)(() => {
+    var _a;
+    const button = footerProps == null ? void 0 : footerProps.summaryButton;
+    if (!button || !(0, import_react.isValidElement)(button)) return button;
+    const originalOnClick = (_a = button.props) == null ? void 0 : _a.onClick;
+    return (0, import_react.cloneElement)(button, {
+      onClick: (e) => {
+        if (typeof originalOnClick === "function") {
+          originalOnClick(e);
+        }
+        onOpenSummaryModal == null ? void 0 : onOpenSummaryModal();
+      }
+    });
+  }, [footerProps == null ? void 0 : footerProps.summaryButton, onOpenSummaryModal]);
+  const footerContent = (0, import_react.useMemo)(() => {
+    const hasSummaryButton = mode === "modal" ? false : !!wrappedSummaryButton;
+    const hasLeftSlot = (footerProps == null ? void 0 : footerProps.leftSlot) !== void 0 && (footerProps == null ? void 0 : footerProps.leftSlot) !== null;
+    const hasActions = actionsContent !== null && actionsContent !== void 0;
+    if (!hasSummaryButton && !hasLeftSlot && !hasActions) {
+      return null;
+    }
+    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, hasSummaryButton && wrappedSummaryButton && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-procedure-footer__summary" }, wrappedSummaryButton), (hasLeftSlot || hasActions) && ((footerProps == null ? void 0 : footerProps.enableOverflow) !== false ? /* @__PURE__ */ import_react.default.createElement(
+      import_FooterActions.default,
+      {
+        leftSlot: footerProps == null ? void 0 : footerProps.leftSlot,
+        moreText: footerProps == null ? void 0 : footerProps.moreText
+      },
+      actionsContent
+    ) : /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-procedure-footer__content" }, (footerProps == null ? void 0 : footerProps.leftSlot) && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-procedure-footer__left" }, footerProps.leftSlot), hasActions && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-procedure-footer__actions" }, actionsContent))));
+  }, [
+    mode,
+    wrappedSummaryButton,
+    footerProps == null ? void 0 : footerProps.enableOverflow,
+    footerProps == null ? void 0 : footerProps.leftSlot,
+    footerProps == null ? void 0 : footerProps.moreText,
+    actionsContent
+  ]);
+  const summaryModal = (0, import_react.useMemo)(() => {
+    if (!(footerProps == null ? void 0 : footerProps.summaryButton) || !sidebarContent) return null;
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_pisellModal.default,
+      {
+        open: summaryModalOpen,
+        onCancel: onCloseSummaryModal,
+        title: (footerProps == null ? void 0 : footerProps.summaryModalTitle) || "详情",
+        platform: "h5",
+        footer: null,
+        destroyOnClose: true
+      },
+      sidebarContent
+    );
+  }, [
+    footerProps == null ? void 0 : footerProps.summaryButton,
+    footerProps == null ? void 0 : footerProps.summaryModalTitle,
+    sidebarContent,
+    summaryModalOpen,
+    onCloseSummaryModal
+  ]);
+  if (!footerContent) {
+    return null;
+  }
+  if (isGlobal) {
+    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_footer.default, { className: footerCls, style: footerProps == null ? void 0 : footerProps.style }, footerContent), summaryModal);
+  }
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: footerCls, style: footerProps == null ? void 0 : footerProps.style }, footerContent), summaryModal);
+};
+ProcedureFooter.displayName = "ProcedureFooter";
+var ProcedureFooter_default = ProcedureFooter;

package/lib/components/PisellProcedure/components/ProcedureHeader.d.ts

@@ -1,8 +1,34 @@
 import React from 'react';
-import type { ProcedureHeaderProps } from '../types';
+import type { ProcedureHeaderProps as HeaderProps } from '../types';
+export declare type ActionType = 'cancel' | 'ok' | 'confirm';
 /**
- * ProcedureHeader 组件
- * 头部区域，集成步骤导航和操作按钮
+ * ProcedureHeader 子组件 Props
+ */
+export interface ProcedureHeaderProps {
+    /** 头部配置 */
+    headerProps?: HeaderProps;
+    /** 当前步骤索引 */
+    currentStep: number;
+    /** 自定义类名 */
+    className?: string;
+    /** 上一步回调 */
+    goPrev?: () => void;
+    /** 跳转到指定步骤 */
+    goToStep?: (step: number) => void;
+    /** 关闭回调 */
+    onClose?: () => void;
+    /** 首步返回回调 */
+    onFirstStepBack?: () => void;
+    /** 返回确认回调 */
+    onBackConfirm?: (action: ActionType) => void;
+    /** 关闭确认回调 */
+    onCloseConfirm?: (action: ActionType) => void;
+}
+/**
+ * ProcedureHeader 头部区域组件
+ *
+ * @description 包含左侧返回按钮、中间步骤条、右侧关闭按钮
+ * @author Pisell Team
  */
 declare const ProcedureHeader: React.FC<ProcedureHeaderProps>;
 export default ProcedureHeader;