impaktapps-ui-builder 0.0.322 → 0.0.323

package/dist/src/impaktapps-ui-builder/builder/build/buildInputSlider.d.ts

@@ -0,0 +1 @@
+export declare const buildInputSlider: (config: any, componentScope: any) => any;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "impaktapps-ui-builder",
-    "version": "0.0.322",
+    "version": "0.0.323",
     "scripts": {
         "dev": "vite",
         "build": "tsc && vite build",

package/src/impaktapps-ui-builder/builder/build/buildInputSlider.ts

@@ -0,0 +1,49 @@
+
+import _ from "lodash";
+import { createLayoutFormat } from "./buildConfig";
+const InputSlider = {
+    type: "Control",
+    scope: "#/properties/inputSlider",
+    options: {
+        widget: "InputSlider",
+    },
+
+    config: {
+        layout: 12,
+        main: {
+            limitToMax: false,
+            max: 10000,
+            step: 1000,
+            min: 0,
+            label: "Slider"
+        },
+        style: {
+
+            // fontWeight:300
+        }
+    },
+};
+export const buildInputSlider = (config, componentScope) => {
+    const inputSlider: any = _.cloneDeep(InputSlider);
+    inputSlider.scope = componentScope;
+    inputSlider.config.main.heading = config.label
+    if (config.layout) {
+        inputSlider.config.layout = createLayoutFormat(config.layout)
+    }
+    if (config.limitToMax) {
+        inputSlider.config.main.limitToMax = config.limitToMax === "YES" ? true : false;
+    }
+    if (config.max) {
+        inputSlider.config.main.max = config.max
+    }
+    if (config.step) {
+        inputSlider.config.main.step = config.step;
+    }
+    if (config.min) {
+        inputSlider.config.main.min = config.min;
+    }
+    if (config.style) {
+        inputSlider.config.main.defaultStyle = JSON.parse(config.style)
+    }
+    return inputSlider;
+}

package/src/impaktapps-ui-builder/builder/build/buildUiSchema.ts

@@ -34,6 +34,7 @@ import { buildEmptyBox } from "./buildEmptyBox";
 import { buildArray } from "./buildArray";
 import { buildAdhaarField, buildPanField } from "./buildAadharCard";
 import { buildFileInput } from "./buildFileInput";
+import { buildInputSlider } from "./buildInputSlider";
 export let schema = {
   type: "object",
   properties: {},
@@ -164,6 +165,9 @@ const buildUiSchema = (config: any) => {
   let elements: any = {};
   const componentScope = `#/properties/${config.name}`;
   switch (config.type) {
+    case "InputSlider":
+      elements = buildInputSlider(config, componentScope);
+      break;
     case "FileInput":
       elements = buildFileInput(config, componentScope);
       break;

package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts

@@ -160,6 +160,14 @@ const GraphSection = {
 export const buildPropertiesSection = function (type: String) {
   let uiSchema = _.cloneDeep(GraphSection);
   switch (type) {
+    case "InputSlider":
+      uiSchema.elements = [
+        getInputField("max", "Max Limit"),
+        getInputField("step", "Step"),
+        getInputField("min", "Min Limit"),
+        getRadioInputField("limitToMax", "Applly Max. Limit", ["YES", "NO"]),
+      ]
+      break;
     case "Text":
       uiSchema.elements = [
         getInputField("placeholder", "Placeholder"),

package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/schema.ts

@@ -15,6 +15,7 @@ export const ComponentSchema: any = {
         { title: "Empty Box", const: "EmptyBox" },
         { title: "File", const: "FileInput" },
         { title: "Graph", const: "Graph" },
+        { title: "Input Slider", const: "InputSlider" },
         { title: "Label", const: "Box" },
         { title: "LeaderBoard", const: "LeaderBoard" },
         { title: "MultipleSelect", const: "MultipleSelect" },

package/src/impaktapps-ui-builder/builder/services/component.ts

@@ -33,6 +33,7 @@ const sectionLabels = {
   Radio:["Core", "Properties", "style", "Event","Validation"],
   Text:["Core","Properties","style", "Event","Validation"],
   TextArea:["Core","Properties","style", "Event","Validation"],
+  InputSlider:["Core","Properties","style", "Event","Validation"],
 }
 
 export const refreshPage = (type:string,store:any) => {