@tscircuit/core 0.0.133 → 0.0.134

package/dist/index.d.ts

@@ -13,6 +13,7 @@ type RenderPhase = (typeof orderedRenderPhases)[number];
 type RenderPhaseFn<K extends RenderPhase = RenderPhase> = `doInitial${K}` | `update${K}` | `remove${K}`;
 type RenderPhaseStates = Record<RenderPhase, {
     initialized: boolean;
+    dirty: boolean;
 }>;
 type RenderPhaseFunctions = {
     [T in RenderPhaseFn]?: () => void;
@@ -34,7 +35,12 @@ declare abstract class Renderable implements IRenderable {
     /** Schematic-only, lines, boxes, indicators etc. */
     isSchematicPrimitive: boolean;
     _renderId: string;
+    _currentRenderPhase: RenderPhase | null;
+    private _asyncEffects;
     constructor(props: any);
+    protected _markDirty(phase: RenderPhase): void;
+    protected _queueAsyncEffect(effect: () => Promise<void>): void;
+    _hasIncompleteAsyncEffects(): boolean;
     runRenderCycle(): void;
     /**
      * This runs all the render methods for a given phase, calling one of:
@@ -53,6 +59,7 @@ type ReactSubtree = {
     component: NormalComponent;
 };
 
+type RootCircuitEventName = "asyncEffectComplete";
 declare class Circuit {
     firstChild: PrimitiveComponent | null;
     children: PrimitiveComponent[];
@@ -71,6 +78,8 @@ declare class Circuit {
     };
     _guessRootComponent(): void;
     render(): void;
+    renderUntilSettled(): Promise<void>;
+    private _hasIncompleteAsyncEffects;
     getSoup(): AnyCircuitElement[];
     getCircuitJson(): AnyCircuitElement[];
     toJson(): AnyCircuitElement[];
@@ -88,6 +97,9 @@ declare class Circuit {
     selectOne(selector: string, opts?: {
         type?: "component" | "port";
     }): PrimitiveComponent | null;
+    _eventListeners: Record<RootCircuitEventName, Array<(...args: any[]) => void>>;
+    emit(event: RootCircuitEventName, ...args: any[]): void;
+    on(event: RootCircuitEventName, listener: (...args: any[]) => void): void;
 }
 /**
  * @deprecated

package/dist/index.js

@@ -87,14 +87,61 @@ var Renderable = class {
   /** Schematic-only, lines, boxes, indicators etc. */
   isSchematicPrimitive = false;
   _renderId;
+  _currentRenderPhase = null;
+  _asyncEffects = [];
   constructor(props) {
     this._renderId = `${globalRenderCounter++}`;
     this.children = [];
     this.renderPhaseStates = {};
     for (const phase of orderedRenderPhases) {
-      this.renderPhaseStates[phase] = { initialized: false };
+      this.renderPhaseStates[phase] = {
+        initialized: false,
+        dirty: false
+      };
+    }
+  }
+  _markDirty(phase) {
+    this.renderPhaseStates[phase].dirty = true;
+    const phaseIndex = orderedRenderPhases.indexOf(phase);
+    for (let i = phaseIndex + 1; i < orderedRenderPhases.length; i++) {
+      this.renderPhaseStates[orderedRenderPhases[i]].dirty = true;
     }
   }
+  _queueAsyncEffect(effect) {
+    const asyncEffect = {
+      promise: effect(),
+      // TODO don't start effects until end of render cycle
+      phase: this._currentRenderPhase,
+      complete: false
+    };
+    this._asyncEffects.push(asyncEffect);
+    asyncEffect.promise.then(() => {
+      asyncEffect.complete = true;
+      if ("root" in this && this.root) {
+        ;
+        this.root.emit("asyncEffectComplete", {
+          component: this,
+          asyncEffect
+        });
+      }
+    }).catch((error) => {
+      console.error(
+        `Async effect error in ${this._currentRenderPhase}:`,
+        error
+      );
+      asyncEffect.complete = true;
+      if ("root" in this && this.root) {
+        ;
+        this.root.emit("asyncEffectComplete", {
+          component: this,
+          asyncEffect
+        });
+      }
+    });
+  }
+  _hasIncompleteAsyncEffects() {
+    return this._asyncEffects.some((effect) => !effect.complete);
+  }
   runRenderCycle() {
     for (const renderPhase of orderedRenderPhases) {
       this.runRenderPhaseForChildren(renderPhase);
@@ -109,22 +156,35 @@ var Renderable = class {
    *  ...depending on the current state of the component.
    */
   runRenderPhase(phase) {
-    const isInitialized = this.renderPhaseStates[phase].initialized;
+    this._currentRenderPhase = phase;
+    const phaseState = this.renderPhaseStates[phase];
+    const isInitialized = phaseState.initialized;
+    const isDirty = phaseState.dirty;
     if (!isInitialized && this.shouldBeRemoved) return;
     if (this.shouldBeRemoved && isInitialized) {
       ;
       this?.[`remove${phase}`]?.();
-      this.renderPhaseStates[phase].initialized = false;
+      phaseState.initialized = false;
+      phaseState.dirty = false;
       return;
     }
+    const prevPhaseIndex = orderedRenderPhases.indexOf(phase) - 1;
+    if (prevPhaseIndex >= 0) {
+      const prevPhase = orderedRenderPhases[prevPhaseIndex];
+      const hasIncompleteEffects = this._asyncEffects.filter((e) => e.phase === prevPhase).some((e) => !e.complete);
+      if (hasIncompleteEffects) return;
+    }
     if (isInitialized) {
-      ;
-      this?.[`update${phase}`]?.();
+      if (isDirty) {
+        ;
+        this?.[`update${phase}`]?.();
+        phaseState.dirty = false;
+      }
       return;
     }
-    ;
+    phaseState.dirty = false;
     this?.[`doInitial${phase}`]?.();
-    this.renderPhaseStates[phase].initialized = true;
+    phaseState.initialized = true;
   }
   runRenderPhaseForChildren(phase) {
     for (const child of this.children) {
@@ -4396,6 +4456,21 @@ var Circuit = class {
     firstChild.runRenderCycle();
     this._hasRenderedAtleastOnce = true;
   }
+  async renderUntilSettled() {
+    this.render();
+    while (this._hasIncompleteAsyncEffects()) {
+      await new Promise((resolve) => setTimeout(resolve, 100));
+      this.render();
+    }
+  }
+  _hasIncompleteAsyncEffects() {
+    return this.children.some((child) => {
+      if (child._hasIncompleteAsyncEffects()) return true;
+      return child.children.some(
+        (grandchild) => grandchild._hasIncompleteAsyncEffects()
+      );
+    });
+  }
   getSoup() {
     if (!this._hasRenderedAtleastOnce) this.render();
     return this.db.toArray();
@@ -4432,6 +4507,19 @@ var Circuit = class {
   selectOne(selector, opts) {
     return this.firstChild?.selectOne(selector, opts) ?? null;
   }
+  _eventListeners = { asyncEffectComplete: [] };
+  emit(event, ...args) {
+    if (!this._eventListeners[event]) return;
+    for (const listener of this._eventListeners[event]) {
+      listener(...args);
+    }
+  }
+  on(event, listener) {
+    if (!this._eventListeners[event]) {
+      this._eventListeners[event] = [];
+    }
+    this._eventListeners[event].push(listener);
+  }
 };
 var Project = Circuit;
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tscircuit/core",
   "type": "module",
-  "version": "0.0.133",
+  "version": "0.0.134",
   "types": "dist/index.d.ts",
   "main": "dist/index.js",
   "module": "dist/index.js",