@tsrx/prettier-plugin 0.3.64 → 0.3.65

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsrx/prettier-plugin",
-  "version": "0.3.64",
+  "version": "0.3.65",
   "description": "Ripple plugin for Prettier",
   "type": "module",
   "module": "src/index.js",
@@ -27,7 +27,7 @@
     "prettier": "^3.8.3"
   },
   "dependencies": {
-    "@tsrx/core": "0.1.12"
+    "@tsrx/core": "0.1.13"
   },
   "files": [
     "src/"

package/src/index.js

@@ -1506,6 +1506,15 @@ function printRippleNode(node, path, options, print, args) {
 			break;
 		}
 
+		case 'TSSatisfiesExpression': {
+			nodeContent = [
+				path.call(print, 'expression'),
+				' satisfies ',
+				path.call(print, 'typeAnnotation'),
+			];
+			break;
+		}
+
 		case 'TSNonNullExpression': {
 			nodeContent = [path.call(print, 'expression'), '!'];
 			break;
@@ -1930,21 +1939,21 @@ function printRippleNode(node, path, options, print, args) {
 				(node.left.type === 'CallExpression' ||
 					node.left.type === 'ChainExpression' ||
 					node.left.type === 'NewExpression');
-			// Don't add indent if we're in a conditional test context
-			if (args?.isConditionalTest) {
+			if (shouldKeepNullishFallbackInline) {
 				logicalResult = group([
-					path.call((childPath) => print(childPath, { isConditionalTest: true }), 'left'),
+					path.call(print, 'left'),
 					' ',
 					node.operator,
-					[line, path.call((childPath) => print(childPath, { isConditionalTest: true }), 'right')],
+					' ',
+					path.call(print, 'right'),
 				]);
-			} else if (shouldKeepNullishFallbackInline) {
+			} else if (args?.isConditionalTest) {
+				// Don't add indent if we're in a conditional test context
 				logicalResult = group([
-					path.call(print, 'left'),
+					path.call((childPath) => print(childPath, { isConditionalTest: true }), 'left'),
 					' ',
 					node.operator,
-					' ',
-					path.call(print, 'right'),
+					[line, path.call((childPath) => print(childPath, { isConditionalTest: true }), 'right')],
 				]);
 			} else {
 				logicalResult = group([
@@ -2839,20 +2848,15 @@ function printArrowFunction(node, path, options, print, args) {
 		// to avoid ambiguity with block statements or to clarify intent
 		const bodyDoc = path.call(print, 'body');
 		const groupId = Symbol('arrow');
-		const shouldBreakBody = shouldBreakArrowExpressionBody(node.body, options);
+		const shouldBreakBody = shouldBreakArrowExpressionBody(node.body, options, args);
 		/** @type {Doc | Doc[]} */
 		let bodyContent;
 		if (
 			node.body.type === 'ObjectExpression' ||
 			node.body.type === 'AssignmentExpression' ||
-			node.body.type === 'SequenceExpression' ||
-			(args?.isInAttribute && isTemplateExpression(node.body))
+			node.body.type === 'SequenceExpression'
 		) {
-			if (isTemplateExpression(node.body)) {
-				bodyContent = ['(', indent([hardline, bodyDoc]), hardline, ')'];
-			} else {
-				bodyContent = ['(', bodyDoc, ')'];
-			}
+			bodyContent = ['(', bodyDoc, ')'];
 		} else {
 			bodyContent = bodyDoc;
 		}
@@ -2885,6 +2889,15 @@ function isTemplateExpression(node) {
 	);
 }
 
+/**
+ * Check whether a braced attribute expression should close on its own line.
+ * @param {AST.Node} node - The expression inside the attribute braces
+ * @returns {boolean}
+ */
+function shouldBreakAttributeExpressionClosingBrace(node) {
+	return node.type === 'ArrowFunctionExpression' && node.body && isTemplateExpression(node.body);
+}
+
 /**
  * Print an export default declaration
  * @param {AST.ExportDefaultDeclaration} node - The export default node
@@ -3095,9 +3108,13 @@ function sourceSpanExceedsPrintWidth(node, options) {
  * Check if an arrow expression body should break immediately after `=>`.
  * @param {AST.Expression} node - The arrow body expression
  * @param {RippleFormatOptions} options - Prettier options
+ * @param {PrintArgs} [args] - Additional context arguments
  * @returns {boolean}
  */
-function shouldBreakArrowExpressionBody(node, options) {
+function shouldBreakArrowExpressionBody(node, options, args) {
+	if (args?.isInAttribute && isTemplateExpression(node)) {
+		return true;
+	}
 	return (
 		(node.type === 'BinaryExpression' || node.type === 'LogicalExpression') &&
 		sourceSpanExceedsPrintWidth(/** @type {AST.NodeWithLocation} */ (node), options)
@@ -5778,7 +5795,7 @@ function printTsx(node, path, options, print) {
 		return [tagName, closingTagName];
 	}
 
-	if (printedChildren.length > 1) {
+	if (!is_fragment || printedChildren.length > 1) {
 		return group([
 			tagName,
 			indent([hardline, join(hardline, printedChildren)]),
@@ -6192,11 +6209,15 @@ function printJSXAttribute(attr, path, options, print) {
 	}
 
 	if (attr.value.type === 'JSXExpressionContainer') {
+		const expression = attr.value.expression;
 		const exprDoc = path.call(
 			(valuePath) => print(valuePath, { isInAttribute: true }),
 			'value',
 			'expression',
 		);
+		if (shouldBreakAttributeExpressionClosingBrace(expression)) {
+			return [name, '={', exprDoc, hardline, '}'];
+		}
 		return [name, '={', exprDoc, '}'];
 	}
 
@@ -6774,6 +6795,9 @@ function printAttribute(node, path, options, print) {
 			parts.push('={');
 			// Pass inline context for attribute values (keep objects compact)
 			parts.push(path.call((attrPath) => print(attrPath, { isInAttribute: true }), 'value'));
+			if (shouldBreakAttributeExpressionClosingBrace(node.value)) {
+				parts.push(hardline);
+			}
 			parts.push('}');
 		}
 	}

package/src/index.test.js

@@ -200,6 +200,58 @@ describe('prettier-plugin', () => {
 			expect(result).toBeWithNewline(expected);
 		});
 
+		it('should format explicit tsx arrow returns like tsrx blocks', async () => {
+			const input = `component Test(props) {
+	const func = (item) => <tsx><ItemView item={item} onSelect={props.onSelect} /></tsx>;
+
+	<List
+		items={props.items}
+		renderItem={(item) => <tsx><ItemView item={item} onSelect={props.onSelect} /></tsx>}
+	/>
+}`;
+			const expected = `component Test(props) {
+  const func = (item) => <tsx>
+    <ItemView item={item} onSelect={props.onSelect} />
+  </tsx>;
+
+  <List
+    items={props.items}
+    renderItem={(item) =>
+      <tsx>
+        <ItemView item={item} onSelect={props.onSelect} />
+      </tsx>
+    }
+  />
+}`;
+			const result = await format(input);
+			expect(result).toBeWithNewline(expected);
+		});
+
+		it('should format template arrow returns in tsx attributes like ripple attributes', async () => {
+			const input = `component Test(props) {
+	const view = <tsx>
+		<List
+			items={props.items}
+			renderItem={(item) => <tsx><ItemView item={item} onSelect={props.onSelect} /></tsx>}
+		/>
+	</tsx>;
+}`;
+			const expected = `component Test(props) {
+  const view = <tsx>
+    <List
+      items={props.items}
+      renderItem={(item) =>
+        <tsx>
+          <ItemView item={item} onSelect={props.onSelect} />
+        </tsx>
+      }
+    />
+  </tsx>;
+}`;
+			const result = await format(input);
+			expect(result).toBeWithNewline(expected);
+		});
+
 		it('should preserve comments before expressions after nested tsx and tsrx blocks', async () => {
 			const input = `component App() {
 	const content = <tsx>
@@ -255,7 +307,7 @@ describe('prettier-plugin', () => {
 }`,
 					expected: `component Test() {
   <A
-    fallback={(error) => (
+    fallback={(error) =>
       <>
         <B
           id="xyz"
@@ -265,7 +317,7 @@ describe('prettier-plugin', () => {
           otherProp={2}
         />
       </>
-    )}
+    }
   />
 }`,
 				},
@@ -279,7 +331,7 @@ describe('prettier-plugin', () => {
 }`,
 					expected: `component Test() {
   <A
-    fallback={(error) => (
+    fallback={(error) =>
       <tsx>
         <B
           id="xyz"
@@ -289,7 +341,7 @@ describe('prettier-plugin', () => {
           otherProp={2}
         />
       </tsx>
-    )}
+    }
   />
 }`,
 				},
@@ -303,7 +355,7 @@ describe('prettier-plugin', () => {
 }`,
 					expected: `component Test() {
   <A
-    fallback={(error) => (
+    fallback={(error) =>
       <tsrx>
         <B
           id="xyz"
@@ -313,7 +365,7 @@ describe('prettier-plugin', () => {
           otherProp={2}
         />
       </tsrx>
-    )}
+    }
   />
 }`,
 				},
@@ -327,7 +379,7 @@ describe('prettier-plugin', () => {
 }`,
 					expected: `component Test() {
   <A
-    fallback={(error) => (
+    fallback={(error) =>
       <tsx:react>
         <B
           id="xyz"
@@ -337,7 +389,7 @@ describe('prettier-plugin', () => {
           otherProp={2}
         />
       </tsx:react>
-    )}
+    }
   />
 }`,
 				},
@@ -1015,7 +1067,9 @@ import { Something, type Props, track } from 'ripple';`;
 const foo = <tsx><Bar {...props} /></tsx>;`;
 
 			const expected = `const props = {};
-const foo = <tsx><Bar {...props} /></tsx>;`;
+const foo = <tsx>
+  <Bar {...props} />
+</tsx>;`;
 
 			const result = await format(input, { singleQuote: true });
 			expect(result).toBeWithNewline(expected);
@@ -1393,6 +1447,18 @@ import { effect, track } from 'ripple';`;
 			expect(result).toBeWithNewline(expected);
 		});
 
+		it('keeps nullish fallback inline in a conditional test', async () => {
+			const input = `const test = menuRef.current?.querySelector<HTMLElement>('[role="menuitem"]:not([aria-disabled="true"])') ?? null ? a : b;`;
+			const expected = `const test =
+  menuRef.current?.querySelector<HTMLElement>(
+    '[role="menuitem"]:not([aria-disabled="true"])',
+  ) ?? null
+    ? a
+    : b;`;
+			const result = await format(input, { singleQuote: true });
+			expect(result).toBeWithNewline(expected);
+		});
+
 		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 !== '')) {
 }
@@ -2267,7 +2333,9 @@ files = [...(files ?? []), ...dt.files];`;
 
 			const expected = `class Foo {
   bar() {
-    return <tsx>{'Hello'}</tsx>;
+    return <tsx>
+      {'Hello'}
+    </tsx>;
   }
 }`;
 
@@ -2626,6 +2694,35 @@ component Child({ something }) {
 			expect(result).toBeWithNewline(expected);
 		});
 
+		it('prints satisfies expressions in switch default cases', async () => {
+			const input = `export component Test(props: { status: "ok" | "error" }) {
+  switch (props.status) {
+    case "ok":
+      <div>"ok"</div>
+      return
+    case "error":
+      <div>"error"</div>
+      return
+    default:
+      props.status satisfies never
+  }
+}`;
+			const expected = `export component Test(props: { status: "ok" | "error" }) {
+  switch (props.status) {
+    case "ok":
+      <div>"ok"</div>
+      return;
+    case "error":
+      <div>"error"</div>
+      return;
+    default:
+      props.status satisfies never;
+  }
+}`;
+			const result = await format(input);
+			expect(result).toBeWithNewline(expected);
+		});
+
 		it('prints function with a rest parameter correctly', async () => {
 			const expected = `function TestRest(...args: string[]) {
   console.log(args);