@knotx/plugins-bounding 0.0.7 → 0.0.9

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 +32 -34
  2. package/dist/index.d.cts +5 -6
  3. package/dist/index.d.mts +5 -6
  4. package/dist/index.d.ts +5 -6
  5. package/dist/index.mjs +32 -34
  6. package/package.json +12 -9
package/dist/index.cjs CHANGED
@@ -6,7 +6,6 @@ const decorators = require('@knotx/decorators');
6
6
  const interact = require('interactjs');
7
7
  const rxjs = require('rxjs');
8
8
  const operators = require('rxjs/operators');
9
- require('@knotx/plugins-canvas');
10
9
 
11
10
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
12
11
 
@@ -87,7 +86,7 @@ const DEFAULT_CONNECT_HANDLE_POSITIONS = [
87
86
  { bottom: true },
88
87
  { left: true }
89
88
  ];
90
- const DEFAULT_OPTIONS = {
89
+ const DEFAULT_CONFIG = {
91
90
  features: {
92
91
  resize: true,
93
92
  connect: true,
@@ -127,12 +126,11 @@ const DEFAULT_OPTIONS = {
127
126
  }
128
127
  };
129
128
  class Bounding extends (_a = core.BasePlugin, _nodes_dec = [decorators.inject.nodes()], _getNode_dec = [decorators.inject.getNode()], _dispatchNodeOperation_dec = [decorators.inject.dispatchNodeOperation()], _startInteraction_dec = [decorators.inject.startInteraction()], _endInteraction_dec = [decorators.inject.endInteraction()], _canInteract_dec = [decorators.inject.canInteract()], _canvasScale_dec = [decorators.inject.canvas.transform((state) => state.scale)], _getResizeHandleAttributes_dec = [decorators.register("getCustomResizeHandleAttributes")], _init_dec = [decorators.OnInit], _destroy_dec = [decorators.OnDestroy], _render_dec = [decorators.layer(core.Layer.Nodes, 1)], _a) {
130
- constructor(options = {}) {
131
- var _a2, _b, _c, _d, _e, _f;
132
- super();
133
- this.options = options;
129
+ constructor() {
130
+ super(...arguments);
134
131
  __runInitializers(_init, 5, this);
135
132
  __publicField(this, "name", "bounding");
133
+ __publicField(this, "config");
136
134
  __publicField(this, "nodes", __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
137
135
  __publicField(this, "getNode", __runInitializers(_init, 12, this)), __runInitializers(_init, 15, this);
138
136
  __publicField(this, "dispatchNodeOperation", __runInitializers(_init, 16, this)), __runInitializers(_init, 19, this);
@@ -152,19 +150,19 @@ class Bounding extends (_a = core.BasePlugin, _nodes_dec = [decorators.inject.no
152
150
  "data-resize-handle-position": position
153
151
  };
154
152
  })), __runInitializers(_init, 39, this);
155
- this.options = __spreadProps(__spreadValues(__spreadValues({}, DEFAULT_OPTIONS), options), {
156
- features: __spreadValues(__spreadValues({}, DEFAULT_OPTIONS.features), options.features),
157
- sizes: __spreadValues(__spreadValues({}, DEFAULT_OPTIONS.sizes), options.sizes),
153
+ }
154
+ init(config) {
155
+ var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
156
+ this.config = __spreadProps(__spreadValues(__spreadValues({}, DEFAULT_CONFIG), config), {
157
+ features: __spreadValues(__spreadValues({}, DEFAULT_CONFIG.features), config.features),
158
+ sizes: __spreadValues(__spreadValues({}, DEFAULT_CONFIG.sizes), config.sizes),
158
159
  styles: {
159
- resizeHandle: __spreadValues(__spreadValues({}, (_a2 = DEFAULT_OPTIONS.styles) == null ? void 0 : _a2.resizeHandle), (_b = options.styles) == null ? void 0 : _b.resizeHandle),
160
- connectHandle: __spreadValues(__spreadValues({}, (_c = DEFAULT_OPTIONS.styles) == null ? void 0 : _c.connectHandle), (_d = options.styles) == null ? void 0 : _d.connectHandle),
161
- boundingBox: __spreadValues(__spreadValues({}, (_e = DEFAULT_OPTIONS.styles) == null ? void 0 : _e.boundingBox), (_f = options.styles) == null ? void 0 : _f.boundingBox)
160
+ resizeHandle: __spreadValues(__spreadValues({}, (_a2 = DEFAULT_CONFIG.styles) == null ? void 0 : _a2.resizeHandle), (_b = config.styles) == null ? void 0 : _b.resizeHandle),
161
+ connectHandle: __spreadValues(__spreadValues({}, (_c = DEFAULT_CONFIG.styles) == null ? void 0 : _c.connectHandle), (_d = config.styles) == null ? void 0 : _d.connectHandle),
162
+ boundingBox: __spreadValues(__spreadValues({}, (_e = DEFAULT_CONFIG.styles) == null ? void 0 : _e.boundingBox), (_f = config.styles) == null ? void 0 : _f.boundingBox)
162
163
  },
163
- resize: __spreadValues(__spreadValues({}, DEFAULT_OPTIONS.resize), options.resize)
164
+ resize: __spreadValues(__spreadValues({}, DEFAULT_CONFIG.resize), config.resize)
164
165
  });
165
- }
166
- init() {
167
- var _a2, _b, _c, _d, _e, _f;
168
166
  const resizeStart$ = new rxjs.Subject();
169
167
  const resizeMove$ = new rxjs.Subject();
170
168
  const resizeEnd$ = new rxjs.Subject();
@@ -197,10 +195,10 @@ class Bounding extends (_a = core.BasePlugin, _nodes_dec = [decorators.inject.no
197
195
  dy: event.dy / scale
198
196
  });
199
197
  };
200
- if ((_a2 = this.options.features) == null ? void 0 : _a2.resize) {
198
+ if ((_g = this.config.features) == null ? void 0 : _g.resize) {
201
199
  const currentInteractable = interact__default(`[data-plugin-id="${this.pluginId}"].${this.resizeHandleClassName}`).resizable({
202
200
  edges: { left: true, right: true, bottom: true, top: true },
203
- inertia: (_b = this.options.resize) == null ? void 0 : _b.inertia,
201
+ inertia: (_h = this.config.resize) == null ? void 0 : _h.inertia,
204
202
  cursorChecker: (_action, _interactable, element) => {
205
203
  var _a3;
206
204
  const position = (_a3 = element.getAttribute("data-resize-handle-position")) != null ? _a3 : "";
@@ -237,8 +235,8 @@ class Bounding extends (_a = core.BasePlugin, _nodes_dec = [decorators.inject.no
237
235
  let nextHeight = currentHeight;
238
236
  let nextX = currentX;
239
237
  let nextY = currentY;
240
- const minWidth = (_b2 = (_a3 = this.options.resize) == null ? void 0 : _a3.minWidth) != null ? _b2 : 30;
241
- const minHeight = (_d2 = (_c2 = this.options.resize) == null ? void 0 : _c2.minHeight) != null ? _d2 : 30;
238
+ const minWidth = (_b2 = (_a3 = this.config.resize) == null ? void 0 : _a3.minWidth) != null ? _b2 : 30;
239
+ const minHeight = (_d2 = (_c2 = this.config.resize) == null ? void 0 : _c2.minHeight) != null ? _d2 : 30;
242
240
  if (position.includes("right")) {
243
241
  nextWidth = Math.max(minWidth, currentWidth + moveEvent.dx);
244
242
  }
@@ -307,11 +305,11 @@ class Bounding extends (_a = core.BasePlugin, _nodes_dec = [decorators.inject.no
307
305
  resizeMove$.complete();
308
306
  resizeEnd$.complete();
309
307
  });
310
- if ((_c = this.options.features) == null ? void 0 : _c.boundingBox) {
308
+ if ((_i = this.config.features) == null ? void 0 : _i.boundingBox) {
311
309
  const boundingInteractable = interact__default(`[data-plugin-id="${this.pluginId}"].${this.boundingBoxClassName}`).resizable({
312
- enabled: (_d = this.options.features) == null ? void 0 : _d.resize,
310
+ enabled: (_j = this.config.features) == null ? void 0 : _j.resize,
313
311
  edges: { left: true, right: true, bottom: true, top: true },
314
- inertia: (_e = this.options.resize) == null ? void 0 : _e.inertia,
312
+ inertia: (_k = this.config.resize) == null ? void 0 : _k.inertia,
315
313
  cursorChecker: (action) => this.getCursorStyle(this.getPositionByEdges(action.edges)),
316
314
  listeners: {
317
315
  start: (event) => {
@@ -325,7 +323,7 @@ class Bounding extends (_a = core.BasePlugin, _nodes_dec = [decorators.inject.no
325
323
  end: endResize
326
324
  }
327
325
  });
328
- (_f = this.subscription) == null ? void 0 : _f.add(() => boundingInteractable.unset());
326
+ (_l = this.subscription) == null ? void 0 : _l.add(() => boundingInteractable.unset());
329
327
  }
330
328
  }
331
329
  }
@@ -337,7 +335,7 @@ class Bounding extends (_a = core.BasePlugin, _nodes_dec = [decorators.inject.no
337
335
  var _a2;
338
336
  const nodes = core.use(() => this.nodes);
339
337
  const pluginId = this.pluginId;
340
- const nodesType = (_a2 = this.options.resize) == null ? void 0 : _a2.nodesType;
338
+ const nodesType = (_a2 = this.config.resize) == null ? void 0 : _a2.nodesType;
341
339
  return /* @__PURE__ */ jsxRuntime.jsx(
342
340
  "svg",
343
341
  {
@@ -356,12 +354,12 @@ class Bounding extends (_a = core.BasePlugin, _nodes_dec = [decorators.inject.no
356
354
  if (nodesType && !nodesType.includes(type))
357
355
  return null;
358
356
  const { width, height } = measured;
359
- const resizeSize = (_c = (_a3 = this.options.sizes) == null ? void 0 : _a3.resizeHandle) != null ? _c : (_b = DEFAULT_OPTIONS.sizes) == null ? void 0 : _b.resizeHandle;
360
- const resizeStyles = (_f = (_d = this.options.styles) == null ? void 0 : _d.resizeHandle) != null ? _f : (_e = DEFAULT_OPTIONS.styles) == null ? void 0 : _e.resizeHandle;
361
- const connectSize = (_i = (_g = this.options.sizes) == null ? void 0 : _g.connectHandle) != null ? _i : (_h = DEFAULT_OPTIONS.sizes) == null ? void 0 : _h.connectHandle;
362
- const connectStyles = (_l = (_j = this.options.styles) == null ? void 0 : _j.connectHandle) != null ? _l : (_k = DEFAULT_OPTIONS.styles) == null ? void 0 : _k.connectHandle;
357
+ const resizeSize = (_c = (_a3 = this.config.sizes) == null ? void 0 : _a3.resizeHandle) != null ? _c : (_b = DEFAULT_CONFIG.sizes) == null ? void 0 : _b.resizeHandle;
358
+ const resizeStyles = (_f = (_d = this.config.styles) == null ? void 0 : _d.resizeHandle) != null ? _f : (_e = DEFAULT_CONFIG.styles) == null ? void 0 : _e.resizeHandle;
359
+ const connectSize = (_i = (_g = this.config.sizes) == null ? void 0 : _g.connectHandle) != null ? _i : (_h = DEFAULT_CONFIG.sizes) == null ? void 0 : _h.connectHandle;
360
+ const connectStyles = (_l = (_j = this.config.styles) == null ? void 0 : _j.connectHandle) != null ? _l : (_k = DEFAULT_CONFIG.styles) == null ? void 0 : _k.connectHandle;
363
361
  return /* @__PURE__ */ jsxRuntime.jsxs("g", { style: { pointerEvents: "auto" }, children: [
364
- ((_m = this.options.features) == null ? void 0 : _m.boundingBox) && /* @__PURE__ */ jsxRuntime.jsx(
362
+ ((_m = this.config.features) == null ? void 0 : _m.boundingBox) && /* @__PURE__ */ jsxRuntime.jsx(
365
363
  "rect",
366
364
  {
367
365
  className: this.boundingBoxClassName,
@@ -372,12 +370,12 @@ class Bounding extends (_a = core.BasePlugin, _nodes_dec = [decorators.inject.no
372
370
  width,
373
371
  height,
374
372
  fill: "none",
375
- stroke: (_o = (_n = this.options.styles) == null ? void 0 : _n.boundingBox) == null ? void 0 : _o.stroke,
376
- strokeWidth: (_q = (_p = this.options.styles) == null ? void 0 : _p.boundingBox) == null ? void 0 : _q.strokeWidth,
373
+ stroke: (_o = (_n = this.config.styles) == null ? void 0 : _n.boundingBox) == null ? void 0 : _o.stroke,
374
+ strokeWidth: (_q = (_p = this.config.styles) == null ? void 0 : _p.boundingBox) == null ? void 0 : _q.strokeWidth,
377
375
  style: { pointerEvents: "auto" }
378
376
  }
379
377
  ),
380
- ((_r = this.options.features) == null ? void 0 : _r.resize) && ((_t = (_s = this.options.resize) == null ? void 0 : _s.handles) == null ? void 0 : _t.map((position, index) => {
378
+ ((_r = this.config.features) == null ? void 0 : _r.resize) && ((_t = (_s = this.config.resize) == null ? void 0 : _s.handles) == null ? void 0 : _t.map((position, index) => {
381
379
  let handleX = x;
382
380
  let handleY = y;
383
381
  const [xPosition, yPosition] = position.split("-");
@@ -414,7 +412,7 @@ class Bounding extends (_a = core.BasePlugin, _nodes_dec = [decorators.inject.no
414
412
  })
415
413
  ) }, `resize-${index}`);
416
414
  })),
417
- ((_u = this.options.features) == null ? void 0 : _u.connect) && DEFAULT_CONNECT_HANDLE_POSITIONS.map((position, index) => {
415
+ ((_u = this.config.features) == null ? void 0 : _u.connect) && DEFAULT_CONNECT_HANDLE_POSITIONS.map((position, index) => {
418
416
  let handleX = x + width / 2;
419
417
  let handleY = y + height / 2;
420
418
  if (position.right)
package/dist/index.d.cts CHANGED
@@ -33,7 +33,7 @@ interface ConnectHandlePosition {
33
33
  left?: boolean;
34
34
  }
35
35
  type ResizeHandlePosition = `${HorizontalAlignment}-${VerticalAlignment}` | HorizontalAlignment | VerticalAlignment;
36
- interface BoundingOptions {
36
+ interface BoundingConfig {
37
37
  features?: {
38
38
  resize?: boolean;
39
39
  connect?: boolean;
@@ -77,9 +77,9 @@ interface BoundingOptions {
77
77
  nodesType?: string[];
78
78
  };
79
79
  }
80
- declare class Bounding extends BasePlugin<'bounding'> {
81
- private options;
80
+ declare class Bounding extends BasePlugin<'bounding', BoundingConfig> {
82
81
  name: "bounding";
82
+ private config;
83
83
  nodes: NodeData[];
84
84
  getNode: (id: string) => NodeData | undefined;
85
85
  dispatchNodeOperation: (operation: NodeOperation) => void;
@@ -92,12 +92,11 @@ declare class Bounding extends BasePlugin<'bounding'> {
92
92
  private connectHandleClassName;
93
93
  private boundingBoxClassName;
94
94
  private getResizeHandleAttributes;
95
- constructor(options?: BoundingOptions);
96
- init(): void;
95
+ init(config: BoundingConfig): void;
97
96
  destroy(): void;
98
97
  render(): JSX.Element;
99
98
  private getCursorStyle;
100
99
  private getPositionByEdges;
101
100
  }
102
101
 
103
- export { Bounding, type BoundingOptions, type ConnectHandlePosition, type ResizeData, type ResizeEvent, type ResizeHandlePosition };
102
+ export { Bounding, type BoundingConfig, type ConnectHandlePosition, type ResizeData, type ResizeEvent, type ResizeHandlePosition };
package/dist/index.d.mts CHANGED
@@ -33,7 +33,7 @@ interface ConnectHandlePosition {
33
33
  left?: boolean;
34
34
  }
35
35
  type ResizeHandlePosition = `${HorizontalAlignment}-${VerticalAlignment}` | HorizontalAlignment | VerticalAlignment;
36
- interface BoundingOptions {
36
+ interface BoundingConfig {
37
37
  features?: {
38
38
  resize?: boolean;
39
39
  connect?: boolean;
@@ -77,9 +77,9 @@ interface BoundingOptions {
77
77
  nodesType?: string[];
78
78
  };
79
79
  }
80
- declare class Bounding extends BasePlugin<'bounding'> {
81
- private options;
80
+ declare class Bounding extends BasePlugin<'bounding', BoundingConfig> {
82
81
  name: "bounding";
82
+ private config;
83
83
  nodes: NodeData[];
84
84
  getNode: (id: string) => NodeData | undefined;
85
85
  dispatchNodeOperation: (operation: NodeOperation) => void;
@@ -92,12 +92,11 @@ declare class Bounding extends BasePlugin<'bounding'> {
92
92
  private connectHandleClassName;
93
93
  private boundingBoxClassName;
94
94
  private getResizeHandleAttributes;
95
- constructor(options?: BoundingOptions);
96
- init(): void;
95
+ init(config: BoundingConfig): void;
97
96
  destroy(): void;
98
97
  render(): JSX.Element;
99
98
  private getCursorStyle;
100
99
  private getPositionByEdges;
101
100
  }
102
101
 
103
- export { Bounding, type BoundingOptions, type ConnectHandlePosition, type ResizeData, type ResizeEvent, type ResizeHandlePosition };
102
+ export { Bounding, type BoundingConfig, type ConnectHandlePosition, type ResizeData, type ResizeEvent, type ResizeHandlePosition };
package/dist/index.d.ts CHANGED
@@ -33,7 +33,7 @@ interface ConnectHandlePosition {
33
33
  left?: boolean;
34
34
  }
35
35
  type ResizeHandlePosition = `${HorizontalAlignment}-${VerticalAlignment}` | HorizontalAlignment | VerticalAlignment;
36
- interface BoundingOptions {
36
+ interface BoundingConfig {
37
37
  features?: {
38
38
  resize?: boolean;
39
39
  connect?: boolean;
@@ -77,9 +77,9 @@ interface BoundingOptions {
77
77
  nodesType?: string[];
78
78
  };
79
79
  }
80
- declare class Bounding extends BasePlugin<'bounding'> {
81
- private options;
80
+ declare class Bounding extends BasePlugin<'bounding', BoundingConfig> {
82
81
  name: "bounding";
82
+ private config;
83
83
  nodes: NodeData[];
84
84
  getNode: (id: string) => NodeData | undefined;
85
85
  dispatchNodeOperation: (operation: NodeOperation) => void;
@@ -92,12 +92,11 @@ declare class Bounding extends BasePlugin<'bounding'> {
92
92
  private connectHandleClassName;
93
93
  private boundingBoxClassName;
94
94
  private getResizeHandleAttributes;
95
- constructor(options?: BoundingOptions);
96
- init(): void;
95
+ init(config: BoundingConfig): void;
97
96
  destroy(): void;
98
97
  render(): JSX.Element;
99
98
  private getCursorStyle;
100
99
  private getPositionByEdges;
101
100
  }
102
101
 
103
- export { Bounding, type BoundingOptions, type ConnectHandlePosition, type ResizeData, type ResizeEvent, type ResizeHandlePosition };
102
+ export { Bounding, type BoundingConfig, type ConnectHandlePosition, type ResizeData, type ResizeEvent, type ResizeHandlePosition };
package/dist/index.mjs CHANGED
@@ -4,7 +4,6 @@ import { inject, register, layer, OnInit, OnDestroy } from '@knotx/decorators';
4
4
  import interact from 'interactjs';
5
5
  import { Subject } from 'rxjs';
6
6
  import { switchMap, map, tap, takeUntil } from 'rxjs/operators';
7
- import '@knotx/plugins-canvas';
8
7
 
9
8
  var __create = Object.create;
10
9
  var __defProp = Object.defineProperty;
@@ -81,7 +80,7 @@ const DEFAULT_CONNECT_HANDLE_POSITIONS = [
81
80
  { bottom: true },
82
81
  { left: true }
83
82
  ];
84
- const DEFAULT_OPTIONS = {
83
+ const DEFAULT_CONFIG = {
85
84
  features: {
86
85
  resize: true,
87
86
  connect: true,
@@ -121,12 +120,11 @@ const DEFAULT_OPTIONS = {
121
120
  }
122
121
  };
123
122
  class Bounding extends (_a = BasePlugin, _nodes_dec = [inject.nodes()], _getNode_dec = [inject.getNode()], _dispatchNodeOperation_dec = [inject.dispatchNodeOperation()], _startInteraction_dec = [inject.startInteraction()], _endInteraction_dec = [inject.endInteraction()], _canInteract_dec = [inject.canInteract()], _canvasScale_dec = [inject.canvas.transform((state) => state.scale)], _getResizeHandleAttributes_dec = [register("getCustomResizeHandleAttributes")], _init_dec = [OnInit], _destroy_dec = [OnDestroy], _render_dec = [layer(Layer.Nodes, 1)], _a) {
124
- constructor(options = {}) {
125
- var _a2, _b, _c, _d, _e, _f;
126
- super();
127
- this.options = options;
123
+ constructor() {
124
+ super(...arguments);
128
125
  __runInitializers(_init, 5, this);
129
126
  __publicField(this, "name", "bounding");
127
+ __publicField(this, "config");
130
128
  __publicField(this, "nodes", __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
131
129
  __publicField(this, "getNode", __runInitializers(_init, 12, this)), __runInitializers(_init, 15, this);
132
130
  __publicField(this, "dispatchNodeOperation", __runInitializers(_init, 16, this)), __runInitializers(_init, 19, this);
@@ -146,19 +144,19 @@ class Bounding extends (_a = BasePlugin, _nodes_dec = [inject.nodes()], _getNode
146
144
  "data-resize-handle-position": position
147
145
  };
148
146
  })), __runInitializers(_init, 39, this);
149
- this.options = __spreadProps(__spreadValues(__spreadValues({}, DEFAULT_OPTIONS), options), {
150
- features: __spreadValues(__spreadValues({}, DEFAULT_OPTIONS.features), options.features),
151
- sizes: __spreadValues(__spreadValues({}, DEFAULT_OPTIONS.sizes), options.sizes),
147
+ }
148
+ init(config) {
149
+ var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
150
+ this.config = __spreadProps(__spreadValues(__spreadValues({}, DEFAULT_CONFIG), config), {
151
+ features: __spreadValues(__spreadValues({}, DEFAULT_CONFIG.features), config.features),
152
+ sizes: __spreadValues(__spreadValues({}, DEFAULT_CONFIG.sizes), config.sizes),
152
153
  styles: {
153
- resizeHandle: __spreadValues(__spreadValues({}, (_a2 = DEFAULT_OPTIONS.styles) == null ? void 0 : _a2.resizeHandle), (_b = options.styles) == null ? void 0 : _b.resizeHandle),
154
- connectHandle: __spreadValues(__spreadValues({}, (_c = DEFAULT_OPTIONS.styles) == null ? void 0 : _c.connectHandle), (_d = options.styles) == null ? void 0 : _d.connectHandle),
155
- boundingBox: __spreadValues(__spreadValues({}, (_e = DEFAULT_OPTIONS.styles) == null ? void 0 : _e.boundingBox), (_f = options.styles) == null ? void 0 : _f.boundingBox)
154
+ resizeHandle: __spreadValues(__spreadValues({}, (_a2 = DEFAULT_CONFIG.styles) == null ? void 0 : _a2.resizeHandle), (_b = config.styles) == null ? void 0 : _b.resizeHandle),
155
+ connectHandle: __spreadValues(__spreadValues({}, (_c = DEFAULT_CONFIG.styles) == null ? void 0 : _c.connectHandle), (_d = config.styles) == null ? void 0 : _d.connectHandle),
156
+ boundingBox: __spreadValues(__spreadValues({}, (_e = DEFAULT_CONFIG.styles) == null ? void 0 : _e.boundingBox), (_f = config.styles) == null ? void 0 : _f.boundingBox)
156
157
  },
157
- resize: __spreadValues(__spreadValues({}, DEFAULT_OPTIONS.resize), options.resize)
158
+ resize: __spreadValues(__spreadValues({}, DEFAULT_CONFIG.resize), config.resize)
158
159
  });
159
- }
160
- init() {
161
- var _a2, _b, _c, _d, _e, _f;
162
160
  const resizeStart$ = new Subject();
163
161
  const resizeMove$ = new Subject();
164
162
  const resizeEnd$ = new Subject();
@@ -191,10 +189,10 @@ class Bounding extends (_a = BasePlugin, _nodes_dec = [inject.nodes()], _getNode
191
189
  dy: event.dy / scale
192
190
  });
193
191
  };
194
- if ((_a2 = this.options.features) == null ? void 0 : _a2.resize) {
192
+ if ((_g = this.config.features) == null ? void 0 : _g.resize) {
195
193
  const currentInteractable = interact(`[data-plugin-id="${this.pluginId}"].${this.resizeHandleClassName}`).resizable({
196
194
  edges: { left: true, right: true, bottom: true, top: true },
197
- inertia: (_b = this.options.resize) == null ? void 0 : _b.inertia,
195
+ inertia: (_h = this.config.resize) == null ? void 0 : _h.inertia,
198
196
  cursorChecker: (_action, _interactable, element) => {
199
197
  var _a3;
200
198
  const position = (_a3 = element.getAttribute("data-resize-handle-position")) != null ? _a3 : "";
@@ -231,8 +229,8 @@ class Bounding extends (_a = BasePlugin, _nodes_dec = [inject.nodes()], _getNode
231
229
  let nextHeight = currentHeight;
232
230
  let nextX = currentX;
233
231
  let nextY = currentY;
234
- const minWidth = (_b2 = (_a3 = this.options.resize) == null ? void 0 : _a3.minWidth) != null ? _b2 : 30;
235
- const minHeight = (_d2 = (_c2 = this.options.resize) == null ? void 0 : _c2.minHeight) != null ? _d2 : 30;
232
+ const minWidth = (_b2 = (_a3 = this.config.resize) == null ? void 0 : _a3.minWidth) != null ? _b2 : 30;
233
+ const minHeight = (_d2 = (_c2 = this.config.resize) == null ? void 0 : _c2.minHeight) != null ? _d2 : 30;
236
234
  if (position.includes("right")) {
237
235
  nextWidth = Math.max(minWidth, currentWidth + moveEvent.dx);
238
236
  }
@@ -301,11 +299,11 @@ class Bounding extends (_a = BasePlugin, _nodes_dec = [inject.nodes()], _getNode
301
299
  resizeMove$.complete();
302
300
  resizeEnd$.complete();
303
301
  });
304
- if ((_c = this.options.features) == null ? void 0 : _c.boundingBox) {
302
+ if ((_i = this.config.features) == null ? void 0 : _i.boundingBox) {
305
303
  const boundingInteractable = interact(`[data-plugin-id="${this.pluginId}"].${this.boundingBoxClassName}`).resizable({
306
- enabled: (_d = this.options.features) == null ? void 0 : _d.resize,
304
+ enabled: (_j = this.config.features) == null ? void 0 : _j.resize,
307
305
  edges: { left: true, right: true, bottom: true, top: true },
308
- inertia: (_e = this.options.resize) == null ? void 0 : _e.inertia,
306
+ inertia: (_k = this.config.resize) == null ? void 0 : _k.inertia,
309
307
  cursorChecker: (action) => this.getCursorStyle(this.getPositionByEdges(action.edges)),
310
308
  listeners: {
311
309
  start: (event) => {
@@ -319,7 +317,7 @@ class Bounding extends (_a = BasePlugin, _nodes_dec = [inject.nodes()], _getNode
319
317
  end: endResize
320
318
  }
321
319
  });
322
- (_f = this.subscription) == null ? void 0 : _f.add(() => boundingInteractable.unset());
320
+ (_l = this.subscription) == null ? void 0 : _l.add(() => boundingInteractable.unset());
323
321
  }
324
322
  }
325
323
  }
@@ -331,7 +329,7 @@ class Bounding extends (_a = BasePlugin, _nodes_dec = [inject.nodes()], _getNode
331
329
  var _a2;
332
330
  const nodes = use(() => this.nodes);
333
331
  const pluginId = this.pluginId;
334
- const nodesType = (_a2 = this.options.resize) == null ? void 0 : _a2.nodesType;
332
+ const nodesType = (_a2 = this.config.resize) == null ? void 0 : _a2.nodesType;
335
333
  return /* @__PURE__ */ jsx(
336
334
  "svg",
337
335
  {
@@ -350,12 +348,12 @@ class Bounding extends (_a = BasePlugin, _nodes_dec = [inject.nodes()], _getNode
350
348
  if (nodesType && !nodesType.includes(type))
351
349
  return null;
352
350
  const { width, height } = measured;
353
- const resizeSize = (_c = (_a3 = this.options.sizes) == null ? void 0 : _a3.resizeHandle) != null ? _c : (_b = DEFAULT_OPTIONS.sizes) == null ? void 0 : _b.resizeHandle;
354
- const resizeStyles = (_f = (_d = this.options.styles) == null ? void 0 : _d.resizeHandle) != null ? _f : (_e = DEFAULT_OPTIONS.styles) == null ? void 0 : _e.resizeHandle;
355
- const connectSize = (_i = (_g = this.options.sizes) == null ? void 0 : _g.connectHandle) != null ? _i : (_h = DEFAULT_OPTIONS.sizes) == null ? void 0 : _h.connectHandle;
356
- const connectStyles = (_l = (_j = this.options.styles) == null ? void 0 : _j.connectHandle) != null ? _l : (_k = DEFAULT_OPTIONS.styles) == null ? void 0 : _k.connectHandle;
351
+ const resizeSize = (_c = (_a3 = this.config.sizes) == null ? void 0 : _a3.resizeHandle) != null ? _c : (_b = DEFAULT_CONFIG.sizes) == null ? void 0 : _b.resizeHandle;
352
+ const resizeStyles = (_f = (_d = this.config.styles) == null ? void 0 : _d.resizeHandle) != null ? _f : (_e = DEFAULT_CONFIG.styles) == null ? void 0 : _e.resizeHandle;
353
+ const connectSize = (_i = (_g = this.config.sizes) == null ? void 0 : _g.connectHandle) != null ? _i : (_h = DEFAULT_CONFIG.sizes) == null ? void 0 : _h.connectHandle;
354
+ const connectStyles = (_l = (_j = this.config.styles) == null ? void 0 : _j.connectHandle) != null ? _l : (_k = DEFAULT_CONFIG.styles) == null ? void 0 : _k.connectHandle;
357
355
  return /* @__PURE__ */ jsxs("g", { style: { pointerEvents: "auto" }, children: [
358
- ((_m = this.options.features) == null ? void 0 : _m.boundingBox) && /* @__PURE__ */ jsx(
356
+ ((_m = this.config.features) == null ? void 0 : _m.boundingBox) && /* @__PURE__ */ jsx(
359
357
  "rect",
360
358
  {
361
359
  className: this.boundingBoxClassName,
@@ -366,12 +364,12 @@ class Bounding extends (_a = BasePlugin, _nodes_dec = [inject.nodes()], _getNode
366
364
  width,
367
365
  height,
368
366
  fill: "none",
369
- stroke: (_o = (_n = this.options.styles) == null ? void 0 : _n.boundingBox) == null ? void 0 : _o.stroke,
370
- strokeWidth: (_q = (_p = this.options.styles) == null ? void 0 : _p.boundingBox) == null ? void 0 : _q.strokeWidth,
367
+ stroke: (_o = (_n = this.config.styles) == null ? void 0 : _n.boundingBox) == null ? void 0 : _o.stroke,
368
+ strokeWidth: (_q = (_p = this.config.styles) == null ? void 0 : _p.boundingBox) == null ? void 0 : _q.strokeWidth,
371
369
  style: { pointerEvents: "auto" }
372
370
  }
373
371
  ),
374
- ((_r = this.options.features) == null ? void 0 : _r.resize) && ((_t = (_s = this.options.resize) == null ? void 0 : _s.handles) == null ? void 0 : _t.map((position, index) => {
372
+ ((_r = this.config.features) == null ? void 0 : _r.resize) && ((_t = (_s = this.config.resize) == null ? void 0 : _s.handles) == null ? void 0 : _t.map((position, index) => {
375
373
  let handleX = x;
376
374
  let handleY = y;
377
375
  const [xPosition, yPosition] = position.split("-");
@@ -408,7 +406,7 @@ class Bounding extends (_a = BasePlugin, _nodes_dec = [inject.nodes()], _getNode
408
406
  })
409
407
  ) }, `resize-${index}`);
410
408
  })),
411
- ((_u = this.options.features) == null ? void 0 : _u.connect) && DEFAULT_CONNECT_HANDLE_POSITIONS.map((position, index) => {
409
+ ((_u = this.config.features) == null ? void 0 : _u.connect) && DEFAULT_CONNECT_HANDLE_POSITIONS.map((position, index) => {
412
410
  let handleX = x + width / 2;
413
411
  let handleY = y + height / 2;
414
412
  if (position.right)
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@knotx/plugins-bounding",
3
3
  "type": "module",
4
- "version": "0.0.7",
4
+ "version": "0.0.9",
5
5
  "description": "Bounding Plugin for Knotx",
6
6
  "author": "boenfu",
7
7
  "license": "MIT",
@@ -28,6 +28,9 @@
28
28
  "files": [
29
29
  "dist"
30
30
  ],
31
+ "peerDependencies": {
32
+ "@knotx/plugins-canvas": "0.0.7"
33
+ },
31
34
  "dependencies": {
32
35
  "@interactjs/actions": "^1.10.27",
33
36
  "@interactjs/core": "^1.10.27",
@@ -35,16 +38,16 @@
35
38
  "@interactjs/types": "^1.10.27",
36
39
  "interactjs": "^1.10.27",
37
40
  "rxjs": "^7.8.1",
38
- "@knotx/core": "0.0.5",
39
- "@knotx/decorators": "0.0.5",
40
- "@knotx/plugins-canvas": "0.0.5",
41
- "@knotx/render": "0.0.7"
41
+ "@knotx/core": "0.0.7",
42
+ "@knotx/decorators": "0.0.7",
43
+ "@knotx/render": "0.0.9"
42
44
  },
43
45
  "devDependencies": {
44
- "@knotx/build-config": "0.0.5",
45
- "@knotx/eslint-config": "0.0.5",
46
- "@knotx/jsx": "0.0.5",
47
- "@knotx/typescript-config": "0.0.5"
46
+ "@knotx/build-config": "0.0.7",
47
+ "@knotx/eslint-config": "0.0.7",
48
+ "@knotx/jsx": "0.0.7",
49
+ "@knotx/plugins-canvas": "0.0.7",
50
+ "@knotx/typescript-config": "0.0.7"
48
51
  },
49
52
  "scripts": {
50
53
  "build": "unbuild --failOnWarn=false",