Storybook story file for the `CardsStrip` component, covering chevron navigation, mixed card types, marquee auto-scroll, overflow edge cases, and custom cell width variants using real entity card fixtures. ## Key Components | Export | Description | |---|---| | `CaseStudiesChevrons` | Chevron-nav strip of 7 uniform case-study cards with `autoScroll={false}` (Figma 3905:77388) | | `MixedCardTypes` | Strip mixing `CaseStudyCard`, `BlogCard`, and `CustomerInterviewCard` to verify row alignment | | `MarqueeOptIn` | Default marquee mode; documents clone accessibility contract (aria-hidden, tabindex suppression, click passthrough) | | `TwoItemsNoOverflow` | Edge case — fewer items than viewport width, so no clones, chevrons, or marquee activate | | `CustomCellWidth` | Demonstrates `cardWidthDesktop`/`cardWidthMobile` overrides for compact layouts | All stories use **organic children mode** (plain JSX children, no strip-side registration). The render-prop mode is covered by `VideoBitesStrip.stories.tsx`. ## Usage Example ```typescript // Chevron strip — pass autoScroll={false} for entity strips {caseStudies.map(study => ( ))} // Marquee strip — omit autoScroll (engine default is true) {caseStudies.map(study => ( ))} // Custom cell widths {/* cards */} ``` > **Guidance:** Always pass `autoScroll={false}` for chevron-style entity strips. The engine defaults to `autoScroll={true}` for the marquee/bites contract — omitting it in an entity strip will silently enable marquee behavior.