@spectrum-web-components/overlay 0.40.1 → 0.40.3

package/src/OverlayDialog.dev.js

@@ -7,7 +7,8 @@ import { VirtualTrigger } from "./VirtualTrigger.dev.js";
 import {
   BeforetoggleClosedEvent,
   BeforetoggleOpenEvent,
-  guaranteedAllTransitionend
+  guaranteedAllTransitionend,
+  OverlayStateEvent
 } from "./AbstractOverlay.dev.js";
 import { userFocusableSelector } from "@spectrum-web-components/shared";
 export function OverlayDialog(constructor) {
@@ -30,9 +31,7 @@ export function OverlayDialog(constructor) {
     async dialogMakeTransition(targetOpenState) {
       let focusEl = null;
       const start = (el, index) => async () => {
-        if (typeof el.open !== "undefined") {
-          el.open = targetOpenState;
-        }
+        el.open = targetOpenState;
         if (!targetOpenState) {
           const close = () => {
             el.removeEventListener("close", close);
@@ -72,10 +71,9 @@ export function OverlayDialog(constructor) {
         const eventName = targetOpenState ? "sp-opened" : "sp-closed";
         if (index > 0) {
           el.dispatchEvent(
-            new CustomEvent(eventName, {
-              bubbles: false,
-              composed: false,
-              detail: { interaction: this.type }
+            new OverlayStateEvent(eventName, this, {
+              interaction: this.type,
+              publish: false
             })
           );
           return;
@@ -86,23 +84,22 @@ export function OverlayDialog(constructor) {
         const reportChange = () => {
           const hasVirtualTrigger = this.triggerElement instanceof VirtualTrigger;
           this.dispatchEvent(
-            new Event(eventName, {
-              bubbles: hasVirtualTrigger,
-              composed: hasVirtualTrigger
+            new OverlayStateEvent(eventName, this, {
+              interaction: this.type,
+              publish: hasVirtualTrigger
             })
           );
           el.dispatchEvent(
-            new Event(eventName, {
-              bubbles: false,
-              composed: false
+            new OverlayStateEvent(eventName, this, {
+              interaction: this.type,
+              publish: false
             })
           );
           if (this.triggerElement && !hasVirtualTrigger) {
             this.triggerElement.dispatchEvent(
-              new CustomEvent(eventName, {
-                bubbles: true,
-                composed: true,
-                detail: { interaction: this.type }
+              new OverlayStateEvent(eventName, this, {
+                interaction: this.type,
+                publish: true
               })
             );
           }

package/src/OverlayDialog.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["OverlayDialog.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport type { SpectrumElement } from '@spectrum-web-components/base';\nimport {\n    firstFocusableIn,\n    firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport { VirtualTrigger } from './VirtualTrigger.dev.js'\nimport {\n    Constructor,\n    OpenableElement,\n    OverlayOpenCloseDetail,\n} from './overlay-types.dev.js'\nimport {\n    BeforetoggleClosedEvent,\n    BeforetoggleOpenEvent,\n    guaranteedAllTransitionend,\n} from './AbstractOverlay.dev.js'\nimport type { AbstractOverlay } from './AbstractOverlay.dev.js'\nimport { userFocusableSelector } from '@spectrum-web-components/shared';\n\nexport function OverlayDialog<T extends Constructor<AbstractOverlay>>(\n    constructor: T\n): T & Constructor<SpectrumElement> {\n    class OverlayWithDialog extends constructor {\n        protected override async manageDialogOpen(): Promise<void> {\n            const targetOpenState = this.open;\n            await this.managePosition();\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            const focusEl = await this.dialogMakeTransition(targetOpenState);\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            await this.dialogApplyFocus(targetOpenState, focusEl);\n        }\n\n        protected async dialogMakeTransition(\n            targetOpenState: boolean\n        ): Promise<HTMLElement | null> {\n            let focusEl = null as HTMLElement | null;\n            const start =\n                (el: OpenableElement, index: number) =>\n                async (): Promise<void> => {\n                    if (typeof el.open !== 'undefined') {\n                        el.open = targetOpenState;\n                    }\n                    if (!targetOpenState) {\n                        const close = (): void => {\n                            el.removeEventListener('close', close);\n                            finish(el, index);\n                        };\n                        el.addEventListener('close', close);\n                    }\n                    if (index > 0) {\n                        // Announce workflow on the first element _only_.\n                        return;\n                    }\n                    const event = targetOpenState\n                        ? BeforetoggleOpenEvent\n                        : BeforetoggleClosedEvent;\n                    this.dispatchEvent(new event());\n                    if (!targetOpenState) {\n                        // Show/focus workflow when opening _only_.\n                        return;\n                    }\n                    if (el.matches(userFocusableSelector)) {\n                        focusEl = el;\n                    }\n                    focusEl = focusEl || firstFocusableIn(el);\n                    if (!focusEl) {\n                        const childSlots = el.querySelectorAll('slot');\n                        childSlots.forEach((slot) => {\n                            if (!focusEl) {\n                                focusEl = firstFocusableSlottedIn(slot);\n                            }\n                        });\n                    }\n                    if (!this.isConnected || this.dialogEl.open) {\n                        // In both of these cases the browser will error.\n                        // You can neither \"reopen\" a <dialog> or open one that is not on the DOM.\n                        return;\n                    }\n                    this.dialogEl.showModal();\n                };\n            const finish = (el: OpenableElement, index: number) => (): void => {\n                if (this.open !== targetOpenState) {\n                    return;\n                }\n                const eventName = targetOpenState ? 'sp-opened' : 'sp-closed';\n                if (index > 0) {\n                    el.dispatchEvent(\n                        new CustomEvent<OverlayOpenCloseDetail>(eventName, {\n                            bubbles: false,\n                            composed: false,\n                            detail: { interaction: this.type },\n                        })\n                    );\n                    return;\n                }\n                if (!this.isConnected || targetOpenState !== this.open) {\n                    // Don't lead into the `.close()` workflow if not connected to the DOM.\n                    // The browser will error in this case.\n                    return;\n                }\n                const reportChange = (): void => {\n                    const hasVirtualTrigger =\n                        this.triggerElement instanceof VirtualTrigger;\n                    this.dispatchEvent(\n                        new Event(eventName, {\n                            bubbles: hasVirtualTrigger,\n                            composed: hasVirtualTrigger,\n                        })\n                    );\n                    el.dispatchEvent(\n                        new Event(eventName, {\n                            bubbles: false,\n                            composed: false,\n                        })\n                    );\n                    if (this.triggerElement && !hasVirtualTrigger) {\n                        (this.triggerElement as HTMLElement).dispatchEvent(\n                            new CustomEvent<OverlayOpenCloseDetail>(eventName, {\n                                bubbles: true,\n                                composed: true,\n                                detail: { interaction: this.type },\n                            })\n                        );\n                    }\n                    this.state = targetOpenState ? 'opened' : 'closed';\n                };\n                if (!targetOpenState && this.dialogEl.open) {\n                    this.dialogEl.addEventListener(\n                        'close',\n                        () => {\n                            reportChange();\n                        },\n                        { once: true }\n                    );\n                    this.dialogEl.close();\n                } else {\n                    reportChange();\n                }\n            };\n            this.elements.forEach((el, index) => {\n                guaranteedAllTransitionend(\n                    el,\n                    start(el, index),\n                    finish(el, index)\n                );\n            });\n            return focusEl;\n        }\n\n        protected async dialogApplyFocus(\n            targetOpenState: boolean,\n            focusEl: HTMLElement | null\n        ): Promise<void> {\n            /**\n             * Focus should be handled natively in `<dialog>` elements when leveraging `.showModal()`, but it's NOT.\n             * - webkit bug: https://bugs.webkit.org/show_bug.cgi?id=255507\n             * - firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1828398\n             **/\n            this.applyFocus(targetOpenState, focusEl);\n        }\n    }\n    return OverlayWithDialog;\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport type { SpectrumElement } from '@spectrum-web-components/base';\nimport {\n    firstFocusableIn,\n    firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport { VirtualTrigger } from './VirtualTrigger.dev.js'\nimport { Constructor, OpenableElement } from './overlay-types.dev.js'\nimport {\n    BeforetoggleClosedEvent,\n    BeforetoggleOpenEvent,\n    guaranteedAllTransitionend,\n    OverlayStateEvent,\n} from './AbstractOverlay.dev.js'\nimport type { AbstractOverlay } from './AbstractOverlay.dev.js'\nimport { userFocusableSelector } from '@spectrum-web-components/shared';\n\nexport function OverlayDialog<T extends Constructor<AbstractOverlay>>(\n    constructor: T\n): T & Constructor<SpectrumElement> {\n    class OverlayWithDialog extends constructor {\n        protected override async manageDialogOpen(): Promise<void> {\n            const targetOpenState = this.open;\n            await this.managePosition();\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            const focusEl = await this.dialogMakeTransition(targetOpenState);\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            await this.dialogApplyFocus(targetOpenState, focusEl);\n        }\n\n        protected async dialogMakeTransition(\n            targetOpenState: boolean\n        ): Promise<HTMLElement | null> {\n            let focusEl = null as HTMLElement | null;\n            const start =\n                (el: OpenableElement, index: number) =>\n                async (): Promise<void> => {\n                    el.open = targetOpenState;\n                    if (!targetOpenState) {\n                        const close = (): void => {\n                            el.removeEventListener('close', close);\n                            finish(el, index);\n                        };\n                        el.addEventListener('close', close);\n                    }\n                    if (index > 0) {\n                        // Announce workflow on the first element _only_.\n                        return;\n                    }\n                    const event = targetOpenState\n                        ? BeforetoggleOpenEvent\n                        : BeforetoggleClosedEvent;\n                    this.dispatchEvent(new event());\n                    if (!targetOpenState) {\n                        // Show/focus workflow when opening _only_.\n                        return;\n                    }\n                    if (el.matches(userFocusableSelector)) {\n                        focusEl = el;\n                    }\n                    focusEl = focusEl || firstFocusableIn(el);\n                    if (!focusEl) {\n                        const childSlots = el.querySelectorAll('slot');\n                        childSlots.forEach((slot) => {\n                            if (!focusEl) {\n                                focusEl = firstFocusableSlottedIn(slot);\n                            }\n                        });\n                    }\n                    if (!this.isConnected || this.dialogEl.open) {\n                        // In both of these cases the browser will error.\n                        // You can neither \"reopen\" a <dialog> or open one that is not on the DOM.\n                        return;\n                    }\n                    this.dialogEl.showModal();\n                };\n            const finish = (el: OpenableElement, index: number) => (): void => {\n                if (this.open !== targetOpenState) {\n                    return;\n                }\n                const eventName = targetOpenState ? 'sp-opened' : 'sp-closed';\n                if (index > 0) {\n                    el.dispatchEvent(\n                        new OverlayStateEvent(eventName, this, {\n                            interaction: this.type,\n                            publish: false,\n                        })\n                    );\n                    return;\n                }\n                if (!this.isConnected || targetOpenState !== this.open) {\n                    // Don't lead into the `.close()` workflow if not connected to the DOM.\n                    // The browser will error in this case.\n                    return;\n                }\n                const reportChange = (): void => {\n                    const hasVirtualTrigger =\n                        this.triggerElement instanceof VirtualTrigger;\n                    this.dispatchEvent(\n                        new OverlayStateEvent(eventName, this, {\n                            interaction: this.type,\n                            publish: hasVirtualTrigger,\n                        })\n                    );\n                    el.dispatchEvent(\n                        new OverlayStateEvent(eventName, this, {\n                            interaction: this.type,\n                            publish: false,\n                        })\n                    );\n                    if (this.triggerElement && !hasVirtualTrigger) {\n                        (this.triggerElement as HTMLElement).dispatchEvent(\n                            new OverlayStateEvent(eventName, this, {\n                                interaction: this.type,\n                                publish: true,\n                            })\n                        );\n                    }\n                    this.state = targetOpenState ? 'opened' : 'closed';\n                };\n                if (!targetOpenState && this.dialogEl.open) {\n                    this.dialogEl.addEventListener(\n                        'close',\n                        () => {\n                            reportChange();\n                        },\n                        { once: true }\n                    );\n                    this.dialogEl.close();\n                } else {\n                    reportChange();\n                }\n            };\n            this.elements.forEach((el, index) => {\n                guaranteedAllTransitionend(\n                    el,\n                    start(el, index),\n                    finish(el, index)\n                );\n            });\n            return focusEl;\n        }\n\n        protected async dialogApplyFocus(\n            targetOpenState: boolean,\n            focusEl: HTMLElement | null\n        ): Promise<void> {\n            /**\n             * Focus should be handled natively in `<dialog>` elements when leveraging `.showModal()`, but it's NOT.\n             * - webkit bug: https://bugs.webkit.org/show_bug.cgi?id=255507\n             * - firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1828398\n             **/\n            this.applyFocus(targetOpenState, focusEl);\n        }\n    }\n    return OverlayWithDialog;\n}\n"],
+  "mappings": ";AAYA;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,sBAAsB;AAE/B;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AAEP,SAAS,6BAA6B;AAE/B,gBAAS,cACZ,aACgC;AAAA,EAChC,MAAM,0BAA0B,YAAY;AAAA,IACxC,MAAyB,mBAAkC;AACvD,YAAM,kBAAkB,KAAK;AAC7B,YAAM,KAAK,eAAe;AAC1B,UAAI,KAAK,SAAS,iBAAiB;AAC/B;AAAA,MACJ;AACA,UAAI,KAAK,SAAS,iBAAiB;AAC/B;AAAA,MACJ;AACA,YAAM,UAAU,MAAM,KAAK,qBAAqB,eAAe;AAC/D,UAAI,KAAK,SAAS,iBAAiB;AAC/B;AAAA,MACJ;AACA,YAAM,KAAK,iBAAiB,iBAAiB,OAAO;AAAA,IACxD;AAAA,IAEA,MAAgB,qBACZ,iBAC2B;AAC3B,UAAI,UAAU;AACd,YAAM,QACF,CAAC,IAAqB,UACtB,YAA2B;AACvB,WAAG,OAAO;AACV,YAAI,CAAC,iBAAiB;AAClB,gBAAM,QAAQ,MAAY;AACtB,eAAG,oBAAoB,SAAS,KAAK;AACrC,mBAAO,IAAI,KAAK;AAAA,UACpB;AACA,aAAG,iBAAiB,SAAS,KAAK;AAAA,QACtC;AACA,YAAI,QAAQ,GAAG;AAEX;AAAA,QACJ;AACA,cAAM,QAAQ,kBACR,wBACA;AACN,aAAK,cAAc,IAAI,MAAM,CAAC;AAC9B,YAAI,CAAC,iBAAiB;AAElB;AAAA,QACJ;AACA,YAAI,GAAG,QAAQ,qBAAqB,GAAG;AACnC,oBAAU;AAAA,QACd;AACA,kBAAU,WAAW,iBAAiB,EAAE;AACxC,YAAI,CAAC,SAAS;AACV,gBAAM,aAAa,GAAG,iBAAiB,MAAM;AAC7C,qBAAW,QAAQ,CAAC,SAAS;AACzB,gBAAI,CAAC,SAAS;AACV,wBAAU,wBAAwB,IAAI;AAAA,YAC1C;AAAA,UACJ,CAAC;AAAA,QACL;AACA,YAAI,CAAC,KAAK,eAAe,KAAK,SAAS,MAAM;AAGzC;AAAA,QACJ;AACA,aAAK,SAAS,UAAU;AAAA,MAC5B;AACJ,YAAM,SAAS,CAAC,IAAqB,UAAkB,MAAY;AAC/D,YAAI,KAAK,SAAS,iBAAiB;AAC/B;AAAA,QACJ;AACA,cAAM,YAAY,kBAAkB,cAAc;AAClD,YAAI,QAAQ,GAAG;AACX,aAAG;AAAA,YACC,IAAI,kBAAkB,WAAW,MAAM;AAAA,cACnC,aAAa,KAAK;AAAA,cAClB,SAAS;AAAA,YACb,CAAC;AAAA,UACL;AACA;AAAA,QACJ;AACA,YAAI,CAAC,KAAK,eAAe,oBAAoB,KAAK,MAAM;AAGpD;AAAA,QACJ;AACA,cAAM,eAAe,MAAY;AAC7B,gBAAM,oBACF,KAAK,0BAA0B;AACnC,eAAK;AAAA,YACD,IAAI,kBAAkB,WAAW,MAAM;AAAA,cACnC,aAAa,KAAK;AAAA,cAClB,SAAS;AAAA,YACb,CAAC;AAAA,UACL;AACA,aAAG;AAAA,YACC,IAAI,kBAAkB,WAAW,MAAM;AAAA,cACnC,aAAa,KAAK;AAAA,cAClB,SAAS;AAAA,YACb,CAAC;AAAA,UACL;AACA,cAAI,KAAK,kBAAkB,CAAC,mBAAmB;AAC3C,YAAC,KAAK,eAA+B;AAAA,cACjC,IAAI,kBAAkB,WAAW,MAAM;AAAA,gBACnC,aAAa,KAAK;AAAA,gBAClB,SAAS;AAAA,cACb,CAAC;AAAA,YACL;AAAA,UACJ;AACA,eAAK,QAAQ,kBAAkB,WAAW;AAAA,QAC9C;AACA,YAAI,CAAC,mBAAmB,KAAK,SAAS,MAAM;AACxC,eAAK,SAAS;AAAA,YACV;AAAA,YACA,MAAM;AACF,2BAAa;AAAA,YACjB;AAAA,YACA,EAAE,MAAM,KAAK;AAAA,UACjB;AACA,eAAK,SAAS,MAAM;AAAA,QACxB,OAAO;AACH,uBAAa;AAAA,QACjB;AAAA,MACJ;AACA,WAAK,SAAS,QAAQ,CAAC,IAAI,UAAU;AACjC;AAAA,UACI;AAAA,UACA,MAAM,IAAI,KAAK;AAAA,UACf,OAAO,IAAI,KAAK;AAAA,QACpB;AAAA,MACJ,CAAC;AACD,aAAO;AAAA,IACX;AAAA,IAEA,MAAgB,iBACZ,iBACA,SACa;AAMb,WAAK,WAAW,iBAAiB,OAAO;AAAA,IAC5C;AAAA,EACJ;AACA,SAAO;AACX;",
   "names": []
 }

package/src/OverlayDialog.js

@@ -1,2 +1,2 @@
-"use strict";import{firstFocusableIn as d,firstFocusableSlottedIn as m}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{VirtualTrigger as u}from"./VirtualTrigger.js";import{BeforetoggleClosedEvent as h,BeforetoggleOpenEvent as f,guaranteedAllTransitionend as E}from"./AbstractOverlay.js";import{userFocusableSelector as v}from"@spectrum-web-components/shared";export function OverlayDialog(a){class c extends a{async manageDialogOpen(){const e=this.open;if(await this.managePosition(),this.open!==e||this.open!==e)return;const o=await this.dialogMakeTransition(e);this.open===e&&await this.dialogApplyFocus(e,o)}async dialogMakeTransition(e){let o=null;const p=(t,s)=>async()=>{if(typeof t.open!="undefined"&&(t.open=e),!e){const i=()=>{t.removeEventListener("close",i),l(t,s)};t.addEventListener("close",i)}if(s>0)return;const n=e?f:h;this.dispatchEvent(new n),e&&(t.matches(v)&&(o=t),o=o||d(t),o||t.querySelectorAll("slot").forEach(r=>{o||(o=m(r))}),!(!this.isConnected||this.dialogEl.open)&&this.dialogEl.showModal())},l=(t,s)=>()=>{if(this.open!==e)return;const n=e?"sp-opened":"sp-closed";if(s>0){t.dispatchEvent(new CustomEvent(n,{bubbles:!1,composed:!1,detail:{interaction:this.type}}));return}if(!this.isConnected||e!==this.open)return;const i=()=>{const r=this.triggerElement instanceof u;this.dispatchEvent(new Event(n,{bubbles:r,composed:r})),t.dispatchEvent(new Event(n,{bubbles:!1,composed:!1})),this.triggerElement&&!r&&this.triggerElement.dispatchEvent(new CustomEvent(n,{bubbles:!0,composed:!0,detail:{interaction:this.type}})),this.state=e?"opened":"closed"};!e&&this.dialogEl.open?(this.dialogEl.addEventListener("close",()=>{i()},{once:!0}),this.dialogEl.close()):i()};return this.elements.forEach((t,s)=>{E(t,p(t,s),l(t,s))}),o}async dialogApplyFocus(e,o){this.applyFocus(e,o)}}return c}
+"use strict";import{firstFocusableIn as u,firstFocusableSlottedIn as m}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{VirtualTrigger as d}from"./VirtualTrigger.js";import{BeforetoggleClosedEvent as f,BeforetoggleOpenEvent as E,guaranteedAllTransitionend as v,OverlayStateEvent as l}from"./AbstractOverlay.js";import{userFocusableSelector as g}from"@spectrum-web-components/shared";export function OverlayDialog(c){class h extends c{async manageDialogOpen(){const e=this.open;if(await this.managePosition(),this.open!==e||this.open!==e)return;const i=await this.dialogMakeTransition(e);this.open===e&&await this.dialogApplyFocus(e,i)}async dialogMakeTransition(e){let i=null;const p=(t,o)=>async()=>{if(t.open=e,!e){const n=()=>{t.removeEventListener("close",n),a(t,o)};t.addEventListener("close",n)}if(o>0)return;const s=e?E:f;this.dispatchEvent(new s),e&&(t.matches(g)&&(i=t),i=i||u(t),i||t.querySelectorAll("slot").forEach(r=>{i||(i=m(r))}),!(!this.isConnected||this.dialogEl.open)&&this.dialogEl.showModal())},a=(t,o)=>()=>{if(this.open!==e)return;const s=e?"sp-opened":"sp-closed";if(o>0){t.dispatchEvent(new l(s,this,{interaction:this.type,publish:!1}));return}if(!this.isConnected||e!==this.open)return;const n=()=>{const r=this.triggerElement instanceof d;this.dispatchEvent(new l(s,this,{interaction:this.type,publish:r})),t.dispatchEvent(new l(s,this,{interaction:this.type,publish:!1})),this.triggerElement&&!r&&this.triggerElement.dispatchEvent(new l(s,this,{interaction:this.type,publish:!0})),this.state=e?"opened":"closed"};!e&&this.dialogEl.open?(this.dialogEl.addEventListener("close",()=>{n()},{once:!0}),this.dialogEl.close()):n()};return this.elements.forEach((t,o)=>{v(t,p(t,o),a(t,o))}),i}async dialogApplyFocus(e,i){this.applyFocus(e,i)}}return h}
 //# sourceMappingURL=OverlayDialog.js.map

package/src/OverlayDialog.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["OverlayDialog.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport type { SpectrumElement } from '@spectrum-web-components/base';\nimport {\n    firstFocusableIn,\n    firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport { VirtualTrigger } from './VirtualTrigger.js';\nimport {\n    Constructor,\n    OpenableElement,\n    OverlayOpenCloseDetail,\n} from './overlay-types.js';\nimport {\n    BeforetoggleClosedEvent,\n    BeforetoggleOpenEvent,\n    guaranteedAllTransitionend,\n} from './AbstractOverlay.js';\nimport type { AbstractOverlay } from './AbstractOverlay.js';\nimport { userFocusableSelector } from '@spectrum-web-components/shared';\n\nexport function OverlayDialog<T extends Constructor<AbstractOverlay>>(\n    constructor: T\n): T & Constructor<SpectrumElement> {\n    class OverlayWithDialog extends constructor {\n        protected override async manageDialogOpen(): Promise<void> {\n            const targetOpenState = this.open;\n            await this.managePosition();\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            const focusEl = await this.dialogMakeTransition(targetOpenState);\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            await this.dialogApplyFocus(targetOpenState, focusEl);\n        }\n\n        protected async dialogMakeTransition(\n            targetOpenState: boolean\n        ): Promise<HTMLElement | null> {\n            let focusEl = null as HTMLElement | null;\n            const start =\n                (el: OpenableElement, index: number) =>\n                async (): Promise<void> => {\n                    if (typeof el.open !== 'undefined') {\n                        el.open = targetOpenState;\n                    }\n                    if (!targetOpenState) {\n                        const close = (): void => {\n                            el.removeEventListener('close', close);\n                            finish(el, index);\n                        };\n                        el.addEventListener('close', close);\n                    }\n                    if (index > 0) {\n                        // Announce workflow on the first element _only_.\n                        return;\n                    }\n                    const event = targetOpenState\n                        ? BeforetoggleOpenEvent\n                        : BeforetoggleClosedEvent;\n                    this.dispatchEvent(new event());\n                    if (!targetOpenState) {\n                        // Show/focus workflow when opening _only_.\n                        return;\n                    }\n                    if (el.matches(userFocusableSelector)) {\n                        focusEl = el;\n                    }\n                    focusEl = focusEl || firstFocusableIn(el);\n                    if (!focusEl) {\n                        const childSlots = el.querySelectorAll('slot');\n                        childSlots.forEach((slot) => {\n                            if (!focusEl) {\n                                focusEl = firstFocusableSlottedIn(slot);\n                            }\n                        });\n                    }\n                    if (!this.isConnected || this.dialogEl.open) {\n                        // In both of these cases the browser will error.\n                        // You can neither \"reopen\" a <dialog> or open one that is not on the DOM.\n                        return;\n                    }\n                    this.dialogEl.showModal();\n                };\n            const finish = (el: OpenableElement, index: number) => (): void => {\n                if (this.open !== targetOpenState) {\n                    return;\n                }\n                const eventName = targetOpenState ? 'sp-opened' : 'sp-closed';\n                if (index > 0) {\n                    el.dispatchEvent(\n                        new CustomEvent<OverlayOpenCloseDetail>(eventName, {\n                            bubbles: false,\n                            composed: false,\n                            detail: { interaction: this.type },\n                        })\n                    );\n                    return;\n                }\n                if (!this.isConnected || targetOpenState !== this.open) {\n                    // Don't lead into the `.close()` workflow if not connected to the DOM.\n                    // The browser will error in this case.\n                    return;\n                }\n                const reportChange = (): void => {\n                    const hasVirtualTrigger =\n                        this.triggerElement instanceof VirtualTrigger;\n                    this.dispatchEvent(\n                        new Event(eventName, {\n                            bubbles: hasVirtualTrigger,\n                            composed: hasVirtualTrigger,\n                        })\n                    );\n                    el.dispatchEvent(\n                        new Event(eventName, {\n                            bubbles: false,\n                            composed: false,\n                        })\n                    );\n                    if (this.triggerElement && !hasVirtualTrigger) {\n                        (this.triggerElement as HTMLElement).dispatchEvent(\n                            new CustomEvent<OverlayOpenCloseDetail>(eventName, {\n                                bubbles: true,\n                                composed: true,\n                                detail: { interaction: this.type },\n                            })\n                        );\n                    }\n                    this.state = targetOpenState ? 'opened' : 'closed';\n                };\n                if (!targetOpenState && this.dialogEl.open) {\n                    this.dialogEl.addEventListener(\n                        'close',\n                        () => {\n                            reportChange();\n                        },\n                        { once: true }\n                    );\n                    this.dialogEl.close();\n                } else {\n                    reportChange();\n                }\n            };\n            this.elements.forEach((el, index) => {\n                guaranteedAllTransitionend(\n                    el,\n                    start(el, index),\n                    finish(el, index)\n                );\n            });\n            return focusEl;\n        }\n\n        protected async dialogApplyFocus(\n            targetOpenState: boolean,\n            focusEl: HTMLElement | null\n        ): Promise<void> {\n            /**\n             * Focus should be handled natively in `<dialog>` elements when leveraging `.showModal()`, but it's NOT.\n             * - webkit bug: https://bugs.webkit.org/show_bug.cgi?id=255507\n             * - firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1828398\n             **/\n            this.applyFocus(targetOpenState, focusEl);\n        }\n    }\n    return OverlayWithDialog;\n}\n"],
-  "mappings": "aAYA,OACI,oBAAAA,EACA,2BAAAC,MACG,4DACP,OAAS,kBAAAC,MAAsB,sBAM/B,OACI,2BAAAC,EACA,yBAAAC,EACA,8BAAAC,MACG,uBAEP,OAAS,yBAAAC,MAA6B,kCAE/B,gBAAS,cACZC,EACgC,CAChC,MAAMC,UAA0BD,CAAY,CACxC,MAAyB,kBAAkC,CACvD,MAAME,EAAkB,KAAK,KAK7B,GAJA,MAAM,KAAK,eAAe,EACtB,KAAK,OAASA,GAGd,KAAK,OAASA,EACd,OAEJ,MAAMC,EAAU,MAAM,KAAK,qBAAqBD,CAAe,EAC3D,KAAK,OAASA,GAGlB,MAAM,KAAK,iBAAiBA,EAAiBC,CAAO,CACxD,CAEA,MAAgB,qBACZD,EAC2B,CAC3B,IAAIC,EAAU,KACd,MAAMC,EACF,CAACC,EAAqBC,IACtB,SAA2B,CAIvB,GAHI,OAAOD,EAAG,MAAS,cACnBA,EAAG,KAAOH,GAEV,CAACA,EAAiB,CAClB,MAAMK,EAAQ,IAAY,CACtBF,EAAG,oBAAoB,QAASE,CAAK,EACrCC,EAAOH,EAAIC,CAAK,CACpB,EACAD,EAAG,iBAAiB,QAASE,CAAK,CACtC,CACA,GAAID,EAAQ,EAER,OAEJ,MAAMG,EAAQP,EACRL,EACAD,EACN,KAAK,cAAc,IAAIa,CAAO,EACzBP,IAIDG,EAAG,QAAQN,CAAqB,IAChCI,EAAUE,GAEdF,EAAUA,GAAWV,EAAiBY,CAAE,EACnCF,GACkBE,EAAG,iBAAiB,MAAM,EAClC,QAASK,GAAS,CACpBP,IACDA,EAAUT,EAAwBgB,CAAI,EAE9C,CAAC,EAED,GAAC,KAAK,aAAe,KAAK,SAAS,OAKvC,KAAK,SAAS,UAAU,EAC5B,EACEF,EAAS,CAACH,EAAqBC,IAAkB,IAAY,CAC/D,GAAI,KAAK,OAASJ,EACd,OAEJ,MAAMS,EAAYT,EAAkB,YAAc,YAClD,GAAII,EAAQ,EAAG,CACXD,EAAG,cACC,IAAI,YAAoCM,EAAW,CAC/C,QAAS,GACT,SAAU,GACV,OAAQ,CAAE,YAAa,KAAK,IAAK,CACrC,CAAC,CACL,EACA,MACJ,CACA,GAAI,CAAC,KAAK,aAAeT,IAAoB,KAAK,KAG9C,OAEJ,MAAMU,EAAe,IAAY,CAC7B,MAAMC,EACF,KAAK,0BAA0BlB,EACnC,KAAK,cACD,IAAI,MAAMgB,EAAW,CACjB,QAASE,EACT,SAAUA,CACd,CAAC,CACL,EACAR,EAAG,cACC,IAAI,MAAMM,EAAW,CACjB,QAAS,GACT,SAAU,EACd,CAAC,CACL,EACI,KAAK,gBAAkB,CAACE,GACvB,KAAK,eAA+B,cACjC,IAAI,YAAoCF,EAAW,CAC/C,QAAS,GACT,SAAU,GACV,OAAQ,CAAE,YAAa,KAAK,IAAK,CACrC,CAAC,CACL,EAEJ,KAAK,MAAQT,EAAkB,SAAW,QAC9C,EACI,CAACA,GAAmB,KAAK,SAAS,MAClC,KAAK,SAAS,iBACV,QACA,IAAM,CACFU,EAAa,CACjB,EACA,CAAE,KAAM,EAAK,CACjB,EACA,KAAK,SAAS,MAAM,GAEpBA,EAAa,CAErB,EACA,YAAK,SAAS,QAAQ,CAACP,EAAIC,IAAU,CACjCR,EACIO,EACAD,EAAMC,EAAIC,CAAK,EACfE,EAAOH,EAAIC,CAAK,CACpB,CACJ,CAAC,EACMH,CACX,CAEA,MAAgB,iBACZD,EACAC,EACa,CAMb,KAAK,WAAWD,EAAiBC,CAAO,CAC5C,CACJ,CACA,OAAOF,CACX",
-  "names": ["firstFocusableIn", "firstFocusableSlottedIn", "VirtualTrigger", "BeforetoggleClosedEvent", "BeforetoggleOpenEvent", "guaranteedAllTransitionend", "userFocusableSelector", "constructor", "OverlayWithDialog", "targetOpenState", "focusEl", "start", "el", "index", "close", "finish", "event", "slot", "eventName", "reportChange", "hasVirtualTrigger"]
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport type { SpectrumElement } from '@spectrum-web-components/base';\nimport {\n    firstFocusableIn,\n    firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport { VirtualTrigger } from './VirtualTrigger.js';\nimport { Constructor, OpenableElement } from './overlay-types.js';\nimport {\n    BeforetoggleClosedEvent,\n    BeforetoggleOpenEvent,\n    guaranteedAllTransitionend,\n    OverlayStateEvent,\n} from './AbstractOverlay.js';\nimport type { AbstractOverlay } from './AbstractOverlay.js';\nimport { userFocusableSelector } from '@spectrum-web-components/shared';\n\nexport function OverlayDialog<T extends Constructor<AbstractOverlay>>(\n    constructor: T\n): T & Constructor<SpectrumElement> {\n    class OverlayWithDialog extends constructor {\n        protected override async manageDialogOpen(): Promise<void> {\n            const targetOpenState = this.open;\n            await this.managePosition();\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            const focusEl = await this.dialogMakeTransition(targetOpenState);\n            if (this.open !== targetOpenState) {\n                return;\n            }\n            await this.dialogApplyFocus(targetOpenState, focusEl);\n        }\n\n        protected async dialogMakeTransition(\n            targetOpenState: boolean\n        ): Promise<HTMLElement | null> {\n            let focusEl = null as HTMLElement | null;\n            const start =\n                (el: OpenableElement, index: number) =>\n                async (): Promise<void> => {\n                    el.open = targetOpenState;\n                    if (!targetOpenState) {\n                        const close = (): void => {\n                            el.removeEventListener('close', close);\n                            finish(el, index);\n                        };\n                        el.addEventListener('close', close);\n                    }\n                    if (index > 0) {\n                        // Announce workflow on the first element _only_.\n                        return;\n                    }\n                    const event = targetOpenState\n                        ? BeforetoggleOpenEvent\n                        : BeforetoggleClosedEvent;\n                    this.dispatchEvent(new event());\n                    if (!targetOpenState) {\n                        // Show/focus workflow when opening _only_.\n                        return;\n                    }\n                    if (el.matches(userFocusableSelector)) {\n                        focusEl = el;\n                    }\n                    focusEl = focusEl || firstFocusableIn(el);\n                    if (!focusEl) {\n                        const childSlots = el.querySelectorAll('slot');\n                        childSlots.forEach((slot) => {\n                            if (!focusEl) {\n                                focusEl = firstFocusableSlottedIn(slot);\n                            }\n                        });\n                    }\n                    if (!this.isConnected || this.dialogEl.open) {\n                        // In both of these cases the browser will error.\n                        // You can neither \"reopen\" a <dialog> or open one that is not on the DOM.\n                        return;\n                    }\n                    this.dialogEl.showModal();\n                };\n            const finish = (el: OpenableElement, index: number) => (): void => {\n                if (this.open !== targetOpenState) {\n                    return;\n                }\n                const eventName = targetOpenState ? 'sp-opened' : 'sp-closed';\n                if (index > 0) {\n                    el.dispatchEvent(\n                        new OverlayStateEvent(eventName, this, {\n                            interaction: this.type,\n                            publish: false,\n                        })\n                    );\n                    return;\n                }\n                if (!this.isConnected || targetOpenState !== this.open) {\n                    // Don't lead into the `.close()` workflow if not connected to the DOM.\n                    // The browser will error in this case.\n                    return;\n                }\n                const reportChange = (): void => {\n                    const hasVirtualTrigger =\n                        this.triggerElement instanceof VirtualTrigger;\n                    this.dispatchEvent(\n                        new OverlayStateEvent(eventName, this, {\n                            interaction: this.type,\n                            publish: hasVirtualTrigger,\n                        })\n                    );\n                    el.dispatchEvent(\n                        new OverlayStateEvent(eventName, this, {\n                            interaction: this.type,\n                            publish: false,\n                        })\n                    );\n                    if (this.triggerElement && !hasVirtualTrigger) {\n                        (this.triggerElement as HTMLElement).dispatchEvent(\n                            new OverlayStateEvent(eventName, this, {\n                                interaction: this.type,\n                                publish: true,\n                            })\n                        );\n                    }\n                    this.state = targetOpenState ? 'opened' : 'closed';\n                };\n                if (!targetOpenState && this.dialogEl.open) {\n                    this.dialogEl.addEventListener(\n                        'close',\n                        () => {\n                            reportChange();\n                        },\n                        { once: true }\n                    );\n                    this.dialogEl.close();\n                } else {\n                    reportChange();\n                }\n            };\n            this.elements.forEach((el, index) => {\n                guaranteedAllTransitionend(\n                    el,\n                    start(el, index),\n                    finish(el, index)\n                );\n            });\n            return focusEl;\n        }\n\n        protected async dialogApplyFocus(\n            targetOpenState: boolean,\n            focusEl: HTMLElement | null\n        ): Promise<void> {\n            /**\n             * Focus should be handled natively in `<dialog>` elements when leveraging `.showModal()`, but it's NOT.\n             * - webkit bug: https://bugs.webkit.org/show_bug.cgi?id=255507\n             * - firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1828398\n             **/\n            this.applyFocus(targetOpenState, focusEl);\n        }\n    }\n    return OverlayWithDialog;\n}\n"],
+  "mappings": "aAYA,OACI,oBAAAA,EACA,2BAAAC,MACG,4DACP,OAAS,kBAAAC,MAAsB,sBAE/B,OACI,2BAAAC,EACA,yBAAAC,EACA,8BAAAC,EACA,qBAAAC,MACG,uBAEP,OAAS,yBAAAC,MAA6B,kCAE/B,gBAAS,cACZC,EACgC,CAChC,MAAMC,UAA0BD,CAAY,CACxC,MAAyB,kBAAkC,CACvD,MAAME,EAAkB,KAAK,KAK7B,GAJA,MAAM,KAAK,eAAe,EACtB,KAAK,OAASA,GAGd,KAAK,OAASA,EACd,OAEJ,MAAMC,EAAU,MAAM,KAAK,qBAAqBD,CAAe,EAC3D,KAAK,OAASA,GAGlB,MAAM,KAAK,iBAAiBA,EAAiBC,CAAO,CACxD,CAEA,MAAgB,qBACZD,EAC2B,CAC3B,IAAIC,EAAU,KACd,MAAMC,EACF,CAACC,EAAqBC,IACtB,SAA2B,CAEvB,GADAD,EAAG,KAAOH,EACN,CAACA,EAAiB,CAClB,MAAMK,EAAQ,IAAY,CACtBF,EAAG,oBAAoB,QAASE,CAAK,EACrCC,EAAOH,EAAIC,CAAK,CACpB,EACAD,EAAG,iBAAiB,QAASE,CAAK,CACtC,CACA,GAAID,EAAQ,EAER,OAEJ,MAAMG,EAAQP,EACRN,EACAD,EACN,KAAK,cAAc,IAAIc,CAAO,EACzBP,IAIDG,EAAG,QAAQN,CAAqB,IAChCI,EAAUE,GAEdF,EAAUA,GAAWX,EAAiBa,CAAE,EACnCF,GACkBE,EAAG,iBAAiB,MAAM,EAClC,QAASK,GAAS,CACpBP,IACDA,EAAUV,EAAwBiB,CAAI,EAE9C,CAAC,EAED,GAAC,KAAK,aAAe,KAAK,SAAS,OAKvC,KAAK,SAAS,UAAU,EAC5B,EACEF,EAAS,CAACH,EAAqBC,IAAkB,IAAY,CAC/D,GAAI,KAAK,OAASJ,EACd,OAEJ,MAAMS,EAAYT,EAAkB,YAAc,YAClD,GAAII,EAAQ,EAAG,CACXD,EAAG,cACC,IAAIP,EAAkBa,EAAW,KAAM,CACnC,YAAa,KAAK,KAClB,QAAS,EACb,CAAC,CACL,EACA,MACJ,CACA,GAAI,CAAC,KAAK,aAAeT,IAAoB,KAAK,KAG9C,OAEJ,MAAMU,EAAe,IAAY,CAC7B,MAAMC,EACF,KAAK,0BAA0BnB,EACnC,KAAK,cACD,IAAII,EAAkBa,EAAW,KAAM,CACnC,YAAa,KAAK,KAClB,QAASE,CACb,CAAC,CACL,EACAR,EAAG,cACC,IAAIP,EAAkBa,EAAW,KAAM,CACnC,YAAa,KAAK,KAClB,QAAS,EACb,CAAC,CACL,EACI,KAAK,gBAAkB,CAACE,GACvB,KAAK,eAA+B,cACjC,IAAIf,EAAkBa,EAAW,KAAM,CACnC,YAAa,KAAK,KAClB,QAAS,EACb,CAAC,CACL,EAEJ,KAAK,MAAQT,EAAkB,SAAW,QAC9C,EACI,CAACA,GAAmB,KAAK,SAAS,MAClC,KAAK,SAAS,iBACV,QACA,IAAM,CACFU,EAAa,CACjB,EACA,CAAE,KAAM,EAAK,CACjB,EACA,KAAK,SAAS,MAAM,GAEpBA,EAAa,CAErB,EACA,YAAK,SAAS,QAAQ,CAACP,EAAIC,IAAU,CACjCT,EACIQ,EACAD,EAAMC,EAAIC,CAAK,EACfE,EAAOH,EAAIC,CAAK,CACpB,CACJ,CAAC,EACMH,CACX,CAEA,MAAgB,iBACZD,EACAC,EACa,CAMb,KAAK,WAAWD,EAAiBC,CAAO,CAC5C,CACJ,CACA,OAAOF,CACX",
+  "names": ["firstFocusableIn", "firstFocusableSlottedIn", "VirtualTrigger", "BeforetoggleClosedEvent", "BeforetoggleOpenEvent", "guaranteedAllTransitionend", "OverlayStateEvent", "userFocusableSelector", "constructor", "OverlayWithDialog", "targetOpenState", "focusEl", "start", "el", "index", "close", "finish", "event", "slot", "eventName", "reportChange", "hasVirtualTrigger"]
 }

package/src/OverlayNoPopover.dev.js

@@ -9,6 +9,7 @@ import {
   BeforetoggleOpenEvent,
   forcePaint,
   guaranteedAllTransitionend,
+  OverlayStateEvent,
   overlayTimer
 } from "./AbstractOverlay.dev.js";
 import { userFocusableSelector } from "@spectrum-web-components/shared";
@@ -41,9 +42,7 @@ export function OverlayNoPopover(constructor) {
         if (targetOpenState !== this.open) {
           return;
         }
-        if (typeof el.open !== "undefined") {
-          el.open = targetOpenState;
-        }
+        el.open = targetOpenState;
         if (index === 0) {
           const event = targetOpenState ? BeforetoggleOpenEvent : BeforetoggleClosedEvent;
           this.dispatchEvent(new event());
@@ -71,10 +70,8 @@ export function OverlayNoPopover(constructor) {
         }
         const eventName = targetOpenState ? "sp-opened" : "sp-closed";
         el.dispatchEvent(
-          new CustomEvent(eventName, {
-            bubbles: false,
-            composed: false,
-            detail: { interaction: this.type }
+          new OverlayStateEvent(eventName, this, {
+            interaction: this.type
           })
         );
         if (index > 0) {
@@ -82,17 +79,16 @@ export function OverlayNoPopover(constructor) {
         }
         const hasVirtualTrigger = this.triggerElement instanceof VirtualTrigger;
         this.dispatchEvent(
-          new Event(eventName, {
-            bubbles: hasVirtualTrigger,
-            composed: hasVirtualTrigger
+          new OverlayStateEvent(eventName, this, {
+            interaction: this.type,
+            publish: hasVirtualTrigger
           })
         );
         if (this.triggerElement && !hasVirtualTrigger) {
           this.triggerElement.dispatchEvent(
-            new CustomEvent(eventName, {
-              bubbles: true,
-              composed: true,
-              detail: { interaction: this.type }
+            new OverlayStateEvent(eventName, this, {
+              interaction: this.type,
+              publish: true
             })
           );
         }

package/src/OverlayNoPopover.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["OverlayNoPopover.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport {\n    firstFocusableIn,\n    firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport type { SpectrumElement } from '@spectrum-web-components/base';\nimport { VirtualTrigger } from './VirtualTrigger.dev.js'\nimport {\n    Constructor,\n    OpenableElement,\n    OverlayOpenCloseDetail,\n} from './overlay-types.dev.js'\nimport {\n    BeforetoggleClosedEvent,\n    BeforetoggleOpenEvent,\n    forcePaint,\n    guaranteedAllTransitionend,\n    overlayTimer,\n} from './AbstractOverlay.dev.js'\nimport type { AbstractOverlay } from './AbstractOverlay.dev.js'\nimport { userFocusableSelector } from '@spectrum-web-components/shared';\n\nexport function OverlayNoPopover<T extends Constructor<AbstractOverlay>>(\n    constructor: T\n): T & Constructor<SpectrumElement> {\n    class OverlayWithNoPopover extends constructor {\n        protected override async managePopoverOpen(): Promise<void> {\n            await this.managePosition();\n        }\n\n        protected override async manageDelay(\n            targetOpenState: boolean\n        ): Promise<void> {\n            if (targetOpenState === false || targetOpenState !== this.open) {\n                overlayTimer.close(this);\n                return;\n            }\n            if (this.delayed) {\n                const cancelled = await overlayTimer.openTimer(this);\n                if (cancelled) {\n                    this.open = !targetOpenState;\n                }\n            }\n        }\n\n        protected override async ensureOnDOM(\n            _targetOpenState: boolean\n        ): Promise<void> {\n            forcePaint();\n        }\n\n        protected override async makeTransition(\n            targetOpenState: boolean\n        ): Promise<HTMLElement | null> {\n            if (this.open !== targetOpenState) {\n                return null;\n            }\n            let focusEl = null as HTMLElement | null;\n            const start = (el: OpenableElement, index: number) => (): void => {\n                if (targetOpenState !== this.open) {\n                    return;\n                }\n                if (typeof el.open !== 'undefined') {\n                    el.open = targetOpenState;\n                }\n                if (index === 0) {\n                    const event = targetOpenState\n                        ? BeforetoggleOpenEvent\n                        : BeforetoggleClosedEvent;\n                    this.dispatchEvent(new event());\n                }\n                if (targetOpenState !== true) {\n                    return;\n                }\n                if (el.matches(userFocusableSelector)) {\n                    focusEl = el;\n                }\n                focusEl = focusEl || firstFocusableIn(el);\n                if (focusEl) {\n                    return;\n                }\n                const childSlots = el.querySelectorAll('slot');\n                childSlots.forEach((slot) => {\n                    if (!focusEl) {\n                        focusEl = firstFocusableSlottedIn(slot);\n                    }\n                });\n            };\n            const finish = (el: OpenableElement, index: number) => (): void => {\n                if (this.open !== targetOpenState) {\n                    return;\n                }\n                const eventName = targetOpenState ? 'sp-opened' : 'sp-closed';\n                el.dispatchEvent(\n                    new CustomEvent<OverlayOpenCloseDetail>(eventName, {\n                        bubbles: false,\n                        composed: false,\n                        detail: { interaction: this.type },\n                    })\n                );\n                if (index > 0) {\n                    return;\n                }\n                const hasVirtualTrigger =\n                    this.triggerElement instanceof VirtualTrigger;\n                this.dispatchEvent(\n                    new Event(eventName, {\n                        bubbles: hasVirtualTrigger,\n                        composed: hasVirtualTrigger,\n                    })\n                );\n                if (this.triggerElement && !hasVirtualTrigger) {\n                    (this.triggerElement as HTMLElement).dispatchEvent(\n                        new CustomEvent<OverlayOpenCloseDetail>(eventName, {\n                            bubbles: true,\n                            composed: true,\n                            detail: { interaction: this.type },\n                        })\n                    );\n                }\n                this.state = targetOpenState ? 'opened' : 'closed';\n            };\n            this.elements.forEach((el, index) => {\n                guaranteedAllTransitionend(\n                    el,\n                    start(el, index),\n                    finish(el, index)\n                );\n            });\n            return focusEl;\n        }\n    }\n    return OverlayWithNoPopover;\n}\n"],
-  "mappings": ";AAWA;AAAA,EACI;AAAA,EACA;AAAA,OACG;AAEP,SAAS,sBAAsB;AAM/B;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AAEP,SAAS,6BAA6B;AAE/B,gBAAS,iBACZ,aACgC;AAAA,EAChC,MAAM,6BAA6B,YAAY;AAAA,IAC3C,MAAyB,oBAAmC;AACxD,YAAM,KAAK,eAAe;AAAA,IAC9B;AAAA,IAEA,MAAyB,YACrB,iBACa;AACb,UAAI,oBAAoB,SAAS,oBAAoB,KAAK,MAAM;AAC5D,qBAAa,MAAM,IAAI;AACvB;AAAA,MACJ;AACA,UAAI,KAAK,SAAS;AACd,cAAM,YAAY,MAAM,aAAa,UAAU,IAAI;AACnD,YAAI,WAAW;AACX,eAAK,OAAO,CAAC;AAAA,QACjB;AAAA,MACJ;AAAA,IACJ;AAAA,IAEA,MAAyB,YACrB,kBACa;AACb,iBAAW;AAAA,IACf;AAAA,IAEA,MAAyB,eACrB,iBAC2B;AAC3B,UAAI,KAAK,SAAS,iBAAiB;AAC/B,eAAO;AAAA,MACX;AACA,UAAI,UAAU;AACd,YAAM,QAAQ,CAAC,IAAqB,UAAkB,MAAY;AAC9D,YAAI,oBAAoB,KAAK,MAAM;AAC/B;AAAA,QACJ;AACA,YAAI,OAAO,GAAG,SAAS,aAAa;AAChC,aAAG,OAAO;AAAA,QACd;AACA,YAAI,UAAU,GAAG;AACb,gBAAM,QAAQ,kBACR,wBACA;AACN,eAAK,cAAc,IAAI,MAAM,CAAC;AAAA,QAClC;AACA,YAAI,oBAAoB,MAAM;AAC1B;AAAA,QACJ;AACA,YAAI,GAAG,QAAQ,qBAAqB,GAAG;AACnC,oBAAU;AAAA,QACd;AACA,kBAAU,WAAW,iBAAiB,EAAE;AACxC,YAAI,SAAS;AACT;AAAA,QACJ;AACA,cAAM,aAAa,GAAG,iBAAiB,MAAM;AAC7C,mBAAW,QAAQ,CAAC,SAAS;AACzB,cAAI,CAAC,SAAS;AACV,sBAAU,wBAAwB,IAAI;AAAA,UAC1C;AAAA,QACJ,CAAC;AAAA,MACL;AACA,YAAM,SAAS,CAAC,IAAqB,UAAkB,MAAY;AAC/D,YAAI,KAAK,SAAS,iBAAiB;AAC/B;AAAA,QACJ;AACA,cAAM,YAAY,kBAAkB,cAAc;AAClD,WAAG;AAAA,UACC,IAAI,YAAoC,WAAW;AAAA,YAC/C,SAAS;AAAA,YACT,UAAU;AAAA,YACV,QAAQ,EAAE,aAAa,KAAK,KAAK;AAAA,UACrC,CAAC;AAAA,QACL;AACA,YAAI,QAAQ,GAAG;AACX;AAAA,QACJ;AACA,cAAM,oBACF,KAAK,0BAA0B;AACnC,aAAK;AAAA,UACD,IAAI,MAAM,WAAW;AAAA,YACjB,SAAS;AAAA,YACT,UAAU;AAAA,UACd,CAAC;AAAA,QACL;AACA,YAAI,KAAK,kBAAkB,CAAC,mBAAmB;AAC3C,UAAC,KAAK,eAA+B;AAAA,YACjC,IAAI,YAAoC,WAAW;AAAA,cAC/C,SAAS;AAAA,cACT,UAAU;AAAA,cACV,QAAQ,EAAE,aAAa,KAAK,KAAK;AAAA,YACrC,CAAC;AAAA,UACL;AAAA,QACJ;AACA,aAAK,QAAQ,kBAAkB,WAAW;AAAA,MAC9C;AACA,WAAK,SAAS,QAAQ,CAAC,IAAI,UAAU;AACjC;AAAA,UACI;AAAA,UACA,MAAM,IAAI,KAAK;AAAA,UACf,OAAO,IAAI,KAAK;AAAA,QACpB;AAAA,MACJ,CAAC;AACD,aAAO;AAAA,IACX;AAAA,EACJ;AACA,SAAO;AACX;",
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport {\n    firstFocusableIn,\n    firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport type { SpectrumElement } from '@spectrum-web-components/base';\nimport { VirtualTrigger } from './VirtualTrigger.dev.js'\nimport { Constructor, OpenableElement } from './overlay-types.dev.js'\nimport {\n    BeforetoggleClosedEvent,\n    BeforetoggleOpenEvent,\n    forcePaint,\n    guaranteedAllTransitionend,\n    OverlayStateEvent,\n    overlayTimer,\n} from './AbstractOverlay.dev.js'\nimport type { AbstractOverlay } from './AbstractOverlay.dev.js'\nimport { userFocusableSelector } from '@spectrum-web-components/shared';\n\nexport function OverlayNoPopover<T extends Constructor<AbstractOverlay>>(\n    constructor: T\n): T & Constructor<SpectrumElement> {\n    class OverlayWithNoPopover extends constructor {\n        protected override async managePopoverOpen(): Promise<void> {\n            await this.managePosition();\n        }\n\n        protected override async manageDelay(\n            targetOpenState: boolean\n        ): Promise<void> {\n            if (targetOpenState === false || targetOpenState !== this.open) {\n                overlayTimer.close(this);\n                return;\n            }\n            if (this.delayed) {\n                const cancelled = await overlayTimer.openTimer(this);\n                if (cancelled) {\n                    this.open = !targetOpenState;\n                }\n            }\n        }\n\n        protected override async ensureOnDOM(\n            _targetOpenState: boolean\n        ): Promise<void> {\n            forcePaint();\n        }\n\n        protected override async makeTransition(\n            targetOpenState: boolean\n        ): Promise<HTMLElement | null> {\n            if (this.open !== targetOpenState) {\n                return null;\n            }\n            let focusEl = null as HTMLElement | null;\n            const start = (el: OpenableElement, index: number) => (): void => {\n                if (targetOpenState !== this.open) {\n                    return;\n                }\n                el.open = targetOpenState;\n                if (index === 0) {\n                    const event = targetOpenState\n                        ? BeforetoggleOpenEvent\n                        : BeforetoggleClosedEvent;\n                    this.dispatchEvent(new event());\n                }\n                if (targetOpenState !== true) {\n                    return;\n                }\n                if (el.matches(userFocusableSelector)) {\n                    focusEl = el;\n                }\n                focusEl = focusEl || firstFocusableIn(el);\n                if (focusEl) {\n                    return;\n                }\n                const childSlots = el.querySelectorAll('slot');\n                childSlots.forEach((slot) => {\n                    if (!focusEl) {\n                        focusEl = firstFocusableSlottedIn(slot);\n                    }\n                });\n            };\n            const finish = (el: OpenableElement, index: number) => (): void => {\n                if (this.open !== targetOpenState) {\n                    return;\n                }\n                const eventName = targetOpenState ? 'sp-opened' : 'sp-closed';\n                el.dispatchEvent(\n                    new OverlayStateEvent(eventName, this, {\n                        interaction: this.type,\n                    })\n                );\n                if (index > 0) {\n                    return;\n                }\n                const hasVirtualTrigger =\n                    this.triggerElement instanceof VirtualTrigger;\n                this.dispatchEvent(\n                    new OverlayStateEvent(eventName, this, {\n                        interaction: this.type,\n                        publish: hasVirtualTrigger,\n                    })\n                );\n                if (this.triggerElement && !hasVirtualTrigger) {\n                    (this.triggerElement as HTMLElement).dispatchEvent(\n                        new OverlayStateEvent(eventName, this, {\n                            interaction: this.type,\n                            publish: true,\n                        })\n                    );\n                }\n                this.state = targetOpenState ? 'opened' : 'closed';\n            };\n            this.elements.forEach((el, index) => {\n                guaranteedAllTransitionend(\n                    el,\n                    start(el, index),\n                    finish(el, index)\n                );\n            });\n            return focusEl;\n        }\n    }\n    return OverlayWithNoPopover;\n}\n"],
+  "mappings": ";AAWA;AAAA,EACI;AAAA,EACA;AAAA,OACG;AAEP,SAAS,sBAAsB;AAE/B;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AAEP,SAAS,6BAA6B;AAE/B,gBAAS,iBACZ,aACgC;AAAA,EAChC,MAAM,6BAA6B,YAAY;AAAA,IAC3C,MAAyB,oBAAmC;AACxD,YAAM,KAAK,eAAe;AAAA,IAC9B;AAAA,IAEA,MAAyB,YACrB,iBACa;AACb,UAAI,oBAAoB,SAAS,oBAAoB,KAAK,MAAM;AAC5D,qBAAa,MAAM,IAAI;AACvB;AAAA,MACJ;AACA,UAAI,KAAK,SAAS;AACd,cAAM,YAAY,MAAM,aAAa,UAAU,IAAI;AACnD,YAAI,WAAW;AACX,eAAK,OAAO,CAAC;AAAA,QACjB;AAAA,MACJ;AAAA,IACJ;AAAA,IAEA,MAAyB,YACrB,kBACa;AACb,iBAAW;AAAA,IACf;AAAA,IAEA,MAAyB,eACrB,iBAC2B;AAC3B,UAAI,KAAK,SAAS,iBAAiB;AAC/B,eAAO;AAAA,MACX;AACA,UAAI,UAAU;AACd,YAAM,QAAQ,CAAC,IAAqB,UAAkB,MAAY;AAC9D,YAAI,oBAAoB,KAAK,MAAM;AAC/B;AAAA,QACJ;AACA,WAAG,OAAO;AACV,YAAI,UAAU,GAAG;AACb,gBAAM,QAAQ,kBACR,wBACA;AACN,eAAK,cAAc,IAAI,MAAM,CAAC;AAAA,QAClC;AACA,YAAI,oBAAoB,MAAM;AAC1B;AAAA,QACJ;AACA,YAAI,GAAG,QAAQ,qBAAqB,GAAG;AACnC,oBAAU;AAAA,QACd;AACA,kBAAU,WAAW,iBAAiB,EAAE;AACxC,YAAI,SAAS;AACT;AAAA,QACJ;AACA,cAAM,aAAa,GAAG,iBAAiB,MAAM;AAC7C,mBAAW,QAAQ,CAAC,SAAS;AACzB,cAAI,CAAC,SAAS;AACV,sBAAU,wBAAwB,IAAI;AAAA,UAC1C;AAAA,QACJ,CAAC;AAAA,MACL;AACA,YAAM,SAAS,CAAC,IAAqB,UAAkB,MAAY;AAC/D,YAAI,KAAK,SAAS,iBAAiB;AAC/B;AAAA,QACJ;AACA,cAAM,YAAY,kBAAkB,cAAc;AAClD,WAAG;AAAA,UACC,IAAI,kBAAkB,WAAW,MAAM;AAAA,YACnC,aAAa,KAAK;AAAA,UACtB,CAAC;AAAA,QACL;AACA,YAAI,QAAQ,GAAG;AACX;AAAA,QACJ;AACA,cAAM,oBACF,KAAK,0BAA0B;AACnC,aAAK;AAAA,UACD,IAAI,kBAAkB,WAAW,MAAM;AAAA,YACnC,aAAa,KAAK;AAAA,YAClB,SAAS;AAAA,UACb,CAAC;AAAA,QACL;AACA,YAAI,KAAK,kBAAkB,CAAC,mBAAmB;AAC3C,UAAC,KAAK,eAA+B;AAAA,YACjC,IAAI,kBAAkB,WAAW,MAAM;AAAA,cACnC,aAAa,KAAK;AAAA,cAClB,SAAS;AAAA,YACb,CAAC;AAAA,UACL;AAAA,QACJ;AACA,aAAK,QAAQ,kBAAkB,WAAW;AAAA,MAC9C;AACA,WAAK,SAAS,QAAQ,CAAC,IAAI,UAAU;AACjC;AAAA,UACI;AAAA,UACA,MAAM,IAAI,KAAK;AAAA,UACf,OAAO,IAAI,KAAK;AAAA,QACpB;AAAA,MACJ,CAAC;AACD,aAAO;AAAA,IACX;AAAA,EACJ;AACA,SAAO;AACX;",
   "names": []
 }

package/src/OverlayNoPopover.js

@@ -1,2 +1,2 @@
-"use strict";import{firstFocusableIn as p,firstFocusableSlottedIn as u}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{VirtualTrigger as d}from"./VirtualTrigger.js";import{BeforetoggleClosedEvent as f,BeforetoggleOpenEvent as v,forcePaint as h,guaranteedAllTransitionend as b,overlayTimer as i}from"./AbstractOverlay.js";import{userFocusableSelector as E}from"@spectrum-web-components/shared";export function OverlayNoPopover(l){class a extends l{async managePopoverOpen(){await this.managePosition()}async manageDelay(e){if(e===!1||e!==this.open){i.close(this);return}this.delayed&&await i.openTimer(this)&&(this.open=!e)}async ensureOnDOM(e){h()}async makeTransition(e){if(this.open!==e)return null;let o=null;const c=(t,n)=>()=>{if(e!==this.open)return;if(typeof t.open!="undefined"&&(t.open=e),n===0){const r=e?v:f;this.dispatchEvent(new r)}if(e!==!0||(t.matches(E)&&(o=t),o=o||p(t),o))return;t.querySelectorAll("slot").forEach(r=>{o||(o=u(r))})},m=(t,n)=>()=>{if(this.open!==e)return;const s=e?"sp-opened":"sp-closed";if(t.dispatchEvent(new CustomEvent(s,{bubbles:!1,composed:!1,detail:{interaction:this.type}})),n>0)return;const r=this.triggerElement instanceof d;this.dispatchEvent(new Event(s,{bubbles:r,composed:r})),this.triggerElement&&!r&&this.triggerElement.dispatchEvent(new CustomEvent(s,{bubbles:!0,composed:!0,detail:{interaction:this.type}})),this.state=e?"opened":"closed"};return this.elements.forEach((t,n)=>{b(t,c(t,n),m(t,n))}),o}}return a}
+"use strict";import{firstFocusableIn as h,firstFocusableSlottedIn as u}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{VirtualTrigger as d}from"./VirtualTrigger.js";import{BeforetoggleClosedEvent as f,BeforetoggleOpenEvent as v,forcePaint as E,guaranteedAllTransitionend as y,OverlayStateEvent as s,overlayTimer as l}from"./AbstractOverlay.js";import{userFocusableSelector as b}from"@spectrum-web-components/shared";export function OverlayNoPopover(c){class a extends c{async managePopoverOpen(){await this.managePosition()}async manageDelay(e){if(e===!1||e!==this.open){l.close(this);return}this.delayed&&await l.openTimer(this)&&(this.open=!e)}async ensureOnDOM(e){E()}async makeTransition(e){if(this.open!==e)return null;let o=null;const m=(t,r)=>()=>{if(e!==this.open)return;if(t.open=e,r===0){const n=e?v:f;this.dispatchEvent(new n)}if(e!==!0||(t.matches(b)&&(o=t),o=o||h(t),o))return;t.querySelectorAll("slot").forEach(n=>{o||(o=u(n))})},p=(t,r)=>()=>{if(this.open!==e)return;const i=e?"sp-opened":"sp-closed";if(t.dispatchEvent(new s(i,this,{interaction:this.type})),r>0)return;const n=this.triggerElement instanceof d;this.dispatchEvent(new s(i,this,{interaction:this.type,publish:n})),this.triggerElement&&!n&&this.triggerElement.dispatchEvent(new s(i,this,{interaction:this.type,publish:!0})),this.state=e?"opened":"closed"};return this.elements.forEach((t,r)=>{y(t,m(t,r),p(t,r))}),o}}return a}
 //# sourceMappingURL=OverlayNoPopover.js.map

package/src/OverlayNoPopover.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["OverlayNoPopover.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport {\n    firstFocusableIn,\n    firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport type { SpectrumElement } from '@spectrum-web-components/base';\nimport { VirtualTrigger } from './VirtualTrigger.js';\nimport {\n    Constructor,\n    OpenableElement,\n    OverlayOpenCloseDetail,\n} from './overlay-types.js';\nimport {\n    BeforetoggleClosedEvent,\n    BeforetoggleOpenEvent,\n    forcePaint,\n    guaranteedAllTransitionend,\n    overlayTimer,\n} from './AbstractOverlay.js';\nimport type { AbstractOverlay } from './AbstractOverlay.js';\nimport { userFocusableSelector } from '@spectrum-web-components/shared';\n\nexport function OverlayNoPopover<T extends Constructor<AbstractOverlay>>(\n    constructor: T\n): T & Constructor<SpectrumElement> {\n    class OverlayWithNoPopover extends constructor {\n        protected override async managePopoverOpen(): Promise<void> {\n            await this.managePosition();\n        }\n\n        protected override async manageDelay(\n            targetOpenState: boolean\n        ): Promise<void> {\n            if (targetOpenState === false || targetOpenState !== this.open) {\n                overlayTimer.close(this);\n                return;\n            }\n            if (this.delayed) {\n                const cancelled = await overlayTimer.openTimer(this);\n                if (cancelled) {\n                    this.open = !targetOpenState;\n                }\n            }\n        }\n\n        protected override async ensureOnDOM(\n            _targetOpenState: boolean\n        ): Promise<void> {\n            forcePaint();\n        }\n\n        protected override async makeTransition(\n            targetOpenState: boolean\n        ): Promise<HTMLElement | null> {\n            if (this.open !== targetOpenState) {\n                return null;\n            }\n            let focusEl = null as HTMLElement | null;\n            const start = (el: OpenableElement, index: number) => (): void => {\n                if (targetOpenState !== this.open) {\n                    return;\n                }\n                if (typeof el.open !== 'undefined') {\n                    el.open = targetOpenState;\n                }\n                if (index === 0) {\n                    const event = targetOpenState\n                        ? BeforetoggleOpenEvent\n                        : BeforetoggleClosedEvent;\n                    this.dispatchEvent(new event());\n                }\n                if (targetOpenState !== true) {\n                    return;\n                }\n                if (el.matches(userFocusableSelector)) {\n                    focusEl = el;\n                }\n                focusEl = focusEl || firstFocusableIn(el);\n                if (focusEl) {\n                    return;\n                }\n                const childSlots = el.querySelectorAll('slot');\n                childSlots.forEach((slot) => {\n                    if (!focusEl) {\n                        focusEl = firstFocusableSlottedIn(slot);\n                    }\n                });\n            };\n            const finish = (el: OpenableElement, index: number) => (): void => {\n                if (this.open !== targetOpenState) {\n                    return;\n                }\n                const eventName = targetOpenState ? 'sp-opened' : 'sp-closed';\n                el.dispatchEvent(\n                    new CustomEvent<OverlayOpenCloseDetail>(eventName, {\n                        bubbles: false,\n                        composed: false,\n                        detail: { interaction: this.type },\n                    })\n                );\n                if (index > 0) {\n                    return;\n                }\n                const hasVirtualTrigger =\n                    this.triggerElement instanceof VirtualTrigger;\n                this.dispatchEvent(\n                    new Event(eventName, {\n                        bubbles: hasVirtualTrigger,\n                        composed: hasVirtualTrigger,\n                    })\n                );\n                if (this.triggerElement && !hasVirtualTrigger) {\n                    (this.triggerElement as HTMLElement).dispatchEvent(\n                        new CustomEvent<OverlayOpenCloseDetail>(eventName, {\n                            bubbles: true,\n                            composed: true,\n                            detail: { interaction: this.type },\n                        })\n                    );\n                }\n                this.state = targetOpenState ? 'opened' : 'closed';\n            };\n            this.elements.forEach((el, index) => {\n                guaranteedAllTransitionend(\n                    el,\n                    start(el, index),\n                    finish(el, index)\n                );\n            });\n            return focusEl;\n        }\n    }\n    return OverlayWithNoPopover;\n}\n"],
-  "mappings": "aAWA,OACI,oBAAAA,EACA,2BAAAC,MACG,4DAEP,OAAS,kBAAAC,MAAsB,sBAM/B,OACI,2BAAAC,EACA,yBAAAC,EACA,cAAAC,EACA,8BAAAC,EACA,gBAAAC,MACG,uBAEP,OAAS,yBAAAC,MAA6B,kCAE/B,gBAAS,iBACZC,EACgC,CAChC,MAAMC,UAA6BD,CAAY,CAC3C,MAAyB,mBAAmC,CACxD,MAAM,KAAK,eAAe,CAC9B,CAEA,MAAyB,YACrBE,EACa,CACb,GAAIA,IAAoB,IAASA,IAAoB,KAAK,KAAM,CAC5DJ,EAAa,MAAM,IAAI,EACvB,MACJ,CACI,KAAK,SACa,MAAMA,EAAa,UAAU,IAAI,IAE/C,KAAK,KAAO,CAACI,EAGzB,CAEA,MAAyB,YACrBC,EACa,CACbP,EAAW,CACf,CAEA,MAAyB,eACrBM,EAC2B,CAC3B,GAAI,KAAK,OAASA,EACd,OAAO,KAEX,IAAIE,EAAU,KACd,MAAMC,EAAQ,CAACC,EAAqBC,IAAkB,IAAY,CAC9D,GAAIL,IAAoB,KAAK,KACzB,OAKJ,GAHI,OAAOI,EAAG,MAAS,cACnBA,EAAG,KAAOJ,GAEVK,IAAU,EAAG,CACb,MAAMC,EAAQN,EACRP,EACAD,EACN,KAAK,cAAc,IAAIc,CAAO,CAClC,CAQA,GAPIN,IAAoB,KAGpBI,EAAG,QAAQP,CAAqB,IAChCK,EAAUE,GAEdF,EAAUA,GAAWb,EAAiBe,CAAE,EACpCF,GACA,OAEeE,EAAG,iBAAiB,MAAM,EAClC,QAASG,GAAS,CACpBL,IACDA,EAAUZ,EAAwBiB,CAAI,EAE9C,CAAC,CACL,EACMC,EAAS,CAACJ,EAAqBC,IAAkB,IAAY,CAC/D,GAAI,KAAK,OAASL,EACd,OAEJ,MAAMS,EAAYT,EAAkB,YAAc,YAQlD,GAPAI,EAAG,cACC,IAAI,YAAoCK,EAAW,CAC/C,QAAS,GACT,SAAU,GACV,OAAQ,CAAE,YAAa,KAAK,IAAK,CACrC,CAAC,CACL,EACIJ,EAAQ,EACR,OAEJ,MAAMK,EACF,KAAK,0BAA0BnB,EACnC,KAAK,cACD,IAAI,MAAMkB,EAAW,CACjB,QAASC,EACT,SAAUA,CACd,CAAC,CACL,EACI,KAAK,gBAAkB,CAACA,GACvB,KAAK,eAA+B,cACjC,IAAI,YAAoCD,EAAW,CAC/C,QAAS,GACT,SAAU,GACV,OAAQ,CAAE,YAAa,KAAK,IAAK,CACrC,CAAC,CACL,EAEJ,KAAK,MAAQT,EAAkB,SAAW,QAC9C,EACA,YAAK,SAAS,QAAQ,CAACI,EAAIC,IAAU,CACjCV,EACIS,EACAD,EAAMC,EAAIC,CAAK,EACfG,EAAOJ,EAAIC,CAAK,CACpB,CACJ,CAAC,EACMH,CACX,CACJ,CACA,OAAOH,CACX",
-  "names": ["firstFocusableIn", "firstFocusableSlottedIn", "VirtualTrigger", "BeforetoggleClosedEvent", "BeforetoggleOpenEvent", "forcePaint", "guaranteedAllTransitionend", "overlayTimer", "userFocusableSelector", "constructor", "OverlayWithNoPopover", "targetOpenState", "_targetOpenState", "focusEl", "start", "el", "index", "event", "slot", "finish", "eventName", "hasVirtualTrigger"]
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport {\n    firstFocusableIn,\n    firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport type { SpectrumElement } from '@spectrum-web-components/base';\nimport { VirtualTrigger } from './VirtualTrigger.js';\nimport { Constructor, OpenableElement } from './overlay-types.js';\nimport {\n    BeforetoggleClosedEvent,\n    BeforetoggleOpenEvent,\n    forcePaint,\n    guaranteedAllTransitionend,\n    OverlayStateEvent,\n    overlayTimer,\n} from './AbstractOverlay.js';\nimport type { AbstractOverlay } from './AbstractOverlay.js';\nimport { userFocusableSelector } from '@spectrum-web-components/shared';\n\nexport function OverlayNoPopover<T extends Constructor<AbstractOverlay>>(\n    constructor: T\n): T & Constructor<SpectrumElement> {\n    class OverlayWithNoPopover extends constructor {\n        protected override async managePopoverOpen(): Promise<void> {\n            await this.managePosition();\n        }\n\n        protected override async manageDelay(\n            targetOpenState: boolean\n        ): Promise<void> {\n            if (targetOpenState === false || targetOpenState !== this.open) {\n                overlayTimer.close(this);\n                return;\n            }\n            if (this.delayed) {\n                const cancelled = await overlayTimer.openTimer(this);\n                if (cancelled) {\n                    this.open = !targetOpenState;\n                }\n            }\n        }\n\n        protected override async ensureOnDOM(\n            _targetOpenState: boolean\n        ): Promise<void> {\n            forcePaint();\n        }\n\n        protected override async makeTransition(\n            targetOpenState: boolean\n        ): Promise<HTMLElement | null> {\n            if (this.open !== targetOpenState) {\n                return null;\n            }\n            let focusEl = null as HTMLElement | null;\n            const start = (el: OpenableElement, index: number) => (): void => {\n                if (targetOpenState !== this.open) {\n                    return;\n                }\n                el.open = targetOpenState;\n                if (index === 0) {\n                    const event = targetOpenState\n                        ? BeforetoggleOpenEvent\n                        : BeforetoggleClosedEvent;\n                    this.dispatchEvent(new event());\n                }\n                if (targetOpenState !== true) {\n                    return;\n                }\n                if (el.matches(userFocusableSelector)) {\n                    focusEl = el;\n                }\n                focusEl = focusEl || firstFocusableIn(el);\n                if (focusEl) {\n                    return;\n                }\n                const childSlots = el.querySelectorAll('slot');\n                childSlots.forEach((slot) => {\n                    if (!focusEl) {\n                        focusEl = firstFocusableSlottedIn(slot);\n                    }\n                });\n            };\n            const finish = (el: OpenableElement, index: number) => (): void => {\n                if (this.open !== targetOpenState) {\n                    return;\n                }\n                const eventName = targetOpenState ? 'sp-opened' : 'sp-closed';\n                el.dispatchEvent(\n                    new OverlayStateEvent(eventName, this, {\n                        interaction: this.type,\n                    })\n                );\n                if (index > 0) {\n                    return;\n                }\n                const hasVirtualTrigger =\n                    this.triggerElement instanceof VirtualTrigger;\n                this.dispatchEvent(\n                    new OverlayStateEvent(eventName, this, {\n                        interaction: this.type,\n                        publish: hasVirtualTrigger,\n                    })\n                );\n                if (this.triggerElement && !hasVirtualTrigger) {\n                    (this.triggerElement as HTMLElement).dispatchEvent(\n                        new OverlayStateEvent(eventName, this, {\n                            interaction: this.type,\n                            publish: true,\n                        })\n                    );\n                }\n                this.state = targetOpenState ? 'opened' : 'closed';\n            };\n            this.elements.forEach((el, index) => {\n                guaranteedAllTransitionend(\n                    el,\n                    start(el, index),\n                    finish(el, index)\n                );\n            });\n            return focusEl;\n        }\n    }\n    return OverlayWithNoPopover;\n}\n"],
+  "mappings": "aAWA,OACI,oBAAAA,EACA,2BAAAC,MACG,4DAEP,OAAS,kBAAAC,MAAsB,sBAE/B,OACI,2BAAAC,EACA,yBAAAC,EACA,cAAAC,EACA,8BAAAC,EACA,qBAAAC,EACA,gBAAAC,MACG,uBAEP,OAAS,yBAAAC,MAA6B,kCAE/B,gBAAS,iBACZC,EACgC,CAChC,MAAMC,UAA6BD,CAAY,CAC3C,MAAyB,mBAAmC,CACxD,MAAM,KAAK,eAAe,CAC9B,CAEA,MAAyB,YACrBE,EACa,CACb,GAAIA,IAAoB,IAASA,IAAoB,KAAK,KAAM,CAC5DJ,EAAa,MAAM,IAAI,EACvB,MACJ,CACI,KAAK,SACa,MAAMA,EAAa,UAAU,IAAI,IAE/C,KAAK,KAAO,CAACI,EAGzB,CAEA,MAAyB,YACrBC,EACa,CACbR,EAAW,CACf,CAEA,MAAyB,eACrBO,EAC2B,CAC3B,GAAI,KAAK,OAASA,EACd,OAAO,KAEX,IAAIE,EAAU,KACd,MAAMC,EAAQ,CAACC,EAAqBC,IAAkB,IAAY,CAC9D,GAAIL,IAAoB,KAAK,KACzB,OAGJ,GADAI,EAAG,KAAOJ,EACNK,IAAU,EAAG,CACb,MAAMC,EAAQN,EACRR,EACAD,EACN,KAAK,cAAc,IAAIe,CAAO,CAClC,CAQA,GAPIN,IAAoB,KAGpBI,EAAG,QAAQP,CAAqB,IAChCK,EAAUE,GAEdF,EAAUA,GAAWd,EAAiBgB,CAAE,EACpCF,GACA,OAEeE,EAAG,iBAAiB,MAAM,EAClC,QAASG,GAAS,CACpBL,IACDA,EAAUb,EAAwBkB,CAAI,EAE9C,CAAC,CACL,EACMC,EAAS,CAACJ,EAAqBC,IAAkB,IAAY,CAC/D,GAAI,KAAK,OAASL,EACd,OAEJ,MAAMS,EAAYT,EAAkB,YAAc,YAMlD,GALAI,EAAG,cACC,IAAIT,EAAkBc,EAAW,KAAM,CACnC,YAAa,KAAK,IACtB,CAAC,CACL,EACIJ,EAAQ,EACR,OAEJ,MAAMK,EACF,KAAK,0BAA0BpB,EACnC,KAAK,cACD,IAAIK,EAAkBc,EAAW,KAAM,CACnC,YAAa,KAAK,KAClB,QAASC,CACb,CAAC,CACL,EACI,KAAK,gBAAkB,CAACA,GACvB,KAAK,eAA+B,cACjC,IAAIf,EAAkBc,EAAW,KAAM,CACnC,YAAa,KAAK,KAClB,QAAS,EACb,CAAC,CACL,EAEJ,KAAK,MAAQT,EAAkB,SAAW,QAC9C,EACA,YAAK,SAAS,QAAQ,CAACI,EAAIC,IAAU,CACjCX,EACIU,EACAD,EAAMC,EAAIC,CAAK,EACfG,EAAOJ,EAAIC,CAAK,CACpB,CACJ,CAAC,EACMH,CACX,CACJ,CACA,OAAOH,CACX",
+  "names": ["firstFocusableIn", "firstFocusableSlottedIn", "VirtualTrigger", "BeforetoggleClosedEvent", "BeforetoggleOpenEvent", "forcePaint", "guaranteedAllTransitionend", "OverlayStateEvent", "overlayTimer", "userFocusableSelector", "constructor", "OverlayWithNoPopover", "targetOpenState", "_targetOpenState", "focusEl", "start", "el", "index", "event", "slot", "finish", "eventName", "hasVirtualTrigger"]
 }

package/src/OverlayPopover.dev.js

@@ -9,6 +9,7 @@ import {
   BeforetoggleOpenEvent,
   guaranteedAllTransitionend,
   nextFrame,
+  OverlayStateEvent,
   overlayTimer
 } from "./AbstractOverlay.dev.js";
 import { userFocusableSelector } from "@spectrum-web-components/shared";
@@ -91,9 +92,7 @@ export function OverlayPopover(constructor) {
       }
       let focusEl = null;
       const start = (el, index) => () => {
-        if (typeof el.open !== "undefined") {
-          el.open = targetOpenState;
-        }
+        el.open = targetOpenState;
         if (index === 0) {
           const event = targetOpenState ? BeforetoggleOpenEvent : BeforetoggleClosedEvent;
           this.dispatchEvent(new event());
@@ -122,10 +121,9 @@ export function OverlayPopover(constructor) {
         const eventName = targetOpenState ? "sp-opened" : "sp-closed";
         if (index > 0) {
           el.dispatchEvent(
-            new CustomEvent(eventName, {
-              bubbles: false,
-              composed: false,
-              detail: { interaction: this.type }
+            new OverlayStateEvent(eventName, this, {
+              interaction: this.type,
+              publish: false
             })
           );
           return;
@@ -137,28 +135,23 @@ export function OverlayPopover(constructor) {
           await nextFrame();
           const hasVirtualTrigger = this.triggerElement instanceof VirtualTrigger;
           this.dispatchEvent(
-            new Event(eventName, {
-              bubbles: hasVirtualTrigger,
-              composed: hasVirtualTrigger
+            new OverlayStateEvent(eventName, this, {
+              interaction: this.type,
+              publish: hasVirtualTrigger
             })
           );
           el.dispatchEvent(
-            new CustomEvent(eventName, {
-              bubbles: false,
-              composed: false,
-              detail: { interaction: this.type }
+            new OverlayStateEvent(eventName, this, {
+              interaction: this.type,
+              publish: false
             })
           );
           if (this.triggerElement && !hasVirtualTrigger) {
             this.triggerElement.dispatchEvent(
-              new CustomEvent(
-                eventName,
-                {
-                  bubbles: true,
-                  composed: true,
-                  detail: { interaction: this.type }
-                }
-              )
+              new OverlayStateEvent(eventName, this, {
+                interaction: this.type,
+                publish: true
+              })
             );
           }
           this.state = targetOpenState ? "opened" : "closed";

package/src/OverlayPopover.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["OverlayPopover.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport {\n    firstFocusableIn,\n    firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport type { SpectrumElement } from '@spectrum-web-components/base';\nimport { VirtualTrigger } from './VirtualTrigger.dev.js'\nimport {\n    Constructor,\n    OpenableElement,\n    OverlayOpenCloseDetail,\n} from './overlay-types.dev.js'\nimport {\n    BeforetoggleClosedEvent,\n    BeforetoggleOpenEvent,\n    guaranteedAllTransitionend,\n    nextFrame,\n    overlayTimer,\n} from './AbstractOverlay.dev.js'\nimport type { AbstractOverlay } from './AbstractOverlay.dev.js'\nimport { userFocusableSelector } from '@spectrum-web-components/shared';\n\nfunction isOpen(el: HTMLElement): boolean {\n    let popoverOpen = false;\n    try {\n        popoverOpen = el.matches(':popover-open');\n        // eslint-disable-next-line no-empty\n    } catch (error) {}\n    let open = false;\n    try {\n        open = el.matches(':open');\n        // eslint-disable-next-line no-empty\n    } catch (error) {}\n    return popoverOpen || open;\n}\n\nexport function OverlayPopover<T extends Constructor<AbstractOverlay>>(\n    constructor: T\n): T & Constructor<SpectrumElement> {\n    class OverlayWithPopover extends constructor {\n        protected override async manageDelay(\n            targetOpenState: boolean\n        ): Promise<void> {\n            if (targetOpenState === false || targetOpenState !== this.open) {\n                overlayTimer.close(this);\n                return;\n            }\n            if (this.delayed) {\n                const cancelled = await overlayTimer.openTimer(this);\n                if (cancelled) {\n                    this.open = !targetOpenState;\n                }\n            }\n        }\n\n        /**\n         * A popover should be hidden _after_ it is no longer on top-layer because\n         * the position metrics will have changed from when it was originally positioned.\n         */\n        private async shouldHidePopover(\n            targetOpenState: boolean\n        ): Promise<void> {\n            if (targetOpenState && this.open !== targetOpenState) {\n                return;\n            }\n            const update = async ({\n                newState,\n            }: { newState?: string } = {}): Promise<void> => {\n                if (newState === 'open') {\n                    return;\n                }\n                // When in a parent Overlay, this Overlay may need to position itself\n                // while closing in due to the parent _also_ closing which means the\n                // location can no longer rely on \"top layer over transform\" math.\n                await this.placementController.resetOverlayPosition();\n            };\n            if (!isOpen(this.dialogEl)) {\n                // The means the Overlay was closed from the outside, it is already off of top-layer\n                // so we need to position it in regards to this new state.\n                update();\n                return;\n            }\n            // `toggle` is an async event, so it's possible for this handler to run a frame late\n            this.dialogEl.addEventListener('toggle', update as EventListener, {\n                once: true,\n            });\n        }\n\n        private async shouldShowPopover(\n            targetOpenState: boolean\n        ): Promise<void> {\n            let popoverOpen = false;\n            try {\n                popoverOpen = this.dialogEl.matches(':popover-open');\n                // eslint-disable-next-line no-empty\n            } catch (error) {}\n            let open = false;\n            try {\n                open = this.dialogEl.matches(':open');\n                // eslint-disable-next-line no-empty\n            } catch (error) {}\n            if (\n                targetOpenState &&\n                this.open === targetOpenState &&\n                !popoverOpen &&\n                !open &&\n                this.isConnected\n            ) {\n                this.dialogEl.showPopover();\n                await this.managePosition();\n            }\n        }\n\n        protected override async ensureOnDOM(\n            targetOpenState: boolean\n        ): Promise<void> {\n            await nextFrame();\n            await this.shouldHidePopover(targetOpenState);\n            await this.shouldShowPopover(targetOpenState);\n            await nextFrame();\n        }\n\n        protected override async makeTransition(\n            targetOpenState: boolean\n        ): Promise<HTMLElement | null> {\n            if (this.open !== targetOpenState) {\n                return null;\n            }\n            let focusEl = null as HTMLElement | null;\n            const start = (el: OpenableElement, index: number) => (): void => {\n                if (typeof el.open !== 'undefined') {\n                    el.open = targetOpenState;\n                }\n                if (index === 0) {\n                    const event = targetOpenState\n                        ? BeforetoggleOpenEvent\n                        : BeforetoggleClosedEvent;\n                    this.dispatchEvent(new event());\n                }\n                if (!targetOpenState) {\n                    return;\n                }\n                if (el.matches(userFocusableSelector)) {\n                    focusEl = el;\n                }\n                focusEl = focusEl || firstFocusableIn(el);\n                if (focusEl) {\n                    return;\n                }\n                const childSlots = el.querySelectorAll('slot');\n                childSlots.forEach((slot) => {\n                    if (!focusEl) {\n                        focusEl = firstFocusableSlottedIn(slot);\n                    }\n                });\n            };\n            const finish =\n                (el: OpenableElement, index: number) =>\n                async (): Promise<void> => {\n                    if (this.open !== targetOpenState) {\n                        return;\n                    }\n                    const eventName = targetOpenState\n                        ? 'sp-opened'\n                        : 'sp-closed';\n                    if (index > 0) {\n                        el.dispatchEvent(\n                            new CustomEvent<OverlayOpenCloseDetail>(eventName, {\n                                bubbles: false,\n                                composed: false,\n                                detail: { interaction: this.type },\n                            })\n                        );\n                        return;\n                    }\n                    const reportChange = async (): Promise<void> => {\n                        if (this.open !== targetOpenState) {\n                            return;\n                        }\n                        await nextFrame();\n                        const hasVirtualTrigger =\n                            this.triggerElement instanceof VirtualTrigger;\n                        this.dispatchEvent(\n                            new Event(eventName, {\n                                bubbles: hasVirtualTrigger,\n                                composed: hasVirtualTrigger,\n                            })\n                        );\n                        el.dispatchEvent(\n                            new CustomEvent<OverlayOpenCloseDetail>(eventName, {\n                                bubbles: false,\n                                composed: false,\n                                detail: { interaction: this.type },\n                            })\n                        );\n                        if (this.triggerElement && !hasVirtualTrigger) {\n                            (this.triggerElement as HTMLElement).dispatchEvent(\n                                new CustomEvent<OverlayOpenCloseDetail>(\n                                    eventName,\n                                    {\n                                        bubbles: true,\n                                        composed: true,\n                                        detail: { interaction: this.type },\n                                    }\n                                )\n                            );\n                        }\n                        this.state = targetOpenState ? 'opened' : 'closed';\n                    };\n                    if (this.open !== targetOpenState) {\n                        return;\n                    }\n                    const open = isOpen(this.dialogEl);\n                    if (targetOpenState !== true && open && this.isConnected) {\n                        this.dialogEl.addEventListener(\n                            'beforetoggle',\n                            () => {\n                                reportChange();\n                            },\n                            { once: true }\n                        );\n                        this.dialogEl.hidePopover();\n                    } else {\n                        reportChange();\n                    }\n                };\n            this.elements.forEach((el, index) => {\n                guaranteedAllTransitionend(\n                    el,\n                    start(el, index),\n                    finish(el, index)\n                );\n            });\n            return focusEl;\n        }\n    }\n    return OverlayWithPopover;\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport {\n    firstFocusableIn,\n    firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport type { SpectrumElement } from '@spectrum-web-components/base';\nimport { VirtualTrigger } from './VirtualTrigger.dev.js'\nimport { Constructor, OpenableElement } from './overlay-types.dev.js'\nimport {\n    BeforetoggleClosedEvent,\n    BeforetoggleOpenEvent,\n    guaranteedAllTransitionend,\n    nextFrame,\n    OverlayStateEvent,\n    overlayTimer,\n} from './AbstractOverlay.dev.js'\nimport type { AbstractOverlay } from './AbstractOverlay.dev.js'\nimport { userFocusableSelector } from '@spectrum-web-components/shared';\n\nfunction isOpen(el: HTMLElement): boolean {\n    let popoverOpen = false;\n    try {\n        popoverOpen = el.matches(':popover-open');\n        // eslint-disable-next-line no-empty\n    } catch (error) {}\n    let open = false;\n    try {\n        open = el.matches(':open');\n        // eslint-disable-next-line no-empty\n    } catch (error) {}\n    return popoverOpen || open;\n}\n\nexport function OverlayPopover<T extends Constructor<AbstractOverlay>>(\n    constructor: T\n): T & Constructor<SpectrumElement> {\n    class OverlayWithPopover extends constructor {\n        protected override async manageDelay(\n            targetOpenState: boolean\n        ): Promise<void> {\n            if (targetOpenState === false || targetOpenState !== this.open) {\n                overlayTimer.close(this);\n                return;\n            }\n            if (this.delayed) {\n                const cancelled = await overlayTimer.openTimer(this);\n                if (cancelled) {\n                    this.open = !targetOpenState;\n                }\n            }\n        }\n\n        /**\n         * A popover should be hidden _after_ it is no longer on top-layer because\n         * the position metrics will have changed from when it was originally positioned.\n         */\n        private async shouldHidePopover(\n            targetOpenState: boolean\n        ): Promise<void> {\n            if (targetOpenState && this.open !== targetOpenState) {\n                return;\n            }\n            const update = async ({\n                newState,\n            }: { newState?: string } = {}): Promise<void> => {\n                if (newState === 'open') {\n                    return;\n                }\n                // When in a parent Overlay, this Overlay may need to position itself\n                // while closing in due to the parent _also_ closing which means the\n                // location can no longer rely on \"top layer over transform\" math.\n                await this.placementController.resetOverlayPosition();\n            };\n            if (!isOpen(this.dialogEl)) {\n                // The means the Overlay was closed from the outside, it is already off of top-layer\n                // so we need to position it in regards to this new state.\n                update();\n                return;\n            }\n            // `toggle` is an async event, so it's possible for this handler to run a frame late\n            this.dialogEl.addEventListener('toggle', update as EventListener, {\n                once: true,\n            });\n        }\n\n        private async shouldShowPopover(\n            targetOpenState: boolean\n        ): Promise<void> {\n            let popoverOpen = false;\n            try {\n                popoverOpen = this.dialogEl.matches(':popover-open');\n                // eslint-disable-next-line no-empty\n            } catch (error) {}\n            let open = false;\n            try {\n                open = this.dialogEl.matches(':open');\n                // eslint-disable-next-line no-empty\n            } catch (error) {}\n            if (\n                targetOpenState &&\n                this.open === targetOpenState &&\n                !popoverOpen &&\n                !open &&\n                this.isConnected\n            ) {\n                this.dialogEl.showPopover();\n                await this.managePosition();\n            }\n        }\n\n        protected override async ensureOnDOM(\n            targetOpenState: boolean\n        ): Promise<void> {\n            await nextFrame();\n            await this.shouldHidePopover(targetOpenState);\n            await this.shouldShowPopover(targetOpenState);\n            await nextFrame();\n        }\n\n        protected override async makeTransition(\n            targetOpenState: boolean\n        ): Promise<HTMLElement | null> {\n            if (this.open !== targetOpenState) {\n                return null;\n            }\n            let focusEl = null as HTMLElement | null;\n            const start = (el: OpenableElement, index: number) => (): void => {\n                el.open = targetOpenState;\n                if (index === 0) {\n                    const event = targetOpenState\n                        ? BeforetoggleOpenEvent\n                        : BeforetoggleClosedEvent;\n                    this.dispatchEvent(new event());\n                }\n                if (!targetOpenState) {\n                    return;\n                }\n                if (el.matches(userFocusableSelector)) {\n                    focusEl = el;\n                }\n                focusEl = focusEl || firstFocusableIn(el);\n                if (focusEl) {\n                    return;\n                }\n                const childSlots = el.querySelectorAll('slot');\n                childSlots.forEach((slot) => {\n                    if (!focusEl) {\n                        focusEl = firstFocusableSlottedIn(slot);\n                    }\n                });\n            };\n            const finish =\n                (el: OpenableElement, index: number) =>\n                async (): Promise<void> => {\n                    if (this.open !== targetOpenState) {\n                        return;\n                    }\n                    const eventName = targetOpenState\n                        ? 'sp-opened'\n                        : 'sp-closed';\n                    if (index > 0) {\n                        el.dispatchEvent(\n                            new OverlayStateEvent(eventName, this, {\n                                interaction: this.type,\n                                publish: false,\n                            })\n                        );\n                        return;\n                    }\n                    const reportChange = async (): Promise<void> => {\n                        if (this.open !== targetOpenState) {\n                            return;\n                        }\n                        await nextFrame();\n                        const hasVirtualTrigger =\n                            this.triggerElement instanceof VirtualTrigger;\n                        this.dispatchEvent(\n                            new OverlayStateEvent(eventName, this, {\n                                interaction: this.type,\n                                publish: hasVirtualTrigger,\n                            })\n                        );\n                        el.dispatchEvent(\n                            new OverlayStateEvent(eventName, this, {\n                                interaction: this.type,\n                                publish: false,\n                            })\n                        );\n                        if (this.triggerElement && !hasVirtualTrigger) {\n                            (this.triggerElement as HTMLElement).dispatchEvent(\n                                new OverlayStateEvent(eventName, this, {\n                                    interaction: this.type,\n                                    publish: true,\n                                })\n                            );\n                        }\n                        this.state = targetOpenState ? 'opened' : 'closed';\n                    };\n                    if (this.open !== targetOpenState) {\n                        return;\n                    }\n                    const open = isOpen(this.dialogEl);\n                    if (targetOpenState !== true && open && this.isConnected) {\n                        this.dialogEl.addEventListener(\n                            'beforetoggle',\n                            () => {\n                                reportChange();\n                            },\n                            { once: true }\n                        );\n                        this.dialogEl.hidePopover();\n                    } else {\n                        reportChange();\n                    }\n                };\n            this.elements.forEach((el, index) => {\n                guaranteedAllTransitionend(\n                    el,\n                    start(el, index),\n                    finish(el, index)\n                );\n            });\n            return focusEl;\n        }\n    }\n    return OverlayWithPopover;\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/src/OverlayPopover.js

@@ -1,2 +1,2 @@
-"use strict";import{firstFocusableIn as f,firstFocusableSlottedIn as E}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{VirtualTrigger as b}from"./VirtualTrigger.js";import{BeforetoggleClosedEvent as y,BeforetoggleOpenEvent as w,guaranteedAllTransitionend as P,nextFrame as h,overlayTimer as m}from"./AbstractOverlay.js";import{userFocusableSelector as g}from"@spectrum-web-components/shared";function u(l){let a=!1;try{a=l.matches(":popover-open")}catch(e){}let c=!1;try{c=l.matches(":open")}catch(e){}return a||c}export function OverlayPopover(l){class a extends l{async manageDelay(e){if(e===!1||e!==this.open){m.close(this);return}this.delayed&&await m.openTimer(this)&&(this.open=!e)}async shouldHidePopover(e){if(e&&this.open!==e)return;const o=async({newState:i}={})=>{i!=="open"&&await this.placementController.resetOverlayPosition()};if(!u(this.dialogEl)){o();return}this.dialogEl.addEventListener("toggle",o,{once:!0})}async shouldShowPopover(e){let o=!1;try{o=this.dialogEl.matches(":popover-open")}catch(p){}let i=!1;try{i=this.dialogEl.matches(":open")}catch(p){}e&&this.open===e&&!o&&!i&&this.isConnected&&(this.dialogEl.showPopover(),await this.managePosition())}async ensureOnDOM(e){await h(),await this.shouldHidePopover(e),await this.shouldShowPopover(e),await h()}async makeTransition(e){if(this.open!==e)return null;let o=null;const i=(t,s)=>()=>{if(typeof t.open!="undefined"&&(t.open=e),s===0){const r=e?w:y;this.dispatchEvent(new r)}if(!e||(t.matches(g)&&(o=t),o=o||f(t),o))return;t.querySelectorAll("slot").forEach(r=>{o||(o=E(r))})},p=(t,s)=>async()=>{if(this.open!==e)return;const n=e?"sp-opened":"sp-closed";if(s>0){t.dispatchEvent(new CustomEvent(n,{bubbles:!1,composed:!1,detail:{interaction:this.type}}));return}const r=async()=>{if(this.open!==e)return;await h();const d=this.triggerElement instanceof b;this.dispatchEvent(new Event(n,{bubbles:d,composed:d})),t.dispatchEvent(new CustomEvent(n,{bubbles:!1,composed:!1,detail:{interaction:this.type}})),this.triggerElement&&!d&&this.triggerElement.dispatchEvent(new CustomEvent(n,{bubbles:!0,composed:!0,detail:{interaction:this.type}})),this.state=e?"opened":"closed"};if(this.open!==e)return;const v=u(this.dialogEl);e!==!0&&v&&this.isConnected?(this.dialogEl.addEventListener("beforetoggle",()=>{r()},{once:!0}),this.dialogEl.hidePopover()):r()};return this.elements.forEach((t,s)=>{P(t,i(t,s),p(t,s))}),o}}return a}
+"use strict";import{firstFocusableIn as E,firstFocusableSlottedIn as y}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{VirtualTrigger as b}from"./VirtualTrigger.js";import{BeforetoggleClosedEvent as w,BeforetoggleOpenEvent as P,guaranteedAllTransitionend as g,nextFrame as d,OverlayStateEvent as c,overlayTimer as u}from"./AbstractOverlay.js";import{userFocusableSelector as T}from"@spectrum-web-components/shared";function v(l){let a=!1;try{a=l.matches(":popover-open")}catch(e){}let h=!1;try{h=l.matches(":open")}catch(e){}return a||h}export function OverlayPopover(l){class a extends l{async manageDelay(e){if(e===!1||e!==this.open){u.close(this);return}this.delayed&&await u.openTimer(this)&&(this.open=!e)}async shouldHidePopover(e){if(e&&this.open!==e)return;const o=async({newState:i}={})=>{i!=="open"&&await this.placementController.resetOverlayPosition()};if(!v(this.dialogEl)){o();return}this.dialogEl.addEventListener("toggle",o,{once:!0})}async shouldShowPopover(e){let o=!1;try{o=this.dialogEl.matches(":popover-open")}catch(p){}let i=!1;try{i=this.dialogEl.matches(":open")}catch(p){}e&&this.open===e&&!o&&!i&&this.isConnected&&(this.dialogEl.showPopover(),await this.managePosition())}async ensureOnDOM(e){await d(),await this.shouldHidePopover(e),await this.shouldShowPopover(e),await d()}async makeTransition(e){if(this.open!==e)return null;let o=null;const i=(t,r)=>()=>{if(t.open=e,r===0){const s=e?P:w;this.dispatchEvent(new s)}if(!e||(t.matches(T)&&(o=t),o=o||E(t),o))return;t.querySelectorAll("slot").forEach(s=>{o||(o=y(s))})},p=(t,r)=>async()=>{if(this.open!==e)return;const n=e?"sp-opened":"sp-closed";if(r>0){t.dispatchEvent(new c(n,this,{interaction:this.type,publish:!1}));return}const s=async()=>{if(this.open!==e)return;await d();const m=this.triggerElement instanceof b;this.dispatchEvent(new c(n,this,{interaction:this.type,publish:m})),t.dispatchEvent(new c(n,this,{interaction:this.type,publish:!1})),this.triggerElement&&!m&&this.triggerElement.dispatchEvent(new c(n,this,{interaction:this.type,publish:!0})),this.state=e?"opened":"closed"};if(this.open!==e)return;const f=v(this.dialogEl);e!==!0&&f&&this.isConnected?(this.dialogEl.addEventListener("beforetoggle",()=>{s()},{once:!0}),this.dialogEl.hidePopover()):s()};return this.elements.forEach((t,r)=>{g(t,i(t,r),p(t,r))}),o}}return a}
 //# sourceMappingURL=OverlayPopover.js.map