@saykit/transform-jsx 0.0.0-beta-20260728002240 → 0.0.0-beta-20260729112211

package/dist/generator.mjs

@@ -7,7 +7,7 @@ function generateSayJSXElement(message) {
 	const attributes = [
 		t.jsxAttribute(t.jsxIdentifier("id"), t.stringLiteral(id)),
 		...message.whitespace === void 0 ? [] : [t.jsxAttribute(t.jsxIdentifier("whitespace"), t.jsxExpressionContainer(t.booleanLiteral(message.whitespace)))],
-		...children.map(([k, e]) => t.jsxAttribute(t.jsxIdentifier(Number.isNaN(+k) ? k : `_${k}`), t.jsxExpressionContainer(e)))
+		...[...new Map(children).entries()].map(([k, e]) => t.jsxAttribute(t.jsxIdentifier(`_${k}`), t.jsxExpressionContainer(e)))
 	];
 	return t.jsxElement(t.jsxOpeningElement(t.jsxIdentifier("Say"), attributes, true), null, []);
 }

package/dist/index.mjs

@@ -1,5 +1,5 @@
 import { generateSayJSXElement } from "./generator.mjs";
-import { parseJSXElement } from "./parser.mjs";
+import { isEquivalentElement, parseJSXElement } from "./parser.mjs";
 import { generate } from "@babel/generator";
 import * as parser from "@babel/parser";
 import traverse_ from "@babel/traverse";
@@ -40,7 +40,7 @@ function createJsxTransformer() {
 					path.node.leadingComments = path.node.leadingComments ?? [];
 					const message = parseExpression(path.node);
 					if (message) {
-						assignSequenceIdentifiers(message, { current: 0 });
+						assignSequenceIdentifiers(message, { current: 0 }, isEquivalentElement);
 						messages.push(message);
 						path.skip();
 					}
@@ -49,7 +49,7 @@ function createJsxTransformer() {
 					path.node.leadingComments = path.node.leadingComments ?? [];
 					const message = parseJSXElement(path.node);
 					if (message) {
-						assignSequenceIdentifiers(message, { current: 0 });
+						assignSequenceIdentifiers(message, { current: 0 }, isEquivalentElement);
 						messages.push(message);
 						path.skip();
 					}
@@ -71,7 +71,7 @@ function createJsxTransformer() {
 					path.node.leadingComments = path.node.leadingComments ?? [];
 					const message = parseExpression(path.node);
 					if (message) {
-						assignSequenceIdentifiers(message, { current: 0 });
+						assignSequenceIdentifiers(message, { current: 0 }, isEquivalentElement);
 						const replacement = generateSayCallExpression(message);
 						path.replaceWith(replacement);
 						path.skip();
@@ -81,7 +81,7 @@ function createJsxTransformer() {
 					path.node.leadingComments = path.node.leadingComments ?? [];
 					const message = parseJSXElement(path.node);
 					if (message) {
-						assignSequenceIdentifiers(message, { current: 0 });
+						assignSequenceIdentifiers(message, { current: 0 }, isEquivalentElement);
 						const replacement = generateSayJSXElement(message);
 						path.replaceWith(replacement);
 						path.skip();

package/dist/parser.d.mts

@@ -5,5 +5,12 @@ declare function parseJSXContainerElement(element: t.JSXElement): CompositeMessa
 declare function parseJSXOpeningElement(element: t.JSXOpeningElement): CompositeMessage | null;
 declare function parseJSXElement(element: t.JSXElement, fallback?: false): CompositeMessage | null;
 declare function parseJSXElement(element: t.JSXElement, fallback: true): CompositeMessage | ElementMessage;
+/**
+ * Whether two elements sharing a tag are the same element, and so compile to
+ * one prop a translator can use interchangeably. `say-tag` has been stripped by
+ * the time this runs, so it compares the element name and the props left over,
+ * not the children: those come from the translation, not the source.
+ */
+declare function isEquivalentElement(a: any, b: any): boolean;
 //#endregion
-export { parseJSXContainerElement, parseJSXElement, parseJSXOpeningElement };
+export { isEquivalentElement, parseJSXContainerElement, parseJSXElement, parseJSXOpeningElement };

package/dist/parser.mjs

@@ -1,6 +1,13 @@
 import { AUTO_INCREMENT_IDENTIFIER, ArgumentMessage, ChoiceMessage, CompositeMessage, ElementMessage, LiteralMessage } from "@saykit/config/features/messages";
 import * as t from "@babel/types";
 //#region src/parser.ts
+/**
+* Attribute used to name the ICU tag an embedded element extracts as, e.g.
+* `<a say-tag="link">` becomes `<link></link>` rather than `<0></0>`. It never
+* reaches the real element.
+*/
+const TAG_ATTRIBUTE = "say-tag";
+const TAG_PATTERN = /^[A-Za-z_][A-Za-z0-9_]*$/;
 function parseJSXContainerElement(element) {
 	if (element.openingElement.selfClosing) return null;
 	const processed = processJSXOpeningElement(element.openingElement);
@@ -82,8 +89,37 @@ function parseJSXElement(element, fallback) {
 	const message = element.openingElement.selfClosing ? parseJSXOpeningElement(element.openingElement) : parseJSXContainerElement(element);
 	if (message) return message;
 	if (!fallback) return null;
-	if (element.openingElement.selfClosing) return new ElementMessage(AUTO_INCREMENT_IDENTIFIER, [], element);
-	return new ElementMessage(AUTO_INCREMENT_IDENTIFIER, [parseJSXElement(t.jsxElement(t.jsxOpeningElement(t.jsxIdentifier("Say"), []), t.jsxClosingElement(t.jsxIdentifier("Say")), element.children), true)], element);
+	const identifier = takeElementTag(element) ?? AUTO_INCREMENT_IDENTIFIER;
+	if (element.openingElement.selfClosing) return new ElementMessage(identifier, [], element);
+	return new ElementMessage(identifier, [parseJSXElement(t.jsxElement(t.jsxOpeningElement(t.jsxIdentifier("Say"), []), t.jsxClosingElement(t.jsxIdentifier("Say")), element.children), true)], element);
+}
+/**
+* Read the tag name off an embedded element and remove the attribute so it
+* never reaches the rendered element. Only static strings name a tag; anything
+* else is left in place and the element falls back to an auto-incremented
+* identifier.
+*/
+function takeElementTag(element) {
+	const attributes = element.openingElement.attributes;
+	const index = attributes.findIndex((a) => t.isJSXAttribute(a) && getAttributeNameAsString(a) === TAG_ATTRIBUTE);
+	if (index === -1) return void 0;
+	const attribute = attributes[index];
+	const value = t.isJSXExpressionContainer(attribute.value) ? attribute.value.expression : attribute.value;
+	if (!t.isStringLiteral(value)) return void 0;
+	const tag = value.value;
+	if (!TAG_PATTERN.test(tag)) throw new Error(`Invalid '${TAG_ATTRIBUTE}' value '${tag}', expected a letter or underscore followed by letters, digits, or underscores`);
+	attributes.splice(index, 1);
+	return tag;
+}
+/**
+* Whether two elements sharing a tag are the same element, and so compile to
+* one prop a translator can use interchangeably. `say-tag` has been stripped by
+* the time this runs, so it compares the element name and the props left over,
+* not the children: those come from the translation, not the source.
+*/
+function isEquivalentElement(a, b) {
+	if (!t.isJSXElement(a) || !t.isJSXElement(b)) return false;
+	return t.isNodesEquivalent(a.openingElement, b.openingElement);
 }
 function getReferences(node) {
 	if (!node.loc?.filename) return [];
@@ -124,4 +160,4 @@ function getExpressionAsIdentifier(node) {
 	return AUTO_INCREMENT_IDENTIFIER;
 }
 //#endregion
-export { parseJSXContainerElement, parseJSXElement, parseJSXOpeningElement };
+export { isEquivalentElement, parseJSXContainerElement, parseJSXElement, parseJSXOpeningElement };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saykit/transform-jsx",
-  "version": "0.0.0-beta-20260728002240",
+  "version": "0.0.0-beta-20260729112211",
   "description": "JSX and TSX source transformer for SayKit",
   "keywords": [
     "i18n",
@@ -47,8 +47,8 @@
     "@babel/parser": "^7.29.7",
     "@babel/traverse": "^7.29.7",
     "@babel/types": "^7.29.7",
-    "@saykit/config": "^0.0.0-beta-20260728002240",
-    "@saykit/transform-js": "^0.0.0-beta-20260728002240"
+    "@saykit/config": "^0.0.0-beta-20260729112211",
+    "@saykit/transform-js": "^0.0.0-beta-20260729112211"
   },
   "devDependencies": {
     "@babel/core": "^7.29.7",