@onesy/ui-react 1.0.163 → 1.0.165

package/CalendarMonth/CalendarMonth.js

@@ -204,37 +204,16 @@ const useStyle = (0, _styleReact.style)(theme => ({
   name: 'onesy-CalendarMonth'
 });
 const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
-  var _month, _refs$previous$curren, _refs$previous$curren2;
+  var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3, _theme$elements4, _theme$elements5, _theme$elements6, _month, _refs$previous$curren, _refs$previous$curren2;
   const theme = (0, _styleReact.useOnesyTheme)();
   const l = theme.l;
-  const props = _react.default.useMemo(() => {
-    var _theme$ui, _theme$ui2;
-    return _objectSpread(_objectSpread(_objectSpread({}, theme === null || theme === void 0 || (_theme$ui = theme.ui) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.elements) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.all) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.props) === null || _theme$ui === void 0 ? void 0 : _theme$ui.default), theme === null || theme === void 0 || (_theme$ui2 = theme.ui) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.elements) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.onesyCalendarMonth) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props__);
-  }, [props__]);
-  const Line = _react.default.useMemo(() => {
-    var _theme$elements;
-    return (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.Line) || _Line.default;
-  }, [theme]);
-  const Surface = _react.default.useMemo(() => {
-    var _theme$elements2;
-    return (theme === null || theme === void 0 || (_theme$elements2 = theme.elements) === null || _theme$elements2 === void 0 ? void 0 : _theme$elements2.Surface) || _Surface.default;
-  }, [theme]);
-  const Type = _react.default.useMemo(() => {
-    var _theme$elements3;
-    return (theme === null || theme === void 0 || (_theme$elements3 = theme.elements) === null || _theme$elements3 === void 0 ? void 0 : _theme$elements3.Type) || _Type.default;
-  }, [theme]);
-  const PaginationItem = _react.default.useMemo(() => {
-    var _theme$elements4;
-    return (theme === null || theme === void 0 || (_theme$elements4 = theme.elements) === null || _theme$elements4 === void 0 ? void 0 : _theme$elements4.PaginationItem) || _PaginationItem.default;
-  }, [theme]);
-  const Transitions = _react.default.useMemo(() => {
-    var _theme$elements5;
-    return (theme === null || theme === void 0 || (_theme$elements5 = theme.elements) === null || _theme$elements5 === void 0 ? void 0 : _theme$elements5.Transitions) || _Transitions.default;
-  }, [theme]);
-  const Transition = _react.default.useMemo(() => {
-    var _theme$elements6;
-    return (theme === null || theme === void 0 || (_theme$elements6 = theme.elements) === null || _theme$elements6 === void 0 ? void 0 : _theme$elements6.Transition) || _Transition.default;
-  }, [theme]);
+  const props = _objectSpread(_objectSpread(_objectSpread({}, theme === null || theme === void 0 || (_theme$ui = theme.ui) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.elements) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.all) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.props) === null || _theme$ui === void 0 ? void 0 : _theme$ui.default), theme === null || theme === void 0 || (_theme$ui2 = theme.ui) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.elements) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.onesyCalendarMonth) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props__);
+  const Line = (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.Line) || _Line.default;
+  const Surface = (theme === null || theme === void 0 || (_theme$elements2 = theme.elements) === null || _theme$elements2 === void 0 ? void 0 : _theme$elements2.Surface) || _Surface.default;
+  const Type = (theme === null || theme === void 0 || (_theme$elements3 = theme.elements) === null || _theme$elements3 === void 0 ? void 0 : _theme$elements3.Type) || _Type.default;
+  const PaginationItem = (theme === null || theme === void 0 || (_theme$elements4 = theme.elements) === null || _theme$elements4 === void 0 ? void 0 : _theme$elements4.PaginationItem) || _PaginationItem.default;
+  const Transitions = (theme === null || theme === void 0 || (_theme$elements5 = theme.elements) === null || _theme$elements5 === void 0 ? void 0 : _theme$elements5.Transitions) || _Transitions.default;
+  const Transition = (theme === null || theme === void 0 || (_theme$elements6 = theme.elements) === null || _theme$elements6 === void 0 ? void 0 : _theme$elements6.Transition) || _Transition.default;
   const {
       tonal = true,
       color = 'primary',
@@ -298,7 +277,7 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
   _react.default.useEffect(() => {
     if (calendar_ !== undefined && calendar_ !== calendar) setCalendar(calendar_);
   }, [calendar_]);
-  const valid = _react.default.useCallback((...args) => {
+  const valid = (...args) => {
     if ((0, _utils.is)('function', valid_)) return valid_(...args);
     const onesyDate = args[0];
     if (min || max || validate) {
@@ -309,21 +288,21 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
       return response;
     }
     return true;
-  }, [valid_, min, max, validate]);
-  const onUpdateCalendar = _react.default.useCallback(valueNew => {
+  };
+  const onUpdateCalendar = valueNew => {
     // Inner update
     if (!props.hasOwnProperty('calendar')) setCalendar(valueNew);
     if ((0, _utils.is)('function', onChangeCalendar)) onChangeCalendar(valueNew);
-  }, [onChangeCalendar]);
-  const onUpdate = _react.default.useCallback((valueUpdated, offsetMultiplier) => {
-    let valueNew = [valueUpdated, value[1]].filter(Boolean);
+  };
+  const onUpdate = (valueUpdated, offsetMultiplier) => {
+    let valueNew_0 = [valueUpdated, value[1]].filter(Boolean);
 
     // Previous
     // Range reset
     // If value is range, and is the same (in terms of day, month, year as from and/or to)
     // make a reset, ie. make both values that same date
     if (range) {
-      if (value.filter(Boolean).some(item => valueUpdated.year === item.year && valueUpdated.month === item.month && valueUpdated.day === item.day)) valueNew = [valueUpdated, valueUpdated];else {
+      if (value.filter(Boolean).some(item => valueUpdated.year === item.year && valueUpdated.month === item.month && valueUpdated.day === item.day)) valueNew_0 = [valueUpdated, valueUpdated];else {
         var _value$, _value$2;
         // Update the value closest to from, to value
         let index;
@@ -335,18 +314,18 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
           const middle = Math.abs(value[1].milliseconds - ((_value$3 = value[0]) === null || _value$3 === void 0 ? void 0 : _value$3.milliseconds)) / 2;
           index = valueUpdated.milliseconds <= ((_value$4 = value[0]) === null || _value$4 === void 0 ? void 0 : _value$4.milliseconds) + middle ? 0 : 1;
         }
-        valueNew = [...value];
-        valueNew[index] = valueUpdated;
+        valueNew_0 = [...value];
+        valueNew_0[index] = valueUpdated;
       }
 
       // start of the day
-      if (valueNew[0]) {
-        valueNew[0] = (0, _date.startOf)(valueNew[0], 'day');
+      if (valueNew_0[0]) {
+        valueNew_0[0] = (0, _date.startOf)(valueNew_0[0], 'day');
       }
 
       // end of the day
-      if (valueNew[1]) {
-        valueNew[1] = (0, _date.endOf)(valueNew[1], 'day');
+      if (valueNew_0[1]) {
+        valueNew_0[1] = (0, _date.endOf)(valueNew_0[1], 'day');
       }
     }
 
@@ -357,9 +336,9 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
     }
 
     // Inner value update
-    if (!props.hasOwnProperty('value')) setValue(valueNew);
-    if ((0, _utils.is)('function', onChange)) onChange(!range ? valueNew[0] : valueNew);
-  }, [value, range, offset, calendar, onChange]);
+    if (!props.hasOwnProperty('value')) setValue(valueNew_0);
+    if ((0, _utils.is)('function', onChange)) onChange(!range ? valueNew_0[0] : valueNew_0);
+  };
   const dayNames = [1, 2, 3, 4, 5, 6];
   if (weekStartDay === 'Monday') dayNames.push(7);else dayNames.unshift(7);
   const renderDayNameMethod = (0, _utils.is)('function', renderDayName) ? renderDayName : order_ => {
@@ -378,17 +357,17 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
 
   // value or value range selected value
   let id = `${month.year} ${month.month} ${month.day} ${theme.palette.light}`;
-  value.forEach(item => id += ` ${item.year} ${item.month} ${item.day}`);
+  value.forEach(item_0 => id += ` ${item_0.year} ${item_0.month} ${item_0.day}`);
   const monthStart = (0, _date.startOf)(month, 'month');
   const previousMonth = (0, _date.remove)(1, 'month', month);
   const previousMonthEnd = (0, _date.endOf)(previousMonth, 'month');
   const nextMonth = (0, _date.add)(1, 'month', month);
   const monthSame = ((_refs$previous$curren = refs.previous.current) === null || _refs$previous$curren === void 0 ? void 0 : _refs$previous$curren.year) === (calendar === null || calendar === void 0 ? void 0 : calendar.year) && ((_refs$previous$curren2 = refs.previous.current) === null || _refs$previous$curren2 === void 0 ? void 0 : _refs$previous$curren2.month) === (calendar === null || calendar === void 0 ? void 0 : calendar.month);
-  const getRanges = _react.default.useCallback(ranges => {
+  const getRanges = ranges => {
     // Convert all ranges to start/end timestamps
-    const rangeTimestamps = ranges.filter(itemRange => itemRange.filter(Boolean).length).map(itemRange => ({
-      start: itemRange[0].milliseconds,
-      end: (itemRange[1] || itemRange[0]).milliseconds
+    const rangeTimestamps = ranges.filter(itemRange => itemRange.filter(Boolean).length).map(itemRange_0 => ({
+      start: itemRange_0[0].milliseconds,
+      end: (itemRange_0[1] || itemRange_0[0]).milliseconds
     }));
 
     // Sort by start time
@@ -409,20 +388,20 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
     }
     mergedRanges.push(currentRange);
     return mergedRanges.filter(Boolean);
-  }, []);
+  };
   const rangesValue = _react.default.useMemo(() => {
-    const ranges = [value].map(item => {
-      return item.map((itemRange, index) => !index ? (0, _date.startOf)(itemRange, 'day') : (0, _date.endOf)(itemRange, 'day'));
+    const ranges_0 = [value].map(item_1 => {
+      return item_1.map((itemRange_1, index_0) => !index_0 ? (0, _date.startOf)(itemRange_1, 'day') : (0, _date.endOf)(itemRange_1, 'day'));
     });
-    return getRanges(ranges);
+    return getRanges(ranges_0);
   }, [value]);
   const rangesSelected = _react.default.useMemo(() => {
-    const ranges = [...(selected || [])].map(item => {
-      return item.map((itemRange, index) => !index ? (0, _date.startOf)(itemRange, 'day') : (0, _date.endOf)(itemRange, 'day'));
+    const ranges_1 = [...(selected || [])].map(item_2 => {
+      return item_2.map((itemRange_2, index_1) => !index_1 ? (0, _date.startOf)(itemRange_2, 'day') : (0, _date.endOf)(itemRange_2, 'day'));
     });
-    return getRanges(ranges);
+    return getRanges(ranges_1);
   }, [selected]);
-  const getDetails = _react.default.useCallback(day => {
+  const getDetails = day => {
     const dayFormat = (0, _date.format)(day, 'DD-MM-YYYY');
     const dayMonthStart = (0, _date.format)((0, _date.startOf)(day, 'month'), 'DD-MM-YYYY');
     const dayMonthEnd = (0, _date.format)((0, _date.endOf)(day, 'month'), 'DD-MM-YYYY');
@@ -436,14 +415,14 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
       fromSelected: false,
       monthStart: dayMonthStart === dayFormat,
       monthEnd: dayMonthEnd === dayFormat,
-      selectedIndex: value.findIndex(item => item.year === day.year && item.month === day.month && item.day === day.day),
-      selectedSame: value.filter(item => item.year === day.year && item.month === day.month && item.day === day.day).length === 2
+      selectedIndex: value.findIndex(item_3 => item_3.year === day.year && item_3.month === day.month && item_3.day === day.day),
+      selectedSame: value.filter(item_4 => item_4.year === day.year && item_4.month === day.month && item_4.day === day.day).length === 2
     };
 
     // value
-    for (const itemRange of rangesValue) {
-      const rangeStartDay = (0, _date.format)(new _date.OnesyDate(itemRange.start), 'DD-MM-YYYY');
-      const rangeEndDay = (0, _date.format)(new _date.OnesyDate(itemRange.end), 'DD-MM-YYYY');
+    for (const itemRange_3 of rangesValue) {
+      const rangeStartDay = (0, _date.format)(new _date.OnesyDate(itemRange_3.start), 'DD-MM-YYYY');
+      const rangeEndDay = (0, _date.format)(new _date.OnesyDate(itemRange_3.end), 'DD-MM-YYYY');
 
       // start
       if (dayFormat === rangeStartDay) result.selected = result.start = true;
@@ -452,7 +431,7 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
       if (dayFormat === rangeEndDay) result.selected = result.end = true;
 
       // between
-      if (day.milliseconds >= itemRange.start && day.milliseconds <= itemRange.end) result.selected = result.between = true;
+      if (day.milliseconds >= itemRange_3.start && day.milliseconds <= itemRange_3.end) result.selected = result.between = true;
 
       // same
       result.same = result.start && result.end;
@@ -460,18 +439,18 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
     }
 
     // selected
-    for (const itemRange of rangesSelected) {
-      const rangeStartDay = (0, _date.format)(new _date.OnesyDate(itemRange.start), 'DD-MM-YYYY');
-      const rangeEndDay = (0, _date.format)(new _date.OnesyDate(itemRange.end), 'DD-MM-YYYY');
+    for (const itemRange_4 of rangesSelected) {
+      const rangeStartDay_0 = (0, _date.format)(new _date.OnesyDate(itemRange_4.start), 'DD-MM-YYYY');
+      const rangeEndDay_0 = (0, _date.format)(new _date.OnesyDate(itemRange_4.end), 'DD-MM-YYYY');
 
       // start
-      if (dayFormat === rangeStartDay) result.selected = result.start = true;
+      if (dayFormat === rangeStartDay_0) result.selected = result.start = true;
 
       // end
-      if (dayFormat === rangeEndDay) result.selected = result.end = true;
+      if (dayFormat === rangeEndDay_0) result.selected = result.end = true;
 
       // between
-      if (day.milliseconds >= itemRange.start && day.milliseconds <= itemRange.end) result.selected = result.between = true;
+      if (day.milliseconds >= itemRange_4.start && day.milliseconds <= itemRange_4.end) result.selected = result.between = true;
 
       // same
       result.same = result.start && result.end;
@@ -482,23 +461,23 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
     }
     result.outside = true;
     return result;
-  }, [value, selected, rangesSelected, rangesValue]);
+  };
   const days = _react.default.useMemo(() => {
     const items = [];
 
     // Add all month days
-    for (let i = 0; i < month.daysInMonth; i++) {
-      let day = (0, _date.set)(i + 1, 'day', month);
-      day = (0, _date.set)(14, 'hour', day);
-      const details = getDetails(day);
+    for (let i_0 = 0; i_0 < month.daysInMonth; i_0++) {
+      let day_0 = (0, _date.set)(i_0 + 1, 'day', month);
+      day_0 = (0, _date.set)(14, 'hour', day_0);
+      const details = getDetails(day_0);
       items.push({
-        value: i + 1,
+        value: i_0 + 1,
         in: true,
-        dayWeek: day.dayWeek,
-        weekend: [0, 6].includes(day.dayWeek),
-        today: day.year === monthNow.year && day.dayYear === monthNow.dayYear,
+        dayWeek: day_0.dayWeek,
+        weekend: [0, 6].includes(day_0.dayWeek),
+        today: day_0.year === monthNow.year && day_0.dayYear === monthNow.dayYear,
         is: _objectSpread({}, details),
-        onesyDate: day
+        onesyDate: day_0
       });
     }
     items[0].start = true;
@@ -508,18 +487,18 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
     if (weekStartDay === 'Sunday' && monthStart.dayWeek !== 0 || weekStartDay === 'Monday' && monthStart.dayWeek !== 1) {
       let toAdd = monthStart.dayWeek === 0 ? 6 : monthStart.dayWeek - 1;
       if (weekStartDay === 'Sunday') toAdd++;
-      for (let i = 0; i < toAdd; i++) {
-        const day = (0, _date.set)(previousMonthEnd.day - i, 'day', previousMonth);
-        const details = getDetails(day);
+      for (let i_1 = 0; i_1 < toAdd; i_1++) {
+        const day_1 = (0, _date.set)(previousMonthEnd.day - i_1, 'day', previousMonth);
+        const details_0 = getDetails(day_1);
         items.unshift({
-          value: day.day,
+          value: day_1.day,
           in: false,
-          dayWeek: day.dayWeek,
-          weekend: [0, 6].includes(day.dayWeek),
-          today: day.year === monthNow.year && day.dayYear === monthNow.dayYear,
-          is: _objectSpread({}, details),
+          dayWeek: day_1.dayWeek,
+          weekend: [0, 6].includes(day_1.dayWeek),
+          today: day_1.year === monthNow.year && day_1.dayYear === monthNow.dayYear,
+          is: _objectSpread({}, details_0),
           start: true,
-          onesyDate: day
+          onesyDate: day_1
         });
       }
     }
@@ -527,20 +506,20 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
     // Add to end
     const dayLast = items[items.length - 1];
     if (dayLast.dayWeek < 7) {
-      let toAdd = 7 - dayLast.dayWeek;
-      if (items.length + toAdd - 1 < 42) toAdd += 41 - (items.length + toAdd - 1);
-      for (let i = 0; i < toAdd; i++) {
-        const day = (0, _date.set)(i + 1, 'day', nextMonth);
-        const details = getDetails(day);
+      let toAdd_0 = 7 - dayLast.dayWeek;
+      if (items.length + toAdd_0 - 1 < 42) toAdd_0 += 41 - (items.length + toAdd_0 - 1);
+      for (let i_2 = 0; i_2 < toAdd_0; i_2++) {
+        const day_2 = (0, _date.set)(i_2 + 1, 'day', nextMonth);
+        const details_1 = getDetails(day_2);
         items.push({
-          value: i + 1,
+          value: i_2 + 1,
           in: false,
-          dayWeek: day.dayWeek,
-          weekend: [0, 6].includes(day.dayWeek),
-          today: day.year === monthNow.year && day.dayYear === monthNow.dayYear,
-          is: _objectSpread({}, details),
+          dayWeek: day_2.dayWeek,
+          weekend: [0, 6].includes(day_2.dayWeek),
+          today: day_2.year === monthNow.year && day_2.dayYear === monthNow.dayYear,
+          is: _objectSpread({}, details_1),
           end: true,
-          onesyDate: day
+          onesyDate: day_2
         });
       }
     }
@@ -574,46 +553,46 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
       align: "unset",
       justify: "unset",
       className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('CalendarMonth', theme) && ['onesy-CalendarMonth-weeks'], classes.weeks, classes[`weeks_size_${size}`], status && [`weeks_${status}`], !labels && classes.weeks_no_labels])
-    }, weeks.map((week, index) =>
+    }, weeks.map((week, index_2) =>
     /*#__PURE__*/
     // Week
     _react.default.createElement(Line, {
-      key: index,
+      key: index_2,
       gap: 0,
       direction: "row",
       align: "unset",
       justify: "space-between",
       className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('CalendarMonth', theme) && ['onesy-CalendarMonth-week'], classes.week])
-    }, week.map((day, index_) => {
+    }, week.map((day_3, index_) => {
       const propsDay = {
-        onClick: () => onUpdate(day.onesyDate, day.start || day.end ? -1 : undefined),
-        disabled: !day.in && !outside || !valid(day.onesyDate, 'day') ||
+        onClick: () => onUpdate(day_3.onesyDate, day_3.start || day_3.end ? -1 : undefined),
+        disabled: !day_3.in && !outside || !valid(day_3.onesyDate, 'day') ||
         // not prior to 1970, we may potentially update this in the future
-        day.onesyDate.year < 1970
+        day_3.onesyDate.year < 1970
       };
-      const isEdge = day.is.same || (day.is.monthStart || day.is.monthEnd) && day.is.selected;
+      const isEdge = day_3.is.same || (day_3.is.monthStart || day_3.is.monthEnd) && day_3.is.selected;
       return /*#__PURE__*/_react.default.createElement(Line, {
         key: index_,
         direction: "row",
         align: "center",
         justify: "center",
         onClick: event => {
-          const timeDate = (0, _date.startOf)(day.onesyDate, 'hour');
+          const timeDate = (0, _date.startOf)(day_3.onesyDate, 'hour');
           onTimeClick === null || onTimeClick === void 0 || onTimeClick(timeDate, 'month', event);
         },
-        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('CalendarMonth', theme) && ['onesy-CalendarMonth-day', `onesy-CalendarMonth-day-${day.in ? 'in' : 'out'}`], classes.day, classes[`day_size_${size}`], classes[`day_${day.in ? 'in' : 'out'}`], !day.in && !outside && classes.day_out_no, !propsDay.disabled ? 'onesy-enabled' : 'onesy-disabled',
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('CalendarMonth', theme) && ['onesy-CalendarMonth-day', `onesy-CalendarMonth-day-${day_3.in ? 'in' : 'out'}`], classes.day, classes[`day_size_${size}`], classes[`day_${day_3.in ? 'in' : 'out'}`], !day_3.in && !outside && classes.day_out_no, !propsDay.disabled ? 'onesy-enabled' : 'onesy-disabled',
         // same day
         // (day.is.same || ((day.is.monthStart || day.is.monthEnd) && day.is.selected)) && classes.dayStartEnd,
         // start
-        day.is.start && !isEdge && classes.dayStart,
+        day_3.is.start && !isEdge && classes.dayStart,
         // end
-        day.is.end && !isEdge && classes.dayEnd,
+        day_3.is.end && !isEdge && classes.dayEnd,
         // between
-        day.is.between && !day.is.same && [!day.is.end && day.dayWeek !== 0 && !day.is.monthEnd && classes.dayStartSelection, !day.is.start && day.dayWeek !== 1 && !day.is.monthStart && classes.dayEndSelection]]),
+        day_3.is.between && !day_3.is.same && [!day_3.is.end && day_3.dayWeek !== 0 && !day_3.is.monthEnd && classes.dayStartSelection, !day_3.is.start && day_3.dayWeek !== 1 && !day_3.is.monthStart && classes.dayEndSelection]]),
         style: {
-          '--onesy-color': day.is.fromSelected ? colorSelectedTheme === null || colorSelectedTheme === void 0 ? void 0 : colorSelectedTheme.main : palette === null || palette === void 0 ? void 0 : palette.main
+          '--onesy-color': day_3.is.fromSelected ? colorSelectedTheme === null || colorSelectedTheme === void 0 ? void 0 : colorSelectedTheme.main : palette === null || palette === void 0 ? void 0 : palette.main
         }
-      }, (0, _utils.is)('function', renderDay) ? renderDay(day.onesyDate, propsDay, day, outside) : /*#__PURE__*/_react.default.createElement(PaginationItem, (0, _extends2.default)({
+      }, (0, _utils.is)('function', renderDay) ? renderDay(day_3.onesyDate, propsDay, day_3, outside) : /*#__PURE__*/_react.default.createElement(PaginationItem, (0, _extends2.default)({
         tonal: tonal,
         color: "inherit",
         size: size,
@@ -622,23 +601,23 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
         },
         TypeProps: {
           version: size === 'large' ? 'b1' : size === 'regular' ? 'b2' : 'b3',
-          priority: !day.is.selected ? !day.weekend ? 'primary' : 'secondary' : undefined
+          priority: !day_3.is.selected ? !day_3.weekend ? 'primary' : 'secondary' : undefined
         },
-        "aria-label": (0, _date.format)(day.onesyDate, 'DD-MM-YYYY', {
+        "aria-label": (0, _date.format)(day_3.onesyDate, 'DD-MM-YYYY', {
           l
         })
       }, PaginationItemProps, {
-        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('CalendarMonth', theme) && ['onesy-CalendarMonth-day-value', day.in && 'onesy-CalendarMonth-day-in', day.dayWeek && 'onesy-CalendarMonth-day-day-week', day.weekend && 'onesy-CalendarMonth-day-weekend', day.today && 'onesy-CalendarMonth-day-today', day.is.between && 'onesy-CalendarMonth-day-between', day.is.selected && 'onesy-CalendarMonth-day-selected', day.is.start && 'onesy-CalendarMonth-day-start', day.is.end && 'onesy-CalendarMonth-day-end'], PaginationItemProps === null || PaginationItemProps === void 0 ? void 0 : PaginationItemProps.className, classes.dayValue, day.is.selected && classes.daySelected, classes[`day_size_${size}`]]),
-        style: _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, day.today ? {
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('CalendarMonth', theme) && ['onesy-CalendarMonth-day-value', day_3.in && 'onesy-CalendarMonth-day-in', day_3.dayWeek && 'onesy-CalendarMonth-day-day-week', day_3.weekend && 'onesy-CalendarMonth-day-weekend', day_3.today && 'onesy-CalendarMonth-day-today', day_3.is.between && 'onesy-CalendarMonth-day-between', day_3.is.selected && 'onesy-CalendarMonth-day-selected', day_3.is.start && 'onesy-CalendarMonth-day-start', day_3.is.end && 'onesy-CalendarMonth-day-end'], PaginationItemProps === null || PaginationItemProps === void 0 ? void 0 : PaginationItemProps.className, classes.dayValue, day_3.is.selected && classes.daySelected, classes[`day_size_${size}`]]),
+        style: _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, day_3.today ? {
           boxShadow: `inset 0px 0px 0px 1px ${palette[40]}`
-        } : undefined), day.is.selected && day.is.between && {
+        } : undefined), day_3.is.selected && day_3.is.between && {
           color: `hsl(from var(--onesy-color) h s ${theme.palette.light ? 10 : 98})`,
           backgroundColor: `hsl(from var(--onesy-color) h s ${theme.palette.light ? propsDay.disabled ? 90 : 85 : propsDay.disabled ? 20 : 25})`
-        }), day.is.selected && (day.is.start || day.is.end) && {
+        }), day_3.is.selected && (day_3.is.start || day_3.is.end) && {
           color: `hsl(from var(--onesy-color) h s ${theme.palette.light ? 98 : 10})`,
           backgroundColor: `hsl(from var(--onesy-color) h s ${theme.palette.light ? propsDay.disabled ? 40 : 50 : propsDay.disabled ? 60 : 70})`
         }), PaginationItemProps === null || PaginationItemProps === void 0 ? void 0 : PaginationItemProps.style)
-      }, propsDay), day.value));
+      }, propsDay), day_3.value));
     })))));
   };
   return /*#__PURE__*/_react.default.createElement(Line, (0, _extends2.default)({
@@ -652,8 +631,8 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
     align: "center",
     justify: "space-between",
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('CalendarMonth', theme) && ['onesy-CalendarMonth-day-names'], classes.dayNames])
-  }, dayNames.map((day, index) => /*#__PURE__*/_react.default.createElement(Line, {
-    key: index,
+  }, dayNames.map((day_4, index_3) => /*#__PURE__*/_react.default.createElement(Line, {
+    key: index_3,
     direction: "column",
     align: "center",
     justify: "center",
@@ -661,7 +640,7 @@ const CalendarMonth = /*#__PURE__*/_react.default.forwardRef((props__, ref) => {
   }, /*#__PURE__*/_react.default.createElement(Type, (0, _extends2.default)({
     version: size === 'large' ? 'b1' : size === 'regular' ? 'b2' : 'b3',
     align: "center"
-  }, DayNameProps), renderDayNameMethod(day))))), noTransition && getCalendar(), !noTransition && /*#__PURE__*/_react.default.createElement(Transitions, (0, _extends2.default)({
+  }, DayNameProps), renderDayNameMethod(day_4))))), noTransition && getCalendar(), !noTransition && /*#__PURE__*/_react.default.createElement(Transitions, (0, _extends2.default)({
     id: refs.id.current,
     mode: "in-out-follow",
     switch: true

package/CalendarViews/CalendarViews.d.ts

@@ -2,8 +2,8 @@ import React from 'react';
 import { OnesyDate } from '@onesy/date';
 import { ICalendar } from '../Calendar/Calendar';
 import { ICalendarEvent } from '../CalendarAvailability/CalendarAvailability';
-export type ICalendarViewsView = 'day' | 'week' | 'month';
-export type ICalendarViews = ICalendar & {
+export declare type ICalendarViewsView = 'day' | 'week' | 'month';
+export declare type ICalendarViews = ICalendar & {
     viewDefault?: ICalendarViewsView;
     dateDefault?: OnesyDate;
     times?: any;

package/CalendarViews/CalendarViews.js

@@ -111,44 +111,18 @@ const useStyle = (0, _styleReact.style)(theme => ({
   name: 'onesy-CalendarViews'
 });
 const CalendarViews = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+  var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3, _theme$elements4, _theme$elements5, _theme$elements6, _theme$elements7, _theme$elements8;
   const theme = (0, _styleReact.useOnesyTheme)();
   const l = theme.l;
-  const props = _react.default.useMemo(() => {
-    var _theme$ui, _theme$ui2;
-    return _objectSpread(_objectSpread(_objectSpread({}, theme === null || theme === void 0 || (_theme$ui = theme.ui) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.elements) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.all) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.props) === null || _theme$ui === void 0 ? void 0 : _theme$ui.default), theme === null || theme === void 0 || (_theme$ui2 = theme.ui) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.elements) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.onesyCalendarViews) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
-  }, [props_]);
-  const CalendarMonth = _react.default.useMemo(() => {
-    var _theme$elements;
-    return (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.CalendarMonth) || _CalendarMonth.default;
-  }, [theme]);
-  const IconButton = _react.default.useMemo(() => {
-    var _theme$elements2;
-    return (theme === null || theme === void 0 || (_theme$elements2 = theme.elements) === null || _theme$elements2 === void 0 ? void 0 : _theme$elements2.IconButton) || _IconButton.default;
-  }, [theme]);
-  const Line = _react.default.useMemo(() => {
-    var _theme$elements3;
-    return (theme === null || theme === void 0 || (_theme$elements3 = theme.elements) === null || _theme$elements3 === void 0 ? void 0 : _theme$elements3.Line) || _Line.default;
-  }, [theme]);
-  const Tooltip = _react.default.useMemo(() => {
-    var _theme$elements4;
-    return (theme === null || theme === void 0 || (_theme$elements4 = theme.elements) === null || _theme$elements4 === void 0 ? void 0 : _theme$elements4.Tooltip) || _Tooltip.default;
-  }, [theme]);
-  const Type = _react.default.useMemo(() => {
-    var _theme$elements5;
-    return (theme === null || theme === void 0 || (_theme$elements5 = theme.elements) === null || _theme$elements5 === void 0 ? void 0 : _theme$elements5.Type) || _Type.default;
-  }, [theme]);
-  const Button = _react.default.useMemo(() => {
-    var _theme$elements6;
-    return (theme === null || theme === void 0 || (_theme$elements6 = theme.elements) === null || _theme$elements6 === void 0 ? void 0 : _theme$elements6.Button) || _Button.default;
-  }, [theme]);
-  const Select = _react.default.useMemo(() => {
-    var _theme$elements7;
-    return (theme === null || theme === void 0 || (_theme$elements7 = theme.elements) === null || _theme$elements7 === void 0 ? void 0 : _theme$elements7.Select) || _Select.default;
-  }, [theme]);
-  const CalendarWeek = _react.default.useMemo(() => {
-    var _theme$elements8;
-    return (theme === null || theme === void 0 || (_theme$elements8 = theme.elements) === null || _theme$elements8 === void 0 ? void 0 : _theme$elements8.CalendarWeek) || _CalendarWeek.default;
-  }, [theme]);
+  const props = _objectSpread(_objectSpread(_objectSpread({}, theme === null || theme === void 0 || (_theme$ui = theme.ui) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.elements) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.all) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.props) === null || _theme$ui === void 0 ? void 0 : _theme$ui.default), theme === null || theme === void 0 || (_theme$ui2 = theme.ui) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.elements) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.onesyCalendarViews) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
+  const CalendarMonth = (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.CalendarMonth) || _CalendarMonth.default;
+  const IconButton = (theme === null || theme === void 0 || (_theme$elements2 = theme.elements) === null || _theme$elements2 === void 0 ? void 0 : _theme$elements2.IconButton) || _IconButton.default;
+  const Line = (theme === null || theme === void 0 || (_theme$elements3 = theme.elements) === null || _theme$elements3 === void 0 ? void 0 : _theme$elements3.Line) || _Line.default;
+  const Tooltip = (theme === null || theme === void 0 || (_theme$elements4 = theme.elements) === null || _theme$elements4 === void 0 ? void 0 : _theme$elements4.Tooltip) || _Tooltip.default;
+  const Type = (theme === null || theme === void 0 || (_theme$elements5 = theme.elements) === null || _theme$elements5 === void 0 ? void 0 : _theme$elements5.Type) || _Type.default;
+  const Button = (theme === null || theme === void 0 || (_theme$elements6 = theme.elements) === null || _theme$elements6 === void 0 ? void 0 : _theme$elements6.Button) || _Button.default;
+  const Select = (theme === null || theme === void 0 || (_theme$elements7 = theme.elements) === null || _theme$elements7 === void 0 ? void 0 : _theme$elements7.Select) || _Select.default;
+  const CalendarWeek = (theme === null || theme === void 0 || (_theme$elements8 = theme.elements) === null || _theme$elements8 === void 0 ? void 0 : _theme$elements8.CalendarWeek) || _CalendarWeek.default;
   const {
       viewDefault,
       dateDefault,
@@ -232,32 +206,32 @@ const CalendarViews = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
       l
     });
   }, [view, date]);
-  const onChangeView = _react.default.useCallback(valueNew => {
+  const onChangeView = valueNew => {
     setView(valueNew);
     if ((0, _utils.is)('function', onChangeViewProps)) onChangeViewProps(valueNew);
-  }, [onChangeViewProps]);
-  const onToday = _react.default.useCallback(() => {
-    const valueNew = new _date.OnesyDate();
-    setDate(valueNew);
-    if ((0, _utils.is)('function', onChangeDateProps)) onChangeDateProps(valueNew);
-  }, [onChangeDateProps]);
-  const onPrevious = _react.default.useCallback(() => {
-    let valueNew = new _date.OnesyDate();
+  };
+  const onToday = () => {
+    const valueNew_0 = new _date.OnesyDate();
+    setDate(valueNew_0);
+    if ((0, _utils.is)('function', onChangeDateProps)) onChangeDateProps(valueNew_0);
+  };
+  const onPrevious = () => {
+    let valueNew_1 = new _date.OnesyDate();
     setDate(previous => {
-      valueNew = (0, _date.remove)(1, view, previous);
-      return valueNew;
+      valueNew_1 = (0, _date.remove)(1, view, previous);
+      return valueNew_1;
     });
-    if ((0, _utils.is)('function', onChangeDateProps)) onChangeDateProps(valueNew);
-  }, [view, onChangeDateProps]);
-  const onNext = _react.default.useCallback(() => {
-    let valueNew = new _date.OnesyDate();
-    setDate(previous => {
-      valueNew = (0, _date.add)(1, view, previous);
-      return valueNew;
+    if ((0, _utils.is)('function', onChangeDateProps)) onChangeDateProps(valueNew_1);
+  };
+  const onNext = () => {
+    let valueNew_2 = new _date.OnesyDate();
+    setDate(previous_0 => {
+      valueNew_2 = (0, _date.add)(1, view, previous_0);
+      return valueNew_2;
     });
-    if ((0, _utils.is)('function', onChangeDateProps)) onChangeDateProps(valueNew);
-  }, [view, onChangeDateProps]);
-  const renderDay = _react.default.useCallback((valueCalendarMonth, propsDay, day, outside) => {
+    if ((0, _utils.is)('function', onChangeDateProps)) onChangeDateProps(valueNew_2);
+  };
+  const renderDay = (valueCalendarMonth, propsDay, day, outside) => {
     return /*#__PURE__*/_react.default.createElement(Line, {
       gap: 0.5,
       direction: "column",
@@ -281,8 +255,8 @@ const CalendarViews = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
       fullWidth: true,
       className: classes.contentItemsMonth
     }, (0, _utils.is)('function', render) && render(valueCalendarMonth, view)));
-  }, [render, view]);
-  const renderDayName = _react.default.useCallback(order => {
+  };
+  const renderDayName = order => {
     const values = {
       1: l('Mo'),
       2: l('Tu'),
@@ -293,7 +267,7 @@ const CalendarViews = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
       7: l('Su')
     };
     return values[order];
-  }, []);
+  };
   const ui = {
     month: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(Line, {
       gap: 0,

package/CalendarWeek/CalendarWeek.d.ts

@@ -3,7 +3,7 @@ import { OnesyDate } from '@onesy/date';
 import { ILine } from '../Line/Line';
 import { ICalendarEvent } from '../CalendarAvailability/CalendarAvailability';
 import { ICalendarViewsView } from '../CalendarViews/CalendarViews';
-export type ICalendarWeek = ILine & {
+export declare type ICalendarWeek = ILine & {
     date?: OnesyDate;
     times?: any;
     events?: ICalendarEvent[];