search

adobe / react-spectrum

A collection of libraries and tools that help you build adaptive, accessible, and robust user experiences.
https://react-spectrum.adobe.com
Apache License 2.0
12.8k stars 1.1k forks source link

Components using useStyleProps always rerender if matched breakpoint changes #3051

Open LFDanLu opened 2 years ago

LFDanLu commented 2 years ago

🐛 Bug Report

Currently useStyleProps accesses the BreakpointProvider context to evaluate which user provided responsive size should be used at the current matched breakpoint. However, this means all components that use useStyleProps will rerender if the matched breakpoint changes due to the way React contexts work (re-renders if the context value changes), even if the component doesn't have any responsive styles provided.

🤔 Expected Behavior

Components should only re-render when the matched breakpoint changes AND if they have responsive styles that depend on said breakpoints

😯 Current Behavior

Components always re-render when the matched breakpoint changes

💁 Possible Solution

Unsure, would break the rule of hooks if we conditionally call the useBreakpoint hook.

🌍 Your Environment

Software Version(s)
react-spectrum 3.16.5
Browser
Operating System

🧢 Your Company/Team

RSP

LFDanLu commented 2 years ago

tangentially related to https://github.com/adobe/react-spectrum/pull/2945 since changes made for this issue would possibly affect that PR