@cloudtower/eagle 0.32.14 → 0.32.17

package/dist/stories/docs/core/Select.stories.d.ts

@@ -1,16 +1,97 @@
-import { Meta } from "@storybook/react";
-import React from "react";
-declare const meta: Meta;
-export default meta;
-export declare const Basic: {
-    (): React.JSX.Element;
-    story: {
-        name: string;
-        parameters: {
-            design: {
-                type: string;
-                url: string;
-            };
+import Select from "../../../src/core/Select";
+import type { StoryObj } from "@storybook/react";
+/**
+ * Select 组件是基于 antd Select 的封装，提供了更符合设计规范的样式和交互。
+ *
+ * ### 参数说明
+ *
+ * | 参数 | 说明 | 类型 | 默认值 |
+ * | --- | --- | --- | --- |
+ * | size | 选择器大小，large 用于表单场景，small 用于表格等紧凑场景 | 'large' \| 'middle' \| 'small' | 'middle' |
+ * | loading | 加载状态，显示加载中的动画效果 | boolean | false |
+ * | isLoadingValue | 是否正在加载选项值，用于异步加载选项时的加载状态 | boolean | false |
+ * | disabled | 是否禁用选择器，禁用后不可点击选择 | boolean | false |
+ * | mode | 设置选择模式，multiple 为多选，tags 为自由输入多选 | 'multiple' \| 'tags' | - |
+ * | showSearch | 是否可搜索，开启后可通过输入关键字过滤选项 | boolean | false |
+ * | danger | 错误状态，用于表单校验失败等场景 | boolean | false |
+ * | placeholder | 选择框默认文本 | string | - |
+ * | value | 指定当前选中的条目 | string \| string[] | - |
+ * | defaultValue | 指定默认选中的条目 | string \| string[] | - |
+ * | onChange | 选中值发生变化时的回调 | function(value, option) | - |
+ *
+ * 更多属性请参考 antd Select 组件文档
+ */
+declare const meta: {
+    component: import("../../../src/core").SelectComponentType<any, HTMLElement>;
+    title: "Core/Select | 选择器";
+    args: {
+        placeholder: string;
+        options: ({
+            value: string;
+            label: string;
+            disabled?: undefined;
+        } | {
+            value: string;
+            label: string;
+            disabled: true;
+        })[];
+        input: {
+            value: string;
         };
     };
 };
+export default meta;
+type Story = StoryObj<typeof Select>;
+/**
+ * Select 组件提供了三种尺寸:
+ * - large: 适用于表单中的主要选择器
+ * - middle: 默认尺寸，适用于大多数场景
+ * - small: 适用于表格等紧凑型界面
+ */
+export declare const Basic: Story;
+/**
+ * Select 组件支持在选项中添加前缀和后缀图标：
+ * - prefix: 在选项文本前显示图标，常用于表示状态或类型
+ * - suffix: 在选项文本后显示图标，常用于显示额外信息
+ */
+export declare const WithIcons: Story;
+/**
+ * 多选模式下可以选择多个选项，选中的选项会以 Tag 的形式展示。
+ * 支持以下特性：
+ * - 可以通过点击 Tag 的关闭按钮删除已选项
+ * - 可以通过键盘删除键（Backspace）删除最后一个已选项
+ * - 支持通过搜索快速定位选项
+ */
+export declare const Multiple: Story;
+/**
+ * Select 组件提供了两种加载状态：
+ * 1. loading: 原生的加载中
+ * 2. isLoadingValue: value 在加载，select 不能点击
+ */
+export declare const Loading: Story;
+/**
+ * 可搜索模式下，用户可以输入关键字过滤选项。
+ * 可以通过 filterOption 属性自定义搜索逻辑。
+ */
+export declare const SearchSelect: Story;
+/**
+ * Select 支持自定义触发器，可以替换默认的下拉箭头图标。
+ * 常见用法是使用自定义图标来表达特定的筛选含义。
+ */
+export declare const CustomTrigger: Story;
+/**
+ * 错误状态有两种实现方式：
+ * 1. 使用 className="select-error" 添加错误样式
+ * 2. 使用 danger 属性（推荐）
+ */
+export declare const Error: Story;
+/**
+ * 禁用状态下，选择器不可点击，显示为灰色。
+ */
+export declare const Disabled: Story;
+/**
+ * Select 组件可以通过特定的样式类实现组合效果：
+ * - LeftEndSelectStyle: 左侧圆角
+ * - RightEndSelectStyle: 右侧圆角
+ */
+export declare const Combined: Story;