@omnia/velcron 7.0.380-dev

package/parser/VelcronLogger.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VelcronLogger = void 0;
+class VelcronLogger {
+    static logDataError(log) {
+        console.error(log);
+    }
+    static logActionError(log) {
+        console.error(log);
+    }
+    static logError(log) {
+        console.error(log);
+    }
+    static logCustomComponentError(log) {
+        console.error(log);
+    }
+}
+exports.VelcronLogger = VelcronLogger;

package/parser/VelcronRenderers.d.ts

@@ -0,0 +1,10 @@
+import { BuiltInComponentRenderers, DynamicViewModel, ResolvedComponentRenderer, VelcronDefinition, VelcronRenderContext } from "../models";
+export declare class VelcronRenderers {
+    private static components;
+    static registerComponent(type: string, component: any): void;
+    static hasComponents(): boolean;
+    static hasComponent(type: string): any;
+    static registerComponents(components: BuiltInComponentRenderers): void;
+    static getComponent(definition: VelcronDefinition, renderContext: VelcronRenderContext): ResolvedComponentRenderer;
+    static ensureRenderContext(rendererInfo: ResolvedComponentRenderer, definition: VelcronDefinition, currentRenderCtx: VelcronRenderContext, newViewModel?: DynamicViewModel): VelcronRenderContext;
+}

package/parser/VelcronRenderers.js

@@ -0,0 +1,114 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VelcronRenderers = void 0;
+const VelcronLogger_1 = require("./VelcronLogger");
+const VelcronData_1 = require("./VelcronData");
+class VelcronRenderers {
+    static registerComponent(type, component) {
+        type = type.toLowerCase();
+        if (!this.components[type]) {
+            this.components[type] = component;
+        }
+        else {
+            throw `Velcron Component of type ${type} is already registered`;
+        }
+    }
+    // private static reactivePropertyCreator: (objToCreateOn: object, propertyName: string, value: any ) => void
+    // static registerReactiveObjectCreator(reactivePropertyCreator: (objToCreateOn: object, propertyName: string, value: any) => void){
+    //         this.reactivePropertyCreator = reactivePropertyCreator;
+    // }
+    static hasComponents() {
+        return Object.keys(this.components).length > 0;
+    }
+    static hasComponent(type) {
+        type = type.toLowerCase();
+        return this.components[type];
+    }
+    static registerComponents(components) {
+        Object.keys(components).forEach((key) => {
+            this.registerComponent(key, components[key]);
+        });
+    }
+    static getComponent(definition, renderContext) {
+        let result;
+        let customComponentDefinition;
+        if (renderContext.components && Array.isArray(renderContext.components)) {
+            customComponentDefinition = renderContext.components?.find(p => p.type.toLowerCase() === definition.type.toLowerCase());
+        }
+        if (customComponentDefinition) {
+            if (!this.components["customcomponent"]) {
+                throw "Cant find the custom component renderer";
+            }
+            //Make a new instance of the custom component
+            const customComponentInstance = JSON.parse(JSON.stringify(customComponentDefinition));
+            //Apply styles coming from the usage definition
+            //TODO: If the custom component contains styling we should check which styling properties that
+            //comes from the current instance and override the ones from the original to make style overide work as we want
+            customComponentInstance.style = definition.style;
+            result = {
+                component: this.components["customcomponent"],
+                definition: customComponentInstance,
+                customComponent: true
+            };
+        }
+        else if (this.components[definition.type.toLowerCase()]) {
+            result = {
+                component: this.components[definition.type.toLowerCase()],
+                definition: definition,
+                customComponent: false
+            };
+        }
+        else {
+            throw "Cant find component";
+        }
+        return result;
+    }
+    static ensureRenderContext(rendererInfo, definition, currentRenderCtx, newViewModel) {
+        //Ensure we have the correct render context passing properties etc to sub components 
+        let result = currentRenderCtx;
+        if (rendererInfo.customComponent || newViewModel) {
+            result = {
+                rootContext: currentRenderCtx.rootContext,
+                currentContext: newViewModel ? newViewModel : currentRenderCtx.currentContext,
+                actions: currentRenderCtx.actions,
+                components: currentRenderCtx.components,
+                hooks: currentRenderCtx.hooks,
+                computed: currentRenderCtx.computed
+            };
+            if (rendererInfo.customComponent) {
+                //Fetch the custom component definition
+                const customDef = rendererInfo.definition;
+                if (customDef.properties) {
+                    // customDef.properties.forEach((prop) => {
+                    Object.keys(customDef.properties).forEach((propName) => {
+                        const prop = customDef.properties ? customDef.properties[propName] : null;
+                        if (!prop || (prop.required && !definition.hasOwnProperty(propName))) {
+                            VelcronLogger_1.VelcronLogger.logCustomComponentError(`Component of type ${customDef.type} requires property ${propName} but its missing`);
+                        }
+                        result.properties = result.properties || {};
+                        //Callback to reactive property creator (for example vue register to make it using Vue.set but can be different in react etc)
+                        // if(!result.properties){
+                        //     this.reactivePropertyCreator(result, 'properties', {});
+                        // }
+                        if (definition.hasOwnProperty(propName)) {
+                            if (VelcronData_1.VelcronData.isString(definition[propName])) {
+                                //Properties can be databound so if its a string we try do databind
+                                //this is true for other values such as number / string also
+                                result.properties[propName] = VelcronData_1.VelcronData.dataBind(currentRenderCtx, definition[propName]);
+                            }
+                            else {
+                                result.properties[propName] = definition[propName];
+                            }
+                        }
+                        else if (prop.hasOwnProperty("defaultValue")) {
+                            result.properties[propName] = prop.defaultValue;
+                        }
+                    });
+                }
+            }
+        }
+        return result;
+    }
+}
+exports.VelcronRenderers = VelcronRenderers;
+VelcronRenderers.components = {};

package/parser/VelcronStyles.d.ts

@@ -0,0 +1,8 @@
+import { VelcronDefinition, VelcronSectionDefinition, VelcronSectionColumn, VelcronRenderContext } from "../models";
+export declare class VelcronStyles {
+    static component(definition: VelcronDefinition, renderCtx: VelcronRenderContext): any;
+    private static dataBindStyles;
+    static section(sectionDef: VelcronSectionDefinition, renderCtx: VelcronRenderContext): any;
+    static layoutColumn(layoutDef: VelcronSectionDefinition, columnDef: VelcronSectionColumn, renderCtx: VelcronRenderContext): object;
+    static layoutColumnComponent(layoutDef: VelcronSectionDefinition, columnDef: VelcronSectionColumn, renderCtx: VelcronRenderContext): object;
+}

package/parser/VelcronStyles.js

@@ -0,0 +1,121 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VelcronStyles = void 0;
+const VelcronData_1 = require("./VelcronData");
+const models_1 = require("../models");
+const VelcronConstants_1 = require("./VelcronConstants");
+class VelcronStyles {
+    static component(definition, renderCtx) {
+        const bliblu = ";";
+        let result = { ...definition.style };
+        // let result = {
+        //     //Margin
+        //     margin: definition?.style?.margin,
+        //     marginTop: definition?.style?.marginTop,
+        //     marginRight: definition?.style?.marginRight,
+        //     marginBottom: definition?.style?.marginBottom,
+        //     marginLeft: definition?.style?.marginLeft,
+        //     //Padding
+        //     padding: definition?.style?.padding,
+        //     paddingTop: definition?.style?.paddingTop,
+        //     paddingRight: definition?.style?.paddingRight,
+        //     paddingBottom: definition?.style?.paddingBottom,
+        //     paddingLeft: definition?.style?.paddingLeft,
+        //     height: definition.style?.height,
+        //     width: definition.style?.width
+        // }
+        if (definition.type === VelcronConstants_1.VelcronConstants.components.image) {
+            //Set default width and height values on Images
+            if (!result.width) {
+                result.width = "100%";
+            }
+            if (!result.height) {
+                result.height = 400;
+            }
+        }
+        else if (definition.type === VelcronConstants_1.VelcronConstants.components.text) {
+            const textDef = definition;
+            if (textDef.color) {
+                result["color"] = textDef.color;
+            }
+            if (textDef.size) {
+                result["fontSize"] = textDef.size + "px";
+            }
+        }
+        if (renderCtx) {
+            result = VelcronStyles.dataBindStyles(result, renderCtx);
+        }
+        return result;
+    }
+    static dataBindStyles(styles, renderCtx) {
+        Object.keys(styles).forEach((key) => {
+            const style = styles[key];
+            if (style && VelcronData_1.VelcronData.isString(style)) {
+                styles[key] = VelcronData_1.VelcronData.dataBind(renderCtx, style);
+            }
+        });
+        return styles;
+    }
+    static section(sectionDef, renderCtx) {
+        let result = {
+            "display": "flex",
+            ...sectionDef.style,
+        };
+        result = VelcronStyles.dataBindStyles(result, renderCtx);
+        return result;
+    }
+    static layoutColumn(layoutDef, columnDef, renderCtx) {
+        //Default is stretch
+        const width = {};
+        width["flex"] = 1;
+        //Auto
+        if (columnDef.width && columnDef.width === models_1.VelcronSectionColumnWidthTypes.auto) {
+            width["flex"] = "0 0 auto";
+        }
+        //Pixels
+        else if (columnDef.width && VelcronData_1.VelcronData.isString(columnDef.width) && columnDef.width.endsWith("px")) {
+            width["flex"] = `0 0 ${columnDef.width}`;
+        }
+        //Percentage
+        else if (columnDef.width && (isNaN(columnDef.width) === false)) {
+            width["flex"] = `0 0 ${columnDef.width}%`;
+        }
+        let result = {
+            "display": "flex",
+            ...width,
+            ...layoutDef.columnStyle,
+            ...columnDef.style
+        };
+        if (columnDef.horizontalAlignment && columnDef.horizontalAlignment !== models_1.VelcronHorizontalAlignments.left) {
+            //Need to add this to make horizontalAlignment work for child div
+            result["flex-direction"] = "column";
+        }
+        if (columnDef.verticalAlignment) {
+            if (columnDef.verticalAlignment === models_1.VerticalAlignments.center) {
+                result["flex-direction"] = "column";
+                result["justify-content"] = "center";
+            }
+            else if (columnDef.verticalAlignment === models_1.VerticalAlignments.bottom) {
+                result["flex-direction"] = "column";
+                result["justify-content"] = "flex-end";
+            }
+        }
+        result = VelcronStyles.dataBindStyles(result, renderCtx);
+        return result;
+    }
+    static layoutColumnComponent(layoutDef, columnDef, renderCtx) {
+        const result = {
+            "display": "flex",
+        };
+        if (columnDef.horizontalAlignment) {
+            if (columnDef.horizontalAlignment === models_1.VelcronHorizontalAlignments.center) {
+                result["justify-content"] = "center";
+            }
+            else if (columnDef.horizontalAlignment === models_1.VelcronHorizontalAlignments.right) {
+                result["justify-content"] = "flex-end";
+            }
+        }
+        return result;
+    }
+}
+exports.VelcronStyles = VelcronStyles;

package/parser/index.d.ts

@@ -0,0 +1,7 @@
+export * from "./VelcronData";
+export * from "./VelcronActions";
+export * from "./VelcronConstants";
+export * from "./VelcronStyles";
+export * from "./VelcronLogger";
+export * from "./VelcronRenderers";
+export * from "./TextValue";

package/parser/index.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./VelcronData"), exports);
+tslib_1.__exportStar(require("./VelcronActions"), exports);
+tslib_1.__exportStar(require("./VelcronConstants"), exports);
+tslib_1.__exportStar(require("./VelcronStyles"), exports);
+tslib_1.__exportStar(require("./VelcronLogger"), exports);
+tslib_1.__exportStar(require("./VelcronRenderers"), exports);
+tslib_1.__exportStar(require("./TextValue"), exports);