@iswangh/element-plus-kit-form 0.1.3 → 0.2.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/README.md +151 -18
- package/dist/FormAction.vue.d.ts +30 -4
- package/dist/FormAction.vue.d.ts.map +1 -1
- package/dist/FormItem.vue.d.ts +4 -18
- package/dist/FormItem.vue.d.ts.map +1 -1
- package/dist/composables/index.d.ts +2 -0
- package/dist/composables/index.d.ts.map +1 -1
- package/dist/composables/useAutoExpandOnHover.d.ts +15 -0
- package/dist/composables/useAutoExpandOnHover.d.ts.map +1 -0
- package/dist/composables/useChangeEventState.d.ts +5 -27
- package/dist/composables/useChangeEventState.d.ts.map +1 -1
- package/dist/composables/useClearState.d.ts +17 -0
- package/dist/composables/useClearState.d.ts.map +1 -0
- package/dist/config/action.d.ts +34 -0
- package/dist/config/action.d.ts.map +1 -0
- package/dist/config/comp.d.ts +48 -0
- package/dist/config/comp.d.ts.map +1 -0
- package/dist/config/form.d.ts +6 -0
- package/dist/config/form.d.ts.map +1 -0
- package/dist/config/index.d.ts +4 -65
- package/dist/config/index.d.ts.map +1 -1
- package/dist/config/scroll.d.ts +7 -0
- package/dist/config/scroll.d.ts.map +1 -0
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1197 -382
- package/dist/style.css +1 -1
- package/dist/types/action.d.ts +58 -11
- package/dist/types/common.d.ts +5 -4
- package/dist/types/comp.d.ts +93 -0
- package/dist/types/el.d.ts +8 -8
- package/dist/types/form-item.d.ts +31 -92
- package/dist/types/index.d.ts +3 -0
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/layout.d.ts +6 -0
- package/dist/types/options.d.ts +15 -31
- package/dist/types/scope.d.ts +34 -0
- package/dist/utils/action.d.ts +10 -0
- package/dist/utils/action.d.ts.map +1 -0
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/lodash.d.ts +6 -0
- package/dist/utils/lodash.d.ts.map +1 -0
- package/dist/utils/options.d.ts.map +1 -1
- package/dist/utils/value.d.ts +13 -5
- package/dist/utils/value.d.ts.map +1 -1
- package/package.json +5 -6
package/dist/types/action.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { ButtonProps } from 'element-plus';
|
|
2
|
+
import { Condition } from './common';
|
|
2
3
|
/**
|
|
3
4
|
* 标准化的表单操作按钮配置项
|
|
4
5
|
*
|
|
@@ -6,23 +7,69 @@ import { ButtonProps } from 'element-plus';
|
|
|
6
7
|
* @property {string} label 按钮文字
|
|
7
8
|
* @property {string} eventName 事件名称
|
|
8
9
|
*/
|
|
9
|
-
export interface
|
|
10
|
+
export interface FormActionButtonItem extends Partial<ButtonProps> {
|
|
10
11
|
label?: string
|
|
11
12
|
eventName: string
|
|
12
13
|
}
|
|
13
14
|
|
|
14
|
-
/**
|
|
15
|
-
|
|
15
|
+
/**
|
|
16
|
+
* 表单操作按钮配置项
|
|
17
|
+
*
|
|
18
|
+
* 可以是标准化的按钮配置对象,也可以是预定义的按钮类型字符串
|
|
19
|
+
*/
|
|
20
|
+
export type FormActionButtons = FormActionButtonItem | 'submit' | 'cancel' | 'search' | 'reset' | 'expand'
|
|
16
21
|
|
|
17
22
|
/**
|
|
18
|
-
*
|
|
23
|
+
* 展开规则基础配置
|
|
19
24
|
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
22
|
-
*
|
|
25
|
+
* **鼠标悬停自动展开**:
|
|
26
|
+
* - `autoExpandOnHover`:是否启用鼠标悬停自动展开功能
|
|
27
|
+
* - 当鼠标移入表单区域时自动展开(延迟 500ms)
|
|
28
|
+
* - 如果用户手动点击展开/收起按钮,则锁定状态,不再受鼠标移入影响
|
|
29
|
+
*
|
|
30
|
+
* **展开/收起后自动滚动**:
|
|
31
|
+
* - `scrollOnToggle`:是否在展开/收起后自动滚动到表单中心
|
|
32
|
+
* - 默认值为 false
|
|
33
|
+
* - 启用后,展开/收起动画完成后会自动滚动,使表单保持在页面中心
|
|
34
|
+
* - `scrollIntoViewOptions`:自定义滚动选项(仅在 `scrollOnToggle` 为 true 时生效)
|
|
35
|
+
* - 用于自定义 `scrollIntoView` 的行为(如 `block`、`behavior`、`inline` 等)
|
|
36
|
+
* - 默认值为 `{ behavior: 'smooth', block: 'center', inline: 'nearest' }`
|
|
37
|
+
* - 支持所有 `ScrollIntoViewOptions` 类型的选项配置
|
|
38
|
+
*/
|
|
39
|
+
export interface FormExpandRuleBase {
|
|
40
|
+
/** 是否启用鼠标悬停自动展开功能 */
|
|
41
|
+
autoExpandOnHover?: boolean
|
|
42
|
+
/** 是否在展开/收起后自动滚动到表单中心 */
|
|
43
|
+
scrollOnToggle?: boolean
|
|
44
|
+
/** 滚动选项配置(用于自定义 scrollIntoView 的行为) */
|
|
45
|
+
scrollIntoViewOptions?: ScrollIntoViewOptions
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
/**
|
|
49
|
+
* 默认展开规则(联合类型)
|
|
50
|
+
*
|
|
51
|
+
* 用于配置表单默认展开哪些字段,支持三种配置方式:
|
|
52
|
+
* - `count`:按字段数量展开(从第一个开始)
|
|
53
|
+
* - `include`:指定展示的字段(白名单,字段 prop 数组)
|
|
54
|
+
* - `exclude`:指定折叠的字段(黑名单,字段 prop 数组)
|
|
55
|
+
*
|
|
56
|
+
* **配置优先级**:`exclude` > `include` > `count`
|
|
57
|
+
*/
|
|
58
|
+
export type FormExpandRule
|
|
59
|
+
= | ({ count: number } & FormExpandRuleBase)
|
|
60
|
+
| ({ include: string[] } & FormExpandRuleBase)
|
|
61
|
+
| ({ exclude: string[] } & FormExpandRuleBase)
|
|
62
|
+
|
|
63
|
+
/**
|
|
64
|
+
* 表单操作项配置
|
|
23
65
|
*/
|
|
24
|
-
export interface
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
66
|
+
export interface FormActionConfig {
|
|
67
|
+
/** 是否显示操作区域(支持函数动态判断) */
|
|
68
|
+
vIf?: Condition
|
|
69
|
+
/** 是否显示操作区域(支持函数动态判断,使用 v-show) */
|
|
70
|
+
vShow?: Condition
|
|
71
|
+
/** 操作按钮配置数组 */
|
|
72
|
+
buttons?: FormActionButtons[]
|
|
73
|
+
/** 默认展开规则(仅在 buttons 包含 'expand' 时生效) */
|
|
74
|
+
expand?: FormExpandRule
|
|
28
75
|
}
|
package/dist/types/common.d.ts
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
/* eslint-disable ts/no-explicit-any */
|
|
2
2
|
/** 允许数组类型 */
|
|
3
3
|
export type Arrayable<T> = T | T[]
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
|
-
*
|
|
7
|
-
*
|
|
6
|
+
* 条件类型
|
|
7
|
+
* 支持布尔值或接收数据的函数
|
|
8
|
+
* @template T - 数据类型,默认为 Record<string, any>
|
|
8
9
|
*/
|
|
9
|
-
export type
|
|
10
|
+
export type Condition<T = Record<string, any>> = boolean | ((data: T) => boolean)
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
import { ElAutocomplete, ElCascader, ElCheckboxGroup, ElColorPicker, ElColorPickerPanel, ElDatePicker, ElDatePickerPanel, ElInput, ElInputNumber, ElInputTag, ElMention, ElRadioGroup, ElRate, ElSelect, ElSelectV2, ElSlider, ElSwitch, ElTimePicker, ElTimeSelect, ElTransfer, ElTreeSelect } from 'element-plus';
|
|
2
|
+
import { EXPAND_COMP_MAP } from '../config';
|
|
3
|
+
/**
|
|
4
|
+
* Element Plus 组件映射类型
|
|
5
|
+
*
|
|
6
|
+
* 手动定义类型映射,避免从 EL_COMP_MAP 使用 typeof 时类型推断超出编译器序列化限制
|
|
7
|
+
* 与 comp.ts 中的 EL_COMP_MAP 保持同步
|
|
8
|
+
*/
|
|
9
|
+
interface ElCompMap {
|
|
10
|
+
readonly 'autocomplete': typeof ElAutocomplete
|
|
11
|
+
readonly 'cascader': typeof ElCascader
|
|
12
|
+
readonly 'checkbox': typeof ElCheckboxGroup
|
|
13
|
+
readonly 'color-picker-panel': typeof ElColorPickerPanel
|
|
14
|
+
readonly 'color-picker': typeof ElColorPicker
|
|
15
|
+
readonly 'date-picker-panel': typeof ElDatePickerPanel
|
|
16
|
+
readonly 'date-picker': typeof ElDatePicker
|
|
17
|
+
readonly 'input': typeof ElInput
|
|
18
|
+
readonly 'input-number': typeof ElInputNumber
|
|
19
|
+
readonly 'input-tag': typeof ElInputTag
|
|
20
|
+
readonly 'mention': typeof ElMention
|
|
21
|
+
readonly 'radio': typeof ElRadioGroup
|
|
22
|
+
readonly 'rate': typeof ElRate
|
|
23
|
+
readonly 'select': typeof ElSelect
|
|
24
|
+
readonly 'select-v2': typeof ElSelectV2
|
|
25
|
+
readonly 'slider': typeof ElSlider
|
|
26
|
+
readonly 'switch': typeof ElSwitch
|
|
27
|
+
readonly 'time-picker': typeof ElTimePicker
|
|
28
|
+
readonly 'time-select': typeof ElTimeSelect
|
|
29
|
+
readonly 'transfer': typeof ElTransfer
|
|
30
|
+
readonly 'tree-select': typeof ElTreeSelect
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
/**
|
|
34
|
+
* 表单组件配置映射类型
|
|
35
|
+
*
|
|
36
|
+
* 合并 Element Plus 组件映射和扩展组件映射的类型
|
|
37
|
+
* - ElCompMap: 手动定义,避免类型推断超出限制
|
|
38
|
+
* - typeof EXPAND_COMP_MAP: 从运行时值提取类型(简单映射,不会超出限制)
|
|
39
|
+
*
|
|
40
|
+
* 注意:不使用 typeof FORM_ITEM_COMP_MAP,因为 FORM_ITEM_COMP_MAP 使用了
|
|
41
|
+
* Record<string, any> 避免类型推断超出编译器序列化限制
|
|
42
|
+
*/
|
|
43
|
+
export type FormCompConfig = ElCompMap & typeof EXPAND_COMP_MAP
|
|
44
|
+
|
|
45
|
+
/**
|
|
46
|
+
* 支持的表单组件枚举
|
|
47
|
+
*
|
|
48
|
+
* 显式定义所有可用的组件键名,确保类型提示正常工作
|
|
49
|
+
* 注意:由于 FORM_ITEM_COMP_MAP 使用了 Record<string, any> 避免类型推断超出限制,
|
|
50
|
+
* 我们需要显式定义键名类型,而不是从 typeof FORM_ITEM_COMP_MAP 中提取
|
|
51
|
+
*/
|
|
52
|
+
export type FormItemComp
|
|
53
|
+
= | 'autocomplete'
|
|
54
|
+
| 'cascader'
|
|
55
|
+
| 'checkbox'
|
|
56
|
+
| 'color-picker'
|
|
57
|
+
| 'color-picker-panel'
|
|
58
|
+
| 'date-picker'
|
|
59
|
+
| 'date-picker-panel'
|
|
60
|
+
| 'input'
|
|
61
|
+
| 'input-number'
|
|
62
|
+
| 'input-tag'
|
|
63
|
+
| 'mention'
|
|
64
|
+
| 'radio'
|
|
65
|
+
| 'rate'
|
|
66
|
+
| 'select'
|
|
67
|
+
| 'select-v2'
|
|
68
|
+
| 'slider'
|
|
69
|
+
| 'switch'
|
|
70
|
+
| 'time-picker'
|
|
71
|
+
| 'time-select'
|
|
72
|
+
| 'transfer'
|
|
73
|
+
| 'tree-select'
|
|
74
|
+
| 'custom'
|
|
75
|
+
|
|
76
|
+
/**
|
|
77
|
+
* 根据组件类型获取组件实例类型
|
|
78
|
+
* @template T 组件类型
|
|
79
|
+
*/
|
|
80
|
+
export type FormItemCompInstance<T extends FormItemComp> = InstanceType<FormCompConfig[T]>
|
|
81
|
+
|
|
82
|
+
/**
|
|
83
|
+
* 根据组件类型获取组件完整 Props 类型(包含事件处理器)
|
|
84
|
+
* @template T 组件类型
|
|
85
|
+
*/
|
|
86
|
+
type FormItemCompPropsFull<T extends FormItemComp> = FormItemCompInstance<T>['$props']
|
|
87
|
+
|
|
88
|
+
/**
|
|
89
|
+
* 根据组件类型推断对应的 Props 类型(排除事件处理器)
|
|
90
|
+
* @template T - 组件类型
|
|
91
|
+
*/
|
|
92
|
+
export type FormItemCompProps<T extends FormItemComp = FormItemComp>
|
|
93
|
+
= Omit<FormItemCompPropsFull<T>, `on${string}`>
|
package/dist/types/el.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ElCol, ElRow, FormItemInstance, FormRules } from 'element-plus';
|
|
2
2
|
/**
|
|
3
|
-
* Element Plus Form
|
|
3
|
+
* Element Plus Form Props
|
|
4
4
|
*
|
|
5
5
|
* 由于 `FormInstance['$slots']` 类型定义存在问题,
|
|
6
6
|
* 暂时无法直接使用 `FormInstance['$props']`,
|
|
@@ -8,7 +8,7 @@ import { ElCol, ElRow, FormItemInstance, FormRules } from 'element-plus';
|
|
|
8
8
|
*
|
|
9
9
|
* @see {@link https://element-plus.org/zh-CN/component/form.html#form-attributes Element Plus Form Attributes}
|
|
10
10
|
*/
|
|
11
|
-
export interface
|
|
11
|
+
export interface ElFormProps {
|
|
12
12
|
// 数据相关
|
|
13
13
|
model?: Record<string, any>
|
|
14
14
|
rules?: FormRules
|
|
@@ -33,11 +33,11 @@ export interface ElFormAttrs {
|
|
|
33
33
|
scrollIntoViewOptions?: ScrollIntoViewOptions
|
|
34
34
|
}
|
|
35
35
|
|
|
36
|
-
/** Element Plus FormItem
|
|
37
|
-
export type
|
|
36
|
+
/** Element Plus FormItem Props */
|
|
37
|
+
export type ElFormItemProps = FormItemInstance['$props']
|
|
38
38
|
|
|
39
|
-
/** Element Plus Row
|
|
40
|
-
export type
|
|
39
|
+
/** Element Plus Row 组件 Props */
|
|
40
|
+
export type ElRowProps = InstanceType<typeof ElRow>['$props']
|
|
41
41
|
|
|
42
|
-
/** Element Plus Col
|
|
43
|
-
export type
|
|
42
|
+
/** Element Plus Col 组件 Props */
|
|
43
|
+
export type ElColProps = InstanceType<typeof ElCol>['$props']
|
|
@@ -1,109 +1,48 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
/** Col 布局属性(Element Plus Col 组件属性) */
|
|
8
|
-
export type ColAttrs = ElColAttrs
|
|
9
|
-
|
|
1
|
+
import { Condition } from './common';
|
|
2
|
+
import { FormItemComp, FormItemCompProps } from './comp';
|
|
3
|
+
import { ElFormItemProps } from './el';
|
|
4
|
+
import { ColProps } from './layout';
|
|
5
|
+
import { InferOptionsType, IsOptionsSupported } from './options';
|
|
10
6
|
/**
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
*
|
|
14
|
-
* 注意:由于 FORM_ITEM_COMP_MAP 使用了 Record<string, any> 避免类型推断超出限制,
|
|
15
|
-
* 我们需要显式定义键名类型,而不是从 typeof FORM_ITEM_COMP_MAP 中提取
|
|
7
|
+
* 根据组件类型推断 options 类型
|
|
8
|
+
* 只有支持 options 的组件才会扩展 options 类型
|
|
9
|
+
* @template T - 组件类型
|
|
16
10
|
*/
|
|
17
|
-
export type FormItemComp
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
| 'checkbox'
|
|
21
|
-
| 'color-picker'
|
|
22
|
-
| 'color-picker-panel'
|
|
23
|
-
| 'date-picker'
|
|
24
|
-
| 'date-picker-panel'
|
|
25
|
-
| 'input'
|
|
26
|
-
| 'input-number'
|
|
27
|
-
| 'input-tag'
|
|
28
|
-
| 'mention'
|
|
29
|
-
| 'radio'
|
|
30
|
-
| 'rate'
|
|
31
|
-
| 'select'
|
|
32
|
-
| 'select-v2'
|
|
33
|
-
| 'slider'
|
|
34
|
-
| 'switch'
|
|
35
|
-
| 'time-picker'
|
|
36
|
-
| 'time-select'
|
|
37
|
-
| 'transfer'
|
|
38
|
-
| 'tree-select'
|
|
39
|
-
| 'custom'
|
|
11
|
+
export type FormItemOptions<T extends FormItemComp> = IsOptionsSupported<T> extends true
|
|
12
|
+
? InferOptionsType<T>
|
|
13
|
+
: never
|
|
40
14
|
|
|
41
15
|
/**
|
|
42
|
-
*
|
|
16
|
+
* 根据组件类型推断 compProps 类型(扩展版本)
|
|
17
|
+
* 支持扩展属性,如 options 等
|
|
43
18
|
* @template T - 组件类型
|
|
44
19
|
*/
|
|
45
|
-
export type
|
|
46
|
-
|
|
20
|
+
export type FormItemCompPropsExtended<T extends FormItemComp> = IsOptionsSupported<T> extends true
|
|
21
|
+
? Omit<FormItemCompProps<T>, 'options'> & { options?: FormItemOptions<T> } // 支持 options 的组件:先排除原始 options,再添加扩展的 options 类型
|
|
22
|
+
: FormItemCompProps<T> // 不支持 options 的组件:使用原始 Props 类型
|
|
47
23
|
|
|
48
24
|
/**
|
|
49
|
-
*
|
|
50
|
-
* 只有支持 options 的组件才会扩展 options 类型
|
|
51
|
-
* @template C - 组件类型
|
|
52
|
-
*/
|
|
53
|
-
export type FormItemOptions<C extends FormItemComp> = IsOptionsSupported<C> extends true
|
|
54
|
-
? InferOptionsType<C, GetComponentOptionsType<C>>
|
|
55
|
-
: never
|
|
56
|
-
|
|
57
|
-
/**
|
|
58
|
-
* FormItem 属性
|
|
25
|
+
* FormItem Props
|
|
59
26
|
*
|
|
60
|
-
* 扩展自 Element Plus 的 FormItem
|
|
27
|
+
* 扩展自 Element Plus 的 FormItem 组件 Props,添加了自定义配置选项
|
|
61
28
|
*
|
|
62
|
-
* @template
|
|
63
|
-
* @extends {
|
|
64
|
-
* @property {
|
|
65
|
-
* @property {
|
|
66
|
-
* @property {
|
|
67
|
-
* @property {
|
|
29
|
+
* @template T - 组件类型
|
|
30
|
+
* @extends {ElFormItemProps} Element Plus FormItem 组件原始 Props
|
|
31
|
+
* @property {T} compType 使用的组件类型
|
|
32
|
+
* @property {FormItemCompPropsExtended<T>} [compProps] 传递给组件的 Props 配置对象
|
|
33
|
+
* @property {Condition} [vIf] 条件渲染控制,支持布尔值或接收表单数据的函数
|
|
34
|
+
* @property {Condition} [vShow] 显示/隐藏控制,支持布尔值或接收表单数据的函数
|
|
68
35
|
*
|
|
69
36
|
* @see {@link https://element-plus.org/zh-CN/component/form.html#form-item-attributes Element Plus Form Item Attributes}
|
|
70
37
|
*/
|
|
71
|
-
export interface FormItem<
|
|
72
|
-
C extends FormItemComp = FormItemComp,
|
|
73
|
-
> extends ElFormItemAttrs {
|
|
38
|
+
export interface FormItem<T extends FormItemComp = FormItemComp> extends ElFormItemProps {
|
|
74
39
|
prop: string
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
vShow?: boolean | ((data: Record<string, any>) => boolean)
|
|
81
|
-
colAttrs?: ColAttrs
|
|
40
|
+
compType: T
|
|
41
|
+
compProps?: FormItemCompPropsExtended<T>
|
|
42
|
+
vIf?: Condition
|
|
43
|
+
vShow?: Condition
|
|
44
|
+
colProps?: ColProps
|
|
82
45
|
}
|
|
83
46
|
|
|
84
|
-
/** formItems 配置类型 - 推断每一项的
|
|
47
|
+
/** formItems 配置类型 - 推断每一项的 compType 对应的组件类型 */
|
|
85
48
|
export type FormItems = { [K in FormItemComp]: FormItem<K> }[FormItemComp][]
|
|
86
|
-
|
|
87
|
-
/**
|
|
88
|
-
* 事件拓展参数
|
|
89
|
-
* @template K 属性名类型
|
|
90
|
-
*/
|
|
91
|
-
export interface EventExtendedParams<K = string> {
|
|
92
|
-
prop: K
|
|
93
|
-
index: number
|
|
94
|
-
formItem: FormItem
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
/**
|
|
98
|
-
* 表单项插槽作用域参数
|
|
99
|
-
*
|
|
100
|
-
* @property {any} value 当前表单项组件的值
|
|
101
|
-
* @property {Record<string, any>} form 表单数据
|
|
102
|
-
* @property {FormItem} formItem 表单项配置
|
|
103
|
-
*/
|
|
104
|
-
export interface FormItemSlotScope {
|
|
105
|
-
value: any
|
|
106
|
-
form: Record<string, any>
|
|
107
|
-
formItem: FormItem
|
|
108
|
-
[key: string]: any // 允许 el-form-item 的其他作用域参数
|
|
109
|
-
}
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
export type * from './action';
|
|
2
2
|
export type * from './common';
|
|
3
|
+
export type * from './comp';
|
|
3
4
|
export type * from './el';
|
|
4
5
|
export type * from './form-item';
|
|
6
|
+
export type * from './layout';
|
|
5
7
|
export type * from './options';
|
|
8
|
+
export type * from './scope';
|
|
6
9
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA,mBAAmB,UAAU,CAAA;AAC7B,mBAAmB,UAAU,CAAA;AAC7B,mBAAmB,MAAM,CAAA;AACzB,mBAAmB,aAAa,CAAA;AAChC,mBAAmB,WAAW,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA,mBAAmB,UAAU,CAAA;AAC7B,mBAAmB,UAAU,CAAA;AAC7B,mBAAmB,QAAQ,CAAA;AAC3B,mBAAmB,MAAM,CAAA;AACzB,mBAAmB,aAAa,CAAA;AAChC,mBAAmB,UAAU,CAAA;AAC7B,mBAAmB,WAAW,CAAA;AAC9B,mBAAmB,SAAS,CAAA"}
|
package/dist/types/options.d.ts
CHANGED
|
@@ -1,29 +1,28 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { FormItemComp } from './form-item';
|
|
1
|
+
import { FormItemComp, FormItemCompProps } from './comp';
|
|
3
2
|
/**
|
|
4
3
|
* 检查组件类型是否包含 options 属性
|
|
5
4
|
* 通过检查组件实例的 $props 中是否包含 'options' 来判断
|
|
6
|
-
* @template
|
|
5
|
+
* @template T 组件类型
|
|
7
6
|
*/
|
|
8
|
-
type HasOptionsProp<
|
|
7
|
+
type HasOptionsProp<T extends FormItemComp> = 'options' extends keyof FormItemCompProps<T>
|
|
9
8
|
? true
|
|
10
9
|
: false
|
|
11
10
|
|
|
12
11
|
/**
|
|
13
12
|
* 判断组件是否支持 options 属性
|
|
14
13
|
* 动态从组件类型定义中判断,不硬编码组件名称
|
|
15
|
-
* @template
|
|
14
|
+
* @template T 组件类型
|
|
16
15
|
*/
|
|
17
|
-
export type IsOptionsSupported<
|
|
16
|
+
export type IsOptionsSupported<T extends FormItemComp> = HasOptionsProp<T>
|
|
18
17
|
|
|
19
18
|
/**
|
|
20
19
|
* 支持 options 属性的组件类型
|
|
21
20
|
* 通过类型系统自动提取,不硬编码
|
|
22
21
|
*/
|
|
23
|
-
export type OptionsSupportedComp = FormItemComp extends infer
|
|
24
|
-
?
|
|
25
|
-
? IsOptionsSupported<
|
|
26
|
-
?
|
|
22
|
+
export type OptionsSupportedComp = FormItemComp extends infer T
|
|
23
|
+
? T extends FormItemComp
|
|
24
|
+
? IsOptionsSupported<T> extends true
|
|
25
|
+
? T
|
|
27
26
|
: never
|
|
28
27
|
: never
|
|
29
28
|
: never
|
|
@@ -58,32 +57,17 @@ export interface OptionsConfig {
|
|
|
58
57
|
|
|
59
58
|
/**
|
|
60
59
|
* 根据组件类型推断 options 类型
|
|
61
|
-
* @template
|
|
62
|
-
* @template T 组件实例类型
|
|
60
|
+
* @template T 组件类型
|
|
63
61
|
*/
|
|
64
|
-
export type InferOptionsType<
|
|
65
|
-
?
|
|
62
|
+
export type InferOptionsType<T extends FormItemComp> = IsOptionsSupported<T> extends true
|
|
63
|
+
? OptionsLoader | OptionsConfig | any[]
|
|
66
64
|
: never
|
|
67
65
|
|
|
68
66
|
/**
|
|
69
67
|
* 获取组件原始的 options 类型
|
|
70
68
|
* 从组件实例的 $props 中提取 options 属性的类型
|
|
71
|
-
* @template
|
|
69
|
+
* @template T 组件类型
|
|
72
70
|
*/
|
|
73
|
-
export type
|
|
74
|
-
?
|
|
71
|
+
export type GetCompOptionsType<T extends FormItemComp> = IsOptionsSupported<T> extends true
|
|
72
|
+
? FormItemCompProps<T>['options']
|
|
75
73
|
: never
|
|
76
|
-
|
|
77
|
-
/**
|
|
78
|
-
* 检查组件类型是否包含 loading 属性
|
|
79
|
-
* @template C 组件类型
|
|
80
|
-
*/
|
|
81
|
-
type HasLoadingProp<C extends FormItemComp> = 'loading' extends keyof InstanceType<FormCompConfig[C]>['$props']
|
|
82
|
-
? true
|
|
83
|
-
: false
|
|
84
|
-
|
|
85
|
-
/**
|
|
86
|
-
* 判断组件是否支持 loading 属性
|
|
87
|
-
* @template C 组件类型
|
|
88
|
-
*/
|
|
89
|
-
export type IsLoadingSupported<C extends FormItemComp> = HasLoadingProp<C>
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { FormItem } from './form-item';
|
|
2
|
+
/**
|
|
3
|
+
* 表单项事件扩展参数
|
|
4
|
+
*
|
|
5
|
+
* 表单组件事件的扩展参数,包含字段名、索引和表单项配置
|
|
6
|
+
* 用于 change 等事件,未来可扩展用于其他表单项相关事件
|
|
7
|
+
*
|
|
8
|
+
* @template K 属性名类型
|
|
9
|
+
* @property {K} prop 表单字段名
|
|
10
|
+
* @property {number} index 表单项索引
|
|
11
|
+
* @property {FormItem} formItem 表单项配置
|
|
12
|
+
*/
|
|
13
|
+
export interface FormItemEventExtendedParams<K = string> {
|
|
14
|
+
prop: K
|
|
15
|
+
index: number
|
|
16
|
+
formItem: FormItem
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
/**
|
|
20
|
+
* 表单项插槽作用域参数
|
|
21
|
+
*
|
|
22
|
+
* 表单项插槽的作用域参数,包含当前值、表单数据和表单项配置
|
|
23
|
+
* 用于 form-item 插槽、动态组件插槽、自定义组件插槽等
|
|
24
|
+
*
|
|
25
|
+
* @property {any} value 当前表单项组件的值
|
|
26
|
+
* @property {Record<string, any>} form 表单数据
|
|
27
|
+
* @property {FormItem} formItem 表单项配置
|
|
28
|
+
*/
|
|
29
|
+
export interface FormItemSlotScope {
|
|
30
|
+
value: any
|
|
31
|
+
form: Record<string, any>
|
|
32
|
+
formItem: FormItem
|
|
33
|
+
[key: string]: any // 允许 el-form-item 的其他作用域参数
|
|
34
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { FormActionButtons } from '../types';
|
|
2
|
+
/**
|
|
3
|
+
* 判断按钮列表中是否包含指定的事件名
|
|
4
|
+
*
|
|
5
|
+
* @param buttons - 按钮配置数组
|
|
6
|
+
* @param eventName - 事件名称
|
|
7
|
+
* @returns 是否包含该事件名
|
|
8
|
+
*/
|
|
9
|
+
export declare function hasButtonEvent(buttons: FormActionButtons[] | string[] | undefined, eventName: string): boolean;
|
|
10
|
+
//# sourceMappingURL=action.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"action.d.ts","sourceRoot":"","sources":["../../src/utils/action.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAEjD;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,OAAO,EAAE,iBAAiB,EAAE,GAAG,MAAM,EAAE,GAAG,SAAS,EAAE,SAAS,EAAE,MAAM,GAAG,OAAO,CAI9G"}
|
package/dist/utils/index.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"lodash.d.ts","sourceRoot":"","sources":["../../src/utils/lodash.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"options.d.ts","sourceRoot":"","sources":["../../src/utils/options.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AAE7C;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAO1E;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,
|
|
1
|
+
{"version":3,"file":"options.d.ts","sourceRoot":"","sources":["../../src/utils/options.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AAE7C;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAO1E;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAGtH;AAED;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,GAAG,GAAG,OAAO,IAAI,aAAa,CAEtE"}
|
package/dist/utils/value.d.ts
CHANGED
|
@@ -1,13 +1,21 @@
|
|
|
1
1
|
/**
|
|
2
|
-
*
|
|
2
|
+
* 检查值是否在选项中的参数
|
|
3
3
|
*/
|
|
4
|
-
export
|
|
4
|
+
export interface CheckValueInOptionsParams {
|
|
5
|
+
/** 当前值(支持单个值或数组值) */
|
|
6
|
+
modelValue: any;
|
|
7
|
+
/** 选项数组 */
|
|
8
|
+
options: any[];
|
|
9
|
+
/** 表单项配置,用于获取组件类型等信息 */
|
|
10
|
+
formItem: {
|
|
11
|
+
compType: string;
|
|
12
|
+
};
|
|
13
|
+
}
|
|
5
14
|
/**
|
|
6
15
|
* 检查当前值是否在新的选项中
|
|
7
16
|
* 用于判断是否需要自动清理值:如果值在新的选项中,保留;否则清理
|
|
8
|
-
* @param
|
|
9
|
-
* @param options - 选项数组
|
|
17
|
+
* @param params - 检查参数
|
|
10
18
|
* @returns 是否在选项中(true 表示在选项中,不需要清理;false 表示不在,需要清理)
|
|
11
19
|
*/
|
|
12
|
-
export declare function checkValueInOptions(
|
|
20
|
+
export declare function checkValueInOptions(params: CheckValueInOptionsParams): boolean;
|
|
13
21
|
//# sourceMappingURL=value.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"value.d.ts","sourceRoot":"","sources":["../../src/utils/value.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"value.d.ts","sourceRoot":"","sources":["../../src/utils/value.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,MAAM,WAAW,yBAAyB;IACxC,qBAAqB;IACrB,UAAU,EAAE,GAAG,CAAA;IACf,WAAW;IACX,OAAO,EAAE,GAAG,EAAE,CAAA;IACd,wBAAwB;IACxB,QAAQ,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAA;CAC/B;AA4BD;;;;;GAKG;AACH,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,yBAAyB,GAAG,OAAO,CA+B9E"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@iswangh/element-plus-kit-form",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.2.0",
|
|
5
5
|
"description": "Element Plus Kit 表单组件包",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"sideEffects": [
|
|
@@ -31,10 +31,12 @@
|
|
|
31
31
|
"vue": "^3.5.23"
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"
|
|
34
|
+
"lodash-es": "^4.17.21",
|
|
35
|
+
"@iswangh/element-plus-kit-core": "0.2.0"
|
|
35
36
|
},
|
|
36
37
|
"devDependencies": {
|
|
37
38
|
"@element-plus/icons-vue": "^2.3.2",
|
|
39
|
+
"@types/lodash-es": "^4.17.12",
|
|
38
40
|
"@vitejs/plugin-vue": "^6.0.1",
|
|
39
41
|
"element-plus": "^2.11.8",
|
|
40
42
|
"sass": "^1.94.0",
|
|
@@ -50,9 +52,6 @@
|
|
|
50
52
|
"scripts": {
|
|
51
53
|
"build": "vite build",
|
|
52
54
|
"dev": "vite build --watch",
|
|
53
|
-
"type-check": "vue-tsc --
|
|
54
|
-
"publish:patch": "pnpm version patch --no-git-tag-version && pnpm publish",
|
|
55
|
-
"publish:minor": "pnpm version minor --no-git-tag-version && pnpm publish",
|
|
56
|
-
"publish:major": "pnpm version major --no-git-tag-version && pnpm publish"
|
|
55
|
+
"type-check": "vue-tsc --build"
|
|
57
56
|
}
|
|
58
57
|
}
|