@csszyx/runtime 0.10.1 → 0.10.3

package/dist/index.cjs

@@ -1201,7 +1201,7 @@ function omit(classes, selector) {
 function classifySzKey(key) {
   return BOX_ROLE_BY_KEY.get(key);
 }
-function isPlainObject(value) {
+function isPlainObject$1(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function matchesKey(key, entry, selector) {
@@ -1222,7 +1222,7 @@ function mergeSzInto(target, source, depth) {
     if (browser.isForbiddenSzKey(key)) continue;
     const sv = source[key];
     const tv = target[key];
-    target[key] = isPlainObject(sv) && isPlainObject(tv) ? mergeSzInto({ ...tv }, sv, depth + 1) : sv;
+    target[key] = isPlainObject$1(sv) && isPlainObject$1(tv) ? mergeSzInto({ ...tv }, sv, depth + 1) : sv;
   }
   return target;
 }
@@ -1259,7 +1259,7 @@ function partitionSz(obj, options, outer, inner, depth) {
       outer[key] = value;
     } else if (entry) {
       (entry.role === "inner" ? inner : outer)[key] = value;
-    } else if (isPlainObject(value)) {
+    } else if (isPlainObject$1(value)) {
       const subOuter = {};
       const subInner = {};
       partitionSz(value, options, subOuter, subInner, depth + 1);
@@ -1283,7 +1283,7 @@ function filterSz(obj, selector, keep, depth) {
     if (browser.isForbiddenSzKey(key)) continue;
     const value = obj[key];
     const entry = BOX_ROLE_BY_KEY.get(key);
-    if (entry || !isPlainObject(value)) {
+    if (entry || !isPlainObject$1(value)) {
       if (matchesKey(key, entry, selector) === keep) result[key] = value;
     } else {
       const sub = filterSz(value, selector, keep, depth + 1);
@@ -1300,7 +1300,7 @@ function hasSz(sz, selector) {
       const value = obj[key];
       const entry = BOX_ROLE_BY_KEY.get(key);
       if (matchesKey(key, entry, selector)) return true;
-      if (!entry && isPlainObject(value) && scan(value, depth + 1)) return true;
+      if (!entry && isPlainObject$1(value) && scan(value, depth + 1)) return true;
     }
     return false;
   };
@@ -1313,11 +1313,80 @@ function omitSz(sz, selector) {
   return filterSz(flattenSz(sz, 0), selector, false, 0);
 }
 
-const warned = /* @__PURE__ */ new Set();
+const AMBIGUOUS_PREFIXES = /* @__PURE__ */ new Set([
+  "flex",
+  // flex-1 (flex shorthand) vs flex-row (flex-direction)
+  "text",
+  // text-sm (font-size) vs text-red-500 (color)
+  "bg",
+  // bg-red-500 (color) vs bg-cover (size) vs bg-center (position)
+  "border",
+  // border-2 (width) vs border-red-500 (color) vs border-solid (style)
+  "divide",
+  // divide-x (width) vs divide-red-500 (color)
+  "ring",
+  // ring-2 (width) vs ring-red-500 (color)
+  "outline"
+  // outline-2 (width) vs outline-red-500 (color)
+]);
+function decodeToken(token) {
+  const decode = globalThis.__csszyx?.decode;
+  if (typeof decode === "function") {
+    return decode(token) ?? token;
+  }
+  return token;
+}
+function conflictKey(token) {
+  const base = stripVariant(token);
+  const variant = token.slice(0, token.length - base.length);
+  const norm = normalizeBase(base);
+  if (!norm) {
+    return null;
+  }
+  if (BOX_ROLE_TOKENS.has(norm)) {
+    return null;
+  }
+  for (const [prefix] of BOX_ROLE_PREFIXES) {
+    if (norm === prefix || norm.startsWith(`${prefix}-`)) {
+      if (AMBIGUOUS_PREFIXES.has(prefix)) {
+        return null;
+      }
+      return `${variant}\0${prefix}`;
+    }
+  }
+  return null;
+}
+function szcn(...inputs) {
+  const order = [];
+  const byKey = /* @__PURE__ */ new Map();
+  for (const input of inputs) {
+    if (!input || typeof input !== "string") {
+      continue;
+    }
+    for (const token of input.split(/\s+/)) {
+      if (!token) {
+        continue;
+      }
+      const original = decodeToken(token);
+      const key = conflictKey(original) ?? `
${original}`;
+      if (byKey.has(key)) {
+        const at = order.indexOf(key);
+        if (at !== -1) {
+          order.splice(at, 1);
+        }
+      }
+      byKey.set(key, token);
+      order.push(key);
+    }
+  }
+  return order.map((key) => byKey.get(key)).join(" ");
+}
+
+const warned$1 = /* @__PURE__ */ new Set();
 const RAW_SZ_WARNING = '[csszyx] A raw `sz` object reached the runtime and was dropped before it could leak to the DOM as sz="[object Object]".\nThis means the file was not compiled \u2014 its `sz` produces no CSS. If it lives in a workspace package, add that package to `compilePackages`; otherwise check that the bundler is not skipping the file.';
 function warnRawSz() {
-  if (warned.has(RAW_SZ_WARNING)) return;
-  warned.add(RAW_SZ_WARNING);
+  if (warned$1.has(RAW_SZ_WARNING)) return;
+  warned$1.add(RAW_SZ_WARNING);
   console.warn(RAW_SZ_WARNING);
 }
 function stripSzProps(props) {
@@ -1333,6 +1402,18 @@ function stripSzProps(props) {
   return rest;
 }
 
+const warned = /* @__PURE__ */ new Set();
+function devWarn(message) {
+  if (process.env.NODE_ENV === "production") {
+    return;
+  }
+  if (warned.has(message)) {
+    return;
+  }
+  warned.add(message);
+  console.warn(`[csszyx] ${message}`);
+}
+
 function deepMerge(target, source, depth = 0) {
   if (depth >= browser.MAX_SZ_DEPTH) {
     throw new browser.SzDepthError();
@@ -1352,8 +1433,97 @@ function deepMerge(target, source, depth = 0) {
   }
   return result;
 }
+function isPlainObject(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function validateSzvConfig(config) {
+  if (process.env.NODE_ENV === "production") {
+    return true;
+  }
+  if (!isPlainObject(config)) {
+    devWarn(`szv(config): config must be an object, got ${describe(config)}. Ignoring.`);
+    return false;
+  }
+  if (config.base !== void 0 && !isPlainObject(config.base)) {
+    devWarn(`szv(config): base must be an sz object, got ${describe(config.base)}.`);
+  }
+  if (!isPlainObject(config.variants)) {
+    devWarn(
+      `szv(config): variants is required and must be an object, got ${describe(config.variants)}. Ignoring.`
+    );
+    return false;
+  }
+  for (const dim of Object.keys(config.variants)) {
+    const values = config.variants[dim];
+    if (!isPlainObject(values)) {
+      devWarn(
+        `szv(config): variants.${dim} must be an object of values, got ${describe(values)}.`
+      );
+      continue;
+    }
+    for (const token of Object.keys(values)) {
+      const v = values[token];
+      if (v !== null && v !== void 0 && !isPlainObject(v)) {
+        devWarn(
+          `szv(config): variants.${dim}.${token} must be an sz object, got ${describe(v)}. It will be skipped.`
+        );
+      } else if (isPlainObject(v)) {
+        assertBoundedDepth(v, `variants.${dim}.${token}`);
+      }
+    }
+  }
+  if (config.defaultVariants !== void 0 && !isPlainObject(config.defaultVariants)) {
+    devWarn(
+      `szv(config): defaultVariants must be an object, got ${describe(config.defaultVariants)}.`
+    );
+  }
+  return true;
+}
+function assertBoundedDepth(obj, where, depth = 0) {
+  if (depth >= browser.MAX_SZ_DEPTH) {
+    devWarn(
+      `szv(config): ${where} nests deeper than ${browser.MAX_SZ_DEPTH} levels; it will be rejected at render.`
+    );
+    return;
+  }
+  for (const key of Object.keys(obj)) {
+    if (browser.isForbiddenSzKey(key)) {
+      devWarn(`szv(config): ${where} has a forbidden key "${key}"; it will be skipped.`);
+      continue;
+    }
+    const v = obj[key];
+    if (isPlainObject(v)) {
+      assertBoundedDepth(v, `${where}.${key}`, depth + 1);
+    }
+  }
+}
+function describe(value) {
+  if (value === null) return "null";
+  if (Array.isArray(value)) return "an array";
+  return typeof value;
+}
 function szv(config) {
+  const configValid = validateSzvConfig(config);
   return function szVariantFn(selection) {
+    if (!configValid) {
+      return isPlainObject(config?.base) ? { ...config.base } : {};
+    }
+    if (process.env.NODE_ENV !== "production" && selection) {
+      for (const key of Object.keys(selection)) {
+        if (!(key in config.variants)) {
+          devWarn(
+            `szv()(selection): unknown variant "${key}" \u2014 not declared in config.variants.`
+          );
+          continue;
+        }
+        const val = selection[key];
+        if (val !== null && val !== void 0 && !(String(val) in config.variants[key])) {
+          devWarn(
+            `szv()(selection): "${String(val)}" is not a value of variant "${key}" \u2014 it has no styles.`
+          );
+        }
+      }
+    }
     let result = config.base ? { ...config.base } : {};
     const resolved = { ...config.defaultVariants };
     if (selection) {
@@ -1367,13 +1537,13 @@ function szv(config) {
         }
       }
     }
-    for (const variantKey of Object.keys(config.variants)) {
+    for (const variantKey of Object.keys(config.variants ?? {})) {
       const selectedValue = resolved[variantKey];
       if (selectedValue === null || selectedValue === void 0) {
         continue;
       }
       const variantObj = config.variants[variantKey][selectedValue];
-      if (variantObj) {
+      if (isPlainObject(variantObj)) {
         result = deepMerge(result, variantObj);
       }
     }
@@ -1466,6 +1636,7 @@ exports.splitBox = splitBox;
 exports.splitBoxSz = splitBoxSz;
 exports.startHydration = startHydration;
 exports.stripSzProps = stripSzProps;
+exports.szcn = szcn;
 exports.szv = szv;
 exports.validateHydrationClass = validateHydrationClass;
 exports.verifyAllTokens = verifyAllTokens;

package/dist/index.d.cts

@@ -598,6 +598,20 @@ declare function startHydration(): void;
  */
 declare function endHydration(): void;
 
+/**
+ * Merge className strings with last-wins override per utility, mangle-aware.
+ *
+ * Intended for the single resolution point in a layered design-system component
+ * (typically at the leaf Box): combine the component's default classes with the
+ * forwarded override so the override wins on a same-utility collision, while
+ * keeping production mangling intact (unlike npm tailwind-merge).
+ *
+ * @param inputs - Class strings; falsy inputs (`false`/`null`/`undefined`/`''`) are skipped.
+ * @returns The merged className string.
+ * @example szcn('gap-2 p-4', 'gap-8') // → 'p-4 gap-8'  (gap-8 overrides gap-2)
+ */
+declare function szcn(...inputs: (string | false | null | undefined)[]): string;
+
 /** Which side of the CSS box-model border a property acts on. */
 type BoxRole = 'outer' | 'inner';
 
@@ -947,5 +961,5 @@ declare function isRuntimeInitialized(): boolean;
  */
 declare function resetRuntime(): void;
 
-export { DEFAULT_RUNTIME_CONFIG, VERSION, _sz, _sz2, _sz3, _szMerge, abortHydration, attemptCSRRecovery, classify, classifySzKey, clearHydrationErrors, computeMangleChecksumAsync, disableCSRRecovery, enableCSRRecovery, endHydration, getAbortedSubtreeCount, getHydrationErrors, getRecoveryMode, getRuntimeConfig, getSSRContext, guardHydration, has, hasRecoveryToken, hasSz, initRuntime, isCSRRecoveryAllowed, isHydrating, isHydrationAborted, isRuntimeInitialized, isSSREnvironment, isValidMangleMap, isValidManifest, loadMangleMapFromDOM, loadManifestFromDOM, omit, omitSz, pick, pickSz, resetRuntime, splitBox, splitBoxSz, startHydration, stripSzProps, szv, validateHydrationClass, verifyAllTokens, verifyMangleChecksum, verifyMangleChecksumAsync, verifyMangleMapIntegrity, verifyRecoveryToken };
+export { DEFAULT_RUNTIME_CONFIG, VERSION, _sz, _sz2, _sz3, _szMerge, abortHydration, attemptCSRRecovery, classify, classifySzKey, clearHydrationErrors, computeMangleChecksumAsync, disableCSRRecovery, enableCSRRecovery, endHydration, getAbortedSubtreeCount, getHydrationErrors, getRecoveryMode, getRuntimeConfig, getSSRContext, guardHydration, has, hasRecoveryToken, hasSz, initRuntime, isCSRRecoveryAllowed, isHydrating, isHydrationAborted, isRuntimeInitialized, isSSREnvironment, isValidMangleMap, isValidManifest, loadMangleMapFromDOM, loadManifestFromDOM, omit, omitSz, pick, pickSz, resetRuntime, splitBox, splitBoxSz, startHydration, stripSzProps, szcn, szv, validateHydrationClass, verifyAllTokens, verifyMangleChecksum, verifyMangleChecksumAsync, verifyMangleMapIntegrity, verifyRecoveryToken };
 export type { BoxRole, BoxSelector, Classification, HydrationError, HydrationErrorType, MangleMap, RecoveryManifest, RecoveryMode, RuntimeConfig, SSRContext, SplitBoxOptions, SplitBoxResult, SplitBoxSzOptions, SplitBoxSzResult, SzInput, TokenData, VerificationResult };

package/dist/index.d.mts

@@ -598,6 +598,20 @@ declare function startHydration(): void;
  */
 declare function endHydration(): void;
 
+/**
+ * Merge className strings with last-wins override per utility, mangle-aware.
+ *
+ * Intended for the single resolution point in a layered design-system component
+ * (typically at the leaf Box): combine the component's default classes with the
+ * forwarded override so the override wins on a same-utility collision, while
+ * keeping production mangling intact (unlike npm tailwind-merge).
+ *
+ * @param inputs - Class strings; falsy inputs (`false`/`null`/`undefined`/`''`) are skipped.
+ * @returns The merged className string.
+ * @example szcn('gap-2 p-4', 'gap-8') // → 'p-4 gap-8'  (gap-8 overrides gap-2)
+ */
+declare function szcn(...inputs: (string | false | null | undefined)[]): string;
+
 /** Which side of the CSS box-model border a property acts on. */
 type BoxRole = 'outer' | 'inner';
 
@@ -947,5 +961,5 @@ declare function isRuntimeInitialized(): boolean;
  */
 declare function resetRuntime(): void;
 
-export { DEFAULT_RUNTIME_CONFIG, VERSION, _sz, _sz2, _sz3, _szMerge, abortHydration, attemptCSRRecovery, classify, classifySzKey, clearHydrationErrors, computeMangleChecksumAsync, disableCSRRecovery, enableCSRRecovery, endHydration, getAbortedSubtreeCount, getHydrationErrors, getRecoveryMode, getRuntimeConfig, getSSRContext, guardHydration, has, hasRecoveryToken, hasSz, initRuntime, isCSRRecoveryAllowed, isHydrating, isHydrationAborted, isRuntimeInitialized, isSSREnvironment, isValidMangleMap, isValidManifest, loadMangleMapFromDOM, loadManifestFromDOM, omit, omitSz, pick, pickSz, resetRuntime, splitBox, splitBoxSz, startHydration, stripSzProps, szv, validateHydrationClass, verifyAllTokens, verifyMangleChecksum, verifyMangleChecksumAsync, verifyMangleMapIntegrity, verifyRecoveryToken };
+export { DEFAULT_RUNTIME_CONFIG, VERSION, _sz, _sz2, _sz3, _szMerge, abortHydration, attemptCSRRecovery, classify, classifySzKey, clearHydrationErrors, computeMangleChecksumAsync, disableCSRRecovery, enableCSRRecovery, endHydration, getAbortedSubtreeCount, getHydrationErrors, getRecoveryMode, getRuntimeConfig, getSSRContext, guardHydration, has, hasRecoveryToken, hasSz, initRuntime, isCSRRecoveryAllowed, isHydrating, isHydrationAborted, isRuntimeInitialized, isSSREnvironment, isValidMangleMap, isValidManifest, loadMangleMapFromDOM, loadManifestFromDOM, omit, omitSz, pick, pickSz, resetRuntime, splitBox, splitBoxSz, startHydration, stripSzProps, szcn, szv, validateHydrationClass, verifyAllTokens, verifyMangleChecksum, verifyMangleChecksumAsync, verifyMangleMapIntegrity, verifyRecoveryToken };
 export type { BoxRole, BoxSelector, Classification, HydrationError, HydrationErrorType, MangleMap, RecoveryManifest, RecoveryMode, RuntimeConfig, SSRContext, SplitBoxOptions, SplitBoxResult, SplitBoxSzOptions, SplitBoxSzResult, SzInput, TokenData, VerificationResult };

package/dist/index.mjs

@@ -1199,7 +1199,7 @@ function omit(classes, selector) {
 function classifySzKey(key) {
   return BOX_ROLE_BY_KEY.get(key);
 }
-function isPlainObject(value) {
+function isPlainObject$1(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function matchesKey(key, entry, selector) {
@@ -1220,7 +1220,7 @@ function mergeSzInto(target, source, depth) {
     if (isForbiddenSzKey(key)) continue;
     const sv = source[key];
     const tv = target[key];
-    target[key] = isPlainObject(sv) && isPlainObject(tv) ? mergeSzInto({ ...tv }, sv, depth + 1) : sv;
+    target[key] = isPlainObject$1(sv) && isPlainObject$1(tv) ? mergeSzInto({ ...tv }, sv, depth + 1) : sv;
   }
   return target;
 }
@@ -1257,7 +1257,7 @@ function partitionSz(obj, options, outer, inner, depth) {
       outer[key] = value;
     } else if (entry) {
       (entry.role === "inner" ? inner : outer)[key] = value;
-    } else if (isPlainObject(value)) {
+    } else if (isPlainObject$1(value)) {
       const subOuter = {};
       const subInner = {};
       partitionSz(value, options, subOuter, subInner, depth + 1);
@@ -1281,7 +1281,7 @@ function filterSz(obj, selector, keep, depth) {
     if (isForbiddenSzKey(key)) continue;
     const value = obj[key];
     const entry = BOX_ROLE_BY_KEY.get(key);
-    if (entry || !isPlainObject(value)) {
+    if (entry || !isPlainObject$1(value)) {
       if (matchesKey(key, entry, selector) === keep) result[key] = value;
     } else {
       const sub = filterSz(value, selector, keep, depth + 1);
@@ -1298,7 +1298,7 @@ function hasSz(sz, selector) {
       const value = obj[key];
       const entry = BOX_ROLE_BY_KEY.get(key);
       if (matchesKey(key, entry, selector)) return true;
-      if (!entry && isPlainObject(value) && scan(value, depth + 1)) return true;
+      if (!entry && isPlainObject$1(value) && scan(value, depth + 1)) return true;
     }
     return false;
   };
@@ -1311,11 +1311,80 @@ function omitSz(sz, selector) {
   return filterSz(flattenSz(sz, 0), selector, false, 0);
 }
 
-const warned = /* @__PURE__ */ new Set();
+const AMBIGUOUS_PREFIXES = /* @__PURE__ */ new Set([
+  "flex",
+  // flex-1 (flex shorthand) vs flex-row (flex-direction)
+  "text",
+  // text-sm (font-size) vs text-red-500 (color)
+  "bg",
+  // bg-red-500 (color) vs bg-cover (size) vs bg-center (position)
+  "border",
+  // border-2 (width) vs border-red-500 (color) vs border-solid (style)
+  "divide",
+  // divide-x (width) vs divide-red-500 (color)
+  "ring",
+  // ring-2 (width) vs ring-red-500 (color)
+  "outline"
+  // outline-2 (width) vs outline-red-500 (color)
+]);
+function decodeToken(token) {
+  const decode = globalThis.__csszyx?.decode;
+  if (typeof decode === "function") {
+    return decode(token) ?? token;
+  }
+  return token;
+}
+function conflictKey(token) {
+  const base = stripVariant(token);
+  const variant = token.slice(0, token.length - base.length);
+  const norm = normalizeBase(base);
+  if (!norm) {
+    return null;
+  }
+  if (BOX_ROLE_TOKENS.has(norm)) {
+    return null;
+  }
+  for (const [prefix] of BOX_ROLE_PREFIXES) {
+    if (norm === prefix || norm.startsWith(`${prefix}-`)) {
+      if (AMBIGUOUS_PREFIXES.has(prefix)) {
+        return null;
+      }
+      return `${variant}\0${prefix}`;
+    }
+  }
+  return null;
+}
+function szcn(...inputs) {
+  const order = [];
+  const byKey = /* @__PURE__ */ new Map();
+  for (const input of inputs) {
+    if (!input || typeof input !== "string") {
+      continue;
+    }
+    for (const token of input.split(/\s+/)) {
+      if (!token) {
+        continue;
+      }
+      const original = decodeToken(token);
+      const key = conflictKey(original) ?? `
${original}`;
+      if (byKey.has(key)) {
+        const at = order.indexOf(key);
+        if (at !== -1) {
+          order.splice(at, 1);
+        }
+      }
+      byKey.set(key, token);
+      order.push(key);
+    }
+  }
+  return order.map((key) => byKey.get(key)).join(" ");
+}
+
+const warned$1 = /* @__PURE__ */ new Set();
 const RAW_SZ_WARNING = '[csszyx] A raw `sz` object reached the runtime and was dropped before it could leak to the DOM as sz="[object Object]".\nThis means the file was not compiled \u2014 its `sz` produces no CSS. If it lives in a workspace package, add that package to `compilePackages`; otherwise check that the bundler is not skipping the file.';
 function warnRawSz() {
-  if (warned.has(RAW_SZ_WARNING)) return;
-  warned.add(RAW_SZ_WARNING);
+  if (warned$1.has(RAW_SZ_WARNING)) return;
+  warned$1.add(RAW_SZ_WARNING);
   console.warn(RAW_SZ_WARNING);
 }
 function stripSzProps(props) {
@@ -1331,6 +1400,18 @@ function stripSzProps(props) {
   return rest;
 }
 
+const warned = /* @__PURE__ */ new Set();
+function devWarn(message) {
+  if (process.env.NODE_ENV === "production") {
+    return;
+  }
+  if (warned.has(message)) {
+    return;
+  }
+  warned.add(message);
+  console.warn(`[csszyx] ${message}`);
+}
+
 function deepMerge(target, source, depth = 0) {
   if (depth >= MAX_SZ_DEPTH) {
     throw new SzDepthError();
@@ -1350,8 +1431,97 @@ function deepMerge(target, source, depth = 0) {
   }
   return result;
 }
+function isPlainObject(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function validateSzvConfig(config) {
+  if (process.env.NODE_ENV === "production") {
+    return true;
+  }
+  if (!isPlainObject(config)) {
+    devWarn(`szv(config): config must be an object, got ${describe(config)}. Ignoring.`);
+    return false;
+  }
+  if (config.base !== void 0 && !isPlainObject(config.base)) {
+    devWarn(`szv(config): base must be an sz object, got ${describe(config.base)}.`);
+  }
+  if (!isPlainObject(config.variants)) {
+    devWarn(
+      `szv(config): variants is required and must be an object, got ${describe(config.variants)}. Ignoring.`
+    );
+    return false;
+  }
+  for (const dim of Object.keys(config.variants)) {
+    const values = config.variants[dim];
+    if (!isPlainObject(values)) {
+      devWarn(
+        `szv(config): variants.${dim} must be an object of values, got ${describe(values)}.`
+      );
+      continue;
+    }
+    for (const token of Object.keys(values)) {
+      const v = values[token];
+      if (v !== null && v !== void 0 && !isPlainObject(v)) {
+        devWarn(
+          `szv(config): variants.${dim}.${token} must be an sz object, got ${describe(v)}. It will be skipped.`
+        );
+      } else if (isPlainObject(v)) {
+        assertBoundedDepth(v, `variants.${dim}.${token}`);
+      }
+    }
+  }
+  if (config.defaultVariants !== void 0 && !isPlainObject(config.defaultVariants)) {
+    devWarn(
+      `szv(config): defaultVariants must be an object, got ${describe(config.defaultVariants)}.`
+    );
+  }
+  return true;
+}
+function assertBoundedDepth(obj, where, depth = 0) {
+  if (depth >= MAX_SZ_DEPTH) {
+    devWarn(
+      `szv(config): ${where} nests deeper than ${MAX_SZ_DEPTH} levels; it will be rejected at render.`
+    );
+    return;
+  }
+  for (const key of Object.keys(obj)) {
+    if (isForbiddenSzKey(key)) {
+      devWarn(`szv(config): ${where} has a forbidden key "${key}"; it will be skipped.`);
+      continue;
+    }
+    const v = obj[key];
+    if (isPlainObject(v)) {
+      assertBoundedDepth(v, `${where}.${key}`, depth + 1);
+    }
+  }
+}
+function describe(value) {
+  if (value === null) return "null";
+  if (Array.isArray(value)) return "an array";
+  return typeof value;
+}
 function szv(config) {
+  const configValid = validateSzvConfig(config);
   return function szVariantFn(selection) {
+    if (!configValid) {
+      return isPlainObject(config?.base) ? { ...config.base } : {};
+    }
+    if (process.env.NODE_ENV !== "production" && selection) {
+      for (const key of Object.keys(selection)) {
+        if (!(key in config.variants)) {
+          devWarn(
+            `szv()(selection): unknown variant "${key}" \u2014 not declared in config.variants.`
+          );
+          continue;
+        }
+        const val = selection[key];
+        if (val !== null && val !== void 0 && !(String(val) in config.variants[key])) {
+          devWarn(
+            `szv()(selection): "${String(val)}" is not a value of variant "${key}" \u2014 it has no styles.`
+          );
+        }
+      }
+    }
     let result = config.base ? { ...config.base } : {};
     const resolved = { ...config.defaultVariants };
     if (selection) {
@@ -1365,13 +1535,13 @@ function szv(config) {
         }
       }
     }
-    for (const variantKey of Object.keys(config.variants)) {
+    for (const variantKey of Object.keys(config.variants ?? {})) {
       const selectedValue = resolved[variantKey];
       if (selectedValue === null || selectedValue === void 0) {
         continue;
       }
       const variantObj = config.variants[variantKey][selectedValue];
-      if (variantObj) {
+      if (isPlainObject(variantObj)) {
         result = deepMerge(result, variantObj);
       }
     }
@@ -1420,4 +1590,4 @@ function resetRuntime() {
   runtimeState.initialized = false;
 }
 
-export { DEFAULT_RUNTIME_CONFIG, VERSION, _sz, _sz2, _sz3, _szMerge, abortHydration, attemptCSRRecovery, classify, classifySzKey, clearHydrationErrors, computeMangleChecksumAsync, disableCSRRecovery, enableCSRRecovery, endHydration, getAbortedSubtreeCount, getHydrationErrors, getRecoveryMode, getRuntimeConfig, getSSRContext, guardHydration, has, hasRecoveryToken, hasSz, initRuntime, isCSRRecoveryAllowed, isHydrating, isHydrationAborted, isRuntimeInitialized, isSSREnvironment, isValidMangleMap, isValidManifest, loadMangleMapFromDOM, loadManifestFromDOM, omit, omitSz, pick, pickSz, resetRuntime, splitBox, splitBoxSz, startHydration, stripSzProps, szv, validateHydrationClass, verifyAllTokens, verifyMangleChecksum, verifyMangleChecksumAsync, verifyMangleMapIntegrity, verifyRecoveryToken };
+export { DEFAULT_RUNTIME_CONFIG, VERSION, _sz, _sz2, _sz3, _szMerge, abortHydration, attemptCSRRecovery, classify, classifySzKey, clearHydrationErrors, computeMangleChecksumAsync, disableCSRRecovery, enableCSRRecovery, endHydration, getAbortedSubtreeCount, getHydrationErrors, getRecoveryMode, getRuntimeConfig, getSSRContext, guardHydration, has, hasRecoveryToken, hasSz, initRuntime, isCSRRecoveryAllowed, isHydrating, isHydrationAborted, isRuntimeInitialized, isSSREnvironment, isValidMangleMap, isValidManifest, loadMangleMapFromDOM, loadManifestFromDOM, omit, omitSz, pick, pickSz, resetRuntime, splitBox, splitBoxSz, startHydration, stripSzProps, szcn, szv, validateHydrationClass, verifyAllTokens, verifyMangleChecksum, verifyMangleChecksumAsync, verifyMangleMapIntegrity, verifyRecoveryToken };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@csszyx/runtime",
-  "version": "0.10.1",
+  "version": "0.10.3",
   "description": "Runtime helpers and hydration guards for csszyx",
   "keywords": [
     "csszyx",
@@ -49,8 +49,8 @@
     "dist"
   ],
   "dependencies": {
-    "@csszyx/core": "0.10.1",
-    "@csszyx/compiler": "0.10.1"
+    "@csszyx/compiler": "0.10.3",
+    "@csszyx/core": "0.10.3"
   },
   "devDependencies": {
     "@types/node": "^20.11.0",