@cas-smartdesign/popover 4.1.1 → 4.1.2

package/dist/docs/doc.mjs

@@ -63,7 +63,7 @@ container.appendChild(popover);
   <path d="M0 0l11.96 12L24 0z" fill="#999" class="arrow-border"/>\r
   <path d="M12 11L1 0h22z" fill="#f2f2f2" class="arrow-background"/>\r
 </svg>\r
-`,Qs=navigator.userAgent.indexOf("Trident")!==-1,Fr=1,Hr="sd-popover-open",Mr=class Mr extends HTMLElement{constructor(){super(...arguments),this._open=!1,this._firstUpdated=!1,this.toggle=()=>{this.open=!this.open},this.show=()=>{this.open=!0},this.hide=()=>{this.open=!1},this.hideIfExternalTarget=e=>{const t=e.target;(!(t instanceof HTMLElement)||!this._container.contains(t)&&!this.targetElement.contains(t))&&this.hide()}}get triggerType(){return this.getAttribute("trigger-type")}set triggerType(e){e?this.setAttribute("trigger-type",e):this.removeAttribute("trigger-type")}get placement(){return this.getAttribute("placement")}set placement(e){e?this.setAttribute("placement",e):this.removeAttribute("placement")}get targetElement(){return this._targetElement}set targetElement(e){this.removeTargetEventListener(this.targetElement),this._targetElement&&this._targetElement.getAttribute("aria-expanded")=="true"&&this._targetElement.setAttribute("aria-expanded","false"),this._targetElement=e,e.setAttribute("aria-expanded","false"),this.addTargetEventListener(this.targetElement),this.updatePopper()}get targetSelector(){return this.getAttribute("target-selector")}set targetSelector(e){e?this.setAttribute("target-selector",e):this.removeAttribute("target-selector")}get modal(){return this.hasAttribute("modal")}set modal(e){e?this.setAttribute("modal",""):this.removeAttribute("modal")}get popoverFor(){return this.getAttribute("popover-for")}set popoverFor(e){e?this.setAttribute("popover-for",e):this.removeAttribute("popover-for")}get flipPriority(){return this._flipPriority}set flipPriority(e){e&&e.length>0?this._flipPriority=e:this._flipPriority=null,this.reConfigurePopper()}get offset(){return this.getAttribute("offset")?parseInt(this.getAttribute("offset")):0}set offset(e){e?this.setAttribute("offset",e.toString()):this.removeAttribute("offset"),this.reConfigurePopper()}reConfigurePopper(){this._popper&&this.configurePopper()}get noArrow(){return this.hasAttribute("no-arrow")}set noArrow(e){e?this.setAttribute("no-arrow",""):this.removeAttribute("no-arrow")}static get observedAttributes(){return["placement","target-selector","trigger-type"]}attributeChangedCallback(e,t){switch(e){case"placement":{this.updatePopper();break}case"trigger-type":{this.removeTargetEventListener(this.targetElement),this.addTargetEventListener(this.targetElement);break}case"target-selector":{this.handleTargetSelectorChange(t);break}}}connectedCallback(){this._firstUpdated||(this.firstUpdated(),this._firstUpdated=!0),this.targetElement?this.addTargetEventListener(this.targetElement):this.targetSelector&&requestAnimationFrame(()=>{this.isConnected&&this.handleTargetSelectorChange(null)}),this._arrow=document.createElement("div"),this._arrow.classList.add("popover-arrow"),this._arrow.setAttribute("data-popper-arrow",""),this._arrow.style.display="flex",this._arrow.innerHTML=Ys}disconnectedCallback(){this.targetElement&&(this.removeTargetEventListener(this.targetElement),this.removeTargetClassForOpen(this.targetElement)),this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=null)}firstUpdated(){this.style.display="none",this.triggerType=this.triggerType||"click",this.placement=this.placement||"auto"}get open(){return this._open}set open(e){e!==this._open&&(this._open=e,this.handleOpenChange())}handleOpenChange(){this.open?(this._popper||this.configurePopper(),this._container.innerHTML="",this.popoverFor&&this._container.setAttribute("popover-for",this.popoverFor),this.content&&(this._container.prepend(this.content),Object.assign(this.content.style,{position:"relative",display:"block",zIndex:1}),window.requestAnimationFrame(()=>{let e=getComputedStyle(this.content).backgroundColor;e=="rgba(0, 0, 0, 0)"&&(this.content.style.background=e="#f2f2f2"),this._arrow.querySelector(".arrow-background").style.fill=e})),this.ensureArrowIsAdded(),this.ownerDocument.body.appendChild(this._container),this.updatePopper(),this.setAttribute("open",""),this.modal&&(window.addEventListener("click",this.hideIfExternalTarget,{capture:!0}),window.addEventListener("focus",this.hideIfExternalTarget,{capture:!0})),this.targetElement&&(this.addTargetClassForOpen(this.targetElement),this.targetElement.setAttribute("aria-expanded","true")),this.dispatchEvent(new CustomEvent("open"))):(this.ownerDocument.body.removeChild(this._container),this.removeAttribute("open"),window.removeEventListener("click",this.hideIfExternalTarget,{capture:!0}),window.removeEventListener("focus",this.hideIfExternalTarget,{capture:!0}),this.targetElement&&(this.removeTargetClassForOpen(this.targetElement),this.targetElement.setAttribute("aria-expanded","false")),this.dispatchEvent(new CustomEvent("close")))}handleTargetSelectorChange(e){const t=document.querySelector(e);t&&(this.removeTargetEventListener(t),this.removeTargetClassForOpen(t)),this.targetSelector&&(this.targetElement=document.querySelector(this.targetSelector),this.addTargetEventListener(this.targetElement))}addTargetEventListener(e){if(e)switch(this.triggerType){case"hover":{e.addEventListener("mouseenter",this.show),e.addEventListener("mouseleave",this.hide);break}case"click":{e.addEventListener("click",this.toggle);break}}}removeTargetEventListener(e){if(e)switch(this.triggerType){case"hover":{e.removeEventListener("mouseenter",this.show),e.removeEventListener("mouseleave",this.hide);break}case"click":{e.removeEventListener("click",this.toggle);break}}}configurePopper(){this.createContentContainer(),this.ensureArrowIsAdded();const e=this,t={placement:e.placement,strategy:"absolute",modifiers:[{name:"computeStyles",options:{gpuAcceleration:!Qs}},{name:"flip",options:{fallbackPlacements:e._flipPriority}},{name:"offset",options:{offset:()=>[0,e.noArrow?0+e.offset:this._arrow.clientHeight+e.offset]}},{name:"arrow",options:{padding:6}},{name:"resetArrowStyles",enabled:!0,phase:"beforeWrite",fn({state:r}){Object.assign(e._arrow.style,{top:r.styles.arrow.top||"",left:r.styles.arrow.left||"",bottom:r.styles.arrow.bottom||"",right:r.styles.arrow.right||""})}},{name:"onUpdate",enabled:!0,phase:"afterWrite",fn({state:r}){e.updateArrow(r.placement)}}]};this._popper=Js(this.targetElement,this._container,t)}createContentContainer(){this._container=document.createElement("div"),this._container.classList.add("popover-container"),this._container.tabIndex=0,this._resizeObserver&&this._resizeObserver.disconnect(),this._resizeObserver=new ResizeObserver(()=>{this._popper&&this._popper.update()}),this._resizeObserver.observe(this._container),Object.assign(this._container.style,{boxShadow:`0 4px 5px 0 rgba(0, 0, 0, 0.14),
+`,Qs=navigator.userAgent.indexOf("Trident")!==-1,Fr=1,Hr="sd-popover-open",Mr=class Mr extends HTMLElement{constructor(){super(...arguments),this._open=!1,this._firstUpdated=!1,this.toggle=()=>{this.open=!this.open},this.show=()=>{this.open=!0},this.hide=()=>{this.open=!1},this.hideIfExternalTarget=e=>{const t=e.target;(!(t instanceof HTMLElement)||!this._container.contains(t)&&!this.targetElement.contains(t))&&this.hide()}}get triggerType(){return this.getAttribute("trigger-type")}set triggerType(e){e?this.setAttribute("trigger-type",e):this.removeAttribute("trigger-type")}get placement(){return this.getAttribute("placement")}set placement(e){e?this.setAttribute("placement",e):this.removeAttribute("placement")}get targetElement(){return this._targetElement}set targetElement(e){this.removeTargetEventListener(this.targetElement),this._targetElement&&this._targetElement.getAttribute("aria-expanded")=="true"&&this._targetElement.setAttribute("aria-expanded","false"),this._targetElement=e,e&&e.setAttribute("aria-expanded","false"),this.addTargetEventListener(this.targetElement),this.updatePopper()}get targetSelector(){return this.getAttribute("target-selector")}set targetSelector(e){e?this.setAttribute("target-selector",e):this.removeAttribute("target-selector")}get modal(){return this.hasAttribute("modal")}set modal(e){e?this.setAttribute("modal",""):this.removeAttribute("modal")}get popoverFor(){return this.getAttribute("popover-for")}set popoverFor(e){e?this.setAttribute("popover-for",e):this.removeAttribute("popover-for")}get flipPriority(){return this._flipPriority}set flipPriority(e){e&&e.length>0?this._flipPriority=e:this._flipPriority=null,this.reConfigurePopper()}get offset(){return this.getAttribute("offset")?parseInt(this.getAttribute("offset")):0}set offset(e){e?this.setAttribute("offset",e.toString()):this.removeAttribute("offset"),this.reConfigurePopper()}reConfigurePopper(){this._popper&&this.configurePopper()}get noArrow(){return this.hasAttribute("no-arrow")}set noArrow(e){e?this.setAttribute("no-arrow",""):this.removeAttribute("no-arrow")}static get observedAttributes(){return["placement","target-selector","trigger-type"]}attributeChangedCallback(e,t){switch(e){case"placement":{this.updatePopper();break}case"trigger-type":{this.removeTargetEventListener(this.targetElement),this.addTargetEventListener(this.targetElement);break}case"target-selector":{this.handleTargetSelectorChange(t);break}}}connectedCallback(){this._firstUpdated||(this.firstUpdated(),this._firstUpdated=!0),this.targetElement?this.addTargetEventListener(this.targetElement):this.targetSelector&&requestAnimationFrame(()=>{this.isConnected&&this.handleTargetSelectorChange(null)}),this._arrow=document.createElement("div"),this._arrow.classList.add("popover-arrow"),this._arrow.setAttribute("data-popper-arrow",""),this._arrow.style.display="flex",this._arrow.innerHTML=Ys}disconnectedCallback(){this.targetElement&&(this.removeTargetEventListener(this.targetElement),this.removeTargetClassForOpen(this.targetElement)),this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=null)}firstUpdated(){this.style.display="none",this.triggerType=this.triggerType||"click",this.placement=this.placement||"auto"}get open(){return this._open}set open(e){e!==this._open&&(this._open=e,this.handleOpenChange())}handleOpenChange(){this.open?(this._popper||this.configurePopper(),this._container.innerHTML="",this.popoverFor&&this._container.setAttribute("popover-for",this.popoverFor),this.content&&(this._container.prepend(this.content),Object.assign(this.content.style,{position:"relative",display:"block",zIndex:1}),window.requestAnimationFrame(()=>{let e=getComputedStyle(this.content).backgroundColor;e=="rgba(0, 0, 0, 0)"&&(this.content.style.background=e="#f2f2f2"),this._arrow.querySelector(".arrow-background").style.fill=e})),this.ensureArrowIsAdded(),this.ownerDocument.body.appendChild(this._container),this.updatePopper(),this.setAttribute("open",""),this.modal&&(window.addEventListener("click",this.hideIfExternalTarget,{capture:!0}),window.addEventListener("focus",this.hideIfExternalTarget,{capture:!0})),this.targetElement&&(this.addTargetClassForOpen(this.targetElement),this.targetElement.setAttribute("aria-expanded","true")),this.dispatchEvent(new CustomEvent("open"))):(this.ownerDocument.body.removeChild(this._container),this.removeAttribute("open"),window.removeEventListener("click",this.hideIfExternalTarget,{capture:!0}),window.removeEventListener("focus",this.hideIfExternalTarget,{capture:!0}),this.targetElement&&(this.removeTargetClassForOpen(this.targetElement),this.targetElement.setAttribute("aria-expanded","false")),this.dispatchEvent(new CustomEvent("close")))}handleTargetSelectorChange(e){const t=document.querySelector(e);t&&(this.removeTargetEventListener(t),this.removeTargetClassForOpen(t)),this.targetSelector&&(this.targetElement=document.querySelector(this.targetSelector),this.addTargetEventListener(this.targetElement))}addTargetEventListener(e){if(e)switch(this.triggerType){case"hover":{e.addEventListener("mouseenter",this.show),e.addEventListener("mouseleave",this.hide);break}case"click":{e.addEventListener("click",this.toggle);break}}}removeTargetEventListener(e){if(e)switch(this.triggerType){case"hover":{e.removeEventListener("mouseenter",this.show),e.removeEventListener("mouseleave",this.hide);break}case"click":{e.removeEventListener("click",this.toggle);break}}}configurePopper(){this.createContentContainer(),this.ensureArrowIsAdded();const e=this,t={placement:e.placement,strategy:"absolute",modifiers:[{name:"computeStyles",options:{gpuAcceleration:!Qs}},{name:"flip",options:{fallbackPlacements:e._flipPriority}},{name:"offset",options:{offset:()=>[0,e.noArrow?0+e.offset:this._arrow.clientHeight+e.offset]}},{name:"arrow",options:{padding:6}},{name:"resetArrowStyles",enabled:!0,phase:"beforeWrite",fn({state:r}){Object.assign(e._arrow.style,{top:r.styles.arrow.top||"",left:r.styles.arrow.left||"",bottom:r.styles.arrow.bottom||"",right:r.styles.arrow.right||""})}},{name:"onUpdate",enabled:!0,phase:"afterWrite",fn({state:r}){e.updateArrow(r.placement)}}]};this._popper=Js(this.targetElement,this._container,t)}createContentContainer(){this._container=document.createElement("div"),this._container.classList.add("popover-container"),this._container.tabIndex=0,this._resizeObserver&&this._resizeObserver.disconnect(),this._resizeObserver=new ResizeObserver(()=>{this._popper&&this._popper.update()}),this._resizeObserver.observe(this._container),Object.assign(this._container.style,{boxShadow:`0 4px 5px 0 rgba(0, 0, 0, 0.14),
                         0 1px 10px 0 rgba(0, 0, 0, 0.12),
                         0 2px 4px -1px rgba(0, 0, 0, 0.4)`,border:"1px solid #999",boxSizing:"border-box",zIndex:2e4})}ensureArrowIsAdded(){!this.noArrow&&!this._container.contains(this._arrow)&&this._container.appendChild(this._arrow)}updatePopper(){this._popper&&(this._popper.state.elements.reference=this.targetElement,this._popper.state.options.placement=this.placement,this.open&&this._popper.update())}updateArrow(e){if(this._arrow){const t=this.getArrowVariant(e);if(this._arrow.setAttribute("variant",t),this._content){const r=this._arrow.querySelector("svg"),i=this._arrow.clientWidth,o=this._arrow.clientHeight,s=`-${o-Fr}px`,a=(i-o)/2,l=`-${o+a-Fr}px`;switch(t){case"bottom":{this._arrow.style.top=s,r.style.transform="rotate(180deg)";break}case"top":{this._arrow.style.bottom=s,r.style.transform="rotate(0deg)";break}case"left":{this._arrow.style.right=l,r.style.transform="rotate(270deg)";break}case"right":{this._arrow.style.left=l,r.style.transform="rotate(90deg)";break}}}}}getArrowVariant(e){if(e.indexOf("bottom")!==-1)return"bottom";if(e.indexOf("top")!==-1)return"top";if(e.indexOf("left")!==-1)return"left";if(e.indexOf("right")!==-1)return"right"}get content(){return this._content||(this._content=this.firstElementChild,this._content.setAttribute("data-popper-content","")),this._content}addTargetClassForOpen(e){e&&e.classList.add(Hr)}removeTargetClassForOpen(e){e&&e.classList.remove(Hr)}};Mr.ID="sd-popover";let Ve=Mr;customElements.get(Ve.ID)||customElements.define(Ve.ID,Ve);function Sn(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}function eo(n){if(n.__esModule)return n;var e=n.default;if(typeof e=="function"){var t=function r(){return this instanceof r?Reflect.construct(e,arguments,this.constructor):e.apply(this,arguments)};t.prototype=e.prototype}else t={};return Object.defineProperty(t,"__esModule",{value:!0}),Object.keys(n).forEach(function(r){var i=Object.getOwnPropertyDescriptor(n,r);Object.defineProperty(t,r,i.get?i:{enumerable:!0,get:function(){return n[r]}})}),t}var br={exports:{}},B=String,_n=function(){return{isColorSupported:!1,reset:B,bold:B,dim:B,italic:B,underline:B,inverse:B,hidden:B,strikethrough:B,black:B,red:B,green:B,yellow:B,blue:B,magenta:B,cyan:B,white:B,gray:B,bgBlack:B,bgRed:B,bgGreen:B,bgYellow:B,bgBlue:B,bgMagenta:B,bgCyan:B,bgWhite:B}};br.exports=_n();br.exports.createColors=_n;var to=br.exports;const ro={},no=Object.freeze(Object.defineProperty({__proto__:null,default:ro},Symbol.toStringTag,{value:"Module"})),le=eo(no);let Wr=to,qr=le,Xt=class kn extends Error{constructor(e,t,r,i,o,s){super(e),this.name="CssSyntaxError",this.reason=e,o&&(this.file=o),i&&(this.source=i),s&&(this.plugin=s),typeof t<"u"&&typeof r<"u"&&(typeof t=="number"?(this.line=t,this.column=r):(this.line=t.line,this.column=t.column,this.endLine=r.line,this.endColumn=r.column)),this.setMessage(),Error.captureStackTrace&&Error.captureStackTrace(this,kn)}setMessage(){this.message=this.plugin?this.plugin+": ":"",this.message+=this.file?this.file:"<css input>",typeof this.line<"u"&&(this.message+=":"+this.line+":"+this.column),this.message+=": "+this.reason}showSourceCode(e){if(!this.source)return"";let t=this.source;e==null&&(e=Wr.isColorSupported),qr&&e&&(t=qr(t));let r=t.split(/\r?\n/),i=Math.max(this.line-3,0),o=Math.min(this.line+2,r.length),s=String(o).length,a,l;if(e){let{bold:c,gray:u,red:p}=Wr.createColors(!0);a=d=>c(p(d)),l=d=>u(d)}else a=l=c=>c;return r.slice(i,o).map((c,u)=>{let p=i+1+u,d=" "+(" "+p).slice(-s)+" | ";if(p===this.line){let b=l(d.replace(/\d/g," "))+c.slice(0,this.column-1).replace(/[^\t]/g," ");return a(">")+l(d)+c+`
  `+b+a("^")}return" "+l(d)+c}).join(`
@@ -201,8 +201,7 @@ https://github.com/highlightjs/highlight.js/issues/2277`),D=f,k=m),w===void 0&&(
 <ul>
 <li>The first child element represents the content of the popover window.</li>
 </ul>
-<h2 id="examples">Examples</h2>
-`;document.querySelector("#markdown-container").innerHTML=ic;tc(Object.assign({"./examples/1_declarative_button_trigger/index.ts":Ti,"./examples/2_declarative_hover_trigger/index.ts":Ii,"./examples/3_created_from_source/index.ts":qi}));export{Ve as P};
+`,sc=document.querySelector("#markdown-container");sc.innerHTML=ic;tc(Object.assign({"./examples/1_declarative_button_trigger/index.ts":Ti,"./examples/2_declarative_hover_trigger/index.ts":Ii,"./examples/3_created_from_source/index.ts":qi}),document.querySelector(".markdown-body"));export{Ve as P};
 function __vite__mapDeps(indexes) {
   if (!__vite__mapDeps.viteFileDeps) {
     __vite__mapDeps.viteFileDeps = []

package/dist/popover-with-externals.js

@@ -2,7 +2,7 @@ var window;(window||={})["@cas-smartdesign/popover"]=(()=>{var It=Object.defineP
   <path d="M0 0l11.96 12L24 0z" fill="#999" class="arrow-border"/>\r
   <path d="M12 11L1 0h22z" fill="#f2f2f2" class="arrow-background"/>\r
 </svg>\r
-`,Lr=navigator.userAgent.indexOf("Trident")!==-1,Be=1,Me="sd-popover-open",je=class extends HTMLElement{constructor(){super(...arguments),this._open=!1,this._firstUpdated=!1,this.toggle=()=>{this.open=!this.open},this.show=()=>{this.open=!0},this.hide=()=>{this.open=!1},this.hideIfExternalTarget=t=>{let r=t.target;(!(r instanceof HTMLElement)||!this._container.contains(r)&&!this.targetElement.contains(r))&&this.hide()}}get triggerType(){return this.getAttribute("trigger-type")}set triggerType(t){t?this.setAttribute("trigger-type",t):this.removeAttribute("trigger-type")}get placement(){return this.getAttribute("placement")}set placement(t){t?this.setAttribute("placement",t):this.removeAttribute("placement")}get targetElement(){return this._targetElement}set targetElement(t){this.removeTargetEventListener(this.targetElement),this._targetElement&&this._targetElement.getAttribute("aria-expanded")=="true"&&this._targetElement.setAttribute("aria-expanded","false"),this._targetElement=t,t.setAttribute("aria-expanded","false"),this.addTargetEventListener(this.targetElement),this.updatePopper()}get targetSelector(){return this.getAttribute("target-selector")}set targetSelector(t){t?this.setAttribute("target-selector",t):this.removeAttribute("target-selector")}get modal(){return this.hasAttribute("modal")}set modal(t){t?this.setAttribute("modal",""):this.removeAttribute("modal")}get popoverFor(){return this.getAttribute("popover-for")}set popoverFor(t){t?this.setAttribute("popover-for",t):this.removeAttribute("popover-for")}get flipPriority(){return this._flipPriority}set flipPriority(t){t&&t.length>0?this._flipPriority=t:this._flipPriority=null,this.reConfigurePopper()}get offset(){return this.getAttribute("offset")?parseInt(this.getAttribute("offset")):0}set offset(t){t?this.setAttribute("offset",t.toString()):this.removeAttribute("offset"),this.reConfigurePopper()}reConfigurePopper(){this._popper&&this.configurePopper()}get noArrow(){return this.hasAttribute("no-arrow")}set noArrow(t){t?this.setAttribute("no-arrow",""):this.removeAttribute("no-arrow")}static get observedAttributes(){return["placement","target-selector","trigger-type"]}attributeChangedCallback(t,r){switch(t){case"placement":{this.updatePopper();break}case"trigger-type":{this.removeTargetEventListener(this.targetElement),this.addTargetEventListener(this.targetElement);break}case"target-selector":{this.handleTargetSelectorChange(r);break}}}connectedCallback(){this._firstUpdated||(this.firstUpdated(),this._firstUpdated=!0),this.targetElement?this.addTargetEventListener(this.targetElement):this.targetSelector&&requestAnimationFrame(()=>{this.isConnected&&this.handleTargetSelectorChange(null)}),this._arrow=document.createElement("div"),this._arrow.classList.add("popover-arrow"),this._arrow.setAttribute("data-popper-arrow",""),this._arrow.style.display="flex",this._arrow.innerHTML=Sr}disconnectedCallback(){this.targetElement&&(this.removeTargetEventListener(this.targetElement),this.removeTargetClassForOpen(this.targetElement)),this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=null)}firstUpdated(){this.style.display="none",this.triggerType=this.triggerType||"click",this.placement=this.placement||"auto"}get open(){return this._open}set open(t){t!==this._open&&(this._open=t,this.handleOpenChange())}handleOpenChange(){this.open?(this._popper||this.configurePopper(),this._container.innerHTML="",this.popoverFor&&this._container.setAttribute("popover-for",this.popoverFor),this.content&&(this._container.prepend(this.content),Object.assign(this.content.style,{position:"relative",display:"block",zIndex:1}),window.requestAnimationFrame(()=>{let t=getComputedStyle(this.content).backgroundColor;t=="rgba(0, 0, 0, 0)"&&(this.content.style.background=t="#f2f2f2"),this._arrow.querySelector(".arrow-background").style.fill=t})),this.ensureArrowIsAdded(),this.ownerDocument.body.appendChild(this._container),this.updatePopper(),this.setAttribute("open",""),this.modal&&(window.addEventListener("click",this.hideIfExternalTarget,{capture:!0}),window.addEventListener("focus",this.hideIfExternalTarget,{capture:!0})),this.targetElement&&(this.addTargetClassForOpen(this.targetElement),this.targetElement.setAttribute("aria-expanded","true")),this.dispatchEvent(new CustomEvent("open"))):(this.ownerDocument.body.removeChild(this._container),this.removeAttribute("open"),window.removeEventListener("click",this.hideIfExternalTarget,{capture:!0}),window.removeEventListener("focus",this.hideIfExternalTarget,{capture:!0}),this.targetElement&&(this.removeTargetClassForOpen(this.targetElement),this.targetElement.setAttribute("aria-expanded","false")),this.dispatchEvent(new CustomEvent("close")))}handleTargetSelectorChange(t){let r=document.querySelector(t);r&&(this.removeTargetEventListener(r),this.removeTargetClassForOpen(r)),this.targetSelector&&(this.targetElement=document.querySelector(this.targetSelector),this.addTargetEventListener(this.targetElement))}addTargetEventListener(t){if(t)switch(this.triggerType){case"hover":{t.addEventListener("mouseenter",this.show),t.addEventListener("mouseleave",this.hide);break}case"click":{t.addEventListener("click",this.toggle);break}}}removeTargetEventListener(t){if(t)switch(this.triggerType){case"hover":{t.removeEventListener("mouseenter",this.show),t.removeEventListener("mouseleave",this.hide);break}case"click":{t.removeEventListener("click",this.toggle);break}}}configurePopper(){this.createContentContainer(),this.ensureArrowIsAdded();let t=this,r={placement:t.placement,strategy:"absolute",modifiers:[{name:"computeStyles",options:{gpuAcceleration:!Lr}},{name:"flip",options:{fallbackPlacements:t._flipPriority}},{name:"offset",options:{offset:()=>[0,t.noArrow?0+t.offset:this._arrow.clientHeight+t.offset]}},{name:"arrow",options:{padding:6}},{name:"resetArrowStyles",enabled:!0,phase:"beforeWrite",fn({state:o}){Object.assign(t._arrow.style,{top:o.styles.arrow.top||"",left:o.styles.arrow.left||"",bottom:o.styles.arrow.bottom||"",right:o.styles.arrow.right||""})}},{name:"onUpdate",enabled:!0,phase:"afterWrite",fn({state:o}){t.updateArrow(o.placement)}}]};this._popper=oe(this.targetElement,this._container,r)}createContentContainer(){this._container=document.createElement("div"),this._container.classList.add("popover-container"),this._container.tabIndex=0,this._resizeObserver&&this._resizeObserver.disconnect(),this._resizeObserver=new ResizeObserver(()=>{this._popper&&this._popper.update()}),this._resizeObserver.observe(this._container),Object.assign(this._container.style,{boxShadow:`0 4px 5px 0 rgba(0, 0, 0, 0.14),
+`,Lr=navigator.userAgent.indexOf("Trident")!==-1,Be=1,Me="sd-popover-open",je=class extends HTMLElement{constructor(){super(...arguments),this._open=!1,this._firstUpdated=!1,this.toggle=()=>{this.open=!this.open},this.show=()=>{this.open=!0},this.hide=()=>{this.open=!1},this.hideIfExternalTarget=t=>{let r=t.target;(!(r instanceof HTMLElement)||!this._container.contains(r)&&!this.targetElement.contains(r))&&this.hide()}}get triggerType(){return this.getAttribute("trigger-type")}set triggerType(t){t?this.setAttribute("trigger-type",t):this.removeAttribute("trigger-type")}get placement(){return this.getAttribute("placement")}set placement(t){t?this.setAttribute("placement",t):this.removeAttribute("placement")}get targetElement(){return this._targetElement}set targetElement(t){this.removeTargetEventListener(this.targetElement),this._targetElement&&this._targetElement.getAttribute("aria-expanded")=="true"&&this._targetElement.setAttribute("aria-expanded","false"),this._targetElement=t,t&&t.setAttribute("aria-expanded","false"),this.addTargetEventListener(this.targetElement),this.updatePopper()}get targetSelector(){return this.getAttribute("target-selector")}set targetSelector(t){t?this.setAttribute("target-selector",t):this.removeAttribute("target-selector")}get modal(){return this.hasAttribute("modal")}set modal(t){t?this.setAttribute("modal",""):this.removeAttribute("modal")}get popoverFor(){return this.getAttribute("popover-for")}set popoverFor(t){t?this.setAttribute("popover-for",t):this.removeAttribute("popover-for")}get flipPriority(){return this._flipPriority}set flipPriority(t){t&&t.length>0?this._flipPriority=t:this._flipPriority=null,this.reConfigurePopper()}get offset(){return this.getAttribute("offset")?parseInt(this.getAttribute("offset")):0}set offset(t){t?this.setAttribute("offset",t.toString()):this.removeAttribute("offset"),this.reConfigurePopper()}reConfigurePopper(){this._popper&&this.configurePopper()}get noArrow(){return this.hasAttribute("no-arrow")}set noArrow(t){t?this.setAttribute("no-arrow",""):this.removeAttribute("no-arrow")}static get observedAttributes(){return["placement","target-selector","trigger-type"]}attributeChangedCallback(t,r){switch(t){case"placement":{this.updatePopper();break}case"trigger-type":{this.removeTargetEventListener(this.targetElement),this.addTargetEventListener(this.targetElement);break}case"target-selector":{this.handleTargetSelectorChange(r);break}}}connectedCallback(){this._firstUpdated||(this.firstUpdated(),this._firstUpdated=!0),this.targetElement?this.addTargetEventListener(this.targetElement):this.targetSelector&&requestAnimationFrame(()=>{this.isConnected&&this.handleTargetSelectorChange(null)}),this._arrow=document.createElement("div"),this._arrow.classList.add("popover-arrow"),this._arrow.setAttribute("data-popper-arrow",""),this._arrow.style.display="flex",this._arrow.innerHTML=Sr}disconnectedCallback(){this.targetElement&&(this.removeTargetEventListener(this.targetElement),this.removeTargetClassForOpen(this.targetElement)),this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=null)}firstUpdated(){this.style.display="none",this.triggerType=this.triggerType||"click",this.placement=this.placement||"auto"}get open(){return this._open}set open(t){t!==this._open&&(this._open=t,this.handleOpenChange())}handleOpenChange(){this.open?(this._popper||this.configurePopper(),this._container.innerHTML="",this.popoverFor&&this._container.setAttribute("popover-for",this.popoverFor),this.content&&(this._container.prepend(this.content),Object.assign(this.content.style,{position:"relative",display:"block",zIndex:1}),window.requestAnimationFrame(()=>{let t=getComputedStyle(this.content).backgroundColor;t=="rgba(0, 0, 0, 0)"&&(this.content.style.background=t="#f2f2f2"),this._arrow.querySelector(".arrow-background").style.fill=t})),this.ensureArrowIsAdded(),this.ownerDocument.body.appendChild(this._container),this.updatePopper(),this.setAttribute("open",""),this.modal&&(window.addEventListener("click",this.hideIfExternalTarget,{capture:!0}),window.addEventListener("focus",this.hideIfExternalTarget,{capture:!0})),this.targetElement&&(this.addTargetClassForOpen(this.targetElement),this.targetElement.setAttribute("aria-expanded","true")),this.dispatchEvent(new CustomEvent("open"))):(this.ownerDocument.body.removeChild(this._container),this.removeAttribute("open"),window.removeEventListener("click",this.hideIfExternalTarget,{capture:!0}),window.removeEventListener("focus",this.hideIfExternalTarget,{capture:!0}),this.targetElement&&(this.removeTargetClassForOpen(this.targetElement),this.targetElement.setAttribute("aria-expanded","false")),this.dispatchEvent(new CustomEvent("close")))}handleTargetSelectorChange(t){let r=document.querySelector(t);r&&(this.removeTargetEventListener(r),this.removeTargetClassForOpen(r)),this.targetSelector&&(this.targetElement=document.querySelector(this.targetSelector),this.addTargetEventListener(this.targetElement))}addTargetEventListener(t){if(t)switch(this.triggerType){case"hover":{t.addEventListener("mouseenter",this.show),t.addEventListener("mouseleave",this.hide);break}case"click":{t.addEventListener("click",this.toggle);break}}}removeTargetEventListener(t){if(t)switch(this.triggerType){case"hover":{t.removeEventListener("mouseenter",this.show),t.removeEventListener("mouseleave",this.hide);break}case"click":{t.removeEventListener("click",this.toggle);break}}}configurePopper(){this.createContentContainer(),this.ensureArrowIsAdded();let t=this,r={placement:t.placement,strategy:"absolute",modifiers:[{name:"computeStyles",options:{gpuAcceleration:!Lr}},{name:"flip",options:{fallbackPlacements:t._flipPriority}},{name:"offset",options:{offset:()=>[0,t.noArrow?0+t.offset:this._arrow.clientHeight+t.offset]}},{name:"arrow",options:{padding:6}},{name:"resetArrowStyles",enabled:!0,phase:"beforeWrite",fn({state:o}){Object.assign(t._arrow.style,{top:o.styles.arrow.top||"",left:o.styles.arrow.left||"",bottom:o.styles.arrow.bottom||"",right:o.styles.arrow.right||""})}},{name:"onUpdate",enabled:!0,phase:"afterWrite",fn({state:o}){t.updateArrow(o.placement)}}]};this._popper=oe(this.targetElement,this._container,r)}createContentContainer(){this._container=document.createElement("div"),this._container.classList.add("popover-container"),this._container.tabIndex=0,this._resizeObserver&&this._resizeObserver.disconnect(),this._resizeObserver=new ResizeObserver(()=>{this._popper&&this._popper.update()}),this._resizeObserver.observe(this._container),Object.assign(this._container.style,{boxShadow:`0 4px 5px 0 rgba(0, 0, 0, 0.14),
                         0 1px 10px 0 rgba(0, 0, 0, 0.12),
                         0 2px 4px -1px rgba(0, 0, 0, 0.4)`,border:"1px solid #999",boxSizing:"border-box",zIndex:2e4})}ensureArrowIsAdded(){!this.noArrow&&!this._container.contains(this._arrow)&&this._container.appendChild(this._arrow)}updatePopper(){this._popper&&(this._popper.state.elements.reference=this.targetElement,this._popper.state.options.placement=this.placement,this.open&&this._popper.update())}updateArrow(t){if(this._arrow){let r=this.getArrowVariant(t);if(this._arrow.setAttribute("variant",r),this._content){let o=this._arrow.querySelector("svg"),i=this._arrow.clientWidth,a=this._arrow.clientHeight,f=`-${a-Be}px`,s=(i-a)/2,n=`-${a+s-Be}px`;switch(r){case"bottom":{this._arrow.style.top=f,o.style.transform="rotate(180deg)";break}case"top":{this._arrow.style.bottom=f,o.style.transform="rotate(0deg)";break}case"left":{this._arrow.style.right=n,o.style.transform="rotate(270deg)";break}case"right":{this._arrow.style.left=n,o.style.transform="rotate(90deg)";break}}}}}getArrowVariant(t){if(t.indexOf("bottom")!==-1)return"bottom";if(t.indexOf("top")!==-1)return"top";if(t.indexOf("left")!==-1)return"left";if(t.indexOf("right")!==-1)return"right"}get content(){return this._content||(this._content=this.firstElementChild,this._content.setAttribute("data-popper-content","")),this._content}addTargetClassForOpen(t){t&&t.classList.add(Me)}removeTargetClassForOpen(t){t&&t.classList.remove(Me)}};je.ID="sd-popover";var Ht=je;customElements.get(Ht.ID)||customElements.define(Ht.ID,Ht);return Ye(_r);})();
 //# sourceMappingURL=popover-with-externals.js.map