CartTrigger
Cart button for headers and utility bars with count state and open-close wiring.
Best for
Import
import { CartTrigger } from "@enadhq/enad-react-sdk/client/cart"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.
Examples
Live examples you can edit directly in the sandbox.
Header trigger
Use the trigger in the shell and connect it to the same state as the cart drawer or other cart overlay.
Component Sets
Preview the first example across the available component-set presets to compare tone, spacing, and structural defaults.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| isOpen | boolean | — | No description yet. |
| onOpenChange | (open: boolean) => void | — | No description yet. |
| labels | string | {} | No description yet. |
| className | string | No description yet. |