fix: implement elements whose children should always have lines between them

.vscode/settings.json

@@ -5,7 +5,7 @@
     "editor.formatOnPaste": false,
     "editor.formatOnType": false,
     "editor.codeActionsOnSave": {
-      "source.organizeImports": false
+      "source.organizeImports": "never"
     }
   }
 }

src/printer/elements.ts

@@ -68,6 +68,8 @@ export const blockElements: TagName[] = [
 	'html',
 ];
 
+export const breakChildrenElements: TagName[] = ['html', 'head', 'body', 'ul', 'ol', 'select'];
+
 /**
  * HTML attributes that we may safely reformat (trim whitespace, add or remove newlines)
  */

src/printer/index.ts

@@ -8,6 +8,7 @@ import {
 	getPreferredQuote,
 	getUnencodedText,
 	hasSetDirectives,
+	isBreakChildrenElement,
 	isEmptyTextNode,
 	isIgnoreDirective,
 	isInlineElement,
@@ -182,6 +183,8 @@ export function print(path: AstPath, opts: ParserOptions, print: printFn): Doc {
 					body = () => printRaw(node);
 				} else if (isInlineElement(path, opts, node) && !isPreTagContent(path)) {
 					body = () => path.map(print, 'children');
+				} else if (isBreakChildrenElement(node)) {
+					body = () => [breakParent, ...path.map(print, 'children')];
 				} else {
 					body = () => path.map(print, 'children');
 				}

src/printer/utils.ts

@@ -5,7 +5,12 @@ import {
 	type Doc,
 	type ParserOptions as ParserOpts,
 } from 'prettier';
-import { blockElements, formattableAttributes, type TagName } from './elements';
+import {
+	blockElements,
+	breakChildrenElements,
+	formattableAttributes,
+	type TagName,
+} from './elements';
 import type {
 	CommentNode,
 	ExpressionNode,
@@ -30,6 +35,10 @@ export function isInlineElement(path: AstPath, opts: ParserOptions, node: anyNod
 	return node && isTagLikeNode(node) && !isBlockElement(node, opts) && !isPreTagContent(path);
 }
 
+export function isBreakChildrenElement(node: anyNode): boolean {
+	return node && node.type === 'element' && breakChildrenElements.includes(node.name as TagName);
+}
+
 export function isBlockElement(node: anyNode, opts: ParserOptions): boolean {
 	return (
 		node &&
@@ -120,7 +129,7 @@ export function hasSetDirectives(node: TagLikeNode) {
  * no whitespace between the `>` and the first child.
  */
 export function shouldHugStart(node: anyNode, opts: ParserOptions): boolean {
-	if (isBlockElement(node, opts)) {
+	if (isBlockElement(node, opts) || isBreakChildrenElement(node)) {
 		return false;
 	}
 
@@ -142,7 +151,7 @@ export function shouldHugStart(node: anyNode, opts: ParserOptions): boolean {
  * no whitespace between the last child and the `</`.
  */
 export function shouldHugEnd(node: anyNode, opts: ParserOptions): boolean {
-	if (isBlockElement(node, opts)) {
+	if (isBlockElement(node, opts) || isBreakChildrenElement(node)) {
 		return false;
 	}