proto-float-wc 0.1.93 → 0.1.94

package/dist/cjs/proto-floater-demo.cjs.entry.js

@@ -20,10 +20,6 @@ const oppositeSideMap = {
   bottom: 'top',
   top: 'bottom'
 };
-const oppositeAlignmentMap = {
-  start: 'end',
-  end: 'start'
-};
 function clamp(start, value, end) {
   return max(start, min(value, end));
 }
@@ -42,9 +38,9 @@ function getOppositeAxis(axis) {
 function getAxisLength(axis) {
   return axis === 'y' ? 'height' : 'width';
 }
-const yAxisSides = /*#__PURE__*/new Set(['top', 'bottom']);
 function getSideAxis(placement) {
-  return yAxisSides.has(getSide(placement)) ? 'y' : 'x';
+  const firstChar = placement[0];
+  return firstChar === 't' || firstChar === 'b' ? 'y' : 'x';
 }
 function getAlignmentAxis(placement) {
   return getOppositeAxis(getSideAxis(placement));
@@ -67,7 +63,7 @@ function getExpandedPlacements(placement) {
   return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
 }
 function getOppositeAlignmentPlacement(placement) {
-  return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
+  return placement.includes('start') ? placement.replace('start', 'end') : placement.replace('end', 'start');
 }
 const lrPlacement = ['left', 'right'];
 const rlPlacement = ['right', 'left'];
@@ -98,7 +94,8 @@ function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
   return list;
 }
 function getOppositePlacement(placement) {
-  return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
+  const side = getSide(placement);
+  return oppositeSideMap[side] + placement.slice(side.length);
 }
 function expandPaddingObject(padding) {
   return {
@@ -257,6 +254,9 @@ async function detectOverflow(state, options) {
   };
 }
 
+// Maximum number of resets that can occur before bailing to avoid infinite reset loops.
+const MAX_RESET_COUNT = 50;
+
 /**
  * Computes the `x` and `y` coordinates that will place the floating element
  * next to a given reference element.
@@ -271,7 +271,10 @@ const computePosition$1 = async (reference, floating, config) => {
     middleware = [],
     platform
   } = config;
-  const validMiddleware = middleware.filter(Boolean);
+  const platformWithDetectOverflow = platform.detectOverflow ? platform : {
+    ...platform,
+    detectOverflow
+  };
   const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
   let rects = await platform.getElementRects({
     reference,
@@ -283,14 +286,17 @@ const computePosition$1 = async (reference, floating, config) => {
     y
   } = computeCoordsFromPlacement(rects, placement, rtl);
   let statefulPlacement = placement;
-  let middlewareData = {};
   let resetCount = 0;
-  for (let i = 0; i < validMiddleware.length; i++) {
-    var _platform$detectOverf;
+  const middlewareData = {};
+  for (let i = 0; i < middleware.length; i++) {
+    const currentMiddleware = middleware[i];
+    if (!currentMiddleware) {
+      continue;
+    }
     const {
       name,
       fn
-    } = validMiddleware[i];
+    } = currentMiddleware;
     const {
       x: nextX,
       y: nextY,
@@ -304,10 +310,7 @@ const computePosition$1 = async (reference, floating, config) => {
       strategy,
       middlewareData,
       rects,
-      platform: {
-        ...platform,
-        detectOverflow: (_platform$detectOverf = platform.detectOverflow) != null ? _platform$detectOverf : detectOverflow
-      },
+      platform: platformWithDetectOverflow,
       elements: {
         reference,
         floating
@@ -315,14 +318,11 @@ const computePosition$1 = async (reference, floating, config) => {
     });
     x = nextX != null ? nextX : x;
     y = nextY != null ? nextY : y;
-    middlewareData = {
-      ...middlewareData,
-      [name]: {
-        ...middlewareData[name],
-        ...data
-      }
+    middlewareData[name] = {
+      ...middlewareData[name],
+      ...data
     };
-    if (reset && resetCount <= 50) {
+    if (reset && resetCount < MAX_RESET_COUNT) {
       resetCount++;
       if (typeof reset === 'object') {
         if (reset.placement) {
@@ -775,7 +775,6 @@ function isShadowRoot(value) {
   }
   return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
 }
-const invalidOverflowDisplayValues = /*#__PURE__*/new Set(['inline', 'contents']);
 function isOverflowElement(element) {
   const {
     overflow,
@@ -783,32 +782,35 @@ function isOverflowElement(element) {
     overflowY,
     display
   } = getComputedStyle$1(element);
-  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
+  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && display !== 'inline' && display !== 'contents';
 }
-const tableElements = /*#__PURE__*/new Set(['table', 'td', 'th']);
 function isTableElement(element) {
-  return tableElements.has(getNodeName(element));
+  return /^(table|td|th)$/.test(getNodeName(element));
 }
-const topLayerSelectors = [':popover-open', ':modal'];
 function isTopLayer(element) {
-  return topLayerSelectors.some(selector => {
-    try {
-      return element.matches(selector);
-    } catch (_e) {
-      return false;
+  try {
+    if (element.matches(':popover-open')) {
+      return true;
     }
-  });
+  } catch (_e) {
+    // no-op
+  }
+  try {
+    return element.matches(':modal');
+  } catch (_e) {
+    return false;
+  }
 }
-const transformProperties = ['transform', 'translate', 'scale', 'rotate', 'perspective'];
-const willChangeValues = ['transform', 'translate', 'scale', 'rotate', 'perspective', 'filter'];
-const containValues = ['paint', 'layout', 'strict', 'content'];
+const willChangeRe = /transform|translate|scale|rotate|perspective|filter/;
+const containRe = /paint|layout|strict|content/;
+const isNotNone = value => !!value && value !== 'none';
+let isWebKitValue;
 function isContainingBlock(elementOrCss) {
-  const webkit = isWebKit();
   const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
 
   // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
   // https://drafts.csswg.org/css-transforms-2/#individual-transforms
-  return transformProperties.some(value => css[value] ? css[value] !== 'none' : false) || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || willChangeValues.some(value => (css.willChange || '').includes(value)) || containValues.some(value => (css.contain || '').includes(value));
+  return isNotNone(css.transform) || isNotNone(css.translate) || isNotNone(css.scale) || isNotNone(css.rotate) || isNotNone(css.perspective) || !isWebKit() && (isNotNone(css.backdropFilter) || isNotNone(css.filter)) || willChangeRe.test(css.willChange || '') || containRe.test(css.contain || '');
 }
 function getContainingBlock(element) {
   let currentNode = getParentNode(element);
@@ -823,12 +825,13 @@ function getContainingBlock(element) {
   return null;
 }
 function isWebKit() {
-  if (typeof CSS === 'undefined' || !CSS.supports) return false;
-  return CSS.supports('-webkit-backdrop-filter', 'none');
+  if (isWebKitValue == null) {
+    isWebKitValue = typeof CSS !== 'undefined' && CSS.supports && CSS.supports('-webkit-backdrop-filter', 'none');
+  }
+  return isWebKitValue;
 }
-const lastTraversableNodeNames = /*#__PURE__*/new Set(['html', 'body', '#document']);
 function isLastTraversableNode(node) {
-  return lastTraversableNodeNames.has(getNodeName(node));
+  return /^(html|body|#document)$/.test(getNodeName(node));
 }
 function getComputedStyle$1(element) {
   return getWindow(element).getComputedStyle(element);
@@ -880,8 +883,9 @@ function getOverflowAncestors(node, list, traverseIframes) {
   const win = getWindow(scrollableAncestor);
   if (isBody) {
     return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], []);
+  } else {
+    return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, []));
   }
-  return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, []));
 }
 function getFrameElement(win) {
   return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
@@ -1058,7 +1062,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
     if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
       scroll = getNodeScroll(offsetParent);
     }
-    if (isHTMLElement(offsetParent)) {
+    if (isOffsetParentAnElement) {
       const offsetRect = getBoundingClientRect(offsetParent);
       scale = getScale(offsetParent);
       offsets.x = offsetRect.x + offsetParent.clientLeft;
@@ -1146,7 +1150,6 @@ function getViewportRect(element, strategy) {
   };
 }
 
-const absoluteOrFixed = /*#__PURE__*/new Set(['absolute', 'fixed']);
 // Returns the inner client rect, subtracting scrollbars if present.
 function getInnerBoundingClientRect(element, strategy) {
   const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
@@ -1211,7 +1214,7 @@ function getClippingElementAncestors(element, cache) {
     if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
       currentContainingBlockComputedStyle = null;
     }
-    const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
+    const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && (currentContainingBlockComputedStyle.position === 'absolute' || currentContainingBlockComputedStyle.position === 'fixed') || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
     if (shouldDropCurrentNode) {
       // Drop non-containing blocks.
       result = result.filter(ancestor => ancestor !== currentNode);
@@ -1236,20 +1239,23 @@ function getClippingRect(_ref) {
   } = _ref;
   const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
   const clippingAncestors = [...elementClippingAncestors, rootBoundary];
-  const firstClippingAncestor = clippingAncestors[0];
-  const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
-    const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
-    accRect.top = max(rect.top, accRect.top);
-    accRect.right = min(rect.right, accRect.right);
-    accRect.bottom = min(rect.bottom, accRect.bottom);
-    accRect.left = max(rect.left, accRect.left);
-    return accRect;
-  }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
+  const firstRect = getClientRectFromClippingAncestor(element, clippingAncestors[0], strategy);
+  let top = firstRect.top;
+  let right = firstRect.right;
+  let bottom = firstRect.bottom;
+  let left = firstRect.left;
+  for (let i = 1; i < clippingAncestors.length; i++) {
+    const rect = getClientRectFromClippingAncestor(element, clippingAncestors[i], strategy);
+    top = max(rect.top, top);
+    right = min(rect.right, right);
+    bottom = min(rect.bottom, bottom);
+    left = max(rect.left, left);
+  }
   return {
-    width: clippingRect.right - clippingRect.left,
-    height: clippingRect.bottom - clippingRect.top,
-    x: clippingRect.left,
-    y: clippingRect.top
+    width: right - left,
+    height: bottom - top,
+    x: left,
+    y: top
   };
 }
 

package/dist/components/proto-floater-demo.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as e,h as n,transformTag as o}from"@stencil/core/internal/client";const i=Math.min,r=Math.max,s=Math.round,a=t=>({x:t,y:t}),l={left:"right",right:"left",bottom:"top",top:"bottom"},c={start:"end",end:"start"};function f(t,e,n){return r(t,i(e,n))}function u(t,e){return"function"==typeof t?t(e):t}function d(t){return t.split("-")[0]}function h(t){return t.split("-")[1]}function p(t){return"x"===t?"y":"x"}function m(t){return"y"===t?"height":"width"}const y=new Set(["top","bottom"]);function g(t){return y.has(d(t))?"y":"x"}function w(t){return p(g(t))}function x(t){return t.replace(/start|end/g,(t=>c[t]))}const b=["left","right"],v=["right","left"],k=["top","bottom"],S=["bottom","top"];function A(t){return t.replace(/left|right|bottom|top/g,(t=>l[t]))}function C(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 D(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 E(t,e,n){let{reference:o,floating:i}=t;const r=g(e),s=w(e),a=m(s),l=d(e),c="y"===r,f=o.x+o.width/2-i.width/2,u=o.y+o.height/2-i.height/2,p=o[a]/2-i[a]/2;let y;switch(l){case"top":y={x:f,y:o.y-i.height};break;case"bottom":y={x:f,y:o.y+o.height};break;case"right":y={x:o.x+o.width,y:u};break;case"left":y={x:o.x-i.width,y:u};break;default:y={x:o.x,y:o.y}}switch(h(e)){case"start":y[s]-=p*(n&&c?-1:1);break;case"end":y[s]+=p*(n&&c?-1:1)}return y}async function L(t,e){var n;void 0===e&&(e={});const{x:o,y:i,platform:r,rects:s,elements:a,strategy:l}=t,{boundary:c="clippingAncestors",rootBoundary:f="viewport",elementContext:d="floating",altBoundary:h=!1,padding:p=0}=u(e,t),m=C(p),y=a[h?"floating"===d?"reference":"floating":d],g=D(await r.getClippingRect({element:null==(n=await(null==r.isElement?void 0:r.isElement(y)))||n?y:y.contextElement||await(null==r.getDocumentElement?void 0:r.getDocumentElement(a.floating)),boundary:c,rootBoundary:f,strategy:l})),w="floating"===d?{x:o,y:i,width:s.floating.width,height:s.floating.height}:s.reference,x=await(null==r.getOffsetParent?void 0:r.getOffsetParent(a.floating)),b=await(null==r.isElement?void 0:r.isElement(x))&&await(null==r.getScale?void 0:r.getScale(x))||{x:1,y:1},v=D(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({elements:a,rect:w,offsetParent:x,strategy:l}):w);return{top:(g.top-v.top+m.top)/b.y,bottom:(v.bottom-g.bottom+m.bottom)/b.y,left:(g.left-v.left+m.left)/b.x,right:(v.right-g.right+m.right)/b.x}}const R=new Set(["left","top"]);function F(){return"undefined"!=typeof window}function T(t){return M(t)?(t.nodeName||"").toLowerCase():"#document"}function O(t){var e;return(null==t||null==(e=t.ownerDocument)?void 0:e.defaultView)||window}function P(t){var e;return null==(e=(M(t)?t.ownerDocument:t.document)||window.document)?void 0:e.documentElement}function M(t){return!!F()&&(t instanceof Node||t instanceof O(t).Node)}function B(t){return!!F()&&(t instanceof Element||t instanceof O(t).Element)}function j(t){return!!F()&&(t instanceof HTMLElement||t instanceof O(t).HTMLElement)}function H(t){return!(!F()||"undefined"==typeof ShadowRoot)&&(t instanceof ShadowRoot||t instanceof O(t).ShadowRoot)}const z=new Set(["inline","contents"]);function N(t){const{overflow:e,overflowX:n,overflowY:o,display:i}=K(t);return/auto|scroll|overlay|hidden|clip/.test(e+o+n)&&!z.has(i)}const $=new Set(["table","td","th"]);function q(t){return $.has(T(t))}const I=[":popover-open",":modal"];function _(t){return I.some((e=>{try{return t.matches(e)}catch(t){return!1}}))}const U=["transform","translate","scale","rotate","perspective"],V=["transform","translate","scale","rotate","perspective","filter"],W=["paint","layout","strict","content"];function X(t){const e=Y(),n=B(t)?K(t):t;return U.some((t=>!!n[t]&&"none"!==n[t]))||!!n.containerType&&"normal"!==n.containerType||!e&&!!n.backdropFilter&&"none"!==n.backdropFilter||!e&&!!n.filter&&"none"!==n.filter||V.some((t=>(n.willChange||"").includes(t)))||W.some((t=>(n.contain||"").includes(t)))}function Y(){return!("undefined"==typeof CSS||!CSS.supports)&&CSS.supports("-webkit-backdrop-filter","none")}const G=new Set(["html","body","#document"]);function J(t){return G.has(T(t))}function K(t){return O(t).getComputedStyle(t)}function Q(t){return B(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.scrollX,scrollTop:t.scrollY}}function Z(t){if("html"===T(t))return t;const e=t.assignedSlot||t.parentNode||H(t)&&t.host||P(t);return H(e)?e.host:e}function tt(t){const e=Z(t);return J(e)?t.ownerDocument?t.ownerDocument.body:t.body:j(e)&&N(e)?e:tt(e)}function et(t,e){var n;void 0===e&&(e=[]);const o=tt(t),i=o===(null==(n=t.ownerDocument)?void 0:n.body),r=O(o);return i?e.concat(r,r.visualViewport||[],N(o)?o:[],[]):e.concat(o,et(o,[]))}function nt(t){return t.parent&&Object.getPrototypeOf(t.parent)?t.frameElement:null}function ot(t){const e=K(t);let n=parseFloat(e.width)||0,o=parseFloat(e.height)||0;const i=j(t),r=i?t.offsetWidth:n,a=i?t.offsetHeight:o,l=s(n)!==r||s(o)!==a;return l&&(n=r,o=a),{width:n,height:o,$:l}}function it(t){return B(t)?t:t.contextElement}function rt(t){const e=it(t);if(!j(e))return a(1);const n=e.getBoundingClientRect(),{width:o,height:i,$:r}=ot(e);let l=(r?s(n.width):n.width)/o,c=(r?s(n.height):n.height)/i;return l&&Number.isFinite(l)||(l=1),c&&Number.isFinite(c)||(c=1),{x:l,y:c}}const st=a(0);function at(t){const e=O(t);return Y()&&e.visualViewport?{x:e.visualViewport.offsetLeft,y:e.visualViewport.offsetTop}:st}function lt(t,e,n,o){void 0===e&&(e=!1),void 0===n&&(n=!1);const i=t.getBoundingClientRect(),r=it(t);let s=a(1);e&&(o?B(o)&&(s=rt(o)):s=rt(t));const l=function(t,e,n){return void 0===e&&(e=!1),!(!n||e&&n!==O(t))&&e}(r,n,o)?at(r):a(0);let c=(i.left+l.x)/s.x,f=(i.top+l.y)/s.y,u=i.width/s.x,d=i.height/s.y;if(r){const t=O(r),e=o&&B(o)?O(o):o;let n=t,i=nt(n);for(;i&&o&&e!==n;){const t=rt(i),e=i.getBoundingClientRect(),o=K(i);c*=t.x,f*=t.y,u*=t.x,d*=t.y,c+=e.left+(i.clientLeft+parseFloat(o.paddingLeft))*t.x,f+=e.top+(i.clientTop+parseFloat(o.paddingTop))*t.y,n=O(i),i=nt(n)}}return D({width:u,height:d,x:c,y:f})}function ct(t,e){const n=Q(t).scrollLeft;return e?e.left+n:lt(P(t)).left+n}function ft(t,e){const n=t.getBoundingClientRect();return{x:n.left+e.scrollLeft-ct(t,n),y:n.top+e.scrollTop}}const ut=new Set(["absolute","fixed"]);function dt(t,e,n){let o;if("viewport"===e)o=function(t,e){const n=O(t),o=P(t),i=n.visualViewport;let r=o.clientWidth,s=o.clientHeight,a=0,l=0;if(i){r=i.width,s=i.height;const t=Y();(!t||t&&"fixed"===e)&&(a=i.offsetLeft,l=i.offsetTop)}const c=ct(o);if(c<=0){const t=o.ownerDocument,e=t.body,n=getComputedStyle(e),i=Math.abs(o.clientWidth-e.clientWidth-("CSS1Compat"===t.compatMode&&parseFloat(n.marginLeft)+parseFloat(n.marginRight)||0));i<=25&&(r-=i)}else c<=25&&(r+=c);return{width:r,height:s,x:a,y:l}}(t,n);else if("document"===e)o=function(t){const e=P(t),n=Q(t),o=t.ownerDocument.body,i=r(e.scrollWidth,e.clientWidth,o.scrollWidth,o.clientWidth),s=r(e.scrollHeight,e.clientHeight,o.scrollHeight,o.clientHeight);let a=-n.scrollLeft+ct(t);const l=-n.scrollTop;return"rtl"===K(o).direction&&(a+=r(e.clientWidth,o.clientWidth)-i),{width:i,height:s,x:a,y:l}}(P(t));else if(B(e))o=function(t,e){const n=lt(t,!0,"fixed"===e),o=n.top+t.clientTop,i=n.left+t.clientLeft,r=j(t)?rt(t):a(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=at(t);o={x:e.x-n.x,y:e.y-n.y,width:e.width,height:e.height}}return D(o)}function ht(t,e){const n=Z(t);return!(n===e||!B(n)||J(n))&&("fixed"===K(n).position||ht(n,e))}function pt(t,e,n){const o=j(e),i=P(e),r="fixed"===n,s=lt(t,!0,r,e);let l={scrollLeft:0,scrollTop:0};const c=a(0);function f(){c.x=ct(i)}if(o||!o&&!r)if(("body"!==T(e)||N(i))&&(l=Q(e)),o){const t=lt(e,!0,r,e);c.x=t.x+e.clientLeft,c.y=t.y+e.clientTop}else i&&f();r&&!o&&i&&f();const u=!i||o||r?a(0):ft(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 mt(t){return"static"===K(t).position}function yt(t,e){if(!j(t)||"fixed"===K(t).position)return null;if(e)return e(t);let n=t.offsetParent;return P(t)===n&&(n=n.ownerDocument.body),n}function gt(t,e){const n=O(t);if(_(t))return n;if(!j(t)){let e=Z(t);for(;e&&!J(e);){if(B(e)&&!mt(e))return e;e=Z(e)}return n}let o=yt(t,e);for(;o&&q(o)&&mt(o);)o=yt(o,e);return o&&J(o)&&mt(o)&&!X(o)?n:o||function(t){let e=Z(t);for(;j(e)&&!J(e);){if(X(e))return e;if(_(e))return null;e=Z(e)}return null}(t)||n}const wt={convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{elements:e,rect:n,offsetParent:o,strategy:i}=t;const r="fixed"===i,s=P(o),l=!!e&&_(e.floating);if(o===s||l&&r)return n;let c={scrollLeft:0,scrollTop:0},f=a(1);const u=a(0),d=j(o);if((d||!d&&!r)&&(("body"!==T(o)||N(s))&&(c=Q(o)),j(o))){const t=lt(o);f=rt(o),u.x=t.x+o.clientLeft,u.y=t.y+o.clientTop}const h=!s||d||r?a(0):ft(s,c);return{width:n.width*f.x,height:n.height*f.y,x:n.x*f.x-c.scrollLeft*f.x+u.x+h.x,y:n.y*f.y-c.scrollTop*f.y+u.y+h.y}},getDocumentElement:P,getClippingRect:function(t){let{element:e,boundary:n,rootBoundary:o,strategy:s}=t;const a=[..."clippingAncestors"===n?_(e)?[]:function(t,e){const n=e.get(t);if(n)return n;let o=et(t,[]).filter((t=>B(t)&&"body"!==T(t))),i=null;const r="fixed"===K(t).position;let s=r?Z(t):t;for(;B(s)&&!J(s);){const e=K(s),n=X(s);n||"fixed"!==e.position||(i=null),(r?!n&&!i:!n&&"static"===e.position&&i&&ut.has(i.position)||N(s)&&!n&&ht(t,s))?o=o.filter((t=>t!==s)):i=e,s=Z(s)}return e.set(t,o),o}(e,this._c):[].concat(n),o],l=a.reduce(((t,n)=>{const o=dt(e,n,s);return t.top=r(o.top,t.top),t.right=i(o.right,t.right),t.bottom=i(o.bottom,t.bottom),t.left=r(o.left,t.left),t}),dt(e,a[0],s));return{width:l.right-l.left,height:l.bottom-l.top,x:l.left,y:l.top}},getOffsetParent:gt,getElementRects:async function(t){const e=this.getOffsetParent||gt,n=this.getDimensions,o=await n(t.floating);return{reference:pt(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}=ot(t);return{width:e,height:n}},getScale:rt,isElement:B,isRTL:function(t){return"rtl"===K(t).direction}},xt=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:a}=e,l=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=d(n),a=h(n),l="y"===g(n),c=R.has(s)?-1:1,f=r&&l?-1:1,p=u(e,t);let{mainAxis:m,crossAxis:y,alignmentAxis:w}="number"==typeof p?{mainAxis:p,crossAxis:0,alignmentAxis:null}:{mainAxis:p.mainAxis||0,crossAxis:p.crossAxis||0,alignmentAxis:p.alignmentAxis};return a&&"number"==typeof w&&(y="end"===a?-1*w:w),l?{x:y*f,y:m*c}:{x:m*c,y:y*f}}(e,t);return s===(null==(n=a.offset)?void 0:n.placement)&&null!=(o=a.arrow)&&o.alignmentOffset?{}:{x:i+l.x,y:r+l.y,data:{...l,placement:s}}}}},bt=function(t){return void 0===t&&(t={}),{name:"shift",options:t,async fn(e){const{x:n,y:o,placement:i,platform:r}=e,{mainAxis:s=!0,crossAxis:a=!1,limiter:l={fn:t=>{let{x:e,y:n}=t;return{x:e,y:n}}},...c}=u(t,e),h={x:n,y:o},m=await r.detectOverflow(e,c),y=g(d(i)),w=p(y);let x=h[w],b=h[y];s&&(x=f(x+m["y"===w?"top":"left"],x,x-m["y"===w?"bottom":"right"])),a&&(b=f(b+m["y"===y?"top":"left"],b,b-m["y"===y?"bottom":"right"]));const v=l.fn({...e,[w]:x,[y]:b});return{...v,data:{x:v.x-n,y:v.y-o,enabled:{[w]:s,[y]:a}}}}}},vt=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:a,platform:l,elements:c}=e,{mainAxis:f=!0,crossAxis:p=!0,fallbackPlacements:y,fallbackStrategy:C="bestFit",fallbackAxisSideDirection:D="none",flipAlignment:E=!0,...L}=u(t,e);if(null!=(n=r.arrow)&&n.alignmentOffset)return{};const R=d(i),F=g(a),T=d(a)===a,O=await(null==l.isRTL?void 0:l.isRTL(c.floating)),P=y||(T||!E?[A(a)]:function(t){const e=A(t);return[x(t),e,x(e)]}(a)),M="none"!==D;!y&&M&&P.push(...function(t,e,n,o){const i=h(t);let r=function(t,e,n){switch(t){case"top":case"bottom":return n?e?v:b:e?b:v;case"left":case"right":return e?k:S;default:return[]}}(d(t),"start"===n,o);return i&&(r=r.map((t=>t+"-"+i)),e&&(r=r.concat(r.map(x)))),r}(a,E,D,O));const B=[a,...P],j=await l.detectOverflow(e,L),H=[];let z=(null==(o=r.flip)?void 0:o.overflows)||[];if(f&&H.push(j[R]),p){const t=function(t,e,n){void 0===n&&(n=!1);const o=h(t),i=w(t),r=m(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,O);H.push(j[t[0]],j[t[1]])}if(z=[...z,{placement:i,overflows:H}],!H.every((t=>t<=0))){var N,$;const t=((null==(N=r.flip)?void 0:N.index)||0)+1,e=B[t];if(e&&("alignment"!==p||F===g(e)||z.every((t=>g(t.placement)!==F||t.overflows[0]>0))))return{data:{index:t,overflows:z},reset:{placement:e}};let n=null==($=z.filter((t=>t.overflows[0]<=0)).sort(((t,e)=>t.overflows[1]-e.overflows[1]))[0])?void 0:$.placement;if(!n)switch(C){case"bestFit":{var q;const t=null==(q=z.filter((t=>{if(M){const e=g(t.placement);return e===F||"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:q[0];t&&(n=t);break}case"initialPlacement":n=a}if(i!==n)return{reset:{placement:n}}}return{}}}},kt=t=>({name:"arrow",options:t,async fn(e){const{x:n,y:o,placement:r,rects:s,platform:a,elements:l,middlewareData:c}=e,{element:d,padding:p=0}=u(t,e)||{};if(null==d)return{};const y=C(p),g={x:n,y:o},x=w(r),b=m(x),v=await a.getDimensions(d),k="y"===x,S=k?"top":"left",A=k?"bottom":"right",D=k?"clientHeight":"clientWidth",E=s.reference[b]+s.reference[x]-g[x]-s.floating[b],L=g[x]-s.reference[x],R=await(null==a.getOffsetParent?void 0:a.getOffsetParent(d));let F=R?R[D]:0;F&&await(null==a.isElement?void 0:a.isElement(R))||(F=l.floating[D]||s.floating[b]);const T=E/2-L/2,O=F/2-v[b]/2-1,P=i(y[S],O),M=i(y[A],O),B=P,j=F-v[b]-M,H=F/2-v[b]/2+T,z=f(B,H,j),N=!c.arrow&&null!=h(r)&&H!==z&&s.reference[b]/2-(H<B?P:M)-v[b]/2<0,$=N?H<B?H-B:H-j:0;return{[x]:g[x]+$,data:{[x]:z,centerOffset:H-z-$,...N&&{alignmentOffset:$}},reset:N}}}),St="Checking...",At=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.vin=void 0,this.snapshot=void 0,this.label=St,this.failed=!0,this.loaded=!1,this.time=void 0,this.eventBus=window.eventBus,this.message=void 0,this.nanoId=((t=21)=>{let e="",n=crypto.getRandomValues(new Uint8Array(t|=0));for(;t--;)e+="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict"[63&n[t]];return e})(),this.messageHandler=t=>{const{origin:e,data:n}=t,{targetId:o}=n;if(console.log("-- messageHandler:",n,e),"http://localhost:3000"===e&&o===this.nanoId)if(void 0===this.message){if(n.type&&"resize-iframe"===n.type){this.iframe.style.width=n.payload.width+"px",this.iframe.style.height=n.payload.height+"px",this.iframe.style.display="block",this.loaded=!0,this.label="",this.message=n;const{vin:t,snapshot:e}=this;this.iframe&&this.iframe.contentWindow.postMessage({targetId:this.nanoId,type:"data-payload",payload:{vin:t,snapshot:e}},"*"),this.update()}}else this.hideTooltip()},this.register=()=>{this.eventBus.emit("activate",this.nanoId),window.addEventListener("message",this.messageHandler,!1)},this.unregister=()=>{window.removeEventListener("message",this.messageHandler)},this.update=()=>{const{target:t,tooltip:e,arrowEl:n}=this;((t,e,n)=>{const o=new Map,i={platform:wt,...n},r={...i.platform,_c:o};return(async(t,e,n)=>{const{placement:o="bottom",strategy:i="absolute",middleware:r=[],platform:s}=n,a=r.filter(Boolean),l=await(null==s.isRTL?void 0:s.isRTL(e));let c=await s.getElementRects({reference:t,floating:e,strategy:i}),{x:f,y:u}=E(c,o,l),d=o,h={},p=0;for(let n=0;n<a.length;n++){var m;const{name:r,fn:y}=a[n],{x:g,y:w,data:x,reset:b}=await y({x:f,y:u,initialPlacement:o,placement:d,strategy:i,middlewareData:h,rects:c,platform:{...s,detectOverflow:null!=(m=s.detectOverflow)?m:L},elements:{reference:t,floating:e}});f=null!=g?g:f,u=null!=w?w:u,h={...h,[r]:{...h[r],...x}},b&&p<=50&&(p++,"object"==typeof b&&(b.placement&&(d=b.placement),b.rects&&(c=!0===b.rects?await s.getElementRects({reference:t,floating:e,strategy:i}):b.rects),({x:f,y:u}=E(c,d,l))),n=-1)}return{x:f,y:u,placement:d,strategy:i,middlewareData:h}})(t,e,{...i,platform:r})})(t,e,{placement:"right",middleware:[xt(6),vt(),bt({padding:5}),kt({element:n})]}).then((({x:t,y:o,placement:i,middlewareData:r})=>{Object.assign(e.style,{left:t+"px",top:o+"px"});const{x:s,y:a}=r.arrow,l={top:"bottom",right:"left",bottom:"top",left:"right"}[i.split("-")[0]];Object.assign(n.style,{left:null!=s?s+"px":"",top:null!=a?a+"px":"",right:"",bottom:"",[l]:"-4px"})}))},this.onIframeLoad=()=>{this.update(),setTimeout((()=>{this.loaded||(this.label="Content Failed to Load...")}),3e3)},this.hideTooltip=()=>{this.iframe.style.display="",this.tooltip.style.display="",this.message=void 0,this.unregister()},this.showTooltip=()=>{this.register(),this.loaded=!1,this.label=St,this.loaded=!1,this.time=Date.now(),this.tooltip.style.display="block",this.update()},this.clickHandler=()=>{"block"===this.tooltip.style.display?this.hideTooltip():this.showTooltip()}}componentDidLoad(){this.eventBus.on("activate",(t=>{this.nanoId!==t&&(void 0!==this.message||"block"===this.tooltip.style.display)&&this.hideTooltip()})),this.update()}render(){const t=`http://localhost:3000/demo_iframe.html?q=${this.time}&nid=${this.nanoId}`;return n("div",{key:"1da684903d9253b204641b4184bc5e1f79326405",id:"root"},n("div",{key:"84665f15de5991870ad2a16f42f1984789f4631f",id:"target",ref:t=>this.target=t,onClick:()=>this.clickHandler()},"i"),n("div",{key:"178c42dc946b455c8873e06d481a93d095a2e752",id:"tooltip",role:"tooltip",ref:t=>this.tooltip=t},n("div",{key:"75921e81ce12a64df3500d1492b6d782ff2881e3"},this.label),this.time?n("iframe",{id:"content",src:t,ref:t=>this.iframe=t,onLoad:t=>this.onIframeLoad(t)}):"",n("div",{key:"99722c505d254559b6a89a3d173c0925b12e53be",id:"arrow",ref:t=>this.arrowEl=t})))}static get style(){return"#root{--clrs-navy:#001f3f;--clrs-blue:#0074d9;--clrs-aqua:#7fdbff;--clrs-teal:#39cccc;--clrs-olive:#3d9970;--clrs-green:#2ecc40;--clrs-lime:#01ff70;--clrs-yellow:#ffdc00;--clrs-orange:#ff851b;--clrs-red:#ff4136;--clrs-maroon:#85144b;--clrs-fuchsia:#f012be;--clrs-purple:#b10dc9;--clrs-black:#111111;--clrs-gray:#aaaaaa;--clrs-silver:#dddddd;--clrs-bada55:#bada55;--clrs-slate:#708090;--clrs-slate4:#4e5964;--clrs-white:#ffffff}#target{width:24px;height:24px;line-height:24px;text-align:center;border-radius:12px;background:var(--clrs-blue);font-weight:bold;font-size:120%;color:var(--clrs-white);cursor:pointer}#tooltip{display:none;position:absolute;min-height:18px;background:var(--clrs-navy);color:var(--clrs-white);font-weight:bold;padding:5px;padding-right:10px;padding-left:10px;border-radius:4px;font-size:90%;pointer-events:none}#arrow{position:absolute;background:var(--clrs-navy);width:8px;height:8px;transform:rotate(45deg)}#content{display:none;border:none}"}},[1,"proto-floater-demo",{vin:[1],snapshot:[1],label:[32],failed:[32],loaded:[32],time:[32]}]),Ct=At,Dt=function(){"undefined"!=typeof customElements&&["proto-floater-demo"].forEach((t=>{"proto-floater-demo"===t&&(customElements.get(o(t))||customElements.define(o(t),At))}))};export{Ct as ProtoFloaterDemo,Dt as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as e,h as n,transformTag as o}from"@stencil/core/internal/client";const i=Math.min,r=Math.max,s=Math.round,l=t=>({x:t,y:t}),a={left:"right",right:"left",bottom:"top",top:"bottom"};function c(t,e,n){return r(t,i(e,n))}function f(t,e){return"function"==typeof t?t(e):t}function u(t){return t.split("-")[0]}function d(t){return t.split("-")[1]}function h(t){return"x"===t?"y":"x"}function p(t){return"y"===t?"height":"width"}function m(t){const e=t[0];return"t"===e||"b"===e?"y":"x"}function y(t){return h(m(t))}function g(t){return t.includes("start")?t.replace("start","end"):t.replace("end","start")}const x=["left","right"],w=["right","left"],b=["top","bottom"],v=["bottom","top"];function k(t){const e=u(t);return a[e]+t.slice(e.length)}function A(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 S(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 C(t,e,n){let{reference:o,floating:i}=t;const r=m(e),s=y(e),l=p(s),a=u(e),c="y"===r,f=o.x+o.width/2-i.width/2,h=o.y+o.height/2-i.height/2,g=o[l]/2-i[l]/2;let x;switch(a){case"top":x={x:f,y:o.y-i.height};break;case"bottom":x={x:f,y:o.y+o.height};break;case"right":x={x:o.x+o.width,y:h};break;case"left":x={x:o.x-i.width,y:h};break;default:x={x:o.x,y:o.y}}switch(d(e)){case"start":x[s]-=g*(n&&c?-1:1);break;case"end":x[s]+=g*(n&&c?-1:1)}return x}async function D(t,e){var n;void 0===e&&(e={});const{x:o,y:i,platform:r,rects:s,elements:l,strategy:a}=t,{boundary:c="clippingAncestors",rootBoundary:u="viewport",elementContext:d="floating",altBoundary:h=!1,padding:p=0}=f(e,t),m=A(p),y=l[h?"floating"===d?"reference":"floating":d],g=S(await r.getClippingRect({element:null==(n=await(null==r.isElement?void 0:r.isElement(y)))||n?y:y.contextElement||await(null==r.getDocumentElement?void 0:r.getDocumentElement(l.floating)),boundary:c,rootBoundary:u,strategy:a})),x="floating"===d?{x:o,y:i,width:s.floating.width,height:s.floating.height}:s.reference,w=await(null==r.getOffsetParent?void 0:r.getOffsetParent(l.floating)),b=await(null==r.isElement?void 0:r.isElement(w))&&await(null==r.getScale?void 0:r.getScale(w))||{x:1,y:1},v=S(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({elements:l,rect:x,offsetParent:w,strategy:a}):x);return{top:(g.top-v.top+m.top)/b.y,bottom:(v.bottom-g.bottom+m.bottom)/b.y,left:(g.left-v.left+m.left)/b.x,right:(v.right-g.right+m.right)/b.x}}const E=new Set(["left","top"]);function L(){return"undefined"!=typeof window}function R(t){return O(t)?(t.nodeName||"").toLowerCase():"#document"}function F(t){var e;return(null==t||null==(e=t.ownerDocument)?void 0:e.defaultView)||window}function T(t){var e;return null==(e=(O(t)?t.ownerDocument:t.document)||window.document)?void 0:e.documentElement}function O(t){return!!L()&&(t instanceof Node||t instanceof F(t).Node)}function P(t){return!!L()&&(t instanceof Element||t instanceof F(t).Element)}function M(t){return!!L()&&(t instanceof HTMLElement||t instanceof F(t).HTMLElement)}function $(t){return!(!L()||"undefined"==typeof ShadowRoot)&&(t instanceof ShadowRoot||t instanceof F(t).ShadowRoot)}function j(t){const{overflow:e,overflowX:n,overflowY:o,display:i}=W(t);return/auto|scroll|overlay|hidden|clip/.test(e+o+n)&&"inline"!==i&&"contents"!==i}function B(t){return/^(table|td|th)$/.test(R(t))}function H(t){try{if(t.matches(":popover-open"))return!0}catch(t){}try{return t.matches(":modal")}catch(t){return!1}}const z=/transform|translate|scale|rotate|perspective|filter/,N=/paint|layout|strict|content/,q=t=>!!t&&"none"!==t;let I;function _(t){const e=P(t)?W(t):t;return q(e.transform)||q(e.translate)||q(e.scale)||q(e.rotate)||q(e.perspective)||!U()&&(q(e.backdropFilter)||q(e.filter))||z.test(e.willChange||"")||N.test(e.contain||"")}function U(){return null==I&&(I="undefined"!=typeof CSS&&CSS.supports&&CSS.supports("-webkit-backdrop-filter","none")),I}function V(t){return/^(html|body|#document)$/.test(R(t))}function W(t){return F(t).getComputedStyle(t)}function X(t){return P(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.scrollX,scrollTop:t.scrollY}}function Y(t){if("html"===R(t))return t;const e=t.assignedSlot||t.parentNode||$(t)&&t.host||T(t);return $(e)?e.host:e}function G(t){const e=Y(t);return V(e)?t.ownerDocument?t.ownerDocument.body:t.body:M(e)&&j(e)?e:G(e)}function J(t,e){var n;void 0===e&&(e=[]);const o=G(t),i=o===(null==(n=t.ownerDocument)?void 0:n.body),r=F(o);return i?e.concat(r,r.visualViewport||[],j(o)?o:[],[]):e.concat(o,J(o,[]))}function K(t){return t.parent&&Object.getPrototypeOf(t.parent)?t.frameElement:null}function Q(t){const e=W(t);let n=parseFloat(e.width)||0,o=parseFloat(e.height)||0;const i=M(t),r=i?t.offsetWidth:n,l=i?t.offsetHeight:o,a=s(n)!==r||s(o)!==l;return a&&(n=r,o=l),{width:n,height:o,$:a}}function Z(t){return P(t)?t:t.contextElement}function tt(t){const e=Z(t);if(!M(e))return l(1);const n=e.getBoundingClientRect(),{width:o,height:i,$:r}=Q(e);let a=(r?s(n.width):n.width)/o,c=(r?s(n.height):n.height)/i;return a&&Number.isFinite(a)||(a=1),c&&Number.isFinite(c)||(c=1),{x:a,y:c}}const et=l(0);function nt(t){const e=F(t);return U()&&e.visualViewport?{x:e.visualViewport.offsetLeft,y:e.visualViewport.offsetTop}:et}function ot(t,e,n,o){void 0===e&&(e=!1),void 0===n&&(n=!1);const i=t.getBoundingClientRect(),r=Z(t);let s=l(1);e&&(o?P(o)&&(s=tt(o)):s=tt(t));const a=function(t,e,n){return void 0===e&&(e=!1),!(!n||e&&n!==F(t))&&e}(r,n,o)?nt(r):l(0);let c=(i.left+a.x)/s.x,f=(i.top+a.y)/s.y,u=i.width/s.x,d=i.height/s.y;if(r){const t=F(r),e=o&&P(o)?F(o):o;let n=t,i=K(n);for(;i&&o&&e!==n;){const t=tt(i),e=i.getBoundingClientRect(),o=W(i);c*=t.x,f*=t.y,u*=t.x,d*=t.y,c+=e.left+(i.clientLeft+parseFloat(o.paddingLeft))*t.x,f+=e.top+(i.clientTop+parseFloat(o.paddingTop))*t.y,n=F(i),i=K(n)}}return S({width:u,height:d,x:c,y:f})}function it(t,e){const n=X(t).scrollLeft;return e?e.left+n:ot(T(t)).left+n}function rt(t,e){const n=t.getBoundingClientRect();return{x:n.left+e.scrollLeft-it(t,n),y:n.top+e.scrollTop}}function st(t,e,n){let o;if("viewport"===e)o=function(t,e){const n=F(t),o=T(t),i=n.visualViewport;let r=o.clientWidth,s=o.clientHeight,l=0,a=0;if(i){r=i.width,s=i.height;const t=U();(!t||t&&"fixed"===e)&&(l=i.offsetLeft,a=i.offsetTop)}const c=it(o);if(c<=0){const t=o.ownerDocument,e=t.body,n=getComputedStyle(e),i=Math.abs(o.clientWidth-e.clientWidth-("CSS1Compat"===t.compatMode&&parseFloat(n.marginLeft)+parseFloat(n.marginRight)||0));i<=25&&(r-=i)}else c<=25&&(r+=c);return{width:r,height:s,x:l,y:a}}(t,n);else if("document"===e)o=function(t){const e=T(t),n=X(t),o=t.ownerDocument.body,i=r(e.scrollWidth,e.clientWidth,o.scrollWidth,o.clientWidth),s=r(e.scrollHeight,e.clientHeight,o.scrollHeight,o.clientHeight);let l=-n.scrollLeft+it(t);const a=-n.scrollTop;return"rtl"===W(o).direction&&(l+=r(e.clientWidth,o.clientWidth)-i),{width:i,height:s,x:l,y:a}}(T(t));else if(P(e))o=function(t,e){const n=ot(t,!0,"fixed"===e),o=n.top+t.clientTop,i=n.left+t.clientLeft,r=M(t)?tt(t):l(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=nt(t);o={x:e.x-n.x,y:e.y-n.y,width:e.width,height:e.height}}return S(o)}function lt(t,e){const n=Y(t);return!(n===e||!P(n)||V(n))&&("fixed"===W(n).position||lt(n,e))}function at(t,e,n){const o=M(e),i=T(e),r="fixed"===n,s=ot(t,!0,r,e);let a={scrollLeft:0,scrollTop:0};const c=l(0);function f(){c.x=it(i)}if(o||!o&&!r)if(("body"!==R(e)||j(i))&&(a=X(e)),o){const t=ot(e,!0,r,e);c.x=t.x+e.clientLeft,c.y=t.y+e.clientTop}else i&&f();r&&!o&&i&&f();const u=!i||o||r?l(0):rt(i,a);return{x:s.left+a.scrollLeft-c.x-u.x,y:s.top+a.scrollTop-c.y-u.y,width:s.width,height:s.height}}function ct(t){return"static"===W(t).position}function ft(t,e){if(!M(t)||"fixed"===W(t).position)return null;if(e)return e(t);let n=t.offsetParent;return T(t)===n&&(n=n.ownerDocument.body),n}function ut(t,e){const n=F(t);if(H(t))return n;if(!M(t)){let e=Y(t);for(;e&&!V(e);){if(P(e)&&!ct(e))return e;e=Y(e)}return n}let o=ft(t,e);for(;o&&B(o)&&ct(o);)o=ft(o,e);return o&&V(o)&&ct(o)&&!_(o)?n:o||function(t){let e=Y(t);for(;M(e)&&!V(e);){if(_(e))return e;if(H(e))return null;e=Y(e)}return null}(t)||n}const dt={convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{elements:e,rect:n,offsetParent:o,strategy:i}=t;const r="fixed"===i,s=T(o),a=!!e&&H(e.floating);if(o===s||a&&r)return n;let c={scrollLeft:0,scrollTop:0},f=l(1);const u=l(0),d=M(o);if((d||!d&&!r)&&(("body"!==R(o)||j(s))&&(c=X(o)),d)){const t=ot(o);f=tt(o),u.x=t.x+o.clientLeft,u.y=t.y+o.clientTop}const h=!s||d||r?l(0):rt(s,c);return{width:n.width*f.x,height:n.height*f.y,x:n.x*f.x-c.scrollLeft*f.x+u.x+h.x,y:n.y*f.y-c.scrollTop*f.y+u.y+h.y}},getDocumentElement:T,getClippingRect:function(t){let{element:e,boundary:n,rootBoundary:o,strategy:s}=t;const l=[..."clippingAncestors"===n?H(e)?[]:function(t,e){const n=e.get(t);if(n)return n;let o=J(t,[]).filter((t=>P(t)&&"body"!==R(t))),i=null;const r="fixed"===W(t).position;let s=r?Y(t):t;for(;P(s)&&!V(s);){const e=W(s),n=_(s);n||"fixed"!==e.position||(i=null),(r?!n&&!i:!n&&"static"===e.position&&i&&("absolute"===i.position||"fixed"===i.position)||j(s)&&!n&&lt(t,s))?o=o.filter((t=>t!==s)):i=e,s=Y(s)}return e.set(t,o),o}(e,this._c):[].concat(n),o],a=st(e,l[0],s);let c=a.top,f=a.right,u=a.bottom,d=a.left;for(let t=1;t<l.length;t++){const n=st(e,l[t],s);c=r(n.top,c),f=i(n.right,f),u=i(n.bottom,u),d=r(n.left,d)}return{width:f-d,height:u-c,x:d,y:c}},getOffsetParent:ut,getElementRects:async function(t){const e=this.getOffsetParent||ut,n=this.getDimensions,o=await n(t.floating);return{reference:at(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}=Q(t);return{width:e,height:n}},getScale:tt,isElement:P,isRTL:function(t){return"rtl"===W(t).direction}},ht=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,a=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=u(n),l=d(n),a="y"===m(n),c=E.has(s)?-1:1,h=r&&a?-1:1,p=f(e,t);let{mainAxis:y,crossAxis:g,alignmentAxis:x}="number"==typeof p?{mainAxis:p,crossAxis:0,alignmentAxis:null}:{mainAxis:p.mainAxis||0,crossAxis:p.crossAxis||0,alignmentAxis:p.alignmentAxis};return l&&"number"==typeof x&&(g="end"===l?-1*x:x),a?{x:g*h,y:y*c}:{x:y*c,y:g*h}}(e,t);return s===(null==(n=l.offset)?void 0:n.placement)&&null!=(o=l.arrow)&&o.alignmentOffset?{}:{x:i+a.x,y:r+a.y,data:{...a,placement:s}}}}},pt=function(t){return void 0===t&&(t={}),{name:"shift",options:t,async fn(e){const{x:n,y:o,placement:i,platform:r}=e,{mainAxis:s=!0,crossAxis:l=!1,limiter:a={fn:t=>{let{x:e,y:n}=t;return{x:e,y:n}}},...d}=f(t,e),p={x:n,y:o},y=await r.detectOverflow(e,d),g=m(u(i)),x=h(g);let w=p[x],b=p[g];s&&(w=c(w+y["y"===x?"top":"left"],w,w-y["y"===x?"bottom":"right"])),l&&(b=c(b+y["y"===g?"top":"left"],b,b-y["y"===g?"bottom":"right"]));const v=a.fn({...e,[x]:w,[g]:b});return{...v,data:{x:v.x-n,y:v.y-o,enabled:{[x]:s,[g]:l}}}}}},mt=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:a,elements:c}=e,{mainAxis:h=!0,crossAxis:A=!0,fallbackPlacements:S,fallbackStrategy:C="bestFit",fallbackAxisSideDirection:D="none",flipAlignment:E=!0,...L}=f(t,e);if(null!=(n=r.arrow)&&n.alignmentOffset)return{};const R=u(i),F=m(l),T=u(l)===l,O=await(null==a.isRTL?void 0:a.isRTL(c.floating)),P=S||(T||!E?[k(l)]:function(t){const e=k(t);return[g(t),e,g(e)]}(l)),M="none"!==D;!S&&M&&P.push(...function(t,e,n,o){const i=d(t);let r=function(t,e,n){switch(t){case"top":case"bottom":return n?e?w:x:e?x:w;case"left":case"right":return e?b:v;default:return[]}}(u(t),"start"===n,o);return i&&(r=r.map((t=>t+"-"+i)),e&&(r=r.concat(r.map(g)))),r}(l,E,D,O));const $=[l,...P],j=await a.detectOverflow(e,L),B=[];let H=(null==(o=r.flip)?void 0:o.overflows)||[];if(h&&B.push(j[R]),A){const t=function(t,e,n){void 0===n&&(n=!1);const o=d(t),i=y(t),r=p(i);let s="x"===i?o===(n?"end":"start")?"right":"left":"start"===o?"bottom":"top";return e.reference[r]>e.floating[r]&&(s=k(s)),[s,k(s)]}(i,s,O);B.push(j[t[0]],j[t[1]])}if(H=[...H,{placement:i,overflows:B}],!B.every((t=>t<=0))){var z,N;const t=((null==(z=r.flip)?void 0:z.index)||0)+1,e=$[t];if(e&&("alignment"!==A||F===m(e)||H.every((t=>m(t.placement)!==F||t.overflows[0]>0))))return{data:{index:t,overflows:H},reset:{placement:e}};let n=null==(N=H.filter((t=>t.overflows[0]<=0)).sort(((t,e)=>t.overflows[1]-e.overflows[1]))[0])?void 0:N.placement;if(!n)switch(C){case"bestFit":{var q;const t=null==(q=H.filter((t=>{if(M){const e=m(t.placement);return e===F||"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:q[0];t&&(n=t);break}case"initialPlacement":n=l}if(i!==n)return{reset:{placement:n}}}return{}}}},yt=t=>({name:"arrow",options:t,async fn(e){const{x:n,y:o,placement:r,rects:s,platform:l,elements:a,middlewareData:u}=e,{element:h,padding:m=0}=f(t,e)||{};if(null==h)return{};const g=A(m),x={x:n,y:o},w=y(r),b=p(w),v=await l.getDimensions(h),k="y"===w,S=k?"top":"left",C=k?"bottom":"right",D=k?"clientHeight":"clientWidth",E=s.reference[b]+s.reference[w]-x[w]-s.floating[b],L=x[w]-s.reference[w],R=await(null==l.getOffsetParent?void 0:l.getOffsetParent(h));let F=R?R[D]:0;F&&await(null==l.isElement?void 0:l.isElement(R))||(F=a.floating[D]||s.floating[b]);const T=E/2-L/2,O=F/2-v[b]/2-1,P=i(g[S],O),M=i(g[C],O),$=P,j=F-v[b]-M,B=F/2-v[b]/2+T,H=c($,B,j),z=!u.arrow&&null!=d(r)&&B!==H&&s.reference[b]/2-(B<$?P:M)-v[b]/2<0,N=z?B<$?B-$:B-j:0;return{[w]:x[w]+N,data:{[w]:H,centerOffset:B-H-N,...z&&{alignmentOffset:N}},reset:z}}}),gt="Checking...",xt=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.vin=void 0,this.snapshot=void 0,this.label=gt,this.failed=!0,this.loaded=!1,this.time=void 0,this.eventBus=window.eventBus,this.message=void 0,this.nanoId=((t=21)=>{let e="",n=crypto.getRandomValues(new Uint8Array(t|=0));for(;t--;)e+="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict"[63&n[t]];return e})(),this.messageHandler=t=>{const{origin:e,data:n}=t,{targetId:o}=n;if(console.log("-- messageHandler:",n,e),"http://localhost:3000"===e&&o===this.nanoId)if(void 0===this.message){if(n.type&&"resize-iframe"===n.type){this.iframe.style.width=n.payload.width+"px",this.iframe.style.height=n.payload.height+"px",this.iframe.style.display="block",this.loaded=!0,this.label="",this.message=n;const{vin:t,snapshot:e}=this;this.iframe&&this.iframe.contentWindow.postMessage({targetId:this.nanoId,type:"data-payload",payload:{vin:t,snapshot:e}},"*"),this.update()}}else this.hideTooltip()},this.register=()=>{this.eventBus.emit("activate",this.nanoId),window.addEventListener("message",this.messageHandler,!1)},this.unregister=()=>{window.removeEventListener("message",this.messageHandler)},this.update=()=>{const{target:t,tooltip:e,arrowEl:n}=this;((t,e,n)=>{const o=new Map,i={platform:dt,...n},r={...i.platform,_c:o};return(async(t,e,n)=>{const{placement:o="bottom",strategy:i="absolute",middleware:r=[],platform:s}=n,l=s.detectOverflow?s:{...s,detectOverflow:D},a=await(null==s.isRTL?void 0:s.isRTL(e));let c=await s.getElementRects({reference:t,floating:e,strategy:i}),{x:f,y:u}=C(c,o,a),d=o,h=0;const p={};for(let n=0;n<r.length;n++){const m=r[n];if(!m)continue;const{name:y,fn:g}=m,{x,y:w,data:b,reset:v}=await g({x:f,y:u,initialPlacement:o,placement:d,strategy:i,middlewareData:p,rects:c,platform:l,elements:{reference:t,floating:e}});f=null!=x?x:f,u=null!=w?w:u,p[y]={...p[y],...b},v&&h<50&&(h++,"object"==typeof v&&(v.placement&&(d=v.placement),v.rects&&(c=!0===v.rects?await s.getElementRects({reference:t,floating:e,strategy:i}):v.rects),({x:f,y:u}=C(c,d,a))),n=-1)}return{x:f,y:u,placement:d,strategy:i,middlewareData:p}})(t,e,{...i,platform:r})})(t,e,{placement:"right",middleware:[ht(6),mt(),pt({padding:5}),yt({element:n})]}).then((({x:t,y:o,placement:i,middlewareData:r})=>{Object.assign(e.style,{left:t+"px",top:o+"px"});const{x:s,y:l}=r.arrow,a={top:"bottom",right:"left",bottom:"top",left:"right"}[i.split("-")[0]];Object.assign(n.style,{left:null!=s?s+"px":"",top:null!=l?l+"px":"",right:"",bottom:"",[a]:"-4px"})}))},this.onIframeLoad=()=>{this.update(),setTimeout((()=>{this.loaded||(this.label="Content Failed to Load...")}),3e3)},this.hideTooltip=()=>{this.iframe.style.display="",this.tooltip.style.display="",this.message=void 0,this.unregister()},this.showTooltip=()=>{this.register(),this.loaded=!1,this.label=gt,this.loaded=!1,this.time=Date.now(),this.tooltip.style.display="block",this.update()},this.clickHandler=()=>{"block"===this.tooltip.style.display?this.hideTooltip():this.showTooltip()}}componentDidLoad(){this.eventBus.on("activate",(t=>{this.nanoId!==t&&(void 0!==this.message||"block"===this.tooltip.style.display)&&this.hideTooltip()})),this.update()}render(){const t=`http://localhost:3000/demo_iframe.html?q=${this.time}&nid=${this.nanoId}`;return n("div",{key:"1da684903d9253b204641b4184bc5e1f79326405",id:"root"},n("div",{key:"84665f15de5991870ad2a16f42f1984789f4631f",id:"target",ref:t=>this.target=t,onClick:()=>this.clickHandler()},"i"),n("div",{key:"178c42dc946b455c8873e06d481a93d095a2e752",id:"tooltip",role:"tooltip",ref:t=>this.tooltip=t},n("div",{key:"75921e81ce12a64df3500d1492b6d782ff2881e3"},this.label),this.time?n("iframe",{id:"content",src:t,ref:t=>this.iframe=t,onLoad:t=>this.onIframeLoad(t)}):"",n("div",{key:"99722c505d254559b6a89a3d173c0925b12e53be",id:"arrow",ref:t=>this.arrowEl=t})))}static get style(){return"#root{--clrs-navy:#001f3f;--clrs-blue:#0074d9;--clrs-aqua:#7fdbff;--clrs-teal:#39cccc;--clrs-olive:#3d9970;--clrs-green:#2ecc40;--clrs-lime:#01ff70;--clrs-yellow:#ffdc00;--clrs-orange:#ff851b;--clrs-red:#ff4136;--clrs-maroon:#85144b;--clrs-fuchsia:#f012be;--clrs-purple:#b10dc9;--clrs-black:#111111;--clrs-gray:#aaaaaa;--clrs-silver:#dddddd;--clrs-bada55:#bada55;--clrs-slate:#708090;--clrs-slate4:#4e5964;--clrs-white:#ffffff}#target{width:24px;height:24px;line-height:24px;text-align:center;border-radius:12px;background:var(--clrs-blue);font-weight:bold;font-size:120%;color:var(--clrs-white);cursor:pointer}#tooltip{display:none;position:absolute;min-height:18px;background:var(--clrs-navy);color:var(--clrs-white);font-weight:bold;padding:5px;padding-right:10px;padding-left:10px;border-radius:4px;font-size:90%;pointer-events:none}#arrow{position:absolute;background:var(--clrs-navy);width:8px;height:8px;transform:rotate(45deg)}#content{display:none;border:none}"}},[1,"proto-floater-demo",{vin:[1],snapshot:[1],label:[32],failed:[32],loaded:[32],time:[32]}]),wt=xt,bt=function(){"undefined"!=typeof customElements&&["proto-floater-demo"].forEach((t=>{"proto-floater-demo"===t&&(customElements.get(o(t))||customElements.define(o(t),xt))}))};export{wt as ProtoFloaterDemo,bt as defineCustomElement}

package/dist/esm/proto-floater-demo.entry.js

@@ -18,10 +18,6 @@ const oppositeSideMap = {
   bottom: 'top',
   top: 'bottom'
 };
-const oppositeAlignmentMap = {
-  start: 'end',
-  end: 'start'
-};
 function clamp(start, value, end) {
   return max(start, min(value, end));
 }
@@ -40,9 +36,9 @@ function getOppositeAxis(axis) {
 function getAxisLength(axis) {
   return axis === 'y' ? 'height' : 'width';
 }
-const yAxisSides = /*#__PURE__*/new Set(['top', 'bottom']);
 function getSideAxis(placement) {
-  return yAxisSides.has(getSide(placement)) ? 'y' : 'x';
+  const firstChar = placement[0];
+  return firstChar === 't' || firstChar === 'b' ? 'y' : 'x';
 }
 function getAlignmentAxis(placement) {
   return getOppositeAxis(getSideAxis(placement));
@@ -65,7 +61,7 @@ function getExpandedPlacements(placement) {
   return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
 }
 function getOppositeAlignmentPlacement(placement) {
-  return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
+  return placement.includes('start') ? placement.replace('start', 'end') : placement.replace('end', 'start');
 }
 const lrPlacement = ['left', 'right'];
 const rlPlacement = ['right', 'left'];
@@ -96,7 +92,8 @@ function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
   return list;
 }
 function getOppositePlacement(placement) {
-  return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
+  const side = getSide(placement);
+  return oppositeSideMap[side] + placement.slice(side.length);
 }
 function expandPaddingObject(padding) {
   return {
@@ -255,6 +252,9 @@ async function detectOverflow(state, options) {
   };
 }
 
+// Maximum number of resets that can occur before bailing to avoid infinite reset loops.
+const MAX_RESET_COUNT = 50;
+
 /**
  * Computes the `x` and `y` coordinates that will place the floating element
  * next to a given reference element.
@@ -269,7 +269,10 @@ const computePosition$1 = async (reference, floating, config) => {
     middleware = [],
     platform
   } = config;
-  const validMiddleware = middleware.filter(Boolean);
+  const platformWithDetectOverflow = platform.detectOverflow ? platform : {
+    ...platform,
+    detectOverflow
+  };
   const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
   let rects = await platform.getElementRects({
     reference,
@@ -281,14 +284,17 @@ const computePosition$1 = async (reference, floating, config) => {
     y
   } = computeCoordsFromPlacement(rects, placement, rtl);
   let statefulPlacement = placement;
-  let middlewareData = {};
   let resetCount = 0;
-  for (let i = 0; i < validMiddleware.length; i++) {
-    var _platform$detectOverf;
+  const middlewareData = {};
+  for (let i = 0; i < middleware.length; i++) {
+    const currentMiddleware = middleware[i];
+    if (!currentMiddleware) {
+      continue;
+    }
     const {
       name,
       fn
-    } = validMiddleware[i];
+    } = currentMiddleware;
     const {
       x: nextX,
       y: nextY,
@@ -302,10 +308,7 @@ const computePosition$1 = async (reference, floating, config) => {
       strategy,
       middlewareData,
       rects,
-      platform: {
-        ...platform,
-        detectOverflow: (_platform$detectOverf = platform.detectOverflow) != null ? _platform$detectOverf : detectOverflow
-      },
+      platform: platformWithDetectOverflow,
       elements: {
         reference,
         floating
@@ -313,14 +316,11 @@ const computePosition$1 = async (reference, floating, config) => {
     });
     x = nextX != null ? nextX : x;
     y = nextY != null ? nextY : y;
-    middlewareData = {
-      ...middlewareData,
-      [name]: {
-        ...middlewareData[name],
-        ...data
-      }
+    middlewareData[name] = {
+      ...middlewareData[name],
+      ...data
     };
-    if (reset && resetCount <= 50) {
+    if (reset && resetCount < MAX_RESET_COUNT) {
       resetCount++;
       if (typeof reset === 'object') {
         if (reset.placement) {
@@ -773,7 +773,6 @@ function isShadowRoot(value) {
   }
   return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
 }
-const invalidOverflowDisplayValues = /*#__PURE__*/new Set(['inline', 'contents']);
 function isOverflowElement(element) {
   const {
     overflow,
@@ -781,32 +780,35 @@ function isOverflowElement(element) {
     overflowY,
     display
   } = getComputedStyle$1(element);
-  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
+  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && display !== 'inline' && display !== 'contents';
 }
-const tableElements = /*#__PURE__*/new Set(['table', 'td', 'th']);
 function isTableElement(element) {
-  return tableElements.has(getNodeName(element));
+  return /^(table|td|th)$/.test(getNodeName(element));
 }
-const topLayerSelectors = [':popover-open', ':modal'];
 function isTopLayer(element) {
-  return topLayerSelectors.some(selector => {
-    try {
-      return element.matches(selector);
-    } catch (_e) {
-      return false;
+  try {
+    if (element.matches(':popover-open')) {
+      return true;
     }
-  });
+  } catch (_e) {
+    // no-op
+  }
+  try {
+    return element.matches(':modal');
+  } catch (_e) {
+    return false;
+  }
 }
-const transformProperties = ['transform', 'translate', 'scale', 'rotate', 'perspective'];
-const willChangeValues = ['transform', 'translate', 'scale', 'rotate', 'perspective', 'filter'];
-const containValues = ['paint', 'layout', 'strict', 'content'];
+const willChangeRe = /transform|translate|scale|rotate|perspective|filter/;
+const containRe = /paint|layout|strict|content/;
+const isNotNone = value => !!value && value !== 'none';
+let isWebKitValue;
 function isContainingBlock(elementOrCss) {
-  const webkit = isWebKit();
   const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
 
   // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
   // https://drafts.csswg.org/css-transforms-2/#individual-transforms
-  return transformProperties.some(value => css[value] ? css[value] !== 'none' : false) || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || willChangeValues.some(value => (css.willChange || '').includes(value)) || containValues.some(value => (css.contain || '').includes(value));
+  return isNotNone(css.transform) || isNotNone(css.translate) || isNotNone(css.scale) || isNotNone(css.rotate) || isNotNone(css.perspective) || !isWebKit() && (isNotNone(css.backdropFilter) || isNotNone(css.filter)) || willChangeRe.test(css.willChange || '') || containRe.test(css.contain || '');
 }
 function getContainingBlock(element) {
   let currentNode = getParentNode(element);
@@ -821,12 +823,13 @@ function getContainingBlock(element) {
   return null;
 }
 function isWebKit() {
-  if (typeof CSS === 'undefined' || !CSS.supports) return false;
-  return CSS.supports('-webkit-backdrop-filter', 'none');
+  if (isWebKitValue == null) {
+    isWebKitValue = typeof CSS !== 'undefined' && CSS.supports && CSS.supports('-webkit-backdrop-filter', 'none');
+  }
+  return isWebKitValue;
 }
-const lastTraversableNodeNames = /*#__PURE__*/new Set(['html', 'body', '#document']);
 function isLastTraversableNode(node) {
-  return lastTraversableNodeNames.has(getNodeName(node));
+  return /^(html|body|#document)$/.test(getNodeName(node));
 }
 function getComputedStyle$1(element) {
   return getWindow(element).getComputedStyle(element);
@@ -878,8 +881,9 @@ function getOverflowAncestors(node, list, traverseIframes) {
   const win = getWindow(scrollableAncestor);
   if (isBody) {
     return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], []);
+  } else {
+    return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, []));
   }
-  return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, []));
 }
 function getFrameElement(win) {
   return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
@@ -1056,7 +1060,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
     if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
       scroll = getNodeScroll(offsetParent);
     }
-    if (isHTMLElement(offsetParent)) {
+    if (isOffsetParentAnElement) {
       const offsetRect = getBoundingClientRect(offsetParent);
       scale = getScale(offsetParent);
       offsets.x = offsetRect.x + offsetParent.clientLeft;
@@ -1144,7 +1148,6 @@ function getViewportRect(element, strategy) {
   };
 }
 
-const absoluteOrFixed = /*#__PURE__*/new Set(['absolute', 'fixed']);
 // Returns the inner client rect, subtracting scrollbars if present.
 function getInnerBoundingClientRect(element, strategy) {
   const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
@@ -1209,7 +1212,7 @@ function getClippingElementAncestors(element, cache) {
     if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
       currentContainingBlockComputedStyle = null;
     }
-    const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
+    const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && (currentContainingBlockComputedStyle.position === 'absolute' || currentContainingBlockComputedStyle.position === 'fixed') || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
     if (shouldDropCurrentNode) {
       // Drop non-containing blocks.
       result = result.filter(ancestor => ancestor !== currentNode);
@@ -1234,20 +1237,23 @@ function getClippingRect(_ref) {
   } = _ref;
   const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
   const clippingAncestors = [...elementClippingAncestors, rootBoundary];
-  const firstClippingAncestor = clippingAncestors[0];
-  const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
-    const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
-    accRect.top = max(rect.top, accRect.top);
-    accRect.right = min(rect.right, accRect.right);
-    accRect.bottom = min(rect.bottom, accRect.bottom);
-    accRect.left = max(rect.left, accRect.left);
-    return accRect;
-  }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
+  const firstRect = getClientRectFromClippingAncestor(element, clippingAncestors[0], strategy);
+  let top = firstRect.top;
+  let right = firstRect.right;
+  let bottom = firstRect.bottom;
+  let left = firstRect.left;
+  for (let i = 1; i < clippingAncestors.length; i++) {
+    const rect = getClientRectFromClippingAncestor(element, clippingAncestors[i], strategy);
+    top = max(rect.top, top);
+    right = min(rect.right, right);
+    bottom = min(rect.bottom, bottom);
+    left = max(rect.left, left);
+  }
   return {
-    width: clippingRect.right - clippingRect.left,
-    height: clippingRect.bottom - clippingRect.top,
-    x: clippingRect.left,
-    y: clippingRect.top
+    width: right - left,
+    height: bottom - top,
+    x: left,
+    y: top
   };
 }
 

package/dist/proto-float-wc/p-7796fd9e.entry.js

@@ -0,0 +1 @@
+import{r as t,h as e}from"./p-CeIUpiSD.js";const n=Math.min,i=Math.max,o=Math.round,r=t=>({x:t,y:t}),s={left:"right",right:"left",bottom:"top",top:"bottom"};function a(t,e,o){return i(t,n(e,o))}function l(t,e){return"function"==typeof t?t(e):t}function c(t){return t.split("-")[0]}function f(t){return t.split("-")[1]}function u(t){return"x"===t?"y":"x"}function d(t){return"y"===t?"height":"width"}function h(t){const e=t[0];return"t"===e||"b"===e?"y":"x"}function p(t){return u(h(t))}function m(t){return t.includes("start")?t.replace("start","end"):t.replace("end","start")}const y=["left","right"],g=["right","left"],x=["top","bottom"],w=["bottom","top"];function b(t){const e=c(t);return s[e]+t.slice(e.length)}function v(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 k(t){const{x:e,y:n,width:i,height:o}=t;return{width:i,height:o,top:n,left:e,right:e+i,bottom:n+o,x:e,y:n}}function A(t,e,n){let{reference:i,floating:o}=t;const r=h(e),s=p(e),a=d(s),l=c(e),u="y"===r,m=i.x+i.width/2-o.width/2,y=i.y+i.height/2-o.height/2,g=i[a]/2-o[a]/2;let x;switch(l){case"top":x={x:m,y:i.y-o.height};break;case"bottom":x={x:m,y:i.y+i.height};break;case"right":x={x:i.x+i.width,y};break;case"left":x={x:i.x-o.width,y};break;default:x={x:i.x,y:i.y}}switch(f(e)){case"start":x[s]-=g*(n&&u?-1:1);break;case"end":x[s]+=g*(n&&u?-1:1)}return x}async function S(t,e){var n;void 0===e&&(e={});const{x:i,y:o,platform:r,rects:s,elements:a,strategy:c}=t,{boundary:f="clippingAncestors",rootBoundary:u="viewport",elementContext:d="floating",altBoundary:h=!1,padding:p=0}=l(e,t),m=v(p),y=a[h?"floating"===d?"reference":"floating":d],g=k(await r.getClippingRect({element:null==(n=await(null==r.isElement?void 0:r.isElement(y)))||n?y:y.contextElement||await(null==r.getDocumentElement?void 0:r.getDocumentElement(a.floating)),boundary:f,rootBoundary:u,strategy:c})),x="floating"===d?{x:i,y:o,width:s.floating.width,height:s.floating.height}:s.reference,w=await(null==r.getOffsetParent?void 0:r.getOffsetParent(a.floating)),b=await(null==r.isElement?void 0:r.isElement(w))&&await(null==r.getScale?void 0:r.getScale(w))||{x:1,y:1},A=k(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({elements:a,rect:x,offsetParent:w,strategy:c}):x);return{top:(g.top-A.top+m.top)/b.y,bottom:(A.bottom-g.bottom+m.bottom)/b.y,left:(g.left-A.left+m.left)/b.x,right:(A.right-g.right+m.right)/b.x}}const C=new Set(["left","top"]);function D(){return"undefined"!=typeof window}function R(t){return $(t)?(t.nodeName||"").toLowerCase():"#document"}function F(t){var e;return(null==t||null==(e=t.ownerDocument)?void 0:e.defaultView)||window}function L(t){var e;return null==(e=($(t)?t.ownerDocument:t.document)||window.document)?void 0:e.documentElement}function $(t){return!!D()&&(t instanceof Node||t instanceof F(t).Node)}function O(t){return!!D()&&(t instanceof Element||t instanceof F(t).Element)}function P(t){return!!D()&&(t instanceof HTMLElement||t instanceof F(t).HTMLElement)}function T(t){return!(!D()||"undefined"==typeof ShadowRoot)&&(t instanceof ShadowRoot||t instanceof F(t).ShadowRoot)}function E(t){const{overflow:e,overflowX:n,overflowY:i,display:o}=U(t);return/auto|scroll|overlay|hidden|clip/.test(e+i+n)&&"inline"!==o&&"contents"!==o}function M(t){return/^(table|td|th)$/.test(R(t))}function j(t){try{if(t.matches(":popover-open"))return!0}catch(t){}try{return t.matches(":modal")}catch(t){return!1}}const B=/transform|translate|scale|rotate|perspective|filter/,_=/paint|layout|strict|content/,z=t=>!!t&&"none"!==t;let H;function I(t){const e=O(t)?U(t):t;return z(e.transform)||z(e.translate)||z(e.scale)||z(e.rotate)||z(e.perspective)||!N()&&(z(e.backdropFilter)||z(e.filter))||B.test(e.willChange||"")||_.test(e.contain||"")}function N(){return null==H&&(H="undefined"!=typeof CSS&&CSS.supports&&CSS.supports("-webkit-backdrop-filter","none")),H}function q(t){return/^(html|body|#document)$/.test(R(t))}function U(t){return F(t).getComputedStyle(t)}function V(t){return O(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.scrollX,scrollTop:t.scrollY}}function W(t){if("html"===R(t))return t;const e=t.assignedSlot||t.parentNode||T(t)&&t.host||L(t);return T(e)?e.host:e}function X(t){const e=W(t);return q(e)?t.ownerDocument?t.ownerDocument.body:t.body:P(e)&&E(e)?e:X(e)}function Y(t,e){var n;void 0===e&&(e=[]);const i=X(t),o=i===(null==(n=t.ownerDocument)?void 0:n.body),r=F(i);return o?e.concat(r,r.visualViewport||[],E(i)?i:[],[]):e.concat(i,Y(i,[]))}function G(t){return t.parent&&Object.getPrototypeOf(t.parent)?t.frameElement:null}function J(t){const e=U(t);let n=parseFloat(e.width)||0,i=parseFloat(e.height)||0;const r=P(t),s=r?t.offsetWidth:n,a=r?t.offsetHeight:i,l=o(n)!==s||o(i)!==a;return l&&(n=s,i=a),{width:n,height:i,$:l}}function K(t){return O(t)?t:t.contextElement}function Q(t){const e=K(t);if(!P(e))return r(1);const n=e.getBoundingClientRect(),{width:i,height:s,$:a}=J(e);let l=(a?o(n.width):n.width)/i,c=(a?o(n.height):n.height)/s;return l&&Number.isFinite(l)||(l=1),c&&Number.isFinite(c)||(c=1),{x:l,y:c}}const Z=r(0);function tt(t){const e=F(t);return N()&&e.visualViewport?{x:e.visualViewport.offsetLeft,y:e.visualViewport.offsetTop}:Z}function et(t,e,n,i){void 0===e&&(e=!1),void 0===n&&(n=!1);const o=t.getBoundingClientRect(),s=K(t);let a=r(1);e&&(i?O(i)&&(a=Q(i)):a=Q(t));const l=function(t,e,n){return void 0===e&&(e=!1),!(!n||e&&n!==F(t))&&e}(s,n,i)?tt(s):r(0);let c=(o.left+l.x)/a.x,f=(o.top+l.y)/a.y,u=o.width/a.x,d=o.height/a.y;if(s){const t=F(s),e=i&&O(i)?F(i):i;let n=t,o=G(n);for(;o&&i&&e!==n;){const t=Q(o),e=o.getBoundingClientRect(),i=U(o),r=e.left+(o.clientLeft+parseFloat(i.paddingLeft))*t.x,s=e.top+(o.clientTop+parseFloat(i.paddingTop))*t.y;c*=t.x,f*=t.y,u*=t.x,d*=t.y,c+=r,f+=s,n=F(o),o=G(n)}}return k({width:u,height:d,x:c,y:f})}function nt(t,e){const n=V(t).scrollLeft;return e?e.left+n:et(L(t)).left+n}function it(t,e){const n=t.getBoundingClientRect();return{x:n.left+e.scrollLeft-nt(t,n),y:n.top+e.scrollTop}}function ot(t,e,n){let o;if("viewport"===e)o=function(t,e){const n=F(t),i=L(t),o=n.visualViewport;let r=i.clientWidth,s=i.clientHeight,a=0,l=0;if(o){r=o.width,s=o.height;const t=N();(!t||t&&"fixed"===e)&&(a=o.offsetLeft,l=o.offsetTop)}const c=nt(i);if(c<=0){const t=i.ownerDocument,e=t.body,n=getComputedStyle(e),o="CSS1Compat"===t.compatMode&&parseFloat(n.marginLeft)+parseFloat(n.marginRight)||0,s=Math.abs(i.clientWidth-e.clientWidth-o);s<=25&&(r-=s)}else c<=25&&(r+=c);return{width:r,height:s,x:a,y:l}}(t,n);else if("document"===e)o=function(t){const e=L(t),n=V(t),o=t.ownerDocument.body,r=i(e.scrollWidth,e.clientWidth,o.scrollWidth,o.clientWidth),s=i(e.scrollHeight,e.clientHeight,o.scrollHeight,o.clientHeight);let a=-n.scrollLeft+nt(t);const l=-n.scrollTop;return"rtl"===U(o).direction&&(a+=i(e.clientWidth,o.clientWidth)-r),{width:r,height:s,x:a,y:l}}(L(t));else if(O(e))o=function(t,e){const n=et(t,!0,"fixed"===e),i=n.top+t.clientTop,o=n.left+t.clientLeft,s=P(t)?Q(t):r(1);return{width:t.clientWidth*s.x,height:t.clientHeight*s.y,x:o*s.x,y:i*s.y}}(e,n);else{const n=tt(t);o={x:e.x-n.x,y:e.y-n.y,width:e.width,height:e.height}}return k(o)}function rt(t,e){const n=W(t);return!(n===e||!O(n)||q(n))&&("fixed"===U(n).position||rt(n,e))}function st(t,e,n){const i=P(e),o=L(e),s="fixed"===n,a=et(t,!0,s,e);let l={scrollLeft:0,scrollTop:0};const c=r(0);function f(){c.x=nt(o)}if(i||!i&&!s)if(("body"!==R(e)||E(o))&&(l=V(e)),i){const t=et(e,!0,s,e);c.x=t.x+e.clientLeft,c.y=t.y+e.clientTop}else o&&f();s&&!i&&o&&f();const u=!o||i||s?r(0):it(o,l);return{x:a.left+l.scrollLeft-c.x-u.x,y:a.top+l.scrollTop-c.y-u.y,width:a.width,height:a.height}}function at(t){return"static"===U(t).position}function lt(t,e){if(!P(t)||"fixed"===U(t).position)return null;if(e)return e(t);let n=t.offsetParent;return L(t)===n&&(n=n.ownerDocument.body),n}function ct(t,e){const n=F(t);if(j(t))return n;if(!P(t)){let e=W(t);for(;e&&!q(e);){if(O(e)&&!at(e))return e;e=W(e)}return n}let i=lt(t,e);for(;i&&M(i)&&at(i);)i=lt(i,e);return i&&q(i)&&at(i)&&!I(i)?n:i||function(t){let e=W(t);for(;P(e)&&!q(e);){if(I(e))return e;if(j(e))return null;e=W(e)}return null}(t)||n}const ft={convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{elements:e,rect:n,offsetParent:i,strategy:o}=t;const s="fixed"===o,a=L(i),l=!!e&&j(e.floating);if(i===a||l&&s)return n;let c={scrollLeft:0,scrollTop:0},f=r(1);const u=r(0),d=P(i);if((d||!d&&!s)&&(("body"!==R(i)||E(a))&&(c=V(i)),d)){const t=et(i);f=Q(i),u.x=t.x+i.clientLeft,u.y=t.y+i.clientTop}const h=!a||d||s?r(0):it(a,c);return{width:n.width*f.x,height:n.height*f.y,x:n.x*f.x-c.scrollLeft*f.x+u.x+h.x,y:n.y*f.y-c.scrollTop*f.y+u.y+h.y}},getDocumentElement:L,getClippingRect:function(t){let{element:e,boundary:o,rootBoundary:r,strategy:s}=t;const a=[..."clippingAncestors"===o?j(e)?[]:function(t,e){const n=e.get(t);if(n)return n;let i=Y(t,[]).filter((t=>O(t)&&"body"!==R(t))),o=null;const r="fixed"===U(t).position;let s=r?W(t):t;for(;O(s)&&!q(s);){const e=U(s),n=I(s);n||"fixed"!==e.position||(o=null),(r?!n&&!o:!n&&"static"===e.position&&o&&("absolute"===o.position||"fixed"===o.position)||E(s)&&!n&&rt(t,s))?i=i.filter((t=>t!==s)):o=e,s=W(s)}return e.set(t,i),i}(e,this._c):[].concat(o),r],l=ot(e,a[0],s);let c=l.top,f=l.right,u=l.bottom,d=l.left;for(let t=1;t<a.length;t++){const o=ot(e,a[t],s);c=i(o.top,c),f=n(o.right,f),u=n(o.bottom,u),d=i(o.left,d)}return{width:f-d,height:u-c,x:d,y:c}},getOffsetParent:ct,getElementRects:async function(t){const e=this.getOffsetParent||ct,n=this.getDimensions,i=await n(t.floating);return{reference:st(t.reference,await e(t.floating),t.strategy),floating:{x:0,y:0,width:i.width,height:i.height}}},getClientRects:function(t){return Array.from(t.getClientRects())},getDimensions:function(t){const{width:e,height:n}=J(t);return{width:e,height:n}},getScale:Q,isElement:O,isRTL:function(t){return"rtl"===U(t).direction}},ut=function(t){return void 0===t&&(t={}),{name:"shift",options:t,async fn(e){const{x:n,y:i,placement:o,platform:r}=e,{mainAxis:s=!0,crossAxis:f=!1,limiter:d={fn:t=>{let{x:e,y:n}=t;return{x:e,y:n}}},...p}=l(t,e),m={x:n,y:i},y=await r.detectOverflow(e,p),g=h(c(o)),x=u(g);let w=m[x],b=m[g];s&&(w=a(w+y["y"===x?"top":"left"],w,w-y["y"===x?"bottom":"right"])),f&&(b=a(b+y["y"===g?"top":"left"],b,b-y["y"===g?"bottom":"right"]));const v=d.fn({...e,[x]:w,[g]:b});return{...v,data:{x:v.x-n,y:v.y-i,enabled:{[x]:s,[g]:f}}}}}},dt=function(t){return void 0===t&&(t={}),{name:"flip",options:t,async fn(e){var n,i;const{placement:o,middlewareData:r,rects:s,initialPlacement:a,platform:u,elements:v}=e,{mainAxis:k=!0,crossAxis:A=!0,fallbackPlacements:S,fallbackStrategy:C="bestFit",fallbackAxisSideDirection:D="none",flipAlignment:R=!0,...F}=l(t,e);if(null!=(n=r.arrow)&&n.alignmentOffset)return{};const L=c(o),$=h(a),O=c(a)===a,P=await(null==u.isRTL?void 0:u.isRTL(v.floating)),T=S||(O||!R?[b(a)]:function(t){const e=b(t);return[m(t),e,m(e)]}(a)),E="none"!==D;!S&&E&&T.push(...function(t,e,n,i){const o=f(t);let r=function(t,e,n){switch(t){case"top":case"bottom":return n?e?g:y:e?y:g;case"left":case"right":return e?x:w;default:return[]}}(c(t),"start"===n,i);return o&&(r=r.map((t=>t+"-"+o)),e&&(r=r.concat(r.map(m)))),r}(a,R,D,P));const M=[a,...T],j=await u.detectOverflow(e,F),B=[];let _=(null==(i=r.flip)?void 0:i.overflows)||[];if(k&&B.push(j[L]),A){const t=function(t,e,n){void 0===n&&(n=!1);const i=f(t),o=p(t),r=d(o);let s="x"===o?i===(n?"end":"start")?"right":"left":"start"===i?"bottom":"top";return e.reference[r]>e.floating[r]&&(s=b(s)),[s,b(s)]}(o,s,P);B.push(j[t[0]],j[t[1]])}if(_=[..._,{placement:o,overflows:B}],!B.every((t=>t<=0))){var z,H;const t=((null==(z=r.flip)?void 0:z.index)||0)+1,e=M[t];if(e&&("alignment"!==A||$===h(e)||_.every((t=>h(t.placement)!==$||t.overflows[0]>0))))return{data:{index:t,overflows:_},reset:{placement:e}};let n=null==(H=_.filter((t=>t.overflows[0]<=0)).sort(((t,e)=>t.overflows[1]-e.overflows[1]))[0])?void 0:H.placement;if(!n)switch(C){case"bestFit":{var I;const t=null==(I=_.filter((t=>{if(E){const e=h(t.placement);return e===$||"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:I[0];t&&(n=t);break}case"initialPlacement":n=a}if(o!==n)return{reset:{placement:n}}}return{}}}},ht=t=>({name:"arrow",options:t,async fn(e){const{x:i,y:o,placement:r,rects:s,platform:c,elements:u,middlewareData:h}=e,{element:m,padding:y=0}=l(t,e)||{};if(null==m)return{};const g=v(y),x={x:i,y:o},w=p(r),b=d(w),k=await c.getDimensions(m),A="y"===w,S=A?"top":"left",C=A?"bottom":"right",D=A?"clientHeight":"clientWidth",R=s.reference[b]+s.reference[w]-x[w]-s.floating[b],F=x[w]-s.reference[w],L=await(null==c.getOffsetParent?void 0:c.getOffsetParent(m));let $=L?L[D]:0;$&&await(null==c.isElement?void 0:c.isElement(L))||($=u.floating[D]||s.floating[b]);const O=R/2-F/2,P=$/2-k[b]/2-1,T=n(g[S],P),E=n(g[C],P),M=T,j=$-k[b]-E,B=$/2-k[b]/2+O,_=a(M,B,j),z=!h.arrow&&null!=f(r)&&B!==_&&s.reference[b]/2-(B<M?T:E)-k[b]/2<0,H=z?B<M?B-M:B-j:0;return{[w]:x[w]+H,data:{[w]:_,centerOffset:B-_-H,...z&&{alignmentOffset:H}},reset:z}}}),pt="Checking...",mt=class{constructor(e){t(this,e),this.vin=void 0,this.snapshot=void 0,this.label=pt,this.failed=!0,this.loaded=!1,this.time=void 0,this.eventBus=window.eventBus,this.message=void 0,this.nanoId=((t=21)=>{let e="",n=crypto.getRandomValues(new Uint8Array(t|=0));for(;t--;)e+="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict"[63&n[t]];return e})(),this.messageHandler=t=>{const{origin:e,data:n}=t,{targetId:i}=n;if(console.log("-- messageHandler:",n,e),"http://localhost:3000"===e&&i===this.nanoId)if(void 0===this.message){if(n.type&&"resize-iframe"===n.type){this.iframe.style.width=n.payload.width+"px",this.iframe.style.height=n.payload.height+"px",this.iframe.style.display="block",this.loaded=!0,this.label="",this.message=n;const{vin:t,snapshot:e}=this;this.iframe&&this.iframe.contentWindow.postMessage({targetId:this.nanoId,type:"data-payload",payload:{vin:t,snapshot:e}},"*"),this.update()}}else this.hideTooltip()},this.register=()=>{this.eventBus.emit("activate",this.nanoId),window.addEventListener("message",this.messageHandler,!1)},this.unregister=()=>{window.removeEventListener("message",this.messageHandler)},this.update=()=>{const{target:t,tooltip:e,arrowEl:n}=this;var i;((t,e,n)=>{const i=new Map,o={platform:ft,...n},r={...o.platform,_c:i};return(async(t,e,n)=>{const{placement:i="bottom",strategy:o="absolute",middleware:r=[],platform:s}=n,a=s.detectOverflow?s:{...s,detectOverflow:S},l=await(null==s.isRTL?void 0:s.isRTL(e));let c=await s.getElementRects({reference:t,floating:e,strategy:o}),{x:f,y:u}=A(c,i,l),d=i,h=0;const p={};for(let n=0;n<r.length;n++){const m=r[n];if(!m)continue;const{name:y,fn:g}=m,{x,y:w,data:b,reset:v}=await g({x:f,y:u,initialPlacement:i,placement:d,strategy:o,middlewareData:p,rects:c,platform:a,elements:{reference:t,floating:e}});f=null!=x?x:f,u=null!=w?w:u,p[y]={...p[y],...b},v&&h<50&&(h++,"object"==typeof v&&(v.placement&&(d=v.placement),v.rects&&(c=!0===v.rects?await s.getElementRects({reference:t,floating:e,strategy:o}):v.rects),({x:f,y:u}=A(c,d,l))),n=-1)}return{x:f,y:u,placement:d,strategy:o,middlewareData:p}})(t,e,{...o,platform:r})})(t,e,{placement:"right",middleware:[(i=6,void 0===i&&(i=0),{name:"offset",options:i,async fn(t){var e,n;const{x:o,y:r,placement:s,middlewareData:a}=t,u=await async function(t,e){const{placement:n,platform:i,elements:o}=t,r=await(null==i.isRTL?void 0:i.isRTL(o.floating)),s=c(n),a=f(n),u="y"===h(n),d=C.has(s)?-1:1,p=r&&u?-1:1,m=l(e,t);let{mainAxis:y,crossAxis:g,alignmentAxis:x}="number"==typeof m?{mainAxis:m,crossAxis:0,alignmentAxis:null}:{mainAxis:m.mainAxis||0,crossAxis:m.crossAxis||0,alignmentAxis:m.alignmentAxis};return a&&"number"==typeof x&&(g="end"===a?-1*x:x),u?{x:g*p,y:y*d}:{x:y*d,y:g*p}}(t,i);return s===(null==(e=a.offset)?void 0:e.placement)&&null!=(n=a.arrow)&&n.alignmentOffset?{}:{x:o+u.x,y:r+u.y,data:{...u,placement:s}}}}),dt(),ut({padding:5}),ht({element:n})]}).then((({x:t,y:i,placement:o,middlewareData:r})=>{Object.assign(e.style,{left:`${t}px`,top:`${i}px`});const{x:s,y:a}=r.arrow,l={top:"bottom",right:"left",bottom:"top",left:"right"}[o.split("-")[0]];Object.assign(n.style,{left:null!=s?`${s}px`:"",top:null!=a?`${a}px`:"",right:"",bottom:"",[l]:"-4px"})}))},this.onIframeLoad=()=>{this.update(),setTimeout((()=>{this.loaded||(this.label="Content Failed to Load...")}),3e3)},this.hideTooltip=()=>{this.iframe.style.display="",this.tooltip.style.display="",this.message=void 0,this.unregister()},this.showTooltip=()=>{this.register(),this.loaded=!1,this.label=pt,this.loaded=!1,this.time=Date.now(),this.tooltip.style.display="block",this.update()},this.clickHandler=()=>{"block"===this.tooltip.style.display?this.hideTooltip():this.showTooltip()}}componentDidLoad(){this.eventBus.on("activate",(t=>{this.nanoId!==t&&(void 0!==this.message||"block"===this.tooltip.style.display)&&this.hideTooltip()})),this.update()}render(){const t=`http://localhost:3000/demo_iframe.html?q=${this.time}&nid=${this.nanoId}`;return e("div",{key:"1da684903d9253b204641b4184bc5e1f79326405",id:"root"},e("div",{key:"84665f15de5991870ad2a16f42f1984789f4631f",id:"target",ref:t=>this.target=t,onClick:()=>this.clickHandler()},"i"),e("div",{key:"178c42dc946b455c8873e06d481a93d095a2e752",id:"tooltip",role:"tooltip",ref:t=>this.tooltip=t},e("div",{key:"75921e81ce12a64df3500d1492b6d782ff2881e3"},this.label),this.time?e("iframe",{id:"content",src:t,ref:t=>this.iframe=t,onLoad:t=>this.onIframeLoad(t)}):"",e("div",{key:"99722c505d254559b6a89a3d173c0925b12e53be",id:"arrow",ref:t=>this.arrowEl=t})))}};mt.style="#root{--clrs-navy:#001f3f;--clrs-blue:#0074d9;--clrs-aqua:#7fdbff;--clrs-teal:#39cccc;--clrs-olive:#3d9970;--clrs-green:#2ecc40;--clrs-lime:#01ff70;--clrs-yellow:#ffdc00;--clrs-orange:#ff851b;--clrs-red:#ff4136;--clrs-maroon:#85144b;--clrs-fuchsia:#f012be;--clrs-purple:#b10dc9;--clrs-black:#111111;--clrs-gray:#aaaaaa;--clrs-silver:#dddddd;--clrs-bada55:#bada55;--clrs-slate:#708090;--clrs-slate4:#4e5964;--clrs-white:#ffffff}#target{width:24px;height:24px;line-height:24px;text-align:center;border-radius:12px;background:var(--clrs-blue);font-weight:bold;font-size:120%;color:var(--clrs-white);cursor:pointer}#tooltip{display:none;position:absolute;min-height:18px;background:var(--clrs-navy);color:var(--clrs-white);font-weight:bold;padding:5px;padding-right:10px;padding-left:10px;border-radius:4px;font-size:90%;pointer-events:none}#arrow{position:absolute;background:var(--clrs-navy);width:8px;height:8px;transform:rotate(45deg)}#content{display:none;border:none}";export{mt as proto_floater_demo}

package/dist/proto-float-wc/proto-float-wc.esm.js

@@ -1 +1 @@
-import{p as e,b as o}from"./p-CeIUpiSD.js";export{s as setNonce}from"./p-CeIUpiSD.js";import{g as a}from"./p-DQuL1Twl.js";(()=>{const o=import.meta.url,a={};return""!==o&&(a.resourcesUrl=new URL(".",o).href),e(a)})().then((async e=>(await a(),o([["p-7ec465e5",[[1,"proto-floater-demo",{vin:[1],snapshot:[1],label:[32],failed:[32],loaded:[32],time:[32]}]]]],e))));
+import{p as e,b as o}from"./p-CeIUpiSD.js";export{s as setNonce}from"./p-CeIUpiSD.js";import{g as a}from"./p-DQuL1Twl.js";(()=>{const o=import.meta.url,a={};return""!==o&&(a.resourcesUrl=new URL(".",o).href),e(a)})().then((async e=>(await a(),o([["p-7796fd9e",[[1,"proto-floater-demo",{vin:[1],snapshot:[1],label:[32],failed:[32],loaded:[32],time:[32]}]]]],e))));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "proto-float-wc",
-  "version": "0.1.93",
+  "version": "0.1.94",
   "description": "Stencil Component Starter",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -15,7 +15,7 @@
     "loader/"
   ],
   "dependencies": {
-    "@floating-ui/dom": "1.7.5",
+    "@floating-ui/dom": "1.7.6",
     "@stencil/core": "4.43.2",
     "nanoid": "5.1.6"
   },

package/dist/proto-float-wc/p-7ec465e5.entry.js

@@ -1 +0,0 @@
-import{r as t,h as e}from"./p-CeIUpiSD.js";const n=Math.min,o=Math.max,i=Math.round,r=t=>({x:t,y:t}),s={left:"right",right:"left",bottom:"top",top:"bottom"},a={start:"end",end:"start"};function l(t,e,i){return o(t,n(e,i))}function c(t,e){return"function"==typeof t?t(e):t}function f(t){return t.split("-")[0]}function u(t){return t.split("-")[1]}function d(t){return"x"===t?"y":"x"}function h(t){return"y"===t?"height":"width"}const p=new Set(["top","bottom"]);function m(t){return p.has(f(t))?"y":"x"}function y(t){return d(m(t))}function g(t){return t.replace(/start|end/g,(t=>a[t]))}const w=["left","right"],x=["right","left"],b=["top","bottom"],v=["bottom","top"];function k(t){return t.replace(/left|right|bottom|top/g,(t=>s[t]))}function S(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){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 C(t,e,n){let{reference:o,floating:i}=t;const r=m(e),s=y(e),a=h(s),l=f(e),c="y"===r,d=o.x+o.width/2-i.width/2,p=o.y+o.height/2-i.height/2,g=o[a]/2-i[a]/2;let w;switch(l){case"top":w={x:d,y:o.y-i.height};break;case"bottom":w={x:d,y:o.y+o.height};break;case"right":w={x:o.x+o.width,y:p};break;case"left":w={x:o.x-i.width,y:p};break;default:w={x:o.x,y:o.y}}switch(u(e)){case"start":w[s]-=g*(n&&c?-1:1);break;case"end":w[s]+=g*(n&&c?-1:1)}return w}async function D(t,e){var n;void 0===e&&(e={});const{x:o,y:i,platform:r,rects:s,elements:a,strategy:l}=t,{boundary:f="clippingAncestors",rootBoundary:u="viewport",elementContext:d="floating",altBoundary:h=!1,padding:p=0}=c(e,t),m=S(p),y=a[h?"floating"===d?"reference":"floating":d],g=A(await r.getClippingRect({element:null==(n=await(null==r.isElement?void 0:r.isElement(y)))||n?y:y.contextElement||await(null==r.getDocumentElement?void 0:r.getDocumentElement(a.floating)),boundary:f,rootBoundary:u,strategy:l})),w="floating"===d?{x:o,y:i,width:s.floating.width,height:s.floating.height}:s.reference,x=await(null==r.getOffsetParent?void 0:r.getOffsetParent(a.floating)),b=await(null==r.isElement?void 0:r.isElement(x))&&await(null==r.getScale?void 0:r.getScale(x))||{x:1,y:1},v=A(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({elements:a,rect:w,offsetParent:x,strategy:l}):w);return{top:(g.top-v.top+m.top)/b.y,bottom:(v.bottom-g.bottom+m.bottom)/b.y,left:(g.left-v.left+m.left)/b.x,right:(v.right-g.right+m.right)/b.x}}const R=new Set(["left","top"]);function F(){return"undefined"!=typeof window}function L(t){return T(t)?(t.nodeName||"").toLowerCase():"#document"}function O(t){var e;return(null==t||null==(e=t.ownerDocument)?void 0:e.defaultView)||window}function P(t){var e;return null==(e=(T(t)?t.ownerDocument:t.document)||window.document)?void 0:e.documentElement}function T(t){return!!F()&&(t instanceof Node||t instanceof O(t).Node)}function $(t){return!!F()&&(t instanceof Element||t instanceof O(t).Element)}function E(t){return!!F()&&(t instanceof HTMLElement||t instanceof O(t).HTMLElement)}function M(t){return!(!F()||"undefined"==typeof ShadowRoot)&&(t instanceof ShadowRoot||t instanceof O(t).ShadowRoot)}const j=new Set(["inline","contents"]);function B(t){const{overflow:e,overflowX:n,overflowY:o,display:i}=G(t);return/auto|scroll|overlay|hidden|clip/.test(e+o+n)&&!j.has(i)}const _=new Set(["table","td","th"]);function z(t){return _.has(L(t))}const H=[":popover-open",":modal"];function I(t){return H.some((e=>{try{return t.matches(e)}catch(t){return!1}}))}const N=["transform","translate","scale","rotate","perspective"],q=["transform","translate","scale","rotate","perspective","filter"],U=["paint","layout","strict","content"];function V(t){const e=W(),n=$(t)?G(t):t;return N.some((t=>!!n[t]&&"none"!==n[t]))||!!n.containerType&&"normal"!==n.containerType||!e&&!!n.backdropFilter&&"none"!==n.backdropFilter||!e&&!!n.filter&&"none"!==n.filter||q.some((t=>(n.willChange||"").includes(t)))||U.some((t=>(n.contain||"").includes(t)))}function W(){return!("undefined"==typeof CSS||!CSS.supports)&&CSS.supports("-webkit-backdrop-filter","none")}const X=new Set(["html","body","#document"]);function Y(t){return X.has(L(t))}function G(t){return O(t).getComputedStyle(t)}function J(t){return $(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.scrollX,scrollTop:t.scrollY}}function K(t){if("html"===L(t))return t;const e=t.assignedSlot||t.parentNode||M(t)&&t.host||P(t);return M(e)?e.host:e}function Q(t){const e=K(t);return Y(e)?t.ownerDocument?t.ownerDocument.body:t.body:E(e)&&B(e)?e:Q(e)}function Z(t,e){var n;void 0===e&&(e=[]);const o=Q(t),i=o===(null==(n=t.ownerDocument)?void 0:n.body),r=O(o);return i?e.concat(r,r.visualViewport||[],B(o)?o:[],[]):e.concat(o,Z(o,[]))}function tt(t){return t.parent&&Object.getPrototypeOf(t.parent)?t.frameElement:null}function et(t){const e=G(t);let n=parseFloat(e.width)||0,o=parseFloat(e.height)||0;const r=E(t),s=r?t.offsetWidth:n,a=r?t.offsetHeight:o,l=i(n)!==s||i(o)!==a;return l&&(n=s,o=a),{width:n,height:o,$:l}}function nt(t){return $(t)?t:t.contextElement}function ot(t){const e=nt(t);if(!E(e))return r(1);const n=e.getBoundingClientRect(),{width:o,height:s,$:a}=et(e);let l=(a?i(n.width):n.width)/o,c=(a?i(n.height):n.height)/s;return l&&Number.isFinite(l)||(l=1),c&&Number.isFinite(c)||(c=1),{x:l,y:c}}const it=r(0);function rt(t){const e=O(t);return W()&&e.visualViewport?{x:e.visualViewport.offsetLeft,y:e.visualViewport.offsetTop}:it}function st(t,e,n,o){void 0===e&&(e=!1),void 0===n&&(n=!1);const i=t.getBoundingClientRect(),s=nt(t);let a=r(1);e&&(o?$(o)&&(a=ot(o)):a=ot(t));const l=function(t,e,n){return void 0===e&&(e=!1),!(!n||e&&n!==O(t))&&e}(s,n,o)?rt(s):r(0);let c=(i.left+l.x)/a.x,f=(i.top+l.y)/a.y,u=i.width/a.x,d=i.height/a.y;if(s){const t=O(s),e=o&&$(o)?O(o):o;let n=t,i=tt(n);for(;i&&o&&e!==n;){const t=ot(i),e=i.getBoundingClientRect(),o=G(i),r=e.left+(i.clientLeft+parseFloat(o.paddingLeft))*t.x,s=e.top+(i.clientTop+parseFloat(o.paddingTop))*t.y;c*=t.x,f*=t.y,u*=t.x,d*=t.y,c+=r,f+=s,n=O(i),i=tt(n)}}return A({width:u,height:d,x:c,y:f})}function at(t,e){const n=J(t).scrollLeft;return e?e.left+n:st(P(t)).left+n}function lt(t,e){const n=t.getBoundingClientRect();return{x:n.left+e.scrollLeft-at(t,n),y:n.top+e.scrollTop}}const ct=new Set(["absolute","fixed"]);function ft(t,e,n){let i;if("viewport"===e)i=function(t,e){const n=O(t),o=P(t),i=n.visualViewport;let r=o.clientWidth,s=o.clientHeight,a=0,l=0;if(i){r=i.width,s=i.height;const t=W();(!t||t&&"fixed"===e)&&(a=i.offsetLeft,l=i.offsetTop)}const c=at(o);if(c<=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 c<=25&&(r+=c);return{width:r,height:s,x:a,y:l}}(t,n);else if("document"===e)i=function(t){const e=P(t),n=J(t),i=t.ownerDocument.body,r=o(e.scrollWidth,e.clientWidth,i.scrollWidth,i.clientWidth),s=o(e.scrollHeight,e.clientHeight,i.scrollHeight,i.clientHeight);let a=-n.scrollLeft+at(t);const l=-n.scrollTop;return"rtl"===G(i).direction&&(a+=o(e.clientWidth,i.clientWidth)-r),{width:r,height:s,x:a,y:l}}(P(t));else if($(e))i=function(t,e){const n=st(t,!0,"fixed"===e),o=n.top+t.clientTop,i=n.left+t.clientLeft,s=E(t)?ot(t):r(1);return{width:t.clientWidth*s.x,height:t.clientHeight*s.y,x:i*s.x,y:o*s.y}}(e,n);else{const n=rt(t);i={x:e.x-n.x,y:e.y-n.y,width:e.width,height:e.height}}return A(i)}function ut(t,e){const n=K(t);return!(n===e||!$(n)||Y(n))&&("fixed"===G(n).position||ut(n,e))}function dt(t,e,n){const o=E(e),i=P(e),s="fixed"===n,a=st(t,!0,s,e);let l={scrollLeft:0,scrollTop:0};const c=r(0);function f(){c.x=at(i)}if(o||!o&&!s)if(("body"!==L(e)||B(i))&&(l=J(e)),o){const t=st(e,!0,s,e);c.x=t.x+e.clientLeft,c.y=t.y+e.clientTop}else i&&f();s&&!o&&i&&f();const u=!i||o||s?r(0):lt(i,l);return{x:a.left+l.scrollLeft-c.x-u.x,y:a.top+l.scrollTop-c.y-u.y,width:a.width,height:a.height}}function ht(t){return"static"===G(t).position}function pt(t,e){if(!E(t)||"fixed"===G(t).position)return null;if(e)return e(t);let n=t.offsetParent;return P(t)===n&&(n=n.ownerDocument.body),n}function mt(t,e){const n=O(t);if(I(t))return n;if(!E(t)){let e=K(t);for(;e&&!Y(e);){if($(e)&&!ht(e))return e;e=K(e)}return n}let o=pt(t,e);for(;o&&z(o)&&ht(o);)o=pt(o,e);return o&&Y(o)&&ht(o)&&!V(o)?n:o||function(t){let e=K(t);for(;E(e)&&!Y(e);){if(V(e))return e;if(I(e))return null;e=K(e)}return null}(t)||n}const yt={convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{elements:e,rect:n,offsetParent:o,strategy:i}=t;const s="fixed"===i,a=P(o),l=!!e&&I(e.floating);if(o===a||l&&s)return n;let c={scrollLeft:0,scrollTop:0},f=r(1);const u=r(0),d=E(o);if((d||!d&&!s)&&(("body"!==L(o)||B(a))&&(c=J(o)),E(o))){const t=st(o);f=ot(o),u.x=t.x+o.clientLeft,u.y=t.y+o.clientTop}const h=!a||d||s?r(0):lt(a,c);return{width:n.width*f.x,height:n.height*f.y,x:n.x*f.x-c.scrollLeft*f.x+u.x+h.x,y:n.y*f.y-c.scrollTop*f.y+u.y+h.y}},getDocumentElement:P,getClippingRect:function(t){let{element:e,boundary:i,rootBoundary:r,strategy:s}=t;const a=[..."clippingAncestors"===i?I(e)?[]:function(t,e){const n=e.get(t);if(n)return n;let o=Z(t,[]).filter((t=>$(t)&&"body"!==L(t))),i=null;const r="fixed"===G(t).position;let s=r?K(t):t;for(;$(s)&&!Y(s);){const e=G(s),n=V(s);n||"fixed"!==e.position||(i=null),(r?!n&&!i:!n&&"static"===e.position&&i&&ct.has(i.position)||B(s)&&!n&&ut(t,s))?o=o.filter((t=>t!==s)):i=e,s=K(s)}return e.set(t,o),o}(e,this._c):[].concat(i),r],l=a.reduce(((t,i)=>{const r=ft(e,i,s);return t.top=o(r.top,t.top),t.right=n(r.right,t.right),t.bottom=n(r.bottom,t.bottom),t.left=o(r.left,t.left),t}),ft(e,a[0],s));return{width:l.right-l.left,height:l.bottom-l.top,x:l.left,y:l.top}},getOffsetParent:mt,getElementRects:async function(t){const e=this.getOffsetParent||mt,n=this.getDimensions,o=await n(t.floating);return{reference:dt(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}=et(t);return{width:e,height:n}},getScale:ot,isElement:$,isRTL:function(t){return"rtl"===G(t).direction}},gt=function(t){return void 0===t&&(t={}),{name:"shift",options:t,async fn(e){const{x:n,y:o,placement:i,platform:r}=e,{mainAxis:s=!0,crossAxis:a=!1,limiter:u={fn:t=>{let{x:e,y:n}=t;return{x:e,y:n}}},...h}=c(t,e),p={x:n,y:o},y=await r.detectOverflow(e,h),g=m(f(i)),w=d(g);let x=p[w],b=p[g];s&&(x=l(x+y["y"===w?"top":"left"],x,x-y["y"===w?"bottom":"right"])),a&&(b=l(b+y["y"===g?"top":"left"],b,b-y["y"===g?"bottom":"right"]));const v=u.fn({...e,[w]:x,[g]:b});return{...v,data:{x:v.x-n,y:v.y-o,enabled:{[w]:s,[g]:a}}}}}},wt=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:a,platform:l,elements:d}=e,{mainAxis:p=!0,crossAxis:S=!0,fallbackPlacements:A,fallbackStrategy:C="bestFit",fallbackAxisSideDirection:D="none",flipAlignment:R=!0,...F}=c(t,e);if(null!=(n=r.arrow)&&n.alignmentOffset)return{};const L=f(i),O=m(a),P=f(a)===a,T=await(null==l.isRTL?void 0:l.isRTL(d.floating)),$=A||(P||!R?[k(a)]:function(t){const e=k(t);return[g(t),e,g(e)]}(a)),E="none"!==D;!A&&E&&$.push(...function(t,e,n,o){const i=u(t);let r=function(t,e,n){switch(t){case"top":case"bottom":return n?e?x:w:e?w:x;case"left":case"right":return e?b:v;default:return[]}}(f(t),"start"===n,o);return i&&(r=r.map((t=>t+"-"+i)),e&&(r=r.concat(r.map(g)))),r}(a,R,D,T));const M=[a,...$],j=await l.detectOverflow(e,F),B=[];let _=(null==(o=r.flip)?void 0:o.overflows)||[];if(p&&B.push(j[L]),S){const t=function(t,e,n){void 0===n&&(n=!1);const o=u(t),i=y(t),r=h(i);let s="x"===i?o===(n?"end":"start")?"right":"left":"start"===o?"bottom":"top";return e.reference[r]>e.floating[r]&&(s=k(s)),[s,k(s)]}(i,s,T);B.push(j[t[0]],j[t[1]])}if(_=[..._,{placement:i,overflows:B}],!B.every((t=>t<=0))){var z,H;const t=((null==(z=r.flip)?void 0:z.index)||0)+1,e=M[t];if(e&&("alignment"!==S||O===m(e)||_.every((t=>m(t.placement)!==O||t.overflows[0]>0))))return{data:{index:t,overflows:_},reset:{placement:e}};let n=null==(H=_.filter((t=>t.overflows[0]<=0)).sort(((t,e)=>t.overflows[1]-e.overflows[1]))[0])?void 0:H.placement;if(!n)switch(C){case"bestFit":{var I;const t=null==(I=_.filter((t=>{if(E){const e=m(t.placement);return e===O||"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:I[0];t&&(n=t);break}case"initialPlacement":n=a}if(i!==n)return{reset:{placement:n}}}return{}}}},xt=t=>({name:"arrow",options:t,async fn(e){const{x:o,y:i,placement:r,rects:s,platform:a,elements:f,middlewareData:d}=e,{element:p,padding:m=0}=c(t,e)||{};if(null==p)return{};const g=S(m),w={x:o,y:i},x=y(r),b=h(x),v=await a.getDimensions(p),k="y"===x,A=k?"top":"left",C=k?"bottom":"right",D=k?"clientHeight":"clientWidth",R=s.reference[b]+s.reference[x]-w[x]-s.floating[b],F=w[x]-s.reference[x],L=await(null==a.getOffsetParent?void 0:a.getOffsetParent(p));let O=L?L[D]:0;O&&await(null==a.isElement?void 0:a.isElement(L))||(O=f.floating[D]||s.floating[b]);const P=R/2-F/2,T=O/2-v[b]/2-1,$=n(g[A],T),E=n(g[C],T),M=$,j=O-v[b]-E,B=O/2-v[b]/2+P,_=l(M,B,j),z=!d.arrow&&null!=u(r)&&B!==_&&s.reference[b]/2-(B<M?$:E)-v[b]/2<0,H=z?B<M?B-M:B-j:0;return{[x]:w[x]+H,data:{[x]:_,centerOffset:B-_-H,...z&&{alignmentOffset:H}},reset:z}}}),bt="Checking...",vt=class{constructor(e){t(this,e),this.vin=void 0,this.snapshot=void 0,this.label=bt,this.failed=!0,this.loaded=!1,this.time=void 0,this.eventBus=window.eventBus,this.message=void 0,this.nanoId=((t=21)=>{let e="",n=crypto.getRandomValues(new Uint8Array(t|=0));for(;t--;)e+="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict"[63&n[t]];return e})(),this.messageHandler=t=>{const{origin:e,data:n}=t,{targetId:o}=n;if(console.log("-- messageHandler:",n,e),"http://localhost:3000"===e&&o===this.nanoId)if(void 0===this.message){if(n.type&&"resize-iframe"===n.type){this.iframe.style.width=n.payload.width+"px",this.iframe.style.height=n.payload.height+"px",this.iframe.style.display="block",this.loaded=!0,this.label="",this.message=n;const{vin:t,snapshot:e}=this;this.iframe&&this.iframe.contentWindow.postMessage({targetId:this.nanoId,type:"data-payload",payload:{vin:t,snapshot:e}},"*"),this.update()}}else this.hideTooltip()},this.register=()=>{this.eventBus.emit("activate",this.nanoId),window.addEventListener("message",this.messageHandler,!1)},this.unregister=()=>{window.removeEventListener("message",this.messageHandler)},this.update=()=>{const{target:t,tooltip:e,arrowEl:n}=this;var o;((t,e,n)=>{const o=new Map,i={platform:yt,...n},r={...i.platform,_c:o};return(async(t,e,n)=>{const{placement:o="bottom",strategy:i="absolute",middleware:r=[],platform:s}=n,a=r.filter(Boolean),l=await(null==s.isRTL?void 0:s.isRTL(e));let c=await s.getElementRects({reference:t,floating:e,strategy:i}),{x:f,y:u}=C(c,o,l),d=o,h={},p=0;for(let n=0;n<a.length;n++){var m;const{name:r,fn:y}=a[n],{x:g,y:w,data:x,reset:b}=await y({x:f,y:u,initialPlacement:o,placement:d,strategy:i,middlewareData:h,rects:c,platform:{...s,detectOverflow:null!=(m=s.detectOverflow)?m:D},elements:{reference:t,floating:e}});f=null!=g?g:f,u=null!=w?w:u,h={...h,[r]:{...h[r],...x}},b&&p<=50&&(p++,"object"==typeof b&&(b.placement&&(d=b.placement),b.rects&&(c=!0===b.rects?await s.getElementRects({reference:t,floating:e,strategy:i}):b.rects),({x:f,y:u}=C(c,d,l))),n=-1)}return{x:f,y:u,placement:d,strategy:i,middlewareData:h}})(t,e,{...i,platform:r})})(t,e,{placement:"right",middleware:[(o=6,void 0===o&&(o=0),{name:"offset",options:o,async fn(t){var e,n;const{x:i,y:r,placement:s,middlewareData:a}=t,l=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=f(n),a=u(n),l="y"===m(n),d=R.has(s)?-1:1,h=r&&l?-1:1,p=c(e,t);let{mainAxis:y,crossAxis:g,alignmentAxis:w}="number"==typeof p?{mainAxis:p,crossAxis:0,alignmentAxis:null}:{mainAxis:p.mainAxis||0,crossAxis:p.crossAxis||0,alignmentAxis:p.alignmentAxis};return a&&"number"==typeof w&&(g="end"===a?-1*w:w),l?{x:g*h,y:y*d}:{x:y*d,y:g*h}}(t,o);return s===(null==(e=a.offset)?void 0:e.placement)&&null!=(n=a.arrow)&&n.alignmentOffset?{}:{x:i+l.x,y:r+l.y,data:{...l,placement:s}}}}),wt(),gt({padding:5}),xt({element:n})]}).then((({x:t,y:o,placement:i,middlewareData:r})=>{Object.assign(e.style,{left:`${t}px`,top:`${o}px`});const{x:s,y:a}=r.arrow,l={top:"bottom",right:"left",bottom:"top",left:"right"}[i.split("-")[0]];Object.assign(n.style,{left:null!=s?`${s}px`:"",top:null!=a?`${a}px`:"",right:"",bottom:"",[l]:"-4px"})}))},this.onIframeLoad=()=>{this.update(),setTimeout((()=>{this.loaded||(this.label="Content Failed to Load...")}),3e3)},this.hideTooltip=()=>{this.iframe.style.display="",this.tooltip.style.display="",this.message=void 0,this.unregister()},this.showTooltip=()=>{this.register(),this.loaded=!1,this.label=bt,this.loaded=!1,this.time=Date.now(),this.tooltip.style.display="block",this.update()},this.clickHandler=()=>{"block"===this.tooltip.style.display?this.hideTooltip():this.showTooltip()}}componentDidLoad(){this.eventBus.on("activate",(t=>{this.nanoId!==t&&(void 0!==this.message||"block"===this.tooltip.style.display)&&this.hideTooltip()})),this.update()}render(){const t=`http://localhost:3000/demo_iframe.html?q=${this.time}&nid=${this.nanoId}`;return e("div",{key:"1da684903d9253b204641b4184bc5e1f79326405",id:"root"},e("div",{key:"84665f15de5991870ad2a16f42f1984789f4631f",id:"target",ref:t=>this.target=t,onClick:()=>this.clickHandler()},"i"),e("div",{key:"178c42dc946b455c8873e06d481a93d095a2e752",id:"tooltip",role:"tooltip",ref:t=>this.tooltip=t},e("div",{key:"75921e81ce12a64df3500d1492b6d782ff2881e3"},this.label),this.time?e("iframe",{id:"content",src:t,ref:t=>this.iframe=t,onLoad:t=>this.onIframeLoad(t)}):"",e("div",{key:"99722c505d254559b6a89a3d173c0925b12e53be",id:"arrow",ref:t=>this.arrowEl=t})))}};vt.style="#root{--clrs-navy:#001f3f;--clrs-blue:#0074d9;--clrs-aqua:#7fdbff;--clrs-teal:#39cccc;--clrs-olive:#3d9970;--clrs-green:#2ecc40;--clrs-lime:#01ff70;--clrs-yellow:#ffdc00;--clrs-orange:#ff851b;--clrs-red:#ff4136;--clrs-maroon:#85144b;--clrs-fuchsia:#f012be;--clrs-purple:#b10dc9;--clrs-black:#111111;--clrs-gray:#aaaaaa;--clrs-silver:#dddddd;--clrs-bada55:#bada55;--clrs-slate:#708090;--clrs-slate4:#4e5964;--clrs-white:#ffffff}#target{width:24px;height:24px;line-height:24px;text-align:center;border-radius:12px;background:var(--clrs-blue);font-weight:bold;font-size:120%;color:var(--clrs-white);cursor:pointer}#tooltip{display:none;position:absolute;min-height:18px;background:var(--clrs-navy);color:var(--clrs-white);font-weight:bold;padding:5px;padding-right:10px;padding-left:10px;border-radius:4px;font-size:90%;pointer-events:none}#arrow{position:absolute;background:var(--clrs-navy);width:8px;height:8px;transform:rotate(45deg)}#content{display:none;border:none}";export{vt as proto_floater_demo}