Badge Emblema - Docs - Artefact

Badge Emblema

Feedback

Apresentacional

Introdução

Um pequeno elemento visual que rotula ou categoriza conteúdo.

Uso

New

Active

Error

import { Badge } from "../components/ui";

export default function MyPage() {
  return (
    <Badge colorPalette="blue" variant="solid">
      New
    </Badge>
  );
}

Construtor de Páginas CMS

Este componente está disponível como um bloco badge no Construtor de Páginas (content/pages/*.json):

{
  "type": "badge",
  "text": "New",
  "colorPalette": "blue",
  "variant": "solid"
}

Propriedades

Prop	Type	Description
`children`	`any`	Conteúdo a ser renderizado dentro do componente.
`class`	`string`	Classes CSS personalizadas.
`colorPalette`	`string`	O tema de cor do badge.

| size | `"sm" \ | "md" \ | "lg" \ | "xl" \ | "2xl"` | O tamanho do badge. |

| interactive | boolean | Se deve habilitar a hidratação do lado do cliente. |