@dazhicheng/ui 1.5.6 → 1.5.7

package/dist/components/tt-form/src/types/paths.d.ts

@@ -0,0 +1,142 @@
+type BrowserNativeObject = Date | FileList | File;
+type Primitive = null | undefined | string | number | boolean | symbol | bigint;
+/**
+ * Checks whether the type is any
+ * See {@link https://stackoverflow.com/a/49928360/3406963}
+ * @typeParam T - type which may be any
+ * ```
+ * IsAny<any> = true
+ * IsAny<string> = false
+ * ```
+ */
+export type IsAny<T> = 0 extends 1 & T ? true : false;
+/**
+ * Checks whether T1 can be exactly (mutually) assigned to T2
+ * @typeParam T1 - type to check
+ * @typeParam T2 - type to check against
+ * ```
+ * IsEqual<string, string> = true
+ * IsEqual<'foo', 'foo'> = true
+ * IsEqual<string, number> = false
+ * IsEqual<string, number> = false
+ * IsEqual<string, 'foo'> = false
+ * IsEqual<'foo', string> = false
+ * IsEqual<'foo' | 'bar', 'foo'> = boolean // 'foo' is assignable, but 'bar' is not (true | false) -> boolean
+ * ```
+ */
+export type IsEqual<T1, T2> = T1 extends T2 ? (<G>() => G extends T1 ? 1 : 2) extends <G>() => G extends T2 ? 1 : 2 ? true : false : false;
+/**
+ * Type to query whether an array type T is a tuple type.
+ * @typeParam T - type which may be an array or tuple
+ * @example
+ * ```
+ * IsTuple<[number]> = true
+ * IsTuple<number[]> = false
+ * ```
+ */
+type IsTuple<T extends ReadonlyArray<any>> = number extends T["length"] ? false : true;
+/**
+ * Type which can be used to index an array or tuple type.
+ */
+type ArrayKey = number;
+/**
+ * Helper function to break apart T1 and check if any are equal to T2
+ *
+ * See {@link IsEqual}
+ */
+type AnyIsEqual<T1, T2> = T1 extends T2 ? (IsEqual<T1, T2> extends true ? true : never) : never;
+/**
+ * Type which given a tuple type returns its own keys, i.e. only its indices.
+ * @typeParam T - tuple type
+ * @example
+ * ```
+ * TupleKeys<[number, string]> = '0' | '1'
+ * ```
+ */
+type TupleKeys<T extends ReadonlyArray<any>> = Exclude<keyof T, keyof any[]>;
+/**
+ * Helper type to construct tuple key paths and recurse into its elements.
+ *
+ * See {@link Path}
+ */
+type PathInternalTuple<TValue extends ReadonlyArray<any>, TraversedTypes> = {
+    [Key in TupleKeys<TValue> & string]: `[${Key}]` | `[${Key}]${PathInternal<TValue[Key], TraversedTypes, false>}`;
+}[TupleKeys<TValue> & string];
+/**
+ * Helper type to construct array key paths and recurse into its elements.
+ *
+ * See {@link Path}
+ */
+type PathInternalArray<TValue extends ReadonlyArray<any>, TraversedTypes> = `[${ArrayKey}]` | `[${ArrayKey}]${PathInternal<TValue[ArrayKey], TraversedTypes, false>}`;
+/**
+ * Helper type to construct object key paths and recurse into its nested values.
+ *
+ * See {@link Path}
+ */
+type PathInternalObject<TValue, TraversedTypes, First extends boolean> = {
+    [Key in keyof TValue & string]: First extends true ? `${Key}` | `${Key}${PathInternal<TValue[Key], TraversedTypes, false>}` : `.${Key}` | `.${Key}${PathInternal<TValue[Key], TraversedTypes, false>}`;
+}[keyof TValue & string];
+/**
+ * Helper type to construct nested any object key paths.
+ *
+ * See {@link Path}
+ */
+type PathInternalAny = `.${string}` | `[${string}]` | `[${string}].${string}`;
+/**
+ * Helper type for recursively constructing paths through a type.
+ *
+ * This obscures internal type params TraversedTypes and First from ed contract.
+ *
+ * See {@link Path}
+ */
+type PathInternal<TValue, TraversedTypes, First extends boolean> = TValue extends Primitive | BrowserNativeObject ? IsAny<TValue> extends true ? PathInternalAny : never : TValue extends ReadonlyArray<any> ? true extends AnyIsEqual<TraversedTypes, TValue> ? never : IsTuple<TValue> extends true ? PathInternalTuple<TValue, TraversedTypes | TValue> : PathInternalArray<TValue, TraversedTypes | TValue> : TValue extends Record<string, any> ? PathInternalObject<TValue, TraversedTypes | TValue, First> : "";
+/**
+ * Helper type for recursively constructing paths through a type.
+ * This actually constructs the strings and recurses into nested
+ * object types.
+ *
+ * See {@link ArrayPath}
+ */
+type ArrayPathImpl<K extends string | number, V, TraversedTypes> = V extends Primitive | BrowserNativeObject ? IsAny<V> extends true ? string : never : V extends ReadonlyArray<infer U> ? U extends Primitive | BrowserNativeObject ? IsAny<V> extends true ? string : never : true extends AnyIsEqual<TraversedTypes, V> ? never : `${K}` | `${K}.${ArrayPathInternal<V, TraversedTypes | V>}` : true extends AnyIsEqual<TraversedTypes, V> ? never : `${K}.${ArrayPathInternal<V, TraversedTypes | V>}`;
+/**
+ * Helper type for recursively constructing paths through a type.
+ * This obscures the internal type param TraversedTypes from ed contract.
+ *
+ * See {@link ArrayPath}
+ */
+type ArrayPathInternal<T, TraversedTypes = T> = T extends ReadonlyArray<infer V> ? IsTuple<T> extends true ? {
+    [K in TupleKeys<T>]-?: ArrayPathImpl<K & string, T[K], TraversedTypes>;
+}[TupleKeys<T>] : ArrayPathImpl<ArrayKey, V, TraversedTypes> : {
+    [K in keyof T]-?: ArrayPathImpl<K & string, T[K], TraversedTypes>;
+}[keyof T];
+/**
+ * Type which eagerly collects all paths through a type which point to an array
+ * type.
+ * @typeParam T - type which should be introspected.
+ * @example
+ * ```
+ * Path<{foo: {bar: string[], baz: number[]}}> = 'foo.bar' | 'foo.baz'
+ * ```
+ */
+type ArrayPath<T> = T extends any ? ArrayPathInternal<T> : never;
+/**
+ * Type to evaluate the type which the given path points to.
+ * @typeParam T - deeply nested type which is indexed by the path
+ * @typeParam P - path into the deeply nested type
+ * @example
+ * ```
+ * PathValue<{foo: {bar: string}}, 'foo.bar'> = string
+ * PathValue<[number, string], '1'> = string
+ * ```
+ */
+export type PathValue<T, P extends Path<T> | ArrayPath<T>> = T extends any ? P extends `${infer K}.${infer R}` ? K extends keyof T ? R extends Path<T[K]> ? PathValue<T[K], R> : never : K extends `${ArrayKey}` ? T extends ReadonlyArray<infer V> ? PathValue<V, R & Path<V>> : never : never : P extends keyof T ? T[P] : P extends `${ArrayKey}` ? T extends ReadonlyArray<infer V> ? V : never : never : never;
+/**
+ * Type which eagerly collects all paths through a type
+ * @typeParam T - type which should be introspected
+ * @example
+ * ```
+ * Path<{foo: {bar: string}}> = 'foo' | 'foo.bar'
+ * ```
+ */
+export type Path<T> = T extends any ? PathInternal<T, T, true> & string : never;
+export {};

package/dist/components/tt-form/src/types/shared.d.ts

@@ -0,0 +1,19 @@
+export type FieldValidationMetaInfo = {
+    field: string;
+    name: string;
+    label?: string;
+    value: unknown;
+    form: Record<string, unknown>;
+    rule?: {
+        name: string;
+        params?: Record<string, unknown> | unknown[];
+    };
+};
+export type ValidationRuleFunction<TValue = unknown, TParams = unknown[] | Record<string, unknown>> = (value: TValue, params: TParams, ctx: FieldValidationMetaInfo) => boolean | string | Promise<boolean | string>;
+export type SimpleValidationRuleFunction<TValue = unknown, TParams = unknown[] | Record<string, unknown>> = (value: TValue, params: TParams) => boolean | string | Promise<boolean | string>;
+export type ValidationMessageGenerator = (ctx: FieldValidationMetaInfo) => string;
+export type Optional<T> = T extends Record<string, any> ? Partial<T> : T | undefined;
+export type InterpolateOptions = {
+    prefix: string;
+    suffix: string;
+};

package/dist/components/tt-form/src/types.d.ts

@@ -0,0 +1,383 @@
+import { ButtonProps, CheckboxProps, CheckboxGroupProps, DatePickerProps, InputProps, InputNumberProps, RadioProps, RadioGroupProps, SelectProps, SelectV2Props, SwitchProps, TimePickerDefaultProps, UploadProps, CascaderProps } from 'element-plus';
+import { FieldOptions, FormContext, GenericObject } from 'vee-validate';
+import { Component, HtmlHTMLAttributes, MaybeRefOrGetter, Ref } from 'vue';
+import { ZodTypeAny } from 'zod';
+import { TtTextProps } from '../../tt-text';
+import { TtSelectProp } from '../../tt-select';
+import { FormApi } from './formApi';
+export type FormLayout = "horizontal" | "inline" | "vertical";
+export interface BaseFormComponentMap {
+    TtSelect: TtSelectProp;
+    ElCheckbox: CheckboxProps;
+    ElCheckboxButton: CheckboxProps;
+    ElCheckboxGroup: CheckboxGroupProps;
+    ElDatePicker: DatePickerProps;
+    ElInput: InputProps;
+    ElInputNumber: InputNumberProps;
+    ElRadio: RadioProps;
+    ElRadioGroup: RadioGroupProps;
+    ElSelect: SelectProps;
+    ElSelectV2: SelectV2Props;
+    ElSwitch: SwitchProps;
+    ElTimePicker: TimePickerDefaultProps;
+    ElTreeSelect: Record<string, any>;
+    ElUpload: UploadProps;
+    ElCascader: CascaderProps;
+}
+/**
+ * 表单组件类型字符串联合类型
+ * 基于 BaseFormComponentMap 接口的键名
+ */
+export type BaseFormComponentType = keyof BaseFormComponentMap;
+type Breakpoints = "2xl:" | "3xl:" | "" | "lg:" | "md:" | "sm:" | "xl:";
+type GridCols = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13;
+export type WrapperClassType = `${Breakpoints}grid-cols-${GridCols}` | (Record<never, never> & string);
+export type FormItemClassType = `${Breakpoints}cols-end-${"auto" | GridCols}` | `${Breakpoints}cols-span-${"auto" | "full" | GridCols}` | `${Breakpoints}cols-start-${"auto" | GridCols}` | (Record<never, never> & string) | WrapperClassType;
+export type FormFieldOptions = Partial<FieldOptions & {
+    validateOnBlur?: boolean;
+    validateOnChange?: boolean;
+    validateOnInput?: boolean;
+    validateOnModelUpdate?: boolean;
+}>;
+export interface FormShape {
+    /** 默认值 */
+    default?: any;
+    /** 字段名 */
+    fieldName: string;
+    /** 是否必填 */
+    required?: boolean;
+    rules?: ZodTypeAny;
+}
+export type MaybeComponentPropKey = "options" | "placeholder" | "title" | keyof HtmlHTMLAttributes | (Record<never, never> & string);
+export type MaybeComponentProps = {
+    [K in MaybeComponentPropKey]?: any;
+};
+export type FormActions = FormContext<GenericObject>;
+export type CustomRenderType = (() => Component | string) | string;
+export type FormSchemaRuleType = "required" | "selectRequired" | null | (Record<never, never> & string) | ZodTypeAny;
+type FormItemDependenciesCondition<T = boolean | PromiseLike<boolean>> = (value: Partial<Record<string, any>>, actions: FormActions) => T;
+type FormItemDependenciesConditionWithRules = (value: Partial<Record<string, any>>, actions: FormActions) => FormSchemaRuleType | PromiseLike<FormSchemaRuleType>;
+type FormItemDependenciesConditionWithProps = (value: Partial<Record<string, any>>, actions: FormActions) => MaybeComponentProps | PromiseLike<MaybeComponentProps>;
+export interface FormItemDependencies {
+    /**
+     * 组件参数
+     * @returns 组件参数
+     */
+    componentProps?: FormItemDependenciesConditionWithProps;
+    /**
+     * 是否禁用
+     * @returns 是否禁用
+     */
+    disabled?: boolean | FormItemDependenciesCondition;
+    /**
+     * 是否渲染（删除dom）
+     * @returns 是否渲染
+     */
+    if?: boolean | FormItemDependenciesCondition;
+    /**
+     * 是否必填
+     * @returns 是否必填
+     */
+    required?: FormItemDependenciesCondition;
+    /**
+     * 字段规则
+     */
+    rules?: FormItemDependenciesConditionWithRules;
+    /**
+     * 是否隐藏(Css)
+     * @returns 是否隐藏
+     */
+    show?: boolean | FormItemDependenciesCondition;
+    /**
+     * 任意触发都会执行
+     */
+    trigger?: FormItemDependenciesCondition<void>;
+    /**
+     * 触发字段
+     */
+    triggerFields: string[];
+}
+type ComponentProps = ((value: Partial<Record<string, any>>, actions: FormActions) => MaybeComponentProps) | MaybeComponentProps;
+export interface FormCommonConfig {
+    /**
+     * 在Label后显示一个冒号
+     */
+    colon?: boolean;
+    /**
+     * 所有表单项的props
+     */
+    componentProps?: ComponentProps;
+    /**
+     * 所有表单项的控件样式
+     */
+    controlClass?: string;
+    /**
+     * 所有表单项的禁用状态
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * 是否禁用所有表单项的change事件监听
+     * @default true
+     */
+    disabledOnChangeListener?: boolean;
+    /**
+     * 是否禁用所有表单项的input事件监听
+     * @default true
+     */
+    disabledOnInputListener?: boolean;
+    /**
+     * 所有表单项的空状态值,默认都是undefined，naive-ui的空状态值是null
+     */
+    emptyStateValue?: null | undefined;
+    /**
+     * 所有表单项的控件样式
+     * @default {}
+     */
+    formFieldProps?: FormFieldOptions;
+    /**
+     * 所有表单项的栅格布局，支持函数形式
+     * @default ""
+     */
+    formItemClass?: (() => string) | string;
+    /**
+     * 隐藏所有表单项label
+     * @default false
+     */
+    hideLabel?: boolean;
+    /**
+     * 是否隐藏必填标记
+     * @default false
+     */
+    hideRequiredMark?: boolean;
+    /**
+     * 所有表单项的label样式
+     * @default ""
+     */
+    labelClass?: string;
+    /**
+     * 所有表单项的label宽度
+     */
+    labelWidth?: number;
+    /**
+     * 所有表单项的model属性名
+     * @default "modelValue"
+     */
+    modelPropName?: string;
+    /**
+     * 所有表单项的wrapper样式
+     */
+    wrapperClass?: string;
+}
+type RenderComponentContentType = (value: Partial<Record<string, any>>, api: FormActions) => Record<string, any>;
+export type HandleSubmitFn = (values: Record<string, any>) => Promise<void> | void;
+export type HandleResetFn = (values: Record<string, any>) => Promise<void> | void;
+export type FieldMappingTime = [
+    string,
+    [
+        string,
+        string
+    ],
+    (((value: any, fieldName: string) => any) | [string, string] | null | string)?
+][];
+export type ArrayToStringFields = Array<[string[], string?] | string | string[]>;
+export interface FormSchema<T extends BaseFormComponentType = BaseFormComponentType> extends FormCommonConfig {
+    /** 组件 */
+    component: Component | T;
+    /** 组件参数 */
+    componentProps?: ComponentProps;
+    /** 默认值 */
+    defaultValue?: any;
+    /** 依赖 */
+    dependencies?: FormItemDependencies;
+    /** 描述 */
+    description?: CustomRenderType;
+    /** 字段名 */
+    fieldName: string;
+    /** 帮助信息 */
+    help?: CustomRenderType;
+    /** 是否隐藏表单项 */
+    hide?: boolean;
+    /** 表单项 */
+    label?: CustomRenderType;
+    renderComponentContent?: RenderComponentContentType;
+    /** 字段规则 */
+    rules?: FormSchemaRuleType;
+    /** 后缀 */
+    suffix?: CustomRenderType;
+    /** 帮助信息触发器 */
+    helpTrigger?: "hover" | "click" | "focus" | "contextmenu";
+    /** label本身文字气泡设置 */
+    toolTip?: TtTextProps;
+    /** 非label文字气泡设置 */
+    toolTipText?: CustomRenderType;
+}
+export interface FormFieldProps extends FormSchema {
+    required?: boolean;
+}
+export interface FormRenderProps<T extends BaseFormComponentType = BaseFormComponentType> {
+    /**
+     * 表单字段数组映射字符串配置 默认使用","
+     */
+    arrayToStringFields?: ArrayToStringFields;
+    /**
+     * 是否折叠，在showCollapseButton=true下生效
+     * true:折叠 false:展开
+     */
+    collapsed?: boolean;
+    /**
+     * 折叠时保持行数
+     * @default 1
+     */
+    collapsedRows?: number;
+    /**
+     * 是否触发resize事件
+     * @default false
+     */
+    collapseTriggerResize?: boolean;
+    /**
+     * 表单项通用后备配置，当子项目没配置时使用这里的配置，子项目配置优先级高于此配置
+     */
+    commonConfig?: FormCommonConfig;
+    /**
+     * 紧凑模式（移除表单每一项底部为校验信息预留的空间）
+     */
+    compact?: boolean;
+    /**
+     * 组件v-model事件绑定
+     */
+    componentBindEventMap?: Partial<Record<BaseFormComponentType, string>>;
+    /**
+     * 组件集合
+     */
+    componentMap: Record<BaseFormComponentType, Component>;
+    /**
+     * 表单字段映射到时间格式
+     */
+    fieldMappingTime?: FieldMappingTime;
+    /**
+     * 表单实例
+     */
+    form?: FormContext<GenericObject>;
+    /**
+     * 表单项布局
+     */
+    layout?: FormLayout;
+    /**
+     * 表单定义
+     */
+    schema?: FormSchema<T>[];
+    /**
+     * 是否显示展开/折叠
+     */
+    showCollapseButton?: boolean;
+    /**
+     * 格式化日期
+     */
+    /**
+     * 表单栅格布局
+     * @default "grid-cols-1"
+     */
+    wrapperClass?: WrapperClassType;
+}
+export type ActionButtonOptions = {
+    [key: string]: any;
+    content?: MaybeRefOrGetter<string>;
+    show?: boolean;
+    customFn?: (value: Record<string, any>) => Record<string, any>;
+} & Partial<ButtonProps>;
+export interface TtFormProps<T extends BaseFormComponentType = BaseFormComponentType> extends Omit<FormRenderProps<T>, "componentBindEventMap" | "componentMap" | "form"> {
+    /**
+     * 操作按钮是否反转（提交按钮前置）
+     */
+    actionButtonsReverse?: boolean;
+    /**
+     * 操作按钮组的样式
+     * newLine: 在新行显示。rowEnd: 在行内显示，靠右对齐（默认）。inline: 使用grid默认样式
+     */
+    actionLayout?: "inline" | "newLine" | "rowEnd";
+    /**
+     * 操作按钮组显示位置，默认靠右显示
+     */
+    actionPosition?: "center" | "left" | "right";
+    /**
+     * 表单操作区域class
+     */
+    actionWrapperClass?: Array<object | string> | object | string;
+    /**
+     * 表单字段数组映射字符串配置 默认使用","
+     */
+    arrayToStringFields?: ArrayToStringFields;
+    /**
+     * 表单字段映射
+     */
+    fieldMappingTime?: FieldMappingTime;
+    /**
+     * 表单收起展开状态变化回调
+     */
+    handleCollapsedChange?: (collapsed: boolean) => void;
+    /**
+     * 表单重置回调
+     */
+    handleReset?: HandleResetFn;
+    /**
+     * 表单提交回调
+     */
+    handleSubmit?: HandleSubmitFn;
+    /**
+     * 表单值变化回调
+     */
+    handleValuesChange?: (values: Record<string, any>, fieldsChanged: string[]) => void;
+    /**
+     * 重置按钮参数
+     */
+    resetButtonOptions?: ActionButtonOptions;
+    /**
+     * 验证失败时是否自动滚动到第一个错误字段
+     * @default false
+     */
+    scrollToFirstError?: boolean;
+    /**
+     * 是否显示默认操作按钮
+     * @default true
+     */
+    showDefaultActions?: boolean;
+    /**
+     * 提交按钮参数
+     */
+    submitButtonOptions?: ActionButtonOptions;
+    /**
+     * 是否在字段值改变时提交表单
+     * @default false
+     */
+    submitOnChange?: boolean;
+    /**
+     * 是否在回车时提交表单
+     * @default false
+     */
+    submitOnEnter?: boolean;
+}
+export type ExtendedFormApi = FormApi & {
+    useStore: <T = NoInfer<TtFormProps>>(selector?: (state: NoInfer<TtFormProps>) => T) => Readonly<Ref<T>>;
+};
+export interface TtFormAdapterOptions<T extends BaseFormComponentType = BaseFormComponentType> {
+    config?: {
+        baseModelPropName?: string;
+        disabledOnChangeListener?: boolean;
+        disabledOnInputListener?: boolean;
+        emptyStateValue?: null | undefined;
+        modelPropNameMap?: Partial<Record<T, string>>;
+    };
+    defineRules?: {
+        required?: (value: any, params: any, ctx: Record<string, any>) => boolean | string;
+        selectRequired?: (value: any, params: any, ctx: Record<string, any>) => boolean | string;
+    };
+}
+/**
+ * 根据组件类型推断组件参数类型的基础类型
+ * Base type for component props based on component type
+ * @template T - 组件类型（内置组件名或自定义组件）
+ * @template P - 自定义组件的 Props 类型（可选，用于自定义组件类型推断）
+ */
+export type InferredComponentPropsType<T extends BaseFormComponentType | Component, P = never> = T extends BaseFormComponentType ? Partial<BaseFormComponentMap[T]> & MaybeComponentProps : [P] extends [never] ? MaybeComponentProps : Partial<P> & MaybeComponentProps;
+export {};

package/dist/components/tt-form/src/useForm.d.ts

@@ -0,0 +1,2 @@
+import { BaseFormComponentType, ExtendedFormApi, TtFormProps } from './types';
+export declare function useForm<T extends BaseFormComponentType = BaseFormComponentType>(options: TtFormProps<T>): readonly [import('vue').DefineSetupFnComponent<TtFormProps<keyof import('./types').BaseFormComponentMap>, {}, {}, TtFormProps<keyof import('./types').BaseFormComponentMap> & {}, import('vue').PublicProps>, ExtendedFormApi];

package/dist/components/tt-form/src/useFormContext.d.ts

@@ -0,0 +1,12 @@
+import { ComputedRef } from 'vue';
+import { ExtendedFormApi, FormActions, TtFormProps } from './types';
+type ExtendFormProps = TtFormProps & {
+    formApi?: ExtendedFormApi;
+};
+export declare const injectFormProps: <T extends [ExtendFormProps | ComputedRef<ExtendFormProps>, FormActions] | null | undefined = [ExtendFormProps | ComputedRef<ExtendFormProps>, FormActions]>(fallback?: T | undefined) => T extends null ? [ExtendFormProps | ComputedRef<ExtendFormProps>, FormActions] | null : [ExtendFormProps | ComputedRef<ExtendFormProps>, FormActions], provideFormProps: (contextValue: [ExtendFormProps | ComputedRef<ExtendFormProps>, FormActions]) => [ExtendFormProps | ComputedRef<ExtendFormProps>, FormActions];
+export declare const injectComponentRefMap: <T extends Map<string, unknown> | null | undefined = Map<string, unknown>>(fallback?: T | undefined) => T extends null ? Map<string, unknown> | null : Map<string, unknown>, provideComponentRefMap: (contextValue: Map<string, unknown>) => Map<string, unknown>;
+export declare function useFormInitial(props: ComputedRef<TtFormProps> | TtFormProps): {
+    delegatedSlots: ComputedRef<string[]>;
+    form: import('vee-validate').FormContext<Record<string, any>, Record<string, any>>;
+};
+export {};