fix: fixed default layout to match new grid

frontend/src/Editor/ConfigHandle.jsx

@@ -19,7 +19,7 @@ export const ConfigHandle = function ConfigHandle({
       className={`config-handle ${customClassName}`}
       ref={dragRef}
       style={{
-        top: position === 'top' ? '-22px' : widgetTop + widgetHeight - 10,
+        top: position === 'top' ? '-18px' : widgetTop + widgetHeight - 10,
       }}
     >
       <span

frontend/src/Editor/DragContainer.jsx

@@ -165,6 +165,8 @@ export default function DragContainer({
     };
   };
 
+  console.log('selectedComponents =>', [...selectedComponents]);
+
   const groupedTargets = [
     ...selectedComponents
       .filter((component) => !component?.component?.parent)
@@ -172,6 +174,14 @@ export default function DragContainer({
   ];
 
   console.log('groupedTargets-->', selectedComponents, groupedTargets);
+  console.log(
+    'groupedTargets-->target',
+    draggedSubContainer || (groupedTargets.length < 2 && selectedComponents.length > 1)
+      ? '.empty-widget'
+      : groupedTargets.length > 1
+      ? [...groupedTargets]
+      : '.widget-target'
+  );
 
   return (
     <div className="root">
@@ -207,7 +217,7 @@ export default function DragContainer({
           flushSync={flushSync}
           target={
             draggedSubContainer || (groupedTargets.length < 2 && selectedComponents.length > 1)
-              ? '.asdadadasdadad'
+              ? '.empty-widget'
               : groupedTargets.length > 1
               ? [...groupedTargets]
               : '.widget-target'
@@ -488,12 +498,16 @@ export default function DragContainer({
         {removeDuplicates(list)
           .filter((i) => !isEmpty(i.parent))
           .map((i) => {
-            const groupedTargets1 = [
+            let groupedTargets1 = [
               ...selectedComponents
                 .filter((component) => component?.component?.parent === i.parent)
                 .map((component) => '.ele-' + component.id),
             ];
-            console.log('groupedTargets1', groupedTargets1);
+            groupedTargets1 = [...new Set(groupedTargets1)];
+            console.log(
+              'groupedTargets-->target ' + i.parent,
+              groupedTargets1.length ? groupedTargets1 : `.target-${i.parent}`
+            );
             return (
               <Moveable
                 key={i.parent}

frontend/src/Editor/DraggableBox.jsx

@@ -227,12 +227,14 @@ export const DraggableBox = React.memo(
               'draggable-box-in-editor': mode === 'edit',
             })}
             onMouseEnter={(e) => {
+              console.log('TEST====>');
               if (e.currentTarget.className.includes(`widget-${id}`)) {
                 onComponentHover?.(id);
                 e.stopPropagation();
               }
             }}
             onMouseLeave={() => {
+              console.log('TEST====> mouseleace');
               setHoveredComponent('');
             }}
             style={getStyles(isDragging, isSelectedComponent)}

frontend/src/Editor/Editor.jsx

@@ -634,6 +634,7 @@ const EditorComponent = (props) => {
   };
 
   const onAreaSelectionEnd = (e) => {
+    console.log('selectedComponents =>onAreaSelectionEnd--->', e);
     setSelectionInProgress(false);
     e.selected.forEach((el, index) => {
       const id = el.getAttribute('widgetid');
@@ -2022,4 +2023,6 @@ const EditorComponent = (props) => {
   );
 };
 
+const getHighestParent = () => {};
+
 export const Editor = withTranslation()(withRouter(EditorComponent));

frontend/src/Editor/Inspector/Inspector.jsx

@@ -87,7 +87,9 @@ export const Inspector = ({
 
   useHotkeys('backspace', () => {
     if (isVersionReleased) return;
-    setWidgetDeleteConfirmation(true);
+    // setWidgetDeleteConfirmation(true);
+    switchSidebarTab(2);
+    removeComponent(component.id);
   });
   useHotkeys('escape', () => switchSidebarTab(2));
 

frontend/src/Editor/WidgetManager/widgetConfig.js

@@ -3799,7 +3799,7 @@ export const widgets = [
     displayName: 'List View',
     description: 'List multiple items',
     defaultSize: {
-      width: 20,
+      width: 30,
       height: 300,
     },
     defaultChildren: [
@@ -3807,7 +3807,7 @@ export const widgets = [
         componentName: 'Image',
         layout: {
           top: 15,
-          left: 6.976744186046512,
+          left: 3,
           height: 100,
         },
         properties: ['source'],
@@ -3817,7 +3817,7 @@ export const widgets = [
         componentName: 'Text',
         layout: {
           top: 50,
-          left: 27,
+          left: 11,
           height: 30,
         },
         properties: ['text'],
@@ -3827,7 +3827,7 @@ export const widgets = [
         componentName: 'Button',
         layout: {
           top: 50,
-          left: 60,
+          left: 26,
           height: 30,
         },
         incrementWidth: 2,