@atlaskit/table-tree 9.12.2 → 10.0.0

package/dist/esm/components/header.js

@@ -1,21 +1,12 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**
  * @jsxRuntime classic
  * @jsx jsx
  */
-import { Component } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { N300 } from '@atlaskit/theme/colors';
-import ColumnCell from './internal/common-cell';
+import CommonCell from './internal/common-cell';
 import withColumnWidth from './internal/with-column-width';
 var headerStyles = css({
   color: "var(--ds-text-subtle, ".concat(N300, ")"),
@@ -31,32 +22,22 @@ var headerStyles = css({
  *
  * Defining it here for now lets us provide *something* without much headache.
  */
-var HeaderComponent = /*#__PURE__*/function (_Component) {
-  _inherits(HeaderComponent, _Component);
-  var _super = _createSuper(HeaderComponent);
-  function HeaderComponent() {
-    _classCallCheck(this, HeaderComponent);
-    return _super.apply(this, arguments);
-  }
-  _createClass(HeaderComponent, [{
-    key: "render",
-    value: function render() {
-      var props = this.props;
-      return (
-        // TODO: Determine whether proper `th` elements can be used instead of
-        // roles (DSP-11588)
-        jsx(ColumnCell, _extends({
-          css: headerStyles,
-          role: "columnheader",
-          style: {
-            width: props.width
-          }
-        }, props), props.children)
-      );
-    }
-  }]);
-  return HeaderComponent;
-}(Component);
+
+var HeaderComponent = function HeaderComponent(_ref) {
+  var width = _ref.width,
+    children = _ref.children,
+    onClick = _ref.onClick,
+    id = _ref.id;
+  // TODO: Determine whether proper `th` elements can be used instead of
+  // roles (DSP-11588)
+  return jsx(CommonCell, {
+    css: headerStyles,
+    role: "columnheader",
+    width: width,
+    id: id,
+    onClick: onClick
+  }, children);
+};
 var Header = withColumnWidth(HeaderComponent);
 
 // eslint-disable-next-line @repo/internal/react/require-jsdoc

package/dist/esm/components/headers.js

@@ -1,16 +1,9 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**
  * @jsxRuntime classic
  * @jsx jsx
  */
 /* eslint-disable @repo/internal/react/no-clone-element */
-import { Children, cloneElement, Component } from 'react';
+import { Children, cloneElement } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
@@ -18,35 +11,28 @@ var containerStyles = css({
   display: 'flex',
   borderBlockEnd: "solid 2px ".concat("var(--ds-border, #dfe1e6)")
 });
-var Headers = /*#__PURE__*/function (_Component) {
-  _inherits(Headers, _Component);
-  var _super = _createSuper(Headers);
-  function Headers() {
-    _classCallCheck(this, Headers);
-    return _super.apply(this, arguments);
-  }
-  _createClass(Headers, [{
-    key: "render",
-    value: function render() {
-      return (
-        // TODO: Determine whether proper `tr` elements can be used instead of
-        // roles (DSP-11588)
-        jsx("div", {
-          css: containerStyles,
-          role: "row"
-        }, Children.map(this.props.children, function (header, index) {
-          return (
-            /*#__PURE__*/
-            // eslint-disable-next-line react/no-array-index-key
-            cloneElement(header, {
-              key: index,
-              columnIndex: index
-            })
-          );
-        }))
-      );
-    }
-  }]);
-  return Headers;
-}(Component);
-export { Headers as default };
+/**
+ * __Headers__
+ *
+ * Headers component for advanced composition of data, allowing custom data structures.
+ *
+ * - [Examples](https://atlassian.design/components/table-tree/examples#advanced)
+ * - [Code](https://atlassian.design/components/table-tree/code#headers-props)
+ */
+var Headers = function Headers(_ref) {
+  var children = _ref.children;
+  return (
+    // TODO: Determine whether proper `tr` elements can be used instead of
+    // roles (DSP-11588)
+    jsx("div", {
+      css: containerStyles,
+      role: "row"
+    }, Children.map(children, function (header, index) {
+      return /*#__PURE__*/cloneElement(header, {
+        key: index,
+        columnIndex: index
+      });
+    }))
+  );
+};
+export default Headers;

package/dist/esm/components/internal/chevron.js

@@ -1,63 +1,35 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /* eslint-disable @repo/internal/react/consistent-props-definitions */
 /* eslint-disable react/prop-types */
-import React, { Component } from 'react';
+import React from 'react';
 import { IconButton } from '@atlaskit/button/new';
+import __noop from '@atlaskit/ds-lib/noop';
 import ChevronDownIcon from '@atlaskit/icon/glyph/chevron-down';
 import ChevronRightIcon from '@atlaskit/icon/glyph/chevron-right';
 import { ChevronContainer } from './styled';
-var Chevron = /*#__PURE__*/function (_Component) {
-  _inherits(Chevron, _Component);
-  var _super = _createSuper(Chevron);
-  function Chevron() {
-    var _this;
-    _classCallCheck(this, Chevron);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "handleClick", function () {
-      if (_this.props.onExpandToggle) {
-        _this.props.onExpandToggle();
-      }
-    });
-    return _this;
-  }
-  _createClass(Chevron, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-        isExpanded = _this$props.isExpanded,
-        ariaControls = _this$props.ariaControls,
-        collapseLabel = _this$props.collapseLabel,
-        expandLabel = _this$props.expandLabel,
-        rowId = _this$props.rowId,
-        extendedLabel = _this$props.extendedLabel;
-      var getLabel = function getLabel(defaultLabel) {
-        return extendedLabel ? "".concat(defaultLabel, " ").concat(extendedLabel, " row") : "".concat(defaultLabel, " row ").concat(rowId);
-      };
-      return /*#__PURE__*/React.createElement(ChevronContainer, null, /*#__PURE__*/React.createElement(IconButton, {
-        appearance: "subtle",
-        onClick: this.handleClick,
-        spacing: "compact",
-        icon: isExpanded ? ChevronDownIcon : ChevronRightIcon,
-        "aria-controls": ariaControls,
-        label: isExpanded ? getLabel(collapseLabel) : getLabel(expandLabel)
-      }));
-    }
-  }]);
-  return Chevron;
-}(Component);
-_defineProperty(Chevron, "defaultProps", {
-  expandLabel: 'Expand',
-  collapseLabel: 'Collapse'
-});
-export { Chevron as default };
+/**
+ * Internal chevron component.
+ */
+var Chevron = function Chevron(_ref) {
+  var isExpanded = _ref.isExpanded,
+    ariaControls = _ref.ariaControls,
+    _ref$collapseLabel = _ref.collapseLabel,
+    collapseLabel = _ref$collapseLabel === void 0 ? 'Collapse' : _ref$collapseLabel,
+    _ref$expandLabel = _ref.expandLabel,
+    expandLabel = _ref$expandLabel === void 0 ? 'Expand' : _ref$expandLabel,
+    rowId = _ref.rowId,
+    extendedLabel = _ref.extendedLabel,
+    _ref$onExpandToggle = _ref.onExpandToggle,
+    onExpandToggle = _ref$onExpandToggle === void 0 ? __noop : _ref$onExpandToggle;
+  var getLabel = function getLabel(defaultLabel) {
+    return extendedLabel ? "".concat(defaultLabel, " ").concat(extendedLabel, " row") : "".concat(defaultLabel, " row ").concat(rowId);
+  };
+  return /*#__PURE__*/React.createElement(ChevronContainer, null, /*#__PURE__*/React.createElement(IconButton, {
+    appearance: "subtle",
+    onClick: onExpandToggle,
+    spacing: "compact",
+    icon: isExpanded ? ChevronDownIcon : ChevronRightIcon,
+    "aria-controls": ariaControls,
+    label: isExpanded ? getLabel(collapseLabel) : getLabel(expandLabel)
+  }));
+};
+export default Chevron;

package/dist/esm/components/internal/item.js

@@ -1,66 +1,46 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**
  * @jsxRuntime classic
  * @jsx jsx
  */
 /* eslint-disable @repo/internal/react/no-clone-element */
-import { cloneElement, Component } from 'react';
+import { cloneElement } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import toItemId from '../../utils/to-item-id';
 import Items from './items';
-var Item = /*#__PURE__*/function (_Component) {
-  _inherits(Item, _Component);
-  var _super = _createSuper(Item);
-  function Item() {
-    _classCallCheck(this, Item);
-    return _super.apply(this, arguments);
+/**
+ * __Item__
+ * Internal item component.
+ */
+function Item(_ref) {
+  var _ref$depth = _ref.depth,
+    depth = _ref$depth === void 0 ? 0 : _ref$depth,
+    data = _ref.data,
+    render = _ref.render,
+    loadingLabel = _ref.loadingLabel;
+  var renderedRow = render(data);
+  if (!renderedRow) {
+    return null;
   }
-  _createClass(Item, [{
-    key: "render",
-    value: function render() {
-      // eslint-disable-next-line react/prop-types
-      var _this$props = this.props,
-        depth = _this$props.depth,
-        data = _this$props.data,
-        render = _this$props.render,
-        loadingLabel = _this$props.loadingLabel;
-      var renderedRow = render(data);
-      if (!renderedRow) {
-        return null;
-      }
-      var _renderedRow$props = renderedRow.props,
-        itemId = _renderedRow$props.itemId,
-        items = _renderedRow$props.items;
-      return /*#__PURE__*/cloneElement(renderedRow, {
+
+  // itemId exists on RowProps, but not on RowsProps
+  var itemId = 'itemId' in renderedRow.props ? renderedRow.props.itemId : undefined;
+  var items = renderedRow.props.items;
+  return /*#__PURE__*/cloneElement(renderedRow, {
+    depth: depth,
+    data: data,
+    loadingLabel: loadingLabel,
+    renderChildren: function renderChildren() {
+      return jsx("div", {
+        id: !!itemId ? toItemId(itemId) : undefined
+      }, jsx(Items, {
         depth: depth,
-        data: data,
-        loadingLabel: loadingLabel,
-        renderChildren: function renderChildren() {
-          return jsx("div", {
-            id: toItemId(itemId)
-          }, jsx(Items, {
-            parentData: data,
-            depth: depth,
-            items: items,
-            render: render,
-            loadingLabel: loadingLabel
-          }));
-        }
-      });
+        items: items,
+        render: render,
+        loadingLabel: loadingLabel
+      }));
     }
-  }]);
-  return Item;
-}(Component);
-_defineProperty(Item, "defaultProps", {
-  depth: 0
-});
-export { Item as default };
+  });
+}
+export default Item;

package/dist/esm/components/internal/items.js

@@ -1,89 +1,35 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
-/* eslint-disable react/prop-types */
-import React, { Component } from 'react';
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useState } from 'react';
 import Item from './item';
 import LoaderItem from './loader-item';
-var Items = /*#__PURE__*/function (_Component) {
-  _inherits(Items, _Component);
-  var _super = _createSuper(Items);
-  function Items() {
-    var _this;
-    _classCallCheck(this, Items);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "state", {
-      isLoaderShown: false
+function Items(_ref) {
+  var _ref$depth = _ref.depth,
+    depth = _ref$depth === void 0 ? 0 : _ref$depth,
+    items = _ref.items,
+    loadingLabel = _ref.loadingLabel,
+    render = _ref.render;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isLoaderShown = _useState2[0],
+    setIsLoaderShown = _useState2[1];
+  var handleLoaderComplete = function handleLoaderComplete() {
+    return setIsLoaderShown(false);
+  };
+  return !items || isLoaderShown ? /*#__PURE__*/React.createElement(LoaderItem, {
+    isCompleting: !!(items && items.length),
+    onComplete: handleLoaderComplete,
+    depth: depth + 1,
+    loadingLabel: loadingLabel
+  }) : /*#__PURE__*/React.createElement(React.Fragment, null, items.map(function (data) {
+    return /*#__PURE__*/React.createElement(Item, {
+      data: data,
+      depth: depth + 1,
+      key: data.id,
+      render: render,
+      loadingLabel: loadingLabel
     });
-    _defineProperty(_assertThisInitialized(_this), "handleLoaderComplete", function () {
-      _this.setState({
-        isLoaderShown: false
-      });
-    });
-    return _this;
-  }
-  _createClass(Items, [{
-    key: "renderLoader",
-    value: function renderLoader() {
-      var _this$props = this.props,
-        depth = _this$props.depth,
-        items = _this$props.items,
-        loadingLabel = _this$props.loadingLabel;
-      return /*#__PURE__*/React.createElement(LoaderItem, {
-        isCompleting: !!(items && items.length),
-        onComplete: this.handleLoaderComplete,
-        depth: depth + 1,
-        loadingLabel: loadingLabel
-      });
-    }
-  }, {
-    key: "renderItems",
-    value: function renderItems() {
-      var _this$props2 = this.props,
-        render = _this$props2.render,
-        items = _this$props2.items,
-        loadingLabel = _this$props2.loadingLabel,
-        _this$props2$depth = _this$props2.depth,
-        depth = _this$props2$depth === void 0 ? 0 : _this$props2$depth;
-      return items && items.map(function (itemData, index) {
-        return /*#__PURE__*/React.createElement(Item, {
-          data: itemData,
-          depth: depth + 1,
-          key: itemData && itemData.id || index,
-          render: render,
-          loadingLabel: loadingLabel
-        });
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var isLoaderShown = this.state.isLoaderShown;
-      return isLoaderShown ? this.renderLoader() : this.renderItems();
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(nextProps, prevState) {
-      if (!nextProps.items && !prevState.isLoaderShown) {
-        return {
-          isLoaderShown: true
-        };
-      }
-      return null;
-    }
-  }]);
-  return Items;
-}(Component);
-_defineProperty(Items, "defaultProps", {
-  depth: 0
-});
-export { Items as default };
+  }));
+}
+
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
+export default Items;

package/dist/esm/components/internal/loader-item.js

@@ -1,73 +1,38 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 /* eslint-disable react/prop-types */
-import React, { Component } from 'react';
+import React, { useEffect, useState } from 'react';
 import Spinner from '@atlaskit/spinner';
 import CommonCell from './common-cell';
 import { indentBase, LoaderItemContainer, TreeRowContainer } from './styled';
-var LoaderItem = /*#__PURE__*/function (_Component) {
-  _inherits(LoaderItem, _Component);
-  var _super = _createSuper(LoaderItem);
-  function LoaderItem() {
-    var _this;
-    _classCallCheck(this, LoaderItem);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
+var LoaderItem = function LoaderItem(_ref) {
+  var _ref$depth = _ref.depth,
+    depth = _ref$depth === void 0 ? 1 : _ref$depth,
+    loadingLabel = _ref.loadingLabel,
+    isCompleting = _ref.isCompleting,
+    onComplete = _ref.onComplete;
+  var _useState = useState('loading'),
+    _useState2 = _slicedToArray(_useState, 2),
+    phase = _useState2[0],
+    setPhase = _useState2[1];
+  useEffect(function () {
+    if (phase === 'loading' && isCompleting) {
+      setPhase(function () {
+        onComplete();
+        return 'complete';
+      });
     }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "state", {
-      phase: 'loading'
-    });
-    return _this;
-  }
-  _createClass(LoaderItem, [{
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps, prevState) {
-      if (prevState.phase === 'loading' && this.state.phase === 'complete') {
-        if (this.props.onComplete) {
-          this.props.onComplete();
-        }
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-        depth = _this$props.depth,
-        loadingLabel = _this$props.loadingLabel;
-      var phase = this.state.phase;
-      return phase === 'loading' ? /*#__PURE__*/React.createElement(TreeRowContainer, null, /*#__PURE__*/React.createElement(CommonCell, {
-        indent: "calc(".concat(indentBase, " * ").concat(depth, ")"),
-        width: "100%"
-      }, /*#__PURE__*/React.createElement(LoaderItemContainer, {
-        isRoot: depth === 1
-      }, /*#__PURE__*/React.createElement(Spinner, {
-        size: "small",
-        testId: "table-tree-spinner",
-        label: loadingLabel
-      })))) : null;
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(nextProps, prevState) {
-      if (nextProps.isCompleting && prevState.phase === 'loading') {
-        return {
-          phase: 'complete'
-        };
-      }
-      return null;
-    }
-  }]);
-  return LoaderItem;
-}(Component);
-_defineProperty(LoaderItem, "defaultProps", {
-  depth: 1
-});
-export { LoaderItem as default };
+  }, [isCompleting, onComplete, phase]);
+  return phase === 'loading' ? /*#__PURE__*/React.createElement(TreeRowContainer, null, /*#__PURE__*/React.createElement(CommonCell, {
+    indent: "calc(".concat(indentBase, " * ").concat(depth, ")"),
+    width: "100%"
+  }, /*#__PURE__*/React.createElement(LoaderItemContainer, {
+    isRoot: depth === 1
+  }, /*#__PURE__*/React.createElement(Spinner, {
+    size: "small",
+    testId: "table-tree-spinner",
+    label: loadingLabel
+  })))) : null;
+};
+
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
+export default LoaderItem;

package/dist/esm/components/internal/with-column-width.js

@@ -19,10 +19,8 @@ export default function withColumnWidth(Cell) {
     var columnWidth;
     if (width !== null && width !== undefined) {
       columnWidth = width;
-    } else {
-      if (columnIndex !== undefined) {
-        columnWidth = getColumnWidth(columnIndex);
-      }
+    } else if (columnIndex !== undefined) {
+      columnWidth = getColumnWidth(columnIndex);
     }
     return /*#__PURE__*/React.createElement(Cell, _extends({
       width: columnWidth