Generic input props

Last updated: 2.0.0 (18/01/2024)

Generic input props

Extends GenericLayoutProps, accepts a type input T = string.

Property	Type	Description
value	T	The value of this input. Use this in conjunction with onInput or onChange to create controlled inputs.
setValue	Dispatch<SetStateAction<T>>	Sets the value of this input. Use this in conjunction with value to create controlled inputs.
size	ComponentSize	This input's size class. Defaults to theme default.
radius	ComponentSize	This input's radius size class. Defaults to theme default.
variant	FillVariant	This input's styling variant. Defaults to theme default.
disabled	boolean	Whether this input is disabled.
readOnly	boolean	Whether this input is readonly.
required	boolean	Whether this input is required.
autoFocus	boolean	Whether to focus this input on mount.
loading	boolean	Whether this input is loading.
form	string	Associates this input with a form element.
name	string	The name of this input. Submitted with the form as part of a name/value pair.

Generic text input props

Extends GenericInputProps<string>.

Property	Type	Description
icon	ReactNode	An icon to display at the left side of this input.
placeholder	string	Text that appears in this input when it has no value.
minLength	number	The minimum length of this input's value.
maxLength	number	The maximum length of this input's value.
pattern	string	A regex pattern to use for validation.
inputStyle	CSSProperties	Optional styles to apply to the input component.

Generic text input event props

Extends MouseClickEvents, MouseEvents, PointerEvents, FocusEvents, KeyboardEvents.

Property	Type	Description
onInput	(event: React.FormEvent) => void	Fires when the value of this input has been changed.
onChange	(event: React.FormEvent) => void	Fires when the value of this input has been changed. This is functionally the same as onInput because of how React handles these events.
onInvalid	(event: React.FormEvent) => void	Fires when the input's value does not satisfy its validation constraints.
onEnterPress	(event: React.FormEvent) => void	Fires when the enter key is pressed.