@wix/editor-react-components 1.2153.0

package/dist/site/components/chunks/useConsentPolicyProps.js

@@ -0,0 +1,2356 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import * as React from "react";
+import React__default, { useState, useEffect, useMemo } from "react";
+import { c as clsx } from "./clsx.js";
+import { a as getDataAttributes } from "./dataUtils.js";
+import { a as activateBySpaceOrEnterButton, e as getTabIndexAttribute } from "./a11y.js";
+import * as ReactDOM from "react-dom";
+import ReactDOM__default from "react-dom";
+import { g as getDefaultExportFromCjs } from "./_commonjsHelpers.js";
+import { useService } from "@wix/services-manager-react";
+import { d as definitionExports$1 } from "./index2.js";
+import { d as definitionExports$2 } from "./index5.js";
+import { r as requireBuild } from "./index7.js";
+const CONSENT_POLICY_NAMESPACE = "CookieConsent";
+const DataHooks = {
+  NoConsentBox: "consent-policy-no-consent-box"
+};
+const translationKeysMap = {
+  large_element_one_cookie_key: "CookieConsent_UoU_Large_Element_One_Cookie_Type",
+  large_element_one_cookie_default: "<%=componentname%> was blocked due to your cookie and tracking settings. To view, <url>update your <%=cookietype%> settings.<url>",
+  large_element_two_cookie_key: "CookieConsent_UoU_Large_Element_Two_Cookie_Types",
+  large_element_two_cookie_default: "<%=componentname%> was blocked due to your cookie and tracking settings. To view, <url>update your <%=cookietype%> and <%=cookietype%> settings.<url>",
+  medium_element_one_cookie_key: "CookieConsent_UoU_Medium_Element_One_Cookie_Type",
+  medium_element_one_cookie_default: "To view <%=componentname%>, <url>update your cookie and tracking settings.<url>",
+  medium_element_two_cookie_key: "CookieConsent_UoU_Medium_Element_Two_Cookie_Types",
+  medium_element_two_cookie_default: "To view <%=componentname%>, <url>adjust your <%=cookietype%> and <%=cookietype%> cookie and tracking settings.<url>",
+  small_element_one_cookie_key: "CookieConsent_UoU_Small_Element_One_Cookie_Type",
+  small_element_one_cookie_default: "<url>Update your cookie and tracking settings<url>",
+  small_element_two_cookie_key: "CookieConsent_UoU_Small_Element_Two_Cookie_Types",
+  small_element_two_cookie_default: "<url>Update your cookie and tracking settings<url>",
+  small_tooltip_one_cookie_key: "CookieConsent_UoU_Small_Element_Tooltip",
+  small_tooltip_one_cookie_default: "To view <%=componentname%>, update your <%=cookietype%> settings.",
+  small_tooltip_two_cookie_key: "CookieConsent_UoU_Small_Element_Two_Cookie_Types_Tooltip",
+  small_tooltip_two_cookie_default: "To view <%=componentname%>, update your <%=cookietype%> and <%=cookietype%> settings.",
+  small_element_aria_label_key: "CookieConsent_UoU_Small_Element_Aria_Label",
+  small_element_aria_label_default: "More info",
+  tiny_element_one_cookie_key: "CookieConsent_UoU_Tiny_Element_One_Cookie_Type",
+  tiny_element_one_cookie_default: "<%=componentname%> was blocked due to your cookie and tracking settings. <url>To view, update your settings.<url>",
+  tiny_element_two_cookie_key: "CookieConsent_UoU_Tiny_Element_Two_Cookie_Types",
+  tiny_element_two_cookie_default: "<%=componentname%> was blocked due to your cookie and tracking settings. To view, <url>update your <%=cookietype%> and <%=cookietype%> settings.<url>",
+  tiny_element_aria_label_key: "CookieConsent_UoU_Tiny_Element_Aria_Label",
+  tiny_element_aria_label_default: "Unblock <%=componentname%>",
+  analytics_key: "CookieConsent_Dataset_Cookie_Type_Analytics",
+  analytics_default: "analytics",
+  functional_key: "CookieConsent_Dataset_Cookie_Type_Functional",
+  functional_default: "functional",
+  essential_key: "CookieConsent_Dataset_Cookie_Type_Essential",
+  essential_default: "essential",
+  advertising_key: "CookieConsent_Dataset_Cookie_Type_Marketing",
+  advertising_default: "marketing"
+};
+const translationKeys = [
+  "large_element_one_cookie",
+  "large_element_two_cookie",
+  "medium_element_one_cookie",
+  "medium_element_two_cookie",
+  "small_element_one_cookie",
+  "small_element_two_cookie",
+  "small_tooltip_one_cookie",
+  "small_tooltip_two_cookie",
+  "small_element_aria_label",
+  "tiny_element_one_cookie",
+  "tiny_element_two_cookie",
+  "tiny_element_aria_label",
+  "analytics",
+  "functional",
+  "essential",
+  "advertising",
+  "componentName"
+];
+const root = "root__CGREm";
+const noConsentBox = "noConsentBox__mrFy-";
+const textBox = "textBox__VgZcv";
+const cookieIcon$1 = "cookieIcon__fOOVu";
+const largeTextBox = "largeTextBox__-nB4W";
+const mediumTextBox = "mediumTextBox__59Vot";
+const smallTextBox = "smallTextBox__8nP4K";
+const tinyTextBox = "tinyTextBox__arVSF";
+const style$1 = {
+  root,
+  noConsentBox,
+  textBox,
+  cookieIcon: cookieIcon$1,
+  largeTextBox,
+  mediumTextBox,
+  smallTextBox,
+  tinyTextBox
+};
+const parseElementText = (cookiesNeeded, componentName, textSize, translationsValues) => {
+  const oneCookieText = translationsValues[`${textSize}_element_one_cookie`] || "";
+  const twoCookieText = translationsValues[`${textSize}_element_two_cookie`] || "";
+  let parsedText = cookiesNeeded.length === 1 ? oneCookieText : twoCookieText;
+  parsedText = parsedText.replace("<%=componentname%>", componentName);
+  cookiesNeeded.forEach((cookieType) => {
+    const cookieName = translationsValues[cookieType];
+    parsedText = parsedText.replace("<%=cookietype%>", cookieName);
+  });
+  return parsedText;
+};
+const parseTooltipText = (componentName, textSize, cookiesNeeded, translationsValues) => {
+  const oneCookieText = translationsValues[`${textSize}_tooltip_one_cookie`] || "";
+  const twoCookieText = translationsValues[`${textSize}_tooltip_two_cookie`] || "";
+  let parsedText = cookiesNeeded.length === 1 ? oneCookieText : twoCookieText;
+  cookiesNeeded.forEach((cookieType) => {
+    const cookieName = translationsValues[cookieType] || "";
+    parsedText = parsedText.replace("<%=cookietype%>", cookieName);
+  });
+  return parsedText.replace("<%=componentname%>", componentName);
+};
+const parseAriaLabelText = (componentName, textSize, translationsValues) => {
+  const ariaLabelText = translationsValues[`${textSize}_element_aria_label`] || "";
+  return ariaLabelText.replace("<%=componentname%>", componentName);
+};
+const parseTextWithLinks = (text) => {
+  const urlRegexp = new RegExp("<url>.*?<url>", "g");
+  const urlTextRegexp = new RegExp("(?<=<url>)(.*?)(?=<url>)", "g");
+  const matchedUrls = [...text.matchAll(urlRegexp)];
+  const firstUrl = matchedUrls[0] ? matchedUrls[0][0] : "";
+  const firstUrlText = firstUrl == null ? void 0 : firstUrl.match(urlTextRegexp);
+  const firstUrlSize = firstUrl ? firstUrl.length : 0;
+  const firstUrlIndex = firstUrl ? text.indexOf(firstUrl) : text.length;
+  const firstText = text.substring(0, firstUrlIndex);
+  const secondText = text.substring(firstUrlIndex + firstUrlSize);
+  return {
+    firstText,
+    firstUrlText: firstUrlText ? firstUrlText[0] : "",
+    secondText
+  };
+};
+const getConsentWrapperTexts = (cookiesNeeded, componentName, translationsValues) => {
+  const largeText = parseElementText(
+    cookiesNeeded,
+    componentName,
+    "large",
+    translationsValues
+  );
+  const mediumText = parseElementText(
+    cookiesNeeded,
+    componentName,
+    "medium",
+    translationsValues
+  );
+  const smallText = parseElementText(
+    cookiesNeeded,
+    componentName,
+    "small",
+    translationsValues
+  );
+  const tinyTooltipText = parseElementText(
+    cookiesNeeded,
+    componentName,
+    "tiny",
+    translationsValues
+  );
+  const smallTooltipText = parseTooltipText(
+    componentName,
+    "small",
+    cookiesNeeded,
+    translationsValues
+  );
+  const tinyAriaLabelText = parseAriaLabelText(
+    componentName,
+    "tiny",
+    translationsValues
+  );
+  const smallAriaLabelText = parseAriaLabelText(
+    componentName,
+    "small",
+    translationsValues
+  );
+  return {
+    largeText,
+    mediumText,
+    smallText,
+    tinyTooltipText,
+    smallTooltipText,
+    tinyAriaLabelText,
+    smallAriaLabelText
+  };
+};
+const cancelBrowserScroll = (e) => {
+  if (e.key === " ") {
+    e.preventDefault();
+  }
+};
+const translateConsentWrapperKeys = (componentNameKey, componentNameDefault, translate) => {
+  const componentName = translate(CONSENT_POLICY_NAMESPACE, componentNameKey) || componentNameDefault;
+  const translationObj = {
+    componentName
+  };
+  return translationKeys.filter((key) => key !== "componentName").reduce(
+    (accumulator, translation) => {
+      const translationKey = translationKeysMap[`${translation}_key`];
+      const translationDefault = translationKeysMap[`${translation}_default`];
+      accumulator[translation] = translate(CONSENT_POLICY_NAMESPACE, translationKey) || translationDefault;
+      return accumulator;
+    },
+    translationObj
+  );
+};
+var fromEntries = function fromEntries2(entries) {
+  return entries.reduce(function(acc, _ref) {
+    var key = _ref[0], value = _ref[1];
+    acc[key] = value;
+    return acc;
+  }, {});
+};
+var useIsomorphicLayoutEffect = typeof window !== "undefined" && window.document && window.document.createElement ? React.useLayoutEffect : React.useEffect;
+var top = "top";
+var bottom = "bottom";
+var right = "right";
+var left = "left";
+var auto = "auto";
+var basePlacements = [top, bottom, right, left];
+var start = "start";
+var end = "end";
+var clippingParents = "clippingParents";
+var viewport = "viewport";
+var popper = "popper";
+var reference = "reference";
+var variationPlacements = /* @__PURE__ */ basePlacements.reduce(function(acc, placement) {
+  return acc.concat([placement + "-" + start, placement + "-" + end]);
+}, []);
+var placements = /* @__PURE__ */ [].concat(basePlacements, [auto]).reduce(function(acc, placement) {
+  return acc.concat([placement, placement + "-" + start, placement + "-" + end]);
+}, []);
+var beforeRead = "beforeRead";
+var read = "read";
+var afterRead = "afterRead";
+var beforeMain = "beforeMain";
+var main = "main";
+var afterMain = "afterMain";
+var beforeWrite = "beforeWrite";
+var write = "write";
+var afterWrite = "afterWrite";
+var modifierPhases = [beforeRead, read, afterRead, beforeMain, main, afterMain, beforeWrite, write, afterWrite];
+function getNodeName(element) {
+  return element ? (element.nodeName || "").toLowerCase() : null;
+}
+function getWindow(node) {
+  if (node == null) {
+    return window;
+  }
+  if (node.toString() !== "[object Window]") {
+    var ownerDocument = node.ownerDocument;
+    return ownerDocument ? ownerDocument.defaultView || window : window;
+  }
+  return node;
+}
+function isElement(node) {
+  var OwnElement = getWindow(node).Element;
+  return node instanceof OwnElement || node instanceof Element;
+}
+function isHTMLElement(node) {
+  var OwnElement = getWindow(node).HTMLElement;
+  return node instanceof OwnElement || node instanceof HTMLElement;
+}
+function isShadowRoot(node) {
+  if (typeof ShadowRoot === "undefined") {
+    return false;
+  }
+  var OwnElement = getWindow(node).ShadowRoot;
+  return node instanceof OwnElement || node instanceof ShadowRoot;
+}
+function applyStyles(_ref) {
+  var state = _ref.state;
+  Object.keys(state.elements).forEach(function(name) {
+    var style2 = state.styles[name] || {};
+    var attributes = state.attributes[name] || {};
+    var element = state.elements[name];
+    if (!isHTMLElement(element) || !getNodeName(element)) {
+      return;
+    }
+    Object.assign(element.style, style2);
+    Object.keys(attributes).forEach(function(name2) {
+      var value = attributes[name2];
+      if (value === false) {
+        element.removeAttribute(name2);
+      } else {
+        element.setAttribute(name2, value === true ? "" : value);
+      }
+    });
+  });
+}
+function effect$2(_ref2) {
+  var state = _ref2.state;
+  var initialStyles = {
+    popper: {
+      position: state.options.strategy,
+      left: "0",
+      top: "0",
+      margin: "0"
+    },
+    arrow: {
+      position: "absolute"
+    },
+    reference: {}
+  };
+  Object.assign(state.elements.popper.style, initialStyles.popper);
+  state.styles = initialStyles;
+  if (state.elements.arrow) {
+    Object.assign(state.elements.arrow.style, initialStyles.arrow);
+  }
+  return function() {
+    Object.keys(state.elements).forEach(function(name) {
+      var element = state.elements[name];
+      var attributes = state.attributes[name] || {};
+      var styleProperties = Object.keys(state.styles.hasOwnProperty(name) ? state.styles[name] : initialStyles[name]);
+      var style2 = styleProperties.reduce(function(style3, property) {
+        style3[property] = "";
+        return style3;
+      }, {});
+      if (!isHTMLElement(element) || !getNodeName(element)) {
+        return;
+      }
+      Object.assign(element.style, style2);
+      Object.keys(attributes).forEach(function(attribute) {
+        element.removeAttribute(attribute);
+      });
+    });
+  };
+}
+const applyStyles$1 = {
+  name: "applyStyles",
+  enabled: true,
+  phase: "write",
+  fn: applyStyles,
+  effect: effect$2,
+  requires: ["computeStyles"]
+};
+function getBasePlacement(placement) {
+  return placement.split("-")[0];
+}
+var max = Math.max;
+var min = Math.min;
+var round = Math.round;
+function getUAString() {
+  var uaData = navigator.userAgentData;
+  if (uaData != null && uaData.brands && Array.isArray(uaData.brands)) {
+    return uaData.brands.map(function(item) {
+      return item.brand + "/" + item.version;
+    }).join(" ");
+  }
+  return navigator.userAgent;
+}
+function isLayoutViewport() {
+  return !/^((?!chrome|android).)*safari/i.test(getUAString());
+}
+function getBoundingClientRect(element, includeScale, isFixedStrategy) {
+  if (includeScale === void 0) {
+    includeScale = false;
+  }
+  if (isFixedStrategy === void 0) {
+    isFixedStrategy = false;
+  }
+  var clientRect = element.getBoundingClientRect();
+  var scaleX = 1;
+  var scaleY = 1;
+  if (includeScale && isHTMLElement(element)) {
+    scaleX = element.offsetWidth > 0 ? round(clientRect.width) / element.offsetWidth || 1 : 1;
+    scaleY = element.offsetHeight > 0 ? round(clientRect.height) / element.offsetHeight || 1 : 1;
+  }
+  var _ref = isElement(element) ? getWindow(element) : window, visualViewport = _ref.visualViewport;
+  var addVisualOffsets = !isLayoutViewport() && isFixedStrategy;
+  var x = (clientRect.left + (addVisualOffsets && visualViewport ? visualViewport.offsetLeft : 0)) / scaleX;
+  var y = (clientRect.top + (addVisualOffsets && visualViewport ? visualViewport.offsetTop : 0)) / scaleY;
+  var width = clientRect.width / scaleX;
+  var height = clientRect.height / scaleY;
+  return {
+    width,
+    height,
+    top: y,
+    right: x + width,
+    bottom: y + height,
+    left: x,
+    x,
+    y
+  };
+}
+function getLayoutRect(element) {
+  var clientRect = getBoundingClientRect(element);
+  var width = element.offsetWidth;
+  var height = element.offsetHeight;
+  if (Math.abs(clientRect.width - width) <= 1) {
+    width = clientRect.width;
+  }
+  if (Math.abs(clientRect.height - height) <= 1) {
+    height = clientRect.height;
+  }
+  return {
+    x: element.offsetLeft,
+    y: element.offsetTop,
+    width,
+    height
+  };
+}
+function contains(parent, child) {
+  var rootNode = child.getRootNode && child.getRootNode();
+  if (parent.contains(child)) {
+    return true;
+  } else if (rootNode && isShadowRoot(rootNode)) {
+    var next = child;
+    do {
+      if (next && parent.isSameNode(next)) {
+        return true;
+      }
+      next = next.parentNode || next.host;
+    } while (next);
+  }
+  return false;
+}
+function getComputedStyle(element) {
+  return getWindow(element).getComputedStyle(element);
+}
+function isTableElement(element) {
+  return ["table", "td", "th"].indexOf(getNodeName(element)) >= 0;
+}
+function getDocumentElement(element) {
+  return ((isElement(element) ? element.ownerDocument : (
+    // $FlowFixMe[prop-missing]
+    element.document
+  )) || window.document).documentElement;
+}
+function getParentNode(element) {
+  if (getNodeName(element) === "html") {
+    return element;
+  }
+  return (
+    // this is a quicker (but less type safe) way to save quite some bytes from the bundle
+    // $FlowFixMe[incompatible-return]
+    // $FlowFixMe[prop-missing]
+    element.assignedSlot || // step into the shadow DOM of the parent of a slotted node
+    element.parentNode || // DOM Element detected
+    (isShadowRoot(element) ? element.host : null) || // ShadowRoot detected
+    // $FlowFixMe[incompatible-call]: HTMLElement is a Node
+    getDocumentElement(element)
+  );
+}
+function getTrueOffsetParent(element) {
+  if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837
+  getComputedStyle(element).position === "fixed") {
+    return null;
+  }
+  return element.offsetParent;
+}
+function getContainingBlock(element) {
+  var isFirefox = /firefox/i.test(getUAString());
+  var isIE = /Trident/i.test(getUAString());
+  if (isIE && isHTMLElement(element)) {
+    var elementCss = getComputedStyle(element);
+    if (elementCss.position === "fixed") {
+      return null;
+    }
+  }
+  var currentNode = getParentNode(element);
+  if (isShadowRoot(currentNode)) {
+    currentNode = currentNode.host;
+  }
+  while (isHTMLElement(currentNode) && ["html", "body"].indexOf(getNodeName(currentNode)) < 0) {
+    var css = getComputedStyle(currentNode);
+    if (css.transform !== "none" || css.perspective !== "none" || css.contain === "paint" || ["transform", "perspective"].indexOf(css.willChange) !== -1 || isFirefox && css.willChange === "filter" || isFirefox && css.filter && css.filter !== "none") {
+      return currentNode;
+    } else {
+      currentNode = currentNode.parentNode;
+    }
+  }
+  return null;
+}
+function getOffsetParent(element) {
+  var window2 = getWindow(element);
+  var offsetParent = getTrueOffsetParent(element);
+  while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === "static") {
+    offsetParent = getTrueOffsetParent(offsetParent);
+  }
+  if (offsetParent && (getNodeName(offsetParent) === "html" || getNodeName(offsetParent) === "body" && getComputedStyle(offsetParent).position === "static")) {
+    return window2;
+  }
+  return offsetParent || getContainingBlock(element) || window2;
+}
+function getMainAxisFromPlacement(placement) {
+  return ["top", "bottom"].indexOf(placement) >= 0 ? "x" : "y";
+}
+function within(min$1, value, max$1) {
+  return max(min$1, min(value, max$1));
+}
+function withinMaxClamp(min2, value, max2) {
+  var v = within(min2, value, max2);
+  return v > max2 ? max2 : v;
+}
+function getFreshSideObject() {
+  return {
+    top: 0,
+    right: 0,
+    bottom: 0,
+    left: 0
+  };
+}
+function mergePaddingObject(paddingObject) {
+  return Object.assign({}, getFreshSideObject(), paddingObject);
+}
+function expandToHashMap(value, keys) {
+  return keys.reduce(function(hashMap, key) {
+    hashMap[key] = value;
+    return hashMap;
+  }, {});
+}
+var toPaddingObject = function toPaddingObject2(padding, state) {
+  padding = typeof padding === "function" ? padding(Object.assign({}, state.rects, {
+    placement: state.placement
+  })) : padding;
+  return mergePaddingObject(typeof padding !== "number" ? padding : expandToHashMap(padding, basePlacements));
+};
+function arrow$1(_ref) {
+  var _state$modifiersData$;
+  var state = _ref.state, name = _ref.name, options = _ref.options;
+  var arrowElement = state.elements.arrow;
+  var popperOffsets2 = state.modifiersData.popperOffsets;
+  var basePlacement = getBasePlacement(state.placement);
+  var axis = getMainAxisFromPlacement(basePlacement);
+  var isVertical = [left, right].indexOf(basePlacement) >= 0;
+  var len = isVertical ? "height" : "width";
+  if (!arrowElement || !popperOffsets2) {
+    return;
+  }
+  var paddingObject = toPaddingObject(options.padding, state);
+  var arrowRect = getLayoutRect(arrowElement);
+  var minProp = axis === "y" ? top : left;
+  var maxProp = axis === "y" ? bottom : right;
+  var endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets2[axis] - state.rects.popper[len];
+  var startDiff = popperOffsets2[axis] - state.rects.reference[axis];
+  var arrowOffsetParent = getOffsetParent(arrowElement);
+  var clientSize = arrowOffsetParent ? axis === "y" ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
+  var centerToReference = endDiff / 2 - startDiff / 2;
+  var min2 = paddingObject[minProp];
+  var max2 = clientSize - arrowRect[len] - paddingObject[maxProp];
+  var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;
+  var offset2 = within(min2, center, max2);
+  var axisProp = axis;
+  state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset2, _state$modifiersData$.centerOffset = offset2 - center, _state$modifiersData$);
+}
+function effect$1(_ref2) {
+  var state = _ref2.state, options = _ref2.options;
+  var _options$element = options.element, arrowElement = _options$element === void 0 ? "[data-popper-arrow]" : _options$element;
+  if (arrowElement == null) {
+    return;
+  }
+  if (typeof arrowElement === "string") {
+    arrowElement = state.elements.popper.querySelector(arrowElement);
+    if (!arrowElement) {
+      return;
+    }
+  }
+  if (!contains(state.elements.popper, arrowElement)) {
+    return;
+  }
+  state.elements.arrow = arrowElement;
+}
+const arrow$2 = {
+  name: "arrow",
+  enabled: true,
+  phase: "main",
+  fn: arrow$1,
+  effect: effect$1,
+  requires: ["popperOffsets"],
+  requiresIfExists: ["preventOverflow"]
+};
+function getVariation(placement) {
+  return placement.split("-")[1];
+}
+var unsetSides = {
+  top: "auto",
+  right: "auto",
+  bottom: "auto",
+  left: "auto"
+};
+function roundOffsetsByDPR(_ref, win) {
+  var x = _ref.x, y = _ref.y;
+  var dpr = win.devicePixelRatio || 1;
+  return {
+    x: round(x * dpr) / dpr || 0,
+    y: round(y * dpr) / dpr || 0
+  };
+}
+function mapToStyles(_ref2) {
+  var _Object$assign2;
+  var popper2 = _ref2.popper, popperRect = _ref2.popperRect, placement = _ref2.placement, variation = _ref2.variation, offsets = _ref2.offsets, position = _ref2.position, gpuAcceleration = _ref2.gpuAcceleration, adaptive = _ref2.adaptive, roundOffsets = _ref2.roundOffsets, isFixed = _ref2.isFixed;
+  var _offsets$x = offsets.x, x = _offsets$x === void 0 ? 0 : _offsets$x, _offsets$y = offsets.y, y = _offsets$y === void 0 ? 0 : _offsets$y;
+  var _ref3 = typeof roundOffsets === "function" ? roundOffsets({
+    x,
+    y
+  }) : {
+    x,
+    y
+  };
+  x = _ref3.x;
+  y = _ref3.y;
+  var hasX = offsets.hasOwnProperty("x");
+  var hasY = offsets.hasOwnProperty("y");
+  var sideX = left;
+  var sideY = top;
+  var win = window;
+  if (adaptive) {
+    var offsetParent = getOffsetParent(popper2);
+    var heightProp = "clientHeight";
+    var widthProp = "clientWidth";
+    if (offsetParent === getWindow(popper2)) {
+      offsetParent = getDocumentElement(popper2);
+      if (getComputedStyle(offsetParent).position !== "static" && position === "absolute") {
+        heightProp = "scrollHeight";
+        widthProp = "scrollWidth";
+      }
+    }
+    offsetParent = offsetParent;
+    if (placement === top || (placement === left || placement === right) && variation === end) {
+      sideY = bottom;
+      var offsetY = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.height : (
+        // $FlowFixMe[prop-missing]
+        offsetParent[heightProp]
+      );
+      y -= offsetY - popperRect.height;
+      y *= gpuAcceleration ? 1 : -1;
+    }
+    if (placement === left || (placement === top || placement === bottom) && variation === end) {
+      sideX = right;
+      var offsetX = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.width : (
+        // $FlowFixMe[prop-missing]
+        offsetParent[widthProp]
+      );
+      x -= offsetX - popperRect.width;
+      x *= gpuAcceleration ? 1 : -1;
+    }
+  }
+  var commonStyles = Object.assign({
+    position
+  }, adaptive && unsetSides);
+  var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
+    x,
+    y
+  }, getWindow(popper2)) : {
+    x,
+    y
+  };
+  x = _ref4.x;
+  y = _ref4.y;
+  if (gpuAcceleration) {
+    var _Object$assign;
+    return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? "0" : "", _Object$assign[sideX] = hasX ? "0" : "", _Object$assign.transform = (win.devicePixelRatio || 1) <= 1 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
+  }
+  return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : "", _Object$assign2[sideX] = hasX ? x + "px" : "", _Object$assign2.transform = "", _Object$assign2));
+}
+function computeStyles(_ref5) {
+  var state = _ref5.state, options = _ref5.options;
+  var _options$gpuAccelerat = options.gpuAcceleration, gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat, _options$adaptive = options.adaptive, adaptive = _options$adaptive === void 0 ? true : _options$adaptive, _options$roundOffsets = options.roundOffsets, roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
+  var commonStyles = {
+    placement: getBasePlacement(state.placement),
+    variation: getVariation(state.placement),
+    popper: state.elements.popper,
+    popperRect: state.rects.popper,
+    gpuAcceleration,
+    isFixed: state.options.strategy === "fixed"
+  };
+  if (state.modifiersData.popperOffsets != null) {
+    state.styles.popper = Object.assign({}, state.styles.popper, mapToStyles(Object.assign({}, commonStyles, {
+      offsets: state.modifiersData.popperOffsets,
+      position: state.options.strategy,
+      adaptive,
+      roundOffsets
+    })));
+  }
+  if (state.modifiersData.arrow != null) {
+    state.styles.arrow = Object.assign({}, state.styles.arrow, mapToStyles(Object.assign({}, commonStyles, {
+      offsets: state.modifiersData.arrow,
+      position: "absolute",
+      adaptive: false,
+      roundOffsets
+    })));
+  }
+  state.attributes.popper = Object.assign({}, state.attributes.popper, {
+    "data-popper-placement": state.placement
+  });
+}
+const computeStyles$1 = {
+  name: "computeStyles",
+  enabled: true,
+  phase: "beforeWrite",
+  fn: computeStyles,
+  data: {}
+};
+var passive = {
+  passive: true
+};
+function effect(_ref) {
+  var state = _ref.state, instance = _ref.instance, options = _ref.options;
+  var _options$scroll = options.scroll, scroll = _options$scroll === void 0 ? true : _options$scroll, _options$resize = options.resize, resize = _options$resize === void 0 ? true : _options$resize;
+  var window2 = getWindow(state.elements.popper);
+  var scrollParents = [].concat(state.scrollParents.reference, state.scrollParents.popper);
+  if (scroll) {
+    scrollParents.forEach(function(scrollParent) {
+      scrollParent.addEventListener("scroll", instance.update, passive);
+    });
+  }
+  if (resize) {
+    window2.addEventListener("resize", instance.update, passive);
+  }
+  return function() {
+    if (scroll) {
+      scrollParents.forEach(function(scrollParent) {
+        scrollParent.removeEventListener("scroll", instance.update, passive);
+      });
+    }
+    if (resize) {
+      window2.removeEventListener("resize", instance.update, passive);
+    }
+  };
+}
+const eventListeners = {
+  name: "eventListeners",
+  enabled: true,
+  phase: "write",
+  fn: function fn() {
+  },
+  effect,
+  data: {}
+};
+var hash$1 = {
+  left: "right",
+  right: "left",
+  bottom: "top",
+  top: "bottom"
+};
+function getOppositePlacement(placement) {
+  return placement.replace(/left|right|bottom|top/g, function(matched) {
+    return hash$1[matched];
+  });
+}
+var hash = {
+  start: "end",
+  end: "start"
+};
+function getOppositeVariationPlacement(placement) {
+  return placement.replace(/start|end/g, function(matched) {
+    return hash[matched];
+  });
+}
+function getWindowScroll(node) {
+  var win = getWindow(node);
+  var scrollLeft = win.pageXOffset;
+  var scrollTop = win.pageYOffset;
+  return {
+    scrollLeft,
+    scrollTop
+  };
+}
+function getWindowScrollBarX(element) {
+  return getBoundingClientRect(getDocumentElement(element)).left + getWindowScroll(element).scrollLeft;
+}
+function getViewportRect(element, strategy) {
+  var win = getWindow(element);
+  var html = getDocumentElement(element);
+  var visualViewport = win.visualViewport;
+  var width = html.clientWidth;
+  var height = html.clientHeight;
+  var x = 0;
+  var y = 0;
+  if (visualViewport) {
+    width = visualViewport.width;
+    height = visualViewport.height;
+    var layoutViewport = isLayoutViewport();
+    if (layoutViewport || !layoutViewport && strategy === "fixed") {
+      x = visualViewport.offsetLeft;
+      y = visualViewport.offsetTop;
+    }
+  }
+  return {
+    width,
+    height,
+    x: x + getWindowScrollBarX(element),
+    y
+  };
+}
+function getDocumentRect(element) {
+  var _element$ownerDocumen;
+  var html = getDocumentElement(element);
+  var winScroll = getWindowScroll(element);
+  var body = (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body;
+  var width = max(html.scrollWidth, html.clientWidth, body ? body.scrollWidth : 0, body ? body.clientWidth : 0);
+  var height = max(html.scrollHeight, html.clientHeight, body ? body.scrollHeight : 0, body ? body.clientHeight : 0);
+  var x = -winScroll.scrollLeft + getWindowScrollBarX(element);
+  var y = -winScroll.scrollTop;
+  if (getComputedStyle(body || html).direction === "rtl") {
+    x += max(html.clientWidth, body ? body.clientWidth : 0) - width;
+  }
+  return {
+    width,
+    height,
+    x,
+    y
+  };
+}
+function isScrollParent(element) {
+  var _getComputedStyle = getComputedStyle(element), overflow = _getComputedStyle.overflow, overflowX = _getComputedStyle.overflowX, overflowY = _getComputedStyle.overflowY;
+  return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
+}
+function getScrollParent(node) {
+  if (["html", "body", "#document"].indexOf(getNodeName(node)) >= 0) {
+    return node.ownerDocument.body;
+  }
+  if (isHTMLElement(node) && isScrollParent(node)) {
+    return node;
+  }
+  return getScrollParent(getParentNode(node));
+}
+function listScrollParents(element, list) {
+  var _element$ownerDocumen;
+  if (list === void 0) {
+    list = [];
+  }
+  var scrollParent = getScrollParent(element);
+  var isBody = scrollParent === ((_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body);
+  var win = getWindow(scrollParent);
+  var target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
+  var updatedList = list.concat(target);
+  return isBody ? updatedList : (
+    // $FlowFixMe[incompatible-call]: isBody tells us target will be an HTMLElement here
+    updatedList.concat(listScrollParents(getParentNode(target)))
+  );
+}
+function rectToClientRect(rect) {
+  return Object.assign({}, rect, {
+    left: rect.x,
+    top: rect.y,
+    right: rect.x + rect.width,
+    bottom: rect.y + rect.height
+  });
+}
+function getInnerBoundingClientRect(element, strategy) {
+  var rect = getBoundingClientRect(element, false, strategy === "fixed");
+  rect.top = rect.top + element.clientTop;
+  rect.left = rect.left + element.clientLeft;
+  rect.bottom = rect.top + element.clientHeight;
+  rect.right = rect.left + element.clientWidth;
+  rect.width = element.clientWidth;
+  rect.height = element.clientHeight;
+  rect.x = rect.left;
+  rect.y = rect.top;
+  return rect;
+}
+function getClientRectFromMixedType(element, clippingParent, strategy) {
+  return clippingParent === viewport ? rectToClientRect(getViewportRect(element, strategy)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent, strategy) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
+}
+function getClippingParents(element) {
+  var clippingParents2 = listScrollParents(getParentNode(element));
+  var canEscapeClipping = ["absolute", "fixed"].indexOf(getComputedStyle(element).position) >= 0;
+  var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
+  if (!isElement(clipperElement)) {
+    return [];
+  }
+  return clippingParents2.filter(function(clippingParent) {
+    return isElement(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== "body";
+  });
+}
+function getClippingRect(element, boundary, rootBoundary, strategy) {
+  var mainClippingParents = boundary === "clippingParents" ? getClippingParents(element) : [].concat(boundary);
+  var clippingParents2 = [].concat(mainClippingParents, [rootBoundary]);
+  var firstClippingParent = clippingParents2[0];
+  var clippingRect = clippingParents2.reduce(function(accRect, clippingParent) {
+    var rect = getClientRectFromMixedType(element, clippingParent, 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;
+  }, getClientRectFromMixedType(element, firstClippingParent, strategy));
+  clippingRect.width = clippingRect.right - clippingRect.left;
+  clippingRect.height = clippingRect.bottom - clippingRect.top;
+  clippingRect.x = clippingRect.left;
+  clippingRect.y = clippingRect.top;
+  return clippingRect;
+}
+function computeOffsets(_ref) {
+  var reference2 = _ref.reference, element = _ref.element, placement = _ref.placement;
+  var basePlacement = placement ? getBasePlacement(placement) : null;
+  var variation = placement ? getVariation(placement) : null;
+  var commonX = reference2.x + reference2.width / 2 - element.width / 2;
+  var commonY = reference2.y + reference2.height / 2 - element.height / 2;
+  var offsets;
+  switch (basePlacement) {
+    case top:
+      offsets = {
+        x: commonX,
+        y: reference2.y - element.height
+      };
+      break;
+    case bottom:
+      offsets = {
+        x: commonX,
+        y: reference2.y + reference2.height
+      };
+      break;
+    case right:
+      offsets = {
+        x: reference2.x + reference2.width,
+        y: commonY
+      };
+      break;
+    case left:
+      offsets = {
+        x: reference2.x - element.width,
+        y: commonY
+      };
+      break;
+    default:
+      offsets = {
+        x: reference2.x,
+        y: reference2.y
+      };
+  }
+  var mainAxis = basePlacement ? getMainAxisFromPlacement(basePlacement) : null;
+  if (mainAxis != null) {
+    var len = mainAxis === "y" ? "height" : "width";
+    switch (variation) {
+      case start:
+        offsets[mainAxis] = offsets[mainAxis] - (reference2[len] / 2 - element[len] / 2);
+        break;
+      case end:
+        offsets[mainAxis] = offsets[mainAxis] + (reference2[len] / 2 - element[len] / 2);
+        break;
+    }
+  }
+  return offsets;
+}
+function detectOverflow(state, options) {
+  if (options === void 0) {
+    options = {};
+  }
+  var _options = options, _options$placement = _options.placement, placement = _options$placement === void 0 ? state.placement : _options$placement, _options$strategy = _options.strategy, strategy = _options$strategy === void 0 ? state.strategy : _options$strategy, _options$boundary = _options.boundary, boundary = _options$boundary === void 0 ? clippingParents : _options$boundary, _options$rootBoundary = _options.rootBoundary, rootBoundary = _options$rootBoundary === void 0 ? viewport : _options$rootBoundary, _options$elementConte = _options.elementContext, elementContext = _options$elementConte === void 0 ? popper : _options$elementConte, _options$altBoundary = _options.altBoundary, altBoundary = _options$altBoundary === void 0 ? false : _options$altBoundary, _options$padding = _options.padding, padding = _options$padding === void 0 ? 0 : _options$padding;
+  var paddingObject = mergePaddingObject(typeof padding !== "number" ? padding : expandToHashMap(padding, basePlacements));
+  var altContext = elementContext === popper ? reference : popper;
+  var popperRect = state.rects.popper;
+  var element = state.elements[altBoundary ? altContext : elementContext];
+  var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary, strategy);
+  var referenceClientRect = getBoundingClientRect(state.elements.reference);
+  var popperOffsets2 = computeOffsets({
+    reference: referenceClientRect,
+    element: popperRect,
+    placement
+  });
+  var popperClientRect = rectToClientRect(Object.assign({}, popperRect, popperOffsets2));
+  var elementClientRect = elementContext === popper ? popperClientRect : referenceClientRect;
+  var overflowOffsets = {
+    top: clippingClientRect.top - elementClientRect.top + paddingObject.top,
+    bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
+    left: clippingClientRect.left - elementClientRect.left + paddingObject.left,
+    right: elementClientRect.right - clippingClientRect.right + paddingObject.right
+  };
+  var offsetData = state.modifiersData.offset;
+  if (elementContext === popper && offsetData) {
+    var offset2 = offsetData[placement];
+    Object.keys(overflowOffsets).forEach(function(key) {
+      var multiply = [right, bottom].indexOf(key) >= 0 ? 1 : -1;
+      var axis = [top, bottom].indexOf(key) >= 0 ? "y" : "x";
+      overflowOffsets[key] += offset2[axis] * multiply;
+    });
+  }
+  return overflowOffsets;
+}
+function computeAutoPlacement(state, options) {
+  if (options === void 0) {
+    options = {};
+  }
+  var _options = options, placement = _options.placement, boundary = _options.boundary, rootBoundary = _options.rootBoundary, padding = _options.padding, flipVariations = _options.flipVariations, _options$allowedAutoP = _options.allowedAutoPlacements, allowedAutoPlacements = _options$allowedAutoP === void 0 ? placements : _options$allowedAutoP;
+  var variation = getVariation(placement);
+  var placements$1 = variation ? flipVariations ? variationPlacements : variationPlacements.filter(function(placement2) {
+    return getVariation(placement2) === variation;
+  }) : basePlacements;
+  var allowedPlacements = placements$1.filter(function(placement2) {
+    return allowedAutoPlacements.indexOf(placement2) >= 0;
+  });
+  if (allowedPlacements.length === 0) {
+    allowedPlacements = placements$1;
+  }
+  var overflows = allowedPlacements.reduce(function(acc, placement2) {
+    acc[placement2] = detectOverflow(state, {
+      placement: placement2,
+      boundary,
+      rootBoundary,
+      padding
+    })[getBasePlacement(placement2)];
+    return acc;
+  }, {});
+  return Object.keys(overflows).sort(function(a, b) {
+    return overflows[a] - overflows[b];
+  });
+}
+function getExpandedFallbackPlacements(placement) {
+  if (getBasePlacement(placement) === auto) {
+    return [];
+  }
+  var oppositePlacement = getOppositePlacement(placement);
+  return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];
+}
+function flip(_ref) {
+  var state = _ref.state, options = _ref.options, name = _ref.name;
+  if (state.modifiersData[name]._skip) {
+    return;
+  }
+  var _options$mainAxis = options.mainAxis, checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis, _options$altAxis = options.altAxis, checkAltAxis = _options$altAxis === void 0 ? true : _options$altAxis, specifiedFallbackPlacements = options.fallbackPlacements, padding = options.padding, boundary = options.boundary, rootBoundary = options.rootBoundary, altBoundary = options.altBoundary, _options$flipVariatio = options.flipVariations, flipVariations = _options$flipVariatio === void 0 ? true : _options$flipVariatio, allowedAutoPlacements = options.allowedAutoPlacements;
+  var preferredPlacement = state.options.placement;
+  var basePlacement = getBasePlacement(preferredPlacement);
+  var isBasePlacement = basePlacement === preferredPlacement;
+  var fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipVariations ? [getOppositePlacement(preferredPlacement)] : getExpandedFallbackPlacements(preferredPlacement));
+  var placements2 = [preferredPlacement].concat(fallbackPlacements).reduce(function(acc, placement2) {
+    return acc.concat(getBasePlacement(placement2) === auto ? computeAutoPlacement(state, {
+      placement: placement2,
+      boundary,
+      rootBoundary,
+      padding,
+      flipVariations,
+      allowedAutoPlacements
+    }) : placement2);
+  }, []);
+  var referenceRect = state.rects.reference;
+  var popperRect = state.rects.popper;
+  var checksMap = /* @__PURE__ */ new Map();
+  var makeFallbackChecks = true;
+  var firstFittingPlacement = placements2[0];
+  for (var i = 0; i < placements2.length; i++) {
+    var placement = placements2[i];
+    var _basePlacement = getBasePlacement(placement);
+    var isStartVariation = getVariation(placement) === start;
+    var isVertical = [top, bottom].indexOf(_basePlacement) >= 0;
+    var len = isVertical ? "width" : "height";
+    var overflow = detectOverflow(state, {
+      placement,
+      boundary,
+      rootBoundary,
+      altBoundary,
+      padding
+    });
+    var mainVariationSide = isVertical ? isStartVariation ? right : left : isStartVariation ? bottom : top;
+    if (referenceRect[len] > popperRect[len]) {
+      mainVariationSide = getOppositePlacement(mainVariationSide);
+    }
+    var altVariationSide = getOppositePlacement(mainVariationSide);
+    var checks = [];
+    if (checkMainAxis) {
+      checks.push(overflow[_basePlacement] <= 0);
+    }
+    if (checkAltAxis) {
+      checks.push(overflow[mainVariationSide] <= 0, overflow[altVariationSide] <= 0);
+    }
+    if (checks.every(function(check) {
+      return check;
+    })) {
+      firstFittingPlacement = placement;
+      makeFallbackChecks = false;
+      break;
+    }
+    checksMap.set(placement, checks);
+  }
+  if (makeFallbackChecks) {
+    var numberOfChecks = flipVariations ? 3 : 1;
+    var _loop = function _loop2(_i2) {
+      var fittingPlacement = placements2.find(function(placement2) {
+        var checks2 = checksMap.get(placement2);
+        if (checks2) {
+          return checks2.slice(0, _i2).every(function(check) {
+            return check;
+          });
+        }
+      });
+      if (fittingPlacement) {
+        firstFittingPlacement = fittingPlacement;
+        return "break";
+      }
+    };
+    for (var _i = numberOfChecks; _i > 0; _i--) {
+      var _ret = _loop(_i);
+      if (_ret === "break") break;
+    }
+  }
+  if (state.placement !== firstFittingPlacement) {
+    state.modifiersData[name]._skip = true;
+    state.placement = firstFittingPlacement;
+    state.reset = true;
+  }
+}
+const flip$1 = {
+  name: "flip",
+  enabled: true,
+  phase: "main",
+  fn: flip,
+  requiresIfExists: ["offset"],
+  data: {
+    _skip: false
+  }
+};
+function getSideOffsets(overflow, rect, preventedOffsets) {
+  if (preventedOffsets === void 0) {
+    preventedOffsets = {
+      x: 0,
+      y: 0
+    };
+  }
+  return {
+    top: overflow.top - rect.height - preventedOffsets.y,
+    right: overflow.right - rect.width + preventedOffsets.x,
+    bottom: overflow.bottom - rect.height + preventedOffsets.y,
+    left: overflow.left - rect.width - preventedOffsets.x
+  };
+}
+function isAnySideFullyClipped(overflow) {
+  return [top, right, bottom, left].some(function(side) {
+    return overflow[side] >= 0;
+  });
+}
+function hide(_ref) {
+  var state = _ref.state, name = _ref.name;
+  var referenceRect = state.rects.reference;
+  var popperRect = state.rects.popper;
+  var preventedOffsets = state.modifiersData.preventOverflow;
+  var referenceOverflow = detectOverflow(state, {
+    elementContext: "reference"
+  });
+  var popperAltOverflow = detectOverflow(state, {
+    altBoundary: true
+  });
+  var referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect);
+  var popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets);
+  var isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets);
+  var hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets);
+  state.modifiersData[name] = {
+    referenceClippingOffsets,
+    popperEscapeOffsets,
+    isReferenceHidden,
+    hasPopperEscaped
+  };
+  state.attributes.popper = Object.assign({}, state.attributes.popper, {
+    "data-popper-reference-hidden": isReferenceHidden,
+    "data-popper-escaped": hasPopperEscaped
+  });
+}
+const hide$1 = {
+  name: "hide",
+  enabled: true,
+  phase: "main",
+  requiresIfExists: ["preventOverflow"],
+  fn: hide
+};
+function distanceAndSkiddingToXY(placement, rects, offset2) {
+  var basePlacement = getBasePlacement(placement);
+  var invertDistance = [left, top].indexOf(basePlacement) >= 0 ? -1 : 1;
+  var _ref = typeof offset2 === "function" ? offset2(Object.assign({}, rects, {
+    placement
+  })) : offset2, skidding = _ref[0], distance = _ref[1];
+  skidding = skidding || 0;
+  distance = (distance || 0) * invertDistance;
+  return [left, right].indexOf(basePlacement) >= 0 ? {
+    x: distance,
+    y: skidding
+  } : {
+    x: skidding,
+    y: distance
+  };
+}
+function offset(_ref2) {
+  var state = _ref2.state, options = _ref2.options, name = _ref2.name;
+  var _options$offset = options.offset, offset2 = _options$offset === void 0 ? [0, 0] : _options$offset;
+  var data = placements.reduce(function(acc, placement) {
+    acc[placement] = distanceAndSkiddingToXY(placement, state.rects, offset2);
+    return acc;
+  }, {});
+  var _data$state$placement = data[state.placement], x = _data$state$placement.x, y = _data$state$placement.y;
+  if (state.modifiersData.popperOffsets != null) {
+    state.modifiersData.popperOffsets.x += x;
+    state.modifiersData.popperOffsets.y += y;
+  }
+  state.modifiersData[name] = data;
+}
+const offset$1 = {
+  name: "offset",
+  enabled: true,
+  phase: "main",
+  requires: ["popperOffsets"],
+  fn: offset
+};
+function popperOffsets(_ref) {
+  var state = _ref.state, name = _ref.name;
+  state.modifiersData[name] = computeOffsets({
+    reference: state.rects.reference,
+    element: state.rects.popper,
+    placement: state.placement
+  });
+}
+const popperOffsets$1 = {
+  name: "popperOffsets",
+  enabled: true,
+  phase: "read",
+  fn: popperOffsets,
+  data: {}
+};
+function getAltAxis(axis) {
+  return axis === "x" ? "y" : "x";
+}
+function preventOverflow(_ref) {
+  var state = _ref.state, options = _ref.options, name = _ref.name;
+  var _options$mainAxis = options.mainAxis, checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis, _options$altAxis = options.altAxis, checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis, boundary = options.boundary, rootBoundary = options.rootBoundary, altBoundary = options.altBoundary, padding = options.padding, _options$tether = options.tether, tether = _options$tether === void 0 ? true : _options$tether, _options$tetherOffset = options.tetherOffset, tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;
+  var overflow = detectOverflow(state, {
+    boundary,
+    rootBoundary,
+    padding,
+    altBoundary
+  });
+  var basePlacement = getBasePlacement(state.placement);
+  var variation = getVariation(state.placement);
+  var isBasePlacement = !variation;
+  var mainAxis = getMainAxisFromPlacement(basePlacement);
+  var altAxis = getAltAxis(mainAxis);
+  var popperOffsets2 = state.modifiersData.popperOffsets;
+  var referenceRect = state.rects.reference;
+  var popperRect = state.rects.popper;
+  var tetherOffsetValue = typeof tetherOffset === "function" ? tetherOffset(Object.assign({}, state.rects, {
+    placement: state.placement
+  })) : tetherOffset;
+  var normalizedTetherOffsetValue = typeof tetherOffsetValue === "number" ? {
+    mainAxis: tetherOffsetValue,
+    altAxis: tetherOffsetValue
+  } : Object.assign({
+    mainAxis: 0,
+    altAxis: 0
+  }, tetherOffsetValue);
+  var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
+  var data = {
+    x: 0,
+    y: 0
+  };
+  if (!popperOffsets2) {
+    return;
+  }
+  if (checkMainAxis) {
+    var _offsetModifierState$;
+    var mainSide = mainAxis === "y" ? top : left;
+    var altSide = mainAxis === "y" ? bottom : right;
+    var len = mainAxis === "y" ? "height" : "width";
+    var offset2 = popperOffsets2[mainAxis];
+    var min$1 = offset2 + overflow[mainSide];
+    var max$1 = offset2 - overflow[altSide];
+    var additive = tether ? -popperRect[len] / 2 : 0;
+    var minLen = variation === start ? referenceRect[len] : popperRect[len];
+    var maxLen = variation === start ? -popperRect[len] : -referenceRect[len];
+    var arrowElement = state.elements.arrow;
+    var arrowRect = tether && arrowElement ? getLayoutRect(arrowElement) : {
+      width: 0,
+      height: 0
+    };
+    var arrowPaddingObject = state.modifiersData["arrow#persistent"] ? state.modifiersData["arrow#persistent"].padding : getFreshSideObject();
+    var arrowPaddingMin = arrowPaddingObject[mainSide];
+    var arrowPaddingMax = arrowPaddingObject[altSide];
+    var arrowLen = within(0, referenceRect[len], arrowRect[len]);
+    var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
+    var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
+    var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
+    var clientOffset = arrowOffsetParent ? mainAxis === "y" ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
+    var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
+    var tetherMin = offset2 + minOffset - offsetModifierValue - clientOffset;
+    var tetherMax = offset2 + maxOffset - offsetModifierValue;
+    var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset2, tether ? max(max$1, tetherMax) : max$1);
+    popperOffsets2[mainAxis] = preventedOffset;
+    data[mainAxis] = preventedOffset - offset2;
+  }
+  if (checkAltAxis) {
+    var _offsetModifierState$2;
+    var _mainSide = mainAxis === "x" ? top : left;
+    var _altSide = mainAxis === "x" ? bottom : right;
+    var _offset = popperOffsets2[altAxis];
+    var _len = altAxis === "y" ? "height" : "width";
+    var _min = _offset + overflow[_mainSide];
+    var _max = _offset - overflow[_altSide];
+    var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
+    var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
+    var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
+    var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
+    var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
+    popperOffsets2[altAxis] = _preventedOffset;
+    data[altAxis] = _preventedOffset - _offset;
+  }
+  state.modifiersData[name] = data;
+}
+const preventOverflow$1 = {
+  name: "preventOverflow",
+  enabled: true,
+  phase: "main",
+  fn: preventOverflow,
+  requiresIfExists: ["offset"]
+};
+function getHTMLElementScroll(element) {
+  return {
+    scrollLeft: element.scrollLeft,
+    scrollTop: element.scrollTop
+  };
+}
+function getNodeScroll(node) {
+  if (node === getWindow(node) || !isHTMLElement(node)) {
+    return getWindowScroll(node);
+  } else {
+    return getHTMLElementScroll(node);
+  }
+}
+function isElementScaled(element) {
+  var rect = element.getBoundingClientRect();
+  var scaleX = round(rect.width) / element.offsetWidth || 1;
+  var scaleY = round(rect.height) / element.offsetHeight || 1;
+  return scaleX !== 1 || scaleY !== 1;
+}
+function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
+  if (isFixed === void 0) {
+    isFixed = false;
+  }
+  var isOffsetParentAnElement = isHTMLElement(offsetParent);
+  var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
+  var documentElement = getDocumentElement(offsetParent);
+  var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled, isFixed);
+  var scroll = {
+    scrollLeft: 0,
+    scrollTop: 0
+  };
+  var offsets = {
+    x: 0,
+    y: 0
+  };
+  if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
+    if (getNodeName(offsetParent) !== "body" || // https://github.com/popperjs/popper-core/issues/1078
+    isScrollParent(documentElement)) {
+      scroll = getNodeScroll(offsetParent);
+    }
+    if (isHTMLElement(offsetParent)) {
+      offsets = getBoundingClientRect(offsetParent, true);
+      offsets.x += offsetParent.clientLeft;
+      offsets.y += offsetParent.clientTop;
+    } else if (documentElement) {
+      offsets.x = getWindowScrollBarX(documentElement);
+    }
+  }
+  return {
+    x: rect.left + scroll.scrollLeft - offsets.x,
+    y: rect.top + scroll.scrollTop - offsets.y,
+    width: rect.width,
+    height: rect.height
+  };
+}
+function order(modifiers) {
+  var map = /* @__PURE__ */ new Map();
+  var visited = /* @__PURE__ */ new Set();
+  var result = [];
+  modifiers.forEach(function(modifier) {
+    map.set(modifier.name, modifier);
+  });
+  function sort(modifier) {
+    visited.add(modifier.name);
+    var requires = [].concat(modifier.requires || [], modifier.requiresIfExists || []);
+    requires.forEach(function(dep) {
+      if (!visited.has(dep)) {
+        var depModifier = map.get(dep);
+        if (depModifier) {
+          sort(depModifier);
+        }
+      }
+    });
+    result.push(modifier);
+  }
+  modifiers.forEach(function(modifier) {
+    if (!visited.has(modifier.name)) {
+      sort(modifier);
+    }
+  });
+  return result;
+}
+function orderModifiers(modifiers) {
+  var orderedModifiers = order(modifiers);
+  return modifierPhases.reduce(function(acc, phase) {
+    return acc.concat(orderedModifiers.filter(function(modifier) {
+      return modifier.phase === phase;
+    }));
+  }, []);
+}
+function debounce(fn2) {
+  var pending;
+  return function() {
+    if (!pending) {
+      pending = new Promise(function(resolve) {
+        Promise.resolve().then(function() {
+          pending = void 0;
+          resolve(fn2());
+        });
+      });
+    }
+    return pending;
+  };
+}
+function mergeByName(modifiers) {
+  var merged = modifiers.reduce(function(merged2, current) {
+    var existing = merged2[current.name];
+    merged2[current.name] = existing ? Object.assign({}, existing, current, {
+      options: Object.assign({}, existing.options, current.options),
+      data: Object.assign({}, existing.data, current.data)
+    }) : current;
+    return merged2;
+  }, {});
+  return Object.keys(merged).map(function(key) {
+    return merged[key];
+  });
+}
+var DEFAULT_OPTIONS = {
+  placement: "bottom",
+  modifiers: [],
+  strategy: "absolute"
+};
+function areValidElements() {
+  for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+    args[_key] = arguments[_key];
+  }
+  return !args.some(function(element) {
+    return !(element && typeof element.getBoundingClientRect === "function");
+  });
+}
+function popperGenerator(generatorOptions) {
+  if (generatorOptions === void 0) {
+    generatorOptions = {};
+  }
+  var _generatorOptions = generatorOptions, _generatorOptions$def = _generatorOptions.defaultModifiers, defaultModifiers2 = _generatorOptions$def === void 0 ? [] : _generatorOptions$def, _generatorOptions$def2 = _generatorOptions.defaultOptions, defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;
+  return function createPopper2(reference2, popper2, options) {
+    if (options === void 0) {
+      options = defaultOptions;
+    }
+    var state = {
+      placement: "bottom",
+      orderedModifiers: [],
+      options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),
+      modifiersData: {},
+      elements: {
+        reference: reference2,
+        popper: popper2
+      },
+      attributes: {},
+      styles: {}
+    };
+    var effectCleanupFns = [];
+    var isDestroyed = false;
+    var instance = {
+      state,
+      setOptions: function setOptions(setOptionsAction) {
+        var options2 = typeof setOptionsAction === "function" ? setOptionsAction(state.options) : setOptionsAction;
+        cleanupModifierEffects();
+        state.options = Object.assign({}, defaultOptions, state.options, options2);
+        state.scrollParents = {
+          reference: isElement(reference2) ? listScrollParents(reference2) : reference2.contextElement ? listScrollParents(reference2.contextElement) : [],
+          popper: listScrollParents(popper2)
+        };
+        var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers2, state.options.modifiers)));
+        state.orderedModifiers = orderedModifiers.filter(function(m) {
+          return m.enabled;
+        });
+        runModifierEffects();
+        return instance.update();
+      },
+      // Sync update – it will always be executed, even if not necessary. This
+      // is useful for low frequency updates where sync behavior simplifies the
+      // logic.
+      // For high frequency updates (e.g. `resize` and `scroll` events), always
+      // prefer the async Popper#update method
+      forceUpdate: function forceUpdate() {
+        if (isDestroyed) {
+          return;
+        }
+        var _state$elements = state.elements, reference3 = _state$elements.reference, popper3 = _state$elements.popper;
+        if (!areValidElements(reference3, popper3)) {
+          return;
+        }
+        state.rects = {
+          reference: getCompositeRect(reference3, getOffsetParent(popper3), state.options.strategy === "fixed"),
+          popper: getLayoutRect(popper3)
+        };
+        state.reset = false;
+        state.placement = state.options.placement;
+        state.orderedModifiers.forEach(function(modifier) {
+          return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);
+        });
+        for (var index = 0; index < state.orderedModifiers.length; index++) {
+          if (state.reset === true) {
+            state.reset = false;
+            index = -1;
+            continue;
+          }
+          var _state$orderedModifie = state.orderedModifiers[index], fn2 = _state$orderedModifie.fn, _state$orderedModifie2 = _state$orderedModifie.options, _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2, name = _state$orderedModifie.name;
+          if (typeof fn2 === "function") {
+            state = fn2({
+              state,
+              options: _options,
+              name,
+              instance
+            }) || state;
+          }
+        }
+      },
+      // Async and optimistically optimized update – it will not be executed if
+      // not necessary (debounced to run at most once-per-tick)
+      update: debounce(function() {
+        return new Promise(function(resolve) {
+          instance.forceUpdate();
+          resolve(state);
+        });
+      }),
+      destroy: function destroy() {
+        cleanupModifierEffects();
+        isDestroyed = true;
+      }
+    };
+    if (!areValidElements(reference2, popper2)) {
+      return instance;
+    }
+    instance.setOptions(options).then(function(state2) {
+      if (!isDestroyed && options.onFirstUpdate) {
+        options.onFirstUpdate(state2);
+      }
+    });
+    function runModifierEffects() {
+      state.orderedModifiers.forEach(function(_ref) {
+        var name = _ref.name, _ref$options = _ref.options, options2 = _ref$options === void 0 ? {} : _ref$options, effect2 = _ref.effect;
+        if (typeof effect2 === "function") {
+          var cleanupFn = effect2({
+            state,
+            name,
+            instance,
+            options: options2
+          });
+          var noopFn = function noopFn2() {
+          };
+          effectCleanupFns.push(cleanupFn || noopFn);
+        }
+      });
+    }
+    function cleanupModifierEffects() {
+      effectCleanupFns.forEach(function(fn2) {
+        return fn2();
+      });
+      effectCleanupFns = [];
+    }
+    return instance;
+  };
+}
+var defaultModifiers = [eventListeners, popperOffsets$1, computeStyles$1, applyStyles$1, offset$1, flip$1, preventOverflow$1, arrow$2, hide$1];
+var createPopper = /* @__PURE__ */ popperGenerator({
+  defaultModifiers
+});
+var reactFastCompare;
+var hasRequiredReactFastCompare;
+function requireReactFastCompare() {
+  if (hasRequiredReactFastCompare) return reactFastCompare;
+  hasRequiredReactFastCompare = 1;
+  var hasElementType = typeof Element !== "undefined";
+  var hasMap = typeof Map === "function";
+  var hasSet = typeof Set === "function";
+  var hasArrayBuffer = typeof ArrayBuffer === "function" && !!ArrayBuffer.isView;
+  function equal(a, b) {
+    if (a === b) return true;
+    if (a && b && typeof a == "object" && typeof b == "object") {
+      if (a.constructor !== b.constructor) return false;
+      var length, i, keys;
+      if (Array.isArray(a)) {
+        length = a.length;
+        if (length != b.length) return false;
+        for (i = length; i-- !== 0; )
+          if (!equal(a[i], b[i])) return false;
+        return true;
+      }
+      var it;
+      if (hasMap && a instanceof Map && b instanceof Map) {
+        if (a.size !== b.size) return false;
+        it = a.entries();
+        while (!(i = it.next()).done)
+          if (!b.has(i.value[0])) return false;
+        it = a.entries();
+        while (!(i = it.next()).done)
+          if (!equal(i.value[1], b.get(i.value[0]))) return false;
+        return true;
+      }
+      if (hasSet && a instanceof Set && b instanceof Set) {
+        if (a.size !== b.size) return false;
+        it = a.entries();
+        while (!(i = it.next()).done)
+          if (!b.has(i.value[0])) return false;
+        return true;
+      }
+      if (hasArrayBuffer && ArrayBuffer.isView(a) && ArrayBuffer.isView(b)) {
+        length = a.length;
+        if (length != b.length) return false;
+        for (i = length; i-- !== 0; )
+          if (a[i] !== b[i]) return false;
+        return true;
+      }
+      if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;
+      if (a.valueOf !== Object.prototype.valueOf && typeof a.valueOf === "function" && typeof b.valueOf === "function") return a.valueOf() === b.valueOf();
+      if (a.toString !== Object.prototype.toString && typeof a.toString === "function" && typeof b.toString === "function") return a.toString() === b.toString();
+      keys = Object.keys(a);
+      length = keys.length;
+      if (length !== Object.keys(b).length) return false;
+      for (i = length; i-- !== 0; )
+        if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;
+      if (hasElementType && a instanceof Element) return false;
+      for (i = length; i-- !== 0; ) {
+        if ((keys[i] === "_owner" || keys[i] === "__v" || keys[i] === "__o") && a.$$typeof) {
+          continue;
+        }
+        if (!equal(a[keys[i]], b[keys[i]])) return false;
+      }
+      return true;
+    }
+    return a !== a && b !== b;
+  }
+  reactFastCompare = function isEqual2(a, b) {
+    try {
+      return equal(a, b);
+    } catch (error) {
+      if ((error.message || "").match(/stack|recursion/i)) {
+        console.warn("react-fast-compare cannot handle circular refs");
+        return false;
+      }
+      throw error;
+    }
+  };
+  return reactFastCompare;
+}
+var reactFastCompareExports = requireReactFastCompare();
+const isEqual = /* @__PURE__ */ getDefaultExportFromCjs(reactFastCompareExports);
+var EMPTY_MODIFIERS = [];
+var usePopper$1 = function usePopper(referenceElement, popperElement, options) {
+  if (options === void 0) {
+    options = {};
+  }
+  var prevOptions = React.useRef(null);
+  var optionsWithDefaults = {
+    onFirstUpdate: options.onFirstUpdate,
+    placement: options.placement || "bottom",
+    strategy: options.strategy || "absolute",
+    modifiers: options.modifiers || EMPTY_MODIFIERS
+  };
+  var _React$useState = React.useState({
+    styles: {
+      popper: {
+        position: optionsWithDefaults.strategy,
+        left: "0",
+        top: "0"
+      },
+      arrow: {
+        position: "absolute"
+      }
+    },
+    attributes: {}
+  }), state = _React$useState[0], setState = _React$useState[1];
+  var updateStateModifier = React.useMemo(function() {
+    return {
+      name: "updateState",
+      enabled: true,
+      phase: "write",
+      fn: function fn2(_ref) {
+        var state2 = _ref.state;
+        var elements = Object.keys(state2.elements);
+        ReactDOM.flushSync(function() {
+          setState({
+            styles: fromEntries(elements.map(function(element) {
+              return [element, state2.styles[element] || {}];
+            })),
+            attributes: fromEntries(elements.map(function(element) {
+              return [element, state2.attributes[element]];
+            }))
+          });
+        });
+      },
+      requires: ["computeStyles"]
+    };
+  }, []);
+  var popperOptions = React.useMemo(function() {
+    var newOptions = {
+      onFirstUpdate: optionsWithDefaults.onFirstUpdate,
+      placement: optionsWithDefaults.placement,
+      strategy: optionsWithDefaults.strategy,
+      modifiers: [].concat(optionsWithDefaults.modifiers, [updateStateModifier, {
+        name: "applyStyles",
+        enabled: false
+      }])
+    };
+    if (isEqual(prevOptions.current, newOptions)) {
+      return prevOptions.current || newOptions;
+    } else {
+      prevOptions.current = newOptions;
+      return newOptions;
+    }
+  }, [optionsWithDefaults.onFirstUpdate, optionsWithDefaults.placement, optionsWithDefaults.strategy, optionsWithDefaults.modifiers, updateStateModifier]);
+  var popperInstanceRef = React.useRef();
+  useIsomorphicLayoutEffect(function() {
+    if (popperInstanceRef.current) {
+      popperInstanceRef.current.setOptions(popperOptions);
+    }
+  }, [popperOptions]);
+  useIsomorphicLayoutEffect(function() {
+    if (referenceElement == null || popperElement == null) {
+      return;
+    }
+    var createPopper$1 = options.createPopper || createPopper;
+    var popperInstance = createPopper$1(referenceElement, popperElement, popperOptions);
+    popperInstanceRef.current = popperInstance;
+    return function() {
+      popperInstance.destroy();
+      popperInstanceRef.current = null;
+    };
+  }, [referenceElement, popperElement, options.createPopper]);
+  return {
+    state: popperInstanceRef.current ? popperInstanceRef.current.state : null,
+    styles: state.styles,
+    attributes: state.attributes,
+    update: popperInstanceRef.current ? popperInstanceRef.current.update : null,
+    forceUpdate: popperInstanceRef.current ? popperInstanceRef.current.forceUpdate : null
+  };
+};
+function usePopper2(options) {
+  const [ref, setRef] = React.useState(null);
+  const [popper2, setPopper] = React.useState(null);
+  const { styles, attributes, update } = usePopper$1(ref, popper2, {
+    ...options
+  });
+  return { ref, setRef, popper: popper2, setPopper, styles, attributes, update };
+}
+const getPortalWrapperTestId = (id) => `${id}-portal-wrapper-test-id`;
+const getPortalWrapperId = (id) => `${id}-portal-wrapper-id`;
+function usePortalWrapper({
+  compId,
+  containerId,
+  shouldMount,
+  className
+}) {
+  const [wrapperEl, setWrapperEl] = React__default.useState();
+  const mountPortalWrapper = React__default.useCallback(
+    () => initWrapperEl(compId, setWrapperEl, containerId, className),
+    [className, compId, containerId]
+  );
+  const unMountPortalWrapper = React__default.useCallback(() => {
+    const wrapperElement = document.getElementById(getPortalWrapperId(compId));
+    if (wrapperElement) {
+      removeFromDOM(wrapperElement);
+    }
+  }, [compId]);
+  React__default.useEffect(() => {
+    {
+      mountPortalWrapper();
+    }
+    return unMountPortalWrapper;
+  }, [shouldMount, unMountPortalWrapper, mountPortalWrapper]);
+  React__default.useEffect(() => () => unMountPortalWrapper(), [unMountPortalWrapper]);
+  return {
+    wrapperEl,
+    mountPortalWrapper,
+    unMountPortalWrapper
+  };
+}
+const createWrapperEl = (id, className) => {
+  const el = document.createElement("div");
+  el.setAttribute("data-testid", getPortalWrapperTestId(id));
+  el.setAttribute("id", getPortalWrapperId(id));
+  if (className) {
+    const classesArray = className.split(" ");
+    classesArray.forEach((singleClassName) => el.classList.add(singleClassName));
+  }
+  return el;
+};
+const initWrapperEl = (id, setWrapperEl, containerId, className) => {
+  let wrapperElement = document.getElementById(getPortalWrapperId(id));
+  if (!wrapperElement) {
+    wrapperElement = createWrapperEl(id, className);
+    let portalContainer = document.body;
+    {
+      portalContainer = document.getElementById(containerId) || document.body;
+    }
+    portalContainer.appendChild(wrapperElement);
+  }
+  setWrapperEl(wrapperElement);
+};
+const removeFromDOM = (el) => el == null ? void 0 : el.remove();
+function usePortalPopper({
+  id,
+  containerId,
+  shouldMountWrapper,
+  popperOptions = {},
+  className
+}) {
+  const {
+    mountPortalWrapper: mountPortalPoppersWrapper,
+    unMountPortalWrapper: unMountPortalPoppersWrapper,
+    wrapperEl: poppersWrapper
+  } = usePortalWrapper({
+    compId: id,
+    shouldMount: shouldMountWrapper,
+    containerId,
+    className
+  });
+  const popperReturnVal = usePopper2(
+    popperOptions
+  );
+  return {
+    ...popperReturnVal,
+    poppersWrapper,
+    mountPortalPoppersWrapper,
+    unMountPortalPoppersWrapper
+  };
+}
+const textDiv = "textDiv__CmQKK";
+const textWithLinkBox = "textWithLinkBox__M40jU";
+const tooltipTextBox = "tooltipTextBox__3WCSS";
+const tooltipButton = "tooltipButton__UQ8an";
+const cookieIcon = "cookieIcon__FyZlm";
+const textButton = "textButton__z-AfY";
+const tooltipTextButton = "tooltipTextButton__9Fi7o";
+const tooltipIconWrapper = "tooltipIconWrapper__Q5IUf";
+const tooltip = "tooltip__Ahucg";
+const showTooltip = "showTooltip__qzdh4";
+const tooltipEntered = "tooltipEntered__B0MHZ";
+const animationBox = "animationBox__uZDo1";
+const arrow = "arrow__crH5d";
+const style = {
+  textDiv,
+  textWithLinkBox,
+  tooltipTextBox,
+  tooltipButton,
+  cookieIcon,
+  textButton,
+  tooltipTextButton,
+  tooltipIconWrapper,
+  tooltip,
+  showTooltip,
+  tooltipEntered,
+  animationBox,
+  arrow
+};
+const ConsentText = ({
+  text,
+  textButtonClass,
+  rootClass,
+  onSettingsClick
+}) => {
+  const { firstText, firstUrlText, secondText } = parseTextWithLinks(text);
+  return /* @__PURE__ */ jsxs("div", { className: rootClass, children: [
+    firstText,
+    firstUrlText && /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: textButtonClass,
+        role: "button",
+        "aria-haspopup": "true",
+        tabIndex: 0,
+        onClick: onSettingsClick,
+        onKeyUp: activateBySpaceOrEnterButton,
+        onKeyDown: cancelBrowserScroll,
+        children: firstUrlText
+      }
+    ),
+    secondText
+  ] });
+};
+const TooltipBox = ({
+  compId,
+  text,
+  isMobile,
+  showPopper,
+  setPopperTargetElem,
+  setIsTooltipClicked,
+  setShowPopper,
+  setArrowElement,
+  onSettingsClick,
+  popperStyles,
+  tooltipButtonRef,
+  showPopperTooltip,
+  hidePopperTooltip,
+  attributes,
+  tooltipOnKeyUp,
+  setIsAnimationEnd
+}) => {
+  const [isTooltipLinkClicked, setIsTooltipLinkClicked] = React.useState(false);
+  const onSettingsClickedWithFocus = () => {
+    setIsTooltipLinkClicked(true);
+    onSettingsClick();
+  };
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      id: `${compId}-tooltip`,
+      "data-hook": `${compId}-tooltip`,
+      ref: setPopperTargetElem,
+      style: popperStyles.popper,
+      className: clsx(style.tooltip, {
+        [style.showTooltip]: showPopper
+      }),
+      tabIndex: -1,
+      role: "tooltip",
+      "aria-labelledby": `${compId}-tooltip-text`,
+      onMouseEnter: showPopperTooltip,
+      onMouseLeave: hidePopperTooltip,
+      onKeyUp: tooltipOnKeyUp,
+      onAnimationEnd: () => {
+        setIsAnimationEnd(true);
+      },
+      onTransitionEnd: (event) => {
+        var _a;
+        if (window.getComputedStyle(event.currentTarget).opacity !== "1" && !isMobile) {
+          setShowPopper(false);
+          setIsTooltipClicked(false);
+          isTooltipLinkClicked ? setIsTooltipLinkClicked(false) : (_a = tooltipButtonRef == null ? void 0 : tooltipButtonRef.current) == null ? void 0 : _a.focus();
+        }
+      },
+      ...attributes.popper,
+      children: /* @__PURE__ */ jsxs("div", { className: style.animationBox, children: [
+        /* @__PURE__ */ jsx("div", { id: `${compId}-tooltip-text`, className: style.tooltipTextBox, children: /* @__PURE__ */ jsx(
+          ConsentText,
+          {
+            text,
+            textButtonClass: style.tooltipTextButton,
+            onSettingsClick: onSettingsClickedWithFocus
+          }
+        ) }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            ref: setArrowElement,
+            className: style.arrow,
+            style: popperStyles.arrow
+          }
+        )
+      ] })
+    }
+  );
+};
+const CookieIcon = ({
+  className,
+  width = 17,
+  height = 17,
+  "aria-hidden": ariaHidden = true
+}) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width,
+    height,
+    viewBox: "0 0 17 17",
+    fill: "currentColor",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-hidden": ariaHidden,
+    className,
+    children: [
+      /* @__PURE__ */ jsx("path", { d: "M6 5.86847C6 6.42075 5.55228 6.86847 5 6.86847C4.44772 6.86847 4 6.42075 4 5.86847C4 5.31618 4.44772 4.86847 5 4.86847C5.55228 4.86847 6 5.31618 6 5.86847Z" }),
+      /* @__PURE__ */ jsx("path", { d: "M10 12.8685C10.5523 12.8685 11 12.4208 11 11.8685C11 11.3162 10.5523 10.8685 10 10.8685C9.44771 10.8685 9 11.3162 9 11.8685C9 12.4208 9.44771 12.8685 10 12.8685Z" }),
+      /* @__PURE__ */ jsx("path", { d: "M6 10.8685C6 11.4208 5.55228 11.8685 5 11.8685C4.44772 11.8685 4 11.4208 4 10.8685C4 10.3162 4.44772 9.86847 5 9.86847C5.55228 9.86847 6 10.3162 6 10.8685Z" }),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M13.0127 6.59135C13.0541 6.14154 12.5808 5.56985 12.1291 5.56985C9.90731 5.56985 8.10617 3.77899 8.10617 1.56985C8.10617 1.51105 8.10745 1.45255 8.10997 1.39438C8.14183 0.660432 7.63543 -0.120086 6.91341 0.0154556C2.97724 0.75437 0 4.19147 0 8.31998C0 12.9876 3.80558 16.7715 8.5 16.7715C12.4009 16.7715 15.688 14.1587 16.6879 10.5972C16.7969 10.209 16.4205 9.86848 16.0172 9.86848C14.3509 9.86848 13 8.52534 13 6.86848C13 6.77505 13.0043 6.68261 13.0127 6.59135ZM7.10617 1.56985C7.10617 4.29386 9.29122 6.50063 12.001 6.56825C12.0045 6.57274 12.0076 6.57702 12.0103 6.58099C12.0035 6.6761 12 6.77197 12 6.86848C12 8.92821 13.5606 10.6168 15.5595 10.8428C14.5198 13.7145 11.7528 15.7715 8.5 15.7715C4.35246 15.7715 1 12.4299 1 8.31998C1 4.71249 3.58298 1.69607 7.02035 1.01327C7.04131 1.0437 7.06493 1.08885 7.08322 1.14759C7.10466 1.21642 7.11366 1.28765 7.11091 1.351C7.10776 1.42363 7.10617 1.49659 7.10617 1.56985Z"
+        }
+      )
+    ]
+  }
+);
+const canUsePortal = typeof ReactDOM__default.createPortal === "function";
+const Tooltip = ({
+  id,
+  datahook,
+  text,
+  ariaLabelText,
+  isMobile,
+  onSettingsClick
+}) => {
+  const [arrowElement, setArrowElement] = React.useState(
+    null
+  );
+  const [showPopper, setShowPopper] = React.useState(false);
+  const [isTooltipClicked, setIsTooltipClicked] = React.useState(false);
+  const [isAnimationEnd, setIsAnimationEnd] = React.useState(false);
+  const [loadTooltip, setLoadTooltip] = React.useState(false);
+  const tooltipButtonRef = React.useRef(null);
+  const compId = `${id}-${datahook}`;
+  const {
+    setRef: setPopperSourceEl,
+    setPopper: setPopperTargetElem,
+    styles: popperStyles,
+    attributes,
+    poppersWrapper,
+    popper: popper2
+  } = usePortalPopper({
+    id: `${compId}-tooltip`,
+    containerId: "SITE_CONTAINER",
+    shouldMountWrapper: true,
+    popperOptions: {
+      placement: "top",
+      modifiers: [
+        {
+          name: "arrow",
+          options: { element: arrowElement }
+        },
+        {
+          name: "offset",
+          options: {
+            offset: [0, 12]
+          }
+        },
+        {
+          name: "flip",
+          options: {
+            fallbackPlacements: ["auto"]
+          }
+        }
+      ]
+    }
+  });
+  React.useEffect(() => {
+    if (showPopper && isTooltipClicked && isAnimationEnd) {
+      popper2 == null ? void 0 : popper2.focus();
+      popper2 == null ? void 0 : popper2.classList.add(style.tooltipEntered);
+    }
+  }, [showPopper, isTooltipClicked, popper2, isAnimationEnd]);
+  const showPopperTooltip = () => setShowPopper(true);
+  const hidePopperTooltip = () => setShowPopper(isTooltipClicked);
+  const tooltipButtonOnClick = () => {
+    setShowPopper(!showPopper);
+    setIsTooltipClicked(!isTooltipClicked);
+    setIsAnimationEnd(false);
+    setLoadTooltip(true);
+  };
+  const tooltipButtonOnMouseLeave = () => {
+    if (!isMobile) {
+      setShowPopper(false);
+    }
+    setIsTooltipClicked(false);
+  };
+  const tooltipButtonOnMouseEnter = () => {
+    if (!isMobile) {
+      setLoadTooltip(true);
+      showPopperTooltip();
+    }
+  };
+  const closeTooltip = () => {
+    var _a;
+    setShowPopper(false);
+    setIsTooltipClicked(false);
+    (_a = tooltipButtonRef == null ? void 0 : tooltipButtonRef.current) == null ? void 0 : _a.focus();
+  };
+  const tooltipOnKeyUp = (e) => {
+    if (e.key === "Escape") {
+      closeTooltip();
+    }
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    poppersWrapper && loadTooltip && canUsePortal && ReactDOM__default.createPortal(
+      /* @__PURE__ */ jsx(
+        TooltipBox,
+        {
+          compId,
+          text,
+          isMobile,
+          showPopper,
+          setPopperTargetElem,
+          setIsTooltipClicked,
+          setShowPopper,
+          setArrowElement,
+          onSettingsClick,
+          popperStyles,
+          tooltipButtonRef,
+          showPopperTooltip,
+          hidePopperTooltip,
+          attributes,
+          tooltipOnKeyUp,
+          setIsAnimationEnd
+        }
+      ),
+      poppersWrapper
+    ),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        id: `${compId}-button`,
+        className: style.tooltipButton,
+        onMouseEnter: tooltipButtonOnMouseEnter,
+        onMouseLeave: tooltipButtonOnMouseLeave,
+        onBlur: hidePopperTooltip,
+        onClick: tooltipButtonOnClick,
+        "aria-label": ariaLabelText,
+        "aria-expanded": showPopper,
+        ref: tooltipButtonRef,
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-hook": `${compId}-tooltip-button`,
+            className: style.tooltipIconWrapper,
+            ref: setPopperSourceEl,
+            children: /* @__PURE__ */ jsx(CookieIcon, { className: style.cookieIcon })
+          }
+        )
+      }
+    )
+  ] });
+};
+const TextWithTooltip = ({
+  id,
+  datahook,
+  text,
+  tooltipText,
+  ariaLabelText,
+  isMobile,
+  onSettingsClick
+}) => {
+  return /* @__PURE__ */ jsxs("div", { className: style.textDiv, children: [
+    /* @__PURE__ */ jsx(
+      ConsentText,
+      {
+        text,
+        textButtonClass: style.textButton,
+        rootClass: style.textWithLinkBox,
+        onSettingsClick
+      }
+    ),
+    tooltipText && ariaLabelText && /* @__PURE__ */ jsx(
+      Tooltip,
+      {
+        id,
+        datahook,
+        text: tooltipText,
+        ariaLabelText,
+        isMobile,
+        onSettingsClick
+      }
+    )
+  ] });
+};
+const ConsentPolicyWrapperContext = React.createContext({ setWrapperStyle: () => {
+} });
+const ConsentPolicyWrapper = (props) => {
+  const [render, setRender] = React.useState(false);
+  const [rootStyle, setRootStyle] = React.useState({});
+  const {
+    componentConsentPolicy,
+    id,
+    consentPolicy,
+    openSettingModal,
+    className,
+    rootClassName,
+    isMobile,
+    translations
+  } = props;
+  const componentName = translations.componentName;
+  const policy = consentPolicy.policy;
+  React.useEffect(() => {
+    setRender(true);
+  }, [consentPolicy]);
+  const hasConsent = Object.keys(componentConsentPolicy || {}).reduce(
+    (accumulator, consentKey) => accumulator && Boolean(policy[consentKey]),
+    true
+  );
+  const requiredConsentTypes = Object.keys(componentConsentPolicy || {});
+  const {
+    largeText,
+    mediumText,
+    smallText,
+    tinyTooltipText,
+    tinyAriaLabelText,
+    smallTooltipText,
+    smallAriaLabelText
+  } = getConsentWrapperTexts(
+    requiredConsentTypes,
+    componentName || "",
+    translations
+  );
+  const setWrapperStyle = React.useCallback(
+    (styleToUpdate) => {
+      setRootStyle(styleToUpdate);
+    },
+    []
+  );
+  const dataAndA11yAttributes = {
+    ...getDataAttributes(props),
+    ...getTabIndexAttribute(props.a11y)
+  };
+  if (!render) {
+    return /* @__PURE__ */ jsx("div", { id, ...dataAndA11yAttributes });
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      id,
+      ...dataAndA11yAttributes,
+      style: rootStyle,
+      className: clsx(rootClassName, className, style$1.root),
+      children: hasConsent ? /* @__PURE__ */ jsx(ConsentPolicyWrapperContext.Provider, { value: { setWrapperStyle }, children: props.children }) : /* @__PURE__ */ jsxs("div", { "data-hook": DataHooks.NoConsentBox, className: style$1.noConsentBox, children: [
+        /* @__PURE__ */ jsxs("div", { className: clsx(style$1.textBox, style$1.largeTextBox), children: [
+          /* @__PURE__ */ jsx(
+            TextWithTooltip,
+            {
+              id,
+              datahook: "large",
+              text: largeText,
+              isMobile: isMobile ?? false,
+              onSettingsClick: openSettingModal
+            }
+          ),
+          /* @__PURE__ */ jsx(CookieIcon, { className: style$1.cookieIcon })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: clsx(style$1.textBox, style$1.mediumTextBox), children: [
+          /* @__PURE__ */ jsx(
+            TextWithTooltip,
+            {
+              id,
+              datahook: "medium",
+              text: mediumText,
+              isMobile: isMobile ?? false,
+              onSettingsClick: openSettingModal
+            }
+          ),
+          /* @__PURE__ */ jsx(CookieIcon, { className: style$1.cookieIcon })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: clsx(style$1.textBox, style$1.smallTextBox), children: /* @__PURE__ */ jsx(
+          TextWithTooltip,
+          {
+            id,
+            datahook: "small",
+            text: smallText,
+            tooltipText: smallTooltipText,
+            ariaLabelText: smallAriaLabelText,
+            isMobile: isMobile ?? false,
+            onSettingsClick: openSettingModal
+          }
+        ) }),
+        /* @__PURE__ */ jsx("div", { className: style$1.tinyTextBox, children: /* @__PURE__ */ jsx(
+          Tooltip,
+          {
+            id,
+            datahook: "tiny",
+            text: tinyTooltipText,
+            ariaLabelText: tinyAriaLabelText,
+            isMobile: isMobile ?? false,
+            onSettingsClick: openSettingModal
+          }
+        ) })
+      ] })
+    }
+  );
+};
+var dist = {};
+var staticService = {};
+var hasRequiredStaticService;
+function requireStaticService() {
+  if (hasRequiredStaticService) return staticService;
+  hasRequiredStaticService = 1;
+  Object.defineProperty(staticService, "__esModule", { value: true });
+  staticService.implementStaticService = staticService.defineStaticService = void 0;
+  const services_definitions_1 = /* @__PURE__ */ requireBuild();
+  staticService.defineStaticService = services_definitions_1.defineService;
+  staticService.implementStaticService = services_definitions_1.implementService;
+  return staticService;
+}
+var hasRequiredDist;
+function requireDist() {
+  if (hasRequiredDist) return dist;
+  hasRequiredDist = 1;
+  (function(exports$1) {
+    var __createBinding = dist && dist.__createBinding || (Object.create ? (function(o, m, k, k2) {
+      if (k2 === void 0) k2 = k;
+      var desc = Object.getOwnPropertyDescriptor(m, k);
+      if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+        desc = { enumerable: true, get: function() {
+          return m[k];
+        } };
+      }
+      Object.defineProperty(o, k2, desc);
+    }) : (function(o, m, k, k2) {
+      if (k2 === void 0) k2 = k;
+      o[k2] = m[k];
+    }));
+    var __exportStar = dist && dist.__exportStar || function(m, exports$12) {
+      for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports$12, p)) __createBinding(exports$12, m, p);
+    };
+    Object.defineProperty(exports$1, "__esModule", { value: true });
+    __exportStar(/* @__PURE__ */ requireStaticService(), exports$1);
+  })(dist);
+  return dist;
+}
+var definition = {};
+var hasRequiredDefinition;
+function requireDefinition() {
+  if (hasRequiredDefinition) return definition;
+  hasRequiredDefinition = 1;
+  Object.defineProperty(definition, "__esModule", { value: true });
+  definition.ConsentPolicyDefinition = void 0;
+  const static_service_1 = /* @__PURE__ */ requireDist();
+  definition.ConsentPolicyDefinition = (0, static_service_1.defineStaticService)("viewer-core/viewer-service-consent-policy");
+  return definition;
+}
+var definitionExports = /* @__PURE__ */ requireDefinition();
+const consentPolicyKeys = {
+  componentNameKey: "CookieConsent_Dataset_Component_HtmlComponent",
+  componentNameDefault: "Html Component"
+};
+const useConsentPolicyProps = () => {
+  var _a;
+  const environment = useService(definitionExports$1.EnvironmentDefinition);
+  const translationService = useService(definitionExports$2.TranslationsDefinition);
+  const { translate } = translationService || { translate: () => () => "" };
+  const consentPolicy = useService(definitionExports.ConsentPolicyDefinition);
+  const isPreview = (_a = environment == null ? void 0 : environment.getPreviewMode) == null ? void 0 : _a.call(environment);
+  const [currentConsentPolicy, setCurrentConsentPolicy] = useState(
+    () => {
+      var _a2;
+      return (_a2 = consentPolicy == null ? void 0 : consentPolicy.getCurrentConsentPolicy) == null ? void 0 : _a2.call(consentPolicy);
+    }
+  );
+  useEffect(() => {
+    if (!(consentPolicy == null ? void 0 : consentPolicy.registerToChanges)) {
+      return;
+    }
+    const handlePolicyChange = (newPolicy) => {
+      setCurrentConsentPolicy(newPolicy);
+    };
+    consentPolicy.registerToChanges(handlePolicyChange);
+  }, [consentPolicy]);
+  return useMemo(() => {
+    const isConsentPolicyActive = isPreview === false;
+    const tProxy = (namespace, key) => translate(namespace)(key);
+    const isMobile = (environment == null ? void 0 : environment.deviceType) ? environment.deviceType !== "Desktop" : false;
+    const consentPolicyProps = isConsentPolicyActive ? {
+      isMobile,
+      consentPolicy: currentConsentPolicy,
+      openSettingModal: consentPolicy ? () => consentPolicy.openSettingModal([]) : void 0
+    } : {
+      isMobile
+    };
+    const consentPolicyTranslations = isConsentPolicyActive ? translateConsentWrapperKeys(
+      consentPolicyKeys.componentNameKey,
+      consentPolicyKeys.componentNameDefault,
+      tProxy
+    ) : {};
+    return {
+      isConsentPolicyActive,
+      ...consentPolicyProps,
+      translations: consentPolicyTranslations
+    };
+  }, [isPreview, environment, currentConsentPolicy, consentPolicy, translate]);
+};
+export {
+  ConsentPolicyWrapper as C,
+  requireDist as r,
+  useConsentPolicyProps as u
+};