@pisell/materials 6.3.25 → 6.3.27

package/lib/components/pisellMultipleSelect/components/EditView.js

@@ -0,0 +1,155 @@
+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/pisellMultipleSelect/components/EditView.tsx
+var EditView_exports = {};
+__export(EditView_exports, {
+  default: () => EditView_default
+});
+module.exports = __toCommonJS(EditView_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_icons = require("@ant-design/icons");
+var import_classnames = __toESM(require("classnames"));
+var import_utils = require("@pisell/utils");
+var EditView = (0, import_react.forwardRef)((props, ref) => {
+  const {
+    value = [],
+    options,
+    label,
+    helperText,
+    error,
+    errorText,
+    required,
+    placeholder = "请选择",
+    showSearch = false,
+    allowClear = false,
+    maxTagCount = 3,
+    showTooltipOnOverflow = true,
+    size = "middle",
+    className,
+    style,
+    onSearch,
+    filterOption,
+    onChangeInternal,
+    ...restProps
+  } = props;
+  const antdOptions = (0, import_react.useMemo)(
+    () => options.map((opt) => ({
+      label: opt.label,
+      value: opt.value,
+      disabled: opt.disabled
+    })),
+    [options]
+  );
+  const [searchKeyword, setSearchKeyword] = (0, import_react.useState)("");
+  const [, setSearchInput] = (0, import_utils.useDebouncedSearch)("", 300, (text) => {
+    onSearch == null ? void 0 : onSearch(text);
+  });
+  const handleSearchInput = (e) => {
+    const text = e.target.value;
+    setSearchKeyword(text);
+    setSearchInput(text);
+  };
+  const filteredAntdOptions = (0, import_react.useMemo)(() => {
+    if (!showSearch || !searchKeyword) return antdOptions;
+    if (filterOption) {
+      return antdOptions.filter((opt) => {
+        const selectOption = options.find((o) => o.value === opt.value);
+        return selectOption ? filterOption(searchKeyword, selectOption) : false;
+      });
+    }
+    return antdOptions.filter(
+      (opt) => opt.label.toLowerCase().includes(searchKeyword.toLowerCase())
+    );
+  }, [antdOptions, searchKeyword, showSearch, filterOption, options]);
+  const menuItemSelectedIcon = /* @__PURE__ */ import_react.default.createElement(import_icons.CheckOutlined, { style: { color: "#7F56D9", fontSize: 16 } });
+  const dropdownRender = (0, import_react.useCallback)(
+    (menu) => {
+      if (!showSearch) return menu;
+      return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-select-search-wrapper" }, /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Input,
+        {
+          placeholder: "Search",
+          prefix: /* @__PURE__ */ import_react.default.createElement(import_icons.SearchOutlined, { style: { color: "#98A2B3", fontSize: 16 } }),
+          value: searchKeyword,
+          onChange: handleSearchInput,
+          className: "pisell-select-search-input",
+          bordered: false,
+          autoFocus: true
+        }
+      )), menu);
+    },
+    [showSearch, searchKeyword, handleSearchInput]
+  );
+  const maxTagPlaceholder = (0, import_react.useCallback)(
+    (omittedValues) => {
+      if (!showTooltipOnOverflow) {
+        return /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-multiple-select-more-tag" }, "+", omittedValues.length);
+      }
+      const tooltipContent = omittedValues.map((v) => {
+        var _a;
+        return (_a = options.find((opt) => opt.value === v.value)) == null ? void 0 : _a.label;
+      }).filter(Boolean).join(", ");
+      return /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: tooltipContent }, /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-multiple-select-more-tag" }, "+", omittedValues.length));
+    },
+    [options, showTooltipOnOverflow]
+  );
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("pisell-multiple-select-wrapper", className), style }, label && /* @__PURE__ */ import_react.default.createElement(
+    "label",
+    {
+      className: (0, import_classnames.default)("pisell-multiple-select-label", {
+        "pisell-multiple-select-label-required": required
+      })
+    },
+    label
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Select,
+    {
+      ...restProps,
+      ref,
+      mode: "multiple",
+      value,
+      options: filteredAntdOptions,
+      placeholder,
+      showSearch: false,
+      allowClear,
+      menuItemSelectedIcon,
+      dropdownRender,
+      onChange: onChangeInternal,
+      maxTagCount,
+      maxTagPlaceholder,
+      size,
+      className: (0, import_classnames.default)("pisell-multiple-select", {
+        "pisell-multiple-select-error": error
+      })
+    }
+  ), helperText && !error && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-multiple-select-helper-text" }, helperText), error && errorText && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-multiple-select-error-text" }, errorText));
+});
+EditView.displayName = "PisellMultipleSelectEditView";
+var EditView_default = EditView;

package/lib/components/pisellMultipleSelect/components/ReadOnlyView.d.ts

@@ -0,0 +1,8 @@
+/**
+ * PisellMultipleSelect - ReadOnlyView (只读态视图)
+ * 只读状态下的渲染
+ */
+import React from 'react';
+import type { ReadOnlyViewProps } from '../types';
+declare const ReadOnlyView: React.FC<ReadOnlyViewProps>;
+export default ReadOnlyView;

package/lib/components/pisellMultipleSelect/components/ReadOnlyView.js

@@ -0,0 +1,80 @@
+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/pisellMultipleSelect/components/ReadOnlyView.tsx
+var ReadOnlyView_exports = {};
+__export(ReadOnlyView_exports, {
+  default: () => ReadOnlyView_default
+});
+module.exports = __toCommonJS(ReadOnlyView_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_classnames = __toESM(require("classnames"));
+var import_utils = require("@pisell/utils");
+var ReadOnlyView = (props) => {
+  const {
+    value = [],
+    options,
+    label,
+    required,
+    maxTagCount = 3,
+    className,
+    style
+  } = props;
+  const selectedOptions = (0, import_react.useMemo)(
+    () => (0, import_utils.findOptionsByValues)(value, options),
+    [value, options]
+  );
+  const tagDisplayInfo = (0, import_react.useMemo)(
+    () => (0, import_utils.calculateTagDisplay)(value, options, maxTagCount),
+    [value, options, maxTagCount]
+  );
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      className: (0, import_classnames.default)(
+        "pisell-multiple-select-wrapper",
+        "pisell-multiple-select-readonly",
+        className
+      ),
+      style
+    },
+    label && /* @__PURE__ */ import_react.default.createElement(
+      "label",
+      {
+        className: (0, import_classnames.default)("pisell-multiple-select-label", {
+          "pisell-multiple-select-label-required": required
+        })
+      },
+      label
+    ),
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-multiple-select-readonly-display" }, selectedOptions.length > 0 ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, tagDisplayInfo.visibleTags.map((option) => /* @__PURE__ */ import_react.default.createElement("span", { key: option.value, className: "pisell-multiple-select-readonly-tag" }, option.icon && /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-multiple-select-readonly-tag-icon" }, option.icon), option.label)), tagDisplayInfo.hiddenCount > 0 && /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: tagDisplayInfo.hiddenTags.map((t) => t.label).join(", ") }, /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-multiple-select-readonly-more-tag" }, "+", tagDisplayInfo.hiddenCount))) : /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-multiple-select-readonly-empty" }, "-"))
+  );
+};
+ReadOnlyView.displayName = "PisellMultipleSelectReadOnlyView";
+var ReadOnlyView_default = ReadOnlyView;

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

@@ -0,0 +1,6 @@
+/**
+ * PisellMultipleSelect 组件导出
+ */
+export { default as PisellMultipleSelect } from './PisellMultipleSelect';
+export type { PisellMultipleSelectProps, MultipleSelectRef, EditViewProps, DisabledViewProps, ReadOnlyViewProps, TagRendererProps, } from './types';
+export type { SelectOption, FilterOptionFunc, SortDirection, MultipleSelectState, TagDisplayInfo, } from './types';

package/lib/components/pisellMultipleSelect/index.js

@@ -0,0 +1,39 @@
+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/pisellMultipleSelect/index.tsx
+var pisellMultipleSelect_exports = {};
+__export(pisellMultipleSelect_exports, {
+  PisellMultipleSelect: () => import_PisellMultipleSelect.default
+});
+module.exports = __toCommonJS(pisellMultipleSelect_exports);
+var import_PisellMultipleSelect = __toESM(require("./PisellMultipleSelect"));
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  PisellMultipleSelect
+});

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

@@ -0,0 +1,160 @@
+import type { BaseSelectProps, SelectOption } from '@pisell/utils';
+/**
+ * PisellMultipleSelect 组件 Props 类型定义
+ *
+ * 继承 BaseSelectProps，添加多选特有的配置
+ * @template T 选项值的类型，默认为 string | number
+ */
+export interface PisellMultipleSelectProps<T = string | number> extends BaseSelectProps<T> {
+    /**
+     * 受控模式：当前选中值数组
+     */
+    value?: T[];
+    /**
+     * 非受控模式：默认选中值数组
+     */
+    defaultValue?: T[];
+    /**
+     * 值变化回调
+     * @param value 新的选中值数组
+     * @param options 选中的选项对象数组
+     */
+    onChange?: (value: T[], options: SelectOption<T>[]) => void;
+    /**
+     * 最多显示的标签数量
+     * 超出部分会显示 "+N" 聚合标签
+     * @default 3
+     */
+    maxTagCount?: number;
+    /**
+     * 超出标签 hover 时是否显示 Tooltip
+     * @default true
+     */
+    showTooltipOnOverflow?: boolean;
+    /**
+     * 最大可选数量
+     * 达到上限时阻止继续选择
+     * @default undefined（无限制）
+     */
+    maxCount?: number;
+    /**
+     * 取消选中某项时触发
+     * @param value 被取消选中的值
+     * @param option 被取消选中的选项对象
+     */
+    onDeselect?: (value: T, option: SelectOption<T>) => void;
+    /**
+     * ARIA 标签
+     */
+    'aria-label'?: string;
+    /**
+     * ARIA 是否必填
+     */
+    'aria-required'?: boolean;
+    /**
+     * ARIA 是否无效
+     */
+    'aria-invalid'?: boolean;
+    /**
+     * ARIA 描述关联 ID
+     */
+    'aria-describedby'?: string;
+    /**
+     * ARIA 多选标识
+     * @default true
+     */
+    'aria-multiselectable'?: boolean;
+}
+/**
+ * PisellMultipleSelect 组件 Ref 方法
+ * @template T 选项值的类型
+ */
+export interface MultipleSelectRef<T = string | number> {
+    /**
+     * 聚焦到组件
+     */
+    focus: () => void;
+    /**
+     * 失焦
+     */
+    blur: () => void;
+    /**
+     * 获取当前选中值数组
+     */
+    getValue: () => T[];
+    /**
+     * 设置选中值数组
+     */
+    setValue: (value: T[]) => void;
+    /**
+     * 清空所有选中值
+     */
+    clearValue: () => void;
+    /**
+     * 添加一个选中值
+     */
+    addValue: (value: T) => void;
+    /**
+     * 移除一个选中值
+     */
+    removeValue: (value: T) => void;
+}
+/**
+ * EditView 组件 Props
+ * @template T 选项值的类型
+ */
+export interface EditViewProps<T = string | number> extends PisellMultipleSelectProps<T> {
+    /**
+     * 内部状态管理对象（从 useSelectState Hook 传入）
+     */
+    state?: {
+        value: T[];
+        setValue: (value: T[]) => void;
+        addValue: (value: T) => void;
+        removeValue: (value: T) => void;
+        clearValue: () => void;
+    };
+    /**
+     * 内部 onChange 处理（包含 maxCount 限制等逻辑）
+     */
+    onChangeInternal?: (value: T[]) => void;
+}
+/**
+ * DisabledView 组件 Props
+ * @template T 选项值的类型
+ */
+export interface DisabledViewProps<T = string | number> extends PisellMultipleSelectProps<T> {
+}
+/**
+ * ReadOnlyView 组件 Props
+ * @template T 选项值的类型
+ */
+export interface ReadOnlyViewProps<T = string | number> extends PisellMultipleSelectProps<T> {
+}
+/**
+ * TagRenderer 组件 Props（可选，用于自定义标签渲染）
+ * @template T 选项值的类型
+ */
+export interface TagRendererProps<T = string | number> {
+    /**
+     * 当前选中值数组
+     */
+    value: T[];
+    /**
+     * 所有选项列表
+     */
+    options: SelectOption<T>[];
+    /**
+     * 最多显示的标签数量
+     */
+    maxTagCount: number;
+    /**
+     * 是否显示 Tooltip
+     */
+    showTooltip: boolean;
+    /**
+     * 移除标签回调
+     */
+    onRemove?: (value: T) => void;
+}
+export type { SelectOption, FilterOptionFunc, SortDirection, MultipleSelectState, TagDisplayInfo, } from '@pisell/utils';

package/lib/components/pisellMultipleSelect/types.js

@@ -0,0 +1,17 @@
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellMultipleSelect/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/lib/components/pisellNumber/PisellNumber.d.ts

@@ -0,0 +1,42 @@
+import React from 'react';
+import type { PisellNumberProps } from './types';
+import './PisellNumber.less';
+/**
+ * PisellNumber 数值组件
+ *
+ * 通用的数值输入/展示组件，支持只读、编辑、禁用三种状态。
+ * 基于 Ant Design InputNumber 组件开发，提供完整的校验框架。
+ *
+ * @param props 组件 Props
+ *
+ * @example
+ * // 受控模式
+ * const [value, setValue] = useState(0);
+ * <PisellNumber
+ *   value={value}
+ *   onChange={setValue}
+ *   min={0}
+ *   max={100}
+ * />
+ *
+ * @example
+ * // 非受控模式
+ * <PisellNumber
+ *   defaultValue={10}
+ *   min={0}
+ *   max={999}
+ *   step={10}
+ * />
+ *
+ * @example
+ * // 只读态
+ * <PisellNumber
+ *   mode="read"
+ *   value={1234.567}
+ *   precision={2}
+ *   useGrouping
+ * />
+ */
+export declare const PisellNumber: React.FC<PisellNumberProps>;
+declare const MemoizedPisellNumber: React.NamedExoticComponent<PisellNumberProps>;
+export default MemoizedPisellNumber;

package/lib/components/pisellNumber/PisellNumber.js

@@ -0,0 +1,63 @@
+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/pisellNumber/PisellNumber.tsx
+var PisellNumber_exports = {};
+__export(PisellNumber_exports, {
+  PisellNumber: () => PisellNumber,
+  default: () => PisellNumber_default
+});
+module.exports = __toCommonJS(PisellNumber_exports);
+var import_react = __toESM(require("react"));
+var import_utils = require("@pisell/utils");
+var import_ReadOnlyView = __toESM(require("./components/ReadOnlyView"));
+var import_EditView = __toESM(require("./components/EditView"));
+var import_DisabledView = __toESM(require("./components/DisabledView"));
+var import_PisellNumber = require("./PisellNumber.less");
+var PisellNumber = (props) => {
+  const { mode = "edit", disabled = false } = props;
+  const displayState = (0, import_utils.getDisplayState)(mode, disabled);
+  switch (displayState) {
+    case "read":
+      return /* @__PURE__ */ import_react.default.createElement(import_ReadOnlyView.default, { ...props });
+    case "edit":
+      return /* @__PURE__ */ import_react.default.createElement(import_EditView.default, { ...props });
+    case "disabled":
+      return /* @__PURE__ */ import_react.default.createElement(import_DisabledView.default, { ...props });
+    default:
+      return null;
+  }
+};
+var MemoizedPisellNumber = import_react.default.memo(PisellNumber, (prevProps, nextProps) => {
+  return prevProps.value === nextProps.value && prevProps.mode === nextProps.mode && prevProps.disabled === nextProps.disabled;
+});
+var PisellNumber_default = MemoizedPisellNumber;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  PisellNumber
+});

package/lib/components/pisellNumber/PisellNumber.less

@@ -0,0 +1,30 @@
+// PisellNumber 组件样式
+
+.pisell-number {
+  // 基础样式
+  display: inline-block;
+
+  // 只读态样式
+  &-read {
+    color: rgba(0, 0, 0, 0.85);
+    line-height: 1.5715;
+  }
+
+  // 编辑态样式
+  &-edit {
+    position: relative;
+
+    // 错误提示
+    .pisell-number-error {
+      margin-top: 4px;
+      color: #ff4d4f;
+      font-size: 14px;
+      line-height: 1.5;
+    }
+  }
+
+  // 禁用态样式
+  &-disabled {
+    // 继承 Ant Design InputNumber 的禁用样式
+  }
+}

package/lib/components/pisellNumber/PisellNumber.stories.d.ts

@@ -0,0 +1,66 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { PisellNumber } from './PisellNumber';
+/**
+ * PisellNumber 组件 Storybook
+ *
+ * 用于展示和测试组件的各种状态和配置
+ */
+declare const meta: Meta<typeof PisellNumber>;
+export default meta;
+declare type Story = StoryObj<typeof PisellNumber>;
+/**
+ * 基础示例 - 编辑态
+ */
+export declare const Basic: Story;
+/**
+ * 只读态展示
+ */
+export declare const ReadOnly: Story;
+/**
+ * 禁用态
+ */
+export declare const Disabled: Story;
+/**
+ * 带范围限制
+ */
+export declare const WithRange: Story;
+/**
+ * 带精度控制
+ */
+export declare const WithPrecision: Story;
+/**
+ * 千分位分隔符
+ */
+export declare const WithGrouping: Story;
+/**
+ * 带前后缀
+ */
+export declare const WithAddon: Story;
+/**
+ * 带校验 - 必填
+ */
+export declare const WithValidationRequired: Story;
+/**
+ * 带校验 - 范围校验
+ */
+export declare const WithValidationRange: Story;
+/**
+ * 带校验 - 自定义校验
+ */
+export declare const WithCustomValidation: Story;
+/**
+ * 不同尺寸
+ */
+export declare const Sizes: Story;
+/**
+ * 只读态样式配置
+ */
+export declare const ReadOnlyStyles: Story;
+/**
+ * 表单场景
+ */
+export declare const InForm: Story;
+/**
+ * 空值处理
+ */
+export declare const EmptyValue: Story;