feat(ui): add linear design foundation

2026-04-25 19:56:24 +08:00
parent 42d7c50dc0
commit 0999f1905e
5 changed files with 113 additions and 8 deletions
@@ -0,0 +1,37 @@
+import type { VariantProps } from "class-variance-authority"
+import { AlertCircle, CheckCircle2, HelpCircle, Info } from "lucide-react"
+import type * as React from "react"
+
+import { Badge, type badgeVariants } from "@/components/ui/badge"
+
+type StatusBadgeVariant = NonNullable<VariantProps<typeof badgeVariants>["variant"]>
+
+export interface StatusBadgeProps extends React.ComponentProps<"span"> {
+  status: StatusBadgeVariant
+  icon?: boolean
+}
+
+const statusConfig: Partial<Record<StatusBadgeVariant, React.ElementType>> = {
+  success: CheckCircle2,
+  warning: AlertCircle,
+  info: Info,
+  destructive: AlertCircle,
+  neutral: HelpCircle,
+}
+
+export function StatusBadge({
+  status,
+  icon = true,
+  className,
+  children,
+  ...props
+}: StatusBadgeProps) {
+  const Icon = icon ? statusConfig[status] : undefined
+
+  return (
+    <Badge variant={status} className={className} {...props}>
+      {Icon && <Icon className="size-3" />}
+      {children}
+    </Badge>
+  )
+}