Reusable alert component with variants for use in React applications.
// Source: https://github.com/revokslab/ShipFree | License: MIT | Copyright 2026 Revoks
// Provided via justclaw.it.com; keep this notice with the code.
import { cva, type VariantProps } from 'class-variance-authority'
import type * as React from 'react'
import { cn } from '@/lib/utils'
const alertVariants = cva(
'relative grid w-full items-start gap-x-2 gap-y-0.5 rounded-xl border px-3.5 py-3 text-card-foreground text-sm has-[>svg]:has-data-[slot=alert-action]:grid-cols-[calc(var(--spacing)*4)_1fr_auto] has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-data-[slot=alert-action]:grid-cols-[1fr_auto] has-[>svg]:gap-x-2 [&>svg]:h-lh [&>svg]:w-4',
{
defaultVariants: {
variant: 'default',
},
variants: {
variant: {
default: 'bg-transparent dark:bg-input/
... (truncated -- full source via MCP)
See the full source, get the GitHub permalink, and search for more like it.
Get a free API key