PackageTrack

npm · #4495

@headlessui/react

2.2.10tailwindlabs/headlessui ↗

A set of completely unstyled, fully accessible UI components for React, designed to integrate beautifully with Tailwind CSS.

Release timeline

819 releases since 2020
202120222023202420252026

Releases

  1. 1.4.28 Nov 2021
    Release notes

    Fixes

    • Stop the event from propagating in the Popover component (#798)
    • Allow clicking on elements inside a DialogOverlay (#816)
    • Fix SSR crash because of useWindowEvent (#817)
    • Improve tree shaking (#859)
    • Add type="button" to Tabs component (#912)
    Open source →
    Additional notes2 sources agree

    Fixes

    • Stop the event from propagating in the Popover component (#798)
    • Allow clicking on elements inside a Dialog.Overlay (#816)
    • Ensure interactability with Popover.Panel contents when using the static prop (#857)
    • Fix initial transition in Transition component (#882)
    Open source →
  2. 1.4.130 Aug 2021
    Release notes

    Fixes

    • Only add type=button to real buttons (#709)
    • Add Vue emit types (#679, #712)
    • Fix escape bug not closing Dialog after clicking in Dialog (#754)
    • Use console.warn instead of throwing an error when there are no focusable elements (#775)
    Open source →
    Additional notes2 sources agree

    Fixes

    • Only add type=button to real buttons (#709)
    • Fix escape bug not closing Dialog after clicking in Dialog (#754)
    • Use console.warn instead of throwing an error when there are no focusable elements (#775)
    Open source →
  3. 1.4.029 Jul 2021
    Release notes

    Added

    • Add new Tabs component (#674, #698)
    • Make DisclosureButton close the disclosure inside a DisclosurePanel (#682)
    • Add aria-orientation to Listbox, which swaps Up/Down with Left/Right keys (#683)
    • Expose close function from the scoped slot for Disclosure, DisclosurePanel, Popover and PopoverPanel (#697)
    Open source →
    Additional notes2 sources agree

    Added

    • Add new Tabs component (#674, #698)
    • Make Disclosure.Button close the disclosure inside a Disclosure.Panel (#682)
    • Add aria-orientation to Listbox, which swaps Up/Down with Left/Right keys (#683)
    • Expose close function from the render prop for Disclosure, Disclosure.Panel, Popover and Popover.Panel (#697)
    Open source →
  4. 1.3.021 Jun 2021
    Release notes

    Added

    • Ensure that you can use TransitionChild when using implicit Transitions (#503)
    • Add new entered prop for Transition and TransitionChild components (#504)

    Fixes

    • Add aria-disabled on disabled RadioGroup.Option components (#543)
    • Improve disabled and tabindex prop handling (#512)
    • Improve reactivity when destructuring from props (#512)
    • Improve aria-expanded logic (#592)
    Open source →
    Additional notes2 sources agree

    Added

    • Ensure that you can use Transition.Child when using implicit Transitions (#503)
    • Add new entered prop for Transition and Transition.Child components (#504)

    Fixes

    • Add aria-disabled on disabled RadioGroup.Option components (#543)
    • Improve disabled and tabindex prop handling (#512)
    • Improve React peer dependency version range (#544)
    • Improve types for the open prop in the Dialog component (#550)
    • Improve aria-expanded logic (#592)
    • Remove undocumented :className prop (#607)
    • Improve types for Listbox component (#576)
    • Remove explicit :class prop (#608)
    • Improve tree shaking (#602)
    • Improve peer dependencies for react-dom, and for the future version 18 (#622)
    Open source →
  5. 1.2.010 May 2021
    Release notes

    Added

    • Introduce Open/Closed state, to simplify component communication (#466)
    Open source →
    Additional notes

    Added

    • Introduce Open/Closed state, to simplify component communication (#466)

    Fixes

    • Improve SSR for Dialog (#477)
    • Delay focus trap initialization (#477)
    • Improve incorrect behaviour for nesting Dialog components (#560)

    The Open/Closed state unlocks a feature where all our components can interact with each other. This means that you don't need to use the render prop function, and that you also don't need the static prop anymore for transitions. Here is an example in the docs that explains this: https://headlessui.dev/react/menu#transitions

    Open source →
    Additional notes

    Added

    • Introduce Open/Closed state, to simplify component communication (#466)

    Fixes

    • Improve SSR for Dialog (#477)
    • Delay focus trap initialization (#477)
    • Improve incorrect behavior for nesting Dialog components (#560)
    Open source →
  6. 1.2.0-e56dd0715 Jun 2021pre-release

    Nothing published for this version

  7. 1.2.0-d0e27ff20 May 2021pre-release

    Nothing published for this version

  8. 1.2.0-2279cd912 May 2021pre-release

    Nothing published for this version

  9. 1.1.128 Apr 2021
    Release notes

    Fixes

    • Fix form submission within Dialog (#460)
    • Fix TypeScript types for Listbox and Switch (#459, #461)
    Open source →
    Additional notes2 sources agree

    Fixes

    • Fix form submission within Dialog (#460)
    Open source →
  10. 1.1.1-c13e6b74 May 2021pre-release

    Nothing published for this version

  11. 1.1.1-ab928113 May 2021pre-release

    Nothing published for this version

  12. 1.1.1-084a2497 May 2021pre-release

    Nothing published for this version

  13. 1.1.026 Apr 2021
    Release notes

    Fixes

    • Improve search, make searching case insensitive (#385)
    • Fix unreachable RadioGroup (#401)
    • Fix RadioGroupOption value type (#400)
    • Fix closing nested Dialog components when pressing Escape (#430)

    Added

    • Add disabled prop to RadioGroup and RadioGroupOption (#401)
    • Add defaultOpen prop to the Disclosure component (#447)
    Open source →
    Additional notes2 sources agree

    Fixes

    • Improve search, make searching case insensitive (#385)
    • Fix unreachable RadioGroup (#401)
    • Fix closing nested Dialog components when pressing Escape (#430)

    Added

    • Add disabled prop to RadioGroup and RadioGroup.Option (#401)
    • Add defaultOpen prop to the Disclosure component (#447)
    Open source →
  14. 1.0.014 Apr 2021
    Release notes

    This is the v1 release of Headless UI - Vue

    We introduced a bunch of new components for this release:

    We also created a beautiful new documentation website: https://headlessui.dev/vue

    Changelog:

    Fixes

    • Fix incorrect DOM node from ref (#249)
    • Stop propagating keyboard/mouse events (#282)

    Added

    • Add SwitchDescription component, which adds the aria-describedby to the actual Switch (#220)
    • Add Disclosure, DisclosureButton, DisclosurePanel components (#282)
    • Add Dialog, DialogOverlay, DialogTitle and DialogDescription components (#282)
    • Add Portal and PortalGroup components (#282)
    • Add FocusTrap component (#282)
    • Add Popover, PopoverButton, PopoverOverlay, PopoverPanel and PopoverGroup components (#282)
    • Add RadioGroup, RadioGroupOption, RadioGroupLabel and RadioGroupDescription components (#282)
    • Add TransitionRoot and TransitionChild components (#326)
    Open source →
    Additional notes

    This is the v1 release of Headless UI - React

    We introduced a bunch of new components for this release:

    We also created a beautiful new documentation website: https://headlessui.dev/react

    Changelog:

    Fixes

    • Fixed outside click not re-focusing the Menu.Button (#220, #256)
    • Fixed outside click not re-focusing the Listbox.Button (#220, #256)
    • Force focus in Menu.Items and Listbox.Options from within the component itself (#261)
    • Stop propagating keyboard/mouse events (#261)

    Added

    • Add Disclosure, Disclosure.Button and Disclosure.Panel components (#220)
    • Add Dialog, Dialog.Overlay, Dialog.Tile and Dialog.Description components (#220)
    • Add Portal and Portal.Group component (#220)
    • Add Switch.Description component, which adds the aria-describedby to the actual Switch (#220)
    • Add FocusTrap component (#220)
    • Add Popover, Popover.Button, Popover.Overlay, Popover.Panel and Popover.Group components (#220)
    • All components that accept a className, can now also receive a function with the renderProp argument (#257)
    • Add RadioGroup, RadioGroup.Option, RadioGroup.Label and RadioGroup.Description components (#274)
    Open source →
    Additional notes

    Fixes

    • Fixed outside click not re-focusing the Menu.Button (#220, #256)
    • Fixed outside click not re-focusing the Listbox.Button (#220, #256)
    • Force focus in Menu.Items and Listbox.Options from within the component itself (#261)
    • Stop propagating keyboard/mouse events (#261)

    Added

    • Add Disclosure, Disclosure.Button and Disclosure.Panel components (#220)
    • Add Dialog, Dialog.Overlay, Dialog.Tile and Dialog.Description components (#220)
    • Add Portal and Portal.Group component (#220)
    • Add Switch.Description component, which adds the aria-describedby to the actual Switch (#220)
    • Add FocusTrap component (#220)
    • Add Popover, Popover.Button, Popover.Overlay, Popover.Panel and Popover.Group components (#220)
    • All components that accept a className, can now also receive a function with the renderProp argument (#257)
    • Add RadioGroup, RadioGroup.Option, RadioGroup.Label and RadioGroup.Description components (#274)
    Open source →
  15. 1.0.0-ef31bbe21 Apr 2021pre-release

    Nothing published for this version

  16. 1.0.0-ce8d7f519 Apr 2021pre-release

    Nothing published for this version

  17. 1.0.0-be833ba16 Apr 2021pre-release

    Nothing published for this version

  18. 1.0.0-43d527022 Apr 2021pre-release

    Nothing published for this version

  19. 0.3.22 Apr 2021
    Release notes2 sources agree

    Fixes

    • Fix incorrect type error unique symbol (#248, #240)
    Open source →
  20. 0.3.2-d9501469 Apr 2021pre-release

    Nothing published for this version

  21. 0.3.2-cdfeeac8 Apr 2021pre-release

    Nothing published for this version

  22. 0.3.2-a02c8188 Apr 2021pre-release

    Nothing published for this version

  23. 0.3.2-5ff52256 Apr 2021pre-release

    Nothing published for this version

  24. 0.3.2-494292813 Apr 2021pre-release

    Nothing published for this version

  25. 0.3.111 Feb 2021
    Release notes

    Fixes

    • Fix broken behaviour since Vue 3.0.5 (#279)
    Open source →
    Additional notes2 sources agree

    Fixes

    • Fix incorrect types path (d557d50)
    • Fix TypeScript render related types (bb68793)
    Open source →
  26. 0.3.1-ece9b5f16 Feb 2021pre-release

    Nothing published for this version

  27. 0.3.1-d519f7d26 Feb 2021pre-release

    Nothing published for this version

  28. 0.3.1-c4549e419 Feb 2021pre-release

    Nothing published for this version

  29. 0.3.1-b7fe69a31 Mar 2021pre-release

    Nothing published for this version

  30. 0.3.1-b30969930 Mar 2021pre-release

    Nothing published for this version

  31. 0.3.1-a94cc7919 Feb 2021pre-release

    Nothing published for this version

  32. 0.3.1-8de011410 Mar 2021pre-release

    Nothing published for this version

  33. 0.3.1-854cc8319 Feb 2021pre-release

    Nothing published for this version

  34. 0.3.1-7c43e551 Mar 2021pre-release

    Nothing published for this version

  35. 0.3.1-7c43e541 Mar 2021pre-release

    Nothing published for this version

  36. 0.3.1-7c43e531 Mar 2021pre-release

    Nothing published for this version

  37. 0.3.1-56fb7d411 Feb 2021pre-release

    Nothing published for this version

  38. 0.3.1-4cb437423 Feb 2021pre-release

    Nothing published for this version

  39. 0.3.1-33d49e323 Feb 2021pre-release

    Nothing published for this version

  40. 0.3.1-285724f26 Mar 2021pre-release

    Nothing published for this version

  41. 0.3.1-1fd5e2112 Feb 2021pre-release

    Nothing published for this version

  42. 0.3.1-197e1b218 Feb 2021pre-release

    Nothing published for this version

  43. 0.3.1-197e1b117 Feb 2021pre-release

    Nothing published for this version

  44. 0.3.1-197e1b017 Feb 2021pre-release

    Nothing published for this version

  45. 0.3.1-197e1af17 Feb 2021pre-release

    Nothing published for this version

  46. 0.3.1-197e1ae16 Feb 2021pre-release

    Nothing published for this version

  47. 0.3.1-197e1ad16 Feb 2021pre-release

    Nothing published for this version

  48. 0.3.1-01508f024 Feb 2021pre-release

    Nothing published for this version

  49. 0.3.1-79220894 Mar 2021pre-release

    Nothing published for this version

  50. 0.3.06 Feb 2021
    Release notes

    Fixes

    • Ensure that you can't use Enter to invoke the Switch
    • Fix outside click refocus bug (#114)
    • Prevent scrolling when refocusing items
    • Ensure Switch has type="button" (#192)
    • Added emits property to Vue components (#199)
    • Fix disabled not working when inside a disabled fieldset (#202)
    • Trigger "outside click" behaviour on mousedown (#212)
    • Ensure the active MenuItem is scrolled into view
    • Ensure valid Menu accessibility tree (#228)

    Added

    • Add render features + render strategy (static and unmount={true | false}) (#106)
    • Add disabled prop to Listbox itself, instead of the ListboxButton (#229)
    Open source →
    Additional notes

    Fixes

    • Ensure that you can't use Enter to invoke the Switch
    • Fix outside click refocus bug (#114)
    • Prevent scrolling when refocusing items
    • Ensure Switch has type="button" (#192)
    • Fix useId() hook returning undefined on the client
    • Fix disabled not working when inside a disabled fieldset (#202)
    • Trigger "outside click" behaviour on mousedown (#212)
    • Ensure the active MenuItem is scrolled into view
    • Ensure valid Menu accessibility tree (#228)

    Added

    • Add Transition events (beforeEnter, afterEnter, beforeLeave and afterLeave) (#57)
    • Add render features + render strategy (static and unmount={true | false}) (#106)
      • Also changes the API of Transition component.
        • We will now always render a div by default (unless you change this using the as={...} prop).
        • The render function prop doesn't expose a ref anymore.
        • Adds unmount prop to the Transition and Transition.Child components.
    • Add displayName to all contexts (#175)
    • Add disabled prop to Listbox itself, instead of the Listbox.Button (#229)

    Upgrade Path

    We changed the API of the Transition component to be more inline with the other API's of the various components. We now always render a div for the Transition and Transition.Child component. If you want to use a render function, then we still render a div. The render function also used do expose a ref prop, which is now not the case anymore. You can still use the as prop to change the underlying div to another element or component.

    // From
<Transition
  show={true}
  enter=".."
  enterFrom=".."
  enterTo=".."
  leave=".."
  leaveFrom=".."
  leaveTo=".."
>
  {ref => (
    <div ref={ref} className="these classes always apply">
      <span>Child</span>
    </div>
  )}
</Transition>

// To (option 1) - Hoist attributes from the first child `div` to the `Transition` itself
<Transition
  show={true}
  enter=".."
  enterFrom=".."
  enterTo=".."
  leave=".."
  leaveFrom=".."
  leaveTo=".."
  className="these classes always apply"
>
  <span>Child</span>
</Transition>

// To (option 2) - Add `as={Fragment}` to the `Transition` component.
<Transition
  as={React.Fragment}
  show={true}
  enter=".."
  enterFrom=".."
  enterTo=".."
  leave=".."
  leaveFrom=".."
  leaveTo=".."
>
  <div className="these classes always apply">
    <span>Child</span>
  </div>
</Transition>
    Open source →
    Additional notes

    Fixes

    • Ensure that you can't use Enter to invoke the Switch
    • Fix outside click refocus bug (#114)
    • Prevent scrolling when refocusing items
    • Ensure Switch has type="button" (#192)
    • Fix useId() hook returning undefined on the client
    • Fix disabled not working when inside a disabled fieldset (#202)
    • Trigger "outside click" behavior on mousedown (#212)
    • Ensure the active MenuItem is scrolled into view
    • Ensure valid Menu accessibility tree (#228)

    Added

    • Add Transition events (beforeEnter, afterEnter, beforeLeave and afterLeave) (#57)
    • Add render features + render strategy (static and unmount={true | false}) (#106)
    • Add displayName to all contexts (#175)
    • Add disabled prop to Listbox itself, instead of the Listbox.Button (#229)

    Changes

    • Changes the API of the Transition component.
      • We will now always render a div by default (unless you change this using the as={...} prop).
      • The render function prop doesn't expose a ref anymore.
      • Adds unmount prop to the Transition and Transition.Child components.
    Open source →
  51. 0.3.0-f34c0868 Feb 2021pre-release

    Nothing published for this version

  52. 0.3.0-dc528c08 Feb 2021pre-release

    Nothing published for this version

  53. 0.3.0-ce725bd8 Feb 2021pre-release

    Nothing published for this version

  54. 0.3.0-cb4fe618 Feb 2021pre-release

    Nothing published for this version

  55. 0.3.0-6987d688 Feb 2021pre-release

    Nothing published for this version

  56. 0.3.0-2c5230d9 Feb 2021pre-release

    Nothing published for this version

  57. 0.3.0-0dd88d18 Feb 2021pre-release

    Nothing published for this version

  58. 0.2.06 Oct 2020
    Release notes

    Added

    • Add ui-focus-visible variant to Tailwind plugin (#2347)
    • Add ui-not-focus-visible variant to Tailwind plugin (#2618)
    Open source →
    Additional notes2 sources agree
    • Add Listbox component
    • Add Switch component
    Open source →
    Additional notes

    Added

    • Add Listbox component
    • Add Switch component
    Open source →
  59. 0.2.0-da179ca29 Jan 2021pre-release

    Nothing published for this version

  60. 0.2.0-ab820de24 Jan 2021pre-release

    Nothing published for this version