Repository navigation
Description
Feature summary
Add an optional subtitle prop to the Scorecard component (packages/ui) so consumers can provide short contextual text beneath the metric (e.g. "Last 30 days", "From AntSeed vault", "Cumulative since launch").
Problem or opportunity
Scorecard has label (metric name) and trendLabel (accompanies the trend arrow) but no way to add a one-line qualifier/source note. The GoodData widget (PR #179) renders three scorecards (Total G$ Spent, AI Credits Used, Flow Rate) that would each benefit from this.
Proposed solution
- Add
subtitle?: stringtoScorecardProps. - New styled component
ScorecardSubtitleText, built viacreateComponent(TamaguiText, ...)following the exact pattern ofScorecardLabelText, size variants mapping toSECONDARY_SIZE_PX. - Style:
$placeholderColor,SECONDARY_SIZE_PX[size],fontWeight: '400',textAlign: 'center'. - Renders last,
marginTop: VALUE_TO_TREND_GAP_PXabove it — below the trend row when present, else directly below the value row. - Undefined subtitle → no extra space, layout unchanged.
Required states, flows, and behaviors
- With trend: Label → Value → Trend row → Subtitle.
- Without trend: Label → Value → Subtitle.
- Without subtitle: current layout, byte-for-byte.
- Must work across
sm/md/lgsizes and bothbare/cardvariants, and render on React web, React Native, and Web Components.
Acceptance criteria
-
subtitleprop accepted, renders below trend row (or value row if no trend) - No subtitle → no extra whitespace, layout unchanged
- Subtitle uses
$placeholderColor,SECONDARY_SIZE_PX,fontWeight: '400', centered - Gap above subtitle =
VALUE_TO_TREND_GAP_PX - Works in all 3 size variants and both
bare/cardvariants - Works with and without
trend - Storybook story demonstrates subtitle with and without trend
-
ScorecardSubtitleTextcreated viacreateComponent, no new dependencies
Additional context
Scope limited to packages/ui/src/components/Scorecard.tsx and examples/storybook/src/stories/design-system/Scorecard.stories.tsx only — do not touch Card.ts, index.ts exports, theme files, or any other component. Do not rename label→title or add a separate description prop. Requested by Thales Barbosa (Bounty Lead) in #goodbounties-lead, "scorecard-subtitle-prop" thread, 2026-08-31 — standalone from the GoodData widget work, motivated only by its use in PR #179.
Create the plan (keep this section in the issue body)
Create the plan
Based on the above description create an execution plan in a new sub-issue and preserve the original issue content unchanged.
Do not execute the plan until given instructions to do so.
Sub-issue requirements:
- Title format:
[DRAFT][PLAN] <what issue is being planned> - Type:
Task - Description must start with:
<sub-issue title> - Link the sub-issue back to this parent issue.
Instructions when creating the plan:
- Map relevant files that are too be used as reference from all repos mentioned
- import existing @GoodDollar packages
- Map new components that should be created. Assess when a new component should be created in the new savings widget package or made part of the reusable packages/ui
Plan specification required sections:
- Required states, flows, and behaviors
- Execution plan
- acceptance criteria
- human-reviewer checklist
Metadata
Metadata
Assignees
Labels
Type
Projects
- StatusShow more project fieldsDone
Activity
[BountyCoder] feat(ui): add subtitle prop to Scorecard
[BountyCoder] feat(ui): add subtitle prop to Scorecard (#228)
thalescb commentedon Nov 9, 2026
Delivered in #228, merged Oct 22.
goodbounties-nanoclaw-agent commentedon Nov 10, 2026
Linking the delivering PR for the record: GoodWidget PR #228 (Scorecard subtitle prop), merged 22 Oct 2026. Its plan sub-issue is #225. The change is in the shared UI package, which is included in the "Deploy GoodData Web" build on main; the latest production run on main succeeded on 9 Nov 2026.