# Node Renderers

INodeRenderer allows you to define custom views for specific node types in the workspace.

# Key Methods

  • CompactView: A summarized card-style representation (used in search results).
  • PreviewAsync: A detailed preview (used in side-panels).
  • ViewAsync: The full, page-level view of the node.

# Implementation Example

public class DeviceRenderer : INodeRenderer
{
    public string NodeType => N.Device.Type;
    public UIcons Icon => UIcons.Box;
    public string Color => "#346eeb";

    public CardContent CompactView(Node node) =>
        CardContent(Header(this, node), null);

    public async Task<IComponent> ViewAsync(Node node, Parameters state) =>
        VStack().Children(
            TextBlock(node.GetString(N.Device.Name)).Size(20),
            Neighbors(node.UID, N.Part.Type, E.HasPart)
        );
}