Rectangular 'bbox' region picker

[Jakidxav]

Purpose

Supporting a rectangular, bounding box-style option for the <RegionPicker /> component. Currently, only a circular option is available.

Changes

src

I added a <RectanglePicker /> component that works very similar to the <CirclePicker /> that is currently used. Because some of the code between the picker components is shared, I was able to move the utils methods and <CursorManager /> component to src/region/region-picker/.

The <RegionPicker /> component would now accept a mode prop which defaults to 'circle', but can toggle between that and the 'rectangle' option when rendered within the map component. Right now, only one corner can be used to resize the rectangular region, but future work could extend this to include all corners in order to create custom rectangular region shapes.

demo

In the demo app, I commented out the mode prop for the <RegionPicker /> that shows how a user could toggle between the 'circle' and 'rectangle' options. I also slightly modified the map's starting center location to better show that these two options produce different output when they are initially rendered.

pre-commit formatting

All files in this pull request meet pre-commit checks. When I run:

pre-commit run --all-files

I see:

prettier.................................................................Passed
prettier-markdown........................................................Passed

[vercel]

@Jakidxav is attempting to deploy a commit to the carbonplan Team on Vercel.

A member of the Team first needs to authorize it.