Edit in GitHubLog an issue

Products

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

NameTypeDescription
props
React component props

Sort products based on the original order

Returns: Parameters

NameType
urlKeys
Array
products
Array

Props for Products

Properties

NameTypeDescription
classes
Object
An object containing the class names for the Products
classes.root
String
CSS class for products
classes.carousel
String
CSS class for products carousel appearance
classes.centerMode
String
CSS class for products carousel appearance with center mode
classes.centerModeSmall
String
CSS class for products carousel appearance with center mode on small screen
classes.galleryItems
String
CSS class to modify child gallery items
classes.error
String
CSS class for displaying fetch errors
appearance
String
Sets products appearance
autoplay
Boolean
Whether the carousel should autoplay
autoplaySpeed
Number
The speed at which the autoplay should move the slide on
infinite
Boolean
Whether to infinitely scroll the carousel
arrows
Boolean
Whether to show arrows on the slide for navigation
dots
Boolean
Whether to show navigation dots at the bottom of the carousel
draggable
Boolean
Enable scrollable via dragging on desktop
carouselMode
String
Carousel mode
centerPadding
String
Horizontal padding in centerMode
pathNames
Array
List of Url path names to load into product list
textAlign
String
Alignment of content within the products list
border
String
CSS border property
borderColor
String
CSS border color property
borderWidth
String
CSS border width property
borderRadius
String
CSS border radius property
marginTop
String
CSS margin top property
marginRight
String
CSS margin right property
marginBottom
String
CSS margin bottom property
marginLeft
String
CSS margin left property
paddingTop
String
CSS padding top property
paddingRight
String
CSS padding right property
paddingBottom
String
CSS padding bottom property
paddingLeft
String
CSS padding left property
cssClasses
Array
List 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

  • Privacy
  • Terms of Use
  • Do not sell or share my personal information
  • AdChoices
Copyright © 2024 Adobe. All rights reserved.