mirror of
https://github.com/element-plus/element-plus.git
synced 2026-03-13 07:51:17 +08:00
* refactor(tokens): [form] - remove tokens/form * Move content in tokens/form to components/form. * Replace token imports in components/form. * chore: remove form/tokens and replace imports * refactor(components): [form/form-item] * Move `useForm` related hooks to components/form * Replace references to reduce circular dependencies.
121 lines
2.6 KiB
TypeScript
121 lines
2.6 KiB
TypeScript
import { useFormSizeProp } from '@element-plus/components/form'
|
|
import { buildProps, iconPropType } from '@element-plus/utils'
|
|
import { Loading } from '@element-plus/icons-vue'
|
|
import type { ExtractPropTypes } from 'vue'
|
|
|
|
export const buttonTypes = [
|
|
'default',
|
|
'primary',
|
|
'success',
|
|
'warning',
|
|
'info',
|
|
'danger',
|
|
/**
|
|
* @deprecated
|
|
* Text type will be deprecated in the next major version (3.0.0)
|
|
*/
|
|
'text',
|
|
'',
|
|
] as const
|
|
export const buttonNativeTypes = ['button', 'submit', 'reset'] as const
|
|
|
|
export const buttonProps = buildProps({
|
|
/**
|
|
* @description button size
|
|
*/
|
|
size: useFormSizeProp,
|
|
/**
|
|
* @description disable the button
|
|
*/
|
|
disabled: Boolean,
|
|
/**
|
|
* @description button type
|
|
*/
|
|
type: {
|
|
type: String,
|
|
values: buttonTypes,
|
|
default: '',
|
|
},
|
|
/**
|
|
* @description icon component
|
|
*/
|
|
icon: {
|
|
type: iconPropType,
|
|
},
|
|
/**
|
|
* @description native button type
|
|
*/
|
|
nativeType: {
|
|
type: String,
|
|
values: buttonNativeTypes,
|
|
default: 'button',
|
|
},
|
|
/**
|
|
* @description determine whether it's loading
|
|
*/
|
|
loading: Boolean,
|
|
/**
|
|
* @description customize loading icon component
|
|
*/
|
|
loadingIcon: {
|
|
type: iconPropType,
|
|
default: () => Loading,
|
|
},
|
|
/**
|
|
* @description determine whether it's a plain button
|
|
*/
|
|
plain: Boolean,
|
|
/**
|
|
* @description determine whether it's a text button
|
|
*/
|
|
text: Boolean,
|
|
/**
|
|
* @description determine whether it's a link button
|
|
*/
|
|
link: Boolean,
|
|
/**
|
|
* @description determine whether the text button background color is always on
|
|
*/
|
|
bg: Boolean,
|
|
/**
|
|
* @description native button autofocus
|
|
*/
|
|
autofocus: Boolean,
|
|
/**
|
|
* @description determine whether it's a round button
|
|
*/
|
|
round: Boolean,
|
|
/**
|
|
* @description determine whether it's a circle button
|
|
*/
|
|
circle: Boolean,
|
|
/**
|
|
* @description custom button color, automatically calculate `hover` and `active` color
|
|
*/
|
|
color: String,
|
|
/**
|
|
* @description dark mode, which automatically converts `color` to dark mode colors
|
|
*/
|
|
dark: Boolean,
|
|
/**
|
|
* @description automatically insert a space between two chinese characters
|
|
*/
|
|
autoInsertSpace: {
|
|
type: Boolean,
|
|
default: undefined,
|
|
},
|
|
} as const)
|
|
export const buttonEmits = {
|
|
click: (evt: MouseEvent) => evt instanceof MouseEvent,
|
|
}
|
|
|
|
export type ButtonProps = ExtractPropTypes<typeof buttonProps>
|
|
export type ButtonEmits = typeof buttonEmits
|
|
|
|
export type ButtonType = ButtonProps['type']
|
|
export type ButtonNativeType = ButtonProps['nativeType']
|
|
|
|
export interface ButtonConfigContext {
|
|
autoInsertSpace?: boolean
|
|
}
|