@spectrum-web-components/overlay 0.0.0-20241209155954

package/src/ClickController.dev.js

@@ -0,0 +1,42 @@
+"use strict";
+import {
+  InteractionController,
+  InteractionTypes
+} from "./InteractionController.dev.js";
+export class ClickController extends InteractionController {
+  constructor() {
+    super(...arguments);
+    this.type = InteractionTypes.click;
+    /**
+     * An overlay with a `click` interaction should not close on click `triggerElement`.
+     * When a click is initiated (`pointerdown`), apply `preventNextToggle` when the
+     * overlay is `open` to prevent from toggling the overlay when the click event
+     * propagates later in the interaction.
+     */
+    this.preventNextToggle = false;
+  }
+  handleClick() {
+    if (!this.preventNextToggle) {
+      this.open = !this.open;
+    }
+    this.preventNextToggle = false;
+  }
+  handlePointerdown() {
+    this.preventNextToggle = this.open;
+  }
+  init() {
+    var _a;
+    (_a = this.abortController) == null ? void 0 : _a.abort();
+    this.abortController = new AbortController();
+    const { signal } = this.abortController;
+    this.target.addEventListener("click", () => this.handleClick(), {
+      signal
+    });
+    this.target.addEventListener(
+      "pointerdown",
+      () => this.handlePointerdown(),
+      { signal }
+    );
+  }
+}
+//# sourceMappingURL=ClickController.dev.js.map

package/src/ClickController.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["ClickController.ts"],
+  "sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport {\n    InteractionController,\n    InteractionTypes,\n} from './InteractionController.dev.js'\n\nexport class ClickController extends InteractionController {\n    override type = InteractionTypes.click;\n\n    /**\n     * An overlay with a `click` interaction should not close on click `triggerElement`.\n     * When a click is initiated (`pointerdown`), apply `preventNextToggle` when the\n     * overlay is `open` to prevent from toggling the overlay when the click event\n     * propagates later in the interaction.\n     */\n    private preventNextToggle = false;\n\n    handleClick(): void {\n        if (!this.preventNextToggle) {\n            this.open = !this.open;\n        }\n        this.preventNextToggle = false;\n    }\n\n    handlePointerdown(): void {\n        this.preventNextToggle = this.open;\n    }\n\n    override init(): void {\n        // Clean up listeners if they've already been bound\n        this.abortController?.abort();\n        this.abortController = new AbortController();\n        const { signal } = this.abortController;\n        this.target.addEventListener('click', () => this.handleClick(), {\n            signal,\n        });\n        this.target.addEventListener(\n            'pointerdown',\n            () => this.handlePointerdown(),\n            { signal }\n        );\n    }\n}\n"],
+  "mappings": ";AAYA;AAAA,EACI;AAAA,EACA;AAAA,OACG;AAEA,aAAM,wBAAwB,sBAAsB;AAAA,EAApD;AAAA;AACH,SAAS,OAAO,iBAAiB;AAQjC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAAQ,oBAAoB;AAAA;AAAA,EAE5B,cAAoB;AAChB,QAAI,CAAC,KAAK,mBAAmB;AACzB,WAAK,OAAO,CAAC,KAAK;AAAA,IACtB;AACA,SAAK,oBAAoB;AAAA,EAC7B;AAAA,EAEA,oBAA0B;AACtB,SAAK,oBAAoB,KAAK;AAAA,EAClC;AAAA,EAES,OAAa;AAvC1B;AAyCQ,eAAK,oBAAL,mBAAsB;AACtB,SAAK,kBAAkB,IAAI,gBAAgB;AAC3C,UAAM,EAAE,OAAO,IAAI,KAAK;AACxB,SAAK,OAAO,iBAAiB,SAAS,MAAM,KAAK,YAAY,GAAG;AAAA,MAC5D;AAAA,IACJ,CAAC;AACD,SAAK,OAAO;AAAA,MACR;AAAA,MACA,MAAM,KAAK,kBAAkB;AAAA,MAC7B,EAAE,OAAO;AAAA,IACb;AAAA,EACJ;AACJ;",
+  "names": []
+}

package/src/ClickController.js

@@ -0,0 +1,2 @@
+"use strict";import{InteractionController as o,InteractionTypes as r}from"./InteractionController.js";export class ClickController extends o{constructor(){super(...arguments);this.type=r.click;this.preventNextToggle=!1}handleClick(){this.preventNextToggle||(this.open=!this.open),this.preventNextToggle=!1}handlePointerdown(){this.preventNextToggle=this.open}init(){var t;(t=this.abortController)==null||t.abort(),this.abortController=new AbortController;const{signal:e}=this.abortController;this.target.addEventListener("click",()=>this.handleClick(),{signal:e}),this.target.addEventListener("pointerdown",()=>this.handlePointerdown(),{signal:e})}}
+//# sourceMappingURL=ClickController.js.map

package/src/ClickController.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["ClickController.ts"],
+  "sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport {\n    InteractionController,\n    InteractionTypes,\n} from './InteractionController.js';\n\nexport class ClickController extends InteractionController {\n    override type = InteractionTypes.click;\n\n    /**\n     * An overlay with a `click` interaction should not close on click `triggerElement`.\n     * When a click is initiated (`pointerdown`), apply `preventNextToggle` when the\n     * overlay is `open` to prevent from toggling the overlay when the click event\n     * propagates later in the interaction.\n     */\n    private preventNextToggle = false;\n\n    handleClick(): void {\n        if (!this.preventNextToggle) {\n            this.open = !this.open;\n        }\n        this.preventNextToggle = false;\n    }\n\n    handlePointerdown(): void {\n        this.preventNextToggle = this.open;\n    }\n\n    override init(): void {\n        // Clean up listeners if they've already been bound\n        this.abortController?.abort();\n        this.abortController = new AbortController();\n        const { signal } = this.abortController;\n        this.target.addEventListener('click', () => this.handleClick(), {\n            signal,\n        });\n        this.target.addEventListener(\n            'pointerdown',\n            () => this.handlePointerdown(),\n            { signal }\n        );\n    }\n}\n"],
+  "mappings": "aAYA,OACI,yBAAAA,EACA,oBAAAC,MACG,6BAEA,aAAM,wBAAwBD,CAAsB,CAApD,kCACH,KAAS,KAAOC,EAAiB,MAQjC,KAAQ,kBAAoB,GAE5B,aAAoB,CACX,KAAK,oBACN,KAAK,KAAO,CAAC,KAAK,MAEtB,KAAK,kBAAoB,EAC7B,CAEA,mBAA0B,CACtB,KAAK,kBAAoB,KAAK,IAClC,CAES,MAAa,CAvC1B,IAAAC,GAyCQA,EAAA,KAAK,kBAAL,MAAAA,EAAsB,QACtB,KAAK,gBAAkB,IAAI,gBAC3B,KAAM,CAAE,OAAAC,CAAO,EAAI,KAAK,gBACxB,KAAK,OAAO,iBAAiB,QAAS,IAAM,KAAK,YAAY,EAAG,CAC5D,OAAAA,CACJ,CAAC,EACD,KAAK,OAAO,iBACR,cACA,IAAM,KAAK,kBAAkB,EAC7B,CAAE,OAAAA,CAAO,CACb,CACJ,CACJ",
+  "names": ["InteractionController", "InteractionTypes", "_a", "signal"]
+}

package/src/HoverController.d.ts

@@ -0,0 +1,20 @@
+import { InteractionController, InteractionTypes } from './InteractionController.js';
+export declare class HoverController extends InteractionController {
+    type: InteractionTypes;
+    private elementIds;
+    focusedin: boolean;
+    private hoverTimeout?;
+    pointerentered: boolean;
+    handleTargetFocusin(): void;
+    handleTargetFocusout(): void;
+    handleTargetPointerenter(): void;
+    handleTargetPointerleave(): void;
+    handleHostPointerenter(): void;
+    handleHostPointerleave(): void;
+    prepareDescription(): void;
+    private prepareOverlayRelativeDescription;
+    private prepareContentRelativeDescription;
+    protected doPointerleave(): void;
+    init(): void;
+    initOverlay(): void;
+}

package/src/HoverController.dev.js

@@ -0,0 +1,153 @@
+"use strict";
+import { conditionAttributeWithId } from "@spectrum-web-components/base/src/condition-attribute-with-id.js";
+import { randomID } from "@spectrum-web-components/shared/src/random-id.js";
+import {
+  InteractionController,
+  InteractionTypes
+} from "./InteractionController.dev.js";
+import { noop } from "./AbstractOverlay.dev.js";
+const HOVER_DELAY = 300;
+export class HoverController extends InteractionController {
+  constructor() {
+    super(...arguments);
+    this.type = InteractionTypes.hover;
+    this.elementIds = [];
+    this.focusedin = false;
+    this.pointerentered = false;
+  }
+  handleTargetFocusin() {
+    if (!this.target.matches(":focus-visible")) {
+      return;
+    }
+    this.open = true;
+    this.focusedin = true;
+  }
+  handleTargetFocusout() {
+    this.focusedin = false;
+    if (this.pointerentered) return;
+    this.open = false;
+  }
+  handleTargetPointerenter() {
+    var _a;
+    if (this.hoverTimeout) {
+      clearTimeout(this.hoverTimeout);
+      this.hoverTimeout = void 0;
+    }
+    if ((_a = this.overlay) == null ? void 0 : _a.disabled) return;
+    this.open = true;
+    this.pointerentered = true;
+  }
+  handleTargetPointerleave() {
+    this.doPointerleave();
+  }
+  // set a timeout once the pointer enters and the overlay is shown
+  // give the user time to enter the overlay
+  handleHostPointerenter() {
+    if (this.hoverTimeout) {
+      clearTimeout(this.hoverTimeout);
+      this.hoverTimeout = void 0;
+    }
+  }
+  handleHostPointerleave() {
+    this.doPointerleave();
+  }
+  prepareDescription() {
+    if (!this.overlay.elements.length) return;
+    const triggerRoot = this.target.getRootNode();
+    const contentRoot = this.overlay.elements[0].getRootNode();
+    const overlayRoot = this.overlay.getRootNode();
+    if (triggerRoot === overlayRoot) {
+      this.prepareOverlayRelativeDescription();
+    } else if (triggerRoot === contentRoot) {
+      this.prepareContentRelativeDescription();
+    }
+  }
+  prepareOverlayRelativeDescription() {
+    const releaseDescription = conditionAttributeWithId(
+      this.target,
+      "aria-describedby",
+      [this.overlay.id]
+    );
+    this.releaseDescription = () => {
+      releaseDescription();
+      this.releaseDescription = noop;
+    };
+  }
+  prepareContentRelativeDescription() {
+    const elementIds = [];
+    const appliedIds = this.overlay.elements.map((el) => {
+      elementIds.push(el.id);
+      if (!el.id) {
+        el.id = `${this.overlay.tagName.toLowerCase()}-helper-${randomID()}`;
+      }
+      return el.id;
+    });
+    this.elementIds = elementIds;
+    const releaseDescription = conditionAttributeWithId(
+      this.target,
+      "aria-describedby",
+      appliedIds
+    );
+    this.releaseDescription = () => {
+      releaseDescription();
+      this.overlay.elements.map((el, index) => {
+        el.id = this.elementIds[index];
+      });
+      this.releaseDescription = noop;
+    };
+  }
+  doPointerleave() {
+    this.pointerentered = false;
+    const triggerElement = this.target;
+    if (this.focusedin && triggerElement.matches(":focus-visible")) return;
+    this.hoverTimeout = setTimeout(() => {
+      this.open = false;
+    }, HOVER_DELAY);
+  }
+  init() {
+    var _a;
+    (_a = this.abortController) == null ? void 0 : _a.abort();
+    this.abortController = new AbortController();
+    const { signal } = this.abortController;
+    this.target.addEventListener(
+      "focusin",
+      () => this.handleTargetFocusin(),
+      { signal }
+    );
+    this.target.addEventListener(
+      "focusout",
+      () => this.handleTargetFocusout(),
+      { signal }
+    );
+    this.target.addEventListener(
+      "pointerenter",
+      () => this.handleTargetPointerenter(),
+      { signal }
+    );
+    this.target.addEventListener(
+      "pointerleave",
+      () => this.handleTargetPointerleave(),
+      { signal }
+    );
+    if (this.overlay) {
+      this.initOverlay();
+    }
+  }
+  initOverlay() {
+    if (!this.abortController) {
+      return;
+    }
+    const { signal } = this.abortController;
+    this.overlay.addEventListener(
+      "pointerenter",
+      () => this.handleHostPointerenter(),
+      { signal }
+    );
+    this.overlay.addEventListener(
+      "pointerleave",
+      () => this.handleHostPointerleave(),
+      { signal }
+    );
+  }
+}
+//# sourceMappingURL=HoverController.dev.js.map

package/src/HoverController.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["HoverController.ts"],
+  "sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport { conditionAttributeWithId } from '@spectrum-web-components/base/src/condition-attribute-with-id.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport {\n    InteractionController,\n    InteractionTypes,\n} from './InteractionController.dev.js'\nimport { noop } from './AbstractOverlay.dev.js'\n\nconst HOVER_DELAY = 300;\n\nexport class HoverController extends InteractionController {\n    override type = InteractionTypes.hover;\n\n    private elementIds: string[] = [];\n\n    focusedin = false;\n\n    private hoverTimeout?: ReturnType<typeof setTimeout>;\n\n    pointerentered = false;\n\n    handleTargetFocusin(): void {\n        if (!this.target.matches(':focus-visible')) {\n            return;\n        }\n        this.open = true;\n        this.focusedin = true;\n    }\n\n    handleTargetFocusout(): void {\n        this.focusedin = false;\n        if (this.pointerentered) return;\n        this.open = false;\n    }\n\n    handleTargetPointerenter(): void {\n        if (this.hoverTimeout) {\n            clearTimeout(this.hoverTimeout);\n            this.hoverTimeout = undefined;\n        }\n        if (this.overlay?.disabled) return;\n        this.open = true;\n        this.pointerentered = true;\n    }\n\n    handleTargetPointerleave(): void {\n        this.doPointerleave();\n    }\n\n    // set a timeout once the pointer enters and the overlay is shown\n    // give the user time to enter the overlay\n    handleHostPointerenter(): void {\n        if (this.hoverTimeout) {\n            clearTimeout(this.hoverTimeout);\n            this.hoverTimeout = undefined;\n        }\n    }\n\n    handleHostPointerleave(): void {\n        this.doPointerleave();\n    }\n\n    override prepareDescription(): void {\n        // require \"content\" to apply relationship\n        if (!this.overlay.elements.length) return;\n\n        const triggerRoot = this.target.getRootNode();\n        const contentRoot = this.overlay.elements[0].getRootNode();\n        const overlayRoot = this.overlay.getRootNode();\n        if (triggerRoot === overlayRoot) {\n            this.prepareOverlayRelativeDescription();\n        } else if (triggerRoot === contentRoot) {\n            this.prepareContentRelativeDescription();\n        }\n    }\n\n    private prepareOverlayRelativeDescription(): void {\n        const releaseDescription = conditionAttributeWithId(\n            this.target,\n            'aria-describedby',\n            [this.overlay.id]\n        );\n        this.releaseDescription = () => {\n            releaseDescription();\n            this.releaseDescription = noop;\n        };\n    }\n\n    private prepareContentRelativeDescription(): void {\n        const elementIds: string[] = [];\n        const appliedIds = this.overlay.elements.map((el) => {\n            elementIds.push(el.id);\n            if (!el.id) {\n                el.id = `${this.overlay.tagName.toLowerCase()}-helper-${randomID()}`;\n            }\n            return el.id;\n        });\n        this.elementIds = elementIds;\n        const releaseDescription = conditionAttributeWithId(\n            this.target,\n            'aria-describedby',\n            appliedIds\n        );\n        this.releaseDescription = () => {\n            releaseDescription();\n            this.overlay.elements.map((el, index) => {\n                el.id = this.elementIds[index];\n            });\n            this.releaseDescription = noop;\n        };\n    }\n\n    protected doPointerleave(): void {\n        this.pointerentered = false;\n        const triggerElement = this.target as HTMLElement;\n        if (this.focusedin && triggerElement.matches(':focus-visible')) return;\n\n        this.hoverTimeout = setTimeout(() => {\n            this.open = false;\n        }, HOVER_DELAY);\n    }\n\n    override init(): void {\n        // Clean up listeners if they've already been bound\n        this.abortController?.abort();\n        this.abortController = new AbortController();\n        const { signal } = this.abortController;\n        this.target.addEventListener(\n            'focusin',\n            () => this.handleTargetFocusin(),\n            { signal }\n        );\n        this.target.addEventListener(\n            'focusout',\n            () => this.handleTargetFocusout(),\n            { signal }\n        );\n        this.target.addEventListener(\n            'pointerenter',\n            () => this.handleTargetPointerenter(),\n            { signal }\n        );\n        this.target.addEventListener(\n            'pointerleave',\n            () => this.handleTargetPointerleave(),\n            { signal }\n        );\n        if (this.overlay) {\n            this.initOverlay();\n        }\n    }\n\n    override initOverlay(): void {\n        if (!this.abortController) {\n            return;\n        }\n        const { signal } = this.abortController;\n        this.overlay.addEventListener(\n            'pointerenter',\n            () => this.handleHostPointerenter(),\n            { signal }\n        );\n        this.overlay.addEventListener(\n            'pointerleave',\n            () => this.handleHostPointerleave(),\n            { signal }\n        );\n    }\n}\n"],
+  "mappings": ";AAYA,SAAS,gCAAgC;AACzC,SAAS,gBAAgB;AAEzB;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,YAAY;AAErB,MAAM,cAAc;AAEb,aAAM,wBAAwB,sBAAsB;AAAA,EAApD;AAAA;AACH,SAAS,OAAO,iBAAiB;AAEjC,SAAQ,aAAuB,CAAC;AAEhC,qBAAY;AAIZ,0BAAiB;AAAA;AAAA,EAEjB,sBAA4B;AACxB,QAAI,CAAC,KAAK,OAAO,QAAQ,gBAAgB,GAAG;AACxC;AAAA,IACJ;AACA,SAAK,OAAO;AACZ,SAAK,YAAY;AAAA,EACrB;AAAA,EAEA,uBAA6B;AACzB,SAAK,YAAY;AACjB,QAAI,KAAK,eAAgB;AACzB,SAAK,OAAO;AAAA,EAChB;AAAA,EAEA,2BAAiC;AAhDrC;AAiDQ,QAAI,KAAK,cAAc;AACnB,mBAAa,KAAK,YAAY;AAC9B,WAAK,eAAe;AAAA,IACxB;AACA,SAAI,UAAK,YAAL,mBAAc,SAAU;AAC5B,SAAK,OAAO;AACZ,SAAK,iBAAiB;AAAA,EAC1B;AAAA,EAEA,2BAAiC;AAC7B,SAAK,eAAe;AAAA,EACxB;AAAA;AAAA;AAAA,EAIA,yBAA+B;AAC3B,QAAI,KAAK,cAAc;AACnB,mBAAa,KAAK,YAAY;AAC9B,WAAK,eAAe;AAAA,IACxB;AAAA,EACJ;AAAA,EAEA,yBAA+B;AAC3B,SAAK,eAAe;AAAA,EACxB;AAAA,EAES,qBAA2B;AAEhC,QAAI,CAAC,KAAK,QAAQ,SAAS,OAAQ;AAEnC,UAAM,cAAc,KAAK,OAAO,YAAY;AAC5C,UAAM,cAAc,KAAK,QAAQ,SAAS,CAAC,EAAE,YAAY;AACzD,UAAM,cAAc,KAAK,QAAQ,YAAY;AAC7C,QAAI,gBAAgB,aAAa;AAC7B,WAAK,kCAAkC;AAAA,IAC3C,WAAW,gBAAgB,aAAa;AACpC,WAAK,kCAAkC;AAAA,IAC3C;AAAA,EACJ;AAAA,EAEQ,oCAA0C;AAC9C,UAAM,qBAAqB;AAAA,MACvB,KAAK;AAAA,MACL;AAAA,MACA,CAAC,KAAK,QAAQ,EAAE;AAAA,IACpB;AACA,SAAK,qBAAqB,MAAM;AAC5B,yBAAmB;AACnB,WAAK,qBAAqB;AAAA,IAC9B;AAAA,EACJ;AAAA,EAEQ,oCAA0C;AAC9C,UAAM,aAAuB,CAAC;AAC9B,UAAM,aAAa,KAAK,QAAQ,SAAS,IAAI,CAAC,OAAO;AACjD,iBAAW,KAAK,GAAG,EAAE;AACrB,UAAI,CAAC,GAAG,IAAI;AACR,WAAG,KAAK,GAAG,KAAK,QAAQ,QAAQ,YAAY,CAAC,WAAW,SAAS,CAAC;AAAA,MACtE;AACA,aAAO,GAAG;AAAA,IACd,CAAC;AACD,SAAK,aAAa;AAClB,UAAM,qBAAqB;AAAA,MACvB,KAAK;AAAA,MACL;AAAA,MACA;AAAA,IACJ;AACA,SAAK,qBAAqB,MAAM;AAC5B,yBAAmB;AACnB,WAAK,QAAQ,SAAS,IAAI,CAAC,IAAI,UAAU;AACrC,WAAG,KAAK,KAAK,WAAW,KAAK;AAAA,MACjC,CAAC;AACD,WAAK,qBAAqB;AAAA,IAC9B;AAAA,EACJ;AAAA,EAEU,iBAAuB;AAC7B,SAAK,iBAAiB;AACtB,UAAM,iBAAiB,KAAK;AAC5B,QAAI,KAAK,aAAa,eAAe,QAAQ,gBAAgB,EAAG;AAEhE,SAAK,eAAe,WAAW,MAAM;AACjC,WAAK,OAAO;AAAA,IAChB,GAAG,WAAW;AAAA,EAClB;AAAA,EAES,OAAa;AAvI1B;AAyIQ,eAAK,oBAAL,mBAAsB;AACtB,SAAK,kBAAkB,IAAI,gBAAgB;AAC3C,UAAM,EAAE,OAAO,IAAI,KAAK;AACxB,SAAK,OAAO;AAAA,MACR;AAAA,MACA,MAAM,KAAK,oBAAoB;AAAA,MAC/B,EAAE,OAAO;AAAA,IACb;AACA,SAAK,OAAO;AAAA,MACR;AAAA,MACA,MAAM,KAAK,qBAAqB;AAAA,MAChC,EAAE,OAAO;AAAA,IACb;AACA,SAAK,OAAO;AAAA,MACR;AAAA,MACA,MAAM,KAAK,yBAAyB;AAAA,MACpC,EAAE,OAAO;AAAA,IACb;AACA,SAAK,OAAO;AAAA,MACR;AAAA,MACA,MAAM,KAAK,yBAAyB;AAAA,MACpC,EAAE,OAAO;AAAA,IACb;AACA,QAAI,KAAK,SAAS;AACd,WAAK,YAAY;AAAA,IACrB;AAAA,EACJ;AAAA,EAES,cAAoB;AACzB,QAAI,CAAC,KAAK,iBAAiB;AACvB;AAAA,IACJ;AACA,UAAM,EAAE,OAAO,IAAI,KAAK;AACxB,SAAK,QAAQ;AAAA,MACT;AAAA,MACA,MAAM,KAAK,uBAAuB;AAAA,MAClC,EAAE,OAAO;AAAA,IACb;AACA,SAAK,QAAQ;AAAA,MACT;AAAA,MACA,MAAM,KAAK,uBAAuB;AAAA,MAClC,EAAE,OAAO;AAAA,IACb;AAAA,EACJ;AACJ;",
+  "names": []
+}

package/src/HoverController.js

@@ -0,0 +1,2 @@
+"use strict";import{conditionAttributeWithId as o}from"@spectrum-web-components/base/src/condition-attribute-with-id.js";import{randomID as a}from"@spectrum-web-components/shared/src/random-id.js";import{InteractionController as l,InteractionTypes as h}from"./InteractionController.js";import{noop as s}from"./AbstractOverlay.js";const d=300;export class HoverController extends l{constructor(){super(...arguments);this.type=h.hover;this.elementIds=[];this.focusedin=!1;this.pointerentered=!1}handleTargetFocusin(){this.target.matches(":focus-visible")&&(this.open=!0,this.focusedin=!0)}handleTargetFocusout(){this.focusedin=!1,!this.pointerentered&&(this.open=!1)}handleTargetPointerenter(){var e;this.hoverTimeout&&(clearTimeout(this.hoverTimeout),this.hoverTimeout=void 0),!((e=this.overlay)!=null&&e.disabled)&&(this.open=!0,this.pointerentered=!0)}handleTargetPointerleave(){this.doPointerleave()}handleHostPointerenter(){this.hoverTimeout&&(clearTimeout(this.hoverTimeout),this.hoverTimeout=void 0)}handleHostPointerleave(){this.doPointerleave()}prepareDescription(){if(!this.overlay.elements.length)return;const e=this.target.getRootNode(),t=this.overlay.elements[0].getRootNode(),r=this.overlay.getRootNode();e===r?this.prepareOverlayRelativeDescription():e===t&&this.prepareContentRelativeDescription()}prepareOverlayRelativeDescription(){const e=o(this.target,"aria-describedby",[this.overlay.id]);this.releaseDescription=()=>{e(),this.releaseDescription=s}}prepareContentRelativeDescription(){const e=[],t=this.overlay.elements.map(i=>(e.push(i.id),i.id||(i.id=`${this.overlay.tagName.toLowerCase()}-helper-${a()}`),i.id));this.elementIds=e;const r=o(this.target,"aria-describedby",t);this.releaseDescription=()=>{r(),this.overlay.elements.map((i,n)=>{i.id=this.elementIds[n]}),this.releaseDescription=s}}doPointerleave(){this.pointerentered=!1;const e=this.target;this.focusedin&&e.matches(":focus-visible")||(this.hoverTimeout=setTimeout(()=>{this.open=!1},d))}init(){var t;(t=this.abortController)==null||t.abort(),this.abortController=new AbortController;const{signal:e}=this.abortController;this.target.addEventListener("focusin",()=>this.handleTargetFocusin(),{signal:e}),this.target.addEventListener("focusout",()=>this.handleTargetFocusout(),{signal:e}),this.target.addEventListener("pointerenter",()=>this.handleTargetPointerenter(),{signal:e}),this.target.addEventListener("pointerleave",()=>this.handleTargetPointerleave(),{signal:e}),this.overlay&&this.initOverlay()}initOverlay(){if(!this.abortController)return;const{signal:e}=this.abortController;this.overlay.addEventListener("pointerenter",()=>this.handleHostPointerenter(),{signal:e}),this.overlay.addEventListener("pointerleave",()=>this.handleHostPointerleave(),{signal:e})}}
+//# sourceMappingURL=HoverController.js.map

package/src/HoverController.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["HoverController.ts"],
+  "sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport { conditionAttributeWithId } from '@spectrum-web-components/base/src/condition-attribute-with-id.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport {\n    InteractionController,\n    InteractionTypes,\n} from './InteractionController.js';\nimport { noop } from './AbstractOverlay.js';\n\nconst HOVER_DELAY = 300;\n\nexport class HoverController extends InteractionController {\n    override type = InteractionTypes.hover;\n\n    private elementIds: string[] = [];\n\n    focusedin = false;\n\n    private hoverTimeout?: ReturnType<typeof setTimeout>;\n\n    pointerentered = false;\n\n    handleTargetFocusin(): void {\n        if (!this.target.matches(':focus-visible')) {\n            return;\n        }\n        this.open = true;\n        this.focusedin = true;\n    }\n\n    handleTargetFocusout(): void {\n        this.focusedin = false;\n        if (this.pointerentered) return;\n        this.open = false;\n    }\n\n    handleTargetPointerenter(): void {\n        if (this.hoverTimeout) {\n            clearTimeout(this.hoverTimeout);\n            this.hoverTimeout = undefined;\n        }\n        if (this.overlay?.disabled) return;\n        this.open = true;\n        this.pointerentered = true;\n    }\n\n    handleTargetPointerleave(): void {\n        this.doPointerleave();\n    }\n\n    // set a timeout once the pointer enters and the overlay is shown\n    // give the user time to enter the overlay\n    handleHostPointerenter(): void {\n        if (this.hoverTimeout) {\n            clearTimeout(this.hoverTimeout);\n            this.hoverTimeout = undefined;\n        }\n    }\n\n    handleHostPointerleave(): void {\n        this.doPointerleave();\n    }\n\n    override prepareDescription(): void {\n        // require \"content\" to apply relationship\n        if (!this.overlay.elements.length) return;\n\n        const triggerRoot = this.target.getRootNode();\n        const contentRoot = this.overlay.elements[0].getRootNode();\n        const overlayRoot = this.overlay.getRootNode();\n        if (triggerRoot === overlayRoot) {\n            this.prepareOverlayRelativeDescription();\n        } else if (triggerRoot === contentRoot) {\n            this.prepareContentRelativeDescription();\n        }\n    }\n\n    private prepareOverlayRelativeDescription(): void {\n        const releaseDescription = conditionAttributeWithId(\n            this.target,\n            'aria-describedby',\n            [this.overlay.id]\n        );\n        this.releaseDescription = () => {\n            releaseDescription();\n            this.releaseDescription = noop;\n        };\n    }\n\n    private prepareContentRelativeDescription(): void {\n        const elementIds: string[] = [];\n        const appliedIds = this.overlay.elements.map((el) => {\n            elementIds.push(el.id);\n            if (!el.id) {\n                el.id = `${this.overlay.tagName.toLowerCase()}-helper-${randomID()}`;\n            }\n            return el.id;\n        });\n        this.elementIds = elementIds;\n        const releaseDescription = conditionAttributeWithId(\n            this.target,\n            'aria-describedby',\n            appliedIds\n        );\n        this.releaseDescription = () => {\n            releaseDescription();\n            this.overlay.elements.map((el, index) => {\n                el.id = this.elementIds[index];\n            });\n            this.releaseDescription = noop;\n        };\n    }\n\n    protected doPointerleave(): void {\n        this.pointerentered = false;\n        const triggerElement = this.target as HTMLElement;\n        if (this.focusedin && triggerElement.matches(':focus-visible')) return;\n\n        this.hoverTimeout = setTimeout(() => {\n            this.open = false;\n        }, HOVER_DELAY);\n    }\n\n    override init(): void {\n        // Clean up listeners if they've already been bound\n        this.abortController?.abort();\n        this.abortController = new AbortController();\n        const { signal } = this.abortController;\n        this.target.addEventListener(\n            'focusin',\n            () => this.handleTargetFocusin(),\n            { signal }\n        );\n        this.target.addEventListener(\n            'focusout',\n            () => this.handleTargetFocusout(),\n            { signal }\n        );\n        this.target.addEventListener(\n            'pointerenter',\n            () => this.handleTargetPointerenter(),\n            { signal }\n        );\n        this.target.addEventListener(\n            'pointerleave',\n            () => this.handleTargetPointerleave(),\n            { signal }\n        );\n        if (this.overlay) {\n            this.initOverlay();\n        }\n    }\n\n    override initOverlay(): void {\n        if (!this.abortController) {\n            return;\n        }\n        const { signal } = this.abortController;\n        this.overlay.addEventListener(\n            'pointerenter',\n            () => this.handleHostPointerenter(),\n            { signal }\n        );\n        this.overlay.addEventListener(\n            'pointerleave',\n            () => this.handleHostPointerleave(),\n            { signal }\n        );\n    }\n}\n"],
+  "mappings": "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",
+  "names": ["conditionAttributeWithId", "randomID", "InteractionController", "InteractionTypes", "noop", "HOVER_DELAY", "_a", "triggerRoot", "contentRoot", "overlayRoot", "releaseDescription", "elementIds", "appliedIds", "el", "index", "triggerElement", "signal"]
+}

package/src/InteractionController.d.ts

@@ -0,0 +1,38 @@
+import type { ReactiveController } from '@spectrum-web-components/base';
+import { AbstractOverlay } from './AbstractOverlay.js';
+export declare enum InteractionTypes {
+    'click' = 0,
+    'hover' = 1,
+    'longpress' = 2
+}
+export type ControllerOptions = {
+    overlay?: AbstractOverlay;
+    handleOverlayReady?: (overlay: AbstractOverlay) => void;
+    isPersistent?: boolean;
+};
+export declare class InteractionController implements ReactiveController {
+    target: HTMLElement;
+    abortController: AbortController;
+    get activelyOpening(): boolean;
+    private handleOverlayReady?;
+    private isLazilyOpen;
+    get open(): boolean;
+    /**
+     * Set `open` against the associated Overlay lazily.
+     */
+    set open(open: boolean);
+    get overlay(): AbstractOverlay;
+    set overlay(overlay: AbstractOverlay | undefined);
+    private _overlay;
+    protected isPersistent: boolean;
+    type: InteractionTypes;
+    constructor(target: HTMLElement, { overlay, isPersistent, handleOverlayReady }: ControllerOptions);
+    prepareDescription(_: HTMLElement): void;
+    releaseDescription(): void;
+    shouldCompleteOpen(): void;
+    init(): void;
+    initOverlay(): void;
+    abort(): void;
+    hostConnected(): void;
+    hostDisconnected(): void;
+}

package/src/InteractionController.dev.js

@@ -0,0 +1,90 @@
+"use strict";
+export var InteractionTypes = /* @__PURE__ */ ((InteractionTypes2) => {
+  InteractionTypes2[InteractionTypes2["click"] = 0] = "click";
+  InteractionTypes2[InteractionTypes2["hover"] = 1] = "hover";
+  InteractionTypes2[InteractionTypes2["longpress"] = 2] = "longpress";
+  return InteractionTypes2;
+})(InteractionTypes || {});
+export class InteractionController {
+  constructor(target, { overlay, isPersistent, handleOverlayReady }) {
+    this.target = target;
+    // Holds optimistic open state when an Overlay is not yet present
+    this.isLazilyOpen = false;
+    this.isPersistent = false;
+    this.isPersistent = !!isPersistent;
+    this.handleOverlayReady = handleOverlayReady;
+    if (this.isPersistent) {
+      this.init();
+    }
+    this.overlay = overlay;
+  }
+  get activelyOpening() {
+    return false;
+  }
+  get open() {
+    var _a, _b;
+    return (_b = (_a = this.overlay) == null ? void 0 : _a.open) != null ? _b : this.isLazilyOpen;
+  }
+  /**
+   * Set `open` against the associated Overlay lazily.
+   */
+  set open(open) {
+    if (open === this.open) return;
+    this.isLazilyOpen = open;
+    if (this.overlay) {
+      this.overlay.open = open;
+      return;
+    }
+    if (!open) {
+      return;
+    }
+    customElements.whenDefined("sp-overlay").then(async () => {
+      const { Overlay } = await import("./Overlay.dev.js");
+      this.overlay = new Overlay();
+      this.overlay.open = true;
+    });
+    import("@spectrum-web-components/overlay/sp-overlay.js");
+  }
+  get overlay() {
+    return this._overlay;
+  }
+  set overlay(overlay) {
+    var _a;
+    if (!overlay) return;
+    if (this.overlay === overlay) return;
+    if (this.overlay) {
+      this.overlay.removeController(this);
+    }
+    this._overlay = overlay;
+    this.overlay.addController(this);
+    this.initOverlay();
+    this.prepareDescription(this.target);
+    (_a = this.handleOverlayReady) == null ? void 0 : _a.call(this, this.overlay);
+  }
+  prepareDescription(_) {
+  }
+  releaseDescription() {
+  }
+  shouldCompleteOpen() {
+  }
+  /* c8 ignore next 3 */
+  init() {
+  }
+  /* c8 ignore next 3 */
+  initOverlay() {
+  }
+  abort() {
+    var _a;
+    this.releaseDescription();
+    (_a = this.abortController) == null ? void 0 : _a.abort();
+  }
+  hostConnected() {
+    this.init();
+  }
+  hostDisconnected() {
+    if (!this.isPersistent) {
+      this.abort();
+    }
+  }
+}
+//# sourceMappingURL=InteractionController.dev.js.map

package/src/InteractionController.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["InteractionController.ts"],
+  "sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport type { ReactiveController } from '@spectrum-web-components/base';\nimport { AbstractOverlay } from './AbstractOverlay.dev.js'\n\nexport enum InteractionTypes {\n    'click',\n    'hover',\n    'longpress',\n}\n\nexport type ControllerOptions = {\n    overlay?: AbstractOverlay;\n    handleOverlayReady?: (overlay: AbstractOverlay) => void;\n    isPersistent?: boolean;\n};\n\nexport class InteractionController implements ReactiveController {\n    abortController!: AbortController;\n\n    get activelyOpening(): boolean {\n        return false;\n    }\n\n    private handleOverlayReady?: (overlay: AbstractOverlay) => void;\n\n    // Holds optimistic open state when an Overlay is not yet present\n    private isLazilyOpen = false;\n\n    public get open(): boolean {\n        return this.overlay?.open ?? this.isLazilyOpen;\n    }\n\n    /**\n     * Set `open` against the associated Overlay lazily.\n     */\n    public set open(open: boolean) {\n        if (open === this.open) return;\n        this.isLazilyOpen = open;\n        if (this.overlay) {\n            // If there already is an Overlay, apply the value of `open` directly.\n            this.overlay.open = open;\n            return;\n        }\n        if (!open) {\n            // When `open` moves to `false` and there is not yet an Overlay,\n            // assume that no Overlay and a closed Overlay are the same and return early.\n            return;\n        }\n        // When there is no Overlay and `open` is moving to `true`, lazily import/create\n        // an Overlay and apply that state to it.\n        customElements\n            .whenDefined('sp-overlay')\n            .then(async (): Promise<void> => {\n                const { Overlay } = await import('./Overlay.dev.js');\n                this.overlay = new Overlay();\n                this.overlay.open = true;\n            });\n        import('@spectrum-web-components/overlay/sp-overlay.js');\n    }\n\n    public get overlay(): AbstractOverlay {\n        return this._overlay;\n    }\n\n    public set overlay(overlay: AbstractOverlay | undefined) {\n        if (!overlay) return;\n        if (this.overlay === overlay) return;\n        if (this.overlay) {\n            this.overlay.removeController(this);\n        }\n        this._overlay = overlay;\n        this.overlay.addController(this);\n        this.initOverlay();\n        this.prepareDescription(this.target);\n        this.handleOverlayReady?.(this.overlay);\n    }\n\n    private _overlay!: AbstractOverlay;\n\n    protected isPersistent = false;\n\n    type!: InteractionTypes;\n\n    constructor(\n        public target: HTMLElement,\n        { overlay, isPersistent, handleOverlayReady }: ControllerOptions\n    ) {\n        this.isPersistent = !!isPersistent;\n        this.handleOverlayReady = handleOverlayReady;\n        if (this.isPersistent) {\n            this.init();\n        }\n        this.overlay = overlay;\n    }\n\n    prepareDescription(_: HTMLElement): void {}\n\n    releaseDescription(): void {}\n\n    shouldCompleteOpen(): void {}\n\n    /* c8 ignore next 3 */\n    init(): void {\n        // Abstract init() method.\n    }\n\n    /* c8 ignore next 3 */\n    initOverlay(): void {\n        // Abstract initOverlay() method.\n    }\n\n    abort(): void {\n        this.releaseDescription();\n        this.abortController?.abort();\n    }\n\n    hostConnected(): void {\n        this.init();\n    }\n\n    hostDisconnected(): void {\n        if (!this.isPersistent) {\n            this.abort();\n        }\n    }\n}\n"],
+  "mappings": ";AAeO,WAAK,mBAAL,kBAAKA,sBAAL;AACH,EAAAA,oCAAA;AACA,EAAAA,oCAAA;AACA,EAAAA,oCAAA;AAHQ,SAAAA;AAAA,GAAA;AAYL,aAAM,sBAAoD;AAAA,EAmE7D,YACW,QACP,EAAE,SAAS,cAAc,mBAAmB,GAC9C;AAFS;AA1DX;AAAA,SAAQ,eAAe;AAqDvB,SAAU,eAAe;AAQrB,SAAK,eAAe,CAAC,CAAC;AACtB,SAAK,qBAAqB;AAC1B,QAAI,KAAK,cAAc;AACnB,WAAK,KAAK;AAAA,IACd;AACA,SAAK,UAAU;AAAA,EACnB;AAAA,EA1EA,IAAI,kBAA2B;AAC3B,WAAO;AAAA,EACX;AAAA,EAOA,IAAW,OAAgB;AAvC/B;AAwCQ,YAAO,gBAAK,YAAL,mBAAc,SAAd,YAAsB,KAAK;AAAA,EACtC;AAAA;AAAA;AAAA;AAAA,EAKA,IAAW,KAAK,MAAe;AAC3B,QAAI,SAAS,KAAK,KAAM;AACxB,SAAK,eAAe;AACpB,QAAI,KAAK,SAAS;AAEd,WAAK,QAAQ,OAAO;AACpB;AAAA,IACJ;AACA,QAAI,CAAC,MAAM;AAGP;AAAA,IACJ;AAGA,mBACK,YAAY,YAAY,EACxB,KAAK,YAA2B;AAC7B,YAAM,EAAE,QAAQ,IAAI,MAAM,OAAO,kBAAkB;AACnD,WAAK,UAAU,IAAI,QAAQ;AAC3B,WAAK,QAAQ,OAAO;AAAA,IACxB,CAAC;AACL,WAAO,gDAAgD;AAAA,EAC3D;AAAA,EAEA,IAAW,UAA2B;AAClC,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,IAAW,QAAQ,SAAsC;AA3E7D;AA4EQ,QAAI,CAAC,QAAS;AACd,QAAI,KAAK,YAAY,QAAS;AAC9B,QAAI,KAAK,SAAS;AACd,WAAK,QAAQ,iBAAiB,IAAI;AAAA,IACtC;AACA,SAAK,WAAW;AAChB,SAAK,QAAQ,cAAc,IAAI;AAC/B,SAAK,YAAY;AACjB,SAAK,mBAAmB,KAAK,MAAM;AACnC,eAAK,uBAAL,8BAA0B,KAAK;AAAA,EACnC;AAAA,EAoBA,mBAAmB,GAAsB;AAAA,EAAC;AAAA,EAE1C,qBAA2B;AAAA,EAAC;AAAA,EAE5B,qBAA2B;AAAA,EAAC;AAAA;AAAA,EAG5B,OAAa;AAAA,EAEb;AAAA;AAAA,EAGA,cAAoB;AAAA,EAEpB;AAAA,EAEA,QAAc;AA1HlB;AA2HQ,SAAK,mBAAmB;AACxB,eAAK,oBAAL,mBAAsB;AAAA,EAC1B;AAAA,EAEA,gBAAsB;AAClB,SAAK,KAAK;AAAA,EACd;AAAA,EAEA,mBAAyB;AACrB,QAAI,CAAC,KAAK,cAAc;AACpB,WAAK,MAAM;AAAA,IACf;AAAA,EACJ;AACJ;",
+  "names": ["InteractionTypes"]
+}

package/src/InteractionController.js

@@ -0,0 +1,2 @@
+"use strict";export var InteractionTypes=(r=>(r[r.click=0]="click",r[r.hover=1]="hover",r[r.longpress=2]="longpress",r))(InteractionTypes||{});export class InteractionController{constructor(e,{overlay:t,isPersistent:r,handleOverlayReady:i}){this.target=e;this.isLazilyOpen=!1;this.isPersistent=!1;this.isPersistent=!!r,this.handleOverlayReady=i,this.isPersistent&&this.init(),this.overlay=t}get activelyOpening(){return!1}get open(){var e,t;return(t=(e=this.overlay)==null?void 0:e.open)!=null?t:this.isLazilyOpen}set open(e){if(e!==this.open){if(this.isLazilyOpen=e,this.overlay){this.overlay.open=e;return}e&&(customElements.whenDefined("sp-overlay").then(async()=>{const{Overlay:t}=await import("./Overlay.js");this.overlay=new t,this.overlay.open=!0}),import("@spectrum-web-components/overlay/sp-overlay.js"))}}get overlay(){return this._overlay}set overlay(e){var t;e&&this.overlay!==e&&(this.overlay&&this.overlay.removeController(this),this._overlay=e,this.overlay.addController(this),this.initOverlay(),this.prepareDescription(this.target),(t=this.handleOverlayReady)==null||t.call(this,this.overlay))}prepareDescription(e){}releaseDescription(){}shouldCompleteOpen(){}init(){}initOverlay(){}abort(){var e;this.releaseDescription(),(e=this.abortController)==null||e.abort()}hostConnected(){this.init()}hostDisconnected(){this.isPersistent||this.abort()}}
+//# sourceMappingURL=InteractionController.js.map

package/src/InteractionController.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["InteractionController.ts"],
+  "sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport type { ReactiveController } from '@spectrum-web-components/base';\nimport { AbstractOverlay } from './AbstractOverlay.js';\n\nexport enum InteractionTypes {\n    'click',\n    'hover',\n    'longpress',\n}\n\nexport type ControllerOptions = {\n    overlay?: AbstractOverlay;\n    handleOverlayReady?: (overlay: AbstractOverlay) => void;\n    isPersistent?: boolean;\n};\n\nexport class InteractionController implements ReactiveController {\n    abortController!: AbortController;\n\n    get activelyOpening(): boolean {\n        return false;\n    }\n\n    private handleOverlayReady?: (overlay: AbstractOverlay) => void;\n\n    // Holds optimistic open state when an Overlay is not yet present\n    private isLazilyOpen = false;\n\n    public get open(): boolean {\n        return this.overlay?.open ?? this.isLazilyOpen;\n    }\n\n    /**\n     * Set `open` against the associated Overlay lazily.\n     */\n    public set open(open: boolean) {\n        if (open === this.open) return;\n        this.isLazilyOpen = open;\n        if (this.overlay) {\n            // If there already is an Overlay, apply the value of `open` directly.\n            this.overlay.open = open;\n            return;\n        }\n        if (!open) {\n            // When `open` moves to `false` and there is not yet an Overlay,\n            // assume that no Overlay and a closed Overlay are the same and return early.\n            return;\n        }\n        // When there is no Overlay and `open` is moving to `true`, lazily import/create\n        // an Overlay and apply that state to it.\n        customElements\n            .whenDefined('sp-overlay')\n            .then(async (): Promise<void> => {\n                const { Overlay } = await import('./Overlay.js');\n                this.overlay = new Overlay();\n                this.overlay.open = true;\n            });\n        import('@spectrum-web-components/overlay/sp-overlay.js');\n    }\n\n    public get overlay(): AbstractOverlay {\n        return this._overlay;\n    }\n\n    public set overlay(overlay: AbstractOverlay | undefined) {\n        if (!overlay) return;\n        if (this.overlay === overlay) return;\n        if (this.overlay) {\n            this.overlay.removeController(this);\n        }\n        this._overlay = overlay;\n        this.overlay.addController(this);\n        this.initOverlay();\n        this.prepareDescription(this.target);\n        this.handleOverlayReady?.(this.overlay);\n    }\n\n    private _overlay!: AbstractOverlay;\n\n    protected isPersistent = false;\n\n    type!: InteractionTypes;\n\n    constructor(\n        public target: HTMLElement,\n        { overlay, isPersistent, handleOverlayReady }: ControllerOptions\n    ) {\n        this.isPersistent = !!isPersistent;\n        this.handleOverlayReady = handleOverlayReady;\n        if (this.isPersistent) {\n            this.init();\n        }\n        this.overlay = overlay;\n    }\n\n    prepareDescription(_: HTMLElement): void {}\n\n    releaseDescription(): void {}\n\n    shouldCompleteOpen(): void {}\n\n    /* c8 ignore next 3 */\n    init(): void {\n        // Abstract init() method.\n    }\n\n    /* c8 ignore next 3 */\n    initOverlay(): void {\n        // Abstract initOverlay() method.\n    }\n\n    abort(): void {\n        this.releaseDescription();\n        this.abortController?.abort();\n    }\n\n    hostConnected(): void {\n        this.init();\n    }\n\n    hostDisconnected(): void {\n        if (!this.isPersistent) {\n            this.abort();\n        }\n    }\n}\n"],
+  "mappings": "aAeO,WAAK,kBAAAA,IACRA,IAAA,iBACAA,IAAA,iBACAA,IAAA,yBAHQA,IAAA,sBAYL,aAAM,qBAAoD,CAmE7D,YACWC,EACP,CAAE,QAAAC,EAAS,aAAAC,EAAc,mBAAAC,CAAmB,EAC9C,CAFS,YAAAH,EA1DX,KAAQ,aAAe,GAqDvB,KAAU,aAAe,GAQrB,KAAK,aAAe,CAAC,CAACE,EACtB,KAAK,mBAAqBC,EACtB,KAAK,cACL,KAAK,KAAK,EAEd,KAAK,QAAUF,CACnB,CA1EA,IAAI,iBAA2B,CAC3B,MAAO,EACX,CAOA,IAAW,MAAgB,CAvC/B,IAAAG,EAAAC,EAwCQ,OAAOA,GAAAD,EAAA,KAAK,UAAL,YAAAA,EAAc,OAAd,KAAAC,EAAsB,KAAK,YACtC,CAKA,IAAW,KAAKC,EAAe,CAC3B,GAAIA,IAAS,KAAK,KAElB,IADA,KAAK,aAAeA,EAChB,KAAK,QAAS,CAEd,KAAK,QAAQ,KAAOA,EACpB,MACJ,CACKA,IAOL,eACK,YAAY,YAAY,EACxB,KAAK,SAA2B,CAC7B,KAAM,CAAE,QAAAC,CAAQ,EAAI,KAAM,QAAO,cAAc,EAC/C,KAAK,QAAU,IAAIA,EACnB,KAAK,QAAQ,KAAO,EACxB,CAAC,EACL,OAAO,gDAAgD,GAC3D,CAEA,IAAW,SAA2B,CAClC,OAAO,KAAK,QAChB,CAEA,IAAW,QAAQN,EAAsC,CA3E7D,IAAAG,EA4EaH,GACD,KAAK,UAAYA,IACjB,KAAK,SACL,KAAK,QAAQ,iBAAiB,IAAI,EAEtC,KAAK,SAAWA,EAChB,KAAK,QAAQ,cAAc,IAAI,EAC/B,KAAK,YAAY,EACjB,KAAK,mBAAmB,KAAK,MAAM,GACnCG,EAAA,KAAK,qBAAL,MAAAA,EAAA,UAA0B,KAAK,SACnC,CAoBA,mBAAmBI,EAAsB,CAAC,CAE1C,oBAA2B,CAAC,CAE5B,oBAA2B,CAAC,CAG5B,MAAa,CAEb,CAGA,aAAoB,CAEpB,CAEA,OAAc,CA1HlB,IAAAJ,EA2HQ,KAAK,mBAAmB,GACxBA,EAAA,KAAK,kBAAL,MAAAA,EAAsB,OAC1B,CAEA,eAAsB,CAClB,KAAK,KAAK,CACd,CAEA,kBAAyB,CAChB,KAAK,cACN,KAAK,MAAM,CAEnB,CACJ",
+  "names": ["InteractionTypes", "target", "overlay", "isPersistent", "handleOverlayReady", "_a", "_b", "open", "Overlay", "_"]
+}

package/src/LongpressController.d.ts

@@ -0,0 +1,21 @@
+import { InteractionController, InteractionTypes } from './InteractionController.js';
+export declare const LONGPRESS_INSTRUCTIONS: {
+    touch: string;
+    keyboard: string;
+    mouse: string;
+};
+export declare class LongpressController extends InteractionController {
+    type: InteractionTypes;
+    get activelyOpening(): boolean;
+    protected longpressState: null | 'potential' | 'opening' | 'pressed';
+    releaseDescription: () => void;
+    private timeout;
+    handleLongpress(): void;
+    handlePointerdown(event: PointerEvent): void;
+    private handlePointerup;
+    private handleKeydown;
+    private handleKeyup;
+    prepareDescription(trigger: HTMLElement): void;
+    shouldCompleteOpen(): void;
+    init(): void;
+}

package/src/LongpressController.dev.js

@@ -0,0 +1,156 @@
+"use strict";
+import {
+  isAndroid,
+  isIOS
+} from "@spectrum-web-components/shared/src/platform.js";
+import { conditionAttributeWithId } from "@spectrum-web-components/base/src/condition-attribute-with-id.js";
+import { randomID } from "@spectrum-web-components/shared/src/random-id.js";
+import { noop } from "./AbstractOverlay.dev.js";
+import {
+  InteractionController,
+  InteractionTypes
+} from "./InteractionController.dev.js";
+const LONGPRESS_DURATION = 300;
+export const LONGPRESS_INSTRUCTIONS = {
+  touch: "Double tap and long press for additional options",
+  keyboard: "Press Space or Alt+Down Arrow for additional options",
+  mouse: "Click and hold for additional options"
+};
+export class LongpressController extends InteractionController {
+  constructor() {
+    super(...arguments);
+    this.type = InteractionTypes.longpress;
+    this.longpressState = null;
+    this.releaseDescription = noop;
+    this.handlePointerup = () => {
+      var _a;
+      clearTimeout(this.timeout);
+      if (!this.target) return;
+      this.longpressState = ((_a = this.overlay) == null ? void 0 : _a.state) === "opening" ? "pressed" : null;
+      document.removeEventListener("pointerup", this.handlePointerup);
+      document.removeEventListener("pointercancel", this.handlePointerup);
+    };
+  }
+  get activelyOpening() {
+    return this.longpressState === "opening" || this.longpressState === "pressed";
+  }
+  handleLongpress() {
+    this.open = true;
+    this.longpressState = this.longpressState === "potential" ? "opening" : "pressed";
+  }
+  handlePointerdown(event) {
+    if (!this.target) return;
+    if (event.button !== 0) return;
+    this.longpressState = "potential";
+    document.addEventListener("pointerup", this.handlePointerup);
+    document.addEventListener("pointercancel", this.handlePointerup);
+    const triggerHandlesLongpress = "holdAffordance" in this.target;
+    if (triggerHandlesLongpress) return;
+    this.timeout = setTimeout(() => {
+      if (!this.target) return;
+      this.target.dispatchEvent(
+        new CustomEvent("longpress", {
+          bubbles: true,
+          composed: true,
+          detail: {
+            source: "pointer"
+          }
+        })
+      );
+    }, LONGPRESS_DURATION);
+  }
+  handleKeydown(event) {
+    const { code, altKey } = event;
+    if (altKey && code === "ArrowDown") {
+      event.stopPropagation();
+      event.stopImmediatePropagation();
+    }
+  }
+  handleKeyup(event) {
+    const { code, altKey } = event;
+    if (code === "Space" || altKey && code === "ArrowDown") {
+      if (!this.target) {
+        return;
+      }
+      event.stopPropagation();
+      this.target.dispatchEvent(
+        new CustomEvent("longpress", {
+          bubbles: true,
+          composed: true,
+          detail: {
+            source: "keyboard"
+          }
+        })
+      );
+      setTimeout(() => {
+        this.longpressState = null;
+      });
+    }
+  }
+  prepareDescription(trigger) {
+    if (
+      // do not reapply until target is recycled
+      this.releaseDescription !== noop || // require "longpress content" to apply relationship
+      !this.overlay.elements.length
+    ) {
+      return;
+    }
+    const longpressDescription = document.createElement("div");
+    longpressDescription.id = `longpress-describedby-descriptor-${randomID()}`;
+    const messageType = isIOS() || isAndroid() ? "touch" : "keyboard";
+    longpressDescription.textContent = LONGPRESS_INSTRUCTIONS[messageType];
+    longpressDescription.slot = "longpress-describedby-descriptor";
+    const triggerParent = trigger.getRootNode();
+    const overlayParent = this.overlay.getRootNode();
+    if (triggerParent === overlayParent) {
+      this.overlay.append(longpressDescription);
+    } else {
+      longpressDescription.hidden = !("host" in triggerParent);
+      trigger.insertAdjacentElement("afterend", longpressDescription);
+    }
+    const releaseDescription = conditionAttributeWithId(
+      trigger,
+      "aria-describedby",
+      [longpressDescription.id]
+    );
+    this.releaseDescription = () => {
+      releaseDescription();
+      longpressDescription.remove();
+      this.releaseDescription = noop;
+    };
+  }
+  shouldCompleteOpen() {
+    this.longpressState = this.longpressState === "pressed" ? null : this.longpressState;
+  }
+  init() {
+    var _a;
+    (_a = this.abortController) == null ? void 0 : _a.abort();
+    this.abortController = new AbortController();
+    const { signal } = this.abortController;
+    this.target.addEventListener(
+      "longpress",
+      () => this.handleLongpress(),
+      { signal }
+    );
+    this.target.addEventListener(
+      "pointerdown",
+      (event) => this.handlePointerdown(event),
+      { signal }
+    );
+    this.prepareDescription(this.target);
+    if (this.target.holdAffordance) {
+      return;
+    }
+    this.target.addEventListener(
+      "keydown",
+      (event) => this.handleKeydown(event),
+      { signal }
+    );
+    this.target.addEventListener(
+      "keyup",
+      (event) => this.handleKeyup(event),
+      { signal }
+    );
+  }
+}
+//# sourceMappingURL=LongpressController.dev.js.map