@remoraflow/ui 0.1.0

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 (44) hide show
  1. package/LICENSE +674 -0
  2. package/dist/edges/workflow-edge.d.ts +3 -0
  3. package/dist/edges/workflow-edge.d.ts.map +1 -0
  4. package/dist/execution-state.d.ts +34 -0
  5. package/dist/execution-state.d.ts.map +1 -0
  6. package/dist/graph-layout.d.ts +17 -0
  7. package/dist/graph-layout.d.ts.map +1 -0
  8. package/dist/index.d.ts +10 -0
  9. package/dist/index.d.ts.map +1 -0
  10. package/dist/index.js +2708 -0
  11. package/dist/index.js.map +28 -0
  12. package/dist/nodes/agent-loop-node.d.ts +3 -0
  13. package/dist/nodes/agent-loop-node.d.ts.map +1 -0
  14. package/dist/nodes/base-node.d.ts +20 -0
  15. package/dist/nodes/base-node.d.ts.map +1 -0
  16. package/dist/nodes/end-node.d.ts +3 -0
  17. package/dist/nodes/end-node.d.ts.map +1 -0
  18. package/dist/nodes/extract-data-node.d.ts +3 -0
  19. package/dist/nodes/extract-data-node.d.ts.map +1 -0
  20. package/dist/nodes/for-each-node.d.ts +3 -0
  21. package/dist/nodes/for-each-node.d.ts.map +1 -0
  22. package/dist/nodes/group-header-node.d.ts +3 -0
  23. package/dist/nodes/group-header-node.d.ts.map +1 -0
  24. package/dist/nodes/llm-prompt-node.d.ts +3 -0
  25. package/dist/nodes/llm-prompt-node.d.ts.map +1 -0
  26. package/dist/nodes/sleep-node.d.ts +3 -0
  27. package/dist/nodes/sleep-node.d.ts.map +1 -0
  28. package/dist/nodes/start-node.d.ts +3 -0
  29. package/dist/nodes/start-node.d.ts.map +1 -0
  30. package/dist/nodes/start-step-node.d.ts +3 -0
  31. package/dist/nodes/start-step-node.d.ts.map +1 -0
  32. package/dist/nodes/switch-case-node.d.ts +3 -0
  33. package/dist/nodes/switch-case-node.d.ts.map +1 -0
  34. package/dist/nodes/tool-call-node.d.ts +3 -0
  35. package/dist/nodes/tool-call-node.d.ts.map +1 -0
  36. package/dist/nodes/wait-for-condition-node.d.ts +3 -0
  37. package/dist/nodes/wait-for-condition-node.d.ts.map +1 -0
  38. package/dist/panels/step-detail-panel.d.ts +11 -0
  39. package/dist/panels/step-detail-panel.d.ts.map +1 -0
  40. package/dist/theme.d.ts +17 -0
  41. package/dist/theme.d.ts.map +1 -0
  42. package/dist/workflow-viewer.d.ts +41 -0
  43. package/dist/workflow-viewer.d.ts.map +1 -0
  44. package/package.json +48 -0
@@ -0,0 +1,41 @@
1
+ import type { Diagnostic, ExecutionState, WorkflowDefinition, WorkflowStep } from "@remoraflow/core";
2
+ /** Props for the {@link WorkflowViewer} component. */
3
+ export interface WorkflowViewerProps {
4
+ /** The workflow definition to visualize. */
5
+ workflow: WorkflowDefinition;
6
+ /** Compiler diagnostics to display on affected nodes. */
7
+ diagnostics?: Diagnostic[];
8
+ /** Called when a step node is clicked (with the step and its diagnostics) or when the selection is cleared (with `null`). */
9
+ onStepSelect?: (step: WorkflowStep | null, diagnostics: Diagnostic[]) => void;
10
+ /** Execution state to visualize on the workflow DAG. */
11
+ executionState?: ExecutionState;
12
+ /** Whether to show the minimap. @default true */
13
+ showMinimap?: boolean;
14
+ /** Width of the minimap in pixels (capped at 25% of viewer width). @default 200 */
15
+ minimapWidth?: number;
16
+ /** Height of the minimap in pixels. @default 150 */
17
+ minimapHeight?: number;
18
+ }
19
+ /**
20
+ * React component that renders a workflow as an interactive DAG using React Flow.
21
+ * Supports step selection via callback, minimap, and zoom controls.
22
+ *
23
+ * Dark mode is detected automatically via the `dark` class on `<html>`,
24
+ * following the shadcn/Tailwind convention (`darkMode: "class"`).
25
+ *
26
+ * Requires `@xyflow/react` as a peer dependency.
27
+ *
28
+ * @example
29
+ * ```tsx
30
+ * import { WorkflowViewer } from "remora/viewer";
31
+ *
32
+ * <WorkflowViewer
33
+ * workflow={myWorkflow}
34
+ * diagnostics={compileResult.diagnostics}
35
+ * executionState={executionState}
36
+ * onStepSelect={(step, diagnostics) => console.log("Selected:", step?.id)}
37
+ * />
38
+ * ```
39
+ */
40
+ export declare function WorkflowViewer({ workflow, diagnostics, onStepSelect, executionState, showMinimap, minimapWidth, minimapHeight, }: WorkflowViewerProps): import("react/jsx-runtime").JSX.Element;
41
+ //# sourceMappingURL=workflow-viewer.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"workflow-viewer.d.ts","sourceRoot":"","sources":["../src/workflow-viewer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACX,UAAU,EACV,cAAc,EAEd,kBAAkB,EAClB,YAAY,EACZ,MAAM,kBAAkB,CAAC;AAoD1B,sDAAsD;AACtD,MAAM,WAAW,mBAAmB;IACnC,4CAA4C;IAC5C,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,yDAAyD;IACzD,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,6HAA6H;IAC7H,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,GAAG,IAAI,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IAC9E,wDAAwD;IACxD,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,iDAAiD;IACjD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mFAAmF;IACnF,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oDAAoD;IACpD,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,cAAc,CAAC,EAC9B,QAAQ,EACR,WAA+B,EAC/B,YAAY,EACZ,cAAc,EACd,WAAkB,EAClB,YAAkB,EAClB,aAAmB,GACnB,EAAE,mBAAmB,2CA6HrB"}
package/package.json ADDED
@@ -0,0 +1,48 @@
1
+ {
2
+ "name": "@remoraflow/ui",
3
+ "version": "0.1.0",
4
+ "description": "React viewer components for Remora workflow visualization",
5
+ "publishConfig": {
6
+ "access": "public"
7
+ },
8
+ "homepage": "https://isaacwasserman.github.io/remora/",
9
+ "repository": {
10
+ "type": "git",
11
+ "url": "https://github.com/isaacwasserman/remora",
12
+ "directory": "packages/ui"
13
+ },
14
+ "license": "GPL-3.0",
15
+ "type": "module",
16
+ "exports": {
17
+ ".": {
18
+ "import": "./dist/index.js",
19
+ "types": "./dist/index.d.ts"
20
+ }
21
+ },
22
+ "files": [
23
+ "dist",
24
+ "README.md",
25
+ "LICENSE"
26
+ ],
27
+ "scripts": {
28
+ "build": "bun scripts/build.ts",
29
+ "prepublishOnly": "bun run build",
30
+ "test": "bun test"
31
+ },
32
+ "dependencies": {
33
+ "@remoraflow/core": "workspace:*",
34
+ "@dagrejs/dagre": "^2.0.4"
35
+ },
36
+ "peerDependencies": {
37
+ "react": "^18.0.0 || ^19.0.0",
38
+ "react-dom": "^18.0.0 || ^19.0.0",
39
+ "@xyflow/react": "^12.0.0"
40
+ },
41
+ "devDependencies": {
42
+ "@types/react": "^19.2.14",
43
+ "@types/react-dom": "^19.2.3",
44
+ "@xyflow/react": "^12.10.1",
45
+ "react": "^19.2.4",
46
+ "react-dom": "^19.2.4"
47
+ }
48
+ }