$schema: https://git.drupalcode.org/project/drupal/-/raw/HEAD/core/assets/schemas/v1/metadata.schema.json
name: Views view Heroslider
status: experimental
description: 'A slideshow component for cycling through elements images/media or slides of text—like a heroslider.'
group: Views
props:
  type: object
  properties:
    id:
      type: string
      title: 'Heroslider ID'
      description: 'Set a unique id on the heroslider for optional controls, especially if the single page is using multiple hero sliders.'
    controls:
      type: boolean
      title: 'Controls'
      description: 'Add the previous/next controls.'
      default: false
      $ref: "ui-patterns://boolean"
    indicators:
      type: boolean
      title: 'Indicators'
      description: 'Add indicators to the heroslider, alongside the previous/next controls.'
      default: false
      $ref: "ui-patterns://boolean"
    controls_indicators_position:
      type: string
      title: 'Controls & Indicators position'
      description: 'Choose the location controls and indicators from (overlay|start|end|top|bottom).'
      default: "overlay"
      enum:
        - "overlay"
        - "start"
        - "end"
        - "top"
        - "bottom"
    interval:
      type: number
      title: 'Interval'
      description: 'The amount of time to delay between automatically cycling an item.'
      default: 5000
    keyboard:
      type: boolean
      title: 'Keyboard'
      description: 'Whether the carousel should react to keyboard events.'
      default: true
      $ref: "ui-patterns://boolean"
    pause:
      type: string
      title: 'Pause'
      description: 'If set to `hover`, pauses the cycling of the carousel on mouseenter and resumes the cycling of the carousel on mouseleave. If set to false, hovering over the carousel won’t pause it. On touch-enabled devices, when set to `hover`, cycling will pause on touchend (once the user finished interacting with the carousel) for two intervals, before automatically resuming. This is in addition to the mouse behavior.'
      default: 'hover'
      enum:
        - ''
        - 'false'
        - 'true'
        - 'hover'
    ride:
      type: string
      title: 'Ride'
      description: 'If set to `true`, autoplays the carousel after the user manually cycles the first item. If set to `carousel`, autoplays the carousel on load.'
      default: 'false'
      enum:
        - ''
        - 'false'
        - 'true'
        - 'carousel'
    touch:
      type: boolean
      title: 'Touch'
      description: 'Whether the carousel should support left/right swipe interactions on touchscreen devices.'
      default: true
      $ref: "ui-patterns://boolean"
    wrap:
      type: boolean
      title: 'Wrap'
      description: 'Whether the carousel should cycle continuously or have hard stops.'
      default: true
      $ref: "ui-patterns://boolean"
    heroslider_utility_classes:
      type: array
      title: 'Utility Classes'
      default: []
      items:
        type: 'string'
      description: 'An array of utility classes. Use to add extra Bootstrap utility classes or custom CSS classes over to the heroslider element.'
    heroslider_controls_utility_classes:
      type: array
      title: 'Controls Utility Classes'
      description: 'An array of utility classes. Use to add extra Bootstrap utility classes or custom CSS classes over to the controls element.'
      default: []
    heroslider_indicators_utility_classes:
      type: array
      title: 'Indicators Utility Classes'
      default: []
      items:
        type: 'string'
      description: 'An array of utility classes. Use to add extra Bootstrap utility classes or custom CSS classes over to the indicators element.'
    attributes:
      type: object
      title: 'Attributes'
      description: 'HTML attributes to apply to the hero slider main wrapper tag.'
      $ref: 'ui-patterns://attributes'
    controls_attributes:
      type: object
      title: Controls Attributes
      description: 'HTML attributes to apply to the controls wrapper tag.'
      $ref: 'ui-patterns://attributes'
    indicators_attributes:
      type: object
      title: 'Indicators Attributes'
      description: 'HTML attributes to apply to the indicators wrapper tag.'
      $ref: 'ui-patterns://attributes'
slots:
  rows:
    type: array
    title: 'Rows'
    description: 'Rows'
    items:
      type: 'object'
  empty:
    type: string
    title: 'Empty'
    description: 'The HTML message when the Hero Slider has no slides'
    default: ''
libraryOverrides:
  dependencies:
    - vartheme_bs5/bs-carousel-script
    - vartheme_bs5/local-video-slider
    - vartheme_bs5/youtube-video-slider
    - vartheme_bs5/vimeo-video-slider
    - drimage_improved/drimage_improved
