@atlaskit/renderer
Version:
Renderer component
82 lines (80 loc) • 3.69 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.useUserSelectionRange = void 0;
var _react = require("react");
var _AnnotationRangeContext = require("../contexts/AnnotationRangeContext");
var _utils = require("./utils");
var _AnnotationManagerContext = require("../contexts/AnnotationManagerContext");
var useUserSelectionRange = exports.useUserSelectionRange = function useUserSelectionRange(props) {
var rendererDOM = props.rendererRef.current;
var selectionTimeoutRef = (0, _react.useRef)();
var _useAnnotationRangeDi = (0, _AnnotationRangeContext.useAnnotationRangeDispatch)(),
clearSelectionRange = _useAnnotationRangeDi.clearSelectionRange,
setSelectionRange = _useAnnotationRangeDi.setSelectionRange;
var _useAnnotationRangeSt = (0, _AnnotationRangeContext.useAnnotationRangeState)(),
range = _useAnnotationRangeSt.range,
type = _useAnnotationRangeSt.type,
selectionDraftRange = _useAnnotationRangeSt.selectionDraftRange;
var _useAnnotationManager = (0, _AnnotationManagerContext.useAnnotationManagerDispatch)(),
annotationManager = _useAnnotationManager.annotationManager;
var lastRangeRef = (0, _react.useRef)(null);
var isAnnotationManagerEnabled = !!annotationManager;
var onSelectionChange = (0, _react.useCallback)(function (_event) {
if (selectionTimeoutRef.current) {
clearTimeout(selectionTimeoutRef.current);
}
selectionTimeoutRef.current = setTimeout(function () {
var sel = document.getSelection();
if (!sel || sel.type !== 'Range' || sel.rangeCount !== 1) {
lastRangeRef.current = null; // Clear last range if selection is invalid
if (isAnnotationManagerEnabled) {
clearSelectionRange();
}
return;
}
var _range = sel.getRangeAt(0);
// Skip if the selection hasn't changed
if (lastRangeRef.current && _range.compareBoundaryPoints(Range.START_TO_START, lastRangeRef.current) === 0 && _range.compareBoundaryPoints(Range.END_TO_END, lastRangeRef.current) === 0) {
return;
}
if (rendererDOM && (0, _utils.isRangeInsideOfRendererContainer)(rendererDOM, _range)) {
var _range2 = _range,
startContainer = _range2.startContainer,
endContainer = _range2.endContainer;
var isTripleClick = endContainer.nodeType !== Node.TEXT_NODE;
if (isTripleClick) {
var p = startContainer;
while (p && p.nodeName !== 'P' && p !== rendererDOM) {
p = p.parentNode;
}
if (p && p.nodeName === 'P' && p instanceof Element) {
var _range3 = document.createRange();
_range3.selectNodeContents(p);
sel.removeAllRanges();
sel.addRange(_range3);
_range = sel.getRangeAt(0);
}
}
setSelectionRange(_range.cloneRange());
lastRangeRef.current = _range;
}
}, 100);
}, [rendererDOM, setSelectionRange, clearSelectionRange, isAnnotationManagerEnabled]);
(0, _react.useEffect)(function () {
if (!document || !rendererDOM) {
return;
}
// Ignored via go/ees005
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
document.addEventListener('selectionchange', onSelectionChange);
return function () {
// Ignored via go/ees005
// eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
document.removeEventListener('selectionchange', onSelectionChange);
clearSelectionRange();
};
}, [rendererDOM, onSelectionChange, clearSelectionRange]);
return [type, range, selectionDraftRange, clearSelectionRange];
};