@omnia/velcron 8.0.100-vnext → 8.0.101-vnext

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@omnia/velcron",
   "license": "MIT",
-  "version": "8.0.100-vnext",
+  "version": "8.0.101-vnext",
   "description": "Provide Omnia Velcron Stuffs.",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"

package/templatebuilder/editor/VelcronContentEditor.d.ts

@@ -2,13 +2,37 @@ import { VelcronPropertyEditor } from "@omnia/fx-models";
 import { VelcronEditorBuilderBase } from "./VelcronEditorBuilderBase";
 export declare class VelcronContentEditorBuilder extends VelcronEditorBuilderBase {
     private mainEditor;
+    private mainPropertyEditor;
+    private mainTypographyEditor;
     private captionEditor;
+    private captionTypographyEditor;
+    private captionPropertyEditor;
+    private titleEditor;
+    private titlePropertyEditor;
+    private titleTypographyEditor;
+    private summaryEditor;
+    private summaryPropertyEditor;
+    private summaryTypographyEditor;
     constructor(builder: any);
     main: {
-        add: () => VelcronContentEditorBuilder;
+        addContentEditor: () => VelcronContentEditorBuilder;
+        addPropertyMappingEditor: (title?: string) => VelcronContentEditorBuilder;
+        addTypographyEditor: (title?: string, type?: "text" | "title") => VelcronContentEditorBuilder;
     };
     caption: {
-        add: () => VelcronContentEditorBuilder;
+        addContentEditor: () => VelcronContentEditorBuilder;
+        addPropertyMappingEditor: (title?: string) => VelcronContentEditorBuilder;
+        addTypographyEditor: (title?: string, type?: "text" | "title") => VelcronContentEditorBuilder;
+    };
+    title: {
+        addContentEditor: () => VelcronContentEditorBuilder;
+        addPropertyMappingEditor: (title?: string) => VelcronContentEditorBuilder;
+        addTypographyEditor: (title?: string, type?: "text" | "title") => VelcronContentEditorBuilder;
+    };
+    summary: {
+        addContentEditor: () => VelcronContentEditorBuilder;
+        addPropertyMappingEditor: (title?: string) => VelcronContentEditorBuilder;
+        addTypographyEditor: (title?: string, type?: "text" | "title") => VelcronContentEditorBuilder;
     };
     protected internalBuild(): VelcronPropertyEditor<any>[];
 }

package/templatebuilder/editor/VelcronContentEditor.js

@@ -6,26 +6,156 @@ class VelcronContentEditorBuilder extends VelcronEditorBuilderBase_1.VelcronEdit
     constructor(builder) {
         super(builder);
         this.mainEditor = null;
+        this.mainPropertyEditor = null;
+        this.mainTypographyEditor = null;
         this.captionEditor = null;
+        this.captionTypographyEditor = null;
+        this.captionPropertyEditor = null;
+        this.titleEditor = null;
+        this.titlePropertyEditor = null;
+        this.titleTypographyEditor = null;
+        this.summaryEditor = null;
+        this.summaryPropertyEditor = null;
+        this.summaryTypographyEditor = null;
         this.main = {
-            add: () => {
+            addContentEditor: () => {
                 if (!this.mainEditor) {
                     this.mainEditor = {
                         name: "Body",
                         type: "markdown",
-                        stateMapping: "content.main"
+                        stateMapping: "content.main.text"
+                    };
+                }
+                return this;
+            },
+            addPropertyMappingEditor: (title) => {
+                if (!this.mainPropertyEditor) {
+                    this.mainPropertyEditor = {
+                        name: title ? title : "Main",
+                        type: "text",
+                        stateMapping: "content.main.text",
+                        propertyMapping: true
+                    };
+                }
+                return this;
+            },
+            addTypographyEditor: (title, type) => {
+                if (!this.mainTypographyEditor) {
+                    this.mainTypographyEditor = {
+                        name: title ? title : "Main formatting",
+                        type: "typography",
+                        stateMapping: "content.main.text",
+                        settings: {
+                            type: type ? type : "text"
+                        }
                     };
                 }
                 return this;
             }
         };
         this.caption = {
-            add: () => {
+            addContentEditor: () => {
                 if (!this.captionEditor) {
                     this.captionEditor = {
                         name: "Caption",
                         type: "text",
-                        stateMapping: "content.caption"
+                        stateMapping: "content.caption.text"
+                    };
+                }
+                return this;
+            },
+            addPropertyMappingEditor: (title) => {
+                if (!this.captionPropertyEditor) {
+                    this.captionPropertyEditor = {
+                        name: title ? title : "Caption",
+                        type: "text",
+                        stateMapping: "content.caption.text",
+                        propertyMapping: true
+                    };
+                }
+                return this;
+            },
+            addTypographyEditor: (title, type) => {
+                if (!this.captionTypographyEditor) {
+                    this.captionTypographyEditor = {
+                        name: title ? title : "Caption formatting",
+                        type: "typography",
+                        stateMapping: "content.caption.text",
+                        settings: {
+                            type: type ? type : "text"
+                        }
+                    };
+                }
+                return this;
+            }
+        };
+        this.title = {
+            addContentEditor: () => {
+                if (!this.titleEditor) {
+                    this.titleEditor = {
+                        name: "Title",
+                        type: "text",
+                        stateMapping: "content.title.text"
+                    };
+                }
+                return this;
+            },
+            addPropertyMappingEditor: (title) => {
+                if (!this.titlePropertyEditor) {
+                    this.titlePropertyEditor = {
+                        name: title ? title : "Title",
+                        type: "text",
+                        stateMapping: "content.title.text",
+                        propertyMapping: true
+                    };
+                }
+                return this;
+            },
+            addTypographyEditor: (title, type) => {
+                if (!this.titleTypographyEditor) {
+                    this.titleTypographyEditor = {
+                        name: title ? title : "Title formatting",
+                        type: "typography",
+                        stateMapping: "content.title.text",
+                        settings: {
+                            type: type ? type : "title"
+                        }
+                    };
+                }
+                return this;
+            }
+        };
+        this.summary = {
+            addContentEditor: () => {
+                if (!this.summaryEditor) {
+                    this.summaryEditor = {
+                        name: "Summary",
+                        type: "text",
+                        stateMapping: "content.summary.text"
+                    };
+                }
+                return this;
+            },
+            addPropertyMappingEditor: (title) => {
+                if (!this.summaryPropertyEditor) {
+                    this.summaryPropertyEditor = {
+                        name: title ? title : "Summary",
+                        type: "text",
+                        stateMapping: "content.summary.text",
+                        propertyMapping: true
+                    };
+                }
+                return this;
+            },
+            addTypographyEditor: (title, type) => {
+                if (!this.summaryTypographyEditor) {
+                    this.summaryTypographyEditor = {
+                        name: title ? title : "Summary formatting",
+                        type: "typography",
+                        stateMapping: "content.summary.text",
+                        settings: {
+                            type: type ? type : "text"
+                        }
                     };
                 }
                 return this;
@@ -37,9 +167,39 @@ class VelcronContentEditorBuilder extends VelcronEditorBuilderBase_1.VelcronEdit
         if (this.mainEditor) {
             result.push(this.mainEditor);
         }
+        if (this.mainPropertyEditor) {
+            result.push(this.mainPropertyEditor);
+        }
+        if (this.mainTypographyEditor) {
+            result.push(this.mainTypographyEditor);
+        }
+        if (this.titleEditor) {
+            result.push(this.titleEditor);
+        }
+        if (this.titlePropertyEditor) {
+            result.push(this.titlePropertyEditor);
+        }
+        if (this.titleTypographyEditor) {
+            result.push(this.titleTypographyEditor);
+        }
+        if (this.summaryEditor) {
+            result.push(this.summaryEditor);
+        }
+        if (this.summaryPropertyEditor) {
+            result.push(this.summaryPropertyEditor);
+        }
+        if (this.summaryTypographyEditor) {
+            result.push(this.summaryTypographyEditor);
+        }
         if (this.captionEditor) {
             result.push(this.captionEditor);
         }
+        if (this.captionTypographyEditor) {
+            result.push(this.captionTypographyEditor);
+        }
+        if (this.captionPropertyEditor) {
+            result.push(this.captionPropertyEditor);
+        }
         return result;
     }
 }

package/templatebuilder/editor/VelcronPropertyMappingEditorBuilder.js

@@ -12,7 +12,7 @@ class VelcronPropertyMappingEditorBuilder extends VelcronEditorBuilderBase_1.Vel
             this.editor = {
                 name: "Properties",
                 type: "enterprise-property",
-                stateMapping: "propertyItems",
+                stateMapping: "properties.mappings",
                 propertyMapping: true,
                 multiple: true,
             };

package/templatebuilder/state/VelcronContentStateBuilder.js

@@ -39,16 +39,6 @@ class VelcronContentStateBuilder extends VelcronStateBuilderBase_1.VelcronStateB
         if (!hasContent) {
             return null;
         }
-        //     resultValue["main"] = this.mainContent;
-        //     hasContent = true;
-        // }
-        // if(this.captionContent){
-        //     resultValue["caption"] = this.captionContent;
-        //     hasContent = true;
-        // }
-        // if(!hasContent){
-        //     return null;
-        // }
         return {
             content: resultValue
         };

package/templatebuilder/state/VelcronPropertyMappingStateBuilder.js

@@ -11,15 +11,15 @@ class VelcronPropertyMappingStateBuilder extends VelcronStateBuilderBase_1.Velcr
                 this.propertyItemsValue = items;
                 return this;
             },
-            bind: "$propertyItems",
-            foreach: "propertyItems"
+            bind: "$properties.mappings",
+            foreach: "properties.mappings"
         };
     }
     internalBuild() {
         const resultValue = {};
         let hasContent = false;
         if (this.propertyItemsValue) {
-            resultValue["mappings"] = this.propertyItemsValue;
+            resultValue.mappings = this.propertyItemsValue;
             hasContent = true;
         }
         if (!hasContent) {
@@ -27,7 +27,7 @@ class VelcronPropertyMappingStateBuilder extends VelcronStateBuilderBase_1.Velcr
         }
         return {
             properties: {
-                mappings: resultValue
+                ...resultValue
             }
         };
     }

package/templatebuilder/state/VelcronTextContentBuilder.d.ts

@@ -2,28 +2,29 @@ import { TypographySize, TypographyType, VelcronTextState, VelcronTypographyStat
 import { VelcronStateBuilderStrategy } from "./VelcronStateBuilderBase";
 export declare class VelcronTextContentBuilder<TBaseBuilder> extends VelcronStateBuilderStrategy {
     private _textState;
-    private baseBind;
+    private bindingContextValue;
     private _typographyState;
     private baseBuilder;
     constructor(baseBuilder: TBaseBuilder, bind: string);
     get typographyState(): VelcronTypographyState;
     get textState(): VelcronTextState;
+    get bindingContext(): string;
     text: {
         add: (value: string) => VelcronTextContentBuilder<TBaseBuilder>;
-        bind: string;
+        bind: () => string;
     };
     typography: {
         type: {
             add: (type: TypographyType) => VelcronTextContentBuilder<TBaseBuilder>;
-            bind: string;
+            bind: () => string;
         };
         size: {
             add: (size: TypographySize) => VelcronTextContentBuilder<TBaseBuilder>;
-            bind: string;
+            bind: () => string;
         };
         toned: {
             add: (toned: boolean) => VelcronTextContentBuilder<TBaseBuilder>;
-            bind: string;
+            bind: () => string;
         };
     };
     done(): TBaseBuilder;

package/templatebuilder/state/VelcronTextContentBuilder.js

@@ -14,7 +14,7 @@ class VelcronTextContentBuilder extends VelcronStateBuilderBase_1.VelcronStateBu
     constructor(baseBuilder, bind) {
         super();
         this._textState = undefined;
-        this.baseBind = undefined;
+        this.bindingContextValue = undefined;
         this._typographyState = undefined;
         // :VelcronTextContentBuilder<TBaseBuilder>
         this.text = {
@@ -22,7 +22,7 @@ class VelcronTextContentBuilder extends VelcronStateBuilderBase_1.VelcronStateBu
                 this.textState.text = value;
                 return this;
             },
-            bind: `{{ ${this.baseBind}.text }}`
+            bind: () => { return `{{ ${this.bindingContextValue}.text }}`; }
         };
         this.typography = {
             type: {
@@ -30,25 +30,25 @@ class VelcronTextContentBuilder extends VelcronStateBuilderBase_1.VelcronStateBu
                     this.typographyState.type = type;
                     return this;
                 },
-                bind: `{{ ${this.baseBind}.typography.type }}`
+                bind: () => { return `{{ ${this.bindingContextValue}.typography.type }}`; }
             },
             size: {
                 add: (size) => {
                     this.typographyState.size = size;
                     return this;
                 },
-                bind: `{{ ${this.baseBind}.typography.size }}`
+                bind: () => { return `{{ ${this.bindingContextValue}.typography.size }}`; }
             },
             toned: {
                 add: (toned) => {
                     this.typographyState.toned = toned;
                     return this;
                 },
-                bind: `{{ ${this.baseBind}.typography.toned }}`
+                bind: () => { return `{{ ${this.bindingContextValue}.typography.toned }}`; }
             }
         };
         this.baseBuilder = baseBuilder;
-        this.baseBind = bind;
+        this.bindingContextValue = bind;
     }
     get typographyState() {
         if (!this._typographyState) {
@@ -62,6 +62,9 @@ class VelcronTextContentBuilder extends VelcronStateBuilderBase_1.VelcronStateBu
         }
         return this._textState;
     }
+    get bindingContext() {
+        return this.bindingContextValue;
+    }
     // typography(type?: TypographyType,size?:TypographySize,toned?:boolean):VelcronTextContentBuilder<TBaseBuilder>{
     //     this.textState.typography = {
     //         type:type,