Installation
pnpm dlx shadcn-svelte@latest add https://coss-sv.vercel.app/r/alert.jsonUsage
<script lang="ts">
import * as Alert from "$lib/components/ui/alert/index.js";
</script>
<Alert.Root>
<Alert.Title>Heads up!</Alert.Title>
<Alert.Description>
You can add components and dependencies to your app using the CLI.
</Alert.Description>
</Alert.Root>API Reference
This is a custom component, not a Shards UI wrapper.
Alert.Root
Root container for the alert. Native div attributes pass to the rendered element.
| Prop | Type | Default | Description |
|---|---|---|---|
variant | "default" \| "error" \| "info" \| "success" \| "warning" | "default" | Controls the alert styling and color scheme |
Alert.Title
Title text for the alert. Renders as a styled div.
Alert.Description
Description text for the alert. Renders as a styled div with muted foreground color.
Alert.Action
Container for action buttons. Automatically positions to the right on larger screens.