Instalação

A biblioteca já está publicada no npm. Em apps React puros, como Vite ou Create React App, instale o pacote junto dos peers React caso eles ainda não estejam no projeto.

npm install cosmemilton-ui react react-dom

Importe o stylesheet público uma vez no layout raiz do app consumidor. Os componentes são autocontidos, mas dependem desses tokens e estilos base.

import "cosmemilton-ui/styles.css";

Em React puro, importe o CSS no entrypoint e envolva a aplicação com CmThemeProvider quando for usar temas. Não é necessário instalar Next para consumir os componentes.

import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import "cosmemilton-ui/styles.css";
import { CmThemeProvider } from "cosmemilton-ui";
import { App } from "./App";

createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <CmThemeProvider>
      <App />
    </CmThemeProvider>
  </StrictMode>,
);

O pacote mantém suporte a Next, mas next é peer opcional. Componentes de navegação usam links HTML por padrão e aceitam um adaptador via linkComponent quando o app usa React Router ou next/link.

import { CmNavigationMenu } from "cosmemilton-ui";

<CmNavigationMenu
  activeHref="/clientes"
  items={[
    { href: "/", label: "Início" },
    { href: "/clientes", label: "Clientes" }
  ]}
/>;