File:QMLPuppet rendering.png

digraph QMLPuppet {

 rankdir=LR;
 node [shape=box, style=rounded];

 subgraph cluster_ide {
   label = "Application Process";
   style = "rounded,filled";
   color = "#e6e6ff";
   ModelNode          [label="ModelNode tree\n(QML DOM)"];
   NodeInstanceView   [label="NodeInstanceView"];
   NIServerProxy      [label="NodeInstanceServerProxy"];
   FormEditorScene    [label="FormEditorScene\n(QGraphicsScene)"];
   FormEditorView     [label="FormEditorView\n(QGraphicsView)"];
 }

 subgraph cluster_puppet {
   label = "QML Puppet Process";
   style = "rounded,filled";
   color = "#fff0e6";
   NIServer           [label="NodeInstanceServer"];
   QQmlEngine         [label="QQmlEngine\n+ hidden QQuickWindow"];
   QQuickItems        [label="QQuickItem instances\n(off‑screen)"];
   NICliProxy         [label="NodeInstanceClientProxy"];
 }

 # IDE → Puppet
 ModelNode        -> NodeInstanceView   [label="(change)"];
 NodeInstanceView -> NIServerProxy      [label="createScene /\ncreateInstance /..."];
 NIServerProxy    -> NICliProxy         [style="dashed" label="QLocalSocket"];
 NICliProxy       -> NIServer;
 NIServer         -> QQmlEngine;
 QQmlEngine       -> QQuickItems        [label="instantiate"];

 # Puppet → IDE
 QQuickItems      -> NIServer           [label="renderImage(),\nboundingRect()"];
 NIServer         -> NICliProxy         [label="PixmapChanged /\nInformationChanged"];
 NICliProxy       -> NIServerProxy      [style="dashed"];
 NIServerProxy    -> NodeInstanceView;
 NodeInstanceView -> FormEditorScene    [label="update pixmaps"];
 FormEditorScene  -> FormEditorView     [label="paint + overlays"];

}