Files
element-plus/packages/components/button/src/button.ts
Jeremy 11925c8231 refactor(tokens) - [form] (#11743)
* 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.
2023-02-27 13:19:20 +08:00

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
}