Back to migration overview

RadiusElementExtendables Rounding Migration ​

Directional rounded prop values from BootstrapVue are replaced by edge-specific RadiusElement props in BootstrapVueNext.

Edit this page on GitHub

RadiusElementExtendables Rounding Migration ​

Summary ​

Directional rounded prop values from BootstrapVue are replaced by edge-specific RadiusElement props in BootstrapVueNext.

Affected APIs ​

  • BAvatar
  • BAvatarGroup
  • BCardImg
  • BImg
  • BOverlay

Breaking Change ​

BAvatar, BAvatarGroup, BCardImg, BImg and BOverlay all implement RadiusElementExtendables in order to support complex rounding behavior. The rounded, rounded-top, rounded-bottom, rounded-start, and rounded-end props each takes a RadiusElement value to specify how the component is rounded. The edge specific props such as rounded-top override the rounded prop for that edge.

This takes the place of top, bottom, left, and right values for the rounded prop.

Migration Notes ​

  • Extracted from the canonical BootstrapVue → BootstrapVueNext migration guide.
  • Review related migrations for shared prop, event, and slot changes.

Safe Automatic Rewrite ​

Yes. This entry is mostly mechanical and can usually be rewritten automatically when the surrounding code matches the documented patterns.