@tamagui/web 3.0.18 → 3.1.0

package/dist/esm/helpers/getSplitStyles.mjs

@@ -30,7 +30,8 @@ import { isStylePiece, isStylePieceCacheable, setStylePieceCompiler, setStylePie
 
 export * from "./tokenCategories.mjs"
 
-const shouldTrackStyleTokenProvenance = process.env.NODE_ENV === "development" && process.env.TAMAGUI_ENABLE_STYLE_TOKEN_PROVENANCE === "1";
+const isProd = process.env.NODE_ENV === "production";
+const shouldTrackStyleTokenProvenance = !isProd && process.env.NODE_ENV === "development" && process.env.TAMAGUI_ENABLE_STYLE_TOKEN_PROVENANCE === "1";
 const conditionValue = 0;
 const conditionPlatform = 1;
 const conditionKey = 2;
@@ -64,7 +65,7 @@ function createCondition(parent) {
 }
 function setConditionUnresolved(condition, name = "") {
 	condition[conditionValue] &= -17;
-	if (process.env.NODE_ENV !== "production") condition.problem ||= name;
+	if (!isProd && process.env.NODE_ENV !== "production") condition.problem ||= name;
 }
 function appendConditionWrapper(condition, wrapper) {
 	const wrappers = condition[conditionWrappers];
@@ -118,7 +119,7 @@ function resolveConditionModifier(state, condition, authored) {
 		}
 		const component = state.componentState.group?.[groupName];
 		const context = state.flatGroupContext?.[groupName];
-		if (process.env.NODE_ENV === "development" && containerName && !component && !context && state.flatGroupContext?.[containerName]) warnOnce(`group-container:${containerName}`, `@${size}/${containerName}: targets group="${containerName}", but groups no longer establish query containers. Add container="${containerName}" to that group.`);
+		if (!isProd && process.env.NODE_ENV === "development" && containerName && !component && !context && state.flatGroupContext?.[containerName]) warnOnce(`group-container:${containerName}`, `@${size}/${containerName}: targets group="${containerName}", but groups no longer establish query containers. Add container="${containerName}" to that group.`);
 		if (!(component?.media?.[size] ?? (context?.state.layout && mediaKeyMatch(size, context.state.layout)))) condition[conditionValue] &= -2;
 		(state.flatGroupKeys ||= /* @__PURE__ */ new Set()).add(groupName);
 		(state.flatGroupMedia ||= /* @__PURE__ */ new Set()).add(size);
@@ -165,7 +166,7 @@ function commitCondition(condition) {
 	const ranks = condition[conditionRanks];
 	const depth = ranks.length;
 	if (depth > 5) {
-		if (process.env.NODE_ENV !== "production") throw new Error(`a flat value clause supports at most 5 non-platform conditions; received ${depth} in "${condition[conditionKey]}:"`);
+		if (!isProd && process.env.NODE_ENV !== "production") throw new Error(`a flat value clause supports at most 5 non-platform conditions; received ${depth} in "${condition[conditionKey]}:"`);
 		return 0;
 	}
 	let precedence = condition[conditionPlatform] * 6 + depth;
@@ -266,8 +267,8 @@ function contributeProp(pass, keyOg, valOg, originalOg = valOg, disabled = false
 		return;
 	}
 	if (keyInit === "ref") return;
-	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`before-prop-${keyInit}`;
-	if (process.env.NODE_ENV === "test" && keyInit === "jestAnimatedStyle") return;
+	if (!isProd && process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`before-prop-${keyInit}`;
+	if (!isProd && process.env.NODE_ENV === "test" && keyInit === "jestAnimatedStyle") return;
 	if (!disableExpandShorthands) {
 		if (keyInit in shorthands) keyInit = shorthands[keyInit];
 	}
@@ -293,7 +294,7 @@ function contributeProp(pass, keyOg, valOg, originalOg = valOg, disabled = false
 				}
 				if (condition2 !== void 0) {
 					if (isValidStyleKey(property, validStyles)) contributeValue(styleState, property, entry[1], void 0, false, condition2);
-					else if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${property}" is not a valid style on this component; the frontend value is dropped.`);
+					else if (!isProd && process.env.NODE_ENV === "development") console.warn(`[tamagui] "${property}" is not a valid style on this component; the frontend value is dropped.`);
 					return;
 				}
 				if (property === "group") pass[passFrontendGroup] = entry[1];
@@ -311,7 +312,7 @@ function contributeProp(pass, keyOg, valOg, originalOg = valOg, disabled = false
 				const candidate = valInit.slice(start, index);
 				const preserveRaw = resolveClassName ? resolveClassName(candidate, conf, sink) : true;
 				if (preserveRaw === null) {
-					if (process.env.NODE_ENV === "development") warnOnce(`[tamagui] frontend candidate "${candidate}" is unavailable on this platform and was dropped.`);
+					if (!isProd && process.env.NODE_ENV === "development") warnOnce(`[tamagui] frontend candidate "${candidate}" is unavailable on this platform and was dropped.`);
 				} else if (preserveRaw) {
 					pass[passClassName] = pass[passClassName] ? `${pass[passClassName]} ${candidate}` : candidate;
 					if (resolveClassName) {
@@ -417,7 +418,7 @@ function contributeProp(pass, keyOg, valOg, originalOg = valOg, disabled = false
 		const defaultVal = defaultProps[keyOg] ?? defaultProps[keyInit];
 		if (defaultVal !== void 0 && valInit === defaultVal) return;
 	}
-	if (process.env.NODE_ENV === "development") {
+	if (!isProd && process.env.NODE_ENV === "development") {
 		if (!isValidStyleKey(keyInit, validStyles) && (keyInit === "animation" || !(keyInit in stylePropsAll)) && (!variants || !(keyInit in variants))) {
 			let replacement;
 			if (keyInit === "animation") replacement = "transition=";
@@ -445,7 +446,7 @@ function contributeProp(pass, keyOg, valOg, originalOg = valOg, disabled = false
 		return;
 	}
 	if (pass[passVariantOutput] && !isValidStyleKeyInit && !keyInit.startsWith("aria-") && !(keyInit in stylePropsAll) && !(keyInit in skipProps) && !(variants && keyInit in variants) && !(parentVariants && keyInit in parentVariants) && !styledContextKeys?.has(keyInit) && !(styledContext && keyInit in styledContext)) {
-		if (process.env.NODE_ENV === "development") warnOnce(`variant-non-style:${keyInit}`, `a variant set "${keyInit}", which is not a style. Variants hold styles and aria/data attributes only: set "${keyInit}" on the component one level up.`);
+		if (!isProd && process.env.NODE_ENV === "development") warnOnce(`variant-non-style:${keyInit}`, `a variant set "${keyInit}", which is not a style. Variants hold styles and aria/data attributes only: set "${keyInit}" on the component one level up.`);
 		return;
 	}
 	if (!noExpand) {
@@ -474,7 +475,7 @@ function contributeProp(pass, keyOg, valOg, originalOg = valOg, disabled = false
 	const shouldPassProp = !isStyleProp && isHOC || isHOC && keyInit === "disabled" || parentVariants && keyInit in parentVariants || inlineProps?.has(keyInit);
 	const isHOCShouldPassThrough = isHOC && keyInit in skipProps;
 	const shouldPassThrough = shouldPassProp || isHOCShouldPassThrough;
-	if (process.env.NODE_ENV === "development" && debug === "verbose") {
+	if (!isProd && process.env.NODE_ENV === "development" && debug === "verbose") {
 		console.groupCollapsed(`  \u{1F511} ${keyOg}${keyInit !== keyOg ? ` (shorthand for ${keyInit})` : ""} ${shouldPassThrough ? "(pass)" : ""}`);
 		log({
 			isVariant,
@@ -492,12 +493,12 @@ function contributeProp(pass, keyOg, valOg, originalOg = valOg, disabled = false
 	if (shouldPassThrough) {
 		if (keyInit in viewProps) delete viewProps[keyInit];
 		viewProps[keyInit] = valInit;
-		if (process.env.NODE_ENV === "development" && debug === "verbose") console.groupEnd();
+		if (!isProd && process.env.NODE_ENV === "development" && debug === "verbose") console.groupEnd();
 		if (!isVariant) return;
 	}
 	if (shouldCheckSkipProps && !neverSkipProps?.[keyInit]) {
 		if (keyInit in skipProps && !(keyInit === "transition" && typeof valInit === "string" && !getTransitionResolver()?.resolve(valInit, { animations: driverAnimations }).fused)) {
-			if (process.env.NODE_ENV === "development" && debug === "verbose") console.groupEnd();
+			if (!isProd && process.env.NODE_ENV === "development" && debug === "verbose") console.groupEnd();
 			return;
 		}
 	}
@@ -534,15 +535,15 @@ function contributeProp(pass, keyOg, valOg, originalOg = valOg, disabled = false
 			const transport = previous && typeof previous === "object" && !Array.isArray(previous) && "default" in previous ? previous : { default: previous };
 			transport[condition[conditionKey]] = valInit;
 			viewProps[keyInit] = transport;
-		} else if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${keyInit}" is not a valid style on this component; the conditional variant value is dropped.`);
+		} else if (!isProd && process.env.NODE_ENV === "development") console.warn(`[tamagui] "${keyInit}" is not a valid style on this component; the conditional variant value is dropped.`);
 		return;
 	}
 	if (keyInit in stylePropsAll || isRemovedVendorStyleProp(keyInit)) {
-		if (process.env.NODE_ENV === "development" && true) console.warn(`[tamagui] "${keyInit}" is a text style prop and this component is not text \u2014 it would render on neither platform. Use a Text-based component, or html.* for raw web elements.`);
+		if (!isProd && process.env.NODE_ENV === "development" && true) console.warn(`[tamagui] "${keyInit}" is a text style prop and this component is not text \u2014 it would render on neither platform. Use a Text-based component, or html.* for raw web elements.`);
 		return;
 	}
 	viewProps[keyInit] = valInit;
-	if (process.env.NODE_ENV === "development" && debug === "verbose") {
+	if (!isProd && process.env.NODE_ENV === "development" && debug === "verbose") {
 		try {
 			log(` \u2714\uFE0F expand complete`, keyInit);
 			log("style", { ...styleState.style });
@@ -576,7 +577,7 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 	let className = staticPassthroughClassName;
 	if (staticPassthroughClassName) shouldDoClasses = false;
 	const validStyles$1 = staticConfig.validStyles || (staticConfig.isInput ? stylePropsInput : staticConfig.isText ? stylePropsText : validStyles);
-	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-setup`;
+	if (!isProd && process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-setup`;
 	const styleState = {
 		classNames,
 		conf,
@@ -597,8 +598,8 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 		animationDriver: resolvedDriver
 	};
 	styleState.flatStyleStaticConfig = styleStaticConfig;
-	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`style-state`;
-	if (process.env.NODE_ENV === "development" && debug === "verbose" && isClient) {
+	if (!isProd && process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`style-state`;
+	if (!isProd && process.env.NODE_ENV === "development" && debug === "verbose" && isClient) {
 		if (isDevTools) {
 			console.groupCollapsed("🔹 getSplitStyles 👇");
 			log({
@@ -646,7 +647,7 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 		styledContextKeys,
 		(noSkip ? passNoSkipFlag : 0) | (disableExpandShorthands ? passDisableShorthandsFlag : 0) | (noExpand ? passNoExpandFlag : 0) | (noMergeStyle ? passNoMergeFlag : 0) | (isHOC ? passHocFlag : 0) | (isText ? passTextFlag : 0) | (isInput ? passInputFlag : 0) | (asChildExceptStyleLike ? passAsChildStyleFlag : 0),
 		debug,
-		process.env.NODE_ENV === "development" ? parentStaticConfig : void 0,
+		!isProd && process.env.NODE_ENV === "development" ? parentStaticConfig : void 0,
 		defaultProps,
 		driverAnimations,
 		driverOutputStyle,
@@ -721,7 +722,7 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 		containerType ??= "inline-size";
 		contributeValue(styleState, containerName ? "container" : "containerType", containerName ? `${containerName} / ${containerType}` : containerType);
 	}
-	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-propsend`;
+	if (!isProd && process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-propsend`;
 	conditionalStates = styleState.flatStateKeys || null;
 	usesSafeArea = !!styleState.flatUsesSafeArea;
 	hasMedia = styleState.flatMediaKeys?.size ? styleState.flatMediaKeys : false;
@@ -776,7 +777,7 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 	}
 	if (!noNormalize && !isHOC && (!isAnimated || driverInputStyle === "css") && Array.isArray(styleState.style?.transform)) styleState.style.transform = transformsToString(styleState.style.transform);
 	flushDirectStyles(styleState);
-	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-pre-result`;
+	if (!isProd && process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-pre-result`;
 	if (shouldTrackStyleTokenProvenance && styleState.style && styleState.tokenProvenance) {
 		const provenance = {};
 		let hasProvenance = false;
@@ -836,7 +837,7 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 			}
 		}
 	}
-	if (process.env.NODE_ENV === "development" && debug === "verbose") {
+	if (!isProd && process.env.NODE_ENV === "development" && debug === "verbose") {
 		if (isClient && isDevTools) {
 			console.groupEnd();
 			console.groupCollapsed("🔹 getSplitStyles ===>");
@@ -855,7 +856,7 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 			console.groupEnd();
 		}
 	}
-	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-done`;
+	if (!isProd && process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-done`;
 	return result;
 };
 const stylePieceStaticConfig = {
@@ -1229,7 +1230,7 @@ function emitAtParentCondition(state, property, value, originalValue, contextOnl
 function emitUnderCondition(state, property, value, cursor, originalValue, contextOnly, warnMode, warnSource) {
 	const condition = cursor[conditionValue];
 	if (!(condition & conditionResolvedFlag)) {
-		if (warnMode && process.env.NODE_ENV !== "production") warnRefusedValue(property, warnSource, `unknown modifier "${cursor.problem}"`);
+		if (warnMode && !isProd && process.env.NODE_ENV !== "production") warnRefusedValue(property, warnSource, `unknown modifier "${cursor.problem}"`);
 		return 0;
 	}
 	emitValue(state, property, value, cursor, warnMode === 2 ? originalValue : originalValue ?? value, contextOnly);
@@ -1241,7 +1242,7 @@ function emitUnderCondition(state, property, value, cursor, originalValue, conte
 }
 const formatScanFailure = (failure, source, failureIndex) => failure === "invalid-character" ? `"${source[failureIndex]}" would end the declaration or rule` : failure === "unterminated-string" ? "an unterminated string" : failure === "unterminated-comment" ? "an unterminated \"/*\" comment" : failure === "stray-comment-close" ? "a stray \"*/\"" : failure === "over-deep-clause" ? `a clause with more than ${grammarMaxNonPlatformDepth} non-platform conditions` : "an unterminated \"(\"";
 const warnScanFailure = (property, source, failure, failureIndex) => {
-	if (process.env.NODE_ENV === "development") warnRefusedValue(property, source, formatScanFailure(failure, source, failureIndex));
+	if (!isProd && process.env.NODE_ENV === "development") warnRefusedValue(property, source, formatScanFailure(failure, source, failureIndex));
 };
 let valueCacheConf;
 let valueCacheRevision = -1;
@@ -1336,7 +1337,7 @@ function configuredValue(state, property, raw, embedded = false, nativeColors) {
 			}
 		}
 	}
-	if (process.env.NODE_ENV === "development") {
+	if (!isProd && process.env.NODE_ENV === "development") {
 		const category = grammar.tokenCategory(property) || grammar.tokenCategory(state.conf.shorthands[property] || property);
 		if (category && category !== "color" && category !== "boxShadow" && category !== "textShadow" && state.conf.tokensParsed.color?.[name]) warnOnce(`"${name}" contributes to "color", not "${property}"`);
 		if (!value && !fontProperty) {
@@ -1461,7 +1462,7 @@ function emitProperty(state, property, value, cursor, originalValue, contextOnly
 		return;
 	}
 	if (canGenerateCSS && state.flatShouldDoClasses && !condition && property === "transform") {
-		if (process.env.NODE_ENV === "development" && state.transformAccumulator) for (const part of getTransformPartKeys(state.transformAccumulator)) warnOnce(`legacy transform part "${part}" is dropped because "transform" owns the property`);
+		if (!isProd && process.env.NODE_ENV === "development" && state.transformAccumulator) for (const part of getTransformPartKeys(state.transformAccumulator)) warnOnce(`legacy transform part "${part}" is dropped because "transform" owns the property`);
 		state.transformAccumulator ||= createTransformAccumulator();
 		addTransformValue(state.transformAccumulator, property, value);
 		return;
@@ -1572,7 +1573,7 @@ function emitValue(state, property, raw, cursor, originalValue, contextOnly) {
 		let value2 = typeof raw === "string" ? configuredValue(state, property, raw) : raw;
 		if (!state.flatShouldDoClasses && typeof value2 === "string" && !value2.startsWith(THEME_REF_PREFIX)) {
 			if (property === "rotate" && !isFinite(numericUnitValue(value2, "deg", "rad")) && !startsValueFunction(value2)) {
-				if (process.env.NODE_ENV === "development") warnOnce(`native transform "${property}" cannot represent "${value2}"; dropping it`);
+				if (!isProd && process.env.NODE_ENV === "development") warnOnce(`native transform "${property}" cannot represent "${value2}"; dropping it`);
 				if (condition & 1) {
 					removeTransformValue(state.transformAccumulator, property);
 					writeStyleRecord(state, property, void 0, cursor, void 0, recordRetract);
@@ -1627,7 +1628,7 @@ function walkConditionalValue(state, property, value, parent, sink, warnMode = 0
 	if (typeof value === "string") {
 		const parsed = getConfigRevisionState(state.conf).parseFlatValue(value);
 		const [segments, failure, failureIndex] = parsed;
-		if (process.env.NODE_ENV === "development") {
+		if (!isProd && process.env.NODE_ENV === "development") {
 			if (getSetting("styleValueSyntax") === "object") {
 				if (segments.length > 5 || segments.length >= 5 && segments[2] !== -1 || value.includes(":")) warnOnce(`syntax:string:${property}=${value}`, `string syntax is disabled by config (styleValueSyntax: 'object'); received "${property}=${value}"`);
 			}
@@ -1650,7 +1651,7 @@ function walkConditionalValue(state, property, value, parent, sink, warnMode = 0
 				const payload = slices[index] ??= value.slice(start, end);
 				emitConditionalValue(state, property, payload, parentCondition, payload, sink, warnMode, contextOnly);
 				hasBase = true;
-			} else if (process.env.NODE_ENV !== "production" && warnMode && !chainCount && (failure === "invalid-character" || failure === "stray-comment-close")) {
+			} else if (!isProd && process.env.NODE_ENV !== "production" && warnMode && !chainCount && (failure === "invalid-character" || failure === "stray-comment-close")) {
 				emitConditionalValue(state, property, value, parentCondition, value, sink, warnMode, contextOnly);
 				hasBase = true;
 			} else if (warnMode) warnScanFailure(property, value, failure, failureIndex);
@@ -1667,17 +1668,17 @@ function walkConditionalValue(state, property, value, parent, sink, warnMode = 0
 			}
 			lastPayloadStart = start;
 			if (start === end) {
-				if (warnMode && process.env.NODE_ENV === "development") warnRefusedValue(property, value, "a conditional clause has no value");
+				if (warnMode && !isProd && process.env.NODE_ENV === "development") warnRefusedValue(property, value, "a conditional clause has no value");
 				continue;
 			}
 			const cursor = conditionFromKey(state, slices[index + 2] ??= value.slice(segments[index + 2], segments[index + 3]), parentCondition);
 			conditions |= cursor[conditionValue];
 			if (cursor[conditionValue] & conditionResolvedFlag || warnMode) emitConditionalValue(state, property, slices[index] ??= value.slice(start, end), cursor, value, sink, warnMode, contextOnly);
 		}
-		if (process.env.NODE_ENV !== "production") lastPayload = value.slice(lastPayloadStart);
+		if (!isProd && process.env.NODE_ENV !== "production") lastPayload = value.slice(lastPayloadStart);
 	} else {
 		if (!value || typeof value !== "object" || Array.isArray(value) || isVariable(value) || !classifyConditionalObject(value, state)) return false;
-		if (process.env.NODE_ENV === "development") {
+		if (!isProd && process.env.NODE_ENV === "development") {
 			if (getSetting("styleValueSyntax") === "string") warnOnce(`syntax:object:${property}=${JSON.stringify(value)}`, `object-form conditional syntax is disabled by config (styleValueSyntax: 'string'); received "${property}"`);
 		}
 		if (value.default != null) {
@@ -1691,7 +1692,7 @@ function walkConditionalValue(state, property, value, parent, sink, warnMode = 0
 			if (cursor[conditionValue] & conditionResolvedFlag || warnMode) emitConditionalValue(state, property, value[key], cursor, value[key], sink, warnMode, contextOnly);
 		}
 	}
-	if (warnMode && process.env.NODE_ENV === "development" && typeof value === "string" && !hasBase && conditions && getConfigRevisionState(state.conf).tokenCategory(property) && getConfigRevisionState(state.conf).propertyKind(property) !== 8 && property !== "boxShadow" && property !== "textShadow" && property !== "fontFamily" && property !== "gap" && splitComponents(lastPayload).length > 1) warnOnce(`${property}="${value}" has multiple values after its first conditional. Write the base value before the first conditional.`);
+	if (warnMode && !isProd && process.env.NODE_ENV === "development" && typeof value === "string" && !hasBase && conditions && getConfigRevisionState(state.conf).tokenCategory(property) && getConfigRevisionState(state.conf).propertyKind(property) !== 8 && property !== "boxShadow" && property !== "textShadow" && property !== "fontFamily" && property !== "gap" && splitComponents(lastPayload).length > 1) warnOnce(`${property}="${value}" has multiple values after its first conditional. Write the base value before the first conditional.`);
 	if (warnMode === 1 && conditions & 12 && !hasBase) {
 		const resting = property === "opacity" || property.startsWith("scale") ? 1 : property === "rotate" ? "0deg" : property === "x" || property === "y" ? 0 : null;
 		const layers = state.flatPropertyLayers;
@@ -1717,7 +1718,7 @@ function contributeValue(state, property, value, originalValue, contextOnly = fa
 	}
 	const compositeKind = getConfigRevisionState(state.conf).propertyKind(property);
 	if (compositeKind > 0 && compositeKind < 6 && (typeof value === "string" && value.indexOf(":") !== -1 || value && typeof value === "object" && !Array.isArray(value) && !isVariable(value) && classifyConditionalObject(value, state))) {
-		if (process.env.NODE_ENV === "development") warnOnce(`conditional "${property}" needs its composite property; dropping it`);
+		if (!isProd && process.env.NODE_ENV === "development") warnOnce(`conditional "${property}" needs its composite property; dropping it`);
 		return true;
 	}
 	if (value === "safe") {