Functions
[restoreSortOrder(urlKeys, products)] ⇒ Array
Sort products based on the original order
Typedefs
[props]
Props for Products
Page Builder Products component.
This component is part of the Page Builder / PWA integration. It can be consumed without Page Builder.
Returns: React.Element — A React component that displays a Products based on a number of products
Parameters
Name
Type
Description
props
propsReact component props
Sort products based on the original order
Returns: Parameters
Name
Type
urlKeys
Arrayproducts
ArrayProps for Products
Properties
Name
Type
Description
classes
ObjectAn object containing the class names for the Products
classes.root
StringCSS class for products
classes.carousel
StringCSS class for products carousel appearance
classes.centerMode
StringCSS class for products carousel appearance with center mode
classes.centerModeSmall
StringCSS class for products carousel appearance with center mode on small screen
classes.galleryItems
StringCSS class to modify child gallery items
classes.error
StringCSS class for displaying fetch errors
appearance
StringSets products appearance
autoplay
BooleanWhether the carousel should autoplay
autoplaySpeed
NumberThe speed at which the autoplay should move the slide on
infinite
BooleanWhether to infinitely scroll the carousel
arrows
BooleanWhether to show arrows on the slide for navigation
dots
BooleanWhether to show navigation dots at the bottom of the carousel
draggable
BooleanEnable scrollable via dragging on desktop
carouselMode
StringCarousel mode
centerPadding
StringHorizontal padding in centerMode
pathNames
ArrayList of Url path names to load into product list
textAlign
StringAlignment of content within the products list
border
StringCSS border property
borderColor
StringCSS border color property
borderWidth
StringCSS border width property
borderRadius
StringCSS border radius property
marginTop
StringCSS margin top property
marginRight
StringCSS margin right property
marginBottom
StringCSS margin bottom property
marginLeft
StringCSS margin left property
paddingTop
StringCSS padding top property
paddingRight
StringCSS padding right property
paddingBottom
StringCSS padding bottom property
paddingLeft
StringCSS padding left property
cssClasses
ArrayList of CSS classes to be applied to the component
slidesToShow
Number# of slides to show at a time
slidesToShowMedium
Number# of slides to show at a time on medium sized screens
slidesToShowSmall
Number# of slides to show at a time on small screen
slidesToShowSmallCenterMode
Number# of slides to show at a time on small screen in centerMode
Source Code: pwa-studio/packages/pagebuilder/lib/ContentTypes/Products/products.js