Merge branch 'dev' of https://techformsa.visualstudio.com/SmartConfigurator/_git/SVGLayoutDesignerReact into dev

src/Components/Editor/Actions/AddContainer.ts

@@ -121,7 +121,7 @@ function AddNewContainerToParent(
     throw new Error(`[AddContainer] Object type not found among default config. Found: ${type}`);
   }
 
-  const containerConfig = Object.assign(defaultConfig, availableContainer);
+  const containerConfig = Object.assign(structuredClone(defaultConfig), availableContainer);
 
   // Default margin
   const left: number = containerConfig.Margin?.left ?? 0;

src/Components/ElementsList/ElementsList.tsx

@@ -202,6 +202,7 @@ function ElementsListRow(
   for (let i = 0; i < depth; i++) {
     verticalBars.push(
       <span
+        key={`${key}-${i}`}
         className={`h-full border-l-2 pr-2 ${verticalBarSelectedClass}`}
       ></span>
     );
@@ -213,7 +214,7 @@ function ElementsListRow(
 
   return <button type="button"
     className={`transition-all border-blue-500 hover:shadow-lg elements-sidebar-row whitespace-pre
-          text-left text-sm font-medium inline-flex group ${container.properties.type} ${buttonSelectedClass}`}
+          text-left text-sm font-medium flex items-center align-middle group ${container.properties.type} ${buttonSelectedClass}`}
     id={key}
     key={key}
     style={style}
@@ -224,10 +225,8 @@ function ElementsListRow(
     onDragLeave={(event) => HandleDragLeave(event)}
   >
     {verticalBars}
-    <div className='pt-2 pb-2 inline-flex'>
-      {text}
-      {container.properties.warning.length > 0 &&
-        <ExclamationTriangleIcon className='pl-2 w-7' />}
-    </div>
+    {text}
+    {container.properties.warning.length > 0 &&
+      <ExclamationTriangleIcon className='pl-2 w-7' />}
   </button>;
 }