rc-dock - npm Package Compare versions

Comparing version 2.0.1 to 2.0.2

example/panel-style.jsx

@@ -94,3 +94,3 @@ import React from 'react';
           {
-            tabs: [{...customTab, id: 't4'}, {...customTab, id: 't6'}, {...customTab, id: 't6'}],
+            tabs: [{...customTab, id: 't4'}, {...customTab, id: 't5'}, {...customTab, id: 't6'}],
           },
@@ -97,0 +97,0 @@ {

lib/Algorithm.d.ts

@@ -11,3 +11,3 @@ import { BoxData, DropDirection, LayoutData, PanelData, TabBase, TabData } from "./DockData";
 export declare function dockPanelToBox(layout: LayoutData, newPanel: PanelData, box: BoxData, direction: DropDirection): LayoutData;
-export declare function floatPanel(layout: LayoutData, newPanel: PanelData, rect: {
+export declare function floatPanel(layout: LayoutData, newPanel: PanelData, rect?: {
     left: number;
@@ -14,0 +14,0 @@ top: number;

lib/Algorithm.js

@@ -224,6 +224,8 @@ "use strict";
     let newBox = clone(layout.floatbox);
-    newPanel.x = rect.left;
-    newPanel.y = rect.top;
-    newPanel.w = rect.width;
-    newPanel.h = rect.height;
+    if (rect) {
+        newPanel.x = rect.left;
+        newPanel.y = rect.top;
+        newPanel.w = rect.width;
+        newPanel.h = rect.height;
+    }
     newBox.children.push(newPanel);
@@ -230,0 +232,0 @@ return replaceBox(layout, layout.floatbox, newBox);

lib/DockPanel.d.ts

@@ -35,3 +35,3 @@ import React from "react";
     onPanelCornerDrag(e: DragState, corner: string): void;
-    onPanelCornerDragMove: (e: MouseEvent | TouchEvent, dx: number, dy: number) => void;
+    onPanelCornerDragMove: (e: DragState) => void;
     onFloatPointerDown: () => void;
@@ -38,0 +38,0 @@ render(): React.ReactNode;

lib/DockPanel.js

@@ -80,27 +80,27 @@ "use strict";
         };
-        this.onPanelCornerDragMove = (e, dx, dy) => {
+        this.onPanelCornerDragMove = (e) => {
             let { panelData } = this.props;
             switch (this._movingCorner) {
                 case 'tl': {
-                    panelData.x = this._movingX + dx;
-                    panelData.w = this._movingW - dx;
-                    panelData.y = this._movingY + dy;
-                    panelData.h = this._movingH - dy;
+                    panelData.x = this._movingX + e.dx;
+                    panelData.w = this._movingW - e.dx;
+                    panelData.y = this._movingY + e.dy;
+                    panelData.h = this._movingH - e.dy;
                     break;
                 }
                 case 'tr': {
-                    panelData.w = this._movingW + dx;
-                    panelData.y = this._movingY + dy;
-                    panelData.h = this._movingH - dy;
+                    panelData.w = this._movingW + e.dx;
+                    panelData.y = this._movingY + e.dy;
+                    panelData.h = this._movingH - e.dy;
                     break;
                 }
                 case 'bl': {
-                    panelData.x = this._movingX + dx;
-                    panelData.w = this._movingW - dx;
-                    panelData.h = this._movingH + dy;
+                    panelData.x = this._movingX + e.dx;
+                    panelData.w = this._movingW - e.dx;
+                    panelData.h = this._movingH + e.dy;
                     break;
                 }
                 case 'br': {
-                    panelData.w = this._movingW + dx;
-                    panelData.h = this._movingH + dy;
+                    panelData.w = this._movingW + e.dx;
+                    panelData.h = this._movingH + e.dy;
                     break;
@@ -184,6 +184,6 @@ }
                 [
-                    react_1.default.createElement(DragDropDiv_1.DragDropDiv, { key: 'drag-size-t-l', className: 'dock-panel-drag-size dock-panel-drag-size-t-l', onDragStartT: this.onPanelCornerDragTL }),
-                    react_1.default.createElement(DragDropDiv_1.DragDropDiv, { key: 'drag-size-t-r', className: 'dock-panel-drag-size dock-panel-drag-size-t-r', onDragStartT: this.onPanelCornerDragTR }),
-                    react_1.default.createElement(DragDropDiv_1.DragDropDiv, { key: 'drag-size-b-l', className: 'dock-panel-drag-size dock-panel-drag-size-b-l', onDragStartT: this.onPanelCornerDragBL }),
-                    react_1.default.createElement(DragDropDiv_1.DragDropDiv, { key: 'drag-size-b-r', className: 'dock-panel-drag-size dock-panel-drag-size-b-r', onDragStartT: this.onPanelCornerDragBR })
+                    react_1.default.createElement(DragDropDiv_1.DragDropDiv, { key: 'drag-size-t-l', className: 'dock-panel-drag-size dock-panel-drag-size-t-l', onDragStartT: this.onPanelCornerDragTL, onDragMoveT: this.onPanelCornerDragMove }),
+                    react_1.default.createElement(DragDropDiv_1.DragDropDiv, { key: 'drag-size-t-r', className: 'dock-panel-drag-size dock-panel-drag-size-t-r', onDragStartT: this.onPanelCornerDragTR, onDragMoveT: this.onPanelCornerDragMove }),
+                    react_1.default.createElement(DragDropDiv_1.DragDropDiv, { key: 'drag-size-b-l', className: 'dock-panel-drag-size dock-panel-drag-size-b-l', onDragStartT: this.onPanelCornerDragBL, onDragMoveT: this.onPanelCornerDragMove }),
+                    react_1.default.createElement(DragDropDiv_1.DragDropDiv, { key: 'drag-size-b-r', className: 'dock-panel-drag-size dock-panel-drag-size-b-r', onDragStartT: this.onPanelCornerDragBR, onDragMoveT: this.onPanelCornerDragMove })
                 ]
@@ -190,0 +190,0 @@ : null,

lib/DockTabs.js

@@ -85,3 +85,3 @@ "use strict";
             react_1.default.createElement(DragDropDiv_1.DragDropDiv, { className: 'dock-tab-hit-area', getRef: this.getHitAreaRef, onDragStartT: onDragStart, onDragOverT: this.onDragOver, onDropT: this.onDrop, onDragLeaveT: this.onDragLeave }, closable ?
-                react_1.default.createElement("a", { className: 'dock-tab-close-btn', onClick: this.onCloseClick }, "x")
+                react_1.default.createElement("div", { className: 'dock-tab-close-btn', onClick: this.onCloseClick })
                 : null)));
@@ -88,0 +88,0 @@ if (cacheContext) {

lib/dragdrop/DragDropDiv.js

@@ -180,8 +180,10 @@ "use strict";
         }
-        if (className) {
-            className = `${className} drag-drop-div`;
+        if (onDragStartT) {
+            if (className) {
+                className = `${className} drag-initiator`;
+            }
+            else {
+                className = 'drag-initiator';
+            }
         }
-        else {
-            className = 'drag-drop-div';
-        }
         return (react_1.default.createElement("div", Object.assign({ ref: this._getRef, className: className }, others, { onPointerDown: onPointerDown }), children));
@@ -188,0 +190,0 @@ }

package.json

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

src/Algorithm.ts

@@ -241,9 +241,11 @@ import {
   layout: LayoutData, newPanel: PanelData,
-  rect: {left: number, top: number, width: number, height: number}
+  rect?: {left: number, top: number, width: number, height: number}
 ): LayoutData {
   let newBox = clone(layout.floatbox);
-  newPanel.x = rect.left;
-  newPanel.y = rect.top;
-  newPanel.w = rect.width;
-  newPanel.h = rect.height;
+  if (rect) {
+    newPanel.x = rect.left;
+    newPanel.y = rect.top;
+    newPanel.w = rect.width;
+    newPanel.h = rect.height;
+  }
 
@@ -250,0 +252,0 @@ newBox.children.push(newPanel);

No alert changes

Improved metrics

Total package byte prevSize

518845

0.12%

Lines of code

7127

0.17%

No dependency changes