### Slider Layout Block Names and Descriptions

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

This section provides a list of available blocks exported by the `slider-layout` app, including `slider-layout` for building block sliders and `slider-layout-group` for synchronizing slider groups.

```APIDOC
Block Names:
- `slider-layout`: Builds block sliders for your store through its `children` list blocks.
- `slider-layout-group`: Enables you to keep a group of `slider-layout` blocks synched with each other.
```

--------------------------------

### Add Slider Layout App Dependency to manifest.json

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

This snippet shows how to add the `vtex.slider-layout` app as a dependency in your theme's `manifest.json` file, enabling its blocks for use.

```json
"dependencies": {
  "vtex.slider-layout": "0.x"
}
```

--------------------------------

### JSON Configuration for Slider Layout Group

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

This JSON snippet demonstrates how to configure the `slider-layout-group` block by declaring a list of `slider-layout` blocks as its children. The `slider-layout-group` acts as a logical container, synchronizing the slides of its child `slider-layout` blocks. All child `slider-layout` blocks must have identical configurations, differing only in their `children` block list.

```json
{
  "slider-layout-group#test": {
    "children": ["slider-layout#1", "slider-layout#2", "slider-layout#3"]
  }
}
```

--------------------------------

### Slider Layout Component Properties Reference

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

Defines the configurable properties for the `slider-layout` component, allowing customization of its behavior and appearance, such as pagination, item display, and animation.

```APIDOC
SliderLayoutProperties:
  showPaginationDots:
    type: enum
    description: Indicates when pagination dots should be rendered. Possible values are: mobileOnly, desktopOnly, always, or never.
    default: always
  infinite:
    type: boolean
    description: Determines whether the slider should be infinite (true) or not (false). When this prop is set as false, the slider will have an explicit end for users.
    default: false
  usePagination:
    type: boolean
    description: Determines whether the slider should use slide pages (true) or not (false). When this prop is set as false, the slider will use smooth scrolling for slide navigation instead of arrows.
    default: true
  itemsPerPage:
    type: object
    description: The number of slider items to be shown on each type of device. For more information about this, see the itemsPerPage object section below.
    default: { desktop: 5, tablet: 3, phone: 1 }
  navigationStep:
    type: number / enum
    description: The number of slider items that should be displayed when users click one of the slider arrows. It is also possible to set this prop value as page, meaning that the number of slider items to be displayed when one of the arrows is clicked is equal to the number of slider items set per page (in the itemsPerPage prop).
    default: page
  slideTransition:
    type: object
    description: Controls the transition animation between slides based on CSS attributes. For more information about this, see the slideTransition object section below.
    default: { speed: 400, delay: 0, timing: '' }
  autoplay:
    type: object
    description: Controls the autoplay feature behavior. For more information about this, see the autoplay object section below.
    default: undefined
```

--------------------------------

### Slider Layout Main Properties

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

Defines core visual and behavioral properties for the slider, such as width, arrow sizing, and slide centering.

```APIDOC
fullWidth: boolean
  Description: Determines whether the slides should occupy the full page width, making the arrows appear on top of them (true) or not (false).
  Default Value: true
arrowSize: number / object
  Description: Slider arrows size (height and width) in pixels. This is a responsive prop, which means you can pass to it an object with different values for each breakpoint (desktop, mobile, tablet, and phone).
  Default Value: 25
centerMode: enum / object
  Description: Defines positioning of the slider elements on the screen. Possible values are: center (elements are centered, allowing users to see a peek of the previous and next slides), to-the-left (aligns elements to the left side, allowing users to see a peek of the next slide, but not the previous one), and disabled (disables the feature, rendering elements on the whole screen without showing a peek of the previous and next slides). Note: This is a responsive prop, which means you can pass to it an object with different values for each breakpoint (desktop, mobile, tablet, and phone).
  Default Value: disabled
centerModeSlidesGap: number
  Description: Number of pixels between slides when centerMode is set to center or to-the-left.
  Default Value: undefined
```

--------------------------------

### Available CSS Handles for Slider Layout Styling

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

This section lists the CSS handles available for customizing the appearance of `slider-layout` and related components. These handles allow developers to apply specific CSS rules to various parts of the slider for tailored styling.

```APIDOC
paginationDot--isActive
paginationDot
paginationDotsContainer
slide--firstVisible
slide--hidden
slide--lastVisible
slide--visible
slideChildrenContainer
slide
sliderArrows
sliderLayoutContainer
sliderLeftArrow
sliderRightArrow
sliderTrackContainer
sliderTrack
```

--------------------------------

### Slider Layout itemsPerPage Object

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

Configures the number of slides displayed per page across different device breakpoints (desktop, tablet, phone).

```APIDOC
itemsPerPage object:
  desktop: number
    Description: The number of slides to be displayed on desktop devices.
    Default Value: 5
  tablet: number
    Description: The number of slides to be displayed on tablet devices.
    Default Value: 3
  phone: number
    Description: The number of slides to be displayed on phone devices.
    Default Value: 1
```

--------------------------------

### Slider Layout autoplay Object

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

Manages the automatic progression of slides, including timeout and stopping behavior on hover.

```APIDOC
autoplay object:
  timeout: number
    Description: Timeout (in ms) between each slide.
    Default Value: undefined
  stopOnHover: boolean
    Description: Determines whether the autoplay should stop when users are hovering over the slider (true) or not (false).
    Default Value: undefined
```

--------------------------------

### Slider Layout Block Properties Reference

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

This section details the configurable properties for the `slider-layout` block, including `label` for accessibility and `showNavigationArrows` to control arrow visibility based on device.

```APIDOC
Properties for `slider-layout`:
- `label` (Type: `string`, Default: `slider`): `aria-label` attribute value to be used by the `<Slider/>` component when rendered. The `aria-label` value should explicitly tell users what the inspected HTML element does.
- `showNavigationArrows` (Type: `enum`, Default: `always`): Indicates when navigation arrows should be rendered. Possible values are: `mobileOnly`, `desktopOnly`, `always`, or `never`.
```

--------------------------------

### Configure Slider Layout Block in VTEX Template

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

This JSON snippet demonstrates how to configure a `slider-layout` block in a VTEX template, including properties like `itemsPerPage`, `infinite` scrolling, navigation arrow visibility, and its children `rich-text` blocks.

```json
  "slider-layout#text-test": {
    "props": {
      "itemsPerPage": {
        "desktop": 1,
        "tablet": 1,
        "phone": 1
      },
      "infinite": true,
      "showNavigationArrows": "desktopOnly",
      "blockClass": "carousel"
    },
    "children": ["rich-text#1", "rich-text#2", "rich-text#3"]
  },

  "rich-text#1": {
    "props": {
      "text": "Test1"
    }
  },
  "rich-text#2": {
    "props": {
      "text": "Test2"
    }
  },
  "rich-text#3": {
    "props": {
      "text": "Test3"
    }
  }
```

--------------------------------

### Slider Layout slideTransition Object

Source: https://github.com/vtex-apps/slider-layout/blob/master/docs/README.md

Defines the animation properties for slide transitions, including speed, delay, and timing function.

```APIDOC
slideTransition object:
  speed: number
    Description: Transition speed (in ms).
    Default Value: 400
  delay: number
    Description: Delay between slide transition (in ms).
    Default Value: 0
  timing: string
    Description: Timing function.
    Default Value: ''
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.