Discover more from Ariakit
Provide state to Ariakit components using a simple wrapper that supports controlled and uncontrolled props.
This month, we're rolling out a new feature for Ariakit: Component providers.
Component providers are optional components that act as a higher-level API on top of component stores. They wrap Ariakit components and automatically provide a store to them.
You no longer need to manually create a store and pass it as a prop to the components. Instead, you can just wrap the components with a provider:
They also accept a store prop, enabling you to use component stores and component providers in tandem.
It's important to note that component stores aren’t going anywhere, and you do not need to migrate your code. They will continue to serve as a fundamental lower-level API.
In addition to the providers, we're also introducing context hooks such as useComboboxContext. This allows you to access the store from within components nested in providers and other top-level components like Combobox and ComboboxPopover.
Built with Ariakit
If you've created something using Ariakit and want it featured in our next newsletter, just share your work on Twitter mentioning @ariakitjs, or reply to this email.
New example: Warning on Dialog hide
Preventing users from accidentally closing a modal with unsaved changes by displaying a nested confirmation dialog.