Bedrock Layout Primitives Home
Edit page
Components
AppBoundaryCSS-ResetCenterColumnsCoverFrameGridInlineClusterPadBoxReelUse caseHow to installBasic usageStorybookPropertiesSpacing ConstantsSplitStackSwitcheruseContainerQueryuseForwardedRefuseMatchContainerSizesuseMatchMediauseMediaQueryuseStatefulRef
HomeInspirationLayout PrimitivesRegarding IE11Why Styled Components?

Reel

Note: This is an experimental primitive and still not in v1 release, use with caution

Use case

Scrolling is a popular and natural way to interact with web content. The Reel is designed to organize content into scrollable flat lists with convenient scroll breakpoints. Optimally used with the tabIndex attribute.

How to install

If you haven't already, install styled-components:

npm install styled-components

Then install the stack component

npm install @bedrock-layout/reel

Basic usage

Random image from unsplashRandom image from unsplashRandom image from unsplashRandom image from unsplashRandom image from unsplash

Storybook

Checkout storybook for more details.

Properties

PropertyTypeDefault
maxHeightnumberN/A
maxWidthnumberN/A
snapXbooleanfalse
snapYbooleanfalse