Livewire Components

Textarea

Displays a form textarea or a component that looks like a textarea. 

<x-textarea placeholder="Type your message here." />

Installation

php artisan vendor:publish --tag=textarea --force

Usage

<x-textarea />

Examples

Default

<x-textarea placeholder="Type your message here." />

Disabled

<x-textarea
    placeholder="Type your message here."
    disabled
/>

With Label

<div class="grid w-full gap-1.5">
    <x-label htmlFor="message">Your message</x-label>
    <x-textarea
        placeholder="Type your message here."
        id="message"
    />
</div>

With Text

Your message will be copied to the support team. 

<div class="grid w-full gap-1.5">
    <x-label htmlFor="message-2">Your Message</x-label>
    <x-textarea
        placeholder="Type your message here."
        id="message-2"
    />
    <p class="text-sm text-muted-foreground">
        Your message will be copied to the support team.
    </p>
</div>

With Button

<div class="grid w-full gap-2">
    <x-textarea placeholder="Type your message here." />
    <x-button>Send message</x-button>
</div>

Form

You can @mention other users and organizations. 

<x-form class="w-2/3 space-y-6">
    <div class="space-y-2">
        <x-form.label>Bio</x-form.label>
        <x-textarea
            placeholder="Tell us a little bit about yourself"
            class="resize-none"
        />
        <x-form.description>
            You can <span>@mention</span> other users and organizations.
        </x-form.description>
    </div>
    <x-button type="submit">Update profile</x-button>
</x-form>