@flyos/design-system 3.7.0 → 3.8.0

package/fesm2022/flyos-design-system.mjs

@@ -47,7 +47,7 @@ import { CdkConnectedOverlay, CdkOverlayOrigin } from '@angular/cdk/overlay';
 // tools/publish-library.ps1 at bump time, and asserted by the spec beside this file.
 // Used only for the diagnostic message; the duplicate-instance detection itself is
 // version-agnostic, so a stale literal misnames a fork rather than hiding one.
-const FLY_DS_VERSION = '3.7.0';
+const FLY_DS_VERSION = '3.8.0';
 const FLY_DS_REGISTRY_KEY = '__FLY_DS_INSTANCES__';
 /**
  * Records this design-system instance on the shared `scope` and returns the
@@ -12791,8 +12791,10 @@ function snapDomainStart(date, zoom) {
  * snapped to a clean period boundary on the left. Falls back to a window around `today`
  * (or the real today) when nothing is scheduled, so an empty chart still renders a grid.
  */
-function computeDomain(rows, zoom, today = new Date()) {
-    const resolved = resolveRowDates(rows);
+function computeDomain(rows, zoom, today = new Date(), 
+// Accepting the caller's already-resolved map (when it has one) saves a second O(N)
+// `resolveRowDates` pass per recompute — the component now resolves once and passes it in.
+resolved = resolveRowDates(rows)) {
     let min = null;
     let max = null;
     for (const { start, end } of resolved.values()) {
@@ -12862,7 +12864,9 @@ function flattenRows(rows, collapsedIds) {
         if (!kids)
             return;
         for (const row of kids) {
-            const hasChildren = (childrenByParent.get(row.id)?.length ?? 0) > 0;
+            // `row.hasChildren === true` asserts expandability before children are LOADED (lazy
+            // trees): a row can be flagged expandable while `childrenByParent` has nothing for it yet.
+            const hasChildren = row.hasChildren === true || (childrenByParent.get(row.id)?.length ?? 0) > 0;
             const collapsed = hasChildren && collapsedIds.has(row.id);
             out.push({ row, depth, hasChildren, collapsed });
             if (hasChildren && !collapsed)
@@ -13032,16 +13036,18 @@ const MONTH_ABBR = [
 function tickWidth(from, to, pxPerDay) {
     return daysBetween(from, to) * pxPerDay;
 }
+function outsideWindow(x, width, w) {
+    return !!w && (x + width < w.x0 || x > w.x1);
+}
 /** Lower (fine) header band: one cell per day/week/month/quarter depending on zoom. */
-function lowerTicks(domain, zoom, pxPerDay) {
+function lowerTicks(domain, zoom, pxPerDay, xWindow) {
     const ticks = [];
     const push = (from, to, label) => {
-        ticks.push({
-            x: dateToX(from, domain.start, pxPerDay),
-            width: tickWidth(from, to, pxPerDay),
-            label,
-            key: toIsoDate(from),
-        });
+        const x = dateToX(from, domain.start, pxPerDay);
+        const width = tickWidth(from, to, pxPerDay);
+        if (outsideWindow(x, width, xWindow))
+            return;
+        ticks.push({ x, width, label, key: toIsoDate(from) });
     };
     if (zoom === 'day') {
         for (let d = startOfUtcDay(domain.start); d < domain.end; d = addDays(d, 1)) {
@@ -13070,11 +13076,14 @@ function lowerTicks(domain, zoom, pxPerDay) {
     return ticks;
 }
 /** Upper (coarse) header band: month for day/week, year for month/quarter. */
-function upperTicks(domain, zoom, pxPerDay) {
+function upperTicks(domain, zoom, pxPerDay, xWindow) {
     const ticks = [];
     const push = (from, to, label, key) => {
         const x = dateToX(from, domain.start, pxPerDay);
-        ticks.push({ x, width: tickWidth(from, to, pxPerDay), label, key });
+        const width = tickWidth(from, to, pxPerDay);
+        if (outsideWindow(x, width, xWindow))
+            return;
+        ticks.push({ x, width, label, key });
     };
     if (zoom === 'day' || zoom === 'week') {
         for (let m = startOfUtcMonth(domain.start); m < domain.end;) {
@@ -13093,24 +13102,270 @@ function upperTicks(domain, zoom, pxPerDay) {
     return ticks;
 }
 /** Weekend (Sat/Sun) shading bands in logical space; empty when the zoom hides weekends. */
-function weekendBands(domain, zoom, pxPerDay) {
+function weekendBands(domain, zoom, pxPerDay, xWindow) {
     if (!zoomShowsWeekends(zoom))
         return [];
     const bands = [];
     for (let d = startOfUtcDay(domain.start); d < domain.end; d = addDays(d, 1)) {
         const dow = d.getUTCDay();
-        if (dow === 0 || dow === 6) {
-            bands.push({
-                x: dateToX(d, domain.start, pxPerDay),
-                width: pxPerDay,
-                label: '',
-                key: `we-${toIsoDate(d)}`,
-            });
-        }
+        if (dow !== 0 && dow !== 6)
+            continue;
+        const x = dateToX(d, domain.start, pxPerDay);
+        if (outsideWindow(x, pxPerDay, xWindow))
+            continue;
+        bands.push({ x, width: pxPerDay, label: '', key: `we-${toIsoDate(d)}` });
     }
     return bands;
 }
 
+/**
+ * The vertical window: which rows to actually mount, given a scroll position. Pure arithmetic —
+ * `rowHeight` is uniform, so no measurement or `ResizeObserver` autosize strategy is needed.
+ *
+ * `pinnedIndex` (nullable) is the a11y safety net (memo §6.2 mitigation 1): if the currently
+ * focused row's index falls outside the natural scroll window, the window is EXTENDED (never
+ * shifted) to include it, so a keyboard user's focus is never unmounted out from under them.
+ */
+function computeRowWindow(scrollTop, viewportH, rowHeight, totalRows, overscan, pinnedIndex = null) {
+    if (totalRows <= 0 || rowHeight <= 0) {
+        return { firstIndex: 0, lastIndex: -1, topPx: 0, heightPx: 0 };
+    }
+    const count = Math.min(totalRows, Math.ceil(Math.max(0, viewportH) / rowHeight) + 2 * overscan);
+    let first = Math.max(0, Math.min(Math.floor(scrollTop / rowHeight) - overscan, totalRows - count));
+    let last = first + count - 1;
+    if (pinnedIndex !== null && pinnedIndex >= 0 && pinnedIndex < totalRows) {
+        if (pinnedIndex < first)
+            first = pinnedIndex;
+        else if (pinnedIndex > last)
+            last = pinnedIndex;
+    }
+    return { firstIndex: first, lastIndex: last, topPx: first * rowHeight, heightPx: (last - first + 1) * rowHeight };
+}
+/**
+ * The horizontal window, derived from geometry rather than `scrollLeft` — whose sign and origin
+ * under RTL vary by browser/engine (memo §4.3). `mapX` is an involution for a fixed `innerWidth`,
+ * so it is its own inverse here; nothing outside this function may read `scrollLeft`.
+ *
+ * NOTE on the sign, verified by construction (the memo's §4.3 pseudocode has it backwards): the
+ * canvas is the huge scrolled CONTENT, the scroller is the fixed-size clipping VIEWPORT — same
+ * relationship `_toBodyPoint`/`GanttLinkGestures.toBodyPoint` already use (`clientX - rect.left`
+ * to go from a screen coordinate to a coordinate local to an element's own origin). Scrolling
+ * forward moves the content left, so `canvasRect.left` becomes MORE negative while the scroller's
+ * own box does not move — the render-local x of the scroller's leading edge is therefore
+ * `scrollerRect.left - canvasRect.left`, not the other way round.
+ */
+function logicalScrollWindow(canvasRect, scrollerRect, innerWidth, rtl) {
+    const renderLeft = scrollerRect.left - canvasRect.left;
+    const renderRight = renderLeft + scrollerRect.width;
+    const a = mapX(renderLeft, innerWidth, rtl);
+    const b = mapX(renderRight, innerWidth, rtl);
+    return a <= b ? { x0: a, x1: b } : { x0: b, x1: a };
+}
+/**
+ * Coarsen `zoom` (day → week → month → quarter) until `domain span × pxPerDay` fits under
+ * `maxCanvasPx` — browsers mis-rasterize an SVG canvas past roughly 16k px in one layer. The
+ * chart still renders correctly at the coarsened level; `effectiveZoomChange` tells the consumer
+ * so a zoom picker can reflect it.
+ */
+function clampScale(domain, zoom, maxCanvasPx) {
+    const days = Math.max(0, daysBetween(domain.start, domain.end));
+    let idx = GANTT_ZOOMS.indexOf(zoom);
+    let pxPerDay = ZOOM_PX_PER_DAY[zoom];
+    let coarsened = false;
+    while (days * pxPerDay > maxCanvasPx && idx < GANTT_ZOOMS.length - 1) {
+        idx += 1;
+        pxPerDay = ZOOM_PX_PER_DAY[GANTT_ZOOMS[idx]];
+        coarsened = true;
+    }
+    return { zoom: GANTT_ZOOMS[idx], pxPerDay, coarsened };
+}
+// ── Dependency-link culling under a row window ────────────────────────────────────
+/**
+ * Whether a link between two render-space y's should be drawn under the current row window.
+ * Replaces the pre-A9 "both endpoints rendered" predicate, which would erase exactly the arrows
+ * crossing the viewport edge — the `viewBox` pan already clips the rest for free.
+ */
+function linkCrossesWindow(yFrom, yTo, window) {
+    const lo = Math.min(yFrom, yTo);
+    const hi = Math.max(yFrom, yTo);
+    return hi >= window.topPx && lo <= window.topPx + window.heightPx;
+}
+/**
+ * Owns the scroll-derived signals (`scrollTop`, viewport size, the horizontal window) and turns
+ * them into a {@link RowWindow} / {@link GanttXWindow} pair, rAF-coalesced so a fast scroll writes
+ * at most one signal update per frame (memo §4.4: "never write a signal per scroll event").
+ *
+ * Composed rather than inlined for the same reason `GanttLabelPane`/`GanttLinkGestures` are: it is
+ * a self-contained concern (DOM rects in, a window out) that is far more legible — and far more
+ * testable in isolation via its `deps` seam — beside its own scroll listener than folded into the
+ * component's already-large signal graph.
+ */
+class GanttViewport {
+    deps;
+    _scrollTop = signal(0, ...(ngDevMode ? [{ debugName: "_scrollTop" }] : /* istanbul ignore next */ []));
+    _viewportH = signal(0, ...(ngDevMode ? [{ debugName: "_viewportH" }] : /* istanbul ignore next */ []));
+    _xWindow = signal(null, ...(ngDevMode ? [{ debugName: "_xWindow" }] : /* istanbul ignore next */ []));
+    _pinnedIndex = signal(null, ...(ngDevMode ? [{ debugName: "_pinnedIndex" }] : /* istanbul ignore next */ []));
+    _rafPending = false;
+    _unlisten = null;
+    rowWindow = computed(() => {
+        const total = this.deps.totalRows();
+        const rh = this.deps.rowHeight();
+        if (!this.deps.virtualized()) {
+            return { firstIndex: 0, lastIndex: total - 1, topPx: 0, heightPx: Math.max(rh, total * rh) };
+        }
+        return computeRowWindow(this._scrollTop(), this._viewportH(), rh, total, this.deps.overscanRows(), this._pinnedIndex());
+    }, ...(ngDevMode ? [{ debugName: "rowWindow" }] : /* istanbul ignore next */ []));
+    /** Logical horizontal window, or `null` when non-virtualized (decorations render unwindowed). */
+    xWindow = computed(() => this.deps.virtualized() ? this._xWindow() : null, ...(ngDevMode ? [{ debugName: "xWindow" }] : /* istanbul ignore next */ []));
+    constructor(deps) {
+        this.deps = deps;
+    }
+    /** Pin a row index into the render set regardless of scroll (the focused-row safety net). */
+    setPinnedIndex(index) {
+        this._pinnedIndex.set(index);
+    }
+    /** Wire the scroll listener once the scroller element exists (called from the host's effect). */
+    attach() {
+        const el = this.deps.scroller();
+        if (!el || this._unlisten)
+            return;
+        this.sync();
+        const onScroll = () => this.requestSync();
+        el.addEventListener('scroll', onScroll, { passive: true });
+        this._unlisten = () => el.removeEventListener('scroll', onScroll);
+        this.deps.destroyRef.onDestroy(() => this._unlisten?.());
+    }
+    /** rAF-coalesced scroll handling: many events per frame collapse into one signal write. */
+    requestSync() {
+        if (this._rafPending)
+            return;
+        this._rafPending = true;
+        requestAnimationFrame(() => {
+            this._rafPending = false;
+            this.sync();
+        });
+    }
+    /** Read the DOM once (the only place `scrollTop`/rects are read) and push into signals. */
+    sync() {
+        const el = this.deps.scroller();
+        if (!el)
+            return;
+        this._scrollTop.set(el.scrollTop);
+        this._viewportH.set(el.clientHeight);
+        const canvas = this.deps.canvas();
+        if (canvas) {
+            this._xWindow.set(logicalScrollWindow(canvas.getBoundingClientRect(), el.getBoundingClientRect(), this.deps.innerWidth(), this.deps.rtl()));
+        }
+    }
+    /** Scroll a row index fully into view (used by `scrollToRow`), then re-sync the window. */
+    scrollIndexIntoView(index) {
+        const el = this.deps.scroller();
+        if (!el)
+            return;
+        const rh = this.deps.rowHeight();
+        const top = index * rh;
+        const bottom = top + rh;
+        if (top < el.scrollTop)
+            el.scrollTop = top;
+        else if (bottom > el.scrollTop + el.clientHeight)
+            el.scrollTop = bottom - el.clientHeight;
+        this.sync();
+    }
+}
+
+/**
+ * Pure `treegrid` keymap resolution for {@link FlyGanttComponent} — the A9 companion that turns a
+ * key into an intent (move the selection, toggle a collapse) without touching the DOM or Angular.
+ *
+ * Extending `onGridKeydown` in place would grow `gantt.component.ts` past its LoC-ratchet ceiling
+ * (see the note atop `gantt-window.ts`), and — more importantly — the *rule* here (which key does
+ * what, and when Left means "collapse" vs. "go to my parent") is exactly the kind of thing that
+ * benefits from living beside a plain unit test rather than inside a 40-line `switch` on a
+ * `KeyboardEvent`. The host applies the returned {@link GanttA11yIntent}; this module never mutates
+ * anything.
+ *
+ * Home/End/PageUp/PageDown are not a nicety at 20,000 rows — arrow keys alone are unusable at that
+ * scale (memo §6.2). Cell-level navigation is deliberately out of scope: a row's accessible name
+ * already summarises its timeline cell.
+ */
+const NAV_KEYS = new Set(['Home', 'End', 'PageUp', 'PageDown', 'ArrowLeft', 'ArrowRight']);
+/** Whether {@link resolveTreegridKey} has an opinion about this key at all (lets the host early-out). */
+function isTreegridNavKey(key) {
+    return NAV_KEYS.has(key);
+}
+/**
+ * Resolve one `treegrid` navigation key into an intent. `currentIndex` may be `-1` (nothing
+ * selected yet); every case clamps it into range first, matching the existing ArrowUp/Down
+ * behaviour of landing on row 0 rather than throwing.
+ *
+ * `←`/`→` follow the standard treegrid pattern: on an expandable row, `→` expands / `←` collapses;
+ * on an already-collapsed (or childless) row, `←` instead moves to the row's parent — the nearest
+ * PRECEDING row at a shallower depth, which the flattened depth-first order guarantees is correct
+ * without re-walking `parentId`.
+ */
+function resolveTreegridKey(key, currentIndex, flat, pageSize) {
+    const total = flat.length;
+    if (total === 0)
+        return { kind: 'none' };
+    const cur = currentIndex < 0 ? 0 : Math.min(currentIndex, total - 1);
+    const row = flat[cur];
+    switch (key) {
+        case 'Home':
+            return { kind: 'select', index: 0 };
+        case 'End':
+            return { kind: 'select', index: total - 1 };
+        case 'PageDown':
+            return { kind: 'select', index: Math.min(total - 1, cur + Math.max(1, pageSize)) };
+        case 'PageUp':
+            return { kind: 'select', index: Math.max(0, cur - Math.max(1, pageSize)) };
+        case 'ArrowRight':
+            return row.hasChildren && row.collapsed ? { kind: 'toggle', id: row.id } : { kind: 'none' };
+        case 'ArrowLeft': {
+            if (row.hasChildren && !row.collapsed)
+                return { kind: 'toggle', id: row.id };
+            for (let i = cur - 1; i >= 0; i--) {
+                if (flat[i].depth < row.depth)
+                    return { kind: 'select', index: i };
+            }
+            return { kind: 'none' };
+        }
+        default:
+            return { kind: 'none' };
+    }
+}
+
+/**
+ * Pure geometry for the baseline (plan-of-record) overlay — a NEW, app-agnostic capability, not
+ * part of the A9 memo. `GanttRow.baselineStart`/`baselineEnd` are a second, optional pair of ISO
+ * dates; when both are present and `showBaselines` is on, the chart renders a thin muted underbar
+ * beneath a `bar`/`group` row, or a small hollow diamond at a `milestone` row's baseline date —
+ * the generic "baseline vs current" comparison a consumer's own vocabulary later gives meaning to
+ * (e.g. "planned vs actual"), which is exactly why nothing here is named after that vocabulary.
+ *
+ * Kept in its own pure, dependency-free module — same reasoning as `gantt-scale.ts`'s docstring —
+ * and, in particular, routed through `dateToX`/`mapX`/`projectBar` so it mirrors under RTL for
+ * free rather than ever computing its own x from scratch.
+ */
+/**
+ * Resolve a row's baseline geometry. Returns `null` when either date is missing/unparseable, so
+ * the caller can treat "no baseline" and "baseline off" identically (skip rendering).
+ */
+function resolveBaselineVm(row, domain, pxPerDay, innerWidth, rtl) {
+    const start = parseIsoDate(row.baselineStart);
+    const end = parseIsoDate(row.baselineEnd);
+    if (!start || !end)
+        return null;
+    if (row.kind === 'milestone') {
+        const logical = dateToX(start, domain.start, pxPerDay);
+        return { shape: 'milestone', x: mapX(logical, innerWidth, rtl), width: 0 };
+    }
+    const xs = dateToX(start, domain.start, pxPerDay);
+    const xe = dateToX(addDays(end, 1), domain.start, pxPerDay); // inclusive of the end day, like the main bar
+    const { x, width } = projectBar(xs, xe, innerWidth, rtl);
+    return { shape: 'bar', x, width };
+}
+
 /** Label-pane width bounds (px) the splitter clamps to. */
 const GANTT_LABEL_W_MIN = 140;
 const GANTT_LABEL_W_MAX = 720;
@@ -13332,13 +13587,14 @@ class GanttLinkGestures {
             document.removeEventListener('pointerup', onUp);
         });
     }
-    /** Convert client coordinates to a point inside the body SVG (render space). */
+    /** Convert client coordinates to a point inside the body SVG (render space, i.e. absolute
+     *  row-space y — the `windowTopPx` term undoes the `viewBox` pan the rect itself doesn't reflect). */
     toBodyPoint(clientX, clientY) {
         const svg = this.deps.bodySvg();
         if (!svg)
             return { x: 0, y: 0 };
         const rect = svg.getBoundingClientRect();
-        return { x: clientX - rect.left, y: clientY - rect.top };
+        return { x: clientX - rect.left, y: clientY - rect.top + (this.deps.windowTopPx?.() ?? 0) };
     }
     /**
      * The row a link gesture was dropped on **and which of its ends** the drop landed nearest —
@@ -13372,6 +13628,8 @@ const HEADER_H = HEADER_UPPER_H + HEADER_LOWER_H;
 const BAR_V_PAD = 6;
 /** Edge-handle hit width (px) for resize + the link connector radius. */
 const HANDLE_W = 8;
+/** Thickness of the baseline underbar (px) — thin enough to read as a comparison, not a duplicate. */
+const BASELINE_BAR_H = Math.max(2, BAR_V_PAD - 2);
 /**
  * **`fly-gantt`** — the design-system SVG Gantt chart.
  *
@@ -13395,9 +13653,12 @@ const HANDLE_W = 8;
  * placed among those controls matches them; the shell-chrome family (`--surface-card`, …) and
  * then a light-neutral literal are chained as fallbacks for consumers that map neither.
  *
- * **Scale limit:** renders up to `maxRows` (default 500) visible rows; beyond that the list is
- * capped and a footer notes the overflow. Heavy windowing/virtualization is intentionally
- * deferred — see the component skill.
+ * **Scale (A9).** Row count is unbounded by default (`maxRows` now defaults to `0`); only the rows
+ * in view (plus `overscanRows`) mount as DOM/SVG, panned via a `viewBox` y-offset on the body
+ * `<svg>` so `./gantt-scale`'s geometry stays oblivious to windowing (`./gantt-window`'s doc).
+ * Decorations window the same way; bars are never culled. `maxCanvasPx` coarsens the zoom
+ * (`effectiveZoomChange`) past that width; `virtualized = false` restores the pre-A9 path; a
+ * positive `maxRows` keeps the old hard cap (with its overflow footer) too.
  */
 class FlyGanttComponent {
     i18n = inject(I18nService);
@@ -13420,8 +13681,20 @@ class FlyGanttComponent {
     resizableLabels = input(true, ...(ngDevMode ? [{ debugName: "resizableLabels" }] : /* istanbul ignore next */ []));
     /** Row band height in px. */
     rowHeight = input(34, ...(ngDevMode ? [{ debugName: "rowHeight" }] : /* istanbul ignore next */ []));
-    /** Hard cap on rendered rows; beyond it the list is truncated (see class doc). */
-    maxRows = input(500, ...(ngDevMode ? [{ debugName: "maxRows" }] : /* istanbul ignore next */ []));
+    /** Hard cap on the flattened row list; beyond it the list is truncated (see class doc).
+     *  `0` (the default) is uncapped — windowing (below) is what keeps an uncapped chart cheap. */
+    maxRows = input(0, ...(ngDevMode ? [{ debugName: "maxRows" }] : /* istanbul ignore next */ []));
+    /** Controlled collapse state. `null` (the default) keeps the pre-A9 internal-state behaviour —
+     *  adopt controlled mode by echoing {@link collapsedIdsChange} back through this input. */
+    collapsedIds = input(null, ...(ngDevMode ? [{ debugName: "collapsedIds" }] : /* istanbul ignore next */ []));
+    /** Rows rendered above and below the viewport window (virtualization overscan). */
+    overscanRows = input(4, ...(ngDevMode ? [{ debugName: "overscanRows" }] : /* istanbul ignore next */ []));
+    /** Canvas-width ceiling in px; a zoom that would exceed it is coarsened one step at a time. */
+    maxCanvasPx = input(32_000, ...(ngDevMode ? [{ debugName: "maxCanvasPx" }] : /* istanbul ignore next */ []));
+    /** `false` restores the legacy render-everything path (no vertical/horizontal windowing). */
+    virtualized = input(true, ...(ngDevMode ? [{ debugName: "virtualized" }] : /* istanbul ignore next */ []));
+    /** Render the baseline underbar/diamond for rows carrying `baselineStart`/`baselineEnd`. */
+    showBaselines = input(true, ...(ngDevMode ? [{ debugName: "showBaselines" }] : /* istanbul ignore next */ []));
     // ── Outputs ────────────────────────────────────────────────────────────────
     /** Fires on a committed bar move / resize with the new ISO `start`/`end`. */
     rowDatesChange = output();
@@ -13436,6 +13709,12 @@ class FlyGanttComponent {
     rowDblClick = output();
     /** Fires once per committed divider drag / keyboard resize with the new pane width in px. */
     labelWidthChange = output();
+    /** Emitted whenever collapse state changes, in controlled or uncontrolled mode. */
+    collapsedIdsChange = output();
+    /** A row with `hasChildren: true` but no loaded children was expanded — go fetch them. */
+    rowExpand = output();
+    /** The component coarsened the requested zoom to stay under `maxCanvasPx`. */
+    effectiveZoomChange = output();
     // ── Identity + geometry constants (template-visible) ─────────────────────────
     _uid = ++_flyGanttUid;
     markerId = `fly-gantt-${this._uid}-arrow`;
@@ -13445,31 +13724,96 @@ class FlyGanttComponent {
     HANDLE_W = HANDLE_W;
     MIN_LABEL_W = GANTT_LABEL_W_MIN;
     MAX_LABEL_W = GANTT_LABEL_W_MAX;
+    BASELINE_BAR_H = BASELINE_BAR_H;
     // ── Interaction state ─────────────────────────────────────────────────────────
     selectedId = signal(null, ...(ngDevMode ? [{ debugName: "selectedId" }] : /* istanbul ignore next */ []));
-    _collapsed = signal(new Set(), ...(ngDevMode ? [{ debugName: "_collapsed" }] : /* istanbul ignore next */ []));
+    /** Uncontrolled collapse state — the source of truth whenever the `collapsedIds` input is `null`. */
+    _uncontrolledCollapsed = signal(new Set(), ...(ngDevMode ? [{ debugName: "_uncontrolledCollapsed" }] : /* istanbul ignore next */ []));
     /** Live drag preview `{id,start,end}` folded into geometry while a gesture runs. */
     _dragPreview = signal(null, ...(ngDevMode ? [{ debugName: "_dragPreview" }] : /* istanbul ignore next */ []));
     dragTooltip = signal(null, ...(ngDevMode ? [{ debugName: "dragTooltip" }] : /* istanbul ignore next */ []));
-    /** True while a divider drag is in flight (suppresses text selection host-wide). */
-    /** User-chosen pane width; `null` = still following the {@link labelWidth} input. */
     bodyRef = viewChild('bodySvg', ...(ngDevMode ? [{ debugName: "bodyRef" }] : /* istanbul ignore next */ []));
+    scrollElRef = viewChild('scrollEl', ...(ngDevMode ? [{ debugName: "scrollElRef" }] : /* istanbul ignore next */ []));
+    canvasElRef = viewChild('canvasEl', ...(ngDevMode ? [{ debugName: "canvasElRef" }] : /* istanbul ignore next */ []));
+    labelsElRef = viewChild('labelsEl', ...(ngDevMode ? [{ debugName: "labelsElRef" }] : /* istanbul ignore next */ []));
     // ── Derived model ──────────────────────────────────────────────────────────────
     rtl = computed(() => this.i18n.isRtl(), ...(ngDevMode ? [{ debugName: "rtl" }] : /* istanbul ignore next */ []));
-    pxPerDay = computed(() => ZOOM_PX_PER_DAY[this.zoom()], ...(ngDevMode ? [{ debugName: "pxPerDay" }] : /* istanbul ignore next */ []));
-    domain = computed(() => computeDomain(this.rows(), this.zoom()), ...(ngDevMode ? [{ debugName: "domain" }] : /* istanbul ignore next */ []));
-    innerWidth = computed(() => Math.max(1, dateToX(this.domain().end, this.domain().start, this.pxPerDay())), ...(ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []));
-    /** Label-pane width actually rendered — the user's dragged width, else the input. */
-    /** Full visible list after tree flatten/collapse. */
+    /** Effective collapse set: the controlled input when the consumer supplied one, else internal state. */
+    _collapsed = computed(() => {
+        const controlled = this.collapsedIds();
+        if (controlled === null)
+            return this._uncontrolledCollapsed();
+        return controlled instanceof Set ? controlled : new Set(controlled);
+    }, ...(ngDevMode ? [{ debugName: "_collapsed" }] : /* istanbul ignore next */ []));
+    /** Full visible list after tree flatten/collapse (no `maxRows` cap applied yet). */
     _flat = computed(() => flattenRows(this.rows(), this._collapsed()), ...(ngDevMode ? [{ debugName: "_flat" }] : /* istanbul ignore next */ []));
-    /** Capped list actually rendered. */
-    visibleRows = computed(() => this._flat().slice(0, this.maxRows()), ...(ngDevMode ? [{ debugName: "visibleRows" }] : /* istanbul ignore next */ []));
-    overflowCount = computed(() => Math.max(0, this._flat().length - this.maxRows()), ...(ngDevMode ? [{ debugName: "overflowCount" }] : /* istanbul ignore next */ []));
+    /** `_flat`, capped at `maxRows` when it is positive — unchanged from the pre-A9 contract. */
+    visibleRows = computed(() => {
+        const flat = this._flat();
+        const cap = this.maxRows();
+        return cap > 0 ? flat.slice(0, cap) : flat;
+    }, ...(ngDevMode ? [{ debugName: "visibleRows" }] : /* istanbul ignore next */ []));
+    overflowCount = computed(() => Math.max(0, this._flat().length - (this.maxRows() || Infinity)), ...(ngDevMode ? [{ debugName: "overflowCount" }] : /* istanbul ignore next */ []));
+    /** TRUE total row count for `aria-rowcount` — independent of `maxRows` (pre-A9 defect §2.4/§6.2). */
+    totalRowCount = computed(() => this._flat().length, ...(ngDevMode ? [{ debugName: "totalRowCount" }] : /* istanbul ignore next */ []));
+    /** Full spacer height — keeps the scrollbar honest; the `<svg>` itself only spans `svgHeight`. */
     bodyHeight = computed(() => Math.max(this.rowHeight(), this.visibleRows().length * this.rowHeight()), ...(ngDevMode ? [{ debugName: "bodyHeight" }] : /* istanbul ignore next */ []));
     _resolvedDates = computed(() => resolveRowDates(this.rows()), ...(ngDevMode ? [{ debugName: "_resolvedDates" }] : /* istanbul ignore next */ []));
-    weekendBands = computed(() => this._mapTicks(weekendBands(this.domain(), this.zoom(), this.pxPerDay())), ...(ngDevMode ? [{ debugName: "weekendBands" }] : /* istanbul ignore next */ []));
-    lowerTicks = computed(() => this._mapTicks(lowerTicks(this.domain(), this.zoom(), this.pxPerDay())), ...(ngDevMode ? [{ debugName: "lowerTicks" }] : /* istanbul ignore next */ []));
-    upperTicks = computed(() => this._mapTicks(upperTicks(this.domain(), this.zoom(), this.pxPerDay())), ...(ngDevMode ? [{ debugName: "upperTicks" }] : /* istanbul ignore next */ []));
+    domain = computed(() => computeDomain(this.rows(), this.zoom(), new Date(), this._resolvedDates()), ...(ngDevMode ? [{ debugName: "domain" }] : /* istanbul ignore next */ []));
+    /** Zoom coarsened (if needed) to keep `domain span × pxPerDay` under `maxCanvasPx`. */
+    _clampedScale = computed(() => clampScale(this.domain(), this.zoom(), this.maxCanvasPx()), ...(ngDevMode ? [{ debugName: "_clampedScale" }] : /* istanbul ignore next */ []));
+    effectiveZoom = computed(() => this._clampedScale().zoom, ...(ngDevMode ? [{ debugName: "effectiveZoom" }] : /* istanbul ignore next */ []));
+    pxPerDay = computed(() => this._clampedScale().pxPerDay, ...(ngDevMode ? [{ debugName: "pxPerDay" }] : /* istanbul ignore next */ []));
+    innerWidth = computed(() => Math.max(1, dateToX(this.domain().end, this.domain().start, this.pxPerDay())), ...(ngDevMode ? [{ debugName: "innerWidth" }] : /* istanbul ignore next */ []));
+    // ── Virtualization: the row/column windows + the viewport wiring that derives them ───────────
+    _viewport = new GanttViewport({
+        scroller: () => this.scrollElRef()?.nativeElement ?? null,
+        canvas: () => this.canvasElRef()?.nativeElement ?? null,
+        rowHeight: this.rowHeight,
+        totalRows: computed(() => this.visibleRows().length),
+        overscanRows: this.overscanRows,
+        innerWidth: this.innerWidth,
+        rtl: this.rtl,
+        virtualized: this.virtualized,
+        destroyRef: this.destroyRef,
+    });
+    /** {@link visibleRows} indices `[firstIndex, lastIndex]` currently rendered. */
+    rowWindow = this._viewport.rowWindow;
+    /** Logical horizontal window for decorations, or `null` when non-virtualized. */
+    xWindow = this._viewport.xWindow;
+    /** Body `<svg>`'s CSS `top` / `viewBox` y-offset — the windowing trick (`./gantt-window`). */
+    svgTop = computed(() => this.rowWindow().topPx, ...(ngDevMode ? [{ debugName: "svgTop" }] : /* istanbul ignore next */ []));
+    /** Body `<svg>`'s own height (window only, not the full spacer). */
+    svgHeight = computed(() => Math.max(this.rowHeight(), this.rowWindow().heightPx), ...(ngDevMode ? [{ debugName: "svgHeight" }] : /* istanbul ignore next */ []));
+    _lastEmittedZoom = null;
+    constructor() {
+        afterNextRender(() => this._viewport.attach());
+        // Selecting a row pins it into the render window (memo §6.2-1 focus safety net) and, once the
+        // DOM catches up, moves roving-tabindex focus onto it (DOM order matches `rowVms()`'s order).
+        effect(() => {
+            const id = this.selectedId();
+            const idx = id === null ? -1 : this.visibleRows().findIndex((f) => f.row.id === id);
+            this._viewport.setPinnedIndex(idx >= 0 ? idx : null);
+            const root = this.labelsElRef()?.nativeElement;
+            if (id === null || !root)
+                return;
+            queueMicrotask(() => {
+                const domIdx = this.rowVms().findIndex((v) => v.flat.row.id === id);
+                if (domIdx >= 0)
+                    root.querySelectorAll('.fly-gantt__label-row')[domIdx]?.focus();
+            });
+        });
+        effect(() => {
+            const scale = this._clampedScale();
+            if (scale.coarsened && scale.zoom !== this._lastEmittedZoom) {
+                this._lastEmittedZoom = scale.zoom;
+                this.effectiveZoomChange.emit(scale.zoom);
+            }
+        });
+    }
+    weekendBands = computed(() => this._mapTicks(weekendBands(this.domain(), this.effectiveZoom(), this.pxPerDay(), this.xWindow() ?? undefined)), ...(ngDevMode ? [{ debugName: "weekendBands" }] : /* istanbul ignore next */ []));
+    lowerTicks = computed(() => this._mapTicks(lowerTicks(this.domain(), this.effectiveZoom(), this.pxPerDay(), this.xWindow() ?? undefined)), ...(ngDevMode ? [{ debugName: "lowerTicks" }] : /* istanbul ignore next */ []));
+    upperTicks = computed(() => this._mapTicks(upperTicks(this.domain(), this.effectiveZoom(), this.pxPerDay(), this.xWindow() ?? undefined)), ...(ngDevMode ? [{ debugName: "upperTicks" }] : /* istanbul ignore next */ []));
     /** Render-space today x, or `null` when today is outside the domain (or disabled). */
     todayX = computed(() => {
         if (!this.showToday())
@@ -13481,85 +13825,48 @@ class FlyGanttComponent {
         const logical = dateToX(addDays(today, 0.5), dom.start, this.pxPerDay());
         return mapX(logical, this.innerWidth(), this.rtl());
     }, ...(ngDevMode ? [{ debugName: "todayX" }] : /* istanbul ignore next */ []));
+    /** Id→absolute-index into {@link visibleRows}, O(N) on data/collapse only (memo §4.4). */
+    _indexById = computed(() => {
+        const m = new Map();
+        this.visibleRows().forEach((f, i) => m.set(f.row.id, i));
+        return m;
+    }, ...(ngDevMode ? [{ debugName: "_indexById" }] : /* istanbul ignore next */ []));
+    /** Only the windowed slice of {@link visibleRows} (memo §4.4). `index` stays the row's ABSOLUTE
+     *  position — `y = index × rowHeight` — the `viewBox` pan, not this math, hides the rest. */
     rowVms = computed(() => {
-        const dom = this.domain();
-        const ppd = this.pxPerDay();
-        const w = this.innerWidth();
-        const rtl = this.rtl();
-        const rh = this.rowHeight();
-        const resolved = this._resolvedDates();
-        const preview = this._dragPreview();
-        const globalReadonly = this.readonly();
-        return this.visibleRows().map((flat, index) => {
-            const row = flat.row;
-            const y = index * rh;
-            const midY = y + rh / 2;
-            const isGroup = flat.hasChildren || row.kind === 'group';
-            const isMilestone = row.kind === 'milestone';
-            // Resolve dates, letting an in-flight drag preview win for this row.
-            let start = resolved.get(row.id)?.start ?? null;
-            let end = resolved.get(row.id)?.end ?? null;
-            if (preview && preview.id === row.id) {
-                start = preview.start;
-                end = preview.end;
-            }
-            const editable = !globalReadonly && !row.readonly && !isGroup;
-            const color = row.color ?? null;
-            const tint = this._tintFor(row);
-            if (isMilestone) {
-                const at = start ?? end;
-                const logical = at ? dateToX(at, dom.start, ppd) : 0;
-                const pointX = mapX(logical, w, rtl);
-                return {
-                    flat, index, y, midY, shape: at ? 'milestone' : 'empty',
-                    x: pointX, width: 0, progressWidth: 0, pointX,
-                    startX: pointX, endX: pointX, color, tint,
-                    ariaLabel: this._ariaFor(row, start, end, 'milestone'),
-                    editable: editable && !!at,
-                };
-            }
-            if (!start || !end) {
-                return {
-                    flat, index, y, midY, shape: 'empty',
-                    x: 0, width: 0, progressWidth: 0, pointX: 0, startX: 0, endX: 0, color, tint,
-                    ariaLabel: this._ariaFor(row, start, end, isGroup ? 'group' : 'bar'),
-                    editable: false,
-                };
-            }
-            const xs = dateToX(start, dom.start, ppd);
-            // Bars are inclusive of the end day, so extend one day for a visible width.
-            const xe = dateToX(addDays(end, 1), dom.start, ppd);
-            const { x, width } = projectBar(xs, xe, w, rtl);
-            const progress = Math.max(0, Math.min(100, row.progress ?? 0));
-            return {
-                flat, index, y, midY,
-                shape: isGroup ? 'group' : 'bar',
-                x, width,
-                progressWidth: (width * progress) / 100,
-                pointX: 0,
-                startX: mapX(xs, w, rtl),
-                endX: mapX(xe, w, rtl),
-                color, tint,
-                ariaLabel: this._ariaFor(row, start, end, isGroup ? 'group' : 'bar'),
-                editable: isGroup ? false : editable,
-            };
-        });
+        const all = this.visibleRows();
+        const win = this.rowWindow();
+        const out = [];
+        for (let index = win.firstIndex; index <= win.lastIndex; index++) {
+            const flat = all[index];
+            if (flat)
+                out.push(this._vmForFlat(flat, index));
+        }
+        return out;
     }, ...(ngDevMode ? [{ debugName: "rowVms" }] : /* istanbul ignore next */ []));
     /** Only the rows carrying a tint, so the band pass does not emit an empty rect per row. */
     tintedRows = computed(() => this.rowVms().filter((vm) => vm.tint !== null), ...(ngDevMode ? [{ debugName: "tintedRows" }] : /* istanbul ignore next */ []));
-    /** Dependency arrows between currently-rendered rows (missing/collapsed endpoints skipped). */
+    /** Dependency arrows whose y-span intersects the row window — O(E), not O(N). Endpoints are
+     *  resolved via {@link _vmForFlat} directly (not off `rowVms()`) since an edge can cross the
+     *  window with one endpoint outside it — the memo §4.3 rule-2 fix for the pre-A9 "both
+     *  endpoints rendered" predicate, which would erase exactly those crossing arrows. */
     linkVms = computed(() => {
-        const vmById = new Map();
-        for (const vm of this.rowVms())
-            if (vm.shape !== 'empty')
-                vmById.set(vm.flat.row.id, vm);
-        const links = resolveLinks(this.dependencies(), new Set(vmById.keys()));
+        const all = this.visibleRows();
+        const indexById = this._indexById();
+        const links = resolveLinks(this.dependencies(), new Set(indexById.keys()));
         const rtl = this.rtl();
+        const win = this.rowWindow();
         const out = [];
         for (const link of links) {
-            const from = vmById.get(link.fromId);
-            const to = vmById.get(link.toId);
-            if (!from || !to)
+            const fromIdx = indexById.get(link.fromId);
+            const toIdx = indexById.get(link.toId);
+            if (fromIdx === undefined || toIdx === undefined)
+                continue;
+            const from = this._vmForFlat(all[fromIdx], fromIdx);
+            const to = this._vmForFlat(all[toIdx], toIdx);
+            if (from.shape === 'empty' || to.shape === 'empty')
+                continue;
+            if (!linkCrossesWindow(from.midY, to.midY, win))
                 continue;
             const routed = routeLink(from, to, link.type, rtl, this.rowHeight());
             out.push({
@@ -13579,11 +13886,78 @@ class FlyGanttComponent {
         }
         return out;
     }, ...(ngDevMode ? [{ debugName: "linkVms" }] : /* istanbul ignore next */ []));
+    /** Full geometry for one row — shared by `rowVms` and `linkVms` (endpoints outside the window). */
+    _vmForFlat(flat, index) {
+        const dom = this.domain();
+        const ppd = this.pxPerDay();
+        const w = this.innerWidth();
+        const rtl = this.rtl();
+        const rh = this.rowHeight();
+        const resolved = this._resolvedDates();
+        const preview = this._dragPreview();
+        const row = flat.row;
+        const y = index * rh;
+        const midY = y + rh / 2;
+        const isGroup = flat.hasChildren || row.kind === 'group';
+        const isMilestone = row.kind === 'milestone';
+        const baseline = this.showBaselines() ? resolveBaselineVm(row, dom, ppd, w, rtl) : null;
+        // Resolve dates, letting an in-flight drag preview win for this row.
+        let start = resolved.get(row.id)?.start ?? null;
+        let end = resolved.get(row.id)?.end ?? null;
+        if (preview && preview.id === row.id) {
+            start = preview.start;
+            end = preview.end;
+        }
+        const editable = !this.readonly() && !row.readonly && !isGroup;
+        const color = row.color ?? null;
+        const tint = this._tintFor(row);
+        if (isMilestone) {
+            const at = start ?? end;
+            const logical = at ? dateToX(at, dom.start, ppd) : 0;
+            const pointX = mapX(logical, w, rtl);
+            return {
+                flat, index, y, midY, shape: at ? 'milestone' : 'empty',
+                x: pointX, width: 0, progressWidth: 0, pointX,
+                startX: pointX, endX: pointX, color, tint, baseline,
+                ariaLabel: this._ariaFor(row, start, end, 'milestone'),
+                editable: editable && !!at,
+            };
+        }
+        if (!start || !end) {
+            return {
+                flat, index, y, midY, shape: 'empty',
+                x: 0, width: 0, progressWidth: 0, pointX: 0, startX: 0, endX: 0, color, tint, baseline,
+                ariaLabel: this._ariaFor(row, start, end, isGroup ? 'group' : 'bar'),
+                editable: false,
+            };
+        }
+        const xs = dateToX(start, dom.start, ppd);
+        // Bars are inclusive of the end day, so extend one day for a visible width.
+        const xe = dateToX(addDays(end, 1), dom.start, ppd);
+        const { x, width } = projectBar(xs, xe, w, rtl);
+        const progress = Math.max(0, Math.min(100, row.progress ?? 0));
+        return {
+            flat, index, y, midY,
+            shape: isGroup ? 'group' : 'bar',
+            x, width,
+            progressWidth: (width * progress) / 100,
+            pointX: 0,
+            startX: mapX(xs, w, rtl),
+            endX: mapX(xe, w, rtl),
+            color, tint, baseline,
+            ariaLabel: this._ariaFor(row, start, end, isGroup ? 'group' : 'bar'),
+            editable: isGroup ? false : editable,
+        };
+    }
     // ── Template geometry helpers ─────────────────────────────────────────────────
     barHeight = computed(() => Math.max(8, this.rowHeight() - 2 * BAR_V_PAD), ...(ngDevMode ? [{ debugName: "barHeight" }] : /* istanbul ignore next */ []));
     barTop(vm) {
         return vm.y + BAR_V_PAD;
     }
+    /** Baseline underbar's top edge — a thin strip directly beneath the main bar. */
+    baselineBarTop(vm) {
+        return this.barTop(vm) + this.barHeight() + 1;
+    }
     milestoneR() {
         return Math.min(9, this.barHeight() / 2);
     }
@@ -13593,6 +13967,13 @@ class FlyGanttComponent {
         const { pointX: cx, midY: cy } = vm;
         return `${cx},${cy - r} ${cx + r},${cy} ${cx},${cy + r} ${cx - r},${cy}`;
     }
+    /** Hollow outline diamond for a milestone row's baseline date (its own x, same row's y). */
+    baselineDiamondPoints(vm) {
+        const r = Math.max(4, this.milestoneR() - 3);
+        const cx = vm.baseline?.x ?? vm.pointX;
+        const cy = vm.midY;
+        return `${cx},${cy - r} ${cx + r},${cy} ${cx},${cy + r} ${cx - r},${cy}`;
+    }
     /**
      * Link connector x for a milestone. A diamond has no width, so the connector is nudged clear
      * of the marker in the forward-in-time direction (which flips under RTL).
@@ -13647,14 +14028,45 @@ class FlyGanttComponent {
     isCollapsed(id) {
         return this._collapsed().has(id);
     }
+    /** Any row in the current data naming `id` as its parent — i.e. children are actually loaded. */
+    _hasLoadedChildren(id) {
+        return this.rows().some((r) => r.parentId === id);
+    }
     toggleCollapse(id, ev) {
         ev?.stopPropagation();
-        const next = new Set(this._collapsed());
-        if (next.has(id))
+        const collapsed = this._collapsed();
+        const expanding = collapsed.has(id); // currently collapsed → this toggle expands it
+        if (expanding && !this._hasLoadedChildren(id)) {
+            // `hasChildren` was asserted ahead of data (lazy tree) — ask the consumer to fetch rather
+            // than silently expanding into nothing.
+            this.rowExpand.emit(id);
+        }
+        const next = new Set(collapsed);
+        if (expanding)
             next.delete(id);
         else
             next.add(id);
-        this._collapsed.set(next);
+        this._uncontrolledCollapsed.set(next);
+        this.collapsedIdsChange.emit([...next]);
+    }
+    /** Expand every group (clears all collapse state). */
+    expandAll() {
+        this._uncontrolledCollapsed.set(new Set());
+        this.collapsedIdsChange.emit([]);
+    }
+    /** Collapse every group that has (or asserts) children. */
+    collapseAll() {
+        const ids = new Set(this._flat().filter((f) => f.hasChildren).map((f) => f.row.id));
+        this._uncontrolledCollapsed.set(ids);
+        this.collapsedIdsChange.emit([...ids]);
+    }
+    /** Scroll a row into the rendered window and pin it there (deep-link / programmatic focus). */
+    scrollToRow(id) {
+        const idx = this.visibleRows().findIndex((f) => f.row.id === id);
+        if (idx < 0)
+            return;
+        this._viewport.setPinnedIndex(idx);
+        this._viewport.scrollIndexIntoView(idx);
     }
     /**
      * Enter/Space on a focused label row selects it (mirrors the pointer click).
@@ -13708,17 +14120,38 @@ class FlyGanttComponent {
             return;
         // -1 when nothing is selected yet, so the first ArrowDown lands on row 0 (not row 1).
         const curIdx = list.findIndex((r) => r.row.id === this.selectedId());
+        // Treegrid nav (Home/End/PageUp/PageDown/←/→), resolved as pure intent — see gantt-a11y.ts.
+        if (isTreegridNavKey(ev.key)) {
+            const win = this.rowWindow();
+            const pageSize = Math.max(1, win.lastIndex - win.firstIndex + 1 - 2 * this.overscanRows());
+            const a11yRows = list.map((f) => ({
+                id: f.row.id, depth: f.depth, hasChildren: f.hasChildren, collapsed: f.collapsed,
+            }));
+            const intent = resolveTreegridKey(ev.key, curIdx, a11yRows, pageSize);
+            if (intent.kind === 'select') {
+                ev.preventDefault();
+                this.selectedId.set(list[intent.index].row.id);
+                this._viewport.scrollIndexIntoView(intent.index);
+            }
+            else if (intent.kind === 'toggle') {
+                ev.preventDefault();
+                this.toggleCollapse(intent.id);
+            }
+            return;
+        }
         switch (ev.key) {
             case 'ArrowDown': {
                 ev.preventDefault();
                 const i = curIdx < 0 ? 0 : Math.min(list.length - 1, curIdx + 1);
                 this.selectedId.set(list[i].row.id);
+                this._viewport.scrollIndexIntoView(i);
                 return;
             }
             case 'ArrowUp': {
                 ev.preventDefault();
                 const i = curIdx < 0 ? 0 : Math.max(0, curIdx - 1);
                 this.selectedId.set(list[i].row.id);
+                this._viewport.scrollIndexIntoView(i);
                 return;
             }
             case '+':
@@ -13834,6 +14267,7 @@ class FlyGanttComponent {
         readonly: this.readonly,
         rows: this.rowVms,
         bodySvg: () => this.bodyRef()?.nativeElement ?? null,
+        windowTopPx: () => this.svgTop(),
         createLink: (dependency) => this.dependencyCreate.emit(dependency),
         destroyRef: this.destroyRef,
     });
@@ -13885,7 +14319,7 @@ class FlyGanttComponent {
             : t('gantt.aria.bar', { label: row.label, start: toIsoDate(start), end: toIsoDate(end), progress });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyGanttComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyGanttComponent, isStandalone: true, selector: "fly-gantt", inputs: { rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, dependencies: { classPropertyName: "dependencies", publicName: "dependencies", isSignal: true, isRequired: false, transformFunction: null }, zoom: { classPropertyName: "zoom", publicName: "zoom", isSignal: true, isRequired: false, transformFunction: null }, showToday: { classPropertyName: "showToday", publicName: "showToday", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, labelWidth: { classPropertyName: "labelWidth", publicName: "labelWidth", isSignal: true, isRequired: false, transformFunction: null }, resizableLabels: { classPropertyName: "resizableLabels", publicName: "resizableLabels", isSignal: true, isRequired: false, transformFunction: null }, rowHeight: { classPropertyName: "rowHeight", publicName: "rowHeight", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowDatesChange: "rowDatesChange", dependencyCreate: "dependencyCreate", dependencyDelete: "dependencyDelete", rowClick: "rowClick", rowDblClick: "rowDblClick", labelWidthChange: "labelWidthChange" }, host: { properties: { "class.fly-gantt--rtl": "rtl()", "class.fly-gantt--readonly": "readonly()", "class.fly-gantt--resizing": "resizingLabels()", "attr.dir": "i18n.direction()" }, classAttribute: "fly-gantt" }, viewQueries: [{ propertyName: "bodyRef", first: true, predicate: ["bodySvg"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Cross-scrolling canvas: a CSS grid whose header row and label column are sticky, so the\r\n     time grid scrolls under a pinned header + label tree. All SVG geometry is pre-mirrored for\r\n     RTL in the component (see gantt-scale mapX), so this template never branches on direction. -->\r\n<div\r\n  class=\"fly-gantt__scroll\"\r\n  role=\"grid\"\r\n  tabindex=\"0\"\r\n  [attr.aria-label]=\"'gantt.aria.grid' | translate\"\r\n  [attr.aria-rowcount]=\"visibleRows().length\"\r\n  (keydown)=\"onGridKeydown($event)\"\r\n>\r\n  <div\r\n    class=\"fly-gantt__canvas\"\r\n    [style.grid-template-columns]=\"effectiveLabelWidth() + 'px ' + innerWidth() + 'px'\"\r\n    [style.grid-template-rows]=\"HEADER_H + 'px ' + bodyHeight() + 'px'\"\r\n  >\r\n    <!-- \u2500\u2500 Corner (pinned both axes) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <div class=\"fly-gantt__corner\" [style.height.px]=\"HEADER_H\">\r\n      @if (resizableLabels()) {\r\n        <!-- The divider lives in the corner because the corner is the one cell pinned on BOTH\r\n             axes: the grip stays reachable however far the user has scrolled. The full-height\r\n             strip down the label pane below is the same gesture, presentational only. -->\r\n        <div\r\n          class=\"fly-gantt__splitter\"\r\n          role=\"separator\"\r\n          tabindex=\"0\"\r\n          aria-orientation=\"vertical\"\r\n          [attr.aria-label]=\"'gantt.aria.label_resize' | translate\"\r\n          [attr.aria-valuenow]=\"effectiveLabelWidth()\"\r\n          [attr.aria-valuemin]=\"MIN_LABEL_W\"\r\n          [attr.aria-valuemax]=\"MAX_LABEL_W\"\r\n          (pointerdown)=\"onLabelResizePointerDown($event)\"\r\n          (keydown)=\"onLabelResizeKeydown($event)\"\r\n          (dblclick)=\"resetLabelWidth()\"\r\n        ></div>\r\n      }\r\n    </div>\r\n\r\n    <!-- \u2500\u2500 Time header (pinned top) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <svg\r\n      class=\"fly-gantt__time-header\"\r\n      [attr.width]=\"innerWidth()\"\r\n      [attr.height]=\"HEADER_H\"\r\n      [attr.viewBox]=\"'0 0 ' + innerWidth() + ' ' + HEADER_H\"\r\n      aria-hidden=\"true\"\r\n    >\r\n      @for (b of weekendBands(); track b.key) {\r\n        <rect class=\"fly-gantt__weekend\" [attr.x]=\"b.x\" [attr.y]=\"HEADER_UPPER_H\" [attr.width]=\"b.width\" [attr.height]=\"HEADER_LOWER_H\" />\r\n      }\r\n      @for (t of upperTicks(); track t.key) {\r\n        <line class=\"fly-gantt__tick-line\" [attr.x1]=\"t.x\" [attr.y1]=\"0\" [attr.x2]=\"t.x\" [attr.y2]=\"HEADER_H\" />\r\n        <text class=\"fly-gantt__tick-label fly-gantt__tick-label--upper\" [attr.x]=\"t.x + t.width / 2\" [attr.y]=\"HEADER_UPPER_H / 2 + 4\">{{ t.label }}</text>\r\n      }\r\n      @for (t of lowerTicks(); track t.key) {\r\n        <line class=\"fly-gantt__tick-line\" [attr.x1]=\"t.x\" [attr.y1]=\"HEADER_UPPER_H\" [attr.x2]=\"t.x\" [attr.y2]=\"HEADER_H\" />\r\n        <text class=\"fly-gantt__tick-label\" [attr.x]=\"t.x + t.width / 2\" [attr.y]=\"HEADER_UPPER_H + HEADER_LOWER_H / 2 + 4\">{{ t.label }}</text>\r\n      }\r\n      @if (todayX() !== null) {\r\n        <line class=\"fly-gantt__today\" [attr.x1]=\"todayX()\" [attr.y1]=\"HEADER_UPPER_H\" [attr.x2]=\"todayX()\" [attr.y2]=\"HEADER_H\" />\r\n      }\r\n    </svg>\r\n\r\n    <!-- \u2500\u2500 Label tree (pinned inline-start) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <div class=\"fly-gantt__labels\" role=\"rowgroup\">\r\n      @for (vm of rowVms(); track vm.flat.row.id) {\r\n        <div\r\n          class=\"fly-gantt__label-row\"\r\n          role=\"row\"\r\n          tabindex=\"-1\"\r\n          [class.fly-gantt__label-row--selected]=\"selectedId() === vm.flat.row.id\"\r\n          [class.fly-gantt__label-row--tinted]=\"vm.tint !== null\"\r\n          [style.height.px]=\"rowHeight()\"\r\n          [style.--fly-gantt-row-tint]=\"vm.tint\"\r\n          [attr.aria-selected]=\"selectedId() === vm.flat.row.id\"\r\n          [attr.aria-label]=\"vm.ariaLabel\"\r\n          (click)=\"onRowClick(vm.flat.row.id)\"\r\n          (dblclick)=\"onRowDblClick(vm.flat.row.id)\"\r\n          (keydown.enter)=\"onLabelRowKeydown($event, vm.flat.row.id)\"\r\n        >\r\n          <span class=\"fly-gantt__label-inner\" [style.padding-inline-start.px]=\"indentFor(vm.flat.depth)\">\r\n            @if (vm.flat.hasChildren) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"fly-gantt__chevron\"\r\n                [class.fly-gantt__chevron--collapsed]=\"isCollapsed(vm.flat.row.id)\"\r\n                [attr.aria-label]=\"(isCollapsed(vm.flat.row.id) ? 'gantt.expand' : 'gantt.collapse') | translate\"\r\n                [attr.aria-expanded]=\"!isCollapsed(vm.flat.row.id)\"\r\n                (click)=\"toggleCollapse(vm.flat.row.id, $event)\"\r\n              >\u25B8</button>\r\n            } @else {\r\n              <span class=\"fly-gantt__chevron-spacer\"></span>\r\n            }\r\n            @if (vm.color) {\r\n              <!-- Colour chip: the row's own colour at full strength, so a milestone stays\r\n                   identifiable in the label pane where the band tint is deliberately faint. -->\r\n              <span class=\"fly-gantt__label-swatch\" [style.background]=\"vm.color\" aria-hidden=\"true\"></span>\r\n            }\r\n            <span\r\n              class=\"fly-gantt__label-text\"\r\n              [class.fly-gantt__label-text--group]=\"vm.shape === 'group'\"\r\n              [title]=\"vm.flat.row.label\"\r\n            >{{ vm.flat.row.label }}</span>\r\n          </span>\r\n        </div>\r\n      }\r\n      @if (resizableLabels()) {\r\n        <!-- aria-hidden so this presentational twin of the corner separator is not a second\r\n             (and structurally invalid) child of the rowgroup in the accessibility tree. -->\r\n        <div\r\n          class=\"fly-gantt__splitter fly-gantt__splitter--rail\"\r\n          aria-hidden=\"true\"\r\n          (pointerdown)=\"onLabelResizePointerDown($event)\"\r\n          (dblclick)=\"resetLabelWidth()\"\r\n        ></div>\r\n      }\r\n    </div>\r\n\r\n    <!-- \u2500\u2500 Time grid body \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <svg\r\n      #bodySvg\r\n      class=\"fly-gantt__body\"\r\n      [attr.width]=\"innerWidth()\"\r\n      [attr.height]=\"bodyHeight()\"\r\n      [attr.viewBox]=\"'0 0 ' + innerWidth() + ' ' + bodyHeight()\"\r\n    >\r\n      <defs>\r\n        <marker\r\n          [attr.id]=\"markerId\"\r\n          markerWidth=\"8\"\r\n          markerHeight=\"8\"\r\n          refX=\"6\"\r\n          refY=\"4\"\r\n          orient=\"auto\"\r\n          markerUnits=\"userSpaceOnUse\"\r\n        >\r\n          <path class=\"fly-gantt__arrowhead\" d=\"M0,0 L7,4 L0,8 Z\" />\r\n        </marker>\r\n      </defs>\r\n\r\n      <!-- Row colour bands sit at the very bottom of the stack, so the weekend shading and the\r\n           gridlines below still read through them. -->\r\n      @for (vm of tintedRows(); track vm.flat.row.id) {\r\n        <rect\r\n          class=\"fly-gantt__row-band\"\r\n          [attr.x]=\"0\"\r\n          [attr.y]=\"vm.y\"\r\n          [attr.width]=\"innerWidth()\"\r\n          [attr.height]=\"rowHeight()\"\r\n          [style.fill]=\"vm.tint\"\r\n        />\r\n      }\r\n\r\n      <!-- Weekend shading + vertical gridlines (behind the bars). -->\r\n      @for (b of weekendBands(); track b.key) {\r\n        <rect class=\"fly-gantt__weekend\" [attr.x]=\"b.x\" [attr.y]=\"0\" [attr.width]=\"b.width\" [attr.height]=\"bodyHeight()\" />\r\n      }\r\n      @for (t of lowerTicks(); track t.key) {\r\n        <line class=\"fly-gantt__grid-line\" [attr.x1]=\"t.x\" [attr.y1]=\"0\" [attr.x2]=\"t.x\" [attr.y2]=\"bodyHeight()\" />\r\n      }\r\n\r\n      <!-- Rows: a full-width hit rect (click + link drop target) then the shape. -->\r\n      @for (vm of rowVms(); track vm.flat.row.id) {\r\n        <g class=\"fly-gantt__row\" [attr.data-row-id]=\"vm.flat.row.id\">\r\n          <rect\r\n            class=\"fly-gantt__row-hit\"\r\n            [class.fly-gantt__row-hit--selected]=\"selectedId() === vm.flat.row.id\"\r\n            [attr.x]=\"0\"\r\n            [attr.y]=\"vm.y\"\r\n            [attr.width]=\"innerWidth()\"\r\n            [attr.height]=\"rowHeight()\"\r\n            (pointerdown)=\"onRowClick(vm.flat.row.id)\"\r\n            (dblclick)=\"onRowDblClick(vm.flat.row.id)\"\r\n          />\r\n\r\n          @switch (vm.shape) {\r\n            @case ('group') {\r\n              <path class=\"fly-gantt__group\" [attr.d]=\"groupPath(vm)\" [style.fill]=\"vm.color\" [style.stroke]=\"vm.color\" />\r\n            }\r\n            @case ('milestone') {\r\n              <polygon\r\n                class=\"fly-gantt__milestone\"\r\n                [class.fly-gantt__milestone--editable]=\"vm.editable\"\r\n                [attr.points]=\"diamondPoints(vm)\"\r\n                [style.fill]=\"vm.color\"\r\n                (pointerdown)=\"onBarPointerDown($event, vm, 'move')\"\r\n              />\r\n              @if (!readonly() && !vm.flat.row.readonly) {\r\n                <!-- A diamond has no width, so one connector serves it; it reads as the finish\r\n                     end, which is what makes a milestone\u2192task drag the FS everyone expects. -->\r\n                <circle\r\n                  class=\"fly-gantt__connector\"\r\n                  [attr.cx]=\"milestoneConnectorX(vm)\"\r\n                  [attr.cy]=\"vm.midY\"\r\n                  r=\"4\"\r\n                  [attr.aria-label]=\"'gantt.aria.link_handle' | translate: { label: vm.flat.row.label }\"\r\n                  (pointerdown)=\"onLinkPointerDown($event, vm, 'finish')\"\r\n                />\r\n              }\r\n            }\r\n            @case ('bar') {\r\n              <g class=\"fly-gantt__bar-group\">\r\n                <rect\r\n                  class=\"fly-gantt__bar\"\r\n                  [class.fly-gantt__bar--editable]=\"vm.editable\"\r\n                  [attr.x]=\"vm.x\"\r\n                  [attr.y]=\"barTop(vm)\"\r\n                  [attr.width]=\"vm.width\"\r\n                  [attr.height]=\"barHeight()\"\r\n                  rx=\"4\"\r\n                  [style.fill]=\"vm.color\"\r\n                  (pointerdown)=\"onBarPointerDown($event, vm, 'move')\"\r\n                />\r\n                @if (vm.progressWidth > 0) {\r\n                  <rect\r\n                    class=\"fly-gantt__progress\"\r\n                    [attr.x]=\"vm.x\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"vm.progressWidth\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    rx=\"4\"\r\n                  />\r\n                }\r\n                @if (vm.editable) {\r\n                  <!-- Resize handles at both edges. -->\r\n                  <rect\r\n                    class=\"fly-gantt__handle\"\r\n                    [attr.x]=\"vm.x\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"HANDLE_W\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    [attr.aria-label]=\"'gantt.aria.resize_start' | translate\"\r\n                    (pointerdown)=\"onBarPointerDown($event, vm, 'resize-start')\"\r\n                  />\r\n                  <rect\r\n                    class=\"fly-gantt__handle\"\r\n                    [attr.x]=\"vm.x + vm.width - HANDLE_W\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"HANDLE_W\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    [attr.aria-label]=\"'gantt.aria.resize_end' | translate\"\r\n                    (pointerdown)=\"onBarPointerDown($event, vm, 'resize-end')\"\r\n                  />\r\n                }\r\n                @if (!readonly() && !vm.flat.row.readonly) {\r\n                  <!-- One connector per END. Dragging from the start edge yields an SS/SF link\r\n                       and from the finish edge an FS/FF one \u2014 the drop edge picks which. -->\r\n                  <circle\r\n                    class=\"fly-gantt__connector\"\r\n                    [attr.cx]=\"vm.startX\"\r\n                    [attr.cy]=\"vm.midY\"\r\n                    r=\"4\"\r\n                    [attr.aria-label]=\"'gantt.aria.link_handle_start' | translate: { label: vm.flat.row.label }\"\r\n                    (pointerdown)=\"onLinkPointerDown($event, vm, 'start')\"\r\n                  />\r\n                  <circle\r\n                    class=\"fly-gantt__connector\"\r\n                    [attr.cx]=\"vm.endX\"\r\n                    [attr.cy]=\"vm.midY\"\r\n                    r=\"4\"\r\n                    [attr.aria-label]=\"'gantt.aria.link_handle' | translate: { label: vm.flat.row.label }\"\r\n                    (pointerdown)=\"onLinkPointerDown($event, vm, 'finish')\"\r\n                  />\r\n                }\r\n              </g>\r\n            }\r\n          }\r\n        </g>\r\n      }\r\n\r\n      <!-- Dependency arrows (skipped for missing / collapsed endpoints). Each carries a fat\r\n           transparent twin so a 1.5px line is still clickable at pointer precision. -->\r\n      @for (link of linkVms(); track link.key) {\r\n        <g class=\"fly-gantt__link-group\" [class.fly-gantt__link-group--selected]=\"selectedLinkKey() === link.key\">\r\n          <path\r\n            class=\"fly-gantt__link-hit\"\r\n            [attr.d]=\"link.path\"\r\n            [attr.aria-label]=\"link.ariaLabel\"\r\n            (click)=\"onLinkClick($event, link)\"\r\n          />\r\n          <path class=\"fly-gantt__link\" [attr.d]=\"link.path\" [attr.marker-end]=\"'url(#' + markerId + ')'\" />\r\n          @if (selectedLinkKey() === link.key && !readonly()) {\r\n            <g\r\n              class=\"fly-gantt__link-delete\"\r\n              [attr.transform]=\"'translate(' + link.badgeX + ',' + link.badgeY + ')'\"\r\n              [attr.aria-label]=\"'gantt.aria.delete_link' | translate\"\r\n              (click)=\"deleteLink($event, link)\"\r\n            >\r\n              <circle class=\"fly-gantt__link-delete-bg\" r=\"8\" />\r\n              <path class=\"fly-gantt__link-delete-x\" d=\"M-3.5,-3.5 L3.5,3.5 M3.5,-3.5 L-3.5,3.5\" />\r\n            </g>\r\n          }\r\n        </g>\r\n      }\r\n\r\n      <!-- In-flight link rubber band. -->\r\n      @if (linkGesturePath(); as gp) {\r\n        <path class=\"fly-gantt__link fly-gantt__link--ghost\" [attr.d]=\"gp\" [attr.marker-end]=\"'url(#' + markerId + ')'\" />\r\n      }\r\n\r\n      <!-- Today line (over the bars). -->\r\n      @if (todayX() !== null) {\r\n        <line class=\"fly-gantt__today\" [attr.x1]=\"todayX()\" [attr.y1]=\"0\" [attr.x2]=\"todayX()\" [attr.y2]=\"bodyHeight()\" />\r\n      }\r\n    </svg>\r\n  </div>\r\n\r\n  @if (visibleRows().length === 0) {\r\n    <p class=\"fly-gantt__empty\">{{ 'gantt.no_data' | translate }}</p>\r\n  }\r\n  @if (overflowCount() > 0) {\r\n    <p class=\"fly-gantt__overflow\">\r\n      {{ 'gantt.overflow' | translate: { shown: maxRows(), total: maxRows() + overflowCount() } }}\r\n    </p>\r\n  }\r\n</div>\r\n\r\n<!-- Drag candidate tooltip (HTML overlay, follows the cursor). -->\r\n@if (dragTooltip(); as tip) {\r\n  <div class=\"fly-gantt__tooltip\" [style.left.px]=\"tip.x\" [style.top.px]=\"tip.y\">{{ tip.text }}</div>\r\n}\r\n", styles: [":host,:host *,:host *:before,:host *:after{box-sizing:border-box}:host{--_surface: var(--bg-2, var(--surface-card, #fff));--_surface-alt: var(--bg-3, var(--glass-bg-elevated, #f8fafc));--_surface-hover: var(--bg-hover, var(--surface-hover, #f1f5f9));--_border: var(--w08, var(--surface-border, #e2e8f0));--_border-strong: var(--w1, var(--surface-border, #cbd5e1));--_grid-line: var(--line-3, var(--surface-border, #eef2f7));--_text: var(--ink, var(--text-color, #0f172a));--_text-subtle: var(--ink-3, var(--text-color-secondary, #64748b));--_text-faint: var(--ink-4, var(--text-color-secondary, #94a3b8));--_accent: var(--accent);--_bar: var(--_accent);--_bar-progress: color-mix(in srgb, var(--_accent) 72%, #000);--_weekend: color-mix(in srgb, var(--_text-subtle) 9%, transparent);--_today: var(--danger, #ef4444);--_link: var(--_text-subtle);--_radius: var(--r-lg, 8px);--_transition: var(--t-state, .12s ease);display:block;inline-size:100%;block-size:100%;min-block-size:200px;color:var(--_text);font-size:13px}:host(.fly-gantt--resizing){cursor:col-resize;-webkit-user-select:none;user-select:none}.fly-gantt__scroll{position:relative;inline-size:100%;block-size:100%;overflow:auto;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface);box-shadow:var(--shadow-card, none);outline:none}.fly-gantt__scroll:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:-2px}.fly-gantt__canvas{display:grid;position:relative}.fly-gantt__corner{position:sticky;inset-block-start:0;inset-inline-start:0;z-index:4;background:var(--_surface-alt);-webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);border-inline-end:1px solid var(--_border);border-block-end:1px solid var(--_border-strong)}.fly-gantt__time-header{position:sticky;inset-block-start:0;z-index:3;display:block;background:var(--_surface-alt);-webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);border-block-end:1px solid var(--_border-strong)}.fly-gantt__tick-line{stroke:var(--_grid-line);stroke-width:1}.fly-gantt__tick-label{fill:var(--_text-subtle);font-size:11px;text-anchor:middle;dominant-baseline:middle}.fly-gantt__tick-label--upper{fill:var(--_text);font-weight:600}.fly-gantt__splitter{position:absolute;inset-block:0;inset-inline-end:-3px;inline-size:7px;z-index:5;cursor:col-resize;touch-action:none}.fly-gantt__splitter:after{content:\"\";position:absolute;inset-block:0;inset-inline-start:3px;inline-size:1px;background:transparent;transition:background var(--_transition)}.fly-gantt__splitter:hover:after,.fly-gantt__splitter:focus-visible:after{background:var(--_accent)}.fly-gantt__splitter:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:-1px}:host(.fly-gantt--resizing) .fly-gantt__splitter:after{background:var(--_accent)}.fly-gantt__labels{position:sticky;inset-inline-start:0;z-index:2;background:var(--_surface);border-inline-end:1px solid var(--_border)}.fly-gantt__label-row{position:relative;display:flex;align-items:center;border-block-end:1px solid var(--_grid-line);cursor:pointer;transition:background var(--_transition)}.fly-gantt__label-row:hover{background:var(--_surface-hover)}.fly-gantt__label-row--selected{background:var(--_surface-hover);box-shadow:inset 3px 0 0 0 var(--_accent)}.fly-gantt__label-row--tinted:before{content:\"\";position:absolute;inset:0;background:var(--fly-gantt-row-tint);pointer-events:none}.fly-gantt__label-inner{position:relative;display:flex;align-items:center;gap:4px;inline-size:100%;min-inline-size:0;padding-inline-end:8px}.fly-gantt__label-swatch{flex:0 0 auto;inline-size:8px;block-size:8px;border-radius:2px}.fly-gantt__chevron{flex:0 0 auto;inline-size:18px;block-size:18px;padding:0;border:none;background:transparent;color:var(--_text-subtle);cursor:pointer;line-height:1;transform:rotate(90deg);transition:transform var(--_transition)}.fly-gantt__chevron--collapsed{transform:rotate(0)}:host(.fly-gantt--rtl) .fly-gantt__chevron--collapsed{transform:rotate(180deg)}.fly-gantt__chevron:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:1px;border-radius:4px}.fly-gantt__chevron-spacer{flex:0 0 auto;inline-size:18px}.fly-gantt__label-text{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fly-gantt__label-text--group{font-weight:600}.fly-gantt__body{display:block;touch-action:pan-x pan-y}.fly-gantt__row-band{pointer-events:none}.fly-gantt__weekend{fill:var(--_weekend)}.fly-gantt__grid-line{stroke:var(--_grid-line);stroke-width:1}.fly-gantt__row-hit{fill:transparent}.fly-gantt__row-hit--selected{fill:var(--_surface-hover)}.fly-gantt__bar{fill:var(--_bar);stroke:none}.fly-gantt__bar--editable{cursor:grab}.fly-gantt__progress{fill:var(--_bar-progress);pointer-events:none}.fly-gantt__handle{fill:transparent;cursor:ew-resize}.fly-gantt__connector{fill:var(--_surface);stroke:var(--_accent);stroke-width:1.5;cursor:crosshair;opacity:0;transition:opacity var(--_transition)}.fly-gantt__row:hover .fly-gantt__connector{opacity:1}.fly-gantt__milestone{fill:var(--_accent);stroke:var(--_surface);stroke-width:1}.fly-gantt__milestone--editable{cursor:grab}.fly-gantt__group{fill:var(--_text-subtle);stroke:var(--_text-subtle)}.fly-gantt__link{fill:none;stroke:var(--_link);stroke-width:1.5;pointer-events:none}.fly-gantt__link-hit{fill:none;stroke:transparent;stroke-width:11;pointer-events:stroke;cursor:pointer}.fly-gantt__link-group:hover .fly-gantt__link{stroke:var(--_text)}.fly-gantt__link-group--selected .fly-gantt__link{stroke:var(--_accent);stroke-width:2.5}.fly-gantt__link-delete-bg{fill:var(--_accent)}.fly-gantt__link-delete{cursor:pointer}.fly-gantt__link-delete-x{stroke:var(--_surface);stroke-width:1.75;stroke-linecap:round;fill:none;pointer-events:none}.fly-gantt__link--ghost{stroke-dasharray:4 3;opacity:.8}.fly-gantt__arrowhead{fill:var(--_link)}.fly-gantt__today{stroke:var(--_today);stroke-width:1.5;stroke-dasharray:3 3;pointer-events:none}.fly-gantt__empty,.fly-gantt__overflow{margin:0;padding:12px;color:var(--_text-faint);font-size:12px;text-align:center}.fly-gantt__tooltip{position:fixed;z-index:20;transform:translate(12px,16px);padding:4px 8px;border-radius:6px;background:var(--_text);color:var(--_surface);font-size:12px;white-space:nowrap;pointer-events:none;direction:ltr;unicode-bidi:isolate}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyGanttComponent, isStandalone: true, selector: "fly-gantt", inputs: { rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, dependencies: { classPropertyName: "dependencies", publicName: "dependencies", isSignal: true, isRequired: false, transformFunction: null }, zoom: { classPropertyName: "zoom", publicName: "zoom", isSignal: true, isRequired: false, transformFunction: null }, showToday: { classPropertyName: "showToday", publicName: "showToday", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, labelWidth: { classPropertyName: "labelWidth", publicName: "labelWidth", isSignal: true, isRequired: false, transformFunction: null }, resizableLabels: { classPropertyName: "resizableLabels", publicName: "resizableLabels", isSignal: true, isRequired: false, transformFunction: null }, rowHeight: { classPropertyName: "rowHeight", publicName: "rowHeight", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, collapsedIds: { classPropertyName: "collapsedIds", publicName: "collapsedIds", isSignal: true, isRequired: false, transformFunction: null }, overscanRows: { classPropertyName: "overscanRows", publicName: "overscanRows", isSignal: true, isRequired: false, transformFunction: null }, maxCanvasPx: { classPropertyName: "maxCanvasPx", publicName: "maxCanvasPx", isSignal: true, isRequired: false, transformFunction: null }, virtualized: { classPropertyName: "virtualized", publicName: "virtualized", isSignal: true, isRequired: false, transformFunction: null }, showBaselines: { classPropertyName: "showBaselines", publicName: "showBaselines", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowDatesChange: "rowDatesChange", dependencyCreate: "dependencyCreate", dependencyDelete: "dependencyDelete", rowClick: "rowClick", rowDblClick: "rowDblClick", labelWidthChange: "labelWidthChange", collapsedIdsChange: "collapsedIdsChange", rowExpand: "rowExpand", effectiveZoomChange: "effectiveZoomChange" }, host: { properties: { "class.fly-gantt--rtl": "rtl()", "class.fly-gantt--readonly": "readonly()", "class.fly-gantt--resizing": "resizingLabels()", "attr.dir": "i18n.direction()" }, classAttribute: "fly-gantt" }, viewQueries: [{ propertyName: "bodyRef", first: true, predicate: ["bodySvg"], descendants: true, isSignal: true }, { propertyName: "scrollElRef", first: true, predicate: ["scrollEl"], descendants: true, isSignal: true }, { propertyName: "canvasElRef", first: true, predicate: ["canvasEl"], descendants: true, isSignal: true }, { propertyName: "labelsElRef", first: true, predicate: ["labelsEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Cross-scrolling canvas: a CSS grid whose header row and label column are sticky, so the\r\n     time grid scrolls under a pinned header + label tree. All SVG geometry is pre-mirrored for\r\n     RTL in the component (see gantt-scale mapX), so this template never branches on direction. -->\r\n<div\r\n  #scrollEl\r\n  class=\"fly-gantt__scroll\"\r\n  role=\"treegrid\"\r\n  tabindex=\"0\"\r\n  [attr.aria-label]=\"'gantt.aria.grid' | translate\"\r\n  [attr.aria-rowcount]=\"totalRowCount()\"\r\n  (keydown)=\"onGridKeydown($event)\"\r\n>\r\n  <div\r\n    #canvasEl\r\n    class=\"fly-gantt__canvas\"\r\n    [style.grid-template-columns]=\"effectiveLabelWidth() + 'px ' + innerWidth() + 'px'\"\r\n    [style.grid-template-rows]=\"HEADER_H + 'px ' + bodyHeight() + 'px'\"\r\n  >\r\n    <!-- \u2500\u2500 Corner (pinned both axes) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <div class=\"fly-gantt__corner\" [style.height.px]=\"HEADER_H\">\r\n      @if (resizableLabels()) {\r\n        <!-- The divider lives in the corner because the corner is the one cell pinned on BOTH\r\n             axes: the grip stays reachable however far the user has scrolled. The full-height\r\n             strip down the label pane below is the same gesture, presentational only. -->\r\n        <div\r\n          class=\"fly-gantt__splitter\"\r\n          role=\"separator\"\r\n          tabindex=\"0\"\r\n          aria-orientation=\"vertical\"\r\n          [attr.aria-label]=\"'gantt.aria.label_resize' | translate\"\r\n          [attr.aria-valuenow]=\"effectiveLabelWidth()\"\r\n          [attr.aria-valuemin]=\"MIN_LABEL_W\"\r\n          [attr.aria-valuemax]=\"MAX_LABEL_W\"\r\n          (pointerdown)=\"onLabelResizePointerDown($event)\"\r\n          (keydown)=\"onLabelResizeKeydown($event)\"\r\n          (dblclick)=\"resetLabelWidth()\"\r\n        ></div>\r\n      }\r\n    </div>\r\n\r\n    <!-- \u2500\u2500 Time header (pinned top) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <svg\r\n      class=\"fly-gantt__time-header\"\r\n      [attr.width]=\"innerWidth()\"\r\n      [attr.height]=\"HEADER_H\"\r\n      [attr.viewBox]=\"'0 0 ' + innerWidth() + ' ' + HEADER_H\"\r\n      aria-hidden=\"true\"\r\n    >\r\n      @for (b of weekendBands(); track b.key) {\r\n        <rect class=\"fly-gantt__weekend\" [attr.x]=\"b.x\" [attr.y]=\"HEADER_UPPER_H\" [attr.width]=\"b.width\" [attr.height]=\"HEADER_LOWER_H\" />\r\n      }\r\n      @for (t of upperTicks(); track t.key) {\r\n        <line class=\"fly-gantt__tick-line\" [attr.x1]=\"t.x\" [attr.y1]=\"0\" [attr.x2]=\"t.x\" [attr.y2]=\"HEADER_H\" />\r\n        <text class=\"fly-gantt__tick-label fly-gantt__tick-label--upper\" [attr.x]=\"t.x + t.width / 2\" [attr.y]=\"HEADER_UPPER_H / 2 + 4\">{{ t.label }}</text>\r\n      }\r\n      @for (t of lowerTicks(); track t.key) {\r\n        <line class=\"fly-gantt__tick-line\" [attr.x1]=\"t.x\" [attr.y1]=\"HEADER_UPPER_H\" [attr.x2]=\"t.x\" [attr.y2]=\"HEADER_H\" />\r\n        <text class=\"fly-gantt__tick-label\" [attr.x]=\"t.x + t.width / 2\" [attr.y]=\"HEADER_UPPER_H + HEADER_LOWER_H / 2 + 4\">{{ t.label }}</text>\r\n      }\r\n      @if (todayX() !== null) {\r\n        <line class=\"fly-gantt__today\" [attr.x1]=\"todayX()\" [attr.y1]=\"HEADER_UPPER_H\" [attr.x2]=\"todayX()\" [attr.y2]=\"HEADER_H\">\r\n          <title>{{ 'gantt.today' | translate }}</title>\r\n        </line>\r\n      }\r\n    </svg>\r\n\r\n    <!-- \u2500\u2500 Label tree (pinned inline-start) \u2014 the ACCESSIBLE projection: the body SVG below is\r\n         aria-hidden, so every row/level/expanded/selected fact a screen reader needs lives here. -->\r\n    <div #labelsEl class=\"fly-gantt__labels\" role=\"rowgroup\">\r\n      @for (vm of rowVms(); track vm.flat.row.id) {\r\n        <div\r\n          class=\"fly-gantt__label-row\"\r\n          role=\"row\"\r\n          [attr.tabindex]=\"selectedId() === vm.flat.row.id ? 0 : -1\"\r\n          [attr.data-row-id]=\"vm.flat.row.id\"\r\n          [class.fly-gantt__label-row--selected]=\"selectedId() === vm.flat.row.id\"\r\n          [class.fly-gantt__label-row--tinted]=\"vm.tint !== null\"\r\n          [style.height.px]=\"rowHeight()\"\r\n          [style.--fly-gantt-row-tint]=\"vm.tint\"\r\n          [attr.aria-selected]=\"selectedId() === vm.flat.row.id\"\r\n          [attr.aria-rowindex]=\"vm.index + 1\"\r\n          [attr.aria-level]=\"vm.flat.depth + 1\"\r\n          [attr.aria-expanded]=\"vm.flat.hasChildren ? !vm.flat.collapsed : null\"\r\n          [attr.aria-label]=\"vm.ariaLabel\"\r\n          (click)=\"onRowClick(vm.flat.row.id)\"\r\n          (dblclick)=\"onRowDblClick(vm.flat.row.id)\"\r\n          (keydown.enter)=\"onLabelRowKeydown($event, vm.flat.row.id)\"\r\n        >\r\n          <span class=\"fly-gantt__label-inner\" role=\"gridcell\" [style.padding-inline-start.px]=\"indentFor(vm.flat.depth)\">\r\n            @if (vm.flat.hasChildren) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"fly-gantt__chevron\"\r\n                [class.fly-gantt__chevron--collapsed]=\"isCollapsed(vm.flat.row.id)\"\r\n                [attr.aria-label]=\"(isCollapsed(vm.flat.row.id) ? 'gantt.expand' : 'gantt.collapse') | translate\"\r\n                [attr.aria-expanded]=\"!isCollapsed(vm.flat.row.id)\"\r\n                (click)=\"toggleCollapse(vm.flat.row.id, $event)\"\r\n              >\u25B8</button>\r\n            } @else {\r\n              <span class=\"fly-gantt__chevron-spacer\"></span>\r\n            }\r\n            @if (vm.color) {\r\n              <!-- Colour chip: the row's own colour at full strength, so a milestone stays\r\n                   identifiable in the label pane where the band tint is deliberately faint. -->\r\n              <span class=\"fly-gantt__label-swatch\" [style.background]=\"vm.color\" aria-hidden=\"true\"></span>\r\n            }\r\n            <span\r\n              class=\"fly-gantt__label-text\"\r\n              [class.fly-gantt__label-text--group]=\"vm.shape === 'group'\"\r\n              [title]=\"vm.flat.row.label\"\r\n            >{{ vm.flat.row.label }}</span>\r\n          </span>\r\n          <!-- Visually-hidden second gridcell: the timeline summary a sighted user reads off the\r\n               bar/diamond geometry. The row's own aria-label already announces it; this cell keeps\r\n               the treegrid's row\u2192cell structure valid for a cell-navigating AT. -->\r\n          <span class=\"fly-gantt__label-cell-hidden\" role=\"gridcell\">{{ vm.ariaLabel }}</span>\r\n        </div>\r\n      }\r\n      @if (resizableLabels()) {\r\n        <!-- aria-hidden so this presentational twin of the corner separator is not a second\r\n             (and structurally invalid) child of the rowgroup in the accessibility tree. -->\r\n        <div\r\n          class=\"fly-gantt__splitter fly-gantt__splitter--rail\"\r\n          aria-hidden=\"true\"\r\n          (pointerdown)=\"onLabelResizePointerDown($event)\"\r\n          (dblclick)=\"resetLabelWidth()\"\r\n        ></div>\r\n      }\r\n    </div>\r\n\r\n    <!-- \u2500\u2500 Time grid body \u2014 a spacer cell (full height, keeps the native scrollbar honest) with\r\n         the actual `<svg>` absolutely positioned + `aria-hidden` (the label pane above is the\r\n         accessible projection). The `viewBox` y-offset panning IS the vertical virtualization \u2014\r\n         see `gantt-window.ts`'s docstring; nothing below this point knows windowing exists. -->\r\n    <div class=\"fly-gantt__body-cell\" [style.height.px]=\"bodyHeight()\">\r\n    <svg\r\n      #bodySvg\r\n      class=\"fly-gantt__body\"\r\n      aria-hidden=\"true\"\r\n      [style.top.px]=\"svgTop()\"\r\n      [attr.width]=\"innerWidth()\"\r\n      [attr.height]=\"svgHeight()\"\r\n      [attr.viewBox]=\"'0 ' + svgTop() + ' ' + innerWidth() + ' ' + svgHeight()\"\r\n    >\r\n      <defs>\r\n        <marker\r\n          [attr.id]=\"markerId\"\r\n          markerWidth=\"8\"\r\n          markerHeight=\"8\"\r\n          refX=\"6\"\r\n          refY=\"4\"\r\n          orient=\"auto\"\r\n          markerUnits=\"userSpaceOnUse\"\r\n        >\r\n          <path class=\"fly-gantt__arrowhead\" d=\"M0,0 L7,4 L0,8 Z\" />\r\n        </marker>\r\n      </defs>\r\n\r\n      <!-- Row colour bands sit at the very bottom of the stack, so the weekend shading and the\r\n           gridlines below still read through them. -->\r\n      @for (vm of tintedRows(); track vm.flat.row.id) {\r\n        <rect\r\n          class=\"fly-gantt__row-band\"\r\n          [attr.x]=\"0\"\r\n          [attr.y]=\"vm.y\"\r\n          [attr.width]=\"innerWidth()\"\r\n          [attr.height]=\"rowHeight()\"\r\n          [style.fill]=\"vm.tint\"\r\n        />\r\n      }\r\n\r\n      <!-- Weekend shading + vertical gridlines (behind the bars) \u2014 span the WINDOW's y-extent,\r\n           like the today line above; `weekendBands`/`lowerTicks` are already x-windowed too. -->\r\n      @for (b of weekendBands(); track b.key) {\r\n        <rect class=\"fly-gantt__weekend\" [attr.x]=\"b.x\" [attr.y]=\"svgTop()\" [attr.width]=\"b.width\" [attr.height]=\"svgHeight()\" />\r\n      }\r\n      @for (t of lowerTicks(); track t.key) {\r\n        <line class=\"fly-gantt__grid-line\" [attr.x1]=\"t.x\" [attr.y1]=\"svgTop()\" [attr.x2]=\"t.x\" [attr.y2]=\"svgTop() + svgHeight()\" />\r\n      }\r\n\r\n      <!-- Rows: a full-width hit rect (click + link drop target) then the shape. -->\r\n      @for (vm of rowVms(); track vm.flat.row.id) {\r\n        <g class=\"fly-gantt__row\" [attr.data-row-id]=\"vm.flat.row.id\">\r\n          <rect\r\n            class=\"fly-gantt__row-hit\"\r\n            [class.fly-gantt__row-hit--selected]=\"selectedId() === vm.flat.row.id\"\r\n            [attr.x]=\"0\"\r\n            [attr.y]=\"vm.y\"\r\n            [attr.width]=\"innerWidth()\"\r\n            [attr.height]=\"rowHeight()\"\r\n            (pointerdown)=\"onRowClick(vm.flat.row.id)\"\r\n            (dblclick)=\"onRowDblClick(vm.flat.row.id)\"\r\n          />\r\n\r\n          @switch (vm.shape) {\r\n            @case ('group') {\r\n              <path class=\"fly-gantt__group\" [attr.d]=\"groupPath(vm)\" [style.fill]=\"vm.color\" [style.stroke]=\"vm.color\" />\r\n            }\r\n            @case ('milestone') {\r\n              <polygon\r\n                class=\"fly-gantt__milestone\"\r\n                [class.fly-gantt__milestone--editable]=\"vm.editable\"\r\n                [attr.points]=\"diamondPoints(vm)\"\r\n                [style.fill]=\"vm.color\"\r\n                (pointerdown)=\"onBarPointerDown($event, vm, 'move')\"\r\n              />\r\n              @if (vm.baseline) {\r\n                <!-- Baseline (plan-of-record) date: a small HOLLOW diamond so it reads as a\r\n                     comparison against the solid current one, never a duplicate marker. -->\r\n                <polygon class=\"fly-gantt__baseline-milestone\" [attr.points]=\"baselineDiamondPoints(vm)\" />\r\n              }\r\n              @if (!readonly() && !vm.flat.row.readonly) {\r\n                <!-- A diamond has no width, so one connector serves it; it reads as the finish\r\n                     end, which is what makes a milestone\u2192task drag the FS everyone expects. -->\r\n                <circle\r\n                  class=\"fly-gantt__connector\"\r\n                  [attr.cx]=\"milestoneConnectorX(vm)\"\r\n                  [attr.cy]=\"vm.midY\"\r\n                  r=\"4\"\r\n                  [attr.aria-label]=\"'gantt.aria.link_handle' | translate: { label: vm.flat.row.label }\"\r\n                  (pointerdown)=\"onLinkPointerDown($event, vm, 'finish')\"\r\n                />\r\n              }\r\n            }\r\n            @case ('bar') {\r\n              <g class=\"fly-gantt__bar-group\">\r\n                <rect\r\n                  class=\"fly-gantt__bar\"\r\n                  [class.fly-gantt__bar--editable]=\"vm.editable\"\r\n                  [attr.x]=\"vm.x\"\r\n                  [attr.y]=\"barTop(vm)\"\r\n                  [attr.width]=\"vm.width\"\r\n                  [attr.height]=\"barHeight()\"\r\n                  rx=\"4\"\r\n                  [style.fill]=\"vm.color\"\r\n                  (pointerdown)=\"onBarPointerDown($event, vm, 'move')\"\r\n                />\r\n                @if (vm.progressWidth > 0) {\r\n                  <rect\r\n                    class=\"fly-gantt__progress\"\r\n                    [attr.x]=\"vm.x\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"vm.progressWidth\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    rx=\"4\"\r\n                  />\r\n                }\r\n                @if (vm.baseline) {\r\n                  <!-- Baseline (plan-of-record) underbar \u2014 a thin muted strip beneath the current\r\n                       bar, the generic \"baseline vs current\" comparison. -->\r\n                  <rect\r\n                    class=\"fly-gantt__baseline-bar\"\r\n                    [attr.x]=\"vm.baseline.x\"\r\n                    [attr.y]=\"baselineBarTop(vm)\"\r\n                    [attr.width]=\"vm.baseline.width\"\r\n                    [attr.height]=\"BASELINE_BAR_H\"\r\n                  />\r\n                }\r\n                @if (vm.editable) {\r\n                  <!-- Resize handles at both edges. -->\r\n                  <rect\r\n                    class=\"fly-gantt__handle\"\r\n                    [attr.x]=\"vm.x\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"HANDLE_W\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    [attr.aria-label]=\"'gantt.aria.resize_start' | translate\"\r\n                    (pointerdown)=\"onBarPointerDown($event, vm, 'resize-start')\"\r\n                  />\r\n                  <rect\r\n                    class=\"fly-gantt__handle\"\r\n                    [attr.x]=\"vm.x + vm.width - HANDLE_W\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"HANDLE_W\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    [attr.aria-label]=\"'gantt.aria.resize_end' | translate\"\r\n                    (pointerdown)=\"onBarPointerDown($event, vm, 'resize-end')\"\r\n                  />\r\n                }\r\n                @if (!readonly() && !vm.flat.row.readonly) {\r\n                  <!-- One connector per END. Dragging from the start edge yields an SS/SF link\r\n                       and from the finish edge an FS/FF one \u2014 the drop edge picks which. -->\r\n                  <circle\r\n                    class=\"fly-gantt__connector\"\r\n                    [attr.cx]=\"vm.startX\"\r\n                    [attr.cy]=\"vm.midY\"\r\n                    r=\"4\"\r\n                    [attr.aria-label]=\"'gantt.aria.link_handle_start' | translate: { label: vm.flat.row.label }\"\r\n                    (pointerdown)=\"onLinkPointerDown($event, vm, 'start')\"\r\n                  />\r\n                  <circle\r\n                    class=\"fly-gantt__connector\"\r\n                    [attr.cx]=\"vm.endX\"\r\n                    [attr.cy]=\"vm.midY\"\r\n                    r=\"4\"\r\n                    [attr.aria-label]=\"'gantt.aria.link_handle' | translate: { label: vm.flat.row.label }\"\r\n                    (pointerdown)=\"onLinkPointerDown($event, vm, 'finish')\"\r\n                  />\r\n                }\r\n              </g>\r\n            }\r\n          }\r\n        </g>\r\n      }\r\n\r\n      <!-- Dependency arrows (skipped for missing / collapsed endpoints). Each carries a fat\r\n           transparent twin so a 1.5px line is still clickable at pointer precision. -->\r\n      @for (link of linkVms(); track link.key) {\r\n        <g class=\"fly-gantt__link-group\" [class.fly-gantt__link-group--selected]=\"selectedLinkKey() === link.key\">\r\n          <path\r\n            class=\"fly-gantt__link-hit\"\r\n            [attr.d]=\"link.path\"\r\n            [attr.aria-label]=\"link.ariaLabel\"\r\n            (click)=\"onLinkClick($event, link)\"\r\n          />\r\n          <path class=\"fly-gantt__link\" [attr.d]=\"link.path\" [attr.marker-end]=\"'url(#' + markerId + ')'\" />\r\n          @if (selectedLinkKey() === link.key && !readonly()) {\r\n            <g\r\n              class=\"fly-gantt__link-delete\"\r\n              [attr.transform]=\"'translate(' + link.badgeX + ',' + link.badgeY + ')'\"\r\n              [attr.aria-label]=\"'gantt.aria.delete_link' | translate\"\r\n              (click)=\"deleteLink($event, link)\"\r\n            >\r\n              <circle class=\"fly-gantt__link-delete-bg\" r=\"8\" />\r\n              <path class=\"fly-gantt__link-delete-x\" d=\"M-3.5,-3.5 L3.5,3.5 M3.5,-3.5 L-3.5,3.5\" />\r\n            </g>\r\n          }\r\n        </g>\r\n      }\r\n\r\n      <!-- In-flight link rubber band. -->\r\n      @if (linkGesturePath(); as gp) {\r\n        <path class=\"fly-gantt__link fly-gantt__link--ghost\" [attr.d]=\"gp\" [attr.marker-end]=\"'url(#' + markerId + ')'\" />\r\n      }\r\n\r\n      <!-- Today line (over the bars) \u2014 spans the WINDOW's y-extent, not the full spacer, since\r\n           the svg's own viewBox only covers `[svgTop, svgTop + svgHeight]` (memo \u00A74.3 point 3). -->\r\n      @if (todayX() !== null) {\r\n        <line class=\"fly-gantt__today\" [attr.x1]=\"todayX()\" [attr.y1]=\"svgTop()\" [attr.x2]=\"todayX()\" [attr.y2]=\"svgTop() + svgHeight()\" />\r\n      }\r\n    </svg>\r\n    </div>\r\n  </div>\r\n\r\n  @if (visibleRows().length === 0) {\r\n    <p class=\"fly-gantt__empty\">{{ 'gantt.no_data' | translate }}</p>\r\n  }\r\n  @if (overflowCount() > 0) {\r\n    <p class=\"fly-gantt__overflow\">\r\n      {{ 'gantt.overflow' | translate: { shown: maxRows(), total: maxRows() + overflowCount() } }}\r\n    </p>\r\n  }\r\n</div>\r\n\r\n<!-- Drag candidate tooltip (HTML overlay, follows the cursor). -->\r\n@if (dragTooltip(); as tip) {\r\n  <div class=\"fly-gantt__tooltip\" [style.left.px]=\"tip.x\" [style.top.px]=\"tip.y\">{{ tip.text }}</div>\r\n}\r\n", styles: [":host,:host *,:host *:before,:host *:after{box-sizing:border-box}:host{--_surface: var(--bg-2, var(--surface-card, #fff));--_surface-alt: var(--bg-3, var(--glass-bg-elevated, #f8fafc));--_surface-hover: var(--bg-hover, var(--surface-hover, #f1f5f9));--_border: var(--w08, var(--surface-border, #e2e8f0));--_border-strong: var(--w1, var(--surface-border, #cbd5e1));--_grid-line: var(--line-3, var(--surface-border, #eef2f7));--_text: var(--ink, var(--text-color, #0f172a));--_text-subtle: var(--ink-3, var(--text-color-secondary, #64748b));--_text-faint: var(--ink-4, var(--text-color-secondary, #94a3b8));--_accent: var(--accent);--_bar: var(--_accent);--_baseline: var(--fly-gantt-baseline, var(--ink-4, var(--text-color-secondary, #94a3b8)));--_bar-progress: color-mix(in srgb, var(--_accent) 72%, #000);--_weekend: color-mix(in srgb, var(--_text-subtle) 9%, transparent);--_today: var(--danger, #ef4444);--_link: var(--_text-subtle);--_radius: var(--r-lg, 8px);--_transition: var(--t-state, .12s ease);display:block;inline-size:100%;block-size:100%;min-block-size:200px;color:var(--_text);font-size:13px}:host(.fly-gantt--resizing){cursor:col-resize;-webkit-user-select:none;user-select:none}.fly-gantt__scroll{position:relative;inline-size:100%;block-size:100%;overflow:auto;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface);box-shadow:var(--shadow-card, none);outline:none}.fly-gantt__scroll:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:-2px}.fly-gantt__canvas{display:grid;position:relative}.fly-gantt__corner{position:sticky;inset-block-start:0;inset-inline-start:0;z-index:4;background:var(--_surface-alt);-webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);border-inline-end:1px solid var(--_border);border-block-end:1px solid var(--_border-strong)}.fly-gantt__time-header{position:sticky;inset-block-start:0;z-index:3;display:block;background:var(--_surface-alt);-webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);border-block-end:1px solid var(--_border-strong)}.fly-gantt__tick-line{stroke:var(--_grid-line);stroke-width:1}.fly-gantt__tick-label{fill:var(--_text-subtle);font-size:11px;text-anchor:middle;dominant-baseline:middle}.fly-gantt__tick-label--upper{fill:var(--_text);font-weight:600}.fly-gantt__splitter{position:absolute;inset-block:0;inset-inline-end:-3px;inline-size:7px;z-index:5;cursor:col-resize;touch-action:none}.fly-gantt__splitter:after{content:\"\";position:absolute;inset-block:0;inset-inline-start:3px;inline-size:1px;background:transparent;transition:background var(--_transition)}.fly-gantt__splitter:hover:after,.fly-gantt__splitter:focus-visible:after{background:var(--_accent)}.fly-gantt__splitter:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:-1px}:host(.fly-gantt--resizing) .fly-gantt__splitter:after{background:var(--_accent)}.fly-gantt__labels{position:sticky;inset-inline-start:0;z-index:2;background:var(--_surface);border-inline-end:1px solid var(--_border)}.fly-gantt__label-row{position:relative;display:flex;align-items:center;border-block-end:1px solid var(--_grid-line);cursor:pointer;transition:background var(--_transition)}.fly-gantt__label-row:hover{background:var(--_surface-hover)}.fly-gantt__label-row--selected{background:var(--_surface-hover);box-shadow:inset 3px 0 0 0 var(--_accent)}.fly-gantt__label-row--tinted:before{content:\"\";position:absolute;inset:0;background:var(--fly-gantt-row-tint);pointer-events:none}.fly-gantt__label-inner{position:relative;display:flex;align-items:center;gap:4px;inline-size:100%;min-inline-size:0;padding-inline-end:8px}.fly-gantt__label-swatch{flex:0 0 auto;inline-size:8px;block-size:8px;border-radius:2px}.fly-gantt__chevron{flex:0 0 auto;inline-size:18px;block-size:18px;padding:0;border:none;background:transparent;color:var(--_text-subtle);cursor:pointer;line-height:1;transform:rotate(90deg);transition:transform var(--_transition)}.fly-gantt__chevron--collapsed{transform:rotate(0)}:host(.fly-gantt--rtl) .fly-gantt__chevron--collapsed{transform:rotate(180deg)}.fly-gantt__chevron:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:1px;border-radius:4px}.fly-gantt__chevron-spacer{flex:0 0 auto;inline-size:18px}.fly-gantt__label-text{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fly-gantt__label-text--group{font-weight:600}.fly-gantt__label-cell-hidden{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.fly-gantt__body-cell{position:relative}.fly-gantt__body{position:absolute;inset-inline-start:0;display:block;touch-action:pan-x pan-y}.fly-gantt__row-band{pointer-events:none}.fly-gantt__weekend{fill:var(--_weekend)}.fly-gantt__grid-line{stroke:var(--_grid-line);stroke-width:1}.fly-gantt__row-hit{fill:transparent}.fly-gantt__row-hit--selected{fill:var(--_surface-hover)}.fly-gantt__bar{fill:var(--_bar);stroke:none}.fly-gantt__bar--editable{cursor:grab}.fly-gantt__progress{fill:var(--_bar-progress);pointer-events:none}.fly-gantt__handle{fill:transparent;cursor:ew-resize}.fly-gantt__connector{fill:var(--_surface);stroke:var(--_accent);stroke-width:1.5;cursor:crosshair;opacity:0;transition:opacity var(--_transition)}.fly-gantt__row:hover .fly-gantt__connector{opacity:1}.fly-gantt__milestone{fill:var(--_accent);stroke:var(--_surface);stroke-width:1}.fly-gantt__milestone--editable{cursor:grab}.fly-gantt__group{fill:var(--_text-subtle);stroke:var(--_text-subtle)}.fly-gantt__baseline-bar{fill:var(--_baseline);opacity:.55;pointer-events:none}.fly-gantt__baseline-milestone{fill:none;stroke:var(--_baseline);stroke-width:1.5;pointer-events:none}.fly-gantt__link{fill:none;stroke:var(--_link);stroke-width:1.5;pointer-events:none}.fly-gantt__link-hit{fill:none;stroke:transparent;stroke-width:11;pointer-events:stroke;cursor:pointer}.fly-gantt__link-group:hover .fly-gantt__link{stroke:var(--_text)}.fly-gantt__link-group--selected .fly-gantt__link{stroke:var(--_accent);stroke-width:2.5}.fly-gantt__link-delete-bg{fill:var(--_accent)}.fly-gantt__link-delete{cursor:pointer}.fly-gantt__link-delete-x{stroke:var(--_surface);stroke-width:1.75;stroke-linecap:round;fill:none;pointer-events:none}.fly-gantt__link--ghost{stroke-dasharray:4 3;opacity:.8}.fly-gantt__arrowhead{fill:var(--_link)}.fly-gantt__today{stroke:var(--_today);stroke-width:1.5;stroke-dasharray:3 3;pointer-events:none}.fly-gantt__empty,.fly-gantt__overflow{margin:0;padding:12px;color:var(--_text-faint);font-size:12px;text-align:center}.fly-gantt__tooltip{position:fixed;z-index:20;transform:translate(12px,16px);padding:4px 8px;border-radius:6px;background:var(--_text);color:var(--_surface);font-size:12px;white-space:nowrap;pointer-events:none;direction:ltr;unicode-bidi:isolate}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyGanttComponent, decorators: [{
             type: Component,
@@ -13895,8 +14329,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
                         '[class.fly-gantt--readonly]': 'readonly()',
                         '[class.fly-gantt--resizing]': 'resizingLabels()',
                         '[attr.dir]': 'i18n.direction()',
-                    }, template: "<!-- Cross-scrolling canvas: a CSS grid whose header row and label column are sticky, so the\r\n     time grid scrolls under a pinned header + label tree. All SVG geometry is pre-mirrored for\r\n     RTL in the component (see gantt-scale mapX), so this template never branches on direction. -->\r\n<div\r\n  class=\"fly-gantt__scroll\"\r\n  role=\"grid\"\r\n  tabindex=\"0\"\r\n  [attr.aria-label]=\"'gantt.aria.grid' | translate\"\r\n  [attr.aria-rowcount]=\"visibleRows().length\"\r\n  (keydown)=\"onGridKeydown($event)\"\r\n>\r\n  <div\r\n    class=\"fly-gantt__canvas\"\r\n    [style.grid-template-columns]=\"effectiveLabelWidth() + 'px ' + innerWidth() + 'px'\"\r\n    [style.grid-template-rows]=\"HEADER_H + 'px ' + bodyHeight() + 'px'\"\r\n  >\r\n    <!-- \u2500\u2500 Corner (pinned both axes) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <div class=\"fly-gantt__corner\" [style.height.px]=\"HEADER_H\">\r\n      @if (resizableLabels()) {\r\n        <!-- The divider lives in the corner because the corner is the one cell pinned on BOTH\r\n             axes: the grip stays reachable however far the user has scrolled. The full-height\r\n             strip down the label pane below is the same gesture, presentational only. -->\r\n        <div\r\n          class=\"fly-gantt__splitter\"\r\n          role=\"separator\"\r\n          tabindex=\"0\"\r\n          aria-orientation=\"vertical\"\r\n          [attr.aria-label]=\"'gantt.aria.label_resize' | translate\"\r\n          [attr.aria-valuenow]=\"effectiveLabelWidth()\"\r\n          [attr.aria-valuemin]=\"MIN_LABEL_W\"\r\n          [attr.aria-valuemax]=\"MAX_LABEL_W\"\r\n          (pointerdown)=\"onLabelResizePointerDown($event)\"\r\n          (keydown)=\"onLabelResizeKeydown($event)\"\r\n          (dblclick)=\"resetLabelWidth()\"\r\n        ></div>\r\n      }\r\n    </div>\r\n\r\n    <!-- \u2500\u2500 Time header (pinned top) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <svg\r\n      class=\"fly-gantt__time-header\"\r\n      [attr.width]=\"innerWidth()\"\r\n      [attr.height]=\"HEADER_H\"\r\n      [attr.viewBox]=\"'0 0 ' + innerWidth() + ' ' + HEADER_H\"\r\n      aria-hidden=\"true\"\r\n    >\r\n      @for (b of weekendBands(); track b.key) {\r\n        <rect class=\"fly-gantt__weekend\" [attr.x]=\"b.x\" [attr.y]=\"HEADER_UPPER_H\" [attr.width]=\"b.width\" [attr.height]=\"HEADER_LOWER_H\" />\r\n      }\r\n      @for (t of upperTicks(); track t.key) {\r\n        <line class=\"fly-gantt__tick-line\" [attr.x1]=\"t.x\" [attr.y1]=\"0\" [attr.x2]=\"t.x\" [attr.y2]=\"HEADER_H\" />\r\n        <text class=\"fly-gantt__tick-label fly-gantt__tick-label--upper\" [attr.x]=\"t.x + t.width / 2\" [attr.y]=\"HEADER_UPPER_H / 2 + 4\">{{ t.label }}</text>\r\n      }\r\n      @for (t of lowerTicks(); track t.key) {\r\n        <line class=\"fly-gantt__tick-line\" [attr.x1]=\"t.x\" [attr.y1]=\"HEADER_UPPER_H\" [attr.x2]=\"t.x\" [attr.y2]=\"HEADER_H\" />\r\n        <text class=\"fly-gantt__tick-label\" [attr.x]=\"t.x + t.width / 2\" [attr.y]=\"HEADER_UPPER_H + HEADER_LOWER_H / 2 + 4\">{{ t.label }}</text>\r\n      }\r\n      @if (todayX() !== null) {\r\n        <line class=\"fly-gantt__today\" [attr.x1]=\"todayX()\" [attr.y1]=\"HEADER_UPPER_H\" [attr.x2]=\"todayX()\" [attr.y2]=\"HEADER_H\" />\r\n      }\r\n    </svg>\r\n\r\n    <!-- \u2500\u2500 Label tree (pinned inline-start) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <div class=\"fly-gantt__labels\" role=\"rowgroup\">\r\n      @for (vm of rowVms(); track vm.flat.row.id) {\r\n        <div\r\n          class=\"fly-gantt__label-row\"\r\n          role=\"row\"\r\n          tabindex=\"-1\"\r\n          [class.fly-gantt__label-row--selected]=\"selectedId() === vm.flat.row.id\"\r\n          [class.fly-gantt__label-row--tinted]=\"vm.tint !== null\"\r\n          [style.height.px]=\"rowHeight()\"\r\n          [style.--fly-gantt-row-tint]=\"vm.tint\"\r\n          [attr.aria-selected]=\"selectedId() === vm.flat.row.id\"\r\n          [attr.aria-label]=\"vm.ariaLabel\"\r\n          (click)=\"onRowClick(vm.flat.row.id)\"\r\n          (dblclick)=\"onRowDblClick(vm.flat.row.id)\"\r\n          (keydown.enter)=\"onLabelRowKeydown($event, vm.flat.row.id)\"\r\n        >\r\n          <span class=\"fly-gantt__label-inner\" [style.padding-inline-start.px]=\"indentFor(vm.flat.depth)\">\r\n            @if (vm.flat.hasChildren) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"fly-gantt__chevron\"\r\n                [class.fly-gantt__chevron--collapsed]=\"isCollapsed(vm.flat.row.id)\"\r\n                [attr.aria-label]=\"(isCollapsed(vm.flat.row.id) ? 'gantt.expand' : 'gantt.collapse') | translate\"\r\n                [attr.aria-expanded]=\"!isCollapsed(vm.flat.row.id)\"\r\n                (click)=\"toggleCollapse(vm.flat.row.id, $event)\"\r\n              >\u25B8</button>\r\n            } @else {\r\n              <span class=\"fly-gantt__chevron-spacer\"></span>\r\n            }\r\n            @if (vm.color) {\r\n              <!-- Colour chip: the row's own colour at full strength, so a milestone stays\r\n                   identifiable in the label pane where the band tint is deliberately faint. -->\r\n              <span class=\"fly-gantt__label-swatch\" [style.background]=\"vm.color\" aria-hidden=\"true\"></span>\r\n            }\r\n            <span\r\n              class=\"fly-gantt__label-text\"\r\n              [class.fly-gantt__label-text--group]=\"vm.shape === 'group'\"\r\n              [title]=\"vm.flat.row.label\"\r\n            >{{ vm.flat.row.label }}</span>\r\n          </span>\r\n        </div>\r\n      }\r\n      @if (resizableLabels()) {\r\n        <!-- aria-hidden so this presentational twin of the corner separator is not a second\r\n             (and structurally invalid) child of the rowgroup in the accessibility tree. -->\r\n        <div\r\n          class=\"fly-gantt__splitter fly-gantt__splitter--rail\"\r\n          aria-hidden=\"true\"\r\n          (pointerdown)=\"onLabelResizePointerDown($event)\"\r\n          (dblclick)=\"resetLabelWidth()\"\r\n        ></div>\r\n      }\r\n    </div>\r\n\r\n    <!-- \u2500\u2500 Time grid body \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <svg\r\n      #bodySvg\r\n      class=\"fly-gantt__body\"\r\n      [attr.width]=\"innerWidth()\"\r\n      [attr.height]=\"bodyHeight()\"\r\n      [attr.viewBox]=\"'0 0 ' + innerWidth() + ' ' + bodyHeight()\"\r\n    >\r\n      <defs>\r\n        <marker\r\n          [attr.id]=\"markerId\"\r\n          markerWidth=\"8\"\r\n          markerHeight=\"8\"\r\n          refX=\"6\"\r\n          refY=\"4\"\r\n          orient=\"auto\"\r\n          markerUnits=\"userSpaceOnUse\"\r\n        >\r\n          <path class=\"fly-gantt__arrowhead\" d=\"M0,0 L7,4 L0,8 Z\" />\r\n        </marker>\r\n      </defs>\r\n\r\n      <!-- Row colour bands sit at the very bottom of the stack, so the weekend shading and the\r\n           gridlines below still read through them. -->\r\n      @for (vm of tintedRows(); track vm.flat.row.id) {\r\n        <rect\r\n          class=\"fly-gantt__row-band\"\r\n          [attr.x]=\"0\"\r\n          [attr.y]=\"vm.y\"\r\n          [attr.width]=\"innerWidth()\"\r\n          [attr.height]=\"rowHeight()\"\r\n          [style.fill]=\"vm.tint\"\r\n        />\r\n      }\r\n\r\n      <!-- Weekend shading + vertical gridlines (behind the bars). -->\r\n      @for (b of weekendBands(); track b.key) {\r\n        <rect class=\"fly-gantt__weekend\" [attr.x]=\"b.x\" [attr.y]=\"0\" [attr.width]=\"b.width\" [attr.height]=\"bodyHeight()\" />\r\n      }\r\n      @for (t of lowerTicks(); track t.key) {\r\n        <line class=\"fly-gantt__grid-line\" [attr.x1]=\"t.x\" [attr.y1]=\"0\" [attr.x2]=\"t.x\" [attr.y2]=\"bodyHeight()\" />\r\n      }\r\n\r\n      <!-- Rows: a full-width hit rect (click + link drop target) then the shape. -->\r\n      @for (vm of rowVms(); track vm.flat.row.id) {\r\n        <g class=\"fly-gantt__row\" [attr.data-row-id]=\"vm.flat.row.id\">\r\n          <rect\r\n            class=\"fly-gantt__row-hit\"\r\n            [class.fly-gantt__row-hit--selected]=\"selectedId() === vm.flat.row.id\"\r\n            [attr.x]=\"0\"\r\n            [attr.y]=\"vm.y\"\r\n            [attr.width]=\"innerWidth()\"\r\n            [attr.height]=\"rowHeight()\"\r\n            (pointerdown)=\"onRowClick(vm.flat.row.id)\"\r\n            (dblclick)=\"onRowDblClick(vm.flat.row.id)\"\r\n          />\r\n\r\n          @switch (vm.shape) {\r\n            @case ('group') {\r\n              <path class=\"fly-gantt__group\" [attr.d]=\"groupPath(vm)\" [style.fill]=\"vm.color\" [style.stroke]=\"vm.color\" />\r\n            }\r\n            @case ('milestone') {\r\n              <polygon\r\n                class=\"fly-gantt__milestone\"\r\n                [class.fly-gantt__milestone--editable]=\"vm.editable\"\r\n                [attr.points]=\"diamondPoints(vm)\"\r\n                [style.fill]=\"vm.color\"\r\n                (pointerdown)=\"onBarPointerDown($event, vm, 'move')\"\r\n              />\r\n              @if (!readonly() && !vm.flat.row.readonly) {\r\n                <!-- A diamond has no width, so one connector serves it; it reads as the finish\r\n                     end, which is what makes a milestone\u2192task drag the FS everyone expects. -->\r\n                <circle\r\n                  class=\"fly-gantt__connector\"\r\n                  [attr.cx]=\"milestoneConnectorX(vm)\"\r\n                  [attr.cy]=\"vm.midY\"\r\n                  r=\"4\"\r\n                  [attr.aria-label]=\"'gantt.aria.link_handle' | translate: { label: vm.flat.row.label }\"\r\n                  (pointerdown)=\"onLinkPointerDown($event, vm, 'finish')\"\r\n                />\r\n              }\r\n            }\r\n            @case ('bar') {\r\n              <g class=\"fly-gantt__bar-group\">\r\n                <rect\r\n                  class=\"fly-gantt__bar\"\r\n                  [class.fly-gantt__bar--editable]=\"vm.editable\"\r\n                  [attr.x]=\"vm.x\"\r\n                  [attr.y]=\"barTop(vm)\"\r\n                  [attr.width]=\"vm.width\"\r\n                  [attr.height]=\"barHeight()\"\r\n                  rx=\"4\"\r\n                  [style.fill]=\"vm.color\"\r\n                  (pointerdown)=\"onBarPointerDown($event, vm, 'move')\"\r\n                />\r\n                @if (vm.progressWidth > 0) {\r\n                  <rect\r\n                    class=\"fly-gantt__progress\"\r\n                    [attr.x]=\"vm.x\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"vm.progressWidth\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    rx=\"4\"\r\n                  />\r\n                }\r\n                @if (vm.editable) {\r\n                  <!-- Resize handles at both edges. -->\r\n                  <rect\r\n                    class=\"fly-gantt__handle\"\r\n                    [attr.x]=\"vm.x\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"HANDLE_W\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    [attr.aria-label]=\"'gantt.aria.resize_start' | translate\"\r\n                    (pointerdown)=\"onBarPointerDown($event, vm, 'resize-start')\"\r\n                  />\r\n                  <rect\r\n                    class=\"fly-gantt__handle\"\r\n                    [attr.x]=\"vm.x + vm.width - HANDLE_W\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"HANDLE_W\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    [attr.aria-label]=\"'gantt.aria.resize_end' | translate\"\r\n                    (pointerdown)=\"onBarPointerDown($event, vm, 'resize-end')\"\r\n                  />\r\n                }\r\n                @if (!readonly() && !vm.flat.row.readonly) {\r\n                  <!-- One connector per END. Dragging from the start edge yields an SS/SF link\r\n                       and from the finish edge an FS/FF one \u2014 the drop edge picks which. -->\r\n                  <circle\r\n                    class=\"fly-gantt__connector\"\r\n                    [attr.cx]=\"vm.startX\"\r\n                    [attr.cy]=\"vm.midY\"\r\n                    r=\"4\"\r\n                    [attr.aria-label]=\"'gantt.aria.link_handle_start' | translate: { label: vm.flat.row.label }\"\r\n                    (pointerdown)=\"onLinkPointerDown($event, vm, 'start')\"\r\n                  />\r\n                  <circle\r\n                    class=\"fly-gantt__connector\"\r\n                    [attr.cx]=\"vm.endX\"\r\n                    [attr.cy]=\"vm.midY\"\r\n                    r=\"4\"\r\n                    [attr.aria-label]=\"'gantt.aria.link_handle' | translate: { label: vm.flat.row.label }\"\r\n                    (pointerdown)=\"onLinkPointerDown($event, vm, 'finish')\"\r\n                  />\r\n                }\r\n              </g>\r\n            }\r\n          }\r\n        </g>\r\n      }\r\n\r\n      <!-- Dependency arrows (skipped for missing / collapsed endpoints). Each carries a fat\r\n           transparent twin so a 1.5px line is still clickable at pointer precision. -->\r\n      @for (link of linkVms(); track link.key) {\r\n        <g class=\"fly-gantt__link-group\" [class.fly-gantt__link-group--selected]=\"selectedLinkKey() === link.key\">\r\n          <path\r\n            class=\"fly-gantt__link-hit\"\r\n            [attr.d]=\"link.path\"\r\n            [attr.aria-label]=\"link.ariaLabel\"\r\n            (click)=\"onLinkClick($event, link)\"\r\n          />\r\n          <path class=\"fly-gantt__link\" [attr.d]=\"link.path\" [attr.marker-end]=\"'url(#' + markerId + ')'\" />\r\n          @if (selectedLinkKey() === link.key && !readonly()) {\r\n            <g\r\n              class=\"fly-gantt__link-delete\"\r\n              [attr.transform]=\"'translate(' + link.badgeX + ',' + link.badgeY + ')'\"\r\n              [attr.aria-label]=\"'gantt.aria.delete_link' | translate\"\r\n              (click)=\"deleteLink($event, link)\"\r\n            >\r\n              <circle class=\"fly-gantt__link-delete-bg\" r=\"8\" />\r\n              <path class=\"fly-gantt__link-delete-x\" d=\"M-3.5,-3.5 L3.5,3.5 M3.5,-3.5 L-3.5,3.5\" />\r\n            </g>\r\n          }\r\n        </g>\r\n      }\r\n\r\n      <!-- In-flight link rubber band. -->\r\n      @if (linkGesturePath(); as gp) {\r\n        <path class=\"fly-gantt__link fly-gantt__link--ghost\" [attr.d]=\"gp\" [attr.marker-end]=\"'url(#' + markerId + ')'\" />\r\n      }\r\n\r\n      <!-- Today line (over the bars). -->\r\n      @if (todayX() !== null) {\r\n        <line class=\"fly-gantt__today\" [attr.x1]=\"todayX()\" [attr.y1]=\"0\" [attr.x2]=\"todayX()\" [attr.y2]=\"bodyHeight()\" />\r\n      }\r\n    </svg>\r\n  </div>\r\n\r\n  @if (visibleRows().length === 0) {\r\n    <p class=\"fly-gantt__empty\">{{ 'gantt.no_data' | translate }}</p>\r\n  }\r\n  @if (overflowCount() > 0) {\r\n    <p class=\"fly-gantt__overflow\">\r\n      {{ 'gantt.overflow' | translate: { shown: maxRows(), total: maxRows() + overflowCount() } }}\r\n    </p>\r\n  }\r\n</div>\r\n\r\n<!-- Drag candidate tooltip (HTML overlay, follows the cursor). -->\r\n@if (dragTooltip(); as tip) {\r\n  <div class=\"fly-gantt__tooltip\" [style.left.px]=\"tip.x\" [style.top.px]=\"tip.y\">{{ tip.text }}</div>\r\n}\r\n", styles: [":host,:host *,:host *:before,:host *:after{box-sizing:border-box}:host{--_surface: var(--bg-2, var(--surface-card, #fff));--_surface-alt: var(--bg-3, var(--glass-bg-elevated, #f8fafc));--_surface-hover: var(--bg-hover, var(--surface-hover, #f1f5f9));--_border: var(--w08, var(--surface-border, #e2e8f0));--_border-strong: var(--w1, var(--surface-border, #cbd5e1));--_grid-line: var(--line-3, var(--surface-border, #eef2f7));--_text: var(--ink, var(--text-color, #0f172a));--_text-subtle: var(--ink-3, var(--text-color-secondary, #64748b));--_text-faint: var(--ink-4, var(--text-color-secondary, #94a3b8));--_accent: var(--accent);--_bar: var(--_accent);--_bar-progress: color-mix(in srgb, var(--_accent) 72%, #000);--_weekend: color-mix(in srgb, var(--_text-subtle) 9%, transparent);--_today: var(--danger, #ef4444);--_link: var(--_text-subtle);--_radius: var(--r-lg, 8px);--_transition: var(--t-state, .12s ease);display:block;inline-size:100%;block-size:100%;min-block-size:200px;color:var(--_text);font-size:13px}:host(.fly-gantt--resizing){cursor:col-resize;-webkit-user-select:none;user-select:none}.fly-gantt__scroll{position:relative;inline-size:100%;block-size:100%;overflow:auto;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface);box-shadow:var(--shadow-card, none);outline:none}.fly-gantt__scroll:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:-2px}.fly-gantt__canvas{display:grid;position:relative}.fly-gantt__corner{position:sticky;inset-block-start:0;inset-inline-start:0;z-index:4;background:var(--_surface-alt);-webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);border-inline-end:1px solid var(--_border);border-block-end:1px solid var(--_border-strong)}.fly-gantt__time-header{position:sticky;inset-block-start:0;z-index:3;display:block;background:var(--_surface-alt);-webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);border-block-end:1px solid var(--_border-strong)}.fly-gantt__tick-line{stroke:var(--_grid-line);stroke-width:1}.fly-gantt__tick-label{fill:var(--_text-subtle);font-size:11px;text-anchor:middle;dominant-baseline:middle}.fly-gantt__tick-label--upper{fill:var(--_text);font-weight:600}.fly-gantt__splitter{position:absolute;inset-block:0;inset-inline-end:-3px;inline-size:7px;z-index:5;cursor:col-resize;touch-action:none}.fly-gantt__splitter:after{content:\"\";position:absolute;inset-block:0;inset-inline-start:3px;inline-size:1px;background:transparent;transition:background var(--_transition)}.fly-gantt__splitter:hover:after,.fly-gantt__splitter:focus-visible:after{background:var(--_accent)}.fly-gantt__splitter:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:-1px}:host(.fly-gantt--resizing) .fly-gantt__splitter:after{background:var(--_accent)}.fly-gantt__labels{position:sticky;inset-inline-start:0;z-index:2;background:var(--_surface);border-inline-end:1px solid var(--_border)}.fly-gantt__label-row{position:relative;display:flex;align-items:center;border-block-end:1px solid var(--_grid-line);cursor:pointer;transition:background var(--_transition)}.fly-gantt__label-row:hover{background:var(--_surface-hover)}.fly-gantt__label-row--selected{background:var(--_surface-hover);box-shadow:inset 3px 0 0 0 var(--_accent)}.fly-gantt__label-row--tinted:before{content:\"\";position:absolute;inset:0;background:var(--fly-gantt-row-tint);pointer-events:none}.fly-gantt__label-inner{position:relative;display:flex;align-items:center;gap:4px;inline-size:100%;min-inline-size:0;padding-inline-end:8px}.fly-gantt__label-swatch{flex:0 0 auto;inline-size:8px;block-size:8px;border-radius:2px}.fly-gantt__chevron{flex:0 0 auto;inline-size:18px;block-size:18px;padding:0;border:none;background:transparent;color:var(--_text-subtle);cursor:pointer;line-height:1;transform:rotate(90deg);transition:transform var(--_transition)}.fly-gantt__chevron--collapsed{transform:rotate(0)}:host(.fly-gantt--rtl) .fly-gantt__chevron--collapsed{transform:rotate(180deg)}.fly-gantt__chevron:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:1px;border-radius:4px}.fly-gantt__chevron-spacer{flex:0 0 auto;inline-size:18px}.fly-gantt__label-text{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fly-gantt__label-text--group{font-weight:600}.fly-gantt__body{display:block;touch-action:pan-x pan-y}.fly-gantt__row-band{pointer-events:none}.fly-gantt__weekend{fill:var(--_weekend)}.fly-gantt__grid-line{stroke:var(--_grid-line);stroke-width:1}.fly-gantt__row-hit{fill:transparent}.fly-gantt__row-hit--selected{fill:var(--_surface-hover)}.fly-gantt__bar{fill:var(--_bar);stroke:none}.fly-gantt__bar--editable{cursor:grab}.fly-gantt__progress{fill:var(--_bar-progress);pointer-events:none}.fly-gantt__handle{fill:transparent;cursor:ew-resize}.fly-gantt__connector{fill:var(--_surface);stroke:var(--_accent);stroke-width:1.5;cursor:crosshair;opacity:0;transition:opacity var(--_transition)}.fly-gantt__row:hover .fly-gantt__connector{opacity:1}.fly-gantt__milestone{fill:var(--_accent);stroke:var(--_surface);stroke-width:1}.fly-gantt__milestone--editable{cursor:grab}.fly-gantt__group{fill:var(--_text-subtle);stroke:var(--_text-subtle)}.fly-gantt__link{fill:none;stroke:var(--_link);stroke-width:1.5;pointer-events:none}.fly-gantt__link-hit{fill:none;stroke:transparent;stroke-width:11;pointer-events:stroke;cursor:pointer}.fly-gantt__link-group:hover .fly-gantt__link{stroke:var(--_text)}.fly-gantt__link-group--selected .fly-gantt__link{stroke:var(--_accent);stroke-width:2.5}.fly-gantt__link-delete-bg{fill:var(--_accent)}.fly-gantt__link-delete{cursor:pointer}.fly-gantt__link-delete-x{stroke:var(--_surface);stroke-width:1.75;stroke-linecap:round;fill:none;pointer-events:none}.fly-gantt__link--ghost{stroke-dasharray:4 3;opacity:.8}.fly-gantt__arrowhead{fill:var(--_link)}.fly-gantt__today{stroke:var(--_today);stroke-width:1.5;stroke-dasharray:3 3;pointer-events:none}.fly-gantt__empty,.fly-gantt__overflow{margin:0;padding:12px;color:var(--_text-faint);font-size:12px;text-align:center}.fly-gantt__tooltip{position:fixed;z-index:20;transform:translate(12px,16px);padding:4px 8px;border-radius:6px;background:var(--_text);color:var(--_surface);font-size:12px;white-space:nowrap;pointer-events:none;direction:ltr;unicode-bidi:isolate}\n"] }]
-        }], propDecorators: { rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], dependencies: [{ type: i0.Input, args: [{ isSignal: true, alias: "dependencies", required: false }] }], zoom: [{ type: i0.Input, args: [{ isSignal: true, alias: "zoom", required: false }] }], showToday: [{ type: i0.Input, args: [{ isSignal: true, alias: "showToday", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], labelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelWidth", required: false }] }], resizableLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizableLabels", required: false }] }], rowHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowHeight", required: false }] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], rowDatesChange: [{ type: i0.Output, args: ["rowDatesChange"] }], dependencyCreate: [{ type: i0.Output, args: ["dependencyCreate"] }], dependencyDelete: [{ type: i0.Output, args: ["dependencyDelete"] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], rowDblClick: [{ type: i0.Output, args: ["rowDblClick"] }], labelWidthChange: [{ type: i0.Output, args: ["labelWidthChange"] }], bodyRef: [{ type: i0.ViewChild, args: ['bodySvg', { isSignal: true }] }] } });
+                    }, template: "<!-- Cross-scrolling canvas: a CSS grid whose header row and label column are sticky, so the\r\n     time grid scrolls under a pinned header + label tree. All SVG geometry is pre-mirrored for\r\n     RTL in the component (see gantt-scale mapX), so this template never branches on direction. -->\r\n<div\r\n  #scrollEl\r\n  class=\"fly-gantt__scroll\"\r\n  role=\"treegrid\"\r\n  tabindex=\"0\"\r\n  [attr.aria-label]=\"'gantt.aria.grid' | translate\"\r\n  [attr.aria-rowcount]=\"totalRowCount()\"\r\n  (keydown)=\"onGridKeydown($event)\"\r\n>\r\n  <div\r\n    #canvasEl\r\n    class=\"fly-gantt__canvas\"\r\n    [style.grid-template-columns]=\"effectiveLabelWidth() + 'px ' + innerWidth() + 'px'\"\r\n    [style.grid-template-rows]=\"HEADER_H + 'px ' + bodyHeight() + 'px'\"\r\n  >\r\n    <!-- \u2500\u2500 Corner (pinned both axes) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <div class=\"fly-gantt__corner\" [style.height.px]=\"HEADER_H\">\r\n      @if (resizableLabels()) {\r\n        <!-- The divider lives in the corner because the corner is the one cell pinned on BOTH\r\n             axes: the grip stays reachable however far the user has scrolled. The full-height\r\n             strip down the label pane below is the same gesture, presentational only. -->\r\n        <div\r\n          class=\"fly-gantt__splitter\"\r\n          role=\"separator\"\r\n          tabindex=\"0\"\r\n          aria-orientation=\"vertical\"\r\n          [attr.aria-label]=\"'gantt.aria.label_resize' | translate\"\r\n          [attr.aria-valuenow]=\"effectiveLabelWidth()\"\r\n          [attr.aria-valuemin]=\"MIN_LABEL_W\"\r\n          [attr.aria-valuemax]=\"MAX_LABEL_W\"\r\n          (pointerdown)=\"onLabelResizePointerDown($event)\"\r\n          (keydown)=\"onLabelResizeKeydown($event)\"\r\n          (dblclick)=\"resetLabelWidth()\"\r\n        ></div>\r\n      }\r\n    </div>\r\n\r\n    <!-- \u2500\u2500 Time header (pinned top) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\r\n    <svg\r\n      class=\"fly-gantt__time-header\"\r\n      [attr.width]=\"innerWidth()\"\r\n      [attr.height]=\"HEADER_H\"\r\n      [attr.viewBox]=\"'0 0 ' + innerWidth() + ' ' + HEADER_H\"\r\n      aria-hidden=\"true\"\r\n    >\r\n      @for (b of weekendBands(); track b.key) {\r\n        <rect class=\"fly-gantt__weekend\" [attr.x]=\"b.x\" [attr.y]=\"HEADER_UPPER_H\" [attr.width]=\"b.width\" [attr.height]=\"HEADER_LOWER_H\" />\r\n      }\r\n      @for (t of upperTicks(); track t.key) {\r\n        <line class=\"fly-gantt__tick-line\" [attr.x1]=\"t.x\" [attr.y1]=\"0\" [attr.x2]=\"t.x\" [attr.y2]=\"HEADER_H\" />\r\n        <text class=\"fly-gantt__tick-label fly-gantt__tick-label--upper\" [attr.x]=\"t.x + t.width / 2\" [attr.y]=\"HEADER_UPPER_H / 2 + 4\">{{ t.label }}</text>\r\n      }\r\n      @for (t of lowerTicks(); track t.key) {\r\n        <line class=\"fly-gantt__tick-line\" [attr.x1]=\"t.x\" [attr.y1]=\"HEADER_UPPER_H\" [attr.x2]=\"t.x\" [attr.y2]=\"HEADER_H\" />\r\n        <text class=\"fly-gantt__tick-label\" [attr.x]=\"t.x + t.width / 2\" [attr.y]=\"HEADER_UPPER_H + HEADER_LOWER_H / 2 + 4\">{{ t.label }}</text>\r\n      }\r\n      @if (todayX() !== null) {\r\n        <line class=\"fly-gantt__today\" [attr.x1]=\"todayX()\" [attr.y1]=\"HEADER_UPPER_H\" [attr.x2]=\"todayX()\" [attr.y2]=\"HEADER_H\">\r\n          <title>{{ 'gantt.today' | translate }}</title>\r\n        </line>\r\n      }\r\n    </svg>\r\n\r\n    <!-- \u2500\u2500 Label tree (pinned inline-start) \u2014 the ACCESSIBLE projection: the body SVG below is\r\n         aria-hidden, so every row/level/expanded/selected fact a screen reader needs lives here. -->\r\n    <div #labelsEl class=\"fly-gantt__labels\" role=\"rowgroup\">\r\n      @for (vm of rowVms(); track vm.flat.row.id) {\r\n        <div\r\n          class=\"fly-gantt__label-row\"\r\n          role=\"row\"\r\n          [attr.tabindex]=\"selectedId() === vm.flat.row.id ? 0 : -1\"\r\n          [attr.data-row-id]=\"vm.flat.row.id\"\r\n          [class.fly-gantt__label-row--selected]=\"selectedId() === vm.flat.row.id\"\r\n          [class.fly-gantt__label-row--tinted]=\"vm.tint !== null\"\r\n          [style.height.px]=\"rowHeight()\"\r\n          [style.--fly-gantt-row-tint]=\"vm.tint\"\r\n          [attr.aria-selected]=\"selectedId() === vm.flat.row.id\"\r\n          [attr.aria-rowindex]=\"vm.index + 1\"\r\n          [attr.aria-level]=\"vm.flat.depth + 1\"\r\n          [attr.aria-expanded]=\"vm.flat.hasChildren ? !vm.flat.collapsed : null\"\r\n          [attr.aria-label]=\"vm.ariaLabel\"\r\n          (click)=\"onRowClick(vm.flat.row.id)\"\r\n          (dblclick)=\"onRowDblClick(vm.flat.row.id)\"\r\n          (keydown.enter)=\"onLabelRowKeydown($event, vm.flat.row.id)\"\r\n        >\r\n          <span class=\"fly-gantt__label-inner\" role=\"gridcell\" [style.padding-inline-start.px]=\"indentFor(vm.flat.depth)\">\r\n            @if (vm.flat.hasChildren) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"fly-gantt__chevron\"\r\n                [class.fly-gantt__chevron--collapsed]=\"isCollapsed(vm.flat.row.id)\"\r\n                [attr.aria-label]=\"(isCollapsed(vm.flat.row.id) ? 'gantt.expand' : 'gantt.collapse') | translate\"\r\n                [attr.aria-expanded]=\"!isCollapsed(vm.flat.row.id)\"\r\n                (click)=\"toggleCollapse(vm.flat.row.id, $event)\"\r\n              >\u25B8</button>\r\n            } @else {\r\n              <span class=\"fly-gantt__chevron-spacer\"></span>\r\n            }\r\n            @if (vm.color) {\r\n              <!-- Colour chip: the row's own colour at full strength, so a milestone stays\r\n                   identifiable in the label pane where the band tint is deliberately faint. -->\r\n              <span class=\"fly-gantt__label-swatch\" [style.background]=\"vm.color\" aria-hidden=\"true\"></span>\r\n            }\r\n            <span\r\n              class=\"fly-gantt__label-text\"\r\n              [class.fly-gantt__label-text--group]=\"vm.shape === 'group'\"\r\n              [title]=\"vm.flat.row.label\"\r\n            >{{ vm.flat.row.label }}</span>\r\n          </span>\r\n          <!-- Visually-hidden second gridcell: the timeline summary a sighted user reads off the\r\n               bar/diamond geometry. The row's own aria-label already announces it; this cell keeps\r\n               the treegrid's row\u2192cell structure valid for a cell-navigating AT. -->\r\n          <span class=\"fly-gantt__label-cell-hidden\" role=\"gridcell\">{{ vm.ariaLabel }}</span>\r\n        </div>\r\n      }\r\n      @if (resizableLabels()) {\r\n        <!-- aria-hidden so this presentational twin of the corner separator is not a second\r\n             (and structurally invalid) child of the rowgroup in the accessibility tree. -->\r\n        <div\r\n          class=\"fly-gantt__splitter fly-gantt__splitter--rail\"\r\n          aria-hidden=\"true\"\r\n          (pointerdown)=\"onLabelResizePointerDown($event)\"\r\n          (dblclick)=\"resetLabelWidth()\"\r\n        ></div>\r\n      }\r\n    </div>\r\n\r\n    <!-- \u2500\u2500 Time grid body \u2014 a spacer cell (full height, keeps the native scrollbar honest) with\r\n         the actual `<svg>` absolutely positioned + `aria-hidden` (the label pane above is the\r\n         accessible projection). The `viewBox` y-offset panning IS the vertical virtualization \u2014\r\n         see `gantt-window.ts`'s docstring; nothing below this point knows windowing exists. -->\r\n    <div class=\"fly-gantt__body-cell\" [style.height.px]=\"bodyHeight()\">\r\n    <svg\r\n      #bodySvg\r\n      class=\"fly-gantt__body\"\r\n      aria-hidden=\"true\"\r\n      [style.top.px]=\"svgTop()\"\r\n      [attr.width]=\"innerWidth()\"\r\n      [attr.height]=\"svgHeight()\"\r\n      [attr.viewBox]=\"'0 ' + svgTop() + ' ' + innerWidth() + ' ' + svgHeight()\"\r\n    >\r\n      <defs>\r\n        <marker\r\n          [attr.id]=\"markerId\"\r\n          markerWidth=\"8\"\r\n          markerHeight=\"8\"\r\n          refX=\"6\"\r\n          refY=\"4\"\r\n          orient=\"auto\"\r\n          markerUnits=\"userSpaceOnUse\"\r\n        >\r\n          <path class=\"fly-gantt__arrowhead\" d=\"M0,0 L7,4 L0,8 Z\" />\r\n        </marker>\r\n      </defs>\r\n\r\n      <!-- Row colour bands sit at the very bottom of the stack, so the weekend shading and the\r\n           gridlines below still read through them. -->\r\n      @for (vm of tintedRows(); track vm.flat.row.id) {\r\n        <rect\r\n          class=\"fly-gantt__row-band\"\r\n          [attr.x]=\"0\"\r\n          [attr.y]=\"vm.y\"\r\n          [attr.width]=\"innerWidth()\"\r\n          [attr.height]=\"rowHeight()\"\r\n          [style.fill]=\"vm.tint\"\r\n        />\r\n      }\r\n\r\n      <!-- Weekend shading + vertical gridlines (behind the bars) \u2014 span the WINDOW's y-extent,\r\n           like the today line above; `weekendBands`/`lowerTicks` are already x-windowed too. -->\r\n      @for (b of weekendBands(); track b.key) {\r\n        <rect class=\"fly-gantt__weekend\" [attr.x]=\"b.x\" [attr.y]=\"svgTop()\" [attr.width]=\"b.width\" [attr.height]=\"svgHeight()\" />\r\n      }\r\n      @for (t of lowerTicks(); track t.key) {\r\n        <line class=\"fly-gantt__grid-line\" [attr.x1]=\"t.x\" [attr.y1]=\"svgTop()\" [attr.x2]=\"t.x\" [attr.y2]=\"svgTop() + svgHeight()\" />\r\n      }\r\n\r\n      <!-- Rows: a full-width hit rect (click + link drop target) then the shape. -->\r\n      @for (vm of rowVms(); track vm.flat.row.id) {\r\n        <g class=\"fly-gantt__row\" [attr.data-row-id]=\"vm.flat.row.id\">\r\n          <rect\r\n            class=\"fly-gantt__row-hit\"\r\n            [class.fly-gantt__row-hit--selected]=\"selectedId() === vm.flat.row.id\"\r\n            [attr.x]=\"0\"\r\n            [attr.y]=\"vm.y\"\r\n            [attr.width]=\"innerWidth()\"\r\n            [attr.height]=\"rowHeight()\"\r\n            (pointerdown)=\"onRowClick(vm.flat.row.id)\"\r\n            (dblclick)=\"onRowDblClick(vm.flat.row.id)\"\r\n          />\r\n\r\n          @switch (vm.shape) {\r\n            @case ('group') {\r\n              <path class=\"fly-gantt__group\" [attr.d]=\"groupPath(vm)\" [style.fill]=\"vm.color\" [style.stroke]=\"vm.color\" />\r\n            }\r\n            @case ('milestone') {\r\n              <polygon\r\n                class=\"fly-gantt__milestone\"\r\n                [class.fly-gantt__milestone--editable]=\"vm.editable\"\r\n                [attr.points]=\"diamondPoints(vm)\"\r\n                [style.fill]=\"vm.color\"\r\n                (pointerdown)=\"onBarPointerDown($event, vm, 'move')\"\r\n              />\r\n              @if (vm.baseline) {\r\n                <!-- Baseline (plan-of-record) date: a small HOLLOW diamond so it reads as a\r\n                     comparison against the solid current one, never a duplicate marker. -->\r\n                <polygon class=\"fly-gantt__baseline-milestone\" [attr.points]=\"baselineDiamondPoints(vm)\" />\r\n              }\r\n              @if (!readonly() && !vm.flat.row.readonly) {\r\n                <!-- A diamond has no width, so one connector serves it; it reads as the finish\r\n                     end, which is what makes a milestone\u2192task drag the FS everyone expects. -->\r\n                <circle\r\n                  class=\"fly-gantt__connector\"\r\n                  [attr.cx]=\"milestoneConnectorX(vm)\"\r\n                  [attr.cy]=\"vm.midY\"\r\n                  r=\"4\"\r\n                  [attr.aria-label]=\"'gantt.aria.link_handle' | translate: { label: vm.flat.row.label }\"\r\n                  (pointerdown)=\"onLinkPointerDown($event, vm, 'finish')\"\r\n                />\r\n              }\r\n            }\r\n            @case ('bar') {\r\n              <g class=\"fly-gantt__bar-group\">\r\n                <rect\r\n                  class=\"fly-gantt__bar\"\r\n                  [class.fly-gantt__bar--editable]=\"vm.editable\"\r\n                  [attr.x]=\"vm.x\"\r\n                  [attr.y]=\"barTop(vm)\"\r\n                  [attr.width]=\"vm.width\"\r\n                  [attr.height]=\"barHeight()\"\r\n                  rx=\"4\"\r\n                  [style.fill]=\"vm.color\"\r\n                  (pointerdown)=\"onBarPointerDown($event, vm, 'move')\"\r\n                />\r\n                @if (vm.progressWidth > 0) {\r\n                  <rect\r\n                    class=\"fly-gantt__progress\"\r\n                    [attr.x]=\"vm.x\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"vm.progressWidth\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    rx=\"4\"\r\n                  />\r\n                }\r\n                @if (vm.baseline) {\r\n                  <!-- Baseline (plan-of-record) underbar \u2014 a thin muted strip beneath the current\r\n                       bar, the generic \"baseline vs current\" comparison. -->\r\n                  <rect\r\n                    class=\"fly-gantt__baseline-bar\"\r\n                    [attr.x]=\"vm.baseline.x\"\r\n                    [attr.y]=\"baselineBarTop(vm)\"\r\n                    [attr.width]=\"vm.baseline.width\"\r\n                    [attr.height]=\"BASELINE_BAR_H\"\r\n                  />\r\n                }\r\n                @if (vm.editable) {\r\n                  <!-- Resize handles at both edges. -->\r\n                  <rect\r\n                    class=\"fly-gantt__handle\"\r\n                    [attr.x]=\"vm.x\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"HANDLE_W\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    [attr.aria-label]=\"'gantt.aria.resize_start' | translate\"\r\n                    (pointerdown)=\"onBarPointerDown($event, vm, 'resize-start')\"\r\n                  />\r\n                  <rect\r\n                    class=\"fly-gantt__handle\"\r\n                    [attr.x]=\"vm.x + vm.width - HANDLE_W\"\r\n                    [attr.y]=\"barTop(vm)\"\r\n                    [attr.width]=\"HANDLE_W\"\r\n                    [attr.height]=\"barHeight()\"\r\n                    [attr.aria-label]=\"'gantt.aria.resize_end' | translate\"\r\n                    (pointerdown)=\"onBarPointerDown($event, vm, 'resize-end')\"\r\n                  />\r\n                }\r\n                @if (!readonly() && !vm.flat.row.readonly) {\r\n                  <!-- One connector per END. Dragging from the start edge yields an SS/SF link\r\n                       and from the finish edge an FS/FF one \u2014 the drop edge picks which. -->\r\n                  <circle\r\n                    class=\"fly-gantt__connector\"\r\n                    [attr.cx]=\"vm.startX\"\r\n                    [attr.cy]=\"vm.midY\"\r\n                    r=\"4\"\r\n                    [attr.aria-label]=\"'gantt.aria.link_handle_start' | translate: { label: vm.flat.row.label }\"\r\n                    (pointerdown)=\"onLinkPointerDown($event, vm, 'start')\"\r\n                  />\r\n                  <circle\r\n                    class=\"fly-gantt__connector\"\r\n                    [attr.cx]=\"vm.endX\"\r\n                    [attr.cy]=\"vm.midY\"\r\n                    r=\"4\"\r\n                    [attr.aria-label]=\"'gantt.aria.link_handle' | translate: { label: vm.flat.row.label }\"\r\n                    (pointerdown)=\"onLinkPointerDown($event, vm, 'finish')\"\r\n                  />\r\n                }\r\n              </g>\r\n            }\r\n          }\r\n        </g>\r\n      }\r\n\r\n      <!-- Dependency arrows (skipped for missing / collapsed endpoints). Each carries a fat\r\n           transparent twin so a 1.5px line is still clickable at pointer precision. -->\r\n      @for (link of linkVms(); track link.key) {\r\n        <g class=\"fly-gantt__link-group\" [class.fly-gantt__link-group--selected]=\"selectedLinkKey() === link.key\">\r\n          <path\r\n            class=\"fly-gantt__link-hit\"\r\n            [attr.d]=\"link.path\"\r\n            [attr.aria-label]=\"link.ariaLabel\"\r\n            (click)=\"onLinkClick($event, link)\"\r\n          />\r\n          <path class=\"fly-gantt__link\" [attr.d]=\"link.path\" [attr.marker-end]=\"'url(#' + markerId + ')'\" />\r\n          @if (selectedLinkKey() === link.key && !readonly()) {\r\n            <g\r\n              class=\"fly-gantt__link-delete\"\r\n              [attr.transform]=\"'translate(' + link.badgeX + ',' + link.badgeY + ')'\"\r\n              [attr.aria-label]=\"'gantt.aria.delete_link' | translate\"\r\n              (click)=\"deleteLink($event, link)\"\r\n            >\r\n              <circle class=\"fly-gantt__link-delete-bg\" r=\"8\" />\r\n              <path class=\"fly-gantt__link-delete-x\" d=\"M-3.5,-3.5 L3.5,3.5 M3.5,-3.5 L-3.5,3.5\" />\r\n            </g>\r\n          }\r\n        </g>\r\n      }\r\n\r\n      <!-- In-flight link rubber band. -->\r\n      @if (linkGesturePath(); as gp) {\r\n        <path class=\"fly-gantt__link fly-gantt__link--ghost\" [attr.d]=\"gp\" [attr.marker-end]=\"'url(#' + markerId + ')'\" />\r\n      }\r\n\r\n      <!-- Today line (over the bars) \u2014 spans the WINDOW's y-extent, not the full spacer, since\r\n           the svg's own viewBox only covers `[svgTop, svgTop + svgHeight]` (memo \u00A74.3 point 3). -->\r\n      @if (todayX() !== null) {\r\n        <line class=\"fly-gantt__today\" [attr.x1]=\"todayX()\" [attr.y1]=\"svgTop()\" [attr.x2]=\"todayX()\" [attr.y2]=\"svgTop() + svgHeight()\" />\r\n      }\r\n    </svg>\r\n    </div>\r\n  </div>\r\n\r\n  @if (visibleRows().length === 0) {\r\n    <p class=\"fly-gantt__empty\">{{ 'gantt.no_data' | translate }}</p>\r\n  }\r\n  @if (overflowCount() > 0) {\r\n    <p class=\"fly-gantt__overflow\">\r\n      {{ 'gantt.overflow' | translate: { shown: maxRows(), total: maxRows() + overflowCount() } }}\r\n    </p>\r\n  }\r\n</div>\r\n\r\n<!-- Drag candidate tooltip (HTML overlay, follows the cursor). -->\r\n@if (dragTooltip(); as tip) {\r\n  <div class=\"fly-gantt__tooltip\" [style.left.px]=\"tip.x\" [style.top.px]=\"tip.y\">{{ tip.text }}</div>\r\n}\r\n", styles: [":host,:host *,:host *:before,:host *:after{box-sizing:border-box}:host{--_surface: var(--bg-2, var(--surface-card, #fff));--_surface-alt: var(--bg-3, var(--glass-bg-elevated, #f8fafc));--_surface-hover: var(--bg-hover, var(--surface-hover, #f1f5f9));--_border: var(--w08, var(--surface-border, #e2e8f0));--_border-strong: var(--w1, var(--surface-border, #cbd5e1));--_grid-line: var(--line-3, var(--surface-border, #eef2f7));--_text: var(--ink, var(--text-color, #0f172a));--_text-subtle: var(--ink-3, var(--text-color-secondary, #64748b));--_text-faint: var(--ink-4, var(--text-color-secondary, #94a3b8));--_accent: var(--accent);--_bar: var(--_accent);--_baseline: var(--fly-gantt-baseline, var(--ink-4, var(--text-color-secondary, #94a3b8)));--_bar-progress: color-mix(in srgb, var(--_accent) 72%, #000);--_weekend: color-mix(in srgb, var(--_text-subtle) 9%, transparent);--_today: var(--danger, #ef4444);--_link: var(--_text-subtle);--_radius: var(--r-lg, 8px);--_transition: var(--t-state, .12s ease);display:block;inline-size:100%;block-size:100%;min-block-size:200px;color:var(--_text);font-size:13px}:host(.fly-gantt--resizing){cursor:col-resize;-webkit-user-select:none;user-select:none}.fly-gantt__scroll{position:relative;inline-size:100%;block-size:100%;overflow:auto;border:1px solid var(--_border);border-radius:var(--_radius);background:var(--_surface);box-shadow:var(--shadow-card, none);outline:none}.fly-gantt__scroll:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:-2px}.fly-gantt__canvas{display:grid;position:relative}.fly-gantt__corner{position:sticky;inset-block-start:0;inset-inline-start:0;z-index:4;background:var(--_surface-alt);-webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);border-inline-end:1px solid var(--_border);border-block-end:1px solid var(--_border-strong)}.fly-gantt__time-header{position:sticky;inset-block-start:0;z-index:3;display:block;background:var(--_surface-alt);-webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);border-block-end:1px solid var(--_border-strong)}.fly-gantt__tick-line{stroke:var(--_grid-line);stroke-width:1}.fly-gantt__tick-label{fill:var(--_text-subtle);font-size:11px;text-anchor:middle;dominant-baseline:middle}.fly-gantt__tick-label--upper{fill:var(--_text);font-weight:600}.fly-gantt__splitter{position:absolute;inset-block:0;inset-inline-end:-3px;inline-size:7px;z-index:5;cursor:col-resize;touch-action:none}.fly-gantt__splitter:after{content:\"\";position:absolute;inset-block:0;inset-inline-start:3px;inline-size:1px;background:transparent;transition:background var(--_transition)}.fly-gantt__splitter:hover:after,.fly-gantt__splitter:focus-visible:after{background:var(--_accent)}.fly-gantt__splitter:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:-1px}:host(.fly-gantt--resizing) .fly-gantt__splitter:after{background:var(--_accent)}.fly-gantt__labels{position:sticky;inset-inline-start:0;z-index:2;background:var(--_surface);border-inline-end:1px solid var(--_border)}.fly-gantt__label-row{position:relative;display:flex;align-items:center;border-block-end:1px solid var(--_grid-line);cursor:pointer;transition:background var(--_transition)}.fly-gantt__label-row:hover{background:var(--_surface-hover)}.fly-gantt__label-row--selected{background:var(--_surface-hover);box-shadow:inset 3px 0 0 0 var(--_accent)}.fly-gantt__label-row--tinted:before{content:\"\";position:absolute;inset:0;background:var(--fly-gantt-row-tint);pointer-events:none}.fly-gantt__label-inner{position:relative;display:flex;align-items:center;gap:4px;inline-size:100%;min-inline-size:0;padding-inline-end:8px}.fly-gantt__label-swatch{flex:0 0 auto;inline-size:8px;block-size:8px;border-radius:2px}.fly-gantt__chevron{flex:0 0 auto;inline-size:18px;block-size:18px;padding:0;border:none;background:transparent;color:var(--_text-subtle);cursor:pointer;line-height:1;transform:rotate(90deg);transition:transform var(--_transition)}.fly-gantt__chevron--collapsed{transform:rotate(0)}:host(.fly-gantt--rtl) .fly-gantt__chevron--collapsed{transform:rotate(180deg)}.fly-gantt__chevron:focus-visible{outline:2px solid;outline-color:var(--_accent);outline-offset:1px;border-radius:4px}.fly-gantt__chevron-spacer{flex:0 0 auto;inline-size:18px}.fly-gantt__label-text{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fly-gantt__label-text--group{font-weight:600}.fly-gantt__label-cell-hidden{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.fly-gantt__body-cell{position:relative}.fly-gantt__body{position:absolute;inset-inline-start:0;display:block;touch-action:pan-x pan-y}.fly-gantt__row-band{pointer-events:none}.fly-gantt__weekend{fill:var(--_weekend)}.fly-gantt__grid-line{stroke:var(--_grid-line);stroke-width:1}.fly-gantt__row-hit{fill:transparent}.fly-gantt__row-hit--selected{fill:var(--_surface-hover)}.fly-gantt__bar{fill:var(--_bar);stroke:none}.fly-gantt__bar--editable{cursor:grab}.fly-gantt__progress{fill:var(--_bar-progress);pointer-events:none}.fly-gantt__handle{fill:transparent;cursor:ew-resize}.fly-gantt__connector{fill:var(--_surface);stroke:var(--_accent);stroke-width:1.5;cursor:crosshair;opacity:0;transition:opacity var(--_transition)}.fly-gantt__row:hover .fly-gantt__connector{opacity:1}.fly-gantt__milestone{fill:var(--_accent);stroke:var(--_surface);stroke-width:1}.fly-gantt__milestone--editable{cursor:grab}.fly-gantt__group{fill:var(--_text-subtle);stroke:var(--_text-subtle)}.fly-gantt__baseline-bar{fill:var(--_baseline);opacity:.55;pointer-events:none}.fly-gantt__baseline-milestone{fill:none;stroke:var(--_baseline);stroke-width:1.5;pointer-events:none}.fly-gantt__link{fill:none;stroke:var(--_link);stroke-width:1.5;pointer-events:none}.fly-gantt__link-hit{fill:none;stroke:transparent;stroke-width:11;pointer-events:stroke;cursor:pointer}.fly-gantt__link-group:hover .fly-gantt__link{stroke:var(--_text)}.fly-gantt__link-group--selected .fly-gantt__link{stroke:var(--_accent);stroke-width:2.5}.fly-gantt__link-delete-bg{fill:var(--_accent)}.fly-gantt__link-delete{cursor:pointer}.fly-gantt__link-delete-x{stroke:var(--_surface);stroke-width:1.75;stroke-linecap:round;fill:none;pointer-events:none}.fly-gantt__link--ghost{stroke-dasharray:4 3;opacity:.8}.fly-gantt__arrowhead{fill:var(--_link)}.fly-gantt__today{stroke:var(--_today);stroke-width:1.5;stroke-dasharray:3 3;pointer-events:none}.fly-gantt__empty,.fly-gantt__overflow{margin:0;padding:12px;color:var(--_text-faint);font-size:12px;text-align:center}.fly-gantt__tooltip{position:fixed;z-index:20;transform:translate(12px,16px);padding:4px 8px;border-radius:6px;background:var(--_text);color:var(--_surface);font-size:12px;white-space:nowrap;pointer-events:none;direction:ltr;unicode-bidi:isolate}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], dependencies: [{ type: i0.Input, args: [{ isSignal: true, alias: "dependencies", required: false }] }], zoom: [{ type: i0.Input, args: [{ isSignal: true, alias: "zoom", required: false }] }], showToday: [{ type: i0.Input, args: [{ isSignal: true, alias: "showToday", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], labelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelWidth", required: false }] }], resizableLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizableLabels", required: false }] }], rowHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowHeight", required: false }] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], collapsedIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsedIds", required: false }] }], overscanRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "overscanRows", required: false }] }], maxCanvasPx: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxCanvasPx", required: false }] }], virtualized: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualized", required: false }] }], showBaselines: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBaselines", required: false }] }], rowDatesChange: [{ type: i0.Output, args: ["rowDatesChange"] }], dependencyCreate: [{ type: i0.Output, args: ["dependencyCreate"] }], dependencyDelete: [{ type: i0.Output, args: ["dependencyDelete"] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], rowDblClick: [{ type: i0.Output, args: ["rowDblClick"] }], labelWidthChange: [{ type: i0.Output, args: ["labelWidthChange"] }], collapsedIdsChange: [{ type: i0.Output, args: ["collapsedIdsChange"] }], rowExpand: [{ type: i0.Output, args: ["rowExpand"] }], effectiveZoomChange: [{ type: i0.Output, args: ["effectiveZoomChange"] }], bodyRef: [{ type: i0.ViewChild, args: ['bodySvg', { isSignal: true }] }], scrollElRef: [{ type: i0.ViewChild, args: ['scrollEl', { isSignal: true }] }], canvasElRef: [{ type: i0.ViewChild, args: ['canvasEl', { isSignal: true }] }], labelsElRef: [{ type: i0.ViewChild, args: ['labelsEl', { isSignal: true }] }] } });
 
 // ── Bundled ISO 3166-1 country list ──────────────────────────────────────────
 // Ships with <fly-survey-form> so a `Country` question renders a searchable