rc-dock - npm Package Compare versions

Comparing version 2.1.8 to 2.2.0

lib/DockPanel.js

@@ -196,5 +196,5 @@ "use strict";
         let isFloat = parent && parent.mode === 'float';
-        let pointerDownCallback;
-        if (isFloat) {
-            pointerDownCallback = this.onFloatPointerDown;
+        let pointerDownCallback = this.onFloatPointerDown;
+        if (!isFloat) {
+            pointerDownCallback = null;
         }
@@ -215,3 +215,3 @@ let cls = `dock-panel ${panelClass ? panelClass : ''}${dropFromPanel ? ' dock-panel-dropping' : ''}${draggingHeader ? ' dragging' : ''}`;
         }
-        return (react_1.default.createElement(DragDropDiv_1.DragDropDiv, { getRef: this.getRef, className: cls, style: style, "data-dockid": id, onPointerDown: pointerDownCallback, onDragOverT: isFloat ? null : this.onDragOver },
+        return (react_1.default.createElement(DragDropDiv_1.DragDropDiv, { getRef: this.getRef, className: cls, style: style, "data-dockid": id, onMouseDown: pointerDownCallback, onTouchStart: pointerDownCallback, onDragOverT: isFloat ? null : this.onDragOver },
             react_1.default.createElement(DockTabs_1.DockTabs, { panelData: panelData, onPanelDragStart: this.onPanelHeaderDragStart, onPanelDragMove: this.onPanelHeaderDragMove, onPanelDragEnd: this.onPanelHeaderDragEnd }),
@@ -218,0 +218,0 @@ isFloat ?

lib/dragdrop/DragDropDiv.d.ts

@@ -21,4 +21,3 @@ import React from "react";
     _getRef: (r: HTMLDivElement) => void;
-    dragging: boolean;
-    isTouch: boolean;
+    dragType: DragManager.DragType;
     baseX: number;
@@ -29,4 +28,4 @@ baseY: number;
     waitingMove: boolean;
-    onPointerDown: (e: React.PointerEvent<Element>) => void;
-    addListeners(e: React.PointerEvent): void;
+    onPointerDown: (e: React.MouseEvent<Element, MouseEvent> | React.TouchEvent<Element>) => void;
+    addListeners(e: React.MouseEvent | React.TouchEvent): void;
     checkFirstMove(e: AbstractPointerEvent): boolean;
@@ -33,0 +32,0 @@ executeFirstMove(state: DragManager.DragState): boolean;

lib/dragdrop/DragDropDiv.js

@@ -43,4 +43,3 @@ "use strict";
         };
-        this.dragging = false;
-        this.isTouch = false;
+        this.dragType = null;
         this.onPointerDown = (e) => {
@@ -51,4 +50,5 @@ if (!DragManager.checkPointerDownEvent(e.nativeEvent)) {
             }
-            this.baseX = e.pageX;
-            this.baseY = e.pageY;
+            let state = new DragManager.DragState(e.nativeEvent, this, true);
+            this.baseX = state.pageX;
+            this.baseY = state.pageY;
             let baseElement = this.element.parentElement;
@@ -139,18 +139,22 @@ let rect = baseElement.getBoundingClientRect();
         let { onDragStartT } = this.props;
-        if (this.dragging) {
+        if (this.dragType) {
             this.onEnd();
         }
-        if (e.pointerType === 'touch') {
-            this.isTouch = true;
+        if (e.nativeEvent.type === 'touchstart') {
             document.addEventListener('touchmove', this.onTouchMove);
             document.addEventListener('touchend', this.onTouchEnd);
+            this.dragType = 'touch';
         }
         else {
-            this.isTouch = false;
             document.addEventListener('mousemove', this.onMouseMove);
             document.addEventListener('mouseup', this.onMouseEnd);
+            if (e.nativeEvent.button === 2) {
+                this.dragType = 'right';
+            }
+            else {
+                this.dragType = 'left';
+            }
         }
         document.body.classList.add('dock-dragging');
         this.waitingMove = true;
-        this.dragging = true;
     }
@@ -179,3 +183,3 @@ // return true for a valid move
     cleanup(e) {
-        this.dragging = false;
+        this.dragType = null;
         this.waitingMove = false;
@@ -186,3 +190,3 @@ document.body.classList.remove('dock-dragging');
     onEnd() {
-        if (this.isTouch) {
+        if (this.dragType === 'touch') {
             this.onTouchEnd();
@@ -195,5 +199,6 @@ }
     render() {
-        let _a = this.props, { getRef, children, className, onPointerDown, directDragT, onDragStartT, onDragMoveT, onDragEndT, onDragOverT, onDragLeaveT, onDropT } = _a, others = __rest(_a, ["getRef", "children", "className", "onPointerDown", "directDragT", "onDragStartT", "onDragMoveT", "onDragEndT", "onDragOverT", "onDragLeaveT", "onDropT"]);
-        if (!onPointerDown && onDragStartT) {
-            onPointerDown = this.onPointerDown;
+        let _a = this.props, { getRef, children, className, directDragT, onDragStartT, onDragMoveT, onDragEndT, onDragOverT, onDragLeaveT, onDropT } = _a, others = __rest(_a, ["getRef", "children", "className", "directDragT", "onDragStartT", "onDragMoveT", "onDragEndT", "onDragOverT", "onDragLeaveT", "onDropT"]);
+        let onPointerDown = this.onPointerDown;
+        if (!onDragStartT) {
+            onPointerDown = null;
         }
@@ -208,3 +213,3 @@ if (onDragStartT) {
         }
-        return (react_1.default.createElement("div", Object.assign({ ref: this._getRef, className: className }, others, { onPointerDown: onPointerDown }), children));
+        return (react_1.default.createElement("div", Object.assign({ ref: this._getRef, className: className }, others, { onMouseDown: onPointerDown, onTouchStart: onPointerDown }), children));
     }
@@ -216,3 +221,3 @@ componentWillUnmount() {
         }
-        if (this.dragging) {
+        if (this.dragType) {
             this.onEnd();
@@ -219,0 +224,0 @@ }

lib/dragdrop/DragManager.d.ts

@@ -0,3 +1,5 @@
+export declare type DragType = 'left' | 'right' | 'touch';
 interface DragDropComponent {
     element: HTMLElement;
+    dragType: DragType;
     baseX: number;
@@ -29,2 +31,3 @@ baseY: number;
     static getData(field: string, scope?: any): any;
+    readonly dragType: DragType;
     acceptMessage: string;
@@ -31,0 +34,0 @@ rejected: boolean;

lib/dragdrop/DragManager.js

@@ -21,3 +21,3 @@ "use strict";
             }
-            else if (event instanceof TouchEvent) {
+            else if (event.type.startsWith('touch')) {
                 let touch;
@@ -68,2 +68,5 @@ if (event.type === 'touchend') {
     }
+    get dragType() {
+        return this.component.dragType;
+    }
     accept(message = '') {
@@ -219,3 +222,8 @@ this.acceptMessage = message;
 function checkPointerDownEvent(e) {
+    if (e instanceof MouseEvent && e.button !== 0 && e.button !== 2) {
+        // only allows left right button drag
+        return false;
+    }
     if (e !== _lastPointerDownEvent) {
+        // same event can't trigger drag twice
         _lastPointerDownEvent = e;
@@ -222,0 +230,0 @@ return true;

package.json

 {
   "name": "rc-dock",
-  "version": "2.1.8",
+  "version": "2.2.0",
   "description": "dock layout for react component",
@@ -5,0 +5,0 @@ "repository": {

src/dragdrop/DragManager.ts

@@ -0,3 +1,6 @@
+export type DragType = 'left' | 'right' | 'touch';
+
 interface DragDropComponent {
   element: HTMLElement;
+  dragType: DragType;
   baseX: number;
@@ -30,3 +33,3 @@ baseY: number;
         this.clientY = event.clientY;
-      } else if (event instanceof TouchEvent) {
+      } else if (event.type.startsWith('touch')) {
         let touch: Touch;
@@ -83,2 +86,6 @@ if (event.type === 'touchend') {
 
+  get dragType(): DragType {
+    return this.component.dragType;
+  }
+
   acceptMessage: string;
@@ -264,3 +271,8 @@ rejected: boolean;
 export function checkPointerDownEvent(e: any) {
+  if (e instanceof MouseEvent && e.button !== 0 && e.button !== 2) {
+    // only allows left right button drag
+    return false;
+  }
   if (e !== _lastPointerDownEvent) {
+    // same event can't trigger drag twice
     _lastPointerDownEvent = e;
@@ -267,0 +279,0 @@ return true;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

568810

increased by0.24%

Lines of code

8470

increased by0.4%

No dependency changes