@node-projects/web-component-designer 0.1.29 → 0.1.31

package/dist/elements/helper/ElementHelper.js

@@ -1,3 +1,4 @@
+import { NodeType } from '../item/NodeType.js';
 export function inDesigner(element) {
     let node = element.getRootNode();
     if (node?.host?.localName == "node-projects-designer-canvas")
@@ -136,6 +137,8 @@ export function calculateOuterRect(designItems, designerCanvas) {
     let max = { x: Number.MIN_VALUE, y: Number.MIN_VALUE };
     let elementRect;
     for (let s of designItems) {
+        if (s.nodeType == NodeType.TextNode || s.nodeType == NodeType.Comment)
+            continue;
         elementRect = {
             x: designerCanvas.getNormalizedElementCoordinates(s.element).x,
             y: designerCanvas.getNormalizedElementCoordinates(s.element).y,

package/dist/elements/services/propertiesService/services/CssProperties.json

@@ -661,7 +661,26 @@
     "system": {},
     "tabSize": {},
     "tableLayout": {},
-    "textAlign": {},
+    "textAlign": {
+        "type": "list",
+        "values": [
+            "start",
+            "end",
+            "left",
+            "right",
+            "center",
+            "justify",
+            "justify-all",
+            "match-parent",
+            "\".\"",
+            "\".\" center",
+            "inherit",
+            "initial",
+            "revert",
+            "revert-layer",
+            "unset"
+        ]
+    },
     "textAlignLast": {},
     "textAnchor": {},
     "textCombineUpright": {},

package/dist/elements/services/refactorService/BindingsRefactorService.d.ts

@@ -1,6 +1,7 @@
 import { IDesignItem } from "../../item/IDesignItem.js";
+import { IRefactorService } from "./IRefactorService.js";
 import { IRefactoring } from "./IRefactoring.js";
-export declare class BindingsRefactorService {
+export declare class BindingsRefactorService implements IRefactorService {
     getRefactorings(designItems: IDesignItem[]): IRefactoring[];
     refactor(refactoring: IRefactoring, oldValue: string, newValue: string): void;
 }

package/dist/elements/services/refactorService/TextRefactorService.d.ts

@@ -1,6 +1,7 @@
 import { IDesignItem } from "../../item/IDesignItem.js";
+import { IRefactorService } from "./IRefactorService.js";
 import { IRefactoring } from "./IRefactoring.js";
-export declare class TextRefactorService {
+export declare class TextRefactorService implements IRefactorService {
     getRefactorings(designItems: IDesignItem[]): IRefactoring[];
     refactor(refactoring: IRefactoring, oldValue: string, newValue: string): void;
 }

package/dist/elements/widgets/designerView/designerCanvas.js

@@ -486,7 +486,16 @@ export class DesignerCanvas extends BaseCustomWebComponentLazyAppend {
     }
     /* --- end IUiCommandHandler --- */
     handleSelectAll() {
-        this.instanceServiceContainer.selectionService.setSelectedElements(Array.from(this.rootDesignItem.children()));
+        const selection = Array.from(this.rootDesignItem.children());
+        const primary = this.instanceServiceContainer.selectionService.primarySelection;
+        if (primary) {
+            const idx = selection.indexOf(primary);
+            if (idx >= 0) {
+                selection.splice(idx, 1);
+                selection.unshift(primary);
+            }
+        }
+        this.instanceServiceContainer.selectionService.setSelectedElements(selection);
     }
     async handleCopyCommand() {
         this._currentPasteOffset = this.pasteOffset;

package/dist/elements/widgets/refactorView/refactor-view.d.ts

@@ -10,11 +10,15 @@ export declare class RefactorView extends BaseCustomWebComponentConstructorAppen
     private _instanceServiceContainer;
     private _selectionChangedHandler;
     private _selectedItems;
+    searchText: string;
+    replaceText: string;
     refactorings: Map<string, IRefactoring[]>;
     ready(): void;
     set instanceServiceContainer(value: InstanceServiceContainer);
     get selectedItems(): IDesignItem[];
     set selectedItems(items: IDesignItem[]);
+    replace(): void;
     _refactor(refactoring: [string, IRefactoring[]], event: KeyboardEvent): void;
+    applyRefactoring(refactoring: [string, IRefactoring[]], newValue: string): void;
     updateRefactorlist(designItems: IDesignItem[]): void;
 }

package/dist/elements/widgets/refactorView/refactor-view.js

@@ -2,6 +2,14 @@ import { BaseCustomWebComponentConstructorAppend, css, html } from '@node-projec
 export class RefactorView extends BaseCustomWebComponentConstructorAppend {
     static template = html `
     <div id="root">
+      <div class="search">
+        <span>search</span>
+        <input style="flex-grow: 1; min-width: 0" value="{{this.searchText}}">
+        <span>replace</span>
+        <input style="flex-grow: 1; min-width: 0"value="{{this.replaceText}}">
+        <button @click="[[this.replace()]]" style="grid-column: 2;">replace</button>
+      </div>
+      <hr>
       <template repeat:item="[[this.refactorings]]">
         <details open>
           <summary>
@@ -25,6 +33,16 @@ export class RefactorView extends BaseCustomWebComponentConstructorAppend {
         overflow: hidden;
     }
 
+    .search {
+      display: grid;
+      grid-template-columns: 40px 1fr;
+      align-items: center;
+    }
+
+    span {
+      font-size: 10px;
+    }
+
     summary {
       cursor: pointer;
       font-size: 10px;
@@ -51,6 +69,8 @@ export class RefactorView extends BaseCustomWebComponentConstructorAppend {
     _instanceServiceContainer;
     _selectionChangedHandler;
     _selectedItems;
+    searchText = "(.*)";
+    replaceText = "$1";
     refactorings = new Map();
     ;
     ready() {
@@ -73,13 +93,36 @@ export class RefactorView extends BaseCustomWebComponentConstructorAppend {
             this.updateRefactorlist(this._selectedItems);
         }
     }
+    replace() {
+        let grp = null;
+        for (let r of this.refactorings) {
+            let n = r[1][0].name;
+            const regex = new RegExp(this.searchText);
+            const found = n.match(regex);
+            if (found) {
+                if (!grp)
+                    grp = r[1][0].designItem.openGroup('refactor with regex ' + this.searchText + " -> " + this.replaceText);
+                const newText = n.replace(regex, this.replaceText);
+                if (newText != n) {
+                    this.applyRefactoring(r, newText);
+                }
+            }
+        }
+        if (!grp)
+            grp.commit();
+    }
     _refactor(refactoring, event) {
         const ip = event.target;
         if (event.key == 'Enter') {
-            for (let r of refactoring[1]) {
-                r.service.refactor(r, r.name, ip.value);
-            }
+            this.applyRefactoring(refactoring, ip.value);
+        }
+    }
+    applyRefactoring(refactoring, newValue) {
+        const grp = refactoring[1][0].designItem.openGroup('refactor ' + refactoring[1][0].name + ' to ' + newValue);
+        for (let r of refactoring[1]) {
+            r.service.refactor(r, r.name, newValue);
         }
+        grp.commit();
     }
     updateRefactorlist(designItems) {
         this.refactorings.clear();

package/package.json

@@ -1,7 +1,7 @@
 {
   "description": "A UI designer for Polymer apps",
   "name": "@node-projects/web-component-designer",
-  "version": "0.1.29",
+  "version": "0.1.31",
   "type": "module",
   "main": "./dist/index.js",
   "author": "jochen.kuehner@gmx.de",