@spectrum-web-components/overlay
Advanced tools
Comparing version 1.0.0 to 1.0.1
{ | ||
"name": "@spectrum-web-components/overlay", | ||
"version": "1.0.0", | ||
"version": "1.0.1", | ||
"publishConfig": { | ||
@@ -163,7 +163,7 @@ "access": "public" | ||
"@floating-ui/utils": "^0.2.1", | ||
"@spectrum-web-components/action-button": "^1.0.0", | ||
"@spectrum-web-components/base": "^1.0.0", | ||
"@spectrum-web-components/reactive-controllers": "^1.0.0", | ||
"@spectrum-web-components/shared": "^1.0.0", | ||
"@spectrum-web-components/theme": "^1.0.0" | ||
"@spectrum-web-components/action-button": "^1.0.1", | ||
"@spectrum-web-components/base": "^1.0.1", | ||
"@spectrum-web-components/reactive-controllers": "^1.0.1", | ||
"@spectrum-web-components/shared": "^1.0.1", | ||
"@spectrum-web-components/theme": "^1.0.1" | ||
}, | ||
@@ -180,3 +180,3 @@ "types": "./src/index.d.ts", | ||
], | ||
"gitHead": "5cf5d34645bf9494ebd20f64c42d1619523d2d84" | ||
"gitHead": "b359bc0242712be118c5e3e2cc05f88707d3eeb1" | ||
} |
"use strict"; | ||
import { css } from "@spectrum-web-components/base"; | ||
const styles = css` | ||
:host{pointer-events:none;--swc-overlay-animation-distance:var(--spectrum-spacing-100);display:contents}:host(:has(>sp-tooltip)){--swc-overlay-animation-distance:var(--spectrum-tooltip-animation-distance)}.dialog{box-sizing:border-box;max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);max-width:calc(100vw - 16px);height:auto;--sp-overlay-open:true;background:0 0;border:0;margin:0;padding:0;display:flex;position:fixed;inset:0 auto auto 0;overflow:visible;opacity:1!important}.dialog:not([is-visible]){display:none}.dialog:focus{outline:none}dialog:modal{--mod-popover-filter:var(--spectrum-popover-filter)}:host(:not([open])) .dialog{--sp-overlay-open:false}.dialog::backdrop{display:none}.dialog:before{content:"";position:absolute;inset:-999em;pointer-events:auto!important}.dialog:not(.not-immediately-closable):before{display:none}.dialog>div{width:100%}::slotted(*){pointer-events:auto;visibility:visible!important}::slotted(sp-popover){position:static}.dialog:not([actual-placement])[placement*=top]{padding-block:var(--swc-overlay-animation-distance);margin-top:var(--swc-overlay-animation-distance)}.dialog:not([actual-placement])[placement*=right]{padding-inline:var(--swc-overlay-animation-distance);margin-left:calc(-1*var(--swc-overlay-animation-distance))}.dialog:not([actual-placement])[placement*=bottom]{padding-block:var(--swc-overlay-animation-distance);margin-top:calc(-1*var(--swc-overlay-animation-distance))}.dialog:not([actual-placement])[placement*=left]{padding-inline:var(--swc-overlay-animation-distance);margin-left:var(--swc-overlay-animation-distance)}.dialog[actual-placement*=top]{padding-block:var(--swc-overlay-animation-distance);margin-top:var(--swc-overlay-animation-distance)}.dialog[actual-placement*=right]{padding-inline:var(--swc-overlay-animation-distance);margin-left:calc(-1*var(--swc-overlay-animation-distance))}.dialog[actual-placement*=bottom]{padding-block:var(--swc-overlay-animation-distance);margin-top:calc(-1*var(--swc-overlay-animation-distance))}.dialog[actual-placement*=left]{padding-inline:var(--swc-overlay-animation-distance);margin-left:var(--swc-overlay-animation-distance)}slot[name=longpress-describedby-descriptor]{display:none}@supports selector(:open){.dialog{opacity:0}.dialog:open{opacity:1;--mod-popover-filter:var(--spectrum-popover-filter)}}@supports selector(:popover-open){.dialog{opacity:0}.dialog:popover-open{opacity:1;--mod-popover-filter:var(--spectrum-popover-filter)}}@supports (overlay:auto){.dialog{transition:all var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s)),translate 0s,display var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));transition-behavior:allow-discrete;display:none}.dialog:popover-open,.dialog:modal{display:flex}}@supports (not selector(:open)) and (not selector(:popover-open)){:host:not([open]) .dialog{pointer-events:none}.dialog[actual-placement]{z-index:calc(var(--swc-overlay-z-index-base,1000) + var(--swc-overlay-open-count))}} | ||
:host{pointer-events:none;--swc-overlay-animation-distance:var(--spectrum-spacing-100);display:contents}:host(:has(>sp-tooltip)){--swc-overlay-animation-distance:var(--spectrum-tooltip-animation-distance)}.dialog{box-sizing:border-box;max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);max-width:calc(100vw - 16px);height:auto;--sp-overlay-open:true;background:0 0;border:0;margin:0;padding:0;position:fixed;inset:0 auto auto 0;overflow:visible;opacity:1!important}.dialog:not([is-visible]){display:none}.dialog:focus{outline:none}dialog:modal{--mod-popover-filter:var(--spectrum-popover-filter)}:host(:not([open])) .dialog{--sp-overlay-open:false}.dialog::backdrop{display:none}.dialog:before{content:"";position:absolute;inset:-999em;pointer-events:auto!important}.dialog:not(.not-immediately-closable):before{display:none}.dialog>div{width:100%}::slotted(*){pointer-events:auto;visibility:visible!important}::slotted(sp-popover){position:static}.dialog:not([actual-placement])[placement*=top]{padding-block:var(--swc-overlay-animation-distance);margin-top:var(--swc-overlay-animation-distance)}.dialog:not([actual-placement])[placement*=right]{padding-inline:var(--swc-overlay-animation-distance);margin-left:calc(-1*var(--swc-overlay-animation-distance))}.dialog:not([actual-placement])[placement*=bottom]{padding-block:var(--swc-overlay-animation-distance);margin-top:calc(-1*var(--swc-overlay-animation-distance))}.dialog:not([actual-placement])[placement*=left]{padding-inline:var(--swc-overlay-animation-distance);margin-left:var(--swc-overlay-animation-distance)}.dialog[actual-placement*=top]{padding-block:var(--swc-overlay-animation-distance);margin-top:var(--swc-overlay-animation-distance)}.dialog[actual-placement*=right]{padding-inline:var(--swc-overlay-animation-distance);margin-left:calc(-1*var(--swc-overlay-animation-distance))}.dialog[actual-placement*=bottom]{padding-block:var(--swc-overlay-animation-distance);margin-top:calc(-1*var(--swc-overlay-animation-distance))}.dialog[actual-placement*=left]{padding-inline:var(--swc-overlay-animation-distance);margin-left:var(--swc-overlay-animation-distance)}slot[name=longpress-describedby-descriptor]{display:none}@supports selector(:open){.dialog{opacity:0}.dialog:open{opacity:1;--mod-popover-filter:var(--spectrum-popover-filter)}}@supports selector(:popover-open){.dialog{opacity:0}.dialog:popover-open{opacity:1;--mod-popover-filter:var(--spectrum-popover-filter)}}@supports (overlay:auto){.dialog{transition:all var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s)),translate 0s,display var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));transition-behavior:allow-discrete;display:none}.dialog:popover-open,.dialog:modal{display:flex}}@supports (not selector(:open)) and (not selector(:popover-open)){:host:not([open]) .dialog{pointer-events:none}.dialog[actual-placement]{z-index:calc(var(--swc-overlay-z-index-base,1000) + var(--swc-overlay-open-count))}} | ||
`; | ||
export default styles; | ||
//# sourceMappingURL=overlay.css.dev.js.map |
"use strict";import{css as a}from"@spectrum-web-components/base";const o=a` | ||
:host{pointer-events:none;--swc-overlay-animation-distance:var(--spectrum-spacing-100);display:contents}:host(:has(>sp-tooltip)){--swc-overlay-animation-distance:var(--spectrum-tooltip-animation-distance)}.dialog{box-sizing:border-box;max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);max-width:calc(100vw - 16px);height:auto;--sp-overlay-open:true;background:0 0;border:0;margin:0;padding:0;display:flex;position:fixed;inset:0 auto auto 0;overflow:visible;opacity:1!important}.dialog:not([is-visible]){display:none}.dialog:focus{outline:none}dialog:modal{--mod-popover-filter:var(--spectrum-popover-filter)}:host(:not([open])) .dialog{--sp-overlay-open:false}.dialog::backdrop{display:none}.dialog:before{content:"";position:absolute;inset:-999em;pointer-events:auto!important}.dialog:not(.not-immediately-closable):before{display:none}.dialog>div{width:100%}::slotted(*){pointer-events:auto;visibility:visible!important}::slotted(sp-popover){position:static}.dialog:not([actual-placement])[placement*=top]{padding-block:var(--swc-overlay-animation-distance);margin-top:var(--swc-overlay-animation-distance)}.dialog:not([actual-placement])[placement*=right]{padding-inline:var(--swc-overlay-animation-distance);margin-left:calc(-1*var(--swc-overlay-animation-distance))}.dialog:not([actual-placement])[placement*=bottom]{padding-block:var(--swc-overlay-animation-distance);margin-top:calc(-1*var(--swc-overlay-animation-distance))}.dialog:not([actual-placement])[placement*=left]{padding-inline:var(--swc-overlay-animation-distance);margin-left:var(--swc-overlay-animation-distance)}.dialog[actual-placement*=top]{padding-block:var(--swc-overlay-animation-distance);margin-top:var(--swc-overlay-animation-distance)}.dialog[actual-placement*=right]{padding-inline:var(--swc-overlay-animation-distance);margin-left:calc(-1*var(--swc-overlay-animation-distance))}.dialog[actual-placement*=bottom]{padding-block:var(--swc-overlay-animation-distance);margin-top:calc(-1*var(--swc-overlay-animation-distance))}.dialog[actual-placement*=left]{padding-inline:var(--swc-overlay-animation-distance);margin-left:var(--swc-overlay-animation-distance)}slot[name=longpress-describedby-descriptor]{display:none}@supports selector(:open){.dialog{opacity:0}.dialog:open{opacity:1;--mod-popover-filter:var(--spectrum-popover-filter)}}@supports selector(:popover-open){.dialog{opacity:0}.dialog:popover-open{opacity:1;--mod-popover-filter:var(--spectrum-popover-filter)}}@supports (overlay:auto){.dialog{transition:all var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s)),translate 0s,display var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));transition-behavior:allow-discrete;display:none}.dialog:popover-open,.dialog:modal{display:flex}}@supports (not selector(:open)) and (not selector(:popover-open)){:host:not([open]) .dialog{pointer-events:none}.dialog[actual-placement]{z-index:calc(var(--swc-overlay-z-index-base,1000) + var(--swc-overlay-open-count))}} | ||
:host{pointer-events:none;--swc-overlay-animation-distance:var(--spectrum-spacing-100);display:contents}:host(:has(>sp-tooltip)){--swc-overlay-animation-distance:var(--spectrum-tooltip-animation-distance)}.dialog{box-sizing:border-box;max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);max-width:calc(100vw - 16px);height:auto;--sp-overlay-open:true;background:0 0;border:0;margin:0;padding:0;position:fixed;inset:0 auto auto 0;overflow:visible;opacity:1!important}.dialog:not([is-visible]){display:none}.dialog:focus{outline:none}dialog:modal{--mod-popover-filter:var(--spectrum-popover-filter)}:host(:not([open])) .dialog{--sp-overlay-open:false}.dialog::backdrop{display:none}.dialog:before{content:"";position:absolute;inset:-999em;pointer-events:auto!important}.dialog:not(.not-immediately-closable):before{display:none}.dialog>div{width:100%}::slotted(*){pointer-events:auto;visibility:visible!important}::slotted(sp-popover){position:static}.dialog:not([actual-placement])[placement*=top]{padding-block:var(--swc-overlay-animation-distance);margin-top:var(--swc-overlay-animation-distance)}.dialog:not([actual-placement])[placement*=right]{padding-inline:var(--swc-overlay-animation-distance);margin-left:calc(-1*var(--swc-overlay-animation-distance))}.dialog:not([actual-placement])[placement*=bottom]{padding-block:var(--swc-overlay-animation-distance);margin-top:calc(-1*var(--swc-overlay-animation-distance))}.dialog:not([actual-placement])[placement*=left]{padding-inline:var(--swc-overlay-animation-distance);margin-left:var(--swc-overlay-animation-distance)}.dialog[actual-placement*=top]{padding-block:var(--swc-overlay-animation-distance);margin-top:var(--swc-overlay-animation-distance)}.dialog[actual-placement*=right]{padding-inline:var(--swc-overlay-animation-distance);margin-left:calc(-1*var(--swc-overlay-animation-distance))}.dialog[actual-placement*=bottom]{padding-block:var(--swc-overlay-animation-distance);margin-top:calc(-1*var(--swc-overlay-animation-distance))}.dialog[actual-placement*=left]{padding-inline:var(--swc-overlay-animation-distance);margin-left:var(--swc-overlay-animation-distance)}slot[name=longpress-describedby-descriptor]{display:none}@supports selector(:open){.dialog{opacity:0}.dialog:open{opacity:1;--mod-popover-filter:var(--spectrum-popover-filter)}}@supports selector(:popover-open){.dialog{opacity:0}.dialog:popover-open{opacity:1;--mod-popover-filter:var(--spectrum-popover-filter)}}@supports (overlay:auto){.dialog{transition:all var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s)),translate 0s,display var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));transition-behavior:allow-discrete;display:none}.dialog:popover-open,.dialog:modal{display:flex}}@supports (not selector(:open)) and (not selector(:popover-open)){:host:not([open]) .dialog{pointer-events:none}.dialog[actual-placement]{z-index:calc(var(--swc-overlay-z-index-base,1000) + var(--swc-overlay-open-count))}} | ||
`;export default o; | ||
//# sourceMappingURL=overlay.css.js.map |
@@ -120,3 +120,3 @@ import { PropertyValues, TemplateResult } from '@spectrum-web-components/base'; | ||
}): void; | ||
protected handleBrowserClose(): void; | ||
protected handleBrowserClose(event: Event): void; | ||
manuallyKeepOpen(): void; | ||
@@ -123,0 +123,0 @@ protected handleSlotchange(): void; |
@@ -323,7 +323,8 @@ "use strict"; | ||
if (event.newState !== "open") { | ||
this.handleBrowserClose(); | ||
this.handleBrowserClose(event); | ||
} | ||
} | ||
handleBrowserClose() { | ||
handleBrowserClose(event) { | ||
var _a; | ||
event.stopPropagation(); | ||
if (!((_a = this.strategy) == null ? void 0 : _a.activelyOpening)) { | ||
@@ -330,0 +331,0 @@ this.open = false; |
@@ -1,2 +0,2 @@ | ||
"use strict";var b=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var r=(u,a,e,t)=>{for(var o=t>1?void 0:t?E(a,e):a,s=u.length-1,l;s>=0;s--)(l=u[s])&&(o=(t?l(a,e,o):l(o))||o);return t&&o&&b(a,e,o),o};import{html as d}from"@spectrum-web-components/base";import{property as n,query as g,queryAssignedElements as C,state as P}from"@spectrum-web-components/base/src/decorators.js";import{ElementResolutionController as w,elementResolverUpdatedSymbol as T}from"@spectrum-web-components/reactive-controllers/src/ElementResolution.js";import{ifDefined as c,styleMap as f}from"@spectrum-web-components/base/src/directives.js";import{randomID as S}from"@spectrum-web-components/shared/src/random-id.js";import{AbstractOverlay as R,nextFrame as v}from"./AbstractOverlay.js";import{OverlayDialog as L}from"./OverlayDialog.js";import{OverlayPopover as O}from"./OverlayPopover.js";import{OverlayNoPopover as M}from"./OverlayNoPopover.js";import{overlayStack as y}from"./OverlayStack.js";import{VirtualTrigger as H}from"./VirtualTrigger.js";import{PlacementController as $}from"./PlacementController.js";export{LONGPRESS_INSTRUCTIONS}from"./LongpressController.js";import{strategies as D}from"./strategies.js";import{removeSlottableRequest as q,SlottableRequestEvent as N}from"./slottable-request-event.js";import F from"./overlay.css.js";const B="showPopover"in document.createElement("div");let p=L(R);B?p=O(p):p=M(p);const i=class i extends p{constructor(){super(...arguments);this._delayed=!1;this._disabled=!1;this.offset=0;this._open=!1;this.lastRequestSlottableState=!1;this.receivesFocus="auto";this._state="closed";this.triggerElement=null;this.type="auto";this.wasOpen=!1;this.closeOnFocusOut=e=>{if(!e.relatedTarget)return;const t=new Event("overlay-relation-query",{bubbles:!0,composed:!0});e.relatedTarget.addEventListener(t.type,o=>{o.composedPath().includes(this)||(this.open=!1)}),e.relatedTarget.dispatchEvent(t)}}get delayed(){var e;return((e=this.elements.at(-1))==null?void 0:e.hasAttribute("delayed"))||this._delayed}set delayed(e){this._delayed=e}get disabled(){return this._disabled}set disabled(e){var t;this._disabled=e,e?((t=this.strategy)==null||t.abort(),this.wasOpen=this.open,this.open=!1):(this.bindEvents(),this.open=this.open||this.wasOpen,this.wasOpen=!1)}get hasNonVirtualTrigger(){return!!this.triggerElement&&!(this.triggerElement instanceof H)}get placementController(){return this._placementController||(this._placementController=new $(this)),this._placementController}get open(){return this._open}set open(e){var t;e&&this.disabled||e!==this.open&&((t=this.strategy)!=null&&t.activelyOpening&&!e||(this._open=e,this.open&&(i.openCount+=1),this.requestUpdate("open",!this.open),this.open&&this.requestSlottable()))}get state(){return this._state}set state(e){var o;if(e===this.state)return;const t=this.state;this._state=e,(this.state==="opened"||this.state==="closed")&&((o=this.strategy)==null||o.shouldCompleteOpen()),this.requestUpdate("state",t)}get elementResolver(){return this._elementResolver||(this._elementResolver=new w(this)),this._elementResolver}get usesDialog(){return this.type==="modal"||this.type==="page"}get popoverValue(){if("popover"in this)switch(this.type){case"modal":case"page":return;case"hint":return"manual";default:return this.type}}get requiresPosition(){return!(this.type==="page"||!this.open||!this.triggerElement||!this.placement&&this.type!=="hint")}managePosition(){if(!this.requiresPosition||!this.open)return;const e=this.offset||0,t=this.triggerElement,o=this.placement||"right",s=this.tipPadding;this.placementController.placeOverlay(this.dialogEl,{offset:e,placement:o,tipPadding:s,trigger:t,type:this.type})}async managePopoverOpen(){super.managePopoverOpen();const e=this.open;if(this.open!==e||(await this.manageDelay(e),this.open!==e)||(await this.ensureOnDOM(e),this.open!==e))return;const t=await this.makeTransition(e);this.open===e&&await this.applyFocus(e,t)}async applyFocus(e,t){if(!(this.receivesFocus==="false"||this.type==="hint")){if(await v(),await v(),e===this.open&&!this.open){this.hasNonVirtualTrigger&&this.contains(this.getRootNode().activeElement)&&this.triggerElement.focus();return}t==null||t.focus()}}returnFocus(){var t;if(this.open||this.type==="hint")return;const e=()=>{var l,m;const o=[];let s=document.activeElement;for(;(l=s==null?void 0:s.shadowRoot)!=null&&l.activeElement;)s=s.shadowRoot.activeElement;for(;s;){const h=s.assignedSlot||s.parentElement||((m=s.getRootNode())==null?void 0:m.host);h&&o.push(h),s=h}return o};this.receivesFocus!=="false"&&((t=this.triggerElement)!=null&&t.focus)&&(this.contains(this.getRootNode().activeElement)||e().includes(this)||document.activeElement===document.body)&&this.triggerElement.focus()}async manageOpen(e){if(!(!this.isConnected&&this.open)&&(this.hasUpdated||await this.updateComplete,this.open?(y.add(this),this.willPreventClose&&(document.addEventListener("pointerup",()=>{this.dialogEl.classList.toggle("not-immediately-closable",!1),this.willPreventClose=!1},{once:!0}),this.dialogEl.classList.toggle("not-immediately-closable",!0))):(e&&this.dispose(),y.remove(this)),this.open&&this.state!=="opened"?this.state="opening":!this.open&&this.state!=="closed"&&(this.state="closing"),this.usesDialog?this.manageDialogOpen():this.managePopoverOpen(),this.type==="auto")){const t=this.getRootNode();this.open?t.addEventListener("focusout",this.closeOnFocusOut,{capture:!0}):t.removeEventListener("focusout",this.closeOnFocusOut,{capture:!0})}}bindEvents(){var e;(e=this.strategy)==null||e.abort(),this.strategy=void 0,this.hasNonVirtualTrigger&&this.triggerInteraction&&(this.strategy=new D[this.triggerInteraction](this.triggerElement,{overlay:this}))}handleBeforetoggle(e){e.newState!=="open"&&this.handleBrowserClose()}handleBrowserClose(){var e;if(!((e=this.strategy)!=null&&e.activelyOpening)){this.open=!1;return}this.manuallyKeepOpen()}manuallyKeepOpen(){this.open=!0,this.placementController.allowPlacementUpdate=!0,this.manageOpen(!1)}handleSlotchange(){var e,t;this.elements.length?this.hasNonVirtualTrigger&&((t=this.strategy)==null||t.prepareDescription(this.triggerElement)):(e=this.strategy)==null||e.releaseDescription()}shouldPreventClose(){const e=this.willPreventClose;return this.willPreventClose=!1,e}requestSlottable(){this.lastRequestSlottableState!==this.open&&(this.open||document.body.offsetHeight,this.dispatchEvent(new N("overlay-content",this.open?{}:q)),this.lastRequestSlottableState=this.open)}willUpdate(e){var o;if(this.hasAttribute("id")||this.setAttribute("id",`${this.tagName.toLowerCase()}-${S()}`),e.has("open")&&(this.hasUpdated||this.open)&&this.manageOpen(e.get("open")),e.has("trigger")){const[s,l]=((o=this.trigger)==null?void 0:o.split("@"))||[];this.elementResolver.selector=s?`#${s}`:"",this.triggerInteraction=l}let t=!1;e.has(T)&&(t=this.triggerElement,this.triggerElement=this.elementResolver.element),e.has("triggerElement")&&(t=e.get("triggerElement")),t!==!1&&this.bindEvents()}updated(e){super.updated(e),e.has("placement")&&(this.placement?this.dialogEl.setAttribute("actual-placement",this.placement):this.dialogEl.removeAttribute("actual-placement"),this.open&&typeof e.get("placement")!="undefined"&&this.placementController.resetOverlayPosition()),e.has("state")&&this.state==="closed"&&typeof e.get("state")!="undefined"&&this.placementController.clearOverlayPosition()}renderContent(){return d` | ||
"use strict";var b=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var r=(u,a,e,t)=>{for(var o=t>1?void 0:t?E(a,e):a,s=u.length-1,l;s>=0;s--)(l=u[s])&&(o=(t?l(a,e,o):l(o))||o);return t&&o&&b(a,e,o),o};import{html as d}from"@spectrum-web-components/base";import{property as n,query as g,queryAssignedElements as C,state as P}from"@spectrum-web-components/base/src/decorators.js";import{ElementResolutionController as w,elementResolverUpdatedSymbol as T}from"@spectrum-web-components/reactive-controllers/src/ElementResolution.js";import{ifDefined as c,styleMap as f}from"@spectrum-web-components/base/src/directives.js";import{randomID as S}from"@spectrum-web-components/shared/src/random-id.js";import{AbstractOverlay as R,nextFrame as v}from"./AbstractOverlay.js";import{OverlayDialog as L}from"./OverlayDialog.js";import{OverlayPopover as O}from"./OverlayPopover.js";import{OverlayNoPopover as M}from"./OverlayNoPopover.js";import{overlayStack as y}from"./OverlayStack.js";import{VirtualTrigger as H}from"./VirtualTrigger.js";import{PlacementController as $}from"./PlacementController.js";export{LONGPRESS_INSTRUCTIONS}from"./LongpressController.js";import{strategies as D}from"./strategies.js";import{removeSlottableRequest as q,SlottableRequestEvent as N}from"./slottable-request-event.js";import F from"./overlay.css.js";const B="showPopover"in document.createElement("div");let p=L(R);B?p=O(p):p=M(p);const i=class i extends p{constructor(){super(...arguments);this._delayed=!1;this._disabled=!1;this.offset=0;this._open=!1;this.lastRequestSlottableState=!1;this.receivesFocus="auto";this._state="closed";this.triggerElement=null;this.type="auto";this.wasOpen=!1;this.closeOnFocusOut=e=>{if(!e.relatedTarget)return;const t=new Event("overlay-relation-query",{bubbles:!0,composed:!0});e.relatedTarget.addEventListener(t.type,o=>{o.composedPath().includes(this)||(this.open=!1)}),e.relatedTarget.dispatchEvent(t)}}get delayed(){var e;return((e=this.elements.at(-1))==null?void 0:e.hasAttribute("delayed"))||this._delayed}set delayed(e){this._delayed=e}get disabled(){return this._disabled}set disabled(e){var t;this._disabled=e,e?((t=this.strategy)==null||t.abort(),this.wasOpen=this.open,this.open=!1):(this.bindEvents(),this.open=this.open||this.wasOpen,this.wasOpen=!1)}get hasNonVirtualTrigger(){return!!this.triggerElement&&!(this.triggerElement instanceof H)}get placementController(){return this._placementController||(this._placementController=new $(this)),this._placementController}get open(){return this._open}set open(e){var t;e&&this.disabled||e!==this.open&&((t=this.strategy)!=null&&t.activelyOpening&&!e||(this._open=e,this.open&&(i.openCount+=1),this.requestUpdate("open",!this.open),this.open&&this.requestSlottable()))}get state(){return this._state}set state(e){var o;if(e===this.state)return;const t=this.state;this._state=e,(this.state==="opened"||this.state==="closed")&&((o=this.strategy)==null||o.shouldCompleteOpen()),this.requestUpdate("state",t)}get elementResolver(){return this._elementResolver||(this._elementResolver=new w(this)),this._elementResolver}get usesDialog(){return this.type==="modal"||this.type==="page"}get popoverValue(){if("popover"in this)switch(this.type){case"modal":case"page":return;case"hint":return"manual";default:return this.type}}get requiresPosition(){return!(this.type==="page"||!this.open||!this.triggerElement||!this.placement&&this.type!=="hint")}managePosition(){if(!this.requiresPosition||!this.open)return;const e=this.offset||0,t=this.triggerElement,o=this.placement||"right",s=this.tipPadding;this.placementController.placeOverlay(this.dialogEl,{offset:e,placement:o,tipPadding:s,trigger:t,type:this.type})}async managePopoverOpen(){super.managePopoverOpen();const e=this.open;if(this.open!==e||(await this.manageDelay(e),this.open!==e)||(await this.ensureOnDOM(e),this.open!==e))return;const t=await this.makeTransition(e);this.open===e&&await this.applyFocus(e,t)}async applyFocus(e,t){if(!(this.receivesFocus==="false"||this.type==="hint")){if(await v(),await v(),e===this.open&&!this.open){this.hasNonVirtualTrigger&&this.contains(this.getRootNode().activeElement)&&this.triggerElement.focus();return}t==null||t.focus()}}returnFocus(){var t;if(this.open||this.type==="hint")return;const e=()=>{var l,m;const o=[];let s=document.activeElement;for(;(l=s==null?void 0:s.shadowRoot)!=null&&l.activeElement;)s=s.shadowRoot.activeElement;for(;s;){const h=s.assignedSlot||s.parentElement||((m=s.getRootNode())==null?void 0:m.host);h&&o.push(h),s=h}return o};this.receivesFocus!=="false"&&((t=this.triggerElement)!=null&&t.focus)&&(this.contains(this.getRootNode().activeElement)||e().includes(this)||document.activeElement===document.body)&&this.triggerElement.focus()}async manageOpen(e){if(!(!this.isConnected&&this.open)&&(this.hasUpdated||await this.updateComplete,this.open?(y.add(this),this.willPreventClose&&(document.addEventListener("pointerup",()=>{this.dialogEl.classList.toggle("not-immediately-closable",!1),this.willPreventClose=!1},{once:!0}),this.dialogEl.classList.toggle("not-immediately-closable",!0))):(e&&this.dispose(),y.remove(this)),this.open&&this.state!=="opened"?this.state="opening":!this.open&&this.state!=="closed"&&(this.state="closing"),this.usesDialog?this.manageDialogOpen():this.managePopoverOpen(),this.type==="auto")){const t=this.getRootNode();this.open?t.addEventListener("focusout",this.closeOnFocusOut,{capture:!0}):t.removeEventListener("focusout",this.closeOnFocusOut,{capture:!0})}}bindEvents(){var e;(e=this.strategy)==null||e.abort(),this.strategy=void 0,this.hasNonVirtualTrigger&&this.triggerInteraction&&(this.strategy=new D[this.triggerInteraction](this.triggerElement,{overlay:this}))}handleBeforetoggle(e){e.newState!=="open"&&this.handleBrowserClose(e)}handleBrowserClose(e){var t;if(e.stopPropagation(),!((t=this.strategy)!=null&&t.activelyOpening)){this.open=!1;return}this.manuallyKeepOpen()}manuallyKeepOpen(){this.open=!0,this.placementController.allowPlacementUpdate=!0,this.manageOpen(!1)}handleSlotchange(){var e,t;this.elements.length?this.hasNonVirtualTrigger&&((t=this.strategy)==null||t.prepareDescription(this.triggerElement)):(e=this.strategy)==null||e.releaseDescription()}shouldPreventClose(){const e=this.willPreventClose;return this.willPreventClose=!1,e}requestSlottable(){this.lastRequestSlottableState!==this.open&&(this.open||document.body.offsetHeight,this.dispatchEvent(new N("overlay-content",this.open?{}:q)),this.lastRequestSlottableState=this.open)}willUpdate(e){var o;if(this.hasAttribute("id")||this.setAttribute("id",`${this.tagName.toLowerCase()}-${S()}`),e.has("open")&&(this.hasUpdated||this.open)&&this.manageOpen(e.get("open")),e.has("trigger")){const[s,l]=((o=this.trigger)==null?void 0:o.split("@"))||[];this.elementResolver.selector=s?`#${s}`:"",this.triggerInteraction=l}let t=!1;e.has(T)&&(t=this.triggerElement,this.triggerElement=this.elementResolver.element),e.has("triggerElement")&&(t=e.get("triggerElement")),t!==!1&&this.bindEvents()}updated(e){super.updated(e),e.has("placement")&&(this.placement?this.dialogEl.setAttribute("actual-placement",this.placement):this.dialogEl.removeAttribute("actual-placement"),this.open&&typeof e.get("placement")!="undefined"&&this.placementController.resetOverlayPosition()),e.has("state")&&this.state==="closed"&&typeof e.get("state")!="undefined"&&this.placementController.clearOverlayPosition()}renderContent(){return d` | ||
<slot @slotchange=${this.handleSlotchange}></slot> | ||
@@ -3,0 +3,0 @@ `}get dialogStyleMap(){return{"--swc-overlay-open-count":i.openCount.toString()}}renderDialog(){return d` |
@@ -18,2 +18,3 @@ "use strict"; | ||
const targetOpenState = this.open; | ||
await nextFrame(); | ||
await this.managePosition(); | ||
@@ -20,0 +21,0 @@ if (this.open !== targetOpenState) { |
@@ -1,2 +0,2 @@ | ||
"use strict";import{firstFocusableIn as u,firstFocusableSlottedIn as d}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{VirtualTrigger as f}from"./VirtualTrigger.js";import{guaranteedAllTransitionend as E,nextFrame as c}from"./AbstractOverlay.js";import{BeforetoggleClosedEvent as v,BeforetoggleOpenEvent as g,OverlayStateEvent as l}from"./events.js";import{userFocusableSelector as y}from"@spectrum-web-components/shared";export function OverlayDialog(h){class p extends h{async manageDialogOpen(){const e=this.open;if(await this.managePosition(),this.open!==e)return;const i=await this.dialogMakeTransition(e);this.open===e&&await this.dialogApplyFocus(e,i)}async dialogMakeTransition(e){let i=null;const m=(t,s)=>async()=>{if(t.open=e,!e){const n=()=>{t.removeEventListener("close",n),a(t,s)};t.addEventListener("close",n)}if(s>0)return;const o=e?g:v;this.dispatchEvent(new o),e&&(t.matches(y)&&(i=t),i=i||u(t),i||t.querySelectorAll("slot").forEach(r=>{i||(i=d(r))}),!(!this.isConnected||this.dialogEl.open)&&this.dialogEl.showModal())},a=(t,s)=>()=>{if(this.open!==e)return;const o=e?"sp-opened":"sp-closed";if(s>0){t.dispatchEvent(new l(o,this,{interaction:this.type,publish:!1}));return}if(!this.isConnected||e!==this.open)return;const n=async()=>{const r=this.triggerElement instanceof f;this.dispatchEvent(new l(o,this,{interaction:this.type,publish:r})),t.dispatchEvent(new l(o,this,{interaction:this.type,publish:!1})),this.triggerElement&&!r&&this.triggerElement.dispatchEvent(new l(o,this,{interaction:this.type,publish:!0})),this.state=e?"opened":"closed",this.returnFocus(),await c(),await c(),e===this.open&&e===!1&&this.requestSlottable()};!e&&this.dialogEl.open?(this.dialogEl.addEventListener("close",()=>{n()},{once:!0}),this.dialogEl.close()):n()};return this.elements.forEach((t,s)=>{E(t,m(t,s),a(t,s))}),i}async dialogApplyFocus(e,i){this.applyFocus(e,i)}}return p} | ||
"use strict";import{firstFocusableIn as u,firstFocusableSlottedIn as d}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{VirtualTrigger as f}from"./VirtualTrigger.js";import{guaranteedAllTransitionend as E,nextFrame as a}from"./AbstractOverlay.js";import{BeforetoggleClosedEvent as v,BeforetoggleOpenEvent as g,OverlayStateEvent as l}from"./events.js";import{userFocusableSelector as y}from"@spectrum-web-components/shared";export function OverlayDialog(h){class p extends h{async manageDialogOpen(){const e=this.open;if(await a(),await this.managePosition(),this.open!==e)return;const i=await this.dialogMakeTransition(e);this.open===e&&await this.dialogApplyFocus(e,i)}async dialogMakeTransition(e){let i=null;const m=(t,s)=>async()=>{if(t.open=e,!e){const n=()=>{t.removeEventListener("close",n),c(t,s)};t.addEventListener("close",n)}if(s>0)return;const o=e?g:v;this.dispatchEvent(new o),e&&(t.matches(y)&&(i=t),i=i||u(t),i||t.querySelectorAll("slot").forEach(r=>{i||(i=d(r))}),!(!this.isConnected||this.dialogEl.open)&&this.dialogEl.showModal())},c=(t,s)=>()=>{if(this.open!==e)return;const o=e?"sp-opened":"sp-closed";if(s>0){t.dispatchEvent(new l(o,this,{interaction:this.type,publish:!1}));return}if(!this.isConnected||e!==this.open)return;const n=async()=>{const r=this.triggerElement instanceof f;this.dispatchEvent(new l(o,this,{interaction:this.type,publish:r})),t.dispatchEvent(new l(o,this,{interaction:this.type,publish:!1})),this.triggerElement&&!r&&this.triggerElement.dispatchEvent(new l(o,this,{interaction:this.type,publish:!0})),this.state=e?"opened":"closed",this.returnFocus(),await a(),await a(),e===this.open&&e===!1&&this.requestSlottable()};!e&&this.dialogEl.open?(this.dialogEl.addEventListener("close",()=>{n()},{once:!0}),this.dialogEl.close()):n()};return this.elements.forEach((t,s)=>{E(t,m(t,s),c(t,s))}),i}async dialogApplyFocus(e,i){this.applyFocus(e,i)}}return p} | ||
//# sourceMappingURL=OverlayDialog.js.map |
@@ -70,3 +70,3 @@ "use strict"; | ||
} | ||
async shouldShowPopover(targetOpenState) { | ||
shouldShowPopover(targetOpenState) { | ||
let popoverOpen = false; | ||
@@ -84,3 +84,3 @@ try { | ||
this.dialogEl.showPopover(); | ||
await this.managePosition(); | ||
this.managePosition(); | ||
} | ||
@@ -93,3 +93,3 @@ } | ||
} | ||
await this.shouldShowPopover(targetOpenState); | ||
this.shouldShowPopover(targetOpenState); | ||
await nextFrame(); | ||
@@ -96,0 +96,0 @@ } |
@@ -1,2 +0,2 @@ | ||
"use strict";import{firstFocusableIn as E,firstFocusableSlottedIn as y}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{VirtualTrigger as b}from"./VirtualTrigger.js";import{guaranteedAllTransitionend as w,nextFrame as l,overlayTimer as m}from"./AbstractOverlay.js";import{BeforetoggleClosedEvent as P,BeforetoggleOpenEvent as g,OverlayStateEvent as h}from"./events.js";import{userFocusableSelector as T}from"@spectrum-web-components/shared";const C=CSS.supports("(overlay: auto)");function f(a){let c=!1;try{c=a.matches(":popover-open")}catch(e){}let p=!1;try{p=a.matches(":open")}catch(e){}return c||p}export function OverlayPopover(a){class c extends a{async manageDelay(e){if(e===!1||e!==this.open){m.close(this);return}this.delayed&&await m.openTimer(this)&&(this.open=!e)}async shouldHidePopover(e){if(e&&this.open!==e)return;const o=async({newState:i}={})=>{i!=="open"&&await this.placementController.resetOverlayPosition()};if(!f(this.dialogEl)){o();return}this.dialogEl.addEventListener("toggle",o,{once:!0})}async shouldShowPopover(e){let o=!1;try{o=this.dialogEl.matches(":popover-open")}catch(u){}let i=!1;try{i=this.dialogEl.matches(":open")}catch(u){}e&&this.open===e&&!o&&!i&&this.isConnected&&(this.dialogEl.showPopover(),await this.managePosition())}async ensureOnDOM(e){await l(),C||await this.shouldHidePopover(e),await this.shouldShowPopover(e),await l()}async makeTransition(e){if(this.open!==e)return null;let o=null;const i=(t,s)=>()=>{if(t.open=e,s===0){const r=e?g:P;this.dispatchEvent(new r)}if(!e||(t.matches(T)&&(o=t),o=o||E(t),o))return;t.querySelectorAll("slot").forEach(r=>{o||(o=y(r))})},u=(t,s)=>async()=>{if(this.open!==e)return;const n=e?"sp-opened":"sp-closed";if(s>0){t.dispatchEvent(new h(n,this,{interaction:this.type,publish:!1}));return}const r=async()=>{if(this.open!==e)return;await l();const d=this.triggerElement instanceof b;this.dispatchEvent(new h(n,this,{interaction:this.type,publish:d})),t.dispatchEvent(new h(n,this,{interaction:this.type,publish:!1})),this.triggerElement&&!d&&this.triggerElement.dispatchEvent(new h(n,this,{interaction:this.type,publish:!0})),this.state=e?"opened":"closed",this.returnFocus(),await l(),await l(),e===this.open&&e===!1&&this.requestSlottable()};if(this.open!==e)return;const v=f(this.dialogEl);e!==!0&&v&&this.isConnected?(this.dialogEl.addEventListener("beforetoggle",()=>{r()},{once:!0}),this.dialogEl.hidePopover()):r()};return this.elements.forEach((t,s)=>{w(t,i(t,s),u(t,s))}),o}}return c} | ||
"use strict";import{firstFocusableIn as E,firstFocusableSlottedIn as y}from"@spectrum-web-components/shared/src/first-focusable-in.js";import{VirtualTrigger as b}from"./VirtualTrigger.js";import{guaranteedAllTransitionend as w,nextFrame as l,overlayTimer as m}from"./AbstractOverlay.js";import{BeforetoggleClosedEvent as P,BeforetoggleOpenEvent as g,OverlayStateEvent as h}from"./events.js";import{userFocusableSelector as T}from"@spectrum-web-components/shared";const C=CSS.supports("(overlay: auto)");function f(a){let c=!1;try{c=a.matches(":popover-open")}catch(e){}let p=!1;try{p=a.matches(":open")}catch(e){}return c||p}export function OverlayPopover(a){class c extends a{async manageDelay(e){if(e===!1||e!==this.open){m.close(this);return}this.delayed&&await m.openTimer(this)&&(this.open=!e)}async shouldHidePopover(e){if(e&&this.open!==e)return;const o=async({newState:i}={})=>{i!=="open"&&await this.placementController.resetOverlayPosition()};if(!f(this.dialogEl)){o();return}this.dialogEl.addEventListener("toggle",o,{once:!0})}shouldShowPopover(e){let o=!1;try{o=this.dialogEl.matches(":popover-open")}catch(u){}let i=!1;try{i=this.dialogEl.matches(":open")}catch(u){}e&&this.open===e&&!o&&!i&&this.isConnected&&(this.dialogEl.showPopover(),this.managePosition())}async ensureOnDOM(e){await l(),C||await this.shouldHidePopover(e),this.shouldShowPopover(e),await l()}async makeTransition(e){if(this.open!==e)return null;let o=null;const i=(t,s)=>()=>{if(t.open=e,s===0){const r=e?g:P;this.dispatchEvent(new r)}if(!e||(t.matches(T)&&(o=t),o=o||E(t),o))return;t.querySelectorAll("slot").forEach(r=>{o||(o=y(r))})},u=(t,s)=>async()=>{if(this.open!==e)return;const n=e?"sp-opened":"sp-closed";if(s>0){t.dispatchEvent(new h(n,this,{interaction:this.type,publish:!1}));return}const r=async()=>{if(this.open!==e)return;await l();const d=this.triggerElement instanceof b;this.dispatchEvent(new h(n,this,{interaction:this.type,publish:d})),t.dispatchEvent(new h(n,this,{interaction:this.type,publish:!1})),this.triggerElement&&!d&&this.triggerElement.dispatchEvent(new h(n,this,{interaction:this.type,publish:!0})),this.state=e?"opened":"closed",this.returnFocus(),await l(),await l(),e===this.open&&e===!1&&this.requestSlottable()};if(this.open!==e)return;const v=f(this.dialogEl);e!==!0&&v&&this.isConnected?(this.dialogEl.addEventListener("beforetoggle",()=>{r()},{once:!0}),this.dialogEl.hidePopover()):r()};return this.elements.forEach((t,s)=>{w(t,i(t,s),u(t,s))}),o}}return c} | ||
//# sourceMappingURL=OverlayPopover.js.map |
@@ -34,4 +34,4 @@ import { Overlay } from './Overlay.js'; | ||
* When overlays are added manage the open state of exisiting overlays appropriately: | ||
* - 'modal': should close other overlays | ||
* - 'page': should close other overlays | ||
* - 'modal': should close other non-'modal' and non-'manual' overlays | ||
* - 'page': should close other non-'modal' and non-'manual' overlays | ||
* - 'auto': should close other 'auto' overlays and other 'hint' overlays, but not 'manual' overlays | ||
@@ -38,0 +38,0 @@ * - 'manual': shouldn't close other overlays |
@@ -26,2 +26,4 @@ "use strict"; | ||
if (!(composedPath == null ? void 0 : composedPath.length)) return; | ||
const lastOverlay = this.lastOverlay; | ||
this.lastOverlay = void 0; | ||
const lastIndex = this.stack.length - 1; | ||
@@ -35,6 +37,7 @@ const nonAncestorOverlays = this.stack.filter((overlay, i) => { | ||
// `triggerInteraction` of "longpress", meaning it was opened by this poitner interaction | ||
i === lastIndex && overlay !== this.lastOverlay && overlay.triggerInteraction === "longpress" | ||
i === lastIndex && overlay !== lastOverlay && overlay.triggerInteraction === "longpress" | ||
) | ||
); | ||
return !inStack && !overlay.shouldPreventClose() && overlay.type !== "manual"; | ||
return !inStack && !overlay.shouldPreventClose() && overlay.type !== "manual" && // Don't close if this overlay is modal and not on top of the overlay stack. | ||
!(overlay.type === "modal" && lastOverlay !== overlay); | ||
}); | ||
@@ -101,4 +104,4 @@ nonAncestorOverlays.reverse(); | ||
* When overlays are added manage the open state of exisiting overlays appropriately: | ||
* - 'modal': should close other overlays | ||
* - 'page': should close other overlays | ||
* - 'modal': should close other non-'modal' and non-'manual' overlays | ||
* - 'page': should close other non-'modal' and non-'manual' overlays | ||
* - 'auto': should close other 'auto' overlays and other 'hint' overlays, but not 'manual' overlays | ||
@@ -129,3 +132,3 @@ * - 'manual': shouldn't close other overlays | ||
const inPath = path.find((el) => el === overlayEl); | ||
if (!inPath && overlayEl.type !== "manual") { | ||
if (!inPath && overlayEl.type !== "manual" && overlayEl.type !== "modal") { | ||
this.closeOverlay(overlayEl); | ||
@@ -132,0 +135,0 @@ } |
@@ -1,2 +0,2 @@ | ||
"use strict";const h="showPopover"in document.createElement("div");class c{constructor(){this.root=document.body;this.stack=[];this.handlePointerdown=t=>{this.pointerdownPath=t.composedPath(),this.lastOverlay=this.stack[this.stack.length-1]};this.handlePointerup=()=>{const t=this.pointerdownPath;if(this.pointerdownPath=void 0,!this.stack.length||!(t!=null&&t.length))return;const e=this.stack.length-1,s=this.stack.filter((n,i)=>!t.find(a=>a===n||a===(n==null?void 0:n.triggerElement)&&(n==null?void 0:n.type)==="hint"||i===e&&n!==this.lastOverlay&&n.triggerInteraction==="longpress")&&!n.shouldPreventClose()&&n.type!=="manual");s.reverse(),s.forEach(n=>{this.closeOverlay(n);let i=n.parentOverlayToForceClose;for(;i;)this.closeOverlay(i),i=i.parentOverlayToForceClose})};this.handleBeforetoggle=t=>{const{target:e,newState:s}=t;s!=="open"&&this.closeOverlay(e)};this.handleKeydown=t=>{if(t.code!=="Escape"||!this.stack.length)return;const e=this.stack[this.stack.length-1];if((e==null?void 0:e.type)==="page"){t.preventDefault();return}h||(e==null?void 0:e.type)!=="manual"&&e&&this.closeOverlay(e)};this.bindEvents()}get document(){return this.root.ownerDocument||document}bindEvents(){this.document.addEventListener("pointerdown",this.handlePointerdown),this.document.addEventListener("pointerup",this.handlePointerup),this.document.addEventListener("keydown",this.handleKeydown)}closeOverlay(t){const e=this.stack.indexOf(t);e>-1&&this.stack.splice(e,1),t.open=!1}overlaysByTriggerElement(t){return this.stack.filter(e=>e.triggerElement===t)}add(t){if(this.stack.includes(t)){const e=this.stack.indexOf(t);e>-1&&(this.stack.splice(e,1),this.stack.push(t));return}if(t.type==="auto"||t.type==="modal"||t.type==="page"){const e="sp-overlay-query-path",s=new Event(e,{composed:!0,bubbles:!0});t.addEventListener(e,n=>{const i=n.composedPath();this.stack.forEach(r=>{!i.find(o=>o===r)&&r.type!=="manual"&&this.closeOverlay(r)})},{once:!0}),t.dispatchEvent(s)}else if(t.type==="hint"){if(this.stack.some(s=>s.type!=="manual"&&s.triggerElement&&s.triggerElement===t.triggerElement)){t.open=!1;return}this.stack.forEach(s=>{s.type==="hint"&&this.closeOverlay(s)})}requestAnimationFrame(()=>{this.stack.push(t),t.addEventListener("beforetoggle",this.handleBeforetoggle,{once:!0})})}remove(t){this.closeOverlay(t)}}export const overlayStack=new c; | ||
"use strict";const h="showPopover"in document.createElement("div");class c{constructor(){this.root=document.body;this.stack=[];this.handlePointerdown=t=>{this.pointerdownPath=t.composedPath(),this.lastOverlay=this.stack[this.stack.length-1]};this.handlePointerup=()=>{const t=this.pointerdownPath;if(this.pointerdownPath=void 0,!this.stack.length||!(t!=null&&t.length))return;const e=this.lastOverlay;this.lastOverlay=void 0;const s=this.stack.length-1,r=this.stack.filter((n,i)=>!t.find(a=>a===n||a===(n==null?void 0:n.triggerElement)&&(n==null?void 0:n.type)==="hint"||i===s&&n!==e&&n.triggerInteraction==="longpress")&&!n.shouldPreventClose()&&n.type!=="manual"&&!(n.type==="modal"&&e!==n));r.reverse(),r.forEach(n=>{this.closeOverlay(n);let i=n.parentOverlayToForceClose;for(;i;)this.closeOverlay(i),i=i.parentOverlayToForceClose})};this.handleBeforetoggle=t=>{const{target:e,newState:s}=t;s!=="open"&&this.closeOverlay(e)};this.handleKeydown=t=>{if(t.code!=="Escape"||!this.stack.length)return;const e=this.stack[this.stack.length-1];if((e==null?void 0:e.type)==="page"){t.preventDefault();return}h||(e==null?void 0:e.type)!=="manual"&&e&&this.closeOverlay(e)};this.bindEvents()}get document(){return this.root.ownerDocument||document}bindEvents(){this.document.addEventListener("pointerdown",this.handlePointerdown),this.document.addEventListener("pointerup",this.handlePointerup),this.document.addEventListener("keydown",this.handleKeydown)}closeOverlay(t){const e=this.stack.indexOf(t);e>-1&&this.stack.splice(e,1),t.open=!1}overlaysByTriggerElement(t){return this.stack.filter(e=>e.triggerElement===t)}add(t){if(this.stack.includes(t)){const e=this.stack.indexOf(t);e>-1&&(this.stack.splice(e,1),this.stack.push(t));return}if(t.type==="auto"||t.type==="modal"||t.type==="page"){const e="sp-overlay-query-path",s=new Event(e,{composed:!0,bubbles:!0});t.addEventListener(e,r=>{const n=r.composedPath();this.stack.forEach(i=>{!n.find(a=>a===i)&&i.type!=="manual"&&i.type!=="modal"&&this.closeOverlay(i)})},{once:!0}),t.dispatchEvent(s)}else if(t.type==="hint"){if(this.stack.some(s=>s.type!=="manual"&&s.triggerElement&&s.triggerElement===t.triggerElement)){t.open=!1;return}this.stack.forEach(s=>{s.type==="hint"&&this.closeOverlay(s)})}requestAnimationFrame(()=>{this.stack.push(t),t.addEventListener("beforetoggle",this.handleBeforetoggle,{once:!0})})}remove(t){this.closeOverlay(t)}}export const overlayStack=new c; | ||
//# sourceMappingURL=OverlayStack.js.map |
@@ -335,3 +335,3 @@ "use strict"; | ||
}); | ||
it('closes "page" overlays when opening', async function() { | ||
it('should not close "modal" overlays when opening', async function() { | ||
let opened = oneEvent(this.modal, "sp-opened"); | ||
@@ -346,7 +346,5 @@ this.modal.open = true; | ||
opened = oneEvent(this.page, "sp-opened"); | ||
const closed = oneEvent(this.modal, "sp-closed"); | ||
this.page.open = true; | ||
await opened; | ||
await closed; | ||
expect(this.modal.open).to.be.false; | ||
expect(this.modal.open).to.be.true; | ||
expect(this.page.open).to.be.true; | ||
@@ -353,0 +351,0 @@ expect(this.hint.open).to.be.false; |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Unidentified License
License(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.
Found 3 instances in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Unidentified License
License(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.
Found 3 instances in 1 package
1417582
14945