better table action rendering

frontend/src/lib/components/apps/components/display/table/AppAggridTableActions.svelte

@@ -35,12 +35,14 @@
 
 	let rowDiv: HTMLDivElement | undefined = undefined
 
+	let visible = false
 	onMount(() => {
 		// apply w-full to the the parent of the parent of the rowDiv
 		if (rowDiv) {
 			const parent = rowDiv.parentElement?.parentElement?.parentElement
 			if (parent) {
 				parent.classList.add('w-full')
+				visible = true
 			} else {
 				//sometimes the parent is not available immediately
 				setTimeout(() => {
@@ -48,6 +50,7 @@
 					if (parent) {
 						parent.classList.add('w-full')
 					}
+					visible = true
 				}, 10)
 			}
 		}
@@ -62,8 +65,9 @@
 >
 	<div
 		class={twMerge(
-			'flex flex-row justify-center items-center gap-4 h-full px-4 py-1 w-full',
-			wrapActions ? 'flex-wrap' : ''
+			'flex flex-row justify-center items-center gap-4 h-full px-4 py-1 w-full transition-opacity duration-50',
+			wrapActions ? 'flex-wrap' : '',
+			visible ? 'opacity-100' : 'opacity-0'
 		)}
 		bind:this={rowDiv}
 	>

frontend/src/lib/components/apps/editor/settingsPanel/TableActions.svelte

@@ -52,6 +52,13 @@
 			recomputeIds: []
 		}
 
+		if (typ == 'buttoncomponent') {
+			if (newComponent?.configuration?.size) {
+				// @ts-ignore
+				newComponent.configuration.size = { type: 'static', value: 'xs2' }
+			}
+		}
+
 		items = [
 			...items,
 			{
@@ -70,6 +77,7 @@
 			return
 		}
 		components = components.filter((x) => x.id !== cid)
+		console.log('deleteComponent', cid, index, components, items)
 		delete $errorByComponent[cid]
 
 		$selectedComponent = [id]