@ripple-ts/prettier-plugin 0.2.213 → 0.2.215

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ripple-ts/prettier-plugin",
-  "version": "0.2.213",
+  "version": "0.2.215",
   "description": "Ripple plugin for Prettier",
   "type": "module",
   "module": "src/index.js",
@@ -11,7 +11,7 @@
     "ripple",
     "formatter"
   ],
-  "homepage": "https://ripplejs.com",
+  "homepage": "https://ripple-ts.com",
   "author": "Dominic Gannaway",
   "license": "MIT",
   "repository": {
@@ -26,8 +26,8 @@
   "devDependencies": {
     "@types/estree": "^1.0.8",
     "@types/estree-jsx": "^1.0.5",
-    "prettier": "^3.6.2",
-    "ripple": "0.2.213"
+    "prettier": "^3.8.1",
+    "ripple": "0.2.215"
   },
   "dependencies": {},
   "files": [

package/src/index.js

@@ -1505,6 +1505,11 @@ function printRippleNode(node, path, options, print, args) {
 			nodeContent = printMemberExpression(node, path, options, print);
 			break;
 
+		case 'MetaProperty':
+			// Prints import.meta, new.target, etc.
+			nodeContent = [path.call(print, 'meta'), '.', path.call(print, 'property')];
+			break;
+
 		case 'Super':
 			nodeContent = 'super';
 			break;
@@ -1917,7 +1922,25 @@ function printRippleNode(node, path, options, print, args) {
 						break;
 					}
 				}
-				nodeContent = '{}';
+
+				// Control flow statements (if, for, while, etc.) get expanded empty blocks
+				// to match standard Prettier behavior. Functions/methods keep `{}`.
+				const blockParent = path.getParentNode();
+				const isControlFlow =
+					blockParent &&
+					(blockParent.type === 'IfStatement' ||
+						blockParent.type === 'ForStatement' ||
+						blockParent.type === 'ForInStatement' ||
+						blockParent.type === 'ForOfStatement' ||
+						blockParent.type === 'WhileStatement' ||
+						blockParent.type === 'DoWhileStatement' ||
+						blockParent.type === 'SwitchCase');
+
+				if (isControlFlow) {
+					nodeContent = ['{', hardline, '}'];
+				} else {
+					nodeContent = '{}';
+				}
 				break;
 			}
 
@@ -2007,24 +2030,34 @@ function printRippleNode(node, path, options, print, args) {
 			nodeContent = result;
 			break;
 		}
-		case 'LogicalExpression':
+		case 'LogicalExpression': {
+			const logicalParent = path.getParentNode();
+			let logicalResult;
 			// Don't add indent if we're in a conditional test context
 			if (args?.isConditionalTest) {
-				nodeContent = group([
+				logicalResult = group([
 					path.call((childPath) => print(childPath, { isConditionalTest: true }), 'left'),
 					' ',
 					node.operator,
 					[line, path.call((childPath) => print(childPath, { isConditionalTest: true }), 'right')],
 				]);
 			} else {
-				nodeContent = group([
+				logicalResult = group([
 					path.call(print, 'left'),
 					' ',
 					node.operator,
 					indent([line, path.call(print, 'right')]),
 				]);
 			}
+
+			// Wrap in parentheses only if semantically necessary
+			if (binaryExpressionNeedsParens(node, logicalParent)) {
+				logicalResult = ['(', logicalResult, ')'];
+			}
+
+			nodeContent = logicalResult;
 			break;
+		}
 
 		case 'ConditionalExpression': {
 			// Use Prettier's grouping to handle line breaking when exceeding printWidth
@@ -3640,6 +3673,7 @@ function printDoWhileStatement(node, path, options, print) {
 	parts.push('while (');
 	parts.push(test);
 	parts.push(')');
+	parts.push(semi(options));
 
 	return parts;
 }
@@ -5923,6 +5957,53 @@ function printElement(node, path, options, print) {
 	const isSelfClosing = !!node.selfClosing;
 	const hasAttributes = Array.isArray(node.attributes) && node.attributes.length > 0;
 
+	// Collect comments that the parser attached to children but actually belong inside
+	// the opening tag (positionally before openingElement.end). These should be printed
+	// as leading comments before the appropriate attribute, not lifted to element-level.
+	const openingTagCommentsSet = new Set();
+	if (hasChildren && node.openingElement) {
+		const openingEnd = node.openingElement.end;
+		for (const child of node.children) {
+			if (
+				(child.type === 'Text' || child.type === 'Html') &&
+				Array.isArray(child.leadingComments)
+			) {
+				for (const comment of child.leadingComments) {
+					if (
+						typeof comment.start === 'number' &&
+						comment.start >= node.start &&
+						comment.start < openingEnd
+					) {
+						openingTagCommentsSet.add(comment);
+					}
+				}
+			}
+		}
+	}
+
+	// Build a map from attribute index to comments that should precede that attribute
+	const openingTagCommentsByAttrIndex = new Map();
+	if (openingTagCommentsSet.size > 0 && hasAttributes) {
+		const sortedOTC = [...openingTagCommentsSet].sort(
+			(a, b) => /** @type {number} */ (a.start) - /** @type {number} */ (b.start),
+		);
+		let commentIdx = 0;
+		for (let attrIdx = 0; attrIdx < node.attributes.length; attrIdx++) {
+			const attr = node.attributes[attrIdx];
+			const commentsForAttr = [];
+			while (
+				commentIdx < sortedOTC.length &&
+				/** @type {number} */ (sortedOTC[commentIdx].start) < attr.start
+			) {
+				commentsForAttr.push(sortedOTC[commentIdx]);
+				commentIdx++;
+			}
+			if (commentsForAttr.length > 0) {
+				openingTagCommentsByAttrIndex.set(attrIdx, commentsForAttr);
+			}
+		}
+	}
+
 	if (isSelfClosing && !hasInnerComments && !hasAttributes) {
 		const elementDoc = group(['<', tagName, ' />']);
 		return metadataCommentParts.length > 0 ? [...metadataCommentParts, elementDoc] : elementDoc;
@@ -5935,14 +6016,36 @@ function printElement(node, path, options, print) {
 
 	const shouldUseSelfClosingSyntax = isSelfClosing || (!hasChildren && !hasInnerComments);
 
+	const hasOpeningTagComments = openingTagCommentsSet.size > 0;
+	let attrIndex = 0;
 	const openingTag = group([
 		'<',
 		tagName,
 		hasAttributes
 			? indent([
 					...path.map((attrPath) => {
-						return [attrLineBreak, print(attrPath)];
+						const idx = attrIndex++;
+						const commentsForAttr = openingTagCommentsByAttrIndex.get(idx);
+						const parts = [];
+						if (commentsForAttr) {
+							for (const comment of commentsForAttr) {
+								// Line comments (//) consume the rest of the line, so they must
+								// use hardline to force a break. Block comments can use normal breaks.
+								if (comment.type === 'Line') {
+									parts.push(hardline);
+									parts.push('//' + comment.value);
+								} else if (comment.type === 'Block') {
+									parts.push(attrLineBreak);
+									parts.push('/*' + comment.value + '*/');
+								}
+							}
+						}
+						parts.push(attrLineBreak);
+						parts.push(print(attrPath));
+						return parts;
 					}, 'attributes'),
+					// Force the group to break when there are line comments in the opening tag
+					...(hasOpeningTagComments ? [breakParent] : []),
 				])
 			: '',
 		// Add line break opportunity before > or />
@@ -6045,7 +6148,11 @@ function printElement(node, path, options, print) {
 
 		if (hasTextLeadingComments) {
 			for (let j = 0; j < currentChild.leadingComments.length; j++) {
-				fallbackElementComments.push(currentChild.leadingComments[j]);
+				const comment = currentChild.leadingComments[j];
+				// Don't lift comments that belong inside the opening tag (handled in attribute section)
+				if (!openingTagCommentsSet.has(comment)) {
+					fallbackElementComments.push(comment);
+				}
 			}
 		}
 

package/src/index.test.js

@@ -269,6 +269,17 @@ export default component App() {
 			expect(formatted).toBeWithNewline(already_formatted);
 		});
 
+		it('should format import.meta expressions correctly', async () => {
+			const input = `export component Test(){if(import.meta.env.SSR){<div>{'Server'}</div>}}`;
+			const expected = `export component Test() {
+  if (import.meta.env.SSR) {
+    <div>{'Server'}</div>
+  }
+}`;
+			const result = await format(input, { singleQuote: true });
+			expect(result).toBeWithNewline(expected);
+		});
+
 		it('should format a component with an object property notation component markup', async () => {
 			const expected = `component Card(props) {
   <div class="card">
@@ -1017,7 +1028,8 @@ import { effect, track } from 'ripple';`;
 		});
 
 		it('does not add spaces around inlined array elements in destructured arguments', async () => {
-			const expected = `for (const [key, value] of Object.entries(attributes).filter(([_key, value]) => value !== '')) {}
+			const expected = `for (const [key, value] of Object.entries(attributes).filter(([_key, value]) => value !== '')) {
+}
 const [obj1, obj2] = arrayOfObjects;`;
 			const result = await format(expected, { singleQuote: true, printWidth: 100 });
 			expect(result).toBeWithNewline(expected);
@@ -2101,6 +2113,102 @@ files = [...(files ?? []), ...dt.files];`;
 			const result = await format(expected, { singleQuote: true, printWidth: 100 });
 			expect(result).toBeWithNewline(expected);
 		});
+
+		it('should preserve comments above attributes on dom elements', async () => {
+			const expected = `component App() {
+  <div
+    // @ripple-ignore
+    something="test"
+  >
+    {'test'}
+  </div>
+}`;
+
+			const result = await format(expected, { singleQuote: true, printWidth: 100 });
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('should preserve comments above attributes on components', async () => {
+			const expected = `component App() {
+  <Child
+    // @ripple-ignore
+    something="test"
+  >
+    {'test'}
+  </Child>
+}
+component Child({ something }) {
+  <div>{something}</div>
+}`;
+
+			const result = await format(expected, { singleQuote: true, printWidth: 100 });
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('keeps parens in place when necessary for logical reasons with && and || operators', async () => {
+			const expected = `function App() {
+  if ((e.metaKey || e.ctrlKey) && e.key === 'k') {
+  }
+}`;
+
+			const result = await format(expected, { singleQuote: true, printWidth: 100 });
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('expands empty braces to new lines for for-in statements', async () => {
+			const expected = `for (const key in obj) {
+}`;
+			const result = await format(expected);
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('expands empty braces to new lines for for statements', async () => {
+			const expected = `for (let i = 0; i < 10; i++) {
+}`;
+			const result = await format(expected);
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('expands empty braces to new lines for while statements', async () => {
+			const expected = `while (true) {
+}`;
+			const result = await format(expected);
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('expands empty braces to new lines for do-while statements', async () => {
+			const expected = `do {
+} while (true);`;
+			const result = await format(expected);
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('adds semicolon after do-while when semi option is true', async () => {
+			const input = `do { console.log('x') } while (true)`;
+			const expected = `do {
+  console.log("x");
+} while (true);`;
+			const result = await format(input);
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('omits semicolon after do-while when semi option is false', async () => {
+			const input = `do { console.log('x') } while (true);`;
+			const expected = `do {
+  console.log("x")
+} while (true)`;
+			const result = await format(input, { semi: false });
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('expands empty braces to new lines for switch case blocks', async () => {
+			const expected = `switch (x) {
+  case 1: {
+  }
+}`;
+			const result = await format(expected);
+			expect(result).toBeWithNewline(expected);
+		});
 	});
 
 	describe('edge cases', () => {
@@ -2767,8 +2875,10 @@ const obj2 = #{
 		const input = `for (const [i = 0, item] of items.entries()) {}
 for (const {i = 0, item} of items.entries()) {}`;
 
-		const expected = `for (const [i = 0, item] of items.entries()) {}
-for (const { i = 0, item } of items.entries()) {}`;
+		const expected = `for (const [i = 0, item] of items.entries()) {
+}
+for (const { i = 0, item } of items.entries()) {
+}`;
 
 		const result = await format(input);
 		expect(result).toBeWithNewline(expected);