@nowline/layout 0.8.6 → 0.10.0

package/src/nodes/sequence-one.ts

@@ -0,0 +1,40 @@
+// sequenceOne — the dispatcher a track calls for each child: an item goes
+// to `sequenceItem`, a parallel block to `ParallelNode`, a group to
+// `GroupNode`. It is the one helper the nodes still take injected
+// (`LayoutHelpers`): the group and parallel nodes call it for their nested
+// blocks, so importing it there would form a cycle (specs/layout-phases.md
+// §8, decision 4).
+
+import type { GroupBlock, ItemDeclaration, ParallelBlock } from '@nowline/core';
+import { isGroupBlock, isItemDeclaration, isParallelBlock } from '@nowline/core';
+import type { LayoutContext, TrackCursor } from '../layout-context.js';
+import type { PositionedGroup, PositionedParallel, PositionedTrackChild } from '../types.js';
+import { GroupNode } from './group-node.js';
+import { ParallelNode } from './parallel-node.js';
+
+import { sequenceItem } from './sequence-item.js';
+
+function sequenceParallel(
+    node: ParallelBlock,
+    cursor: TrackCursor,
+    ctx: LayoutContext,
+): PositionedParallel {
+    return new ParallelNode(node, { sequenceOne }).place(cursor, ctx);
+}
+
+function sequenceGroup(node: GroupBlock, cursor: TrackCursor, ctx: LayoutContext): PositionedGroup {
+    return new GroupNode(node, { sequenceOne }).place(cursor, ctx);
+}
+
+export function sequenceOne(
+    node: ItemDeclaration | GroupBlock | ParallelBlock,
+    cursor: TrackCursor,
+    ctx: LayoutContext,
+): PositionedTrackChild {
+    if (isItemDeclaration(node)) return sequenceItem(node, cursor, ctx);
+    if (isParallelBlock(node)) return sequenceParallel(node, cursor, ctx);
+    if (isGroupBlock(node)) return sequenceGroup(node, cursor, ctx);
+    throw new Error(
+        `Unknown swimlane child type: ${(node as { $type?: string }).$type ?? 'unknown'}`,
+    );
+}

package/src/nodes/swimlane-node.ts

@@ -4,29 +4,21 @@
 // fresh rows) and emits a `PositionedSwimlane` plus the band's used
 // height.
 //
-// Step-2 transitional shape:
-//   - Item children flow through the injected `deps.sequenceItem`. Once
-//     ItemNode's wire-in is complete (step 1 — done) the production
-//     `sequenceItem` already routes through ItemNode internally; deferring
-//     the recursive Renderable call here keeps the diff small.
-//   - Parallel + group children flow through `deps.sequenceOne` until
-//     their own nodes land in step 3.
-//   - The Renderable interface's `measure(MeasureContext)` is not yet
-//     wired through the production pipeline. The composition-root work
-//     in step 5 (`RoadmapNode`) will exercise it; meanwhile the legacy
-//     two-pass "buildSwimlane returns positioned + usedHeight" shape is
-//     preserved.
+// The lane's children go through the shared row track (`row-track.ts`):
+// items are measured and placed by `sequenceItem`, and parallel and group
+// children by the injected `helpers.sequenceOne`. A lane has no separate
+// measure pass: its height is the result of packing its rows, so
+// `place` returns the positioned lane with its used height
+// (specs/layout-phases.md §2, non-goals).
 
 import type {
-    EntityProperty,
     GroupBlock,
     ItemDeclaration,
     ParallelBlock,
     SwimlaneDeclaration,
 } from '@nowline/core';
-import { isItemDeclaration } from '@nowline/core';
-import { deriveItemDurationDays } from '../calendar.js';
 import {
+    capacityIconDxTerms,
     estimateCapacitySuffixWidth,
     formatCapacityNumber,
     parseCapacityValue,
@@ -35,17 +27,12 @@ import {
 import { propValue } from '../dsl-utils.js';
 import { frameTabGeometry } from '../frame-tab-geometry.js';
 import { computeLaneUtilization, resolveLaneUtilizationThresholds } from '../lane-utilization.js';
-import type { LayoutContext, TrackCursor } from '../layout-context.js';
-import { RowPacker } from '../row-packer.js';
+import type { LayoutContext, LayoutHelpers } from '../layout-context.js';
+import { resolveChildStart } from '../start-rules.js';
 import { resolveStyle } from '../style-resolution.js';
-import { ITEM_INSET_PX, MIN_ITEM_WIDTH } from '../themes/shared.js';
-import type {
-    BoundingBox,
-    PositionedCapacity,
-    PositionedItem,
-    PositionedSwimlane,
-    PositionedTrackChild,
-} from '../types.js';
+import { estimateTextWidth } from '../text-measure.js';
+import type { BoundingBox, PositionedCapacity, PositionedSwimlane } from '../types.js';
+import { sequenceRowTrack } from './row-track.js';
 
 /**
  * Font size (px) the renderer uses for the lane capacity badge. Mirrors
@@ -73,39 +60,13 @@ function resolveLaneCapacity(
     const text = formatCapacityNumber(value);
     const icon = resolveCapacityIcon(style.capacityIcon, symbols);
     const badgeWidthPx = estimateCapacitySuffixWidth(text, icon, LANE_CAPACITY_BADGE_FONT_SIZE_PX);
+    const iconDxTerms = capacityIconDxTerms(text, icon, LANE_CAPACITY_BADGE_FONT_SIZE_PX);
     return {
-        capacity: { value, text, icon },
+        capacity: { value, text, icon, ...(iconDxTerms !== undefined ? { iconDxTerms } : {}) },
         badgeWidthPx,
     };
 }
 
-/** Helpers that SwimlaneNode delegates to until the rest of m2.5c lands. */
-export interface SwimlaneNodeDeps {
-    sequenceItem: (
-        child: ItemDeclaration,
-        cursor: TrackCursor,
-        ctx: LayoutContext,
-        ownerOverride?: string,
-    ) => PositionedItem;
-    sequenceOne: (
-        child: ItemDeclaration | GroupBlock | ParallelBlock,
-        cursor: TrackCursor,
-        ctx: LayoutContext,
-    ) => PositionedTrackChild;
-    resolveChildStart: (
-        props: EntityProperty[],
-        seqDefault: number,
-        laneLeftX: number,
-        ctx: LayoutContext,
-    ) => number;
-    newCursor: (x: number, y: number) => TrackCursor;
-    estimateTextWidth: (text: string, fontSize: number) => number;
-    /** Predict the extra vertical height an item's wrapped label-chip
-     *  rows will add to its bar; used to size the row-packer's row
-     *  pitch ahead of the call to `sequenceItem`. */
-    predictItemChipExtraHeight: (item: ItemDeclaration, ctx: LayoutContext) => number;
-}
-
 export interface SwimlaneNodeInput {
     lane: SwimlaneDeclaration;
     bandIndex: number;
@@ -129,30 +90,21 @@ const TAB_BOTTOM_Y = 38; // tab (height 22) plus 6 px breathing room
 const TAB_GUTTER_PX = 8;
 
 /**
- * Right edge (canvas px) of the lane title tab. Delegates to the
- * shared `frameTabGeometry` helper that the renderer also uses, so
- * the chiclet's collision footprint and its painted footprint stay
- * exactly in sync. Capacity badge and footnote-indicator widths are
- * added when present so the first-item collision math reserves
- * enough horizontal space for the (now-wider) chiclet.
+ * The lane's owner as the frame tab shows it: the person's or team's
+ * title (nested teams included), else the bare id, plus which glyph leads
+ * it. Undefined without `owner:`.
  */
-function computeLaneTabRightX(
+function resolveLaneOwner(
     lane: SwimlaneDeclaration,
-    capacityBadgeWidthPx: number,
-    footnoteIndicatorWidthPx: number,
-): number {
-    const title = lane.title ?? lane.name ?? '';
-    if (!title) return 0;
+    ctx: LayoutContext,
+): { text: string; kind: 'person' | 'team' } | undefined {
     const ownerRaw = propValue(lane.properties, 'owner');
-    // Box is laid out at `box.x = 0` for top-level lanes; the helper
-    // adds the standard `FRAME_TAB_OFFSET_FROM_BOX_PX` itself.
-    return frameTabGeometry(
-        0,
-        title,
-        ownerRaw ?? undefined,
-        capacityBadgeWidthPx,
-        footnoteIndicatorWidthPx,
-    ).rightX;
+    if (!ownerRaw) return undefined;
+    const team = ctx.teams.get(ownerRaw);
+    if (team) return { text: team.title ?? ownerRaw, kind: 'team' };
+    const person = ctx.persons.get(ownerRaw);
+    if (person) return { text: person.title ?? ownerRaw, kind: 'person' };
+    return { text: ownerRaw, kind: 'team' };
 }
 
 /**
@@ -184,14 +136,17 @@ function firstChildStartX(
     lane: SwimlaneDeclaration,
     laneLeftX: number,
     ctx: LayoutContext,
-    deps: Pick<SwimlaneNodeDeps, 'resolveChildStart'>,
 ): number | undefined {
     for (const child of lane.content) {
         if (child.$type === 'DescriptionDirective') continue;
-        const props = isItemDeclaration(child)
-            ? child.properties
-            : ((child as ParallelBlock | GroupBlock).properties ?? []);
-        return deps.resolveChildStart(props, laneLeftX, laneLeftX, ctx);
+        // Snapped like the start it predicts (a no-op under `hide`).
+        return ctx.scale.startX(
+            resolveChildStart(
+                child as ItemDeclaration | GroupBlock | ParallelBlock,
+                laneLeftX,
+                ctx,
+            ),
+        );
     }
     return undefined;
 }
@@ -199,7 +154,7 @@ function firstChildStartX(
 export class SwimlaneNode {
     constructor(
         public readonly input: SwimlaneNodeInput,
-        private readonly deps: SwimlaneNodeDeps,
+        private readonly helpers: LayoutHelpers,
     ) {}
 
     get id(): string {
@@ -208,7 +163,7 @@ export class SwimlaneNode {
 
     place(origin: SwimlaneOrigin, ctx: LayoutContext): PlacedSwimlaneGeometry {
         const { lane, bandIndex } = this.input;
-        const { deps } = this;
+        const { helpers } = this;
         const style = resolveStyle('swimlane', lane.properties, ctx.styleCtx);
         const laneLeftX = origin.x;
         const step = ctx.bandScale.step();
@@ -233,153 +188,57 @@ export class SwimlaneNode {
         const footnoteIndicators = collectFootnoteIndicators(lane, ctx);
         const footnoteIndicatorWidthPx =
             footnoteIndicators.length > 0
-                ? deps.estimateTextWidth(
-                      footnoteIndicators.join(','),
-                      LANE_CAPACITY_BADGE_FONT_SIZE_PX,
-                  )
+                ? estimateTextWidth(footnoteIndicators.join(','), LANE_CAPACITY_BADGE_FONT_SIZE_PX)
                 : 0;
-        // Title-tab geometry (mirrors the renderer; see renderSwimlane).
-        const tabRightX = computeLaneTabRightX(lane, badgeWidthPx, footnoteIndicatorWidthPx);
+        // Title-tab geometry, computed once from the owner's display
+        // title: the collision box below and the chiclet the renderer
+        // draws (`PositionedSwimlane.tab`) are the same rectangle. Every
+        // lane box sits at x 0 (`box` below); finalize sets only widths.
+        const boxX = 0;
+        const owner = resolveLaneOwner(lane, ctx);
+        const title = lane.title ?? lane.name ?? '';
+        const tab = title
+            ? frameTabGeometry(boxX, title, owner?.text, badgeWidthPx, footnoteIndicatorWidthPx)
+            : null;
+        const tabRightX = tab?.rightX ?? 0;
         // First-row Y: when the first child's desired x is past the title
         // tab, top-align with the tab and reclaim ~28 px per lane.
         // Otherwise drop below the tab.
-        const firstChildDesiredX = firstChildStartX(lane, laneLeftX, ctx, deps);
+        const firstChildDesiredX = firstChildStartX(lane, laneLeftX, ctx);
         const canAlignFirstRowWithTab =
             !lane.title ||
             firstChildDesiredX === undefined ||
             firstChildDesiredX >= tabRightX + TAB_GUTTER_PX;
         const startY = origin.y + (canAlignFirstRowWithTab ? TAB_TOP_Y : TAB_BOTTOM_Y);
 
-        // Topmost-fit row pack. See `RowPacker` for the full contract.
-        // The packer owns the rows; we feed it children in DSL order and
-        // it returns each child's resolved (rowIndex, y).
-        const packer = new RowPacker({
-            laneLeftX,
-            originY: startY,
-            minRowHeight: step,
-            slackCorridors: ctx.slackCorridors,
-        });
-        let timeCursorX = laneLeftX;
-
-        const children: PositionedTrackChild[] = [];
-        for (const child of lane.content) {
-            if (child.$type === 'DescriptionDirective') continue;
-
-            if (!isItemDeclaration(child)) {
-                const blockProps = (child as ParallelBlock | GroupBlock).properties ?? [];
-                const blockStart = deps.resolveChildStart(blockProps, timeCursorX, laneLeftX, ctx);
-                const { rowIndex, y: blockY } = packer.placeBlock();
-                const cursor = deps.newCursor(blockStart, blockY);
-                const positioned = deps.sequenceOne(
-                    child as ItemDeclaration | GroupBlock | ParallelBlock,
-                    cursor,
-                    ctx,
-                );
-                children.push(positioned);
-                const blockEnd = positioned.box.x + positioned.box.width;
-                const blockHeight = Math.max(step, cursor.height);
-                packer.commitBlock({
-                    rowIndex,
-                    placed: positioned,
-                    blockHeight,
-                    blockEnd,
-                });
-                timeCursorX = Math.max(timeCursorX, blockEnd);
-                continue;
-            }
-
-            const props = (child as ItemDeclaration).properties;
-            const desiredStart = deps.resolveChildStart(props, timeCursorX, laneLeftX, ctx);
-            // Predict the item's logical extent so the row-pack can decide
-            // BEFORE handing off to sequenceItem. The arithmetic mirrors
-            // the duration → width math in `sequenceItem` (see
-            // packages/layout/src/layout.ts).
-            const durationDays = deriveItemDurationDays(props, ctx.sizes, ctx.cal);
-            const naturalWidth = Math.max(MIN_ITEM_WIDTH, durationDays * ctx.timeline.pixelsPerDay);
-            const desiredEnd = desiredStart + naturalWidth;
-            const childId = (child as ItemDeclaration).name ?? '';
+        // The shared row-track loop (row-track.ts) packs the lane's
+        // children below the tab offset chosen above.
+        const track = sequenceRowTrack(lane, { leftX: laneLeftX, firstRowY: startY }, ctx, helpers);
+        const { children } = track;
 
-            const chipExtra = deps.predictItemChipExtraHeight(child as ItemDeclaration, ctx);
-            const predictedHeight = step + chipExtra;
-            const { rowIndex, y: rowY } = packer.placeItem({
-                childId,
-                desiredStart,
-                desiredEnd,
-                // Row pitch = `step()` + extra chip-row height. Keeps
-                // the inter-row visible gap (= step - bandwidth) intact
-                // when an item's labels wrap and grow the bar.
-                predictedHeight,
-            });
-
-            const cursor = deps.newCursor(desiredStart, rowY);
-            const positioned = deps.sequenceItem(child as ItemDeclaration, cursor, ctx);
-            children.push(positioned);
-
-            // Item end in LOGICAL space (one ITEM_INSET_PX past the visual
-            // bar's right edge). The next chained item starts here and
-            // lands edge-to-edge in time, with a 2 × ITEM_INSET_PX visible
-            // gutter between bars.
-            const itemLogicalEnd = positioned.box.x + positioned.box.width + ITEM_INSET_PX;
-            timeCursorX = Math.max(timeCursorX, itemLogicalEnd);
-
-            let spillReservation: number | null = null;
-            const hasAnySpill =
-                positioned.textSpills ||
-                positioned.chipsOutside ||
-                positioned.dotSpills ||
-                positioned.iconSpills ||
-                positioned.footnoteSpills;
-            if (hasAnySpill) {
-                // `decorationsRightX` already aggregates the spilled
-                // dot / icon / footnote / caption right edges from
-                // `sequenceItem`; the chip column tracks separately
-                // via `chipsRightX`. Add a 6-px buffer so the next
-                // chained item's bar leaves a visible gutter past
-                // the spilled cluster instead of butting against it.
-                const farRight = Math.max(
-                    positioned.decorationsRightX,
-                    positioned.chipsOutside ? positioned.chipsRightX : 0,
-                );
-                spillReservation = farRight + 6;
-            }
-
-            packer.commitItem({
-                rowIndex,
-                placed: positioned,
-                logicalEnd: itemLogicalEnd,
-                spillReservation,
-                rowHeight: predictedHeight,
-            });
-        }
-
-        // `packer.usedHeight()` measures from `startY` (the first row,
+        // `track.packer.usedHeight()` measures from `startY` (the first row,
         // below the title tab); the swimlane band spans from `origin.y`
         // (the band top, above the tab). Add the tab offset back so the
         // band height covers everything the user sees.
         const tabOffset = startY - origin.y;
-        const bandHeight = Math.max(step + 32, tabOffset + packer.usedHeight() + 16);
+        const bandHeight = Math.max(step + 32, tabOffset + track.packer.usedHeight() + 16);
         // Include the chiclet's right edge in the lane's reported
         // right-extent so empty lanes still report a non-zero right edge
         // — `buildIncludeRegions` uses this to size the include's dashed
         // bracket around its content, and a lane with only a chiclet
         // (no items) should still fit visibly inside that bracket.
-        const usedRightX = Math.max(packer.usedRightX(), tabRightX);
+        const usedRightX = Math.max(track.packer.usedRightX(), tabRightX);
+        // The band spans the canvas, whose width is final only after the
+        // post-placement growth: finalize (`fitWidths`, f4) sets a main
+        // lane's width to it and `fitIncludeRegionWidth` a region lane's to
+        // the region's. Placement never reads the canvas.
         const box: BoundingBox = {
-            x: 0,
+            x: boxX,
             y: origin.y,
-            width: ctx.chartRightX,
+            width: 0,
             height: bandHeight,
         };
 
-        // Owner display string: id → title for teams/people; falls back to id.
-        const ownerRaw = propValue(lane.properties, 'owner');
-        let ownerDisplay: string | undefined;
-        if (ownerRaw) {
-            const team = ctx.teams.get(ownerRaw);
-            const person = ctx.persons.get(ownerRaw);
-            ownerDisplay = team?.title ?? person?.title ?? ownerRaw;
-        }
-
         // Lane utilization underline (m12). Computed *after* children are
         // positioned so the contributors carry their final box.x / box.width.
         // Returns null when the lane has no `capacity:`, no contributing
@@ -404,15 +263,17 @@ export class SwimlaneNode {
         return {
             positioned: {
                 id: lane.name,
-                title: lane.title ?? lane.name ?? '',
+                title,
                 box,
                 bandIndex,
                 children,
                 nested: [],
                 style,
-                owner: ownerDisplay,
+                owner: owner?.text,
+                ownerKind: owner?.kind,
                 footnoteIndicators,
                 capacity,
+                tab,
                 utilization,
             },
             usedHeight: bandHeight,