@linzjs/step-ag-grid 1.5.1 → 1.5.3

package/dist/src/components/gridForm/GridFormMultiSelect.d.ts

@@ -21,6 +21,7 @@ export interface GridFormMultiSelectProps<RowType extends GridBaseRow, ValueType
     filterPlaceholder?: string;
     onSave?: (props: MultiSelectResult<RowType>) => Promise<boolean>;
     options: SelectOption<ValueType>[] | ((selectedRows: RowType[]) => Promise<SelectOption<ValueType>[]> | SelectOption<ValueType>[]);
+    initialSelectedValues?: (selectedRows: RowType[]) => any[];
 }
 export declare const GridFormMultiSelect: <RowType extends GridBaseRow, ValueType>(props: GridFormProps<RowType>) => JSX.Element;
 export {};

package/dist/src/components/gridForm/GridFormTextInput.d.ts

@@ -3,6 +3,7 @@ import { GenericCellEditorParams, GridFormProps } from "../GridCell";
 import { GridBaseRow } from "../Grid";
 export interface GridFormTextInputProps<RowType extends GridBaseRow> extends GenericCellEditorParams<RowType> {
     placeholder?: string;
+    units?: string;
     required?: boolean;
     maxlength?: number;
     width?: string | number;

package/dist/src/lui/TextInputFormatted.d.ts

@@ -7,8 +7,7 @@ export interface LuiTextInputProps {
     warning?: string | boolean | null;
     className?: string;
     value: string;
-    icon?: JSX.Element;
     placeholder?: string;
-    formatted: string;
+    formatted?: string;
 }
 export declare const TextInputFormatted: (props: LuiTextInputProps) => JSX.Element;

package/dist/src/stories/components/FormTest.d.ts

@@ -8,5 +8,6 @@ export interface IFormTestRow {
     nameType: string;
     numba: string;
     plan: string;
+    distance: number | null;
 }
 export declare const FormTest: <RowType extends GridBaseRow>(props: GridFormProps<RowType>) => JSX.Element;

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

@@ -1,6 +1,6 @@
 import { useMemo, useLayoutEffect, useEffect, createContext, memo, forwardRef, useRef, useContext, useState, useCallback, useReducer, cloneElement, useImperativeHandle, Fragment } from 'react';
 import { unstable_batchedUpdates, flushSync, createPortal } from 'react-dom';
-import { findIndex, isEmpty, castArray, remove, flatten, delay, sortBy, last, difference, xorBy } from 'lodash-es';
+import { findIndex, isEmpty, castArray, remove, flatten, delay, sortBy, last, difference, xorBy, fromPairs } from 'lodash-es';
 import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
 import { useTransition } from 'react-transition-state';
 import { AgGridReact } from 'ag-grid-react';
@@ -2422,9 +2422,11 @@ var GridCell = function (props) {
     })), { 
         // Default value formatter, otherwise react freaks out on objects
         valueFormatter: function (params) {
-            var types = ["number", "undefined", "boolean", "string"];
+            if (params.value == null)
+                return "-";
+            var types = ["number", "boolean", "string"];
             if (types.includes(typeof params.value))
-                return params.value;
+                return "".concat(params.value);
             else
                 return JSON.stringify(params.value);
         } }), props), { cellRenderer: GridCellRenderer, cellRendererParams: __assign({ originalCellRenderer: props.cellRenderer }, props.cellRendererParams) });
@@ -2457,7 +2459,7 @@ var GenericCellEditorComponentFr = function (props, _) {
     }); }, [field, saving, selectedRows, updatingCells]);
     if (cellEditorParams == null)
         return jsx(Fragment$1, {});
-    return (jsxs(Fragment$1, { children: [jsx("div", { children: colDef.cellRenderer ? jsx(colDef.cellRenderer, __assign({}, props, { saving: saving })) : props.value }), (cellEditorParams === null || cellEditorParams === void 0 ? void 0 : cellEditorParams.form) && (jsx(cellEditorParams.form, { cellEditorParams: props, updateValue: updateValue, saving: saving, formProps: formProps, value: value, field: field, selectedRows: selectedRows }))] }));
+    return (jsxs(Fragment$1, { children: [jsx("div", { children: colDef.cellRenderer ? jsx(colDef.cellRenderer, __assign({}, props, { saving: saving })) : props.value }), (cellEditorParams === null || cellEditorParams === void 0 ? void 0 : cellEditorParams.form) && (jsx(cellEditorParams.form, { cellEditorParams: props, updateValue: updateValue, saving: saving, formProps: formProps, data: data, value: value, field: field, selectedRows: selectedRows }))] }));
 };
 var GenericCellEditorComponent = forwardRef(GenericCellEditorComponentFr);
 
@@ -2556,19 +2558,17 @@ var GridFormMultiSelect = function (props) {
     var optionsInitialising = useRef(false);
     var _c = useState(), options = _c[0], setOptions = _c[1];
     var subSelectedValues = useRef({});
-    var _d = useState([]), selectedValues = _d[0], setSelectedValues = _d[1];
+    var _d = useState(function () {
+        return formProps.initialSelectedValues ? formProps.initialSelectedValues(props.selectedRows) : [];
+    }), selectedValues = _d[0], setSelectedValues = _d[1];
     var save = useCallback(function (selectedRows) { return __awaiter(void 0, void 0, void 0, function () {
         var values;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    values = {};
-                    selectedValues.forEach(function (value) {
-                        var _a;
-                        values[value] = (_a = subSelectedValues.current[value]) !== null && _a !== void 0 ? _a : true;
-                    });
+                    values = fromPairs(selectedValues.map(function (value) { var _a; return [value, (_a = subSelectedValues.current[value]) !== null && _a !== void 0 ? _a : true]; }));
                     if (!formProps.onSave) return [3 /*break*/, 2];
-                    return [4 /*yield*/, formProps.onSave({ selectedRows: selectedRows, values: selectedValues })];
+                    return [4 /*yield*/, formProps.onSave({ selectedRows: selectedRows, values: values })];
                 case 1: return [2 /*return*/, _a.sent()];
                 case 2: return [2 /*return*/, true];
             }
@@ -2856,7 +2856,7 @@ var css_248z = ".LuiTextInput {\n  margin-bottom: 0;\n}\n\n.LuiTextInput-formatt
 styleInject(css_248z);
 
 var TextInputFormatted = function (props) {
-    return (jsxs("div", __assign({ className: clsx("LuiTextInput Grid-popoverContainer", props.error && "hasError", props.warning && "hasWarning", props.className) }, { children: [jsxs("span", __assign({ className: "LuiTextInput-inputWrapper" }, { children: [jsx("input", __assign({ type: "text", className: "LuiTextInput-input", min: "0", value: props.value, onChange: props.onChange }, props.inputProps)), jsx("span", __assign({ className: "LuiTextInput-formatted" }, { children: props.formatted })), props.icon] })), props.error && (jsxs("span", __assign({ className: "LuiTextInput-error" }, { children: [jsx(LuiIcon, { alt: "error", name: "ic_error", className: "LuiTextInput-error-icon", size: "sm", status: "error" }), props.error] }))), props.warning && (jsxs("span", __assign({ className: "LuiTextInput-warning" }, { children: [jsx(LuiIcon, { alt: "warning", name: "ic_warning", className: "LuiTextInput-warning-icon", size: "sm", status: "warning" }), props.warning] })))] })));
+    return (jsxs("div", __assign({ className: clsx("LuiTextInput Grid-popoverContainer", props.error && "hasError", props.warning && "hasWarning", props.className) }, { children: [jsxs("span", __assign({ className: "LuiTextInput-inputWrapper" }, { children: [jsx("input", __assign({ type: "text", className: "LuiTextInput-input", min: "0", value: props.value, onChange: props.onChange }, props.inputProps)), jsx("span", __assign({ className: "LuiTextInput-formatted" }, { children: props.formatted }))] })), props.error && (jsxs("span", __assign({ className: "LuiTextInput-error" }, { children: [jsx(LuiIcon, { alt: "error", name: "ic_error", className: "LuiTextInput-error-icon", size: "sm", status: "error" }), props.error] }))), props.warning && (jsxs("span", __assign({ className: "LuiTextInput-warning" }, { children: [jsx(LuiIcon, { alt: "warning", name: "ic_warning", className: "LuiTextInput-warning-icon", size: "sm", status: "warning" }), props.warning] })))] })));
 };
 
 var GridFormEditBearing = function (props) {
@@ -3203,32 +3203,35 @@ var GridPopoverTextArea = function (colDef) {
 };
 
 var GridFormTextInput = function (props) {
-    var _a, _b;
+    var _a;
     var formProps = props.formProps;
-    var _c = useState((_a = props.value) !== null && _a !== void 0 ? _a : ""), value = _c[0], setValue = _c[1];
+    var initValue = props.value == null ? "" : "".concat(props.value);
+    var _b = useState(initValue), value = _b[0], setValue = _b[1];
     var invalid = useCallback(function () {
-        if (formProps.required && value.length == 0) {
+        var trimmedValue = value.trim();
+        if (formProps.required && trimmedValue.length == 0) {
             return "Some text is required";
         }
-        if (formProps.maxlength && value.length > formProps.maxlength) {
+        if (formProps.maxlength && trimmedValue.length > formProps.maxlength) {
             return "Text must be no longer than ".concat(formProps.maxlength, " characters");
         }
         if (formProps.validate) {
-            return formProps.validate(value);
+            return formProps.validate(trimmedValue);
         }
         return null;
     }, [formProps, value]);
     var save = useCallback(function (selectedRows) { return __awaiter(void 0, void 0, void 0, function () {
-        var field;
+        var trimmedValue, field;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
                     if (invalid())
                         return [2 /*return*/, false];
-                    if (props.value === (value !== null && value !== void 0 ? value : ""))
+                    trimmedValue = value.trim();
+                    if (initValue === trimmedValue)
                         return [2 /*return*/, true];
                     if (!formProps.onSave) return [3 /*break*/, 2];
-                    return [4 /*yield*/, formProps.onSave(selectedRows, value)];
+                    return [4 /*yield*/, formProps.onSave(selectedRows, trimmedValue)];
                 case 1: return [2 /*return*/, _a.sent()];
                 case 2:
                     field = props.field;
@@ -3236,13 +3239,13 @@ var GridFormTextInput = function (props) {
                         console.error("ColDef has no field set");
                         return [2 /*return*/, false];
                     }
-                    selectedRows.forEach(function (row) { return (row[field] = value); });
+                    selectedRows.forEach(function (row) { return (row[field] = trimmedValue); });
                     return [2 /*return*/, true];
             }
         });
-    }); }, [invalid, props.value, props.field, value, formProps]);
-    var _d = useGridPopoverHook(props, save), popoverWrapper = _d.popoverWrapper, triggerSave = _d.triggerSave;
-    return popoverWrapper(jsx("div", __assign({ style: { display: "flex", flexDirection: "row", width: (_b = formProps.width) !== null && _b !== void 0 ? _b : 240 }, className: "FormTest" }, { children: jsx(TextInputFormatted, { value: value, onChange: function (e) { return setValue(e.target.value); }, error: invalid(), formatted: "", inputProps: {
+    }); }, [invalid, value, initValue, formProps, props.field]);
+    var _c = useGridPopoverHook(props, save), popoverWrapper = _c.popoverWrapper, triggerSave = _c.triggerSave;
+    return popoverWrapper(jsx("div", __assign({ style: { display: "flex", flexDirection: "row", width: (_a = formProps.width) !== null && _a !== void 0 ? _a : 240 }, className: "FormTest" }, { children: jsx(TextInputFormatted, { value: value, onChange: function (e) { return setValue(e.target.value); }, error: invalid(), formatted: formProps.units, inputProps: {
                 style: { width: "100%" },
                 placeholder: formProps.placeholder,
                 onKeyDown: function (e) { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
@@ -3265,5 +3268,5 @@ var GridSubComponentTextArea = function (props) {
     return (jsx("div", __assign({ className: "FreeTextInput LuiDeprecatedForms" }, { children: jsx("textarea", { autoFocus: true, maxLength: 10000, spellCheck: true, className: "free-text-input", onChange: function (e) { return setValue(e.target.value); }, defaultValue: value }) })));
 };
 
-export { ComponentLoadingWrapper, ControlledMenu, FocusableItem, GenericMultiEditCellClass, Grid, GridCell, GridContext, GridContextProvider, GridFormDropDown, GridFormEditBearing, GridFormMessage, GridFormMultiSelect, GridFormPopoutMenu, GridFormTextArea, GridFormTextInput, GridHeaderSelect, GridIcon, GridLoadableCell, GridPopoutEditMultiSelect, GridPopoverEditBearing, GridPopoverEditBearingCorrection, GridPopoverEditDropDown, GridPopoverMenu, GridPopoverMessage, GridPopoverTextArea, GridPopoverTextInput, GridRenderPopoutMenuCell, GridRendererGenericCell, GridSubComponentTextArea, Menu, MenuButton, MenuDivider, MenuGroup, MenuHeader, MenuItem, MenuRadioGroup, SubMenu, TextAreaInput, TextInputFormatted, UpdatingContext, UpdatingContextProvider, bearingCorrectionValueFormatter, bearingNumberParser, bearingStringValidator, bearingValueFormatter, convertDDToDMS, hasParentClass, isFloat, isNotEmpty, useGridPopoverHook, useMenuState, usePostSortRowsHook, wait };
+export { ComponentLoadingWrapper, ControlledMenu, FocusableItem, GenericCellEditorComponent, GenericCellEditorComponentFr, GenericMultiEditCellClass, Grid, GridCell, GridCellRenderer, GridContext, GridContextProvider, GridFormDropDown, GridFormEditBearing, GridFormMessage, GridFormMultiSelect, GridFormPopoutMenu, GridFormTextArea, GridFormTextInput, GridHeaderSelect, GridIcon, GridLoadableCell, GridPopoutEditMultiSelect, GridPopoverEditBearing, GridPopoverEditBearingCorrection, GridPopoverEditDropDown, GridPopoverMenu, GridPopoverMessage, GridPopoverTextArea, GridPopoverTextInput, GridRenderPopoutMenuCell, GridRendererGenericCell, GridSubComponentTextArea, Menu, MenuButton, MenuDivider, MenuGroup, MenuHeader, MenuItem, MenuRadioGroup, SubMenu, TextAreaInput, TextInputFormatted, UpdatingContext, UpdatingContextProvider, bearingCorrectionValueFormatter, bearingNumberParser, bearingStringValidator, bearingValueFormatter, convertDDToDMS, hasParentClass, isFloat, isNotEmpty, useGridPopoverHook, useMenuState, usePostSortRowsHook, wait };
 //# sourceMappingURL=step-ag-grid.esm.js.map