@portnet/ui 0.1.58 → 0.1.60

package/dist/components/others/DateTimePickerField.js

@@ -46,8 +46,8 @@ const DateTimePickerField = _ref => {
   const [field] = (0, _formik.useField)(name);
   const [anchorEl, setAnchorEl] = (0, _react.useState)(null);
   const [timeAnchorEl, setTimeAnchorEl] = (0, _react.useState)(null);
-  const [selectedDate, setSelectedDate] = (0, _react.useState)(null);
-  const [selectedTime, setSelectedTime] = (0, _react.useState)(null);
+  const [selectedDate, setSelectedDate] = (0, _react.useState)((0, _momentTimezone.default)(new Date()).format("YYYY-MM-DD"));
+  const [selectedTime, setSelectedTime] = (0, _react.useState)((0, _momentTimezone.default)(new Date()).format("HH:mm"));
   const openDatePopover = Boolean(anchorEl);
   const openTimePopover = Boolean(timeAnchorEl);
   const hasInitialized = (0, _react.useRef)(false);
@@ -73,7 +73,7 @@ const DateTimePickerField = _ref => {
   const handleDateClose = () => {
     const combinedDateTime = "".concat(selectedDate, " ").concat(selectedTime);
     console.log("🚀 ~ handleDateClose ~ combinedDateTime:", combinedDateTime);
-    const unixTimestamp = _momentTimezone.default.utc(combinedDateTime, "YYYY-MM-DD HH:mm").subtract(1, "hours");
+    const unixTimestamp = _momentTimezone.default.utc(combinedDateTime, "YYYY-MM-DD HH:mm");
     console.log("🚀 ~ handleDateClose ~ unixTimestamp:", unixTimestamp);
     setCanUpdate(false);
     if (onChange) onChange(unixTimestamp);
@@ -100,35 +100,71 @@ const DateTimePickerField = _ref => {
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
       style: {
         display: "flex",
-        gap: 4
+        gap: 4,
+        padding: 4
       },
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Select, {
         value: hours,
         onChange: e => handleTimeChange("".concat(e.target.value, ":").concat(minutes)),
         style: {
           width: "55px",
-          fontSize: 11.5
+          fontSize: 11.5,
+          height: "25px"
+        },
+        MenuProps: {
+          anchorOrigin: {
+            vertical: "bottom",
+            horizontal: "left",
+            padding: 0
+          },
+          transformOrigin: {
+            vertical: "top",
+            horizontal: "left"
+          },
+          getContentAnchorEl: null
         },
         children: [...Array(24).keys()].map(hour => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
           style: {
             fontSize: 11.5
           },
           value: String(hour).padStart(2, "0"),
-          children: String(hour).padStart(2, "0")
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            style: {
+              marginRight: 4
+            },
+            children: String(hour).padStart(2, "0")
+          })
         }, hour))
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Select, {
         value: minutes,
         onChange: e => handleTimeChange("".concat(hours, ":").concat(e.target.value)),
         style: {
           width: "55px",
-          fontSize: 11.5
+          fontSize: 11.5,
+          height: "25px"
+        },
+        MenuProps: {
+          anchorOrigin: {
+            vertical: "bottom",
+            padding: 0
+          },
+          transformOrigin: {
+            vertical: "top",
+            horizontal: "left"
+          },
+          getContentAnchorEl: null
         },
         children: [...Array(60).keys()].map(minute => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.MenuItem, {
           style: {
             fontSize: 11.5
           },
           value: String(minute).padStart(2, "0"),
-          children: String(minute).padStart(2, "0")
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            style: {
+              marginRight: 4
+            },
+            children: String(minute).padStart(2, "0")
+          })
         }, minute))
       })]
     });
@@ -244,16 +280,7 @@ const DateTimePickerField = _ref => {
         marginTop: 16,
         marginLeft: -4
       },
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
-        style: {
-          padding: 4,
-          display: "flex",
-          justifyContent: "center",
-          width: "120px",
-          height: "25px"
-        },
-        children: renderTimeSelectors()
-      })
+      children: renderTimeSelectors()
     })]
   });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portnet/ui",
-  "version": "0.1.58",
+  "version": "0.1.60",
   "description": "Portnet UI",
   "keywords": [
     "react",