@kiberon-labs/behave-graph-flow 2.0.0 → 3.0.0

package/src/components/panels/events/CustomEventsEditor.tsx

@@ -1,384 +0,0 @@
-import React, { useEffect, useMemo, useState } from 'react';
-import { useStore } from 'zustand';
-import {
-  VscodeButton,
-  VscodeCollapsible,
-  VscodeDivider,
-  VscodeOption,
-  VscodeSingleSelect,
-  VscodeTextfield
-} from '@vscode-elements/react-elements';
-import { useSystem } from '@/system';
-import type { GraphJSON } from '@kiberon-labs/behave-graph';
-import { Download, Plus, Trash } from 'iconoir-react';
-
-type CustomEventJSON = NonNullable<GraphJSON['customEvents']>[number];
-
-type CustomEventParameterJSON = NonNullable<
-  CustomEventJSON['parameters']
->[number];
-
-const nextNumericId = (events: Array<{ id: string }>) => {
-  const used = new Set(events.map((e) => String(e.id)));
-  let i = 0;
-  while (used.has(String(i))) i += 1;
-  return String(i);
-};
-
-export const CustomEventsEditor: React.FC = () => {
-  const system = useSystem();
-
-  const eventsStoreApi = system.eventsStore;
-  const persistedEvents = useStore(system.eventsStore, (s) =>
-    Object.values(s.customEvents)
-  );
-
-  const controls = useStore(system.controlStore, (s) => s.controls);
-  const defaultControl = useStore(system.controlStore, (s) => s.defaultControl);
-
-  const valueTypeOptions = useMemo(
-    () => Object.keys(controls).sort((a, b) => a.localeCompare(b)),
-    [controls]
-  );
-
-  const [newEventName, setNewEventName] = useState('');
-
-  const [dirtyEventUiIds, setDirtyEventUiIds] = useState<string[]>([]);
-  const [draftEvents, setDraftEvents] = useState<CustomEventJSON[]>([]);
-
-  const isClean = dirtyEventUiIds.length === 0;
-
-  const markDirty = (uiId: string) => {
-    setDirtyEventUiIds((prev) =>
-      prev.includes(uiId) ? prev : [...prev, uiId]
-    );
-  };
-
-  const markClean = (uiId: string) => {
-    setDirtyEventUiIds((prev) => prev.filter((id) => id !== uiId));
-  };
-
-  useEffect(() => {
-    if (!isClean) return;
-    setDraftEvents(persistedEvents);
-  }, [isClean, persistedEvents]);
-
-  const commitEvent = (uiId: string) => {
-    const draft = draftEvents.find((e) => String(e.id) === uiId);
-    if (!draft) return;
-
-    const persisted = persistedEvents;
-    const existing = persisted.find((e) => String(e.id) === uiId);
-    const oldId = existing ? String(existing.id ?? '') : undefined;
-
-    const usedIds = new Set(
-      persisted.filter((e) => String(e.id) !== uiId).map((e) => String(e.id))
-    );
-
-    const desiredId = String(draft.id);
-    let finalId = desiredId;
-    if (usedIds.has(desiredId)) {
-      finalId = oldId ?? nextNumericId(persisted);
-    }
-
-    const normalized = { ...draft, id: finalId };
-
-    const nextPersisted = existing
-      ? persisted.map((e) => (String(e.id) === uiId ? normalized : e))
-      : [...persisted, normalized];
-
-    // Convert array to Record for store
-    const nextPersistedRecord: Record<string, CustomEventJSON> = {};
-    nextPersisted.forEach((evt) => {
-      nextPersistedRecord[String(evt.id)] = evt;
-    });
-
-    eventsStoreApi.getState().setCustomEvents(nextPersistedRecord);
-
-    const stored = eventsStoreApi.getState().getCustomEvents();
-    const storedEvent = stored.find((e) => String(e.id) === uiId);
-    if (storedEvent) {
-      setDraftEvents((prev) =>
-        prev.map((e) => (String(e.id) === uiId ? storedEvent : e))
-      );
-    }
-
-    markClean(uiId);
-  };
-
-  const updateDraftEvent = (id: string, patch: Partial<CustomEventJSON>) => {
-    setDraftEvents((prev) =>
-      prev.map((e) => {
-        if (String(e.id) !== String(id)) return e;
-        return { ...e, ...patch };
-      })
-    );
-    markDirty(id);
-  };
-
-  const removeDraftEvent = (uiId: string) => {
-    const persisted = persistedEvents;
-    const persistedMatch = persisted.find((e) => String(e.id) === uiId);
-
-    setDraftEvents((prev) => prev.filter((e) => String(e.id) !== String(uiId)));
-
-    // If it exists in the store, delete it immediately.
-    if (persistedMatch) {
-      const idToRemove = String(persistedMatch.id);
-      if (idToRemove) eventsStoreApi.getState().removeCustomEvent(idToRemove);
-    }
-
-    markClean(uiId);
-  };
-
-  const addDraftEvent = () => {
-    const nextId = nextNumericId(draftEvents);
-    const created: CustomEventJSON = {
-      id: nextId,
-      name: newEventName.trim() || 'NewCustomEvent',
-      parameters: []
-    };
-    setDraftEvents((prev) => [...prev, created]);
-    setNewEventName('');
-    markDirty(String(created.id));
-  };
-
-  const addDraftParameter = (uiId: string) => {
-    const vt = valueTypeOptions[0] ?? 'string';
-    const defaultValue =
-      vt === 'boolean'
-        ? false
-        : vt === 'number' || vt === 'float' || vt === 'integer'
-          ? 0
-          : '';
-
-    setDraftEvents((prev) =>
-      prev.map((e) => {
-        if (String(e.id) !== String(uiId)) return e;
-        const parameters = [
-          ...((e.parameters ?? []) as CustomEventParameterJSON[]),
-          {
-            name: 'param',
-            valueTypeName: vt,
-            defaultValue
-          }
-        ];
-        return { ...e, parameters };
-      })
-    );
-    markDirty(uiId);
-  };
-
-  const updateDraftParameter = (
-    uiId: string,
-    index: number,
-    patch: Partial<CustomEventParameterJSON>
-  ) => {
-    setDraftEvents((prev) =>
-      prev.map((e) => {
-        if (String(e.id) !== String(uiId)) return e;
-        const parameters = [
-          ...((e.parameters ?? []) as CustomEventParameterJSON[])
-        ];
-        if (!parameters[index]) return e;
-        parameters[index] = { ...parameters[index], ...patch };
-        return { ...e, parameters };
-      })
-    );
-    markDirty(uiId);
-  };
-
-  const removeDraftParameter = (uiId: string, index: number) => {
-    setDraftEvents((prev) =>
-      prev.map((e) => {
-        if (String(e.id) !== String(uiId)) return e;
-        const parameters = [
-          ...((e.parameters ?? []) as CustomEventParameterJSON[])
-        ];
-        parameters.splice(index, 1);
-        return { ...e, parameters };
-      })
-    );
-    markDirty(uiId);
-  };
-
-  return (
-    <div className="h-full w-full flex flex-col p-2 gap-2">
-      <div className="flex items-center gap-2 pb-2 border-b border-gray-700">
-        <h2 className="text-lg font-semibold">Custom Events</h2>
-      </div>
-
-      <div className="flex items-center gap-2">
-        <VscodeTextfield
-          placeholder="New event name"
-          value={newEventName}
-          onInput={(e: Event) => {
-            const target = e.target as HTMLInputElement;
-            setNewEventName(target.value);
-          }}
-        />
-        <VscodeButton onClick={addDraftEvent}>Add</VscodeButton>
-      </div>
-
-      <VscodeDivider />
-
-      {draftEvents.length === 0 ? (
-        <div className="text-gray-500 text-center py-4">
-          No custom events yet.
-        </div>
-      ) : (
-        <div className="flex flex-col gap-2">
-          {draftEvents.map((evt) => {
-            const parameters = (evt.parameters ??
-              []) as CustomEventParameterJSON[];
-            const eventId = String(evt.id);
-            const uiKey = String(evt.id);
-            const isEventDirty = dirtyEventUiIds.includes(uiKey);
-
-            return (
-              <VscodeCollapsible key={uiKey} title={`${evt.name} (${eventId})`}>
-                <div className="flex flex-col gap-2 p-2">
-                  <div className="grid grid-cols-12 gap-2 items-end">
-                    <div className="col-span-4 flex flex-col gap-1">
-                      <div className="text-xs text-gray-300">id</div>
-                      <VscodeTextfield
-                        value={String(evt.id)}
-                        onInput={(e: Event) => {
-                          const target = e.target as HTMLInputElement;
-                          updateDraftEvent(uiKey, {
-                            id: String(target.value)
-                          });
-                        }}
-                      />
-                    </div>
-
-                    <div className="col-span-6 flex flex-col gap-1">
-                      <div className="text-xs text-gray-300">name</div>
-                      <VscodeTextfield
-                        value={String(evt.name)}
-                        onInput={(e: Event) => {
-                          const target = e.target as HTMLInputElement;
-                          updateDraftEvent(uiKey, {
-                            name: String(target.value)
-                          });
-                        }}
-                      />
-                    </div>
-
-                    <div className="col-span-2 flex justify-end gap-1">
-                      <VscodeButton
-                        iconOnly
-                        title="Save"
-                        disabled={!isEventDirty}
-                        onClick={() => commitEvent(uiKey)}
-                      >
-                        <Download />
-                      </VscodeButton>
-                      <VscodeButton
-                        secondary
-                        iconOnly
-                        title="Delete event"
-                        onClick={() => removeDraftEvent(uiKey)}
-                      >
-                        <Trash />
-                      </VscodeButton>
-                    </div>
-                  </div>
-
-                  <VscodeDivider />
-
-                  <div className="flex items-center justify-between">
-                    <div className="text-sm font-semibold">Parameters</div>
-                    <VscodeButton
-                      secondary
-                      iconOnly
-                      title="Add parameter"
-                      onClick={() => addDraftParameter(uiKey)}
-                    >
-                      <Plus />
-                    </VscodeButton>
-                  </div>
-
-                  {parameters.length === 0 ? (
-                    <div className="text-gray-500 text-sm">No parameters.</div>
-                  ) : (
-                    <div className="flex flex-col gap-2">
-                      <div className="grid grid-cols-12 gap-2 text-xs text-gray-300">
-                        <div className="col-span-4">name</div>
-                        <div className="col-span-3">type</div>
-                        <div className="col-span-4">default</div>
-                        <div className="col-span-1" />
-                      </div>
-
-                      {parameters.map((param, index) => {
-                        const Control =
-                          controls[String(param.valueTypeName)] ??
-                          defaultControl;
-
-                        return (
-                          <div
-                            key={`${eventId}:${index}`}
-                            className="grid grid-cols-12 gap-2 items-center"
-                          >
-                            <VscodeTextfield
-                              className="col-span-4"
-                              value={String(param.name)}
-                              onInput={(e: Event) => {
-                                const target = e.target as HTMLInputElement;
-                                updateDraftParameter(uiKey, index, {
-                                  name: String(target.value)
-                                });
-                              }}
-                            />
-
-                            <VscodeSingleSelect
-                              className="col-span-3"
-                              value={String(param.valueTypeName)}
-                              onChange={(e: Event) => {
-                                const target = e.target as HTMLSelectElement;
-                                updateDraftParameter(uiKey, index, {
-                                  valueTypeName: String(target.value)
-                                });
-                              }}
-                            >
-                              {valueTypeOptions.map((vt) => (
-                                <VscodeOption key={vt} value={vt}>
-                                  {vt}
-                                </VscodeOption>
-                              ))}
-                            </VscodeSingleSelect>
-
-                            <div className="col-span-4 min-w-0">
-                              <Control
-                                value={param.defaultValue}
-                                onChange={(v) =>
-                                  updateDraftParameter(uiKey, index, {
-                                    defaultValue: v
-                                  })
-                                }
-                                valueType={String(param.valueTypeName ?? '')}
-                              />
-                            </div>
-
-                            <VscodeButton
-                              secondary
-                              iconOnly
-                              title="Delete parameter"
-                              onClick={() => removeDraftParameter(uiKey, index)}
-                            >
-                              <Trash />
-                            </VscodeButton>
-                          </div>
-                        );
-                      })}
-                    </div>
-                  )}
-                </div>
-              </VscodeCollapsible>
-            );
-          })}
-        </div>
-      )}
-    </div>
-  );
-};

package/src/css/vscode.css

@@ -1,13 +0,0 @@
-:root {
-    --vscode-button-border: #313131;
-    --vscode-foreground: #cccccc;
-    --vscode-editorWidget-background: #202020;
-    --vscode-editorWidget-foreground: #cccccc;
-    --vscode-editorWidget-border: #454545;
-    --vscode-editor-background: #1f1f1f;
-    --vscode-editor-foreground: #cccccc;
-    --vscode-editorGroupHeader-tabsBackground: #181818;
-    --vscode-sideBarSectionHeader-background: #181818;
-    --vscode-sideBarSectionHeader-foreground: #cccccc;
-    --vscode-sideBarSectionHeader-border: #2b2b2b;
-}

package/src/hooks/useDetachNodes.ts

@@ -1,39 +0,0 @@
-import { useSystem } from '@/system';
-import { useCallback } from 'react';
-import { useStoreApi } from 'reactflow';
-import { useStore } from 'zustand';
-
-export function useDetachNodes() {
-  const sys = useSystem();
-  const setNodes = useStore(sys.nodeStore, (x) => x.setNodes);
-  const store = useStoreApi();
-
-  const detachNodes = useCallback(
-    (ids: string[], removeParentId?: string) => {
-      const { nodeInternals } = store.getState();
-      const nextNodes = Array.from(nodeInternals.values()).map((n) => {
-        if (ids.includes(n.id) && n.parentId) {
-          const parentNode = nodeInternals.get(n.parentId);
-
-          //Remove parent reference and recalculate in global space
-          return {
-            ...n,
-            position: {
-              x: n.position.x + (parentNode?.positionAbsolute?.x ?? 0),
-              y: n.position.y + (parentNode?.positionAbsolute?.y ?? 0)
-            },
-            extent: undefined,
-            parentId: undefined
-          };
-        }
-        return n;
-      });
-      setNodes(
-        nextNodes.filter((n) => !removeParentId || n.id !== removeParentId)
-      );
-    },
-    [setNodes, store]
-  );
-
-  return detachNodes;
-}

package/src/plugin/graphrunner-webworker/types.ts

@@ -1,17 +0,0 @@
-/**
- * Type definitions for Web Worker Graph Runner
- */
-
-import type { StoreApi } from 'zustand';
-import type { WebWorkerGraphRunnerStore } from './store.js';
-
-declare module '@/system/system' {
-  interface System {
-    /**
-     * Web Worker Graph Runner store
-     */
-    webWorkerGraphRunnerStore: StoreApi<WebWorkerGraphRunnerStore>;
-  }
-}
-
-export type { WebWorkerGraphRunnerStore };

package/src/specifics/registerDefaultSpecifics.ts

@@ -1,5 +0,0 @@
-// Re-export specific factories for easy external registration
-export { getCustomEventOnTriggeredSpecific } from './CustomEventOnTriggeredSpecific';
-export { getCustomEventTriggerSpecific } from './CustomEventTriggerSpecific';
-export { getVariableGetSpecific } from './VariableGetSpecific';
-export { getVariableSetSpecific } from './VariableSetSpecific';

package/src/store/chat.ts

@@ -1,73 +0,0 @@
-import { create } from 'zustand';
-
-export interface AgentConfig {
-  model?: string;
-  systemPrompt?: string;
-}
-
-export interface ChatMessage {
-  id: string;
-  role: 'user' | 'assistant' | 'system';
-  content: string;
-  timestamp: Date;
-  isStreaming?: boolean;
-}
-
-export type ChatStore = {
-  messages: ChatMessage[];
-  agent: AgentConfig | undefined;
-  isStreaming: boolean;
-  inputValue: string;
-
-  setAgent: (agent: AgentConfig) => void;
-  clearAgent: () => void;
-  addMessage: (message: ChatMessage) => void;
-  updateStreamingMessage: (id: string, content: string) => void;
-  finalizeStreamingMessage: (id: string) => void;
-  setIsStreaming: (streaming: boolean) => void;
-  setInputValue: (value: string) => void;
-  clearMessages: () => void;
-};
-
-let messageCounter = 0;
-
-export function createMessageId(): string {
-  messageCounter += 1;
-  return `msg-${Date.now()}-${String(messageCounter)}`;
-}
-
-export const chatStoreFactory = () =>
-  create<ChatStore>((set) => ({
-    messages: [],
-    agent: undefined,
-    isStreaming: false,
-    inputValue: '',
-
-    setAgent: (agent: AgentConfig) => set({ agent }),
-    clearAgent: () => set({ agent: undefined }),
-
-    addMessage: (message: ChatMessage) =>
-      set((state) => ({
-        messages: [...state.messages, message]
-      })),
-
-    updateStreamingMessage: (id: string, content: string) =>
-      set((state) => ({
-        messages: state.messages.map((msg) =>
-          msg.id === id ? { ...msg, content } : msg
-        )
-      })),
-
-    finalizeStreamingMessage: (id: string) =>
-      set((state) => ({
-        messages: state.messages.map((msg) =>
-          msg.id === id ? { ...msg, isStreaming: false } : msg
-        )
-      })),
-
-    setIsStreaming: (streaming: boolean) => set({ isStreaming: streaming }),
-
-    setInputValue: (value: string) => set({ inputValue: value }),
-
-    clearMessages: () => set({ messages: [] })
-  }));

package/src/store/graphRunnerClient.ts

@@ -1,110 +0,0 @@
-import { createStore } from 'zustand/vanilla';
-import type { GraphRunnerClient } from '../plugin/graphrunner/client';
-import type {
-  AuthCredentials,
-  GraphRunnerCapabilities,
-  ServerVariable,
-  ServerEvent
-} from '../plugin/graphrunner/types';
-import type { NodeSpecJSON } from '@kiberon-labs/behave-graph';
-
-export interface ConnectionConfig {
-  url: string;
-  auth: AuthCredentials;
-  autoReconnect: boolean;
-}
-
-export interface ConnectionInfo {
-  serverId: string | null;
-  userId: string | null;
-  sessionId: string | null;
-  authenticated: boolean;
-  capabilities: GraphRunnerCapabilities | null;
-}
-
-export interface GraphRunnerClientStore {
-  // Connection state
-  connectionState:
-    | 'disconnected'
-    | 'connecting'
-    | 'authenticating'
-    | 'connected';
-  connectionConfig: ConnectionConfig;
-  connectionInfo: ConnectionInfo;
-  error: string | null;
-
-  // Client instance
-  client: GraphRunnerClient | null;
-
-  // Server metadata
-  serverVariables: ServerVariable[];
-  serverEvents: ServerEvent[];
-  nodeTypes: NodeSpecJSON[];
-
-  // Actions
-  setConnectionConfig: (config: Partial<ConnectionConfig>) => void;
-  setClient: (client: GraphRunnerClient | null) => void;
-  setConnectionState: (
-    state: 'disconnected' | 'connecting' | 'authenticating' | 'connected'
-  ) => void;
-  setConnectionInfo: (info: Partial<ConnectionInfo>) => void;
-  setError: (error: string | null) => void;
-  setServerVariables: (variables: ServerVariable[]) => void;
-  setServerEvents: (events: ServerEvent[]) => void;
-  setNodeTypes: (nodeTypes: NodeSpecJSON[]) => void;
-  clearServerMetadata: () => void;
-}
-
-export const graphRunnerClientStoreFactory = () => {
-  return createStore<GraphRunnerClientStore>((set) => ({
-    // Initial state
-    connectionState: 'disconnected',
-    connectionConfig: {
-      url: '',
-      auth: { type: 'none' },
-      autoReconnect: true
-    },
-    connectionInfo: {
-      serverId: null,
-      userId: null,
-      sessionId: null,
-      authenticated: false,
-      capabilities: null
-    },
-    error: null,
-    client: null,
-    serverVariables: [],
-    serverEvents: [],
-    nodeTypes: [],
-
-    // Actions
-    setConnectionConfig: (config) =>
-      set((state) => ({
-        connectionConfig: { ...state.connectionConfig, ...config }
-      })),
-
-    setClient: (client) => set({ client }),
-
-    setConnectionState: (connectionState) => set({ connectionState }),
-
-    setConnectionInfo: (info) =>
-      set((state) => ({
-        connectionInfo: { ...state.connectionInfo, ...info }
-      })),
-
-    setError: (error) => set({ error }),
-
-    setServerVariables: (serverVariables) => set({ serverVariables }),
-
-    setServerEvents: (serverEvents) => set({ serverEvents }),
-
-    setNodeTypes: (nodeTypes) => set({ nodeTypes }),
-
-    clearServerMetadata: () =>
-      set({
-        serverVariables: [],
-        serverEvents: [],
-        nodeTypes: []
-      })
-  }));
-};