@omegagrid/core - npm Package Compare versions

Comparing version 0.4.12 to 0.4.13

dist/common/dom.d.ts

@@ -79,3 +79,4 @@ import { Options } from 'ts-debounce';
 export declare function zoomElement(elm: HTMLElement, zoom: number): void;
+export declare function measureText(text: string, font: string): TextMetrics;
 export {};
 //# sourceMappingURL=dom.d.ts.map

dist/common/dom.js

@@ -6,3 +6,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.zoomElement = exports.fixPosition = exports.setBorderWidth = exports.setCenterPosition = exports.setPadding = exports.setMargin = exports.setZIndex = exports.fixElementSize = exports.fixElementPosition = exports.setPosition = exports.setMinSize = exports.setMaxSize = exports.setSize = exports.numToPixels = exports.appendStyle = exports.getElementOffset = exports.setClasses = exports.debounceOn = exports.on = exports.remove = exports.empty = exports.hideCell = exports.showCell = exports.isHidden = exports.hideElement = exports.showElement = exports.appendElement = exports.createElement = exports.register = exports.createName = void 0;
+exports.measureText = exports.zoomElement = exports.fixPosition = exports.setBorderWidth = exports.setCenterPosition = exports.setPadding = exports.setMargin = exports.setZIndex = exports.fixElementSize = exports.fixElementPosition = exports.setPosition = exports.setMinSize = exports.setMaxSize = exports.setSize = exports.numToPixels = exports.appendStyle = exports.getElementOffset = exports.setClasses = exports.debounceOn = exports.on = exports.remove = exports.empty = exports.hideCell = exports.showCell = exports.isHidden = exports.hideElement = exports.showElement = exports.appendElement = exports.createElement = exports.register = exports.createName = void 0;
 const constants_1 = __importDefault(require("../constants"));
@@ -254,2 +254,19 @@ const ts_debounce_1 = require("ts-debounce");
 exports.zoomElement = zoomElement;
+let textMeasureContextMap;
+function measureText(text, font) {
+    if (!textMeasureContextMap)
+        textMeasureContextMap = new Map();
+    let textMeasureContext = textMeasureContextMap.get(font);
+    if (!textMeasureContext) {
+        const canvas = document.createElement('canvas');
+        textMeasureContext = canvas.getContext('2d');
+        textMeasureContext.font = font;
+        textMeasureContextMap.set(font, textMeasureContext);
+    }
+    return textMeasureContext.measureText(text);
+}
+exports.measureText = measureText;
+// export function measureElementContent(elm: HTMLElement, container?: HTMLElement) {
+// 	container = container ?? 
+// }
 //# sourceMappingURL=dom.js.map

dist/ui/sizer.d.ts

@@ -32,2 +32,7 @@ import { LitElement } from 'lit';
     private startY;
+    private offset;
+    private startWidth;
+    private startHeight;
+    private startResize;
+    private mouseDownTime;
     static styles: import("lit").CSSResult;
@@ -40,3 +45,7 @@ orientation: Orientation;
     hide: () => void;
+    _onMouseLeave: () => void;
+    _onMouseDown: (e: MouseEvent) => void;
     private startResizing;
+    _onMouseMove: (e: MouseEvent) => void;
+    _onMouseUp: (e: MouseEvent) => void;
     render(): void;
@@ -43,0 +52,0 @@ snap(elm: HTMLElement, offsetElement?: HTMLElement): void;

dist/ui/sizer.js

@@ -63,2 +63,4 @@ "use strict";
         this.startY = 0;
+        this.startResize = false;
+        this.mouseDownTime = 0;
         this.noGuideLine = false;
@@ -74,20 +76,64 @@ this.show = () => {
         };
-        this.addEventListener('mouseleave', () => {
+        this._onMouseLeave = () => {
             if (!this._resizing)
                 this.hide();
-        });
-        this.addEventListener('mousedown', (e) => {
-            this.dispatchEvent(new ResizeEvent('resizestart', {
-                deltaX: 0,
-                deltaY: 0,
+        };
+        this._onMouseDown = (e) => {
+            e.stopPropagation();
+            const lastTime = this.mouseDownTime;
+            this.mouseDownTime = performance.now();
+            if (this.mouseDownTime - lastTime < 500) {
+                this.dispatchEvent(new Event('dblclick'));
+                return;
+            }
+            this.startX = e.pageX;
+            this.startY = e.pageY;
+            this._resizing = true;
+            this.startResize = true;
+            this.offset = dom.getElementOffset(this.snappedTo, this.offsetElement);
+            this.startWidth = this.snappedTo.clientWidth;
+            this.startHeight = this.snappedTo.clientHeight;
+            document.addEventListener('mousemove', this._onMouseMove);
+            document.addEventListener('mouseup', this._onMouseUp, { once: true });
+        };
+        this._onMouseMove = (e) => {
+            if (this.startResize)
+                this.startResizing();
+            dom.setPosition(this, this.orientation == 'horizontal' ? {
+                l: this.offset.left + this.startWidth - constants_1.default.SIZER_SIZE / 2 + e.pageX - this.startX
+            } : {
+                t: this.offset.top + this.startHeight - constants_1.default.SIZER_SIZE / 2 + e.pageY - this.startY
+            });
+            this.dispatchEvent(new ResizeEvent('resize', {
+                deltaX: e.pageX - this.startX,
+                deltaY: e.pageY - this.startY,
                 mouseX: e.pageX,
                 mouseY: e.pageY,
             }));
-            this.startX = e.pageX;
-            this.startY = e.pageY;
-            this.startResizing();
-        });
+        };
+        this._onMouseUp = (e) => {
+            document.removeEventListener('mousemove', this._onMouseMove);
+            this._resizing = false;
+            if (this.startResize) {
+                this.startResize = false;
+                return;
+            }
+            this.hide();
+            this.dispatchEvent(new ResizeEvent('resizestop', {
+                deltaX: e.pageX - this.startX,
+                deltaY: e.pageY - this.startY,
+                mouseX: e.pageX,
+                mouseY: e.pageY,
+            }));
+        };
+        this.addEventListener('mouseleave', this._onMouseLeave);
+        this.addEventListener('mousedown', this._onMouseDown);
     }
     startResizing() {
-        this._resizing = true;
+        this.dispatchEvent(new ResizeEvent('resizestart', {
+            deltaX: 0,
+            deltaY: 0,
+            mouseX: this.startX,
+            mouseY: this.startY,
+        }));
         if (!this.noGuideLine) {
@@ -110,30 +156,3 @@ dom.showElement(this.lineElm);
         }
-        const offset = dom.getElementOffset(this.snappedTo, this.offsetElement);
-        const startWidth = this.snappedTo.clientWidth;
-        const startHeight = this.snappedTo.clientHeight;
-        const onMouseMove = (e) => {
-            dom.setPosition(this, this.orientation == 'horizontal' ? {
-                l: offset.left + startWidth - constants_1.default.SIZER_SIZE / 2 + e.pageX - this.startX
-            } : {
-                t: offset.top + startHeight - constants_1.default.SIZER_SIZE / 2 + e.pageY - this.startY
-            });
-            this.dispatchEvent(new ResizeEvent('resize', {
-                deltaX: e.pageX - this.startX,
-                deltaY: e.pageY - this.startY,
-                mouseX: e.pageX,
-                mouseY: e.pageY,
-            }));
-        };
-        document.addEventListener('mousemove', onMouseMove);
-        document.addEventListener('mouseup', e => {
-            document.removeEventListener('mousemove', onMouseMove);
-            this._resizing = false;
-            this.hide();
-            this.dispatchEvent(new ResizeEvent('resizestop', {
-                deltaX: e.pageX - this.startX,
-                deltaY: e.pageY - this.startY,
-                mouseX: e.pageX,
-                mouseY: e.pageY,
-            }));
-        }, { once: true });
+        this.startResize = false;
     }
@@ -140,0 +159,0 @@ render() {

package.json

 {
   "name": "@omegagrid/core",
-  "version": "0.4.12",
+  "version": "0.4.13",
   "license": "UNLICENSED",
@@ -39,3 +39,3 @@ "description": "Core components",
     "@fortawesome/fontawesome-svg-core": "6.4.2",
-    "@omegagrid/localize": "^0.4.12",
+    "@omegagrid/localize": "^0.4.13",
     "@riovir/wc-fontawesome": "^0.1.9",
@@ -42,0 +42,0 @@ "color": "^4.2.3",

No alert changes

Improved metrics

Total package byte prevSize

517369

increased by0.64%

Lines of code

7537

increased by0.61%

Dependency changes

• Updated@omegagrid/localize@^0.4.13