@ucdjs/pipelines-ui 0.0.1-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +27 -0
  3. package/dist/components/detail/execution-result.d.mts +49 -0
  4. package/dist/components/detail/execution-result.mjs +366 -0
  5. package/dist/components/detail/version-selector.d.mts +21 -0
  6. package/dist/components/detail/version-selector.mjs +132 -0
  7. package/dist/components/graph/details.d.mts +14 -0
  8. package/dist/components/graph/details.mjs +369 -0
  9. package/dist/components/graph/filters.d.mts +14 -0
  10. package/dist/components/graph/filters.mjs +183 -0
  11. package/dist/components/graph/node-types.d.mts +10 -0
  12. package/dist/components/graph/node-types.mjs +13 -0
  13. package/dist/components/graph/nodes.d.mts +14 -0
  14. package/dist/components/graph/nodes.mjs +264 -0
  15. package/dist/components/graph/pipeline-graph.d.mts +15 -0
  16. package/dist/components/graph/pipeline-graph.mjs +241 -0
  17. package/dist/components/logs/execution-log-payload.d.mts +12 -0
  18. package/dist/components/logs/execution-log-payload.mjs +79 -0
  19. package/dist/components/logs/execution-log-table.d.mts +16 -0
  20. package/dist/components/logs/execution-log-table.mjs +121 -0
  21. package/dist/components/logs/execution-span-drawer.d.mts +16 -0
  22. package/dist/components/logs/execution-span-drawer.mjs +208 -0
  23. package/dist/components/logs/execution-waterfall.d.mts +18 -0
  24. package/dist/components/logs/execution-waterfall.mjs +354 -0
  25. package/dist/components/pipeline-sidebar.d.mts +6 -0
  26. package/dist/components/pipeline-sidebar.mjs +190 -0
  27. package/dist/components/status-badge.d.mts +11 -0
  28. package/dist/components/status-badge.mjs +50 -0
  29. package/dist/components/status-icon.d.mts +11 -0
  30. package/dist/components/status-icon.mjs +46 -0
  31. package/dist/hooks/index.d.mts +7 -0
  32. package/dist/hooks/index.mjs +8 -0
  33. package/dist/hooks/use-event-view.d.mts +19 -0
  34. package/dist/hooks/use-event-view.mjs +112 -0
  35. package/dist/hooks/use-execute.d.mts +20 -0
  36. package/dist/hooks/use-execute.mjs +68 -0
  37. package/dist/hooks/use-pipeline-file.d.mts +20 -0
  38. package/dist/hooks/use-pipeline-file.mjs +39 -0
  39. package/dist/hooks/use-pipeline-versions.d.mts +10 -0
  40. package/dist/hooks/use-pipeline-versions.mjs +137 -0
  41. package/dist/hooks/use-pipeline.d.mts +21 -0
  42. package/dist/hooks/use-pipeline.mjs +46 -0
  43. package/dist/hooks/use-pipelines.d.mts +26 -0
  44. package/dist/hooks/use-pipelines.mjs +38 -0
  45. package/dist/index.d.mts +31 -0
  46. package/dist/index.mjs +29 -0
  47. package/dist/lib/adapter.d.mts +26 -0
  48. package/dist/lib/adapter.mjs +74 -0
  49. package/dist/lib/colors.d.mts +7 -0
  50. package/dist/lib/colors.mjs +15 -0
  51. package/dist/lib/execution-logs.d.mts +19 -0
  52. package/dist/lib/execution-logs.mjs +74 -0
  53. package/dist/lib/format-time.d.mts +4 -0
  54. package/dist/lib/format-time.mjs +7 -0
  55. package/dist/lib/index.d.mts +5 -0
  56. package/dist/lib/index.mjs +6 -0
  57. package/dist/lib/layout.d.mts +8 -0
  58. package/dist/lib/layout.mjs +71 -0
  59. package/dist/lib/pipeline-utils.d.mts +9 -0
  60. package/dist/lib/pipeline-utils.mjs +49 -0
  61. package/dist/lib/utils.d.mts +6 -0
  62. package/dist/lib/utils.mjs +10 -0
  63. package/dist/styles/globals.css +3 -0
  64. package/dist/types.d.mts +143 -0
  65. package/package.json +95 -0
@@ -0,0 +1,19 @@
1
+ //#region src/hooks/use-event-view.d.ts
2
+ interface EventViewState {
3
+ isJsonMode: boolean;
4
+ selectedEventId: string | null;
5
+ isDetailPanelOpen: boolean;
6
+ expandedInlineIds: Set<string>;
7
+ }
8
+ interface EventViewActions {
9
+ toggleJsonMode: () => void;
10
+ setJsonMode: (value: boolean) => void;
11
+ selectEvent: (eventId: string | null) => void;
12
+ openDetailPanel: (eventId: string) => void;
13
+ closeDetailPanel: () => void;
14
+ toggleInlineExpansion: (eventId: string) => void;
15
+ isInlineExpanded: (eventId: string) => boolean;
16
+ }
17
+ declare function useEventView(): EventViewState & EventViewActions;
18
+ //#endregion
19
+ export { EventViewActions, EventViewState, useEventView };
@@ -0,0 +1,112 @@
1
+ import { c } from "react/compiler-runtime";
2
+ import { useState } from "react";
3
+
4
+ //#region src/hooks/use-event-view.ts
5
+ function useEventView() {
6
+ const $ = c(14);
7
+ const [isJsonMode, setIsJsonMode] = useState(_temp);
8
+ const [selectedEventId, setSelectedEventId] = useState(null);
9
+ const [isDetailPanelOpen, setIsDetailPanelOpen] = useState(false);
10
+ const [expandedInlineIds, setExpandedInlineIds] = useState(_temp2);
11
+ let t0;
12
+ if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
13
+ t0 = () => {
14
+ setIsJsonMode(_temp3);
15
+ };
16
+ $[0] = t0;
17
+ } else t0 = $[0];
18
+ const toggleJsonMode = t0;
19
+ let t1;
20
+ if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
21
+ t1 = (value) => {
22
+ setIsJsonMode(value);
23
+ localStorage.setItem("pipeline-events-json-mode", String(value));
24
+ };
25
+ $[1] = t1;
26
+ } else t1 = $[1];
27
+ const setJsonMode = t1;
28
+ let t2;
29
+ if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
30
+ t2 = (eventId) => {
31
+ setSelectedEventId(eventId);
32
+ };
33
+ $[2] = t2;
34
+ } else t2 = $[2];
35
+ const selectEvent = t2;
36
+ let t3;
37
+ if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
38
+ t3 = (eventId_0) => {
39
+ setSelectedEventId(eventId_0);
40
+ setIsDetailPanelOpen(true);
41
+ };
42
+ $[3] = t3;
43
+ } else t3 = $[3];
44
+ const openDetailPanel = t3;
45
+ let t4;
46
+ if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
47
+ t4 = () => {
48
+ setIsDetailPanelOpen(false);
49
+ setSelectedEventId(null);
50
+ };
51
+ $[4] = t4;
52
+ } else t4 = $[4];
53
+ const closeDetailPanel = t4;
54
+ let t5;
55
+ if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
56
+ t5 = (eventId_1) => {
57
+ setExpandedInlineIds((prev_0) => {
58
+ const next_0 = new Set(prev_0);
59
+ if (next_0.has(eventId_1)) next_0.delete(eventId_1);
60
+ else next_0.add(eventId_1);
61
+ return next_0;
62
+ });
63
+ };
64
+ $[5] = t5;
65
+ } else t5 = $[5];
66
+ const toggleInlineExpansion = t5;
67
+ let t6;
68
+ if ($[6] !== expandedInlineIds) {
69
+ t6 = (eventId_2) => expandedInlineIds.has(eventId_2);
70
+ $[6] = expandedInlineIds;
71
+ $[7] = t6;
72
+ } else t6 = $[7];
73
+ const isInlineExpanded = t6;
74
+ let t7;
75
+ if ($[8] !== expandedInlineIds || $[9] !== isDetailPanelOpen || $[10] !== isInlineExpanded || $[11] !== isJsonMode || $[12] !== selectedEventId) {
76
+ t7 = {
77
+ isJsonMode,
78
+ selectedEventId,
79
+ isDetailPanelOpen,
80
+ expandedInlineIds,
81
+ toggleJsonMode,
82
+ setJsonMode,
83
+ selectEvent,
84
+ openDetailPanel,
85
+ closeDetailPanel,
86
+ toggleInlineExpansion,
87
+ isInlineExpanded
88
+ };
89
+ $[8] = expandedInlineIds;
90
+ $[9] = isDetailPanelOpen;
91
+ $[10] = isInlineExpanded;
92
+ $[11] = isJsonMode;
93
+ $[12] = selectedEventId;
94
+ $[13] = t7;
95
+ } else t7 = $[13];
96
+ return t7;
97
+ }
98
+ function _temp3(prev) {
99
+ const next = !prev;
100
+ localStorage.setItem("pipeline-events-json-mode", String(next));
101
+ return next;
102
+ }
103
+ function _temp2() {
104
+ return /* @__PURE__ */ new Set();
105
+ }
106
+ function _temp() {
107
+ if (typeof window !== "undefined") return localStorage.getItem("pipeline-events-json-mode") === "true";
108
+ return false;
109
+ }
110
+
111
+ //#endregion
112
+ export { useEventView };
@@ -0,0 +1,20 @@
1
+ import { ExecuteResult } from "../types.mjs";
2
+
3
+ //#region src/hooks/use-execute.d.ts
4
+ interface UseExecuteOptions {
5
+ /**
6
+ * Base URL for the API (default: "")
7
+ */
8
+ baseUrl?: string;
9
+ }
10
+ interface UseExecuteReturn {
11
+ execute: (fileId: string, pipelineId: string, versions: string[]) => Promise<ExecuteResult>;
12
+ executing: boolean;
13
+ result: ExecuteResult | null;
14
+ error: string | null;
15
+ executionId: string | null;
16
+ reset: () => void;
17
+ }
18
+ declare function useExecute(options?: UseExecuteOptions): UseExecuteReturn;
19
+ //#endregion
20
+ export { UseExecuteOptions, UseExecuteReturn, useExecute };
@@ -0,0 +1,68 @@
1
+ import { useCallback, useState } from "react";
2
+
3
+ //#region src/hooks/use-execute.ts
4
+ function useExecute(options = {}) {
5
+ const { baseUrl = "" } = options;
6
+ const [executing, setExecuting] = useState(false);
7
+ const [result, setResult] = useState(null);
8
+ const [error, setError] = useState(null);
9
+ const [executionId, setExecutionId] = useState(null);
10
+ return {
11
+ execute: useCallback(async (fileId, pipelineId, versions) => {
12
+ setExecuting(true);
13
+ setError(null);
14
+ setResult(null);
15
+ setExecutionId(null);
16
+ try {
17
+ const data = await (await fetch(`${baseUrl}/api/pipelines/${fileId}/${pipelineId}/execute`, {
18
+ method: "POST",
19
+ headers: { "Content-Type": "application/json" },
20
+ body: JSON.stringify({ versions })
21
+ })).json();
22
+ if (data.success && data.executionId) {
23
+ setExecutionId(data.executionId);
24
+ const successResult = {
25
+ success: true,
26
+ pipelineId,
27
+ executionId: data.executionId
28
+ };
29
+ setResult(successResult);
30
+ return successResult;
31
+ } else {
32
+ const errorResult_0 = {
33
+ success: false,
34
+ pipelineId,
35
+ executionId: data.executionId,
36
+ error: data.error ?? "Execution failed"
37
+ };
38
+ setResult(errorResult_0);
39
+ setError(errorResult_0.error ?? "Execution failed");
40
+ return errorResult_0;
41
+ }
42
+ } catch (err) {
43
+ const errorResult = {
44
+ success: false,
45
+ pipelineId,
46
+ error: err instanceof Error ? err.message : String(err)
47
+ };
48
+ setResult(errorResult);
49
+ setError(errorResult.error ?? "Execution failed");
50
+ return errorResult;
51
+ } finally {
52
+ setExecuting(false);
53
+ }
54
+ }, [baseUrl]),
55
+ executing,
56
+ result,
57
+ error,
58
+ executionId,
59
+ reset: useCallback(() => {
60
+ setResult(null);
61
+ setError(null);
62
+ setExecutionId(null);
63
+ }, [])
64
+ };
65
+ }
66
+
67
+ //#endregion
68
+ export { useExecute };
@@ -0,0 +1,20 @@
1
+ import { PipelineFileInfo } from "../types.mjs";
2
+
3
+ //#region src/hooks/use-pipeline-file.d.ts
4
+ interface PipelineFileResponse {
5
+ file?: PipelineFileInfo;
6
+ error?: string;
7
+ }
8
+ interface UsePipelineFileOptions {
9
+ baseUrl?: string;
10
+ fetchOnMount?: boolean;
11
+ }
12
+ interface UsePipelineFileReturn {
13
+ file: PipelineFileInfo | null;
14
+ loading: boolean;
15
+ error: string | null;
16
+ refetch: () => void;
17
+ }
18
+ declare function usePipelineFile(fileId: string, options?: UsePipelineFileOptions): UsePipelineFileReturn;
19
+ //#endregion
20
+ export { PipelineFileResponse, UsePipelineFileOptions, UsePipelineFileReturn, usePipelineFile };
@@ -0,0 +1,39 @@
1
+ import { useCallback, useEffect, useState } from "react";
2
+
3
+ //#region src/hooks/use-pipeline-file.ts
4
+ function usePipelineFile(fileId, options = {}) {
5
+ const { baseUrl = "", fetchOnMount = true } = options;
6
+ const [file, setFile] = useState(null);
7
+ const [loading, setLoading] = useState(fetchOnMount);
8
+ const [error, setError] = useState(null);
9
+ const fetchFile = useCallback(async () => {
10
+ setLoading(true);
11
+ setError(null);
12
+ try {
13
+ const res = await fetch(`${baseUrl}/api/pipelines/${fileId}`);
14
+ if (!res.ok) throw new Error(`HTTP ${res.status}`);
15
+ const json = await res.json();
16
+ if (json.error) {
17
+ setError(json.error);
18
+ setFile(null);
19
+ } else setFile(json.file ?? null);
20
+ } catch (err) {
21
+ setError(err instanceof Error ? err.message : "Failed to load pipeline file");
22
+ setFile(null);
23
+ } finally {
24
+ setLoading(false);
25
+ }
26
+ }, [baseUrl, fileId]);
27
+ useEffect(() => {
28
+ if (fetchOnMount) fetchFile();
29
+ }, [fetchOnMount, fetchFile]);
30
+ return {
31
+ file,
32
+ loading,
33
+ error,
34
+ refetch: fetchFile
35
+ };
36
+ }
37
+
38
+ //#endregion
39
+ export { usePipelineFile };
@@ -0,0 +1,10 @@
1
+ //#region src/hooks/use-pipeline-versions.d.ts
2
+ interface UsePipelineVersionsReturn {
3
+ selectedVersions: Set<string>;
4
+ toggleVersion: (version: string) => void;
5
+ selectAll: (versions: string[]) => void;
6
+ deselectAll: () => void;
7
+ }
8
+ declare function usePipelineVersions(pipelineId: string, allVersions: string[], storageKeyOverride?: string): UsePipelineVersionsReturn;
9
+ //#endregion
10
+ export { UsePipelineVersionsReturn, usePipelineVersions };
@@ -0,0 +1,137 @@
1
+ import { c } from "react/compiler-runtime";
2
+ import { useState } from "react";
3
+
4
+ //#region src/hooks/use-pipeline-versions.ts
5
+ const STORAGE_KEY_PREFIX = "ucd-versions-";
6
+ function getStorageKey(storageKey) {
7
+ return `${STORAGE_KEY_PREFIX}${storageKey}`;
8
+ }
9
+ function loadVersionsFromStorage(storageKey, allVersions) {
10
+ if (typeof window === "undefined") return new Set(allVersions);
11
+ try {
12
+ const stored = localStorage.getItem(getStorageKey(storageKey));
13
+ if (stored) {
14
+ const validVersions = JSON.parse(stored).filter((v) => allVersions.includes(v));
15
+ if (validVersions.length > 0) return new Set(validVersions);
16
+ }
17
+ } catch {}
18
+ return new Set(allVersions);
19
+ }
20
+ function saveVersionsToStorage(storageKey, versions) {
21
+ if (typeof window === "undefined") return;
22
+ try {
23
+ localStorage.setItem(getStorageKey(storageKey), JSON.stringify(Array.from(versions)));
24
+ } catch {}
25
+ }
26
+ function sanitizeVersions(versions, allVersions) {
27
+ const valid = Array.from(versions).filter((v) => allVersions.includes(v));
28
+ return new Set(valid.length > 0 ? valid : allVersions);
29
+ }
30
+ function usePipelineVersions(pipelineId, allVersions, storageKeyOverride) {
31
+ const $ = c(28);
32
+ let t0;
33
+ if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
34
+ t0 = {};
35
+ $[0] = t0;
36
+ } else t0 = $[0];
37
+ const [overridesByPipeline, setOverridesByPipeline] = useState(t0);
38
+ const storageKey = storageKeyOverride ?? pipelineId;
39
+ let t1;
40
+ if ($[1] !== allVersions || $[2] !== storageKey) {
41
+ t1 = loadVersionsFromStorage(storageKey, allVersions);
42
+ $[1] = allVersions;
43
+ $[2] = storageKey;
44
+ $[3] = t1;
45
+ } else t1 = $[3];
46
+ const baseSelection = t1;
47
+ const override = overridesByPipeline[pipelineId];
48
+ let t2;
49
+ if ($[4] !== baseSelection || $[5] !== override) {
50
+ t2 = override ? new Set(override) : baseSelection;
51
+ $[4] = baseSelection;
52
+ $[5] = override;
53
+ $[6] = t2;
54
+ } else t2 = $[6];
55
+ const source = t2;
56
+ let t3;
57
+ if ($[7] !== allVersions || $[8] !== source) {
58
+ t3 = sanitizeVersions(source, allVersions);
59
+ $[7] = allVersions;
60
+ $[8] = source;
61
+ $[9] = t3;
62
+ } else t3 = $[9];
63
+ const selectedVersions = t3;
64
+ let t4;
65
+ if ($[10] !== allVersions || $[11] !== pipelineId || $[12] !== selectedVersions || $[13] !== storageKey) {
66
+ t4 = (version) => {
67
+ setOverridesByPipeline((prev) => {
68
+ const current = prev[pipelineId] ? new Set(prev[pipelineId]) : selectedVersions;
69
+ const next = new Set(current);
70
+ if (next.has(version)) next.delete(version);
71
+ else next.add(version);
72
+ const sanitized = sanitizeVersions(next, allVersions);
73
+ saveVersionsToStorage(storageKey, sanitized);
74
+ return {
75
+ ...prev,
76
+ [pipelineId]: Array.from(sanitized)
77
+ };
78
+ });
79
+ };
80
+ $[10] = allVersions;
81
+ $[11] = pipelineId;
82
+ $[12] = selectedVersions;
83
+ $[13] = storageKey;
84
+ $[14] = t4;
85
+ } else t4 = $[14];
86
+ const toggleVersion = t4;
87
+ let t5;
88
+ if ($[15] !== allVersions || $[16] !== pipelineId || $[17] !== storageKey) {
89
+ t5 = (versions) => {
90
+ const sanitized_0 = sanitizeVersions(versions, allVersions);
91
+ saveVersionsToStorage(storageKey, sanitized_0);
92
+ setOverridesByPipeline((prev_0) => ({
93
+ ...prev_0,
94
+ [pipelineId]: Array.from(sanitized_0)
95
+ }));
96
+ };
97
+ $[15] = allVersions;
98
+ $[16] = pipelineId;
99
+ $[17] = storageKey;
100
+ $[18] = t5;
101
+ } else t5 = $[18];
102
+ const selectAll = t5;
103
+ let t6;
104
+ if ($[19] !== allVersions || $[20] !== pipelineId || $[21] !== storageKey) {
105
+ t6 = () => {
106
+ const sanitized_1 = sanitizeVersions([], allVersions);
107
+ saveVersionsToStorage(storageKey, sanitized_1);
108
+ setOverridesByPipeline((prev_1) => ({
109
+ ...prev_1,
110
+ [pipelineId]: Array.from(sanitized_1)
111
+ }));
112
+ };
113
+ $[19] = allVersions;
114
+ $[20] = pipelineId;
115
+ $[21] = storageKey;
116
+ $[22] = t6;
117
+ } else t6 = $[22];
118
+ const deselectAll = t6;
119
+ let t7;
120
+ if ($[23] !== deselectAll || $[24] !== selectAll || $[25] !== selectedVersions || $[26] !== toggleVersion) {
121
+ t7 = {
122
+ selectedVersions,
123
+ toggleVersion,
124
+ selectAll,
125
+ deselectAll
126
+ };
127
+ $[23] = deselectAll;
128
+ $[24] = selectAll;
129
+ $[25] = selectedVersions;
130
+ $[26] = toggleVersion;
131
+ $[27] = t7;
132
+ } else t7 = $[27];
133
+ return t7;
134
+ }
135
+
136
+ //#endregion
137
+ export { usePipelineVersions };
@@ -0,0 +1,21 @@
1
+ import { PipelineDetails } from "../types.mjs";
2
+
3
+ //#region src/hooks/use-pipeline.d.ts
4
+ interface UsePipelineOptions {
5
+ /** Base URL for the API (default: "") */
6
+ baseUrl?: string;
7
+ /** Whether to fetch on mount (default: true) */
8
+ fetchOnMount?: boolean;
9
+ }
10
+ interface UsePipelineReturn {
11
+ pipeline: PipelineDetails | null;
12
+ loading: boolean;
13
+ error: string | null;
14
+ refetch: () => void;
15
+ }
16
+ /**
17
+ * Hook to fetch and manage a single pipeline by ID
18
+ */
19
+ declare function usePipeline(fileId: string, pipelineId: string, options?: UsePipelineOptions): UsePipelineReturn;
20
+ //#endregion
21
+ export { UsePipelineOptions, UsePipelineReturn, usePipeline };
@@ -0,0 +1,46 @@
1
+ import { useCallback, useEffect, useState } from "react";
2
+
3
+ //#region src/hooks/use-pipeline.ts
4
+ /**
5
+ * Hook to fetch and manage a single pipeline by ID
6
+ */
7
+ function usePipeline(fileId, pipelineId, options = {}) {
8
+ const { baseUrl = "", fetchOnMount = true } = options;
9
+ const [pipeline, setPipeline] = useState(null);
10
+ const [loading, setLoading] = useState(fetchOnMount);
11
+ const [error, setError] = useState(null);
12
+ const fetchPipeline = useCallback(async () => {
13
+ setLoading(true);
14
+ setError(null);
15
+ try {
16
+ const res = await fetch(`${baseUrl}/api/pipelines/${fileId}/${pipelineId}`);
17
+ if (!res.ok) throw new Error(`HTTP ${res.status}`);
18
+ const json = await res.json();
19
+ if (json.error) {
20
+ setError(json.error);
21
+ setPipeline(null);
22
+ } else setPipeline(json.pipeline ?? null);
23
+ } catch (err) {
24
+ setError(err instanceof Error ? err.message : "Failed to load pipeline");
25
+ setPipeline(null);
26
+ } finally {
27
+ setLoading(false);
28
+ }
29
+ }, [
30
+ baseUrl,
31
+ fileId,
32
+ pipelineId
33
+ ]);
34
+ useEffect(() => {
35
+ if (fetchOnMount) fetchPipeline();
36
+ }, [fetchOnMount, fetchPipeline]);
37
+ return {
38
+ pipeline,
39
+ loading,
40
+ error,
41
+ refetch: fetchPipeline
42
+ };
43
+ }
44
+
45
+ //#endregion
46
+ export { usePipeline };
@@ -0,0 +1,26 @@
1
+ import { PipelinesResponse } from "../types.mjs";
2
+
3
+ //#region src/hooks/use-pipelines.d.ts
4
+ interface UsePipelinesOptions {
5
+ /**
6
+ * Base URL for the API (default: "")
7
+ */
8
+ baseUrl?: string;
9
+ /**
10
+ * Optional search query
11
+ */
12
+ search?: string;
13
+ /**
14
+ * Whether to fetch on mount (default: true)
15
+ */
16
+ fetchOnMount?: boolean;
17
+ }
18
+ interface UsePipelinesReturn {
19
+ data: PipelinesResponse | null;
20
+ loading: boolean;
21
+ error: string | null;
22
+ refetch: () => void;
23
+ }
24
+ declare function usePipelines(options?: UsePipelinesOptions): UsePipelinesReturn;
25
+ //#endregion
26
+ export { UsePipelinesOptions, UsePipelinesReturn, usePipelines };
@@ -0,0 +1,38 @@
1
+ import { useCallback, useEffect, useState } from "react";
2
+
3
+ //#region src/hooks/use-pipelines.ts
4
+ function usePipelines(options = {}) {
5
+ const { baseUrl = "", search, fetchOnMount = true } = options;
6
+ const [data, setData] = useState(null);
7
+ const [loading, setLoading] = useState(fetchOnMount);
8
+ const [error, setError] = useState(null);
9
+ const fetchPipelines = useCallback(async () => {
10
+ setLoading(true);
11
+ setError(null);
12
+ try {
13
+ const params = new URLSearchParams();
14
+ if (search && search.trim()) params.set("search", search.trim());
15
+ const queryString = params.toString();
16
+ const url = queryString ? `${baseUrl}/api/pipelines?${queryString}` : `${baseUrl}/api/pipelines`;
17
+ const res = await fetch(url);
18
+ if (!res.ok) throw new Error(`HTTP ${res.status}`);
19
+ setData(await res.json());
20
+ } catch (err) {
21
+ setError(err instanceof Error ? err.message : "Failed to load pipelines");
22
+ } finally {
23
+ setLoading(false);
24
+ }
25
+ }, [baseUrl, search]);
26
+ useEffect(() => {
27
+ if (fetchOnMount) fetchPipelines();
28
+ }, [fetchOnMount, fetchPipelines]);
29
+ return {
30
+ data,
31
+ loading,
32
+ error,
33
+ refetch: fetchPipelines
34
+ };
35
+ }
36
+
37
+ //#endregion
38
+ export { usePipelines };
@@ -0,0 +1,31 @@
1
+ import { PipelineSidebar } from "./components/pipeline-sidebar.mjs";
2
+ import { StatusBadge } from "./components/status-badge.mjs";
3
+ import { StatusIcon } from "./components/status-icon.mjs";
4
+ import { EventViewActions, EventViewState, useEventView } from "./hooks/use-event-view.mjs";
5
+ import { ExecuteResult, ExecutionEventItem, ExecutionEventsResponse, ExecutionLogItem, ExecutionLogPayload, ExecutionLogStream, ExecutionLogsResponse, LoadError, PipelineDetails, PipelineFileInfo, PipelineInfo, PipelineResponse, PipelinesResponse } from "./types.mjs";
6
+ import { UseExecuteOptions, UseExecuteReturn, useExecute } from "./hooks/use-execute.mjs";
7
+ import { UsePipelineOptions, UsePipelineReturn, usePipeline } from "./hooks/use-pipeline.mjs";
8
+ import { PipelineFileResponse, UsePipelineFileOptions, UsePipelineFileReturn, usePipelineFile } from "./hooks/use-pipeline-file.mjs";
9
+ import { UsePipelineVersionsReturn, usePipelineVersions } from "./hooks/use-pipeline-versions.mjs";
10
+ import { UsePipelinesOptions, UsePipelinesReturn, usePipelines } from "./hooks/use-pipelines.mjs";
11
+ import "./hooks/index.mjs";
12
+ import { ExecutionErrors, ExecutionErrorsProps, ExecutionResult, ExecutionResultProps, ExecutionSummary, ExecutionSummaryProps } from "./components/detail/execution-result.mjs";
13
+ import { VersionSelector, VersionSelectorProps } from "./components/detail/version-selector.mjs";
14
+ import { PipelineGraphDetails, PipelineGraphDetailsProps } from "./components/graph/details.mjs";
15
+ import { PipelineGraphFilters, PipelineGraphFiltersProps } from "./components/graph/filters.mjs";
16
+ import { nodeTypes } from "./components/graph/node-types.mjs";
17
+ import { ArtifactNode, FileNode, OutputNode, PipelineNodeData, RouteNode, SourceNode } from "./components/graph/nodes.mjs";
18
+ import { PipelineGraph, PipelineGraphProps } from "./components/graph/pipeline-graph.mjs";
19
+ import { ExecutionLogPayloadPanel, ExecutionLogPayloadPanelProps } from "./components/logs/execution-log-payload.mjs";
20
+ import { ExecutionLogTable, ExecutionLogTableProps } from "./components/logs/execution-log-table.mjs";
21
+ import { buildExecutionSpans, formatBytes, formatDuration, formatTimeLabel, formatTimestamp } from "./lib/execution-logs.mjs";
22
+ import { ExecutionSpanDrawer, ExecutionSpanDrawerProps } from "./components/logs/execution-span-drawer.mjs";
23
+ import { ExecutionWaterfall, ExecutionWaterfallProps } from "./components/logs/execution-waterfall.mjs";
24
+ import { PipelineFlowEdge, PipelineFlowNode, filterNodesByType, pipelineGraphToFlow } from "./lib/adapter.mjs";
25
+ import { getNodeColor, nodeTypeColors } from "./lib/colors.mjs";
26
+ import { formatHighPrecisionTime } from "./lib/format-time.mjs";
27
+ import { NODE_HEIGHT, NODE_WIDTH, applyLayout } from "./lib/layout.mjs";
28
+ import { toPipelineDetails, toPipelineInfo, toRouteDetails } from "./lib/pipeline-utils.mjs";
29
+ import { cn } from "./lib/utils.mjs";
30
+ import { ExecutionStatus } from "@ucdjs/pipelines-executor";
31
+ export { ArtifactNode, EventViewActions, EventViewState, type ExecuteResult, ExecutionErrors, type ExecutionErrorsProps, type ExecutionEventItem, type ExecutionEventsResponse, type ExecutionLogItem, type ExecutionLogPayload, ExecutionLogPayloadPanel, type ExecutionLogPayloadPanelProps, type ExecutionLogStream, ExecutionLogTable, type ExecutionLogTableProps, type ExecutionLogsResponse, ExecutionResult, type ExecutionResultProps, ExecutionSpanDrawer, type ExecutionSpanDrawerProps, type ExecutionStatus, ExecutionSummary, type ExecutionSummaryProps, ExecutionWaterfall, type ExecutionWaterfallProps, FileNode, type LoadError, NODE_HEIGHT, NODE_WIDTH, OutputNode, type PipelineDetails, type PipelineFileInfo, PipelineFileResponse, type PipelineFlowEdge, type PipelineFlowNode, PipelineGraph, PipelineGraphDetails, type PipelineGraphDetailsProps, PipelineGraphFilters, type PipelineGraphFiltersProps, type PipelineGraphProps, type PipelineInfo, type PipelineNodeData, type PipelineResponse, PipelineSidebar, type PipelinesResponse, RouteNode, SourceNode, StatusBadge, StatusIcon, UseExecuteOptions, UseExecuteReturn, UsePipelineFileOptions, UsePipelineFileReturn, UsePipelineOptions, UsePipelineReturn, UsePipelineVersionsReturn, UsePipelinesOptions, UsePipelinesReturn, VersionSelector, type VersionSelectorProps, applyLayout, buildExecutionSpans, cn, filterNodesByType, formatBytes, formatDuration, formatHighPrecisionTime, formatTimeLabel, formatTimestamp, getNodeColor, nodeTypeColors, nodeTypes, pipelineGraphToFlow, toPipelineDetails, toPipelineInfo, toRouteDetails, useEventView, useExecute, usePipeline, usePipelineFile, usePipelineVersions, usePipelines };
package/dist/index.mjs ADDED
@@ -0,0 +1,29 @@
1
+ import { cn } from "./lib/utils.mjs";
2
+ import { ExecutionErrors, ExecutionResult, ExecutionSummary } from "./components/detail/execution-result.mjs";
3
+ import { VersionSelector } from "./components/detail/version-selector.mjs";
4
+ import { PipelineGraphDetails } from "./components/graph/details.mjs";
5
+ import { PipelineGraphFilters } from "./components/graph/filters.mjs";
6
+ import { ArtifactNode, FileNode, OutputNode, RouteNode, SourceNode } from "./components/graph/nodes.mjs";
7
+ import { nodeTypes } from "./components/graph/node-types.mjs";
8
+ import { filterNodesByType, pipelineGraphToFlow } from "./lib/adapter.mjs";
9
+ import { getNodeColor, nodeTypeColors } from "./lib/colors.mjs";
10
+ import { NODE_HEIGHT, NODE_WIDTH, applyLayout } from "./lib/layout.mjs";
11
+ import { PipelineGraph } from "./components/graph/pipeline-graph.mjs";
12
+ import { ExecutionLogPayloadPanel } from "./components/logs/execution-log-payload.mjs";
13
+ import { buildExecutionSpans, formatBytes, formatDuration, formatTimeLabel, formatTimestamp } from "./lib/execution-logs.mjs";
14
+ import { ExecutionLogTable } from "./components/logs/execution-log-table.mjs";
15
+ import { ExecutionSpanDrawer } from "./components/logs/execution-span-drawer.mjs";
16
+ import { ExecutionWaterfall } from "./components/logs/execution-waterfall.mjs";
17
+ import { useEventView } from "./hooks/use-event-view.mjs";
18
+ import { useExecute } from "./hooks/use-execute.mjs";
19
+ import { usePipeline } from "./hooks/use-pipeline.mjs";
20
+ import { usePipelineFile } from "./hooks/use-pipeline-file.mjs";
21
+ import { usePipelineVersions } from "./hooks/use-pipeline-versions.mjs";
22
+ import { usePipelines } from "./hooks/use-pipelines.mjs";
23
+ import { PipelineSidebar } from "./components/pipeline-sidebar.mjs";
24
+ import { StatusBadge } from "./components/status-badge.mjs";
25
+ import { StatusIcon } from "./components/status-icon.mjs";
26
+ import { formatHighPrecisionTime } from "./lib/format-time.mjs";
27
+ import { toPipelineDetails, toPipelineInfo, toRouteDetails } from "./lib/pipeline-utils.mjs";
28
+
29
+ export { ArtifactNode, ExecutionErrors, ExecutionLogPayloadPanel, ExecutionLogTable, ExecutionResult, ExecutionSpanDrawer, ExecutionSummary, ExecutionWaterfall, FileNode, NODE_HEIGHT, NODE_WIDTH, OutputNode, PipelineGraph, PipelineGraphDetails, PipelineGraphFilters, PipelineSidebar, RouteNode, SourceNode, StatusBadge, StatusIcon, VersionSelector, applyLayout, buildExecutionSpans, cn, filterNodesByType, formatBytes, formatDuration, formatHighPrecisionTime, formatTimeLabel, formatTimestamp, getNodeColor, nodeTypeColors, nodeTypes, pipelineGraphToFlow, toPipelineDetails, toPipelineInfo, toRouteDetails, useEventView, useExecute, usePipeline, usePipelineFile, usePipelineVersions, usePipelines };
@@ -0,0 +1,26 @@
1
+ import { Edge, Node } from "@xyflow/react";
2
+ import { PipelineGraph, PipelineGraphEdge, PipelineGraphNode, PipelineGraphNodeType } from "@ucdjs/pipelines-core";
3
+
4
+ //#region src/lib/adapter.d.ts
5
+ interface PipelineFlowNode extends Node {
6
+ data: {
7
+ pipelineNode: PipelineGraphNode;
8
+ label: string;
9
+ };
10
+ type: PipelineGraphNodeType;
11
+ }
12
+ interface PipelineFlowEdge extends Edge {
13
+ data: {
14
+ pipelineEdge: PipelineGraphEdge;
15
+ };
16
+ }
17
+ declare function pipelineGraphToFlow(graph: PipelineGraph): {
18
+ nodes: PipelineFlowNode[];
19
+ edges: PipelineFlowEdge[];
20
+ };
21
+ declare function filterNodesByType(nodes: PipelineFlowNode[], edges: PipelineFlowEdge[], visibleTypes: Set<PipelineGraphNodeType>): {
22
+ nodes: PipelineFlowNode[];
23
+ edges: PipelineFlowEdge[];
24
+ };
25
+ //#endregion
26
+ export { PipelineFlowEdge, PipelineFlowNode, filterNodesByType, pipelineGraphToFlow };