@tenphi/tasty 2.6.4 → 2.6.5

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.
Files changed (38) hide show
  1. package/dist/{collector-C-keQH9m.js → collector-c00_hT9R.js} +3 -3
  2. package/dist/{collector-C-keQH9m.js.map → collector-c00_hT9R.js.map} +1 -1
  3. package/dist/{config-BBiyxMCe.js → config-IzenlK2R.js} +278 -238
  4. package/dist/config-IzenlK2R.js.map +1 -0
  5. package/dist/core/index.d.ts +2 -2
  6. package/dist/core/index.js +6 -6
  7. package/dist/{core-BO4319td.js → core-J9U8fXzr.js} +5 -5
  8. package/dist/core-J9U8fXzr.js.map +1 -0
  9. package/dist/{css-writer-BWvwQzz0.js → css-writer-CCyaR6ZM.js} +3 -3
  10. package/dist/css-writer-CCyaR6ZM.js.map +1 -0
  11. package/dist/{format-rules-BSjeH4Z7.js → format-rules-CCb7qNPt.js} +2 -2
  12. package/dist/{format-rules-BSjeH4Z7.js.map → format-rules-CCb7qNPt.js.map} +1 -1
  13. package/dist/{hydrate-CcvrP4qJ.js → hydrate-DEsdmcdy.js} +2 -2
  14. package/dist/{hydrate-CcvrP4qJ.js.map → hydrate-DEsdmcdy.js.map} +1 -1
  15. package/dist/{index-B_k47mc_.d.ts → index-D-OA_O6i.d.ts} +95 -2
  16. package/dist/index.d.ts +2 -2
  17. package/dist/index.js +7 -7
  18. package/dist/index.js.map +1 -1
  19. package/dist/{keyframes-BUQhdOSJ.js → keyframes-DxAp6xwG.js} +10 -3
  20. package/dist/keyframes-DxAp6xwG.js.map +1 -0
  21. package/dist/{merge-styles-Cd2vBl9b.js → merge-styles-Ugifi570.js} +2 -2
  22. package/dist/{merge-styles-Cd2vBl9b.js.map → merge-styles-Ugifi570.js.map} +1 -1
  23. package/dist/{resolve-recipes-C1nrvnYh.js → resolve-recipes-DEmQhiop.js} +3 -3
  24. package/dist/{resolve-recipes-C1nrvnYh.js.map → resolve-recipes-DEmQhiop.js.map} +1 -1
  25. package/dist/ssr/astro-client.js +1 -1
  26. package/dist/ssr/astro.js +3 -3
  27. package/dist/ssr/index.js +3 -3
  28. package/dist/ssr/next.js +4 -4
  29. package/dist/static/index.js +1 -1
  30. package/dist/zero/babel.js +4 -4
  31. package/dist/zero/index.js +1 -1
  32. package/docs/pipeline.md +9 -2
  33. package/package.json +11 -2
  34. package/tasty.config.ts +1 -0
  35. package/dist/config-BBiyxMCe.js.map +0 -1
  36. package/dist/core-BO4319td.js.map +0 -1
  37. package/dist/css-writer-BWvwQzz0.js.map +0 -1
  38. package/dist/keyframes-BUQhdOSJ.js.map +0 -1
@@ -55,6 +55,223 @@ function canonicalFuncName(lowered) {
55
55
  return CANONICAL_FUNC_CASE.get(lowered) ?? lowered;
56
56
  }
57
57
  //#endregion
58
+ //#region src/properties/index.ts
59
+ const PROPERTIES_KEY = "@properties";
60
+ /**
61
+ * Valid CSS custom property name pattern (after the -- prefix).
62
+ * Must start with a letter or underscore, followed by letters, digits, hyphens, or underscores.
63
+ */
64
+ const VALID_PROPERTY_NAME_PATTERN = /^[a-z_][a-z0-9-_]*$/i;
65
+ /**
66
+ * Validate a CSS custom property name (the part after --).
67
+ * Returns true if the name is valid for use as a CSS custom property.
68
+ */
69
+ function isValidPropertyName(name) {
70
+ return VALID_PROPERTY_NAME_PATTERN.test(name);
71
+ }
72
+ /**
73
+ * Check if styles object has local @properties definition.
74
+ * Fast path: single property lookup.
75
+ */
76
+ function hasLocalProperties(styles) {
77
+ return PROPERTIES_KEY in styles;
78
+ }
79
+ /**
80
+ * Extract local @properties from styles object.
81
+ * Returns null if no local properties (fast path).
82
+ */
83
+ function extractLocalProperties(styles) {
84
+ const properties = styles[PROPERTIES_KEY];
85
+ if (!properties || typeof properties !== "object") return null;
86
+ return properties;
87
+ }
88
+ /**
89
+ * Parse a property token name and return the CSS property name and whether it's a color.
90
+ * Supports tasty token syntax and validates the property name.
91
+ *
92
+ * Token formats:
93
+ * - `$name` → { cssName: '--name', isColor: false }
94
+ * - `#name` → { cssName: '--name-color', isColor: true }
95
+ * - `--name` → { cssName: '--name', isColor: false } (legacy, auto-detect color by suffix)
96
+ * - `name` → { cssName: '--name', isColor: false } (legacy)
97
+ *
98
+ * @param token - The property token to parse
99
+ * @returns Parsed result with cssName, isColor, isValid, and optional error
100
+ */
101
+ function parsePropertyToken(token) {
102
+ if (!token || typeof token !== "string") return {
103
+ cssName: "",
104
+ isColor: false,
105
+ isValid: false,
106
+ error: "Property token must be a non-empty string"
107
+ };
108
+ let name;
109
+ let isColor;
110
+ if (token.startsWith("$")) {
111
+ name = token.slice(1);
112
+ isColor = false;
113
+ } else if (token.startsWith("#")) {
114
+ name = token.slice(1);
115
+ isColor = true;
116
+ } else if (token.startsWith("--")) {
117
+ name = token.slice(2);
118
+ isColor = token.endsWith("-color");
119
+ } else {
120
+ name = token;
121
+ isColor = token.endsWith("-color");
122
+ }
123
+ if (!name) return {
124
+ cssName: "",
125
+ isColor,
126
+ isValid: false,
127
+ error: "Property name cannot be empty"
128
+ };
129
+ if (!isValidPropertyName(name)) return {
130
+ cssName: "",
131
+ isColor,
132
+ isValid: false,
133
+ error: `Invalid property name "${name}". Must start with a letter or underscore, followed by letters, digits, hyphens, or underscores.`
134
+ };
135
+ let cssName;
136
+ if (token.startsWith("#")) cssName = `--${name}-color`;
137
+ else cssName = `--${name}`;
138
+ return {
139
+ cssName,
140
+ isColor,
141
+ isValid: true
142
+ };
143
+ }
144
+ /**
145
+ * Normalize a property definition to a consistent string representation.
146
+ * Used for comparing definitions to detect type conflicts.
147
+ *
148
+ * Only `syntax` and `inherits` are compared — `initialValue` is intentionally
149
+ * excluded because different components may set different defaults for the
150
+ * same typed property (e.g. auto-inferred `0px` vs explicit `6px`).
151
+ *
152
+ * Keys are sorted alphabetically to ensure consistent comparison:
153
+ * { inherits: true, syntax: '<color>' } === { syntax: '<color>', inherits: true }
154
+ */
155
+ function normalizePropertyDefinition(def) {
156
+ const normalized = {};
157
+ if (def.inherits !== void 0) normalized.inherits = def.inherits;
158
+ if (def.syntax !== void 0) normalized.syntax = def.syntax;
159
+ return JSON.stringify(normalized);
160
+ }
161
+ /**
162
+ * Get the effective property definition for a token.
163
+ * For color tokens (#name), auto-sets syntax to '<color>' and defaults initialValue to 'transparent'.
164
+ *
165
+ * @param token - Property token ($name, #name, --name, or plain name)
166
+ * @param userDefinition - User-provided definition options
167
+ * @returns Effective definition with cssName, definition, isValid, and optional error
168
+ */
169
+ function getEffectiveDefinition(token, userDefinition) {
170
+ const parsed = parsePropertyToken(token);
171
+ if (!parsed.isValid) return {
172
+ cssName: "",
173
+ definition: userDefinition,
174
+ isColor: false,
175
+ isValid: false,
176
+ error: parsed.error
177
+ };
178
+ if (parsed.isColor) return {
179
+ cssName: parsed.cssName,
180
+ definition: {
181
+ syntax: "<color>",
182
+ inherits: userDefinition.inherits,
183
+ initialValue: userDefinition.initialValue ?? "transparent"
184
+ },
185
+ isColor: true,
186
+ isValid: true
187
+ };
188
+ return {
189
+ cssName: parsed.cssName,
190
+ definition: userDefinition,
191
+ isColor: false,
192
+ isValid: true
193
+ };
194
+ }
195
+ const UNIT_TO_SYNTAX = {};
196
+ const LENGTH_UNITS = [
197
+ "px",
198
+ "em",
199
+ "rem",
200
+ "vw",
201
+ "vh",
202
+ "vmin",
203
+ "vmax",
204
+ "ch",
205
+ "ex",
206
+ "cap",
207
+ "ic",
208
+ "lh",
209
+ "rlh",
210
+ "svw",
211
+ "svh",
212
+ "lvw",
213
+ "lvh",
214
+ "dvw",
215
+ "dvh",
216
+ "cqw",
217
+ "cqh",
218
+ "cqi",
219
+ "cqb",
220
+ "cqmin",
221
+ "cqmax"
222
+ ];
223
+ const ANGLE_UNITS = [
224
+ "deg",
225
+ "rad",
226
+ "grad",
227
+ "turn"
228
+ ];
229
+ const TIME_UNITS = ["ms", "s"];
230
+ for (const u of LENGTH_UNITS) UNIT_TO_SYNTAX[u] = {
231
+ syntax: "<length-percentage>",
232
+ initialValue: "0px"
233
+ };
234
+ UNIT_TO_SYNTAX["%"] = {
235
+ syntax: "<length-percentage>",
236
+ initialValue: "0px"
237
+ };
238
+ for (const u of ANGLE_UNITS) UNIT_TO_SYNTAX[u] = {
239
+ syntax: "<angle>",
240
+ initialValue: "0deg"
241
+ };
242
+ for (const u of TIME_UNITS) UNIT_TO_SYNTAX[u] = {
243
+ syntax: "<time>",
244
+ initialValue: "0s"
245
+ };
246
+ /**
247
+ * Infer CSS @property syntax from a concrete value.
248
+ * Detects numeric types: \<number\>, \<length-percentage\>, \<angle\>, \<time\>.
249
+ * Length and percentage values both map to \<length-percentage\> for maximum flexibility.
250
+ * Color properties are handled separately via the #name token convention
251
+ * (--name-color gets \<color\> syntax automatically in getEffectiveDefinition).
252
+ *
253
+ * @param value - The CSS value to infer from (e.g. '10px', '1', '45deg')
254
+ * @returns Inferred syntax and initial value, or null if not inferable
255
+ */
256
+ function inferSyntaxFromValue(value) {
257
+ if (!value || typeof value !== "string") return null;
258
+ const trimmed = value.trim();
259
+ if (!trimmed) return null;
260
+ if (RE_NUMBER.test(trimmed)) {
261
+ if (parseFloat(trimmed) === 0) return null;
262
+ return {
263
+ syntax: "<number>",
264
+ initialValue: "0"
265
+ };
266
+ }
267
+ const unitMatch = trimmed.match(RE_RAW_UNIT);
268
+ if (unitMatch) {
269
+ const mapping = UNIT_TO_SYNTAX[unitMatch[2]];
270
+ if (mapping) return mapping;
271
+ }
272
+ return null;
273
+ }
274
+ //#endregion
58
275
  //#region src/parser/lru.ts
59
276
  var Lru = class {
60
277
  limit;
@@ -1131,223 +1348,6 @@ function getComponentPropertySyntax() {
1131
1348
  }
1132
1349
  }
1133
1350
  //#endregion
1134
- //#region src/properties/index.ts
1135
- const PROPERTIES_KEY = "@properties";
1136
- /**
1137
- * Valid CSS custom property name pattern (after the -- prefix).
1138
- * Must start with a letter or underscore, followed by letters, digits, hyphens, or underscores.
1139
- */
1140
- const VALID_PROPERTY_NAME_PATTERN = /^[a-z_][a-z0-9-_]*$/i;
1141
- /**
1142
- * Validate a CSS custom property name (the part after --).
1143
- * Returns true if the name is valid for use as a CSS custom property.
1144
- */
1145
- function isValidPropertyName(name) {
1146
- return VALID_PROPERTY_NAME_PATTERN.test(name);
1147
- }
1148
- /**
1149
- * Check if styles object has local @properties definition.
1150
- * Fast path: single property lookup.
1151
- */
1152
- function hasLocalProperties(styles) {
1153
- return PROPERTIES_KEY in styles;
1154
- }
1155
- /**
1156
- * Extract local @properties from styles object.
1157
- * Returns null if no local properties (fast path).
1158
- */
1159
- function extractLocalProperties(styles) {
1160
- const properties = styles[PROPERTIES_KEY];
1161
- if (!properties || typeof properties !== "object") return null;
1162
- return properties;
1163
- }
1164
- /**
1165
- * Parse a property token name and return the CSS property name and whether it's a color.
1166
- * Supports tasty token syntax and validates the property name.
1167
- *
1168
- * Token formats:
1169
- * - `$name` → { cssName: '--name', isColor: false }
1170
- * - `#name` → { cssName: '--name-color', isColor: true }
1171
- * - `--name` → { cssName: '--name', isColor: false } (legacy, auto-detect color by suffix)
1172
- * - `name` → { cssName: '--name', isColor: false } (legacy)
1173
- *
1174
- * @param token - The property token to parse
1175
- * @returns Parsed result with cssName, isColor, isValid, and optional error
1176
- */
1177
- function parsePropertyToken(token) {
1178
- if (!token || typeof token !== "string") return {
1179
- cssName: "",
1180
- isColor: false,
1181
- isValid: false,
1182
- error: "Property token must be a non-empty string"
1183
- };
1184
- let name;
1185
- let isColor;
1186
- if (token.startsWith("$")) {
1187
- name = token.slice(1);
1188
- isColor = false;
1189
- } else if (token.startsWith("#")) {
1190
- name = token.slice(1);
1191
- isColor = true;
1192
- } else if (token.startsWith("--")) {
1193
- name = token.slice(2);
1194
- isColor = token.endsWith("-color");
1195
- } else {
1196
- name = token;
1197
- isColor = token.endsWith("-color");
1198
- }
1199
- if (!name) return {
1200
- cssName: "",
1201
- isColor,
1202
- isValid: false,
1203
- error: "Property name cannot be empty"
1204
- };
1205
- if (!isValidPropertyName(name)) return {
1206
- cssName: "",
1207
- isColor,
1208
- isValid: false,
1209
- error: `Invalid property name "${name}". Must start with a letter or underscore, followed by letters, digits, hyphens, or underscores.`
1210
- };
1211
- let cssName;
1212
- if (token.startsWith("#")) cssName = `--${name}-color`;
1213
- else cssName = `--${name}`;
1214
- return {
1215
- cssName,
1216
- isColor,
1217
- isValid: true
1218
- };
1219
- }
1220
- /**
1221
- * Normalize a property definition to a consistent string representation.
1222
- * Used for comparing definitions to detect type conflicts.
1223
- *
1224
- * Only `syntax` and `inherits` are compared — `initialValue` is intentionally
1225
- * excluded because different components may set different defaults for the
1226
- * same typed property (e.g. auto-inferred `0px` vs explicit `6px`).
1227
- *
1228
- * Keys are sorted alphabetically to ensure consistent comparison:
1229
- * { inherits: true, syntax: '<color>' } === { syntax: '<color>', inherits: true }
1230
- */
1231
- function normalizePropertyDefinition(def) {
1232
- const normalized = {};
1233
- if (def.inherits !== void 0) normalized.inherits = def.inherits;
1234
- if (def.syntax !== void 0) normalized.syntax = def.syntax;
1235
- return JSON.stringify(normalized);
1236
- }
1237
- /**
1238
- * Get the effective property definition for a token.
1239
- * For color tokens (#name), auto-sets syntax to '<color>' and defaults initialValue to 'transparent'.
1240
- *
1241
- * @param token - Property token ($name, #name, --name, or plain name)
1242
- * @param userDefinition - User-provided definition options
1243
- * @returns Effective definition with cssName, definition, isValid, and optional error
1244
- */
1245
- function getEffectiveDefinition(token, userDefinition) {
1246
- const parsed = parsePropertyToken(token);
1247
- if (!parsed.isValid) return {
1248
- cssName: "",
1249
- definition: userDefinition,
1250
- isColor: false,
1251
- isValid: false,
1252
- error: parsed.error
1253
- };
1254
- if (parsed.isColor) return {
1255
- cssName: parsed.cssName,
1256
- definition: {
1257
- syntax: "<color>",
1258
- inherits: userDefinition.inherits,
1259
- initialValue: userDefinition.initialValue ?? "transparent"
1260
- },
1261
- isColor: true,
1262
- isValid: true
1263
- };
1264
- return {
1265
- cssName: parsed.cssName,
1266
- definition: userDefinition,
1267
- isColor: false,
1268
- isValid: true
1269
- };
1270
- }
1271
- const UNIT_TO_SYNTAX = {};
1272
- const LENGTH_UNITS = [
1273
- "px",
1274
- "em",
1275
- "rem",
1276
- "vw",
1277
- "vh",
1278
- "vmin",
1279
- "vmax",
1280
- "ch",
1281
- "ex",
1282
- "cap",
1283
- "ic",
1284
- "lh",
1285
- "rlh",
1286
- "svw",
1287
- "svh",
1288
- "lvw",
1289
- "lvh",
1290
- "dvw",
1291
- "dvh",
1292
- "cqw",
1293
- "cqh",
1294
- "cqi",
1295
- "cqb",
1296
- "cqmin",
1297
- "cqmax"
1298
- ];
1299
- const ANGLE_UNITS = [
1300
- "deg",
1301
- "rad",
1302
- "grad",
1303
- "turn"
1304
- ];
1305
- const TIME_UNITS = ["ms", "s"];
1306
- for (const u of LENGTH_UNITS) UNIT_TO_SYNTAX[u] = {
1307
- syntax: "<length-percentage>",
1308
- initialValue: "0px"
1309
- };
1310
- UNIT_TO_SYNTAX["%"] = {
1311
- syntax: "<length-percentage>",
1312
- initialValue: "0px"
1313
- };
1314
- for (const u of ANGLE_UNITS) UNIT_TO_SYNTAX[u] = {
1315
- syntax: "<angle>",
1316
- initialValue: "0deg"
1317
- };
1318
- for (const u of TIME_UNITS) UNIT_TO_SYNTAX[u] = {
1319
- syntax: "<time>",
1320
- initialValue: "0s"
1321
- };
1322
- /**
1323
- * Infer CSS @property syntax from a concrete value.
1324
- * Detects numeric types: \<number\>, \<length-percentage\>, \<angle\>, \<time\>.
1325
- * Length and percentage values both map to \<length-percentage\> for maximum flexibility.
1326
- * Color properties are handled separately via the #name token convention
1327
- * (--name-color gets \<color\> syntax automatically in getEffectiveDefinition).
1328
- *
1329
- * @param value - The CSS value to infer from (e.g. '10px', '1', '45deg')
1330
- * @returns Inferred syntax and initial value, or null if not inferable
1331
- */
1332
- function inferSyntaxFromValue(value) {
1333
- if (!value || typeof value !== "string") return null;
1334
- const trimmed = value.trim();
1335
- if (!trimmed) return null;
1336
- if (RE_NUMBER.test(trimmed)) {
1337
- if (parseFloat(trimmed) === 0) return null;
1338
- return {
1339
- syntax: "<number>",
1340
- initialValue: "0"
1341
- };
1342
- }
1343
- const unitMatch = trimmed.match(RE_RAW_UNIT);
1344
- if (unitMatch) {
1345
- const mapping = UNIT_TO_SYNTAX[unitMatch[2]];
1346
- if (mapping) return mapping;
1347
- }
1348
- return null;
1349
- }
1350
- //#endregion
1351
1351
  //#region src/utils/hash.ts
1352
1352
  /**
1353
1353
  * Fast string hash (djb2) for deduplication keys.
@@ -3783,7 +3783,7 @@ function resetHandlers() {
3783
3783
  for (const key of Object.keys(STYLE_HANDLER_MAP$1)) delete STYLE_HANDLER_MAP$1[key];
3784
3784
  for (const key of Object.keys(initialHandlerMapSnapshot)) STYLE_HANDLER_MAP$1[key] = [...initialHandlerMapSnapshot[key]];
3785
3785
  }
3786
- function defineCustomStyle$1(names, handler) {
3786
+ function defineCustomStyle(names, handler) {
3787
3787
  let handlerWithLookup;
3788
3788
  if (typeof names === "function") {
3789
3789
  handlerWithLookup = names;
@@ -3798,16 +3798,16 @@ function defineCustomStyle$1(names, handler) {
3798
3798
  STYLE_HANDLER_MAP$1[name].push(handlerWithLookup);
3799
3799
  });
3800
3800
  }
3801
- function defineStyleAlias$1(styleName, cssStyleName, converter) {
3801
+ function defineStyleAlias(styleName, cssStyleName, converter) {
3802
3802
  const styleHandler = createStyle(styleName, cssStyleName, converter);
3803
3803
  if (!STYLE_HANDLER_MAP$1[styleName]) STYLE_HANDLER_MAP$1[styleName] = [];
3804
3804
  STYLE_HANDLER_MAP$1[styleName].push(styleHandler);
3805
3805
  }
3806
3806
  function predefine() {
3807
- defineStyleAlias$1("gridAreas", "grid-template-areas");
3808
- defineStyleAlias$1("gridColumns", "grid-template-columns", columnsConverter);
3809
- defineStyleAlias$1("gridRows", "grid-template-rows", rowsConverter);
3810
- defineStyleAlias$1("gridTemplate", "grid-template", (val) => {
3807
+ defineStyleAlias("gridAreas", "grid-template-areas");
3808
+ defineStyleAlias("gridColumns", "grid-template-columns", columnsConverter);
3809
+ defineStyleAlias("gridRows", "grid-template-rows", rowsConverter);
3810
+ defineStyleAlias("gridTemplate", "grid-template", (val) => {
3811
3811
  if (typeof val !== "string") return;
3812
3812
  return val.split("/").map((s, i) => (i ? columnsConverter : rowsConverter)(s)).join("/");
3813
3813
  });
@@ -3833,12 +3833,12 @@ function predefine() {
3833
3833
  scrollbarStyle,
3834
3834
  fadeStyle,
3835
3835
  insetStyle
3836
- ].forEach((handler) => defineCustomStyle$1(handler));
3836
+ ].forEach((handler) => defineCustomStyle(handler));
3837
3837
  captureInitialHandlerState();
3838
3838
  return {
3839
3839
  STYLE_HANDLER_MAP: STYLE_HANDLER_MAP$1,
3840
- defineCustomStyle: defineCustomStyle$1,
3841
- defineStyleAlias: defineStyleAlias$1
3840
+ defineCustomStyle,
3841
+ defineStyleAlias
3842
3842
  };
3843
3843
  }
3844
3844
  /**
@@ -3969,7 +3969,7 @@ const styleHandlers = {
3969
3969
  };
3970
3970
  //#endregion
3971
3971
  //#region src/styles/index.ts
3972
- const { STYLE_HANDLER_MAP, defineCustomStyle, defineStyleAlias } = predefine();
3972
+ const { STYLE_HANDLER_MAP } = predefine();
3973
3973
  //#endregion
3974
3974
  //#region src/injector/sheet-manager.ts
3975
3975
  const supportsConstructableSheets = typeof CSSStyleSheet !== "undefined" && (() => {
@@ -7889,6 +7889,14 @@ function andToCSS(children) {
7889
7889
  };
7890
7890
  }
7891
7891
  /**
7892
+ * Check if a condition involves an `@supports` query (recursively).
7893
+ */
7894
+ function branchHasSupports(node) {
7895
+ if (node.kind === "state") return node.type === "supports";
7896
+ if (isCompoundCondition(node)) return node.children.some(branchHasSupports);
7897
+ return false;
7898
+ }
7899
+ /**
7892
7900
  * Make OR branches within AND children mutually exclusive.
7893
7901
  *
7894
7902
  * For an AND child that is OR(A, B), transforms it to OR(A, B & !A)
@@ -7905,9 +7913,10 @@ function makeOrBranchesExclusive(children) {
7905
7913
  if (!isCompoundCondition(child) || child.operator !== "OR") return child;
7906
7914
  if (child.children.length <= 1) return child;
7907
7915
  if (!branchesProduceDifferentContexts(child.children)) return child;
7916
+ const sortedBranches = [...child.children].sort((a, b) => (branchHasSupports(a) ? 0 : 1) - (branchHasSupports(b) ? 0 : 1));
7908
7917
  const exclusiveBranches = [];
7909
7918
  const priorBranches = [];
7910
- for (const branch of child.children) {
7919
+ for (const branch of sortedBranches) {
7911
7920
  if (priorBranches.length === 0) exclusiveBranches.push(branch);
7912
7921
  else {
7913
7922
  let exclusive = branch;
@@ -8600,7 +8609,35 @@ function hasAtRuleContext(node) {
8600
8609
  return false;
8601
8610
  }
8602
8611
  /**
8603
- * Sort OR branches to prioritize at-rule conditions first.
8612
+ * Check if a condition involves an `@supports` query.
8613
+ *
8614
+ * `@supports` is feature detection: anything ANDed with it (e.g. a
8615
+ * `@container scroll-state(...)` query that only exists when
8616
+ * `container-type: scroll-state` is supported) becomes *unknown* — not
8617
+ * simply false — when the feature is absent. So a negated supports branch
8618
+ * must be emitted first (as the bare "feature unsupported" fallback) and
8619
+ * every other negated branch must nest inside the supported scope.
8620
+ */
8621
+ function hasSupportsContext(node) {
8622
+ if (node.kind === "state") return node.type === "supports";
8623
+ if (node.kind === "compound") return node.children.some(hasSupportsContext);
8624
+ return false;
8625
+ }
8626
+ /**
8627
+ * Rank an OR branch for exclusive expansion ordering. Lower rank is
8628
+ * processed first (becomes the more "outer" / less-constrained branch):
8629
+ * 0 — branch involves `@supports` (feature-detection guard)
8630
+ * 1 — branch involves another at-rule (media / container / starting)
8631
+ * 2 — branch is pure selector context (modifiers / pseudos)
8632
+ */
8633
+ function orBranchRank(node) {
8634
+ if (hasSupportsContext(node)) return 0;
8635
+ if (hasAtRuleContext(node)) return 1;
8636
+ return 2;
8637
+ }
8638
+ /**
8639
+ * Sort OR branches to prioritize at-rule conditions first, with
8640
+ * `@supports` branches ahead of all other at-rules.
8604
8641
  *
8605
8642
  * This is critical for correct CSS generation. For `!A | !B` where A is at-rule
8606
8643
  * and B is modifier, we want:
@@ -8610,15 +8647,18 @@ function hasAtRuleContext(node) {
8610
8647
  * If we process in wrong order (!B first), we'd get:
8611
8648
  * - Branch 0: !B (modifier negation WITHOUT at-rule context - WRONG!)
8612
8649
  * - Branch 1: B & !A (at-rule negation with modifier - incomplete coverage)
8650
+ *
8651
+ * The extra `@supports`-first tier matters when a feature query guards a
8652
+ * dependent query. For `!(S & C) = !S | !C` (S = `@supports(...)`, C =
8653
+ * `@container scroll-state(...)`), `simplify` sorts the branches
8654
+ * alphabetically into `[!C, !S]`. Expanding in that order would emit `!C`
8655
+ * as a bare `@container (not scroll-state(...))` — meaningless where the
8656
+ * feature is unsupported, so the default would never apply there. Putting
8657
+ * `!S` first yields `!S | (S & !C)`: a bare supports fallback plus the
8658
+ * dependent negation nested in the supported scope.
8613
8659
  */
8614
8660
  function sortOrBranchesForExpansion(branches) {
8615
- return [...branches].sort((a, b) => {
8616
- const aHasAtRule = hasAtRuleContext(a);
8617
- const bHasAtRule = hasAtRuleContext(b);
8618
- if (aHasAtRule && !bHasAtRule) return -1;
8619
- if (!aHasAtRule && bHasAtRule) return 1;
8620
- return 0;
8621
- });
8661
+ return [...branches].sort((a, b) => orBranchRank(a) - orBranchRank(b));
8622
8662
  }
8623
8663
  /**
8624
8664
  * Expand ORs in a single entry's exclusive condition
@@ -10554,6 +10594,6 @@ function resetConfig() {
10554
10594
  delete storage[GLOBAL_INJECTOR_KEY];
10555
10595
  }
10556
10596
  //#endregion
10557
- export { parseColor as $, StyleInjector as A, strToRgb as At, styleHandlers as B, parseStateKey as C, getColorSpaceFunc as Ct, extractPredefinedStateRefs as D, getRgbValuesFromRgbaString as Dt, extractLocalPredefinedStates as E, getNamedColorHex as Et, fontFaceContentHash as F, CUSTOM_UNITS as G, warn as H, formatFontFaceRule as I, filterMods as J, DIRECTIONS as K, hasLocalFontFace as L, formatCounterStyleRule as M, hasLocalCounterStyle as N, getGlobalPredefinedStates as O, hexToRgb as Ot, extractLocalFontFace as P, normalizeColorTokenValue as Q, SheetManager as R, renderStyles as S, getColorSpaceComponents as St, createStateParserContext as T, getComponentPropertySyntax as Tt, createStyle as U, deprecationWarning as V, PropertyTypeResolver as W, getGlobalParser as X, getGlobalFuncs as Y, getGlobalPredefinedTokens as Z, markStylesGenerated as _, extractLocalProperties as _t, getGlobalCounterStyle as a, okhslPlugin as at, hasPipelineCacheEntry as b, parsePropertyToken as bt, getGlobalKeyframes as c, DEFAULT_NAME_PREFIX as ct, getNamePrefix as d, makeCounterStyleName as dt, parseStyle as et, hasGlobalKeyframes as f, makeKeyframeName as ft, isTestEnvironment as g, hashString as gt, isConfigLocked as h, isDevEnv as ht, getGlobalConfigTokens as i, okhslFunc as it, extractLocalCounterStyle as j, Lru as jt, setGlobalPredefinedStates as k, hslToRgbValues as kt, getGlobalRecipes as l, DEFAULT_ZERO_NAME_PREFIX as lt, hasStylesGenerated as m, validateNamePrefix as mt, getConfig as n, setGlobalPredefinedTokens as nt, getGlobalFontFace as o, StyleParser as ot, hasGlobalRecipes as p, tastyClassRegex as pt, customFunc as q, getEffectiveProperties as r, stringifyStyles as rt, getGlobalInjector as s, Bucket as st, configure as t, resetGlobalPredefinedTokens as tt, getGlobalStyles as u, makeClassName as ut, resetConfig as v, getEffectiveDefinition as vt, camelToKebab as w, getColorSpaceSuffix as wt, isSelector as x, colorInitialValueToComponents as xt, generateTypographyTokens as y, hasLocalProperties as yt, STYLE_HANDLER_MAP as z };
10597
+ export { parseColor as $, StyleInjector as A, hasLocalProperties as At, styleHandlers as B, parseStateKey as C, getRgbValuesFromRgbaString as Ct, extractPredefinedStateRefs as D, Lru as Dt, extractLocalPredefinedStates as E, strToRgb as Et, fontFaceContentHash as F, CUSTOM_UNITS as G, warn as H, formatFontFaceRule as I, filterMods as J, DIRECTIONS as K, hasLocalFontFace as L, formatCounterStyleRule as M, hasLocalCounterStyle as N, getGlobalPredefinedStates as O, extractLocalProperties as Ot, extractLocalFontFace as P, normalizeColorTokenValue as Q, SheetManager as R, renderStyles as S, getNamedColorHex as St, createStateParserContext as T, hslToRgbValues as Tt, createStyle as U, deprecationWarning as V, PropertyTypeResolver as W, getGlobalParser as X, getGlobalFuncs as Y, getGlobalPredefinedTokens as Z, markStylesGenerated as _, colorInitialValueToComponents as _t, getGlobalCounterStyle as a, okhslPlugin as at, hasPipelineCacheEntry as b, getColorSpaceSuffix as bt, getGlobalKeyframes as c, DEFAULT_NAME_PREFIX as ct, getNamePrefix as d, makeCounterStyleName as dt, parseStyle as et, hasGlobalKeyframes as f, makeKeyframeName as ft, isTestEnvironment as g, hashString as gt, isConfigLocked as h, isDevEnv as ht, getGlobalConfigTokens as i, okhslFunc as it, extractLocalCounterStyle as j, parsePropertyToken as jt, setGlobalPredefinedStates as k, getEffectiveDefinition as kt, getGlobalRecipes as l, DEFAULT_ZERO_NAME_PREFIX as lt, hasStylesGenerated as m, validateNamePrefix as mt, getConfig as n, setGlobalPredefinedTokens as nt, getGlobalFontFace as o, StyleParser as ot, hasGlobalRecipes as p, tastyClassRegex as pt, customFunc as q, getEffectiveProperties as r, stringifyStyles as rt, getGlobalInjector as s, Bucket as st, configure as t, resetGlobalPredefinedTokens as tt, getGlobalStyles as u, makeClassName as ut, resetConfig as v, getColorSpaceComponents as vt, camelToKebab as w, hexToRgb as wt, isSelector as x, getComponentPropertySyntax as xt, generateTypographyTokens as y, getColorSpaceFunc as yt, STYLE_HANDLER_MAP as z };
10558
10598
 
10559
- //# sourceMappingURL=config-BBiyxMCe.js.map
10599
+ //# sourceMappingURL=config-IzenlK2R.js.map