@likec4/core 1.30.0 → 1.32.0

package/src/model/view/LikeC4ViewModel.ts

@@ -1,45 +1,52 @@
-import { nonNullable } from '../../errors'
-import type { IteratorLike } from '../../types/_common'
-import type { Link } from '../../types/element'
-import type { Tag } from '../../types/scalars'
-import {
-  type ComputedDeploymentView,
-  type ComputedDynamicView,
-  type ComputedElementView,
-  type ComputedView,
-  type DiagramView,
-  type EdgeId as C4EdgeId,
-  type LikeC4View,
-  type NodeId as C4NodeId,
-  isDeploymentView,
-  isDynamicView,
-  isElementView,
-  isScopedElementView,
-} from '../../types/view'
-import { DefaultMap, ifind } from '../../utils'
+import { isTruthy } from 'remeda'
+import type {
+  Any,
+  AnyView,
+  IteratorLike,
+  Link,
+  scalar,
+  ViewWithType,
+} from '../../types'
+import { _stage, _type } from '../../types'
+import type * as aux from '../../types/aux'
+import { DefaultMap, ifind, nonNullable } from '../../utils'
 import type { ElementModel } from '../ElementModel'
 import type { LikeC4Model } from '../LikeC4Model'
-import { type AnyAux, getId } from '../types'
+import {
+  type $View,
+  type EdgeOrId,
+  type NodeOrId,
+  getId,
+} from '../types'
 import { type EdgesIterator, EdgeModel } from './EdgeModel'
 import { type NodesIterator, NodeModel } from './NodeModel'
 
-export type ViewsIterator<M extends AnyAux> = IteratorLike<LikeC4ViewModel<M>>
-
-export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramView = M['ViewType']> {
-  readonly #rootnodes = new Set<NodeModel<M, V>>()
-  readonly #nodes = new Map<C4NodeId, NodeModel<M, V>>()
-  readonly #edges = new Map<C4EdgeId, EdgeModel<M, V>>()
-  readonly #includeElements = new Set<M['Element']>()
-  readonly #includeDeployments = new Set<M['Deployment']>()
-  readonly #includeRelations = new Set<M['RelationId']>()
-  readonly #allTags = new DefaultMap((_key: Tag) => new Set<NodeModel<M, V> | EdgeModel<M, V>>())
-
-  constructor(
-    public readonly $model: LikeC4Model<M>,
-    public readonly $view: V,
-  ) {
-    for (const node of $view.nodes) {
-      const el = new NodeModel(this, Object.freeze(node))
+export type ViewsIterator<A extends Any, V extends $View<A> = $View<A>> = IteratorLike<LikeC4ViewModel<A, V>>
+
+export type InferViewType<V> = V extends AnyView<any> ? V[_type] : never
+
+export class LikeC4ViewModel<A extends Any = Any, V extends $View<A> = $View<A>> {
+  /**
+   * Don't use in runtime, only for type inference
+   */
+  readonly Aux!: A
+
+  readonly #rootnodes = new Set<NodeModel<A, V>>()
+  readonly #nodes = new Map<scalar.NodeId, NodeModel<A, V>>()
+  readonly #edges = new Map<scalar.EdgeId, EdgeModel<A, V>>()
+  readonly #includeElements = new Set<aux.Fqn<A>>()
+  readonly #includeDeployments = new Set<aux.DeploymentFqn<A>>()
+  readonly #includeRelations = new Set<scalar.RelationId>()
+  readonly #allTags = new DefaultMap((_key: aux.Tag<A>) => new Set<NodeModel<A, V> | EdgeModel<A, V>>())
+
+  public readonly $view: V
+  public readonly $model: LikeC4Model<A>
+
+  constructor(model: LikeC4Model<A>, view: V) {
+    this.$model = model
+    this.$view = view
+    for (const node of view.nodes) {
+      const el = new NodeModel<A, V>(this, Object.freeze(node))
       this.#nodes.set(node.id, el)
       if (!node.parent) {
         this.#rootnodes.add(el)
@@ -55,7 +62,7 @@ export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramV
       }
     }
 
-    for (const edge of $view.edges) {
+    for (const edge of view.edges) {
       const edgeModel = new EdgeModel(
         this,
         Object.freeze(edge),
@@ -72,11 +79,11 @@ export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramV
     }
   }
 
-  get __(): NonNullable<M['ViewType']['__']> {
-    return this.$view.__ ?? 'element'
+  get _type(): V[_type] {
+    return this.$view[_type]
   }
 
-  get id(): M['ViewId'] {
+  get id(): aux.StrictViewId<A> {
     return this.$view.id
   }
 
@@ -84,7 +91,7 @@ export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramV
     return this.$view.title
   }
 
-  get tags(): ReadonlyArray<Tag> {
+  get tags(): aux.Tags<A> {
     return this.$view.tags ?? []
   }
 
@@ -92,10 +99,10 @@ export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramV
     return this.$view.links ?? []
   }
 
-  get viewOf(): ElementModel<M> | null {
-    const v = this.$view as LikeC4View
-    if (isScopedElementView(v)) {
-      return this.$model.element(v.viewOf)
+  get viewOf(): ElementModel<A> | null {
+    if (this.isElementView()) {
+      const viewOf = this.$view.viewOf
+      return viewOf ? this.$model.element(viewOf) : null
     }
     return null
   }
@@ -103,18 +110,18 @@ export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramV
   /**
    * All tags from nodes and edges.
    */
-  get includedTags(): ReadonlyArray<Tag> {
-    return [...this.#allTags.keys()]
+  get includedTags(): aux.Tags<A> {
+    return [...this.#allTags.keys()] as unknown as aux.Tags<A>
   }
 
-  public roots(): NodesIterator<M, V> {
+  public roots(): NodesIterator<A, V> {
     return this.#rootnodes.values()
   }
 
   /**
    * Iterate over all nodes that have children.
    */
-  public *compounds(): NodesIterator<M, V> {
+  public *compounds(): NodesIterator<A, V> {
     for (const node of this.#nodes.values()) {
       if (node.hasChildren()) {
         yield node
@@ -127,7 +134,7 @@ export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramV
    * Get node by id.
    * @throws Error if node is not found.
    */
-  public node(node: M['NodeOrId']): NodeModel<M, V> {
+  public node(node: NodeOrId): NodeModel<A, V> {
     const nodeId = getId(node)
     return nonNullable(this.#nodes.get(nodeId), `Node ${nodeId} not found in view ${this.$view.id}`)
   }
@@ -135,19 +142,22 @@ export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramV
   /**
    * Find node by id.
    */
-  public findNode(node: M['NodeOrId']): NodeModel<M, V> | null {
-    return this.#nodes.get(getId(node) as C4NodeId) ?? null
+  public findNode(node: NodeOrId): NodeModel<A, V> | null {
+    return this.#nodes.get(getId(node)) ?? null
   }
 
-  public findNodeWithElement(fqn: M['Element']): NodeModel.WithElement<M, V> | null {
-    const nd = ifind(this.#nodes.values(), node => node.element?.id === fqn) ?? null
-    return nd && nd.hasElement() ? nd : null
+  public findNodeWithElement(element: aux.LooseElementId<A> | { id: aux.Fqn<A> }): NodeModel.WithElement<A, V> | null {
+    const id = getId(element)
+    return ifind(
+      this.#nodes.values(),
+      (node): node is NodeModel.WithElement<A, V> => node.hasElement() && node.element.id === id,
+    ) ?? null
   }
 
   /**
    * Iterate over all nodes.
    */
-  public nodes(): NodesIterator<M, V> {
+  public nodes(): NodesIterator<A, V> {
     return this.#nodes.values()
   }
 
@@ -156,24 +166,24 @@ export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramV
    * @param edge Edge or id
    * @returns EdgeModel
    */
-  public edge(edge: M['EdgeOrId']): EdgeModel<M, V> {
-    const edgeId = getId(edge) as C4EdgeId
+  public edge(edge: EdgeOrId): EdgeModel<A, V> {
+    const edgeId = getId(edge)
     return nonNullable(this.#edges.get(edgeId), `Edge ${edgeId} not found in view ${this.$view.id}`)
   }
-  public findEdge(edge: M['EdgeOrId']): EdgeModel<M, V> | null {
-    return this.#edges.get(getId(edge) as C4EdgeId) ?? null
+  public findEdge(edge: EdgeOrId): EdgeModel<A, V> | null {
+    return this.#edges.get(getId(edge)) ?? null
   }
   /**
    * Iterate over all edges.
    */
-  public edges(): EdgesIterator<M, V> {
+  public edges(): EdgesIterator<A, V> {
     return this.#edges.values()
   }
 
   /**
    * Iterate over all edges.
    */
-  public *edgesWithRelation(relation: M['RelationId']): EdgesIterator<M, V> {
+  public *edgesWithRelation(relation: aux.RelationId): EdgesIterator<A, V> {
     for (const edge of this.#edges.values()) {
       if (edge.includesRelation(relation)) {
         yield edge
@@ -185,7 +195,7 @@ export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramV
   /**
    * Nodes that have references to elements from logical model.
    */
-  public *elements(): IteratorLike<NodeModel.WithElement<M, V>> {
+  public *elements(): IteratorLike<NodeModel.WithElement<A, V>> {
     // return this.#nodes.values().filter(node => node.hasElement())
     for (const node of this.#nodes.values()) {
       if (node.hasElement()) {
@@ -195,38 +205,78 @@ export class LikeC4ViewModel<M extends AnyAux, V extends ComputedView | DiagramV
     return
   }
 
-  public includesElement(elementId: M['Element']): boolean {
-    return this.#includeElements.has(elementId)
+  /**
+   * Checks if the view has the given tag.
+   */
+  public isTagged(tag: aux.LooseTag<A>): boolean {
+    return this.tags.includes(tag as aux.Tag<A>)
+  }
+
+  public includesElement(element: aux.LooseElementId<A> | { id: aux.Fqn<A> }): boolean {
+    return this.#includeElements.has(getId(element))
   }
 
-  public includesDeployment(deploymentId: M['Deployment']): boolean {
-    return this.#includeDeployments.has(deploymentId)
+  public includesDeployment(deployment: aux.LooseDeploymentId<A> | { id: aux.DeploymentFqn<A> }): boolean {
+    return this.#includeDeployments.has(getId(deployment))
   }
 
-  public includesRelation(relationId: M['RelationId']): boolean {
-    return this.#includeRelations.has(relationId)
+  public includesRelation(relation: scalar.RelationId | { id: scalar.RelationId }): boolean {
+    return this.#includeRelations.has(getId(relation))
   }
 
   /**
    * Below are type guards.
    */
-  public isComputed(): this is LikeC4ViewModel<M, ComputedView> {
-    return true // Diagram view is a computed view
+  public isComputed(
+    this: LikeC4ViewModel<any, any>,
+  ): this is LikeC4ViewModel<aux.toComputed<A>> {
+    return this.$view[_stage] === 'computed'
+  }
+
+  public isDiagram(
+    this: LikeC4ViewModel<any, any>,
+  ): this is LikeC4ViewModel<aux.toLayouted<A>> {
+    return this.$view[_stage] === 'layouted'
+  }
+
+  public isElementView(this: LikeC4ViewModel<any, any>): this is LikeC4ViewModel.ElementView<A, V> {
+    return this.$view[_type] === 'element'
+  }
+
+  public isScopedElementView(
+    this: LikeC4ViewModel<any, any>,
+  ): this is LikeC4ViewModel.ScopedElementView<A, V> {
+    return this.$view[_type] === 'element' && isTruthy(this.$view.viewOf)
+  }
+
+  public isDeploymentView(this: LikeC4ViewModel<any, any>): this is LikeC4ViewModel.DeploymentView<A, V> {
+    return this.$view[_type] === 'deployment'
   }
 
-  public isDiagram(): this is LikeC4ViewModel<M, DiagramView> {
-    return 'bounds' in this.$view
+  public isDynamicView(this: LikeC4ViewModel<any, any>): this is LikeC4ViewModel.DynamicView<A, V> {
+    return this.$view[_type] === 'dynamic'
+  }
+}
+
+export namespace LikeC4ViewModel {
+  export interface ElementView<A extends Any, V extends $View<A> = $View<A>>
+    extends LikeC4ViewModel<A, ViewWithType<V, 'element'>>
+  {
   }
 
-  public isElementView(): this is LikeC4ViewModel<M, ComputedElementView> {
-    return isElementView(this.$view as LikeC4View)
+  export interface ScopedElementView<A extends Any, V extends $View<A> = $View<A>>
+    extends LikeC4ViewModel<A, ViewWithType<V, 'element'> & { viewOf: aux.StrictFqn<A> }>
+  {
+    viewOf: ElementModel<A>
   }
 
-  public isDeploymentView(): this is LikeC4ViewModel<M, ComputedDeploymentView> {
-    return isDeploymentView(this.$view as LikeC4View)
+  export interface DeploymentView<A extends Any, V extends $View<A> = $View<A>>
+    extends LikeC4ViewModel<A, ViewWithType<V, 'deployment'>>
+  {
   }
 
-  public isDynamicView(): this is LikeC4ViewModel<M, ComputedDynamicView> {
-    return isDynamicView(this.$view as LikeC4View)
+  export interface DynamicView<A extends Any, V extends $View<A> = $View<A>>
+    extends LikeC4ViewModel<A, ViewWithType<V, 'dynamic'>>
+  {
   }
 }

package/src/model/view/NodeModel.ts

@@ -1,129 +1,110 @@
+import { isTruthy } from 'remeda'
 import {
-  type Color as C4Color,
-  type ComputedView,
-  type DeploymentNodeKind,
-  type DiagramView,
+  type Any,
+  type Color,
+  type ComputedNode,
+  type DiagramNode,
   type ElementShape as C4ElementShape,
   type ElementStyle,
+  type ExtractOnStage,
   type IconUrl,
   type IteratorLike,
   type Link,
-  type NodeId,
-  type Tag as C4Tag,
-  ComputedNode,
-  ElementKind,
+  type scalar,
+  GroupElementKind,
+  isGroupElementKind,
 } from '../../types'
+import type * as aux from '../../types/aux'
+import { memoizeProp } from '../../utils'
 import type { DeployedInstanceModel, DeploymentElementModel } from '../DeploymentElementModel'
 import type { ElementModel } from '../ElementModel'
-import type { AnyAux, IncomingFilter, OutgoingFilter } from '../types'
+import type { $View, IncomingFilter, OutgoingFilter } from '../types'
 import type { EdgesIterator } from './EdgeModel'
 import type { LikeC4ViewModel } from './LikeC4ViewModel'
 
-export type NodesIterator<M extends AnyAux, V extends ComputedView | DiagramView> = IteratorLike<NodeModel<M, V>>
+export type NodesIterator<M extends Any, V extends $View<M>> = IteratorLike<NodeModel<M, V>>
 
-export namespace NodeModel {
-  export interface WithParent<M extends AnyAux, V extends ComputedView | DiagramView> extends NodeModel<M, V> {
-    parent: NodeModel<M, V>
-  }
-  export interface WithElement<M extends AnyAux, V extends ComputedView | DiagramView> extends NodeModel<M, V> {
-    kind: ElementKind
-    element: ElementModel<M>
-  }
-  export interface WithDeploymentElement<M extends AnyAux, V extends ComputedView | DiagramView>
-    extends NodeModel<M, V>
-  {
-    kind: DeploymentNodeKind
-    deployment: DeploymentElementModel<M>
-  }
-  export interface WithDeployedInstance<M extends AnyAux, V extends ComputedView | DiagramView>
-    extends NodeModel<M, V>
-  {
-    kind: 'instance'
-    element: ElementModel<M>
-    deployment: DeployedInstanceModel<M>
-  }
-
-  export interface IsGroup<M extends AnyAux, V extends ComputedView | DiagramView> extends NodeModel<M, V> {
-    kind: typeof ElementKind.Group
-    element: null
-    deployment: null
-  }
-}
+export class NodeModel<A extends Any = Any, V extends $View<A> = $View<A>> {
+  #node: ComputedNode<A> | DiagramNode<A>
 
-export class NodeModel<M extends AnyAux, V extends ComputedView | DiagramView = M['ViewType']> {
   constructor(
-    public readonly $view: LikeC4ViewModel<M, V>,
+    public readonly $view: LikeC4ViewModel<A, V>,
     public readonly $node: V['nodes'][number],
   ) {
+    this.#node = $node
   }
 
-  get id(): NodeId {
-    return this.$node.id
+  get id(): scalar.NodeId {
+    return this.#node.id
   }
 
   get title(): string {
-    return this.$node.title
+    return this.#node.title
   }
 
-  get kind(): ElementKind | DeploymentNodeKind | typeof ElementKind.Group | 'instance' {
-    return this.$node.kind as any
+  get kind(): aux.ElementKind<A> | aux.DeploymentKind<A> | typeof GroupElementKind | 'instance' {
+    return this.#node.kind as any
   }
 
   get description(): string | null {
-    return this.$node.description
+    return this.#node.description ?? null
   }
 
   get technology(): string | null {
-    return this.$node.technology
+    return this.#node.technology ?? null
   }
 
-  get parent(): NodeModel<M, V> | null {
-    return this.$node.parent ? this.$view.node(this.$node.parent) : null
+  get parent(): NodeModel<A, V> | null {
+    return this.#node.parent ? this.$view.node(this.#node.parent) : null
   }
 
-  get element(): ElementModel<M> | null {
-    const modelRef = ComputedNode.modelRef(this.$node)
+  get element(): ElementModel<A> | null {
+    const modelRef = this.#node.modelRef
     return modelRef ? this.$view.$model.element(modelRef) : null
   }
 
-  get deployment(): DeploymentElementModel<M> | null {
-    const modelRef = ComputedNode.deploymentRef(this.$node)
+  get deployment(): DeploymentElementModel<A> | null {
+    const modelRef = this.#node.deploymentRef
     return modelRef ? this.$view.$model.deployment.element(modelRef) : null
   }
 
   get shape(): C4ElementShape {
-    return this.$node.shape
+    return this.#node.shape
   }
 
-  get color(): C4Color {
-    return this.$node.color
+  get color(): Color {
+    return this.#node.color
   }
 
   get icon(): IconUrl | null {
-    return this.$node.icon ?? null
+    return this.#node.icon ?? null
   }
 
-  get tags(): ReadonlyArray<C4Tag> {
-    return this.$node.tags ?? []
+  get tags(): aux.Tags<A> {
+    return this.#node.tags
   }
 
   get links(): ReadonlyArray<Link> {
-    return this.$node.links ?? []
+    return this.#node.links ?? []
   }
 
-  get navigateTo(): LikeC4ViewModel<M> | null {
-    return this.$node.navigateTo ? this.$view.$model.view(this.$node.navigateTo) : null
+  get navigateTo(): LikeC4ViewModel<A> | null {
+    return this.#node.navigateTo ? this.$view.$model.view(this.#node.navigateTo) : null
   }
 
   get style(): ElementStyle {
-    return this.$node.style
+    return this.#node.style
+  }
+
+  public children(): ReadonlySet<NodeModel<A, V>> {
+    return memoizeProp(this, 'children', () => new Set(this.#node.children.map((child) => this.$view.node(child))))
   }
 
   /**
    * Get all ancestor elements (i.e. parent, parent’s parent, etc.)
    * (from closest to root)
    */
-  public *ancestors(): NodesIterator<M, V> {
+  public *ancestors(): NodesIterator<A, V> {
     let parent = this.parent
     while (parent) {
       yield parent
@@ -132,25 +113,18 @@ export class NodeModel<M extends AnyAux, V extends ComputedView | DiagramView =
     return
   }
 
-  public *children(): NodesIterator<M, V> {
-    for (const child of this.$node.children) {
-      yield this.$view.node(child)
-    }
-    return
-  }
-
-  public *sublings(): NodesIterator<M, V> {
-    const sublings = this.parent?.children() ?? this.$view.roots()
-    for (const subling of sublings) {
-      if (subling.id !== this.id) {
-        yield subling
+  public *siblings(): NodesIterator<A, V> {
+    const siblings = this.parent?.children() ?? this.$view.roots()
+    for (const sibling of siblings) {
+      if (sibling.id !== this.id) {
+        yield sibling
       }
     }
     return
   }
 
-  public *incoming(filter: IncomingFilter = 'all'): EdgesIterator<M, V> {
-    for (const edgeId of this.$node.inEdges) {
+  public *incoming(filter: IncomingFilter = 'all'): EdgesIterator<A, V> {
+    for (const edgeId of this.#node.inEdges) {
       const edge = this.$view.edge(edgeId)
       switch (true) {
         case filter === 'all':
@@ -163,8 +137,8 @@ export class NodeModel<M extends AnyAux, V extends ComputedView | DiagramView =
     return
   }
 
-  public *incomers(filter: IncomingFilter = 'all'): NodesIterator<M, V> {
-    const unique = new Set<NodeId>()
+  public *incomers(filter: IncomingFilter = 'all'): NodesIterator<A, V> {
+    const unique = new Set<aux.NodeId>()
     for (const r of this.incoming(filter)) {
       if (unique.has(r.source.id)) {
         continue
@@ -175,8 +149,8 @@ export class NodeModel<M extends AnyAux, V extends ComputedView | DiagramView =
     return
   }
 
-  public *outgoing(filter: OutgoingFilter = 'all'): EdgesIterator<M, V> {
-    for (const edgeId of this.$node.outEdges) {
+  public *outgoing(filter: OutgoingFilter = 'all'): EdgesIterator<A, V> {
+    for (const edgeId of this.#node.outEdges) {
       const edge = this.$view.edge(edgeId)
       switch (true) {
         case filter === 'all':
@@ -189,8 +163,8 @@ export class NodeModel<M extends AnyAux, V extends ComputedView | DiagramView =
     return
   }
 
-  public *outgoers(filter: OutgoingFilter = 'all'): NodesIterator<M, V> {
-    const unique = new Set<NodeId>()
+  public *outgoers(filter: OutgoingFilter = 'all'): NodesIterator<A, V> {
+    const unique = new Set<aux.NodeId>()
     for (const r of this.outgoing(filter)) {
       if (unique.has(r.target.id)) {
         continue
@@ -201,39 +175,71 @@ export class NodeModel<M extends AnyAux, V extends ComputedView | DiagramView =
     return
   }
 
-  public isDiagramNode(): this is NodeModel<M, DiagramView> {
-    return 'width' in this.$node && 'height' in this.$node
+  public isDiagramNode(this: NodeModel<any, any>): this is NodeModel<A, ExtractOnStage<V, 'layouted'>> {
+    return 'width' in this.#node && 'height' in this.#node
   }
 
   public hasChildren(): boolean {
-    return this.$node.children.length > 0
+    return this.#node.children.length > 0
   }
 
-  public hasParent(): this is NodeModel.WithParent<M, V> {
-    return this.$node.parent !== null
+  public hasParent(): this is NodeModel.WithParent<A, V> {
+    return this.#node.parent !== null
   }
 
   /**
    * Check if this node references to logical model element.
    */
-  public hasElement(): this is NodeModel.WithElement<M, V> {
-    return ComputedNode.modelRef(this.$node) !== null
+  public hasElement(): this is NodeModel.WithElement<A, V> {
+    return isTruthy(this.#node.modelRef)
   }
   /**
    * Check if this node references to deployment element (Node or Instance).
    */
-  public hasDeployment(): this is NodeModel.WithDeploymentElement<M, V> {
-    return ComputedNode.deploymentRef(this.$node) !== null
+  public hasDeployment(): this is NodeModel.WithDeploymentElement<A, V> {
+    return isTruthy(this.#node.deploymentRef)
   }
   /**
    * Check if this node references to deployed instance
    * Deployed instance always references to element and deployment element.
    */
-  public hasDeployedInstance(): this is NodeModel.WithDeployedInstance<M, V> {
+  public hasDeployedInstance(): this is NodeModel.WithDeployedInstance<A, V> {
     return this.hasElement() && this.hasDeployment()
   }
 
-  public isGroup(): this is NodeModel.IsGroup<M, V> {
-    return ComputedNode.isNodesGroup(this.$node)
+  public isGroup(): this is NodeModel.IsGroup<A, V> {
+    return isGroupElementKind(this.#node)
+  }
+
+  /**
+   * Checks if the node has the given tag.
+   */
+  public isTagged(tag: aux.LooseTag<A>): boolean {
+    return this.tags.includes(tag as aux.Tag<A>)
+  }
+}
+
+export namespace NodeModel {
+  export interface WithParent<A extends Any = Any, V extends $View<A> = $View<A>> extends NodeModel<A, V> {
+    parent: NodeModel<A, V>
+  }
+  export interface WithElement<A extends Any = Any, V extends $View<A> = $View<A>> extends NodeModel<A, V> {
+    kind: aux.ElementKind<A>
+    element: ElementModel<A>
+  }
+  export interface WithDeploymentElement<A extends Any = Any, V extends $View<A> = $View<A>> extends NodeModel<A, V> {
+    kind: aux.DeploymentKind<A>
+    deployment: DeploymentElementModel<A>
+  }
+  export interface WithDeployedInstance<A extends Any = Any, V extends $View<A> = $View<A>> extends NodeModel<A, V> {
+    kind: 'instance'
+    element: ElementModel<A>
+    deployment: DeployedInstanceModel<A>
+  }
+
+  export interface IsGroup<A extends Any = Any, V extends $View<A> = $View<A>> extends NodeModel<A, V> {
+    kind: typeof GroupElementKind
+    element: null
+    deployment: null
   }
 }

package/src/theme/element.ts

@@ -1,4 +1,4 @@
-import type { ElementThemeColors, ElementThemeColorValues } from '../types/theme'
+import type { ElementThemeColors, ElementThemeColorValues } from '../types'
 
 const blue = {
   fill: '#3b82f6',