custom-elements.json

{
  "schemaVersion": "1.0.0",
  "readme": "",
  "modules": [
    {
      "kind": "javascript-module",
      "path": "glomex-dialog.js",
      "declarations": [
        {
          "kind": "class",
          "description": "A dialog web component that allows docking a video player or\nputting it in a lightbox. It allows implementing a similar\nfeature as amp-video-docking but without using AMP.",
          "name": "GlomexDialogElement",
          "members": [
            {
              "kind": "method",
              "name": "refreshDockDialog",
              "description": "Forces repositioning docked dialog element.\nShould be called when an external \"dock-target\" changed\nits size or position."
            }
          ],
          "events": [
            {
              "name": "dockscale",
              "type": {
                "text": "CustomEvent"
              }
            },
            {
              "name": "modechange",
              "type": {
                "text": "CustomEvent"
              }
            }
          ],
          "attributes": [
            {
              "name": "mode",
              "type": {
                "text": "string"
              },
              "description": "Can take the values \"hidden\", \"inline\", \"dock\" or \"lightbox\"."
            },
            {
              "name": "aspect-ratio",
              "type": {
                "text": "string"
              },
              "description": "The aspect-ratio for the inline element. Default is 16:9"
            },
            {
              "name": "dock-target",
              "type": {
                "text": "string"
              },
              "description": "A dom-element with position:fixed where mode=dock should animate to"
            },
            {
              "name": "dock-target-inset",
              "type": {
                "text": "string"
              },
              "description": "Defines the position of the dock using inset"
            },
            {
              "name": "dock-aspect-ratio",
              "type": {
                "text": "string"
              },
              "description": "The aspect-ratio when the element is mode=dock"
            },
            {
              "name": "dock-mode",
              "type": {
                "text": "string"
              },
              "description": "When set to \"sticky\" it behaves similar to \"position: sticky\" in CSS (with a max width of 400px). If undefined docks the content to a corner."
            },
            {
              "name": "dock-sticky-target-top",
              "type": {
                "text": "string"
              },
              "description": "The top distance for dock-mode=sticky in pixels (defaults to 0)"
            },
            {
              "name": "dock-sticky-aspect-ratio",
              "type": {
                "text": "string"
              },
              "description": "The aspect-ratio when the element is docked for dock-mode=sticky"
            },
            {
              "name": "dock-downscale",
              "type": {
                "text": "string"
              },
              "description": "Do you want to scale the element when mode=dock"
            }
          ],
          "superclass": {
            "module": "glomex-dialog.js"
          },
          "tagName": "glomex-dialog",
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "glomex-dialog",
          "declaration": {
            "name": "GlomexDialogElement",
            "module": "glomex-dialog.js"
          }
        }
      ]
    }
  ]
}