@carbon/ibm-products 2.65.0 → 2.66.0

package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { extends as _extends } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useRef, useEffect } from 'react';
 import PropTypes from '../../../../../_virtual/index.js';
 import { Settings } from '@carbon/react/icons';
@@ -15,44 +15,38 @@ import RowSizeRadioGroup from './RowSizeRadioGroup.js';
 import { carbon, pkg } from '../../../../../settings.js';
 
 var _Settings;
-var _excluded = ["align", "legendText", "autoAlign"];
-var blockClass = "".concat(pkg.prefix, "--datagrid__row-size");
-var RowSizeDropdown = function RowSizeDropdown(_ref) {
-  var _ref$align = _ref.align,
-    align = _ref$align === void 0 ? 'bottom-right' : _ref$align,
-    _ref$legendText = _ref.legendText,
-    legendText = _ref$legendText === void 0 ? 'Row settings' : _ref$legendText,
-    autoAlign = _ref.autoAlign,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var radioGroupRef = useRef(undefined);
-  var _React$useState = React__default.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    isOpen = _React$useState2[0],
-    setIsOpen = _React$useState2[1];
-  var onCloseHandler = function onCloseHandler() {
+const blockClass = `${pkg.prefix}--datagrid__row-size`;
+const RowSizeDropdown = _ref => {
+  let {
+    align = 'bottom-right',
+    legendText = 'Row settings',
+    autoAlign,
+    ...props
+  } = _ref;
+  const radioGroupRef = useRef(undefined);
+  const [isOpen, setIsOpen] = React__default.useState(false);
+  const onCloseHandler = () => {
     setIsOpen(false);
   };
-  var onKeyHandler = function onKeyHandler(e) {
+  const onKeyHandler = e => {
     if (e.key === 'Escape') {
       onCloseHandler();
     }
   };
-  var onBlurHandler = function onBlurHandler(e) {
+  const onBlurHandler = e => {
     if (!e.currentTarget.contains(e.relatedTarget)) {
       onCloseHandler();
     }
   };
-  useEffect(function () {
+  useEffect(() => {
     if (isOpen) {
-      var radioGroupParentElement = radioGroupRef === null || radioGroupRef === void 0 ? void 0 : radioGroupRef.current;
-      var checkedRadioChild = radioGroupParentElement === null || radioGroupParentElement === void 0 ? void 0 : radioGroupParentElement.querySelector(".".concat(carbon.prefix, "--radio-button:checked"));
-      checkedRadioChild === null || checkedRadioChild === void 0 || checkedRadioChild.focus();
+      const radioGroupParentElement = radioGroupRef?.current;
+      const checkedRadioChild = radioGroupParentElement?.querySelector(`.${carbon.prefix}--radio-button:checked`);
+      checkedRadioChild?.focus();
     }
   }, [isOpen]);
-  var onClickHandler = function onClickHandler() {
-    setIsOpen(function (prev) {
-      return !prev;
-    });
+  const onClickHandler = () => {
+    setIsOpen(prev => !prev);
   };
   return /*#__PURE__*/React__default.createElement(Popover, {
     tabIndex: -1,
@@ -60,7 +54,7 @@ var RowSizeDropdown = function RowSizeDropdown(_ref) {
     align: "bottom-right",
     open: isOpen,
     onRequestClose: onCloseHandler,
-    className: "".concat(blockClass, "-options-container"),
+    className: `${blockClass}-options-container`,
     onKeyDown: onKeyHandler,
     onBlur: onBlurHandler,
     autoAlign: autoAlign
@@ -69,7 +63,9 @@ var RowSizeDropdown = function RowSizeDropdown(_ref) {
     kind: "ghost",
     onClick: onClickHandler,
     label: legendText,
-    className: cx("".concat(blockClass, "-button"), _defineProperty({}, "".concat(blockClass, "__row-settings-trigger--open"), isOpen))
+    className: cx(`${blockClass}-button`, {
+      [`${blockClass}__row-settings-trigger--open`]: isOpen
+    })
   }, _Settings || (_Settings = /*#__PURE__*/React__default.createElement(Settings, {
     size: 16
   }))), /*#__PURE__*/React__default.createElement(PopoverContent, null, /*#__PURE__*/React__default.createElement(Layer, null, /*#__PURE__*/React__default.createElement(RowSizeRadioGroup, _extends({

package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js

@@ -10,50 +10,51 @@ import PropTypes from '../../../../../_virtual/index.js';
 import { RadioButtonGroup, RadioButton } from '@carbon/react';
 import { pkg } from '../../../../../settings.js';
 
-var blockClass = "".concat(pkg.prefix, "--datagrid__row-size");
-var RowSizeRadioGroup = /*#__PURE__*/forwardRef(function (_ref, ref) {
-  var rowSizes = _ref.rowSizes,
-    selectedOption = _ref.selectedOption,
-    onChange = _ref.onChange,
-    legendText = _ref.legendText,
-    _ref$rowSizeLabels = _ref.rowSizeLabels,
-    rowSizeLabels = _ref$rowSizeLabels === void 0 ? {
+const blockClass = `${pkg.prefix}--datagrid__row-size`;
+const RowSizeRadioGroup = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    rowSizes,
+    selectedOption,
+    onChange,
+    legendText,
+    rowSizeLabels = {
       xl: 'Extra large',
       lg: 'Large (default)',
       md: 'Medium',
       sm: 'Small',
       xs: 'Extra small'
-    } : _ref$rowSizeLabels,
-    tableId = _ref.tableId;
+    },
+    tableId
+  } = _ref;
   return /*#__PURE__*/React__default.createElement("div", {
-    className: "".concat(blockClass, "-dropdown"),
+    className: `${blockClass}-dropdown`,
     role: "presentation",
     ref: ref
   }, /*#__PURE__*/React__default.createElement(RadioButtonGroup, {
     legendText: legendText,
-    name: "".concat(tableId, "--row-height-group"),
+    name: `${tableId}--row-height-group`,
     orientation: "vertical",
     defaultSelected: getBackwardCompatibleRowSize(selectedOption),
     onChange: onChange
-  }, rowSizes && Array.isArray(rowSizes) && rowSizes.map(function (option) {
-    var labelText;
+  }, rowSizes && Array.isArray(rowSizes) && rowSizes.map(option => {
+    let labelText;
     try {
       labelText = option.labelText || rowSizeLabels[option.value];
     } catch (e) {
       labelText = option.value;
     }
     return /*#__PURE__*/React__default.createElement(RadioButton, {
-      className: "".concat(blockClass, "-radio-button"),
+      className: `${blockClass}-radio-button`,
       key: option.value,
       labelText: labelText,
       value: option.value,
-      id: "".concat(tableId || 'datagrid', "--row-density--").concat(option.value)
+      id: `${tableId || 'datagrid'}--row-density--${option.value}`
     });
   })));
 });
-var getBackwardCompatibleRowSize = function getBackwardCompatibleRowSize(rowSize) {
+const getBackwardCompatibleRowSize = rowSize => {
   // TODO: deprecate this function in next major release (v8) on carbon-components-react
-  var rowSizeMap = {
+  const rowSizeMap = {
     tall: 'xl',
     normal: 'lg',
     short: 'sm',