Start sharing components as a team!Share components as a team!Join Bit to build your applications faster.Get Started Free

select

v4.15.0arrow_drop_down
v4.15.0
STATUS
Passing
DOWNLOADS
99
LICENSE
MIT
VISIBILITY
Public
PUBLISHED
A year ago
SIZE
N/A
Evergreen exports two components to create text inputs: Select: base text input component. Directly maps to a select element. SelectField: combines a label, select and validation message in one. Used for traditional forms.
1 contributor
Install select as a package?
Copied
npm i @bit/segmentio.evergreen.select
Set Bit as a scoped registryLearn more
npm config set '@bit:registry' https://node.bit.dev
Component Example
React
React
Vue
Angular
React Native
Add dependency... help_outline
Just
import
any of the 1 million components
and packages in Bit or NPM to the example.
import Button from '@bit/grommet.grommet.button';
import Lodash from 'lodash';
toggle layout
modifieddraft
chevron_left
chevron_right

Composes the dimensions spec from the Box primitivie.

Composes the spacing spec from the Box primitivie.

Composes the position spec from the Box primitivie.

Composes the layout spec from the Box primitivie.

The id attribute for the select.

The name attribute for the select.

The options that are passed to the select.

The initial value of an uncontrolled select

Function called when value changes.

The value of the select.

When true, the select is required.

When true, the select should auto focus.

When true, the select is invalid.

The appearance of the select. The default theme only supports default.

Theme provided by ThemeProvider.

Properties
NameTypeDefault valueDescription
label
(required)
node

The label used above the input element.

labelFor
string

Passed on the label as a htmlFor prop.

isRequired
bool

Wether or not show a asterix after the label.

description
node

A optional description of the field under the label, above the input element.

hint
node

A optional hint under the input element.

validationMessage
node

If a validation message is passed it is shown under the input element and above the hint. This is unaffected by isInvalid.

inputHeight
number32

The height of the input element.

inputWidth
number | string'100%'

The width of the input width.