@knotx/plugins-canvas 0.2.12 → 0.2.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/index.cjs +16 -3
  2. package/dist/index.d.cts +23 -0
  3. package/dist/index.d.mts +23 -0
  4. package/dist/index.d.ts +23 -0
  5. package/dist/index.js +16 -3
  6. package/package.json +8 -8
package/dist/index.cjs CHANGED
@@ -75,7 +75,7 @@ var __privateIn = (member, obj) => Object(obj) !== obj ? __typeError('Cannot use
75
75
  var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
76
76
  var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
77
77
  var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
78
- var _init_dec, _render_dec, _zoomOut_dec, _zoomIn_dec, _scrollNodeIntoView_dec, _removeListener_dec, _addListener_dec, _container_dec, _getNode_dec, _transform_dec, _ref_dec, _a, _init;
78
+ var _init_dec, _render_dec, _setTransform_dec, _zoomOut_dec, _zoomIn_dec, _scrollNodeIntoView_dec, _removeListener_dec, _addListener_dec, _container_dec, _getNode_dec, _transform_dec, _ref_dec, _a, _init;
79
79
  class Canvas extends (_a = core.BasePlugin, _ref_dec = [decorators.register("ref")], _transform_dec = [decorators.register("transform")], _getNode_dec = [decorators.inject.getNode()], _container_dec = [decorators.inject.container()], _addListener_dec = [decorators.register("addListener")], _removeListener_dec = [decorators.register("removeListener")], _scrollNodeIntoView_dec = [decorators.tool("Scroll node into viewport center", {
80
80
  type: "object",
81
81
  properties: {
@@ -106,6 +106,14 @@ class Canvas extends (_a = core.BasePlugin, _ref_dec = [decorators.register("ref
106
106
  step: { type: "number" },
107
107
  animationTime: { type: "number" }
108
108
  }
109
+ })], _setTransform_dec = [decorators.tool("Set transform", {
110
+ type: "object",
111
+ properties: {
112
+ positionX: { type: "number" },
113
+ positionY: { type: "number" },
114
+ scale: { type: "number" },
115
+ animationTime: { type: "number" }
116
+ }
109
117
  })], _render_dec = [decorators.layer(core.Layer.Canvas)], _init_dec = [decorators.OnInit], _a) {
110
118
  constructor() {
111
119
  super(...arguments);
@@ -199,6 +207,10 @@ class Canvas extends (_a = core.BasePlugin, _ref_dec = [decorators.register("ref
199
207
  var _a2;
200
208
  (_a2 = this.ref) == null ? void 0 : _a2.zoomOut(step, animationTime);
201
209
  }
210
+ setTransform({ positionX, positionY, scale, animationTime }) {
211
+ var _a2;
212
+ (_a2 = this.ref) == null ? void 0 : _a2.setTransform(positionX != null ? positionX : this.transform.positionX, positionY != null ? positionY : this.transform.positionY, scale != null ? scale : this.transform.scale, animationTime);
213
+ }
202
214
  render({ children } = { children: null }) {
203
215
  const [transform, setTransform] = react.useState(null);
204
216
  const [fixedLayers, childrenLayers] = react.useMemo(() => {
@@ -240,8 +252,8 @@ class Canvas extends (_a = core.BasePlugin, _ref_dec = [decorators.register("ref
240
252
  });
241
253
  let frame;
242
254
  return transform == null ? void 0 : transform.instance.onChange((ref) => {
243
- cancelIdleCallback(frame);
244
- frame = requestIdleCallback(() => {
255
+ cancelAnimationFrame(frame);
256
+ frame = requestAnimationFrame(() => {
245
257
  this.transform = __spreadValues({}, ref.state);
246
258
  });
247
259
  });
@@ -320,6 +332,7 @@ _init = __decoratorStart(_a);
320
332
  __decorateElement(_init, 1, "scrollNodeIntoView", _scrollNodeIntoView_dec, Canvas);
321
333
  __decorateElement(_init, 1, "zoomIn", _zoomIn_dec, Canvas);
322
334
  __decorateElement(_init, 1, "zoomOut", _zoomOut_dec, Canvas);
335
+ __decorateElement(_init, 1, "setTransform", _setTransform_dec, Canvas);
323
336
  __decorateElement(_init, 1, "render", _render_dec, Canvas);
324
337
  __decorateElement(_init, 1, "init", _init_dec, Canvas);
325
338
  __decorateElement(_init, 5, "ref", _ref_dec, Canvas);
package/dist/index.d.cts CHANGED
@@ -36,6 +36,12 @@ declare module '@knotx/core' {
36
36
  step?: number;
37
37
  animationTime?: number;
38
38
  }) => void;
39
+ setTransform: (params: {
40
+ positionX: number;
41
+ positionY: number;
42
+ scale: number;
43
+ animationTime?: number;
44
+ }) => void;
39
45
  };
40
46
  }
41
47
  }
@@ -107,6 +113,23 @@ declare class Canvas extends BasePlugin<'canvas', CanvasConfig> {
107
113
  };
108
114
  };
109
115
  }>): void;
116
+ setTransform({ positionX, positionY, scale, animationTime }: InferParamsFromSchema<{
117
+ type: 'object';
118
+ properties: {
119
+ positionX: {
120
+ type: 'number';
121
+ };
122
+ positionY: {
123
+ type: 'number';
124
+ };
125
+ scale: {
126
+ type: 'number';
127
+ };
128
+ animationTime: {
129
+ type: 'number';
130
+ };
131
+ };
132
+ }>): void;
110
133
  render({ children }?: {
111
134
  children: ReactNode;
112
135
  }): JSX.Element;
package/dist/index.d.mts CHANGED
@@ -36,6 +36,12 @@ declare module '@knotx/core' {
36
36
  step?: number;
37
37
  animationTime?: number;
38
38
  }) => void;
39
+ setTransform: (params: {
40
+ positionX: number;
41
+ positionY: number;
42
+ scale: number;
43
+ animationTime?: number;
44
+ }) => void;
39
45
  };
40
46
  }
41
47
  }
@@ -107,6 +113,23 @@ declare class Canvas extends BasePlugin<'canvas', CanvasConfig> {
107
113
  };
108
114
  };
109
115
  }>): void;
116
+ setTransform({ positionX, positionY, scale, animationTime }: InferParamsFromSchema<{
117
+ type: 'object';
118
+ properties: {
119
+ positionX: {
120
+ type: 'number';
121
+ };
122
+ positionY: {
123
+ type: 'number';
124
+ };
125
+ scale: {
126
+ type: 'number';
127
+ };
128
+ animationTime: {
129
+ type: 'number';
130
+ };
131
+ };
132
+ }>): void;
110
133
  render({ children }?: {
111
134
  children: ReactNode;
112
135
  }): JSX.Element;
package/dist/index.d.ts CHANGED
@@ -36,6 +36,12 @@ declare module '@knotx/core' {
36
36
  step?: number;
37
37
  animationTime?: number;
38
38
  }) => void;
39
+ setTransform: (params: {
40
+ positionX: number;
41
+ positionY: number;
42
+ scale: number;
43
+ animationTime?: number;
44
+ }) => void;
39
45
  };
40
46
  }
41
47
  }
@@ -107,6 +113,23 @@ declare class Canvas extends BasePlugin<'canvas', CanvasConfig> {
107
113
  };
108
114
  };
109
115
  }>): void;
116
+ setTransform({ positionX, positionY, scale, animationTime }: InferParamsFromSchema<{
117
+ type: 'object';
118
+ properties: {
119
+ positionX: {
120
+ type: 'number';
121
+ };
122
+ positionY: {
123
+ type: 'number';
124
+ };
125
+ scale: {
126
+ type: 'number';
127
+ };
128
+ animationTime: {
129
+ type: 'number';
130
+ };
131
+ };
132
+ }>): void;
110
133
  render({ children }?: {
111
134
  children: ReactNode;
112
135
  }): JSX.Element;
package/dist/index.js CHANGED
@@ -73,7 +73,7 @@ var __privateIn = (member, obj) => Object(obj) !== obj ? __typeError('Cannot use
73
73
  var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
74
74
  var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
75
75
  var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
76
- var _init_dec, _render_dec, _zoomOut_dec, _zoomIn_dec, _scrollNodeIntoView_dec, _removeListener_dec, _addListener_dec, _container_dec, _getNode_dec, _transform_dec, _ref_dec, _a, _init;
76
+ var _init_dec, _render_dec, _setTransform_dec, _zoomOut_dec, _zoomIn_dec, _scrollNodeIntoView_dec, _removeListener_dec, _addListener_dec, _container_dec, _getNode_dec, _transform_dec, _ref_dec, _a, _init;
77
77
  class Canvas extends (_a = BasePlugin, _ref_dec = [register("ref")], _transform_dec = [register("transform")], _getNode_dec = [inject.getNode()], _container_dec = [inject.container()], _addListener_dec = [register("addListener")], _removeListener_dec = [register("removeListener")], _scrollNodeIntoView_dec = [tool("Scroll node into viewport center", {
78
78
  type: "object",
79
79
  properties: {
@@ -104,6 +104,14 @@ class Canvas extends (_a = BasePlugin, _ref_dec = [register("ref")], _transform_
104
104
  step: { type: "number" },
105
105
  animationTime: { type: "number" }
106
106
  }
107
+ })], _setTransform_dec = [tool("Set transform", {
108
+ type: "object",
109
+ properties: {
110
+ positionX: { type: "number" },
111
+ positionY: { type: "number" },
112
+ scale: { type: "number" },
113
+ animationTime: { type: "number" }
114
+ }
107
115
  })], _render_dec = [layer(Layer.Canvas)], _init_dec = [OnInit], _a) {
108
116
  constructor() {
109
117
  super(...arguments);
@@ -197,6 +205,10 @@ class Canvas extends (_a = BasePlugin, _ref_dec = [register("ref")], _transform_
197
205
  var _a2;
198
206
  (_a2 = this.ref) == null ? void 0 : _a2.zoomOut(step, animationTime);
199
207
  }
208
+ setTransform({ positionX, positionY, scale, animationTime }) {
209
+ var _a2;
210
+ (_a2 = this.ref) == null ? void 0 : _a2.setTransform(positionX != null ? positionX : this.transform.positionX, positionY != null ? positionY : this.transform.positionY, scale != null ? scale : this.transform.scale, animationTime);
211
+ }
200
212
  render({ children } = { children: null }) {
201
213
  const [transform, setTransform] = useState(null);
202
214
  const [fixedLayers, childrenLayers] = useMemo(() => {
@@ -238,8 +250,8 @@ class Canvas extends (_a = BasePlugin, _ref_dec = [register("ref")], _transform_
238
250
  });
239
251
  let frame;
240
252
  return transform == null ? void 0 : transform.instance.onChange((ref) => {
241
- cancelIdleCallback(frame);
242
- frame = requestIdleCallback(() => {
253
+ cancelAnimationFrame(frame);
254
+ frame = requestAnimationFrame(() => {
243
255
  this.transform = __spreadValues({}, ref.state);
244
256
  });
245
257
  });
@@ -318,6 +330,7 @@ _init = __decoratorStart(_a);
318
330
  __decorateElement(_init, 1, "scrollNodeIntoView", _scrollNodeIntoView_dec, Canvas);
319
331
  __decorateElement(_init, 1, "zoomIn", _zoomIn_dec, Canvas);
320
332
  __decorateElement(_init, 1, "zoomOut", _zoomOut_dec, Canvas);
333
+ __decorateElement(_init, 1, "setTransform", _setTransform_dec, Canvas);
321
334
  __decorateElement(_init, 1, "render", _render_dec, Canvas);
322
335
  __decorateElement(_init, 1, "init", _init_dec, Canvas);
323
336
  __decorateElement(_init, 5, "ref", _ref_dec, Canvas);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@knotx/plugins-canvas",
3
- "version": "0.2.12",
3
+ "version": "0.2.14",
4
4
  "description": "Canvas Plugin for Knotx",
5
5
  "author": "boenfu",
6
6
  "license": "MIT",
@@ -29,23 +29,23 @@
29
29
  ],
30
30
  "peerDependencies": {
31
31
  "react": ">=17.0.0",
32
- "@knotx/jsx": "0.2.11"
32
+ "@knotx/jsx": "0.2.12"
33
33
  },
34
34
  "dependencies": {
35
35
  "lodash-es": "^4.17.21",
36
36
  "react-zoom-pan-pinch": "^3.7.0",
37
37
  "rxjs": "^7.8.1",
38
- "@knotx/core": "0.2.11",
39
- "@knotx/decorators": "0.2.12"
38
+ "@knotx/core": "0.2.13",
39
+ "@knotx/decorators": "0.2.14"
40
40
  },
41
41
  "devDependencies": {
42
42
  "@types/lodash-es": "^4.17.12",
43
43
  "@types/react": "^17.0.0",
44
44
  "react": "^17.0.0",
45
- "@knotx/build-config": "0.2.11",
46
- "@knotx/eslint-config": "0.2.11",
47
- "@knotx/jsx": "0.2.11",
48
- "@knotx/typescript-config": "0.2.11"
45
+ "@knotx/build-config": "0.2.12",
46
+ "@knotx/eslint-config": "0.2.12",
47
+ "@knotx/jsx": "0.2.12",
48
+ "@knotx/typescript-config": "0.2.12"
49
49
  },
50
50
  "scripts": {
51
51
  "build": "unbuild",