locize 3.3.0 → 4.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (98) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/README.md +76 -38
  3. package/dist/cjs/api/handleCommitKeys.js +7 -0
  4. package/dist/cjs/api/handleEditKey.js +1 -1
  5. package/dist/cjs/api/handleIsLocizeEnabled.js +2 -2
  6. package/dist/cjs/api/handleRequestPopupChanges.js +11 -0
  7. package/dist/cjs/api/handleSendMatchedUninstrumented.js +26 -0
  8. package/dist/cjs/api/postMessage.js +32 -45
  9. package/dist/cjs/implementations/dummyImplementation.js +35 -0
  10. package/dist/cjs/implementations/i18nextImplementation.js +94 -0
  11. package/dist/cjs/index.d.ts +9 -16
  12. package/dist/cjs/index.js +1 -6
  13. package/dist/cjs/locizePlugin.js +6 -90
  14. package/dist/cjs/observer.js +1 -0
  15. package/dist/cjs/parser.js +100 -14
  16. package/dist/cjs/process.js +37 -5
  17. package/dist/cjs/startStandalone.js +11 -17
  18. package/dist/cjs/store.js +1 -0
  19. package/dist/cjs/ui/elements/highlightBox.js +13 -0
  20. package/dist/cjs/ui/elements/icons.js +1 -17
  21. package/dist/cjs/ui/elements/popup.js +3 -3
  22. package/dist/cjs/ui/elements/ribbonBox.js +3 -6
  23. package/dist/cjs/ui/highlightNode.js +28 -77
  24. package/dist/cjs/ui/popup.js +10 -0
  25. package/dist/cjs/ui/utils.js +18 -0
  26. package/dist/cjs/uninstrumentedStore.js +18 -2
  27. package/dist/cjs/utils.js +55 -77
  28. package/dist/cjs/vars.js +5 -2
  29. package/dist/esm/api/handleCommitKeys.js +7 -0
  30. package/dist/esm/api/handleEditKey.js +1 -1
  31. package/dist/esm/api/handleIsLocizeEnabled.js +2 -2
  32. package/dist/esm/api/handleRequestPopupChanges.js +11 -0
  33. package/dist/esm/api/handleSendMatchedUninstrumented.js +20 -0
  34. package/dist/esm/api/postMessage.js +33 -44
  35. package/dist/esm/implementations/dummyImplementation.js +31 -0
  36. package/dist/esm/implementations/i18nextImplementation.js +85 -0
  37. package/dist/esm/index.d.ts +9 -16
  38. package/dist/esm/index.js +3 -6
  39. package/dist/esm/locizePlugin.js +5 -85
  40. package/dist/esm/observer.js +1 -0
  41. package/dist/esm/parser.js +101 -16
  42. package/dist/esm/process.js +38 -6
  43. package/dist/esm/startStandalone.js +7 -17
  44. package/dist/esm/store.js +1 -0
  45. package/dist/esm/ui/elements/highlightBox.js +9 -0
  46. package/dist/esm/ui/elements/icons.js +2 -16
  47. package/dist/esm/ui/elements/popup.js +3 -3
  48. package/dist/esm/ui/elements/ribbonBox.js +4 -7
  49. package/dist/esm/ui/highlightNode.js +28 -78
  50. package/dist/esm/ui/popup.js +10 -0
  51. package/dist/esm/ui/utils.js +18 -1
  52. package/dist/esm/uninstrumentedStore.js +18 -2
  53. package/dist/esm/utils.js +54 -72
  54. package/dist/esm/vars.js +5 -3
  55. package/dist/umd/locize.js +637 -592
  56. package/dist/umd/locize.min.js +1 -1
  57. package/index.d.ts +9 -16
  58. package/locize.js +637 -592
  59. package/locize.min.js +1 -1
  60. package/package.json +1 -1
  61. package/src/_startStandalone.js +22 -0
  62. package/src/api/handleCommitKeys.js +9 -0
  63. package/src/api/handleEditKey.js +5 -11
  64. package/src/api/handleIsLocizeEnabled.js +7 -2
  65. package/src/api/handleRequestPopupChanges.js +27 -0
  66. package/src/api/handleSendMatchedUninstrumented.js +38 -0
  67. package/src/api/index.js +1 -4
  68. package/src/api/postMessage.js +37 -53
  69. package/src/implementations/dummyImplementation.js +29 -0
  70. package/src/implementations/i18nextImplementation.js +114 -0
  71. package/src/implementations/index.js +2 -0
  72. package/src/index.js +7 -6
  73. package/src/locizePlugin.js +51 -28
  74. package/src/observer.js +1 -0
  75. package/src/parser.js +207 -19
  76. package/src/process.js +52 -5
  77. package/src/startStandalone.js +4 -17
  78. package/src/store.js +2 -0
  79. package/src/ui/elements/highlightBox.js +17 -0
  80. package/src/ui/elements/popup.js +4 -4
  81. package/src/ui/elements/ribbonBox.js +12 -8
  82. package/src/ui/highlightNode.js +102 -71
  83. package/src/ui/popup.js +33 -5
  84. package/src/ui/utils.js +28 -1
  85. package/src/uninstrumentedStore.js +18 -2
  86. package/src/utils.js +72 -5
  87. package/src/vars.js +6 -4
  88. package/dist/cjs/api/handleTurnOff.js +0 -8
  89. package/dist/cjs/api/handleTurnOn.js +0 -8
  90. package/dist/cjs/clickHandler.js +0 -55
  91. package/dist/cjs/processLegacy.js +0 -80
  92. package/dist/esm/api/handleTurnOff.js +0 -6
  93. package/dist/esm/api/handleTurnOn.js +0 -6
  94. package/dist/esm/clickHandler.js +0 -51
  95. package/dist/esm/processLegacy.js +0 -72
  96. /package/src/{processLegacy.js → _processLegacy.js} +0 -0
  97. /package/src/api/{handleTurnOff.js → _handleTurnOff.js} +0 -0
  98. /package/src/api/{handleTurnOn.js → _handleTurnOn.js} +0 -0
@@ -5,56 +5,29 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
6
6
  var vars = require('../vars.js');
7
7
  var ribbonBox = require('./elements/ribbonBox.js');
8
+ var highlightBox = require('./elements/highlightBox.js');
8
9
  var dom = require('@floating-ui/dom');
10
+ var utils = require('./utils.js');
9
11
 
10
12
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
11
13
 
12
14
  var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
13
15
 
14
- var eleToOutline = ['DIV', 'P', 'H1', 'H2', 'H3', 'H4', 'H5', 'H6', 'OL', 'UL', 'ADDRESS', 'BLOCKQUOTE', 'DL', 'PRE'];
15
- var overriddenStyles = ['outline', 'border-radius', 'outline-offset', 'filter'];
16
- var originalStyles = {};
17
16
  var selected = {};
18
17
  function highlight(item, node, keys) {
19
- var id = item.id;
20
- if (selected[id]) return;
21
- if (!originalStyles[id]) {
22
- originalStyles[id] = overriddenStyles.reduce(function (mem, s) {
23
- mem[s] = node.style[s];
24
- return mem;
25
- }, {});
26
- }
27
- if (eleToOutline.includes(node.nodeName)) {
28
- node.style.outline = "".concat(vars.colors.highlight, " solid 1px");
29
- node.style.setProperty('border-radius', '1px');
30
- node.style.setProperty('outline-offset', '2px');
31
- node.style.filter = 'brightness(110%)';
32
- } else {
33
- node.style.outline = "".concat(vars.colors.highlight, " solid 1px");
34
- node.style.setProperty('border-radius', '1px');
35
- node.style.setProperty('outline-offset', '1px');
36
- node.style.filter = 'brightness(110%)';
18
+ item.id;
19
+ var rectEle = utils.getOptimizedBoundingRectEle(node);
20
+ if (!item.highlightBox) {
21
+ var box = highlightBox.HighlightBox(rectEle, vars.colors.highlight);
22
+ document.body.appendChild(box);
23
+ item.highlightBox = box;
37
24
  }
38
25
  if (!item.ribbonBox) {
39
26
  var _RibbonBox = ribbonBox.RibbonBox(keys),
40
27
  actions = _RibbonBox.box,
41
28
  arrowEle = _RibbonBox.arrow;
42
29
  document.body.appendChild(actions);
43
- var refEle = node;
44
- if (node.childNodes.length === 1) {
45
- var childNode = node.childNodes[0];
46
- if (childNode && childNode.nodeName === '#text') {
47
- var range = document.createRange();
48
- range.selectNode(childNode);
49
- var rect = range.getBoundingClientRect();
50
- refEle = {
51
- getBoundingClientRect: function getBoundingClientRect() {
52
- return rect;
53
- }
54
- };
55
- }
56
- }
57
- dom.computePosition(refEle, actions, {
30
+ dom.computePosition(rectEle, actions, {
58
31
  placement: 'right',
59
32
  middleware: [dom.flip({
60
33
  fallbackPlacements: ['left', 'bottom']
@@ -101,58 +74,35 @@ function highlight(item, node, keys) {
101
74
  function highlightUninstrumented(item, node, keys) {
102
75
  var id = item.id;
103
76
  if (selected[id]) return;
104
- if (!originalStyles[id]) {
105
- originalStyles[id] = overriddenStyles.reduce(function (mem, s) {
106
- mem[s] = node.style[s];
107
- return mem;
108
- }, {});
109
- }
110
- if (eleToOutline.includes(node.nodeName)) {
111
- node.style.outline = "".concat(vars.colors.warning, " solid 1px");
112
- node.style.setProperty('border-radius', '1px');
113
- node.style.setProperty('outline-offset', '2px');
114
- node.style.filter = 'brightness(110%)';
115
- } else {
116
- node.style.outline = "".concat(vars.colors.warning, " solid 1px");
117
- node.style.setProperty('border-radius', '1px');
118
- node.style.setProperty('outline-offset', '1px');
119
- node.style.filter = 'brightness(110%)';
77
+ var rectEle = utils.getOptimizedBoundingRectEle(node);
78
+ if (!item.highlightBox) {
79
+ var box = highlightBox.HighlightBox(rectEle, vars.colors.warning);
80
+ document.body.appendChild(box);
81
+ item.highlightBox = box;
120
82
  }
121
83
  }
122
84
  function selectedHighlight(item, node, keys) {
123
85
  var id = item.id;
124
- if (!originalStyles[id]) {
125
- originalStyles[id] = overriddenStyles.reduce(function (mem, s) {
126
- mem[s] = node.style[s];
127
- return mem;
128
- }, {});
129
- }
130
- if (eleToOutline.includes(node.nodeName)) {
131
- node.style.outline = "".concat(vars.colors.highlight, " solid 1px");
132
- node.style.setProperty('border-radius', '1px');
133
- node.style.setProperty('outline-offset', '2px');
134
- node.style.filter = "brightness(110%) drop-shadow(0px 0px 2px ".concat(vars.colors.highlight, " )");
135
- } else {
136
- node.style.outline = "".concat(vars.colors.highlight, " solid 1px");
137
- node.style.setProperty('border-radius', '1px');
138
- node.style.setProperty('outline-offset', '1px');
139
- node.style.filter = "brightness(110%) drop-shadow(0px 0px 2px ".concat(vars.colors.highlight, " )");
140
- }
141
- if (item.ribbonBox) {
142
- document.body.removeChild(item.ribbonBox);
143
- delete item.ribbonBox;
86
+ var rectEle = utils.getOptimizedBoundingRectEle(node);
87
+ if (!item.highlightBox) {
88
+ var box = highlightBox.HighlightBox(rectEle, vars.colors.highlight, vars.colors.gray);
89
+ document.body.appendChild(box);
90
+ item.highlightBox = box;
144
91
  }
145
92
  selected[id] = true;
146
93
  }
94
+ function recalcSelectedHighlight(item, node, keys) {
95
+ if (!selected[item.id]) return;
96
+ resetHighlight(item, node, keys, false);
97
+ selectedHighlight(item, node);
98
+ }
147
99
  function resetHighlight(item, node, keys) {
148
100
  var ignoreSelected = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
149
101
  var id = item.id;
150
102
  if (ignoreSelected && selected[id]) return;
151
- if (originalStyles[id]) {
152
- overriddenStyles.forEach(function (s) {
153
- node.style.setProperty(s, originalStyles[id][s]);
154
- });
155
- delete originalStyles[id];
103
+ if (item.highlightBox) {
104
+ document.body.removeChild(item.highlightBox);
105
+ delete item.highlightBox;
156
106
  }
157
107
  if (item.ribbonBox) {
158
108
  document.body.removeChild(item.ribbonBox);
@@ -163,5 +113,6 @@ function resetHighlight(item, node, keys) {
163
113
 
164
114
  exports.highlight = highlight;
165
115
  exports.highlightUninstrumented = highlightUninstrumented;
116
+ exports.recalcSelectedHighlight = recalcSelectedHighlight;
166
117
  exports.resetHighlight = resetHighlight;
167
118
  exports.selectedHighlight = selectedHighlight;
@@ -51,6 +51,11 @@ function initDragElement() {
51
51
  function closeDragElement() {
52
52
  mouseDistance.startMouseTracking();
53
53
  if (overlay) overlay.style.display = 'none';
54
+ var ele = document.getElementById('i18next-editor-popup');
55
+ localStorage.setItem('locize_popup_pos', JSON.stringify({
56
+ top: parseInt(document.defaultView.getComputedStyle(ele).top, 10),
57
+ left: parseInt(document.defaultView.getComputedStyle(ele).left, 10)
58
+ }));
54
59
  document.onmouseup = null;
55
60
  document.onmousemove = null;
56
61
  }
@@ -104,6 +109,11 @@ function initResizeElement() {
104
109
  function stopDrag() {
105
110
  mouseDistance.startMouseTracking();
106
111
  if (overlay) overlay.style.display = 'none';
112
+ var ele = document.getElementById('i18next-editor-popup');
113
+ localStorage.setItem('locize_popup_size', JSON.stringify({
114
+ width: parseInt(document.defaultView.getComputedStyle(ele).width, 10),
115
+ height: parseInt(document.defaultView.getComputedStyle(ele).height, 10)
116
+ }));
107
117
  document.documentElement.removeEventListener('mousemove', doDrag, false);
108
118
  document.documentElement.removeEventListener('mouseup', stopDrag, false);
109
119
  }
@@ -38,6 +38,24 @@ function mouseDistanceFromElement(mouseEvent, element) {
38
38
  hypot = Math.pow(Math.pow(distX, 2) + Math.pow(distY, 2), 1 / 2);
39
39
  return Math.floor(hypot);
40
40
  }
41
+ function getOptimizedBoundingRectEle(node) {
42
+ var refEle = node;
43
+ if (node.childNodes.length === 1) {
44
+ var childNode = node.childNodes[0];
45
+ if (childNode && childNode.nodeName === '#text') {
46
+ var range = document.createRange();
47
+ range.selectNode(childNode);
48
+ var rect = range.getBoundingClientRect();
49
+ refEle = {
50
+ getBoundingClientRect: function getBoundingClientRect() {
51
+ return rect;
52
+ }
53
+ };
54
+ }
55
+ }
56
+ return refEle;
57
+ }
41
58
 
59
+ exports.getOptimizedBoundingRectEle = getOptimizedBoundingRectEle;
42
60
  exports.isInViewport = isInViewport;
43
61
  exports.mouseDistanceFromElement = mouseDistanceFromElement;
@@ -20,7 +20,7 @@ function clean() {
20
20
  }
21
21
  });
22
22
  }
23
- function save(id, type, node) {
23
+ function save(id, type, node, txt) {
24
24
  if (!id || !type || !node) return;
25
25
  if (!data[id]) {
26
26
  data[id] = {
@@ -28,13 +28,29 @@ function save(id, type, node) {
28
28
  node: node
29
29
  };
30
30
  }
31
- data[id].keys = _objectSpread(_objectSpread({}, data[id].keys), {}, _defineProperty__default["default"]({}, "".concat(type), 'uninstrumented'));
31
+ data[id].keys = _objectSpread(_objectSpread({}, data[id].keys), {}, _defineProperty__default["default"]({}, "".concat(type), {
32
+ value: txt,
33
+ eleUniqueID: id,
34
+ textType: type
35
+ }));
36
+ }
37
+ function remove(id, node) {
38
+ highlightNode.resetHighlight(id, node);
39
+ delete data[id];
40
+ }
41
+ function removeKey(id, key, node) {
42
+ var item = get(id);
43
+ if (!item) return;
44
+ delete item.keys["".concat(key)];
45
+ if (!Object.keys(item.keys).length) remove(id, node);
32
46
  }
33
47
  function get(id) {
34
48
  return data[id];
35
49
  }
36
50
  var uninstrumentedStore = {
37
51
  save: save,
52
+ remove: remove,
53
+ removeKey: removeKey,
38
54
  clean: clean,
39
55
  get: get,
40
56
  data: data
package/dist/cjs/utils.js CHANGED
@@ -2,11 +2,12 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var _typeof = require('@babel/runtime/helpers/typeof');
5
+ var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
6
+ require('@babel/runtime/helpers/typeof');
6
7
 
7
8
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
9
 
9
- var _typeof__default = /*#__PURE__*/_interopDefaultLegacy(_typeof);
10
+ var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
10
11
 
11
12
  function debounce(func, wait, immediate) {
12
13
  var timeout;
@@ -23,76 +24,6 @@ function debounce(func, wait, immediate) {
23
24
  if (callNow) func.apply(context, args);
24
25
  };
25
26
  }
26
- function isWindow(obj) {
27
- return obj != null && obj === obj.window;
28
- }
29
- function getWindow(elem) {
30
- return isWindow(elem) ? elem : elem.nodeType === 9 && elem.defaultView;
31
- }
32
- function offset(elem) {
33
- var box = {
34
- top: 0,
35
- left: 0,
36
- right: 0,
37
- bottom: 0
38
- };
39
- var doc = elem && elem.ownerDocument;
40
- var docElem = doc && doc.documentElement;
41
- if (!docElem) return box;
42
- if (_typeof__default["default"](elem.getBoundingClientRect) !== ("undefined" )) {
43
- box = elem.getBoundingClientRect();
44
- }
45
- var win = getWindow(doc);
46
- var top = box.top + win.pageYOffset - docElem.clientTop;
47
- var left = box.left + win.pageXOffset - docElem.clientLeft;
48
- return {
49
- top: top,
50
- left: left,
51
- right: left + (box.right - box.left),
52
- bottom: top + (box.bottom - box.top)
53
- };
54
- }
55
- function getClickedElement(e) {
56
- if (e.srcElement && e.srcElement.nodeType === 1 && (e.srcElement.nodeName === 'BUTTON' || e.srcElement.nodeName === 'INPUT')) {
57
- if (e.srcElement.getAttribute && e.srcElement.getAttribute('ignorelocizeeditor') === '') {
58
- return null;
59
- }
60
- return e.srcElement;
61
- }
62
- var el;
63
- if (e.originalEvent && e.originalEvent.explicitOriginalTarget) {
64
- el = e.originalEvent.explicitOriginalTarget;
65
- } else {
66
- var parent = e.srcElement;
67
- if (parent.getAttribute && parent.getAttribute('ignorelocizeeditor') === '') return null;
68
- var left = e.pageX;
69
- var top = e.pageY;
70
- var topStartsAt = 0;
71
- var topBreaksAt;
72
- for (var i = 0; i < parent.childNodes.length; i++) {
73
- var n = parent.childNodes[i];
74
- var nOffset = offset(n);
75
- if (n.nodeType === 1 && nOffset.bottom < top) topStartsAt = i + 1;
76
- if (!topBreaksAt && nOffset.top + (n.clientHeight || 0) > top) topBreaksAt = i;
77
- }
78
- if (topStartsAt + 1 > parent.childNodes.length) topStartsAt = parent.childNodes.length - 1;
79
- if (!topBreaksAt) topBreaksAt = parent.childNodes.length;
80
- for (var y = topStartsAt; y < topBreaksAt; y++) {
81
- var _n = parent.childNodes[y];
82
- var _nOffset = offset(_n);
83
- if (_nOffset.left > left) {
84
- break;
85
- }
86
- if (_n && _n.nodeType !== 8) el = _n;
87
- }
88
- }
89
- return el;
90
- }
91
- function getElementText(el) {
92
- var str = el.textContent || el.text && el.text.innerText || el.placeholder;
93
- if (typeof str !== 'string') return;
94
- return str.replace(/\n +/g, '').trim();
95
- }
96
27
  function getAttribute(el, name) {
97
28
  return el && el.getAttribute && el.getAttribute(name);
98
29
  }
@@ -104,6 +35,57 @@ function getElementI18nKey(el) {
104
35
  }
105
36
  return undefined;
106
37
  }
38
+ function parseAttrFromKey(key) {
39
+ var attr = 'text';
40
+ if (key.indexOf('[') == 0) {
41
+ var parts = key.split(']');
42
+ key = parts[1];
43
+ attr = parts[0].substr(1, parts[0].length - 1);
44
+ }
45
+ var newKey = key.indexOf(';') == key.length - 1 ? key.substr(0, key.length - 2) : key;
46
+ return [newKey, attr];
47
+ }
48
+ function getI18nMetaFromNode(el) {
49
+ var hasNamespacePrependToKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
50
+ var key = getElementI18nKey(el);
51
+ var ns = getElementNamespace(el);
52
+ var allKeys = {};
53
+ if (key && key.indexOf(';') >= 0) {
54
+ var keys = key.split(';');
55
+ for (var ix = 0, l_ix = keys.length; ix < l_ix; ix++) {
56
+ if (keys[ix] != '') {
57
+ var _parseAttrFromKey = parseAttrFromKey(keys[ix]),
58
+ _parseAttrFromKey2 = _slicedToArray__default["default"](_parseAttrFromKey, 2),
59
+ usedKey = _parseAttrFromKey2[0],
60
+ attr = _parseAttrFromKey2[1];
61
+ allKeys[attr] = usedKey;
62
+ }
63
+ }
64
+ } else if (key) {
65
+ var _parseAttrFromKey3 = parseAttrFromKey(key),
66
+ _parseAttrFromKey4 = _slicedToArray__default["default"](_parseAttrFromKey3, 2),
67
+ _usedKey = _parseAttrFromKey4[0],
68
+ _attr = _parseAttrFromKey4[1];
69
+ allKeys[_attr] = _usedKey;
70
+ }
71
+ if (Object.keys(allKeys).length < 1) return null;
72
+ var res = Object.keys(allKeys).reduce(function (mem, attr) {
73
+ var key = allKeys[attr];
74
+ var usedNS = ns;
75
+ var usedKey = key;
76
+ if (hasNamespacePrependToKey && key.indexOf(':') > -1) {
77
+ var parts = key.split(':');
78
+ usedKey = parts[1];
79
+ usedNS = parts[0];
80
+ }
81
+ mem[attr] = {
82
+ key: usedKey,
83
+ ns: usedNS
84
+ };
85
+ return mem;
86
+ }, {});
87
+ return res;
88
+ }
107
89
  function getElementNamespace(el) {
108
90
  var found;
109
91
  var find = function find(ele) {
@@ -139,11 +121,7 @@ function getQsParameterByName(name, url) {
139
121
  }
140
122
 
141
123
  exports.debounce = debounce;
142
- exports.getClickedElement = getClickedElement;
143
124
  exports.getElementI18nKey = getElementI18nKey;
144
125
  exports.getElementNamespace = getElementNamespace;
145
- exports.getElementText = getElementText;
126
+ exports.getI18nMetaFromNode = getI18nMetaFromNode;
146
127
  exports.getQsParameterByName = getQsParameterByName;
147
- exports.getWindow = getWindow;
148
- exports.isWindow = isWindow;
149
- exports.offset = offset;
package/dist/cjs/vars.js CHANGED
@@ -3,9 +3,11 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var validAttributes = ['placeholder', 'title', 'alt'];
6
+ var ignoreElements = ['SCRIPT'];
6
7
  var colors = {
7
- highlight: '#26a69a',
8
- warning: '#e67a00'
8
+ highlight: '#1976d2',
9
+ warning: '#e67a00',
10
+ gray: '#ccc'
9
11
  };
10
12
  var getIframeUrl = function getIframeUrl() {
11
13
  var _prc$env;
@@ -19,4 +21,5 @@ var getIframeUrl = function getIframeUrl() {
19
21
 
20
22
  exports.colors = colors;
21
23
  exports.getIframeUrl = getIframeUrl;
24
+ exports.ignoreElements = ignoreElements;
22
25
  exports.validAttributes = validAttributes;
@@ -2,6 +2,7 @@ import _toConsumableArray from '@babel/runtime/helpers/esm/toConsumableArray';
2
2
  import { api } from './postMessage.js';
3
3
  import { store } from '../store.js';
4
4
  import { setValueOnNode } from './handleEditKey.js';
5
+ import { recalcSelectedHighlight } from '../ui/highlightNode.js';
5
6
 
6
7
  function handler(payload) {
7
8
  var updated = payload.updated;
@@ -19,6 +20,12 @@ function handler(payload) {
19
20
  });
20
21
  }
21
22
  api.i18n.setResource(lng, ns, key, data.value);
23
+ if (metas) {
24
+ Object.values(metas).forEach(function (m) {
25
+ var sItem = store.get(m.eleUniqueID);
26
+ recalcSelectedHighlight(sItem, sItem.node, sItem.keys);
27
+ });
28
+ }
22
29
  });
23
30
  Object.values(store.data).forEach(function (item) {
24
31
  if (item.originalChildNodes) {
@@ -5,7 +5,7 @@ import { store } from '../store.js';
5
5
  function setValueOnNode(meta, value) {
6
6
  var item = store.get(meta.eleUniqueID);
7
7
  if (!item || !item.keys[meta.textType]) return;
8
- var txtWithHiddenMeta = wrap(value, item.subliminal);
8
+ var txtWithHiddenMeta = item.subliminal ? wrap(value, item.subliminal) : value;
9
9
  if (meta.textType === 'text') {
10
10
  item.node.textContent = txtWithHiddenMeta;
11
11
  } else if (meta.textType.indexOf('attr:') === 0) {
@@ -3,7 +3,7 @@ import { api } from './postMessage.js';
3
3
  function handler(payload, e) {
4
4
  api.source = e.source;
5
5
  api.origin = e.origin;
6
- api.legacy = true;
7
- api.sendLocizeIsEnabled();
6
+ api.sendLocizeIsEnabled(payload);
7
+ api.requestInitialize(api.config);
8
8
  }
9
9
  api.addHandler('isLocizeEnabled', handler);
@@ -5,6 +5,15 @@ function handler(payload) {
5
5
  var containerStyle = payload.containerStyle;
6
6
  if (containerStyle) {
7
7
  var popup = document.getElementById(popupId);
8
+ if (!popup) return;
9
+ var storedPos = localStorage.getItem('locize_popup_pos');
10
+ if (storedPos) storedPos = JSON.parse(storedPos);
11
+ var storedSize = localStorage.getItem('locize_popup_size');
12
+ if (storedSize) storedSize = JSON.parse(storedSize);
13
+ if (storedSize && storedSize.height && storedSize.width) {
14
+ containerStyle.height = storedSize.height + 'px';
15
+ containerStyle.width = storedSize.width + 'px';
16
+ }
8
17
  if (containerStyle.height) {
9
18
  var diff = "calc(".concat(containerStyle.height, " - ").concat(popup.style.height, ")");
10
19
  popup.style.setProperty('top', "calc(".concat(popup.style.top, " - ").concat(diff, ")"));
@@ -15,6 +24,8 @@ function handler(payload) {
15
24
  popup.style.setProperty('left', "calc(".concat(popup.style.left, " - ").concat(_diff, ")"));
16
25
  popup.style.setProperty('width', containerStyle.width);
17
26
  }
27
+ if (storedPos && storedPos.top && storedPos.top < window.innerHeight - containerStyle.height.replace('px', '')) popup.style.setProperty('top', storedPos.top + 'px');
28
+ if (storedPos && storedPos.left && storedPos.left < window.innerWidth - containerStyle.width.replace('px', '')) popup.style.setProperty('left', storedPos.left + 'px');
18
29
  }
19
30
  }
20
31
  api.addHandler('requestPopupChanges', handler);
@@ -0,0 +1,20 @@
1
+ import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
2
+ import { api } from './postMessage.js';
3
+ import { store } from '../store.js';
4
+ import { uninstrumentedStore } from '../uninstrumentedStore.js';
5
+ import { extractNodeMeta } from '../parser.js';
6
+
7
+ function handler(payload) {
8
+ if (!payload.length) return;
9
+ payload.forEach(function (item) {
10
+ var uni = uninstrumentedStore.get(item.eleUniqueID);
11
+ store.save(item.eleUniqueID, undefined, item.textType, extractNodeMeta(item.eleUniqueID, item.textType, _defineProperty({}, "".concat(item.textType), {
12
+ ns: item.ns,
13
+ key: item.key
14
+ }), item.value), uni === null || uni === void 0 ? void 0 : uni.node);
15
+ delete uni.keys["".concat(item.textType)];
16
+ if (!Object.keys(uni.keys).length) uninstrumentedStore.remove(item.eleUniqueID, uni.node);
17
+ });
18
+ api.sendCurrentParsedContent();
19
+ }
20
+ api.addHandler('sendMatchedUninstrumented', handler);
@@ -1,6 +1,8 @@
1
1
  import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
2
2
  import { getIframeUrl } from '../vars.js';
3
3
  import { store } from '../store.js';
4
+ import { uninstrumentedStore } from '../uninstrumentedStore.js';
5
+ import { debounce } from '../utils.js';
4
6
 
5
7
  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; }
6
8
  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; }
@@ -14,27 +16,18 @@ function getMappedLegacyEvent(msg) {
14
16
  function addLocizeSavedHandler(handler) {
15
17
  api.locizeSavedHandler = handler;
16
18
  }
17
- function turnOn() {
18
- api.scriptTurnedOff = false;
19
- api.turnOn();
20
- return api.scriptTurnedOff;
21
- }
22
- function turnOff() {
23
- api.turnOff();
24
- api.scriptTurnedOff = true;
25
- return api.scriptTurnedOff;
26
- }
27
19
  function setEditorLng(lng) {
28
20
  api.sendCurrentTargetLanguage(lng);
29
21
  }
30
22
  var pendingMsgs = [];
23
+ var allowedActionsBeforeInit = ['locizeIsEnabled', 'requestInitialize'];
31
24
  function sendMessage(action, payload) {
32
25
  if (!api.source) {
33
26
  var _document$getElementB;
34
27
  api.source = (_document$getElementB = document.getElementById('i18next-editor-iframe')) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.contentWindow;
35
28
  }
36
29
  if (!api.origin) api.origin = getIframeUrl();
37
- if (!api.source || !api.source.postMessage) {
30
+ if (!api.source || !api.source.postMessage || !api.initialized && allowedActionsBeforeInit.indexOf(action) < 0) {
38
31
  pendingMsgs.push({
39
32
  action: action,
40
33
  payload: payload
@@ -48,7 +41,7 @@ function sendMessage(action, payload) {
48
41
  } else {
49
42
  api.source.postMessage({
50
43
  sender: 'i18next-editor',
51
- senderAPIVersion: 'v1',
44
+ senderAPIVersion: 'v2',
52
45
  action: action,
53
46
  message: action,
54
47
  payload: payload
@@ -62,6 +55,22 @@ function sendMessage(action, payload) {
62
55
  sendMessage(action, payload);
63
56
  });
64
57
  }
58
+ var sendCurrentParsedContentDebounced = function sendCurrentParsedContentDebounced() {
59
+ sendMessage('sendCurrentParsedContent', {
60
+ content: Object.values(store.data).map(function (item) {
61
+ return {
62
+ id: item.id,
63
+ keys: item.keys
64
+ };
65
+ }),
66
+ uninstrumented: Object.values(uninstrumentedStore.data).map(function (item) {
67
+ return {
68
+ id: item.id,
69
+ keys: item.keys
70
+ };
71
+ })
72
+ });
73
+ };
65
74
  var handlers = {};
66
75
  var repeat = 5;
67
76
  var api = {
@@ -79,7 +88,7 @@ var api = {
79
88
  clearInterval(api.initInterval);
80
89
  delete api.initInterval;
81
90
  }
82
- }, 1000);
91
+ }, 2000);
83
92
  },
84
93
  selectKey: function selectKey(meta) {
85
94
  sendMessage('selectKey', meta);
@@ -87,45 +96,25 @@ var api = {
87
96
  confirmResourceBundle: function confirmResourceBundle(payload) {
88
97
  sendMessage('confirmResourceBundle', payload);
89
98
  },
90
- sendCurrentParsedContent: function sendCurrentParsedContent() {
91
- sendMessage('sendCurrentParsedContent', {
92
- content: Object.values(store.data).map(function (item) {
93
- return {
94
- id: item.id,
95
- keys: item.keys
96
- };
97
- })
98
- });
99
- },
99
+ sendCurrentParsedContent: debounce(sendCurrentParsedContentDebounced, 500),
100
100
  sendCurrentTargetLanguage: function sendCurrentTargetLanguage(lng) {
101
101
  sendMessage('sendCurrentTargetLanguage', {
102
102
  targetLng: lng || api.i18n.getLng()
103
103
  });
104
104
  },
105
+ sendHrefchanged: function sendHrefchanged(href) {
106
+ sendMessage('hrefChanged', {
107
+ href: href
108
+ });
109
+ },
105
110
  addHandler: function addHandler(action, fc) {
106
111
  if (!handlers[action]) handlers[action] = [];
107
112
  handlers[action].push(fc);
108
113
  },
109
- sendLocizeIsEnabled: function sendLocizeIsEnabled() {
110
- sendMessage('locizeIsEnabled', {
114
+ sendLocizeIsEnabled: function sendLocizeIsEnabled(payload) {
115
+ sendMessage('locizeIsEnabled', _objectSpread(_objectSpread({}, payload), {}, {
111
116
  enabled: true
112
- });
113
- },
114
- turnOn: function turnOn() {
115
- if (api.scriptTurnedOff) return sendMessage('forcedOff');
116
- if (!api.clickInterceptionEnabled) {
117
- window.document.body.addEventListener('click', api.clickHandler, true);
118
- }
119
- api.clickInterceptionEnabled = true;
120
- sendMessage('turnedOn');
121
- },
122
- turnOff: function turnOff() {
123
- if (api.scriptTurnedOff) return sendMessage('forcedOff');
124
- if (api.clickInterceptionEnabled) {
125
- window.document.body.removeEventListener('click', api.clickHandler, true);
126
- }
127
- api.clickInterceptionEnabled = false;
128
- sendMessage('turnedOff');
117
+ }));
129
118
  },
130
119
  onAddedKey: function onAddedKey(lng, ns, key, value) {
131
120
  var msg = {
@@ -153,10 +142,10 @@ if (typeof window !== 'undefined') {
153
142
  }
154
143
  } else if (sender === 'i18next-editor-frame' && handlers[action]) {
155
144
  handlers[action].forEach(function (fc) {
156
- fc(payload);
145
+ fc(payload, e);
157
146
  });
158
147
  }
159
148
  });
160
149
  }
161
150
 
162
- export { addLocizeSavedHandler, api, sendMessage, setEditorLng, turnOff, turnOn };
151
+ export { addLocizeSavedHandler, api, sendMessage, setEditorLng };