locize 4.0.11 → 4.0.13

package/dist/umd/locize.js

@@ -14,69 +14,33 @@
     }, _typeof(o);
   }
 
-  function _toPrimitive(input, hint) {
-    if (_typeof(input) !== "object" || input === null) return input;
-    var prim = input[Symbol.toPrimitive];
-    if (prim !== undefined) {
-      var res = prim.call(input, hint || "default");
-      if (_typeof(res) !== "object") return res;
+  function toPrimitive(t, r) {
+    if ("object" != _typeof(t) || !t) return t;
+    var e = t[Symbol.toPrimitive];
+    if (void 0 !== e) {
+      var i = e.call(t, r || "default");
+      if ("object" != _typeof(i)) return i;
       throw new TypeError("@@toPrimitive must return a primitive value.");
     }
-    return (hint === "string" ? String : Number)(input);
+    return ("string" === r ? String : Number)(t);
   }
 
-  function _toPropertyKey(arg) {
-    var key = _toPrimitive(arg, "string");
-    return _typeof(key) === "symbol" ? key : String(key);
+  function toPropertyKey(t) {
+    var i = toPrimitive(t, "string");
+    return "symbol" == _typeof(i) ? i : i + "";
   }
 
-  function _defineProperty(obj, key, value) {
-    key = _toPropertyKey(key);
-    if (key in obj) {
-      Object.defineProperty(obj, key, {
-        value: value,
-        enumerable: true,
-        configurable: true,
-        writable: true
-      });
-    } else {
-      obj[key] = value;
-    }
-    return obj;
-  }
-
-  function _arrayLikeToArray(arr, len) {
-    if (len == null || len > arr.length) len = arr.length;
-    for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
-    return arr2;
-  }
-
-  function _arrayWithoutHoles(arr) {
-    if (Array.isArray(arr)) return _arrayLikeToArray(arr);
-  }
-
-  function _iterableToArray(iter) {
-    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+  function _defineProperty(e, r, t) {
+    return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+      value: t,
+      enumerable: !0,
+      configurable: !0,
+      writable: !0
+    }) : e[r] = t, e;
   }
 
-  function _unsupportedIterableToArray(o, minLen) {
-    if (!o) return;
-    if (typeof o === "string") return _arrayLikeToArray(o, minLen);
-    var n = Object.prototype.toString.call(o).slice(8, -1);
-    if (n === "Object" && o.constructor) n = o.constructor.name;
-    if (n === "Map" || n === "Set") return Array.from(o);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
-  }
-
-  function _nonIterableSpread() {
-    throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-  }
-
-  function _toConsumableArray(arr) {
-    return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
-  }
-
-  var INVISIBLE_CHARACTERS = ["\u200B", "\u200C"];
+  var isBrowser = typeof window !== 'undefined';
+  var INVISIBLE_CHARACTERS = isBrowser ? ["\u200C", "\u200D"] : ["\u200B", "\u200C"];
   var INVISIBLE_REGEX = RegExp("([".concat(INVISIBLE_CHARACTERS.join(''), "]{9})+"), 'gu');
   var TEMPLATE_MINIMUM_LENGTH = '{"k":"a"}'.length;
   var invisibleStartMarker = 'subliminal:start';
@@ -173,7 +137,7 @@
   }
 
   function ownKeys$7(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-  function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+  function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var postProcessorName = 'subliminal';
   var SubliminalPostProcessor = {
     name: postProcessorName,
@@ -299,8 +263,8 @@
     data: data$1
   };
 
-  function _arrayWithHoles(arr) {
-    if (Array.isArray(arr)) return arr;
+  function _arrayWithHoles(r) {
+    if (Array.isArray(r)) return r;
   }
 
   function _iterableToArrayLimit(r, l) {
@@ -331,12 +295,26 @@
     }
   }
 
+  function _arrayLikeToArray(r, a) {
+    (null == a || a > r.length) && (a = r.length);
+    for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
+    return n;
+  }
+
+  function _unsupportedIterableToArray(r, a) {
+    if (r) {
+      if ("string" == typeof r) return _arrayLikeToArray(r, a);
+      var t = {}.toString.call(r).slice(8, -1);
+      return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
+    }
+  }
+
   function _nonIterableRest() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
   }
 
-  function _slicedToArray(arr, i) {
-    return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+  function _slicedToArray(r, e) {
+    return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest();
   }
 
   function debounce(func, wait, immediate) {
@@ -367,12 +345,12 @@
   }
   function parseAttrFromKey(key) {
     var attr = 'text';
-    if (key.indexOf('[') == 0) {
+    if (key.indexOf('[') === 0) {
       var parts = key.split(']');
       key = parts[1];
       attr = parts[0].substr(1, parts[0].length - 1);
     }
-    var newKey = key.indexOf(';') == key.length - 1 ? key.substr(0, key.length - 2) : key;
+    var newKey = key.indexOf(';') === key.length - 1 ? key.substr(0, key.length - 2) : key;
     return [newKey, attr];
   }
   function getI18nMetaFromNode(el) {
@@ -382,7 +360,7 @@
     var allKeys = {};
     if (key && key.indexOf(';') >= 0) {
       var keys = key.split(';');
-      for (var ix = 0, l_ix = keys.length; ix < l_ix; ix++) {
+      for (var ix = 0, lix = keys.length; ix < lix; ix++) {
         if (keys[ix] != '') {
           var _parseAttrFromKey = parseAttrFromKey(keys[ix]),
             _parseAttrFromKey2 = _slicedToArray(_parseAttrFromKey, 2),
@@ -449,6 +427,11 @@
     if (!results[2]) return '';
     return decodeURIComponent(results[2].replace(/\+/g, ' '));
   }
+  var _isInIframe = typeof window !== 'undefined';
+  try {
+    _isInIframe = self !== top;
+  } catch (e) {}
+  var isInIframe = _isInIframe;
 
   function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -631,7 +614,9 @@
           }
         });
         children.forEach(function (replaceable) {
-          if (item.node.contains(replaceable.child)) item.node.removeChild(replaceable.child);
+          if (item.node.contains(replaceable.child)) {
+            item.node.removeChild(replaceable.child);
+          }
         });
       }
     }
@@ -658,6 +643,22 @@
   }
   api.addHandler('commitKey', handler$7);
 
+  function _arrayWithoutHoles(r) {
+    if (Array.isArray(r)) return _arrayLikeToArray(r);
+  }
+
+  function _iterableToArray(r) {
+    if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
+  }
+
+  function _nonIterableSpread() {
+    throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+  }
+
+  function _toConsumableArray(r) {
+    return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
+  }
+
   function handler$6(payload) {
     var updated = payload.updated;
     updated.forEach(function (item) {
@@ -889,9 +890,9 @@
     if (containerStyle) {
       var popup = document.getElementById(popupId);
       if (!popup) return;
-      var storedPos = localStorage.getItem('locize_popup_pos');
+      var storedPos = window.localStorage.getItem('locize_popup_pos');
       if (storedPos) storedPos = JSON.parse(storedPos);
-      var storedSize = localStorage.getItem('locize_popup_size');
+      var storedSize = window.localStorage.getItem('locize_popup_size');
       if (storedSize) storedSize = JSON.parse(storedSize);
       if (storedSize && storedSize.height && storedSize.width) {
         containerStyle.height = storedSize.height + 'px';
@@ -907,39 +908,36 @@
         popup.style.setProperty('left', "calc(".concat(popup.style.left, " - ").concat(_diff, ")"));
         popup.style.setProperty('width', containerStyle.width);
       }
-      if (storedPos && storedPos.top && storedPos.top < window.innerHeight - containerStyle.height.replace('px', '')) popup.style.setProperty('top', storedPos.top + 'px');
-      if (storedPos && storedPos.left && storedPos.left < window.innerWidth - containerStyle.width.replace('px', '')) popup.style.setProperty('left', storedPos.left + 'px');
+      if (storedPos && storedPos.top && storedPos.top < window.innerHeight - containerStyle.height.replace('px', '')) {
+        popup.style.setProperty('top', storedPos.top + 'px');
+      }
+      if (storedPos && storedPos.left && storedPos.left < window.innerWidth - containerStyle.width.replace('px', '')) {
+        popup.style.setProperty('left', storedPos.left + 'px');
+      }
     }
   }
   api.addHandler('requestPopupChanges', handler$4);
 
-  function _objectWithoutPropertiesLoose(source, excluded) {
-    if (source == null) return {};
-    var target = {};
-    var sourceKeys = Object.keys(source);
-    var key, i;
-    for (i = 0; i < sourceKeys.length; i++) {
-      key = sourceKeys[i];
-      if (excluded.indexOf(key) >= 0) continue;
-      target[key] = source[key];
+  function _objectWithoutPropertiesLoose(r, e) {
+    if (null == r) return {};
+    var t = {};
+    for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+      if (-1 !== e.indexOf(n)) continue;
+      t[n] = r[n];
     }
-    return target;
+    return t;
   }
 
-  function _objectWithoutProperties(source, excluded) {
-    if (source == null) return {};
-    var target = _objectWithoutPropertiesLoose(source, excluded);
-    var key, i;
+  function _objectWithoutProperties(e, t) {
+    if (null == e) return {};
+    var o,
+      r,
+      i = _objectWithoutPropertiesLoose(e, t);
     if (Object.getOwnPropertySymbols) {
-      var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-      for (i = 0; i < sourceSymbolKeys.length; i++) {
-        key = sourceSymbolKeys[i];
-        if (excluded.indexOf(key) >= 0) continue;
-        if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-        target[key] = source[key];
-      }
+      var n = Object.getOwnPropertySymbols(e);
+      for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
     }
-    return target;
+    return i;
   }
 
   var _excluded$1 = ["lng", "ns"];
@@ -998,7 +996,9 @@
         key: item.key
       }), item.value), uni === null || uni === void 0 ? void 0 : uni.node);
       if (uni && uni.keys) delete uni.keys["".concat(item.textType)];
-      if (uni && uni.keys && !Object.keys(uni.keys).length) uninstrumentedStore.remove(item.eleUniqueID, uni.node);
+      if (uni && uni.keys && !Object.keys(uni.keys).length) {
+        uninstrumentedStore.remove(item.eleUniqueID, uni.node);
+      }
     });
     api.sendCurrentParsedContent();
   }
@@ -1058,6 +1058,14 @@
     return box;
   }
 
+  /**
+   * Custom positioning reference element.
+   * @see https://floating-ui.com/docs/virtual-elements
+   */
+
+  const sides = ['top', 'right', 'bottom', 'left'];
+  const alignments = ['start', 'end'];
+  const placements = /*#__PURE__*/sides.reduce((acc, side) => acc.concat(side, side + "-" + alignments[0], side + "-" + alignments[1]), []);
   const min = Math.min;
   const max = Math.max;
   const round = Math.round;
@@ -1168,12 +1176,21 @@
     };
   }
   function rectToClientRect(rect) {
+    const {
+      x,
+      y,
+      width,
+      height
+    } = rect;
     return {
-      ...rect,
-      top: rect.y,
-      left: rect.x,
-      right: rect.x + rect.width,
-      bottom: rect.y + rect.height
+      width,
+      height,
+      top: y,
+      left: x,
+      right: x + width,
+      bottom: y + height,
+      x,
+      y
     };
   }
 
@@ -1235,7 +1252,7 @@
 
   /**
    * Computes the `x` and `y` coordinates that will place the floating element
-   * next to a reference element when it is given a certain positioning strategy.
+   * next to a given reference element.
    *
    * This export does not have any `platform` interface logic. You will need to
    * write one for the platform you are using Floating UI with.
@@ -1313,7 +1330,6 @@
           } = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
         }
         i = -1;
-        continue;
       }
     }
     return {
@@ -1363,9 +1379,10 @@
       strategy
     }));
     const rect = elementContext === 'floating' ? {
-      ...rects.floating,
       x,
-      y
+      y,
+      width: rects.floating.width,
+      height: rects.floating.height
     } : rects.reference;
     const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
     const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
@@ -1376,6 +1393,7 @@
       y: 1
     };
     const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
+      elements,
       rect,
       offsetParent,
       strategy
@@ -1393,7 +1411,7 @@
    * appears centered to the reference element.
    * @see https://floating-ui.com/docs/arrow
    */
-  const arrow = options => ({
+  const arrow$1 = options => ({
     name: 'arrow',
     options,
     async fn(state) {
@@ -1454,7 +1472,7 @@
       // to point to nothing for an aligned placement, adjust the offset of the
       // floating element itself. To ensure `shift()` continues to take action,
       // a single reset is performed when this is true.
-      const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center != offset && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
+      const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
       const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max : 0;
       return {
         [axis]: coords[axis] + alignmentOffset,
@@ -1470,13 +1488,116 @@
     }
   });
 
+  function getPlacementList(alignment, autoAlignment, allowedPlacements) {
+    const allowedPlacementsSortedByAlignment = alignment ? [...allowedPlacements.filter(placement => getAlignment(placement) === alignment), ...allowedPlacements.filter(placement => getAlignment(placement) !== alignment)] : allowedPlacements.filter(placement => getSide(placement) === placement);
+    return allowedPlacementsSortedByAlignment.filter(placement => {
+      if (alignment) {
+        return getAlignment(placement) === alignment || (autoAlignment ? getOppositeAlignmentPlacement(placement) !== placement : false);
+      }
+      return true;
+    });
+  }
+  /**
+   * Optimizes the visibility of the floating element by choosing the placement
+   * that has the most space available automatically, without needing to specify a
+   * preferred placement. Alternative to `flip`.
+   * @see https://floating-ui.com/docs/autoPlacement
+   */
+  const autoPlacement = function (options) {
+    if (options === void 0) {
+      options = {};
+    }
+    return {
+      name: 'autoPlacement',
+      options,
+      async fn(state) {
+        var _middlewareData$autoP, _middlewareData$autoP2, _placementsThatFitOnE;
+        const {
+          rects,
+          middlewareData,
+          placement,
+          platform,
+          elements
+        } = state;
+        const {
+          crossAxis = false,
+          alignment,
+          allowedPlacements = placements,
+          autoAlignment = true,
+          ...detectOverflowOptions
+        } = evaluate(options, state);
+        const placements$1 = alignment !== undefined || allowedPlacements === placements ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
+        const overflow = await detectOverflow(state, detectOverflowOptions);
+        const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP.index) || 0;
+        const currentPlacement = placements$1[currentIndex];
+        if (currentPlacement == null) {
+          return {};
+        }
+        const alignmentSides = getAlignmentSides(currentPlacement, rects, await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)));
+
+        // Make `computeCoords` start from the right place.
+        if (placement !== currentPlacement) {
+          return {
+            reset: {
+              placement: placements$1[0]
+            }
+          };
+        }
+        const currentOverflows = [overflow[getSide(currentPlacement)], overflow[alignmentSides[0]], overflow[alignmentSides[1]]];
+        const allOverflows = [...(((_middlewareData$autoP2 = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP2.overflows) || []), {
+          placement: currentPlacement,
+          overflows: currentOverflows
+        }];
+        const nextPlacement = placements$1[currentIndex + 1];
+
+        // There are more placements to check.
+        if (nextPlacement) {
+          return {
+            data: {
+              index: currentIndex + 1,
+              overflows: allOverflows
+            },
+            reset: {
+              placement: nextPlacement
+            }
+          };
+        }
+        const placementsSortedByMostSpace = allOverflows.map(d => {
+          const alignment = getAlignment(d.placement);
+          return [d.placement, alignment && crossAxis ?
+          // Check along the mainAxis and main crossAxis side.
+          d.overflows.slice(0, 2).reduce((acc, v) => acc + v, 0) :
+          // Check only the mainAxis.
+          d.overflows[0], d.overflows];
+        }).sort((a, b) => a[1] - b[1]);
+        const placementsThatFitOnEachSide = placementsSortedByMostSpace.filter(d => d[2].slice(0,
+        // Aligned placements should not check their opposite crossAxis
+        // side.
+        getAlignment(d[0]) ? 2 : 3).every(v => v <= 0));
+        const resetPlacement = ((_placementsThatFitOnE = placementsThatFitOnEachSide[0]) == null ? void 0 : _placementsThatFitOnE[0]) || placementsSortedByMostSpace[0][0];
+        if (resetPlacement !== placement) {
+          return {
+            data: {
+              index: currentIndex + 1,
+              overflows: allOverflows
+            },
+            reset: {
+              placement: resetPlacement
+            }
+          };
+        }
+        return {};
+      }
+    };
+  };
+
   /**
    * Optimizes the visibility of the floating element by flipping the `placement`
    * in order to keep it in view when the preferred placement(s) will overflow the
    * clipping boundary. Alternative to `autoPlacement`.
    * @see https://floating-ui.com/docs/flip
    */
-  const flip = function (options) {
+  const flip$1 = function (options) {
     if (options === void 0) {
       options = {};
     }
@@ -1511,10 +1632,12 @@
           return {};
         }
         const side = getSide(placement);
+        const initialSideAxis = getSideAxis(initialPlacement);
         const isBasePlacement = getSide(initialPlacement) === initialPlacement;
         const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
         const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
-        if (!specifiedFallbackPlacements && fallbackAxisSideDirection !== 'none') {
+        const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== 'none';
+        if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
           fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
         }
         const placements = [initialPlacement, ...fallbackPlacements];
@@ -1560,8 +1683,17 @@
             switch (fallbackStrategy) {
               case 'bestFit':
                 {
-                  var _overflowsData$map$so;
-                  const placement = (_overflowsData$map$so = overflowsData.map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$map$so[0];
+                  var _overflowsData$filter2;
+                  const placement = (_overflowsData$filter2 = overflowsData.filter(d => {
+                    if (hasFallbackAxisSideDirection) {
+                      const currentSideAxis = getSideAxis(d.placement);
+                      return currentSideAxis === initialSideAxis ||
+                      // Create a bias to the `y` side axis due to horizontal
+                      // reading directions favoring greater width.
+                      currentSideAxis === 'y';
+                    }
+                    return true;
+                  }).map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$filter2[0];
                   if (placement) {
                     resetPlacement = placement;
                   }
@@ -1585,8 +1717,209 @@
     };
   };
 
+  function getSideOffsets(overflow, rect) {
+    return {
+      top: overflow.top - rect.height,
+      right: overflow.right - rect.width,
+      bottom: overflow.bottom - rect.height,
+      left: overflow.left - rect.width
+    };
+  }
+  function isAnySideFullyClipped(overflow) {
+    return sides.some(side => overflow[side] >= 0);
+  }
+  /**
+   * Provides data to hide the floating element in applicable situations, such as
+   * when it is not in the same clipping context as the reference element.
+   * @see https://floating-ui.com/docs/hide
+   */
+  const hide = function (options) {
+    if (options === void 0) {
+      options = {};
+    }
+    return {
+      name: 'hide',
+      options,
+      async fn(state) {
+        const {
+          rects
+        } = state;
+        const {
+          strategy = 'referenceHidden',
+          ...detectOverflowOptions
+        } = evaluate(options, state);
+        switch (strategy) {
+          case 'referenceHidden':
+            {
+              const overflow = await detectOverflow(state, {
+                ...detectOverflowOptions,
+                elementContext: 'reference'
+              });
+              const offsets = getSideOffsets(overflow, rects.reference);
+              return {
+                data: {
+                  referenceHiddenOffsets: offsets,
+                  referenceHidden: isAnySideFullyClipped(offsets)
+                }
+              };
+            }
+          case 'escaped':
+            {
+              const overflow = await detectOverflow(state, {
+                ...detectOverflowOptions,
+                altBoundary: true
+              });
+              const offsets = getSideOffsets(overflow, rects.floating);
+              return {
+                data: {
+                  escapedOffsets: offsets,
+                  escaped: isAnySideFullyClipped(offsets)
+                }
+              };
+            }
+          default:
+            {
+              return {};
+            }
+        }
+      }
+    };
+  };
+
+  function getBoundingRect(rects) {
+    const minX = min(...rects.map(rect => rect.left));
+    const minY = min(...rects.map(rect => rect.top));
+    const maxX = max(...rects.map(rect => rect.right));
+    const maxY = max(...rects.map(rect => rect.bottom));
+    return {
+      x: minX,
+      y: minY,
+      width: maxX - minX,
+      height: maxY - minY
+    };
+  }
+  function getRectsByLine(rects) {
+    const sortedRects = rects.slice().sort((a, b) => a.y - b.y);
+    const groups = [];
+    let prevRect = null;
+    for (let i = 0; i < sortedRects.length; i++) {
+      const rect = sortedRects[i];
+      if (!prevRect || rect.y - prevRect.y > prevRect.height / 2) {
+        groups.push([rect]);
+      } else {
+        groups[groups.length - 1].push(rect);
+      }
+      prevRect = rect;
+    }
+    return groups.map(rect => rectToClientRect(getBoundingRect(rect)));
+  }
+  /**
+   * Provides improved positioning for inline reference elements that can span
+   * over multiple lines, such as hyperlinks or range selections.
+   * @see https://floating-ui.com/docs/inline
+   */
+  const inline = function (options) {
+    if (options === void 0) {
+      options = {};
+    }
+    return {
+      name: 'inline',
+      options,
+      async fn(state) {
+        const {
+          placement,
+          elements,
+          rects,
+          platform,
+          strategy
+        } = state;
+        // A MouseEvent's client{X,Y} coords can be up to 2 pixels off a
+        // ClientRect's bounds, despite the event listener being triggered. A
+        // padding of 2 seems to handle this issue.
+        const {
+          padding = 2,
+          x,
+          y
+        } = evaluate(options, state);
+        const nativeClientRects = Array.from((await (platform.getClientRects == null ? void 0 : platform.getClientRects(elements.reference))) || []);
+        const clientRects = getRectsByLine(nativeClientRects);
+        const fallback = rectToClientRect(getBoundingRect(nativeClientRects));
+        const paddingObject = getPaddingObject(padding);
+        function getBoundingClientRect() {
+          // There are two rects and they are disjoined.
+          if (clientRects.length === 2 && clientRects[0].left > clientRects[1].right && x != null && y != null) {
+            // Find the first rect in which the point is fully inside.
+            return clientRects.find(rect => x > rect.left - paddingObject.left && x < rect.right + paddingObject.right && y > rect.top - paddingObject.top && y < rect.bottom + paddingObject.bottom) || fallback;
+          }
+
+          // There are 2 or more connected rects.
+          if (clientRects.length >= 2) {
+            if (getSideAxis(placement) === 'y') {
+              const firstRect = clientRects[0];
+              const lastRect = clientRects[clientRects.length - 1];
+              const isTop = getSide(placement) === 'top';
+              const top = firstRect.top;
+              const bottom = lastRect.bottom;
+              const left = isTop ? firstRect.left : lastRect.left;
+              const right = isTop ? firstRect.right : lastRect.right;
+              const width = right - left;
+              const height = bottom - top;
+              return {
+                top,
+                bottom,
+                left,
+                right,
+                width,
+                height,
+                x: left,
+                y: top
+              };
+            }
+            const isLeftSide = getSide(placement) === 'left';
+            const maxRight = max(...clientRects.map(rect => rect.right));
+            const minLeft = min(...clientRects.map(rect => rect.left));
+            const measureRects = clientRects.filter(rect => isLeftSide ? rect.left === minLeft : rect.right === maxRight);
+            const top = measureRects[0].top;
+            const bottom = measureRects[measureRects.length - 1].bottom;
+            const left = minLeft;
+            const right = maxRight;
+            const width = right - left;
+            const height = bottom - top;
+            return {
+              top,
+              bottom,
+              left,
+              right,
+              width,
+              height,
+              x: left,
+              y: top
+            };
+          }
+          return fallback;
+        }
+        const resetRects = await platform.getElementRects({
+          reference: {
+            getBoundingClientRect
+          },
+          floating: elements.floating,
+          strategy
+        });
+        if (rects.reference.x !== resetRects.reference.x || rects.reference.y !== resetRects.reference.y || rects.reference.width !== resetRects.reference.width || rects.reference.height !== resetRects.reference.height) {
+          return {
+            reset: {
+              rects: resetRects
+            }
+          };
+        }
+        return {};
+      }
+    };
+  };
+
   // For type backwards-compatibility, the `OffsetOptions` type was also
   // Derivable.
+
   async function convertValueToCoords(state, options) {
     const {
       placement,
@@ -1611,10 +1944,9 @@
       crossAxis: 0,
       alignmentAxis: null
     } : {
-      mainAxis: 0,
-      crossAxis: 0,
-      alignmentAxis: null,
-      ...rawValue
+      mainAxis: rawValue.mainAxis || 0,
+      crossAxis: rawValue.crossAxis || 0,
+      alignmentAxis: rawValue.alignmentAxis
     };
     if (alignment && typeof alignmentAxis === 'number') {
       crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
@@ -1635,7 +1967,7 @@
    * object may be passed.
    * @see https://floating-ui.com/docs/offset
    */
-  const offset = function (options) {
+  const offset$1 = function (options) {
     if (options === void 0) {
       options = 0;
     }
@@ -1643,15 +1975,27 @@
       name: 'offset',
       options,
       async fn(state) {
+        var _middlewareData$offse, _middlewareData$arrow;
         const {
           x,
-          y
+          y,
+          placement,
+          middlewareData
         } = state;
         const diffCoords = await convertValueToCoords(state, options);
+
+        // If the placement is the same and the arrow caused an alignment offset
+        // then we don't need to change the positioning coordinates.
+        if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
+          return {};
+        }
         return {
           x: x + diffCoords.x,
           y: y + diffCoords.y,
-          data: diffCoords
+          data: {
+            ...diffCoords,
+            placement
+          }
         };
       }
     };
@@ -1662,7 +2006,7 @@
    * keep it in view when it will overflow the clipping boundary.
    * @see https://floating-ui.com/docs/shift
    */
-  const shift = function (options) {
+  const shift$1 = function (options) {
     if (options === void 0) {
       options = {};
     }
@@ -1724,13 +2068,172 @@
           ...limitedCoords,
           data: {
             x: limitedCoords.x - x,
-            y: limitedCoords.y - y
+            y: limitedCoords.y - y,
+            enabled: {
+              [mainAxis]: checkMainAxis,
+              [crossAxis]: checkCrossAxis
+            }
           }
         };
       }
     };
   };
+  /**
+   * Built-in `limiter` that will stop `shift()` at a certain point.
+   */
+  const limitShift = function (options) {
+    if (options === void 0) {
+      options = {};
+    }
+    return {
+      options,
+      fn(state) {
+        const {
+          x,
+          y,
+          placement,
+          rects,
+          middlewareData
+        } = state;
+        const {
+          offset = 0,
+          mainAxis: checkMainAxis = true,
+          crossAxis: checkCrossAxis = true
+        } = evaluate(options, state);
+        const coords = {
+          x,
+          y
+        };
+        const crossAxis = getSideAxis(placement);
+        const mainAxis = getOppositeAxis(crossAxis);
+        let mainAxisCoord = coords[mainAxis];
+        let crossAxisCoord = coords[crossAxis];
+        const rawOffset = evaluate(offset, state);
+        const computedOffset = typeof rawOffset === 'number' ? {
+          mainAxis: rawOffset,
+          crossAxis: 0
+        } : {
+          mainAxis: 0,
+          crossAxis: 0,
+          ...rawOffset
+        };
+        if (checkMainAxis) {
+          const len = mainAxis === 'y' ? 'height' : 'width';
+          const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis;
+          const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis;
+          if (mainAxisCoord < limitMin) {
+            mainAxisCoord = limitMin;
+          } else if (mainAxisCoord > limitMax) {
+            mainAxisCoord = limitMax;
+          }
+        }
+        if (checkCrossAxis) {
+          var _middlewareData$offse, _middlewareData$offse2;
+          const len = mainAxis === 'y' ? 'width' : 'height';
+          const isOriginSide = ['top', 'left'].includes(getSide(placement));
+          const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse[crossAxis]) || 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis);
+          const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : ((_middlewareData$offse2 = middlewareData.offset) == null ? void 0 : _middlewareData$offse2[crossAxis]) || 0) - (isOriginSide ? computedOffset.crossAxis : 0);
+          if (crossAxisCoord < limitMin) {
+            crossAxisCoord = limitMin;
+          } else if (crossAxisCoord > limitMax) {
+            crossAxisCoord = limitMax;
+          }
+        }
+        return {
+          [mainAxis]: mainAxisCoord,
+          [crossAxis]: crossAxisCoord
+        };
+      }
+    };
+  };
 
+  /**
+   * Provides data that allows you to change the size of the floating element —
+   * for instance, prevent it from overflowing the clipping boundary or match the
+   * width of the reference element.
+   * @see https://floating-ui.com/docs/size
+   */
+  const size = function (options) {
+    if (options === void 0) {
+      options = {};
+    }
+    return {
+      name: 'size',
+      options,
+      async fn(state) {
+        var _state$middlewareData, _state$middlewareData2;
+        const {
+          placement,
+          rects,
+          platform,
+          elements
+        } = state;
+        const {
+          apply = () => {},
+          ...detectOverflowOptions
+        } = evaluate(options, state);
+        const overflow = await detectOverflow(state, detectOverflowOptions);
+        const side = getSide(placement);
+        const alignment = getAlignment(placement);
+        const isYAxis = getSideAxis(placement) === 'y';
+        const {
+          width,
+          height
+        } = rects.floating;
+        let heightSide;
+        let widthSide;
+        if (side === 'top' || side === 'bottom') {
+          heightSide = side;
+          widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
+        } else {
+          widthSide = side;
+          heightSide = alignment === 'end' ? 'top' : 'bottom';
+        }
+        const maximumClippingHeight = height - overflow.top - overflow.bottom;
+        const maximumClippingWidth = width - overflow.left - overflow.right;
+        const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
+        const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
+        const noShift = !state.middlewareData.shift;
+        let availableHeight = overflowAvailableHeight;
+        let availableWidth = overflowAvailableWidth;
+        if ((_state$middlewareData = state.middlewareData.shift) != null && _state$middlewareData.enabled.x) {
+          availableWidth = maximumClippingWidth;
+        }
+        if ((_state$middlewareData2 = state.middlewareData.shift) != null && _state$middlewareData2.enabled.y) {
+          availableHeight = maximumClippingHeight;
+        }
+        if (noShift && !alignment) {
+          const xMin = max(overflow.left, 0);
+          const xMax = max(overflow.right, 0);
+          const yMin = max(overflow.top, 0);
+          const yMax = max(overflow.bottom, 0);
+          if (isYAxis) {
+            availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
+          } else {
+            availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
+          }
+        }
+        await apply({
+          ...state,
+          availableWidth,
+          availableHeight
+        });
+        const nextDimensions = await platform.getDimensions(elements.floating);
+        if (width !== nextDimensions.width || height !== nextDimensions.height) {
+          return {
+            reset: {
+              rects: true
+            }
+          };
+        }
+        return {};
+      }
+    };
+  };
+
+  function hasWindow() {
+    return typeof window !== 'undefined';
+  }
   function getNodeName(node) {
     if (isNode(node)) {
       return (node.nodeName || '').toLowerCase();
@@ -1742,24 +2245,32 @@
   }
   function getWindow(node) {
     var _node$ownerDocument;
-    return (node == null ? void 0 : (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
+    return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
   }
   function getDocumentElement(node) {
     var _ref;
     return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
   }
   function isNode(value) {
+    if (!hasWindow()) {
+      return false;
+    }
     return value instanceof Node || value instanceof getWindow(value).Node;
   }
   function isElement(value) {
+    if (!hasWindow()) {
+      return false;
+    }
     return value instanceof Element || value instanceof getWindow(value).Element;
   }
   function isHTMLElement(value) {
+    if (!hasWindow()) {
+      return false;
+    }
     return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
   }
   function isShadowRoot(value) {
-    // Browsers without `ShadowRoot` support.
-    if (typeof ShadowRoot === 'undefined') {
+    if (!hasWindow() || typeof ShadowRoot === 'undefined') {
       return false;
     }
     return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
@@ -1776,21 +2287,32 @@
   function isTableElement(element) {
     return ['table', 'td', 'th'].includes(getNodeName(element));
   }
-  function isContainingBlock(element) {
+  function isTopLayer(element) {
+    return [':popover-open', ':modal'].some(selector => {
+      try {
+        return element.matches(selector);
+      } catch (e) {
+        return false;
+      }
+    });
+  }
+  function isContainingBlock(elementOrCss) {
     const webkit = isWebKit();
-    const css = getComputedStyle(element);
+    const css = isElement(elementOrCss) ? getComputedStyle(elementOrCss) : elementOrCss;
 
     // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
-    return css.transform !== 'none' || css.perspective !== 'none' || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
+    // https://drafts.csswg.org/css-transforms-2/#individual-transforms
+    return ['transform', 'translate', 'scale', 'rotate', 'perspective'].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) || ['transform', 'translate', 'scale', 'rotate', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
   }
   function getContainingBlock(element) {
     let currentNode = getParentNode(element);
     while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
       if (isContainingBlock(currentNode)) {
         return currentNode;
-      } else {
-        currentNode = getParentNode(currentNode);
+      } else if (isTopLayer(currentNode)) {
+        return null;
       }
+      currentNode = getParentNode(currentNode);
     }
     return null;
   }
@@ -1812,8 +2334,8 @@
       };
     }
     return {
-      scrollLeft: element.pageXOffset,
-      scrollTop: element.pageYOffset
+      scrollLeft: element.scrollX,
+      scrollTop: element.scrollY
     };
   }
   function getParentNode(node) {
@@ -1853,10 +2375,14 @@
     const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
     const win = getWindow(scrollableAncestor);
     if (isBody) {
-      return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], win.frameElement && traverseIframes ? getOverflowAncestors(win.frameElement) : []);
+      const frameElement = getFrameElement(win);
+      return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
     }
     return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
   }
+  function getFrameElement(win) {
+    return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
+  }
 
   function getCssDimensions(element) {
     const css = getComputedStyle(element);
@@ -1959,8 +2485,9 @@
     if (domElement) {
       const win = getWindow(domElement);
       const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
-      let currentIFrame = win.frameElement;
-      while (currentIFrame && offsetParent && offsetWin !== win) {
+      let currentWin = win;
+      let currentIFrame = getFrameElement(currentWin);
+      while (currentIFrame && offsetParent && offsetWin !== currentWin) {
         const iframeScale = getScale(currentIFrame);
         const iframeRect = currentIFrame.getBoundingClientRect();
         const css = getComputedStyle(currentIFrame);
@@ -1972,7 +2499,8 @@
         height *= iframeScale.y;
         x += left;
         y += top;
-        currentIFrame = getWindow(currentIFrame).frameElement;
+        currentWin = getWindow(currentIFrame);
+        currentIFrame = getFrameElement(currentWin);
       }
     }
     return rectToClientRect({
@@ -1983,15 +2511,42 @@
     });
   }
 
+  // If <html> has a CSS width greater than the viewport, then this will be
+  // incorrect for RTL.
+  function getWindowScrollBarX(element, rect) {
+    const leftScroll = getNodeScroll(element).scrollLeft;
+    if (!rect) {
+      return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
+    }
+    return rect.left + leftScroll;
+  }
+
+  function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
+    if (ignoreScrollbarX === void 0) {
+      ignoreScrollbarX = false;
+    }
+    const htmlRect = documentElement.getBoundingClientRect();
+    const x = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 :
+    // RTL <body> scrollbar.
+    getWindowScrollBarX(documentElement, htmlRect));
+    const y = htmlRect.top + scroll.scrollTop;
+    return {
+      x,
+      y
+    };
+  }
+
   function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
     let {
+      elements,
       rect,
       offsetParent,
       strategy
     } = _ref;
-    const isOffsetParentAnElement = isHTMLElement(offsetParent);
+    const isFixed = strategy === 'fixed';
     const documentElement = getDocumentElement(offsetParent);
-    if (offsetParent === documentElement) {
+    const topLayer = elements ? isTopLayer(elements.floating) : false;
+    if (offsetParent === documentElement || topLayer && isFixed) {
       return rect;
     }
     let scroll = {
@@ -2000,7 +2555,8 @@
     };
     let scale = createCoords(1);
     const offsets = createCoords(0);
-    if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') {
+    const isOffsetParentAnElement = isHTMLElement(offsetParent);
+    if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
       if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
         scroll = getNodeScroll(offsetParent);
       }
@@ -2011,11 +2567,12 @@
         offsets.y = offsetRect.y + offsetParent.clientTop;
       }
     }
+    const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, true) : createCoords(0);
     return {
       width: rect.width * scale.x,
       height: rect.height * scale.y,
-      x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
-      y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
+      x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
+      y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
     };
   }
 
@@ -2023,12 +2580,6 @@
     return Array.from(element.getClientRects());
   }
 
-  function getWindowScrollBarX(element) {
-    // If <html> has a CSS width greater than the viewport, then this will be
-    // incorrect for RTL.
-    return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
-  }
-
   // Gets the entire size of the scrollable document area, even extending outside
   // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
   function getDocumentRect(element) {
@@ -2103,9 +2654,10 @@
     } else {
       const visualOffsets = getVisualOffsets(element);
       rect = {
-        ...clippingAncestor,
         x: clippingAncestor.x - visualOffsets.x,
-        y: clippingAncestor.y - visualOffsets.y
+        y: clippingAncestor.y - visualOffsets.y,
+        width: clippingAncestor.width,
+        height: clippingAncestor.height
       };
     }
     return rectToClientRect(rect);
@@ -2161,7 +2713,7 @@
       rootBoundary,
       strategy
     } = _ref;
-    const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element, this._c) : [].concat(boundary);
+    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) => {
@@ -2181,7 +2733,14 @@
   }
 
   function getDimensions(element) {
-    return getCssDimensions(element);
+    const {
+      width,
+      height
+    } = getCssDimensions(element);
+    return {
+      width,
+      height
+    };
   }
 
   function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
@@ -2203,17 +2762,26 @@
         offsets.x = offsetRect.x + offsetParent.clientLeft;
         offsets.y = offsetRect.y + offsetParent.clientTop;
       } else if (documentElement) {
+        // If the <body> scrollbar appears on the left (e.g. RTL systems). Use
+        // Firefox with layout.scrollbar.side = 3 in about:config to test this.
         offsets.x = getWindowScrollBarX(documentElement);
       }
     }
+    const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
+    const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
+    const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
     return {
-      x: rect.left + scroll.scrollLeft - offsets.x,
-      y: rect.top + scroll.scrollTop - offsets.y,
+      x,
+      y,
       width: rect.width,
       height: rect.height
     };
   }
 
+  function isStaticPositioned(element) {
+    return getComputedStyle(element).position === 'static';
+  }
+
   function getTrueOffsetParent(element, polyfill) {
     if (!isHTMLElement(element) || getComputedStyle(element).position === 'fixed') {
       return null;
@@ -2221,40 +2789,56 @@
     if (polyfill) {
       return polyfill(element);
     }
-    return element.offsetParent;
+    let rawOffsetParent = element.offsetParent;
+
+    // Firefox returns the <html> element as the offsetParent if it's non-static,
+    // while Chrome and Safari return the <body> element. The <body> element must
+    // be used to perform the correct calculations even if the <html> element is
+    // non-static.
+    if (getDocumentElement(element) === rawOffsetParent) {
+      rawOffsetParent = rawOffsetParent.ownerDocument.body;
+    }
+    return rawOffsetParent;
   }
 
   // Gets the closest ancestor positioned element. Handles some edge cases,
   // such as table ancestors and cross browser bugs.
   function getOffsetParent(element, polyfill) {
-    const window = getWindow(element);
+    const win = getWindow(element);
+    if (isTopLayer(element)) {
+      return win;
+    }
     if (!isHTMLElement(element)) {
-      return window;
+      let svgOffsetParent = getParentNode(element);
+      while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
+        if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
+          return svgOffsetParent;
+        }
+        svgOffsetParent = getParentNode(svgOffsetParent);
+      }
+      return win;
     }
     let offsetParent = getTrueOffsetParent(element, polyfill);
-    while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {
+    while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
       offsetParent = getTrueOffsetParent(offsetParent, polyfill);
     }
-    if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static' && !isContainingBlock(offsetParent))) {
-      return window;
+    if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
+      return win;
     }
-    return offsetParent || getContainingBlock(element) || window;
+    return offsetParent || getContainingBlock(element) || win;
   }
 
-  const getElementRects = async function (_ref) {
-    let {
-      reference,
-      floating,
-      strategy
-    } = _ref;
+  const getElementRects = async function (data) {
     const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
     const getDimensionsFn = this.getDimensions;
+    const floatingDimensions = await getDimensionsFn(data.floating);
     return {
-      reference: getRectRelativeToOffsetParent(reference, await getOffsetParentFn(floating), strategy),
+      reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
       floating: {
         x: 0,
         y: 0,
-        ...(await getDimensionsFn(floating))
+        width: floatingDimensions.width,
+        height: floatingDimensions.height
       }
     };
   };
@@ -2276,10 +2860,75 @@
     isRTL
   };
 
+  /**
+   * Modifies the placement by translating the floating element along the
+   * specified axes.
+   * A number (shorthand for `mainAxis` or distance), or an axes configuration
+   * object may be passed.
+   * @see https://floating-ui.com/docs/offset
+   */
+  const offset = offset$1;
+
+  /**
+   * Optimizes the visibility of the floating element by choosing the placement
+   * that has the most space available automatically, without needing to specify a
+   * preferred placement. Alternative to `flip`.
+   * @see https://floating-ui.com/docs/autoPlacement
+   */
+  autoPlacement;
+
+  /**
+   * Optimizes the visibility of the floating element by shifting it in order to
+   * keep it in view when it will overflow the clipping boundary.
+   * @see https://floating-ui.com/docs/shift
+   */
+  const shift = shift$1;
+
+  /**
+   * Optimizes the visibility of the floating element by flipping the `placement`
+   * in order to keep it in view when the preferred placement(s) will overflow the
+   * clipping boundary. Alternative to `autoPlacement`.
+   * @see https://floating-ui.com/docs/flip
+   */
+  const flip = flip$1;
+
+  /**
+   * Provides data that allows you to change the size of the floating element —
+   * for instance, prevent it from overflowing the clipping boundary or match the
+   * width of the reference element.
+   * @see https://floating-ui.com/docs/size
+   */
+  size;
+
+  /**
+   * Provides data to hide the floating element in applicable situations, such as
+   * when it is not in the same clipping context as the reference element.
+   * @see https://floating-ui.com/docs/hide
+   */
+  hide;
+
+  /**
+   * Provides data to position an inner element of the floating element so that it
+   * appears centered to the reference element.
+   * @see https://floating-ui.com/docs/arrow
+   */
+  const arrow = arrow$1;
+
+  /**
+   * Provides improved positioning for inline reference elements that can span
+   * over multiple lines, such as hyperlinks or range selections.
+   * @see https://floating-ui.com/docs/inline
+   */
+  inline;
+
+  /**
+   * Built-in `limiter` that will stop `shift()` at a certain point.
+   */
+  limitShift;
+
   /**
    * Computes the `x` and `y` coordinates that will place the floating element
-   * next to a reference element when it is given a certain CSS positioning
-   * strategy.
+   * next to a given reference element.
    */
   const computePosition = (reference, floating, options) => {
     // This caches the expensive `getClippingElementAncestors` function so that
@@ -2302,7 +2951,6 @@
 
   var selected = {};
   function highlight(item, node, keys) {
-    item.id;
     var rectEle = getOptimizedBoundingRectEle(node);
     if (!item.highlightBox) {
       var box = HighlightBox(rectEle, colors.highlight);
@@ -2607,13 +3255,13 @@
             ignoreMergedEleUniqueIds.push(child.uniqueID);
           }
           var txt = child.textContent;
-          if (nodeI18nMeta && nodeI18nMeta['html'] && i < node.childNodes.length - 1) {
+          if (nodeI18nMeta && nodeI18nMeta.html && i < node.childNodes.length - 1) {
             merge.push({
               childIndex: i,
               child: child,
               text: txt
             });
-          } else if (nodeI18nMeta && nodeI18nMeta['html'] && i === node.childNodes.length - 1) {
+          } else if (nodeI18nMeta && nodeI18nMeta.html && i === node.childNodes.length - 1) {
             merge.push({
               childIndex: i,
               child: child,
@@ -2622,7 +3270,7 @@
             storeIfQualifiedKey(node.uniqueID, null, 'html', nodeI18nMeta, node, merge, node.innerHTML);
             merge = [];
           } else if (txt) {
-            if (nodeI18nMeta && nodeI18nMeta['text']) {
+            if (nodeI18nMeta && nodeI18nMeta.text) {
               storeIfQualifiedKey(node.uniqueID, null, 'text', nodeI18nMeta, node, undefined, txt);
             } else if (child.nodeName === '#text' && !containsOnlySpaces(txt)) {
               uninstrumentedStore.save(node.uniqueID, 'text', node, txt);
@@ -2777,7 +3425,9 @@
       }
     }
     function dragMouseDown(e) {
-      if (!overlay) overlay = document.getElementById('i18next-editor-popup-overlay');
+      if (!overlay) {
+        overlay = document.getElementById('i18next-editor-popup-overlay');
+      }
       if (overlay) overlay.style.display = 'block';
       stopMouseTracking();
       elmnt = this.parentPopup;
@@ -2804,7 +3454,7 @@
       startMouseTracking();
       if (overlay) overlay.style.display = 'none';
       var ele = document.getElementById('i18next-editor-popup');
-      localStorage.setItem('locize_popup_pos', JSON.stringify({
+      window.localStorage.setItem('locize_popup_pos', JSON.stringify({
         top: parseInt(document.defaultView.getComputedStyle(ele).top, 10),
         left: parseInt(document.defaultView.getComputedStyle(ele).left, 10)
       }));
@@ -2844,7 +3494,9 @@
     }
     function initDrag(e) {
       stopMouseTracking();
-      if (!overlay) overlay = document.getElementById('i18next-editor-popup-overlay');
+      if (!overlay) {
+        overlay = document.getElementById('i18next-editor-popup-overlay');
+      }
       if (overlay) overlay.style.display = 'block';
       element = this.parentPopup;
       startX = e.clientX;
@@ -2862,7 +3514,7 @@
       startMouseTracking();
       if (overlay) overlay.style.display = 'none';
       var ele = document.getElementById('i18next-editor-popup');
-      localStorage.setItem('locize_popup_size', JSON.stringify({
+      window.localStorage.setItem('locize_popup_size', JSON.stringify({
         width: parseInt(document.defaultView.getComputedStyle(ele).width, 10),
         height: parseInt(document.defaultView.getComputedStyle(ele).height, 10)
       }));
@@ -2900,7 +3552,9 @@
         if (Array.isArray(fallback)) return fallback[fallback.length - 1];
         if (fallback && fallback["default"]) {
           if (typeof fallback["default"] === 'string') return fallback;
-          if (Array.isArray(fallback["default"])) return fallback["default"][fallback["default"].length - 1];
+          if (Array.isArray(fallback["default"])) {
+            return fallback["default"][fallback["default"].length - 1];
+          }
         }
         if (typeof fallback === 'function') {
           var res = fallback(i18n.resolvedLanguage);
@@ -2957,21 +3611,13 @@
       getResource: function getResource(lng, ns, key) {
         return {};
       },
-      setResource: function setResource(lng, ns, key, value) {
-        return;
-      },
+      setResource: function setResource(lng, ns, key, value) {},
       getResourceBundle: function getResourceBundle(lng, ns, cb) {
         cb({});
       },
-      getDefaultNS: function getDefaultNS() {
-        return;
-      },
-      getLng: function getLng() {
-        return;
-      },
-      getSourceLng: function getSourceLng() {
-        return;
-      },
+      getDefaultNS: function getDefaultNS() {},
+      getLng: function getLng() {},
+      getSourceLng: function getSourceLng() {},
       getLocizeDetails: function getLocizeDetails() {
         return {};
       },
@@ -2985,10 +3631,6 @@
   function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
   var dummyImplementation = getImplementation();
-  var isInIframe = typeof window !== 'undefined';
-  try {
-    isInIframe = self !== top;
-  } catch (e) {}
   function start() {
     var implementation = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : dummyImplementation;
     var opt = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
@@ -3050,7 +3692,7 @@
       }
     }
     if (document.body) return continueToStart();
-    window.addEventListener('load', function () {
+    if (typeof window !== 'undefined') window.addEventListener('load', function () {
       return continueToStart();
     });
   }
@@ -3076,7 +3718,8 @@
         var options = i18n.options;
         i18next = i18n;
         var impl = getImplementation$1(i18n);
-        configurePostProcessor(i18next, options);
+        var showInContext = opt.show || getQsParameterByName(opt.qsProp) === 'true';
+        if (isInIframe || showInContext) configurePostProcessor(i18next, options);
         start(impl, opt);
       }
     };
@@ -3090,7 +3733,9 @@
       rest = _objectWithoutProperties(options, _excluded);
     start(implementation, Object.keys(rest).length > 0 ? rest : undefined);
   }
-  if (typeof window !== 'undefined') window.locizeStartStandalone = startStandalone;
+  if (typeof window !== 'undefined') {
+    window.locizeStartStandalone = startStandalone;
+  }
 
   var index = {
     wrap: wrap,