[Bug] react, VChart, curveType:monotone，change line color, conjunction part becomes sharp

[7ASSEL]

Version

^1.11.2

Link to Minimal Reproduction

https://jsfiddle.net/c207a54n/

Steps to Reproduce

No interactioin required, open the link and you will see that.

1. create a basic VChart, type is line:

   type: 'line',
   line: {
   style: {
     curveType: 'monotone',
     stroke: (data) => {
       if (data.value >= upperBound || data.value <= lowerBound) {
         return 'red';
       }
       return 'blue';
     },
   },
   },

2. curveType: 'monotone' suggests a smooth line, but when the line changes color, the conjunction part becomes sharp, which goes against expected behavior.
3. For more information, you can see the JSFiddle link: https://jsfiddle.net/c207a54n/

Current Behavior

When the monotone line changes color, the conjunction part becomes sharp, which goes against expected behavior.

Expected Behavior

line shape stays the same as no color changes.

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response