Alert

Announce important messages.

Usage

See using components for detailed instructions.

import { CAlert } from 'chusho';

The options below are to be set in the global configuration at the following location:

{
  components: {
    alert: {
      class: ({ variant }) => {},
    },
  },
}

Classes applied to the component root element, except when the prop bare is set to true. See styling components.

class({ variant }) {
    return ['alert', {
        'alert--error': variant?.error,
        'alert--warning': variant?.warning,
    }]
}

Name	Type	Default	Description
Props
variant	`string\|array\|object`	`undefined`	Useful when used in the component config `class` option, to style it conditionally. See styling components.
bare	`boolean`	`false`	Disable class inheritance from the component config. See styling components.

template

<CAlert>An important message.</CAlert>

template

<CAlert variant="error">An important message.</CAlert>