@portnet/ui 0.1.59 → 0.1.60
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.
|
@@ -46,8 +46,8 @@ const DateTimePickerField = _ref => {
|
|
|
46
46
|
const [field] = (0, _formik.useField)(name);
|
|
47
47
|
const [anchorEl, setAnchorEl] = (0, _react.useState)(null);
|
|
48
48
|
const [timeAnchorEl, setTimeAnchorEl] = (0, _react.useState)(null);
|
|
49
|
-
const [selectedDate, setSelectedDate] = (0, _react.useState)(
|
|
50
|
-
const [selectedTime, setSelectedTime] = (0, _react.useState)(
|
|
49
|
+
const [selectedDate, setSelectedDate] = (0, _react.useState)((0, _momentTimezone.default)(new Date()).format("YYYY-MM-DD"));
|
|
50
|
+
const [selectedTime, setSelectedTime] = (0, _react.useState)((0, _momentTimezone.default)(new Date()).format("HH:mm"));
|
|
51
51
|
const openDatePopover = Boolean(anchorEl);
|
|
52
52
|
const openTimePopover = Boolean(timeAnchorEl);
|
|
53
53
|
const hasInitialized = (0, _react.useRef)(false);
|
|
@@ -100,35 +100,71 @@ const DateTimePickerField = _ref => {
|
|
|
100
100
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
|
|
101
101
|
style: {
|
|
102
102
|
display: "flex",
|
|
103
|
-
gap: 4
|
|
103
|
+
gap: 4,
|
|
104
|
+
padding: 4
|
|
104
105
|
},
|
|
105
106
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Select, {
|
|
106
107
|
value: hours,
|
|
107
108
|
onChange: e => handleTimeChange("".concat(e.target.value, ":").concat(minutes)),
|
|
108
109
|
style: {
|
|
109
110
|
width: "55px",
|
|
110
|
-
fontSize: 11.5
|
|
111
|
+
fontSize: 11.5,
|
|
112
|
+
height: "25px"
|
|
113
|
+
},
|
|
114
|
+
MenuProps: {
|
|
115
|
+
anchorOrigin: {
|
|
116
|
+
vertical: "bottom",
|
|
117
|
+
horizontal: "left",
|
|
118
|
+
padding: 0
|
|
119
|
+
},
|
|
120
|
+
transformOrigin: {
|
|
121
|
+
vertical: "top",
|
|
122
|
+
horizontal: "left"
|
|
123
|
+
},
|
|
124
|
+
getContentAnchorEl: null
|
|
111
125
|
},
|
|
112
126
|
children: [...Array(24).keys()].map(hour => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
|
|
113
127
|
style: {
|
|
114
128
|
fontSize: 11.5
|
|
115
129
|
},
|
|
116
130
|
value: String(hour).padStart(2, "0"),
|
|
117
|
-
children:
|
|
131
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
132
|
+
style: {
|
|
133
|
+
marginRight: 4
|
|
134
|
+
},
|
|
135
|
+
children: String(hour).padStart(2, "0")
|
|
136
|
+
})
|
|
118
137
|
}, hour))
|
|
119
138
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Select, {
|
|
120
139
|
value: minutes,
|
|
121
140
|
onChange: e => handleTimeChange("".concat(hours, ":").concat(e.target.value)),
|
|
122
141
|
style: {
|
|
123
142
|
width: "55px",
|
|
124
|
-
fontSize: 11.5
|
|
143
|
+
fontSize: 11.5,
|
|
144
|
+
height: "25px"
|
|
145
|
+
},
|
|
146
|
+
MenuProps: {
|
|
147
|
+
anchorOrigin: {
|
|
148
|
+
vertical: "bottom",
|
|
149
|
+
padding: 0
|
|
150
|
+
},
|
|
151
|
+
transformOrigin: {
|
|
152
|
+
vertical: "top",
|
|
153
|
+
horizontal: "left"
|
|
154
|
+
},
|
|
155
|
+
getContentAnchorEl: null
|
|
125
156
|
},
|
|
126
157
|
children: [...Array(60).keys()].map(minute => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
|
|
127
158
|
style: {
|
|
128
159
|
fontSize: 11.5
|
|
129
160
|
},
|
|
130
161
|
value: String(minute).padStart(2, "0"),
|
|
131
|
-
children:
|
|
162
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
163
|
+
style: {
|
|
164
|
+
marginRight: 4
|
|
165
|
+
},
|
|
166
|
+
children: String(minute).padStart(2, "0")
|
|
167
|
+
})
|
|
132
168
|
}, minute))
|
|
133
169
|
})]
|
|
134
170
|
});
|
|
@@ -244,16 +280,7 @@ const DateTimePickerField = _ref => {
|
|
|
244
280
|
marginTop: 16,
|
|
245
281
|
marginLeft: -4
|
|
246
282
|
},
|
|
247
|
-
children:
|
|
248
|
-
style: {
|
|
249
|
-
padding: 4,
|
|
250
|
-
display: "flex",
|
|
251
|
-
justifyContent: "center",
|
|
252
|
-
width: "120px",
|
|
253
|
-
height: "25px"
|
|
254
|
-
},
|
|
255
|
-
children: renderTimeSelectors()
|
|
256
|
-
})
|
|
283
|
+
children: renderTimeSelectors()
|
|
257
284
|
})]
|
|
258
285
|
});
|
|
259
286
|
};
|