StackCommerce Design System
Static component library for the StackCommerce redesign. Each component below corresponds 1:1 to a ViewComponent class. Not wired to the live Rails app.
- Accordion
Single-open-section groups via native <details name>: AccordionComponent
- Builder + Preview
Split builder + live illustrative mockup, composed from Accordion and a preview frame: BuilderPreviewComponent
- Button
Primary, secondary, danger, ghost: ButtonComponent
- Data Table
Sortable/dense data display: DataTableComponent
- Form Field
Labeled field wrapper: default, focus, error, disabled: FieldComponent
- Form Controls
Checkbox, chip, radio, select, and label conventions underneath Form Field
- Flash
Page-top action acknowledgment: success/danger/warning/info: FlashComponent
- Grouped Dual-List
Searchable included/excluded picker: GroupedDualListComponent
- Modal
Confirmation & detail overlays: ModalComponent
- Rich Text
WYSIWYG editor mockup for marketing/redemption copy: RichTextComponent
- Search Bar
Uber-search + more-filters popover: SearchBarComponent
- Status Badge
Semantic state indicators: StatusBadgeComponent
- Tab Bar
Non-sequential section nav for edit flows, pairs with the Completeness sidebar: TabBarComponent
- Tooltip
Rich hover/focus detail panel, e.g. a payment breakdown: TooltipComponent
- Typography
Type scale, weights, and Archivo/Fragment Mono usage