@generaltranslation/vue-extractor 0.0.0 → 0.1.0-iris.0

package/dist/internal/script/jsx.js

@@ -1,9 +1,11 @@
-import { addVueError, babelLocation, createInlineMetadata, unwrapExpression } from "../utils.js";
+import { addVueError, applyStaticTMetadataValue, babelLocation, createInlineMetadata, normalizeTMetadataKey, unwrapExpression } from "../utils.js";
 import { isAcceptedPluralForm } from "generaltranslation/internal";
 import * as babel from "@babel/types";
 import { HTML_CONTENT_PROPS } from "@generaltranslation/format/types";
 import { isHTMLTag, isSVGTag } from "@vue/shared";
 //#region src/internal/script/jsx.ts
+/** Prevents source strings on opposite sides of a JSX comment from merging. */
+const jsxTextBoundary = Symbol("gt-vue-jsx-text-boundary");
 const RESERVED_T_PROPS = new Set(["key", "ref"]);
 const FORMAT_COMPONENTS = new Set([
 	"Currency",
@@ -28,10 +30,13 @@ const NON_BRANCH_PROP_NAMES = new Set([
 /**
 * Extracts one statically identified gt-vue `T` JSX element.
 *
-* This serializer follows the VNodes emitted by `@vue/babel-plugin-jsx`:
-* fragments are transparent, JSX text uses the plugin's normalization, and
-* arbitrary component slots remain opaque because gt-vue does not execute
-* user slots while calculating a source hash.
+* This serializer follows the VNodes emitted by `@vue/babel-plugin-jsx` while
+* preserving React's authoritative rich-source contract: authored Fragments
+* are semantic elements, explicit arrays retain array cardinality, JSX text
+* uses the plugin's normalization, and static custom-component default slots
+* participate in the same source tree as React component children. Runtime
+* values remain explicit variable boundaries and named component slots remain
+* outside the outer translation.
 */
 function extractVueJSXTranslation(path, context, analysis) {
 	if (analysis.customPragma) {
@@ -39,13 +44,13 @@ function extractVueJSXTranslation(path, context, analysis) {
 		return;
 	}
 	const errorCount = context.errors.length;
-	const translationContext = readTranslationContext(path.node.openingElement, path.scope, context, analysis);
-	const source = collapseChildren(serializeChildren(path.node.children, { value: 0 }, path.scope, context, analysis));
+	const translationMetadata = readTranslationMetadata(path.node.openingElement, path.scope, context, analysis);
+	const source = collapseRootChildren(serializeChildren(path.node.children, { value: 0 }, path.scope, context, analysis));
 	if (context.errors.length !== errorCount) return;
 	context.results.push({
 		dataFormat: "JSX",
 		source,
-		metadata: createInlineMetadata(context, babelLocation(path.node.loc), translationContext)
+		metadata: createInlineMetadata(context, babelLocation(path.node.loc), translationMetadata)
 	});
 }
 /** Returns whether the visitor is already covered by an outer serialized T. */
@@ -56,13 +61,26 @@ function isNestedInVueJSXTranslation(path, analysis) {
 			const element = current.node;
 			const identity = resolveElementIdentity(element.openingElement.name, current.scope, analysis);
 			const containingAttribute = findContainingJSXAttribute(path, current);
-			if (containingAttribute && !(identity?.type === "component" && (identity.name === "Branch" || identity.name === "Plural") && isSlotsAttribute(containingAttribute.node))) return false;
+			if (containingAttribute) {
+				if (!isSlotsAttribute(containingAttribute.node)) return false;
+				if (identity?.type === "component" && (identity.name === "Branch" || identity.name === "Plural")) {
+					current = current.parentPath;
+					continue;
+				}
+				if (identity?.type === "component" && (identity.name === "Var" || FORMAT_COMPONENTS.has(identity.name))) return false;
+				const slotName = readContainingJSXSlotName(path, containingAttribute, analysis);
+				if (slotName !== "default") return slotName === void 0;
+			}
+			if (!containingAttribute && identity?.type !== "component" && (identity?.type !== "vue-builtin" || usesFragmentComponentSlots(element.openingElement.name, identity))) {
+				if ((identity ? { component: true } : resolveOrdinaryElementShape(element.openingElement.name, current.scope, analysis, /* @__PURE__ */ new Set()))?.component) {
+					const objectSlot = readContainingJSXObjectSlotName(path, current, analysis);
+					if (objectSlot.present && objectSlot.name !== "default") return objectSlot.name === void 0;
+				}
+			}
 			if (identity?.type === "component") {
 				if (identity.name === "T") return true;
 				if (identity.name === "Var" || FORMAT_COMPONENTS.has(identity.name)) return false;
-			} else if (identity?.type === "vue-builtin" && (identity.name !== "Fragment" || isTransparentFragment(element.openingElement.name, identity))) {
-				if (identity.name === "Suspense" && containingAttribute && isSlotsAttribute(containingAttribute.node)) return false;
-			} else if (!isLiteralFragment(element.openingElement.name) && !isNativeElement(element.openingElement.name)) return false;
+			} else if (identity?.type === "vue-builtin" && (identity.name !== "Fragment" || isAuthoredFragment(element.openingElement.name, identity))) {}
 		}
 		current = current.parentPath;
 	}
@@ -80,6 +98,33 @@ function isSlotsAttribute(attribute) {
 	const name = readAttributeName(attribute.name);
 	return name === "v-slots" || name === "vSlots";
 }
+/** Returns the direct static slot key containing one nested JSX element. */
+function readContainingJSXSlotName(path, attribute, analysis) {
+	const expression = attribute.node.value?.type === "JSXExpressionContainer" && attribute.node.value.expression.type !== "JSXEmptyExpression" ? unwrapExpression(attribute.node.value.expression) : void 0;
+	if (expression?.type !== "ObjectExpression") return void 0;
+	let current = path.parentPath;
+	while (current && current.node !== expression) {
+		if (current.parentPath?.node === expression && (current.isObjectMethod() || current.isObjectProperty())) return readStaticObjectKey(current.node, attribute.scope, analysis);
+		current = current.parentPath;
+	}
+}
+/** Classifies a nested element inside Vue's object-child slot spelling. */
+function readContainingJSXObjectSlotName(path, element, analysis) {
+	const meaningfulChildren = element.node.children.filter(isMeaningfulJSXChild);
+	const child = meaningfulChildren[0];
+	if (meaningfulChildren.length !== 1 || child?.type !== "JSXExpressionContainer" || child.expression.type === "JSXEmptyExpression") return { present: false };
+	const object = unwrapExpression(child.expression);
+	if (object?.type !== "ObjectExpression") return { present: false };
+	let current = path.parentPath;
+	while (current && current.node !== object) {
+		if (current.parentPath?.node === object && (current.isObjectMethod() || current.isObjectProperty())) return {
+			name: readStaticObjectKey(current.node, element.scope, analysis),
+			present: true
+		};
+		current = current.parentPath;
+	}
+	return { present: false };
+}
 /** Resolves a JSX tag to the identity tracked by the script analyzer. */
 function resolveVueJSXElementIdentity(name, scope, analysis) {
 	return resolveElementIdentity(name, scope, analysis);
@@ -88,63 +133,81 @@ function resolveVueJSXElementIdentity(name, scope, analysis) {
 function validateVueJSXVariableComponent(element, component, context) {
 	validateVariableElement(element, component, context);
 }
-function readTranslationContext(element, scope, context, analysis) {
-	let translationContext;
-	let hasContext = false;
+function readTranslationMetadata(element, scope, context, analysis) {
+	const metadata = {};
+	const seen = /* @__PURE__ */ new Set();
 	for (const attribute of element.attributes) {
 		if (attribute.type === "JSXSpreadAttribute") {
-			addVueError(context, babelLocation(attribute.loc), "Found a spread prop on a gt-vue <T> component in JSX", "Pass context as one explicit static context or $context prop");
+			addVueError(context, babelLocation(attribute.loc), "Found a spread prop on a gt-vue <T> component in JSX", "Pass each metadata value through an explicit static prop");
 			continue;
 		}
 		const name = readAttributeName(attribute.name);
 		if (RESERVED_T_PROPS.has(name)) continue;
-		if (name !== "context" && name !== "$context") {
-			addVueError(context, babelLocation(attribute.loc), `Found unsupported prop "${name}" on a gt-vue <T> component`, "gt-vue <T> currently supports only context");
+		const key = normalizeTMetadataKey(name);
+		if (!key) {
+			addVueError(context, babelLocation(attribute.loc), `Found unsupported prop "${name}" on a gt-vue <T> component`, "Use only static context, id, maxChars, or requiresReview metadata");
 			continue;
 		}
-		if (hasContext) {
-			addVueError(context, babelLocation(attribute.loc), "Found duplicate context props on a gt-vue <T> component", "Pass only one context prop");
-			continue;
-		}
-		hasContext = true;
+		if (!registerJSXTMetadataKey(key, seen, babelLocation(attribute.loc), context)) continue;
 		const contextExpression = attribute.value?.type === "JSXExpressionContainer" && attribute.value.expression.type !== "JSXEmptyExpression" ? unwrapExpression(attribute.value.expression) : void 0;
-		if (contextExpression?.type === "ConditionalExpression" || contextExpression?.type === "LogicalExpression") {
+		if (key === "context" && (contextExpression?.type === "ConditionalExpression" || contextExpression?.type === "LogicalExpression")) {
 			addVueError(context, babelLocation(attribute.loc), "Found conditional context on a gt-vue <T> component", "Use one invariant static context string for this translation");
 			continue;
 		}
 		const value = readJSXAttributePrimitive(attribute, scope, analysis);
-		if (!value.ok || typeof value.value !== "string") {
-			addVueError(context, babelLocation(attribute.loc), "Found a dynamic context on a gt-vue <T> component", "Use a string literal or an immutable static string");
+		if (!value.ok || !applyStaticTMetadataValue(metadata, key, value.value)) {
+			addInvalidJSXTMetadataValueError(key, babelLocation(attribute.loc), context);
 			continue;
 		}
-		translationContext = value.value;
 	}
-	return translationContext;
+	return metadata;
+}
+function registerJSXTMetadataKey(key, seen, location, context) {
+	if (!seen.has(key)) {
+		seen.add(key);
+		return true;
+	}
+	addVueError(context, location, `Found duplicate ${key} props on a gt-vue <T> component`, `Pass only one ${key} prop or its $-prefixed alias`);
+	return false;
+}
+function addInvalidJSXTMetadataValueError(key, location, context) {
+	const expected = key === "context" || key === "id" ? "a static string" : key === "maxChars" ? "a static integer expression" : "a static boolean or a bare requiresReview prop";
+	addVueError(context, location, `Found an invalid or dynamic ${key} on a gt-vue <T> component`, `Use ${expected}`);
 }
 function serializeChildren(children, counter, scope, context, analysis) {
 	const result = [];
-	for (const child of children) for (const serialized of serializeChild(child, counter, scope, context, analysis)) appendSerializedChild(result, serialized);
-	return result;
+	const runtimeArgumentCount = children.filter(isJSXRuntimeChildArgument).length;
+	const preserveScalarWireLiteral = runtimeArgumentCount === 1;
+	for (const child of children) for (const serialized of serializeChild(child, counter, scope, context, analysis, preserveScalarWireLiteral)) appendSerializedChild(result, serialized);
+	return runtimeArgumentCount > 1 ? [{
+		kind: "array",
+		children: result
+	}] : result;
+}
+/** Whether the Vue JSX transform emits this authored node as a child value. */
+function isJSXRuntimeChildArgument(child) {
+	if (child.type === "JSXText") return normalizeJSXText(child.value) !== "";
+	return child.type !== "JSXExpressionContainer" || child.expression.type !== "JSXEmptyExpression";
 }
-function serializeChild(child, counter, scope, context, analysis) {
+function serializeChild(child, counter, scope, context, analysis, preserveScalarWireLiteral) {
 	if (child.type === "JSXText") {
 		const text = normalizeJSXText(child.value);
 		return text ? [text] : [];
 	}
 	if (child.type === "JSXElement") return serializeElement(child, counter, scope, context, analysis);
-	if (child.type === "JSXFragment") return serializeChildren(child.children, counter, scope, context, analysis);
+	if (child.type === "JSXFragment") return [serializeJSXFragment(child, counter, scope, context, analysis)];
 	if (child.type === "JSXSpreadChild") {
 		addVueError(context, babelLocation(child.loc), "Found a spread child inside a gt-vue <T> component in JSX", "Use static JSX children and wrap one runtime value in a gt-vue variable component");
 		return [];
 	}
-	if (child.expression.type === "JSXEmptyExpression") return [];
-	return serializeExpression(child.expression, counter, scope, context, analysis);
+	if (child.expression.type === "JSXEmptyExpression") return [jsxTextBoundary];
+	return serializeExpression(child.expression, counter, scope, context, analysis, preserveScalarWireLiteral);
 }
-function serializeExpression(input, counter, scope, context, analysis) {
+function serializeExpression(input, counter, scope, context, analysis, preserveScalarWireLiteral = true) {
 	const expression = unwrapExpression(input);
 	if (!expression) return [];
 	if (expression.type === "JSXElement") return serializeElement(expression, counter, scope, context, analysis);
-	if (expression.type === "JSXFragment") return serializeChildren(expression.children, counter, scope, context, analysis);
+	if (expression.type === "JSXFragment") return [serializeJSXFragment(expression, counter, scope, context, analysis)];
 	if (expression.type === "ArrayExpression") {
 		const result = [];
 		for (const item of expression.elements) {
@@ -153,9 +216,12 @@ function serializeExpression(input, counter, scope, context, analysis) {
 				addVueError(context, babelLocation(item.loc), "Found a spread array child inside a gt-vue <T> component in JSX", "List each static child explicitly");
 				continue;
 			}
-			for (const serialized of serializeExpression(item, counter, scope, context, analysis)) appendSerializedChild(result, serialized);
+			for (const serialized of serializeExpression(item, counter, scope, context, analysis, false)) appendSerializedChild(result, serialized);
 		}
-		return result;
+		return [{
+			kind: "array",
+			children: result
+		}];
 	}
 	if (expression.type === "ConditionalExpression" || expression.type === "LogicalExpression") {
 		addVueError(context, babelLocation(expression.loc), "Found conditional JSX content inside a gt-vue <T> component", "Move conditional content outside <T>, or use a static Branch or Plural component");
@@ -166,12 +232,13 @@ function serializeExpression(input, counter, scope, context, analysis) {
 		addVueError(context, babelLocation(expression.loc), "Found dynamic JSX content inside a gt-vue <T> component", "Wrap runtime values in <Var>, <Num>, <DateTime>, or <Currency>");
 		return [];
 	}
-	return value.value == null || typeof value.value === "boolean" ? [] : [String(value.value)];
+	if (value.value === null || typeof value.value === "boolean") return preserveScalarWireLiteral ? [value.value] : [];
+	return value.value === void 0 ? [] : [String(value.value)];
 }
 function serializeElement(element, counter, scope, context, analysis) {
 	const name = element.openingElement.name;
 	const identity = resolveElementIdentity(name, scope, analysis);
-	if (isTransparentFragment(name, identity)) return serializeChildren(element.children, counter, scope, context, analysis);
+	if (isAuthoredFragment(name, identity)) return serializeSemanticFragment(element, counter, scope, context, analysis, usesFragmentComponentSlots(name, identity));
 	counter.value += 1;
 	const id = counter.value;
 	const component = identity?.type === "component" ? identity.name : void 0;
@@ -203,19 +270,11 @@ function serializeElement(element, counter, scope, context, analysis) {
 	}
 	if (component === "Branch" || component === "Plural") return [serializeBranchElement(element, id, component, counter, scope, context, analysis)];
 	if (identity?.type === "vue-builtin" && identity.name === "Suspense") return [serializeSuspenseElement(element, id, counter, scope, context, analysis)];
-	if (identity?.type === "vue-builtin" && identity.name === "Fragment") {
-		addVueError(context, babelLocation(element.loc), "Found a renamed Vue Fragment binding inside a gt-vue JSX translation", "Use <>, literal <Fragment>, or a Vue namespace member such as <Vue.Fragment>; the Vue JSX transform compiles renamed Fragment bindings as component slots");
-		return [];
-	}
-	if (identity?.type === "vue-builtin") {
-		addVueError(context, babelLocation(element.loc), `Found unsupported Vue <${identity.name}> content inside a gt-vue JSX translation`, "Move this Vue builtin outside <T>");
-		return [];
-	}
 	if (!identity && isUnboundNonNativeElement(name, scope)) {
 		addVueError(context, babelLocation(element.loc), `Could not determine whether JSX tag <${readElementDisplayName(name) ?? "unknown"}> is a component or custom element`, "Import or locally bind the component, or move the configured custom element outside <T>");
 		return [];
 	}
-	const ordinaryShape = identity ? void 0 : resolveOrdinaryElementShape(name, scope, analysis, /* @__PURE__ */ new Set());
+	const ordinaryShape = identity ? { component: true } : resolveOrdinaryElementShape(name, scope, analysis, /* @__PURE__ */ new Set());
 	if (!identity && !ordinaryShape) {
 		addVueError(context, babelLocation(element.loc), `Could not statically resolve whether JSX tag <${readElementDisplayName(name) ?? "unknown"}> renders an element or component`, "Use a native tag, imported component, defineComponent result, or an immutable tag expression that cannot switch between element and component shapes");
 		return [];
@@ -226,19 +285,115 @@ function serializeElement(element, counter, scope, context, analysis) {
 		addVueError(context, babelLocation(element.loc), "Found unsupported namespaced JSX syntax inside a gt-vue <T> component", "Use a native element or a statically imported component");
 		return [];
 	}
-	if (ordinaryShape?.opaque) return [{
+	const childResult = ordinaryShape?.component ? serializeOrdinaryComponentDefault(element, counter, scope, context, analysis) : { children: serializeChildren(element.children, counter, scope, context, analysis) };
+	return [{
 		t: tag,
 		i: id,
-		...Object.keys(data).length > 0 && { d: data }
+		...Object.keys(data).length > 0 && { d: data },
+		...shouldIncludeElementChildren(element, childResult.children, scope, analysis, childResult.slotTruthy) && { c: collapseChildren(childResult.children) }
 	}];
-	const children = serializeChildren(element.children, counter, scope, context, analysis);
+}
+/** Serializes the shorthand `<>...</>` spelling as React.Fragment semantics. */
+function serializeJSXFragment(fragment, counter, scope, context, analysis) {
+	counter.value += 1;
+	const id = counter.value;
+	const children = serializeChildren(fragment.children, counter, scope, context, analysis);
+	return {
+		t: `C${id}`,
+		i: id,
+		...hasTruthyJSXChildren(fragment.children, scope, analysis) && { c: collapseChildren(children) }
+	};
+}
+/** Serializes a Fragment alias that Vue JSX represents as a component slot. */
+function serializeSemanticFragment(element, counter, scope, context, analysis, usesComponentSlots) {
+	counter.value += 1;
+	const id = counter.value;
+	validateElementAttributes(element.openingElement, scope, context, analysis);
+	const data = readContentProps(element.openingElement, scope, context, analysis);
+	const childResult = usesComponentSlots ? serializeOrdinaryComponentDefault(element, counter, scope, context, analysis) : { children: serializeChildren(element.children, counter, scope, context, analysis) };
 	return [{
-		t: tag,
+		t: `C${id}`,
 		i: id,
 		...Object.keys(data).length > 0 && { d: data },
-		...children.length > 0 && { c: collapseChildren(children) }
+		...shouldIncludeElementChildren(element, childResult.children, scope, analysis, childResult.slotTruthy) && { c: collapseChildren(childResult.children) }
 	}];
 }
+/** Serializes the authored default slot of an ordinary component VNode. */
+function serializeOrdinaryComponentDefault(element, counter, scope, context, analysis) {
+	const slotAttributes = element.openingElement.attributes.filter((attribute) => attribute.type === "JSXAttribute" && isSlotsAttribute(attribute));
+	if (slotAttributes.length > 1) addVueError(context, babelLocation(slotAttributes[1].loc), "Found more than one v-slots prop on a component inside a gt-vue JSX translation", "Pass one static slots object");
+	const meaningfulChildren = element.children.filter(isMeaningfulJSXChild);
+	const objectSlotChild = slotAttributes.length === 0 && meaningfulChildren.length === 1 && meaningfulChildren[0]?.type === "JSXExpressionContainer" && meaningfulChildren[0].expression.type !== "JSXEmptyExpression" ? analysis.resolveStaticObject(meaningfulChildren[0].expression, scope) : void 0;
+	const slotsObject = slotAttributes[0] ? readSlotsAttributeObject(slotAttributes[0], scope, context, analysis, "a component inside a gt-vue JSX translation") : objectSlotChild;
+	const defaultSlot = slotsObject ? readOrdinaryDefaultSlot(slotsObject, context, analysis) : { present: false };
+	if (defaultSlot.present) return defaultSlot.slot ? serializeSlotFunction(defaultSlot.slot, counter, context, analysis) : {
+		children: [],
+		slotTruthy: false
+	};
+	const directSlot = readDirectOrdinaryDefaultSlot(element, scope, context, analysis);
+	if (directSlot.present) return directSlot.slot ? serializeSlotFunction(directSlot.slot, counter, context, analysis) : {
+		children: [],
+		slotTruthy: false
+	};
+	if (objectSlotChild) return {
+		children: [],
+		slotTruthy: false
+	};
+	return { children: serializeChildren(element.children, counter, scope, context, analysis) };
+}
+/** Reads the one-function child Vue JSX compiles as a direct default slot. */
+function readDirectOrdinaryDefaultSlot(element, scope, context, analysis) {
+	const children = element.children.filter(isMeaningfulJSXChild);
+	if (children.length !== 1 || children[0]?.type !== "JSXExpressionContainer" || children[0].expression.type === "JSXEmptyExpression") return { present: false };
+	const value = unwrapExpression(children[0].expression);
+	if (!value || value.type !== "ArrowFunctionExpression" && value.type !== "FunctionExpression") return { present: false };
+	if (value.params.length > 0 || value.async || value.generator) {
+		addVueError(context, babelLocation(value.loc), "Found a dynamic or scoped direct default slot on a component inside a gt-vue JSX translation", "Use a synchronous zero-argument function with static returned content");
+		return { present: true };
+	}
+	return {
+		present: true,
+		slot: {
+			node: value,
+			scope: analysis.scopeForNode(value, scope)
+		}
+	};
+}
+/** Reads only the default entry; named slots remain runtime-owned and opaque. */
+function readOrdinaryDefaultSlot(object, context, analysis) {
+	let present = false;
+	let slot;
+	for (const property of object.node.properties) {
+		if (property.type === "SpreadElement") {
+			addVueError(context, babelLocation(property.loc), "Found a spread in a component slots object inside a gt-vue JSX translation", "List the static default slot explicitly so a spread cannot add or replace it");
+			continue;
+		}
+		const name = readStaticObjectKey(property, object.scope, analysis);
+		if (name === void 0) {
+			addVueError(context, babelLocation(property.loc), "Found a dynamic slot name on a component inside a gt-vue JSX translation", "Use a static named slot or an explicit default key");
+			continue;
+		}
+		if (name !== "default") continue;
+		if (present) {
+			addVueError(context, babelLocation(property.loc), "Found duplicate default slots on a component inside a gt-vue JSX translation", "Define the default slot once");
+			continue;
+		}
+		present = true;
+		const value = property.type === "ObjectMethod" && property.kind === "method" ? property : property.type === "ObjectProperty" ? unwrapExpression(property.value) : void 0;
+		if (!value || value.type !== "ArrowFunctionExpression" && value.type !== "FunctionExpression" && value.type !== "ObjectMethod" || value.params.length > 0 || value.async || value.generator) {
+			addVueError(context, babelLocation(property.loc), "Found a dynamic or scoped default slot on a component inside a gt-vue JSX translation", "Use a synchronous zero-argument function with static returned content");
+			continue;
+		}
+		slot = {
+			node: value,
+			scope: analysis.scopeForNode(value, object.scope)
+		};
+	}
+	return {
+		present,
+		...slot && { slot }
+	};
+}
 /**
 * Serializes Vue Suspense's normalized default content without evaluating its
 * fallback. Vue requires that default slot to resolve to one VNode root; an
@@ -257,13 +412,13 @@ function serializeSuspenseElement(element, id, counter, scope, context, analysis
 	}
 	if (slots.defaultSlot) validateSuspenseSlotRoot(slots.defaultSlot, element, context);
 	else validateSuspenseImplicitRoot(slots.defaultChildren, element, context);
-	const children = slots.defaultSlot ? serializeSlotFunction(slots.defaultSlot, counter, context, analysis) : serializeChildren(slots.defaultChildren, counter, scope, context, analysis);
+	const childResult = slots.defaultSlot ? serializeSlotFunction(slots.defaultSlot, counter, context, analysis) : { children: serializeChildren(slots.defaultChildren, counter, scope, context, analysis) };
 	const data = readContentProps(element.openingElement, scope, context, analysis);
 	return {
 		t: "Suspense",
 		i: id,
 		...Object.keys(data).length > 0 && { d: data },
-		...children.length > 0 && { c: collapseChildren(children) }
+		...shouldIncludeElementChildren(element, childResult.children, scope, analysis, childResult.slotTruthy) && { c: collapseChildren(childResult.children) }
 	};
 }
 /** Reads the unambiguous one-function JSX spelling for a default slot. */
@@ -314,12 +469,14 @@ function addSuspenseRootError(element, context) {
 function serializeBranchElement(element, id, component, counter, scope, context, analysis) {
 	const slots = readJSXSlotLayout(element, scope, context, analysis);
 	if (component === "Plural" && !hasExplicitAttribute(element.openingElement, "n")) addVueError(context, babelLocation(element.openingElement.loc), "Found a gt-vue <Plural> component without an n prop", "Pass the numeric selector through <Plural n={count} />");
-	const children = slots.defaultSlot ? serializeSlotFunction(slots.defaultSlot, counter, context, analysis) : serializeChildren(slots.defaultChildren, counter, scope, context, analysis);
+	const childResult = slots.defaultSlot ? serializeSlotFunction(slots.defaultSlot, counter, context, analysis) : { children: serializeChildren(slots.defaultChildren, counter, scope, context, analysis) };
 	const branches = {};
 	for (const [name, slot] of slots.namedSlots) {
 		if (name.startsWith("_")) continue;
 		if (component === "Plural" && !isAcceptedPluralForm(name)) continue;
-		branches[name] = collapseChildren(serializeSlotFunction(slot, { value: id }, context, analysis));
+		const result = serializeSlotFunction(slot, { value: id }, context, analysis);
+		if (result.slotAbsent) continue;
+		branches[name] = collapseChildren(result.children);
 	}
 	readBranchAttributeSources(element.openingElement, component, branches, scope, context, analysis);
 	const data = readContentProps(element.openingElement, scope, context, analysis);
@@ -331,7 +488,7 @@ function serializeBranchElement(element, id, component, counter, scope, context,
 		t: component,
 		i: id,
 		...Object.keys(data).length > 0 && { d: data },
-		...children.length > 0 && { c: collapseChildren(children) }
+		...shouldIncludeElementChildren(element, childResult.children, scope, analysis, childResult.slotTruthy) && { c: collapseChildren(childResult.children) }
 	};
 }
 /** Reconstructs the slots object emitted by the Vue JSX transform. */
@@ -392,9 +549,53 @@ function serializeSlotFunction(slot, counter, context, analysis) {
 	const returned = readStaticSlotReturn(slot);
 	if (!returned) {
 		addVueError(context, babelLocation(slot.node.loc), "Found a JSX slot with a dynamic function body in a gt-vue translation", "Return static slot content directly from the zero-argument function");
-		return [];
+		return {
+			children: [],
+			slotTruthy: false
+		};
+	}
+	const value = unwrapExpression(returned);
+	if (!value) return {
+		children: [],
+		slotTruthy: false
+	};
+	if (value.type !== "ArrayExpression") return {
+		children: serializeExpression(value, counter, slot.scope, context, analysis, true),
+		...isUndefinedSlotChild(value, slot.scope, analysis) && { slotAbsent: true },
+		slotTruthy: isTruthySlotChild(value, slot.scope, analysis)
+	};
+	const children = [];
+	const entries = value.elements.filter((entry) => entry !== null);
+	for (const entry of entries) {
+		if (entry.type === "SpreadElement") {
+			addVueError(context, babelLocation(entry.loc), "Found a spread in a JSX slot return inside a gt-vue translation", "Return a static list of slot children");
+			continue;
+		}
+		for (const child of serializeExpression(entry, counter, slot.scope, context, analysis, entries.length === 1)) appendSerializedChild(children, child);
 	}
-	return serializeExpression(returned, counter, slot.scope, context, analysis);
+	return {
+		children: entries.length > 1 ? [{
+			kind: "array",
+			children
+		}] : children,
+		...entries.length === 1 && entries[0].type !== "SpreadElement" && isUndefinedSlotChild(entries[0], slot.scope, analysis) && { slotAbsent: true },
+		slotTruthy: entries.length > 1 || entries.length === 1 && entries[0].type !== "SpreadElement" && isTruthySlotChild(entries[0], slot.scope, analysis)
+	};
+}
+/** Matches Vue's absent named-slot result without collapsing an authored array. */
+function isUndefinedSlotChild(input, scope, analysis) {
+	const expression = unwrapExpression(input);
+	if (!expression || expression.type === "ArrayExpression") return false;
+	const primitive = analysis.readStaticPrimitive(expression, scope);
+	return primitive.ok && primitive.value === void 0;
+}
+/** Mirrors React's `props.children` truthiness for one normalized slot entry. */
+function isTruthySlotChild(input, scope, analysis) {
+	const expression = unwrapExpression(input);
+	if (!expression) return false;
+	if (expression.type === "ArrayExpression" || expression.type === "JSXElement" || expression.type === "JSXFragment") return true;
+	const primitive = analysis.readStaticPrimitive(expression, scope);
+	return primitive.ok ? Boolean(primitive.value) : true;
 }
 /** Returns the expression from a slot body that contains only one return. */
 function readStaticSlotReturn(slot) {
@@ -430,9 +631,23 @@ function readBranchAttributeSources(element, component, branches, scope, context
 			addVueError(context, babelLocation(attribute.loc), `Found dynamic branch prop "${name}" on a gt-vue <${component}> component`, "Use a static primitive branch prop or a static named slot");
 			continue;
 		}
-		branches[name] = value.value == null || typeof value.value === "boolean" ? [] : String(value.value);
+		if (value.value === void 0) continue;
+		branches[name] = serializeBranchAttributePrimitive(value.value);
 	}
 }
+/**
+* Serializes one direct branch prop without applying Vue child normalization.
+*
+* Vue renders boolean and null VNode children empty, but React and gt-vue
+* preserve those direct prop values in the persisted branch wire format. The
+* shared `JsxChildren` type predates those values, so the cast stays confined
+* to this exact catalog boundary. Other primitives retain the established
+* string representation.
+*/
+function serializeBranchAttributePrimitive(value) {
+	if (value === null || typeof value === "boolean") return value;
+	return String(value);
+}
 function isBranchPropName(name) {
 	return !(NON_BRANCH_PROP_NAMES.has(name) || name.startsWith("aria-") || name.startsWith("data-") || /^on[^a-z]/.test(name));
 }
@@ -465,6 +680,7 @@ function validateVariableElement(element, component, context) {
 		return;
 	}
 	if (!explicitProps.has("value")) addVueError(context, babelLocation(element.openingElement.loc), `Found a gt-vue <${component}> component without a value prop`, `Pass the runtime value through <${component} value={value} />`);
+	if (explicitProps.has("name")) addVueError(context, babelLocation(element.openingElement.loc), `Found unsupported name prop on a gt-vue <${component}> component`, "Remove name; named variables are not supported by gt-vue yet");
 	if (hasMeaningfulChildren(element.children)) addVueError(context, babelLocation(element.loc), `Found children on a gt-vue <${component}> component`, `Use only the required value prop: <${component} value={value} />`);
 }
 function hasMeaningfulChildren(children) {
@@ -528,6 +744,7 @@ function readJSXAttributePrimitive(attribute, scope, analysis) {
 	return analysis.readStaticPrimitive(attribute.value.expression, scope);
 }
 function resolveElementIdentity(name, scope, analysis) {
+	if (isNativeElement(name)) return void 0;
 	const expression = jsxNameToExpression(name);
 	return expression ? analysis.resolveKnownValue(expression, scope) : void 0;
 }
@@ -545,9 +762,13 @@ function jsxMemberObjectToExpression(object) {
 function isLiteralFragment(name) {
 	return name.type === "JSXIdentifier" && name.name === "Fragment";
 }
-/** Matches only Fragment spellings the Vue JSX transform keeps transparent. */
-function isTransparentFragment(name, identity) {
-	return isLiteralFragment(name) || identity?.type === "vue-builtin" && identity.name === "Fragment" && name.type === "JSXMemberExpression" && name.property.name === "Fragment";
+/** Matches Fragment spellings that create a semantic authored boundary. */
+function isAuthoredFragment(name, identity) {
+	return isLiteralFragment(name) || identity?.type === "vue-builtin" && identity.name === "Fragment";
+}
+/** Detects Fragment aliases the JSX transform compiles through component slots. */
+function usesFragmentComponentSlots(name, identity) {
+	return identity?.type === "vue-builtin" && identity.name === "Fragment" && !isLiteralFragment(name) && !(name.type === "JSXMemberExpression" && name.property.name === "Fragment");
 }
 /** Detects tags whose VNode type can change with plugin `isCustomElement`. */
 function isUnboundNonNativeElement(name, scope) {
@@ -560,10 +781,10 @@ function isUnboundNonNativeElement(name, scope) {
 function isNativeElement(name) {
 	return name.type === "JSXIdentifier" && (isHTMLTag(name.name) || isSVGTag(name.name));
 }
-/** Proves whether a non-GT JSX tag is traversable or slot-opaque. */
+/** Proves whether a non-GT JSX tag is an element or component VNode. */
 function resolveOrdinaryElementShape(name, scope, analysis, seen) {
 	if (isNativeElement(name)) return {
-		opaque: false,
+		component: false,
 		tag: name.name
 	};
 	if (name.type === "JSXNamespacedName") return void 0;
@@ -571,11 +792,11 @@ function resolveOrdinaryElementShape(name, scope, analysis, seen) {
 		let root = name.object;
 		while (root.type === "JSXMemberExpression") root = root.object;
 		const binding = scope.getBinding(root.name);
-		return binding?.path.isImportSpecifier() || binding?.path.isImportDefaultSpecifier() || binding?.path.isImportNamespaceSpecifier() ? { opaque: true } : void 0;
+		return binding?.path.isImportSpecifier() || binding?.path.isImportDefaultSpecifier() || binding?.path.isImportNamespaceSpecifier() ? { component: true } : void 0;
 	}
 	const binding = scope.getBinding(name.name);
 	if (!binding) return void 0;
-	if (binding.path.isImportSpecifier() || binding.path.isImportDefaultSpecifier() || binding.path.isImportNamespaceSpecifier() || binding.path.isFunctionDeclaration() || binding.path.isClassDeclaration()) return { opaque: true };
+	if (binding.path.isImportSpecifier() || binding.path.isImportDefaultSpecifier() || binding.path.isImportNamespaceSpecifier() || binding.path.isFunctionDeclaration() || binding.path.isClassDeclaration()) return { component: true };
 	const declaration = binding.path.node;
 	return declaration.type === "VariableDeclarator" && declaration.init ? resolveOrdinaryElementExpression(declaration.init, binding.path.scope, analysis, seen) : void 0;
 }
@@ -587,21 +808,21 @@ function resolveOrdinaryElementExpression(input, scope, analysis, seen) {
 	nextSeen.add(expression);
 	const primitive = analysis.readStaticPrimitive(expression, scope);
 	if (primitive.ok) return typeof primitive.value === "string" ? {
-		opaque: false,
+		component: false,
 		tag: primitive.value
 	} : void 0;
-	if (expression.type === "ArrowFunctionExpression" || expression.type === "FunctionExpression" || expression.type === "ClassExpression" || expression.type === "ObjectExpression") return { opaque: true };
+	if (expression.type === "ArrowFunctionExpression" || expression.type === "FunctionExpression" || expression.type === "ClassExpression" || expression.type === "ObjectExpression") return { component: true };
 	if (expression.type === "Identifier") {
 		const binding = scope.getBinding(expression.name);
 		if (!binding) return void 0;
-		if (binding.path.isImportSpecifier() || binding.path.isImportDefaultSpecifier() || binding.path.isImportNamespaceSpecifier() || binding.path.isFunctionDeclaration() || binding.path.isClassDeclaration()) return { opaque: true };
+		if (binding.path.isImportSpecifier() || binding.path.isImportDefaultSpecifier() || binding.path.isImportNamespaceSpecifier() || binding.path.isFunctionDeclaration() || binding.path.isClassDeclaration()) return { component: true };
 		const declaration = binding.path.node;
 		return declaration.type === "VariableDeclarator" && declaration.init ? resolveOrdinaryElementExpression(declaration.init, binding.path.scope, analysis, nextSeen) : void 0;
 	}
 	if (expression.type === "CallExpression" || expression.type === "OptionalCallExpression") {
 		if (expression.callee.type === "V8IntrinsicIdentifier") return void 0;
 		const callee = analysis.resolveKnownValue(expression.callee, scope);
-		if (callee?.type === "defineComponent") return { opaque: true };
+		if (callee?.type === "defineComponent") return { component: true };
 		const argument = expression.arguments[0];
 		return callee?.type === "identity" && expression.arguments.length === 1 && argument && argument.type !== "SpreadElement" && argument.type !== "ArgumentPlaceholder" ? resolveOrdinaryElementExpression(argument, scope, analysis, nextSeen) : void 0;
 	}
@@ -614,9 +835,9 @@ function resolveOrdinaryElementExpression(input, scope, analysis, seen) {
 }
 /** Combines alternate tags only when they preserve traversal semantics. */
 function mergeOrdinaryElementShapes(left, right) {
-	if (!left || !right || left.opaque !== right.opaque) return void 0;
+	if (!left || !right || left.component !== right.component) return void 0;
 	return {
-		opaque: left.opaque,
+		component: left.component,
 		...left.tag === right.tag && left.tag !== void 0 && { tag: left.tag }
 	};
 }
@@ -654,12 +875,63 @@ function normalizeJSXText(text) {
 	return result;
 }
 function appendSerializedChild(result, child) {
-	const previous = result.at(-1);
-	if (typeof previous === "string" && typeof child === "string") result[result.length - 1] = previous + child;
-	else result.push(child);
+	if (child === jsxTextBoundary) {
+		if (result.at(-1) !== jsxTextBoundary) result.push(child);
+		return;
+	}
+	result.push(child);
+}
+/**
+* Mirrors the truthiness guard in React's `addGTIdentifier()`.
+*
+* JSX emits a scalar for one authored child and an array for multiple children.
+* Arrays are truthy even when React.Children later removes all of their values;
+* a sole primitive instead controls the guard with its original runtime value.
+*/
+function hasTruthyJSXChildren(children, scope, analysis) {
+	const runtimeChildren = children.filter(isJSXRuntimeChildArgument);
+	if (runtimeChildren.length !== 1) return runtimeChildren.length > 1;
+	const child = runtimeChildren[0];
+	if (child.type === "JSXText") return Boolean(normalizeJSXText(child.value));
+	if (child.type === "JSXElement" || child.type === "JSXFragment" || child.type === "JSXSpreadChild") return true;
+	if (child.expression.type === "JSXEmptyExpression") return false;
+	const expression = unwrapExpression(child.expression);
+	if (!expression) return false;
+	if (expression.type === "ArrayExpression") return true;
+	if (expression.type === "JSXElement" || expression.type === "JSXFragment") return true;
+	const primitive = analysis.readStaticPrimitive(expression, scope);
+	return primitive.ok ? Boolean(primitive.value) : true;
+}
+/** Includes direct children or a statically selected Vue default slot. */
+function shouldIncludeElementChildren(element, children, scope, analysis, slotTruthy) {
+	if (slotTruthy !== void 0) return slotTruthy;
+	return element.children.some(isJSXRuntimeChildArgument) ? hasTruthyJSXChildren(element.children, scope, analysis) : children.some(hasSerializedValue);
+}
+function hasSerializedValue(child) {
+	return child !== jsxTextBoundary;
+}
+function isSerializedJSXArray(child) {
+	return child !== jsxTextBoundary && typeof child === "object" && child !== null && "kind" in child && child.kind === "array";
+}
+/** Flattens explicit nested arrays exactly as React.Children.map does. */
+function flattenSerializedChildren(children) {
+	const flattened = [];
+	for (const child of children) {
+		if (child === jsxTextBoundary) continue;
+		if (isSerializedJSXArray(child)) flattened.push(...flattenSerializedChildren(child.children));
+		else flattened.push(child);
+	}
+	return flattened;
 }
 function collapseChildren(children) {
-	return children.length === 1 ? children[0] : children;
+	const structuralChildren = children.filter((child) => child !== jsxTextBoundary);
+	if (structuralChildren.length === 1 && isSerializedJSXArray(structuralChildren[0])) return flattenSerializedChildren(structuralChildren[0].children);
+	const visibleChildren = flattenSerializedChildren(children);
+	return visibleChildren.length === 1 ? visibleChildren[0] : visibleChildren;
+}
+/** Distinguishes a missing T slot from an explicitly authored empty array. */
+function collapseRootChildren(children) {
+	return children.some(hasSerializedValue) ? collapseChildren(children) : void 0;
 }
 //#endregion
 export { extractVueJSXTranslation, isNestedInVueJSXTranslation, resolveVueJSXElementIdentity, validateVueJSXVariableComponent };