fix(ds-pill): default show_dot per mode (badges clean, markers keep dot) (#2107)

Closes #2001.

DS::Pill defaulted show_dot: true for both modes, so every status/category
badge got a leading dot by default — redundant with the pill shape + tone +
label already carrying the signal, and noisy in dense lists. More than half
the marker:false callsites were already passing show_dot: false to fight it.

The default is now mode-aware: marker: true keeps the dot (stage markers),
marker: false (badges) is dot-less. An explicit show_dot: still wins.

Only one in-tree callsite relied on the old default without an icon and wants
the dot: settings/providers/_status_pill (live connection state) — pinned with
show_dot: true. The enable_banking "Beta" badge loses its dot, which is the
desired outcome (ref #1997). Icon-bearing transaction badges are unaffected
(an icon already suppresses the dot).

Left the now-redundant show_dot: false overrides in place to avoid churn and
conflicts with in-flight pill-migration branches; they're harmless (explicit
false == new default).

Adds tests pinning the per-mode default resolution; updates the Lookbook
preview to show the opt-in dot vs the clean default.
This commit is contained in:
Guillem Arias Fauste
2026-06-03 00:01:38 +02:00
committed by GitHub
parent 998cfd61d6
commit d22ffe5994
4 changed files with 39 additions and 3 deletions

View File

@@ -51,6 +51,26 @@ class DS::PillTest < ViewComponent::TestCase
assert_includes pill.palette[:bg], "color-red-50"
end
test "marker mode shows the dot by default" do
render_inline(DS::Pill.new(label: "Beta", tone: :violet))
assert_selector "span.inline-block.rounded-full"
end
test "badge mode (marker: false) is dot-less by default" do
render_inline(DS::Pill.new(label: "Member", tone: :neutral, marker: false))
assert_no_selector "span.inline-block.rounded-full"
end
test "badge mode opts back into the dot with show_dot: true" do
render_inline(DS::Pill.new(label: "Active", tone: :success, marker: false, show_dot: true))
assert_selector "span.inline-block.rounded-full"
end
test "marker mode can drop the dot with show_dot: false" do
render_inline(DS::Pill.new(label: "Beta", tone: :violet, show_dot: false))
assert_no_selector "span.inline-block.rounded-full"
end
test "custom color renders dynamic badge styles" do
render_inline(DS::Pill.new(label: "Groceries", marker: false, custom_color: "#f97316"))

View File

@@ -39,8 +39,12 @@ class PillComponentPreview < ViewComponent::Preview
# @!endgroup
# @!group Status badges (marker: false, semantic tones)
# Badge mode is dot-less by default — tone + label carry the signal. Opt the
# dot back in with show_dot: true only where it's genuinely additive (live /
# temporal status, or a single sparse pill). status_active below shows the
# opt-in; status_pending / status_archived show the clean default.
def status_active
render DS::Pill.new(label: "Active", tone: :success, marker: false)
render DS::Pill.new(label: "Active", tone: :success, marker: false, show_dot: true)
end
def status_pending