Docs
Alert

Alert

Displays a callout for user attention.

Usage

vue
<script setup lang="ts">
import { Alert, AlertDescription, AlertTitle } from "wedges-vue";
</script>

<template>
  <Alert>
    <AlertTitle>Heads up!</AlertTitle>
    <AlertDescription>
      You can add components to your app using the cli.
    </AlertDescription>
  </Alert>
</template>

API Reference

Props

PropTypeDefault
closable
boolean
false
color
'gray' | 'primary' | 'info' | 'success' | 'error' | 'warning' | null
title *
string
variant
'inline' | 'expanded' | null
'inline'

Slots

SlotDescription
default
Is the alert closable? If true, a close button will be displayed and when clicked on it will hide the alert element.
before
Render something before the alert description.
after
Render something after the alert description.

Emits

EmitDescription
close
If the alert is closable, you can use this to trigger a function when the alert gets closed.

Examples

Default

Destructive

Edit this page on GitHub