@watermarkinsights/ripple 3.25.0-2 → 3.25.0

package/dist/collection/components/wm-menuitem/wm-menuitem.js.map

@@ -1 +1 @@
-{"version":3,"file":"wm-menuitem.js","sourceRoot":"","sources":["../../../../src/components/wm-menuitem/wm-menuitem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h, Component, Element, Event, EventEmitter, Listen, Prop, State, Host, Watch } from \"@stencil/core\";\r\nimport { getIconCodeFromName } from \"../../global/interfaces\";\r\n\r\n@Component({\r\n  tag: \"wm-menuitem\",\r\n  styleUrl: \"wm-menuitem.scss\",\r\n  shadow: true,\r\n})\r\nexport class Menuitem {\r\n  @Element() el!: HTMLWmMenuitemElement;\r\n  private iconEl?: HTMLSpanElement;\r\n\r\n  @Prop() disabled = false;\r\n  @Prop() focused = false;\r\n  @Prop({ mutable: true }) icon?: string = undefined;\r\n  @Prop() description?: string = undefined;\r\n\r\n  @Event() wmMenuitemClicked!: EventEmitter<HTMLWmMenuitemElement>;\r\n  @Event() wmKeyUpPressed!: EventEmitter<HTMLWmMenuitemElement>;\r\n  @Event() wmKeyDownPressed!: EventEmitter<HTMLWmMenuitemElement>;\r\n  @Event() wmEscKeyPressed!: EventEmitter<HTMLWmMenuitemElement>;\r\n  @Event() wmHomeKeyPressed!: EventEmitter<HTMLWmMenuitemElement>;\r\n  @Event() wmEndKeyPressed!: EventEmitter<HTMLWmMenuitemElement>;\r\n  @Event() wmPageDownItems!: EventEmitter<HTMLWmMenuitemElement>;\r\n  @Event() wmPageUpItems!: EventEmitter<HTMLWmMenuitemElement>;\r\n  @Event() wmTabKeyPressed!: EventEmitter<HTMLWmMenuitemElement>;\r\n  @Event() wmLetterPressed!: EventEmitter;\r\n  @Event() wmMenuitemBlurred!: EventEmitter<{ relatedTarget: EventTarget | null }>;\r\n  private onClickFunc!: (this: GlobalEventHandlers, ev: MouseEvent) => any;\r\n  private descriptionCharLimit = 100;\r\n\r\n  @State() isKeying: boolean = false;\r\n\r\n  @Listen(\"wmUserIsKeying\", { target: \"window\" })\r\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\r\n  toggleKeyingOn() {\r\n    this.isKeying = true;\r\n  }\r\n\r\n  @Listen(\"wmUserIsNotKeying\", { target: \"window\" })\r\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\r\n  toggleKeyingOff() {\r\n    this.isKeying = false;\r\n  }\r\n\r\n  @Listen(\"keydown\")\r\n  handleKeydown(ev: KeyboardEvent) {\r\n    const modifierKeyUsed = ev.altKey || ev.ctrlKey || ev.metaKey;\r\n    const isSingleCharacter = /^.$/.test(ev.key);\r\n    const isCharacterEntry = isSingleCharacter && !modifierKeyUsed;\r\n    switch (ev.key) {\r\n      case \"ArrowUp\":\r\n        ev.preventDefault();\r\n        this.wmKeyUpPressed.emit(this.el as HTMLWmMenuitemElement);\r\n        break;\r\n      case \"ArrowDown\":\r\n        ev.preventDefault();\r\n        this.wmKeyDownPressed.emit(this.el as HTMLWmMenuitemElement);\r\n        break;\r\n      case \"Enter\":\r\n        ev.preventDefault();\r\n        if (!this.disabled) {\r\n          this.el.click();\r\n        }\r\n        break;\r\n      case \"Escape\":\r\n        ev.preventDefault();\r\n        ev.stopPropagation(); // prevents closing of parent modal\r\n        this.wmEscKeyPressed.emit();\r\n        break;\r\n      case \"Home\":\r\n        ev.preventDefault();\r\n        this.wmHomeKeyPressed.emit();\r\n        break;\r\n      case \"End\":\r\n        ev.preventDefault();\r\n        this.wmEndKeyPressed.emit();\r\n        break;\r\n      case \"Tab\":\r\n        this.wmTabKeyPressed.emit();\r\n        break;\r\n      default:\r\n        if (isCharacterEntry) {\r\n          ev.preventDefault();\r\n          this.wmLetterPressed.emit(ev.key);\r\n        }\r\n    }\r\n  }\r\n\r\n  @Listen(\"click\")\r\n  handleClick() {\r\n    if (!this.disabled) {\r\n      this.wmMenuitemClicked.emit();\r\n    }\r\n  }\r\n\r\n  @Listen(\"blur\")\r\n  handleBlur(ev: FocusEvent) {\r\n    this.wmMenuitemBlurred.emit({ relatedTarget: ev.relatedTarget });\r\n  }\r\n\r\n  @Watch(\"disabled\")\r\n  setOnClick() {\r\n    if (this.disabled && this.el.onclick) {\r\n      this.onClickFunc = this.el.onclick;\r\n      this.el.onclick = null;\r\n    } else if (!this.disabled && this.onClickFunc) {\r\n      this.el.onclick = this.onClickFunc;\r\n    }\r\n  }\r\n\r\n  componentWillLoad() {\r\n    if (this.icon) {\r\n      // in case a name was passed instead of a code, convert it to code (for backwards compatibility)\r\n      this.icon = getIconCodeFromName(this.icon);\r\n    }\r\n\r\n    if (this.description) {\r\n      if (this.description.length > this.descriptionCharLimit) {\r\n        console.error(`wm-menuitem description is above the character limit of ${this.descriptionCharLimit}`);\r\n      }\r\n      if (this.icon) {\r\n        console.error(\"wm-menuitems with descriptions do not support the use of icons\");\r\n      }\r\n    }\r\n\r\n    this.setOnClick();\r\n  }\r\n\r\n  componentDidLoad() {\r\n    if (this.icon) {\r\n      this.iconEl!.classList.add(\"mdi\");\r\n      this.iconEl!.innerHTML = `&#x${this.icon};`;\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host tabindex={-1} role=\"menuitem\" aria-disabled={this.disabled ? \"true\" : null}>\r\n        <div\r\n          class={`wrapper ${this.focused && this.isKeying ? \"focus\" : \"\"}`}\r\n          aria-disabled={this.disabled ? \"true\" : null}\r\n        >\r\n          <span ref={(el) => (this.iconEl = el)} />\r\n          <slot />\r\n          {this.description ? <div class=\"description\">{this.description}</div> : \"\"}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"wm-menuitem.js","sourceRoot":"","sources":["../../../../src/components/wm-menuitem/wm-menuitem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h, Component, Element, Event, EventEmitter, Listen, Prop, State, Host, Watch } from \"@stencil/core\";\nimport { getIconCodeFromName } from \"../../global/interfaces\";\n\n@Component({\n  tag: \"wm-menuitem\",\n  styleUrl: \"wm-menuitem.scss\",\n  shadow: true,\n})\nexport class Menuitem {\n  @Element() el!: HTMLWmMenuitemElement;\n  private iconEl?: HTMLSpanElement;\n\n  @Prop() disabled = false;\n  @Prop() focused = false;\n  @Prop({ mutable: true }) icon?: string = undefined;\n  @Prop() description?: string = undefined;\n\n  @Event() wmMenuitemClicked!: EventEmitter<HTMLWmMenuitemElement>;\n  @Event() wmKeyUpPressed!: EventEmitter<HTMLWmMenuitemElement>;\n  @Event() wmKeyDownPressed!: EventEmitter<HTMLWmMenuitemElement>;\n  @Event() wmEscKeyPressed!: EventEmitter<HTMLWmMenuitemElement>;\n  @Event() wmHomeKeyPressed!: EventEmitter<HTMLWmMenuitemElement>;\n  @Event() wmEndKeyPressed!: EventEmitter<HTMLWmMenuitemElement>;\n  @Event() wmPageDownItems!: EventEmitter<HTMLWmMenuitemElement>;\n  @Event() wmPageUpItems!: EventEmitter<HTMLWmMenuitemElement>;\n  @Event() wmTabKeyPressed!: EventEmitter<HTMLWmMenuitemElement>;\n  @Event() wmLetterPressed!: EventEmitter;\n  @Event() wmMenuitemBlurred!: EventEmitter<{ relatedTarget: EventTarget | null }>;\n  private onClickFunc!: (this: GlobalEventHandlers, ev: MouseEvent) => any;\n  private descriptionCharLimit = 100;\n\n  @State() isKeying: boolean = false;\n\n  @Listen(\"wmUserIsKeying\", { target: \"window\" })\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleKeyingOn() {\n    this.isKeying = true;\n  }\n\n  @Listen(\"wmUserIsNotKeying\", { target: \"window\" })\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleKeyingOff() {\n    this.isKeying = false;\n  }\n\n  @Listen(\"keydown\")\n  handleKeydown(ev: KeyboardEvent) {\n    const modifierKeyUsed = ev.altKey || ev.ctrlKey || ev.metaKey;\n    const isSingleCharacter = /^.$/.test(ev.key);\n    const isCharacterEntry = isSingleCharacter && !modifierKeyUsed;\n    switch (ev.key) {\n      case \"ArrowUp\":\n        ev.preventDefault();\n        this.wmKeyUpPressed.emit(this.el as HTMLWmMenuitemElement);\n        break;\n      case \"ArrowDown\":\n        ev.preventDefault();\n        this.wmKeyDownPressed.emit(this.el as HTMLWmMenuitemElement);\n        break;\n      case \"Enter\":\n        ev.preventDefault();\n        if (!this.disabled) {\n          this.el.click();\n        }\n        break;\n      case \"Escape\":\n        ev.preventDefault();\n        ev.stopPropagation(); // prevents closing of parent modal\n        this.wmEscKeyPressed.emit();\n        break;\n      case \"Home\":\n        ev.preventDefault();\n        this.wmHomeKeyPressed.emit();\n        break;\n      case \"End\":\n        ev.preventDefault();\n        this.wmEndKeyPressed.emit();\n        break;\n      case \"Tab\":\n        this.wmTabKeyPressed.emit();\n        break;\n      default:\n        if (isCharacterEntry) {\n          ev.preventDefault();\n          this.wmLetterPressed.emit(ev.key);\n        }\n    }\n  }\n\n  @Listen(\"click\")\n  handleClick() {\n    if (!this.disabled) {\n      this.wmMenuitemClicked.emit();\n    }\n  }\n\n  @Listen(\"blur\")\n  handleBlur(ev: FocusEvent) {\n    this.wmMenuitemBlurred.emit({ relatedTarget: ev.relatedTarget });\n  }\n\n  @Watch(\"disabled\")\n  setOnClick() {\n    if (this.disabled && this.el.onclick) {\n      this.onClickFunc = this.el.onclick;\n      this.el.onclick = null;\n    } else if (!this.disabled && this.onClickFunc) {\n      this.el.onclick = this.onClickFunc;\n    }\n  }\n\n  componentWillLoad() {\n    if (this.icon) {\n      // in case a name was passed instead of a code, convert it to code (for backwards compatibility)\n      this.icon = getIconCodeFromName(this.icon);\n    }\n\n    if (this.description) {\n      if (this.description.length > this.descriptionCharLimit) {\n        console.error(`wm-menuitem description is above the character limit of ${this.descriptionCharLimit}`);\n      }\n      if (this.icon) {\n        console.error(\"wm-menuitems with descriptions do not support the use of icons\");\n      }\n    }\n\n    this.setOnClick();\n  }\n\n  componentDidLoad() {\n    if (this.icon) {\n      this.iconEl!.classList.add(\"mdi\");\n      this.iconEl!.innerHTML = `&#x${this.icon};`;\n    }\n  }\n\n  render() {\n    return (\n      <Host tabindex={-1} role=\"menuitem\" aria-disabled={this.disabled ? \"true\" : null}>\n        <div\n          class={`wrapper ${this.focused && this.isKeying ? \"focus\" : \"\"}`}\n          aria-disabled={this.disabled ? \"true\" : null}\n        >\n          <span ref={(el) => (this.iconEl = el)} />\n          <slot />\n          {this.description ? <div class=\"description\">{this.description}</div> : \"\"}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/wm-modal/wm-modal-footer.js

@@ -1,139 +1,139 @@
-import { h } from "@stencil/core";
-export class ModalFooter {
-  constructor() {
-    this.secondaryText = "";
-    this.primaryText = "";
-    this.infoText = "";
-    this.primaryActionDisabled = false;
-    this.deleteStyle = false;
-  }
-  componentWillLoad() {
-    this.uid = this.el.parentElement.uid;
-    // Trap focus when user shift+tabs past first element in modal
-    // NB @Listen doesn't allow to listen on a specific element (the parent modal)
-    // if we listen to the whole doc each modal on the page reacts to every event
-    this.el.parentElement.addEventListener("focusLastElement", () => {
-      this.lastElement.focus();
-    });
-  }
-  emitParentPrimaryEvent() {
-    const parentModal = this.el.parentElement;
-    //@ts-ignore
-    parentModal.emitPrimaryEvent();
-  }
-  emitParentSecondaryEvent() {
-    const parentModal = this.el.parentElement;
-    //@ts-ignore
-    parentModal.emitSecondaryEvent();
-  }
-  render() {
-    return (h("div", { class: `wm-wrapper ${this.infoText ? " footer-text" : ""}` }, h("div", { class: "wm-info", "aria-live": "polite" }, this.infoText), h("div", { class: "wm-button-collection" }, this.secondaryText && (h("wm-button", { onClick: () => this.emitParentSecondaryEvent(), id: `wm-secondary-${this.uid}`, ref: (el) => (this.primaryActionDisabled ? (this.lastElement = el) : null) }, this.secondaryText)), h("wm-button", { "button-type": this.deleteStyle ? "secondary" : "primary", "permanently-delete": this.deleteStyle, onClick: () => this.emitParentPrimaryEvent(), disabled: this.primaryActionDisabled, id: `wm-primary-${this.uid}`, ref: (el) => (!this.primaryActionDisabled ? (this.lastElement = el) : null) }, this.primaryText))));
-  }
-  static get is() { return "wm-modal-footer"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["wm-modal-footer.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["wm-modal-footer.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "secondaryText": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string | undefined",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "secondary-text",
-        "reflect": false,
-        "defaultValue": "\"\""
-      },
-      "primaryText": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string | undefined",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "primary-text",
-        "reflect": false,
-        "defaultValue": "\"\""
-      },
-      "infoText": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string | undefined",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "info-text",
-        "reflect": false,
-        "defaultValue": "\"\""
-      },
-      "primaryActionDisabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "primary-action-disabled",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "deleteStyle": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "delete-style",
-        "reflect": false,
-        "defaultValue": "false"
-      }
-    };
-  }
-  static get elementRef() { return "el"; }
-}
-//# sourceMappingURL=wm-modal-footer.js.map
+import { h } from "@stencil/core";
+export class ModalFooter {
+  constructor() {
+    this.secondaryText = "";
+    this.primaryText = "";
+    this.infoText = "";
+    this.primaryActionDisabled = false;
+    this.deleteStyle = false;
+  }
+  componentWillLoad() {
+    this.uid = this.el.parentElement.uid;
+    // Trap focus when user shift+tabs past first element in modal
+    // NB @Listen doesn't allow to listen on a specific element (the parent modal)
+    // if we listen to the whole doc each modal on the page reacts to every event
+    this.el.parentElement.addEventListener("focusLastElement", () => {
+      this.lastElement.focus();
+    });
+  }
+  emitParentPrimaryEvent() {
+    const parentModal = this.el.parentElement;
+    //@ts-ignore
+    parentModal.emitPrimaryEvent();
+  }
+  emitParentSecondaryEvent() {
+    const parentModal = this.el.parentElement;
+    //@ts-ignore
+    parentModal.emitSecondaryEvent();
+  }
+  render() {
+    return (h("div", { class: `wm-wrapper ${this.infoText ? " footer-text" : ""}` }, h("div", { class: "wm-info", "aria-live": "polite" }, this.infoText), h("div", { class: "wm-button-collection" }, this.secondaryText && (h("wm-button", { onClick: () => this.emitParentSecondaryEvent(), id: `wm-secondary-${this.uid}`, ref: (el) => (this.primaryActionDisabled ? (this.lastElement = el) : null) }, this.secondaryText)), h("wm-button", { "button-type": this.deleteStyle ? "secondary" : "primary", "permanently-delete": this.deleteStyle, onClick: () => this.emitParentPrimaryEvent(), disabled: this.primaryActionDisabled, id: `wm-primary-${this.uid}`, ref: (el) => (!this.primaryActionDisabled ? (this.lastElement = el) : null) }, this.primaryText))));
+  }
+  static get is() { return "wm-modal-footer"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["wm-modal-footer.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["wm-modal-footer.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "secondaryText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "secondary-text",
+        "reflect": false,
+        "defaultValue": "\"\""
+      },
+      "primaryText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "primary-text",
+        "reflect": false,
+        "defaultValue": "\"\""
+      },
+      "infoText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "info-text",
+        "reflect": false,
+        "defaultValue": "\"\""
+      },
+      "primaryActionDisabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "primary-action-disabled",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "deleteStyle": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "delete-style",
+        "reflect": false,
+        "defaultValue": "false"
+      }
+    };
+  }
+  static get elementRef() { return "el"; }
+}
+//# sourceMappingURL=wm-modal-footer.js.map

package/dist/collection/components/wm-modal/wm-modal-footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"wm-modal-footer.js","sourceRoot":"","sources":["../../../../src/components/wm-modal/wm-modal-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAM5D,MAAM,OAAO,WAAW;;yBAGW,EAAE;uBACJ,EAAE;oBACL,EAAE;iCACW,KAAK;uBACf,KAAK;;EAIpC,iBAAiB;IACf,IAAI,CAAC,GAAG,GAAI,IAAI,CAAC,EAAE,CAAC,aAAoC,CAAC,GAAG,CAAC;IAE7D,8DAA8D;IAC9D,8EAA8E;IAC9E,6EAA6E;IAC7E,IAAI,CAAC,EAAE,CAAC,aAAc,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,GAAG,EAAE;MAC/D,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,CAAC;IAC3B,CAAC,CAAC,CAAC;EACL,CAAC;EAED,sBAAsB;IACpB,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;IAC1C,YAAY;IACZ,WAAW,CAAC,gBAAgB,EAAE,CAAC;EACjC,CAAC;EAED,wBAAwB;IACtB,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;IAC1C,YAAY;IACZ,WAAW,CAAC,kBAAkB,EAAE,CAAC;EACnC,CAAC;EAED,MAAM;IACJ,OAAO,CACL,WAAK,KAAK,EAAE,cAAc,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE;MAC7D,WAAK,KAAK,EAAC,SAAS,eAAW,QAAQ,IAAE,IAAI,CAAC,QAAQ,CAAO;MAC7D,WAAK,KAAK,EAAC,sBAAsB;QAC9B,IAAI,CAAC,aAAa,IAAI,CACrB,iBACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAC9C,EAAE,EAAE,gBAAgB,IAAI,CAAC,GAAG,EAAE,EAC9B,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAiB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAExF,IAAI,CAAC,aAAa,CACT,CACb;QACD,gCACe,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,wBACnC,IAAI,CAAC,WAAW,EACpC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,sBAAsB,EAAE,EAC5C,QAAQ,EAAE,IAAI,CAAC,qBAAqB,EACpC,EAAE,EAAE,cAAc,IAAI,CAAC,GAAG,EAAE,EAC5B,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAiB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAEzF,IAAI,CAAC,WAAW,CACP,CACR,CACF,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { h, Component, Element, Prop } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"wm-modal-footer\",\r\n  styleUrl: \"wm-modal-footer.scss\",\r\n})\r\nexport class ModalFooter {\r\n  @Element() el!: HTMLElement;\r\n\r\n  @Prop() secondaryText?: string = \"\";\r\n  @Prop() primaryText?: string = \"\";\r\n  @Prop() infoText?: string = \"\";\r\n  @Prop() primaryActionDisabled: boolean = false;\r\n  @Prop() deleteStyle: boolean = false;\r\n  private uid!: string;\r\n  private lastElement!: HTMLElement;\r\n\r\n  componentWillLoad() {\r\n    this.uid = (this.el.parentElement as HTMLWmModalElement).uid;\r\n\r\n    // Trap focus when user shift+tabs past first element in modal\r\n    // NB @Listen doesn't allow to listen on a specific element (the parent modal)\r\n    // if we listen to the whole doc each modal on the page reacts to every event\r\n    this.el.parentElement!.addEventListener(\"focusLastElement\", () => {\r\n      this.lastElement.focus();\r\n    });\r\n  }\r\n\r\n  emitParentPrimaryEvent() {\r\n    const parentModal = this.el.parentElement;\r\n    //@ts-ignore\r\n    parentModal.emitPrimaryEvent();\r\n  }\r\n\r\n  emitParentSecondaryEvent() {\r\n    const parentModal = this.el.parentElement;\r\n    //@ts-ignore\r\n    parentModal.emitSecondaryEvent();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class={`wm-wrapper ${this.infoText ? \" footer-text\" : \"\"}`}>\r\n        <div class=\"wm-info\" aria-live=\"polite\">{this.infoText}</div>\r\n        <div class=\"wm-button-collection\">\r\n          {this.secondaryText && (\r\n            <wm-button\r\n              onClick={() => this.emitParentSecondaryEvent()}\r\n              id={`wm-secondary-${this.uid}`}\r\n              ref={(el) => (this.primaryActionDisabled ? (this.lastElement = el as HTMLElement) : null)}\r\n            >\r\n              {this.secondaryText}\r\n            </wm-button>\r\n          )}\r\n          <wm-button\r\n            button-type={this.deleteStyle ? \"secondary\" : \"primary\"}\r\n            permanently-delete={this.deleteStyle}\r\n            onClick={() => this.emitParentPrimaryEvent()}\r\n            disabled={this.primaryActionDisabled}\r\n            id={`wm-primary-${this.uid}`}\r\n            ref={(el) => (!this.primaryActionDisabled ? (this.lastElement = el as HTMLElement) : null)}\r\n          >\r\n            {this.primaryText}\r\n          </wm-button>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"wm-modal-footer.js","sourceRoot":"","sources":["../../../../src/components/wm-modal/wm-modal-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAM5D,MAAM,OAAO,WAAW;;yBAGW,EAAE;uBACJ,EAAE;oBACL,EAAE;iCACW,KAAK;uBACf,KAAK;;EAIpC,iBAAiB;IACf,IAAI,CAAC,GAAG,GAAI,IAAI,CAAC,EAAE,CAAC,aAAoC,CAAC,GAAG,CAAC;IAE7D,8DAA8D;IAC9D,8EAA8E;IAC9E,6EAA6E;IAC7E,IAAI,CAAC,EAAE,CAAC,aAAc,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,GAAG,EAAE;MAC/D,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,CAAC;IAC3B,CAAC,CAAC,CAAC;EACL,CAAC;EAED,sBAAsB;IACpB,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;IAC1C,YAAY;IACZ,WAAW,CAAC,gBAAgB,EAAE,CAAC;EACjC,CAAC;EAED,wBAAwB;IACtB,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;IAC1C,YAAY;IACZ,WAAW,CAAC,kBAAkB,EAAE,CAAC;EACnC,CAAC;EAED,MAAM;IACJ,OAAO,CACL,WAAK,KAAK,EAAE,cAAc,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE;MAC7D,WAAK,KAAK,EAAC,SAAS,eAAW,QAAQ,IAAE,IAAI,CAAC,QAAQ,CAAO;MAC7D,WAAK,KAAK,EAAC,sBAAsB;QAC9B,IAAI,CAAC,aAAa,IAAI,CACrB,iBACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAC9C,EAAE,EAAE,gBAAgB,IAAI,CAAC,GAAG,EAAE,EAC9B,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAiB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAExF,IAAI,CAAC,aAAa,CACT,CACb;QACD,gCACe,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,wBACnC,IAAI,CAAC,WAAW,EACpC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,sBAAsB,EAAE,EAC5C,QAAQ,EAAE,IAAI,CAAC,qBAAqB,EACpC,EAAE,EAAE,cAAc,IAAI,CAAC,GAAG,EAAE,EAC5B,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAiB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAEzF,IAAI,CAAC,WAAW,CACP,CACR,CACF,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { h, Component, Element, Prop } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-modal-footer\",\n  styleUrl: \"wm-modal-footer.scss\",\n})\nexport class ModalFooter {\n  @Element() el!: HTMLElement;\n\n  @Prop() secondaryText?: string = \"\";\n  @Prop() primaryText?: string = \"\";\n  @Prop() infoText?: string = \"\";\n  @Prop() primaryActionDisabled: boolean = false;\n  @Prop() deleteStyle: boolean = false;\n  private uid!: string;\n  private lastElement!: HTMLElement;\n\n  componentWillLoad() {\n    this.uid = (this.el.parentElement as HTMLWmModalElement).uid;\n\n    // Trap focus when user shift+tabs past first element in modal\n    // NB @Listen doesn't allow to listen on a specific element (the parent modal)\n    // if we listen to the whole doc each modal on the page reacts to every event\n    this.el.parentElement!.addEventListener(\"focusLastElement\", () => {\n      this.lastElement.focus();\n    });\n  }\n\n  emitParentPrimaryEvent() {\n    const parentModal = this.el.parentElement;\n    //@ts-ignore\n    parentModal.emitPrimaryEvent();\n  }\n\n  emitParentSecondaryEvent() {\n    const parentModal = this.el.parentElement;\n    //@ts-ignore\n    parentModal.emitSecondaryEvent();\n  }\n\n  render() {\n    return (\n      <div class={`wm-wrapper ${this.infoText ? \" footer-text\" : \"\"}`}>\n        <div class=\"wm-info\" aria-live=\"polite\">{this.infoText}</div>\n        <div class=\"wm-button-collection\">\n          {this.secondaryText && (\n            <wm-button\n              onClick={() => this.emitParentSecondaryEvent()}\n              id={`wm-secondary-${this.uid}`}\n              ref={(el) => (this.primaryActionDisabled ? (this.lastElement = el as HTMLElement) : null)}\n            >\n              {this.secondaryText}\n            </wm-button>\n          )}\n          <wm-button\n            button-type={this.deleteStyle ? \"secondary\" : \"primary\"}\n            permanently-delete={this.deleteStyle}\n            onClick={() => this.emitParentPrimaryEvent()}\n            disabled={this.primaryActionDisabled}\n            id={`wm-primary-${this.uid}`}\n            ref={(el) => (!this.primaryActionDisabled ? (this.lastElement = el as HTMLElement) : null)}\n          >\n            {this.primaryText}\n          </wm-button>\n        </div>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/wm-modal/wm-modal-header.js

@@ -1,83 +1,83 @@
-import { h, Host } from "@stencil/core";
-import { closeVerb } from "../../global/intl";
-export class ModalHeader {
-  constructor() {
-    this.heading = "";
-    this.subheading = "";
-  }
-  componentWillLoad() {
-    this.uid = this.el.parentElement.uid;
-    // Trap focus when user tabs past last element in modal
-    // NB @Listen doesn't allow to listen on a specific element (the parent modal)
-    // if we listen to the whole doc each modal on the page reacts to every event
-    this.el.parentElement.addEventListener("focusFirstElement", () => {
-      this.closeButtonEl.focus();
-    });
-  }
-  emitParentCloseEvent() {
-    const parentModal = this.el.parentElement;
-    //@ts-ignore
-    parentModal.emitCloseEvent();
-  }
-  // @Listen("click")
-  // directFocusOnClick() {
-  //   this.headingElement.tabIndex = 0;
-  //   this.headingElement.focus();
-  // }
-  render() {
-    return (h(Host, null, h("div", { class: "wm-wrapper" }, h("div", null, h("h2", { class: "title", id: `wm-modal-heading-text-${this.uid}` }, this.heading, h("span", { class: "subtitle" }, this.subheading))), h("wm-button", { "button-type": "navigational", icon: "f156", tooltip: closeVerb, "tooltip-position": "left", id: `wm-modal-close-${this.uid}`, ref: (el) => (this.closeButtonEl = el), onClick: () => this.emitParentCloseEvent() }))));
-  }
-  static get is() { return "wm-modal-header"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["wm-modal-header.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["wm-modal-header.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "heading": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string | undefined",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "heading",
-        "reflect": false,
-        "defaultValue": "\"\""
-      },
-      "subheading": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string | undefined",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "subheading",
-        "reflect": false,
-        "defaultValue": "\"\""
-      }
-    };
-  }
-  static get elementRef() { return "el"; }
-}
-//# sourceMappingURL=wm-modal-header.js.map
+import { h, Host } from "@stencil/core";
+import { globalMessages } from "../../global/intl";
+export class ModalHeader {
+  constructor() {
+    this.heading = "";
+    this.subheading = "";
+  }
+  componentWillLoad() {
+    this.uid = this.el.parentElement.uid;
+    // Trap focus when user tabs past last element in modal
+    // NB @Listen doesn't allow to listen on a specific element (the parent modal)
+    // if we listen to the whole doc each modal on the page reacts to every event
+    this.el.parentElement.addEventListener("focusFirstElement", () => {
+      this.closeButtonEl.focus();
+    });
+  }
+  emitParentCloseEvent() {
+    const parentModal = this.el.parentElement;
+    //@ts-ignore
+    parentModal.emitCloseEvent();
+  }
+  // @Listen("click")
+  // directFocusOnClick() {
+  //   this.headingElement.tabIndex = 0;
+  //   this.headingElement.focus();
+  // }
+  render() {
+    return (h(Host, null, h("div", { class: "wm-wrapper" }, h("div", null, h("h2", { class: "title", id: `wm-modal-heading-text-${this.uid}` }, this.heading, h("span", { class: "subtitle" }, this.subheading))), h("wm-button", { "button-type": "navigational", icon: "f156", tooltip: globalMessages.close, "tooltip-position": "left", id: `wm-modal-close-${this.uid}`, ref: (el) => (this.closeButtonEl = el), onClick: () => this.emitParentCloseEvent() }))));
+  }
+  static get is() { return "wm-modal-header"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["wm-modal-header.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["wm-modal-header.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "heading": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "heading",
+        "reflect": false,
+        "defaultValue": "\"\""
+      },
+      "subheading": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "subheading",
+        "reflect": false,
+        "defaultValue": "\"\""
+      }
+    };
+  }
+  static get elementRef() { return "el"; }
+}
+//# sourceMappingURL=wm-modal-header.js.map

package/dist/collection/components/wm-modal/wm-modal-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"wm-modal-header.js","sourceRoot":"","sources":["../../../../src/components/wm-modal/wm-modal-header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAM9C,MAAM,OAAO,WAAW;;mBAIK,EAAE;sBACC,EAAE;;EAGhC,iBAAiB;IACf,IAAI,CAAC,GAAG,GAAI,IAAI,CAAC,EAAE,CAAC,aAAoC,CAAC,GAAG,CAAC;IAE7D,uDAAuD;IACvD,8EAA8E;IAC9E,6EAA6E;IAC7E,IAAI,CAAC,EAAE,CAAC,aAAc,CAAC,gBAAgB,CAAC,mBAAmB,EAAE,GAAG,EAAE;MAChE,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;IAC7B,CAAC,CAAC,CAAC;EACL,CAAC;EAED,oBAAoB;IAClB,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;IAC1C,YAAY;IACZ,WAAW,CAAC,cAAc,EAAE,CAAC;EAC/B,CAAC;EAED,mBAAmB;EACnB,yBAAyB;EACzB,sCAAsC;EACtC,iCAAiC;EACjC,IAAI;EAEJ,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,WAAK,KAAK,EAAC,YAAY;QACrB;UACE,UACE,KAAK,EAAC,OAAO,EACb,EAAE,EAAE,yBAAyB,IAAI,CAAC,GAAG,EAAE;YAItC,IAAI,CAAC,OAAO;YACb,YAAM,KAAK,EAAC,UAAU,IAAE,IAAI,CAAC,UAAU,CAAQ,CAC5C,CACD;QACN,gCACc,cAAc,EAC1B,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,SAAS,sBACD,MAAM,EACvB,EAAE,EAAE,kBAAkB,IAAI,CAAC,GAAG,EAAE,EAChC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,EAAiB,CAAC,EACrD,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,oBAAoB,EAAE,GAC1C,CACE,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { h, Component, Element, Prop, Host } from \"@stencil/core\";\r\nimport { closeVerb } from \"../../global/intl\";\r\n\r\n@Component({\r\n  tag: \"wm-modal-header\",\r\n  styleUrl: \"wm-modal-header.scss\",\r\n})\r\nexport class ModalHeader {\r\n  @Element() el!: HTMLElement;\r\n  private closeButtonEl!: HTMLElement;\r\n\r\n  @Prop() heading?: string = \"\";\r\n  @Prop() subheading?: string = \"\";\r\n  private uid!: string;\r\n\r\n  componentWillLoad() {\r\n    this.uid = (this.el.parentElement as HTMLWmModalElement).uid;\r\n\r\n    // Trap focus when user tabs past last element in modal\r\n    // NB @Listen doesn't allow to listen on a specific element (the parent modal)\r\n    // if we listen to the whole doc each modal on the page reacts to every event\r\n    this.el.parentElement!.addEventListener(\"focusFirstElement\", () => {\r\n      this.closeButtonEl.focus();\r\n    });\r\n  }\r\n\r\n  emitParentCloseEvent() {\r\n    const parentModal = this.el.parentElement;\r\n    //@ts-ignore\r\n    parentModal.emitCloseEvent();\r\n  }\r\n\r\n  // @Listen(\"click\")\r\n  // directFocusOnClick() {\r\n  //   this.headingElement.tabIndex = 0;\r\n  //   this.headingElement.focus();\r\n  // }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <div class=\"wm-wrapper\">\r\n          <div>\r\n            <h2\r\n              class=\"title\"\r\n              id={`wm-modal-heading-text-${this.uid}`}\r\n              // ref={el => (this.headingElement = el as HTMLElement)}\r\n              // onBlur={() => (this.headingElement.tabIndex = -1)}\r\n            >\r\n              {this.heading}\r\n              <span class=\"subtitle\">{this.subheading}</span>\r\n            </h2>\r\n          </div>\r\n          <wm-button\r\n            button-type=\"navigational\"\r\n            icon=\"f156\"\r\n            tooltip={closeVerb}\r\n            tooltip-position=\"left\"\r\n            id={`wm-modal-close-${this.uid}`}\r\n            ref={(el) => (this.closeButtonEl = el as HTMLElement)}\r\n            onClick={() => this.emitParentCloseEvent()}\r\n          />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"wm-modal-header.js","sourceRoot":"","sources":["../../../../src/components/wm-modal/wm-modal-header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAMnD,MAAM,OAAO,WAAW;;mBAIK,EAAE;sBACC,EAAE;;EAGhC,iBAAiB;IACf,IAAI,CAAC,GAAG,GAAI,IAAI,CAAC,EAAE,CAAC,aAAoC,CAAC,GAAG,CAAC;IAE7D,uDAAuD;IACvD,8EAA8E;IAC9E,6EAA6E;IAC7E,IAAI,CAAC,EAAE,CAAC,aAAc,CAAC,gBAAgB,CAAC,mBAAmB,EAAE,GAAG,EAAE;MAChE,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;IAC7B,CAAC,CAAC,CAAC;EACL,CAAC;EAED,oBAAoB;IAClB,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;IAC1C,YAAY;IACZ,WAAW,CAAC,cAAc,EAAE,CAAC;EAC/B,CAAC;EAED,mBAAmB;EACnB,yBAAyB;EACzB,sCAAsC;EACtC,iCAAiC;EACjC,IAAI;EAEJ,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,WAAK,KAAK,EAAC,YAAY;QACrB;UACE,UACE,KAAK,EAAC,OAAO,EACb,EAAE,EAAE,yBAAyB,IAAI,CAAC,GAAG,EAAE;YAItC,IAAI,CAAC,OAAO;YACb,YAAM,KAAK,EAAC,UAAU,IAAE,IAAI,CAAC,UAAU,CAAQ,CAC5C,CACD;QACN,gCACc,cAAc,EAC1B,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,cAAc,CAAC,KAAK,sBACZ,MAAM,EACvB,EAAE,EAAE,kBAAkB,IAAI,CAAC,GAAG,EAAE,EAChC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,EAAiB,CAAC,EACrD,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,oBAAoB,EAAE,GAC1C,CACE,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { h, Component, Element, Prop, Host } from \"@stencil/core\";\nimport { globalMessages } from \"../../global/intl\";\n\n@Component({\n  tag: \"wm-modal-header\",\n  styleUrl: \"wm-modal-header.scss\",\n})\nexport class ModalHeader {\n  @Element() el!: HTMLElement;\n  private closeButtonEl!: HTMLElement;\n\n  @Prop() heading?: string = \"\";\n  @Prop() subheading?: string = \"\";\n  private uid!: string;\n\n  componentWillLoad() {\n    this.uid = (this.el.parentElement as HTMLWmModalElement).uid;\n\n    // Trap focus when user tabs past last element in modal\n    // NB @Listen doesn't allow to listen on a specific element (the parent modal)\n    // if we listen to the whole doc each modal on the page reacts to every event\n    this.el.parentElement!.addEventListener(\"focusFirstElement\", () => {\n      this.closeButtonEl.focus();\n    });\n  }\n\n  emitParentCloseEvent() {\n    const parentModal = this.el.parentElement;\n    //@ts-ignore\n    parentModal.emitCloseEvent();\n  }\n\n  // @Listen(\"click\")\n  // directFocusOnClick() {\n  //   this.headingElement.tabIndex = 0;\n  //   this.headingElement.focus();\n  // }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"wm-wrapper\">\n          <div>\n            <h2\n              class=\"title\"\n              id={`wm-modal-heading-text-${this.uid}`}\n              // ref={el => (this.headingElement = el as HTMLElement)}\n              // onBlur={() => (this.headingElement.tabIndex = -1)}\n            >\n              {this.heading}\n              <span class=\"subtitle\">{this.subheading}</span>\n            </h2>\n          </div>\n          <wm-button\n            button-type=\"navigational\"\n            icon=\"f156\"\n            tooltip={globalMessages.close}\n            tooltip-position=\"left\"\n            id={`wm-modal-close-${this.uid}`}\n            ref={(el) => (this.closeButtonEl = el as HTMLElement)}\n            onClick={() => this.emitParentCloseEvent()}\n          />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}