@homebound/beam 3.43.0 → 3.44.0

package/dist/index.js

@@ -20539,7 +20539,7 @@ function FilterPanelOpen({
   }), children: [
     groupBy && /* @__PURE__ */ jsx148(SelectField, { label: "Group by", labelStyle: "inline", sizeToContent: true, options: groupBy.options, getOptionValue: (o) => o.id, getOptionLabel: (o) => o.name, value: groupBy.value, onSelect: (g) => g && groupBy.setValue(g) }),
     filterControls,
-    activeFilterCount > 0 && /* @__PURE__ */ jsx148(Button, { label: "Clear", variant: "tertiary", onClick: onClear, ...tid.clearBtn })
+    activeFilterCount > 0 && /* @__PURE__ */ jsx148(Button, { label: "Clear", variant: "tertiary", onClick: () => maybeCall(onClear), ...tid.clearBtn })
   ] });
 }
 function FilterPanelClosed({
@@ -20564,7 +20564,7 @@ function FilterPanelClosed({
     } : {}
   }), children: [
     chips,
-    /* @__PURE__ */ jsx148(Button, { label: "Clear", variant: "tertiary", onClick: onClear, ...tid.clearBtn })
+    /* @__PURE__ */ jsx148(Button, { label: "Clear", variant: "tertiary", onClick: () => maybeCall(onClear), ...tid.clearBtn })
   ] });
 }
 function buildFilterControls(filterImpls, filter, setFilter, testId) {
@@ -20608,7 +20608,9 @@ function GridTableLayoutActionsComponent(props) {
     api,
     withCardView,
     view,
-    setView
+    setView,
+    clearFilters,
+    searchApi
   } = props;
   const testId = useTestIds(props, "gridTableLayoutActions");
   const {
@@ -20639,6 +20641,17 @@ function GridTableLayoutActionsComponent(props) {
     setSearchValue(v ?? "");
     handleSearchDebounced(v ?? "");
   }, placeholder: "Search", clearable: true, fullWidth: true, startAdornment: /* @__PURE__ */ jsx149(Icon, { icon: "search", color: "rgba(100, 100, 100, 1)" /* Gray700 */ }) });
+  if (searchApi) {
+    searchApi.current = {
+      clear: () => {
+        handleSearchDebounced.cancel();
+        setSearchValue("");
+        setQueryParams({
+          search: void 0
+        }, "replaceIn");
+      }
+    };
+  }
   return /* @__PURE__ */ jsxs75("div", { className: "df fdc gap1 pb2", children: [
     /* @__PURE__ */ jsxs75("div", { ...trussProps73({
       display: "df",
@@ -20665,7 +20678,7 @@ function GridTableLayoutActionsComponent(props) {
       ] })
     ] }),
     sm && showSearch && /* @__PURE__ */ jsx149("div", { className: "pl3 pr3", children: searchTextField }),
-    hasFilters && /* @__PURE__ */ jsx149(FilterPanel, { isOpen: showFilters, groupBy, filterImpls, filter, setFilter, onClear: () => setFilter?.({}) })
+    hasFilters && /* @__PURE__ */ jsx149(FilterPanel, { isOpen: showFilters, groupBy, filterImpls, filter, setFilter, onClear: clearFilters })
   ] });
 }
 var _GridTableLayoutActions = memo2(GridTableLayoutActionsComponent);
@@ -20829,8 +20842,13 @@ function GridTableLayoutComponent(props) {
   const filterSearchProps = useMemo40(() => layoutState?.search ? {
     onSearch: layoutState.setSearchString
   } : void 0, [layoutState?.search, layoutState?.setSearchString]);
-  const emptyState = useMemo40(() => composeEmptyState(tableProps, layoutState, layoutEmptyFallback), [layoutEmptyFallback, layoutState, tableProps]);
-  const tableActionsEl = /* @__PURE__ */ jsx152(_GridTableLayoutActions, { filterDefs: layoutState?.filterDefs, filter: layoutState?.filter, setFilter: layoutState?.setFilter, groupBy: layoutState?.groupBy, searchProps: filterSearchProps, hasHideableColumns, columns, api, withCardView, view, setView });
+  const searchApiRef = useRef48();
+  const clearFilters = useCallback27(() => {
+    layoutState?.clearFilters();
+    searchApiRef.current?.clear();
+  }, [layoutState]);
+  const emptyState = useMemo40(() => composeEmptyState(tableProps, layoutState, layoutEmptyFallback, clearFilters), [layoutEmptyFallback, layoutState, tableProps, clearFilters]);
+  const tableActionsEl = /* @__PURE__ */ jsx152(_GridTableLayoutActions, { filterDefs: layoutState?.filterDefs, filter: layoutState?.filter, setFilter: layoutState?.setFilter, groupBy: layoutState?.groupBy, searchProps: filterSearchProps, hasHideableColumns, columns, api, withCardView, view, setView, clearFilters, searchApi: searchApiRef });
   const cardAs = withCardView && view === "card" ? "card" : void 0;
   const tableBody = /* @__PURE__ */ jsx152(Fragment35, { children: isGridTableProps(tableProps) ? /* @__PURE__ */ jsx152(GridTable, { ...tableProps, ...cardAs ? {
     as: cardAs
@@ -20920,7 +20938,7 @@ function useGridTableLayoutState({
     clearFilters
   };
 }
-function composeEmptyState(tableProps, layoutState, layoutEmptyFallback) {
+function composeEmptyState(tableProps, layoutState, layoutEmptyFallback, clearFilters) {
   const tableEmptyState = "emptyState" in tableProps ? tableProps.emptyState : void 0;
   const tableEmptyFallback = "emptyFallback" in tableProps ? tableProps.emptyFallback : void 0;
   const filteringActive = layoutState?.filteringActive ?? false;
@@ -20928,7 +20946,7 @@ function composeEmptyState(tableProps, layoutState, layoutEmptyFallback) {
   return {
     title: tableEmptyState?.title ?? tableEmptyFallback ?? layoutEmptyFallback,
     description: tableEmptyState?.description ?? (filteringActive ? filterEmptyDescription : void 0),
-    actions: tableEmptyState?.actions ?? (filteringActive && layoutState ? /* @__PURE__ */ jsx152(Button, { label: "Clear Filters", variant: "tertiary", onClick: layoutState.clearFilters, "data-testid": "clearFilters" }) : void 0)
+    actions: tableEmptyState?.actions ?? (filteringActive && layoutState ? /* @__PURE__ */ jsx152(Button, { label: "Clear Filters", variant: "tertiary", onClick: clearFilters, "data-testid": "clearFilters" }) : void 0)
   };
 }
 function useSetTableActionsHeight(tableWrapperRef, tableActionsRef, enabled) {