Input

<div class="w-full max-w-sm">
    <twig:ui:Input type="email" placeholder="Email" />
</div>

<div class="grid w-full max-w-sm gap-4">
    <div class="grid w-full gap-3">
        <twig:ui:Label for="input-sm">Small</twig:ui:Label>
        <twig:ui:Input id="input-sm" size="sm" placeholder="Small input" />
    </div>

    <div class="grid w-full gap-3">
        <twig:ui:Label for="input-md">Medium (default)</twig:ui:Label>
        <twig:ui:Input id="input-md" size="md" placeholder="Medium input" />
    </div>

    <div class="grid w-full gap-3">
        <twig:ui:Label for="input-lg">Large</twig:ui:Label>
        <twig:ui:Input id="input-lg" size="lg" placeholder="Large input" />
    </div>
</div>

<div class="w-full max-w-sm">
    <twig:ui:Input disabled placeholder="Disabled" />
</div>

<div class="grid w-full max-w-sm gap-3">
    <twig:ui:Label for="email-input">Email</twig:ui:Label>
    <twig:ui:Input id="email-input" type="email" placeholder="Email" />
</div>