@sandlada/mdc
Version:
@sandlada/mdc is an open source component library that follows the Material Design 3 design specifications.
2 lines (1 loc) • 20.1 kB
JavaScript
import{_ as t}from"../../tslib.es6-CmLYFWVC.js";import{i as e,x as n}from"../../lit-element-Ho-VPzO1.js";import{t as o}from"../../custom-element-Dz3n6kSt.js";import{n as i}from"../../property-Ck1wIidx.js";import{o as r}from"../../query-assigned-elements-I4OhvhhX.js";import"../../base-hbm3XPKy.js";const s=Math.min,l=Math.max,c=Math.round,a=Math.floor,f=t=>({x:t,y:t}),u={left:"right",right:"left",bottom:"top",top:"bottom"},h={start:"end",end:"start"};function d(t,e,n){return l(t,s(e,n))}function m(t,e){return"function"==typeof t?t(e):t}function p(t){return t.split("-")[0]}function g(t){return t.split("-")[1]}function y(t){return"x"===t?"y":"x"}function w(t){return"y"===t?"height":"width"}const x=new Set(["top","bottom"]);function v(t){return x.has(p(t))?"y":"x"}function b(t){return y(v(t))}function E(t){return t.replace(/start|end/g,t=>h[t])}const R=["left","right"],S=["right","left"],k=["top","bottom"],C=["bottom","top"];function L(t,e,n,o){const i=g(t);let r=function(t,e,n){switch(t){case"top":case"bottom":return n?e?S:R:e?R:S;case"left":case"right":return e?k:C;default:return[]}}(p(t),"start"===n,o);return i&&(r=r.map(t=>t+"-"+i),e&&(r=r.concat(r.map(E)))),r}function A(t){return t.replace(/left|right|bottom|top/g,t=>u[t])}function T(t){const{x:e,y:n,width:o,height:i}=t;return{width:o,height:i,top:n,left:e,right:e+o,bottom:n+i,x:e,y:n}}function D(t,e,n){let{reference:o,floating:i}=t;const r=v(e),s=b(e),l=w(s),c=p(e),a="y"===r,f=o.x+o.width/2-i.width/2,u=o.y+o.height/2-i.height/2,h=o[l]/2-i[l]/2;let d;switch(c){case"top":d={x:f,y:o.y-i.height};break;case"bottom":d={x:f,y:o.y+o.height};break;case"right":d={x:o.x+o.width,y:u};break;case"left":d={x:o.x-i.width,y:u};break;default:d={x:o.x,y:o.y}}switch(g(e)){case"start":d[s]-=h*(n&&a?-1:1);break;case"end":d[s]+=h*(n&&a?-1:1)}return d}async function F(t,e){var n;void 0===e&&(e={});const{x:o,y:i,platform:r,rects:s,elements:l,strategy:c}=t,{boundary:a="clippingAncestors",rootBoundary:f="viewport",elementContext:u="floating",altBoundary:h=!1,padding:d=0}=m(e,t),p=function(t){return"number"!=typeof t?function(t){return{top:0,right:0,bottom:0,left:0,...t}}(t):{top:t,right:t,bottom:t,left:t}}(d),g=l[h?"floating"===u?"reference":"floating":u],y=T(await r.getClippingRect({element:null==(n=await(null==r.isElement?void 0:r.isElement(g)))||n?g:g.contextElement||await(null==r.getDocumentElement?void 0:r.getDocumentElement(l.floating)),boundary:a,rootBoundary:f,strategy:c})),w="floating"===u?{x:o,y:i,width:s.floating.width,height:s.floating.height}:s.reference,x=await(null==r.getOffsetParent?void 0:r.getOffsetParent(l.floating)),v=await(null==r.isElement?void 0:r.isElement(x))&&await(null==r.getScale?void 0:r.getScale(x))||{x:1,y:1},b=T(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({elements:l,rect:w,offsetParent:x,strategy:c}):w);return{top:(y.top-b.top+p.top)/v.y,bottom:(b.bottom-y.bottom+p.bottom)/v.y,left:(y.left-b.left+p.left)/v.x,right:(b.right-y.right+p.right)/v.x}}const O=new Set(["left","top"]);function P(){return"undefined"!=typeof window}function B(t){return H(t)?(t.nodeName||"").toLowerCase():"#document"}function W(t){var e;return(null==t||null==(e=t.ownerDocument)?void 0:e.defaultView)||window}function j(t){var e;return null==(e=(H(t)?t.ownerDocument:t.document)||window.document)?void 0:e.documentElement}function H(t){return!!P()&&(t instanceof Node||t instanceof W(t).Node)}function M(t){return!!P()&&(t instanceof Element||t instanceof W(t).Element)}function V(t){return!!P()&&(t instanceof HTMLElement||t instanceof W(t).HTMLElement)}function $(t){return!(!P()||"undefined"==typeof ShadowRoot)&&(t instanceof ShadowRoot||t instanceof W(t).ShadowRoot)}const q=new Set(["inline","contents"]);function z(t){const{overflow:e,overflowX:n,overflowY:o,display:i}=tt(t);return/auto|scroll|overlay|hidden|clip/.test(e+o+n)&&!q.has(i)}const N=new Set(["table","td","th"]);function X(t){return N.has(B(t))}const Y=[":popover-open",":modal"];function I(t){return Y.some(e=>{try{return t.matches(e)}catch(t){return!1}})}const K=["transform","translate","scale","rotate","perspective"],U=["transform","translate","scale","rotate","perspective","filter"],_=["paint","layout","strict","content"];function G(t){const e=J(),n=M(t)?tt(t):t;return K.some(t=>!!n[t]&&"none"!==n[t])||!!n.containerType&&"normal"!==n.containerType||!e&&!!n.backdropFilter&&"none"!==n.backdropFilter||!e&&!!n.filter&&"none"!==n.filter||U.some(t=>(n.willChange||"").includes(t))||_.some(t=>(n.contain||"").includes(t))}function J(){return!("undefined"==typeof CSS||!CSS.supports)&&CSS.supports("-webkit-backdrop-filter","none")}const Q=new Set(["html","body","#document"]);function Z(t){return Q.has(B(t))}function tt(t){return W(t).getComputedStyle(t)}function et(t){return M(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.scrollX,scrollTop:t.scrollY}}function nt(t){if("html"===B(t))return t;const e=t.assignedSlot||t.parentNode||$(t)&&t.host||j(t);return $(e)?e.host:e}function ot(t){const e=nt(t);return Z(e)?t.ownerDocument?t.ownerDocument.body:t.body:V(e)&&z(e)?e:ot(e)}function it(t,e,n){var o;void 0===e&&(e=[]),void 0===n&&(n=!0);const i=ot(t),r=i===(null==(o=t.ownerDocument)?void 0:o.body),s=W(i);if(r){const t=rt(s);return e.concat(s,s.visualViewport||[],z(i)?i:[],t&&n?it(t):[])}return e.concat(i,it(i,[],n))}function rt(t){return t.parent&&Object.getPrototypeOf(t.parent)?t.frameElement:null}function st(t){const e=tt(t);let n=parseFloat(e.width)||0,o=parseFloat(e.height)||0;const i=V(t),r=i?t.offsetWidth:n,s=i?t.offsetHeight:o,l=c(n)!==r||c(o)!==s;return l&&(n=r,o=s),{width:n,height:o,$:l}}function lt(t){return M(t)?t:t.contextElement}function ct(t){const e=lt(t);if(!V(e))return f(1);const n=e.getBoundingClientRect(),{width:o,height:i,$:r}=st(e);let s=(r?c(n.width):n.width)/o,l=(r?c(n.height):n.height)/i;return s&&Number.isFinite(s)||(s=1),l&&Number.isFinite(l)||(l=1),{x:s,y:l}}const at=f(0);function ft(t){const e=W(t);return J()&&e.visualViewport?{x:e.visualViewport.offsetLeft,y:e.visualViewport.offsetTop}:at}function ut(t,e,n,o){void 0===e&&(e=!1),void 0===n&&(n=!1);const i=t.getBoundingClientRect(),r=lt(t);let s=f(1);e&&(o?M(o)&&(s=ct(o)):s=ct(t));const l=function(t,e,n){return void 0===e&&(e=!1),!(!n||e&&n!==W(t))&&e}(r,n,o)?ft(r):f(0);let c=(i.left+l.x)/s.x,a=(i.top+l.y)/s.y,u=i.width/s.x,h=i.height/s.y;if(r){const t=W(r),e=o&&M(o)?W(o):o;let n=t,i=rt(n);for(;i&&o&&e!==n;){const t=ct(i),e=i.getBoundingClientRect(),o=tt(i),r=e.left+(i.clientLeft+parseFloat(o.paddingLeft))*t.x,s=e.top+(i.clientTop+parseFloat(o.paddingTop))*t.y;c*=t.x,a*=t.y,u*=t.x,h*=t.y,c+=r,a+=s,n=W(i),i=rt(n)}}return T({width:u,height:h,x:c,y:a})}function ht(t,e){const n=et(t).scrollLeft;return e?e.left+n:ut(j(t)).left+n}function dt(t,e){const n=t.getBoundingClientRect();return{x:n.left+e.scrollLeft-ht(t,n),y:n.top+e.scrollTop}}const mt=new Set(["absolute","fixed"]);function pt(t,e,n){let o;if("viewport"===e)o=function(t,e){const n=W(t),o=j(t),i=n.visualViewport;let r=o.clientWidth,s=o.clientHeight,l=0,c=0;if(i){r=i.width,s=i.height;const t=J();(!t||t&&"fixed"===e)&&(l=i.offsetLeft,c=i.offsetTop)}const a=ht(o);if(a<=0){const t=o.ownerDocument,e=t.body,n=getComputedStyle(e),i="CSS1Compat"===t.compatMode&&parseFloat(n.marginLeft)+parseFloat(n.marginRight)||0,s=Math.abs(o.clientWidth-e.clientWidth-i);s<=25&&(r-=s)}else a<=25&&(r+=a);return{width:r,height:s,x:l,y:c}}(t,n);else if("document"===e)o=function(t){const e=j(t),n=et(t),o=t.ownerDocument.body,i=l(e.scrollWidth,e.clientWidth,o.scrollWidth,o.clientWidth),r=l(e.scrollHeight,e.clientHeight,o.scrollHeight,o.clientHeight);let s=-n.scrollLeft+ht(t);const c=-n.scrollTop;return"rtl"===tt(o).direction&&(s+=l(e.clientWidth,o.clientWidth)-i),{width:i,height:r,x:s,y:c}}(j(t));else if(M(e))o=function(t,e){const n=ut(t,!0,"fixed"===e),o=n.top+t.clientTop,i=n.left+t.clientLeft,r=V(t)?ct(t):f(1);return{width:t.clientWidth*r.x,height:t.clientHeight*r.y,x:i*r.x,y:o*r.y}}(e,n);else{const n=ft(t);o={x:e.x-n.x,y:e.y-n.y,width:e.width,height:e.height}}return T(o)}function gt(t,e){const n=nt(t);return!(n===e||!M(n)||Z(n))&&("fixed"===tt(n).position||gt(n,e))}function yt(t,e,n){const o=V(e),i=j(e),r="fixed"===n,s=ut(t,!0,r,e);let l={scrollLeft:0,scrollTop:0};const c=f(0);function a(){c.x=ht(i)}if(o||!o&&!r)if(("body"!==B(e)||z(i))&&(l=et(e)),o){const t=ut(e,!0,r,e);c.x=t.x+e.clientLeft,c.y=t.y+e.clientTop}else i&&a();r&&!o&&i&&a();const u=!i||o||r?f(0):dt(i,l);return{x:s.left+l.scrollLeft-c.x-u.x,y:s.top+l.scrollTop-c.y-u.y,width:s.width,height:s.height}}function wt(t){return"static"===tt(t).position}function xt(t,e){if(!V(t)||"fixed"===tt(t).position)return null;if(e)return e(t);let n=t.offsetParent;return j(t)===n&&(n=n.ownerDocument.body),n}function vt(t,e){const n=W(t);if(I(t))return n;if(!V(t)){let e=nt(t);for(;e&&!Z(e);){if(M(e)&&!wt(e))return e;e=nt(e)}return n}let o=xt(t,e);for(;o&&X(o)&&wt(o);)o=xt(o,e);return o&&Z(o)&&wt(o)&&!G(o)?n:o||function(t){let e=nt(t);for(;V(e)&&!Z(e);){if(G(e))return e;if(I(e))return null;e=nt(e)}return null}(t)||n}const bt={convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{elements:e,rect:n,offsetParent:o,strategy:i}=t;const r="fixed"===i,s=j(o),l=!!e&&I(e.floating);if(o===s||l&&r)return n;let c={scrollLeft:0,scrollTop:0},a=f(1);const u=f(0),h=V(o);if((h||!h&&!r)&&(("body"!==B(o)||z(s))&&(c=et(o)),V(o))){const t=ut(o);a=ct(o),u.x=t.x+o.clientLeft,u.y=t.y+o.clientTop}const d=!s||h||r?f(0):dt(s,c);return{width:n.width*a.x,height:n.height*a.y,x:n.x*a.x-c.scrollLeft*a.x+u.x+d.x,y:n.y*a.y-c.scrollTop*a.y+u.y+d.y}},getDocumentElement:j,getClippingRect:function(t){let{element:e,boundary:n,rootBoundary:o,strategy:i}=t;const r=[..."clippingAncestors"===n?I(e)?[]:function(t,e){const n=e.get(t);if(n)return n;let o=it(t,[],!1).filter(t=>M(t)&&"body"!==B(t)),i=null;const r="fixed"===tt(t).position;let s=r?nt(t):t;for(;M(s)&&!Z(s);){const e=tt(s),n=G(s);n||"fixed"!==e.position||(i=null),(r?!n&&!i:!n&&"static"===e.position&&i&&mt.has(i.position)||z(s)&&!n&>(t,s))?o=o.filter(t=>t!==s):i=e,s=nt(s)}return e.set(t,o),o}(e,this._c):[].concat(n),o],c=r[0],a=r.reduce((t,n)=>{const o=pt(e,n,i);return t.top=l(o.top,t.top),t.right=s(o.right,t.right),t.bottom=s(o.bottom,t.bottom),t.left=l(o.left,t.left),t},pt(e,c,i));return{width:a.right-a.left,height:a.bottom-a.top,x:a.left,y:a.top}},getOffsetParent:vt,getElementRects:async function(t){const e=this.getOffsetParent||vt,n=this.getDimensions,o=await n(t.floating);return{reference:yt(t.reference,await e(t.floating),t.strategy),floating:{x:0,y:0,width:o.width,height:o.height}}},getClientRects:function(t){return Array.from(t.getClientRects())},getDimensions:function(t){const{width:e,height:n}=st(t);return{width:e,height:n}},getScale:ct,isElement:M,isRTL:function(t){return"rtl"===tt(t).direction}};function Et(t,e){return t.x===e.x&&t.y===e.y&&t.width===e.width&&t.height===e.height}function Rt(t,e,n,o){void 0===o&&(o={});const{ancestorScroll:i=!0,ancestorResize:r=!0,elementResize:c="function"==typeof ResizeObserver,layoutShift:f="function"==typeof IntersectionObserver,animationFrame:u=!1}=o,h=lt(t),d=i||r?[...h?it(h):[],...it(e)]:[];d.forEach(t=>{i&&t.addEventListener("scroll",n,{passive:!0}),r&&t.addEventListener("resize",n)});const m=h&&f?function(t,e){let n,o=null;const i=j(t);function r(){var t;clearTimeout(n),null==(t=o)||t.disconnect(),o=null}return function c(f,u){void 0===f&&(f=!1),void 0===u&&(u=1),r();const h=t.getBoundingClientRect(),{left:d,top:m,width:p,height:g}=h;if(f||e(),!p||!g)return;const y={rootMargin:-a(m)+"px "+-a(i.clientWidth-(d+p))+"px "+-a(i.clientHeight-(m+g))+"px "+-a(d)+"px",threshold:l(0,s(1,u))||1};let w=!0;function x(e){const o=e[0].intersectionRatio;if(o!==u){if(!w)return c();o?c(!1,o):n=setTimeout(()=>{c(!1,1e-7)},1e3)}1!==o||Et(h,t.getBoundingClientRect())||c(),w=!1}try{o=new IntersectionObserver(x,{...y,root:i.ownerDocument})}catch(t){o=new IntersectionObserver(x,y)}o.observe(t)}(!0),r}(h,n):null;let p,g=-1,y=null;c&&(y=new ResizeObserver(t=>{let[o]=t;o&&o.target===h&&y&&(y.unobserve(e),cancelAnimationFrame(g),g=requestAnimationFrame(()=>{var t;null==(t=y)||t.observe(e)})),n()}),h&&!u&&y.observe(h),y.observe(e));let w=u?ut(t):null;return u&&function e(){const o=ut(t);w&&!Et(w,o)&&n();w=o,p=requestAnimationFrame(e)}(),n(),()=>{var t;d.forEach(t=>{i&&t.removeEventListener("scroll",n),r&&t.removeEventListener("resize",n)}),null==m||m(),null==(t=y)||t.disconnect(),y=null,u&&cancelAnimationFrame(p)}}const St=function(t){return void 0===t&&(t=0),{name:"offset",options:t,async fn(e){var n,o;const{x:i,y:r,placement:s,middlewareData:l}=e,c=await async function(t,e){const{placement:n,platform:o,elements:i}=t,r=await(null==o.isRTL?void 0:o.isRTL(i.floating)),s=p(n),l=g(n),c="y"===v(n),a=O.has(s)?-1:1,f=r&&c?-1:1,u=m(e,t);let{mainAxis:h,crossAxis:d,alignmentAxis:y}="number"==typeof u?{mainAxis:u,crossAxis:0,alignmentAxis:null}:{mainAxis:u.mainAxis||0,crossAxis:u.crossAxis||0,alignmentAxis:u.alignmentAxis};return l&&"number"==typeof y&&(d="end"===l?-1*y:y),c?{x:d*f,y:h*a}:{x:h*a,y:d*f}}(e,t);return s===(null==(n=l.offset)?void 0:n.placement)&&null!=(o=l.arrow)&&o.alignmentOffset?{}:{x:i+c.x,y:r+c.y,data:{...c,placement:s}}}}},kt=function(t){return void 0===t&&(t={}),{name:"shift",options:t,async fn(e){const{x:n,y:o,placement:i}=e,{mainAxis:r=!0,crossAxis:s=!1,limiter:l={fn:t=>{let{x:e,y:n}=t;return{x:e,y:n}}},...c}=m(t,e),a={x:n,y:o},f=await F(e,c),u=v(p(i)),h=y(u);let g=a[h],w=a[u];if(r){const t="y"===h?"bottom":"right";g=d(g+f["y"===h?"top":"left"],g,g-f[t])}if(s){const t="y"===u?"bottom":"right";w=d(w+f["y"===u?"top":"left"],w,w-f[t])}const x=l.fn({...e,[h]:g,[u]:w});return{...x,data:{x:x.x-n,y:x.y-o,enabled:{[h]:r,[u]:s}}}}}},Ct=function(t){return void 0===t&&(t={}),{name:"flip",options:t,async fn(e){var n,o;const{placement:i,middlewareData:r,rects:s,initialPlacement:l,platform:c,elements:a}=e,{mainAxis:f=!0,crossAxis:u=!0,fallbackPlacements:h,fallbackStrategy:d="bestFit",fallbackAxisSideDirection:y="none",flipAlignment:x=!0,...R}=m(t,e);if(null!=(n=r.arrow)&&n.alignmentOffset)return{};const S=p(i),k=v(l),C=p(l)===l,T=await(null==c.isRTL?void 0:c.isRTL(a.floating)),D=h||(C||!x?[A(l)]:function(t){const e=A(t);return[E(t),e,E(e)]}(l)),O="none"!==y;!h&&O&&D.push(...L(l,x,y,T));const P=[l,...D],B=await F(e,R),W=[];let j=(null==(o=r.flip)?void 0:o.overflows)||[];if(f&&W.push(B[S]),u){const t=function(t,e,n){void 0===n&&(n=!1);const o=g(t),i=b(t),r=w(i);let s="x"===i?o===(n?"end":"start")?"right":"left":"start"===o?"bottom":"top";return e.reference[r]>e.floating[r]&&(s=A(s)),[s,A(s)]}(i,s,T);W.push(B[t[0]],B[t[1]])}if(j=[...j,{placement:i,overflows:W}],!W.every(t=>t<=0)){var H,M;const t=((null==(H=r.flip)?void 0:H.index)||0)+1,e=P[t];if(e){if(!("alignment"===u&&k!==v(e))||j.every(t=>v(t.placement)!==k||t.overflows[0]>0))return{data:{index:t,overflows:j},reset:{placement:e}}}let n=null==(M=j.filter(t=>t.overflows[0]<=0).sort((t,e)=>t.overflows[1]-e.overflows[1])[0])?void 0:M.placement;if(!n)switch(d){case"bestFit":{var V;const t=null==(V=j.filter(t=>{if(O){const e=v(t.placement);return e===k||"y"===e}return!0}).map(t=>[t.placement,t.overflows.filter(t=>t>0).reduce((t,e)=>t+e,0)]).sort((t,e)=>t[1]-e[1])[0])?void 0:V[0];t&&(n=t);break}case"initialPlacement":n=l}if(i!==n)return{reset:{placement:n}}}return{}}}},Lt=(t,e,n)=>{const o=new Map,i={platform:bt,...n},r={...i.platform,_c:o};return(async(t,e,n)=>{const{placement:o="bottom",strategy:i="absolute",middleware:r=[],platform:s}=n,l=r.filter(Boolean),c=await(null==s.isRTL?void 0:s.isRTL(e));let a=await s.getElementRects({reference:t,floating:e,strategy:i}),{x:f,y:u}=D(a,o,c),h=o,d={},m=0;for(let n=0;n<l.length;n++){const{name:r,fn:p}=l[n],{x:g,y,data:w,reset:x}=await p({x:f,y:u,initialPlacement:o,placement:h,strategy:i,middlewareData:d,rects:a,platform:s,elements:{reference:t,floating:e}});f=null!=g?g:f,u=null!=y?y:u,d={...d,[r]:{...d[r],...w}},x&&m<=50&&(m++,"object"==typeof x&&(x.placement&&(h=x.placement),x.rects&&(a=!0===x.rects?await s.getElementRects({reference:t,floating:e,strategy:i}):x.rects),({x:f,y:u}=D(a,h,c))),n=-1)}return{x:f,y:u,placement:h,strategy:i,middlewareData:d}})(t,e,{...i,platform:r})};let At=class extends e{constructor(){super(),this.open=!1,this.quick=!1,this.placement="bottom-start",this.disableFlip=!1,this.getDefaultAnimation=(t,e)=>{let n;switch(this.getDirectionFromPlacement(e)){case"top":n="translateY(10px)";break;case"bottom":default:n="translateY(-10px)";break;case"left":n="translateX(10px)";break;case"right":n="translateX(-10px)"}return{keyframes:"open"===t?[{opacity:0,transform:n},{opacity:1,transform:"none"}]:[{opacity:1,transform:"none"},{opacity:0,transform:n}],options:{duration:150,easing:"ease-out"}}},this.surfaceAnimation=null,this.handleTriggerClick=t=>{const e=t.composedPath();this.triggerElement&&e.includes(this.triggerElement)&&(this.open=!this.open)},this.handleDocumentClick=t=>{t.composedPath().includes(this)||(this.open=!1)},this.handleDocumentKeyDown=t=>{"Escape"===t.key&&(this.open=!1)}}getDirectionFromPlacement(t){return t.split("-")[0]}async animateSurface(t){if(this.quick)return;if(!this.surfaceElement)return;this.surfaceAnimation?.cancel();let e=this.customAnimations?.[t]??this.getDefaultAnimation(t,this.placement);"function"==typeof e&&(e=e(this.placement)),this.surfaceAnimation=this.surfaceElement.animate(e.keyframes,e.options);try{await this.surfaceAnimation.finished}catch(t){}finally{this.surfaceAnimation=null}}get triggerElement(){return this.triggerElements[0]}get surfaceElement(){return this.surfaceElements[0]}render(){return n`${this.renderTriggerSlot()} ${this.renderSurfaceSlot()}`}renderSurfaceSlot(){return n`<slot name="surface" ="${this.handleSlotChange}"></slot>`}renderTriggerSlot(){return n`<slot name="trigger" ="${this.handleSlotChange}"></slot>`}handleSlotChange(){this.requestUpdate()}async handleOpenChange(t){this.open!==t&&(this.open?await this.show():await this.hide())}async show(){this.surfaceElement&&this.triggerElement&&(this.surfaceAnimation?.cancel(),this.surfaceElement.style.display="block",this.cleanup=Rt(this.triggerElement,this.surfaceElement,async()=>{const t=[St(6),!this.disableFlip&&Ct(),kt({padding:8})].filter(Boolean),{x:e,y:n}=await Lt(this.triggerElement,this.surfaceElement,{placement:this.placement,middleware:t});Object.assign(this.surfaceElement.style,{left:`${e}px`,top:`${n}px`})}),document.addEventListener("click",this.handleDocumentClick,!0),document.addEventListener("keydown",this.handleDocumentKeyDown,!0),await this.animateSurface("open"),this.dispatchEvent(new CustomEvent("mdc-popup-opened")))}async hide(){this.surfaceElement&&(this.surfaceAnimation?.cancel(),await this.animateSurface("close"),this.cleanup?.(),document.removeEventListener("click",this.handleDocumentClick,!0),document.removeEventListener("keydown",this.handleDocumentKeyDown,!0),this.surfaceElement.style.display="none",this.dispatchEvent(new CustomEvent("mdc-popup-closed")))}connectedCallback(){super.connectedCallback(),this.handleOpenChange(!1)}disconnectedCallback(){super.disconnectedCallback(),this.cleanup?.()}firstUpdated(t){super.firstUpdated(t),console.log(this.surfaceElements),this.surfaceElement&&(this.surfaceElement.style.display="none",this.surfaceElement.style.position="fixed",this.addEventListener("click",this.handleTriggerClick))}updated(t){t.has("open")&&this.handleOpenChange(t.get("open"))}};t([i({type:Boolean,reflect:!0})],At.prototype,"open",void 0),t([i({type:Boolean,reflect:!0})],At.prototype,"quick",void 0),t([i({type:String,reflect:!0})],At.prototype,"placement",void 0),t([i({type:Boolean,attribute:"disable-flip",reflect:!0})],At.prototype,"disableFlip",void 0),t([i({type:Object,attribute:"custom-animations"})],At.prototype,"customAnimations",void 0),t([r({slot:"surface",flatten:!0})],At.prototype,"surfaceElements",void 0),t([r({slot:"trigger",flatten:!0})],At.prototype,"triggerElements",void 0),At=t([o("mdc-popup-controller")],At);export{At as MDCPopupController};