locize 2.4.6 → 3.0.1

package/dist/esm/ui/elements/popup.js

@@ -0,0 +1,76 @@
+import { sheet } from '../stylesheet.js';
+import { stopMouseTracking, startMouseTracking } from '../mouseDistance.js';
+import { minimizeIconUrl, locizeIconUrl } from './icons.js';
+
+if (sheet) {
+  sheet.insertRule("@keyframes i18next-editor-animate-top { \n      from {\n        top: calc(100vh + 600px); \n        left: calc(100vw + 300px);\n        opacity: 0;\n      }\n      to {\n        top: var(--i18next-editor-popup-position-top);\n        left: var(--i18next-editor-popup-position-left);\n        opacity: 1;\n      }\n    }");
+  sheet.insertRule("@keyframes i18next-editor-animate-bottom { \n      from {\n        top: var(--i18next-editor-popup-position-top);\n        left: var(--i18next-editor-popup-position-left);\n        opacity: 1;\n      }\n      to {\n        top: calc(100vh + 600px); \n        left: calc(100vw + 300px);\n        opacity: 0;\n      }\n    }");
+  sheet.insertRule(".i18next-editor-popup * { \n      -webkit-touch-callout: none; /* iOS Safari */\n      -webkit-user-select: none; /* Safari */\n      -khtml-user-select: none; /* Konqueror HTML */\n      -moz-user-select: none; /* Firefox */\n      -ms-user-select: none; /* Internet Explorer/Edge */\n      user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */\n    }");
+  sheet.insertRule(".i18next-editor-popup .resizer-right {\n      width: 15px;\n      height: 100%;\n      background: transparent;\n      position: absolute;\n      right: -15px;\n      bottom: 0;\n      cursor: e-resize;\n    }");
+  sheet.insertRule(".i18next-editor-popup .resizer-both {\n      width: 15px;\n      height: 15px;\n      background: transparent;\n      z-index: 10;\n      position: absolute;\n      right: -15px;\n      bottom: -15px;\n      cursor: se-resize;\n    }");
+  sheet.insertRule(".i18next-editor-popup .resizer-bottom {\n      width: 100%;\n      height: 15px;\n      background: transparent;\n      position: absolute;\n      right: 0;\n      bottom: -15px;\n      cursor: s-resize;\n    }");
+}
+function Ribbon(popupEle, onMaximize) {
+  var ribbon = document.createElement('div');
+  ribbon.setAttribute('data-i18next-editor-element', 'true');
+  ribbon.style = "\n  cursor: pointer;\n  position: fixed;\n  bottom: 25px;\n  right: 25px;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 50px;\n  height: 50px;\n  background-color:  rgba(249, 249, 249, 0.2);\n  backdrop-filter: blur(3px);\n  box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);\n  border-radius: 50%\n  ";
+  ribbon.onclick = function () {
+    onMaximize();
+  };
+  var image = document.createElement('img');
+  image.src = locizeIconUrl;
+  image.style.width = '45px';
+  ribbon.appendChild(image);
+  return ribbon;
+}
+function Minimize(popupEle, onMinimize) {
+  var image = document.createElement('img');
+  image.setAttribute('data-i18next-editor-element', 'true');
+  image.src = minimizeIconUrl;
+  image.style.width = '24px';
+  image.style.cursor = 'pointer';
+  image.onclick = function () {
+    popupEle.style.setProperty('--i18next-editor-popup-position-top', popupEle.style.top);
+    popupEle.style.setProperty('--i18next-editor-popup-position-left', popupEle.style.left);
+    popupEle.style.animation = 'i18next-editor-animate-bottom 2s forwards';
+    onMinimize();
+  };
+  return image;
+}
+function Popup(url, cb) {
+  var popup = document.createElement('div');
+  popup.setAttribute('id', 'i18next-editor-popup');
+  popup.classList.add('i18next-editor-popup');
+  popup.style = "\n  z-index: 9;\n  background-color: transparent;\n  border: 1px solid rgba(200, 200, 200, 0.9);\n  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);\n  border-radius: 3px;\n  --i18next-editor-popup-height: 200px;\n  height: var(--i18next-editor-popup-height);\n  min-height: 150px;\n  min-width: 300px;\n  --i18next-editor-popup-width: 400px;\n  width: var(--i18next-editor-popup-width);\n  max-height: 600px;\n  max-width: 800px;\n\n  position: fixed;\n  --i18next-editor-popup-position-top: calc(100vh - var(--i18next-editor-popup-height) - 10px);\n  top: calc(100vh - var(--i18next-editor-popup-height) - 10px);\n  --i18next-editor-popup-position-left: calc(100vw - var(--i18next-editor-popup-width) - 10px);\n  left: calc(100vw - var(--i18next-editor-popup-width) - 10px);\n\n  overflow: visible;\n  ";
+  popup.setAttribute('data-i18next-editor-element', 'true');
+  var header = document.createElement('div');
+  header.classList.add('i18next-editor-popup-header');
+  header.style = "\n  padding: 2px 10px;\n  cursor: move;\n  z-index: 10;\n  backdrop-filter: blur(3px);\n  background-color: rgba(200, 200, 200, 0.5);\n  background: linear-gradient(0deg, rgba(200, 200, 200, 0.6), rgba(200, 200, 200, 0.5));\n  color: #fff;\n  text-align: right;\n  ";
+  popup.appendChild(header);
+  header.appendChild(Minimize(popup, function () {
+    var ribbon = Ribbon(popup, function () {
+      popup.style.animation = 'i18next-editor-animate-top 1s';
+      startMouseTracking();
+      setTimeout(function () {
+        document.body.removeChild(ribbon);
+      }, 1000);
+    });
+    document.body.appendChild(ribbon);
+    stopMouseTracking();
+  }));
+  var iframe = document.createElement('iframe');
+  iframe.setAttribute('id', 'i18next-editor-iframe');
+  iframe.setAttribute('data-i18next-editor-element', 'true');
+  iframe.style = "\n    z-index: 100;\n    width: 100%;\n    height: calc(100% - 32px);\n    border: none;\n    background: #fff;\n  ";
+  iframe.setAttribute('src', url);
+  iframe.addEventListener('load', cb);
+  popup.appendChild(iframe);
+  var overlay = document.createElement('div');
+  overlay.setAttribute('id', 'i18next-editor-popup-overlay');
+  overlay.setAttribute('data-i18next-editor-element', 'true');
+  overlay.style = "\n  display: none;\n  position: absolute;\n  top: 32px;\n  z-index: 101;\n  width: 100%;\n  height: calc(100% - 32px);\n  background-color: rgba(200, 200, 200, 0.5);\n  background: linear-gradient(0deg, rgba(240, 240, 240, 0.6), rgba(255, 255, 255, 0.5));\n  backdrop-filter: blur(2px);\n";
+  popup.appendChild(overlay);
+  return popup;
+}
+
+export { Popup };

package/dist/esm/ui/elements/ribbonBox.js

@@ -0,0 +1,62 @@
+import { colors } from '../../vars.js';
+import { sheet } from '../stylesheet.js';
+import '../../api/handleEditKey.js';
+import '../../api/handleCommitKey.js';
+import '../../api/handleCommitKeys.js';
+import '../../api/handleConfirmInitialized.js';
+import '../../api/handleRequestPopupChanges.js';
+import '../../api/handleRequestResourceBundle.js';
+import '../../api/handleSelectedKeys.js';
+import '../../api/handleIsLocizeEnabled.js';
+import '../../api/handleTurnOn.js';
+import '../../api/handleTurnOff.js';
+import { api } from '../../api/postMessage.js';
+import { RibbonLogo, EditIcon } from './icons.js';
+
+if (sheet) {
+  sheet.insertRule('.i18next-editor-button:hover { background-color: rgba(38, 166, 154, 1) !important; }');
+}
+function RibbonButton(text, attrTitle, onClick) {
+  var btn = document.createElement('button');
+  btn.style = 'font-family: Arial; position: relative; backdrop-filter: blur(3px); cursor: pointer; padding: 2px 10px 2px 20px; font-size: 15px; font-weight: 300; text-transform: uppercase; color: #fff; background-color: rgba(38, 166, 154, 0.8); border: none; border-radius: 12px';
+  btn.classList.add('i18next-editor-button');
+  btn.setAttribute('data-i18next-editor-element', 'true');
+  btn.setAttribute('title', attrTitle);
+  var icon = EditIcon();
+  icon.style = 'position: absolute; left: 4px; top: 3px;';
+  icon.style.width = '15px';
+  btn.appendChild(icon);
+  var span = document.createElement('span');
+  span.textContent = text;
+  btn.appendChild(span);
+  btn.onclick = onClick;
+  return btn;
+}
+function RibbonBox() {
+  var keys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var box = document.createElement('div');
+  box.style = 'position: absolute; top: 0; left: 0; display: flex; align-items: flex-start; justify-content: center; filter: drop-shadow(0px 0px 20px #aaa );';
+  box.setAttribute('data-i18next-editor-element', 'true');
+  var arrow = document.createElement('div');
+  arrow.style = "\n    position: absolute;\n    width: 0;\n    height: 0;\n    border-top-width: 7px;\n    border-bottom-width: 7px;\n    border-left-width: 10px;\n    border-right-width: 10px;\n    border-style: solid;\n    border-color: transparent ".concat(colors.highlight, " transparent\n      transparent;\n    ");
+  box.appendChild(arrow);
+  var logo = RibbonLogo();
+  box.appendChild(logo);
+  var btnbox = document.createElement('div');
+  btnbox.style = 'display: flex; flex-direction: column; align-items: flex-start; margin-left: 2px; margin-top: 1px';
+  Object.keys(keys).forEach(function (k) {
+    var data = keys[k];
+    var btn = RibbonButton(k.replace('attr:', ''), "".concat(data.ns, ":").concat(data.key), function () {
+      api.selectKey(data);
+    });
+    btn.style.marginBottom = '2px';
+    btnbox.appendChild(btn);
+  });
+  box.appendChild(btnbox);
+  return {
+    box: box,
+    arrow: arrow
+  };
+}
+
+export { RibbonBox, RibbonButton };

package/dist/esm/ui/highlightNode.js

@@ -0,0 +1,156 @@
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import { colors } from '../vars.js';
+import { RibbonBox } from './elements/ribbonBox.js';
+import { computePosition, flip, shift, offset, arrow } from '@floating-ui/dom';
+
+var eleToOutline = ['DIV', 'P', 'H1', 'H2', 'H3', 'H4', 'H5', 'H6', 'OL', 'UL', 'ADDRESS', 'BLOCKQUOTE', 'DL', 'PRE'];
+var overriddenStyles = ['outline', 'border-radius', 'outline-offset', 'filter'];
+var originalStyles = {};
+var selected = {};
+function highlight(item, node, keys) {
+  var id = item.id;
+  if (selected[id]) return;
+  if (!originalStyles[id]) {
+    originalStyles[id] = overriddenStyles.reduce(function (mem, s) {
+      mem[s] = node.style[s];
+      return mem;
+    }, {});
+  }
+  if (eleToOutline.includes(node.nodeName)) {
+    node.style.outline = "".concat(colors.highlight, " solid 1px");
+    node.style.setProperty('border-radius', '1px');
+    node.style.setProperty('outline-offset', '2px');
+    node.style.filter = 'brightness(110%)';
+  } else {
+    node.style.outline = "".concat(colors.highlight, " solid 1px");
+    node.style.setProperty('border-radius', '1px');
+    node.style.setProperty('outline-offset', '1px');
+    node.style.filter = 'brightness(110%)';
+  }
+  if (!item.ribbonBox) {
+    var _RibbonBox = RibbonBox(keys),
+      actions = _RibbonBox.box,
+      arrowEle = _RibbonBox.arrow;
+    document.body.appendChild(actions);
+    var refEle = node;
+    if (node.childNodes.length === 1) {
+      var childNode = node.childNodes[0];
+      if (childNode && childNode.nodeName === '#text') {
+        var range = document.createRange();
+        range.selectNode(childNode);
+        var rect = range.getBoundingClientRect();
+        refEle = {
+          getBoundingClientRect: function getBoundingClientRect() {
+            return rect;
+          }
+        };
+      }
+    }
+    computePosition(refEle, actions, {
+      placement: 'right',
+      middleware: [flip({
+        fallbackPlacements: ['left', 'bottom']
+      }), shift(), offset(function (_ref) {
+        var placement = _ref.placement,
+          rects = _ref.rects;
+        if (placement === 'bottom') return rects.r;
+        return 35;
+      }), arrow({
+        element: arrowEle
+      })]
+    }).then(function (_ref2) {
+      var x = _ref2.x,
+        y = _ref2.y,
+        middlewareData = _ref2.middlewareData,
+        placement = _ref2.placement;
+      Object.assign(actions.style, {
+        left: "".concat(x, "px"),
+        top: "".concat(y, "px"),
+        display: 'inline-flex'
+      });
+      var side = placement.split('-')[0];
+      var staticSide = {
+        top: 'bottom',
+        right: 'left',
+        bottom: 'top',
+        left: 'right'
+      }[side];
+      if (middlewareData.arrow) {
+        var _middlewareData$arrow = middlewareData.arrow,
+          _x = _middlewareData$arrow.x,
+          _y = _middlewareData$arrow.y;
+        Object.assign(arrowEle.style, _defineProperty(_defineProperty({
+          left: _x != null ? "".concat(_x, "px") : '',
+          top: _y != null ? "".concat(_y, "px") : '',
+          right: '',
+          bottom: ''
+        }, staticSide, "".concat(side === 'bottom' ? -18 : -25, "px")), "transform", side === 'bottom' ? 'rotate(90deg)' : side === 'left' ? 'rotate(180deg)' : ''));
+      }
+    });
+    item.ribbonBox = actions;
+  }
+}
+function highlightUninstrumented(item, node, keys) {
+  var id = item.id;
+  if (selected[id]) return;
+  if (!originalStyles[id]) {
+    originalStyles[id] = overriddenStyles.reduce(function (mem, s) {
+      mem[s] = node.style[s];
+      return mem;
+    }, {});
+  }
+  if (eleToOutline.includes(node.nodeName)) {
+    node.style.outline = "".concat(colors.warning, " solid 1px");
+    node.style.setProperty('border-radius', '1px');
+    node.style.setProperty('outline-offset', '2px');
+    node.style.filter = 'brightness(110%)';
+  } else {
+    node.style.outline = "".concat(colors.warning, " solid 1px");
+    node.style.setProperty('border-radius', '1px');
+    node.style.setProperty('outline-offset', '1px');
+    node.style.filter = 'brightness(110%)';
+  }
+}
+function selectedHighlight(item, node, keys) {
+  var id = item.id;
+  if (!originalStyles[id]) {
+    originalStyles[id] = overriddenStyles.reduce(function (mem, s) {
+      mem[s] = node.style[s];
+      return mem;
+    }, {});
+  }
+  if (eleToOutline.includes(node.nodeName)) {
+    node.style.outline = "".concat(colors.highlight, " solid 1px");
+    node.style.setProperty('border-radius', '1px');
+    node.style.setProperty('outline-offset', '2px');
+    node.style.filter = "brightness(110%) drop-shadow(0px 0px 2px ".concat(colors.highlight, " )");
+  } else {
+    node.style.outline = "".concat(colors.highlight, " solid 1px");
+    node.style.setProperty('border-radius', '1px');
+    node.style.setProperty('outline-offset', '1px');
+    node.style.filter = "brightness(110%) drop-shadow(0px 0px 2px ".concat(colors.highlight, " )");
+  }
+  if (item.ribbonBox) {
+    document.body.removeChild(item.ribbonBox);
+    delete item.ribbonBox;
+  }
+  selected[id] = true;
+}
+function resetHighlight(item, node, keys) {
+  var ignoreSelected = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
+  var id = item.id;
+  if (ignoreSelected && selected[id]) return;
+  if (originalStyles[id]) {
+    overriddenStyles.forEach(function (s) {
+      node.style.setProperty(s, originalStyles[id][s]);
+    });
+    delete originalStyles[id];
+  }
+  if (item.ribbonBox) {
+    document.body.removeChild(item.ribbonBox);
+    delete item.ribbonBox;
+  }
+  delete selected[id];
+}
+
+export { highlight, highlightUninstrumented, resetHighlight, selectedHighlight };

package/dist/esm/ui/mouseDistance.js

@@ -0,0 +1,39 @@
+import { store } from '../store.js';
+import { uninstrumentedStore } from '../uninstrumentedStore.js';
+import { isInViewport, mouseDistanceFromElement } from './utils.js';
+import { debounce } from '../utils.js';
+import { highlight, resetHighlight, highlightUninstrumented } from './highlightNode.js';
+
+var debouncedUpdateDistance = debounce(function (e, observer) {
+  Object.values(store.data).forEach(function (item) {
+    if (!isInViewport(item.node)) return;
+    var distance = mouseDistanceFromElement(e, item.node);
+    if (distance < 5) {
+      highlight(item, item.node, item.keys);
+    } else if (distance > 5) {
+      var boxDistance = item.ribbonBox ? mouseDistanceFromElement(e, item.ribbonBox) : 1000;
+      if (boxDistance > 10) resetHighlight(item, item.node, item.keys);
+    }
+  });
+  Object.values(uninstrumentedStore.data).forEach(function (item) {
+    if (!isInViewport(item.node)) return;
+    var distance = mouseDistanceFromElement(e, item.node);
+    if (distance < 10) {
+      highlightUninstrumented(item, item.node, item.keys);
+    } else if (distance > 10) {
+      resetHighlight(item, item.node, item.keys);
+    }
+  });
+}, 50);
+var currentFC;
+function startMouseTracking(observer) {
+  currentFC = function handle(e) {
+    debouncedUpdateDistance(e, observer);
+  };
+  document.addEventListener('mousemove', currentFC);
+}
+function stopMouseTracking() {
+  document.removeEventListener('mousemove', currentFC);
+}
+
+export { startMouseTracking, stopMouseTracking };

package/dist/esm/ui/popup.js

@@ -0,0 +1,108 @@
+import { stopMouseTracking, startMouseTracking } from './mouseDistance.js';
+
+function initDragElement() {
+  var pos1 = 0;
+  var pos2 = 0;
+  var pos3 = 0;
+  var pos4 = 0;
+  var popups = document.getElementsByClassName('i18next-editor-popup');
+  var elmnt = null;
+  var overlay = null;
+  var currentZIndex = 100;
+  for (var i = 0; i < popups.length; i++) {
+    var popup = popups[i];
+    var header = getHeader(popup);
+    popup.onmousedown = function () {
+      this.style.zIndex = '' + ++currentZIndex;
+    };
+    if (header) {
+      header.parentPopup = popup;
+      header.onmousedown = dragMouseDown;
+    }
+  }
+  function dragMouseDown(e) {
+    if (!overlay) overlay = document.getElementById('i18next-editor-popup-overlay');
+    if (overlay) overlay.style.display = 'block';
+    stopMouseTracking();
+    elmnt = this.parentPopup;
+    elmnt.style.zIndex = '' + ++currentZIndex;
+    e = e || window.event;
+    pos3 = e.clientX;
+    pos4 = e.clientY;
+    document.onmouseup = closeDragElement;
+    document.onmousemove = elementDrag;
+  }
+  function elementDrag(e) {
+    if (!elmnt) {
+      return;
+    }
+    e = e || window.event;
+    pos1 = pos3 - e.clientX;
+    pos2 = pos4 - e.clientY;
+    pos3 = e.clientX;
+    pos4 = e.clientY;
+    elmnt.style.top = elmnt.offsetTop - pos2 + 'px';
+    elmnt.style.left = elmnt.offsetLeft - pos1 + 'px';
+  }
+  function closeDragElement() {
+    startMouseTracking();
+    if (overlay) overlay.style.display = 'none';
+    document.onmouseup = null;
+    document.onmousemove = null;
+  }
+  function getHeader(element) {
+    var headerItems = element.getElementsByClassName('i18next-editor-popup-header');
+    if (headerItems.length === 1) {
+      return headerItems[0];
+    }
+    return null;
+  }
+}
+function initResizeElement() {
+  var popups = document.getElementsByClassName('i18next-editor-popup');
+  var element = null;
+  var overlay = null;
+  var startX, startY, startWidth, startHeight;
+  for (var i = 0; i < popups.length; i++) {
+    var p = popups[i];
+    var right = document.createElement('div');
+    right.className = 'resizer-right';
+    p.appendChild(right);
+    right.addEventListener('mousedown', initDrag, false);
+    right.parentPopup = p;
+    var bottom = document.createElement('div');
+    bottom.className = 'resizer-bottom';
+    p.appendChild(bottom);
+    bottom.addEventListener('mousedown', initDrag, false);
+    bottom.parentPopup = p;
+    var both = document.createElement('div');
+    both.className = 'resizer-both';
+    p.appendChild(both);
+    both.addEventListener('mousedown', initDrag, false);
+    both.parentPopup = p;
+  }
+  function initDrag(e) {
+    stopMouseTracking();
+    if (!overlay) overlay = document.getElementById('i18next-editor-popup-overlay');
+    if (overlay) overlay.style.display = 'block';
+    element = this.parentPopup;
+    startX = e.clientX;
+    startY = e.clientY;
+    startWidth = parseInt(document.defaultView.getComputedStyle(element).width, 10);
+    startHeight = parseInt(document.defaultView.getComputedStyle(element).height, 10);
+    document.documentElement.addEventListener('mousemove', doDrag, false);
+    document.documentElement.addEventListener('mouseup', stopDrag, false);
+  }
+  function doDrag(e) {
+    element.style.width = startWidth + e.clientX - startX + 'px';
+    element.style.height = startHeight + e.clientY - startY + 'px';
+  }
+  function stopDrag() {
+    startMouseTracking();
+    if (overlay) overlay.style.display = 'none';
+    document.documentElement.removeEventListener('mousemove', doDrag, false);
+    document.documentElement.removeEventListener('mouseup', stopDrag, false);
+  }
+}
+
+export { initDragElement, initResizeElement };

package/dist/esm/ui/stylesheet.js

@@ -0,0 +1,8 @@
+var sheet = function () {
+  if (typeof document === 'undefined') return;
+  var style = document.createElement('style');
+  document.head.appendChild(style);
+  return style.sheet;
+}();
+
+export { sheet };

package/dist/esm/ui/utils.js

@@ -0,0 +1,34 @@
+function isInViewport(element) {
+  var rect = element.getBoundingClientRect();
+  return rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && rect.right <= (window.innerWidth || document.documentElement.clientWidth);
+}
+function mouseDistanceFromElement(mouseEvent, element) {
+  var $n = element,
+    mX = mouseEvent.pageX,
+    mY = mouseEvent.pageY,
+    from = {
+      x: mX,
+      y: mY
+    },
+    off = $n.getBoundingClientRect(),
+    ny1 = off.top + document.body.scrollTop,
+    ny2 = ny1 + $n.offsetHeight,
+    nx1 = off.left + document.body.scrollLeft,
+    nx2 = nx1 + $n.offsetWidth,
+    maxX1 = Math.max(mX, nx1),
+    minX2 = Math.min(mX, nx2),
+    maxY1 = Math.max(mY, ny1),
+    minY2 = Math.min(mY, ny2),
+    intersectX = minX2 >= maxX1,
+    intersectY = minY2 >= maxY1,
+    to = {
+      x: intersectX ? mX : nx2 < mX ? nx2 : nx1,
+      y: intersectY ? mY : ny2 < mY ? ny2 : ny1
+    },
+    distX = to.x - from.x,
+    distY = to.y - from.y,
+    hypot = Math.pow(Math.pow(distX, 2) + Math.pow(distY, 2), 1 / 2);
+  return Math.floor(hypot);
+}
+
+export { isInViewport, mouseDistanceFromElement };

package/dist/esm/uninstrumentedStore.js

@@ -0,0 +1,35 @@
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import { resetHighlight } from './ui/highlightNode.js';
+
+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 data = {};
+function clean() {
+  Object.values(data).forEach(function (item) {
+    if (!document.body.contains(item.node)) {
+      resetHighlight(item.id, item.node);
+      delete data[item.id];
+    }
+  });
+}
+function save(id, type, node) {
+  if (!id || !type || !node) return;
+  if (!data[id]) {
+    data[id] = {
+      id: id,
+      node: node
+    };
+  }
+  data[id].keys = _objectSpread(_objectSpread({}, data[id].keys), {}, _defineProperty({}, "".concat(type), 'uninstrumented'));
+}
+function get(id) {
+  return data[id];
+}
+var uninstrumentedStore = {
+  save: save,
+  clean: clean,
+  get: get,
+  data: data
+};
+
+export { uninstrumentedStore };

package/dist/esm/utils.js

@@ -0,0 +1,123 @@
+import _typeof from '@babel/runtime/helpers/esm/typeof';
+
+function debounce(func, wait, immediate) {
+  var timeout;
+  return function () {
+    var context = this;
+    var args = arguments;
+    var later = function later() {
+      timeout = null;
+      if (!immediate) func.apply(context, args);
+    };
+    var callNow = immediate && !timeout;
+    clearTimeout(timeout);
+    timeout = setTimeout(later, wait);
+    if (callNow) func.apply(context, args);
+  };
+}
+function isWindow(obj) {
+  return obj != null && obj === obj.window;
+}
+function getWindow(elem) {
+  return isWindow(elem) ? elem : elem.nodeType === 9 && elem.defaultView;
+}
+function offset(elem) {
+  var box = {
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0
+  };
+  var doc = elem && elem.ownerDocument;
+  var docElem = doc && doc.documentElement;
+  if (!docElem) return box;
+  if (_typeof(elem.getBoundingClientRect) !== ("undefined" )) {
+    box = elem.getBoundingClientRect();
+  }
+  var win = getWindow(doc);
+  var top = box.top + win.pageYOffset - docElem.clientTop;
+  var left = box.left + win.pageXOffset - docElem.clientLeft;
+  return {
+    top: top,
+    left: left,
+    right: left + (box.right - box.left),
+    bottom: top + (box.bottom - box.top)
+  };
+}
+function getClickedElement(e) {
+  if (e.srcElement && e.srcElement.nodeType === 1 && (e.srcElement.nodeName === 'BUTTON' || e.srcElement.nodeName === 'INPUT')) {
+    if (e.srcElement.getAttribute && e.srcElement.getAttribute('ignorelocizeeditor') === '') {
+      return null;
+    }
+    return e.srcElement;
+  }
+  var el;
+  if (e.originalEvent && e.originalEvent.explicitOriginalTarget) {
+    el = e.originalEvent.explicitOriginalTarget;
+  } else {
+    var parent = e.srcElement;
+    if (parent.getAttribute && parent.getAttribute('ignorelocizeeditor') === '') return null;
+    var left = e.pageX;
+    var top = e.pageY;
+    var topStartsAt = 0;
+    var topBreaksAt;
+    for (var i = 0; i < parent.childNodes.length; i++) {
+      var n = parent.childNodes[i];
+      var nOffset = offset(n);
+      if (n.nodeType === 1 && nOffset.bottom < top) topStartsAt = i + 1;
+      if (!topBreaksAt && nOffset.top + (n.clientHeight || 0) > top) topBreaksAt = i;
+    }
+    if (topStartsAt + 1 > parent.childNodes.length) topStartsAt = parent.childNodes.length - 1;
+    if (!topBreaksAt) topBreaksAt = parent.childNodes.length;
+    for (var y = topStartsAt; y < topBreaksAt; y++) {
+      var _n = parent.childNodes[y];
+      var _nOffset = offset(_n);
+      if (_nOffset.left > left) {
+        break;
+      }
+      if (_n && _n.nodeType !== 8) el = _n;
+    }
+  }
+  return el;
+}
+function getElementText(el) {
+  var str = el.textContent || el.text && el.text.innerText || el.placeholder;
+  if (typeof str !== 'string') return;
+  return str.replace(/\n +/g, '').trim();
+}
+function getAttribute(el, name) {
+  return el && el.getAttribute && el.getAttribute(name);
+}
+function getElementI18nKey(el) {
+  var key = getAttribute(el, 'data-i18n');
+  if (key) return key;
+  if (el.nodeType === window.Node.TEXT_NODE && el.parentElement) {
+    return getElementI18nKey(el.parentElement);
+  }
+  return undefined;
+}
+function getElementNamespace(el) {
+  var found;
+  var find = function find(ele) {
+    var opts = getAttribute(ele, 'i18next-options');
+    if (!opts) opts = getAttribute(ele, 'data-i18next-options');
+    if (!opts) opts = getAttribute(ele, 'i18n-options');
+    if (!opts) opts = getAttribute(ele, 'data-i18n-options');
+    if (opts) {
+      var jsonData = {};
+      try {
+        jsonData = JSON.parse(opts);
+      } catch (e) {}
+      if (jsonData.ns) found = jsonData.ns;
+    }
+    if (!found) found = getAttribute(ele, 'i18next-ns');
+    if (!found) found = getAttribute(ele, 'data-i18next-ns');
+    if (!found) found = getAttribute(ele, 'i18n-ns');
+    if (!found) found = getAttribute(ele, 'data-i18n-ns');
+    if (!found && ele.parentElement) find(ele.parentElement);
+  };
+  find(el);
+  return found;
+}
+
+export { debounce, getClickedElement, getElementI18nKey, getElementNamespace, getElementText, getWindow, isWindow, offset };

package/dist/esm/vars.js

@@ -0,0 +1,16 @@
+var validAttributes = ['placeholder', 'title', 'alt'];
+var colors = {
+  highlight: '#26a69a',
+  warning: '#e67a00'
+};
+var getIframeUrl = function getIframeUrl() {
+  var _prc$env;
+  var p;
+  if (typeof process !== 'undefined') p = process;
+  if (!p && typeof window !== 'undefined') p = window.process;
+  var prc = p || {};
+  var env = ((_prc$env = prc.env) === null || _prc$env === void 0 ? void 0 : _prc$env.locizeIncontext) || 'production';
+  return env === 'development' ? 'http://localhost:3003/' : env === 'staging' ? 'https://incontext-dev.locize.app' : 'https://incontext.locize.app';
+};
+
+export { colors, getIframeUrl, validAttributes };