CmThemeToggle
Seletor dos temas registrados no CmThemeProvider.
Import
Caminho público recomendado para este componente.
import {
CmButton,
CmDropdownMenu,
CmThemeProvider,
CmThemeScript,
CmThemeToggle,
useCmTheme
} from "cosmemilton-ui";CmThemeToggle renderiza todos os temas registrados no CmThemeProvider.
Use presentation="compact" e labelVisibility="desktop" em headers apertados.
Em versões sem presentation, componha CmDropdownMenu com useCmTheme para criar o mesmo padrão compacto.
Ele precisa estar dentro de CmThemeProvider, pois lê theme, themes e setThemeByName pelo contexto.
Use CmThemeScript no layout para aplicar os tokens antes da hidratação e evitar troca visual tardia.
Em React/CRA ou Vite, passe customThemes direto no CmThemeProvider; CmThemeScript é específico para pré-hidratação em SSR.
Seletor de temas
Na documentação o provider já está configurado, então o preview pode renderizar o seletor diretamente.
Custom themes em React/CRA
Em apps sem SSR, registre os temas no provider. O script de tema não é necessário.
Header compacto
Use presentation compacta e oculte o rótulo em telas pequenas sem CSS local.