@steroidsjs/core 3.0.0-beta.11 → 3.0.0-beta.110

package/ui/content/CalendarSystem/enums/CalendarType.js

@@ -0,0 +1,38 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var Enum_1 = __importDefault(require("../../../../base/Enum"));
+var CalendarType = /** @class */ (function (_super) {
+    __extends(CalendarType, _super);
+    function CalendarType() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    CalendarType.getLabels = function () {
+        var _a;
+        return _a = {},
+            _a[this.WEEK] = __('Неделя'),
+            _a[this.MONTH] = __('Месяц'),
+            _a;
+    };
+    CalendarType.WEEK = 'Week';
+    CalendarType.MONTH = 'Month';
+    return CalendarType;
+}(Enum_1["default"]));
+exports["default"] = CalendarType;

package/ui/content/CalendarSystem/enums/DateControlType.d.ts

@@ -0,0 +1,10 @@
+import Enum from '../../../../base/Enum';
+export default class DateControlType extends Enum {
+    static PREV_DOUBLE: string;
+    static PREV_ONE: string;
+    static NEXT_ONE: string;
+    static NEXT_DOUBLE: string;
+    static getIcons(): {
+        [x: string]: string;
+    };
+}

package/ui/content/CalendarSystem/enums/DateControlType.js

@@ -0,0 +1,42 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var Enum_1 = __importDefault(require("../../../../base/Enum"));
+var DateControlType = /** @class */ (function (_super) {
+    __extends(DateControlType, _super);
+    function DateControlType() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    DateControlType.getIcons = function () {
+        var _a;
+        return _a = {},
+            _a[this.PREV_DOUBLE] = 'double_arrow_left',
+            _a[this.PREV_ONE] = 'arrow_left_24x24',
+            _a[this.NEXT_ONE] = 'arrow_right_24x24',
+            _a[this.NEXT_DOUBLE] = 'double_arrow_right',
+            _a;
+    };
+    DateControlType.PREV_DOUBLE = 'PREV_DOUBLE';
+    DateControlType.PREV_ONE = 'PREV_ONE';
+    DateControlType.NEXT_ONE = 'NEXT_ONE';
+    DateControlType.NEXT_DOUBLE = 'NEXT_DOUBLE';
+    return DateControlType;
+}(Enum_1["default"]));
+exports["default"] = DateControlType;

package/ui/content/CalendarSystem/helpers/addEventIfMatchDate.d.ts

@@ -0,0 +1,3 @@
+import dayjs from 'dayjs';
+import { IEventGroup, IEvent } from '../CalendarSystem';
+export declare const addEventIfMatchDate: (eventDateDayJs: dayjs.Dayjs, sourceDateInDayJs: dayjs.Dayjs, calendarGroup: IEventGroup, originalEvent: IEvent, unit: 'hours' | 'day', selectedEventGroupsIds: number[], resultEventsOnDate: IEvent[]) => void;

package/ui/content/CalendarSystem/helpers/addEventIfMatchDate.js

@@ -0,0 +1,21 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+exports.__esModule = true;
+exports.addEventIfMatchDate = void 0;
+var addEventIfMatchDate = function (eventDateDayJs, sourceDateInDayJs, calendarGroup, originalEvent, unit, selectedEventGroupsIds, resultEventsOnDate) {
+    var _a;
+    if (eventDateDayJs.isSame(sourceDateInDayJs, unit) && selectedEventGroupsIds.includes(calendarGroup.id)) {
+        resultEventsOnDate.push(__assign(__assign({}, originalEvent), { color: (_a = originalEvent.color) !== null && _a !== void 0 ? _a : calendarGroup.color }));
+    }
+};
+exports.addEventIfMatchDate = addEventIfMatchDate;

package/ui/content/CalendarSystem/hooks/useCalendarControls.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import CalendarEnum from '../enums/CalendarType';
+import DateControlEnum from '../enums/DateControlType';
+export declare const getSourceCalendarControl: (control: string) => HTMLElement;
+declare const useCalendarControls: (calendarType: CalendarEnum, weekControls: {
+    [key: string]: () => void | DateControlEnum;
+}) => (event: React.MouseEvent<HTMLElement>) => void;
+export default useCalendarControls;

package/ui/content/CalendarSystem/hooks/useCalendarControls.js

@@ -0,0 +1,47 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+exports.getSourceCalendarControl = void 0;
+/* eslint-disable no-unneeded-ternary */
+/* eslint-disable default-case */
+/* eslint-disable no-unused-expressions */
+var react_1 = __importDefault(require("react"));
+var isFunction_1 = __importDefault(require("lodash-es/isFunction"));
+var get_1 = __importDefault(require("lodash-es/get"));
+var CalendarType_1 = __importDefault(require("../enums/CalendarType"));
+var CUSTOM_CONTROL_PATH = 'dataset.control';
+var getSourceCalendarControl = function (control) { return document.querySelector("[data-sourcecontrol=\"".concat(control, "\"]")); };
+exports.getSourceCalendarControl = getSourceCalendarControl;
+var useCalendarControls = function (calendarType, weekControls) {
+    var getCustomControlType = function (event) {
+        var target = event.target;
+        var customControlType = (0, get_1["default"])(target, CUSTOM_CONTROL_PATH);
+        return customControlType ? customControlType : null;
+    };
+    var applyControl = react_1["default"].useCallback(function (event) {
+        var customControlType = getCustomControlType(event);
+        var sourceCalendarControl = (0, exports.getSourceCalendarControl)(customControlType);
+        if (!sourceCalendarControl) {
+            return;
+        }
+        switch (calendarType) {
+            case CalendarType_1["default"].MONTH: {
+                sourceCalendarControl.click();
+                return;
+            }
+            case CalendarType_1["default"].WEEK: {
+                if ((0, isFunction_1["default"])(weekControls[customControlType])) {
+                    weekControls[customControlType]();
+                }
+                else {
+                    var sourceControlType = weekControls[customControlType];
+                    (0, exports.getSourceCalendarControl)(sourceControlType).click();
+                }
+            }
+        }
+    }, [calendarType, weekControls]);
+    return applyControl;
+};
+exports["default"] = useCalendarControls;

package/ui/content/CalendarSystem/hooks/useCalendarSystemEventGroupModals.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { IEventGroup } from '../CalendarSystem';
+import { IModalProps } from '../../../modal/Modal/Modal';
+export declare const useCalendarSystemEventGroupModals: (innerEventGroups: IEventGroup[], setInnerEventGroups: React.Dispatch<React.SetStateAction<IEventGroup[]>>, eventGroupModalProps: IModalProps) => {
+    openCreateEventGroupModal: () => void;
+};

package/ui/content/CalendarSystem/hooks/useCalendarSystemEventGroupModals.js

@@ -0,0 +1,54 @@
+"use strict";
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+exports.useCalendarSystemEventGroupModals = void 0;
+var react_redux_1 = require("react-redux");
+var maxBy_1 = __importDefault(require("lodash-es/maxBy"));
+var react_1 = __importDefault(require("react"));
+var hooks_1 = require("../../../../hooks");
+var modal_1 = require("../../../../actions/modal");
+var useComponents_1 = __importDefault(require("../../../../hooks/useComponents"));
+var DEFAULT_ID = 1;
+var PRIMARY_LIGHT = '#651fff';
+var PRIMARY_DARK = '#9362ff';
+var useCalendarSystemEventGroupModals = function (innerEventGroups, setInnerEventGroups, eventGroupModalProps) {
+    var dispatch = (0, react_redux_1.useDispatch)();
+    var components = (0, useComponents_1["default"])();
+    var theme = (0, hooks_1.useTheme)().theme;
+    var calendarModalView = (eventGroupModalProps === null || eventGroupModalProps === void 0 ? void 0 : eventGroupModalProps.component) || components.ui.getView('content.CalendarSystemEventGroupModalView');
+    var defaultEventGroupColor = react_1["default"].useMemo(function () { return theme === 'light' ? PRIMARY_LIGHT : PRIMARY_DARK; }, [theme]);
+    var onEventGroupSubmit = react_1["default"].useCallback(function (fields) {
+        var _a;
+        var newEventGroup = {
+            id: (((_a = (0, maxBy_1["default"])(innerEventGroups, function (eventsGroup) { return eventsGroup.id; })) === null || _a === void 0 ? void 0 : _a.id) || DEFAULT_ID) + 1,
+            label: fields.label,
+            color: fields.color,
+            events: []
+        };
+        setInnerEventGroups(function (prev) { return __spreadArray(__spreadArray([], prev, true), [newEventGroup], false); });
+    }, [innerEventGroups, setInnerEventGroups]);
+    var openCreateEventGroupModal = react_1["default"].useCallback(function () {
+        dispatch((0, modal_1.openModal)(calendarModalView, {
+            isCreate: true,
+            onEventGroupSubmit: onEventGroupSubmit,
+            eventGroupInitialValues: {
+                color: defaultEventGroupColor
+            }
+        }));
+    }, [calendarModalView, defaultEventGroupColor, dispatch, onEventGroupSubmit]);
+    return {
+        openCreateEventGroupModal: openCreateEventGroupModal
+    };
+};
+exports.useCalendarSystemEventGroupModals = useCalendarSystemEventGroupModals;

package/ui/content/CalendarSystem/hooks/useCalendarSystemModals.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { IModalProps } from '../../../modal/Modal/Modal';
+import { ICalendarSystemModalViewProps, IDay, IEvent, IEventGroup } from '../CalendarSystem';
+declare const useCalendarSystemModals: (calendarModalProps: IModalProps, innerEventGroups: IEventGroup[], setInnerEventGroups: React.Dispatch<React.SetStateAction<IEventGroup[]>>) => {
+    openCreateModal: (eventInitialDay?: IDay) => void;
+    openEditModal: (event: IEvent) => void;
+    getEventFromGroup: (event: IEvent) => IEventGroup;
+    getModalProps: (isCreate: boolean, eventInitialValues?: Partial<IEvent & {
+        eventGroupId: number;
+    }>) => ICalendarSystemModalViewProps;
+};
+export default useCalendarSystemModals;

package/ui/content/CalendarSystem/hooks/useCalendarSystemModals.js

@@ -0,0 +1,88 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var react_1 = __importDefault(require("react"));
+var react_redux_1 = require("react-redux");
+var isEqual_1 = __importDefault(require("lodash-es/isEqual"));
+var maxBy_1 = __importDefault(require("lodash-es/maxBy"));
+var modal_1 = require("../../../../actions/modal");
+var useComponents_1 = __importDefault(require("../../../../hooks/useComponents"));
+var utils_1 = require("../utils/utils");
+var DEFAULT_ID = 0;
+var useCalendarSystemModals = function (calendarModalProps, innerEventGroups, setInnerEventGroups) {
+    var dispatch = (0, react_redux_1.useDispatch)();
+    var components = (0, useComponents_1["default"])();
+    var calendarModalView = (calendarModalProps === null || calendarModalProps === void 0 ? void 0 : calendarModalProps.component) || components.ui.getView('content.CalendarSystemModalView');
+    var onEventSubmit = react_1["default"].useCallback(function (fields, eventInitialValues) {
+        var _a;
+        var eventGroupId = fields.eventGroupId, date = fields.date, title = fields.title, description = fields.description;
+        var currentEventGroups = __spreadArray([], innerEventGroups, true);
+        if (eventInitialValues) {
+            // Удаляем событие из предыдущей группы
+            var previousGroupIndex = currentEventGroups.findIndex(function (group) { return group.id === Number(eventInitialValues.eventGroupId); });
+            var previousGroup = __assign({}, currentEventGroups[previousGroupIndex]);
+            previousGroup.events = previousGroup.events.filter(function (event) { return event.id !== eventInitialValues.id; });
+            currentEventGroups = __spreadArray(__spreadArray(__spreadArray([], currentEventGroups.slice(0, previousGroupIndex), true), [
+                previousGroup
+            ], false), currentEventGroups.slice(previousGroupIndex + 1), true);
+        }
+        var changeableEventGroupIndex = currentEventGroups.findIndex(function (group) { return group.id === eventGroupId; });
+        var changeableEventGroup = __assign({}, currentEventGroups[changeableEventGroupIndex]);
+        var updatedEvent = {
+            id: (((_a = (0, maxBy_1["default"])(changeableEventGroup.events, function (event) { return event.id; })) === null || _a === void 0 ? void 0 : _a.id) || DEFAULT_ID) + 1,
+            date: new Date(date),
+            title: title,
+            description: description
+        };
+        changeableEventGroup.events.push(updatedEvent);
+        changeableEventGroup.events = (0, utils_1.sortEventsInGroup)(changeableEventGroup);
+        currentEventGroups = __spreadArray(__spreadArray(__spreadArray([], currentEventGroups.slice(0, changeableEventGroupIndex), true), [
+            changeableEventGroup
+        ], false), currentEventGroups.slice(changeableEventGroupIndex + 1), true);
+        setInnerEventGroups(currentEventGroups);
+    }, [innerEventGroups, setInnerEventGroups]);
+    var getModalProps = react_1["default"].useCallback(function (isCreate, eventInitialValues) { return (__assign(__assign({}, calendarModalProps), { component: calendarModalView, eventGroups: innerEventGroups, onEventSubmit: onEventSubmit, isCreate: isCreate, eventInitialValues: eventInitialValues })); }, [calendarModalProps, calendarModalView, innerEventGroups, onEventSubmit]);
+    var getEventFromGroup = react_1["default"].useCallback(function (event) { return innerEventGroups
+        .find(function (group) { return group.events
+        .some(function (groupEvent) { return (0, isEqual_1["default"])((0, utils_1.getOmittedEvent)(groupEvent), (0, utils_1.getOmittedEvent)(event)); }); }); }, [innerEventGroups]);
+    var openCreateModal = react_1["default"].useCallback(function (eventInitialDay) {
+        if (eventInitialDay === void 0) { eventInitialDay = null; }
+        var modalProps = eventInitialDay
+            ? getModalProps(true, { date: eventInitialDay.date }) : getModalProps(true);
+        dispatch((0, modal_1.openModal)(calendarModalView, modalProps));
+    }, [calendarModalView, dispatch, getModalProps]);
+    var openEditModal = react_1["default"].useCallback(function (event) {
+        var _a;
+        var eventGroupId = ((_a = getEventFromGroup(event)) === null || _a === void 0 ? void 0 : _a.id) || 0;
+        dispatch((0, modal_1.openModal)(calendarModalView, getModalProps(false, __assign(__assign({}, event), { eventGroupId: eventGroupId }))));
+    }, [getModalProps, calendarModalView, dispatch, getEventFromGroup]);
+    return {
+        openCreateModal: openCreateModal,
+        openEditModal: openEditModal,
+        getEventFromGroup: getEventFromGroup,
+        getModalProps: getModalProps
+    };
+};
+exports["default"] = useCalendarSystemModals;

package/ui/content/CalendarSystem/hooks/useDisplayDate.d.ts

@@ -0,0 +1,6 @@
+export declare const MONTH_CONVERT_FORMAT = "MMMM YYYY";
+declare const useDisplayDate: () => {
+    dateToDisplay: any;
+    setNewDateToDisplay: (newDate: Date) => void;
+};
+export default useDisplayDate;

package/ui/content/CalendarSystem/hooks/useDisplayDate.js

@@ -0,0 +1,27 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+exports.MONTH_CONVERT_FORMAT = void 0;
+var react_1 = __importDefault(require("react"));
+var upperFirst_1 = __importDefault(require("lodash-es/upperFirst"));
+var calendar_1 = require("../../../../utils/calendar");
+exports.MONTH_CONVERT_FORMAT = 'MMMM YYYY';
+var getFirstDayOfCurrentMonth = function () {
+    var currentDate = new Date();
+    var firstDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
+    return firstDayOfMonth;
+};
+var convertDateToRequiredFormat = function (date) { return (0, calendar_1.convertDate)(date, null, exports.MONTH_CONVERT_FORMAT); };
+var useDisplayDate = function () {
+    var _a = react_1["default"].useState((0, upperFirst_1["default"])(convertDateToRequiredFormat(getFirstDayOfCurrentMonth()))), dateToDisplay = _a[0], setDateToDisplay = _a[1];
+    var setNewDateToDisplay = function (newDate) {
+        setDateToDisplay(convertDateToRequiredFormat(newDate));
+    };
+    return {
+        dateToDisplay: dateToDisplay,
+        setNewDateToDisplay: setNewDateToDisplay
+    };
+};
+exports["default"] = useDisplayDate;

package/ui/content/CalendarSystem/hooks/useExpandClickAway.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare const useExpandClickAway: () => {
+    isExpanded: boolean;
+    setIsExpanded: React.Dispatch<React.SetStateAction<boolean>>;
+    triggerRef: React.MutableRefObject<any>;
+};
+export default useExpandClickAway;

package/ui/content/CalendarSystem/hooks/useExpandClickAway.js

@@ -0,0 +1,23 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var react_1 = __importDefault(require("react"));
+var react_use_1 = require("react-use");
+var useExpandClickAway = function () {
+    var _a = react_1["default"].useState(false), isExpanded = _a[0], setIsExpanded = _a[1];
+    var triggerRef = react_1["default"].useRef(null);
+    (0, react_use_1.useClickAway)(triggerRef, function () {
+        if (!isExpanded) {
+            return;
+        }
+        setIsExpanded(false);
+    });
+    return {
+        isExpanded: isExpanded,
+        setIsExpanded: setIsExpanded,
+        triggerRef: triggerRef
+    };
+};
+exports["default"] = useExpandClickAway;

package/ui/content/CalendarSystem/hooks/useMonthCalendar.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { IDay } from '../CalendarSystem';
+declare const useMonthCalendar: () => {
+    getCalendarArray: () => IDay[];
+    getCurrentMonthDataUTC: () => {
+        currentMonth: number;
+        lastDayOfCurrentMonth: number;
+        firstDayOfCurrentMonth: Date;
+        daysInCurrentMonth: any[];
+    };
+    getWeekFromDate: (date: Date) => IDay[];
+    calendarArray: IDay[];
+    setCurrentMonthDate: React.Dispatch<React.SetStateAction<Date>>;
+    currentMonthDate: Date;
+};
+export default useMonthCalendar;

package/ui/content/CalendarSystem/hooks/useMonthCalendar.js

@@ -0,0 +1,87 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+/* eslint-disable no-plusplus */
+/* eslint-disable import/order */
+var react_1 = __importDefault(require("react"));
+var utils_1 = require("../utils/utils");
+var FIRST_DAY = 1;
+var ONE_MONTH = 1;
+var TOTAL_DAYS_IN_CALENDAR = 42;
+var useMonthCalendar = function () {
+    var _a = react_1["default"].useState(null), currentMonthDate = _a[0], setCurrentMonthDate = _a[1];
+    var getCurrentMonthDataUTC = react_1["default"].useCallback(function () {
+        var currentYear = (currentMonthDate === null || currentMonthDate === void 0 ? void 0 : currentMonthDate.getFullYear()) || new Date().getFullYear();
+        var month = (currentMonthDate === null || currentMonthDate === void 0 ? void 0 : currentMonthDate.getMonth()) || new Date().getMonth();
+        var nextMonthFirstDay = new Date(currentYear, month + ONE_MONTH, FIRST_DAY);
+        var lastDayOfCurrentMonth = new Date(nextMonthFirstDay.getTime() - FIRST_DAY).getDate();
+        var firstDayOfCurrentMonth = new Date(Date.UTC(currentYear, month, FIRST_DAY));
+        if (currentMonthDate === null) {
+            setCurrentMonthDate(firstDayOfCurrentMonth);
+        }
+        var daysInCurrentMonth = [];
+        // Пройдемся по всем дням месяца и добавим их в массив
+        for (var dayNumber = 1; dayNumber <= lastDayOfCurrentMonth; dayNumber++) {
+            var date = new Date(Date.UTC(currentYear, month, dayNumber));
+            daysInCurrentMonth.push({ date: date, dayNumber: dayNumber });
+        }
+        return {
+            currentMonth: month,
+            lastDayOfCurrentMonth: lastDayOfCurrentMonth,
+            firstDayOfCurrentMonth: firstDayOfCurrentMonth,
+            daysInCurrentMonth: daysInCurrentMonth
+        };
+    }, [currentMonthDate]);
+    var getCalendarArray = react_1["default"].useCallback(function () {
+        var calendarArray = [];
+        var _a = getCurrentMonthDataUTC(), firstDayOfCurrentMonth = _a.firstDayOfCurrentMonth, month = _a.currentMonth, daysInCurrentMonth = _a.daysInCurrentMonth;
+        var firstWeekInMonth = (0, utils_1.getWeekDaysFromDate)(firstDayOfCurrentMonth);
+        firstWeekInMonth.forEach(function (day) { return calendarArray.push({
+            date: day.date,
+            dayNumber: day.dayNumber,
+            outOfRange: day.date.getMonth() < month
+        }); });
+        daysInCurrentMonth.forEach(function (day) {
+            var existingDay = calendarArray.find(function (item) { return item.date.getTime() === day.date.getTime(); });
+            if (!existingDay) {
+                calendarArray.push({
+                    date: day.date,
+                    dayNumber: day.dayNumber,
+                    outOfRange: false
+                });
+            }
+        });
+        var daysAfterCurrentMonth = TOTAL_DAYS_IN_CALENDAR - calendarArray.length;
+        for (var i = 1; i <= daysAfterCurrentMonth; i++) {
+            var currentDate = new Date(currentMonthDate === null || currentMonthDate === void 0 ? void 0 : currentMonthDate.getFullYear(), month + 1, i);
+            calendarArray.push({
+                date: currentDate,
+                dayNumber: currentDate.getDate(),
+                outOfRange: currentDate.getMonth() > month
+            });
+        }
+        return calendarArray.map(function (day) { return (0, utils_1.isDateIsToday)(day.date) ? (__assign(__assign({}, day), { isToday: true })) : day; });
+    }, [currentMonthDate, getCurrentMonthDataUTC]);
+    return {
+        getCalendarArray: getCalendarArray,
+        getCurrentMonthDataUTC: getCurrentMonthDataUTC,
+        getWeekFromDate: utils_1.getWeekDaysFromDate,
+        calendarArray: getCalendarArray(),
+        setCurrentMonthDate: setCurrentMonthDate,
+        currentMonthDate: currentMonthDate
+    };
+};
+exports["default"] = useMonthCalendar;

package/ui/content/CalendarSystem/hooks/useWeekCalendar.d.ts

@@ -0,0 +1,15 @@
+import DateControlEnum from '../enums/DateControlType';
+declare const useWeekCalendar: (currentMonthDate: Date) => {
+    currentWeek: {
+        dayNumber: number;
+        date: Date;
+        outOfRange?: boolean;
+        isToday?: boolean;
+        formattedDisplay?: string;
+    }[];
+    weekControls: {
+        [key: string]: () => void | DateControlEnum;
+    };
+    forceUpdateWeekOnMonthChange: (newMonthDate: Date) => void;
+};
+export default useWeekCalendar;

package/ui/content/CalendarSystem/hooks/useWeekCalendar.js

@@ -0,0 +1,86 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var react_1 = __importDefault(require("react"));
+var calendar_1 = require("../../../../utils/calendar");
+var DateControlType_1 = __importDefault(require("../enums/DateControlType"));
+var useCalendarControls_1 = require("./useCalendarControls");
+var utils_1 = require("../utils/utils");
+var WEEK_DAY_FORMAT = 'dd, D MMM';
+var ONE_DAY = 1;
+var getFormattedWeekFromDate = function (fromDate) {
+    if (fromDate === void 0) { fromDate = null; }
+    var currentWeek = (0, utils_1.getWeekDaysFromDate)(fromDate || new Date());
+    return currentWeek.map(function (dayOfWeek) {
+        var copyOfDayWeek = __assign({}, dayOfWeek);
+        copyOfDayWeek.formattedDisplay = (0, calendar_1.convertDate)(dayOfWeek.date, null, WEEK_DAY_FORMAT);
+        // eslint-disable-next-line no-unused-expressions
+        (0, utils_1.isDateIsToday)(copyOfDayWeek.date) ? copyOfDayWeek.isToday = true : copyOfDayWeek.isToday = false;
+        return copyOfDayWeek;
+    });
+};
+var useWeekCalendar = function (currentMonthDate) {
+    var _a;
+    var _b = react_1["default"].useState(getFormattedWeekFromDate()), currentWeek = _b[0], setCurrentWeek = _b[1];
+    var forceUpdateWeekOnMonthChange = react_1["default"].useCallback(function (newMonthDate) {
+        setCurrentWeek(getFormattedWeekFromDate(newMonthDate));
+    }, []);
+    var changeMonthAfterWeekChanged = react_1["default"].useCallback(function (formattedWeek) {
+        var firstDayOfWeek = formattedWeek[0].date;
+        var currentMonthNumber = currentMonthDate.getMonth();
+        var isWeekOutOfMonth = formattedWeek.every(function (dayOfWeek) { return dayOfWeek.date.getMonth() !== currentMonthNumber; });
+        if (!isWeekOutOfMonth) {
+            return;
+        }
+        if (currentMonthNumber - firstDayOfWeek.getMonth() === 1) {
+            var lastDayOfWeekInNewMonth = formattedWeek[formattedWeek.length - 1].date;
+            var prevMonthControl = (0, useCalendarControls_1.getSourceCalendarControl)(DateControlType_1["default"].PREV_ONE);
+            prevMonthControl.click();
+            forceUpdateWeekOnMonthChange(lastDayOfWeekInNewMonth);
+        }
+        else {
+            var firstDayOfWeekInNewMonth = formattedWeek[0].date;
+            var nextMonthControl = (0, useCalendarControls_1.getSourceCalendarControl)(DateControlType_1["default"].NEXT_ONE);
+            nextMonthControl.click();
+            forceUpdateWeekOnMonthChange(firstDayOfWeekInNewMonth);
+        }
+    }, [currentMonthDate, forceUpdateWeekOnMonthChange]);
+    var setNextWeek = react_1["default"].useCallback(function () {
+        var lastDayOfWeek = currentWeek[currentWeek.length - 1].date;
+        lastDayOfWeek.setDate(lastDayOfWeek.getDate() + ONE_DAY);
+        var formattedNextWeek = getFormattedWeekFromDate(lastDayOfWeek);
+        setCurrentWeek(formattedNextWeek);
+        changeMonthAfterWeekChanged(formattedNextWeek);
+    }, [currentWeek, changeMonthAfterWeekChanged]);
+    var setPrevWeek = react_1["default"].useCallback(function () {
+        var firstDayOfWeek = currentWeek[0].date;
+        firstDayOfWeek.setDate(firstDayOfWeek.getDate() - ONE_DAY);
+        var formattedPrevWeek = getFormattedWeekFromDate(firstDayOfWeek);
+        setCurrentWeek(formattedPrevWeek);
+        changeMonthAfterWeekChanged(formattedPrevWeek);
+    }, [currentWeek, changeMonthAfterWeekChanged]);
+    return {
+        currentWeek: currentWeek,
+        weekControls: (_a = {},
+            _a[DateControlType_1["default"].NEXT_DOUBLE] = DateControlType_1["default"].NEXT_ONE,
+            _a[DateControlType_1["default"].NEXT_ONE] = setNextWeek,
+            _a[DateControlType_1["default"].PREV_ONE] = setPrevWeek,
+            _a[DateControlType_1["default"].PREV_DOUBLE] = DateControlType_1["default"].PREV_ONE,
+            _a),
+        forceUpdateWeekOnMonthChange: forceUpdateWeekOnMonthChange
+    };
+};
+exports["default"] = useWeekCalendar;

package/ui/content/CalendarSystem/index.d.ts

@@ -0,0 +1,2 @@
+import CalendarSystem from './CalendarSystem';
+export default CalendarSystem;

package/ui/{list/LayoutNames/demo/basic.js → content/CalendarSystem/index.js}

@@ -3,10 +3,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-var layout_1 = __importDefault(require("../../List/demo/layout"));
-/**
- * List with layout switcher
- * @order 1
- * @col 6
- */
-exports["default"] = layout_1["default"];
+var CalendarSystem_1 = __importDefault(require("./CalendarSystem"));
+exports["default"] = CalendarSystem_1["default"];

package/ui/content/CalendarSystem/utils/utils.d.ts

@@ -0,0 +1,5 @@
+import { IDay, IEvent, IEventGroup } from '../CalendarSystem';
+export declare const getWeekDaysFromDate: (date: Date) => IDay[];
+export declare const isDateIsToday: (date: Date) => boolean;
+export declare const getOmittedEvent: (event: IEvent | Omit<IEvent, 'color'>) => any;
+export declare const sortEventsInGroup: (group: IEventGroup) => Omit<IEvent, "color">[];