@telekom/scale-components
Version:
Scale is the digital design system for Telekom products and experiences.
1 lines • 11.3 kB
JavaScript
function t(t){return t.split("-")[0]}function n(t){return t.split("-")[1]}function e(n){return["top","bottom"].includes(t(n))?"x":"y"}function o(t){return"y"===t?"height":"width"}function r(r,i,a){let{reference:l,floating:c}=r;const s=l.x+l.width/2-c.width/2,u=l.y+l.height/2-c.height/2,f=e(i),d=o(f),y=l[d]/2-c[d]/2,m="x"===f;let p;switch(t(i)){case"top":p={x:s,y:l.y-c.height};break;case"bottom":p={x:s,y:l.y+l.height};break;case"right":p={x:l.x+l.width,y:u};break;case"left":p={x:l.x-c.width,y:u};break;default:p={x:l.x,y:l.y}}switch(n(i)){case"start":p[f]-=y*(a&&m?-1:1);break;case"end":p[f]+=y*(a&&m?-1:1)}return p}function i(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}}function a(t){return{...t,top:t.y,left:t.x,right:t.x+t.width,bottom:t.y+t.height}}async function l(t,n){var e;void 0===n&&(n={});const{x:o,y:r,platform:l,rects:c,elements:s,strategy:u}=t,{boundary:f="clippingAncestors",rootBoundary:d="viewport",elementContext:y="floating",altBoundary:m=!1,padding:p=0}=n,g=i(p),x=s[m?"floating"===y?"reference":"floating":y],h=a(await l.getClippingRect({element:null==(e=await(null==l.isElement?void 0:l.isElement(x)))||e?x:x.contextElement||await(null==l.getDocumentElement?void 0:l.getDocumentElement(s.floating)),boundary:f,rootBoundary:d,strategy:u})),w=a(l.convertOffsetParentRelativeRectToViewportRelativeRect?await l.convertOffsetParentRelativeRectToViewportRelativeRect({rect:"floating"===y?{...c.floating,x:o,y:r}:c.reference,offsetParent:await(null==l.getOffsetParent?void 0:l.getOffsetParent(s.floating)),strategy:u}):c[y]);return{top:h.top-w.top+g.top,bottom:w.bottom-h.bottom+g.bottom,left:h.left-w.left+g.left,right:w.right-h.right+g.right}}const c=Math.min,s=Math.max;function u(t,n,e){return s(t,c(n,e))}const f=t=>({name:"arrow",options:t,async fn(r){const{element:a,padding:l=0}=null!=t?t:{},{x:c,y:s,placement:f,rects:d,platform:y}=r;if(null==a)return{};const m=i(l),p={x:c,y:s},g=e(f),x=n(f),h=o(g),w=await y.getDimensions(a),v="y"===g?"top":"left",b="y"===g?"bottom":"right",A=d.reference[h]+d.reference[g]-p[g]-d.floating[h],R=p[g]-d.reference[g],k=await(null==y.getOffsetParent?void 0:y.getOffsetParent(a));let P=k?"y"===g?k.clientHeight||0:k.clientWidth||0:0;0===P&&(P=d.floating[h]);const C=m[v],S=P-w[h]-m[b],T=P/2-w[h]/2+(A/2-R/2),D=u(C,T,S);return{[g]:p[g]-(("start"===x?m[v]:m[b])>0&&T!==D&&d.reference[h]<=d.floating[h]?T<C?C-T:S-T:0),data:{[g]:D,centerOffset:T-D}}}}),d={left:"right",right:"left",bottom:"top",top:"bottom"};function y(t){return t.replace(/left|right|bottom|top/g,(t=>d[t]))}const m={start:"end",end:"start"};function p(t){return t.replace(/start|end/g,(t=>m[t]))}const g=function(r){return void 0===r&&(r={}),{name:"flip",options:r,async fn(i){var a;const{placement:c,middlewareData:s,rects:u,initialPlacement:f,platform:d,elements:m}=i,{mainAxis:g=!0,crossAxis:x=!0,fallbackPlacements:h,fallbackStrategy:w="bestFit",flipAlignment:v=!0,...b}=r,A=t(c),R=[f,...h||(A!==f&&v?function(t){const n=y(t);return[p(t),n,p(n)]}(f):[y(f)])],k=await l(i,b),P=[];let C=(null==(a=s.flip)?void 0:a.overflows)||[];if(g&&P.push(k[A]),x){const{main:t,cross:r}=function(t,r,i){void 0===i&&(i=!1);const a=n(t),l=e(t),c=o(l);let s="x"===l?a===(i?"end":"start")?"right":"left":"start"===a?"bottom":"top";return r.reference[c]>r.floating[c]&&(s=y(s)),{main:s,cross:y(s)}}(c,u,await(null==d.isRTL?void 0:d.isRTL(m.floating)));P.push(k[t],k[r])}if(C=[...C,{placement:c,overflows:P}],!P.every((t=>t<=0))){var S,T;const t=(null!=(S=null==(T=s.flip)?void 0:T.index)?S:0)+1,n=R[t];if(n)return{data:{index:t,overflows:C},reset:{placement:n}};let e="bottom";switch(w){case"bestFit":{var D;const t=null==(D=C.map((t=>[t,t.overflows.filter((t=>t>0)).reduce(((t,n)=>t+n),0)])).sort(((t,n)=>t[1]-n[1]))[0])?void 0:D[0].placement;t&&(e=t);break}case"initialPlacement":e=f}if(c!==e)return{reset:{placement:e}}}return{}}}},x=function(o){return void 0===o&&(o=0),{name:"offset",options:o,async fn(r){const{x:i,y:a}=r,l=await async function(o,r){const{placement:i,platform:a,elements:l}=o,c=await(null==a.isRTL?void 0:a.isRTL(l.floating)),s=t(i),u=n(i),f="x"===e(i),d=["left","top"].includes(s)?-1:1,y=c&&f?-1:1,m="function"==typeof r?r(o):r;let{mainAxis:p,crossAxis:g,alignmentAxis:x}="number"==typeof m?{mainAxis:m,crossAxis:0,alignmentAxis:null}:{mainAxis:0,crossAxis:0,alignmentAxis:null,...m};return u&&"number"==typeof x&&(g="end"===u?-1*x:x),f?{x:g*y,y:p*d}:{x:p*d,y:g*y}}(r,o);return{x:i+l.x,y:a+l.y,data:l}}}},h=function(n){return void 0===n&&(n={}),{name:"shift",options:n,async fn(o){const{x:r,y:i,placement:a}=o,{mainAxis:c=!0,crossAxis:s=!1,limiter:f={fn:t=>{let{x:n,y:e}=t;return{x:n,y:e}}},...d}=n,y={x:r,y:i},m=await l(o,d),p=e(t(a)),g="x"===p?"y":"x";let x=y[p],h=y[g];c&&(x=u(x+m["y"===p?"top":"left"],x,x-m["y"===p?"bottom":"right"])),s&&(h=u(h+m["y"===g?"top":"left"],h,h-m["y"===g?"bottom":"right"]));const w=f.fn({...o,[p]:x,[g]:h});return{...w,data:{x:w.x-r,y:w.y-i}}}}};function w(t){return t&&t.document&&t.location&&t.alert&&t.setInterval}function v(t){if(null==t)return window;if(!w(t)){const n=t.ownerDocument;return n&&n.defaultView||window}return t}function b(t){return v(t).getComputedStyle(t)}function A(t){return w(t)?"":t?(t.nodeName||"").toLowerCase():""}function R(){const t=navigator.userAgentData;return null!=t&&t.brands?t.brands.map((t=>t.brand+"/"+t.version)).join(" "):navigator.userAgent}function k(t){return t instanceof v(t).HTMLElement}function P(t){return t instanceof v(t).Element}function C(t){return"undefined"!=typeof ShadowRoot&&(t instanceof v(t).ShadowRoot||t instanceof ShadowRoot)}function S(t){const{overflow:n,overflowX:e,overflowY:o}=b(t);return/auto|scroll|overlay|hidden/.test(n+o+e)}function T(t){return["table","td","th"].includes(A(t))}function D(t){const n=/firefox/i.test(R()),e=b(t);return"none"!==e.transform||"none"!==e.perspective||"paint"===e.contain||["transform","perspective"].includes(e.willChange)||n&&"filter"===e.willChange||n&&!!e.filter&&"none"!==e.filter}function L(){return!/^((?!chrome|android).)*safari/i.test(R())}const M=Math.min,B=Math.max,E=Math.round;function O(t,n,e){var o,r,i,a;void 0===n&&(n=!1),void 0===e&&(e=!1);const l=t.getBoundingClientRect();let c=1,s=1;n&&k(t)&&(c=t.offsetWidth>0&&E(l.width)/t.offsetWidth||1,s=t.offsetHeight>0&&E(l.height)/t.offsetHeight||1);const u=P(t)?v(t):window,f=!L()&&e,d=(l.left+(f&&null!=(o=null==(r=u.visualViewport)?void 0:r.offsetLeft)?o:0))/c,y=(l.top+(f&&null!=(i=null==(a=u.visualViewport)?void 0:a.offsetTop)?i:0))/s,m=l.width/c,p=l.height/s;return{width:m,height:p,top:y,right:d+m,bottom:y+p,left:d,x:d,y}}function F(t){return(n=t,(n instanceof v(n).Node?t.ownerDocument:t.document)||window.document).documentElement;var n}function j(t){return P(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function V(t){return O(F(t)).left+j(t).scrollLeft}function X(t,n,e){const o=k(n),r=F(n),i=O(t,o&&function(t){const n=O(t);return E(n.width)!==t.offsetWidth||E(n.height)!==t.offsetHeight}(n),"fixed"===e);let a={scrollLeft:0,scrollTop:0};const l={x:0,y:0};if(o||!o&&"fixed"!==e)if(("body"!==A(n)||S(r))&&(a=j(n)),k(n)){const t=O(n,!0);l.x=t.x+n.clientLeft,l.y=t.y+n.clientTop}else r&&(l.x=V(r));return{x:i.left+a.scrollLeft-l.x,y:i.top+a.scrollTop-l.y,width:i.width,height:i.height}}function Y(t){return"html"===A(t)?t:t.assignedSlot||t.parentNode||(C(t)?t.host:null)||F(t)}function q(t){return k(t)&&"fixed"!==getComputedStyle(t).position?t.offsetParent:null}function z(t){const n=v(t);let e=q(t);for(;e&&T(e)&&"static"===getComputedStyle(e).position;)e=q(e);return e&&("html"===A(e)||"body"===A(e)&&"static"===getComputedStyle(e).position&&!D(e))?n:e||function(t){let n=Y(t);for(C(n)&&(n=n.host);k(n)&&!["html","body"].includes(A(n));){if(D(n))return n;n=n.parentNode}return null}(t)||n}function G(t){if(k(t))return{width:t.offsetWidth,height:t.offsetHeight};const n=O(t);return{width:n.width,height:n.height}}function H(t){const n=Y(t);return["html","body","#document"].includes(A(n))?t.ownerDocument.body:k(n)&&S(n)?n:H(n)}function I(t,n){var e;void 0===n&&(n=[]);const o=H(t),r=o===(null==(e=t.ownerDocument)?void 0:e.body),i=v(o),a=r?[i].concat(i.visualViewport||[],S(o)?o:[]):o,l=n.concat(a);return r?l:l.concat(I(a))}function J(t,n,e){return"viewport"===n?a(function(t,n){const e=v(t),o=F(t),r=e.visualViewport;let i=o.clientWidth,a=o.clientHeight,l=0,c=0;if(r){i=r.width,a=r.height;const t=L();(t||!t&&"fixed"===n)&&(l=r.offsetLeft,c=r.offsetTop)}return{width:i,height:a,x:l,y:c}}(t,e)):P(n)?function(t,n){const e=O(t,!1,"fixed"===n),o=e.top+t.clientTop,r=e.left+t.clientLeft;return{top:o,left:r,x:r,y:o,right:r+t.clientWidth,bottom:o+t.clientHeight,width:t.clientWidth,height:t.clientHeight}}(n,e):a(function(t){var n;const e=F(t),o=j(t),r=null==(n=t.ownerDocument)?void 0:n.body,i=B(e.scrollWidth,e.clientWidth,r?r.scrollWidth:0,r?r.clientWidth:0),a=B(e.scrollHeight,e.clientHeight,r?r.scrollHeight:0,r?r.clientHeight:0);let l=-o.scrollLeft+V(t);const c=-o.scrollTop;return"rtl"===b(r||e).direction&&(l+=B(e.clientWidth,r?r.clientWidth:0)-i),{width:i,height:a,x:l,y:c}}(F(t)))}function K(t){const n=I(t),e=["absolute","fixed"].includes(b(t).position)&&k(t)?z(t):t;return P(e)?n.filter((t=>P(t)&&function(t,n){const e=null==n.getRootNode?void 0:n.getRootNode();if(t.contains(n))return!0;if(e&&C(e)){let e=n;do{if(e&&t===e)return!0;e=e.parentNode||e.host}while(e)}return!1}(t,e)&&"body"!==A(t))):[]}const N={getClippingRect:function(t){let{element:n,boundary:e,rootBoundary:o,strategy:r}=t;const i=[..."clippingAncestors"===e?K(n):[].concat(e),o],a=i.reduce(((t,e)=>{const o=J(n,e,r);return t.top=B(o.top,t.top),t.right=M(o.right,t.right),t.bottom=M(o.bottom,t.bottom),t.left=B(o.left,t.left),t}),J(n,i[0],r));return{width:a.right-a.left,height:a.bottom-a.top,x:a.left,y:a.top}},convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{rect:n,offsetParent:e,strategy:o}=t;const r=k(e),i=F(e);if(e===i)return n;let a={scrollLeft:0,scrollTop:0};const l={x:0,y:0};if((r||!r&&"fixed"!==o)&&(("body"!==A(e)||S(i))&&(a=j(e)),k(e))){const t=O(e,!0);l.x=t.x+e.clientLeft,l.y=t.y+e.clientTop}return{...n,x:n.x-a.scrollLeft+l.x,y:n.y-a.scrollTop+l.y}},isElement:P,getDimensions:G,getOffsetParent:z,getDocumentElement:F,getElementRects:t=>{let{reference:n,floating:e,strategy:o}=t;return{reference:X(n,z(e),o),floating:{...G(e),x:0,y:0}}},getClientRects:t=>Array.from(t.getClientRects()),isRTL:t=>"rtl"===b(t).direction},Q=(t,n,e)=>(async(t,n,e)=>{const{placement:o="bottom",strategy:i="absolute",middleware:a=[],platform:l}=e,c=await(null==l.isRTL?void 0:l.isRTL(n));let s=await l.getElementRects({reference:t,floating:n,strategy:i}),{x:u,y:f}=r(s,o,c),d=o,y={},m=0;for(let e=0;e<a.length;e++){const{name:p,fn:g}=a[e],{x,y:h,data:w,reset:v}=await g({x:u,y:f,initialPlacement:o,placement:d,strategy:i,middlewareData:y,rects:s,platform:l,elements:{reference:t,floating:n}});u=null!=x?x:u,f=null!=h?h:f,y={...y,[p]:{...y[p],...w}},v&&m<=50&&(m++,"object"==typeof v&&(v.placement&&(d=v.placement),v.rects&&(s=!0===v.rects?await l.getElementRects({reference:t,floating:n,strategy:i}):v.rects),({x:u,y:f}=r(s,d,c))),e=-1)}return{x:u,y:f,placement:d,strategy:i,middlewareData:y}})(t,n,{platform:N,...e});export{f as a,Q as c,g as f,x as o,h as s}