InfoLabel

InfoLabel è un componente versatile usato per mostrare informazioni o messaggi di avviso in diversi contesti. Sfrutta la flessibilità di TailwindCSS per lo stile, offrendo modalità di colore predefinite per una rapida personalizzazione.

Utilizzo

Per usare InfoLabel, importalo nel tuo componente e specifica i children da mostrare al suo interno. Opzionalmente, puoi anche impostare la prop mode per cambiare l’aspetto in base al contesto (info o warn).

InfoLabel di base

Un esempio base che mostra come usare il componente InfoLabel per visualizzare un messaggio informativo.

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

Illustrazione di come usare il componente InfoLabel per mostrare un messaggio di avviso impostando il mode su 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>
    );
}