Laravel Tags Component

Free · MIT

Simple tag input that lets users add and remove free-form tags, binding an array via wire:model.

A Tags built for the TALL stack — Blade, Livewire 3 & 4, Alpine.js and Tailwind CSS 4. Server-rendered by default, dark-mode ready, and WCAG-minded. Drop it in with a single Blade tag: <x-aura::tags>

Try it live in the docs Install free

Installation

composer require bluestarsystem/aura-ui

Usage

<x-aura::tags
    label="Keywords"
    placeholder="Add a keyword..."
    wire:model="keywords"
/>

See the full API, props and live examples in the Tags documentation.

Overview

The <x-aura::tags> component renders a chip-style input where users type a value and press Enter to add it as a tag. Tags are displayed as removable chips inside the input area. Backspace on an empty field removes the last tag. The bound value is an array of strings via wire:model.

Props

Prop	Type	Default	Description
`label`	`string\|null`	`null`	Label text displayed above the tag input.
`placeholder`	`string`	`'Add tag...'`	Placeholder shown when no tags are present.
`max`	`int\|null`	`null`	Maximum number of tags allowed. `null` for unlimited. Shows a count indicator when set.
`disabled`	`bool`	`false`	Disable the entire control.
`error`	`string\|null`	`null`	Error message displayed below the control, applying error styling.
`hint`	`string\|null`	`null`	Help text displayed below the control. Hidden when an error is present.
`size`	`string`	`'md'`	Size variant. Options: `sm`, `md`, `lg`.