Why does a Border combined with BorderRadius.circular create unintended borders on other sides?

I'm using Flutter to build a widget with a Container that has a left border and a BorderRadius. However, I am noticing that even though I've only set a left border, tiny borders are appearing on the other sides of the Container when BorderRadius.circular is applied.

Here is my code:

@override
Widget build(BuildContext context) {
  return Padding(
    padding: padding,
    child: Container(
      height: height,
      width: width,
      decoration: BoxDecoration(
        border: Border(
          left: BorderSide(
            color: colorStatusline ?? Theme.of(context).primaryColor,
            width: 3,
          ),
        ),
        color: color ?? AppColors.containerBackground,
        borderRadius: borderRadius ?? BorderRadius.circular(6),
      ),
    ),
  );
}

And the result:

Removing the BorderRadius eliminates the unintended tiny borders but makes the design inconsistent with the rounded corners I need.

Instead of declaring a border-radius using the Container's BoxDecoration, you can wrap your Container with ClipRRect and then apply your desired border-radius.

Please replace this:

@override
Widget build(BuildContext context) {
  return Padding(
    padding: padding,
    child: Container(
      height: height,
      width: width,
      decoration: BoxDecoration(
        border: Border(
          left: BorderSide(
            color: colorStatusline ?? Theme.of(context).primaryColor,
            width: 3,
          ),
        ),
        color: color ?? AppColors.containerBackground,
        borderRadius: borderRadius ?? BorderRadius.circular(6),
      ),
    ),
  );
}

with

@override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.white,
      child: Padding(
        padding: EdgeInsets.all(8.0),
        child: ClipRRect(
          borderRadius: BorderRadius.circular(6),
          child: Container(
            height: height,
            width: width,
            decoration: BoxDecoration(
              border: Border(
                left: BorderSide(
                  color: colorStatusline ?? Theme.of(context).primaryColor,
                  width: 3,
                ),
              ),
              color: color ?? AppColors.containerBackground,
            ),
          ),
        ),
      ),
    );
  }

I got an output of having border-radius for the Container and a border color on the left side only (without any visible border color on any other sides of the Container widget).

I hope it helps!