@eureka-marketplace/ui

Librería de componentes React con CSS nativo (sin Tailwind), empaquetada como una librería instalable — mismo patrón que HeroUI/Polaris/Spectrum: componentes + una sola hoja de estilos exportada, no código suelto para copiar y pegar.

Uso

npm install @eureka-marketplace/ui

import { Title, Button } from "@eureka-marketplace/ui";
import "@eureka-marketplace/ui/style.css"; // una vez, en el root de la app

<Title>Bienvenido de nuevo</Title>
<Button variant="primary" raised>Continuar</Button>
<Button variant="secondary">Cancelar</Button>

react/react-dom son peerDependencies — el paquete no los bundlea, usa los de la app que lo consume.

Componentes

Tipografía: Typography (headings h1–h6, body/body-sm/body-xs, code, eyebrow — con atajos Typography.Heading, Typography.Paragraph, Typography.Code), Title (alias de Typography type="h1", por compatibilidad).

Formularios: Input, SearchField, InputOTP, Checkbox, Switch, Select, Radio/RadioGroup, Field.

Botones y acciones: Button (variantes, tamaños, íconos, loading, full-width, icon-only), CloseButton.

Navegación: Tabs, Breadcrumbs, Pagination, Link, Dropdown.

Overlays: Modal, AlertDialog, Popover, Tooltip, ToastProvider/useToast.

Mostrar datos: Card, Table, Chip, Avatar, Kbd, EmptyState.

Feedback: Alert, Spinner, Skeleton, ProgressBar.

Layout: Accordion, Separator.

Estilo visual

Borde de tinta grueso + esquinas levemente asimétricas — look dibujado a mano sin caer en filtros SVG (se probó feDisplacementMap para un trazo sketchy y dio un glitch de franjas de color; se descartó, la asimetría de las esquinas alcanza). raised agrega una sombra dura offset a un botón/card — usar en como mucho un elemento por grupo, el que crea o confirma algo nuevo.

Desarrollo

• npm run dev — levanta una galería de demo con todos los componentes.
• npm run build — build de la librería: dist/eurekaui.{js,cjs,css} + dist/index.d.ts.