[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