@linzjs/step-ag-grid 8.2.2 → 8.3.0

package/dist/step-ag-grid.esm.js

@@ -2840,6 +2840,20 @@ var Grid = function (params) {
     useEffect(function () {
         updateQuickFilter();
     }, [updateQuickFilter]);
+    var combineEditables = function () {
+        var editables = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            editables[_i] = arguments[_i];
+        }
+        return function (params) {
+            var results = editables.map(function (editable) { return fnOrVar(editable, params); });
+            // If editable is not set anywhere then it's non-editable
+            if (results.every(function (v) { return v == null; }))
+                return false;
+            // If any editable value is or returns false then it's non-editable
+            return !results.some(function (v) { return v == false; });
+        };
+    };
     /**
      * Synchronise externally selected items to grid on externalSelectedItems change
      */
@@ -2848,21 +2862,18 @@ var Grid = function (params) {
     }, [synchroniseExternallySelectedItemsToGrid]);
     var columnDefs = useMemo(function () {
         var adjustColDefs = params.columnDefs.map(function (colDef) {
-            var _a, _b;
-            return __assign(__assign({}, colDef), { editable: params.readOnly ? false : (_b = (_a = params.defaultColDef) === null || _a === void 0 ? void 0 : _a.editable) !== null && _b !== void 0 ? _b : colDef.editable, cellClassRules: __assign(__assign({}, colDef.cellClassRules), { "GridCell-readonly": function (ccp) {
-                        var _a, _b;
-                        return (params.readOnly != null || !params.readOnly) &&
-                            !fnOrVar((_b = (_a = params.defaultColDef) === null || _a === void 0 ? void 0 : _a.editable) !== null && _b !== void 0 ? _b : colDef.editable, ccp);
-                    } }) });
+            var _a;
+            var colDefEditable = colDef.editable;
+            var editable = combineEditables(params.readOnly !== false, (_a = params.defaultColDef) === null || _a === void 0 ? void 0 : _a.editable, colDefEditable);
+            return __assign(__assign({}, colDef), { editable: editable, cellClassRules: __assign(__assign({}, colDef.cellClassRules), { "GridCell-readonly": function (ccp) { return !editable(ccp); } }) });
         });
         return params.selectable
             ? __spreadArray([
                 {
                     colId: "selection",
                     editable: false,
-                    initialWidth: 35,
-                    minWidth: 35,
-                    maxWidth: 35,
+                    minWidth: 42,
+                    maxWidth: 42,
                     suppressSizeToFit: true,
                     checkboxSelection: true,
                     headerComponent: GridHeaderSelect,
@@ -3007,13 +3018,13 @@ var suppressCellKeyboardEvents = function (e) {
     return !["ArrowLeft", "ArrowRight", "ArrowDown", "ArrowUp", "Tab", " ", "Home", "End", "PageUp", "PageDown"].includes(e.event.key);
 };
 /*
- * All cells should use this
+ * All cells should use this.
  */
 var GridCell = function (props, custom) {
-    var _a;
-    return __assign(__assign(__assign(__assign(__assign(__assign({ colId: props.field, sortable: !!((props === null || props === void 0 ? void 0 : props.field) || (props === null || props === void 0 ? void 0 : props.valueGetter)), resizable: true }, ((custom === null || custom === void 0 ? void 0 : custom.editor) && {
+    var _a, _b;
+    return __assign(__assign(__assign(__assign(__assign(__assign({ colId: props.field, sortable: !!((props === null || props === void 0 ? void 0 : props.field) || (props === null || props === void 0 ? void 0 : props.valueGetter)), resizable: true, editable: (_a = props.editable) !== null && _a !== void 0 ? _a : false }, ((custom === null || custom === void 0 ? void 0 : custom.editor) && {
         cellClassRules: GridCellMultiSelectClassRules,
-        editable: (_a = props.editable) !== null && _a !== void 0 ? _a : true,
+        editable: (_b = props.editable) !== null && _b !== void 0 ? _b : true,
         cellEditor: GenericCellEditorComponentWrapper(custom === null || custom === void 0 ? void 0 : custom.editor)
     })), { suppressKeyboardEvent: suppressCellKeyboardEvents }), ((custom === null || custom === void 0 ? void 0 : custom.editorParams) && {
         cellEditorParams: __assign(__assign({}, custom.editorParams), { multiEdit: custom.multiEdit })
@@ -3425,6 +3436,22 @@ var GridFormDropDown = function (props) {
             }
         });
     }); }, [filter, filteredValues, options, props, selectItemHandler, selectedItem, selectedRows, subSelectedValue]);
+    var onMouseEnterFocus = useCallback(function (item) {
+        setSelectedItem(item);
+        if (item.subComponent) {
+            subComponentIsValid.current = true;
+            subComponentInitialValue.current = null;
+        }
+        else {
+            setSubSelectedValue(null);
+            subComponentIsValid.current = true;
+        }
+    }, []);
+    var onMouseLeaveFocus = useCallback(function () {
+        setSelectedItem(null);
+        setSubSelectedValue(null);
+        subComponentIsValid.current = true;
+    }, []);
     var popoverWrapper = useGridPopoverHook({
         className: props.className,
         invalid: function () { return !!(selectedItem && !subComponentIsValid.current); },
@@ -3457,18 +3484,7 @@ var GridFormDropDown = function (props) {
                                     lastHeader = null;
                                 }
                             }
-                            return ((!filteredValues || filteredValues.includes(item)) && (jsxs(Fragment$1, { children: [showHeader, jsxs("div", { children: [jsxs(MenuItem, __assign({ disabled: !!item.disabled, title: item.disabled && typeof item.disabled !== "boolean" ? item.disabled : "", value: item.value, onFocus: function () {
-                                                    setSelectedItem(item);
-                                                    if (item.subComponent) {
-                                                        setSelectedItem(item);
-                                                        subComponentIsValid.current = true;
-                                                        subComponentInitialValue.current = null;
-                                                    }
-                                                    else {
-                                                        setSubSelectedValue(null);
-                                                        subComponentIsValid.current = true;
-                                                    }
-                                                }, onClick: function (e) {
+                            return ((!filteredValues || filteredValues.includes(item)) && (jsxs(Fragment$1, { children: [showHeader, jsxs("div", { children: [jsxs(MenuItem, __assign({ disabled: !!item.disabled, title: item.disabled && typeof item.disabled !== "boolean" ? item.disabled : "", value: item.value, onFocus: function () { return onMouseEnterFocus(item); }, onMouseEnter: function () { return onMouseEnterFocus(item); }, onMouseLeave: onMouseLeaveFocus, onClick: function (e) {
                                                     if (item.subComponent) {
                                                         e.keepOpen = true;
                                                     }
@@ -4023,7 +4039,7 @@ var GridFormPopoverMenu = function (props) {
  * Popout burger menu
  */
 var GridPopoverMenu = function (colDef, custom) {
-    return GridCell(__assign(__assign({ minWidth: 40, maxWidth: 40, width: 40, editable: colDef.editable != null ? colDef.editable : true, cellStyle: { justifyContent: "center" }, cellRenderer: GridRenderPopoutMenuCell }, colDef), { cellRendererParams: {
+    return GridCell(__assign(__assign({ minWidth: 48, maxWidth: 48, width: 40, editable: colDef.editable != null ? colDef.editable : true, cellStyle: { justifyContent: "center" }, cellRenderer: GridRenderPopoutMenuCell }, colDef), { cellRendererParams: {
             // Menus open on single click, this parameter is picked up in Grid.tsx
             singleClickEdit: true
         } }), __assign({ editor: GridFormPopoverMenu }, custom));