@pisell/materials 6.8.3 → 6.8.5

package/es/locales/zh-TW.d.ts

@@ -282,6 +282,8 @@ declare const _default: {
     'pisell-wallet-pass-card-status-lastPayment': string;
     'pisell-wallet-pass-card-reset': string;
     'pisell-wallet-pass-card-done': string;
+    'pisell2.wallet-card.add-holder-tip': string;
+    'pisell2.wallet-card.add-holder-button-text': string;
     'pisell-camera-no-camera-accessible': string;
     'pisell-camera-permission-denied': string;
     'pisell-camera-switch-camera': string;
@@ -310,5 +312,6 @@ declare const _default: {
     'pisell-procedure-header-close-confirm-desc': string;
     'pisell-procedure-header-close-confirm-no': string;
     'pisell-procedure-header-close-confirm-yes': string;
+    'pisell-procedure-footer-more': string;
 };
 export default _default;

package/es/locales/zh-TW.js

@@ -345,6 +345,8 @@ export default {
   'pisell-wallet-pass-card-status-lastPayment': '上次結算',
   'pisell-wallet-pass-card-reset': '清空',
   'pisell-wallet-pass-card-done': '保存',
+  'pisell2.wallet-card.add-holder-tip': '為確保您的權益，此卡\r\n需指定使用人後方可激活使用。',
+  'pisell2.wallet-card.add-holder-button-text': '添加使用人',
   // 相机组件
   'pisell-camera-no-camera-accessible': '沒有找到攝像頭',
   'pisell-camera-permission-denied': '沒有權限使用攝像頭',
@@ -380,5 +382,6 @@ export default {
   'pisell-procedure-header-close-confirm-title': '確認退出？',
   'pisell-procedure-header-close-confirm-desc': '退出後將丟失所有已填寫的信息，確定要退出嗎？',
   'pisell-procedure-header-close-confirm-no': '繼續',
-  'pisell-procedure-header-close-confirm-yes': '退出'
+  'pisell-procedure-header-close-confirm-yes': '退出',
+  'pisell-procedure-footer-more': '更多'
 };

package/es/utils/hoc.d.ts

@@ -1,17 +1,17 @@
-import React, { ComponentType } from 'react';
+import { ComponentType } from 'react';
 /**
  * 简单包装，不做任何处理
  * 部分组件ref比较特殊，包一层会解决这个问题
  */
-export declare function withWrap<T extends ComponentType<any>>(Comp: T): (props: any) => React.JSX.Element;
+export declare function withWrap<T extends ComponentType<any>>(Comp: T): (props: any) => JSX.Element;
 /**
  * 某些组件会用React.Children.only检查子节点
  * 需要做处理避免报错
  */
-export declare function withSingleChild(Comp: ComponentType<any>, needsConvert?: string[]): (props: any) => React.JSX.Element;
-export declare function withSingleFunctionChild(Comp: ComponentType<any>): (props: any) => React.JSX.Element;
+export declare function withSingleChild(Comp: ComponentType<any>, needsConvert?: string[]): (props: any) => JSX.Element;
+export declare function withSingleFunctionChild(Comp: ComponentType<any>): (props: any) => JSX.Element;
 /**
  * moment对象在序列化后会被转为字符串
  * 需要让日期类组件支持接受字符串值
  */
-export declare function withMomentProps(Comp: ComponentType<any>, needsConvert?: string[]): (props: any) => React.JSX.Element;
+export declare function withMomentProps(Comp: ComponentType<any>, needsConvert?: string[]): (props: any) => JSX.Element;

package/es/utils/index.d.ts

@@ -1,4 +1,4 @@
 export declare const isBrowser: boolean;
-export declare const getCssNumber: (val: string | number) => string | number;
+export declare const getCssNumber: (val: string | number) => string;
 export declare function uuid(): string;
 export * from './mergeWith';

package/es/utils/miniRedux.d.ts

@@ -12,6 +12,6 @@ declare const _default: <State extends Record<string, any>, Namespace extends st
             payload: any;
         }) => void;
     }>;
-    Provider: (ComponentUi: any) => (props: any, ref: any) => React.JSX.Element;
+    Provider: (ComponentUi: any) => (props: any, ref: any) => JSX.Element;
 };
 export default _default;

package/es/utils/platform.d.ts

@@ -1 +1 @@
-export declare const isMobile: () => any;
+export declare const isMobile: () => boolean;

package/lib/components/DragSortList/index.d.ts

@@ -18,7 +18,7 @@ export interface Props<T> {
         attributes: DraggableAttributes;
     }) => React.ReactElement<HTMLElement>;
 }
-export default function Sortable<T extends Record<string, any>>({ list, onChange, rowKey, children, activationConstraint, }: Props<T>): React.JSX.Element;
+export default function Sortable<T extends Record<string, any>>({ list, onChange, rowKey, children, activationConstraint, }: Props<T>): JSX.Element;
 export interface SortableItemProps<T> {
     id: number;
     index: number;

package/lib/components/MultipleContainersSortList/index.d.ts

@@ -22,5 +22,5 @@ interface DefaultRenderContainerProps {
     }) => React.ReactElement;
     children: any;
 }
-declare const MultipleContainersSortList: <T extends Record<string, any>>(props: MultipleContainersSortListProps<T>) => React.JSX.Element;
+declare const MultipleContainersSortList: <T extends Record<string, any>>(props: MultipleContainersSortListProps<T>) => JSX.Element;
 export default MultipleContainersSortList;

package/lib/components/Pagination/index.d.ts

@@ -5,10 +5,10 @@ export declare const paginationConfig: {
     className: string;
     defaultCurrent: number;
     showTotal: (total: number, range: [number, number]) => string;
-    itemRender: (page: number, type: "next" | "page" | "prev" | "jump-prev" | "jump-next", element: React.ReactNode) => React.ReactNode;
+    itemRender: (page: number, type: "page" | "next" | "prev" | "jump-prev" | "jump-next", element: React.ReactNode) => React.ReactNode;
     responsive: boolean;
     size: string;
 };
-declare const Pagination: (props: PaginationProps) => React.JSX.Element | null;
+declare const Pagination: (props: PaginationProps) => JSX.Element | null;
 export default Pagination;
-export declare const FormPagination: ({ value, onChange, page, pageSize, ...other }: any) => React.JSX.Element;
+export declare const FormPagination: ({ value, onChange, page, pageSize, ...other }: any) => JSX.Element;

package/lib/components/PisellBasicGrid/PisellBasicGrid.d.ts

@@ -1,10 +1,9 @@
-import React from 'react';
 import type { PisellBasicGridProps } from './types';
 import './PisellBasicGrid.less';
 /**
  * 使用 memo 优化组件性能
  * @description 当 props 没有变化时，避免不必要的重新渲染
  */
-declare const MemoizedPisellBasicGrid: <T>(props: PisellBasicGridProps<T>) => React.JSX.Element;
+declare const MemoizedPisellBasicGrid: <T>(props: PisellBasicGridProps<T>) => JSX.Element;
 export { MemoizedPisellBasicGrid as PisellBasicGrid };
 export default MemoizedPisellBasicGrid;

package/lib/components/PisellCards/components/GraphicTextCard/GraphicTextCard.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
 import { GraphicTextCardProps } from './types';
 import './GraphicTextCard.less';
 /**
  * Provider 包装器
  * 兼容 PisellCards 系统的 props 传递方式
  */
-declare const Provider: (props: GraphicTextCardProps) => React.JSX.Element;
+declare const Provider: (props: GraphicTextCardProps) => JSX.Element;
 export default Provider;

package/lib/components/PisellCards/components/MultilevelCard/MultilevelCard.d.ts

@@ -15,5 +15,5 @@ import './MultilevelCard.less';
  * ```
  */
 export declare const MultilevelCard: React.FC<MultilevelCardProps<any>>;
-declare const Provider: (props: any) => React.JSX.Element;
+declare const Provider: (props: any) => JSX.Element;
 export default Provider;

package/lib/components/PisellCards/components/PisellImageCard/PisellImageCard.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
 import { PisellImageCardProps } from './types';
 import './PisellImageCard.less';
 /**
  * Provider 包装器
  * 兼容 PisellCards 系统的 props 传递方式
  */
-declare const Provider: (props: PisellImageCardProps) => React.JSX.Element;
+declare const Provider: (props: PisellImageCardProps) => JSX.Element;
 export default Provider;

package/lib/components/PisellCards/components/TabCard/TabCard.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import './TabCard.less';
-declare const Provider: (props: any) => React.JSX.Element;
+declare const Provider: (props: any) => JSX.Element;
 export default Provider;

package/lib/components/PisellCards/components/TextCard/TextCard.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
 import './TextCard.less';
 /**
  * Provider 包装器
  * 兼容 PisellCards 系统的 props 传递方式
  */
-declare const Provider: (props: any) => React.JSX.Element;
+declare const Provider: (props: any) => JSX.Element;
 export default Provider;

package/lib/components/PisellCards/index.d.ts

@@ -1,9 +1,9 @@
 declare const PisellCards: {
-    TabCard: (props: any) => import("react").JSX.Element;
-    TextCard: (props: any) => import("react").JSX.Element;
-    GraphicTextCard: (props: import("./components/GraphicTextCard").GraphicTextCardProps) => import("react").JSX.Element;
-    MultilevelCard: (props: any) => import("react").JSX.Element;
-    PisellImageCard: (props: import("./components/PisellImageCard").PisellImageCardProps) => import("react").JSX.Element;
+    TabCard: (props: any) => JSX.Element;
+    TextCard: (props: any) => JSX.Element;
+    GraphicTextCard: (props: import("./components/GraphicTextCard").GraphicTextCardProps) => JSX.Element;
+    MultilevelCard: (props: any) => JSX.Element;
+    PisellImageCard: (props: import("./components/PisellImageCard").PisellImageCardProps) => JSX.Element;
 };
 export default PisellCards;
 export type { PisellBasicCardProps } from './types';

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { PisellProcedureProps } from './types';
+import type { PisellProcedureProps, PisellProcedureRef } from './types';
 import './PisellProcedure.less';
 /**
  * PisellProcedure 流程容器组件
@@ -7,6 +7,16 @@ import './PisellProcedure.less';
  * @description 用于管理多步骤流程的复合容器组件，基于 PisellLayout 实现三段式布局
  * @author Pisell Team
  * @version 1.0.0
+ *
+ * @example
+ * // 使用 ref 调用组件方法
+ * const procedureRef = useRef<PisellProcedureRef>(null);
+ *
+ * // 跳转到下一步
+ * procedureRef.current?.goNext();
+ *
+ * // 获取当前步骤
+ * const currentStep = procedureRef.current?.getCurrentStep();
  */
-declare const PisellProcedure: React.FC<PisellProcedureProps>;
+declare const PisellProcedure: React.ForwardRefExoticComponent<PisellProcedureProps & React.RefAttributes<PisellProcedureRef>>;
 export default PisellProcedure;

package/lib/components/PisellProcedure/PisellProcedure.js

@@ -39,112 +39,151 @@ var import_hooks = require("./hooks");
 var import_utils = require("./utils");
 var import_useMobile = require("../../hooks/useMobile");
 var import_PisellProcedure = require("./PisellProcedure.less");
-var PisellProcedure = (props) => {
-  const {
-    // 通用属性
-    className,
-    style,
-    mode = "page",
-    showHeader = true,
-    showSidebar = true,
-    showFooter = true,
-    // 步骤控制
-    defaultCurrent = 0,
-    onStepsChange,
-    // 区域配置
-    headerProps,
-    bodyProps,
-    footerProps,
-    // 事件回调
-    onClose,
-    onPrev,
-    onNext,
-    onFirstStepBack,
-    onBackConfirm,
-    onCloseConfirm,
-    // 低代码属性
-    __designMode,
-    __id,
-    ...other
-  } = props;
-  const isMobileDetected = (0, import_useMobile.useMobile)(744);
-  const isMobile = mode === "modal" ? false : isMobileDetected;
-  const { currentStep, goPrev, goNext, goToStep } = (0, import_hooks.useStepManager)({
-    stepsProps: headerProps == null ? void 0 : headerProps.stepsProps,
-    defaultCurrent,
-    onPrev,
-    onNext,
-    onStepsChange
-  });
-  const [summaryModalOpen, setSummaryModalOpen] = (0, import_react.useState)(false);
-  const openSummaryModal = (0, import_react.useCallback)(() => setSummaryModalOpen(true), []);
-  const closeSummaryModal = (0, import_react.useCallback)(() => setSummaryModalOpen(false), []);
-  const footerPosition = (0, import_react.useMemo)(() => {
-    if (isMobile && mode !== "modal") return "float-all";
-    return (footerProps == null ? void 0 : footerProps.position) || "float-sidebar";
-  }, [mode, isMobile, footerProps == null ? void 0 : footerProps.position]);
-  const containerCls = (0, import_react.useMemo)(() => {
-    return (0, import_utils.mergeClassNames)(
-      "pisell-procedure",
+var PisellProcedure = (0, import_react.forwardRef)(
+  (props, ref) => {
+    const {
+      // 通用属性
       className,
-      // 弹窗模式添加 --modal 修饰类，用于禁用媒体查询
-      mode === "modal" && "pisell-procedure--modal",
-      (0, import_utils.modifierClassName)("pisell-procedure", `footer-${footerPosition}`)
-    );
-  }, [className, mode, footerPosition]);
-  const footerIsGlobal = (0, import_utils.isFooterGlobal)(footerPosition);
-  return /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      className: containerCls,
       style,
-      "data-component": "pisell-procedure",
-      "data-id": __id,
+      mode = "page",
+      showHeader = true,
+      showSidebar = true,
+      showFooter = true,
+      // 步骤控制
+      defaultCurrent = 0,
+      onStepsChange,
+      // 区域配置
+      headerProps,
+      bodyProps,
+      footerProps,
+      // 事件回调
+      onClose,
+      onPrev,
+      onNext,
+      onFirstStepBack,
+      onBackConfirm,
+      onCloseConfirm,
+      // 低代码属性
+      __designMode,
+      __id,
       ...other
-    },
-    /* @__PURE__ */ import_react.default.createElement(import_pisellLayout.default, null, showHeader && /* @__PURE__ */ import_react.default.createElement(
-      import_components.ProcedureHeader,
-      {
-        headerProps,
-        currentStep,
-        goPrev,
-        onClose,
-        onFirstStepBack,
-        onBackConfirm,
-        onCloseConfirm,
-        goToStep
-      }
-    ), /* @__PURE__ */ import_react.default.createElement(
-      import_components.ProcedureBody,
-      {
-        bodyProps,
-        footerProps,
-        footerPosition,
-        showFooter: showFooter && !footerIsGlobal,
-        showSidebar,
-        summaryModalOpen,
-        onOpenSummaryModal: openSummaryModal,
-        onCloseSummaryModal: closeSummaryModal,
+    } = props;
+    const isMobileDetected = (0, import_useMobile.useMobile)(744);
+    const isMobile = mode === "modal" ? false : isMobileDetected;
+    const { currentStep, goPrev, goNext, goToStep } = (0, import_hooks.useStepManager)({
+      stepsProps: headerProps == null ? void 0 : headerProps.stepsProps,
+      defaultCurrent,
+      onPrev,
+      onNext,
+      onStepsChange
+    });
+    const [summaryModalOpen, setSummaryModalOpen] = (0, import_react.useState)(false);
+    const openSummaryModal = (0, import_react.useCallback)(() => setSummaryModalOpen(true), []);
+    const closeSummaryModal = (0, import_react.useCallback)(() => setSummaryModalOpen(false), []);
+    (0, import_react.useImperativeHandle)(
+      ref,
+      () => ({
+        /**
+         * 跳转到上一步
+         */
+        goPrev: () => goPrev(),
+        /**
+         * 跳转到下一步
+         */
+        goNext: () => goNext(),
+        /**
+         * 跳转到指定步骤
+         */
+        goToStep: (step) => goToStep(step),
+        /**
+         * 获取当前步骤索引
+         */
+        getCurrentStep: () => currentStep,
+        /**
+         * 打开移动端总结弹窗
+         */
+        openSummaryModal,
+        /**
+         * 关闭移动端总结弹窗
+         */
+        closeSummaryModal
+      }),
+      [
         goPrev,
         goNext,
-        mode
-      }
-    ), showFooter && footerIsGlobal && /* @__PURE__ */ import_react.default.createElement(
-      import_components.ProcedureFooter,
+        goToStep,
+        currentStep,
+        openSummaryModal,
+        closeSummaryModal
+      ]
+    );
+    const footerPosition = (0, import_react.useMemo)(() => {
+      if (isMobile && mode !== "modal") return "float-all";
+      return (footerProps == null ? void 0 : footerProps.position) || "float-sidebar";
+    }, [mode, isMobile, footerProps == null ? void 0 : footerProps.position]);
+    const containerCls = (0, import_react.useMemo)(() => {
+      return (0, import_utils.mergeClassNames)(
+        "pisell-procedure",
+        className,
+        // 弹窗模式添加 --modal 修饰类，用于禁用媒体查询
+        mode === "modal" && "pisell-procedure--modal",
+        (0, import_utils.modifierClassName)("pisell-procedure", `footer-${footerPosition}`)
+      );
+    }, [className, mode, footerPosition]);
+    const footerIsGlobal = (0, import_utils.isFooterGlobal)(footerPosition);
+    return /* @__PURE__ */ import_react.default.createElement(
+      "div",
       {
-        footerProps,
-        position: footerPosition,
-        isGlobal: true,
-        sidebarContent: bodyProps == null ? void 0 : bodyProps.sidebarSlot,
-        summaryModalOpen,
-        onOpenSummaryModal: openSummaryModal,
-        onCloseSummaryModal: closeSummaryModal,
-        goPrev,
-        goNext,
-        mode
-      }
-    ))
-  );
-};
+        className: containerCls,
+        style,
+        "data-component": "pisell-procedure",
+        "data-id": __id,
+        ...other
+      },
+      /* @__PURE__ */ import_react.default.createElement(import_pisellLayout.default, null, showHeader && /* @__PURE__ */ import_react.default.createElement(
+        import_components.ProcedureHeader,
+        {
+          headerProps,
+          currentStep,
+          goPrev,
+          onClose,
+          onFirstStepBack,
+          onBackConfirm,
+          onCloseConfirm,
+          goToStep
+        }
+      ), /* @__PURE__ */ import_react.default.createElement(
+        import_components.ProcedureBody,
+        {
+          bodyProps,
+          footerProps,
+          footerPosition,
+          showFooter: showFooter && !footerIsGlobal,
+          showSidebar,
+          summaryModalOpen,
+          onOpenSummaryModal: openSummaryModal,
+          onCloseSummaryModal: closeSummaryModal,
+          goPrev,
+          goNext,
+          mode
+        }
+      ), showFooter && footerIsGlobal && /* @__PURE__ */ import_react.default.createElement(
+        import_components.ProcedureFooter,
+        {
+          footerProps,
+          position: footerPosition,
+          isGlobal: true,
+          sidebarContent: bodyProps == null ? void 0 : bodyProps.sidebarSlot,
+          summaryModalOpen,
+          onOpenSummaryModal: openSummaryModal,
+          onCloseSummaryModal: closeSummaryModal,
+          goPrev,
+          goNext,
+          mode
+        }
+      ))
+    );
+  }
+);
 PisellProcedure.displayName = "PisellProcedure";
 var PisellProcedure_default = PisellProcedure;