@depup/react-email 5.2.10-depup.1 → 6.9.1-depup.0

package/dist/components/tailwind/utils/css/downlevel-for-email-clients.cjs

@@ -0,0 +1,127 @@
+require("../../../../_virtual/_rolldown/runtime.cjs");
+const require_constants = require("./constants.cjs");
+let css_tree = require("css-tree");
+//#region src/components/tailwind/utils/css/downlevel-for-email-clients.ts
+/**
+* Downlevels modern CSS features that email clients don't support,
+* operating on a css-tree StyleSheet AST.
+*
+* 1. CSS Nesting: unnests @media rules from inside selectors
+*    `.sm_p-4{@media (min-width:40rem){padding:1rem!important}}`
+*    → `@media (min-width:40rem){.sm_p-4{padding:1rem!important}}`
+*
+* 2. Media Queries Level 4 range syntax → legacy min-width/max-width
+*    `(width>=40rem)` → `(min-width:40rem)`
+*
+* Gmail, Outlook, Yahoo, and most email clients don't support either feature.
+* See: https://www.caniemail.com/features/css-at-media/
+*      https://www.caniemail.com/features/css-nesting/
+*/
+/**
+* Unnest @media at-rules from inside regular rules, and downlevel
+* range media query syntax to legacy min-width/max-width.
+*
+* Mutates the stylesheet in place.
+*/
+function downlevelForEmailClients(styleSheet) {
+	unnestMediaQueries(styleSheet);
+	downlevelRangeMediaQueries(styleSheet);
+}
+/**
+* Walk the stylesheet and unnest any @media/@supports rules that are nested
+* inside regular rules. For each, the parent Rule's selector wraps the
+* at-rule's body.
+*
+* Before: `.sm_p-4 { @media (...) { padding: 1rem } }`
+* After:  `@media (...) { .sm_p-4 { padding: 1rem } }`
+*/
+function unnestMediaQueries(styleSheet) {
+	const transforms = [];
+	(0, css_tree.walk)(styleSheet, {
+		visit: "Rule",
+		enter(rule, item, list) {
+			if (!rule.block || !item) return;
+			const nestedAtrules = [];
+			const remainingChildren = [];
+			rule.block.children.forEach((child) => {
+				if (child.type === "Atrule" && require_constants.NON_INLINABLE_ATRULES.has(child.name.toLowerCase())) nestedAtrules.push(child);
+				else remainingChildren.push(child);
+			});
+			if (nestedAtrules.length > 0) transforms.push({
+				parentRule: rule,
+				parentItem: item,
+				parentList: list,
+				nestedAtrules,
+				remainingChildren
+			});
+		}
+	});
+	for (let i = transforms.length - 1; i >= 0; i--) {
+		const { parentRule, parentItem, parentList, nestedAtrules, remainingChildren } = transforms[i];
+		const replacements = new css_tree.List();
+		if (remainingChildren.length > 0) {
+			parentRule.block.children = new css_tree.List().fromArray(remainingChildren);
+			replacements.appendData(parentRule);
+		}
+		for (const atrule of nestedAtrules) {
+			const wrappedRule = {
+				type: "Rule",
+				prelude: (0, css_tree.clone)(parentRule.prelude),
+				block: {
+					type: "Block",
+					children: atrule.block ? atrule.block.children : new css_tree.List()
+				}
+			};
+			const newAtrule = {
+				type: "Atrule",
+				name: atrule.name,
+				prelude: atrule.prelude,
+				block: {
+					type: "Block",
+					children: new css_tree.List().fromArray([wrappedRule])
+				}
+			};
+			replacements.appendData(newAtrule);
+		}
+		parentList.replace(parentItem, replacements);
+	}
+}
+/**
+* Walk all nodes and downlevel range syntax (`FeatureRange`) inside @media
+* preludes to legacy `Feature` nodes (`min-width` / `max-width`).
+*/
+function downlevelRangeMediaQueries(styleSheet) {
+	const replacements = [];
+	(0, css_tree.walk)(styleSheet, { enter(originalNode, item) {
+		const node = originalNode;
+		if (item && node.type === "FeatureRange") {
+			const replacement = downlevelFeatureRange(node);
+			if (replacement) replacements.push({
+				item,
+				replacement
+			});
+		}
+	} });
+	for (const { item, replacement } of replacements) item.data = replacement;
+}
+/**
+* Convert a `FeatureRange` node to a `Feature` node (legacy min-/max- syntax).
+*
+* For `width >= 40rem`: left=Identifier("width"), leftComparison=">=", middle=Dimension("40","rem")
+* Result: { type: "Feature", name: "min-width", value: Dimension("40","rem") }
+*/
+function downlevelFeatureRange(range) {
+	if (range.left.type !== "Identifier") return null;
+	let prefix;
+	if (range.leftComparison === ">=" || range.leftComparison === ">") prefix = "min-";
+	else if (range.leftComparison === "<=" || range.leftComparison === "<") prefix = "max-";
+	else return null;
+	return {
+		type: "Feature",
+		kind: "media",
+		name: `${prefix}${range.left.name}`,
+		value: range.middle
+	};
+}
+//#endregion
+exports.downlevelForEmailClients = downlevelForEmailClients;

package/dist/components/tailwind/utils/css/downlevel-for-email-clients.mjs

@@ -0,0 +1,126 @@
+import { NON_INLINABLE_ATRULES } from "./constants.mjs";
+import { List, clone, walk } from "css-tree/dist/csstree.esm";
+//#region src/components/tailwind/utils/css/downlevel-for-email-clients.ts
+/**
+* Downlevels modern CSS features that email clients don't support,
+* operating on a css-tree StyleSheet AST.
+*
+* 1. CSS Nesting: unnests @media rules from inside selectors
+*    `.sm_p-4{@media (min-width:40rem){padding:1rem!important}}`
+*    → `@media (min-width:40rem){.sm_p-4{padding:1rem!important}}`
+*
+* 2. Media Queries Level 4 range syntax → legacy min-width/max-width
+*    `(width>=40rem)` → `(min-width:40rem)`
+*
+* Gmail, Outlook, Yahoo, and most email clients don't support either feature.
+* See: https://www.caniemail.com/features/css-at-media/
+*      https://www.caniemail.com/features/css-nesting/
+*/
+/**
+* Unnest @media at-rules from inside regular rules, and downlevel
+* range media query syntax to legacy min-width/max-width.
+*
+* Mutates the stylesheet in place.
+*/
+function downlevelForEmailClients(styleSheet) {
+	unnestMediaQueries(styleSheet);
+	downlevelRangeMediaQueries(styleSheet);
+}
+/**
+* Walk the stylesheet and unnest any @media/@supports rules that are nested
+* inside regular rules. For each, the parent Rule's selector wraps the
+* at-rule's body.
+*
+* Before: `.sm_p-4 { @media (...) { padding: 1rem } }`
+* After:  `@media (...) { .sm_p-4 { padding: 1rem } }`
+*/
+function unnestMediaQueries(styleSheet) {
+	const transforms = [];
+	walk(styleSheet, {
+		visit: "Rule",
+		enter(rule, item, list) {
+			if (!rule.block || !item) return;
+			const nestedAtrules = [];
+			const remainingChildren = [];
+			rule.block.children.forEach((child) => {
+				if (child.type === "Atrule" && NON_INLINABLE_ATRULES.has(child.name.toLowerCase())) nestedAtrules.push(child);
+				else remainingChildren.push(child);
+			});
+			if (nestedAtrules.length > 0) transforms.push({
+				parentRule: rule,
+				parentItem: item,
+				parentList: list,
+				nestedAtrules,
+				remainingChildren
+			});
+		}
+	});
+	for (let i = transforms.length - 1; i >= 0; i--) {
+		const { parentRule, parentItem, parentList, nestedAtrules, remainingChildren } = transforms[i];
+		const replacements = new List();
+		if (remainingChildren.length > 0) {
+			parentRule.block.children = new List().fromArray(remainingChildren);
+			replacements.appendData(parentRule);
+		}
+		for (const atrule of nestedAtrules) {
+			const wrappedRule = {
+				type: "Rule",
+				prelude: clone(parentRule.prelude),
+				block: {
+					type: "Block",
+					children: atrule.block ? atrule.block.children : new List()
+				}
+			};
+			const newAtrule = {
+				type: "Atrule",
+				name: atrule.name,
+				prelude: atrule.prelude,
+				block: {
+					type: "Block",
+					children: new List().fromArray([wrappedRule])
+				}
+			};
+			replacements.appendData(newAtrule);
+		}
+		parentList.replace(parentItem, replacements);
+	}
+}
+/**
+* Walk all nodes and downlevel range syntax (`FeatureRange`) inside @media
+* preludes to legacy `Feature` nodes (`min-width` / `max-width`).
+*/
+function downlevelRangeMediaQueries(styleSheet) {
+	const replacements = [];
+	walk(styleSheet, { enter(originalNode, item) {
+		const node = originalNode;
+		if (item && node.type === "FeatureRange") {
+			const replacement = downlevelFeatureRange(node);
+			if (replacement) replacements.push({
+				item,
+				replacement
+			});
+		}
+	} });
+	for (const { item, replacement } of replacements) item.data = replacement;
+}
+/**
+* Convert a `FeatureRange` node to a `Feature` node (legacy min-/max- syntax).
+*
+* For `width >= 40rem`: left=Identifier("width"), leftComparison=">=", middle=Dimension("40","rem")
+* Result: { type: "Feature", name: "min-width", value: Dimension("40","rem") }
+*/
+function downlevelFeatureRange(range) {
+	if (range.left.type !== "Identifier") return null;
+	let prefix;
+	if (range.leftComparison === ">=" || range.leftComparison === ">") prefix = "min-";
+	else if (range.leftComparison === "<=" || range.leftComparison === "<") prefix = "max-";
+	else return null;
+	return {
+		type: "Feature",
+		kind: "media",
+		name: `${prefix}${range.left.name}`,
+		value: range.middle
+	};
+}
+//#endregion
+export { downlevelForEmailClients };

package/dist/components/tailwind/utils/css/extract-rules-per-class.cjs

@@ -0,0 +1,88 @@
+require("../../../../_virtual/_rolldown/runtime.cjs");
+const require_constants = require("./constants.cjs");
+const require_is_rule_inlinable = require("./is-rule-inlinable.cjs");
+const require_split_mixed_rule = require("./split-mixed-rule.cjs");
+let css_tree = require("css-tree");
+//#region src/components/tailwind/utils/css/extract-rules-per-class.ts
+/**
+* Re-nest the at-rule(s) back inside the rule so the pipeline stays
+* version-agnostic across Tailwind's variant shape change.
+* See https://github.com/resend/react-email/issues/3662
+*/
+function nestAtRulesInsideRule(rule, enclosingAtRules) {
+	let children = (0, css_tree.clone)(rule).block.children;
+	for (let i = enclosingAtRules.length - 1; i >= 0; i--) {
+		const atRule = enclosingAtRules[i];
+		const wrapped = {
+			type: "Atrule",
+			name: atRule.name,
+			prelude: atRule.prelude ? (0, css_tree.clone)(atRule.prelude) : null,
+			block: {
+				type: "Block",
+				children
+			}
+		};
+		children = new css_tree.List().fromArray([wrapped]);
+	}
+	return {
+		type: "Rule",
+		prelude: (0, css_tree.clone)(rule.prelude),
+		block: {
+			type: "Block",
+			children
+		}
+	};
+}
+function extractRulesPerClass(root, classes) {
+	const classSet = new Set(classes);
+	const inlinableRules = /* @__PURE__ */ new Map();
+	const nonInlinableRules = /* @__PURE__ */ new Map();
+	const appendRule = (map, className, rule) => {
+		const existing = map.get(className);
+		if (existing) existing.push(rule);
+		else map.set(className, [rule]);
+	};
+	const enclosingAtRules = [];
+	const handleRule = (rule) => {
+		const firstSelector = rule.prelude.type === "SelectorList" ? rule.prelude.children.first : null;
+		if (firstSelector?.type === "Selector" && firstSelector.children.first?.type === "NestingSelector") return;
+		const selectorClasses = [];
+		(0, css_tree.walk)(rule.prelude, {
+			visit: "ClassSelector",
+			enter(classSelector) {
+				selectorClasses.push(css_tree.string.decode(classSelector.name));
+			}
+		});
+		if (enclosingAtRules.length > 0) {
+			const nonInlinablePart = nestAtRulesInsideRule(rule, enclosingAtRules);
+			for (const className of selectorClasses) if (classSet.has(className)) appendRule(nonInlinableRules, className, nonInlinablePart);
+			return;
+		}
+		if (require_is_rule_inlinable.isRuleInlinable(rule)) {
+			for (const className of selectorClasses) if (classSet.has(className)) appendRule(inlinableRules, className, rule);
+		} else {
+			const { inlinablePart, nonInlinablePart } = require_split_mixed_rule.splitMixedRule(rule);
+			for (const className of selectorClasses) {
+				if (!classSet.has(className)) continue;
+				if (inlinablePart) appendRule(inlinableRules, className, inlinablePart);
+				if (nonInlinablePart) appendRule(nonInlinableRules, className, nonInlinablePart);
+			}
+		}
+	};
+	(0, css_tree.walk)(root, {
+		enter(node) {
+			if (node.type === "Atrule") {
+				if (require_constants.NON_INLINABLE_ATRULES.has(node.name.toLowerCase())) enclosingAtRules.push(node);
+			} else if (node.type === "Rule") handleRule(node);
+		},
+		leave(node) {
+			if (node.type === "Atrule" && require_constants.NON_INLINABLE_ATRULES.has(node.name.toLowerCase())) enclosingAtRules.pop();
+		}
+	});
+	return {
+		inlinable: inlinableRules,
+		nonInlinable: nonInlinableRules
+	};
+}
+//#endregion
+exports.extractRulesPerClass = extractRulesPerClass;

package/dist/components/tailwind/utils/css/extract-rules-per-class.mjs

@@ -0,0 +1,87 @@
+import { NON_INLINABLE_ATRULES } from "./constants.mjs";
+import { isRuleInlinable } from "./is-rule-inlinable.mjs";
+import { splitMixedRule } from "./split-mixed-rule.mjs";
+import { List, clone, string, walk } from "css-tree/dist/csstree.esm";
+//#region src/components/tailwind/utils/css/extract-rules-per-class.ts
+/**
+* Re-nest the at-rule(s) back inside the rule so the pipeline stays
+* version-agnostic across Tailwind's variant shape change.
+* See https://github.com/resend/react-email/issues/3662
+*/
+function nestAtRulesInsideRule(rule, enclosingAtRules) {
+	let children = clone(rule).block.children;
+	for (let i = enclosingAtRules.length - 1; i >= 0; i--) {
+		const atRule = enclosingAtRules[i];
+		const wrapped = {
+			type: "Atrule",
+			name: atRule.name,
+			prelude: atRule.prelude ? clone(atRule.prelude) : null,
+			block: {
+				type: "Block",
+				children
+			}
+		};
+		children = new List().fromArray([wrapped]);
+	}
+	return {
+		type: "Rule",
+		prelude: clone(rule.prelude),
+		block: {
+			type: "Block",
+			children
+		}
+	};
+}
+function extractRulesPerClass(root, classes) {
+	const classSet = new Set(classes);
+	const inlinableRules = /* @__PURE__ */ new Map();
+	const nonInlinableRules = /* @__PURE__ */ new Map();
+	const appendRule = (map, className, rule) => {
+		const existing = map.get(className);
+		if (existing) existing.push(rule);
+		else map.set(className, [rule]);
+	};
+	const enclosingAtRules = [];
+	const handleRule = (rule) => {
+		const firstSelector = rule.prelude.type === "SelectorList" ? rule.prelude.children.first : null;
+		if (firstSelector?.type === "Selector" && firstSelector.children.first?.type === "NestingSelector") return;
+		const selectorClasses = [];
+		walk(rule.prelude, {
+			visit: "ClassSelector",
+			enter(classSelector) {
+				selectorClasses.push(string.decode(classSelector.name));
+			}
+		});
+		if (enclosingAtRules.length > 0) {
+			const nonInlinablePart = nestAtRulesInsideRule(rule, enclosingAtRules);
+			for (const className of selectorClasses) if (classSet.has(className)) appendRule(nonInlinableRules, className, nonInlinablePart);
+			return;
+		}
+		if (isRuleInlinable(rule)) {
+			for (const className of selectorClasses) if (classSet.has(className)) appendRule(inlinableRules, className, rule);
+		} else {
+			const { inlinablePart, nonInlinablePart } = splitMixedRule(rule);
+			for (const className of selectorClasses) {
+				if (!classSet.has(className)) continue;
+				if (inlinablePart) appendRule(inlinableRules, className, inlinablePart);
+				if (nonInlinablePart) appendRule(nonInlinableRules, className, nonInlinablePart);
+			}
+		}
+	};
+	walk(root, {
+		enter(node) {
+			if (node.type === "Atrule") {
+				if (NON_INLINABLE_ATRULES.has(node.name.toLowerCase())) enclosingAtRules.push(node);
+			} else if (node.type === "Rule") handleRule(node);
+		},
+		leave(node) {
+			if (node.type === "Atrule" && NON_INLINABLE_ATRULES.has(node.name.toLowerCase())) enclosingAtRules.pop();
+		}
+	});
+	return {
+		inlinable: inlinableRules,
+		nonInlinable: nonInlinableRules
+	};
+}
+//#endregion
+export { extractRulesPerClass };

package/dist/components/tailwind/utils/css/get-custom-properties.cjs

@@ -0,0 +1,35 @@
+require("../../../../_virtual/_rolldown/runtime.cjs");
+let css_tree = require("css-tree");
+//#region src/components/tailwind/utils/css/get-custom-properties.ts
+function getCustomProperties(node) {
+	const customProperties = /* @__PURE__ */ new Map();
+	(0, css_tree.walk)(node, {
+		visit: "Atrule",
+		enter(atrule) {
+			if (atrule.name === "property" && atrule.prelude) {
+				const prelude = (0, css_tree.generate)(atrule.prelude);
+				if (prelude.startsWith("--")) {
+					let syntax;
+					let inherits;
+					let initialValue;
+					(0, css_tree.walk)(atrule, {
+						visit: "Declaration",
+						enter(declaration) {
+							if (declaration.property === "syntax") syntax = declaration;
+							if (declaration.property === "inherits") inherits = declaration;
+							if (declaration.property === "initial-value") initialValue = declaration;
+						}
+					});
+					customProperties.set(prelude, {
+						syntax,
+						inherits,
+						initialValue
+					});
+				}
+			}
+		}
+	});
+	return customProperties;
+}
+//#endregion
+exports.getCustomProperties = getCustomProperties;

package/dist/components/tailwind/utils/css/get-custom-properties.mjs

@@ -0,0 +1,34 @@
+import { generate, walk } from "css-tree/dist/csstree.esm";
+//#region src/components/tailwind/utils/css/get-custom-properties.ts
+function getCustomProperties(node) {
+	const customProperties = /* @__PURE__ */ new Map();
+	walk(node, {
+		visit: "Atrule",
+		enter(atrule) {
+			if (atrule.name === "property" && atrule.prelude) {
+				const prelude = generate(atrule.prelude);
+				if (prelude.startsWith("--")) {
+					let syntax;
+					let inherits;
+					let initialValue;
+					walk(atrule, {
+						visit: "Declaration",
+						enter(declaration) {
+							if (declaration.property === "syntax") syntax = declaration;
+							if (declaration.property === "inherits") inherits = declaration;
+							if (declaration.property === "initial-value") initialValue = declaration;
+						}
+					});
+					customProperties.set(prelude, {
+						syntax,
+						inherits,
+						initialValue
+					});
+				}
+			}
+		}
+	});
+	return customProperties;
+}
+//#endregion
+export { getCustomProperties };

package/dist/components/tailwind/utils/css/is-part-inlinable.cjs

@@ -0,0 +1,10 @@
+require("../../../../_virtual/_rolldown/runtime.cjs");
+let css_tree = require("css-tree");
+//#region src/components/tailwind/utils/css/is-part-inlinable.ts
+function isPartInlinable(part) {
+	const hasAtRuleInside = (0, css_tree.find)(part, (node) => node.type === "Atrule") !== null;
+	const hasPseudoSelector = (0, css_tree.find)(part, (node) => node.type === "PseudoClassSelector" || node.type === "PseudoElementSelector") !== null;
+	return !hasAtRuleInside && !hasPseudoSelector;
+}
+//#endregion
+exports.isPartInlinable = isPartInlinable;

package/dist/components/tailwind/utils/css/is-part-inlinable.mjs

@@ -0,0 +1,9 @@
+import { find } from "css-tree/dist/csstree.esm";
+//#region src/components/tailwind/utils/css/is-part-inlinable.ts
+function isPartInlinable(part) {
+	const hasAtRuleInside = find(part, (node) => node.type === "Atrule") !== null;
+	const hasPseudoSelector = find(part, (node) => node.type === "PseudoClassSelector" || node.type === "PseudoElementSelector") !== null;
+	return !hasAtRuleInside && !hasPseudoSelector;
+}
+//#endregion
+export { isPartInlinable };

package/dist/components/tailwind/utils/css/is-rule-inlinable.cjs

@@ -0,0 +1,10 @@
+require("../../../../_virtual/_rolldown/runtime.cjs");
+let css_tree = require("css-tree");
+//#region src/components/tailwind/utils/css/is-rule-inlinable.ts
+function isRuleInlinable(rule) {
+	const hasAtRuleInside = (0, css_tree.find)(rule, (node) => node.type === "Atrule") !== null;
+	const hasPseudoSelector = (0, css_tree.find)(rule, (node) => node.type === "PseudoClassSelector" || node.type === "PseudoElementSelector") !== null;
+	return !hasAtRuleInside && !hasPseudoSelector;
+}
+//#endregion
+exports.isRuleInlinable = isRuleInlinable;

package/dist/components/tailwind/utils/css/is-rule-inlinable.mjs

@@ -0,0 +1,9 @@
+import { find } from "css-tree/dist/csstree.esm";
+//#region src/components/tailwind/utils/css/is-rule-inlinable.ts
+function isRuleInlinable(rule) {
+	const hasAtRuleInside = find(rule, (node) => node.type === "Atrule") !== null;
+	const hasPseudoSelector = find(rule, (node) => node.type === "PseudoClassSelector" || node.type === "PseudoElementSelector") !== null;
+	return !hasAtRuleInside && !hasPseudoSelector;
+}
+//#endregion
+export { isRuleInlinable };

package/dist/components/tailwind/utils/css/make-inline-styles-for.cjs

@@ -0,0 +1,52 @@
+require("../../../../_virtual/_rolldown/runtime.cjs");
+const require_get_react_property = require("../compatibility/get-react-property.cjs");
+const require_strip_empty_tailwind_vars = require("./strip-empty-tailwind-vars.cjs");
+const require_unwrap_value = require("./unwrap-value.cjs");
+let css_tree = require("css-tree");
+//#region src/components/tailwind/utils/css/make-inline-styles-for.ts
+function makeInlineStylesFor(inlinableRules, customProperties) {
+	const styles = {};
+	const localVariableDeclarations = /* @__PURE__ */ new Map();
+	for (const rule of inlinableRules) (0, css_tree.walk)(rule, {
+		visit: "Declaration",
+		enter(declaration) {
+			if (declaration.property.startsWith("--")) localVariableDeclarations.set(declaration.property, declaration);
+		}
+	});
+	for (const rule of inlinableRules) {
+		(0, css_tree.walk)(rule, {
+			visit: "Function",
+			enter(func, funcParentListItem) {
+				if (func.name === "var") {
+					let variableName;
+					(0, css_tree.walk)(func, {
+						visit: "Identifier",
+						enter(identifier) {
+							variableName = identifier.name;
+							return this.break;
+						}
+					});
+					if (variableName) {
+						const definition = localVariableDeclarations.get(variableName);
+						if (definition) funcParentListItem.data = require_unwrap_value.unwrapValue(definition.value);
+						else {
+							const customProperty = customProperties.get(variableName);
+							if (customProperty?.initialValue) funcParentListItem.data = require_unwrap_value.unwrapValue(customProperty.initialValue.value);
+						}
+					}
+				}
+			}
+		});
+		(0, css_tree.walk)(rule, {
+			visit: "Declaration",
+			enter(declaration) {
+				if (declaration.property.startsWith("--")) return;
+				require_strip_empty_tailwind_vars.stripEmptyTailwindVars(declaration.value);
+				styles[require_get_react_property.getReactProperty(declaration.property)] = (0, css_tree.generate)(declaration.value).trim() + (declaration.important ? "!important" : "");
+			}
+		});
+	}
+	return styles;
+}
+//#endregion
+exports.makeInlineStylesFor = makeInlineStylesFor;

package/dist/components/tailwind/utils/css/make-inline-styles-for.mjs

@@ -0,0 +1,51 @@
+import { getReactProperty } from "../compatibility/get-react-property.mjs";
+import { stripEmptyTailwindVars } from "./strip-empty-tailwind-vars.mjs";
+import { unwrapValue } from "./unwrap-value.mjs";
+import { generate, walk } from "css-tree/dist/csstree.esm";
+//#region src/components/tailwind/utils/css/make-inline-styles-for.ts
+function makeInlineStylesFor(inlinableRules, customProperties) {
+	const styles = {};
+	const localVariableDeclarations = /* @__PURE__ */ new Map();
+	for (const rule of inlinableRules) walk(rule, {
+		visit: "Declaration",
+		enter(declaration) {
+			if (declaration.property.startsWith("--")) localVariableDeclarations.set(declaration.property, declaration);
+		}
+	});
+	for (const rule of inlinableRules) {
+		walk(rule, {
+			visit: "Function",
+			enter(func, funcParentListItem) {
+				if (func.name === "var") {
+					let variableName;
+					walk(func, {
+						visit: "Identifier",
+						enter(identifier) {
+							variableName = identifier.name;
+							return this.break;
+						}
+					});
+					if (variableName) {
+						const definition = localVariableDeclarations.get(variableName);
+						if (definition) funcParentListItem.data = unwrapValue(definition.value);
+						else {
+							const customProperty = customProperties.get(variableName);
+							if (customProperty?.initialValue) funcParentListItem.data = unwrapValue(customProperty.initialValue.value);
+						}
+					}
+				}
+			}
+		});
+		walk(rule, {
+			visit: "Declaration",
+			enter(declaration) {
+				if (declaration.property.startsWith("--")) return;
+				stripEmptyTailwindVars(declaration.value);
+				styles[getReactProperty(declaration.property)] = generate(declaration.value).trim() + (declaration.important ? "!important" : "");
+			}
+		});
+	}
+	return styles;
+}
+//#endregion
+export { makeInlineStylesFor };