ensure min height directly on the empty element, which automatically goes away once there is a node inside

app/canvas/features/wrapper-component/use-css.tsx

@@ -50,6 +50,8 @@ const emptyStyle = {
   "&:empty": {
     outline: "1px dashed #555",
     outlineOffset: -1,
+    paddingTop: "$8",
+    paddingRight: "$8",
   },
 };
 

app/shared/canvas-components/primitives/box.tsx

@@ -3,11 +3,6 @@ export { SquareIcon as Icon } from "~/shared/icons";
 
 // Webstudio specific default styles for the node type.
 export const defaultStyle: Style = {
-  minHeight: {
-    type: "unit",
-    unit: "px",
-    value: 100,
-  },
   boxSizing: {
     type: "keyword",
     value: "border-box",

app/shared/canvas-components/primitives/heading.tsx

@@ -2,13 +2,7 @@ import { type Style, components } from "@webstudio-is/sdk";
 export { HeadingIcon as Icon } from "~/shared/icons";
 
 // Webstudio specific default styles for the node type.
-export const defaultStyle: Style = {
-  minHeight: {
-    type: "unit",
-    unit: "em",
-    value: 1,
-  },
-};
+export const defaultStyle: Style = {};
 
 export const children = ["Heading you can edit"];
 

app/shared/canvas-components/primitives/paragraph.tsx

@@ -2,13 +2,7 @@ import { type Style, components } from "@webstudio-is/sdk";
 export { TextAlignLeftIcon as Icon } from "~/shared/icons";
 
 // Webstudio specific default styles for the node type.
-export const defaultStyle: Style = {
-  minHeight: {
-    type: "unit",
-    unit: "em",
-    value: 1,
-  },
-};
+export const defaultStyle: Style = {};
 
 export const children = ["Pragraph you can edit"];