Skip to content

Commit

Permalink
docs(preact-components-carousel): more swiper doc tweaks
Browse files Browse the repository at this point in the history
  • Loading branch information
chrisFrazier77 committed Oct 31, 2023
1 parent 231e554 commit a502c09
Show file tree
Hide file tree
Showing 2 changed files with 7 additions and 7 deletions.
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Carousel

Renders a carousel of slides using children, built with [Swiper](https://swiper6.vercel.app)
Renders a carousel of slides using children, built with [Swiper v6.8.4](https://swiper6.vercel.app)

## Sub-components
- Icon
Expand Down Expand Up @@ -101,7 +101,7 @@ The `modules` prop accepts additional [Swiper Modules](https://swiper6.vercel.ap

```jsx
import { Scrollbar } from 'swiper';
<Carousel modules={[Scrollbar]} scrollbar>{children}</Carousel>
<Carousel modules={[Scrollbar]} scrollbar={{ draggable: true }}>{children}</Carousel>
```

### autoAdjustSlides
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@ Any modification to the results array and data are recommended to be made using

## Usage

Additional [Swiper Component Props](https://swiperjs.com/react#swiper-props) can be specified, but may need to be camelCased where appropriate.
Additional [Swiper Modules](https://swiperjs.com/swiper-api#modules) can be provided via the `modules` prop; these may need additional props and or stylesheets.
Additional [Swiper Component Props](https://swiper6.vercel.app/swiper-api#parameters) can be specified, but may need to be camelCased where appropriate.
Additional [Swiper Modules](https://swiper6.vercel.app/swiper-api#modules) can be provided via the `modules` prop; these may need additional props and or stylesheets.

### controller
The required `controller` prop specifies a reference to the RecommendationController
Expand Down Expand Up @@ -81,19 +81,19 @@ The `nextButton` prop specifies the next button element of the carousel. This ca
```

### modules
The `modules` prop accepts additional [Swiper Modules](https://swiperjs.com/swiper-api#modules) - these may need additional props and or stylesheets to function. We include `Navigation` and `Pagination` modules by default.
The `modules` prop accepts additional [Swiper Modules](https://swiper6.vercel.app/swiper-api#modules) - these may need additional props and or stylesheets to function. We include `Navigation` and `Pagination` modules by default.

```jsx
import { Scrollbar } from 'swiper';
<Recommendation controller={controller} modules={[Scrollbar]} scrollbar />
<Recommendation controller={controller} modules={[Scrollbar]} scrollbar={{ draggable: true }} />
```

### breakpoints
An object that modifies the responsive behavior of the carousel at various viewports.

The object key specified the viewport for when the parameters will be applied.

The default configuration contains the following properties, however **`any Recommendation props`**, or [Swiper API parameters](https://swiperjs.com/swiper-api#parameters) can also be specified.
The default configuration contains the following properties, however **`any Recommendation props`**, or [Swiper API parameters](https://swiper6.vercel.app/swiper-api#parameters) can also be specified.

`slidesPerView` - number of products to display per page

Expand Down

0 comments on commit a502c09

Please sign in to comment.