ContentWithImageProductData

React SDK guidance for ContentWithImageProductData.

Exact exports, props, slots, hooks, and runtime behavior belong to SDK package reference. Examples are guidance unless explicitly marked copy-paste-safe.

Review component intent and composition guidance before wiring this component into an app. Then use the live playground to confirm the rendered behavior.

Playground

When to use it

Use ContentWithImageProductData when a section should pair one strong product image with supporting copy, benefit bullets, and a direct path deeper into the product story.

Composition notes

The section is prop-driven. image, preheader, heading, and body define the narrative, usps adds a compact checklist, and productCards lets you extend the section with related commerce content.

Behavior and theming guidance

Keep the USP list short and concrete. This component works best when the image and the bullets support the same sales story instead of trying to introduce several competing messages.

Contract scope

  • Use SDK package reference for exact props, exports, slots, hooks, and runtime behavior.
  • Public import: @enadhq/enad-react-sdk/client/storefront.
  • Playground route: /sandbox?component=ContentWithImageProductData.
  • Copy/paste scope: guidance-only. Treat examples as guidance until checked against SDK package reference.

Implementation notes

ContentWithImageProductData

# ContentWithImageProductData > Exact exports, props, slots, hooks, and runtime behavior belong to SDK package reference. Examples are guidance unless explicitly marked copy-paste-safe. Review component intent and composition guidance before wiring this component into an app. Then use the live playground to confirm the rendered behavior. ## Playground - Import path: `@enadhq/enad-react-sdk/client/storefront`. - Live playground: [/components/storefront/content-with-image-product-data](https://sdk.enad.io/components/storefront/content-with-image-product-data). ## When to use it Use `ContentWithImageProductData` when a section should pair one strong product image with supporting copy, benefit bullets, and a direct path deeper into the product story. ## Composition notes The section is prop-driven. `image`, `preheader`, `heading`, and `body` define the narrative, `usps` adds a compact checklist, and `productCards` lets you extend the section with related commerce content. ## Behavior and theming guidance Keep the USP list short and concrete. This component works best when the image and the bullets support the same sales story instead of trying to introduce several competing messages. ## Contract scope - Use SDK package reference for exact props, exports, slots, hooks, and runtime behavior. - Public import: `@enadhq/enad-react-sdk/client/storefront`. - Playground route: /sandbox?component=ContentWithImageProductData. - Copy/paste scope: guidance-only. Treat examples as guidance until checked against SDK package reference. ### Implementation notes