@qin-ui/vant-pro 1.0.5 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AI-CONTEXT.md +48 -33
- package/LICENSE +9 -0
- package/README.md +1 -1
- package/api.json +27 -22
- package/es/component-provider/{index-DC_k4_R3.js → index-cldbPMDQ.js} +5 -4
- package/es/component-provider/index-cldbPMDQ.js.map +1 -0
- package/es/component-provider/index.js +2 -1
- package/es/component-provider/index.js.map +1 -0
- package/es/components/component-provider/components/index.vue.d.ts +27 -0
- package/es/components/component-provider/components/index.vue.d.ts.map +1 -0
- package/es/components/component-provider/constants/index.d.ts +16 -0
- package/es/components/component-provider/constants/index.d.ts.map +1 -0
- package/es/components/component-provider/index.d.ts +4 -0
- package/es/components/component-provider/index.d.ts.map +1 -0
- package/es/components/component-provider/types/index.d.ts +16 -0
- package/es/components/component-provider/types/index.d.ts.map +1 -0
- package/es/components/form/components/BaseField/index.vue.d.ts +1323 -0
- package/es/components/form/components/BaseField/index.vue.d.ts.map +1 -0
- package/es/components/form/components/BaseField/utils/index.d.ts +3 -0
- package/es/components/form/components/BaseField/utils/index.d.ts.map +1 -0
- package/es/components/form/components/BaseFormItem/index.vue.d.ts +7 -0
- package/es/components/form/components/BaseFormItem/index.vue.d.ts.map +1 -0
- package/es/components/form/components/ContainerFragment/index.vue.d.ts +23 -0
- package/es/components/form/components/ContainerFragment/index.vue.d.ts.map +1 -0
- package/es/components/form/components/GroupedFieldAttrs/index.vue.d.ts +24 -0
- package/es/components/form/components/GroupedFieldAttrs/index.vue.d.ts.map +1 -0
- package/es/components/form/components/PathProvider/index.vue.d.ts +23 -0
- package/es/components/form/components/PathProvider/index.vue.d.ts.map +1 -0
- package/es/components/form/components/ProForm/index.vue.d.ts +34 -0
- package/es/components/form/components/ProForm/index.vue.d.ts.map +1 -0
- package/es/components/form/components/SlotComponent/index.vue.d.ts +7 -0
- package/es/components/form/components/SlotComponent/index.vue.d.ts.map +1 -0
- package/es/components/form/components/index.d.ts +12 -0
- package/es/components/form/components/index.d.ts.map +1 -0
- package/es/components/form/constants/index.d.ts +62 -0
- package/es/components/form/constants/index.d.ts.map +1 -0
- package/es/components/form/hooks/index.d.ts +6 -0
- package/es/components/form/hooks/index.d.ts.map +1 -0
- package/es/components/form/hooks/useFields.d.ts +57 -0
- package/es/components/form/hooks/useFields.d.ts.map +1 -0
- package/es/components/form/hooks/useForm.d.ts +101 -0
- package/es/components/form/hooks/useForm.d.ts.map +1 -0
- package/es/components/form/hooks/useFormPopup.d.ts +57 -0
- package/es/components/form/hooks/useFormPopup.d.ts.map +1 -0
- package/es/components/form/hooks/useFormRef.d.ts +30 -0
- package/es/components/form/hooks/useFormRef.d.ts.map +1 -0
- package/es/components/form/index.d.ts +7 -0
- package/es/components/form/index.d.ts.map +1 -0
- package/es/components/form/types/index.d.ts +152 -0
- package/es/components/form/types/index.d.ts.map +1 -0
- package/es/form/index.js +11 -7
- package/es/form/index.js.map +1 -0
- package/es/index.d.ts +58 -954
- package/es/index.d.ts.map +1 -0
- package/es/index.js +10 -21
- package/es/index.js.map +1 -0
- package/es/shared/core/index.d.ts +6 -0
- package/es/shared/core/index.d.ts.map +1 -0
- package/es/shared/ui/index.d.ts +2 -0
- package/es/shared/ui/index.d.ts.map +1 -0
- package/package.json +11 -12
- package/src/components/component-provider/components/index.vue +67 -0
- package/src/components/component-provider/constants/index.ts +110 -0
- package/src/components/component-provider/index.ts +6 -0
- package/src/components/component-provider/types/index.ts +31 -0
- package/src/components/form/components/BaseField/index.vue +340 -0
- package/src/components/form/components/BaseField/utils/index.ts +14 -0
- package/src/components/form/components/BaseFormItem/index.vue +77 -0
- package/src/components/form/components/ContainerFragment/index.vue +24 -0
- package/src/components/form/components/GroupedFieldAttrs/index.vue +51 -0
- package/src/components/form/components/PathProvider/index.vue +18 -0
- package/src/components/form/components/ProForm/index.vue +114 -0
- package/src/components/form/components/SlotComponent/index.vue +26 -0
- package/src/components/form/components/index.ts +15 -0
- package/src/components/form/constants/index.ts +109 -0
- package/src/components/form/hooks/index.ts +6 -0
- package/src/components/form/hooks/useFields.ts +67 -0
- package/src/components/form/hooks/useForm.ts +126 -0
- package/src/components/form/hooks/useFormPopup.ts +111 -0
- package/src/components/form/hooks/useFormRef.ts +35 -0
- package/src/components/form/index.ts +27 -0
- package/src/components/form/types/index.ts +220 -0
- package/src/index.ts +62 -0
- package/src/shared/core/index.ts +37 -0
- package/src/shared/ui/index.ts +26 -0
- package/es/core/index-B5vvm4Fj.js +0 -236
- package/es/vendor/utils/lodash-es-DN4QDiDm.js +0 -1079
package/es/index.d.ts
CHANGED
|
@@ -1,954 +1,58 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
import {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
default?(_: {}): any;
|
|
60
|
-
};
|
|
61
|
-
refs: {};
|
|
62
|
-
rootEl: any;
|
|
63
|
-
};
|
|
64
|
-
|
|
65
|
-
declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
66
|
-
|
|
67
|
-
declare type __VLS_WithTemplateSlots<T, S> = T & {
|
|
68
|
-
new (): {
|
|
69
|
-
$slots: S;
|
|
70
|
-
};
|
|
71
|
-
};
|
|
72
|
-
|
|
73
|
-
/**
|
|
74
|
-
* FormItem 实例提供的额外方法
|
|
75
|
-
* @template FormItemInstance - FormItem 组件实例类型
|
|
76
|
-
*/
|
|
77
|
-
declare type AdditionalMethods<FormItemInstance> = {
|
|
78
|
-
/**
|
|
79
|
-
* @description 获取 FormItem 实例的方法
|
|
80
|
-
*/
|
|
81
|
-
getFormItemRef?: () => FormItemInstance;
|
|
82
|
-
/**
|
|
83
|
-
* @description 获取传入 FormItem 组件的属性
|
|
84
|
-
*/
|
|
85
|
-
getFormItemComputedProps?: () => Readonly<{
|
|
86
|
-
[x: string]: any;
|
|
87
|
-
}>;
|
|
88
|
-
/**
|
|
89
|
-
* @description 获取组件实例的方法
|
|
90
|
-
*/
|
|
91
|
-
getComponentRef?: () => any;
|
|
92
|
-
/**
|
|
93
|
-
* @description 获取传入 Component 组件的属性
|
|
94
|
-
*/
|
|
95
|
-
getComponentComputedProps?: () => Readonly<{
|
|
96
|
-
disabled?: boolean;
|
|
97
|
-
[x: string]: any;
|
|
98
|
-
}>;
|
|
99
|
-
};
|
|
100
|
-
|
|
101
|
-
declare type AllowStringKey<T, Prefix extends string = ''> = {
|
|
102
|
-
[K in keyof T as string extends K ? never : number extends K ? never : K extends string ? K : never]: T[K] extends (infer U)[] ? `${Prefix}${K & string}` | (IsRecord<U> extends true ? AllowStringKey<U, `${Prefix}${K & string}[index].`> : never) : IsRecord<T[K]> extends true ? `${Prefix}${K & string}` | AllowStringKey<T[K], `${Prefix}${K & string}.`> : `${Prefix}${K & string}`;
|
|
103
|
-
} extends infer Obj ? Obj[keyof Obj] : never;
|
|
104
|
-
|
|
105
|
-
declare type Base<D extends Data = Data> = BaseWithFields<D> | BaseWithoutFields<D>;
|
|
106
|
-
|
|
107
|
-
declare type BaseCommon<D extends Data = Data> = {
|
|
108
|
-
/**
|
|
109
|
-
* @description 字段标识namePath, 同name
|
|
110
|
-
*/
|
|
111
|
-
path?: Path<D>;
|
|
112
|
-
/**
|
|
113
|
-
* @description 字段是否隐藏
|
|
114
|
-
*/
|
|
115
|
-
hidden?: boolean;
|
|
116
|
-
/**
|
|
117
|
-
* @description 字段是否禁用
|
|
118
|
-
*/
|
|
119
|
-
disabled?: boolean;
|
|
120
|
-
/**
|
|
121
|
-
* @description 字段中文名称,支持字符串或组件
|
|
122
|
-
*/
|
|
123
|
-
label?: SlotComponentType;
|
|
124
|
-
/**
|
|
125
|
-
* @description 字段插槽配置
|
|
126
|
-
*/
|
|
127
|
-
slots?: Slots;
|
|
128
|
-
/**
|
|
129
|
-
* @description 嵌套 fields 容器包裹组件
|
|
130
|
-
*/
|
|
131
|
-
fieldContainer?: ContainerComponent;
|
|
132
|
-
/**
|
|
133
|
-
* @description 额外的自定义属性,不会被当作组件参数
|
|
134
|
-
*/
|
|
135
|
-
extraProps?: Record<string, any>;
|
|
136
|
-
};
|
|
137
|
-
|
|
138
|
-
/**
|
|
139
|
-
* 内置组件映射表
|
|
140
|
-
* @description Vant 内置支持的组件类型映射
|
|
141
|
-
*/
|
|
142
|
-
declare type BaseComponentMap = {
|
|
143
|
-
field: typeof Field_2;
|
|
144
|
-
switch: typeof Switch;
|
|
145
|
-
stepper: typeof Stepper;
|
|
146
|
-
rate: typeof Rate;
|
|
147
|
-
slider: typeof Slider;
|
|
148
|
-
uploader: typeof Uploader;
|
|
149
|
-
'checkbox-group': typeof CheckboxGroup;
|
|
150
|
-
'radio-group': typeof RadioGroup;
|
|
151
|
-
picker: typeof Picker;
|
|
152
|
-
'date-picker': typeof DatePicker;
|
|
153
|
-
'time-picker': typeof TimePicker;
|
|
154
|
-
cascader: typeof Cascader;
|
|
155
|
-
area: typeof Area;
|
|
156
|
-
signature: typeof Signature;
|
|
157
|
-
button: typeof Button;
|
|
158
|
-
};
|
|
159
|
-
|
|
160
|
-
/**
|
|
161
|
-
* 基础字段配置接口
|
|
162
|
-
* @template D - 表单数据类型,应为一个对象类型
|
|
163
|
-
*
|
|
164
|
-
* @example
|
|
165
|
-
* ```ts
|
|
166
|
-
* // 简单的文本输入字段
|
|
167
|
-
* const field: BaseField<{ name: string }> = {
|
|
168
|
-
* path: 'name',
|
|
169
|
-
* label: '姓名',
|
|
170
|
-
* }
|
|
171
|
-
*
|
|
172
|
-
* // 带嵌套子字段
|
|
173
|
-
* const field: BaseField<{ address: { city: string; street: string } }> = {
|
|
174
|
-
* path: 'address',
|
|
175
|
-
* label: '地址',
|
|
176
|
-
* fields: [
|
|
177
|
-
* { path: 'city', label: '城市' },
|
|
178
|
-
* { path: 'street', label: '街道' },
|
|
179
|
-
* ],
|
|
180
|
-
* }
|
|
181
|
-
* ```
|
|
182
|
-
*/
|
|
183
|
-
declare interface BaseField<D extends Data = Data> {
|
|
184
|
-
/**
|
|
185
|
-
* @description 字段路径(数据对象的 key 路径),支持点号分隔的深层路径
|
|
186
|
-
* @example 'name' | 'user.address.city'
|
|
187
|
-
*/
|
|
188
|
-
path?: Path<D> | any;
|
|
189
|
-
/**
|
|
190
|
-
* @description 字段名称,与 path 作用相同,两者选其一即可
|
|
191
|
-
* @deprecated 推荐使用 path 替代
|
|
192
|
-
*/
|
|
193
|
-
name?: any;
|
|
194
|
-
/**
|
|
195
|
-
* @description 嵌套子字段配置数组,用于实现分组/嵌套字段
|
|
196
|
-
* @example [{ path: 'firstName', label: '名' }, { path: 'lastName', label: '姓' }]
|
|
197
|
-
*/
|
|
198
|
-
fields?: any[];
|
|
199
|
-
/** 其他任意自定义属性 */
|
|
200
|
-
[key: string]: any;
|
|
201
|
-
}
|
|
202
|
-
|
|
203
|
-
declare type BaseWithFields<D extends Data = Data> = BaseCommon<D> & {
|
|
204
|
-
/**
|
|
205
|
-
* @description 嵌套子字段配置 (Vant 中主要用于分组,或者通过 CellGroup 包裹)
|
|
206
|
-
*/
|
|
207
|
-
fields: Fields<D>;
|
|
208
|
-
component?: never;
|
|
209
|
-
componentStyle?: never;
|
|
210
|
-
componentClass?: never;
|
|
211
|
-
componentContainer?: never;
|
|
212
|
-
fieldStyle?: never;
|
|
213
|
-
fieldClass?: never;
|
|
214
|
-
valueFormatter?: never;
|
|
215
|
-
displayFormatter?: never;
|
|
216
|
-
modelProp?: never;
|
|
217
|
-
popup?: never;
|
|
218
|
-
};
|
|
219
|
-
|
|
220
|
-
declare type BaseWithoutFields<D extends Data = Data> = BaseCommon<D> & {
|
|
221
|
-
fields?: undefined;
|
|
222
|
-
/**
|
|
223
|
-
* @description 表单字段component样式属性
|
|
224
|
-
*/
|
|
225
|
-
componentStyle?: CSSProperties;
|
|
226
|
-
/**
|
|
227
|
-
* @description 表单字段component样式类名
|
|
228
|
-
*/
|
|
229
|
-
componentClass?: any;
|
|
230
|
-
/**
|
|
231
|
-
* @description 表单字段外层 van-field 样式属性
|
|
232
|
-
*/
|
|
233
|
-
fieldStyle?: CSSProperties;
|
|
234
|
-
/**
|
|
235
|
-
* @description 表单字段外层 van-field 样式类名
|
|
236
|
-
*/
|
|
237
|
-
fieldClass?: any;
|
|
238
|
-
/**
|
|
239
|
-
* @description 字段component容器包裹组件
|
|
240
|
-
*/
|
|
241
|
-
componentContainer?: ContainerComponent;
|
|
242
|
-
/**
|
|
243
|
-
* @description 字段值处理函数,在onUpdateValue前执行
|
|
244
|
-
*/
|
|
245
|
-
valueFormatter?: ValueFormatter;
|
|
246
|
-
/**
|
|
247
|
-
* @description 针对 Popup 展现形式的组件,将选中值转化为输入框展示文字
|
|
248
|
-
*/
|
|
249
|
-
displayFormatter?: DisplayFormatter;
|
|
250
|
-
/**
|
|
251
|
-
* @description 组件v-model双向绑定更新属性名
|
|
252
|
-
*/
|
|
253
|
-
modelProp?: string;
|
|
254
|
-
/**
|
|
255
|
-
* @description 是否通过 Popup 弹窗展示该组件(为 true 或传递 PopupProps 配置对象时开启)
|
|
256
|
-
*/
|
|
257
|
-
popup?: boolean | Partial<PopupProps>;
|
|
258
|
-
};
|
|
259
|
-
|
|
260
|
-
/**
|
|
261
|
-
* 组件映射扩展接口
|
|
262
|
-
* @description 通过 TypeScript 声明合并添加自定义组件
|
|
263
|
-
*
|
|
264
|
-
* @example
|
|
265
|
-
* ```ts
|
|
266
|
-
* declare module '@qin-ui/vant-pro' {
|
|
267
|
-
* interface ComponentMap {
|
|
268
|
-
* 'my-custom': typeof MyComponent;
|
|
269
|
-
* }
|
|
270
|
-
* }
|
|
271
|
-
* ```
|
|
272
|
-
|
|
273
|
-
* @public
|
|
274
|
-
*/
|
|
275
|
-
export declare interface ComponentMap {
|
|
276
|
-
}
|
|
277
|
-
|
|
278
|
-
/**
|
|
279
|
-
* 组件名称联合类型
|
|
280
|
-
* @description 所有支持的组件名称
|
|
281
|
-
|
|
282
|
-
* @public
|
|
283
|
-
*/
|
|
284
|
-
export declare type ComponentName = keyof BaseComponentMap | keyof ComponentMap | 'custom';
|
|
285
|
-
|
|
286
|
-
export declare type ComponentVars = Partial<RequiredComponentVars>;
|
|
287
|
-
|
|
288
|
-
/**
|
|
289
|
-
* @description 容器组件类型
|
|
290
|
-
*/
|
|
291
|
-
declare type ContainerComponent = Component<PathProps> | DefineComponent<PathProps> | VNodeTypes | symbol;
|
|
292
|
-
|
|
293
|
-
export declare const ContainerFragment: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
294
|
-
|
|
295
|
-
/**
|
|
296
|
-
* 基础数据类型,表示任意对象
|
|
297
|
-
* @description 所有表单数据对象和表格数据对象的基础类型
|
|
298
|
-
*/
|
|
299
|
-
declare type Data = Record<string, any>;
|
|
300
|
-
|
|
301
|
-
/**
|
|
302
|
-
* 递归地将对象的所有属性变为可选
|
|
303
|
-
* @template T - 原始类型
|
|
304
|
-
*
|
|
305
|
-
* @example
|
|
306
|
-
* ```ts
|
|
307
|
-
* type T = DeepPartial<{ name: string; address: { city: string } }>
|
|
308
|
-
* // { name?: string; address?: { city?: string } }
|
|
309
|
-
* ```
|
|
310
|
-
*/
|
|
311
|
-
declare type DeepPartial<T> = T extends object ? {
|
|
312
|
-
[P in keyof T]?: DeepPartial<T[P]>;
|
|
313
|
-
} : T;
|
|
314
|
-
|
|
315
|
-
declare const _default: {
|
|
316
|
-
/**
|
|
317
|
-
* @qin-ui/vant-pro 安装方法
|
|
318
|
-
* @description 全局注册所有组件(ProForm、ProComponentProvider)
|
|
319
|
-
*
|
|
320
|
-
* @param {App} app - Vue 应用实例
|
|
321
|
-
*
|
|
322
|
-
* @example
|
|
323
|
-
* ```ts
|
|
324
|
-
* import { createApp } from 'vue'
|
|
325
|
-
* import QinUI from '@qin-ui/vant-pro'
|
|
326
|
-
* const app = createApp(App)
|
|
327
|
-
* app.use(QinUI)
|
|
328
|
-
* ```
|
|
329
|
-
*/
|
|
330
|
-
install(app: App): void;
|
|
331
|
-
};
|
|
332
|
-
export default _default;
|
|
333
|
-
|
|
334
|
-
declare const _default_2: <F extends Form<any> = Form>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
335
|
-
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>, never> & {
|
|
336
|
-
form?: F;
|
|
337
|
-
} & Partial<{}>> & PublicProps;
|
|
338
|
-
expose(exposed: ShallowUnwrapRef< {}>): void;
|
|
339
|
-
attrs: any;
|
|
340
|
-
slots: Readonly<Partial<Record<F extends Form<infer D extends Data> ? Path<D> : string, Slot<VModelProps & {
|
|
341
|
-
path?: string;
|
|
342
|
-
} & Data & {
|
|
343
|
-
[x: string]: any;
|
|
344
|
-
disabled?: boolean;
|
|
345
|
-
}>> & {
|
|
346
|
-
default: Slot;
|
|
347
|
-
}>> & Partial<Record<F extends Form<infer D extends Data> ? Path<D> : string, Slot<VModelProps & {
|
|
348
|
-
path?: string;
|
|
349
|
-
} & Data & {
|
|
350
|
-
[x: string]: any;
|
|
351
|
-
disabled?: boolean;
|
|
352
|
-
}>> & {
|
|
353
|
-
default: Slot;
|
|
354
|
-
}>;
|
|
355
|
-
emit: {};
|
|
356
|
-
}>) => VNode & {
|
|
357
|
-
__ctx?: Awaited<typeof __VLS_setup>;
|
|
358
|
-
};
|
|
359
|
-
|
|
360
|
-
declare type DisplayFormatter = (val: any) => string;
|
|
361
|
-
|
|
362
|
-
/**
|
|
363
|
-
* 用 Record<string, any> 扩展对象类型,保留所有原始属性结构,
|
|
364
|
-
* 同时允许访问任意字符串 key。
|
|
365
|
-
* @template D - 原始对象类型
|
|
366
|
-
*
|
|
367
|
-
* @example
|
|
368
|
-
* ```ts
|
|
369
|
-
* type T = ExtendWithAny<{ name: string; age: number }>
|
|
370
|
-
* // { name: string; age: number } & Record<string, any>
|
|
371
|
-
* // 可访问任意额外属性: obj.anyKey
|
|
372
|
-
* ```
|
|
373
|
-
*/
|
|
374
|
-
declare type ExtendWithAny<D> = {
|
|
375
|
-
[K in keyof D]: IsRecord<D[K]> extends true ? ExtendWithAny<D[K]> : D[K];
|
|
376
|
-
} & Record<string, any>;
|
|
377
|
-
|
|
378
|
-
export declare type Field<C extends ComponentName = ComponentName, D extends Data = Data> = FieldTypeMap<D>[C] | WithFields<D>;
|
|
379
|
-
|
|
380
|
-
/**
|
|
381
|
-
* 字段查找函数类型,通过自定义函数匹配字段
|
|
382
|
-
* @template D - 表单数据类型
|
|
383
|
-
* @template F - 字段配置类型
|
|
384
|
-
* @example
|
|
385
|
-
* ```ts
|
|
386
|
-
* // 查找 label 为 '姓名' 的字段
|
|
387
|
-
* const findBy: FieldFindBy<MyData> = (field) => field.label === '姓名'
|
|
388
|
-
* ```
|
|
389
|
-
*/
|
|
390
|
-
declare type FieldFindBy<D extends Data, F extends BaseField<D> = BaseField<D>> = (field: Readonly<F>) => boolean;
|
|
391
|
-
|
|
392
|
-
export declare type Fields<D extends Data = Data> = Array<Field<ComponentName, D>>;
|
|
393
|
-
|
|
394
|
-
/**
|
|
395
|
-
* @type {FieldTypeMap} 字段类型集合
|
|
396
|
-
*/
|
|
397
|
-
declare type FieldTypeMap<D extends Data = Data> = {
|
|
398
|
-
[K in ComponentName]: K extends 'custom' ? WithCommon<{
|
|
399
|
-
slots?: Slots;
|
|
400
|
-
[x: string]: any;
|
|
401
|
-
}, D> & {
|
|
402
|
-
component?: RenderComponentType | Raw<RenderComponentType>;
|
|
403
|
-
} : WithComponent<GetComponentType<K>, D> & {
|
|
404
|
-
component?: K;
|
|
405
|
-
};
|
|
406
|
-
};
|
|
407
|
-
|
|
408
|
-
/**
|
|
409
|
-
* @qin-ui/vant-pro 的表单实例类型
|
|
410
|
-
*
|
|
411
|
-
* @description 在 core Form 类型的基础上:
|
|
412
|
-
* 1. 将字段类型 F 绑定为本地 Field<ComponentName, D>
|
|
413
|
-
* 2. 将底层表单实例绑定为 Vant 的 FormInstance
|
|
414
|
-
* 3. 额外包含 formPopup 对象,用于管理弹出层表单
|
|
415
|
-
*
|
|
416
|
-
* @template D - 表单数据类型
|
|
417
|
-
* @template F - 字段配置类型
|
|
418
|
-
|
|
419
|
-
* @public
|
|
420
|
-
*/
|
|
421
|
-
export declare type Form<D extends Data = Data, F extends Field<ComponentName, D> = Field<ComponentName, D>> = Form_2<D, F, FormInstance> & {
|
|
422
|
-
formPopup: FormPopup;
|
|
423
|
-
};
|
|
424
|
-
|
|
425
|
-
/**
|
|
426
|
-
* 表单实例类型
|
|
427
|
-
* @template D - 表单数据类型
|
|
428
|
-
* @template F - 字段配置类型
|
|
429
|
-
* @template I - 底层 UI 框架 Form 组件实例类型
|
|
430
|
-
*
|
|
431
|
-
* 组合了表单数据操作、字段操作和表单 ref 操作的能力。
|
|
432
|
-
*
|
|
433
|
-
* @example
|
|
434
|
-
* ```ts
|
|
435
|
-
* // 定义数据类型
|
|
436
|
-
* interface User {
|
|
437
|
-
* name: string
|
|
438
|
-
* age: number
|
|
439
|
-
* address: { city: string; street: string }
|
|
440
|
-
* }
|
|
441
|
-
*
|
|
442
|
-
* // 创建表单实例
|
|
443
|
-
* const form: Form<User> = useForm({
|
|
444
|
-
* name: '张三',
|
|
445
|
-
* age: 25,
|
|
446
|
-
* })
|
|
447
|
-
*
|
|
448
|
-
* // 读取数据
|
|
449
|
-
* form.getFormData('name') // '张三'
|
|
450
|
-
* form.getFormData('address.city') // 支持深层路径
|
|
451
|
-
*
|
|
452
|
-
* // 设置数据
|
|
453
|
-
* form.setFormData('name', '李四')
|
|
454
|
-
* form.setFormData({ name: '王五', age: 30 }) // 批量设置
|
|
455
|
-
*
|
|
456
|
-
* // 字段操作
|
|
457
|
-
* form.getField('name') // 获取字段配置
|
|
458
|
-
* form.setField('name', { label: '用户名' }) // 更新字段配置
|
|
459
|
-
* ```
|
|
460
|
-
*/
|
|
461
|
-
declare type Form_2<D extends Data = Data, F extends BaseField<D> = BaseField<D>, I = any> = ReturnType<typeof useFormData<D>> & ReturnType<typeof useFields_2<D, F>> & ReturnType<typeof useFormRef_2<I>>;
|
|
462
|
-
|
|
463
|
-
/**
|
|
464
|
-
* 表单弹出层管理对象
|
|
465
|
-
* @description Vant 移动端特有的表单弹出层功能
|
|
466
|
-
|
|
467
|
-
* @public
|
|
468
|
-
*/
|
|
469
|
-
declare type FormPopup = {
|
|
470
|
-
/** Popup 组件属性 */
|
|
471
|
-
props: PopupProps;
|
|
472
|
-
/** 打开指定路径字段的弹出层 */
|
|
473
|
-
open: (path: string) => void;
|
|
474
|
-
/** 关闭弹出层 */
|
|
475
|
-
close: () => void;
|
|
476
|
-
/** 更新 Popup 组件属性 */
|
|
477
|
-
updateProps: (props: Partial<PopupProps>) => void;
|
|
478
|
-
/** 弹出层是否可见 */
|
|
479
|
-
visible: ComputedRef<boolean>;
|
|
480
|
-
/** 当前弹出层对应的字段路径 */
|
|
481
|
-
popupFieldPath: Ref<string | undefined>;
|
|
482
|
-
/** 当前弹出层字段的值 */
|
|
483
|
-
popupFieldValue: Ref<any | undefined>;
|
|
484
|
-
};
|
|
485
|
-
|
|
486
|
-
declare type FP<T extends Record<string, any>> = Partial<T & Pick<Base, 'valueFormatter' | 'displayFormatter' | 'componentContainer' | 'modelProp' | 'popup'> & AllowedComponentProps>;
|
|
487
|
-
|
|
488
|
-
/**
|
|
489
|
-
* 根据组件名获取组件类型
|
|
490
|
-
* @template K - 组件名称
|
|
491
|
-
*/
|
|
492
|
-
declare type GetComponentType<K extends ComponentName> = K extends keyof ComponentMap ? ComponentMap[K] : K extends keyof BaseComponentMap ? BaseComponentMap[K] : never;
|
|
493
|
-
|
|
494
|
-
/**
|
|
495
|
-
* 判断类型是否为对象(排除函数、数组和 null)
|
|
496
|
-
* @template T - 要判断的类型
|
|
497
|
-
*/
|
|
498
|
-
declare type IsRecord<T> = T extends object ? T extends ((...args: any[]) => any) | any[] | null ? false : true : false;
|
|
499
|
-
|
|
500
|
-
/**
|
|
501
|
-
* 展开字符串联合类型,保留字符串字面量,同时兼容 string
|
|
502
|
-
* @template T - 字符串字面量类型
|
|
503
|
-
*/
|
|
504
|
-
declare type KeyExpandString<T extends string> = T | (string & {});
|
|
505
|
-
|
|
506
|
-
/**
|
|
507
|
-
* 点号分隔的路径字符串类型
|
|
508
|
-
* @template D - 数据对象类型
|
|
509
|
-
*
|
|
510
|
-
* @description 用于类型安全地表示深层对象属性的路径。
|
|
511
|
-
* 例如给定 `{ user: { name: string; address: { city: string } } }`,
|
|
512
|
-
* 路径值可以是 `'user'`、`'user.name'`、`'user.address.city'`。
|
|
513
|
-
*
|
|
514
|
-
* 同时兼容 string 类型,用于运行时动态路径。
|
|
515
|
-
*
|
|
516
|
-
* @example
|
|
517
|
-
* ```ts
|
|
518
|
-
* interface User {
|
|
519
|
-
* name: string
|
|
520
|
-
* age: number
|
|
521
|
-
* address: { city: string; street: string }
|
|
522
|
-
* }
|
|
523
|
-
*
|
|
524
|
-
* type P = KeyPathString<User>
|
|
525
|
-
* // 'name' | 'age' | 'address' | 'address.city' | 'address.street' | string
|
|
526
|
-
* ```
|
|
527
|
-
*/
|
|
528
|
-
declare type KeyPathString<D extends Data> = KeyExpandString<AllowStringKey<D>>;
|
|
529
|
-
|
|
530
|
-
declare type MaybeRefOrComputedRef<T = any> = MaybeRef<T> | ComputedRef<T>;
|
|
531
|
-
|
|
532
|
-
declare type NotSupportedRefOrGetterProps = 'component' | 'fieldContainer' | 'componentContainer' | 'valueFormatter' | 'displayFormatter' | 'fields' | 'slots' | 'modelProp' | 'popup';
|
|
533
|
-
|
|
534
|
-
/**
|
|
535
|
-
* 路径类型,用于类型安全的深层属性访问
|
|
536
|
-
* @template D - 数据对象类型
|
|
537
|
-
*
|
|
538
|
-
* @description 提供对数据对象的深层路径的类型推导。
|
|
539
|
-
* 在 useFormData、useFields 等 API 中作为 path 参数的类型。
|
|
540
|
-
*
|
|
541
|
-
* @example
|
|
542
|
-
* ```ts
|
|
543
|
-
* interface User { name: string; address: { city: string } }
|
|
544
|
-
*
|
|
545
|
-
* // 类型安全的路径
|
|
546
|
-
* const path: Path<User> = 'address.city' // ✅
|
|
547
|
-
* const path: Path<User> = 'invalid.path' // ❌ 类型错误
|
|
548
|
-
* ```
|
|
549
|
-
*/
|
|
550
|
-
declare type Path<D extends Data = Data> = KeyPathString<D>;
|
|
551
|
-
|
|
552
|
-
declare type PathProps = {
|
|
553
|
-
path?: string;
|
|
554
|
-
} & Data;
|
|
555
|
-
|
|
556
|
-
/**
|
|
557
|
-
* Vant Popup 组件属性类型
|
|
558
|
-
* @description 用于配置表单弹出层的属性
|
|
559
|
-
|
|
560
|
-
* @public
|
|
561
|
-
*/
|
|
562
|
-
declare type PopupProps = ComponentProps<typeof Popup> & {
|
|
563
|
-
container: ContainerComponent;
|
|
564
|
-
};
|
|
565
|
-
|
|
566
|
-
declare type PP<T extends Record<string, any>> = Partial<T & AllowedComponentProps>;
|
|
567
|
-
|
|
568
|
-
export declare const ProComponentProvider: SFCWithInstall<{
|
|
569
|
-
new (...args: any[]): CreateComponentPublicInstanceWithMixins<Readonly<{
|
|
570
|
-
componentVars?: ComponentVars;
|
|
571
|
-
componentMap?: Partial<Record<ComponentName, any>>;
|
|
572
|
-
}> & Readonly<{}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, PublicProps, {}, false, {}, {}, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, {
|
|
573
|
-
P: {};
|
|
574
|
-
B: {};
|
|
575
|
-
D: {};
|
|
576
|
-
C: {};
|
|
577
|
-
M: {};
|
|
578
|
-
Defaults: {};
|
|
579
|
-
}, Readonly<{
|
|
580
|
-
componentVars?: ComponentVars;
|
|
581
|
-
componentMap?: Partial<Record<ComponentName, any>>;
|
|
582
|
-
}> & Readonly<{}>, {}, {}, {}, {}, {}>;
|
|
583
|
-
__isFragment?: never;
|
|
584
|
-
__isTeleport?: never;
|
|
585
|
-
__isSuspense?: never;
|
|
586
|
-
} & ComponentOptionsBase<Readonly<{
|
|
587
|
-
componentVars?: ComponentVars;
|
|
588
|
-
componentMap?: Partial<Record<ComponentName, any>>;
|
|
589
|
-
}> & Readonly<{}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, {}, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & VNodeProps & AllowedComponentProps & ComponentCustomProps & (new () => {
|
|
590
|
-
$slots: {
|
|
591
|
-
default?(_: {}): any;
|
|
592
|
-
};
|
|
593
|
-
})>;
|
|
594
|
-
|
|
595
|
-
export declare const ProForm: SFCWithInstall<(<F extends Form<any> = Form>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: {
|
|
596
|
-
slots: Readonly<Partial<Record<F extends Form<infer D extends Data> ? Path<D> : string, Slot<VModelProps & {
|
|
597
|
-
path?: string;
|
|
598
|
-
} & Data & {
|
|
599
|
-
[x: string]: any;
|
|
600
|
-
disabled?: boolean;
|
|
601
|
-
}>> & {
|
|
602
|
-
default: Slot;
|
|
603
|
-
}>> & Partial<Record<F extends Form<infer D extends Data> ? Path<D> : string, Slot<VModelProps & {
|
|
604
|
-
path?: string;
|
|
605
|
-
} & Data & {
|
|
606
|
-
[x: string]: any;
|
|
607
|
-
disabled?: boolean;
|
|
608
|
-
}>> & {
|
|
609
|
-
default: Slot;
|
|
610
|
-
}>;
|
|
611
|
-
attrs: any;
|
|
612
|
-
emit: {};
|
|
613
|
-
}, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
614
|
-
props: {
|
|
615
|
-
form?: F | undefined;
|
|
616
|
-
} & PublicProps;
|
|
617
|
-
expose(exposed: ShallowUnwrapRef< {}>): void;
|
|
618
|
-
attrs: any;
|
|
619
|
-
slots: Readonly<Partial<Record<F extends Form<infer D extends Data> ? Path<D> : string, Slot<VModelProps & {
|
|
620
|
-
path?: string;
|
|
621
|
-
} & Data & {
|
|
622
|
-
[x: string]: any;
|
|
623
|
-
disabled?: boolean;
|
|
624
|
-
}>> & {
|
|
625
|
-
default: Slot;
|
|
626
|
-
}>> & Partial<Record<F extends Form<infer D extends Data> ? Path<D> : string, Slot<VModelProps & {
|
|
627
|
-
path?: string;
|
|
628
|
-
} & Data & {
|
|
629
|
-
[x: string]: any;
|
|
630
|
-
disabled?: boolean;
|
|
631
|
-
}>> & {
|
|
632
|
-
default: Slot;
|
|
633
|
-
}>;
|
|
634
|
-
emit: {};
|
|
635
|
-
}>) => VNode & {
|
|
636
|
-
__ctx?: Awaited<typeof __VLS_setup>;
|
|
637
|
-
})>;
|
|
638
|
-
|
|
639
|
-
export declare type ProFormInstance = ComponentExposed<typeof _default_2>;
|
|
640
|
-
|
|
641
|
-
export declare type ProFormProps = ComponentProps<typeof _default_2>;
|
|
642
|
-
|
|
643
|
-
declare type Props = {
|
|
644
|
-
component?: ContainerComponent;
|
|
645
|
-
};
|
|
646
|
-
|
|
647
|
-
declare type Props_2 = {
|
|
648
|
-
component?: SlotComponentType;
|
|
649
|
-
};
|
|
650
|
-
|
|
651
|
-
/**
|
|
652
|
-
* @description 自定义组件
|
|
653
|
-
*/
|
|
654
|
-
declare type RenderComponentType = Component<VModelProps & PathProps>;
|
|
655
|
-
|
|
656
|
-
declare type RequiredComponentVars = {
|
|
657
|
-
'pro-form': PP<Omit<ProFormProps & FormProps, 'form'>>;
|
|
658
|
-
} & {
|
|
659
|
-
[K in Exclude<ComponentName, 'custom'>]: FP<ComponentProps<GetComponentType<K>>>;
|
|
660
|
-
};
|
|
661
|
-
|
|
662
|
-
declare type SFCWithInstall<T> = T & Plugin_2;
|
|
663
|
-
|
|
664
|
-
export declare const SlotComponent: DefineComponent<Props_2, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<Props_2> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
|
|
665
|
-
|
|
666
|
-
/**
|
|
667
|
-
* @description 插槽组件类型
|
|
668
|
-
*/
|
|
669
|
-
declare type SlotComponentType = Component<PathProps> | VNode | string | number | boolean | null | undefined | ((...args: any[]) => SlotComponentType);
|
|
670
|
-
|
|
671
|
-
/**
|
|
672
|
-
* @description 插槽对象类型
|
|
673
|
-
*/
|
|
674
|
-
declare type Slots = {
|
|
675
|
-
[name: string]: SlotComponentType;
|
|
676
|
-
};
|
|
677
|
-
|
|
678
|
-
declare type UpdateFieldOptions = {
|
|
679
|
-
all?: boolean;
|
|
680
|
-
};
|
|
681
|
-
|
|
682
|
-
/** useFields 返回值类型,固定为本地 Fields<D>
|
|
683
|
-
* @public
|
|
684
|
-
*/
|
|
685
|
-
export declare type UseFields<D extends Data = Data> = ReturnType<typeof useFields<D>>;
|
|
686
|
-
|
|
687
|
-
/**
|
|
688
|
-
* @qin-ui/vant-pro 的字段配置管理 Hook
|
|
689
|
-
*
|
|
690
|
-
* @description 类型安全的 re-export。将 core useFields 的泛型参数绑定为本地类型:
|
|
691
|
-
* - 字段类型 F → Field<ComponentName, D>(支持 Vant 组件类型推导)
|
|
692
|
-
* - Field 实例 → Vant 的 FieldInstance
|
|
693
|
-
*
|
|
694
|
-
* @template D - 表单数据类型
|
|
695
|
-
*
|
|
696
|
-
* @example
|
|
697
|
-
* ```ts
|
|
698
|
-
* interface User { name: string; age: number }
|
|
699
|
-
*
|
|
700
|
-
* const { fields, getField, setField } = useFields<User>([
|
|
701
|
-
* { path: 'name', label: '姓名', component: 'field' },
|
|
702
|
-
* { path: 'age', label: '年龄', component: 'stepper' },
|
|
703
|
-
* ])
|
|
704
|
-
* ```
|
|
705
|
-
|
|
706
|
-
* @public
|
|
707
|
-
*/
|
|
708
|
-
export declare const useFields: {
|
|
709
|
-
<D extends Data = Data>(initFields?: Fields<D>): ReturnType<typeof useFields_2<D, Field<ComponentName, D>, FieldInstance>>;
|
|
710
|
-
};
|
|
711
|
-
|
|
712
|
-
/**
|
|
713
|
-
* 字段配置管理 Hook
|
|
714
|
-
*
|
|
715
|
-
* @description 提供对字段配置数组的增删改查操作,支持:
|
|
716
|
-
* - 通过路径字符串或查找函数定位字段
|
|
717
|
-
* - 深层嵌套字段的遍历和匹配
|
|
718
|
-
* - 字段配置的合并/覆盖更新
|
|
719
|
-
* - 字段的添加、插入、删除
|
|
720
|
-
* - 父级字段查找
|
|
721
|
-
*
|
|
722
|
-
* @template D - 表单数据类型,用于路径类型推导
|
|
723
|
-
* @template F - 字段配置类型,继承自 BaseField<D>
|
|
724
|
-
* @template FormInstance - 底层 FormItem 组件实例类型
|
|
725
|
-
*
|
|
726
|
-
* @param {F[]} [initFields] - 初始字段配置数组
|
|
727
|
-
*
|
|
728
|
-
* @returns {object} 字段操作对象
|
|
729
|
-
* @returns {Ref<F[]>} .fields - 字段配置数组(响应式)
|
|
730
|
-
* @returns {Function} .getField(path) - 获取字段配置
|
|
731
|
-
* @returns {Function} .setField(path, field) - 更新字段配置
|
|
732
|
-
* @returns {Function} .deleteField(path) - 删除字段
|
|
733
|
-
* @returns {Function} .appendField(path, field) - 在指定字段后追加
|
|
734
|
-
* @returns {Function} .prependField(path, field) - 在指定字段前插入
|
|
735
|
-
* @returns {Function} .getParentField(path) - 获取父级字段
|
|
736
|
-
*
|
|
737
|
-
* @example
|
|
738
|
-
* ```ts
|
|
739
|
-
* interface User { name: string; age: number; address: { city: string } }
|
|
740
|
-
*
|
|
741
|
-
* const { fields, getField, setField, deleteField } = useFields<User>([
|
|
742
|
-
* { path: 'name', label: '姓名', component: 'input' },
|
|
743
|
-
* { path: 'age', label: '年龄', component: 'input-number' },
|
|
744
|
-
* {
|
|
745
|
-
* path: 'address',
|
|
746
|
-
* label: '地址',
|
|
747
|
-
* fields: [
|
|
748
|
-
* { path: 'city', label: '城市' },
|
|
749
|
-
* ],
|
|
750
|
-
* },
|
|
751
|
-
* ])
|
|
752
|
-
*
|
|
753
|
-
* // 通过路径获取字段
|
|
754
|
-
* getField('name') // { path: 'name', label: '姓名', ... }
|
|
755
|
-
* getField('address.city') // { path: 'city', label: '城市', ... }
|
|
756
|
-
*
|
|
757
|
-
* // 通过查找函数获取字段
|
|
758
|
-
* getField(f => f.label === '姓名')
|
|
759
|
-
*
|
|
760
|
-
* // 更新字段(合并模式)
|
|
761
|
-
* setField('name', { label: '用户名' })
|
|
762
|
-
*
|
|
763
|
-
* // 删除字段
|
|
764
|
-
* deleteField('age')
|
|
765
|
-
*
|
|
766
|
-
* // 追加/插入字段
|
|
767
|
-
* appendField('name', { path: 'email', label: '邮箱', component: 'input' })
|
|
768
|
-
* prependField('name', { path: 'id', label: 'ID', component: 'input' })
|
|
769
|
-
* ```
|
|
770
|
-
*/
|
|
771
|
-
declare const useFields_2: <D extends Data = Data, F extends BaseField<D> = BaseField<D>, FormInstance = any>(initFields?: F[]) => {
|
|
772
|
-
fields: Ref<F[], F[]>;
|
|
773
|
-
getField: {
|
|
774
|
-
(path: Path<D> | FieldFindBy<D, F>): Readonly<F & AdditionalMethods<FormInstance>> | undefined;
|
|
775
|
-
(path: Path<D> | FieldFindBy<D, F>, options?: {
|
|
776
|
-
all?: false;
|
|
777
|
-
}): Readonly<F & AdditionalMethods<FormInstance>> | undefined;
|
|
778
|
-
(path: Path<D> | FieldFindBy<D, F>, options: {
|
|
779
|
-
all: true;
|
|
780
|
-
}): Readonly<F & AdditionalMethods<FormInstance>>[] | undefined;
|
|
781
|
-
};
|
|
782
|
-
setField: (path: Path<D> | FieldFindBy<D, F>, field: F | ((preField: Readonly<F>) => F), options?: {
|
|
783
|
-
updateType?: "rewrite" | "merge";
|
|
784
|
-
} & UpdateFieldOptions) => void;
|
|
785
|
-
deleteField: (path: Path<D> | FieldFindBy<D, F>, options?: UpdateFieldOptions) => void;
|
|
786
|
-
appendField: (path: Path<D> | FieldFindBy<D, F> | undefined, field: F | F[], options?: UpdateFieldOptions) => void;
|
|
787
|
-
prependField: (path: Path<D> | FieldFindBy<D, F> | undefined, field: F | F[], options?: UpdateFieldOptions) => void;
|
|
788
|
-
getParentField: {
|
|
789
|
-
(path: Path<D> | FieldFindBy<D, F>): Readonly<F & AdditionalMethods<FormInstance>> | undefined;
|
|
790
|
-
(path: Path<D> | FieldFindBy<D, F>, options: {
|
|
791
|
-
all?: false;
|
|
792
|
-
}): Readonly<F & AdditionalMethods<FormInstance>> | undefined;
|
|
793
|
-
(path: Path<D> | FieldFindBy<D, F>, options: {
|
|
794
|
-
all: true;
|
|
795
|
-
}): Readonly<F & AdditionalMethods<FormInstance>>[] | undefined;
|
|
796
|
-
};
|
|
797
|
-
};
|
|
798
|
-
|
|
799
|
-
/**
|
|
800
|
-
* 创建 @qin-ui/vant-pro 表单实例的 Hook
|
|
801
|
-
*
|
|
802
|
-
* @description 基于 core useForm 封装,额外提供了 formPopup 用于移动端弹窗表单。
|
|
803
|
-
*
|
|
804
|
-
* @template D - 表单数据类型
|
|
805
|
-
*
|
|
806
|
-
* @example
|
|
807
|
-
* ```ts
|
|
808
|
-
* interface User { name: string; age: number }
|
|
809
|
-
*
|
|
810
|
-
* const form = useForm<User>(
|
|
811
|
-
* { name: '张三' },
|
|
812
|
-
* [
|
|
813
|
-
* { path: 'name', label: '姓名', component: 'field' },
|
|
814
|
-
* ]
|
|
815
|
-
* )
|
|
816
|
-
*
|
|
817
|
-
* // 打开弹出层表单
|
|
818
|
-
* form.formPopup.open('address')
|
|
819
|
-
* form.formPopup.close()
|
|
820
|
-
* ```
|
|
821
|
-
|
|
822
|
-
* @public
|
|
823
|
-
*/
|
|
824
|
-
export declare function useForm<D extends Data = Data>(initFormData?: ExtendWithAny<DeepPartial<D>>, initFields?: Field<ComponentName, D>[], root?: boolean): Form<D, Field<ComponentName, D>>;
|
|
825
|
-
|
|
826
|
-
export declare function useForm<D extends Data = Data>(root?: boolean): Form<D, Field<ComponentName, D>>;
|
|
827
|
-
|
|
828
|
-
/**
|
|
829
|
-
* 表单数据处理 Hook
|
|
830
|
-
*
|
|
831
|
-
* @description 提供响应式表单数据的管理能力,支持:
|
|
832
|
-
* - 响应式数据存储(基于 Vue reactive)
|
|
833
|
-
* - 深层路径读写(支持点号分隔,如 'address.city')
|
|
834
|
-
* - 类型安全的路径提示(传入泛型 D 后,path 参数可获得类型推导)
|
|
835
|
-
* - 父子表单自动注入(非根表单会从注入中获取数据)
|
|
836
|
-
* @public
|
|
837
|
-
*
|
|
838
|
-
* @template D - 表单数据类型,应为一个对象类型
|
|
839
|
-
* @param {ExtendWithAny<DeepPartial<D>>} [initFormData] - 初始表单数据
|
|
840
|
-
*
|
|
841
|
-
* @returns {object} 表单数据操作对象
|
|
842
|
-
* @returns {D & Record<string, any>} .formData - 响应式表单数据
|
|
843
|
-
* @returns {Function} .getFormData(path) - 获取指定路径的数据
|
|
844
|
-
* @returns {Function} .setFormData(path, value) - 设置指定路径的数据
|
|
845
|
-
*
|
|
846
|
-
* @example
|
|
847
|
-
* ```ts
|
|
848
|
-
* interface User { name: string; age: number; address: { city: string } }
|
|
849
|
-
*
|
|
850
|
-
* const { formData, getFormData, setFormData } = useFormData<User>({
|
|
851
|
-
* name: '张三',
|
|
852
|
-
* address: { city: '北京' }
|
|
853
|
-
* })
|
|
854
|
-
*
|
|
855
|
-
* // 读取
|
|
856
|
-
* getFormData('name') // '张三'
|
|
857
|
-
* getFormData('address.city') // '北京'
|
|
858
|
-
* formData.name // '张三'(响应式)
|
|
859
|
-
*
|
|
860
|
-
* // 设置
|
|
861
|
-
* setFormData('name', '李四')
|
|
862
|
-
* setFormData('address.city', '上海')
|
|
863
|
-
* setFormData({ name: '王五', age: 30 }) // 批量覆盖
|
|
864
|
-
* setFormData(prev => ({ ...prev, name: '赵六' })) // 函数式更新
|
|
865
|
-
* ```
|
|
866
|
-
*/
|
|
867
|
-
export declare const useFormData: <D extends Data = Data>(initFormData?: ExtendWithAny<DeepPartial<D>>) => {
|
|
868
|
-
formData: Reactive<ExtendWithAny<D>>;
|
|
869
|
-
getFormData: {
|
|
870
|
-
<K extends keyof D>(path: K): D[K];
|
|
871
|
-
<K extends keyof D & string, K1 extends keyof D[K] & string>(path: `${K}.${K1}`): D[K][K1];
|
|
872
|
-
<K extends keyof D & string, K1_1 extends keyof D[K] & string, K2 extends keyof D[K][K1_1] & string>(path: `${K}.${K1_1}.${K2}`): D[K][K1_1][K2];
|
|
873
|
-
(path: Path<D>): any;
|
|
874
|
-
};
|
|
875
|
-
setFormData: {
|
|
876
|
-
(path: Path<D>, value: any): void;
|
|
877
|
-
(path: Path<D>, value: (v: any) => any): void;
|
|
878
|
-
(value: ExtendWithAny<DeepPartial<D>>): void;
|
|
879
|
-
(value: (v: ExtendWithAny<DeepPartial<D>>) => ExtendWithAny<DeepPartial<D>>): void;
|
|
880
|
-
};
|
|
881
|
-
};
|
|
882
|
-
|
|
883
|
-
/**
|
|
884
|
-
* @qin-ui/vant-pro 的表单组件实例引用 Hook
|
|
885
|
-
*
|
|
886
|
-
* @description 类型安全的 re-export。将 core useFormRef 的泛型参数绑定为 Vant 的 FormInstance。
|
|
887
|
-
*
|
|
888
|
-
* @returns {object} 表单组件实例引用管理对象
|
|
889
|
-
* @returns {Ref<FormInstance | undefined>} .formRef - Vant Form 实例的响应式引用
|
|
890
|
-
* @returns {Function} .setFormRef(inst) - 设置表单组件实例
|
|
891
|
-
*
|
|
892
|
-
* @example
|
|
893
|
-
* ```ts
|
|
894
|
-
* const { formRef, setFormRef } = useFormRef()
|
|
895
|
-
* formRef.value?.submit()
|
|
896
|
-
* ```
|
|
897
|
-
|
|
898
|
-
* @public
|
|
899
|
-
*/
|
|
900
|
-
export declare const useFormRef: {
|
|
901
|
-
(): ReturnType<typeof useFormRef_2<FormInstance>>;
|
|
902
|
-
};
|
|
903
|
-
|
|
904
|
-
/**
|
|
905
|
-
* 表单组件实例引用 Hook
|
|
906
|
-
*
|
|
907
|
-
* @description 用于获取和设置底层 UI 框架(如 ant-design-vue、element-plus)的 Form 组件实例。
|
|
908
|
-
* 在 ProForm 组件内部自动调用 setFormRef 绑定实例,外部可通过 formRef 访问。
|
|
909
|
-
*
|
|
910
|
-
* @template F - 底层 Form 组件实例类型,默认为 any
|
|
911
|
-
*
|
|
912
|
-
* @returns {object} 表单组件实例引用管理对象
|
|
913
|
-
* @returns {Ref<F | undefined>} .formRef - 表单组件实例的响应式引用
|
|
914
|
-
* @returns {Function} .setFormRef(inst) - 设置表单组件实例
|
|
915
|
-
*
|
|
916
|
-
* @example
|
|
917
|
-
* ```ts
|
|
918
|
-
* const { formRef, setFormRef } = useFormRef<InstanceType<typeof AForm>>()
|
|
919
|
-
* setFormRef(formComponentInstance)
|
|
920
|
-
* console.log(formRef.value) // 可通过 formRef 访问底层 Form 实例的方法
|
|
921
|
-
* ```
|
|
922
|
-
*/
|
|
923
|
-
declare const useFormRef_2: <F = any>() => {
|
|
924
|
-
formRef: Ref<F | undefined, F | undefined>;
|
|
925
|
-
setFormRef: (inst: F) => void;
|
|
926
|
-
};
|
|
927
|
-
|
|
928
|
-
declare type ValueFormatter = {
|
|
929
|
-
(val: any, oldVal: any): any;
|
|
930
|
-
} | {
|
|
931
|
-
get?: (val: any) => any;
|
|
932
|
-
set?: (val: any, oldVal: any) => any;
|
|
933
|
-
};
|
|
934
|
-
|
|
935
|
-
declare type VModelProps<T = any> = {
|
|
936
|
-
modelValue?: T;
|
|
937
|
-
'onUpdate:modelValue'?: (val: T) => void;
|
|
938
|
-
};
|
|
939
|
-
|
|
940
|
-
declare type WithCommon<T, D extends Data = Data> = WithRef<WithCommonBase<T> & BaseWithoutFields<D>>;
|
|
941
|
-
|
|
942
|
-
declare type WithCommonBase<T = unknown> = T & Partial<Omit<FieldProps, 'label' | 'name' | 'type'>>;
|
|
943
|
-
|
|
944
|
-
declare type WithComponent<T extends abstract new (...args: any) => any, D extends Data = Data> = WithCommon<{
|
|
945
|
-
slots?: Partial<ComponentSlots<T>>;
|
|
946
|
-
} & Partial<Omit<ComponentProps<T>, keyof VNodeProps>>, D>;
|
|
947
|
-
|
|
948
|
-
declare type WithFields<D extends Data = Data> = WithRef<WithCommonBase & BaseWithFields<D>>;
|
|
949
|
-
|
|
950
|
-
declare type WithRef<T> = {
|
|
951
|
-
[P in keyof T]: P extends NotSupportedRefOrGetterProps ? T[P] : T[P] extends (...args: any[]) => any ? T[P] : MaybeRefOrComputedRef<T[P]>;
|
|
952
|
-
};
|
|
953
|
-
|
|
954
|
-
export { }
|
|
1
|
+
import { App } from 'vue';
|
|
2
|
+
import { default as ProForm } from './components/form';
|
|
3
|
+
import { default as ProComponentProvider } from './components/component-provider';
|
|
4
|
+
export * from './components/form';
|
|
5
|
+
export * from './components/component-provider';
|
|
6
|
+
/**
|
|
7
|
+
* Schema 驱动的表单组件,基于 vant Form 封装
|
|
8
|
+
*
|
|
9
|
+
* @description 通过声明式 JSON Schema 配置即可快速生成表单,
|
|
10
|
+
* 提供极致的 TypeScript 类型推导与组件库插槽扩展能力。
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```vue
|
|
14
|
+
* <script setup lang="ts">
|
|
15
|
+
* import { ProForm, useForm } from '@qin-ui/vant-pro'
|
|
16
|
+
* const form = useForm<User>({ name: '' }, [
|
|
17
|
+
* { path: 'name', label: '姓名', component: 'input' }
|
|
18
|
+
* ])
|
|
19
|
+
* </script>
|
|
20
|
+
* <template>
|
|
21
|
+
* <ProForm :form="form" />
|
|
22
|
+
* </template>
|
|
23
|
+
* ```
|
|
24
|
+
*
|
|
25
|
+
* 组件提供者,用于全局配置 ProForm 的默认行为
|
|
26
|
+
*
|
|
27
|
+
* @description 通过 `ProComponentProvider` 包裹应用根组件,
|
|
28
|
+
* 可以全局覆盖组件的默认属性。
|
|
29
|
+
*
|
|
30
|
+
* @example
|
|
31
|
+
* ```vue
|
|
32
|
+
* <template>
|
|
33
|
+
* <ProComponentProvider :component-props="customProps">
|
|
34
|
+
* <App />
|
|
35
|
+
* </ProComponentProvider>
|
|
36
|
+
* </template>
|
|
37
|
+
* ```
|
|
38
|
+
*/
|
|
39
|
+
export { ProForm, ProComponentProvider };
|
|
40
|
+
declare const _default: {
|
|
41
|
+
/**
|
|
42
|
+
* @qin-ui/vant-pro 安装方法
|
|
43
|
+
* @description 全局注册所有组件(ProForm、ProComponentProvider)
|
|
44
|
+
*
|
|
45
|
+
* @param {App} app - Vue 应用实例
|
|
46
|
+
*
|
|
47
|
+
* @example
|
|
48
|
+
* ```ts
|
|
49
|
+
* import { createApp } from 'vue'
|
|
50
|
+
* import ProComponents from '@qin-ui/vant-pro'
|
|
51
|
+
* const app = createApp(App)
|
|
52
|
+
* app.use(ProComponents)
|
|
53
|
+
* ```
|
|
54
|
+
*/
|
|
55
|
+
install(app: App): void;
|
|
56
|
+
};
|
|
57
|
+
export default _default;
|
|
58
|
+
//# sourceMappingURL=index.d.ts.map
|