@tamagui/static 3.0.0-beta.1313.1 → 3.0.0-beta.1342.1

package/dist/cjs/compilerHost.cjs

@@ -526,6 +526,35 @@ function isSerializableNativeStyle(value) {
 	if (prototype !== Object.prototype && prototype !== null) return false;
 	return Object.values(value).every(isSerializableNativeStyle);
 }
+function nativeTextMetrics(result) {
+	const value = result?.nativeTextMetrics;
+	if (!staticObject(value)) return null;
+	const { fontSize, lineHeight } = value;
+	if (fontSize !== void 0 && typeof fontSize !== "number" || lineHeight !== void 0 && typeof lineHeight !== "number" && typeof lineHeight !== "string") {
+		return null;
+	}
+	return fontSize === void 0 && lineHeight === void 0 ? null : value;
+}
+function mergeNativeTextMetrics(current, next) {
+	if (!current) return next;
+	if (!next) return current;
+	return {
+		fontSize: next.fontSize ?? current.fontSize,
+		lineHeight: next.lineHeight ?? current.lineHeight
+	};
+}
+function hasChildThatMayRenderReactNode(element) {
+	return element.entries.some((entry) => {
+		if (entry.kind !== "child" || entry.value.kind === "empty") return false;
+		if (entry.value.kind === "element") return true;
+		if (entry.value.kind === "bailout") return entry.value.dynamic === null;
+		if (entry.value.kind === "conditional") {
+			return (0, import_compiler_core.collectLeaves)(entry.value.tree).some(({ value }) => value === void 0 || value !== null && typeof value === "object");
+		}
+		if (entry.value.kind !== "static") return true;
+		return entry.value.value !== null && typeof entry.value.value === "object";
+	});
+}
 function unusedIdentifier(source, base) {
 	let candidate = base;
 	let suffix = 0;
@@ -790,6 +819,7 @@ function createTamaguiCompilerHost(options) {
 	};
 	const configuredAnimationDriver = options.tamaguiConfig.animations;
 	const configuredCssAnimationDriver = platform === "web" && configuredAnimationDriver?.outputStyle === "css" && !options.tamaguiConfig.animationDrivers ? configuredAnimationDriver : null;
+	const nativeTextMetricsByElement = /* @__PURE__ */ new WeakMap();
 	const resolveStaticCssTransition = (value, transitionPresets) => {
 		if (platform !== "web" || typeof value !== "string") return null;
 		const transitionPresetNames = new Set(Object.keys(transitionPresets));
@@ -863,7 +893,6 @@ function createTamaguiCompilerHost(options) {
 		const base = (textLike ? core.Text : core.View)?.staticConfig;
 		if (!base) return null;
 		const platformDefaults = platform === "web" ? {
-			...import_dom.DISPLAY_WEB_RESET[row.display],
 			...row.defaults,
 			...import_dom.TAG_WEB_DEFAULTS[tag]
 		} : {
@@ -878,6 +907,7 @@ function createTamaguiCompilerHost(options) {
 			displayName: tag,
 			staticConfig: normalizeStaticConfig({
 				...base,
+				isDOM: true,
 				isInput: row.backing === "textinput",
 				validStyles: {
 					...import_helpers.validStyles,
@@ -1531,6 +1561,21 @@ function createTamaguiCompilerHost(options) {
 			if (!split) {
 				return bailout(input, "local/style-resolution-failed", "getSplitStyles returned no static result");
 			}
+			const nativeMetrics = platform === "native" ? nativeTextMetrics(split) : null;
+			if (nativeMetrics) nativeTextMetricsByElement.set(input.element, nativeMetrics);
+			const hasDynamicFontSize = dynamicStyleEntries.some((entry) => {
+				const name = directStyleName(entry.name, component);
+				return name === "fontFamily" || name === "fontSize";
+			});
+			const hasUnresolvedNativeLineHeight = typeof nativeMetrics?.lineHeight === "number" && nativeMetrics.fontSize === void 0 && !hasDynamicFontSize;
+			const hasDynamicTextMetric = dynamicStyleEntries.some((entry) => {
+				const name = directStyleName(entry.name, component);
+				return name === "fontFamily" || name === "fontSize" || name === "lineHeight" || name === null && !!component.staticConfig.variants?.[entry.name];
+			});
+			const changesInheritedNativeFontSize = nativeMetrics?.fontSize !== void 0 && nativeMetrics.lineHeight === void 0;
+			if (platform === "native" && component.staticConfig.isText && !component.domTag && (hasUnresolvedNativeLineHeight || changesInheritedNativeFontSize || hasChildThatMayRenderReactNode(input.element) && (nativeMetrics !== null || hasDynamicTextMetric) || input.module.elements.some((ancestor) => ancestor !== input.element && ancestor.span.start < input.element.span.start && ancestor.span.end > input.element.span.end && nativeTextMetricsByElement.has(ancestor)))) {
+				return bailout(input, "local/unsupported-target", "Native text metrics need the runtime Text provider for this subtree");
+			}
 			if (split.programLifecycleStyleKeys?.enter?.size || split.programLifecycleStyleKeys?.exit?.size) {
 				return bailout(input, "local/unsupported-target", "Lifecycle value programs remain on the runtime path", input.element.span, {
 					rule: 5,
@@ -1664,6 +1709,7 @@ const ${mappingLocal} = ${JSON.stringify(themedStyleKeys)};`,
 					}
 					styleEntries = [.../* @__PURE__ */ new Set([...styleEntries, ...propsResult.consumed])];
 					let nativeDOMStyleSource = nativeStyleSource;
+					let nativeDOMMetrics = nativeMetrics;
 					let runtimeStyleSource = null;
 					if (domStyleProgram?.kind === "prop" && domStyleProgram.value.kind === "dom-style") {
 						const needsRuntime = domStyleProgram.value.items.some((item) => item.value.kind === "static" && staticObject(item.value.value) && (Object.keys(item.value.value).some((property) => nativeRuntimeOnlyStyleProperties.has(property)) || Object.values(item.value.value).some((value) => typeof value === "string" && (flatClausePattern.test(value) || nativeInheritedKeywordPattern.test(value)) || isClauseObjectValue(value))));
@@ -1684,6 +1730,7 @@ const ${mappingLocal} = ${JSON.stringify(themedStyleKeys)};`,
 								if (!isSerializableNativeStyle(itemStyle) || core.containsThemeRef(itemStyle)) {
 									return bailout(input, "local/unsupported-target", "Native style() output is not serializable", item.value.span);
 								}
+								nativeDOMMetrics = mergeNativeTextMetrics(nativeDOMMetrics, nativeTextMetrics(itemSplit));
 								value = JSON.stringify(itemStyle ?? {});
 							}
 							const condition = item.condition ? input.source.slice(item.condition.start, item.condition.end) : null;
@@ -1700,6 +1747,7 @@ const ${mappingLocal} = ${JSON.stringify(themedStyleKeys)};`,
 					const propertyContent = [
 						input.element.form === "jsx" ? `style={${nativeDOMStyleSource}}` : `style: ${nativeDOMStyleSource}`,
 						runtimeStyleSource ? input.element.form === "jsx" ? `__styles={${runtimeStyleSource}}` : `__styles: ${runtimeStyleSource}` : "",
+						nativeDOMMetrics ? serializedProps(input.element.form, [["__textMetrics", JSON.stringify(nativeDOMMetrics)]]) : "",
 						serializedProps(input.element.form, propsResult.additions)
 					].filter(Boolean).join(input.element.form === "jsx" ? " " : ", ");
 					const primitiveTagEdits = [input.element.component.span, input.element.component.closingSpan].filter((span) => !!span).map((span) => ({
@@ -2035,7 +2083,7 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
 					flattened: true
 				};
 			}
-			const artifacts = extractedStyleArtifacts(split, props, options.tamaguiConfig, !component.domTag, Boolean(component.staticConfig.styleFrontend));
+			const artifacts = extractedStyleArtifacts(split, props, options.tamaguiConfig, true, Boolean(component.staticConfig.styleFrontend));
 			const className = artifacts.className;
 			const rawInlineStyle = split.viewProps?.style;
 			const inlineStyle = staticObject(rawInlineStyle) && Object.keys(rawInlineStyle).length > 0 ? rawInlineStyle : null;
@@ -2131,7 +2179,7 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
 					if (conflictsWithInline(changedKeys, laneAOwners, laneAMemberOwners)) {
 						return bailout(input, "local/dynamic-style-value", `${entry.name} and an inline dynamic style both contribute a CSS property; their precedence cannot be resolved per-branch`, entry.value.span);
 					}
-					const branchArtifacts = extractedStyleArtifacts(branchSplit, branchProps, options.tamaguiConfig, !component.domTag, Boolean(component.staticConfig.styleFrontend));
+					const branchArtifacts = extractedStyleArtifacts(branchSplit, branchProps, options.tamaguiConfig, true, Boolean(component.staticConfig.styleFrontend));
 					leafArtifactsMap.set(leaf, {
 						classes: branchArtifacts.className.split(" ").filter(Boolean),
 						css: branchArtifacts.css

package/dist/cjs/extractor/esbuildTsconfigPaths.cjs

@@ -27,12 +27,13 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var esbuildTsconfigPaths_exports = {};
 __export(esbuildTsconfigPaths_exports, {
 	TsconfigPathsPlugin: () => TsconfigPathsPlugin,
-	createTsconfigPathsMatcher: () => createTsconfigPathsMatcher
+	createTsconfigPathsMatcher: () => createTsconfigPathsMatcher,
+	loadTsconfigPathMatcher: () => loadTsconfigPathMatcher
 });
 module.exports = __toCommonJS(esbuildTsconfigPaths_exports);
+var import_get_tsconfig = require("get-tsconfig");
 var import_node_fs = __toESM(require("node:fs"), 1);
 var import_node_path = __toESM(require("node:path"), 1);
-var import_get_tsconfig = require("get-tsconfig");
 const name = "tsconfig-paths";
 function loadTsconfig(tsconfig, cwd = process.cwd()) {
 	if (!tsconfig) {
@@ -57,27 +58,65 @@ function createTsconfigPathsMatcher(tsconfig, cwd = process.cwd()) {
 	const loaded = loadTsconfig(tsconfig, cwd);
 	return loaded ? (0, import_get_tsconfig.createPathsMatcher)(loaded) : null;
 }
+function loadTsconfigPathMatcher(tsconfig) {
+	let result;
+	if (!tsconfig) {
+		result = (0, import_get_tsconfig.getTsconfig)(process.cwd()) || (0, import_get_tsconfig.getTsconfig)(process.cwd(), "jsconfig.json");
+	} else if (typeof tsconfig === "string") {
+		if (import_node_fs.default.existsSync(tsconfig)) {
+			const configPath = import_node_path.default.resolve(tsconfig);
+			result = {
+				config: (0, import_get_tsconfig.parseTsconfig)(configPath),
+				path: configPath
+			};
+		} else {
+			throw new Error(`Specified tsconfig file not found: ${tsconfig}`);
+		}
+	} else {
+		result = {
+			config: tsconfig,
+			path: import_node_path.default.join(process.cwd(), "tsconfig.json")
+		};
+	}
+	if (!result) return () => [];
+	const matchPaths = (0, import_get_tsconfig.createPathsMatcher)(result);
+	const patterns = Object.keys(result.config.compilerOptions?.paths || {});
+	if (!matchPaths || patterns.length === 0) return () => [];
+	return (specifier) => {
+		const matchesExplicitPath = patterns.some((pattern) => {
+			const wildcardIndex = pattern.indexOf("*");
+			if (wildcardIndex === -1) return pattern === specifier;
+			return specifier.startsWith(pattern.slice(0, wildcardIndex)) && specifier.endsWith(pattern.slice(wildcardIndex + 1));
+		});
+		return matchesExplicitPath ? matchPaths(specifier) : [];
+	};
+}
 function TsconfigPathsPlugin() {
-	const pathsMatcher = createTsconfigPathsMatcher();
+	const matchTsconfigPath = loadTsconfigPathMatcher();
 	return {
 		name,
 		setup(build) {
 			build.onResolve({ filter: /.*/ }, async (args) => {
-				if (!pathsMatcher || args.path.startsWith("@tamagui/") || args.pluginData?.tamaguiTsconfigPaths) {
+				const pluginData = args.pluginData;
+				if (pluginData?.tamaguiTsconfigPaths || pluginData?.tamaguiTsconfigPathsResolved) {
+					return null;
+				}
+				if (args.path.startsWith("@tamagui/")) {
 					return null;
 				}
-				for (const candidate of pathsMatcher(args.path)) {
+				for (const candidate of matchTsconfigPath(args.path)) {
 					const resolved = await build.resolve(candidate, {
 						importer: args.importer,
 						kind: args.kind,
 						namespace: args.namespace,
-						resolveDir: args.resolveDir,
 						pluginData: {
-							...args.pluginData,
-							tamaguiTsconfigPaths: true
-						}
+							...args.pluginData && typeof args.pluginData === "object" ? args.pluginData : {},
+							tamaguiTsconfigPaths: true,
+							tamaguiTsconfigPathsResolved: true
+						},
+						resolveDir: args.resolveDir
 					});
-					if (resolved.errors.length === 0 && resolved.path && !resolved.path.endsWith(".d.ts")) {
+					if (resolved.path && !resolved.path.endsWith(".d.ts") && resolved.errors.length === 0) {
 						return resolved;
 					}
 				}

package/dist/esm/compilerHost.mjs

@@ -1,6 +1,6 @@
 import { collectLeaves, zeroRuleMessage, zeroThemeBoundaryMessage } from "@tamagui/compiler-core";
 import { StyleObjectIdentifier, StyleObjectProperty, StyleObjectRules, StyleObjectValue, stylePropsAll, stylePropsInput, stylePropsText, validStyles } from "@tamagui/helpers";
-import { ATTRIBUTES, DISPLAY_WEB_RESET, EVENTS, NATIVE_BACKING, NATIVE_BLOCK_DEFAULTS, NATIVE_ELEMENT_DEFAULTS, NATIVE_FLEX_DEFAULTS, NATIVE_INPUT_TYPES, NATIVE_PRIMITIVE_MODULE, TAGS, TAG_WEB_DEFAULTS } from "@tamagui/dom";
+import { ATTRIBUTES, EVENTS, NATIVE_BACKING, NATIVE_BLOCK_DEFAULTS, NATIVE_ELEMENT_DEFAULTS, NATIVE_FLEX_DEFAULTS, NATIVE_INPUT_TYPES, NATIVE_PRIMITIVE_MODULE, TAGS, TAG_WEB_DEFAULTS } from "@tamagui/dom";
 import { resolveTransition, toCSSTransition } from "@tamagui/animation-helpers";
 import { createModifierRegistry, parseTransition, parseValue } from "@tamagui/style-grammar/tooling";
 import { isValidStyleKey } from "@tamagui/web";
@@ -501,6 +501,35 @@ function isSerializableNativeStyle(value) {
 	if (prototype !== Object.prototype && prototype !== null) return false;
 	return Object.values(value).every(isSerializableNativeStyle);
 }
+function nativeTextMetrics(result) {
+	const value = result?.nativeTextMetrics;
+	if (!staticObject(value)) return null;
+	const { fontSize, lineHeight } = value;
+	if (fontSize !== void 0 && typeof fontSize !== "number" || lineHeight !== void 0 && typeof lineHeight !== "number" && typeof lineHeight !== "string") {
+		return null;
+	}
+	return fontSize === void 0 && lineHeight === void 0 ? null : value;
+}
+function mergeNativeTextMetrics(current, next) {
+	if (!current) return next;
+	if (!next) return current;
+	return {
+		fontSize: next.fontSize ?? current.fontSize,
+		lineHeight: next.lineHeight ?? current.lineHeight
+	};
+}
+function hasChildThatMayRenderReactNode(element) {
+	return element.entries.some((entry) => {
+		if (entry.kind !== "child" || entry.value.kind === "empty") return false;
+		if (entry.value.kind === "element") return true;
+		if (entry.value.kind === "bailout") return entry.value.dynamic === null;
+		if (entry.value.kind === "conditional") {
+			return collectLeaves(entry.value.tree).some(({ value }) => value === void 0 || value !== null && typeof value === "object");
+		}
+		if (entry.value.kind !== "static") return true;
+		return entry.value.value !== null && typeof entry.value.value === "object";
+	});
+}
 function unusedIdentifier(source, base) {
 	let candidate = base;
 	let suffix = 0;
@@ -765,6 +794,7 @@ function createTamaguiCompilerHost(options) {
 	};
 	const configuredAnimationDriver = options.tamaguiConfig.animations;
 	const configuredCssAnimationDriver = platform === "web" && configuredAnimationDriver?.outputStyle === "css" && !options.tamaguiConfig.animationDrivers ? configuredAnimationDriver : null;
+	const nativeTextMetricsByElement = /* @__PURE__ */ new WeakMap();
 	const resolveStaticCssTransition = (value, transitionPresets) => {
 		if (platform !== "web" || typeof value !== "string") return null;
 		const transitionPresetNames = new Set(Object.keys(transitionPresets));
@@ -838,7 +868,6 @@ function createTamaguiCompilerHost(options) {
 		const base = (textLike ? core.Text : core.View)?.staticConfig;
 		if (!base) return null;
 		const platformDefaults = platform === "web" ? {
-			...DISPLAY_WEB_RESET[row.display],
 			...row.defaults,
 			...TAG_WEB_DEFAULTS[tag]
 		} : {
@@ -853,6 +882,7 @@ function createTamaguiCompilerHost(options) {
 			displayName: tag,
 			staticConfig: normalizeStaticConfig({
 				...base,
+				isDOM: true,
 				isInput: row.backing === "textinput",
 				validStyles: {
 					...validStyles,
@@ -1506,6 +1536,21 @@ function createTamaguiCompilerHost(options) {
 			if (!split) {
 				return bailout(input, "local/style-resolution-failed", "getSplitStyles returned no static result");
 			}
+			const nativeMetrics = platform === "native" ? nativeTextMetrics(split) : null;
+			if (nativeMetrics) nativeTextMetricsByElement.set(input.element, nativeMetrics);
+			const hasDynamicFontSize = dynamicStyleEntries.some((entry) => {
+				const name = directStyleName(entry.name, component);
+				return name === "fontFamily" || name === "fontSize";
+			});
+			const hasUnresolvedNativeLineHeight = typeof nativeMetrics?.lineHeight === "number" && nativeMetrics.fontSize === void 0 && !hasDynamicFontSize;
+			const hasDynamicTextMetric = dynamicStyleEntries.some((entry) => {
+				const name = directStyleName(entry.name, component);
+				return name === "fontFamily" || name === "fontSize" || name === "lineHeight" || name === null && !!component.staticConfig.variants?.[entry.name];
+			});
+			const changesInheritedNativeFontSize = nativeMetrics?.fontSize !== void 0 && nativeMetrics.lineHeight === void 0;
+			if (platform === "native" && component.staticConfig.isText && !component.domTag && (hasUnresolvedNativeLineHeight || changesInheritedNativeFontSize || hasChildThatMayRenderReactNode(input.element) && (nativeMetrics !== null || hasDynamicTextMetric) || input.module.elements.some((ancestor) => ancestor !== input.element && ancestor.span.start < input.element.span.start && ancestor.span.end > input.element.span.end && nativeTextMetricsByElement.has(ancestor)))) {
+				return bailout(input, "local/unsupported-target", "Native text metrics need the runtime Text provider for this subtree");
+			}
 			if (split.programLifecycleStyleKeys?.enter?.size || split.programLifecycleStyleKeys?.exit?.size) {
 				return bailout(input, "local/unsupported-target", "Lifecycle value programs remain on the runtime path", input.element.span, {
 					rule: 5,
@@ -1639,6 +1684,7 @@ const ${mappingLocal} = ${JSON.stringify(themedStyleKeys)};`,
 					}
 					styleEntries = [.../* @__PURE__ */ new Set([...styleEntries, ...propsResult.consumed])];
 					let nativeDOMStyleSource = nativeStyleSource;
+					let nativeDOMMetrics = nativeMetrics;
 					let runtimeStyleSource = null;
 					if (domStyleProgram?.kind === "prop" && domStyleProgram.value.kind === "dom-style") {
 						const needsRuntime = domStyleProgram.value.items.some((item) => item.value.kind === "static" && staticObject(item.value.value) && (Object.keys(item.value.value).some((property) => nativeRuntimeOnlyStyleProperties.has(property)) || Object.values(item.value.value).some((value) => typeof value === "string" && (flatClausePattern.test(value) || nativeInheritedKeywordPattern.test(value)) || isClauseObjectValue(value))));
@@ -1659,6 +1705,7 @@ const ${mappingLocal} = ${JSON.stringify(themedStyleKeys)};`,
 								if (!isSerializableNativeStyle(itemStyle) || core.containsThemeRef(itemStyle)) {
 									return bailout(input, "local/unsupported-target", "Native style() output is not serializable", item.value.span);
 								}
+								nativeDOMMetrics = mergeNativeTextMetrics(nativeDOMMetrics, nativeTextMetrics(itemSplit));
 								value = JSON.stringify(itemStyle ?? {});
 							}
 							const condition = item.condition ? input.source.slice(item.condition.start, item.condition.end) : null;
@@ -1675,6 +1722,7 @@ const ${mappingLocal} = ${JSON.stringify(themedStyleKeys)};`,
 					const propertyContent = [
 						input.element.form === "jsx" ? `style={${nativeDOMStyleSource}}` : `style: ${nativeDOMStyleSource}`,
 						runtimeStyleSource ? input.element.form === "jsx" ? `__styles={${runtimeStyleSource}}` : `__styles: ${runtimeStyleSource}` : "",
+						nativeDOMMetrics ? serializedProps(input.element.form, [["__textMetrics", JSON.stringify(nativeDOMMetrics)]]) : "",
 						serializedProps(input.element.form, propsResult.additions)
 					].filter(Boolean).join(input.element.form === "jsx" ? " " : ", ");
 					const primitiveTagEdits = [input.element.component.span, input.element.component.closingSpan].filter((span) => !!span).map((span) => ({
@@ -2010,7 +2058,7 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
 					flattened: true
 				};
 			}
-			const artifacts = extractedStyleArtifacts(split, props, options.tamaguiConfig, !component.domTag, Boolean(component.staticConfig.styleFrontend));
+			const artifacts = extractedStyleArtifacts(split, props, options.tamaguiConfig, true, Boolean(component.staticConfig.styleFrontend));
 			const className = artifacts.className;
 			const rawInlineStyle = split.viewProps?.style;
 			const inlineStyle = staticObject(rawInlineStyle) && Object.keys(rawInlineStyle).length > 0 ? rawInlineStyle : null;
@@ -2106,7 +2154,7 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
 					if (conflictsWithInline(changedKeys, laneAOwners, laneAMemberOwners)) {
 						return bailout(input, "local/dynamic-style-value", `${entry.name} and an inline dynamic style both contribute a CSS property; their precedence cannot be resolved per-branch`, entry.value.span);
 					}
-					const branchArtifacts = extractedStyleArtifacts(branchSplit, branchProps, options.tamaguiConfig, !component.domTag, Boolean(component.staticConfig.styleFrontend));
+					const branchArtifacts = extractedStyleArtifacts(branchSplit, branchProps, options.tamaguiConfig, true, Boolean(component.staticConfig.styleFrontend));
 					leafArtifactsMap.set(leaf, {
 						classes: branchArtifacts.className.split(" ").filter(Boolean),
 						css: branchArtifacts.css