@gpa-gemstone/react-forms 1.1.87 → 1.1.88
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/lib/Input.js +5 -3
- package/lib/SearchableSelect.d.ts +4 -0
- package/lib/SearchableSelect.js +21 -11
- package/package.json +1 -1
package/lib/Input.js
CHANGED
|
@@ -51,9 +51,11 @@ function Input(props) {
|
|
|
51
51
|
}, []);
|
|
52
52
|
// Handle changes to the record's field value.
|
|
53
53
|
React.useEffect(function () {
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
54
|
+
var rawValue = props.Record[props.Field] == null ? '' : props.Record[props.Field].toString();
|
|
55
|
+
if ((props.Type === 'number' || props.Type === 'integer') && !internal.current)
|
|
56
|
+
setHeldVal(rawValue);
|
|
57
|
+
else if (rawValue !== heldVal)
|
|
58
|
+
setHeldVal(rawValue);
|
|
57
59
|
internal.current = false;
|
|
58
60
|
}, [props.Record[props.Field]]);
|
|
59
61
|
// Handle blur event (loss of focus) on the input.
|
|
@@ -30,6 +30,10 @@ interface IProps<T> extends Gemstone.TSX.Interfaces.IBaseFormProps<T> {
|
|
|
30
30
|
*/
|
|
31
31
|
BtnStyle?: React.CSSProperties;
|
|
32
32
|
GetLabel?: () => [Promise<string>, () => void];
|
|
33
|
+
/**
|
|
34
|
+
* Flag to reset search text to an empty string when a user selects an option. Defaulting to false
|
|
35
|
+
*/
|
|
36
|
+
ResetSearchOnSelect?: boolean;
|
|
33
37
|
}
|
|
34
38
|
export default function SearchableSelect<T>(props: IProps<T>): JSX.Element;
|
|
35
39
|
export {};
|
package/lib/SearchableSelect.js
CHANGED
|
@@ -26,19 +26,26 @@ exports.default = SearchableSelect;
|
|
|
26
26
|
var React = require("react");
|
|
27
27
|
var StylableSelect_1 = require("./StylableSelect");
|
|
28
28
|
var gpa_symbols_1 = require("@gpa-gemstone/gpa-symbols");
|
|
29
|
+
var getInitialSearchText = function (useBlankString, recordValue) {
|
|
30
|
+
return useBlankString ? '' : recordValue;
|
|
31
|
+
};
|
|
29
32
|
function SearchableSelect(props) {
|
|
30
|
-
var _a, _b
|
|
31
|
-
var
|
|
32
|
-
var
|
|
33
|
-
var
|
|
34
|
-
var
|
|
33
|
+
var _a, _b;
|
|
34
|
+
var _c = React.useState(function () { var _a, _b, _c; return getInitialSearchText((_a = props.ResetSearchOnSelect) !== null && _a !== void 0 ? _a : false, (_c = (_b = props.Record[props.Field]) === null || _b === void 0 ? void 0 : _b.toString()) !== null && _c !== void 0 ? _c : ''); }), search = _c[0], setSearch = _c[1];
|
|
35
|
+
var _d = React.useState((_b = (_a = props.Record[props.Field]) === null || _a === void 0 ? void 0 : _a.toString()) !== null && _b !== void 0 ? _b : ''), label = _d[0], setLabel = _d[1];
|
|
36
|
+
var _e = React.useState([]), results = _e[0], setResults = _e[1];
|
|
37
|
+
var _f = React.useState(false), loading = _f[0], setLoading = _f[1];
|
|
35
38
|
React.useEffect(function () {
|
|
36
|
-
var _a, _b;
|
|
37
|
-
if (props.GetLabel === undefined)
|
|
38
|
-
|
|
39
|
+
var _a, _b, _c;
|
|
40
|
+
if (props.GetLabel === undefined) {
|
|
41
|
+
if ((_a = props.ResetSearchOnSelect) !== null && _a !== void 0 ? _a : false)
|
|
42
|
+
setSearch('');
|
|
43
|
+
else
|
|
44
|
+
setLabel((_c = (_b = props.Record[props.Field]) === null || _b === void 0 ? void 0 : _b.toString()) !== null && _c !== void 0 ? _c : '');
|
|
45
|
+
}
|
|
39
46
|
else {
|
|
40
47
|
setLoading(true);
|
|
41
|
-
var
|
|
48
|
+
var _d = props.GetLabel(), handle = _d[0], callback = _d[1];
|
|
42
49
|
handle.then(function (lab) {
|
|
43
50
|
setLabel(lab);
|
|
44
51
|
setSearch(lab);
|
|
@@ -70,14 +77,17 @@ function SearchableSelect(props) {
|
|
|
70
77
|
};
|
|
71
78
|
}, [search]);
|
|
72
79
|
var update = React.useCallback(function (record, selectedOption) {
|
|
73
|
-
var _a, _b;
|
|
80
|
+
var _a, _b, _c;
|
|
74
81
|
var stringVal = (_b = (_a = record[props.Field]) === null || _a === void 0 ? void 0 : _a.toString()) !== null && _b !== void 0 ? _b : '';
|
|
75
82
|
var newLabel = stringVal;
|
|
76
83
|
if (!React.isValidElement(selectedOption.Element))
|
|
77
84
|
newLabel = selectedOption.Element;
|
|
78
85
|
setLabel(newLabel);
|
|
79
86
|
props.Setter(record);
|
|
80
|
-
|
|
87
|
+
if ((_c = props.ResetSearchOnSelect) !== null && _c !== void 0 ? _c : false)
|
|
88
|
+
setSearch('');
|
|
89
|
+
else
|
|
90
|
+
setSearch(newLabel);
|
|
81
91
|
}, [props.Setter, props.Field, label]);
|
|
82
92
|
var options = React.useMemo(function () {
|
|
83
93
|
var _a, _b;
|