@consta/uikit 3.4.0 → 3.8.0

package/__internal__/cjs-src/components/DateTimeCanary/DateTimeTypeTime/helpers.js

@@ -0,0 +1,50 @@
+"use strict";
+exports.__esModule = true;
+exports.useTimeItems = exports.dateTimeTimePropLocaleDefault = void 0;
+var react_1 = require("react");
+var date_fns_1 = require("date-fns");
+var useMutableRef_1 = require("../../../hooks/useMutableRef/useMutableRef");
+var array_1 = require("../../../utils/array");
+var date_1 = require("../../../utils/date");
+var helpers_1 = require("../helpers");
+exports.dateTimeTimePropLocaleDefault = {
+    hours: 'Час',
+    minutes: 'Мин',
+    seconds: 'Сек'
+};
+var getItemData = function (length, multiplicity, startOfUnits, startOfUnit, endOfUnit, addUnits, getItemLabel, value, minDate, maxDate, onChangeRef) {
+    if (multiplicity === void 0) { multiplicity = 1; }
+    var numbers = array_1.range(multiplicity ? Math.floor(length / multiplicity) : 0);
+    if (numbers.length === 0) {
+        return [];
+    }
+    var startDate = startOfUnits(value || date_fns_1.startOfToday());
+    return numbers.map(function (number) {
+        var date = addUnits(startDate, number * multiplicity);
+        var label = getItemLabel(date);
+        var selected = value ? getItemLabel(date) === getItemLabel(value) : false;
+        var disabled = !date_1.isInMinMaxDade(date, minDate, maxDate, startOfUnit, endOfUnit);
+        var onClick = function (e) { var _a; return !disabled && ((_a = onChangeRef === null || onChangeRef === void 0 ? void 0 : onChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onChangeRef, { e: e, value: date })); };
+        return {
+            label: label,
+            selected: selected,
+            disabled: disabled,
+            onClick: onClick
+        };
+    });
+};
+exports.useTimeItems = function (value, multiplicityHours, multiplicityMinutes, multiplicitySeconds, onChange, minDate, maxDate) {
+    var onChangeRef = useMutableRef_1.useMutableRef(onChange);
+    return react_1.useMemo(function () { return [
+        getItemData(24, multiplicityHours, date_fns_1.startOfDay, date_fns_1.startOfHour, date_fns_1.endOfHour, date_fns_1.addHours, helpers_1.getLabelHours, value, minDate, maxDate, onChangeRef),
+        getItemData(60, multiplicityMinutes, date_fns_1.startOfHour, date_fns_1.startOfMinute, date_fns_1.endOfMinute, date_fns_1.addMinutes, helpers_1.getLabelMinutes, value, minDate, maxDate, onChangeRef),
+        getItemData(60, multiplicitySeconds, date_fns_1.startOfMinute, date_fns_1.startOfSecond, date_fns_1.endOfSecond, date_fns_1.addSeconds, helpers_1.getLabelSeconds, value, minDate, maxDate, onChangeRef),
+    ]; }, [
+        value === null || value === void 0 ? void 0 : value.getTime(),
+        minDate === null || minDate === void 0 ? void 0 : minDate.getTime(),
+        maxDate === null || maxDate === void 0 ? void 0 : maxDate.getTime(),
+        multiplicityHours,
+        multiplicityMinutes,
+        multiplicitySeconds,
+    ]);
+};

package/__internal__/cjs-src/components/DateTimeCanary/DateTimeTypeYear/DateTimeTypeYear.d.ts

@@ -0,0 +1,2 @@
+import { DateTimeTypeComponent } from '../helpers';
+export declare const DateTimeTypeYear: DateTimeTypeComponent<'year'>;

package/__internal__/cjs-src/components/DateTimeCanary/DateTimeTypeYear/DateTimeTypeYear.js

@@ -0,0 +1,82 @@
+"use strict";
+exports.__esModule = true;
+exports.DateTimeTypeYear = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var date_fns_1 = require("date-fns");
+var ru_1 = tslib_1.__importDefault(require("date-fns/locale/ru"));
+var DateTime10Years_1 = require("../DateTime10Years/DateTime10Years");
+var DateTime100YearSlider_1 = require("../DateTime100YearSlider/DateTime100YearSlider");
+var DateTimeLabel_1 = require("../DateTimeLabel/DateTimeLabel");
+var DateTimeToggler_1 = require("../DateTimeToggler/DateTimeToggler");
+var helpers_1 = require("../helpers");
+var types_1 = require("../helpers/types");
+var mixs_1 = require("../mixs");
+exports.DateTimeTypeYear = react_1.forwardRef(function (props, ref) {
+    var minDate = props.minDate, maxDate = props.maxDate, value = props.value, onChange = props.onChange, onChangeRange = props.onChangeRange, currentVisibleDateProp = props.currentVisibleDate, events = props.events, _a = props.locale, locale = _a === void 0 ? ru_1["default"] : _a, className = props.className, _b = props.view, view = _b === void 0 ? types_1.dateTimePropViewDefault : _b, onMove = props.onMove, onChangeCurrentVisibleDate = props.onChangeCurrentVisibleDate, otherProps = tslib_1.__rest(props, ["minDate", "maxDate", "value", "onChange", "onChangeRange", "currentVisibleDate", "events", "locale", "className", "view", "onMove", "onChangeCurrentVisibleDate"]);
+    react_1.useEffect(function () {
+        onMove === null || onMove === void 0 ? void 0 : onMove(helpers_1.moveTypes[0]);
+    }, []);
+    var _c = tslib_1.__read(helpers_1.useCurrentVisibleDate({
+        currentVisibleDate: currentVisibleDateProp,
+        maxDate: maxDate,
+        minDate: minDate,
+        value: value,
+        startOfUnit: date_fns_1.startOfDecade,
+        onChangeCurrentVisibleDate: onChangeCurrentVisibleDate
+    }), 2), currentVisibleDate = _c[0], setCurrentVisibleDate = _c[1];
+    var handleSelectDate = helpers_1.getHandleSelectDate({
+        minDate: minDate,
+        maxDate: maxDate,
+        value: value,
+        onChange: onChange,
+        onChangeRange: onChangeRange,
+        isEqualUnit: helpers_1.isEqualYear
+    });
+    var pageOneYearsOfDecade = helpers_1.getYearsOfDecade({
+        date: currentVisibleDate,
+        onChange: handleSelectDate,
+        value: value,
+        events: events,
+        minDate: minDate,
+        maxDate: maxDate,
+        locale: locale
+    });
+    var pageOneLabel = helpers_1.getDecadeTitle(currentVisibleDate);
+    var handleNext = function () { return setCurrentVisibleDate(date_fns_1.addYears(currentVisibleDate, 10)); };
+    var handlePrev = function () { return setCurrentVisibleDate(date_fns_1.addYears(currentVisibleDate, -10)); };
+    if (view === types_1.dateTimePropView[0]) {
+        return (react_1["default"].createElement("div", tslib_1.__assign({}, otherProps, { className: mixs_1.cnDateTimeMixLayout({ view: view }, [className]), ref: ref }),
+            react_1["default"].createElement(DateTimeToggler_1.DateTimeToggler, { className: mixs_1.cnDateTimeMixLayout('Label'), prevOnClick: handlePrev, nextOnClick: handleNext, label: pageOneLabel }),
+            react_1["default"].createElement(DateTime10Years_1.DateTime10Years, { years: pageOneYearsOfDecade })));
+    }
+    var pageTwoCurrentVisibleDate = date_fns_1.addYears(currentVisibleDate, 10);
+    var pageTwoYearsOfDecade = helpers_1.getYearsOfDecade({
+        date: pageTwoCurrentVisibleDate,
+        onChange: handleSelectDate,
+        value: value,
+        events: events,
+        minDate: minDate,
+        maxDate: maxDate,
+        locale: locale
+    });
+    var pageTwoLabel = helpers_1.getDecadeTitle(pageTwoCurrentVisibleDate);
+    if (view === types_1.dateTimePropView[1]) {
+        return (react_1["default"].createElement("div", tslib_1.__assign({}, otherProps, { className: mixs_1.cnDateTimeMixLayout({ view: view }, [className]), ref: ref }),
+            react_1["default"].createElement("div", { className: mixs_1.cnDateTimeMixLayout('Page') },
+                react_1["default"].createElement(DateTimeToggler_1.DateTimeToggler, { className: mixs_1.cnDateTimeMixLayout('Label'), prevOnClick: handlePrev, label: pageOneLabel }),
+                react_1["default"].createElement(DateTime10Years_1.DateTime10Years, { years: pageOneYearsOfDecade })),
+            react_1["default"].createElement("div", { className: mixs_1.cnDateTimeMixLayout('Page') },
+                react_1["default"].createElement(DateTimeToggler_1.DateTimeToggler, { className: mixs_1.cnDateTimeMixLayout('Label'), nextOnClick: handleNext, label: pageTwoLabel }),
+                react_1["default"].createElement(DateTime10Years_1.DateTime10Years, { years: pageTwoYearsOfDecade }))));
+    }
+    return (react_1["default"].createElement("div", tslib_1.__assign({}, otherProps, { className: mixs_1.cnDateTimeMixLayout({ view: view }, [className]), ref: ref }),
+        react_1["default"].createElement(DateTime100YearSlider_1.DateTime100YearSlider, { className: mixs_1.cnDateTimeMixLayout('Slider'), currentVisibleDate: currentVisibleDate, onChange: setCurrentVisibleDate, value: value, locale: locale }),
+        react_1["default"].createElement("div", { className: mixs_1.cnDateTimeMixLayout('PageWrapper') },
+            react_1["default"].createElement("div", { className: mixs_1.cnDateTimeMixLayout('Page') },
+                react_1["default"].createElement(DateTimeLabel_1.DateTimeLabel, { className: mixs_1.cnDateTimeMixLayout('Label'), label: pageOneLabel }),
+                react_1["default"].createElement(DateTime10Years_1.DateTime10Years, { years: pageOneYearsOfDecade })),
+            react_1["default"].createElement("div", { className: mixs_1.cnDateTimeMixLayout('Page') },
+                react_1["default"].createElement(DateTimeLabel_1.DateTimeLabel, { className: mixs_1.cnDateTimeMixLayout('Label'), label: pageTwoLabel }),
+                react_1["default"].createElement(DateTime10Years_1.DateTime10Years, { years: pageTwoYearsOfDecade })))));
+});

package/__internal__/cjs-src/components/DateTimeCanary/DateTimeYear/DateTimeYear.css

@@ -0,0 +1,14 @@
+.DateTimeYear {
+  --date-time-item-width: calc(var(--control-height-s) * 7 / var(--date-time-grid-columns));
+  --date-time-item-height: var(--control-height-s);
+  --date-time-cell-vertical-gap: var(--space-3xs);
+  --date-time-cell-horisontal-gap: calc(var(--space-3xs) * 7 / var(--date-time-grid-columns));
+  --date-time-cell-width: calc(
+    var(--date-time-item-width) + (var(--date-time-cell-horisontal-gap) * 2)
+  );
+  --date-time-cell-height: calc(
+    var(--date-time-item-height) + (var(--date-time-cell-vertical-gap) * 2)
+  );
+  --date-time-grid-columns: 4;
+  --date-time-grid-row-gap: calc(var(--control-height-s) * 5 / 3);
+}

package/__internal__/cjs-src/components/DateTimeCanary/DateTimeYear/DateTimeYear.d.ts

@@ -0,0 +1,13 @@
+import './DateTimeYear.css';
+import React from 'react';
+import { PropsWithJsxAttributes } from '../../../utils/types/PropsWithJsxAttributes';
+import { DateTimeCellPropRange } from '../DateTimeCell/DateTimeCell';
+import { DateTimeItemProps } from '../DateTimeItem/DateTimeItem';
+export declare type DateTimeYearProps = PropsWithJsxAttributes<{
+    children?: never;
+    years: Omit<DateTimeItemProps & {
+        range?: DateTimeCellPropRange;
+    }, 'ref'>[];
+}, 'div'>;
+export declare const cnDateTimeYear: import("@bem-react/classname").ClassNameFormatter;
+export declare const DateTimeYear: React.FC<DateTimeYearProps>;

package/__internal__/cjs-src/components/DateTimeCanary/DateTimeYear/DateTimeYear.js

@@ -0,0 +1,13 @@
+"use strict";
+exports.__esModule = true;
+exports.DateTimeYear = exports.cnDateTimeYear = void 0;
+var tslib_1 = require("tslib");
+require("./DateTimeYear.css");
+var react_1 = tslib_1.__importDefault(require("react"));
+var bem_1 = require("../../../utils/bem");
+var DateTimeGrid_1 = require("../DateTimeGrid/DateTimeGrid");
+exports.cnDateTimeYear = bem_1.cn('DateTimeYear');
+exports.DateTimeYear = function (props) {
+    var className = props.className, years = props.years, otherProps = tslib_1.__rest(props, ["className", "years"]);
+    return (react_1["default"].createElement(DateTimeGrid_1.DateTimeGrid, tslib_1.__assign({}, otherProps, { className: exports.cnDateTimeYear(null, [className]), items: years })));
+};

package/__internal__/cjs-src/components/DateTimeCanary/DateTimeYearSlider/DateTimeYearSlider.css

@@ -0,0 +1,5 @@
+.DateTimeYearSlider {
+  --date-time-cell-width: calc(var(--control-height-s) + (var(--space-3xs) * 2));
+  --item-width: calc((var(--date-time-cell-width) * 14 - var(--control-height-m) * 2) / 13);
+  --parent-width: calc(var(--item-width) * 12);
+}

package/__internal__/cjs-src/components/DateTimeCanary/DateTimeYearSlider/DateTimeYearSlider.d.ts

@@ -0,0 +1,14 @@
+import './DateTimeYearSlider.css';
+import React from 'react';
+import { Locale } from 'date-fns';
+import { DateRange } from '../../../utils/types/Date';
+import { PropsWithHTMLAttributes } from '../../../utils/types/PropsWithHTMLAttributes';
+export declare type DateTimeYearSliderProps = PropsWithHTMLAttributes<{
+    currentVisibleDate: Date;
+    onChange: (date: Date) => void;
+    children?: never;
+    value?: Date | DateRange;
+    locale?: Locale;
+}, HTMLDivElement>;
+export declare const cnDateTimeYearSlider: import("@bem-react/classname").ClassNameFormatter;
+export declare const DateTimeYearSlider: React.FC<DateTimeYearSliderProps>;

package/__internal__/cjs-src/components/DateTimeCanary/DateTimeYearSlider/DateTimeYearSlider.js

@@ -0,0 +1,52 @@
+"use strict";
+exports.__esModule = true;
+exports.DateTimeYearSlider = exports.cnDateTimeYearSlider = void 0;
+var tslib_1 = require("tslib");
+require("./DateTimeYearSlider.css");
+var react_1 = tslib_1.__importDefault(require("react"));
+var date_fns_1 = require("date-fns");
+var ru_1 = tslib_1.__importDefault(require("date-fns/locale/ru"));
+var array_1 = require("../../../utils/array");
+var bem_1 = require("../../../utils/bem");
+var DateTimeSlider_1 = require("../DateTimeSlider/DateTimeSlider");
+var helpers_1 = require("../helpers");
+var getSliderValueRange_1 = require("../helpers/getSliderValueRange");
+exports.cnDateTimeYearSlider = bem_1.cn('DateTimeYearSlider');
+var isCurrentVisibleYear = function (currentDate, month) {
+    return date_fns_1.getYear(currentDate) === date_fns_1.getYear(month);
+};
+var isCurrentVisibleMonth = function (currentDate, month) {
+    return isCurrentVisibleYear(currentDate, month) && date_fns_1.getMonth(currentDate) === date_fns_1.getMonth(month);
+};
+var getYearItems = function (currentVisibleDate, date, locale) {
+    return array_1.range(12).map(function (month) {
+        var monthDate = date_fns_1.addMonths(date, month);
+        return {
+            date: monthDate,
+            label: helpers_1.getMonthTitleAbbreviated(monthDate, locale),
+            current: isCurrentVisibleMonth(currentVisibleDate, monthDate)
+        };
+    });
+};
+var getSliderData = function (currentVisibleDate, value, locale) {
+    var currentYear = date_fns_1.startOfYear(currentVisibleDate);
+    return [
+        date_fns_1.addYears(currentYear, -1),
+        currentYear,
+        date_fns_1.addYears(currentYear, 1),
+        date_fns_1.addYears(currentYear, 2),
+    ].map(function (date) { return ({
+        label: date_fns_1.format(date, 'yyyy', { locale: locale }),
+        date: date,
+        items: getYearItems(currentVisibleDate, date, locale),
+        current: isCurrentVisibleYear(currentVisibleDate, date),
+        valueRange: getSliderValueRange_1.getSliderValueRange(date, value, date_fns_1.startOfYear, date_fns_1.endOfYear)
+    }); });
+};
+exports.DateTimeYearSlider = function (props) {
+    var currentVisibleDate = props.currentVisibleDate, className = props.className, onChange = props.onChange, value = props.value, _a = props.locale, locale = _a === void 0 ? ru_1["default"] : _a, otherProps = tslib_1.__rest(props, ["currentVisibleDate", "className", "onChange", "value", "locale"]);
+    var handlePrev = function () { return onChange(date_fns_1.addYears(currentVisibleDate, -1)); };
+    var handleNext = function () { return onChange(date_fns_1.addYears(currentVisibleDate, 1)); };
+    var data = getSliderData(currentVisibleDate, value, locale);
+    return (react_1["default"].createElement(DateTimeSlider_1.DateTimeSlider, tslib_1.__assign({ className: exports.cnDateTimeYearSlider(null, [className]), onNext: handleNext, onPrev: handlePrev, data: data, onChange: onChange }, otherProps)));
+};

package/__internal__/cjs-src/components/DateTimeCanary/helpers/getDaysOfMonth.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { Locale } from 'date-fns';
+import { range } from '../../../utils/array';
+import { DateRange } from '../../../utils/types/Date';
+import { DateTimeCellPropRange } from '../DateTimeCell/DateTimeCell';
+import { HandleSelectDate } from './types';
+export declare const getDaysOfMonth: (props: {
+    date: Date;
+    locale: Locale;
+    handleDayClick?: HandleSelectDate | undefined;
+    value?: Date | DateRange | undefined;
+    events?: Date[] | undefined;
+    minDate?: Date | undefined;
+    maxDate?: Date | undefined;
+}) => {
+    disabled?: boolean;
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
+    label: string;
+    selected?: boolean;
+    range?: DateTimeCellPropRange;
+    event?: boolean;
+    current?: boolean;
+}[];

package/__internal__/cjs-src/components/DateTimeCanary/helpers/getDaysOfMonth.js

@@ -0,0 +1,52 @@
+"use strict";
+exports.__esModule = true;
+exports.getDaysOfMonth = void 0;
+var date_fns_1 = require("date-fns");
+var array_1 = require("../../../utils/array");
+var date_1 = require("../../../utils/date");
+var isDateInRange_1 = require("./isDateInRange");
+var isEqualDay_1 = require("./isEqualDay");
+var isSelected = function (_a) {
+    var date = _a.date, value = _a.value;
+    if (!value) {
+        return false;
+    }
+    if (Array.isArray(value)) {
+        return !!value.find(function (item) { return (item ? isEqualDay_1.isEqualDay(date, item) : false); });
+    }
+    return isEqualDay_1.isEqualDay(date, value);
+};
+var hasEvent = function (date, events) {
+    return !!events.find(function (eventDate) { return isEqualDay_1.isEqualDay(eventDate, date); });
+};
+var isToday = function (date) { return isEqualDay_1.isEqualDay(new Date(), date); };
+exports.getDaysOfMonth = function (props) {
+    var date = props.date, locale = props.locale, handleDayClick = props.handleDayClick, value = props.value, events = props.events, minDate = props.minDate, maxDate = props.maxDate;
+    var currentMonth = date.getMonth();
+    var startDate = date_fns_1.startOfWeek(date_fns_1.startOfMonth(date), { locale: locale });
+    var endDate = date_fns_1.endOfWeek(date_fns_1.addWeeks(startDate, 5), { locale: locale });
+    var diffDays = date_fns_1.differenceInDays(endDate, startDate) + 1;
+    return array_1.range(diffDays).map(function (index) {
+        var date = date_fns_1.addDays(startDate, index);
+        var label = date_fns_1.format(date, 'd');
+        var disabled = !date_1.isInMinMaxDade(date, minDate, maxDate, date_fns_1.startOfDay, date_fns_1.endOfDay);
+        var onClick = !disabled && handleDayClick
+            ? function (e) { return handleDayClick({ e: e, value: date }); }
+            : undefined;
+        if (date.getMonth() === currentMonth) {
+            return {
+                label: label,
+                onClick: onClick,
+                selected: isSelected({ date: date, value: value }),
+                range: Array.isArray(value) && isDateInRange_1.isDateInRange(date, value, date_fns_1.startOfDay),
+                event: events && hasEvent(date, events),
+                current: isToday(date),
+                disabled: disabled
+            };
+        }
+        return {
+            label: label,
+            disabled: true
+        };
+    });
+};

package/__internal__/cjs-src/components/DateTimeCanary/helpers/getHandleSelectDate.d.ts

@@ -0,0 +1,11 @@
+import { DateTimePropOnChange, DateTimePropOnChangeRange, DateTimePropValue, HandleSelectDate, СapableRangeType } from './types';
+declare type GetHandleSelectDateProps = {
+    isEqualUnit: (date1: Date, date2: Date) => boolean;
+    value?: DateTimePropValue<СapableRangeType>;
+    onChange?: DateTimePropOnChange;
+    onChangeRange?: DateTimePropOnChangeRange<СapableRangeType>;
+    minDate?: Date;
+    maxDate?: Date;
+};
+export declare function getHandleSelectDate(props: GetHandleSelectDateProps): HandleSelectDate;
+export {};

package/__internal__/cjs-src/components/DateTimeCanary/helpers/getHandleSelectDate.js

@@ -0,0 +1,48 @@
+"use strict";
+exports.__esModule = true;
+exports.getHandleSelectDate = void 0;
+var tslib_1 = require("tslib");
+var type_guards_1 = require("../../../utils/type-guards");
+function getHandleSelectDate(props) {
+    return function (callbackProps) {
+        if (typeof props.onChange === 'function') {
+            props.onChange(callbackProps);
+        }
+        if (typeof props.onChangeRange === 'function') {
+            var currentValue = (Array.isArray(props.value)
+                ? props.value
+                : [props.value, undefined]) || [undefined, undefined];
+            var _a = tslib_1.__read(currentValue, 2), startDate = _a[0], endDate = _a[1];
+            if (type_guards_1.isDefined(startDate) && props.isEqualUnit(startDate, callbackProps.value)) {
+                return props.onChangeRange({
+                    e: callbackProps.e,
+                    value: [endDate, undefined]
+                });
+            }
+            if (type_guards_1.isDefined(endDate) && props.isEqualUnit(endDate, callbackProps.value)) {
+                return props.onChangeRange({
+                    e: callbackProps.e,
+                    value: [startDate, undefined]
+                });
+            }
+            if (type_guards_1.isDefined(startDate)) {
+                return props.onChangeRange({
+                    e: callbackProps.e,
+                    value: startDate > callbackProps.value
+                        ? [callbackProps.value, startDate]
+                        : [startDate, callbackProps.value]
+                });
+            }
+            if (type_guards_1.isDefined(endDate)) {
+                return props.onChangeRange({
+                    e: callbackProps.e,
+                    value: endDate > callbackProps.value
+                        ? [callbackProps.value, endDate]
+                        : [endDate, callbackProps.value]
+                });
+            }
+            props.onChangeRange({ e: callbackProps.e, value: [callbackProps.value, undefined] });
+        }
+    };
+}
+exports.getHandleSelectDate = getHandleSelectDate;

package/__internal__/cjs-src/components/DateTimeCanary/helpers/getMonthsOfYear.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { Locale } from 'date-fns';
+import { range } from '../../../utils/array';
+import { DateRange } from '../../../utils/types/Date';
+import { DateTimeCellPropRange } from '../DateTimeCell/DateTimeCell';
+import { HandleSelectDate } from './types';
+export declare const getMonthsOfYear: (props: {
+    date: Date;
+    locale: Locale;
+    onChange?: HandleSelectDate | undefined;
+    value?: Date | DateRange | undefined;
+    events?: Date[] | undefined;
+    minDate?: Date | undefined;
+    maxDate?: Date | undefined;
+}) => {
+    disabled?: boolean;
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
+    label: string;
+    selected?: boolean;
+    range?: DateTimeCellPropRange;
+    event?: boolean;
+    current?: boolean;
+}[];

package/__internal__/cjs-src/components/DateTimeCanary/helpers/getMonthsOfYear.js

@@ -0,0 +1,51 @@
+"use strict";
+exports.__esModule = true;
+exports.getMonthsOfYear = void 0;
+var date_fns_1 = require("date-fns");
+var array_1 = require("../../../utils/array");
+var date_1 = require("../../../utils/date");
+var index_1 = require("./index");
+var isDateInRange_1 = require("./isDateInRange");
+var isEqualMount_1 = require("./isEqualMount");
+var isSelected = function (_a) {
+    var date = _a.date, value = _a.value;
+    if (!value) {
+        return false;
+    }
+    if (Array.isArray(value)) {
+        return !!value.find(function (item) { return (item ? isEqualMount_1.isEqualMount(date, item) : false); });
+    }
+    return isEqualMount_1.isEqualMount(date, value);
+};
+var hasEvent = function (date, events) {
+    return !!events.find(function (eventDate) { return isEqualMount_1.isEqualMount(eventDate, date); });
+};
+var isCurrent = function (date) { return isEqualMount_1.isEqualMount(new Date(), date); };
+exports.getMonthsOfYear = function (props) {
+    var date = props.date, onChange = props.onChange, value = props.value, events = props.events, minDate = props.minDate, maxDate = props.maxDate, locale = props.locale;
+    var currentYear = date_fns_1.getYear(date);
+    var startDate = date_fns_1.startOfYear(date);
+    return array_1.range(12).map(function (index) {
+        var date = date_fns_1.addMonths(startDate, index);
+        var label = index_1.getMonthTitleAbbreviated(date, locale);
+        var disabled = !date_1.isInMinMaxDade(date, minDate, maxDate, date_fns_1.startOfMonth, date_fns_1.endOfMonth);
+        var onClick = !disabled && onChange
+            ? function (e) { return onChange({ e: e, value: date }); }
+            : undefined;
+        if (date_fns_1.getYear(date) === currentYear) {
+            return {
+                label: label,
+                onClick: onClick,
+                selected: isSelected({ date: date, value: value }),
+                range: Array.isArray(value) && isDateInRange_1.isDateInRange(date, value, date_fns_1.startOfMonth),
+                event: events && hasEvent(date, events),
+                current: isCurrent(date),
+                disabled: disabled
+            };
+        }
+        return {
+            label: label,
+            disabled: true
+        };
+    });
+};

package/__internal__/cjs-src/components/DateTimeCanary/helpers/getSliderValueRange.d.ts

@@ -0,0 +1,4 @@
+import { DateRange } from '../../../utils/types/Date';
+declare type StartEndOfPeriod = (date: Date) => Date;
+export declare const getSliderValueRange: (decadeDate: Date, value: Date | DateRange | undefined, startOfPeriod: StartEndOfPeriod, endOfPeriod: StartEndOfPeriod) => number[] | undefined;
+export {};

package/__internal__/cjs-src/components/DateTimeCanary/helpers/getSliderValueRange.js

@@ -0,0 +1,26 @@
+"use strict";
+exports.__esModule = true;
+exports.getSliderValueRange = void 0;
+var inProcent = function (number, msInPeriod) { return (number / msInPeriod) * 100; };
+exports.getSliderValueRange = function (decadeDate, value, startOfPeriod, endOfPeriod) {
+    if (!Array.isArray(value) || !value[0] || !value[1]) {
+        return undefined;
+    }
+    var periodStartDateTime = startOfPeriod(decadeDate).getTime();
+    var periodEndDateTime = endOfPeriod(decadeDate).getTime();
+    var valueStartDateTime = value[0].getTime();
+    var valueEndDateTime = value[1].getTime();
+    if (valueStartDateTime > periodEndDateTime || valueEndDateTime < periodStartDateTime) {
+        return undefined;
+    }
+    if (valueStartDateTime <= periodStartDateTime && valueEndDateTime >= periodEndDateTime) {
+        return [0, 100];
+    }
+    var msInPeriod = periodEndDateTime - periodStartDateTime;
+    var offset = Math.floor(inProcent(valueStartDateTime <= periodStartDateTime ? 0 : valueStartDateTime - periodStartDateTime, msInPeriod));
+    var width = Math.ceil(valueEndDateTime >= periodEndDateTime
+        ? 100 - offset
+        : inProcent(valueEndDateTime -
+            (valueStartDateTime <= periodStartDateTime ? periodStartDateTime : valueStartDateTime), msInPeriod));
+    return [offset, width];
+};

package/__internal__/cjs-src/components/DateTimeCanary/helpers/getYearsOfDecade.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { Locale } from 'date-fns';
+import { range } from '../../../utils/array';
+import { DateRange } from '../../../utils/types/Date';
+import { DateTimeCellPropRange } from '../DateTimeCell/DateTimeCell';
+import { HandleSelectDate } from './types';
+export declare const getYearsOfDecade: (props: {
+    date: Date;
+    locale: Locale;
+    onChange?: HandleSelectDate | undefined;
+    value?: Date | DateRange | undefined;
+    events?: Date[] | undefined;
+    minDate?: Date | undefined;
+    maxDate?: Date | undefined;
+}) => {
+    disabled?: boolean;
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
+    label: string;
+    selected?: boolean;
+    range?: DateTimeCellPropRange;
+    event?: boolean;
+    current?: boolean;
+}[];

package/__internal__/cjs-src/components/DateTimeCanary/helpers/getYearsOfDecade.js

@@ -0,0 +1,50 @@
+"use strict";
+exports.__esModule = true;
+exports.getYearsOfDecade = void 0;
+var date_fns_1 = require("date-fns");
+var array_1 = require("../../../utils/array");
+var date_1 = require("../../../utils/date");
+var isDateInRange_1 = require("./isDateInRange");
+var isEqualYear_1 = require("./isEqualYear");
+var isSelected = function (_a) {
+    var date = _a.date, value = _a.value;
+    if (!value) {
+        return false;
+    }
+    if (Array.isArray(value)) {
+        return !!value.find(function (item) { return (item ? isEqualYear_1.isEqualYear(date, item) : false); });
+    }
+    return isEqualYear_1.isEqualYear(date, value);
+};
+var hasEvent = function (date, events) {
+    return !!events.find(function (eventDate) { return isEqualYear_1.isEqualYear(eventDate, date); });
+};
+var isCurrent = function (date) { return isEqualYear_1.isEqualYear(new Date(), date); };
+exports.getYearsOfDecade = function (props) {
+    var date = props.date, onChange = props.onChange, value = props.value, events = props.events, minDate = props.minDate, maxDate = props.maxDate;
+    var currentDecade = date_fns_1.getDecade(date);
+    var startDate = date_fns_1.addYears(date_fns_1.startOfDecade(date), -1);
+    return array_1.range(12).map(function (index) {
+        var date = date_fns_1.addYears(startDate, index);
+        var label = date_fns_1.format(date, 'yyyy');
+        var disabled = !date_1.isInMinMaxDade(date, minDate, maxDate, date_fns_1.startOfYear, date_fns_1.endOfYear);
+        var onClick = !disabled && onChange
+            ? function (e) { return onChange({ e: e, value: date }); }
+            : undefined;
+        if (date_fns_1.getDecade(date) === currentDecade) {
+            return {
+                label: label,
+                onClick: onClick,
+                selected: isSelected({ date: date, value: value }),
+                range: Array.isArray(value) && isDateInRange_1.isDateInRange(date, value, date_fns_1.startOfYear),
+                event: events && hasEvent(date, events),
+                current: isCurrent(date),
+                disabled: disabled
+            };
+        }
+        return {
+            label: label,
+            disabled: true
+        };
+    });
+};

package/__internal__/cjs-src/components/DateTimeCanary/helpers/index.d.ts

@@ -0,0 +1,35 @@
+import { Locale } from 'date-fns';
+import { DateRange } from '../../../utils/types/Date';
+export declare const dateComparer: (a?: Date | undefined, b?: Date | undefined) => number;
+export declare const getStartAndEndDate: (date1: Date, date2: Date) => Date[];
+export declare const isDateSelected: ({ date, value }: {
+    date: Date;
+    value?: Date | undefined;
+}) => boolean;
+export declare const isValueSelected: ({ date, value, }: {
+    date: Date;
+    value?: Date | DateRange | undefined;
+}) => boolean;
+export declare const isValueSelectedBackwards: ({ value, hoveredDate, }: {
+    value?: Date | DateRange | undefined;
+    hoveredDate?: Date | undefined;
+}) => boolean | undefined;
+export declare const getMonthTitle: (date: Date, locale: Locale) => string;
+export declare const getMonthTitleAbbreviated: (date: Date, locale: Locale) => string;
+export declare const getYearTitle: (date: Date) => string;
+export declare const getMouthLabelWithYear: (date: Date, locale: Locale) => string;
+export declare const getDecadeTitle: (date: Date) => string;
+export declare const getLabelHours: (date: Date) => string;
+export declare const getLabelMinutes: (date: Date) => string;
+export declare const getLabelSeconds: (date: Date) => string;
+export declare const getDaysOfWeek: (locale: Locale) => string[];
+export declare const getTimeTitle: (value: Date | undefined, multiplicityHours: number | undefined, multiplicityMinutes: number | undefined, multiplicitySeconds: number | undefined) => string;
+export * from './useCurrentVisibleDate';
+export * from './types';
+export * from './getDaysOfMonth';
+export * from './getYearsOfDecade';
+export * from './getHandleSelectDate';
+export * from './isEqualDay';
+export * from './isEqualYear';
+export * from './isEqualMount';
+export * from './getMonthsOfYear';