Single-row horizontally-scrolling strip of quick-action chips, a thin preset wrapper around `QuickActionWall` that enforces a `flex-nowrap` single-axis layout with optional endless marquee animation. ## Key Components ### `QuickActionMarquee` (component) The primary export. Converts `QuickActionMarqueeItem[]` into `QuickActionChip[]` via `useMemo` and delegates rendering to `QuickActionWall` with `axis="x"` and `flex-nowrap` content layout. **Props (`QuickActionMarqueeProps`):** | Prop | Type | Default | Description | |---|---|---|---| | `items` | `ReadonlyArray` | — | Chip data | | `mode` | `'animated' \| 'plain'` | `'animated'` | Endless scroll or static row | | `direction` | `'left' \| 'right'` | `'left'` | Scroll travel direction | | `speed` | `number` | `40` | Scroll speed in px/s | | `pauseOnHover` | `boolean` | `true` | Pause scroll on hover | | `onSelect` | `(item) => void` | — | Makes chips interactive buttons; omit for decorative tags | | `minChips` | `number` | `12` | Minimum chip count for loop overflow (~2600px+) | | `sync` | `MarqueeSyncController` | — | Pixel-locks sibling marquee strips under one position driver | | `className` | `string` | — | Root element class override | ### `QuickActionMarqueeItem` (interface) Data shape for each chip: `id` (stable key), `label`, and optional `icon` (React node or `QuickActionIconSpec`). ## Usage Example ```typescript import { QuickActionMarquee } from './quick-action-marquee' const SUGGESTIONS: QuickActionMarqueeItem[] = [ { id: 'restart', label: 'Restart service', icon: }, { id: 'logs', label: 'View logs' }, { id: 'deploy', label: 'Deploy patch' }, ] // Animated, interactive strip console.log('Selected:', item.label)} /> // Static decorative row (no motion, no cloning) ``` > **Motion safety:** the underlying `QuickActionWall` engine always respects `prefers-reduced-motion`. In `plain` mode, `minChips` padding is disabled since no looping occurs.