React SDK latest

Public landing page and route chooser for the latest @enadhq/enad-react-sdk docs.

Package: @enadhq/enad-react-sdk.
Docs channel: latest (1.9.3).
Version range: >=1.9.0 <1.10.0.

Use this landing page to choose the right React SDK route before writing code. The latest track currently describes @enadhq/enad-react-sdk@1.9.3 and focuses on integration flow, component selection, Search runtime boundaries, storefront composition, and theming decisions.

Check SDK package reference for exact exports, props, hooks, component parts, package versions, and runtime behavior.

Start here

Start with setup when you are installing the package for the first time. Use the job-based routes below when you already know whether the work is storefront composition, Search, account/auth/cart integration, theming, or component discovery.

If you are starting from zero

Set up the React SDK - install the package version for this track, import the stylesheet once, add EnadProvider, and decide when Search context, cart behavior, or scoped theme state belongs at the app boundary.
Build the first app shell - create the smallest useful provider/theme shell before choosing a storefront or commerce surface.
Choose an import surface - keep root setup imports, grouped public entry points, and documented exceptions straight before writing component code.
Wire runtime adapters - decide how app-owned navigation, cookies, locale, and shopper runtime identity cross into the provider boundary.

If you already know the job to be done

For storefront composition or page assembly, use Storefront page guide.
For product listing or Search UI, use Product listing and search.
For PDP or purchase-adjacent UI, use Product detail page and Commerce components.
For theme handoff from the playground, use Theme from playground, Theming, and Playground bridge.
For account, auth, or cart seams, use Account and auth UI and Cart adapters.
To browse component families first, start with Components overview.

Before you trust a detail

Use these docs to choose the route and understand ownership. Then hand off to the right reference for exact implementation facts:

Exact package exports, prop names, hooks, and runtime behavior belong in SDK package reference.
Interactive theme and component behavior belongs in the live sandbox.
Search query shape, generated documents, and response fields belong in Search GraphQL latest.
This landing page owns route selection, boundary setting, and next-step handoff.

Guide flows

Job	Use this route	What it decides
Install and provider setup	Setup	Stylesheet import, `EnadProvider`, app-wide component-set placement, optional scoped `EnadThemeProvider`, and Search runtime context placement.
Choose the right public package entry point	Import surfaces	Root setup imports, grouped public barrels, and the few documented deep exceptions.
Framework/runtime boundary wiring	Runtime adapters	Navigation, cookie, locale, and shopper runtime-identity seams that stay app-owned.
Account and auth UI	Account and auth UI	Public `client/user` surface for login, signup, password recovery, sign-out, and `useUser`, plus the app-owned auth boundary around it.
Live cart backend selection	Cart adapters	Shipped Brink and mock adapters plus the custom `CartAdapter` seam.
First working React app	First React SDK app	Minimal shell, safe first surface, and what to keep out of handwritten examples.
Theme/playground handoff	Theme from playground and Theming	Theme hashes, component sets, provider nesting, and precedence rules.
Storyblok-authored storefront content	Storyblok storefront bridge	App/CMS ownership boundaries, the public Storyblok import surface, and where to verify renderer behavior.
Storefront composition	Storefront page guide	Header/footer chrome, hero/content blocks, galleries, product display, and app-owned routing/data boundaries.
Search or PLP	Product listing and search	Search input, filters, listing layout, connected Search components, and provider-backed Search context.
Curated live examples and runtimes	React SDK examples	Storybook, sandbox, and showcase routes with guidance on when to inspect rather than copy.
PDP and commerce UI	Product detail page and Commerce components	PDP hero anatomy, media, price, variant selection, quantity, purchase controls, and checkout-adjacent boundaries.
Component selection/reference	React SDK components	Component families, package metadata, playground routes, and guidance pages for Base UI, Layout, Storefront, and Commerce components.

Search runtime facts to preserve

React SDK Search guidance must keep shopper context explicit:

provider-backed Search runtime keeps market, store group, and locale together.
graphql.storeGroupSlug can override groupId for Search context.
mapSearchProductToProductCard() accepts storeGroupSlug so mapped product cards can prefer the intended store-group price.

Use Product listing and search for React UI composition and Search GraphQL latest when query shape, generated documents, fields, filters, facets, or response types are the question.

Exact package details

Package reference: React SDK package reference.
Runtime sandbox and theme playground: sdk.enad.io/sandbox.
Current SDK docs/playground surface: sdk.enad.io.
This guide: public routing guidance, integration guides, agent summaries, and package-derived reference pages.

Before copying implementation details, check SDK package reference for exact public imports, prop names, hook signatures, helper signatures, generated Search documents, and runtime behavior. Use these routes to decide where a concern belongs, not to invent API shape.

For agent-assisted work, start with React SDK agent guide, then use the narrower discovery, theme/icons, or commerce/Search handoff route when it matches the job.

Scope

This guide does not duplicate prop tables, Search fragments, hook signatures, component part contracts, or runtime implementation details. For exact shapes, verify against SDK package reference first, then return here for route selection and ownership boundaries.