Componentes
Input Group
Componente input-group do design system adila.co.
Instalação
bun add @adila-sh/uiUso
import {
InputGroup,
InputGroupAddon,
InputGroupInput,
InputGroupText,
InputGroupButton,
} from '@adila-sh/ui';
import { Search } from 'lucide-react';
export function Example() {
return (
<InputGroup>
<InputGroupAddon>
<Search />
</InputGroupAddon>
<InputGroupInput placeholder="Buscar componentes..." />
<InputGroupAddon align="inline-end">
<InputGroupButton>Copiar</InputGroupButton>
</InputGroupAddon>
</InputGroup>
);
}Use align no InputGroupAddon para posicionar addons: inline-start (padrão), inline-end, block-start e block-end. Para áreas de texto, troque InputGroupInput por InputGroupTextarea.
Dependências
class-variance-authority