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

package/dist/commandHandling/CommandType.d.ts

@@ -9,6 +9,8 @@ export declare enum CommandType {
     'holdRedo' = "holdRedo",
     'rotateCounterClockwise' = "rotateCounterClockwise",
     'rotateClockwise' = "rotateClockwise",
+    'mirrorHorizontal' = "mirrorHorizontal",
+    'mirrorVertical' = "mirrorVertical",
     'selectAll' = "selectAll",
     'moveToFront' = "moveToFront",
     'moveForward' = "moveForward",

package/dist/commandHandling/CommandType.js

@@ -10,6 +10,8 @@ export var CommandType;
     CommandType["holdRedo"] = "holdRedo";
     CommandType["rotateCounterClockwise"] = "rotateCounterClockwise";
     CommandType["rotateClockwise"] = "rotateClockwise";
+    CommandType["mirrorHorizontal"] = "mirrorHorizontal";
+    CommandType["mirrorVertical"] = "mirrorVertical";
     CommandType["selectAll"] = "selectAll";
     CommandType["moveToFront"] = "moveToFront";
     CommandType["moveForward"] = "moveForward";

package/dist/elements/services/modelCommandService/DefaultModelCommandService.js

@@ -17,6 +17,11 @@ export class DefaultModelCommandService {
             command.type == CommandType.unifyHeight ||
             command.type == CommandType.unifyWidth)
             return designerCanvas.instanceServiceContainer.selectionService.selectedElements.length > 1;
+        if (command.type == CommandType.rotateCounterClockwise ||
+            command.type == CommandType.rotateClockwise ||
+            command.type == CommandType.mirrorHorizontal ||
+            command.type == CommandType.mirrorVertical)
+            return designerCanvas.instanceServiceContainer.selectionService.selectedElements.length > 0;
         return null;
     }
     async executeCommand(designerCanvas, command) {
@@ -120,9 +125,24 @@ export class DefaultModelCommandService {
             }
             grp.commit();
         }
+        else if (command.type == CommandType.mirrorHorizontal) {
+            const grp = designerCanvas.instanceServiceContainer.selectionService.primarySelection.openGroup('mirrorHorizontal');
+            for (let s of designerCanvas.instanceServiceContainer.selectionService.selectedElements) {
+                s.setStyle('transform', 'scaleX(-1)');
+            }
+            grp.commit();
+        }
+        else if (command.type == CommandType.mirrorVertical) {
+            const grp = designerCanvas.instanceServiceContainer.selectionService.primarySelection.openGroup('mirrorHorizontal');
+            for (let s of designerCanvas.instanceServiceContainer.selectionService.selectedElements) {
+                s.setStyle('transform', 'scaleY(-1)');
+            }
+            grp.commit();
+        }
         else
             return null;
         designerCanvas.instanceServiceContainer.selectionService.setSelectedElements(selection);
         return true;
     }
 }
+//TODO: combine transforms, could be easy, add new transform, get the matrix and convert back to simple ones (if possible)

package/dist/elements/services/propertiesService/services/WebcomponentManifestPropertiesService.d.ts

@@ -15,4 +15,5 @@ export declare class WebcomponentManifestPropertiesService extends AbstractPrope
     getProperties(designItem: IDesignItem): IProperty[];
     getProperty(designItem: IDesignItem, name: string): IProperty;
     getPropertyTarget(designItem: IDesignItem, property: IProperty): BindingTarget;
+    getUnsetValue(designItems: IDesignItem[], property: IProperty): any;
 }

package/dist/elements/services/propertiesService/services/WebcomponentManifestPropertiesService.js

@@ -74,4 +74,7 @@ export class WebcomponentManifestPropertiesService extends AbstractPropertiesSer
     getPropertyTarget(designItem, property) {
         return this._propertiesList[designItem.name].find(x => x.name == property.name).propertyType == PropertyType.attribute ? BindingTarget.attribute : BindingTarget.property;
     }
+    getUnsetValue(designItems, property) {
+        return designItems[0].element[property.propertyName ?? property.name];
+    }
 }

package/dist/elements/widgets/codeView/code-view-monaco.js

@@ -186,9 +186,11 @@ export class CodeViewMonaco extends BaseCustomWebComponentLazyAppend {
             let model = this._monacoEditor.getModel();
             let point1 = model.getPositionAt(position.start);
             let point2 = model.getPositionAt(position.start + position.length);
-            this._monacoEditor.setSelection({ startLineNumber: point1.lineNumber, startColumn: point1.column, endLineNumber: point2.lineNumber, endColumn: point2.column });
-            //@ts-ignore
-            this._monacoEditor.revealRangeInCenterIfOutsideViewport(new monaco.Range(point1.lineNumber, point1.column, point2.lineNumber, point2.column), 1);
+            setTimeout(() => {
+                this._monacoEditor.setSelection({ startLineNumber: point1.lineNumber, startColumn: point1.column, endLineNumber: point2.lineNumber, endColumn: point2.column });
+                //@ts-ignore
+                this._monacoEditor.revealRangeInCenterIfOutsideViewport(new monaco.Range(point1.lineNumber, point1.column, point2.lineNumber, point2.column), 1);
+            }, 50);
         }
     }
 }

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

@@ -44,6 +44,8 @@ export class DesignerView extends BaseCustomWebComponentConstructorAppend {
       display: flex;
       bottom: 0;
       position: absolute;
+      font-size: 12px;
+      width: 100%;
     }
     input {
       width: 40px;

package/dist/elements/widgets/propertyGrid/PropertyGridPropertyList.js

@@ -77,6 +77,9 @@ export class PropertyGridPropertyList extends BaseCustomWebComponentLazyAppend {
     .unset-value {
       color: lightslategray
     }
+    .unset-value > * {
+      color: lightslategray
+    }
     .unset-value:focus {
       color: white
     }

package/package.json

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

package/_build/1_UpdatePackages.bat

@@ -1,3 +0,0 @@
-@echo off
-call npm install
-pause

package/_build/2_Compile.bat

@@ -1,13 +0,0 @@
-rem @echo off
-cd ..
-
-echo Run typescript convert...
-
-rmdir build /S /Q
-rmdir dist /S /Q
-node .\node_modules\typescript\bin\tsc
-mkdir build
-xcopy assets build /E
-call polymer build
-
-pause

package/_build/3_InstallTestComponents.bat

@@ -1,6 +0,0 @@
-@echo off
-cd ..
-call npm install --no-save @vanillawc/wc-marquee
-cd build
-xcopy /e ..\node_modules\@vanillawc\wc-marquee node_modules\@vanillawc\wc-marquee\
-pause

package/_build/RunPolymerWebserver.bat

@@ -1,3 +0,0 @@
-@echo off
-cd ..
-npx polymer serve --open