@invoicebox/ui 0.1.0-alpha.260 → 0.1.0-alpha.262

package/dist/components/form/DateTimeInput/components/MobileDrawerDateTimeCalendar/index.d.ts

@@ -8,5 +8,7 @@ export type TProps = Pick<TCalendarProps, 'maxDate' | 'minDate'> & {
     onTimeChange: (newValue: [number, number]) => void;
     onSubmit: () => void;
     afterSubmit: () => void;
+    minTime?: [number, number];
+    maxTime?: [number, number];
 };
 export declare const MobileDrawerDateTimeCalendar: FC<TProps>;

package/dist/components/form/DateTimeInput/components/MobileDrawerDateTimeCalendar/index.js

@@ -29,7 +29,9 @@ var MobileDrawerDateTimeCalendar = exports.MobileDrawerDateTimeCalendar = functi
     calendarDropdownValue = _ref.calendarDropdownValue,
     afterSubmit = _ref.afterSubmit,
     onSubmit = _ref.onSubmit,
-    onTimeChange = _ref.onTimeChange;
+    onTimeChange = _ref.onTimeChange,
+    maxTime = _ref.maxTime,
+    minTime = _ref.minTime;
   var _useState = (0, _react.useState)(true),
     _useState2 = _slicedToArray(_useState, 2),
     isDateStep = _useState2[0],
@@ -47,8 +49,6 @@ var MobileDrawerDateTimeCalendar = exports.MobileDrawerDateTimeCalendar = functi
       setIsDateStep(true);
     }
   };
-  var maxTime = calendarDropdownValue && maxDate && calendarDropdownValue.getDay() === maxDate.getDay() ? [maxDate.getHours(), maxDate.getMinutes()] : undefined;
-  var minTime = calendarDropdownValue && minDate && calendarDropdownValue.getDay() === minDate.getDay() ? [minDate.getHours(), minDate.getMinutes()] : undefined;
   var currentHour = (calendarDropdownValue === null || calendarDropdownValue === void 0 ? void 0 : calendarDropdownValue.getHours()) || 0;
   var currentMinute = (calendarDropdownValue === null || calendarDropdownValue === void 0 ? void 0 : calendarDropdownValue.getMinutes()) || 0;
   return /*#__PURE__*/_react["default"].createElement(_Drawer.Drawer, {

package/dist/components/form/DateTimeInput/components/MobileNumbersColumn/index.js

@@ -184,7 +184,7 @@ var MobileNumbersColumn = function MobileNumbersColumn(_ref) {
       onClick: function onClick() {
         return handleNumberClick(index);
       }
-    }, numberItem < 10 ? "0".concat(numberItem) : numberItem);
+    }, numberItem.toString().length === 1 ? "0".concat(numberItem) : numberItem);
   }), /*#__PURE__*/_react["default"].createElement(S.Number, {
     $opacity: 0,
     $isActive: false,

package/dist/components/form/DateTimeInput/components/MobileNumbersColumn/styles.js

@@ -11,7 +11,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 var Wrapper = exports.Wrapper = _styledComponents["default"].div.withConfig({
   displayName: "styles__Wrapper",
   componentId: "sc-jqg7lg-0"
-})(["height:100%;overflow:auto;display:flex;flex-direction:column;align-items:center;width:100%;position:relative;text-align:right;transform:translateZ(0);backface-visibility:hidden;will-change:transform;"]);
+})(["height:100%;overflow:scroll;display:flex;flex-direction:column;align-items:center;width:100%;position:relative;text-align:right;transform:translateZ(0);backface-visibility:hidden;will-change:transform;scrollbar-width:none;-ms-overflow-style:none;&::-webkit-scrollbar{display:none;}"]);
 var Number = exports.Number = _styledComponents["default"].div.withConfig({
   displayName: "styles__Number",
   componentId: "sc-jqg7lg-1"

package/dist/components/form/DateTimeInput/components/TimePicker/index.js

@@ -114,7 +114,7 @@ var TimePicker = exports.TimePicker = function TimePicker(_ref) {
       disabled: getIsDisabled(hourItem, maxTimeHour ? maxTimeHour : 23, minTimeHour ? minTimeHour : 0)
     }, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
       variant: 'captionRegular'
-    }, hourItem));
+    }, hourItem.toString().length === 1 ? "0".concat(hourItem) : hourItem));
   })))), /*#__PURE__*/_react["default"].createElement(S.ColumnWrapper, {
     $borderColor: palette.divider
   }, /*#__PURE__*/_react["default"].createElement(S.Label, {
@@ -137,6 +137,6 @@ var TimePicker = exports.TimePicker = function TimePicker(_ref) {
       disabled: getIsDisabledMinute(minuteItem)
     }, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
       variant: 'captionRegular'
-    }, minuteItem));
+    }, minuteItem.toString().length === 1 ? "0".concat(minuteItem) : minuteItem));
   })))));
 };

package/dist/components/form/DateTimeInput/index.js

@@ -125,6 +125,8 @@ var DateTimeInput = exports.DateTimeInput = function DateTimeInput(_ref) {
     onChange(newValue);
     handleClose();
   }, [calendarDropdownValue, handleClose, maxDate, minDate, onChange, setStringValue, value, withTime]);
+  var maxTime = calendarDropdownValue && maxDate && calendarDropdownValue.getFullYear() === maxDate.getFullYear() && calendarDropdownValue.getMonth() === maxDate.getMonth() && calendarDropdownValue.getDate() === maxDate.getDate() ? [maxDate.getHours(), maxDate.getMinutes()] : undefined;
+  var minTime = calendarDropdownValue && minDate && calendarDropdownValue.getFullYear() === minDate.getFullYear() && calendarDropdownValue.getMonth() === minDate.getMonth() && calendarDropdownValue.getDate() === minDate.getDate() ? [minDate.getHours(), minDate.getMinutes()] : undefined;
   return /*#__PURE__*/_react["default"].createElement(S.Wrapper, {
     ref: isMobile ? undefined : elRef
   }, /*#__PURE__*/_react["default"].createElement(_InputLabel.InputLabel, {
@@ -164,8 +166,8 @@ var DateTimeInput = exports.DateTimeInput = function DateTimeInput(_ref) {
     value: [(calendarDropdownValue === null || calendarDropdownValue === void 0 ? void 0 : calendarDropdownValue.getHours()) || 0, (calendarDropdownValue === null || calendarDropdownValue === void 0 ? void 0 : calendarDropdownValue.getMinutes()) || 0],
     onChange: handleTimePickerChange,
     height: timePickerHeight,
-    maxTime: calendarDropdownValue && maxDate && calendarDropdownValue.getDay() === maxDate.getDay() ? [maxDate.getHours(), maxDate.getMinutes()] : undefined,
-    minTime: calendarDropdownValue && minDate && calendarDropdownValue.getDay() === minDate.getDay() ? [minDate.getHours(), minDate.getMinutes()] : undefined
+    maxTime: maxTime,
+    minTime: minTime
   })), /*#__PURE__*/_react["default"].createElement(S.DropdownActionButtons, null, /*#__PURE__*/_react["default"].createElement(S.ActionButton, {
     type: 'button',
     $bgColor: palette.cancelButton,
@@ -192,6 +194,8 @@ var DateTimeInput = exports.DateTimeInput = function DateTimeInput(_ref) {
     afterSubmit: handleClose,
     maxDate: maxDate,
     minDate: minDate,
-    onTimeChange: handleTimePickerChange
+    onTimeChange: handleTimePickerChange,
+    maxTime: maxTime,
+    minTime: minTime
   }));
 };

package/dist/components/form/DateTimeInput/index.stories.js

@@ -47,11 +47,13 @@ var Component = function Component(props) {
     }
   }, "Reset"));
 };
+var currentDate = new Date();
+var dateAfter29Days = currentDate.setDate(currentDate.getDate() + 29);
 var COMMON_ARGS = {
   hasError: false,
   label: 'Label',
-  minDate: new Date().setHours(10, 10, 0, 0),
-  maxDate: new Date().setDate(new Date().getDate() + 5)
+  minDate: new Date(),
+  maxDate: dateAfter29Days
 };
 var Default = exports.Default = {
   args: COMMON_ARGS,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@invoicebox/ui",
-    "version": "0.1.0-alpha.260",
+    "version": "0.1.0-alpha.262",
     "description": "Invoicebox UI",
     "license": "Apache License 2.0",
     "scripts": {