@steroidsjs/core 3.0.82 → 3.0.84

package/ui/form/DateRangeField/DateRangeField.js

@@ -10,34 +10,11 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-var react_1 = __importStar(require("react"));
+var react_1 = require("react");
 var kit_1 = require("@maskito/kit");
 var react_2 = require("@maskito/react");
 var useDateRange_1 = __importDefault(require("../../form/DateField/useDateRange"));
@@ -47,10 +24,22 @@ var fieldWrapper_1 = __importDefault(require("../../form/Field/fieldWrapper"));
 var enums_1 = require("../../../enums");
 var useOnDayClick_1 = __importDefault(require("./useOnDayClick"));
 function DateRangeField(props) {
-    var _a, _b;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     var components = (0, hooks_1.useComponents)();
-    var maskInputFromRef = (0, react_2.useMaskito)({ options: (_a = props.maskOptions) === null || _a === void 0 ? void 0 : _a.from });
-    var maskInputToRef = (0, react_2.useMaskito)({ options: (_b = props.maskOptions) === null || _b === void 0 ? void 0 : _b.to });
+    var maskInputFromRef = (0, react_2.useMaskito)({
+        options: (_b = (_a = props.maskOptions) === null || _a === void 0 ? void 0 : _a.from) !== null && _b !== void 0 ? _b : (0, kit_1.maskitoDateOptionsGenerator)({
+            mode: 'dd/mm/yyyy',
+            separator: '.',
+            min: (_d = (_c = props.disabledDays) === null || _c === void 0 ? void 0 : _c.before) !== null && _d !== void 0 ? _d : null
+        })
+    });
+    var maskInputToRef = (0, react_2.useMaskito)({
+        options: (_f = (_e = props.maskOptions) === null || _e === void 0 ? void 0 : _e.to) !== null && _f !== void 0 ? _f : (0, kit_1.maskitoDateOptionsGenerator)({
+            mode: 'dd/mm/yyyy',
+            separator: '.',
+            min: (_h = (_g = props.disabledDays) === null || _g === void 0 ? void 0 : _g.before) !== null && _h !== void 0 ? _h : null
+        })
+    });
     // Global onChange (from props)
     var onChange = (0, react_1.useCallback)(function () {
         var _a;
@@ -62,7 +51,7 @@ function DateRangeField(props) {
         }
     }, [props.attributeFrom, props.attributeTo, props.inputFrom.value, props.inputTo.value, props.onChange]);
     // Input 'from'
-    var _c = (0, useDateInputState_1["default"])({
+    var _j = (0, useDateInputState_1["default"])({
         displayFormat: props.displayFormat,
         valueFormat: props.valueFormat,
         input: props.inputFrom,
@@ -71,9 +60,9 @@ function DateRangeField(props) {
         required: props.required,
         inputProps: props.inputPropsFrom,
         onChange: onChange
-    }), isOpenedFrom = _c.isOpened, onCloseFrom = _c.onClose, inputPropsFrom = _c.inputProps, onClearFrom = _c.onClear;
+    }), isOpenedFrom = _j.isOpened, onCloseFrom = _j.onClose, inputPropsFrom = _j.inputProps, onClearFrom = _j.onClear;
     // Input 'to'
-    var _d = (0, useDateInputState_1["default"])({
+    var _k = (0, useDateInputState_1["default"])({
         displayFormat: props.displayFormat,
         valueFormat: props.valueFormat,
         input: props.inputTo,
@@ -82,8 +71,8 @@ function DateRangeField(props) {
         required: props.required,
         inputProps: props.inputPropsTo,
         onChange: onChange
-    }), isOpenedTo = _d.isOpened, onCloseTo = _d.onClose, inputPropsTo = _d.inputProps, onClearTo = _d.onClear;
-    var _e = (0, useDateRange_1["default"])({
+    }), isOpenedTo = _k.isOpened, onCloseTo = _k.onClose, inputPropsTo = _k.inputProps, onClearTo = _k.onClear;
+    var _l = (0, useDateRange_1["default"])({
         onClearFrom: onClearFrom,
         onCloseTo: onCloseTo,
         onCloseFrom: onCloseFrom,
@@ -96,8 +85,8 @@ function DateRangeField(props) {
         hasInitialFocus: props.hasInitialFocus,
         displayFormat: props.displayFormat,
         valueFormat: props.valueFormat
-    }), focus = _e.focus, onClose = _e.onClose, onClear = _e.onClear, extendedInputPropsFrom = _e.extendedInputPropsFrom, extendedInputPropsTo = _e.extendedInputPropsTo;
-    react_1["default"].useEffect(function () {
+    }), focus = _l.focus, onClose = _l.onClose, onClear = _l.onClear, extendedInputPropsFrom = _l.extendedInputPropsFrom, extendedInputPropsTo = _l.extendedInputPropsTo;
+    (0, react_1.useEffect)(function () {
         if (extendedInputPropsFrom.ref && extendedInputPropsTo.ref) {
             maskInputFromRef(extendedInputPropsFrom.ref.current);
             maskInputToRef(extendedInputPropsTo.ref.current);
@@ -117,7 +106,11 @@ function DateRangeField(props) {
         onToChange: props.inputTo.onChange
     });
     // Calendar props
-    var calendarProps = (0, react_1.useMemo)(function () { return (__assign({ value: [props.inputFrom.value, props.inputTo.value], onChange: onDayClick, valueFormat: props.valueFormat, numberOfMonths: 2, showFooter: false }, props.calendarProps)); }, [onDayClick, props.calendarProps, props.inputFrom.value, props.inputTo.value, props.valueFormat]);
+    var calendarProps = (0, react_1.useMemo)(function () {
+        var _a;
+        return (__assign({ value: [props.inputFrom.value, props.inputTo.value], onChange: onDayClick, valueFormat: props.valueFormat, numberOfMonths: 2, showFooter: false }, ((props === null || props === void 0 ? void 0 : props.disabledDays)
+            ? __assign(__assign({}, props.calendarProps), { pickerProps: __assign(__assign({}, (_a = props.calendarProps) === null || _a === void 0 ? void 0 : _a.pickerProps), { disabledDays: props.disabledDays }) }) : props.calendarProps)));
+    }, [onDayClick, props.calendarProps, props.disabledDays, props.inputFrom.value, props.inputTo.value, props.valueFormat]);
     var viewProps = (0, react_1.useMemo)(function () { return (__assign(__assign({}, props.viewProps), { onClear: onClear, onClose: onClose, calendarProps: calendarProps, icon: props.icon, size: props.size, disabled: props.disabled, className: props.className, showRemove: props.showRemove, errorsFrom: props.errorsFrom, errorsTo: props.errorsTo, errors: props.errors, inputPropsTo: extendedInputPropsTo, inputPropsFrom: extendedInputPropsFrom, isOpened: focus === 'from' ? isOpenedFrom : isOpenedTo, style: props.style, id: props.id, withRangeButtons: props.withRangeButtons, rangeButtonsPosition: props.rangeButtonsPosition, displayFormat: props.displayFormat })); }, [props.viewProps, props.icon, props.size, props.disabled, props.className, props.showRemove, props.errorsFrom,
         props.errorsTo, props.errors, props.style, props.id, props.withRangeButtons, props.rangeButtonsPosition,
         props.displayFormat, onClear, onClose, calendarProps, extendedInputPropsTo, extendedInputPropsFrom, focus, isOpenedFrom, isOpenedTo]);
@@ -134,16 +127,6 @@ DateRangeField.defaultProps = {
     hasInitialFocus: false,
     icon: true,
     useSmartRangeReset: true,
-    maskOptions: {
-        from: (0, kit_1.maskitoDateOptionsGenerator)({
-            mode: 'dd/mm/yyyy',
-            separator: '.'
-        }),
-        to: (0, kit_1.maskitoDateOptionsGenerator)({
-            mode: 'dd/mm/yyyy',
-            separator: '.'
-        })
-    },
     rangeButtonsPosition: 'left-bottom'
 };
 exports["default"] = (0, fieldWrapper_1["default"])(enums_1.FieldEnum.DATE_RANGE_FIELD, DateRangeField, { attributeSuffixes: ['from', 'to'] });

package/ui/form/DateTimeField/DateTimeField.d.ts

@@ -27,6 +27,25 @@ export interface IDateTimeFieldProps extends IDateInputStateInput, IUiComponent
      * Разделитель для даты и времени, не влияет на отображение
      */
     dateTimeSeparator?: string;
+    /**
+     *  Ограничение доступных дат.
+     */
+    disabledDays?: {
+        after?: Date;
+        before?: Date;
+    };
+    /**
+     * Ограничение доступного времени.
+     */
+    availableTime?: {
+        from: string;
+        to: string;
+    };
+    /**
+     * Шаг минут
+     * @example 15
+     */
+    minuteStep?: number;
     [key: string]: any;
 }
 export interface IDateTimeFieldViewProps extends IDateInputStateOutput, Pick<IDateTimeFieldProps, 'size' | 'errors' | 'showRemove' | 'calendarProps' | 'className' | 'timePanelViewProps'> {

package/ui/form/DateTimeField/DateTimeField.js

@@ -15,8 +15,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 exports.__esModule = true;
 var react_1 = require("react");
-var kit_1 = require("@maskito/kit");
 var react_2 = require("@maskito/react");
+var utils_1 = require("./utils");
 var useDateTime_1 = __importDefault(require("../DateField/useDateTime"));
 var useDateInputState_1 = __importDefault(require("../../form/DateField/useDateInputState"));
 var fieldWrapper_1 = __importDefault(require("../../form/Field/fieldWrapper"));
@@ -28,10 +28,18 @@ var DATE_TIME_SEPARATOR = ', ';
  * Поля ввода с выпадающими списками для выбора даты и времени
  */
 function DateTimeField(props) {
-    var _a;
+    var _a, _b, _c, _d, _e, _f;
     var components = (0, hooks_1.useComponents)();
-    var maskInputRef = (0, react_2.useMaskito)({ options: props.maskOptions });
-    var _b = (0, useDateInputState_1["default"])({
+    var maskInputRef = (0, react_2.useMaskito)({
+        options: (0, utils_1.createDateTimeMask)({
+            from: (_a = props.availableTime) === null || _a === void 0 ? void 0 : _a.from,
+            to: (_b = props.availableTime) === null || _b === void 0 ? void 0 : _b.to,
+            minuteStep: props.minuteStep,
+            min: (_d = (_c = props.disabledDays) === null || _c === void 0 ? void 0 : _c.before) !== null && _d !== void 0 ? _d : null,
+            dateTimeSeparator: (_e = props.dateTimeSeparator) !== null && _e !== void 0 ? _e : DATE_TIME_SEPARATOR
+        })
+    });
+    var _g = (0, useDateInputState_1["default"])({
         input: props.input,
         disabled: props.disabled,
         onChange: props.onChange,
@@ -42,25 +50,31 @@ function DateTimeField(props) {
         displayFormat: props.displayFormat,
         useUTC: props.useUTC,
         dateInUTC: props.dateInUTC
-    }), onClear = _b.onClear, onClose = _b.onClose, isOpened = _b.isOpened, inputProps = _b.inputProps;
-    var _c = (0, useDateTime_1["default"])({
+    }), onClear = _g.onClear, onClose = _g.onClose, isOpened = _g.isOpened, inputProps = _g.inputProps;
+    var _h = (0, useDateTime_1["default"])({
         displayFormat: props.displayFormat,
-        dateTimeSeparator: (_a = props.dateTimeSeparator) !== null && _a !== void 0 ? _a : DATE_TIME_SEPARATOR,
+        dateTimeSeparator: (_f = props.dateTimeSeparator) !== null && _f !== void 0 ? _f : DATE_TIME_SEPARATOR,
         input: props.input,
         valueFormat: props.valueFormat,
         useUTC: props.useUTC,
         dateInUTC: props.dateInUTC
-    }), dateValueFormat = _c.dateValueFormat, dateValue = _c.dateValue, timeValue = _c.timeValue, onDateSelect = _c.onDateSelect, onTimeSelect = _c.onTimeSelect;
+    }), dateValueFormat = _h.dateValueFormat, dateValue = _h.dateValue, timeValue = _h.timeValue, onDateSelect = _h.onDateSelect, onTimeSelect = _h.onTimeSelect;
     // Calendar props
-    var calendarProps = (0, react_1.useMemo)(function () { return (__assign({ value: dateValue, onChange: onDateSelect, valueFormat: dateValueFormat }, props.calendarProps)); }, [dateValue, dateValueFormat, onDateSelect, props.calendarProps]);
+    var calendarProps = (0, react_1.useMemo)(function () {
+        var _a;
+        return (__assign({ value: dateValue, onChange: onDateSelect, valueFormat: dateValueFormat }, ((props === null || props === void 0 ? void 0 : props.disabledDays)
+            ? __assign(__assign({}, props.calendarProps), { pickerProps: __assign(__assign({}, (_a = props.calendarProps) === null || _a === void 0 ? void 0 : _a.pickerProps), { disabledDays: props.disabledDays }) }) : props.calendarProps)));
+    }, [dateValue, dateValueFormat, onDateSelect, props.calendarProps, props.disabledDays]);
     // TimePanel props
     var timePanelViewProps = (0, react_1.useMemo)(function () { return ({
         onClose: onClose,
         showHeader: true,
         showNow: false,
         value: timeValue,
-        onSelect: onTimeSelect
-    }); }, [onClose, onTimeSelect, timeValue]);
+        onSelect: onTimeSelect,
+        availableTime: props.availableTime,
+        minuteStep: props.minuteStep
+    }); }, [onClose, onTimeSelect, props.availableTime, props.minuteStep, timeValue]);
     var viewProps = (0, react_1.useMemo)(function () { return ({
         isOpened: isOpened,
         onClear: onClear,
@@ -78,10 +92,7 @@ function DateTimeField(props) {
         disabled: props.disabled,
         style: props.style,
         id: props.id
-    }); }, [
-        calendarProps, inputProps, isOpened, maskInputRef, onClear, onClose, props.className, props.disabled, props.errors,
-        props.icon, props.id, props.placeholder, props.showRemove, props.size, props.style, timePanelViewProps,
-    ]);
+    }); }, [calendarProps, inputProps, isOpened, maskInputRef, onClear, onClose, props.className, props.disabled, props.errors, props.icon, props.id, props.placeholder, props.showRemove, props.size, props.style, timePanelViewProps]);
     return components.ui.renderView(props.view || 'form.DateTimeFieldView', viewProps);
 }
 DateTimeField.defaultProps = {
@@ -93,11 +104,6 @@ DateTimeField.defaultProps = {
     useUTC: false,
     dateInUTC: false,
     icon: true,
-    maskOptions: (0, kit_1.maskitoDateTimeOptionsGenerator)({
-        dateMode: 'dd/mm/yyyy',
-        timeMode: 'HH:MM',
-        dateSeparator: '.',
-        dateTimeSeparator: DATE_TIME_SEPARATOR
-    })
+    minuteStep: 1
 };
 exports["default"] = (0, fieldWrapper_1["default"])(enums_1.FieldEnum.DATE_TIME_FIELD, DateTimeField);

package/ui/form/DateTimeField/utils.d.ts

@@ -0,0 +1,8 @@
+import { MaskitoOptions } from '@maskito/core';
+export declare const createDateTimeMask: (options?: {
+    from?: string;
+    to?: string;
+    minuteStep?: number;
+    min?: Date;
+    dateTimeSeparator?: string;
+}) => MaskitoOptions;

package/ui/form/DateTimeField/utils.js

@@ -0,0 +1,81 @@
+"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));
+};
+exports.__esModule = true;
+exports.createDateTimeMask = void 0;
+var kit_1 = require("@maskito/kit");
+var utils_1 = require("@steroidsjs/core/ui/form/TimeField/utils");
+var TIME_REGEXP = /(\d{2}:\d{2})$/;
+var clampTime = function (minutes, fromMin, toMin, step) {
+    // Жёсткие границы
+    if (minutes <= fromMin) {
+        return fromMin;
+    }
+    if (minutes >= toMin) {
+        return toMin;
+    }
+    if (!step || step <= 1) {
+        return minutes;
+    }
+    // Округление относительно from
+    var diff = minutes - fromMin;
+    return fromMin + Math.floor(diff / step) * step;
+};
+var createDateTimeMask = function (options) {
+    var _a;
+    var baseMask = (0, kit_1.maskitoDateTimeOptionsGenerator)({
+        dateMode: 'dd/mm/yyyy',
+        timeMode: 'HH:MM',
+        dateSeparator: '.',
+        min: options.min,
+        dateTimeSeparator: options.dateTimeSeparator
+    });
+    return __assign(__assign({}, baseMask), { postprocessors: __spreadArray(__spreadArray([], ((_a = baseMask.postprocessors) !== null && _a !== void 0 ? _a : []), true), [
+            function (_a) {
+                var value = _a.value, selection = _a.selection;
+                if (!value) {
+                    return { value: value, selection: selection };
+                }
+                var match = value.match(TIME_REGEXP);
+                if (!match) {
+                    return { value: value, selection: selection };
+                }
+                var time = match[1];
+                var minutes = (0, utils_1.timeToMinutes)(time);
+                var fromMin = (options === null || options === void 0 ? void 0 : options.from)
+                    ? (0, utils_1.timeToMinutes)(options.from.padStart(5, '0'))
+                    : 0;
+                var toMin = (options === null || options === void 0 ? void 0 : options.to)
+                    ? (0, utils_1.timeToMinutes)(options.to.padStart(5, '0'))
+                    : 24 * 60 - 1;
+                var clamped = clampTime(minutes, fromMin, toMin, options === null || options === void 0 ? void 0 : options.minuteStep);
+                var normalizedTime = (0, utils_1.minutesToTime)(clamped);
+                if (normalizedTime === time) {
+                    return { value: value, selection: selection };
+                }
+                return {
+                    value: value.replace(TIME_REGEXP, normalizedTime),
+                    selection: selection
+                };
+            },
+        ], false) });
+};
+exports.createDateTimeMask = createDateTimeMask;

package/ui/form/DateTimeRangeField/DateTimeRangeField.d.ts

@@ -57,6 +57,29 @@ export interface IDateTimeRangeFieldProps extends Omit<IDateInputStateInput, 'in
         */
         to: MaskitoOptions;
     };
+    /**
+     *  Ограничение доступных дат.
+     */
+    disabledDays?: {
+        after?: Date;
+        before?: Date;
+    };
+    /**
+     * Разделитель для даты и времени, не влияет на отображение
+     */
+    dateTimeSeparator?: string;
+    /**
+     * Ограничение доступного времени.
+     */
+    availableTime?: {
+        from: string;
+        to: string;
+    };
+    /**
+     * Шаг минут
+     * @example 15
+     */
+    minuteStep?: number;
     /**
      * Добавляет дополнительные кнопки к календарю
      * true - будут отображены кнопки по-умолчанию

package/ui/form/DateTimeRangeField/DateTimeRangeField.js

@@ -10,36 +10,13 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-var react_1 = __importStar(require("react"));
-var kit_1 = require("@maskito/kit");
+var react_1 = require("react");
 var react_2 = require("@maskito/react");
+var utils_1 = require("@steroidsjs/core/ui/form/DateTimeField/utils");
 var useDateRange_1 = __importDefault(require("../../form/DateField/useDateRange"));
 var useDateTime_1 = __importDefault(require("../../form/DateField/useDateTime"));
 var useDateInputState_1 = __importDefault(require("../../form/DateField/useDateInputState"));
@@ -48,10 +25,26 @@ var hooks_1 = require("../../../hooks");
 var enums_1 = require("../../../enums");
 var DATE_TIME_SEPARATOR = ', ';
 function DateTimeRangeField(props) {
-    var _a, _b;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
     var components = (0, hooks_1.useComponents)();
-    var maskInputFromRef = (0, react_2.useMaskito)({ options: (_a = props.maskOptions) === null || _a === void 0 ? void 0 : _a.from });
-    var maskInputToRef = (0, react_2.useMaskito)({ options: (_b = props.maskOptions) === null || _b === void 0 ? void 0 : _b.to });
+    var maskInputFromRef = (0, react_2.useMaskito)({
+        options: (_b = (_a = props.maskOptions) === null || _a === void 0 ? void 0 : _a.from) !== null && _b !== void 0 ? _b : (0, utils_1.createDateTimeMask)({
+            from: (_c = props.availableTime) === null || _c === void 0 ? void 0 : _c.from,
+            to: (_d = props.availableTime) === null || _d === void 0 ? void 0 : _d.to,
+            minuteStep: props.minuteStep,
+            min: (_f = (_e = props.disabledDays) === null || _e === void 0 ? void 0 : _e.before) !== null && _f !== void 0 ? _f : null,
+            dateTimeSeparator: (_g = props.dateTimeSeparator) !== null && _g !== void 0 ? _g : DATE_TIME_SEPARATOR
+        })
+    });
+    var maskInputToRef = (0, react_2.useMaskito)({
+        options: (_j = (_h = props.maskOptions) === null || _h === void 0 ? void 0 : _h.to) !== null && _j !== void 0 ? _j : (0, utils_1.createDateTimeMask)({
+            from: (_k = props.availableTime) === null || _k === void 0 ? void 0 : _k.from,
+            to: (_l = props.availableTime) === null || _l === void 0 ? void 0 : _l.to,
+            minuteStep: props.minuteStep,
+            min: (_o = (_m = props.disabledDays) === null || _m === void 0 ? void 0 : _m.before) !== null && _o !== void 0 ? _o : null,
+            dateTimeSeparator: (_p = props.dateTimeSeparator) !== null && _p !== void 0 ? _p : DATE_TIME_SEPARATOR
+        })
+    });
     // Global onChange (from props)
     var onChange = (0, react_1.useCallback)(function () {
         var _a;
@@ -63,7 +56,7 @@ function DateTimeRangeField(props) {
         }
     }, [props.attributeFrom, props.attributeTo, props.inputFrom.value, props.inputTo.value, props.onChange]);
     // Input 'from'
-    var _c = (0, useDateInputState_1["default"])({
+    var _q = (0, useDateInputState_1["default"])({
         displayFormat: props.displayFormat,
         valueFormat: props.valueFormat,
         input: props.inputFrom,
@@ -74,9 +67,9 @@ function DateTimeRangeField(props) {
         useUTC: props.useUTC,
         dateInUTC: props.dateInUTC,
         onChange: onChange
-    }), isOpenedFrom = _c.isOpened, onCloseFrom = _c.onClose, inputPropsFrom = _c.inputProps, onClearFrom = _c.onClear, onNow = _c.onNow;
+    }), isOpenedFrom = _q.isOpened, onCloseFrom = _q.onClose, inputPropsFrom = _q.inputProps, onClearFrom = _q.onClear, onNow = _q.onNow;
     // Input 'to'
-    var _d = (0, useDateInputState_1["default"])({
+    var _r = (0, useDateInputState_1["default"])({
         displayFormat: props.displayFormat,
         valueFormat: props.valueFormat,
         input: props.inputTo,
@@ -87,24 +80,24 @@ function DateTimeRangeField(props) {
         useUTC: props.useUTC,
         dateInUTC: props.dateInUTC,
         onChange: onChange
-    }), isOpenedTo = _d.isOpened, onCloseTo = _d.onClose, inputPropsTo = _d.inputProps, onClearTo = _d.onClear;
-    var _e = (0, useDateTime_1["default"])({
+    }), isOpenedTo = _r.isOpened, onCloseTo = _r.onClose, inputPropsTo = _r.inputProps, onClearTo = _r.onClear;
+    var _s = (0, useDateTime_1["default"])({
         displayFormat: props.displayFormat,
         valueFormat: props.valueFormat,
         dateTimeSeparator: DATE_TIME_SEPARATOR,
         useUTC: props.useUTC,
         dateInUTC: props.dateInUTC,
         input: props.inputFrom
-    }), dateValueFormat = _e.dateValueFormat, dateValueFrom = _e.dateValue, timeValueFrom = _e.timeValue, onDateFromSelect = _e.onDateSelect, onTimeFromSelect = _e.onTimeSelect;
-    var _f = (0, useDateTime_1["default"])({
+    }), dateValueFormat = _s.dateValueFormat, dateValueFrom = _s.dateValue, timeValueFrom = _s.timeValue, onDateFromSelect = _s.onDateSelect, onTimeFromSelect = _s.onTimeSelect;
+    var _t = (0, useDateTime_1["default"])({
         displayFormat: props.displayFormat,
         valueFormat: props.valueFormat,
         dateTimeSeparator: DATE_TIME_SEPARATOR,
         useUTC: props.useUTC,
         dateInUTC: props.dateInUTC,
         input: props.inputTo
-    }), dateValueTo = _f.dateValue, timeValueTo = _f.timeValue, onDateToSelect = _f.onDateSelect, onTimeToSelect = _f.onTimeSelect;
-    var _g = (0, useDateRange_1["default"])({
+    }), dateValueTo = _t.dateValue, timeValueTo = _t.timeValue, onDateToSelect = _t.onDateSelect, onTimeToSelect = _t.onTimeSelect;
+    var _u = (0, useDateRange_1["default"])({
         onClearFrom: onClearFrom,
         onCloseTo: onCloseTo,
         onCloseFrom: onCloseFrom,
@@ -117,8 +110,8 @@ function DateTimeRangeField(props) {
         hasInitialFocus: props.hasInitialFocus,
         displayFormat: props.displayFormat,
         valueFormat: props.valueFormat
-    }), focus = _g.focus, onClose = _g.onClose, onClear = _g.onClear, extendedInputPropsFrom = _g.extendedInputPropsFrom, extendedInputPropsTo = _g.extendedInputPropsTo;
-    react_1["default"].useEffect(function () {
+    }), focus = _u.focus, onClose = _u.onClose, onClear = _u.onClear, extendedInputPropsFrom = _u.extendedInputPropsFrom, extendedInputPropsTo = _u.extendedInputPropsTo;
+    (0, react_1.useEffect)(function () {
         if (extendedInputPropsFrom.ref && extendedInputPropsTo.ref) {
             maskInputFromRef(extendedInputPropsFrom.ref.current);
             maskInputToRef(extendedInputPropsTo.ref.current);
@@ -130,18 +123,13 @@ function DateTimeRangeField(props) {
         maskInputToRef,
     ]);
     // Calendar props
-    var calendarProps = (0, react_1.useMemo)(function () { return (__assign({ value: [dateValueFrom, dateValueTo], onChange: focus === 'from' ? onDateFromSelect : onDateToSelect, valueFormat: dateValueFormat }, props.calendarProps)); }, [dateValueFormat, dateValueFrom, dateValueTo, focus, onDateFromSelect, onDateToSelect, props.calendarProps]);
+    var calendarProps = (0, react_1.useMemo)(function () {
+        var _a;
+        return (__assign({ value: [dateValueFrom, dateValueTo], onChange: focus === 'from' ? onDateFromSelect : onDateToSelect, valueFormat: dateValueFormat }, ((props === null || props === void 0 ? void 0 : props.disabledDays)
+            ? __assign(__assign({}, props.calendarProps), { pickerProps: __assign(__assign({}, (_a = props.calendarProps) === null || _a === void 0 ? void 0 : _a.pickerProps), { disabledDays: props.disabledDays }) }) : props.calendarProps)));
+    }, [dateValueFormat, dateValueFrom, dateValueTo, focus, onDateFromSelect, onDateToSelect, props.calendarProps, props.disabledDays]);
     // TimePanel props
-    var timePanelViewProps = (0, react_1.useMemo)(function () { return (__assign({ value: focus === 'from' ? timeValueFrom : timeValueTo, onSelect: focus === 'from' ? onTimeFromSelect : onTimeToSelect, onNow: onNow, onClose: onClose, showNow: false, showHeader: true }, props.timePanelViewProps)); }, [
-        focus,
-        onClose,
-        onNow,
-        onTimeFromSelect,
-        onTimeToSelect,
-        props.timePanelViewProps,
-        timeValueFrom,
-        timeValueTo,
-    ]);
+    var timePanelViewProps = (0, react_1.useMemo)(function () { return (__assign({ value: focus === 'from' ? timeValueFrom : timeValueTo, onSelect: focus === 'from' ? onTimeFromSelect : onTimeToSelect, onNow: onNow, onClose: onClose, showNow: false, showHeader: true, availableTime: props.availableTime, minuteStep: props.minuteStep }, props.timePanelViewProps)); }, [focus, onClose, onNow, onTimeFromSelect, onTimeToSelect, props.availableTime, props.minuteStep, props.timePanelViewProps, timeValueFrom, timeValueTo]);
     var viewProps = (0, react_1.useMemo)(function () { return ({
         onClear: onClear,
         onClose: onClose,
@@ -178,18 +166,7 @@ DateTimeRangeField.defaultProps = {
     useUTC: false,
     dateInUTC: false,
     icon: true,
-    maskOptions: {
-        from: (0, kit_1.maskitoDateTimeOptionsGenerator)({
-            dateMode: 'dd/mm/yyyy',
-            timeMode: 'HH:MM',
-            dateSeparator: '.'
-        }),
-        to: (0, kit_1.maskitoDateTimeOptionsGenerator)({
-            dateMode: 'dd/mm/yyyy',
-            timeMode: 'HH:MM',
-            dateSeparator: '.'
-        })
-    },
-    rangeButtonsPosition: 'left-bottom'
+    rangeButtonsPosition: 'left-bottom',
+    minuteStep: 1
 };
 exports["default"] = (0, fieldWrapper_1["default"])(enums_1.FieldEnum.DATE_TIME_RANGE_FIELD, DateTimeRangeField, { attributeSuffixes: ['from', 'to'] });

package/ui/form/DropDownField/DropDownField.d.ts

@@ -166,6 +166,14 @@ export interface IDropDownFieldProps extends IFieldWrapperInputProps, Omit<IData
      * Число в пикселях, больше которого не может быть выпадающее меню
      */
     maxHeight?: number;
+    /**
+     * Callback-функция, которая вызывается при открытии DropDown
+     */
+    onOpen?: () => void;
+    /**
+     * Сигнал, запрещающий отправку запроса на получение данных
+     */
+    isFetchDisabled?: boolean;
     [key: string]: any;
 }
 export interface IDropDownFieldViewProps extends IDropDownFieldProps {

package/ui/form/DropDownField/DropDownField.js

@@ -120,7 +120,8 @@ function DropDownField(props) {
         autoComplete: props.autoComplete,
         autoFetch: props.autoFetch,
         query: query,
-        initialSelectedIds: inputSelectedIds
+        initialSelectedIds: inputSelectedIds,
+        isFetchDisabled: props.isFetchDisabled
     }), fetchRemote = _c.fetchRemote, items = _c.items, isLoading = _c.isLoading, isAutoComplete = _c.isAutoComplete, sourceItems = _c.sourceItems, dataProvider = __rest(_c, ["fetchRemote", "items", "isLoading", "isAutoComplete", "sourceItems"]);
     // Data select
     var _d = (0, hooks_1.useDataSelect)({
@@ -136,11 +137,15 @@ function DropDownField(props) {
         hasCloseOnSelect: props.hasCloseOnSelect
     }), isOpened = _d.isOpened, setIsOpened = _d.setIsOpened, setIsFocused = _d.setIsFocused, hoveredId = _d.hoveredId, setHoveredId = _d.setHoveredId, selectedIds = _d.selectedIds, setSelectedIds = _d.setSelectedIds, selectedItems = _d.selectedItems, setSelectedAll = _d.setSelectedAll, isSelectedAll = _d.isSelectedAll;
     var onOpen = (0, react_1.useCallback)(function () {
+        // setIsLazyLoadEnabled(true);
         setQuery('');
         setIsFocused(true);
         setIsOpened(true);
         setHoveredId(null);
-    }, [setHoveredId, setIsFocused, setIsOpened]);
+        if (props.onOpen) {
+            props.onOpen();
+        }
+    }, [setHoveredId, setIsFocused, setIsOpened, props.onOpen]);
     var onItemHover = (0, react_1.useCallback)(function (id) {
         setHoveredId(id);
     }, [setHoveredId]);

package/ui/form/TimeField/TimeField.d.ts

@@ -1,5 +1,6 @@
+import { MaskitoOptions } from '@maskito/core';
 import { IDateInputStateInput, IDateInputStateOutput } from '../../form/DateField/useDateInputState';
-export interface ITimePanelViewProps extends Pick<ITimeFieldViewProps, 'value' | 'onClose' | 'onNow' | 'onSelect' | 'className'> {
+export interface ITimePanelViewProps extends Pick<ITimeFieldViewProps, 'value' | 'onClose' | 'onNow' | 'onSelect' | 'className' | 'availableTime' | 'minuteStep'> {
     showHeader?: boolean;
     showNow?: boolean;
 }
@@ -21,9 +22,25 @@ export interface ITimeFieldProps extends IDateInputStateInput, IUiComponent {
      * Свойства для компонента панели времени
      */
     timePanelViewProps?: any;
+    /**
+     * Опции маски для поля ввода
+     */
+    maskOptions?: MaskitoOptions;
+    /**
+     *  Ограничение доступного времени.
+     */
+    availableTime?: {
+        from: string;
+        to: string;
+    };
+    /**
+     * Шаг минут
+     * @example 15
+     */
+    minuteStep?: number;
     [key: string]: any;
 }
-export interface ITimeFieldViewProps extends IDateInputStateOutput, Pick<ITimeFieldProps, 'size' | 'errors' | 'showRemove' | 'noBorder' | 'className' | 'timePanelViewProps' | 'style'> {
+export interface ITimeFieldViewProps extends IDateInputStateOutput, Pick<ITimeFieldProps, 'size' | 'errors' | 'showRemove' | 'noBorder' | 'className' | 'timePanelViewProps' | 'style' | 'availableTime' | 'minuteStep'> {
     [key: string]: any;
 }
 declare const _default: import("../Field/fieldWrapper").FieldWrapperComponent<ITimeFieldProps>;