Fix some issues with the zero sized controls.

[seanparsons]

Fixes #4283

Problem:
There are a couple of issues with the zero sized controls:

• The parent highlight looks a little strange when the parent is zero sized and visually the control appears in what a user might think is an odd place.
• The resize handles show along with the zero sized controls, which is visually noisy.
• Trying to trigger the zero sized control when the mouse is over the border/shadow of the control just deselects the element.
• Zoom scale wasn't taken account of correctly for the position of the zero sized controls.

Fix:
The fixes for the above issues are respectively:

• Prevent the parent highlight control from displaying its zero sized variant by supplying a property specifically to check that.
• Distinguish between the bounding box for the user controls and the real bounding box, as the gapped one will likely never be zero sized or at the very least will not be zero sized when the element itself is.
• The mouse events are now attached to an element which sits on top of the control and covers the zero sized control including the visual elements which sit outside of its bounds (browser element bounds in this case).
• Adjust the position and size of the zero sized control correctly taking account of the scale ratio.

Commit Details:

• Fixed useBoundingBox hook to support both a gapped bounding box and a real bounding box.
• useBoundingBoxFromMetadataRef now produces a gapped bounding box as well as the real bounding box.
• Controls using useBoundingBox now use the real bounding box when calling isZeroSizedElement.
• HighlightControl has a displayZeroSized property which gates the display of zero sized highlights.
• ZeroSizeSelectControl and ZeroSizeResizeControl now have their events attached to an element which covers the entire control so that border radius and box shadows will "trigger" the events when the mouse is over them.
• Fix to position of zero sized controls to now take account of the scale.
• Added browser test that clicks just outside the zero bounds of the element.

[github-actions]

Try me

[relativeci]

Job #8377: Bundle Size — 62.79MiB (~+0.01%).

8bb86e9(current) vs 5957b21 master#8374(baseline)

Warning

Bundle contains 64 duplicate packages - View duplicate packages

Bundle metrics (1 change)

	Current Job #8377	Baseline Job #8374
Initial JS	35.05MiB(~+0.01%)	35.05MiB
Initial CSS	0B	0B
Cache Invalidation	18.39%	18.39%
Chunks	27	27
Assets	31	31
Modules	3973	3973
Duplicate Modules	424	424
Duplicate Code	30.9%	30.9%
Packages	409	409
Duplicate Packages	64	64

Bundle size by type (1 change)

	Current Job #8377	Baseline Job #8374
CSS	0B	0B
Fonts	0B	0B
HTML	11.43KiB	11.43KiB
IMG	0B	0B
JS	62.78MiB (~+0.01%)	62.77MiB
Media	0B	0B
Other	0B	0B

---

View job #8377 report View fix/zero-sized-controls branch activity

[github-actions]

Performance test results: