InfoLabel

InfoLabel é um componente versátil usado para exibir informações ou mensagens de aviso em diferentes contextos. Aproveita a flexibilidade do TailwindCSS para estilo, oferecendo modos de cor predefinidos para personalização rápida.

Uso

Para usar o InfoLabel, importe-o no seu componente e especifique os children para exibir dentro dele. Opcionalmente, você também pode definir a prop mode para alterar a aparência com base no contexto (info ou warn).

InfoLabel básico

Um exemplo básico mostrando como usar o componente InfoLabel para exibir uma mensagem informativa.

import React from "react";
import { InfoLabel } from "@firecms/ui";

export default function InfoLabelBasicDemo() {
    return (
        <InfoLabel mode="info">
            This is an informational message.
        </InfoLabel>
    );
}

Warning Label

Ilustrando como usar o componente InfoLabel para exibir uma mensagem de aviso definindo o modo como warn.

import React from "react";
import { InfoLabel } from "@firecms/ui";

export default function InfoLabelWarnDemo() {
    return (
        <InfoLabel mode="warn">
            Warning: This is a warning message.
        </InfoLabel>
    );
}