Radix Primitives releases and their changelogs.
This release introduces 3 brand new primitives: Select, Toast and NavigationMenu, whilst also shipping a ton of fixes and improvements.
Prevent form submission when pressing Accordion.Trigger – #1085
Fix animation issue with React 18 – #1125
Improve pointer-events management – #1079
Prevent activation via enter key – #1104
Fix animation issue with React 18 – #1125
Improve pointer-events management – #1079
[Breaking] Dialog.Title is now a required part so will throw an error if not used. aria-describedby={undefined} must be passed to Dialog.Content if no description is needed. – #1098
Improve composability with Dialog/AlertDialog – #1097
Prevent clicking trigger to close from immediately reopening in non-modal mode – #1059
Prevent DropdownMenu.TriggerItem click from firing twice – #1057
Improve idle performance – #1040
New primitive – #1172
Prevent activation via enter key – #1104
New primitive – #1169
Prevent page scroll when using Home and End keys – #1076
Prevent accidental focus activation via right-click – #1114
New primitive – #1165
Improve accessibility by using radio role for single toggle group – #1118
This release focuses on React 18 support and introduces a number breaking changes to some packages, mostly related to portalling dialogs.
[Breaking] Deprecate IdProvider. Improves support for React 18 going forward and is no longer needed in older versions. Remove from your app to avoid deprecation warnings. – #1006
Improve React 18 support – #984
Improve dev mode errors with mismatched type and value props – #979
Prevent Accordion.Content height animation on initial page load – #977
[Breaking] Add new Portal part. To avoid regressions, use this part if you want portalling behavior. – #936
[Breaking] Support scrolling within AlertDialog.Overlay. Move allowPinchZoom to root. – #963
Fix asChild TypeScript error – #924
Prevent Collapsible.Content height animation on initial page load – #977
[Breaking] Add new Portal part. To avoid regressions, use this part if you want portalling behavior. – #936
[Breaking] Support scrolling within Dialog.Overlay. Move allowPinchZoom to root. – #963
Prevent disabled trigger from opening menu – #974
Fix ability to focus HoverCard when inside a dialog – #920
Prevent programmatic focus from changing value – #939
Remove invalid aria-orientation attribute on role=group element – #965
[Breaking] Add new TooltipProvider part. You must wrap your app to avoid regressions. – #1007
[Breaking] Remove type=button attribute from Tooltip.Trigger – #1011
Fix tooltip activation regression – #1035
Fix key warnings – #1015
All primitives are now versioned 0.1.1
Fix composability issues between primitives by scoping context – #906
Fix CSS unmount animations – #851
Add new CSS variable to Accordion.Content to help with width animations – #879
Improve composability with Dialog – #906
[Breaking] Remove AlertDialog.Content onInteractOutside prop – #846
Improve composability with AlertDialog – #906
Add pinch to zoom support to DropdownMenu.Content via allowPinchZoom prop – #884
Add pinch to zoom support to ContextMenu.Content via allowPinchZoom prop – #884
Prevent scroll via arrow keypress on submenu triggers – #908
Add new CSS variable to Collapsible.Content to help with width animations – #879
Prevent screen reader virtual cursor from accessing hidden input – #870
Improve composability with Tooltip – #906
Add pinch to zoom support to DropdownMenu.Content via allowPinchZoom prop – #884
Prevent scroll via arrow keypress on submenu triggers – #908
Allow its children to prevent event propagation – #861
Prevent screen reader virtual cursor from accessing hidden inputs – #870
Add pinch to zoom support to Popover.Content via allowPinchZoom prop – #884
Fix calculations when value is 0 – #866
Prevent screen reader virtual cursor from accessing hidden input – #870
[Breaking] Unmount content within Tabs.Content when tab is inactive – #859
All primitives moved to Beta and are now versioned 0.1.0
[Breaking] Replace polymorphic as prop with asChild boolean prop. Learn more
about how to change the rendered element here – #835
Improve composability with DropdownMenu – #818
Improve composability with Dialog – #818
Re-enable pointer-events when closed – #819
Prevent body text from selecting on close (Firefox) – #812
Ensure sub triggers receive focus on click (iOS Safari) – #820
[Breaking] Deprecate extendPrimitive utility – #840
Improve polymorphic types performance – #784
[Breaking] Remove AlertDialog.Content onPointerDownOutside prop – #700
Prevent outside pointer events triggering prematurely on touch devices – #767
Add modality support via modal prop – #700
[Breaking] Remove ContextMenu.Content disableOutsidePointerEvents prop – #700
Prevent outside pointer events triggering prematurely on touch devices – #767
Add modality support via modal prop – #700
Improve animation rendering in React 18 – #776
Ensure focus is restored to trigger on close when using the autofocus attribute on a child element – #739
Prevent outside pointer events triggering prematurely on touch devices – #767
Ensure iOS Safari consistently focuses the first focusable element – #776
Add modality support via modal prop – #700
[Breaking] Remove DropdownMenu.Content disableOutsideScroll prop – #700
[Breaking] Remove DropdownMenu.Content disableOutsidePointerEvents prop – #700
Prevent outside pointer events triggering prematurely on touch devices – #767
Add modality support via modal prop – #700
[Breaking] Remove Popover.Content disableOutsideScroll prop – #700
[Breaking] Remove Popover.Content disableOutsidePointerEvents prop – #700
[Breaking] Remove Popover.Content trapFocus prop – #700
Improve animation rendering in React 18 – #776
Ensure focus is restored to trigger on close when using the autofocus attribute on a child element – #739
Prevent outside pointer events triggering prematurely on touch devices – #767
Ensure iOS Safari consistently focuses the first focusable element – #776
Add data-state to ScrollBar part – #801
Prevent thumb receiving focus when disabled – #777
Prevent focus loss on thumb when using React.StrictMode – #794
Can now be triggered on touch with a long-press – #743
Add optional Title and Description parts for simpler labelling – #741
Add data-orientation to Scrollbar for styling convenience – #720
Fix forceMount type issue on Scrollbar – #738
Ensure the correct thumb is focused when using keyboard and crossing another thumb – #731
Ensure only one arrow press is needed when crossing another thumb – #733
Improve types compatibility – #737
Ensure only one click is needed to toggle a single controlled toggle group – #722
Ensure focus behaviour is consistent on Safari – #727
Improve polymorphic types – #648
[Breaking] Rename Accordion.Button to Accordion.Trigger – #651
[Breaking] Rename Accordion.Panel to Accordion.Content – #651
[Breaking] Rename custom property accordingly (--radix-accordion-content-height) – #651
[Breaking] type=“single” Accordion now has a new collapsible prop which is false by default. This means that the default behaviour has now changed. By default a user cannot close all items. – #651
[Breaking] Allow preventing default in onPointerDownOutside without inadvertently preventing focus – #654
[Breaking] onCheckedChange(event) is now onCheckedChange(checked: CheckedState) – #672
Improve compatibility with native form validation – #650
Allow stopping propagation on Checkbox onClick – #672
Improve compatibility with native label – #672
Improve accessibility when wrapped in native label – #672
[Breaking] Rename Collapsible.Button to Collapsible.Trigger – #651
Add submenu support – #682
Add ContextMenu.TriggerItem – #682
Add ContextMenu.Arrow – #682
Add dir prop for RTL support with submenus – #682
[Breaking] Allow preventing default in onPointerDownOutside without inadvertently preventing focus – #654
[Breaking] Remove ContextMenu.Content side prop – #658
[Breaking] Remove ContextMenu.Content align prop – #658
[Breaking] If you had sideOffset on ContextMenu.Content before, you should now use alignOffset. This is to standardize vertical alignment for both root and sub-menus. – #712
[Breaking] onFocusOutside is now a custom event – #671
Improve support of content and item with no padding – #658
Align with WAI-ARIA spec by focusing first item when opening via keyboard – #694
[Breaking] Allow preventing default in onPointerDownOutside without inadvertently preventing focus – #654
Add submenu support – #682
Add DropdownMenu.TriggerItem – #682
Add dir prop for RTL support with submenus – #682
[Breaking] Allow preventing default in onPointerDownOutside without inadvertently preventing focus – #654
[Breaking] onFocusOutside is now a custom event – #671
[Breaking] The up arrow no longer opens the menu – #702
Align with WAI-ARIA spec by focusing first item when opening via keyboard – #694
[Breaking] Allow preventing default in onPointerDownOutside without inadvertently preventing focus – #654
[Breaking] onFocusOutside is now a custom event – #671
[Breaking] onValueChange(event) is now onValueChange(value: string) – #685
[Breaking] Remove RadioGroup.Item onCheckedChange prop – #685
Improve compatibility with native form validation – #650
Improve usage within forms – #685
Brand new version with a simpler API – #624
Improve Safari support – #624
Improve RTL support – #624
Improve touch support – #624
Scrollbar mount/unmount can now be animated – #624
Add minimum width/height to thumb so it's always grabbable – #624
Move functional CSS into component to improve DX – #624
Bundle size significantly reduced – #624
[Breaking] Remove overflowX and overflowY props – #624
[Breaking] Remove ScrollAreaButtonStart, ScrollAreaButtonEnd and ScrollAreaTrack – #624
[Breaking] Rename scrollbarVisibility prop to type. The values are auto, always, scroll or hover – #624
[Breaking] Rename scrollbarVisibilityRestTimeout prop to scrollHideDelay – #624
[Breaking] Remove trackClickBehavior prop as we've removed built-in animation. Clicking on track always snaps to pointer position – #624
[Breaking] ScrollAreaScrollbarX and ScrollAreaScrollbarY are now <ScrollAreaScrollbar orientation="horizontal" /> and <ScrollAreaScrollbar orientation="vertical" /> – #624
Ensure no scrollbars are shown when scrolling is disabled – #624
Ensure children event handlers don't break – #624
Ensure scroll area updates when children content size changes – #624
[Breaking] onCheckedChange(event) is now onCheckedChange(checked: boolean) – #679
Improve compatibility with native form validation – #650
Improve usage within forms – #679
Improve accessibility when wrapped in native label – #679
[Breaking] Rename Tabs.Tab to Tabs.Trigger – #652
[Breaking] Rename Tabs.Panel to Tabs.Content – #652
Improve polymorphic types performance – #613
Ensure only one click is needed to close a single controlled accordion – #594
[Breaking] Remove readOnly prop – #600
Add onOpenChange prop – #604
Ensure focus position isn't lost when blurring out window and re-focusing it – #589
Take into account non-visible items – #618
[Breaking] Remove anchorRef prop – #580
Prevent page from scrolling when selecting an item with space key – #626
New primitive – #595
[Breaking] Remove anchorRef prop and replace with optional Anchor part – #580
[Breaking] Remove readOnly prop – #600
Add optional orientation, dir, loop props – #618
[Breaking] Remove anchorRef prop – #580
Improve tree-shaking – #577
Ensure you can open a context menu when one is already open – #565
Fix potential overlap issue – #541
Ensure Content closes when it has multiple close animations – #571
[Breaking] Rename ToggleButton primitive to Toggle – #546
[Breaking] Rename toggled prop to pressed – #546
[Breaking] Rename defaultToggled prop to defaultPressed – #546
[Breaking] Rename onToggledChange prop to onPressedChange – #546
New primitive – #376
Add height CSS custom property to panel for easier animation – #537
Add height CSS custom property to content for easier animation – #537
Fix type definition conflicts – #538
Add support for SSR
[Breaking] Remove selector prop and data-radix-* atributes – #517
[Breaking] Add support for multiple values. Note that this is a breaking change because the new type prop is required – #527
Ensure step is rounded correctly – #463
Add RTL support (dir prop) – #497
Ensure events are composed when using <Trigger as={Slot}> – #461
Expose onCloseAutoFocus prop – #456
Expose onCloseAutoFocus prop – #456
Fix type autocompletion when using as prop – #421
Prevent open/close flickering – #431
Ensure focus is returned properly on close – #422
[Breaking] Move name prop from Item to Root – #424
Re–add missing children – #414
Re–add missing children – #414
Prevent flickering (sliding) issue – #415
New utility – #409
Fix regression when tabbing out would close – #403
Fix broken arrow keys navigation – #404
Add selector prop – #347
Ensure setting disabled={false} on Root doesn't enable disabled items – #400
Ensure Content repositions on window resize – #359
Ensure last element inside Content triggers blur event – #395
Initial release! 🎉 – #338