FieldButton
A field button can used inside a group component to add additional functionality to a field.
Preview
Code
Examples
Disabled
Preview
Code
In Invalid Field
Preview
Code
Props
Name | Type | Default |
---|---|---|
ref | ForwardedRef<HTMLButtonElement> | — |
className | string | ((values: ButtonRenderProps & { defaultClassName: string; }) => string) | — |
id | string | — |
name | string | — |
style | CSSProperties | ((values: ButtonRenderProps & { defaultStyle: CSSProperties; }) => CSSProperties) | — |
type | "button" | "submit" | "reset" | 'button' |
children | ReactNode | ((values: ButtonRenderProps & { defaultChildren: ReactNode; }) => ReactNode) | — |
onFocus | ((e: FocusEvent<Element, Element>) => void) | — |
onBlur | ((e: FocusEvent<Element, Element>) => void) | — |
onKeyDown | ((e: KeyboardEvent) => void) | — |
onKeyUp | ((e: KeyboardEvent) => void) | — |
onClick | ((e: MouseEvent<FocusableElement, MouseEvent>) => void) | — |
isDisabled | boolean | — |
onPress | ((e: PressEvent) => void) | — |
onPressStart | ((e: PressEvent) => void) | — |
onPressEnd | ((e: PressEvent) => void) | — |
onPressChange | ((isPressed: boolean) => void) | — |
onPressUp | ((e: PressEvent) => void) | — |
autoFocus | boolean | — |
onFocusChange | ((isFocused: boolean) => void) | — |
onHoverStart | ((e: HoverEvent) => void) | — |
onHoverEnd | ((e: HoverEvent) => void) | — |
onHoverChange | ((isHovering: boolean) => void) | — |
slot | string | null | — |
preventFocusOnPress | boolean | — |
intent | Intent | — |
isDestructive | boolean | — |
slotLeft | SlotNode | — |
slotRight | SlotNode | — |
form | string | — |
formAction | string | — |
formEncType | string | — |
formMethod | string | — |
formNoValidate | boolean | — |
formTarget | string | — |
value | string | — |
isPending | boolean | — |