@tamagui/static 3.0.0-beta.907.1 → 3.0.0-beta.917.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/compilerHost.cjs +38 -5
- package/dist/esm/compilerHost.mjs +38 -5
- package/dist/esm/compilerHost.mjs.map +1 -1
- package/package.json +17 -17
- package/src/compilerHost.ts +68 -12
- package/types/compilerHost.d.ts.map +1 -1
|
@@ -2078,6 +2078,8 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2078
2078
|
const webConditionalCSS = [];
|
|
2079
2079
|
const webConditionalKeys = /* @__PURE__ */ new Set();
|
|
2080
2080
|
const webConditionalEntries = supportsWebConditionalClasses ? webClassEntries : [];
|
|
2081
|
+
let webInlineStyle = inlineStyle;
|
|
2082
|
+
const conditionalInlineProperties = [];
|
|
2081
2083
|
for (const entry of webConditionalEntries) {
|
|
2082
2084
|
let serializeWebTree = function(node) {
|
|
2083
2085
|
if (node.kind === "leaf") return JSON.stringify(leafClasses(node));
|
|
@@ -2094,6 +2096,7 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2094
2096
|
dependencies: []
|
|
2095
2097
|
}));
|
|
2096
2098
|
const leafArtifactsMap = /* @__PURE__ */ new Map();
|
|
2099
|
+
const leafStyles = /* @__PURE__ */ new Map();
|
|
2097
2100
|
const entryConditionalKeys = /* @__PURE__ */ new Set();
|
|
2098
2101
|
for (const leaf of leaves) {
|
|
2099
2102
|
const { branchProps, branchCompleteProps } = propsForConditional(entry, leaf.value);
|
|
@@ -2102,11 +2105,16 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2102
2105
|
return bailout(input, "local/dynamic-style-value", `Conditional ${entry.name} branch could not be resolved`, entry.value.span);
|
|
2103
2106
|
}
|
|
2104
2107
|
for (const viewPropsKey of /* @__PURE__ */ new Set([...Object.keys(branchSplit.viewProps ?? {}), ...Object.keys(split.viewProps ?? {})])) {
|
|
2105
|
-
if (viewPropsKey === "className") continue;
|
|
2108
|
+
if (viewPropsKey === "className" || viewPropsKey === "style") continue;
|
|
2106
2109
|
if (JSON.stringify(branchSplit.viewProps?.[viewPropsKey]) !== JSON.stringify(split.viewProps?.[viewPropsKey])) {
|
|
2107
2110
|
return bailout(input, "local/dynamic-style-value", `Conditional ${entry.name} branch changes ${viewPropsKey}, which conditional classes cannot express`, entry.value.span);
|
|
2108
2111
|
}
|
|
2109
2112
|
}
|
|
2113
|
+
const branchInline = branchSplit.viewProps?.style;
|
|
2114
|
+
if (branchInline !== void 0 && !staticObject(branchInline)) {
|
|
2115
|
+
return bailout(input, "local/dynamic-style-value", `Conditional ${entry.name} branch style is not a static object`, entry.value.span);
|
|
2116
|
+
}
|
|
2117
|
+
leafStyles.set(leaf, staticObject(branchInline) ? branchInline : {});
|
|
2110
2118
|
const changedKeys = /* @__PURE__ */ new Set();
|
|
2111
2119
|
for (const key of /* @__PURE__ */ new Set([...Object.keys(branchSplit.classNames ?? {}), ...Object.keys(split.classNames ?? {})])) {
|
|
2112
2120
|
if (JSON.stringify(branchSplit.classNames?.[key]) !== JSON.stringify(split.classNames?.[key])) {
|
|
@@ -2138,6 +2146,30 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2138
2146
|
});
|
|
2139
2147
|
}
|
|
2140
2148
|
for (const key of entryConditionalKeys) webConditionalKeys.add(key);
|
|
2149
|
+
const styleKeys = new Set(Object.keys(webInlineStyle ?? {}));
|
|
2150
|
+
for (const leaf of leaves) {
|
|
2151
|
+
for (const key of Object.keys(leafStyles.get(leaf) ?? {})) styleKeys.add(key);
|
|
2152
|
+
}
|
|
2153
|
+
for (const key of styleKeys) {
|
|
2154
|
+
const serialized = leaves.map((leaf) => JSON.stringify(leafStyles.get(leaf)?.[key]));
|
|
2155
|
+
if (serialized.every((value) => value === serialized[0])) {
|
|
2156
|
+
if (serialized[0] === JSON.stringify(webInlineStyle?.[key])) continue;
|
|
2157
|
+
const next = { ...webInlineStyle };
|
|
2158
|
+
if (serialized[0] === void 0) delete next[key];
|
|
2159
|
+
else next[key] = leafStyles.get(leaves[0])[key];
|
|
2160
|
+
webInlineStyle = Object.keys(next).length > 0 ? next : null;
|
|
2161
|
+
continue;
|
|
2162
|
+
}
|
|
2163
|
+
if (!tree) {
|
|
2164
|
+
return bailout(input, "local/dynamic-style-value", `Conditional ${entry.name} branch changes style, which a class table cannot express`, entry.value.span);
|
|
2165
|
+
}
|
|
2166
|
+
const serializeValue = (node) => {
|
|
2167
|
+
if (node.kind === "leaf") return String(JSON.stringify(leafStyles.get(node)?.[key]));
|
|
2168
|
+
const test = input.source.slice(node.test.start, node.test.end);
|
|
2169
|
+
return `(${test}) ? ${serializeValue(node.whenTrue)} : ${serializeValue(node.whenFalse)}`;
|
|
2170
|
+
};
|
|
2171
|
+
conditionalInlineProperties.push(`${JSON.stringify(key)}: (${serializeValue(tree)})`);
|
|
2172
|
+
}
|
|
2141
2173
|
for (const artifacts2 of leafArtifactsMap.values()) {
|
|
2142
2174
|
webConditionalCSS.push(...artifacts2.css);
|
|
2143
2175
|
}
|
|
@@ -2154,7 +2186,7 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2154
2186
|
const only = artifacts2 ? artifacts2.classes.filter((item) => !sharedInConditional.has(item)) : [];
|
|
2155
2187
|
return only.join(" ");
|
|
2156
2188
|
};
|
|
2157
|
-
if (tree) {
|
|
2189
|
+
if (leaves.every((leaf) => leafClasses(leaf) === "")) {} else if (tree) {
|
|
2158
2190
|
programClassSources.push(serializeWebTree(tree));
|
|
2159
2191
|
} else {
|
|
2160
2192
|
const table = Object.fromEntries(leaves.map((leaf) => [leaf.value, leafClasses(leaf)]));
|
|
@@ -2165,9 +2197,10 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2165
2197
|
const webClassName = [...staticClasses].join(" ");
|
|
2166
2198
|
const hasStyleProgram = programClassSources.length > 0;
|
|
2167
2199
|
const classNameExpression = hasStyleProgram ? `[${[JSON.stringify(webClassName), ...programClassSources].join(", ")}].filter(Boolean).join(" ")` : null;
|
|
2168
|
-
const
|
|
2169
|
-
const
|
|
2170
|
-
const
|
|
2200
|
+
const webInlineProperties = [...dynamicHostStyleProperties ?? [], ...conditionalInlineProperties];
|
|
2201
|
+
const serializedInlineStyle = serializedStyle(webInlineStyle, webInlineProperties);
|
|
2202
|
+
const jsxWebStyle = classNameExpression ? [`className={${classNameExpression}}`, serializedInlineStyle ? `style={${serializedInlineStyle}}` : ""].filter(Boolean).join(" ") : jsxStyleAttributes(webClassName, webInlineStyle, webInlineProperties);
|
|
2203
|
+
const objectWebStyle = classNameExpression ? [`className: ${classNameExpression}`, serializedInlineStyle ? `style: ${serializedInlineStyle}` : ""].filter(Boolean).join(", ") : objectStyleProperties(webClassName, webInlineStyle, webInlineProperties);
|
|
2171
2204
|
const webCSS = [.../* @__PURE__ */ new Set([
|
|
2172
2205
|
...artifacts.css,
|
|
2173
2206
|
...programCSS,
|
|
@@ -2053,6 +2053,8 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2053
2053
|
const webConditionalCSS = [];
|
|
2054
2054
|
const webConditionalKeys = /* @__PURE__ */ new Set();
|
|
2055
2055
|
const webConditionalEntries = supportsWebConditionalClasses ? webClassEntries : [];
|
|
2056
|
+
let webInlineStyle = inlineStyle;
|
|
2057
|
+
const conditionalInlineProperties = [];
|
|
2056
2058
|
for (const entry of webConditionalEntries) {
|
|
2057
2059
|
let serializeWebTree = function(node) {
|
|
2058
2060
|
if (node.kind === "leaf") return JSON.stringify(leafClasses(node));
|
|
@@ -2069,6 +2071,7 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2069
2071
|
dependencies: []
|
|
2070
2072
|
}));
|
|
2071
2073
|
const leafArtifactsMap = /* @__PURE__ */ new Map();
|
|
2074
|
+
const leafStyles = /* @__PURE__ */ new Map();
|
|
2072
2075
|
const entryConditionalKeys = /* @__PURE__ */ new Set();
|
|
2073
2076
|
for (const leaf of leaves) {
|
|
2074
2077
|
const { branchProps, branchCompleteProps } = propsForConditional(entry, leaf.value);
|
|
@@ -2077,11 +2080,16 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2077
2080
|
return bailout(input, "local/dynamic-style-value", `Conditional ${entry.name} branch could not be resolved`, entry.value.span);
|
|
2078
2081
|
}
|
|
2079
2082
|
for (const viewPropsKey of /* @__PURE__ */ new Set([...Object.keys(branchSplit.viewProps ?? {}), ...Object.keys(split.viewProps ?? {})])) {
|
|
2080
|
-
if (viewPropsKey === "className") continue;
|
|
2083
|
+
if (viewPropsKey === "className" || viewPropsKey === "style") continue;
|
|
2081
2084
|
if (JSON.stringify(branchSplit.viewProps?.[viewPropsKey]) !== JSON.stringify(split.viewProps?.[viewPropsKey])) {
|
|
2082
2085
|
return bailout(input, "local/dynamic-style-value", `Conditional ${entry.name} branch changes ${viewPropsKey}, which conditional classes cannot express`, entry.value.span);
|
|
2083
2086
|
}
|
|
2084
2087
|
}
|
|
2088
|
+
const branchInline = branchSplit.viewProps?.style;
|
|
2089
|
+
if (branchInline !== void 0 && !staticObject(branchInline)) {
|
|
2090
|
+
return bailout(input, "local/dynamic-style-value", `Conditional ${entry.name} branch style is not a static object`, entry.value.span);
|
|
2091
|
+
}
|
|
2092
|
+
leafStyles.set(leaf, staticObject(branchInline) ? branchInline : {});
|
|
2085
2093
|
const changedKeys = /* @__PURE__ */ new Set();
|
|
2086
2094
|
for (const key of /* @__PURE__ */ new Set([...Object.keys(branchSplit.classNames ?? {}), ...Object.keys(split.classNames ?? {})])) {
|
|
2087
2095
|
if (JSON.stringify(branchSplit.classNames?.[key]) !== JSON.stringify(split.classNames?.[key])) {
|
|
@@ -2113,6 +2121,30 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2113
2121
|
});
|
|
2114
2122
|
}
|
|
2115
2123
|
for (const key of entryConditionalKeys) webConditionalKeys.add(key);
|
|
2124
|
+
const styleKeys = new Set(Object.keys(webInlineStyle ?? {}));
|
|
2125
|
+
for (const leaf of leaves) {
|
|
2126
|
+
for (const key of Object.keys(leafStyles.get(leaf) ?? {})) styleKeys.add(key);
|
|
2127
|
+
}
|
|
2128
|
+
for (const key of styleKeys) {
|
|
2129
|
+
const serialized = leaves.map((leaf) => JSON.stringify(leafStyles.get(leaf)?.[key]));
|
|
2130
|
+
if (serialized.every((value) => value === serialized[0])) {
|
|
2131
|
+
if (serialized[0] === JSON.stringify(webInlineStyle?.[key])) continue;
|
|
2132
|
+
const next = { ...webInlineStyle };
|
|
2133
|
+
if (serialized[0] === void 0) delete next[key];
|
|
2134
|
+
else next[key] = leafStyles.get(leaves[0])[key];
|
|
2135
|
+
webInlineStyle = Object.keys(next).length > 0 ? next : null;
|
|
2136
|
+
continue;
|
|
2137
|
+
}
|
|
2138
|
+
if (!tree) {
|
|
2139
|
+
return bailout(input, "local/dynamic-style-value", `Conditional ${entry.name} branch changes style, which a class table cannot express`, entry.value.span);
|
|
2140
|
+
}
|
|
2141
|
+
const serializeValue = (node) => {
|
|
2142
|
+
if (node.kind === "leaf") return String(JSON.stringify(leafStyles.get(node)?.[key]));
|
|
2143
|
+
const test = input.source.slice(node.test.start, node.test.end);
|
|
2144
|
+
return `(${test}) ? ${serializeValue(node.whenTrue)} : ${serializeValue(node.whenFalse)}`;
|
|
2145
|
+
};
|
|
2146
|
+
conditionalInlineProperties.push(`${JSON.stringify(key)}: (${serializeValue(tree)})`);
|
|
2147
|
+
}
|
|
2116
2148
|
for (const artifacts2 of leafArtifactsMap.values()) {
|
|
2117
2149
|
webConditionalCSS.push(...artifacts2.css);
|
|
2118
2150
|
}
|
|
@@ -2129,7 +2161,7 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2129
2161
|
const only = artifacts2 ? artifacts2.classes.filter((item) => !sharedInConditional.has(item)) : [];
|
|
2130
2162
|
return only.join(" ");
|
|
2131
2163
|
};
|
|
2132
|
-
if (tree) {
|
|
2164
|
+
if (leaves.every((leaf) => leafClasses(leaf) === "")) {} else if (tree) {
|
|
2133
2165
|
programClassSources.push(serializeWebTree(tree));
|
|
2134
2166
|
} else {
|
|
2135
2167
|
const table = Object.fromEntries(leaves.map((leaf) => [leaf.value, leafClasses(leaf)]));
|
|
@@ -2140,9 +2172,10 @@ const ${nativeLocal} = require('react-native').${nativeExport};`,
|
|
|
2140
2172
|
const webClassName = [...staticClasses].join(" ");
|
|
2141
2173
|
const hasStyleProgram = programClassSources.length > 0;
|
|
2142
2174
|
const classNameExpression = hasStyleProgram ? `[${[JSON.stringify(webClassName), ...programClassSources].join(", ")}].filter(Boolean).join(" ")` : null;
|
|
2143
|
-
const
|
|
2144
|
-
const
|
|
2145
|
-
const
|
|
2175
|
+
const webInlineProperties = [...dynamicHostStyleProperties ?? [], ...conditionalInlineProperties];
|
|
2176
|
+
const serializedInlineStyle = serializedStyle(webInlineStyle, webInlineProperties);
|
|
2177
|
+
const jsxWebStyle = classNameExpression ? [`className={${classNameExpression}}`, serializedInlineStyle ? `style={${serializedInlineStyle}}` : ""].filter(Boolean).join(" ") : jsxStyleAttributes(webClassName, webInlineStyle, webInlineProperties);
|
|
2178
|
+
const objectWebStyle = classNameExpression ? [`className: ${classNameExpression}`, serializedInlineStyle ? `style: ${serializedInlineStyle}` : ""].filter(Boolean).join(", ") : objectStyleProperties(webClassName, webInlineStyle, webInlineProperties);
|
|
2146
2179
|
const webCSS = [.../* @__PURE__ */ new Set([
|
|
2147
2180
|
...artifacts.css,
|
|
2148
2181
|
...programCSS,
|