@barbuza/core-graphics - npm Package Compare versions

Comparing version 7.1.0 to 7.1.1

lib/editor-state/events/history.d.ts

@@ -17,6 +17,4 @@ import { IPersistedHistoryEvent } from '../../history/history-event';
 }
-export interface IUndoHistoryEvent extends IEditorHistoryEvent {
-}
-export interface IRedoHistoryEvent extends IEditorHistoryEvent {
-}
+export declare type IUndoHistoryEvent = IEditorHistoryEvent;
+export declare type IRedoHistoryEvent = IEditorHistoryEvent;
 export declare function isUpdateHistoryEvent(base: IEditorHistoryEvent): base is IUpdateHistoryEvent;
@@ -23,0 +21,0 @@ export declare function isUndoHistoryEvent(base: IEditorHistoryEvent): base is IUndoHistoryEvent;

lib/renderer/helper-arrow-renderer.d.ts

@@ -25,4 +25,4 @@ /// <reference types="react" />
     };
-    navigateToArrow(): void;
+    navigateToArrow: () => void;
     render(): JSX.Element | null;
 }

lib/renderer/helper-arrow-renderer.js

@@ -63,3 +63,13 @@ "use strict";
     function HelperArrowRenderer() {
-        return _super !== null && _super.apply(this, arguments) || this;
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.navigateToArrow = function () {
+            var _a = _this.props, viewportWidth = _a.viewportWidth, viewportHeight = _a.viewportHeight, onEditorEvent = _a.onEditorEvent;
+            var _b = getArrowPoint(_this.getBBs()), x = _b.x, y = _b.y;
+            var nextViewport = {
+                x: Math.round(x - viewportWidth / 2),
+                y: Math.round(y - viewportHeight / 2)
+            };
+            onEditorEvent(editor_events_1.setViewport(nextViewport));
+        };
+        return _this;
     }
@@ -89,13 +99,3 @@ HelperArrowRenderer.prototype.getBBs = function () {
     };
-    HelperArrowRenderer.prototype.navigateToArrow = function () {
-        var _a = this.props, viewportWidth = _a.viewportWidth, viewportHeight = _a.viewportHeight, onEditorEvent = _a.onEditorEvent;
-        var _b = getArrowPoint(this.getBBs()), x = _b.x, y = _b.y;
-        var nextViewport = {
-            x: Math.round(x - viewportWidth / 2),
-            y: Math.round(y - viewportHeight / 2)
-        };
-        onEditorEvent(editor_events_1.setViewport(nextViewport));
-    };
     HelperArrowRenderer.prototype.render = function () {
-        var _this = this;
         if (!this.showArrow()) {
@@ -110,3 +110,3 @@ return null;
                     React.createElement(arrow_1["default"], null)),
-                React.createElement("rect", { onClick: function () { return _this.navigateToArrow(); }, style: { cursor: 'pointer!important' }, x: -ARROW_SIZE / 2, y: -ARROW_SIZE / 2, height: ARROW_SIZE, width: ARROW_SIZE, fill: 'transparent' }))));
+                React.createElement("rect", { onClick: this.navigateToArrow, style: { cursor: 'pointer!important' }, x: -ARROW_SIZE / 2, y: -ARROW_SIZE / 2, height: ARROW_SIZE, width: ARROW_SIZE, fill: 'transparent' }))));
     };
@@ -113,0 +113,0 @@ return HelperArrowRenderer;

lib/renderer/renderer.d.ts

@@ -13,3 +13,3 @@ /// <reference types="react" />
 }
-export default class Renderer extends React.Component<IRendererPropTypes, any> {
+export default class Renderer extends React.Component<IRendererPropTypes, object> {
     protected rendererCanvasNode: SVGSVGElement;
@@ -39,2 +39,9 @@ getBoundingRect(): {
     protected setRendererCanvasNode: (svg: SVGSVGElement) => void;
+    protected onCanvasMouseMove: (e: React.MouseEvent<SVGSVGElement>) => void;
+    protected onCanvasMouseDown: (e: React.MouseEvent<SVGSVGElement>) => void;
+    protected onCanvasMouseUp: (e: React.MouseEvent<SVGSVGElement>) => void;
+    protected onCanvasMouseLeave: (e: React.MouseEvent<SVGSVGElement>) => void;
+    protected onCanvasMouseEnter: (e: React.MouseEvent<SVGSVGElement>) => void;
+    protected onCanvasBackgroundMouseDown: (e: React.MouseEvent<SVGRectElement>) => void;
+    protected onCanvasBackgroundMouseUp: (e: React.MouseEvent<SVGRectElement>) => void;
 }

lib/renderer/renderer.js

@@ -40,2 +40,29 @@ "use strict";
         };
+        _this.onCanvasMouseMove = function (e) {
+            _this.props.onEditorEvent(editor_events_1.canvasMouseMove(_this.castMouseEvent(e)));
+            _this.checkEvKey(e);
+        };
+        _this.onCanvasMouseDown = function (e) {
+            _this.props.onEditorEvent(editor_events_1.canvasMouseDown(_this.castMouseButtonedEvent(e)));
+            _this.checkEvKey(e);
+        };
+        _this.onCanvasMouseUp = function (e) {
+            _this.props.onEditorEvent(editor_events_1.canvasMouseUp(_this.castMouseButtonedEvent(e)));
+            _this.checkEvKey(e);
+        };
+        _this.onCanvasMouseLeave = function (e) {
+            // TODO tests for leave events?
+            _this.props.onEditorEvent(editor_events_1.canvasMouseUp(_this.castMouseButtonedEvent(e)));
+            _this.props.onEditorEvent(editor_events_1.canvasMouseLeave(_this.castMouseEvent(e)));
+        };
+        _this.onCanvasMouseEnter = function (e) {
+            _this.props.onEditorEvent(editor_events_1.canvasMouseEnter(_this.castMouseEvent(e)));
+            _this.checkEvKey(e);
+        };
+        _this.onCanvasBackgroundMouseDown = function (e) {
+            _this.props.onEditorEvent(editor_events_1.canvasBackgroundMouseDown(_this.castMouseButtonEvent(e)));
+        };
+        _this.onCanvasBackgroundMouseUp = function (e) {
+            _this.props.onEditorEvent(editor_events_1.canvasBackgroundMouseUp(_this.castMouseButtonEvent(e)));
+        };
         return _this;
@@ -107,3 +134,2 @@ }
     Renderer.prototype.render = function () {
-        var _this = this;
         var _a = this.props, onEditorEvent = _a.onEditorEvent, contextMenuRenderer = _a.contextMenuRenderer;
@@ -118,21 +144,5 @@ var _b = this.props.editorState, mouse = _b.mouse, mode = _b.mode, scene = _b.scene, shapesDeclarations = _b.shapesDeclarations, contextMenu = _b.contextMenu, grid = _b.grid;
             !!cursor && (React.createElement("style", null, "\n            ." + css_1.cssName('rendererCanvas') + " * { cursor: " + cursor + "!important }\n          ")),
-            React.createElement("svg", { ref: this.setRendererCanvasNode, className: css_1.cssName('rendererCanvas') + " " + css_1.cssName('flexContainer'), width: '100%', onMouseMove: function (e) {
-                    onEditorEvent(editor_events_1.canvasMouseMove(_this.castMouseEvent(e)));
-                    _this.checkEvKey(e);
-                }, onMouseDown: function (e) {
-                    onEditorEvent(editor_events_1.canvasMouseDown(_this.castMouseButtonedEvent(e)));
-                    _this.checkEvKey(e);
-                }, onMouseUp: function (e) {
-                    onEditorEvent(editor_events_1.canvasMouseUp(_this.castMouseButtonedEvent(e)));
-                    _this.checkEvKey(e);
-                }, onMouseLeave: function (e) {
-                    // TODO tests for leave events?
-                    onEditorEvent(editor_events_1.canvasMouseUp(_this.castMouseButtonedEvent(e)));
-                    onEditorEvent(editor_events_1.canvasMouseLeave(_this.castMouseEvent(e)));
-                }, onMouseEnter: function (e) {
-                    onEditorEvent(editor_events_1.canvasMouseEnter(_this.castMouseEvent(e)));
-                    _this.checkEvKey(e);
-                } },
+            React.createElement("svg", { ref: this.setRendererCanvasNode, className: css_1.cssName('rendererCanvas') + " " + css_1.cssName('flexContainer'), width: '100%', onMouseMove: this.onCanvasMouseMove, onMouseDown: this.onCanvasMouseDown, onMouseUp: this.onCanvasMouseUp, onMouseLeave: this.onCanvasMouseLeave, onMouseEnter: this.onCanvasMouseEnter },
                 grid.on && React.createElement(grid_defs_1["default"], { vx: -x, vy: -y, size: grid.size }),
-                React.createElement("rect", { x: 0, y: 0, width: '100%', height: '100%', fill: grid.on ? "url(#" + grid_defs_1.GRID_DEFS_ID + ")" : 'transparent', onMouseDown: function (e) { return onEditorEvent(editor_events_1.canvasBackgroundMouseDown(_this.castMouseButtonEvent(e))); }, onMouseUp: function (e) { return onEditorEvent(editor_events_1.canvasBackgroundMouseUp(_this.castMouseButtonEvent(e))); } }),
+                React.createElement("rect", { x: 0, y: 0, width: '100%', height: '100%', fill: grid.on ? "url(#" + grid_defs_1.GRID_DEFS_ID + ")" : 'transparent', onMouseDown: this.onCanvasBackgroundMouseDown, onMouseUp: this.onCanvasBackgroundMouseUp }),
                 React.createElement("g", { transform: "translate(" + -x + " " + -y + ")" },
@@ -139,0 +149,0 @@ React.createElement(bounding_box_1.BoundingBoxBackgroundRenderer, { mode: mode, scene: scene, shapesDeclarations: shapesDeclarations, onEditorEvent: onEditorEvent }),

lib/renderer/scene-resize-handles.js

@@ -59,3 +59,6 @@ "use strict";
                 var cursor = handle.cursor;
-                return (React.createElement(resize_handle_1["default"], { key: index, x: x, y: y, cursor: cursor, onMouseDown: function (e) { return _this.handleResizeHandleMouseDown(e, handle); }, onMouseUp: function (e) { return _this.handleResizeHandleMouseUp(e, handle); } }));
+                // TODO: cached bind
+                var onMouseDown = function (e) { return _this.handleResizeHandleMouseDown(e, handle); };
+                var onMouseUp = function (e) { return _this.handleResizeHandleMouseUp(e, handle); };
+                return (React.createElement(resize_handle_1["default"], { key: index, x: x, y: y, cursor: cursor, onMouseDown: onMouseDown, onMouseUp: onMouseUp }));
             })));
@@ -62,0 +65,0 @@ }

package.json

 {
   "name": "@barbuza/core-graphics",
-  "version": "7.1.0",
+  "version": "7.1.1",
   "description": "A core library for creating shape-based graphic editors",
@@ -37,2 +37,3 @@ "main": "lib/index.js",
     "faucet": "0.0.1",
+    "gestapo": "^0.1.1",
     "in-publish": "^2.0.0",
@@ -39,0 +40,0 @@ "react": "^15.6.1",

No alert changes

Improved metrics

Total package byte prevSize

382539

increased by0.42%

Lines of code

5450

increased by0.33%

Worsened metrics

Dev dependency count

9

increased by12.5%

No dependency changes