Skip to content
D
Documentation

ComponentAdapter

reference
1 min readUpdated

Import it from @grafloria/engine.

Framework-agnostic component adapter interface

Provides unified API for framework component systems

ts
interface ComponentAdapter

Properties

NameTypeDefaultDescription
frameworkstringFramework identifier (e.g., 'angular', 'react', 'vue') Used for debugging and framework detection

Members

  • registerComponent(nodeType: string, component: any): void — Register a framework component for a specific node type

Associates a component class/function with a node type string. When nodes of this type are rendered, this component will be instantiated.

  • hasComponent(nodeType: string): boolean — Check if a component is registered for a node type
  • getComponent(nodeType: string): any | undefined — Get registered component class for a node type
  • createComponentInstance(node: NodeModel, container: any): any — Create component instance for a diagram node

Instantiates the registered component for the node's type and passes:

  • Node data as inputs/props
  • Node position (x, y)
  • Node size (width, height) if available
  • Any other node metadata
  • updateComponentInstance(instance: any, node: NodeModel): void — Update component instance with new node data

Efficiently updates component inputs/props without recreating instance. Should trigger framework change detection/re-render.

  • destroyComponentInstance(instance: any): void — Destroy component instance and clean up resources

Calls framework lifecycle hooks (ngOnDestroy, componentWillUnmount, etc.), unsubscribes from events, and removes from DOM.

Should be idempotent - safe to call multiple times.

  • getRegisteredTypes(): string[] — Get list of all registered node type identifiers

Useful for:

  • Component palette UI (show available components)
  • Validation (check if node type has component)
  • Debugging (inspect registered components)
  • destroyAll?(): void — Destroy all component instances (optional)

Convenience method to clean up all managed components at once. Useful when clearing diagram or unmounting renderer.

  • getActiveCount?(): number — Get count of active component instances (optional)

Useful for:

  • Debugging
  • Performance monitoring
  • Memory leak detection

Was this page helpful?

ComponentAdapter — Grafloria