Skip to content

Conversation

@aemartinez37
Copy link

This pull request introduces support for customizable corner rounding (border radius) for rectangle-shaped overlays in the spotlight tour feature. The main changes include extending the shape configuration interfaces and updating components to use the new borderRadius property, allowing for more flexible and visually appealing rectangle highlights.

Shape configuration enhancements:

  • Added a borderRadius property to ShapeProps in package/src/helpers/shape.ts to support customizable corner rounding for shapes.
  • Added a borderRadius option to ShapeOptions in package/src/lib/SpotlightTour.context.ts, including documentation and a default value of 4.

Component and rendering updates:

  • Updated the shape options handling in TourOverlay.component.tsx to include borderRadius with a default value, ensuring it is passed to shape components.
  • Passed the new borderRadius prop from TourOverlay.component.tsx to the shape component, enabling dynamic corner rounding.
  • Modified RectShape.component.tsx to use the borderRadius prop for the rectangle's rx and ry SVG attributes, replacing the previous hardcoded value. [1] [2]

@aemartinez37 aemartinez37 linked an issue Sep 26, 2025 that may be closed by this pull request
@aemartinez37 aemartinez37 force-pushed the Issue-195/rect-shape-custom-border-radius branch from 27a581f to 199123a Compare September 26, 2025 15:33
@aemartinez37 aemartinez37 self-assigned this Sep 26, 2025
@aemartinez37 aemartinez37 added the enhancement New feature or request label Sep 26, 2025
@aemartinez37 aemartinez37 force-pushed the Issue-195/rect-shape-custom-border-radius branch from 199123a to 9128723 Compare September 26, 2025 16:14
@aemartinez37 aemartinez37 changed the title Adding borderRadius prop for RectShape. feat: Allow borderRadius prop for RectShape. Sep 26, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add borderRadius support to RectShape via SpotlightTourProvider

2 participants