Change Kendo UI - RadialGauge Pointer Type to custom

Question

I'm trying to change the Pointer in Kendo UI's RadialGauge, but I don't see a option to do it in jsx file.

This is what I'm trying to achieve-

Notice the Black pointer's shape. It's more of a dear-drop shape.

This is how my gauge looks as of now-

Notice the black circle at the bottom of the pointer. I'd like to be able to reduce it's radius.

Below is my code- https://stackblitz.com/edit/react-zqkayk?file=app/main.jsx

const radialOptions = {
pointer: {
  type: "needle",
  value: ValueVar,
  color: 'black',
            cap: {
                size: 0.1
            }
},
shape: 'arrow',
scale: {
  max: 100,
  startAngle: 0,
  endAngle: 180,
  rangeSize:10,
  labels: { visible: false },
  majorTicks: { visible: false },
  minorTicks: { visible: false },
  ranges: RangesVar
}
  };
  return <RadialGauge {...radialOptions} />;

I notice from the Developer tools that it's a 'circle' component in 'k-gauge' class. and it has a property called 'r' which decides the radius. And if I reduce it to '7.7' I'd get it reduced.

But I'm not sure how to target it.