Tailwind CSS Select - Props

The following props are available for select component. These are the custom props that come with we've added for the select component and you can use all the other native props as well.

Attribute	Type	Description	Default
`variant`	Variant	Change input variant	`outlined`
`size`	Size	Change input size	`md`
`color`	Color	Change input color	`blue`
`label`	`string`	Add label for input	`''`
`error`	`boolean`	Change input state to error	`false`
`success`	`boolean`	Change input state to success	`false`
`animation`	`boolean`	Change alert animation	`false`
`options`	`array`	Set data to be shown in select	`[]`
`item-text`	`string`	Set property of items’s text value	`name`
`item-value`	`string`	Set property of items’s value	`value`

Dependencies

v-click-outside

Types - Variant

type variant = "standard" | "outlined" | "static"

Types - Size

type size = "md" | "lg"

Types - Color

type variant = 
      | "blue-gray"
      | "gray"
      | "brown"
      | "deep-orange"
      | "orange"
      | "amber"
      | "yellow"
      | "lime"
      | "light-blue"
      | "blue"
      | "teal"
      | "cyan"
      | "light-blue"
      | "blue"
      | "indigo"
      | "deep-purple"
      | "purple"
      | "pink"
      | "red"

Options - Examples

{
  name: string | number
  value: string | number
  disabled: boolean
}

Examples

Checkout different examples for select component.