Problem
useLayer({mode: 'context'}) creates a new trigger callback ref on every render. React therefore detaches and reattaches an unchanged trigger element, which removes and reapplies its CSS anchor name.
useLayer also returns a new API object on every render in both context and fixed modes. Consumers that correctly depend on the layer object rerun effects and reinstall listeners even when no layer state changed.
Examples in core include Carousel, ContextMenu, Popover, Tooltip, HoverCard, and BaseTypeahead.
Proposed fix
- wrap the context trigger ref in
useCallback
- memoize the context and fixed return objects from their exposed members
- preserve the existing rule that the result changes when an exposed member changes, including
isOpen, callbacks, or render behavior
Regression coverage
Tests verify that:
- the context trigger ref remains stable across unrelated rerenders
- context and fixed return objects remain stable while their members are unchanged
- changing
onShow refreshes the API object but does not replace the trigger ref
No public types or behavior change.
Problem
useLayer({mode: 'context'})creates a new trigger callback ref on every render. React therefore detaches and reattaches an unchanged trigger element, which removes and reapplies its CSS anchor name.useLayeralso returns a new API object on every render in both context and fixed modes. Consumers that correctly depend on the layer object rerun effects and reinstall listeners even when no layer state changed.Examples in core include Carousel, ContextMenu, Popover, Tooltip, HoverCard, and BaseTypeahead.
Proposed fix
useCallbackisOpen, callbacks, or render behaviorRegression coverage
Tests verify that:
onShowrefreshes the API object but does not replace the trigger refNo public types or behavior change.