ComponentsUpdated

Input

Input fields are used to let the users type in content.

Version 13.4.0 introduces the size prop, which accepts "sm" or "md" and defaults to "md".

Code examples

Input is wrapped in a Field component, making it easy to define label, errorText and helperText in the best accessible way.

Props from the component comes from a large selection. Unique for Input is listed under code.

For search, use SearchInput.

For password, use PasswordInput.

For phone, use PhoneNumberInput.

import { Input } from "@vygruppen/spor-react";

Name	Type	Description
`label`	`string`	A descriptive label
`variant`	`"core" \| "floating"`	Defaults to core.
`size`	`"sm" \| "md"`	defaults to "md"
`startElement`	`React.ReactNode`	Use the 24px icons
`endElement`	`React.ReactNode`	Use the 24px icons
`disabled`	`boolean`
`invalid`	`boolean`
`errorText`	`React.ReactNode`	Display error text for the component
`readonly`	`boolean`
`required`	`boolean`
`helperText`	`React.ReactNode`	Display helper text for the input