@semcore/date-picker 17.0.0-prerelease.34 → 17.0.0-prerelease.37

package/CHANGELOG.md

@@ -2,7 +2,7 @@
 
 CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
 
-## [17.0.0] - 2026-04-08
+## [17.0.0] - 2026-04-13
 
 ### BREAK
 

package/lib/esm/DatePicker.mjs

@@ -1,5 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { createComponent, Component, sstyled, assignProps } from "@semcore/core";
+import { Component, sstyled, assignProps, createComponent } from "@semcore/core";
 import { Box } from "@semcore/base-components";
 import Button from "@semcore/button";
 import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";

package/lib/esm/DateRangeComparator.mjs

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { createComponent, sstyled, assignProps } from "@semcore/core";
-import { Flex, Box } from "@semcore/base-components";
+import { sstyled, assignProps, createComponent } from "@semcore/core";
+import { Box, Flex } from "@semcore/base-components";
 import Divider from "@semcore/divider";
 import React from "react";
 import { Period, Next, Prev, Title, Header as Header$1, Popper } from "./components/index.mjs";

package/lib/esm/DateRangePicker.mjs

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import { createComponent } from "@semcore/core";
 import dayjs from "dayjs";
 import React from "react";
-import { Period, Next, Prev, Title, Header, Popper, Trigger, InputTrigger } from "./components/index.mjs";
+import { InputTrigger, Period, Next, Prev, Title, Header, Popper, Trigger } from "./components/index.mjs";
 import { CalendarDays } from "./components/Calendar.mjs";
 import RangePickerAbstract, { Reset, Apply } from "./components/RangePickerAbstract.mjs";
 import shortDateRangeFormat from "./utils/shortDateRangeFormat.mjs";

package/lib/esm/MonthDateRangeComparator.mjs

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { createComponent, sstyled, assignProps } from "@semcore/core";
-import { Flex, Box } from "@semcore/base-components";
+import { sstyled, assignProps, createComponent } from "@semcore/core";
+import { Box, Flex } from "@semcore/base-components";
 import Divider from "@semcore/divider";
 import dayjs from "dayjs";
 import React from "react";

package/lib/esm/MonthPicker.mjs

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import { createComponent } from "@semcore/core";
 import dayjs from "dayjs";
 import React from "react";
-import { Next, Prev, Title, Header, Popper, Trigger, InputTrigger } from "./components/index.mjs";
+import { InputTrigger, Next, Prev, Title, Header, Popper, Trigger } from "./components/index.mjs";
 import { CalendarMonths } from "./components/Calendar.mjs";
 import PickerAbstract from "./components/PickerAbstract.mjs";
 const dateParts = {

package/lib/esm/MonthRangePicker.mjs

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import { createComponent } from "@semcore/core";
 import dayjs from "dayjs";
 import React from "react";
-import { Period, Next, Prev, Title, Header, Popper, Trigger, InputTrigger } from "./components/index.mjs";
+import { InputTrigger, Period, Next, Prev, Title, Header, Popper, Trigger } from "./components/index.mjs";
 import { CalendarMonths } from "./components/Calendar.mjs";
 import RangePickerAbstract, { Reset, Apply } from "./components/RangePickerAbstract.mjs";
 import shortDateRangeFormat from "./utils/shortDateRangeFormat.mjs";

package/lib/esm/components/ButtonTrigger.mjs

@@ -1,4 +1,4 @@
-import { createComponent, assignProps } from "@semcore/core";
+import { assignProps, createComponent } from "@semcore/core";
 import BaseTrigger from "@semcore/base-trigger";
 import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
 import Calendar from "@semcore/icon/Calendar/m";

package/lib/esm/components/Calendar.mjs

@@ -1,14 +1,13 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { createComponent, sstyled, assignProps, Component } from "@semcore/core";
+import { sstyled, Component, assignProps, createComponent } from "@semcore/core";
 import { Box, ScreenReaderOnly } from "@semcore/base-components";
 import fire from "@semcore/core/lib/utils/fire";
 import dayjs from "dayjs";
 import React from "react";
-import { formatMMYY, formatDDMMYY } from "../utils/formatDate.mjs";
+import { formatDDMMYY, formatMMYY } from "../utils/formatDate.mjs";
 import { includesDate } from "../utils/includesDate.mjs";
 import isBetween from "../utils/isBetweenPlugin.mjs";
-/*!__reshadow-styles__:"../style/calendar.shadow.css"*/
 const style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(

package/lib/esm/components/DateRangeComparatorAbstract.mjs

@@ -1,5 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled, assignProps, Component } from "@semcore/core";
+import { sstyled, Component, assignProps } from "@semcore/core";
 import { Flex } from "@semcore/base-components";
 import { LinkTrigger } from "@semcore/base-trigger";
 import Button from "@semcore/button";
@@ -12,7 +12,6 @@ import { localizedMessages } from "../translations/__intergalactic-dynamic-local
 import { formatMMYY, formatDDMMYY } from "../utils/formatDate.mjs";
 import { includesDate } from "../utils/includesDate.mjs";
 import shortDateRangeFormat from "../utils/shortDateRangeFormat.mjs";
-/*!__reshadow-styles__:"../style/date-picker.shadow.css"*/
 const style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
@@ -87,7 +86,7 @@ class DateRangeComparatorAbstract extends Component {
         preselectedValue,
         preselectedCompare
       } = this.asProps;
-      return this.handleApply(preselectedValue ?? (value == null ? void 0 : value.value), preselectedCompare ?? (value == null ? void 0 : value.compare));
+      return this.handleApply(preselectedValue ?? value?.value, preselectedCompare ?? value?.compare);
     });
     _defineProperty(this, "handleApply", (value, compare) => {
       this.handlers.value({
@@ -97,7 +96,6 @@ class DateRangeComparatorAbstract extends Component {
       this.handlers.visible(false);
     });
     _defineProperty(this, "handleKeydownDown", (place) => (e) => {
-      var _a;
       const {
         displayedPeriod,
         preselectedValue,
@@ -125,15 +123,15 @@ class DateRangeComparatorAbstract extends Component {
       const setNextDisplayedPeriod = (next_highlighted) => {
         const [startPeriod, endPeriod] = next_highlighted;
         const highlightedPeriod = endPeriod || startPeriod;
-        let displayedPeriodNormalized = displayedPeriod == null ? void 0 : displayedPeriod.getDate();
-        let highlightedPeriodNormalized = highlightedPeriod == null ? void 0 : highlightedPeriod.getDate();
+        let displayedPeriodNormalized = displayedPeriod?.getDate();
+        let highlightedPeriodNormalized = highlightedPeriod?.getDate();
         if (this.navigateStep === "month") {
-          displayedPeriodNormalized = displayedPeriod == null ? void 0 : displayedPeriod.getMonth();
-          highlightedPeriodNormalized = highlightedPeriod == null ? void 0 : highlightedPeriod.getMonth();
+          displayedPeriodNormalized = displayedPeriod?.getMonth();
+          highlightedPeriodNormalized = highlightedPeriod?.getMonth();
         }
         if (this.navigateStep === "year") {
-          displayedPeriodNormalized = displayedPeriod == null ? void 0 : displayedPeriod.getYear();
-          highlightedPeriodNormalized = highlightedPeriod == null ? void 0 : highlightedPeriod.getYear();
+          displayedPeriodNormalized = displayedPeriod?.getYear();
+          highlightedPeriodNormalized = highlightedPeriod?.getYear();
         }
         const offset = highlightedPeriodNormalized - displayedPeriodNormalized;
         if (offset < 0 || offset > 1) {
@@ -160,7 +158,7 @@ class DateRangeComparatorAbstract extends Component {
         if (INTERACTION_TAGS.includes(e.target.tagName)) return;
         if (highlighted.length) {
           let next_highlighted;
-          if ((preselectedValue == null ? void 0 : preselectedValue.length) === 1) {
+          if (preselectedValue?.length === 1) {
             next_highlighted = [preselectedValue[0], dayjs(highlighted[1] || highlighted[0]).add(day, this.keyStep).toDate()];
             changedDate = next_highlighted[1];
           } else {
@@ -186,7 +184,7 @@ class DateRangeComparatorAbstract extends Component {
         if (changedDate) {
           const formatter = this.keyStep === "month" ? formatMMYY : formatDDMMYY;
           const formattedDate = formatter(changedDate, this.asProps.locale);
-          (_a = this.unitRefs[formattedDate]) == null ? void 0 : _a.focus();
+          this.unitRefs[formattedDate]?.focus();
         }
       }
     });
@@ -205,16 +203,16 @@ class DateRangeComparatorAbstract extends Component {
       let value = focusedRange === "compare" ? preselectedCompare : preselectedValue;
       if (Array.isArray(date)) {
         value = date;
-      } else if (!(value == null ? void 0 : value.length)) {
+      } else if (!value?.length) {
         value = [date];
         highlighted = [date];
-      } else if ((value == null ? void 0 : value.length) >= 2) {
+      } else if (value?.length >= 2) {
         value = [date];
         highlighted = [date];
-      } else if ((value == null ? void 0 : value[0]) > date) {
-        value = [date, value == null ? void 0 : value[0]];
+      } else if (value?.[0] > date) {
+        value = [date, value?.[0]];
       } else {
-        value = [value == null ? void 0 : value[0], date];
+        value = [value?.[0], date];
       }
       if (focusedRange === "compare") {
         this.handlers.preselectedCompare(value);
@@ -248,7 +246,6 @@ class DateRangeComparatorAbstract extends Component {
     };
   }
   getPeriodProps() {
-    var _a, _b;
     const {
       periods = this.getDefaultPeriods(),
       onHighlightedChange,
@@ -259,9 +256,9 @@ class DateRangeComparatorAbstract extends Component {
       focusedRange,
       getI18nText
     } = this.asProps;
-    let value = preselectedValue ?? ((_a = this.asProps.value) == null ? void 0 : _a.value);
+    let value = preselectedValue ?? this.asProps.value?.value;
     if (focusedRange === "compare") {
-      value = preselectedCompare ?? ((_b = this.asProps.value) == null ? void 0 : _b.compare);
+      value = preselectedCompare ?? this.asProps.value?.compare;
     }
     return {
       periods,
@@ -315,7 +312,6 @@ class DateRangeComparatorAbstract extends Component {
     return {
       displayedPeriod: null,
       visible: [null, (visible) => {
-        var _a, _b;
         if (!visible) {
           this.handlers.highlighted([]);
           this.handlers.compareHighlighted([]);
@@ -324,7 +320,7 @@ class DateRangeComparatorAbstract extends Component {
           this.handlers.compareToggle(void 0);
           this.handlers.focusedRange("value");
         } else {
-          this.handlers.compareToggle(!!((_b = (_a = this.asProps.value) == null ? void 0 : _a.compare) == null ? void 0 : _b.length));
+          this.handlers.compareToggle(!!this.asProps.value?.compare?.length);
         }
         const {
           value,
@@ -350,10 +346,7 @@ class DateRangeComparatorAbstract extends Component {
       compareToggle: null,
       focusedRange: null,
       value: [null, (value) => {
-        const dates = [value == null ? void 0 : value.value, value == null ? void 0 : value.compare].flat(2).filter((date) => {
-          var _a;
-          return (_a = date == null ? void 0 : date.isValid) == null ? void 0 : _a.call(date);
-        });
+        const dates = [value?.value, value?.compare].flat(2).filter((date) => date?.isValid?.());
         if (dates.length > 0) this.handlers.displayedPeriod(getLatestDate(value));
       }]
     };
@@ -419,22 +412,21 @@ class DateRangeComparatorAbstract extends Component {
     placeholder = "Select date ranges",
     separator = "vs."
   }) {
-    var _a, _b;
     const {
       locale,
       visible
     } = this.asProps;
-    const value = (_a = this.asProps.value) == null ? void 0 : _a.value;
-    const compare = (_b = this.asProps.value) == null ? void 0 : _b.compare;
+    const value = this.asProps.value?.value;
+    const compare = this.asProps.value?.compare;
     const formattingProps = {
       locale,
       ...this.triggerFormattingProps
     };
     let children = placeholder;
-    if ((value == null ? void 0 : value[0]) && (value == null ? void 0 : value[1])) {
+    if (value?.[0] && value?.[1]) {
       children = shortDateRangeFormat(value, formattingProps);
     }
-    if ((compare == null ? void 0 : compare[0]) && (compare == null ? void 0 : compare[1])) {
+    if (compare?.[0] && compare?.[1]) {
       children = `${children || ""} ${separator} ${shortDateRangeFormat(compare, formattingProps)}`;
     }
     return {
@@ -468,7 +460,7 @@ class DateRangeComparatorAbstract extends Component {
     return {
       popoverVisible: visible,
       focused: focusedRange === "value" ? true : void 0,
-      value: preselectedValue ?? (value == null ? void 0 : value.value),
+      value: preselectedValue ?? value?.value,
       onChange: (value2) => this.handlers.preselectedValue(value2),
       onDisplayedPeriodChange,
       locale,
@@ -483,7 +475,6 @@ class DateRangeComparatorAbstract extends Component {
     };
   }
   getCompareDateRangeProps() {
-    var _a;
     const {
       value,
       onDisplayedPeriodChange,
@@ -500,8 +491,8 @@ class DateRangeComparatorAbstract extends Component {
     return {
       popoverVisible: visible,
       focused: focusedRange === "compare" ? true : void 0,
-      disabled: !(compareToggle ?? ((_a = value == null ? void 0 : value.compare) == null ? void 0 : _a.length)),
-      value: preselectedCompare ?? (value == null ? void 0 : value.compare),
+      disabled: !(compareToggle ?? value?.compare?.length),
+      value: preselectedCompare ?? value?.compare,
       onChange: (value2) => this.handlers.preselectedCompare(value2),
       onDisplayedPeriodChange,
       locale,
@@ -560,8 +551,8 @@ class DateRangeComparatorAbstract extends Component {
       onCompareHighlightedChange,
       onHighlightedChange,
       range: focusedRange,
-      value: preselectedValue ?? (value == null ? void 0 : value.value),
-      compare: preselectedCompare ?? (value == null ? void 0 : value.compare),
+      value: preselectedValue ?? value?.value,
+      compare: preselectedCompare ?? value?.compare,
       unitRefs: this.unitRefs,
       getI18nText,
       actionsDescribing: index === 0 ? "range-compare" : null,

package/lib/esm/components/InputTrigger.mjs

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { createComponent, Component, sstyled, assignProps } from "@semcore/core";
-import { Box, Flex, NeighborLocation } from "@semcore/base-components";
+import { sstyled, Component, assignProps, createComponent } from "@semcore/core";
+import { Box, NeighborLocation, Flex } from "@semcore/base-components";
 import BaseTrigger from "@semcore/base-trigger";
 import assignProps$1 from "@semcore/core/lib/utils/assignProps";
 import useEnhancedEffect from "@semcore/core/lib/utils/use/useEnhancedEffect";
@@ -12,7 +12,6 @@ import dayjs from "dayjs";
 import React from "react";
 import { datesIntersects } from "../utils/datesIntersects.mjs";
 import { includesDate } from "../utils/includesDate.mjs";
-/*!__reshadow-styles__:"../style/date-picker.shadow.css"*/
 const style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
@@ -237,11 +236,10 @@ class DateRangeRoot extends Component {
     _defineProperty(this, "fromRef", /* @__PURE__ */ React.createRef());
     _defineProperty(this, "toRef", /* @__PURE__ */ React.createRef());
     _defineProperty(this, "handleFromChange", (value, event) => {
-      var _a, _b;
       const {
         onChange
       } = this.asProps;
-      const prevValue = [((_a = this.asProps.value) == null ? void 0 : _a[0]) ?? null, ((_b = this.asProps.value) == null ? void 0 : _b[1]) ?? null];
+      const prevValue = [this.asProps.value?.[0] ?? null, this.asProps.value?.[1] ?? null];
       onChange([value, prevValue[1]], event);
       if (value) {
         if (!this.toRef.current) return;
@@ -253,11 +251,10 @@ class DateRangeRoot extends Component {
       }
     });
     _defineProperty(this, "handleToChange", (value, event) => {
-      var _a, _b;
       const {
         onChange
       } = this.asProps;
-      const prevValue = [((_a = this.asProps.value) == null ? void 0 : _a[0]) ?? null, ((_b = this.asProps.value) == null ? void 0 : _b[1]) ?? null];
+      const prevValue = [this.asProps.value?.[0] ?? null, this.asProps.value?.[1] ?? null];
       onChange([prevValue[0], value], event);
     });
     _defineProperty(this, "handleFromKeydown", (event) => {
@@ -370,7 +367,7 @@ class DateRangeRoot extends Component {
     } = this.asProps;
     return assignProps$1({
       "ref": this.fromRef,
-      "date": value == null ? void 0 : value[0],
+      "date": value?.[0],
       "onDateChange": this.handleFromChange,
       "onKeyDown": this.handleFromKeydown,
       locale,
@@ -396,7 +393,7 @@ class DateRangeRoot extends Component {
     });
     return assignProps$1({
       "ref": this.toRef,
-      "date": value == null ? void 0 : value[1],
+      "date": value?.[1],
       "onDateChange": this.handleToChange,
       "onKeyDown": this.handleToKeydown,
       locale,
@@ -608,8 +605,7 @@ function MaskedInput({
   const value = React.useMemo(() => stringifyValue(internalValue), [stringifyValue, internalValue]);
   const lastKnownOuterValue = React.useRef(outer);
   React.useEffect(() => {
-    var _a, _b, _c;
-    if (((_a = lastKnownOuterValue.current) == null ? void 0 : _a.day) !== (outer == null ? void 0 : outer.day) || ((_b = lastKnownOuterValue.current) == null ? void 0 : _b.month) !== (outer == null ? void 0 : outer.month) || ((_c = lastKnownOuterValue.current) == null ? void 0 : _c.year) !== (outer == null ? void 0 : outer.year)) {
+    if (lastKnownOuterValue.current?.day !== outer?.day || lastKnownOuterValue.current?.month !== outer?.month || lastKnownOuterValue.current?.year !== outer?.year) {
       setInternalValue(outer);
     }
     lastKnownOuterValue.current = outer;
@@ -623,7 +619,7 @@ function MaskedInput({
       }
     }
     if (placeholdersOnly) {
-      onMaskPipeBlock == null ? void 0 : onMaskPipeBlock(null);
+      onMaskPipeBlock?.(null);
       return "";
     }
     const getOffsetTo = (partName) => {
@@ -680,13 +676,13 @@ function MaskedInput({
       const monthParsed = allowedParts.month ? Number.parseInt(month, 10) - 1 : 0;
       const dayParsed = allowedParts.day ? Number.parseInt(day, 10) : 1;
       date.setFullYear(yearParsed, monthParsed, dayParsed);
-      if (disabledDates == null ? void 0 : disabledDates.some(includesDate(dayjs(date), "date"))) {
-        onMaskPipeBlock == null ? void 0 : onMaskPipeBlock(date);
+      if (disabledDates?.some(includesDate(dayjs(date), "date"))) {
+        onMaskPipeBlock?.(date);
         return false;
       }
       if (allowedParts.day) {
         if (date.getDate() !== Number.parseInt(day, 10)) {
-          onMaskPipeBlock == null ? void 0 : onMaskPipeBlock(date);
+          onMaskPipeBlock?.(date);
           return false;
         }
       }
@@ -697,7 +693,7 @@ function MaskedInput({
       if (part === "month") result.push(month);
       if (part === "day") result.push(day);
     }
-    onMaskPipeBlock == null ? void 0 : onMaskPipeBlock(null);
+    onMaskPipeBlock?.(null);
     return {
       value: result.join(sep),
       indexesOfPipedChars
@@ -818,13 +814,11 @@ function MaskedInput({
   const [innerFocused, setInnerFocused] = React.useState(false);
   const focused = containerFocused ?? innerFocused;
   const handleFocus = React.useCallback((event) => {
-    var _a;
-    (_a = otherProps.onFocus) == null ? void 0 : _a.call(otherProps, event);
+    otherProps.onFocus?.(event);
     setInnerFocused(true);
   }, []);
   const handleBlur = React.useCallback((event) => {
-    var _a;
-    (_a = otherProps.onBlur) == null ? void 0 : _a.call(otherProps, event);
+    otherProps.onBlur?.(event);
     setInnerFocused(false);
   }, []);
   useEnhancedEffect(() => {

package/lib/esm/components/PickerAbstract.mjs

@@ -1,5 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { Component, CORE_INSTANCE, sstyled, assignProps } from "@semcore/core";
+import { sstyled, Component, CORE_INSTANCE, assignProps } from "@semcore/core";
 import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
 import Dropdown from "@semcore/dropdown";
 import dayjs from "dayjs";
@@ -7,7 +7,6 @@ import React from "react";
 import { localizedMessages } from "../translations/__intergalactic-dynamic-locales.mjs";
 import { formatMMYY, formatDDMMYY } from "../utils/formatDate.mjs";
 import { includesDate } from "../utils/includesDate.mjs";
-/*!__reshadow-styles__:"../style/date-picker.shadow.css"*/
 const style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
@@ -72,7 +71,6 @@ class PickerAbstract extends Component {
       this.navigateView(direction);
     });
     _defineProperty(this, "handlerKeyDown", (place) => (e) => {
-      var _a;
       const {
         value,
         displayedPeriod,
@@ -115,7 +113,7 @@ class PickerAbstract extends Component {
           e.preventDefault();
           const formatter = this.keyStep === "month" ? formatMMYY : formatDDMMYY;
           const formattedDate = formatter(current_day, this.asProps.locale);
-          (_a = this.unitRefs[formattedDate]) == null ? void 0 : _a.focus();
+          this.unitRefs[formattedDate]?.focus();
         }
       }
     });

package/lib/esm/components/RangePickerAbstract.mjs

@@ -1,5 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { assignProps, Component, CORE_INSTANCE, sstyled } from "@semcore/core";
+import { sstyled, Component, CORE_INSTANCE, assignProps } from "@semcore/core";
 import { Flex, Box } from "@semcore/base-components";
 import Button from "@semcore/button";
 import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
@@ -10,7 +10,6 @@ import React from "react";
 import { localizedMessages } from "../translations/__intergalactic-dynamic-locales.mjs";
 import { formatMMYY, formatDDMMYY } from "../utils/formatDate.mjs";
 import { includesDate } from "../utils/includesDate.mjs";
-/*!__reshadow-styles__:"../style/date-picker.shadow.css"*/
 const style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
@@ -81,7 +80,6 @@ class RangePickerAbstract extends Component {
     });
     _defineProperty(this, "bindHandlerNavigateClick", (direction) => () => this.navigateView(direction));
     _defineProperty(this, "handlerKeyDown", (place) => (e) => {
-      var _a;
       const {
         displayedPeriod,
         highlighted,
@@ -107,15 +105,15 @@ class RangePickerAbstract extends Component {
       const setNextDisplayedPeriod = (next_highlighted) => {
         const [startPeriod, endPeriod] = next_highlighted;
         const highlightedPeriod = endPeriod || startPeriod;
-        let displayedPeriodNormalized = displayedPeriod == null ? void 0 : displayedPeriod.getDate();
-        let highlightedPeriodNormalized = highlightedPeriod == null ? void 0 : highlightedPeriod.getDate();
+        let displayedPeriodNormalized = displayedPeriod?.getDate();
+        let highlightedPeriodNormalized = highlightedPeriod?.getDate();
         if (this.navigateStep === "month") {
-          displayedPeriodNormalized = displayedPeriod == null ? void 0 : displayedPeriod.getMonth();
-          highlightedPeriodNormalized = highlightedPeriod == null ? void 0 : highlightedPeriod.getMonth();
+          displayedPeriodNormalized = displayedPeriod?.getMonth();
+          highlightedPeriodNormalized = highlightedPeriod?.getMonth();
         }
         if (this.navigateStep === "year") {
-          displayedPeriodNormalized = displayedPeriod == null ? void 0 : displayedPeriod.getYear();
-          highlightedPeriodNormalized = highlightedPeriod == null ? void 0 : highlightedPeriod.getYear();
+          displayedPeriodNormalized = displayedPeriod?.getYear();
+          highlightedPeriodNormalized = highlightedPeriod?.getYear();
         }
         const offset = highlightedPeriodNormalized - displayedPeriodNormalized;
         if (offset < 0 || offset > 1) {
@@ -160,7 +158,7 @@ class RangePickerAbstract extends Component {
         if (changedDate) {
           const formatter = this.keyStep === "month" ? formatMMYY : formatDDMMYY;
           const formattedDate = formatter(changedDate, this.asProps.locale);
-          (_a = this.unitRefs[formattedDate]) == null ? void 0 : _a.focus();
+          this.unitRefs[formattedDate]?.focus();
         }
       }
     });

package/lib/esm/components/index.mjs

@@ -117,7 +117,7 @@ class Period extends Component {
       onMouseLeave,
       ...other
     }, i) => /* @__PURE__ */ React.createElement(Button, _extends({
-      ref: periodRef == null ? void 0 : periodRef(i),
+      ref: periodRef?.(i),
       key: i,
       use: "tertiary",
       theme: "muted",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/date-picker",
   "description": "Semrush DatePicker Component",
-  "version": "17.0.0-prerelease.34",
+  "version": "17.0.0-prerelease.37",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
@@ -14,15 +14,15 @@
     "types": "./lib/types/index.d.ts"
   },
   "dependencies": {
-    "@semcore/base-trigger": "^17.0.0-prerelease.34",
-    "@semcore/button": "^17.0.0-prerelease.34",
-    "@semcore/divider": "^17.0.0-prerelease.34",
-    "@semcore/dropdown": "^17.0.0-prerelease.34",
-    "@semcore/input": "^17.0.0-prerelease.34",
-    "@semcore/input-mask": "^17.0.0-prerelease.34",
-    "@semcore/typography": "^17.0.0-prerelease.34",
-    "@semcore/checkbox": "^17.0.0-prerelease.34",
-    "@semcore/tooltip": "^17.0.0-prerelease.34",
+    "@semcore/base-trigger": "^17.0.0-prerelease.37",
+    "@semcore/button": "^17.0.0-prerelease.37",
+    "@semcore/divider": "^17.0.0-prerelease.37",
+    "@semcore/dropdown": "^17.0.0-prerelease.37",
+    "@semcore/input": "^17.0.0-prerelease.37",
+    "@semcore/input-mask": "^17.0.0-prerelease.37",
+    "@semcore/typography": "^17.0.0-prerelease.37",
+    "@semcore/checkbox": "^17.0.0-prerelease.37",
+    "@semcore/tooltip": "^17.0.0-prerelease.37",
     "dayjs": "1.8.36"
   },
   "peerDependencies": {
@@ -35,10 +35,10 @@
     "directory": "semcore/date-picker"
   },
   "devDependencies": {
-    "@semcore/core": "17.0.0-prerelease.34",
-    "@semcore/base-components": "17.0.0-prerelease.34",
+    "@semcore/core": "17.0.0-prerelease.37",
+    "@semcore/base-components": "17.0.0-prerelease.37",
     "@semcore/testing-utils": "1.0.0",
-    "@semcore/icon": "16.7.2-prerelease.34"
+    "@semcore/icon": "16.7.2-prerelease.37"
   },
   "scripts": {
     "build": "pnpm semcore-builder --source=js && pnpm vite build"