cosmemilton-ui/themeTema

CmThemeToggle / CmThemeMenu

Use junto ao CmThemeProvider para permitir que o usuario escolha tema e densidade.

Import

tsx
import { CmThemeToggle } from "cosmemilton-ui/theme";

Alternadores de tema

Os controles usam o CmThemeProvider da aplicacao.

Tema atual: neutral
tsx
"use client";

import { CmThemeMenu, CmThemeToggle } from "cosmemilton-ui/theme";
import { CmRow, CmStack, CmText } from "cosmemilton-ui/server";

export default function Example() {
  return (
    <CmStack gap="md">
      <CmText tone="muted">Os controles usam o CmThemeProvider da aplicacao.</CmText>
      <CmRow gap="sm" align="center" wrap>
        <CmThemeToggle themes={["cm-neutral", "cm-dark", "cm-blue"]} />
        <CmThemeToggle presentation="compact" labelVisibility="hidden" />
        <CmThemeMenu align="start" themes={["cm-neutral", "cm-rose", "cm-aurora"]} />
      </CmRow>
    </CmStack>
  );
}

API rapida

CmThemeToggle

presentationlabelVisibilityalignthemesgetThemeLabel

CmThemeMenu

alignthemesgetThemeLabel