Large gap between <VictoryLabel /> and rest of chart

How can I decrease the gap between the label and the chart?

Relevent code:

<VictoryChart
  height={200}
  domainPadding={10}
  theme={VictoryTheme.material}
  animate={{
    duration: 2000,
    onLoad: { duration: 1000 }
  }}
>
  {props.title ? (
    <VictoryLabel
      text={props.title}
      x={165}
      y={10}
      textAnchor="middle"
      style={{ fontSize: 14 }}
    />
  ) : null}
  {/* Y-axis */}
  <VictoryAxis
    dependentAxis
    tickFormat={(x) => `${formatNumber(x)} gal`}
    style={{
      tickLabels: { fontSize: 6 }
    }}
  />
  <VictoryBar
    {...props}
    style={{ data: { fill: theme.palette.primary.main } }}
    labelComponent={
      <VictoryTooltip
        style={{
          strokeWidth: 1,
          fontSize: 6
        }}
      />
    }
  />
  {/* X-axis */}
  <VictoryAxis
    fixLabelOverlap={true}
    gridComponent={<span />}
    style={{
      tickLabels: { fontSize: 6 }
    }}
    tickValues={props.data.map((i, idx) => idx + 1)}
    tickFormat={props.data.map((i) =>
      format(dateStringToDate(i.date), 'MMM do')
    )}
  />
</VictoryChart>

You can use axisLabelComponent to configure the position of the axis labels. So you can use the x-axis label as chart label and configure its position with axisLabelComponent you can also provide style with style props as well.

<VictoryAxis
  label="Time (ms)"
 axisLabelComponent={<VictoryLabel dx={0} dy={-200} style={[
                { 
                  textanchor: "middle",
                }
              ]}
        />}
/>

This should help.