mirror of
https://github.com/element-plus/element-plus.git
synced 2025-08-16 20:34:20 +08:00
125 lines
3.2 KiB
TypeScript
125 lines
3.2 KiB
TypeScript
import { componentSizes } from '@element-plus/constants'
|
|
import {
|
|
buildProps,
|
|
definePropType,
|
|
isArray,
|
|
isBoolean,
|
|
isString,
|
|
} from '@element-plus/utils'
|
|
|
|
import type { ExtractPropTypes, __ExtractPublicPropTypes } from 'vue'
|
|
import type { FormItemProp } from './form-item'
|
|
import type { FormRules } from './types'
|
|
|
|
export const formMetaProps = buildProps({
|
|
/**
|
|
* @description Control the size of components in this form.
|
|
*/
|
|
size: {
|
|
type: String,
|
|
values: componentSizes,
|
|
},
|
|
/**
|
|
* @description Whether to disable all components in this form. If set to `true`, it will override the `disabled` prop of the inner component.
|
|
*/
|
|
disabled: Boolean,
|
|
} as const)
|
|
|
|
export const formProps = buildProps({
|
|
...formMetaProps,
|
|
/**
|
|
* @description Data of form component.
|
|
*/
|
|
model: Object,
|
|
/**
|
|
* @description Validation rules of form.
|
|
*/
|
|
rules: {
|
|
type: definePropType<FormRules>(Object),
|
|
},
|
|
/**
|
|
* @description Position of label. If set to `'left'` or `'right'`, `label-width` prop is also required.
|
|
*/
|
|
labelPosition: {
|
|
type: String,
|
|
values: ['left', 'right', 'top'],
|
|
default: 'right',
|
|
},
|
|
/**
|
|
* @description Position of asterisk.
|
|
*/
|
|
requireAsteriskPosition: {
|
|
type: String,
|
|
values: ['left', 'right'],
|
|
default: 'left',
|
|
},
|
|
/**
|
|
* @description Width of label, e.g. `'50px'`. All its direct child form items will inherit this value. `auto` is supported.
|
|
*/
|
|
labelWidth: {
|
|
type: [String, Number],
|
|
default: '',
|
|
},
|
|
/**
|
|
* @description Suffix of the label.
|
|
*/
|
|
labelSuffix: {
|
|
type: String,
|
|
default: '',
|
|
},
|
|
/**
|
|
* @description Whether the form is inline.
|
|
*/
|
|
inline: Boolean,
|
|
/**
|
|
* @description Whether to display the error message inline with the form item.
|
|
*/
|
|
inlineMessage: Boolean,
|
|
/**
|
|
* @description Whether to display an icon indicating the validation result.
|
|
*/
|
|
statusIcon: Boolean,
|
|
/**
|
|
* @description Whether to show the error message.
|
|
*/
|
|
showMessage: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
/**
|
|
* @description Whether to trigger validation when the `rules` prop is changed.
|
|
*/
|
|
validateOnRuleChange: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
/**
|
|
* @description Whether to hide required fields should have a red asterisk (star) beside their labels.
|
|
*/
|
|
hideRequiredAsterisk: Boolean,
|
|
/**
|
|
* @description When validation fails, scroll to the first error form entry.
|
|
*/
|
|
scrollToError: Boolean,
|
|
/**
|
|
* @description When validation fails, it scrolls to the first error item based on the scrollIntoView option.
|
|
*/
|
|
scrollIntoViewOptions: {
|
|
type: definePropType<ScrollIntoViewOptions | boolean>([Object, Boolean]),
|
|
default: true,
|
|
},
|
|
} as const)
|
|
export type FormProps = ExtractPropTypes<typeof formProps>
|
|
export type FormPropsPublic = __ExtractPublicPropTypes<typeof formProps>
|
|
|
|
export type FormMetaProps = ExtractPropTypes<typeof formMetaProps>
|
|
export type FormMetaPropsPublic = __ExtractPublicPropTypes<typeof formMetaProps>
|
|
|
|
export const formEmits = {
|
|
validate: (prop: FormItemProp, isValid: boolean, message: string) =>
|
|
(isArray(prop) || isString(prop)) &&
|
|
isBoolean(isValid) &&
|
|
isString(message),
|
|
}
|
|
export type FormEmits = typeof formEmits
|