material-react-table 1.0.0-beta.10 → 1.0.0-beta.11

package/dist/cjs/index.js

@@ -1051,6 +1051,9 @@ const MRT_GlobalFilterTextField = ({ table, }) => {
     var _a;
     const { getState, setGlobalFilter, options: { enableGlobalFilterModes, icons: { SearchIcon, CloseIcon }, localization, muiSearchTextFieldProps, }, refs: { searchInputRef }, } = table;
     const { globalFilter, showGlobalFilter } = getState();
+    const textFieldProps = muiSearchTextFieldProps instanceof Function
+        ? muiSearchTextFieldProps({ table })
+        : muiSearchTextFieldProps;
     const [anchorEl, setAnchorEl] = React.useState(null);
     const [searchValue, setSearchValue] = React.useState(globalFilter !== null && globalFilter !== void 0 ? globalFilter : '');
     const handleChangeDebounced = React.useCallback(material.debounce((event) => {
@@ -1068,9 +1071,11 @@ const MRT_GlobalFilterTextField = ({ table, }) => {
         setSearchValue('');
         setGlobalFilter(undefined);
     };
-    const textFieldProps = muiSearchTextFieldProps instanceof Function
-        ? muiSearchTextFieldProps({ table })
-        : muiSearchTextFieldProps;
+    React.useEffect(() => {
+        if (globalFilter === undefined) {
+            handleClear();
+        }
+    }, [globalFilter]);
     return (React__default["default"].createElement(material.Collapse, { in: showGlobalFilter, orientation: "horizontal", unmountOnExit: true, mountOnEnter: true },
         React__default["default"].createElement(material.TextField, Object.assign({ placeholder: localization.search, onChange: handleChange, value: searchValue !== null && searchValue !== void 0 ? searchValue : '', variant: "standard", InputProps: {
                 startAdornment: enableGlobalFilterModes ? (React__default["default"].createElement(material.InputAdornment, { position: "start" },
@@ -1503,6 +1508,11 @@ const MRT_FilterTextField = ({ header, rangeFilterIndex, table, }) => {
     const handleFilterMenuOpen = (event) => {
         setAnchorEl(event.currentTarget);
     };
+    React.useEffect(() => {
+        if (column.getFilterValue() === undefined) {
+            handleClear();
+        }
+    }, [column.getFilterValue()]);
     if (columnDef.Filter) {
         return React__default["default"].createElement(React__default["default"].Fragment, null, (_e = columnDef.Filter) === null || _e === void 0 ? void 0 : _e.call(columnDef, { column, header, table }));
     }
@@ -1564,7 +1574,7 @@ const MRT_FilterTextField = ({ header, rangeFilterIndex, table, }) => {
                     ? '90px'
                     : !filterChipLabel
                         ? '120px'
-                        : 'auto', width: '100%', '&	.MuiSelect-icon': {
+                        : 'auto', width: '100%', '& .MuiSelect-icon': {
                     mr: '1.5rem',
                 } }, ((textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.sx) instanceof Function
                 ? textFieldProps.sx(theme)