From 9a89dc4a4e29042b288d19bea2c6cc888875fe05 Mon Sep 17 00:00:00 2001
From: Alejandro Bailo <59607668+alejandrobailo@users.noreply.github.com>
Date: Wed, 21 Oct 2026 22:38:15 +0200
Subject: [PATCH] feat(ui): add outlined error badge variant (#13111)

---
 ui/changelog.d/badge-error-outline.added.md | 1 +
 ui/components/shadcn/badge/badge.tsx        | 2 ++
 2 files changed, 3 insertions(+)
 create mode 100644 ui/changelog.d/badge-error-outline.added.md

diff --git a/ui/changelog.d/badge-error-outline.added.md b/ui/changelog.d/badge-error-outline.added.md
new file mode 100644
index 0000000000..ae6f0c63d0
--- /dev/null
+++ b/ui/changelog.d/badge-error-outline.added.md
@@ -0,0 +1 @@
+Outlined error badge variant with a visible border on error-colored surfaces
diff --git a/ui/components/shadcn/badge/badge.tsx b/ui/components/shadcn/badge/badge.tsx
index b602e8ec8e..58644a4163 100644
--- a/ui/components/shadcn/badge/badge.tsx
+++ b/ui/components/shadcn/badge/badge.tsx
@@ -24,6 +24,8 @@ const badgeVariants = cva(
           "border-bg-warning/30 bg-bg-warning-secondary/20 text-text-warning-primary",
         error:
           "border-transparent bg-bg-fail-secondary text-text-error-primary",
+        "error-outline":
+          "border-border-error bg-bg-fail-secondary text-text-error-primary",
         info: "border-transparent bg-bg-data-info/15 text-bg-data-info",
         cloud:
           "bg-feature-cloud h-6 rounded-lg border-0 px-2 py-0 text-xs leading-5 font-bold text-black",