Alert Alerta - Docs - Artefact

Alert Alerta

Feedback

Presentacional

Introducción

Muestra un mensaje breve e importante de una manera que atrae la atención del usuario sin interrumpir sus tareas.

Uso

Success

Your changes have been saved.

import { Alert, AlertIcon } from "../components/ui";

export default function MyPage() {
  return (
    <Alert
      status="success"
      title="Success"
      description="Your changes have been saved."
      indicator={<AlertIcon />}
    />
  );
}

Constructor de Páginas CMS

Este componente está disponible como un bloque alert en el Constructor de Páginas (content/pages/*.json):

{
  "type": "alert",
  "status": "success",
  "title": "Success",
  "description": "Your changes have been saved.",
  "variant": "subtle"
}

Propiedades

Prop	Type	Description
`title`	`string`	El título de la alerta.
`description`	`string`	La descripción de la alerta.
`indicator`	`Child`	Un icono o elemento que se renderiza como indicador.
`children`	`Child`	Contenido adicional que se renderiza dentro del componente.
`class`	`string`	Clases CSS personalizadas.