@linzjs/step-ag-grid 6.1.0 → 6.1.1

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

@@ -3094,14 +3094,16 @@ var GridFormDropDown = function (props) {
     var optionsInitialising = useRef(false);
     var _d = useState(null), options = _d[0], setOptions = _d[1];
     var subComponentIsValid = useRef(false);
-    var _e = useState(), subSelectedValue = _e[0], setSubSelectedValue = _e[1];
+    var subComponentInitialValue = useRef(null);
+    var _e = useState(null), subSelectedValue = _e[0], setSubSelectedValue = _e[1];
     var _f = useState(null), selectedSubComponent = _f[0], setSelectedSubComponent = _f[1];
     var selectItemHandler = useCallback(function (value, subComponentValue) { return __awaiter(void 0, void 0, void 0, function () {
         var hasChanged;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    hasChanged = selectedRows.some(function (row) { return row[field] !== value; });
+                    hasChanged = selectedRows.some(function (row) { return row[field] !== value; }) ||
+                        (subComponentValue !== undefined && subComponentInitialValue.current !== JSON.stringify(subComponentValue));
                     if (!hasChanged) return [3 /*break*/, 3];
                     if (!props.onSelectedItem) return [3 /*break*/, 2];
                     return [4 /*yield*/, props.onSelectedItem({ selectedRows: selectedRows, value: value, subComponentValue: subComponentValue })];
@@ -3277,15 +3279,10 @@ var GridFormDropDown = function (props) {
                             var _a;
                             return item.value === MenuSeparatorString ? (jsx(MenuDivider, {}, "$$divider_".concat(index))) : item.value === MenuHeaderString ? (jsx(MenuHeader, { children: item.label }, "$$header_".concat(index))) : filteredValues.includes(item.value) ? null : (jsxs("div", { children: [jsxs(MenuItem, __assign({ disabled: !!item.disabled, title: item.disabled && typeof item.disabled !== "boolean" ? item.disabled : "", value: item.value, onClick: function (e) {
                                             if (item.subComponent) {
-                                                if (selectedSubComponent === item) {
-                                                    // toggle selection off
-                                                    setSelectedSubComponent(null);
-                                                    subComponentIsValid.current = true;
-                                                }
-                                                else {
-                                                    // toggle selection on
-                                                    setSelectedSubComponent(item);
-                                                }
+                                                // toggle selection
+                                                setSelectedSubComponent(selectedSubComponent === item ? null : item);
+                                                subComponentIsValid.current = true;
+                                                subComponentInitialValue.current = null;
                                                 e.keepOpen = true;
                                             }
                                             else {
@@ -3300,6 +3297,10 @@ var GridFormDropDown = function (props) {
                                                 value: subSelectedValue,
                                                 setValue: function (value) {
                                                     setSubSelectedValue(value);
+                                                    if (subComponentInitialValue.current === null) {
+                                                        // copy the default value of the sub-component so we can change detect on save
+                                                        subComponentInitialValue.current = JSON.stringify(value);
+                                                    }
                                                 },
                                                 setValid: function (valid) {
                                                     subComponentIsValid.current = valid;