@consta/uikit 3.2.0 → 3.6.0

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

@@ -0,0 +1,49 @@
+import { __assign, __rest } from "tslib";
+import './DateTime100YearSlider.css';
+import React from 'react';
+import { addYears, format, getDecade } from 'date-fns';
+import ruLocale from 'date-fns/locale/ru';
+import { range } from '../../../utils/array';
+import { cn } from '../../../utils/bem';
+import { endOfCentury, getCentury, startOfCentury } from '../../../utils/date';
+import { DateTimeSlider } from '../DateTimeSlider/DateTimeSlider';
+import { getSliderValueRange } from '../helpers/getSliderValueRange';
+export var cnDateTime100YearSlider = cn('DateTime100YearSlider');
+var isCurrentVisibleCentury = function (currentDate, century) {
+    return getCentury(currentDate) === getCentury(century);
+};
+var isCurrentVisibleDecade = function (currentDate, decade) {
+    return isCurrentVisibleCentury(currentDate, decade) && getDecade(currentDate) === getDecade(decade);
+};
+var getCenturyItems = function (currentVisibleDate, decade, locale) {
+    return range(10).map(function (year) {
+        var yearDate = addYears(decade, year * 10);
+        return {
+            date: yearDate,
+            label: format(yearDate, 'yyyy', { locale: locale }),
+            current: isCurrentVisibleDecade(currentVisibleDate, yearDate)
+        };
+    });
+};
+var getSliderData = function (currentVisibleDate, value, locale) {
+    var currentCentury = startOfCentury(currentVisibleDate);
+    return [
+        addYears(currentCentury, -100),
+        currentCentury,
+        addYears(currentCentury, 100),
+        addYears(currentCentury, 200),
+    ].map(function (date) { return ({
+        label: format(date, 'yyyy', { locale: locale }) + "-" + format(addYears(date, 100), 'yyyy', { locale: locale }),
+        date: date,
+        items: getCenturyItems(currentVisibleDate, date, locale),
+        current: isCurrentVisibleCentury(currentVisibleDate, date),
+        valueRange: getSliderValueRange(date, value, startOfCentury, endOfCentury)
+    }); });
+};
+export var DateTime100YearSlider = function (props) {
+    var currentVisibleDate = props.currentVisibleDate, className = props.className, onChange = props.onChange, value = props.value, _a = props.locale, locale = _a === void 0 ? ruLocale : _a, otherProps = __rest(props, ["currentVisibleDate", "className", "onChange", "value", "locale"]);
+    var handlePrev = function () { return onChange(addYears(currentVisibleDate, -100)); };
+    var handleNext = function () { return onChange(addYears(currentVisibleDate, 100)); };
+    var data = getSliderData(currentVisibleDate, value, locale);
+    return (React.createElement(DateTimeSlider, __assign({ className: cnDateTime100YearSlider(null, [className]), onNext: handleNext, onPrev: handlePrev, data: data, onChange: onChange }, otherProps)));
+};

package/__internal__/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__/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__/src/components/DateTimeCanary/DateTime10YearSlider/DateTime10YearSlider.js

@@ -0,0 +1,48 @@
+import { __assign, __rest } from "tslib";
+import './DateTime10YearSlider.css';
+import React from 'react';
+import { addYears, endOfDecade, format, getDecade, getYear, startOfDecade } from 'date-fns';
+import ruLocale from 'date-fns/locale/ru';
+import { range } from '../../../utils/array';
+import { cn } from '../../../utils/bem';
+import { DateTimeSlider } from '../DateTimeSlider/DateTimeSlider';
+import { getSliderValueRange } from '../helpers/getSliderValueRange';
+export var cnDateTime10YearSlider = cn('DateTime10YearSlider');
+var isCurrentVisibleDecade = function (currentDate, decade) {
+    return getDecade(currentDate) === getDecade(decade);
+};
+var isCurrentVisibleYear = function (currentDate, year) {
+    return isCurrentVisibleDecade(currentDate, year) && getYear(currentDate) === getYear(year);
+};
+var getDecadeItems = function (currentVisibleDate, decade, locale) {
+    return range(10).map(function (year) {
+        var yearDate = addYears(decade, year);
+        return {
+            date: yearDate,
+            label: format(yearDate, 'yyyy', { locale: locale }),
+            current: isCurrentVisibleYear(currentVisibleDate, yearDate)
+        };
+    });
+};
+var getSliderData = function (currentVisibleDate, value, locale) {
+    var currentDecade = startOfDecade(currentVisibleDate);
+    return [
+        addYears(currentDecade, -10),
+        currentDecade,
+        addYears(currentDecade, 10),
+        addYears(currentDecade, 20),
+    ].map(function (date) { return ({
+        label: format(date, 'yyyy', { locale: locale }) + "-" + format(addYears(date, 10), 'yyyy', { locale: locale }),
+        date: date,
+        items: getDecadeItems(currentVisibleDate, date, locale),
+        current: isCurrentVisibleDecade(currentVisibleDate, date),
+        valueRange: getSliderValueRange(date, value, startOfDecade, endOfDecade)
+    }); });
+};
+export var DateTime10YearSlider = function (props) {
+    var currentVisibleDate = props.currentVisibleDate, className = props.className, onChange = props.onChange, value = props.value, _a = props.locale, locale = _a === void 0 ? ruLocale : _a, otherProps = __rest(props, ["currentVisibleDate", "className", "onChange", "value", "locale"]);
+    var handlePrev = function () { return onChange(addYears(currentVisibleDate, -10)); };
+    var handleNext = function () { return onChange(addYears(currentVisibleDate, 10)); };
+    var data = getSliderData(currentVisibleDate, value, locale);
+    return (React.createElement(DateTimeSlider, __assign({ className: cnDateTime10YearSlider(null, [className]), onNext: handleNext, onPrev: handlePrev, data: data, onChange: onChange }, otherProps)));
+};

package/__internal__/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__/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__/src/components/DateTimeCanary/DateTime10Years/DateTime10Years.js

@@ -0,0 +1,10 @@
+import { __assign, __rest } from "tslib";
+import './DateTime10Years.css';
+import React from 'react';
+import { cn } from '../../../utils/bem';
+import { DateTimeGrid } from '../DateTimeGrid/DateTimeGrid';
+export var cnDateTime10Years = cn('DateTime10Years');
+export var DateTime10Years = function (props) {
+    var className = props.className, years = props.years, otherProps = __rest(props, ["className", "years"]);
+    return (React.createElement(DateTimeGrid, __assign({}, otherProps, { className: cnDateTime10Years(null, [className]), items: years })));
+};

package/__internal__/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__/src/components/DateTimeCanary/DateTimeCanary.js

@@ -0,0 +1,22 @@
+import { __assign, __rest } from "tslib";
+import React, { forwardRef } from 'react';
+import { getSizeByMap } from '../../utils/getSizeByMap';
+import { DateTimeTypeDate } from './DateTimeTypeDate/DateTimeTypeDate';
+import { DateTimeTypeDateTime } from './DateTimeTypeDateTime/DateTimeTypeDateTime';
+import { DateTimeTypeMonth } from './DateTimeTypeMonth/DateTimeTypeMonth';
+import { DateTimeTypeTime } from './DateTimeTypeTime/DateTimeTypeTime';
+import { DateTimeTypeYear } from './DateTimeTypeYear/DateTimeTypeYear';
+import { dateTimePropTypeDefault, } from './helpers/types';
+var typeMap = {
+    'date': DateTimeTypeDate,
+    'month': DateTimeTypeMonth,
+    'year': DateTimeTypeYear,
+    'time': DateTimeTypeTime,
+    'date-time': DateTimeTypeDateTime
+};
+export var DateTime = forwardRef(function (props, ref) {
+    var _a = props.type, type = _a === void 0 ? dateTimePropTypeDefault : _a, otherProps = __rest(props, ["type"]);
+    var Component = getSizeByMap(typeMap, type);
+    return React.createElement(Component, __assign({}, otherProps, { ref: ref }));
+});
+export * from './helpers/types';

package/__internal__/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__/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__/src/components/DateTimeCanary/DateTimeCell/DateTimeCell.js

@@ -0,0 +1,10 @@
+import { __assign, __rest } from "tslib";
+import './DateTimeCell.css';
+import React from 'react';
+import { cn } from '../../../utils/bem';
+export var DateTimeCellPropRange = ['first', 'last', true, false];
+export var cnDateTimeCell = cn('DateTimeCell');
+export var DateTimeCell = React.forwardRef(function (props, ref) {
+    var range = props.range, children = props.children, className = props.className, otherProps = __rest(props, ["range", "children", "className"]);
+    return (React.createElement("div", __assign({}, otherProps, { ref: ref, className: cnDateTimeCell({ range: range }, [className]) }), children));
+});

package/__internal__/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__/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__/src/components/DateTimeCanary/DateTimeGrid/DateTimeGrid.js

@@ -0,0 +1,21 @@
+import { __assign, __rest } from "tslib";
+import './DateTimeGrid.css';
+import React from 'react';
+import { cn } from '../../../utils/bem';
+import { Text } from '../../Text/Text';
+import { DateTimeCell } from '../DateTimeCell/DateTimeCell';
+import { DateTimeItem } from '../DateTimeItem/DateTimeItem';
+export var cnDateTimeGrid = cn('DateTimeGrid');
+var renderItem = function (item, index, ref) {
+    if (typeof item === 'string') {
+        return (React.createElement(DateTimeCell, { ref: ref, key: cnDateTimeGrid('String', { index: index, item: item }) },
+            React.createElement(Text, { as: "span", view: "ghost", size: "2xs", transform: "uppercase" }, item)));
+    }
+    var range = item.range, dayProps = __rest(item, ["range"]);
+    return (React.createElement(DateTimeCell, { ref: ref, key: cnDateTimeGrid('Item', { index: index, number: dayProps.label }), range: range },
+        React.createElement(DateTimeItem, __assign({}, dayProps))));
+};
+export var DateTimeGrid = function (props) {
+    var className = props.className, items = props.items, itemsRefs = props.itemsRefs, otherProps = __rest(props, ["className", "items", "itemsRefs"]);
+    return (React.createElement("div", __assign({}, otherProps, { className: cnDateTimeGrid(null, [className]) }), items.map(function (item, index) { return renderItem(item, index, itemsRefs === null || itemsRefs === void 0 ? void 0 : itemsRefs[index]); })));
+};

package/__internal__/src/components/DateTimeCanary/DateTimeItem/DateTimeItem.css

@@ -0,0 +1,105 @@
+/* 
+--date-time-item-width
+--date-time-item-height
+
+задаются сверху
+*/
+
+.DateTimeItem {
+  --item-bg-color: transparent;
+  --item-bg-color-hover: transparent;
+  --item-border-color: var(--color-control-bg-primary);
+  --item-border-color-hover: var(--color-control-bg-primary-hover);
+  --item-event-color: var(--color-control-bg-primary);
+  --item-event-color-hover: var(--color-control-bg-primary-hover);
+  --item-text-color: var(--color-typo-primary);
+  --item-text-color-hover: var(--color-control-bg-primary-hover);
+  --bg-color: var(--item-bg-color);
+  --event-color: var(--item-event-color);
+  --border-color: var(--item-border-color);
+  --text-color: var(--item-text-color);
+  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-item-width);
+  height: var(--date-time-item-height);
+  color: var(--text-color);
+  background: var(--bg-color);
+  border: none;
+  border-radius: calc(var(--date-time-item-height) / 2);
+  font-size: var(--size-text-s);
+  line-height: var(--date-time-item-height);
+  text-transform: capitalize;
+  -webkit-transition: background 0.2s, color 0.2s, -webkit-box-shadow 0.2s;
+  transition: background 0.2s, color 0.2s, -webkit-box-shadow 0.2s;
+  transition: background 0.2s, color 0.2s, box-shadow 0.2s;
+  transition: background 0.2s, color 0.2s, box-shadow 0.2s, -webkit-box-shadow 0.2s;
+}
+
+.DateTimeItem:hover {
+    --bg-color: var(--item-bg-color-hover);
+    --event-color: var(--item-event-color-hover);
+    --border-color: var(--item-border-color-hover);
+    --text-color: var(--item-text-color-hover);
+  }
+
+.DateTimeItem_selected {
+    --item-bg-color: var(--color-control-bg-primary);
+    --item-bg-color-hover: var(--color-control-bg-primary-hover);
+    --item-border-color: transparent;
+    --item-border-color-hover: transparent;
+    --item-event-color: var(--color-control-typo-primary);
+    --item-event-color-hover: var(--color-control-typo-primary);
+    --item-text-color: var(--color-typo-primary);
+    --item-text-color-hover: var(--color-typo-primary);
+  }
+
+.DateTimeItem:not(.DateTimeItem_disabled) {
+    cursor: pointer;
+  }
+
+.DateTimeItem_disabled {
+    --item-bg-color: transparent;
+    --item-bg-color-hover: transparent;
+    --item-border-color: var(--color-control-bg-primary);
+    --item-border-color-hover: var(--color-control-bg-primary);
+    --item-event-color: var(--color-control-typo-disable);
+    --item-event-color-hover: var(--color-control-typo-disable);
+    --item-text-color: var(--color-control-typo-disable);
+    --item-text-color-hover: var(--color-control-typo-disable);
+  }
+
+.DateTimeItem_selected.date-timeItem_disabled {
+    --item-bg-color: var(--color-control-bg-disable);
+    --item-bg-color-hover: var(--color-control-bg-disable);
+    --item-border-color: transparent;
+    --item-border-color-hover: transparent;
+    --item-event-color: var(--color-control-typo-disable);
+    --item-event-color-hover: var(--color-control-typo-disable);
+    --item-text-color: var(--color-control-typo-disable);
+    --item-text-color-hover: var(--color-control-typo-disable);
+  }
+
+.DateTimeItem_event::before {
+      content: '';
+      position: absolute;
+      bottom: var(--space-2xs);
+      width: var(--space-2xs);
+      height: var(--space-2xs);
+      background: var(--event-color);
+      border-radius: 50%;
+      -webkit-transition: background 0.2s;
+      transition: background 0.2s;
+    }
+
+.DateTimeItem_current {
+    -webkit-box-shadow: inset 0 0 0 1.3px var(--border-color);
+            box-shadow: inset 0 0 0 1.3px var(--border-color);
+  }

package/__internal__/src/components/DateTimeCanary/DateTimeItem/DateTimeItem.d.ts

@@ -0,0 +1,22 @@
+import './DateTimeItem.css';
+import React from 'react';
+import { PropsWithJsxAttributes } from '../../../utils/types/PropsWithJsxAttributes';
+export declare type DateTimeItemProps = PropsWithJsxAttributes<{
+    label: number | string;
+    current?: boolean;
+    selected?: boolean;
+    disabled?: boolean;
+    event?: boolean;
+    role?: never;
+    children?: never;
+}, 'button'>;
+export declare const cnDateTimeItem: import("@bem-react/classname").ClassNameFormatter;
+export declare const DateTimeItem: React.ForwardRefExoticComponent<Pick<Pick<{
+    label: number | string;
+    current?: boolean | undefined;
+    selected?: boolean | undefined;
+    disabled?: boolean | undefined;
+    event?: boolean | undefined;
+    role?: undefined;
+    children?: undefined;
+} & Pick<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "css" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "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" | "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" | "form" | "key" | "name" | "type" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value">, "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" | "form" | "label" | "key" | "name" | "type" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value" | "selected" | "current" | "event">, "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" | "form" | "label" | "key" | "name" | "type" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value" | "selected" | "current" | "event"> & React.RefAttributes<HTMLButtonElement>>;

package/__internal__/src/components/DateTimeCanary/DateTimeItem/DateTimeItem.js

@@ -0,0 +1,16 @@
+import { __assign, __rest } from "tslib";
+import './DateTimeItem.css';
+import React, { forwardRef } from 'react';
+import { classnames } from '@bem-react/classnames';
+import { cnMixFocus } from '../../../mixs/MixFocus/MixFocus';
+import { cn } from '../../../utils/bem';
+import { useTheme } from '../../Theme/Theme';
+export var cnDateTimeItem = cn('DateTimeItem');
+export var DateTimeItem = forwardRef(function (props, ref) {
+    var label = props.label, current = props.current, selected = props.selected, event = props.event, disabled = props.disabled, otherProps = __rest(props, ["label", "current", "selected", "event", "disabled"]);
+    var themeClassNames = useTheme().themeClassNames;
+    var className = selected && !disabled
+        ? classnames(props.className, themeClassNames.color.accent)
+        : props.className;
+    return (React.createElement("button", __assign({}, otherProps, { ref: ref, className: cnDateTimeItem({ event: event, current: current, disabled: disabled, selected: selected }, [className, cnMixFocus()]), type: "button", disabled: disabled }), label));
+});

package/__internal__/src/components/DateTimeCanary/DateTimeLabel/DateTimeLabel.css

@@ -0,0 +1,3 @@
+.DateTimeLabel {
+  text-transform: capitalize;
+}

package/__internal__/src/components/DateTimeCanary/DateTimeLabel/DateTimeLabel.d.ts

@@ -0,0 +1,11 @@
+import './DateTimeLabel.css';
+import React from 'react';
+import { PropsWithHTMLAttributes } from '../../../utils/types/PropsWithHTMLAttributes';
+export declare type DateTimeLabelProps = PropsWithHTMLAttributes<{
+    label: string | number;
+    align?: 'left' | 'center' | 'right';
+    children?: never;
+    cursor?: 'pointer';
+}, HTMLDivElement>;
+export declare const cnDateTimeLabel: import("@bem-react/classname").ClassNameFormatter;
+export declare const DateTimeLabel: React.FC<DateTimeLabelProps>;

package/__internal__/src/components/DateTimeCanary/DateTimeLabel/DateTimeLabel.js

@@ -0,0 +1,10 @@
+import { __assign, __rest } from "tslib";
+import './DateTimeLabel.css';
+import React from 'react';
+import { cn } from '../../../utils/bem';
+import { Text } from '../../Text/Text';
+export var cnDateTimeLabel = cn('DateTimeLabel');
+export var DateTimeLabel = function (props) {
+    var label = props.label, className = props.className, align = props.align, cursor = props.cursor, otherProps = __rest(props, ["label", "className", "align", "cursor"]);
+    return (React.createElement(Text, __assign({}, otherProps, { className: cnDateTimeLabel(null, [className]), as: "span", size: "s", align: align, weight: "bold", cursor: cursor }), label));
+};

package/__internal__/src/components/DateTimeCanary/DateTimeMonth/DateTimeMonth.css

@@ -0,0 +1,14 @@
+.DateTimeMonth {
+  --date-time-item-width: var(--control-height-s);
+  --date-time-item-height: var(--control-height-s);
+  --date-time-cell-vertical-gap: var(--space-3xs);
+  --date-time-cell-horisontal-gap: var(--space-3xs);
+  --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: 7;
+  --date-time-grid-row-gap: 0;
+}

package/__internal__/src/components/DateTimeCanary/DateTimeMonth/DateTimeMonth.d.ts

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