@skbkontur/react-ui 5.6.5-cab54.0 → 5.6.5

package/components/DatePicker/DatePicker/DatePicker.js

@@ -0,0 +1,375 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+var _dec, _class, _DatePicker;
+import React from 'react';
+import { Popup } from "../../../internal/Popup";
+import { LocaleContext } from "../../../lib/locale";
+import { locale } from "../../../lib/locale/decorators";
+import { InternalDateGetter } from "../../../lib/date/InternalDateGetter";
+import { ArrowAUpIcon16Light } from "../../../internal/icons2022/ArrowAUpIcon/ArrowAUp16Light";
+import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
+import { InternalDate } from "../../../lib/date/InternalDate";
+import { MAX_FULLDATE, MIN_FULLDATE } from "../../../lib/date/constants";
+import { InternalDateOrder, InternalDateSeparator, InternalDateValidateCheck } from "../../../lib/date/types";
+import { DateInput } from "../../DateInput";
+import { filterProps } from "../../../lib/filterProps";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { isMobile } from "../../../lib/client";
+import { NativeDateInput } from "../../../internal/NativeDateInput";
+import { getRootNode, rootNode } from "../../../lib/rootNode";
+import { isNonNullable } from "../../../lib/utils";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { Calendar } from "../../Calendar";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { Button } from "../../Button";
+import { getTodayDate } from "../../Calendar/CalendarUtils";
+import { responsiveLayout } from "../../ResponsiveLayout/decorator";
+import { getMenuPositions } from "../../../lib/getMenuPositions";
+import { ZIndex } from "../../../internal/ZIndex";
+import { styles } from "../DatePicker.styles";
+import { DatePickerLocaleHelper } from "../locale";
+import { MobilePicker } from "../MobilePicker";
+var INPUT_PASS_PROPS = {
+  autoFocus: true,
+  disabled: true,
+  warning: true,
+  error: true,
+  size: true,
+  onKeyDown: true
+};
+export var MIN_WIDTH = 120;
+export var DatePickerDataTids = {
+  root: 'DatePicker__root',
+  input: 'DatePicker__input',
+  label: 'DatePicker__label',
+  pickerRoot: 'Picker__root',
+  pickerTodayWrapper: 'Picker__todayWrapper'
+};
+
+/**
+ * Поле `DatePicker` помогает вводить дату с клавиатуры или выбирать ее с помощью мыши.
+ *
+ * Используйте поле с датой, когда нужно ввести дату в формате ДД.ММ.ГГГГ.
+ *
+ * Поле с датой отличается от обычного поля ввода наличием иконки, маски и блока календаря.
+ */
+export var DatePicker = (_dec = locale('DatePicker', DatePickerLocaleHelper), responsiveLayout(_class = rootNode(_class = _dec(_class = (_DatePicker = /*#__PURE__*/function (_React$PureComponent) {
+  function DatePicker() {
+    var _this;
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(DatePicker.defaultProps);
+    _this.canOpenPopup = true;
+    _this.state = {
+      opened: false,
+      canUseMobileNativeDatePicker: false,
+      today: getTodayDate()
+    };
+    _this.input = null;
+    _this.focused = false;
+    _this.renderMain = function (props) {
+      var picker = null;
+      var _this$getProps = _this.getProps(),
+        minDate = _this$getProps.minDate,
+        maxDate = _this$getProps.maxDate,
+        menuPos = _this$getProps.menuPos,
+        menuAlign = _this$getProps.menuAlign;
+      var isMobile = _this.isMobileLayout;
+      if (_this.state.opened) {
+        if (isMobile) {
+          picker = /*#__PURE__*/
+          React.createElement(MobilePicker, {
+            value: _this.props.value,
+            minDate: _this.parseValueToDate(minDate),
+            maxDate: _this.parseValueToDate(maxDate),
+            onValueChange: _this.props.onValueChange,
+            enableTodayLink: _this.props.enableTodayLink,
+            isHoliday: _this.props.isHoliday,
+            onCloseRequest: _this.handleMobileCloseRequest,
+            renderDay: props.renderDay,
+            onMonthChange: props.onMonthChange
+          });
+        } else {
+          picker = /*#__PURE__*/
+          React.createElement(LocaleContext.Provider, {
+            value: {
+              locale: {
+                Calendar: {
+                  months: _this.locale.months,
+                  dayCellChooseDateAriaLabel: _this.locale.dayCellChooseDateAriaLabel,
+                  selectMonthAriaLabel: _this.locale.selectMonthAriaLabel,
+                  selectYearAriaLabel: _this.locale.selectYearAriaLabel,
+                  selectChosenAriaLabel: _this.locale.selectChosenAriaLabel
+                }
+              }
+            }
+          }, /*#__PURE__*/
+
+          React.createElement(Popup, {
+            opened: true,
+            hasShadow: true,
+            priority: ZIndex.priorities.PopupMenu,
+            positions: getMenuPositions(menuPos, menuAlign),
+            "data-tid": DatePickerDataTids.root,
+            anchorElement: _this.getParent(),
+            margin: parseInt(_this.theme.datePickerMenuOffsetY)
+          }, /*#__PURE__*/
+
+          React.createElement("div", {
+            "data-tid": DatePickerDataTids.pickerRoot,
+            className: styles.calendarWrapper(_this.theme),
+            onMouseDown: function onMouseDown(e) {
+              return e.preventDefault();
+            }
+          }, /*#__PURE__*/
+
+          React.createElement(Calendar, {
+            maxDate: _this.parseValueToDate(maxDate),
+            minDate: _this.parseValueToDate(minDate),
+            onValueChange: _this.handleValueChange,
+            isHoliday: _this.props.isHoliday,
+            value: _this.parseValueToDate(_this.props.value),
+            renderDay: _this.props.renderDay,
+            onMonthChange: _this.props.onMonthChange
+          }), _this.props.enableTodayLink && _this.renderTodayLink(), ' ')));
+        }
+      }
+      return /*#__PURE__*/(
+        React.createElement("label", {
+          className: styles.root(),
+          style: _this.getRootStyle(),
+          onMouseEnter: _this.props.onMouseEnter,
+          onMouseLeave: _this.props.onMouseLeave,
+          onMouseOver: _this.props.onMouseOver,
+          "data-tid": DatePickerDataTids.label
+        }, /*#__PURE__*/
+
+        React.createElement(DateInput, _extends({
+          id: _this.props.id
+        }, filterProps(props, INPUT_PASS_PROPS), {
+          ref: _this.getInputRef,
+          value: _this.props.value || '',
+          width: "100%",
+          withIcon: true,
+          minDate: minDate,
+          maxDate: maxDate,
+          onBlur: isMobile ? undefined : _this.handleBlur,
+          onFocus: _this.handleFocus,
+          onValueChange: _this.props.onValueChange,
+          onClick: _this.openPickerPopup,
+          onKeyDown: _this.handleKeyDown,
+          "data-tid": DatePickerDataTids.input
+        })), _this.state.canUseMobileNativeDatePicker ? /*#__PURE__*/
+        React.createElement(NativeDateInput, {
+          onValueChange: _this.props.onValueChange,
+          value: _this.props.value || '',
+          minDate: minDate,
+          maxDate: maxDate,
+          disabled: _this.props.disabled
+        }) : picker)
+      );
+    };
+    _this.getParent = function () {
+      return getRootNode(_this);
+    };
+    _this.getRootStyle = function () {
+      var width = _this.props.width;
+      return isNonNullable(width) ? {
+        width: width
+      } : {
+        minWidth: MIN_WIDTH
+      };
+    };
+    _this.getInputRef = function (ref) {
+      _this.input = ref;
+    };
+    _this.openPickerPopup = function () {
+      _this.setState({
+        opened: true
+      });
+    };
+    _this.handleFocus = function () {
+      if (_this.focused) {
+        return;
+      }
+      if (!_this.canOpenPopup) {
+        _this.canOpenPopup = true;
+      } else {
+        _this.openPickerPopup();
+      }
+      _this.focused = true;
+      if (_this.props.onFocus) {
+        _this.props.onFocus();
+      }
+    };
+    _this.handleKeyDown = function (e) {
+      if (!_this.state.opened) {
+        _this.openPickerPopup();
+      }
+      if (_this.props.onKeyDown) {
+        _this.props.onKeyDown(e);
+      }
+    };
+    _this.handleBlur = function () {
+      if (!_this.focused) {
+        return;
+      }
+      _this.focused = false;
+      _this.close();
+      if (_this.props.onBlur) {
+        _this.props.onBlur();
+      }
+    };
+    _this.handleValueChange = function (value) {
+      _this.handleSelect(value);
+      _this.blur();
+    };
+    _this.handleSelect = function (value) {
+      if (!value) {
+        return null;
+      }
+      if (_this.props.onValueChange) {
+        _this.props.onValueChange(value);
+      }
+    };
+    _this.handleMobileCloseRequest = function () {
+      _this.close();
+    };
+    return _this;
+  }
+  _inheritsLoose(DatePicker, _React$PureComponent);
+  var _proto = DatePicker.prototype;
+  _proto.componentDidMount = function componentDidMount() {
+    if (this.props.useMobileNativeDatePicker && isMobile) {
+      this.setState({
+        canUseMobileNativeDatePicker: true
+      });
+    }
+    if (this.props.autoFocus) {
+      this.focus();
+    }
+  };
+  _proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
+    var disabled = this.props.disabled;
+    var opened = this.state.opened;
+    if (disabled && opened) {
+      this.close();
+    }
+    if (prevState.opened && !opened && this.isMobileLayout) {
+      this.handleBlur();
+    }
+  } /**
+    * @public
+    */;
+  _proto.blur = function blur() {
+    if (this.input) {
+      this.input.blur();
+    }
+    this.handleBlur();
+  } /**
+    * @public
+    */;
+  _proto.focus = function focus(opts) {
+    if (this.props.disabled) {
+      return;
+    }
+    if (opts != null && opts.withoutOpenDropdown) {
+      this.canOpenPopup = false;
+    }
+    if (this.input) {
+      this.input.focus();
+    }
+  } /**
+    * Закрывает выпадашку выбора дня
+    * @public
+    */;
+  _proto.close = function close() {
+    this.setState({
+      opened: false
+    });
+  };
+  _proto.render = function render() {
+    var _this2 = this;
+    return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
+      _this2.theme = theme;
+      return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
+        value: ThemeFactory.create({
+          calendarBottomSeparatorBorder: 'none'
+        }, theme)
+      }, /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+        rootNodeRef: _this2.setRootNode
+      }, _this2.getProps()), _this2.renderMain));
+    });
+  };
+  _proto.parseValueToDate = function parseValueToDate(value) {
+    if (value === undefined || value === null) {
+      return undefined;
+    }
+    var date = new InternalDate({
+      value: value
+    });
+    if (date.validate({
+      checks: [InternalDateValidateCheck.NotNull, InternalDateValidateCheck.Native]
+    })) {
+      return date.toString({
+        withPad: true
+      });
+    }
+    return undefined;
+  };
+  _proto.renderTodayLink = function renderTodayLink() {
+    var _this3 = this;
+    var _this$locale = this.locale,
+      order = _this$locale.order,
+      separator = _this$locale.separator;
+    var today = new InternalDate({
+      order: order,
+      separator: separator
+    }).setComponents(InternalDateGetter.getTodayComponents()).toString({
+      withPad: true,
+      withSeparator: true
+    });
+    return /*#__PURE__*/React.createElement("div", {
+      style: {
+        margin: 8
+      }
+    }, /*#__PURE__*/React.createElement(Button, {
+      "aria-label": this.locale.todayAriaLabel,
+      "data-tid": DatePickerDataTids.pickerTodayWrapper,
+      width: "100%",
+      onClick: function onClick() {
+        _this3.handleSelect(today);
+      },
+      icon: /*#__PURE__*/React.createElement(ArrowAUpIcon16Light, null)
+    }, this.locale.today));
+  };
+  return DatePicker;
+}(React.PureComponent), _DatePicker.__KONTUR_REACT_UI__ = 'DatePicker', _DatePicker.displayName = 'DatePicker', _DatePicker.defaultProps = {
+  minDate: MIN_FULLDATE,
+  maxDate: MAX_FULLDATE
+}, _DatePicker.validate = function (value, range) {
+  if (range === void 0) {
+    range = {};
+  }
+  if (!value) {
+    return false;
+  }
+  var _range = range,
+    _range$minDate = _range.minDate,
+    minDate = _range$minDate === void 0 ? MIN_FULLDATE : _range$minDate,
+    _range$maxDate = _range.maxDate,
+    maxDate = _range$maxDate === void 0 ? MAX_FULLDATE : _range$maxDate;
+  var internalDate = new InternalDate({
+    order: InternalDateOrder.DMY,
+    separator: InternalDateSeparator.Dot
+  }).setRangeStart(new InternalDate({
+    value: minDate
+  })).setRangeEnd(new InternalDate({
+    value: maxDate
+  })).parseValue(value);
+  return internalDate.validate({
+    checks: [InternalDateValidateCheck.NotNull, InternalDateValidateCheck.Number, InternalDateValidateCheck.Native, InternalDateValidateCheck.Limits, InternalDateValidateCheck.Range]
+  });
+}, _DatePicker)) || _class) || _class) || _class);

package/components/DatePicker/DatePicker/DatePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Popup","LocaleContext","locale","InternalDateGetter","ArrowAUpIcon16Light","ThemeFactory","InternalDate","MAX_FULLDATE","MIN_FULLDATE","InternalDateOrder","InternalDateSeparator","InternalDateValidateCheck","DateInput","filterProps","CommonWrapper","isMobile","NativeDateInput","getRootNode","rootNode","isNonNullable","createPropsGetter","Calendar","ThemeContext","Button","getTodayDate","responsiveLayout","getMenuPositions","ZIndex","styles","DatePickerLocaleHelper","MobilePicker","INPUT_PASS_PROPS","autoFocus","disabled","warning","error","size","onKeyDown","MIN_WIDTH","DatePickerDataTids","root","input","label","pickerRoot","pickerTodayWrapper","DatePicker","_dec","_class","_DatePicker","_React$PureComponent","_this","_len","arguments","length","args","Array","_key","call","apply","concat","getProps","defaultProps","canOpenPopup","state","opened","canUseMobileNativeDatePicker","today","focused","renderMain","props","picker","_this$getProps","minDate","maxDate","menuPos","menuAlign","isMobileLayout","createElement","value","parseValueToDate","onValueChange","enableTodayLink","isHoliday","onCloseRequest","handleMobileCloseRequest","renderDay","onMonthChange","Provider","months","dayCellChooseDateAriaLabel","selectMonthAriaLabel","selectYearAriaLabel","selectChosenAriaLabel","hasShadow","priority","priorities","PopupMenu","positions","anchorElement","getParent","margin","parseInt","theme","datePickerMenuOffsetY","className","calendarWrapper","onMouseDown","e","preventDefault","handleValueChange","renderTodayLink","style","getRootStyle","onMouseEnter","onMouseLeave","onMouseOver","_extends","id","ref","getInputRef","width","withIcon","onBlur","undefined","handleBlur","onFocus","handleFocus","onClick","openPickerPopup","handleKeyDown","minWidth","setState","close","handleSelect","blur","_inheritsLoose","_proto","prototype","componentDidMount","useMobileNativeDatePicker","focus","componentDidUpdate","prevProps","prevState","opts","withoutOpenDropdown","render","_this2","Consumer","create","calendarBottomSeparatorBorder","rootNodeRef","setRootNode","date","validate","checks","NotNull","Native","toString","withPad","_this3","_this$locale","order","separator","setComponents","getTodayComponents","withSeparator","todayAriaLabel","icon","PureComponent","__KONTUR_REACT_UI__","displayName","range","_range","_range$minDate","_range$maxDate","internalDate","DMY","Dot","setRangeStart","setRangeEnd","parseValue","Number","Limits","Range"],"sources":["DatePicker.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport React from 'react';\n\nimport { Popup } from '../../internal/Popup';\nimport { LocaleContext } from '../../lib/locale';\nimport { locale } from '../../lib/locale/decorators';\nimport { InternalDateGetter } from '../../lib/date/InternalDateGetter';\nimport { ArrowAUpIcon16Light } from '../../internal/icons2022/ArrowAUpIcon/ArrowAUp16Light';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { InternalDate } from '../../lib/date/InternalDate';\nimport { MAX_FULLDATE, MIN_FULLDATE } from '../../lib/date/constants';\nimport { InternalDateOrder, InternalDateSeparator, InternalDateValidateCheck } from '../../lib/date/types';\nimport type { Nullable } from '../../typings/utility-types';\nimport { DateInput } from '../DateInput';\nimport { filterProps } from '../../lib/filterProps';\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport { isMobile } from '../../lib/client';\nimport { NativeDateInput } from '../../internal/NativeDateInput';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getRootNode, rootNode } from '../../lib/rootNode';\nimport { isNonNullable } from '../../lib/utils';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport type { CalendarDateShape, CalendarProps } from '../Calendar';\nimport { Calendar } from '../Calendar';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { Button } from '../Button';\nimport { getTodayDate } from '../Calendar/CalendarUtils';\nimport type { SizeProp } from '../../lib/types/props';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { getMenuPositions } from '../../lib/getMenuPositions';\nimport { ZIndex } from '../../internal/ZIndex';\n\nimport { styles } from './DatePicker.styles';\nimport type { DatePickerLocale } from './locale';\nimport { DatePickerLocaleHelper } from './locale';\nimport { MobilePicker } from './MobilePicker';\n\nconst INPUT_PASS_PROPS = {\n  autoFocus: true,\n  disabled: true,\n  warning: true,\n  error: true,\n  size: true,\n  onKeyDown: true,\n};\n\nexport const MIN_WIDTH = 120;\n\nexport interface DatePickerProps\n  extends Pick<CalendarProps, 'isHoliday' | 'minDate' | 'maxDate' | 'renderDay' | 'onMonthChange'>,\n    Pick<HTMLAttributes<HTMLElement>, 'id'>,\n    CommonProps {\n  /** Устанавливает фокус на контроле после окончания загрузки страницы. */\n\n  autoFocus?: boolean;\n\n  /** Делает компонент недоступным. */\n  disabled?: boolean;\n\n  /** Отображает кнопку \"Сегодня\" в календаре. */\n  enableTodayLink?: boolean;\n\n  /** Переводит контрол в состояние валидации \"ошибка\". */\n  error?: boolean;\n\n  /** Задает nекущую позицию выпадающего окна вручную. */\n  menuPos?: 'top' | 'bottom';\n\n  /** Задает выравнивание меню. */\n  menuAlign?: 'left' | 'right';\n\n  /** Задает размер контрола. */\n  size?: SizeProp;\n\n  /**\n   * Строка формата `dd.mm.yyyy`\n   * Задает значение автокомплита.\n   */\n  value?: string | null;\n\n  /** Переводит контрол в состояние валидации \"предупреждение\". */\n  warning?: boolean;\n\n  /** Задает ширину автокомплита. */\n  width?: number | string;\n\n  /** Задает функцию, которая вызывается при потере датапикером фокуса. */\n  onBlur?: () => void;\n\n  /** Задает функцию, вызывающуюся при изменении value.\n   * @param value - строка в формате `dd.mm.yyyy`. */\n  onValueChange: (value: string) => void;\n\n  /** Задает функцию, которая вызывается при получении датапикером фокуса. */\n  onFocus?: () => void;\n\n  /** Задает функцию, которая вызывается при нажатии кнопки на клавиатуре. */\n  onKeyDown?: (e: React.KeyboardEvent<any>) => void;\n\n  /** Задает функцию, которая вызывается при наведении мышкой (событие `onmouseenter`). См разницу с onMouseOver в [документации](https://learn.javascript.ru/mousemove-mouseover-mouseout-mouseenter-mouseleave)  */\n  onMouseEnter?: (e: React.MouseEvent<any>) => void;\n\n  /** Задает функцию, которая вызывается при уходе мышки с объекта (событие `onmouseleave`). */\n  onMouseLeave?: (e: React.MouseEvent<any>) => void;\n\n  /** Задает функцию, которая вызывается при наведении мышкой (событие `onmouseover`). */\n  onMouseOver?: (e: React.MouseEvent<any>) => void;\n\n  /** Позволяет использовать на мобильных устройствах нативный календарь для выбора дат.\n   * На iOS нативный календарь не умеет работать с minDate и maxDate. */\n  useMobileNativeDatePicker?: boolean;\n}\n\nexport interface DatePickerState {\n  opened: boolean;\n  canUseMobileNativeDatePicker: boolean;\n  today: CalendarDateShape;\n}\n\nexport const DatePickerDataTids = {\n  root: 'DatePicker__root',\n  input: 'DatePicker__input',\n  label: 'DatePicker__label',\n  pickerRoot: 'Picker__root',\n  pickerTodayWrapper: 'Picker__todayWrapper',\n} as const;\n\ntype DefaultProps = Required<Pick<DatePickerProps, 'minDate' | 'maxDate'>>;\n\n/**\n * Поле `DatePicker` помогает вводить дату с клавиатуры или выбирать ее с помощью мыши.\n *\n * Используйте поле с датой, когда нужно ввести дату в формате ДД.ММ.ГГГГ.\n *\n * Поле с датой отличается от обычного поля ввода наличием иконки, маски и блока календаря.\n */\n@responsiveLayout\n@rootNode\n@locale('DatePicker', DatePickerLocaleHelper)\nexport class DatePicker extends React.PureComponent<DatePickerProps, DatePickerState> {\n  public static __KONTUR_REACT_UI__ = 'DatePicker';\n  public static displayName = 'DatePicker';\n\n  public static defaultProps: DefaultProps = {\n    minDate: MIN_FULLDATE,\n    maxDate: MAX_FULLDATE,\n  };\n\n  private getProps = createPropsGetter(DatePicker.defaultProps);\n  private theme!: Theme;\n  private readonly locale!: DatePickerLocale;\n  private canOpenPopup = true;\n\n  public static validate = (value: Nullable<string>, range: { minDate?: string; maxDate?: string } = {}) => {\n    if (!value) {\n      return false;\n    }\n\n    const { minDate = MIN_FULLDATE, maxDate = MAX_FULLDATE } = range;\n    const internalDate = new InternalDate({\n      order: InternalDateOrder.DMY,\n      separator: InternalDateSeparator.Dot,\n    })\n      .setRangeStart(new InternalDate({ value: minDate }))\n      .setRangeEnd(new InternalDate({ value: maxDate }))\n      .parseValue(value);\n\n    return internalDate.validate({\n      checks: [\n        InternalDateValidateCheck.NotNull,\n        InternalDateValidateCheck.Number,\n        InternalDateValidateCheck.Native,\n        InternalDateValidateCheck.Limits,\n        InternalDateValidateCheck.Range,\n      ],\n    });\n  };\n\n  public state: DatePickerState = { opened: false, canUseMobileNativeDatePicker: false, today: getTodayDate() };\n\n  private input: DateInput | null = null;\n  private focused = false;\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private isMobileLayout!: boolean;\n\n  public componentDidMount() {\n    if (this.props.useMobileNativeDatePicker && isMobile) {\n      this.setState({\n        canUseMobileNativeDatePicker: true,\n      });\n    }\n    if (this.props.autoFocus) {\n      this.focus();\n    }\n  }\n\n  public componentDidUpdate(prevProps: DatePickerProps, prevState: DatePickerState) {\n    const { disabled } = this.props;\n    const { opened } = this.state;\n    if (disabled && opened) {\n      this.close();\n    }\n\n    if (prevState.opened && !opened && this.isMobileLayout) {\n      this.handleBlur();\n    }\n  }\n\n  /**\n   * @public\n   */\n  public blur() {\n    if (this.input) {\n      this.input.blur();\n    }\n    this.handleBlur();\n  }\n\n  /**\n   * @public\n   */\n  public focus(opts?: { withoutOpenDropdown?: boolean }) {\n    if (this.props.disabled) {\n      return;\n    }\n\n    if (opts?.withoutOpenDropdown) {\n      this.canOpenPopup = false;\n    }\n\n    if (this.input) {\n      this.input.focus();\n    }\n  }\n\n  /**\n   * Закрывает выпадашку выбора дня\n   * @public\n   */\n  public close() {\n    this.setState({ opened: false });\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n\n          return (\n            <ThemeContext.Provider value={ThemeFactory.create({ calendarBottomSeparatorBorder: 'none' }, theme)}>\n              <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n                {this.renderMain}\n              </CommonWrapper>\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain = (props: CommonWrapperRestProps<DatePickerProps>) => {\n    let picker = null;\n\n    const { minDate, maxDate, menuPos, menuAlign } = this.getProps();\n\n    const isMobile = this.isMobileLayout;\n\n    if (this.state.opened) {\n      if (isMobile) {\n        picker = (\n          <MobilePicker\n            value={this.props.value}\n            minDate={this.parseValueToDate(minDate)}\n            maxDate={this.parseValueToDate(maxDate)}\n            onValueChange={this.props.onValueChange}\n            enableTodayLink={this.props.enableTodayLink}\n            isHoliday={this.props.isHoliday}\n            onCloseRequest={this.handleMobileCloseRequest}\n            renderDay={props.renderDay}\n            onMonthChange={props.onMonthChange}\n          />\n        );\n      } else {\n        picker = (\n          <LocaleContext.Provider\n            value={{\n              locale: {\n                Calendar: {\n                  months: this.locale.months,\n                  dayCellChooseDateAriaLabel: this.locale.dayCellChooseDateAriaLabel,\n                  selectMonthAriaLabel: this.locale.selectMonthAriaLabel,\n                  selectYearAriaLabel: this.locale.selectYearAriaLabel,\n                  selectChosenAriaLabel: this.locale.selectChosenAriaLabel,\n                },\n              },\n            }}\n          >\n            <Popup\n              opened\n              hasShadow\n              priority={ZIndex.priorities.PopupMenu}\n              positions={getMenuPositions(menuPos, menuAlign)}\n              data-tid={DatePickerDataTids.root}\n              anchorElement={this.getParent()}\n              margin={parseInt(this.theme.datePickerMenuOffsetY)}\n            >\n              <div\n                data-tid={DatePickerDataTids.pickerRoot}\n                className={styles.calendarWrapper(this.theme)}\n                onMouseDown={(e) => e.preventDefault()}\n              >\n                <Calendar\n                  maxDate={this.parseValueToDate(maxDate)}\n                  minDate={this.parseValueToDate(minDate)}\n                  onValueChange={this.handleValueChange}\n                  isHoliday={this.props.isHoliday}\n                  value={this.parseValueToDate(this.props.value)}\n                  renderDay={this.props.renderDay}\n                  onMonthChange={this.props.onMonthChange}\n                />\n                {this.props.enableTodayLink && this.renderTodayLink()}{' '}\n              </div>\n            </Popup>\n          </LocaleContext.Provider>\n        );\n      }\n    }\n    return (\n      <label\n        className={styles.root()}\n        style={this.getRootStyle()}\n        onMouseEnter={this.props.onMouseEnter}\n        onMouseLeave={this.props.onMouseLeave}\n        onMouseOver={this.props.onMouseOver}\n        data-tid={DatePickerDataTids.label}\n      >\n        <DateInput\n          id={this.props.id}\n          {...filterProps(props, INPUT_PASS_PROPS)}\n          ref={this.getInputRef}\n          value={this.props.value || ''}\n          width=\"100%\"\n          withIcon\n          minDate={minDate}\n          maxDate={maxDate}\n          onBlur={isMobile ? undefined : this.handleBlur}\n          onFocus={this.handleFocus}\n          onValueChange={this.props.onValueChange}\n          onClick={this.openPickerPopup}\n          onKeyDown={this.handleKeyDown}\n          data-tid={DatePickerDataTids.input}\n        />\n        {this.state.canUseMobileNativeDatePicker ? (\n          <NativeDateInput\n            onValueChange={this.props.onValueChange}\n            value={this.props.value || ''}\n            minDate={minDate}\n            maxDate={maxDate}\n            disabled={this.props.disabled}\n          />\n        ) : (\n          picker\n        )}\n      </label>\n    );\n  };\n\n  private parseValueToDate(value?: Nullable<string>): string | undefined {\n    if (value === undefined || value === null) {\n      return undefined;\n    }\n\n    const date = new InternalDate({ value });\n    if (date.validate({ checks: [InternalDateValidateCheck.NotNull, InternalDateValidateCheck.Native] })) {\n      return date.toString({ withPad: true });\n    }\n\n    return undefined;\n  }\n\n  private renderTodayLink() {\n    const { order, separator } = this.locale;\n    const today = new InternalDate({ order, separator })\n      .setComponents(InternalDateGetter.getTodayComponents())\n      .toString({ withPad: true, withSeparator: true });\n\n    return (\n      <div style={{ margin: 8 }}>\n        <Button\n          aria-label={this.locale.todayAriaLabel}\n          data-tid={DatePickerDataTids.pickerTodayWrapper}\n          width=\"100%\"\n          onClick={() => {\n            this.handleSelect(today);\n          }}\n          icon={<ArrowAUpIcon16Light />}\n        >\n          {this.locale.today}\n        </Button>\n      </div>\n    );\n  }\n\n  public getParent = () => {\n    return getRootNode(this);\n  };\n\n  private getRootStyle = () => {\n    const { width } = this.props;\n    return isNonNullable(width) ? { width } : { minWidth: MIN_WIDTH };\n  };\n\n  private getInputRef = (ref: DateInput | null) => {\n    this.input = ref;\n  };\n\n  private openPickerPopup = () => {\n    this.setState({ opened: true });\n  };\n\n  private handleFocus = () => {\n    if (this.focused) {\n      return;\n    }\n\n    if (!this.canOpenPopup) {\n      this.canOpenPopup = true;\n    } else {\n      this.openPickerPopup();\n    }\n\n    this.focused = true;\n\n    if (this.props.onFocus) {\n      this.props.onFocus();\n    }\n  };\n\n  private handleKeyDown = (e: React.KeyboardEvent) => {\n    if (!this.state.opened) {\n      this.openPickerPopup();\n    }\n\n    if (this.props.onKeyDown) {\n      this.props.onKeyDown(e);\n    }\n  };\n\n  private handleBlur = () => {\n    if (!this.focused) {\n      return;\n    }\n\n    this.focused = false;\n    this.close();\n\n    if (this.props.onBlur) {\n      this.props.onBlur();\n    }\n  };\n\n  private handleValueChange = (value: string) => {\n    this.handleSelect(value);\n    this.blur();\n  };\n\n  private handleSelect = (value: string | null) => {\n    if (!value) {\n      return null;\n    }\n\n    if (this.props.onValueChange) {\n      this.props.onValueChange(value);\n    }\n  };\n\n  private handleMobileCloseRequest = () => {\n    this.close();\n  };\n}\n"],"mappings":"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","ignoreList":[]}

package/components/DatePicker/DatePicker/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/DatePicker/DatePicker.js",
+  "module": "DatePicker",
+  "types": "../DatePicker.d.ts",
+  "sideEffects": false
+}

package/components/DatePicker/DatePicker.d.ts

@@ -1,10 +1,10 @@
 import type { HTMLAttributes } from 'react';
 import React from 'react';
-import type { Nullable } from '../../typings/utility-types.js';
-import type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper/index.js';
-import type { TGetRootNode } from '../../lib/rootNode/index.js';
-import type { CalendarDateShape, CalendarProps } from '../Calendar/index.js';
-import type { SizeProp } from '../../lib/types/props.js';
+import type { Nullable } from '../../typings/utility-types';
+import type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';
+import type { TGetRootNode } from '../../lib/rootNode';
+import type { CalendarDateShape, CalendarProps } from '../Calendar';
+import type { SizeProp } from '../../lib/types/props';
 export declare const MIN_WIDTH = 120;
 export interface DatePickerProps extends Pick<CalendarProps, 'isHoliday' | 'minDate' | 'maxDate' | 'renderDay' | 'onMonthChange'>, Pick<HTMLAttributes<HTMLElement>, 'id'>, CommonProps {
     /** Устанавливает фокус на контроле после окончания загрузки страницы. */
@@ -74,14 +74,12 @@ export declare class DatePicker extends React.PureComponent<DatePickerProps, Dat
     static displayName: string;
     static defaultProps: DefaultProps;
     private getProps;
-    private emotion;
-    private styles;
     private theme;
     private readonly locale;
     private canOpenPopup;
     static validate: (value: Nullable<string>, range?: {
-        minDate?: string;
-        maxDate?: string;
+        minDate?: string | undefined;
+        maxDate?: string | undefined;
     }) => boolean;
     state: DatePickerState;
     private input;

package/components/DatePicker/DatePicker.styles/DatePicker.styles.js

@@ -0,0 +1,11 @@
+import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
+var _templateObject, _templateObject2;
+import { css, memoizeStyle } from "../../../lib/theming/Emotion";
+export var styles = memoizeStyle({
+  root: function root() {
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      position: relative;\n      touch-action: none;\n      line-height: normal;\n    "])));
+  },
+  calendarWrapper: function calendarWrapper(t) {
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      background: ", ";\n      box-shadow: ", ";\n      display: flex;\n      flex-flow: column nowrap;\n      font-size: 0;\n      z-index: 1000;\n      touch-action: none;\n      border-radius: ", ";\n    "])), t.calendarBg, t.pickerShadow, t.calendarBorderRadius);
+  }
+});

package/components/DatePicker/DatePicker.styles/DatePicker.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["css","memoizeStyle","styles","root","_templateObject","_taggedTemplateLiteralLoose","calendarWrapper","t","_templateObject2","calendarBg","pickerShadow","calendarBorderRadius"],"sources":["DatePicker.styles.ts"],"sourcesContent":["import type { Theme } from '../../lib/theming/Theme';\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n  root() {\n    return css`\n      display: inline-block;\n      position: relative;\n      touch-action: none;\n      line-height: normal;\n    `;\n  },\n  calendarWrapper(t: Theme) {\n    return css`\n      background: ${t.calendarBg};\n      box-shadow: ${t.pickerShadow};\n      display: flex;\n      flex-flow: column nowrap;\n      font-size: 0;\n      z-index: 1000;\n      touch-action: none;\n      border-radius: ${t.calendarBorderRadius};\n    `;\n  },\n});\n"],"mappings":";AACA,SAASA,GAAG,EAAEC,YAAY,QAAQ,2BAA2B;;AAE7D,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;EACjCE,IAAI,WAAAA,KAAA,EAAG;IACL,OAAOH,GAAG,CAAAI,eAAA,KAAAA,eAAA,GAAAC,2BAAA;;;;;;EAMZ,CAAC;EACDC,eAAe,WAAAA,gBAACC,CAAQ,EAAE;IACxB,OAAOP,GAAG,CAAAQ,gBAAA,KAAAA,gBAAA,GAAAH,2BAAA;IACME,CAAC,CAACE,UAAU;IACZF,CAAC,CAACG,YAAY;;;;;;IAMXH,CAAC,CAACI,oBAAoB;;EAE3C;AACF,CAAC,CAAC","ignoreList":[]}

package/components/DatePicker/DatePicker.styles/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/DatePicker/DatePicker.styles.js",
+  "module": "DatePicker.styles",
+  "types": "../DatePicker.styles.d.ts",
+  "sideEffects": false
+}

package/components/DatePicker/DatePicker.styles.d.ts

@@ -1,5 +1,5 @@
-import type { Theme } from '../../lib/theming/Theme.js';
-export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
+import type { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
     root(): string;
     calendarWrapper(t: Theme): string;
-}>;
+};

package/components/DatePicker/DatePickerHelpers/DatePickerHelpers.js

@@ -0,0 +1,13 @@
+import { getMonthInHumanFormat } from "../../Calendar/CalendarUtils";
+export function formatDate(_ref) {
+  var date = _ref.date,
+    month = _ref.month,
+    year = _ref.year;
+  var _map = [date, getMonthInHumanFormat(month), year].map(function (x) {
+      return x.toString();
+    }),
+    d = _map[0],
+    m = _map[1],
+    y = _map[2];
+  return d.padStart(2, '0') + "." + m.padStart(2, '0') + "." + y.padStart(4, '0');
+}

package/components/DatePicker/DatePickerHelpers/DatePickerHelpers.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getMonthInHumanFormat","formatDate","_ref","date","month","year","_map","map","x","toString","d","m","y","padStart"],"sources":["DatePickerHelpers.tsx"],"sourcesContent":["import type { CalendarDateShape } from '../../components/Calendar/CalendarDateShape';\nimport { getMonthInHumanFormat } from '../Calendar/CalendarUtils';\n\nexport function formatDate({ date, month, year }: CalendarDateShape): string {\n  const [d, m, y] = [date, getMonthInHumanFormat(month), year].map((x) => x.toString());\n  return `${d.padStart(2, '0')}.${m.padStart(2, '0')}.${y.padStart(4, '0')}`;\n}\n"],"mappings":";AACA,SAASA,qBAAqB,QAAQ,2BAA2B;;AAEjE,OAAO,SAASC,UAAUA,CAAAC,IAAA,EAAmD,KAAhDC,IAAI,GAAAD,IAAA,CAAJC,IAAI,CAAEC,KAAK,GAAAF,IAAA,CAALE,KAAK,CAAEC,IAAI,GAAAH,IAAA,CAAJG,IAAI;EAC5C,IAAAC,IAAA,GAAkB,CAACH,IAAI,EAAEH,qBAAqB,CAACI,KAAK,CAAC,EAAEC,IAAI,CAAC,CAACE,GAAG,CAAC,UAACC,CAAC,UAAKA,CAAC,CAACC,QAAQ,CAAC,CAAC,GAAC,CAA9EC,CAAC,GAAAJ,IAAA,IAAEK,CAAC,GAAAL,IAAA,IAAEM,CAAC,GAAAN,IAAA;EACd,OAAUI,CAAC,CAACG,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,SAAIF,CAAC,CAACE,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,SAAID,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC;AAC1E","ignoreList":[]}

package/components/DatePicker/DatePickerHelpers/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/DatePicker/DatePickerHelpers.js",
+  "module": "DatePickerHelpers",
+  "types": "../DatePickerHelpers.d.ts",
+  "sideEffects": false
+}

package/components/DatePicker/DatePickerHelpers.d.ts

@@ -0,0 +1,2 @@
+import type { CalendarDateShape } from '../../components/Calendar/CalendarDateShape';
+export declare function formatDate({ date, month, year }: CalendarDateShape): string;

package/components/DatePicker/MobilePicker/MobilePicker.js

@@ -0,0 +1,85 @@
+import React, { useContext, useLayoutEffect, useRef, useState } from 'react';
+import { Calendar } from "../../Calendar";
+import { getMonthInHumanFormat, getTodayDate } from "../../Calendar/CalendarUtils";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { MobilePopup } from "../../../internal/MobilePopup";
+import { DateInput } from "../../DateInput";
+import { Button } from "../../Button";
+import { useLocaleForControl } from "../../../lib/locale/useLocaleForControl";
+import { DatePickerLocaleHelper } from "../locale";
+import { styles } from "../MobilePicker.styles";
+import { getMobilePickerTheme } from "../getMobilePickerTheme";
+export var MobilePickerDataTids = {
+  input: 'MobilePicker__input',
+  today: 'MobilePicker__today'
+};
+export var MobilePicker = function MobilePicker(props) {
+  var locale = useLocaleForControl('DatePicker', DatePickerLocaleHelper);
+  var theme = getMobilePickerTheme(useContext(ThemeContext));
+  var calendarRef = useRef(null);
+  var inputRef = useRef(null);
+  var _useState = useState(function () {
+      return getTodayDate();
+    }),
+    _useState$ = _useState[0],
+    monthNative = _useState$.month,
+    year = _useState$.year;
+  var month = getMonthInHumanFormat(monthNative);
+  var onValueChange = function onValueChange(date) {
+    props.onValueChange == null || props.onValueChange(date);
+    props.onCloseRequest == null || props.onCloseRequest();
+  };
+  useLayoutEffect(function () {
+    // fix DateInput flushSync warning in React 18
+    setTimeout(function () {
+      var _inputRef$current;
+      (_inputRef$current = inputRef.current) == null || _inputRef$current.focus();
+    });
+  }, []);
+  var onTodayClick = function onTodayClick() {
+    if (calendarRef.current) {
+      calendarRef.current.scrollToMonth(month, year);
+    }
+  };
+  return /*#__PURE__*/(
+    React.createElement(ThemeContext.Provider, {
+      value: theme
+    }, /*#__PURE__*/
+    React.createElement(MobilePopup, {
+      opened: true,
+      headerChildComponent: /*#__PURE__*/
+      React.createElement(DateInput, {
+        value: props.value || '',
+        width: "100%",
+        withIcon: true,
+        ref: inputRef,
+        minDate: props.minDate,
+        maxDate: props.maxDate,
+        onValueChange: props.onValueChange,
+        size: "medium",
+        warning: props.warning,
+        error: props.error,
+        "data-tid": MobilePickerDataTids.input
+      }),
+      footerChildComponent: props.enableTodayLink && /*#__PURE__*/
+      React.createElement(Button, {
+        size: "medium",
+        onClick: onTodayClick,
+        "data-tid": MobilePickerDataTids.today
+      }, locale.today),
+      onCloseRequest: props.onCloseRequest
+    }, /*#__PURE__*/
+
+    React.createElement(Calendar, {
+      ref: calendarRef,
+      value: props.value,
+      className: styles.calendarRoot(),
+      minDate: props.minDate,
+      maxDate: props.maxDate,
+      onValueChange: onValueChange,
+      isHoliday: props.isHoliday,
+      renderDay: props.renderDay,
+      onMonthChange: props.onMonthChange
+    })))
+  );
+};