import { Component, Event, h, Host, Listen, Prop } from '@stencil/core';
export class DvnSideModal {
  constructor() {
    this.shown = true;
  }
  handleKeyDown(ev) {
    // close modal on escape key
    if (ev.key === 'Escape') {
      this.dismiss.emit();
    }
  }
  render() {
    return (h(Host, { class: { hidden: !this.shown } },
      h("div", { class: "background-layer", onClick: () => this.dismiss.emit() }),
      h("div", { class: "content" },
        h("slot", null))));
  }
  static get is() { return "dvn-side-modal"; }
  static get encapsulation() { return "scoped"; }
  static get originalStyleUrls() { return {
    "$": ["dvn-side-modal.css"]
  }; }
  static get styleUrls() { return {
    "$": ["dvn-side-modal.css"]
  }; }
  static get properties() { return {
    "shown": {
      "type": "boolean",
      "mutable": false,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "shown",
      "reflect": false,
      "defaultValue": "true"
    }
  }; }
  static get events() { return [{
      "method": "dismiss",
      "name": "dismiss",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [],
        "text": ""
      },
      "complexType": {
        "original": "any",
        "resolved": "any",
        "references": {}
      }
    }]; }
  static get listeners() { return [{
      "name": "document:keydown",
      "method": "handleKeyDown",
      "target": undefined,
      "capture": false,
      "passive": false
    }]; }
}
