@jobber/components 6.26.0 → 6.26.2

package/dist/ComboboxContentHeader-es.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { T as Typography } from './Typography-es.js';
 import { B as Button } from './Button-es.js';
 import 'classnames';
@@ -11,9 +11,9 @@ function ComboboxContentHeader(props) {
     const label = getLabel(hasSelected, props.selectedCount, props.subjectNoun);
     const handleSelectAll = hasSelected ? props.onClearAll : props.onSelectAll;
     const showAction = hasSelected || props.hasOptionsVisible;
-    return (React.createElement("div", { className: styles.header, "data-testid": "ATL-Combobox-Header" },
-        React.createElement(Typography, { textColor: "heading", fontWeight: "semiBold" }, label),
-        showAction && (React.createElement(Button, { size: "small", label: actionLabel, type: "tertiary", onClick: handleSelectAll }))));
+    return (React__default.createElement("div", { className: styles.header, "data-testid": "ATL-Combobox-Header" },
+        React__default.createElement(Typography, { textColor: "heading", fontWeight: "semiBold" }, label),
+        showAction && (React__default.createElement(Button, { size: "small", label: actionLabel, type: "tertiary", onClick: handleSelectAll }))));
 }
 function getLabel(hasSelected, count, subjectNoun) {
     if (hasSelected) {

package/dist/ComboboxContentList-es.js

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React__default, { useState, useEffect } from 'react';
 import classnames from 'classnames';
 import { T as Text } from './Text-es.js';
 import { G as Glimmer } from './Glimmer-es.js';
@@ -13,22 +13,22 @@ function ComboboxContentList(props) {
     const optionsExist = props.options.length > 0;
     const hasSearchTerm = props.searchValue.length > 0;
     const { listScrollState } = useScrollState(props.optionsListRef, props.options);
-    return (React.createElement("div", { className: classnames(styles.container, styles[listScrollState]) },
-        optionsExist && (React.createElement("ul", { className: styles.optionsList, role: "listbox", "aria-multiselectable": props.multiselect, ref: props.optionsListRef },
+    return (React__default.createElement("div", { className: classnames(styles.container, styles[listScrollState]) },
+        optionsExist && (React__default.createElement("ul", { className: styles.optionsList, role: "listbox", "aria-multiselectable": props.multiselect, ref: props.optionsListRef },
             props.options.map(option => {
-                return (React.createElement(ComboboxOption, { key: option.id, id: option.id, label: option.label, prefix: option.prefix, customRender: option.customRender }));
+                return (React__default.createElement(ComboboxOption, { key: option.id, id: option.id, label: option.label, prefix: option.prefix, customRender: option.customRender }));
             }),
-            React.createElement("div", { className: classnames([styles.loadingContainer, styles.hasOptions]) },
-                React.createElement(AnimatedPresence, { transition: "fromBottom" }, Boolean(props.loading && optionsExist) && (React.createElement(Spinner, { size: "small" })))),
-            props.onLoadMore && (React.createElement(ComboboxLoadMore, { onLoadMore: props.onLoadMore })))),
-        props.loading && !optionsExist && (React.createElement(React.Fragment, null, Array.from({ length: 5 }).map((_, index) => (React.createElement("div", { className: styles.loadingContainer, key: index },
-            React.createElement(Glimmer, { shape: "rectangle", size: "small" })))))),
-        hasSearchTerm && !props.loading && !optionsExist && (React.createElement("div", { className: styles.filterMessage },
-            React.createElement(Text, { variation: "subdued" },
+            React__default.createElement("div", { className: classnames([styles.loadingContainer, styles.hasOptions]) },
+                React__default.createElement(AnimatedPresence, { transition: "fromBottom" }, Boolean(props.loading && optionsExist) && (React__default.createElement(Spinner, { size: "small" })))),
+            props.onLoadMore && (React__default.createElement(ComboboxLoadMore, { onLoadMore: props.onLoadMore })))),
+        props.loading && !optionsExist && (React__default.createElement(React__default.Fragment, null, Array.from({ length: 5 }).map((_, index) => (React__default.createElement("div", { className: styles.loadingContainer, key: index },
+            React__default.createElement(Glimmer, { shape: "rectangle", size: "small" })))))),
+        hasSearchTerm && !props.loading && !optionsExist && (React__default.createElement("div", { className: styles.filterMessage },
+            React__default.createElement(Text, { variation: "subdued" },
                 "No results for ",
                 `“${props.searchValue}”`))),
-        !hasSearchTerm && !props.loading && !optionsExist && (React.createElement("div", { className: styles.emptyStateMessage },
-            React.createElement(Text, { variation: "subdued" }, getZeroIndexStateText(props.subjectNoun))))));
+        !hasSearchTerm && !props.loading && !optionsExist && (React__default.createElement("div", { className: styles.emptyStateMessage },
+            React__default.createElement(Text, { variation: "subdued" }, getZeroIndexStateText(props.subjectNoun))))));
 }
 function getZeroIndexStateText(subjectNoun) {
     if (subjectNoun) {

package/dist/ComboboxContentSearch-es.js

@@ -1,4 +1,4 @@
-import React, { useRef, useEffect } from 'react';
+import React__default, { useRef, useEffect } from 'react';
 import { I as Icon } from './Icon-es.js';
 
 var styles = {"search":"c4B0WFX6K0o-","searchInput":"AH9-zRHXfpo-","clearSearch":"mymN3p8sKRw-","spinning":"hMjmTEgj6WU-"};
@@ -13,10 +13,10 @@ function ComboboxContentSearch(props) {
             }, 0);
         }
     }, [props.open]);
-    return (React.createElement("div", { className: styles.search },
-        React.createElement("input", { type: "search", ref: searchRef, className: styles.searchInput, placeholder: props.placeholder ? `Search ${props.placeholder}` : "Search", onChange: (event) => handleSearch(event), value: props.searchValue }),
-        props.searchValue && (React.createElement("button", { className: styles.clearSearch, onClick: clearSearch, type: "button", "data-testid": "ATL-Combobox-Content-Search-Clear", "aria-label": "Clear search" },
-            React.createElement(Icon, { name: "remove", size: "small" })))));
+    return (React__default.createElement("div", { className: styles.search },
+        React__default.createElement("input", { type: "search", ref: searchRef, className: styles.searchInput, placeholder: props.placeholder ? `Search ${props.placeholder}` : "Search", onChange: (event) => handleSearch(event), value: props.searchValue }),
+        props.searchValue && (React__default.createElement("button", { className: styles.clearSearch, onClick: clearSearch, type: "button", "data-testid": "ATL-Combobox-Content-Search-Clear", "aria-label": "Clear search" },
+            React__default.createElement(Icon, { name: "remove", size: "small" })))));
     function clearSearch() {
         var _a;
         props.setSearchValue("");

package/dist/ComboboxLoadMore-es.js

@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import React__default, { useEffect } from 'react';
 import { u as useInView_2 } from './useInView-es.js';
 
 var styles = {"trigger":"jPB--ZCYNNI-","spinning":"aW61BrnGmcw-"};
@@ -8,7 +8,7 @@ function ComboboxLoadMore({ onLoadMore }) {
     useEffect(() => {
         isInView && onLoadMore();
     }, [isInView]);
-    return (React.createElement("div", { "data-testid": "ATL-Combobox-Loadmore-Trigger", ref: inViewRef, className: styles.trigger }));
+    return (React__default.createElement("div", { "data-testid": "ATL-Combobox-Loadmore-Trigger", ref: inViewRef, className: styles.trigger }));
 }
 
 export { ComboboxLoadMore as C };

package/dist/ComboboxOption-es.js

@@ -1,5 +1,5 @@
 import { _ as __rest } from './tslib.es6-es.js';
-import React, { useContext } from 'react';
+import React__default, { useContext } from 'react';
 import classnames from 'classnames';
 import { I as Icon } from './Icon-es.js';
 import { F as Flex } from './Flex-es.js';
@@ -11,15 +11,15 @@ function ComboboxOption(props) {
     const { customRender } = props, contentProps = __rest(props, ["customRender"]);
     const { selected, selectionHandler } = useContext(ComboboxContext);
     const isSelected = selected.some(selection => selection.id.toString() === props.id.toString());
-    return (React.createElement("li", { key: props.id, tabIndex: -1, "data-selected": isSelected, role: "option", "aria-selected": isSelected, onClick: () => selectionHandler &&
-            selectionHandler({ id: props.id, label: props.label }), className: classnames(styles.option) }, customRender ? (customRender(Object.assign(Object.assign({}, contentProps), { isSelected }))) : (React.createElement(InternalDefaultContent, Object.assign({}, contentProps, { isSelected: isSelected })))));
+    return (React__default.createElement("li", { key: props.id, tabIndex: -1, "data-selected": isSelected, role: "option", "aria-selected": isSelected, onClick: () => selectionHandler &&
+            selectionHandler({ id: props.id, label: props.label }), className: classnames(styles.option) }, customRender ? (customRender(Object.assign(Object.assign({}, contentProps), { isSelected }))) : (React__default.createElement(InternalDefaultContent, Object.assign({}, contentProps, { isSelected: isSelected })))));
 }
 function InternalDefaultContent(props) {
-    return (React.createElement(React.Fragment, null,
-        React.createElement(Flex, { template: props.prefix ? ["shrink", "grow"] : ["grow"] },
+    return (React__default.createElement(React__default.Fragment, null,
+        React__default.createElement(Flex, { template: props.prefix ? ["shrink", "grow"] : ["grow"] },
             props.prefix,
             props.label),
-        React.createElement("div", null, props.isSelected && (React.createElement(Icon, { name: "checkmark", color: "interactiveSubtle" })))));
+        React__default.createElement("div", null, props.isSelected && (React__default.createElement(Icon, { name: "checkmark", color: "interactiveSubtle" })))));
 }
 
 export { ComboboxOption as C };

package/dist/ComboboxProvider-es.js

@@ -1,10 +1,10 @@
 import { _ as __rest } from './tslib.es6-es.js';
-import React from 'react';
+import React__default from 'react';
 
-const ComboboxContext = React.createContext({});
+const ComboboxContext = React__default.createContext({});
 function ComboboxContextProvider(_a) {
     var { children } = _a, props = __rest(_a, ["children"]);
-    return (React.createElement(ComboboxContext.Provider, { value: props }, children));
+    return (React__default.createElement(ComboboxContext.Provider, { value: props }, children));
 }
 
 export { ComboboxContextProvider as C, ComboboxContext as a };

package/dist/ComboboxTrigger-es.js

@@ -1,15 +1,15 @@
-import React from 'react';
+import React__default from 'react';
 import { C as Chip } from './Chip-es.js';
 import './tslib.es6-es.js';
 import { I as Icon } from './Icon-es.js';
 import { a as ComboboxContext } from './ComboboxProvider-es.js';
 
 function ComboboxTrigger({ label = "Select", selected, }) {
-    const { handleOpen } = React.useContext(ComboboxContext);
+    const { handleOpen } = React__default.useContext(ComboboxContext);
     const hasSelection = selected.length;
     const selectedLabel = selected.map(option => option.label).join(", ");
-    return (React.createElement(Chip, { variation: hasSelection ? "base" : "subtle", label: hasSelection ? selectedLabel : "", ariaLabel: label, heading: label, onClick: handleOpen, role: "combobox" }, !hasSelection && (React.createElement(Chip.Suffix, null,
-        React.createElement(Icon, { name: "add", size: "small" })))));
+    return (React__default.createElement(Chip, { variation: hasSelection ? "base" : "subtle", label: hasSelection ? selectedLabel : "", ariaLabel: label, heading: label, onClick: handleOpen, role: "combobox" }, !hasSelection && (React__default.createElement(Chip.Suffix, null,
+        React__default.createElement(Icon, { name: "add", size: "small" })))));
 }
 
 export { ComboboxTrigger as C };

package/dist/ConfirmationModal-es.js

@@ -1,4 +1,4 @@
-import React, { forwardRef, useReducer, useImperativeHandle, useEffect } from 'react';
+import React__default, { forwardRef, useReducer, useImperativeHandle, useEffect } from 'react';
 import { u as useOnKeyDown_2 } from './useOnKeyDown-es.js';
 import { M as Modal } from './Modal-es.js';
 import { C as Content } from './Content-es.js';
@@ -52,15 +52,15 @@ const ConfirmationModal = forwardRef(function ConfirmationModalInternal({ title,
         });
     }, [title, message, confirmLabel, cancelLabel, onConfirm, onCancel]);
     useOnKeyDown_2(handleKeyboardShortcut, ["Escape", "Enter"]);
-    return (React.createElement(Modal, { title: state.title, open: open || state.open, size: size, dismissible: false, primaryAction: {
+    return (React__default.createElement(Modal, { title: state.title, open: open || state.open, size: size, dismissible: false, primaryAction: {
             label: state.confirmLabel,
             onClick: handleAction("confirm"),
             variation: variation === "destructive" ? "destructive" : "work",
         }, secondaryAction: {
             label: state.cancelLabel,
             onClick: handleAction("cancel"),
-        } }, state.message ? (React.createElement(Content, null,
-        React.createElement(Markdown, { content: state.message }))) : (children)));
+        } }, state.message ? (React__default.createElement(Content, null,
+        React__default.createElement(Markdown, { content: state.message }))) : (children)));
     function handleAction(type) {
         return () => {
             var _a, _b;

package/dist/Countdown-es.js

@@ -1,4 +1,4 @@
-import React, { cloneElement, Component, createRef, createElement, useMemo } from 'react';
+import React__default, { cloneElement, Component, createRef, createElement, useMemo } from 'react';
 import { p as propTypesExports } from './index-es.js';
 
 function _classCallCheck(instance, Constructor) {
@@ -604,11 +604,11 @@ function Countdown({ date: inputDate, onComplete, showUnits, granularity = "dhms
         const initDate = new Date(inputDate);
         return initDate;
     }, [inputDate]);
-    return (React.createElement(Countdown$1$1, { date: date, zeroPadTime: 2, renderer: (props) => (React.createElement(RenderedCountdown, Object.assign({}, props, { granularity: granularity, showUnits: showUnits }))), onComplete: onComplete }));
+    return (React__default.createElement(Countdown$1$1, { date: date, zeroPadTime: 2, renderer: (props) => (React__default.createElement(RenderedCountdown, Object.assign({}, props, { granularity: granularity, showUnits: showUnits }))), onComplete: onComplete }));
 }
 function RenderedCountdown({ formatted, granularity = "dhms", showUnits, }) {
     const { days, hours, minutes, seconds } = formatted;
-    return React.createElement(React.Fragment, null, buildTime());
+    return React__default.createElement(React__default.Fragment, null, buildTime());
     function buildTime() {
         const totalHours = 24 * Number(days) + Number(hours);
         const totalMinutes = 60 * totalHours + Number(minutes);

package/dist/DataDump-es.js

@@ -1,15 +1,15 @@
-import React from 'react';
+import React__default from 'react';
 import { C as Card } from './Card-es.js';
 import { C as Content } from './Content-es.js';
 import { E as Emphasis } from './Emphasis-es.js';
 
 function DataDump({ label = "Raw Data", defaultOpen = false, data, }) {
-    return (React.createElement(Card, { accent: "yellow" },
-        React.createElement(Content, null,
-            React.createElement("details", { open: defaultOpen },
-                React.createElement("summary", null,
-                    React.createElement(Emphasis, { variation: "bold" }, label)),
-                React.createElement("pre", null, JSON.stringify(data, undefined, 2))))));
+    return (React__default.createElement(Card, { accent: "yellow" },
+        React__default.createElement(Content, null,
+            React__default.createElement("details", { open: defaultOpen },
+                React__default.createElement("summary", null,
+                    React__default.createElement(Emphasis, { variation: "bold" }, label)),
+                React__default.createElement("pre", null, JSON.stringify(data, undefined, 2))))));
 }
 
 export { DataDump as D };

package/dist/DataList/components/DataListFilters/components/DataListSort/index.cjs

@@ -31,8 +31,6 @@ require('../../../../../Button-cjs.js');
 require('react-router-dom');
 require('../../../../../useRefocusOnActivator-cjs.js');
 require('../../../../../useFocusTrap-cjs.js');
-require('react-popper');
-require('../../../../../useOnKeyDown-cjs.js');
 require('../../../../../constants-cjs.js');
 require('../../../../../ComboboxAction-cjs.js');
 require('../../../../../ComboboxTrigger-cjs.js');
@@ -43,6 +41,7 @@ require('../../../../../useChildComponent-cjs.js');
 require('../../../../../Tooltip-cjs.js');
 require('../../../../../useSafeLayoutEffect-cjs.js');
 require('../../../../../useIsMounted-cjs.js');
+require('react-popper');
 require('../../../../../debounce-cjs.js');
 require('../../../../../isObjectLike-cjs.js');
 require('../../../../../isSymbol-cjs.js');

package/dist/DataList/components/DataListFilters/components/DataListSort/index.mjs

@@ -29,8 +29,6 @@ import '../../../../../Button-es.js';
 import 'react-router-dom';
 import '../../../../../useRefocusOnActivator-es.js';
 import '../../../../../useFocusTrap-es.js';
-import 'react-popper';
-import '../../../../../useOnKeyDown-es.js';
 import '../../../../../constants-es.js';
 import '../../../../../ComboboxAction-es.js';
 import '../../../../../ComboboxTrigger-es.js';
@@ -41,6 +39,7 @@ import '../../../../../useChildComponent-es.js';
 import '../../../../../Tooltip-es.js';
 import '../../../../../useSafeLayoutEffect-es.js';
 import '../../../../../useIsMounted-es.js';
+import 'react-popper';
 import '../../../../../debounce-es.js';
 import '../../../../../isObjectLike-es.js';
 import '../../../../../isSymbol-es.js';

package/dist/DataList/components/DataListFilters/index.cjs

@@ -32,8 +32,6 @@ require('../../../Button-cjs.js');
 require('react-router-dom');
 require('../../../useRefocusOnActivator-cjs.js');
 require('../../../useFocusTrap-cjs.js');
-require('react-popper');
-require('../../../useOnKeyDown-cjs.js');
 require('../../../constants-cjs.js');
 require('../../../ComboboxAction-cjs.js');
 require('../../../ComboboxTrigger-cjs.js');
@@ -44,6 +42,7 @@ require('../../../useChildComponent-cjs.js');
 require('../../../Tooltip-cjs.js');
 require('../../../useSafeLayoutEffect-cjs.js');
 require('../../../useIsMounted-cjs.js');
+require('react-popper');
 require('../../../debounce-cjs.js');
 require('../../../isObjectLike-cjs.js');
 require('../../../isSymbol-cjs.js');
@@ -59,6 +58,7 @@ require('../../../DataListTags-cjs.js');
 require('../../../InlineLabel-cjs.js');
 require('../../../DataListHeaderTile-cjs.js');
 require('../../../DataListSortingOptions-cjs.js');
+require('../../../useOnKeyDown-cjs.js');
 require('../../../FormatDate-cjs.js');
 require('../../../Heading-cjs.js');
 require('../../../useResponsiveSizing-cjs.js');

package/dist/DataList/components/DataListFilters/index.mjs

@@ -30,8 +30,6 @@ import '../../../Button-es.js';
 import 'react-router-dom';
 import '../../../useRefocusOnActivator-es.js';
 import '../../../useFocusTrap-es.js';
-import 'react-popper';
-import '../../../useOnKeyDown-es.js';
 import '../../../constants-es.js';
 import '../../../ComboboxAction-es.js';
 import '../../../ComboboxTrigger-es.js';
@@ -42,6 +40,7 @@ import '../../../useChildComponent-es.js';
 import '../../../Tooltip-es.js';
 import '../../../useSafeLayoutEffect-es.js';
 import '../../../useIsMounted-es.js';
+import 'react-popper';
 import '../../../debounce-es.js';
 import '../../../isObjectLike-es.js';
 import '../../../isSymbol-es.js';
@@ -57,6 +56,7 @@ import '../../../DataListTags-es.js';
 import '../../../InlineLabel-es.js';
 import '../../../DataListHeaderTile-es.js';
 import '../../../DataListSortingOptions-es.js';
+import '../../../useOnKeyDown-es.js';
 import '../../../FormatDate-es.js';
 import '../../../Heading-es.js';
 import '../../../useResponsiveSizing-es.js';

package/dist/DataList-es.js

@@ -1,5 +1,5 @@
 import { _ as __rest } from './tslib.es6-es.js';
-import React, { useState, useMemo, useRef } from 'react';
+import React__default, { useState, useMemo, useRef } from 'react';
 import { s as styles } from './DataList.module-es.js';
 import { a as DataListTotalCount } from './DataListTotalCount-es.js';
 import { a as DataListLoadingState } from './DataListLoadingState-es.js';
@@ -33,7 +33,7 @@ function DataList(_a) {
     const bulkActionsComponent = getCompoundComponent(props.children, DataListBulkActions);
     const headerCount = Object.keys(props.headers).length;
     const shouldRenderStickyHeader = !!filterComponent || !!searchComponent || headerCount > 0;
-    return (React.createElement(DataListContext.Provider, { value: Object.assign(Object.assign({ searchComponent,
+    return (React__default.createElement(DataListContext.Provider, { value: Object.assign(Object.assign({ searchComponent,
             filterComponent,
             layoutComponents,
             emptyStateComponents,
@@ -44,7 +44,7 @@ function DataList(_a) {
             registerLayout }, props), { selected, 
             // T !== DataListObject
             sorting: sorting }) },
-        React.createElement(InternalDataList, { shouldRenderStickyHeader: shouldRenderStickyHeader })));
+        React__default.createElement(InternalDataList, { shouldRenderStickyHeader: shouldRenderStickyHeader })));
     function registerLayout(size, children) {
         setLayouts(prev => (Object.assign(Object.assign({}, prev), { [size]: children })));
     }
@@ -56,24 +56,24 @@ function InternalDataList({ shouldRenderStickyHeader, }) {
     const showEmptyState = !initialLoading && data.length === 0;
     const shouldRenderLoadMoreTrigger = !initialLoading && !showEmptyState;
     const shouldRenderTitleContainer = initialLoading || title !== undefined || totalCount !== undefined;
-    return (React.createElement("div", { className: styles.wrapper },
-        shouldRenderTitleContainer && (React.createElement("div", { className: styles.titleContainer, "data-testid": DATA_LIST_TITLE_CONTAINER_TEST_ID },
-            title && React.createElement(Heading, { level: 3 }, title),
-            totalCount !== undefined && (React.createElement(DataListTotalCount, { totalCount: totalCount, loading: initialLoading })))),
-        React.createElement("div", { ref: backToTopRef }),
-        shouldRenderStickyHeader && (React.createElement(DataListStickyHeader, null,
-            React.createElement("div", { className: styles.headerFilters },
-                React.createElement(InternalDataListFilters, null),
-                React.createElement(InternalDataListSearch, null)),
-            React.createElement(InternalDataListStatusBar, null),
-            React.createElement(DataListHeader, null))),
-        initialLoading && React.createElement(DataListLoadingState, null),
-        showEmptyState && React.createElement(InternalDataListEmptyState, null),
+    return (React__default.createElement("div", { className: styles.wrapper },
+        shouldRenderTitleContainer && (React__default.createElement("div", { className: styles.titleContainer, "data-testid": DATA_LIST_TITLE_CONTAINER_TEST_ID },
+            title && React__default.createElement(Heading, { level: 3 }, title),
+            totalCount !== undefined && (React__default.createElement(DataListTotalCount, { totalCount: totalCount, loading: initialLoading })))),
+        React__default.createElement("div", { ref: backToTopRef }),
+        shouldRenderStickyHeader && (React__default.createElement(DataListStickyHeader, null,
+            React__default.createElement("div", { className: styles.headerFilters },
+                React__default.createElement(InternalDataListFilters, null),
+                React__default.createElement(InternalDataListSearch, null)),
+            React__default.createElement(InternalDataListStatusBar, null),
+            React__default.createElement(DataListHeader, null))),
+        initialLoading && React__default.createElement(DataListLoadingState, null),
+        showEmptyState && React__default.createElement(InternalDataListEmptyState, null),
         layoutComponents,
-        loadingState === "filtering" && (React.createElement("div", { "data-testid": DATA_LIST_FILTERING_SPINNER_TEST_ID, className: styles.filtering },
-            React.createElement("div", { className: styles.filteringSpinner },
-                React.createElement(Spinner, { size: "small" })))),
-        shouldRenderLoadMoreTrigger && (React.createElement(DataListLoadMore, { onBackToTop: handleBackToTop }))));
+        loadingState === "filtering" && (React__default.createElement("div", { "data-testid": DATA_LIST_FILTERING_SPINNER_TEST_ID, className: styles.filtering },
+            React__default.createElement("div", { className: styles.filteringSpinner },
+                React__default.createElement(Spinner, { size: "small" })))),
+        shouldRenderLoadMoreTrigger && (React__default.createElement(DataListLoadMore, { onBackToTop: handleBackToTop }))));
     function handleBackToTop() {
         var _a;
         // For testing purposes since jest doesn't know scrollIntoView.
@@ -130,7 +130,7 @@ DataList.BatchActions = DataListBulkActions;
  * DataListBatchActions component.
  */
 DataList.BatchAction = function DataListBatchAction(props) {
-    return React.createElement(DataListAction, Object.assign({}, props));
+    return React__default.createElement(DataListAction, Object.assign({}, props));
 };
 /**
  * Defines a status bar that is rendered between the filters and the header.

package/dist/DataList.utils-es.js

@@ -1,4 +1,4 @@
-import React, { Children, isValidElement } from 'react';
+import React__default, { Children, isValidElement } from 'react';
 import { g as getDefaultExportFromCjs } from './_commonjsHelpers-es.js';
 import { _ as _baseKeys, a as _getTag } from './_getTag-es.js';
 import { i as isArguments_1, a as isArray_1, b as isArrayLike_1, c as isBufferExports, _ as _isPrototype, d as isTypedArray_1 } from './isTypedArray-es.js';
@@ -116,20 +116,20 @@ function generateListItemElement(item) {
             return acc;
         }
         if (key === "tags" && Array.isArray(currentItem)) {
-            acc[key] = React.createElement(DataListTags, { items: currentItem });
+            acc[key] = React__default.createElement(DataListTags, { items: currentItem });
         }
         else if (key === "label" && typeof currentItem === "string") {
-            acc[key] = React.createElement(Heading, { level: 5 }, currentItem);
+            acc[key] = React__default.createElement(Heading, { level: 5 }, currentItem);
         }
         else if (isValidElement(currentItem)) {
             acc[key] = currentItem;
         }
         else if (currentItem instanceof Date) {
-            acc[key] = (React.createElement(Text, null,
-                React.createElement(FormatDate, { date: currentItem })));
+            acc[key] = (React__default.createElement(Text, null,
+                React__default.createElement(FormatDate, { date: currentItem })));
         }
         else {
-            acc[key] = React.createElement(Text, null, currentItem);
+            acc[key] = React__default.createElement(Text, null, currentItem);
         }
         return acc;
     }, {});
@@ -138,7 +138,7 @@ function generateListItemElement(item) {
  * Generate the header elements with the default styling
  */
 function generateHeaderElements(headers) {
-    const headerElements = Object.keys(headers).reduce((acc, key) => (Object.assign(Object.assign({}, acc), { [key]: React.createElement(DataListHeaderTile, { headers: headers, headerKey: key }) })), {});
+    const headerElements = Object.keys(headers).reduce((acc, key) => (Object.assign(Object.assign({}, acc), { [key]: React__default.createElement(DataListHeaderTile, { headers: headers, headerKey: key }) })), {});
     return isEmpty$1(headerElements) ? undefined : headerElements;
 }
 function sortBreakpoints(sizeProp) {

package/dist/DataListAction-es.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { T as Typography } from './Typography-es.js';
 import { I as Icon } from './Icon-es.js';
 import { u as useDataListLayoutActionsContext } from './DataListLayoutContext-es2.js';
@@ -21,15 +21,15 @@ function DataListAction({ label, icon, destructive, visible = () => true, onClic
         }
     }
     if (actionUrl) {
-        return (React.createElement("a", { href: actionUrl, rel: "noopener noreferrer", className: `${styles.action} ${styles.actionUrl}`, onClick: handleClick },
-            React.createElement(Typography, { textColor: color },
-                React.createElement("span", { className: styles.label }, getActionLabel())),
-            icon && React.createElement(Icon, { name: icon, color: color })));
+        return (React__default.createElement("a", { href: actionUrl, rel: "noopener noreferrer", className: `${styles.action} ${styles.actionUrl}`, onClick: handleClick },
+            React__default.createElement(Typography, { textColor: color },
+                React__default.createElement("span", { className: styles.label }, getActionLabel())),
+            icon && React__default.createElement(Icon, { name: icon, color: color })));
     }
-    return (React.createElement("button", { type: "button", className: styles.action, onClick: handleClick },
-        React.createElement(Typography, { textColor: color },
-            React.createElement("span", { className: styles.label }, getActionLabel())),
-        icon && React.createElement(Icon, { name: icon, color: color })));
+    return (React__default.createElement("button", { type: "button", className: styles.action, onClick: handleClick },
+        React__default.createElement(Typography, { textColor: color },
+            React__default.createElement("span", { className: styles.label }, getActionLabel())),
+        icon && React__default.createElement(Icon, { name: icon, color: color })));
     function handleClick() {
         if (activeItem) {
             onClick === null || onClick === void 0 ? void 0 : onClick(activeItem);

package/dist/DataListActions-es.js

@@ -1,4 +1,4 @@
-import React, { Children, isValidElement } from 'react';
+import React__default, { Children, isValidElement } from 'react';
 import { T as Tooltip } from './Tooltip-es.js';
 import { B as Button } from './Button-es.js';
 import 'classnames';
@@ -11,7 +11,7 @@ function DataListActions({ children, itemsToExpose = 2, }) {
     const childrenArray = Children.toArray(children).filter(isValidElement);
     const exposedActions = getExposedActions(childrenArray, itemsToExpose);
     childrenArray.splice(0, exposedActions.length);
-    return (React.createElement(React.Fragment, null,
+    return (React__default.createElement(React__default.Fragment, null,
         exposedActions.map(({ props }) => {
             const isVisible = props.visible ? props.visible(activeItem) : true;
             const hasIconOrAlwaysVisible = props.icon || props.alwaysVisible;
@@ -29,13 +29,13 @@ function DataListActions({ children, itemsToExpose = 2, }) {
             const actionLabel = getActionLabel();
             // If the action is always visible, we don't want a tooltip.
             if (props.alwaysVisible) {
-                return (React.createElement(Button, { ariaLabel: actionLabel, key: props.label, icon: props.icon, label: actionLabel, onClick: () => {
+                return (React__default.createElement(Button, { ariaLabel: actionLabel, key: props.label, icon: props.icon, label: actionLabel, onClick: () => {
                         var _a;
                         (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, activeItem);
                     }, type: "secondary", variation: "subtle" }));
             }
-            return (React.createElement(Tooltip, { key: actionLabel, message: actionLabel },
-                React.createElement(Button, { icon: props.icon, ariaLabel: actionLabel, onClick: () => {
+            return (React__default.createElement(Tooltip, { key: actionLabel, message: actionLabel },
+                React__default.createElement(Button, { icon: props.icon, ariaLabel: actionLabel, onClick: () => {
                         var _a, _b;
                         if (activeItem) {
                             (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, activeItem);
@@ -45,7 +45,7 @@ function DataListActions({ children, itemsToExpose = 2, }) {
                         }
                     }, type: "tertiary", variation: "subtle" })));
         }),
-        React.createElement(DataListItemActionsOverflow, { actions: childrenArray })));
+        React__default.createElement(DataListItemActionsOverflow, { actions: childrenArray })));
 }
 
 export { DataListActions as D };

package/dist/DataListActionsMenu-es.js

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React__default, { useState } from 'react';
 import { AnimatePresence, motion } from 'framer-motion';
 import { u as useFocusTrap_2 } from './useFocusTrap-es.js';
 import { u as useRefocusOnActivator_2 } from './useRefocusOnActivator-es.js';
@@ -20,9 +20,9 @@ function DataListActionsMenu({ visible = false, position, onRequestClose, childr
     useRefocusOnActivator_2(visible);
     const focusTrapRef = useFocusTrap_2(visible);
     useOnKeyDown_2(onRequestClose, "Escape");
-    const actionsMenu = (React.createElement(AnimatePresence, null, visible && (React.createElement("div", { ref: focusTrapRef, onClick: handleClick },
-        React.createElement(motion.div, { role: "menu", "data-elevation": "elevated", ref: setRef, variants: variants, initial: "hidden", animate: "visible", exit: "hidden", transition: { duration: TRANSITION_DELAY_IN_SECONDS }, className: styles.menu, style: getPositionCssVars(), onClick: onRequestClose }, children),
-        React.createElement("button", { type: "button", className: styles.overlay, onClick: onRequestClose, "aria-label": "Close menu" })))));
+    const actionsMenu = (React__default.createElement(AnimatePresence, null, visible && (React__default.createElement("div", { ref: focusTrapRef, onClick: handleClick },
+        React__default.createElement(motion.div, { role: "menu", "data-elevation": "elevated", ref: setRef, variants: variants, initial: "hidden", animate: "visible", exit: "hidden", transition: { duration: TRANSITION_DELAY_IN_SECONDS }, className: styles.menu, style: getPositionCssVars(), onClick: onRequestClose }, children),
+        React__default.createElement("button", { type: "button", className: styles.overlay, onClick: onRequestClose, "aria-label": "Close menu" })))));
     return mounted.current
         ? createPortal(actionsMenu, document.body)
         : actionsMenu;

package/dist/DataListBulkActions-es.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { u as useDataListContext } from './DataListContext-es.js';
 import { D as DataListActions } from './DataListActions-es.js';
 import { u as useResponsiveSizing } from './useResponsiveSizing-es.js';
@@ -21,8 +21,8 @@ function InternalDataListBulkActions() {
     const { sm } = useResponsiveSizing();
     // Collapse all actions under "More actions" when breakpoint is smaller than sm
     const itemsToExpose = sm ? 3 : 0;
-    return (React.createElement("div", { "data-testid": BULK_ACTIONS_CONTAINER_TEST_ID, className: styles.bulkActions },
-        React.createElement(DataListActions, { itemsToExpose: itemsToExpose }, children)));
+    return (React__default.createElement("div", { "data-testid": BULK_ACTIONS_CONTAINER_TEST_ID, className: styles.bulkActions },
+        React__default.createElement(DataListActions, { itemsToExpose: itemsToExpose }, children)));
 }
 
 export { DataListBulkActions as D, InternalDataListBulkActions as I };

package/dist/DataListContext-es.js

@@ -1,4 +1,4 @@
-import React, { createContext, useContext } from 'react';
+import React__default, { createContext, useContext } from 'react';
 import { n as noop } from './noop-es.js';
 
 const defaultValues = {
@@ -9,11 +9,11 @@ const defaultValues = {
     selected: [],
     layoutBreakpoints: [],
     layouts: {
-        xs: children => React.createElement(React.Fragment, null, children),
-        sm: children => React.createElement(React.Fragment, null, children),
-        md: children => React.createElement(React.Fragment, null, children),
-        lg: children => React.createElement(React.Fragment, null, children),
-        xl: children => React.createElement(React.Fragment, null, children),
+        xs: children => React__default.createElement(React__default.Fragment, null, children),
+        sm: children => React__default.createElement(React__default.Fragment, null, children),
+        md: children => React__default.createElement(React__default.Fragment, null, children),
+        lg: children => React__default.createElement(React__default.Fragment, null, children),
+        xl: children => React__default.createElement(React__default.Fragment, null, children),
     },
     registerLayout: noop,
 };

package/dist/DataListEmptyState-es.js

@@ -1,5 +1,5 @@
 import { _ as __rest } from './tslib.es6-es.js';
-import React, { useContext, cloneElement } from 'react';
+import React__default, { useContext, cloneElement } from 'react';
 import { D as DataListContext } from './DataListContext-es.js';
 import { T as Text } from './Text-es.js';
 import { B as Button } from './Button-es.js';
@@ -15,8 +15,8 @@ function DataListEmptyState(_) {
 function InternalDataListEmptyState() {
     const { emptyStateComponents: components, filtered } = useContext(DataListContext);
     const _a = getEmptyStateContent(), { customRender } = _a, contentProps = __rest(_a, ["customRender"]);
-    return (React.createElement("div", { className: styles.emptyStateWrapper }, customRender ? (customRender(Object.assign({}, contentProps))) : (React.createElement(React.Fragment, null,
-        React.createElement(Text, { align: "center" }, contentProps.message),
+    return (React__default.createElement("div", { className: styles.emptyStateWrapper }, customRender ? (customRender(Object.assign({}, contentProps))) : (React__default.createElement(React__default.Fragment, null,
+        React__default.createElement(Text, { align: "center" }, contentProps.message),
         renderButton(contentProps.action)))));
     function getEmptyStateContent() {
         const { defaultEmptyState, filteredEmptyState } = getEmptyStates(components);