What problem does this feature solve?

Coming from vega-lite, I'm trying to render a bar chart that splits the bars by category. Currently I find myself having to transform my data in order to send it to the chart series.

Playing with the axis encode I sort of get the result I'm looking for: https://codesandbox.io/s/funny-shadow-hbsjsm?file=/src/App.tsx if you hover over the bars you will see its actually rendering the proper values and bar sizes split by categories but all with the same color and no separation.

Is this kind of behavior not supported yet?

What does the proposed API look like?

series: {
            type: "bar",
            showBackground: true,
            dataGroupId: "source_dtg",
            seriesLayoutBy: "column",
            colorBy: "data", => support coloring by a field 
            splitBy: "categories" => new option to split by a category
            encode: {
              tooltip: ["categories", "source_dtg", "count"],
              // Map the "date" column to X axis.
              x: "source_dtg",
              // Map the "count" column to Y axis
              y: "count",
            }
          }