@gpa-gemstone/react-forms 1.1.81 → 1.1.82
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 +26 -11
- package/lib/DateTimeUI/DateTimePopup.js +2 -2
- package/lib/StylableSelect.js +0 -1
- package/package.json +1 -1
package/lib/DatePicker.js
CHANGED
|
@@ -51,19 +51,16 @@ function DateTimePicker(props) {
|
|
|
51
51
|
var parse = function (r) { return moment(props.Record[props.Field], recordFormat); };
|
|
52
52
|
// State and ref declarations.
|
|
53
53
|
var divRef = React.useRef(null);
|
|
54
|
-
var
|
|
55
|
-
var
|
|
54
|
+
var guid = React.useState((0, helper_functions_1.CreateGuid)())[0];
|
|
55
|
+
var _a = React.useState(false), showHelp = _a[0], setShowHelp = _a[1];
|
|
56
56
|
// Adds a buffer between the outside props and what the box is reading to prevent box overwriting every render with a keystroke
|
|
57
|
-
var
|
|
58
|
-
var
|
|
59
|
-
var
|
|
60
|
-
var
|
|
61
|
-
var
|
|
62
|
-
var
|
|
57
|
+
var _b = React.useState(parse(props.Record).format(boxFormat)), boxRecord = _b[0], setBoxRecord = _b[1];
|
|
58
|
+
var _c = React.useState(parse(props.Record)), pickerRecord = _c[0], setPickerRecord = _c[1];
|
|
59
|
+
var _d = React.useState(""), feedbackMessage = _d[0], setFeedbackMessage = _d[1];
|
|
60
|
+
var _e = React.useState(false), showOverlay = _e[0], setShowOverlay = _e[1];
|
|
61
|
+
var _f = React.useState(0), top = _f[0], setTop = _f[1];
|
|
62
|
+
var _g = React.useState(0), left = _g[0], setLeft = _g[1];
|
|
63
63
|
var allowNull = React.useMemo(function () { var _a; return (_a = props.AllowEmpty) !== null && _a !== void 0 ? _a : false; }, [props.AllowEmpty]);
|
|
64
|
-
React.useEffect(function () {
|
|
65
|
-
setGuid((0, helper_functions_1.CreateGuid)());
|
|
66
|
-
}, []);
|
|
67
64
|
React.useEffect(function () {
|
|
68
65
|
if (props.Record[props.Field] !== null) {
|
|
69
66
|
setPickerRecord(parse(props.Record));
|
|
@@ -84,6 +81,24 @@ function DateTimePicker(props) {
|
|
|
84
81
|
setLeft(node.left + 0.5 * node.width);
|
|
85
82
|
setTop(node.top + node.height + 10);
|
|
86
83
|
});
|
|
84
|
+
//Effect to set top and left on a scroll event
|
|
85
|
+
React.useEffect(function () {
|
|
86
|
+
function updatePosition() {
|
|
87
|
+
if (divRef.current != null) {
|
|
88
|
+
var node = (0, helper_functions_1.GetNodeSize)(divRef.current);
|
|
89
|
+
setLeft(node.left + 0.5 * node.width);
|
|
90
|
+
setTop(node.top + node.height + 10);
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
document.addEventListener('scroll', updatePosition, true);
|
|
94
|
+
window.addEventListener('resize', updatePosition);
|
|
95
|
+
updatePosition(); // Initial update
|
|
96
|
+
return function () {
|
|
97
|
+
document.removeEventListener('scroll', updatePosition, true);
|
|
98
|
+
window.removeEventListener('resize', updatePosition);
|
|
99
|
+
};
|
|
100
|
+
}, []);
|
|
101
|
+
//Effect to handle click events on the window
|
|
87
102
|
React.useEffect(function () {
|
|
88
103
|
if (showOverlay) {
|
|
89
104
|
window.addEventListener('click', onWindowClick);
|
|
@@ -50,9 +50,9 @@ function DateTimePopup(props) {
|
|
|
50
50
|
}, [props.Type]);
|
|
51
51
|
if (!props.Show)
|
|
52
52
|
return null;
|
|
53
|
-
var
|
|
53
|
+
var left = Math.max(props.Center - 0.5 * width, 0);
|
|
54
54
|
return (React.createElement(react_portal_1.Portal, null,
|
|
55
|
-
React.createElement(WrapperDiv, { Top: props.Top, Left:
|
|
55
|
+
React.createElement(WrapperDiv, { Top: props.Top, Left: left, Indicator: 50, ref: divRef, className: 'gpa-gemstone-datetime' },
|
|
56
56
|
showDate ? React.createElement(Calender_1.default, { DateTime: props.DateTime, Setter: props.Setter }) : null,
|
|
57
57
|
showTime ? React.createElement(Clock_1.default, { DateTime: props.DateTime, Setter: props.Setter, Accuracy: props.Accuracy }) : null)));
|
|
58
58
|
}
|
package/lib/StylableSelect.js
CHANGED
|
@@ -140,7 +140,6 @@ function StylableSelect(props) {
|
|
|
140
140
|
zIndex: 9999,
|
|
141
141
|
top: "".concat(position.Top, "px"),
|
|
142
142
|
left: "".concat(position.Left, "px"),
|
|
143
|
-
width: "".concat(position.Width, "px"),
|
|
144
143
|
maxWidth: '100%'
|
|
145
144
|
} },
|
|
146
145
|
React.createElement("table", { className: "table table-hover", style: { margin: 0 }, ref: selectTable },
|