@shipfox/client-workflows 0.2.0

package/dist/components/job-graph/graph-model.js

@@ -0,0 +1,107 @@
+export function buildJobGraphModel({ run }) {
+    const sortedJobs = [
+        ...run.jobs
+    ].sort(compareJobs);
+    const byKey = new Map(sortedJobs.map((job)=>[
+            job.key,
+            job
+        ]));
+    const columnMemo = new Map();
+    function columnFor(job, visiting = new Set()) {
+        const cached = columnMemo.get(job.id);
+        if (cached !== undefined) return cached;
+        if (visiting.has(job.id)) return 0;
+        const nextVisiting = new Set(visiting);
+        nextVisiting.add(job.id);
+        const dependencyColumns = job.dependencies.map((dependencyKey)=>byKey.get(dependencyKey)).filter((dependency)=>dependency !== undefined).map((dependency)=>columnFor(dependency, nextVisiting));
+        const column = dependencyColumns.length === 0 ? 0 : Math.max(...dependencyColumns) + 1;
+        columnMemo.set(job.id, column);
+        return column;
+    }
+    const nodesWithoutRows = sortedJobs.map((job)=>jobGraphNode(job, {
+            column: columnFor(job),
+            row: 0,
+            currentDependencyCount: currentDependencyCount(job, byKey)
+        }));
+    const grouped = groupColumns(nodesWithoutRows);
+    const nodes = grouped.flat();
+    const edges = buildEdges(sortedJobs, byKey);
+    return {
+        nodes,
+        edges,
+        columns: grouped
+    };
+}
+function compareJobs(left, right) {
+    return left.position - right.position || (left.name ?? left.key).localeCompare(right.name ?? right.key) || left.id.localeCompare(right.id);
+}
+function groupColumns(nodes) {
+    const byColumn = new Map();
+    for (const node of nodes){
+        const column = byColumn.get(node.column) ?? [];
+        column.push(node);
+        byColumn.set(node.column, column);
+    }
+    return [
+        ...byColumn.entries()
+    ].sort(([left], [right])=>left - right).map(([, column])=>column.sort((left, right)=>left.position - right.position || (left.name ?? left.key).localeCompare(right.name ?? right.key) || left.id.localeCompare(right.id)).map((node, row)=>jobGraphNode(node, {
+                ...node,
+                row
+            })));
+}
+function buildEdges(jobs, byKey) {
+    const triggerEdges = jobs.filter((job)=>job.dependencies.length === 0).map((job)=>({
+            id: `trigger:${job.id}`,
+            from: 'trigger',
+            to: job.id,
+            kind: 'trigger'
+        }));
+    const dependencyEdges = jobs.flatMap((job)=>job.dependencies.flatMap((dependencyKey)=>{
+            const dependency = byKey.get(dependencyKey);
+            if (!dependency) return [];
+            return [
+                {
+                    id: `${dependency.id}:${job.id}`,
+                    from: dependency.id,
+                    to: job.id,
+                    kind: 'dependency'
+                }
+            ];
+        }));
+    return [
+        ...triggerEdges,
+        ...dependencyEdges
+    ];
+}
+function currentDependencyCount(job, byKey) {
+    return job.dependencies.filter((dependencyKey)=>{
+        const dependency = byKey.get(dependencyKey);
+        return dependency?.status === 'pending' || dependency?.status === 'running';
+    }).length;
+}
+function jobGraphNode(job, layout) {
+    return Object.assign(Object.create(Object.getPrototypeOf(job)), job, layout);
+}
+export function nextJobGraphNodeId({ model, currentNodeId, key }) {
+    const current = model.nodes.find((node)=>node.id === currentNodeId);
+    if (!current) return undefined;
+    switch(key){
+        case 'ArrowRight':
+            return nodeInAdjacentColumn(model, current, 1)?.id;
+        case 'ArrowLeft':
+            return nodeInAdjacentColumn(model, current, -1)?.id;
+        case 'ArrowDown':
+        case 'j':
+            return model.columns[current.column]?.[current.row + 1]?.id;
+        case 'ArrowUp':
+        case 'k':
+            return model.columns[current.column]?.[current.row - 1]?.id;
+    }
+}
+function nodeInAdjacentColumn(model, current, offset) {
+    const column = model.columns[current.column + offset];
+    if (!column || column.length === 0) return undefined;
+    return column[Math.min(current.row, column.length - 1)];
+}
+
+//# sourceMappingURL=graph-model.js.map

package/dist/components/job-graph/graph-model.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/job-graph/graph-model.ts"],"sourcesContent":["import type {Job, WorkflowRunDetail} from '#core/workflow-run.js';\n\nexport type JobGraphNode = Job & {\n  column: number;\n  row: number;\n  currentDependencyCount: number;\n};\n\nexport type JobGraphNavigationKey =\n  | 'ArrowRight'\n  | 'ArrowLeft'\n  | 'ArrowDown'\n  | 'ArrowUp'\n  | 'j'\n  | 'k';\n\nexport interface JobGraphEdge {\n  id: string;\n  from: string;\n  to: string;\n  kind: 'trigger' | 'dependency';\n}\n\nexport interface JobGraphModel {\n  nodes: JobGraphNode[];\n  edges: JobGraphEdge[];\n  columns: JobGraphNode[][];\n}\n\nexport function buildJobGraphModel({run}: {run: WorkflowRunDetail}): JobGraphModel {\n  const sortedJobs = [...run.jobs].sort(compareJobs);\n  const byKey = new Map(sortedJobs.map((job) => [job.key, job]));\n  const columnMemo = new Map<string, number>();\n\n  function columnFor(job: Job, visiting = new Set<string>()): number {\n    const cached = columnMemo.get(job.id);\n    if (cached !== undefined) return cached;\n    if (visiting.has(job.id)) return 0;\n\n    const nextVisiting = new Set(visiting);\n    nextVisiting.add(job.id);\n\n    const dependencyColumns = job.dependencies\n      .map((dependencyKey) => byKey.get(dependencyKey))\n      .filter((dependency): dependency is Job => dependency !== undefined)\n      .map((dependency) => columnFor(dependency, nextVisiting));\n\n    const column = dependencyColumns.length === 0 ? 0 : Math.max(...dependencyColumns) + 1;\n    columnMemo.set(job.id, column);\n    return column;\n  }\n\n  const nodesWithoutRows = sortedJobs.map((job) =>\n    jobGraphNode(job, {\n      column: columnFor(job),\n      row: 0,\n      currentDependencyCount: currentDependencyCount(job, byKey),\n    }),\n  );\n\n  const grouped = groupColumns(nodesWithoutRows);\n  const nodes = grouped.flat();\n  const edges = buildEdges(sortedJobs, byKey);\n\n  return {\n    nodes,\n    edges,\n    columns: grouped,\n  };\n}\n\nfunction compareJobs(left: Job, right: Job): number {\n  return (\n    left.position - right.position ||\n    (left.name ?? left.key).localeCompare(right.name ?? right.key) ||\n    left.id.localeCompare(right.id)\n  );\n}\n\nfunction groupColumns(nodes: JobGraphNode[]): JobGraphNode[][] {\n  const byColumn = new Map<number, JobGraphNode[]>();\n  for (const node of nodes) {\n    const column = byColumn.get(node.column) ?? [];\n    column.push(node);\n    byColumn.set(node.column, column);\n  }\n\n  return [...byColumn.entries()]\n    .sort(([left], [right]) => left - right)\n    .map(([, column]) =>\n      column\n        .sort(\n          (left, right) =>\n            left.position - right.position ||\n            (left.name ?? left.key).localeCompare(right.name ?? right.key) ||\n            left.id.localeCompare(right.id),\n        )\n        .map((node, row) => jobGraphNode(node, {...node, row})),\n    );\n}\n\nfunction buildEdges(jobs: readonly Job[], byKey: ReadonlyMap<string, Job>): JobGraphEdge[] {\n  const triggerEdges = jobs\n    .filter((job) => job.dependencies.length === 0)\n    .map((job) => ({\n      id: `trigger:${job.id}`,\n      from: 'trigger',\n      to: job.id,\n      kind: 'trigger' as const,\n    }));\n\n  const dependencyEdges = jobs.flatMap((job) =>\n    job.dependencies.flatMap((dependencyKey) => {\n      const dependency = byKey.get(dependencyKey);\n      if (!dependency) return [];\n      return [\n        {\n          id: `${dependency.id}:${job.id}`,\n          from: dependency.id,\n          to: job.id,\n          kind: 'dependency' as const,\n        },\n      ];\n    }),\n  );\n\n  return [...triggerEdges, ...dependencyEdges];\n}\n\nfunction currentDependencyCount(job: Job, byKey: ReadonlyMap<string, Job>): number {\n  return job.dependencies.filter((dependencyKey) => {\n    const dependency = byKey.get(dependencyKey);\n    return dependency?.status === 'pending' || dependency?.status === 'running';\n  }).length;\n}\n\nfunction jobGraphNode(\n  job: Job,\n  layout: Pick<JobGraphNode, 'column' | 'row' | 'currentDependencyCount'>,\n): JobGraphNode {\n  return Object.assign(Object.create(Object.getPrototypeOf(job)), job, layout);\n}\n\nexport function nextJobGraphNodeId({\n  model,\n  currentNodeId,\n  key,\n}: {\n  model: JobGraphModel;\n  currentNodeId: string;\n  key: JobGraphNavigationKey;\n}): string | undefined {\n  const current = model.nodes.find((node) => node.id === currentNodeId);\n  if (!current) return undefined;\n\n  switch (key) {\n    case 'ArrowRight':\n      return nodeInAdjacentColumn(model, current, 1)?.id;\n    case 'ArrowLeft':\n      return nodeInAdjacentColumn(model, current, -1)?.id;\n    case 'ArrowDown':\n    case 'j':\n      return model.columns[current.column]?.[current.row + 1]?.id;\n    case 'ArrowUp':\n    case 'k':\n      return model.columns[current.column]?.[current.row - 1]?.id;\n  }\n}\n\nfunction nodeInAdjacentColumn(\n  model: JobGraphModel,\n  current: JobGraphNode,\n  offset: -1 | 1,\n): JobGraphNode | undefined {\n  const column = model.columns[current.column + offset];\n  if (!column || column.length === 0) return undefined;\n  return column[Math.min(current.row, column.length - 1)];\n}\n"],"names":["buildJobGraphModel","run","sortedJobs","jobs","sort","compareJobs","byKey","Map","map","job","key","columnMemo","columnFor","visiting","Set","cached","get","id","undefined","has","nextVisiting","add","dependencyColumns","dependencies","dependencyKey","filter","dependency","column","length","Math","max","set","nodesWithoutRows","jobGraphNode","row","currentDependencyCount","grouped","groupColumns","nodes","flat","edges","buildEdges","columns","left","right","position","name","localeCompare","byColumn","node","push","entries","triggerEdges","from","to","kind","dependencyEdges","flatMap","status","layout","Object","assign","create","getPrototypeOf","nextJobGraphNodeId","model","currentNodeId","current","find","nodeInAdjacentColumn","offset","min"],"mappings":"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"}

package/dist/components/job-graph/index.d.ts

@@ -0,0 +1,3 @@
+export { JobGraph } from './job-graph.js';
+export type { JobGraphProps } from './types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/job-graph/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/job-graph/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,QAAQ,EAAC,MAAM,gBAAgB,CAAC;AACxC,YAAY,EAAC,aAAa,EAAC,MAAM,YAAY,CAAC"}

package/dist/components/job-graph/index.js

@@ -0,0 +1,3 @@
+export { JobGraph } from './job-graph.js';
+
+//# sourceMappingURL=index.js.map

package/dist/components/job-graph/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/job-graph/index.ts"],"sourcesContent":["export {JobGraph} from './job-graph.js';\nexport type {JobGraphProps} from './types.js';\n"],"names":["JobGraph"],"mappings":"AAAA,SAAQA,QAAQ,QAAO,iBAAiB"}

package/dist/components/job-graph/job-duration-format.d.ts

@@ -0,0 +1,4 @@
+import type { JobDisplayDuration, JobExecutionTime } from '#core/workflow-run.js';
+export declare function formatJobExecutionTimeLabel(time: JobExecutionTime): string;
+export declare function formatJobDurationAccessibleLabel(duration: JobDisplayDuration | null): string | undefined;
+//# sourceMappingURL=job-duration-format.d.ts.map

package/dist/components/job-graph/job-duration-format.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"job-duration-format.d.ts","sourceRoot":"","sources":["../../../src/components/job-graph/job-duration-format.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,kBAAkB,EAAE,gBAAgB,EAAC,MAAM,uBAAuB,CAAC;AAEhF,wBAAgB,2BAA2B,CAAC,IAAI,EAAE,gBAAgB,GAAG,MAAM,CAW1E;AAED,wBAAgB,gCAAgC,CAC9C,QAAQ,EAAE,kBAAkB,GAAG,IAAI,GAClC,MAAM,GAAG,SAAS,CAcpB"}

package/dist/components/job-graph/job-duration-format.js

@@ -0,0 +1,41 @@
+import { humanDuration } from '@shipfox/react-ui/utils';
+export function formatJobExecutionTimeLabel(time) {
+    switch(time.state){
+        case 'live':
+            return humanDuration(time.fromIso);
+        case 'fixed':
+            return formatFixedDurationLabel(time.elapsed);
+        default:
+            {
+                const exhaustive = time;
+                return exhaustive;
+            }
+    }
+}
+export function formatJobDurationAccessibleLabel(duration) {
+    if (duration === null) return undefined;
+    const label = formatJobExecutionTimeLabel(duration);
+    switch(duration.kind){
+        case 'queue':
+            return duration.state === 'live' ? `queueing ${label}` : `queued ${label}`;
+        case 'run':
+            return duration.state === 'live' ? `running ${label}` : `ran ${label}`;
+        default:
+            {
+                const exhaustive = duration;
+                return exhaustive;
+            }
+    }
+}
+function formatFixedDurationLabel({ years = 0, months = 0, weeks = 0, days = 0, hours = 0, minutes = 0, seconds = 0 }) {
+    const totalDays = years * 365 + months * 30 + weeks * 7 + days;
+    const totalHours = totalDays * 24 + hours;
+    if (totalHours > 0) return `${totalHours}h ${pad2(minutes)}m`;
+    if (minutes > 0) return `${minutes}m ${pad2(seconds)}s`;
+    return `${seconds}s`;
+}
+function pad2(value) {
+    return value.toString().padStart(2, '0');
+}
+
+//# sourceMappingURL=job-duration-format.js.map

package/dist/components/job-graph/job-duration-format.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/job-graph/job-duration-format.ts"],"sourcesContent":["import {humanDuration} from '@shipfox/react-ui/utils';\nimport type {JobDisplayDuration, JobExecutionTime} from '#core/workflow-run.js';\n\nexport function formatJobExecutionTimeLabel(time: JobExecutionTime): string {\n  switch (time.state) {\n    case 'live':\n      return humanDuration(time.fromIso);\n    case 'fixed':\n      return formatFixedDurationLabel(time.elapsed);\n    default: {\n      const exhaustive: never = time;\n      return exhaustive;\n    }\n  }\n}\n\nexport function formatJobDurationAccessibleLabel(\n  duration: JobDisplayDuration | null,\n): string | undefined {\n  if (duration === null) return undefined;\n\n  const label = formatJobExecutionTimeLabel(duration);\n  switch (duration.kind) {\n    case 'queue':\n      return duration.state === 'live' ? `queueing ${label}` : `queued ${label}`;\n    case 'run':\n      return duration.state === 'live' ? `running ${label}` : `ran ${label}`;\n    default: {\n      const exhaustive: never = duration;\n      return exhaustive;\n    }\n  }\n}\n\nfunction formatFixedDurationLabel({\n  years = 0,\n  months = 0,\n  weeks = 0,\n  days = 0,\n  hours = 0,\n  minutes = 0,\n  seconds = 0,\n}: Extract<JobExecutionTime, {state: 'fixed'}>['elapsed']): string {\n  const totalDays = years * 365 + months * 30 + weeks * 7 + days;\n  const totalHours = totalDays * 24 + hours;\n\n  if (totalHours > 0) return `${totalHours}h ${pad2(minutes)}m`;\n  if (minutes > 0) return `${minutes}m ${pad2(seconds)}s`;\n  return `${seconds}s`;\n}\n\nfunction pad2(value: number): string {\n  return value.toString().padStart(2, '0');\n}\n"],"names":["humanDuration","formatJobExecutionTimeLabel","time","state","fromIso","formatFixedDurationLabel","elapsed","exhaustive","formatJobDurationAccessibleLabel","duration","undefined","label","kind","years","months","weeks","days","hours","minutes","seconds","totalDays","totalHours","pad2","value","toString","padStart"],"mappings":"AAAA,SAAQA,aAAa,QAAO,0BAA0B;AAGtD,OAAO,SAASC,4BAA4BC,IAAsB;IAChE,OAAQA,KAAKC,KAAK;QAChB,KAAK;YACH,OAAOH,cAAcE,KAAKE,OAAO;QACnC,KAAK;YACH,OAAOC,yBAAyBH,KAAKI,OAAO;QAC9C;YAAS;gBACP,MAAMC,aAAoBL;gBAC1B,OAAOK;YACT;IACF;AACF;AAEA,OAAO,SAASC,iCACdC,QAAmC;IAEnC,IAAIA,aAAa,MAAM,OAAOC;IAE9B,MAAMC,QAAQV,4BAA4BQ;IAC1C,OAAQA,SAASG,IAAI;QACnB,KAAK;YACH,OAAOH,SAASN,KAAK,KAAK,SAAS,CAAC,SAAS,EAAEQ,OAAO,GAAG,CAAC,OAAO,EAAEA,OAAO;QAC5E,KAAK;YACH,OAAOF,SAASN,KAAK,KAAK,SAAS,CAAC,QAAQ,EAAEQ,OAAO,GAAG,CAAC,IAAI,EAAEA,OAAO;QACxE;YAAS;gBACP,MAAMJ,aAAoBE;gBAC1B,OAAOF;YACT;IACF;AACF;AAEA,SAASF,yBAAyB,EAChCQ,QAAQ,CAAC,EACTC,SAAS,CAAC,EACVC,QAAQ,CAAC,EACTC,OAAO,CAAC,EACRC,QAAQ,CAAC,EACTC,UAAU,CAAC,EACXC,UAAU,CAAC,EAC4C;IACvD,MAAMC,YAAYP,QAAQ,MAAMC,SAAS,KAAKC,QAAQ,IAAIC;IAC1D,MAAMK,aAAaD,YAAY,KAAKH;IAEpC,IAAII,aAAa,GAAG,OAAO,GAAGA,WAAW,EAAE,EAAEC,KAAKJ,SAAS,CAAC,CAAC;IAC7D,IAAIA,UAAU,GAAG,OAAO,GAAGA,QAAQ,EAAE,EAAEI,KAAKH,SAAS,CAAC,CAAC;IACvD,OAAO,GAAGA,QAAQ,CAAC,CAAC;AACtB;AAEA,SAASG,KAAKC,KAAa;IACzB,OAAOA,MAAMC,QAAQ,GAAGC,QAAQ,CAAC,GAAG;AACtC"}

package/dist/components/job-graph/job-duration-label.d.ts

@@ -0,0 +1,5 @@
+import type { JobDisplayDuration } from '#core/workflow-run.js';
+export declare function JobDurationLabel({ duration }: {
+    duration: JobDisplayDuration | null;
+}): import("react").JSX.Element | null;
+//# sourceMappingURL=job-duration-label.d.ts.map

package/dist/components/job-graph/job-duration-label.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"job-duration-label.d.ts","sourceRoot":"","sources":["../../../src/components/job-graph/job-duration-label.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,uBAAuB,CAAC;AAG9D,wBAAgB,gBAAgB,CAAC,EAAC,QAAQ,EAAC,EAAE;IAAC,QAAQ,EAAE,kBAAkB,GAAG,IAAI,CAAA;CAAC,sCAQjF"}

package/dist/components/job-graph/job-duration-label.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useTimeTick } from '@shipfox/react-ui/time-ticker';
+import { Code } from '@shipfox/react-ui/typography';
+import { humanDuration } from '@shipfox/react-ui/utils';
+import { formatJobExecutionTimeLabel } from './job-duration-format.js';
+export function JobDurationLabel({ duration }) {
+    if (duration === null) return null;
+    if (duration.state === 'live') {
+        return /*#__PURE__*/ _jsx(LiveDurationText, {
+            fromIso: duration.fromIso
+        });
+    }
+    return /*#__PURE__*/ _jsx(DurationText, {
+        children: formatJobExecutionTimeLabel(duration)
+    });
+}
+function LiveDurationText({ fromIso }) {
+    useTimeTick();
+    return /*#__PURE__*/ _jsx(DurationText, {
+        children: humanDuration(fromIso)
+    });
+}
+function DurationText({ children }) {
+    // The status icon names the state; the node aria-label carries the verb.
+    return /*#__PURE__*/ _jsx(Code, {
+        as: "span",
+        variant: "label",
+        className: "shrink-0 tabular-nums text-foreground-neutral-muted",
+        children: children
+    });
+}
+
+//# sourceMappingURL=job-duration-label.js.map

package/dist/components/job-graph/job-duration-label.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/job-graph/job-duration-label.tsx"],"sourcesContent":["import {useTimeTick} from '@shipfox/react-ui/time-ticker';\nimport {Code} from '@shipfox/react-ui/typography';\nimport {humanDuration} from '@shipfox/react-ui/utils';\nimport type {JobDisplayDuration} from '#core/workflow-run.js';\nimport {formatJobExecutionTimeLabel} from './job-duration-format.js';\n\nexport function JobDurationLabel({duration}: {duration: JobDisplayDuration | null}) {\n  if (duration === null) return null;\n\n  if (duration.state === 'live') {\n    return <LiveDurationText fromIso={duration.fromIso} />;\n  }\n\n  return <DurationText>{formatJobExecutionTimeLabel(duration)}</DurationText>;\n}\n\nfunction LiveDurationText({fromIso}: {fromIso: string}) {\n  useTimeTick();\n  return <DurationText>{humanDuration(fromIso)}</DurationText>;\n}\n\nfunction DurationText({children}: {children: string}) {\n  // The status icon names the state; the node aria-label carries the verb.\n  return (\n    <Code as=\"span\" variant=\"label\" className=\"shrink-0 tabular-nums text-foreground-neutral-muted\">\n      {children}\n    </Code>\n  );\n}\n"],"names":["useTimeTick","Code","humanDuration","formatJobExecutionTimeLabel","JobDurationLabel","duration","state","LiveDurationText","fromIso","DurationText","children","as","variant","className"],"mappings":";AAAA,SAAQA,WAAW,QAAO,gCAAgC;AAC1D,SAAQC,IAAI,QAAO,+BAA+B;AAClD,SAAQC,aAAa,QAAO,0BAA0B;AAEtD,SAAQC,2BAA2B,QAAO,2BAA2B;AAErE,OAAO,SAASC,iBAAiB,EAACC,QAAQ,EAAwC;IAChF,IAAIA,aAAa,MAAM,OAAO;IAE9B,IAAIA,SAASC,KAAK,KAAK,QAAQ;QAC7B,qBAAO,KAACC;YAAiBC,SAASH,SAASG,OAAO;;IACpD;IAEA,qBAAO,KAACC;kBAAcN,4BAA4BE;;AACpD;AAEA,SAASE,iBAAiB,EAACC,OAAO,EAAoB;IACpDR;IACA,qBAAO,KAACS;kBAAcP,cAAcM;;AACtC;AAEA,SAASC,aAAa,EAACC,QAAQ,EAAqB;IAClD,yEAAyE;IACzE,qBACE,KAACT;QAAKU,IAAG;QAAOC,SAAQ;QAAQC,WAAU;kBACvCH;;AAGP"}

package/dist/components/job-graph/job-graph-content.d.ts

@@ -0,0 +1,9 @@
+import type { WorkflowRunDetail } from '#core/workflow-run.js';
+import type { JobGraphModel } from './graph-model.js';
+export declare function JobGraphContent({ model, trigger, selectedJobId, onSelectJob, }: {
+    model: JobGraphModel;
+    trigger: Pick<WorkflowRunDetail, 'triggerDisplayLabel' | 'triggerLabel' | 'triggerProvider' | 'triggerSource'>;
+    selectedJobId?: string | undefined;
+    onSelectJob: (jobId: string | undefined) => void;
+}): import("react").JSX.Element;
+//# sourceMappingURL=job-graph-content.d.ts.map

package/dist/components/job-graph/job-graph-content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"job-graph-content.d.ts","sourceRoot":"","sources":["../../../src/components/job-graph/job-graph-content.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,uBAAuB,CAAC;AAC7D,OAAO,KAAK,EAAC,aAAa,EAAwB,MAAM,kBAAkB,CAAC;AAW3E,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,OAAO,EACP,aAAa,EACb,WAAW,GACZ,EAAE;IACD,KAAK,EAAE,aAAa,CAAC;IACrB,OAAO,EAAE,IAAI,CACX,iBAAiB,EACjB,qBAAqB,GAAG,cAAc,GAAG,iBAAiB,GAAG,eAAe,CAC7E,CAAC;IACF,aAAa,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACnC,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CAClD,+BAuFA"}

package/dist/components/job-graph/job-graph-content.js

@@ -0,0 +1,181 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { EmptyState } from '@shipfox/react-ui/empty-state';
+import { TimeTickerProvider } from '@shipfox/react-ui/time-ticker';
+import { cn } from '@shipfox/react-ui/utils';
+import { useRef, useState } from 'react';
+import { nextJobGraphNodeId } from './graph-model.js';
+import { JobNode, TriggerNode } from './job-node.js';
+const NODE_WIDTH = 208;
+const NODE_HEIGHT = 48;
+const COLUMN_GAP = 64;
+const ROW_GAP = 20;
+const TRIGGER_WIDTH = 36;
+const PADDING = 16;
+export function JobGraphContent({ model, trigger, selectedJobId, onSelectJob }) {
+    const nodeRefs = useRef(new Map());
+    const [hoveredJobId, setHoveredJobId] = useState();
+    if (model.nodes.length === 0) {
+        return /*#__PURE__*/ _jsx(EmptyState, {
+            className: "min-h-160 px-16 py-24",
+            icon: "componentLine",
+            title: "No jobs yet",
+            description: "This run has not materialized jobs.",
+            variant: "compact"
+        });
+    }
+    const maxRows = Math.max(1, ...model.columns.map((column)=>column.length));
+    const contentWidth = PADDING * 2 + TRIGGER_WIDTH + COLUMN_GAP + model.columns.length * NODE_WIDTH + Math.max(0, model.columns.length - 1) * COLUMN_GAP;
+    const contentHeight = PADDING * 2 + maxRows * NODE_HEIGHT + Math.max(0, maxRows - 1) * ROW_GAP;
+    function setNodeRef(jobId) {
+        return (element)=>{
+            if (element) {
+                nodeRefs.current.set(jobId, element);
+            } else {
+                nodeRefs.current.delete(jobId);
+            }
+        };
+    }
+    function handleKeyDown(event) {
+        const key = navigationKey(event.key);
+        if (!key) return;
+        const currentNodeId = event.currentTarget.dataset.jobId;
+        if (!currentNodeId) return;
+        const nextNodeId = nextJobGraphNodeId({
+            model,
+            currentNodeId,
+            key
+        });
+        if (!nextNodeId) return;
+        event.preventDefault();
+        onSelectJob(nextNodeId);
+        nodeRefs.current.get(nextNodeId)?.focus();
+    }
+    return /*#__PURE__*/ _jsx(TimeTickerProvider, {
+        intervalMs: 1000,
+        reducedMotionIntervalMs: 10_000,
+        children: /*#__PURE__*/ _jsx("div", {
+            className: "min-h-0 overflow-auto bg-background-neutral-base",
+            children: /*#__PURE__*/ _jsxs("div", {
+                className: "relative",
+                style: {
+                    width: contentWidth,
+                    minHeight: contentHeight
+                },
+                children: [
+                    /*#__PURE__*/ _jsx(GraphEdges, {
+                        model: model,
+                        hoveredJobId: hoveredJobId
+                    }),
+                    /*#__PURE__*/ _jsx("div", {
+                        className: "absolute",
+                        style: {
+                            left: PADDING,
+                            top: PADDING + (NODE_HEIGHT - TRIGGER_WIDTH) / 2
+                        },
+                        children: /*#__PURE__*/ _jsx(TriggerNode, {
+                            trigger: trigger
+                        })
+                    }),
+                    model.columns.map((column, columnIndex)=>/*#__PURE__*/ _jsx("div", {
+                            className: "absolute flex flex-col gap-20",
+                            style: {
+                                left: jobLeft(columnIndex),
+                                top: PADDING
+                            },
+                            children: column.map((node)=>/*#__PURE__*/ _jsx(JobNode, {
+                                    node: node,
+                                    selected: node.id === selectedJobId,
+                                    ref: setNodeRef(node.id),
+                                    onSelect: ()=>onSelectJob(node.id === selectedJobId ? undefined : node.id),
+                                    onKeyDown: handleKeyDown,
+                                    onHoverStart: ()=>setHoveredJobId(node.id),
+                                    onHoverEnd: ()=>setHoveredJobId((current)=>current === node.id ? undefined : current)
+                                }, node.id))
+                        }, column.map((node)=>node.id).join(':')))
+                ]
+            })
+        })
+    });
+}
+function navigationKey(key) {
+    if (key === 'ArrowRight' || key === 'ArrowLeft' || key === 'ArrowDown' || key === 'ArrowUp' || key === 'j' || key === 'k') {
+        return key;
+    }
+    return undefined;
+}
+function GraphEdges({ model, hoveredJobId }) {
+    const byId = new Map(model.nodes.map((node)=>[
+            node.id,
+            node
+        ]));
+    const edgeViews = model.edges.map((edge)=>{
+        const fromNode = byId.get(edge.from);
+        const toNode = byId.get(edge.to);
+        const from = edge.from === 'trigger' ? triggerPoint() : jobRightPoint(fromNode);
+        const to = jobLeftPoint(toNode);
+        if (!from || !to) return undefined;
+        return {
+            id: edge.id,
+            highlighted: edge.from === hoveredJobId || edge.to === hoveredJobId,
+            path: edgePath({
+                from,
+                fromNode,
+                to,
+                toNode
+            })
+        };
+    }).filter((edgeView)=>edgeView !== undefined).sort((left, right)=>Number(left.highlighted) - Number(right.highlighted));
+    return /*#__PURE__*/ _jsx("svg", {
+        className: "pointer-events-none absolute inset-0 size-full",
+        "aria-hidden": "true",
+        children: edgeViews.map((edge)=>{
+            return /*#__PURE__*/ _jsx("g", {
+                className: cn('text-foreground-neutral-muted transition-colors', edge.highlighted && 'text-foreground-neutral-base'),
+                children: /*#__PURE__*/ _jsx("path", {
+                    "data-edge-id": edge.id,
+                    d: edge.path,
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: edge.highlighted ? 1.5 : 1
+                })
+            }, edge.id);
+        })
+    });
+}
+function edgePath({ from, fromNode, to, toNode }) {
+    if (fromNode && toNode && toNode.column - fromNode.column > 1 && from.y !== to.y) {
+        const targetLaneX = to.x - COLUMN_GAP / 2;
+        return `M ${from.x} ${from.y} H ${targetLaneX} V ${to.y} H ${to.x}`;
+    }
+    const midX = from.x + (to.x - from.x) / 2;
+    return `M ${from.x} ${from.y} H ${midX} V ${to.y} H ${to.x}`;
+}
+function triggerPoint() {
+    return {
+        x: PADDING + TRIGGER_WIDTH,
+        y: PADDING + NODE_HEIGHT / 2
+    };
+}
+function jobLeft(column) {
+    // Dependency depths are contiguous, so a node's depth matches its rendered column index.
+    return PADDING + TRIGGER_WIDTH + COLUMN_GAP + column * (NODE_WIDTH + COLUMN_GAP);
+}
+function jobTop(row) {
+    return PADDING + row * (NODE_HEIGHT + ROW_GAP);
+}
+function jobLeftPoint(node) {
+    if (!node) return undefined;
+    return {
+        x: jobLeft(node.column),
+        y: jobTop(node.row) + NODE_HEIGHT / 2
+    };
+}
+function jobRightPoint(node) {
+    if (!node) return undefined;
+    return {
+        x: jobLeft(node.column) + NODE_WIDTH,
+        y: jobTop(node.row) + NODE_HEIGHT / 2
+    };
+}
+
+//# sourceMappingURL=job-graph-content.js.map

package/dist/components/job-graph/job-graph-content.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/job-graph/job-graph-content.tsx"],"sourcesContent":["import {EmptyState} from '@shipfox/react-ui/empty-state';\nimport {TimeTickerProvider} from '@shipfox/react-ui/time-ticker';\nimport {cn} from '@shipfox/react-ui/utils';\nimport type {KeyboardEvent} from 'react';\nimport {useRef, useState} from 'react';\nimport type {WorkflowRunDetail} from '#core/workflow-run.js';\nimport type {JobGraphModel, JobGraphNavigationKey} from './graph-model.js';\nimport {nextJobGraphNodeId} from './graph-model.js';\nimport {JobNode, TriggerNode} from './job-node.js';\n\nconst NODE_WIDTH = 208;\nconst NODE_HEIGHT = 48;\nconst COLUMN_GAP = 64;\nconst ROW_GAP = 20;\nconst TRIGGER_WIDTH = 36;\nconst PADDING = 16;\n\nexport function JobGraphContent({\n  model,\n  trigger,\n  selectedJobId,\n  onSelectJob,\n}: {\n  model: JobGraphModel;\n  trigger: Pick<\n    WorkflowRunDetail,\n    'triggerDisplayLabel' | 'triggerLabel' | 'triggerProvider' | 'triggerSource'\n  >;\n  selectedJobId?: string | undefined;\n  onSelectJob: (jobId: string | undefined) => void;\n}) {\n  const nodeRefs = useRef(new Map<string, HTMLButtonElement>());\n  const [hoveredJobId, setHoveredJobId] = useState<string | undefined>();\n\n  if (model.nodes.length === 0) {\n    return (\n      <EmptyState\n        className=\"min-h-160 px-16 py-24\"\n        icon=\"componentLine\"\n        title=\"No jobs yet\"\n        description=\"This run has not materialized jobs.\"\n        variant=\"compact\"\n      />\n    );\n  }\n\n  const maxRows = Math.max(1, ...model.columns.map((column) => column.length));\n  const contentWidth =\n    PADDING * 2 +\n    TRIGGER_WIDTH +\n    COLUMN_GAP +\n    model.columns.length * NODE_WIDTH +\n    Math.max(0, model.columns.length - 1) * COLUMN_GAP;\n  const contentHeight = PADDING * 2 + maxRows * NODE_HEIGHT + Math.max(0, maxRows - 1) * ROW_GAP;\n\n  function setNodeRef(jobId: string) {\n    return (element: HTMLButtonElement | null) => {\n      if (element) {\n        nodeRefs.current.set(jobId, element);\n      } else {\n        nodeRefs.current.delete(jobId);\n      }\n    };\n  }\n\n  function handleKeyDown(event: KeyboardEvent<HTMLButtonElement>) {\n    const key = navigationKey(event.key);\n    if (!key) return;\n\n    const currentNodeId = event.currentTarget.dataset.jobId;\n    if (!currentNodeId) return;\n\n    const nextNodeId = nextJobGraphNodeId({model, currentNodeId, key});\n    if (!nextNodeId) return;\n\n    event.preventDefault();\n    onSelectJob(nextNodeId);\n    nodeRefs.current.get(nextNodeId)?.focus();\n  }\n\n  return (\n    <TimeTickerProvider intervalMs={1000} reducedMotionIntervalMs={10_000}>\n      <div className=\"min-h-0 overflow-auto bg-background-neutral-base\">\n        <div className=\"relative\" style={{width: contentWidth, minHeight: contentHeight}}>\n          <GraphEdges model={model} hoveredJobId={hoveredJobId} />\n          <div\n            className=\"absolute\"\n            style={{left: PADDING, top: PADDING + (NODE_HEIGHT - TRIGGER_WIDTH) / 2}}\n          >\n            <TriggerNode trigger={trigger} />\n          </div>\n          {model.columns.map((column, columnIndex) => (\n            <div\n              key={column.map((node) => node.id).join(':')}\n              className=\"absolute flex flex-col gap-20\"\n              style={{left: jobLeft(columnIndex), top: PADDING}}\n            >\n              {column.map((node) => (\n                <JobNode\n                  key={node.id}\n                  node={node}\n                  selected={node.id === selectedJobId}\n                  ref={setNodeRef(node.id)}\n                  onSelect={() => onSelectJob(node.id === selectedJobId ? undefined : node.id)}\n                  onKeyDown={handleKeyDown}\n                  onHoverStart={() => setHoveredJobId(node.id)}\n                  onHoverEnd={() =>\n                    setHoveredJobId((current) => (current === node.id ? undefined : current))\n                  }\n                />\n              ))}\n            </div>\n          ))}\n        </div>\n      </div>\n    </TimeTickerProvider>\n  );\n}\n\nfunction navigationKey(key: string): JobGraphNavigationKey | undefined {\n  if (\n    key === 'ArrowRight' ||\n    key === 'ArrowLeft' ||\n    key === 'ArrowDown' ||\n    key === 'ArrowUp' ||\n    key === 'j' ||\n    key === 'k'\n  ) {\n    return key;\n  }\n  return undefined;\n}\n\nfunction GraphEdges({\n  model,\n  hoveredJobId,\n}: {\n  model: JobGraphModel;\n  hoveredJobId?: string | undefined;\n}) {\n  const byId = new Map(model.nodes.map((node) => [node.id, node]));\n  const edgeViews = model.edges\n    .map((edge) => {\n      const fromNode = byId.get(edge.from);\n      const toNode = byId.get(edge.to);\n      const from = edge.from === 'trigger' ? triggerPoint() : jobRightPoint(fromNode);\n      const to = jobLeftPoint(toNode);\n      if (!from || !to) return undefined;\n\n      return {\n        id: edge.id,\n        highlighted: edge.from === hoveredJobId || edge.to === hoveredJobId,\n        path: edgePath({from, fromNode, to, toNode}),\n      };\n    })\n    .filter((edgeView): edgeView is NonNullable<typeof edgeView> => edgeView !== undefined)\n    .sort((left, right) => Number(left.highlighted) - Number(right.highlighted));\n\n  return (\n    <svg className=\"pointer-events-none absolute inset-0 size-full\" aria-hidden=\"true\">\n      {edgeViews.map((edge) => {\n        return (\n          <g\n            key={edge.id}\n            className={cn(\n              'text-foreground-neutral-muted transition-colors',\n              edge.highlighted && 'text-foreground-neutral-base',\n            )}\n          >\n            <path\n              data-edge-id={edge.id}\n              d={edge.path}\n              fill=\"none\"\n              stroke=\"currentColor\"\n              strokeWidth={edge.highlighted ? 1.5 : 1}\n            />\n          </g>\n        );\n      })}\n    </svg>\n  );\n}\n\nfunction edgePath({\n  from,\n  fromNode,\n  to,\n  toNode,\n}: {\n  from: {x: number; y: number};\n  fromNode: {column: number} | undefined;\n  to: {x: number; y: number};\n  toNode: {column: number} | undefined;\n}) {\n  if (fromNode && toNode && toNode.column - fromNode.column > 1 && from.y !== to.y) {\n    const targetLaneX = to.x - COLUMN_GAP / 2;\n    return `M ${from.x} ${from.y} H ${targetLaneX} V ${to.y} H ${to.x}`;\n  }\n\n  const midX = from.x + (to.x - from.x) / 2;\n  return `M ${from.x} ${from.y} H ${midX} V ${to.y} H ${to.x}`;\n}\n\nfunction triggerPoint() {\n  return {x: PADDING + TRIGGER_WIDTH, y: PADDING + NODE_HEIGHT / 2};\n}\n\nfunction jobLeft(column: number): number {\n  // Dependency depths are contiguous, so a node's depth matches its rendered column index.\n  return PADDING + TRIGGER_WIDTH + COLUMN_GAP + column * (NODE_WIDTH + COLUMN_GAP);\n}\n\nfunction jobTop(row: number): number {\n  return PADDING + row * (NODE_HEIGHT + ROW_GAP);\n}\n\nfunction jobLeftPoint(node: {column: number; row: number} | undefined) {\n  if (!node) return undefined;\n  return {x: jobLeft(node.column), y: jobTop(node.row) + NODE_HEIGHT / 2};\n}\n\nfunction jobRightPoint(node: {column: number; row: number} | undefined) {\n  if (!node) return undefined;\n  return {x: jobLeft(node.column) + NODE_WIDTH, y: jobTop(node.row) + NODE_HEIGHT / 2};\n}\n"],"names":["EmptyState","TimeTickerProvider","cn","useRef","useState","nextJobGraphNodeId","JobNode","TriggerNode","NODE_WIDTH","NODE_HEIGHT","COLUMN_GAP","ROW_GAP","TRIGGER_WIDTH","PADDING","JobGraphContent","model","trigger","selectedJobId","onSelectJob","nodeRefs","Map","hoveredJobId","setHoveredJobId","nodes","length","className","icon","title","description","variant","maxRows","Math","max","columns","map","column","contentWidth","contentHeight","setNodeRef","jobId","element","current","set","delete","handleKeyDown","event","key","navigationKey","currentNodeId","currentTarget","dataset","nextNodeId","preventDefault","get","focus","intervalMs","reducedMotionIntervalMs","div","style","width","minHeight","GraphEdges","left","top","columnIndex","jobLeft","node","selected","id","ref","onSelect","undefined","onKeyDown","onHoverStart","onHoverEnd","join","byId","edgeViews","edges","edge","fromNode","from","toNode","to","triggerPoint","jobRightPoint","jobLeftPoint","highlighted","path","edgePath","filter","edgeView","sort","right","Number","svg","aria-hidden","g","data-edge-id","d","fill","stroke","strokeWidth","y","targetLaneX","x","midX","jobTop","row"],"mappings":"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"}

package/dist/components/job-graph/job-graph-view.d.ts

@@ -0,0 +1,11 @@
+import type { WorkflowRunDetail } from '#core/workflow-run.js';
+import type { JobGraphModel } from './graph-model.js';
+export declare function JobGraphView({ model, trigger, selectedJobId, defaultSelectedJobId, onSelectedJobChange, className, }: {
+    model: JobGraphModel;
+    trigger: Pick<WorkflowRunDetail, 'triggerDisplayLabel' | 'triggerLabel' | 'triggerProvider' | 'triggerSource'>;
+    selectedJobId?: string | undefined;
+    defaultSelectedJobId?: string | undefined;
+    onSelectedJobChange?: ((jobId: string | undefined) => void) | undefined;
+    className?: string | undefined;
+}): import("react").JSX.Element;
+//# sourceMappingURL=job-graph-view.d.ts.map

package/dist/components/job-graph/job-graph-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"job-graph-view.d.ts","sourceRoot":"","sources":["../../../src/components/job-graph/job-graph-view.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,uBAAuB,CAAC;AAC7D,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,kBAAkB,CAAC;AAGpD,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,aAAa,EACb,oBAAoB,EACpB,mBAAmB,EACnB,SAAS,GACV,EAAE;IACD,KAAK,EAAE,aAAa,CAAC;IACrB,OAAO,EAAE,IAAI,CACX,iBAAiB,EACjB,qBAAqB,GAAG,cAAc,GAAG,iBAAiB,GAAG,eAAe,CAC7E,CAAC;IACF,aAAa,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACnC,oBAAoB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1C,mBAAmB,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACxE,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC,+BAqBA"}

package/dist/components/job-graph/job-graph-view.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '@shipfox/react-ui/utils';
+import { useState } from 'react';
+import { JobGraphContent } from './job-graph-content.js';
+export function JobGraphView({ model, trigger, selectedJobId, defaultSelectedJobId, onSelectedJobChange, className }) {
+    const [localSelectedJobId, setLocalSelectedJobId] = useState(defaultSelectedJobId);
+    const selected = selectedJobId ?? localSelectedJobId;
+    function selectJob(jobId) {
+        setLocalSelectedJobId(jobId);
+        onSelectedJobChange?.(jobId);
+    }
+    return /*#__PURE__*/ _jsx("section", {
+        "aria-label": "Workflow jobs",
+        className: cn('min-h-0', className),
+        children: /*#__PURE__*/ _jsx(JobGraphContent, {
+            model: model,
+            trigger: trigger,
+            selectedJobId: selected,
+            onSelectJob: selectJob
+        })
+    });
+}
+
+//# sourceMappingURL=job-graph-view.js.map

package/dist/components/job-graph/job-graph-view.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/job-graph/job-graph-view.tsx"],"sourcesContent":["import {cn} from '@shipfox/react-ui/utils';\nimport {useState} from 'react';\nimport type {WorkflowRunDetail} from '#core/workflow-run.js';\nimport type {JobGraphModel} from './graph-model.js';\nimport {JobGraphContent} from './job-graph-content.js';\n\nexport function JobGraphView({\n  model,\n  trigger,\n  selectedJobId,\n  defaultSelectedJobId,\n  onSelectedJobChange,\n  className,\n}: {\n  model: JobGraphModel;\n  trigger: Pick<\n    WorkflowRunDetail,\n    'triggerDisplayLabel' | 'triggerLabel' | 'triggerProvider' | 'triggerSource'\n  >;\n  selectedJobId?: string | undefined;\n  defaultSelectedJobId?: string | undefined;\n  onSelectedJobChange?: ((jobId: string | undefined) => void) | undefined;\n  className?: string | undefined;\n}) {\n  const [localSelectedJobId, setLocalSelectedJobId] = useState<string | undefined>(\n    defaultSelectedJobId,\n  );\n  const selected = selectedJobId ?? localSelectedJobId;\n\n  function selectJob(jobId: string | undefined) {\n    setLocalSelectedJobId(jobId);\n    onSelectedJobChange?.(jobId);\n  }\n\n  return (\n    <section aria-label=\"Workflow jobs\" className={cn('min-h-0', className)}>\n      <JobGraphContent\n        model={model}\n        trigger={trigger}\n        selectedJobId={selected}\n        onSelectJob={selectJob}\n      />\n    </section>\n  );\n}\n"],"names":["cn","useState","JobGraphContent","JobGraphView","model","trigger","selectedJobId","defaultSelectedJobId","onSelectedJobChange","className","localSelectedJobId","setLocalSelectedJobId","selected","selectJob","jobId","section","aria-label","onSelectJob"],"mappings":";AAAA,SAAQA,EAAE,QAAO,0BAA0B;AAC3C,SAAQC,QAAQ,QAAO,QAAQ;AAG/B,SAAQC,eAAe,QAAO,yBAAyB;AAEvD,OAAO,SAASC,aAAa,EAC3BC,KAAK,EACLC,OAAO,EACPC,aAAa,EACbC,oBAAoB,EACpBC,mBAAmB,EACnBC,SAAS,EAWV;IACC,MAAM,CAACC,oBAAoBC,sBAAsB,GAAGV,SAClDM;IAEF,MAAMK,WAAWN,iBAAiBI;IAElC,SAASG,UAAUC,KAAyB;QAC1CH,sBAAsBG;QACtBN,sBAAsBM;IACxB;IAEA,qBACE,KAACC;QAAQC,cAAW;QAAgBP,WAAWT,GAAG,WAAWS;kBAC3D,cAAA,KAACP;YACCE,OAAOA;YACPC,SAASA;YACTC,eAAeM;YACfK,aAAaJ;;;AAIrB"}

package/dist/components/job-graph/job-graph.d.ts

@@ -0,0 +1,3 @@
+import type { JobGraphProps } from './types.js';
+export declare function JobGraph({ run, selectedJobId, defaultSelectedJobId, onSelectedJobChange, className, }: JobGraphProps): import("react").JSX.Element;
+//# sourceMappingURL=job-graph.d.ts.map

package/dist/components/job-graph/job-graph.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"job-graph.d.ts","sourceRoot":"","sources":["../../../src/components/job-graph/job-graph.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,YAAY,CAAC;AAE9C,wBAAgB,QAAQ,CAAC,EACvB,GAAG,EACH,aAAa,EACb,oBAAoB,EACpB,mBAAmB,EACnB,SAAS,GACV,EAAE,aAAa,+BAYf"}

package/dist/components/job-graph/job-graph.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { buildJobGraphModel } from './graph-model.js';
+import { JobGraphView } from './job-graph-view.js';
+export function JobGraph({ run, selectedJobId, defaultSelectedJobId, onSelectedJobChange, className }) {
+    const model = useMemo(()=>buildJobGraphModel({
+            run
+        }), [
+        run
+    ]);
+    return /*#__PURE__*/ _jsx(JobGraphView, {
+        model: model,
+        trigger: run,
+        selectedJobId: selectedJobId,
+        defaultSelectedJobId: defaultSelectedJobId,
+        onSelectedJobChange: onSelectedJobChange,
+        className: className
+    });
+}
+
+//# sourceMappingURL=job-graph.js.map

package/dist/components/job-graph/job-graph.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/job-graph/job-graph.tsx"],"sourcesContent":["import {useMemo} from 'react';\nimport {buildJobGraphModel} from './graph-model.js';\nimport {JobGraphView} from './job-graph-view.js';\nimport type {JobGraphProps} from './types.js';\n\nexport function JobGraph({\n  run,\n  selectedJobId,\n  defaultSelectedJobId,\n  onSelectedJobChange,\n  className,\n}: JobGraphProps) {\n  const model = useMemo(() => buildJobGraphModel({run}), [run]);\n  return (\n    <JobGraphView\n      model={model}\n      trigger={run}\n      selectedJobId={selectedJobId}\n      defaultSelectedJobId={defaultSelectedJobId}\n      onSelectedJobChange={onSelectedJobChange}\n      className={className}\n    />\n  );\n}\n"],"names":["useMemo","buildJobGraphModel","JobGraphView","JobGraph","run","selectedJobId","defaultSelectedJobId","onSelectedJobChange","className","model","trigger"],"mappings":";AAAA,SAAQA,OAAO,QAAO,QAAQ;AAC9B,SAAQC,kBAAkB,QAAO,mBAAmB;AACpD,SAAQC,YAAY,QAAO,sBAAsB;AAGjD,OAAO,SAASC,SAAS,EACvBC,GAAG,EACHC,aAAa,EACbC,oBAAoB,EACpBC,mBAAmB,EACnBC,SAAS,EACK;IACd,MAAMC,QAAQT,QAAQ,IAAMC,mBAAmB;YAACG;QAAG,IAAI;QAACA;KAAI;IAC5D,qBACE,KAACF;QACCO,OAAOA;QACPC,SAASN;QACTC,eAAeA;QACfC,sBAAsBA;QACtBC,qBAAqBA;QACrBC,WAAWA;;AAGjB"}

package/dist/components/job-graph/job-node.d.ts

@@ -0,0 +1,16 @@
+import type { KeyboardEventHandler, Ref } from 'react';
+import type { WorkflowRunDetail } from '#core/workflow-run.js';
+import type { JobGraphNode } from './graph-model.js';
+export declare function TriggerNode({ trigger, }: {
+    trigger: Pick<WorkflowRunDetail, 'triggerDisplayLabel' | 'triggerLabel' | 'triggerProvider' | 'triggerSource'>;
+}): import("react").JSX.Element;
+export declare function JobNode({ node, selected, onSelect, onKeyDown, onHoverStart, onHoverEnd, ref, }: {
+    node: JobGraphNode;
+    selected: boolean;
+    onSelect: () => void;
+    onKeyDown: KeyboardEventHandler<HTMLButtonElement>;
+    onHoverStart: () => void;
+    onHoverEnd: () => void;
+    ref?: Ref<HTMLButtonElement>;
+}): import("react").JSX.Element;
+//# sourceMappingURL=job-node.d.ts.map

package/dist/components/job-graph/job-node.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"job-node.d.ts","sourceRoot":"","sources":["../../../src/components/job-graph/job-node.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAC,oBAAoB,EAAE,GAAG,EAAC,MAAM,OAAO,CAAC;AAGrD,OAAO,KAAK,EAAmC,iBAAiB,EAAC,MAAM,uBAAuB,CAAC;AAC/F,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAMnD,wBAAgB,WAAW,CAAC,EAC1B,OAAO,GACR,EAAE;IACD,OAAO,EAAE,IAAI,CACX,iBAAiB,EACjB,qBAAqB,GAAG,cAAc,GAAG,iBAAiB,GAAG,eAAe,CAC7E,CAAC;CACH,+BA0BA;AAED,wBAAgB,OAAO,CAAC,EACtB,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,UAAU,EACV,GAAG,GACJ,EAAE;IACD,IAAI,EAAE,YAAY,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;IACnD,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B,+BA+CA"}