diff --git a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap index 248de768906b..7390b283f019 100644 --- a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap +++ b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap @@ -1212,21 +1212,46 @@ Map { }, "TableExpandHeader": Object { "propTypes": Object { - "ariaLabel": [Function], + "ariaLabel": Object { + "args": Array [ + Array [ + [Function], + [Function], + ], + ], + "type": "oneOfType", + }, "children": Object { "type": "node", }, "className": Object { "type": "string", }, - "enableExpando": Object { + "enableExpando": [Function], + "enableToggle": Object { "type": "bool", }, "expandIconDescription": Object { "type": "string", }, - "isExpanded": [Function], - "onExpand": [Function], + "isExpanded": Object { + "args": Array [ + Array [ + [Function], + [Function], + ], + ], + "type": "oneOfType", + }, + "onExpand": Object { + "args": Array [ + Array [ + [Function], + [Function], + ], + ], + "type": "oneOfType", + }, }, }, "TableExpandRow": Object { @@ -1852,21 +1877,46 @@ Map { }, "TableExpandHeader" => Object { "propTypes": Object { - "ariaLabel": [Function], + "ariaLabel": Object { + "args": Array [ + Array [ + [Function], + [Function], + ], + ], + "type": "oneOfType", + }, "children": Object { "type": "node", }, "className": Object { "type": "string", }, - "enableExpando": Object { + "enableExpando": [Function], + "enableToggle": Object { "type": "bool", }, "expandIconDescription": Object { "type": "string", }, - "isExpanded": [Function], - "onExpand": [Function], + "isExpanded": Object { + "args": Array [ + Array [ + [Function], + [Function], + ], + ], + "type": "oneOfType", + }, + "onExpand": Object { + "args": Array [ + Array [ + [Function], + [Function], + ], + ], + "type": "oneOfType", + }, }, }, "TableExpandRow" => Object { diff --git a/packages/react/src/components/Accordion/AccordionItem.js b/packages/react/src/components/Accordion/AccordionItem.js index 79aa438a913d..c2c8a472f8cf 100644 --- a/packages/react/src/components/Accordion/AccordionItem.js +++ b/packages/react/src/components/Accordion/AccordionItem.js @@ -13,7 +13,7 @@ import React, { useState } from 'react'; import { Text } from '../Text'; import { match, keys } from '../../internal/keyboard'; import { useId } from '../../internal/useId'; -import deprecate from '../../prop-types/deprecate.js'; +import deprecate from '../../prop-types/deprecate'; const { prefix } = settings; const defaultRenderExpando = (props) => - )} + ) : null} {children} ); @@ -56,15 +58,27 @@ TableExpandHeader.propTypes = { * Specify the string read by a voice reader when the expand trigger is * focused */ - ariaLabel: requiredIfGivenPropIsTruthy('enableExpando', PropTypes.string), + ariaLabel: PropTypes.oneOfType([ + requiredIfGivenPropIsTruthy('enableExpando', PropTypes.string), + requiredIfGivenPropIsTruthy('enableToggle', PropTypes.string), + ]), + children: PropTypes.node, className: PropTypes.string, + /** + * The enableExpando prop is being replaced by enableToggle + */ + enableExpando: deprecate( + PropTypes.bool, + 'The `enableExpando` prop has been deprecated in favor of `enableToggle`. This prop will be removed in the next major release.' + ), + /** * Specify whether an expand all button should be displayed */ - enableExpando: PropTypes.bool, + enableToggle: PropTypes.bool, /** * The description of the chevron right icon, to be put in its SVG `` element. @@ -75,12 +89,18 @@ TableExpandHeader.propTypes = { * Specify whether this row is expanded or not. This helps coordinate data * attributes so that `TableExpandRow` and `TableExpandedRow` work together */ - isExpanded: requiredIfGivenPropIsTruthy('enableExpando', PropTypes.bool), + isExpanded: PropTypes.oneOfType([ + requiredIfGivenPropIsTruthy('enableExpando', PropTypes.bool), + requiredIfGivenPropIsTruthy('enableToggle', PropTypes.bool), + ]), /** * Hook for when a listener initiates a request to expand the given row */ - onExpand: requiredIfGivenPropIsTruthy('enableExpando', PropTypes.func), + onExpand: PropTypes.oneOfType([ + requiredIfGivenPropIsTruthy('enableExpando', PropTypes.func), + requiredIfGivenPropIsTruthy('enableToggle', PropTypes.func), + ]), }; export default TableExpandHeader; diff --git a/packages/react/src/components/MultiSelect/MultiSelect.js b/packages/react/src/components/MultiSelect/MultiSelect.js index 392bc95476c3..aa148aa2cb46 100644 --- a/packages/react/src/components/MultiSelect/MultiSelect.js +++ b/packages/react/src/components/MultiSelect/MultiSelect.js @@ -190,6 +190,9 @@ const MultiSelect = React.forwardRef(function MultiSelect( case ItemClick: case MenuKeyDownSpaceButton: case MenuKeyDownEnter: + if (changes.selectedItem === undefined) { + break; + } onItemChange(changes.selectedItem); break; case MenuKeyDownArrowDown: diff --git a/packages/react/src/internal/FloatingMenu.js b/packages/react/src/internal/FloatingMenu.js index cd8f53c9867e..a64b952533fc 100644 --- a/packages/react/src/internal/FloatingMenu.js +++ b/packages/react/src/internal/FloatingMenu.js @@ -261,7 +261,7 @@ class FloatingMenu extends React.Component { * * @private */ - _updateMenuSize = (prevProps = {}) => { + _updateMenuSize = (prevProps = {}, isAdjustment = false) => { const menuBody = this._menuBody; warning( menuBody, @@ -279,7 +279,8 @@ class FloatingMenu extends React.Component { if ( hasChangeInOffset(oldMenuOffset, menuOffset) || - oldMenuDirection !== menuDirection + oldMenuDirection !== menuDirection || + isAdjustment ) { const { flipped, triggerRef } = this.props; const { current: triggerEl } = triggerRef; @@ -293,20 +294,30 @@ class FloatingMenu extends React.Component { // a) Menu body has `display:none` // b) `menuOffset` as a callback returns `undefined` (The callback saw that it couldn't calculate the value) if ((menuSize.width > 0 && menuSize.height > 0) || !offset) { - this.setState({ - floatingPosition: getFloatingPosition({ - menuSize, - refPosition, - direction: menuDirection, - offset, - scrollX: window.pageXOffset, - scrollY: window.pageYOffset, - container: { - rect: this.props.target().getBoundingClientRect(), - position: getComputedStyle(this.props.target()).position, - }, - }), - }); + this.setState( + { + floatingPosition: getFloatingPosition({ + menuSize, + refPosition, + direction: menuDirection, + offset, + scrollX: window.pageXOffset, + scrollY: window.pageYOffset, + container: { + rect: this.props.target().getBoundingClientRect(), + position: getComputedStyle(this.props.target()).position, + }, + }), + }, + () => { + if (!isAdjustment) { + const newMenuSize = menuBody.getBoundingClientRect(); + if (newMenuSize !== menuSize) { + this._updateMenuSize(this.props, true); + } + } + } + ); } } };