@jobber/components 6.10.0 → 6.10.1

package/dist/DataList/DataList.const.d.ts

@@ -16,6 +16,7 @@ export declare const DATA_LIST_FILTERING_SPINNER_TEST_ID = "ATL-DataList-filteri
 export declare const DATA_LIST_LOADING_MORE_SPINNER_TEST_ID = "ATL-DataList-loadingMoreSpinner";
 export declare const DATA_LOAD_MORE_TEST_ID = "ATL-DataList-LoadMore-trigger";
 export declare const DATA_LIST_STICKY_HEADER_TEST_ID = "ATL-DataList-stickyHeader";
+export declare const DATA_LIST_TITLE_CONTAINER_TEST_ID = "ATL-DataList-titleContainer";
 export declare const TRANSITION_DURATION_IN_SECONDS: number;
 export declare const TRANSITION_DELAY_IN_SECONDS: number;
 export {};

package/dist/DataList-cjs.js

@@ -57,10 +57,11 @@ function InternalDataList({ shouldRenderStickyHeader, }) {
     const initialLoading = loadingState === "initial";
     const showEmptyState = !initialLoading && data.length === 0;
     const shouldRenderLoadMoreTrigger = !initialLoading && !showEmptyState;
+    const shouldRenderTitleContainer = initialLoading || title !== undefined || totalCount !== undefined;
     return (React.createElement("div", { className: DataList_module.styles.wrapper },
-        React.createElement("div", { className: DataList_module.styles.titleContainer },
+        shouldRenderTitleContainer && (React.createElement("div", { className: DataList_module.styles.titleContainer, "data-testid": DataList_const.DATA_LIST_TITLE_CONTAINER_TEST_ID },
             title && React.createElement(Heading.Heading, { level: 3 }, title),
-            React.createElement(DataListTotalCount.DataListTotalCount, { totalCount: totalCount, loading: initialLoading })),
+            totalCount !== undefined && (React.createElement(DataListTotalCount.DataListTotalCount, { totalCount: totalCount, loading: initialLoading })))),
         React.createElement("div", { ref: backToTopRef }),
         shouldRenderStickyHeader && (React.createElement(DataListStickyHeader.DataListStickyHeader, null,
             React.createElement("div", { className: DataList_module.styles.headerFilters },

package/dist/DataList-es.js

@@ -15,7 +15,7 @@ import { D as DataListAction } from './DataListAction-es.js';
 import { D as DataListLayoutActions } from './DataListLayoutActions-es.js';
 import { D as DataListContext, u as useDataListContext } from './DataListContext-es.js';
 import { s as sortBreakpoints, g as getCompoundComponent, a as getCompoundComponents } from './DataList.utils-es.js';
-import { D as DATA_LIST_FILTERING_SPINNER_TEST_ID } from './DataList.const-es.js';
+import { D as DATA_LIST_TITLE_CONTAINER_TEST_ID, a as DATA_LIST_FILTERING_SPINNER_TEST_ID } from './DataList.const-es.js';
 import { D as DataListBulkActions } from './DataListBulkActions-es.js';
 import { I as InternalDataListStatusBar, D as DataListStatusBar } from './DataListStatusBar-es.js';
 import { H as Heading } from './Heading-es.js';
@@ -55,10 +55,11 @@ function InternalDataList({ shouldRenderStickyHeader, }) {
     const initialLoading = loadingState === "initial";
     const showEmptyState = !initialLoading && data.length === 0;
     const shouldRenderLoadMoreTrigger = !initialLoading && !showEmptyState;
+    const shouldRenderTitleContainer = initialLoading || title !== undefined || totalCount !== undefined;
     return (React.createElement("div", { className: styles.wrapper },
-        React.createElement("div", { className: styles.titleContainer },
+        shouldRenderTitleContainer && (React.createElement("div", { className: styles.titleContainer, "data-testid": DATA_LIST_TITLE_CONTAINER_TEST_ID },
             title && React.createElement(Heading, { level: 3 }, title),
-            React.createElement(DataListTotalCount, { totalCount: totalCount, loading: initialLoading })),
+            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 },

package/dist/DataList.const-cjs.js

@@ -21,6 +21,7 @@ const DATA_LIST_FILTERING_SPINNER_TEST_ID = "ATL-DataList-filteringSpinner";
 const DATA_LIST_LOADING_MORE_SPINNER_TEST_ID = "ATL-DataList-loadingMoreSpinner";
 const DATA_LOAD_MORE_TEST_ID = "ATL-DataList-LoadMore-trigger";
 const DATA_LIST_STICKY_HEADER_TEST_ID = "ATL-DataList-stickyHeader";
+const DATA_LIST_TITLE_CONTAINER_TEST_ID = "ATL-DataList-titleContainer";
 const TRANSITION_DURATION_IN_SECONDS = design.tokens["timing-base"] / 1000;
 const TRANSITION_DELAY_IN_SECONDS = design.tokens["timing-quick"] / 1000;
 
@@ -29,6 +30,7 @@ exports.BREAKPOINT_SIZES = BREAKPOINT_SIZES;
 exports.DATA_LIST_FILTERING_SPINNER_TEST_ID = DATA_LIST_FILTERING_SPINNER_TEST_ID;
 exports.DATA_LIST_LOADING_MORE_SPINNER_TEST_ID = DATA_LIST_LOADING_MORE_SPINNER_TEST_ID;
 exports.DATA_LIST_STICKY_HEADER_TEST_ID = DATA_LIST_STICKY_HEADER_TEST_ID;
+exports.DATA_LIST_TITLE_CONTAINER_TEST_ID = DATA_LIST_TITLE_CONTAINER_TEST_ID;
 exports.DATA_LOAD_MORE_TEST_ID = DATA_LOAD_MORE_TEST_ID;
 exports.EMPTY_FILTER_RESULTS_MESSAGE = EMPTY_FILTER_RESULTS_MESSAGE;
 exports.EMPTY_RESULTS_MESSAGE = EMPTY_RESULTS_MESSAGE;

package/dist/DataList.const-es.js

@@ -19,7 +19,8 @@ const DATA_LIST_FILTERING_SPINNER_TEST_ID = "ATL-DataList-filteringSpinner";
 const DATA_LIST_LOADING_MORE_SPINNER_TEST_ID = "ATL-DataList-loadingMoreSpinner";
 const DATA_LOAD_MORE_TEST_ID = "ATL-DataList-LoadMore-trigger";
 const DATA_LIST_STICKY_HEADER_TEST_ID = "ATL-DataList-stickyHeader";
+const DATA_LIST_TITLE_CONTAINER_TEST_ID = "ATL-DataList-titleContainer";
 const TRANSITION_DURATION_IN_SECONDS = tokens["timing-base"] / 1000;
 const TRANSITION_DELAY_IN_SECONDS = tokens["timing-quick"] / 1000;
 
-export { BREAKPOINTS as B, DATA_LIST_FILTERING_SPINNER_TEST_ID as D, EMPTY_FILTER_RESULTS_MESSAGE as E, SEARCH_DEBOUNCE_DELAY as S, TRANSITION_DURATION_IN_SECONDS as T, DATA_LIST_STICKY_HEADER_TEST_ID as a, EMPTY_RESULTS_MESSAGE as b, EMPTY_STATE_ACTION_BUTTON_ONLY_ERROR as c, TRANSITION_DELAY_IN_SECONDS as d, BREAKPOINT_SIZES as e, DATA_LOAD_MORE_TEST_ID as f, DATA_LIST_LOADING_MORE_SPINNER_TEST_ID as g };
+export { BREAKPOINTS as B, DATA_LIST_TITLE_CONTAINER_TEST_ID as D, EMPTY_FILTER_RESULTS_MESSAGE as E, SEARCH_DEBOUNCE_DELAY as S, TRANSITION_DURATION_IN_SECONDS as T, DATA_LIST_FILTERING_SPINNER_TEST_ID as a, DATA_LIST_STICKY_HEADER_TEST_ID as b, EMPTY_RESULTS_MESSAGE as c, EMPTY_STATE_ACTION_BUTTON_ONLY_ERROR as d, TRANSITION_DELAY_IN_SECONDS as e, BREAKPOINT_SIZES as f, DATA_LOAD_MORE_TEST_ID as g, DATA_LIST_LOADING_MORE_SPINNER_TEST_ID as h };

package/dist/DataListActionsMenu-es.js

@@ -6,7 +6,7 @@ import { u as useOnKeyDown_2 } from './useOnKeyDown-es.js';
 import { createPortal } from 'react-dom';
 import { tokens } from '@jobber/design';
 import { u as useIsMounted_2 } from './useIsMounted-es.js';
-import { d as TRANSITION_DELAY_IN_SECONDS } from './DataList.const-es.js';
+import { e as TRANSITION_DELAY_IN_SECONDS } from './DataList.const-es.js';
 
 var styles = {"menu":"e1ztw2-YxtM-","overlay":"uMoOb93Pf1Q-","spinning":"_0wS9DWCNuj4-"};
 

package/dist/DataListEmptyState-es.js

@@ -3,7 +3,7 @@ import React, { 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';
-import { E as EMPTY_FILTER_RESULTS_MESSAGE, b as EMPTY_RESULTS_MESSAGE, c as EMPTY_STATE_ACTION_BUTTON_ONLY_ERROR } from './DataList.const-es.js';
+import { E as EMPTY_FILTER_RESULTS_MESSAGE, c as EMPTY_RESULTS_MESSAGE, d as EMPTY_STATE_ACTION_BUTTON_ONLY_ERROR } from './DataList.const-es.js';
 
 var styles = {"emptyStateWrapper":"R0MWvfTO9vg-","spinning":"hVJ2XoR6bR0-"};
 

package/dist/DataListItemActions-es.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { motion } from 'framer-motion';
-import { T as TRANSITION_DURATION_IN_SECONDS, d as TRANSITION_DELAY_IN_SECONDS } from './DataList.const-es.js';
+import { T as TRANSITION_DURATION_IN_SECONDS, e as TRANSITION_DELAY_IN_SECONDS } from './DataList.const-es.js';
 import { D as DataListActions } from './DataListActions-es.js';
 
 var styles = {"menu":"SSm2j6d2kYo-","spinning":"Mpmu6IiBTSI-"};

package/dist/DataListLoadMore-es.js

@@ -1,7 +1,7 @@
 import React, { useEffect } from 'react';
 import { u as useInView_2 } from './useInView-es.js';
 import { u as useDataListContext } from './DataListContext-es.js';
-import { f as DATA_LOAD_MORE_TEST_ID, g as DATA_LIST_LOADING_MORE_SPINNER_TEST_ID } from './DataList.const-es.js';
+import { g as DATA_LOAD_MORE_TEST_ID, h as DATA_LIST_LOADING_MORE_SPINNER_TEST_ID } from './DataList.const-es.js';
 import { S as Spinner } from './Spinner-es.js';
 import { B as Button } from './Button-es.js';
 

package/dist/DataListStickyHeader-es.js

@@ -1,6 +1,6 @@
 import classnames from 'classnames';
 import React, { useState, useRef, useCallback, useEffect } from 'react';
-import { a as DATA_LIST_STICKY_HEADER_TEST_ID } from './DataList.const-es.js';
+import { b as DATA_LIST_STICKY_HEADER_TEST_ID } from './DataList.const-es.js';
 
 var styles = {"header":"u5YTRL-PlTI-","stuck":"rylbmDbzCts-","spinning":"_2VUVOWcGjbc-"};
 

package/dist/DataListTotalCount-cjs.js

@@ -7,20 +7,22 @@ var Glimmer = require('./Glimmer-cjs.js');
 var styles = {"results":"_9wfZRG5vXI8-","spinning":"_7A1FU9kI3mY-"};
 
 const DATALIST_TOTALCOUNT_TEST_ID = "ATL-DataList-TotalCount";
+function DataListTotalCountContainer({ children }) {
+    return (React.createElement("div", { className: styles.results, "data-testid": DATALIST_TOTALCOUNT_TEST_ID }, children));
+}
 function DataListTotalCount({ totalCount, loading, }) {
-    if (totalCount === undefined)
-        return null;
-    let output = null;
     if (totalCount === null && loading) {
-        output = React.createElement(Glimmer.Glimmer, { size: "auto", shape: "rectangle" });
+        return (React.createElement(DataListTotalCountContainer, null,
+            React.createElement(Glimmer.Glimmer, { size: "auto", shape: "rectangle" })));
     }
     if (typeof totalCount === "number") {
-        output = (React.createElement(Text.Text, { variation: "subdued" },
-            "(",
-            totalCount.toLocaleString(),
-            " results)"));
+        return (React.createElement(DataListTotalCountContainer, null,
+            React.createElement(Text.Text, { variation: "subdued" },
+                "(",
+                totalCount.toLocaleString(),
+                " results)")));
     }
-    return (React.createElement("div", { className: styles.results, "data-testid": DATALIST_TOTALCOUNT_TEST_ID }, output));
+    return null;
 }
 
 exports.DATALIST_TOTALCOUNT_TEST_ID = DATALIST_TOTALCOUNT_TEST_ID;

package/dist/DataListTotalCount-es.js

@@ -5,20 +5,22 @@ import { G as Glimmer } from './Glimmer-es.js';
 var styles = {"results":"_9wfZRG5vXI8-","spinning":"_7A1FU9kI3mY-"};
 
 const DATALIST_TOTALCOUNT_TEST_ID = "ATL-DataList-TotalCount";
+function DataListTotalCountContainer({ children }) {
+    return (React.createElement("div", { className: styles.results, "data-testid": DATALIST_TOTALCOUNT_TEST_ID }, children));
+}
 function DataListTotalCount({ totalCount, loading, }) {
-    if (totalCount === undefined)
-        return null;
-    let output = null;
     if (totalCount === null && loading) {
-        output = React.createElement(Glimmer, { size: "auto", shape: "rectangle" });
+        return (React.createElement(DataListTotalCountContainer, null,
+            React.createElement(Glimmer, { size: "auto", shape: "rectangle" })));
     }
     if (typeof totalCount === "number") {
-        output = (React.createElement(Text, { variation: "subdued" },
-            "(",
-            totalCount.toLocaleString(),
-            " results)"));
+        return (React.createElement(DataListTotalCountContainer, null,
+            React.createElement(Text, { variation: "subdued" },
+                "(",
+                totalCount.toLocaleString(),
+                " results)")));
     }
-    return (React.createElement("div", { className: styles.results, "data-testid": DATALIST_TOTALCOUNT_TEST_ID }, output));
+    return null;
 }
 
 export { DATALIST_TOTALCOUNT_TEST_ID as D, DataListTotalCount as a };

package/dist/useResponsiveSizing-es.js

@@ -1,5 +1,5 @@
 import { useCallback, useSyncExternalStore } from 'react';
-import { e as BREAKPOINT_SIZES } from './DataList.const-es.js';
+import { f as BREAKPOINT_SIZES } from './DataList.const-es.js';
 
 const mediaQueryStore = {
     subscribe(onChange, query) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "6.10.0",
+  "version": "6.10.1",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.cjs",
@@ -487,5 +487,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "e6c03b6cbad92cccd8eebd63c3f86f0e39232dbf"
+  "gitHead": "66c7c1bed940d34bb5b55b39316b93f734dbca82"
 }