bootstrap-vue
Version:
With more than 85 components, over 45 available plugins, several directives, and 1000+ icons, BootstrapVue provides one of the most comprehensive implementations of the Bootstrap v4 component and grid system available for Vue.js v2.6, complete with extens
186 lines (185 loc) • 6.37 kB
JSON
{
"name": "@bootstrap-vue/carousel",
"version": "1.0.0",
"meta": {
"title": "Carousel",
"description": "The <b-carousel> component is a slideshow for cycling through a series of content, built with CSS 3D transforms. It works with a series of images, text, or custom markup.",
"components": [
{
"component": "BCarousel",
"description": "The <b-carousel> component is a slideshow for cycling through a series of slide content",
"props": [
{
"prop": "background",
"description": "Set the CSS color of the carousel's background"
},
{
"prop": "controls",
"description": "Enable the previous and next controls"
},
{
"prop": "fade",
"description": "When set, changes the slide animation to a crossfade instead of a sliding effect"
},
{
"prop": "imgHeight",
"description": "Set the default image 'height' attribute for all b-tab children"
},
{
"prop": "imgWidth",
"description": "Set the default image 'width' attribute for all b-tab children"
},
{
"prop": "indicators",
"description": "Enable the indicator buttons for jumping to specific slides"
},
{
"prop": "interval",
"description": "Set the delay time (in milliseconds) between slides"
},
{
"prop": "labelGotoSlide",
"description": "Sets the prefix for the 'aria-label' on the slide indicator controls. Will be suffixed with the slide number (1 indexed)"
},
{
"prop": "labelIndicators",
"description": "Sets the 'aria-label' on the indicator controls wrapper"
},
{
"prop": "labelNext",
"description": "Sets the 'aria-label' value for the next slide control"
},
{
"prop": "labelPrev",
"description": "Sets the 'aria-label' value for the previous slide control"
},
{
"prop": "noAnimation",
"description": "When set, disables animation when transitioning between slides"
},
{
"prop": "noHoverPause",
"description": "When set, disables the pausing of the slide show when the current slide is hovered"
},
{
"prop": "noTouch",
"description": "Disable controlling the slides via touch swipes"
},
{
"prop": "noWrap",
"version": "2.0.0",
"description": "Do not restart the slide show when then end is reached"
},
{
"prop": "value",
"description": "The currently active slide (zero-indexed)"
}
],
"events": [
{
"event": "sliding-end",
"description": "Emitted when transitioning to a new slide has ended",
"args": [
{
"arg": "slide",
"type": "Number",
"description": "Slide number that was slid to"
}
]
},
{
"event": "sliding-start",
"description": "Emitted when transitioning to a new slide has started",
"args": [
{
"arg": "slide",
"type": "Number",
"description": "Slide number that is being slid to"
}
]
}
],
"slots": [
{
"name": "default",
"description": "Content (slides) to place in the carousel"
}
]
},
{
"component": "BCarouselSlide",
"description": "The <b-carousel-slide> component is a slide to be placed in the <b-carousel>",
"props": [
{
"prop": "background",
"description": "CSS color to use as the slide's background color"
},
{
"prop": "caption",
"description": "Text content to place in the caption"
},
{
"prop": "captionHtml",
"description": "HTML string content to place in the caption",
"xss": true
},
{
"prop": "captionTag",
"description": "Specify the HTML tag to render instead of the default tag for the caption wrapper"
},
{
"prop": "contentTag",
"description": "Specify the HTML tag to render instead of the default tag for the content wrapper"
},
{
"prop": "contentVisibleUp",
"description": "Specify the breakpoint that the textual content will start to be shown. Leave at default to always show the textual content"
},
{
"prop": "imgAlt",
"description": "Sets the value of the 'alt' attribute on the image"
},
{
"prop": "imgBlank",
"description": "If set, will render a blank image instead of the img-src"
},
{
"prop": "imgBlankColor",
"description": "Set the CSS color to use as the fill of the blank image"
},
{
"prop": "imgHeight",
"description": "Set the default image 'height' attribute for all b-tab children"
},
{
"prop": "imgSrc",
"description": "Sets the URL of the image"
},
{
"prop": "imgWidth",
"description": "Set the default image 'width' attribute for all b-tab children"
},
{
"prop": "text",
"description": "Text content to place in the text of the slide"
},
{
"prop": "textHtml",
"description": "HTML string content to place in the text of the slide",
"xss": true
}
],
"slots": [
{
"name": "default",
"description": "Content to place in the carousel slide"
},
{
"name": "img",
"description": "Slot for img element or image component"
}
]
}
]
}
}