q2-tecton-elements 1.37.1 → 1.38.1

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

@@ -8,7 +8,7 @@
 
 *:focus {
   outline: none;
-  box-shadow: var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C);
+  box-shadow: var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc);
 }
 
 :host {
@@ -85,14 +85,13 @@ button {
 }
 .field-container.is-small .btn-clear {
   --tct-btn-icon-width: 20px;
+  --tct-icon-size: 17px;
 }
 
 label {
   --comp-label-padding: var(--tct-input-label-padding, 0 var(--tct-input-label-padding-right, var(--t-input-label-padding-right, 0)) 0 var(--tct-input-label-padding-left, var(--t-input-label-padding-left, 0)));
-  --comp-label-margin: var(--tct-input-label-margin, var(--tct-input-label-margin-top, var(--t-input-label-margin-top, 0)) 0 var(--tct-input-label-margin-bottom, var(--t-input-label-margin-bottom, var(--tct-scale-1, var(--app-scale-1x, 5px)))));
   display: block;
   padding: var(--comp-label-padding);
-  margin: var(--comp-label-margin);
   color: var(--tct-input-label-font-color, var(--t-input-label-font-color, inherit));
   font-size: var(--tct-input-label-font-size, var(--t-input-label-font-size, inherit));
   font-weight: var(--tct-input-label-font-weight, var(--t-input-label-font-weight, 600));
@@ -105,10 +104,28 @@ label {
   --comp-label-optional-margin: var(--tct-input-label-optional-margin, 0 0 0 var(--tct-input-label-optional-margin-left, var(--t-input-label-optional-margin-left, var(--tct-scale-1, var(--app-scale-1x, 5px)))));
   margin: var(--comp-label-optional-margin);
   color: var(--tct-input-label-optional-font-color, var(--t-input-label-optional-font-color, var(--t-textA, var(--t-a11y-gray-color, rgba(77, 77, 77, 0.77)))));
-  font-size: var(--tct-input-label-optional-font-size, var(--t-input-label-optional-font-size, 12px));
+  font-size: var(--tct-input-label-optional-font-size, var(--t-input-label-optional-font-size, var(--app-font-size-small, 12px)));
   font-weight: var(--tct-input-label-optional-font-weight, var(--t-input-label-optional-font-weight, 400));
 }
 
+.count-tag {
+  color: var(--tct-input-count-font-color, var(--t-textA, var(--t-a11y-gray-color, rgba(77, 77, 77, 0.77))));
+  font-size: var(--tct-input-count-font-size, var(--app-font-size-small, 12px));
+  font-weight: var(--tct-input-count-font-weight, 400);
+  text-align: right;
+  width: var(--tct-input-count-width, auto);
+}
+
+.label-wrapper {
+  --comp-label-margin: var(--tct-input-label-margin, var(--tct-input-label-margin-top, var(--t-input-label-margin-top, 0)) 0 var(--tct-input-label-margin-bottom, var(--t-input-label-margin-bottom, var(--tct-scale-1, var(--app-scale-1x, 5px)))));
+  display: flex;
+  gap: var(--tct-input-label-gap, var(--app-scale-2x, 10px));
+  justify-content: space-between;
+  align-items: end;
+  margin: var(--comp-label-margin);
+  line-height: var(--tct-input-label-line-height, var(--t-input-label-line-height, inherit));
+}
+
 .input-container {
   --comp-input-background: var(--tct-input-background, var(--tct-input-bg, var(--t-input-bg, var(--t-gray-14, #fcfcfd))));
   --comp-input-horizontal-gap: var(--tct-input-horizontal-gap, var(--t-input-horizontal-gap, 0));
@@ -129,10 +146,12 @@ label {
   --comp-input-min-height: var(--tct-input-min-height, var(--t-input-min-height, 44px));
   --comp-input-max-height: var(--tct-input-max-height, var(--t-input-max-height));
   --comp-input-hover-ring-color: var(--tct-input-hover-ring-color, var(--t-input-hover-ring-color));
-  --comp-input-hover-ring: 0 0 0 2px var(--t-base), 0 0 0 4px var(--comp-input-hover-ring-color);
+  --comp-input-hover-ring: 0 0 0 2px var(--t-base), 0 0 0 4px var(--comp-input-hover-ring-color), var(--tct-input-hover-box-shadow, var(--t-input-hover-box-shadow, 0 0 transparent));
   background: var(--comp-input-background);
   display: flex;
   align-items: center;
+  gap: var(--tct-input-container-gap, var(--app-scale-2x, 10px));
+  padding-inline: var(--tct-input-container-padding-inline);
   border-width: var(--comp-input-border-width);
   border-style: solid;
   border-color: var(--comp-input-border-color);
@@ -144,9 +163,33 @@ label {
   cursor: not-allowed;
   opacity: var(--tct-input-disabled-opacity, var(--t-input-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4))));
 }
+.has-error .input-container {
+  border-color: var(--tct-input-error-border-color, var(--const-stoplight-alert, #c30000));
+  background: var(--tct-input-error-background, var(--comp-input-background));
+  box-shadow: var(--tct-input-error-box-shadow, var(--comp-input-hover-ring));
+}
+.input-container:hover {
+  border-color: var(--tct-input-hover-border-color, var(--comp-input-border-color));
+  background: var(--tct-input-hover-background, var(--comp-input-background));
+  box-shadow: var(--tct-input-hover-box-shadow, var(--comp-input-hover-ring));
+}
+.has-error .input-container:hover {
+  border-color: var(--tct-input-error-hover-border-color, var(--tct-input-error-border-color, var(--const-stoplight-alert, #c30000)));
+  background: var(--tct-input-error-hover-background, var(--tct-input-error-background, var(--comp-input-background)));
+  box-shadow: var(--tct-input-error-hover-box-shadow, var(--tct-input-error-box-shadow, var(--comp-input-hover-ring)));
+}
+.has-focus .input-container {
+  border-color: var(--tct-input-focus-border-color, var(--t-input-focus-border-color, var(--comp-input-border-color)));
+  background: var(--tct-input-focus-background, var(--comp-input-background));
+  box-shadow: var(--tct-input-focus-box-shadow, var(--const-double-focus-ring));
+}
+.has-focus.has-error .input-container, .has-focus.has-error .input-container:hover {
+  border-color: var(--tct-input-error-focus-border-color, var(--tct-input-error-border-color, var(--const-stoplight-alert, #c30000)));
+  background: var(--tct-input-error-focus-background, var(--tct-input-error-background, var(--comp-input-background)));
+  box-shadow: var(--tct-input-error-focus-box-shadow, var(--tct-input-error-box-shadow, var(--const-double-focus-ring)));
+}
 
 .input-field {
-  --comp-input-padding: var(--tct-input-padding, 0 var(--tct-input-horizontal-padding, var(--t-input-horizontal-padding, var(--tct-scale-2, var(--app-scale-2x, 10px)))));
   flex: 1;
   border: 0;
   -webkit-appearance: none;
@@ -157,7 +200,7 @@ label {
   overflow-y: hidden;
   height: var(--tct-input-height, var(--t-input-height, 44px));
   width: 100%;
-  padding: var(--comp-input-padding);
+  padding: var(--tct-input-padding, 0);
   background: transparent;
   color: var(--tct-input-font-color, var(--t-input-font-color, var(--t-text, inherit)));
   display: inline-block;
@@ -216,31 +259,6 @@ label {
   width: 100%;
 }
 
-.has-error .input-container:hover {
-  --comp-input-hover-ring-color: var(--tct-input-error-border-color, var(--t-input-error-border-color));
-  --comp-input-hover-ring: 0 0 0 2px var(--t-base), 0 0 0 4px var(--comp-input-hover-ring-color);
-}
-
-.input-container:hover {
-  border-width: var(--tct-input-hover-border-width, var(--comp-input-border-width));
-  border-color: var(--tct-input-hover-border-color, var(--comp-input-border-color));
-  background: var(--tct-input-hover-background, var(--comp-input-background));
-  box-shadow: var(--comp-input-hover-ring), var(--tct-input-hover-box-shadow, var(--t-input-hover-box-shadow, 0 0 transparent));
-}
-
-.has-focus .input-container {
-  border-width: var(--tct-input-focus-border-width, var(--comp-input-focus-border-width));
-  border-color: var(--tct-input-focus-border-color, var(--t-input-focus-border-color, var(--comp-input-border-color)));
-  background: var(--tct-input-focus-background, var(--comp-input-background));
-  box-shadow: var(--const-double-focus-ring), var(--tct-input-focus-box-shadow, var(--t-input-focus-box-shadow, 0 0 transparent));
-}
-.has-focus .input-container:hover {
-  border-width: var(--tct-input-hover-border-width, var(--comp-input-border-width));
-  border-color: var(--tct-input-hover-border-color, var(--comp-input-border-color));
-  background: var(--tct-input-hover-background, var(--comp-input-background));
-  box-shadow: var(--comp-input-hover-ring), var(--tct-input-hover-box-shadow, var(--t-input-hover-box-shadow, 0 0 transparent));
-}
-
 .input-field::placeholder,
 .placeholder-text {
   color: var(--tct-input-placeholder-font-color, var(--t-input-placeholder-font-color, var(--t-textA, var(--app-gray-d1, rgba(77, 77, 77, 0.77)))));
@@ -253,6 +271,8 @@ label {
 
 .input-icons-container-left,
 .input-icons-container-right {
+  --tct-btn-icon-hover-background: var(--tct-input-btn-hover-background);
+  --tct-btn-hover-background: var(--tct-input-btn-hover-background);
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -260,14 +280,15 @@ label {
 }
 .input-icons-container-left > div:not(.vertical-separator),
 .input-icons-container-right > div:not(.vertical-separator) {
-  min-width: var(--tct-icon-min-width, 44px);
+  min-width: var(--tct-input-icon-container-icon-min-width, 44px);
   display: flex;
   justify-content: center;
   align-items: center;
+  font-size: var(--tct-input-icon-container-font-size, inherit);
 }
 .input-icons-container-left:empty,
 .input-icons-container-right:empty {
-  display: none;
+  display: var(--tct-input-icon-container-empty-display, block);
 }
 
 .input-icons-container-left {
@@ -279,9 +300,11 @@ label {
   --comp-visibility-toggle-padding: 0px var(--app-scale-2x, 10px);
 }
 .input-icons-container-right .btn-visibility-toggle {
-  color: var(--tct-input-visibility-toggle-font-color, var(--tct-primary, var(--t-primary, #006eb2)));
-  font-size: var(--tct-input-visibility-toggle-font-size, 12px);
-  padding: var(--tct-input-visibility-toggle-padding, var(--comp-visibility-toggle-padding));
+  --tct-btn-height: var(--comp-input-min-height);
+  --tct-btn-padding-inline: var(--tct-input-visibility-toggle-padding, var(--app-scale-2x, 10px));
+  --tct-btn-font-weight: var(--tct-input-visibility-toggle-font-weight, 400);
+  color: var(--tct-input-visibility-toggle-font-color, var(--t-primary, #006eb2));
+  font-size: var(--tct-input-visibility-toggle-font-size, var(--app-font-size-small, 12px));
 }
 
 q2-icon {
@@ -331,15 +354,6 @@ q2-icon {
   --tct-icon-stroke-primary: var(--tct-stoplight-error, var(--const-stoplight-alert, #c30000));
 }
 
-.pw-show {
-  position: absolute;
-  margin-right: var(--tct-scale-2, var(--app-scale-2x, 10px));
-}
-
-.btn-clear {
-  --tct-icon-size: 17px;
-}
-
 .messages-container {
   height: 0px;
   overflow: hidden;
@@ -351,6 +365,7 @@ q2-icon {
   position: absolute;
   width: 100%;
   color: var(--tct-input-messages-font-color, var(--t-input-messages-font-color, inherit));
+  border-radius: var(--tct-message-border-radius, inherit);
 }
 
 .has-error label {
@@ -363,10 +378,6 @@ q2-icon {
   background: var(--tct-input-error-prefix-background, var(--tct-input-error-prefix-bg, var(--t-input-error-prefix-bg, var(--tct-input-background, var(--tct-input-bg, var(--t-input-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, #f2f2f2))))))))));
 }
 
-.has-error .input-container:not(:focus-within) {
-  border-color: var(--tct-input-error-border-color, var(--t-input-error-border-color, var(--const-stoplight-alert, #c30000)));
-}
-
 .icon-left {
   width: 26px;
   height: 26px;
@@ -374,5 +385,7 @@ q2-icon {
 
 .vertical-separator {
   height: calc(var(--comp-input-min-height) - 2px);
-  border-right: 1px solid var(--tct-input-prefix-border-color, var(--t-input-prefix-border-color, var(--tct-input-border-color, var(--t-input-border-color, var(--t-a11y-gray-color-AA, #404040)))));
+  border-right-width: var(--tct-input-prefix-border-width, 1px);
+  border-right-style: solid;
+  border-right-color: var(--tct-input-prefix-border-color, var(--t-input-prefix-border-color, var(--tct-input-border-color, var(--t-input-border-color, var(--t-a11y-gray-color-AA, #404040)))));
 }

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

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

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

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

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

@@ -13,6 +13,9 @@ export class Q2Message {
   componentDidLoad() {
     overrideFocus(this.hostElement);
   }
+  /**
+   * Prompts assistive technology to announce the message.
+   */
   async present() {
     const { isFirefox } = this;
     this.presentToggle = !this.presentToggle;
@@ -135,7 +138,7 @@ export class Q2Message {
           "return": "Promise<void>"
         },
         "docs": {
-          "text": "",
+          "text": "Prompts assistive technology to announce the message.",
           "tags": []
         }
       }

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-message/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACnF,OAAO,EAAE,kBAAkB,EAAE,SAAS,IAAI,cAAc,EAAE,GAAG,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAO3G,MAAM,OAAO,SAAS;;gBACmE,MAAM;sBAC7B,UAAU;uBACxB,KAAK;;;EAMrD,IAAI,SAAS;IACT,OAAO,cAAc,EAAE,CAAC;EAC5B,CAAC;EAED,gBAAgB;IACZ,aAAa,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;EACpC,CAAC;EAGD,KAAK,CAAC,OAAO;IACT,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC3B,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC;IACzC,IAAI,CAAC,SAAS;MAAE,OAAO;IACvB,SAAS,CAAC,GAAG,EAAE;MACX,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;IAC/B,CAAC,CAAC,CAAC;EACP,CAAC;EAGD,aAAa,CAAC,KAAiB;IAC3B,IAAI,CAAC,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC;MAAE,OAAO;IACzD,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,aAAa,CAAc,UAAU,CAAC,CAAC,KAAK,EAAE,CAAC;EAC/E,CAAC;EAED,MAAM;IACF,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC3B,MAAM,wBAAwB,GAAG,SAAS,IAAI,IAAI,CAAC,aAAa,CAAC;IACjE,MAAM,iBAAiB,GAAG,CAAC,SAAS,IAAI,IAAI,CAAC,aAAa,CAAC;IAC3D,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC;IAC7B,MAAM,YAAY,GAAW,GAAG,CAAC,+BAA+B,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC;IAElG,OAAO,CACH,WACI,QAAQ,EAAC,IAAI,EACb,KAAK,EAAC,SAAS,EACf,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,eAC5B,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,iBACnC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,mBAC9B,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,aACtC,kBAAkB;MAEzB,IAAI,CAAC,UAAU,KAAK,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE;MACjE,iBAAiB,IAAI,WAAK,KAAK,EAAC,IAAI,GAAO;MAC5C,WAAK,KAAK,EAAC,kBAAkB,IAAE,YAAY,CAAO;MAClD,WACI,KAAK,EAAC,iBAAiB,iBACV,wBAAwB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;QAE1D,eAAQ,CACN,CACJ,CACT,CAAC;EACN,CAAC;EAED,WAAW,CAAC,IAAY;IACpB,MAAM,OAAO,GAAG;MACZ,OAAO,EAAE,SAAS;MAClB,OAAO,EAAE,SAAS;MAClB,MAAM,EAAE,OAAO;MACf,KAAK,EAAE,OAAO;MACd,IAAI,EAAE,MAAM;KACf,CAAC;IAEF,MAAM,QAAQ,GAAW,OAAO,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,IAAI,CAAC;IAEvD,OAAO,CACH,eACI,IAAI,EAAE,QAAQ,EACd,KAAK,EAAC,cAAc,GACtB,CACL,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, h, Method, State, Element, Listen } from '@stencil/core';\nimport { isEventFromElement, isFirefox as checkIfFirefox, loc, nextPaint, overrideFocus } from 'src/utils';\n\n@Component({\n    tag: 'q2-message',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2Message {\n    @Prop({ reflect: true }) type: 'info' | 'error' | 'danger' | 'warning' | 'success' = 'info';\n    @Prop({ reflect: true }) appearance: 'minimal' | 'standard' = 'standard';\n    @Prop({ reflect: true }) description: boolean = false;\n\n    @Element() hostElement: HTMLElement;\n\n    @State() presentToggle: boolean;\n\n    get isFirefox() {\n        return checkIfFirefox();\n    }\n\n    componentDidLoad(): void {\n        overrideFocus(this.hostElement);\n    }\n\n    @Method()\n    async present() {\n        const { isFirefox } = this;\n        this.presentToggle = !this.presentToggle;\n        if (!isFirefox) return;\n        nextPaint(() => {\n            this.presentToggle = false;\n        });\n    }\n\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.hostElement.shadowRoot.querySelector<HTMLElement>('.message').focus();\n    }\n\n    render() {\n        const { isFirefox } = this;\n        const addAriaHiddenForAriaLive = isFirefox && this.presentToggle;\n        const addDivForAriaLive = !isFirefox && this.presentToggle;\n        const { description } = this;\n        const messageLabel: string = loc(`tecton.element.message.type.${this.type ? this.type : 'info'}`);\n\n        return (\n            <div\n                tabindex=\"-1\"\n                class=\"message\"\n                role={description ? undefined : 'alert'}\n                aria-live={description ? undefined : 'assertive'}\n                aria-atomic={description ? undefined : 'true'}\n                aria-relevant={description ? undefined : 'all'}\n                test-id=\"messageContainer\"\n            >\n                {this.appearance === 'standard' ? this.messageIcon(this.type) : ''}\n                {addDivForAriaLive && <div class=\"sr\"></div>}\n                <div class=\"sr message-label\">{messageLabel}</div>\n                <div\n                    class=\"message-content\"\n                    aria-hidden={addAriaHiddenForAriaLive ? 'true' : undefined}\n                >\n                    <slot />\n                </div>\n            </div>\n        );\n    }\n\n    messageIcon(type: string) {\n        const iconMap = {\n            success: 'success',\n            warning: 'warning',\n            danger: 'error',\n            error: 'error',\n            info: 'info',\n        };\n\n        const iconType: string = iconMap[type] || iconMap.info;\n\n        return (\n            <q2-icon\n                type={iconType}\n                class=\"message-icon\"\n            />\n        );\n    }\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-message/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, Method, State, Element, Listen } from '@stencil/core';\nimport { isEventFromElement, isFirefox as checkIfFirefox, loc, nextPaint, overrideFocus } from 'src/utils';\n\n@Component({\n    tag: 'q2-message',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2Message {\n    @Prop({ reflect: true }) type: 'info' | 'error' | 'danger' | 'warning' | 'success' = 'info';\n    @Prop({ reflect: true }) appearance: 'minimal' | 'standard' = 'standard';\n    @Prop({ reflect: true }) description: boolean = false;\n\n    @Element() hostElement: HTMLElement;\n\n    @State() presentToggle: boolean;\n\n    get isFirefox() {\n        return checkIfFirefox();\n    }\n\n    componentDidLoad(): void {\n        overrideFocus(this.hostElement);\n    }\n\n    /**\n     * Prompts assistive technology to announce the message.\n     */\n    @Method()\n    async present() {\n        const { isFirefox } = this;\n        this.presentToggle = !this.presentToggle;\n        if (!isFirefox) return;\n        nextPaint(() => {\n            this.presentToggle = false;\n        });\n    }\n\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.hostElement.shadowRoot.querySelector<HTMLElement>('.message').focus();\n    }\n\n    render() {\n        const { isFirefox } = this;\n        const addAriaHiddenForAriaLive = isFirefox && this.presentToggle;\n        const addDivForAriaLive = !isFirefox && this.presentToggle;\n        const { description } = this;\n        const messageLabel: string = loc(`tecton.element.message.type.${this.type ? this.type : 'info'}`);\n\n        return (\n            <div\n                tabindex=\"-1\"\n                class=\"message\"\n                role={description ? undefined : 'alert'}\n                aria-live={description ? undefined : 'assertive'}\n                aria-atomic={description ? undefined : 'true'}\n                aria-relevant={description ? undefined : 'all'}\n                test-id=\"messageContainer\"\n            >\n                {this.appearance === 'standard' ? this.messageIcon(this.type) : ''}\n                {addDivForAriaLive && <div class=\"sr\"></div>}\n                <div class=\"sr message-label\">{messageLabel}</div>\n                <div\n                    class=\"message-content\"\n                    aria-hidden={addAriaHiddenForAriaLive ? 'true' : undefined}\n                >\n                    <slot />\n                </div>\n            </div>\n        );\n    }\n\n    messageIcon(type: string) {\n        const iconMap = {\n            success: 'success',\n            warning: 'warning',\n            danger: 'error',\n            error: 'error',\n            info: 'info',\n        };\n\n        const iconType: string = iconMap[type] || iconMap.info;\n\n        return (\n            <q2-icon\n                type={iconType}\n                class=\"message-icon\"\n            />\n        );\n    }\n}\n"]}

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

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

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

@@ -8,7 +8,7 @@
 
 *:focus {
   outline: none;
-  box-shadow: var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C);
+  box-shadow: var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc);
 }
 
 :host {
@@ -77,6 +77,6 @@ button {
   font-weight: var(--tct-optgroup-header-font-weight, var(--t-optgroup-header-font-weight, 600));
   text-transform: var(--tct-optgroup-header-text-transform, var(--t-optgroup-header-text-transform, uppercase));
   position: sticky;
-  top: calc(var(--comp-multi-select-header-height, 0px) + var(--tct-optgroup-top, var(--t-optgroup-top, 0px)));
+  top: calc(var(--comp-popover-top-container-height, 0px) + var(--tct-optgroup-top, var(--t-optgroup-top, 0px)));
   z-index: 5;
 }

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

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

package/dist/collection/components/q2-option-list/index.js

@@ -41,8 +41,10 @@ export class Q2OptionList {
         }
         else {
           this.activeIndex = index;
-          if (shouldSelect)
+          if (shouldSelect) {
             this.selectOption(this.allOptions[index]);
+            this.popoverState.emit({ open: false, action: 'select' });
+          }
           else
             this.setActiveElement(index);
         }
@@ -139,7 +141,7 @@ export class Q2OptionList {
     };
     this.internalKeydownHandler = (event) => {
       event.stopPropagation();
-      const { activeIndex, customSearch, allOptions } = this;
+      const { activeIndex, customSearch, allOptions, multiple } = this;
       const { key, shiftKey } = event;
       let newOption;
       switch (key) {
@@ -155,6 +157,9 @@ export class Q2OptionList {
           if (!newOption || newOption.disabled)
             break;
           this.selectOption(newOption);
+          if (multiple)
+            break;
+          this.popoverState.emit({ open: false, action: 'select' });
           break;
         case 'Enter':
           event.preventDefault();
@@ -162,6 +167,9 @@ export class Q2OptionList {
           if (!newOption || newOption.disabled)
             break;
           this.selectOption(newOption);
+          if (multiple)
+            break;
+          this.popoverState.emit({ open: false, action: 'select' });
           break;
         case 'ArrowUp':
           event.preventDefault();
@@ -239,9 +247,9 @@ export class Q2OptionList {
     /* tslint:enable:cyclomatic-complexity */
     this.focusoutHandler = (event) => {
       const { relatedTarget } = event;
-      const isInDropdown = this.allOptions.includes(relatedTarget);
-      const isInLightDom = !isInDropdown && this.hostElement.contains(relatedTarget);
-      if (isInDropdown || isInLightDom) {
+      const isInQ2OptionList = this.allOptions.includes(relatedTarget);
+      const isInLightDom = !isInQ2OptionList && this.hostElement.contains(relatedTarget);
+      if (isInQ2OptionList || isInLightDom) {
         event.stopPropagation();
       }
     };
@@ -249,6 +257,9 @@ export class Q2OptionList {
       const target = event.target;
       const option = target.closest('q2-option');
       this.selectOption(option);
+      if (this.multiple)
+        return;
+      this.popoverState.emit({ open: false, action: 'select' });
     };
     this.customSearch = undefined;
     this.noSelect = undefined;
@@ -443,9 +454,6 @@ export class Q2OptionList {
     else
       this.selectedOptions = values;
     this.change.emit({ value: selectedValue, values });
-    if (multiple)
-      return;
-    this.popoverState.emit({ open: false, action: 'select' });
   }
   adjustActiveOptionAndScroll(numToAdd) {
     this.activeIndex += numToAdd;
@@ -520,7 +528,7 @@ export class Q2OptionList {
   }
   /// DOM ///
   render() {
-    return (h(Host, null, h("div", { class: "content", ref: el => (this.contentElement = el), onFocusout: this.focusoutHandler }, h("div", { class: "options", "aria-label": loc('tecton.element.optionList.label', [this.label]), role: this.type || 'listbox', onKeyDown: this.internalKeydownHandler, onClick: this.clickHandler }, h("slot", null)))));
+    return (h(Host, null, h("div", { class: "content", ref: el => (this.contentElement = el), onFocusout: this.focusoutHandler }, h("div", { class: "options", "aria-label": loc('tecton.element.optionList.label', [this.label]), "aria-multiselectable": `${!!this.multiple}`, role: this.type || 'listbox', onKeyDown: this.internalKeydownHandler, onClick: this.clickHandler }, h("slot", null)))));
   }
   static get is() { return "q2-option-list"; }
   static get encapsulation() { return "shadow"; }
@@ -596,7 +604,7 @@ export class Q2OptionList {
           "references": {
             "IOptionValue": {
               "location": "local",
-              "path": "/workspace/workspace/tecton-production_release_1.37.x/packages/q2-tecton-elements/src/components/q2-option-list/index.tsx"
+              "path": "/workspace/workspace/tecton-production_release_1.38.x/packages/q2-tecton-elements/src/components/q2-option-list/index.tsx"
             }
           }
         },
@@ -722,7 +730,7 @@ export class Q2OptionList {
           "references": {
             "IOptionValue": {
               "location": "local",
-              "path": "/workspace/workspace/tecton-production_release_1.37.x/packages/q2-tecton-elements/src/components/q2-option-list/index.tsx"
+              "path": "/workspace/workspace/tecton-production_release_1.38.x/packages/q2-tecton-elements/src/components/q2-option-list/index.tsx"
             }
           }
         }

package/dist/collection/components/q2-option-list/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-option-list/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    Prop,\n    h,\n    Event,\n    State,\n    Element,\n    ComponentInterface,\n    Host,\n    EventEmitter,\n    Method,\n    Watch,\n    Listen,\n} from '@stencil/core';\nimport { isEventFromElement, loc, nextPaint, overrideFocus, waitForNextPaint } from 'src/utils';\n\nexport interface IOptionValue {\n    value: string;\n    display?: string;\n}\n\n@Component({\n    tag: 'q2-option-list',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2OptionList implements ComponentInterface {\n    @Prop({ reflect: true }) customSearch: boolean;\n    @Prop({ reflect: true }) noSelect: boolean;\n    @Prop({ reflect: true }) align: 'left' | 'right';\n    @Prop({ mutable: true }) selectedOptions: IOptionValue[] = [];\n    @Prop({ reflect: true }) multiple: boolean;\n    @Prop({ reflect: true }) disabled: boolean;\n    @Prop({ reflect: true, mutable: true }) showSelected: boolean;\n    /**\n     * Translates to the role of the option list\n     * @type {('menu' | 'listbox')}\n     */\n    @Prop() type: 'menu' | 'listbox' = 'listbox';\n    @Prop() label: string = loc('tecton.element.optionList.label');\n\n    @Event() change: EventEmitter<{ value: string; values: IOptionValue[] }>;\n    @Event() popoverState: EventEmitter<{ open: boolean; action: 'close' | 'select' | 'open' }>;\n    @Event({ bubbles: false }) ready: EventEmitter;\n    @State() hasOptions: boolean;\n    contentElement: HTMLElement;\n    activeIndex: number;\n    pivotIndex: number;\n    scheduledAfterRender: (() => void)[] = [];\n    searchString: string;\n    searchStringTimer: number;\n    keyStore: {\n        queue: string[];\n        lastPressedAt: Date;\n    } = {\n        queue: [],\n        lastPressedAt: new Date(),\n    };\n\n    @Element() hostElement: HTMLElement;\n\n    /// LifeCycle Hooks ///\n    componentWillLoad() {\n        this.hasOptions = !!this.hostElement.querySelectorAll('q2-option').length;\n    }\n\n    componentDidLoad(): void {\n        overrideFocus(this.hostElement);\n        this.checkOptions();\n        this.selectedOptionsUpdated();\n        this.ready.emit();\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n    }\n\n    /// Getters ///\n    get allContents(): (HTMLQ2OptgroupElement | HTMLQ2OptionElement)[] {\n        const rootSlot = this.getRootSlot(this.hostElement);\n        const acceptedTags = ['Q2-OPTGROUP', 'Q2-OPTION'];\n        return rootSlot.filter(element => acceptedTags.includes(element.tagName)) as (\n            | HTMLQ2OptgroupElement\n            | HTMLQ2OptionElement\n        )[];\n    }\n\n    get allOptions(): HTMLQ2OptionElement[] {\n        const contents = this.allContents;\n\n        const extractOptions = (\n            elements: (HTMLQ2OptgroupElement | HTMLQ2OptionElement | Element)[]\n        ): HTMLQ2OptionElement[] => {\n            return elements.reduce((acc, element) => {\n                if (element.tagName === 'Q2-OPTGROUP') {\n                    return [...acc, ...extractOptions(Array.from(element.children))];\n                } else if (element.tagName === 'Q2-OPTION') {\n                    return [...acc, element];\n                } else {\n                    return acc;\n                }\n            }, []);\n        };\n\n        return extractOptions(contents);\n    }\n\n    get allVisibleOptions(): HTMLQ2OptionElement[] {\n        return this.allOptions.filter(\n            option => !option.hidden && !option._multiSelectHidden && !option.disabled && !option.disabledGroup\n        );\n    }\n\n    /// Helpers ///\n    async checkOptions() {\n        const { type } = this;\n        const options = await this.getOptions();\n        if (!type) return;\n        const optionRole = type === 'menu' ? 'menuitem' : 'option';\n        options.forEach(option => {\n            option.role = optionRole;\n        });\n    }\n\n    getRootSlot(element: Element): Element[] {\n        const slot = element.querySelector('slot');\n        const assignedElements = slot?.assignedElements() ?? Array.from(element.children);\n        const hasAnotherSlot = !!assignedElements.length && assignedElements[0].tagName === 'SLOT';\n        if (hasAnotherSlot) {\n            return this.getRootSlot(assignedElements[0]);\n        } else {\n            return assignedElements;\n        }\n    }\n\n    scrollToActiveOption() {\n        const activeOption = this.allOptions[this.activeIndex];\n        activeOption?.scrollIntoView({ block: 'nearest' });\n    }\n\n    async openDropdownWithActiveElement(activeIndex: number) {\n        if (this.disabled) return;\n        this.activeIndex = activeIndex;\n        this.popoverState.emit({ open: true, action: 'open' });\n        await waitForNextPaint();\n        this.setActiveOption();\n        await waitForNextPaint();\n        this.setFocusedOption();\n        this.scrollToActiveOption();\n    }\n\n    getDefaultActiveIndex() {\n        const { allOptions } = this;\n        const firstSelected = allOptions.findIndex(element => element.selected);\n        if (firstSelected > -1) return firstSelected;\n\n        const firstEnabled = allOptions.findIndex(element => !element.hidden);\n        if (firstEnabled > -1) return firstEnabled;\n\n        return 0;\n    }\n\n    updateSingleOptionAttrs() {\n        const { allOptions, selectedOptions } = this;\n        const selectedValue = selectedOptions[0]?.value || undefined;\n        allOptions.forEach(element => {\n            element.selected = element.value === selectedValue;\n        });\n    }\n\n    updateMultipleOptionAttrs() {\n        const { allOptions, selectedOptions } = this;\n        const selectedValues = selectedOptions.map(({ value }) => value);\n        allOptions.forEach(element => {\n            element.selected = selectedValues.includes(element.value);\n        });\n    }\n\n    setActiveOption() {\n        const activeIndex = this.activeIndex;\n\n        this.allOptions.forEach((element, elementIndex) => {\n            element.active = activeIndex === elementIndex;\n        });\n    }\n\n    setFocusedOption() {\n        const option = this.allOptions[this.activeIndex];\n        if (!option) return;\n\n        const isHostElementVisible = !!this.hostElement.offsetParent;\n        if (isHostElementVisible) option.focus();\n        else nextPaint(() => option.focus());\n    }\n\n    getNextVisibleIndex(direction) {\n        const { allVisibleOptions, allOptions, activeIndex } = this;\n        const activeOption = allOptions[activeIndex];\n        const visibleActiveOptionIndex = allVisibleOptions.indexOf(activeOption);\n        let nextVisibleOptionIndex = visibleActiveOptionIndex + direction;\n\n        if (nextVisibleOptionIndex < 0) {\n            nextVisibleOptionIndex = allVisibleOptions.length - 1;\n        } else if (nextVisibleOptionIndex > allVisibleOptions.length - 1) {\n            nextVisibleOptionIndex = 0;\n        }\n\n        const nextVisibleOption = allVisibleOptions[nextVisibleOptionIndex];\n        return allOptions.indexOf(nextVisibleOption);\n    }\n\n    focusSelectedSibling(option: HTMLQ2OptionElement) {\n        const { allVisibleOptions, allOptions } = this;\n        const hasNoSiblings = allVisibleOptions.length < 2;\n        if (hasNoSiblings) {\n            this.showSelected = false;\n            return;\n        }\n\n        const selectedOptionVisibleIndex = allVisibleOptions.indexOf(option);\n        const nextVisibleSiblingIndex = selectedOptionVisibleIndex\n            ? selectedOptionVisibleIndex - 1\n            : selectedOptionVisibleIndex + 1;\n        const nextVisibleSibling = allVisibleOptions[nextVisibleSiblingIndex];\n        const nextSiblingIndex = allOptions.indexOf(nextVisibleSibling);\n\n        this.activeIndex = nextSiblingIndex;\n        this.setFocusedOption();\n        this.scheduledAfterRender.push(() => {\n            option._multiSelectHidden = !option.selected;\n        });\n    }\n\n    selectOption(selectedOption: HTMLQ2OptionElement) {\n        const { multiple, noSelect, showSelected } = this;\n        if (!selectedOption || selectedOption.disabled || selectedOption.disabledGroup) return;\n        const selectedValue = selectedOption.value;\n        const valueObject = {\n            value: selectedValue,\n            display: selectedOption.display || selectedOption.innerText.trim(),\n        };\n\n        let values: IOptionValue[] = [];\n        if (multiple) {\n            const { selectedOptions } = this;\n            const isAlreadySelected = selectedOptions.find(option => option.value === selectedValue);\n\n            if (isAlreadySelected) {\n                values = selectedOptions.filter(({ value }) => value !== selectedValue);\n            } else {\n                values = [...selectedOptions, valueObject];\n            }\n\n            if (showSelected) this.focusSelectedSibling(selectedOption);\n        } else {\n            values = [valueObject];\n        }\n\n        if (noSelect) this.setActiveElement(null);\n        else this.selectedOptions = values;\n\n        this.change.emit({ value: selectedValue, values });\n\n        if (multiple) return;\n        this.popoverState.emit({ open: false, action: 'select' });\n    }\n\n    adjustActiveOptionAndScroll(numToAdd: number) {\n        this.activeIndex += numToAdd;\n        this.setActiveOption();\n        this.setFocusedOption();\n        this.scrollToActiveOption();\n    }\n\n    resetTimer() {\n        if (this.searchStringTimer) {\n            clearTimeout(this.searchStringTimer);\n        }\n\n        this.searchStringTimer = window.setTimeout(() => {\n            this.searchString = null;\n        }, 2000);\n    }\n\n    searchAndFocus = (keyValue: string, shouldSelect: boolean) => {\n        // pseudo search in non-searchable select\n        const reorder = () => {\n            this.pivotIndex = this.pivotIndex === undefined ? 0 : (this.activeIndex || 0) + 1;\n            const list = this.allOptions.map((element, index) => ({ element, index }));\n            return [...list.slice(this.pivotIndex), ...list.slice(0, this.pivotIndex)];\n        };\n\n        const buildQueue = () => {\n            const now = new Date();\n            if (now.getTime() - this.keyStore.lastPressedAt.getTime() > 1000) {\n                // empty stored keys if delay > 1s\n                this.keyStore.queue.length = 0;\n            }\n            if (this.keyStore.queue.length !== 1 || this.keyStore.queue[0] !== keyValue) {\n                this.keyStore.queue.push(keyValue);\n            }\n            this.keyStore.lastPressedAt = now;\n        };\n\n        const searchIndex = (list: any[]) => {\n            const keyStr = this.keyStore.queue.join('');\n            return list.find(v => {\n                return (\n                    !v.element.disabled &&\n                    v.element.display &&\n                    (v.element.display.match(new RegExp(`^${keyStr}`, 'i')) ||\n                        v.element.display.replace(/\\s/g, '').match(new RegExp(`^${keyStr}`, 'i')))\n                );\n            });\n        };\n\n        const setFocus = ({ index }) => {\n            if (this.multiple) {\n                // multiple: should open to make sure that which options are selected\n                this.openDropdownWithActiveElement(index);\n            } else {\n                this.activeIndex = index;\n                if (shouldSelect) this.selectOption(this.allOptions[index]);\n                else this.setActiveElement(index);\n            }\n        };\n\n        buildQueue();\n        const matched = searchIndex(reorder());\n        if (matched) {\n            setFocus(matched);\n        }\n    };\n\n    searchOptions(key: string, shouldSelect?: boolean) {\n        this.searchString = key;\n        this.searchAndFocus(key, shouldSelect);\n    }\n\n    /// Watchers ///\n    @Watch('showSelected')\n    showSelectedUpdated(showSelected: boolean) {\n        if (showSelected && this.selectedOptions.length === 0) {\n            this.showSelected = false;\n            return;\n        }\n        this.allOptions.forEach(option => (option._multiSelectHidden = showSelected ? !option.selected : false));\n    }\n\n    @Watch('selectedOptions')\n    selectedOptionsUpdated() {\n        if (this.multiple) {\n            this.updateMultipleOptionAttrs();\n        } else {\n            this.updateSingleOptionAttrs();\n        }\n    }\n\n    /// Listeners ///\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.popoverState.emit({ open: true, action: 'open' });\n        const { activeIndex } = this;\n        if (typeof activeIndex === 'number' && activeIndex > -1) {\n            this.setActiveOption();\n            this.setFocusedOption();\n        } else {\n            this.setDefaultActiveElement();\n        }\n    }\n\n    @Listen('click')\n    handleClick(event: MouseEvent) {\n        event.stopPropagation();\n    }\n\n    /// Public Methods ///\n    @Method()\n    async setDefaultActiveElement() {\n        this.activeIndex = this.getDefaultActiveIndex();\n        this.setActiveOption();\n        this.setFocusedOption();\n    }\n\n    @Method()\n    async setActiveElement(index: number) {\n        this.activeIndex = index;\n        this.setActiveOption();\n        this.setFocusedOption();\n    }\n\n    @Method()\n    async handleExternalKeydown(event: KeyboardEvent) {\n        this.externalKeydownHandler(event);\n    }\n\n    @Method()\n    async getContents(): Promise<(HTMLQ2OptgroupElement | HTMLQ2OptionElement)[]> {\n        return this.allContents;\n    }\n\n    @Method()\n    async getOptions(): Promise<HTMLQ2OptionElement[]> {\n        return this.allOptions;\n    }\n\n    /// Event Handlers ///\n    /* tslint:disable:cyclomatic-complexity */\n    externalKeydownHandler = (event: KeyboardEvent) => {\n        event.stopPropagation();\n        const { activeIndex, customSearch, allOptions } = this;\n        const { key } = event;\n\n        let nextIndex;\n        switch (key) {\n            case ' ':\n                if (this.searchString) {\n                    if (customSearch) break;\n\n                    this.searchOptions(key, true);\n                    break;\n                } else if (this.type === 'menu') {\n                    this.activeIndex = 0;\n                    this.openDropdownWithActiveElement(0);\n                } else {\n                    this.setDefaultActiveElement();\n                    nextPaint(() => this.popoverState.emit({ open: true, action: 'open' }));\n                }\n                break;\n\n            case 'Enter':\n                if (this.type === 'menu') {\n                    this.activeIndex = 0;\n                    this.openDropdownWithActiveElement(0);\n                } else {\n                    this.setDefaultActiveElement();\n                    nextPaint(() => this.popoverState.emit({ open: true, action: 'open' }));\n                }\n                break;\n\n            case 'ArrowUp':\n                event.preventDefault();\n                this.activeIndex = 0;\n                nextIndex = !!this.selectedOptions.length ? this.getDefaultActiveIndex() : this.getNextVisibleIndex(-1);\n                if (nextIndex === -1) break;\n                this.openDropdownWithActiveElement(nextIndex);\n                break;\n\n            case 'ArrowDown':\n                event.preventDefault();\n                this.activeIndex = 0;\n                nextIndex = !!this.selectedOptions.length ? this.getDefaultActiveIndex() : this.getNextVisibleIndex(0);\n                if (nextIndex === -1) break;\n                this.openDropdownWithActiveElement(nextIndex);\n                break;\n\n            case 'Home':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(0);\n                break;\n\n            case 'End':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(allOptions.length - 1);\n                break;\n\n            case 'PageUp':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(Math.max((activeIndex || 0) - 10, 0));\n                break;\n\n            case 'PageDown':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(Math.min((activeIndex || 0) + 10, allOptions.length - 1));\n                break;\n\n            case 'Tab':\n                this.popoverState.emit({ open: false, action: 'close' });\n                break;\n\n            case 'Esc':\n            case 'Escape':\n                if (this.noSelect) this.setActiveElement(null);\n                this.popoverState.emit({ open: false, action: 'close' });\n                break;\n\n            default:\n                if (customSearch) break;\n                if (!key.match(/^[\\w]$/)) break;\n\n                this.searchOptions(key, true);\n                break;\n        }\n    };\n\n    internalKeydownHandler = (event: KeyboardEvent) => {\n        event.stopPropagation();\n        const { activeIndex, customSearch, allOptions } = this;\n        const { key, shiftKey } = event;\n\n        let newOption;\n        switch (key) {\n            case ' ':\n                if (this.searchString && !this.multiple) {\n                    if (customSearch) break;\n\n                    this.searchOptions(key, false);\n                    break;\n                }\n\n                event.preventDefault();\n                newOption = allOptions.find(element => element.active);\n                if (!newOption || newOption.disabled) break;\n                this.selectOption(newOption);\n                break;\n\n            case 'Enter':\n                event.preventDefault();\n                newOption = allOptions.find(element => element.active);\n                if (!newOption || newOption.disabled) break;\n                this.selectOption(newOption);\n                break;\n\n            case 'ArrowUp':\n                event.preventDefault();\n                const isFirstOptionActive = activeIndex === 0;\n                if (isFirstOptionActive) break;\n                if (activeIndex === undefined) {\n                    this.setDefaultActiveElement();\n                    break;\n                } else {\n                    const nextIndex = this.getNextVisibleIndex(-1);\n                    if (nextIndex === -1) break;\n                    this.adjustActiveOptionAndScroll(nextIndex - activeIndex);\n                    break;\n                }\n\n            case 'ArrowDown':\n                event.preventDefault();\n                const isLastOptionActive = activeIndex === allOptions.length - 1;\n                if (isLastOptionActive) break;\n                if (activeIndex === undefined) {\n                    this.setDefaultActiveElement();\n                    break;\n                } else {\n                    const nextIndex = this.getNextVisibleIndex(1);\n                    if (nextIndex === -1) break;\n                    this.adjustActiveOptionAndScroll(nextIndex - activeIndex);\n                    break;\n                }\n\n            case 'Home':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(0);\n                break;\n\n            case 'End':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(allOptions.length - 1);\n                break;\n\n            case 'PageUp':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(Math.max(activeIndex - 10, 0));\n                break;\n\n            case 'PageDown':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(Math.min(activeIndex + 10, allOptions.length - 1));\n                break;\n\n            case 'Tab':\n                if (shiftKey) break;\n                if (this.multiple && this.type === 'listbox') break;\n                newOption = allOptions.find(element => element.active);\n                if (!newOption || newOption.disabled) return;\n                this.selectOption(newOption);\n                break;\n\n            case 'Esc':\n            case 'Escape':\n                if (this.noSelect) this.setActiveElement(null);\n                this.popoverState.emit({ open: false, action: 'close' });\n                break;\n\n            default:\n                if (customSearch) break;\n                if (!key.match(/^[\\w]$/)) break;\n\n                this.searchOptions(key, false);\n                break;\n        }\n    };\n    /* tslint:enable:cyclomatic-complexity */\n\n    focusoutHandler = (event: FocusEvent) => {\n        const { relatedTarget } = event as unknown as { relatedTarget: HTMLQ2OptionElement };\n        const isInDropdown = this.allOptions.includes(relatedTarget);\n        const isInLightDom = !isInDropdown && this.hostElement.contains(relatedTarget);\n        if (isInDropdown || isInLightDom) {\n            event.stopPropagation();\n        }\n    };\n\n    clickHandler = (event: Event) => {\n        const target = event.target as HTMLQ2OptionElement;\n        const option = target.closest('q2-option');\n        this.selectOption(option);\n    };\n\n    /// DOM ///\n    render() {\n        return (\n            <Host>\n                <div\n                    class=\"content\"\n                    ref={el => (this.contentElement = el)}\n                    onFocusout={this.focusoutHandler}\n                >\n                    <div\n                        class=\"options\"\n                        aria-label={loc('tecton.element.optionList.label', [this.label])}\n                        role={this.type || 'listbox'}\n                        onKeyDown={this.internalKeydownHandler}\n                        onClick={this.clickHandler}\n                    >\n                        <slot />\n                    </div>\n                </div>\n            </Host>\n        );\n    }\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-option-list/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    Prop,\n    h,\n    Event,\n    State,\n    Element,\n    ComponentInterface,\n    Host,\n    EventEmitter,\n    Method,\n    Watch,\n    Listen,\n} from '@stencil/core';\nimport { isEventFromElement, loc, nextPaint, overrideFocus, waitForNextPaint } from 'src/utils';\n\nexport interface IOptionValue {\n    value: string;\n    display?: string;\n}\n\n@Component({\n    tag: 'q2-option-list',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2OptionList implements ComponentInterface {\n    @Prop({ reflect: true }) customSearch: boolean;\n    @Prop({ reflect: true }) noSelect: boolean;\n    @Prop({ reflect: true }) align: 'left' | 'right';\n    @Prop({ mutable: true }) selectedOptions: IOptionValue[] = [];\n    @Prop({ reflect: true }) multiple: boolean;\n    @Prop({ reflect: true }) disabled: boolean;\n    @Prop({ reflect: true, mutable: true }) showSelected: boolean;\n    /**\n     * Translates to the role of the option list\n     * @type {('menu' | 'listbox')}\n     */\n    @Prop() type: 'menu' | 'listbox' = 'listbox';\n    @Prop() label: string = loc('tecton.element.optionList.label');\n\n    @Event() change: EventEmitter<{ value: string; values: IOptionValue[] }>;\n    @Event() popoverState: EventEmitter<{ open: boolean; action: 'close' | 'select' | 'open' }>;\n    @Event({ bubbles: false }) ready: EventEmitter;\n    @State() hasOptions: boolean;\n    contentElement: HTMLElement;\n    activeIndex: number;\n    pivotIndex: number;\n    scheduledAfterRender: (() => void)[] = [];\n    searchString: string;\n    searchStringTimer: number;\n    keyStore: {\n        queue: string[];\n        lastPressedAt: Date;\n    } = {\n        queue: [],\n        lastPressedAt: new Date(),\n    };\n\n    @Element() hostElement: HTMLElement;\n\n    /// LifeCycle Hooks ///\n    componentWillLoad() {\n        this.hasOptions = !!this.hostElement.querySelectorAll('q2-option').length;\n    }\n\n    componentDidLoad(): void {\n        overrideFocus(this.hostElement);\n        this.checkOptions();\n        this.selectedOptionsUpdated();\n        this.ready.emit();\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n    }\n\n    /// Getters ///\n    get allContents(): (HTMLQ2OptgroupElement | HTMLQ2OptionElement)[] {\n        const rootSlot = this.getRootSlot(this.hostElement);\n        const acceptedTags = ['Q2-OPTGROUP', 'Q2-OPTION'];\n        return rootSlot.filter(element => acceptedTags.includes(element.tagName)) as (\n            | HTMLQ2OptgroupElement\n            | HTMLQ2OptionElement\n        )[];\n    }\n\n    get allOptions(): HTMLQ2OptionElement[] {\n        const contents = this.allContents;\n\n        const extractOptions = (\n            elements: (HTMLQ2OptgroupElement | HTMLQ2OptionElement | Element)[]\n        ): HTMLQ2OptionElement[] => {\n            return elements.reduce((acc, element) => {\n                if (element.tagName === 'Q2-OPTGROUP') {\n                    return [...acc, ...extractOptions(Array.from(element.children))];\n                } else if (element.tagName === 'Q2-OPTION') {\n                    return [...acc, element];\n                } else {\n                    return acc;\n                }\n            }, []);\n        };\n\n        return extractOptions(contents);\n    }\n\n    get allVisibleOptions(): HTMLQ2OptionElement[] {\n        return this.allOptions.filter(\n            option => !option.hidden && !option._multiSelectHidden && !option.disabled && !option.disabledGroup\n        );\n    }\n\n    /// Helpers ///\n    async checkOptions() {\n        const { type } = this;\n        const options = await this.getOptions();\n        if (!type) return;\n        const optionRole = type === 'menu' ? 'menuitem' : 'option';\n        options.forEach(option => {\n            option.role = optionRole;\n        });\n    }\n\n    getRootSlot(element: Element): Element[] {\n        const slot = element.querySelector('slot');\n        const assignedElements = slot?.assignedElements() ?? Array.from(element.children);\n        const hasAnotherSlot = !!assignedElements.length && assignedElements[0].tagName === 'SLOT';\n        if (hasAnotherSlot) {\n            return this.getRootSlot(assignedElements[0]);\n        } else {\n            return assignedElements;\n        }\n    }\n\n    scrollToActiveOption() {\n        const activeOption = this.allOptions[this.activeIndex];\n        activeOption?.scrollIntoView({ block: 'nearest' });\n    }\n\n    async openDropdownWithActiveElement(activeIndex: number) {\n        if (this.disabled) return;\n        this.activeIndex = activeIndex;\n        this.popoverState.emit({ open: true, action: 'open' });\n        await waitForNextPaint();\n        this.setActiveOption();\n        await waitForNextPaint();\n        this.setFocusedOption();\n        this.scrollToActiveOption();\n    }\n\n    getDefaultActiveIndex() {\n        const { allOptions } = this;\n        const firstSelected = allOptions.findIndex(element => element.selected);\n        if (firstSelected > -1) return firstSelected;\n\n        const firstEnabled = allOptions.findIndex(element => !element.hidden);\n        if (firstEnabled > -1) return firstEnabled;\n\n        return 0;\n    }\n\n    updateSingleOptionAttrs() {\n        const { allOptions, selectedOptions } = this;\n        const selectedValue = selectedOptions[0]?.value || undefined;\n        allOptions.forEach(element => {\n            element.selected = element.value === selectedValue;\n        });\n    }\n\n    updateMultipleOptionAttrs() {\n        const { allOptions, selectedOptions } = this;\n        const selectedValues = selectedOptions.map(({ value }) => value);\n        allOptions.forEach(element => {\n            element.selected = selectedValues.includes(element.value);\n        });\n    }\n\n    setActiveOption() {\n        const activeIndex = this.activeIndex;\n\n        this.allOptions.forEach((element, elementIndex) => {\n            element.active = activeIndex === elementIndex;\n        });\n    }\n\n    setFocusedOption() {\n        const option = this.allOptions[this.activeIndex];\n        if (!option) return;\n\n        const isHostElementVisible = !!this.hostElement.offsetParent;\n        if (isHostElementVisible) option.focus();\n        else nextPaint(() => option.focus());\n    }\n\n    getNextVisibleIndex(direction) {\n        const { allVisibleOptions, allOptions, activeIndex } = this;\n        const activeOption = allOptions[activeIndex];\n        const visibleActiveOptionIndex = allVisibleOptions.indexOf(activeOption);\n        let nextVisibleOptionIndex = visibleActiveOptionIndex + direction;\n\n        if (nextVisibleOptionIndex < 0) {\n            nextVisibleOptionIndex = allVisibleOptions.length - 1;\n        } else if (nextVisibleOptionIndex > allVisibleOptions.length - 1) {\n            nextVisibleOptionIndex = 0;\n        }\n\n        const nextVisibleOption = allVisibleOptions[nextVisibleOptionIndex];\n        return allOptions.indexOf(nextVisibleOption);\n    }\n\n    focusSelectedSibling(option: HTMLQ2OptionElement) {\n        const { allVisibleOptions, allOptions } = this;\n        const hasNoSiblings = allVisibleOptions.length < 2;\n        if (hasNoSiblings) {\n            this.showSelected = false;\n            return;\n        }\n\n        const selectedOptionVisibleIndex = allVisibleOptions.indexOf(option);\n        const nextVisibleSiblingIndex = selectedOptionVisibleIndex\n            ? selectedOptionVisibleIndex - 1\n            : selectedOptionVisibleIndex + 1;\n        const nextVisibleSibling = allVisibleOptions[nextVisibleSiblingIndex];\n        const nextSiblingIndex = allOptions.indexOf(nextVisibleSibling);\n\n        this.activeIndex = nextSiblingIndex;\n        this.setFocusedOption();\n        this.scheduledAfterRender.push(() => {\n            option._multiSelectHidden = !option.selected;\n        });\n    }\n\n    selectOption(selectedOption: HTMLQ2OptionElement) {\n        const { multiple, noSelect, showSelected } = this;\n        if (!selectedOption || selectedOption.disabled || selectedOption.disabledGroup) return;\n        const selectedValue = selectedOption.value;\n        const valueObject = {\n            value: selectedValue,\n            display: selectedOption.display || selectedOption.innerText.trim(),\n        };\n\n        let values: IOptionValue[] = [];\n        if (multiple) {\n            const { selectedOptions } = this;\n            const isAlreadySelected = selectedOptions.find(option => option.value === selectedValue);\n\n            if (isAlreadySelected) {\n                values = selectedOptions.filter(({ value }) => value !== selectedValue);\n            } else {\n                values = [...selectedOptions, valueObject];\n            }\n\n            if (showSelected) this.focusSelectedSibling(selectedOption);\n        } else {\n            values = [valueObject];\n        }\n\n        if (noSelect) this.setActiveElement(null);\n        else this.selectedOptions = values;\n\n        this.change.emit({ value: selectedValue, values });\n    }\n\n    adjustActiveOptionAndScroll(numToAdd: number) {\n        this.activeIndex += numToAdd;\n        this.setActiveOption();\n        this.setFocusedOption();\n        this.scrollToActiveOption();\n    }\n\n    resetTimer() {\n        if (this.searchStringTimer) {\n            clearTimeout(this.searchStringTimer);\n        }\n\n        this.searchStringTimer = window.setTimeout(() => {\n            this.searchString = null;\n        }, 2000);\n    }\n\n    searchAndFocus = (keyValue: string, shouldSelect: boolean) => {\n        // pseudo search in non-searchable select\n        const reorder = () => {\n            this.pivotIndex = this.pivotIndex === undefined ? 0 : (this.activeIndex || 0) + 1;\n            const list = this.allOptions.map((element, index) => ({ element, index }));\n            return [...list.slice(this.pivotIndex), ...list.slice(0, this.pivotIndex)];\n        };\n\n        const buildQueue = () => {\n            const now = new Date();\n            if (now.getTime() - this.keyStore.lastPressedAt.getTime() > 1000) {\n                // empty stored keys if delay > 1s\n                this.keyStore.queue.length = 0;\n            }\n            if (this.keyStore.queue.length !== 1 || this.keyStore.queue[0] !== keyValue) {\n                this.keyStore.queue.push(keyValue);\n            }\n            this.keyStore.lastPressedAt = now;\n        };\n\n        const searchIndex = (list: any[]) => {\n            const keyStr = this.keyStore.queue.join('');\n            return list.find(v => {\n                return (\n                    !v.element.disabled &&\n                    v.element.display &&\n                    (v.element.display.match(new RegExp(`^${keyStr}`, 'i')) ||\n                        v.element.display.replace(/\\s/g, '').match(new RegExp(`^${keyStr}`, 'i')))\n                );\n            });\n        };\n\n        const setFocus = ({ index }) => {\n            if (this.multiple) {\n                // multiple: should open to make sure that which options are selected\n                this.openDropdownWithActiveElement(index);\n            } else {\n                this.activeIndex = index;\n                if (shouldSelect) {\n                    this.selectOption(this.allOptions[index]);\n                    this.popoverState.emit({ open: false, action: 'select' });\n                } else this.setActiveElement(index);\n            }\n        };\n\n        buildQueue();\n        const matched = searchIndex(reorder());\n        if (matched) {\n            setFocus(matched);\n        }\n    };\n\n    searchOptions(key: string, shouldSelect?: boolean) {\n        this.searchString = key;\n        this.searchAndFocus(key, shouldSelect);\n    }\n\n    /// Watchers ///\n    @Watch('showSelected')\n    showSelectedUpdated(showSelected: boolean) {\n        if (showSelected && this.selectedOptions.length === 0) {\n            this.showSelected = false;\n            return;\n        }\n        this.allOptions.forEach(option => (option._multiSelectHidden = showSelected ? !option.selected : false));\n    }\n\n    @Watch('selectedOptions')\n    selectedOptionsUpdated() {\n        if (this.multiple) {\n            this.updateMultipleOptionAttrs();\n        } else {\n            this.updateSingleOptionAttrs();\n        }\n    }\n\n    /// Listeners ///\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.popoverState.emit({ open: true, action: 'open' });\n        const { activeIndex } = this;\n        if (typeof activeIndex === 'number' && activeIndex > -1) {\n            this.setActiveOption();\n            this.setFocusedOption();\n        } else {\n            this.setDefaultActiveElement();\n        }\n    }\n\n    @Listen('click')\n    handleClick(event: MouseEvent) {\n        event.stopPropagation();\n    }\n\n    /// Public Methods ///\n    @Method()\n    async setDefaultActiveElement() {\n        this.activeIndex = this.getDefaultActiveIndex();\n        this.setActiveOption();\n        this.setFocusedOption();\n    }\n\n    @Method()\n    async setActiveElement(index: number) {\n        this.activeIndex = index;\n        this.setActiveOption();\n        this.setFocusedOption();\n    }\n\n    @Method()\n    async handleExternalKeydown(event: KeyboardEvent) {\n        this.externalKeydownHandler(event);\n    }\n\n    @Method()\n    async getContents(): Promise<(HTMLQ2OptgroupElement | HTMLQ2OptionElement)[]> {\n        return this.allContents;\n    }\n\n    @Method()\n    async getOptions(): Promise<HTMLQ2OptionElement[]> {\n        return this.allOptions;\n    }\n\n    /// Event Handlers ///\n    /* tslint:disable:cyclomatic-complexity */\n    externalKeydownHandler = (event: KeyboardEvent) => {\n        event.stopPropagation();\n        const { activeIndex, customSearch, allOptions } = this;\n        const { key } = event;\n\n        let nextIndex;\n        switch (key) {\n            case ' ':\n                if (this.searchString) {\n                    if (customSearch) break;\n\n                    this.searchOptions(key, true);\n                    break;\n                } else if (this.type === 'menu') {\n                    this.activeIndex = 0;\n                    this.openDropdownWithActiveElement(0);\n                } else {\n                    this.setDefaultActiveElement();\n                    nextPaint(() => this.popoverState.emit({ open: true, action: 'open' }));\n                }\n                break;\n\n            case 'Enter':\n                if (this.type === 'menu') {\n                    this.activeIndex = 0;\n                    this.openDropdownWithActiveElement(0);\n                } else {\n                    this.setDefaultActiveElement();\n                    nextPaint(() => this.popoverState.emit({ open: true, action: 'open' }));\n                }\n                break;\n\n            case 'ArrowUp':\n                event.preventDefault();\n                this.activeIndex = 0;\n                nextIndex = !!this.selectedOptions.length ? this.getDefaultActiveIndex() : this.getNextVisibleIndex(-1);\n                if (nextIndex === -1) break;\n                this.openDropdownWithActiveElement(nextIndex);\n                break;\n\n            case 'ArrowDown':\n                event.preventDefault();\n                this.activeIndex = 0;\n                nextIndex = !!this.selectedOptions.length ? this.getDefaultActiveIndex() : this.getNextVisibleIndex(0);\n                if (nextIndex === -1) break;\n                this.openDropdownWithActiveElement(nextIndex);\n                break;\n\n            case 'Home':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(0);\n                break;\n\n            case 'End':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(allOptions.length - 1);\n                break;\n\n            case 'PageUp':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(Math.max((activeIndex || 0) - 10, 0));\n                break;\n\n            case 'PageDown':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(Math.min((activeIndex || 0) + 10, allOptions.length - 1));\n                break;\n\n            case 'Tab':\n                this.popoverState.emit({ open: false, action: 'close' });\n                break;\n\n            case 'Esc':\n            case 'Escape':\n                if (this.noSelect) this.setActiveElement(null);\n                this.popoverState.emit({ open: false, action: 'close' });\n                break;\n\n            default:\n                if (customSearch) break;\n                if (!key.match(/^[\\w]$/)) break;\n\n                this.searchOptions(key, true);\n                break;\n        }\n    };\n\n    internalKeydownHandler = (event: KeyboardEvent) => {\n        event.stopPropagation();\n        const { activeIndex, customSearch, allOptions, multiple } = this;\n        const { key, shiftKey } = event;\n\n        let newOption;\n        switch (key) {\n            case ' ':\n                if (this.searchString && !this.multiple) {\n                    if (customSearch) break;\n\n                    this.searchOptions(key, false);\n                    break;\n                }\n\n                event.preventDefault();\n                newOption = allOptions.find(element => element.active);\n                if (!newOption || newOption.disabled) break;\n                this.selectOption(newOption);\n                if (multiple) break;\n                this.popoverState.emit({ open: false, action: 'select' });\n                break;\n\n            case 'Enter':\n                event.preventDefault();\n                newOption = allOptions.find(element => element.active);\n                if (!newOption || newOption.disabled) break;\n                this.selectOption(newOption);\n                if (multiple) break;\n                this.popoverState.emit({ open: false, action: 'select' });\n                break;\n\n            case 'ArrowUp':\n                event.preventDefault();\n                const isFirstOptionActive = activeIndex === 0;\n                if (isFirstOptionActive) break;\n                if (activeIndex === undefined) {\n                    this.setDefaultActiveElement();\n                    break;\n                } else {\n                    const nextIndex = this.getNextVisibleIndex(-1);\n                    if (nextIndex === -1) break;\n                    this.adjustActiveOptionAndScroll(nextIndex - activeIndex);\n                    break;\n                }\n\n            case 'ArrowDown':\n                event.preventDefault();\n                const isLastOptionActive = activeIndex === allOptions.length - 1;\n                if (isLastOptionActive) break;\n                if (activeIndex === undefined) {\n                    this.setDefaultActiveElement();\n                    break;\n                } else {\n                    const nextIndex = this.getNextVisibleIndex(1);\n                    if (nextIndex === -1) break;\n                    this.adjustActiveOptionAndScroll(nextIndex - activeIndex);\n                    break;\n                }\n\n            case 'Home':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(0);\n                break;\n\n            case 'End':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(allOptions.length - 1);\n                break;\n\n            case 'PageUp':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(Math.max(activeIndex - 10, 0));\n                break;\n\n            case 'PageDown':\n                event.preventDefault();\n                this.openDropdownWithActiveElement(Math.min(activeIndex + 10, allOptions.length - 1));\n                break;\n\n            case 'Tab':\n                if (shiftKey) break;\n                if (this.multiple && this.type === 'listbox') break;\n                newOption = allOptions.find(element => element.active);\n                if (!newOption || newOption.disabled) return;\n                this.selectOption(newOption);\n                break;\n\n            case 'Esc':\n            case 'Escape':\n                if (this.noSelect) this.setActiveElement(null);\n                this.popoverState.emit({ open: false, action: 'close' });\n                break;\n\n            default:\n                if (customSearch) break;\n                if (!key.match(/^[\\w]$/)) break;\n\n                this.searchOptions(key, false);\n                break;\n        }\n    };\n    /* tslint:enable:cyclomatic-complexity */\n\n    focusoutHandler = (event: FocusEvent) => {\n        const { relatedTarget } = event as unknown as { relatedTarget: HTMLQ2OptionElement };\n        const isInQ2OptionList = this.allOptions.includes(relatedTarget);\n        const isInLightDom = !isInQ2OptionList && this.hostElement.contains(relatedTarget);\n        if (isInQ2OptionList || isInLightDom) {\n            event.stopPropagation();\n        }\n    };\n\n    clickHandler = (event: Event) => {\n        const target = event.target as HTMLQ2OptionElement;\n        const option = target.closest('q2-option');\n        this.selectOption(option);\n        if (this.multiple) return;\n        this.popoverState.emit({ open: false, action: 'select' });\n    };\n\n    /// DOM ///\n    render() {\n        return (\n            <Host>\n                <div\n                    class=\"content\"\n                    ref={el => (this.contentElement = el)}\n                    onFocusout={this.focusoutHandler}\n                >\n                    <div\n                        class=\"options\"\n                        aria-label={loc('tecton.element.optionList.label', [this.label])}\n                        aria-multiselectable={`${!!this.multiple}`}\n                        role={this.type || 'listbox'}\n                        onKeyDown={this.internalKeydownHandler}\n                        onClick={this.clickHandler}\n                    >\n                        <slot />\n                    </div>\n                </div>\n            </Host>\n        );\n    }\n}\n"]}

package/dist/collection/components/q2-option-list/styles.css

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