@linzjs/step-ag-grid 29.1.4 → 29.1.5

package/dist/src/components/GridPopoverHook.d.ts

@@ -10,5 +10,4 @@ export declare const CancelPromise: () => Promise<boolean>;
 export declare const useGridPopoverHook: <TData extends GridBaseRow>({ className, save, invalid, dontSaveOnExternalClick, }: GridPopoverHookProps<TData>) => {
     popoverWrapper: (children: ReactElement) => import("react/jsx-runtime").JSX.Element;
     triggerSave: (reason?: string) => Promise<void>;
-    gridPopoverOpen: boolean;
 };

package/dist/step-ag-grid.cjs

@@ -4010,7 +4010,6 @@ const useGridPopoverHook = ({ className, save, invalid, dontSaveOnExternalClick,
     return {
         popoverWrapper,
         triggerSave,
-        gridPopoverOpen: isOpen,
     };
 };
 
@@ -4035,7 +4034,7 @@ const GridFormDropDown = (props) => {
     // Save triggers during async action processing which triggers another selectItem(), this ref blocks that
     const [filter, setFilter] = React.useState(props.filterDefaultValue ?? '');
     const [filteredValues, setFilteredValues] = React.useState();
-    const [options, setOptions] = React.useState(null);
+    const [options, setOptions] = React.useState(!!propOptions && typeof propOptions !== 'function' ? propOptions : null);
     const subComponentIsValid = React.useRef(false);
     const subComponentInitialValue = React.useRef(null);
     const [subSelectedValue, setSubSelectedValue] = React.useState(null);
@@ -4102,55 +4101,58 @@ const GridFormDropDown = (props) => {
         selectedRows,
         subSelectedValue,
     ]);
-    const { popoverWrapper, gridPopoverOpen } = useGridPopoverHook({
+    const { popoverWrapper } = useGridPopoverHook({
         className: props.className,
         invalid: () => !options || !!(selectedItem && !subComponentIsValid.current),
         save,
         dontSaveOnExternalClick: true,
     });
     // Load up options list if it's async function
-    const prevIsOpen = usePrevious(gridPopoverOpen);
-    const prevFilter = usePrevious(filter);
     React.useEffect(() => {
-        if ((gridPopoverOpen !== prevIsOpen || filter !== prevFilter) && gridPopoverOpen) {
-            let optionsConf = propOptions;
-            void (async () => {
-                if (typeof optionsConf === 'function') {
-                    optionsConf = await optionsConf(selectedRows, filter);
-                }
-                if (optionsConf !== undefined) {
-                    setOptions(optionsConf);
-                }
-            })();
+        // If options is null then we need to load/reload
+        // Options will be set to null during a reload based filter, or on open popup
+        if (options !== null) {
+            return;
         }
-    }, [filter, gridPopoverOpen, options, prevFilter, prevIsOpen, propOptions, selectedRows]);
+        // propOptions is a const list
+        if (typeof propOptions !== 'function') {
+            if (propOptions) {
+                setOptions(propOptions);
+            }
+            return;
+        }
+        // propOptions is function, probably loading from web
+        void (async () => {
+            const r = await propOptions(selectedRows, filter);
+            setOptions(r ?? []);
+        })();
+    }, [filter, options, propOptions, selectedRows]);
     // Local filtering.
     React.useEffect(() => {
-        if (props.filtered == 'local') {
-            if (options == null)
-                return;
-            setFilteredValues(options
-                .map((option) => {
-                if (option.label != null && typeof option.label !== 'string') {
-                    console.error('Cannot filter non-string labels', option);
-                    return undefined;
-                }
-                return textMatch(option.label || '', filter) ? option : undefined;
-            })
-                .filter((r) => r !== undefined));
+        if (props.filtered !== 'local') {
+            return;
         }
+        if (options == null) {
+            setFilteredValues([]);
+            return;
+        }
+        setFilteredValues(lodashEs.compact(options.map((option) => {
+            if (option.label != null && typeof option.label !== 'string') {
+                console.warn('GridFormDropDown: Cannot filter non-string labels', option);
+                return undefined;
+            }
+            return textMatch(option.label || '', filter) ? option : undefined;
+        })));
     }, [props.filtered, filter, options]);
     const reSearchOnFilterChange = React.useMemo(() => debounce(() => {
         setOptions(null);
     }, 500), []);
-    const previousFilter = React.useRef(filter);
-    // Reload filtering.
+    const previousFilter = usePrevious(filter);
     React.useEffect(() => {
-        if (previousFilter.current != filter && props.filtered == 'reload') {
-            previousFilter.current = filter;
+        if (previousFilter != null && previousFilter != filter && props.filtered === 'reload') {
             void reSearchOnFilterChange();
         }
-    }, [filter, props, reSearchOnFilterChange]);
+    }, [filter, previousFilter, props.filtered, reSearchOnFilterChange]);
     let lastHeader = null;
     let showHeader = null;
     return popoverWrapper(jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [props.filtered && (jsxRuntime.jsxs("div", { className: 'GridFormDropDown-filter', children: [jsxRuntime.jsx(FocusableItem, { className: 'filter-item', onFocus: () => {