{ "$schema": "https://schemas.wp.org/trunk/block.json", "apiVersion": 3, "name": "b-blocks/image-hotspot", "version": "1.0.0", "title": "Image Hotspot", "category": "bBlocks", "description": "Image Hotspot allows you to add interactive hotspots to your images.", "keywords": [ "image hotspot", "hotspot", "image" ], "textdomain": "b-blocks", "attributes": { "align": { "type": "string", "default": "" }, "image": { "type": "object", "default": { "url": "", "desktop": { "height": "400px", "width": "100%" }, "tablet": { "height": "400px", "width": "100%" }, "mobile": { "height": "400px", "width": "100%" }, "objectFit": "fill" } }, "options": { "type": "object", "default": { "speed": 400, "delay": 200 } }, "preset": { "type": "string", "default": "default" }, "spots": { "type": "object", "default": { "normal": { "color": { "bg": "#8a2be2", "icon": "#fff" }, "border": {} }, "hover": { "color": { "bg": "#8a2be2", "icon": "#fff" }, "border": {} }, "desktop": { "height": "40px", "width": "40px", "padding": { "top": "", "right": "", "bottom": "", "left": "" }, "radius": { "left": "50px", "right": "50px", "top": "50px", "bottom": "50px" }, "iconSize": "12px" }, "tablet": { "height": "40px", "width": "40px", "padding": { "top": "", "right": "", "bottom": "", "left": "" }, "radius": { "left": "50px", "right": "50px", "top": "50px", "bottom": "50px" }, "iconSize": "12px" }, "mobile": { "height": "40px", "width": "40px", "padding": { "top": "", "right": "", "bottom": "", "left": "" }, "radius": { "left": "50px", "right": "50px", "top": "50px", "bottom": "50px" }, "iconSize": "12px" } } }, "tooltip": { "type": "object", "default": { "desktop": { "width": "200px", "padding": { "left": "5px", "right": "5px", "top": "5px", "bottom": "5px" }, "radius": { "left": "3px", "right": "3px", "top": "3px", "bottom": "3px" } }, "tablet": { "width": "", "padding": {}, "radius": {} }, "mobile": { "width": "", "padding": {}, "radius": {} }, "typo": { "fontSize": { "desktop": "15px" } }, "textColor": "#fff", "bgColor": "#8a2be2", "border": { "width": "0px" }, "shadow": [ { "hOffset": "0px", "vOffset": "0px", "blur": "0px", "spreed": "0px", "color": "#7090b0", "isInset": false } ] } }, "hotspot": { "type": "array", "default": [ { "borderColor": "", "bgColor": "", "spotsSize": "", "option": "spot", "spotOption": "text", "spotText": "+", "icon": { "url": { "upload": "", "library": "" }, "type": "library" }, "image": "", "tooltip": "

Tooltip contents

", "tooltipPosition": "left", "position": { "desktop": { "x": 0, "y": 0 }, "tablet": {}, "mobile": {} }, "iconColor": "", "iconSize": "12px", "spotLink": "", "newWindow": false }, { "borderColor": "", "bgColor": "", "spotsSize": "", "option": "spot", "spotOption": "text", "spotText": "+", "icon": { "url": { "upload": "", "library": "" }, "type": "library" }, "image": "", "tooltip": "

Tooltip contents

", "tooltipPosition": "left", "position": { "desktop": { "x": 30, "y": 40 }, "tablet": {}, "mobile": {} }, "iconColor": "", "iconSize": "12px", "spotLink": "", "newWindow": false } ] }, "advanced": { "type": "object", "default": { "dimension": { "padding": { "desktop": { "top": "0px", "right": "0px", "bottom": "0px", "left": "0px" }, "tablet": { "top": "0px", "right": "0px", "bottom": "0px", "left": "0px" }, "mobile": { "top": "0px", "right": "0px", "bottom": "0px", "left": "0px" } } }, "borderShadow": { "normal": { "radius": { "top": "0px", "right": "0px", "bottom": "0px", "left": "0px" }, "shadow": [ { "hOffset": "0px", "vOffset": "0px", "blur": "0px", "spreed": "0px", "color": "#7090b000", "isInset": false } ] } }, "background": { "normal": { "type": "color", "color": "rgba(255, 255, 255, 1)", "gradient": { "type": "radial", "radialType": "ellipse", "colors": [ { "color": "rgba(58, 66, 222, 1)", "position": "0" }, { "color": "rgba(176, 195, 235, 1)", "position": "80" } ], "centerPositions": { "x": 50, "y": 50 }, "angel": 90 }, "img": { "url": "", "desktop": { "position": "center-center", "xPosition": 0, "yPosition": 0, "attachment": "", "repeat": "no-repeat", "size": "", "customSize": "0px" }, "tablet": { "position": "center-center", "xPosition": 0, "yPosition": 0, "attachment": "", "repeat": "no-repeat", "size": "", "customSize": "0px" }, "mobile": { "position": "center-center", "xPosition": 0, "yPosition": 0, "attachment": "", "repeat": "no-repeat", "size": "", "customSize": "0px" } }, "transition": 0.3 } }, "transform": { "normal": { "rotate": { "desktop": { "z": "", "y": "", "x": "" }, "tablet": { "z": "", "y": "", "x": "" }, "mobile": { "z": "", "y": "", "x": "" }, "threeDRotate": false }, "offset": { "desktop": { "x": "", "y": "" }, "tablet": { "x": "", "y": "" }, "mobile": { "x": "", "y": "" } }, "scale": { "isProportion": true, "desktop": { "x": "", "y": "", "scale": "" }, "tablet": { "x": "", "y": "", "scale": "" }, "mobile": { "x": "", "y": "", "scale": "" } }, "skew": { "desktop": { "x": "", "y": "" }, "tablet": { "x": "", "y": "" }, "mobile": { "x": "", "y": "" } }, "flipX": false, "flipY": false }, "hover": { "rotate": { "desktop": { "z": "", "y": "", "x": "" }, "tablet": { "z": "", "y": "", "x": "" }, "mobile": { "z": "", "y": "", "x": "" }, "threeDRotate": false }, "offset": { "desktop": { "x": "", "y": "" }, "tablet": { "x": "", "y": "" }, "mobile": { "x": "", "y": "" } }, "scale": { "isProportion": true, "desktop": { "x": "", "y": "", "scale": "" }, "tablet": { "x": "", "y": "", "scale": "" }, "mobile": { "x": "", "y": "", "scale": "" } }, "skew": { "desktop": { "x": "", "y": "" }, "tablet": { "x": "", "y": "" }, "mobile": { "x": "", "y": "" } }, "flipX": false, "flipY": false }, "transition": 200 } } } }, "supports": { "align": [ "wide", "full" ], "html": false }, "example": { "attributes": {} }, "editorScript": [ "file:../index.js", "aos" ], "style": "file:./view.css", "render": "file:./render.php", "viewScript": "file:./view.js" }