impaktapps-ui-builder 0.0.963-CopyComponent.8 → 0.0.963-copyElement.1000

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

@@ -81,6 +81,7 @@ export declare const TableSection: (theme: any) => {
                         onClick: string;
                         tooltipMessage: string;
                         styleDefault?: undefined;
+                        disabled?: undefined;
                     };
                     style: {
                         color: any;
@@ -105,6 +106,7 @@ export declare const TableSection: (theme: any) => {
                         onClick: string;
                         tooltipMessage: string;
                         styleDefault?: undefined;
+                        disabled?: undefined;
                     };
                     style?: undefined;
                 };
@@ -125,6 +127,7 @@ export declare const TableSection: (theme: any) => {
                         icon: string;
                         onClick: string;
                         styleDefault: boolean;
+                        disabled: boolean;
                         color?: undefined;
                         tooltipMessage?: undefined;
                     };

package/dist/src/impaktapps-ui-builder/builder/elements/UiSchema/PageMaster/schema.d.ts

@@ -39,6 +39,12 @@ export declare const PageMasterSchema: {
                 };
             };
         };
+        RemoveItemButton: {
+            disabled: boolean;
+        };
+        Paste_Icon: {
+            disabled: boolean;
+        };
     };
     required: string[];
 };

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

@@ -16,9 +16,9 @@ declare const _default: (store: any, dynamicData: any, submitHandler: any, servi
     backHandler: () => void;
     deletePopUpComponent: () => void;
     deletePopUpEvent: () => void;
-    CopyComponent: () => void;
-    PasteComponent: () => void;
-    CopyEvent: () => void;
-    PasteEvent: () => void;
+    CopyComponent: (store: any) => void;
+    PasteComponent: (store: any) => void;
+    CopyEvent: (store: any) => void;
+    PasteEvent: (store: any) => void;
 };
 export default _default;

package/dist/src/impaktapps-ui-builder/builder/services/event.d.ts

@@ -87,7 +87,7 @@ declare const _default: (store: any, dynamicData: any, submitHandler: any, servi
     deleteEvent: () => Promise<void>;
     backHandler: () => void;
     deletePopUpEvent: () => void;
-    CopyEvent: () => void;
-    PasteEvent: () => void;
+    CopyEvent: (store: any) => void;
+    PasteEvent: (store: any) => void;
 };
 export default _default;

package/dist/src/impaktapps-ui-builder/builder/services/pageMaster.d.ts

@@ -50,6 +50,12 @@ declare const _default: (funcParams: funcParamsProps) => {
                     };
                 };
             };
+            RemoveItemButton: {
+                disabled: boolean;
+            };
+            Paste_Icon: {
+                disabled: boolean;
+            };
         };
         required: string[];
     };
@@ -65,6 +71,7 @@ declare const _default: (funcParams: funcParamsProps) => {
     deletePopUpEvent: () => void;
     CopyComponent: () => void;
     PasteComponent: () => void;
+    RemoveItemButton: () => void;
     CopyEvent: () => void;
     PasteEvent: () => void;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "impaktapps-ui-builder",
-    "version": "0.0.963-CopyComponent.8",
+    "version": "0.0.963-copyElement.1000",
     "scripts": {
         "dev": "vite",
         "build": "tsc && vite build",

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

@@ -36,6 +36,8 @@ export const EventSection = (theme)=>{
                   }
                 },
 
+
+                ////////////////////
                 {
                   widget: {
                     type: "Control",
@@ -49,7 +51,7 @@ export const EventSection = (theme)=>{
                         // color: "info",
                         onClick: "PasteEvent",
                         size: "small",
-                        icon: "SendIcon",
+                        icon: "PasteIcon",
                         iconLabel: "Paste",
                         styleDefault: true,
                       },
@@ -59,6 +61,9 @@ export const EventSection = (theme)=>{
                     },
                   }
                 },
+
+
+                //////////////////////////
               ]
             },  
             disableAction: true,
@@ -123,7 +128,7 @@ export const EventSection = (theme)=>{
             },
           },
 
-
+           ///////////////////////////////
           {
             header: "Copy",
             field: "Copy_Event",
@@ -145,6 +150,8 @@ export const EventSection = (theme)=>{
               },
             },
           },
+          
+          ////////////////////////////////
         ]
       }]}
       return uiSchema

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

@@ -36,7 +36,7 @@ export const TableSection = (theme) => {
                   }
                 },
 
-
+                /////////////////////////////////////////
                 {
                   widget: {
                     type: "Control",
@@ -50,7 +50,7 @@ export const TableSection = (theme) => {
                         // color: "info",
                         onClick: "PasteComponent",
                         size: "small",
-                        icon: "SendIcon",
+                        icon: "PasteIcon",
                         iconLabel: "Paste",
                         styleDefault: true,
                       },
@@ -60,6 +60,8 @@ export const TableSection = (theme) => {
                     },
                   }
                 },
+
+                /////////////////////////////////////////
               ]
             },
             disableAction: true,
@@ -122,7 +124,7 @@ export const TableSection = (theme) => {
             },
           },
 
-
+          ////////////////////////////////////////
           {
             header: "Copy",
             field: "Copy_Component",
@@ -139,10 +141,13 @@ export const TableSection = (theme) => {
                   // color: "error",
                   onClick: "CopyComponent",
                   styleDefault: true,
+                  disabled: false
                 },
               },
             },
           },
+
+          ///////////////////////////////////////
         ]
       }]
   }

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

@@ -341,7 +341,15 @@ export const ComponentSchema: any = {
     name: {
       type: "string",
     },
-    label: { type: 'string' }
+    label: { type: 'string' },
+
+    ////////////
+    RemoveItemButton:{
+      disabled: true,
+    },
+    Paste_Icon:{
+      disabled: true,
+    }
   },
 
   required: ["name",]

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

@@ -363,16 +363,65 @@ export const componentBasicUiSchema: any = (theme)=>{
             },
           },
         ]
-      },
+    },
+
+   //////////////////////////////////////
+
     {
-      type: "Control",
-      scope: "#/properties/EmptyBox",
-      options: {
-        widget: "EmptyBox",
-      },
+      type: "HorizontalLayout",
       config: {
-        layout: { xs: 4, sm: 8 },
+        layout:{xs:12,sm: 6}
       },
+      elements: [
+        {
+          type: "Control",
+          scope: "#/properties/RemoveItemButton",
+          options: {
+            widget: "IconButton",
+          },
+          config: {
+            layout: { xs: 1, sm: 1 },
+            main: {
+              onClick: "RemoveCopiedConfig",
+              size: "large",
+              icon: "RejectIcon",
+              styleDefault: true,
+            },
+            style:{
+              marginLeft: "-10px"
+            }
+          },
+        },
+
+        {
+          type: "Control",
+          scope: "#/properties/copiedElementDetails",
+    
+          options: {
+            widget: "Box",
+          },
+          config: {
+            layout: { xs: 6, sm: 6 },
+            main: {
+              heading: "No element copied",
+            },
+            style: {
+              color: "#a1a09d",
+              marginLeft: "-10px"
+            },
+          },
+        },
+        {
+          type: "Control",
+          scope: "#/properties/EmptyBox",
+          options: {
+            widget: "EmptyBox",
+          },
+          config: {
+            layout: { xs: 1, sm: 5 },
+          },
+        },
+      ]
     },
     {
       type: "Control",

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

@@ -40,7 +40,13 @@ export const PageMasterSchema  = {
             }
           },
         },
-      }
+      },
+    RemoveItemButton:{
+      disabled: true
+    },
+    Paste_Icon:{
+      disabled: true,
+    }
 },
 required:["template","name", "label"]
 }

package/src/impaktapps-ui-builder/builder/elements/UiSchema/PageMaster/uiSchema.ts

@@ -141,7 +141,7 @@ export const PageMasterUiSchema: any = (theme) => {
                             // color: "info",
                             onClick: "PasteComponent",
                             size: "small",
-                            icon: "SendIcon",
+                            icon: "PasteIcon",
                             iconLabel: "Paste",
                             styleDefault: true,
                           },
@@ -284,7 +284,7 @@ export const PageMasterUiSchema: any = (theme) => {
                             // color: "info",
                             onClick: "PasteEvent",
                             size: "small",
-                            icon: "SendIcon",
+                            icon: "PasteIcon",
                             iconLabel: "Paste",
                             styleDefault: true,
                           },
@@ -384,14 +384,60 @@ export const PageMasterUiSchema: any = (theme) => {
         ],
       },
       {
-        type: "Control",
-        scope: "#/properties/btn",
-        options: {
-          widget: "EmptyBox",
-        },
+        type: "HorizontalLayout",
         config: {
-          layout: { xs: 8, sm: 10 },
-        }
+          layout:{xs:12,sm: 6}
+        },
+        elements: [
+          {
+            type: "Control",
+            scope: "#/properties/RemoveItemButton",
+            options: {
+              widget: "IconButton",
+            },
+            config: {
+              layout: { xs: 1, sm: 1 },
+              main: {
+                onClick: "RemoveCopiedConfig",
+                size: "large",
+                icon: "RejectIcon",
+                styleDefault: true,
+              },
+              style:{
+                marginLeft: "-10px"
+              }
+            },
+          },
+  
+          {
+            type: "Control",
+            scope: "#/properties/copiedElementDetails",
+      
+            options: {
+              widget: "Box",
+            },
+            config: {
+              layout: { xs: 6, sm: 6 },
+              main: {
+                heading: "No element copied",
+              },
+              style: {
+                color: "#a1a09d",
+                marginLeft: "-10px"
+              },
+            },
+          },
+          {
+            type: "Control",
+            scope: "#/properties/EmptyBox",
+            options: {
+              widget: "EmptyBox",
+            },
+            config: {
+              layout: { xs: 1, sm: 5 },
+            },
+          },
+        ]
       },
       {
         type: "Control",

package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/uiSchema.ts

@@ -120,7 +120,7 @@ export const EventUiSchema: any = (theme) => {
                             // color: "info",
                             onClick: "PasteEvent",
                             size: "small",
-                            icon: "SendIcon",
+                            icon: "PasteIcon",
                             iconLabel: "Paste",
                             styleDefault: true,
                           },
@@ -217,14 +217,60 @@ export const EventUiSchema: any = (theme) => {
         ],
       },
       {
-        type: "Control",
-        scope: "#/properties/EmptyBox",
-        options: {
-          widget: "EmptyBox",
-        },
+        type: "HorizontalLayout",
         config: {
-          layout: { xs: 4, sm: 8 },
+          layout:{xs:12,sm: 6}
         },
+        elements: [
+          {
+            type: "Control",
+            scope: "#/properties/RemoveItemButton",
+            options: {
+              widget: "IconButton",
+            },
+            config: {
+              layout: { xs: 1, sm: 1 },
+              main: {
+                onClick: "RemoveCopiedConfig",
+                size: "large",
+                icon: "RejectIcon",
+                styleDefault: true,
+              },
+              style:{
+                marginLeft: "-10px"
+              }
+            },
+          },
+  
+          {
+            type: "Control",
+            scope: "#/properties/copiedElementDetails",
+      
+            options: {
+              widget: "Box",
+            },
+            config: {
+              layout: { xs: 6, sm: 6 },
+              main: {
+                heading: "No element copied",
+              },
+              style: {
+                color: "#a1a09d",
+                marginLeft: "-10px"
+              },
+            },
+          },
+          {
+            type: "Control",
+            scope: "#/properties/EmptyBox",
+            options: {
+              widget: "EmptyBox",
+            },
+            config: {
+              layout: { xs: 1, sm: 5 },
+            },
+          },
+        ]
       },
       {
         type: "Control",

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

@@ -1,4 +1,4 @@
-import _ from "lodash";
+import _, { cloneDeep } from "lodash";
 import { ComponentSchema } from "../elements/UiSchema/Component/schema";
 import { componentBasicUiSchema } from "../elements/UiSchema/Component/uiSchema";
 import { CoreSection } from "../build/uischema/coreSection";
@@ -60,6 +60,10 @@ export const refreshPage = (type: string, store: any) => {
     UiSchema.elements[1].elements = elements || [CoreSection, StyleSection, EventSection(store.theme.myTheme), ValidationSection];
 
   }
+  if (sessionStorage.getItem("copiedConfig") ) {
+    const formData = JSON.parse(sessionStorage.getItem("copiedConfig"));
+    UiSchema.elements[4].element[1].config.main.heading = `Copied Element: ${formData.name}`;
+  }
   store.setUiSchema(UiSchema);
 }
 
@@ -174,15 +178,37 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
     },
 
 
-    CopyComponent: function(){
-      const rowId = dynamicData.path.split(".")[1];
-      const parentPathOfCopiedComponent = store.searchParams?.get("path");
-      const copiedComponentPath = parentPathOfCopiedComponent ? `${parentPathOfCopiedComponent}.elements[${rowId}]`  : `elements[${rowId}]`;
-      const formData = getFormdataFromSessionStorage(copiedComponentPath);
-      sessionStorage.setItem('copiedConfig',JSON.stringify(formData));
+
+    
+    CopyComponent: function(store){
+      if (sessionStorage.getItem("copiedConfig") ) {
+        store.setNotify({
+          FailMessage: "Element already copied. Cancel to copy again.",
+          Fail: true,
+        });
+      }
+      else{
+        const schema = cloneDeep(store.schema);
+        const uiSchema = cloneDeep(store.uiSchema);
+        schema.properties.RemoveItemButton.disabled = false;
+       
+        const rowId = dynamicData.path.split(".")[1];
+        const parentPathOfCopiedComponent = store.searchParams?.get("path");
+        const copiedComponentPath = parentPathOfCopiedComponent ? `${parentPathOfCopiedComponent}.elements[${rowId}]`  : `elements[${rowId}]`;
+
+        const formData = getFormdataFromSessionStorage(copiedComponentPath);
+
+        uiSchema.elements[4].config.main.heading = `Copied Element: ${formData.name}`;
+
+        sessionStorage.setItem('copiedConfig',JSON.stringify(formData));
+
+        store.setSchema(schema);
+      }
     },
 
-    PasteComponent: function(){
+    PasteComponent: function(store){
+      // const schema = cloneDeep(store.schema);
+
       const path = store.searchParams?.get("path");
       const formData =  getFormdataFromSessionStorage(path)
       const insertComponentPath = formData.elements.length;
@@ -190,19 +216,20 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       const copiedData = JSON.parse(sessionStorage.getItem("copiedConfig"));
       if(!copiedData.elements){
         store.setNotify({
-          FailMessage: "Pasting not Valid",
+          FailMessage: "Pasting element not Valid",
           Fail: true,
         });
       }
       else{
         saveFormdataInSessionStorage(copiedData, finalPath);
         sessionStorage.removeItem('copiedConfig');
+
         this.setPage();
       }
     },
 
 
-    CopyEvent: function(){
+    CopyEvent: function(store){
       const rowId = dynamicData.path.split(".")[1];
       const path = store.searchParams?.get("path");
       const updatedPath = path ? `${path}.events[${rowId}]`  : `events[${rowId}]`;
@@ -211,7 +238,7 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       sessionStorage.setItem('copiedConfig',JSON.stringify(formData));
     },
 
-    PasteEvent: function(){
+    PasteEvent: function(store){
       const path = store.searchParams?.get("path");
       const formData =  getFormdataFromSessionStorage(path)
       const insertComponentPath = formData.events.length;

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

@@ -34,7 +34,12 @@ export default (funcParams: funcParamsProps) => {
       return config
     },
     getUiSchema: function () {
-      return PageMasterUiSchema(store.theme.myTheme);
+      const UiSchema = _.cloneDeep(PageMasterUiSchema(store.theme.myTheme));
+      if (sessionStorage.getItem("copiedConfig") ) {
+        const formData = JSON.parse(sessionStorage.getItem("copiedConfig"));
+        UiSchema.elements[2].element[1].config.main.heading = `Copied Element: ${formData.name}`;
+      }
+      return UiSchema;
     },
     getSchema: () => {
       return PageMasterSchema;
@@ -103,12 +108,29 @@ export default (funcParams: funcParamsProps) => {
     },
 
 
-    CopyComponent:  Component(store, dynamicData, submitHandler, service).CopyComponent,
+    CopyComponent:  function(){
+      Component(store, dynamicData, submitHandler, service).CopyComponent(store)
+    },
+    
+
+    PasteComponent: function(){
+      Component(store, dynamicData, submitHandler, service).PasteComponent(store)
+    },
+
+    RemoveItemButton: function(){
+
+    },
+    
 
-    PasteComponent: Component(store, dynamicData, submitHandler, service).PasteComponent,
+    CopyEvent: function(){
+      Component(store, dynamicData, submitHandler, service).CopyEvent(store)
+    },
 
-    CopyEvent: Component(store, dynamicData, submitHandler, service).CopyEvent, 
-    PasteEvent: Component(store, dynamicData, submitHandler, service).PasteEvent, 
+    
+    PasteEvent: function(){
+      Component(store, dynamicData, submitHandler, service).PasteEvent(store)
+    },
+     
 
 
     // CopyComponent: function(){