@goplasmatic/dataflow-ui 2.0.11 → 2.0.13

package/dist/dataflow-ui.css

@@ -5902,6 +5902,40 @@ svg.react-flow__connectionline {
   color: white;
 }
 
+.df-debug-toolbar-options {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  padding-left: 8px;
+  border-left: 1px solid var(--df-border-color);
+}
+
+.df-debug-toolbar-checkbox-label {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 11px;
+  color: var(--df-text-secondary);
+  cursor: pointer;
+  user-select: none;
+}
+
+.df-debug-toolbar-checkbox-label:hover {
+  color: var(--df-text-primary);
+}
+
+.df-debug-toolbar-checkbox {
+  width: 14px;
+  height: 14px;
+  cursor: pointer;
+  accent-color: var(--df-accent-primary);
+}
+
+.df-debug-toolbar-checkbox:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
 .df-debug-toolbar-actions {
   display: flex;
   align-items: center;

package/dist/index.cjs

@@ -581,8 +581,18 @@ const initialState = {
   // 500ms between steps
   inputPayload: null,
   isExecuting: false,
-  executionError: null
+  executionError: null,
+  skipFailedConditions: false
 };
+function getFilteredStepIndices(trace, skipFailedConditions) {
+  if (!trace || trace.steps.length === 0) {
+    return [];
+  }
+  if (!skipFailedConditions) {
+    return trace.steps.map((_2, i) => i);
+  }
+  return trace.steps.map((step, i) => ({ step, index: i })).filter(({ step }) => step.result !== "skipped").map(({ index: index2 }) => index2);
+}
 function debuggerReducer(state, action) {
   switch (action.type) {
     case "ACTIVATE":
@@ -651,29 +661,58 @@ function debuggerReducer(state, action) {
         playbackState: "stopped",
         executionError: null
       };
-    case "STEP_FORWARD":
+    case "STEP_FORWARD": {
       if (!state.trace || state.trace.steps.length === 0) {
         return state;
       }
-      if (state.currentStepIndex >= state.trace.steps.length - 1) {
+      const filteredIndices = getFilteredStepIndices(state.trace, state.skipFailedConditions);
+      if (filteredIndices.length === 0) {
+        return state;
+      }
+      const currentFilteredPos = filteredIndices.findIndex((i) => i === state.currentStepIndex);
+      let nextIndex;
+      if (state.currentStepIndex === -1) {
+        nextIndex = filteredIndices[0];
+      } else if (currentFilteredPos === -1) {
+        nextIndex = filteredIndices[0];
+      } else if (currentFilteredPos >= filteredIndices.length - 1) {
         return {
           ...state,
           playbackState: "paused"
-          // Auto-pause at end
         };
+      } else {
+        nextIndex = filteredIndices[currentFilteredPos + 1];
       }
       return {
         ...state,
-        currentStepIndex: state.currentStepIndex + 1
+        currentStepIndex: nextIndex
       };
-    case "STEP_BACKWARD":
-      if (state.currentStepIndex <= -1) return state;
+    }
+    case "STEP_BACKWARD": {
+      if (!state.trace || state.currentStepIndex <= -1) {
+        return state;
+      }
+      const filteredIndices = getFilteredStepIndices(state.trace, state.skipFailedConditions);
+      if (filteredIndices.length === 0) {
+        return {
+          ...state,
+          currentStepIndex: -1,
+          playbackState: "paused"
+        };
+      }
+      const currentFilteredPos = filteredIndices.findIndex((i) => i === state.currentStepIndex);
+      let prevIndex;
+      if (currentFilteredPos <= 0) {
+        prevIndex = -1;
+      } else {
+        prevIndex = filteredIndices[currentFilteredPos - 1];
+      }
       return {
         ...state,
-        currentStepIndex: state.currentStepIndex - 1,
+        currentStepIndex: prevIndex,
         playbackState: "paused"
-        // Pause on manual step
       };
+    }
     case "GO_TO_STEP":
       if (!state.trace || action.index < 0 || action.index >= state.trace.steps.length) return state;
       return {
@@ -687,6 +726,25 @@ function debuggerReducer(state, action) {
         ...state,
         playbackSpeed: Math.max(100, Math.min(2e3, action.speed))
       };
+    case "SET_SKIP_FAILED_CONDITIONS": {
+      if (action.skip && state.trace && state.currentStepIndex >= 0) {
+        const currentStep = state.trace.steps[state.currentStepIndex];
+        if (currentStep && currentStep.result === "skipped") {
+          const filteredIndices = getFilteredStepIndices(state.trace, true);
+          const nextValidIndex = filteredIndices.find((i) => i > state.currentStepIndex);
+          const prevValidIndex = [...filteredIndices].reverse().find((i) => i < state.currentStepIndex);
+          return {
+            ...state,
+            skipFailedConditions: action.skip,
+            currentStepIndex: nextValidIndex ?? prevValidIndex ?? -1
+          };
+        }
+      }
+      return {
+        ...state,
+        skipFailedConditions: action.skip
+      };
+    }
     default:
       return state;
   }
@@ -730,6 +788,10 @@ function DebuggerProvider({
   const stepBackward = require$$0.useCallback(() => dispatch2({ type: "STEP_BACKWARD" }), []);
   const goToStep = require$$0.useCallback((index2) => dispatch2({ type: "GO_TO_STEP", index: index2 }), []);
   const setSpeed = require$$0.useCallback((speed) => dispatch2({ type: "SET_SPEED", speed }), []);
+  const setSkipFailedConditions = require$$0.useCallback(
+    (skip) => dispatch2({ type: "SET_SKIP_FAILED_CONDITIONS", skip }),
+    []
+  );
   const runExecution = require$$0.useCallback(
     async (workflows, payload) => {
       var _a;
@@ -782,11 +844,13 @@ function DebuggerProvider({
   const currentStep = state.trace && state.currentStepIndex >= 0 ? state.trace.steps[state.currentStepIndex] : null;
   const currentMessage = state.trace && state.currentStepIndex >= 0 ? getMessageAtStep(state.trace, state.currentStepIndex) : null;
   const currentChanges = state.trace && state.currentStepIndex >= 0 ? getChangesAtStep(state.trace, state.currentStepIndex) : [];
-  const totalSteps = state.trace ? state.trace.steps.length : 0;
+  const filteredStepIndices = getFilteredStepIndices(state.trace, state.skipFailedConditions);
+  const totalSteps = filteredStepIndices.length;
+  const currentFilteredPos = state.currentStepIndex >= 0 ? filteredStepIndices.findIndex((i) => i === state.currentStepIndex) : -1;
   const isAtStart = state.currentStepIndex <= -1;
-  const isAtEnd = state.currentStepIndex >= totalSteps - 1 && state.currentStepIndex >= 0;
+  const isAtEnd = currentFilteredPos >= totalSteps - 1 && currentFilteredPos >= 0;
   const hasTrace = state.trace !== null && totalSteps > 0;
-  const progress = totalSteps > 0 && state.currentStepIndex >= 0 ? (state.currentStepIndex + 1) / totalSteps : 0;
+  const progress = totalSteps > 0 && currentFilteredPos >= 0 ? (currentFilteredPos + 1) / totalSteps : 0;
   const value = {
     state,
     dispatch: dispatch2,
@@ -804,6 +868,7 @@ function DebuggerProvider({
     stepBackward,
     goToStep,
     setSpeed,
+    setSkipFailedConditions,
     runExecution,
     currentStep,
     currentMessage,
@@ -813,7 +878,10 @@ function DebuggerProvider({
     hasTrace,
     progress,
     totalSteps,
-    isEngineReady
+    currentFilteredPosition: currentFilteredPos,
+    filteredStepIndices,
+    isEngineReady,
+    skipFailedConditions: state.skipFailedConditions
   };
   return /* @__PURE__ */ jsxRuntime.jsx(DebuggerContext.Provider, { value, children: children2 });
 }
@@ -21101,9 +21169,13 @@ function IntegratedDebugToolbar({
     isAtEnd,
     hasTrace,
     totalSteps,
-    isEngineReady
+    currentFilteredPosition,
+    filteredStepIndices,
+    isEngineReady,
+    skipFailedConditions,
+    setSkipFailedConditions
   } = useDebugger();
-  const { playbackState, currentStepIndex, isExecuting, executionError, trace } = state;
+  const { playbackState, isExecuting, executionError, trace } = state;
   const lastExecutionRef = require$$0.useRef(null);
   const handleExecute = require$$0.useCallback(async () => {
     var _a, _b;
@@ -21148,10 +21220,10 @@ function IntegratedDebugToolbar({
     }
   }, [hasTrace, stop]);
   const goToLast = require$$0.useCallback(() => {
-    if (hasTrace && totalSteps > 0) {
-      goToStep(totalSteps - 1);
+    if (hasTrace && filteredStepIndices.length > 0) {
+      goToStep(filteredStepIndices[filteredStepIndices.length - 1]);
     }
-  }, [hasTrace, totalSteps, goToStep]);
+  }, [hasTrace, filteredStepIndices, goToStep]);
   require$$0.useEffect(() => {
     if (!autoExecute || !isEngineReady || workflows.length === 0) return;
     const timeoutId = setTimeout(() => {
@@ -21236,10 +21308,10 @@ function IntegratedDebugToolbar({
     if (!hasTrace) {
       return "Ready";
     }
-    if (currentStepIndex < 0) {
+    if (currentFilteredPosition < 0) {
       return "Ready";
     }
-    return `Step ${currentStepIndex + 1} / ${totalSteps}`;
+    return `Step ${currentFilteredPosition + 1} / ${totalSteps}`;
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `df-debug-toolbar-integrated ${className}`, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "df-debug-toolbar-status", children: [
@@ -21307,6 +21379,19 @@ function IntegratedDebugToolbar({
         }
       )
     ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "df-debug-toolbar-options", children: /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "df-debug-toolbar-checkbox-label", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          type: "checkbox",
+          checked: skipFailedConditions,
+          onChange: (e) => setSkipFailedConditions(e.target.checked),
+          className: "df-debug-toolbar-checkbox",
+          disabled: isExecuting
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Filter Workflows" })
+    ] }) }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "df-debug-toolbar-actions", children: hasTrace ? /* @__PURE__ */ jsxRuntime.jsxs(
       "button",
       {
@@ -22323,7 +22408,7 @@ function JsonEditor({
         acceptSuggestionOnEnter: "off",
         formatOnPaste: true,
         formatOnType: false,
-        glyphMargin: highlightedPaths && highlightedPaths.length > 0
+        glyphMargin: false
       }
     }
   ) });

package/dist/index.d.ts

@@ -162,6 +162,9 @@ export declare type DebuggerAction = {
 } | {
     type: 'SET_SPEED';
     speed: number;
+} | {
+    type: 'SET_SKIP_FAILED_CONDITIONS';
+    skip: boolean;
 };
 
 /**
@@ -184,6 +187,7 @@ declare interface DebuggerContextValue {
     stepBackward: () => void;
     goToStep: (index: number) => void;
     setSpeed: (speed: number) => void;
+    setSkipFailedConditions: (skip: boolean) => void;
     runExecution: (workflows: Workflow[], payload: Record<string, unknown>) => Promise<ExecutionTrace | null>;
     currentStep: ExecutionStep | null;
     currentMessage: Message | null;
@@ -193,7 +197,12 @@ declare interface DebuggerContextValue {
     hasTrace: boolean;
     progress: number;
     totalSteps: number;
+    /** Current position within filtered steps (0-indexed), -1 if at ready state */
+    currentFilteredPosition: number;
+    /** Array of actual step indices that are shown (for navigation) */
+    filteredStepIndices: number[];
     isEngineReady: boolean;
+    skipFailedConditions: boolean;
 }
 
 /**
@@ -247,6 +256,8 @@ export declare interface DebuggerState {
     isExecuting: boolean;
     /** Error during execution */
     executionError: string | null;
+    /** Whether to skip steps with failed conditions (result: 'skipped') */
+    skipFailedConditions: boolean;
 }
 
 /**

package/dist/index.js

@@ -579,8 +579,18 @@ const initialState = {
   // 500ms between steps
   inputPayload: null,
   isExecuting: false,
-  executionError: null
+  executionError: null,
+  skipFailedConditions: false
 };
+function getFilteredStepIndices(trace, skipFailedConditions) {
+  if (!trace || trace.steps.length === 0) {
+    return [];
+  }
+  if (!skipFailedConditions) {
+    return trace.steps.map((_2, i) => i);
+  }
+  return trace.steps.map((step, i) => ({ step, index: i })).filter(({ step }) => step.result !== "skipped").map(({ index: index2 }) => index2);
+}
 function debuggerReducer(state, action) {
   switch (action.type) {
     case "ACTIVATE":
@@ -649,29 +659,58 @@ function debuggerReducer(state, action) {
         playbackState: "stopped",
         executionError: null
       };
-    case "STEP_FORWARD":
+    case "STEP_FORWARD": {
       if (!state.trace || state.trace.steps.length === 0) {
         return state;
       }
-      if (state.currentStepIndex >= state.trace.steps.length - 1) {
+      const filteredIndices = getFilteredStepIndices(state.trace, state.skipFailedConditions);
+      if (filteredIndices.length === 0) {
+        return state;
+      }
+      const currentFilteredPos = filteredIndices.findIndex((i) => i === state.currentStepIndex);
+      let nextIndex;
+      if (state.currentStepIndex === -1) {
+        nextIndex = filteredIndices[0];
+      } else if (currentFilteredPos === -1) {
+        nextIndex = filteredIndices[0];
+      } else if (currentFilteredPos >= filteredIndices.length - 1) {
         return {
           ...state,
           playbackState: "paused"
-          // Auto-pause at end
         };
+      } else {
+        nextIndex = filteredIndices[currentFilteredPos + 1];
       }
       return {
         ...state,
-        currentStepIndex: state.currentStepIndex + 1
+        currentStepIndex: nextIndex
       };
-    case "STEP_BACKWARD":
-      if (state.currentStepIndex <= -1) return state;
+    }
+    case "STEP_BACKWARD": {
+      if (!state.trace || state.currentStepIndex <= -1) {
+        return state;
+      }
+      const filteredIndices = getFilteredStepIndices(state.trace, state.skipFailedConditions);
+      if (filteredIndices.length === 0) {
+        return {
+          ...state,
+          currentStepIndex: -1,
+          playbackState: "paused"
+        };
+      }
+      const currentFilteredPos = filteredIndices.findIndex((i) => i === state.currentStepIndex);
+      let prevIndex;
+      if (currentFilteredPos <= 0) {
+        prevIndex = -1;
+      } else {
+        prevIndex = filteredIndices[currentFilteredPos - 1];
+      }
       return {
         ...state,
-        currentStepIndex: state.currentStepIndex - 1,
+        currentStepIndex: prevIndex,
         playbackState: "paused"
-        // Pause on manual step
       };
+    }
     case "GO_TO_STEP":
       if (!state.trace || action.index < 0 || action.index >= state.trace.steps.length) return state;
       return {
@@ -685,6 +724,25 @@ function debuggerReducer(state, action) {
         ...state,
         playbackSpeed: Math.max(100, Math.min(2e3, action.speed))
       };
+    case "SET_SKIP_FAILED_CONDITIONS": {
+      if (action.skip && state.trace && state.currentStepIndex >= 0) {
+        const currentStep = state.trace.steps[state.currentStepIndex];
+        if (currentStep && currentStep.result === "skipped") {
+          const filteredIndices = getFilteredStepIndices(state.trace, true);
+          const nextValidIndex = filteredIndices.find((i) => i > state.currentStepIndex);
+          const prevValidIndex = [...filteredIndices].reverse().find((i) => i < state.currentStepIndex);
+          return {
+            ...state,
+            skipFailedConditions: action.skip,
+            currentStepIndex: nextValidIndex ?? prevValidIndex ?? -1
+          };
+        }
+      }
+      return {
+        ...state,
+        skipFailedConditions: action.skip
+      };
+    }
     default:
       return state;
   }
@@ -728,6 +786,10 @@ function DebuggerProvider({
   const stepBackward = useCallback(() => dispatch2({ type: "STEP_BACKWARD" }), []);
   const goToStep = useCallback((index2) => dispatch2({ type: "GO_TO_STEP", index: index2 }), []);
   const setSpeed = useCallback((speed) => dispatch2({ type: "SET_SPEED", speed }), []);
+  const setSkipFailedConditions = useCallback(
+    (skip) => dispatch2({ type: "SET_SKIP_FAILED_CONDITIONS", skip }),
+    []
+  );
   const runExecution = useCallback(
     async (workflows, payload) => {
       var _a;
@@ -780,11 +842,13 @@ function DebuggerProvider({
   const currentStep = state.trace && state.currentStepIndex >= 0 ? state.trace.steps[state.currentStepIndex] : null;
   const currentMessage = state.trace && state.currentStepIndex >= 0 ? getMessageAtStep(state.trace, state.currentStepIndex) : null;
   const currentChanges = state.trace && state.currentStepIndex >= 0 ? getChangesAtStep(state.trace, state.currentStepIndex) : [];
-  const totalSteps = state.trace ? state.trace.steps.length : 0;
+  const filteredStepIndices = getFilteredStepIndices(state.trace, state.skipFailedConditions);
+  const totalSteps = filteredStepIndices.length;
+  const currentFilteredPos = state.currentStepIndex >= 0 ? filteredStepIndices.findIndex((i) => i === state.currentStepIndex) : -1;
   const isAtStart = state.currentStepIndex <= -1;
-  const isAtEnd = state.currentStepIndex >= totalSteps - 1 && state.currentStepIndex >= 0;
+  const isAtEnd = currentFilteredPos >= totalSteps - 1 && currentFilteredPos >= 0;
   const hasTrace = state.trace !== null && totalSteps > 0;
-  const progress = totalSteps > 0 && state.currentStepIndex >= 0 ? (state.currentStepIndex + 1) / totalSteps : 0;
+  const progress = totalSteps > 0 && currentFilteredPos >= 0 ? (currentFilteredPos + 1) / totalSteps : 0;
   const value = {
     state,
     dispatch: dispatch2,
@@ -802,6 +866,7 @@ function DebuggerProvider({
     stepBackward,
     goToStep,
     setSpeed,
+    setSkipFailedConditions,
     runExecution,
     currentStep,
     currentMessage,
@@ -811,7 +876,10 @@ function DebuggerProvider({
     hasTrace,
     progress,
     totalSteps,
-    isEngineReady
+    currentFilteredPosition: currentFilteredPos,
+    filteredStepIndices,
+    isEngineReady,
+    skipFailedConditions: state.skipFailedConditions
   };
   return /* @__PURE__ */ jsx(DebuggerContext.Provider, { value, children: children2 });
 }
@@ -21099,9 +21167,13 @@ function IntegratedDebugToolbar({
     isAtEnd,
     hasTrace,
     totalSteps,
-    isEngineReady
+    currentFilteredPosition,
+    filteredStepIndices,
+    isEngineReady,
+    skipFailedConditions,
+    setSkipFailedConditions
   } = useDebugger();
-  const { playbackState, currentStepIndex, isExecuting, executionError, trace } = state;
+  const { playbackState, isExecuting, executionError, trace } = state;
   const lastExecutionRef = useRef(null);
   const handleExecute = useCallback(async () => {
     var _a, _b;
@@ -21146,10 +21218,10 @@ function IntegratedDebugToolbar({
     }
   }, [hasTrace, stop]);
   const goToLast = useCallback(() => {
-    if (hasTrace && totalSteps > 0) {
-      goToStep(totalSteps - 1);
+    if (hasTrace && filteredStepIndices.length > 0) {
+      goToStep(filteredStepIndices[filteredStepIndices.length - 1]);
     }
-  }, [hasTrace, totalSteps, goToStep]);
+  }, [hasTrace, filteredStepIndices, goToStep]);
   useEffect(() => {
     if (!autoExecute || !isEngineReady || workflows.length === 0) return;
     const timeoutId = setTimeout(() => {
@@ -21234,10 +21306,10 @@ function IntegratedDebugToolbar({
     if (!hasTrace) {
       return "Ready";
     }
-    if (currentStepIndex < 0) {
+    if (currentFilteredPosition < 0) {
       return "Ready";
     }
-    return `Step ${currentStepIndex + 1} / ${totalSteps}`;
+    return `Step ${currentFilteredPosition + 1} / ${totalSteps}`;
   };
   return /* @__PURE__ */ jsxs("div", { className: `df-debug-toolbar-integrated ${className}`, children: [
     /* @__PURE__ */ jsxs("div", { className: "df-debug-toolbar-status", children: [
@@ -21305,6 +21377,19 @@ function IntegratedDebugToolbar({
         }
       )
     ] }),
+    /* @__PURE__ */ jsx("div", { className: "df-debug-toolbar-options", children: /* @__PURE__ */ jsxs("label", { className: "df-debug-toolbar-checkbox-label", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "checkbox",
+          checked: skipFailedConditions,
+          onChange: (e) => setSkipFailedConditions(e.target.checked),
+          className: "df-debug-toolbar-checkbox",
+          disabled: isExecuting
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { children: "Filter Workflows" })
+    ] }) }),
     /* @__PURE__ */ jsx("div", { className: "df-debug-toolbar-actions", children: hasTrace ? /* @__PURE__ */ jsxs(
       "button",
       {
@@ -22321,7 +22406,7 @@ function JsonEditor({
         acceptSuggestionOnEnter: "off",
         formatOnPaste: true,
         formatOnType: false,
-        glyphMargin: highlightedPaths && highlightedPaths.length > 0
+        glyphMargin: false
       }
     }
   ) });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@goplasmatic/dataflow-ui",
-  "version": "2.0.11",
+  "version": "2.0.13",
   "type": "module",
   "description": "React visualization library for dataflow-rs workflow engine",
   "author": "Plasmatic Engineering <shankar@goplasmatic.io>",