@kiudev/ui

Componentes de React 19 accesibles, basados en compound components.

Instalación

pnpm add @kiudev/ui

Uso

Importa los estilos una vez (p. ej. en main.tsx) y usa los componentes:

import "@kiudev/ui/styles.css";
import { Button, Tabs } from "@kiudev/ui";

<Tabs.Root defaultValue="cuenta">
  <Tabs.List>
    <Tabs.Trigger value="cuenta">Cuenta</Tabs.Trigger>
    <Tabs.Trigger value="clave">Contraseña</Tabs.Trigger>
  </Tabs.List>
  <Tabs.Content value="cuenta">…</Tabs.Content>
  <Tabs.Content value="clave">…</Tabs.Content>
</Tabs.Root>

Componentes: Button, Card, Tabs, Accordion, Dialog.

Los estilos están en @layer, así que tu CSS los sobrescribe sin !important, y los colores se cambian con variables CSS (--color-primary, etc.).

Desarrollo

pnpm install
pnpm dev            # playground con todos los componentes
pnpm test

Publicar (con los cambios commiteados y npm login hecho):

npm version patch   # sube la versión y crea commit + tag
pnpm publish        # comprueba tipos, pasa los tests y compila antes de subir