@editora/ui-core 0.1.13 → 0.1.14

package/dist/gantt.cjs.js

@@ -1,157 +1,739 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const y=require("./ElementBase-1b301e7f.js"),d=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const Lt=require("./ElementBase-1b301e7f.js"),I=24*60*60*1e3,$=42,W=62,J=376,N=28,Ft=15,wt=Ft*Math.SQRT2/2,ht={day:36,week:13,month:4.4,quarter:2.2,year:1.15},mt=`
   :host {
-    --ui-gantt-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 95%, transparent);
-    --ui-gantt-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 74%, transparent);
+    --ui-gantt-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 96%, transparent);
+    --ui-gantt-panel: var(--ui-color-surface, #ffffff);
+    --ui-gantt-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 76%, transparent);
+    --ui-gantt-grid: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 56%, transparent);
     --ui-gantt-text: var(--ui-color-text, #0f172a);
     --ui-gantt-muted: var(--ui-color-muted, #64748b);
     --ui-gantt-accent: var(--ui-color-primary, #2563eb);
-
+    --ui-gantt-selected: color-mix(in srgb, var(--ui-gantt-accent) 10%, transparent);
     display: block;
     min-inline-size: 0;
     color-scheme: light dark;
     font-family: "Inter", "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
   }
 
+  *,
+  *::before,
+  *::after {
+    box-sizing: border-box;
+  }
+
   .frame {
     border: 1px solid var(--ui-gantt-border);
-    border-radius: 14px;
+    border-radius: 12px;
     background: var(--ui-gantt-bg);
-    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
-    padding: 12px;
-    display: grid;
-    gap: 10px;
+    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
+    overflow: hidden;
   }
 
-  .header {
+  .toolbar {
     display: flex;
+    align-items: center;
     justify-content: space-between;
-    gap: 8px;
-    font-size: 12px;
+    gap: 12px;
+    padding: 10px 12px;
+    border-bottom: 1px solid var(--ui-gantt-border);
+    background: color-mix(in srgb, var(--ui-gantt-panel) 92%, transparent);
+  }
+
+  .title {
+    min-inline-size: 0;
+    font-size: 13px;
+    font-weight: 750;
+    color: var(--ui-gantt-text);
+  }
+
+  .meta {
     color: var(--ui-gantt-muted);
+    font-weight: 600;
+    margin-inline-start: 8px;
+  }
+
+  .controls {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    flex-wrap: wrap;
+  }
+
+  .control,
+  .select,
+  .zoom-button {
+    border: 1px solid var(--ui-gantt-border);
+    background: var(--ui-gantt-panel);
+    color: var(--ui-gantt-text);
+    border-radius: 7px;
+    min-block-size: 30px;
+    font: inherit;
+    font-size: 12px;
+  }
+
+  .control {
+    inline-size: min(220px, 34vw);
+    padding: 0 9px;
+  }
+
+  .select {
+    padding: 0 28px 0 9px;
+    min-inline-size: 118px;
+  }
+
+  .zoom-button {
+    padding: 0 9px;
+    cursor: pointer;
+  }
+
+  .zoom-button[aria-pressed="true"] {
+    border-color: color-mix(in srgb, var(--ui-gantt-accent) 46%, var(--ui-gantt-border));
+    background: color-mix(in srgb, var(--ui-gantt-accent) 10%, var(--ui-gantt-panel));
+    color: var(--ui-gantt-accent);
+  }
+
+  .viewport {
+    overflow: auto;
+    max-block-size: var(--ui-gantt-max-height, 620px);
   }
 
-  .rows {
+  .surface {
     display: grid;
-    gap: 8px;
+    grid-template-columns: ${J}px minmax(640px, 1fr);
+    min-inline-size: 100%;
   }
 
-  .row {
+  .grid-head,
+  .timeline-head {
+    position: sticky;
+    top: 0;
+    z-index: 4;
+    min-block-size: 62px;
+    background: color-mix(in srgb, var(--ui-gantt-panel) 96%, transparent);
+    border-bottom: 1px solid var(--ui-gantt-border);
+  }
+
+  .grid-head {
+    left: 0;
+    z-index: 5;
     display: grid;
-    grid-template-columns: minmax(110px, 0.4fr) minmax(0, 1fr);
-    gap: 10px;
+    grid-template-columns: minmax(170px, 1fr) 82px 80px 44px;
+    border-right: 1px solid var(--ui-gantt-border);
+  }
+
+  .grid-head span,
+  .head-button,
+  .grid-cell {
+    display: flex;
     align-items: center;
+    min-inline-size: 0;
+    padding: 0 10px;
+    border-right: 1px solid color-mix(in srgb, var(--ui-gantt-border) 62%, transparent);
   }
 
-  .label {
-    font-size: 12px;
+  .grid-head span {
+    font-size: 11px;
+    font-weight: 750;
+    color: var(--ui-gantt-muted);
+    text-transform: uppercase;
+    letter-spacing: 0;
+  }
+
+  .head-button {
+    border: 0;
+    background: transparent;
+    color: var(--ui-gantt-muted);
+    cursor: pointer;
+    font: inherit;
+    font-size: 11px;
+    font-weight: 750;
+    text-align: left;
+    text-transform: uppercase;
+    letter-spacing: 0;
+  }
+
+  .head-button:hover,
+  .head-button[aria-sort]:not([aria-sort="none"]) {
+    color: var(--ui-gantt-accent);
+  }
+
+  .grid-head span:last-child,
+  .grid-cell:last-child {
+    border-right: 0;
+  }
+
+  .timeline-head {
+    position: sticky;
+    top: 0;
+    overflow: hidden;
+  }
+
+  .scale {
+    position: relative;
+    min-block-size: 62px;
+  }
+
+  .tick {
+    position: absolute;
+    inset-block: 0;
+    border-left: 1px solid var(--ui-gantt-grid);
+    padding: 9px 8px;
+    color: var(--ui-gantt-muted);
+    font-size: 11px;
+    font-weight: 650;
+    white-space: nowrap;
+  }
+
+  .grid-body {
+    position: sticky;
+    left: 0;
+    z-index: 3;
+    background: var(--ui-gantt-panel);
+    border-right: 1px solid var(--ui-gantt-border);
+  }
+
+  .timeline-body {
+    position: relative;
+    background:
+      linear-gradient(to right, var(--ui-gantt-grid) 1px, transparent 1px) 0 0 / var(--day-width) 100%,
+      color-mix(in srgb, var(--ui-gantt-panel) 98%, transparent);
+  }
+
+  .grid-row,
+  .timeline-row {
+    block-size: ${$}px;
+    border-bottom: 1px solid color-mix(in srgb, var(--ui-gantt-border) 56%, transparent);
+  }
+
+  .grid-row {
+    display: grid;
+    grid-template-columns: minmax(170px, 1fr) 82px 80px 44px;
     color: var(--ui-gantt-text);
-    font-weight: 600;
+    font-size: 12px;
+  }
+
+  .grid-row.selected,
+  .timeline-row.selected {
+    background: var(--ui-gantt-selected);
+  }
+
+  .task-name {
+    gap: 7px;
+    font-weight: 650;
+  }
+
+  .expander {
+    flex: 0 0 22px;
+    inline-size: 22px;
+    block-size: 22px;
+    border: 0;
+    border-radius: 6px;
+    background: transparent;
+    color: var(--ui-gantt-muted);
+    cursor: pointer;
+    display: grid;
+    place-items: center;
+    font-size: 13px;
+  }
+
+  .expander:hover {
+    background: color-mix(in srgb, var(--ui-gantt-accent) 9%, transparent);
+    color: var(--ui-gantt-accent);
+  }
+
+  .name-text {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
   }
 
-  .track {
+  .badge {
+    justify-content: center;
+    font-variant-numeric: tabular-nums;
+    color: var(--ui-gantt-muted);
+    font-size: 11px;
+  }
+
+  .timeline-row {
     position: relative;
-    border: 1px solid color-mix(in srgb, var(--ui-gantt-border) 72%, transparent);
-    border-radius: 999px;
-    background: color-mix(in srgb, var(--ui-gantt-bg) 90%, transparent);
-    min-block-size: 14px;
   }
 
   .bar {
     position: absolute;
-    top: 1px;
-    bottom: 1px;
-    border-radius: 999px;
-    background: var(--tone, var(--ui-gantt-accent));
-    box-shadow: 0 6px 14px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 26%, transparent);
+    top: 12px;
+    block-size: 18px;
+    min-inline-size: 10px;
+    border: 0;
+    border-radius: 4px;
+    background:
+      linear-gradient(180deg, color-mix(in srgb, #ffffff 22%, transparent), transparent 42%),
+      var(--tone, var(--ui-gantt-accent));
+    box-shadow:
+      0 4px 10px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 18%, transparent),
+      inset 0 0 0 1px color-mix(in srgb, #ffffff 20%, transparent);
+    cursor: grab;
     overflow: hidden;
+    outline: 0;
+    touch-action: none;
+    transition: box-shadow 140ms ease, filter 140ms ease, transform 140ms ease;
+    will-change: left, width;
+  }
+
+  .bar:hover,
+  .bar.dragging {
+    filter: saturate(1.08);
+    box-shadow:
+      0 6px 14px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 26%, transparent),
+      inset 0 0 0 1px color-mix(in srgb, #ffffff 30%, transparent);
+  }
+
+  .bar.dragging {
+    cursor: grabbing;
+    z-index: 5;
+    transform: translateY(-1px);
+  }
+
+  .bar:focus-visible {
+    outline: 2px solid var(--ui-gantt-accent);
+    outline-offset: 2px;
+  }
+
+  .bar.critical {
+    --tone: var(--ui-color-danger, #dc2626);
+    box-shadow:
+      0 5px 12px color-mix(in srgb, var(--ui-color-danger, #dc2626) 24%, transparent),
+      inset 0 0 0 1px color-mix(in srgb, #ffffff 28%, transparent);
+  }
+
+  .bar.split {
+    background: transparent;
+    box-shadow: none;
+    overflow: visible;
+  }
+
+  .bar.split .progress {
+    display: none;
+  }
+
+  .split-segment {
+    position: absolute;
+    inset-block: 0;
+    border-radius: 4px;
+    background:
+      linear-gradient(180deg, color-mix(in srgb, #ffffff 22%, transparent), transparent 42%),
+      var(--tone, var(--ui-gantt-accent));
+    box-shadow:
+      0 4px 10px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 18%, transparent),
+      inset 0 0 0 1px color-mix(in srgb, #ffffff 24%, transparent);
+  }
+
+  .baseline {
+    position: absolute;
+    top: 33px;
+    block-size: 4px;
+    border-radius: 999px;
+    background: color-mix(in srgb, var(--ui-gantt-muted) 54%, transparent);
+    z-index: 1;
+  }
+
+  .bar.summary {
+    block-size: 9px;
+    top: 17px;
+    border-radius: 3px;
+    background: color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 82%, #0f172a);
+  }
+
+  .bar.milestone {
+    inline-size: 28px !important;
+    min-inline-size: 28px;
+    block-size: 28px;
+    top: 7px;
+    border-radius: 8px;
+    background: transparent;
+    box-shadow: none;
+    cursor: grab;
+    overflow: visible;
+    display: grid;
+    place-items: center;
+  }
+
+  .bar.milestone:hover,
+  .bar.milestone.dragging {
+    box-shadow: none;
+  }
+
+  .milestone-shape {
+    inline-size: 15px;
+    block-size: 15px;
+    border-radius: 4px;
+    background:
+      linear-gradient(135deg, color-mix(in srgb, #ffffff 24%, transparent), transparent 48%),
+      var(--tone, var(--ui-gantt-accent));
+    box-shadow:
+      0 7px 18px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 28%, transparent),
+      inset 0 0 0 1px color-mix(in srgb, #ffffff 34%, transparent);
+    transform: rotate(45deg);
+    transition: transform 140ms ease, box-shadow 140ms ease, filter 140ms ease;
+  }
+
+  .bar.milestone:hover .milestone-shape,
+  .bar.milestone.dragging .milestone-shape {
+    filter: saturate(1.1);
+    transform: rotate(45deg) scale(1.08);
+    box-shadow:
+      0 10px 24px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 36%, transparent),
+      inset 0 0 0 1px color-mix(in srgb, #ffffff 44%, transparent);
+  }
+
+  .bar.milestone .progress,
+  .bar.milestone .handle,
+  .bar.summary .handle {
+    display: none;
   }
 
   .progress {
+    position: absolute;
+    inset-block: 0;
+    inset-inline-start: 0;
+    background: linear-gradient(90deg, color-mix(in srgb, #000 22%, transparent), transparent);
+    opacity: 0.3;
+    inline-size: var(--progress, 0%);
+  }
+
+  .handle {
+    position: absolute;
+    inset-block: 0;
+    inline-size: 14px;
+    cursor: ew-resize;
+    z-index: 2;
+    opacity: 0;
+    transition: opacity 120ms ease;
+  }
+
+  .handle.start {
+    inset-inline-start: 0;
+  }
+
+  .handle.end {
+    inset-inline-end: 0;
+  }
+
+  .handle::after {
+    content: "";
+    position: absolute;
+    inset-block-start: 50%;
+    inline-size: 4px;
+    block-size: 11px;
+    border-radius: 999px;
+    background: color-mix(in srgb, #ffffff 82%, transparent);
+    transform: translateY(-50%);
+  }
+
+  .handle.start::after {
+    inset-inline-start: 4px;
+  }
+
+  .handle.end::after {
+    inset-inline-end: 4px;
+  }
+
+  .bar:hover .handle,
+  .bar.dragging .handle {
+    opacity: 1;
+  }
+
+  .drag-tip {
+    position: absolute;
+    z-index: 6;
+    inset-block-start: -28px;
+    inset-inline-start: 50%;
+    transform: translateX(-50%);
+    padding: 4px 7px;
+    border-radius: 6px;
+    background: #0f172a;
+    color: #f8fafc;
+    font-size: 11px;
+    font-weight: 700;
+    white-space: nowrap;
+    pointer-events: none;
+    opacity: 0;
+  }
+
+  .bar.dragging .drag-tip {
+    opacity: 1;
+  }
+
+  :host([bar-variant="soft"]) .bar.task {
+    background:
+      linear-gradient(180deg, color-mix(in srgb, #ffffff 38%, transparent), transparent 46%),
+      color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 22%, var(--ui-gantt-panel));
+    color: var(--ui-gantt-text);
+    box-shadow:
+      inset 0 0 0 1px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 34%, transparent),
+      0 6px 15px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 14%, transparent);
+  }
+
+  :host([bar-variant="soft"]) .milestone-shape {
+    background:
+      linear-gradient(135deg, color-mix(in srgb, #ffffff 42%, transparent), transparent 52%),
+      color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 28%, var(--ui-gantt-panel));
+    box-shadow:
+      inset 0 0 0 1px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 42%, transparent),
+      0 7px 16px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 16%, transparent);
+  }
+
+  :host([bar-variant="striped"]) .bar.task {
+    background:
+      repeating-linear-gradient(135deg, color-mix(in srgb, #ffffff 24%, transparent) 0 7px, transparent 7px 14px),
+      var(--tone, var(--ui-gantt-accent));
+  }
+
+  :host([bar-variant="striped"]) .milestone-shape {
+    background:
+      repeating-linear-gradient(135deg, color-mix(in srgb, #ffffff 28%, transparent) 0 5px, transparent 5px 10px),
+      var(--tone, var(--ui-gantt-accent));
+  }
+
+  :host([bar-variant="outline"]) .bar.task {
+    background: color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 8%, var(--ui-gantt-panel));
+    box-shadow:
+      inset 0 0 0 1.5px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 72%, transparent),
+      0 6px 15px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 10%, transparent);
+  }
+
+  :host([bar-variant="outline"]) .bar.task .progress {
+    background: color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 28%, transparent);
+    opacity: 1;
+  }
+
+  :host([bar-variant="outline"]) .milestone-shape {
+    background: color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 10%, var(--ui-gantt-panel));
+    box-shadow:
+      inset 0 0 0 2px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 72%, transparent),
+      0 7px 16px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 10%, transparent);
+  }
+
+  :host([bar-variant="glass"]) .bar.task {
+    background:
+      linear-gradient(180deg, color-mix(in srgb, #ffffff 50%, transparent), color-mix(in srgb, #ffffff 10%, transparent)),
+      color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 72%, transparent);
+    backdrop-filter: blur(8px);
+    box-shadow:
+      inset 0 1px 0 color-mix(in srgb, #ffffff 48%, transparent),
+      inset 0 0 0 1px color-mix(in srgb, #ffffff 26%, transparent),
+      0 10px 24px color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 20%, transparent);
+  }
+
+  :host([bar-variant="glass"]) .milestone-shape {
+    background:
+      linear-gradient(135deg, color-mix(in srgb, #ffffff 52%, transparent), color-mix(in srgb, #ffffff 8%, transparent)),
+      color-mix(in srgb, var(--tone, var(--ui-gantt-accent)) 74%, transparent);
+    backdrop-filter: blur(8px);
+  }
+
+  .today {
+    position: absolute;
+    inset-block: 0;
+    inline-size: 2px;
+    background: var(--ui-color-danger, #dc2626);
+    z-index: 2;
+    pointer-events: none;
+  }
+
+  .today::before {
+    content: "Today";
+    position: absolute;
+    inset-block-start: 4px;
+    inset-inline-start: 6px;
+    color: var(--ui-color-danger, #dc2626);
+    font-size: 11px;
+    font-weight: 750;
+  }
+
+  .links {
     position: absolute;
     inset: 0;
-    background: linear-gradient(90deg, color-mix(in srgb, #000 18%, transparent), transparent);
-    opacity: 0.28;
-    width: var(--progress, 0%);
+    overflow: visible;
+    pointer-events: none;
+    z-index: 1;
+  }
+
+  .links path {
+    fill: none;
+    stroke: color-mix(in srgb, var(--ui-gantt-muted) 82%, transparent);
+    stroke-width: 1.35;
+    stroke-linecap: round;
+    stroke-linejoin: round;
+    vector-effect: non-scaling-stroke;
+    marker-end: url(#ui-gantt-arrow);
+  }
+
+  .links .link-hit {
+    stroke: transparent;
+    stroke-width: 10;
+    marker-end: none;
+    pointer-events: stroke;
+    cursor: pointer;
+  }
+
+  .links path:not(.link-hit) {
+    pointer-events: none;
+  }
+
+  .links marker path {
+    fill: color-mix(in srgb, var(--ui-gantt-muted) 82%, transparent);
+    stroke: none;
+  }
+
+  .empty {
+    padding: 28px;
+    color: var(--ui-gantt-muted);
+    font-size: 13px;
   }
 
   :host([variant="contrast"]) {
     --ui-gantt-bg: #0f172a;
+    --ui-gantt-panel: #111827;
     --ui-gantt-border: #334155;
+    --ui-gantt-grid: #263449;
     --ui-gantt-text: #e2e8f0;
     --ui-gantt-muted: #93a4bd;
-    --ui-gantt-accent: #93c5fd;
+    --ui-gantt-accent: #60a5fa;
+    --ui-gantt-selected: rgba(96, 165, 250, 0.13);
+  }
+
+  :host([readonly]) .bar {
+    cursor: pointer;
   }
 
   :host([headless]) .frame {
     display: none;
   }
 
-  @media (prefers-reduced-motion: reduce) {
-    .bar,
-    .progress {
-      transition: none !important;
+  @media (max-width: 760px) {
+    .surface {
+      grid-template-columns: 270px minmax(560px, 1fr);
     }
-  }
 
-  @media (prefers-contrast: more) {
-    .frame {
-      box-shadow: none;
+    .grid-head,
+    .grid-row {
+      grid-template-columns: minmax(150px, 1fr) 64px 56px;
     }
 
-    .track {
-      border-width: 2px;
+    .grid-head span:nth-child(3),
+    .grid-cell:nth-child(3) {
+      display: none;
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .bar,
+    .progress {
+      transition: none !important;
     }
   }
 
   @media (forced-colors: active) {
     :host {
       --ui-gantt-bg: Canvas;
+      --ui-gantt-panel: Canvas;
       --ui-gantt-border: CanvasText;
+      --ui-gantt-grid: CanvasText;
       --ui-gantt-text: CanvasText;
       --ui-gantt-muted: CanvasText;
       --ui-gantt-accent: Highlight;
+      --ui-gantt-selected: Highlight;
     }
 
     .frame,
-    .track,
+    .grid-head,
+    .timeline-head,
+    .grid-body,
     .bar,
-    .progress {
+    .select,
+    .control,
+    .zoom-button {
       forced-color-adjust: none;
       box-shadow: none;
-      border-color: CanvasText;
-    }
-
-    .frame,
-    .track {
-      background: Canvas;
-      color: CanvasText;
-    }
-
-    .bar {
-      background: Highlight;
     }
   }
-`,u={default:"var(--ui-color-primary, #2563eb)",info:"var(--ui-color-info, #0891b2)",success:"var(--ui-color-success, #16a34a)",warning:"var(--ui-color-warning, #d97706)",danger:"var(--ui-color-danger, #dc2626)"};function s(o){const e=Date.parse(o);return Number.isFinite(e)?e:null}function k(o){if(!o)return[];try{const e=JSON.parse(o);return Array.isArray(e)?e.map(t=>{if(!t||typeof t!="object")return null;const i=String(t.label||"").trim(),a=String(t.start||"").trim(),n=String(t.end||"").trim();return!i||!a||!n||s(a)==null||s(n)==null?null:{id:t.id?String(t.id):void 0,label:i,start:a,end:n,progress:Number.isFinite(Number(t.progress))?Number(t.progress):void 0,tone:t.tone}}).filter(Boolean):[]}catch{return[]}}class p extends y.ElementBase{static get observedAttributes(){return["tasks","variant","headless"]}render(){const e=k(this.getAttribute("tasks"));if(!e.length){this.setContent(`
-        <style>${d}</style>
+`,bt={default:"var(--ui-color-primary, #2563eb)",info:"var(--ui-color-info, #0891b2)",success:"var(--ui-color-success, #16a34a)",warning:"var(--ui-color-warning, #d97706)",danger:"var(--ui-color-danger, #dc2626)"};function f(n){return String(n??"").replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function x(n){if(n instanceof Date){const a=n.getTime();return Number.isFinite(a)?D(a):null}const r=String(n||"").trim(),d=/^(\d{4})-(\d{2})-(\d{2})$/.exec(r);if(d){const a=Number(d[1]),e=Number(d[2]),i=Number(d[3]),g=new Date(a,e-1,i).getTime();return Number.isFinite(g)?D(g):null}const l=Date.parse(r);return Number.isFinite(l)?D(l):null}function D(n){const r=new Date(n);return r.setHours(0,0,0,0),r.getTime()}function w(n,r){return D(n+r*I)}function S(n){const r=new Date(n),d=r.getFullYear(),l=String(r.getMonth()+1).padStart(2,"0"),a=String(r.getDate()).padStart(2,"0");return`${d}-${l}-${a}`}function O(n){return new Intl.DateTimeFormat(void 0,{month:"short",day:"numeric"}).format(new Date(n))}function ft(n){return n==="day"||n==="month"||n==="quarter"||n==="year"?n:"week"}function j(n){return n==="start"||n==="end"||n==="label"||n==="progress"?n:"none"}function Dt(n){return n==="soft"||n==="striped"||n==="outline"||n==="glass"?n:"solid"}function Rt(n,r){if(!n)return[];try{const d=JSON.parse(n);return Array.isArray(d)?d.map((l,a)=>{if(!l||typeof l!="object")return null;const e=l,i=String(e.label||e.text||"").trim(),s=x(e.start),g=Number(e.duration);let c=x(e.end);if(c==null&&s!=null&&Number.isFinite(g)&&(c=w(s,Math.max(0,g))),!i||s==null)return null;const o=e.type==="summary"||e.type==="milestone"?e.type:"task",u=o==="milestone"?s:Math.max(c??w(s,1),w(s,1)),p=String(e.id||`task-${a+1}`),m=r.get(p)||{};return{id:p,label:i,start:m.start||S(s),end:m.end||S(u),progress:Number.isFinite(Number(e.progress))?Math.max(0,Math.min(100,Number(e.progress))):void 0,tone:typeof e.tone=="string"?e.tone:void 0,type:o,parent:e.parent!=null?String(e.parent):void 0,open:e.open!==!1,assignee:e.assignee!=null?String(e.assignee):e.owner!=null?String(e.owner):void 0,readonly:e.readonly===!0,baselineStart:e.baselineStart!=null?String(e.baselineStart):void 0,baselineEnd:e.baselineEnd!=null?String(e.baselineEnd):void 0,critical:e.critical===!0,segments:Array.isArray(e.segments)?e.segments:void 0}}).filter(Boolean):[]}catch{return[]}}function qt(n){if(!n)return[];try{const r=JSON.parse(n);return Array.isArray(r)?r.map((d,l)=>{if(!d||typeof d!="object")return null;const a=d,e=String(a.source||"").trim(),i=String(a.target||"").trim();if(!e||!i)return null;const s=a.type==="s2s"||a.type==="e2e"||a.type==="s2e"?a.type:"e2s";return{id:String(a.id||`link-${l+1}`),source:e,target:i,type:s}}).filter(Boolean):[]}catch{return[]}}function Nt(n,r){return r==="none"?n:[...n].sort((d,l)=>{if(r==="label")return d.label.localeCompare(l.label);if(r==="progress")return Number(l.progress??0)-Number(d.progress??0);const a=x(r==="start"?d.start:d.end)??0,e=x(r==="start"?l.start:l.end)??0;return a-e})}function Ht(n,r,d,l){const a=new Map,e=new Map(n.map(o=>[o.id,o]));n.forEach(o=>{const u=o.parent&&e.has(o.parent)?o.parent:"__root__",p=a.get(u)||[];p.push(o),a.set(u,p)});const i=d.trim().toLowerCase(),s=o=>!i||o.label.toLowerCase().includes(i)||(o.assignee||"").toLowerCase().includes(i)?!0:(a.get(o.id)||[]).some(s),g=[],c=(o,u)=>{Nt(a.get(o)||[],l).forEach(p=>{if(!s(p))return;const m=x(p.start),h=x(p.end);if(m==null||h==null)return;const b=(a.get(p.id)||[]).length>0;g.push({...p,depth:u,hasChildren:b,startMs:m,endMs:h}),b&&!r.has(p.id)&&c(p.id,u+1)})};return c("__root__",0),g}function _t(n,r,d,l,a=0,e=Number.POSITIVE_INFINITY){const i=Math.max(1,Math.ceil((r-n)/I)),s=l==="day"?1:l==="week"?7:l==="month"?30:l==="quarter"?91:365,g=Math.max(0,Math.floor(Math.max(0,a-480)/d/s)*s),c=Math.min(i,Math.ceil((a+e+960)/d/s)*s),o=[];for(let u=g;u<=c;u+=s){const p=u*d,m=w(n,u),h=l==="day"?O(m):new Intl.DateTimeFormat(void 0,{month:"short",year:l==="week"||l==="month"?void 0:"numeric"}).format(new Date(m));o.push(`<span class="tick" style="left:${p.toFixed(2)}px">${f(h)}</span>`)}return o.join("")}function H(n){return n.type==="summary"||n.hasChildren?"summary":n.type==="milestone"||n.startMs===n.endMs?"milestone":"task"}function xt(n){const r=H(n);return r==="summary"?17+9/2:r==="milestone"?7+N/2:12+18/2}function Vt(n,r){return H(n)==="milestone"?r(n.startMs)-wt:r(n.startMs)}function Wt(n,r){return H(n)==="milestone"?r(n.startMs)+wt:r(n.endMs)}function vt(n,r,d){return r==="start"?Vt(n,d):Wt(n,d)}function jt(n="e2s"){return n==="s2s"?{source:"start",target:"start"}:n==="e2e"?{source:"end",target:"end"}:n==="s2e"?{source:"start",target:"end"}:{source:"end",target:"start"}}function Ot(n,r,d,l,a,e){const i=jt(a),s=i.source==="start"?-1:1,g=i.target==="start"?1:-1,c=vt(n,i.source,e),o=vt(d,i.target,e),u=r*$+xt(n),p=l*$+xt(d),m=22,h=c+s*m,b=o-g*m,v=26;let y=(h+b)/2;if(s===g){const T=s===1?Math.max(h,b,c,o)+v:Math.min(h,b,c,o)-v;y=(s===1?b>h+v:b<h-v)?y:T}else(s===1?b<h:b>h)&&(y=s===1?Math.max(h,c,o)+v:Math.min(h,c,o)-v);const A=Math.abs(p-u)<1?i.target==="start"?p-16:p+16:p>u?p-$/2+3:p+$/2-3;return[[c,u],[h,u],[y,u],[y,A],[b,A],[b,p],[o,p]].map(([T,R],P)=>`${P===0?"M":"L"} ${T.toFixed(1)} ${R.toFixed(1)}`).join(" ")}class yt extends Lt.ElementBase{constructor(){super(...arguments),this.collapsed=new Set,this.overrides=new Map,this.drag=null,this.selectedId=null,this.internalFilter="",this.viewportTop=0,this.viewportLeft=0,this.viewportWidth=1800,this.viewportHeight=620,this.renderedFirstRow=0,this.renderedLastRow=0,this.scrollFrame=null,this.overridesVersion=0,this.taskCacheRaw=null,this.taskCacheVersion=-1,this.taskCache=[],this.linkCacheRaw=null,this.linkCache=[],this.visibleCacheKey="",this.visibleCache=[]}static get observedAttributes(){return["tasks","links","zoom","filter","sort","bar-variant","variant","readonly","show-toolbar","show-today","headless"]}render(){const r=this.getTasks(),d=this.getLinks(),l=ft(this.getAttribute("zoom")),a=j(this.getAttribute("sort")),e=Dt(this.getAttribute("bar-variant")),i=this.getAttribute("filter")??this.internalFilter,s=this.getVisibleTasks(r,i,a),g=this.hasAttribute("readonly"),c=this.getAttribute("show-toolbar")!=="false",o=this.getAttribute("show-today")!=="false";if(!r.length){this.setContent(`
+        <style>${mt}</style>
         <section class="frame" part="frame">
-          <div class="header">No tasks in this range</div>
+          <div class="empty" part="empty">No tasks in this range</div>
         </section>
-      `);return}const t=e.map(r=>s(r.start)||0),i=e.map(r=>s(r.end)||0),a=Math.min(...t),n=Math.max(...i),c=Math.max(1,n-a),g=e.map(r=>{const l=s(r.start)||a,f=s(r.end)||l,x=(l-a)/c*100,v=Math.max(2,(Math.max(f,l)-l)/c*100),h=Math.max(0,Math.min(100,Number(r.progress??0))),w=u[r.tone||"default"]||u.default;return`
-          <article class="row" part="row">
-            <span class="label" title="${r.label}">${r.label}</span>
-            <div class="track">
-              <div class="bar" style="left:${x.toFixed(2)}%;width:${v.toFixed(2)}%;--tone:${w}">
-                <span class="progress" style="--progress:${h.toFixed(2)}%"></span>
-              </div>
+      `);return}const u=r.map(t=>x(t.start)).filter(t=>t!=null),p=r.map(t=>x(t.end)).filter(t=>t!=null),m=w(Math.min(...u),-2),h=w(Math.max(...p),3),b=Math.max(7,Math.ceil((h-m)/I)),v=ht[l],y=Math.max(680,b*v),A=Math.max(s.length*$,$),z=this.getAttribute("virtualized")!=="false"&&s.length>240,T=Math.max(20,Math.ceil(Math.max(420,this.viewportHeight-W)/$)),R=160,P=Math.max(0,this.viewportTop-W),kt=Math.max(0,Math.floor(P/$)),X=Math.max(180,T*4),L=z?Math.max(0,Math.floor(kt/X)*X-R):0,B=z?Math.min(s.length,L+T+R*2+X):s.length,K=s.slice(L,B),_=L*$,V=Math.max(0,(s.length-B)*$);this.renderedFirstRow=L,this.renderedLastRow=B;const Q=new Map(s.map((t,M)=>[t.id,{task:t,index:M}])),tt=new Set(K.map(t=>t.id)),C=t=>(t-m)/I*v,$t=K.map((t,M)=>{const E=L+M,k=this.selectedId===t.id?" selected":"",F=H(t),G=t.progress==null?"-":`${Math.round(t.progress)}%`,U=F==="milestone"?O(t.startMs):`${O(t.startMs)} - ${O(t.endMs)}`;return`
+        <article class="grid-row${k}" part="grid-row" data-task-id="${f(t.id)}" role="row" aria-rowindex="${E+2}" aria-level="${t.depth+1}" ${t.hasChildren?`aria-expanded="${!this.collapsed.has(t.id)}"`:""}>
+          <div class="grid-cell task-name" role="gridcell" style="padding-left:${10+t.depth*18}px">
+            ${t.hasChildren?`<button class="expander" data-action="toggle" data-task-id="${f(t.id)}" aria-label="${this.collapsed.has(t.id)?"Expand":"Collapse"} ${f(t.label)}">${this.collapsed.has(t.id)?"›":"⌄"}</button>`:'<span style="inline-size:22px"></span>'}
+            <span class="name-text" title="${f(t.label)}">${f(t.label)}</span>
+          </div>
+          <div class="grid-cell badge" role="gridcell">${f(t.assignee||F)}</div>
+          <div class="grid-cell badge" role="gridcell">${f(U)}</div>
+          <div class="grid-cell badge" role="gridcell">${f(G)}</div>
+        </article>
+      `}).join(""),Mt=K.map((t,M)=>{var st;const E=L+M,k=H(t),F=this.selectedId===t.id?" selected":"",G=this.selectedId===t.id||!this.selectedId&&E===0,U=bt[t.tone||(k==="summary"?"info":"default")]||bt.default,rt=k==="milestone"?C(t.startMs)-N/2:C(t.startMs),Ct=C(k==="milestone"?t.startMs:t.endMs),Tt=k==="milestone"?N:Math.max(12,Ct-rt),It=Math.max(0,Math.min(100,Number(t.progress??0))),at=!g&&!t.readonly&&k!=="summary",nt=at&&k==="task",it=k==="task"&&((st=t.segments)!=null&&st.length)?t.segments.map(ot=>{const lt=x(ot.start),dt=x(ot.end);if(lt==null||dt==null)return"";const ct=Math.max(I,t.endMs-t.startMs),Z=Math.max(t.startMs,lt),pt=Math.min(t.endMs,dt);if(pt<=Z)return"";const ut=Math.max(0,Math.min(100,(Z-t.startMs)/ct*100)),At=(pt-Z)/ct*100,gt=Math.min(100-ut,Math.max(1,At));return gt<=0?"":`<span class="split-segment" style="left:${ut.toFixed(2)}%;width:${gt.toFixed(2)}%"></span>`}).join(""):"";return`
+        <article class="timeline-row${F}" part="timeline-row" data-task-id="${f(t.id)}" role="row" aria-rowindex="${E+2}">
+          ${t.baselineStart&&t.baselineEnd?`<span class="baseline" style="left:${C(x(t.baselineStart)||t.startMs).toFixed(2)}px;width:${Math.max(4,C(x(t.baselineEnd)||t.endMs)-C(x(t.baselineStart)||t.startMs)).toFixed(2)}px"></span>`:""}
+          <button
+            class="bar ${k}${t.critical?" critical":""}${it?" split":""}"
+            part="bar ${k}"
+            data-task-id="${f(t.id)}"
+            data-kind="${k}"
+            role="gridcell"
+            tabindex="${G?"0":"-1"}"
+            aria-selected="${this.selectedId===t.id}"
+            aria-colindex="5"
+            style="left:${rt.toFixed(2)}px;width:${Tt.toFixed(2)}px;--tone:${U};--progress:${It.toFixed(2)}%"
+            aria-label="${f(t.label)}"
+            ${at?'data-draggable="true"':""}
+          >
+            ${nt?'<span class="handle start" data-mode="resize-start"></span>':""}
+            <span class="progress"></span>
+            ${it}
+            ${k==="milestone"?'<span class="milestone-shape"></span>':""}
+            <span class="drag-tip"></span>
+            ${nt?'<span class="handle end" data-mode="resize-end"></span>':""}
+          </button>
+        </article>
+      `}).join(""),et=d.map(t=>{const M=Q.get(t.source),E=Q.get(t.target);if(!M||!E||z&&!tt.has(t.source)&&!tt.has(t.target))return"";const k=Ot(M.task,M.index,E.task,E.index,t.type,C),F=`${M.task.label} dependency to ${E.task.label}`;return`<path class="link-hit" d="${k}" data-link-id="${f(t.id)}" data-source-id="${f(t.source)}" data-target-id="${f(t.target)}" data-link-type="${f(t.type||"e2s")}" aria-label="${f(F)}" /><path d="${k}" />`}).join(""),Et=et?'<defs><marker id="ui-gantt-arrow" markerWidth="9" markerHeight="9" refX="8.5" refY="4.5" orient="auto" markerUnits="userSpaceOnUse"><path d="M 0.5 0.75 L 8.5 4.5 L 0.5 8.25 z" /></marker></defs>':"",Y=D(Date.now()),St=C(Y),zt=o&&Y>=m&&Y<=h?`<div class="today" part="today" style="left:${St.toFixed(2)}px"></div>`:"";this.setContent(`
+      <style>${mt}</style>
+      <section class="frame" part="frame" data-bar-variant="${e}">
+        ${c?`
+          <header class="toolbar" part="toolbar">
+            <div class="title">Project schedule <span class="meta">${s.length}/${r.length} tasks</span></div>
+            <div class="controls">
+              <input class="control" value="${f(i)}" placeholder="Filter tasks" aria-label="Filter tasks" />
+              <select class="select" aria-label="Sort tasks">
+                ${[["none","Manual"],["start","Start date"],["end","End date"],["label","Name"],["progress","Progress"]].map(([t,M])=>`<option value="${t}" ${a===t?"selected":""}>${M}</option>`).join("")}
+              </select>
+              ${["day","week","month","quarter","year"].map(t=>`<button class="zoom-button" data-zoom="${t}" aria-pressed="${l===t}">${t}</button>`).join("")}
+            </div>
+          </header>
+        `:""}
+        <div class="viewport" part="viewport">
+          <div class="surface" part="surface" style="--day-width:${v}px;grid-template-columns:${J}px ${y.toFixed(2)}px;inline-size:max(100%, ${(J+y).toFixed(2)}px)">
+            <header class="grid-head" part="grid-head" role="row">
+              <button class="head-button" data-sort="label" role="columnheader" aria-sort="${a==="label"?"ascending":"none"}">Task</button>
+              <span role="columnheader">Owner</span>
+              <button class="head-button" data-sort="start" role="columnheader" aria-sort="${a==="start"?"ascending":"none"}">Dates</button>
+              <button class="head-button" data-sort="progress" role="columnheader" aria-sort="${a==="progress"?"descending":"none"}">%</button>
+            </header>
+            <header class="timeline-head" part="timeline-head">
+              <div class="scale" style="width:${y.toFixed(2)}px">${_t(m,h,v,l,this.viewportLeft,this.viewportWidth)}</div>
+            </header>
+            <div class="grid-body" part="grid-body" role="treegrid" aria-rowcount="${s.length+1}" aria-colcount="4">
+              ${z&&_?`<div style="height:${_}px"></div>`:""}
+              ${$t||'<div class="empty">No matching tasks</div>'}
+              ${z&&V?`<div style="height:${V}px"></div>`:""}
+            </div>
+            <div class="timeline-body" part="timeline-body" style="width:${y.toFixed(2)}px;min-height:${A}px">
+              <svg class="links" width="${y.toFixed(0)}" height="${A}" viewBox="0 0 ${y.toFixed(0)} ${A}" aria-hidden="true">${Et}${et}</svg>
+              ${zt}
+              ${z&&_?`<div style="height:${_}px"></div>`:""}
+              ${Mt}
+              ${z&&V?`<div style="height:${V}px"></div>`:""}
             </div>
-          </article>
-        `}).join(""),m=new Date(a).toLocaleDateString(),b=new Date(n).toLocaleDateString();this.setContent(`
-      <style>${d}</style>
-      <section class="frame" part="frame">
-        <header class="header" part="header"><span>${m}</span><span>${b}</span></header>
-        <div class="rows" part="rows">${g}</div>
+          </div>
+        </div>
       </section>
-    `)}shouldRenderOnAttributeChange(e,t,i){return!0}}typeof customElements<"u"&&!customElements.get("ui-gantt")&&customElements.define("ui-gantt",p);exports.UIGantt=p;
+    `);const q=this.root.querySelector(".viewport");q&&(q.scrollTop=this.viewportTop,q.scrollLeft=this.viewportLeft,this.viewportWidth=q.clientWidth||this.viewportWidth,this.viewportHeight=q.clientHeight||this.viewportHeight),this.bindEvents()}bindEvents(){var r,d,l;this.root.querySelectorAll("[data-task-id]").forEach(a=>{a.addEventListener("click",e=>{var o;const i=e.target,s=e.currentTarget;if(!s.classList.contains("bar")&&i.closest(".bar"))return;if((o=this.drag)!=null&&o.moved){e.stopPropagation();return}const c=e.currentTarget.dataset.taskId;c&&(i.closest('[data-action="toggle"]')||(s.classList.contains("bar")&&e.stopPropagation(),this.selectTask(c)))})}),this.root.querySelectorAll('[data-action="toggle"]').forEach(a=>{a.addEventListener("click",e=>{e.stopPropagation();const i=a.dataset.taskId;i&&(this.collapsed.has(i)?this.collapsed.delete(i):this.collapsed.add(i),this.requestRender())})}),this.root.querySelectorAll("[data-zoom]").forEach(a=>{a.addEventListener("click",()=>{const e=a.dataset.zoom||"week";this.setAttribute("zoom",e),this.dispatchEvent(new CustomEvent("zoomchange",{detail:{zoom:e},bubbles:!0,composed:!0}))})}),this.root.querySelectorAll(".head-button[data-sort]").forEach(a=>{a.addEventListener("click",()=>{const e=j(a.dataset.sort||null);e==="none"?this.removeAttribute("sort"):this.setAttribute("sort",e),this.dispatchEvent(new CustomEvent("sortchange",{detail:{sort:e},bubbles:!0,composed:!0}))})}),(r=this.root.querySelector(".viewport"))==null||r.addEventListener("scroll",a=>{const e=a.currentTarget,i=e.scrollTop,s=e.scrollLeft,g=Math.max(20,Math.ceil(Math.max(420,this.viewportHeight-W)/$)),c=Math.max(0,Math.floor(Math.max(0,i-W)/$)),o=c<this.renderedFirstRow+64||c+g>this.renderedLastRow-64,u=Math.abs(s-this.viewportLeft)>=Math.max(480,this.viewportWidth*.6);this.viewportTop=i,this.viewportLeft=s,!(!o&&!u)&&this.scrollFrame==null&&(this.scrollFrame=window.setTimeout(()=>{this.scrollFrame=null,this.requestRender()},24))},{passive:!0}),(d=this.root.querySelector(".control"))==null||d.addEventListener("input",a=>{this.internalFilter=a.currentTarget.value,this.dispatchEvent(new CustomEvent("filterchange",{detail:{filter:this.internalFilter},bubbles:!0,composed:!0})),this.requestRender()}),(l=this.root.querySelector(".select"))==null||l.addEventListener("change",a=>{const e=j(a.currentTarget.value);e==="none"?this.removeAttribute("sort"):this.setAttribute("sort",e),this.dispatchEvent(new CustomEvent("sortchange",{detail:{sort:e},bubbles:!0,composed:!0}))}),this.root.querySelectorAll(".link-hit").forEach(a=>{a.addEventListener("click",e=>{e.stopPropagation(),this.dispatchEvent(new CustomEvent("linkselect",{detail:{id:a.dataset.linkId||"",source:a.dataset.sourceId||"",target:a.dataset.targetId||"",type:a.dataset.linkType||"e2s"},bubbles:!0,composed:!0}))})}),!this.hasAttribute("readonly")&&this.root.querySelectorAll('.bar[data-draggable="true"]').forEach(a=>{a.addEventListener("pointerdown",i=>{if(i.button!==0)return;const s=a.dataset.taskId;if(!s)return;const c=this.getTasks().find(y=>y.id===s),o=x(c==null?void 0:c.start),u=x(c==null?void 0:c.end);if(!c||o==null||u==null)return;i.preventDefault();const p=a.dataset.kind||"task",m=i.target.dataset.mode||"move",h=p==="milestone"?"move":m,b=ft(this.getAttribute("zoom")),v=this.selectedId!==s;this.selectedId=s,this.dispatchEvent(new CustomEvent("taskselect",{detail:{id:s},bubbles:!0,composed:!0})),this.drag={taskId:s,mode:h,startX:i.clientX,originalStart:o,originalEnd:u,kind:p,rangeMin:this.rangeMin(),dayWidth:ht[b],latestStart:o,latestEnd:u,frame:null,bar:a,moved:!1,selectedChanged:v},a.classList.add("dragging"),a.setPointerCapture(i.pointerId)}),a.addEventListener("pointermove",i=>{if(!this.drag||this.drag.taskId!==a.dataset.taskId)return;i.preventDefault();const s=i.clientX-this.drag.startX;Math.abs(s)>2&&(this.drag.moved=!0);let g=this.drag.originalStart,c=this.drag.originalEnd;if(this.drag.mode==="move"){const o=Math.round(s/this.drag.dayWidth);g=w(this.drag.originalStart,o),c=this.drag.kind==="milestone"?g:w(this.drag.originalEnd,o)}else if(this.drag.mode==="resize-start"){const o=Math.round(s/this.drag.dayWidth);g=Math.min(w(this.drag.originalStart,o),w(c,-1))}else{const o=Math.round(s/this.drag.dayWidth);c=Math.max(w(this.drag.originalEnd,o),w(g,1))}this.drag.latestStart=g,this.drag.latestEnd=c,this.drag.frame==null&&(this.drag.frame=requestAnimationFrame(()=>{if(!this.drag)return;this.drag.frame=null;const o=(this.drag.latestStart-this.drag.rangeMin)/I*this.drag.dayWidth-(this.drag.kind==="milestone"?N/2:0),u=this.drag.kind==="milestone"?N:Math.max(12,(this.drag.latestEnd-this.drag.latestStart)/I*this.drag.dayWidth);this.drag.bar.style.left=`${o.toFixed(2)}px`,this.drag.bar.style.width=`${u.toFixed(2)}px`;const p=this.drag.bar.querySelector(".drag-tip");p&&(p.textContent=this.drag.kind==="milestone"?S(this.drag.latestStart):`${S(this.drag.latestStart)} - ${S(this.drag.latestEnd)}`)}))});const e=()=>{if(!this.drag)return;this.drag.frame!=null&&cancelAnimationFrame(this.drag.frame);const i=this.drag;if(i.bar.classList.remove("dragging"),this.drag=null,!i.moved){i.selectedChanged&&this.requestRender();return}const s={id:i.taskId,start:S(i.latestStart),end:S(i.latestEnd)};this.overrides.set(i.taskId,{start:s.start,end:s.end}),this.bumpOverrides(),this.dispatchEvent(new CustomEvent("taskchange",{detail:s,bubbles:!0,composed:!0})),this.requestRender()};a.addEventListener("pointerup",e),a.addEventListener("pointercancel",e),a.addEventListener("keydown",i=>{const s=a.dataset.taskId;if(!s)return;if(i.key==="Delete"||i.key==="Backspace"){i.preventDefault(),this.dispatchEvent(new CustomEvent("taskdelete",{detail:{id:s},bubbles:!0,composed:!0}));return}if(i.key==="Enter"||i.key===" "){i.preventDefault(),this.selectTask(s);return}if(i.key==="ArrowUp"||i.key==="ArrowDown"){i.preventDefault(),this.selectAdjacentTask(s,i.key==="ArrowDown"?1:-1);return}if(i.key!=="ArrowLeft"&&i.key!=="ArrowRight")return;const c=this.getTasks().find(y=>y.id===s),o=x(c==null?void 0:c.start),u=x(c==null?void 0:c.end);if(!c||o==null||u==null)return;i.preventDefault();const p=i.key==="ArrowLeft"?-1:1,m=a.dataset.kind==="milestone",h=i.shiftKey&&!m?o:w(o,p),b=m?h:i.shiftKey?Math.max(w(u,p),w(o,1)):w(u,p),v={id:s,start:S(h),end:S(b)};this.overrides.set(s,{start:v.start,end:v.end}),this.bumpOverrides(),this.dispatchEvent(new CustomEvent("taskchange",{detail:v,bubbles:!0,composed:!0})),this.requestRender()})})}rangeMin(){const d=this.getTasks().map(l=>x(l.start)).filter(l=>l!=null);return d.length?w(Math.min(...d),-2):D(Date.now())}selectTask(r){if(this.captureViewport(),this.selectedId===r){this.dispatchEvent(new CustomEvent("taskselect",{detail:{id:r},bubbles:!0,composed:!0}));return}this.selectedId=r,this.dispatchEvent(new CustomEvent("taskselect",{detail:{id:r},bubbles:!0,composed:!0})),this.requestRender()}selectAdjacentTask(r,d){const l=this.getVisibleTasks(this.getTasks(),this.getAttribute("filter")??this.internalFilter,j(this.getAttribute("sort"))),a=l.findIndex(i=>i.id===r),e=l[Math.max(0,Math.min(l.length-1,a+d))];!e||e.id===r||(this.selectedId=e.id,this.dispatchEvent(new CustomEvent("taskselect",{detail:{id:e.id},bubbles:!0,composed:!0})),this.requestRender(),window.requestAnimationFrame(()=>{var i;(i=this.root.querySelector(`.bar[data-task-id="${CSS.escape(e.id)}"]`))==null||i.focus()}))}captureViewport(){const r=this.root.querySelector(".viewport");r&&(this.viewportTop=r.scrollTop,this.viewportLeft=r.scrollLeft,this.viewportWidth=r.clientWidth||this.viewportWidth,this.viewportHeight=r.clientHeight||this.viewportHeight)}getTasks(){const r=this.getAttribute("tasks");return r===this.taskCacheRaw&&this.taskCacheVersion===this.overridesVersion?this.taskCache:(this.taskCacheRaw=r,this.taskCacheVersion=this.overridesVersion,this.taskCache=Rt(r,this.overrides),this.visibleCacheKey="",this.taskCache)}getLinks(){const r=this.getAttribute("links");return r===this.linkCacheRaw?this.linkCache:(this.linkCacheRaw=r,this.linkCache=qt(r),this.linkCache)}getVisibleTasks(r,d,l){const a=Array.from(this.collapsed).sort().join(","),e=`${this.taskCacheRaw||""}|${this.overridesVersion}|${d}|${l}|${a}`;return e===this.visibleCacheKey?this.visibleCache:(this.visibleCacheKey=e,this.visibleCache=Ht(r,this.collapsed,d,l),this.visibleCache)}bumpOverrides(){this.overridesVersion+=1,this.taskCacheVersion=-1,this.visibleCacheKey=""}shouldRenderOnAttributeChange(r,d,l){return r==="tasks"&&(this.overrides.clear(),this.bumpOverrides(),this.viewportTop=0,this.viewportLeft=0),r==="links"&&(this.linkCacheRaw=null),!0}}typeof customElements<"u"&&!customElements.get("ui-gantt")&&customElements.define("ui-gantt",yt);exports.UIGantt=yt;