Skip to content

TagsInputInput

Source: client/lib/theme/vueda-tailwind/controls/index.js

The free-text entry field inside a TagsInput.root. Sized to --vueda-chip-height so pending text shares a baseline with the committed chips beside it; renders chrome-free (transparent fill, no border, no focus ring) because the surrounding shell owns the chip-row contract and fires the focus ring on its own when the input is focused. flex-1 lets the field absorb the remaining row width inside the wrap so the typing affordance always reaches the trailing edge.

Vue component: TagsInputInput

SlotDefault classesDescription
roottext-sm min-h-[var(--vueda-chip-height)] focus:outline-none flex-1 bg-transparent px-1The free-text entry field inside a TagsInput.root. Sized to --vueda-chip-height so pending text shares a baseline with the committed chips beside it; renders chrome-free (transparent fill, no border, no focus ring) because the surrounding shell owns the chip-row contract and fires the focus ring on its own when the input is focused. flex-1 lets the field absorb the remaining row width inside the wrap so the typing affordance always reaches the trailing edge.

root

The free-text entry field inside a TagsInput.root. Sized to --vueda-chip-height so pending text shares a baseline with the committed chips beside it; renders chrome-free (transparent fill, no border, no focus ring) because the surrounding shell owns the chip-row contract and fires the focus ring on its own when the input is focused. flex-1 lets the field absorb the remaining row width inside the wrap so the typing affordance always reaches the trailing edge.

Default classes:

text-sm min-h-[var(--vueda-chip-height)] focus:outline-none flex-1 bg-transparent px-1

Source: client/lib/theme/vueda-tailwind/controls/TagsInputInput.theme.js:17

Documents matching: server v3.0.0a1.post1client v3.0.0-alpha.2