carbon-react 119.10.0 → 119.10.2

package/lib/components/select/__internal__/select-text/select-text.style.js

@@ -10,15 +10,13 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 const StyledSelectText = _styledComponents.default.span`
-  ${_ref => {
-  let {
-    disabled,
-    hasPlaceholder,
-    readOnly,
-    transparent,
-    size
-  } = _ref;
-  return (0, _styledComponents.css)`
+  ${({
+  disabled,
+  hasPlaceholder,
+  readOnly,
+  transparent,
+  size
+}) => (0, _styledComponents.css)`
     align-items: center;
     display: inline-flex;
     flex-grow: 1;
@@ -55,8 +53,7 @@ const StyledSelectText = _styledComponents.default.span`
       color: var(--colorsUtilityYin065);
       text-shadow: none;
     `}
-  `;
-}}
+  `}
 `;
 var _default = StyledSelectText;
 exports.default = _default;

package/lib/components/select/filterable-select/filterable-select.component.js

@@ -26,46 +26,45 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 let deprecateInputRefWarnTriggered = false;
 let deprecateUncontrolledWarnTriggered = false;
 const FilterableSelectList = (0, _withFilter.default)(_selectList.default);
-const FilterableSelect = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
-  let {
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledby,
-    value,
-    defaultValue,
-    id,
-    name,
-    label,
-    children,
-    onOpen: onOpenProp,
-    onChange,
-    onFilterChange: onFilterChangeProp,
-    onClick,
-    onKeyDown,
-    onFocus,
-    onBlur,
-    openOnFocus,
-    noResultsMessage,
-    disablePortal,
-    listActionButton,
-    listMaxHeight,
-    onListAction,
-    isLoading,
-    disabled,
-    readOnly,
-    onListScrollBottom,
-    tableHeader,
-    multiColumn,
-    "data-component": dataComponent = "filterable-select",
-    "data-element": dataElement,
-    "data-role": dataRole,
-    tooltipPosition,
-    listPlacement = "bottom",
-    flipEnabled = true,
-    inputRef,
-    enableVirtualScroll,
-    virtualScrollOverscan,
-    ...textboxProps
-  } = _ref;
+const FilterableSelect = /*#__PURE__*/_react.default.forwardRef(({
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledby,
+  value,
+  defaultValue,
+  id,
+  name,
+  label,
+  children,
+  onOpen: onOpenProp,
+  onChange,
+  onFilterChange: onFilterChangeProp,
+  onClick,
+  onKeyDown,
+  onFocus,
+  onBlur,
+  openOnFocus,
+  noResultsMessage,
+  disablePortal,
+  listActionButton,
+  listMaxHeight,
+  onListAction,
+  isLoading,
+  disabled,
+  readOnly,
+  onListScrollBottom,
+  tableHeader,
+  multiColumn,
+  "data-component": dataComponent = "filterable-select",
+  "data-element": dataElement,
+  "data-role": dataRole,
+  tooltipPosition,
+  listPlacement = "bottom",
+  flipEnabled = true,
+  inputRef,
+  enableVirtualScroll,
+  virtualScrollOverscan,
+  ...textboxProps
+}, ref) => {
   const [activeDescendantId, setActiveDescendantId] = (0, _react.useState)();
   const selectListId = (0, _react.useRef)((0, _guid.default)());
   const containerRef = (0, _react.useRef)(null);
@@ -149,8 +148,7 @@ const FilterableSelect = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
       return match.props.value;
     });
   }, [children, triggerChange]);
-  const setMatchingText = (0, _react.useCallback)(function (newValue) {
-    let isClosing = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  const setMatchingText = (0, _react.useCallback)((newValue, isClosing = false) => {
     const matchingOption = _react.default.Children.toArray(children).find(child => /*#__PURE__*/_react.default.isValidElement(child) && (0, _isExpectedOption.default)(child, newValue));
     if (!matchingOption || matchingOption.props.text === undefined) {
       setTextValue(filterText || "");

package/lib/components/select/list-action-button/list-action-button.component.js

@@ -10,11 +10,10 @@ var _listActionButton = _interopRequireDefault(require("./list-action-button.sty
 var _useLocale = _interopRequireDefault(require("../../../hooks/__internal__/useLocale"));
 var _button = _interopRequireDefault(require("../../button"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const ListActionButton = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
-  let {
-    listActionButton,
-    onListAction
-  } = _ref;
+const ListActionButton = /*#__PURE__*/_react.default.forwardRef(({
+  listActionButton,
+  onListAction
+}, ref) => {
   const l = (0, _useLocale.default)();
   function renderListActionButton() {
     if (!listActionButton || listActionButton === true) {

package/lib/components/select/multi-select/multi-select.component.js

@@ -28,46 +28,45 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 let deprecateInputRefWarnTriggered = false;
 let deprecateUncontrolledWarnTriggered = false;
 const FilterableSelectList = (0, _withFilter.default)(_selectList.default);
-const MultiSelect = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
-  let {
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledby,
-    value,
-    defaultValue,
-    id,
-    label,
-    name,
-    disabled,
-    readOnly,
-    children,
-    onOpen,
-    onFilterChange: onFilterChangeProp,
-    onChange,
-    onClick,
-    onFocus,
-    onBlur,
-    onKeyDown,
-    openOnFocus = false,
-    noResultsMessage,
-    placeholder,
-    disablePortal,
-    isLoading,
-    tableHeader,
-    multiColumn,
-    tooltipPosition,
-    size,
-    "data-component": dataComponent = "multiselect",
-    "data-element": dataElement,
-    "data-role": dataRole,
-    listPlacement = "bottom",
-    listMaxHeight,
-    flipEnabled = true,
-    wrapPillText = true,
-    inputRef,
-    enableVirtualScroll,
-    virtualScrollOverscan,
-    ...textboxProps
-  } = _ref;
+const MultiSelect = /*#__PURE__*/_react.default.forwardRef(({
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledby,
+  value,
+  defaultValue,
+  id,
+  label,
+  name,
+  disabled,
+  readOnly,
+  children,
+  onOpen,
+  onFilterChange: onFilterChangeProp,
+  onChange,
+  onClick,
+  onFocus,
+  onBlur,
+  onKeyDown,
+  openOnFocus = false,
+  noResultsMessage,
+  placeholder,
+  disablePortal,
+  isLoading,
+  tableHeader,
+  multiColumn,
+  tooltipPosition,
+  size,
+  "data-component": dataComponent = "multiselect",
+  "data-element": dataElement,
+  "data-role": dataRole,
+  listPlacement = "bottom",
+  listMaxHeight,
+  flipEnabled = true,
+  wrapPillText = true,
+  inputRef,
+  enableVirtualScroll,
+  virtualScrollOverscan,
+  ...textboxProps
+}, ref) => {
   const [activeDescendantId, setActiveDescendantId] = (0, _react.useState)();
   const selectListId = (0, _react.useRef)((0, _guid.default)());
   const accessibilityLabelId = (0, _react.useRef)((0, _guid.default)());

package/lib/components/select/multi-select/multi-select.style.js

@@ -34,18 +34,12 @@ const StyledSelectMultiSelect = (0, _styledComponents.default)(_select.default)`
 
   ${_inputPresentation.default} {
     // size has a default value of "medium" defined in StyledSelect, but TS can't see this
-    padding-right: ${_ref => {
-  let {
-    size
-  } = _ref;
-  return _inputSizes.default[size].height;
-}};
-    padding-left: ${_ref2 => {
-  let {
-    size
-  } = _ref2;
-  return _inputSizes.default[size].horizontalPadding;
-}};
+    padding-right: ${({
+  size
+}) => _inputSizes.default[size].height};
+    padding-left: ${({
+  size
+}) => _inputSizes.default[size].horizontalPadding};
     position: relative;
 
     ${_input.default} {

package/lib/components/select/option/option.component.d.ts

@@ -6,9 +6,9 @@ export interface OptionProps extends Omit<React.InputHTMLAttributes<HTMLLIElemen
      * Will use a randomly generated GUID if none is provided.
      */
     id?: string;
-    /** The option's visible text, displayed within <Textbox> of <Select>, and used for filtering */
+    /** The option's visible text, displayed within `<Textbox>` of `<Select>`, and used for filtering */
     text: string;
-    /** Optional: alternative rendered content, displayed within <SelectList> of <Select> (eg: an icon, an image, etc) */
+    /** Optional: alternative rendered content, displayed within `<SelectList>` of `<Select>` (eg: an icon, an image, etc) */
     children?: React.ReactNode;
     /** The option's invisible internal value */
     value: string | Record<string, unknown>;

package/lib/components/select/option/option.component.js

@@ -12,19 +12,18 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-const Option = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
-  let {
-    text,
-    children,
-    onSelect,
-    value,
-    id,
-    index,
-    hidden,
-    onClick,
-    style,
-    ...rest
-  } = _ref;
+const Option = /*#__PURE__*/_react.default.forwardRef(({
+  text,
+  children,
+  onSelect,
+  value,
+  id,
+  index,
+  hidden,
+  onClick,
+  style,
+  ...rest
+}, ref) => {
   const selectListContext = (0, _react.useContext)(_selectListContext.default);
   let isSelected = selectListContext.currentOptionsListIndex === index;
   if (selectListContext.multiselectValues) {

package/lib/components/select/option/option.style.js

@@ -19,21 +19,15 @@ const StyledOption = _styledComponents.default.li`
   left: 0;
   width: 100%;
 
-  ${_ref => {
-  let {
-    isHighlighted
-  } = _ref;
-  return isHighlighted && (0, _styledComponents.css)`
+  ${({
+  isHighlighted
+}) => isHighlighted && (0, _styledComponents.css)`
       background-color: var(--colorsUtilityMajor200);
-    `;
-}}
+    `}
 
-  ${_ref2 => {
-  let {
-    hidden
-  } = _ref2;
-  return hidden && "display: none;";
-}}
+  ${({
+  hidden
+}) => hidden && "display: none;"}
 
   :hover {
     background-color: var(--colorsUtilityMajor100);

package/lib/components/select/option-group-header/option-group-header.component.js

@@ -10,13 +10,12 @@ var _optionGroupHeader = _interopRequireDefault(require("./option-group-header.s
 var _icon = _interopRequireDefault(require("../../icon"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-const OptionGroupHeader = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
-  let {
-    label,
-    icon,
-    style,
-    ...rest
-  } = _ref;
+const OptionGroupHeader = /*#__PURE__*/_react.default.forwardRef(({
+  label,
+  icon,
+  style,
+  ...rest
+}, ref) => {
   return /*#__PURE__*/_react.default.createElement(_optionGroupHeader.default, _extends({
     style: style
   }, rest, {

package/lib/components/select/option-row/option-row.component.js

@@ -12,18 +12,17 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-const OptionRow = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
-  let {
-    id,
-    text,
-    children,
-    onSelect,
-    value,
-    index,
-    hidden,
-    style,
-    ...rest
-  } = _ref;
+const OptionRow = /*#__PURE__*/_react.default.forwardRef(({
+  id,
+  text,
+  children,
+  onSelect,
+  value,
+  index,
+  hidden,
+  style,
+  ...rest
+}, ref) => {
   const handleClick = () => {
     onSelect?.({
       id,

package/lib/components/select/option-row/option-row.style.js

@@ -14,21 +14,15 @@ const StyledOptionRow = _styledComponents.default.tr`
   left: 0;
   width: 100%;
 
-  ${_ref => {
-  let {
-    hidden
-  } = _ref;
-  return hidden && "display: none;";
-}}
+  ${({
+  hidden
+}) => hidden && "display: none;"}
 
-  ${_ref2 => {
-  let {
-    isHighlighted
-  } = _ref2;
-  return isHighlighted && (0, _styledComponents.css)`
+  ${({
+  isHighlighted
+}) => isHighlighted && (0, _styledComponents.css)`
       background-color: var(--colorsUtilityMajor200);
-    `;
-}}
+    `}
 
   :hover {
     background-color: var(--colorsUtilityMajor100);

package/lib/components/select/select-list/select-list-container.style.js

@@ -12,30 +12,21 @@ const StyledSelectListContainer = _styledComponents.default.div`
   box-shadow: var(--boxShadow100);
   animation: fadeIn 250ms ease-out;
   position: absolute;
-  z-index: ${_ref => {
-  let {
-    theme
-  } = _ref;
-  return theme.zIndex.popover;
-}};
-  max-height: ${_ref2 => {
-  let {
-    maxHeight
-  } = _ref2;
-  return `${maxHeight}px`;
-}};
+  z-index: ${({
+  theme
+}) => theme.zIndex.popover};
+  max-height: ${({
+  maxHeight
+}) => `${maxHeight}px`};
   overflow-y: auto;
   display: flex;
   flex-wrap: wrap;
   align-items: flex-start;
   border-radius: var(--borderRadius050);
 
-  ${_ref3 => {
-  let {
-    isLoading
-  } = _ref3;
-  return isLoading && "min-height: 150px";
-}};
+  ${({
+  isLoading
+}) => isLoading && "min-height: 150px"};
 
   @keyframes fadeIn {
     0% {

package/lib/components/select/select-list/select-list.component.js

@@ -32,33 +32,32 @@ const SCROLL_OPTIONS = {
   behavior: "auto",
   align: "end"
 };
-const SelectList = /*#__PURE__*/_react.default.forwardRef((_ref, listContainerRef) => {
-  let {
-    listMaxHeight = 180,
-    listActionButton,
-    id,
-    labelId,
-    children,
-    onSelect,
-    onSelectListClose,
-    filterText,
-    anchorElement,
-    highlightedValue,
-    disablePortal,
-    onListAction,
-    isLoading,
-    onListScrollBottom,
-    multiColumn,
-    tableHeader,
-    loaderDataRole,
-    listPlacement = "bottom",
-    flipEnabled = true,
-    isOpen,
-    multiselectValues,
-    enableVirtualScroll,
-    virtualScrollOverscan = 5,
-    ...listProps
-  } = _ref;
+const SelectList = /*#__PURE__*/_react.default.forwardRef(({
+  listMaxHeight = 180,
+  listActionButton,
+  id,
+  labelId,
+  children,
+  onSelect,
+  onSelectListClose,
+  filterText,
+  anchorElement,
+  highlightedValue,
+  disablePortal,
+  onListAction,
+  isLoading,
+  onListScrollBottom,
+  multiColumn,
+  tableHeader,
+  loaderDataRole,
+  listPlacement = "bottom",
+  flipEnabled = true,
+  isOpen,
+  multiselectValues,
+  enableVirtualScroll,
+  virtualScrollOverscan = 5,
+  ...listProps
+}, listContainerRef) => {
   const [currentOptionsListIndex, setCurrentOptionsListIndex] = (0, _react.useState)(-1);
   const [scrollbarWidth, setScrollbarWidth] = (0, _react.useState)(0);
   const lastFilter = (0, _react.useRef)("");
@@ -308,11 +307,10 @@ const SelectList = /*#__PURE__*/_react.default.forwardRef((_ref, listContainerRe
     }
   }, [children, currentOptionsListIndex, isLoading, lastOptionIndex, listContainerRef, virtualizer]);
   const popoverMiddleware = (0, _react.useMemo)(() => [(0, _dom.offset)(3), (0, _dom.size)({
-    apply(_ref2) {
-      let {
-        rects,
-        elements
-      } = _ref2;
+    apply({
+      rects,
+      elements
+    }) {
       Object.assign(elements.floating.style, {
         width: `${rects.reference.width}px`
       });

package/lib/components/select/select-list/select-list.style.js

@@ -8,11 +8,9 @@ var _styledComponents = _interopRequireWildcard(require("styled-components"));
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 const StyledSelectList = _styledComponents.default.ul`
-  ${_ref => {
-  let {
-    listHeight
-  } = _ref;
-  return (0, _styledComponents.css)`
+  ${({
+  listHeight
+}) => (0, _styledComponents.css)`
     box-sizing: border-box;
     display: flex;
     align-items: flex-start;
@@ -24,8 +22,7 @@ const StyledSelectList = _styledComponents.default.ul`
     position: relative;
     width: 100%;
     ${listHeight === undefined ? "" : `height: ${listHeight}px;`}
-  `;
-}}
+  `}
 `;
 exports.StyledSelectList = StyledSelectList;
 const StyledSelectLoaderContainer = _styledComponents.default.div`
@@ -65,12 +62,9 @@ const StyledSelectListTableHeader = _styledComponents.default.thead`
   z-index: 1;
 
   tr {
-    width: ${_ref2 => {
-  let {
-    scrollbarWidth
-  } = _ref2;
-  return `calc(100% - ${scrollbarWidth}px)`;
-}};
+    width: ${({
+  scrollbarWidth
+}) => `calc(100% - ${scrollbarWidth}px)`};
   }
 
   th {
@@ -105,11 +99,8 @@ const StyledSelectListTableBody = _styledComponents.default.tbody`
   width: 100%;
   table-layout: fixed;
   width: 100%;
-  height: ${_ref3 => {
-  let {
-    listHeight
-  } = _ref3;
-  return `${listHeight}px`;
-}};
+  height: ${({
+  listHeight
+}) => `${listHeight}px`};
 `;
 exports.StyledSelectListTableBody = StyledSelectListTableBody;