@csszyx/compiler 0.9.9 → 0.10.0

package/dist/shared/{compiler.fR1gse9A.mjs → compiler.BUCRKtMU.mjs}

@@ -191,6 +191,22 @@ function getCSSVariableName(property, variantPrefix) {
   return `--_sz-${prop}`;
 }
 
+const MAX_SZ_DEPTH = 32;
+class SzDepthError extends Error {
+  /**
+   * @param depth - the depth limit that was exceeded (for the message).
+   */
+  constructor(depth = MAX_SZ_DEPTH) {
+    super(
+      `[csszyx] sz nesting exceeded the maximum depth of ${depth}. This usually means untrusted/looping data reached an sz prop.`
+    );
+    this.name = "SzDepthError";
+  }
+}
+function isForbiddenSzKey(key) {
+  return key === "__proto__" || key === "constructor" || key === "prototype";
+}
+
 const COLOR_STRING_KEYWORDS = /* @__PURE__ */ new Set([
   "inherit",
   "current",
@@ -230,11 +246,17 @@ function hasSlashOpacity(value) {
   }
   return slashIdx > 0 && /\d$/.test(value.slice(0, slashIdx));
 }
-function stripInvalidColorStrings(sz) {
+function stripInvalidColorStrings(sz, _depth = 0) {
+  if (_depth >= MAX_SZ_DEPTH) {
+    throw new SzDepthError();
+  }
   const result = {};
   for (const [key, value] of Object.entries(sz)) {
+    if (isForbiddenSzKey(key)) {
+      continue;
+    }
     if (typeof value === "object" && value !== null && !Array.isArray(value)) {
-      result[key] = stripInvalidColorStrings(value);
+      result[key] = stripInvalidColorStrings(value, _depth + 1);
       continue;
     }
     if (typeof value === "string" && PROPERTY_CATEGORY_MAP[key] === PropertyCategory.COLOR) {
@@ -412,10 +434,13 @@ const PROPERTY_MAP = {
   // Typography
   color: "text",
   text: "text",
-  fontWeight: "font",
   weight: "font",
   fontFamily: "font",
   fontStretch: "font-stretch",
+  // fontStyle/fontSmoothing are emitted by closed direct-output handlers; the
+  // prefix here only marks them as known props (diagnostics, editor tooling).
+  fontStyle: "font-style",
+  fontSmoothing: "font-smoothing",
   textAlign: "text",
   decoration: "decoration",
   decorationColor: "decoration",
@@ -441,6 +466,9 @@ const PROPERTY_MAP = {
   listImg: "list-image",
   // Flex & Grid
   basis: "basis",
+  // `flex` is the flex shorthand (flex: 1 → flex-1, flex: 'auto' → flex-auto).
+  // The `flex: true` display sugar was removed (use display: 'flex').
+  flex: "flex",
   flexDir: "flex",
   flexWrap: "flex",
   grow: "grow",
@@ -482,6 +510,8 @@ const PROPERTY_MAP = {
   mixBlend: "mix-blend",
   bgBlend: "bg-blend",
   // Filters
+  filter: "filter",
+  backdropFilter: "backdrop-filter",
   blur: "blur",
   brightness: "brightness",
   contrast: "contrast",
@@ -537,6 +567,8 @@ const PROPERTY_MAP = {
   maskPos: "mask-position",
   maskRepeat: "mask-repeat",
   maskShape: "mask",
+  maskClip: "mask-clip",
+  maskOrigin: "mask-origin",
   // Interactivity
   cursor: "cursor",
   caret: "caret",
@@ -605,7 +637,7 @@ const PROPERTY_MAP = {
 };
 const CSS_VAR_TYPE_HINTS = {
   fontFamily: "family-name",
-  fontWeight: "weight",
+  weight: "weight",
   text: "length"
 };
 const SUGGESTION_MAP = {
@@ -654,10 +686,10 @@ const SUGGESTION_MAP = {
   objectPosition: "objectPos",
   zIndex: "z",
   // Typography
-  font: "fontWeight (for weight) or fontFamily (for family)",
-  fontStyle: "italic/notItalic (boolean)",
-  weight: "fontWeight",
-  textDecoration: "decoration or underline/lineThrough/noUnderline (boolean)",
+  font: "weight (for font-weight) or fontFamily (for family)",
+  fontWeight: "weight",
+  fontSize: "text",
+  textDecoration: "decoration",
   textDecorationColor: "decorationColor",
   textDecorationStyle: "decorationStyle",
   textDecorationThickness: "decorationThickness",
@@ -668,7 +700,6 @@ const SUGGESTION_MAP = {
   verticalAlign: "align",
   wordBreak: "break",
   overflowWrap: "wrap",
-  textWrap: "textWrap",
   listStyleType: "list",
   listStylePosition: "listPos",
   listStyleImage: "listImg",
@@ -924,45 +955,8 @@ const ARIA_STATES = /* @__PURE__ */ new Set([
   "modal"
 ]);
 const BOOLEAN_SHORTHANDS = /* @__PURE__ */ new Set([
-  // Display
-  "block",
-  "inline",
-  "inlineBlock",
-  "flex",
-  "inlineFlex",
-  "grid",
-  "inlineGrid",
-  "hidden",
-  "contents",
-  "table",
-  "tableRow",
-  "tableCell",
-  "flowRoot",
-  "listItem",
-  // Position
-  "static",
-  "fixed",
-  "absolute",
-  "relative",
-  "sticky",
-  // Visibility
-  "visible",
-  "invisible",
-  "collapse",
-  // Typography
+  // Typography (composite — no single-property canonical form)
   "truncate",
-  "uppercase",
-  "lowercase",
-  "capitalize",
-  "normalCase",
-  "underline",
-  "overline",
-  "lineThrough",
-  "noUnderline",
-  "italic",
-  "notItalic",
-  "antialiased",
-  "subpixelAntialiased",
   // Flexbox (grow/shrink only — flexWrap uses string values)
   "grow",
   "shrink",
@@ -981,10 +975,9 @@ const BOOLEAN_SHORTHANDS = /* @__PURE__ */ new Set([
   "proseInvert",
   "srOnly",
   "notSrOnly",
-  "isolate",
   "ordinal",
   "slashedZero",
-  // Font variant numeric
+  // Font variant numeric (additive — these combine, so they stay boolean flags)
   "liningNums",
   "oldstyleNums",
   "proportionalNums",
@@ -1001,19 +994,52 @@ const BOOLEAN_SHORTHANDS = /* @__PURE__ */ new Set([
   // Outline
   "outline"
 ]);
+const REMOVED_BOOLEAN_SUGAR = {
+  // display
+  block: { key: "display", value: "block" },
+  inline: { key: "display", value: "inline" },
+  inlineBlock: { key: "display", value: "inline-block" },
+  flex: { key: "display", value: "flex" },
+  inlineFlex: { key: "display", value: "inline-flex" },
+  grid: { key: "display", value: "grid" },
+  inlineGrid: { key: "display", value: "inline-grid" },
+  hidden: { key: "display", value: "none" },
+  contents: { key: "display", value: "contents" },
+  table: { key: "display", value: "table" },
+  tableRow: { key: "display", value: "table-row" },
+  tableCell: { key: "display", value: "table-cell" },
+  flowRoot: { key: "display", value: "flow-root" },
+  listItem: { key: "display", value: "list-item" },
+  // position
+  static: { key: "position", value: "static" },
+  fixed: { key: "position", value: "fixed" },
+  absolute: { key: "position", value: "absolute" },
+  relative: { key: "position", value: "relative" },
+  sticky: { key: "position", value: "sticky" },
+  // visibility
+  visible: { key: "visibility", value: "visible" },
+  invisible: { key: "visibility", value: "hidden" },
+  collapse: { key: "visibility", value: "collapse" },
+  // isolation
+  isolate: { key: "isolation", value: "isolate" },
+  // text-transform
+  uppercase: { key: "textTransform", value: "uppercase" },
+  lowercase: { key: "textTransform", value: "lowercase" },
+  capitalize: { key: "textTransform", value: "capitalize" },
+  normalCase: { key: "textTransform", value: "none" },
+  // font-style
+  italic: { key: "fontStyle", value: "italic" },
+  notItalic: { key: "fontStyle", value: "normal" },
+  // text-decoration-line
+  underline: { key: "decoration", value: "underline" },
+  overline: { key: "decoration", value: "overline" },
+  lineThrough: { key: "decoration", value: "line-through" },
+  noUnderline: { key: "decoration", value: "none" },
+  // font-smoothing
+  antialiased: { key: "fontSmoothing", value: "grayscale" },
+  subpixelAntialiased: { key: "fontSmoothing", value: "subpixel" }
+};
 const BOOLEAN_TO_CLASS = {
-  inlineBlock: "inline-block",
-  inlineFlex: "inline-flex",
-  inlineGrid: "inline-grid",
-  tableRow: "table-row",
-  tableCell: "table-cell",
-  flowRoot: "flow-root",
-  listItem: "list-item",
-  normalCase: "normal-case",
-  lineThrough: "line-through",
-  noUnderline: "no-underline",
-  notItalic: "not-italic",
-  subpixelAntialiased: "subpixel-antialiased",
   backdropBlur: "backdrop-blur",
   backdropGrayscale: "backdrop-grayscale",
   backdropInvert: "backdrop-invert",
@@ -1433,23 +1459,38 @@ function handleSupports(supportsObj, prefix) {
   }
   return classes;
 }
+let szTransformDepth = 0;
 function transform(szProp, prefix = "", mangleMap) {
   if (!szProp || typeof szProp !== "object") {
     return { className: "", attributes: {} };
   }
+  if (szTransformDepth >= MAX_SZ_DEPTH) {
+    throw new SzDepthError();
+  }
+  szTransformDepth++;
+  try {
+    return transformImpl(szProp, prefix, mangleMap);
+  } finally {
+    szTransformDepth--;
+  }
+}
+function transformImpl(szProp, prefix, mangleMap) {
   const classes = [];
   const attributes = {};
   for (const [rawKey, value] of Object.entries(szProp)) {
-    if (value === false) {
-      if (rawKey === "italic") {
-        classes.push(`${prefix}not-italic`);
-      } else if (rawKey === "antialiased") {
-        classes.push(`${prefix}subpixel-antialiased`);
-      }
+    if (value === false || value === null || value === void 0) {
       continue;
     }
-    if (value === null || value === void 0) {
-      continue;
+    if (value === true) {
+      const removed = REMOVED_BOOLEAN_SUGAR[rawKey];
+      if (removed) {
+        if (process.env.NODE_ENV !== "production" && typeof window === "undefined") {
+          console.warn(
+            `[csszyx] "${rawKey}" boolean sugar was removed. Use { ${removed.key}: '${removed.value}' } instead, or run \`csszyx migrate\`.`
+          );
+        }
+        continue;
+      }
     }
     if (rawKey === "css") {
       if (value && typeof value === "object" && !Array.isArray(value)) {
@@ -1792,11 +1833,52 @@ function transform(szProp, prefix = "", mangleMap) {
         }
       }
       if (rawKey === "textTransform") {
-        if (["uppercase", "lowercase", "capitalize", "normal-case"].includes(value)) {
+        if (["uppercase", "lowercase", "capitalize"].includes(value)) {
           className += value;
           classes.push(className);
           continue;
         }
+        if (value === "normal-case" || value === "none") {
+          className += "normal-case";
+          classes.push(className);
+          continue;
+        }
+      }
+      if (rawKey === "fontStyle") {
+        if (value === "italic") {
+          className += "italic";
+          classes.push(className);
+          continue;
+        }
+        if (value === "normal") {
+          className += "not-italic";
+          classes.push(className);
+          continue;
+        }
+        if (process.env.NODE_ENV !== "production" && typeof window === "undefined") {
+          console.warn(
+            `[csszyx] fontStyle: '${value}' is not supported \u2014 Tailwind only models 'italic' and 'normal'. For oblique, use css: { fontStyle: '${value}' }.`
+          );
+        }
+        continue;
+      }
+      if (rawKey === "fontSmoothing") {
+        if (value === "grayscale") {
+          className += "antialiased";
+          classes.push(className);
+          continue;
+        }
+        if (value === "subpixel") {
+          className += "subpixel-antialiased";
+          classes.push(className);
+          continue;
+        }
+        if (process.env.NODE_ENV !== "production" && typeof window === "undefined") {
+          console.warn(
+            `[csszyx] fontSmoothing: '${value}' is not supported \u2014 use 'grayscale' or 'subpixel'.`
+          );
+        }
+        continue;
       }
       if (rawKey === "fontVariant") {
         const FONT_VARIANT_CLASSES = /* @__PURE__ */ new Set([
@@ -1857,7 +1939,9 @@ function transform(szProp, prefix = "", mangleMap) {
       }
       if (rawKey === "lineClamp") {
         const sValue = String(value);
-        if (sValue.startsWith("--")) {
+        if (sValue === "none") {
+          className += "line-clamp-none";
+        } else if (sValue.startsWith("--")) {
           className += `line-clamp-(${sValue})`;
         } else {
           const numVal = Number(sValue);
@@ -2203,7 +2287,7 @@ function transform(szProp, prefix = "", mangleMap) {
         if (STANDARD_ORIGINS.has(value)) {
           className += `perspective-origin-${value}`;
         } else {
-          className += `perspective-origin-[${value}]`;
+          className += `perspective-origin-[${normalizeArbitraryValue(value)}]`;
         }
         classes.push(className);
         continue;
@@ -2345,4 +2429,4 @@ function normalizeClassName(className) {
   return className.split(/\s+/).filter(Boolean).join(" ");
 }
 
-export { BOOLEAN_SHORTHANDS as B, COLOR_PROPERTIES as C, KNOWN_VARIANTS as K, PROPERTY_MAP as P, SPECIAL_VARIANTS as S, VARIANT_MAP as V, PropertyCategory as a, getVariantPrefix as b, getPropertyCategory as c, PROPERTY_CATEGORY_MAP as d, SUGGESTION_MAP as e, normalizeArbitraryValue as f, getCSSVariableName as g, normalizeArbitraryVariant as h, isValidSzProp as i, normalizeClassName as n, stripInvalidColorStrings as s, transform as t };
+export { BOOLEAN_SHORTHANDS as B, COLOR_PROPERTIES as C, KNOWN_VARIANTS as K, MAX_SZ_DEPTH as M, PROPERTY_MAP as P, REMOVED_BOOLEAN_SUGAR as R, SPECIAL_VARIANTS as S, VARIANT_MAP as V, PropertyCategory as a, getVariantPrefix as b, getPropertyCategory as c, PROPERTY_CATEGORY_MAP as d, SUGGESTION_MAP as e, SzDepthError as f, getCSSVariableName as g, isForbiddenSzKey as h, isValidSzProp as i, normalizeArbitraryValue as j, normalizeArbitraryVariant as k, normalizeClassName as n, stripInvalidColorStrings as s, transform as t };