Reference
UI states
Every meaningful state of the bundle-subscription components, pinned in one place. Use this as the spec when wiring these patterns into a real company storefront.
Subscribe row (PDP)
Unchecked — shows preview discount
Checked monthly — cadence picker visible
Checked quarterly — different save amount
Single plan — no cadence dropdown
Subscription badge (cart drawer / checkout)
One-time
Subscribed monthly — click to swap cadence
Variant badge
Two variants — clickable
One variant
Hidden by design — a non-interactive pill adds visual noise without giving the user anything to do.
Bundle BGI row (PDP)
Fluid Eagle Tee ×1
495.00Default — not subscribed
Fluid Eagle Tee ×1
495.00Subscribed — red discount + cadence
Fluid Eagle Tee ×1Sold out
495.00Sold out — image fades, subscribe hidden
Fluid Eagle Tee ×1Coming soon
495.00Coming soon
Cart drawer line
Fluid Eagle Tee
One-time line
Fluid Eagle Tee
Subscribed line — discounted price + cadence pill
Fluid Supply Bundle
- Fluid Eagle Tee ×1
- Fluid Long Sleeve ×1
Bundle line with subscribed BGI
/request summary
No subscriptions, no discount
With subscription savings
With promo code applied
Subscription + promo code stacked
Express shipping selected
Discount code field
Empty — Apply disabled
Applied — confirmation chip + Remove
Checkbox
Unchecked
Checked