npm - @spectrum-web-components/overlay - Versions diffs - 0.16.1 → 0.16.2 - Mend

@spectrum-web-components/overlay 0.16.1 → 0.16.2

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 (12) hide show

package/custom-elements.json +0 -936
package/package.json +3 -3
package/src/ActiveOverlay.js +31 -6
package/src/ActiveOverlay.js.map +1 -1
package/src/OverlayTrigger.js +3 -1
package/src/OverlayTrigger.js.map +1 -1
package/stories/overlay.stories.js +9 -2
package/stories/overlay.stories.js.map +1 -1
package/test/overlay-trigger-hover.test.js +8 -7
package/test/overlay-trigger-hover.test.js.map +1 -1
package/test/overlay.test.js +37 -1
package/test/overlay.test.js.map +1 -1

package/stories/overlay.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"overlay.stories.js","sourceRoot":"","sources":["overlay.stories.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\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 { html, TemplateResult } from '@spectrum-web-components/base';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\nimport {\n openOverlay,\n Overlay,\n OverlayContentTypes,\n OverlayTrigger,\n Placement,\n VirtualTrigger,\n} from '../';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport '@spectrum-web-components/action-group/sp-action-group.js';\nimport '@spectrum-web-components/button/sp-button.js';\nimport '@spectrum-web-components/dialog/sp-dialog-wrapper.js';\nimport { DialogWrapper } from '@spectrum-web-components/dialog';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-magnify.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-open-in.js';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport { Picker } from '@spectrum-web-components/picker';\nimport '@spectrum-web-components/picker/sp-picker.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/menu/sp-menu-divider.js';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport '@spectrum-web-components/slider/sp-slider.js';\nimport '@spectrum-web-components/radio/sp-radio.js';\nimport '@spectrum-web-components/radio/sp-radio-group.js';\nimport '@spectrum-web-components/tooltip/sp-tooltip.js';\nimport '@spectrum-web-components/theme/sp-theme.js';\nimport '@spectrum-web-components/theme/src/themes.js';\nimport '../../../projects/story-decorator/src/types.js';\n\nimport './overlay-story-components.js';\nimport { render } from 'lit-html';\nimport { Popover } from '@spectrum-web-components/popover';\n\nconst storyStyles = html`\n <style>\n html,\n body,\n #root,\n #root-inner,\n sp-story-decorator {\n height: 100%;\n margin: 0;\n }\n\n sp-story-decorator::part(container) {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n align-items: center;\n justify-content: center;\n }\n\n overlay-trigger {\n flex: none;\n }\n\n #styled-div {\n background-color: var(--styled-div-background-color, blue);\n color: white;\n padding: 4px 10px;\n margin-bottom: 10px;\n }\n\n #inner-trigger {\n display: inline-block;\n }\n </style>\n`;\n\nexport default {\n title: 'Overlay',\n argTypes: {\n offset: { control: 'number' },\n placement: {\n control: {\n type: 'inline-radio',\n options: [\n 'top',\n 'top-start',\n 'top-end',\n 'bottom',\n 'bottom-start',\n 'bottom-end',\n 'left',\n 'left-start',\n 'left-end',\n 'right',\n 'right-start',\n 'right-end',\n 'auto',\n 'auto-start',\n 'auto-end',\n 'none',\n ],\n },\n },\n colorStop: {\n control: {\n type: 'inline-radio',\n options: ['light', 'dark'],\n },\n },\n },\n args: {\n placement: 'bottom',\n offset: 0,\n colorStop: 'light',\n },\n};\n\ninterface Properties {\n placement: Placement;\n offset: number;\n open?: OverlayContentTypes;\n}\n\nconst template = ({ placement, offset, open }: Properties): TemplateResult => {\n return html`\n ${storyStyles}\n <overlay-trigger\n id=\"trigger\"\n placement=\"${placement}\"\n offset=\"${offset}\"\n open=${ifDefined(open)}\n >\n <sp-button variant=\"primary\" slot=\"trigger\">Show Popover</sp-button>\n <sp-popover\n dialog\n slot=\"click-content\"\n placement=\"${placement}\"\n tip\n >\n <div class=\"options-popover-content\">\n <sp-slider\n value=\"5\"\n step=\"0.5\"\n min=\"0\"\n max=\"20\"\n label=\"Awesomeness\"\n ></sp-slider>\n <div id=\"styled-div\">\n The background of this div should be blue\n </div>\n <overlay-trigger id=\"inner-trigger\" placement=\"bottom\">\n <sp-button slot=\"trigger\">Press Me</sp-button>\n <sp-popover\n dialog\n slot=\"click-content\"\n placement=\"bottom\"\n tip\n open\n >\n <div class=\"options-popover-content\">\n Another Popover\n </div>\n </sp-popover>\n\n <sp-tooltip slot=\"hover-content\" delayed tip=\"bottom\">\n Click to open another popover.\n </sp-tooltip>\n </overlay-trigger>\n </div>\n </sp-popover>\n <sp-tooltip\n slot=\"hover-content\"\n ?delayed=${open !== 'hover'}\n tip=\"bottom\"\n >\n Click to open a popover.\n </sp-tooltip>\n </overlay-trigger>\n `;\n};\n\nexport const Default = (args: Properties): TemplateResult => template(args);\n\nexport const openHoverContent = (args: Properties): TemplateResult =>\n template({\n ...args,\n open: 'hover',\n });\n\nexport const openClickContent = (args: Properties): TemplateResult =>\n template({\n ...args,\n open: 'click',\n });\n\nexport const customizedClickContent = (\n args: Properties\n): TemplateResult => html`\n <style>\n active-overlay::part(theme) {\n --styled-div-background-color: var(--spectrum-semantic-cta-background-color-default);\n --spectrum-button-m-cta-texticon-background-color: rebeccapurple;\n }\n </style>\n </style>\n ${template({\n ...args,\n open: 'click',\n })}\n`;\n\nconst extraText = html`\n <p>This is some text.</p>\n <p>This is some text.</p>\n <p>\n This is a\n <a href=\"#anchor\">link</a>\n .\n </p>\n`;\n\nexport const inline = (): TemplateResult => {\n const closeEvent = new Event('close', { bubbles: true, composed: true });\n return html`\n <overlay-trigger type=\"inline\">\n <sp-button slot=\"trigger\">Open</sp-button>\n <sp-overlay slot=\"click-content\">\n <sp-button\n @click=${(event: Event & { target: HTMLElement }): void => {\n event.target.dispatchEvent(closeEvent);\n }}\n >\n Close\n </sp-button>\n </sp-overlay>\n </overlay-trigger>\n ${extraText}\n `;\n};\n\nexport const replace = (): TemplateResult => {\n const closeEvent = new Event('close', { bubbles: true, composed: true });\n return html`\n <overlay-trigger type=\"replace\">\n <sp-button slot=\"trigger\">Open</sp-button>\n <sp-overlay slot=\"click-content\">\n <sp-button\n @click=${(event: Event & { target: HTMLElement }): void => {\n event.target.dispatchEvent(closeEvent);\n }}\n >\n Close\n </sp-button>\n </sp-overlay>\n </overlay-trigger>\n ${extraText}\n `;\n};\n\nexport const modalLoose = (): TemplateResult => {\n const closeEvent = new Event('close', { bubbles: true, composed: true });\n return html`\n <overlay-trigger type=\"modal\" placement=\"none\">\n <sp-button slot=\"trigger\">Open</sp-button>\n <sp-dialog\n size=\"s\"\n dismissable\n slot=\"click-content\"\n @closed=${(event: Event & { target: DialogWrapper }) =>\n event.target.dispatchEvent(closeEvent)}\n >\n <h2 slot=\"heading\">Loose Dialog</h2>\n <p>\n The\n <code>sp-dialog</code>\n element is not \"meant\" to be a modal alone. In that way it\n does not manage its own\n <code>open</code>\n attribute or outline when it should have\n <code>pointer-events: auto</code>\n . It's a part of this test suite to prove that content in\n this way can be used in an\n <code>overlay-trigger</code>\n element.\n </p>\n </sp-dialog>\n </overlay-trigger>\n ${extraText}\n `;\n};\n\nexport const modalManaged = (): TemplateResult => {\n const closeEvent = new Event('close', { bubbles: true, composed: true });\n return html`\n <overlay-trigger type=\"modal\" placement=\"none\">\n <sp-button slot=\"trigger\">Open</sp-button>\n <sp-dialog-wrapper\n underlay\n slot=\"click-content\"\n headline=\"Wrapped Dialog w/ Hero Image\"\n confirm-label=\"Keep Both\"\n secondary-label=\"Replace\"\n cancel-label=\"Cancel\"\n footer=\"Content for footer\"\n @confirm=${(event: Event & { target: DialogWrapper }): void => {\n event.target.dispatchEvent(closeEvent);\n }}\n @secondary=${(\n event: Event & { target: DialogWrapper }\n ): void => {\n event.target.dispatchEvent(closeEvent);\n }}\n @cancel=${(event: Event & { target: DialogWrapper }): void => {\n event.target.dispatchEvent(closeEvent);\n }}\n >\n <p>\n The\n <code>sp-dialog-wrapper</code>\n element has been prepared for use in an\n <code>overlay-trigger</code>\n element by it's combination of modal, underlay, etc. styles\n and features.\n </p>\n </sp-dialog-wrapper>\n </overlay-trigger>\n ${extraText}\n `;\n};\n\nexport const deepNesting = (): TemplateResult => {\n const color = window.__swc_hack_knobs__.defaultColor;\n const outter = color === 'light' ? 'dark' : 'light';\n return html`\n ${storyStyles}\n <sp-theme\n color=${outter}\n theme=${window.__swc_hack_knobs__.defaultThemeVariant}\n scale=${window.__swc_hack_knobs__.defaultScale}\n dir=${window.__swc_hack_knobs__.defaultDirection}\n >\n <sp-theme\n color=${color}\n theme=${window.__swc_hack_knobs__.defaultThemeVariant}\n scale=${window.__swc_hack_knobs__.defaultScale}\n dir=${window.__swc_hack_knobs__.defaultDirection}\n >\n <recursive-popover\n tabindex=\"\"\n style=\"\n background-color: var(--spectrum-global-color-gray-100);\n color: var(--spectrum-global-color-gray-800);\n padding: var(--spectrum-global-dimension-size-225);\n \"\n ></recursive-popover>\n </sp-theme>\n </sp-theme>\n `;\n};\n\nexport const edges = (): TemplateResult => {\n return html`\n <style>\n .demo {\n position: absolute;\n }\n .top-left {\n top: 0;\n left: 0;\n }\n .top-right {\n top: 0;\n right: 0;\n }\n .bottom-right {\n bottom: 0;\n right: 0;\n }\n .bottom-left {\n bottom: 0;\n left: 0;\n }\n </style>\n <overlay-trigger class=\"demo top-left\" placement=\"bottom\">\n <sp-button slot=\"trigger\">\n Top/\n <br />\n Left\n </sp-button>\n <sp-tooltip slot=\"hover-content\" delayed open tip=\"bottom\">\n Triskaidekaphobia and More\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger class=\"demo top-right\" placement=\"bottom\">\n <sp-button slot=\"trigger\">\n Top/\n <br />\n Right\n </sp-button>\n <sp-tooltip slot=\"hover-content\" delayed open tip=\"bottom\">\n Triskaidekaphobia and More\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger class=\"demo bottom-left\" placement=\"top\">\n <sp-button slot=\"trigger\">\n Bottom/\n <br />\n Left\n </sp-button>\n <sp-tooltip slot=\"hover-content\" delayed open tip=\"top\">\n Triskaidekaphobia and More\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger placement=\"top\" class=\"demo bottom-right\">\n <sp-button slot=\"trigger\">\n Bottom/\n <br />\n Right\n </sp-button>\n <sp-tooltip slot=\"hover-content\" delayed open tip=\"top\">\n Triskaidekaphobia and More\n </sp-tooltip>\n </overlay-trigger>\n `;\n};\n\nexport const updated = (): TemplateResult => {\n return html`\n ${storyStyles}\n <style>\n sp-tooltip {\n transition: none;\n }\n </style>\n <overlay-drag>\n <overlay-trigger class=\"demo top-left\" placement=\"bottom\">\n <overlay-target-icon\n slot=\"trigger\"\n style=\"translate(400px, 300px)\"\n ></overlay-target-icon>\n <sp-tooltip slot=\"hover-content\" delayed tip=\"bottom\">\n Click to open popover\n </sp-tooltip>\n <sp-popover\n dialog\n slot=\"click-content\"\n position=\"bottom\"\n tip\n open\n >\n <div class=\"options-popover-content\">\n <sp-slider\n value=\"5\"\n step=\"0.5\"\n min=\"0\"\n max=\"20\"\n label=\"Awesomeness\"\n ></sp-slider>\n <div id=\"styled-div\">\n The background of this div should be blue\n </div>\n <overlay-trigger id=\"inner-trigger\" placement=\"bottom\">\n <sp-button slot=\"trigger\">Press Me</sp-button>\n <sp-popover\n dialog\n slot=\"click-content\"\n placement=\"bottom\"\n tip\n open\n >\n <div class=\"options-popover-content\">\n Another Popover\n </div>\n </sp-popover>\n\n <sp-tooltip\n slot=\"hover-content\"\n delayed\n tip=\"bottom\"\n >\n Click to open another popover.\n </sp-tooltip>\n </overlay-trigger>\n </div>\n </sp-popover>\n </overlay-trigger>\n </overlay-drag>\n `;\n};\n\nexport const sideHoverDraggable = (): TemplateResult => {\n return html`\n ${storyStyles}\n <style>\n sp-tooltip {\n transition: none;\n }\n </style>\n <overlay-drag>\n <overlay-trigger placement=\"right\">\n <overlay-target-icon slot=\"trigger\"></overlay-target-icon>\n <sp-tooltip slot=\"hover-content\" delayed tip=\"right\">\n Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n Vivamus egestas sed enim sed condimentum. Nunc facilisis\n scelerisque massa sed luctus. Orci varius natoque penatibus\n et magnis dis parturient montes, nascetur ridiculus mus.\n Suspendisse sagittis sodales purus vitae ultricies. Integer\n at dui sem. Sed quam tortor, ornare in nisi et, rhoncus\n lacinia mauris. Sed vel rutrum mauris, ac pellentesque nibh.\n Sed feugiat semper libero, sit amet vehicula orci fermentum\n id. Vivamus imperdiet egestas luctus. Mauris tincidunt\n malesuada ante, faucibus viverra nunc blandit a. Fusce et\n nisl nisi. Aenean dictum quam id mollis faucibus. Nulla a\n ultricies dui. In hac habitasse platea dictumst. Curabitur\n gravida lobortis vestibulum.\n </sp-tooltip>\n </overlay-trigger>\n </overlay-drag>\n `;\n};\n\nexport const longpress = (): TemplateResult => {\n return html`\n <overlay-trigger placement=\"right-start\">\n <sp-action-button slot=\"trigger\" hold-affordance>\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">Search real hard...</sp-tooltip>\n <sp-popover slot=\"longpress-content\" tip>\n <sp-action-group\n @change=${(event: Event & { target: HTMLElement }) =>\n event.target.dispatchEvent(\n new Event('close', { bubbles: true })\n )}\n selects=\"single\"\n vertical\n style=\"margin: calc(var(--spectrum-actiongroup-button-gap-y,var(--spectrum-global-dimension-size-100)) / 2);\"\n >\n <sp-action-button>\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-action-button>\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-action-button>\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n </sp-action-group>\n </sp-popover>\n </overlay-trigger>\n `;\n};\n\nfunction nextFrame(): Promise<void> {\n return new Promise((res) => requestAnimationFrame(() => res()));\n}\n\nclass ComplexModalReady extends HTMLElement {\n ready!: (value: boolean \| PromiseLike<boolean>) => void;\n\n constructor() {\n super();\n this.readyPromise = new Promise((res) => {\n this.ready = res;\n this.setup();\n });\n }\n\n async setup(): Promise<void> {\n await nextFrame();\n\n const overlay = document.querySelector(\n `overlay-trigger`\n ) as OverlayTrigger;\n overlay.addEventListener('sp-opened', this.handleTriggerOpened);\n }\n\n handleTriggerOpened = async (): Promise<void> => {\n await nextFrame();\n\n const picker = document.querySelector('#test-picker') as Picker;\n picker.addEventListener('sp-opened', this.handlePickerOpen);\n picker.open = true;\n };\n\n handlePickerOpen = async (): Promise<void> => {\n const picker = document.querySelector('#test-picker') as Picker;\n const actions = [nextFrame, picker.updateComplete];\n\n await Promise.all(actions);\n\n this.ready(true);\n };\n\n private readyPromise: Promise<boolean> = Promise.resolve(false);\n\n get updateComplete(): Promise<boolean> {\n return this.readyPromise;\n }\n}\n\ncustomElements.define('complex-modal-ready', ComplexModalReady);\n\nconst complexModalDecorator = (story: () => TemplateResult): TemplateResult => {\n return html`\n ${story()}\n <complex-modal-ready></complex-modal-ready>\n `;\n};\n\nexport const complexModal = (): TemplateResult => {\n return html`\n <style>\n body {\n --swc-margin-test: 10px;\n margin: var(--swc-margin-test);\n }\n sp-story-decorator::part(container) {\n min-height: calc(100vh - (2 * var(--swc-margin-test)));\n padding: 0;\n display: grid;\n place-content: center;\n }\n active-overlay > * {\n --spectrum-global-animation-duration-100: 0ms;\n --spectrum-global-animation-duration-200: 0ms;\n --spectrum-global-animation-duration-300: 0ms;\n --spectrum-global-animation-duration-400: 0ms;\n --spectrum-global-animation-duration-500: 0ms;\n --spectrum-global-animation-duration-600: 0ms;\n --spectrum-global-animation-duration-700: 0ms;\n --spectrum-global-animation-duration-800: 0ms;\n --spectrum-global-animation-duration-900: 0ms;\n --spectrum-global-animation-duration-1000: 0ms;\n --spectrum-global-animation-duration-2000: 0ms;\n --spectrum-global-animation-duration-4000: 0ms;\n --spectrum-coachmark-animation-indicator-ring-duration: 0ms;\n --swc-test-duration: 1ms;\n }\n </style>\n <overlay-trigger type=\"modal\" placement=\"none\" open=\"click\">\n <sp-dialog-wrapper\n slot=\"click-content\"\n headline=\"Dialog title\"\n dismissable\n underlay\n footer=\"Content for footer\"\n >\n <sp-field-label for=\"test-picker\">\n Selection type:\n </sp-field-label>\n <sp-picker id=\"test-picker\">\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item>Select inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and mask...</sp-menu-item>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-item>Save selection</sp-menu-item>\n <sp-menu-item disabled>Make work path</sp-menu-item>\n </sp-picker>\n </sp-dialog-wrapper>\n <sp-button slot=\"trigger\" variant=\"primary\">\n Toggle Dialog\n </sp-button>\n </overlay-trigger>\n `;\n};\n\ncomplexModal.decorators = [complexModalDecorator];\n\nexport const superComplexModal = (): TemplateResult => {\n return html`\n <overlay-trigger type=\"modal\" placement=\"none\">\n <sp-button slot=\"trigger\" variant=\"accent\">Toggle Dialog</sp-button>\n <sp-popover dialog slot=\"click-content\">\n <overlay-trigger>\n <sp-button slot=\"trigger\" variant=\"primary\">\n Toggle Dialog\n </sp-button>\n <sp-popover dialog slot=\"click-content\">\n <overlay-trigger type=\"modal\">\n <sp-button slot=\"trigger\" variant=\"secondary\">\n Toggle Dialog\n </sp-button>\n <sp-popover dialog slot=\"click-content\">\n <p>\n When you get this deep, this ActiveOverlay\n should be the only one in [slot=\"open\"].\n </p>\n <p>\n All of the rest of the ActiveOverlay\n elements should have had their [slot]\n attribute removed.\n </p>\n <p>\n Closing this ActiveOverlay should replace\n them...\n </p>\n </sp-popover>\n </overlay-trigger>\n </sp-popover>\n </overlay-trigger>\n </sp-popover>\n </overlay-trigger>\n `;\n};\n\nclass StartEndContextmenu extends HTMLElement {\n shadowRoot!: ShadowRoot;\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n this.shadowRoot.innerHTML = `\n <style>\n :host {\n display: flex;\n align-items: stretch;\n }\n div {\n width: 50%;\n height: 100%;\n }\n </style>\n <div id=\"start\"></div>\n <div id=\"end\"></div>\n `;\n }\n}\n\ncustomElements.define('start-end-contextmenu', StartEndContextmenu);\n\nexport const virtualElement = (args: Properties): TemplateResult => {\n const contextMenuTemplate = (kind = ''): TemplateResult => html`\n <sp-popover\n style=\"max-width: 33vw;\"\n @click=${(event: Event) =>\n event.target?.dispatchEvent(\n new Event('close', { bubbles: true })\n )}\n >\n <sp-menu>\n <sp-menu-group>\n <span slot=\"header\">Menu source: ${kind}</span>\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item>Select inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and mask...</sp-menu-item>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-item>Save selection</sp-menu-item>\n <sp-menu-item disabled>Make work path</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n </sp-popover>\n `;\n const pointerenter = async (event: PointerEvent): Promise<void> => {\n event.preventDefault();\n const source = event.composedPath()[0] as HTMLDivElement;\n const { id } = source;\n const trigger = event.target as HTMLElement;\n const virtualTrigger = new VirtualTrigger(event.clientX, event.clientY);\n const fragment = document.createDocumentFragment();\n render(contextMenuTemplate(id), fragment);\n const popover = fragment.querySelector('sp-popover') as Popover;\n openOverlay(trigger, 'modal', popover, {\n placement: args.placement,\n receivesFocus: 'auto',\n virtualTrigger,\n });\n };\n return html`\n <style>\n .app-root {\n position: absolute;\n inset: 0;\n }\n </style>\n <start-end-contextmenu\n class=\"app-root\"\n @contextmenu=${pointerenter}\n ></start-end-contextmenu>\n `;\n};\n\nvirtualElement.args = {\n placement: 'right-start' as Placement,\n};\n\nexport const detachedElement = (): TemplateResult => {\n let closeOverlay: (() => void) \| undefined;\n const openDetachedOverlayContent = async ({\n target,\n }: {\n target: HTMLElement;\n }): Promise<void> => {\n if (closeOverlay) {\n closeOverlay();\n closeOverlay = undefined;\n return;\n }\n const div = document.createElement('div');\n div.textContent = 'This div is overlaid';\n div.setAttribute(\n 'style',\n `\n background-color: var(--spectrum-global-color-gray-50);\n color: var(--spectrum-global-color-gray-800);\n border: 1px solid;\n padding: 2em;\n `\n );\n closeOverlay = await Overlay.open(target, 'click', div, {\n offset: 0,\n placement: 'bottom',\n });\n };\n requestAnimationFrame(() => {\n openDetachedOverlayContent({\n target: document.querySelector(\n '#detached-content-trigger'\n ) as HTMLElement,\n });\n });\n return html`\n <sp-action-button\n id=\"detached-content-trigger\"\n @click=${openDetachedOverlayContent}\n @sp-closed=${() => (closeOverlay = undefined)}\n >\n <sp-icon-open-in\n slot=\"icon\"\n label=\"Open in overlay\"\n ></sp-icon-open-in>\n </sp-action-button>\n `;\n};\n\nclass DefinedOverlayReady extends HTMLElement {\n ready!: (value: boolean \| PromiseLike<boolean>) => void;\n\n constructor() {\n super();\n this.readyPromise = new Promise((res) => {\n this.ready = res;\n this.setup();\n });\n }\n\n async setup(): Promise<void> {\n await nextFrame();\n\n const overlay = document.querySelector(\n `overlay-trigger`\n ) as OverlayTrigger;\n const button = document.querySelector(\n `[slot=\"trigger\"]`\n ) as HTMLButtonElement;\n overlay.addEventListener('sp-opened', this.handleTriggerOpened);\n button.click();\n }\n\n handleTriggerOpened = async (): Promise<void> => {\n await nextFrame();\n\n const popover = document.querySelector('popover-content');\n if (!popover) {\n return;\n }\n popover.addEventListener('sp-opened', this.handlePopoverOpen);\n popover.button.click();\n };\n\n handlePopoverOpen = async (): Promise<void> => {\n await nextFrame();\n\n this.ready(true);\n };\n\n private readyPromise: Promise<boolean> = Promise.resolve(false);\n\n get updateComplete(): Promise<boolean> {\n return this.readyPromise;\n }\n}\n\ncustomElements.define('defined-overlay-ready', DefinedOverlayReady);\n\nconst definedOverlayDecorator = (\n story: () => TemplateResult\n): TemplateResult => {\n return html`\n ${story()}\n <defined-overlay-ready></defined-overlay-ready>\n `;\n};\n\nexport const definedOverlayElement = (): TemplateResult => {\n return html`\n <overlay-trigger placement=\"bottom\" type=\"modal\">\n <sp-button variant=\"primary\" slot=\"trigger\">Open popover</sp-button>\n <sp-popover slot=\"click-content\" direction=\"bottom\" dialog>\n <popover-content></popover-content>\n </sp-popover>\n </overlay-trigger>\n `;\n};\n\ndefinedOverlayElement.decorators = [definedOverlayDecorator];\n"]}
1	+ {"version":3,"file":"overlay.stories.js","sourceRoot":"","sources":["overlay.stories.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\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 { html, TemplateResult } from '@spectrum-web-components/base';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\nimport {\n openOverlay,\n Overlay,\n OverlayContentTypes,\n OverlayTrigger,\n Placement,\n TriggerInteractions,\n VirtualTrigger,\n} from '../';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport '@spectrum-web-components/action-group/sp-action-group.js';\nimport '@spectrum-web-components/button/sp-button.js';\nimport '@spectrum-web-components/dialog/sp-dialog-wrapper.js';\nimport { DialogWrapper } from '@spectrum-web-components/dialog';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-magnify.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-open-in.js';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport { Picker } from '@spectrum-web-components/picker';\nimport '@spectrum-web-components/picker/sp-picker.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/menu/sp-menu-divider.js';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport '@spectrum-web-components/slider/sp-slider.js';\nimport '@spectrum-web-components/radio/sp-radio.js';\nimport '@spectrum-web-components/radio/sp-radio-group.js';\nimport '@spectrum-web-components/tooltip/sp-tooltip.js';\nimport '@spectrum-web-components/theme/sp-theme.js';\nimport '@spectrum-web-components/theme/src/themes.js';\nimport '../../../projects/story-decorator/src/types.js';\n\nimport './overlay-story-components.js';\nimport { render } from 'lit-html';\nimport { Popover } from '@spectrum-web-components/popover';\n\nconst storyStyles = html`\n <style>\n html,\n body,\n #root,\n #root-inner,\n sp-story-decorator {\n height: 100%;\n margin: 0;\n }\n\n sp-story-decorator::part(container) {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n align-items: center;\n justify-content: center;\n }\n\n overlay-trigger {\n flex: none;\n }\n\n #styled-div {\n background-color: var(--styled-div-background-color, blue);\n color: white;\n padding: 4px 10px;\n margin-bottom: 10px;\n }\n\n #inner-trigger {\n display: inline-block;\n }\n </style>\n`;\n\nexport default {\n title: 'Overlay',\n argTypes: {\n offset: { control: 'number' },\n placement: {\n control: {\n type: 'inline-radio',\n options: [\n 'top',\n 'top-start',\n 'top-end',\n 'bottom',\n 'bottom-start',\n 'bottom-end',\n 'left',\n 'left-start',\n 'left-end',\n 'right',\n 'right-start',\n 'right-end',\n 'auto',\n 'auto-start',\n 'auto-end',\n 'none',\n ],\n },\n },\n type: {\n control: {\n type: 'inline-radio',\n options: ['modal', 'replace', 'inline'],\n },\n },\n colorStop: {\n control: {\n type: 'inline-radio',\n options: ['light', 'dark'],\n },\n },\n },\n args: {\n placement: 'bottom',\n offset: 0,\n colorStop: 'light',\n },\n};\n\ninterface Properties {\n placement: Placement;\n offset: number;\n open?: OverlayContentTypes;\n type?: Extract<TriggerInteractions, 'inline' \| 'modal' \| 'replace'>;\n}\n\nconst template = ({\n placement,\n offset,\n open,\n type,\n}: Properties): TemplateResult => {\n return html`\n ${storyStyles}\n <overlay-trigger\n id=\"trigger\"\n placement=\"${placement}\"\n offset=\"${offset}\"\n open=${ifDefined(open)}\n type=${ifDefined(type)}\n >\n <sp-button variant=\"primary\" slot=\"trigger\">Show Popover</sp-button>\n <sp-popover\n dialog\n slot=\"click-content\"\n placement=\"${placement}\"\n tip\n >\n <div class=\"options-popover-content\">\n <sp-slider\n value=\"5\"\n step=\"0.5\"\n min=\"0\"\n max=\"20\"\n label=\"Awesomeness\"\n ></sp-slider>\n <div id=\"styled-div\">\n The background of this div should be blue\n </div>\n <overlay-trigger id=\"inner-trigger\" placement=\"bottom\">\n <sp-button slot=\"trigger\">Press Me</sp-button>\n <sp-popover\n dialog\n slot=\"click-content\"\n placement=\"bottom\"\n tip\n open\n >\n <div class=\"options-popover-content\">\n Another Popover\n </div>\n </sp-popover>\n\n <sp-tooltip slot=\"hover-content\" delayed tip=\"bottom\">\n Click to open another popover.\n </sp-tooltip>\n </overlay-trigger>\n </div>\n </sp-popover>\n <sp-tooltip\n slot=\"hover-content\"\n ?delayed=${open !== 'hover'}\n tip=\"bottom\"\n >\n Click to open a popover.\n </sp-tooltip>\n </overlay-trigger>\n `;\n};\n\nexport const Default = (args: Properties): TemplateResult => template(args);\n\nexport const openHoverContent = (args: Properties): TemplateResult =>\n template({\n ...args,\n open: 'hover',\n });\n\nexport const openClickContent = (args: Properties): TemplateResult =>\n template({\n ...args,\n open: 'click',\n });\n\nexport const customizedClickContent = (\n args: Properties\n): TemplateResult => html`\n <style>\n active-overlay::part(theme) {\n --styled-div-background-color: var(--spectrum-semantic-cta-background-color-default);\n --spectrum-button-m-cta-texticon-background-color: rebeccapurple;\n }\n </style>\n </style>\n ${template({\n ...args,\n open: 'click',\n })}\n`;\n\nconst extraText = html`\n <p>This is some text.</p>\n <p>This is some text.</p>\n <p>\n This is a\n <a href=\"#anchor\">link</a>\n .\n </p>\n`;\n\nexport const inline = (): TemplateResult => {\n const closeEvent = new Event('close', { bubbles: true, composed: true });\n return html`\n <overlay-trigger type=\"inline\">\n <sp-button slot=\"trigger\">Open</sp-button>\n <sp-overlay slot=\"click-content\">\n <sp-button\n @click=${(event: Event & { target: HTMLElement }): void => {\n event.target.dispatchEvent(closeEvent);\n }}\n >\n Close\n </sp-button>\n </sp-overlay>\n </overlay-trigger>\n ${extraText}\n `;\n};\n\nexport const replace = (): TemplateResult => {\n const closeEvent = new Event('close', { bubbles: true, composed: true });\n return html`\n <overlay-trigger type=\"replace\">\n <sp-button slot=\"trigger\">Open</sp-button>\n <sp-overlay slot=\"click-content\">\n <sp-button\n @click=${(event: Event & { target: HTMLElement }): void => {\n event.target.dispatchEvent(closeEvent);\n }}\n >\n Close\n </sp-button>\n </sp-overlay>\n </overlay-trigger>\n ${extraText}\n `;\n};\n\nexport const modalLoose = (): TemplateResult => {\n const closeEvent = new Event('close', { bubbles: true, composed: true });\n return html`\n <overlay-trigger type=\"modal\" placement=\"none\">\n <sp-button slot=\"trigger\">Open</sp-button>\n <sp-dialog\n size=\"s\"\n dismissable\n slot=\"click-content\"\n @closed=${(event: Event & { target: DialogWrapper }) =>\n event.target.dispatchEvent(closeEvent)}\n >\n <h2 slot=\"heading\">Loose Dialog</h2>\n <p>\n The\n <code>sp-dialog</code>\n element is not \"meant\" to be a modal alone. In that way it\n does not manage its own\n <code>open</code>\n attribute or outline when it should have\n <code>pointer-events: auto</code>\n . It's a part of this test suite to prove that content in\n this way can be used in an\n <code>overlay-trigger</code>\n element.\n </p>\n </sp-dialog>\n </overlay-trigger>\n ${extraText}\n `;\n};\n\nexport const modalManaged = (): TemplateResult => {\n const closeEvent = new Event('close', { bubbles: true, composed: true });\n return html`\n <overlay-trigger type=\"modal\" placement=\"none\">\n <sp-button slot=\"trigger\">Open</sp-button>\n <sp-dialog-wrapper\n underlay\n slot=\"click-content\"\n headline=\"Wrapped Dialog w/ Hero Image\"\n confirm-label=\"Keep Both\"\n secondary-label=\"Replace\"\n cancel-label=\"Cancel\"\n footer=\"Content for footer\"\n @confirm=${(event: Event & { target: DialogWrapper }): void => {\n event.target.dispatchEvent(closeEvent);\n }}\n @secondary=${(\n event: Event & { target: DialogWrapper }\n ): void => {\n event.target.dispatchEvent(closeEvent);\n }}\n @cancel=${(event: Event & { target: DialogWrapper }): void => {\n event.target.dispatchEvent(closeEvent);\n }}\n >\n <p>\n The\n <code>sp-dialog-wrapper</code>\n element has been prepared for use in an\n <code>overlay-trigger</code>\n element by it's combination of modal, underlay, etc. styles\n and features.\n </p>\n </sp-dialog-wrapper>\n </overlay-trigger>\n ${extraText}\n `;\n};\n\nexport const deepNesting = (): TemplateResult => {\n const color = window.__swc_hack_knobs__.defaultColor;\n const outter = color === 'light' ? 'dark' : 'light';\n return html`\n ${storyStyles}\n <sp-theme\n color=${outter}\n theme=${window.__swc_hack_knobs__.defaultThemeVariant}\n scale=${window.__swc_hack_knobs__.defaultScale}\n dir=${window.__swc_hack_knobs__.defaultDirection}\n >\n <sp-theme\n color=${color}\n theme=${window.__swc_hack_knobs__.defaultThemeVariant}\n scale=${window.__swc_hack_knobs__.defaultScale}\n dir=${window.__swc_hack_knobs__.defaultDirection}\n >\n <recursive-popover\n tabindex=\"\"\n style=\"\n background-color: var(--spectrum-global-color-gray-100);\n color: var(--spectrum-global-color-gray-800);\n padding: var(--spectrum-global-dimension-size-225);\n \"\n ></recursive-popover>\n </sp-theme>\n </sp-theme>\n `;\n};\n\nexport const edges = (): TemplateResult => {\n return html`\n <style>\n .demo {\n position: absolute;\n }\n .top-left {\n top: 0;\n left: 0;\n }\n .top-right {\n top: 0;\n right: 0;\n }\n .bottom-right {\n bottom: 0;\n right: 0;\n }\n .bottom-left {\n bottom: 0;\n left: 0;\n }\n </style>\n <overlay-trigger class=\"demo top-left\" placement=\"bottom\">\n <sp-button slot=\"trigger\">\n Top/\n <br />\n Left\n </sp-button>\n <sp-tooltip slot=\"hover-content\" delayed open tip=\"bottom\">\n Triskaidekaphobia and More\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger class=\"demo top-right\" placement=\"bottom\">\n <sp-button slot=\"trigger\">\n Top/\n <br />\n Right\n </sp-button>\n <sp-tooltip slot=\"hover-content\" delayed open tip=\"bottom\">\n Triskaidekaphobia and More\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger class=\"demo bottom-left\" placement=\"top\">\n <sp-button slot=\"trigger\">\n Bottom/\n <br />\n Left\n </sp-button>\n <sp-tooltip slot=\"hover-content\" delayed open tip=\"top\">\n Triskaidekaphobia and More\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger placement=\"top\" class=\"demo bottom-right\">\n <sp-button slot=\"trigger\">\n Bottom/\n <br />\n Right\n </sp-button>\n <sp-tooltip slot=\"hover-content\" delayed open tip=\"top\">\n Triskaidekaphobia and More\n </sp-tooltip>\n </overlay-trigger>\n `;\n};\n\nexport const updated = (): TemplateResult => {\n return html`\n ${storyStyles}\n <style>\n sp-tooltip {\n transition: none;\n }\n </style>\n <overlay-drag>\n <overlay-trigger class=\"demo top-left\" placement=\"bottom\">\n <overlay-target-icon\n slot=\"trigger\"\n style=\"translate(400px, 300px)\"\n ></overlay-target-icon>\n <sp-tooltip slot=\"hover-content\" delayed tip=\"bottom\">\n Click to open popover\n </sp-tooltip>\n <sp-popover\n dialog\n slot=\"click-content\"\n position=\"bottom\"\n tip\n open\n >\n <div class=\"options-popover-content\">\n <sp-slider\n value=\"5\"\n step=\"0.5\"\n min=\"0\"\n max=\"20\"\n label=\"Awesomeness\"\n ></sp-slider>\n <div id=\"styled-div\">\n The background of this div should be blue\n </div>\n <overlay-trigger id=\"inner-trigger\" placement=\"bottom\">\n <sp-button slot=\"trigger\">Press Me</sp-button>\n <sp-popover\n dialog\n slot=\"click-content\"\n placement=\"bottom\"\n tip\n open\n >\n <div class=\"options-popover-content\">\n Another Popover\n </div>\n </sp-popover>\n\n <sp-tooltip\n slot=\"hover-content\"\n delayed\n tip=\"bottom\"\n >\n Click to open another popover.\n </sp-tooltip>\n </overlay-trigger>\n </div>\n </sp-popover>\n </overlay-trigger>\n </overlay-drag>\n `;\n};\n\nexport const sideHoverDraggable = (): TemplateResult => {\n return html`\n ${storyStyles}\n <style>\n sp-tooltip {\n transition: none;\n }\n </style>\n <overlay-drag>\n <overlay-trigger placement=\"right\">\n <overlay-target-icon slot=\"trigger\"></overlay-target-icon>\n <sp-tooltip slot=\"hover-content\" delayed tip=\"right\">\n Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n Vivamus egestas sed enim sed condimentum. Nunc facilisis\n scelerisque massa sed luctus. Orci varius natoque penatibus\n et magnis dis parturient montes, nascetur ridiculus mus.\n Suspendisse sagittis sodales purus vitae ultricies. Integer\n at dui sem. Sed quam tortor, ornare in nisi et, rhoncus\n lacinia mauris. Sed vel rutrum mauris, ac pellentesque nibh.\n Sed feugiat semper libero, sit amet vehicula orci fermentum\n id. Vivamus imperdiet egestas luctus. Mauris tincidunt\n malesuada ante, faucibus viverra nunc blandit a. Fusce et\n nisl nisi. Aenean dictum quam id mollis faucibus. Nulla a\n ultricies dui. In hac habitasse platea dictumst. Curabitur\n gravida lobortis vestibulum.\n </sp-tooltip>\n </overlay-trigger>\n </overlay-drag>\n `;\n};\n\nexport const longpress = (): TemplateResult => {\n return html`\n <overlay-trigger placement=\"right-start\">\n <sp-action-button slot=\"trigger\" hold-affordance>\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">Search real hard...</sp-tooltip>\n <sp-popover slot=\"longpress-content\" tip>\n <sp-action-group\n @change=${(event: Event & { target: HTMLElement }) =>\n event.target.dispatchEvent(\n new Event('close', { bubbles: true })\n )}\n selects=\"single\"\n vertical\n style=\"margin: calc(var(--spectrum-actiongroup-button-gap-y,var(--spectrum-global-dimension-size-100)) / 2);\"\n >\n <sp-action-button>\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-action-button>\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-action-button>\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n </sp-action-group>\n </sp-popover>\n </overlay-trigger>\n `;\n};\n\nfunction nextFrame(): Promise<void> {\n return new Promise((res) => requestAnimationFrame(() => res()));\n}\n\nclass ComplexModalReady extends HTMLElement {\n ready!: (value: boolean \| PromiseLike<boolean>) => void;\n\n constructor() {\n super();\n this.readyPromise = new Promise((res) => {\n this.ready = res;\n this.setup();\n });\n }\n\n async setup(): Promise<void> {\n await nextFrame();\n\n const overlay = document.querySelector(\n `overlay-trigger`\n ) as OverlayTrigger;\n overlay.addEventListener('sp-opened', this.handleTriggerOpened);\n }\n\n handleTriggerOpened = async (): Promise<void> => {\n await nextFrame();\n\n const picker = document.querySelector('#test-picker') as Picker;\n picker.addEventListener('sp-opened', this.handlePickerOpen);\n picker.open = true;\n };\n\n handlePickerOpen = async (): Promise<void> => {\n const picker = document.querySelector('#test-picker') as Picker;\n const actions = [nextFrame, picker.updateComplete];\n\n await Promise.all(actions);\n\n this.ready(true);\n };\n\n private readyPromise: Promise<boolean> = Promise.resolve(false);\n\n get updateComplete(): Promise<boolean> {\n return this.readyPromise;\n }\n}\n\ncustomElements.define('complex-modal-ready', ComplexModalReady);\n\nconst complexModalDecorator = (story: () => TemplateResult): TemplateResult => {\n return html`\n ${story()}\n <complex-modal-ready></complex-modal-ready>\n `;\n};\n\nexport const complexModal = (): TemplateResult => {\n return html`\n <style>\n body {\n --swc-margin-test: 10px;\n margin: var(--swc-margin-test);\n }\n sp-story-decorator::part(container) {\n min-height: calc(100vh - (2 * var(--swc-margin-test)));\n padding: 0;\n display: grid;\n place-content: center;\n }\n active-overlay > * {\n --spectrum-global-animation-duration-100: 0ms;\n --spectrum-global-animation-duration-200: 0ms;\n --spectrum-global-animation-duration-300: 0ms;\n --spectrum-global-animation-duration-400: 0ms;\n --spectrum-global-animation-duration-500: 0ms;\n --spectrum-global-animation-duration-600: 0ms;\n --spectrum-global-animation-duration-700: 0ms;\n --spectrum-global-animation-duration-800: 0ms;\n --spectrum-global-animation-duration-900: 0ms;\n --spectrum-global-animation-duration-1000: 0ms;\n --spectrum-global-animation-duration-2000: 0ms;\n --spectrum-global-animation-duration-4000: 0ms;\n --spectrum-coachmark-animation-indicator-ring-duration: 0ms;\n --swc-test-duration: 1ms;\n }\n </style>\n <overlay-trigger type=\"modal\" placement=\"none\" open=\"click\">\n <sp-dialog-wrapper\n slot=\"click-content\"\n headline=\"Dialog title\"\n dismissable\n underlay\n footer=\"Content for footer\"\n >\n <sp-field-label for=\"test-picker\">\n Selection type:\n </sp-field-label>\n <sp-picker id=\"test-picker\">\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item>Select inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and mask...</sp-menu-item>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-item>Save selection</sp-menu-item>\n <sp-menu-item disabled>Make work path</sp-menu-item>\n </sp-picker>\n </sp-dialog-wrapper>\n <sp-button slot=\"trigger\" variant=\"primary\">\n Toggle Dialog\n </sp-button>\n </overlay-trigger>\n `;\n};\n\ncomplexModal.decorators = [complexModalDecorator];\n\nexport const superComplexModal = (): TemplateResult => {\n return html`\n <overlay-trigger type=\"modal\" placement=\"none\">\n <sp-button slot=\"trigger\" variant=\"accent\">Toggle Dialog</sp-button>\n <sp-popover dialog slot=\"click-content\">\n <overlay-trigger>\n <sp-button slot=\"trigger\" variant=\"primary\">\n Toggle Dialog\n </sp-button>\n <sp-popover dialog slot=\"click-content\">\n <overlay-trigger type=\"modal\">\n <sp-button slot=\"trigger\" variant=\"secondary\">\n Toggle Dialog\n </sp-button>\n <sp-popover dialog slot=\"click-content\">\n <p>\n When you get this deep, this ActiveOverlay\n should be the only one in [slot=\"open\"].\n </p>\n <p>\n All of the rest of the ActiveOverlay\n elements should have had their [slot]\n attribute removed.\n </p>\n <p>\n Closing this ActiveOverlay should replace\n them...\n </p>\n </sp-popover>\n </overlay-trigger>\n </sp-popover>\n </overlay-trigger>\n </sp-popover>\n </overlay-trigger>\n `;\n};\n\nclass StartEndContextmenu extends HTMLElement {\n shadowRoot!: ShadowRoot;\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n this.shadowRoot.innerHTML = `\n <style>\n :host {\n display: flex;\n align-items: stretch;\n }\n div {\n width: 50%;\n height: 100%;\n }\n </style>\n <div id=\"start\"></div>\n <div id=\"end\"></div>\n `;\n }\n}\n\ncustomElements.define('start-end-contextmenu', StartEndContextmenu);\n\nexport const virtualElement = (args: Properties): TemplateResult => {\n const contextMenuTemplate = (kind = ''): TemplateResult => html`\n <sp-popover\n style=\"width:300px;\"\n @click=${(event: Event) =>\n event.target?.dispatchEvent(\n new Event('close', { bubbles: true })\n )}\n >\n <sp-menu>\n <sp-menu-group>\n <span slot=\"header\">Menu source: ${kind}</span>\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item>Select inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and mask...</sp-menu-item>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-item>Save selection</sp-menu-item>\n <sp-menu-item disabled>Make work path</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n </sp-popover>\n `;\n const pointerenter = async (event: PointerEvent): Promise<void> => {\n event.preventDefault();\n const source = event.composedPath()[0] as HTMLDivElement;\n const { id } = source;\n const trigger = event.target as HTMLElement;\n const virtualTrigger = new VirtualTrigger(event.clientX, event.clientY);\n const fragment = document.createDocumentFragment();\n render(contextMenuTemplate(id), fragment);\n const popover = fragment.querySelector('sp-popover') as Popover;\n openOverlay(trigger, 'modal', popover, {\n placement: args.placement,\n receivesFocus: 'auto',\n virtualTrigger,\n });\n };\n return html`\n <style>\n .app-root {\n position: absolute;\n inset: 0;\n }\n </style>\n <start-end-contextmenu\n class=\"app-root\"\n @contextmenu=${pointerenter}\n ></start-end-contextmenu>\n `;\n};\n\nvirtualElement.args = {\n placement: 'right-start' as Placement,\n};\n\nexport const detachedElement = (): TemplateResult => {\n let closeOverlay: (() => void) \| undefined;\n const openDetachedOverlayContent = async ({\n target,\n }: {\n target: HTMLElement;\n }): Promise<void> => {\n if (closeOverlay) {\n closeOverlay();\n closeOverlay = undefined;\n return;\n }\n const div = document.createElement('div');\n div.textContent = 'This div is overlaid';\n div.setAttribute(\n 'style',\n `\n background-color: var(--spectrum-global-color-gray-50);\n color: var(--spectrum-global-color-gray-800);\n border: 1px solid;\n padding: 2em;\n `\n );\n closeOverlay = await Overlay.open(target, 'click', div, {\n offset: 0,\n placement: 'bottom',\n });\n };\n requestAnimationFrame(() => {\n openDetachedOverlayContent({\n target: document.querySelector(\n '#detached-content-trigger'\n ) as HTMLElement,\n });\n });\n return html`\n <sp-action-button\n id=\"detached-content-trigger\"\n @click=${openDetachedOverlayContent}\n @sp-closed=${() => (closeOverlay = undefined)}\n >\n <sp-icon-open-in\n slot=\"icon\"\n label=\"Open in overlay\"\n ></sp-icon-open-in>\n </sp-action-button>\n `;\n};\n\nclass DefinedOverlayReady extends HTMLElement {\n ready!: (value: boolean \| PromiseLike<boolean>) => void;\n\n constructor() {\n super();\n this.readyPromise = new Promise((res) => {\n this.ready = res;\n this.setup();\n });\n }\n\n async setup(): Promise<void> {\n await nextFrame();\n\n const overlay = document.querySelector(\n `overlay-trigger`\n ) as OverlayTrigger;\n const button = document.querySelector(\n `[slot=\"trigger\"]`\n ) as HTMLButtonElement;\n overlay.addEventListener('sp-opened', this.handleTriggerOpened);\n button.click();\n }\n\n handleTriggerOpened = async (): Promise<void> => {\n await nextFrame();\n\n const popover = document.querySelector('popover-content');\n if (!popover) {\n return;\n }\n popover.addEventListener('sp-opened', this.handlePopoverOpen);\n popover.button.click();\n };\n\n handlePopoverOpen = async (): Promise<void> => {\n await nextFrame();\n\n this.ready(true);\n };\n\n private readyPromise: Promise<boolean> = Promise.resolve(false);\n\n get updateComplete(): Promise<boolean> {\n return this.readyPromise;\n }\n}\n\ncustomElements.define('defined-overlay-ready', DefinedOverlayReady);\n\nconst definedOverlayDecorator = (\n story: () => TemplateResult\n): TemplateResult => {\n return html`\n ${story()}\n <defined-overlay-ready></defined-overlay-ready>\n `;\n};\n\nexport const definedOverlayElement = (): TemplateResult => {\n return html`\n <overlay-trigger placement=\"bottom\" type=\"modal\">\n <sp-button variant=\"primary\" slot=\"trigger\">Open popover</sp-button>\n <sp-popover slot=\"click-content\" direction=\"bottom\" dialog>\n <popover-content></popover-content>\n </sp-popover>\n </overlay-trigger>\n `;\n};\n\ndefinedOverlayElement.decorators = [definedOverlayDecorator];\n"]}

package/test/overlay-trigger-hover.test.js CHANGED Viewed

@@ -9,7 +9,7 @@ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTA
 OF ANY KIND, either express or implied. See the License for the specific language
 governing permissions and limitations under the License.
 */
-import { elementUpdated, expect, fixture, html, waitUntil, } from '@open-wc/testing';
+import { aTimeout, elementUpdated, expect, fixture, html, oneEvent, waitUntil, } from '@open-wc/testing';
 import '@spectrum-web-components/popover/sp-popover.js';
 import '@spectrum-web-components/action-button/sp-action-button.js';
 import '@spectrum-web-components/icons-workflow/icons/sp-icon-magnify.js';
@@ -97,14 +97,15 @@ describe('Overlay Trigger - Hover', () => {
         await elementUpdated(el);
         expect(el.open).to.be.undefined;
         const trigger = el.querySelector('[slot="trigger"]');
-        trigger.dispatchEvent(new Event('mouseenter', {
-            bubbles: true,
-        }));
+        const opened = oneEvent(el, 'sp-opened');
+        trigger.focus();
+        await opened;
         await elementUpdated(el);
+        await aTimeout(500);
         expect(el.open).to.equal('hover');
-        trigger.dispatchEvent(new Event('mouseleave', {
-            bubbles: true,
-        }));
+        const closed = oneEvent(el, 'sp-closed');
+        trigger.blur();
+        await closed;
         await elementUpdated(el);
         expect(el.open).to.be.null;
     });

package/test/overlay-trigger-hover.test.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"overlay-trigger-hover.test.js","sourceRoot":"","sources":["overlay-trigger-hover.test.ts"],"names":[],"mappings":"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~~OAAO~~,CAAC,~~aAAa~~,~~CACjB~~,~~IAAI~~,~~KAAK~~,CAAC~~,YAAY,EAAE~~;~~YACpB~~,OAAO,EAAE,~~IAAI~~;~~SAChB~~,~~CAAC~~,~~CACL~~,CAAC;~~QAEF~~,MAAM,cAAc,CAAC,EAAE,CAAC,CAAC;~~QAEzB~~,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAElC,~~OAAO~~,CAAC,~~aAAa~~,~~CACjB~~,~~IAAI~~,~~KAAK~~,CAAC~~,YAAY,EAAE~~;~~YACpB~~,OAAO,~~EAAE~~,IAAI~~;SAChB~~,CAAC,~~CACL~~,CAAC;~~QAEF~~,MAAM,cAAc,CAAC,EAAE,CAAC,CAAC;QAEzB,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;IAC/B,CAAC,CAAC,CAAC;AACP,CAAC,CAAC,CAAC","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 elementUpdated,\n expect,\n fixture,\n html,\n waitUntil,\n} from '@open-wc/testing';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-magnify.js';\nimport { OverlayTrigger } from '..';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport { spy } from 'sinon';\nimport { ActionButton } from '@spectrum-web-components/action-button';\n\ndescribe('Overlay Trigger - Hover', () => {\n it('displays `hover` declaratively', async () => {\n const openedSpy = spy();\n const closedSpy = spy();\n const el = await fixture<OverlayTrigger>(\n (() => html`\n <overlay-trigger\n placement=\"right-start\"\n open=\"hover\"\n @sp-opened=${() => openedSpy()}\n @sp-closed=${() => closedSpy()}\n >\n <sp-action-button slot=\"trigger\">\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-popover slot=\"hover-content\" tip></sp-popover>\n </overlay-trigger>\n `)()\n );\n await elementUpdated(el);\n\n await waitUntil(\n () => openedSpy.calledOnce,\n 'hover content projected to overlay',\n { timeout: 2000 }\n );\n\n el.removeAttribute('open');\n await elementUpdated(el);\n\n await waitUntil(() => closedSpy.calledOnce, 'hover content returned', {\n timeout: 2000,\n });\n });\n it('persists hover content', async () => {\n const el = await fixture<OverlayTrigger>(\n (() => html`\n <overlay-trigger placement=\"right-start\">\n <sp-action-button slot=\"trigger\">\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-popover slot=\"hover-content\" tip></sp-popover>\n </overlay-trigger>\n `)()\n );\n await elementUpdated(el);\n\n expect(el.open).to.be.undefined;\n\n const trigger = el.querySelector('[slot=\"trigger\"]') as ActionButton;\n trigger.dispatchEvent(\n new Event('mouseenter', {\n bubbles: true,\n })\n );\n\n await elementUpdated(el);\n\n expect(el.open).to.equal('hover');\n\n trigger.click();\n\n await elementUpdated(el);\n\n expect(el.open).to.equal('hover');\n });\n it('closes persistent hover content on `longpress`', async () => {\n const el = await fixture<OverlayTrigger>(\n (() => html`\n <overlay-trigger placement=\"right-start\">\n <sp-action-button slot=\"trigger\">\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-popover slot=\"hover-content\" tip></sp-popover>\n <sp-popover slot=\"longpress-content\" tip></sp-popover>\n </overlay-trigger>\n `)()\n );\n await elementUpdated(el);\n\n expect(el.open).to.be.undefined;\n\n const trigger = el.querySelector('[slot=\"trigger\"]') as ActionButton;\n trigger.dispatchEvent(\n new Event('mouseenter', {\n bubbles: true,\n })\n );\n\n await elementUpdated(el);\n\n expect(el.open).to.equal('hover');\n\n trigger.dispatchEvent(\n new Event('longpress', {\n bubbles: true,\n })\n );\n\n await elementUpdated(el);\n\n expect(el.open).to.equal('longpress');\n });\n it('closes `hover` overlay when [type=\"modal\"]', async () => {\n const el = await fixture<OverlayTrigger>(\n (() => html`\n <overlay-trigger placement=\"right-start\" type=\"modal\">\n <sp-action-button slot=\"trigger\">\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-popover slot=\"hover-content\" tip></sp-popover>\n </overlay-trigger>\n `)()\n );\n await elementUpdated(el);\n\n expect(el.open).to.be.undefined;\n\n const trigger = el.querySelector('[slot=\"trigger\"]') as ActionButton;\n ~~trigger.dispatchEvent~~(~~\n new~~ ~~Event(~~'~~mouseenter~~'~~, {\n bubbles: true,\n }~~)\n );\n\n await elementUpdated(el);\n\n expect(el.open).to.equal('hover');\n\n ~~trigger.dispatchEvent~~(~~\n new~~ ~~Event(~~'~~mouseleave~~'~~, {\n bubbles: true,\n }~~)\n );\n\n await elementUpdated(el);\n\n expect(el.open).to.be.null;\n });\n});\n"]}
1	+ {"version":3,"file":"overlay-trigger-hover.test.js","sourceRoot":"","sources":["overlay-trigger-hover.test.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n/\nimport {\n aTimeout,\n elementUpdated,\n expect,\n fixture,\n html,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-magnify.js';\nimport { OverlayTrigger } from '..';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport { spy } from 'sinon';\nimport { ActionButton } from '@spectrum-web-components/action-button';\n\ndescribe('Overlay Trigger - Hover', () => {\n it('displays `hover` declaratively', async () => {\n const openedSpy = spy();\n const closedSpy = spy();\n const el = await fixture<OverlayTrigger>(\n (() => html`\n <overlay-trigger\n placement=\"right-start\"\n open=\"hover\"\n @sp-opened=${() => openedSpy()}\n @sp-closed=${() => closedSpy()}\n >\n <sp-action-button slot=\"trigger\">\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-popover slot=\"hover-content\" tip></sp-popover>\n </overlay-trigger>\n `)()\n );\n await elementUpdated(el);\n\n await waitUntil(\n () => openedSpy.calledOnce,\n 'hover content projected to overlay',\n { timeout: 2000 }\n );\n\n el.removeAttribute('open');\n await elementUpdated(el);\n\n await waitUntil(() => closedSpy.calledOnce, 'hover content returned', {\n timeout: 2000,\n });\n });\n it('persists hover content', async () => {\n const el = await fixture<OverlayTrigger>(\n (() => html`\n <overlay-trigger placement=\"right-start\">\n <sp-action-button slot=\"trigger\">\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-popover slot=\"hover-content\" tip></sp-popover>\n </overlay-trigger>\n `)()\n );\n await elementUpdated(el);\n\n expect(el.open).to.be.undefined;\n\n const trigger = el.querySelector('[slot=\"trigger\"]') as ActionButton;\n trigger.dispatchEvent(\n new Event('mouseenter', {\n bubbles: true,\n })\n );\n\n await elementUpdated(el);\n\n expect(el.open).to.equal('hover');\n\n trigger.click();\n\n await elementUpdated(el);\n\n expect(el.open).to.equal('hover');\n });\n it('closes persistent hover content on `longpress`', async () => {\n const el = await fixture<OverlayTrigger>(\n (() => html`\n <overlay-trigger placement=\"right-start\">\n <sp-action-button slot=\"trigger\">\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-popover slot=\"hover-content\" tip></sp-popover>\n <sp-popover slot=\"longpress-content\" tip></sp-popover>\n </overlay-trigger>\n `)()\n );\n await elementUpdated(el);\n\n expect(el.open).to.be.undefined;\n\n const trigger = el.querySelector('[slot=\"trigger\"]') as ActionButton;\n trigger.dispatchEvent(\n new Event('mouseenter', {\n bubbles: true,\n })\n );\n\n await elementUpdated(el);\n\n expect(el.open).to.equal('hover');\n\n trigger.dispatchEvent(\n new Event('longpress', {\n bubbles: true,\n })\n );\n\n await elementUpdated(el);\n\n expect(el.open).to.equal('longpress');\n });\n it('closes `hover` overlay when [type=\"modal\"]', async () => {\n const el = await fixture<OverlayTrigger>(\n (() => html`\n <overlay-trigger placement=\"right-start\" type=\"modal\">\n <sp-action-button slot=\"trigger\">\n <sp-icon-magnify slot=\"icon\"></sp-icon-magnify>\n </sp-action-button>\n <sp-popover slot=\"hover-content\" tip></sp-popover>\n </overlay-trigger>\n `)()\n );\n await elementUpdated(el);\n\n expect(el.open).to.be.undefined;\n\n const trigger = el.querySelector('[slot=\"trigger\"]') as ActionButton;\n const opened = oneEvent(el, 'sp-opened');\n trigger.focus();\n await opened;\n\n await elementUpdated(el);\n await aTimeout(500);\n\n expect(el.open).to.equal('hover');\n\n const closed = oneEvent(el, 'sp-closed');\n trigger.blur();\n await closed;\n\n await elementUpdated(el);\n\n expect(el.open).to.be.null;\n });\n});\n"]}

package/test/overlay.test.js CHANGED Viewed

@@ -12,6 +12,7 @@ governing permissions and limitations under the License.
 import '@spectrum-web-components/button/sp-button.js';
 import '@spectrum-web-components/dialog/sp-dialog.js';
 import '@spectrum-web-components/popover/sp-popover.js';
+import { setViewport } from '@web/test-runner-commands';
 import { Overlay } from '../';
 import { isVisible, waitForPredicate } from '../../../test/testing-helpers.js';
 import { elementUpdated, expect, fixture, html, nextFrame, oneEvent, waitUntil, } from '@open-wc/testing';
@@ -353,7 +354,7 @@ describe('Overlay - type="modal"', () => {
         const width = window.innerWidth;
         const height = window.innerHeight;
         let opened = oneEvent(document, 'sp-opened');
-        // Right click to over "context menu" overlay.
+        // Right click to open "context menu" overlay.
         sendMouse({
             steps: [
                 {
@@ -420,6 +421,41 @@ describe('Overlay - type="modal"', () => {
         await closed;
         await nextFrame();
     });
+    it('does not open content off of the viewport', async () => {
+        await fixture(html `
+            ${virtualElement(Object.assign(Object.assign({}, virtualElement.args), { offset: 6 }))}
+        `);
+        await setViewport({ width: 360, height: 640 });
+        // Allow viewport update to propagate.
+        await nextFrame();
+        const opened = oneEvent(document, 'sp-opened');
+        // Right click to open "context menu" overlay.
+        sendMouse({
+            steps: [
+                {
+                    type: 'move',
+                    position: [270, 10],
+                },
+                {
+                    type: 'click',
+                    options: {
+                        button: 'right',
+                    },
+                    position: [270, 10],
+                },
+            ],
+        });
+        await opened;
+        const activeOverlay = document.querySelector('active-overlay');
+        expect(activeOverlay.placement).to.equal('right-start');
+        expect(activeOverlay.getAttribute('actual-placement')).to.equal('bottom');
+        const closed = oneEvent(document, 'sp-closed');
+        sendKeys({
+            press: 'Escape',
+        });
+        await closed;
+        await nextFrame();
+    });
     it('opens children in the modal stack through shadow roots', async () => {
         const el = await fixture(definedOverlayElement());
         const trigger = el.querySelector('[slot="trigger"]');

package/test/overlay.test.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"overlay.test.js","sourceRoot":"","sources":["overlay.test.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n/\nimport '@spectrum-web-components/button/sp-button.js';\nimport '@spectrum-web-components/dialog/sp-dialog.js';\nimport { Dialog } from '@spectrum-web-components/dialog';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport { Popover } from '@spectrum-web-components/popover';\nimport { ActiveOverlay, Overlay, OverlayTrigger, Placement } from '../';\n\nimport { isVisible, waitForPredicate } from '../../../test/testing-helpers.js';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n nextFrame,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\nimport { sendKeys } from '@web/test-runner-commands';\nimport {\n definedOverlayElement,\n virtualElement,\n} from '../stories/overlay.stories';\nimport { PopoverContent } from '../stories/overlay-story-components.js';\nimport { sendMouse } from '../../../test/plugins/browser.js';\n\ndescribe('Overlays', () => {\n let testDiv!: HTMLDivElement;\n let openOverlays: (() => void)[] = [];\n\n beforeEach(async () => {\n testDiv = await fixture<HTMLDivElement>(\n html`\n <div id=\"top\">\n <style>\n body {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n #top {\n margin: 100px;\n }\n\n sp-button {\n flex: none;\n }\n\n #overlay-content {\n display: none;\n }\n </style>\n <sp-button\n id=\"first-button\"\n variant=\"primary\"\n slot=\"trigger\"\n >\n Show Popover\n </sp-button>\n <div id=\"overlay-content\">\n <sp-popover\n id=\"outer-popover\"\n dialog\n slot=\"click-content\"\n direction=\"bottom\"\n tip\n open\n >\n <div class=\"options-popover-content\">\n A popover message\n </div>\n </sp-popover>\n <div id=\"hover-1\" class=\"hover-content\">\n Hover message\n </div>\n <div id=\"hover-2\" class=\"hover-content\">\n Other hover message\n </div>\n </div>\n </div>\n `\n );\n await elementUpdated(testDiv);\n });\n\n afterEach(() => {\n openOverlays.map((close) => close());\n openOverlays = [];\n });\n\n [\n 'bottom',\n 'bottom-start',\n 'bottom-end',\n 'top',\n 'top-start',\n 'top-end',\n 'left',\n 'left-start',\n 'left-end',\n 'right',\n 'right-start',\n 'right-end',\n 'none',\n ].map((direction) => {\n const placement = direction as Placement;\n it(`opens a popover - ${placement}`, async () => {\n const button = testDiv.querySelector(\n '#first-button'\n ) as HTMLElement;\n const outerPopover = testDiv.querySelector(\n '#outer-popover'\n ) as Popover;\n\n expect(outerPopover.parentElement).to.exist;\n if (outerPopover.parentElement) {\n expect(outerPopover.parentElement.id).to.equal(\n 'overlay-content'\n );\n }\n\n expect(isVisible(outerPopover)).to.be.false;\n\n expect(button).to.exist;\n\n openOverlays.push(\n await Overlay.open(button, 'click', outerPopover, {\n delayed: false,\n placement,\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n outerPopover.parentElement &&\n outerPopover.parentElement.id !== 'overlay-content'\n )\n );\n\n expect(outerPopover.parentElement).to.exist;\n if (outerPopover.parentElement) {\n expect(outerPopover.parentElement.id).not.to.equal(\n 'overlay-content'\n );\n }\n expect(isVisible(outerPopover)).to.be.true;\n });\n });\n\n it(`updates a popover`, async () => {\n const button = testDiv.querySelector('#first-button') as HTMLElement;\n const outerPopover = testDiv.querySelector('#outer-popover') as Popover;\n\n expect(outerPopover.parentElement).to.exist;\n if (outerPopover.parentElement) {\n expect(outerPopover.parentElement.id).to.equal('overlay-content');\n }\n\n expect(isVisible(outerPopover)).to.be.false;\n\n expect(button).to.exist;\n\n openOverlays.push(\n await Overlay.open(button, 'click', outerPopover, {\n delayed: false,\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n outerPopover.parentElement &&\n outerPopover.parentElement.id !== 'overlay-content'\n )\n );\n\n expect(isVisible(outerPopover)).to.be.true;\n\n Overlay.update();\n\n expect(isVisible(outerPopover)).to.be.true;\n });\n\n it(`opens a popover w/ delay`, async () => {\n const button = testDiv.querySelector('#first-button') as HTMLElement;\n const outerPopover = testDiv.querySelector('#outer-popover') as Popover;\n\n expect(outerPopover.parentElement).to.exist;\n if (outerPopover.parentElement) {\n expect(outerPopover.parentElement.id).to.equal('overlay-content');\n }\n\n expect(isVisible(outerPopover)).to.be.false;\n\n expect(button).to.exist;\n\n openOverlays.push(\n await Overlay.open(button, 'click', outerPopover, {\n delayed: true,\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitUntil(\n () =>\n !!(\n outerPopover.parentElement &&\n outerPopover.parentElement.id !== 'overlay-content'\n ),\n 'overlay opened'\n );\n\n expect(outerPopover.parentElement).to.exist;\n if (outerPopover.parentElement) {\n expect(outerPopover.parentElement.id).not.to.equal(\n 'overlay-content'\n );\n }\n expect(isVisible(outerPopover)).to.be.true;\n });\n\n it('opens hover overlay', async () => {\n const button = testDiv.querySelector('#first-button') as HTMLElement;\n const hoverOverlay = testDiv.querySelector('#hover-1') as HTMLElement;\n const clickOverlay = testDiv.querySelector(\n '#outer-popover'\n ) as HTMLElement;\n\n expect(button).to.exist;\n expect(hoverOverlay).to.exist;\n\n expect(isVisible(hoverOverlay)).to.be.false;\n expect(isVisible(clickOverlay)).to.be.false;\n\n openOverlays.push(\n await Overlay.open(button, 'hover', hoverOverlay, {\n delayed: false,\n placement: 'top',\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n hoverOverlay.parentElement &&\n hoverOverlay.parentElement.id !== 'overlay-content'\n )\n );\n\n expect(hoverOverlay.parentElement).to.exist;\n if (hoverOverlay.parentElement) {\n expect(hoverOverlay.parentElement.id).not.to.equal(\n 'overlay-content'\n );\n }\n expect(isVisible(hoverOverlay)).to.be.true;\n\n // Opening click overlay should close the hover overlay\n openOverlays.push(\n await Overlay.open(button, 'click', clickOverlay, {\n delayed: false,\n placement: 'bottom',\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n clickOverlay.parentElement &&\n clickOverlay.parentElement.id !== 'overlay-content' &&\n hoverOverlay.parentElement &&\n hoverOverlay.parentElement.id === 'overlay-content'\n )\n );\n\n if (hoverOverlay.parentElement) {\n expect(hoverOverlay.parentElement.id).to.equal('overlay-content');\n }\n\n expect(isVisible(hoverOverlay)).to.be.false;\n expect(isVisible(clickOverlay)).to.be.true;\n });\n\n it('opens custom overlay', async () => {\n const button = testDiv.querySelector('#first-button') as HTMLElement;\n const customOverlay = testDiv.querySelector('#hover-1') as HTMLElement;\n const clickOverlay = testDiv.querySelector(\n '#outer-popover'\n ) as HTMLElement;\n\n expect(button).to.exist;\n expect(customOverlay).to.exist;\n\n expect(isVisible(customOverlay)).to.be.false;\n expect(isVisible(clickOverlay)).to.be.false;\n\n openOverlays.push(\n await Overlay.open(button, 'custom', customOverlay, {\n delayed: false,\n placement: 'top',\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n customOverlay.parentElement &&\n customOverlay.parentElement.id !== 'overlay-content'\n )\n );\n\n expect(customOverlay.parentElement).to.exist;\n if (customOverlay.parentElement) {\n expect(customOverlay.parentElement.id).not.to.equal(\n 'overlay-content'\n );\n }\n expect(isVisible(customOverlay)).to.be.true;\n\n // Opening click overlay should close the hover overlay\n openOverlays.push(\n await Overlay.open(button, 'click', clickOverlay, {\n delayed: false,\n placement: 'bottom',\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n clickOverlay.parentElement &&\n clickOverlay.parentElement.id !== 'overlay-content'\n )\n );\n\n expect(isVisible(customOverlay)).to.be.true;\n expect(isVisible(clickOverlay)).to.be.true;\n });\n\n it('closes via events', async () => {\n const el = await fixture<HTMLDivElement>(html`\n <div id=\"root\">\n <sp-dialog dismissable></sp-dialog>\n </div>\n `);\n\n const dialog = el.querySelector('sp-dialog') as Dialog;\n\n openOverlays.push(\n await Overlay.open(el, 'click', dialog, {\n delayed: false,\n placement: 'bottom',\n offset: 10,\n })\n );\n\n await waitUntil(\n () =>\n !!dialog.parentElement &&\n dialog.parentElement.tagName === 'ACTIVE-OVERLAY',\n 'content is stolen'\n );\n\n dialog.close();\n\n await waitUntil(\n () =>\n !!dialog.parentElement &&\n dialog.parentElement.tagName !== 'ACTIVE-OVERLAY',\n 'content is returned'\n );\n });\n\n it('closes an inline overlay when tabbing past the content', async () => {\n const el = await fixture<HTMLDivElement>(html`\n <div>\n <sp-button class=\"trigger\">Trigger</sp-button>\n <div class=\"content\">\n <input />\n </div>\n <input value=\"After\" id=\"after\" />\n </div>\n `);\n\n const trigger = el.querySelector('.trigger') as HTMLElement;\n const content = el.querySelector('.content') as HTMLElement;\n const input = el.querySelector('input') as HTMLInputElement;\n const after = el.querySelector('#after') as HTMLAnchorElement;\n\n openOverlays.push(await Overlay.open(trigger, 'inline', content, {}));\n\n trigger.focus();\n await sendKeys({\n press: 'Tab',\n });\n\n expect(document.activeElement).to.equal(input);\n expect(input.closest('active-overlay') !== null);\n\n await sendKeys({\n press: 'Shift+Tab',\n });\n\n expect(document.activeElement).to.equal(trigger);\n\n await sendKeys({\n press: 'Tab',\n });\n\n expect(document.activeElement).to.equal(input);\n\n await sendKeys({\n press: 'Tab',\n });\n\n expect(document.activeElement).to.equal(after);\n await waitUntil(\n () => document.querySelector('active-overlay') === null\n );\n });\n\n it('closes an inline overlay when tabbing before the trigger', async () => {\n const el = await fixture<HTMLDivElement>(html`\n <div>\n <input value=\"Before\" id=\"before\" />\n <sp-button class=\"trigger\">Trigger</sp-button>\n <div class=\"content\">\n <label>\n Content in an inline overlay.\n <input />\n </label>\n </div>\n </div>\n `);\n\n const trigger = el.querySelector('.trigger') as HTMLElement;\n const content = el.querySelector('.content') as HTMLElement;\n const input = el.querySelector('.content input') as HTMLInputElement;\n const before = el.querySelector('#before') as HTMLAnchorElement;\n\n openOverlays.push(await Overlay.open(trigger, 'inline', content, {}));\n\n trigger.focus();\n await sendKeys({\n press: 'Tab',\n });\n\n expect(document.activeElement).to.equal(input);\n expect(input.closest('active-overlay') !== null);\n\n await sendKeys({\n press: 'Shift+Tab',\n });\n\n expect(document.activeElement).to.equal(trigger);\n\n await sendKeys({\n press: 'Shift+Tab',\n });\n\n expect(document.activeElement).to.equal(before);\n await waitUntil(\n () => document.querySelector('active-overlay') === null\n );\n });\n\n it('opens detached content', async () => {\n const textContent = 'This is a detached element that has been overlaid';\n const el = await fixture<HTMLButtonElement>(\n html`\n <button>Trigger</button>\n `\n );\n\n const content = document.createElement('div');\n content.textContent = textContent;\n\n const opened = oneEvent(el, 'sp-opened');\n const closeOverlay = await Overlay.open(el, 'click', content, {\n placement: 'bottom',\n });\n await opened;\n\n let activeOverlay = document.querySelector('active-overlay');\n\n if (activeOverlay) {\n expect(activeOverlay.textContent).to.equal(textContent);\n } else {\n expect(activeOverlay).to.not.be.null;\n }\n\n const closed = oneEvent(el, 'sp-closed');\n closeOverlay();\n await closed;\n\n activeOverlay = document.querySelector('active-overlay');\n\n expect(activeOverlay).to.be.null;\n\n content.remove();\n });\n});\ndescribe('Overlay - type=\"modal\"', () => {\n it('closes on `contextmenu` and passes that to the underlying page', async () => {\n await fixture<HTMLDivElement>(html`\n ${virtualElement({\n ...virtualElement.args,\n offset: 6,\n })}\n `);\n const width = window.innerWidth;\n const height = window.innerHeight;\n let opened = oneEvent(document, 'sp-opened');\n // Right click to over \"context menu\" overlay.\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [width / 2 + 50, height / 2],\n },\n {\n type: 'click',\n options: {\n button: 'right',\n },\n position: [width / 2 + 50, height / 2],\n },\n ],\n });\n await opened;\n const firstOverlay = document.querySelector(\n 'active-overlay'\n ) as ActiveOverlay;\n const firstHeadline = firstOverlay.querySelector(\n '[slot=\"header\"]'\n ) as HTMLSpanElement;\n expect(firstOverlay, 'first overlay').to.not.be.null;\n expect(firstOverlay.isConnected).to.be.true;\n expect(firstHeadline.textContent).to.equal('Menu source: end');\n let closed = oneEvent(document, 'sp-closed');\n opened = oneEvent(document, 'sp-opened');\n // Right click to out of the \"context menu\" overlay to both close\n // the first overlay and have the event passed to the surfacing page\n // in order to open a subsequent \"context menu\" overlay.\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [width / 4, height / 4],\n },\n {\n type: 'click',\n options: {\n button: 'right',\n },\n position: [width / 4, height / 4],\n },\n ],\n });\n await closed;\n await opened;\n const secondOverlay = document.querySelector(\n 'active-overlay'\n ) as ActiveOverlay;\n const secondHeadline = secondOverlay.querySelector(\n '[slot=\"header\"]'\n ) as HTMLSpanElement;\n expect(secondOverlay, 'second overlay').to.not.be.null;\n expect(secondOverlay).to.not.equal(firstOverlay);\n expect(firstOverlay.isConnected).to.be.false;\n expect(secondOverlay.isConnected).to.be.true;\n expect(secondHeadline.textContent).to.equal('Menu source: start');\n closed = oneEvent(document, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [width / 8, height / 8],\n },\n {\n type: 'click',\n position: [width / 8, height / 8],\n },\n ],\n });\n await closed;\n await nextFrame();\n });\n it('opens children in the modal stack through shadow roots', async () => {\n const el = await fixture<OverlayTrigger>(definedOverlayElement());\n const trigger = el.querySelector(\n '[slot=\"trigger\"]'\n ) as HTMLButtonElement;\n let open = oneEvent(el, 'sp-opened');\n trigger.click();\n await open;\n const content = document.querySelector(\n 'popover-content'\n ) as PopoverContent;\n open = oneEvent(content, 'sp-opened');\n content.button.click();\n await open;\n const activeOverlays = document.querySelectorAll('active-overlay');\n activeOverlays.forEach((overlay) => {\n expect(overlay.slot).to.equal('open');\n });\n let close = oneEvent(content, 'sp-closed');\n content.trigger.removeAttribute('open');\n await close;\n close = oneEvent(el, 'sp-closed');\n el.removeAttribute('open');\n await close;\n });\n});\ndescribe('Overlay - timing', () => {\n it('manages multiple modals in a row without preventing them from closing', async () => {\n const test = await fixture<HTMLDivElement>(html`\n <div>\n <overlay-trigger>\n <sp-button slot=\"trigger\">Trigger 1</sp-button>\n <sp-popover slot=\"hover-content\">\n <p>Hover contentent for \"Trigger 1\".</p>\n </sp-popover>\n </overlay-trigger>\n <overlay-trigger>\n <sp-button slot=\"trigger\">Trigger 2</sp-button>\n <sp-popover slot=\"hover-content\">\n <p>Hover contentent for \"Trigger 2\".</p>\n </sp-popover>\n <sp-popover slot=\"click-content\">\n <p>Click contentent for \"Trigger 2\".</p>\n </sp-popover>\n </overlay-trigger>\n </div>\n `);\n\n const overlayTrigger1 = test.querySelector(\n 'overlay-trigger:first-child'\n ) as OverlayTrigger;\n const overlayTrigger2 = test.querySelector(\n 'overlay-trigger:last-child'\n ) as OverlayTrigger;\n const trigger1 = overlayTrigger1.querySelector(\n '[slot=\"trigger\"]'\n ) as HTMLButtonElement;\n const trigger2 = overlayTrigger2.querySelector(\n '[slot=\"trigger\"]'\n ) as HTMLButtonElement;\n\n const boundingRectTrigger1 = trigger1.getBoundingClientRect();\n const boundingRectTrigger2 = trigger2.getBoundingClientRect();\n const trigger1Position: [number, number] = [\n boundingRectTrigger1.left + boundingRectTrigger1.width / 2,\n boundingRectTrigger1.top + boundingRectTrigger1.height / 2,\n ];\n const outsideTrigger1: [number, number] = [\n boundingRectTrigger1.left + boundingRectTrigger1.width * 2,\n boundingRectTrigger1.top + boundingRectTrigger1.height * 2,\n ];\n const trigger2Position: [number, number] = [\n boundingRectTrigger2.left + boundingRectTrigger2.width / 2,\n boundingRectTrigger2.top + boundingRectTrigger2.height / 2,\n ];\n const outsideTrigger2: [number, number] = [\n boundingRectTrigger2.left + boundingRectTrigger2.width * 2,\n boundingRectTrigger2.top + boundingRectTrigger2.height / 2,\n ];\n\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: trigger1Position,\n },\n ],\n });\n await nextFrame();\n await nextFrame();\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: outsideTrigger1,\n },\n ],\n });\n await nextFrame();\n await nextFrame();\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: trigger2Position,\n },\n ],\n });\n await nextFrame();\n await nextFrame();\n const opened = oneEvent(trigger2, 'sp-opened');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: trigger2Position,\n },\n ],\n });\n await opened;\n\n expect(overlayTrigger1.hasAttribute('open')).to.be.false;\n expect(overlayTrigger2.hasAttribute('open')).to.be.true;\n expect(overlayTrigger2.getAttribute('open')).to.equal('click');\n\n const closed = oneEvent(overlayTrigger2, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: outsideTrigger2,\n },\n ],\n });\n await closed;\n\n // sometimes safari needs to wait a few frames for the open attribute to update\n for (let i = 0; i < 3; i++) await nextFrame();\n\n expect(overlayTrigger1.hasAttribute('open')).to.be.false;\n expect(overlayTrigger2.hasAttribute('open'), overlayTrigger2.open).to.be\n .false;\n });\n});\n"]}
1	+ {"version":3,"file":"overlay.test.js","sourceRoot":"","sources":["overlay.test.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,8CAA8C,CAAC;AACtD,OAAO,8CAA8C,CAAC;AAEtD,OAAO,gDAAgD,CAAC;AAExD,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAiB,OAAO,EAA6B,MAAM,KAAK,CAAC;AAExE,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EACH,cAAc,EACd,MAAM,EACN,OAAO,EACP,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,SAAS,GACZ,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AACrD,OAAO,EACH,qBAAqB,EACrB,cAAc,GACjB,MAAM,4BAA4B,CAAC;AAEpC,OAAO,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAE7D,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;IACtB,IAAI,OAAwB,CAAC;IAC7B,IAAI,YAAY,GAAmB,EAAE,CAAC;IAEtC,UAAU,CAAC,KAAK,IAAI,EAAE;QAClB,OAAO,GAAG,MAAM,OAAO,CACnB,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;aAiDH,CACJ,CAAC;QACF,MAAM,cAAc,CAAC,OAAO,CAAC,CAAC;IAClC,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACX,YAAY,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC;QACrC,YAAY,GAAG,EAAE,CAAC;IACtB,CAAC,CAAC,CAAC;IAEH;QACI,QAAQ;QACR,cAAc;QACd,YAAY;QACZ,KAAK;QACL,WAAW;QACX,SAAS;QACT,MAAM;QACN,YAAY;QACZ,UAAU;QACV,OAAO;QACP,aAAa;QACb,WAAW;QACX,MAAM;KACT,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE;QAChB,MAAM,SAAS,GAAG,SAAsB,CAAC;QACzC,EAAE,CAAC,qBAAqB,SAAS,EAAE,EAAE,KAAK,IAAI,EAAE;YAC5C,MAAM,MAAM,GAAG,OAAO,CAAC,aAAa,CAChC,eAAe,CACH,CAAC;YACjB,MAAM,YAAY,GAAG,OAAO,CAAC,aAAa,CACtC,gBAAgB,CACR,CAAC;YAEb,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YAC5C,IAAI,YAAY,CAAC,aAAa,EAAE;gBAC5B,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAC1C,iBAAiB,CACpB,CAAC;aACL;YAED,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;YAE5C,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YAExB,YAAY,CAAC,IAAI,CACb,MAAM,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE;gBAC9C,OAAO,EAAE,KAAK;gBACd,SAAS;gBACT,MAAM,EAAE,EAAE;aACb,CAAC,CACL,CAAC;YAEF,qEAAqE;YACrE,MAAM,gBAAgB,CAClB,GAAG,EAAE,CACD,CAAC,CAAC,CACE,YAAY,CAAC,aAAa;gBAC1B,YAAY,CAAC,aAAa,CAAC,EAAE,KAAK,iBAAiB,CACtD,CACR,CAAC;YAEF,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;YAC5C,IAAI,YAAY,CAAC,aAAa,EAAE;gBAC5B,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,KAAK,CAC9C,iBAAiB,CACpB,CAAC;aACL;YACD,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QAC/C,CAAC,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mBAAmB,EAAE,KAAK,IAAI,EAAE;QAC/B,MAAM,MAAM,GAAG,OAAO,CAAC,aAAa,CAAC,eAAe,CAAgB,CAAC;QACrE,MAAM,YAAY,GAAG,OAAO,CAAC,aAAa,CAAC,gBAAgB,CAAY,CAAC;QAExE,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAC5C,IAAI,YAAY,CAAC,aAAa,EAAE;YAC5B,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAAC;SACrE;QAED,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;QAE5C,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAExB,YAAY,CAAC,IAAI,CACb,MAAM,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE;YAC9C,OAAO,EAAE,KAAK;YACd,MAAM,EAAE,EAAE;SACb,CAAC,CACL,CAAC;QAEF,qEAAqE;QACrE,MAAM,gBAAgB,CAClB,GAAG,EAAE,CACD,CAAC,CAAC,CACE,YAAY,CAAC,aAAa;YAC1B,YAAY,CAAC,aAAa,CAAC,EAAE,KAAK,iBAAiB,CACtD,CACR,CAAC;QAEF,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QAE3C,OAAO,CAAC,MAAM,EAAE,CAAC;QAEjB,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,0BAA0B,EAAE,KAAK,IAAI,EAAE;QACtC,MAAM,MAAM,GAAG,OAAO,CAAC,aAAa,CAAC,eAAe,CAAgB,CAAC;QACrE,MAAM,YAAY,GAAG,OAAO,CAAC,aAAa,CAAC,gBAAgB,CAAY,CAAC;QAExE,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAC5C,IAAI,YAAY,CAAC,aAAa,EAAE;YAC5B,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAAC;SACrE;QAED,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;QAE5C,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAExB,YAAY,CAAC,IAAI,CACb,MAAM,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE;YAC9C,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,EAAE;SACb,CAAC,CACL,CAAC;QAEF,qEAAqE;QACrE,MAAM,SAAS,CACX,GAAG,EAAE,CACD,CAAC,CAAC,CACE,YAAY,CAAC,aAAa;YAC1B,YAAY,CAAC,aAAa,CAAC,EAAE,KAAK,iBAAiB,CACtD,EACL,gBAAgB,CACnB,CAAC;QAEF,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAC5C,IAAI,YAAY,CAAC,aAAa,EAAE;YAC5B,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,KAAK,CAC9C,iBAAiB,CACpB,CAAC;SACL;QACD,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qBAAqB,EAAE,KAAK,IAAI,EAAE;QACjC,MAAM,MAAM,GAAG,OAAO,CAAC,aAAa,CAAC,eAAe,CAAgB,CAAC;QACrE,MAAM,YAAY,GAAG,OAAO,CAAC,aAAa,CAAC,UAAU,CAAgB,CAAC;QACtE,MAAM,YAAY,GAAG,OAAO,CAAC,aAAa,CACtC,gBAAgB,CACJ,CAAC;QAEjB,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QACxB,MAAM,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAE9B,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;QAC5C,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;QAE5C,YAAY,CAAC,IAAI,CACb,MAAM,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE;YAC9C,OAAO,EAAE,KAAK;YACd,SAAS,EAAE,KAAK;YAChB,MAAM,EAAE,EAAE;SACb,CAAC,CACL,CAAC;QAEF,qEAAqE;QACrE,MAAM,gBAAgB,CAClB,GAAG,EAAE,CACD,CAAC,CAAC,CACE,YAAY,CAAC,aAAa;YAC1B,YAAY,CAAC,aAAa,CAAC,EAAE,KAAK,iBAAiB,CACtD,CACR,CAAC;QAEF,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAC5C,IAAI,YAAY,CAAC,aAAa,EAAE;YAC5B,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,KAAK,CAC9C,iBAAiB,CACpB,CAAC;SACL;QACD,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QAE3C,uDAAuD;QACvD,YAAY,CAAC,IAAI,CACb,MAAM,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE;YAC9C,OAAO,EAAE,KAAK;YACd,SAAS,EAAE,QAAQ;YACnB,MAAM,EAAE,EAAE;SACb,CAAC,CACL,CAAC;QAEF,qEAAqE;QACrE,MAAM,gBAAgB,CAClB,GAAG,EAAE,CACD,CAAC,CAAC,CACE,YAAY,CAAC,aAAa;YAC1B,YAAY,CAAC,aAAa,CAAC,EAAE,KAAK,iBAAiB;YACnD,YAAY,CAAC,aAAa;YAC1B,YAAY,CAAC,aAAa,CAAC,EAAE,KAAK,iBAAiB,CACtD,CACR,CAAC;QAEF,IAAI,YAAY,CAAC,aAAa,EAAE;YAC5B,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAAC;SACrE;QAED,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;QAC5C,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,sBAAsB,EAAE,KAAK,IAAI,EAAE;QAClC,MAAM,MAAM,GAAG,OAAO,CAAC,aAAa,CAAC,eAAe,CAAgB,CAAC;QACrE,MAAM,aAAa,GAAG,OAAO,CAAC,aAAa,CAAC,UAAU,CAAgB,CAAC;QACvE,MAAM,YAAY,GAAG,OAAO,CAAC,aAAa,CACtC,gBAAgB,CACJ,CAAC;QAEjB,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QACxB,MAAM,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAE/B,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;QAC7C,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;QAE5C,YAAY,CAAC,IAAI,CACb,MAAM,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,aAAa,EAAE;YAChD,OAAO,EAAE,KAAK;YACd,SAAS,EAAE,KAAK;YAChB,MAAM,EAAE,EAAE;SACb,CAAC,CACL,CAAC;QAEF,qEAAqE;QACrE,MAAM,gBAAgB,CAClB,GAAG,EAAE,CACD,CAAC,CAAC,CACE,aAAa,CAAC,aAAa;YAC3B,aAAa,CAAC,aAAa,CAAC,EAAE,KAAK,iBAAiB,CACvD,CACR,CAAC;QAEF,MAAM,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAC7C,IAAI,aAAa,CAAC,aAAa,EAAE;YAC7B,MAAM,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,KAAK,CAC/C,iBAAiB,CACpB,CAAC;SACL;QACD,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QAE5C,uDAAuD;QACvD,YAAY,CAAC,IAAI,CACb,MAAM,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE;YAC9C,OAAO,EAAE,KAAK;YACd,SAAS,EAAE,QAAQ;YACnB,MAAM,EAAE,EAAE;SACb,CAAC,CACL,CAAC;QAEF,qEAAqE;QACrE,MAAM,gBAAgB,CAClB,GAAG,EAAE,CACD,CAAC,CAAC,CACE,YAAY,CAAC,aAAa;YAC1B,YAAY,CAAC,aAAa,CAAC,EAAE,KAAK,iBAAiB,CACtD,CACR,CAAC;QAEF,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QAC5C,MAAM,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mBAAmB,EAAE,KAAK,IAAI,EAAE;QAC/B,MAAM,EAAE,GAAG,MAAM,OAAO,CAAiB,IAAI,CAAA;;;;SAI5C,CAAC,CAAC;QAEH,MAAM,MAAM,GAAG,EAAE,CAAC,aAAa,CAAC,WAAW,CAAW,CAAC;QAEvD,YAAY,CAAC,IAAI,CACb,MAAM,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;YACpC,OAAO,EAAE,KAAK;YACd,SAAS,EAAE,QAAQ;YACnB,MAAM,EAAE,EAAE;SACb,CAAC,CACL,CAAC;QAEF,MAAM,SAAS,CACX,GAAG,EAAE,CACD,CAAC,CAAC,MAAM,CAAC,aAAa;YACtB,MAAM,CAAC,aAAa,CAAC,OAAO,KAAK,gBAAgB,EACrD,mBAAmB,CACtB,CAAC;QAEF,MAAM,CAAC,KAAK,EAAE,CAAC;QAEf,MAAM,SAAS,CACX,GAAG,EAAE,CACD,CAAC,CAAC,MAAM,CAAC,aAAa;YACtB,MAAM,CAAC,aAAa,CAAC,OAAO,KAAK,gBAAgB,EACrD,qBAAqB,CACxB,CAAC;IACN,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wDAAwD,EAAE,KAAK,IAAI,EAAE;QACpE,MAAM,EAAE,GAAG,MAAM,OAAO,CAAiB,IAAI,CAAA;;;;;;;;SAQ5C,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,UAAU,CAAgB,CAAC;QAC5D,MAAM,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,UAAU,CAAgB,CAAC;QAC5D,MAAM,KAAK,GAAG,EAAE,CAAC,aAAa,CAAC,OAAO,CAAqB,CAAC;QAC5D,MAAM,KAAK,GAAG,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAsB,CAAC;QAE9D,YAAY,CAAC,IAAI,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,CAAC,CAAC,CAAC;QAEtE,OAAO,CAAC,KAAK,EAAE,CAAC;QAChB,MAAM,QAAQ,CAAC;YACX,KAAK,EAAE,KAAK;SACf,CAAC,CAAC;QAEH,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC/C,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC,CAAC;QAEjD,MAAM,QAAQ,CAAC;YACX,KAAK,EAAE,WAAW;SACrB,CAAC,CAAC;QAEH,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAEjD,MAAM,QAAQ,CAAC;YACX,KAAK,EAAE,KAAK;SACf,CAAC,CAAC;QAEH,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAE/C,MAAM,QAAQ,CAAC;YACX,KAAK,EAAE,KAAK;SACf,CAAC,CAAC;QAEH,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC/C,MAAM,SAAS,CACX,GAAG,EAAE,CAAC,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAC1D,CAAC;IACN,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,0DAA0D,EAAE,KAAK,IAAI,EAAE;QACtE,MAAM,EAAE,GAAG,MAAM,OAAO,CAAiB,IAAI,CAAA;;;;;;;;;;;SAW5C,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,UAAU,CAAgB,CAAC;QAC5D,MAAM,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,UAAU,CAAgB,CAAC;QAC5D,MAAM,KAAK,GAAG,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAqB,CAAC;QACrE,MAAM,MAAM,GAAG,EAAE,CAAC,aAAa,CAAC,SAAS,CAAsB,CAAC;QAEhE,YAAY,CAAC,IAAI,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,CAAC,CAAC,CAAC;QAEtE,OAAO,CAAC,KAAK,EAAE,CAAC;QAChB,MAAM,QAAQ,CAAC;YACX,KAAK,EAAE,KAAK;SACf,CAAC,CAAC;QAEH,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC/C,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC,CAAC;QAEjD,MAAM,QAAQ,CAAC;YACX,KAAK,EAAE,WAAW;SACrB,CAAC,CAAC;QAEH,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAEjD,MAAM,QAAQ,CAAC;YACX,KAAK,EAAE,WAAW;SACrB,CAAC,CAAC;QAEH,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QAChD,MAAM,SAAS,CACX,GAAG,EAAE,CAAC,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAC1D,CAAC;IACN,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wBAAwB,EAAE,KAAK,IAAI,EAAE;QACpC,MAAM,WAAW,GAAG,mDAAmD,CAAC;QACxE,MAAM,EAAE,GAAG,MAAM,OAAO,CACpB,IAAI,CAAA;;aAEH,CACJ,CAAC;QAEF,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC9C,OAAO,CAAC,WAAW,GAAG,WAAW,CAAC;QAElC,MAAM,MAAM,GAAG,QAAQ,CAAC,EAAE,EAAE,WAAW,CAAC,CAAC;QACzC,MAAM,YAAY,GAAG,MAAM,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;YAC1D,SAAS,EAAE,QAAQ;SACtB,CAAC,CAAC;QACH,MAAM,MAAM,CAAC;QAEb,IAAI,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;QAE7D,IAAI,aAAa,EAAE;YACf,MAAM,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC;SAC3D;aAAM;YACH,MAAM,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC;SACxC;QAED,MAAM,MAAM,GAAG,QAAQ,CAAC,EAAE,EAAE,WAAW,CAAC,CAAC;QACzC,YAAY,EAAE,CAAC;QACf,MAAM,MAAM,CAAC;QAEb,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;QAEzD,MAAM,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QAEjC,OAAO,CAAC,MAAM,EAAE,CAAC;IACrB,CAAC,CAAC,CAAC;AACP,CAAC,CAAC,CAAC;AACH,QAAQ,CAAC,wBAAwB,EAAE,GAAG,EAAE;IACpC,EAAE,CAAC,gEAAgE,EAAE,KAAK,IAAI,EAAE;QAC5E,MAAM,OAAO,CAAiB,IAAI,CAAA;cAC5B,cAAc,iCACT,cAAc,CAAC,IAAI,KACtB,MAAM,EAAE,CAAC,IACX;SACL,CAAC,CAAC;QACH,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC;QAChC,MAAM,MAAM,GAAG,MAAM,CAAC,WAAW,CAAC;QAClC,IAAI,MAAM,GAAG,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;QAC7C,8CAA8C;QAC9C,SAAS,CAAC;YACN,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,MAAM;oBACZ,QAAQ,EAAE,CAAC,KAAK,GAAG,CAAC,GAAG,EAAE,EAAE,MAAM,GAAG,CAAC,CAAC;iBACzC;gBACD;oBACI,IAAI,EAAE,OAAO;oBACb,OAAO,EAAE;wBACL,MAAM,EAAE,OAAO;qBAClB;oBACD,QAAQ,EAAE,CAAC,KAAK,GAAG,CAAC,GAAG,EAAE,EAAE,MAAM,GAAG,CAAC,CAAC;iBACzC;aACJ;SACJ,CAAC,CAAC;QACH,MAAM,MAAM,CAAC;QACb,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CACvC,gBAAgB,CACF,CAAC;QACnB,MAAM,aAAa,GAAG,YAAY,CAAC,aAAa,CAC5C,iBAAiB,CACD,CAAC;QACrB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC;QACrD,MAAM,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QAC5C,MAAM,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC;QAC/D,IAAI,MAAM,GAAG,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;QAC7C,MAAM,GAAG,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;QACzC,iEAAiE;QACjE,oEAAoE;QACpE,wDAAwD;QACxD,SAAS,CAAC;YACN,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,MAAM;oBACZ,QAAQ,EAAE,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC;iBACpC;gBACD;oBACI,IAAI,EAAE,OAAO;oBACb,OAAO,EAAE;wBACL,MAAM,EAAE,OAAO;qBAClB;oBACD,QAAQ,EAAE,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC;iBACpC;aACJ;SACJ,CAAC,CAAC;QACH,MAAM,MAAM,CAAC;QACb,MAAM,MAAM,CAAC;QACb,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CACxC,gBAAgB,CACF,CAAC;QACnB,MAAM,cAAc,GAAG,aAAa,CAAC,aAAa,CAC9C,iBAAiB,CACD,CAAC;QACrB,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC;QACvD,MAAM,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;QACjD,MAAM,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;QAC7C,MAAM,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QAC7C,MAAM,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,oBAAoB,CAAC,CAAC;QAClE,MAAM,GAAG,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;QACzC,SAAS,CAAC;YACN,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,MAAM;oBACZ,QAAQ,EAAE,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC;iBACpC;gBACD;oBACI,IAAI,EAAE,OAAO;oBACb,QAAQ,EAAE,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC;iBACpC;aACJ;SACJ,CAAC,CAAC;QACH,MAAM,MAAM,CAAC;QACb,MAAM,SAAS,EAAE,CAAC;IACtB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2CAA2C,EAAE,KAAK,IAAI,EAAE;QACvD,MAAM,OAAO,CAAiB,IAAI,CAAA;cAC5B,cAAc,iCACT,cAAc,CAAC,IAAI,KACtB,MAAM,EAAE,CAAC,IACX;SACL,CAAC,CAAC;QAEH,MAAM,WAAW,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;QAC/C,sCAAsC;QACtC,MAAM,SAAS,EAAE,CAAC;QAElB,MAAM,MAAM,GAAG,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;QAC/C,8CAA8C;QAC9C,SAAS,CAAC;YACN,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,MAAM;oBACZ,QAAQ,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC;iBACtB;gBACD;oBACI,IAAI,EAAE,OAAO;oBACb,OAAO,EAAE;wBACL,MAAM,EAAE,OAAO;qBAClB;oBACD,QAAQ,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC;iBACtB;aACJ;SACJ,CAAC,CAAC;QACH,MAAM,MAAM,CAAC;QAEb,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CACxC,gBAAgB,CACF,CAAC;QAEnB,MAAM,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;QACxD,MAAM,CAAC,aAAa,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAC3D,QAAQ,CACX,CAAC;QAEF,MAAM,MAAM,GAAG,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;QAC/C,QAAQ,CAAC;YACL,KAAK,EAAE,QAAQ;SAClB,CAAC,CAAC;QACH,MAAM,MAAM,CAAC;QACb,MAAM,SAAS,EAAE,CAAC;IACtB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wDAAwD,EAAE,KAAK,IAAI,EAAE;QACpE,MAAM,EAAE,GAAG,MAAM,OAAO,CAAiB,qBAAqB,EAAE,CAAC,CAAC;QAClE,MAAM,OAAO,GAAG,EAAE,CAAC,aAAa,CAC5B,kBAAkB,CACA,CAAC;QACvB,IAAI,IAAI,GAAG,QAAQ,CAAC,EAAE,EAAE,WAAW,CAAC,CAAC;QACrC,OAAO,CAAC,KAAK,EAAE,CAAC;QAChB,MAAM,IAAI,CAAC;QACX,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAClC,iBAAiB,CACF,CAAC;QACpB,IAAI,GAAG,QAAQ,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QACtC,OAAO,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;QACvB,MAAM,IAAI,CAAC;QACX,MAAM,cAAc,GAAG,QAAQ,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;QACnE,cAAc,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;YAC/B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QAC1C,CAAC,CAAC,CAAC;QACH,IAAI,KAAK,GAAG,QAAQ,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QAC3C,OAAO,CAAC,OAAO,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;QACxC,MAAM,KAAK,CAAC;QACZ,KAAK,GAAG,QAAQ,CAAC,EAAE,EAAE,WAAW,CAAC,CAAC;QAClC,EAAE,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;QAC3B,MAAM,KAAK,CAAC;IAChB,CAAC,CAAC,CAAC;AACP,CAAC,CAAC,CAAC;AACH,QAAQ,CAAC,kBAAkB,EAAE,GAAG,EAAE;IAC9B,EAAE,CAAC,uEAAuE,EAAE,KAAK,IAAI,EAAE;QACnF,MAAM,IAAI,GAAG,MAAM,OAAO,CAAiB,IAAI,CAAA;;;;;;;;;;;;;;;;;;SAkB9C,CAAC,CAAC;QAEH,MAAM,eAAe,GAAG,IAAI,CAAC,aAAa,CACtC,6BAA6B,CACd,CAAC;QACpB,MAAM,eAAe,GAAG,IAAI,CAAC,aAAa,CACtC,4BAA4B,CACb,CAAC;QACpB,MAAM,QAAQ,GAAG,eAAe,CAAC,aAAa,CAC1C,kBAAkB,CACA,CAAC;QACvB,MAAM,QAAQ,GAAG,eAAe,CAAC,aAAa,CAC1C,kBAAkB,CACA,CAAC;QAEvB,MAAM,oBAAoB,GAAG,QAAQ,CAAC,qBAAqB,EAAE,CAAC;QAC9D,MAAM,oBAAoB,GAAG,QAAQ,CAAC,qBAAqB,EAAE,CAAC;QAC9D,MAAM,gBAAgB,GAAqB;YACvC,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,KAAK,GAAG,CAAC;YAC1D,oBAAoB,CAAC,GAAG,GAAG,oBAAoB,CAAC,MAAM,GAAG,CAAC;SAC7D,CAAC;QACF,MAAM,eAAe,GAAqB;YACtC,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,KAAK,GAAG,CAAC;YAC1D,oBAAoB,CAAC,GAAG,GAAG,oBAAoB,CAAC,MAAM,GAAG,CAAC;SAC7D,CAAC;QACF,MAAM,gBAAgB,GAAqB;YACvC,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,KAAK,GAAG,CAAC;YAC1D,oBAAoB,CAAC,GAAG,GAAG,oBAAoB,CAAC,MAAM,GAAG,CAAC;SAC7D,CAAC;QACF,MAAM,eAAe,GAAqB;YACtC,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,KAAK,GAAG,CAAC;YAC1D,oBAAoB,CAAC,GAAG,GAAG,oBAAoB,CAAC,MAAM,GAAG,CAAC;SAC7D,CAAC;QAEF,MAAM,SAAS,CAAC;YACZ,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,MAAM;oBACZ,QAAQ,EAAE,gBAAgB;iBAC7B;aACJ;SACJ,CAAC,CAAC;QACH,MAAM,SAAS,EAAE,CAAC;QAClB,MAAM,SAAS,EAAE,CAAC;QAClB,MAAM,SAAS,CAAC;YACZ,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,MAAM;oBACZ,QAAQ,EAAE,eAAe;iBAC5B;aACJ;SACJ,CAAC,CAAC;QACH,MAAM,SAAS,EAAE,CAAC;QAClB,MAAM,SAAS,EAAE,CAAC;QAClB,MAAM,SAAS,CAAC;YACZ,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,MAAM;oBACZ,QAAQ,EAAE,gBAAgB;iBAC7B;aACJ;SACJ,CAAC,CAAC;QACH,MAAM,SAAS,EAAE,CAAC;QAClB,MAAM,SAAS,EAAE,CAAC;QAClB,MAAM,MAAM,GAAG,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;QAC/C,SAAS,CAAC;YACN,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,OAAO;oBACb,QAAQ,EAAE,gBAAgB;iBAC7B;aACJ;SACJ,CAAC,CAAC;QACH,MAAM,MAAM,CAAC;QAEb,MAAM,CAAC,eAAe,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;QACzD,MAAM,CAAC,eAAe,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QACxD,MAAM,CAAC,eAAe,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAE/D,MAAM,MAAM,GAAG,QAAQ,CAAC,eAAe,EAAE,WAAW,CAAC,CAAC;QACtD,SAAS,CAAC;YACN,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,OAAO;oBACb,QAAQ,EAAE,eAAe;iBAC5B;aACJ;SACJ,CAAC,CAAC;QACH,MAAM,MAAM,CAAC;QAEb,+EAA+E;QAC/E,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE;YAAE,MAAM,SAAS,EAAE,CAAC;QAE9C,MAAM,CAAC,eAAe,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC;QACzD,MAAM,CAAC,eAAe,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,eAAe,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE;aACnE,KAAK,CAAC;IACf,CAAC,CAAC,CAAC;AACP,CAAC,CAAC,CAAC","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 '@spectrum-web-components/button/sp-button.js';\nimport '@spectrum-web-components/dialog/sp-dialog.js';\nimport { Dialog } from '@spectrum-web-components/dialog';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport { Popover } from '@spectrum-web-components/popover';\nimport { setViewport } from '@web/test-runner-commands';\nimport { ActiveOverlay, Overlay, OverlayTrigger, Placement } from '../';\n\nimport { isVisible, waitForPredicate } from '../../../test/testing-helpers.js';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n nextFrame,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\nimport { sendKeys } from '@web/test-runner-commands';\nimport {\n definedOverlayElement,\n virtualElement,\n} from '../stories/overlay.stories';\nimport { PopoverContent } from '../stories/overlay-story-components.js';\nimport { sendMouse } from '../../../test/plugins/browser.js';\n\ndescribe('Overlays', () => {\n let testDiv!: HTMLDivElement;\n let openOverlays: (() => void)[] = [];\n\n beforeEach(async () => {\n testDiv = await fixture<HTMLDivElement>(\n html`\n <div id=\"top\">\n <style>\n body {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n #top {\n margin: 100px;\n }\n\n sp-button {\n flex: none;\n }\n\n #overlay-content {\n display: none;\n }\n </style>\n <sp-button\n id=\"first-button\"\n variant=\"primary\"\n slot=\"trigger\"\n >\n Show Popover\n </sp-button>\n <div id=\"overlay-content\">\n <sp-popover\n id=\"outer-popover\"\n dialog\n slot=\"click-content\"\n direction=\"bottom\"\n tip\n open\n >\n <div class=\"options-popover-content\">\n A popover message\n </div>\n </sp-popover>\n <div id=\"hover-1\" class=\"hover-content\">\n Hover message\n </div>\n <div id=\"hover-2\" class=\"hover-content\">\n Other hover message\n </div>\n </div>\n </div>\n `\n );\n await elementUpdated(testDiv);\n });\n\n afterEach(() => {\n openOverlays.map((close) => close());\n openOverlays = [];\n });\n\n [\n 'bottom',\n 'bottom-start',\n 'bottom-end',\n 'top',\n 'top-start',\n 'top-end',\n 'left',\n 'left-start',\n 'left-end',\n 'right',\n 'right-start',\n 'right-end',\n 'none',\n ].map((direction) => {\n const placement = direction as Placement;\n it(`opens a popover - ${placement}`, async () => {\n const button = testDiv.querySelector(\n '#first-button'\n ) as HTMLElement;\n const outerPopover = testDiv.querySelector(\n '#outer-popover'\n ) as Popover;\n\n expect(outerPopover.parentElement).to.exist;\n if (outerPopover.parentElement) {\n expect(outerPopover.parentElement.id).to.equal(\n 'overlay-content'\n );\n }\n\n expect(isVisible(outerPopover)).to.be.false;\n\n expect(button).to.exist;\n\n openOverlays.push(\n await Overlay.open(button, 'click', outerPopover, {\n delayed: false,\n placement,\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n outerPopover.parentElement &&\n outerPopover.parentElement.id !== 'overlay-content'\n )\n );\n\n expect(outerPopover.parentElement).to.exist;\n if (outerPopover.parentElement) {\n expect(outerPopover.parentElement.id).not.to.equal(\n 'overlay-content'\n );\n }\n expect(isVisible(outerPopover)).to.be.true;\n });\n });\n\n it(`updates a popover`, async () => {\n const button = testDiv.querySelector('#first-button') as HTMLElement;\n const outerPopover = testDiv.querySelector('#outer-popover') as Popover;\n\n expect(outerPopover.parentElement).to.exist;\n if (outerPopover.parentElement) {\n expect(outerPopover.parentElement.id).to.equal('overlay-content');\n }\n\n expect(isVisible(outerPopover)).to.be.false;\n\n expect(button).to.exist;\n\n openOverlays.push(\n await Overlay.open(button, 'click', outerPopover, {\n delayed: false,\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n outerPopover.parentElement &&\n outerPopover.parentElement.id !== 'overlay-content'\n )\n );\n\n expect(isVisible(outerPopover)).to.be.true;\n\n Overlay.update();\n\n expect(isVisible(outerPopover)).to.be.true;\n });\n\n it(`opens a popover w/ delay`, async () => {\n const button = testDiv.querySelector('#first-button') as HTMLElement;\n const outerPopover = testDiv.querySelector('#outer-popover') as Popover;\n\n expect(outerPopover.parentElement).to.exist;\n if (outerPopover.parentElement) {\n expect(outerPopover.parentElement.id).to.equal('overlay-content');\n }\n\n expect(isVisible(outerPopover)).to.be.false;\n\n expect(button).to.exist;\n\n openOverlays.push(\n await Overlay.open(button, 'click', outerPopover, {\n delayed: true,\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitUntil(\n () =>\n !!(\n outerPopover.parentElement &&\n outerPopover.parentElement.id !== 'overlay-content'\n ),\n 'overlay opened'\n );\n\n expect(outerPopover.parentElement).to.exist;\n if (outerPopover.parentElement) {\n expect(outerPopover.parentElement.id).not.to.equal(\n 'overlay-content'\n );\n }\n expect(isVisible(outerPopover)).to.be.true;\n });\n\n it('opens hover overlay', async () => {\n const button = testDiv.querySelector('#first-button') as HTMLElement;\n const hoverOverlay = testDiv.querySelector('#hover-1') as HTMLElement;\n const clickOverlay = testDiv.querySelector(\n '#outer-popover'\n ) as HTMLElement;\n\n expect(button).to.exist;\n expect(hoverOverlay).to.exist;\n\n expect(isVisible(hoverOverlay)).to.be.false;\n expect(isVisible(clickOverlay)).to.be.false;\n\n openOverlays.push(\n await Overlay.open(button, 'hover', hoverOverlay, {\n delayed: false,\n placement: 'top',\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n hoverOverlay.parentElement &&\n hoverOverlay.parentElement.id !== 'overlay-content'\n )\n );\n\n expect(hoverOverlay.parentElement).to.exist;\n if (hoverOverlay.parentElement) {\n expect(hoverOverlay.parentElement.id).not.to.equal(\n 'overlay-content'\n );\n }\n expect(isVisible(hoverOverlay)).to.be.true;\n\n // Opening click overlay should close the hover overlay\n openOverlays.push(\n await Overlay.open(button, 'click', clickOverlay, {\n delayed: false,\n placement: 'bottom',\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n clickOverlay.parentElement &&\n clickOverlay.parentElement.id !== 'overlay-content' &&\n hoverOverlay.parentElement &&\n hoverOverlay.parentElement.id === 'overlay-content'\n )\n );\n\n if (hoverOverlay.parentElement) {\n expect(hoverOverlay.parentElement.id).to.equal('overlay-content');\n }\n\n expect(isVisible(hoverOverlay)).to.be.false;\n expect(isVisible(clickOverlay)).to.be.true;\n });\n\n it('opens custom overlay', async () => {\n const button = testDiv.querySelector('#first-button') as HTMLElement;\n const customOverlay = testDiv.querySelector('#hover-1') as HTMLElement;\n const clickOverlay = testDiv.querySelector(\n '#outer-popover'\n ) as HTMLElement;\n\n expect(button).to.exist;\n expect(customOverlay).to.exist;\n\n expect(isVisible(customOverlay)).to.be.false;\n expect(isVisible(clickOverlay)).to.be.false;\n\n openOverlays.push(\n await Overlay.open(button, 'custom', customOverlay, {\n delayed: false,\n placement: 'top',\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n customOverlay.parentElement &&\n customOverlay.parentElement.id !== 'overlay-content'\n )\n );\n\n expect(customOverlay.parentElement).to.exist;\n if (customOverlay.parentElement) {\n expect(customOverlay.parentElement.id).not.to.equal(\n 'overlay-content'\n );\n }\n expect(isVisible(customOverlay)).to.be.true;\n\n // Opening click overlay should close the hover overlay\n openOverlays.push(\n await Overlay.open(button, 'click', clickOverlay, {\n delayed: false,\n placement: 'bottom',\n offset: 10,\n })\n );\n\n // Wait for the DOM node to be stolen and reparented into the overlay\n await waitForPredicate(\n () =>\n !!(\n clickOverlay.parentElement &&\n clickOverlay.parentElement.id !== 'overlay-content'\n )\n );\n\n expect(isVisible(customOverlay)).to.be.true;\n expect(isVisible(clickOverlay)).to.be.true;\n });\n\n it('closes via events', async () => {\n const el = await fixture<HTMLDivElement>(html`\n <div id=\"root\">\n <sp-dialog dismissable></sp-dialog>\n </div>\n `);\n\n const dialog = el.querySelector('sp-dialog') as Dialog;\n\n openOverlays.push(\n await Overlay.open(el, 'click', dialog, {\n delayed: false,\n placement: 'bottom',\n offset: 10,\n })\n );\n\n await waitUntil(\n () =>\n !!dialog.parentElement &&\n dialog.parentElement.tagName === 'ACTIVE-OVERLAY',\n 'content is stolen'\n );\n\n dialog.close();\n\n await waitUntil(\n () =>\n !!dialog.parentElement &&\n dialog.parentElement.tagName !== 'ACTIVE-OVERLAY',\n 'content is returned'\n );\n });\n\n it('closes an inline overlay when tabbing past the content', async () => {\n const el = await fixture<HTMLDivElement>(html`\n <div>\n <sp-button class=\"trigger\">Trigger</sp-button>\n <div class=\"content\">\n <input />\n </div>\n <input value=\"After\" id=\"after\" />\n </div>\n `);\n\n const trigger = el.querySelector('.trigger') as HTMLElement;\n const content = el.querySelector('.content') as HTMLElement;\n const input = el.querySelector('input') as HTMLInputElement;\n const after = el.querySelector('#after') as HTMLAnchorElement;\n\n openOverlays.push(await Overlay.open(trigger, 'inline', content, {}));\n\n trigger.focus();\n await sendKeys({\n press: 'Tab',\n });\n\n expect(document.activeElement).to.equal(input);\n expect(input.closest('active-overlay') !== null);\n\n await sendKeys({\n press: 'Shift+Tab',\n });\n\n expect(document.activeElement).to.equal(trigger);\n\n await sendKeys({\n press: 'Tab',\n });\n\n expect(document.activeElement).to.equal(input);\n\n await sendKeys({\n press: 'Tab',\n });\n\n expect(document.activeElement).to.equal(after);\n await waitUntil(\n () => document.querySelector('active-overlay') === null\n );\n });\n\n it('closes an inline overlay when tabbing before the trigger', async () => {\n const el = await fixture<HTMLDivElement>(html`\n <div>\n <input value=\"Before\" id=\"before\" />\n <sp-button class=\"trigger\">Trigger</sp-button>\n <div class=\"content\">\n <label>\n Content in an inline overlay.\n <input />\n </label>\n </div>\n </div>\n `);\n\n const trigger = el.querySelector('.trigger') as HTMLElement;\n const content = el.querySelector('.content') as HTMLElement;\n const input = el.querySelector('.content input') as HTMLInputElement;\n const before = el.querySelector('#before') as HTMLAnchorElement;\n\n openOverlays.push(await Overlay.open(trigger, 'inline', content, {}));\n\n trigger.focus();\n await sendKeys({\n press: 'Tab',\n });\n\n expect(document.activeElement).to.equal(input);\n expect(input.closest('active-overlay') !== null);\n\n await sendKeys({\n press: 'Shift+Tab',\n });\n\n expect(document.activeElement).to.equal(trigger);\n\n await sendKeys({\n press: 'Shift+Tab',\n });\n\n expect(document.activeElement).to.equal(before);\n await waitUntil(\n () => document.querySelector('active-overlay') === null\n );\n });\n\n it('opens detached content', async () => {\n const textContent = 'This is a detached element that has been overlaid';\n const el = await fixture<HTMLButtonElement>(\n html`\n <button>Trigger</button>\n `\n );\n\n const content = document.createElement('div');\n content.textContent = textContent;\n\n const opened = oneEvent(el, 'sp-opened');\n const closeOverlay = await Overlay.open(el, 'click', content, {\n placement: 'bottom',\n });\n await opened;\n\n let activeOverlay = document.querySelector('active-overlay');\n\n if (activeOverlay) {\n expect(activeOverlay.textContent).to.equal(textContent);\n } else {\n expect(activeOverlay).to.not.be.null;\n }\n\n const closed = oneEvent(el, 'sp-closed');\n closeOverlay();\n await closed;\n\n activeOverlay = document.querySelector('active-overlay');\n\n expect(activeOverlay).to.be.null;\n\n content.remove();\n });\n});\ndescribe('Overlay - type=\"modal\"', () => {\n it('closes on `contextmenu` and passes that to the underlying page', async () => {\n await fixture<HTMLDivElement>(html`\n ${virtualElement({\n ...virtualElement.args,\n offset: 6,\n })}\n `);\n const width = window.innerWidth;\n const height = window.innerHeight;\n let opened = oneEvent(document, 'sp-opened');\n // Right click to open \"context menu\" overlay.\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [width / 2 + 50, height / 2],\n },\n {\n type: 'click',\n options: {\n button: 'right',\n },\n position: [width / 2 + 50, height / 2],\n },\n ],\n });\n await opened;\n const firstOverlay = document.querySelector(\n 'active-overlay'\n ) as ActiveOverlay;\n const firstHeadline = firstOverlay.querySelector(\n '[slot=\"header\"]'\n ) as HTMLSpanElement;\n expect(firstOverlay, 'first overlay').to.not.be.null;\n expect(firstOverlay.isConnected).to.be.true;\n expect(firstHeadline.textContent).to.equal('Menu source: end');\n let closed = oneEvent(document, 'sp-closed');\n opened = oneEvent(document, 'sp-opened');\n // Right click to out of the \"context menu\" overlay to both close\n // the first overlay and have the event passed to the surfacing page\n // in order to open a subsequent \"context menu\" overlay.\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [width / 4, height / 4],\n },\n {\n type: 'click',\n options: {\n button: 'right',\n },\n position: [width / 4, height / 4],\n },\n ],\n });\n await closed;\n await opened;\n const secondOverlay = document.querySelector(\n 'active-overlay'\n ) as ActiveOverlay;\n const secondHeadline = secondOverlay.querySelector(\n '[slot=\"header\"]'\n ) as HTMLSpanElement;\n expect(secondOverlay, 'second overlay').to.not.be.null;\n expect(secondOverlay).to.not.equal(firstOverlay);\n expect(firstOverlay.isConnected).to.be.false;\n expect(secondOverlay.isConnected).to.be.true;\n expect(secondHeadline.textContent).to.equal('Menu source: start');\n closed = oneEvent(document, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [width / 8, height / 8],\n },\n {\n type: 'click',\n position: [width / 8, height / 8],\n },\n ],\n });\n await closed;\n await nextFrame();\n });\n\n it('does not open content off of the viewport', async () => {\n await fixture<HTMLDivElement>(html`\n ${virtualElement({\n ...virtualElement.args,\n offset: 6,\n })}\n `);\n\n await setViewport({ width: 360, height: 640 });\n // Allow viewport update to propagate.\n await nextFrame();\n\n const opened = oneEvent(document, 'sp-opened');\n // Right click to open \"context menu\" overlay.\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [270, 10],\n },\n {\n type: 'click',\n options: {\n button: 'right',\n },\n position: [270, 10],\n },\n ],\n });\n await opened;\n\n const activeOverlay = document.querySelector(\n 'active-overlay'\n ) as ActiveOverlay;\n\n expect(activeOverlay.placement).to.equal('right-start');\n expect(activeOverlay.getAttribute('actual-placement')).to.equal(\n 'bottom'\n );\n\n const closed = oneEvent(document, 'sp-closed');\n sendKeys({\n press: 'Escape',\n });\n await closed;\n await nextFrame();\n });\n\n it('opens children in the modal stack through shadow roots', async () => {\n const el = await fixture<OverlayTrigger>(definedOverlayElement());\n const trigger = el.querySelector(\n '[slot=\"trigger\"]'\n ) as HTMLButtonElement;\n let open = oneEvent(el, 'sp-opened');\n trigger.click();\n await open;\n const content = document.querySelector(\n 'popover-content'\n ) as PopoverContent;\n open = oneEvent(content, 'sp-opened');\n content.button.click();\n await open;\n const activeOverlays = document.querySelectorAll('active-overlay');\n activeOverlays.forEach((overlay) => {\n expect(overlay.slot).to.equal('open');\n });\n let close = oneEvent(content, 'sp-closed');\n content.trigger.removeAttribute('open');\n await close;\n close = oneEvent(el, 'sp-closed');\n el.removeAttribute('open');\n await close;\n });\n});\ndescribe('Overlay - timing', () => {\n it('manages multiple modals in a row without preventing them from closing', async () => {\n const test = await fixture<HTMLDivElement>(html`\n <div>\n <overlay-trigger>\n <sp-button slot=\"trigger\">Trigger 1</sp-button>\n <sp-popover slot=\"hover-content\">\n <p>Hover contentent for \"Trigger 1\".</p>\n </sp-popover>\n </overlay-trigger>\n <overlay-trigger>\n <sp-button slot=\"trigger\">Trigger 2</sp-button>\n <sp-popover slot=\"hover-content\">\n <p>Hover contentent for \"Trigger 2\".</p>\n </sp-popover>\n <sp-popover slot=\"click-content\">\n <p>Click contentent for \"Trigger 2\".</p>\n </sp-popover>\n </overlay-trigger>\n </div>\n `);\n\n const overlayTrigger1 = test.querySelector(\n 'overlay-trigger:first-child'\n ) as OverlayTrigger;\n const overlayTrigger2 = test.querySelector(\n 'overlay-trigger:last-child'\n ) as OverlayTrigger;\n const trigger1 = overlayTrigger1.querySelector(\n '[slot=\"trigger\"]'\n ) as HTMLButtonElement;\n const trigger2 = overlayTrigger2.querySelector(\n '[slot=\"trigger\"]'\n ) as HTMLButtonElement;\n\n const boundingRectTrigger1 = trigger1.getBoundingClientRect();\n const boundingRectTrigger2 = trigger2.getBoundingClientRect();\n const trigger1Position: [number, number] = [\n boundingRectTrigger1.left + boundingRectTrigger1.width / 2,\n boundingRectTrigger1.top + boundingRectTrigger1.height / 2,\n ];\n const outsideTrigger1: [number, number] = [\n boundingRectTrigger1.left + boundingRectTrigger1.width * 2,\n boundingRectTrigger1.top + boundingRectTrigger1.height * 2,\n ];\n const trigger2Position: [number, number] = [\n boundingRectTrigger2.left + boundingRectTrigger2.width / 2,\n boundingRectTrigger2.top + boundingRectTrigger2.height / 2,\n ];\n const outsideTrigger2: [number, number] = [\n boundingRectTrigger2.left + boundingRectTrigger2.width * 2,\n boundingRectTrigger2.top + boundingRectTrigger2.height / 2,\n ];\n\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: trigger1Position,\n },\n ],\n });\n await nextFrame();\n await nextFrame();\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: outsideTrigger1,\n },\n ],\n });\n await nextFrame();\n await nextFrame();\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: trigger2Position,\n },\n ],\n });\n await nextFrame();\n await nextFrame();\n const opened = oneEvent(trigger2, 'sp-opened');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: trigger2Position,\n },\n ],\n });\n await opened;\n\n expect(overlayTrigger1.hasAttribute('open')).to.be.false;\n expect(overlayTrigger2.hasAttribute('open')).to.be.true;\n expect(overlayTrigger2.getAttribute('open')).to.equal('click');\n\n const closed = oneEvent(overlayTrigger2, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: outsideTrigger2,\n },\n ],\n });\n await closed;\n\n // sometimes safari needs to wait a few frames for the open attribute to update\n for (let i = 0; i < 3; i++) await nextFrame();\n\n expect(overlayTrigger1.hasAttribute('open')).to.be.false;\n expect(overlayTrigger2.hasAttribute('open'), overlayTrigger2.open).to.be\n .false;\n });\n});\n"]}