@pisell/materials 1.8.12 → 1.8.13

package/es/components/pisellLookup/PisellLookup.stories.d.ts

@@ -0,0 +1,129 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { PisellLookup } from './PisellLookup';
+/**
+ * PisellLookup 组件 Storybook
+ * 搜索交互协议组件，提供统一的搜索入口、状态管理和结果承载能力
+ */
+declare const meta: Meta<typeof PisellLookup>;
+export default meta;
+declare type Story = StoryObj<typeof PisellLookup>;
+/**
+ * 基础示例 - Input 触发器 + Inline 展示
+ */
+export declare const Basic: Story;
+/**
+ * Input 触发器 - 默认尺寸（Middle）
+ */
+export declare const InputTriggerMiddle: Story;
+/**
+ * Input 触发器 - 大号尺寸
+ */
+export declare const InputTriggerLarge: Story;
+/**
+ * Button 触发器 + Modal 展示
+ */
+export declare const ButtonTrigger: Story;
+/**
+ * Icon 触发器 + Modal 展示
+ */
+export declare const IconTrigger: Story;
+/**
+ * Text 触发器 + Modal 展示
+ */
+export declare const TextTrigger: Story;
+/**
+ * 自定义触发器 + Modal 展示
+ */
+export declare const CustomTrigger: Story;
+/**
+ * Drawer 展示模式
+ */
+export declare const DrawerDisplay: Story;
+/**
+ * 搜索历史功能
+ */
+export declare const WithSearchHistory: Story;
+/**
+ * 联想词功能
+ */
+export declare const WithSuggestions: Story;
+/**
+ * 热门搜索功能
+ */
+export declare const WithHotWords: Story;
+/**
+ * 完整功能 - 历史 + 联想词 + 热门搜索
+ */
+export declare const FullFeatures: Story;
+/**
+ * 实时搜索模式
+ */
+export declare const RealtimeSearch: Story;
+/**
+ * 确认触发模式
+ */
+export declare const ConfirmSearch: Story;
+/**
+ * 受控模式示例
+ */
+export declare const Controlled: Story;
+/**
+ * 加载状态
+ */
+export declare const Loading: Story;
+/**
+ * 禁用状态
+ */
+export declare const Disabled: Story;
+/**
+ * Modal 自定义宽度
+ */
+export declare const ModalCustomWidth: Story;
+/**
+ * Modal 显示遮罩层
+ */
+export declare const ModalWithMask: Story;
+/**
+ * Modal 挂载到容器并使用 100% 宽度
+ */
+export declare const ModalFullWidth: Story;
+/**
+ * Drawer 不同方向
+ */
+export declare const DrawerPlacements: Story;
+/**
+ * 自定义空状态
+ */
+export declare const CustomEmpty: Story;
+/**
+ * 移动端场景
+ */
+export declare const MobileScenario: Story;
+/**
+ * 保留搜索内容（默认行为）
+ */
+export declare const PreserveKeyword: Story;
+/**
+ * 关闭时清空内容
+ */
+export declare const ClearOnClose: Story;
+/**
+ * 隐藏 Lookup 按钮（输入即搜索）
+ */
+export declare const NoConfirmButton: Story;
+/**
+ * 监听打开和关闭事件
+ */
+export declare const WithOpenCloseEvents: Story;
+/**
+ * 使用 Ref 控制
+ */
+export declare const WithRef: Story;
+/**
+ * 仅触发搜索（不展示结果）
+ */
+export declare const OnlyTriggerSearch: Story;
+/**
+ * Playground - 自由配置
+ */
+export declare const Playground: Story;

package/es/components/pisellLookup/components/HotWords.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { HotWordsProps } from '../types';
+/**
+ * HotWords 组件
+ * 展示热门搜索
+ */
+export declare const HotWords: React.FC<HotWordsProps>;

package/es/components/pisellLookup/components/LookupAuxiliary.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { LookupAuxiliaryProps } from '../types';
+/**
+ * LookupAuxiliary 组件
+ * 辅助信息层：搜索历史、联想词、热门搜索
+ */
+export declare const LookupAuxiliary: React.FC<LookupAuxiliaryProps>;

package/es/components/pisellLookup/components/LookupResultHost.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { LookupResultHostProps } from '../types';
+/**
+ * LookupResultHost 组件
+ * 结果承载层：根据展示类型渲染不同的容器
+ */
+export declare const LookupResultHost: React.FC<LookupResultHostProps>;

package/es/components/pisellLookup/components/LookupTrigger.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import type { LookupTriggerProps, LookupTriggerRef } from '../types';
+export declare const LookupTrigger: React.ForwardRefExoticComponent<LookupTriggerProps & React.RefAttributes<LookupTriggerRef>>;

package/es/components/pisellLookup/components/LookupTrigger.js

@@ -114,9 +114,8 @@ var LookupTriggerComponent = /*#__PURE__*/forwardRef(function (props, ref) {
    */
   var getAppScanBarcodePlugin = function getAppScanBarcodePlugin() {
     if (getApp) {
-      var _app$getPlugin;
       var app = getApp();
-      var scanBarcode = app === null || app === void 0 || (_app$getPlugin = app.getPlugin('scan')) === null || _app$getPlugin === void 0 ? void 0 : _app$getPlugin.scanBarcode;
+      var scanBarcode = app === null || app === void 0 ? void 0 : app.getPlugin('webScan');
       if (scanBarcode) {
         return scanBarcode;
       }
@@ -134,19 +133,23 @@ var LookupTriggerComponent = /*#__PURE__*/forwardRef(function (props, ref) {
     var app = getApp();
     try {
       var scanBarcode = getAppScanBarcodePlugin();
-      scanBarcode({
-        hint: 17
+      scanBarcode.scan({
+        type: "capacitor",
+        params: {
+          hint: 17
+        }
       }).then(function (res) {
-        return onScan === null || onScan === void 0 ? void 0 : onScan(res === null || res === void 0 ? void 0 : res.ScanResult);
-      }).catch(function (err) {
-        app.logger.addLog({
-          type: 'info',
-          title: '扫码失败',
-          metadata: {
-            err: err
-          }
-        });
+        onScan === null || onScan === void 0 || onScan(res);
       });
+      // scanBarcode({ hint: 17 })
+      //   .then((res: { ScanResult: string }) => onScan?.(res?.ScanResult))
+      //   .catch((err: any) => {
+      //     app.logger.addLog({
+      //       type: 'info',
+      //       title: '扫码失败',
+      //       metadata: { err },
+      //     });
+      //   });
     } catch (err) {
       app.logger.addLog({
         type: 'error',
@@ -195,11 +198,13 @@ var LookupTriggerComponent = /*#__PURE__*/forwardRef(function (props, ref) {
   };
 
   /**
-   * 处理按 Enter 键
+   * 处理按 Enter 键：传入当前输入值，避免受控模式下 state 未更新导致历史未保存
    */
   var handleKeyPress = function handleKeyPress(e) {
     if (e.key === 'Enter') {
-      onConfirm === null || onConfirm === void 0 || onConfirm();
+      var _ref2, _e$currentTarget$valu, _e$currentTarget;
+      var currentValue = (_ref2 = (_e$currentTarget$valu = (_e$currentTarget = e.currentTarget) === null || _e$currentTarget === void 0 ? void 0 : _e$currentTarget.value) !== null && _e$currentTarget$valu !== void 0 ? _e$currentTarget$valu : value) !== null && _ref2 !== void 0 ? _ref2 : '';
+      onConfirm === null || onConfirm === void 0 || onConfirm(currentValue);
     }
   };
 
@@ -230,7 +235,7 @@ var LookupTriggerComponent = /*#__PURE__*/forwardRef(function (props, ref) {
       onClick: handleConfirm,
       className: "pisell-lookup-input-confirm"
     }, confirmButtonText));
-    return /*#__PURE__*/React.createElement(Input, {
+    var inputEl = /*#__PURE__*/React.createElement(Input, {
       ref: inputRef,
       value: value,
       onChange: handleChange,
@@ -243,9 +248,17 @@ var LookupTriggerComponent = /*#__PURE__*/forwardRef(function (props, ref) {
       prefix: prefix,
       suffix: suffix,
       autoFocus: autoFocus,
-      className: "pisell-lookup-trigger-input ".concat(className || ''),
+      className: "pisell-lookup-trigger-input ".concat(className || '').trim(),
       style: style
     });
+
+    // 无 Lookup 按钮时用带 class 的包裹层，确保 DOM 上一定有 pisell-lookup-trigger-input-no-confirm；同时保留 pisell-lookup-trigger-input 以便 modal 下 .pisell-lookup-search-area-with-close .pisell-lookup-trigger-input { flex: 1 } 能命中
+    if (!showConfirmButton) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "pisell-lookup-trigger-input pisell-lookup-trigger-input-no-confirm"
+      }, inputEl);
+    }
+    return inputEl;
   };
 
   /**

package/es/components/pisellLookup/components/SearchHistory.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { SearchHistoryProps } from '../types';
+/**
+ * SearchHistory 组件
+ * 展示搜索历史记录
+ */
+export declare const SearchHistory: React.FC<SearchHistoryProps>;

package/es/components/pisellLookup/components/SuggestWords.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { SuggestWordsProps } from '../types';
+/**
+ * SuggestWords 组件
+ * 展示搜索联想词
+ */
+export declare const SuggestWords: React.FC<SuggestWordsProps>;

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

@@ -0,0 +1,9 @@
+/**
+ * 子组件统一导出
+ */
+export { SearchHistory } from './SearchHistory';
+export { SuggestWords } from './SuggestWords';
+export { HotWords } from './HotWords';
+export { LookupAuxiliary } from './LookupAuxiliary';
+export { LookupTrigger } from './LookupTrigger';
+export { LookupResultHost } from './LookupResultHost';

package/es/components/pisellLookup/hooks/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * 自定义 Hooks 统一导出
+ */
+export * from './useSearchState';
+export * from './useSearchHistory';
+export * from './useDebounceSearch';

package/es/components/pisellLookup/hooks/useDebounceSearch.d.ts

@@ -0,0 +1,40 @@
+/**
+ * 防抖搜索 Hook
+ */
+export interface UseDebounceSearchOptions {
+    /**
+     * 关键词
+     */
+    keyword: string;
+    /**
+     * 防抖时间（毫秒）
+     */
+    debounceTime: number;
+    /**
+     * 搜索触发回调
+     */
+    onSearch?: (keyword: string) => void;
+    /**
+     * 是否启用防抖
+     */
+    enabled?: boolean;
+    /**
+     * 上次搜索的关键词（用于去重）
+     */
+    lastSearchKeyword?: string;
+    /**
+     * 是否跳过防抖触发（用于手动选择场景）
+     */
+    skipDebounce?: boolean;
+}
+export interface UseDebounceSearchResult {
+    /**
+     * 防抖后的关键词
+     */
+    debouncedKeyword: string;
+}
+/**
+ * 防抖搜索 Hook
+ * 用于实时搜索模式的防抖处理
+ */
+export declare const useDebounceSearch: (options: UseDebounceSearchOptions) => UseDebounceSearchResult;

package/es/components/pisellLookup/hooks/useSearchHistory.d.ts

@@ -0,0 +1,48 @@
+/**
+ * 搜索历史管理 Hook
+ */
+export interface UseSearchHistoryOptions {
+    /**
+     * 存储 key
+     */
+    historyKey: string;
+    /**
+     * 最大历史记录数量
+     */
+    maxHistoryCount: number;
+    /**
+     * 自定义加载历史记录函数
+     */
+    onLoadHistory?: () => string[];
+    /**
+     * 自定义保存历史记录函数
+     */
+    onSaveHistory?: (history: string[]) => void;
+}
+export interface UseSearchHistoryResult {
+    /**
+     * 历史记录数组
+     */
+    history: string[];
+    /**
+     * 添加历史记录
+     */
+    addHistory: (keyword: string) => void;
+    /**
+     * 删除历史记录
+     */
+    removeHistory: (keyword: string) => void;
+    /**
+     * 清除全部历史记录
+     */
+    clearAllHistory: () => void;
+    /**
+     * 重新加载历史记录
+     */
+    reloadHistory: () => void;
+}
+/**
+ * 搜索历史管理 Hook
+ * 支持自定义存储逻辑
+ */
+export declare const useSearchHistory: (options: UseSearchHistoryOptions) => UseSearchHistoryResult;

package/es/components/pisellLookup/hooks/useSearchState.d.ts

@@ -0,0 +1,80 @@
+/**
+ * 搜索状态管理 Hook
+ */
+export interface UseSearchStateOptions {
+    /**
+     * 受控的关键词
+     */
+    value?: string;
+    /**
+     * 默认关键词
+     */
+    defaultValue?: string;
+    /**
+     * 受控的可见性
+     */
+    visible?: boolean;
+    /**
+     * 默认可见性
+     */
+    defaultVisible?: boolean;
+    /**
+     * 关键词变化回调
+     */
+    onChange?: (value: string) => void;
+    /**
+     * 可见性变化回调
+     */
+    onVisibleChange?: (visible: boolean) => void;
+    /**
+     * 打开回调
+     */
+    onOpen?: () => void;
+    /**
+     * 关闭回调
+     */
+    onClose?: () => void;
+}
+export interface UseSearchStateResult {
+    /**
+     * 当前关键词
+     */
+    keyword: string;
+    /**
+     * 设置关键词
+     */
+    setKeyword: (value: string) => void;
+    /**
+     * 是否可见
+     */
+    visible: boolean;
+    /**
+     * 设置可见性
+     */
+    setVisible: (visible: boolean) => void;
+    /**
+     * 打开
+     */
+    open: () => void;
+    /**
+     * 关闭
+     */
+    close: () => void;
+    /**
+     * 切换可见性
+     */
+    toggle: () => void;
+    /**
+     * 是否为受控的关键词
+     */
+    isControlledKeyword: boolean;
+    /**
+     * 是否为受控的可见性
+     */
+    isControlledVisible: boolean;
+}
+/**
+ * 搜索状态管理 Hook
+ * 支持受控和非受控模式
+ */
+export declare const useSearchState: (options: UseSearchStateOptions) => UseSearchStateResult;

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

@@ -0,0 +1,6 @@
+/**
+ * PisellLookup 组件导出
+ */
+export { PisellLookup } from './PisellLookup';
+export type { PisellLookupRef } from './types';
+export type * from './types';