carbon-react 119.10.0 → 119.10.2

package/esm/components/flat-table/flat-table-body-draggable/flat-table-body-draggable.style.js

@@ -1,12 +1,9 @@
 import styled, { css } from "styled-components";
 const StyledFlatTableBodyDraggable = styled.tbody`
-  ${_ref => {
-  let {
-    isDragging
-  } = _ref;
-  return isDragging && css`
+  ${({
+  isDragging
+}) => isDragging && css`
       cursor: grabbing;
-    `;
-}}
+    `}
 `;
 export default StyledFlatTableBodyDraggable;

package/esm/components/flat-table/flat-table-cell/flat-table-cell.component.js

@@ -5,25 +5,24 @@ import { StyledFlatTableCell, StyledCellContent } from "./flat-table-cell.style"
 import Icon from "../../icon";
 import { FlatTableThemeContext } from "../flat-table.component";
 import guid from "../../../__internal__/utils/helpers/guid";
-export const FlatTableCell = _ref => {
-  let {
-    align = "left",
-    children,
-    pl,
-    expandable = false,
-    onClick,
-    onKeyDown,
-    reportCellWidth,
-    cellIndex,
-    leftPosition,
-    rightPosition,
-    width,
-    truncate = false,
-    title,
-    colspan,
-    rowspan,
-    ...rest
-  } = _ref;
+export const FlatTableCell = ({
+  align = "left",
+  children,
+  pl,
+  expandable = false,
+  onClick,
+  onKeyDown,
+  reportCellWidth,
+  cellIndex,
+  leftPosition,
+  rightPosition,
+  width,
+  truncate = false,
+  title,
+  colspan,
+  rowspan,
+  ...rest
+}) => {
   const ref = useRef(null);
   const id = useRef(guid());
   const [tabIndex, setTabIndex] = useState(-1);

package/esm/components/flat-table/flat-table-cell/flat-table-cell.style.js

@@ -8,21 +8,19 @@ const verticalBorderSizes = {
   large: "4px"
 };
 const StyledFlatTableCell = styled.td`
-  ${_ref => {
-  let {
-    align,
-    theme,
-    rowSpan,
-    leftPosition,
-    rightPosition,
-    makeCellSticky,
-    colWidth,
-    isTruncated,
-    expandable,
-    verticalBorder,
-    verticalBorderColor
-  } = _ref;
-  return css`
+  ${({
+  align,
+  theme,
+  rowSpan,
+  leftPosition,
+  rightPosition,
+  makeCellSticky,
+  colWidth,
+  isTruncated,
+  expandable,
+  verticalBorder,
+  verticalBorderColor
+}) => css`
     background-color: var(--colorsUtilityYang100);
     border-width: 0;
     border-bottom: 1px solid var(--colorsUtilityMajor100);
@@ -84,20 +82,16 @@ const StyledFlatTableCell = styled.td`
     ${expandable && css`
       white-space: nowrap;
     `}
-  `;
-}}
+  `}
 `;
 const StyledCellContent = styled.div`
-  ${_ref2 => {
-  let {
-    expandable
-  } = _ref2;
-  return expandable && css`
+  ${({
+  expandable
+}) => expandable && css`
       display: flex;
       align-items: center;
       line-height: 1em;
-    `;
-}}
+    `}
 `;
 StyledFlatTableCell.defaultProps = {
   theme: baseTheme

package/esm/components/flat-table/flat-table-checkbox/flat-table-checkbox.component.js

@@ -4,20 +4,19 @@ import PropTypes from "prop-types";
 import StyledFlatTableCheckbox from "./flat-table-checkbox.style";
 import { Checkbox } from "../../checkbox";
 import Events from "../../../__internal__/utils/helpers/events/events";
-export const FlatTableCheckbox = _ref => {
-  let {
-    as = "td",
-    checked,
-    onChange,
-    selectable = true,
-    onClick,
-    leftPosition,
-    rightPosition,
-    cellIndex,
-    reportCellWidth,
-    ariaLabelledBy,
-    ...rest
-  } = _ref;
+export const FlatTableCheckbox = ({
+  as = "td",
+  checked,
+  onChange,
+  selectable = true,
+  onClick,
+  leftPosition,
+  rightPosition,
+  cellIndex,
+  reportCellWidth,
+  ariaLabelledBy,
+  ...rest
+}) => {
   const ref = useRef(null);
   useLayoutEffect(() => {
     if (ref.current && reportCellWidth) {

package/esm/components/flat-table/flat-table-checkbox/flat-table-checkbox.style.js

@@ -1,14 +1,12 @@
 import styled, { css } from "styled-components";
 import StyledCheckbox from "../../checkbox/checkbox.style";
 const StyledFlatTableCheckbox = styled.td`
-  ${_ref => {
-  let {
-    as,
-    leftPosition,
-    rightPosition,
-    makeCellSticky
-  } = _ref;
-  return css`
+  ${({
+  as,
+  leftPosition,
+  rightPosition,
+  makeCellSticky
+}) => css`
     ${as === "td" && css`
       background-color: var(--colorsUtilityYang100);
       border-width: 0;
@@ -49,8 +47,7 @@ const StyledFlatTableCheckbox = styled.td`
       ${rightPosition !== undefined && `right: ${rightPosition}px;`}
       position: sticky;
     `}
-  `;
-}}
+  `}
 
   width: 18px;
 

package/esm/components/flat-table/flat-table-head/flat-table-head.component.js

@@ -5,11 +5,10 @@ import FlatTableRowHeader from "../flat-table-row-header";
 const getRefs = length => Array.from({
   length
 }, () => /*#__PURE__*/React.createRef());
-export const FlatTableHead = _ref => {
-  let {
-    children,
-    ...rest
-  } = _ref;
+export const FlatTableHead = ({
+  children,
+  ...rest
+}) => {
   const [rowHeights, setRowHeights] = useState([]);
   const refs = useRef(getRefs(React.Children.count(children)));
   let hasFlatTableRowHeader;

package/esm/components/flat-table/flat-table-header/flat-table-header.component.js

@@ -3,21 +3,20 @@ import React, { useLayoutEffect, useRef, useContext } from "react";
 import PropTypes from "prop-types";
 import StyledFlatTableHeader from "./flat-table-header.style";
 import { FlatTableThemeContext } from "../flat-table.component";
-export const FlatTableHeader = _ref => {
-  let {
-    align,
-    children,
-    colspan,
-    rowspan,
-    width,
-    py,
-    px,
-    reportCellWidth,
-    cellIndex,
-    leftPosition,
-    rightPosition,
-    ...rest
-  } = _ref;
+export const FlatTableHeader = ({
+  align,
+  children,
+  colspan,
+  rowspan,
+  width,
+  py,
+  px,
+  reportCellWidth,
+  cellIndex,
+  leftPosition,
+  rightPosition,
+  ...rest
+}) => {
   const ref = useRef(null);
   const {
     colorTheme

package/esm/components/flat-table/flat-table-header/flat-table-header.style.js

@@ -9,20 +9,18 @@ const verticalBorderSizes = {
   large: "4px"
 };
 const StyledFlatTableHeader = styled.th`
-  ${_ref => {
-  let {
-    align,
-    alternativeBgColor,
-    colWidth,
-    leftPosition,
-    rightPosition,
-    makeCellSticky,
-    verticalBorder,
-    verticalBorderColor,
-    colorTheme,
-    theme
-  } = _ref;
-  return css`
+  ${({
+  align,
+  alternativeBgColor,
+  colWidth,
+  leftPosition,
+  rightPosition,
+  makeCellSticky,
+  verticalBorder,
+  verticalBorderColor,
+  colorTheme,
+  theme
+}) => css`
     background-color: transparent;
     border-width: 0;
     box-sizing: border-box;
@@ -96,8 +94,7 @@ const StyledFlatTableHeader = styled.th`
         `}
       }
     }
-  `;
-}}
+  `}
 `;
 StyledFlatTableHeader.defaultProps = {
   theme: baseTheme

package/esm/components/flat-table/flat-table-row/__internal__/flat-table-row-draggable.component.js

@@ -1,13 +1,12 @@
 import React from "react";
 import PropTypes from "prop-types";
 import { useDrop, useDrag } from "react-dnd";
-const FlatTableRowDraggable = _ref => {
-  let {
-    children,
-    id,
-    findItem,
-    moveItem
-  } = _ref;
+const FlatTableRowDraggable = ({
+  children,
+  id,
+  findItem,
+  moveItem
+}) => {
   const originalIndex = Number(findItem?.(id).index);
   const [{
     isDragging

package/esm/components/flat-table/flat-table-row/flat-table-row.component.js

@@ -10,29 +10,28 @@ import FlatTableRowHeader from "../flat-table-row-header";
 import FlatTableRowDraggable from "./__internal__/flat-table-row-draggable.component";
 import { FlatTableThemeContext } from "../flat-table.component";
 import guid from "../../../__internal__/utils/helpers/guid";
-const FlatTableRow = /*#__PURE__*/React.forwardRef((_ref, ref) => {
-  let {
-    children,
-    onClick,
-    expandable,
-    expandableArea = "wholeRow",
-    expanded = false,
-    isSubRow,
-    isFirstSubRow,
-    stickyOffset,
-    highlighted,
-    selected,
-    subRows,
-    bgColor,
-    horizontalBorderColor,
-    horizontalBorderSize = "small",
-    applyBorderLeft,
-    id,
-    draggable,
-    findItem,
-    moveItem,
-    ...rest
-  } = _ref;
+const FlatTableRow = /*#__PURE__*/React.forwardRef(({
+  children,
+  onClick,
+  expandable,
+  expandableArea = "wholeRow",
+  expanded = false,
+  isSubRow,
+  isFirstSubRow,
+  stickyOffset,
+  highlighted,
+  selected,
+  subRows,
+  bgColor,
+  horizontalBorderColor,
+  horizontalBorderSize = "small",
+  applyBorderLeft,
+  id,
+  draggable,
+  findItem,
+  moveItem,
+  ...rest
+}, ref) => {
   const internalId = useRef(id ?? guid());
   const [isExpanded, setIsExpanded] = useState(expanded);
   let rowRef = useRef(null);

package/esm/components/flat-table/flat-table-row/flat-table-row.style.js

@@ -66,32 +66,31 @@ const verticalBorderColor = colorTheme => {
   }
 };
 const StyledFlatTableRow = styled.tr`
-  ${_ref => {
-  let {
-    bgColor,
-    horizontalBorderColor,
-    horizontalBorderSize,
-    stickyOffset,
-    isRowInteractive,
-    isFirstColumnInteractive,
-    lhsRowHeaderIndex,
-    rhsRowHeaderIndex,
-    totalChildren,
-    firstCellIndex,
-    colorTheme,
-    expandable,
-    selected,
-    highlighted,
-    isExpanded,
-    isInSidebar,
-    isSubRow,
-    isFirstSubRow,
-    size,
-    theme,
-    applyBorderLeft,
-    isDragging,
-    draggable
-  } = _ref;
+  ${({
+  bgColor,
+  horizontalBorderColor,
+  horizontalBorderSize,
+  stickyOffset,
+  isRowInteractive,
+  isFirstColumnInteractive,
+  lhsRowHeaderIndex,
+  rhsRowHeaderIndex,
+  totalChildren,
+  firstCellIndex,
+  colorTheme,
+  expandable,
+  selected,
+  highlighted,
+  isExpanded,
+  isInSidebar,
+  isSubRow,
+  isFirstSubRow,
+  size,
+  theme,
+  applyBorderLeft,
+  isDragging,
+  draggable
+}) => {
   const backgroundColor = bgColor ? toColor(theme, bgColor) : undefined;
   const customBorderColor = horizontalBorderColor ? toColor(theme, horizontalBorderColor) : undefined;
   const colorOfSelected = isInSidebar ? "var(--colorsUtilityMajor150)" : "var(--colorsUtilityMajor075)";

package/esm/components/flat-table/flat-table-row-header/flat-table-row-header.component.js

@@ -5,25 +5,24 @@ import Icon from "../../icon";
 import { StyledFlatTableRowHeader, StyledFlatTableRowHeaderContent } from "./flat-table-row-header.style";
 import { FlatTableThemeContext } from "../flat-table.component";
 import guid from "../../../__internal__/utils/helpers/guid";
-export const FlatTableRowHeader = _ref => {
-  let {
-    align = "left",
-    children,
-    width,
-    py,
-    px,
-    expandable = false,
-    onClick,
-    onKeyDown,
-    leftPosition,
-    rightPosition,
-    truncate,
-    title,
-    stickyAlignment = "left",
-    colspan,
-    rowspan,
-    ...rest
-  } = _ref;
+export const FlatTableRowHeader = ({
+  align = "left",
+  children,
+  width,
+  py,
+  px,
+  expandable = false,
+  onClick,
+  onKeyDown,
+  leftPosition,
+  rightPosition,
+  truncate,
+  title,
+  stickyAlignment = "left",
+  colspan,
+  rowspan,
+  ...rest
+}) => {
   const id = useRef(guid());
   const [tabIndex, setTabIndex] = useState(-1);
   const {

package/esm/components/flat-table/flat-table-row-header/flat-table-row-header.style.js

@@ -8,20 +8,18 @@ const verticalBorderSizes = {
   large: "4px"
 };
 const StyledFlatTableRowHeader = styled.th`
-  ${_ref => {
-  let {
-    align,
-    theme,
-    width,
-    leftPosition,
-    rightPosition,
-    truncate,
-    expandable,
-    verticalBorder,
-    verticalBorderColor,
-    stickyAlignment
-  } = _ref;
-  return css`
+  ${({
+  align,
+  theme,
+  width,
+  leftPosition,
+  rightPosition,
+  truncate,
+  expandable,
+  verticalBorder,
+  verticalBorderColor,
+  stickyAlignment
+}) => css`
     background-color: var(--colorsUtilityYang100);
     border: 1px solid var(--colorsUtilityMajor100);
     border-top: none;
@@ -75,22 +73,18 @@ const StyledFlatTableRowHeader = styled.th`
     ${expandable && css`
       white-space: nowrap;
     `}
-  `;
-}}
+  `}
 `;
 StyledFlatTableRowHeader.defaultProps = {
   theme: baseTheme
 };
 const StyledFlatTableRowHeaderContent = styled.div`
-  ${_ref2 => {
-  let {
-    expandable
-  } = _ref2;
-  return expandable && css`
+  ${({
+  expandable
+}) => expandable && css`
       display: flex;
       align-items: center;
       line-height: 1em;
-    `;
-}}
+    `}
 `;
 export { StyledFlatTableRowHeader, StyledFlatTableRowHeaderContent };

package/esm/components/flat-table/flat-table.component.js

@@ -8,24 +8,23 @@ export const FlatTableThemeContext = /*#__PURE__*/React.createContext({
   setSelectedId: () => {}
 });
 const FOCUSABLE_ROW_AND_CELL_QUERY = "tbody tr, tbody tr td, tbody tr th";
-export const FlatTable = _ref => {
-  let {
-    caption,
-    children,
-    hasStickyHead,
-    colorTheme = "dark",
-    footer,
-    hasStickyFooter = false,
-    height,
-    isZebra,
-    size = "medium",
-    hasMaxHeight = false,
-    ariaDescribedby,
-    minHeight,
-    overflowX,
-    width,
-    ...rest
-  } = _ref;
+export const FlatTable = ({
+  caption,
+  children,
+  hasStickyHead,
+  colorTheme = "dark",
+  footer,
+  hasStickyFooter = false,
+  height,
+  isZebra,
+  size = "medium",
+  hasMaxHeight = false,
+  ariaDescribedby,
+  minHeight,
+  overflowX,
+  width,
+  ...rest
+}) => {
   const wrapperRef = useRef(null);
   const tableRef = useRef(null);
   const [hasVerticalScrollbar, setHasVerticalScrollbar] = useState(false);