q2-tecton-elements 1.18.0 → 1.19.0

package/dist/collection/components/q2-loc/index.js

@@ -1,49 +1,59 @@
-import { Component, Prop, h } from '@stencil/core';
+import { h } from '@stencil/core';
 import { loc } from 'src/utils';
 export class Q2Loc {
+  constructor() {
+    this.value = undefined;
+    this.substitutions = undefined;
+  }
   render() {
     return h("span", null, loc(this.value, this.substitutions));
   }
   static get is() { return "q2-loc"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "value": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "value",
-      "reflect": true
-    },
-    "substitutions": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "string[]",
-        "resolved": "string[]",
-        "references": {}
+  static get originalStyleUrls() {
+    return {
+      "$": ["styles.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "value": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "value",
+        "reflect": true
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+      "substitutions": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "string[]",
+          "resolved": "string[]",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        }
       }
-    }
-  }; }
+    };
+  }
 }

package/dist/collection/components/q2-loc/styles.css

@@ -8,7 +8,7 @@
 
 *:focus {
   outline: none;
-  box-shadow: var(--const-global-focus, 0 0 0 2px #33b4ff);
+  box-shadow: var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C);
 }
 
 :host {

package/dist/collection/components/q2-message/index.js

@@ -1,10 +1,11 @@
-import { Component, Prop, h, Method, State, Element, Listen } from '@stencil/core';
+import { h } from '@stencil/core';
 import { isEventFromElement, isFirefox as checkIfFirefox, nextPaint, overrideFocus } from 'src/utils';
 export class Q2Message {
   constructor() {
     this.type = 'info';
     this.appearance = 'standard';
     this.description = false;
+    this.presentToggle = undefined;
   }
   get isFirefox() {
     return checkIfFirefox();
@@ -31,105 +32,113 @@ export class Q2Message {
     const addAriaHiddenForAriaLive = isFirefox && this.presentToggle;
     const addDivForAriaLive = !isFirefox && this.presentToggle;
     const { description } = this;
-    return (h("div", { tabindex: "-1", class: "message", role: description ? undefined : 'alert', "aria-live": description ? undefined : 'assertive', "aria-atomic": description ? undefined : 'true', "aria-relevant": description ? undefined : 'all' },
-      this.appearance === 'standard' ? generateIcon(this.type) : '',
-      addDivForAriaLive && h("div", { class: "sr" }),
-      h("div", { class: "message-content", "aria-hidden": addAriaHiddenForAriaLive ? 'true' : undefined },
-        h("slot", null))));
+    return (h("div", { tabindex: "-1", class: "message", role: description ? undefined : 'alert', "aria-live": description ? undefined : 'assertive', "aria-atomic": description ? undefined : 'true', "aria-relevant": description ? undefined : 'all' }, this.appearance === 'standard' ? generateIcon(this.type) : '', addDivForAriaLive && h("div", { class: "sr" }), h("div", { class: "message-content", "aria-hidden": addAriaHiddenForAriaLive ? 'true' : undefined }, h("slot", null))));
   }
   static get is() { return "q2-message"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "type": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'info' | 'error' | 'danger' | 'warning' | 'success'",
-        "resolved": "\"danger\" | \"error\" | \"info\" | \"success\" | \"warning\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "type",
-      "reflect": true,
-      "defaultValue": "'info'"
-    },
-    "appearance": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'minimal' | 'standard'",
-        "resolved": "\"minimal\" | \"standard\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "appearance",
-      "reflect": true,
-      "defaultValue": "'standard'"
-    },
-    "description": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+  static get originalStyleUrls() {
+    return {
+      "$": ["styles.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "type": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'info' | 'error' | 'danger' | 'warning' | 'success'",
+          "resolved": "\"danger\" | \"error\" | \"info\" | \"success\" | \"warning\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "type",
+        "reflect": true,
+        "defaultValue": "'info'"
       },
-      "attribute": "description",
-      "reflect": true,
-      "defaultValue": "false"
-    }
-  }; }
-  static get states() { return {
-    "presentToggle": {}
-  }; }
-  static get methods() { return {
-    "present": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "appearance": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'minimal' | 'standard'",
+          "resolved": "\"minimal\" | \"standard\"",
+          "references": {}
         },
-        "return": "Promise<void>"
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "appearance",
+        "reflect": true,
+        "defaultValue": "'standard'"
       },
-      "docs": {
-        "text": "",
-        "tags": []
+      "description": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "description",
+        "reflect": true,
+        "defaultValue": "false"
       }
-    }
-  }; }
+    };
+  }
+  static get states() {
+    return {
+      "presentToggle": {}
+    };
+  }
+  static get methods() {
+    return {
+      "present": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
+      }
+    };
+  }
   static get elementRef() { return "hostElement"; }
-  static get listeners() { return [{
-      "name": "focus",
-      "method": "delegateFocus",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }]; }
+  static get listeners() {
+    return [{
+        "name": "focus",
+        "method": "delegateFocus",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }];
+  }
 }
 function generateIcon(type) {
   const iconMap = {

package/dist/collection/components/q2-message/styles.css

@@ -8,7 +8,7 @@
 
 *:focus {
   outline: none;
-  box-shadow: var(--const-global-focus, 0 0 0 2px #33b4ff);
+  box-shadow: var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C);
 }
 
 :host {

package/dist/collection/components/q2-optgroup/index.js

@@ -1,13 +1,14 @@
-import { Component, h, Prop, Element, Watch, State } from '@stencil/core';
+import { h } from '@stencil/core';
 import { createGuid, loc } from 'src/utils';
 export class Q2Optgroup {
   constructor() {
-    this.disabled = false;
-    this.hidden = false;
     this.guid = createGuid();
     this.setHidden = () => {
       this.hidden = this.options.every(opt => opt.hidden || opt._multiSelectHidden);
     };
+    this.disabled = false;
+    this.label = undefined;
+    this.hidden = false;
   }
   /// LIFECYCLE HOOKS ///
   componentWillLoad() {
@@ -35,62 +36,69 @@ export class Q2Optgroup {
     });
   }
   render() {
-    return (h("div", { class: "q2-optgroup-container", hidden: this.hidden, "aria-labelledby": this.headerId, role: "group" },
-      h("div", { class: "q2-optgroup-header", id: this.headerId }, (this.label && loc(this.label)) || ''),
-      h("div", { class: "q2-optgroup-options" },
-        h("slot", null))));
+    return (h("div", { class: "q2-optgroup-container", hidden: this.hidden, "aria-labelledby": this.headerId, role: "group" }, h("div", { class: "q2-optgroup-header", id: this.headerId }, (this.label && loc(this.label)) || ''), h("div", { class: "q2-optgroup-options" }, h("slot", null))));
   }
   static get is() { return "q2-optgroup"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "disabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "disabled",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "label": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+  static get originalStyleUrls() {
+    return {
+      "$": ["styles.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "disabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "disabled",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "attribute": "label",
-      "reflect": true
-    }
-  }; }
-  static get states() { return {
-    "hidden": {}
-  }; }
+      "label": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "label",
+        "reflect": true
+      }
+    };
+  }
+  static get states() {
+    return {
+      "hidden": {}
+    };
+  }
   static get elementRef() { return "hostElement"; }
-  static get watchers() { return [{
-      "propName": "disabled",
-      "methodName": "disabledWatcher"
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "disabled",
+        "methodName": "disabledWatcher"
+      }];
+  }
 }

package/dist/collection/components/q2-optgroup/styles.css

@@ -8,7 +8,7 @@
 
 *:focus {
   outline: none;
-  box-shadow: var(--const-global-focus, 0 0 0 2px #33b4ff);
+  box-shadow: var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C);
 }
 
 :host {