@gpa-gemstone/react-forms 1.1.49 → 1.1.50
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/DatePicker.js +38 -6
- package/lib/DateTimeUI/Calender.js +1 -1
- package/package.json +1 -1
package/lib/DatePicker.js
CHANGED
|
@@ -50,9 +50,10 @@ function DateTimePicker(props) {
|
|
|
50
50
|
// Adds a buffer between the outside props and what the box is reading to prevent box overwriting every render with a keystroke
|
|
51
51
|
var _c = React.useState(parse(props.Record).format(boxFormat)), boxRecord = _c[0], setBoxRecord = _c[1];
|
|
52
52
|
var _d = React.useState(parse(props.Record)), pickerRecord = _d[0], setPickerRecord = _d[1];
|
|
53
|
-
var _e = React.useState(
|
|
54
|
-
var _f = React.useState(
|
|
55
|
-
var _g = React.useState(0),
|
|
53
|
+
var _e = React.useState(""), feedbackMessage = _e[0], setFeedbackMessage = _e[1];
|
|
54
|
+
var _f = React.useState(false), showOverlay = _f[0], setShowOverlay = _f[1];
|
|
55
|
+
var _g = React.useState(0), top = _g[0], setTop = _g[1];
|
|
56
|
+
var _h = React.useState(0), left = _h[0], setLeft = _h[1];
|
|
56
57
|
React.useEffect(function () {
|
|
57
58
|
setGuid((0, helper_functions_1.CreateGuid)());
|
|
58
59
|
}, []);
|
|
@@ -66,7 +67,22 @@ function DateTimePicker(props) {
|
|
|
66
67
|
var _c;
|
|
67
68
|
if (!recordChange.current)
|
|
68
69
|
return;
|
|
69
|
-
var
|
|
70
|
+
var date = moment(boxRecord, boxFormat);
|
|
71
|
+
var validStartDate = moment("1753-01-01", "YYYY-MM-DD");
|
|
72
|
+
var valid = true;
|
|
73
|
+
// Invalid date format
|
|
74
|
+
if (!date.isValid()) {
|
|
75
|
+
setFeedbackMessage("Please enter a date as " + boxFormat);
|
|
76
|
+
valid = false;
|
|
77
|
+
}
|
|
78
|
+
// Date before 1753
|
|
79
|
+
else if (date.isBefore(validStartDate)) {
|
|
80
|
+
setFeedbackMessage("Date cannot be before " + validStartDate.format(boxFormat));
|
|
81
|
+
valid = false;
|
|
82
|
+
}
|
|
83
|
+
else {
|
|
84
|
+
setFeedbackMessage("");
|
|
85
|
+
}
|
|
70
86
|
if (((_c = props.AllowEmpty) !== null && _c !== void 0 ? _c : false) && boxRecord.length === 0 && !valid && props.Record !== null)
|
|
71
87
|
props.Setter(__assign(__assign({}, props.Record), (_a = {}, _a[props.Field] = null, _a)));
|
|
72
88
|
if (valid && parse(props.Record).format(boxFormat) !== boxRecord)
|
|
@@ -134,10 +150,26 @@ function DateTimePicker(props) {
|
|
|
134
150
|
return "YYYY-MM-DD";
|
|
135
151
|
}
|
|
136
152
|
}
|
|
153
|
+
function getFeedbackMessage() {
|
|
154
|
+
if (feedbackMessage.length != 0) {
|
|
155
|
+
return feedbackMessage;
|
|
156
|
+
}
|
|
157
|
+
else if (props.Feedback == null || props.Feedback.length == 0) {
|
|
158
|
+
return props.Field.toString();
|
|
159
|
+
}
|
|
160
|
+
else {
|
|
161
|
+
return props.Field.toString() + " is a required field.";
|
|
162
|
+
}
|
|
163
|
+
}
|
|
137
164
|
var showLabel = props.Label !== "";
|
|
138
165
|
var showHelpIcon = props.Help !== undefined;
|
|
139
166
|
var label = props.Label === undefined ? props.Field : props.Label;
|
|
140
167
|
var step = props.Accuracy === 'millisecond' ? '0.001' : (props.Accuracy === 'minute' ? '60' : '1');
|
|
168
|
+
var IsValid = function () {
|
|
169
|
+
if (feedbackMessage.length > 0)
|
|
170
|
+
return false;
|
|
171
|
+
return props.Valid(props.Field);
|
|
172
|
+
};
|
|
141
173
|
return (React.createElement("div", { className: "form-group", ref: divRef },
|
|
142
174
|
showHelpIcon || showLabel ?
|
|
143
175
|
React.createElement("label", null,
|
|
@@ -155,12 +187,12 @@ function DateTimePicker(props) {
|
|
|
155
187
|
showHelpIcon ?
|
|
156
188
|
React.createElement(HelperMessage_1.default, { Show: showHelp, Target: guid }, props.Help)
|
|
157
189
|
: null,
|
|
158
|
-
React.createElement("input", { "data-help": guid, className: "gpa-gemstone-datetime form-control" + (
|
|
190
|
+
React.createElement("input", { "data-help": guid, className: "gpa-gemstone-datetime form-control " + (IsValid() ? '' : 'is-invalid'), type: props.Type === undefined ? 'date' : props.Type, onChange: function (evt) {
|
|
159
191
|
var _a;
|
|
160
192
|
setBoxRecord((_a = evt.target.value) !== null && _a !== void 0 ? _a : "");
|
|
161
193
|
recordChange.current = true;
|
|
162
194
|
}, onFocus: function () { setShowOverlay(true); }, value: boxRecord, disabled: props.Disabled === undefined ? false : props.Disabled, onClick: function (e) { e.preventDefault(); }, step: step }),
|
|
163
|
-
React.createElement("div", { className: "invalid-feedback" },
|
|
195
|
+
React.createElement("div", { className: "invalid-feedback" }, getFeedbackMessage()),
|
|
164
196
|
React.createElement(DateTimePopup_1.default, { Setter: function (d) { setPickerRecord(d); recordChange.current = true; if (props.Type === 'date')
|
|
165
197
|
setShowOverlay(false); }, Show: showOverlay, DateTime: pickerRecord, Valid: props.Valid(props.Field), Top: top, Center: left, Type: props.Type === undefined ? 'date' : props.Type, Accuracy: props.Accuracy })));
|
|
166
198
|
}
|
|
@@ -37,7 +37,7 @@ function Calender(props) {
|
|
|
37
37
|
React.useEffect(function () {
|
|
38
38
|
var d1 = moment([year, month, 1]).startOf('week');
|
|
39
39
|
var w = [];
|
|
40
|
-
while (d1.month() <= month && d1.year() === year) {
|
|
40
|
+
while ((d1.month() <= month && d1.year() === year) || (d1.year() < year)) {
|
|
41
41
|
w.push({
|
|
42
42
|
sunday: moment(d1),
|
|
43
43
|
monday: moment(d1).add(1, 'day'),
|