@omnia/velcron 7.0.501-dev → 7.0.502-dev

package/package.json

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

package/parser/VelcronStyles.d.ts

@@ -1,19 +1,7 @@
 import { VelcronDefinition, VelcronRenderContext } from "../models";
-export declare enum VelcronSizeUnits {
-    Pixels = 1,
-    Numbers = 2
-}
-export interface VelcronStyleSettings {
-    sizeUnit: VelcronSizeUnits;
-}
 export declare class VelcronStyles {
-    private static styleSettings;
-    static create(definition: VelcronDefinition, renderCtx: VelcronRenderContext): any;
-    private static createStylesForText;
-    private static createStylesForImage;
-    private static createStylesForFlexbox;
-    private static createStylesForLayoutColumnComponent;
+    static styleProvider: (definition: VelcronDefinition, renderCtx: VelcronRenderContext) => object;
+    static registerStyleProvider(fn: (definition: VelcronDefinition, renderCtx: VelcronRenderContext) => object): void;
+    static create(definition: VelcronDefinition, renderCtx: VelcronRenderContext): object;
     private static dataBindStyles;
-    private static setUnitForValue;
-    private static setup;
 }

package/parser/VelcronStyles.js

@@ -1,124 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.VelcronStyles = exports.VelcronSizeUnits = void 0;
+exports.VelcronStyles = void 0;
 const VelcronData_1 = require("./VelcronData");
-const models_1 = require("../models");
-const VelcronConstants_1 = require("./VelcronConstants");
-var VelcronSizeUnits;
-(function (VelcronSizeUnits) {
-    VelcronSizeUnits[VelcronSizeUnits["Pixels"] = 1] = "Pixels";
-    VelcronSizeUnits[VelcronSizeUnits["Numbers"] = 2] = "Numbers";
-})(VelcronSizeUnits = exports.VelcronSizeUnits || (exports.VelcronSizeUnits = {}));
 class VelcronStyles {
+    static registerStyleProvider(fn) {
+        VelcronStyles.styleProvider = fn;
+    }
     static create(definition, renderCtx) {
-        let result = { ...definition.style };
-        if (definition.type === VelcronConstants_1.VelcronConstants.components.image) {
-            result = this.createStylesForImage(definition, result);
-        }
-        else if (definition.type === VelcronConstants_1.VelcronConstants.components.text) {
-            result = this.createStylesForText(definition, result);
-        }
-        else if (definition.type === VelcronConstants_1.VelcronConstants.components.flexView) {
-            //result = this.createStylesForSection(definition as VelcronFlexBoxDefinition, result);
-            result = this.createStylesForFlexbox(definition, result);
-        }
-        // else if (definition.type === VelcronConstants.components.flexPanel) {
-        //     result = this.createStylesForColumn(definition as VelcronFlexBoxDefinition, result);
-        // }
+        let result = VelcronStyles.styleProvider(definition, renderCtx);
         if (renderCtx) {
             result = VelcronStyles.dataBindStyles(result, renderCtx);
         }
         return result;
     }
-    static createStylesForText(textDefinition, styles) {
-        // const themeStore = useInject(ThemeStore);
-        // if (textDefinition.color && textDefinition.color != "") {
-        //     styles["color"] = themeStore.getters.getColor(textDefinition.color);
-        // }
-        // else {
-        //     styles["color"] = themeStore.getters.activeSchema().onBase.color;
-        // }
-        // const typography = themeStore.getters.typography(textDefinition.typography);
-        // styles["fontSize"] = this.setUnitForValue(typography.large.size);
-        // styles["font-weight"] = typography.large.weight;
-        // styles["line-height"] = this.setUnitForValue(typography.large.lineHeight);
-        return styles;
-    }
-    static createStylesForImage(imageDef, styles) {
-        if (!styles.width) {
-            styles.width = this.setUnitForValue(200);
-        }
-        if (!styles.height) {
-            styles.height = this.setUnitForValue(400);
-        }
-        styles.flex = "0 0 auto!important";
-        return styles;
-    }
-    // private static createStylesForSection(sectionDef: VelcronFlexBoxDefinition, styles: any) {
-    //     styles.display = "flex";
-    //     styles.width = "100%";
-    //     styles["flex-direction"] = sectionDef.column ? "column" : "row";
-    //     return styles;
-    // }
-    static createStylesForFlexbox(flexViewDefinition, styles) {
-        const flexGrow = flexViewDefinition.grow ? flexViewDefinition.grow : 1;
-        const flextShrink = flexGrow;
-        styles.display = "flex";
-        styles.flex = flexGrow;
-        styles["max-width"] = "100%";
-        styles["flex-direction"] = flexViewDefinition.column ? "column" : "row";
-        //Auto
-        if (flexViewDefinition.width && flexViewDefinition.width === models_1.VelcronSectionColumnWidthTypes.auto) {
-            styles["flex"] = `${flexGrow} ${flextShrink} auto`;
-        }
-        //Pixels
-        else if (flexViewDefinition.width && VelcronData_1.VelcronData.isString(flexViewDefinition.width) && flexViewDefinition.width.endsWith("px")) {
-            //width["flex"] = `${flexGrow} ${flextShrink} ${columnDef.width}`;
-            styles["max-width"] = this.setUnitForValue(flexViewDefinition.width);
-        }
-        //Percentage
-        else if (flexViewDefinition.width && (isNaN(flexViewDefinition.width) === false)) {
-            styles["flex"] = `${flexGrow} ${flextShrink} ${flexViewDefinition.width}%`;
-        }
-        // if (columnDef.horizontalAlignment && columnDef.horizontalAlignment !== VelcronHorizontalAlignments.left) {
-        //     //Need to add this to make horizontalAlignment work for child div
-        //     result["flex-direction"] = "column";
-        // }
-        if (flexViewDefinition.horizontalAlignment) {
-            //Need to add this to make horizontalAlignment work for child div
-            styles["justify-content"] = flexViewDefinition.horizontalAlignment;
-        }
-        if (flexViewDefinition.verticalAlignment) {
-            if (flexViewDefinition.verticalAlignment === models_1.VerticalAlignments.center) {
-                //result["flex-direction"] = "column";
-                styles["align-items"] = "center";
-            }
-            else if (flexViewDefinition.verticalAlignment === models_1.VerticalAlignments.bottom) {
-                //result["flex-direction"] = "column";
-                styles["align-items"] = "flex-end";
-            }
-        }
-        // if (flexViewDefinition.colorSchema && flexViewDefinition.colorSchema != "") {
-        //     const themeStore = useInject(ThemeStore);
-        //     styles["background-color"] = themeStore.getters.activeSchema().base.color;
-        // }
-        //Color
-        //if(flexViewDefinition.co)
-        //const { theming } =  useTheme();
-        return styles;
-    }
-    static createStylesForLayoutColumnComponent(layoutDef, columnDef, styles) {
-        styles.display = "flex";
-        if (columnDef.horizontalAlignment) {
-            if (columnDef.horizontalAlignment === models_1.VelcronHorizontalAlignments.center) {
-                styles["justify-content"] = "center";
-            }
-            else if (columnDef.horizontalAlignment === models_1.VelcronHorizontalAlignments.right) {
-                styles["justify-content"] = "flex-end";
-            }
-        }
-        return styles;
-    }
     static dataBindStyles(styles, renderCtx) {
         Object.keys(styles).forEach((key) => {
             const style = styles[key];
@@ -128,17 +22,5 @@ class VelcronStyles {
         });
         return styles;
     }
-    static setUnitForValue(value) {
-        if (this.styleSettings.sizeUnit === VelcronSizeUnits.Pixels) {
-            return value + "px";
-        }
-        return value;
-    }
-    static setup(settings) {
-        this.styleSettings = settings;
-    }
 }
 exports.VelcronStyles = VelcronStyles;
-VelcronStyles.styleSettings = {
-    sizeUnit: VelcronSizeUnits.Pixels
-};

package/stores/VelcronStore.d.ts

@@ -1,6 +1,6 @@
 export declare class VelcronStore {
-    static makeReactive: (obj: any) => unknown;
-    static reactivityCreator(fn: (obj: any) => unknown): void;
+    static reactivityProvider: (obj: any) => unknown;
+    static registerReactivityProvider(fn: (obj: any) => unknown): void;
     state<T>(obj: T): T;
     mutation(fn: () => void): void;
 }

package/stores/VelcronStore.js

@@ -2,14 +2,14 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TestStore = exports.VelcronStore = void 0;
 class VelcronStore {
-    static reactivityCreator(fn) {
-        VelcronStore.makeReactive = fn;
+    static registerReactivityProvider(fn) {
+        VelcronStore.reactivityProvider = fn;
     }
     state(obj) {
-        if (!VelcronStore.makeReactive) {
+        if (!VelcronStore.reactivityProvider) {
             throw new Error("Reactivity creator not set");
         }
-        return VelcronStore.makeReactive(obj);
+        return VelcronStore.reactivityProvider(obj);
     }
     mutation(fn) {
         fn();