@soomo/react-text-annotator 3.0.0-staging.29 → 3.0.0-staging.30

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 (33) hide show
  1. package/dist/TextAnnotatorPopup.d.ts.map +1 -1
  2. package/dist/react-text-annotator.css +1 -1
  3. package/dist/react-text-annotator.es10.js +204 -200
  4. package/dist/react-text-annotator.es10.js.map +1 -1
  5. package/dist/react-text-annotator.es11.js +537 -211
  6. package/dist/react-text-annotator.es11.js.map +1 -1
  7. package/dist/react-text-annotator.es12.js +443 -535
  8. package/dist/react-text-annotator.es12.js.map +1 -1
  9. package/dist/react-text-annotator.es13.js +2 -487
  10. package/dist/react-text-annotator.es13.js.map +1 -1
  11. package/dist/react-text-annotator.es14.js +31 -2
  12. package/dist/react-text-annotator.es14.js.map +1 -1
  13. package/dist/react-text-annotator.es15.js +887 -20
  14. package/dist/react-text-annotator.es15.js.map +1 -1
  15. package/dist/react-text-annotator.es16.js +49 -896
  16. package/dist/react-text-annotator.es16.js.map +1 -1
  17. package/dist/react-text-annotator.es17.js +6 -7
  18. package/dist/react-text-annotator.es17.js.map +1 -1
  19. package/dist/react-text-annotator.es2.js +1 -1
  20. package/dist/react-text-annotator.es24.js +1 -39
  21. package/dist/react-text-annotator.es24.js.map +1 -1
  22. package/dist/react-text-annotator.es25.js +1 -98
  23. package/dist/react-text-annotator.es25.js.map +1 -1
  24. package/dist/react-text-annotator.es5.js +43 -52
  25. package/dist/react-text-annotator.es5.js.map +1 -1
  26. package/dist/react-text-annotator.es6.js +33 -33
  27. package/dist/react-text-annotator.es6.js.map +1 -1
  28. package/dist/react-text-annotator.es7.js +3 -3
  29. package/dist/react-text-annotator.es9.js +668 -23
  30. package/dist/react-text-annotator.es9.js.map +1 -1
  31. package/package.json +6 -6
  32. package/dist/utils.d.ts +0 -14
  33. package/dist/utils.d.ts.map +0 -1
@@ -1,244 +1,570 @@
1
- import { computePosition, offset as offset$1, shift as shift$1, autoPlacement as autoPlacement$1, inline as inline$1 } from "./react-text-annotator.es12.js";
2
- import { autoUpdate, platform } from "./react-text-annotator.es12.js";
3
- import * as React from "react";
4
- import { useLayoutEffect, useEffect } from "react";
5
- import * as ReactDOM from "react-dom";
6
- var index = typeof document !== "undefined" ? useLayoutEffect : useEffect;
7
- function deepEqual(a, b) {
8
- if (a === b) {
9
- return true;
10
- }
11
- if (typeof a !== typeof b) {
1
+ import { offset as offset$1, shift as shift$1, inline as inline$1, computePosition as computePosition$1 } from "./react-text-annotator.es25.js";
2
+ import { createCoords, rectToClientRect, round, floor, max, min } from "./react-text-annotator.es24.js";
3
+ import { getOverflowAncestors, isElement, getWindow, getComputedStyle, getDocumentElement, isHTMLElement, isWebKit, isTopLayer, getNodeName, isOverflowElement, getNodeScroll, getParentNode, isLastTraversableNode, isTableElement, isContainingBlock, getContainingBlock } from "./react-text-annotator.es17.js";
4
+ function getCssDimensions(element) {
5
+ const css = getComputedStyle(element);
6
+ let width = parseFloat(css.width) || 0;
7
+ let height = parseFloat(css.height) || 0;
8
+ const hasOffset = isHTMLElement(element);
9
+ const offsetWidth = hasOffset ? element.offsetWidth : width;
10
+ const offsetHeight = hasOffset ? element.offsetHeight : height;
11
+ const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
12
+ if (shouldFallback) {
13
+ width = offsetWidth;
14
+ height = offsetHeight;
15
+ }
16
+ return {
17
+ width,
18
+ height,
19
+ $: shouldFallback
20
+ };
21
+ }
22
+ function unwrapElement(element) {
23
+ return !isElement(element) ? element.contextElement : element;
24
+ }
25
+ function getScale(element) {
26
+ const domElement = unwrapElement(element);
27
+ if (!isHTMLElement(domElement)) {
28
+ return createCoords(1);
29
+ }
30
+ const rect = domElement.getBoundingClientRect();
31
+ const {
32
+ width,
33
+ height,
34
+ $
35
+ } = getCssDimensions(domElement);
36
+ let x = ($ ? round(rect.width) : rect.width) / width;
37
+ let y = ($ ? round(rect.height) : rect.height) / height;
38
+ if (!x || !Number.isFinite(x)) {
39
+ x = 1;
40
+ }
41
+ if (!y || !Number.isFinite(y)) {
42
+ y = 1;
43
+ }
44
+ return {
45
+ x,
46
+ y
47
+ };
48
+ }
49
+ const noOffsets = /* @__PURE__ */ createCoords(0);
50
+ function getVisualOffsets(element) {
51
+ const win = getWindow(element);
52
+ if (!isWebKit() || !win.visualViewport) {
53
+ return noOffsets;
54
+ }
55
+ return {
56
+ x: win.visualViewport.offsetLeft,
57
+ y: win.visualViewport.offsetTop
58
+ };
59
+ }
60
+ function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
61
+ if (isFixed === void 0) {
62
+ isFixed = false;
63
+ }
64
+ if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
12
65
  return false;
13
66
  }
14
- if (typeof a === "function" && a.toString() === b.toString()) {
15
- return true;
16
- }
17
- let length;
18
- let i;
19
- let keys;
20
- if (a && b && typeof a === "object") {
21
- if (Array.isArray(a)) {
22
- length = a.length;
23
- if (length !== b.length) return false;
24
- for (i = length; i-- !== 0; ) {
25
- if (!deepEqual(a[i], b[i])) {
26
- return false;
27
- }
67
+ return isFixed;
68
+ }
69
+ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
70
+ if (includeScale === void 0) {
71
+ includeScale = false;
72
+ }
73
+ if (isFixedStrategy === void 0) {
74
+ isFixedStrategy = false;
75
+ }
76
+ const clientRect = element.getBoundingClientRect();
77
+ const domElement = unwrapElement(element);
78
+ let scale = createCoords(1);
79
+ if (includeScale) {
80
+ if (offsetParent) {
81
+ if (isElement(offsetParent)) {
82
+ scale = getScale(offsetParent);
28
83
  }
29
- return true;
84
+ } else {
85
+ scale = getScale(element);
30
86
  }
31
- keys = Object.keys(a);
32
- length = keys.length;
33
- if (length !== Object.keys(b).length) {
34
- return false;
87
+ }
88
+ const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
89
+ let x = (clientRect.left + visualOffsets.x) / scale.x;
90
+ let y = (clientRect.top + visualOffsets.y) / scale.y;
91
+ let width = clientRect.width / scale.x;
92
+ let height = clientRect.height / scale.y;
93
+ if (domElement) {
94
+ const win = getWindow(domElement);
95
+ const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
96
+ let currentWin = win;
97
+ let currentIFrame = currentWin.frameElement;
98
+ while (currentIFrame && offsetParent && offsetWin !== currentWin) {
99
+ const iframeScale = getScale(currentIFrame);
100
+ const iframeRect = currentIFrame.getBoundingClientRect();
101
+ const css = getComputedStyle(currentIFrame);
102
+ const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
103
+ const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
104
+ x *= iframeScale.x;
105
+ y *= iframeScale.y;
106
+ width *= iframeScale.x;
107
+ height *= iframeScale.y;
108
+ x += left;
109
+ y += top;
110
+ currentWin = getWindow(currentIFrame);
111
+ currentIFrame = currentWin.frameElement;
35
112
  }
36
- for (i = length; i-- !== 0; ) {
37
- if (!{}.hasOwnProperty.call(b, keys[i])) {
38
- return false;
39
- }
113
+ }
114
+ return rectToClientRect({
115
+ width,
116
+ height,
117
+ x,
118
+ y
119
+ });
120
+ }
121
+ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
122
+ let {
123
+ elements,
124
+ rect,
125
+ offsetParent,
126
+ strategy
127
+ } = _ref;
128
+ const isFixed = strategy === "fixed";
129
+ const documentElement = getDocumentElement(offsetParent);
130
+ const topLayer = elements ? isTopLayer(elements.floating) : false;
131
+ if (offsetParent === documentElement || topLayer && isFixed) {
132
+ return rect;
133
+ }
134
+ let scroll = {
135
+ scrollLeft: 0,
136
+ scrollTop: 0
137
+ };
138
+ let scale = createCoords(1);
139
+ const offsets = createCoords(0);
140
+ const isOffsetParentAnElement = isHTMLElement(offsetParent);
141
+ if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
142
+ if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
143
+ scroll = getNodeScroll(offsetParent);
40
144
  }
41
- for (i = length; i-- !== 0; ) {
42
- const key = keys[i];
43
- if (key === "_owner" && a.$$typeof) {
44
- continue;
45
- }
46
- if (!deepEqual(a[key], b[key])) {
47
- return false;
48
- }
145
+ if (isHTMLElement(offsetParent)) {
146
+ const offsetRect = getBoundingClientRect(offsetParent);
147
+ scale = getScale(offsetParent);
148
+ offsets.x = offsetRect.x + offsetParent.clientLeft;
149
+ offsets.y = offsetRect.y + offsetParent.clientTop;
49
150
  }
50
- return true;
51
151
  }
52
- return a !== a && b !== b;
152
+ return {
153
+ width: rect.width * scale.x,
154
+ height: rect.height * scale.y,
155
+ x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
156
+ y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
157
+ };
53
158
  }
54
- function getDPR(element) {
55
- if (typeof window === "undefined") {
56
- return 1;
159
+ function getClientRects(element) {
160
+ return Array.from(element.getClientRects());
161
+ }
162
+ function getWindowScrollBarX(element) {
163
+ return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
164
+ }
165
+ function getDocumentRect(element) {
166
+ const html = getDocumentElement(element);
167
+ const scroll = getNodeScroll(element);
168
+ const body = element.ownerDocument.body;
169
+ const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
170
+ const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
171
+ let x = -scroll.scrollLeft + getWindowScrollBarX(element);
172
+ const y = -scroll.scrollTop;
173
+ if (getComputedStyle(body).direction === "rtl") {
174
+ x += max(html.clientWidth, body.clientWidth) - width;
175
+ }
176
+ return {
177
+ width,
178
+ height,
179
+ x,
180
+ y
181
+ };
182
+ }
183
+ function getViewportRect(element, strategy) {
184
+ const win = getWindow(element);
185
+ const html = getDocumentElement(element);
186
+ const visualViewport = win.visualViewport;
187
+ let width = html.clientWidth;
188
+ let height = html.clientHeight;
189
+ let x = 0;
190
+ let y = 0;
191
+ if (visualViewport) {
192
+ width = visualViewport.width;
193
+ height = visualViewport.height;
194
+ const visualViewportBased = isWebKit();
195
+ if (!visualViewportBased || visualViewportBased && strategy === "fixed") {
196
+ x = visualViewport.offsetLeft;
197
+ y = visualViewport.offsetTop;
198
+ }
57
199
  }
58
- const win = element.ownerDocument.defaultView || window;
59
- return win.devicePixelRatio || 1;
200
+ return {
201
+ width,
202
+ height,
203
+ x,
204
+ y
205
+ };
60
206
  }
61
- function roundByDPR(element, value) {
62
- const dpr = getDPR(element);
63
- return Math.round(value * dpr) / dpr;
207
+ function getInnerBoundingClientRect(element, strategy) {
208
+ const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
209
+ const top = clientRect.top + element.clientTop;
210
+ const left = clientRect.left + element.clientLeft;
211
+ const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
212
+ const width = element.clientWidth * scale.x;
213
+ const height = element.clientHeight * scale.y;
214
+ const x = left * scale.x;
215
+ const y = top * scale.y;
216
+ return {
217
+ width,
218
+ height,
219
+ x,
220
+ y
221
+ };
64
222
  }
65
- function useLatestRef(value) {
66
- const ref = React.useRef(value);
67
- index(() => {
68
- ref.current = value;
69
- });
70
- return ref;
223
+ function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
224
+ let rect;
225
+ if (clippingAncestor === "viewport") {
226
+ rect = getViewportRect(element, strategy);
227
+ } else if (clippingAncestor === "document") {
228
+ rect = getDocumentRect(getDocumentElement(element));
229
+ } else if (isElement(clippingAncestor)) {
230
+ rect = getInnerBoundingClientRect(clippingAncestor, strategy);
231
+ } else {
232
+ const visualOffsets = getVisualOffsets(element);
233
+ rect = {
234
+ ...clippingAncestor,
235
+ x: clippingAncestor.x - visualOffsets.x,
236
+ y: clippingAncestor.y - visualOffsets.y
237
+ };
238
+ }
239
+ return rectToClientRect(rect);
240
+ }
241
+ function hasFixedPositionAncestor(element, stopNode) {
242
+ const parentNode = getParentNode(element);
243
+ if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
244
+ return false;
245
+ }
246
+ return getComputedStyle(parentNode).position === "fixed" || hasFixedPositionAncestor(parentNode, stopNode);
247
+ }
248
+ function getClippingElementAncestors(element, cache) {
249
+ const cachedResult = cache.get(element);
250
+ if (cachedResult) {
251
+ return cachedResult;
252
+ }
253
+ let result = getOverflowAncestors(element, [], false).filter((el) => isElement(el) && getNodeName(el) !== "body");
254
+ let currentContainingBlockComputedStyle = null;
255
+ const elementIsFixed = getComputedStyle(element).position === "fixed";
256
+ let currentNode = elementIsFixed ? getParentNode(element) : element;
257
+ while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
258
+ const computedStyle = getComputedStyle(currentNode);
259
+ const currentNodeIsContaining = isContainingBlock(currentNode);
260
+ if (!currentNodeIsContaining && computedStyle.position === "fixed") {
261
+ currentContainingBlockComputedStyle = null;
262
+ }
263
+ const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && ["absolute", "fixed"].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
264
+ if (shouldDropCurrentNode) {
265
+ result = result.filter((ancestor) => ancestor !== currentNode);
266
+ } else {
267
+ currentContainingBlockComputedStyle = computedStyle;
268
+ }
269
+ currentNode = getParentNode(currentNode);
270
+ }
271
+ cache.set(element, result);
272
+ return result;
273
+ }
274
+ function getClippingRect(_ref) {
275
+ let {
276
+ element,
277
+ boundary,
278
+ rootBoundary,
279
+ strategy
280
+ } = _ref;
281
+ const elementClippingAncestors = boundary === "clippingAncestors" ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
282
+ const clippingAncestors = [...elementClippingAncestors, rootBoundary];
283
+ const firstClippingAncestor = clippingAncestors[0];
284
+ const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
285
+ const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
286
+ accRect.top = max(rect.top, accRect.top);
287
+ accRect.right = min(rect.right, accRect.right);
288
+ accRect.bottom = min(rect.bottom, accRect.bottom);
289
+ accRect.left = max(rect.left, accRect.left);
290
+ return accRect;
291
+ }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
292
+ return {
293
+ width: clippingRect.right - clippingRect.left,
294
+ height: clippingRect.bottom - clippingRect.top,
295
+ x: clippingRect.left,
296
+ y: clippingRect.top
297
+ };
298
+ }
299
+ function getDimensions(element) {
300
+ const {
301
+ width,
302
+ height
303
+ } = getCssDimensions(element);
304
+ return {
305
+ width,
306
+ height
307
+ };
308
+ }
309
+ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
310
+ const isOffsetParentAnElement = isHTMLElement(offsetParent);
311
+ const documentElement = getDocumentElement(offsetParent);
312
+ const isFixed = strategy === "fixed";
313
+ const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
314
+ let scroll = {
315
+ scrollLeft: 0,
316
+ scrollTop: 0
317
+ };
318
+ const offsets = createCoords(0);
319
+ if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
320
+ if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
321
+ scroll = getNodeScroll(offsetParent);
322
+ }
323
+ if (isOffsetParentAnElement) {
324
+ const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
325
+ offsets.x = offsetRect.x + offsetParent.clientLeft;
326
+ offsets.y = offsetRect.y + offsetParent.clientTop;
327
+ } else if (documentElement) {
328
+ offsets.x = getWindowScrollBarX(documentElement);
329
+ }
330
+ }
331
+ const x = rect.left + scroll.scrollLeft - offsets.x;
332
+ const y = rect.top + scroll.scrollTop - offsets.y;
333
+ return {
334
+ x,
335
+ y,
336
+ width: rect.width,
337
+ height: rect.height
338
+ };
339
+ }
340
+ function isStaticPositioned(element) {
341
+ return getComputedStyle(element).position === "static";
71
342
  }
72
- function useFloating(options) {
343
+ function getTrueOffsetParent(element, polyfill) {
344
+ if (!isHTMLElement(element) || getComputedStyle(element).position === "fixed") {
345
+ return null;
346
+ }
347
+ if (polyfill) {
348
+ return polyfill(element);
349
+ }
350
+ return element.offsetParent;
351
+ }
352
+ function getOffsetParent(element, polyfill) {
353
+ const win = getWindow(element);
354
+ if (isTopLayer(element)) {
355
+ return win;
356
+ }
357
+ if (!isHTMLElement(element)) {
358
+ let svgOffsetParent = getParentNode(element);
359
+ while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
360
+ if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
361
+ return svgOffsetParent;
362
+ }
363
+ svgOffsetParent = getParentNode(svgOffsetParent);
364
+ }
365
+ return win;
366
+ }
367
+ let offsetParent = getTrueOffsetParent(element, polyfill);
368
+ while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
369
+ offsetParent = getTrueOffsetParent(offsetParent, polyfill);
370
+ }
371
+ if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
372
+ return win;
373
+ }
374
+ return offsetParent || getContainingBlock(element) || win;
375
+ }
376
+ const getElementRects = async function(data) {
377
+ const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
378
+ const getDimensionsFn = this.getDimensions;
379
+ const floatingDimensions = await getDimensionsFn(data.floating);
380
+ return {
381
+ reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
382
+ floating: {
383
+ x: 0,
384
+ y: 0,
385
+ width: floatingDimensions.width,
386
+ height: floatingDimensions.height
387
+ }
388
+ };
389
+ };
390
+ function isRTL(element) {
391
+ return getComputedStyle(element).direction === "rtl";
392
+ }
393
+ const platform = {
394
+ convertOffsetParentRelativeRectToViewportRelativeRect,
395
+ getDocumentElement,
396
+ getClippingRect,
397
+ getOffsetParent,
398
+ getElementRects,
399
+ getClientRects,
400
+ getDimensions,
401
+ getScale,
402
+ isElement,
403
+ isRTL
404
+ };
405
+ function observeMove(element, onMove) {
406
+ let io = null;
407
+ let timeoutId;
408
+ const root = getDocumentElement(element);
409
+ function cleanup() {
410
+ var _io;
411
+ clearTimeout(timeoutId);
412
+ (_io = io) == null || _io.disconnect();
413
+ io = null;
414
+ }
415
+ function refresh(skip, threshold) {
416
+ if (skip === void 0) {
417
+ skip = false;
418
+ }
419
+ if (threshold === void 0) {
420
+ threshold = 1;
421
+ }
422
+ cleanup();
423
+ const {
424
+ left,
425
+ top,
426
+ width,
427
+ height
428
+ } = element.getBoundingClientRect();
429
+ if (!skip) {
430
+ onMove();
431
+ }
432
+ if (!width || !height) {
433
+ return;
434
+ }
435
+ const insetTop = floor(top);
436
+ const insetRight = floor(root.clientWidth - (left + width));
437
+ const insetBottom = floor(root.clientHeight - (top + height));
438
+ const insetLeft = floor(left);
439
+ const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
440
+ const options = {
441
+ rootMargin,
442
+ threshold: max(0, min(1, threshold)) || 1
443
+ };
444
+ let isFirstUpdate = true;
445
+ function handleObserve(entries) {
446
+ const ratio = entries[0].intersectionRatio;
447
+ if (ratio !== threshold) {
448
+ if (!isFirstUpdate) {
449
+ return refresh();
450
+ }
451
+ if (!ratio) {
452
+ timeoutId = setTimeout(() => {
453
+ refresh(false, 1e-7);
454
+ }, 1e3);
455
+ } else {
456
+ refresh(false, ratio);
457
+ }
458
+ }
459
+ isFirstUpdate = false;
460
+ }
461
+ try {
462
+ io = new IntersectionObserver(handleObserve, {
463
+ ...options,
464
+ // Handle <iframe>s
465
+ root: root.ownerDocument
466
+ });
467
+ } catch (e) {
468
+ io = new IntersectionObserver(handleObserve, options);
469
+ }
470
+ io.observe(element);
471
+ }
472
+ refresh(true);
473
+ return cleanup;
474
+ }
475
+ function autoUpdate(reference, floating, update, options) {
73
476
  if (options === void 0) {
74
477
  options = {};
75
478
  }
76
479
  const {
77
- placement = "bottom",
78
- strategy = "absolute",
79
- middleware = [],
80
- platform: platform2,
81
- elements: {
82
- reference: externalReference,
83
- floating: externalFloating
84
- } = {},
85
- transform = true,
86
- whileElementsMounted,
87
- open
480
+ ancestorScroll = true,
481
+ ancestorResize = true,
482
+ elementResize = typeof ResizeObserver === "function",
483
+ layoutShift = typeof IntersectionObserver === "function",
484
+ animationFrame = false
88
485
  } = options;
89
- const [data, setData] = React.useState({
90
- x: 0,
91
- y: 0,
92
- strategy,
93
- placement,
94
- middlewareData: {},
95
- isPositioned: false
486
+ const referenceEl = unwrapElement(reference);
487
+ const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...getOverflowAncestors(floating)] : [];
488
+ ancestors.forEach((ancestor) => {
489
+ ancestorScroll && ancestor.addEventListener("scroll", update, {
490
+ passive: true
491
+ });
492
+ ancestorResize && ancestor.addEventListener("resize", update);
96
493
  });
97
- const [latestMiddleware, setLatestMiddleware] = React.useState(middleware);
98
- if (!deepEqual(latestMiddleware, middleware)) {
99
- setLatestMiddleware(middleware);
100
- }
101
- const [_reference, _setReference] = React.useState(null);
102
- const [_floating, _setFloating] = React.useState(null);
103
- const setReference = React.useCallback((node) => {
104
- if (node !== referenceRef.current) {
105
- referenceRef.current = node;
106
- _setReference(node);
107
- }
108
- }, []);
109
- const setFloating = React.useCallback((node) => {
110
- if (node !== floatingRef.current) {
111
- floatingRef.current = node;
112
- _setFloating(node);
113
- }
114
- }, []);
115
- const referenceEl = externalReference || _reference;
116
- const floatingEl = externalFloating || _floating;
117
- const referenceRef = React.useRef(null);
118
- const floatingRef = React.useRef(null);
119
- const dataRef = React.useRef(data);
120
- const hasWhileElementsMounted = whileElementsMounted != null;
121
- const whileElementsMountedRef = useLatestRef(whileElementsMounted);
122
- const platformRef = useLatestRef(platform2);
123
- const update = React.useCallback(() => {
124
- if (!referenceRef.current || !floatingRef.current) {
125
- return;
126
- }
127
- const config = {
128
- placement,
129
- strategy,
130
- middleware: latestMiddleware
131
- };
132
- if (platformRef.current) {
133
- config.platform = platformRef.current;
134
- }
135
- computePosition(referenceRef.current, floatingRef.current, config).then((data2) => {
136
- const fullData = {
137
- ...data2,
138
- isPositioned: true
139
- };
140
- if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) {
141
- dataRef.current = fullData;
142
- ReactDOM.flushSync(() => {
143
- setData(fullData);
494
+ const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
495
+ let reobserveFrame = -1;
496
+ let resizeObserver = null;
497
+ if (elementResize) {
498
+ resizeObserver = new ResizeObserver((_ref) => {
499
+ let [firstEntry] = _ref;
500
+ if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
501
+ resizeObserver.unobserve(floating);
502
+ cancelAnimationFrame(reobserveFrame);
503
+ reobserveFrame = requestAnimationFrame(() => {
504
+ var _resizeObserver;
505
+ (_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
144
506
  });
145
507
  }
508
+ update();
146
509
  });
147
- }, [latestMiddleware, placement, strategy, platformRef]);
148
- index(() => {
149
- if (open === false && dataRef.current.isPositioned) {
150
- dataRef.current.isPositioned = false;
151
- setData((data2) => ({
152
- ...data2,
153
- isPositioned: false
154
- }));
155
- }
156
- }, [open]);
157
- const isMountedRef = React.useRef(false);
158
- index(() => {
159
- isMountedRef.current = true;
160
- return () => {
161
- isMountedRef.current = false;
162
- };
163
- }, []);
164
- index(() => {
165
- if (referenceEl) referenceRef.current = referenceEl;
166
- if (floatingEl) floatingRef.current = floatingEl;
167
- if (referenceEl && floatingEl) {
168
- if (whileElementsMountedRef.current) {
169
- return whileElementsMountedRef.current(referenceEl, floatingEl, update);
170
- }
510
+ if (referenceEl && !animationFrame) {
511
+ resizeObserver.observe(referenceEl);
512
+ }
513
+ resizeObserver.observe(floating);
514
+ }
515
+ let frameId;
516
+ let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
517
+ if (animationFrame) {
518
+ frameLoop();
519
+ }
520
+ function frameLoop() {
521
+ const nextRefRect = getBoundingClientRect(reference);
522
+ if (prevRefRect && (nextRefRect.x !== prevRefRect.x || nextRefRect.y !== prevRefRect.y || nextRefRect.width !== prevRefRect.width || nextRefRect.height !== prevRefRect.height)) {
171
523
  update();
172
524
  }
173
- }, [referenceEl, floatingEl, update, whileElementsMountedRef, hasWhileElementsMounted]);
174
- const refs = React.useMemo(() => ({
175
- reference: referenceRef,
176
- floating: floatingRef,
177
- setReference,
178
- setFloating
179
- }), [setReference, setFloating]);
180
- const elements = React.useMemo(() => ({
181
- reference: referenceEl,
182
- floating: floatingEl
183
- }), [referenceEl, floatingEl]);
184
- const floatingStyles = React.useMemo(() => {
185
- const initialStyles = {
186
- position: strategy,
187
- left: 0,
188
- top: 0
189
- };
190
- if (!elements.floating) {
191
- return initialStyles;
192
- }
193
- const x = roundByDPR(elements.floating, data.x);
194
- const y = roundByDPR(elements.floating, data.y);
195
- if (transform) {
196
- return {
197
- ...initialStyles,
198
- transform: "translate(" + x + "px, " + y + "px)",
199
- ...getDPR(elements.floating) >= 1.5 && {
200
- willChange: "transform"
201
- }
202
- };
525
+ prevRefRect = nextRefRect;
526
+ frameId = requestAnimationFrame(frameLoop);
527
+ }
528
+ update();
529
+ return () => {
530
+ var _resizeObserver2;
531
+ ancestors.forEach((ancestor) => {
532
+ ancestorScroll && ancestor.removeEventListener("scroll", update);
533
+ ancestorResize && ancestor.removeEventListener("resize", update);
534
+ });
535
+ cleanupIo == null || cleanupIo();
536
+ (_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
537
+ resizeObserver = null;
538
+ if (animationFrame) {
539
+ cancelAnimationFrame(frameId);
203
540
  }
204
- return {
205
- position: strategy,
206
- left: x,
207
- top: y
208
- };
209
- }, [strategy, transform, elements.floating, data.x, data.y]);
210
- return React.useMemo(() => ({
211
- ...data,
212
- update,
213
- refs,
214
- elements,
215
- floatingStyles
216
- }), [data, update, refs, elements, floatingStyles]);
217
- }
218
- const offset = (options, deps) => ({
219
- ...offset$1(options),
220
- options: [options, deps]
221
- });
222
- const shift = (options, deps) => ({
223
- ...shift$1(options),
224
- options: [options, deps]
225
- });
226
- const autoPlacement = (options, deps) => ({
227
- ...autoPlacement$1(options),
228
- options: [options, deps]
229
- });
230
- const inline = (options, deps) => ({
231
- ...inline$1(options),
232
- options: [options, deps]
233
- });
541
+ };
542
+ }
543
+ const offset = offset$1;
544
+ const shift = shift$1;
545
+ const inline = inline$1;
546
+ const computePosition = (reference, floating, options) => {
547
+ const cache = /* @__PURE__ */ new Map();
548
+ const mergedOptions = {
549
+ platform,
550
+ ...options
551
+ };
552
+ const platformWithCache = {
553
+ ...mergedOptions.platform,
554
+ _c: cache
555
+ };
556
+ return computePosition$1(reference, floating, {
557
+ ...mergedOptions,
558
+ platform: platformWithCache
559
+ });
560
+ };
234
561
  export {
235
- autoPlacement,
236
562
  autoUpdate,
237
563
  computePosition,
564
+ getOverflowAncestors,
238
565
  inline,
239
566
  offset,
240
567
  platform,
241
- shift,
242
- useFloating
568
+ shift
243
569
  };
244
570
  //# sourceMappingURL=react-text-annotator.es11.js.map