keep whitespace when merging @utility nodes

Author: RobinMalfait

integrations/cli/upgrade.test.ts

@@ -116,6 +116,7 @@ test(
           &::-webkit-scrollbar {
             display: none;
           }
+
           -ms-overflow-style: none;
           scrollbar-width: none
         }

packages/@tailwindcss-upgrade/src/codemods/migrate-at-layer-utilities.test.ts

@@ -399,6 +399,7 @@ it('should merge `@utility` definitions with the same name', async () => {
   ).toMatchInlineSnapshot(`
     "@utility step {
       counter-increment: step;
+
       &:before {
         @apply absolute w-7 h-7 bg-default-100 rounded-full font-medium text-center text-base inline-flex items-center justify-center -indent-px;
         @apply ml-[-41px];
@@ -477,6 +478,7 @@ it('should migrate advanced combinations', async () => {
           }
         }
       }
+
       @media (width >= 200px) {
         &:hover {
           @apply bg-red-500;
@@ -495,6 +497,7 @@ it('should migrate advanced combinations', async () => {
           }
         }
       }
+
       @media (width >= 100px) {
         color: red;
       }

packages/@tailwindcss-upgrade/src/codemods/migrate-at-layer-utilities.ts

@@ -222,9 +222,11 @@ export function migrateAtLayerUtilities(): Plugin {
       root.walkAtRules('utility', (node) => {
         let existing = nameToAtRule.get(node.params)
         if (existing) {
-          node.each((child) => {
-            existing.append(child)
-          })
+          // Add a newline between each `@utility` at-rule
+          if (node.first) {
+            node.first.raws.before = `\n${node.first?.raws.before ?? ''}`
+          }
+          existing.append(node.nodes ?? [])
           node.remove()
         } else {
           nameToAtRule.set(node.params, node)