@spectrum-web-components/picker 0.0.0-20241209155954

package/src/DesktopController.dev.js

@@ -0,0 +1,72 @@
+"use strict";
+import {
+  InteractionController,
+  InteractionTypes
+} from "./InteractionController.dev.js";
+export class DesktopController extends InteractionController {
+  constructor() {
+    super(...arguments);
+    this.type = InteractionTypes.desktop;
+  }
+  handlePointerdown(event) {
+    if (event.button !== 0 || event.pointerType === "touch") {
+      return;
+    }
+    this.pointerdownState = this.open;
+    this.preventNextToggle = "maybe";
+    let cleanupAction = 0;
+    const cleanup = () => {
+      cancelAnimationFrame(cleanupAction);
+      cleanupAction = requestAnimationFrame(async () => {
+        document.removeEventListener("pointerup", cleanup);
+        document.removeEventListener("pointercancel", cleanup);
+        this.target.removeEventListener("click", cleanup);
+        requestAnimationFrame(() => {
+          this.preventNextToggle = "no";
+        });
+      });
+    };
+    document.addEventListener("pointerup", cleanup);
+    document.addEventListener("pointercancel", cleanup);
+    this.target.addEventListener("click", cleanup);
+    this.handleActivate();
+  }
+  handleActivate(event) {
+    if (this.enterKeydownOn && this.enterKeydownOn !== this.target) {
+      return;
+    }
+    if (this.preventNextToggle === "yes") {
+      return;
+    }
+    if ((event == null ? void 0 : event.type) === "click" && this.open !== this.pointerdownState) {
+      return;
+    }
+    this.host.toggle();
+  }
+  init() {
+    var _a;
+    (_a = this.abortController) == null ? void 0 : _a.abort();
+    this.abortController = new AbortController();
+    const { signal } = this.abortController;
+    this.target.addEventListener(
+      "click",
+      (event) => this.handleActivate(event),
+      {
+        signal
+      }
+    );
+    this.target.addEventListener(
+      "pointerdown",
+      (event) => this.handlePointerdown(event),
+      { signal }
+    );
+    this.target.addEventListener(
+      "focus",
+      (event) => this.handleButtonFocus(event),
+      {
+        signal
+      }
+    );
+  }
+}
+//# sourceMappingURL=DesktopController.dev.js.map

package/src/DesktopController.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["DesktopController.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 DesktopController extends InteractionController {\n    override type = InteractionTypes.desktop;\n\n    public override handlePointerdown(event: PointerEvent): void {\n        if (event.button !== 0 || event.pointerType === 'touch') {\n            return;\n        }\n        this.pointerdownState = this.open;\n        this.preventNextToggle = 'maybe';\n        let cleanupAction = 0;\n        const cleanup = (): void => {\n            cancelAnimationFrame(cleanupAction);\n            cleanupAction = requestAnimationFrame(async () => {\n                document.removeEventListener('pointerup', cleanup);\n                document.removeEventListener('pointercancel', cleanup);\n                this.target.removeEventListener('click', cleanup);\n                requestAnimationFrame(() => {\n                    // Complete cleanup on the second animation frame so that `click` can go first.\n                    this.preventNextToggle = 'no';\n                });\n            });\n        };\n        // Ensure that however the pointer goes up we do `cleanup()`.\n        document.addEventListener('pointerup', cleanup);\n        document.addEventListener('pointercancel', cleanup);\n        this.target.addEventListener('click', cleanup);\n        this.handleActivate();\n    }\n\n    public override handleActivate(event?: Event): void {\n        if (this.enterKeydownOn && this.enterKeydownOn !== this.target) {\n            return;\n        }\n        if (this.preventNextToggle === 'yes') {\n            return;\n        }\n        if (event?.type === 'click' && this.open !== this.pointerdownState) {\n            // When activation comes from a `click` event ensure that the `pointerup`\n            // event didn't already toggle the Picker state before doing so.\n            return;\n        }\n        this.host.toggle();\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            'click',\n            (event: Event) => this.handleActivate(event),\n            {\n                signal,\n            }\n        );\n        this.target.addEventListener(\n            'pointerdown',\n            (event: PointerEvent) => this.handlePointerdown(event),\n            { signal }\n        );\n        this.target.addEventListener(\n            'focus',\n            (event: FocusEvent) => this.handleButtonFocus(event),\n            {\n                signal,\n            }\n        );\n    }\n}\n"],
+  "mappings": ";AAYA;AAAA,EACI;AAAA,EACA;AAAA,OACG;AAEA,aAAM,0BAA0B,sBAAsB;AAAA,EAAtD;AAAA;AACH,SAAS,OAAO,iBAAiB;AAAA;AAAA,EAEjB,kBAAkB,OAA2B;AACzD,QAAI,MAAM,WAAW,KAAK,MAAM,gBAAgB,SAAS;AACrD;AAAA,IACJ;AACA,SAAK,mBAAmB,KAAK;AAC7B,SAAK,oBAAoB;AACzB,QAAI,gBAAgB;AACpB,UAAM,UAAU,MAAY;AACxB,2BAAqB,aAAa;AAClC,sBAAgB,sBAAsB,YAAY;AAC9C,iBAAS,oBAAoB,aAAa,OAAO;AACjD,iBAAS,oBAAoB,iBAAiB,OAAO;AACrD,aAAK,OAAO,oBAAoB,SAAS,OAAO;AAChD,8BAAsB,MAAM;AAExB,eAAK,oBAAoB;AAAA,QAC7B,CAAC;AAAA,MACL,CAAC;AAAA,IACL;AAEA,aAAS,iBAAiB,aAAa,OAAO;AAC9C,aAAS,iBAAiB,iBAAiB,OAAO;AAClD,SAAK,OAAO,iBAAiB,SAAS,OAAO;AAC7C,SAAK,eAAe;AAAA,EACxB;AAAA,EAEgB,eAAe,OAAqB;AAChD,QAAI,KAAK,kBAAkB,KAAK,mBAAmB,KAAK,QAAQ;AAC5D;AAAA,IACJ;AACA,QAAI,KAAK,sBAAsB,OAAO;AAClC;AAAA,IACJ;AACA,SAAI,+BAAO,UAAS,WAAW,KAAK,SAAS,KAAK,kBAAkB;AAGhE;AAAA,IACJ;AACA,SAAK,KAAK,OAAO;AAAA,EACrB;AAAA,EAES,OAAa;AA7D1B;AA+DQ,eAAK,oBAAL,mBAAsB;AACtB,SAAK,kBAAkB,IAAI,gBAAgB;AAC3C,UAAM,EAAE,OAAO,IAAI,KAAK;AACxB,SAAK,OAAO;AAAA,MACR;AAAA,MACA,CAAC,UAAiB,KAAK,eAAe,KAAK;AAAA,MAC3C;AAAA,QACI;AAAA,MACJ;AAAA,IACJ;AACA,SAAK,OAAO;AAAA,MACR;AAAA,MACA,CAAC,UAAwB,KAAK,kBAAkB,KAAK;AAAA,MACrD,EAAE,OAAO;AAAA,IACb;AACA,SAAK,OAAO;AAAA,MACR;AAAA,MACA,CAAC,UAAsB,KAAK,kBAAkB,KAAK;AAAA,MACnD;AAAA,QACI;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AACJ;",
+  "names": []
+}

package/src/DesktopController.js

@@ -0,0 +1,2 @@
+"use strict";import{InteractionController as i,InteractionTypes as o}from"./InteractionController.js";export class DesktopController extends i{constructor(){super(...arguments);this.type=o.desktop}handlePointerdown(e){if(e.button!==0||e.pointerType==="touch")return;this.pointerdownState=this.open,this.preventNextToggle="maybe";let n=0;const t=()=>{cancelAnimationFrame(n),n=requestAnimationFrame(async()=>{document.removeEventListener("pointerup",t),document.removeEventListener("pointercancel",t),this.target.removeEventListener("click",t),requestAnimationFrame(()=>{this.preventNextToggle="no"})})};document.addEventListener("pointerup",t),document.addEventListener("pointercancel",t),this.target.addEventListener("click",t),this.handleActivate()}handleActivate(e){this.enterKeydownOn&&this.enterKeydownOn!==this.target||this.preventNextToggle!=="yes"&&((e==null?void 0:e.type)==="click"&&this.open!==this.pointerdownState||this.host.toggle())}init(){var n;(n=this.abortController)==null||n.abort(),this.abortController=new AbortController;const{signal:e}=this.abortController;this.target.addEventListener("click",t=>this.handleActivate(t),{signal:e}),this.target.addEventListener("pointerdown",t=>this.handlePointerdown(t),{signal:e}),this.target.addEventListener("focus",t=>this.handleButtonFocus(t),{signal:e})}}
+//# sourceMappingURL=DesktopController.js.map

package/src/DesktopController.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["DesktopController.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 DesktopController extends InteractionController {\n    override type = InteractionTypes.desktop;\n\n    public override handlePointerdown(event: PointerEvent): void {\n        if (event.button !== 0 || event.pointerType === 'touch') {\n            return;\n        }\n        this.pointerdownState = this.open;\n        this.preventNextToggle = 'maybe';\n        let cleanupAction = 0;\n        const cleanup = (): void => {\n            cancelAnimationFrame(cleanupAction);\n            cleanupAction = requestAnimationFrame(async () => {\n                document.removeEventListener('pointerup', cleanup);\n                document.removeEventListener('pointercancel', cleanup);\n                this.target.removeEventListener('click', cleanup);\n                requestAnimationFrame(() => {\n                    // Complete cleanup on the second animation frame so that `click` can go first.\n                    this.preventNextToggle = 'no';\n                });\n            });\n        };\n        // Ensure that however the pointer goes up we do `cleanup()`.\n        document.addEventListener('pointerup', cleanup);\n        document.addEventListener('pointercancel', cleanup);\n        this.target.addEventListener('click', cleanup);\n        this.handleActivate();\n    }\n\n    public override handleActivate(event?: Event): void {\n        if (this.enterKeydownOn && this.enterKeydownOn !== this.target) {\n            return;\n        }\n        if (this.preventNextToggle === 'yes') {\n            return;\n        }\n        if (event?.type === 'click' && this.open !== this.pointerdownState) {\n            // When activation comes from a `click` event ensure that the `pointerup`\n            // event didn't already toggle the Picker state before doing so.\n            return;\n        }\n        this.host.toggle();\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            'click',\n            (event: Event) => this.handleActivate(event),\n            {\n                signal,\n            }\n        );\n        this.target.addEventListener(\n            'pointerdown',\n            (event: PointerEvent) => this.handlePointerdown(event),\n            { signal }\n        );\n        this.target.addEventListener(\n            'focus',\n            (event: FocusEvent) => this.handleButtonFocus(event),\n            {\n                signal,\n            }\n        );\n    }\n}\n"],
+  "mappings": "aAYA,OACI,yBAAAA,EACA,oBAAAC,MACG,6BAEA,aAAM,0BAA0BD,CAAsB,CAAtD,kCACH,KAAS,KAAOC,EAAiB,QAEjB,kBAAkBC,EAA2B,CACzD,GAAIA,EAAM,SAAW,GAAKA,EAAM,cAAgB,QAC5C,OAEJ,KAAK,iBAAmB,KAAK,KAC7B,KAAK,kBAAoB,QACzB,IAAIC,EAAgB,EACpB,MAAMC,EAAU,IAAY,CACxB,qBAAqBD,CAAa,EAClCA,EAAgB,sBAAsB,SAAY,CAC9C,SAAS,oBAAoB,YAAaC,CAAO,EACjD,SAAS,oBAAoB,gBAAiBA,CAAO,EACrD,KAAK,OAAO,oBAAoB,QAASA,CAAO,EAChD,sBAAsB,IAAM,CAExB,KAAK,kBAAoB,IAC7B,CAAC,CACL,CAAC,CACL,EAEA,SAAS,iBAAiB,YAAaA,CAAO,EAC9C,SAAS,iBAAiB,gBAAiBA,CAAO,EAClD,KAAK,OAAO,iBAAiB,QAASA,CAAO,EAC7C,KAAK,eAAe,CACxB,CAEgB,eAAeF,EAAqB,CAC5C,KAAK,gBAAkB,KAAK,iBAAmB,KAAK,QAGpD,KAAK,oBAAsB,SAG3BA,GAAA,YAAAA,EAAO,QAAS,SAAW,KAAK,OAAS,KAAK,kBAKlD,KAAK,KAAK,OAAO,EACrB,CAES,MAAa,CA7D1B,IAAAG,GA+DQA,EAAA,KAAK,kBAAL,MAAAA,EAAsB,QACtB,KAAK,gBAAkB,IAAI,gBAC3B,KAAM,CAAE,OAAAC,CAAO,EAAI,KAAK,gBACxB,KAAK,OAAO,iBACR,QACCJ,GAAiB,KAAK,eAAeA,CAAK,EAC3C,CACI,OAAAI,CACJ,CACJ,EACA,KAAK,OAAO,iBACR,cACCJ,GAAwB,KAAK,kBAAkBA,CAAK,EACrD,CAAE,OAAAI,CAAO,CACb,EACA,KAAK,OAAO,iBACR,QACCJ,GAAsB,KAAK,kBAAkBA,CAAK,EACnD,CACI,OAAAI,CACJ,CACJ,CACJ,CACJ",
+  "names": ["InteractionController", "InteractionTypes", "event", "cleanupAction", "cleanup", "_a", "signal"]
+}

package/src/InteractionController.d.ts

@@ -0,0 +1,43 @@
+import { ReactiveController, TemplateResult } from '@spectrum-web-components/base';
+import { AbstractOverlay } from '@spectrum-web-components/overlay/src/AbstractOverlay';
+import { Overlay } from '@spectrum-web-components/overlay/src/Overlay.js';
+import { PickerBase } from './Picker.js';
+export declare enum InteractionTypes {
+    'desktop' = 0,
+    'mobile' = 1
+}
+export declare class InteractionController implements ReactiveController {
+    target: HTMLElement;
+    host: PickerBase;
+    abortController: AbortController;
+    preventNextToggle: 'no' | 'maybe' | 'yes';
+    pointerdownState: boolean;
+    enterKeydownOn: EventTarget | null;
+    container: TemplateResult;
+    get activelyOpening(): boolean;
+    private _open;
+    get open(): boolean;
+    /**
+     * Set `open`
+     */
+    set open(open: boolean);
+    private _overlay;
+    get overlay(): AbstractOverlay;
+    set overlay(overlay: AbstractOverlay | undefined);
+    type: InteractionTypes;
+    constructor(target: HTMLElement, host: PickerBase);
+    releaseDescription(): void;
+    protected handleBeforetoggle(event: Event & {
+        target: Overlay;
+        newState: 'open' | 'closed';
+    }): void;
+    initOverlay(): void;
+    handlePointerdown(_event: PointerEvent): void;
+    handleButtonFocus(event: FocusEvent): void;
+    handleActivate(_event: Event): void;
+    init(): void;
+    abort(): void;
+    hostConnected(): void;
+    hostDisconnected(): void;
+    hostUpdated(): void;
+}

package/src/InteractionController.dev.js

@@ -0,0 +1,121 @@
+"use strict";
+export var InteractionTypes = /* @__PURE__ */ ((InteractionTypes2) => {
+  InteractionTypes2[InteractionTypes2["desktop"] = 0] = "desktop";
+  InteractionTypes2[InteractionTypes2["mobile"] = 1] = "mobile";
+  return InteractionTypes2;
+})(InteractionTypes || {});
+export class InteractionController {
+  constructor(target, host) {
+    this.target = target;
+    this.host = host;
+    this.preventNextToggle = "no";
+    this.pointerdownState = false;
+    this.enterKeydownOn = null;
+    this._open = false;
+    this.target = target;
+    this.host = host;
+    this.host.addController(this);
+    this.init();
+  }
+  get activelyOpening() {
+    return false;
+  }
+  get open() {
+    return this._open;
+  }
+  /**
+   * Set `open`
+   */
+  set open(open) {
+    if (this._open === open) return;
+    this._open = open;
+    if (this.overlay) {
+      this.host.open = open;
+      return;
+    }
+    customElements.whenDefined("sp-overlay").then(async () => {
+      const { Overlay: Overlay2 } = await import("@spectrum-web-components/overlay/src/Overlay.js");
+      this.overlay = new Overlay2();
+      this.host.open = true;
+      this.host.requestUpdate();
+    });
+    import("@spectrum-web-components/overlay/sp-overlay.js");
+  }
+  get overlay() {
+    return this._overlay;
+  }
+  set overlay(overlay) {
+    if (!overlay) return;
+    if (this.overlay === overlay) return;
+    this._overlay = overlay;
+    this.initOverlay();
+  }
+  releaseDescription() {
+  }
+  handleBeforetoggle(event) {
+    var _a;
+    if (event.composedPath()[0] !== event.target) {
+      return;
+    }
+    if (event.newState === "closed") {
+      if (this.preventNextToggle === "no") {
+        this.open = false;
+      } else if (!this.pointerdownState) {
+        (_a = this.overlay) == null ? void 0 : _a.manuallyKeepOpen();
+      }
+    }
+    if (!this.open) {
+      this.host.optionsMenu.updateSelectedItemIndex();
+      this.host.optionsMenu.closeDescendentOverlays();
+    }
+  }
+  initOverlay() {
+    if (this.overlay) {
+      this.overlay.addEventListener("beforetoggle", (event) => {
+        this.handleBeforetoggle(
+          event
+        );
+      });
+      this.overlay.type = this.host.isMobile.matches ? "modal" : "auto";
+      this.overlay.triggerElement = this.host;
+      this.overlay.placement = this.host.isMobile.matches ? void 0 : this.host.placement;
+      this.overlay.receivesFocus = "true";
+      this.overlay.willPreventClose = this.preventNextToggle !== "no" && this.open;
+      this.overlay.addEventListener(
+        "slottable-request",
+        this.host.handleSlottableRequest
+      );
+    }
+  }
+  handlePointerdown(_event) {
+  }
+  handleButtonFocus(event) {
+    if (this.preventNextToggle === "maybe" && event.relatedTarget === this.host.optionsMenu) {
+      this.preventNextToggle = "yes";
+    }
+  }
+  handleActivate(_event) {
+  }
+  /* c8 ignore next 3 */
+  init() {
+  }
+  abort() {
+    var _a;
+    this.releaseDescription();
+    (_a = this.abortController) == null ? void 0 : _a.abort();
+  }
+  hostConnected() {
+    this.init();
+  }
+  hostDisconnected() {
+    var _a;
+    (_a = this.abortController) == null ? void 0 : _a.abort();
+  }
+  hostUpdated() {
+    if (this.overlay && this.host.dependencyManager.loaded && this.host.open !== this.overlay.open) {
+      this.overlay.willPreventClose = this.preventNextToggle !== "no";
+      this.overlay.open = this.host.open;
+    }
+  }
+}
+//# 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 {\n    ReactiveController,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport { AbstractOverlay } from '@spectrum-web-components/overlay/src/AbstractOverlay';\nimport { Overlay } from '@spectrum-web-components/overlay/src/Overlay.js';\nimport { PickerBase } from './Picker.dev.js'\n\nexport enum InteractionTypes {\n    'desktop',\n    'mobile',\n}\n\nexport class InteractionController implements ReactiveController {\n    abortController!: AbortController;\n\n    public preventNextToggle: 'no' | 'maybe' | 'yes' = 'no';\n    public pointerdownState = false;\n    public enterKeydownOn: EventTarget | null = null;\n\n    public container!: TemplateResult;\n\n    get activelyOpening(): boolean {\n        return false;\n    }\n\n    private _open = false;\n\n    public get open(): boolean {\n        return this._open;\n    }\n\n    /**\n     * Set `open`\n     */\n    public set open(open: boolean) {\n        if (this._open === open) return;\n        this._open = open;\n\n        if (this.overlay) {\n            this.host.open = open;\n            return;\n        }\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(\n                    '@spectrum-web-components/overlay/src/Overlay.js'\n                );\n                this.overlay = new Overlay();\n                this.host.open = true;\n                this.host.requestUpdate();\n            });\n        import('@spectrum-web-components/overlay/sp-overlay.js');\n    }\n\n    private _overlay!: AbstractOverlay;\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        this._overlay = overlay;\n        this.initOverlay();\n    }\n\n    type!: InteractionTypes;\n\n    constructor(\n        public target: HTMLElement,\n        public host: PickerBase\n    ) {\n        this.target = target;\n        this.host = host;\n        this.host.addController(this);\n        this.init();\n    }\n\n    releaseDescription(): void {}\n\n    protected handleBeforetoggle(\n        event: Event & {\n            target: Overlay;\n            newState: 'open' | 'closed';\n        }\n    ): void {\n        if (event.composedPath()[0] !== event.target) {\n            return;\n        }\n        if (event.newState === 'closed') {\n            if (this.preventNextToggle === 'no') {\n                this.open = false;\n            } else if (!this.pointerdownState) {\n                // Prevent browser driven closure while opening the Picker\n                // and the expected event series has not completed.\n                this.overlay?.manuallyKeepOpen();\n            }\n        }\n        if (!this.open) {\n            this.host.optionsMenu.updateSelectedItemIndex();\n            this.host.optionsMenu.closeDescendentOverlays();\n        }\n    }\n\n    initOverlay(): void {\n        if (this.overlay) {\n            this.overlay.addEventListener('beforetoggle', (event: Event) => {\n                this.handleBeforetoggle(\n                    event as Event & {\n                        target: Overlay;\n                        newState: 'open' | 'closed';\n                    }\n                );\n            });\n            this.overlay.type = this.host.isMobile.matches ? 'modal' : 'auto';\n            this.overlay.triggerElement = this.host as HTMLElement;\n            this.overlay.placement = this.host.isMobile.matches\n                ? undefined\n                : this.host.placement;\n            this.overlay.receivesFocus = 'true';\n            this.overlay.willPreventClose =\n                this.preventNextToggle !== 'no' && this.open;\n            this.overlay.addEventListener(\n                'slottable-request',\n                this.host.handleSlottableRequest\n            );\n        }\n    }\n\n    public handlePointerdown(_event: PointerEvent): void {}\n\n    public handleButtonFocus(event: FocusEvent): void {\n        // When focus comes from a pointer event, and the related target is the Menu,\n        // we don't want to reopen the Menu.\n        if (\n            this.preventNextToggle === 'maybe' &&\n            event.relatedTarget === this.host.optionsMenu\n        ) {\n            this.preventNextToggle = 'yes';\n        }\n    }\n\n    public handleActivate(_event: Event): void {}\n\n    /* c8 ignore next 3 */\n    init(): void {}\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        this.abortController?.abort();\n    }\n\n    public hostUpdated(): void {\n        if (\n            this.overlay &&\n            this.host.dependencyManager.loaded &&\n            this.host.open !== this.overlay.open\n        ) {\n            this.overlay.willPreventClose = this.preventNextToggle !== 'no';\n            this.overlay.open = this.host.open;\n        }\n    }\n}\n"],
+  "mappings": "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",
+  "names": ["InteractionTypes", "Overlay"]
+}

package/src/InteractionController.js

@@ -0,0 +1,2 @@
+"use strict";export var InteractionTypes=(t=>(t[t.desktop=0]="desktop",t[t.mobile=1]="mobile",t))(InteractionTypes||{});export class InteractionController{constructor(e,t){this.target=e;this.host=t;this.preventNextToggle="no";this.pointerdownState=!1;this.enterKeydownOn=null;this._open=!1;this.target=e,this.host=t,this.host.addController(this),this.init()}get activelyOpening(){return!1}get open(){return this._open}set open(e){if(this._open!==e){if(this._open=e,this.overlay){this.host.open=e;return}customElements.whenDefined("sp-overlay").then(async()=>{const{Overlay:t}=await import("@spectrum-web-components/overlay/src/Overlay.js");this.overlay=new t,this.host.open=!0,this.host.requestUpdate()}),import("@spectrum-web-components/overlay/sp-overlay.js")}}get overlay(){return this._overlay}set overlay(e){e&&this.overlay!==e&&(this._overlay=e,this.initOverlay())}releaseDescription(){}handleBeforetoggle(e){var t;e.composedPath()[0]===e.target&&(e.newState==="closed"&&(this.preventNextToggle==="no"?this.open=!1:this.pointerdownState||(t=this.overlay)==null||t.manuallyKeepOpen()),this.open||(this.host.optionsMenu.updateSelectedItemIndex(),this.host.optionsMenu.closeDescendentOverlays()))}initOverlay(){this.overlay&&(this.overlay.addEventListener("beforetoggle",e=>{this.handleBeforetoggle(e)}),this.overlay.type=this.host.isMobile.matches?"modal":"auto",this.overlay.triggerElement=this.host,this.overlay.placement=this.host.isMobile.matches?void 0:this.host.placement,this.overlay.receivesFocus="true",this.overlay.willPreventClose=this.preventNextToggle!=="no"&&this.open,this.overlay.addEventListener("slottable-request",this.host.handleSlottableRequest))}handlePointerdown(e){}handleButtonFocus(e){this.preventNextToggle==="maybe"&&e.relatedTarget===this.host.optionsMenu&&(this.preventNextToggle="yes")}handleActivate(e){}init(){}abort(){var e;this.releaseDescription(),(e=this.abortController)==null||e.abort()}hostConnected(){this.init()}hostDisconnected(){var e;(e=this.abortController)==null||e.abort()}hostUpdated(){this.overlay&&this.host.dependencyManager.loaded&&this.host.open!==this.overlay.open&&(this.overlay.willPreventClose=this.preventNextToggle!=="no",this.overlay.open=this.host.open)}}
+//# 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 {\n    ReactiveController,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport { AbstractOverlay } from '@spectrum-web-components/overlay/src/AbstractOverlay';\nimport { Overlay } from '@spectrum-web-components/overlay/src/Overlay.js';\nimport { PickerBase } from './Picker.js';\n\nexport enum InteractionTypes {\n    'desktop',\n    'mobile',\n}\n\nexport class InteractionController implements ReactiveController {\n    abortController!: AbortController;\n\n    public preventNextToggle: 'no' | 'maybe' | 'yes' = 'no';\n    public pointerdownState = false;\n    public enterKeydownOn: EventTarget | null = null;\n\n    public container!: TemplateResult;\n\n    get activelyOpening(): boolean {\n        return false;\n    }\n\n    private _open = false;\n\n    public get open(): boolean {\n        return this._open;\n    }\n\n    /**\n     * Set `open`\n     */\n    public set open(open: boolean) {\n        if (this._open === open) return;\n        this._open = open;\n\n        if (this.overlay) {\n            this.host.open = open;\n            return;\n        }\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(\n                    '@spectrum-web-components/overlay/src/Overlay.js'\n                );\n                this.overlay = new Overlay();\n                this.host.open = true;\n                this.host.requestUpdate();\n            });\n        import('@spectrum-web-components/overlay/sp-overlay.js');\n    }\n\n    private _overlay!: AbstractOverlay;\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        this._overlay = overlay;\n        this.initOverlay();\n    }\n\n    type!: InteractionTypes;\n\n    constructor(\n        public target: HTMLElement,\n        public host: PickerBase\n    ) {\n        this.target = target;\n        this.host = host;\n        this.host.addController(this);\n        this.init();\n    }\n\n    releaseDescription(): void {}\n\n    protected handleBeforetoggle(\n        event: Event & {\n            target: Overlay;\n            newState: 'open' | 'closed';\n        }\n    ): void {\n        if (event.composedPath()[0] !== event.target) {\n            return;\n        }\n        if (event.newState === 'closed') {\n            if (this.preventNextToggle === 'no') {\n                this.open = false;\n            } else if (!this.pointerdownState) {\n                // Prevent browser driven closure while opening the Picker\n                // and the expected event series has not completed.\n                this.overlay?.manuallyKeepOpen();\n            }\n        }\n        if (!this.open) {\n            this.host.optionsMenu.updateSelectedItemIndex();\n            this.host.optionsMenu.closeDescendentOverlays();\n        }\n    }\n\n    initOverlay(): void {\n        if (this.overlay) {\n            this.overlay.addEventListener('beforetoggle', (event: Event) => {\n                this.handleBeforetoggle(\n                    event as Event & {\n                        target: Overlay;\n                        newState: 'open' | 'closed';\n                    }\n                );\n            });\n            this.overlay.type = this.host.isMobile.matches ? 'modal' : 'auto';\n            this.overlay.triggerElement = this.host as HTMLElement;\n            this.overlay.placement = this.host.isMobile.matches\n                ? undefined\n                : this.host.placement;\n            this.overlay.receivesFocus = 'true';\n            this.overlay.willPreventClose =\n                this.preventNextToggle !== 'no' && this.open;\n            this.overlay.addEventListener(\n                'slottable-request',\n                this.host.handleSlottableRequest\n            );\n        }\n    }\n\n    public handlePointerdown(_event: PointerEvent): void {}\n\n    public handleButtonFocus(event: FocusEvent): void {\n        // When focus comes from a pointer event, and the related target is the Menu,\n        // we don't want to reopen the Menu.\n        if (\n            this.preventNextToggle === 'maybe' &&\n            event.relatedTarget === this.host.optionsMenu\n        ) {\n            this.preventNextToggle = 'yes';\n        }\n    }\n\n    public handleActivate(_event: Event): void {}\n\n    /* c8 ignore next 3 */\n    init(): void {}\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        this.abortController?.abort();\n    }\n\n    public hostUpdated(): void {\n        if (\n            this.overlay &&\n            this.host.dependencyManager.loaded &&\n            this.host.open !== this.overlay.open\n        ) {\n            this.overlay.willPreventClose = this.preventNextToggle !== 'no';\n            this.overlay.open = this.host.open;\n        }\n    }\n}\n"],
+  "mappings": "aAoBO,WAAK,kBAAAA,IACRA,IAAA,qBACAA,IAAA,mBAFQA,IAAA,sBAKL,aAAM,qBAAoD,CA6D7D,YACWC,EACAC,EACT,CAFS,YAAAD,EACA,UAAAC,EA5DX,KAAO,kBAA4C,KACnD,KAAO,iBAAmB,GAC1B,KAAO,eAAqC,KAQ5C,KAAQ,MAAQ,GAoDZ,KAAK,OAASD,EACd,KAAK,KAAOC,EACZ,KAAK,KAAK,cAAc,IAAI,EAC5B,KAAK,KAAK,CACd,CA5DA,IAAI,iBAA2B,CAC3B,MAAO,EACX,CAIA,IAAW,MAAgB,CACvB,OAAO,KAAK,KAChB,CAKA,IAAW,KAAKC,EAAe,CAC3B,GAAI,KAAK,QAAUA,EAGnB,IAFA,KAAK,MAAQA,EAET,KAAK,QAAS,CACd,KAAK,KAAK,KAAOA,EACjB,MACJ,CAIA,eACK,YAAY,YAAY,EACxB,KAAK,SAA2B,CAC7B,KAAM,CAAE,QAAAC,CAAQ,EAAI,KAAM,QACtB,iDACJ,EACA,KAAK,QAAU,IAAIA,EACnB,KAAK,KAAK,KAAO,GACjB,KAAK,KAAK,cAAc,CAC5B,CAAC,EACL,OAAO,gDAAgD,EAC3D,CAIA,IAAW,SAA2B,CAClC,OAAO,KAAK,QAChB,CAEA,IAAW,QAAQC,EAAsC,CAChDA,GACD,KAAK,UAAYA,IACrB,KAAK,SAAWA,EAChB,KAAK,YAAY,EACrB,CAcA,oBAA2B,CAAC,CAElB,mBACNC,EAII,CAvGZ,IAAAC,EAwGYD,EAAM,aAAa,EAAE,CAAC,IAAMA,EAAM,SAGlCA,EAAM,WAAa,WACf,KAAK,oBAAsB,KAC3B,KAAK,KAAO,GACJ,KAAK,mBAGbC,EAAA,KAAK,UAAL,MAAAA,EAAc,oBAGjB,KAAK,OACN,KAAK,KAAK,YAAY,wBAAwB,EAC9C,KAAK,KAAK,YAAY,wBAAwB,GAEtD,CAEA,aAAoB,CACZ,KAAK,UACL,KAAK,QAAQ,iBAAiB,eAAiBD,GAAiB,CAC5D,KAAK,mBACDA,CAIJ,CACJ,CAAC,EACD,KAAK,QAAQ,KAAO,KAAK,KAAK,SAAS,QAAU,QAAU,OAC3D,KAAK,QAAQ,eAAiB,KAAK,KACnC,KAAK,QAAQ,UAAY,KAAK,KAAK,SAAS,QACtC,OACA,KAAK,KAAK,UAChB,KAAK,QAAQ,cAAgB,OAC7B,KAAK,QAAQ,iBACT,KAAK,oBAAsB,MAAQ,KAAK,KAC5C,KAAK,QAAQ,iBACT,oBACA,KAAK,KAAK,sBACd,EAER,CAEO,kBAAkBE,EAA4B,CAAC,CAE/C,kBAAkBF,EAAyB,CAI1C,KAAK,oBAAsB,SAC3BA,EAAM,gBAAkB,KAAK,KAAK,cAElC,KAAK,kBAAoB,MAEjC,CAEO,eAAeE,EAAqB,CAAC,CAG5C,MAAa,CAAC,CAEd,OAAc,CArKlB,IAAAD,EAsKQ,KAAK,mBAAmB,GACxBA,EAAA,KAAK,kBAAL,MAAAA,EAAsB,OAC1B,CAEA,eAAsB,CAClB,KAAK,KAAK,CACd,CAEA,kBAAyB,CA9K7B,IAAAA,GA+KQA,EAAA,KAAK,kBAAL,MAAAA,EAAsB,OAC1B,CAEO,aAAoB,CAEnB,KAAK,SACL,KAAK,KAAK,kBAAkB,QAC5B,KAAK,KAAK,OAAS,KAAK,QAAQ,OAEhC,KAAK,QAAQ,iBAAmB,KAAK,oBAAsB,KAC3D,KAAK,QAAQ,KAAO,KAAK,KAAK,KAEtC,CACJ",
+  "names": ["InteractionTypes", "target", "host", "open", "Overlay", "overlay", "event", "_a", "_event"]
+}

package/src/MobileController.d.ts

@@ -0,0 +1,9 @@
+import { InteractionController, InteractionTypes } from './InteractionController.js';
+export declare const SAFARI_FOCUS_RING_CLASS = "remove-focus-ring-safari-hack";
+export declare class MobileController extends InteractionController {
+    type: InteractionTypes;
+    handleClick(): void;
+    handlePointerdown(): void;
+    private handleFocusOut;
+    init(): void;
+}

package/src/MobileController.dev.js

@@ -0,0 +1,51 @@
+"use strict";
+import {
+  InteractionController,
+  InteractionTypes
+} from "./InteractionController.dev.js";
+import { isWebKit } from "@spectrum-web-components/shared";
+export const SAFARI_FOCUS_RING_CLASS = "remove-focus-ring-safari-hack";
+export class MobileController extends InteractionController {
+  constructor() {
+    super(...arguments);
+    this.type = InteractionTypes.mobile;
+  }
+  handleClick() {
+    if (this.preventNextToggle == "no") {
+      this.open = !this.open;
+    }
+    this.preventNextToggle = "no";
+  }
+  handlePointerdown() {
+    this.preventNextToggle = this.open ? "yes" : "no";
+    if (isWebKit()) {
+      this.target.classList.add(SAFARI_FOCUS_RING_CLASS);
+    }
+  }
+  handleFocusOut() {
+    if (this.host.open) {
+      return;
+    }
+    if (isWebKit() && this.target.classList.contains(SAFARI_FOCUS_RING_CLASS)) {
+      this.target.classList.remove(SAFARI_FOCUS_RING_CLASS);
+    }
+  }
+  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 }
+    );
+    this.target.addEventListener("focusout", () => this.handleFocusOut(), {
+      signal
+    });
+  }
+}
+//# sourceMappingURL=MobileController.dev.js.map

package/src/MobileController.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["MobileController.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\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'\nimport { isWebKit } from '@spectrum-web-components/shared';\n\nexport const SAFARI_FOCUS_RING_CLASS = 'remove-focus-ring-safari-hack';\n\nexport class MobileController extends InteractionController {\n    override type = InteractionTypes.mobile;\n\n    handleClick(): void {\n        if (this.preventNextToggle == 'no') {\n            this.open = !this.open;\n        }\n        this.preventNextToggle = 'no';\n    }\n\n    public override handlePointerdown(): void {\n        this.preventNextToggle = this.open ? 'yes' : 'no';\n        if (isWebKit()) {\n            this.target.classList.add(SAFARI_FOCUS_RING_CLASS);\n        }\n    }\n\n    private handleFocusOut(): void {\n        if (this.host.open) {\n            return;\n        }\n        if (\n            isWebKit() &&\n            this.target.classList.contains(SAFARI_FOCUS_RING_CLASS)\n        ) {\n            this.target.classList.remove(SAFARI_FOCUS_RING_CLASS);\n        }\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        this.target.addEventListener('focusout', () => this.handleFocusOut(), {\n            signal,\n        });\n    }\n}\n"],
+  "mappings": ";AAWA;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,gBAAgB;AAElB,aAAM,0BAA0B;AAEhC,aAAM,yBAAyB,sBAAsB;AAAA,EAArD;AAAA;AACH,SAAS,OAAO,iBAAiB;AAAA;AAAA,EAEjC,cAAoB;AAChB,QAAI,KAAK,qBAAqB,MAAM;AAChC,WAAK,OAAO,CAAC,KAAK;AAAA,IACtB;AACA,SAAK,oBAAoB;AAAA,EAC7B;AAAA,EAEgB,oBAA0B;AACtC,SAAK,oBAAoB,KAAK,OAAO,QAAQ;AAC7C,QAAI,SAAS,GAAG;AACZ,WAAK,OAAO,UAAU,IAAI,uBAAuB;AAAA,IACrD;AAAA,EACJ;AAAA,EAEQ,iBAAuB;AAC3B,QAAI,KAAK,KAAK,MAAM;AAChB;AAAA,IACJ;AACA,QACI,SAAS,KACT,KAAK,OAAO,UAAU,SAAS,uBAAuB,GACxD;AACE,WAAK,OAAO,UAAU,OAAO,uBAAuB;AAAA,IACxD;AAAA,EACJ;AAAA,EAES,OAAa;AAhD1B;AAkDQ,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;AACA,SAAK,OAAO,iBAAiB,YAAY,MAAM,KAAK,eAAe,GAAG;AAAA,MAClE;AAAA,IACJ,CAAC;AAAA,EACL;AACJ;",
+  "names": []
+}

package/src/MobileController.js

@@ -0,0 +1,2 @@
+"use strict";import{InteractionController as i,InteractionTypes as r}from"./InteractionController.js";import{isWebKit as o}from"@spectrum-web-components/shared";export const SAFARI_FOCUS_RING_CLASS="remove-focus-ring-safari-hack";export class MobileController extends i{constructor(){super(...arguments);this.type=r.mobile}handleClick(){this.preventNextToggle=="no"&&(this.open=!this.open),this.preventNextToggle="no"}handlePointerdown(){this.preventNextToggle=this.open?"yes":"no",o()&&this.target.classList.add(SAFARI_FOCUS_RING_CLASS)}handleFocusOut(){this.host.open||o()&&this.target.classList.contains(SAFARI_FOCUS_RING_CLASS)&&this.target.classList.remove(SAFARI_FOCUS_RING_CLASS)}init(){var e;(e=this.abortController)==null||e.abort(),this.abortController=new AbortController;const{signal:t}=this.abortController;this.target.addEventListener("click",()=>this.handleClick(),{signal:t}),this.target.addEventListener("pointerdown",()=>this.handlePointerdown(),{signal:t}),this.target.addEventListener("focusout",()=>this.handleFocusOut(),{signal:t})}}
+//# sourceMappingURL=MobileController.js.map

package/src/MobileController.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["MobileController.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\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';\nimport { isWebKit } from '@spectrum-web-components/shared';\n\nexport const SAFARI_FOCUS_RING_CLASS = 'remove-focus-ring-safari-hack';\n\nexport class MobileController extends InteractionController {\n    override type = InteractionTypes.mobile;\n\n    handleClick(): void {\n        if (this.preventNextToggle == 'no') {\n            this.open = !this.open;\n        }\n        this.preventNextToggle = 'no';\n    }\n\n    public override handlePointerdown(): void {\n        this.preventNextToggle = this.open ? 'yes' : 'no';\n        if (isWebKit()) {\n            this.target.classList.add(SAFARI_FOCUS_RING_CLASS);\n        }\n    }\n\n    private handleFocusOut(): void {\n        if (this.host.open) {\n            return;\n        }\n        if (\n            isWebKit() &&\n            this.target.classList.contains(SAFARI_FOCUS_RING_CLASS)\n        ) {\n            this.target.classList.remove(SAFARI_FOCUS_RING_CLASS);\n        }\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        this.target.addEventListener('focusout', () => this.handleFocusOut(), {\n            signal,\n        });\n    }\n}\n"],
+  "mappings": "aAWA,OACI,yBAAAA,EACA,oBAAAC,MACG,6BACP,OAAS,YAAAC,MAAgB,kCAElB,aAAM,wBAA0B,gCAEhC,aAAM,yBAAyBF,CAAsB,CAArD,kCACH,KAAS,KAAOC,EAAiB,OAEjC,aAAoB,CACZ,KAAK,mBAAqB,OAC1B,KAAK,KAAO,CAAC,KAAK,MAEtB,KAAK,kBAAoB,IAC7B,CAEgB,mBAA0B,CACtC,KAAK,kBAAoB,KAAK,KAAO,MAAQ,KACzCC,EAAS,GACT,KAAK,OAAO,UAAU,IAAI,uBAAuB,CAEzD,CAEQ,gBAAuB,CACvB,KAAK,KAAK,MAIVA,EAAS,GACT,KAAK,OAAO,UAAU,SAAS,uBAAuB,GAEtD,KAAK,OAAO,UAAU,OAAO,uBAAuB,CAE5D,CAES,MAAa,CAhD1B,IAAAC,GAkDQA,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,EACA,KAAK,OAAO,iBAAiB,WAAY,IAAM,KAAK,eAAe,EAAG,CAClE,OAAAA,CACJ,CAAC,CACL,CACJ",
+  "names": ["InteractionController", "InteractionTypes", "isWebKit", "_a", "signal"]
+}

package/src/Picker.d.ts

@@ -0,0 +1,133 @@
+import { CSSResultArray, PropertyValues, TemplateResult } from '@spectrum-web-components/base';
+import { StyleInfo } from '@spectrum-web-components/base/src/directives.js';
+import { Focusable } from '@spectrum-web-components/shared/src/focusable.js';
+import type { Tooltip } from '@spectrum-web-components/tooltip';
+import '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';
+import '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';
+import '@spectrum-web-components/menu/sp-menu.js';
+import type { Menu, MenuItem, MenuItemChildren } from '@spectrum-web-components/menu';
+import { Placement } from '@spectrum-web-components/overlay';
+import { MatchMediaController } from '@spectrum-web-components/reactive-controllers/src/MatchMedia.js';
+import { DependencyManagerController } from '@spectrum-web-components/reactive-controllers/src/DependencyManger.js';
+import { PendingStateController } from '@spectrum-web-components/reactive-controllers/src/PendingState.js';
+import { Overlay } from '@spectrum-web-components/overlay/src/Overlay.js';
+import type { SlottableRequestEvent } from '@spectrum-web-components/overlay/src/slottable-request-event.js';
+import type { FieldLabel } from '@spectrum-web-components/field-label';
+import { DesktopController } from './DesktopController.js';
+import { MobileController } from './MobileController.js';
+export declare const DESCRIPTION_ID = "option-picker";
+declare const PickerBase_base: typeof Focusable & {
+    new (...args: any[]): import("@spectrum-web-components/base").SizedElementInterface;
+    prototype: import("@spectrum-web-components/base").SizedElementInterface;
+};
+export declare class PickerBase extends PickerBase_base {
+    isMobile: MatchMediaController;
+    strategy: DesktopController | MobileController;
+    appliedLabel?: string;
+    button: HTMLButtonElement;
+    dependencyManager: DependencyManagerController;
+    private deprecatedMenu;
+    disabled: boolean;
+    focused: boolean;
+    icons?: 'only' | 'none';
+    invalid: boolean;
+    /** Whether the items are currently loading. */
+    pending: boolean;
+    /** Defines a string value that labels the Picker while it is in pending state. */
+    pendingLabel: string;
+    label?: string;
+    open: boolean;
+    readonly: boolean;
+    selects: undefined | 'single';
+    labelAlignment?: 'inline';
+    protected get menuItems(): MenuItem[];
+    optionsMenu: Menu;
+    private _selfManageFocusElement;
+    get selfManageFocusElement(): boolean;
+    overlayElement: Overlay;
+    protected tooltipEl?: Tooltip;
+    /**
+     * @type {"top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end"}
+     * @attr
+     */
+    placement: Placement;
+    quiet: boolean;
+    value: string;
+    get selectedItem(): MenuItem | undefined;
+    pendingStateController: PendingStateController<this>;
+    /**
+     * Initializes the `PendingStateController` for the Picker component.
+     * The `PendingStateController` manages the pending state of the Picker.
+     */
+    constructor();
+    set selectedItem(selectedItem: MenuItem | undefined);
+    _selectedItem?: MenuItem;
+    protected listRole: 'listbox' | 'menu';
+    protected itemRole: string;
+    get focusElement(): HTMLElement;
+    forceFocusVisible(): void;
+    click(): void;
+    handleButtonBlur(): void;
+    focus(options?: FocusOptions): void;
+    handleHelperFocus(): void;
+    handleChange(event: Event): void;
+    handleButtonFocus(event: FocusEvent): void;
+    protected handleKeydown: (event: KeyboardEvent) => void;
+    protected setValueFromItem(item: MenuItem, menuChangeEvent?: Event): Promise<void>;
+    protected setMenuItemSelected(item: MenuItem, value: boolean): void;
+    toggle(target?: boolean): void;
+    close(): void;
+    protected get containerStyles(): StyleInfo;
+    protected get selectedItemContent(): MenuItemChildren;
+    protected set selectedItemContent(selectedItemContent: MenuItemChildren | undefined);
+    _selectedItemContent?: MenuItemChildren;
+    protected handleTooltipSlotchange(event: Event & {
+        target: HTMLSlotElement;
+    }): void;
+    handleSlottableRequest: (_event: SlottableRequestEvent) => void;
+    protected renderLabelContent(content: Node[]): TemplateResult | Node[];
+    protected get buttonContent(): TemplateResult[];
+    applyFocusElementLabel: (value: string, labelElement: FieldLabel) => void;
+    protected renderOverlay(menu: TemplateResult): TemplateResult;
+    protected get renderDescriptionSlot(): TemplateResult;
+    protected render(): TemplateResult;
+    protected update(changes: PropertyValues<this>): void;
+    protected bindButtonKeydownListener(): void;
+    protected updated(changes: PropertyValues<this>): void;
+    protected firstUpdated(changes: PropertyValues<this>): void;
+    protected get dismissHelper(): TemplateResult;
+    protected renderContainer(menu: TemplateResult): TemplateResult;
+    protected hasRenderedOverlay: boolean;
+    private onScroll;
+    protected get renderMenu(): TemplateResult;
+    private willManageSelection;
+    protected shouldScheduleManageSelection(event?: Event): void;
+    protected shouldManageSelection(): void;
+    protected manageSelection(): Promise<void>;
+    private selectionPromise;
+    private selectionResolver;
+    protected getUpdateComplete(): Promise<boolean>;
+    private recentlyConnected;
+    private enterKeydownOn;
+    protected handleEnterKeydown: (event: KeyboardEvent) => void;
+    bindEvents(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+}
+/**
+ * @element sp-picker
+ *
+ * @slot label - The placeholder content for the Picker
+ * @slot description - The description content for the Picker
+ * @slot tooltip - Tooltip to to be applied to the the Picker Button
+ * @slot - menu items to be listed in the Picker
+ * @fires change - Announces that the `value` of the element has changed
+ * @fires sp-opened - Announces that the overlay has been opened
+ * @fires sp-closed - Announces that the overlay has been closed
+ */
+export declare class Picker extends PickerBase {
+    static get styles(): CSSResultArray;
+    protected get containerStyles(): StyleInfo;
+    protected handleKeydown: (event: KeyboardEvent) => void;
+}
+export {};