Editorial, merchandising, media, and storefront content blocks for product and landing pages.

Choose the right storefront content surface, then move to the guide or component family that matches the job. Exact props and child-part contracts stay in SDK package reference.

When to use this family

Start here when you are choosing authored storefront blocks for landing pages, campaign pages, editorial sections, or merchandising-heavy content.

Common jobs:

• heroes, galleries, image-led content, captions, and editorial text blocks
• quick links, CTA groups, link blocks, and content-led page sections
• merchandising composition where product information appears inside broader storytelling or marketing content
• page assembly decisions that are about section choice more than product discovery or cart flow

When to switch routes

Switch routes when the task moves beyond storefront block selection:

• I need page-level assembly rules for a full storefront route -> Storefront page guide
• I need product listing, filters, Search, or discovery flows -> Product listing and search and Commerce components
• I need PDP, cart, purchase actions, or checkout-adjacent UI -> Product detail page and Commerce components
• I need headers, footers, menus, or shell chrome -> Layout components
• I need exact props, child parts, or runtime behavior -> SDK package reference

Public import path

Import components from @enadhq/enad-react-sdk/client/storefront.

Common starting points in this family

Use these as common starting points when you already know the storefront content pattern. The full component list below remains the canonical route inventory for this family:

• Hero and lead content -> Hero, BlockHeading, CTAGroup, QuickLinks
• Editorial text and mixed media -> TextContent, TextContentWithImage, VariableTextContent, ContentWithGallery
• Image and gallery-led sections -> Gallery, GalleryWithCaption, GalleryWithLinkBlocks, ImageBlock, ImageWithHover, CardImageWithCaption, CardVideo
• Merchandising and product-aware content blocks -> ProductCard, ProductImage, ContentWithImageProductData, LinkBlock, LinkBlockSmall

Component docs

• AccordionBlock - AccordionBlock
• BlockHeading - BlockHeading
• CardImageWithCaption - CardImageWithCaption
• CardVideo - CardVideo
• ContentWithGallery - ContentWithGallery
• ContentWithImageProductData - ContentWithImageProductData
• CTAGroup - CTAGroup
• DownloadItem - DownloadItem
• Gallery - Gallery
• GalleryWithCaption - GalleryWithCaption
• GalleryWithLinkBlocks - GalleryWithLinkBlocks
• Hero - Hero
• ImageBlock - ImageBlock
• ImageWithHover - ImageWithHover
• LinkBlock - LinkBlock
• LinkBlockSmall - LinkBlockSmall
• ProductCard - ProductCard
• ProductImage - ProductImage
• QuickLinks - QuickLinks
• Spacer - Spacer
• TextContent - TextContent
• TextContentWithImage - TextContentWithImage
• TruncatedText - TruncatedText
• VariableTextContent - VariableTextContent

Playground

Open the live playground category at sdk.enad.io/components/storefront when you need runtime experimentation or visual verification after you choose a storefront content route.