Circle packing

{
  "$schema":"https://vega.github.io/schema/vega/v5.json",
  "width":340,"height":340,"padding":5,"autosize":"none",
  "data":[{
    "name":"tree","values":[
      {"id":"r","parent":null,"name":"Bundle"},
      {"id":"a","parent":"r","name":"core"},
      {"id":"b","parent":"r","name":"ui"},
      {"id":"c","parent":"r","name":"infra"},
      {"id":"1","parent":"a","name":"router","size":210},
      {"id":"2","parent":"a","name":"state","size":140},
      {"id":"3","parent":"b","name":"components","size":260},
      {"id":"4","parent":"b","name":"styles","size":110},
      {"id":"5","parent":"c","name":"build","size":90},
      {"id":"6","parent":"c","name":"deploy","size":50}
    ],
    "transform":[
      {"type":"stratify","key":"id","parentKey":"parent"},
      {"type":"pack","field":"size","sort":{"field":"value"},"size":[{"signal":"width"},{"signal":"height"}]}
    ]
  }],
  "scales":[{"name":"color","type":"ordinal","domain":["core","ui","infra"],"range":{"scheme":"category10"}}],
  "marks":[
    {"type":"symbol","from":{"data":"tree"},
      "encode":{"enter":{"shape":{"value":"circle"},"strokeWidth":{"value":0.6},"stroke":{"value":"white"},"fill":{"signal":"datum.parent ? scale('color', datum.parent) : '#e2e8f0'"},"tooltip":{"signal":"datum.name + ' (' + (datum.size||'') + ')'"}}},
      "transform":[]}
  ]
}