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

package/src/system/graph.ts

@@ -0,0 +1,134 @@
+import type { Viewport } from 'reactflow';
+import type { System } from './system';
+import type { Edge } from 'reactflow';
+import type { UIGraphJSON } from '@/types/graph';
+
+/**
+ * This is our internal graph representation that we use to perform transformations on
+ * It represents the general graph structure, not the underlying behavior graph instance
+ */
+export class Graph {
+  public readonly viewports: Viewport[] = [];
+  private sys: System;
+
+  protected annotations: { [key: string]: any } = {};
+
+  constructor(system: System) {
+    this.sys = system;
+  }
+
+  setViewport(index: number, viewport: Viewport) {
+    this.viewports[index] = viewport;
+    this.sys.pubsub.publish('saveViewport', {
+      index: index,
+      viewport: viewport
+    });
+  }
+
+  /**
+   * Clears the graph
+   */
+  clear() {
+    const nodes = this.sys.nodeStore.getState().nodes;
+    const edges = this.sys.edgeStore.getState().edges;
+    this.sys.undoManager.execute({
+      name: 'Clear graph',
+      undo: () => {
+        this.sys.nodeStore.getState().setNodes(Object.values(nodes));
+        this.sys.edgeStore.getState().setEdges(Object.values(edges));
+      },
+      execute: () => {
+        this.sys.nodeStore.getState().setNodes([]);
+        this.sys.edgeStore.getState().setEdges([]);
+      }
+    });
+  }
+
+  /**
+   * Return all edges that point into the nodes inputs.
+   * O(m) the amount of edges
+   */
+  inEdges(nodeId: string, sourceHandle?: string): Edge[] {
+    //Get the edges
+    const edges = this.sys.edgeStore.getState().edges;
+
+    return Object.values(edges).filter((x) => {
+      if (x.target !== nodeId) {
+        return false;
+      }
+      if (sourceHandle) {
+        return x.targetHandle === sourceHandle;
+      }
+      return true;
+    });
+  }
+
+  /**
+   * Return all edges that are pointed out by node v.
+   * O(m) the amount of edges
+   */
+  outEdges(nodeId: string, targetHandle?: string): Edge[] {
+    //Get the edges
+    const edges = this.sys.edgeStore.getState().edges;
+
+    return Object.values(edges).filter((x) => {
+      if (x.source !== nodeId) {
+        return false;
+      }
+      if (targetHandle) {
+        return x.targetHandle === targetHandle;
+      }
+      return true;
+    });
+  }
+
+  serialize(): UIGraphJSON {
+    return {
+      v: '1.0.0',
+      name: 'Untitled Graph',
+      user: {
+        viewport: this.viewports[0] || { x: 0, y: 0, zoom: 1 }
+      },
+      annotations: this.annotations,
+      data: {
+        layers: this.sys.layerStore.getState().serialize()
+      },
+      flow: {},
+      nodes: Object.values(this.sys.nodeStore.getState().nodes),
+      edges: Object.values(this.sys.edgeStore.getState().edges)
+    };
+  }
+
+  getAnnotations() {
+    return { ...this.annotations };
+  }
+
+  setAnnotations(annotations: { [key: string]: any }) {
+    this.annotations = {
+      ...this.annotations,
+      ...annotations
+    };
+    this.sys.pubsub.publish('graphAnnotationsChanged', this.getAnnotations());
+  }
+
+  deseralize(data: UIGraphJSON) {
+    //Load nodes
+    this.sys.nodeStore.getState().setNodes(data.nodes);
+    this.sys.edgeStore.getState().setEdges(data.edges);
+    this.annotations = data.annotations || {};
+    this.sys.layerStore.getState().deserialize(data.data?.layers);
+
+    // Restore viewport
+    if (data.user?.viewport) {
+      const reactflow = this.sys.refStore.getState().getRef('reactflow');
+      if (reactflow) {
+        reactflow.setViewport(data.user.viewport);
+      }
+    }
+
+    // Restore multiple viewports if they exist
+    if (data.user?.viewports) {
+      this.viewports.splice(0, this.viewports.length, ...data.user.viewports);
+    }
+  }
+}

package/src/system/index.ts

@@ -0,0 +1,3 @@
+export * from './system';
+export * from './provider';
+export { subscribeToRef, useRefFromStore } from '@/store/refs';

package/src/system/notifications.ts

@@ -0,0 +1,98 @@
+import type { System } from '@/system/system';
+import type { Renderable, Toast } from 'react-hot-toast';
+
+export type NotificationType = 'info' | 'success' | 'error' | 'loading';
+
+export interface NotificationOptions {
+  /**
+   * Toast ID for programmatic dismissal
+   */
+  id?: string;
+  /**
+   * Duration in milliseconds. Set to Infinity to persist until manually dismissed
+   */
+  duration?: number;
+  /**
+   * Position on screen
+   */
+  position?: Toast['position'];
+  /**
+   * Custom icon
+   */
+  icon?: Renderable;
+  /**
+   * Custom styles
+   */
+  style?: React.CSSProperties;
+  /**
+   * Custom class name
+   */
+  className?: string;
+  /**
+   * Accessible aria-live value
+   */
+  ariaLive?: Toast['ariaProps'];
+}
+
+export class Notifications {
+  private readonly system: System;
+  constructor(system: System) {
+    this.system = system;
+  }
+  /**
+   * Dismiss a specific toast or all toasts
+   */
+  dismissNotification(toastId?: string): void {
+    this.system.pubsub.publish('notification:dismiss', { toastId });
+  }
+
+  /**
+   * Show a notification toast
+   */
+  notify(
+    message: string,
+    type: NotificationType = 'info',
+    options?: NotificationOptions
+  ): void {
+    this.system.pubsub.publish('notification', {
+      type,
+      message,
+      options
+    });
+  }
+
+  /**
+   * Show a success notification
+   */
+  success(message: string, options?: NotificationOptions): void {
+    this.notify(message, 'success', options);
+  }
+
+  /**
+   * Show an error notification
+   */
+  error(message: string, options?: NotificationOptions): void {
+    this.notify(message, 'error', options);
+  }
+
+  /**
+   * Show a loading notification
+   */
+  loading(message: string, options?: NotificationOptions): void {
+    this.notify(message, 'loading', options);
+  }
+
+  /**
+   * Show an info notification
+   */
+  info(message: string, options?: NotificationOptions): void {
+    this.notify(message, 'info', options);
+  }
+
+  /**
+   * Dismiss a specific toast or all toasts
+   */
+  dismiss(toastId?: string): void {
+    this.system.pubsub.publish('notification:dismiss', { toastId });
+  }
+}

package/src/system/plugin.ts

@@ -0,0 +1,27 @@
+import type { System } from '.';
+
+/**
+ * Plugin initialization function type
+ * @template TOptions - Type of options object passed to the plugin
+ */
+export interface Plugin<TOptions = void> {
+  (system: System, options: TOptions): void | Promise<void>;
+}
+export type PluginOpts = {
+  name: string;
+};
+
+export type LoadablePlugin<TOptions = void> = {
+  loader: Plugin<TOptions>;
+  opts: PluginOpts;
+};
+
+export const plugin = <TOptions = void>(
+  registerfunc: Plugin<TOptions>,
+  opts: PluginOpts
+): LoadablePlugin<TOptions> => {
+  return {
+    loader: registerfunc,
+    opts: opts
+  };
+};

package/src/system/provider.tsx

@@ -0,0 +1,22 @@
+import React, { createContext, useContext, type ReactNode } from 'react';
+import type { System } from './system';
+
+export const SystemContext = createContext<System | undefined>(undefined);
+
+export type SystemProviderProps = {
+  children: ReactNode;
+  value: System;
+};
+export function SystemProvider({ children, value }: SystemProviderProps) {
+  return <SystemContext value={value}>{children}</SystemContext>;
+}
+
+export function useSystem(): System {
+  const context = useContext(SystemContext);
+
+  if (context === undefined) {
+    throw new Error('useSystem must be used within a SystemProvider');
+  }
+
+  return context;
+}

package/src/system/pubsub.ts

@@ -0,0 +1,323 @@
+export interface TopicEvents {
+  // This interface is meant to be extended in other parts of the application
+  // using module augmentation.
+  // Example:
+  // declare module './pubsub' {
+  //   export interface TopicEvents {
+  //     'user.created': { id: string; name: string };
+  //     'notification': string;
+  //   }
+  // }
+  [topic: string]: any;
+}
+
+type Subscriber<Events extends TopicEvents, K extends keyof Events> = (
+  message: K,
+  data: Events[K]
+) => void;
+
+type AnySubscriber = (message: string, data: any) => void;
+
+export class PubSub<Events extends TopicEvents = TopicEvents> {
+  private messages: Record<string, Record<string, AnySubscriber>> = {};
+  private lastUid = -1;
+  private static readonly ALL_SUBSCRIBING_MSG = '*';
+
+  private hasKeys(obj: object): boolean {
+    for (const key in obj) {
+      if (Object.prototype.hasOwnProperty.call(obj, key)) {
+        return true;
+      }
+    }
+    return false;
+  }
+
+  private throwException(ex: Error) {
+    return function reThrowException() {
+      throw ex;
+    };
+  }
+
+  private callSubscriberWithDelayedExceptions(
+    subscriber: AnySubscriber,
+    message: string,
+    data: any
+  ) {
+    try {
+      subscriber(message, data);
+    } catch (ex: any) {
+      setTimeout(this.throwException(ex), 0);
+    }
+  }
+
+  private callSubscriberWithImmediateExceptions(
+    subscriber: AnySubscriber,
+    message: string,
+    data: any
+  ) {
+    subscriber(message, data);
+  }
+
+  private deliverMessage(
+    originalMessage: string,
+    matchedMessage: string,
+    data: any,
+    immediateExceptions?: boolean
+  ) {
+    const subscribers = this.messages[matchedMessage];
+    const callSubscriber = immediateExceptions
+      ? this.callSubscriberWithImmediateExceptions
+      : this.callSubscriberWithDelayedExceptions;
+
+    if (!Object.prototype.hasOwnProperty.call(this.messages, matchedMessage)) {
+      return;
+    }
+
+    for (const s in subscribers) {
+      if (Object.prototype.hasOwnProperty.call(subscribers, s)) {
+        callSubscriber.call(this, subscribers[s]!, originalMessage, data);
+      }
+    }
+  }
+
+  private createDeliveryFunction<K extends keyof Events & string>(
+    message: K,
+    data: Events[K],
+    immediateExceptions?: boolean
+  ): () => void {
+    return () => {
+      const messageString = message as string;
+      let topic = messageString;
+      let position = topic.lastIndexOf('.');
+
+      this.deliverMessage(
+        messageString,
+        messageString,
+        data,
+        immediateExceptions
+      );
+
+      while (position !== -1) {
+        topic = topic.substr(0, position);
+        position = topic.lastIndexOf('.');
+        this.deliverMessage(messageString, topic, data, immediateExceptions);
+      }
+
+      this.deliverMessage(
+        messageString,
+        PubSub.ALL_SUBSCRIBING_MSG,
+        data,
+        immediateExceptions
+      );
+    };
+  }
+
+  private hasDirectSubscribersFor(message: string): boolean {
+    const topic = String(message);
+    return (
+      Object.prototype.hasOwnProperty.call(this.messages, topic) &&
+      this.hasKeys(this.messages[topic]!)
+    );
+  }
+
+  private messageHasSubscribers(message: string): boolean {
+    let topic = String(message);
+    let found =
+      this.hasDirectSubscribersFor(topic) ||
+      this.hasDirectSubscribersFor(PubSub.ALL_SUBSCRIBING_MSG);
+    let position = topic.lastIndexOf('.');
+
+    while (!found && position !== -1) {
+      topic = topic.substr(0, position);
+      position = topic.lastIndexOf('.');
+      found = this.hasDirectSubscribersFor(topic);
+    }
+
+    return found;
+  }
+
+  private internalPublish<K extends keyof Events & string>(
+    message: K,
+    data: Events[K],
+    sync: boolean,
+    immediateExceptions: boolean = false
+  ): boolean {
+    const messageString = message as string;
+
+    const deliver = this.createDeliveryFunction(
+      message,
+      data,
+      immediateExceptions
+    );
+    const hasSubscribers = this.messageHasSubscribers(messageString);
+
+    if (!hasSubscribers) {
+      return false;
+    }
+
+    if (sync) {
+      deliver();
+    } else {
+      setTimeout(deliver, 0);
+    }
+    return true;
+  }
+
+  public publishHook<K extends keyof Events & string>(
+    message: K,
+    data: Events[K]
+  ): boolean {
+    return this.internalPublish(message, data, false, true);
+  }
+
+  public publish<K extends keyof Events & string>(
+    message: K,
+    data: Events[K]
+  ): boolean {
+    return this.internalPublish(message, data, false);
+  }
+
+  public publishSync<K extends keyof Events & string>(
+    message: K,
+    data: Events[K]
+  ): boolean {
+    return this.internalPublish(message, data, true);
+  }
+
+  public subscribe<K extends keyof Events & string>(
+    message: K,
+    func: Subscriber<Events, K>
+  ): string | false {
+    if (typeof func !== 'function') {
+      return false;
+    }
+
+    const messageString = message as string;
+
+    if (!Object.prototype.hasOwnProperty.call(this.messages, messageString)) {
+      this.messages[messageString] = {};
+    }
+
+    const token = `uid_${String(++this.lastUid)}`;
+    this.messages[messageString]![token] = func as AnySubscriber;
+
+    return token;
+  }
+
+  public subscribeAll(func: AnySubscriber): string | false {
+    return this.subscribe(PubSub.ALL_SUBSCRIBING_MSG, func);
+  }
+
+  public subscribeOnce<K extends keyof Events & string>(
+    message: K,
+    func: Subscriber<Events, K>
+  ): this {
+    const token = this.subscribe(message, (msg, data) => {
+      this.unsubscribe(token as string);
+      func(msg, data);
+    });
+    return this;
+  }
+
+  public clearAllSubscriptions(): void {
+    this.messages = {};
+  }
+
+  public clearSubscriptions(topic: string): void {
+    for (const m in this.messages) {
+      if (
+        Object.prototype.hasOwnProperty.call(this.messages, m) &&
+        m.indexOf(topic) === 0
+      ) {
+        delete this.messages[m];
+      }
+    }
+  }
+
+  public countSubscriptions(topic: string): number {
+    let count = 0;
+    for (const m in this.messages) {
+      if (
+        Object.prototype.hasOwnProperty.call(this.messages, m) &&
+        m.indexOf(topic) === 0
+      ) {
+        for (const token in this.messages[m]) {
+          if (Object.prototype.hasOwnProperty.call(this.messages[m], token)) {
+            count++;
+          }
+        }
+      }
+    }
+    return count;
+  }
+
+  public getSubscriptions(topic: string): string[] {
+    const list: string[] = [];
+    for (const m in this.messages) {
+      if (
+        Object.prototype.hasOwnProperty.call(this.messages, m) &&
+        m.indexOf(topic) === 0
+      ) {
+        list.push(m);
+      }
+    }
+    return list;
+  }
+
+  private descendantTopicExists(topic: string): boolean {
+    for (const m in this.messages) {
+      if (
+        Object.prototype.hasOwnProperty.call(this.messages, m) &&
+        m.indexOf(topic) === 0
+      ) {
+        return true;
+      }
+    }
+    return false;
+  }
+
+  public unsubscribe(value: string | Function): boolean | string {
+    const isTopic =
+      typeof value === 'string' &&
+      (Object.prototype.hasOwnProperty.call(this.messages, value) ||
+        this.descendantTopicExists(value));
+    const isToken = !isTopic && typeof value === 'string';
+    const isFunction = typeof value === 'function';
+    let result: boolean | string = false;
+
+    if (isTopic) {
+      this.clearSubscriptions(value as string);
+      return true; // Indicate success
+    }
+
+    for (const m in this.messages) {
+      if (Object.prototype.hasOwnProperty.call(this.messages, m)) {
+        const message = this.messages[m];
+
+        if (!message) {
+          continue;
+        }
+
+        if (isToken && message[value as string]) {
+          delete message[value as string];
+          result = value;
+          break;
+        }
+
+        if (isFunction) {
+          for (const t in message) {
+            if (
+              Object.prototype.hasOwnProperty.call(message, t) &&
+              message[t] === value
+            ) {
+              delete message[t];
+              result = true;
+            }
+          }
+        }
+      }
+    }
+
+    return result;
+  }
+}