@node-projects/web-component-designer 0.1.154 → 0.1.156

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.
@@ -34,8 +34,8 @@ export function placeDesignItem(container, designItem, offset, mode) {
34
34
  if (mode === 'position') {
35
35
  let positionedContainerElement = container.element;
36
36
  let computedStylePositionedContainer = getComputedStyle(container.element);
37
- while (computedStylePositionedContainer.position !== 'relative' && computedStylePositionedContainer.position !== 'absolute') {
38
- positionedContainerElement = positionedContainerElement.parentElement;
37
+ if (computedStylePositionedContainer.position !== 'relative' && computedStylePositionedContainer.position !== 'absolute') {
38
+ positionedContainerElement = positionedContainerElement.offsetParent;
39
39
  computedStylePositionedContainer = getComputedStyle(positionedContainerElement);
40
40
  }
41
41
  let oldLeft = null;
@@ -9,6 +9,7 @@ export declare class EditGridColumnRowSizesExtension extends AbstractExtension {
9
9
  private _initalPos;
10
10
  private _initialSizes;
11
11
  private _group;
12
+ private _hasChanged;
12
13
  constructor(extensionManager: IExtensionManager, designerView: IDesignerCanvas, extendedItem: IDesignItem);
13
14
  extend(cache: Record<string | symbol, any>, event?: Event): void;
14
15
  refresh(cache: Record<string | symbol, any>, event?: Event): void;
@@ -10,6 +10,7 @@ export class EditGridColumnRowSizesExtension extends AbstractExtension {
10
10
  _initalPos;
11
11
  _initialSizes;
12
12
  _group;
13
+ _hasChanged;
13
14
  constructor(extensionManager, designerView, extendedItem) {
14
15
  super(extensionManager, designerView, extendedItem);
15
16
  }
@@ -57,29 +58,35 @@ export class EditGridColumnRowSizesExtension extends AbstractExtension {
57
58
  case EventNames.PointerMove:
58
59
  if (this._initialSizes) {
59
60
  const diff = this._initalPos - pos;
60
- let parts = this._initialSizes.split(' ');
61
- parts[index] = (parseFloat(parts[index]) - diff) + 'px';
62
- parts[index + 1] = (parseFloat(parts[index + 1]) + diff) + 'px';
63
- this.extendedItem.element.style[templatePropertyName] = parts.join(' ');
64
- this.extensionManager.refreshExtensions([this.extendedItem], null, event);
61
+ if (Math.abs(diff) > 5 || this._hasChanged) {
62
+ this._hasChanged = true;
63
+ let parts = this._initialSizes.split(' ');
64
+ parts[index] = (parseFloat(parts[index]) - diff) + 'px';
65
+ parts[index + 1] = (parseFloat(parts[index + 1]) + diff) + 'px';
66
+ this.extendedItem.element.style[templatePropertyName] = parts.join(' ');
67
+ this.extensionManager.refreshExtensions([this.extendedItem], null, event);
68
+ }
65
69
  }
66
70
  break;
67
71
  case EventNames.PointerUp:
68
72
  rect.releasePointerCapture(event.pointerId);
69
73
  const diff = this._initalPos - pos;
70
- const realStyle = this.extendedItem.getStyleFromSheetOrLocalOrComputed(templatePropertyName);
71
- const initialParts = this._initialSizes.split(' ');
72
- const parts = realStyle.split(' ');
73
- let units = parts.map(x => getCssUnit(x));
74
- if (parts.length != initialParts.length) {
75
- units = initialParts.map(x => getCssUnit(x));
74
+ if (this._hasChanged) {
75
+ this._hasChanged = false;
76
+ const realStyle = this.extendedItem.getStyleFromSheetOrLocalOrComputed(templatePropertyName);
77
+ const initialParts = this._initialSizes.split(' ');
78
+ const parts = realStyle.split(' ');
79
+ let units = parts.map(x => getCssUnit(x));
80
+ if (parts.length != initialParts.length) {
81
+ units = initialParts.map(x => getCssUnit(x));
82
+ }
83
+ this.extendedItem.element.style[templatePropertyName] = '';
84
+ const targetPixelSizes = initialParts.map(x => parseFloat(x));
85
+ targetPixelSizes[index] -= diff;
86
+ targetPixelSizes[index + 1] += diff;
87
+ const newSizes = this._convertCssUnits(targetPixelSizes, units, this.extendedItem.element, sizeType);
88
+ this.extendedItem.updateStyleInSheetOrLocal(templatePropertyName, newSizes.join(' '), null, true);
76
89
  }
77
- this.extendedItem.element.style[templatePropertyName] = '';
78
- const targetPixelSizes = initialParts.map(x => parseFloat(x));
79
- targetPixelSizes[index] -= diff;
80
- targetPixelSizes[index + 1] += diff;
81
- const newSizes = this._convertCssUnits(targetPixelSizes, units, this.extendedItem.element, sizeType);
82
- this.extendedItem.updateStyleInSheetOrLocal(templatePropertyName, newSizes.join(' '), null, true);
83
90
  this._initalPos = null;
84
91
  this._initialSizes = null;
85
92
  this.extensionManager.refreshExtensions([this.extendedItem]);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "description": "A WYSIWYG designer webcomponent for html components",
3
3
  "name": "@node-projects/web-component-designer",
4
- "version": "0.1.154",
4
+ "version": "0.1.156",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
7
7
  "author": "jochen.kuehner@gmx.de",