domflax 0.1.2 → 0.2.0

package/dist/{chunk-DWLB7FRR.js → chunk-TTJEXWAC.js}

@@ -1,6 +1,6 @@
 import {
   init_esm_shims
-} from "./chunk-6WVVF6AD.js";
+} from "./chunk-U5GOONKV.js";
 
 // ../core/src/builders.ts
 init_esm_shims();
@@ -61,6 +61,7 @@ function defaultMeta(safetyFloor = 0) {
     hasDynamicChildren: false,
     isComponent: false,
     hasDangerousHtml: false,
+    hasUnresolvedClasses: false,
     targetedByCombinator: false,
     targetedByStructuralPseudo: false,
     selectorDependents: 0,
@@ -72,6 +73,7 @@ function defaultMeta(safetyFloor = 0) {
     declaresCustomProperties: false,
     whitespaceSensitive: false,
     touched: false,
+    styleDirty: false,
     synthetic: false,
     safetyFloor
   };
@@ -286,6 +288,14 @@ function markTouched(state, id) {
     state.touched.add(id);
   }
 }
+function markStyleDirty(state, id) {
+  const n = state.doc.nodes.get(id);
+  if (n) {
+    n.meta.touched = true;
+    n.meta.styleDirty = true;
+    state.touched.add(id);
+  }
+}
 function removeSubtree(state, id) {
   const node = state.doc.nodes.get(id);
   if (!node) return;
@@ -578,7 +588,7 @@ function applyOne(state, op) {
         return [precond(op, op.target, "setClassList target is not an element")];
       }
       el.computed = cloneStyleMap(op.style);
-      markTouched(state, op.target);
+      markStyleDirty(state, op.target);
       return [];
     }
     case "mergeStyle": {
@@ -601,7 +611,7 @@ function applyOne(state, op) {
         const src = doc.nodes.get(op.source);
         if (src) markTouched(state, op.source);
       }
-      markTouched(state, op.target);
+      markStyleDirty(state, op.target);
       return [];
     }
     case "foldInheritedStyles":
@@ -652,7 +662,7 @@ function applyFold(state, op) {
     }
     if (folded) {
       into.computed = { blocks: nextBlocks };
-      markTouched(state, intoId);
+      markStyleDirty(state, intoId);
     }
   }
   for (const d of issues) state.diagnostics.push(d);
@@ -990,8 +1000,123 @@ init_esm_shims();
 var DISPLAY = "display";
 var POSITION = "position";
 var TRANSFORM = "transform";
+var ALIGN_ITEMS = "align-items";
+var JUSTIFY_CONTENT = "justify-content";
+var JUSTIFY_ITEMS = "justify-items";
+var PLACE_ITEMS = "place-items";
+var PLACE_SELF = "place-self";
 var CONTEXT_SAFE_DISPLAYS = /* @__PURE__ */ new Set(["block", "contents", ""]);
 var STATIC_POSITIONS = /* @__PURE__ */ new Set(["static", ""]);
+var CENTERING_DISPLAYS = /* @__PURE__ */ new Set(["flex", "grid"]);
+var GRID_PARENT_DISPLAYS = /* @__PURE__ */ new Set(["grid"]);
+var STRETCHY_ITEM_ALIGN = /* @__PURE__ */ new Set(["normal", "stretch"]);
+var PARENT_ITEMS_ALIGN_PROPS = [ALIGN_ITEMS, JUSTIFY_ITEMS, PLACE_ITEMS];
+function isBaseCondition(block) {
+  const c = block.condition;
+  return c.media === "" && c.states.length === 0 && c.pseudoElement === "";
+}
+function baseValue(sm, prop) {
+  for (const block of sm.blocks.values()) {
+    if (!isBaseCondition(block)) continue;
+    const d = block.decls.get(prop);
+    return d ? String(d.value) : null;
+  }
+  return null;
+}
+function parentIsFillingGrid(before, wrapper, norm) {
+  if (wrapper.parent == null) return false;
+  const p = before.nodes.get(wrapper.parent);
+  if (!p || p.kind !== "element") return false;
+  const pc = norm.normalizeStyleMap(p.computed);
+  let baseIsGrid = false;
+  for (const block of pc.blocks.values()) {
+    const disp = block.decls.get(DISPLAY);
+    if (disp) {
+      if (!GRID_PARENT_DISPLAYS.has(String(disp.value))) return false;
+      if (isBaseCondition(block)) baseIsGrid = true;
+    }
+    for (const prop of PARENT_ITEMS_ALIGN_PROPS) {
+      const d = block.decls.get(prop);
+      if (d && !STRETCHY_ITEM_ALIGN.has(String(d.value))) return false;
+    }
+  }
+  return baseIsGrid;
+}
+function wrapperHasOnlyCenteringStyle(wrapperComputed, childComputed, norm) {
+  for (const block of wrapperComputed.blocks.values()) {
+    const base = isBaseCondition(block);
+    const ck = conditionKey(block.condition);
+    for (const [prop, decl] of block.decls) {
+      const val = String(decl.value);
+      if (prop === DISPLAY) {
+        if (base && CENTERING_DISPLAYS.has(val)) continue;
+        return false;
+      }
+      if (prop === ALIGN_ITEMS) {
+        if (base && val === "center") continue;
+        return false;
+      }
+      if (prop === JUSTIFY_CONTENT) {
+        if (base && val === "center") continue;
+        return false;
+      }
+      if (prop === POSITION) {
+        if (STATIC_POSITIONS.has(val)) continue;
+        return false;
+      }
+      if (prop === TRANSFORM) {
+        if (val === "none") continue;
+        return false;
+      }
+      if (isInherited2(decl, norm)) continue;
+      if (childReproduces(childComputed, ck, prop, val)) continue;
+      return false;
+    }
+  }
+  return true;
+}
+function wrapperCentersSingleElement(before, wrapper) {
+  let elements = 0;
+  for (const cid of wrapper.children) {
+    const n = before.nodes.get(cid);
+    if (!n) continue;
+    if (n.kind === "element") {
+      elements += 1;
+      continue;
+    }
+    if (n.kind === "comment") continue;
+    if (n.kind === "text" && n.value.trim() === "") continue;
+    return false;
+  }
+  return elements === 1;
+}
+function childHasSelfAlign(childBefore, norm) {
+  if (!childBefore) return false;
+  const sm = norm.normalizeStyleMap(childBefore);
+  for (const block of sm.blocks.values()) {
+    for (const prop of SELF_ALIGN_PROPS) {
+      const d = block.decls.get(prop);
+      if (d && !NEUTRAL_ALIGN.has(String(d.value))) return true;
+    }
+  }
+  return false;
+}
+function childGainsPlaceSelfCenter(childAfter) {
+  if (baseValue(childAfter, PLACE_SELF) === "center") return true;
+  return baseValue(childAfter, "align-self") === "center" && baseValue(childAfter, "justify-self") === "center";
+}
+function isContextCompensatedCentering(before, wrapper, wrapperComputed, childBefore, childAfter, norm) {
+  if (!childAfter) return false;
+  if (!CENTERING_DISPLAYS.has(baseValue(wrapperComputed, DISPLAY) ?? "")) return false;
+  if (baseValue(wrapperComputed, ALIGN_ITEMS) !== "center") return false;
+  if (baseValue(wrapperComputed, JUSTIFY_CONTENT) !== "center") return false;
+  const childAfterNorm = norm.normalizeStyleMap(childAfter);
+  if (!childGainsPlaceSelfCenter(childAfterNorm)) return false;
+  if (!wrapperHasOnlyCenteringStyle(wrapperComputed, childAfterNorm, norm)) return false;
+  if (!wrapperCentersSingleElement(before, wrapper)) return false;
+  if (childHasSelfAlign(childBefore, norm)) return false;
+  return parentIsFillingGrid(before, wrapper, norm);
+}
 var SELF_ALIGN_PROPS = [
   "place-self",
   "align-self",
@@ -1087,10 +1212,16 @@ function classifyFlattenOps(before, after, ops, norm) {
   if (!wrapper || wrapper.kind !== "element") {
     return { kind: "provably-safe", wrapperId: null, childId: null };
   }
+  if (wrapper.meta.hasUnresolvedClasses) {
+    return { kind: "needs-verification", wrapperId, childId: survivingChildOf(ops, wrapper, before) };
+  }
   const childId = survivingChildOf(ops, wrapper, before);
   const wrapperComputed = norm.normalizeStyleMap(wrapper.computed);
   const childAfter = childId != null ? getElement(after, childId)?.computed ?? null : null;
   const childBefore = childId != null ? getElement(before, childId)?.computed ?? null : null;
+  if (isContextCompensatedCentering(before, wrapper, wrapperComputed, childBefore, childAfter, norm)) {
+    return { kind: "provably-safe", wrapperId, childId };
+  }
   if (establishesChildContext(wrapperComputed)) {
     return { kind: "needs-verification", wrapperId, childId };
   }
@@ -1529,22 +1660,52 @@ function sameTokens(a, b) {
   for (let i = 0; i < a.length; i += 1) if (a[i] !== b[i]) return false;
   return true;
 }
+function residualStyle(computed2, covered, norm) {
+  const cov = norm.normalizeStyleMap(covered);
+  const blocks = /* @__PURE__ */ new Map();
+  for (const [key, block] of norm.normalizeStyleMap(computed2).blocks) {
+    const covBlock = cov.blocks.get(key);
+    const decls = /* @__PURE__ */ new Map();
+    for (const [prop, decl] of block.decls) {
+      const covDecl = covBlock?.decls.get(prop);
+      if (covDecl && covDecl.value === decl.value && covDecl.important === decl.important) continue;
+      decls.set(prop, decl);
+    }
+    if (decls.size > 0) blocks.set(key, { condition: block.condition, decls });
+  }
+  return { blocks };
+}
+function joinedLength(tokens) {
+  if (tokens.length === 0) return 0;
+  let len = tokens.length - 1;
+  for (const t of tokens) len += t.length;
+  return len;
+}
+var COMPRESS_FLOOR = 1;
 function syncClassesFromComputed(doc, resolver, norm) {
   const sink = createSyntheticSink();
+  const isDroppable = (t) => resolver.owns(t) && resolver.selectorUsage(t).droppable;
   for (const id of elementIds(doc)) {
     const el = getElement(doc, id);
-    if (!el || !el.meta.touched) continue;
+    if (!el) continue;
     if (el.classes.opaque || el.classes.hasDynamic) continue;
+    const compressOnly = !el.meta.styleDirty;
+    if (compressOnly && el.meta.safetyFloor < COMPRESS_FLOOR) continue;
     const tokens = staticTokensOf(el.classes);
+    if (tokens.length === 0) continue;
+    const retained = tokens.filter((t) => !isDroppable(t));
+    if (compressOnly && retained.length === tokens.length) continue;
+    const covered = retained.length > 0 ? resolver.resolve({ classes: retained }).styles : null;
+    const target = covered ? residualStyle(el.computed, covered, norm) : el.computed;
     const ctx = { normalizer: norm, sink };
-    const emitted = resolver.emit(el.computed, ctx).classes;
+    const emitted = resolver.emit(target, ctx).classes;
     if (emitted.length === 0) continue;
     const emittedSet = new Set(emitted);
     const next = [];
     const seen = /* @__PURE__ */ new Set();
     for (const t of tokens) {
       if (seen.has(t)) continue;
-      const keep = emittedSet.has(t) || !resolver.selectorUsage(t).droppable;
+      const keep = emittedSet.has(t) || !isDroppable(t);
       if (keep) {
         next.push(t);
         seen.add(t);
@@ -1556,10 +1717,99 @@ function syncClassesFromComputed(doc, resolver, norm) {
       seen.add(c);
     }
     if (sameTokens(next, tokens)) continue;
+    if (compressOnly) {
+      if (!norm.equals(resolver.resolve({ classes: next }).styles, el.computed)) continue;
+      if (joinedLength(next) > joinedLength(tokens)) continue;
+    }
     el.classes = staticClassList(el.classes, next);
   }
 }
 
+// ../core/src/compress-engine.ts
+init_esm_shims();
+var SEP = "
";
+function tupleKey(condition, property, value, important) {
+  return `${condition}${SEP}${property}${SEP}${value}${SEP}${important ? "1" : "0"}`;
+}
+function styleMapTuples(map, norm) {
+  const out = [];
+  const normalized = norm.normalizeStyleMap(map);
+  for (const [ck, block] of normalized.blocks) {
+    for (const [prop, decl] of block.decls) {
+      out.push(tupleKey(String(ck), String(prop), String(decl.value), decl.important));
+    }
+  }
+  return out;
+}
+var DEFAULT_MAX_UNIVERSE = 20;
+function minStringCover(universe, vocabulary, options = {}) {
+  const uniq = [...new Set(universe)];
+  if (uniq.length === 0) return [];
+  const n = uniq.length;
+  const max = options.maxUniverse ?? DEFAULT_MAX_UNIVERSE;
+  if (n > max) return null;
+  const bitOf = /* @__PURE__ */ new Map();
+  uniq.forEach((t, i) => bitOf.set(t, i));
+  const byMask = /* @__PURE__ */ new Map();
+  for (const entry of vocabulary) {
+    if (entry.tuples.length === 0) continue;
+    let mask = 0;
+    let ok = true;
+    for (const t of entry.tuples) {
+      const b = bitOf.get(t);
+      if (b === void 0) {
+        ok = false;
+        break;
+      }
+      mask |= 1 << b;
+    }
+    if (!ok || mask === 0) continue;
+    const cost = entry.token.length + 1;
+    const prev = byMask.get(mask);
+    if (!prev || cost < prev.cost || cost === prev.cost && entry.token < prev.token) {
+      byMask.set(mask, { token: entry.token, mask, cost });
+    }
+  }
+  const cands = [...byMask.values()];
+  if (cands.length === 0) return null;
+  const full = (1 << n) - 1;
+  const byBit = Array.from({ length: n }, () => []);
+  cands.forEach((c, ci) => {
+    for (let b = 0; b < n; b += 1) if (c.mask & 1 << b) byBit[b].push(ci);
+  });
+  const size = full + 1;
+  const dp = new Float64Array(size).fill(Infinity);
+  const fromCand = new Int32Array(size).fill(-1);
+  const fromMask = new Int32Array(size).fill(-1);
+  dp[0] = 0;
+  for (let mask = 0; mask < full; mask += 1) {
+    const cur = dp[mask];
+    if (!Number.isFinite(cur)) continue;
+    let b = 0;
+    while (b < n && mask & 1 << b) b += 1;
+    for (const ci of byBit[b]) {
+      const c = cands[ci];
+      const nm = mask | c.mask;
+      const cost = cur + c.cost;
+      if (cost < dp[nm]) {
+        dp[nm] = cost;
+        fromCand[nm] = ci;
+        fromMask[nm] = mask;
+      }
+    }
+  }
+  if (!Number.isFinite(dp[full])) return null;
+  const chosen = [];
+  let m = full;
+  while (m !== 0) {
+    const ci = fromCand[m];
+    if (ci < 0) return null;
+    chosen.push(cands[ci].token);
+    m = fromMask[m];
+  }
+  return [...new Set(chosen)].sort();
+}
+
 // ../core/src/index.ts
 init_esm_shims();
 
@@ -1648,6 +1898,18 @@ var BOX_SIDES = {
   padding: ["padding-top", "padding-right", "padding-bottom", "padding-left"],
   margin: ["margin-top", "margin-right", "margin-bottom", "margin-left"],
   inset: ["top", "right", "bottom", "left"],
+  "scroll-margin": [
+    "scroll-margin-top",
+    "scroll-margin-right",
+    "scroll-margin-bottom",
+    "scroll-margin-left"
+  ],
+  "scroll-padding": [
+    "scroll-padding-top",
+    "scroll-padding-right",
+    "scroll-padding-bottom",
+    "scroll-padding-left"
+  ],
   "border-width": [
     "border-top-width",
     "border-right-width",
@@ -1665,8 +1927,35 @@ var BOX_SIDES = {
     "border-right-color",
     "border-bottom-color",
     "border-left-color"
+  ],
+  // `border-radius` 1–4 value form maps to the four CORNERS (TL, TR, BR, BL) — the same positional
+  // pattern boxFourSides implements. Only the slash-free form is expanded (see expandShorthand).
+  "border-radius": [
+    "border-top-left-radius",
+    "border-top-right-radius",
+    "border-bottom-right-radius",
+    "border-bottom-left-radius"
   ]
 };
+var AXIS_PAIRS = {
+  overflow: ["overflow-x", "overflow-y"],
+  "overscroll-behavior": ["overscroll-behavior-x", "overscroll-behavior-y"],
+  "place-items": ["align-items", "justify-items"],
+  "place-content": ["align-content", "justify-content"],
+  "place-self": ["align-self", "justify-self"]
+};
+var LOGICAL_PAIRS = {
+  "padding-inline": ["padding-left", "padding-right"],
+  "padding-block": ["padding-top", "padding-bottom"],
+  "margin-inline": ["margin-left", "margin-right"],
+  "margin-block": ["margin-top", "margin-bottom"],
+  "inset-inline": ["left", "right"],
+  "inset-block": ["top", "bottom"],
+  "scroll-padding-inline": ["scroll-padding-left", "scroll-padding-right"],
+  "scroll-padding-block": ["scroll-padding-top", "scroll-padding-bottom"],
+  "scroll-margin-inline": ["scroll-margin-left", "scroll-margin-right"],
+  "scroll-margin-block": ["scroll-margin-top", "scroll-margin-bottom"]
+};
 function splitTopLevel(value) {
   const out = [];
   let depth = 0;
@@ -1700,6 +1989,7 @@ function boxFourSides(values) {
   }
 }
 function expandShorthand(prop, value) {
+  if (prop === "border-radius" && value.includes("/")) return [[prop, value]];
   const box = BOX_SIDES[prop];
   if (box) {
     const parts = splitTopLevel(value);
@@ -1709,6 +1999,19 @@ function expandShorthand(prop, value) {
     }
     return [[prop, value]];
   }
+  const axis = AXIS_PAIRS[prop];
+  if (axis) {
+    const parts = splitTopLevel(value);
+    if (parts.length === 1) return [[axis[0], parts[0]], [axis[1], parts[0]]];
+    if (parts.length === 2) return [[axis[0], parts[0]], [axis[1], parts[1]]];
+    return [[prop, value]];
+  }
+  const logical = LOGICAL_PAIRS[prop];
+  if (logical) {
+    const parts = splitTopLevel(value);
+    if (parts.length === 1) return [[logical[0], parts[0]], [logical[1], parts[0]]];
+    return [[prop, value]];
+  }
   if (prop === "gap" || prop === "grid-gap") {
     const parts = splitTopLevel(value);
     if (parts.length === 1) {
@@ -1870,7 +2173,12 @@ var VISUAL_PROPERTIES = /* @__PURE__ */ new Set([
   "border-right-color",
   "border-bottom-color",
   "border-left-color",
-  "border-radius",
+  // `border-radius` is expanded to its four corner longhands by the shared normalizer, so the
+  // paint-establishing check must match those (a rounded wrapper still clips its background).
+  "border-top-left-radius",
+  "border-top-right-radius",
+  "border-bottom-right-radius",
+  "border-bottom-left-radius",
   "box-shadow",
   "outline",
   "outline-width",
@@ -1896,6 +2204,7 @@ var hasOwnVisualStyle = (node, ctx) => {
   const el = asElement(node);
   if (!el) return false;
   if (el.meta.hasOwnVisualStyle) return true;
+  if (el.meta.hasUnresolvedClasses) return true;
   const computedMap = ctx.computedOf(el) ?? el.computed;
   const norm = normalizer.normalizeStyleMap(computedMap);
   for (const block of norm.blocks.values()) {
@@ -2186,6 +2495,10 @@ export {
   createSyntheticSink,
   createPipeline,
   syncClassesFromComputed,
+  tupleKey,
+  styleMapTuples,
+  DEFAULT_MAX_UNIVERSE,
+  minStringCover,
   createNormalizer,
   normalizer,
   isStyleSuperset,
@@ -2209,4 +2522,4 @@ export {
   definePattern,
   pattern
 };
-//# sourceMappingURL=chunk-DWLB7FRR.js.map
+//# sourceMappingURL=chunk-TTJEXWAC.js.map