CartTrigger

React SDK guidance for CartTrigger.

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 CartTrigger anywhere the shell needs a clear cart entry point. It is most common in headers, sticky nav bars, and compact mobile utility rows.

The component works best when it is the single obvious cart action in the current shell.

Composition notes

CartTrigger is usually paired with CartDrawer. Keep the open state controlled from the shell so keyboard shortcuts, header actions, and backdrop close behavior all go through the same state path.

Behavior and theming guidance

Make sure the count and open state reflect live cart context. The trigger is small, so clarity matters more than decorative styling.

If the shell already has many utility actions, give the cart trigger enough spacing and contrast so the visitor can find it quickly.

Review notes

These notes define scoped usage boundaries without claiming exact prop or runtime truth beyond SDK package reference.

CartTrigger stays the shell's cart entry point. The component can signal cart state and open an attached drawer or route, while the app owns the live cart runtime, route policy, and broader shell identity.

  • Keep the trigger connected to an app-owned cart runtime wired at EnadProvider; use Cart adapters for Brink, mock, or custom backend decisions.
  • When cart behavior depends on localized routes, shopper cookies, or request/session identity, keep those seams in the provider shell documented by Runtime adapters.
  • Treat the trigger as a control surface, not as the place where cart clients, backend fetches, or route logic are created.

Contract scope

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

Implementation notes

CartTrigger

# CartTrigger > 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/cart`. - Live playground: [/components/commerce/cart-trigger](https://sdk.enad.io/components/commerce/cart-trigger). ## When to use it Use `CartTrigger` anywhere the shell needs a clear cart entry point. It is most common in headers, sticky nav bars, and compact mobile utility rows. The component works best when it is the single obvious cart action in the current shell. ## Composition notes `CartTrigger` is usually paired with `CartDrawer`. Keep the open state controlled from the shell so keyboard shortcuts, header actions, and backdrop close behavior all go through the same state path. ## Behavior and theming guidance Make sure the count and open state reflect live cart context. The trigger is small, so clarity matters more than decorative styling. If the shell already has many utility actions, give the cart trigger enough spacing and contrast so the visitor can find it quickly. ## Review notes These notes define scoped usage boundaries without claiming exact prop or runtime truth beyond SDK package reference. `CartTrigger` stays the shell's cart entry point. The component can signal cart state and open an attached drawer or route, while the app owns the live cart runtime, route policy, and broader shell identity. - Keep the trigger connected to an app-owned cart runtime wired at `EnadProvider`; use [Cart adapters](/react-sdk/latest/guides/cart-adapters) for Brink, mock, or custom backend decisions. - When cart behavior depends on localized routes, shopper cookies, or request/session identity, keep those seams in the provider shell documented by [Runtime adapters](/react-sdk/latest/guides/runtime-adapters). - Treat the trigger as a control surface, not as the place where cart clients, backend fetches, or route logic are created. ## Contract scope - Use SDK package reference for exact props, exports, slots, hooks, and runtime behavior. - Public import: `@enadhq/enad-react-sdk/client/cart`. - Playground route: /sandbox?component=CartTrigger. - Copy/paste scope: guidance-only. Treat examples as guidance until checked against SDK package reference. ### Implementation notes