@pisell/materials 6.11.240 → 6.11.241

package/lib/components/pisellLookup/PisellLookup.js

@@ -43,6 +43,7 @@ var import_PisellLookup = require("./PisellLookup.less");
 var PisellLookupComponent = (0, import_react.forwardRef)((props, ref) => {
   const {
     // 触发器配置
+    showTrigger = true,
     triggerType = "input",
     trigger,
     triggerText,
@@ -65,6 +66,7 @@ var PisellLookupComponent = (0, import_react.forwardRef)((props, ref) => {
     onSearch,
     searchMode = "realtime",
     debounceTime = 300,
+    allowRepeatSearch = false,
     // 扫码配置
     showScan = true,
     onScan,
@@ -91,9 +93,14 @@ var PisellLookupComponent = (0, import_react.forwardRef)((props, ref) => {
     // 容器样式配置
     modalWidth,
     modalStyle,
+    modalCentered = false,
+    modalTransitionName,
     getContainer,
     drawerWidth,
+    drawerHeight,
     drawerPlacement,
+    drawerTitle,
+    drawerClosable,
     popupWidth,
     containerStyle,
     containerClassName,
@@ -109,6 +116,7 @@ var PisellLookupComponent = (0, import_react.forwardRef)((props, ref) => {
     autoFocusOnOpen = true,
     // 输入栏插槽
     inputRender,
+    headerRender,
     // 样式配置
     className,
     style,
@@ -223,7 +231,7 @@ var PisellLookupComponent = (0, import_react.forwardRef)((props, ref) => {
   );
   const handleConfirmSearch = (0, import_react.useCallback)(
     (searchKeyword) => {
-      if (lastSearchKeywordRef.current === searchKeyword) {
+      if (!allowRepeatSearch && lastSearchKeywordRef.current === searchKeyword) {
         return;
       }
       lastSearchKeywordRef.current = searchKeyword;
@@ -232,7 +240,7 @@ var PisellLookupComponent = (0, import_react.forwardRef)((props, ref) => {
       }
       onSearch == null ? void 0 : onSearch(searchKeyword);
     },
-    [showHistory, addHistory, onSearch]
+    [allowRepeatSearch, showHistory, addHistory, onSearch]
   );
   (0, import_hooks.useDebounceSearch)({
     keyword,
@@ -391,7 +399,7 @@ var PisellLookupComponent = (0, import_react.forwardRef)((props, ref) => {
     return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lookup-content" }, auxiliary, results);
   };
   if (displayType === "inline" || displayType === "popup") {
-    return /* @__PURE__ */ import_react.default.createElement("div", { className: `pisell-lookup pisell-lookup-${displayType} ${className || ""}`, style }, renderTrigger(), /* @__PURE__ */ import_react.default.createElement(
+    return /* @__PURE__ */ import_react.default.createElement("div", { className: `pisell-lookup pisell-lookup-${displayType} ${className || ""}`, style }, showTrigger ? renderTrigger() : null, /* @__PURE__ */ import_react.default.createElement(
       import_components.LookupResultHost,
       {
         displayType,
@@ -405,7 +413,7 @@ var PisellLookupComponent = (0, import_react.forwardRef)((props, ref) => {
       renderContent()
     ));
   }
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: `pisell-lookup ${className || ""}`, style }, renderTrigger(), /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: `pisell-lookup ${className || ""}`, style }, showTrigger ? renderTrigger() : null, /* @__PURE__ */ import_react.default.createElement(
     import_components.LookupResultHost,
     {
       displayType,
@@ -413,9 +421,14 @@ var PisellLookupComponent = (0, import_react.forwardRef)((props, ref) => {
       onClose: close,
       modalWidth,
       modalStyle,
+      modalCentered,
+      modalTransitionName,
       getContainer,
       drawerWidth,
+      drawerHeight,
       drawerPlacement,
+      drawerTitle,
+      drawerClosable,
       containerStyle,
       containerClassName,
       mask,
@@ -423,6 +436,7 @@ var PisellLookupComponent = (0, import_react.forwardRef)((props, ref) => {
       zIndex,
       onAfterOpen: handleAfterOpen
     },
+    displayType === "modal" || displayType === "drawer" ? typeof headerRender === "function" ? headerRender() : headerRender : null,
     /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lookup-search-area-with-close" }, /* @__PURE__ */ import_react.default.createElement(
       import_components.LookupTrigger,
       {

package/lib/components/pisellLookup/components/LookupResultHost.js

@@ -34,8 +34,8 @@ __export(LookupResultHost_exports, {
 module.exports = __toCommonJS(LookupResultHost_exports);
 var import_react = __toESM(require("react"));
 var import_antd = require("antd");
-var import_icons = require("@ant-design/icons");
 var import_locales = require("../../../locales");
+var import_pisellContainer = __toESM(require("../../pisellContainer"));
 var LookupResultHost = (props) => {
   const {
     displayType,
@@ -44,9 +44,14 @@ var LookupResultHost = (props) => {
     children,
     modalWidth = 834,
     modalStyle,
+    modalCentered = false,
+    modalTransitionName,
     getContainer,
     drawerWidth = 378,
+    drawerHeight,
     drawerPlacement = "right",
+    drawerTitle = (0, import_locales.getText)("pisell-lookup-confirm-button-text"),
+    drawerClosable = true,
     popupWidth,
     containerStyle,
     containerClassName,
@@ -109,26 +114,32 @@ var LookupResultHost = (props) => {
     ].filter(Boolean).join(" ");
     const wrapClassName = hasCustomContainer ? "pisell-lookup-modal-custom-container" : "";
     return /* @__PURE__ */ import_react.default.createElement(
-      import_antd.Modal,
+      import_pisellContainer.default,
       {
-        open: visible,
-        onCancel: onClose,
-        footer: null,
-        width: modalWidth,
-        style: { top: 0, ...modalStyle },
-        getContainer,
-        mask,
-        maskClosable: effectiveMaskClosable,
-        zIndex,
-        rootClassName: modalRootClassName,
-        className: modalClassName,
-        wrapClassName,
-        closeIcon: null,
-        destroyOnClose: true,
-        title: null,
-        afterOpenChange: (open) => {
-          if (open && onAfterOpen) {
-            onAfterOpen();
+        renderType: "modal",
+        props: {
+          open: visible,
+          onCancel: onClose,
+          footer: null,
+          header: false,
+          closable: false,
+          width: modalWidth,
+          centered: modalCentered,
+          transitionName: modalTransitionName,
+          style: { top: 0, ...modalStyle },
+          getContainer,
+          mask,
+          maskClosable: effectiveMaskClosable,
+          zIndex,
+          rootClassName: modalRootClassName,
+          className: modalClassName,
+          wrapClassName,
+          destroyOnClose: true,
+          title: null,
+          afterOpenChange: (open) => {
+            if (open && onAfterOpen) {
+              onAfterOpen();
+            }
           }
         }
       },
@@ -139,22 +150,26 @@ var LookupResultHost = (props) => {
     const effectiveMaskClosable = mask ? maskClosable : false;
     const drawerClassName = `pisell-lookup-drawer-container ${!mask ? "pisell-lookup-drawer-no-mask" : ""} ${containerClassName || ""}`;
     return /* @__PURE__ */ import_react.default.createElement(
-      import_antd.Drawer,
+      import_pisellContainer.default,
       {
-        open: visible,
-        onClose,
-        width: drawerWidth,
-        placement: drawerPlacement,
-        mask,
-        maskClosable: effectiveMaskClosable,
-        zIndex,
-        className: drawerClassName,
-        closeIcon: /* @__PURE__ */ import_react.default.createElement(import_icons.CloseOutlined, null),
-        destroyOnClose: true,
-        title: (0, import_locales.getText)("pisell-lookup-confirm-button-text"),
-        afterOpenChange: (open) => {
-          if (open && onAfterOpen) {
-            onAfterOpen();
+        renderType: "drawer",
+        props: {
+          open: visible,
+          onClose,
+          width: drawerWidth,
+          height: drawerHeight,
+          placement: drawerPlacement,
+          mask,
+          maskClosable: effectiveMaskClosable,
+          zIndex,
+          className: drawerClassName,
+          closable: drawerClosable,
+          destroyOnClose: true,
+          title: drawerTitle,
+          afterOpenChange: (open) => {
+            if (open && onAfterOpen) {
+              onAfterOpen();
+            }
           }
         }
       },

package/lib/components/pisellLookup/components/LookupTrigger.js

@@ -196,6 +196,8 @@ var LookupTriggerComponent = (0, import_react.forwardRef)(
         {
           type: "primary",
           size,
+          loading,
+          disabled,
           onClick: handleConfirm,
           className: "pisell-lookup-input-confirm"
         },

package/lib/components/pisellLookup/types.d.ts

@@ -84,6 +84,11 @@ export interface LookupInputRenderContext {
  * PisellLookup 组件 Props
  */
 export interface PisellLookupProps {
+    /**
+     * 是否渲染外部触发器；受控打开浮层时可关闭。
+     * @default true
+     */
+    showTrigger?: boolean;
     /**
      * 预设触发器类型（与 trigger 互斥）
      * @default 'input'
@@ -189,6 +194,12 @@ export interface PisellLookupProps {
      * @param keyword 搜索关键词
      */
     onSearch?: (keyword: string) => void;
+    /**
+     * 是否允许重复确认同一个关键词。
+     * 适用于提交失败后需要原值重试的场景；默认保持去重行为。
+     * @default false
+     */
+    allowRepeatSearch?: boolean;
     /**
      * 是否显示扫码按钮
      * @default true
@@ -299,6 +310,13 @@ export interface PisellLookupProps {
      * Modal 自定义样式
      */
     modalStyle?: React.CSSProperties;
+    /**
+     * Modal 是否使用容器原生的垂直居中布局。
+     * @default false
+     */
+    modalCentered?: boolean;
+    /** Modal 进出场动画名称。 */
+    modalTransitionName?: string;
     /**
      * Modal 挂载节点
      * - HTMLElement: 挂载到指定的 DOM 节点
@@ -313,11 +331,17 @@ export interface PisellLookupProps {
      * @default 378
      */
     drawerWidth?: number | string;
+    /** Drawer 高度；placement 为 top / bottom 时生效。 */
+    drawerHeight?: number | string;
     /**
      * Drawer 位置
      * @default 'right'
      */
     drawerPlacement?: DrawerPlacement;
+    /** Drawer 标题；传 null 可隐藏默认标题。 */
+    drawerTitle?: React.ReactNode | null;
+    /** 是否展示 Drawer 自带关闭按钮。 */
+    drawerClosable?: boolean;
     /**
      * Popup 宽度
      */
@@ -394,6 +418,8 @@ export interface PisellLookupProps {
      * ```
      */
     inputRender?: (ctx: LookupInputRenderContext) => React.ReactNode;
+    /** Modal / Drawer 内置搜索栏上方的自定义内容。 */
+    headerRender?: React.ReactNode | (() => React.ReactNode);
     /**
      * 自定义类名
      */
@@ -631,6 +657,10 @@ export interface LookupResultHostProps {
      * Modal 宽度
      */
     modalWidth?: number | string;
+    /** Modal 是否垂直居中 */
+    modalCentered?: boolean;
+    /** Modal 进出场动画名称 */
+    modalTransitionName?: string;
     /**
      * Modal 样式
      */
@@ -643,10 +673,16 @@ export interface LookupResultHostProps {
      * Drawer 宽度
      */
     drawerWidth?: number | string;
+    /** Drawer 高度 */
+    drawerHeight?: number | string;
     /**
      * Drawer 位置
      */
     drawerPlacement?: DrawerPlacement;
+    /** Drawer 标题 */
+    drawerTitle?: React.ReactNode | null;
+    /** 是否展示 Drawer 自带关闭按钮 */
+    drawerClosable?: boolean;
     /**
      * Popup 宽度
      */

package/lib/index.d.ts

@@ -128,7 +128,7 @@ export { default as PisellUpload } from './components/pisellUpload';
 export { default as Translation } from './components/translation';
 export { PisellLookup } from './components/pisellLookup';
 export type { PisellLookupProps, PisellLookupRef, LookupInputRenderContext, } from './components/pisellLookup';
-export { PisellFind } from './components/pisellFind';
+export { FIND_FALLBACK_SCANNER_COUNT_KEY, PisellFind, } from './components/pisellFind';
 export type { PisellFindProps, PisellFindRef } from './components/pisellFind';
 export { default as DataSourceForm } from './components/dataSourceComponents/dataSourceForm';
 export { default as FormGroup } from './components/dataSourceComponents/dataSourceForm/group';

package/lib/index.js

@@ -80,6 +80,7 @@ __export(src_exports, {
   Dropdown: () => import_dropdown.default,
   EMPTY_FLOOR_MAP_LAYOUT_CONTEXT: () => import_pisellFloorMapLayout.EMPTY_FLOOR_MAP_LAYOUT_CONTEXT,
   Empty: () => import_antd.Empty,
+  FIND_FALLBACK_SCANNER_COUNT_KEY: () => import_pisellFind.FIND_FALLBACK_SCANNER_COUNT_KEY,
   FLOOR_MAP_BUILTIN_SHAPES: () => import_pisellFloorMapLayout.FLOOR_MAP_BUILTIN_SHAPES,
   FLOOR_MAP_BUILTIN_SHAPE_ELEMENT_KIND: () => import_pisellFloorMapLayout.FLOOR_MAP_BUILTIN_SHAPE_ELEMENT_KIND,
   FLOOR_MAP_IMAGE_ELEMENT_KIND: () => import_pisellFloorMapLayout.FLOOR_MAP_IMAGE_ELEMENT_KIND,
@@ -590,6 +591,7 @@ var import_walletCard = __toESM(require("./components/walletCard"));
   Dropdown,
   EMPTY_FLOOR_MAP_LAYOUT_CONTEXT,
   Empty,
+  FIND_FALLBACK_SCANNER_COUNT_KEY,
   FLOOR_MAP_BUILTIN_SHAPES,
   FLOOR_MAP_BUILTIN_SHAPE_ELEMENT_KIND,
   FLOOR_MAP_IMAGE_ELEMENT_KIND,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/materials",
-  "version": "6.11.240",
+  "version": "6.11.241",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",
@@ -96,8 +96,8 @@
     "antd-mobile": "^5.38.1",
     "vod-js-sdk-v6": "^1.4.11",
     "@pisell/date-picker": "3.0.10",
-    "@pisell/icon": "0.0.11",
-    "@pisell/utils": "3.0.4"
+    "@pisell/utils": "3.0.4",
+    "@pisell/icon": "0.0.11"
   },
   "peerDependencies": {
     "react": "^18.0.0",

package/es/components/PisellGroupView/PisellGroupView.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import type { PisellGroupViewProps } from './types';
-import './PisellGroupView.less';
-/**
- * 使用 memo 优化性能：props 未变化时跳过重渲染
- */
-declare const MemoizedPisellGroupView: <T>(props: PisellGroupViewProps<T>) => React.JSX.Element;
-export { MemoizedPisellGroupView as PisellGroupView };
-export default MemoizedPisellGroupView;

package/es/components/PisellGroupView/PisellGroupView.stories.d.ts

@@ -1,27 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import PisellGroupView from './PisellGroupView';
-/**
- * PisellGroupView 分组展示组件
- *
- * 通用、数据无关的「分组展示容器」：先按条件把列表分组，
- * 再为每个分组渲染 头部 / 统计 / 主体 / 操作 四块，各块均可自定义渲染。
- */
-declare const meta: Meta<typeof PisellGroupView>;
-export default meta;
-declare type Story = StoryObj<typeof PisellGroupView>;
-/**
- * 基础用法：按「商品 + 时间」组合分组，展示四块结构
- */
-export declare const Basic: Story;
-/**
- * 单字段分组 + 主体多列布局（itemLayout 对象，内部使用 PisellBasicGrid）
- */
-export declare const GridBody: Story;
-/**
- * 利用 ItemContext.groupKeys 在主体卡片中省略「头部已展示」的字段
- */
-export declare const OmitHeaderFields: Story;
-/**
- * 空数据态
- */
-export declare const Empty: Story;

package/es/components/PisellGroupView/index.d.ts

@@ -1,6 +0,0 @@
-/**
- * PisellGroupView 组件导出
- * @description 通用、数据无关的分组展示容器
- */
-export { PisellGroupView, default } from './PisellGroupView';
-export type { PisellGroupViewProps, GroupModel, GroupBlocks, ItemContext, ItemLayout, GroupViewVariant, } from './types';

package/es/components/PisellGroupView/types.d.ts

@@ -1,124 +0,0 @@
-import type { CSSProperties, ReactNode } from 'react';
-import type { GroupKey, GroupResult } from '@pisell/utils';
-/**
- * 单个分组的数据模型
- * @template T - 数据项类型
- * @description 复用 `@pisell/utils` 的 `GroupResult`，包含 groupId、keys、keyMap、items 等
- */
-export declare type GroupModel<T> = GroupResult<T>;
-/**
- * 主体（第三块）渲染单条数据时的上下文
- * @template T - 数据项类型
- */
-export interface ItemContext<T> {
-    /** 当前数据所属分组 */
-    group: GroupModel<T>;
-    /** 当前数据在分组内的下标 */
-    index: number;
-    /**
-     * 参与分组的字段名列表
-     * @description
-     * 调用方可据此在卡片中省略「头部已展示」的字段，避免重复展示。
-     * 当使用自定义函数分组时，该数组为空。
-     */
-    groupKeys: string[];
-}
-/**
- * 主体（第三块）的布局配置
- * @description
- * - `'stack'`：纵向堆叠每条卡片（默认）
- * - 对象：透传给内部 `PisellBasicGrid` 实现多列/横向布局
- */
-export declare type ItemLayout = 'stack' | {
-    /** 一行显示的卡片数 */
-    columns?: number;
-    /** 卡片间距 */
-    gap?: number | string;
-    /** 排列方向 */
-    direction?: 'horizontal' | 'vertical';
-    /** 是否换行 */
-    wrap?: 'wrap' | 'nowrap';
-};
-/**
- * 一个分组渲染出的四块内容
- * @description 透传给 `renderGroup`，便于调用方自定义整组容器但复用四块默认内容
- */
-export interface GroupBlocks {
-    /** ① 头部：分组条件对应的相同信息 */
-    header: ReactNode;
-    /** ② 统计栏：来自分组数据的统计信息 */
-    stats: ReactNode;
-    /** ③ 主体：分组内所有条目（卡片） */
-    body: ReactNode;
-    /** ④ 操作区：批量操作 */
-    actions: ReactNode;
-}
-/**
- * 多端 variant
- * @description 仅用于在根节点追加 `--${variant}` class，由 Less 控制展示差异
- */
-export declare type GroupViewVariant = 'desktop' | 'tablet' | 'pos' | 'phone';
-/**
- * PisellGroupView 组件 Props
- * @template T - 数据项类型
- * @description
- * 通用、数据无关的「分组展示容器」：先按 `groupBy` 将 `dataSource` 分组，
- * 再为每个分组渲染头部 / 统计 / 主体 / 操作四块，各块均可由外部自定义渲染。
- */
-export interface PisellGroupViewProps<T = unknown> {
-    /** 数据源（应为外部已映射好的列表） */
-    dataSource: T[];
-    /**
-     * 分组规则
-     * @description
-     * - `string`：单字段路径，支持 `'a.b.c'` 点路径
-     * - `string[]`：多字段组合（如 `['productId', 'time']`）
-     * - `(item, index) => GroupKey | GroupKey[]`：完全自定义
-     */
-    groupBy: string | string[] | ((item: T, index: number) => GroupKey | GroupKey[]);
-    /** 自定义分组 id 生成，默认各键以 `|` 拼接 */
-    getGroupId?: (keys: GroupKey[]) => string;
-    /** 分组之间的排序；不传保持首次出现顺序 */
-    sortGroups?: (a: GroupModel<T>, b: GroupModel<T>) => number;
-    /** 分组内数据项的排序；不传保持原始相对顺序 */
-    sortItems?: (a: T, b: T) => number;
-    /** ① 头部：分组条件对应的相同信息（时间、商品名、客户等） */
-    renderHeader?: (group: GroupModel<T>) => ReactNode;
-    /** ② 统计栏：可自定义展示，数据来源于分组后的数据 */
-    renderStats?: (group: GroupModel<T>) => ReactNode;
-    /** ③ 主体：渲染分组内的单条数据为卡片 */
-    renderItem?: (item: T, ctx: ItemContext<T>) => ReactNode;
-    /** ④ 操作区：批量操作（加时、编辑等） */
-    renderActions?: (group: GroupModel<T>) => ReactNode;
-    /**
-     * 主体布局
-     * @default 'stack'
-     */
-    itemLayout?: ItemLayout;
-    /**
-     * 自定义主体容器
-     * @param group - 当前分组
-     * @param defaultBody - 组件按 `itemLayout` + `renderItem` 渲染出的默认主体
-     */
-    renderBody?: (group: GroupModel<T>, defaultBody: ReactNode) => ReactNode;
-    /**
-     * 自定义整组容器
-     * @param group - 当前分组
-     * @param blocks - 四块默认内容（header/stats/body/actions）
-     * @description 提供后将完全接管单个分组的结构，调用方可自由编排四块顺序与包裹
-     */
-    renderGroup?: (group: GroupModel<T>, blocks: GroupBlocks) => ReactNode;
-    /** 数据源为空时的渲染 */
-    renderEmpty?: () => ReactNode;
-    /**
-     * 主体内单条卡片的 key
-     * @description 不传时使用 index（仅在列表无增删改时安全）
-     */
-    rowKey?: string | ((item: T, index: number) => string);
-    /** 多端 variant，仅追加根节点 class */
-    variant?: GroupViewVariant;
-    /** 自定义类名 */
-    className?: string;
-    /** 自定义样式 */
-    style?: CSSProperties;
-}

package/es/components/PisellGroupView/utils/index.d.ts

@@ -1,20 +0,0 @@
-import type { PisellGroupViewProps } from '../types';
-/**
- * 组件样式前缀
- */
-export declare const COMPONENT_PREFIX = "pisell-group-view";
-/**
- * 解析参与分组的字段名列表
- * @param groupBy - 组件的 groupBy 配置
- * @returns 字段名数组；自定义函数分组时返回空数组
- * @description 用于透传给 `renderItem`，让调用方据此省略头部已展示的字段
- */
-export declare const getGroupFieldNames: <T>(groupBy: string | string[] | ((item: T, index: number) => any)) => string[];
-/**
- * 获取主体内单条数据的稳定 key
- * @param item - 数据项
- * @param index - 索引
- * @param rowKey - rowKey 配置
- * @returns key 字符串
- */
-export declare const resolveItemKey: <T>(item: T, index: number, rowKey?: string | ((item: T, index: number) => string) | undefined) => string;