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

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

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

package/dist/elements/services/refactorService/BindingsRefactorService copy.js

@@ -0,0 +1,21 @@
+export class BindingsRefactorService {
+    getRefactorings(designItems) {
+        let refactorings = [];
+        for (let d of designItems) {
+            let bindings = d.serviceContainer.bindingService.getBindings(d);
+            if (bindings) {
+                for (let b of bindings) {
+                    for (let s of b.bindableObjectNames) {
+                        refactorings.push({ service: this, name: s, itemType: 'bindableObject', designItem: d, type: 'binding', sourceObject: b, display: b.target + '/' + b.targetName });
+                    }
+                }
+            }
+        }
+        return refactorings;
+    }
+    refactor(refactoring, oldValue, newValue) {
+        let binding = refactoring.sourceObject;
+        binding.bindableObjectNames = binding.bindableObjectNames.map(x => x == oldValue ? newValue : x);
+        refactoring.designItem.serviceContainer.bindingService.setBinding(refactoring.designItem, binding);
+    }
+}

package/dist/elements/services/refactorService/BindingsRefactorService.js

@@ -6,7 +6,7 @@ export class BindingsRefactorService {
             if (bindings) {
                 for (let b of bindings) {
                     for (let s of b.bindableObjectNames) {
-                        refactorings.push({ service: this, name: s, designItem: d, type: 'binding', sourceObject: b, display: b.target + '(' + b.targetName + ')' });
+                        refactorings.push({ service: this, name: s, itemType: 'bindableObject', designItem: d, type: 'binding', sourceObject: b, display: b.target + '/' + b.targetName });
                     }
                 }
             }

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

@@ -4,8 +4,9 @@ import { IRefactorService } from "./IRefactorService.js";
 export interface IRefactoring {
     service: IRefactorService;
     name: string;
+    itemType: string;
     designItem: IDesignItem;
-    type: 'binding' | 'script';
+    type: 'binding' | 'script' | 'content' | 'attribute';
     display?: string;
     sourceObject: any;
     target?: BindingTarget;

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

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

package/dist/elements/services/refactorService/TextRefactorService.js

@@ -0,0 +1,29 @@
+export class TextRefactorService {
+    getRefactorings(designItems) {
+        let refactorings = [];
+        for (let d of designItems) {
+            if (d.element instanceof HTMLInputElement || d.element instanceof HTMLTextAreaElement) {
+                if (d.element.value)
+                    refactorings.push({ service: this, name: d.element.value, itemType: 'text', designItem: d, type: 'attribute', sourceObject: d, display: 'attribute' + '/' + 'value' });
+            }
+            if (d.childCount > 0 && d.element.textContent) {
+                let onlyTextNodes = true;
+                for (const n of d.element.childNodes)
+                    if (n.nodeType != 3) {
+                        onlyTextNodes = false;
+                    }
+                if (onlyTextNodes)
+                    refactorings.push({ service: this, name: d.element.textContent, itemType: 'text', designItem: d, type: 'content', sourceObject: d, display: 'textContent' });
+            }
+        }
+        return refactorings;
+    }
+    refactor(refactoring, oldValue, newValue) {
+        if (refactoring.type == 'attribute') {
+            refactoring.designItem.setAttribute('value', newValue);
+        }
+        else if (refactoring.type == 'content') {
+            refactoring.designItem.content = newValue;
+        }
+    }
+}

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

@@ -3,13 +3,13 @@ export class RefactorView extends BaseCustomWebComponentConstructorAppend {
     static template = html `
     <div id="root">
       <template repeat:item="[[this.refactorings]]">
-        <details>
-          <summary style="display: flex;">
-              name:<input value="[[item[0]]]" @keydown="[[this._refactor(item, event)]]" style="flex-grow: 1; min-width: 0">
+        <details open>
+          <summary>
+              name:<input value="[[item[1][0].name]]" @keydown="[[this._refactor(item, event)]]" style="flex-grow: 1; min-width: 0">
           </summary>
           <ul>
             <template repeat:reft="[[item[1]]]">
-              <li>[[reft.type]] - [[reft.display]]</li>
+              <li>[[reft.type]]/[[reft.display]]</li>
             </template>
           </ul>
         </details>
@@ -24,10 +24,17 @@ export class RefactorView extends BaseCustomWebComponentConstructorAppend {
         position: absolute;
         overflow: hidden;
     }
+
+    summary {
+      cursor: pointer;
+      font-size: 10px;
+      display: flex;
+      align-items: center;
+    }
     
     ul {
       margin: 4px;
-      padding-left: 30px;
+      padding-left: 20px;
       font-size: 10px;
     }
     
@@ -84,11 +91,12 @@ export class RefactorView extends BaseCustomWebComponentConstructorAppend {
                 refactorings.push(...rfs);
             }
             //Group refactorings by name
+            //TODO: group also by itemType, cause different item types (for example screen and signal name) could have the same string
             for (const r of refactorings) {
-                let thisList = this.refactorings.get(r.name);
+                let thisList = this.refactorings.get(r.itemType + '|' + r.name);
                 if (thisList === undefined) {
                     thisList = [];
-                    this.refactorings.set(r.name, thisList);
+                    this.refactorings.set(r.itemType + '|' + r.name, thisList);
                 }
                 thisList.push(r);
             }

package/dist/index.d.ts

@@ -121,6 +121,7 @@ export * from "./elements/services/propertiesService/services/UnkownElementsProp
 export * from "./elements/services/propertiesService/PropertyType.js";
 export * from "./elements/services/propertiesService/ValueType.js";
 export * from "./elements/services/refactorService/BindingsRefactorService.js";
+export * from "./elements/services/refactorService/TextRefactorService.js";
 export type { IRefactorService } from "./elements/services/refactorService/IRefactorService.js";
 export type { IRefactoring } from "./elements/services/refactorService/IRefactoring.js";
 export type { ISelectionChangedEvent } from "./elements/services/selectionService/ISelectionChangedEvent.js";

package/dist/index.js

@@ -81,6 +81,7 @@ export * from "./elements/services/propertiesService/services/UnkownElementsProp
 export * from "./elements/services/propertiesService/PropertyType.js";
 export * from "./elements/services/propertiesService/ValueType.js";
 export * from "./elements/services/refactorService/BindingsRefactorService.js";
+export * from "./elements/services/refactorService/TextRefactorService.js";
 export * from "./elements/services/selectionService/SelectionService.js";
 export * from "./elements/services/stylesheetService/AbstractStylesheetService.js";
 export * from "./elements/services/undoService/ChangeGroup.js";

package/package.json

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