@omnia/velcron 8.0.289-dev → 8.0.290-dev

package/internal-do-not-import-from-here/shared/models/velcron/VelcronDefinition.d.ts

@@ -60,7 +60,7 @@ export interface VelcronComponentDefinition extends VelcronDefinition {
     icon?: any;
 }
 export type VelcronCustomComponentDefinition = VelcronComponentDefinition;
-export type BuiltInPropertyEditorType = "text" | "number" | "slider" | "switch" | "alignment" | "color" | "flow" | "icon" | "image" | "typography" | "spacing" | "color-schema-type" | "blueprint" | "background" | "grid" | "reference" | "select" | "property-resolver";
+export type BuiltInPropertyEditorType = "text" | "number" | "slider" | "switch" | "alignment" | "color" | "flow" | "icon" | "image" | "typography" | "spacing" | "color-schema-type" | "blueprint" | "background" | "grid" | "reference" | "select" | "property-resolver" | "link-resolver";
 export type EditorLocation = "inline" | "pane" | "toolbar";
 export interface VelcronEditor<TSettings = any> {
     name?: string;

package/models/VelcronDefinitions.d.ts

@@ -13,6 +13,7 @@ export interface BuiltInComponentRenderers {
     "velcron": unknown;
     "flex": unknown;
     "row": unknown;
+    "grid": unknown;
     "column": unknown;
     "card": unknown;
     "text": unknown;
@@ -180,6 +181,13 @@ export interface VelcronFlexDefinition extends VelcronDefinition, VelcronColorSt
     height?: number | string;
     minHeight?: number | string;
 }
+export interface VelcronGridDefinition extends VelcronDefinition {
+    type: "grid";
+    minColumnWidth?: number | string;
+    columns?: number | Array<string>;
+    gapX?: number | string;
+    gapY?: number | string;
+}
 export interface VelcronFlexRowDefinition extends VelcronDefinition, VelcronColorStyling, VelcronDefinitionHasEffects, VelcronDefinitionHasOverflow {
     type: "row";
     events?: VelcronOnPressEvent;

package/models/VelcronPropertyEditorDefinitions.d.ts

@@ -50,6 +50,8 @@ export interface VelcronPropertyMapping {
 export interface VelcronPropertyResolverEditorSettings {
     properties: Array<VelcronPropertyMapping>;
 }
+export interface VelcronLinkResolverEditorSettings {
+}
 export interface VelcronBlueprintEditorSettings {
     type: "container" | "icon" | "button";
 }
@@ -113,3 +115,6 @@ export interface VelcronSelectEditor extends VelcronEditor<VelcronSelectEditorSe
 export interface VelcronPropertyResolverEditor extends VelcronEditor<VelcronPropertyResolverEditorSettings> {
     type: "property-resolver";
 }
+export interface VelcronLinkResolverEditor extends VelcronEditor<VelcronLinkResolverEditorSettings> {
+    type: "link-resolver";
+}

package/package.json

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

package/parser/VelcronConstants.d.ts

@@ -3,6 +3,7 @@ export declare const VelcronConstants: {
         velcron: string;
         flex: string;
         row: string;
+        grid: string;
         column: string;
         card: string;
         text: string;

package/parser/VelcronConstants.js

@@ -6,6 +6,7 @@ exports.VelcronConstants = {
         velcron: "velcron",
         flex: "flex",
         row: "row",
+        grid: "grid",
         column: "column",
         card: "card",
         text: "text",

package/parser/VelcronStyles.js

@@ -276,6 +276,40 @@ class VelcronStyles {
             styleBase["minWidth"] = this.unitProvider.formatDimension(minWidth);
             this.insertBackgroundColor(styleBase, flexDefinition, renderCtx);
         }
+        else if (definition.type === VelcronConstants_1.VelcronConstants.components.grid) {
+            const spacingBlueprint = renderCtx.theming.get.spacing();
+            const flexDefinition = definition;
+            const columns = VelcronData_1.VelcronData.dataBind(renderCtx, flexDefinition.columns);
+            const minWidth = VelcronData_1.VelcronData.dataBind(renderCtx, flexDefinition.minColumnWidth);
+            const gapX = flexDefinition.gapX || flexDefinition?.gapX?.toString() === "0" ?
+                (0, __1.getSpacingValueFromBlueprint)(VelcronData_1.VelcronData.dataBind(renderCtx, flexDefinition.gapX), spacingBlueprint) :
+                (0, __1.getSpacingValueFromBlueprint)(VelcronData_1.VelcronData.dataBind(renderCtx, flexDefinition.gapY), spacingBlueprint);
+            const gapY = flexDefinition.gapY || flexDefinition?.gapY?.toString() === "0" ?
+                (0, __1.getSpacingValueFromBlueprint)(VelcronData_1.VelcronData.dataBind(renderCtx, flexDefinition.gapY), spacingBlueprint) :
+                gapX;
+            styleBase["display"] = "grid";
+            if (minWidth) {
+                const widthWithDimension = this.unitProvider.formatDimension(minWidth);
+                styleBase["gridTemplateColumns"] = `repeat(auto-fit,minmax(${widthWithDimension}, 1fr))`;
+            }
+            else if (columns) {
+                let templateColumnString = "";
+                if (VelcronData_1.VelcronData.isArray(columns)) {
+                    columns.forEach((col) => {
+                        templateColumnString += `${col} `;
+                    });
+                }
+                else {
+                    const columnNumber = Number.parseInt(columns);
+                    for (let i = 0; i < columnNumber; i++) {
+                        templateColumnString += "1fr ";
+                    }
+                }
+                styleBase["gridTemplateColumns"] = templateColumnString;
+            }
+            styleBase["rowGap"] = this.unitProvider.formatDimension(gapY);
+            styleBase["columnGap"] = this.unitProvider.formatDimension(gapX);
+        }
         if (definition.border) {
             const typedDefinition = definition;
             this.insertBorderStyles(styleBase, typedDefinition.border, renderCtx);

package/templatebuilder/VelcronEditorBuilder.d.ts

@@ -16,6 +16,7 @@ export declare class VelcronEditorBuilder {
         gridEditor: (name: string, stateMapping: string) => VelcronEditorBuilder;
         widthEditor: (name: string, stateMapping: string) => VelcronEditorBuilder;
         propertyResolverEditor: (name: string, stateMapping: string) => VelcronEditorBuilder;
+        linkResolverEditor: (name: string, stateMapping: string) => VelcronEditorBuilder;
     };
     build(): VelcronEditor<any>[];
 }

package/templatebuilder/VelcronEditorBuilder.js

@@ -142,6 +142,14 @@ class VelcronEditorBuilder {
                     state: this.formatStateMapping(stateMapping),
                 });
                 return this;
+            },
+            linkResolverEditor: (name, stateMapping) => {
+                this.editors.push({
+                    name: name,
+                    type: "link-resolver",
+                    state: this.formatStateMapping(stateMapping),
+                });
+                return this;
             }
         };
     }