@spectrum-web-components/picker 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/picker",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -82,20 +82,20 @@
82
82
  "lit-html"
83
83
  ],
84
84
  "dependencies": {
85
- "@spectrum-web-components/base": "^1.0.0",
86
- "@spectrum-web-components/button": "^1.0.0",
87
- "@spectrum-web-components/field-label": "^1.0.0",
88
- "@spectrum-web-components/icon": "^1.0.0",
89
- "@spectrum-web-components/icons-ui": "^1.0.0",
90
- "@spectrum-web-components/icons-workflow": "^1.0.0",
91
- "@spectrum-web-components/menu": "^1.0.0",
92
- "@spectrum-web-components/overlay": "^1.0.0",
93
- "@spectrum-web-components/popover": "^1.0.0",
94
- "@spectrum-web-components/progress-circle": "^1.0.0",
95
- "@spectrum-web-components/reactive-controllers": "^1.0.0",
96
- "@spectrum-web-components/shared": "^1.0.0",
97
- "@spectrum-web-components/tooltip": "^1.0.0",
98
- "@spectrum-web-components/tray": "^1.0.0"
85
+ "@spectrum-web-components/base": "^1.0.1",
86
+ "@spectrum-web-components/button": "^1.0.1",
87
+ "@spectrum-web-components/field-label": "^1.0.1",
88
+ "@spectrum-web-components/icon": "^1.0.1",
89
+ "@spectrum-web-components/icons-ui": "^1.0.1",
90
+ "@spectrum-web-components/icons-workflow": "^1.0.1",
91
+ "@spectrum-web-components/menu": "^1.0.1",
92
+ "@spectrum-web-components/overlay": "^1.0.1",
93
+ "@spectrum-web-components/popover": "^1.0.1",
94
+ "@spectrum-web-components/progress-circle": "^1.0.1",
95
+ "@spectrum-web-components/reactive-controllers": "^1.0.1",
96
+ "@spectrum-web-components/shared": "^1.0.1",
97
+ "@spectrum-web-components/tooltip": "^1.0.1",
98
+ "@spectrum-web-components/tray": "^1.0.1"
99
99
  },
100
100
  "devDependencies": {
101
101
  "@spectrum-css/picker": "^9.0.0-s2-foundations.15"
@@ -108,5 +108,5 @@
108
108
  "./sync/index.js",
109
109
  "./sync/sp-*.js"
110
110
  ],
111
- "gitHead": "5cf5d34645bf9494ebd20f64c42d1619523d2d84"
111
+ "gitHead": "b359bc0242712be118c5e3e2cc05f88707d3eeb1"
112
112
  }
@@ -9,7 +9,7 @@ export class DesktopController extends InteractionController {
9
9
  this.type = InteractionTypes.desktop;
10
10
  }
11
11
  handlePointerdown(event) {
12
- if (event.button !== 0) {
12
+ if (event.button !== 0 || event.pointerType === "touch") {
13
13
  return;
14
14
  }
15
15
  this.pointerdownState = this.open;
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["DesktopController.ts"],
4
- "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"],
5
- "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;",
4
+ "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"],
5
+ "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;",
6
6
  "names": []
7
7
  }
@@ -1,2 +1,2 @@
1
- "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})}}
1
+ "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})}}
2
2
  //# sourceMappingURL=DesktopController.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["DesktopController.ts"],
4
- "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"],
5
- "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",
4
+ "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"],
5
+ "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",
6
6
  "names": ["InteractionController", "InteractionTypes", "event", "cleanupAction", "cleanup", "_a", "signal"]
7
7
  }
package/src/Picker.dev.js CHANGED
@@ -431,7 +431,7 @@ export class PickerBase extends SizedMixin(Focusable, { noDefaultSize: true }) {
431
431
  if (!this.label && !this.getAttribute("aria-label") && !this.getAttribute("aria-labelledby") && !this.appliedLabel) {
432
432
  window.__swc.warn(
433
433
  this,
434
- "<${this.localName}> needs one of the following to be accessible:",
434
+ `<${this.localName}> needs one of the following to be accessible:`,
435
435
  "https://opensource.adobe.com/spectrum-web-components/components/picker/#accessibility",
436
436
  {
437
437
  type: "accessibility",
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["Picker.ts"],
4
- "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"],
5
- "mappings": ";;;;;;;;;;;AAYA;AAAA,EAGI;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,OAEG;AACP;AAAA,EACI;AAAA,EACA;AAAA,EAEA;AAAA,OACG;AACP;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,OACG;AAEP,OAAO,kBAAkB;AACzB,OAAO,mBAAmB;AAC1B,OAAO,0BAA0B;AAEjC,SAAS,iBAAiB;AAE1B,OAAO;AACP,OAAO;AACP,OAAO;AAOP;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,mCAAmC;AAC5C,SAAS,8BAA8B;AAOvC,SAAS,kBAAkB;AAE3B,MAAM,eAAe;AAAA,EACjB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AACR;AAEO,aAAM,iBAAiB;AACvB,aAAM,mBAAmB,WAAW,WAAW,EAAE,eAAe,KAAK,CAAC,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,EA4F3E,cAAc;AACV,UAAM;AA5FV,SAAO,WAAW,IAAI,qBAAqB,MAAM,SAAS;AAU1D,SAAO,oBAAoB,IAAI,4BAA4B,IAAI;AAE/D,SAAQ,iBAA8B;AAGtC,SAAgB,WAAW;AAG3B,SAAO,UAAU;AAMjB,SAAO,UAAU;AAIjB,SAAO,UAAU;AAIjB,SAAO,eAAe;AAMtB,SAAO,OAAO;AAGd,SAAO,WAAW;AAElB,SAAO,UAAgC;AAYvC,SAAQ,0BAA0B;AAiBlC,SAAO,YAAuB;AAG9B,SAAO,QAAQ;AAGf,SAAO,QAAQ;AA+Bf,SAAU,WAA+B;AACzC,SAAU,WAAW;AAkErB,SAAU,gBAAgB,CAAC,UAA+B;AACtD,WAAK,UAAU;AACf,UAAI,MAAM,SAAS,eAAe,MAAM,SAAS,WAAW;AACxD;AAAA,MACJ;AACA,YAAM,gBAAgB;AACtB,YAAM,eAAe;AACrB,WAAK,OAAO,IAAI;AAAA,IACpB;AAwHA,SAAO,yBAAyB,CAAC,WAAwC;AAAA,IAAC;AA4E1E,kCAAyB,CACrB,OACA,iBACO;AACP,WAAK,eAAe;AACpB,WAAK,iBAAiB,aAAa,cAAc,WAAW;AAAA,IAChE;AA8LA,SAAU,qBAAqB;AA6C/B,SAAQ,sBAAsB;AA8D9B,SAAQ,mBAAmB,QAAQ,QAAQ;AAY3C,SAAQ,oBAAoB;AAE5B,SAAQ,iBAAqC;AAE7C,SAAU,qBAAqB,CAAC,UAA+B;AAC3D,UAAI,MAAM,SAAS,SAAS;AACxB;AAAA,MACJ;AAEA,UAAI,KAAK,gBAAgB;AACrB,cAAM,eAAe;AACrB;AAAA,MACJ;AACA,WAAK,iBAAiB,MAAM;AAC5B,WAAK;AAAA,QACD;AAAA,QACA,OAAO,eAA8B;AACjC,cAAI,WAAW,SAAS,SAAS;AAC7B;AAAA,UACJ;AACA,eAAK,iBAAiB;AAAA,QAC1B;AAAA,QACA,EAAE,MAAM,KAAK;AAAA,MACjB;AAAA,IACJ;AAlnBI,SAAK,yBAAyB,IAAI,uBAAuB,IAAI;AAAA,EACjE;AAAA,EA9CA,IAAc,YAAwB;AAClC,WAAO,KAAK,YAAY;AAAA,EAC5B;AAAA,EAOA,IAAoB,yBAAkC;AAClD,WAAO,KAAK;AAAA,EAChB;AAAA,EAsBA,IAAW,eAAqC;AAC5C,WAAO,KAAK;AAAA,EAChB;AAAA,EAaA,IAAW,aAAa,cAAoC;AACxD,SAAK,sBAAsB,eACrB,aAAa,eACb;AAEN,QAAI,iBAAiB,KAAK,aAAc;AACxC,UAAM,kBAAkB,KAAK;AAC7B,SAAK,gBAAgB;AACrB,SAAK,cAAc,gBAAgB,eAAe;AAAA,EACtD;AAAA,EAOA,IAAoB,eAA4B;AAC5C,QAAI,KAAK,MAAM;AACX,aAAO,KAAK;AAAA,IAChB;AACA,WAAO,KAAK;AAAA,EAChB;AAAA,EAEO,oBAA0B;AAC7B,QAAI,KAAK,UAAU;AACf;AAAA,IACJ;AAEA,SAAK,UAAU;AAAA,EACnB;AAAA,EAEgB,QAAc;AAC1B,QAAI,KAAK,UAAU;AACf;AAAA,IACJ;AAEA,SAAK,OAAO;AAAA,EAChB;AAAA,EAEO,mBAAyB;AAC5B,SAAK,UAAU;AAAA,EACnB;AAAA,EAEgB,MAAM,SAA8B;AAChD,UAAM,MAAM,OAAO;AAEnB,QAAI,CAAC,KAAK,YAAY,KAAK,cAAc;AACrC,WAAK,UAAU,KAAK,sBAAsB;AAAA,IAC9C;AAAA,EACJ;AAAA,EAEO,oBAA0B;AAE7B,SAAK,UAAU;AACf,SAAK,OAAO,MAAM;AAAA,EACtB;AAAA,EAEO,aAAa,OAAoB;AACpC,QAAI,KAAK,UAAU;AACf,WAAK,SAAS,oBAAoB;AAAA,IACtC;AACA,UAAM,SAAS,MAAM;AACrB,UAAM,CAAC,QAAQ,IAAI,OAAO;AAC1B,UAAM,gBAAgB;AACtB,QAAI,MAAM,YAAY;AAClB,WAAK,iBAAiB,UAAU,KAAK;AAAA,IACzC,OAAO;AAGH,WAAK,OAAO;AACZ,UAAI,KAAK,UAAU;AACf,aAAK,SAAS,OAAO;AAAA,MACzB;AAAA,IACJ;AAAA,EACJ;AAAA,EAEO,kBAAkB,OAAyB;AApPtD;AAqPQ,eAAK,aAAL,mBAAe,kBAAkB;AAAA,EACrC;AAAA,EAYA,MAAgB,iBACZ,MACA,iBACa;AArQrB;AAsQQ,SAAK,OAAO;AAEZ,QAAI,KAAK,UAAU;AACf,WAAK,SAAS,OAAO;AAAA,IACzB;AACA,UAAM,kBAAkB,KAAK;AAC7B,UAAM,WAAW,KAAK;AAGtB,SAAK,eAAe;AACpB,SAAK,SAAQ,kCAAM,UAAN,YAAe;AAC5B,UAAM,KAAK;AACX,UAAM,eAAe,KAAK;AAAA,MACtB,IAAI,MAAM,UAAU;AAAA,QAChB,SAAS;AAAA;AAAA,QAET,YAAY;AAAA,QACZ,UAAU;AAAA,MACd,CAAC;AAAA,IACL;AACA,QAAI,CAAC,gBAAgB,KAAK,SAAS;AAC/B,UAAI,iBAAiB;AACjB,wBAAgB,eAAe;AAAA,MACnC;AACA,WAAK,oBAAoB,KAAK,cAA0B,KAAK;AAC7D,UAAI,iBAAiB;AACjB,aAAK,oBAAoB,iBAAiB,IAAI;AAAA,MAClD;AACA,WAAK,eAAe;AACpB,WAAK,QAAQ;AACb,WAAK,OAAO;AACZ,UAAI,KAAK,UAAU;AACf,aAAK,SAAS,OAAO;AAAA,MACzB;AACA;AAAA,IACJ,WAAW,CAAC,KAAK,SAAS;AAEtB,WAAK,eAAe;AACpB,WAAK,QAAQ;AACb;AAAA,IACJ;AACA,QAAI,iBAAiB;AACjB,WAAK,oBAAoB,iBAAiB,KAAK;AAAA,IACnD;AACA,SAAK,oBAAoB,MAAM,CAAC,CAAC,KAAK,OAAO;AAAA,EACjD;AAAA,EAEU,oBAAoB,MAAgB,OAAsB;AAEhE,QAAI,KAAK,WAAW,KAAM;AAC1B,SAAK,WAAW;AAAA,EACpB;AAAA,EAEO,OAAO,QAAwB;AAClC,QAAI,KAAK,YAAY,KAAK,SAAS;AAC/B;AAAA,IACJ;AACA,SAAK,OAAO,OAAO,WAAW,cAAc,SAAS,CAAC,KAAK;AAC3D,QAAI,KAAK,UAAU;AACf,WAAK,SAAS,OAAO,KAAK;AAAA,IAC9B;AACA,QAAI,KAAK,MAAM;AACX,WAAK,0BAA0B;AAAA,IACnC,OAAO;AACH,WAAK,0BAA0B;AAAA,IACnC;AAAA,EACJ;AAAA,EAEO,QAAc;AACjB,QAAI,KAAK,UAAU;AACf;AAAA,IACJ;AACA,QAAI,KAAK,UAAU;AACf,WAAK,OAAO;AACZ,WAAK,SAAS,OAAO;AAAA,IACzB;AAAA,EACJ;AAAA,EAEA,IAAc,kBAA6B;AAGvC,QAAI,KAAK,SAAS,SAAS;AACvB,aAAO;AAAA,QACH,oBAAoB;AAAA,MACxB;AAAA,IACJ;AACA,WAAO,CAAC;AAAA,EACZ;AAAA,EAGA,IAAc,sBAAwC;AAClD,WAAO,KAAK,wBAAwB,EAAE,MAAM,CAAC,GAAG,SAAS,CAAC,EAAE;AAAA,EAChE;AAAA,EAEA,IAAc,oBACV,qBACF;AACE,QAAI,wBAAwB,KAAK,oBAAqB;AAEtD,UAAM,aAAa,KAAK;AACxB,SAAK,uBAAuB;AAC5B,SAAK,cAAc,uBAAuB,UAAU;AAAA,EACxD;AAAA,EAIU,wBACN,OACI;AACJ,SAAK,YAAY,MAAM,OAAO,iBAAiB,EAAE,CAAC;AAAA,EAGtD;AAAA,EAIU,mBAAmB,SAA0C;AACnE,QAAI,KAAK,SAAS,KAAK,cAAc;AACjC,aAAO;AAAA,IACX;AACA,WAAO;AAAA;AAAA;AAAA,kCAGmB;AAAA,MACV,KAAK,eAAe,SAAY;AAAA,IACpC,CAAC;AAAA;AAAA,sBAEC,KAAK,KAAK;AAAA;AAAA;AAAA;AAAA,EAI5B;AAAA,EAEA,IAAc,gBAAkC;AAC5C,UAAM,eAAe;AAAA,MACjB,mBAAmB,KAAK,UAAU,UAAU,CAAC,CAAC,KAAK;AAAA,MACnD,aAAa,CAAC,KAAK;AAAA,MACnB,OAAO;AAAA,IACX;AACA,UAAM,eAAe,KAAK,gBAAgB,KAAK;AAC/C,WAAO;AAAA,MACH;AAAA,0CAC8B,KAAK,UAAU,MAAM;AAAA,sBACzC,KAAK,oBAAoB,IAAI;AAAA;AAAA;AAAA,yBAG1B;AAAA,QACD,KAAK,SAAS,KAAK,eAAe,UAAU;AAAA,MAChD,CAAC;AAAA,4BACO,SAAS,YAAY,CAAC;AAAA;AAAA,sBAE5B,KAAK,mBAAmB,KAAK,oBAAoB,OAAO,CAAC;AAAA;AAAA,kBAE7D,KAAK,SAAS,KAAK,eACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gCAMU,YAAY;AAAA;AAAA;AAAA,0BAItB;AAAA,4DACsC,YAAY;AAAA,uBACjD;AAAA,kBACL,KAAK,WAAW,CAAC,KAAK,UAClB;AAAA;AAAA;AAAA;AAAA,0BAKA,OAAO;AAAA,kBACX,KAAK,uBAAuB,mBAAmB,CAAC;AAAA;AAAA,oCAE9B,aACZ,KAAK,IACT,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kCAMa,KAAK,uBAAuB;AAAA;AAAA;AAAA,IAGtD;AAAA,EACJ;AAAA,EAUU,cAAc,MAAsC;AA5clE;AA6cQ,UAAI,UAAK,aAAL,mBAAe,aAAY,QAAW;AACtC,aAAO;AAAA,IACX;AACA,UAAM,YAAY,KAAK,gBAAgB,IAAI;AAC3C,WAAO,YAAW,UAAK,aAAL,mBAAe,SAAmC;AAAA,MAChE,MAAM;AAAA,IACV,CAAC;AACD,YAAO,UAAK,aAAL,mBAAe;AAAA,EAC1B;AAAA,EAEA,IAAc,wBAAwC;AAClD,WAAO;AAAA,sBACO,cAAc;AAAA;AAAA;AAAA;AAAA,EAIhC;AAAA;AAAA;AAAA,EAGmB,SAAyB;AACxC,QAAI,KAAK,WAAW;AAChB,WAAK,UAAU,WAAW,KAAK;AAAA,IACnC;AACA,WAAO;AAAA;AAAA;AAAA,4BAGa,KAAK,WAAW,KAAK,OAAO,OAAO,GAAG;AAAA,yBACzC,KAAK,iBAAiB;AAAA,mCACZ,cAAc;AAAA;AAAA;AAAA,gCAGjB,UAAU,KAAK,OAAO,SAAS,MAAS,CAAC;AAAA;AAAA,gCAEzC,KAAK,OAAO,SAAS,OAAO;AAAA;AAAA;AAAA;AAAA,wBAIpC;AAAA,MACJ,KAAK,iBACC,SAAS,KAAK,cAAc,KAC5B;AAAA,IACV,CAAC;AAAA,wBACO,KAAK,gBAAgB;AAAA,2BAClB;AAAA,MACP,aAAa,KAAK;AAAA,MAClB,SAAS;AAAA,IACb,CAAC;AAAA,4BACW,KAAK,QAAQ;AAAA;AAAA;AAAA,kBAGvB,KAAK,aAAa;AAAA;AAAA,cAEtB,KAAK,UAAU,IAAI,KAAK,qBAAqB;AAAA;AAAA,EAEvD;AAAA,EAEmB,OAAO,SAAqC;AArgBnE;AAsgBQ,QAAI,KAAK,SAAS;AAGd,WAAK,UAAU;AAAA,IACnB;AACA,QAAI,QAAQ,IAAI,UAAU,KAAK,KAAK,UAAU;AAC1C,UAAI,KAAK,UAAU;AACf,aAAK,OAAO;AACZ,aAAK,SAAS,OAAO;AAAA,MACzB;AAAA,IACJ;AACA,QAAI,QAAQ,IAAI,SAAS,KAAK,KAAK,SAAS;AACxC,UAAI,KAAK,UAAU;AACf,aAAK,OAAO;AACZ,aAAK,SAAS,OAAO;AAAA,MACzB;AAAA,IACJ;AACA,QAAI,QAAQ,IAAI,OAAO,GAAG;AAGtB,WAAK,8BAA8B;AAAA,IACvC;AAEA,QAAI,CAAC,KAAK,YAAY;AAClB,WAAK,iBAAiB,KAAK,cAAc,kBAAkB;AAC3D,iBAAK,mBAAL,mBAAqB,gBAAgB,UAAU;AAC/C,iBAAK,mBAAL,mBAAqB,aAAa,WAAW;AAAA,IACjD;AACA,QAAI,MAAoB;AACpB,UAAI,CAAC,KAAK,cAAc,KAAK,cAAc,kBAAkB,GAAG;AAC5D,cAAM,EAAE,UAAU,IAAI;AACtB,eAAO,MAAM;AAAA,UACT;AAAA,UACA,uDAAuD,SAAS;AAAA,UAChE;AAAA,UACA,EAAE,OAAO,cAAc;AAAA,QAC3B;AAAA,MACJ;AACA,WAAK,eAAe,KAAK,YAAY;AAGjC,cAAM,IAAI,QAAQ,CAAC,QAAQ,sBAAsB,GAAG,CAAC;AACrD,cAAM,IAAI,QAAQ,CAAC,QAAQ,sBAAsB,GAAG,CAAC;AACrD,YACI,CAAC,KAAK,SACN,CAAC,KAAK,aAAa,YAAY,KAC/B,CAAC,KAAK,aAAa,iBAAiB,KACpC,CAAC,KAAK,cACR;AACE,iBAAO,MAAM;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,cACI,MAAM;AAAA,cACN,QAAQ;AAAA,gBACJ,yFAAyF,KAAK,SAAS;AAAA,gBACvG;AAAA,gBACA;AAAA,cACJ;AAAA,YACJ;AAAA,UACJ;AAAA,QACJ;AAAA,MACJ,CAAC;AAAA,IACL;AACA,UAAM,OAAO,OAAO;AAAA,EACxB;AAAA,EAEU,4BAAkC;AACxC,SAAK,OAAO,iBAAiB,WAAW,KAAK,aAAa;AAAA,EAC9D;AAAA,EAEmB,QAAQ,SAAqC;AAC5D,UAAM,QAAQ,OAAO;AACrB,QAAI,QAAQ,IAAI,MAAM,GAAG;AACrB,WAAK,SAAS,OAAO,KAAK;AAAA,IAC9B;AAAA,EACJ;AAAA,EAEmB,aAAa,SAAqC;AACjE,UAAM,aAAa,OAAO;AAC1B,SAAK,0BAA0B;AAC/B,SAAK,WAAW;AAAA,EACpB;AAAA,EAEA,IAAc,gBAAgC;AAC1C,WAAO;AAAA;AAAA;AAAA;AAAA;AAAA,6BAKc,KAAK,KAAK;AAAA;AAAA;AAAA;AAAA,EAInC;AAAA,EAEU,gBAAgB,MAAsC;AAC5D,UAAM,iBAAiB;AAAA,cACjB,KAAK,aAAa,IAAI,IAAI,IAAI,KAAK,aAAa;AAAA;AAItD,QAAI,KAAK,SAAS,SAAS;AACvB,WAAK,kBAAkB,IAAI,SAAS;AACpC,aAAO,0CAA0C;AACjD,aAAO;AAAA;AAAA;AAAA;AAAA,4BAIS,SAAS,KAAK,eAAe,CAAC;AAAA;AAAA,sBAEpC,cAAc;AAAA;AAAA;AAAA,IAG5B;AACA,SAAK,kBAAkB,IAAI,YAAY;AACvC,WAAO,gDAAgD;AACvD,WAAO;AAAA;AAAA;AAAA;AAAA,wBAIS,SAAS,KAAK,eAAe,CAAC;AAAA,4BAC1B,KAAK,SAAS;AAAA;AAAA,kBAExB,cAAc;AAAA;AAAA;AAAA,EAG5B;AAAA,EAIQ,WAAiB;AACrB,SAAK;AAAA,MACD,IAAI,MAAM,UAAU;AAAA,QAChB,YAAY;AAAA,QACZ,UAAU;AAAA,MACd,CAAC;AAAA,IACL;AAAA,EACJ;AAAA,EAEA,IAAc,aAA6B;AACvC,UAAM,OAAO;AAAA;AAAA;AAAA,0BAGK,KAAK,YAAY;AAAA;AAAA,2BAEhB;AAAA,MACP,aAAa,KAAK;AAAA,MAClB,SAAS;AAAA,IACb,CAAC;AAAA,0BACS,KAAK,QAAQ;AAAA,uBAChB,KAAK,QAAQ;AAAA,2BACT,KAAK,OAAO;AAAA,4BACX,KAAK,QAAQ,CAAC,KAAK,KAAK,IAAI,CAAC,CAAC;AAAA,uBACnC,KAAK,IAAI;AAAA,iDACiB,KAAK,qBAAqB;AAAA;AAAA,oCAEvC,KAAK,6BAA6B;AAAA;AAAA;AAG9D,SAAK,qBACD,KAAK,sBACL,KAAK,WACL,KAAK,QACL,CAAC,CAAC,KAAK;AACX,QAAI,KAAK,oBAAoB;AACzB,UAAI,KAAK,kBAAkB,QAAQ;AAC/B,aAAK,kBAAkB,IAAI,YAAY;AAAA,MAC3C;AACA,aAAO,KAAK,cAAc,IAAI;AAAA,IAClC;AACA,WAAO;AAAA,EACX;AAAA,EAIU,8BAA8B,OAAqB;AACzD,QACI,CAAC,KAAK,wBACL,CAAC,SACI,MAAM,OAAuB,YAAY,EACtC,SAAS,OACpB;AACE,WAAK,sBAAsB;AAC3B,4BAAsB,MAAM;AACxB,8BAAsB,MAAM;AACxB,eAAK,gBAAgB;AAAA,QACzB,CAAC;AAAA,MACL,CAAC;AAAA,IACL;AAAA,EACJ;AAAA,EAEU,wBAA8B;AACpC,QAAI,KAAK,qBAAqB;AAC1B;AAAA,IACJ;AACA,SAAK,sBAAsB;AAC3B,SAAK,gBAAgB;AAAA,EACzB;AAAA,EAEA,MAAgB,kBAAiC;AAC7C,QAAI,KAAK,WAAW,KAAM;AAE1B,SAAK,mBAAmB,IAAI;AAAA,MACxB,CAAC,QAAS,KAAK,oBAAoB;AAAA,IACvC;AACA,QAAI;AACJ,UAAM,KAAK,YAAY;AACvB,QAAI,KAAK,mBAAmB;AAGxB,YAAM,IAAI,QAAQ,CAAC,QAAQ,sBAAsB,MAAM,IAAI,IAAI,CAAC,CAAC;AACjE,WAAK,oBAAoB;AAAA,IAC7B;AACA,SAAK,UAAU,QAAQ,CAAC,SAAS;AAC7B,UAAI,KAAK,UAAU,KAAK,SAAS,CAAC,KAAK,UAAU;AAC7C,uBAAe;AAAA,MACnB,OAAO;AACH,aAAK,WAAW;AAAA,MACpB;AAAA,IACJ,CAAC;AACD,QAAI,cAAc;AACd,mBAAa,WAAW,CAAC,CAAC,KAAK;AAC/B,WAAK,eAAe;AAAA,IACxB,OAAO;AACH,WAAK,QAAQ;AACb,WAAK,eAAe;AAAA,IACxB;AACA,QAAI,KAAK,MAAM;AACX,YAAM,KAAK,YAAY;AACvB,WAAK,YAAY,wBAAwB;AAAA,IAC7C;AACA,SAAK,kBAAkB;AACvB,SAAK,sBAAsB;AAAA,EAC/B;AAAA,EAKA,MAAyB,oBAAsC;AAC3D,UAAM,WAAY,MAAM,MAAM,kBAAkB;AAChD,UAAM,KAAK;AAIX,WAAO;AAAA,EACX;AAAA,EA4BO,aAAmB;AAzxB9B;AA0xBQ,eAAK,aAAL,mBAAe;AACf,QAAI,KAAK,SAAS,SAAS;AACvB,WAAK,WAAW,IAAI,WAAW,QAAQ,EAAE,KAAK,QAAQ,IAAI;AAAA,IAC9D,OAAO;AACH,WAAK,WAAW,IAAI,WAAW,SAAS,EAAE,KAAK,QAAQ,IAAI;AAAA,IAC/D;AAAA,EACJ;AAAA,EAEgB,oBAA0B;AACtC,UAAM,kBAAkB;AACxB,SAAK,oBAAoB,KAAK;AAAA,EAClC;AAAA,EAEgB,uBAA6B;AAvyBjD;AAwyBQ,SAAK,MAAM;AACX,eAAK,aAAL,mBAAe;AACf,UAAM,qBAAqB;AAAA,EAC/B;AACJ;AA/tBI;AAAA,EADC,MAAM;AAAA,GALE,WAMT;AAGO;AAAA,EADN,MAAM,SAAS;AAAA,GARP,WASF;AAOS;AAAA,EADf,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAfjC,WAgBO;AAGT;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAlBjC,WAmBF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GArBhC,WAsBF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAxBjC,WAyBF;AAIA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GA5BjC,WA6BF;AAIA;AAAA,EADN,SAAS,EAAE,MAAM,QAAQ,WAAW,gBAAgB,CAAC;AAAA,GAhC7C,WAiCF;AAGA;AAAA,EADN,SAAS;AAAA,GAnCD,WAoCF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAtCjC,WAuCF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAzCjC,WA0CF;AAKA;AAAA,EADN,MAAM;AAAA,GA9CE,WA+CF;AAOA;AAAA,EADN,MAAM,SAAS;AAAA,GArDP,WAsDF;AASA;AAAA,EADN,MAAM,YAAY;AAAA,GA9DV,WA+DF;AAUA;AAAA,EADN,SAAS;AAAA,GAxED,WAyEF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GA3EjC,WA4EF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GA9EjB,WA+EF;AAGI;AAAA,EADV,SAAS,EAAE,WAAW,MAAM,CAAC;AAAA,GAjFrB,WAkFE;AAuMG;AAAA,EADb,MAAM;AAAA,GAxRE,WAyRK;AAydX,aAAM,eAAe,WAAW;AAAA,EAAhC;AAAA;AAaH,SAAmB,gBAAgB,CAAC,UAA+B;AAC/D,YAAM,EAAE,KAAK,IAAI;AACjB,WAAK,UAAU;AACf,UAAI,CAAC,KAAK,WAAW,OAAO,KAAK,KAAK,YAAY,KAAK,SAAS;AAC5D;AAAA,MACJ;AACA,UAAI,SAAS,aAAa,SAAS,aAAa;AAC5C,aAAK,OAAO,IAAI;AAChB,cAAM,eAAe;AACrB;AAAA,MACJ;AACA,YAAM,eAAe;AACrB,YAAM,gBAAgB,KAAK,eACrB,KAAK,UAAU,QAAQ,KAAK,YAAY,IACxC;AAEN,YAAM,aAAa,gBAAgB,KAAK,SAAS,eAAe,IAAI;AACpE,UAAI,YAAY,gBAAgB;AAChC,aACI,KAAK,UAAU,SAAS,KACxB,KAAK,UAAU,SAAS,EAAE,UAC5B;AACE,qBAAa;AAAA,MACjB;AACA,UAAI,CAAC,KAAK,UAAU,SAAS,KAAK,KAAK,UAAU,SAAS,EAAE,UAAU;AAClE;AAAA,MACJ;AACA,UAAI,CAAC,KAAK,SAAS,cAAc,eAAe;AAC5C,aAAK,iBAAiB,KAAK,UAAU,SAAS,CAAC;AAAA,MACnD;AAAA,IACJ;AAAA;AAAA,EA1CA,WAA2B,SAAyB;AAChD,WAAO,CAAC,cAAc,eAAe,oBAAoB;AAAA,EAC7D;AAAA,EAEA,IAAuB,kBAA6B;AAChD,UAAM,SAAS,MAAM;AACrB,QAAI,CAAC,KAAK,OAAO;AACb,aAAO,WAAW,IAAI,GAAG,KAAK,WAAW;AAAA,IAC7C;AACA,WAAO;AAAA,EACX;AAiCJ;",
4
+ "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"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/src/Picker.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["Picker.ts"],
4
- "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"],
4
+ "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"],
5
5
  "mappings": "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",
6
6
  "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"]
7
7
  }
package/test/index.js CHANGED
@@ -55,7 +55,7 @@ export function runPickerTests() {
55
55
  let el;
56
56
  const pickerFixture = async () => {
57
57
  const test = await fixture(html`
58
- <sp-theme scale="medium" color="light">
58
+ <sp-theme scale="medium" color="light" system="spectrum">
59
59
  <sp-field-label for="picker">Where do you live?</sp-field-label>
60
60
  <sp-picker
61
61
  id="picker"
package/test/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["index.ts"],
4
- "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 type { Picker } from '@spectrum-web-components/picker';\n\nimport type { MenuItem } from '@spectrum-web-components/menu';\nimport {\n aTimeout,\n elementUpdated,\n expect,\n fixture,\n html,\n nextFrame,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\nimport '@spectrum-web-components/shared/src/focus-visible.js';\nimport { spy, stub } from 'sinon';\nimport {\n arrowDownEvent,\n arrowRightEvent,\n arrowUpEvent,\n testForLitDevWarnings,\n tEvent,\n} from '../../../test/testing-helpers.js';\nimport {\n a11ySnapshot,\n findAccessibilityNode,\n sendKeys,\n setViewport,\n} from '@web/test-runner-commands';\nimport {\n Default,\n disabled,\n iconsOnly,\n noVisibleLabel,\n slottedLabel,\n tooltip,\n} from '../stories/picker.stories.js';\nimport { M as pending } from '../stories/picker-pending.stories.js';\nimport { sendMouse } from '../../../test/plugins/browser.js';\nimport {\n ignoreResizeObserverLoopError,\n fixture as styledFixture,\n} from '../../../test/testing-helpers.js';\nimport '@spectrum-web-components/picker/sp-picker.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-group.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/theme/src/themes.js';\nimport type { Menu } from '@spectrum-web-components/menu';\nimport { Tooltip } from '@spectrum-web-components/tooltip';\nimport { FieldLabel } from '@spectrum-web-components/field-label/src/FieldLabel.js';\nimport { isWebKit } from '@spectrum-web-components/shared';\nimport { SAFARI_FOCUS_RING_CLASS } from '@spectrum-web-components/picker/src/MobileController.js';\n\nexport type TestablePicker = { optionsMenu: Menu };\n\nignoreResizeObserverLoopError(before, after);\n\nconst isMenuActiveElement = function (el: Picker): boolean {\n return el.shadowRoot.activeElement?.localName === 'sp-menu';\n};\n\nexport function runPickerTests(): void {\n let el: Picker;\n const pickerFixture = async (): Promise<Picker> => {\n const test = await fixture<HTMLDivElement>(html`\n <sp-theme scale=\"medium\" color=\"light\">\n <sp-field-label for=\"picker\">Where do you live?</sp-field-label>\n <sp-picker\n id=\"picker\"\n style=\"width: 200px; --spectrum-alias-ui-icon-chevron-size-100: 10px;\"\n >\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-picker>\n </sp-theme>\n `);\n\n return test.querySelector('sp-picker') as Picker;\n };\n describe('accessibility model', () => {\n it('accessible with \"<sp-field-label>\"', async function () {\n const test = await fixture<HTMLDivElement>(html`\n <div>\n ${Default({\n onChange: () => {\n return;\n },\n })}\n </div>\n `);\n const el = test.querySelector('sp-picker') as Picker;\n\n type NamedNode = { name: string };\n let snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) =>\n node.name ===\n 'Select a Country with a very long label, too long, in fact Where do you live?'\n ),\n '`name` is the label text'\n ).to.not.be.null;\n\n el.value = 'option-2';\n await elementUpdated(el);\n // Allow the snapshot to settle.\n await nextFrame();\n await nextFrame();\n snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Select Inverse Where do you live?'\n ),\n '`name` is the the selected item text plus the label text'\n ).to.not.be.null;\n });\n it('accessible with \"label\" attribute', async () => {\n const test = await fixture<HTMLDivElement>(html`\n <div>\n ${noVisibleLabel({\n onChange: () => {\n return;\n },\n })}\n </div>\n `);\n const el = test.querySelector('sp-picker') as Picker;\n\n type NamedNode = { name: string };\n let snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Where do you live?'\n ),\n '`name` is the label text'\n ).to.not.be.null;\n\n el.value = 'option-2';\n await elementUpdated(el);\n // Allow the snapshot to settle.\n await nextFrame();\n await nextFrame();\n snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Select Inverse Where do you live?'\n ),\n '`name` is the the selected item text plus the label text'\n ).to.not.be.null;\n });\n it('accessible with \"label\" slot', async function () {\n const test = await fixture<HTMLDivElement>(html`\n <div>\n ${slottedLabel({\n onChange: () => {\n return;\n },\n })}\n </div>\n `);\n const el = test.querySelector('sp-picker') as Picker;\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n\n type NamedNode = { name: string; description: string };\n let snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n let name = 'Where do you live?';\n\n let node = findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === name\n );\n\n expect(\n node,\n `node not available: ${JSON.stringify(snapshot, null, ' ')}`\n ).to.not.be.null;\n\n el.value = 'option-2';\n await elementUpdated(el);\n // Allow the snapshot to settle.\n await nextFrame();\n await nextFrame();\n snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n name = 'Select Inverse Where do you live?';\n\n node = findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === name\n );\n\n expect(\n node,\n `node not available: ${JSON.stringify(snapshot, null, ' ')}`\n ).to.not.be.null;\n });\n });\n describe('standard', () => {\n beforeEach(async () => {\n el = await pickerFixture();\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n });\n it('loads accessibly', async () => {\n await expect(el).to.be.accessible();\n });\n it('closes accessibly', async () => {\n el.focus();\n await elementUpdated(el);\n expect(el.shadowRoot.activeElement).to.equal(el.button);\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n\n expect(el.open).to.be.true;\n const accessibleCloseButton = el.shadowRoot.querySelector(\n '.visually-hidden button'\n ) as HTMLButtonElement;\n expect(accessibleCloseButton).to.have.attribute(\n 'aria-label',\n 'Dismiss'\n );\n\n const closed = oneEvent(el, 'sp-closed');\n accessibleCloseButton.click();\n await closed;\n\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n expect(el.shadowRoot.activeElement).to.equal(el.button);\n expect(document.activeElement).to.eq(el);\n });\n it('accepts new selected item content', async () => {\n await nextFrame();\n await nextFrame();\n const option2 = el.querySelector('[value=\"option-2\"') as MenuItem;\n el.value = 'option-2';\n await elementUpdated(option2);\n await elementUpdated(el);\n await aTimeout(150);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(\n 'Select Inverse'\n );\n let itemUpdated = oneEvent(el, 'sp-menu-item-added-or-updated');\n const newLabel1 = 'Invert Selection';\n option2.innerHTML = newLabel1;\n await itemUpdated;\n await elementUpdated(el);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(newLabel1);\n itemUpdated = oneEvent(el, 'sp-menu-item-added-or-updated');\n const newLabel2 = 'Other option';\n option2.childNodes[0].textContent = newLabel2;\n await itemUpdated;\n await elementUpdated(el);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(newLabel2);\n });\n it('accepts new selected item content when open', async () => {\n await nextFrame();\n const option2 = el.querySelector('[value=\"option-2\"') as MenuItem;\n el.value = 'option-2';\n await elementUpdated(el);\n await aTimeout(150);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(\n 'Select Inverse'\n );\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n const itemUpdated = oneEvent(\n option2,\n 'sp-menu-item-added-or-updated'\n );\n option2.innerHTML = 'Invert Selection';\n await itemUpdated;\n await elementUpdated(el);\n await aTimeout(150);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(\n 'Invert Selection'\n );\n });\n it('unsets value when children removed', async () => {\n await nextFrame();\n el.value = 'option-2';\n\n await elementUpdated(el);\n await aTimeout(150);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(\n 'Select Inverse'\n );\n\n const items = el.querySelectorAll('sp-menu-item');\n items.forEach((item) => {\n item.remove();\n });\n await elementUpdated(el);\n await nextFrame();\n await aTimeout(150);\n expect(\n (el as unknown as TestablePicker).optionsMenu.childItems.length\n ).to.equal(0);\n if ('showPopover' in document.createElement('div')) {\n return;\n }\n expect(el.value).to.equal('');\n expect((el.button.textContent || '').trim()).to.not.include(\n 'Select Inverse'\n );\n });\n it('accepts a new item and value at the same time', async () => {\n el.value = 'option-2';\n\n await elementUpdated(el);\n expect(el.value).to.equal('option-2');\n\n const item = document.createElement('sp-menu-item');\n item.value = 'option-new';\n item.textContent = 'New Option';\n\n el.append(item);\n await elementUpdated(el);\n\n el.value = 'option-new';\n\n await elementUpdated(el);\n expect(el.value).to.equal('option-new');\n });\n it('accepts a new item that can be selected', async () => {\n el.value = 'option-2';\n\n await elementUpdated(el);\n expect(el.value).to.equal('option-2');\n const item = document.createElement('sp-menu-item');\n item.value = 'option-new';\n item.textContent = 'New Option';\n\n el.append(item);\n await nextFrame();\n await elementUpdated(el);\n\n let opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n // Overlaid content is outside of the context of the Picker element\n // and cannot be managed via its updateComplete cycle.\n await nextFrame();\n\n const close = oneEvent(el, 'sp-closed');\n item.click();\n await close;\n // Overlaid content is outside of the context of the Picker element\n // and cannot be managed via its updateComplete cycle.\n await nextFrame();\n\n expect(el.value, 'first time').to.equal('option-new');\n\n opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n // Overlaid content is outside of the context of the Picker element\n // and cannot be managed via its updateComplete cycle.\n await nextFrame();\n\n expect(el.value, 'second time').to.equal('option-new');\n });\n it('manages its \"name\" value in the accessibility tree', async () => {\n await nextFrame();\n type NamedNode = { name: string };\n let snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Where do you live?'\n ),\n '`name` is the label text'\n ).to.not.be.null;\n\n el.value = 'option-2';\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Select Inverse Where do you live?'\n ),\n '`name` is the selected item text plus the label text'\n ).to.not.be.null;\n });\n it('manages `aria-activedescendant`', async () => {\n const firstItem = el.querySelector('sp-menu-item:nth-child(1)');\n const secondItem = el.querySelector('sp-menu-item:nth-child(2)');\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n expect(\n (el as unknown as TestablePicker).optionsMenu.getAttribute(\n 'aria-activedescendant'\n )\n ).to.equal(firstItem?.id);\n await sendKeys({ press: 'ArrowDown' });\n await elementUpdated(el);\n expect(\n (el as unknown as TestablePicker).optionsMenu.getAttribute(\n 'aria-activedescendant'\n )\n ).to.equal(secondItem?.id);\n });\n it('renders invalid accessibly', async () => {\n el.invalid = true;\n await elementUpdated(el);\n\n expect(el.invalid).to.be.true;\n await expect(el).to.be.accessible();\n });\n it('renders selection accessibly', async () => {\n el.value = 'option-2';\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('opens with visible focus on a menu item on `DownArrow`', async () => {\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n\n await elementUpdated(el);\n\n expect(firstItem.focused, 'should not visually focused').to.be\n .false;\n\n el.focus();\n await elementUpdated(el);\n const opened = oneEvent(el, 'sp-opened');\n await sendKeys({ press: 'ArrowRight' });\n await sendKeys({ press: 'ArrowLeft' });\n await sendKeys({ press: 'ArrowDown' });\n await opened;\n\n expect(el.open).to.be.true;\n expect(firstItem.focused, 'should be visually focused').to.be.true;\n\n const closed = oneEvent(el, 'sp-closed');\n await sendKeys({\n press: 'Escape',\n });\n await closed;\n\n expect(el.open).to.be.false;\n expect(\n document.activeElement === el,\n `focused ${document.activeElement?.localName} instead of back on Picker`\n ).to.be.true;\n expect(\n el.shadowRoot.activeElement === el.button,\n `focused ${el.shadowRoot.activeElement?.localName} instead of back on button`\n ).to.be.true;\n await waitUntil(\n () => !firstItem.focused,\n 'finally, not visually focused'\n );\n });\n it('opens with visible focus on a menu item on `Space`', async function () {\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n\n await elementUpdated(el);\n\n expect(firstItem.focused, 'should not visually focused').to.be\n .false;\n\n el.focus();\n await elementUpdated(el);\n const opened = oneEvent(el, 'sp-opened');\n await sendKeys({ press: 'ArrowRight' });\n await sendKeys({ press: 'ArrowLeft' });\n await sendKeys({ press: 'Space' });\n await opened;\n\n expect(el.open).to.be.true;\n expect(firstItem.focused, 'should be visually focused').to.be.true;\n\n const closed = oneEvent(el, 'sp-closed');\n await sendKeys({\n press: 'Escape',\n });\n await closed;\n\n expect(el.open).to.be.false;\n expect(\n document.activeElement === el,\n `focused ${document.activeElement?.localName} instead of back on Picker`\n ).to.be.true;\n expect(\n el.shadowRoot.activeElement === el.button,\n `focused ${el.shadowRoot.activeElement?.localName} instead of back on button`\n ).to.be.true;\n await waitUntil(\n () => !firstItem.focused,\n 'finally, not visually focused'\n );\n });\n it('opens, on click, without visible focus on a menu item', async () => {\n await nextFrame();\n await nextFrame();\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n const boundingRect = el.button.getBoundingClientRect();\n\n expect(firstItem.focused, 'not visually focused').to.be.false;\n const opened = oneEvent(el, 'sp-opened');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n await opened;\n\n expect(el.open).to.be.true;\n expect(firstItem.focused, 'still not visually focused').to.be.false;\n });\n it('opens and selects in a single pointer button interaction', async () => {\n await nextFrame();\n await nextFrame();\n const thirdItem = el.querySelector(\n 'sp-menu-item:nth-of-type(3)'\n ) as MenuItem;\n const boundingRect = el.button.getBoundingClientRect();\n\n expect(el.value).to.not.equal(thirdItem.value);\n const opened = oneEvent(el, 'sp-opened');\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n {\n type: 'down',\n },\n ],\n });\n await opened;\n\n const thirdItemRect = thirdItem.getBoundingClientRect();\n const closed = oneEvent(el, 'sp-closed');\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n thirdItemRect.x + thirdItemRect.width / 2,\n thirdItemRect.y + thirdItemRect.height / 2,\n ],\n },\n {\n type: 'up',\n },\n ],\n });\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.value).to.equal(thirdItem.value);\n });\n it('opens/closes multiple times', async () => {\n await nextFrame();\n await nextFrame();\n expect(el.open).to.be.false;\n const boundingRect = el.button.getBoundingClientRect();\n let opened = oneEvent(el, 'sp-opened');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n await opened;\n expect(el.open).to.be.true;\n\n let closed = oneEvent(el, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n await closed;\n expect(el.open).to.be.false;\n\n opened = oneEvent(el, 'sp-opened');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n await opened;\n expect(el.open).to.be.true;\n\n closed = oneEvent(el, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n await closed;\n expect(el.open).to.be.false;\n });\n it('closes when becoming disabled', async () => {\n expect(el.open).to.be.false;\n el.click();\n await elementUpdated(el);\n\n expect(el.open).to.be.true;\n el.disabled = true;\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n });\n it('closes when clicking away', async () => {\n el.id = 'closing';\n const other = document.createElement('div');\n document.body.append(other);\n\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n const opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n await elementUpdated(el);\n\n expect(el.open).to.be.true;\n const closed = oneEvent(el, 'sp-closed');\n other.click();\n closed;\n await elementUpdated(el);\n\n other.remove();\n });\n it('selects', async () => {\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n const opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n\n const closed = oneEvent(el, 'sp-closed');\n secondItem.click();\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.selectedItem?.itemText).to.equal('Select Inverse');\n expect(el.value).to.equal('option-2');\n });\n it('re-selects', async () => {\n const firstItem = el.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n let opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n\n let closed = oneEvent(el, 'sp-closed');\n secondItem.click();\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.selectedItem?.itemText).to.equal('Select Inverse');\n expect(el.value).to.equal('option-2');\n\n opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.equal('Select Inverse');\n expect(el.value).to.equal('option-2');\n\n closed = oneEvent(el, 'sp-closed');\n firstItem.click();\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.selectedItem?.itemText).to.equal('Deselect');\n expect(el.value).to.equal('Deselect');\n });\n it('dispatches bubbling and composed events', async () => {\n const changeSpy = spy();\n const parent = el.parentElement as HTMLElement;\n (parent.shadowRoot as ShadowRoot).append(el);\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n parent.addEventListener('change', () => changeSpy());\n\n expect(el.value).to.equal('');\n\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n\n const closed = oneEvent(el, 'sp-closed');\n secondItem.click();\n await closed;\n\n expect(el.value).to.equal(secondItem.value);\n expect(changeSpy.calledOnce).to.be.true;\n });\n it('can have selection prevented', async () => {\n const preventChangeSpy = spy();\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n const opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n expect(secondItem.selected).to.be.false;\n\n el.addEventListener('change', (event: Event): void => {\n event.preventDefault();\n preventChangeSpy();\n });\n\n const changed = oneEvent(el, 'change');\n secondItem.click();\n // The `change` event is dispatched _after_ the `updateComplete` promise.\n await changed;\n expect(\n preventChangeSpy.calledOnce,\n preventChangeSpy.callCount.toString()\n ).to.be.true;\n expect(secondItem.selected, 'selection prevented').to.be.false;\n expect(el.open).to.be.true;\n });\n it('can throw focus after `change`', async () => {\n const input = document.createElement('input');\n document.body.append(input);\n\n await elementUpdated(el);\n\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n const opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n await elementUpdated(el);\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n expect(secondItem.selected).to.be.false;\n\n el.addEventListener('change', (): void => {\n input.focus();\n });\n\n const closed = oneEvent(el, 'sp-closed');\n secondItem.click();\n await closed;\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n expect(el.value, 'value changed').to.equal('option-2');\n expect(secondItem.selected, 'selected changed').to.be.true;\n await waitUntil(\n () => document.activeElement === input,\n 'focus throw'\n );\n input.remove();\n });\n it('opens on ArrowUp', async () => {\n const button = el.button as HTMLButtonElement;\n\n el.focus();\n await elementUpdated(el);\n\n expect(el.open, 'inially closed').to.be.false;\n\n button.dispatchEvent(tEvent());\n await elementUpdated(el);\n\n expect(el.open, 'still closed').to.be.false;\n\n const opened = oneEvent(el, 'sp-opened');\n button.dispatchEvent(arrowUpEvent());\n await elementUpdated(el);\n\n expect(el.open, 'open by ArrowUp').to.be.true;\n await opened;\n\n const closed = oneEvent(el, 'sp-closed');\n sendKeys({\n press: 'Escape',\n });\n await closed;\n expect(el.open).to.be.false;\n });\n it('opens on ArrowDown', async () => {\n const firstItem = el.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const button = el.button as HTMLButtonElement;\n\n el.focus();\n await elementUpdated(el);\n\n expect(el.open, 'inially closed').to.be.false;\n\n const opened = oneEvent(el, 'sp-opened');\n button.dispatchEvent(arrowDownEvent());\n await opened;\n\n expect(el.open, 'open by ArrowDown').to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n\n const closed = oneEvent(el, 'sp-closed');\n firstItem.click();\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.selectedItem?.itemText).to.equal('Deselect');\n expect(el.value).to.equal('Deselect');\n });\n it('quick selects on ArrowLeft/Right', async () => {\n const selectionSpy = spy();\n el.addEventListener('change', (event: Event) => {\n const { value } = event.target as Picker;\n selectionSpy(value);\n });\n\n el.focus();\n await elementUpdated(el);\n await waitUntil(\n () =>\n (el as unknown as { menuItems: MenuItem[] }).menuItems\n .length === 6\n );\n\n await sendKeys({\n press: 'ArrowLeft',\n });\n await elementUpdated(el);\n\n expect(selectionSpy.callCount).to.equal(1);\n expect(selectionSpy.calledWith('Deselected'));\n await sendKeys({\n press: 'ArrowLeft',\n });\n\n await elementUpdated(el);\n expect(selectionSpy.callCount).to.equal(1);\n await sendKeys({\n press: 'ArrowRight',\n });\n\n await nextFrame();\n await nextFrame();\n expect(selectionSpy.calledWith('option-2'));\n\n await sendKeys({\n press: 'ArrowRight',\n });\n await nextFrame();\n await nextFrame();\n await sendKeys({\n press: 'ArrowRight',\n });\n await nextFrame();\n await nextFrame();\n await sendKeys({\n press: 'ArrowRight',\n });\n await nextFrame();\n await nextFrame();\n await sendKeys({\n press: 'ArrowRight',\n });\n await nextFrame();\n await nextFrame();\n expect(selectionSpy.calledWith('Save Selection'));\n expect(selectionSpy.calledWith('Make Work Path')).to.be.false;\n expect(selectionSpy.callCount).to.equal(5);\n });\n it('quick selects first item on ArrowRight when no value', async () => {\n await nextFrame();\n const selectionSpy = spy();\n el.addEventListener('change', (event: Event) => {\n const { value } = event.target as Picker;\n selectionSpy(value);\n });\n const button = el.button as HTMLButtonElement;\n\n el.focus();\n button.dispatchEvent(arrowRightEvent());\n\n await elementUpdated(el);\n\n expect(selectionSpy.callCount).to.equal(1);\n expect(selectionSpy.calledWith('Deselected'));\n });\n it('loads', async () => {\n expect(el).to.not.be.undefined;\n });\n it('closes when focusing away from the menu', async () => {\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n const thirdItem = el.querySelector(\n 'sp-menu-item:nth-of-type(3)'\n ) as MenuItem;\n const button = el.button;\n const input = document.createElement('input');\n el.insertAdjacentElement('afterend', input);\n\n el.focus();\n await sendKeys({ press: 'Tab' });\n expect(document.activeElement === input).to.be.true;\n await sendKeys({ press: 'Shift+Tab' });\n expect(document.activeElement === el).to.be.true;\n const opened = oneEvent(el, 'sp-opened');\n sendKeys({ press: 'Enter' });\n await opened;\n await elementUpdated(el);\n\n await waitUntil(\n () => firstItem.focused,\n 'The first items should have become focused visually.'\n );\n\n await sendKeys({ press: 'ArrowDown' });\n await sendKeys({ press: 'ArrowDown' });\n expect(thirdItem.focused).to.be.true;\n\n const closed = oneEvent(el, 'sp-closed');\n button.focus();\n await closed;\n expect(isMenuActiveElement(el)).to.be.false;\n expect(el.open).to.be.false;\n });\n it('does not listen to streaming `Enter` keydown', async () => {\n const openSpy = spy();\n const closedSpy = spy();\n el.addEventListener('sp-opened', () => openSpy());\n el.addEventListener('sp-closed', () => closedSpy());\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n const thirdItem = el.querySelector(\n 'sp-menu-item:nth-of-type(3)'\n ) as MenuItem;\n const input = document.createElement('input');\n el.insertAdjacentElement('afterend', input);\n\n el.focus();\n await sendKeys({ press: 'Tab' });\n expect(document.activeElement === input).to.be.true;\n await sendKeys({ press: 'Shift+Tab' });\n expect(document.activeElement === el).to.be.true;\n const opened = oneEvent(el, 'sp-opened');\n sendKeys({ down: 'Enter' });\n await opened;\n await aTimeout(300);\n expect(openSpy.callCount).to.equal(1);\n await sendKeys({ up: 'Enter' });\n\n await waitUntil(\n () => firstItem.focused,\n 'The first items should have become focused visually.'\n );\n\n await sendKeys({ press: 'ArrowDown' });\n await sendKeys({ press: 'ArrowDown' });\n expect(thirdItem.focused).to.be.true;\n\n const closed = oneEvent(el, 'sp-closed');\n sendKeys({ down: 'Enter' });\n await closed;\n await aTimeout(300);\n\n expect(el.value).to.equal(thirdItem.value);\n expect(openSpy.callCount).to.equal(1);\n expect(closedSpy.callCount).to.equal(1);\n await sendKeys({ up: 'Enter' });\n });\n it('allows tabing to close', async () => {\n const input = document.createElement('input');\n el.insertAdjacentElement('afterend', input);\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n await nextFrame();\n\n expect(el.open).to.be.true;\n el.focus();\n\n const closed = oneEvent(el, 'sp-closed');\n sendKeys({ press: 'Tab' });\n await closed;\n\n expect(el.open, 'closes').to.be.false;\n });\n describe('tab order', () => {\n let input1: HTMLInputElement;\n let input2: HTMLInputElement;\n beforeEach(() => {\n const surroundingInput = (): HTMLInputElement => {\n const input = document.createElement('input');\n input.type = 'text';\n input.tabIndex = 0;\n return input;\n };\n input1 = surroundingInput();\n input2 = surroundingInput();\n\n el.insertAdjacentElement('beforebegin', input1);\n el.insertAdjacentElement('afterend', input2);\n });\n afterEach(() => {\n input1.remove();\n input2.remove();\n });\n it('tabs forward through the element', async () => {\n // start at input1\n input1.focus();\n await nextFrame();\n expect(document.activeElement === input1, 'focuses input 1').to\n .true;\n // tab to the picker\n let focused = oneEvent(el, 'focus');\n await sendKeys({ press: 'Tab' });\n await focused;\n\n expect(el.focused, 'focused').to.be.true;\n expect(el.open, 'closed').to.be.false;\n expect(document.activeElement === el, 'focuses el').to.be.true;\n // tab through the picker to input2\n focused = oneEvent(input2, 'focus');\n await sendKeys({ press: 'Tab' });\n await focused;\n expect(document.activeElement === input2, 'focuses input 2').to\n .true;\n });\n it('shift+tabs backwards through the element', async () => {\n // start at input1\n input2.focus();\n await nextFrame();\n expect(document.activeElement, 'focuses input 2').to.equal(\n input2\n );\n // tab to the picker\n let focused = oneEvent(el, 'focus');\n await sendKeys({ press: 'Shift+Tab' });\n await focused;\n\n expect(el.focused, 'focused').to.be.true;\n expect(el.open, 'closed').to.be.false;\n expect(document.activeElement, 'focuses el').to.equal(el);\n // tab through the picker to input2\n focused = oneEvent(input1, 'focus');\n await sendKeys({ press: 'Shift+Tab' });\n await focused;\n expect(document.activeElement, 'focuses input 1').to.equal(\n input1\n );\n });\n it('can close and immediately tab to the next tab stop', async () => {\n el.focus();\n await nextFrame();\n expect(document.activeElement, 'focuses el').to.equal(el);\n // press down to open the picker\n const opened = oneEvent(el, 'sp-opened');\n await sendKeys({ press: 'ArrowUp' });\n await opened;\n\n expect(el.open, 'opened').to.be.true;\n await waitUntil(\n () => isMenuActiveElement(el),\n 'first item focused'\n );\n\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n\n expect(el.open).to.be.false;\n expect(document.activeElement === el).to.be.true;\n\n const focused = oneEvent(input2, 'focus');\n await sendKeys({ press: 'Tab' });\n await focused;\n\n expect(el.open).to.be.false;\n expect(document.activeElement === input2).to.be.true;\n });\n it('can close and immediate shift+tab to the previous tab stop', async () => {\n el.focus();\n await nextFrame();\n expect(document.activeElement === el, 'focuses el').to.be.true;\n // press down to open the picker\n const opened = oneEvent(el, 'sp-opened');\n await sendKeys({ press: 'ArrowUp' });\n await opened;\n\n expect(el.open, 'opened').to.be.true;\n await waitUntil(\n () => isMenuActiveElement(el),\n 'first item focused'\n );\n\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n\n expect(el.open).to.be.false;\n expect(document.activeElement === el).to.be.true;\n\n const focused = oneEvent(input1, 'focus');\n sendKeys({ press: 'Shift+Tab' });\n await focused;\n\n expect(el.open).to.be.false;\n expect(document.activeElement === input1).to.be.true;\n });\n });\n it('does not open when [readonly]', async () => {\n el.readonly = true;\n\n await elementUpdated(el);\n\n el.click();\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n });\n it('scrolls selected into view on open', async () => {\n // the Popover is transient, you need to be able to apply custom styles to it...\n const styles = document.createElement('style');\n styles.innerText = 'sp-popover { height: 40px; }';\n el.shadowRoot.append(styles);\n\n const firstItem = el.querySelector(\n 'sp-menu-item:first-child'\n ) as MenuItem;\n const lastItem = el.querySelector(\n 'sp-menu-item:last-child'\n ) as MenuItem;\n lastItem.disabled = false;\n el.value = lastItem.value;\n\n await elementUpdated(el);\n\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n await waitUntil(\n () => isMenuActiveElement(el),\n 'first item focused'\n );\n const getParentOffset = (el: HTMLElement): number => {\n const parentScroll = (\n (el as HTMLElement & { assignedSlot: HTMLSlotElement })\n .assignedSlot.parentElement as HTMLElement\n ).scrollTop;\n const parentOffset = el.offsetTop - parentScroll;\n return parentOffset;\n };\n expect(getParentOffset(lastItem)).to.be.lessThan(40);\n expect(getParentOffset(firstItem)).to.be.lessThan(-1);\n\n lastItem.dispatchEvent(\n new FocusEvent('focusin', { bubbles: true })\n );\n await sendKeys({\n press: 'ArrowDown',\n });\n await elementUpdated(el);\n await nextFrame();\n expect(getParentOffset(lastItem)).to.be.greaterThan(40);\n expect(getParentOffset(firstItem)).to.be.greaterThan(-1);\n });\n it('manages focus-ring styles', async () => {\n if (!isWebKit()) {\n return;\n }\n /**\n * This is a hack to set the `isMobile` property to true so that we can test the MobileController\n */\n el.isMobile.matches = true;\n el.bindEvents();\n\n await setViewport({ width: 360, height: 640 });\n // Allow viewport update to propagate.\n await nextFrame();\n\n let opened = oneEvent(el, 'sp-opened');\n\n const boundingRect = el.button.getBoundingClientRect();\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n\n await opened;\n\n const tray = el.shadowRoot.querySelector('sp-tray');\n expect(tray).to.not.be.null;\n\n // Make a selection\n let closed = oneEvent(el, 'sp-closed');\n\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n firstItem.click();\n\n await elementUpdated(el);\n await closed;\n\n // expect the tray to be closed\n expect(el.open).to.be.false;\n\n const button = el.shadowRoot.querySelector(\n '#button'\n ) as HTMLButtonElement;\n expect(button).to.not.be.null;\n\n // we should have SAFARI_FOCUS_RING_CLASS in the classList\n expect(button.classList.contains(SAFARI_FOCUS_RING_CLASS)).to.be\n .true;\n\n // picker should still have focus\n expect(document.activeElement === el).to.be.true;\n\n // click outside (0,0)\n await sendMouse({\n steps: [\n {\n type: 'click',\n position: [0, 0],\n },\n ],\n });\n\n // picker should not have focus\n expect(document.activeElement === el).to.be.false;\n\n // Let's use keyboard to open the tray now\n opened = oneEvent(el, 'sp-opened');\n await sendKeys({\n press: 'Tab',\n });\n await sendKeys({\n press: 'Enter',\n });\n await elementUpdated(el);\n await opened;\n\n // Make a selection again\n closed = oneEvent(el, 'sp-closed');\n firstItem.click();\n await elementUpdated(el);\n await closed;\n\n // expect the tray to be closed\n expect(el.open).to.be.false;\n\n // we should not have SAFARI_FOCUS_RING_CLASS in the classList\n expect(button.classList.contains(SAFARI_FOCUS_RING_CLASS)).to.be\n .false;\n });\n });\n describe('grouped', async () => {\n const groupedFixture = async (): Promise<Picker> => {\n return fixture<Picker>(html`\n <sp-picker\n quiet\n label=\"I would like to use Spectrum Web Components\"\n value=\"0\"\n >\n <sp-menu-group>\n <span slot=\"header\">Timeline</span>\n <sp-menu-item value=\"0\" id=\"should-be-selected\">\n Immediately\n </sp-menu-item>\n <sp-menu-item value=\"1\">\n I'm already using them\n </sp-menu-item>\n <sp-menu-item value=\"2\">Soon</sp-menu-item>\n <sp-menu-item value=\"3\">\n As part of my next project\n </sp-menu-item>\n <sp-menu-item value=\"4\">In the future</sp-menu-item>\n </sp-menu-group>\n </sp-picker>\n `);\n };\n beforeEach(async () => {\n el = await groupedFixture();\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n });\n it('selects the item with a matching value in a group', async () => {\n const item = el.querySelector('#should-be-selected') as MenuItem;\n expect(item.selected).to.be.true;\n });\n });\n describe('slotted label', () => {\n const pickerFixture = async (): Promise<Picker> => {\n const test = await fixture<Picker>(html`\n <div>\n <sp-field-label for=\"picker-slotted\">\n Where do you live?\n </sp-field-label>\n <sp-picker id=\"picker-slotted\">\n <span slot=\"label\">\n Select a Country with a very long label, too long in\n fact\n </span>\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">\n Select Inverse\n </sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-picker>\n </div>\n `);\n\n return test.querySelector('sp-picker') as Picker;\n };\n beforeEach(async () => {\n el = await pickerFixture();\n await elementUpdated(el);\n await nextFrame();\n });\n afterEach(async () => {\n if (el.open) {\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n }\n });\n\n it('loads accessibly w/ slotted label', async () => {\n await expect(el).to.be.accessible();\n });\n });\n describe('Dev mode', () => {\n let consoleWarnStub!: ReturnType<typeof stub>;\n before(() => {\n window.__swc.verbose = true;\n consoleWarnStub = stub(console, 'warn');\n });\n afterEach(() => {\n consoleWarnStub.resetHistory();\n });\n after(async () => {\n window.__swc.verbose = false;\n consoleWarnStub.restore();\n if (el.open) {\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n }\n });\n\n const pickerFixture = async (): Promise<Picker> => {\n const test = await fixture<Picker>(html`\n <div>\n <sp-field-label for=\"picker-deprecated\">\n Where do you live?\n </sp-field-label>\n <sp-picker\n id=\"picker-deprecated\"\n label=\"Select a Country with a very long label, too long in fact\"\n >\n <sp-menu>\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">\n Select Inverse\n </sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-menu>\n </sp-picker>\n </div>\n `);\n\n return test.querySelector('sp-picker') as Picker;\n };\n it('does not warn in Dev Mode when accessible elements leveraged', async () => {\n const test = await fixture<Picker>(html`\n <div>\n <sp-field-label for=\"test\">Test label</sp-field-label>\n <sp-picker id=\"test\">\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n </sp-picker>\n </div>\n `);\n\n el = test.querySelector('sp-picker') as Picker;\n\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n\n expect(consoleWarnStub.called).to.be.false;\n });\n it('warns in Dev Mode when accessible attributes are not leveraged', async function () {\n this.retries(0);\n el = await fixture<Picker>(html`\n <sp-picker>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n </sp-picker>\n `);\n\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n\n expect(consoleWarnStub.called).to.be.true;\n const spyCall = consoleWarnStub.getCall(0);\n expect(\n (spyCall.args.at(0) as string).includes('accessible'),\n 'confirm accessibility-centric message'\n ).to.be.true;\n expect(spyCall.args.at(-1), 'confirm `data` shape').to.deep.equal({\n data: {\n localName: 'sp-picker',\n type: 'accessibility',\n level: 'default',\n },\n });\n });\n describe('deprecated', () => {\n it('warns in Dev Mode of deprecated `<sp-menu>` usage', async () => {\n el = await pickerFixture();\n await elementUpdated(el);\n\n expect(consoleWarnStub.called).to.be.true;\n const spyCall = consoleWarnStub.getCall(0);\n expect(\n (spyCall.args.at(0) as string).includes('<sp-menu>'),\n 'confirm <sp-menu>-centric message'\n ).to.be.true;\n expect(\n spyCall.args.at(-1),\n 'confirm `data` shape'\n ).to.deep.equal({\n data: {\n localName: 'sp-picker',\n type: 'api',\n level: 'deprecation',\n },\n });\n });\n });\n describe('Dev mode ignored', () => {\n const { ignoreWarningLocalNames } = window.__swc;\n before(() => {\n window.__swc.ignoreWarningLocalNames = {\n 'sp-picker': true,\n };\n });\n before(() => {\n window.__swc.ignoreWarningLocalNames = ignoreWarningLocalNames;\n });\n beforeEach(async () => {\n el = await pickerFixture();\n await elementUpdated(el);\n await nextFrame();\n });\n afterEach(async () => {\n if (el.open) {\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n }\n });\n it('selects with deprecated syntax', async () => {\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n const opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n\n const closed = oneEvent(el, 'sp-closed');\n secondItem.click();\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.selectedItem?.itemText).to.equal('Select Inverse');\n expect(el.value).to.equal('option-2');\n });\n });\n });\n testForLitDevWarnings(async () => await pickerFixture());\n it('manages its \"name\" value in the accessibility tree when [icons-only]', async () => {\n const test = await fixture<HTMLDivElement>(html`\n <div>${iconsOnly({})}</div>\n `);\n const el = test.querySelector('sp-picker') as Picker;\n\n await elementUpdated(el);\n await nextFrame();\n type NamedNode = { name: string };\n let snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Delete Choose an action type...'\n ),\n '`name` is the label text'\n ).to.not.be.null;\n\n el.value = '2';\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n expect(el.value).to.equal('2');\n snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Copy Choose an action type...'\n ),\n '`name` is the label text plus the selected item text'\n ).to.not.be.null;\n });\n it('toggles between pickers', async () => {\n const el2 = await pickerFixture();\n const el1 = await pickerFixture();\n\n (el1.parentElement as HTMLElement).style.float = 'left';\n (el2.parentElement as HTMLElement).style.float = 'left';\n el1.id = 'away';\n el2.id = 'other';\n\n await Promise.all([elementUpdated(el1), elementUpdated(el2)]);\n\n expect(el1.open, 'closed 1').to.be.false;\n expect(el2.open, 'closed 1').to.be.false;\n let open = oneEvent(el1, 'sp-opened');\n el1.click();\n await open;\n expect(el1.open).to.be.true;\n expect(el2.open).to.be.false;\n\n open = oneEvent(el2, 'sp-opened');\n let closed = oneEvent(el1, 'sp-closed');\n el2.click();\n await Promise.all([open, closed]);\n expect(el1.open).to.be.false;\n expect(el2.open).to.be.true;\n\n open = oneEvent(el1, 'sp-opened');\n closed = oneEvent(el2, 'sp-closed');\n el1.click();\n await Promise.all([open, closed]);\n expect(el2.open).to.be.false;\n expect(el1.open).to.be.true;\n\n closed = oneEvent(el1, 'sp-closed');\n sendKeys({\n press: 'Escape',\n });\n await closed;\n expect(el1.open).to.be.false;\n });\n it('displays selected item text by default', async () => {\n const el = await fixture<Picker>(html`\n <sp-picker\n value=\"inverse\"\n label=\"Select a Country with a very long label, too long in fact\"\n >\n <sp-menu-item value=\"deselect\">Deselect Text</sp-menu-item>\n <sp-menu-item value=\"inverse\">Select Inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-picker>\n `);\n await nextFrame();\n\n await elementUpdated(el);\n await waitUntil(\n () => el.selectedItem?.itemText === 'Select Inverse',\n `Selected Item Text: ${el.selectedItem?.itemText}`\n );\n\n const firstItem = el.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n expect(el.value).to.equal('inverse');\n expect(el.selectedItem?.itemText).to.equal('Select Inverse');\n\n el.focus();\n await elementUpdated(el);\n expect(\n el === document.activeElement,\n `activeElement is ${document.activeElement?.localName}`\n ).to.be.true;\n\n const opened = oneEvent(el, 'sp-opened');\n sendKeys({ press: 'Enter' });\n await opened;\n\n expect(\n el === document.activeElement,\n `activeElement is ${document.activeElement?.localName}`\n ).to.be.true;\n expect(\n (el as unknown as TestablePicker).optionsMenu ===\n el.shadowRoot.activeElement,\n `activeElement is ${el.shadowRoot.activeElement?.localName}`\n ).to.be.true;\n\n expect(firstItem.focused, 'firstItem NOT \"focused\"').to.be.false;\n expect(secondItem.focused, 'secondItem \"focused\"').to.be.true;\n expect(\n (el as unknown as TestablePicker).optionsMenu.getAttribute(\n 'aria-activedescendant'\n )\n ).to.equal(secondItem.id);\n });\n it('resets value when item not available', async () => {\n const el = await fixture<Picker>(html`\n <sp-picker\n value=\"missing\"\n label=\"Select a Country with a very long label, too long in fact\"\n >\n <sp-menu-item value=\"deselect\">Deselect Text</sp-menu-item>\n <sp-menu-item value=\"inverse\">Select Inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-picker>\n `);\n\n await elementUpdated(el);\n await waitUntil(() => el.value === '');\n\n expect(el.value).to.equal('');\n expect(el.selectedItem?.itemText).to.be.undefined;\n });\n it('allows event listeners on child items', async () => {\n const mouseenterSpy = spy();\n const handleMouseenter = (): void => mouseenterSpy();\n const el = await fixture<Picker>(html`\n <sp-picker\n label=\"Select a Country with a very long label, too long in fact\"\n >\n <sp-menu-item value=\"deselect\" @mouseenter=${handleMouseenter}>\n Deselect Text\n </sp-menu-item>\n </sp-picker>\n `);\n\n await elementUpdated(el);\n\n const hoverEl = el.querySelector('sp-menu-item') as MenuItem;\n\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n await elementUpdated(el);\n\n expect(el.open).to.be.true;\n hoverEl.dispatchEvent(new MouseEvent('mouseenter'));\n await elementUpdated(el);\n\n expect(el.open).to.be.true;\n\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n expect(mouseenterSpy.calledOnce).to.be.true;\n });\n it('dispatches events on open/close', async () => {\n const openedSpy = spy();\n const closedSpy = spy();\n const handleOpenedSpy = (event: Event): void => openedSpy(event);\n const handleClosedSpy = (event: Event): void => closedSpy(event);\n\n const el = await fixture<Picker>(html`\n <sp-picker\n label=\"Select a Country with a very long label, too long in fact\"\n @sp-opened=${handleOpenedSpy}\n @sp-closed=${handleClosedSpy}\n >\n <sp-menu-item value=\"deselect\">Deselect Text</sp-menu-item>\n </sp-picker>\n `);\n\n await elementUpdated(el);\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n await elementUpdated(el);\n\n expect(openedSpy.calledOnce).to.be.true;\n expect(closedSpy.calledOnce).to.be.false;\n\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n await elementUpdated(el);\n\n expect(closedSpy.calledOnce).to.be.true;\n });\n it('closes tooltip on button blur', async () => {\n const test = await styledFixture(html`\n <div>${tooltip(tooltip.args)}</div>\n `);\n const el = test.querySelector('sp-picker') as Picker;\n await elementUpdated(el);\n const input1 = document.createElement('input');\n const input2 = document.createElement('input');\n const tooltipEl = el.querySelector('sp-tooltip') as Tooltip;\n el.insertAdjacentElement('beforebegin', input1);\n el.insertAdjacentElement('afterend', input2);\n input1.focus();\n expect(document.activeElement === input1).to.be.true;\n const tooltipOpened = oneEvent(el, 'sp-opened');\n await sendKeys({\n press: 'Tab',\n });\n await tooltipOpened;\n expect(\n document.activeElement === el,\n `Actually, ${document.activeElement?.localName}`\n ).to.be.true;\n expect(tooltipEl.open).to.be.true;\n expect(el.open).to.be.false;\n expect(el.focused).to.be.true;\n\n const menuOpen = oneEvent(el, 'sp-opened');\n const tooltipClosed = oneEvent(el, 'sp-closed');\n await sendKeys({\n press: 'ArrowDown',\n });\n await menuOpen;\n await tooltipClosed;\n expect(document.activeElement === el).to.be.true;\n expect(tooltipEl.open).to.be.false;\n expect(el.open).to.be.true;\n\n const menuClosed = oneEvent(el, 'sp-closed');\n await sendKeys({\n press: 'Tab',\n });\n await menuClosed;\n expect(document.activeElement === el).to.be.false;\n expect(tooltipEl.open).to.be.false;\n expect(el.open).to.be.false;\n });\n describe('disabled', function () {\n beforeEach(async function () {\n const test = await fixture(html`\n <div>${disabled(disabled.args)}</div>\n `);\n this.label = test.querySelector('sp-field-label') as FieldLabel;\n this.el = test.querySelector('sp-picker') as Picker;\n await elementUpdated(this.elel);\n });\n it('does not recieve focus from an `<sp-field-label>`', async function () {\n expect(this.el.disabled).to.be.true;\n expect(this.el.focused).to.be.false;\n\n this.label.click();\n await elementUpdated(this.el);\n\n expect(this.el.focused).to.be.false;\n });\n it('does not open from `click()`', async function () {\n expect(this.el.disabled).to.be.true;\n expect(this.el.open).to.be.false;\n\n this.el.click();\n await elementUpdated(this.el);\n\n expect(this.el.open).to.be.false;\n });\n it('does not open from `sendMouse()`', async function () {\n expect(this.el.disabled).to.be.true;\n expect(this.el.open).to.be.false;\n\n const boundingRect = this.el.button.getBoundingClientRect();\n\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n // Synthetic delay for \"open\" but not \"sp-open\" as it would never come.\n await nextFrame();\n await nextFrame();\n await nextFrame();\n await nextFrame();\n\n expect(this.el.open).to.be.false;\n });\n });\n describe('pending', function () {\n beforeEach(async function () {\n const test = await fixture(html`\n <div>${pending({ pending: true })}</div>\n `);\n this.label = test.querySelector('sp-field-label') as FieldLabel;\n this.el = test.querySelector('sp-picker') as Picker;\n await elementUpdated(this.elel);\n });\n it('receives focus from an `<sp-field-label>`', async function () {\n expect(this.el.focused).to.be.false;\n\n this.label.click();\n await elementUpdated(this.el);\n\n expect(this.el.focused).to.be.true;\n });\n it('does not open from `click()`', async function () {\n expect(this.el.open).to.be.false;\n\n this.el.click();\n await elementUpdated(this.el);\n\n expect(this.el.open).to.be.false;\n });\n it('manages its \"name\" value in the accessibility tree when [pending]', async () => {\n type NamedNode = { name: string; role: string };\n const snapshot = (await a11ySnapshot(\n {}\n )) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) =>\n node.name ===\n 'Pending Choose your neighborhood Where do you live?'\n )\n ).to.not.be.null;\n });\n });\n}\n"],
4
+ "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 type { Picker } from '@spectrum-web-components/picker';\n\nimport type { MenuItem } from '@spectrum-web-components/menu';\nimport {\n aTimeout,\n elementUpdated,\n expect,\n fixture,\n html,\n nextFrame,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\nimport '@spectrum-web-components/shared/src/focus-visible.js';\nimport { spy, stub } from 'sinon';\nimport {\n arrowDownEvent,\n arrowRightEvent,\n arrowUpEvent,\n testForLitDevWarnings,\n tEvent,\n} from '../../../test/testing-helpers.js';\nimport {\n a11ySnapshot,\n findAccessibilityNode,\n sendKeys,\n setViewport,\n} from '@web/test-runner-commands';\nimport {\n Default,\n disabled,\n iconsOnly,\n noVisibleLabel,\n slottedLabel,\n tooltip,\n} from '../stories/picker.stories.js';\nimport { M as pending } from '../stories/picker-pending.stories.js';\nimport { sendMouse } from '../../../test/plugins/browser.js';\nimport {\n ignoreResizeObserverLoopError,\n fixture as styledFixture,\n} from '../../../test/testing-helpers.js';\nimport '@spectrum-web-components/picker/sp-picker.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-group.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/theme/src/themes.js';\nimport type { Menu } from '@spectrum-web-components/menu';\nimport { Tooltip } from '@spectrum-web-components/tooltip';\nimport { FieldLabel } from '@spectrum-web-components/field-label/src/FieldLabel.js';\nimport { isWebKit } from '@spectrum-web-components/shared';\nimport { SAFARI_FOCUS_RING_CLASS } from '@spectrum-web-components/picker/src/MobileController.js';\n\nexport type TestablePicker = { optionsMenu: Menu };\n\nignoreResizeObserverLoopError(before, after);\n\nconst isMenuActiveElement = function (el: Picker): boolean {\n return el.shadowRoot.activeElement?.localName === 'sp-menu';\n};\n\nexport function runPickerTests(): void {\n let el: Picker;\n const pickerFixture = async (): Promise<Picker> => {\n const test = await fixture<HTMLDivElement>(html`\n <sp-theme scale=\"medium\" color=\"light\" system=\"spectrum\">\n <sp-field-label for=\"picker\">Where do you live?</sp-field-label>\n <sp-picker\n id=\"picker\"\n style=\"width: 200px; --spectrum-alias-ui-icon-chevron-size-100: 10px;\"\n >\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-picker>\n </sp-theme>\n `);\n\n return test.querySelector('sp-picker') as Picker;\n };\n describe('accessibility model', () => {\n it('accessible with \"<sp-field-label>\"', async function () {\n const test = await fixture<HTMLDivElement>(html`\n <div>\n ${Default({\n onChange: () => {\n return;\n },\n })}\n </div>\n `);\n const el = test.querySelector('sp-picker') as Picker;\n\n type NamedNode = { name: string };\n let snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) =>\n node.name ===\n 'Select a Country with a very long label, too long, in fact Where do you live?'\n ),\n '`name` is the label text'\n ).to.not.be.null;\n\n el.value = 'option-2';\n await elementUpdated(el);\n // Allow the snapshot to settle.\n await nextFrame();\n await nextFrame();\n snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Select Inverse Where do you live?'\n ),\n '`name` is the the selected item text plus the label text'\n ).to.not.be.null;\n });\n it('accessible with \"label\" attribute', async () => {\n const test = await fixture<HTMLDivElement>(html`\n <div>\n ${noVisibleLabel({\n onChange: () => {\n return;\n },\n })}\n </div>\n `);\n const el = test.querySelector('sp-picker') as Picker;\n\n type NamedNode = { name: string };\n let snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Where do you live?'\n ),\n '`name` is the label text'\n ).to.not.be.null;\n\n el.value = 'option-2';\n await elementUpdated(el);\n // Allow the snapshot to settle.\n await nextFrame();\n await nextFrame();\n snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Select Inverse Where do you live?'\n ),\n '`name` is the the selected item text plus the label text'\n ).to.not.be.null;\n });\n it('accessible with \"label\" slot', async function () {\n const test = await fixture<HTMLDivElement>(html`\n <div>\n ${slottedLabel({\n onChange: () => {\n return;\n },\n })}\n </div>\n `);\n const el = test.querySelector('sp-picker') as Picker;\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n\n type NamedNode = { name: string; description: string };\n let snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n let name = 'Where do you live?';\n\n let node = findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === name\n );\n\n expect(\n node,\n `node not available: ${JSON.stringify(snapshot, null, ' ')}`\n ).to.not.be.null;\n\n el.value = 'option-2';\n await elementUpdated(el);\n // Allow the snapshot to settle.\n await nextFrame();\n await nextFrame();\n snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n name = 'Select Inverse Where do you live?';\n\n node = findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === name\n );\n\n expect(\n node,\n `node not available: ${JSON.stringify(snapshot, null, ' ')}`\n ).to.not.be.null;\n });\n });\n describe('standard', () => {\n beforeEach(async () => {\n el = await pickerFixture();\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n });\n it('loads accessibly', async () => {\n await expect(el).to.be.accessible();\n });\n it('closes accessibly', async () => {\n el.focus();\n await elementUpdated(el);\n expect(el.shadowRoot.activeElement).to.equal(el.button);\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n\n expect(el.open).to.be.true;\n const accessibleCloseButton = el.shadowRoot.querySelector(\n '.visually-hidden button'\n ) as HTMLButtonElement;\n expect(accessibleCloseButton).to.have.attribute(\n 'aria-label',\n 'Dismiss'\n );\n\n const closed = oneEvent(el, 'sp-closed');\n accessibleCloseButton.click();\n await closed;\n\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n expect(el.shadowRoot.activeElement).to.equal(el.button);\n expect(document.activeElement).to.eq(el);\n });\n it('accepts new selected item content', async () => {\n await nextFrame();\n await nextFrame();\n const option2 = el.querySelector('[value=\"option-2\"') as MenuItem;\n el.value = 'option-2';\n await elementUpdated(option2);\n await elementUpdated(el);\n await aTimeout(150);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(\n 'Select Inverse'\n );\n let itemUpdated = oneEvent(el, 'sp-menu-item-added-or-updated');\n const newLabel1 = 'Invert Selection';\n option2.innerHTML = newLabel1;\n await itemUpdated;\n await elementUpdated(el);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(newLabel1);\n itemUpdated = oneEvent(el, 'sp-menu-item-added-or-updated');\n const newLabel2 = 'Other option';\n option2.childNodes[0].textContent = newLabel2;\n await itemUpdated;\n await elementUpdated(el);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(newLabel2);\n });\n it('accepts new selected item content when open', async () => {\n await nextFrame();\n const option2 = el.querySelector('[value=\"option-2\"') as MenuItem;\n el.value = 'option-2';\n await elementUpdated(el);\n await aTimeout(150);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(\n 'Select Inverse'\n );\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n const itemUpdated = oneEvent(\n option2,\n 'sp-menu-item-added-or-updated'\n );\n option2.innerHTML = 'Invert Selection';\n await itemUpdated;\n await elementUpdated(el);\n await aTimeout(150);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(\n 'Invert Selection'\n );\n });\n it('unsets value when children removed', async () => {\n await nextFrame();\n el.value = 'option-2';\n\n await elementUpdated(el);\n await aTimeout(150);\n expect(el.value).to.equal('option-2');\n expect((el.button.textContent || '').trim()).to.include(\n 'Select Inverse'\n );\n\n const items = el.querySelectorAll('sp-menu-item');\n items.forEach((item) => {\n item.remove();\n });\n await elementUpdated(el);\n await nextFrame();\n await aTimeout(150);\n expect(\n (el as unknown as TestablePicker).optionsMenu.childItems.length\n ).to.equal(0);\n if ('showPopover' in document.createElement('div')) {\n return;\n }\n expect(el.value).to.equal('');\n expect((el.button.textContent || '').trim()).to.not.include(\n 'Select Inverse'\n );\n });\n it('accepts a new item and value at the same time', async () => {\n el.value = 'option-2';\n\n await elementUpdated(el);\n expect(el.value).to.equal('option-2');\n\n const item = document.createElement('sp-menu-item');\n item.value = 'option-new';\n item.textContent = 'New Option';\n\n el.append(item);\n await elementUpdated(el);\n\n el.value = 'option-new';\n\n await elementUpdated(el);\n expect(el.value).to.equal('option-new');\n });\n it('accepts a new item that can be selected', async () => {\n el.value = 'option-2';\n\n await elementUpdated(el);\n expect(el.value).to.equal('option-2');\n const item = document.createElement('sp-menu-item');\n item.value = 'option-new';\n item.textContent = 'New Option';\n\n el.append(item);\n await nextFrame();\n await elementUpdated(el);\n\n let opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n // Overlaid content is outside of the context of the Picker element\n // and cannot be managed via its updateComplete cycle.\n await nextFrame();\n\n const close = oneEvent(el, 'sp-closed');\n item.click();\n await close;\n // Overlaid content is outside of the context of the Picker element\n // and cannot be managed via its updateComplete cycle.\n await nextFrame();\n\n expect(el.value, 'first time').to.equal('option-new');\n\n opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n // Overlaid content is outside of the context of the Picker element\n // and cannot be managed via its updateComplete cycle.\n await nextFrame();\n\n expect(el.value, 'second time').to.equal('option-new');\n });\n it('manages its \"name\" value in the accessibility tree', async () => {\n await nextFrame();\n type NamedNode = { name: string };\n let snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Where do you live?'\n ),\n '`name` is the label text'\n ).to.not.be.null;\n\n el.value = 'option-2';\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Select Inverse Where do you live?'\n ),\n '`name` is the selected item text plus the label text'\n ).to.not.be.null;\n });\n it('manages `aria-activedescendant`', async () => {\n const firstItem = el.querySelector('sp-menu-item:nth-child(1)');\n const secondItem = el.querySelector('sp-menu-item:nth-child(2)');\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n expect(\n (el as unknown as TestablePicker).optionsMenu.getAttribute(\n 'aria-activedescendant'\n )\n ).to.equal(firstItem?.id);\n await sendKeys({ press: 'ArrowDown' });\n await elementUpdated(el);\n expect(\n (el as unknown as TestablePicker).optionsMenu.getAttribute(\n 'aria-activedescendant'\n )\n ).to.equal(secondItem?.id);\n });\n it('renders invalid accessibly', async () => {\n el.invalid = true;\n await elementUpdated(el);\n\n expect(el.invalid).to.be.true;\n await expect(el).to.be.accessible();\n });\n it('renders selection accessibly', async () => {\n el.value = 'option-2';\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('opens with visible focus on a menu item on `DownArrow`', async () => {\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n\n await elementUpdated(el);\n\n expect(firstItem.focused, 'should not visually focused').to.be\n .false;\n\n el.focus();\n await elementUpdated(el);\n const opened = oneEvent(el, 'sp-opened');\n await sendKeys({ press: 'ArrowRight' });\n await sendKeys({ press: 'ArrowLeft' });\n await sendKeys({ press: 'ArrowDown' });\n await opened;\n\n expect(el.open).to.be.true;\n expect(firstItem.focused, 'should be visually focused').to.be.true;\n\n const closed = oneEvent(el, 'sp-closed');\n await sendKeys({\n press: 'Escape',\n });\n await closed;\n\n expect(el.open).to.be.false;\n expect(\n document.activeElement === el,\n `focused ${document.activeElement?.localName} instead of back on Picker`\n ).to.be.true;\n expect(\n el.shadowRoot.activeElement === el.button,\n `focused ${el.shadowRoot.activeElement?.localName} instead of back on button`\n ).to.be.true;\n await waitUntil(\n () => !firstItem.focused,\n 'finally, not visually focused'\n );\n });\n it('opens with visible focus on a menu item on `Space`', async function () {\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n\n await elementUpdated(el);\n\n expect(firstItem.focused, 'should not visually focused').to.be\n .false;\n\n el.focus();\n await elementUpdated(el);\n const opened = oneEvent(el, 'sp-opened');\n await sendKeys({ press: 'ArrowRight' });\n await sendKeys({ press: 'ArrowLeft' });\n await sendKeys({ press: 'Space' });\n await opened;\n\n expect(el.open).to.be.true;\n expect(firstItem.focused, 'should be visually focused').to.be.true;\n\n const closed = oneEvent(el, 'sp-closed');\n await sendKeys({\n press: 'Escape',\n });\n await closed;\n\n expect(el.open).to.be.false;\n expect(\n document.activeElement === el,\n `focused ${document.activeElement?.localName} instead of back on Picker`\n ).to.be.true;\n expect(\n el.shadowRoot.activeElement === el.button,\n `focused ${el.shadowRoot.activeElement?.localName} instead of back on button`\n ).to.be.true;\n await waitUntil(\n () => !firstItem.focused,\n 'finally, not visually focused'\n );\n });\n it('opens, on click, without visible focus on a menu item', async () => {\n await nextFrame();\n await nextFrame();\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n const boundingRect = el.button.getBoundingClientRect();\n\n expect(firstItem.focused, 'not visually focused').to.be.false;\n const opened = oneEvent(el, 'sp-opened');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n await opened;\n\n expect(el.open).to.be.true;\n expect(firstItem.focused, 'still not visually focused').to.be.false;\n });\n it('opens and selects in a single pointer button interaction', async () => {\n await nextFrame();\n await nextFrame();\n const thirdItem = el.querySelector(\n 'sp-menu-item:nth-of-type(3)'\n ) as MenuItem;\n const boundingRect = el.button.getBoundingClientRect();\n\n expect(el.value).to.not.equal(thirdItem.value);\n const opened = oneEvent(el, 'sp-opened');\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n {\n type: 'down',\n },\n ],\n });\n await opened;\n\n const thirdItemRect = thirdItem.getBoundingClientRect();\n const closed = oneEvent(el, 'sp-closed');\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n thirdItemRect.x + thirdItemRect.width / 2,\n thirdItemRect.y + thirdItemRect.height / 2,\n ],\n },\n {\n type: 'up',\n },\n ],\n });\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.value).to.equal(thirdItem.value);\n });\n it('opens/closes multiple times', async () => {\n await nextFrame();\n await nextFrame();\n expect(el.open).to.be.false;\n const boundingRect = el.button.getBoundingClientRect();\n let opened = oneEvent(el, 'sp-opened');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n await opened;\n expect(el.open).to.be.true;\n\n let closed = oneEvent(el, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n await closed;\n expect(el.open).to.be.false;\n\n opened = oneEvent(el, 'sp-opened');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n await opened;\n expect(el.open).to.be.true;\n\n closed = oneEvent(el, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n await closed;\n expect(el.open).to.be.false;\n });\n it('closes when becoming disabled', async () => {\n expect(el.open).to.be.false;\n el.click();\n await elementUpdated(el);\n\n expect(el.open).to.be.true;\n el.disabled = true;\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n });\n it('closes when clicking away', async () => {\n el.id = 'closing';\n const other = document.createElement('div');\n document.body.append(other);\n\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n const opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n await elementUpdated(el);\n\n expect(el.open).to.be.true;\n const closed = oneEvent(el, 'sp-closed');\n other.click();\n closed;\n await elementUpdated(el);\n\n other.remove();\n });\n it('selects', async () => {\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n const opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n\n const closed = oneEvent(el, 'sp-closed');\n secondItem.click();\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.selectedItem?.itemText).to.equal('Select Inverse');\n expect(el.value).to.equal('option-2');\n });\n it('re-selects', async () => {\n const firstItem = el.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n let opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n\n let closed = oneEvent(el, 'sp-closed');\n secondItem.click();\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.selectedItem?.itemText).to.equal('Select Inverse');\n expect(el.value).to.equal('option-2');\n\n opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.equal('Select Inverse');\n expect(el.value).to.equal('option-2');\n\n closed = oneEvent(el, 'sp-closed');\n firstItem.click();\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.selectedItem?.itemText).to.equal('Deselect');\n expect(el.value).to.equal('Deselect');\n });\n it('dispatches bubbling and composed events', async () => {\n const changeSpy = spy();\n const parent = el.parentElement as HTMLElement;\n (parent.shadowRoot as ShadowRoot).append(el);\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n parent.addEventListener('change', () => changeSpy());\n\n expect(el.value).to.equal('');\n\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n\n const closed = oneEvent(el, 'sp-closed');\n secondItem.click();\n await closed;\n\n expect(el.value).to.equal(secondItem.value);\n expect(changeSpy.calledOnce).to.be.true;\n });\n it('can have selection prevented', async () => {\n const preventChangeSpy = spy();\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n const opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n expect(secondItem.selected).to.be.false;\n\n el.addEventListener('change', (event: Event): void => {\n event.preventDefault();\n preventChangeSpy();\n });\n\n const changed = oneEvent(el, 'change');\n secondItem.click();\n // The `change` event is dispatched _after_ the `updateComplete` promise.\n await changed;\n expect(\n preventChangeSpy.calledOnce,\n preventChangeSpy.callCount.toString()\n ).to.be.true;\n expect(secondItem.selected, 'selection prevented').to.be.false;\n expect(el.open).to.be.true;\n });\n it('can throw focus after `change`', async () => {\n const input = document.createElement('input');\n document.body.append(input);\n\n await elementUpdated(el);\n\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n const opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n await elementUpdated(el);\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n expect(secondItem.selected).to.be.false;\n\n el.addEventListener('change', (): void => {\n input.focus();\n });\n\n const closed = oneEvent(el, 'sp-closed');\n secondItem.click();\n await closed;\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n expect(el.value, 'value changed').to.equal('option-2');\n expect(secondItem.selected, 'selected changed').to.be.true;\n await waitUntil(\n () => document.activeElement === input,\n 'focus throw'\n );\n input.remove();\n });\n it('opens on ArrowUp', async () => {\n const button = el.button as HTMLButtonElement;\n\n el.focus();\n await elementUpdated(el);\n\n expect(el.open, 'inially closed').to.be.false;\n\n button.dispatchEvent(tEvent());\n await elementUpdated(el);\n\n expect(el.open, 'still closed').to.be.false;\n\n const opened = oneEvent(el, 'sp-opened');\n button.dispatchEvent(arrowUpEvent());\n await elementUpdated(el);\n\n expect(el.open, 'open by ArrowUp').to.be.true;\n await opened;\n\n const closed = oneEvent(el, 'sp-closed');\n sendKeys({\n press: 'Escape',\n });\n await closed;\n expect(el.open).to.be.false;\n });\n it('opens on ArrowDown', async () => {\n const firstItem = el.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const button = el.button as HTMLButtonElement;\n\n el.focus();\n await elementUpdated(el);\n\n expect(el.open, 'inially closed').to.be.false;\n\n const opened = oneEvent(el, 'sp-opened');\n button.dispatchEvent(arrowDownEvent());\n await opened;\n\n expect(el.open, 'open by ArrowDown').to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n\n const closed = oneEvent(el, 'sp-closed');\n firstItem.click();\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.selectedItem?.itemText).to.equal('Deselect');\n expect(el.value).to.equal('Deselect');\n });\n it('quick selects on ArrowLeft/Right', async () => {\n const selectionSpy = spy();\n el.addEventListener('change', (event: Event) => {\n const { value } = event.target as Picker;\n selectionSpy(value);\n });\n\n el.focus();\n await elementUpdated(el);\n await waitUntil(\n () =>\n (el as unknown as { menuItems: MenuItem[] }).menuItems\n .length === 6\n );\n\n await sendKeys({\n press: 'ArrowLeft',\n });\n await elementUpdated(el);\n\n expect(selectionSpy.callCount).to.equal(1);\n expect(selectionSpy.calledWith('Deselected'));\n await sendKeys({\n press: 'ArrowLeft',\n });\n\n await elementUpdated(el);\n expect(selectionSpy.callCount).to.equal(1);\n await sendKeys({\n press: 'ArrowRight',\n });\n\n await nextFrame();\n await nextFrame();\n expect(selectionSpy.calledWith('option-2'));\n\n await sendKeys({\n press: 'ArrowRight',\n });\n await nextFrame();\n await nextFrame();\n await sendKeys({\n press: 'ArrowRight',\n });\n await nextFrame();\n await nextFrame();\n await sendKeys({\n press: 'ArrowRight',\n });\n await nextFrame();\n await nextFrame();\n await sendKeys({\n press: 'ArrowRight',\n });\n await nextFrame();\n await nextFrame();\n expect(selectionSpy.calledWith('Save Selection'));\n expect(selectionSpy.calledWith('Make Work Path')).to.be.false;\n expect(selectionSpy.callCount).to.equal(5);\n });\n it('quick selects first item on ArrowRight when no value', async () => {\n await nextFrame();\n const selectionSpy = spy();\n el.addEventListener('change', (event: Event) => {\n const { value } = event.target as Picker;\n selectionSpy(value);\n });\n const button = el.button as HTMLButtonElement;\n\n el.focus();\n button.dispatchEvent(arrowRightEvent());\n\n await elementUpdated(el);\n\n expect(selectionSpy.callCount).to.equal(1);\n expect(selectionSpy.calledWith('Deselected'));\n });\n it('loads', async () => {\n expect(el).to.not.be.undefined;\n });\n it('closes when focusing away from the menu', async () => {\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n const thirdItem = el.querySelector(\n 'sp-menu-item:nth-of-type(3)'\n ) as MenuItem;\n const button = el.button;\n const input = document.createElement('input');\n el.insertAdjacentElement('afterend', input);\n\n el.focus();\n await sendKeys({ press: 'Tab' });\n expect(document.activeElement === input).to.be.true;\n await sendKeys({ press: 'Shift+Tab' });\n expect(document.activeElement === el).to.be.true;\n const opened = oneEvent(el, 'sp-opened');\n sendKeys({ press: 'Enter' });\n await opened;\n await elementUpdated(el);\n\n await waitUntil(\n () => firstItem.focused,\n 'The first items should have become focused visually.'\n );\n\n await sendKeys({ press: 'ArrowDown' });\n await sendKeys({ press: 'ArrowDown' });\n expect(thirdItem.focused).to.be.true;\n\n const closed = oneEvent(el, 'sp-closed');\n button.focus();\n await closed;\n expect(isMenuActiveElement(el)).to.be.false;\n expect(el.open).to.be.false;\n });\n it('does not listen to streaming `Enter` keydown', async () => {\n const openSpy = spy();\n const closedSpy = spy();\n el.addEventListener('sp-opened', () => openSpy());\n el.addEventListener('sp-closed', () => closedSpy());\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n const thirdItem = el.querySelector(\n 'sp-menu-item:nth-of-type(3)'\n ) as MenuItem;\n const input = document.createElement('input');\n el.insertAdjacentElement('afterend', input);\n\n el.focus();\n await sendKeys({ press: 'Tab' });\n expect(document.activeElement === input).to.be.true;\n await sendKeys({ press: 'Shift+Tab' });\n expect(document.activeElement === el).to.be.true;\n const opened = oneEvent(el, 'sp-opened');\n sendKeys({ down: 'Enter' });\n await opened;\n await aTimeout(300);\n expect(openSpy.callCount).to.equal(1);\n await sendKeys({ up: 'Enter' });\n\n await waitUntil(\n () => firstItem.focused,\n 'The first items should have become focused visually.'\n );\n\n await sendKeys({ press: 'ArrowDown' });\n await sendKeys({ press: 'ArrowDown' });\n expect(thirdItem.focused).to.be.true;\n\n const closed = oneEvent(el, 'sp-closed');\n sendKeys({ down: 'Enter' });\n await closed;\n await aTimeout(300);\n\n expect(el.value).to.equal(thirdItem.value);\n expect(openSpy.callCount).to.equal(1);\n expect(closedSpy.callCount).to.equal(1);\n await sendKeys({ up: 'Enter' });\n });\n it('allows tabing to close', async () => {\n const input = document.createElement('input');\n el.insertAdjacentElement('afterend', input);\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n await nextFrame();\n\n expect(el.open).to.be.true;\n el.focus();\n\n const closed = oneEvent(el, 'sp-closed');\n sendKeys({ press: 'Tab' });\n await closed;\n\n expect(el.open, 'closes').to.be.false;\n });\n describe('tab order', () => {\n let input1: HTMLInputElement;\n let input2: HTMLInputElement;\n beforeEach(() => {\n const surroundingInput = (): HTMLInputElement => {\n const input = document.createElement('input');\n input.type = 'text';\n input.tabIndex = 0;\n return input;\n };\n input1 = surroundingInput();\n input2 = surroundingInput();\n\n el.insertAdjacentElement('beforebegin', input1);\n el.insertAdjacentElement('afterend', input2);\n });\n afterEach(() => {\n input1.remove();\n input2.remove();\n });\n it('tabs forward through the element', async () => {\n // start at input1\n input1.focus();\n await nextFrame();\n expect(document.activeElement === input1, 'focuses input 1').to\n .true;\n // tab to the picker\n let focused = oneEvent(el, 'focus');\n await sendKeys({ press: 'Tab' });\n await focused;\n\n expect(el.focused, 'focused').to.be.true;\n expect(el.open, 'closed').to.be.false;\n expect(document.activeElement === el, 'focuses el').to.be.true;\n // tab through the picker to input2\n focused = oneEvent(input2, 'focus');\n await sendKeys({ press: 'Tab' });\n await focused;\n expect(document.activeElement === input2, 'focuses input 2').to\n .true;\n });\n it('shift+tabs backwards through the element', async () => {\n // start at input1\n input2.focus();\n await nextFrame();\n expect(document.activeElement, 'focuses input 2').to.equal(\n input2\n );\n // tab to the picker\n let focused = oneEvent(el, 'focus');\n await sendKeys({ press: 'Shift+Tab' });\n await focused;\n\n expect(el.focused, 'focused').to.be.true;\n expect(el.open, 'closed').to.be.false;\n expect(document.activeElement, 'focuses el').to.equal(el);\n // tab through the picker to input2\n focused = oneEvent(input1, 'focus');\n await sendKeys({ press: 'Shift+Tab' });\n await focused;\n expect(document.activeElement, 'focuses input 1').to.equal(\n input1\n );\n });\n it('can close and immediately tab to the next tab stop', async () => {\n el.focus();\n await nextFrame();\n expect(document.activeElement, 'focuses el').to.equal(el);\n // press down to open the picker\n const opened = oneEvent(el, 'sp-opened');\n await sendKeys({ press: 'ArrowUp' });\n await opened;\n\n expect(el.open, 'opened').to.be.true;\n await waitUntil(\n () => isMenuActiveElement(el),\n 'first item focused'\n );\n\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n\n expect(el.open).to.be.false;\n expect(document.activeElement === el).to.be.true;\n\n const focused = oneEvent(input2, 'focus');\n await sendKeys({ press: 'Tab' });\n await focused;\n\n expect(el.open).to.be.false;\n expect(document.activeElement === input2).to.be.true;\n });\n it('can close and immediate shift+tab to the previous tab stop', async () => {\n el.focus();\n await nextFrame();\n expect(document.activeElement === el, 'focuses el').to.be.true;\n // press down to open the picker\n const opened = oneEvent(el, 'sp-opened');\n await sendKeys({ press: 'ArrowUp' });\n await opened;\n\n expect(el.open, 'opened').to.be.true;\n await waitUntil(\n () => isMenuActiveElement(el),\n 'first item focused'\n );\n\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n\n expect(el.open).to.be.false;\n expect(document.activeElement === el).to.be.true;\n\n const focused = oneEvent(input1, 'focus');\n sendKeys({ press: 'Shift+Tab' });\n await focused;\n\n expect(el.open).to.be.false;\n expect(document.activeElement === input1).to.be.true;\n });\n });\n it('does not open when [readonly]', async () => {\n el.readonly = true;\n\n await elementUpdated(el);\n\n el.click();\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n });\n it('scrolls selected into view on open', async () => {\n // the Popover is transient, you need to be able to apply custom styles to it...\n const styles = document.createElement('style');\n styles.innerText = 'sp-popover { height: 40px; }';\n el.shadowRoot.append(styles);\n\n const firstItem = el.querySelector(\n 'sp-menu-item:first-child'\n ) as MenuItem;\n const lastItem = el.querySelector(\n 'sp-menu-item:last-child'\n ) as MenuItem;\n lastItem.disabled = false;\n el.value = lastItem.value;\n\n await elementUpdated(el);\n\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n await waitUntil(\n () => isMenuActiveElement(el),\n 'first item focused'\n );\n const getParentOffset = (el: HTMLElement): number => {\n const parentScroll = (\n (el as HTMLElement & { assignedSlot: HTMLSlotElement })\n .assignedSlot.parentElement as HTMLElement\n ).scrollTop;\n const parentOffset = el.offsetTop - parentScroll;\n return parentOffset;\n };\n expect(getParentOffset(lastItem)).to.be.lessThan(40);\n expect(getParentOffset(firstItem)).to.be.lessThan(-1);\n\n lastItem.dispatchEvent(\n new FocusEvent('focusin', { bubbles: true })\n );\n await sendKeys({\n press: 'ArrowDown',\n });\n await elementUpdated(el);\n await nextFrame();\n expect(getParentOffset(lastItem)).to.be.greaterThan(40);\n expect(getParentOffset(firstItem)).to.be.greaterThan(-1);\n });\n it('manages focus-ring styles', async () => {\n if (!isWebKit()) {\n return;\n }\n /**\n * This is a hack to set the `isMobile` property to true so that we can test the MobileController\n */\n el.isMobile.matches = true;\n el.bindEvents();\n\n await setViewport({ width: 360, height: 640 });\n // Allow viewport update to propagate.\n await nextFrame();\n\n let opened = oneEvent(el, 'sp-opened');\n\n const boundingRect = el.button.getBoundingClientRect();\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n\n await opened;\n\n const tray = el.shadowRoot.querySelector('sp-tray');\n expect(tray).to.not.be.null;\n\n // Make a selection\n let closed = oneEvent(el, 'sp-closed');\n\n const firstItem = el.querySelector('sp-menu-item') as MenuItem;\n firstItem.click();\n\n await elementUpdated(el);\n await closed;\n\n // expect the tray to be closed\n expect(el.open).to.be.false;\n\n const button = el.shadowRoot.querySelector(\n '#button'\n ) as HTMLButtonElement;\n expect(button).to.not.be.null;\n\n // we should have SAFARI_FOCUS_RING_CLASS in the classList\n expect(button.classList.contains(SAFARI_FOCUS_RING_CLASS)).to.be\n .true;\n\n // picker should still have focus\n expect(document.activeElement === el).to.be.true;\n\n // click outside (0,0)\n await sendMouse({\n steps: [\n {\n type: 'click',\n position: [0, 0],\n },\n ],\n });\n\n // picker should not have focus\n expect(document.activeElement === el).to.be.false;\n\n // Let's use keyboard to open the tray now\n opened = oneEvent(el, 'sp-opened');\n await sendKeys({\n press: 'Tab',\n });\n await sendKeys({\n press: 'Enter',\n });\n await elementUpdated(el);\n await opened;\n\n // Make a selection again\n closed = oneEvent(el, 'sp-closed');\n firstItem.click();\n await elementUpdated(el);\n await closed;\n\n // expect the tray to be closed\n expect(el.open).to.be.false;\n\n // we should not have SAFARI_FOCUS_RING_CLASS in the classList\n expect(button.classList.contains(SAFARI_FOCUS_RING_CLASS)).to.be\n .false;\n });\n });\n describe('grouped', async () => {\n const groupedFixture = async (): Promise<Picker> => {\n return fixture<Picker>(html`\n <sp-picker\n quiet\n label=\"I would like to use Spectrum Web Components\"\n value=\"0\"\n >\n <sp-menu-group>\n <span slot=\"header\">Timeline</span>\n <sp-menu-item value=\"0\" id=\"should-be-selected\">\n Immediately\n </sp-menu-item>\n <sp-menu-item value=\"1\">\n I'm already using them\n </sp-menu-item>\n <sp-menu-item value=\"2\">Soon</sp-menu-item>\n <sp-menu-item value=\"3\">\n As part of my next project\n </sp-menu-item>\n <sp-menu-item value=\"4\">In the future</sp-menu-item>\n </sp-menu-group>\n </sp-picker>\n `);\n };\n beforeEach(async () => {\n el = await groupedFixture();\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n });\n it('selects the item with a matching value in a group', async () => {\n const item = el.querySelector('#should-be-selected') as MenuItem;\n expect(item.selected).to.be.true;\n });\n });\n describe('slotted label', () => {\n const pickerFixture = async (): Promise<Picker> => {\n const test = await fixture<Picker>(html`\n <div>\n <sp-field-label for=\"picker-slotted\">\n Where do you live?\n </sp-field-label>\n <sp-picker id=\"picker-slotted\">\n <span slot=\"label\">\n Select a Country with a very long label, too long in\n fact\n </span>\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">\n Select Inverse\n </sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-picker>\n </div>\n `);\n\n return test.querySelector('sp-picker') as Picker;\n };\n beforeEach(async () => {\n el = await pickerFixture();\n await elementUpdated(el);\n await nextFrame();\n });\n afterEach(async () => {\n if (el.open) {\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n }\n });\n\n it('loads accessibly w/ slotted label', async () => {\n await expect(el).to.be.accessible();\n });\n });\n describe('Dev mode', () => {\n let consoleWarnStub!: ReturnType<typeof stub>;\n before(() => {\n window.__swc.verbose = true;\n consoleWarnStub = stub(console, 'warn');\n });\n afterEach(() => {\n consoleWarnStub.resetHistory();\n });\n after(async () => {\n window.__swc.verbose = false;\n consoleWarnStub.restore();\n if (el.open) {\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n }\n });\n\n const pickerFixture = async (): Promise<Picker> => {\n const test = await fixture<Picker>(html`\n <div>\n <sp-field-label for=\"picker-deprecated\">\n Where do you live?\n </sp-field-label>\n <sp-picker\n id=\"picker-deprecated\"\n label=\"Select a Country with a very long label, too long in fact\"\n >\n <sp-menu>\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">\n Select Inverse\n </sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-menu>\n </sp-picker>\n </div>\n `);\n\n return test.querySelector('sp-picker') as Picker;\n };\n it('does not warn in Dev Mode when accessible elements leveraged', async () => {\n const test = await fixture<Picker>(html`\n <div>\n <sp-field-label for=\"test\">Test label</sp-field-label>\n <sp-picker id=\"test\">\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n </sp-picker>\n </div>\n `);\n\n el = test.querySelector('sp-picker') as Picker;\n\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n\n expect(consoleWarnStub.called).to.be.false;\n });\n it('warns in Dev Mode when accessible attributes are not leveraged', async function () {\n this.retries(0);\n el = await fixture<Picker>(html`\n <sp-picker>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n </sp-picker>\n `);\n\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n\n expect(consoleWarnStub.called).to.be.true;\n const spyCall = consoleWarnStub.getCall(0);\n expect(\n (spyCall.args.at(0) as string).includes('accessible'),\n 'confirm accessibility-centric message'\n ).to.be.true;\n expect(spyCall.args.at(-1), 'confirm `data` shape').to.deep.equal({\n data: {\n localName: 'sp-picker',\n type: 'accessibility',\n level: 'default',\n },\n });\n });\n describe('deprecated', () => {\n it('warns in Dev Mode of deprecated `<sp-menu>` usage', async () => {\n el = await pickerFixture();\n await elementUpdated(el);\n\n expect(consoleWarnStub.called).to.be.true;\n const spyCall = consoleWarnStub.getCall(0);\n expect(\n (spyCall.args.at(0) as string).includes('<sp-menu>'),\n 'confirm <sp-menu>-centric message'\n ).to.be.true;\n expect(\n spyCall.args.at(-1),\n 'confirm `data` shape'\n ).to.deep.equal({\n data: {\n localName: 'sp-picker',\n type: 'api',\n level: 'deprecation',\n },\n });\n });\n });\n describe('Dev mode ignored', () => {\n const { ignoreWarningLocalNames } = window.__swc;\n before(() => {\n window.__swc.ignoreWarningLocalNames = {\n 'sp-picker': true,\n };\n });\n before(() => {\n window.__swc.ignoreWarningLocalNames = ignoreWarningLocalNames;\n });\n beforeEach(async () => {\n el = await pickerFixture();\n await elementUpdated(el);\n await nextFrame();\n });\n afterEach(async () => {\n if (el.open) {\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n }\n });\n it('selects with deprecated syntax', async () => {\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n const opened = oneEvent(el, 'sp-opened');\n el.click();\n await opened;\n\n expect(el.open).to.be.true;\n expect(el.selectedItem?.itemText).to.be.undefined;\n expect(el.value).to.equal('');\n\n const closed = oneEvent(el, 'sp-closed');\n secondItem.click();\n await closed;\n\n expect(el.open).to.be.false;\n expect(el.selectedItem?.itemText).to.equal('Select Inverse');\n expect(el.value).to.equal('option-2');\n });\n });\n });\n testForLitDevWarnings(async () => await pickerFixture());\n it('manages its \"name\" value in the accessibility tree when [icons-only]', async () => {\n const test = await fixture<HTMLDivElement>(html`\n <div>${iconsOnly({})}</div>\n `);\n const el = test.querySelector('sp-picker') as Picker;\n\n await elementUpdated(el);\n await nextFrame();\n type NamedNode = { name: string };\n let snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Delete Choose an action type...'\n ),\n '`name` is the label text'\n ).to.not.be.null;\n\n el.value = '2';\n await elementUpdated(el);\n await nextFrame();\n await nextFrame();\n expect(el.value).to.equal('2');\n snapshot = (await a11ySnapshot({})) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) => node.name === 'Copy Choose an action type...'\n ),\n '`name` is the label text plus the selected item text'\n ).to.not.be.null;\n });\n it('toggles between pickers', async () => {\n const el2 = await pickerFixture();\n const el1 = await pickerFixture();\n\n (el1.parentElement as HTMLElement).style.float = 'left';\n (el2.parentElement as HTMLElement).style.float = 'left';\n el1.id = 'away';\n el2.id = 'other';\n\n await Promise.all([elementUpdated(el1), elementUpdated(el2)]);\n\n expect(el1.open, 'closed 1').to.be.false;\n expect(el2.open, 'closed 1').to.be.false;\n let open = oneEvent(el1, 'sp-opened');\n el1.click();\n await open;\n expect(el1.open).to.be.true;\n expect(el2.open).to.be.false;\n\n open = oneEvent(el2, 'sp-opened');\n let closed = oneEvent(el1, 'sp-closed');\n el2.click();\n await Promise.all([open, closed]);\n expect(el1.open).to.be.false;\n expect(el2.open).to.be.true;\n\n open = oneEvent(el1, 'sp-opened');\n closed = oneEvent(el2, 'sp-closed');\n el1.click();\n await Promise.all([open, closed]);\n expect(el2.open).to.be.false;\n expect(el1.open).to.be.true;\n\n closed = oneEvent(el1, 'sp-closed');\n sendKeys({\n press: 'Escape',\n });\n await closed;\n expect(el1.open).to.be.false;\n });\n it('displays selected item text by default', async () => {\n const el = await fixture<Picker>(html`\n <sp-picker\n value=\"inverse\"\n label=\"Select a Country with a very long label, too long in fact\"\n >\n <sp-menu-item value=\"deselect\">Deselect Text</sp-menu-item>\n <sp-menu-item value=\"inverse\">Select Inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-picker>\n `);\n await nextFrame();\n\n await elementUpdated(el);\n await waitUntil(\n () => el.selectedItem?.itemText === 'Select Inverse',\n `Selected Item Text: ${el.selectedItem?.itemText}`\n );\n\n const firstItem = el.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n expect(el.value).to.equal('inverse');\n expect(el.selectedItem?.itemText).to.equal('Select Inverse');\n\n el.focus();\n await elementUpdated(el);\n expect(\n el === document.activeElement,\n `activeElement is ${document.activeElement?.localName}`\n ).to.be.true;\n\n const opened = oneEvent(el, 'sp-opened');\n sendKeys({ press: 'Enter' });\n await opened;\n\n expect(\n el === document.activeElement,\n `activeElement is ${document.activeElement?.localName}`\n ).to.be.true;\n expect(\n (el as unknown as TestablePicker).optionsMenu ===\n el.shadowRoot.activeElement,\n `activeElement is ${el.shadowRoot.activeElement?.localName}`\n ).to.be.true;\n\n expect(firstItem.focused, 'firstItem NOT \"focused\"').to.be.false;\n expect(secondItem.focused, 'secondItem \"focused\"').to.be.true;\n expect(\n (el as unknown as TestablePicker).optionsMenu.getAttribute(\n 'aria-activedescendant'\n )\n ).to.equal(secondItem.id);\n });\n it('resets value when item not available', async () => {\n const el = await fixture<Picker>(html`\n <sp-picker\n value=\"missing\"\n label=\"Select a Country with a very long label, too long in fact\"\n >\n <sp-menu-item value=\"deselect\">Deselect Text</sp-menu-item>\n <sp-menu-item value=\"inverse\">Select Inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-picker>\n `);\n\n await elementUpdated(el);\n await waitUntil(() => el.value === '');\n\n expect(el.value).to.equal('');\n expect(el.selectedItem?.itemText).to.be.undefined;\n });\n it('allows event listeners on child items', async () => {\n const mouseenterSpy = spy();\n const handleMouseenter = (): void => mouseenterSpy();\n const el = await fixture<Picker>(html`\n <sp-picker\n label=\"Select a Country with a very long label, too long in fact\"\n >\n <sp-menu-item value=\"deselect\" @mouseenter=${handleMouseenter}>\n Deselect Text\n </sp-menu-item>\n </sp-picker>\n `);\n\n await elementUpdated(el);\n\n const hoverEl = el.querySelector('sp-menu-item') as MenuItem;\n\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n await elementUpdated(el);\n\n expect(el.open).to.be.true;\n hoverEl.dispatchEvent(new MouseEvent('mouseenter'));\n await elementUpdated(el);\n\n expect(el.open).to.be.true;\n\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n await elementUpdated(el);\n\n expect(el.open).to.be.false;\n expect(mouseenterSpy.calledOnce).to.be.true;\n });\n it('dispatches events on open/close', async () => {\n const openedSpy = spy();\n const closedSpy = spy();\n const handleOpenedSpy = (event: Event): void => openedSpy(event);\n const handleClosedSpy = (event: Event): void => closedSpy(event);\n\n const el = await fixture<Picker>(html`\n <sp-picker\n label=\"Select a Country with a very long label, too long in fact\"\n @sp-opened=${handleOpenedSpy}\n @sp-closed=${handleClosedSpy}\n >\n <sp-menu-item value=\"deselect\">Deselect Text</sp-menu-item>\n </sp-picker>\n `);\n\n await elementUpdated(el);\n const opened = oneEvent(el, 'sp-opened');\n el.open = true;\n await opened;\n await elementUpdated(el);\n\n expect(openedSpy.calledOnce).to.be.true;\n expect(closedSpy.calledOnce).to.be.false;\n\n const closed = oneEvent(el, 'sp-closed');\n el.open = false;\n await closed;\n await elementUpdated(el);\n\n expect(closedSpy.calledOnce).to.be.true;\n });\n it('closes tooltip on button blur', async () => {\n const test = await styledFixture(html`\n <div>${tooltip(tooltip.args)}</div>\n `);\n const el = test.querySelector('sp-picker') as Picker;\n await elementUpdated(el);\n const input1 = document.createElement('input');\n const input2 = document.createElement('input');\n const tooltipEl = el.querySelector('sp-tooltip') as Tooltip;\n el.insertAdjacentElement('beforebegin', input1);\n el.insertAdjacentElement('afterend', input2);\n input1.focus();\n expect(document.activeElement === input1).to.be.true;\n const tooltipOpened = oneEvent(el, 'sp-opened');\n await sendKeys({\n press: 'Tab',\n });\n await tooltipOpened;\n expect(\n document.activeElement === el,\n `Actually, ${document.activeElement?.localName}`\n ).to.be.true;\n expect(tooltipEl.open).to.be.true;\n expect(el.open).to.be.false;\n expect(el.focused).to.be.true;\n\n const menuOpen = oneEvent(el, 'sp-opened');\n const tooltipClosed = oneEvent(el, 'sp-closed');\n await sendKeys({\n press: 'ArrowDown',\n });\n await menuOpen;\n await tooltipClosed;\n expect(document.activeElement === el).to.be.true;\n expect(tooltipEl.open).to.be.false;\n expect(el.open).to.be.true;\n\n const menuClosed = oneEvent(el, 'sp-closed');\n await sendKeys({\n press: 'Tab',\n });\n await menuClosed;\n expect(document.activeElement === el).to.be.false;\n expect(tooltipEl.open).to.be.false;\n expect(el.open).to.be.false;\n });\n describe('disabled', function () {\n beforeEach(async function () {\n const test = await fixture(html`\n <div>${disabled(disabled.args)}</div>\n `);\n this.label = test.querySelector('sp-field-label') as FieldLabel;\n this.el = test.querySelector('sp-picker') as Picker;\n await elementUpdated(this.elel);\n });\n it('does not recieve focus from an `<sp-field-label>`', async function () {\n expect(this.el.disabled).to.be.true;\n expect(this.el.focused).to.be.false;\n\n this.label.click();\n await elementUpdated(this.el);\n\n expect(this.el.focused).to.be.false;\n });\n it('does not open from `click()`', async function () {\n expect(this.el.disabled).to.be.true;\n expect(this.el.open).to.be.false;\n\n this.el.click();\n await elementUpdated(this.el);\n\n expect(this.el.open).to.be.false;\n });\n it('does not open from `sendMouse()`', async function () {\n expect(this.el.disabled).to.be.true;\n expect(this.el.open).to.be.false;\n\n const boundingRect = this.el.button.getBoundingClientRect();\n\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n ],\n });\n // Synthetic delay for \"open\" but not \"sp-open\" as it would never come.\n await nextFrame();\n await nextFrame();\n await nextFrame();\n await nextFrame();\n\n expect(this.el.open).to.be.false;\n });\n });\n describe('pending', function () {\n beforeEach(async function () {\n const test = await fixture(html`\n <div>${pending({ pending: true })}</div>\n `);\n this.label = test.querySelector('sp-field-label') as FieldLabel;\n this.el = test.querySelector('sp-picker') as Picker;\n await elementUpdated(this.elel);\n });\n it('receives focus from an `<sp-field-label>`', async function () {\n expect(this.el.focused).to.be.false;\n\n this.label.click();\n await elementUpdated(this.el);\n\n expect(this.el.focused).to.be.true;\n });\n it('does not open from `click()`', async function () {\n expect(this.el.open).to.be.false;\n\n this.el.click();\n await elementUpdated(this.el);\n\n expect(this.el.open).to.be.false;\n });\n it('manages its \"name\" value in the accessibility tree when [pending]', async () => {\n type NamedNode = { name: string; role: string };\n const snapshot = (await a11ySnapshot(\n {}\n )) as unknown as NamedNode & {\n children: NamedNode[];\n };\n\n expect(\n findAccessibilityNode<NamedNode>(\n snapshot,\n (node) =>\n node.name ===\n 'Pending Choose your neighborhood Where do you live?'\n )\n ).to.not.be.null;\n });\n });\n}\n"],
5
5
  "mappings": "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",
6
6
  "names": ["el", "node", "pickerFixture", "_a"]
7
7
  }