@spectrum-web-components/overlay 0.19.3 → 0.19.4-overlay.22

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 (156) hide show
  1. package/package.json +50 -21
  2. package/sp-overlay.d.ts +6 -0
  3. package/sp-overlay.dev.js +4 -0
  4. package/{active-overlay.js.map → sp-overlay.dev.js.map} +4 -4
  5. package/sp-overlay.js +2 -0
  6. package/sp-overlay.js.map +7 -0
  7. package/src/Overlay.d.ts +22 -0
  8. package/src/Overlay.dev.js +68 -0
  9. package/src/Overlay.dev.js.map +7 -0
  10. package/src/Overlay.js +2 -0
  11. package/src/Overlay.js.map +7 -0
  12. package/src/OverlayBase.d.ts +97 -0
  13. package/src/OverlayBase.dev.js +572 -0
  14. package/src/OverlayBase.dev.js.map +7 -0
  15. package/src/OverlayBase.js +18 -0
  16. package/src/OverlayBase.js.map +7 -0
  17. package/src/OverlayDialog.d.ts +8 -0
  18. package/src/OverlayDialog.dev.js +43 -0
  19. package/src/OverlayDialog.dev.js.map +7 -0
  20. package/src/OverlayDialog.js +2 -0
  21. package/src/OverlayDialog.js.map +7 -0
  22. package/src/OverlayNoPopover.d.ts +8 -0
  23. package/src/OverlayNoPopover.dev.js +62 -0
  24. package/src/OverlayNoPopover.dev.js.map +7 -0
  25. package/src/OverlayNoPopover.js +2 -0
  26. package/src/OverlayNoPopover.js.map +7 -0
  27. package/src/OverlayPopover.d.ts +8 -0
  28. package/src/OverlayPopover.dev.js +81 -0
  29. package/src/OverlayPopover.dev.js.map +7 -0
  30. package/src/OverlayPopover.js +2 -0
  31. package/src/OverlayPopover.js.map +7 -0
  32. package/src/OverlayStack.d.ts +24 -0
  33. package/src/OverlayStack.dev.js +115 -0
  34. package/src/OverlayStack.dev.js.map +7 -0
  35. package/src/OverlayStack.js +2 -0
  36. package/src/OverlayStack.js.map +7 -0
  37. package/src/OverlayTrigger.d.ts +18 -31
  38. package/src/OverlayTrigger.dev.js +138 -246
  39. package/src/OverlayTrigger.dev.js.map +3 -3
  40. package/src/OverlayTrigger.js +54 -22
  41. package/src/OverlayTrigger.js.map +3 -3
  42. package/src/PlacementController.d.ts +35 -0
  43. package/src/PlacementController.dev.js +172 -0
  44. package/src/PlacementController.dev.js.map +7 -0
  45. package/src/PlacementController.js +2 -0
  46. package/src/PlacementController.js.map +7 -0
  47. package/src/VirtualTrigger.dev.js +0 -2
  48. package/src/VirtualTrigger.dev.js.map +2 -2
  49. package/src/VirtualTrigger.js +1 -1
  50. package/src/VirtualTrigger.js.map +3 -3
  51. package/src/fullSizePlugin.d.ts +12 -0
  52. package/src/fullSizePlugin.dev.js +39 -0
  53. package/src/fullSizePlugin.dev.js.map +7 -0
  54. package/src/fullSizePlugin.js +2 -0
  55. package/src/fullSizePlugin.js.map +7 -0
  56. package/src/index.d.ts +2 -3
  57. package/src/index.dev.js +2 -3
  58. package/src/index.dev.js.map +2 -2
  59. package/src/index.js +1 -1
  60. package/src/index.js.map +2 -2
  61. package/src/loader.d.ts +2 -2
  62. package/src/loader.dev.js +2 -19
  63. package/src/loader.dev.js.map +2 -2
  64. package/src/loader.js +1 -1
  65. package/src/loader.js.map +3 -3
  66. package/src/overlay-base.css.dev.js +9 -0
  67. package/src/overlay-base.css.dev.js.map +7 -0
  68. package/src/overlay-base.css.js +6 -0
  69. package/src/overlay-base.css.js.map +7 -0
  70. package/src/overlay-trigger.css.dev.js +1 -1
  71. package/src/overlay-trigger.css.dev.js.map +1 -1
  72. package/src/overlay-trigger.css.js +1 -1
  73. package/src/overlay-trigger.css.js.map +1 -1
  74. package/src/overlay-types.d.ts +3 -3
  75. package/src/overlay-types.dev.js +1 -0
  76. package/src/overlay-types.dev.js.map +3 -3
  77. package/src/overlay-types.js +1 -1
  78. package/src/overlay-types.js.map +3 -3
  79. package/src/placement.d.ts +21 -0
  80. package/src/placement.dev.js +111 -0
  81. package/src/placement.dev.js.map +7 -0
  82. package/src/placement.js +2 -0
  83. package/src/placement.js.map +7 -0
  84. package/src/topLayerOverTransforms.d.ts +22 -0
  85. package/src/topLayerOverTransforms.dev.js +161 -0
  86. package/src/topLayerOverTransforms.dev.js.map +7 -0
  87. package/src/topLayerOverTransforms.js +2 -0
  88. package/src/topLayerOverTransforms.js.map +7 -0
  89. package/stories/overlay-element.stories.js +229 -0
  90. package/stories/overlay-element.stories.js.map +7 -0
  91. package/stories/overlay-story-components.js +1 -6
  92. package/stories/overlay-story-components.js.map +2 -2
  93. package/stories/overlay.stories.js +683 -644
  94. package/stories/overlay.stories.js.map +2 -2
  95. package/sync/overlay-trigger.d.ts +4 -0
  96. package/sync/overlay-trigger.dev.js +1 -4
  97. package/sync/overlay-trigger.dev.js.map +2 -2
  98. package/sync/overlay-trigger.js +1 -1
  99. package/sync/overlay-trigger.js.map +3 -3
  100. package/test/benchmark/basic-test.js +1 -1
  101. package/test/benchmark/basic-test.js.map +1 -1
  102. package/test/index.js +3 -9
  103. package/test/index.js.map +2 -2
  104. package/test/overlay-element.test-vrt.js +5 -0
  105. package/{active-overlay.dev.js.map → test/overlay-element.test-vrt.js.map} +3 -3
  106. package/test/overlay-element.test.js +759 -0
  107. package/test/overlay-element.test.js.map +7 -0
  108. package/test/overlay-lifecycle.test.js +34 -74
  109. package/test/overlay-lifecycle.test.js.map +2 -2
  110. package/test/overlay-trigger-click.test.js +3 -2
  111. package/test/overlay-trigger-click.test.js.map +2 -2
  112. package/test/overlay-trigger-extended.test.js +1 -6
  113. package/test/overlay-trigger-extended.test.js.map +2 -2
  114. package/test/overlay-trigger-hover-click.test.js +1 -1
  115. package/test/overlay-trigger-hover-click.test.js.map +2 -2
  116. package/test/overlay-trigger-hover.test.js +2 -2
  117. package/test/overlay-trigger-hover.test.js.map +2 -2
  118. package/test/overlay-trigger-longpress.test.js +1 -377
  119. package/test/overlay-trigger-longpress.test.js.map +2 -2
  120. package/test/overlay-trigger-sync.test.js +1 -3
  121. package/test/overlay-trigger-sync.test.js.map +2 -2
  122. package/test/overlay-trigger.test.js +1 -3
  123. package/test/overlay-trigger.test.js.map +2 -2
  124. package/test/overlay-update.test.js +4 -4
  125. package/test/overlay-update.test.js.map +2 -2
  126. package/test/overlay.test.js +98 -146
  127. package/test/overlay.test.js.map +2 -2
  128. package/active-overlay.d.ts +0 -6
  129. package/active-overlay.dev.js +0 -4
  130. package/active-overlay.js +0 -2
  131. package/custom-elements.json +0 -1212
  132. package/src/ActiveOverlay.d.ts +0 -84
  133. package/src/ActiveOverlay.dev.js +0 -517
  134. package/src/ActiveOverlay.dev.js.map +0 -7
  135. package/src/ActiveOverlay.js +0 -16
  136. package/src/ActiveOverlay.js.map +0 -7
  137. package/src/active-overlay.css.dev.js +0 -13
  138. package/src/active-overlay.css.dev.js.map +0 -7
  139. package/src/active-overlay.css.js +0 -10
  140. package/src/active-overlay.css.js.map +0 -7
  141. package/src/overlay-stack.d.ts +0 -50
  142. package/src/overlay-stack.dev.js +0 -514
  143. package/src/overlay-stack.dev.js.map +0 -7
  144. package/src/overlay-stack.js +0 -33
  145. package/src/overlay-stack.js.map +0 -7
  146. package/src/overlay-utils.d.ts +0 -3
  147. package/src/overlay-utils.dev.js +0 -31
  148. package/src/overlay-utils.dev.js.map +0 -7
  149. package/src/overlay-utils.js +0 -2
  150. package/src/overlay-utils.js.map +0 -7
  151. package/src/overlay.d.ts +0 -59
  152. package/src/overlay.dev.js +0 -127
  153. package/src/overlay.dev.js.map +0 -7
  154. package/src/overlay.js +0 -2
  155. package/src/overlay.js.map +0 -7
  156. /package/src/{active-overlay.css.d.ts → overlay-base.css.d.ts} +0 -0
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["OverlayBase.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 { Placement } from '@floating-ui/dom';\nimport {\n html,\n PropertyValues,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n query,\n queryAssignedElements,\n state,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { conditionAttributeWithId } from '@spectrum-web-components/base/src/condition-attribute-with-id.js';\nimport {\n ElementResolutionController,\n elementResolverUpdatedSymbol,\n} from '@spectrum-web-components/reactive-controllers/src/ElementResolution.js';\nimport type { VirtualTrigger } from './VirtualTrigger.js';\nimport {\n ifDefined,\n styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport styles from './overlay-base.css.js';\nimport { overlayStack } from './OverlayStack.js';\nimport { PlacementController } from './PlacementController.js';\n\nexport type OpenableElement = HTMLElement & {\n open: boolean;\n tipElement?: HTMLElement;\n updateComplete?: Promise<void>;\n};\n\nexport type OverlayTypes = 'auto' | 'hint' | 'manual' | 'modal' | 'page';\n\nconst LONGPRESS_DURATION = 300;\n\nexport type LongpressEvent = {\n source: 'pointer' | 'keyboard';\n};\n\nexport const LONGPRESS_INSTRUCTIONS = {\n touch: 'Double tap and long press for additional options',\n keyboard: 'Press Space or Alt+Down Arrow for additional options',\n mouse: 'Click and hold for additional options',\n};\n\nexport class BeforetoggleClosedEvent extends Event {\n currentState = 'open';\n newState = 'closed';\n constructor() {\n super('beforetoggle', {\n bubbles: false,\n composed: false,\n });\n }\n}\n\nexport class BeforetoggleOpenEvent extends Event {\n currentState = 'closed';\n newState = 'open';\n constructor() {\n super('beforetoggle', {\n bubbles: false,\n composed: false,\n });\n }\n}\n\nexport const noop = (): void => {\n return;\n};\n\nexport class OverlayBase extends SpectrumElement {\n static override styles = [styles];\n\n @query('dialog')\n dialogEl!: HTMLDialogElement & {\n showPopover(): void;\n hidePopover(): void;\n };\n\n @property({ type: Boolean })\n get disabled(): boolean {\n return this._disabled;\n }\n\n set disabled(disabled: boolean) {\n this._disabled = disabled;\n if (disabled) {\n this.wasOpen = this.open;\n this.open = false;\n } else {\n this.open = this.open || this.wasOpen;\n this.wasOpen = false;\n }\n }\n\n private _disabled = false;\n\n protected dispose = noop;\n\n @queryAssignedElements({ flatten: true })\n elements!: OpenableElement[];\n\n public parentOverlayToForceClose?: OverlayBase;\n\n protected longpressed = false;\n\n private longressTimeout!: ReturnType<typeof setTimeout>;\n\n @property()\n offset: number | [number, number] = 6;\n\n public placementController = new PlacementController(this);\n\n @property({ type: Boolean, reflect: true })\n get open(): boolean {\n return this._open;\n }\n\n set open(open: boolean) {\n if (open && this.disabled) return;\n if (open === this.open) return;\n this._open = open;\n this.requestUpdate('open', !this.open);\n }\n\n private _open = false;\n\n static openCount = 1;\n\n @property()\n placement?: Placement;\n\n @property({ attribute: 'receives-focus' })\n receivesFocus: 'true' | 'false' | 'auto' = 'auto';\n\n private releaseAriaDescribedby = noop;\n\n @query('slot')\n slotEl!: HTMLSlotElement;\n\n @property()\n trigger?: string;\n\n @state()\n triggerElement: HTMLElement | VirtualTrigger | null = null;\n\n @state()\n triggerInteraction?: 'click' | 'longpress' | 'hover';\n\n @property()\n type: OverlayTypes = 'hint';\n\n protected wasOpen = false;\n\n private elementResolver = new ElementResolutionController(this);\n\n private get usesDialog(): boolean {\n return this.type === 'modal' || this.type === 'page';\n }\n\n private get popoverValue(): 'auto' | 'manual' | undefined {\n switch (this.type) {\n case 'modal':\n case 'page':\n return undefined;\n case 'hint':\n return 'manual';\n default:\n return this.type;\n }\n }\n\n protected manageChildren(open: boolean): void {\n const eventName = open ? 'sp-opened' : 'sp-closed';\n let announced = false;\n this.elements.forEach((el) => {\n if (typeof el.open !== 'undefined') {\n el.open = open;\n el.dispatchEvent(\n new Event(eventName, {\n bubbles: false,\n composed: false,\n })\n );\n }\n if (!announced) {\n this.dispatchEvent(\n new Event(eventName, {\n bubbles: true,\n composed: true,\n })\n );\n announced = true;\n }\n });\n }\n\n protected async manageDialogOpen(): Promise<void> {\n console.warn(\n 'Implement the `manageDialogOpen` method in a class extension.'\n );\n }\n\n protected async managePopoverOpen(): Promise<void> {\n console.warn(\n 'Implement the `managePopoverOpen` method in a class extension.'\n );\n }\n\n protected get requiresPosition(): boolean {\n // Do no position \"page\" overlays as they should block the entrie UI.\n if (this.type === 'page' || !this.open) return false;\n // Do not position content without a trigger element, what would you position it in relation to?\n // Do not automaticallyu position contnent, unless it is a \"hint\".\n if (!this.triggerElement || (!this.placement && this.type !== 'hint'))\n return false;\n return true;\n }\n\n protected managePosition(): void {\n if (!this.requiresPosition) return;\n\n const offset = this.offset || 0;\n const trigger = this.triggerElement as HTMLElement;\n const placement = (this.placement as Placement) || 'right';\n\n this.placementController.placeOverlay(this.dialogEl, {\n // delayed?: boolean,\n offset,\n placement,\n // notImmediatelyClosable?: boolean, // rename or place behind other API options\n // receivesFocus?: 'auto';\n // root?: HTMLElement;\n trigger,\n type: this.type,\n });\n }\n\n protected async manageOpen(): Promise<void> {\n if (!this.isConnected) return;\n\n if (!this.hasUpdated) {\n await this.updateComplete;\n }\n\n if (this.open) {\n overlayStack.add(this);\n } else {\n this.dispose();\n overlayStack.remove(this);\n }\n\n if (this.usesDialog) {\n this.manageDialogOpen();\n } else {\n this.managePopoverOpen();\n }\n if (this.open) {\n OverlayBase.openCount += 1;\n // this.manageChildren(this.open);\n // this.managePosition();\n } else {\n // If the focus remains inside of the overlay or\n // a slotted descendent of the overlay you need to return\n // focus back to the trigger.\n const getAncestors = (): HTMLElement[] => {\n const ancestors: HTMLElement[] = [];\n // eslint-disable-next-line @spectrum-web-components/document-active-element\n let currentNode = document.activeElement;\n while (\n currentNode?.shadowRoot &&\n currentNode.shadowRoot.activeElement\n ) {\n currentNode = currentNode.shadowRoot.activeElement;\n }\n while (currentNode) {\n const ancestor =\n currentNode.assignedSlot ||\n currentNode.parentElement ||\n (currentNode.getRootNode() as ShadowRoot)?.host;\n if (ancestor) {\n ancestors.push(ancestor as HTMLElement);\n }\n currentNode = ancestor;\n }\n return ancestors;\n };\n if (\n (this.triggerElement as HTMLElement)?.focus &&\n (this.contains(\n (this.getRootNode() as Document).activeElement\n ) ||\n !!getAncestors().find((el) => el === this))\n ) {\n (this.triggerElement as HTMLElement).focus();\n }\n }\n }\n\n protected manageTriggerElement(triggerElement: HTMLElement | null): void {\n if (triggerElement) {\n triggerElement.removeEventListener('click', this.handleClick);\n triggerElement.removeEventListener('focusin', this.handleFocusin);\n triggerElement.removeEventListener('focusout', this.handleFocusout);\n triggerElement.removeEventListener(\n 'pointerenter',\n this.handlePointerenter\n );\n triggerElement.removeEventListener(\n 'pointerleave',\n this.handlePointerleave\n );\n triggerElement.addEventListener(\n 'pointerdown',\n this.handlePointerdown\n );\n triggerElement.removeEventListener('keydown', this.handleKeydown);\n triggerElement.removeEventListener('keyup', this.handleKeyup);\n triggerElement.removeEventListener(\n 'longpress',\n this.handleLongpress\n );\n this.releaseAriaDescribedby();\n }\n if (\n !this.triggerElement ||\n !!(this.triggerElement as VirtualTrigger).updateBoundingClientRect\n )\n return;\n const nextTriggerElement = this.triggerElement as HTMLElement;\n switch (this.triggerInteraction) {\n case 'click':\n nextTriggerElement.addEventListener('click', this.handleClick);\n return;\n case 'longpress':\n nextTriggerElement.addEventListener(\n 'pointerdown',\n this.handlePointerdown\n );\n nextTriggerElement.addEventListener(\n 'keydown',\n this.handleKeydown\n );\n nextTriggerElement.addEventListener('keyup', this.handleKeyup);\n nextTriggerElement.addEventListener(\n 'longpress',\n this.handleLongpress\n );\n return;\n case 'hover':\n nextTriggerElement.addEventListener(\n 'focusin',\n this.handleFocusin\n );\n nextTriggerElement.addEventListener(\n 'focusout',\n this.handleFocusout\n );\n nextTriggerElement.addEventListener(\n 'pointerenter',\n this.handlePointerenter\n );\n nextTriggerElement.addEventListener(\n 'pointerleave',\n this.handlePointerleave\n );\n if (this.receivesFocus === 'true') return;\n\n this.prepareAriaDescribedby(nextTriggerElement);\n return;\n }\n }\n\n private elementIds: string[] = [];\n\n private prepareAriaDescribedby(trigger: HTMLElement): void {\n if (\n // only \"hover\" relationships establed described by content\n this.triggerInteraction !== 'hover' ||\n // do not reapply until target is recycled\n this.releaseAriaDescribedby !== noop ||\n // require \" hover content\" to apply relationship\n !this.elements.length\n )\n return;\n\n const triggerRoot = trigger.getRootNode();\n const contentRoot = this.elements[0].getRootNode();\n const overlayRoot = this.getRootNode();\n if (triggerRoot == overlayRoot) {\n const releaseAriaDescribedby = conditionAttributeWithId(\n trigger,\n 'aria-describedby',\n [this.id]\n );\n this.releaseAriaDescribedby = () => {\n releaseAriaDescribedby();\n this.releaseAriaDescribedby = noop;\n };\n } else if (triggerRoot === contentRoot) {\n this.elementIds = this.elements.map((el) => el.id);\n const appliedIds = this.elements.map((el) => {\n if (!el.id) {\n el.id = `${this.tagName.toLowerCase()}-helper-${crypto\n .randomUUID()\n .slice(0, 8)}`;\n }\n return el.id;\n });\n const releaseAriaDescribedby = conditionAttributeWithId(\n trigger,\n 'aria-describedby',\n appliedIds\n );\n this.releaseAriaDescribedby = () => {\n releaseAriaDescribedby();\n this.elements.map((el, index) => {\n el.id = this.elementIds[index];\n });\n this.releaseAriaDescribedby = noop;\n };\n }\n }\n\n private handlePointerdown = (event: PointerEvent): void => {\n if (!this.triggerElement) return;\n if (event.button !== 0) return;\n const triggerElement = this.triggerElement as HTMLElement;\n this.longpressed = false;\n triggerElement.addEventListener('pointerup', this.handlePointerup);\n triggerElement.addEventListener('pointercancel', this.handlePointerup);\n this.longressTimeout = setTimeout(() => {\n if (!triggerElement) return;\n triggerElement.dispatchEvent(\n new CustomEvent<LongpressEvent>('longpress', {\n bubbles: true,\n composed: true,\n detail: {\n source: 'pointer',\n },\n })\n );\n }, LONGPRESS_DURATION);\n };\n\n private handlePointerup = (): void => {\n clearTimeout(this.longressTimeout);\n if (!this.triggerElement) return;\n if (this.longpressed) {\n this.open = true;\n }\n setTimeout(() => {\n this.longpressed = false;\n });\n const triggerElement = this.triggerElement as HTMLElement;\n triggerElement.removeEventListener('pointerup', this.handlePointerup);\n triggerElement.removeEventListener(\n 'pointercancel',\n this.handlePointerup\n );\n };\n\n /**\n * @private\n */\n protected handleKeydown = (event: KeyboardEvent): void => {\n const { code, altKey } = event;\n if (code === 'Space' || (altKey && code === 'ArrowDown')) {\n if (code === 'ArrowDown') {\n event.stopPropagation();\n event.stopImmediatePropagation();\n }\n }\n };\n\n protected handleKeyup = (event: KeyboardEvent): void => {\n const { code, altKey } = event;\n if (code === 'Space' || (altKey && code === 'ArrowDown')) {\n event.stopPropagation();\n this.dispatchEvent(\n new CustomEvent<LongpressEvent>('longpress', {\n bubbles: true,\n composed: true,\n detail: {\n source: 'keyboard',\n },\n })\n );\n }\n };\n\n protected handleClick = (): void => {\n if (this.longpressed) return;\n this.open = !this.open;\n };\n\n private focusedin = false;\n\n protected handleFocusin = (): void => {\n this.open = true;\n this.focusedin = true;\n };\n\n protected handleFocusout = (): void => {\n this.focusedin = false;\n if (this.pointerentered) return;\n this.open = false;\n };\n\n private pointerentered = false;\n\n protected handlePointerenter = (): void => {\n this.open = true;\n this.pointerentered = true;\n };\n\n protected handlePointerleave = (): void => {\n this.pointerentered = false;\n const triggerElement = this.triggerElement as HTMLElement;\n if (this.focusedin && triggerElement.matches(':focus-visible')) return;\n this.open = false;\n };\n\n protected handleLongpress = (): void => {\n this.open = true;\n this.longpressed = true;\n };\n\n protected handleBeforetoggle({\n newState: open,\n }: Event & { newState: string }): void {\n if (open === 'open') {\n this.handlePopovershow();\n } else {\n this.handlePopoverhide();\n }\n }\n\n protected handlePopoverhide(): void {\n this.open = false;\n this.dispatchEvent(new BeforetoggleClosedEvent());\n // const triggerElement = this.triggerElement as HTMLElement;\n // if (this.triggerInteraction === 'click') {\n // requestAnimationFrame(() => {\n // triggerElement.addEventListener('click', this.handleClick);\n // });\n // }\n }\n\n protected handlePopovershow(): void {\n this.dispatchEvent(new BeforetoggleOpenEvent());\n }\n\n public willPreventClose = false;\n\n public shouldPreventClose(): boolean {\n const shouldPreventClose = this.willPreventClose;\n this.willPreventClose = false;\n return shouldPreventClose;\n }\n\n override willUpdate(changes: PropertyValues): void {\n if (!this.hasAttribute('id')) {\n this.setAttribute(\n 'id',\n `${this.tagName.toLowerCase()}-${crypto\n .randomUUID()\n .slice(0, 8)}`\n );\n }\n if (\n changes.has('open') &&\n (typeof changes.get('open') !== 'undefined' || this.open)\n ) {\n this.manageOpen();\n }\n if (changes.has('trigger')) {\n const [id, interaction] = this.trigger?.split('@') || [];\n this.elementResolver.selector = id ? `#${id}` : '';\n this.triggerInteraction = interaction as\n | 'click'\n | 'longpress'\n | 'hover'\n | undefined;\n }\n const oldTrigger = this.triggerElement as HTMLElement;\n if (changes.has(elementResolverUpdatedSymbol)) {\n this.triggerElement = this.elementResolver.element;\n this.manageTriggerElement(oldTrigger);\n }\n if (changes.has('triggerElement')) {\n this.manageTriggerElement(changes.get('triggerElement'));\n }\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('placement')) {\n if (this.placement) {\n this.dialogEl.setAttribute('actual-placement', this.placement);\n } else {\n this.dialogEl.removeAttribute('actual-placement');\n }\n if (typeof changes.get('placement') !== 'undefined') {\n this.managePosition();\n }\n }\n }\n\n public override render(): TemplateResult {\n const hasPopoverAttribute = 'popover' in this;\n const popoverValue = hasPopoverAttribute\n ? this.popoverValue\n : undefined;\n return html`\n <dialog\n part=\"dialog\"\n popover=${ifDefined(popoverValue)}\n @close=${() => {\n this.open = false;\n }}\n @cancel=${() => {\n this.open = false;\n }}\n @beforetoggle=${this.handleBeforetoggle}\n @popovershow=${this.handlePopovershow}\n style=${styleMap({\n '--swc-overlay-z-index': OverlayBase.openCount.toString(),\n })}\n >\n <div part=\"content\">\n <slot\n @slotchange=${() => {\n if (this.triggerElement) {\n this.prepareAriaDescribedby(\n this.triggerElement as HTMLElement\n );\n }\n }}\n ></slot>\n </div>\n </dialog>\n `;\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n // this.manageOpen();\n this.addEventListener('close', () => {\n this.open = false;\n });\n }\n}\n"],
5
+ "mappings": "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",
6
+ "names": ["html", "SpectrumElement", "property", "query", "queryAssignedElements", "state", "conditionAttributeWithId", "ElementResolutionController", "elementResolverUpdatedSymbol", "ifDefined", "styleMap", "styles", "overlayStack", "PlacementController", "LONGPRESS_DURATION", "_OverlayBase", "event", "triggerElement", "code", "altKey", "disabled", "open", "eventName", "announced", "el", "offset", "trigger", "placement", "_a", "getAncestors", "ancestors", "currentNode", "ancestor", "nextTriggerElement", "triggerRoot", "contentRoot", "overlayRoot", "releaseAriaDescribedby", "appliedIds", "index", "shouldPreventClose", "changes", "id", "interaction", "oldTrigger", "popoverValue", "__decorateClass"]
7
+ }
@@ -0,0 +1,8 @@
1
+ import { ReactiveElement } from 'lit';
2
+ import { OverlayBase } from './OverlayBase.js';
3
+ declare type Constructor<T = Record<string, unknown>> = {
4
+ new (...args: any[]): T;
5
+ prototype: T;
6
+ };
7
+ export declare function OverlayDialog<T extends Constructor<OverlayBase>>(constructor: T): T & Constructor<ReactiveElement>;
8
+ export {};
@@ -0,0 +1,43 @@
1
+ "use strict";
2
+ export function OverlayDialog(constructor) {
3
+ class OverlayWithDialog extends constructor {
4
+ async manageDialogOpen() {
5
+ if (this.open) {
6
+ await this.managePosition();
7
+ requestAnimationFrame(() => {
8
+ requestAnimationFrame(() => {
9
+ this.manageChildren(true);
10
+ requestAnimationFrame(() => {
11
+ if (this.isConnected && !this.dialogEl.open)
12
+ this.dialogEl.showModal();
13
+ });
14
+ });
15
+ });
16
+ } else {
17
+ let hasSelfManagedChild = false;
18
+ const close = (event) => {
19
+ var _a, _b;
20
+ (_a = event == null ? void 0 : event.target) == null ? void 0 : _a.removeEventListener("transitionend", close);
21
+ (_b = event == null ? void 0 : event.target) == null ? void 0 : _b.removeEventListener("close", close);
22
+ this.dialogEl.close();
23
+ this.manageChildren(false);
24
+ };
25
+ this.elements.forEach((element) => {
26
+ if (typeof element.open !== "undefined") {
27
+ if (element.open) {
28
+ element.addEventListener("transitionend", close);
29
+ element.addEventListener("close", close);
30
+ hasSelfManagedChild = true;
31
+ element.open = false;
32
+ }
33
+ }
34
+ });
35
+ if (!hasSelfManagedChild) {
36
+ close();
37
+ }
38
+ }
39
+ }
40
+ }
41
+ return OverlayWithDialog;
42
+ }
43
+ //# sourceMappingURL=OverlayDialog.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["OverlayDialog.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 { ReactiveElement } from 'lit';\nimport { OpenableElement, OverlayBase } from './OverlayBase.dev.js'\n\ntype Constructor<T = Record<string, unknown>> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: T;\n};\n\nexport function OverlayDialog<T extends Constructor<OverlayBase>>(\n constructor: T\n): T & Constructor<ReactiveElement> {\n class OverlayWithDialog extends constructor {\n protected override async manageDialogOpen(): Promise<void> {\n if (this.open) {\n await this.managePosition();\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n this.manageChildren(true);\n requestAnimationFrame(() => {\n // Ensure that child content is fully \"on the DOM\" before showing the modal.\n // This allow for that content to be available to the focus algorithm of that process.\n if (this.isConnected && !this.dialogEl.open)\n this.dialogEl.showModal();\n });\n });\n });\n } else {\n let hasSelfManagedChild = false;\n const close = (event?: Event): void => {\n event?.target?.removeEventListener('transitionend', close);\n event?.target?.removeEventListener('close', close);\n this.dialogEl.close();\n this.manageChildren(false);\n };\n this.elements.forEach((element: OpenableElement): void => {\n if (typeof element.open !== 'undefined') {\n if (element.open) {\n element.addEventListener('transitionend', close);\n element.addEventListener('close', close);\n hasSelfManagedChild = true;\n element.open = false;\n }\n }\n });\n if (!hasSelfManagedChild) {\n close();\n }\n }\n }\n }\n return OverlayWithDialog;\n}\n"],
5
+ "mappings": ";AAoBO,gBAAS,cACZ,aACgC;AAChC,QAAM,0BAA0B,YAAY;AAAA,IACxC,MAAyB,mBAAkC;AACvD,UAAI,KAAK,MAAM;AACX,cAAM,KAAK,eAAe;AAC1B,8BAAsB,MAAM;AACxB,gCAAsB,MAAM;AACxB,iBAAK,eAAe,IAAI;AACxB,kCAAsB,MAAM;AAGxB,kBAAI,KAAK,eAAe,CAAC,KAAK,SAAS;AACnC,qBAAK,SAAS,UAAU;AAAA,YAChC,CAAC;AAAA,UACL,CAAC;AAAA,QACL,CAAC;AAAA,MACL,OAAO;AACH,YAAI,sBAAsB;AAC1B,cAAM,QAAQ,CAAC,UAAwB;AAxCvD;AAyCoB,+CAAO,WAAP,mBAAe,oBAAoB,iBAAiB;AACpD,+CAAO,WAAP,mBAAe,oBAAoB,SAAS;AAC5C,eAAK,SAAS,MAAM;AACpB,eAAK,eAAe,KAAK;AAAA,QAC7B;AACA,aAAK,SAAS,QAAQ,CAAC,YAAmC;AACtD,cAAI,OAAO,QAAQ,SAAS,aAAa;AACrC,gBAAI,QAAQ,MAAM;AACd,sBAAQ,iBAAiB,iBAAiB,KAAK;AAC/C,sBAAQ,iBAAiB,SAAS,KAAK;AACvC,oCAAsB;AACtB,sBAAQ,OAAO;AAAA,YACnB;AAAA,UACJ;AAAA,QACJ,CAAC;AACD,YAAI,CAAC,qBAAqB;AACtB,gBAAM;AAAA,QACV;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AACA,SAAO;AACX;",
6
+ "names": []
7
+ }
@@ -0,0 +1,2 @@
1
+ "use strict";export function OverlayDialog(n){class r extends n{async manageDialogOpen(){if(this.open)await this.managePosition(),requestAnimationFrame(()=>{requestAnimationFrame(()=>{this.manageChildren(!0),requestAnimationFrame(()=>{this.isConnected&&!this.dialogEl.open&&this.dialogEl.showModal()})})});else{let t=!1;const i=e=>{var o,a;(o=e==null?void 0:e.target)==null||o.removeEventListener("transitionend",i),(a=e==null?void 0:e.target)==null||a.removeEventListener("close",i),this.dialogEl.close(),this.manageChildren(!1)};this.elements.forEach(e=>{typeof e.open!="undefined"&&e.open&&(e.addEventListener("transitionend",i),e.addEventListener("close",i),t=!0,e.open=!1)}),t||i()}}}return r}
2
+ //# sourceMappingURL=OverlayDialog.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["OverlayDialog.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 { ReactiveElement } from 'lit';\nimport { OpenableElement, OverlayBase } from './OverlayBase.js';\n\ntype Constructor<T = Record<string, unknown>> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: T;\n};\n\nexport function OverlayDialog<T extends Constructor<OverlayBase>>(\n constructor: T\n): T & Constructor<ReactiveElement> {\n class OverlayWithDialog extends constructor {\n protected override async manageDialogOpen(): Promise<void> {\n if (this.open) {\n await this.managePosition();\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n this.manageChildren(true);\n requestAnimationFrame(() => {\n // Ensure that child content is fully \"on the DOM\" before showing the modal.\n // This allow for that content to be available to the focus algorithm of that process.\n if (this.isConnected && !this.dialogEl.open)\n this.dialogEl.showModal();\n });\n });\n });\n } else {\n let hasSelfManagedChild = false;\n const close = (event?: Event): void => {\n event?.target?.removeEventListener('transitionend', close);\n event?.target?.removeEventListener('close', close);\n this.dialogEl.close();\n this.manageChildren(false);\n };\n this.elements.forEach((element: OpenableElement): void => {\n if (typeof element.open !== 'undefined') {\n if (element.open) {\n element.addEventListener('transitionend', close);\n element.addEventListener('close', close);\n hasSelfManagedChild = true;\n element.open = false;\n }\n }\n });\n if (!hasSelfManagedChild) {\n close();\n }\n }\n }\n }\n return OverlayWithDialog;\n}\n"],
5
+ "mappings": "aAoBO,gBAAS,cACZA,EACgC,CAChC,MAAMC,UAA0BD,CAAY,CACxC,MAAyB,kBAAkC,CACvD,GAAI,KAAK,KACL,MAAM,KAAK,eAAe,EAC1B,sBAAsB,IAAM,CACxB,sBAAsB,IAAM,CACxB,KAAK,eAAe,EAAI,EACxB,sBAAsB,IAAM,CAGpB,KAAK,aAAe,CAAC,KAAK,SAAS,MACnC,KAAK,SAAS,UAAU,CAChC,CAAC,CACL,CAAC,CACL,CAAC,MACE,CACH,IAAIE,EAAsB,GAC1B,MAAMC,EAASC,GAAwB,CAxCvD,IAAAC,EAAAC,GAyCoBD,EAAAD,GAAA,YAAAA,EAAO,SAAP,MAAAC,EAAe,oBAAoB,gBAAiBF,IACpDG,EAAAF,GAAA,YAAAA,EAAO,SAAP,MAAAE,EAAe,oBAAoB,QAASH,GAC5C,KAAK,SAAS,MAAM,EACpB,KAAK,eAAe,EAAK,CAC7B,EACA,KAAK,SAAS,QAASI,GAAmC,CAClD,OAAOA,EAAQ,MAAS,aACpBA,EAAQ,OACRA,EAAQ,iBAAiB,gBAAiBJ,CAAK,EAC/CI,EAAQ,iBAAiB,QAASJ,CAAK,EACvCD,EAAsB,GACtBK,EAAQ,KAAO,GAG3B,CAAC,EACIL,GACDC,EAAM,CAEd,CACJ,CACJ,CACA,OAAOF,CACX",
6
+ "names": ["constructor", "OverlayWithDialog", "hasSelfManagedChild", "close", "event", "_a", "_b", "element"]
7
+ }
@@ -0,0 +1,8 @@
1
+ import { ReactiveElement } from 'lit';
2
+ import { OverlayBase } from './OverlayBase.js';
3
+ declare type Constructor<T = Record<string, unknown>> = {
4
+ new (...args: any[]): T;
5
+ prototype: T;
6
+ };
7
+ export declare function OverlayNoPopover<T extends Constructor<OverlayBase>>(constructor: T): T & Constructor<ReactiveElement>;
8
+ export {};
@@ -0,0 +1,62 @@
1
+ "use strict";
2
+ import {
3
+ firstFocusableIn,
4
+ firstFocusableSlottedIn
5
+ } from "@spectrum-web-components/shared/src/first-focusable-in.js";
6
+ import {
7
+ BeforetoggleClosedEvent
8
+ } from "./OverlayBase.dev.js";
9
+ export function OverlayNoPopover(constructor) {
10
+ class OverlayWithNoPopover extends constructor {
11
+ async managePopoverOpen() {
12
+ const doClose = (cb = () => {
13
+ return;
14
+ }) => {
15
+ var _a;
16
+ (_a = this.elements[0]) == null ? void 0 : _a.addEventListener("transitionend", cb, {
17
+ once: true
18
+ });
19
+ this.manageChildren(false);
20
+ this.dispatchEvent(new BeforetoggleClosedEvent());
21
+ };
22
+ if (this.open) {
23
+ await this.managePosition();
24
+ requestAnimationFrame(() => {
25
+ requestAnimationFrame(async () => {
26
+ let focusEl = null;
27
+ this.elements.forEach(
28
+ (element) => {
29
+ if (typeof element.open !== "undefined") {
30
+ element.open = true;
31
+ }
32
+ if (!focusEl) {
33
+ focusEl = firstFocusableIn(element);
34
+ }
35
+ if (!focusEl) {
36
+ const childSlots = element.querySelectorAll("slot");
37
+ childSlots.forEach((slot) => {
38
+ if (!focusEl) {
39
+ focusEl = firstFocusableSlottedIn(slot);
40
+ }
41
+ });
42
+ }
43
+ }
44
+ );
45
+ requestAnimationFrame(() => {
46
+ requestAnimationFrame(() => {
47
+ this.manageChildren(true);
48
+ if (focusEl && this.receivesFocus !== "false") {
49
+ focusEl.focus();
50
+ }
51
+ });
52
+ });
53
+ });
54
+ });
55
+ } else {
56
+ doClose();
57
+ }
58
+ }
59
+ }
60
+ return OverlayWithNoPopover;
61
+ }
62
+ //# sourceMappingURL=OverlayNoPopover.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["OverlayNoPopover.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 {\n firstFocusableIn,\n firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport { ReactiveElement } from 'lit';\nimport {\n BeforetoggleClosedEvent,\n OpenableElement,\n OverlayBase,\n} from './OverlayBase.dev.js'\n\ntype Constructor<T = Record<string, unknown>> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: T;\n};\n\nexport function OverlayNoPopover<T extends Constructor<OverlayBase>>(\n constructor: T\n): T & Constructor<ReactiveElement> {\n class OverlayWithNoPopover extends constructor {\n protected override async managePopoverOpen(): Promise<void> {\n const doClose = (\n cb = () => {\n return;\n }\n ): void => {\n this.elements[0]?.addEventListener('transitionend', cb, {\n once: true,\n });\n this.manageChildren(false);\n this.dispatchEvent(new BeforetoggleClosedEvent());\n };\n if (this.open) {\n await this.managePosition();\n // we can acquire overlay position\n requestAnimationFrame(() => {\n requestAnimationFrame(async () => {\n let focusEl = null as HTMLElement | null;\n this.elements.forEach(\n (element: OpenableElement): void => {\n if (typeof element.open !== 'undefined') {\n element.open = true;\n }\n if (!focusEl) {\n focusEl = firstFocusableIn(element);\n }\n if (!focusEl) {\n const childSlots =\n element.querySelectorAll('slot');\n childSlots.forEach((slot) => {\n if (!focusEl) {\n focusEl =\n firstFocusableSlottedIn(slot);\n }\n });\n }\n }\n );\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n this.manageChildren(true);\n if (focusEl && this.receivesFocus !== 'false') {\n focusEl.focus();\n }\n });\n });\n });\n });\n } else {\n doClose();\n }\n }\n }\n return OverlayWithNoPopover;\n}\n"],
5
+ "mappings": ";AAWA;AAAA,EACI;AAAA,EACA;AAAA,OACG;AAEP;AAAA,EACI;AAAA,OAGG;AAQA,gBAAS,iBACZ,aACgC;AAChC,QAAM,6BAA6B,YAAY;AAAA,IAC3C,MAAyB,oBAAmC;AACxD,YAAM,UAAU,CACZ,KAAK,MAAM;AACP;AAAA,MACJ,MACO;AArCvB;AAsCgB,mBAAK,SAAS,CAAC,MAAf,mBAAkB,iBAAiB,iBAAiB,IAAI;AAAA,UACpD,MAAM;AAAA,QACV;AACA,aAAK,eAAe,KAAK;AACzB,aAAK,cAAc,IAAI,wBAAwB,CAAC;AAAA,MACpD;AACA,UAAI,KAAK,MAAM;AACX,cAAM,KAAK,eAAe;AAE1B,8BAAsB,MAAM;AACxB,gCAAsB,YAAY;AAC9B,gBAAI,UAAU;AACd,iBAAK,SAAS;AAAA,cACV,CAAC,YAAmC;AAChC,oBAAI,OAAO,QAAQ,SAAS,aAAa;AACrC,0BAAQ,OAAO;AAAA,gBACnB;AACA,oBAAI,CAAC,SAAS;AACV,4BAAU,iBAAiB,OAAO;AAAA,gBACtC;AACA,oBAAI,CAAC,SAAS;AACV,wBAAM,aACF,QAAQ,iBAAiB,MAAM;AACnC,6BAAW,QAAQ,CAAC,SAAS;AACzB,wBAAI,CAAC,SAAS;AACV,gCACI,wBAAwB,IAAI;AAAA,oBACpC;AAAA,kBACJ,CAAC;AAAA,gBACL;AAAA,cACJ;AAAA,YACJ;AACA,kCAAsB,MAAM;AACxB,oCAAsB,MAAM;AACxB,qBAAK,eAAe,IAAI;AACxB,oBAAI,WAAW,KAAK,kBAAkB,SAAS;AAC3C,0BAAQ,MAAM;AAAA,gBAClB;AAAA,cACJ,CAAC;AAAA,YACL,CAAC;AAAA,UACL,CAAC;AAAA,QACL,CAAC;AAAA,MACL,OAAO;AACH,gBAAQ;AAAA,MACZ;AAAA,IACJ;AAAA,EACJ;AACA,SAAO;AACX;",
6
+ "names": []
7
+ }
@@ -0,0 +1,2 @@
1
+ "use strict";import{firstFocusableIn as i,firstFocusableSlottedIn as a}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{BeforetoggleClosedEvent as l}from"./OverlayBase.js";export function OverlayNoPopover(o){class n extends o{async managePopoverOpen(){const r=(e=()=>{})=>{var t;(t=this.elements[0])==null||t.addEventListener("transitionend",e,{once:!0}),this.manageChildren(!1),this.dispatchEvent(new l)};this.open?(await this.managePosition(),requestAnimationFrame(()=>{requestAnimationFrame(async()=>{let e=null;this.elements.forEach(t=>{typeof t.open!="undefined"&&(t.open=!0),e||(e=i(t)),e||t.querySelectorAll("slot").forEach(s=>{e||(e=a(s))})}),requestAnimationFrame(()=>{requestAnimationFrame(()=>{this.manageChildren(!0),e&&this.receivesFocus!=="false"&&e.focus()})})})})):r()}}return n}
2
+ //# sourceMappingURL=OverlayNoPopover.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["OverlayNoPopover.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 {\n firstFocusableIn,\n firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport { ReactiveElement } from 'lit';\nimport {\n BeforetoggleClosedEvent,\n OpenableElement,\n OverlayBase,\n} from './OverlayBase.js';\n\ntype Constructor<T = Record<string, unknown>> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: T;\n};\n\nexport function OverlayNoPopover<T extends Constructor<OverlayBase>>(\n constructor: T\n): T & Constructor<ReactiveElement> {\n class OverlayWithNoPopover extends constructor {\n protected override async managePopoverOpen(): Promise<void> {\n const doClose = (\n cb = () => {\n return;\n }\n ): void => {\n this.elements[0]?.addEventListener('transitionend', cb, {\n once: true,\n });\n this.manageChildren(false);\n this.dispatchEvent(new BeforetoggleClosedEvent());\n };\n if (this.open) {\n await this.managePosition();\n // we can acquire overlay position\n requestAnimationFrame(() => {\n requestAnimationFrame(async () => {\n let focusEl = null as HTMLElement | null;\n this.elements.forEach(\n (element: OpenableElement): void => {\n if (typeof element.open !== 'undefined') {\n element.open = true;\n }\n if (!focusEl) {\n focusEl = firstFocusableIn(element);\n }\n if (!focusEl) {\n const childSlots =\n element.querySelectorAll('slot');\n childSlots.forEach((slot) => {\n if (!focusEl) {\n focusEl =\n firstFocusableSlottedIn(slot);\n }\n });\n }\n }\n );\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n this.manageChildren(true);\n if (focusEl && this.receivesFocus !== 'false') {\n focusEl.focus();\n }\n });\n });\n });\n });\n } else {\n doClose();\n }\n }\n }\n return OverlayWithNoPopover;\n}\n"],
5
+ "mappings": "aAWA,OACI,oBAAAA,EACA,2BAAAC,MACG,4DAEP,OACI,2BAAAC,MAGG,mBAQA,gBAAS,iBACZC,EACgC,CAChC,MAAMC,UAA6BD,CAAY,CAC3C,MAAyB,mBAAmC,CACxD,MAAME,EAAU,CACZC,EAAK,IAAM,CAEX,IACO,CArCvB,IAAAC,GAsCgBA,EAAA,KAAK,SAAS,CAAC,IAAf,MAAAA,EAAkB,iBAAiB,gBAAiBD,EAAI,CACpD,KAAM,EACV,GACA,KAAK,eAAe,EAAK,EACzB,KAAK,cAAc,IAAIJ,CAAyB,CACpD,EACI,KAAK,MACL,MAAM,KAAK,eAAe,EAE1B,sBAAsB,IAAM,CACxB,sBAAsB,SAAY,CAC9B,IAAIM,EAAU,KACd,KAAK,SAAS,QACTC,GAAmC,CAC5B,OAAOA,EAAQ,MAAS,cACxBA,EAAQ,KAAO,IAEdD,IACDA,EAAUR,EAAiBS,CAAO,GAEjCD,GAEGC,EAAQ,iBAAiB,MAAM,EACxB,QAASC,GAAS,CACpBF,IACDA,EACIP,EAAwBS,CAAI,EAExC,CAAC,CAET,CACJ,EACA,sBAAsB,IAAM,CACxB,sBAAsB,IAAM,CACxB,KAAK,eAAe,EAAI,EACpBF,GAAW,KAAK,gBAAkB,SAClCA,EAAQ,MAAM,CAEtB,CAAC,CACL,CAAC,CACL,CAAC,CACL,CAAC,GAEDH,EAAQ,CAEhB,CACJ,CACA,OAAOD,CACX",
6
+ "names": ["firstFocusableIn", "firstFocusableSlottedIn", "BeforetoggleClosedEvent", "constructor", "OverlayWithNoPopover", "doClose", "cb", "_a", "focusEl", "element", "slot"]
7
+ }
@@ -0,0 +1,8 @@
1
+ import { ReactiveElement } from 'lit';
2
+ import { OverlayBase } from './OverlayBase.js';
3
+ declare type Constructor<T = Record<string, unknown>> = {
4
+ new (...args: any[]): T;
5
+ prototype: T;
6
+ };
7
+ export declare function OverlayPopover<T extends Constructor<OverlayBase>>(constructor: T): T & Constructor<ReactiveElement>;
8
+ export {};
@@ -0,0 +1,81 @@
1
+ "use strict";
2
+ import {
3
+ firstFocusableIn,
4
+ firstFocusableSlottedIn
5
+ } from "@spectrum-web-components/shared/src/first-focusable-in.js";
6
+ import {
7
+ BeforetoggleOpenEvent
8
+ } from "./OverlayBase.dev.js";
9
+ export function OverlayPopover(constructor) {
10
+ class OverlayWithPopover extends constructor {
11
+ async managePopoverOpen() {
12
+ const doClose = (cb = () => {
13
+ return;
14
+ }) => {
15
+ var _a;
16
+ (_a = this.elements[0]) == null ? void 0 : _a.addEventListener("transitionend", cb, {
17
+ once: true
18
+ });
19
+ this.manageChildren(false);
20
+ };
21
+ if (this.open) {
22
+ await this.managePosition();
23
+ if (!this.dialogEl.matches(":open")) {
24
+ this.manageChildren(true);
25
+ requestAnimationFrame(() => {
26
+ if (!this.dialogEl.matches(":open") && this.isConnected) {
27
+ this.dialogEl.showPopover();
28
+ }
29
+ requestAnimationFrame(async () => {
30
+ let focusEl = null;
31
+ this.elements.forEach(
32
+ (element) => {
33
+ if (typeof element.open !== "undefined") {
34
+ element.open = true;
35
+ }
36
+ if (!focusEl) {
37
+ focusEl = firstFocusableIn(element);
38
+ }
39
+ if (!focusEl) {
40
+ const childSlots = element.querySelectorAll("slot");
41
+ childSlots.forEach((slot) => {
42
+ if (!focusEl) {
43
+ focusEl = firstFocusableSlottedIn(
44
+ slot
45
+ );
46
+ }
47
+ });
48
+ }
49
+ }
50
+ );
51
+ requestAnimationFrame(() => {
52
+ requestAnimationFrame(() => {
53
+ this.manageChildren(true);
54
+ if (focusEl)
55
+ focusEl.focus();
56
+ this.dispatchEvent(
57
+ new BeforetoggleOpenEvent()
58
+ );
59
+ });
60
+ });
61
+ });
62
+ });
63
+ }
64
+ } else {
65
+ if (this.dialogEl.matches(":open")) {
66
+ doClose(() => {
67
+ if (!this.open) {
68
+ if (this.dialogEl.matches(":open") && this.isConnected) {
69
+ this.dialogEl.hidePopover();
70
+ }
71
+ }
72
+ });
73
+ } else {
74
+ doClose();
75
+ }
76
+ }
77
+ }
78
+ }
79
+ return OverlayWithPopover;
80
+ }
81
+ //# sourceMappingURL=OverlayPopover.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["OverlayPopover.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 {\n firstFocusableIn,\n firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport { ReactiveElement } from 'lit';\nimport {\n BeforetoggleOpenEvent,\n OpenableElement,\n OverlayBase,\n} from './OverlayBase.dev.js'\n\ntype Constructor<T = Record<string, unknown>> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: T;\n};\n\nexport function OverlayPopover<T extends Constructor<OverlayBase>>(\n constructor: T\n): T & Constructor<ReactiveElement> {\n class OverlayWithPopover extends constructor {\n protected override async managePopoverOpen(): Promise<void> {\n const doClose = (\n cb = () => {\n return;\n }\n ): void => {\n this.elements[0]?.addEventListener('transitionend', cb, {\n once: true,\n });\n this.manageChildren(false);\n };\n if (this.open) {\n await this.managePosition();\n if (!this.dialogEl.matches(':open')) {\n this.manageChildren(true);\n requestAnimationFrame(() => {\n // Ensure that child content is fully \"on the DOM\" before showing the modal.\n // This allow for that content to be available to the focus algorithm of that process.\n if (\n !this.dialogEl.matches(':open') &&\n this.isConnected\n ) {\n this.dialogEl.showPopover();\n }\n requestAnimationFrame(async () => {\n let focusEl = null as HTMLElement | null;\n this.elements.forEach(\n (element: OpenableElement): void => {\n if (typeof element.open !== 'undefined') {\n element.open = true;\n }\n if (!focusEl) {\n focusEl = firstFocusableIn(element);\n }\n if (!focusEl) {\n const childSlots =\n element.querySelectorAll('slot');\n childSlots.forEach((slot) => {\n if (!focusEl) {\n focusEl =\n firstFocusableSlottedIn(\n slot\n );\n }\n });\n }\n }\n );\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n this.manageChildren(true);\n if (focusEl) focusEl.focus();\n this.dispatchEvent(\n new BeforetoggleOpenEvent()\n );\n });\n });\n });\n });\n }\n } else {\n if (this.dialogEl.matches(':open')) {\n doClose(() => {\n if (!this.open) {\n if (\n this.dialogEl.matches(':open') &&\n this.isConnected\n ) {\n this.dialogEl.hidePopover();\n }\n }\n });\n } else {\n doClose();\n }\n }\n }\n }\n return OverlayWithPopover;\n}\n"],
5
+ "mappings": ";AAWA;AAAA,EACI;AAAA,EACA;AAAA,OACG;AAEP;AAAA,EACI;AAAA,OAGG;AAQA,gBAAS,eACZ,aACgC;AAChC,QAAM,2BAA2B,YAAY;AAAA,IACzC,MAAyB,oBAAmC;AACxD,YAAM,UAAU,CACZ,KAAK,MAAM;AACP;AAAA,MACJ,MACO;AArCvB;AAsCgB,mBAAK,SAAS,CAAC,MAAf,mBAAkB,iBAAiB,iBAAiB,IAAI;AAAA,UACpD,MAAM;AAAA,QACV;AACA,aAAK,eAAe,KAAK;AAAA,MAC7B;AACA,UAAI,KAAK,MAAM;AACX,cAAM,KAAK,eAAe;AAC1B,YAAI,CAAC,KAAK,SAAS,QAAQ,OAAO,GAAG;AACjC,eAAK,eAAe,IAAI;AACxB,gCAAsB,MAAM;AAGxB,gBACI,CAAC,KAAK,SAAS,QAAQ,OAAO,KAC9B,KAAK,aACP;AACE,mBAAK,SAAS,YAAY;AAAA,YAC9B;AACA,kCAAsB,YAAY;AAC9B,kBAAI,UAAU;AACd,mBAAK,SAAS;AAAA,gBACV,CAAC,YAAmC;AAChC,sBAAI,OAAO,QAAQ,SAAS,aAAa;AACrC,4BAAQ,OAAO;AAAA,kBACnB;AACA,sBAAI,CAAC,SAAS;AACV,8BAAU,iBAAiB,OAAO;AAAA,kBACtC;AACA,sBAAI,CAAC,SAAS;AACV,0BAAM,aACF,QAAQ,iBAAiB,MAAM;AACnC,+BAAW,QAAQ,CAAC,SAAS;AACzB,0BAAI,CAAC,SAAS;AACV,kCACI;AAAA,0BACI;AAAA,wBACJ;AAAA,sBACR;AAAA,oBACJ,CAAC;AAAA,kBACL;AAAA,gBACJ;AAAA,cACJ;AACA,oCAAsB,MAAM;AACxB,sCAAsB,MAAM;AACxB,uBAAK,eAAe,IAAI;AACxB,sBAAI;AAAS,4BAAQ,MAAM;AAC3B,uBAAK;AAAA,oBACD,IAAI,sBAAsB;AAAA,kBAC9B;AAAA,gBACJ,CAAC;AAAA,cACL,CAAC;AAAA,YACL,CAAC;AAAA,UACL,CAAC;AAAA,QACL;AAAA,MACJ,OAAO;AACH,YAAI,KAAK,SAAS,QAAQ,OAAO,GAAG;AAChC,kBAAQ,MAAM;AACV,gBAAI,CAAC,KAAK,MAAM;AACZ,kBACI,KAAK,SAAS,QAAQ,OAAO,KAC7B,KAAK,aACP;AACE,qBAAK,SAAS,YAAY;AAAA,cAC9B;AAAA,YACJ;AAAA,UACJ,CAAC;AAAA,QACL,OAAO;AACH,kBAAQ;AAAA,QACZ;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ;AACA,SAAO;AACX;",
6
+ "names": []
7
+ }
@@ -0,0 +1,2 @@
1
+ "use strict";import{firstFocusableIn as r,firstFocusableSlottedIn as a}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{BeforetoggleOpenEvent as l}from"./OverlayBase.js";export function OverlayPopover(i){class n extends i{async managePopoverOpen(){const o=(e=()=>{})=>{var t;(t=this.elements[0])==null||t.addEventListener("transitionend",e,{once:!0}),this.manageChildren(!1)};this.open?(await this.managePosition(),this.dialogEl.matches(":open")||(this.manageChildren(!0),requestAnimationFrame(()=>{!this.dialogEl.matches(":open")&&this.isConnected&&this.dialogEl.showPopover(),requestAnimationFrame(async()=>{let e=null;this.elements.forEach(t=>{typeof t.open!="undefined"&&(t.open=!0),e||(e=r(t)),e||t.querySelectorAll("slot").forEach(s=>{e||(e=a(s))})}),requestAnimationFrame(()=>{requestAnimationFrame(()=>{this.manageChildren(!0),e&&e.focus(),this.dispatchEvent(new l)})})})}))):this.dialogEl.matches(":open")?o(()=>{this.open||this.dialogEl.matches(":open")&&this.isConnected&&this.dialogEl.hidePopover()}):o()}}return n}
2
+ //# sourceMappingURL=OverlayPopover.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["OverlayPopover.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 {\n firstFocusableIn,\n firstFocusableSlottedIn,\n} from '@spectrum-web-components/shared/src/first-focusable-in.js';\nimport { ReactiveElement } from 'lit';\nimport {\n BeforetoggleOpenEvent,\n OpenableElement,\n OverlayBase,\n} from './OverlayBase.js';\n\ntype Constructor<T = Record<string, unknown>> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: T;\n};\n\nexport function OverlayPopover<T extends Constructor<OverlayBase>>(\n constructor: T\n): T & Constructor<ReactiveElement> {\n class OverlayWithPopover extends constructor {\n protected override async managePopoverOpen(): Promise<void> {\n const doClose = (\n cb = () => {\n return;\n }\n ): void => {\n this.elements[0]?.addEventListener('transitionend', cb, {\n once: true,\n });\n this.manageChildren(false);\n };\n if (this.open) {\n await this.managePosition();\n if (!this.dialogEl.matches(':open')) {\n this.manageChildren(true);\n requestAnimationFrame(() => {\n // Ensure that child content is fully \"on the DOM\" before showing the modal.\n // This allow for that content to be available to the focus algorithm of that process.\n if (\n !this.dialogEl.matches(':open') &&\n this.isConnected\n ) {\n this.dialogEl.showPopover();\n }\n requestAnimationFrame(async () => {\n let focusEl = null as HTMLElement | null;\n this.elements.forEach(\n (element: OpenableElement): void => {\n if (typeof element.open !== 'undefined') {\n element.open = true;\n }\n if (!focusEl) {\n focusEl = firstFocusableIn(element);\n }\n if (!focusEl) {\n const childSlots =\n element.querySelectorAll('slot');\n childSlots.forEach((slot) => {\n if (!focusEl) {\n focusEl =\n firstFocusableSlottedIn(\n slot\n );\n }\n });\n }\n }\n );\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n this.manageChildren(true);\n if (focusEl) focusEl.focus();\n this.dispatchEvent(\n new BeforetoggleOpenEvent()\n );\n });\n });\n });\n });\n }\n } else {\n if (this.dialogEl.matches(':open')) {\n doClose(() => {\n if (!this.open) {\n if (\n this.dialogEl.matches(':open') &&\n this.isConnected\n ) {\n this.dialogEl.hidePopover();\n }\n }\n });\n } else {\n doClose();\n }\n }\n }\n }\n return OverlayWithPopover;\n}\n"],
5
+ "mappings": "aAWA,OACI,oBAAAA,EACA,2BAAAC,MACG,4DAEP,OACI,yBAAAC,MAGG,mBAQA,gBAAS,eACZC,EACgC,CAChC,MAAMC,UAA2BD,CAAY,CACzC,MAAyB,mBAAmC,CACxD,MAAME,EAAU,CACZC,EAAK,IAAM,CAEX,IACO,CArCvB,IAAAC,GAsCgBA,EAAA,KAAK,SAAS,CAAC,IAAf,MAAAA,EAAkB,iBAAiB,gBAAiBD,EAAI,CACpD,KAAM,EACV,GACA,KAAK,eAAe,EAAK,CAC7B,EACI,KAAK,MACL,MAAM,KAAK,eAAe,EACrB,KAAK,SAAS,QAAQ,OAAO,IAC9B,KAAK,eAAe,EAAI,EACxB,sBAAsB,IAAM,CAIpB,CAAC,KAAK,SAAS,QAAQ,OAAO,GAC9B,KAAK,aAEL,KAAK,SAAS,YAAY,EAE9B,sBAAsB,SAAY,CAC9B,IAAIE,EAAU,KACd,KAAK,SAAS,QACTC,GAAmC,CAC5B,OAAOA,EAAQ,MAAS,cACxBA,EAAQ,KAAO,IAEdD,IACDA,EAAUR,EAAiBS,CAAO,GAEjCD,GAEGC,EAAQ,iBAAiB,MAAM,EACxB,QAASC,GAAS,CACpBF,IACDA,EACIP,EACIS,CACJ,EAEZ,CAAC,CAET,CACJ,EACA,sBAAsB,IAAM,CACxB,sBAAsB,IAAM,CACxB,KAAK,eAAe,EAAI,EACpBF,GAASA,EAAQ,MAAM,EAC3B,KAAK,cACD,IAAIN,CACR,CACJ,CAAC,CACL,CAAC,CACL,CAAC,CACL,CAAC,IAGD,KAAK,SAAS,QAAQ,OAAO,EAC7BG,EAAQ,IAAM,CACL,KAAK,MAEF,KAAK,SAAS,QAAQ,OAAO,GAC7B,KAAK,aAEL,KAAK,SAAS,YAAY,CAGtC,CAAC,EAEDA,EAAQ,CAGpB,CACJ,CACA,OAAOD,CACX",
6
+ "names": ["firstFocusableIn", "firstFocusableSlottedIn", "BeforetoggleOpenEvent", "constructor", "OverlayWithPopover", "doClose", "cb", "_a", "focusEl", "element", "slot"]
7
+ }
@@ -0,0 +1,24 @@
1
+ import { OverlayBase } from './OverlayBase.js';
2
+ declare class OverlayStack {
3
+ private get document();
4
+ private root;
5
+ stack: OverlayBase[];
6
+ constructor();
7
+ bindEvents(): void;
8
+ private closeOverlay;
9
+ handleClick: (event: Event) => void;
10
+ handleBeforetoggle: (event: Event) => void;
11
+ private handleKeydown;
12
+ /**
13
+ * When overlays are added manage the open state of exisiting overlays appropriately:
14
+ * - 'modal': should close other overlays
15
+ * - 'page': should close other overlays
16
+ * - 'hint': shouldn't close other overlays
17
+ * - 'auto': should close other 'auto' overlays and other 'hint' overlays, but not 'manual' overlays
18
+ * - 'manual': shouldn't close other overlays
19
+ */
20
+ add(overlay: OverlayBase): void;
21
+ remove(overlay: OverlayBase): void;
22
+ }
23
+ export declare const overlayStack: OverlayStack;
24
+ export {};
@@ -0,0 +1,115 @@
1
+ "use strict";
2
+ class OverlayStack {
3
+ constructor() {
4
+ this.root = document.body;
5
+ this.stack = [];
6
+ this.handleClick = (event) => {
7
+ if (!this.stack.length)
8
+ return;
9
+ const overlay = this.stack.at(-1);
10
+ if (!overlay)
11
+ return;
12
+ if (overlay.shouldPreventClose())
13
+ return;
14
+ const composedPath = event.composedPath();
15
+ const shouldClose = !composedPath.find(
16
+ (el) => el === overlay || el === overlay.triggerElement
17
+ );
18
+ if (!shouldClose)
19
+ return;
20
+ this.closeOverlay(overlay);
21
+ let parentToClose = overlay.parentOverlayToForceClose;
22
+ while (parentToClose) {
23
+ this.closeOverlay(parentToClose);
24
+ parentToClose = parentToClose.parentOverlayToForceClose;
25
+ }
26
+ };
27
+ this.handleBeforetoggle = (event) => {
28
+ const { target, newState: open } = event;
29
+ if (open === "open")
30
+ return;
31
+ this.closeOverlay(target);
32
+ };
33
+ this.handleKeydown = (event) => {
34
+ if (event.code !== "Escape")
35
+ return;
36
+ if (!this.stack.length)
37
+ return;
38
+ const last = this.stack.at(-1);
39
+ if (!last)
40
+ return;
41
+ this.closeOverlay(last);
42
+ };
43
+ this.bindEvents();
44
+ }
45
+ get document() {
46
+ return this.root.ownerDocument || document;
47
+ }
48
+ bindEvents() {
49
+ this.document.addEventListener("pointerup", this.handleClick);
50
+ this.document.addEventListener("keydown", this.handleKeydown);
51
+ }
52
+ closeOverlay(overlay) {
53
+ const overlayIndex = this.stack.indexOf(overlay);
54
+ if (overlayIndex > -1) {
55
+ this.stack.splice(overlayIndex, 1);
56
+ }
57
+ overlay.open = false;
58
+ }
59
+ /**
60
+ * When overlays are added manage the open state of exisiting overlays appropriately:
61
+ * - 'modal': should close other overlays
62
+ * - 'page': should close other overlays
63
+ * - 'hint': shouldn't close other overlays
64
+ * - 'auto': should close other 'auto' overlays and other 'hint' overlays, but not 'manual' overlays
65
+ * - 'manual': shouldn't close other overlays
66
+ */
67
+ add(overlay) {
68
+ if (this.stack.includes(overlay)) {
69
+ const overlayIndex = this.stack.indexOf(overlay);
70
+ if (overlayIndex > -1) {
71
+ this.stack.splice(overlayIndex, 1);
72
+ this.stack.push(overlay);
73
+ }
74
+ return;
75
+ }
76
+ if (overlay.type === "auto" || overlay.type === "modal" || overlay.type === "page") {
77
+ const queryPathEventName = "sp-overlay-query-path";
78
+ const queryPathEvent = new Event(queryPathEventName, {
79
+ composed: true,
80
+ bubbles: true
81
+ });
82
+ overlay.addEventListener(
83
+ queryPathEventName,
84
+ (event) => {
85
+ const path = event.composedPath();
86
+ this.stack.forEach((overlayEl) => {
87
+ const inPath = path.find((el) => el === overlayEl);
88
+ if (!inPath && overlayEl.type !== "manual") {
89
+ this.closeOverlay(overlayEl);
90
+ }
91
+ });
92
+ },
93
+ { once: true }
94
+ );
95
+ overlay.dispatchEvent(queryPathEvent);
96
+ } else if (overlay.type === "hint") {
97
+ this.stack.forEach((overlayEl) => {
98
+ if (overlayEl.type === "hint") {
99
+ this.closeOverlay(overlayEl);
100
+ }
101
+ });
102
+ }
103
+ requestAnimationFrame(() => {
104
+ this.stack.push(overlay);
105
+ overlay.addEventListener("beforetoggle", this.handleBeforetoggle, {
106
+ once: true
107
+ });
108
+ });
109
+ }
110
+ remove(overlay) {
111
+ this.closeOverlay(overlay);
112
+ }
113
+ }
114
+ export const overlayStack = new OverlayStack();
115
+ //# sourceMappingURL=OverlayStack.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["OverlayStack.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\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 { OverlayBase } from './OverlayBase.dev.js'\n\nclass OverlayStack {\n private get document(): Document {\n return this.root.ownerDocument /* c8 ignore next */ || document;\n }\n\n private root: HTMLElement = document.body;\n\n stack: OverlayBase[] = [];\n\n constructor() {\n this.bindEvents();\n }\n\n bindEvents(): void {\n this.document.addEventListener('pointerup', this.handleClick);\n this.document.addEventListener('keydown', this.handleKeydown);\n }\n\n private closeOverlay(overlay: OverlayBase): void {\n const overlayIndex = this.stack.indexOf(overlay);\n if (overlayIndex > -1) {\n this.stack.splice(overlayIndex, 1);\n }\n overlay.open = false;\n }\n\n handleClick = (event: Event): void => {\n if (!this.stack.length) return;\n\n const overlay = this.stack.at(-1);\n if (!overlay) return;\n if (overlay.shouldPreventClose()) return;\n\n const composedPath = event.composedPath();\n const shouldClose = !composedPath.find(\n (el) => el === overlay || el === overlay.triggerElement\n );\n if (!shouldClose) return;\n\n this.closeOverlay(overlay);\n let parentToClose = overlay.parentOverlayToForceClose;\n while (parentToClose) {\n this.closeOverlay(parentToClose);\n parentToClose = parentToClose.parentOverlayToForceClose;\n }\n };\n\n handleBeforetoggle = (event: Event): void => {\n const { target, newState: open } = event as Event & {\n newState: string;\n };\n if (open === 'open') return;\n this.closeOverlay(target as OverlayBase);\n };\n\n private handleKeydown = (event: KeyboardEvent): void => {\n if (event.code !== 'Escape') return;\n if (!this.stack.length) return;\n\n const last = this.stack.at(-1);\n if (!last) return;\n this.closeOverlay(last);\n };\n\n /**\n * When overlays are added manage the open state of exisiting overlays appropriately:\n * - 'modal': should close other overlays\n * - 'page': should close other overlays\n * - 'hint': shouldn't close other overlays\n * - 'auto': should close other 'auto' overlays and other 'hint' overlays, but not 'manual' overlays\n * - 'manual': shouldn't close other overlays\n */\n add(overlay: OverlayBase): void {\n if (this.stack.includes(overlay)) {\n const overlayIndex = this.stack.indexOf(overlay);\n if (overlayIndex > -1) {\n this.stack.splice(overlayIndex, 1);\n this.stack.push(overlay);\n }\n return;\n }\n if (\n overlay.type === 'auto' ||\n overlay.type === 'modal' ||\n overlay.type === 'page'\n ) {\n // manage closing open overlays\n const queryPathEventName = 'sp-overlay-query-path';\n const queryPathEvent = new Event(queryPathEventName, {\n composed: true,\n bubbles: true,\n });\n overlay.addEventListener(\n queryPathEventName,\n (event: Event) => {\n const path = event.composedPath();\n this.stack.forEach((overlayEl) => {\n const inPath = path.find((el) => el === overlayEl);\n if (!inPath && overlayEl.type !== 'manual') {\n this.closeOverlay(overlayEl);\n }\n });\n },\n { once: true }\n );\n overlay.dispatchEvent(queryPathEvent);\n } else if (overlay.type === 'hint') {\n this.stack.forEach((overlayEl) => {\n if (overlayEl.type === 'hint') {\n this.closeOverlay(overlayEl);\n }\n });\n }\n requestAnimationFrame(() => {\n this.stack.push(overlay);\n overlay.addEventListener('beforetoggle', this.handleBeforetoggle, {\n once: true,\n });\n });\n }\n\n remove(overlay: OverlayBase): void {\n this.closeOverlay(overlay);\n }\n}\n\nexport const overlayStack = new OverlayStack();\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }
@@ -0,0 +1,2 @@
1
+ "use strict";class r{constructor(){this.root=document.body;this.stack=[];this.handleClick=t=>{if(!this.stack.length)return;const e=this.stack.at(-1);if(!e||e.shouldPreventClose()||!!t.composedPath().find(n=>n===e||n===e.triggerElement))return;this.closeOverlay(e);let s=e.parentOverlayToForceClose;for(;s;)this.closeOverlay(s),s=s.parentOverlayToForceClose};this.handleBeforetoggle=t=>{const{target:e,newState:o}=t;o!=="open"&&this.closeOverlay(e)};this.handleKeydown=t=>{if(t.code!=="Escape"||!this.stack.length)return;const e=this.stack.at(-1);e&&this.closeOverlay(e)};this.bindEvents()}get document(){return this.root.ownerDocument||document}bindEvents(){this.document.addEventListener("pointerup",this.handleClick),this.document.addEventListener("keydown",this.handleKeydown)}closeOverlay(t){const e=this.stack.indexOf(t);e>-1&&this.stack.splice(e,1),t.open=!1}add(t){if(this.stack.includes(t)){const e=this.stack.indexOf(t);e>-1&&(this.stack.splice(e,1),this.stack.push(t));return}if(t.type==="auto"||t.type==="modal"||t.type==="page"){const e="sp-overlay-query-path",o=new Event(e,{composed:!0,bubbles:!0});t.addEventListener(e,a=>{const s=a.composedPath();this.stack.forEach(n=>{!s.find(i=>i===n)&&n.type!=="manual"&&this.closeOverlay(n)})},{once:!0}),t.dispatchEvent(o)}else t.type==="hint"&&this.stack.forEach(e=>{e.type==="hint"&&this.closeOverlay(e)});requestAnimationFrame(()=>{this.stack.push(t),t.addEventListener("beforetoggle",this.handleBeforetoggle,{once:!0})})}remove(t){this.closeOverlay(t)}}export const overlayStack=new r;
2
+ //# sourceMappingURL=OverlayStack.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["OverlayStack.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\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 { OverlayBase } from './OverlayBase.js';\n\nclass OverlayStack {\n private get document(): Document {\n return this.root.ownerDocument /* c8 ignore next */ || document;\n }\n\n private root: HTMLElement = document.body;\n\n stack: OverlayBase[] = [];\n\n constructor() {\n this.bindEvents();\n }\n\n bindEvents(): void {\n this.document.addEventListener('pointerup', this.handleClick);\n this.document.addEventListener('keydown', this.handleKeydown);\n }\n\n private closeOverlay(overlay: OverlayBase): void {\n const overlayIndex = this.stack.indexOf(overlay);\n if (overlayIndex > -1) {\n this.stack.splice(overlayIndex, 1);\n }\n overlay.open = false;\n }\n\n handleClick = (event: Event): void => {\n if (!this.stack.length) return;\n\n const overlay = this.stack.at(-1);\n if (!overlay) return;\n if (overlay.shouldPreventClose()) return;\n\n const composedPath = event.composedPath();\n const shouldClose = !composedPath.find(\n (el) => el === overlay || el === overlay.triggerElement\n );\n if (!shouldClose) return;\n\n this.closeOverlay(overlay);\n let parentToClose = overlay.parentOverlayToForceClose;\n while (parentToClose) {\n this.closeOverlay(parentToClose);\n parentToClose = parentToClose.parentOverlayToForceClose;\n }\n };\n\n handleBeforetoggle = (event: Event): void => {\n const { target, newState: open } = event as Event & {\n newState: string;\n };\n if (open === 'open') return;\n this.closeOverlay(target as OverlayBase);\n };\n\n private handleKeydown = (event: KeyboardEvent): void => {\n if (event.code !== 'Escape') return;\n if (!this.stack.length) return;\n\n const last = this.stack.at(-1);\n if (!last) return;\n this.closeOverlay(last);\n };\n\n /**\n * When overlays are added manage the open state of exisiting overlays appropriately:\n * - 'modal': should close other overlays\n * - 'page': should close other overlays\n * - 'hint': shouldn't close other overlays\n * - 'auto': should close other 'auto' overlays and other 'hint' overlays, but not 'manual' overlays\n * - 'manual': shouldn't close other overlays\n */\n add(overlay: OverlayBase): void {\n if (this.stack.includes(overlay)) {\n const overlayIndex = this.stack.indexOf(overlay);\n if (overlayIndex > -1) {\n this.stack.splice(overlayIndex, 1);\n this.stack.push(overlay);\n }\n return;\n }\n if (\n overlay.type === 'auto' ||\n overlay.type === 'modal' ||\n overlay.type === 'page'\n ) {\n // manage closing open overlays\n const queryPathEventName = 'sp-overlay-query-path';\n const queryPathEvent = new Event(queryPathEventName, {\n composed: true,\n bubbles: true,\n });\n overlay.addEventListener(\n queryPathEventName,\n (event: Event) => {\n const path = event.composedPath();\n this.stack.forEach((overlayEl) => {\n const inPath = path.find((el) => el === overlayEl);\n if (!inPath && overlayEl.type !== 'manual') {\n this.closeOverlay(overlayEl);\n }\n });\n },\n { once: true }\n );\n overlay.dispatchEvent(queryPathEvent);\n } else if (overlay.type === 'hint') {\n this.stack.forEach((overlayEl) => {\n if (overlayEl.type === 'hint') {\n this.closeOverlay(overlayEl);\n }\n });\n }\n requestAnimationFrame(() => {\n this.stack.push(overlay);\n overlay.addEventListener('beforetoggle', this.handleBeforetoggle, {\n once: true,\n });\n });\n }\n\n remove(overlay: OverlayBase): void {\n this.closeOverlay(overlay);\n }\n}\n\nexport const overlayStack = new OverlayStack();\n"],
5
+ "mappings": "aAaA,MAAMA,CAAa,CASf,aAAc,CAJd,KAAQ,KAAoB,SAAS,KAErC,WAAuB,CAAC,EAmBxB,iBAAeC,GAAuB,CAClC,GAAI,CAAC,KAAK,MAAM,OAAQ,OAExB,MAAMC,EAAU,KAAK,MAAM,GAAG,EAAE,EAQhC,GAPI,CAACA,GACDA,EAAQ,mBAAmB,GAM3B,CAHgB,CADCD,EAAM,aAAa,EACN,KAC7BE,GAAOA,IAAOD,GAAWC,IAAOD,EAAQ,cAC7C,EACkB,OAElB,KAAK,aAAaA,CAAO,EACzB,IAAIE,EAAgBF,EAAQ,0BAC5B,KAAOE,GACH,KAAK,aAAaA,CAAa,EAC/BA,EAAgBA,EAAc,yBAEtC,EAEA,wBAAsBH,GAAuB,CACzC,KAAM,CAAE,OAAAI,EAAQ,SAAUC,CAAK,EAAIL,EAG/BK,IAAS,QACb,KAAK,aAAaD,CAAqB,CAC3C,EAEA,KAAQ,cAAiBJ,GAA+B,CAEpD,GADIA,EAAM,OAAS,UACf,CAAC,KAAK,MAAM,OAAQ,OAExB,MAAMM,EAAO,KAAK,MAAM,GAAG,EAAE,EACxBA,GACL,KAAK,aAAaA,CAAI,CAC1B,EApDI,KAAK,WAAW,CACpB,CAVA,IAAY,UAAqB,CAC7B,OAAO,KAAK,KAAK,eAAsC,QAC3D,CAUA,YAAmB,CACf,KAAK,SAAS,iBAAiB,YAAa,KAAK,WAAW,EAC5D,KAAK,SAAS,iBAAiB,UAAW,KAAK,aAAa,CAChE,CAEQ,aAAaL,EAA4B,CAC7C,MAAMM,EAAe,KAAK,MAAM,QAAQN,CAAO,EAC3CM,EAAe,IACf,KAAK,MAAM,OAAOA,EAAc,CAAC,EAErCN,EAAQ,KAAO,EACnB,CAgDA,IAAIA,EAA4B,CAC5B,GAAI,KAAK,MAAM,SAASA,CAAO,EAAG,CAC9B,MAAMM,EAAe,KAAK,MAAM,QAAQN,CAAO,EAC3CM,EAAe,KACf,KAAK,MAAM,OAAOA,EAAc,CAAC,EACjC,KAAK,MAAM,KAAKN,CAAO,GAE3B,MACJ,CACA,GACIA,EAAQ,OAAS,QACjBA,EAAQ,OAAS,SACjBA,EAAQ,OAAS,OACnB,CAEE,MAAMO,EAAqB,wBACrBC,EAAiB,IAAI,MAAMD,EAAoB,CACjD,SAAU,GACV,QAAS,EACb,CAAC,EACDP,EAAQ,iBACJO,EACCR,GAAiB,CACd,MAAMU,EAAOV,EAAM,aAAa,EAChC,KAAK,MAAM,QAASW,GAAc,CAE1B,CADWD,EAAK,KAAMR,GAAOA,IAAOS,CAAS,GAClCA,EAAU,OAAS,UAC9B,KAAK,aAAaA,CAAS,CAEnC,CAAC,CACL,EACA,CAAE,KAAM,EAAK,CACjB,EACAV,EAAQ,cAAcQ,CAAc,CACxC,MAAWR,EAAQ,OAAS,QACxB,KAAK,MAAM,QAASU,GAAc,CAC1BA,EAAU,OAAS,QACnB,KAAK,aAAaA,CAAS,CAEnC,CAAC,EAEL,sBAAsB,IAAM,CACxB,KAAK,MAAM,KAAKV,CAAO,EACvBA,EAAQ,iBAAiB,eAAgB,KAAK,mBAAoB,CAC9D,KAAM,EACV,CAAC,CACL,CAAC,CACL,CAEA,OAAOA,EAA4B,CAC/B,KAAK,aAAaA,CAAO,CAC7B,CACJ,CAEO,aAAM,aAAe,IAAIF",
6
+ "names": ["OverlayStack", "event", "overlay", "el", "parentToClose", "target", "open", "last", "overlayIndex", "queryPathEventName", "queryPathEvent", "path", "overlayEl"]
7
+ }