Input

Displays a form input field or a component that looks like an input field.

Component Code 
<x-aui::input id="demo-1" type="email" placeholder="Email" class="w-full max-w-sm" />

File

Component Code 
<x-aui::input id="demo-2" type="file" label="Picture" class="w-full max-w-sm" />

Disabled

Component Code 
<x-aui::input type="email" placeholder="Email" disabled class="w-full max-w-sm" />

Checkbox (and radio)

Component Code 
<div class="flex items-center space-x-2">
    <x-aui::input id="accept" type="checkbox" />
    <x-aui::label for="accept">Accept terms and conditions</x-aui::label>
</div>

With label component

Component Code 
<div class="grid w-full max-w-sm items-center gap-1.5">
    <x-aui::label for="demo-4">Email</x-aui::label>
    <x-aui::input id="demo-4" type="email" placeholder="Email" class="w-full" />
</div>

With button component

Component Code 
<div class="flex w-full max-w-sm items-center space-x-2">
    <x-aui::input type="email" placeholder="Email" class="w-full" />
    <x-aui::button type="submit">Subscribe</x-aui::button>
</div>