ResolvedProductCardTokens

Flat per-knob token map for the product card. Keys are the camelCase mirror of the --product-card-* CSS custom properties in apps/storefront/src/app/globals.css (html:root): a key maps to --product-card-${kebab(key)} with two exceptions — the aspect-ratio knobs (aspectVertical, aspectHorizontal, aspectHorizontalSquare, aspectMicro) map to the --aspect-product-card-* namespace instead. Numeric and boolean knobs are typed as such because the CSS values are unitless (titleLineClamp: 2, oosOpacity: 0.7, saleBadgeAllowOverlap: false) — typing them all as string would mis-serialize them. Quoted knobs (imageSizes, ctaPillLabel, ctaPillIcon, saleBadgeText) hold the logical content; the storefront serializer wraps them in CSS quotes on emit. Knobs annotated LEGACY back pre-Phase-3 primitives and are slated for removal with their CSS vars in Phase 3 of .specs/2026-05-26-product-card-redesign/.

Properties

Example

import type { ResolvedProductCardTokens } from '@nordcom/commerce-db';
function ctaBackground(t: ResolvedProductCardTokens): string {
    return t.ctaBg;
}

Related

FeatureFlagService ReviewService ShopService FeatureFlagOption FeatureFlagRef ResolvedCartLineTokens ResolvedShopTheme ShopBase