{
  "apiVersion": 3,
  "title": "Modal",
  "name": "brandy/modal-block",
  "category": "brandy-blocks",
  "description": "A custom modal block with a button trigger and customizable content.",
  "keywords": [
    "modal",
    "popup",
    "button"
  ],
  "attributes": {
    "buttonText": {
      "type": "string",
      "default": "Click Here"
    },
    "buttonAlign": {
      "type": "string",
      "default": "left"
    },
    "backdropColor": {
      "type": "string",
      "default": "#00000080"
    },
    "enableCloseIcon": {
      "type": "boolean",
      "default": true
    },
    "closeOnBackdropClick": {
      "type": "boolean",
      "default": true
    },
    "closeOnEsc": {
      "type": "boolean",
      "default": true
    },
    "popupStyles": {
      "type": "object",
      "default": {
        "modalWidth": 600,
        "modalWidthUnit": "px",
        "modalMaxHeight": 90,
        "modalMaxHeightUnit": "vh",
        "padding": {
          "top": "20px",
          "right": "20px",
          "bottom": "20px",
          "left": "20px"
        },
        "borderWidth": "0px",
        "borderColor": "#000000",
        "borderStyle": "solid",
        "shadow": ""
      }
    },
    "closeStyles": {
      "type": "object",
      "default": {
        "closeIconSize": 24,
        "closeIconPosition": "top-right",
        "closeIconColor": "#ffffff"
      }
    },
    "triggerType": {
      "type": "string",
      "default": "click"
    },
    "timerDelay": {
      "type": "number",
      "default": 3000
    },
    "scrollDepth": {
      "type": "number",
      "default": 50
    },
    "modalPosition": {
      "type": "string",
      "default": "center"
    },
    "animationType": {
      "type": "string",
      "default": "fade"
    },
    "animationDuration": {
      "type": "number",
      "default": 300
    },
    "showOnce": {
      "type": "boolean",
      "default": false
    },
    "modalId": {
      "type": "string",
      "default": ""
    }
  },
  "supports": {
    "align": [
      "wide",
      "full"
    ],
    "html": false,
    "interactivity": true,
    "color": {
      "background": true,
      "text": true,
      "gradients": true
    },
    "spacing": {
      "padding": true,
      "margin": true
    },
    "typography": {
      "fontSize": true,
      "lineHeight": true
    },
    "__experimentalBorder": {
      "color": true,
      "radius": true,
      "style": true,
      "width": true,
      "__experimentalDefaultControls": {
        "color": true,
        "radius": true,
        "style": true,
        "width": true
      }
    },
    "shadow": {
      "__experimentalSkipSerialization": true
    }
  },
  "styles": [
    {
      "name": "fill",
      "label": "Fill",
      "isDefault": true
    },
    {
      "name": "outline",
      "label": "Outline"
    }
  ],
  "example": {
    "viewportWidth": 1400
  },
  "editorScript": "file:./index.js",
  "editorStyle": "file:./index.css",
  "style": "file:./style-index.css",
  "render": "file:./render.php",
  "viewScriptModule": "file:./view.js"
}