feat(api): add LabelBadge type for two-part pill badges Introduce LabelBadge struct that renders a muted label followed by an emphasized value, supporting customizable colors, text colors, shapes, and optional icons. Implements Textable interface with String(), ANSI(), HTML(), and Markdown() methods. Add HTML React formatter support to convert LabelBadge to clicky-ui Badge component. Also add DetailLevel enum and Detailable interface to text.go for multi-section detail views with context-aware rendering.

.github/workflows/release.yml

@@ -22,7 +22,7 @@ permissions:
   id-token: write
 
 env:
-  GO_VERSION: "1.25"
+  GO_VERSION: "1.26"
 
 jobs:
   semantic-release:

.gitignore

@@ -81,3 +81,4 @@ __debug*
 ginkgo.report
 *.bak
 examples/uber_demo/uber_demo
+.gavel/

api/labelbadge.go

@@ -0,0 +1,80 @@
+package api
+
+import (
+	"fmt"
+	"html"
+	"strings"
+)
+
+// LabelBadge is a two-part pill: a muted label followed by an emphasised
+// value, rendered by clicky-ui's <Badge variant="label" />. It is distinct
+// from the single-label Badge() helper in html.go, which produces a plain
+// pill with no label/value split.
+//
+// The Color/TextColor fields accept tailwind class names (e.g. "bg-blue-100"
+// and "text-slate-700"); Shape controls the corner radius and Icon is an
+// optional iconify name rendered before the label.
+type LabelBadge struct {
+	Label     string
+	Value     string
+	Color     string // tailwind bg class, e.g. "bg-blue-100"
+	TextColor string // tailwind text class, e.g. "text-slate-700"
+	Shape     string // "pill" | "rounded" | "square"; default "rounded"
+	Icon      string // iconify icon name, optional
+}
+
+func (b LabelBadge) String() string {
+	if b.Label == "" {
+		return b.Value
+	}
+	if b.Value == "" {
+		return b.Label
+	}
+	return b.Label + ": " + b.Value
+}
+
+func (b LabelBadge) ANSI() string {
+	return b.String()
+}
+
+func (b LabelBadge) HTML() string {
+	shape := "rounded-md"
+	switch b.Shape {
+	case "pill":
+		shape = "rounded-full"
+	case "square":
+		shape = "rounded-none"
+	}
+	classes := []string{"inline-flex", "items-center", shape, "text-xs"}
+	if b.Color != "" {
+		classes = append(classes, b.Color)
+	} else {
+		classes = append(classes, "bg-gray-100")
+	}
+	if b.TextColor != "" {
+		classes = append(classes, b.TextColor)
+	}
+
+	var inner strings.Builder
+	if b.Icon != "" {
+		fmt.Fprintf(&inner, `<span class="px-1 iconify" data-icon="%s" aria-hidden="true"></span>`, html.EscapeString(b.Icon))
+	}
+	if b.Label != "" {
+		fmt.Fprintf(&inner, `<span class="px-1 font-medium opacity-70">%s</span>`, html.EscapeString(b.Label))
+	}
+	if b.Value != "" {
+		fmt.Fprintf(&inner, `<span class="px-1">%s</span>`, html.EscapeString(b.Value))
+	}
+
+	return fmt.Sprintf(`<span class="%s">%s</span>`, strings.Join(classes, " "), inner.String())
+}
+
+func (b LabelBadge) Markdown() string {
+	if b.Label == "" {
+		return b.Value
+	}
+	if b.Value == "" {
+		return fmt.Sprintf("**%s**", b.Label)
+	}
+	return fmt.Sprintf("**%s**: %s", b.Label, b.Value)
+}

api/labelbadge_test.go

@@ -0,0 +1,64 @@
+package api
+
+import (
+	"strings"
+	"testing"
+)
+
+func TestLabelBadge_String(t *testing.T) {
+	cases := []struct {
+		name string
+		b    LabelBadge
+		want string
+	}{
+		{"label and value", LabelBadge{Label: "env", Value: "prod"}, "env: prod"},
+		{"only value", LabelBadge{Value: "prod"}, "prod"},
+		{"only label", LabelBadge{Label: "env"}, "env"},
+		{"empty", LabelBadge{}, ""},
+	}
+	for _, tc := range cases {
+		t.Run(tc.name, func(t *testing.T) {
+			if got := tc.b.String(); got != tc.want {
+				t.Errorf("String() = %q, want %q", got, tc.want)
+			}
+		})
+	}
+}
+
+func TestLabelBadge_Markdown(t *testing.T) {
+	b := LabelBadge{Label: "env", Value: "prod"}
+	if got, want := b.Markdown(), "**env**: prod"; got != want {
+		t.Errorf("Markdown() = %q, want %q", got, want)
+	}
+	if got, want := (LabelBadge{Value: "prod"}).Markdown(), "prod"; got != want {
+		t.Errorf("Markdown(value-only) = %q, want %q", got, want)
+	}
+}
+
+func TestLabelBadge_HTML_EscapesUserInput(t *testing.T) {
+	b := LabelBadge{Label: "<script>", Value: `"bad"`}
+	got := b.HTML()
+	if strings.Contains(got, "<script>") {
+		t.Errorf("HTML() did not escape label: %q", got)
+	}
+	if strings.Contains(got, `"bad"`) {
+		t.Errorf("HTML() did not escape value: %q", got)
+	}
+	if !strings.Contains(got, "&lt;script&gt;") {
+		t.Errorf("HTML() missing escaped label: %q", got)
+	}
+}
+
+func TestLabelBadge_HTML_UsesColorClasses(t *testing.T) {
+	b := LabelBadge{Label: "k", Value: "v", Color: "bg-blue-100", TextColor: "text-slate-700"}
+	got := b.HTML()
+	for _, want := range []string{"bg-blue-100", "text-slate-700"} {
+		if !strings.Contains(got, want) {
+			t.Errorf("HTML() missing class %q in %q", want, got)
+		}
+	}
+}
+
+func TestLabelBadge_ImplementsTextable(t *testing.T) {
+	var _ Textable = LabelBadge{}
+}