@linzjs/step-ag-grid 4.0.1 → 4.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +23 -19
- package/dist/index.js.map +1 -1
- package/dist/src/components/gridForm/GridFormSubComponentTextArea.d.ts +3 -2
- package/dist/src/components/gridForm/GridFormSubComponentTextInput.d.ts +3 -2
- package/dist/src/components/gridForm/GridFormTextArea.d.ts +1 -1
- package/dist/src/components/gridForm/GridFormTextInput.d.ts +1 -1
- package/dist/src/contexts/GridSubComponentContext.d.ts +1 -0
- package/dist/src/utils/textValidator.d.ts +4 -3
- package/dist/step-ag-grid.esm.js +23 -19
- package/dist/step-ag-grid.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/gridForm/GridFormDropDown.tsx +2 -1
- package/src/components/gridForm/GridFormMultiSelect.tsx +2 -1
- package/src/components/gridForm/GridFormPopoverMenu.tsx +2 -1
- package/src/components/gridForm/GridFormSubComponentTextArea.tsx +9 -4
- package/src/components/gridForm/GridFormSubComponentTextInput.tsx +9 -4
- package/src/components/gridForm/GridFormTextArea.tsx +5 -3
- package/src/components/gridForm/GridFormTextInput.tsx +5 -3
- package/src/contexts/GridSubComponentContext.ts +2 -0
- package/src/utils/textValidator.ts +10 -4
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { CellEditorCommon } from "../GridCell";
|
|
3
3
|
import { TextInputValidatorProps } from "../../utils/textValidator";
|
|
4
|
-
|
|
4
|
+
import { GridBaseRow } from "../Grid";
|
|
5
|
+
export interface GridSubComponentTextAreaProps<RowType extends GridBaseRow> extends TextInputValidatorProps<RowType>, CellEditorCommon {
|
|
5
6
|
placeholder?: string;
|
|
6
7
|
width?: string | number;
|
|
7
8
|
defaultValue: string;
|
|
8
9
|
className?: string;
|
|
9
10
|
helpText?: string;
|
|
10
11
|
}
|
|
11
|
-
export declare const GridFormSubComponentTextArea: (props: GridSubComponentTextAreaProps) => JSX.Element;
|
|
12
|
+
export declare const GridFormSubComponentTextArea: <RowType extends GridBaseRow>(props: GridSubComponentTextAreaProps<RowType>) => JSX.Element;
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { TextInputValidatorProps } from "../../utils/textValidator";
|
|
3
3
|
import { CellEditorCommon } from "../GridCell";
|
|
4
|
-
|
|
4
|
+
import { GridBaseRow } from "../Grid";
|
|
5
|
+
export interface GridFormSubComponentTextInputProps<RowType extends GridBaseRow> extends TextInputValidatorProps<RowType>, CellEditorCommon {
|
|
5
6
|
placeholder?: string;
|
|
6
7
|
width?: string | number;
|
|
7
8
|
defaultValue: string;
|
|
8
9
|
helpText?: string;
|
|
9
10
|
}
|
|
10
|
-
export declare const GridFormSubComponentTextInput: (props: GridFormSubComponentTextInputProps) => JSX.Element;
|
|
11
|
+
export declare const GridFormSubComponentTextInput: <RowType extends GridBaseRow>(props: GridFormSubComponentTextInputProps<RowType>) => JSX.Element;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { GridBaseRow } from "../Grid";
|
|
3
3
|
import { CellEditorCommon } from "../GridCell";
|
|
4
4
|
import { TextInputValidatorProps } from "../../utils/textValidator";
|
|
5
|
-
export interface GridFormTextAreaProps<RowType extends GridBaseRow> extends TextInputValidatorProps
|
|
5
|
+
export interface GridFormTextAreaProps<RowType extends GridBaseRow> extends TextInputValidatorProps<RowType>, CellEditorCommon {
|
|
6
6
|
placeholder?: string;
|
|
7
7
|
width?: string | number;
|
|
8
8
|
onSave?: (selectedRows: RowType[], value: string) => Promise<boolean>;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { GridBaseRow } from "../Grid";
|
|
3
3
|
import { CellEditorCommon } from "../GridCell";
|
|
4
4
|
import { TextInputValidatorProps } from "../../utils/textValidator";
|
|
5
|
-
export interface GridFormTextInputProps<RowType extends GridBaseRow> extends TextInputValidatorProps
|
|
5
|
+
export interface GridFormTextInputProps<RowType extends GridBaseRow> extends TextInputValidatorProps<RowType>, CellEditorCommon {
|
|
6
6
|
placeholder?: string;
|
|
7
7
|
units?: string;
|
|
8
8
|
width?: string | number;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
import { GridBaseRow } from "../components/Grid";
|
|
2
|
+
export interface TextInputValidatorProps<RowType extends GridBaseRow> {
|
|
2
3
|
required?: boolean;
|
|
3
4
|
maxLength?: number;
|
|
4
|
-
validate?: (value: string) => string | null;
|
|
5
|
+
validate?: (value: string, data: RowType) => string | null;
|
|
5
6
|
}
|
|
6
|
-
export declare const TextInputValidator: (props: TextInputValidatorProps
|
|
7
|
+
export declare const TextInputValidator: <RowType extends GridBaseRow>(props: TextInputValidatorProps<RowType>, value: string | null, data: RowType) => string | null;
|
package/dist/step-ag-grid.esm.js
CHANGED
|
@@ -2244,6 +2244,7 @@ var GridPopoverContextProvider = function (_a) {
|
|
|
2244
2244
|
|
|
2245
2245
|
var GridSubComponentContext = createContext({
|
|
2246
2246
|
value: "GridSubComponentContext value no context",
|
|
2247
|
+
data: {},
|
|
2247
2248
|
setValue: function () {
|
|
2248
2249
|
console.error("GridSubComponentContext setValue no context");
|
|
2249
2250
|
},
|
|
@@ -3015,7 +3016,7 @@ var fieldToString = function (field) {
|
|
|
3015
3016
|
return typeof field == "symbol" ? field.toString() : "".concat(field);
|
|
3016
3017
|
};
|
|
3017
3018
|
var GridFormDropDown = function (props) {
|
|
3018
|
-
var _a = useGridPopoverContext(), selectedRows = _a.selectedRows, field = _a.field, updateValue = _a.updateValue;
|
|
3019
|
+
var _a = useGridPopoverContext(), selectedRows = _a.selectedRows, field = _a.field, updateValue = _a.updateValue, data = _a.data;
|
|
3019
3020
|
var stopEditing = useContext(GridContext).stopEditing;
|
|
3020
3021
|
var _b = useState(""), filter = _b[0], setFilter = _b[1];
|
|
3021
3022
|
var _c = useState([]), filteredValues = _c[0], setFilteredValues = _c[1];
|
|
@@ -3208,6 +3209,7 @@ var GridFormDropDown = function (props) {
|
|
|
3208
3209
|
selectItemHandler(item.value).then();
|
|
3209
3210
|
}
|
|
3210
3211
|
} }, { children: (_a = item.label) !== null && _a !== void 0 ? _a : (item.value == null ? "<".concat(item.value, ">") : "".concat(item.value)) }), "".concat(fieldToString(field), "-").concat(index)), item.subComponent && selectedSubComponent === item && (jsx(FocusableItem, __assign({ className: "LuiDeprecatedForms" }, { children: function (ref) { return (jsx(GridSubComponentContext.Provider, __assign({ value: {
|
|
3212
|
+
data: data,
|
|
3211
3213
|
value: subSelectedValue,
|
|
3212
3214
|
setValue: function (value) {
|
|
3213
3215
|
setSubSelectedValue(value);
|
|
@@ -3226,18 +3228,18 @@ var GridFormDropDown = function (props) {
|
|
|
3226
3228
|
};
|
|
3227
3229
|
|
|
3228
3230
|
var GridFormMultiSelect = function (props) {
|
|
3229
|
-
var
|
|
3231
|
+
var _a = useGridPopoverContext(), selectedRows = _a.selectedRows, data = _a.data;
|
|
3230
3232
|
var initialiseValues = useMemo(function () {
|
|
3231
3233
|
var r = props.initialSelectedValues && props.initialSelectedValues(selectedRows);
|
|
3232
3234
|
// convert array of strings to object<value,null>
|
|
3233
3235
|
return Array.isArray(r) ? fromPairs(r.map(function (v) { return [v, null]; })) : r;
|
|
3234
3236
|
}, [props, selectedRows]);
|
|
3235
3237
|
var subComponentIsValid = useRef({});
|
|
3236
|
-
var
|
|
3237
|
-
var
|
|
3238
|
-
var
|
|
3238
|
+
var _b = useState(function () { return initialiseValues !== null && initialiseValues !== void 0 ? initialiseValues : {}; }), selectedValues = _b[0], setSelectedValues = _b[1];
|
|
3239
|
+
var _c = useState(""), filter = _c[0], setFilter = _c[1];
|
|
3240
|
+
var _d = useState([]), filteredValues = _d[0], setFilteredValues = _d[1];
|
|
3239
3241
|
var optionsInitialising = useRef(false);
|
|
3240
|
-
var
|
|
3242
|
+
var _e = useState(), options = _e[0], setOptions = _e[1];
|
|
3241
3243
|
var save = useCallback(function (selectedRows) { return __awaiter(void 0, void 0, void 0, function () {
|
|
3242
3244
|
var validations, notValid, menuOptionSubValueResult;
|
|
3243
3245
|
return __generator(this, function (_a) {
|
|
@@ -3329,10 +3331,10 @@ var GridFormMultiSelect = function (props) {
|
|
|
3329
3331
|
setSelectedValues(__assign(__assign({}, selectedValues), (_a = {}, _a["".concat(item.value)] = null, _a)));
|
|
3330
3332
|
}
|
|
3331
3333
|
}, [selectedValues]);
|
|
3332
|
-
var
|
|
3334
|
+
var _f = useGridPopoverHook({
|
|
3333
3335
|
className: props.className,
|
|
3334
3336
|
save: save
|
|
3335
|
-
}), popoverWrapper =
|
|
3337
|
+
}), popoverWrapper = _f.popoverWrapper, lastInputKeyboardEventHandlers = _f.lastInputKeyboardEventHandlers, triggerSave = _f.triggerSave;
|
|
3336
3338
|
return popoverWrapper(jsx(ComponentLoadingWrapper, __assign({ loading: !options, className: "GridFormMultiSelect-container" }, { children: jsxs(Fragment$1, { children: [options && props.filtered && (jsxs(Fragment$1, { children: [jsx(FocusableItem, __assign({ className: "filter-item" }, { children: function (_a) {
|
|
3337
3339
|
var _b;
|
|
3338
3340
|
var ref = _a.ref;
|
|
@@ -3352,6 +3354,7 @@ var GridFormMultiSelect = function (props) {
|
|
|
3352
3354
|
/*Do nothing, change handled by menuItem*/
|
|
3353
3355
|
} }) })), "".concat(item.value) in selectedValues && item.subComponent && (jsx(FocusableItem, __assign({ className: "LuiDeprecatedForms" }, { children: function (_) {
|
|
3354
3356
|
return item.subComponent && (jsx(GridSubComponentContext.Provider, __assign({ value: {
|
|
3357
|
+
data: data,
|
|
3355
3358
|
value: selectedValues["".concat(item.value)],
|
|
3356
3359
|
setValue: function (value) {
|
|
3357
3360
|
var _a;
|
|
@@ -3380,7 +3383,7 @@ var PopoutMenuSeparator = Object.freeze({ __isMenuSeparator__: true });
|
|
|
3380
3383
|
* you need a useMemo around your columnDefs
|
|
3381
3384
|
*/
|
|
3382
3385
|
var GridFormPopoverMenu = function (props) {
|
|
3383
|
-
var _a = useGridPopoverContext(), selectedRows = _a.selectedRows, updateValue = _a.updateValue;
|
|
3386
|
+
var _a = useGridPopoverContext(), selectedRows = _a.selectedRows, updateValue = _a.updateValue, data = _a.data;
|
|
3384
3387
|
var optionsInitialising = useRef(false);
|
|
3385
3388
|
var _b = useState(), options = _b[0], setOptions = _b[1];
|
|
3386
3389
|
// Save triggers during async action processing which triggers another action(), this ref blocks that
|
|
@@ -3498,6 +3501,7 @@ var GridFormPopoverMenu = function (props) {
|
|
|
3498
3501
|
return popoverWrapper(jsx(ComponentLoadingWrapper, __assign({ loading: !filteredOptions, className: "GridFormPopupMenu" }, { children: jsx(Fragment$1, { children: options === null || options === void 0 ? void 0 : options.map(function (item, index) {
|
|
3499
3502
|
return item.label === PopoutMenuSeparator ? (jsx(MenuDivider, {}, "$$divider_".concat(index))) : (!item.hidden && (jsxs(Fragment, { children: [jsx(MenuItem, __assign({ onClick: function (e) { return onMenuItemClick(e, item); }, disabled: !!item.disabled || !(filteredOptions === null || filteredOptions === void 0 ? void 0 : filteredOptions.includes(item)), title: item.disabled && typeof item.disabled !== "boolean" ? item.disabled : "" }, { children: item.label }), "".concat(item.label)), item.subComponent && subComponentSelected === item && (jsx(FocusableItem, __assign({ className: "LuiDeprecatedForms" }, { children: function (_) {
|
|
3500
3503
|
return item.subComponent && (jsx(GridSubComponentContext.Provider, __assign({ value: {
|
|
3504
|
+
data: data,
|
|
3501
3505
|
value: subSelectedValue,
|
|
3502
3506
|
setValue: function (value) {
|
|
3503
3507
|
setSubSelectedValue(value);
|
|
@@ -3802,7 +3806,7 @@ var TextAreaInput = function (props) {
|
|
|
3802
3806
|
} }, { children: props.helpText })))] })));
|
|
3803
3807
|
};
|
|
3804
3808
|
|
|
3805
|
-
var TextInputValidator = function (props, value) {
|
|
3809
|
+
var TextInputValidator = function (props, value, data) {
|
|
3806
3810
|
if (value == null)
|
|
3807
3811
|
return null;
|
|
3808
3812
|
// This can happen because subcomponent is invoked without type safety
|
|
@@ -3816,17 +3820,17 @@ var TextInputValidator = function (props, value) {
|
|
|
3816
3820
|
return "Text must be no longer than ".concat(props.maxLength, " characters");
|
|
3817
3821
|
}
|
|
3818
3822
|
if (props.validate) {
|
|
3819
|
-
return props.validate(value);
|
|
3823
|
+
return props.validate(value, data);
|
|
3820
3824
|
}
|
|
3821
3825
|
return null;
|
|
3822
3826
|
};
|
|
3823
3827
|
|
|
3824
3828
|
var GridFormTextArea = function (props) {
|
|
3825
3829
|
var _a, _b;
|
|
3826
|
-
var _c = useGridPopoverContext(), field = _c.field, initialVale = _c.value;
|
|
3830
|
+
var _c = useGridPopoverContext(), field = _c.field, initialVale = _c.value, data = _c.data;
|
|
3827
3831
|
var _d = useState(initialVale != null ? "".concat(initialVale) : ""), value = _d[0], setValue = _d[1];
|
|
3828
3832
|
var helpText = (_a = props.helpText) !== null && _a !== void 0 ? _a : "Press tab to save";
|
|
3829
|
-
var invalid = useCallback(function () { return TextInputValidator(props, value); }, [props, value]);
|
|
3833
|
+
var invalid = useCallback(function () { return TextInputValidator(props, value, data); }, [props, value, data]);
|
|
3830
3834
|
var save = useCallback(function (selectedRows) { return __awaiter(void 0, void 0, void 0, function () {
|
|
3831
3835
|
return __generator(this, function (_a) {
|
|
3832
3836
|
switch (_a.label) {
|
|
@@ -3858,11 +3862,11 @@ var GridPopoverTextArea = function (colDef, params) { return GridCell(colDef, __
|
|
|
3858
3862
|
|
|
3859
3863
|
var GridFormTextInput = function (props) {
|
|
3860
3864
|
var _a, _b;
|
|
3861
|
-
var _c = useGridPopoverContext(), field = _c.field, initialVale = _c.value;
|
|
3865
|
+
var _c = useGridPopoverContext(), field = _c.field, initialVale = _c.value, data = _c.data;
|
|
3862
3866
|
var helpText = (_a = props.helpText) !== null && _a !== void 0 ? _a : "Press enter or tab to save";
|
|
3863
3867
|
var initValue = initialVale == null ? "" : "".concat(initialVale);
|
|
3864
3868
|
var _d = useState(initValue), value = _d[0], setValue = _d[1];
|
|
3865
|
-
var invalid = useCallback(function () { return TextInputValidator(props, value); }, [props, value]);
|
|
3869
|
+
var invalid = useCallback(function () { return TextInputValidator(props, value, data); }, [data, props, value]);
|
|
3866
3870
|
var save = useCallback(function (selectedRows) { return __awaiter(void 0, void 0, void 0, function () {
|
|
3867
3871
|
var trimmedValue;
|
|
3868
3872
|
return __generator(this, function (_a) {
|
|
@@ -3898,14 +3902,14 @@ var GridPopoverTextInput = function (colDef, params) {
|
|
|
3898
3902
|
|
|
3899
3903
|
var GridFormSubComponentTextInput = function (props) {
|
|
3900
3904
|
var _a;
|
|
3901
|
-
var _b = useContext(GridSubComponentContext), value = _b.value, setValue = _b.setValue, setValid = _b.setValid, triggerSave = _b.triggerSave;
|
|
3905
|
+
var _b = useContext(GridSubComponentContext), value = _b.value, setValue = _b.setValue, setValid = _b.setValid, triggerSave = _b.triggerSave, data = _b.data;
|
|
3902
3906
|
var helpText = (_a = props.helpText) !== null && _a !== void 0 ? _a : "Press enter or tab to save";
|
|
3903
3907
|
// If is not initialised yet as it's just been created then set the default value
|
|
3904
3908
|
useEffect(function () {
|
|
3905
3909
|
if (value == null)
|
|
3906
3910
|
setValue(props.defaultValue);
|
|
3907
3911
|
}, [props.defaultValue, setValue, value]);
|
|
3908
|
-
var invalid = useCallback(function () { return TextInputValidator(props, value); }, [props, value]);
|
|
3912
|
+
var invalid = useCallback(function () { return TextInputValidator(props, value, data); }, [data, props, value]);
|
|
3909
3913
|
useEffect(function () {
|
|
3910
3914
|
setValid(value != null && invalid() == null);
|
|
3911
3915
|
}, [setValid, invalid, value]);
|
|
@@ -3932,14 +3936,14 @@ var GridFormSubComponentTextInput = function (props) {
|
|
|
3932
3936
|
|
|
3933
3937
|
var GridFormSubComponentTextArea = function (props) {
|
|
3934
3938
|
var _a;
|
|
3935
|
-
var _b = useContext(GridSubComponentContext), value = _b.value, setValue = _b.setValue, setValid = _b.setValid, triggerSave = _b.triggerSave;
|
|
3939
|
+
var _b = useContext(GridSubComponentContext), value = _b.value, data = _b.data, setValue = _b.setValue, setValid = _b.setValid, triggerSave = _b.triggerSave;
|
|
3936
3940
|
var helpText = (_a = props.helpText) !== null && _a !== void 0 ? _a : "Press tab to save";
|
|
3937
3941
|
// If is not initialised yet as it's just been created then set the default value
|
|
3938
3942
|
useEffect(function () {
|
|
3939
3943
|
if (value == null)
|
|
3940
3944
|
setValue(props.defaultValue);
|
|
3941
3945
|
}, [props.defaultValue, setValue, value]);
|
|
3942
|
-
var invalid = useCallback(function () { return TextInputValidator(props, value); }, [props, value]);
|
|
3946
|
+
var invalid = useCallback(function () { return TextInputValidator(props, value, data); }, [data, props, value]);
|
|
3943
3947
|
useEffect(function () {
|
|
3944
3948
|
setValid(value != null && invalid() == null);
|
|
3945
3949
|
}, [setValid, invalid, value]);
|