diff --git a/uui-components/src/table/DataTableHeaderCell.tsx b/uui-components/src/table/DataTableHeaderCell.tsx index 8ec46be9e2..e042f3c5ce 100644 --- a/uui-components/src/table/DataTableHeaderCell.tsx +++ b/uui-components/src/table/DataTableHeaderCell.tsx @@ -51,13 +51,20 @@ export class DataTableHeaderCell extends React.Component { + if (this.state.isResizing) { + e.preventDefault(); + e.stopPropagation(); + } + }; + onResizeStart = (e: React.MouseEvent) => { this.setState({ isResizing: true, resizeStartX: e.clientX, originalWidth: this.props.column.width }); document.addEventListener('mousemove', this.onResize); document.addEventListener('click', this.onResizeEnd); + document.addEventListener('selectstart', this.selectOnDragHandler); - e.preventDefault(); e.stopPropagation(); // to prevent column sorting/dnd/ect. handlers while resizing }; @@ -66,6 +73,7 @@ export class DataTableHeaderCell extends React.Component { + if (this.state.isDragging || this.state.isMouseDown) { + e.preventDefault(); + e.stopPropagation(); + } + }; + windowPointerUpHandler = () => { if (this.state.isDragging || this.state.isMouseDown) { this.setState(() => initialState); @@ -237,12 +246,16 @@ function TREE_SHAKEABLE_INIT() { }; }); - if (!isEventTargetInsideInput(e, e.currentTarget)) { - // This prevents text selection start - // dnd don't work without it in ff - e.preventDefault(); - e.stopPropagation(); - } + // if (!isEventTargetInsideInput(e, e.currentTarget)) { + // // This prevents text selection start + // // dnd don't work without it in ff + // // setTimeout(() => { + // // e.preventDefault(); + // // }, 0); + // // console.log('e', e.target); + + // // e.stopPropagation(); + // } } }; } @@ -281,6 +294,7 @@ function TREE_SHAKEABLE_INIT() { if (isEventTargetInsideDraggable(e, e.currentTarget)) { return; } + e.preventDefault(); if (!!this.state.position) { this.props.onDrop && this.props.onDrop({ diff --git a/uui-timeline/src/TimelineController.ts b/uui-timeline/src/TimelineController.ts index 1b04975124..5c57aa94d7 100644 --- a/uui-timeline/src/TimelineController.ts +++ b/uui-timeline/src/TimelineController.ts @@ -117,6 +117,11 @@ export class TimelineController { ); } + selectOnDragHandler = (e: Event) => { + e.preventDefault(); + e.stopPropagation(); + }; + public startDrag = (e: React.MouseEvent) => { if (e.nativeEvent.which === 1) { // If left click @@ -124,9 +129,7 @@ export class TimelineController { this.dragStartViewport = this.currentViewport; this.dragStartMouseX = this.screenMouseX; } - - // Prevent text selection of drag start - e.preventDefault(); + window.addEventListener('selectstart', this.selectOnDragHandler); }; public handleWheelEvent = (e: WheelEvent) => { @@ -369,9 +372,11 @@ export class TimelineController { private handleMouseUp = () => { this.isDragging = false; + window.removeEventListener('selectstart', this.selectOnDragHandler); }; private handleMouseLeave = () => { this.isDragging = false; + window.removeEventListener('selectstart', this.selectOnDragHandler); }; }