sm-product
Single-product feature card. Composed of: HStack(Image + VStack(Text + Text + Button)). Compact tier collapses to horizontal strip; expanded adds description + secondary CTA.
Responsive Preview — viewport @media queries
Mobile · 375 px
Tablet · 768 px
Desktop · 1280 px
Container Tier (SM widget responsive system)
Container width
Live Preview (chrome-mode, container-tier knobs)
DSL usage
Attributes
| Name | Type | Default | Description |
|---|---|---|---|
product-id | String | — | Catalog identifier |
title | String | — | Display title |
price | Decimal | — | Numeric price |
currency | ISO-4217 | EUR | EUR | USD | GBP | … |
image | URL | — | Hero image URL |