Fixes + DnD + Pruning

src/Class/Graph/index.ts

@@ -985,7 +985,11 @@ export class Graph<I extends Dict<any> = any, O extends Dict<any> = any>
   private _destroy = () => {
     this._spec = clone(this._spec)
 
+    this._destroying = true
+
     forEachValueKey(this._unit, (u) => u.destroy())
+
+    this._destroying = false
   }
 
   private _reset = (): void => {
@@ -3734,6 +3738,10 @@ export class Graph<I extends Dict<any> = any, O extends Dict<any> = any>
       const data = pin.peak()
 
       const set = (data: any) => {
+        if (this._paused) {
+          return
+        }
+
         this._fork()
 
         this._specSetUnitPinData(unitId, type, pinId, data)
@@ -3760,7 +3768,7 @@ export class Graph<I extends Dict<any> = any, O extends Dict<any> = any>
 
       all_unlisten.push(pin_unlisten)
 
-      if (data !== undefined && !this._paused) {
+      if (data !== undefined) {
         set(data)
       }
     }
@@ -3778,6 +3786,10 @@ export class Graph<I extends Dict<any> = any, O extends Dict<any> = any>
 
     all_unlisten.push(
       unit.addListener('destroy', () => {
+        if (this._destroying) {
+          return
+        }
+
         if (this._removingUnit.has(unitId)) {
           return
         }
@@ -4073,6 +4085,8 @@ export class Graph<I extends Dict<any> = any, O extends Dict<any> = any>
 
   private _removingUnit: Set<string> = new Set()
 
+  private _destroying: boolean
+
   private _removeUnit(
     unitId: string,
     take: boolean = true,

src/Primitive.ts

@@ -88,6 +88,8 @@ export class Primitive<
           const { ref } = this.getInputOpt(name as keyof I)
 
           if (event === 'data') {
+            this._activateInput(name as keyof I, data)
+
             if (ref) {
               this.__onRefInputData(name as keyof I, data)
             } else {
@@ -288,13 +290,13 @@ export class Primitive<
     data: any,
     backpropagation: boolean
   ): void => {
-    this._activateInput(name, data)
-
     if (backpropagation) {
       return
     }
 
     if (!this._paused) {
+      this._activateInput(name, data)
+
       this.onDataInputData(name, data)
     } else {
       this.__buffer.push({
@@ -312,13 +314,13 @@ export class Primitive<
     data: any,
     backpropagation: boolean
   ): void => {
-    this._activateInput(name, data)
-
     if (backpropagation) {
       return
     }
 
     if (!this._paused) {
+      this._activateInput(name, data)
+
       this.__onRefInputData(name, data)
     } else {
       this.__buffer.push({

src/bundle.ts

@@ -116,6 +116,10 @@ function _bundleUnit(
         }
 
         _bundleUnit(bundle.unit, specs, custom, branch)
+
+        if (bundle.specs) {
+          delete bundle.specs
+        }
       }
     }
   }

src/client/component.ts

@@ -1066,7 +1066,9 @@ export class Component<
       this.commit()
     }
 
-    this.dispatchEvent('mount', {}, false)
+    if (this.isBase()) {
+      this.dispatchEvent('mount', {}, false)
+    }
   }
 
   unmount() {
@@ -1092,7 +1094,9 @@ export class Component<
 
     this.onUnmount($context)
 
-    this.dispatchEvent('unmount', {}, false)
+    if (this.isBase()) {
+      this.dispatchEvent('unmount', {}, false)
+    }
   }
 
   focus(options: FocusOptions | undefined = { preventScroll: true }) {

src/client/platform/node/boot.ts

@@ -14,7 +14,7 @@ export function boot(opt?: BootOpt): [System, Unlisten] {
 
   const root = window.document.getElementById(SYSTEM_ROOT_ID)
 
-  window.fetch = fetch
+  window.fetch = globalThis.fetch
   window.HTMLCanvasElement.prototype.getContext = <
     T extends '2d' | 'webgl' | 'webgl2' | 'bitmaprenderer',
   >(

src/client/render/attachStyle.ts

@@ -127,6 +127,7 @@ export const ROOT_STYLE = `
     caret-color: currentcolor;
     outline-color: #00000000;
     outline-style: none;
+    interpolate-size: allow-keywords;
   }
 `
 

src/client/spec.ts

@@ -307,7 +307,11 @@ export function findInputDataExamples(
       for (const subPinId in plug) {
         const subPin = plug[subPinId]
 
-        const { unitId, pinId, mergeId } = subPin
+        const { unitId, kind = 'input', pinId, mergeId } = subPin
+
+        if (kind !== 'input') {
+          continue
+        }
 
         if (unitId && pinId) {
           const unit = units[unitId]

src/spec/bundleClass.ts

@@ -4,6 +4,7 @@ import { UnitBundle } from '../types/UnitBundle'
 import { UnitBundleSpec } from '../types/UnitBundleSpec'
 import { UnitClass } from '../types/UnitClass'
 import { parseMemorySpec } from './evaluate/parseMemorySpec'
+import { remapSpecs } from './remapBundle'
 
 export function bundleClass<T extends Unit = any>(
   Class: UnitClass<T>,
@@ -18,7 +19,11 @@ export function bundleClass<T extends Unit = any>(
     static __bundle = bundle
 
     constructor(system: System) {
-      bundle.specs && system.injectSpecs(bundle.specs)
+      if (bundle.specs) {
+        const map = system.injectSpecs(bundle.specs)
+
+        remapSpecs(bundle, map)
+      }
 
       super(system, id)
 

src/spec/fromSpec.ts

@@ -1,78 +1,15 @@
+import { unitBundleSpec } from '../bundle'
 import { Graph } from '../Class/Graph'
 import { System } from '../system'
 import { Classes, PinSpec, Specs } from '../types'
 import { Dict } from '../types/Dict'
 import { GraphBundle, GraphClass } from '../types/GraphClass'
 import { GraphSpec } from '../types/GraphSpec'
-import { GraphSpecs } from '../types/GraphSpecs'
 import { GraphUnitPinSpec } from '../types/GraphUnitPinSpec'
 import { GraphUnitSpec } from '../types/GraphUnitSpec'
 import { io } from '../types/IOOf'
-import { deepGet } from '../util/object'
 import { weakMerge } from '../weakMerge'
 import { bundleClass } from './bundleClass'
-import { evaluateDataValue } from './evaluateDataValue'
-
-export function extractGraphSpecs(
-  spec: GraphSpec,
-  specs: Specs,
-  graphs: GraphSpecs = {},
-  classes: Classes = {}
-): GraphSpecs {
-  graphs[spec.id] = spec
-
-  const { units } = spec
-
-  for (const unit_id in units) {
-    const unit = units[unit_id]
-
-    const { id, input } = unit
-
-    for (const inputId in input) {
-      const _input = input[inputId] ?? {}
-
-      const { data } = _input
-
-      if (data !== undefined) {
-        const dataRef = evaluateDataValue(data, specs, classes)
-
-        for (const path of dataRef.ref ?? []) {
-          const bundle = deepGet(dataRef.data, path)
-
-          for (const specId in bundle.specs) {
-            const spec = bundle.specs[specId]
-
-            graphs[specId] = spec
-          }
-
-          for (const specId in bundle.specs) {
-            const spec = bundle.specs[specId]
-
-            extractGraphSpecs(spec, weakMerge(specs, graphs), graphs)
-          }
-        }
-      }
-    }
-
-    const unit_spec = specs[id]
-
-    if (!unit_spec) {
-      return
-    }
-
-    const { system } = unit_spec
-
-    if (!system) {
-      if (!graphs[id]) {
-        graphs[id] = unit_spec as GraphSpec
-
-        extractGraphSpecs(graphs[id], specs, graphs)
-      }
-    }
-  }
-
-  return graphs
-}
 
 export function fromSpec<I extends Dict<any> = any, O extends Dict<any> = any>(
   spec: GraphSpec,
@@ -88,11 +25,9 @@ export function fromSpec<I extends Dict<any> = any, O extends Dict<any> = any>(
     throw new Error('spec id is required')
   }
 
-  const specs = extractGraphSpecs(spec, specs_, {})
-
-  const unit = { id }
+  const bundle = unitBundleSpec({ id }, weakMerge({ [id]: spec }, specs_))
 
-  const Bundle = bundleClass(Class, { unit, specs })
+  const Bundle = bundleClass(Class, bundle)
 
   return Bundle
 }
@@ -156,7 +91,7 @@ export function classFromSpec<I, O>(
 
   class Class extends Graph<I, O> {
     constructor(system: System) {
-      const spec = system.getSpec(id) as GraphSpec
+      const spec = specs[id] as GraphSpec
 
       super(spec, branch, system, id)
     }

src/spec/type.ts

@@ -195,11 +195,13 @@ export const _getGraphTypeInterface = (
             undefined
           )
         } else if (unitId && pinId) {
-          subPinType = deepGetOrDefault(
-            unitTypeMap,
-            [unitId, kind, pinId],
-            undefined
-          )
+          if (kind === 'input') {
+            subPinType = deepGetOrDefault(
+              unitTypeMap,
+              [unitId, kind, pinId],
+              undefined
+            )
+          }
         }
 
         if (subPinType) {