@homebound/beam 4.14.5 → 4.14.7

package/dist/index.d.cts

@@ -10851,8 +10851,14 @@ type RequiredRenderRouteTabs<V extends string, X> = {
  * If you want to tease apart Tabs from their TabContent, you can use the `Tab`
  * and `TabContent` components directly.
  */
-declare function TabsWithContent<V extends string, X extends Only<TabsContentXss, X>>(props: RequiredRenderTabs<V, X> | RequiredRenderRouteTabs<V, X>): React$1.JSX.Element;
-declare function TabContent<V extends string, X extends Only<TabsContentXss, X>>(props: Omit<RequiredRenderTabs<V, X>, "onChange"> | RequiredRenderRouteTabs<V, X>): React$1.JSX.Element;
+declare function TabsWithContent<V extends string, X extends Only<TabsContentXss, X>>(props: (RequiredRenderTabs<V, X> | RequiredRenderRouteTabs<V, X>) & {
+    /** Skip the default top gap. Also set when the tab list is hidden. */
+    omitTopSpacing?: boolean;
+}): React$1.JSX.Element;
+declare function TabContent<V extends string, X extends Only<TabsContentXss, X>>(props: (Omit<RequiredRenderTabs<V, X>, "onChange"> | RequiredRenderRouteTabs<V, X>) & {
+    /** Skip the default top gap. `TabsWithContent` sets this when the tab list is hidden. */
+    omitTopSpacing?: boolean;
+}): React$1.JSX.Element;
 /** The top list of tabs. */
 declare function Tabs<V extends string, X extends Only<TabsContentXss, X>>(props: TabsProps<V, X> | RouteTabsProps<V, X>): React$1.JSX.Element;
 

package/dist/index.d.ts

@@ -10851,8 +10851,14 @@ type RequiredRenderRouteTabs<V extends string, X> = {
  * If you want to tease apart Tabs from their TabContent, you can use the `Tab`
  * and `TabContent` components directly.
  */
-declare function TabsWithContent<V extends string, X extends Only<TabsContentXss, X>>(props: RequiredRenderTabs<V, X> | RequiredRenderRouteTabs<V, X>): React$1.JSX.Element;
-declare function TabContent<V extends string, X extends Only<TabsContentXss, X>>(props: Omit<RequiredRenderTabs<V, X>, "onChange"> | RequiredRenderRouteTabs<V, X>): React$1.JSX.Element;
+declare function TabsWithContent<V extends string, X extends Only<TabsContentXss, X>>(props: (RequiredRenderTabs<V, X> | RequiredRenderRouteTabs<V, X>) & {
+    /** Skip the default top gap. Also set when the tab list is hidden. */
+    omitTopSpacing?: boolean;
+}): React$1.JSX.Element;
+declare function TabContent<V extends string, X extends Only<TabsContentXss, X>>(props: (Omit<RequiredRenderTabs<V, X>, "onChange"> | RequiredRenderRouteTabs<V, X>) & {
+    /** Skip the default top gap. `TabsWithContent` sets this when the tab list is hidden. */
+    omitTopSpacing?: boolean;
+}): React$1.JSX.Element;
 /** The top list of tabs. */
 declare function Tabs<V extends string, X extends Only<TabsContentXss, X>>(props: TabsProps<V, X> | RouteTabsProps<V, X>): React$1.JSX.Element;
 

package/dist/index.js

@@ -13954,7 +13954,7 @@ function GridTable(props) {
   }
   return /* @__PURE__ */ jsx52(TableStateContext.Provider, { value: rowStateContext, children: /* @__PURE__ */ jsxs33(PresentationProvider, { fieldProps, wrap: style?.presentationSettings?.wrap, children: [
     /* @__PURE__ */ jsx52("div", { ref: resizeRef, ...trussProps33(getTableRefWidthStyles(as === "virtual", inDocumentScrollLayout)), ...tid.probe }),
-    loading && /* @__PURE__ */ jsx52("div", { ...trussProps33(loadingOverlayCss), ...tid.loadingOverlay, children: /* @__PURE__ */ jsx52(Loader, { ...tid.loadingSpinner }) }),
+    loading && /* @__PURE__ */ jsx52("div", { ...trussProps33(loadingOverlayCss), ...tid.loadingOverlay, children: /* @__PURE__ */ jsx52(Loader, { ...tid.loadingSpinner, size: "md" }) }),
     as === "card" ? /* @__PURE__ */ jsx52(CardView, { cardRows: visibleDataRows, id, virtuosoRangeRef, infiniteScroll, persistScrollPosition, loading }) : _as === "virtual" ? /* @__PURE__ */ jsx52(VirtualGridTableView, { style: tableStyle, id, columns, visibleDataRows, keptSelectedRows, pinnedRows, firstRowMessage, stickyHeader, xss, virtuosoRef, virtuosoRangeRef, tableHeadRows, stickyOffset, infiniteScroll, persistScrollPosition, loading }) : renders[_as](tableStyle, id, columns, visibleDataRows, keptSelectedRows, pinnedRows, firstRowMessage, stickyHeader, xss, virtuosoRef, virtuosoRangeRef, tableHeadRows, stickyOffset, loading, infiniteScroll, tableContainerRef, persistScrollPosition)
   ] }) });
 }
@@ -24853,11 +24853,12 @@ function GridTableLayoutComponent(props) {
   const emptyState = useMemo45(() => composeEmptyState(tableProps, layoutState, layoutEmptyFallback, clearFilters), [layoutEmptyFallback, layoutState, tableProps, clearFilters]);
   const tableActionsEl = /* @__PURE__ */ jsx178(_GridTableLayoutActions, { filterDefs: layoutState?.filterDefs, filter: layoutState?.filter, setFilter: layoutState?.setFilter, groupBy: layoutState?.groupBy, searchProps: filterSearchProps, hasHideableColumns, columns, api, withCardView, view, setView, clearFilters, searchApi: searchApiRef, actions });
   const cardAs = view === "card" ? "card" : void 0;
+  const tableStyle = useMemo45(() => getDefaultStyle(tableProps.style), [tableProps.style]);
   const tableBody = /* @__PURE__ */ jsx178(Fragment40, { children: isGridTableProps(tableProps) ? /* @__PURE__ */ jsx178(GridTable, { ...tableProps, ...cardAs ? {
     as: cardAs
-  } : {}, api, emptyState, filter: clientSearch, stickyHeader: true, disableColumnResizing: false, visibleColumnsStorageKey, columnGutter: inDocumentScrollLayout }) : /* @__PURE__ */ jsx178(QueryTable, { ...tableProps, ...cardAs ? {
+  } : {}, api, emptyState, filter: clientSearch, style: tableStyle, stickyHeader: true, disableColumnResizing: false, visibleColumnsStorageKey, columnGutter: inDocumentScrollLayout }) : /* @__PURE__ */ jsx178(QueryTable, { ...tableProps, ...cardAs ? {
     as: cardAs
-  } : {}, api, emptyState, filter: clientSearch, stickyHeader: true, disableColumnResizing: false, visibleColumnsStorageKey, columnGutter: inDocumentScrollLayout }) });
+  } : {}, api, emptyState, filter: clientSearch, style: tableStyle, stickyHeader: true, disableColumnResizing: false, visibleColumnsStorageKey, columnGutter: inDocumentScrollLayout }) });
   const tableScrollContent = /* @__PURE__ */ jsxs91(Fragment40, { children: [
     showTableActions && /* @__PURE__ */ jsx178("div", { ref: tableActionsRef, ...trussProps101({
       ...inDocumentScrollLayout ? {
@@ -24903,6 +24904,13 @@ function GridTableLayoutComponent(props) {
   );
 }
 var GridTableLayout = React18.memo(GridTableLayoutComponent);
+function getDefaultStyle(style) {
+  if (style !== void 0 && !isGridStyleDef(style)) return style;
+  return {
+    allWhite: true,
+    ...style
+  };
+}
 function validateColumns(columns) {
   for (const col of columns) {
     if (!col.id || !col.name) {
@@ -28469,15 +28477,13 @@ import { Link as Link7, useLocation as useLocation2 } from "react-router-dom";
 import { trussProps as trussProps128, maybeCssVar as maybeCssVar61 } from "@homebound/truss/runtime";
 import { Fragment as Fragment51, jsx as jsx224, jsxs as jsxs118 } from "react/jsx-runtime";
 function TabsWithContent(props) {
-  const styles = hideTabs(props) ? {} : {
-    paddingTop: "pt3"
-  };
+  const {
+    omitTopSpacing = false,
+    ...tabProps
+  } = props;
   return /* @__PURE__ */ jsxs118(Fragment51, { children: [
-    /* @__PURE__ */ jsx224(Tabs, { ...props }),
-    /* @__PURE__ */ jsx224(TabContent, { ...props, contentXss: {
-      ...styles,
-      ...props.contentXss
-    } })
+    /* @__PURE__ */ jsx224(Tabs, { ...tabProps }),
+    /* @__PURE__ */ jsx224(TabContent, { ...tabProps, omitTopSpacing: omitTopSpacing || hideTabs(props) })
   ] });
 }
 function TabContent(props) {
@@ -28485,7 +28491,8 @@ function TabContent(props) {
   const {
     tabs,
     contentXss = {},
-    omitFullBleedPadding = false
+    omitFullBleedPadding = false,
+    omitTopSpacing = false
   } = props;
   const location = useLocation2();
   const selectedTab = isRouteTabs(props) ? props.tabs.find((t) => {
@@ -28499,7 +28506,26 @@ function TabContent(props) {
   return (
     // Using FullBleed to allow the tab's bgColor to extend to the edges of the <ScrollableContent /> element.
     // Omit the padding from `FullBleed` if the caller passes in the `paddingLeft/Right` styles.
-    /* @__PURE__ */ jsx224(FullBleed, { omitPadding: omitFullBleedPadding, children: /* @__PURE__ */ jsx224("div", { "aria-labelledby": `${uniqueValue}-tab`, id: `${uniqueValue}-tabPanel`, role: "tabpanel", tabIndex: 0, ...tid.panel, ...trussProps128(contentXss), children: selectedTab.render() }) })
+    /* @__PURE__ */ jsx224(FullBleed, { omitPadding: omitFullBleedPadding, children: /* @__PURE__ */ jsx224(
+      "div",
+      {
+        "aria-labelledby": `${uniqueValue}-tab`,
+        id: `${uniqueValue}-tabPanel`,
+        role: "tabpanel",
+        tabIndex: 0,
+        ...tid.panel,
+        ...selfTopSpaced,
+        ...trussProps128({
+          ...{
+            ...!omitTopSpacing ? {
+              paddingTop: "first_child_n_data_self_top_spaced_pt3"
+            } : {}
+          },
+          ...contentXss
+        }),
+        children: selectedTab.render()
+      }
+    ) })
   );
 }
 function Tabs(props) {
@@ -29562,7 +29588,7 @@ function PageHeaderLayout(props) {
       flexShrink: "fs0",
       width: "w100"
     }), children: /* @__PURE__ */ jsx236("div", { ref: headerMetricsRef, ...mergeProps42(void 0, innerStyle, innerCss), ...tid.pageHeader, children: pageHeaderEl }) }),
-    /* @__PURE__ */ jsx236("div", { className: "df fdc fg1 mh0 w100 first_child_n_data_self_top_spaced_mt3", ...tid.body, children })
+    /* @__PURE__ */ jsx236("div", { className: "df fdc fg1 mh0 w100 first_child_n_data_self_top_spaced_pt3", ...tid.body, children })
   ] }) });
 }