@spectrum-web-components/overlay 0.19.6-overlay.18 → 0.30.1-overlay.30

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.
Files changed (55) hide show
  1. package/overlay-trigger.dev.js +2 -1
  2. package/overlay-trigger.dev.js.map +2 -2
  3. package/overlay-trigger.js +1 -1
  4. package/overlay-trigger.js.map +3 -3
  5. package/package.json +7 -7
  6. package/sp-overlay.dev.js +2 -1
  7. package/sp-overlay.dev.js.map +2 -2
  8. package/sp-overlay.js +1 -1
  9. package/sp-overlay.js.map +3 -3
  10. package/src/Overlay.js.map +1 -1
  11. package/src/OverlayBase.d.ts +11 -1
  12. package/src/OverlayBase.dev.js +141 -91
  13. package/src/OverlayBase.dev.js.map +2 -2
  14. package/src/OverlayBase.js +6 -7
  15. package/src/OverlayBase.js.map +3 -3
  16. package/src/OverlayDialog.js.map +1 -1
  17. package/src/OverlayNoPopover.js.map +1 -1
  18. package/src/OverlayPopover.dev.js +22 -2
  19. package/src/OverlayPopover.dev.js.map +2 -2
  20. package/src/OverlayPopover.js +1 -1
  21. package/src/OverlayPopover.js.map +3 -3
  22. package/src/OverlayStack.dev.js +18 -8
  23. package/src/OverlayStack.dev.js.map +2 -2
  24. package/src/OverlayStack.js +1 -1
  25. package/src/OverlayStack.js.map +3 -3
  26. package/src/OverlayTrigger.dev.js +1 -0
  27. package/src/OverlayTrigger.dev.js.map +2 -2
  28. package/src/OverlayTrigger.js +1 -0
  29. package/src/OverlayTrigger.js.map +2 -2
  30. package/src/PlacementController.js.map +1 -1
  31. package/src/overlay-base.css.dev.js +1 -1
  32. package/src/overlay-base.css.dev.js.map +1 -1
  33. package/src/overlay-base.css.js +1 -1
  34. package/src/overlay-base.css.js.map +1 -1
  35. package/src/placement.js.map +1 -1
  36. package/src/topLayerOverTransforms.dev.js +4 -0
  37. package/src/topLayerOverTransforms.dev.js.map +2 -2
  38. package/src/topLayerOverTransforms.js +1 -1
  39. package/src/topLayerOverTransforms.js.map +2 -2
  40. package/test/index.js +113 -106
  41. package/test/index.js.map +2 -2
  42. package/test/overlay-element.test.js +345 -411
  43. package/test/overlay-element.test.js.map +2 -2
  44. package/test/overlay-lifecycle.test.js +1 -33
  45. package/test/overlay-lifecycle.test.js.map +2 -2
  46. package/test/overlay-trigger-extended.test.js +1 -1
  47. package/test/overlay-trigger-extended.test.js.map +2 -2
  48. package/test/overlay-trigger-hover-click.test.js +23 -23
  49. package/test/overlay-trigger-hover-click.test.js.map +2 -2
  50. package/test/overlay-trigger-hover.test.js +42 -36
  51. package/test/overlay-trigger-hover.test.js.map +2 -2
  52. package/test/overlay-trigger-longpress.test.js +51 -51
  53. package/test/overlay-trigger-longpress.test.js.map +2 -2
  54. package/test/overlay.test.js +8 -12
  55. package/test/overlay.test.js.map +2 -2
@@ -1,4 +1,5 @@
1
1
  "use strict";
2
+ import { defineElement } from "@spectrum-web-components/base/src/define-element.js";
2
3
  import { OverlayTrigger } from "./src/OverlayTrigger.dev.js";
3
- customElements.define("overlay-trigger", OverlayTrigger);
4
+ defineElement("overlay-trigger", OverlayTrigger);
4
5
  //# sourceMappingURL=overlay-trigger.dev.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["overlay-trigger.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*/\nimport { OverlayTrigger } from './src/OverlayTrigger.dev.js'\n\ncustomElements.define('overlay-trigger', OverlayTrigger);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'overlay-trigger': OverlayTrigger;\n }\n}\n"],
5
- "mappings": ";AAWA,SAAS,sBAAsB;AAE/B,eAAe,OAAO,mBAAmB,cAAc;",
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*/\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\nimport { OverlayTrigger } from './src/OverlayTrigger.dev.js'\n\ndefineElement('overlay-trigger', OverlayTrigger);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'overlay-trigger': OverlayTrigger;\n }\n}\n"],
5
+ "mappings": ";AAWA,SAAS,qBAAqB;AAC9B,SAAS,sBAAsB;AAE/B,cAAc,mBAAmB,cAAc;",
6
6
  "names": []
7
7
  }
@@ -1,2 +1,2 @@
1
- "use strict";import{OverlayTrigger as e}from"./src/OverlayTrigger.js";customElements.define("overlay-trigger",e);
1
+ "use strict";import{defineElement as e}from"@spectrum-web-components/base/src/define-element.js";import{OverlayTrigger as r}from"./src/OverlayTrigger.js";e("overlay-trigger",r);
2
2
  //# sourceMappingURL=overlay-trigger.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["overlay-trigger.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*/\nimport { OverlayTrigger } from './src/OverlayTrigger.js';\n\ncustomElements.define('overlay-trigger', OverlayTrigger);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'overlay-trigger': OverlayTrigger;\n }\n}\n"],
5
- "mappings": "aAWA,OAAS,kBAAAA,MAAsB,0BAE/B,eAAe,OAAO,kBAAmBA,CAAc",
6
- "names": ["OverlayTrigger"]
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*/\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\nimport { OverlayTrigger } from './src/OverlayTrigger.js';\n\ndefineElement('overlay-trigger', OverlayTrigger);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'overlay-trigger': OverlayTrigger;\n }\n}\n"],
5
+ "mappings": "aAWA,OAAS,iBAAAA,MAAqB,sDAC9B,OAAS,kBAAAC,MAAsB,0BAE/BD,EAAc,kBAAmBC,CAAc",
6
+ "names": ["defineElement", "OverlayTrigger"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/overlay",
3
- "version": "0.19.6-overlay.18+2ba65b1a7",
3
+ "version": "0.30.1-overlay.30+1df211c75",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -130,11 +130,11 @@
130
130
  "lit-html"
131
131
  ],
132
132
  "dependencies": {
133
- "@floating-ui/dom": "^1.2.6",
134
- "@spectrum-web-components/action-button": "^0.10.17-overlay.18+2ba65b1a7",
135
- "@spectrum-web-components/base": "^0.7.6-overlay.62+2ba65b1a7",
136
- "@spectrum-web-components/shared": "^0.15.8-overlay.18+2ba65b1a7",
137
- "@spectrum-web-components/theme": "^0.15.1-overlay.18+2ba65b1a7"
133
+ "@floating-ui/dom": "^1.2.7",
134
+ "@spectrum-web-components/action-button": "^0.30.1-overlay.30+1df211c75",
135
+ "@spectrum-web-components/base": "^0.30.1-overlay.30+1df211c75",
136
+ "@spectrum-web-components/shared": "^0.30.1-overlay.30+1df211c75",
137
+ "@spectrum-web-components/theme": "^0.30.1-overlay.30+1df211c75"
138
138
  },
139
139
  "types": "./src/index.d.ts",
140
140
  "customElements": "custom-elements.json",
@@ -146,5 +146,5 @@
146
146
  "./stories/overlay-story-components.js",
147
147
  "./**/*.dev.js"
148
148
  ],
149
- "gitHead": "2ba65b1a7310f182972a840bea45ba93203c2da0"
149
+ "gitHead": "1df211c7581b6fd6ec624cf2b09bc81aeec29c26"
150
150
  }
package/sp-overlay.dev.js CHANGED
@@ -1,4 +1,5 @@
1
1
  "use strict";
2
+ import { defineElement } from "@spectrum-web-components/base/src/define-element.js";
2
3
  import { Overlay } from "./src/Overlay.dev.js";
3
- customElements.define("sp-overlay", Overlay);
4
+ defineElement("sp-overlay", Overlay);
4
5
  //# sourceMappingURL=sp-overlay.dev.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["sp-overlay.ts"],
4
- "sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { Overlay } from './src/Overlay.dev.js'\n\ncustomElements.define('sp-overlay', Overlay);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-overlay': Overlay;\n }\n}\n"],
5
- "mappings": ";AAWA,SAAS,eAAe;AAExB,eAAe,OAAO,cAAc,OAAO;",
4
+ "sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\nimport { Overlay } from './src/Overlay.dev.js'\n\ndefineElement('sp-overlay', Overlay);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-overlay': Overlay;\n }\n}\n"],
5
+ "mappings": ";AAWA,SAAS,qBAAqB;AAC9B,SAAS,eAAe;AAExB,cAAc,cAAc,OAAO;",
6
6
  "names": []
7
7
  }
package/sp-overlay.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";import{Overlay as e}from"./src/Overlay.js";customElements.define("sp-overlay",e);
1
+ "use strict";import{defineElement as e}from"@spectrum-web-components/base/src/define-element.js";import{Overlay as a}from"./src/Overlay.js";e("sp-overlay",a);
2
2
  //# sourceMappingURL=sp-overlay.js.map
package/sp-overlay.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["sp-overlay.ts"],
4
- "sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { Overlay } from './src/Overlay.js';\n\ncustomElements.define('sp-overlay', Overlay);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-overlay': Overlay;\n }\n}\n"],
5
- "mappings": "aAWA,OAAS,WAAAA,MAAe,mBAExB,eAAe,OAAO,aAAcA,CAAO",
6
- "names": ["Overlay"]
4
+ "sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\nimport { Overlay } from './src/Overlay.js';\n\ndefineElement('sp-overlay', Overlay);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-overlay': Overlay;\n }\n}\n"],
5
+ "mappings": "aAWA,OAAS,iBAAAA,MAAqB,sDAC9B,OAAS,WAAAC,MAAe,mBAExBD,EAAc,aAAcC,CAAO",
6
+ "names": ["defineElement", "Overlay"]
7
7
  }
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["Overlay.ts"],
4
4
  "sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { noop, OverlayBase } from './OverlayBase.js';\nimport { OverlayDialog } from './OverlayDialog.js';\nimport { OverlayPopover } from './OverlayPopover.js';\nimport { OverlayNoPopover } from './OverlayNoPopover.js';\nimport type { OverlayOptions, TriggerInteractions } from './overlay-types.js';\nimport { Placement } from '@floating-ui/dom/src/types.js';\nimport { VirtualTrigger } from './VirtualTrigger.js';\nimport { reparentChildren } from '@spectrum-web-components/shared';\n\nconst supportsPopover = 'showPopover' in document.createElement('div');\n\nlet OverlayFeatures = OverlayDialog(OverlayBase);\nif (supportsPopover) {\n OverlayFeatures = OverlayPopover(OverlayFeatures);\n} else {\n OverlayFeatures = OverlayNoPopover(OverlayFeatures);\n}\n\ntype OverlayOptionsV2 = {\n delayed?: boolean;\n offset?: number | [number, number]; // supporting multi-axis\n placement?: Placement;\n receivesFocus: 'auto' | 'true' | 'false';\n trigger?: HTMLElement | VirtualTrigger;\n type?: 'modal' | 'page' | 'hint' | 'auto' | 'manual';\n};\n\n/**\n * @element sp-overlay\n *\n * @fires sp-opened - announces that an overlay has completed any entry animations\n * @fires sp-closed - announce that an overlay has compelted any exit animations\n */\nexport class Overlay extends OverlayFeatures {\n public static update(): void {\n const overlayUpdateEvent = new CustomEvent('sp-update-overlays', {\n bubbles: true,\n composed: true,\n cancelable: true,\n });\n document.dispatchEvent(overlayUpdateEvent);\n }\n\n public static async open(\n target: HTMLElement,\n interaction: TriggerInteractions,\n content: HTMLElement,\n options: OverlayOptions\n ): Promise<() => void>;\n public static async open(\n content: HTMLElement,\n options: OverlayOptionsV2\n ): Promise<Overlay>;\n public static async open(\n targetOrContent: HTMLElement,\n interactionOrOptions: TriggerInteractions | OverlayOptionsV2,\n content?: HTMLElement,\n options?: OverlayOptions\n ): Promise<Overlay | (() => void)> {\n const v2 = arguments.length === 2;\n const overlay = new Overlay();\n if (v2) {\n const content = targetOrContent;\n const options = interactionOrOptions as OverlayOptionsV2;\n overlay.append(content);\n overlay.triggerElement = options.trigger || null;\n overlay.type = options.type || 'modal';\n overlay.offset = options.offset || 6;\n overlay.placement = options.placement;\n await new Promise<void>((res) =>\n requestAnimationFrame(() => res())\n );\n // Do we want to \"open\" this path, or leave that to the consumer?\n overlay.open = true;\n return overlay;\n } else if (content && options) {\n const target = targetOrContent;\n const interaction = interactionOrOptions;\n let restored = false;\n const restoreContent = reparentChildren([content], overlay, {\n position: 'beforeend',\n prepareCallback: (el) => {\n const slot = el.slot;\n return () => {\n el.slot = slot;\n };\n },\n });\n overlay.receivesFocus = options.receivesFocus ?? 'auto';\n overlay.triggerElement = options.virtualTrigger || target;\n overlay.type =\n interaction === 'modal'\n ? 'modal'\n : interaction === 'hover'\n ? 'hint'\n : 'auto';\n overlay.offset = options.offset ?? 6;\n overlay.placement = options.placement;\n overlay.willPreventClose = !!options.notImmediatelyClosable;\n // This is super dirty...find a better way.\n // Maybe imperative open should go _at the end_ of everything?\n // Having an option is likely useful.\n // Make imperative overlays less useful?\n // Delete the imperative approach to an overlay?\n // Possibly the giving all of the responsiblities to the user is the best path.\n const parent = target.getRootNode() as Document;\n if (parent === document) {\n target.insertAdjacentElement('afterend', overlay);\n } else {\n parent.append(overlay);\n }\n await new Promise<void>((res) =>\n requestAnimationFrame(() => requestAnimationFrame(() => res()))\n );\n overlay.open = true;\n overlay.dispose = () => {\n overlay.addEventListener('sp-closed', () => {\n if (!restored) {\n restoreContent();\n restored = true;\n }\n requestAnimationFrame(() => {\n overlay.remove();\n });\n });\n overlay.open = false;\n overlay.dispose = noop;\n };\n return overlay.dispose;\n }\n /* c8 ignore next 1 */\n return overlay;\n }\n}\n"],
5
- "mappings": "aAWA,OAAS,QAAAA,EAAM,eAAAC,MAAmB,mBAClC,OAAS,iBAAAC,MAAqB,qBAC9B,OAAS,kBAAAC,MAAsB,sBAC/B,OAAS,oBAAAC,MAAwB,wBAIjC,OAAS,oBAAAC,MAAwB,kCAEjC,MAAMC,EAAkB,gBAAiB,SAAS,cAAc,KAAK,EAErE,IAAIC,EAAkBL,EAAcD,CAAW,EAC3CK,EACAC,EAAkBJ,EAAeI,CAAe,EAEhDA,EAAkBH,EAAiBG,CAAe,EAkB/C,aAAM,gBAAgBA,CAAgB,CACzC,OAAc,QAAe,CACzB,MAAMC,EAAqB,IAAI,YAAY,qBAAsB,CAC7D,QAAS,GACT,SAAU,GACV,WAAY,EAChB,CAAC,EACD,SAAS,cAAcA,CAAkB,CAC7C,CAYA,aAAoB,KAChBC,EACAC,EACAC,EACAC,EAC+B,CArEvC,IAAAC,EAAAC,EAsEQ,MAAMC,EAAK,UAAU,SAAW,EAC1BC,EAAU,IAAI,QACpB,GAAID,EAAI,CACJ,MAAMJ,EAAUF,EACVG,EAAUF,EAChB,OAAAM,EAAQ,OAAOL,CAAO,EACtBK,EAAQ,eAAiBJ,EAAQ,SAAW,KAC5CI,EAAQ,KAAOJ,EAAQ,MAAQ,QAC/BI,EAAQ,OAASJ,EAAQ,QAAU,EACnCI,EAAQ,UAAYJ,EAAQ,UAC5B,MAAM,IAAI,QAAeK,GACrB,sBAAsB,IAAMA,EAAI,CAAC,CACrC,EAEAD,EAAQ,KAAO,GACRA,CACX,SAAWL,GAAWC,EAAS,CAC3B,MAAMM,EAAST,EACTU,EAAcT,EACpB,IAAIU,EAAW,GACf,MAAMC,EAAiBhB,EAAiB,CAACM,CAAO,EAAGK,EAAS,CACxD,SAAU,YACV,gBAAkBM,GAAO,CACrB,MAAMC,EAAOD,EAAG,KAChB,MAAO,IAAM,CACTA,EAAG,KAAOC,CACd,CACJ,CACJ,CAAC,EACDP,EAAQ,eAAgBH,EAAAD,EAAQ,gBAAR,KAAAC,EAAyB,OACjDG,EAAQ,eAAiBJ,EAAQ,gBAAkBM,EACnDF,EAAQ,KACJG,IAAgB,QACV,QACAA,IAAgB,QAChB,OACA,OACVH,EAAQ,QAASF,EAAAF,EAAQ,SAAR,KAAAE,EAAkB,EACnCE,EAAQ,UAAYJ,EAAQ,UAC5BI,EAAQ,iBAAmB,CAAC,CAACJ,EAAQ,uBAOrC,MAAMY,EAASN,EAAO,YAAY,EAClC,OAAIM,IAAW,SACXN,EAAO,sBAAsB,WAAYF,CAAO,EAEhDQ,EAAO,OAAOR,CAAO,EAEzB,MAAM,IAAI,QAAeC,GACrB,sBAAsB,IAAM,sBAAsB,IAAMA,EAAI,CAAC,CAAC,CAClE,EACAD,EAAQ,KAAO,GACfA,EAAQ,QAAU,IAAM,CACpBA,EAAQ,iBAAiB,YAAa,IAAM,CACnCI,IACDC,EAAe,EACfD,EAAW,IAEf,sBAAsB,IAAM,CACxBJ,EAAQ,OAAO,CACnB,CAAC,CACL,CAAC,EACDA,EAAQ,KAAO,GACfA,EAAQ,QAAUhB,CACtB,EACOgB,EAAQ,OACnB,CAEA,OAAOA,CACX,CACJ",
5
+ "mappings": "aAWA,OAAS,QAAAA,EAAM,eAAAC,MAAmB,mBAClC,OAAS,iBAAAC,MAAqB,qBAC9B,OAAS,kBAAAC,MAAsB,sBAC/B,OAAS,oBAAAC,MAAwB,wBAIjC,OAAS,oBAAAC,MAAwB,kCAEjC,MAAMC,EAAkB,gBAAiB,SAAS,cAAc,KAAK,EAErE,IAAIC,EAAkBL,EAAcD,CAAW,EAC3CK,EACAC,EAAkBJ,EAAeI,CAAe,EAEhDA,EAAkBH,EAAiBG,CAAe,EAkB/C,aAAM,gBAAgBA,CAAgB,CACzC,OAAc,QAAe,CACzB,MAAMC,EAAqB,IAAI,YAAY,qBAAsB,CAC7D,QAAS,GACT,SAAU,GACV,WAAY,EAChB,CAAC,EACD,SAAS,cAAcA,CAAkB,CAC7C,CAYA,aAAoB,KAChBC,EACAC,EACAC,EACAC,EAC+B,CArEvC,IAAAC,EAAAC,EAsEQ,MAAMC,EAAK,UAAU,SAAW,EAC1BC,EAAU,IAAI,QACpB,GAAID,EAAI,CACJ,MAAMJ,EAAUF,EACVG,EAAUF,EAChB,OAAAM,EAAQ,OAAOL,CAAO,EACtBK,EAAQ,eAAiBJ,EAAQ,SAAW,KAC5CI,EAAQ,KAAOJ,EAAQ,MAAQ,QAC/BI,EAAQ,OAASJ,EAAQ,QAAU,EACnCI,EAAQ,UAAYJ,EAAQ,UAC5B,MAAM,IAAI,QAAeK,GACrB,sBAAsB,IAAMA,EAAI,CAAC,CACrC,EAEAD,EAAQ,KAAO,GACRA,UACAL,GAAWC,EAAS,CAC3B,MAAMM,EAAST,EACTU,EAAcT,EACpB,IAAIU,EAAW,GACf,MAAMC,EAAiBhB,EAAiB,CAACM,CAAO,EAAGK,EAAS,CACxD,SAAU,YACV,gBAAkBM,GAAO,CACrB,MAAMC,EAAOD,EAAG,KAChB,MAAO,IAAM,CACTA,EAAG,KAAOC,CACd,CACJ,CACJ,CAAC,EACDP,EAAQ,eAAgBH,EAAAD,EAAQ,gBAAR,KAAAC,EAAyB,OACjDG,EAAQ,eAAiBJ,EAAQ,gBAAkBM,EACnDF,EAAQ,KACJG,IAAgB,QACV,QACAA,IAAgB,QAChB,OACA,OACVH,EAAQ,QAASF,EAAAF,EAAQ,SAAR,KAAAE,EAAkB,EACnCE,EAAQ,UAAYJ,EAAQ,UAC5BI,EAAQ,iBAAmB,CAAC,CAACJ,EAAQ,uBAOrC,MAAMY,EAASN,EAAO,YAAY,EAClC,OAAIM,IAAW,SACXN,EAAO,sBAAsB,WAAYF,CAAO,EAEhDQ,EAAO,OAAOR,CAAO,EAEzB,MAAM,IAAI,QAAeC,GACrB,sBAAsB,IAAM,sBAAsB,IAAMA,EAAI,CAAC,CAAC,CAClE,EACAD,EAAQ,KAAO,GACfA,EAAQ,QAAU,IAAM,CACpBA,EAAQ,iBAAiB,YAAa,IAAM,CACnCI,IACDC,EAAe,EACfD,EAAW,IAEf,sBAAsB,IAAM,CACxBJ,EAAQ,OAAO,CACnB,CAAC,CACL,CAAC,EACDA,EAAQ,KAAO,GACfA,EAAQ,QAAUhB,CACtB,EACOgB,EAAQ,QAGnB,OAAOA,CACX,CACJ",
6
6
  "names": ["noop", "OverlayBase", "OverlayDialog", "OverlayPopover", "OverlayNoPopover", "reparentChildren", "supportsPopover", "OverlayFeatures", "overlayUpdateEvent", "targetOrContent", "interactionOrOptions", "content", "options", "_a", "_b", "v2", "overlay", "res", "target", "interaction", "restored", "restoreContent", "el", "slot", "parent"]
7
7
  }
@@ -48,6 +48,7 @@ export declare class OverlayBase extends SpectrumElement {
48
48
  protected dispose: () => void;
49
49
  elements: OpenableElement[];
50
50
  parentOverlayToForceClose?: OverlayBase;
51
+ private get hasNonVirtualTrigger();
51
52
  protected longpressed: boolean;
52
53
  private longressTimeout;
53
54
  offset: number | [number, number];
@@ -59,6 +60,7 @@ export declare class OverlayBase extends SpectrumElement {
59
60
  placement?: Placement;
60
61
  receivesFocus: 'true' | 'false' | 'auto';
61
62
  private releaseAriaDescribedby;
63
+ private releaseLongpressDescribedby;
62
64
  slotEl: HTMLSlotElement;
63
65
  trigger?: string;
64
66
  triggerElement: HTMLElement | VirtualTrigger | null;
@@ -73,8 +75,14 @@ export declare class OverlayBase extends SpectrumElement {
73
75
  protected get requiresPosition(): boolean;
74
76
  protected managePosition(): void;
75
77
  protected manageOpen(oldOpen: boolean): Promise<void>;
78
+ protected unbindEvents(triggerElement: HTMLElement): void;
79
+ protected bindEvents(): void;
80
+ protected bundClickEvents(triggerElement: HTMLElement): void;
81
+ protected bindLongpressEvents(triggerElement: HTMLElement): void;
82
+ protected bindHoverEvents(triggerElement: HTMLElement): void;
76
83
  protected manageTriggerElement(triggerElement: HTMLElement | null): void;
77
84
  private elementIds;
85
+ private prepareLongpressDescription;
78
86
  private prepareAriaDescribedby;
79
87
  private handlePointerdown;
80
88
  private handlePointerup;
@@ -91,17 +99,19 @@ export declare class OverlayBase extends SpectrumElement {
91
99
  protected handlePointerenter: () => void;
92
100
  protected handlePointerleave: (event: PointerEvent) => void;
93
101
  protected handleOverlayPointerleave: (event: PointerEvent) => void;
94
- protected doDointerleave(): void;
102
+ protected doPointerleave(): void;
95
103
  protected handleLongpress: () => void;
96
104
  protected handleBeforetoggle(event: Event & {
97
105
  newState: string;
98
106
  }): void;
99
107
  protected handlePopoverhide(): void;
100
108
  protected handlePopovershow(): void;
109
+ protected handleSlotchange(): void;
101
110
  willPreventClose: boolean;
102
111
  shouldPreventClose(): boolean;
103
112
  willUpdate(changes: PropertyValues): void;
104
113
  protected updated(changes: PropertyValues): void;
105
114
  render(): TemplateResult;
106
115
  connectedCallback(): void;
116
+ disconnectedCallback(): void;
107
117
  }
@@ -20,6 +20,10 @@ import {
20
20
  queryAssignedElements,
21
21
  state
22
22
  } from "@spectrum-web-components/base/src/decorators.js";
23
+ import {
24
+ isAndroid,
25
+ isIOS
26
+ } from "@spectrum-web-components/shared/src/platform.js";
23
27
  import { conditionAttributeWithId } from "@spectrum-web-components/base/src/condition-attribute-with-id.js";
24
28
  import {
25
29
  ElementResolutionController,
@@ -107,6 +111,7 @@ const _OverlayBase = class extends SpectrumElement {
107
111
  this._open = false;
108
112
  this.receivesFocus = "auto";
109
113
  this.releaseAriaDescribedby = noop;
114
+ this.releaseLongpressDescribedby = noop;
110
115
  this.triggerElement = null;
111
116
  this.type = "hint";
112
117
  this.wasOpen = false;
@@ -201,19 +206,25 @@ const _OverlayBase = class extends SpectrumElement {
201
206
  this.pointerentered = true;
202
207
  };
203
208
  this.handlePointerleave = (event) => {
204
- if (this === event.relatedTarget || this.contains(event.relatedTarget)) {
209
+ if (this === event.relatedTarget || this.contains(event.relatedTarget) || [...this.children].find((child) => {
210
+ if (child.localName !== "slot") {
211
+ return false;
212
+ }
213
+ return child.assignedElements({ flatten: true }).find((el) => {
214
+ return el === event.relatedTarget || el.contains(event.relatedTarget);
215
+ });
216
+ })) {
205
217
  return;
206
218
  }
207
- this.doDointerleave();
219
+ this.doPointerleave();
208
220
  };
209
221
  this.handleOverlayPointerleave = (event) => {
210
- const hasNonVirtualTrigger = this.triggerElement && this.triggerElement instanceof VirtualTrigger;
211
- if (this.triggerElement === event.relatedTarget || hasNonVirtualTrigger && this.triggerElement.contains(
222
+ if (this.triggerElement === event.relatedTarget || this.hasNonVirtualTrigger && this.triggerElement.contains(
212
223
  event.relatedTarget
213
224
  )) {
214
225
  return;
215
226
  }
216
- this.doDointerleave();
227
+ this.doPointerleave();
217
228
  };
218
229
  this.handleLongpress = () => {
219
230
  this.open = true;
@@ -234,6 +245,9 @@ const _OverlayBase = class extends SpectrumElement {
234
245
  this.wasOpen = false;
235
246
  }
236
247
  }
248
+ get hasNonVirtualTrigger() {
249
+ return !!this.triggerElement && !(this.triggerElement instanceof VirtualTrigger);
250
+ }
237
251
  get open() {
238
252
  return this._open;
239
253
  }
@@ -296,7 +310,7 @@ const _OverlayBase = class extends SpectrumElement {
296
310
  }
297
311
  async manageOpen(oldOpen) {
298
312
  var _a;
299
- if (!this.isConnected)
313
+ if (!this.isConnected && this.open)
300
314
  return;
301
315
  if (!this.hasUpdated) {
302
316
  await this.updateComplete;
@@ -340,92 +354,112 @@ const _OverlayBase = class extends SpectrumElement {
340
354
  }
341
355
  }
342
356
  }
343
- manageTriggerElement(triggerElement) {
344
- if (triggerElement) {
345
- triggerElement.removeEventListener("click", this.handleClick);
346
- triggerElement.removeEventListener("focusin", this.handleFocusin);
347
- triggerElement.removeEventListener("focusout", this.handleFocusout);
348
- triggerElement.removeEventListener(
349
- "pointerenter",
350
- this.handlePointerenter
351
- );
352
- triggerElement.removeEventListener(
353
- "pointerleave",
354
- this.handlePointerleave
355
- );
356
- this.removeEventListener(
357
- "pointerleave",
358
- this.handleOverlayPointerleave
359
- );
360
- triggerElement.addEventListener(
361
- "pointerdown",
362
- this.handlePointerdown
363
- );
364
- triggerElement.removeEventListener("keydown", this.handleKeydown);
365
- triggerElement.removeEventListener("keyup", this.handleKeyup);
366
- triggerElement.removeEventListener(
367
- "longpress",
368
- this.handleLongpress
369
- );
370
- this.releaseAriaDescribedby();
371
- }
372
- if (!this.triggerElement || !!this.triggerElement.updateBoundingClientRect)
373
- return;
357
+ unbindEvents(triggerElement) {
358
+ triggerElement.removeEventListener("click", this.handleClick);
359
+ triggerElement.removeEventListener("focusin", this.handleFocusin);
360
+ triggerElement.removeEventListener("focusout", this.handleFocusout);
361
+ triggerElement.removeEventListener(
362
+ "pointerenter",
363
+ this.handlePointerenter
364
+ );
365
+ triggerElement.removeEventListener(
366
+ "pointerleave",
367
+ this.handlePointerleave
368
+ );
369
+ this.removeEventListener(
370
+ "pointerleave",
371
+ this.handleOverlayPointerleave
372
+ );
373
+ triggerElement.addEventListener("pointerdown", this.handlePointerdown);
374
+ triggerElement.removeEventListener("keydown", this.handleKeydown);
375
+ triggerElement.removeEventListener("keyup", this.handleKeyup);
376
+ triggerElement.removeEventListener("longpress", this.handleLongpress);
377
+ }
378
+ bindEvents() {
374
379
  const nextTriggerElement = this.triggerElement;
375
380
  switch (this.triggerInteraction) {
376
381
  case "click":
377
- nextTriggerElement.addEventListener("click", this.handleClick);
382
+ this.bundClickEvents(nextTriggerElement);
378
383
  return;
379
384
  case "longpress":
380
- nextTriggerElement.addEventListener(
381
- "pointerdown",
382
- this.handlePointerdown
383
- );
384
- nextTriggerElement.addEventListener(
385
- "keydown",
386
- this.handleKeydown
387
- );
388
- nextTriggerElement.addEventListener("keyup", this.handleKeyup);
389
- nextTriggerElement.addEventListener(
390
- "longpress",
391
- this.handleLongpress
392
- );
385
+ this.bindLongpressEvents(nextTriggerElement);
393
386
  return;
394
387
  case "hover":
395
- nextTriggerElement.addEventListener(
396
- "focusin",
397
- this.handleFocusin
398
- );
399
- nextTriggerElement.addEventListener(
400
- "focusout",
401
- this.handleFocusout
402
- );
403
- nextTriggerElement.addEventListener(
404
- "pointerenter",
405
- this.handlePointerenter
406
- );
407
- nextTriggerElement.addEventListener(
408
- "pointerleave",
409
- this.handlePointerleave
410
- );
411
- this.addEventListener(
412
- "pointerleave",
413
- this.handleOverlayPointerleave
414
- );
415
- if (this.receivesFocus === "true")
416
- return;
417
- this.prepareAriaDescribedby(nextTriggerElement);
388
+ this.bindHoverEvents(nextTriggerElement);
418
389
  return;
419
390
  }
420
391
  }
392
+ bundClickEvents(triggerElement) {
393
+ triggerElement.addEventListener("click", this.handleClick);
394
+ }
395
+ bindLongpressEvents(triggerElement) {
396
+ triggerElement.addEventListener("pointerdown", this.handlePointerdown);
397
+ triggerElement.addEventListener("keydown", this.handleKeydown);
398
+ triggerElement.addEventListener("keyup", this.handleKeyup);
399
+ triggerElement.addEventListener("longpress", this.handleLongpress);
400
+ this.prepareLongpressDescription(triggerElement);
401
+ }
402
+ bindHoverEvents(triggerElement) {
403
+ triggerElement.addEventListener("focusin", this.handleFocusin);
404
+ triggerElement.addEventListener("focusout", this.handleFocusout);
405
+ triggerElement.addEventListener(
406
+ "pointerenter",
407
+ this.handlePointerenter
408
+ );
409
+ triggerElement.addEventListener(
410
+ "pointerleave",
411
+ this.handlePointerleave
412
+ );
413
+ this.addEventListener("pointerleave", this.handleOverlayPointerleave);
414
+ if (this.receivesFocus === "true")
415
+ return;
416
+ this.prepareAriaDescribedby(triggerElement);
417
+ }
418
+ manageTriggerElement(triggerElement) {
419
+ if (triggerElement) {
420
+ this.unbindEvents(triggerElement);
421
+ this.releaseAriaDescribedby();
422
+ }
423
+ if (!this.triggerElement || !!this.triggerElement.updateBoundingClientRect) {
424
+ return;
425
+ }
426
+ this.bindEvents();
427
+ }
428
+ prepareLongpressDescription(trigger) {
429
+ if (
430
+ // only "longpress" relationships are described this way
431
+ this.triggerInteraction !== "longpress" || // do not reapply until target it recycled
432
+ this.releaseLongpressDescribedby !== noop || // require "longpress content" to apply relationship
433
+ !this.elements.length
434
+ ) {
435
+ return;
436
+ }
437
+ const longpressDescription = document.createElement("div");
438
+ longpressDescription.id = `longpress-describedby-descriptor-${crypto.randomUUID().slice(0, 8)}`;
439
+ const messageType = isIOS() || isAndroid() ? "touch" : "keyboard";
440
+ longpressDescription.textContent = LONGPRESS_INSTRUCTIONS[messageType];
441
+ longpressDescription.slot = "longpress-describedby-descriptor";
442
+ trigger.insertAdjacentElement("afterend", longpressDescription);
443
+ const releaseLongpressDescribedby = conditionAttributeWithId(
444
+ trigger,
445
+ "aria-describedby",
446
+ [longpressDescription.id]
447
+ );
448
+ this.releaseLongpressDescribedby = () => {
449
+ releaseLongpressDescribedby();
450
+ longpressDescription.remove();
451
+ this.releaseLongpressDescribedby = noop;
452
+ };
453
+ }
421
454
  prepareAriaDescribedby(trigger) {
422
455
  if (
423
456
  // only "hover" relationships establed described by content
424
457
  this.triggerInteraction !== "hover" || // do not reapply until target is recycled
425
- this.releaseAriaDescribedby !== noop || // require " hover content" to apply relationship
458
+ this.releaseAriaDescribedby !== noop || // require "hover content" to apply relationship
426
459
  !this.elements.length
427
- )
460
+ ) {
428
461
  return;
462
+ }
429
463
  const triggerRoot = trigger.getRootNode();
430
464
  const contentRoot = this.elements[0].getRootNode();
431
465
  const overlayRoot = this.getRootNode();
@@ -461,7 +495,7 @@ const _OverlayBase = class extends SpectrumElement {
461
495
  };
462
496
  }
463
497
  }
464
- doDointerleave() {
498
+ doPointerleave() {
465
499
  this.pointerentered = false;
466
500
  const triggerElement = this.triggerElement;
467
501
  if (this.focusedin && triggerElement.matches(":focus-visible"))
@@ -477,10 +511,20 @@ const _OverlayBase = class extends SpectrumElement {
477
511
  }
478
512
  handlePopoverhide() {
479
513
  this.open = false;
480
- this.dispatchEvent(new BeforetoggleClosedEvent());
481
514
  }
482
515
  handlePopovershow() {
483
- this.dispatchEvent(new BeforetoggleOpenEvent());
516
+ }
517
+ handleSlotchange() {
518
+ if (this.triggerElement) {
519
+ this.prepareAriaDescribedby(this.triggerElement);
520
+ }
521
+ if (!this.elements.length) {
522
+ this.releaseLongpressDescribedby();
523
+ } else if (this.hasNonVirtualTrigger) {
524
+ this.prepareLongpressDescription(
525
+ this.triggerElement
526
+ );
527
+ }
484
528
  }
485
529
  shouldPreventClose() {
486
530
  const shouldPreventClose = this.willPreventClose;
@@ -544,8 +588,8 @@ const _OverlayBase = class extends SpectrumElement {
544
588
  } else {
545
589
  this.dialogEl.removeAttribute("actual-placement");
546
590
  }
547
- if (typeof changes.get("placement") !== "undefined") {
548
- this.managePosition();
591
+ if (this.open && typeof changes.get("placement") !== "undefined") {
592
+ this.placementController.resetOverlayPosition();
549
593
  }
550
594
  }
551
595
  }
@@ -569,17 +613,10 @@ const _OverlayBase = class extends SpectrumElement {
569
613
  })}
570
614
  >
571
615
  <div part="content">
572
- <slot
573
- @slotchange=${() => {
574
- if (this.triggerElement) {
575
- this.prepareAriaDescribedby(
576
- this.triggerElement
577
- );
578
- }
579
- }}
580
- ></slot>
616
+ <slot @slotchange=${this.handleSlotchange}></slot>
581
617
  </div>
582
618
  </dialog>
619
+ <slot name="longpress-describedby-descriptor"></slot>
583
620
  `;
584
621
  }
585
622
  connectedCallback() {
@@ -587,6 +624,16 @@ const _OverlayBase = class extends SpectrumElement {
587
624
  this.addEventListener("close", () => {
588
625
  this.open = false;
589
626
  });
627
+ if (this.hasNonVirtualTrigger) {
628
+ this.bindEvents();
629
+ }
630
+ }
631
+ disconnectedCallback() {
632
+ if (this.hasNonVirtualTrigger) {
633
+ this.unbindEvents(this.triggerElement);
634
+ }
635
+ this.open = false;
636
+ super.disconnectedCallback();
590
637
  }
591
638
  };
592
639
  export let OverlayBase = _OverlayBase;
@@ -599,7 +646,10 @@ __decorateClass([
599
646
  property({ type: Boolean })
600
647
  ], OverlayBase.prototype, "disabled", 1);
601
648
  __decorateClass([
602
- queryAssignedElements({ flatten: true })
649
+ queryAssignedElements({
650
+ selector: ':not([slot="longpress-describedby-descriptor"])',
651
+ flatten: true
652
+ })
603
653
  ], OverlayBase.prototype, "elements", 2);
604
654
  __decorateClass([
605
655
  property()