@eightshift/frontend-libs
Version:
A collection of useful frontend utility modules. powered by Eightshift
92 lines (91 loc) • 2.31 kB
JSON
{
"$schema": "https://raw.githubusercontent.com/infinum/eightshift-frontend-libs/develop/schemas/block.json",
"blockName": "carousel",
"blockJsClass": "js-carousel",
"title": "Carousel",
"description" : "Carousel block with custom settings.",
"category": "eightshift",
"icon": {
"src": "es-carousel"
},
"keywords": [
"carousel"
],
"example": {
"attributes": {
"carouselAllowedBlocks": [
"eightshift-boilerplate/carousel-item"
],
"carouselIsLoop": true,
"carouselShowItems": 1
},
"innerBlocks": [
{
"name": "eightshift-boilerplate/carousel-item",
"attributes": {
"wrapperNoControls": true,
"carouselItemImageUrl": "https://loremflickr.com/400/400"
}
},
{
"name": "eightshift-boilerplate/carousel-item",
"attributes": {
"wrapperNoControls": true,
"carouselItemImageUrl": "https://loremflickr.com/400/400"
}
},
{
"name": "eightshift-boilerplate/carousel-item",
"attributes": {
"wrapperNoControls": true,
"carouselItemImageUrl": "https://loremflickr.com/400/400"
}
}
]
},
"hasInnerBlocks": true,
"attributes": {
"carouselAllowedBlocks": {
"type": "array",
"items": {
"type": "string"
},
"default": [
"eightshift-boilerplate/carousel-item"
]
},
"carouselIsLoop": {
"type": "boolean",
"default": false
},
"carouselShowPrevNext": {
"type": "boolean",
"default": false
},
"carouselShowPagination": {
"type": "boolean",
"default": false
},
"carouselShowItems": {
"type": "number",
"default": 4
}
},
"options": {
"carouselItemsToShow": {
"min": 1,
"max": 4,
"step": 1
}
},
"resources": {
"prevIcon": "<svg width='44' height='44' viewBox='0 0 44 44' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='m10 22 9.23-9M10 22l9.23 9M10 22h24' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>",
"nextIcon": "<svg width='44' height='44' viewBox='0 0 44 44' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='m34 22-8.859-9M34 22l-8.859 9M34 22H10' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>"
},
"nodeDependency": [
"swiper@11"
],
"innerBlocksDependency": [
"image"
]
}