@node-projects/web-component-designer 0.0.280 → 0.0.281

package/dist/elements/helper/TransformHelper.d.ts

@@ -2,7 +2,6 @@ import { IPoint } from "../../interfaces/IPoint.js";
 import { IDesignerCanvas } from "../widgets/designerView/IDesignerCanvas.js";
 export declare function getElementCombinedTransform(element: HTMLElement): DOMMatrix;
 export declare function combineTransforms(element: HTMLElement, actualTransforms: string, requestedTransformation: string): void;
-export declare function getDomMatrix(element: HTMLElement): DOMMatrix;
 export declare function transformPointByInverseMatrix(point: DOMPoint, matrix: DOMMatrix): DOMPoint;
 export declare function getRotationMatrix3d(axisOfRotation: 'x' | 'y' | 'z' | 'X' | 'Y' | 'Z', angle: number): any[];
 export declare function rotateElementByMatrix3d(element: HTMLElement, matrix: number[]): void;

package/dist/elements/helper/TransformHelper.js

@@ -33,9 +33,6 @@ export function combineTransforms(element, actualTransforms, requestedTransforma
     const newTransformationMatrix = requestedTransformationMatrix.multiply(actualTransformationMatrix);
     element.style.transform = newTransformationMatrix.toString();
 }
-export function getDomMatrix(element) {
-    return new DOMMatrix(window.getComputedStyle(element).transform);
-}
 export function transformPointByInverseMatrix(point, matrix) {
     const inverse = matrix.inverse();
     //fix chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1395645

package/dist/elements/widgets/bindableObjectsBrowser/bindable-objects-browser.d.ts

@@ -1,10 +1,14 @@
-import { BaseCustomWebComponentLazyAppend } from '@node-projects/base-custom-webcomponent';
+import { BaseCustomWebComponentLazyAppend, TypedEvent } from '@node-projects/base-custom-webcomponent';
+import { IBindableObject } from '../../services/bindableObjectsService/IBindableObject.js';
 import { ServiceContainer } from '../../services/ServiceContainer.js';
 export declare class BindableObjectsBrowser extends BaseCustomWebComponentLazyAppend {
     private _treeDiv;
     private _tree;
+    selectedObject: IBindableObject<any>;
+    objectDoubleclicked: TypedEvent<void>;
     static readonly style: CSSStyleSheet;
     constructor();
     initialize(serviceContainer: ServiceContainer): Promise<void>;
+    private deselectNodes;
     private lazyLoad;
 }

package/dist/elements/widgets/bindableObjectsBrowser/bindable-objects-browser.js

@@ -1,8 +1,10 @@
-import { BaseCustomWebComponentLazyAppend, css } from '@node-projects/base-custom-webcomponent';
+import { BaseCustomWebComponentLazyAppend, TypedEvent, css } from '@node-projects/base-custom-webcomponent';
 import { dragDropFormatNameBindingObject } from '../../../Constants.js';
 export class BindableObjectsBrowser extends BaseCustomWebComponentLazyAppend {
     _treeDiv;
     _tree;
+    selectedObject;
+    objectDoubleclicked = new TypedEvent;
     static style = css `
       span.drag-source {
         border: 1px solid grey;
@@ -45,10 +47,31 @@ export class BindableObjectsBrowser extends BaseCustomWebComponentLazyAppend {
         $(this._treeDiv).fancytree({
             debugLevel: 0,
             icon: false,
-            extensions: ['dnd5'],
+            extensions: ['dnd5', 'filter'],
             quicksearch: true,
             source: [],
             lazyLoad: this.lazyLoad,
+            dblclick: (e) => {
+                this.objectDoubleclicked.emit();
+                return true;
+            },
+            activate: (event, data) => {
+                this.deselectNodes();
+                let node = data.node;
+                this.selectedObject = node.data.bindable;
+            },
+            filter: {
+                autoApply: true,
+                autoExpand: false,
+                counter: true,
+                fuzzy: false,
+                hideExpandedCounter: true,
+                hideExpanders: false,
+                highlight: true,
+                leavesOnly: false,
+                nodata: true,
+                mode: "dimm" // Grayout unmatched nodes (pass "hide" to remove unmatched node instead)
+            },
             dnd5: {
                 dropMarkerParent: this.shadowRoot,
                 preventRecursion: true,
@@ -85,6 +108,13 @@ export class BindableObjectsBrowser extends BaseCustomWebComponentLazyAppend {
             rootNode.addNode(newNode);
         }
     }
+    deselectNodes() {
+        let nodes = this._tree.getSelectedNodes();
+        nodes.forEach(node => {
+            node.setSelected(false);
+            node.setActive(false);
+        });
+    }
     lazyLoad(event, data) {
         data.result = new Promise(async (resolve) => {
             const service = data.node.data.service;

package/dist/elements/widgets/designerView/extensions/ResizeExtension.js

@@ -1,6 +1,6 @@
 import { EventNames } from '../../../../enums/EventNames.js';
 import { getContentBoxContentOffsets } from '../../../helper/ElementHelper.js';
-import { transformPointByInverseMatrix, getDomMatrix, getDesignerCanvasNormalizedTransformedCornerDOMPoints, normalizeToAbsolutePosition } from "../../../helper/TransformHelper.js";
+import { transformPointByInverseMatrix, getDesignerCanvasNormalizedTransformedCornerDOMPoints, normalizeToAbsolutePosition, getElementCombinedTransform } from "../../../helper/TransformHelper.js";
 import { AbstractExtension } from './AbstractExtension.js';
 export class ResizeExtension extends AbstractExtension {
     resizeAllSelected;
@@ -161,7 +161,7 @@ export class ResizeExtension extends AbstractExtension {
                     const diff = containerService.placePoint(event, this.designerCanvas, this.extendedItem.parent, this._initialPoint, { x: 0, y: 0 }, currentPoint, this.designerCanvas.instanceServiceContainer.selectionService.selectedElements);
                     let trackX = Math.round(diff.x - this._initialPoint.x - this._offsetPoint.x);
                     let trackY = Math.round(diff.y - this._initialPoint.y - this._offsetPoint.y);
-                    let matrix = getDomMatrix(this.extendedItem.element);
+                    let matrix = getElementCombinedTransform(this.extendedItem.element);
                     let transformedTrack = transformPointByInverseMatrix(new DOMPoint(trackX, trackY, 0, 0), matrix);
                     let deltaX = transformedTrack.x;
                     let deltaY = transformedTrack.y;

package/package.json

@@ -1,7 +1,7 @@
 {
   "description": "A UI designer for Polymer apps",
   "name": "@node-projects/web-component-designer",
-  "version": "0.0.280",
+  "version": "0.0.281",
   "type": "module",
   "main": "./dist/index.js",
   "author": "",