@pisell/materials 6.3.25 → 6.3.27

package/lib/components/pisellEmail/utils/emailHelper.js

@@ -0,0 +1,89 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellEmail/utils/emailHelper.ts
+var emailHelper_exports = {};
+__export(emailHelper_exports, {
+  extractEmailDomain: () => extractEmailDomain,
+  extractEmailLocal: () => extractEmailLocal,
+  handleEmailClick: () => handleEmailClick,
+  hideEmailDomain: () => hideEmailDomain,
+  maskEmailDomain: () => maskEmailDomain,
+  normalizeEmail: () => normalizeEmail
+});
+module.exports = __toCommonJS(emailHelper_exports);
+function extractEmailDomain(email) {
+  const parts = email.split("@");
+  return parts.length === 2 ? parts[1] : "";
+}
+function extractEmailLocal(email) {
+  const parts = email.split("@");
+  return parts.length >= 1 ? parts[0] : "";
+}
+function normalizeEmail(email) {
+  return email.trim().toLowerCase();
+}
+function hideEmailDomain(email) {
+  if (!email || !email.includes("@")) {
+    return email;
+  }
+  const [localPart, domainPart] = email.split("@");
+  if (!localPart || !domainPart) {
+    return email;
+  }
+  const visibleChars = Math.min(1, localPart.length);
+  const maskedLocal = localPart.substring(0, visibleChars) + "***";
+  return `${maskedLocal}@${domainPart}`;
+}
+function maskEmailDomain(email) {
+  if (!email || !email.includes("@")) {
+    return email;
+  }
+  const [localPart] = email.split("@");
+  return `${localPart}@***`;
+}
+function handleEmailClick(email, options) {
+  if (!email) return;
+  let mailtoUrl = `mailto:${email}`;
+  const params = [];
+  if (options == null ? void 0 : options.subject) {
+    params.push(`subject=${encodeURIComponent(options.subject)}`);
+  }
+  if (options == null ? void 0 : options.body) {
+    params.push(`body=${encodeURIComponent(options.body)}`);
+  }
+  if (options == null ? void 0 : options.cc) {
+    params.push(`cc=${encodeURIComponent(options.cc)}`);
+  }
+  if (options == null ? void 0 : options.bcc) {
+    params.push(`bcc=${encodeURIComponent(options.bcc)}`);
+  }
+  if (params.length > 0) {
+    mailtoUrl += "?" + params.join("&");
+  }
+  window.location.href = mailtoUrl;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  extractEmailDomain,
+  extractEmailLocal,
+  handleEmailClick,
+  hideEmailDomain,
+  maskEmailDomain,
+  normalizeEmail
+});

package/lib/components/pisellEmail/utils/emailValidator.d.ts

@@ -0,0 +1,45 @@
+/**
+ * 邮箱校验工具函数
+ */
+/**
+ * 标准邮箱格式校验
+ * @param email 邮箱地址
+ * @returns 是否通过校验
+ *
+ * @example
+ * validateEmail('user@example.com') // true
+ * validateEmail('invalid-email') // false
+ */
+export declare function validateEmail(email: string): boolean;
+/**
+ * 严格邮箱格式校验（RFC 5322）
+ * @param email 邮箱地址
+ * @returns 是否通过校验
+ *
+ * @example
+ * validateEmailStrict('user@example.com') // true
+ */
+export declare function validateEmailStrict(email: string): boolean;
+/**
+ * 邮箱分部校验
+ * 检查邮箱的各个部分是否符合规范
+ *
+ * @param email 邮箱地址
+ * @returns 校验结果
+ */
+export declare function validateEmailParts(email: string): {
+    isValid: boolean;
+    errors: string[];
+};
+/**
+ * 域名白名单/黑名单校验
+ *
+ * @param email 邮箱地址
+ * @param allowedDomains 白名单域名列表
+ * @param blockedDomains 黑名单域名列表
+ * @returns 校验结果
+ */
+export declare function validateEmailDomain(email: string, allowedDomains?: string[], blockedDomains?: string[]): {
+    isValid: boolean;
+    errors: string[];
+};

package/lib/components/pisellEmail/utils/emailValidator.js

@@ -0,0 +1,97 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellEmail/utils/emailValidator.ts
+var emailValidator_exports = {};
+__export(emailValidator_exports, {
+  validateEmail: () => validateEmail,
+  validateEmailDomain: () => validateEmailDomain,
+  validateEmailParts: () => validateEmailParts,
+  validateEmailStrict: () => validateEmailStrict
+});
+module.exports = __toCommonJS(emailValidator_exports);
+var import_emailRegex = require("../constants/emailRegex");
+var import_emailHelper = require("./emailHelper");
+function validateEmail(email) {
+  if (!email) return true;
+  return import_emailRegex.EMAIL_REGEX.test(email);
+}
+function validateEmailStrict(email) {
+  if (!email) return true;
+  return import_emailRegex.STRICT_EMAIL_REGEX.test(email);
+}
+function validateEmailParts(email) {
+  const errors = [];
+  if (!email.includes("@")) {
+    errors.push("邮箱地址必须包含 @ 符号");
+    return { isValid: false, errors };
+  }
+  const [localPart, domainPart] = email.split("@");
+  if (!localPart || localPart.length === 0) {
+    errors.push("@ 符号前不能为空");
+  }
+  if (localPart.length > 64) {
+    errors.push("@ 符号前最多 64 个字符");
+  }
+  if (!domainPart || domainPart.length === 0) {
+    errors.push("@ 符号后不能为空");
+  }
+  if (!domainPart.includes(".")) {
+    errors.push("域名必须包含 . 符号");
+  }
+  if (domainPart.endsWith(".")) {
+    errors.push("域名不能以 . 结尾");
+  }
+  const parts = domainPart.split(".");
+  const tld = parts[parts.length - 1];
+  if (tld && tld.length < 2) {
+    errors.push("顶级域名至少 2 个字符");
+  }
+  return {
+    isValid: errors.length === 0,
+    errors
+  };
+}
+function validateEmailDomain(email, allowedDomains, blockedDomains) {
+  const errors = [];
+  const domain = (0, import_emailHelper.extractEmailDomain)(email);
+  if (!domain) {
+    return { isValid: true, errors };
+  }
+  if (allowedDomains && allowedDomains.length > 0) {
+    if (!allowedDomains.includes(domain)) {
+      errors.push(`只允许以下域名：${allowedDomains.join(", ")}`);
+    }
+  }
+  if (blockedDomains && blockedDomains.length > 0) {
+    if (blockedDomains.includes(domain)) {
+      errors.push("该邮箱域名不可用");
+    }
+  }
+  return {
+    isValid: errors.length === 0,
+    errors
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  validateEmail,
+  validateEmailDomain,
+  validateEmailParts,
+  validateEmailStrict
+});

package/lib/components/pisellEmail/utils/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * PisellEmail 工具函数导出
+ */
+export * from './emailValidator';
+export * from './emailHelper';
+export * from './domainSuggestions';

package/lib/components/pisellEmail/utils/index.js

@@ -0,0 +1,27 @@
+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 __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellEmail/utils/index.ts
+var utils_exports = {};
+module.exports = __toCommonJS(utils_exports);
+__reExport(utils_exports, require("./emailValidator"), module.exports);
+__reExport(utils_exports, require("./emailHelper"), module.exports);
+__reExport(utils_exports, require("./domainSuggestions"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./emailValidator"),
+  ...require("./emailHelper"),
+  ...require("./domainSuggestions")
+});

package/lib/components/pisellFind/PisellFind.stories.d.ts

@@ -0,0 +1,45 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { PisellFind } from './index';
+/**
+ * PisellFind 组件 Storybook
+ * 基于 PisellLookup 的组件内查找优化版本
+ */
+declare const meta: Meta<typeof PisellFind>;
+export default meta;
+declare type Story = StoryObj<typeof PisellFind>;
+/**
+ * 基础示例 - 列表查找
+ */
+export declare const Basic: Story;
+/**
+ * 表格查找
+ */
+export declare const TableFind: Story;
+/**
+ * Input 模式查找
+ */
+export declare const InputMode: Story;
+/**
+ * 使用 Ref 控制
+ */
+export declare const WithRef: Story;
+/**
+ * 显示确认按钮
+ */
+export declare const WithConfirmButton: Story;
+/**
+ * 关闭历史记录
+ */
+export declare const NoHistory: Story;
+/**
+ * 多字段搜索
+ */
+export declare const MultiFieldSearch: Story;
+/**
+ * Drawer 模式
+ */
+export declare const DrawerMode: Story;
+/**
+ * Playground - 自由配置
+ */
+export declare const Playground: Story;

package/lib/components/pisellFind/PisellFind.stories.js

@@ -0,0 +1,343 @@
+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/pisellFind/PisellFind.stories.tsx
+var PisellFind_stories_exports = {};
+__export(PisellFind_stories_exports, {
+  Basic: () => Basic,
+  DrawerMode: () => DrawerMode,
+  InputMode: () => InputMode,
+  MultiFieldSearch: () => MultiFieldSearch,
+  NoHistory: () => NoHistory,
+  Playground: () => Playground,
+  TableFind: () => TableFind,
+  WithConfirmButton: () => WithConfirmButton,
+  WithRef: () => WithRef,
+  default: () => PisellFind_stories_default
+});
+module.exports = __toCommonJS(PisellFind_stories_exports);
+var import_react = __toESM(require("react"));
+var import_index = require("./index");
+var import_antd = require("antd");
+var meta = {
+  title: "Plus Components/PisellFind",
+  component: import_index.PisellFind,
+  parameters: {
+    layout: "padded",
+    docs: {
+      description: {
+        component: "基于 PisellLookup 的组件内查找组件，专门为已加载数据的查找场景优化。"
+      }
+    }
+  },
+  tags: ["autodocs"]
+};
+var PisellFind_stories_default = meta;
+var mockProducts = [
+  { id: 1, name: "iPhone 15 Pro", price: 7999, category: "手机", stock: 100 },
+  { id: 2, name: "iPhone 14", price: 5999, category: "手机", stock: 150 },
+  { id: 3, name: "MacBook Pro", price: 12999, category: "电脑", stock: 50 },
+  { id: 4, name: "MacBook Air", price: 7999, category: "电脑", stock: 80 },
+  { id: 5, name: "iPad Air", price: 4799, category: "平板", stock: 120 },
+  { id: 6, name: "iPad Pro", price: 6799, category: "平板", stock: 60 },
+  { id: 7, name: "AirPods Pro", price: 1899, category: "耳机", stock: 200 },
+  { id: 8, name: "Apple Watch", price: 2999, category: "手表", stock: 90 }
+];
+var Basic = {
+  render: () => {
+    const [filteredData, setFilteredData] = (0, import_react.useState)(mockProducts);
+    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react.default.createElement(
+      import_index.PisellFind,
+      {
+        onSearch: (keyword) => {
+          const filtered = mockProducts.filter(
+            (item) => item.name.toLowerCase().includes(keyword.toLowerCase())
+          );
+          setFilteredData(filtered);
+        }
+      }
+    )), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.List,
+      {
+        dataSource: filteredData,
+        renderItem: (item) => /* @__PURE__ */ import_react.default.createElement(import_antd.List.Item, null, /* @__PURE__ */ import_react.default.createElement(
+          import_antd.List.Item.Meta,
+          {
+            title: item.name,
+            description: /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(import_antd.Tag, { color: "blue" }, item.category), /* @__PURE__ */ import_react.default.createElement("span", { style: { color: "#ff4d4f", fontWeight: "bold" } }, "¥", item.price), /* @__PURE__ */ import_react.default.createElement("span", null, "库存: ", item.stock))
+          }
+        ))
+      }
+    ));
+  }
+};
+var TableFind = {
+  render: () => {
+    const [filteredData, setFilteredData] = (0, import_react.useState)(mockProducts);
+    const columns = [
+      { title: "商品名称", dataIndex: "name", key: "name" },
+      { title: "价格", dataIndex: "price", key: "price", render: (v) => `¥${v}` },
+      { title: "分类", dataIndex: "category", key: "category", render: (v) => /* @__PURE__ */ import_react.default.createElement(import_antd.Tag, null, v) },
+      { title: "库存", dataIndex: "stock", key: "stock" }
+    ];
+    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { style: { marginBottom: 16, display: "flex", justifyContent: "space-between", alignItems: "center" } }, /* @__PURE__ */ import_react.default.createElement("h3", null, "商品列表"), /* @__PURE__ */ import_react.default.createElement(
+      import_index.PisellFind,
+      {
+        onSearch: (keyword) => {
+          const filtered = mockProducts.filter(
+            (item) => item.name.toLowerCase().includes(keyword.toLowerCase())
+          );
+          setFilteredData(filtered);
+        }
+      }
+    )), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Table,
+      {
+        dataSource: filteredData,
+        columns,
+        pagination: { pageSize: 10 }
+      }
+    ));
+  }
+};
+var InputMode = {
+  render: () => {
+    const [filteredData, setFilteredData] = (0, import_react.useState)(mockProducts);
+    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react.default.createElement(
+      import_index.PisellFind,
+      {
+        triggerType: "input",
+        placeholder: "搜索商品名称",
+        onSearch: (keyword) => {
+          const filtered = mockProducts.filter(
+            (item) => item.name.toLowerCase().includes(keyword.toLowerCase())
+          );
+          setFilteredData(filtered);
+        }
+      }
+    )), /* @__PURE__ */ import_react.default.createElement("div", { style: { display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 16 } }, filteredData.map((item) => /* @__PURE__ */ import_react.default.createElement(import_antd.Card, { key: item.id, size: "small" }, /* @__PURE__ */ import_react.default.createElement("h4", null, item.name), /* @__PURE__ */ import_react.default.createElement("p", { style: { color: "#ff4d4f", fontWeight: "bold" } }, "¥", item.price), /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, /* @__PURE__ */ import_react.default.createElement(import_antd.Tag, null, item.category), /* @__PURE__ */ import_react.default.createElement("span", null, "库存: ", item.stock))))));
+  }
+};
+var WithRef = {
+  render: () => {
+    const [filteredData, setFilteredData] = (0, import_react.useState)(mockProducts);
+    const findRef = (0, import_react.useRef)(null);
+    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: () => {
+      var _a;
+      return (_a = findRef.current) == null ? void 0 : _a.open();
+    } }, "打开查找"), /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: () => {
+      var _a;
+      return (_a = findRef.current) == null ? void 0 : _a.close();
+    } }, "关闭查找"), /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: () => {
+      var _a;
+      return (_a = findRef.current) == null ? void 0 : _a.setKeyword("iPhone");
+    } }, "搜索 iPhone"), /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: () => {
+      var _a;
+      const keyword = (_a = findRef.current) == null ? void 0 : _a.getKeyword();
+      alert(`当前关键词: ${keyword}`);
+    } }, "获取关键词")), /* @__PURE__ */ import_react.default.createElement(
+      import_index.PisellFind,
+      {
+        ref: findRef,
+        onSearch: (keyword) => {
+          const filtered = mockProducts.filter(
+            (item) => item.name.toLowerCase().includes(keyword.toLowerCase())
+          );
+          setFilteredData(filtered);
+        }
+      }
+    ), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Table,
+      {
+        dataSource: filteredData,
+        columns: [
+          { title: "商品名称", dataIndex: "name" },
+          { title: "价格", dataIndex: "price", render: (v) => `¥${v}` }
+        ],
+        style: { marginTop: 16 }
+      }
+    ));
+  }
+};
+var WithConfirmButton = {
+  render: () => {
+    const [filteredData, setFilteredData] = (0, import_react.useState)(mockProducts);
+    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react.default.createElement(
+      import_index.PisellFind,
+      {
+        showConfirmButton: true,
+        confirmButtonText: "Search",
+        onSearch: (keyword) => {
+          const filtered = mockProducts.filter(
+            (item) => item.name.toLowerCase().includes(keyword.toLowerCase())
+          );
+          setFilteredData(filtered);
+        }
+      }
+    )), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.List,
+      {
+        dataSource: filteredData,
+        renderItem: (item) => /* @__PURE__ */ import_react.default.createElement(import_antd.List.Item, null, /* @__PURE__ */ import_react.default.createElement(
+          import_antd.List.Item.Meta,
+          {
+            title: item.name,
+            description: `¥${item.price}`
+          }
+        ))
+      }
+    ));
+  }
+};
+var NoHistory = {
+  render: () => {
+    const [filteredData, setFilteredData] = (0, import_react.useState)(mockProducts);
+    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react.default.createElement(
+      import_index.PisellFind,
+      {
+        showHistory: false,
+        onSearch: (keyword) => {
+          const filtered = mockProducts.filter(
+            (item) => item.name.toLowerCase().includes(keyword.toLowerCase())
+          );
+          setFilteredData(filtered);
+        }
+      }
+    )), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.List,
+      {
+        dataSource: filteredData,
+        renderItem: (item) => /* @__PURE__ */ import_react.default.createElement(import_antd.List.Item, null, item.name)
+      }
+    ));
+  }
+};
+var MultiFieldSearch = {
+  render: () => {
+    const [filteredData, setFilteredData] = (0, import_react.useState)(mockProducts);
+    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react.default.createElement(
+      import_index.PisellFind,
+      {
+        buttonText: "搜索商品",
+        onSearch: (keyword) => {
+          const kw = keyword.toLowerCase();
+          const filtered = mockProducts.filter(
+            (item) => item.name.toLowerCase().includes(kw) || item.category.toLowerCase().includes(kw)
+          );
+          setFilteredData(filtered);
+        }
+      }
+    ), /* @__PURE__ */ import_react.default.createElement("p", { style: { marginTop: 8, color: "#999", fontSize: 12 } }, "支持搜索商品名称和分类")), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Table,
+      {
+        dataSource: filteredData,
+        columns: [
+          { title: "商品名称", dataIndex: "name" },
+          { title: "价格", dataIndex: "price", render: (v) => `¥${v}` },
+          { title: "分类", dataIndex: "category", render: (v) => /* @__PURE__ */ import_react.default.createElement(import_antd.Tag, null, v) },
+          { title: "库存", dataIndex: "stock" }
+        ]
+      }
+    ));
+  }
+};
+var DrawerMode = {
+  render: () => {
+    const [filteredData, setFilteredData] = (0, import_react.useState)(mockProducts);
+    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react.default.createElement(
+      import_index.PisellFind,
+      {
+        displayType: "drawer",
+        drawerPlacement: "right",
+        onSearch: (keyword) => {
+          const filtered = mockProducts.filter(
+            (item) => item.name.toLowerCase().includes(keyword.toLowerCase())
+          );
+          setFilteredData(filtered);
+        }
+      }
+    )), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.List,
+      {
+        dataSource: filteredData,
+        renderItem: (item) => /* @__PURE__ */ import_react.default.createElement(import_antd.List.Item, null, /* @__PURE__ */ import_react.default.createElement(
+          import_antd.List.Item.Meta,
+          {
+            title: item.name,
+            description: `¥${item.price}`
+          }
+        ))
+      }
+    ));
+  }
+};
+var Playground = {
+  render: () => {
+    const [filteredData, setFilteredData] = (0, import_react.useState)(mockProducts);
+    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { style: { marginBottom: 16 } }, /* @__PURE__ */ import_react.default.createElement(
+      import_index.PisellFind,
+      {
+        triggerType: "button",
+        buttonText: "Find",
+        showConfirmButton: false,
+        showHistory: true,
+        maxHistoryCount: 10,
+        size: "middle",
+        disabled: false,
+        onSearch: (keyword) => {
+          const filtered = mockProducts.filter(
+            (item) => item.name.toLowerCase().includes(keyword.toLowerCase())
+          );
+          setFilteredData(filtered);
+        }
+      }
+    )), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Table,
+      {
+        dataSource: filteredData,
+        columns: [
+          { title: "商品名称", dataIndex: "name" },
+          { title: "价格", dataIndex: "price", render: (v) => `¥${v}` },
+          { title: "分类", dataIndex: "category", render: (v) => /* @__PURE__ */ import_react.default.createElement(import_antd.Tag, null, v) }
+        ]
+      }
+    ));
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Basic,
+  DrawerMode,
+  InputMode,
+  MultiFieldSearch,
+  NoHistory,
+  Playground,
+  TableFind,
+  WithConfirmButton,
+  WithRef
+});