@yh-ui/components 0.1.7 → 0.1.12

package/dist/form/src/form-schema.d.ts

@@ -1,37 +1,122 @@
-import type { ExtractPropTypes, PropType, Component } from 'vue';
-import type { FormProps } from './form';
+import type { ExtractPropTypes, PropType, Component, VNode } from 'vue';
+import type { FormProps, FormInstance } from './form';
 import type { FormItemProps } from './form-item';
 import type { FormRule } from './form';
+/**
+ * FormSchema 字段特殊类型
+ */
+export type FormSchemaItemType = 'default' | 'divider' | 'text' | 'list';
 /**
  * FormSchema 单项配置
  */
 export interface FormSchemaItem {
-    /** 字段名 */
+    /** 字段名，支持嵌套路径 (a.b.c) */
     field: string;
     /** 标签名 */
     label?: string;
-    /** 组件名，支持 yh-input 等字符串或原生组件对象 */
-    component: string | Component;
-    /** 绑定到组件的 props */
+    /**
+     * 字段渲染类型
+     * - 'default'：普通表单项（默认）
+     * - 'divider'：分隔线，仅展示 label 作为标题
+     * - 'text'：只读文本，直接显示字段值
+     * - 'list'：动态列表项，支持增减一组子字段
+     */
+    type?: FormSchemaItemType;
+    /**
+     * 只读文本 ('text') 为空时的占位符
+     * @default '-'
+     */
+    emptyValue?: string;
+    /**
+     * type 为 'list' 时的表单项 schema 配置
+     */
+    listSchema?: FormSchemaItem[];
+    /**
+     * type 为 'list' 时的操作项配置
+     */
+    listProps?: {
+        /** 添加按钮文案 */
+        addButtonText?: string;
+        /** 是否显示删除按钮 @default true */
+        allowDelete?: boolean | ((model: Record<string, unknown>, index: number) => boolean);
+        /** 是否显示添加按钮 @default true */
+        allowAdd?: boolean | ((model: Record<string, unknown>) => boolean);
+        /** 最大项数 */
+        max?: number;
+        /** 最小项数 */
+        min?: number;
+    };
+    /**
+     * 组件名，支持：
+     * - 内置简写: 'input' | 'input-number' | 'select' | 'radio' | 'checkbox' |
+     *             'switch' | 'slider' | 'rate' | 'cascader' | 'date-picker' | 'upload' 等
+     * - 完整组件名: 'yh-input'
+     * - Vue 组件对象: MyComponent
+     * 当 type 为 'divider' 或 'text' 时可省略
+     */
+    component?: string | Component;
+    /**
+     * 绑定到组件的 props，支持函数式动态计算
+     * @param model 当前表单数据
+     */
     props?: Record<string, unknown> | ((model: Record<string, unknown>) => Record<string, unknown>);
     /** 绑定到 form-item 的 props */
     formItemProps?: Partial<FormItemProps>;
-    /** 校验规则 */
-    rules?: FormRule[];
-    /** 是否必填 */
-    required?: boolean;
-    /** 是否隐藏 */
+    /**
+     * 校验规则（支持函数式联动，根据 model 返回不同规则）
+     * @param model 当前表单数据
+     */
+    rules?: FormRule[] | ((model: Record<string, unknown>) => FormRule[]);
+    /**
+     * 是否必填（简写，等价于自动添加一条 required: true 的 rule，支持函数式联动）
+     * 会在 label/field 缺失时使用 field 名称作为错误提示前缀
+     * @param model 当前表单数据
+     */
+    required?: boolean | ((model: Record<string, unknown>) => boolean);
+    /**
+     * 是否隐藏（支持函数式联动）
+     * @param model 当前表单数据
+     */
     hidden?: boolean | ((model: Record<string, unknown>) => boolean);
-    /** 插槽配置 */
+    /**
+     * 是否禁用（支持函数式联动，优先级高于 formProps.disabled）
+     * @param model 当前表单数据
+     */
+    disabled?: boolean | ((model: Record<string, unknown>) => boolean);
+    /** 插槽配置（key 为插槽名，value 为组件对象） */
     slots?: Record<string, unknown>;
-    /** 栅格占位 (1-24) */
+    /**
+     * 栅格占位 (1-24)
+     * @default 24
+     */
     col?: number;
-    /** 自定义渲染函数 */
-    render?: (model: Record<string, unknown>) => Component;
-    /** 异步加载选项配置 */
+    /**
+     * 栅格跨度 (grid-column: span x)
+     */
+    span?: number;
+    /**
+     * 自定义完整渲染函数（优先级低于 field-{name} 具名插槽）
+     * @param model 当前表单数据
+     */
+    render?: (model: Record<string, unknown>) => VNode | Component | null;
+    /**
+     * 异步加载选项（适用于 select/radio/checkbox 等需要远程数据的组件）
+     * 会自动注入 loading 状态
+     */
     asyncOptions?: () => Promise<Record<string, unknown>[]>;
-    /** 接收选项数据的属性名，默认 options */
+    /**
+     * 接收选项数据的 prop 名称
+     * @default 'options'
+     */
     optionProp?: string;
+    /**
+     * 字段默认值（仅在 localModel 中对应字段为 undefined 时生效）
+     */
+    defaultValue?: unknown;
+    /**
+     * 字段 tooltip 提示文案（显示在 label 旁边）
+     */
+    tooltip?: string;
 }
 /**
  * FormSchema 分组配置
@@ -41,7 +126,7 @@ export interface FormSchemaGroup {
     title?: string;
     /** 分组内的表单项 */
     items: FormSchemaItem[];
-    /** 分组绑定的额外属性 */
+    /** 绑定到 fieldset 的额外属性 */
     props?: Record<string, unknown>;
     /** 是否可折叠 */
     collapsible?: boolean;
@@ -73,7 +158,8 @@ export declare const formSchemaProps: {
         readonly default: () => {};
     };
     /**
-     * 栅格间隔
+     * 栅格间距（px）
+     * @default 20
      */
     readonly gutter: {
         readonly type: NumberConstructor;
@@ -81,3 +167,22 @@ export declare const formSchemaProps: {
     };
 };
 export type FormSchemaProps = ExtractPropTypes<typeof formSchemaProps>;
+/**
+ * FormSchema 组件实例 EXPOSE 类型
+ */
+export interface FormSchemaInstance {
+    /** 触发校验，支持指定字段 */
+    validate: (fields?: string | string[], callback?: (isValid: boolean, invalidFields?: Record<string, unknown>) => void) => Promise<boolean>;
+    /** 重置字段（恢复初始值并清除校验），支持指定字段 */
+    resetFields: (fields?: string | string[]) => void;
+    /** 清除指定字段校验结果 */
+    clearValidate: (fields?: string | string[]) => void;
+    /** 滚动到指定字段 */
+    scrollToField: (field: string) => void;
+    /** 获取当前表单数据快照 */
+    getModel: () => Record<string, unknown>;
+    /** 动态更新单个字段值 */
+    setFieldValue: (field: string, val: unknown) => void;
+    /** 底层 form 实例 */
+    formRef: FormInstance | undefined;
+}

package/dist/form/src/form-schema.d.vue.ts

@@ -1,32 +1,43 @@
-import type { FormSchema } from './form-schema';
-declare var __VLS_10: any, __VLS_11: {
+import type { FormInstance } from './form';
+declare var __VLS_17: any, __VLS_18: {
     model: any;
     item: any;
-}, __VLS_18: any, __VLS_19: {
+}, __VLS_25: any, __VLS_26: {
     model: any;
     item: any;
     handleUpdate: any;
-}, __VLS_41: any, __VLS_42: {
+}, __VLS_62: any, __VLS_63: {
+    row: any;
+    index: any;
+    item: any;
+}, __VLS_80: any, __VLS_81: {
+    model: any;
+    item: any;
+}, __VLS_87: any, __VLS_88: {
     model: any;
     item: any;
-}, __VLS_49: any, __VLS_50: {
+}, __VLS_95: any, __VLS_96: {
     model: any;
     item: any;
     handleUpdate: any;
-}, __VLS_68: {
+}, __VLS_114: {
     model: any;
     formRef: any;
 };
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_10>]?: (props: typeof __VLS_11) => any;
+    [K in NonNullable<typeof __VLS_17>]?: (props: typeof __VLS_18) => any;
 } & {
-    [K in NonNullable<typeof __VLS_18>]?: (props: typeof __VLS_19) => any;
+    [K in NonNullable<typeof __VLS_25>]?: (props: typeof __VLS_26) => any;
 } & {
-    [K in NonNullable<typeof __VLS_41>]?: (props: typeof __VLS_42) => any;
+    [K in NonNullable<typeof __VLS_62>]?: (props: typeof __VLS_63) => any;
 } & {
-    [K in NonNullable<typeof __VLS_49>]?: (props: typeof __VLS_50) => any;
+    [K in NonNullable<typeof __VLS_80>]?: (props: typeof __VLS_81) => any;
 } & {
-    footer?: (props: typeof __VLS_68) => any;
+    [K in NonNullable<typeof __VLS_87>]?: (props: typeof __VLS_88) => any;
+} & {
+    [K in NonNullable<typeof __VLS_95>]?: (props: typeof __VLS_96) => any;
+} & {
+    footer?: (props: typeof __VLS_114) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     readonly modelValue: {
@@ -34,7 +45,47 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         readonly required: true;
     };
     readonly schema: {
-        readonly type: import("vue").PropType<FormSchema>;
+        readonly type: import("vue").PropType<import("./form-schema").FormSchema>;
+        readonly required: true;
+        readonly default: () => never[];
+    };
+    readonly formProps: {
+        readonly type: import("vue").PropType<Partial<import("./form").FormProps>>;
+        readonly default: () => {};
+    };
+    readonly gutter: {
+        readonly type: NumberConstructor;
+        readonly default: 20;
+    };
+}>, {
+    /** 触发校验，支持指定字段 */
+    validate: (fields?: string | string[], callback?: (isValid: boolean) => void) => Promise<boolean> | undefined;
+    /** 重置字段（恢复初始值并清除校验），支持指定字段 */
+    resetFields: (fields?: string | string[]) => void | undefined;
+    /** 清除指定字段校验结果 */
+    clearValidate: (fields?: string | string[]) => void | undefined;
+    /** 滚动到指定字段 */
+    scrollToField: (field: string) => void | undefined;
+    /** 获取当前表单数据快照 */
+    getModel: () => {
+        [x: string]: unknown;
+    };
+    /** 动态更新单个字段值 */
+    setFieldValue: (field: string, val: unknown) => void;
+    /** 底层 form 实例 */
+    formRef: import("vue").Ref<FormInstance | undefined, FormInstance | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    change: (field: string, val: unknown, model: Record<string, unknown>) => any;
+    submit: (val: Record<string, unknown>) => any;
+    "update:modelValue": (val: Record<string, unknown>) => any;
+    validate: (isValid: boolean, invalidFields?: Record<string, unknown> | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly modelValue: {
+        readonly type: import("vue").PropType<Record<string, unknown>>;
+        readonly required: true;
+    };
+    readonly schema: {
+        readonly type: import("vue").PropType<import("./form-schema").FormSchema>;
         readonly required: true;
         readonly default: () => never[];
     };
@@ -46,15 +97,14 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         readonly type: NumberConstructor;
         readonly default: 20;
     };
+}>> & Readonly<{
+    onChange?: ((field: string, val: unknown, model: Record<string, unknown>) => any) | undefined;
+    onSubmit?: ((val: Record<string, unknown>) => any) | undefined;
+    "onUpdate:modelValue"?: ((val: Record<string, unknown>) => any) | undefined;
+    onValidate?: ((isValid: boolean, invalidFields?: Record<string, unknown> | undefined) => any) | undefined;
 }>, {
-    validate: (props?: string | string[], callback?: (isValid: boolean) => void) => any;
-    resetFields: (props?: string | string[]) => any;
-    clearValidate: (props?: string | string[]) => any;
-    scrollToField: (prop: string) => any;
-    formRef: import("vue").Ref<any, any>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any, string, import("vue").PublicProps, any, {
     readonly gutter: number;
-    readonly schema: FormSchema;
+    readonly schema: import("./form-schema").FormSchema;
     readonly formProps: Partial<import("./form").FormProps>;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/form/src/form-schema.mjs

@@ -22,7 +22,8 @@ export const formSchemaProps = {
     default: () => ({})
   },
   /**
-   * 栅格间隔
+   * 栅格间距（px）
+   * @default 20
    */
   gutter: {
     type: Number,