@consta/uikit 3.5.0 → 3.6.0

package/__internal__/cjs-src/components/ChoiceGroup/ChoiceGroup.js

@@ -24,13 +24,22 @@ var sizeMap = {
 };
 exports.cnChoiceGroup = bem_1.cn('ChoiceGroup');
 exports.ChoiceGroup = react_1["default"].forwardRef(function (props, ref) {
-    var _a = props.size, size = _a === void 0 ? exports.choiceGroupDefaultSize : _a, _b = props.form, form = _b === void 0 ? exports.choiceGroupDefaultForm : _b, _c = props.view, view = _c === void 0 ? exports.choiceGroupDefaultView : _c, _d = props.width, width = _d === void 0 ? exports.choiceGroupWidthDefault : _d, onlyIcon = props.onlyIcon, iconSizeProp = props.iconSize, _e = props.value, value = _e === void 0 ? null : _e, _f = props.multiple, multiple = _f === void 0 ? false : _f, items = props.items, getLabel = props.getLabel, onChange = props.onChange, getIcon = props.getIcon, name = props.name, className = props.className, otherProps = tslib_1.__rest(props, ["size", "form", "view", "width", "onlyIcon", "iconSize", "value", "multiple", "items", "getLabel", "onChange", "getIcon", "name", "className"]);
-    var _g = useChoiceGroup_1.useChoiceGroup({
+    var _a = props.size, size = _a === void 0 ? exports.choiceGroupDefaultSize : _a, _b = props.form, form = _b === void 0 ? exports.choiceGroupDefaultForm : _b, _c = props.view, view = _c === void 0 ? exports.choiceGroupDefaultView : _c, _d = props.width, width = _d === void 0 ? exports.choiceGroupWidthDefault : _d, onlyIcon = props.onlyIcon, iconSizeProp = props.iconSize, _e = props.value, value = _e === void 0 ? null : _e, _f = props.multiple, multiple = _f === void 0 ? false : _f, items = props.items, getLabel = props.getLabel, onChange = props.onChange, getIcon = props.getIcon, name = props.name, className = props.className, _g = props.disabled, disabled = _g === void 0 ? false : _g, getDisabled = props.getDisabled, otherProps = tslib_1.__rest(props, ["size", "form", "view", "width", "onlyIcon", "iconSize", "value", "multiple", "items", "getLabel", "onChange", "getIcon", "name", "className", "disabled", "getDisabled"]);
+    var _h = useChoiceGroup_1.useChoiceGroup({
         value: value,
         getKey: getLabel,
         callBack: onChange,
         multiple: multiple
-    }), getOnChange = _g.getOnChange, getChecked = _g.getChecked;
+    }), getOnChange = _h.getOnChange, getChecked = _h.getChecked;
     var iconSize = getSizeByMap_1.getSizeByMap(sizeMap, size, iconSizeProp);
-    return (react_1["default"].createElement("div", tslib_1.__assign({}, otherProps, { ref: ref, className: exports.cnChoiceGroup({ size: size, form: form, view: view, width: width, onlyIcon: onlyIcon }, [className]) }), items.map(function (item) { return (react_1["default"].createElement(ChoiceGroup_Item_1.ChoiceGroupItem, { key: getLabel(item), onChange: getOnChange(item), checked: getChecked(item), label: getLabel(item).toString(), icon: getIcon && getIcon(item), iconSize: iconSize, multiple: multiple, onlyIcon: onlyIcon, name: name })); })));
+    return (react_1["default"].createElement("div", tslib_1.__assign({}, otherProps, { ref: ref, className: exports.cnChoiceGroup({ size: size, form: form, view: view, width: width, onlyIcon: onlyIcon, disabled: disabled }, [className]) }), items.map(function (item, idx) {
+        var itemChecked = getChecked(item);
+        var itemDisabled = !!getDisabled && getDisabled(item);
+        return (react_1["default"].createElement(react_1["default"].Fragment, { key: getLabel(item) },
+            idx > 0 && (react_1["default"].createElement("div", { className: exports.cnChoiceGroup('Divider', {
+                    checked: itemChecked,
+                    disabled: itemDisabled
+                }) })),
+            react_1["default"].createElement(ChoiceGroup_Item_1.ChoiceGroupItem, { onChange: getOnChange(item), checked: itemChecked, label: getLabel(item).toString(), icon: getIcon && getIcon(item), iconSize: iconSize, multiple: multiple, onlyIcon: onlyIcon, name: name, disabled: disabled || itemDisabled })));
+    })));
 });

package/__internal__/cjs-src/components/ChoiceGroup/Item/ChoiceGroup-Item.d.ts

@@ -9,6 +9,7 @@ declare type Props = {
     onChange: React.ChangeEventHandler<HTMLInputElement>;
     checked: boolean;
     multiple: boolean;
+    disabled?: boolean;
 };
 export declare const ChoiceGroupItem: React.FC<Props>;
 export {};

package/__internal__/cjs-src/components/ChoiceGroup/Item/ChoiceGroup-Item.js

@@ -6,12 +6,12 @@ var react_1 = tslib_1.__importStar(require("react"));
 var MixFocus_1 = require("../../../mixs/MixFocus/MixFocus");
 var ChoiceGroup_1 = require("../ChoiceGroup");
 exports.ChoiceGroupItem = function (props) {
-    var label = props.label, onChange = props.onChange, checked = props.checked, multiple = props.multiple, Icon = props.icon, onlyIcon = props.onlyIcon, name = props.name, iconSize = props.iconSize;
-    var _a = tslib_1.__read(react_1.useState(false), 2), focus = _a[0], setFocus = _a[1];
+    var label = props.label, onChange = props.onChange, checked = props.checked, multiple = props.multiple, Icon = props.icon, onlyIcon = props.onlyIcon, name = props.name, iconSize = props.iconSize, _a = props.disabled, disabled = _a === void 0 ? false : _a;
+    var _b = tslib_1.__read(react_1.useState(false), 2), focus = _b[0], setFocus = _b[1];
     var handleBlur = function () { return setFocus(false); };
     var handleFocus = function () { return setFocus(true); };
-    return (react_1["default"].createElement("label", { className: ChoiceGroup_1.cnChoiceGroup('Label', { focus: focus, checked: checked }, [MixFocus_1.cnMixFocus()]), title: onlyIcon ? label : undefined },
-        react_1["default"].createElement("input", { type: multiple ? 'checkbox' : 'radio', className: ChoiceGroup_1.cnChoiceGroup('Input'), checked: checked, onFocus: handleFocus, onBlur: handleBlur, value: name + "-" + label, onChange: onChange, name: name }),
+    return (react_1["default"].createElement("label", { className: ChoiceGroup_1.cnChoiceGroup('Label', { focus: focus, checked: checked, disabled: disabled }, [MixFocus_1.cnMixFocus()]), title: onlyIcon ? label : undefined },
+        react_1["default"].createElement("input", { type: multiple ? 'checkbox' : 'radio', className: ChoiceGroup_1.cnChoiceGroup('Input'), checked: checked, onFocus: handleFocus, onBlur: handleBlur, value: name + "-" + label, onChange: onChange, name: name, disabled: disabled }),
         Icon && react_1["default"].createElement(Icon, { className: ChoiceGroup_1.cnChoiceGroup('Icon'), size: iconSize }),
         !onlyIcon && react_1["default"].createElement("span", { className: ChoiceGroup_1.cnChoiceGroup('Text') }, label)));
 };

package/__internal__/cjs-src/components/Collapse/Collapse.css

@@ -110,10 +110,6 @@
         background: var(--color-control-bg-clear-hover);
       }
 
-  .Collapse-Label_divider {
-      border-bottom: 1px solid var(--color-bg-border);
-    }
-
   .Collapse-Label_iconPosition_right {
         -webkit-box-orient: horizontal;
         -webkit-box-direction: reverse;
@@ -134,6 +130,10 @@
       max-height: 200vh;
     }
 
+  .Collapse-Body_divider {
+      border-bottom: 1px solid var(--color-bg-border);
+    }
+
   .Collapse-Side {
     margin-left: var(--elements-offset);
     line-height: 0;

package/__internal__/cjs-src/components/Collapse/Collapse.js

@@ -49,12 +49,11 @@ exports.Collapse = react_1["default"].forwardRef(function (props, ref) {
     return (react_1["default"].createElement("div", { ref: ref, className: exports.cnCollapse({ size: size, view: view, horizontalSpace: horizontalSpace }, [className]), style: style },
         react_1["default"].createElement("div", tslib_1.__assign({ className: exports.cnCollapse('Label', {
                 hoverEffect: hoverEffect,
-                divider: divider,
                 iconPosition: iconPosition
             }) }, otherProps),
             react_1["default"].createElement(CollapseIcon_1.CollapseIcon, { className: exports.cnCollapse('Icon', { position: iconPosition }), size: getSizeByMap_1.getSizeByMap(exports.sizeIconMap, size), icon: icon, closeIcon: closeIcon, isOpen: isOpen, direction: directionIcon, closeDirection: closeDirectionIcon }),
             react_1["default"].createElement(Text_1.Text, { className: exports.cnCollapse('LabelText'), view: view, size: size }, label),
             iconPosition === 'left' && renderSide(rightSide)),
-        react_1["default"].createElement("div", { className: exports.cnCollapse('Body', { isOpen: isOpen }) },
+        react_1["default"].createElement("div", { className: exports.cnCollapse('Body', { isOpen: isOpen, divider: divider }) },
             react_1["default"].createElement("div", { className: exports.cnCollapse('Content') }, children))));
 });

package/__internal__/cjs-src/components/Combobox/helpers.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { PropsWithHTMLAttributesAndRef } from '../../utils/types/PropsWithHTMLAttributes';
-import { PropForm, PropSize, PropView, RenderItemProps } from '../SelectComponents/types';
+import { PropForm, PropSize, PropStatus, PropView, RenderItemProps } from '../SelectComponents/types';
 export declare type DefaultItem = {
     label: string;
     id: string | number;
@@ -38,6 +38,7 @@ export declare type ComboboxProps<ITEM = DefaultItem, GROUP = DefaultGroup, MULT
     view?: PropView;
     placeholder?: string;
     ariaLabel?: string;
+    status?: PropStatus;
     dropdownClassName?: string;
     dropdownRef?: React.RefObject<HTMLDivElement>;
     name?: string;
@@ -62,6 +63,9 @@ export declare type ComboboxProps<ITEM = DefaultItem, GROUP = DefaultGroup, MULT
     getItemDisabled?: PropGetItemDisabled<ITEM>;
     getGroupLabel?: PropGetGroupLabel<GROUP>;
     getGroupKey?: PropGetGroupKey<GROUP>;
+    label?: string;
+    caption?: string;
+    labelPosition?: 'top' | 'left';
 }, HTMLDivElement> & (ITEM extends {
     label: DefaultItem['label'];
 } ? {} : {
@@ -92,11 +96,12 @@ export declare function withDefaultGetters<ITEM = DefaultItem, GROUP = DefaultGr
     items: ITEM[];
     onChange: PropOnChange<ITEM, MULTIPLE>;
     disabled?: boolean | undefined;
-    form?: "default" | "round" | "brick" | "brickDefault" | "defaultBrick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "brickClear" | "clearBrick" | "clearClear" | undefined;
+    form?: "default" | "round" | "brick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "defaultBrick" | "brickDefault" | "brickClear" | "clearBrick" | "clearClear" | undefined;
     size?: "s" | "m" | "l" | undefined;
     view?: "default" | "clear" | undefined;
     placeholder?: string | undefined;
     ariaLabel?: string | undefined;
+    status?: "alert" | "success" | "warning" | undefined;
     dropdownClassName?: string | undefined;
     dropdownRef?: React.RefObject<HTMLDivElement> | undefined;
     name?: string | undefined;
@@ -121,6 +126,9 @@ export declare function withDefaultGetters<ITEM = DefaultItem, GROUP = DefaultGr
     getItemDisabled?: PropGetItemDisabled<ITEM> | undefined;
     getGroupLabel?: PropGetGroupLabel<GROUP> | undefined;
     getGroupKey?: PropGetGroupKey<GROUP> | undefined;
+    label?: string | undefined;
+    caption?: string | undefined;
+    labelPosition?: "left" | "top" | undefined;
 } & Pick<React.HTMLAttributes<HTMLDivElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<HTMLDivElement> & (ITEM extends {
     label: string;
 } ? {} : {

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

@@ -0,0 +1,5 @@
+.DateTime100YearSlider {
+  --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) / 11);
+  --parent-width: calc(var(--item-width) * 10);
+}

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

@@ -0,0 +1,14 @@
+import './DateTime100YearSlider.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 DateTime100YearSliderProps = PropsWithHTMLAttributes<{
+    currentVisibleDate: Date;
+    onChange: (date: Date) => void;
+    children?: never;
+    value?: Date | DateRange;
+    locale?: Locale;
+}, HTMLDivElement>;
+export declare const cnDateTime100YearSlider: import("@bem-react/classname").ClassNameFormatter;
+export declare const DateTime100YearSlider: React.FC<DateTime100YearSliderProps>;

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

@@ -0,0 +1,52 @@
+"use strict";
+exports.__esModule = true;
+exports.DateTime100YearSlider = exports.cnDateTime100YearSlider = void 0;
+var tslib_1 = require("tslib");
+require("./DateTime100YearSlider.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 date_1 = require("../../../utils/date");
+var DateTimeSlider_1 = require("../DateTimeSlider/DateTimeSlider");
+var getSliderValueRange_1 = require("../helpers/getSliderValueRange");
+exports.cnDateTime100YearSlider = bem_1.cn('DateTime100YearSlider');
+var isCurrentVisibleCentury = function (currentDate, century) {
+    return date_1.getCentury(currentDate) === date_1.getCentury(century);
+};
+var isCurrentVisibleDecade = function (currentDate, decade) {
+    return isCurrentVisibleCentury(currentDate, decade) && date_fns_1.getDecade(currentDate) === date_fns_1.getDecade(decade);
+};
+var getCenturyItems = function (currentVisibleDate, decade, locale) {
+    return array_1.range(10).map(function (year) {
+        var yearDate = date_fns_1.addYears(decade, year * 10);
+        return {
+            date: yearDate,
+            label: date_fns_1.format(yearDate, 'yyyy', { locale: locale }),
+            current: isCurrentVisibleDecade(currentVisibleDate, yearDate)
+        };
+    });
+};
+var getSliderData = function (currentVisibleDate, value, locale) {
+    var currentCentury = date_1.startOfCentury(currentVisibleDate);
+    return [
+        date_fns_1.addYears(currentCentury, -100),
+        currentCentury,
+        date_fns_1.addYears(currentCentury, 100),
+        date_fns_1.addYears(currentCentury, 200),
+    ].map(function (date) { return ({
+        label: date_fns_1.format(date, 'yyyy', { locale: locale }) + "-" + date_fns_1.format(date_fns_1.addYears(date, 100), 'yyyy', { locale: locale }),
+        date: date,
+        items: getCenturyItems(currentVisibleDate, date, locale),
+        current: isCurrentVisibleCentury(currentVisibleDate, date),
+        valueRange: getSliderValueRange_1.getSliderValueRange(date, value, date_1.startOfCentury, date_1.endOfCentury)
+    }); });
+};
+exports.DateTime100YearSlider = 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, -100)); };
+    var handleNext = function () { return onChange(date_fns_1.addYears(currentVisibleDate, 100)); };
+    var data = getSliderData(currentVisibleDate, value, locale);
+    return (react_1["default"].createElement(DateTimeSlider_1.DateTimeSlider, tslib_1.__assign({ className: exports.cnDateTime100YearSlider(null, [className]), onNext: handleNext, onPrev: handlePrev, data: data, onChange: onChange }, otherProps)));
+};

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

@@ -0,0 +1,5 @@
+.DateTime10YearSlider {
+  --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) / 11);
+  --parent-width: calc(var(--item-width) * 10);
+}

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

@@ -0,0 +1,14 @@
+import './DateTime10YearSlider.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 DateTime10YearSliderProps = PropsWithHTMLAttributes<{
+    currentVisibleDate: Date;
+    onChange: (date: Date) => void;
+    children?: never;
+    value?: Date | DateRange;
+    locale?: Locale;
+}, HTMLDivElement>;
+export declare const cnDateTime10YearSlider: import("@bem-react/classname").ClassNameFormatter;
+export declare const DateTime10YearSlider: React.FC<DateTime10YearSliderProps>;

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

@@ -0,0 +1,51 @@
+"use strict";
+exports.__esModule = true;
+exports.DateTime10YearSlider = exports.cnDateTime10YearSlider = void 0;
+var tslib_1 = require("tslib");
+require("./DateTime10YearSlider.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 getSliderValueRange_1 = require("../helpers/getSliderValueRange");
+exports.cnDateTime10YearSlider = bem_1.cn('DateTime10YearSlider');
+var isCurrentVisibleDecade = function (currentDate, decade) {
+    return date_fns_1.getDecade(currentDate) === date_fns_1.getDecade(decade);
+};
+var isCurrentVisibleYear = function (currentDate, year) {
+    return isCurrentVisibleDecade(currentDate, year) && date_fns_1.getYear(currentDate) === date_fns_1.getYear(year);
+};
+var getDecadeItems = function (currentVisibleDate, decade, locale) {
+    return array_1.range(10).map(function (year) {
+        var yearDate = date_fns_1.addYears(decade, year);
+        return {
+            date: yearDate,
+            label: date_fns_1.format(yearDate, 'yyyy', { locale: locale }),
+            current: isCurrentVisibleYear(currentVisibleDate, yearDate)
+        };
+    });
+};
+var getSliderData = function (currentVisibleDate, value, locale) {
+    var currentDecade = date_fns_1.startOfDecade(currentVisibleDate);
+    return [
+        date_fns_1.addYears(currentDecade, -10),
+        currentDecade,
+        date_fns_1.addYears(currentDecade, 10),
+        date_fns_1.addYears(currentDecade, 20),
+    ].map(function (date) { return ({
+        label: date_fns_1.format(date, 'yyyy', { locale: locale }) + "-" + date_fns_1.format(date_fns_1.addYears(date, 10), 'yyyy', { locale: locale }),
+        date: date,
+        items: getDecadeItems(currentVisibleDate, date, locale),
+        current: isCurrentVisibleDecade(currentVisibleDate, date),
+        valueRange: getSliderValueRange_1.getSliderValueRange(date, value, date_fns_1.startOfDecade, date_fns_1.endOfDecade)
+    }); });
+};
+exports.DateTime10YearSlider = 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, -10)); };
+    var handleNext = function () { return onChange(date_fns_1.addYears(currentVisibleDate, 10)); };
+    var data = getSliderData(currentVisibleDate, value, locale);
+    return (react_1["default"].createElement(DateTimeSlider_1.DateTimeSlider, tslib_1.__assign({ className: exports.cnDateTime10YearSlider(null, [className]), onNext: handleNext, onPrev: handlePrev, data: data, onChange: onChange }, otherProps)));
+};

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

@@ -0,0 +1,14 @@
+.DateTime10Years {
+  --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/DateTime10Years/DateTime10Years.d.ts

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

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

@@ -0,0 +1,13 @@
+"use strict";
+exports.__esModule = true;
+exports.DateTime10Years = exports.cnDateTime10Years = void 0;
+var tslib_1 = require("tslib");
+require("./DateTime10Years.css");
+var react_1 = tslib_1.__importDefault(require("react"));
+var bem_1 = require("../../../utils/bem");
+var DateTimeGrid_1 = require("../DateTimeGrid/DateTimeGrid");
+exports.cnDateTime10Years = bem_1.cn('DateTime10Years');
+exports.DateTime10Years = 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.cnDateTime10Years(null, [className]), items: years })));
+};

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

@@ -0,0 +1,3 @@
+import { DateTimeComponent } from './helpers/types';
+export declare const DateTime: DateTimeComponent;
+export * from './helpers/types';

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

@@ -0,0 +1,25 @@
+"use strict";
+exports.__esModule = true;
+exports.DateTime = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var getSizeByMap_1 = require("../../utils/getSizeByMap");
+var DateTimeTypeDate_1 = require("./DateTimeTypeDate/DateTimeTypeDate");
+var DateTimeTypeDateTime_1 = require("./DateTimeTypeDateTime/DateTimeTypeDateTime");
+var DateTimeTypeMonth_1 = require("./DateTimeTypeMonth/DateTimeTypeMonth");
+var DateTimeTypeTime_1 = require("./DateTimeTypeTime/DateTimeTypeTime");
+var DateTimeTypeYear_1 = require("./DateTimeTypeYear/DateTimeTypeYear");
+var types_1 = require("./helpers/types");
+var typeMap = {
+    'date': DateTimeTypeDate_1.DateTimeTypeDate,
+    'month': DateTimeTypeMonth_1.DateTimeTypeMonth,
+    'year': DateTimeTypeYear_1.DateTimeTypeYear,
+    'time': DateTimeTypeTime_1.DateTimeTypeTime,
+    'date-time': DateTimeTypeDateTime_1.DateTimeTypeDateTime
+};
+exports.DateTime = react_1.forwardRef(function (props, ref) {
+    var _a = props.type, type = _a === void 0 ? types_1.dateTimePropTypeDefault : _a, otherProps = tslib_1.__rest(props, ["type"]);
+    var Component = getSizeByMap_1.getSizeByMap(typeMap, type);
+    return react_1["default"].createElement(Component, tslib_1.__assign({}, otherProps, { ref: ref }));
+});
+tslib_1.__exportStar(require("./helpers/types"), exports);

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

@@ -0,0 +1,56 @@
+/* 
+--date-time-cell-width
+--date-time-cell-height
+--date-time-cell-vertical-gap
+--date-time-cell-horisontal-ga
+
+задаются сверху
+*/
+
+.DateTimeCell {
+  --bg-color: var(--color-control-bg-ghost);
+  --visible-height: calc(var(--date-time-cell-height) - (var(--date-time-cell-horisontal-gap) * 2));
+  position: relative;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  width: var(--date-time-cell-width);
+  height: var(--date-time-cell-height);
+}
+
+.DateTimeCell_range::before {
+      content: '';
+      position: absolute;
+      top: var(--date-time-cell-vertical-gap);
+      right: 0;
+      left: 0;
+      bottom: var(--date-time-cell-vertical-gap);
+      background: var(--bg-color);
+    }
+
+.DateTimeCell_range_first::before,
+    .DateTimeCell_range_last::before {
+      content: '';
+      position: absolute;
+      top: var(--date-time-cell-vertical-gap);
+      bottom: var(--date-time-cell-vertical-gap);
+      background: var(--bg-color);
+    }
+
+.DateTimeCell_range_first::before {
+      right: 0;
+      left: var(--date-time-cell-horisontal-gap);
+      border-radius: var(--visible-height) 0 0 var(--visible-height);
+    }
+
+.DateTimeCell_range_last::before {
+      right: var(--date-time-cell-horisontal-gap);
+      left: 0;
+      border-radius: 0 var(--visible-height) var(--visible-height) 0;
+    }

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

@@ -0,0 +1,12 @@
+import './DateTimeCell.css';
+import React from 'react';
+import { PropsWithJsxAttributes } from '../../../utils/types/PropsWithJsxAttributes';
+export declare const DateTimeCellPropRange: readonly ["first", "last", true, false];
+export declare type DateTimeCellPropRange = typeof DateTimeCellPropRange[number];
+export declare type DateTimeCellProps = PropsWithJsxAttributes<{
+    range?: DateTimeCellPropRange;
+}, 'div'>;
+export declare const cnDateTimeCell: import("@bem-react/classname").ClassNameFormatter;
+export declare const DateTimeCell: React.ForwardRefExoticComponent<Pick<Pick<{
+    range?: boolean | "first" | "last" | undefined;
+} & Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "css" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "ref" | "key">, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "ref" | "key" | "range">, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "range"> & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,13 @@
+"use strict";
+exports.__esModule = true;
+exports.DateTimeCell = exports.cnDateTimeCell = exports.DateTimeCellPropRange = void 0;
+var tslib_1 = require("tslib");
+require("./DateTimeCell.css");
+var react_1 = tslib_1.__importDefault(require("react"));
+var bem_1 = require("../../../utils/bem");
+exports.DateTimeCellPropRange = ['first', 'last', true, false];
+exports.cnDateTimeCell = bem_1.cn('DateTimeCell');
+exports.DateTimeCell = react_1["default"].forwardRef(function (props, ref) {
+    var range = props.range, children = props.children, className = props.className, otherProps = tslib_1.__rest(props, ["range", "children", "className"]);
+    return (react_1["default"].createElement("div", tslib_1.__assign({}, otherProps, { ref: ref, className: exports.cnDateTimeCell({ range: range }, [className]) }), children));
+});

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

@@ -0,0 +1,16 @@
+/* 
+--date-time-grid-columns 
+--date-time-cell-width
+--date-time-grid-row-gap
+
+задаются сверху
+*/
+
+.DateTimeGrid {
+  display: grid;
+  grid-template-columns: repeat(var(--date-time-grid-columns), var(--date-time-cell-width));
+  grid-row-gap: var(--date-time-grid-row-gap);
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: start;
+}

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

@@ -0,0 +1,16 @@
+import './DateTimeGrid.css';
+import React from 'react';
+import { PropsWithJsxAttributes } from '../../../utils/types/PropsWithJsxAttributes';
+import { DateTimeCellPropRange } from '../DateTimeCell/DateTimeCell';
+import { DateTimeItemProps } from '../DateTimeItem/DateTimeItem';
+declare type Item = string | Omit<DateTimeItemProps & {
+    range?: DateTimeCellPropRange;
+}, 'ref'>;
+export declare type DateTimeGridProps = PropsWithJsxAttributes<{
+    children?: never;
+    items: Item[];
+    itemsRefs?: React.RefObject<HTMLDivElement>[];
+}, 'div'>;
+export declare const cnDateTimeGrid: import("@bem-react/classname").ClassNameFormatter;
+export declare const DateTimeGrid: React.FC<DateTimeGridProps>;
+export {};

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

@@ -0,0 +1,24 @@
+"use strict";
+exports.__esModule = true;
+exports.DateTimeGrid = exports.cnDateTimeGrid = void 0;
+var tslib_1 = require("tslib");
+require("./DateTimeGrid.css");
+var react_1 = tslib_1.__importDefault(require("react"));
+var bem_1 = require("../../../utils/bem");
+var Text_1 = require("../../Text/Text");
+var DateTimeCell_1 = require("../DateTimeCell/DateTimeCell");
+var DateTimeItem_1 = require("../DateTimeItem/DateTimeItem");
+exports.cnDateTimeGrid = bem_1.cn('DateTimeGrid');
+var renderItem = function (item, index, ref) {
+    if (typeof item === 'string') {
+        return (react_1["default"].createElement(DateTimeCell_1.DateTimeCell, { ref: ref, key: exports.cnDateTimeGrid('String', { index: index, item: item }) },
+            react_1["default"].createElement(Text_1.Text, { as: "span", view: "ghost", size: "2xs", transform: "uppercase" }, item)));
+    }
+    var range = item.range, dayProps = tslib_1.__rest(item, ["range"]);
+    return (react_1["default"].createElement(DateTimeCell_1.DateTimeCell, { ref: ref, key: exports.cnDateTimeGrid('Item', { index: index, number: dayProps.label }), range: range },
+        react_1["default"].createElement(DateTimeItem_1.DateTimeItem, tslib_1.__assign({}, dayProps))));
+};
+exports.DateTimeGrid = function (props) {
+    var className = props.className, items = props.items, itemsRefs = props.itemsRefs, otherProps = tslib_1.__rest(props, ["className", "items", "itemsRefs"]);
+    return (react_1["default"].createElement("div", tslib_1.__assign({}, otherProps, { className: exports.cnDateTimeGrid(null, [className]) }), items.map(function (item, index) { return renderItem(item, index, itemsRefs === null || itemsRefs === void 0 ? void 0 : itemsRefs[index]); })));
+};