carbon-react 118.5.1 → 118.5.2

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

@@ -1,5 +1,4 @@
-function _extends() { _extends = Object.assign || 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); }
-
+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); }
 import React, { useLayoutEffect, useRef } from "react";
 import PropTypes from "prop-types";
 import styledSystemPropTypes from "@styled-system/prop-types";
@@ -7,25 +6,25 @@ import { StyledFlatTableCell, StyledCellContent } from "./flat-table-cell.style"
 import { filterStyledSystemPaddingProps } from "../../../style/utils";
 import Icon from "../../icon";
 const paddingPropTypes = filterStyledSystemPaddingProps(styledSystemPropTypes.space);
-
-const FlatTableCell = ({
-  align = "left",
-  children,
-  colspan,
-  rowspan,
-  pl,
-  expandable = false,
-  onClick,
-  onKeyDown,
-  reportCellWidth,
-  cellIndex,
-  leftPosition,
-  rightPosition,
-  width,
-  truncate = false,
-  title,
-  ...rest
-}) => {
+const FlatTableCell = _ref => {
+  let {
+    align = "left",
+    children,
+    colspan,
+    rowspan,
+    pl,
+    expandable = false,
+    onClick,
+    onKeyDown,
+    reportCellWidth,
+    cellIndex,
+    leftPosition,
+    rightPosition,
+    width,
+    truncate = false,
+    title,
+    ...rest
+  } = _ref;
   const ref = useRef(null);
   useLayoutEffect(() => {
     if (ref.current && reportCellWidth) {
@@ -58,81 +57,64 @@ const FlatTableCell = ({
     mr: "8px"
   }), children));
 };
-
 FlatTableCell.propTypes = {
   /** Styled system padding props */
   ...paddingPropTypes,
-
   /** Content alignment */
   align: PropTypes.oneOf(["center", "left", "right"]),
-
   /** Cell content */
   children: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),
-
   /** Number of columns that a cell should span */
   colspan: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-
   /** Number of rows that a cell should span */
   rowspan: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-
   /** Column width, pass a number to set a fixed width in pixels */
   width: PropTypes.number,
-
   /** Truncate cell content and add ellipsis to any text that overflows */
   truncate: PropTypes.bool,
-
   /** Title text to display if cell content truncates */
   title: PropTypes.string,
-
   /**
    * @private
    * @ignore
    */
   expandable: PropTypes.bool,
-
   /**
    * @private
    * @ignore
    */
   onClick: PropTypes.func,
-
   /**
    * @private
    * @ignore
    */
   onKeyDown: PropTypes.func,
-
   /**
    * @private
    * @ignore
    * Sets the left position when sticky column found
    */
   leftPosition: PropTypes.number,
-
   /**
    * @private
    * @ignore
    * Sets the right position when sticky column found
    */
   rightPosition: PropTypes.number,
-
   /**
    * @private
    * @ignore
    * Index of cell within row
    */
   cellIndex: PropTypes.number,
-
   /**
    * @private
    * @ignore
    * Callback to report the offsetWidth
    */
   reportCellWidth: PropTypes.func,
-
   /** Sets a custom vertical right border */
   verticalBorder: PropTypes.oneOf(["small", "medium", "large"]),
-
   /** Sets a vertical right border color, provide design token, any color from palette or any valid css color value. */
   verticalBorderColor: PropTypes.string
 };

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

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

@@ -1,23 +1,22 @@
-function _extends() { _extends = Object.assign || 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); }
-
+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); }
 import React, { useLayoutEffect, useRef } from "react";
 import PropTypes from "prop-types";
 import StyledFlatTableCheckbox from "./flat-table-checkbox.style";
 import { Checkbox } from "../../checkbox";
-
-const FlatTableCheckbox = ({
-  as = "td",
-  checked,
-  onChange,
-  selectable = true,
-  onClick,
-  leftPosition,
-  rightPosition,
-  cellIndex,
-  reportCellWidth,
-  ariaLabelledBy,
-  ...rest
-}) => {
+const FlatTableCheckbox = _ref => {
+  let {
+    as = "td",
+    checked,
+    onChange,
+    selectable = true,
+    onClick,
+    leftPosition,
+    rightPosition,
+    cellIndex,
+    reportCellWidth,
+    ariaLabelledBy,
+    ...rest
+  } = _ref;
   const ref = useRef(null);
   useLayoutEffect(() => {
     if (ref.current && reportCellWidth) {
@@ -25,16 +24,13 @@ const FlatTableCheckbox = ({
     }
   }, [reportCellWidth, cellIndex]);
   const dataElement = `flat-table-checkbox-${as === "td" ? "cell" : "header"}`;
-
   const handleClick = event => {
     event.stopPropagation();
     if (onClick) onClick(event);
   };
-
   const handleKeyDown = event => {
     event.stopPropagation();
   };
-
   return /*#__PURE__*/React.createElement(StyledFlatTableCheckbox, _extends({
     ref: ref,
     makeCellSticky: !!reportCellWidth,
@@ -53,47 +49,37 @@ const FlatTableCheckbox = ({
     onKeyDown: handleKeyDown
   }));
 };
-
 FlatTableCheckbox.propTypes = {
   /** Prop to polymorphically render either a 'th' or 'td' element */
   as: PropTypes.oneOf(["td", "th"]),
-
   /** Prop to set checked prop on Checkbox */
   checked: PropTypes.bool,
-
   /** Callback to be called onChange in Checkbox */
   onChange: PropTypes.func,
-
   /** Callback function to be called when click event received */
   onClick: PropTypes.func,
-
   /** Whether to render the checkbox or not, defaults to true */
   selectable: PropTypes.bool,
-
   /** The id of the element that labels the input */
   ariaLabelledBy: PropTypes.string,
-
   /**
    * @private
    * @ignore
    * Sets the left position when sticky column found
    */
   leftPosition: PropTypes.number,
-
   /**
    * @private
    * @ignore
    * Sets the right position when sticky column found
    */
   rightPosition: PropTypes.number,
-
   /**
    * @private
    * @ignore
    * Index of cell within row
    */
   cellIndex: PropTypes.number,
-
   /**
    * @private
    * @ignore

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

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

@@ -2,43 +2,40 @@ import React, { useEffect, useState } from "react";
 import PropTypes from "prop-types";
 import StyledFlatTableHead from "./flat-table-head.style";
 import FlatTableRowHeader from "../flat-table-row-header";
-
 const getRefs = length => Array.from({
   length
 }, () => /*#__PURE__*/React.createRef());
-
-const FlatTableHead = ({
-  children,
-  ...rest
-}) => {
+const FlatTableHead = _ref => {
+  let {
+    children,
+    ...rest
+  } = _ref;
   const [rowHeights, setRowHeights] = useState([]);
   const refs = getRefs(React.Children.count(children));
   let hasFlatTableRowHeader;
   useEffect(() => {
     if (React.Children.count(children) > 1) {
       setRowHeights(refs.map(ref => ref.current.clientHeight));
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
-
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-
   if (React.Children.count(children) === 1) {
     return /*#__PURE__*/React.createElement(StyledFlatTableHead, rest, children);
   }
-
   return /*#__PURE__*/React.createElement(StyledFlatTableHead, rest, React.Children.map(children, (child, index) => {
     /* Applies left border if preceding row has a FlatTableRowHeader and current one does not. 
        This is only needed when the preceding row has rowSpans applied, 
        as in any other use case the rows will all have FlatTableRowHeaders */
     const previousRowHasHeader = !!hasFlatTableRowHeader;
     hasFlatTableRowHeader = React.Children.toArray(child.props.children).find(c => c.type === FlatTableRowHeader);
-    return /*#__PURE__*/React.cloneElement(child, { ...child.props,
+    return /*#__PURE__*/React.cloneElement(child, {
+      ...child.props,
       stickyOffset: rowHeights.slice(0, index).reduce((a, b) => a + b, 0),
       ref: refs[index],
       applyBorderLeft: previousRowHasHeader && !hasFlatTableRowHeader
     });
   }));
 };
-
 FlatTableHead.propTypes = {
   children: PropTypes.node.isRequired
 };

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

@@ -2,17 +2,14 @@ const getAlternativeBackgroundColor = colorTheme => {
   switch (colorTheme) {
     case "light":
       return "var(--colorsActionMinor100)";
-
     case "transparent-base":
       return "var(--colorsUtilityMajor025)";
-
     case "transparent-white":
       return "var(--colorsUtilityYang100)";
-    // default theme is "dark"
 
+    // default theme is "dark"
     default:
       return "var(--colorsActionMinor550)";
   }
 };
-
 export default getAlternativeBackgroundColor;

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

@@ -1,5 +1,4 @@
-function _extends() { _extends = Object.assign || 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); }
-
+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); }
 import React, { useLayoutEffect, useRef, useContext } from "react";
 import PropTypes from "prop-types";
 import styledSystemPropTypes from "@styled-system/prop-types";
@@ -7,21 +6,21 @@ import StyledFlatTableHeader from "./flat-table-header.style";
 import { filterStyledSystemPaddingProps } from "../../../style/utils";
 import { FlatTableThemeContext } from "../flat-table.component";
 const paddingPropTypes = filterStyledSystemPaddingProps(styledSystemPropTypes.space);
-
-const FlatTableHeader = ({
-  align,
-  children,
-  colspan,
-  rowspan,
-  width,
-  py,
-  px,
-  reportCellWidth,
-  cellIndex,
-  leftPosition,
-  rightPosition,
-  ...rest
-}) => {
+const FlatTableHeader = _ref => {
+  let {
+    align,
+    children,
+    colspan,
+    rowspan,
+    width,
+    py,
+    px,
+    reportCellWidth,
+    cellIndex,
+    leftPosition,
+    rightPosition,
+    ...rest
+  } = _ref;
   const ref = useRef(null);
   const {
     colorTheme
@@ -47,57 +46,45 @@ const FlatTableHeader = ({
     px: px
   }, rest), /*#__PURE__*/React.createElement("div", null, children));
 };
-
 FlatTableHeader.propTypes = {
   /** Styled system padding props */
   ...paddingPropTypes,
-
   /** Content alignment */
   align: PropTypes.oneOf(["center", "left", "right"]),
-
   /** Header content */
   children: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),
-
   /** Number of columns that a header cell should span */
   colspan: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-
   /** Number of rows that a header cell should span */
   rowspan: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-
   /** Column width, pass a number to set a fixed width in pixels */
   width: PropTypes.number,
-
   /**
    * @private
    * @ignore
    * Sets the left position when sticky column found
    */
   leftPosition: PropTypes.number,
-
   /**
    * @private
    * @ignore
    * Sets the right position when sticky column found
    */
   rightPosition: PropTypes.number,
-
   /**
    * @private
    * @ignore
    * Index of cell within row
    */
   cellIndex: PropTypes.number,
-
   /**
    * @private
    * @ignore
    * Callback to report the offsetWidth
    */
   reportCellWidth: PropTypes.func,
-
   /** If true sets alternative background color */
   alternativeBgColor: PropTypes.bool,
-
   /** Sets a custom vertical right border */
   verticalBorder: PropTypes.oneOf(["small", "medium", "large"])
 };

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

@@ -9,18 +9,20 @@ const verticalBorderSizes = {
   large: "4px"
 };
 const StyledFlatTableHeader = styled.th`
-  ${({
-  align,
-  alternativeBgColor,
-  colWidth,
-  leftPosition,
-  rightPosition,
-  makeCellSticky,
-  verticalBorder,
-  verticalBorderColor,
-  colorTheme,
-  theme
-}) => css`
+  ${_ref => {
+  let {
+    align,
+    alternativeBgColor,
+    colWidth,
+    leftPosition,
+    rightPosition,
+    makeCellSticky,
+    verticalBorder,
+    verticalBorderColor,
+    colorTheme,
+    theme
+  } = _ref;
+  return css`
     background-color: transparent;
     border-width: 0;
     box-sizing: border-box;
@@ -94,7 +96,8 @@ 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,13 @@
 import React from "react";
 import { useDrop, useDrag } from "react-dnd";
 import PropTypes from "prop-types";
-
-const FlatTableRowDraggable = ({
-  children,
-  id,
-  findItem,
-  moveItem
-}) => {
+const FlatTableRowDraggable = _ref => {
+  let {
+    children,
+    id,
+    findItem,
+    moveItem
+  } = _ref;
   const originalIndex = findItem(id).index;
   const [{
     isDragging
@@ -26,7 +26,6 @@ const FlatTableRowDraggable = ({
         originalIndex: oIndex
       } = monitor.getItem();
       const didDrop = monitor.didDrop();
-
       if (!didDrop) {
         moveItem(droppedId, oIndex);
       }
@@ -35,10 +34,10 @@ const FlatTableRowDraggable = ({
   const [, drop] = useDrop({
     accept: "flatTableRow",
     canDrop: () => false,
-
-    hover({
-      id: draggedId
-    }) {
+    hover(_ref2) {
+      let {
+        id: draggedId
+      } = _ref2;
       if (draggedId !== id) {
         const {
           index: overIndex
@@ -46,7 +45,6 @@ const FlatTableRowDraggable = ({
         moveItem(draggedId, overIndex);
       }
     }
-
   });
   return /*#__PURE__*/React.cloneElement(children, {
     key: originalIndex,
@@ -55,20 +53,15 @@ const FlatTableRowDraggable = ({
     ref: node => drag(drop(node))
   });
 };
-
 FlatTableRowDraggable.propTypes = {
   /** Array of FlatTableHeader or FlatTableCell. FlatTableRowHeader could also be passed. */
   children: PropTypes.node.isRequired,
-
   /** ID for use in drag and drop functionality */
   id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-
   /** function to find an item in the list of draggable items */
   findItem: PropTypes.func.isRequired,
-
   /** function to reposition an item in the list of draggable items */
   moveItem: PropTypes.func.isRequired,
-
   /** item is draggable */
   draggable: PropTypes.bool
 };