@stella-source/stellasource-dsl 3.1.3 → 3.1.5

package/dist/cjs/styles.css

@@ -69,4 +69,7 @@
   border: none;
   padding: 0;
   outline: none;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
 }

package/dist/esm/index.esm.js

@@ -17044,7 +17044,6 @@ const RequiredIcon = styled(StellaIcon) `
 `;
 const ToolTipIcon = styled(Tooltip) `
   margin-left: 2px;
-  margin-top: 2px;
 `;
 const LabelComponent = styled.label `
   font-family: "Inter", sans-serif;
@@ -21484,7 +21483,6 @@ const TableHeaderCell = ({ header, serverSide, filters, sorting, scrollPosition,
     const buttonRef = useRef(null);
     const [showFilter, setShowFilter] = useState(false);
     const [coords, setCoords] = useState({ top: 0, left: 0 });
-    const [searchValue, setSearchValue] = useState();
     const [tempFilters, setTempFilters] = useState([]);
     const [currentAppliedFilters, setCurrentAppliedFilters] = useState([]);
     const [filterOptions, setFilterOptions] = useState([]);
@@ -21570,9 +21568,11 @@ const TableHeaderCell = ({ header, serverSide, filters, sorting, scrollPosition,
                         a__default.createElement(MenuItemGroup, null,
                             meta?.filterMode === "search" && (a__default.createElement("div", { style: { padding: "4px 10px" } },
                                 a__default.createElement(TextInput, { id: `${columnDef.header}-search`, label: `${columnDef.header} search`, placeholder: "Search", hideLabel: true, onChange: (value) => {
-                                        setSearchValue(value);
-                                        handleSave(value);
-                                    }, onBlur: () => flush(), endIcon: "search", value: searchValue }))),
+                                        value === ""
+                                            ? setTempFilters([])
+                                            : setTempFilters([value]);
+                                        !serverSide && handleSave(value);
+                                    }, onBlur: () => !serverSide && flush(), endIcon: "search", value: tempFilters?.[0] }))),
                             (meta?.filterMode === "multiSelect" ||
                                 !meta?.filterMode) && (a__default.createElement(MenuItem, { key: "select-all" },
                                 a__default.createElement(Checkbox, { id: "all-checkbox", name: "all-checkbox", checked: meta?.filterOptions?.every((item) => tempFilters?.includes(item)), onChange: () => {
@@ -21615,6 +21615,7 @@ const TableHeaderCell = ({ header, serverSide, filters, sorting, scrollPosition,
                                 }
                             })),
                         (meta?.filterMode === "multiSelect" ||
+                            (meta?.filterMode === "search" && serverSide) ||
                             !meta?.filterMode) && (a__default.createElement(MenuButton, { key: "apply", onClick: () => {
                                 setCurrentAppliedFilters(tempFilters);
                                 column?.setFilterValue(tempFilters?.length > 0 ? tempFilters : []);
@@ -21626,7 +21627,6 @@ const TableHeaderCell = ({ header, serverSide, filters, sorting, scrollPosition,
                                 showFilterMenu(false);
                                 setTempFilters([]);
                                 setCurrentAppliedFilters([]);
-                                setSearchValue("");
                                 onFilterApply?.();
                             } }, "Clear Filter"))), document.body))),
             header.column.getCanSort() && (a__default.createElement(SortButton, { className: "icon", iconName: "sort", ariaLabel: "Sort Button", variant: "tertiary", "$active": sorting.some((s) => s.id === header.column.id), "$sort": column.getIsSorted(), onClick: (e) => header.column.getToggleSortingHandler()?.(e) })),