mirror of
https://github.com/we-promise/sure.git
synced 2026-06-04 10:19:03 +00:00
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.
73 lines
2.2 KiB
Ruby
73 lines
2.2 KiB
Ruby
class PillComponentPreview < ViewComponent::Preview
|
|
# @param tone select ["violet", "indigo", "fuchsia", "amber", "green", "gray", "red", "success", "warning", "error", "info", "neutral"]
|
|
# @param style select ["soft", "filled", "outline"]
|
|
# @param size select ["sm", "md"]
|
|
# @param label text
|
|
# @param show_dot toggle
|
|
# @param dot_only toggle
|
|
# @param marker toggle
|
|
# @param icon text
|
|
def default(tone: "violet", style: "soft", size: "sm", label: "Preview", show_dot: true, dot_only: false, marker: true, icon: nil)
|
|
render DS::Pill.new(
|
|
label: label,
|
|
tone: tone.to_sym,
|
|
style: style.to_sym,
|
|
size: size.to_sym,
|
|
show_dot: show_dot,
|
|
dot_only: dot_only,
|
|
marker: marker,
|
|
icon: icon.presence
|
|
)
|
|
end
|
|
|
|
# @!group Stage markers (marker: true — original #1829 shape)
|
|
def canary
|
|
render DS::Pill.new(label: "Canary", tone: :fuchsia)
|
|
end
|
|
|
|
def beta
|
|
render DS::Pill.new(label: "Beta", tone: :violet)
|
|
end
|
|
|
|
def new_marker
|
|
render DS::Pill.new(label: "New", tone: :indigo)
|
|
end
|
|
|
|
def dot_only_collapsed_sidebar
|
|
render DS::Pill.new(dot_only: true, tone: :violet)
|
|
end
|
|
# @!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, show_dot: true)
|
|
end
|
|
|
|
def status_pending
|
|
render DS::Pill.new(label: "Pending", tone: :warning, marker: false)
|
|
end
|
|
|
|
def status_failed
|
|
render DS::Pill.new(label: "Failed", tone: :error, marker: false, icon: "circle-alert")
|
|
end
|
|
|
|
def status_archived
|
|
render DS::Pill.new(label: "Archived", tone: :neutral, marker: false)
|
|
end
|
|
|
|
def status_info
|
|
render DS::Pill.new(label: "Syncing", tone: :info, marker: false, icon: "loader")
|
|
end
|
|
# @!endgroup
|
|
|
|
# @!group Sizes (md)
|
|
def status_md
|
|
render DS::Pill.new(label: "Past due", tone: :error, marker: false, size: :md)
|
|
end
|
|
# @!endgroup
|
|
end
|