@knotx/plugins-canvas 0.4.10 → 0.4.11

package/dist/index.cjs

@@ -158,8 +158,8 @@ var __privateIn = (member, obj) => Object(obj) !== obj ? __typeError('Cannot use
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _init_dec, _render_dec, _resetTransform_dec, _setTransform_dec, _zoomOut_dec, _zoomIn_dec, _scrollNodeIntoView_dec, _removeListener_dec, _addListener_dec, _interaction_dec, _container_dec, _getNode_dec, _edgeScroll_dec, _updateContentSize_dec, _contentSize_dec, _rootElement_dec, _transform_dec, _a, _init;
-class Canvas extends (_a = core.BasePlugin, _transform_dec = [decorators.register("transform")], _rootElement_dec = [decorators.register("rootElement")], _contentSize_dec = [decorators.register("contentSize")], _updateContentSize_dec = [decorators.register("updateContentSize")], _edgeScroll_dec = [decorators.register("edgeScroll")], _getNode_dec = [decorators.inject.getNode()], _container_dec = [decorators.inject.container()], _interaction_dec = [decorators.inject.interaction()], _addListener_dec = [decorators.register("addListener")], _removeListener_dec = [decorators.register("removeListener")], _scrollNodeIntoView_dec = [decorators.tool("Scroll node into view", {
+var _init_dec, _render_dec, _resetTransform_dec, _setTransform_dec, _zoomOut_dec, _zoomIn_dec, _scrollNodeIntoView_dec, _removeListener_dec, _addListener_dec, _registerDataManager_dec, _interaction_dec, _container_dec, _getNode_dec, _edgeScroll_dec, _updateContentSize_dec, _contentSize_dec, _rootElement_dec, _transform_dec, _a, _init;
+class Canvas extends (_a = core.BasePlugin, _transform_dec = [decorators.register("transform")], _rootElement_dec = [decorators.register("rootElement")], _contentSize_dec = [decorators.register("contentSize")], _updateContentSize_dec = [decorators.register("updateContentSize")], _edgeScroll_dec = [decorators.register("edgeScroll")], _getNode_dec = [decorators.inject.getNode()], _container_dec = [decorators.inject.container()], _interaction_dec = [decorators.inject.interaction()], _registerDataManager_dec = [decorators.inject.history.registerDataManager()], _addListener_dec = [decorators.register("addListener")], _removeListener_dec = [decorators.register("removeListener")], _scrollNodeIntoView_dec = [decorators.tool("Scroll node into view", {
   type: "object",
   properties: {
     nodeId: { type: "string" },
@@ -209,11 +209,20 @@ class Canvas extends (_a = core.BasePlugin, _transform_dec = [decorators.registe
     __publicField(this, "config");
     __publicField(this, "name", "canvas");
     __publicField(this, "ref", null);
+    __publicField(this, "dataManager", new core.DataManager(this.name));
     __publicField(this, "transform", __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
     __publicField(this, "rootElement", __runInitializers(_init, 12, this, null)), __runInitializers(_init, 15, this);
     __publicField(this, "contentSize", __runInitializers(_init, 16, this)), __runInitializers(_init, 19, this);
     __publicField(this, "updateContentSize", __runInitializers(_init, 20, this, (contentSize) => {
+      if (lodashEs.isEqual(this.contentSize, contentSize)) {
+        return;
+      }
       this.contentSize = contentSize;
+      this.dataManager.dispatch({
+        id: "contentSize",
+        type: "update",
+        data: { data: contentSize }
+      });
     })), __runInitializers(_init, 23, this);
     __publicField(this, "edgeScroll", __runInitializers(_init, 24, this, {
       config: {
@@ -233,6 +242,7 @@ class Canvas extends (_a = core.BasePlugin, _transform_dec = [decorators.registe
     __publicField(this, "getNode", __runInitializers(_init, 28, this)), __runInitializers(_init, 31, this);
     __publicField(this, "container", __runInitializers(_init, 32, this)), __runInitializers(_init, 35, this);
     __publicField(this, "interaction", __runInitializers(_init, 36, this)), __runInitializers(_init, 39, this);
+    __publicField(this, "registerDataManager", __runInitializers(_init, 40, this)), __runInitializers(_init, 43, this);
     __publicField(this, "listeners", {
       click: /* @__PURE__ */ new Set(),
       contextmenu: /* @__PURE__ */ new Set(),
@@ -241,12 +251,12 @@ class Canvas extends (_a = core.BasePlugin, _transform_dec = [decorators.registe
     });
     __publicField(this, "edgeScrollAnimationFrame", null);
     __publicField(this, "mousePosition", null);
-    __publicField(this, "addListener", __runInitializers(_init, 40, this, (type, listener) => {
+    __publicField(this, "addListener", __runInitializers(_init, 44, this, (type, listener) => {
       this.listeners[type].add(listener);
-    })), __runInitializers(_init, 43, this);
-    __publicField(this, "removeListener", __runInitializers(_init, 44, this, (type, listener) => {
-      this.listeners[type].delete(listener);
     })), __runInitializers(_init, 47, this);
+    __publicField(this, "removeListener", __runInitializers(_init, 48, this, (type, listener) => {
+      this.listeners[type].delete(listener);
+    })), __runInitializers(_init, 51, this);
     __publicField(this, "onClick", (e) => {
       if (!this.isCanvasEvent(e)) {
         return;
@@ -489,6 +499,17 @@ class Canvas extends (_a = core.BasePlugin, _transform_dec = [decorators.registe
       }
       this.rootElement = null;
     });
+    if (this.registerDataManager) {
+      this.subscriptions.push(this.registerDataManager(this.dataManager));
+    }
+    this.dataManager.init([{ id: "contentSize", data: void 0 }]);
+    this.subscriptions.push(
+      this.dataManager.getData$("contentSize").subscribe((contentSize) => {
+        if (contentSize == null ? void 0 : contentSize.data) {
+          this.updateContentSize(contentSize.data);
+        }
+      })
+    );
   }
   groupLayers(children) {
     const fixedLayers = [];
@@ -549,6 +570,7 @@ __decorateElement(_init, 5, "edgeScroll", _edgeScroll_dec, Canvas);
 __decorateElement(_init, 5, "getNode", _getNode_dec, Canvas);
 __decorateElement(_init, 5, "container", _container_dec, Canvas);
 __decorateElement(_init, 5, "interaction", _interaction_dec, Canvas);
+__decorateElement(_init, 5, "registerDataManager", _registerDataManager_dec, Canvas);
 __decorateElement(_init, 5, "addListener", _addListener_dec, Canvas);
 __decorateElement(_init, 5, "removeListener", _removeListener_dec, Canvas);
 __decoratorMetadata(_init, Canvas);

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-import { Element, BasePlugin, DOMElement, Engine } from '@knotx/core';
+import { Element, BasePlugin, DataManager, DOMElement, Engine, PluginData } from '@knotx/core';
 import { InferParamsFromSchema } from '@knotx/decorators';
 import { ReactZoomPanPinchProps, ReactZoomPanPinchContentRef } from '@knotx/react-zoom-pan-pinch';
 import { MouseEvent, ReactNode } from 'react';
@@ -78,10 +78,15 @@ declare module '@knotx/core' {
 }
 type CanvasEventType = 'click' | 'contextmenu' | 'mouseenter' | 'mouseleave';
 type CanvasEventListener = (event: MouseEvent<HTMLElement>) => void;
+interface CanvasDataType {
+    id: 'contentSize';
+    data: CanvasContentSize | undefined;
+}
 declare class Canvas extends BasePlugin<'canvas', CanvasConfig> {
     private config;
     name: "canvas";
     ref: ReactZoomPanPinchContentRef | null;
+    dataManager: DataManager<CanvasDataType, "canvas">;
     transform: CanvasTransformState;
     rootElement: DOMElement | null;
     contentSize: CanvasContentSize | undefined;
@@ -93,6 +98,7 @@ declare class Canvas extends BasePlugin<'canvas', CanvasConfig> {
     private getNode;
     private container;
     interaction: Engine['interaction'];
+    registerDataManager: PluginData['history']['registerDataManager'];
     private listeners;
     private edgeScrollAnimationFrame;
     private mousePosition;

package/dist/index.d.mts

@@ -1,4 +1,4 @@
-import { Element, BasePlugin, DOMElement, Engine } from '@knotx/core';
+import { Element, BasePlugin, DataManager, DOMElement, Engine, PluginData } from '@knotx/core';
 import { InferParamsFromSchema } from '@knotx/decorators';
 import { ReactZoomPanPinchProps, ReactZoomPanPinchContentRef } from '@knotx/react-zoom-pan-pinch';
 import { MouseEvent, ReactNode } from 'react';
@@ -78,10 +78,15 @@ declare module '@knotx/core' {
 }
 type CanvasEventType = 'click' | 'contextmenu' | 'mouseenter' | 'mouseleave';
 type CanvasEventListener = (event: MouseEvent<HTMLElement>) => void;
+interface CanvasDataType {
+    id: 'contentSize';
+    data: CanvasContentSize | undefined;
+}
 declare class Canvas extends BasePlugin<'canvas', CanvasConfig> {
     private config;
     name: "canvas";
     ref: ReactZoomPanPinchContentRef | null;
+    dataManager: DataManager<CanvasDataType, "canvas">;
     transform: CanvasTransformState;
     rootElement: DOMElement | null;
     contentSize: CanvasContentSize | undefined;
@@ -93,6 +98,7 @@ declare class Canvas extends BasePlugin<'canvas', CanvasConfig> {
     private getNode;
     private container;
     interaction: Engine['interaction'];
+    registerDataManager: PluginData['history']['registerDataManager'];
     private listeners;
     private edgeScrollAnimationFrame;
     private mousePosition;

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { Element, BasePlugin, DOMElement, Engine } from '@knotx/core';
+import { Element, BasePlugin, DataManager, DOMElement, Engine, PluginData } from '@knotx/core';
 import { InferParamsFromSchema } from '@knotx/decorators';
 import { ReactZoomPanPinchProps, ReactZoomPanPinchContentRef } from '@knotx/react-zoom-pan-pinch';
 import { MouseEvent, ReactNode } from 'react';
@@ -78,10 +78,15 @@ declare module '@knotx/core' {
 }
 type CanvasEventType = 'click' | 'contextmenu' | 'mouseenter' | 'mouseleave';
 type CanvasEventListener = (event: MouseEvent<HTMLElement>) => void;
+interface CanvasDataType {
+    id: 'contentSize';
+    data: CanvasContentSize | undefined;
+}
 declare class Canvas extends BasePlugin<'canvas', CanvasConfig> {
     private config;
     name: "canvas";
     ref: ReactZoomPanPinchContentRef | null;
+    dataManager: DataManager<CanvasDataType, "canvas">;
     transform: CanvasTransformState;
     rootElement: DOMElement | null;
     contentSize: CanvasContentSize | undefined;
@@ -93,6 +98,7 @@ declare class Canvas extends BasePlugin<'canvas', CanvasConfig> {
     private getNode;
     private container;
     interaction: Engine['interaction'];
+    registerDataManager: PluginData['history']['registerDataManager'];
     private listeners;
     private edgeScrollAnimationFrame;
     private mousePosition;

package/dist/index.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from '@knotx/jsx/jsx-runtime';
-import { Layer, use, DOMElement, bem, BasePlugin, InteractionPriority } from '@knotx/core';
+import { Layer, DataManager, use, DOMElement, bem, BasePlugin, InteractionPriority } from '@knotx/core';
 import { register, inject, tool, layer, OnInit } from '@knotx/decorators';
 import { TransformWrapper, TransformComponent } from '@knotx/react-zoom-pan-pinch';
 import { isEqual, merge } from 'lodash-es';
@@ -156,8 +156,8 @@ var __privateIn = (member, obj) => Object(obj) !== obj ? __typeError('Cannot use
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _init_dec, _render_dec, _resetTransform_dec, _setTransform_dec, _zoomOut_dec, _zoomIn_dec, _scrollNodeIntoView_dec, _removeListener_dec, _addListener_dec, _interaction_dec, _container_dec, _getNode_dec, _edgeScroll_dec, _updateContentSize_dec, _contentSize_dec, _rootElement_dec, _transform_dec, _a, _init;
-class Canvas extends (_a = BasePlugin, _transform_dec = [register("transform")], _rootElement_dec = [register("rootElement")], _contentSize_dec = [register("contentSize")], _updateContentSize_dec = [register("updateContentSize")], _edgeScroll_dec = [register("edgeScroll")], _getNode_dec = [inject.getNode()], _container_dec = [inject.container()], _interaction_dec = [inject.interaction()], _addListener_dec = [register("addListener")], _removeListener_dec = [register("removeListener")], _scrollNodeIntoView_dec = [tool("Scroll node into view", {
+var _init_dec, _render_dec, _resetTransform_dec, _setTransform_dec, _zoomOut_dec, _zoomIn_dec, _scrollNodeIntoView_dec, _removeListener_dec, _addListener_dec, _registerDataManager_dec, _interaction_dec, _container_dec, _getNode_dec, _edgeScroll_dec, _updateContentSize_dec, _contentSize_dec, _rootElement_dec, _transform_dec, _a, _init;
+class Canvas extends (_a = BasePlugin, _transform_dec = [register("transform")], _rootElement_dec = [register("rootElement")], _contentSize_dec = [register("contentSize")], _updateContentSize_dec = [register("updateContentSize")], _edgeScroll_dec = [register("edgeScroll")], _getNode_dec = [inject.getNode()], _container_dec = [inject.container()], _interaction_dec = [inject.interaction()], _registerDataManager_dec = [inject.history.registerDataManager()], _addListener_dec = [register("addListener")], _removeListener_dec = [register("removeListener")], _scrollNodeIntoView_dec = [tool("Scroll node into view", {
   type: "object",
   properties: {
     nodeId: { type: "string" },
@@ -207,11 +207,20 @@ class Canvas extends (_a = BasePlugin, _transform_dec = [register("transform")],
     __publicField(this, "config");
     __publicField(this, "name", "canvas");
     __publicField(this, "ref", null);
+    __publicField(this, "dataManager", new DataManager(this.name));
     __publicField(this, "transform", __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
     __publicField(this, "rootElement", __runInitializers(_init, 12, this, null)), __runInitializers(_init, 15, this);
     __publicField(this, "contentSize", __runInitializers(_init, 16, this)), __runInitializers(_init, 19, this);
     __publicField(this, "updateContentSize", __runInitializers(_init, 20, this, (contentSize) => {
+      if (isEqual(this.contentSize, contentSize)) {
+        return;
+      }
       this.contentSize = contentSize;
+      this.dataManager.dispatch({
+        id: "contentSize",
+        type: "update",
+        data: { data: contentSize }
+      });
     })), __runInitializers(_init, 23, this);
     __publicField(this, "edgeScroll", __runInitializers(_init, 24, this, {
       config: {
@@ -231,6 +240,7 @@ class Canvas extends (_a = BasePlugin, _transform_dec = [register("transform")],
     __publicField(this, "getNode", __runInitializers(_init, 28, this)), __runInitializers(_init, 31, this);
     __publicField(this, "container", __runInitializers(_init, 32, this)), __runInitializers(_init, 35, this);
     __publicField(this, "interaction", __runInitializers(_init, 36, this)), __runInitializers(_init, 39, this);
+    __publicField(this, "registerDataManager", __runInitializers(_init, 40, this)), __runInitializers(_init, 43, this);
     __publicField(this, "listeners", {
       click: /* @__PURE__ */ new Set(),
       contextmenu: /* @__PURE__ */ new Set(),
@@ -239,12 +249,12 @@ class Canvas extends (_a = BasePlugin, _transform_dec = [register("transform")],
     });
     __publicField(this, "edgeScrollAnimationFrame", null);
     __publicField(this, "mousePosition", null);
-    __publicField(this, "addListener", __runInitializers(_init, 40, this, (type, listener) => {
+    __publicField(this, "addListener", __runInitializers(_init, 44, this, (type, listener) => {
       this.listeners[type].add(listener);
-    })), __runInitializers(_init, 43, this);
-    __publicField(this, "removeListener", __runInitializers(_init, 44, this, (type, listener) => {
-      this.listeners[type].delete(listener);
     })), __runInitializers(_init, 47, this);
+    __publicField(this, "removeListener", __runInitializers(_init, 48, this, (type, listener) => {
+      this.listeners[type].delete(listener);
+    })), __runInitializers(_init, 51, this);
     __publicField(this, "onClick", (e) => {
       if (!this.isCanvasEvent(e)) {
         return;
@@ -487,6 +497,17 @@ class Canvas extends (_a = BasePlugin, _transform_dec = [register("transform")],
       }
       this.rootElement = null;
     });
+    if (this.registerDataManager) {
+      this.subscriptions.push(this.registerDataManager(this.dataManager));
+    }
+    this.dataManager.init([{ id: "contentSize", data: void 0 }]);
+    this.subscriptions.push(
+      this.dataManager.getData$("contentSize").subscribe((contentSize) => {
+        if (contentSize == null ? void 0 : contentSize.data) {
+          this.updateContentSize(contentSize.data);
+        }
+      })
+    );
   }
   groupLayers(children) {
     const fixedLayers = [];
@@ -547,6 +568,7 @@ __decorateElement(_init, 5, "edgeScroll", _edgeScroll_dec, Canvas);
 __decorateElement(_init, 5, "getNode", _getNode_dec, Canvas);
 __decorateElement(_init, 5, "container", _container_dec, Canvas);
 __decorateElement(_init, 5, "interaction", _interaction_dec, Canvas);
+__decorateElement(_init, 5, "registerDataManager", _registerDataManager_dec, Canvas);
 __decorateElement(_init, 5, "addListener", _addListener_dec, Canvas);
 __decorateElement(_init, 5, "removeListener", _removeListener_dec, Canvas);
 __decoratorMetadata(_init, Canvas);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knotx/plugins-canvas",
-  "version": "0.4.10",
+  "version": "0.4.11",
   "description": "Canvas Plugin for Knotx",
   "author": "boenfu",
   "license": "MIT",
@@ -29,23 +29,25 @@
   ],
   "peerDependencies": {
     "react": ">=17.0.0",
-    "@knotx/jsx": "0.4.10"
+    "@knotx/jsx": "0.4.11",
+    "@knotx/plugins-history": "0.4.11"
   },
   "dependencies": {
     "@knotx/react-zoom-pan-pinch": "^3.9.9",
     "lodash-es": "^4.17.21",
     "rxjs": "^7.8.1",
-    "@knotx/core": "0.4.10",
-    "@knotx/decorators": "0.4.10"
+    "@knotx/core": "0.4.11",
+    "@knotx/decorators": "0.4.11"
   },
   "devDependencies": {
     "@types/lodash-es": "^4.17.12",
     "@types/react": "^17.0.0",
     "react": "^17.0.0",
-    "@knotx/build-config": "0.4.10",
-    "@knotx/eslint-config": "0.4.10",
-    "@knotx/jsx": "0.4.10",
-    "@knotx/typescript-config": "0.4.10"
+    "@knotx/build-config": "0.4.11",
+    "@knotx/eslint-config": "0.4.11",
+    "@knotx/jsx": "0.4.11",
+    "@knotx/plugins-history": "0.4.11",
+    "@knotx/typescript-config": "0.4.11"
   },
   "scripts": {
     "build": "unbuild",