@spectrum-web-components/picker 1.0.0 → 1.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/picker",
-    "version": "1.0.0",
+    "version": "1.0.2",
     "publishConfig": {
         "access": "public"
     },
@@ -82,20 +82,20 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^1.0.0",
-        "@spectrum-web-components/button": "^1.0.0",
-        "@spectrum-web-components/field-label": "^1.0.0",
-        "@spectrum-web-components/icon": "^1.0.0",
-        "@spectrum-web-components/icons-ui": "^1.0.0",
-        "@spectrum-web-components/icons-workflow": "^1.0.0",
-        "@spectrum-web-components/menu": "^1.0.0",
-        "@spectrum-web-components/overlay": "^1.0.0",
-        "@spectrum-web-components/popover": "^1.0.0",
-        "@spectrum-web-components/progress-circle": "^1.0.0",
-        "@spectrum-web-components/reactive-controllers": "^1.0.0",
-        "@spectrum-web-components/shared": "^1.0.0",
-        "@spectrum-web-components/tooltip": "^1.0.0",
-        "@spectrum-web-components/tray": "^1.0.0"
+        "@spectrum-web-components/base": "^1.0.2",
+        "@spectrum-web-components/button": "^1.0.2",
+        "@spectrum-web-components/field-label": "^1.0.2",
+        "@spectrum-web-components/icon": "^1.0.2",
+        "@spectrum-web-components/icons-ui": "^1.0.2",
+        "@spectrum-web-components/icons-workflow": "^1.0.2",
+        "@spectrum-web-components/menu": "^1.0.2",
+        "@spectrum-web-components/overlay": "^1.0.2",
+        "@spectrum-web-components/popover": "^1.0.2",
+        "@spectrum-web-components/progress-circle": "^1.0.2",
+        "@spectrum-web-components/reactive-controllers": "^1.0.2",
+        "@spectrum-web-components/shared": "^1.0.2",
+        "@spectrum-web-components/tooltip": "^1.0.2",
+        "@spectrum-web-components/tray": "^1.0.2"
     },
     "devDependencies": {
         "@spectrum-css/picker": "^9.0.0-s2-foundations.15"
@@ -107,6 +107,5 @@
         "./**/*.dev.js",
         "./sync/index.js",
         "./sync/sp-*.js"
-    ],
-    "gitHead": "5cf5d34645bf9494ebd20f64c42d1619523d2d84"
+    ]
 }

package/src/DesktopController.dev.js

@@ -9,7 +9,7 @@ export class DesktopController extends InteractionController {
     this.type = InteractionTypes.desktop;
   }
   handlePointerdown(event) {
-    if (event.button !== 0) {
+    if (event.button !== 0 || event.pointerType === "touch") {
       return;
     }
     this.pointerdownState = this.open;

package/src/DesktopController.dev.js.map

@@ -1,7 +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) {\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,GAAG;AACpB;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;",
+  "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

@@ -1,2 +1,2 @@
-"use strict";import{InteractionController as i,InteractionTypes as r}from"./InteractionController.js";export class DesktopController extends i{constructor(){super(...arguments);this.type=r.desktop}handlePointerdown(e){if(e.button!==0)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})}}
+"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

@@ -1,7 +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) {\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,EACjB,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",
+  "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/Picker.dev.js

@@ -431,7 +431,7 @@ export class PickerBase extends SizedMixin(Focusable, { noDefaultSize: true }) {
         if (!this.label && !this.getAttribute("aria-label") && !this.getAttribute("aria-labelledby") && !this.appliedLabel) {
           window.__swc.warn(
             this,
-            "<${this.localName}> needs one of the following to be accessible:",
+            `<${this.localName}> needs one of the following to be accessible:`,
             "https://opensource.adobe.com/spectrum-web-components/components/picker/#accessibility",
             {
               type: "accessibility",

package/src/Picker.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["Picker.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n    CSSResultArray,\n    DefaultElementSize,\n    html,\n    nothing,\n    PropertyValues,\n    render,\n    SizedMixin,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n    classMap,\n    ifDefined,\n    StyleInfo,\n    styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n    property,\n    query,\n    state,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport pickerStyles from './picker.css.js';\nimport chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport chevronIconOverrides from '@spectrum-web-components/icon/src/icon-chevron-overrides.css.js';\n\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\nimport type { Tooltip } from '@spectrum-web-components/tooltip';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport type {\n    Menu,\n    MenuItem,\n    MenuItemChildren,\n} from '@spectrum-web-components/menu';\nimport { Placement } from '@spectrum-web-components/overlay';\nimport {\n    IS_MOBILE,\n    MatchMediaController,\n} from '@spectrum-web-components/reactive-controllers/src/MatchMedia.js';\nimport { DependencyManagerController } from '@spectrum-web-components/reactive-controllers/src/DependencyManger.js';\nimport { PendingStateController } from '@spectrum-web-components/reactive-controllers/src/PendingState.js';\nimport { Overlay } from '@spectrum-web-components/overlay/src/Overlay.js';\nimport type { SlottableRequestEvent } from '@spectrum-web-components/overlay/src/slottable-request-event.js';\nimport type { FieldLabel } from '@spectrum-web-components/field-label';\n\nimport { DesktopController } from './DesktopController.dev.js'\nimport { MobileController } from './MobileController.dev.js'\nimport { strategies } from './strategies.dev.js'\n\nconst chevronClass = {\n    s: 'spectrum-UIIcon-ChevronDown75',\n    m: 'spectrum-UIIcon-ChevronDown100',\n    l: 'spectrum-UIIcon-ChevronDown200',\n    xl: 'spectrum-UIIcon-ChevronDown300',\n};\n\nexport const DESCRIPTION_ID = 'option-picker';\nexport class PickerBase extends SizedMixin(Focusable, { noDefaultSize: true }) {\n    public isMobile = new MatchMediaController(this, IS_MOBILE);\n\n    public strategy!: DesktopController | MobileController;\n\n    @state()\n    appliedLabel?: string;\n\n    @query('#button')\n    public button!: HTMLButtonElement;\n\n    public dependencyManager = new DependencyManagerController(this);\n\n    private deprecatedMenu: Menu | null = null;\n\n    @property({ type: Boolean, reflect: true })\n    public override disabled = false;\n\n    @property({ type: Boolean, reflect: true })\n    public focused = false;\n\n    @property({ type: String, reflect: true })\n    public icons?: 'only' | 'none';\n\n    @property({ type: Boolean, reflect: true })\n    public invalid = false;\n\n    /** Whether the items are currently loading. */\n    @property({ type: Boolean, reflect: true })\n    public pending = false;\n\n    /** Defines a string value that labels the Picker while it is in pending state. */\n    @property({ type: String, attribute: 'pending-label' })\n    public pendingLabel = 'Pending';\n\n    @property()\n    public label?: string;\n\n    @property({ type: Boolean, reflect: true })\n    public open = false;\n\n    @property({ type: Boolean, reflect: true })\n    public readonly = false;\n\n    public selects: undefined | 'single' = 'single';\n\n    @state()\n    public labelAlignment?: 'inline';\n\n    protected get menuItems(): MenuItem[] {\n        return this.optionsMenu.childItems;\n    }\n\n    @query('sp-menu')\n    public optionsMenu!: Menu;\n\n    private _selfManageFocusElement = false;\n\n    public override get selfManageFocusElement(): boolean {\n        return this._selfManageFocusElement;\n    }\n\n    @query('sp-overlay')\n    public overlayElement!: Overlay;\n\n    protected tooltipEl?: Tooltip;\n\n    /**\n     * @type {\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"}\n     * @attr\n     */\n\n    @property()\n    public placement: Placement = 'bottom-start';\n\n    @property({ type: Boolean, reflect: true })\n    public quiet = false;\n\n    @property({ type: String })\n    public value = '';\n\n    @property({ attribute: false })\n    public get selectedItem(): MenuItem | undefined {\n        return this._selectedItem;\n    }\n\n    public pendingStateController: PendingStateController<this>;\n\n    /**\n     * Initializes the `PendingStateController` for the Picker component.\n     * The `PendingStateController` manages the pending state of the Picker.\n     */\n    constructor() {\n        super();\n        this.pendingStateController = new PendingStateController(this);\n    }\n\n    public set selectedItem(selectedItem: MenuItem | undefined) {\n        this.selectedItemContent = selectedItem\n            ? selectedItem.itemChildren\n            : undefined;\n\n        if (selectedItem === this.selectedItem) return;\n        const oldSelectedItem = this.selectedItem;\n        this._selectedItem = selectedItem;\n        this.requestUpdate('selectedItem', oldSelectedItem);\n    }\n\n    _selectedItem?: MenuItem;\n\n    protected listRole: 'listbox' | 'menu' = 'listbox';\n    protected itemRole = 'option';\n\n    public override get focusElement(): HTMLElement {\n        if (this.open) {\n            return this.optionsMenu;\n        }\n        return this.button;\n    }\n\n    public forceFocusVisible(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.focused = true;\n    }\n\n    public override click(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.toggle();\n    }\n\n    public handleButtonBlur(): void {\n        this.focused = false;\n    }\n\n    public override focus(options?: FocusOptions): void {\n        super.focus(options);\n\n        if (!this.disabled && this.focusElement) {\n            this.focused = this.hasVisibleFocusInTree();\n        }\n    }\n\n    public handleHelperFocus(): void {\n        // set focused to true here instead of handleButtonFocus so clicks don't flash a focus outline\n        this.focused = true;\n        this.button.focus();\n    }\n\n    public handleChange(event: Event): void {\n        if (this.strategy) {\n            this.strategy.preventNextToggle = 'no';\n        }\n        const target = event.target as Menu;\n        const [selected] = target.selectedItems;\n        event.stopPropagation();\n        if (event.cancelable) {\n            this.setValueFromItem(selected, event);\n        } else {\n            // Non-cancelable \"change\" events announce a selection with no value\n            // change that should close the Picker element.\n            this.open = false;\n            if (this.strategy) {\n                this.strategy.open = false;\n            }\n        }\n    }\n\n    public handleButtonFocus(event: FocusEvent): void {\n        this.strategy?.handleButtonFocus(event);\n    }\n\n    protected handleKeydown = (event: KeyboardEvent): void => {\n        this.focused = true;\n        if (event.code !== 'ArrowDown' && event.code !== 'ArrowUp') {\n            return;\n        }\n        event.stopPropagation();\n        event.preventDefault();\n        this.toggle(true);\n    };\n\n    protected async setValueFromItem(\n        item: MenuItem,\n        menuChangeEvent?: Event\n    ): Promise<void> {\n        this.open = false;\n        // should always close when \"setting\" a value\n        if (this.strategy) {\n            this.strategy.open = false;\n        }\n        const oldSelectedItem = this.selectedItem;\n        const oldValue = this.value;\n\n        // Set a value.\n        this.selectedItem = item;\n        this.value = item?.value ?? '';\n        await this.updateComplete;\n        const applyDefault = this.dispatchEvent(\n            new Event('change', {\n                bubbles: true,\n                // Allow it to be prevented.\n                cancelable: true,\n                composed: true,\n            })\n        );\n        if (!applyDefault && this.selects) {\n            if (menuChangeEvent) {\n                menuChangeEvent.preventDefault();\n            }\n            this.setMenuItemSelected(this.selectedItem as MenuItem, false);\n            if (oldSelectedItem) {\n                this.setMenuItemSelected(oldSelectedItem, true);\n            }\n            this.selectedItem = oldSelectedItem;\n            this.value = oldValue;\n            this.open = true;\n            if (this.strategy) {\n                this.strategy.open = true;\n            }\n            return;\n        } else if (!this.selects) {\n            // Unset the value if not carrying a selection\n            this.selectedItem = oldSelectedItem;\n            this.value = oldValue;\n            return;\n        }\n        if (oldSelectedItem) {\n            this.setMenuItemSelected(oldSelectedItem, false);\n        }\n        this.setMenuItemSelected(item, !!this.selects);\n    }\n\n    protected setMenuItemSelected(item: MenuItem, value: boolean): void {\n        // matches null | undefined\n        if (this.selects == null) return;\n        item.selected = value;\n    }\n\n    public toggle(target?: boolean): void {\n        if (this.readonly || this.pending) {\n            return;\n        }\n        this.open = typeof target !== 'undefined' ? target : !this.open;\n        if (this.strategy) {\n            this.strategy.open = this.open;\n        }\n        if (this.open) {\n            this._selfManageFocusElement = true;\n        } else {\n            this._selfManageFocusElement = false;\n        }\n    }\n\n    public close(): void {\n        if (this.readonly) {\n            return;\n        }\n        if (this.strategy) {\n            this.open = false;\n            this.strategy.open = false;\n        }\n    }\n\n    protected get containerStyles(): StyleInfo {\n        // @todo: test in mobile\n        /* c8 ignore next 5 */\n        if (this.isMobile.matches) {\n            return {\n                '--swc-menu-width': '100%',\n            };\n        }\n        return {};\n    }\n\n    @state()\n    protected get selectedItemContent(): MenuItemChildren {\n        return this._selectedItemContent || { icon: [], content: [] };\n    }\n\n    protected set selectedItemContent(\n        selectedItemContent: MenuItemChildren | undefined\n    ) {\n        if (selectedItemContent === this.selectedItemContent) return;\n\n        const oldContent = this.selectedItemContent;\n        this._selectedItemContent = selectedItemContent;\n        this.requestUpdate('selectedItemContent', oldContent);\n    }\n\n    _selectedItemContent?: MenuItemChildren;\n\n    protected handleTooltipSlotchange(\n        event: Event & { target: HTMLSlotElement }\n    ): void {\n        this.tooltipEl = event.target.assignedElements()[0] as\n            | Tooltip\n            | undefined;\n    }\n\n    public handleSlottableRequest = (_event: SlottableRequestEvent): void => {};\n\n    protected renderLabelContent(content: Node[]): TemplateResult | Node[] {\n        if (this.value && this.selectedItem) {\n            return content;\n        }\n        return html`\n            <slot name=\"label\" id=\"label\">\n                <span\n                    aria-hidden=${ifDefined(\n                        this.appliedLabel ? undefined : 'true'\n                    )}\n                >\n                    ${this.label}\n                </span>\n            </slot>\n        `;\n    }\n\n    protected get buttonContent(): TemplateResult[] {\n        const labelClasses = {\n            'visually-hidden': this.icons === 'only' && !!this.value,\n            placeholder: !this.value,\n            label: true,\n        };\n        const appliedLabel = this.appliedLabel || this.label;\n        return [\n            html`\n                <span id=\"icon\" ?hidden=${this.icons === 'none'}>\n                    ${this.selectedItemContent.icon}\n                </span>\n                <span\n                    id=${ifDefined(\n                        this.value && this.selectedItem ? 'label' : undefined\n                    )}\n                    class=${classMap(labelClasses)}\n                >\n                    ${this.renderLabelContent(this.selectedItemContent.content)}\n                </span>\n                ${this.value && this.selectedItem\n                    ? html`\n                          <span\n                              aria-hidden=\"true\"\n                              class=\"visually-hidden\"\n                              id=\"applied-label\"\n                          >\n                              ${appliedLabel}\n                              <slot name=\"label\"></slot>\n                          </span>\n                      `\n                    : html`\n                          <span hidden id=\"applied-label\">${appliedLabel}</span>\n                      `}\n                ${this.invalid && !this.pending\n                    ? html`\n                          <sp-icon-alert\n                              class=\"validation-icon\"\n                          ></sp-icon-alert>\n                      `\n                    : nothing}\n                ${this.pendingStateController.renderPendingState()}\n                <sp-icon-chevron100\n                    class=\"picker ${chevronClass[\n                        this.size as DefaultElementSize\n                    ]}\"\n                ></sp-icon-chevron100>\n                <slot\n                    aria-hidden=\"true\"\n                    name=\"tooltip\"\n                    id=\"tooltip\"\n                    @slotchange=${this.handleTooltipSlotchange}\n                ></slot>\n            `,\n        ];\n    }\n\n    applyFocusElementLabel = (\n        value: string,\n        labelElement: FieldLabel\n    ): void => {\n        this.appliedLabel = value;\n        this.labelAlignment = labelElement.sideAligned ? 'inline' : undefined;\n    };\n\n    protected renderOverlay(menu: TemplateResult): TemplateResult {\n        if (this.strategy?.overlay === undefined) {\n            return menu;\n        }\n        const container = this.renderContainer(menu);\n        render(container, this.strategy?.overlay as unknown as HTMLElement, {\n            host: this,\n        });\n        return this.strategy?.overlay as unknown as TemplateResult;\n    }\n\n    protected get renderDescriptionSlot(): TemplateResult {\n        return html`\n            <div id=${DESCRIPTION_ID}>\n                <slot name=\"description\"></slot>\n            </div>\n        `;\n    }\n    // a helper to throw focus to the button is needed because Safari\n    // won't include buttons in the tab order even with tabindex=\"0\"\n    protected override render(): TemplateResult {\n        if (this.tooltipEl) {\n            this.tooltipEl.disabled = this.open;\n        }\n        return html`\n            <span\n                id=\"focus-helper\"\n                tabindex=\"${this.focused || this.open ? '-1' : '0'}\"\n                @focus=${this.handleHelperFocus}\n                aria-describedby=${DESCRIPTION_ID}\n            ></span>\n            <button\n                aria-controls=${ifDefined(this.open ? 'menu' : undefined)}\n                aria-describedby=\"tooltip\"\n                aria-expanded=${this.open ? 'true' : 'false'}\n                aria-haspopup=\"true\"\n                aria-labelledby=\"loader icon label applied-label\"\n                id=\"button\"\n                class=${ifDefined(\n                    this.labelAlignment\n                        ? `label-${this.labelAlignment}`\n                        : undefined\n                )}\n                @blur=${this.handleButtonBlur}\n                @keydown=${{\n                    handleEvent: this.handleEnterKeydown,\n                    capture: true,\n                }}\n                ?disabled=${this.disabled}\n                tabindex=\"-1\"\n            >\n                ${this.buttonContent}\n            </button>\n            ${this.renderMenu} ${this.renderDescriptionSlot}\n        `;\n    }\n\n    protected override update(changes: PropertyValues<this>): void {\n        if (this.selects) {\n            // Always force `selects` to \"single\" when set.\n            // TODO: Add support functionally and visually for \"multiple\"\n            this.selects = 'single';\n        }\n        if (changes.has('disabled') && this.disabled) {\n            if (this.strategy) {\n                this.open = false;\n                this.strategy.open = false;\n            }\n        }\n        if (changes.has('pending') && this.pending) {\n            if (this.strategy) {\n                this.open = false;\n                this.strategy.open = false;\n            }\n        }\n        if (changes.has('value')) {\n            // MenuItems update a frame late for <slot> management,\n            // await the same here.\n            this.shouldScheduleManageSelection();\n        }\n        // Maybe it's finally time to remove this support?\n        if (!this.hasUpdated) {\n            this.deprecatedMenu = this.querySelector(':scope > sp-menu');\n            this.deprecatedMenu?.toggleAttribute('ignore', true);\n            this.deprecatedMenu?.setAttribute('selects', 'inherit');\n        }\n        if (window.__swc.DEBUG) {\n            if (!this.hasUpdated && this.querySelector(':scope > sp-menu')) {\n                const { localName } = this;\n                window.__swc.warn(\n                    this,\n                    `You no longer need to provide an <sp-menu> child to ${localName}. Any styling or attributes on the <sp-menu> will be ignored.`,\n                    'https://opensource.adobe.com/spectrum-web-components/components/picker/#sizes',\n                    { level: 'deprecation' }\n                );\n            }\n            this.updateComplete.then(async () => {\n                // Attributes should be user supplied, making them available before first update.\n                // However, `appliesLabel` is applied by external elements that must be update complete as well to be bound appropriately.\n                await new Promise((res) => requestAnimationFrame(res));\n                await new Promise((res) => requestAnimationFrame(res));\n                if (\n                    !this.label &&\n                    !this.getAttribute('aria-label') &&\n                    !this.getAttribute('aria-labelledby') &&\n                    !this.appliedLabel\n                ) {\n                    window.__swc.warn(\n                        this,\n                        '<${this.localName}> needs one of the following to be accessible:',\n                        'https://opensource.adobe.com/spectrum-web-components/components/picker/#accessibility',\n                        {\n                            type: 'accessibility',\n                            issues: [\n                                `an <sp-field-label> element with a \\`for\\` attribute referencing the \\`id\\` of the \\`<${this.localName}>\\`, or`,\n                                'value supplied to the \"label\" attribute, which will be displayed visually as placeholder text, or',\n                                'text content supplied in a <span> with slot=\"label\", which will also be displayed visually as placeholder text.',\n                            ],\n                        }\n                    );\n                }\n            });\n        }\n        super.update(changes);\n    }\n\n    protected bindButtonKeydownListener(): void {\n        this.button.addEventListener('keydown', this.handleKeydown);\n    }\n\n    protected override updated(changes: PropertyValues<this>): void {\n        super.updated(changes);\n        if (changes.has('open')) {\n            this.strategy.open = this.open;\n        }\n    }\n\n    protected override firstUpdated(changes: PropertyValues<this>): void {\n        super.firstUpdated(changes);\n        this.bindButtonKeydownListener();\n        this.bindEvents();\n    }\n\n    protected get dismissHelper(): TemplateResult {\n        return html`\n            <div class=\"visually-hidden\">\n                <button\n                    tabindex=\"-1\"\n                    aria-label=\"Dismiss\"\n                    @click=${this.close}\n                ></button>\n            </div>\n        `;\n    }\n\n    protected renderContainer(menu: TemplateResult): TemplateResult {\n        const accessibleMenu = html`\n            ${this.dismissHelper} ${menu} ${this.dismissHelper}\n        `;\n        // @todo: test in mobile\n        /* c8 ignore next 11 */\n        if (this.isMobile.matches) {\n            this.dependencyManager.add('sp-tray');\n            import('@spectrum-web-components/tray/sp-tray.js');\n            return html`\n                <sp-tray\n                    id=\"popover\"\n                    role=\"presentation\"\n                    style=${styleMap(this.containerStyles)}\n                >\n                    ${accessibleMenu}\n                </sp-tray>\n            `;\n        }\n        this.dependencyManager.add('sp-popover');\n        import('@spectrum-web-components/popover/sp-popover.js');\n        return html`\n            <sp-popover\n                id=\"popover\"\n                role=\"presentation\"\n                style=${styleMap(this.containerStyles)}\n                placement=${this.placement}\n            >\n                ${accessibleMenu}\n            </sp-popover>\n        `;\n    }\n\n    protected hasRenderedOverlay = false;\n\n    private onScroll(): void {\n        this.dispatchEvent(\n            new Event('scroll', {\n                cancelable: true,\n                composed: true,\n            })\n        );\n    }\n\n    protected get renderMenu(): TemplateResult {\n        const menu = html`\n            <sp-menu\n                aria-labelledby=\"applied-label\"\n                @change=${this.handleChange}\n                id=\"menu\"\n                @keydown=${{\n                    handleEvent: this.handleEnterKeydown,\n                    capture: true,\n                }}\n                @scroll=${this.onScroll}\n                role=${this.listRole}\n                .selects=${this.selects}\n                .selected=${this.value ? [this.value] : []}\n                size=${this.size}\n                @sp-menu-item-added-or-updated=${this.shouldManageSelection}\n            >\n                <slot @slotchange=${this.shouldScheduleManageSelection}></slot>\n            </sp-menu>\n        `;\n        this.hasRenderedOverlay =\n            this.hasRenderedOverlay ||\n            this.focused ||\n            this.open ||\n            !!this.deprecatedMenu;\n        if (this.hasRenderedOverlay) {\n            if (this.dependencyManager.loaded) {\n                this.dependencyManager.add('sp-overlay');\n            }\n            return this.renderOverlay(menu);\n        }\n        return menu;\n    }\n\n    private willManageSelection = false;\n\n    protected shouldScheduleManageSelection(event?: Event): void {\n        if (\n            !this.willManageSelection &&\n            (!event ||\n                ((event.target as HTMLElement).getRootNode() as ShadowRoot)\n                    .host === this)\n        ) {\n            this.willManageSelection = true;\n            requestAnimationFrame(() => {\n                requestAnimationFrame(() => {\n                    this.manageSelection();\n                });\n            });\n        }\n    }\n\n    protected shouldManageSelection(): void {\n        if (this.willManageSelection) {\n            return;\n        }\n        this.willManageSelection = true;\n        this.manageSelection();\n    }\n\n    protected async manageSelection(): Promise<void> {\n        if (this.selects == null) return;\n\n        this.selectionPromise = new Promise(\n            (res) => (this.selectionResolver = res)\n        );\n        let selectedItem: MenuItem | undefined;\n        await this.optionsMenu.updateComplete;\n        if (this.recentlyConnected) {\n            // Work around for attach timing differences in Safari and Firefox.\n            // Remove when refactoring to Menu passthrough wrapper.\n            await new Promise((res) => requestAnimationFrame(() => res(true)));\n            this.recentlyConnected = false;\n        }\n        this.menuItems.forEach((item) => {\n            if (this.value === item.value && !item.disabled) {\n                selectedItem = item;\n            } else {\n                item.selected = false;\n            }\n        });\n        if (selectedItem) {\n            selectedItem.selected = !!this.selects;\n            this.selectedItem = selectedItem;\n        } else {\n            this.value = '';\n            this.selectedItem = undefined;\n        }\n        if (this.open) {\n            await this.optionsMenu.updateComplete;\n            this.optionsMenu.updateSelectedItemIndex();\n        }\n        this.selectionResolver();\n        this.willManageSelection = false;\n    }\n\n    private selectionPromise = Promise.resolve();\n    private selectionResolver!: () => void;\n\n    protected override async getUpdateComplete(): Promise<boolean> {\n        const complete = (await super.getUpdateComplete()) as boolean;\n        await this.selectionPromise;\n        // if (this.overlayElement) {\n        //     await this.overlayElement.updateComplete;\n        // }\n        return complete;\n    }\n\n    private recentlyConnected = false;\n\n    private enterKeydownOn: EventTarget | null = null;\n\n    protected handleEnterKeydown = (event: KeyboardEvent): void => {\n        if (event.code !== 'Enter') {\n            return;\n        }\n\n        if (this.enterKeydownOn) {\n            event.preventDefault();\n            return;\n        }\n        this.enterKeydownOn = event.target;\n        this.addEventListener(\n            'keyup',\n            async (keyupEvent: KeyboardEvent) => {\n                if (keyupEvent.code !== 'Enter') {\n                    return;\n                }\n                this.enterKeydownOn = null;\n            },\n            { once: true }\n        );\n    };\n\n    public bindEvents(): void {\n        this.strategy?.abort();\n        if (this.isMobile.matches) {\n            this.strategy = new strategies['mobile'](this.button, this);\n        } else {\n            this.strategy = new strategies['desktop'](this.button, this);\n        }\n    }\n\n    public override connectedCallback(): void {\n        super.connectedCallback();\n        this.recentlyConnected = this.hasUpdated;\n    }\n\n    public override disconnectedCallback(): void {\n        this.close();\n        this.strategy?.releaseDescription();\n        super.disconnectedCallback();\n    }\n}\n\n/**\n * @element sp-picker\n *\n * @slot label - The placeholder content for the Picker\n * @slot description - The description content for the Picker\n * @slot tooltip - Tooltip to to be applied to the the Picker Button\n * @slot - menu items to be listed in the Picker\n * @fires change - Announces that the `value` of the element has changed\n * @fires sp-opened - Announces that the overlay has been opened\n * @fires sp-closed - Announces that the overlay has been closed\n */\nexport class Picker extends PickerBase {\n    public static override get styles(): CSSResultArray {\n        return [pickerStyles, chevronStyles, chevronIconOverrides];\n    }\n\n    protected override get containerStyles(): StyleInfo {\n        const styles = super.containerStyles;\n        if (!this.quiet) {\n            styles['min-width'] = `${this.offsetWidth}px`;\n        }\n        return styles;\n    }\n\n    protected override handleKeydown = (event: KeyboardEvent): void => {\n        const { code } = event;\n        this.focused = true;\n        if (!code.startsWith('Arrow') || this.readonly || this.pending) {\n            return;\n        }\n        if (code === 'ArrowUp' || code === 'ArrowDown') {\n            this.toggle(true);\n            event.preventDefault();\n            return;\n        }\n        event.preventDefault();\n        const selectedIndex = this.selectedItem\n            ? this.menuItems.indexOf(this.selectedItem)\n            : -1;\n        // use a positive offset to find the first non-disabled item when no selection is available.\n        const nextOffset = selectedIndex < 0 || code === 'ArrowRight' ? 1 : -1;\n        let nextIndex = selectedIndex + nextOffset;\n        while (\n            this.menuItems[nextIndex] &&\n            this.menuItems[nextIndex].disabled\n        ) {\n            nextIndex += nextOffset;\n        }\n        if (!this.menuItems[nextIndex] || this.menuItems[nextIndex].disabled) {\n            return;\n        }\n        if (!this.value || nextIndex !== selectedIndex) {\n            this.setValueFromItem(this.menuItems[nextIndex]);\n        }\n    };\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n    CSSResultArray,\n    DefaultElementSize,\n    html,\n    nothing,\n    PropertyValues,\n    render,\n    SizedMixin,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n    classMap,\n    ifDefined,\n    StyleInfo,\n    styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n    property,\n    query,\n    state,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport pickerStyles from './picker.css.js';\nimport chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport chevronIconOverrides from '@spectrum-web-components/icon/src/icon-chevron-overrides.css.js';\n\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\nimport type { Tooltip } from '@spectrum-web-components/tooltip';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport type {\n    Menu,\n    MenuItem,\n    MenuItemChildren,\n} from '@spectrum-web-components/menu';\nimport { Placement } from '@spectrum-web-components/overlay';\nimport {\n    IS_MOBILE,\n    MatchMediaController,\n} from '@spectrum-web-components/reactive-controllers/src/MatchMedia.js';\nimport { DependencyManagerController } from '@spectrum-web-components/reactive-controllers/src/DependencyManger.js';\nimport { PendingStateController } from '@spectrum-web-components/reactive-controllers/src/PendingState.js';\nimport { Overlay } from '@spectrum-web-components/overlay/src/Overlay.js';\nimport type { SlottableRequestEvent } from '@spectrum-web-components/overlay/src/slottable-request-event.js';\nimport type { FieldLabel } from '@spectrum-web-components/field-label';\n\nimport { DesktopController } from './DesktopController.dev.js'\nimport { MobileController } from './MobileController.dev.js'\nimport { strategies } from './strategies.dev.js'\n\nconst chevronClass = {\n    s: 'spectrum-UIIcon-ChevronDown75',\n    m: 'spectrum-UIIcon-ChevronDown100',\n    l: 'spectrum-UIIcon-ChevronDown200',\n    xl: 'spectrum-UIIcon-ChevronDown300',\n};\n\nexport const DESCRIPTION_ID = 'option-picker';\nexport class PickerBase extends SizedMixin(Focusable, { noDefaultSize: true }) {\n    public isMobile = new MatchMediaController(this, IS_MOBILE);\n\n    public strategy!: DesktopController | MobileController;\n\n    @state()\n    appliedLabel?: string;\n\n    @query('#button')\n    public button!: HTMLButtonElement;\n\n    public dependencyManager = new DependencyManagerController(this);\n\n    private deprecatedMenu: Menu | null = null;\n\n    @property({ type: Boolean, reflect: true })\n    public override disabled = false;\n\n    @property({ type: Boolean, reflect: true })\n    public focused = false;\n\n    @property({ type: String, reflect: true })\n    public icons?: 'only' | 'none';\n\n    @property({ type: Boolean, reflect: true })\n    public invalid = false;\n\n    /** Whether the items are currently loading. */\n    @property({ type: Boolean, reflect: true })\n    public pending = false;\n\n    /** Defines a string value that labels the Picker while it is in pending state. */\n    @property({ type: String, attribute: 'pending-label' })\n    public pendingLabel = 'Pending';\n\n    @property()\n    public label?: string;\n\n    @property({ type: Boolean, reflect: true })\n    public open = false;\n\n    @property({ type: Boolean, reflect: true })\n    public readonly = false;\n\n    public selects: undefined | 'single' = 'single';\n\n    @state()\n    public labelAlignment?: 'inline';\n\n    protected get menuItems(): MenuItem[] {\n        return this.optionsMenu.childItems;\n    }\n\n    @query('sp-menu')\n    public optionsMenu!: Menu;\n\n    private _selfManageFocusElement = false;\n\n    public override get selfManageFocusElement(): boolean {\n        return this._selfManageFocusElement;\n    }\n\n    @query('sp-overlay')\n    public overlayElement!: Overlay;\n\n    protected tooltipEl?: Tooltip;\n\n    /**\n     * @type {\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"}\n     * @attr\n     */\n\n    @property()\n    public placement: Placement = 'bottom-start';\n\n    @property({ type: Boolean, reflect: true })\n    public quiet = false;\n\n    @property({ type: String })\n    public value = '';\n\n    @property({ attribute: false })\n    public get selectedItem(): MenuItem | undefined {\n        return this._selectedItem;\n    }\n\n    public pendingStateController: PendingStateController<this>;\n\n    /**\n     * Initializes the `PendingStateController` for the Picker component.\n     * The `PendingStateController` manages the pending state of the Picker.\n     */\n    constructor() {\n        super();\n        this.pendingStateController = new PendingStateController(this);\n    }\n\n    public set selectedItem(selectedItem: MenuItem | undefined) {\n        this.selectedItemContent = selectedItem\n            ? selectedItem.itemChildren\n            : undefined;\n\n        if (selectedItem === this.selectedItem) return;\n        const oldSelectedItem = this.selectedItem;\n        this._selectedItem = selectedItem;\n        this.requestUpdate('selectedItem', oldSelectedItem);\n    }\n\n    _selectedItem?: MenuItem;\n\n    protected listRole: 'listbox' | 'menu' = 'listbox';\n    protected itemRole = 'option';\n\n    public override get focusElement(): HTMLElement {\n        if (this.open) {\n            return this.optionsMenu;\n        }\n        return this.button;\n    }\n\n    public forceFocusVisible(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.focused = true;\n    }\n\n    public override click(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.toggle();\n    }\n\n    public handleButtonBlur(): void {\n        this.focused = false;\n    }\n\n    public override focus(options?: FocusOptions): void {\n        super.focus(options);\n\n        if (!this.disabled && this.focusElement) {\n            this.focused = this.hasVisibleFocusInTree();\n        }\n    }\n\n    public handleHelperFocus(): void {\n        // set focused to true here instead of handleButtonFocus so clicks don't flash a focus outline\n        this.focused = true;\n        this.button.focus();\n    }\n\n    public handleChange(event: Event): void {\n        if (this.strategy) {\n            this.strategy.preventNextToggle = 'no';\n        }\n        const target = event.target as Menu;\n        const [selected] = target.selectedItems;\n        event.stopPropagation();\n        if (event.cancelable) {\n            this.setValueFromItem(selected, event);\n        } else {\n            // Non-cancelable \"change\" events announce a selection with no value\n            // change that should close the Picker element.\n            this.open = false;\n            if (this.strategy) {\n                this.strategy.open = false;\n            }\n        }\n    }\n\n    public handleButtonFocus(event: FocusEvent): void {\n        this.strategy?.handleButtonFocus(event);\n    }\n\n    protected handleKeydown = (event: KeyboardEvent): void => {\n        this.focused = true;\n        if (event.code !== 'ArrowDown' && event.code !== 'ArrowUp') {\n            return;\n        }\n        event.stopPropagation();\n        event.preventDefault();\n        this.toggle(true);\n    };\n\n    protected async setValueFromItem(\n        item: MenuItem,\n        menuChangeEvent?: Event\n    ): Promise<void> {\n        this.open = false;\n        // should always close when \"setting\" a value\n        if (this.strategy) {\n            this.strategy.open = false;\n        }\n        const oldSelectedItem = this.selectedItem;\n        const oldValue = this.value;\n\n        // Set a value.\n        this.selectedItem = item;\n        this.value = item?.value ?? '';\n        await this.updateComplete;\n        const applyDefault = this.dispatchEvent(\n            new Event('change', {\n                bubbles: true,\n                // Allow it to be prevented.\n                cancelable: true,\n                composed: true,\n            })\n        );\n        if (!applyDefault && this.selects) {\n            if (menuChangeEvent) {\n                menuChangeEvent.preventDefault();\n            }\n            this.setMenuItemSelected(this.selectedItem as MenuItem, false);\n            if (oldSelectedItem) {\n                this.setMenuItemSelected(oldSelectedItem, true);\n            }\n            this.selectedItem = oldSelectedItem;\n            this.value = oldValue;\n            this.open = true;\n            if (this.strategy) {\n                this.strategy.open = true;\n            }\n            return;\n        } else if (!this.selects) {\n            // Unset the value if not carrying a selection\n            this.selectedItem = oldSelectedItem;\n            this.value = oldValue;\n            return;\n        }\n        if (oldSelectedItem) {\n            this.setMenuItemSelected(oldSelectedItem, false);\n        }\n        this.setMenuItemSelected(item, !!this.selects);\n    }\n\n    protected setMenuItemSelected(item: MenuItem, value: boolean): void {\n        // matches null | undefined\n        if (this.selects == null) return;\n        item.selected = value;\n    }\n\n    public toggle(target?: boolean): void {\n        if (this.readonly || this.pending) {\n            return;\n        }\n        this.open = typeof target !== 'undefined' ? target : !this.open;\n        if (this.strategy) {\n            this.strategy.open = this.open;\n        }\n        if (this.open) {\n            this._selfManageFocusElement = true;\n        } else {\n            this._selfManageFocusElement = false;\n        }\n    }\n\n    public close(): void {\n        if (this.readonly) {\n            return;\n        }\n        if (this.strategy) {\n            this.open = false;\n            this.strategy.open = false;\n        }\n    }\n\n    protected get containerStyles(): StyleInfo {\n        // @todo: test in mobile\n        /* c8 ignore next 5 */\n        if (this.isMobile.matches) {\n            return {\n                '--swc-menu-width': '100%',\n            };\n        }\n        return {};\n    }\n\n    @state()\n    protected get selectedItemContent(): MenuItemChildren {\n        return this._selectedItemContent || { icon: [], content: [] };\n    }\n\n    protected set selectedItemContent(\n        selectedItemContent: MenuItemChildren | undefined\n    ) {\n        if (selectedItemContent === this.selectedItemContent) return;\n\n        const oldContent = this.selectedItemContent;\n        this._selectedItemContent = selectedItemContent;\n        this.requestUpdate('selectedItemContent', oldContent);\n    }\n\n    _selectedItemContent?: MenuItemChildren;\n\n    protected handleTooltipSlotchange(\n        event: Event & { target: HTMLSlotElement }\n    ): void {\n        this.tooltipEl = event.target.assignedElements()[0] as\n            | Tooltip\n            | undefined;\n    }\n\n    public handleSlottableRequest = (_event: SlottableRequestEvent): void => {};\n\n    protected renderLabelContent(content: Node[]): TemplateResult | Node[] {\n        if (this.value && this.selectedItem) {\n            return content;\n        }\n        return html`\n            <slot name=\"label\" id=\"label\">\n                <span\n                    aria-hidden=${ifDefined(\n                        this.appliedLabel ? undefined : 'true'\n                    )}\n                >\n                    ${this.label}\n                </span>\n            </slot>\n        `;\n    }\n\n    protected get buttonContent(): TemplateResult[] {\n        const labelClasses = {\n            'visually-hidden': this.icons === 'only' && !!this.value,\n            placeholder: !this.value,\n            label: true,\n        };\n        const appliedLabel = this.appliedLabel || this.label;\n        return [\n            html`\n                <span id=\"icon\" ?hidden=${this.icons === 'none'}>\n                    ${this.selectedItemContent.icon}\n                </span>\n                <span\n                    id=${ifDefined(\n                        this.value && this.selectedItem ? 'label' : undefined\n                    )}\n                    class=${classMap(labelClasses)}\n                >\n                    ${this.renderLabelContent(this.selectedItemContent.content)}\n                </span>\n                ${this.value && this.selectedItem\n                    ? html`\n                          <span\n                              aria-hidden=\"true\"\n                              class=\"visually-hidden\"\n                              id=\"applied-label\"\n                          >\n                              ${appliedLabel}\n                              <slot name=\"label\"></slot>\n                          </span>\n                      `\n                    : html`\n                          <span hidden id=\"applied-label\">${appliedLabel}</span>\n                      `}\n                ${this.invalid && !this.pending\n                    ? html`\n                          <sp-icon-alert\n                              class=\"validation-icon\"\n                          ></sp-icon-alert>\n                      `\n                    : nothing}\n                ${this.pendingStateController.renderPendingState()}\n                <sp-icon-chevron100\n                    class=\"picker ${chevronClass[\n                        this.size as DefaultElementSize\n                    ]}\"\n                ></sp-icon-chevron100>\n                <slot\n                    aria-hidden=\"true\"\n                    name=\"tooltip\"\n                    id=\"tooltip\"\n                    @slotchange=${this.handleTooltipSlotchange}\n                ></slot>\n            `,\n        ];\n    }\n\n    applyFocusElementLabel = (\n        value: string,\n        labelElement: FieldLabel\n    ): void => {\n        this.appliedLabel = value;\n        this.labelAlignment = labelElement.sideAligned ? 'inline' : undefined;\n    };\n\n    protected renderOverlay(menu: TemplateResult): TemplateResult {\n        if (this.strategy?.overlay === undefined) {\n            return menu;\n        }\n        const container = this.renderContainer(menu);\n        render(container, this.strategy?.overlay as unknown as HTMLElement, {\n            host: this,\n        });\n        return this.strategy?.overlay as unknown as TemplateResult;\n    }\n\n    protected get renderDescriptionSlot(): TemplateResult {\n        return html`\n            <div id=${DESCRIPTION_ID}>\n                <slot name=\"description\"></slot>\n            </div>\n        `;\n    }\n    // a helper to throw focus to the button is needed because Safari\n    // won't include buttons in the tab order even with tabindex=\"0\"\n    protected override render(): TemplateResult {\n        if (this.tooltipEl) {\n            this.tooltipEl.disabled = this.open;\n        }\n        return html`\n            <span\n                id=\"focus-helper\"\n                tabindex=\"${this.focused || this.open ? '-1' : '0'}\"\n                @focus=${this.handleHelperFocus}\n                aria-describedby=${DESCRIPTION_ID}\n            ></span>\n            <button\n                aria-controls=${ifDefined(this.open ? 'menu' : undefined)}\n                aria-describedby=\"tooltip\"\n                aria-expanded=${this.open ? 'true' : 'false'}\n                aria-haspopup=\"true\"\n                aria-labelledby=\"loader icon label applied-label\"\n                id=\"button\"\n                class=${ifDefined(\n                    this.labelAlignment\n                        ? `label-${this.labelAlignment}`\n                        : undefined\n                )}\n                @blur=${this.handleButtonBlur}\n                @keydown=${{\n                    handleEvent: this.handleEnterKeydown,\n                    capture: true,\n                }}\n                ?disabled=${this.disabled}\n                tabindex=\"-1\"\n            >\n                ${this.buttonContent}\n            </button>\n            ${this.renderMenu} ${this.renderDescriptionSlot}\n        `;\n    }\n\n    protected override update(changes: PropertyValues<this>): void {\n        if (this.selects) {\n            // Always force `selects` to \"single\" when set.\n            // TODO: Add support functionally and visually for \"multiple\"\n            this.selects = 'single';\n        }\n        if (changes.has('disabled') && this.disabled) {\n            if (this.strategy) {\n                this.open = false;\n                this.strategy.open = false;\n            }\n        }\n        if (changes.has('pending') && this.pending) {\n            if (this.strategy) {\n                this.open = false;\n                this.strategy.open = false;\n            }\n        }\n        if (changes.has('value')) {\n            // MenuItems update a frame late for <slot> management,\n            // await the same here.\n            this.shouldScheduleManageSelection();\n        }\n        // Maybe it's finally time to remove this support?\n        if (!this.hasUpdated) {\n            this.deprecatedMenu = this.querySelector(':scope > sp-menu');\n            this.deprecatedMenu?.toggleAttribute('ignore', true);\n            this.deprecatedMenu?.setAttribute('selects', 'inherit');\n        }\n        if (window.__swc.DEBUG) {\n            if (!this.hasUpdated && this.querySelector(':scope > sp-menu')) {\n                const { localName } = this;\n                window.__swc.warn(\n                    this,\n                    `You no longer need to provide an <sp-menu> child to ${localName}. Any styling or attributes on the <sp-menu> will be ignored.`,\n                    'https://opensource.adobe.com/spectrum-web-components/components/picker/#sizes',\n                    { level: 'deprecation' }\n                );\n            }\n            this.updateComplete.then(async () => {\n                // Attributes should be user supplied, making them available before first update.\n                // However, `appliesLabel` is applied by external elements that must be update complete as well to be bound appropriately.\n                await new Promise((res) => requestAnimationFrame(res));\n                await new Promise((res) => requestAnimationFrame(res));\n                if (\n                    !this.label &&\n                    !this.getAttribute('aria-label') &&\n                    !this.getAttribute('aria-labelledby') &&\n                    !this.appliedLabel\n                ) {\n                    window.__swc.warn(\n                        this,\n                        `<${this.localName}> needs one of the following to be accessible:`,\n                        'https://opensource.adobe.com/spectrum-web-components/components/picker/#accessibility',\n                        {\n                            type: 'accessibility',\n                            issues: [\n                                `an <sp-field-label> element with a \\`for\\` attribute referencing the \\`id\\` of the \\`<${this.localName}>\\`, or`,\n                                'value supplied to the \"label\" attribute, which will be displayed visually as placeholder text, or',\n                                'text content supplied in a <span> with slot=\"label\", which will also be displayed visually as placeholder text.',\n                            ],\n                        }\n                    );\n                }\n            });\n        }\n        super.update(changes);\n    }\n\n    protected bindButtonKeydownListener(): void {\n        this.button.addEventListener('keydown', this.handleKeydown);\n    }\n\n    protected override updated(changes: PropertyValues<this>): void {\n        super.updated(changes);\n        if (changes.has('open')) {\n            this.strategy.open = this.open;\n        }\n    }\n\n    protected override firstUpdated(changes: PropertyValues<this>): void {\n        super.firstUpdated(changes);\n        this.bindButtonKeydownListener();\n        this.bindEvents();\n    }\n\n    protected get dismissHelper(): TemplateResult {\n        return html`\n            <div class=\"visually-hidden\">\n                <button\n                    tabindex=\"-1\"\n                    aria-label=\"Dismiss\"\n                    @click=${this.close}\n                ></button>\n            </div>\n        `;\n    }\n\n    protected renderContainer(menu: TemplateResult): TemplateResult {\n        const accessibleMenu = html`\n            ${this.dismissHelper} ${menu} ${this.dismissHelper}\n        `;\n        // @todo: test in mobile\n        /* c8 ignore next 11 */\n        if (this.isMobile.matches) {\n            this.dependencyManager.add('sp-tray');\n            import('@spectrum-web-components/tray/sp-tray.js');\n            return html`\n                <sp-tray\n                    id=\"popover\"\n                    role=\"presentation\"\n                    style=${styleMap(this.containerStyles)}\n                >\n                    ${accessibleMenu}\n                </sp-tray>\n            `;\n        }\n        this.dependencyManager.add('sp-popover');\n        import('@spectrum-web-components/popover/sp-popover.js');\n        return html`\n            <sp-popover\n                id=\"popover\"\n                role=\"presentation\"\n                style=${styleMap(this.containerStyles)}\n                placement=${this.placement}\n            >\n                ${accessibleMenu}\n            </sp-popover>\n        `;\n    }\n\n    protected hasRenderedOverlay = false;\n\n    private onScroll(): void {\n        this.dispatchEvent(\n            new Event('scroll', {\n                cancelable: true,\n                composed: true,\n            })\n        );\n    }\n\n    protected get renderMenu(): TemplateResult {\n        const menu = html`\n            <sp-menu\n                aria-labelledby=\"applied-label\"\n                @change=${this.handleChange}\n                id=\"menu\"\n                @keydown=${{\n                    handleEvent: this.handleEnterKeydown,\n                    capture: true,\n                }}\n                @scroll=${this.onScroll}\n                role=${this.listRole}\n                .selects=${this.selects}\n                .selected=${this.value ? [this.value] : []}\n                size=${this.size}\n                @sp-menu-item-added-or-updated=${this.shouldManageSelection}\n            >\n                <slot @slotchange=${this.shouldScheduleManageSelection}></slot>\n            </sp-menu>\n        `;\n        this.hasRenderedOverlay =\n            this.hasRenderedOverlay ||\n            this.focused ||\n            this.open ||\n            !!this.deprecatedMenu;\n        if (this.hasRenderedOverlay) {\n            if (this.dependencyManager.loaded) {\n                this.dependencyManager.add('sp-overlay');\n            }\n            return this.renderOverlay(menu);\n        }\n        return menu;\n    }\n\n    private willManageSelection = false;\n\n    protected shouldScheduleManageSelection(event?: Event): void {\n        if (\n            !this.willManageSelection &&\n            (!event ||\n                ((event.target as HTMLElement).getRootNode() as ShadowRoot)\n                    .host === this)\n        ) {\n            this.willManageSelection = true;\n            requestAnimationFrame(() => {\n                requestAnimationFrame(() => {\n                    this.manageSelection();\n                });\n            });\n        }\n    }\n\n    protected shouldManageSelection(): void {\n        if (this.willManageSelection) {\n            return;\n        }\n        this.willManageSelection = true;\n        this.manageSelection();\n    }\n\n    protected async manageSelection(): Promise<void> {\n        if (this.selects == null) return;\n\n        this.selectionPromise = new Promise(\n            (res) => (this.selectionResolver = res)\n        );\n        let selectedItem: MenuItem | undefined;\n        await this.optionsMenu.updateComplete;\n        if (this.recentlyConnected) {\n            // Work around for attach timing differences in Safari and Firefox.\n            // Remove when refactoring to Menu passthrough wrapper.\n            await new Promise((res) => requestAnimationFrame(() => res(true)));\n            this.recentlyConnected = false;\n        }\n        this.menuItems.forEach((item) => {\n            if (this.value === item.value && !item.disabled) {\n                selectedItem = item;\n            } else {\n                item.selected = false;\n            }\n        });\n        if (selectedItem) {\n            selectedItem.selected = !!this.selects;\n            this.selectedItem = selectedItem;\n        } else {\n            this.value = '';\n            this.selectedItem = undefined;\n        }\n        if (this.open) {\n            await this.optionsMenu.updateComplete;\n            this.optionsMenu.updateSelectedItemIndex();\n        }\n        this.selectionResolver();\n        this.willManageSelection = false;\n    }\n\n    private selectionPromise = Promise.resolve();\n    private selectionResolver!: () => void;\n\n    protected override async getUpdateComplete(): Promise<boolean> {\n        const complete = (await super.getUpdateComplete()) as boolean;\n        await this.selectionPromise;\n        // if (this.overlayElement) {\n        //     await this.overlayElement.updateComplete;\n        // }\n        return complete;\n    }\n\n    private recentlyConnected = false;\n\n    private enterKeydownOn: EventTarget | null = null;\n\n    protected handleEnterKeydown = (event: KeyboardEvent): void => {\n        if (event.code !== 'Enter') {\n            return;\n        }\n\n        if (this.enterKeydownOn) {\n            event.preventDefault();\n            return;\n        }\n        this.enterKeydownOn = event.target;\n        this.addEventListener(\n            'keyup',\n            async (keyupEvent: KeyboardEvent) => {\n                if (keyupEvent.code !== 'Enter') {\n                    return;\n                }\n                this.enterKeydownOn = null;\n            },\n            { once: true }\n        );\n    };\n\n    public bindEvents(): void {\n        this.strategy?.abort();\n        if (this.isMobile.matches) {\n            this.strategy = new strategies['mobile'](this.button, this);\n        } else {\n            this.strategy = new strategies['desktop'](this.button, this);\n        }\n    }\n\n    public override connectedCallback(): void {\n        super.connectedCallback();\n        this.recentlyConnected = this.hasUpdated;\n    }\n\n    public override disconnectedCallback(): void {\n        this.close();\n        this.strategy?.releaseDescription();\n        super.disconnectedCallback();\n    }\n}\n\n/**\n * @element sp-picker\n *\n * @slot label - The placeholder content for the Picker\n * @slot description - The description content for the Picker\n * @slot tooltip - Tooltip to to be applied to the the Picker Button\n * @slot - menu items to be listed in the Picker\n * @fires change - Announces that the `value` of the element has changed\n * @fires sp-opened - Announces that the overlay has been opened\n * @fires sp-closed - Announces that the overlay has been closed\n */\nexport class Picker extends PickerBase {\n    public static override get styles(): CSSResultArray {\n        return [pickerStyles, chevronStyles, chevronIconOverrides];\n    }\n\n    protected override get containerStyles(): StyleInfo {\n        const styles = super.containerStyles;\n        if (!this.quiet) {\n            styles['min-width'] = `${this.offsetWidth}px`;\n        }\n        return styles;\n    }\n\n    protected override handleKeydown = (event: KeyboardEvent): void => {\n        const { code } = event;\n        this.focused = true;\n        if (!code.startsWith('Arrow') || this.readonly || this.pending) {\n            return;\n        }\n        if (code === 'ArrowUp' || code === 'ArrowDown') {\n            this.toggle(true);\n            event.preventDefault();\n            return;\n        }\n        event.preventDefault();\n        const selectedIndex = this.selectedItem\n            ? this.menuItems.indexOf(this.selectedItem)\n            : -1;\n        // use a positive offset to find the first non-disabled item when no selection is available.\n        const nextOffset = selectedIndex < 0 || code === 'ArrowRight' ? 1 : -1;\n        let nextIndex = selectedIndex + nextOffset;\n        while (\n            this.menuItems[nextIndex] &&\n            this.menuItems[nextIndex].disabled\n        ) {\n            nextIndex += nextOffset;\n        }\n        if (!this.menuItems[nextIndex] || this.menuItems[nextIndex].disabled) {\n            return;\n        }\n        if (!this.value || nextIndex !== selectedIndex) {\n            this.setValueFromItem(this.menuItems[nextIndex]);\n        }\n    };\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/src/Picker.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["Picker.ts"],
-  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n    CSSResultArray,\n    DefaultElementSize,\n    html,\n    nothing,\n    PropertyValues,\n    render,\n    SizedMixin,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n    classMap,\n    ifDefined,\n    StyleInfo,\n    styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n    property,\n    query,\n    state,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport pickerStyles from './picker.css.js';\nimport chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport chevronIconOverrides from '@spectrum-web-components/icon/src/icon-chevron-overrides.css.js';\n\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\nimport type { Tooltip } from '@spectrum-web-components/tooltip';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport type {\n    Menu,\n    MenuItem,\n    MenuItemChildren,\n} from '@spectrum-web-components/menu';\nimport { Placement } from '@spectrum-web-components/overlay';\nimport {\n    IS_MOBILE,\n    MatchMediaController,\n} from '@spectrum-web-components/reactive-controllers/src/MatchMedia.js';\nimport { DependencyManagerController } from '@spectrum-web-components/reactive-controllers/src/DependencyManger.js';\nimport { PendingStateController } from '@spectrum-web-components/reactive-controllers/src/PendingState.js';\nimport { Overlay } from '@spectrum-web-components/overlay/src/Overlay.js';\nimport type { SlottableRequestEvent } from '@spectrum-web-components/overlay/src/slottable-request-event.js';\nimport type { FieldLabel } from '@spectrum-web-components/field-label';\n\nimport { DesktopController } from './DesktopController.js';\nimport { MobileController } from './MobileController.js';\nimport { strategies } from './strategies.js';\n\nconst chevronClass = {\n    s: 'spectrum-UIIcon-ChevronDown75',\n    m: 'spectrum-UIIcon-ChevronDown100',\n    l: 'spectrum-UIIcon-ChevronDown200',\n    xl: 'spectrum-UIIcon-ChevronDown300',\n};\n\nexport const DESCRIPTION_ID = 'option-picker';\nexport class PickerBase extends SizedMixin(Focusable, { noDefaultSize: true }) {\n    public isMobile = new MatchMediaController(this, IS_MOBILE);\n\n    public strategy!: DesktopController | MobileController;\n\n    @state()\n    appliedLabel?: string;\n\n    @query('#button')\n    public button!: HTMLButtonElement;\n\n    public dependencyManager = new DependencyManagerController(this);\n\n    private deprecatedMenu: Menu | null = null;\n\n    @property({ type: Boolean, reflect: true })\n    public override disabled = false;\n\n    @property({ type: Boolean, reflect: true })\n    public focused = false;\n\n    @property({ type: String, reflect: true })\n    public icons?: 'only' | 'none';\n\n    @property({ type: Boolean, reflect: true })\n    public invalid = false;\n\n    /** Whether the items are currently loading. */\n    @property({ type: Boolean, reflect: true })\n    public pending = false;\n\n    /** Defines a string value that labels the Picker while it is in pending state. */\n    @property({ type: String, attribute: 'pending-label' })\n    public pendingLabel = 'Pending';\n\n    @property()\n    public label?: string;\n\n    @property({ type: Boolean, reflect: true })\n    public open = false;\n\n    @property({ type: Boolean, reflect: true })\n    public readonly = false;\n\n    public selects: undefined | 'single' = 'single';\n\n    @state()\n    public labelAlignment?: 'inline';\n\n    protected get menuItems(): MenuItem[] {\n        return this.optionsMenu.childItems;\n    }\n\n    @query('sp-menu')\n    public optionsMenu!: Menu;\n\n    private _selfManageFocusElement = false;\n\n    public override get selfManageFocusElement(): boolean {\n        return this._selfManageFocusElement;\n    }\n\n    @query('sp-overlay')\n    public overlayElement!: Overlay;\n\n    protected tooltipEl?: Tooltip;\n\n    /**\n     * @type {\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"}\n     * @attr\n     */\n\n    @property()\n    public placement: Placement = 'bottom-start';\n\n    @property({ type: Boolean, reflect: true })\n    public quiet = false;\n\n    @property({ type: String })\n    public value = '';\n\n    @property({ attribute: false })\n    public get selectedItem(): MenuItem | undefined {\n        return this._selectedItem;\n    }\n\n    public pendingStateController: PendingStateController<this>;\n\n    /**\n     * Initializes the `PendingStateController` for the Picker component.\n     * The `PendingStateController` manages the pending state of the Picker.\n     */\n    constructor() {\n        super();\n        this.pendingStateController = new PendingStateController(this);\n    }\n\n    public set selectedItem(selectedItem: MenuItem | undefined) {\n        this.selectedItemContent = selectedItem\n            ? selectedItem.itemChildren\n            : undefined;\n\n        if (selectedItem === this.selectedItem) return;\n        const oldSelectedItem = this.selectedItem;\n        this._selectedItem = selectedItem;\n        this.requestUpdate('selectedItem', oldSelectedItem);\n    }\n\n    _selectedItem?: MenuItem;\n\n    protected listRole: 'listbox' | 'menu' = 'listbox';\n    protected itemRole = 'option';\n\n    public override get focusElement(): HTMLElement {\n        if (this.open) {\n            return this.optionsMenu;\n        }\n        return this.button;\n    }\n\n    public forceFocusVisible(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.focused = true;\n    }\n\n    public override click(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.toggle();\n    }\n\n    public handleButtonBlur(): void {\n        this.focused = false;\n    }\n\n    public override focus(options?: FocusOptions): void {\n        super.focus(options);\n\n        if (!this.disabled && this.focusElement) {\n            this.focused = this.hasVisibleFocusInTree();\n        }\n    }\n\n    public handleHelperFocus(): void {\n        // set focused to true here instead of handleButtonFocus so clicks don't flash a focus outline\n        this.focused = true;\n        this.button.focus();\n    }\n\n    public handleChange(event: Event): void {\n        if (this.strategy) {\n            this.strategy.preventNextToggle = 'no';\n        }\n        const target = event.target as Menu;\n        const [selected] = target.selectedItems;\n        event.stopPropagation();\n        if (event.cancelable) {\n            this.setValueFromItem(selected, event);\n        } else {\n            // Non-cancelable \"change\" events announce a selection with no value\n            // change that should close the Picker element.\n            this.open = false;\n            if (this.strategy) {\n                this.strategy.open = false;\n            }\n        }\n    }\n\n    public handleButtonFocus(event: FocusEvent): void {\n        this.strategy?.handleButtonFocus(event);\n    }\n\n    protected handleKeydown = (event: KeyboardEvent): void => {\n        this.focused = true;\n        if (event.code !== 'ArrowDown' && event.code !== 'ArrowUp') {\n            return;\n        }\n        event.stopPropagation();\n        event.preventDefault();\n        this.toggle(true);\n    };\n\n    protected async setValueFromItem(\n        item: MenuItem,\n        menuChangeEvent?: Event\n    ): Promise<void> {\n        this.open = false;\n        // should always close when \"setting\" a value\n        if (this.strategy) {\n            this.strategy.open = false;\n        }\n        const oldSelectedItem = this.selectedItem;\n        const oldValue = this.value;\n\n        // Set a value.\n        this.selectedItem = item;\n        this.value = item?.value ?? '';\n        await this.updateComplete;\n        const applyDefault = this.dispatchEvent(\n            new Event('change', {\n                bubbles: true,\n                // Allow it to be prevented.\n                cancelable: true,\n                composed: true,\n            })\n        );\n        if (!applyDefault && this.selects) {\n            if (menuChangeEvent) {\n                menuChangeEvent.preventDefault();\n            }\n            this.setMenuItemSelected(this.selectedItem as MenuItem, false);\n            if (oldSelectedItem) {\n                this.setMenuItemSelected(oldSelectedItem, true);\n            }\n            this.selectedItem = oldSelectedItem;\n            this.value = oldValue;\n            this.open = true;\n            if (this.strategy) {\n                this.strategy.open = true;\n            }\n            return;\n        } else if (!this.selects) {\n            // Unset the value if not carrying a selection\n            this.selectedItem = oldSelectedItem;\n            this.value = oldValue;\n            return;\n        }\n        if (oldSelectedItem) {\n            this.setMenuItemSelected(oldSelectedItem, false);\n        }\n        this.setMenuItemSelected(item, !!this.selects);\n    }\n\n    protected setMenuItemSelected(item: MenuItem, value: boolean): void {\n        // matches null | undefined\n        if (this.selects == null) return;\n        item.selected = value;\n    }\n\n    public toggle(target?: boolean): void {\n        if (this.readonly || this.pending) {\n            return;\n        }\n        this.open = typeof target !== 'undefined' ? target : !this.open;\n        if (this.strategy) {\n            this.strategy.open = this.open;\n        }\n        if (this.open) {\n            this._selfManageFocusElement = true;\n        } else {\n            this._selfManageFocusElement = false;\n        }\n    }\n\n    public close(): void {\n        if (this.readonly) {\n            return;\n        }\n        if (this.strategy) {\n            this.open = false;\n            this.strategy.open = false;\n        }\n    }\n\n    protected get containerStyles(): StyleInfo {\n        // @todo: test in mobile\n        /* c8 ignore next 5 */\n        if (this.isMobile.matches) {\n            return {\n                '--swc-menu-width': '100%',\n            };\n        }\n        return {};\n    }\n\n    @state()\n    protected get selectedItemContent(): MenuItemChildren {\n        return this._selectedItemContent || { icon: [], content: [] };\n    }\n\n    protected set selectedItemContent(\n        selectedItemContent: MenuItemChildren | undefined\n    ) {\n        if (selectedItemContent === this.selectedItemContent) return;\n\n        const oldContent = this.selectedItemContent;\n        this._selectedItemContent = selectedItemContent;\n        this.requestUpdate('selectedItemContent', oldContent);\n    }\n\n    _selectedItemContent?: MenuItemChildren;\n\n    protected handleTooltipSlotchange(\n        event: Event & { target: HTMLSlotElement }\n    ): void {\n        this.tooltipEl = event.target.assignedElements()[0] as\n            | Tooltip\n            | undefined;\n    }\n\n    public handleSlottableRequest = (_event: SlottableRequestEvent): void => {};\n\n    protected renderLabelContent(content: Node[]): TemplateResult | Node[] {\n        if (this.value && this.selectedItem) {\n            return content;\n        }\n        return html`\n            <slot name=\"label\" id=\"label\">\n                <span\n                    aria-hidden=${ifDefined(\n                        this.appliedLabel ? undefined : 'true'\n                    )}\n                >\n                    ${this.label}\n                </span>\n            </slot>\n        `;\n    }\n\n    protected get buttonContent(): TemplateResult[] {\n        const labelClasses = {\n            'visually-hidden': this.icons === 'only' && !!this.value,\n            placeholder: !this.value,\n            label: true,\n        };\n        const appliedLabel = this.appliedLabel || this.label;\n        return [\n            html`\n                <span id=\"icon\" ?hidden=${this.icons === 'none'}>\n                    ${this.selectedItemContent.icon}\n                </span>\n                <span\n                    id=${ifDefined(\n                        this.value && this.selectedItem ? 'label' : undefined\n                    )}\n                    class=${classMap(labelClasses)}\n                >\n                    ${this.renderLabelContent(this.selectedItemContent.content)}\n                </span>\n                ${this.value && this.selectedItem\n                    ? html`\n                          <span\n                              aria-hidden=\"true\"\n                              class=\"visually-hidden\"\n                              id=\"applied-label\"\n                          >\n                              ${appliedLabel}\n                              <slot name=\"label\"></slot>\n                          </span>\n                      `\n                    : html`\n                          <span hidden id=\"applied-label\">${appliedLabel}</span>\n                      `}\n                ${this.invalid && !this.pending\n                    ? html`\n                          <sp-icon-alert\n                              class=\"validation-icon\"\n                          ></sp-icon-alert>\n                      `\n                    : nothing}\n                ${this.pendingStateController.renderPendingState()}\n                <sp-icon-chevron100\n                    class=\"picker ${chevronClass[\n                        this.size as DefaultElementSize\n                    ]}\"\n                ></sp-icon-chevron100>\n                <slot\n                    aria-hidden=\"true\"\n                    name=\"tooltip\"\n                    id=\"tooltip\"\n                    @slotchange=${this.handleTooltipSlotchange}\n                ></slot>\n            `,\n        ];\n    }\n\n    applyFocusElementLabel = (\n        value: string,\n        labelElement: FieldLabel\n    ): void => {\n        this.appliedLabel = value;\n        this.labelAlignment = labelElement.sideAligned ? 'inline' : undefined;\n    };\n\n    protected renderOverlay(menu: TemplateResult): TemplateResult {\n        if (this.strategy?.overlay === undefined) {\n            return menu;\n        }\n        const container = this.renderContainer(menu);\n        render(container, this.strategy?.overlay as unknown as HTMLElement, {\n            host: this,\n        });\n        return this.strategy?.overlay as unknown as TemplateResult;\n    }\n\n    protected get renderDescriptionSlot(): TemplateResult {\n        return html`\n            <div id=${DESCRIPTION_ID}>\n                <slot name=\"description\"></slot>\n            </div>\n        `;\n    }\n    // a helper to throw focus to the button is needed because Safari\n    // won't include buttons in the tab order even with tabindex=\"0\"\n    protected override render(): TemplateResult {\n        if (this.tooltipEl) {\n            this.tooltipEl.disabled = this.open;\n        }\n        return html`\n            <span\n                id=\"focus-helper\"\n                tabindex=\"${this.focused || this.open ? '-1' : '0'}\"\n                @focus=${this.handleHelperFocus}\n                aria-describedby=${DESCRIPTION_ID}\n            ></span>\n            <button\n                aria-controls=${ifDefined(this.open ? 'menu' : undefined)}\n                aria-describedby=\"tooltip\"\n                aria-expanded=${this.open ? 'true' : 'false'}\n                aria-haspopup=\"true\"\n                aria-labelledby=\"loader icon label applied-label\"\n                id=\"button\"\n                class=${ifDefined(\n                    this.labelAlignment\n                        ? `label-${this.labelAlignment}`\n                        : undefined\n                )}\n                @blur=${this.handleButtonBlur}\n                @keydown=${{\n                    handleEvent: this.handleEnterKeydown,\n                    capture: true,\n                }}\n                ?disabled=${this.disabled}\n                tabindex=\"-1\"\n            >\n                ${this.buttonContent}\n            </button>\n            ${this.renderMenu} ${this.renderDescriptionSlot}\n        `;\n    }\n\n    protected override update(changes: PropertyValues<this>): void {\n        if (this.selects) {\n            // Always force `selects` to \"single\" when set.\n            // TODO: Add support functionally and visually for \"multiple\"\n            this.selects = 'single';\n        }\n        if (changes.has('disabled') && this.disabled) {\n            if (this.strategy) {\n                this.open = false;\n                this.strategy.open = false;\n            }\n        }\n        if (changes.has('pending') && this.pending) {\n            if (this.strategy) {\n                this.open = false;\n                this.strategy.open = false;\n            }\n        }\n        if (changes.has('value')) {\n            // MenuItems update a frame late for <slot> management,\n            // await the same here.\n            this.shouldScheduleManageSelection();\n        }\n        // Maybe it's finally time to remove this support?\n        if (!this.hasUpdated) {\n            this.deprecatedMenu = this.querySelector(':scope > sp-menu');\n            this.deprecatedMenu?.toggleAttribute('ignore', true);\n            this.deprecatedMenu?.setAttribute('selects', 'inherit');\n        }\n        if (window.__swc.DEBUG) {\n            if (!this.hasUpdated && this.querySelector(':scope > sp-menu')) {\n                const { localName } = this;\n                window.__swc.warn(\n                    this,\n                    `You no longer need to provide an <sp-menu> child to ${localName}. Any styling or attributes on the <sp-menu> will be ignored.`,\n                    'https://opensource.adobe.com/spectrum-web-components/components/picker/#sizes',\n                    { level: 'deprecation' }\n                );\n            }\n            this.updateComplete.then(async () => {\n                // Attributes should be user supplied, making them available before first update.\n                // However, `appliesLabel` is applied by external elements that must be update complete as well to be bound appropriately.\n                await new Promise((res) => requestAnimationFrame(res));\n                await new Promise((res) => requestAnimationFrame(res));\n                if (\n                    !this.label &&\n                    !this.getAttribute('aria-label') &&\n                    !this.getAttribute('aria-labelledby') &&\n                    !this.appliedLabel\n                ) {\n                    window.__swc.warn(\n                        this,\n                        '<${this.localName}> needs one of the following to be accessible:',\n                        'https://opensource.adobe.com/spectrum-web-components/components/picker/#accessibility',\n                        {\n                            type: 'accessibility',\n                            issues: [\n                                `an <sp-field-label> element with a \\`for\\` attribute referencing the \\`id\\` of the \\`<${this.localName}>\\`, or`,\n                                'value supplied to the \"label\" attribute, which will be displayed visually as placeholder text, or',\n                                'text content supplied in a <span> with slot=\"label\", which will also be displayed visually as placeholder text.',\n                            ],\n                        }\n                    );\n                }\n            });\n        }\n        super.update(changes);\n    }\n\n    protected bindButtonKeydownListener(): void {\n        this.button.addEventListener('keydown', this.handleKeydown);\n    }\n\n    protected override updated(changes: PropertyValues<this>): void {\n        super.updated(changes);\n        if (changes.has('open')) {\n            this.strategy.open = this.open;\n        }\n    }\n\n    protected override firstUpdated(changes: PropertyValues<this>): void {\n        super.firstUpdated(changes);\n        this.bindButtonKeydownListener();\n        this.bindEvents();\n    }\n\n    protected get dismissHelper(): TemplateResult {\n        return html`\n            <div class=\"visually-hidden\">\n                <button\n                    tabindex=\"-1\"\n                    aria-label=\"Dismiss\"\n                    @click=${this.close}\n                ></button>\n            </div>\n        `;\n    }\n\n    protected renderContainer(menu: TemplateResult): TemplateResult {\n        const accessibleMenu = html`\n            ${this.dismissHelper} ${menu} ${this.dismissHelper}\n        `;\n        // @todo: test in mobile\n        /* c8 ignore next 11 */\n        if (this.isMobile.matches) {\n            this.dependencyManager.add('sp-tray');\n            import('@spectrum-web-components/tray/sp-tray.js');\n            return html`\n                <sp-tray\n                    id=\"popover\"\n                    role=\"presentation\"\n                    style=${styleMap(this.containerStyles)}\n                >\n                    ${accessibleMenu}\n                </sp-tray>\n            `;\n        }\n        this.dependencyManager.add('sp-popover');\n        import('@spectrum-web-components/popover/sp-popover.js');\n        return html`\n            <sp-popover\n                id=\"popover\"\n                role=\"presentation\"\n                style=${styleMap(this.containerStyles)}\n                placement=${this.placement}\n            >\n                ${accessibleMenu}\n            </sp-popover>\n        `;\n    }\n\n    protected hasRenderedOverlay = false;\n\n    private onScroll(): void {\n        this.dispatchEvent(\n            new Event('scroll', {\n                cancelable: true,\n                composed: true,\n            })\n        );\n    }\n\n    protected get renderMenu(): TemplateResult {\n        const menu = html`\n            <sp-menu\n                aria-labelledby=\"applied-label\"\n                @change=${this.handleChange}\n                id=\"menu\"\n                @keydown=${{\n                    handleEvent: this.handleEnterKeydown,\n                    capture: true,\n                }}\n                @scroll=${this.onScroll}\n                role=${this.listRole}\n                .selects=${this.selects}\n                .selected=${this.value ? [this.value] : []}\n                size=${this.size}\n                @sp-menu-item-added-or-updated=${this.shouldManageSelection}\n            >\n                <slot @slotchange=${this.shouldScheduleManageSelection}></slot>\n            </sp-menu>\n        `;\n        this.hasRenderedOverlay =\n            this.hasRenderedOverlay ||\n            this.focused ||\n            this.open ||\n            !!this.deprecatedMenu;\n        if (this.hasRenderedOverlay) {\n            if (this.dependencyManager.loaded) {\n                this.dependencyManager.add('sp-overlay');\n            }\n            return this.renderOverlay(menu);\n        }\n        return menu;\n    }\n\n    private willManageSelection = false;\n\n    protected shouldScheduleManageSelection(event?: Event): void {\n        if (\n            !this.willManageSelection &&\n            (!event ||\n                ((event.target as HTMLElement).getRootNode() as ShadowRoot)\n                    .host === this)\n        ) {\n            this.willManageSelection = true;\n            requestAnimationFrame(() => {\n                requestAnimationFrame(() => {\n                    this.manageSelection();\n                });\n            });\n        }\n    }\n\n    protected shouldManageSelection(): void {\n        if (this.willManageSelection) {\n            return;\n        }\n        this.willManageSelection = true;\n        this.manageSelection();\n    }\n\n    protected async manageSelection(): Promise<void> {\n        if (this.selects == null) return;\n\n        this.selectionPromise = new Promise(\n            (res) => (this.selectionResolver = res)\n        );\n        let selectedItem: MenuItem | undefined;\n        await this.optionsMenu.updateComplete;\n        if (this.recentlyConnected) {\n            // Work around for attach timing differences in Safari and Firefox.\n            // Remove when refactoring to Menu passthrough wrapper.\n            await new Promise((res) => requestAnimationFrame(() => res(true)));\n            this.recentlyConnected = false;\n        }\n        this.menuItems.forEach((item) => {\n            if (this.value === item.value && !item.disabled) {\n                selectedItem = item;\n            } else {\n                item.selected = false;\n            }\n        });\n        if (selectedItem) {\n            selectedItem.selected = !!this.selects;\n            this.selectedItem = selectedItem;\n        } else {\n            this.value = '';\n            this.selectedItem = undefined;\n        }\n        if (this.open) {\n            await this.optionsMenu.updateComplete;\n            this.optionsMenu.updateSelectedItemIndex();\n        }\n        this.selectionResolver();\n        this.willManageSelection = false;\n    }\n\n    private selectionPromise = Promise.resolve();\n    private selectionResolver!: () => void;\n\n    protected override async getUpdateComplete(): Promise<boolean> {\n        const complete = (await super.getUpdateComplete()) as boolean;\n        await this.selectionPromise;\n        // if (this.overlayElement) {\n        //     await this.overlayElement.updateComplete;\n        // }\n        return complete;\n    }\n\n    private recentlyConnected = false;\n\n    private enterKeydownOn: EventTarget | null = null;\n\n    protected handleEnterKeydown = (event: KeyboardEvent): void => {\n        if (event.code !== 'Enter') {\n            return;\n        }\n\n        if (this.enterKeydownOn) {\n            event.preventDefault();\n            return;\n        }\n        this.enterKeydownOn = event.target;\n        this.addEventListener(\n            'keyup',\n            async (keyupEvent: KeyboardEvent) => {\n                if (keyupEvent.code !== 'Enter') {\n                    return;\n                }\n                this.enterKeydownOn = null;\n            },\n            { once: true }\n        );\n    };\n\n    public bindEvents(): void {\n        this.strategy?.abort();\n        if (this.isMobile.matches) {\n            this.strategy = new strategies['mobile'](this.button, this);\n        } else {\n            this.strategy = new strategies['desktop'](this.button, this);\n        }\n    }\n\n    public override connectedCallback(): void {\n        super.connectedCallback();\n        this.recentlyConnected = this.hasUpdated;\n    }\n\n    public override disconnectedCallback(): void {\n        this.close();\n        this.strategy?.releaseDescription();\n        super.disconnectedCallback();\n    }\n}\n\n/**\n * @element sp-picker\n *\n * @slot label - The placeholder content for the Picker\n * @slot description - The description content for the Picker\n * @slot tooltip - Tooltip to to be applied to the the Picker Button\n * @slot - menu items to be listed in the Picker\n * @fires change - Announces that the `value` of the element has changed\n * @fires sp-opened - Announces that the overlay has been opened\n * @fires sp-closed - Announces that the overlay has been closed\n */\nexport class Picker extends PickerBase {\n    public static override get styles(): CSSResultArray {\n        return [pickerStyles, chevronStyles, chevronIconOverrides];\n    }\n\n    protected override get containerStyles(): StyleInfo {\n        const styles = super.containerStyles;\n        if (!this.quiet) {\n            styles['min-width'] = `${this.offsetWidth}px`;\n        }\n        return styles;\n    }\n\n    protected override handleKeydown = (event: KeyboardEvent): void => {\n        const { code } = event;\n        this.focused = true;\n        if (!code.startsWith('Arrow') || this.readonly || this.pending) {\n            return;\n        }\n        if (code === 'ArrowUp' || code === 'ArrowDown') {\n            this.toggle(true);\n            event.preventDefault();\n            return;\n        }\n        event.preventDefault();\n        const selectedIndex = this.selectedItem\n            ? this.menuItems.indexOf(this.selectedItem)\n            : -1;\n        // use a positive offset to find the first non-disabled item when no selection is available.\n        const nextOffset = selectedIndex < 0 || code === 'ArrowRight' ? 1 : -1;\n        let nextIndex = selectedIndex + nextOffset;\n        while (\n            this.menuItems[nextIndex] &&\n            this.menuItems[nextIndex].disabled\n        ) {\n            nextIndex += nextOffset;\n        }\n        if (!this.menuItems[nextIndex] || this.menuItems[nextIndex].disabled) {\n            return;\n        }\n        if (!this.value || nextIndex !== selectedIndex) {\n            this.setValueFromItem(this.menuItems[nextIndex]);\n        }\n    };\n}\n"],
+  "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n    CSSResultArray,\n    DefaultElementSize,\n    html,\n    nothing,\n    PropertyValues,\n    render,\n    SizedMixin,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n    classMap,\n    ifDefined,\n    StyleInfo,\n    styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n    property,\n    query,\n    state,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport pickerStyles from './picker.css.js';\nimport chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport chevronIconOverrides from '@spectrum-web-components/icon/src/icon-chevron-overrides.css.js';\n\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\nimport type { Tooltip } from '@spectrum-web-components/tooltip';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport type {\n    Menu,\n    MenuItem,\n    MenuItemChildren,\n} from '@spectrum-web-components/menu';\nimport { Placement } from '@spectrum-web-components/overlay';\nimport {\n    IS_MOBILE,\n    MatchMediaController,\n} from '@spectrum-web-components/reactive-controllers/src/MatchMedia.js';\nimport { DependencyManagerController } from '@spectrum-web-components/reactive-controllers/src/DependencyManger.js';\nimport { PendingStateController } from '@spectrum-web-components/reactive-controllers/src/PendingState.js';\nimport { Overlay } from '@spectrum-web-components/overlay/src/Overlay.js';\nimport type { SlottableRequestEvent } from '@spectrum-web-components/overlay/src/slottable-request-event.js';\nimport type { FieldLabel } from '@spectrum-web-components/field-label';\n\nimport { DesktopController } from './DesktopController.js';\nimport { MobileController } from './MobileController.js';\nimport { strategies } from './strategies.js';\n\nconst chevronClass = {\n    s: 'spectrum-UIIcon-ChevronDown75',\n    m: 'spectrum-UIIcon-ChevronDown100',\n    l: 'spectrum-UIIcon-ChevronDown200',\n    xl: 'spectrum-UIIcon-ChevronDown300',\n};\n\nexport const DESCRIPTION_ID = 'option-picker';\nexport class PickerBase extends SizedMixin(Focusable, { noDefaultSize: true }) {\n    public isMobile = new MatchMediaController(this, IS_MOBILE);\n\n    public strategy!: DesktopController | MobileController;\n\n    @state()\n    appliedLabel?: string;\n\n    @query('#button')\n    public button!: HTMLButtonElement;\n\n    public dependencyManager = new DependencyManagerController(this);\n\n    private deprecatedMenu: Menu | null = null;\n\n    @property({ type: Boolean, reflect: true })\n    public override disabled = false;\n\n    @property({ type: Boolean, reflect: true })\n    public focused = false;\n\n    @property({ type: String, reflect: true })\n    public icons?: 'only' | 'none';\n\n    @property({ type: Boolean, reflect: true })\n    public invalid = false;\n\n    /** Whether the items are currently loading. */\n    @property({ type: Boolean, reflect: true })\n    public pending = false;\n\n    /** Defines a string value that labels the Picker while it is in pending state. */\n    @property({ type: String, attribute: 'pending-label' })\n    public pendingLabel = 'Pending';\n\n    @property()\n    public label?: string;\n\n    @property({ type: Boolean, reflect: true })\n    public open = false;\n\n    @property({ type: Boolean, reflect: true })\n    public readonly = false;\n\n    public selects: undefined | 'single' = 'single';\n\n    @state()\n    public labelAlignment?: 'inline';\n\n    protected get menuItems(): MenuItem[] {\n        return this.optionsMenu.childItems;\n    }\n\n    @query('sp-menu')\n    public optionsMenu!: Menu;\n\n    private _selfManageFocusElement = false;\n\n    public override get selfManageFocusElement(): boolean {\n        return this._selfManageFocusElement;\n    }\n\n    @query('sp-overlay')\n    public overlayElement!: Overlay;\n\n    protected tooltipEl?: Tooltip;\n\n    /**\n     * @type {\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"}\n     * @attr\n     */\n\n    @property()\n    public placement: Placement = 'bottom-start';\n\n    @property({ type: Boolean, reflect: true })\n    public quiet = false;\n\n    @property({ type: String })\n    public value = '';\n\n    @property({ attribute: false })\n    public get selectedItem(): MenuItem | undefined {\n        return this._selectedItem;\n    }\n\n    public pendingStateController: PendingStateController<this>;\n\n    /**\n     * Initializes the `PendingStateController` for the Picker component.\n     * The `PendingStateController` manages the pending state of the Picker.\n     */\n    constructor() {\n        super();\n        this.pendingStateController = new PendingStateController(this);\n    }\n\n    public set selectedItem(selectedItem: MenuItem | undefined) {\n        this.selectedItemContent = selectedItem\n            ? selectedItem.itemChildren\n            : undefined;\n\n        if (selectedItem === this.selectedItem) return;\n        const oldSelectedItem = this.selectedItem;\n        this._selectedItem = selectedItem;\n        this.requestUpdate('selectedItem', oldSelectedItem);\n    }\n\n    _selectedItem?: MenuItem;\n\n    protected listRole: 'listbox' | 'menu' = 'listbox';\n    protected itemRole = 'option';\n\n    public override get focusElement(): HTMLElement {\n        if (this.open) {\n            return this.optionsMenu;\n        }\n        return this.button;\n    }\n\n    public forceFocusVisible(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.focused = true;\n    }\n\n    public override click(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.toggle();\n    }\n\n    public handleButtonBlur(): void {\n        this.focused = false;\n    }\n\n    public override focus(options?: FocusOptions): void {\n        super.focus(options);\n\n        if (!this.disabled && this.focusElement) {\n            this.focused = this.hasVisibleFocusInTree();\n        }\n    }\n\n    public handleHelperFocus(): void {\n        // set focused to true here instead of handleButtonFocus so clicks don't flash a focus outline\n        this.focused = true;\n        this.button.focus();\n    }\n\n    public handleChange(event: Event): void {\n        if (this.strategy) {\n            this.strategy.preventNextToggle = 'no';\n        }\n        const target = event.target as Menu;\n        const [selected] = target.selectedItems;\n        event.stopPropagation();\n        if (event.cancelable) {\n            this.setValueFromItem(selected, event);\n        } else {\n            // Non-cancelable \"change\" events announce a selection with no value\n            // change that should close the Picker element.\n            this.open = false;\n            if (this.strategy) {\n                this.strategy.open = false;\n            }\n        }\n    }\n\n    public handleButtonFocus(event: FocusEvent): void {\n        this.strategy?.handleButtonFocus(event);\n    }\n\n    protected handleKeydown = (event: KeyboardEvent): void => {\n        this.focused = true;\n        if (event.code !== 'ArrowDown' && event.code !== 'ArrowUp') {\n            return;\n        }\n        event.stopPropagation();\n        event.preventDefault();\n        this.toggle(true);\n    };\n\n    protected async setValueFromItem(\n        item: MenuItem,\n        menuChangeEvent?: Event\n    ): Promise<void> {\n        this.open = false;\n        // should always close when \"setting\" a value\n        if (this.strategy) {\n            this.strategy.open = false;\n        }\n        const oldSelectedItem = this.selectedItem;\n        const oldValue = this.value;\n\n        // Set a value.\n        this.selectedItem = item;\n        this.value = item?.value ?? '';\n        await this.updateComplete;\n        const applyDefault = this.dispatchEvent(\n            new Event('change', {\n                bubbles: true,\n                // Allow it to be prevented.\n                cancelable: true,\n                composed: true,\n            })\n        );\n        if (!applyDefault && this.selects) {\n            if (menuChangeEvent) {\n                menuChangeEvent.preventDefault();\n            }\n            this.setMenuItemSelected(this.selectedItem as MenuItem, false);\n            if (oldSelectedItem) {\n                this.setMenuItemSelected(oldSelectedItem, true);\n            }\n            this.selectedItem = oldSelectedItem;\n            this.value = oldValue;\n            this.open = true;\n            if (this.strategy) {\n                this.strategy.open = true;\n            }\n            return;\n        } else if (!this.selects) {\n            // Unset the value if not carrying a selection\n            this.selectedItem = oldSelectedItem;\n            this.value = oldValue;\n            return;\n        }\n        if (oldSelectedItem) {\n            this.setMenuItemSelected(oldSelectedItem, false);\n        }\n        this.setMenuItemSelected(item, !!this.selects);\n    }\n\n    protected setMenuItemSelected(item: MenuItem, value: boolean): void {\n        // matches null | undefined\n        if (this.selects == null) return;\n        item.selected = value;\n    }\n\n    public toggle(target?: boolean): void {\n        if (this.readonly || this.pending) {\n            return;\n        }\n        this.open = typeof target !== 'undefined' ? target : !this.open;\n        if (this.strategy) {\n            this.strategy.open = this.open;\n        }\n        if (this.open) {\n            this._selfManageFocusElement = true;\n        } else {\n            this._selfManageFocusElement = false;\n        }\n    }\n\n    public close(): void {\n        if (this.readonly) {\n            return;\n        }\n        if (this.strategy) {\n            this.open = false;\n            this.strategy.open = false;\n        }\n    }\n\n    protected get containerStyles(): StyleInfo {\n        // @todo: test in mobile\n        /* c8 ignore next 5 */\n        if (this.isMobile.matches) {\n            return {\n                '--swc-menu-width': '100%',\n            };\n        }\n        return {};\n    }\n\n    @state()\n    protected get selectedItemContent(): MenuItemChildren {\n        return this._selectedItemContent || { icon: [], content: [] };\n    }\n\n    protected set selectedItemContent(\n        selectedItemContent: MenuItemChildren | undefined\n    ) {\n        if (selectedItemContent === this.selectedItemContent) return;\n\n        const oldContent = this.selectedItemContent;\n        this._selectedItemContent = selectedItemContent;\n        this.requestUpdate('selectedItemContent', oldContent);\n    }\n\n    _selectedItemContent?: MenuItemChildren;\n\n    protected handleTooltipSlotchange(\n        event: Event & { target: HTMLSlotElement }\n    ): void {\n        this.tooltipEl = event.target.assignedElements()[0] as\n            | Tooltip\n            | undefined;\n    }\n\n    public handleSlottableRequest = (_event: SlottableRequestEvent): void => {};\n\n    protected renderLabelContent(content: Node[]): TemplateResult | Node[] {\n        if (this.value && this.selectedItem) {\n            return content;\n        }\n        return html`\n            <slot name=\"label\" id=\"label\">\n                <span\n                    aria-hidden=${ifDefined(\n                        this.appliedLabel ? undefined : 'true'\n                    )}\n                >\n                    ${this.label}\n                </span>\n            </slot>\n        `;\n    }\n\n    protected get buttonContent(): TemplateResult[] {\n        const labelClasses = {\n            'visually-hidden': this.icons === 'only' && !!this.value,\n            placeholder: !this.value,\n            label: true,\n        };\n        const appliedLabel = this.appliedLabel || this.label;\n        return [\n            html`\n                <span id=\"icon\" ?hidden=${this.icons === 'none'}>\n                    ${this.selectedItemContent.icon}\n                </span>\n                <span\n                    id=${ifDefined(\n                        this.value && this.selectedItem ? 'label' : undefined\n                    )}\n                    class=${classMap(labelClasses)}\n                >\n                    ${this.renderLabelContent(this.selectedItemContent.content)}\n                </span>\n                ${this.value && this.selectedItem\n                    ? html`\n                          <span\n                              aria-hidden=\"true\"\n                              class=\"visually-hidden\"\n                              id=\"applied-label\"\n                          >\n                              ${appliedLabel}\n                              <slot name=\"label\"></slot>\n                          </span>\n                      `\n                    : html`\n                          <span hidden id=\"applied-label\">${appliedLabel}</span>\n                      `}\n                ${this.invalid && !this.pending\n                    ? html`\n                          <sp-icon-alert\n                              class=\"validation-icon\"\n                          ></sp-icon-alert>\n                      `\n                    : nothing}\n                ${this.pendingStateController.renderPendingState()}\n                <sp-icon-chevron100\n                    class=\"picker ${chevronClass[\n                        this.size as DefaultElementSize\n                    ]}\"\n                ></sp-icon-chevron100>\n                <slot\n                    aria-hidden=\"true\"\n                    name=\"tooltip\"\n                    id=\"tooltip\"\n                    @slotchange=${this.handleTooltipSlotchange}\n                ></slot>\n            `,\n        ];\n    }\n\n    applyFocusElementLabel = (\n        value: string,\n        labelElement: FieldLabel\n    ): void => {\n        this.appliedLabel = value;\n        this.labelAlignment = labelElement.sideAligned ? 'inline' : undefined;\n    };\n\n    protected renderOverlay(menu: TemplateResult): TemplateResult {\n        if (this.strategy?.overlay === undefined) {\n            return menu;\n        }\n        const container = this.renderContainer(menu);\n        render(container, this.strategy?.overlay as unknown as HTMLElement, {\n            host: this,\n        });\n        return this.strategy?.overlay as unknown as TemplateResult;\n    }\n\n    protected get renderDescriptionSlot(): TemplateResult {\n        return html`\n            <div id=${DESCRIPTION_ID}>\n                <slot name=\"description\"></slot>\n            </div>\n        `;\n    }\n    // a helper to throw focus to the button is needed because Safari\n    // won't include buttons in the tab order even with tabindex=\"0\"\n    protected override render(): TemplateResult {\n        if (this.tooltipEl) {\n            this.tooltipEl.disabled = this.open;\n        }\n        return html`\n            <span\n                id=\"focus-helper\"\n                tabindex=\"${this.focused || this.open ? '-1' : '0'}\"\n                @focus=${this.handleHelperFocus}\n                aria-describedby=${DESCRIPTION_ID}\n            ></span>\n            <button\n                aria-controls=${ifDefined(this.open ? 'menu' : undefined)}\n                aria-describedby=\"tooltip\"\n                aria-expanded=${this.open ? 'true' : 'false'}\n                aria-haspopup=\"true\"\n                aria-labelledby=\"loader icon label applied-label\"\n                id=\"button\"\n                class=${ifDefined(\n                    this.labelAlignment\n                        ? `label-${this.labelAlignment}`\n                        : undefined\n                )}\n                @blur=${this.handleButtonBlur}\n                @keydown=${{\n                    handleEvent: this.handleEnterKeydown,\n                    capture: true,\n                }}\n                ?disabled=${this.disabled}\n                tabindex=\"-1\"\n            >\n                ${this.buttonContent}\n            </button>\n            ${this.renderMenu} ${this.renderDescriptionSlot}\n        `;\n    }\n\n    protected override update(changes: PropertyValues<this>): void {\n        if (this.selects) {\n            // Always force `selects` to \"single\" when set.\n            // TODO: Add support functionally and visually for \"multiple\"\n            this.selects = 'single';\n        }\n        if (changes.has('disabled') && this.disabled) {\n            if (this.strategy) {\n                this.open = false;\n                this.strategy.open = false;\n            }\n        }\n        if (changes.has('pending') && this.pending) {\n            if (this.strategy) {\n                this.open = false;\n                this.strategy.open = false;\n            }\n        }\n        if (changes.has('value')) {\n            // MenuItems update a frame late for <slot> management,\n            // await the same here.\n            this.shouldScheduleManageSelection();\n        }\n        // Maybe it's finally time to remove this support?\n        if (!this.hasUpdated) {\n            this.deprecatedMenu = this.querySelector(':scope > sp-menu');\n            this.deprecatedMenu?.toggleAttribute('ignore', true);\n            this.deprecatedMenu?.setAttribute('selects', 'inherit');\n        }\n        if (window.__swc.DEBUG) {\n            if (!this.hasUpdated && this.querySelector(':scope > sp-menu')) {\n                const { localName } = this;\n                window.__swc.warn(\n                    this,\n                    `You no longer need to provide an <sp-menu> child to ${localName}. Any styling or attributes on the <sp-menu> will be ignored.`,\n                    'https://opensource.adobe.com/spectrum-web-components/components/picker/#sizes',\n                    { level: 'deprecation' }\n                );\n            }\n            this.updateComplete.then(async () => {\n                // Attributes should be user supplied, making them available before first update.\n                // However, `appliesLabel` is applied by external elements that must be update complete as well to be bound appropriately.\n                await new Promise((res) => requestAnimationFrame(res));\n                await new Promise((res) => requestAnimationFrame(res));\n                if (\n                    !this.label &&\n                    !this.getAttribute('aria-label') &&\n                    !this.getAttribute('aria-labelledby') &&\n                    !this.appliedLabel\n                ) {\n                    window.__swc.warn(\n                        this,\n                        `<${this.localName}> needs one of the following to be accessible:`,\n                        'https://opensource.adobe.com/spectrum-web-components/components/picker/#accessibility',\n                        {\n                            type: 'accessibility',\n                            issues: [\n                                `an <sp-field-label> element with a \\`for\\` attribute referencing the \\`id\\` of the \\`<${this.localName}>\\`, or`,\n                                'value supplied to the \"label\" attribute, which will be displayed visually as placeholder text, or',\n                                'text content supplied in a <span> with slot=\"label\", which will also be displayed visually as placeholder text.',\n                            ],\n                        }\n                    );\n                }\n            });\n        }\n        super.update(changes);\n    }\n\n    protected bindButtonKeydownListener(): void {\n        this.button.addEventListener('keydown', this.handleKeydown);\n    }\n\n    protected override updated(changes: PropertyValues<this>): void {\n        super.updated(changes);\n        if (changes.has('open')) {\n            this.strategy.open = this.open;\n        }\n    }\n\n    protected override firstUpdated(changes: PropertyValues<this>): void {\n        super.firstUpdated(changes);\n        this.bindButtonKeydownListener();\n        this.bindEvents();\n    }\n\n    protected get dismissHelper(): TemplateResult {\n        return html`\n            <div class=\"visually-hidden\">\n                <button\n                    tabindex=\"-1\"\n                    aria-label=\"Dismiss\"\n                    @click=${this.close}\n                ></button>\n            </div>\n        `;\n    }\n\n    protected renderContainer(menu: TemplateResult): TemplateResult {\n        const accessibleMenu = html`\n            ${this.dismissHelper} ${menu} ${this.dismissHelper}\n        `;\n        // @todo: test in mobile\n        /* c8 ignore next 11 */\n        if (this.isMobile.matches) {\n            this.dependencyManager.add('sp-tray');\n            import('@spectrum-web-components/tray/sp-tray.js');\n            return html`\n                <sp-tray\n                    id=\"popover\"\n                    role=\"presentation\"\n                    style=${styleMap(this.containerStyles)}\n                >\n                    ${accessibleMenu}\n                </sp-tray>\n            `;\n        }\n        this.dependencyManager.add('sp-popover');\n        import('@spectrum-web-components/popover/sp-popover.js');\n        return html`\n            <sp-popover\n                id=\"popover\"\n                role=\"presentation\"\n                style=${styleMap(this.containerStyles)}\n                placement=${this.placement}\n            >\n                ${accessibleMenu}\n            </sp-popover>\n        `;\n    }\n\n    protected hasRenderedOverlay = false;\n\n    private onScroll(): void {\n        this.dispatchEvent(\n            new Event('scroll', {\n                cancelable: true,\n                composed: true,\n            })\n        );\n    }\n\n    protected get renderMenu(): TemplateResult {\n        const menu = html`\n            <sp-menu\n                aria-labelledby=\"applied-label\"\n                @change=${this.handleChange}\n                id=\"menu\"\n                @keydown=${{\n                    handleEvent: this.handleEnterKeydown,\n                    capture: true,\n                }}\n                @scroll=${this.onScroll}\n                role=${this.listRole}\n                .selects=${this.selects}\n                .selected=${this.value ? [this.value] : []}\n                size=${this.size}\n                @sp-menu-item-added-or-updated=${this.shouldManageSelection}\n            >\n                <slot @slotchange=${this.shouldScheduleManageSelection}></slot>\n            </sp-menu>\n        `;\n        this.hasRenderedOverlay =\n            this.hasRenderedOverlay ||\n            this.focused ||\n            this.open ||\n            !!this.deprecatedMenu;\n        if (this.hasRenderedOverlay) {\n            if (this.dependencyManager.loaded) {\n                this.dependencyManager.add('sp-overlay');\n            }\n            return this.renderOverlay(menu);\n        }\n        return menu;\n    }\n\n    private willManageSelection = false;\n\n    protected shouldScheduleManageSelection(event?: Event): void {\n        if (\n            !this.willManageSelection &&\n            (!event ||\n                ((event.target as HTMLElement).getRootNode() as ShadowRoot)\n                    .host === this)\n        ) {\n            this.willManageSelection = true;\n            requestAnimationFrame(() => {\n                requestAnimationFrame(() => {\n                    this.manageSelection();\n                });\n            });\n        }\n    }\n\n    protected shouldManageSelection(): void {\n        if (this.willManageSelection) {\n            return;\n        }\n        this.willManageSelection = true;\n        this.manageSelection();\n    }\n\n    protected async manageSelection(): Promise<void> {\n        if (this.selects == null) return;\n\n        this.selectionPromise = new Promise(\n            (res) => (this.selectionResolver = res)\n        );\n        let selectedItem: MenuItem | undefined;\n        await this.optionsMenu.updateComplete;\n        if (this.recentlyConnected) {\n            // Work around for attach timing differences in Safari and Firefox.\n            // Remove when refactoring to Menu passthrough wrapper.\n            await new Promise((res) => requestAnimationFrame(() => res(true)));\n            this.recentlyConnected = false;\n        }\n        this.menuItems.forEach((item) => {\n            if (this.value === item.value && !item.disabled) {\n                selectedItem = item;\n            } else {\n                item.selected = false;\n            }\n        });\n        if (selectedItem) {\n            selectedItem.selected = !!this.selects;\n            this.selectedItem = selectedItem;\n        } else {\n            this.value = '';\n            this.selectedItem = undefined;\n        }\n        if (this.open) {\n            await this.optionsMenu.updateComplete;\n            this.optionsMenu.updateSelectedItemIndex();\n        }\n        this.selectionResolver();\n        this.willManageSelection = false;\n    }\n\n    private selectionPromise = Promise.resolve();\n    private selectionResolver!: () => void;\n\n    protected override async getUpdateComplete(): Promise<boolean> {\n        const complete = (await super.getUpdateComplete()) as boolean;\n        await this.selectionPromise;\n        // if (this.overlayElement) {\n        //     await this.overlayElement.updateComplete;\n        // }\n        return complete;\n    }\n\n    private recentlyConnected = false;\n\n    private enterKeydownOn: EventTarget | null = null;\n\n    protected handleEnterKeydown = (event: KeyboardEvent): void => {\n        if (event.code !== 'Enter') {\n            return;\n        }\n\n        if (this.enterKeydownOn) {\n            event.preventDefault();\n            return;\n        }\n        this.enterKeydownOn = event.target;\n        this.addEventListener(\n            'keyup',\n            async (keyupEvent: KeyboardEvent) => {\n                if (keyupEvent.code !== 'Enter') {\n                    return;\n                }\n                this.enterKeydownOn = null;\n            },\n            { once: true }\n        );\n    };\n\n    public bindEvents(): void {\n        this.strategy?.abort();\n        if (this.isMobile.matches) {\n            this.strategy = new strategies['mobile'](this.button, this);\n        } else {\n            this.strategy = new strategies['desktop'](this.button, this);\n        }\n    }\n\n    public override connectedCallback(): void {\n        super.connectedCallback();\n        this.recentlyConnected = this.hasUpdated;\n    }\n\n    public override disconnectedCallback(): void {\n        this.close();\n        this.strategy?.releaseDescription();\n        super.disconnectedCallback();\n    }\n}\n\n/**\n * @element sp-picker\n *\n * @slot label - The placeholder content for the Picker\n * @slot description - The description content for the Picker\n * @slot tooltip - Tooltip to to be applied to the the Picker Button\n * @slot - menu items to be listed in the Picker\n * @fires change - Announces that the `value` of the element has changed\n * @fires sp-opened - Announces that the overlay has been opened\n * @fires sp-closed - Announces that the overlay has been closed\n */\nexport class Picker extends PickerBase {\n    public static override get styles(): CSSResultArray {\n        return [pickerStyles, chevronStyles, chevronIconOverrides];\n    }\n\n    protected override get containerStyles(): StyleInfo {\n        const styles = super.containerStyles;\n        if (!this.quiet) {\n            styles['min-width'] = `${this.offsetWidth}px`;\n        }\n        return styles;\n    }\n\n    protected override handleKeydown = (event: KeyboardEvent): void => {\n        const { code } = event;\n        this.focused = true;\n        if (!code.startsWith('Arrow') || this.readonly || this.pending) {\n            return;\n        }\n        if (code === 'ArrowUp' || code === 'ArrowDown') {\n            this.toggle(true);\n            event.preventDefault();\n            return;\n        }\n        event.preventDefault();\n        const selectedIndex = this.selectedItem\n            ? this.menuItems.indexOf(this.selectedItem)\n            : -1;\n        // use a positive offset to find the first non-disabled item when no selection is available.\n        const nextOffset = selectedIndex < 0 || code === 'ArrowRight' ? 1 : -1;\n        let nextIndex = selectedIndex + nextOffset;\n        while (\n            this.menuItems[nextIndex] &&\n            this.menuItems[nextIndex].disabled\n        ) {\n            nextIndex += nextOffset;\n        }\n        if (!this.menuItems[nextIndex] || this.menuItems[nextIndex].disabled) {\n            return;\n        }\n        if (!this.value || nextIndex !== selectedIndex) {\n            this.setValueFromItem(this.menuItems[nextIndex]);\n        }\n    };\n}\n"],
   "mappings": "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",
   "names": ["html", "nothing", "render", "SizedMixin", "classMap", "ifDefined", "styleMap", "property", "query", "state", "pickerStyles", "chevronStyles", "chevronIconOverrides", "Focusable", "IS_MOBILE", "MatchMediaController", "DependencyManagerController", "PendingStateController", "strategies", "chevronClass", "event", "_event", "value", "labelElement", "keyupEvent", "selectedItem", "oldSelectedItem", "options", "target", "selected", "_a", "item", "menuChangeEvent", "oldValue", "selectedItemContent", "oldContent", "content", "labelClasses", "appliedLabel", "menu", "_b", "_c", "container", "changes", "accessibleMenu", "res", "complete", "__decorateClass", "code", "selectedIndex", "nextOffset", "nextIndex", "styles"]
 }