locize/dist/esm/api/handleRequestPopupChanges.js

This package adds the incontext editor to your i18next setup.

import { api } from './postMessage.js';
import { popupId } from '../ui/elements/popup.js';

var CSS_LENGTH_RE = /^\d+(?:\.\d+)?(?:px|%|em|rem|vh|vw|ch|ex)$/i;
function isSafeCssLength(v) {
  return typeof v === 'string' && CSS_LENGTH_RE.test(v);
}
function handler(payload) {
  var containerStyle = payload.containerStyle;
  if (containerStyle) {
    var popup = document.getElementById(popupId);
    if (!popup) return;
    var storedPos = window.localStorage.getItem('locize_popup_pos');
    if (storedPos) storedPos = JSON.parse(storedPos);
    var storedSize = window.localStorage.getItem('locize_popup_size');
    if (storedSize) storedSize = JSON.parse(storedSize);
    if (storedSize && storedSize.height && storedSize.width) {
      containerStyle.height = storedSize.height + 'px';
      containerStyle.width = storedSize.width + 'px';
    }
    if (containerStyle.height && !isSafeCssLength(containerStyle.height)) {
      delete containerStyle.height;
    }
    if (containerStyle.width && !isSafeCssLength(containerStyle.width)) {
      delete containerStyle.width;
    }
    if (containerStyle.height) {
      var diff = "calc(".concat(containerStyle.height, " - ").concat(popup.style.height, ")");
      popup.style.setProperty('top', "calc(".concat(popup.style.top, " - ").concat(diff, ")"));
      popup.style.setProperty('height', containerStyle.height);
    }
    if (containerStyle.width) {
      var _diff = "calc(".concat(containerStyle.width, " - ").concat(popup.style.width, ")");
      popup.style.setProperty('left', "calc(".concat(popup.style.left, " - ").concat(_diff, ")"));
      popup.style.setProperty('width', containerStyle.width);
    }
    var MIN_VISIBLE = 40;
    if (storedPos && typeof storedPos.top === 'number' && containerStyle.height) {
      var maxTop = Math.max(0, window.innerHeight - MIN_VISIBLE);
      var top = Math.max(0, Math.min(storedPos.top, maxTop));
      popup.style.setProperty('top', top + 'px');
    }
    if (storedPos && typeof storedPos.left === 'number' && containerStyle.width) {
      var width = parseInt(containerStyle.width, 10) || 0;
      var minLeft = Math.min(0, MIN_VISIBLE - width);
      var maxLeft = Math.max(0, window.innerWidth - MIN_VISIBLE);
      var left = Math.max(minLeft, Math.min(storedPos.left, maxLeft));
      popup.style.setProperty('left', left + 'px');
    }
  }
}
api.addHandler('requestPopupChanges', handler);