v0.18.0

Changes for individual packages can now be found in the CHANGELOG.md file in the root of the affected package. GitHub releases will be used to document changes affecting all or several packages in the repo.

BREAKING Changes

• All default exports have been removed. Replace all default imports with the appropriate documented named export.
• The output directory structure has changed slightly. Module files are now named reach-<pkg>.mjs instead of reach-<pkg>.esm.js.

Minor Changes

• We have simplified our build setup to remove a boatload of dependencies. Build output for all packages may look slightly different, though functionally packages that don't have explicit changes marked in the release notes have not changed.

  This may affect you if you use patch-package to modify output code. If you need support for legacy browsers, the new bundle may not transpile the same ECMA features as before. In that case you may want to transpile Reach packages directly.

• We no longer check that our internal styles are included by looking for a defined CSS custom property. You can still include our base styles as before, but this removes the need to define --reach-<pkg> in your own stylesheets to silence dev warnings.

v0.17.0

💔 Breaking Changes

• disclosure
  • In uncontrolled disclosures, previously we would render the disclosure as open on the first render, regardless of the defaultOpen prop's value. This was done as a progressive enhancement to ensure content was visible to users without JavaScript, but in most cases it just meant that the user might see a flash before the state would change, causing unwanted layout shift.
  • We simplified this by simply respecting the defaultOpen prop's value on the initial render. If you want the old behavior, control the state of your disclosures and ensure that the initial open state is always set to true, then set the desired state for the following render in useEffect.
• tabs
  • Removed the isSelected from from the Tab component. This prop was useful before we had hooks, but we can now get the selected tab from context without using render props. (2dd0aec)

🐛 Bugfixes

• auto-id
  • Use the user-provided ID beyond the first render for deterministic behavior (b2f3bc0)
• tabs
  • Stop managing focus on mouse clicks to fix :focus-visible
• listbox
  • Update submit button querySelector specificity to fix incorrect button clicks (#903)
• menu-button, combobox, listbox
  • Skip rendering of portaled popovers before hydration. This prevents unwanted layout shift when the server-rendered popover mounts to a temporary DOM node (a8f38a4).

🤜🤛 8 Committers

• Ashlee M Boyer (@ashleemboyer)
• Jeff Grannes (@jeffgrannes)
• Jonathan (@jhogervorst)
• Kendall Strautman (@kendallstrautman)
• Kent C. Dodds (@kentcdodds)
• Vlad Yanchevsky (@chevsky)
• Zach Gotsch (@zgotsch)
• @rainmodred

v0.16.5

In @reach/combobox, we added a data-expanded attribute to the parent wrapper and popover for simpler styling based on the expanded state of the input.

v0.16.4

This release fixes a bug in Combobox where the selection in a controlled combobox input would trigger a flash with the stale value. We should always defer to the user's value when the input is controlled (Thanks @arackaf!) -- #865

v0.16.3

This release reverts a change in Combobox that, while addressing the issue in #755, was not tested thoroughly enough and caused a regression where in some cases the popover doesn't open until the user presses the down or up key after initial input. If you updated to v0.16.3 specifically as a workaround to this issue, I apologize! A new fix is in progress for the next release, and I'm working to ensure it's a bit more battle tested this time around.

v0.16.2

✨ Enhancements

• combobox
  • #783 Stop binding value changes from undesirely expanding combobox (@dlacaille)
• portal
  • #756 Add optional node container target to Portal (@Warsaken)
• disclosure
  • Make Disclosure accessible when Javascript is disabled (@schwartzadev)

🤜🤛 5 Committers

• Adam Rackis (@arackaf)
• Andrew Schwartz (@schwartzadev)
• Austin Wood (@indiesquidge)
• Dominic Lacaille (@dlacaille)
• @Warsaken

v0.16.1

This patch release fixes a bug when passing stable index values to descendant item components.

v0.16.0

BREAKING: This release fixes a rendering bug in the descendants, but the bug in some cases may have coincidentally allowed descendants to be re-indexed in dynamically sorted lists. While this is probably a nice feature, it didn't work consistently and created problems with nested collections.

We do not directly support dynamic sorting of lists, so if you relied on this "feature" you'll need to provide indices to the descendant item directly via props. If you're rendering dynamic lists you are probably iterating an array anyway, so you shouldn't have any issues.

This applies to all collection-based compound components:

• Tabs
• Accordion
• MenuButton
• Listbox
• Combobox

🐛 Bugfixes

• menu-button
  • Reference root's ownerDocument instead of global, better support in iframes

✨ Enhancements

• menu-button
  • Better handling of mouse-move that caused problems with long lists on small screens
• dialog
  • Update dependencies to fix small bugs in focus-lock
• rect
  • Only log warning if observe is true

🤜🤛 3 Committers

• Chance Strickland (@chaance)
• Aliaksei Kirylchyk (@akirilchik)
• Rauno (@raunofreiberg)

v0.15.3

🐛 Bugfixes

• utils
  • Typescript error for as={Link} on MenuLink (via utils/polymorphic) (@IanVS)
• menu-button
  • #812 Prevent default for links to avoid double click events (@IanVS)
  • Popover does not consistently close when clicking between Menu Buttons (@ecklf)
• listbox
  • Cannot focus on ListboxList when its styled to overlap ListboxButton (@loque)

📝 Documentation

• dialog
  • #803 Fix typo (@apollonian)
  • #786 Fix animated dialog warning (@mbellagamba)
• Other
  • #799 Add example check for CSS to respect a users anim prefs. (@Jared-Dev)

✨ Enhancements

• combobox
  • #757 If Combobox openOnFocus is true then also open when the input is clicked. (@ProggerPete)
• accordion, disclosure
  • Remove -1 tabIndex from accordion and disclosure panels (@joshuajaco)

🤜🤛 10 Committers

• Abhishek Warokar (@apollonian)
• Chance Strickland (@chaance)
• Florentin / 珞辰 (@ecklf)
• Ian VanSchooten (@IanVS)
• Jared Malcolm (@Jared-Dev)
• Joshua Jacobowitz (@joshuajaco)
• Lucas Soler (@loque)
• Mike Limberg (@mlimberg)
• Mirco Bellagamba (@mbellagamba)
• @ProggerPete

v0.15.2

🐛 Bugfixes

• menu-button
  • #812 Prevent default for links to avoid double click events (@IanVS)
• listbox
  • Cannot focus on ListboxList when it's styled to overlap ListboxButton (@loque)

📝 Documentation

• dialog
  • #800 Update react-focus-lock and react-remove-scroll dependencies
  • #803 Fix typo (@apollonian)
  • #786 Fix animated dialog warning (@mbellagamba)
• Other
  • #799 Add example check for CSS to respect a users animation preferences (@Jared-Dev)

✨ Enhancements

• combobox
  • #757 If openOnFocus is true then also open when the input is clicked (@ProggerPete)
• accordion, disclosure
  • Remove -1 tabIndex from accordion and disclosure panels (@joshuajaco)

🤜🤛 8 Committers

• Abhishek Warokar (@apollonian)
• Chance Strickland (@chaance)
• Ian VanSchooten (@IanVS)
• Jared Malcolm (@Jared-Dev)
• Joshua Jacobowitz (@joshuajaco)
• Lucas Soler (@loque)
• Mirco Bellagamba (@mbellagamba)
• @ProggerPete