Popover: enable auto-updating every animation frame (#43617).Popover: improve the component's performance and reactivity to prop changes by reworking its internals (#43335).
ToggleControl: Add__nextHasNoMarginprop for opting into the new margin-free styles (#43717).
- Remove unused
normalizeArrowKeyutility function (#43640). - Refactor
FocalPointPickerto function component (#39168). Guide: usecodeinstead ofkeyCodefor keyboard events (#43604).ToggleControl: Convert to TypeScript and streamline CSS (#43717).Navigation: usecodeinstead ofkeyCodefor keyboard events (#43644).ComboboxControl: Add unit tests (#42403).ComboboxControl: updated to satisfyreact/exhuastive-depseslint rule (#41417)
CustomSelectControl: Deprecate constrained width style. Add a__nextUnconstrainedWidthprop to start opting into the unconstrained width that will become the default in a future version, currently scheduled to be WordPress 6.4 (#43230).
AlignmentMatrixControl: keep the physical direction in RTL languages (#43126).AlignmentMatrixControl: Fix thewidthprop so it works as intended (#43482).SelectControl,CustomSelectControl: Truncate long option strings (#43301).ToggleGroupControl: Fix minor inconsistency in label height (#43331).Popover: fix and improve opening animation (#43186).Popover: fix incorrect deps in hooks resulting in incorrect positioning after callingupdate(#43267).FontSizePicker: Fix excessive margin between label and input (#43304).- Ensure all dependencies allow version ranges (#43355).
Popover: make sure offset middleware always applies the latest frame offset values (#43329).Dropdown: anchor popover to the dropdown wrapper (instead of the toggle) (#43377).Guide: Fix error when rendering with no pages (#43380).
CustomGradientPicker,GradientPicker: Add__nextHasNoMarginprop for opting into the new margin-free styles (#43387).ToolsPanel: Tighten grid gaps (#43424).ColorPalette: Make popover style consistent (#43570).ToggleGroupControl: Improve TypeScript documentation (#43265).ComboboxControl: Normalize hyphen-like characters to an ASCII hyphen (#42942).FormTokenField: Refactor away from_.difference()(#43224).Autocomplete: useKeyboardEvent.codeinstead ofKeyboardEvent.keyCode(#43432).ConfirmDialog: replace (almost) every usage offireEventwith@testing-library/user-event(#43429).Popover: Introduce newflipandresizeprops (#43546).
Tooltip: Refactor tests to@testing-library/react(#43061).ClipboardButton,FocusableIframe,IsolatedEventContainer,withConstrainedTabbing,withSpokenMessages: Improve TypeScript types (#43579).- Clean up unused and duplicate
COLORSvalues (#43445). - Update
floating-uito the latest version (#43206). DateTimePicker,TimePicker,DatePicker: Switch frommomenttodate-fns(#43005).DatePicker: Switch fromreact-datestouse-lilius(#43005).DateTimePicker: address feedback after recent refactor todate-fnsanduse-lilius(#43495).convertLTRToRTL(): Refactor away from_.mapKeys()(#43258).withSpokenMessages: Update to use@testing-library/react(#43273).MenuGroup: Refactor unit tests to use@testing-library/react(#43275).FormTokenField: Refactor away from_.uniq()(#43330).contextConnect: Refactor away from_.uniq()(#43330).ColorPalette: Refactor away from_.uniq()(#43330).Guide: Refactor away from_.times()(#43374).Disabled: Convert to TypeScript (#42708).Guide: Update tests to use@testing-library/react(#43380).Modal: useKeyboardEvent.codeinstead of deprecatedKeyboardEvent.keyCode. improve unit tests (#43429).FocalPointPicker: useKeyboardEvent.code, partially refactor tests to modern RTL anduser-event(#43441).CustomGradientPicker: useKeyboardEvent.codeinstead ofKeyboardEvent.keyCode(#43437).Card: Convert to TypeScript (#42941).NavigableContainer: Refactor away from_.omit()(#43474).Notice: Refactor away from_.omit()(#43474).Snackbar: Refactor away from_.omit()(#43474).UnitControl: Refactor away from_.omit()(#43474).BottomSheet: Refactor away from_.omit()(#43474).DropZone: Refactor away from_.includes()(#43518).NavigableMenu: Refactor away from_.includes()(#43518).Tooltip: Refactor away from_.includes()(#43518).TreeGrid: Refactor away from_.includes()(#43518).FormTokenField: useKeyboardEvent.code, refactor tests to modern RTL anduser-event(#43442).DropdownMenu: useKeyboardEvent.code, refactor tests to model RTL anduser-event(#43439).Autocomplete: Refactor away from_.escapeRegExp()(#43629).TextHighlight: Refactor away from_.escapeRegExp()(#43629).
FormTokenField: add__experimentalAutoSelectFirstMatchprop to auto select the first matching suggestion on typing (#42527).Popover: Deprecate__unstableForcePosition, now replaced by newflipandresizeprops (#43546).
Popover: make sure thatownerDocumentis always defined (#42886).ExternalLink: Check if the link is an internal anchor link and prevent anchor links from being opened. (#42259).BorderControl: Ensure box-sizing is reset for the control (#42754).InputControl: Fix acceptance of falsy values in controlled updates (#42484).Tooltip (Experimental),CustomSelectControl,TimePicker: Add missing font-size styles which were necessary in non-WordPress contexts (#42844).TextControl,TextareaControl,ToggleGroupControl: Addbox-sizingreset style (#42889).Popover: fix arrow placement and design (#42874).Popover: fix minor glitch in arrow #42903).ColorPicker: fix layout overflow #42992).ToolsPanel: Constrain grid columns to 50% max-width (#42795).Popover: anchor correctly to parent node when no explicit anchor is passed (#42971).ColorPalette: forward correctlypopoverPropsin theCustomColorPickerDropdowncomponent #42989).ColorPalette,CustomGradientBar: restore correct color picker popover position #42989).Popover: fix iframe offset not updating when iframe resizes (#42971).
ToggleGroupControlOptionIcon: Maintain square proportions (#43060).ToggleGroupControlOptionIcon: Add a requiredlabelprop so the button is always accessibly labeled. Also removesshowTooltipfrom the accepted prop types, as the tooltip will now always be shown. (#43060).SelectControl,CustomSelectControl: Refresh and refactor chevron down icon (#42962).FontSizePicker: Add large size variant (#42716).Popover: tidy up code, add more comments (#42944).- Add
box-sizingreset style mixin to utils (#42754). ResizableBox: Make tooltip background matchTooltipcomponent's (#42800).- Update control labels to the new uppercase styles (#42789).
UnitControl: Update unit dropdown design for the large size variant (#42000).BaseControl: Addbox-sizingreset style (#42889).ToggleGroupControl,RangeControl,FontSizePicker: Add__nextHasNoMarginBottomprop for opting into the new margin-free styles (#43062).BoxControl: ExportapplyValueToSidesutil function. (#42733).ColorPalette: use index while iterating over color entries to avoid React "duplicated key" warning (#43096).AnglePickerControl: Add__nextHasNoMarginBottomprop for opting into the new margin-free styles (#43160).ComboboxControl: Add__nextHasNoMarginBottomprop for opting into the new margin-free styles (#43165).
ToggleGroupControl: Add__experimentalIsIconGroupprop (#43060).Flex,FlexItem,FlexBlock: Convert to TypeScript (#42537).InputControl: Fix incorrectsizeprop passing (#42793).Placeholder: Convert to TypeScript (#42990).Popover: rewrite Storybook examples using controls #42903).Swatch: Remove component in favor ofColorIndicator#43068).
- Context System: Stop explicitly setting
undefinedto thechildrenprop. This fixes a bug whereIconcould not be correctly rendered via theasprop of a context-connected component (#42686). Popover,Dropdown: Fix width whenexpandOnMobileis enabled (#42635).CustomSelectControl: Fix font size and hover/focus style inconsistencies withSelectControl(#42460).AnglePickerControl: Fix gap between elements in RTL mode (#42534).ColorPalette: Fix background image in RTL mode (#42510).RangeControl: clamp initialPosition between min and max values (#42571).Tooltip: avoid unnecessary re-renders of select child elements (#42483).Popover: Fix offset when the reference element is within an iframe. (#42417).
BorderControl: Improve labelling, tooltips and DOM structure (#42348).BaseControl: Set zero padding onStyledLabelto ensure cross-browser styling (#42348).InputControl: Implement wrapper subcomponents for adding responsive padding toprefix/suffix(#42378).SelectControl: Add flag for larger default size (#42456).UnitControl: Update unit select's focus styles to match input's (#42383).ColorPalette: Display checkered preview background whenvalueis transparent (#42232).CustomSelectControl: Add size variants (#42460).CustomSelectControl: Add flag to opt in to unconstrained width (#42460).Dropdown: Implement wrapper subcomponent for adding different padding to the dropdown content (#42595).BorderControl: Render dropdown as prefix within itsUnitControl(#42212)UnitControl: Update prop types to allow ReactNode as prefix (#42212)ToolsPanel: Updated README with panel layout information and more expansive usage example (#42615).ComboboxControl,FormTokenField: Add custom render callback for options in suggestions list (#42597).
ColorPicker: Clean up implementation of 40px size (#42002).Divider: Complete TypeScript migration (#41991).Divider,Flex,Spacer: Improve documentation for theSpaceInputprop (#42376).Elevation: Convert to TypeScript (#42302).ScrollLock: Convert to TypeScript (#42303).Shortcut: Convert to TypeScript (#42272).TreeSelect: Refactor away from_.compact()(#42438).MediaEdit: Refactor away from_.compact()for mobile (#42438).BoxControl: Refactor away from_.isEmpty()(#42468).RadioControl: Refactor away from_.isEmpty()(#42468).SelectControl: Refactor away from_.isEmpty()(#42468).StyleProvider: Convert to TypeScript (#42541).ComboboxControl: ReplacekeyboardEvent.keyCodewithkeyboardEvent.code(#42569).ComboboxControl: Add support for uncontrolled mode (#42752).
BoxControl: Change ARIA role fromregiontogroupto avoid unwanted ARIA landmark regions (#42094).FocalPointPicker,FormTokenField,ResizableBox: Fixed SSR breakage (#42248).ComboboxControl: use custom prefix when generating the instanceId (#42134.Popover: pass missing anchor ref to thegetAnchorRectcallback prop. (#42076).Popover: callgetAnchorRectcallback prop even ifanchorRefFallbackhas no value. (#42329).- Fix
ToolTipposition to ensure it is always positioned relative to the first child of the ToolTip. (#41268)
ToggleGroupControl: Add large size variant (#42008).InputControl: Ensure that the padding between aprefix/suffixand the text input stays at a reasonable 8px, even in larger size variants (#42166).
Grid: Convert to TypeScript (#41923).TextHighlight: Convert to TypeScript (#41698).Tip: Convert to TypeScript (#42262).Scrollable: Convert to TypeScript (#42016).Spacer: Complete TypeScript migration (#42013).VisuallyHidden: Convert to TypeScript (#42220).TreeSelect: Refactor away from_.repeat()(#42070).FocalPointPickerupdated to satisfyreact/exhaustive-depseslint rule (#41520).ColorPickerupdated to satisfyreact/exhaustive-depseslint rule (#41294).Slot/Fill: Refactor away from Lodash (#42153).ComboboxControl: Refactor away from_.deburr()(#42169).FormTokenField: Refactor away from_.identity()(#42215).SelectControl: Use roles and@testing-library/user-eventin unit tests (#42308).DropdownMenu: Refactor away from Lodash (#42218).ToolbarGroup: Refactor away from_.flatMap()(#42223).TreeSelect: Refactor away from_.flatMap()(#42223).Autocomplete: Refactor away from_.deburr()(#42266).MenuItem: Refactor away from_.isString()(#42268).Shortcut: Refactor away from_.isString()(#42268).Shortcut: Refactor away from_.isObject()(#42336).RangeControl: Convert to TypeScript (#40535).ExternalLink: Refactor away from Lodash (#42341).Navigation: updated to satisfyreact/exhaustive-depseslint rule (#41612)
ColorPicker: Remove horizontal scrollbar when using HSL or RGB color input types. (#41646)ColorPicker: Widen hex input field for mobile. (#42004)
- Wrapped
ColorIndicatorin aforwardRefcall (#41587). ComboboxControl&FormTokenField: Add__next36pxDefaultSizeflag for larger default size (#40746).BorderControl: Improve TypeScript support. (#41843).DatePicker: highlight today's date. (#41647).- Allow automatic repositioning of
BorderBoxControlandColorPalettepopovers within smaller viewports (#41930).
Spinner: Convert to TypeScript and update storybook (#41540).InputControl: Add tests and update to use@testing-library/user-event(#41421).FormToggle: Convert to TypeScript (#41729).ColorIndicator: Convert to TypeScript (#41587).Truncate: Convert to TypeScript (#41697).FocalPointPicker: Refactor away from_.clamp()(#41735).RangeControl: Refactor away from_.clamp()(#41735).- Refactor components
utilsaway from_.clamp()(#41735). BoxControl: Refactor utils away from_.isNumber()(#41776).Elevation: Refactor away from_.isNil()(#41785).HStack: Refactor away from_.isNil()(#41785).Truncate: Refactor away from_.isNil()(#41785).VStack: Convert to TypeScript (#41850).AlignmentMatrixControl: Refactor away from_.flattenDeep()in utils (#41814).AutoComplete: Revert recentexhaustive-depsrefactor (#41820).Spacer: Convert knobs to controls in Storybook (#41851).Heading: Complete TypeScript migration (#41921).Navigation: Refactor away from Lodash functions (#41865).CustomGradientPicker: Refactor away from Lodash (#41901).SegmentedControl: Refactor away from_.values()(#41905).DimensionControl: Refactor docs away from_.partialRight()(#41909).NavigationItemupdated to ignorereact/exhaustive-depseslint rule (#41639).
Tooltip: Opt in to__unstableShiftto ensure that the Tooltip is always within the viewport. (#41524)FormTokenField: Do not suggest the selected one even if{ value: string }is passed (#41216).CustomGradientBar: Fix insertion and control point positioning to more closely follow cursor. (#41492)FormTokenField: Added Padding to resolve close button overlap issue (#41556).ComboboxControl: fix the autofocus behavior after resetting the value. (#41737).
AnglePickerControl: Use NumberControl as input field (#41472).
FormTokenField: Convert to TypeScript and refactor to functional component (#41216).Draggable: updated to satisfyreact/exhaustive-depseslint rule (#41499)RadioControl: Convert to TypeScript (#41568).Flexupdated to satisfyreact/exhaustive-depseslint rule (#41507).CustomGradientBarupdated to satisfyreact/exhaustive-depseslint rule (#41463)TreeSelect: Convert to TypeScript (#41536).FontSizePicker: updated to satisfyreact/exhaustive-depseslint rule (#41600).ZStack: Convert component story to TypeScript and add inline docs (#41694).Dropdown: Make sure cleanup (closing the dropdown) only runs when the menu has actually been opened.- Enhance the TypeScript migration guidelines (#41669).
ExternalLink: Convert to TypeScript (#41681).InputControlupdated to satisfyreact/exhaustive-depseslint rule (#41601)Modal: updated to satisfyreact/exhaustive-depseslint rule (#41610)
Navigation: improve unit tests by using@testing-library/user-eventand modern@testing-libraryassertions; add unit test for controlled component (#41668).
Popover,Dropdown,CustomGradientPicker: Fix dropdown positioning by always targeting the rendered toggle, and switch off width in the Popover size middleware to stop reducing the width of the popover. (#41361)- Fix
InputControlblocking undo/redo while focused. (#40518) ColorPalette: Correctly update color name label when CSS variables are involved (#41461).
SelectControl: Add__nextHasNoMarginBottomprop for opting into the new margin-free styles (#41269).ColorPicker: Strip leading hash character from hex values pasted into input. (#41223)ColorPicker: Display detailed color inputs by default. (#41222)- Updated design for the
DateTimePicker,DatePickerandTimePickercomponents (#41097). DateTimePicker: Add__nextRemoveHelpButtonand__nextRemoveResetButtonfor opting into new behaviour where there is no Help and Reset button (#41097).
AlignmentMatrixControlupdated to satisfyreact/exhaustive-depseslint rule (#41167)BorderControlupdated to satisfyreact/exhaustive-depseslint rule (#41259)CheckboxControl: Add unit tests (#41165).BorderBoxControl: fix some layout misalignments, especially for RTL users (#41254).TimePicker: Update unit tests to use@testing-library/user-event(#41270).DateTimePicker: Updatemomentto 2.26.0 and updatereact-datetypings (#41266).TextareaControl: Convert to TypeScript (#41215).BoxControl: Update unit tests to use@testing-library/user-event(#41422).Surface: Convert to TypeScript (#41212).Autocompleteupdated to satisfyreact/exhaustive-depseslint rule (#41382)Dropdownupdated to satisfyreact/exhaustive-depseslint rule (#41505)DateDayPickerupdated to satisfyreact/exhaustive-depseslint rule (#41470).
Spacer: Add RTL support. (#41172)
BorderControlnow only displays the reset button in its popover when selections have already been made. (#40917)BorderControl&BorderBoxControl: Add__next36pxDefaultSizeflag for larger default size (#40920).BorderControlimproved focus and border radius styling for component. (#40951)- Improve focused
CircularOptionPickerstyling (#40990) BorderControl: Make border color consistent with other controls (#40921)SelectControl: RemovelineHeightsetting to fix issue with font descenders being cut off (#40985)
DateTimePicker: Convert to TypeScript (#40775).DateTimePicker: Convert unit tests to TypeScript (#40957).CheckboxControl: Convert to TypeScript (#40915).ButtonGroup: Convert to TypeScript (#41007).Popover: refactor component to use thefloating-uilibrary internally (#40740).
UnitControl: migrate unit tests to TypeScript (#40697).DatePicker: Add improved unit tests (#40754).- Setup
user-eventin unit tests inline, once per test (#40839). DatePicker: Updatereact-datesto 21.8.0 (#40801).
InputControl: Add__next36pxDefaultSizeflag for larger default size (#40622).UnitControl: Add__next36pxDefaultSizeflag for larger default size (#40627).Modaldesign adjustments: Blur elements outside of the modal, increase modal title size, use larger close icon, remove header border when modal contents are scrolled. (#40781).SelectControl: Improved TypeScript support (#40737).ToggleControlGroup: Switch to internalIconcomponent for dashicon support (40717).- Improve
ToolsPanelaccessibility. (#40716)
- The
Buttoncomponent now displays the label as the tooltip for icon only buttons. (#40716) - Use fake timers and fix usage of async methods from
@testing-library/user-event. (#40790) - UnitControl: avoid calling onChange callback twice when unit changes. (#40796)
UnitControl: show unit label when units prop has only one unit. (#40784)AnglePickerControl: Fix closing of gradient popover when the angle control is clicked. (#40735)
TextControl: Convert to TypeScript (#40633).
- Consolidate the main black colors to gray-900. Affects
AlignmentMatrixControl,InputControl,Heading,SelectControl,Spinner (Experimental), andText(#40391).
- Remove individual color object exports from the
utils/colors-values.jsfile. Colors should now be used from the mainCOLORSexport(#40387).
InputControl: allow user to input a value interactively in Storybook, by removing default value argument (#40410).
- Update
BorderControlandBorderBoxControlto allow the passing of custom class names to popovers (#39753). ToggleGroupControl: Reintroduce backdrop animation (#40021).Card: Adjust border radius effective size (#40032).InputControl: Improved TypeScript type annotations (#40119).
BaseControl: Convert to TypeScript (#39468).
- Add
BorderControlcomponent (#37769). - Add
BorderBoxControlcomponent (#38876). - Add
ToggleGroupControlOptionIconcomponent (#39760).
- Use
Object.assigninstead of{ ...spread }syntax to avoid errors in the code generated by TypeScript (#39932). ItemGroup: Ensure that the Item's text color is not overriden by the user agent's button color (#40055).Surface: Use updated UI text color#1e1e1einstead of#000(#40055).CustomSelectControl: Make chevron consistent withSelectControl(#40049).
CustomSelectControl: Add__next36pxDefaultSizeflag for larger default size (#39401).BaseControl: Add__nextHasNoMarginBottomprop for opting into the new margin-free styles (#39325).Divider: Make the divider visible by default (display: inline) in flow layout containers when the divider orientation is vertical (#39316).- Stop using deprecated
event.keyCodein favor ofevent.keyfor keyboard events inUnitControlandInputControl. (#39360) ColorPalette: refine custom color button's label. (#39386)- Add
onClickprop onFormFileUpload. (#39268) FocalPointPicker: stop usingUnitControl's deprecatedunitprop (#39504).CheckboxControl: Add support for theindeterminatestate (#39462).UnitControl: add support for theonBlurprop (#39589).
- Delete the
composeStateReducersutility function (#39262). BoxControl: stop usingUnitControl's deprecatedunitprop (#39511).
NumberControl: commit (and constrain) value onblurevent (#39186).- Fix
UnitControl's reset of unit when the quantity value is cleared. (#39531). ResizableBox: Ensure tooltip text remains on a single line. (#39623).
unitprop inUnitControlmarked as deprecated (#39503).
ConfirmDialog: Add support for custom label text on the confirmation and cancelation buttons (#38994)InputControl: AllowonBlurfor empty values to commit the change whenisPressEnterToChangeis true, and move reset behavior to the ESCAPE key. (#39109).TreeGrid: Add tests for Home/End keyboard navigation. AddonFocusRowcallback for Home/End keyboard navigation, this was missed in the implementation PR. Modify test for expanding/collapsing a row as row 1 implements this now. Update README with latest changes. (#39302)ToggleGroupControlOption: Calculate width from button content and removeLabelPlaceholderView(#39345)
- Normalize
font-familyonButton,ColorPalette,ComoboboxControl,DateTimePicker,FormTokenField,InputControl,SelectControl, andToggleGroupControl(#38969). - Fix input value selection of
InputControl-based controls in Firefox and Safari with axial constraint of drag gesture (#38968). - Fix
UnitControl's behavior around updating the unit when a newvalueis passed (i.e. in controlled mode). (#39148).
- Fix spin buttons of number inputs in Safari (#38840)
- Show tooltip on toggle custom size button in FontSizePicker (#38985)
TreeGrid: Add tests foronCollapseRow,onExpandRow, andonFocusRowcallback functions. (#38942).TreeGrid: Update callback tests to useTreeGridRowandTreeGridCellsub-components. (#39002).
- Components: Fix
Slot/FillEmotionStyleProvider(#38237) - Reduce height and min-width of the reset button on
ComboBoxControlfor consistency. (#38020) - Removed unused
rememodependency (#38388). - Added
__unstableInputWidthtoUnitControltype definition (#38429). - Fixed typing errors for
ColorPicker(#38430). - Updated destructuring of
Dropdownprops to be TypeScript friendly (#38431). - Added
ts-nochecktoColorIndicatorso it can be used in typed components (#38433). - Added
cxas a dependency ofuseMemoacross the whole package, in order to recalculate the classnames correctly when a component is rendered across more than oneStyleProvider(#38541).
- Update the visual design of the
Spinnercomponent. (#37551) TreeGridaccessibility enhancements around the expand/collapse functionality. (#38358)TreeGridaccessibility: improve browser support for Left Arrow focus to parent row in child row. (#38639)TreeGridaccessibility: Add Home/End keys for better keyboard navigation. (#38679)- Add
resolvePointprop toFocalPointPickerto allow updating the value of the picker after a user interaction (#38247) TreeGrid: Allow SHIFT key to be held, and addonFocusRowcallback to theTreeGridcomponent, fired when focus is shifted from one row to another via Up and Down arrow keys. (#38314)
Navigator: renamepush/poptogoTo/goBack(#38582)Navigator: addNavigatorButtonandNavigatorBackButtoncomponents (#38634)UnitControl: tidy up utilities and types. In particular, change the type of parsed quantities tonumber(previously it could have been astringtoo). (#38987)
- Refine
ExternalLinkto be same size as the text, to appear more as a glyph than an icon. (#37859) - Updated
ToolsPanelheader icon to only show "plus" icon when all items are optional and all are currently hidden (#38262) TreeGrid: Fix keyboard navigation for expand/collapse table rows in Firefox (#37983)
- Update the
HexInputcomponent to accept a pasted value that contains a starting # - Update
ToggleGroupControlbackground active state to use a simple background color instead of animated backdrop (38008) - Update label spacing for the
BoxControl,CustomGradientPicker,FormTokenField,InputControl, andToolsPanelcomponents to use a bottom margin of8pxfor consistency. (#37844) - Add missing styles to the
BaseControl.VisualLabelcomponent. (#37747) - Prevent keyDown events from propagating up in
CustomSelectControl(#30557) - Mark
childrenprop as optional inSelectControl(#37872) - Add memoization of callbacks and context to prevent unnecessary rerenders of the
ToolsPanel(#38037) - Fix space between icons and rail
RangeControl(#36935) - Increase z-index of
ConfirmDialogto render on top of parentPopovercomponents (#37959)
- Add basic history location support to
Navigator(#37416). - Add focus restoration to
Navigator(#38149).
- Reinstated the ability to pass additional props to the
ToolsPanel(#36428). - Added an
__unstable-largesize variant toInputControl,SelectControl, andUnitControlfor selective migration to the larger 40px heights. (#35646). - Fixed inconsistent padding in
UnitControl(#35646). - Added support for RTL behavior for the
ZStack'soffsetprop (#36769) - Fixed race conditions causing conditionally displayed
ToolsPanelItemcomponents to be erroneously deregistered (#36588). - Added
__experimentalHideHeaderprop toModalcomponent (#36831). - Added experimental
ConfirmDialogcomponent (#34153). - Divider: improve support for vertical orientation and RTL styles, use start/end logical props instead of top/bottom, change border-color to
currentColor(#36579). ToggleGroupControl: Avoid callingonChangeif radio state changed from an incoming value (#37224).ToggleGroupControl: fix the computation of the backdrop dimensions when rendered in a Popover (#37067).- Add
__experimentalIsRenderedInSidebarproperty to theGradientPickerandCustomGradientPicker. The property changes the color popover behavior to have a special placement behavior appropriate for sidebar UI's. - Add
firstandlastclasses to displayedToolsPanelItemgroup within aToolsPanel(#37546)
- Fixed spacing between
BaseControlfields and help text within theToolsPanel(#36334) - Replaced hardcoded blue in
ColorPickerwith UI theme color (#36153). - Fixed empty
ToolsPanelheight by correcting menu button line-height (#36895). - Normalized label line-height and spacing within the
ToolsPanel(36387) - Remove unused
reakit-utilsfrom peer dependencies (#37369). - Update all Emotion dependencies to the latest version to ensure they work correctly with React types (#37365).
DateTimePicker: Fix the date format associated to theis12Hourprop (#37465)- Allowed
ToolsPanelto register items whenpanelIdisnulldue to multiple block selection (37216).
- Wrapped
Modalin aforwardRefcall (#36831). - Refactor
DateTimeclass component to functional component (#36835) - Unify styles for
ColorIndicatorwith how they appear in Global Styles (#37028) - Add support for rendering the
ColorPalettein aDropdownwhen opened in the sidebar (#37067) - Show an incremental sequence of numbers (1/2/3/4/5) as a label of the font size, when we have at most five font sizes, where at least one the them contains a complex css value(clamp, var, etc..). We do this because complex css values cannot be calculated properly and the incremental sequence of numbers as labels can help the user better mentally map the different available font sizes. (#37038)
- Add support for proper borders to color indicators (#37500)
- Refactor
SuggestionsListclass component to functional component(#36924)
- Improve accessibility and visibility in
ColorPallete(#36925)
- Fix missing version information in
CHANGELOG.md.
- Fixed
GradientPickernot displayingCustomGradientPickerwhen no gradients are provided (#36900). - Fixed error thrown in
ColorPickerwhen used in controlled state in color gradients (#36941). - Updated readme to include default value introduced in fix for unexpected movements in the
ColorPicker(#35670). - Added support for the legacy
extraSmallvalue for thesizeprop in theCardcomponent (#37097).
- Added a
showTooltipprop toToggleGroupControlOptionin order to display tooltip text (using<Tooltip />). (#36726).
- Fixed a bug which prevented setting
PMhours correctly in theDateTimePicker(#36878).
- Remove erroneous use of
??=syntax frombuild-module.
- Updated the
ColorPaletteandGradientPickercomponents to the latest designs (#35970).
- Updated the
ToolsPanelto useGridinternally to manage panel layout (#35621). - Added experimental
__experimentalHasMultipleOriginsprop to theColorPaletteandGradientPickercomponents (#35970).
- Added support for
step="any"inNumberControlandRangeControl(#34542).
- Removed the separator shown between
ToggleGroupControlitems (#35497). - The
ColorPickercomponent propertyonChangeComplete, a function accepting a color object, was replaced with the propertyonChange, a function accepting a string on (#35220). - The property
disableAlpha, was removed from theColorPickercomponent. Use the new opposite propertyenableAlphainstead (#35220).
- Removed the
fieldsetwrapper from theFontAppearanceControlcomponent (35461). - Refactored the
ToggleGroupControlcomponent's structure and embeddedToggleGroupControlButtondirectly intoToggleGroupControlOption(#35600). - Added support for showing an experimental hint in
CustomSelectControl(#35673).
- The
colorproperty atinycolor2color object passed ononChangeCompleteproperty of theColorPickercomponent was removed. Please use the newonChangeproperty that accepts a string color representation (#35562).
- Removed the deprecated
positionandmenuLabelfrom theDropdownMenucomponent (#34537). - Removed the deprecated
onClickOutsideprop from thePopovercomponent (#34537). - Changed
RangeControlcomponent to not applyshiftStepto inputs from its<input type="range"/>(35020). - Removed
isActionprop fromItem. The component will now rely ononClickto render as abutton(35152).
- Add an experimental
Navigatorcomponents (#34904) as a replacement for the previousNavigationrelated components. - Update the
ColorPickercomponent to the latest design (#35220)
- Fixed rounding of value in
RangeControlcomponent when it loses focus while theSHIFTkey is held. (#35020).
- Deleted the
createComponentutility function (#34929). - Deleted the
useJumpSteputility function (#35561).
- Removed a min-width from the
DropdownMenucomponent, allowing the menu to accommodate thin contents like vertical tools menus (#33995).
- Fixed RTL styles in
Flexcomponent (#33729). - Fixed unit test errors caused by
CSS.supportsbeing called in a non-browser environment (#34572). - Fixed
ToggleGroupControl's backdrop not updating when changing theisAdaptiveWidthproperty (#34595).
- Renamed
PolymorphicComponent*types toWordPressComponent*(#34330).
- Updated the visual styles of the RangeControl component (#33824).
- Add
hideLabelFromVisionprop toRangeControl(#33714).
- Listen to
resizeevents correctly inuseBreakpointIndex. This hook is used inuseResponsiveValueand consequently in theFlexandGridcomponents (#33902)
- Upgraded React components to work with v17.0 (#29118). There are no new features in React v17.0 as explained in the blog post.
isScrollableprop inCardBodydefault value changed fromtruetofalse(#33490)
- Added back
box-sizing: border-boxrule toCardBody,CardHeaderandCardFootercomponents #33511.
- Update the border color used in
CardBody,CardHeader,CardFooter, andCardDividerto a different shade of gray, in order to match the color used in other components (#32566).
isPrimary,isSecondary,isTertiaryandisLinkprops inButtonhave been deprecated. Usevariantinstead (#31713).isElevatedprop inCardhas been deprecated. Useelevationinstead (#32566).
Card,CardBody,CardHeader,CardFooter,CardMedia, andCardDividercomponents have been re-written from the ground up (#32566).
- Drop support for Internet Explorer 11 (#31110). Learn more at https://make.wordpress.org/core/2021/04/22/ie-11-support-phase-out-plan/.
- Increase the minimum Node.js version to v12 matching Long Term Support releases (#31270). Learn more at https://nodejs.org/en/about/releases/.
- The experimental
Textcomponent has been completely re-written and enhanced with truncation support and separate variant, size, and weight props to allow for greater control. The previousvariantprop has been completely removed.
isReversedprop inFlexcomponent has been deprecated. Usedirectioninstead (#31297).
Flex,FlexBlock, andFlexItemcomponents have been re-written from the ground up (#31297).
onChangeprop ofFocalPointPickeris called at the end of drag operations. Previously, it was called repetitively while dragging.
- Supports ref forwarding in
withNoticesandResizableBox. - Adds
onDragprop ofFocalPointPicker.
- Allows focus of the
FocalPointPickerdraggable area and adjustment with arrow keys. This was added in #22531 but was no longer working.
- ComboboxControl: Deburr option labels before filter
- Introduce support for other units and advanced CSS properties on
FontSizePicker. Provided the value passed to theFontSizePickeris a string or one of the size options passed is a string, onChange will start to be called with a string value instead of a number. On WordPress usage, font size options are now automatically converted to strings with the default "px" unit added.
- Add
ToolbarItemcomponent. - Support
labelprop on theToolbarcomponent.
- Deprecate the
Toolbarcomponent when used without thelabelprop.ToolbarGroupshould be used instead.
NumberControlno longer automatically transforms values when renderingvalueinto a<input />HTML element.Dashiconcomponent no longer renders SVGs. If you rely on this component, make sure to load the dashicon font.
- Fix and issue that would cause the
Popovercomponent to throw an error under certain circumstances (#22264).
- The
Guidecomponent no longer supports passing pages as children. Use thepagesprop instead. - The
GuidePagecomponent is deprecated. Use thepagesprop inGuideinstead.
- The
Noticecomponent will speak its message. With this new feature, a developer can control either thespokenMessagespoken message, or thepolitenesspoliteness level of the message. - The
Snackbarcomponent will speak its message. With this new feature, a developer can control either thespokenMessagespoken message, or thepolitenesspoliteness level of the message. - A
Noticeactionsmember can now assignisPrimaryto render a primary button action associated with a notice message.
- Notice will assume a default status of 'info' if none is provided. This resolves an issue where the notice would be assigned a class name
is-undefined. This was previously the effective default by styled appearance and should not be considered a breaking change in that regard.
- Added a new
Guidecomponent which allows developers to easily present a user guide.
is-buttonclassname has been removed from the Button component.- The
is-defaultclassname is not applied automatically anymore. - By default Button components come with a fixed height and hover styles.
- Fixes a regression published in version 8.5.0 that would prevent some build tools from including styles provided in the packages build-styles directory.
isDefaultprop inButtonhas been deprecated. Consider usingisSecondaryinstead.IconButtonhas been deprecated. Use theButtoncomponent instead.
- The bundled
re-resizabledependency has been updated from requiring5.0.1to requiring^6.0.0(#17011).
- Added a new
popoverPropsprop to theDropdowncomponent which allows users of theDropdowncomponent to pass props directly to thePopovercomponent. - Added and documented
hideLabelFromVisionprop toBaseControlused bySelectControl,TextControl, andTextareaControl. - Added a new
popoverPropsprop to theDropdownMenucomponent which allows to pass props directly to the nestedPopovercomponent. - Added a new
togglePropsprop to theDropdownMenucomponent which allows to pass props directly to the nestedIconButtoncomponent. - Added a new
menuPropsprop to theDropdownMenucomponent which allows to pass props directly to the nestedNavigableMenucomponent.
menuLabelprop inDropdownComponenthas been deprecated. Consider usingmenuPropsobject and itsaria-labelproperty instead.positionprop inDropdownComponenthas been deprecated. Consider usingpopoverPropsobject and itspositionproperty instead.
- The
Buttoncomponent will no longer assign default styling (is-defaultclass) when explicitly assigned as primary (theisPrimaryprop). This should resolve potential conflicts affecting a combination ofisPrimary,isDefault, andisLarge/isSmall, where the busy animation would appear with incorrect coloring.
- The
PopovercomponentonClickOutsideprop has been deprecated. UseonFocusOutsideinstead.
- The
Dropdowncomponent has been refactored to focus changes using thePopovercomponent'sonFocusOutsideprop. - The
MenuItemcomponent will now always use anIconButton. This prevents a focus loss when clicking a menu item. - Package no longer depends on external
react-click-outsidelibrary.
- Add new
BlockQuotationblock to the primitives folder to support blockquote in a multiplatform way. #15482. DropdownMenunow supports passing a render prop as children for more advanced customization.
MenuGroupno longer usesNavigableMenuinternally. It needs to be explicitly wrapped withNavigableMenuto bring back the same behavior.
- Added missing documentation for
DropdownMenupropsmenuLabel,position,className.
ServerSideRenderis no longer part of components. It was extracted to an independent package@wordpress/server-side-render.
- Although
DateTimePickerdoes not allow picking the seconds, passed the current seconds as the selected value for seconds when callingonChange. Now it passes zero.
- Added a new
HorizontalRulecomponent. - Added a new
Snackbarcomponent.
- Fixed display of reset button when using RangeControl
allowResetprop. - Fixed minutes field of
DateTimePickermissed '0' before single digit values.
- Added a new
renderproperty toFormFileUploadcomponent. Allowing users of the component to custom the UI for their needs. - Added a new
BaseControl.VisualLabelcomponent. - Added a new
previewprop to thePlaceholdercomponent which allows to display a preview, for example a media preview when the Placeholder is used in media editing contexts. - Added a new
anchorRectprop toPopoverwhich enables a developer to provide a customDOMRectobject at which to position the popover.
- Limit
Base Control Labelto the width of its content.
- Fix
instanceIdprop passed through toButtoncomponent viaMenuItemsproducing React console error. Fixed by removing the unnecessary use ofwithInstanceIdon theMenuItemscomponent #14599
- Make
RangeControlvalidation rely on thecheckValidityprovided by the browsers instead of using our own validation.
- Fix a problem that made
RangeControlnot work as expected with float values.
- Added a new
Animatecomponent.
withFiltershas been optimized to avoid binding hook handlers for each mounted instance of the component, instead using a single centralized hook delegator.withFiltershas been optimized to reuse a single shared component definition for all filtered instances of the component.- Make
RangeControlvalidate min and max properties.
- Resolves a conflict where two instance of Slot would produce an inconsistent or duplicated rendering output.
- Allow years between 0 and 1970 in DateTime component.
Dropdownnow has afocusOnMountprop which is passed directly to the containedPopover.DatePickerhas new propisInvalidDateexposing react-dates'isOutsideRange.DatePickerallowsnullas accepted value forcurrentDateprop to signify no date selection.
Dropdown.refresh()has been removed. The containedPopoveris now automatically refreshed.
- Avoid constantly recomputing the popover position.
- Remove
<DateTimePicker />obsoletelocaleprop (and pass-through to child components) and obsoleteis12Hourprop pass through to<DateTime />#11649
- The
PanelColorcomponent has been removed.
- Adjust a11y roles for MenuItem component, so that aria-checked is used properly, related change in Editor/Components/BlockNavigationList (#11431).
Popovercomponents are now automatically refreshed every 0.5s in order to recalculate their size or position.
Dropdown.refresh()has been deprecated as the containedPopoveris now automatically refreshed.
- Forward
refin thePanelBodycomponent. - Tooltip are no longer removed when Button becomes disabled, it's left to the component rendering the Tooltip.
- Forward
refsupport inTabbableContainerandNavigableMenucomponents.
AccessibleSVGcomponent has been removed. Please useSVGinstead.
- The
Noticecomponent accepts an array of action objects via theactionsprop. Each member object should contain alabeland either aurllink string oronClickcallback function.
- Fix importing
react-datesstylesheet in production.
- Added a new
ColorPickercomponent (#10564). MenuItemnow accepts aninfoprop for including an extended description.
IconButtoncorrectly respects a passedaria-labelprop.
PanelColorhas been deprecated in favor ofwp.editor.PanelColorSettings.
- Added a new
ResizableBoxcomponent.
Draggableas a DOM node drag handler has been removed. Please, useDraggableas a wrap component for your DOM node drag handler.
- Renamed
AccessibleSVGcomponent toSVG.
withAPIDatahas been removed. Please use the Core Data module or@wordpress/api-fetchdirectly instead.Draggableas a DOM node drag handler has been deprecated. Please, useDraggableas a wrap component for your DOM node drag handler.- Change how required built-ins are polyfilled with Babel 7 (#9171). If you're using an environment that has limited or no support for ES2015+ such as lower versions of IE then using core-js or @babel/polyfill will add support for these methods.
withContexthas been removed. Please usewp.element.createContextinstead. See: https://reactjs.org/docs/context.html.
- Added a new
AccessibleSVGcomponent.