ComposableMap height and width props explained

When using a ComposableGraph, I was expecting to be able to set a width and height property and see the entire atlas drawn within those dimensions. Instead, I am seeing a cropped atlas if my width/height properties are not set large enough. I thought that given a zoom of 1, all the geographies should be visible no matter what size I choose to set the ComposableGraph.

<ComposableMap
  projectionConfig={{
    scale: 205,
    rotation: [-11, 0, 0],
  }}
  width={800}
  height={400}
>
  <ZoomableGroup disablePanning zoom={1}>
    <Geographies geography={`${process.env.PUBLIC_URL}/map.json`} disableOptimization>
      ...
    </Geographies>
  </ZoomableGroup>
</ComposableMap>

I am using the world-110m file here

[bonbonio]

I agree it works confusingly; I would expect it to fit to the size of whatever containing sizes I set, without anything being cropped, it should also center in that container on both axis.

[d3dc]

Width and height is so confusing because it is the input to the SVG’s viewbox:

viewBox={ viewBox ? viewBox : `0 0 ${width} ${height}` }

Its essentially setting the internal dimensions with overflow: hidden while the css styles and dom width and height (the same by default) distort the external image.