@statewalker/fsm-charts 0.1.2 → 0.1.4

package/dist/{chunk-UBYXED35.js → chunk-NXS24DZQ.js}

@@ -28,10 +28,10 @@ var RuntimeStatechartApi = class {
   onTransitionClick(listener) {
     return this._addListener(this._transitionsClickListeners, listener);
   }
-  openStatePenals() {
+  openStatePanels() {
     this._setStatePanelStatus(`details[data-state-id]`, true);
   }
-  closeStatePenals() {
+  closeStatePanels() {
     this._setStatePanelStatus(`details[data-state-id]`, false);
   }
   isStatePanelOpen(stateId) {
@@ -44,7 +44,7 @@ var RuntimeStatechartApi = class {
     const lastId = stateIds[stateIds.length - 1];
     const selected = this.isStateSelected(lastId);
     this.deselectStates();
-    this.closeStatePenals();
+    this.closeStatePanels();
     this.activateStates(...stateIds);
     if (selected) {
       this.deselectState(lastId);
@@ -226,6 +226,30 @@ var StateChartIndex = class {
     this.statechart = statechart;
     this._buildIndexes();
   }
+  /**
+   * Returns a state node or a chart by the specified identifier.
+   * @param id the id of a state node or a chart
+   * @returns a state node or a chart
+   */
+  getNodeById(id) {
+    return this._nodesIndex[id] || this._chartsIndex[id];
+  }
+  /**
+   * Returns a chart by the specified identifier.
+   * @param id the id of a state node or a chart
+   * @returns a state node or a chart
+   */
+  getChartById(id) {
+    return this._chartsIndex[id];
+  }
+  /**
+   * Returns an edge by the specified identifier.
+   * @param id the id of a graph edge
+   * @returns a graph edge
+   */
+  getEdgeById(id) {
+    return this._edgeIndex[id];
+  }
   /**
    * Transforms a stack of state keys to the corresponding identifiers.
    * If a key in the stack was not found then this method returns
@@ -242,9 +266,7 @@ var StateChartIndex = class {
       if (!node)
         break;
       result.push(node.id);
-      list = node.children;
-      if (!list?.length)
-        list = node.nodes;
+      list = [...node.children || [], ...node.nodes || []];
     }
     return result.length === stack.length ? result : [];
   }

package/dist/{chunk-ZSGS37QH.js → chunk-OTGN3OYG.js}

@@ -2474,8 +2474,9 @@ function buildFlatCharts({
   try {
     setLodash(lodash);
     const graph = new Graph({
-      directed: true
-    }).setGraph({ rankdir: vertical ? "tb" : "lr" }).setDefaultEdgeLabel(() => ({}));
+      directed: true,
+      multigraph: true
+    }).setGraph({ rankdir: vertical ? "tb" : "lr", multigraph: true });
     const nodesIndex = {};
     const getStateNodeId = (key, state = key) => {
       let id = nodesIndex[key];
@@ -2492,12 +2493,18 @@ function buildFlatCharts({
       const toStateKey = toState || finalStateKey;
       const to = getStateNodeId(toStateKey, toState);
       const params = getTransitionParams(fromStateKey, event, toStateKey);
-      graph.setEdge(from, to, {
-        id: newId("t"),
-        ...params
-      });
+      const edgeId = newId("t");
+      graph.setEdge(
+        from,
+        to,
+        {
+          id: edgeId,
+          ...params
+        },
+        edgeId
+      );
     }
-    layout(graph, { rankdir: vertical ? "tb" : "lr" });
+    layout(graph, { rankdir: "lr" });
     const [top, right, bottom, left] = getPadding(padding);
     const nodes = graph.nodes().map((id) => {
       const n = graph.node(id);

package/dist/index-layout.js

@@ -1,3 +1,3 @@
-export { buildCharts, buildFlatCharts, getGraphParamsProvider, getLabelDimensions } from './chunk-ZSGS37QH.js';
+export { buildCharts, buildFlatCharts, getGraphParamsProvider, getLabelDimensions } from './chunk-OTGN3OYG.js';
 import './chunk-NXWOFQMO.js';
 import './chunk-XEO3YXBM.js';

package/dist/index-runtime.d.ts

@@ -16,8 +16,8 @@ declare class RuntimeStatechartApi {
     close(): void;
     onStateClick(listener: RuntimeListener): () => void;
     onTransitionClick(listener: RuntimeListener): () => void;
-    openStatePenals(): void;
-    closeStatePenals(): void;
+    openStatePanels(): void;
+    closeStatePanels(): void;
     isStatePanelOpen(stateId: string): boolean;
     toggleState(...stateIds: string[]): boolean;
     activateStates(...stateIds: string[]): void;
@@ -53,6 +53,24 @@ declare class StateChartIndex {
     constructor({ statechart }: {
         statechart: StateChart;
     });
+    /**
+     * Returns a state node or a chart by the specified identifier.
+     * @param id the id of a state node or a chart
+     * @returns a state node or a chart
+     */
+    getNodeById(id: string): StateGraphNode | undefined;
+    /**
+     * Returns a chart by the specified identifier.
+     * @param id the id of a state node or a chart
+     * @returns a state node or a chart
+     */
+    getChartById(id: string): StateChart | undefined;
+    /**
+     * Returns an edge by the specified identifier.
+     * @param id the id of a graph edge
+     * @returns a graph edge
+     */
+    getEdgeById(id: string): StateGraphEdge | undefined;
     /**
      * Transforms a stack of state keys to the corresponding identifiers.
      * If a key in the stack was not found then this method returns

package/dist/index-runtime.js

@@ -1,2 +1,2 @@
-export { RuntimeStatechartApi, StateChartIndex } from './chunk-UBYXED35.js';
+export { RuntimeStatechartApi, StateChartIndex } from './chunk-NXS24DZQ.js';
 import './chunk-XEO3YXBM.js';

package/dist/index.js

@@ -1,5 +1,5 @@
-export { buildCharts, buildFlatCharts, getGraphParamsProvider, getLabelDimensions } from './chunk-ZSGS37QH.js';
+export { buildCharts, buildFlatCharts, getGraphParamsProvider, getLabelDimensions } from './chunk-OTGN3OYG.js';
 export { buildStatechartCss, buildStatechartStyles, buildStatechartSvg, buildStatechartsPanel, serializeCss, toKebabCase } from './chunk-YYNW6Q2T.js';
 import './chunk-NXWOFQMO.js';
-export { RuntimeStatechartApi, StateChartIndex } from './chunk-UBYXED35.js';
+export { RuntimeStatechartApi, StateChartIndex } from './chunk-NXS24DZQ.js';
 import './chunk-XEO3YXBM.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@statewalker/fsm-charts",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "HFSM Implementation",
   "keywords": [],
   "homepage": "https://github.com/statewalker/statewalker-fsm-charts",

package/src/layout/buildFlatCharts.ts

@@ -49,9 +49,8 @@ export function buildFlatCharts({
     setLodash(lodash);
     const graph = new Graph({
       directed: true,
-    })
-      .setGraph({ rankdir: vertical ? "tb" : "lr" })
-      .setDefaultEdgeLabel(() => ({}));
+      multigraph: true,
+    }).setGraph({ rankdir: vertical ? "tb" : "lr", multigraph: true });
 
     const nodesIndex: Record<string, string> = {};
 
@@ -71,12 +70,18 @@ export function buildFlatCharts({
       const toStateKey = toState || finalStateKey;
       const to = getStateNodeId(toStateKey, toState);
       const params = getTransitionParams(fromStateKey, event, toStateKey);
-      graph.setEdge(from, to, {
-        id: newId("t"),
-        ...params,
-      });
+      const edgeId = newId("t");
+      graph.setEdge(
+        from,
+        to,
+        {
+          id: edgeId,
+          ...params,
+        },
+        edgeId
+      );
     }
-    layout(graph, { rankdir: vertical ? "tb" : "lr" });
+    layout(graph, { rankdir: "lr" });
 
     const [top, right, bottom, left] = getPadding(padding);
 

package/src/runtime/RuntimeStatechartApi.ts

@@ -35,10 +35,10 @@ export class RuntimeStatechartApi {
     return this._addListener(this._transitionsClickListeners, listener);
   }
 
-  openStatePenals() {
+  openStatePanels() {
     this._setStatePanelStatus(`details[data-state-id]`, true);
   }
-  closeStatePenals() {
+  closeStatePanels() {
     this._setStatePanelStatus(`details[data-state-id]`, false);
   }
   isStatePanelOpen(stateId: string) {
@@ -52,7 +52,7 @@ export class RuntimeStatechartApi {
     const lastId = stateIds[stateIds.length - 1];
     const selected = this.isStateSelected(lastId);
     this.deselectStates();
-    this.closeStatePenals();
+    this.closeStatePanels();
     this.activateStates(...stateIds);
     if (selected) {
       this.deselectState(lastId);

package/src/runtime/StateChartIndex.ts

@@ -17,6 +17,33 @@ export class StateChartIndex {
     this._buildIndexes();
   }
 
+  /**
+   * Returns a state node or a chart by the specified identifier.
+   * @param id the id of a state node or a chart
+   * @returns a state node or a chart
+   */
+  getNodeById(id: string): StateGraphNode | undefined {
+    return this._nodesIndex[id] || this._chartsIndex[id];
+  }
+
+  /**
+   * Returns a chart by the specified identifier.
+   * @param id the id of a state node or a chart
+   * @returns a state node or a chart
+   */
+  getChartById(id: string): StateChart | undefined {
+    return this._chartsIndex[id];
+  }
+
+  /**
+   * Returns an edge by the specified identifier.
+   * @param id the id of a graph edge
+   * @returns a graph edge
+   */
+  getEdgeById(id: string): StateGraphEdge | undefined {
+    return this._edgeIndex[id];
+  }
+
   /**
    * Transforms a stack of state keys to the corresponding identifiers.
    * If a key in the stack was not found then this method returns
@@ -32,8 +59,7 @@ export class StateChartIndex {
       const node = list.find((node) => node.key === key);
       if (!node) break;
       result.push(node.id);
-      list = node.children;
-      if (!list?.length) list = node.nodes;
+      list = [...(node.children || []), ...(node.nodes || [])];
     }
     return result.length === stack.length ? result : [];
   }