machinalayout 0.1.0 → 0.3.0

package/dist/index.js

@@ -1,12 +1,29 @@
-// src/errors.ts
-var MachinaLayoutError = class extends Error {
-  code;
-  constructor(code, message) {
-    super(message);
-    this.name = "MachinaLayoutError";
-    this.code = code;
-  }
-};
+import {
+  createViewportMatrix,
+  defineMachinaScreens,
+  defineMachinaViewports,
+  expandScreenViewportTasks,
+  getMachinaViewport,
+  slugMachinaArtifactName
+} from "./chunk-33CKBEJH.js";
+import {
+  MachinaReactView
+} from "./chunk-ZVDE7PX4.js";
+import "./chunk-2ZQ2RFFI.js";
+import "./chunk-RJYRJ3LD.js";
+import {
+  MachinaTextView
+} from "./chunk-KYWOCAHK.js";
+import {
+  parseMachinaText,
+  parseMachinaTextInline
+} from "./chunk-BJOQRPPX.js";
+import {
+  toResolvedTree
+} from "./chunk-SVWYWI7I.js";
+import {
+  MachinaLayoutError
+} from "./chunk-VREK57S3.js";
 
 // src/validation.ts
 function assertFiniteNumber(value, fieldName) {
@@ -83,7 +100,10 @@ function resolveUiLength(length, axisSize, fieldName = "length") {
   if (unit === "ui") {
     return value * axisSize;
   }
-  throw new MachinaLayoutError("InvalidLengthUnit", `Invalid UiLength unit for ${fieldName}: ${String(unit)}.`);
+  throw new MachinaLayoutError(
+    "InvalidLengthUnit",
+    `Invalid UiLength unit for ${fieldName}: ${String(unit)}.`
+  );
 }
 
 // src/offset.ts
@@ -118,12 +138,18 @@ function compileLayoutRows(rows) {
       assertFiniteNumber(row.order, `rows[${rowIndex}].order`);
     }
     if (row.frame.kind === "root" && row.parent !== void 0) {
-      throw new MachinaLayoutError("RootFrameNotRoot", `row ${row.id} uses RootFrame but is not a root row.`);
+      throw new MachinaLayoutError(
+        "RootFrameNotRoot",
+        `row ${row.id} uses RootFrame but is not a root row.`
+      );
     }
     if (row.z !== void 0) {
       assertFiniteNumber(row.z, `rows[${rowIndex}].z`);
       if (!Number.isInteger(row.z) || row.z < -5 || row.z > 5) {
-        throw new MachinaLayoutError("InvalidZ", `rows[${rowIndex}].z must be an integer in range -5..5`);
+        throw new MachinaLayoutError(
+          "InvalidZ",
+          `rows[${rowIndex}].z must be an integer in range -5..5`
+        );
       }
     }
     rowById.set(row.id, row);
@@ -135,6 +161,7 @@ function compileLayoutRows(rows) {
       view: row.view,
       slot: row.slot,
       debugLabel: row.debugLabel,
+      layer: row.layer,
       offset: row.offset
     };
     if (row.parent === void 0) {
@@ -149,10 +176,16 @@ function compileLayoutRows(rows) {
   }
   const rootId = rootCandidates[0];
   if (nodes[rootId].frame.kind === "fill") {
-    throw new MachinaLayoutError("FillFrameWithoutArranger", "FillFrame cannot be used as the root frame.");
+    throw new MachinaLayoutError(
+      "FillFrameWithoutArranger",
+      "FillFrame cannot be used as the root frame."
+    );
   }
   if (nodes[rootId].frame.kind === "fixed") {
-    throw new MachinaLayoutError("FixedFrameWithoutArranger", "FixedFrame cannot be used as the root frame.");
+    throw new MachinaLayoutError(
+      "FixedFrameWithoutArranger",
+      "FixedFrame cannot be used as the root frame."
+    );
   }
   const childrenEntries = /* @__PURE__ */ new Map();
   for (let rowIndex = 0; rowIndex < rows.length; rowIndex += 1) {
@@ -164,7 +197,10 @@ function compileLayoutRows(rows) {
       throw new MachinaLayoutError("SelfParent", `node ${row.id} cannot parent itself.`);
     }
     if (!rowById.has(row.parent) || row.parent.trim().length === 0) {
-      throw new MachinaLayoutError("UnknownParent", `node ${row.id} references unknown parent: ${row.parent}`);
+      throw new MachinaLayoutError(
+        "UnknownParent",
+        `node ${row.id} references unknown parent: ${row.parent}`
+      );
     }
     const entry = {
       childId: row.id,
@@ -233,6 +269,101 @@ function compileLayoutRows(rows) {
   return { rootId, nodes, children };
 }
 
+// src/selectLayoutRowsForRoot.ts
+function validateRootRect(rootRect) {
+  assertFiniteNumber(rootRect.x, "rootRect.x");
+  assertFiniteNumber(rootRect.y, "rootRect.y");
+  assertNonNegativeSize(rootRect.width, "rootRect.width");
+  assertNonNegativeSize(rootRect.height, "rootRect.height");
+}
+function validateCondition(condition, rowIndex, variantIndex) {
+  if (condition.minWidth !== void 0) {
+    assertFiniteNumber(
+      condition.minWidth,
+      `rows[${rowIndex}].variants[${variantIndex}].when.minWidth`
+    );
+  }
+  if (condition.maxWidth !== void 0) {
+    assertFiniteNumber(
+      condition.maxWidth,
+      `rows[${rowIndex}].variants[${variantIndex}].when.maxWidth`
+    );
+  }
+  if (condition.minHeight !== void 0) {
+    assertFiniteNumber(
+      condition.minHeight,
+      `rows[${rowIndex}].variants[${variantIndex}].when.minHeight`
+    );
+  }
+  if (condition.maxHeight !== void 0) {
+    assertFiniteNumber(
+      condition.maxHeight,
+      `rows[${rowIndex}].variants[${variantIndex}].when.maxHeight`
+    );
+  }
+  if (condition.minWidth !== void 0 && condition.maxWidth !== void 0 && condition.minWidth > condition.maxWidth) {
+    throw new MachinaLayoutError(
+      "InvalidVariantCondition",
+      `rows[${rowIndex}].variants[${variantIndex}].when has minWidth > maxWidth`
+    );
+  }
+  if (condition.minHeight !== void 0 && condition.maxHeight !== void 0 && condition.minHeight > condition.maxHeight) {
+    throw new MachinaLayoutError(
+      "InvalidVariantCondition",
+      `rows[${rowIndex}].variants[${variantIndex}].when has minHeight > maxHeight`
+    );
+  }
+}
+function conditionMatches(condition, rootRect) {
+  if (condition.minWidth !== void 0 && rootRect.width < condition.minWidth) return false;
+  if (condition.maxWidth !== void 0 && rootRect.width > condition.maxWidth) return false;
+  if (condition.minHeight !== void 0 && rootRect.height < condition.minHeight) return false;
+  if (condition.maxHeight !== void 0 && rootRect.height > condition.maxHeight) return false;
+  return true;
+}
+function validateVariantZ(variant, rowIndex, variantIndex) {
+  if (variant.z === void 0) return;
+  assertFiniteNumber(variant.z, `rows[${rowIndex}].variants[${variantIndex}].z`);
+  if (!Number.isInteger(variant.z) || variant.z < -5 || variant.z > 5) {
+    throw new MachinaLayoutError(
+      "InvalidZ",
+      `rows[${rowIndex}].variants[${variantIndex}].z must be an integer in range -5..5`
+    );
+  }
+}
+function selectLayoutRowsForRoot(rows, rootRect) {
+  validateRootRect(rootRect);
+  return rows.map((row, rowIndex) => {
+    const baseRow = { ...row };
+    delete baseRow.variants;
+    const variants = row.variants;
+    if (!variants || variants.length === 0) {
+      return baseRow;
+    }
+    for (let variantIndex = 0; variantIndex < variants.length; variantIndex += 1) {
+      const variant = variants[variantIndex];
+      validateCondition(variant.when, rowIndex, variantIndex);
+      validateVariantZ(variant, rowIndex, variantIndex);
+      if (!conditionMatches(variant.when, rootRect)) {
+        continue;
+      }
+      const selected = {
+        ...baseRow,
+        frame: variant.frame ?? baseRow.frame,
+        arrange: variant.arrange ?? baseRow.arrange,
+        offset: variant.offset ?? baseRow.offset,
+        z: variant.z ?? baseRow.z,
+        view: variant.view ?? baseRow.view,
+        slot: variant.slot ?? baseRow.slot,
+        debugLabel: variant.debugLabel ?? baseRow.debugLabel,
+        layer: variant.layer ?? baseRow.layer
+      };
+      return selected;
+    }
+    return baseRow;
+  });
+}
+
 // src/resolveFrame.ts
 function validateParentRect(parent) {
   assertFiniteNumber(parent.x, "parent.x");
@@ -260,11 +391,17 @@ function resolveAnchor(parent, frame) {
   if (hasHeight) assertNonNegativeSize(explicitHeight, "frame.height");
   const horizontalCount = Number(hasLeft) + Number(hasRight) + Number(hasWidth);
   if (horizontalCount !== 2) {
-    throw new MachinaLayoutError("InvalidAnchorHorizontal", "Anchor frame must specify exactly two horizontal constraints: left, right, width.");
+    throw new MachinaLayoutError(
+      "InvalidAnchorHorizontal",
+      "Anchor frame must specify exactly two horizontal constraints: left, right, width."
+    );
   }
   const verticalCount = Number(hasTop) + Number(hasBottom) + Number(hasHeight);
   if (verticalCount !== 2) {
-    throw new MachinaLayoutError("InvalidAnchorVertical", "Anchor frame must specify exactly two vertical constraints: top, bottom, height.");
+    throw new MachinaLayoutError(
+      "InvalidAnchorVertical",
+      "Anchor frame must specify exactly two vertical constraints: top, bottom, height."
+    );
   }
   let x;
   let width;
@@ -306,29 +443,159 @@ function resolveFrame(parent, frame) {
       assertFiniteNumber(frame.y, "frame.y");
       assertNonNegativeSize(frame.width, "frame.width");
       assertNonNegativeSize(frame.height, "frame.height");
-      return { x: parent.x + frame.x, y: parent.y + frame.y, width: frame.width, height: frame.height };
+      return {
+        x: parent.x + frame.x,
+        y: parent.y + frame.y,
+        width: frame.width,
+        height: frame.height
+      };
     }
     case "anchor":
       return resolveAnchor(parent, frame);
     case "root":
-      throw new MachinaLayoutError("RootFrameWithoutRoot", "RootFrame can only be declared on the root row.");
+      throw new MachinaLayoutError(
+        "RootFrameWithoutRoot",
+        "RootFrame can only be declared on the root row."
+      );
     case "fixed": {
       assertNonNegativeSize(frame.width, "frame.width");
       assertNonNegativeSize(frame.height, "frame.height");
-      throw new MachinaLayoutError("FixedFrameWithoutArranger", "Fixed frames require an arranger to determine placement.");
+      throw new MachinaLayoutError(
+        "FixedFrameWithoutArranger",
+        "Fixed frames require an arranger to determine placement."
+      );
     }
     case "fill":
-      throw new MachinaLayoutError("FillFrameWithoutArranger", "Fill frames require a stack arranger to determine placement.");
+      throw new MachinaLayoutError(
+        "FillFrameWithoutArranger",
+        "Fill frames require a stack arranger to determine placement."
+      );
+    case "cell":
+      throw new MachinaLayoutError(
+        "CellFrameWithoutGrid",
+        "Cell frames require a grid arranger to determine placement."
+      );
+    case "guide":
+      throw new MachinaLayoutError(
+        "GuideTargetUnresolved",
+        "Guide frames require document-level dependency resolution and cannot be resolved directly."
+      );
   }
 }
 
 // src/resolveLayoutDocument.ts
-function validateRootRect(rootRect) {
+function validateRootRect2(rootRect) {
   assertFiniteNumber(rootRect.x, "rootRect.x");
   assertFiniteNumber(rootRect.y, "rootRect.y");
   assertNonNegativeSize(rootRect.width, "rootRect.width");
   assertNonNegativeSize(rootRect.height, "rootRect.height");
 }
+var H_EDGES = /* @__PURE__ */ new Set(["left", "right", "centerX"]);
+var V_EDGES = /* @__PURE__ */ new Set(["top", "bottom", "centerY"]);
+var ALL_EDGES = /* @__PURE__ */ new Set(["left", "right", "top", "bottom", "centerX", "centerY"]);
+var isEdgeRef = (value) => Boolean(value && typeof value === "object" && "ref" in value && "edge" in value);
+function getRectEdgeValue(rect, edge) {
+  switch (edge) {
+    case "left":
+      return rect.x;
+    case "right":
+      return rect.x + rect.width;
+    case "centerX":
+      return rect.x + rect.width / 2;
+    case "top":
+      return rect.y;
+    case "bottom":
+      return rect.y + rect.height;
+    case "centerY":
+      return rect.y + rect.height / 2;
+    default:
+      throw new MachinaLayoutError("InvalidGuideFrame", `unknown guide edge: ${String(edge)}`);
+  }
+}
+function validateGuideFrame(nodeId, frame, document) {
+  const hCount = Number(frame.left !== void 0) + Number(frame.right !== void 0) + Number(frame.width !== void 0);
+  const vCount = Number(frame.top !== void 0) + Number(frame.bottom !== void 0) + Number(frame.height !== void 0);
+  if (hCount !== 2 || vCount !== 2)
+    throw new MachinaLayoutError(
+      "InvalidGuideFrame",
+      `guide frame must provide exactly two constraints per axis: ${nodeId}`
+    );
+  const hRefs = [frame.left, frame.right].filter(isEdgeRef);
+  const vRefs = [frame.top, frame.bottom].filter(isEdgeRef);
+  if (hRefs.length > 1 || vRefs.length > 1)
+    throw new MachinaLayoutError(
+      "GuideTooManyReferencesPerAxis",
+      `guide has too many refs on one axis: ${nodeId}`
+    );
+  for (const ref of [...hRefs, ...vRefs]) {
+    if (ref.ref === nodeId)
+      throw new MachinaLayoutError(
+        "GuideSelfReference",
+        `guide cannot reference itself: ${nodeId}`
+      );
+    if (!document.nodes[ref.ref])
+      throw new MachinaLayoutError("GuideTargetNotFound", `guide target not found: ${ref.ref}`);
+    if (!ALL_EDGES.has(ref.edge))
+      throw new MachinaLayoutError("InvalidGuideFrame", `unknown edge: ${String(ref.edge)}`);
+  }
+  for (const ref of hRefs)
+    if (!H_EDGES.has(ref.edge))
+      throw new MachinaLayoutError(
+        "GuideInvalidEdgeForAxis",
+        `horizontal guide ref must use horizontal edge: ${nodeId}`
+      );
+  for (const ref of vRefs)
+    if (!V_EDGES.has(ref.edge))
+      throw new MachinaLayoutError(
+        "GuideInvalidEdgeForAxis",
+        `vertical guide ref must use vertical edge: ${nodeId}`
+      );
+}
+function resolveGuidePosition(parentRect, side, value, resolvedNodes) {
+  if (isEdgeRef(value)) {
+    const target = resolvedNodes[value.ref];
+    if (!target)
+      throw new MachinaLayoutError(
+        "GuideTargetUnresolved",
+        `guide target unresolved: ${value.ref}`
+      );
+    const axisSize2 = side === "left" || side === "right" ? parentRect.width : parentRect.height;
+    const offset = value.offset === void 0 ? 0 : resolveUiLength(value.offset, axisSize2, `frame.${side}.offset`);
+    return getRectEdgeValue(target.rect, value.edge) + offset;
+  }
+  const axisSize = side === "left" || side === "right" ? parentRect.width : parentRect.height;
+  const scalar = resolveUiLength(value, axisSize, `frame.${side}`);
+  if (side === "left") return parentRect.x + scalar;
+  if (side === "right") return parentRect.x + parentRect.width - scalar;
+  if (side === "top") return parentRect.y + scalar;
+  return parentRect.y + parentRect.height - scalar;
+}
+function resolveGuideFrame(parentRect, frame, resolvedNodes) {
+  const hasLeft = frame.left !== void 0;
+  const hasRight = frame.right !== void 0;
+  const hasWidth = frame.width !== void 0;
+  const hasTop = frame.top !== void 0;
+  const hasBottom = frame.bottom !== void 0;
+  const hasHeight = frame.height !== void 0;
+  const left = hasLeft ? resolveGuidePosition(parentRect, "left", frame.left, resolvedNodes) : void 0;
+  const right = hasRight ? resolveGuidePosition(parentRect, "right", frame.right, resolvedNodes) : void 0;
+  const top = hasTop ? resolveGuidePosition(parentRect, "top", frame.top, resolvedNodes) : void 0;
+  const bottom = hasBottom ? resolveGuidePosition(parentRect, "bottom", frame.bottom, resolvedNodes) : void 0;
+  const explicitWidth = hasWidth ? resolveUiLength(frame.width, parentRect.width, "frame.width") : void 0;
+  const explicitHeight = hasHeight ? resolveUiLength(frame.height, parentRect.height, "frame.height") : void 0;
+  if (hasWidth) assertNonNegativeSize(explicitWidth, "frame.width");
+  if (hasHeight) assertNonNegativeSize(explicitHeight, "frame.height");
+  const x = hasLeft && hasWidth ? left : hasRight && hasWidth ? right - explicitWidth : left;
+  const width = hasWidth ? explicitWidth : right - left;
+  const y = hasTop && hasHeight ? top : hasBottom && hasHeight ? bottom - explicitHeight : top;
+  const height = hasHeight ? explicitHeight : bottom - top;
+  if (width < 0 || height < 0)
+    throw new MachinaLayoutError(
+      "NegativeResolvedSize",
+      `Resolved guide frame size must be non-negative. Received width=${width}, height=${height}.`
+    );
+  return { x, y, width, height };
+}
 function resolveStackChildRects(parentRect, arrange, childIds, document) {
   const gap = arrange.gap ?? 0;
   const justify = arrange.justify ?? "start";
@@ -341,9 +608,11 @@ function resolveStackChildRects(parentRect, arrange, childIds, document) {
     width: parentRect.width - padding.left - padding.right,
     height: parentRect.height - padding.top - padding.bottom
   };
-  if (content.width < 0 || content.height < 0) {
-    throw new MachinaLayoutError("StackContentNegative", "stack content size cannot be negative after applying padding");
-  }
+  if (content.width < 0 || content.height < 0)
+    throw new MachinaLayoutError(
+      "StackContentNegative",
+      "stack content size cannot be negative after applying padding"
+    );
   const isHorizontal = arrange.axis === "horizontal";
   const contentMain = isHorizontal ? content.width : content.height;
   const contentCross = isHorizontal ? content.height : content.width;
@@ -352,9 +621,11 @@ function resolveStackChildRects(parentRect, arrange, childIds, document) {
   const fillWeights = [];
   for (const childId of childIds) {
     const childNode = document.nodes[childId];
-    if (!childNode) {
-      throw new MachinaLayoutError("UnknownParent", `child id ${childId} referenced by arranged parent is missing`);
-    }
+    if (!childNode)
+      throw new MachinaLayoutError(
+        "UnknownParent",
+        `child id ${childId} referenced by arranged parent is missing`
+      );
     if (childNode.frame.kind === "fixed") {
       assertNonNegativeSize(childNode.frame.width, `${childId}.frame.width`);
       assertNonNegativeSize(childNode.frame.height, `${childId}.frame.height`);
@@ -363,14 +634,18 @@ function resolveStackChildRects(parentRect, arrange, childIds, document) {
       fillWeights.push(0);
       continue;
     }
-    if (childNode.frame.kind !== "fill") {
-      throw new MachinaLayoutError("StackChildMustBeFixed", `stack child must use fixed or fill frame: ${childId}`);
-    }
+    if (childNode.frame.kind !== "fill")
+      throw new MachinaLayoutError(
+        "StackChildMustBeFixed",
+        `stack child must use fixed or fill frame: ${childId}`
+      );
     const weight = childNode.frame.weight ?? 1;
     assertFiniteNumber(weight, `${childId}.frame.weight`);
-    if (weight <= 0) {
-      throw new MachinaLayoutError("InvalidFillWeight", `${childId}.frame.weight must be greater than 0`);
-    }
+    if (weight <= 0)
+      throw new MachinaLayoutError(
+        "InvalidFillWeight",
+        `${childId}.frame.weight must be greater than 0`
+      );
     const cross = childNode.frame.cross ?? "fill";
     let childCross = contentCross;
     if (cross !== "fill") {
@@ -381,49 +656,31 @@ function resolveStackChildRects(parentRect, arrange, childIds, document) {
     childCrossSizes.push(childCross);
     fillWeights.push(weight);
   }
-  const fixedMainTotal = childIds.reduce((sum, _id, i) => sum + (fillWeights[i] === 0 ? childMainSizes[i] : 0), 0);
+  const fixedMainTotal = childIds.reduce(
+    (sum, _id, i) => sum + (fillWeights[i] === 0 ? childMainSizes[i] : 0),
+    0
+  );
   const totalGap = gap * Math.max(0, childIds.length - 1);
   const remainingMain = contentMain - fixedMainTotal - totalGap;
-  if (remainingMain < 0) {
-    throw new MachinaLayoutError("StackOverflow", "stack main axis overflow");
-  }
+  if (remainingMain < 0) throw new MachinaLayoutError("StackOverflow", "stack main axis overflow");
   const totalFillWeight = fillWeights.reduce((sum, w) => sum + w, 0);
   if (totalFillWeight > 0) {
-    for (let i = 0; i < childMainSizes.length; i += 1) {
-      if (fillWeights[i] > 0) {
+    for (let i = 0; i < childMainSizes.length; i += 1)
+      if (fillWeights[i] > 0)
         childMainSizes[i] = remainingMain * fillWeights[i] / totalFillWeight;
-      }
-    }
   }
-  for (const childCross of childCrossSizes) {
-    if (childCross > contentCross) {
+  for (const childCross of childCrossSizes)
+    if (childCross > contentCross)
       throw new MachinaLayoutError("StackOverflow", "stack cross axis overflow");
-    }
-  }
   const occupiedMain = childMainSizes.reduce((sum, size) => sum + size, 0) + totalGap;
   const remainingMainAfterFill = contentMain - occupiedMain;
   let startOffset = 0;
   let actualGap = gap;
   if (totalFillWeight === 0) {
-    switch (justify) {
-      case "start":
-        break;
-      case "center":
-        startOffset = remainingMainAfterFill / 2;
-        break;
-      case "end":
-        startOffset = remainingMainAfterFill;
-        break;
-      case "space-between":
-        if (childIds.length <= 1) {
-          actualGap = 0;
-        } else {
-          actualGap = gap + remainingMainAfterFill / (childIds.length - 1);
-        }
-        break;
-      default:
-        throw new Error(`Unsupported stack justify: ${String(justify)}`);
-    }
+    if (justify === "center") startOffset = remainingMainAfterFill / 2;
+    else if (justify === "end") startOffset = remainingMainAfterFill;
+    else if (justify === "space-between")
+      actualGap = childIds.length <= 1 ? 0 : gap + remainingMainAfterFill / (childIds.length - 1);
   }
   const rects = {};
   let currentMain = startOffset;
@@ -431,134 +688,247 @@ function resolveStackChildRects(parentRect, arrange, childIds, document) {
     const childMain = childMainSizes[index];
     const childCross = childCrossSizes[index];
     let crossOffset = 0;
-    switch (align) {
-      case "start":
-        break;
-      case "center":
-        crossOffset = (contentCross - childCross) / 2;
-        break;
-      case "end":
-        crossOffset = contentCross - childCross;
-        break;
-      default:
-        throw new Error(`Unsupported stack align: ${String(align)}`);
-    }
-    rects[childId] = isHorizontal ? { x: content.x + currentMain, y: content.y + crossOffset, width: childMain, height: childCross } : { x: content.x + crossOffset, y: content.y + currentMain, width: childCross, height: childMain };
+    if (align === "center") crossOffset = (contentCross - childCross) / 2;
+    else if (align === "end") crossOffset = contentCross - childCross;
+    rects[childId] = isHorizontal ? {
+      x: content.x + currentMain,
+      y: content.y + crossOffset,
+      width: childMain,
+      height: childCross
+    } : {
+      x: content.x + crossOffset,
+      y: content.y + currentMain,
+      width: childCross,
+      height: childMain
+    };
     currentMain += childMain + actualGap;
   });
   return rects;
 }
+function validateGridTrack(track, axis, index) {
+  if (track.kind === "fixed") {
+    if (!Number.isFinite(track.size) || track.size < 0)
+      throw new MachinaLayoutError(
+        "InvalidGridTrack",
+        `${axis}[${index}].size must be finite and non-negative`
+      );
+    return;
+  }
+  if (track.kind === "fill") {
+    const weight = track.weight ?? 1;
+    if (!Number.isFinite(weight) || weight <= 0)
+      throw new MachinaLayoutError(
+        "InvalidGridTrack",
+        `${axis}[${index}].weight must be finite and greater than 0`
+      );
+    return;
+  }
+  throw new MachinaLayoutError("InvalidGridTrack", `${axis}[${index}] has unknown track kind`);
+}
+function resolveGridTracks(contentAxisSize, tracks, gap, axis) {
+  if (!Number.isFinite(gap) || gap < 0 || tracks.length === 0)
+    throw new MachinaLayoutError("InvalidGridTrack", `invalid ${axis} configuration`);
+  tracks.forEach((t, i) => {
+    validateGridTrack(t, axis, i);
+  });
+  const fixedTotal = tracks.reduce((s, t) => s + (t.kind === "fixed" ? t.size : 0), 0);
+  const gapTotal = gap * Math.max(0, tracks.length - 1);
+  const remaining = contentAxisSize - fixedTotal - gapTotal;
+  if (remaining < 0) throw new MachinaLayoutError("GridOverflow", `grid ${axis} overflow`);
+  const totalWeight = tracks.reduce((s, t) => s + (t.kind === "fill" ? t.weight ?? 1 : 0), 0);
+  const sizes = tracks.map(
+    (t) => t.kind === "fixed" ? t.size : totalWeight <= 0 ? 0 : remaining * (t.weight ?? 1) / totalWeight
+  );
+  let current = 0;
+  return sizes.map((size) => {
+    const r = { start: current, size };
+    current += size + gap;
+    return r;
+  });
+}
+function resolveGridChildRect(childNode, columns, rows, columnGap, rowGap, content) {
+  if (childNode.frame.kind !== "cell")
+    throw new MachinaLayoutError(
+      "GridChildMustBeCell",
+      `grid child must use cell frame: ${childNode.id}`
+    );
+  const { row, col } = childNode.frame;
+  const rowSpan = childNode.frame.rowSpan ?? 1;
+  const colSpan = childNode.frame.colSpan ?? 1;
+  if (!Number.isInteger(row) || row < 0 || !Number.isInteger(col) || col < 0 || !Number.isInteger(rowSpan) || rowSpan <= 0 || !Number.isInteger(colSpan) || colSpan <= 0)
+    throw new MachinaLayoutError(
+      "InvalidGridCell",
+      `invalid cell coordinates/spans for node ${childNode.id}`
+    );
+  if (row + rowSpan > rows.length || col + colSpan > columns.length)
+    throw new MachinaLayoutError(
+      "InvalidGridCell",
+      `cell exceeds grid bounds for node ${childNode.id}`
+    );
+  const x = content.x + columns[col].start;
+  const y = content.y + rows[row].start;
+  let width = columnGap * (colSpan - 1);
+  for (let i = col; i < col + colSpan; i += 1) width += columns[i].size;
+  let height = rowGap * (rowSpan - 1);
+  for (let i = row; i < row + rowSpan; i += 1) height += rows[i].size;
+  return { x, y, width, height };
+}
 function resolveLayoutDocument(document, rootRect) {
-  validateRootRect(rootRect);
+  validateRootRect2(rootRect);
   const rootNode = document.nodes[document.rootId];
-  if (!rootNode) {
+  if (!rootNode)
     throw new MachinaLayoutError("MissingRoot", `root node not found for id: ${document.rootId}`);
-  }
   const resolvedNodes = {};
   const resolvedChildren = {};
   const visitState = /* @__PURE__ */ new Map();
-  let visitedCount = 0;
+  const pendingGuides = /* @__PURE__ */ new Map();
   const resolveNode = (nodeId, rect) => {
     const state = visitState.get(nodeId) ?? 0;
-    if (state === 1) {
-      throw new MachinaLayoutError("Cycle", `cycle detected at node ${nodeId}`);
-    }
-    if (state === 2) {
-      return;
-    }
+    if (state === 1) throw new MachinaLayoutError("Cycle", `cycle detected at node ${nodeId}`);
+    if (state === 2) return;
     const node = document.nodes[nodeId];
-    if (!node) {
-      throw new MachinaLayoutError("UnknownParent", `node referenced in children but missing from nodes: ${nodeId}`);
-    }
+    if (!node)
+      throw new MachinaLayoutError(
+        "UnknownParent",
+        `node referenced in children but missing from nodes: ${nodeId}`
+      );
     visitState.set(nodeId, 1);
-    visitedCount += 1;
     resolvedNodes[nodeId] = {
       id: node.id,
       z: node.z,
-      rect: { x: rect.x, y: rect.y, width: rect.width, height: rect.height },
+      rect: { ...rect },
       frame: node.frame,
       arrange: node.arrange,
       view: node.view,
       slot: node.slot,
       debugLabel: node.debugLabel,
+      layer: node.layer,
       offset: node.offset
     };
     const childIds = document.children[nodeId] ?? [];
     resolvedChildren[nodeId] = [...childIds];
-    const childRects = node.arrange?.kind === "stack" ? resolveStackChildRects(rect, node.arrange, childIds, document) : void 0;
+    let childRects;
+    if (node.arrange?.kind === "stack")
+      childRects = resolveStackChildRects(rect, node.arrange, childIds, document);
+    else if (node.arrange?.kind === "grid") {
+      const columnGap = node.arrange.columnGap ?? 0;
+      const rowGap = node.arrange.rowGap ?? 0;
+      const padding = normalizePadding(node.arrange.padding);
+      const content = {
+        x: rect.x + padding.left,
+        y: rect.y + padding.top,
+        width: rect.width - padding.left - padding.right,
+        height: rect.height - padding.top - padding.bottom
+      };
+      if (content.width < 0 || content.height < 0)
+        throw new MachinaLayoutError(
+          "GridContentNegative",
+          "grid content size cannot be negative after applying padding"
+        );
+      const columns = resolveGridTracks(content.width, node.arrange.columns, columnGap, "columns");
+      const rows = resolveGridTracks(content.height, node.arrange.rows, rowGap, "rows");
+      childRects = {};
+      for (const childId of childIds) {
+        const childNode = document.nodes[childId];
+        if (!childNode)
+          throw new MachinaLayoutError(
+            "UnknownParent",
+            `child id ${childId} referenced by ${nodeId} is missing`
+          );
+        childRects[childId] = resolveGridChildRect(
+          childNode,
+          columns,
+          rows,
+          columnGap,
+          rowGap,
+          content
+        );
+      }
+    }
     for (const childId of childIds) {
       const childNode = document.nodes[childId];
-      if (!childNode) {
-        throw new MachinaLayoutError("UnknownParent", `child id ${childId} referenced by ${nodeId} is missing`);
+      if (!childNode)
+        throw new MachinaLayoutError(
+          "UnknownParent",
+          `child id ${childId} referenced by ${nodeId} is missing`
+        );
+      if (childNode.frame.kind === "guide" && !childRects) {
+        validateGuideFrame(childId, childNode.frame, document);
+        pendingGuides.set(childId, { nodeId: childId, parentId: nodeId });
+        continue;
       }
       const normalChildRect = childRects?.[childId] ?? resolveFrame(rect, childNode.frame);
-      const childRect = applyOffset(normalChildRect, rect, childNode.offset);
-      resolveNode(childId, childRect);
+      resolveNode(childId, applyOffset(normalChildRect, rect, childNode.offset));
     }
     visitState.set(nodeId, 2);
   };
-  resolveNode(document.rootId, { x: rootRect.x, y: rootRect.y, width: rootRect.width, height: rootRect.height });
-  if (visitedCount !== Object.keys(document.nodes).length) {
-    throw new MachinaLayoutError("UnreachableNode", "one or more nodes are unreachable from the root.");
-  }
-  return {
-    rootId: document.rootId,
-    nodes: resolvedNodes,
-    children: resolvedChildren
+  const processPending = () => {
+    while (pendingGuides.size > 0) {
+      let progressed = false;
+      for (const [id, pending] of [...pendingGuides.entries()]) {
+        const parentResolved = resolvedNodes[pending.parentId];
+        const node = document.nodes[id];
+        if (!parentResolved || !node || node.frame.kind !== "guide") continue;
+        const refs = [node.frame.left, node.frame.right, node.frame.top, node.frame.bottom].filter(
+          isEdgeRef
+        );
+        if (refs.some((r) => !resolvedNodes[r.ref])) continue;
+        const rect = resolveGuideFrame(parentResolved.rect, node.frame, resolvedNodes);
+        resolveNode(id, applyOffset(rect, parentResolved.rect, node.offset));
+        pendingGuides.delete(id);
+        progressed = true;
+      }
+      if (pendingGuides.size === 0) return;
+      if (progressed) continue;
+      const remaining = /* @__PURE__ */ new Set([...pendingGuides.keys()]);
+      const visiting = /* @__PURE__ */ new Set();
+      const visited = /* @__PURE__ */ new Set();
+      const hasCycle = (id) => {
+        if (visiting.has(id)) return true;
+        if (visited.has(id)) return false;
+        visiting.add(id);
+        const node = document.nodes[id];
+        if (node?.frame.kind === "guide") {
+          for (const ref of [
+            node.frame.left,
+            node.frame.right,
+            node.frame.top,
+            node.frame.bottom
+          ].filter(isEdgeRef)) {
+            if (remaining.has(ref.ref) && hasCycle(ref.ref)) return true;
+          }
+        }
+        visiting.delete(id);
+        visited.add(id);
+        return false;
+      };
+      for (const id of remaining) {
+        if (hasCycle(id))
+          throw new MachinaLayoutError("GuideReferenceCycle", "guide reference cycle detected");
+      }
+      throw new MachinaLayoutError(
+        "GuideTargetUnresolved",
+        "one or more guide targets could not be resolved"
+      );
+    }
   };
+  resolveNode(document.rootId, { ...rootRect });
+  processPending();
+  if (Object.keys(resolvedNodes).length !== Object.keys(document.nodes).length)
+    throw new MachinaLayoutError(
+      "UnreachableNode",
+      "one or more nodes are unreachable from the root."
+    );
+  return { rootId: document.rootId, nodes: resolvedNodes, children: resolvedChildren };
 }
 
 // src/resolveLayoutRows.ts
 function resolveLayoutRows(rows, rootRect) {
-  const document = compileLayoutRows(rows);
+  const selectedRows = selectLayoutRowsForRoot(rows, rootRect);
+  const document = compileLayoutRows(selectedRows);
   return resolveLayoutDocument(document, rootRect);
 }
 
-// src/toResolvedTree.ts
-function toResolvedTree(document) {
-  const root = document.nodes[document.rootId];
-  if (!root) {
-    throw new MachinaLayoutError("MissingRoot", `root node '${document.rootId}' is missing`);
-  }
-  const visiting = /* @__PURE__ */ new Set();
-  const visited = /* @__PURE__ */ new Set();
-  const build = (node) => {
-    if (visiting.has(node.id)) {
-      throw new MachinaLayoutError("Cycle", `cycle detected at '${node.id}'`);
-    }
-    visiting.add(node.id);
-    visited.add(node.id);
-    const childIds = document.children[node.id] ?? [];
-    const children = childIds.map((childId) => {
-      const child = document.nodes[childId];
-      if (!child) {
-        throw new MachinaLayoutError("UnknownParent", `missing child node '${childId}' referenced by '${node.id}'`);
-      }
-      return build(child);
-    });
-    visiting.delete(node.id);
-    return {
-      id: node.id,
-      z: node.z,
-      rect: { ...node.rect },
-      frame: node.frame,
-      arrange: node.arrange,
-      view: node.view,
-      slot: node.slot,
-      debugLabel: node.debugLabel,
-      offset: node.offset,
-      children
-    };
-  };
-  const tree = build(root);
-  for (const nodeId of Object.keys(document.nodes)) {
-    if (!visited.has(nodeId)) {
-      throw new MachinaLayoutError("UnreachableNode", `node '${nodeId}' is unreachable from root '${document.rootId}'`);
-    }
-  }
-  return tree;
-}
-
 // src/flattenResolvedTree.ts
 function flattenResolvedTree(tree) {
   const out = [];
@@ -572,6 +942,7 @@ function flattenResolvedTree(tree) {
       view: node.view,
       slot: node.slot,
       debugLabel: node.debugLabel,
+      layer: node.layer,
       offset: node.offset
     });
     for (const child of node.children) {
@@ -587,464 +958,248 @@ function formatRect(rect) {
   return `x=${rect.x} y=${rect.y} w=${rect.width} h=${rect.height}`;
 }
 
-// src/react/MachinaReactView.tsx
-import React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-function renderNode(node, parentRect, views, viewData, nodeData, nodeClassName, debug, nodeContainment, nodeContentVisibility, nodeContainIntrinsicSize, nodesById) {
-  const viewKey = node.view ?? node.slot;
-  const View = viewKey ? views[viewKey] : void 0;
-  const selectedViewData = viewKey ? viewData?.[viewKey] : void 0;
-  const selectedNodeData = nodeData?.[node.id];
-  const left = node.rect.x - parentRect.x;
-  const top = node.rect.y - parentRect.y;
-  const style = {
-    position: "absolute",
-    left,
-    top,
-    width: node.rect.width,
-    height: node.rect.height,
-    boxSizing: "border-box",
-    zIndex: node.z ?? 0,
-    ...nodeContainment === "layout-paint" ? { contain: "layout paint" } : null,
-    ...nodeContainment === "strict" ? { contain: "strict" } : null,
-    ...nodeContentVisibility === "auto" ? { contentVisibility: "auto" } : null,
-    ...nodeContainIntrinsicSize !== void 0 ? { containIntrinsicSize: nodeContainIntrinsicSize } : null,
-    ...debug ? { outline: "1px dashed rgba(59, 130, 246, 0.9)" } : null
-  };
-  const renderedSlot = View && nodesById[node.id] ? React.createElement(View, {
-    id: node.id,
-    rect: { ...node.rect },
-    debugLabel: node.debugLabel,
-    node: { ...nodesById[node.id], rect: { ...nodesById[node.id].rect } },
-    viewKey,
-    viewData: selectedViewData,
-    nodeData: selectedNodeData
-  }) : null;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-testid": `machina-node-${node.id}`,
-      className: nodeClassName,
-      style,
-      "data-machina-node-id": node.id,
-      "data-machina-slot": node.slot,
-      "data-machina-view": viewKey,
-      "data-machina-debug-label": node.debugLabel,
-      children: [
-        debug ? /* @__PURE__ */ jsx("small", { children: node.debugLabel ?? node.id }) : null,
-        renderedSlot,
-        [...node.children].map((child, index) => ({ child, index })).sort((a, b) => (a.child.z ?? 0) - (b.child.z ?? 0) || a.index - b.index).map(
-          ({ child }) => renderNode(
-            child,
-            node.rect,
-            views,
-            viewData,
-            nodeData,
-            nodeClassName,
-            debug,
-            nodeContainment,
-            nodeContentVisibility,
-            nodeContainIntrinsicSize,
-            nodesById
-          )
-        )
-      ]
-    },
-    node.id
-  );
+// src/stackGeometry.ts
+function copyRect(rect) {
+  return { x: rect.x, y: rect.y, width: rect.width, height: rect.height };
 }
-function MachinaReactView(props) {
-  const {
-    layout,
-    views = {},
-    viewData,
-    nodeData,
-    className,
-    style,
-    nodeClassName,
-    debug,
-    nodeContainment = "layout-paint",
-    nodeContentVisibility = "none",
-    nodeContainIntrinsicSize
-  } = props;
-  const tree = toResolvedTree(layout);
-  const wrapperStyle = {
-    position: "relative",
-    width: tree.rect.width,
-    height: tree.rect.height,
-    ...style
+function applyPadding(parentRect, padding) {
+  return {
+    x: parentRect.x + padding.left,
+    y: parentRect.y + padding.top,
+    width: parentRect.width - padding.left - padding.right,
+    height: parentRect.height - padding.top - padding.bottom
   };
-  return /* @__PURE__ */ jsx("div", { className, style: wrapperStyle, "data-machina-root-id": tree.id, children: renderNode(
-    tree,
-    tree.rect,
-    views,
-    viewData,
-    nodeData,
-    nodeClassName,
-    debug,
-    nodeContainment,
-    nodeContentVisibility,
-    nodeContainIntrinsicSize,
-    layout.nodes
-  ) });
 }
-
-// src/text/parseMachinaText.ts
-function makeDiagnostic(code, message, index, length, line, column) {
-  return { code, message, index, length, line, column, level: "error" };
-}
-function toLines(source) {
-  const lines = [];
-  let i = 0;
-  let line = 1;
-  while (i <= source.length) {
-    const start = i;
-    while (i < source.length && source[i] !== "\n" && source[i] !== "\r") i += 1;
-    const text = source.slice(start, i);
-    lines.push({ text, index: start, line });
-    if (i >= source.length) break;
-    if (source[i] === "\r" && source[i + 1] === "\n") i += 2;
-    else i += 1;
-    line += 1;
+function assertContentNonNegative(contentRect, code) {
+  if (contentRect.width < 0 || contentRect.height < 0) {
+    throw new MachinaLayoutError(
+      code,
+      `${code === "StackContentNegative" ? "stack" : "grid"} content size cannot be negative after applying padding`
+    );
   }
-  return lines;
 }
-function parseInline(text, lineIndex, line) {
-  const diagnostics = [];
-  const inline = [];
-  let cursor = 0;
-  const pushText = (t) => {
-    if (!t) return;
-    const prev = inline[inline.length - 1];
-    if (prev?.kind === "text") prev.text += t;
-    else inline.push({ kind: "text", text: t });
-  };
-  const allowedEscapes = /* @__PURE__ */ new Set(["\\", "*", "`", "[", "]", "(", ")", "-"]);
-  const consumeEscape = () => {
-    if (text[cursor] !== "\\") return false;
-    if (cursor === text.length - 1) {
-      diagnostics.push(makeDiagnostic("invalid_escape", "Dangling escape sequence.", lineIndex + cursor, 1, line, cursor + 1));
-      pushText("\\");
-      cursor += 1;
-      return true;
-    }
-    const escaped = text[cursor + 1];
-    if (allowedEscapes.has(escaped)) {
-      pushText(escaped);
-      cursor += 2;
-      return true;
-    }
-    diagnostics.push(makeDiagnostic("invalid_escape", `Unsupported escape sequence: \\${escaped}`, lineIndex + cursor, 2, line, cursor + 1));
-    pushText(escaped);
-    cursor += 2;
-    return true;
-  };
-  while (cursor < text.length) {
-    if (consumeEscape()) continue;
-    if (text.startsWith("![", cursor)) {
-      diagnostics.push(makeDiagnostic("unsupported_syntax", "Images are not supported.", lineIndex + cursor, 2, line, cursor + 1));
-      pushText("![");
-      cursor += 2;
-      continue;
-    }
-    if (text[cursor] === "`") {
-      const close = text.indexOf("`", cursor + 1);
-      if (close < 0) {
-        diagnostics.push(makeDiagnostic("unclosed_inline", "Unclosed inline code marker.", lineIndex + cursor, text.length - cursor, line, cursor + 1));
-        pushText(text.slice(cursor));
-        break;
-      }
-      inline.push({ kind: "code", text: text.slice(cursor + 1, close) });
-      cursor = close + 1;
-      continue;
-    }
-    if (text.startsWith("**", cursor)) {
-      const close = text.indexOf("**", cursor + 2);
-      if (close < 0) {
-        diagnostics.push(makeDiagnostic("unclosed_inline", "Unclosed strong marker.", lineIndex + cursor, text.length - cursor, line, cursor + 1));
-        pushText(text.slice(cursor));
-        break;
-      }
-      const children = parseInline(text.slice(cursor + 2, close), lineIndex + cursor + 2, line);
-      diagnostics.push(...children.diagnostics);
-      inline.push({ kind: "strong", children: children.inline });
-      cursor = close + 2;
-      continue;
-    }
-    if (text[cursor] === "*") {
-      const close = text.indexOf("*", cursor + 1);
-      if (close < 0) {
-        diagnostics.push(makeDiagnostic("unclosed_inline", "Unclosed emphasis marker.", lineIndex + cursor, text.length - cursor, line, cursor + 1));
-        pushText(text.slice(cursor));
-        break;
-      }
-      const children = parseInline(text.slice(cursor + 1, close), lineIndex + cursor + 1, line);
-      diagnostics.push(...children.diagnostics);
-      inline.push({ kind: "emphasis", children: children.inline });
-      cursor = close + 1;
-      continue;
-    }
-    if (text[cursor] === "[") {
-      const closeBracket = text.indexOf("]", cursor + 1);
-      if (closeBracket < 0 || text[closeBracket + 1] !== "(") {
-        diagnostics.push(makeDiagnostic("malformed_link", "Malformed link syntax.", lineIndex + cursor, Math.max(1, text.length - cursor), line, cursor + 1));
-        pushText("[");
-        cursor += 1;
-        continue;
-      }
-      const closeParen = text.indexOf(")", closeBracket + 2);
-      if (closeParen < 0) {
-        diagnostics.push(makeDiagnostic("malformed_link", "Malformed link syntax.", lineIndex + cursor, text.length - cursor, line, cursor + 1));
-        pushText(text.slice(cursor));
-        break;
-      }
-      const label = text.slice(cursor + 1, closeBracket);
-      const href = text.slice(closeBracket + 2, closeParen);
-      if (label.length === 0) {
-        diagnostics.push(makeDiagnostic("malformed_link", "Link label cannot be empty.", lineIndex + cursor, closeParen - cursor + 1, line, cursor + 1));
-        pushText(text.slice(cursor, closeParen + 1));
-        cursor = closeParen + 1;
-        continue;
-      }
-      const labelInline = parseInline(label, lineIndex + cursor + 1, line);
-      diagnostics.push(...labelInline.diagnostics);
-      inline.push({ kind: "link", href, children: labelInline.inline });
-      cursor = closeParen + 1;
-      continue;
-    }
-    const specials = ["![", "`", "**", "*", "[", "\\"];
-    let next = text.length;
-    for (const special of specials) {
-      const p = text.indexOf(special, cursor);
-      if (p >= 0 && p < next) next = p;
-    }
-    if (next === cursor) {
-      pushText(text[cursor]);
-      cursor += 1;
-      continue;
-    }
-    pushText(text.slice(cursor, next));
-    cursor = next;
-  }
-  return { inline, diagnostics };
+function requireNode(layout, nodeId) {
+  const node = layout.nodes[nodeId];
+  if (!node) throw new MachinaLayoutError("InvalidId", `node id not found: ${nodeId}`);
+  return node;
 }
-function classifyForbiddenBlock(line) {
-  if (/^#{1,6}\s+/.test(line)) return "heading_forbidden";
-  if (/^\d+\.\s+/.test(line)) return "unsupported_syntax";
-  if (/^\s*-\s+\[[ xX]\]\s+/.test(line)) return "unsupported_syntax";
-  if (/^>\s+/.test(line)) return "unsupported_syntax";
-  if (/^```/.test(line)) return "unsupported_syntax";
-  if (/^\s*<\/?[a-zA-Z][^>]*>/.test(line)) return "unsupported_syntax";
-  if (/^\s*\|?\s*:?-{3,}:?\s*(\|\s*:?-{3,}:?\s*)+\|?\s*$/.test(line)) return "unsupported_syntax";
-  return void 0;
+function requireStackArrange(layout, parentId) {
+  const parent = requireNode(layout, parentId);
+  if (parent.arrange?.kind !== "stack") {
+    throw new MachinaLayoutError(
+      "ExpectedStackArrange",
+      `expected stack arrange for node: ${parentId}`
+    );
+  }
+  return parent.arrange;
 }
-function parseBulletLine(line) {
-  if (line.startsWith("\\- ")) return void 0;
-  if (line.startsWith("- ")) return { depth: 1, text: line.slice(2) };
-  if (line.startsWith("  - ")) return { depth: 2, text: line.slice(4) };
-  if (line.startsWith("    - ")) return { depth: 3, text: line.slice(6) };
-  return void 0;
+function getArrangeContentRect(parentRect, arrange) {
+  if (!arrange) return copyRect(parentRect);
+  if (arrange.kind === "stack") {
+    const contentRect = applyPadding(parentRect, normalizePadding(arrange.padding));
+    assertContentNonNegative(contentRect, "StackContentNegative");
+    return contentRect;
+  }
+  if (arrange.kind === "grid") {
+    const contentRect = applyPadding(parentRect, normalizePadding(arrange.padding));
+    assertContentNonNegative(contentRect, "GridContentNegative");
+    return contentRect;
+  }
+  return copyRect(parentRect);
 }
-function parseMachinaTextInline(text) {
-  return parseInline(text, 0, 1);
+function getStackContentRect(layout, parentId) {
+  const parent = requireNode(layout, parentId);
+  const arrange = requireStackArrange(layout, parentId);
+  return getArrangeContentRect(parent.rect, arrange);
 }
-function parseMachinaText(source) {
-  const src = typeof source === "string" ? { kind: "machina-text", text: source } : source;
-  if (src?.kind !== "plain" && src?.kind !== "machina-text") {
-    const diagnostic = makeDiagnostic("unsupported_syntax", "Unsupported MachinaText source kind.", 0, 0, 1, 1);
-    return { ok: false, document: { blocks: [] }, diagnostics: [diagnostic] };
-  }
-  if (src.kind === "plain") {
+function getStackMainAxisMetrics(layout, parentId) {
+  const parent = requireNode(layout, parentId);
+  const arrange = requireStackArrange(layout, parentId);
+  const contentRect = getArrangeContentRect(parent.rect, arrange);
+  const isHorizontal = arrange.axis === "horizontal";
+  const childIds = [...layout.children[parentId] ?? []];
+  const childMetrics = childIds.map((id) => {
+    const child = requireNode(layout, id);
+    const rect = copyRect(child.rect);
+    const mainStart = isHorizontal ? rect.x - contentRect.x : rect.y - contentRect.y;
+    const mainSize = isHorizontal ? rect.width : rect.height;
+    const crossStart = isHorizontal ? rect.y - contentRect.y : rect.x - contentRect.x;
+    const crossSize = isHorizontal ? rect.height : rect.width;
     return {
-      ok: true,
-      document: { blocks: [{ kind: "paragraph", inline: [{ kind: "text", text: src.text }] }] },
-      diagnostics: []
+      id,
+      rect,
+      mainStart,
+      mainEnd: mainStart + mainSize,
+      mainSize,
+      crossStart,
+      crossEnd: crossStart + crossSize,
+      crossSize,
+      frameKind: child.frame.kind,
+      z: child.z,
+      layer: child.layer
     };
+  });
+  const contentMainSize = isHorizontal ? contentRect.width : contentRect.height;
+  const contentCrossSize = isHorizontal ? contentRect.height : contentRect.width;
+  const totalChildMainSize = childMetrics.reduce((sum, metric) => sum + metric.mainSize, 0);
+  const totalGapSize = (arrange.gap ?? 0) * Math.max(0, childMetrics.length - 1);
+  const usedMainSize = totalChildMainSize + totalGapSize;
+  return {
+    parentId,
+    axis: arrange.axis,
+    parentRect: copyRect(parent.rect),
+    contentRect,
+    padding: normalizePadding(arrange.padding),
+    gap: arrange.gap ?? 0,
+    childIds,
+    childMetrics,
+    contentMainSize,
+    contentCrossSize,
+    totalChildMainSize,
+    totalGapSize,
+    usedMainSize,
+    unusedMainSize: contentMainSize - usedMainSize
+  };
+}
+function getStackChildRects(layout, parentId) {
+  requireStackArrange(layout, parentId);
+  const rects = {};
+  for (const childId of layout.children[parentId] ?? []) {
+    rects[childId] = copyRect(requireNode(layout, childId).rect);
   }
-  const blocks = [];
-  const diagnostics = [];
-  const lines = toLines(src.text);
-  let i = 0;
-  while (i < lines.length) {
-    const lineInfo = lines[i];
-    const trimmed = lineInfo.text.trim();
-    if (trimmed.length === 0) {
-      i += 1;
-      continue;
-    }
-    const forbiddenCode = classifyForbiddenBlock(lineInfo.text);
-    if (forbiddenCode) {
-      const code = forbiddenCode;
-      diagnostics.push(makeDiagnostic(code, "Unsupported block syntax.", lineInfo.index, lineInfo.text.length || 1, lineInfo.line, 1));
-      blocks.push({ kind: "paragraph", inline: [{ kind: "text", text: lineInfo.text }] });
-      i += 1;
-      continue;
-    }
-    const bullet = parseBulletLine(lineInfo.text);
-    if (bullet) {
-      const items = [];
-      let lastTop;
-      while (i < lines.length) {
-        const current = lines[i];
-        if (current.text.trim().length === 0) break;
-        const currentBullet = parseBulletLine(current.text);
-        if (!currentBullet) break;
-        if (/^\s*-\s+\[[ xX]\]\s+/.test(current.text)) {
-          diagnostics.push(makeDiagnostic("unsupported_syntax", "Task lists are not supported.", current.index, current.text.length || 1, current.line, 1));
-        }
-        if (currentBullet.depth > 2) {
-          diagnostics.push(makeDiagnostic("max_list_depth_exceeded", "Maximum bullet depth is 2.", current.index, current.text.length || 1, current.line, 1));
-          const parsed3 = parseInline(current.text.trim(), current.index + (current.text.length - current.text.trimStart().length), current.line);
-          diagnostics.push(...parsed3.diagnostics);
-          blocks.push({ kind: "paragraph", inline: parsed3.inline.length ? parsed3.inline : [{ kind: "text", text: current.text }] });
-          i += 1;
-          continue;
-        }
-        const parsed2 = parseInline(currentBullet.text, current.index + (currentBullet.depth === 1 ? 2 : 4), current.line);
-        diagnostics.push(...parsed2.diagnostics);
-        const item = { inline: parsed2.inline };
-        if (currentBullet.depth === 1) {
-          items.push(item);
-          lastTop = item;
-        } else if (lastTop) {
-          if (!lastTop.children) lastTop.children = [];
-          lastTop.children.push(item);
-        } else {
-          diagnostics.push(makeDiagnostic("unsupported_syntax", "Nested bullet requires a parent bullet.", current.index, current.text.length || 1, current.line, 1));
-          blocks.push({ kind: "paragraph", inline: [{ kind: "text", text: current.text }] });
-        }
-        i += 1;
-      }
-      blocks.push({ kind: "bulletList", items });
-      continue;
-    }
-    const paragraphLines = [];
-    while (i < lines.length && lines[i].text.trim().length > 0 && !parseBulletLine(lines[i].text) && !classifyForbiddenBlock(lines[i].text)) {
-      paragraphLines.push(lines[i]);
-      i += 1;
-    }
-    const paragraphText = paragraphLines.map((line) => line.text).join("\n");
-    const first = paragraphLines[0];
-    const parsed = parseInline(paragraphText, first?.index ?? 0, first?.line ?? 1);
-    diagnostics.push(...parsed.diagnostics);
-    blocks.push({ kind: "paragraph", inline: parsed.inline });
+  return rects;
+}
+function getRemainingStackRect(layout, options) {
+  const metrics = getStackMainAxisMetrics(layout, options.parentId);
+  const byId = new Map(metrics.childMetrics.map((metric) => [metric.id, metric]));
+  const after = options.afterChildren ?? [];
+  const before = options.beforeChildren ?? [];
+  const start = after.length === 0 ? 0 : Math.max(...after.map((id) => requireStackMetric(byId, id).mainEnd));
+  const end = before.length === 0 ? metrics.contentMainSize : Math.min(...before.map((id) => requireStackMetric(byId, id).mainStart));
+  const size = end - start;
+  if (size < 0) {
+    throw new MachinaLayoutError(
+      "StackQueryInvalidRange",
+      `remaining stack interval is negative for parent: ${options.parentId}`
+    );
   }
-  return { ok: diagnostics.every((d) => d.level !== "error"), document: { blocks }, diagnostics };
+  return metrics.axis === "horizontal" ? {
+    x: metrics.contentRect.x + start,
+    y: metrics.contentRect.y,
+    width: size,
+    height: metrics.contentRect.height
+  } : {
+    x: metrics.contentRect.x,
+    y: metrics.contentRect.y + start,
+    width: metrics.contentRect.width,
+    height: size
+  };
+}
+function requireStackMetric(metrics, childId) {
+  const metric = metrics.get(childId);
+  if (!metric) throw new MachinaLayoutError("InvalidId", `stack child id not found: ${childId}`);
+  return metric;
 }
 
-// src/text/react/MachinaTextView.tsx
-import React2 from "react";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var DEFAULT_POLICY = { variant: "body", wrap: "word", overflow: "clip", align: "start", leading: "normal", blockGap: 8, listGap: 2, valign: "top" };
-var INLINE_CODE_FONT = 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace';
-var VARIANT_STYLE = {
-  body: { fontSize: "14px", fontWeight: 400, lineHeight: 1.4 },
-  label: { fontSize: "12px", fontWeight: 500, lineHeight: 1.3 },
-  caption: { fontSize: "11px", fontWeight: 400, lineHeight: 1.25, opacity: 0.8 },
-  title: { fontSize: "18px", fontWeight: 700, lineHeight: 1.25 },
-  mono: { fontSize: "12px", lineHeight: 1.35, fontFamily: INLINE_CODE_FONT }
-};
-function isMachinaTextDocument(value) {
-  return typeof value === "object" && value !== null && "blocks" in value;
+// src/lerp.ts
+function assertFiniteNumber2(value) {
+  if (!Number.isFinite(value)) {
+    throw new MachinaLayoutError(
+      "NonFiniteNumber",
+      `Expected finite number, got ${String(value)}.`
+    );
+  }
 }
-function isMachinaTextSpec(value) {
-  return typeof value === "object" && value !== null && "kind" in value && value.kind === "text";
+function sameStringArray(a, b) {
+  if (a.length !== b.length) {
+    return false;
+  }
+  for (let index = 0; index < a.length; index += 1) {
+    if (a[index] !== b[index]) {
+      return false;
+    }
+  }
+  return true;
 }
-function normalizePositive(value, fallback) {
-  return typeof value === "number" && Number.isFinite(value) && value > 0 ? value : fallback;
+function assertCompatibleResolvedLayouts(a, b) {
+  if (a.rootId !== b.rootId) {
+    throw new MachinaLayoutError(
+      "IncompatibleLayouts",
+      `Layout roots differ: ${a.rootId} !== ${b.rootId}.`
+    );
+  }
+  if (!(a.rootId in a.nodes) || !(b.rootId in b.nodes)) {
+    throw new MachinaLayoutError(
+      "IncompatibleLayouts",
+      `Root id ${a.rootId} must exist in both node maps.`
+    );
+  }
+  const aNodeIds = Object.keys(a.nodes).sort();
+  const bNodeIds = Object.keys(b.nodes).sort();
+  if (!sameStringArray(aNodeIds, bNodeIds)) {
+    throw new MachinaLayoutError(
+      "IncompatibleLayouts",
+      "Resolved layouts must have the same node ids."
+    );
+  }
+  const aParentIds = Object.keys(a.children).sort();
+  const bParentIds = Object.keys(b.children).sort();
+  if (!sameStringArray(aParentIds, bParentIds)) {
+    throw new MachinaLayoutError(
+      "IncompatibleLayouts",
+      "Resolved layouts must have the same parent-child map."
+    );
+  }
+  for (const parentId of aParentIds) {
+    const aChildren = a.children[parentId] ?? [];
+    const bChildren = b.children[parentId] ?? [];
+    if (!sameStringArray(aChildren, bChildren)) {
+      throw new MachinaLayoutError(
+        "IncompatibleLayouts",
+        `Child order differs for parent ${parentId}.`
+      );
+    }
+  }
 }
-function normalizeNonNegative(value, fallback) {
-  return typeof value === "number" && Number.isFinite(value) && value >= 0 ? value : fallback;
+function copyChildren(children) {
+  const copied = {};
+  for (const [parentId, childIds] of Object.entries(children)) {
+    copied[parentId] = [...childIds];
+  }
+  return copied;
 }
-function normalizeLeading(value) {
-  if (value === void 0) return DEFAULT_POLICY.leading;
-  if (value === "tight" || value === "normal" || value === "loose") return value;
-  return normalizePositive(value, resolveLineHeight(DEFAULT_POLICY));
+function lerpNumber(a, b, t) {
+  assertFiniteNumber2(a);
+  assertFiniteNumber2(b);
+  assertFiniteNumber2(t);
+  return a + (b - a) * t;
 }
-function normalizeSpecPolicy(spec) {
+function lerpRect(a, b, t) {
   return {
-    variant: spec.variant ?? DEFAULT_POLICY.variant,
-    wrap: spec.wrap ?? DEFAULT_POLICY.wrap,
-    overflow: spec.overflow ?? DEFAULT_POLICY.overflow,
-    align: spec.align ?? DEFAULT_POLICY.align,
-    leading: normalizeLeading(spec.leading),
-    blockGap: normalizeNonNegative(spec.blockGap, DEFAULT_POLICY.blockGap),
-    listGap: normalizeNonNegative(spec.listGap, DEFAULT_POLICY.listGap),
-    valign: spec.valign ?? DEFAULT_POLICY.valign
+    x: lerpNumber(a.x, b.x, t),
+    y: lerpNumber(a.y, b.y, t),
+    width: lerpNumber(a.width, b.width, t),
+    height: lerpNumber(a.height, b.height, t)
   };
 }
-function normalizeText(text) {
-  if (isMachinaTextDocument(text)) return { document: text, diagnostics: [], policy: DEFAULT_POLICY };
-  if (isMachinaTextSpec(text)) {
-    const result2 = parseMachinaText(text.source);
-    return { document: result2.document, diagnostics: result2.diagnostics, policy: normalizeSpecPolicy(text) };
+function lerpResolvedLayouts(a, b, t) {
+  assertFiniteNumber2(t);
+  assertCompatibleResolvedLayouts(a, b);
+  const nodes = {};
+  for (const id of Object.keys(b.nodes)) {
+    const aNode = a.nodes[id];
+    const bNode = b.nodes[id];
+    nodes[id] = {
+      ...bNode,
+      rect: lerpRect(aNode.rect, bNode.rect, t)
+    };
   }
-  const result = parseMachinaText(typeof text === "string" ? { kind: "machina-text", text } : text);
-  return { document: result.document, diagnostics: result.diagnostics, policy: DEFAULT_POLICY };
-}
-function resolveLineHeight(policy) {
-  if (policy.leading === "tight") return 1.15;
-  if (policy.leading === "loose") return 1.6;
-  if (typeof policy.leading === "number") return policy.leading;
-  return VARIANT_STYLE[policy.variant].lineHeight;
-}
-function policyStyle(policy) {
-  const wrapStyle = { word: { whiteSpace: "normal", overflowWrap: "anywhere" }, none: { whiteSpace: "nowrap" } };
-  const overflowStyle = {
-    clip: { overflow: "hidden" },
-    ellipsis: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
-    scroll: { overflow: "auto" }
-  };
-  const alignStyle = { start: { textAlign: "left" }, center: { textAlign: "center" }, end: { textAlign: "right" } };
-  const justifyContent = {
-    top: "flex-start",
-    center: "center",
-    bottom: "flex-end"
-  };
   return {
-    width: "100%",
-    height: "100%",
-    boxSizing: "border-box",
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: justifyContent[policy.valign],
-    minWidth: 0,
-    ...VARIANT_STYLE[policy.variant],
-    lineHeight: resolveLineHeight(policy),
-    ...wrapStyle[policy.wrap],
-    ...overflowStyle[policy.overflow],
-    ...alignStyle[policy.align]
+    rootId: b.rootId,
+    nodes,
+    children: copyChildren(b.children)
   };
 }
-function renderInline(inline, key, props) {
-  switch (inline.kind) {
-    case "text":
-      return /* @__PURE__ */ jsx2(React2.Fragment, { children: inline.text }, key);
-    case "strong":
-      return /* @__PURE__ */ jsx2("strong", { children: inline.children.map((c, i) => renderInline(c, `${key}-s-${i}`, props)) }, key);
-    case "emphasis":
-      return /* @__PURE__ */ jsx2("em", { children: inline.children.map((c, i) => renderInline(c, `${key}-e-${i}`, props)) }, key);
-    case "code":
-      return /* @__PURE__ */ jsx2("code", { style: { fontFamily: INLINE_CODE_FONT, backgroundColor: "rgba(127, 127, 127, 0.15)", borderRadius: 3, padding: "0 0.25em" }, children: inline.text }, key);
-    case "link": {
-      const rel = props.linkTarget === "_blank" ? "noreferrer noopener" : void 0;
-      return /* @__PURE__ */ jsx2("a", { href: inline.href, target: props.linkTarget, rel, onClick: (event) => props.onLinkClick?.(inline.href, event), children: inline.children.map((c, i) => renderInline(c, `${key}-l-${i}`, props)) }, key);
-    }
-  }
-}
-function renderBulletItem(item, path, props, listGap) {
-  return /* @__PURE__ */ jsxs2("li", { style: { marginBottom: listGap }, children: [
-    item.inline.map((i, idx) => renderInline(i, `${path}-i-${idx}`, props)),
-    item.children?.length ? /* @__PURE__ */ jsx2("ul", { style: { margin: "0.25em 0 0 0", paddingLeft: "1.25em" }, children: item.children.map((c, idx) => renderBulletItem(c, `${path}-c-${idx}`, props, listGap)) }) : null
-  ] }, path);
-}
-function MachinaTextView(props) {
-  const normalized = normalizeText(props.text);
-  return /* @__PURE__ */ jsx2("div", { className: props.className, style: { ...policyStyle(normalized.policy), ...props.style }, children: /* @__PURE__ */ jsxs2("div", { style: { minWidth: 0 }, children: [
-    normalized.document.blocks.map((block, index) => block.kind === "paragraph" ? /* @__PURE__ */ jsx2("p", { style: { margin: index === normalized.document.blocks.length - 1 ? "0" : `0 0 ${normalized.policy.blockGap}px 0` }, children: block.inline.map((i, idx) => renderInline(i, `b-${index}-${idx}`, props)) }, `b-${index}`) : /* @__PURE__ */ jsx2("ul", { style: { margin: index === normalized.document.blocks.length - 1 ? "0" : `0 0 ${normalized.policy.blockGap}px 0`, paddingLeft: "1.25em" }, children: block.items.map((item, itemIndex) => renderBulletItem(item, `b-${index}-item-${itemIndex}`, props, normalized.policy.listGap)) }, `b-${index}`)),
-    props.showDiagnostics && normalized.diagnostics.length > 0 ? /* @__PURE__ */ jsx2("pre", { style: { margin: `${normalized.policy.blockGap}px 0 0 0`, padding: "0.5em", fontSize: "11px", fontFamily: INLINE_CODE_FONT, whiteSpace: "pre-wrap", background: "rgba(127, 127, 127, 0.12)" }, children: normalized.diagnostics.map((d) => `${d.code} (${d.line}:${d.column}) ${d.message}`).join("\n") }) : null
-  ] }) });
-}
 export {
   MachinaLayoutError,
   MachinaReactView,
@@ -1055,8 +1210,21 @@ export {
   assertNonNegativePadding,
   assertNonNegativeSize,
   compileLayoutRows,
+  createViewportMatrix,
+  defineMachinaScreens,
+  defineMachinaViewports,
+  expandScreenViewportTasks,
   flattenResolvedTree,
   formatRect,
+  getArrangeContentRect,
+  getMachinaViewport,
+  getRemainingStackRect,
+  getStackChildRects,
+  getStackContentRect,
+  getStackMainAxisMetrics,
+  lerpNumber,
+  lerpRect,
+  lerpResolvedLayouts,
   normalizePadding,
   parseMachinaText,
   parseMachinaTextInline,
@@ -1064,5 +1232,7 @@ export {
   resolveLayoutDocument,
   resolveLayoutRows,
   resolveUiLength,
+  selectLayoutRowsForRoot,
+  slugMachinaArtifactName,
   toResolvedTree
 };