@retailcrm/datalens-ui 0.0.1 → 0.1.0

package/components/common.js

@@ -1,4451 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import React__default, { Component } from "react";
-import { TextInput, Icon, TabProvider, TabList, Tab, Button, MobileContext, Sheet, Popup, eventBroker, Loader } from "@gravity-ui/uikit";
-import block from "bem-cn-lite";
-import { debounce } from "lodash";
-import Slider from "rc-slider";
-import _range from "lodash/range";
-import { l as I18n } from "./AccessRights.js";
-import { DateTime, Interval } from "luxon";
-import PropTypes from "prop-types";
-import { F as FieldWrapper } from "./FieldWrapper.js";
-import throttle from "lodash/throttle";
-import _repeat from "lodash/repeat";
-import { ChevronRight, ArrowUpRightFromSquare, Check, ChevronDown } from "@gravity-ui/icons";
-import debounce$1 from "lodash/debounce";
-import _filter from "lodash/filter";
-import _flatMap from "lodash/flatMap";
-import isEqual from "lodash/isEqual";
-import isUndefined from "lodash/isUndefined";
-import _max from "lodash/max";
-import uniq from "lodash/uniq";
-import _uniqBy from "lodash/uniqBy";
-import AutoSizer from "react-virtualized-auto-sizer";
-import { VariableSizeList } from "react-window";
-import md5 from "blueimp-md5";
-const LEFT_INFO_POINT_STYLE = {
-  position: "static",
-  marginLeft: 0,
-  display: "flex",
-  verticalAlign: "none"
-};
-const RIGHT_INFO_POINT_STYLE = {
-  position: "static",
-  marginLeft: 0,
-  display: "flex",
-  verticalAlign: "none",
-  flexDirection: "row-reverse"
-};
-const prepareAvailableValues = (availableValues) => {
-  if (!availableValues || !availableValues.length) {
-    return void 0;
-  }
-  return [...availableValues].sort((v1, v2) => v1 - v2);
-};
-const prepareValue = ({
-  value = 0,
-  min = 0,
-  max = 100
-}) => {
-  if (value > max) {
-    return max;
-  }
-  if (value < min) {
-    return min;
-  }
-  return value;
-};
-const getInfoPoints = ({
-  infoPointsCount,
-  min,
-  max,
-  values
-}) => {
-  let mapInfoPoints;
-  if (values && infoPointsCount >= values.length) {
-    return values;
-  }
-  if (infoPointsCount < 1) {
-    return [];
-  }
-  if (infoPointsCount === 1) {
-    return [min];
-  }
-  if (!values || !values.length) {
-    const step = Math.abs(max - min) / (infoPointsCount - 1);
-    mapInfoPoints = (el) => Math.round((min + step * el) * 100) / 100;
-  } else {
-    const step = values.length / infoPointsCount;
-    mapInfoPoints = (el, i, arr) => {
-      let index = Math.ceil(el * step);
-      if (i === arr.length - 1) {
-        index = values.length - 1;
-      }
-      return values[index];
-    };
-  }
-  return _range(0, infoPointsCount).map(mapInfoPoints);
-};
-const getParsedValue = (textValue, parse) => {
-  return parse ? parse(textValue) : parseFloat(textValue);
-};
-const getTextValue = (value, format) => {
-  return format ? format(value) : value.toString();
-};
-const getClosestValue = (value, values) => {
-  if (!values || !values.length) {
-    return value;
-  }
-  let low = 0;
-  let hi = values.length - 1;
-  while (hi - low > 1) {
-    const mid = Math.floor((low + hi) / 2);
-    if (values[mid] < value) {
-      low = mid;
-    } else {
-      hi = mid;
-    }
-  }
-  const left = values[low];
-  const right = values[hi];
-  return value - left <= right - value ? left : right;
-};
-const b$d = block("dl-range-input-picker");
-const _RangeInputPicker = class _RangeInputPicker extends Component {
-  constructor(props) {
-    super(props);
-    this.wrapperRef = React__default.createRef();
-    this.sliderRef = React__default.createRef();
-    this.textInputInnerRef = React__default.createRef();
-    this.callOnUpdate = () => {
-      const { onUpdate } = this.props;
-      const { currentValue } = this.state;
-      if (onUpdate) {
-        onUpdate(currentValue);
-      }
-    };
-    this.prepareChange = (textValue) => {
-      const { parse } = this.props;
-      const { values, min, max, currentValue } = this.state;
-      let value = getParsedValue(textValue, parse);
-      if (isNaN(value)) {
-        value = currentValue;
-      }
-      let actualValue = prepareValue({ value, min, max });
-      if (values && values.length) {
-        actualValue = getClosestValue(actualValue, values);
-      }
-      return actualValue;
-    };
-    this.handleOnAfterUpdate = () => {
-      const { onAfterUpdate } = this.props;
-      const { currentValue } = this.state;
-      if (onAfterUpdate) {
-        onAfterUpdate(currentValue);
-      }
-    };
-    this.handleInputBlur = (event) => {
-      event.preventDefault();
-      const { onBlur } = this.props;
-      const { textValue } = this.state;
-      const actualValue = this.prepareChange(textValue);
-      this.setState(
-        {
-          focused: false,
-          currentValue: actualValue,
-          textValue: _RangeInputPicker.getDisplayTextValue(this.props, actualValue)
-        },
-        () => {
-          if (onBlur) {
-            onBlur(actualValue);
-          }
-        }
-      );
-    };
-    this.handleInputFocus = () => {
-      const { format, onFocus } = this.props;
-      const { currentValue } = this.state;
-      this.setState(
-        {
-          textValue: getTextValue(currentValue, format)
-        },
-        () => {
-          if (onFocus) {
-            onFocus(currentValue);
-          }
-        }
-      );
-    };
-    this.handleInputUpdate = (newValue) => {
-      if (this.patternRegex && !this.patternRegex.test(newValue)) {
-        return;
-      }
-      const actualValue = this.prepareChange(newValue);
-      this.setState(
-        {
-          currentValue: actualValue,
-          textValue: newValue
-        },
-        this.debouncedCallOnUpdate
-      );
-    };
-    this.handleKeyDown = (event) => {
-      if (event.key !== "Enter") {
-        return;
-      }
-      const { format, onSubmit } = this.props;
-      const { textValue } = this.state;
-      const actualValue = this.prepareChange(textValue);
-      this.setState(
-        {
-          currentValue: actualValue,
-          textValue: getTextValue(actualValue, format),
-          focused: false
-        },
-        () => {
-          if (this.textInputInnerRef.current) {
-            this.textInputInnerRef.current.blur();
-          }
-          if (onSubmit) {
-            onSubmit(actualValue);
-          }
-        }
-      );
-    };
-    this.handleSliderChange = (sliderValue) => {
-      const { min, max, values } = this.state;
-      const nextValue = Array.isArray(sliderValue) ? sliderValue[0] : sliderValue;
-      const value = getClosestValue(prepareValue({ min, max, value: nextValue }), values);
-      this.setState(
-        {
-          currentValue: value,
-          textValue: _RangeInputPicker.getDisplayTextValue(this.props, value)
-        },
-        this.debouncedCallOnUpdate
-      );
-    };
-    this.handleWrapperClick = (event) => {
-      const slider = this.sliderRef.current && this.sliderRef.current.sliderRef;
-      const isSliderContainsTarget = slider && slider.contains(event.target);
-      if (!isSliderContainsTarget) {
-        this.setState({ focused: true });
-      }
-    };
-    this.handleInfoPointClick = (value) => {
-      return (event) => {
-        const { format, parse } = this.props;
-        event.preventDefault();
-        const val = getParsedValue(getTextValue(value, format), parse);
-        this.setState(
-          {
-            currentValue: val,
-            textValue: _RangeInputPicker.getDisplayTextValue(this.props, val)
-          },
-          () => {
-            const { onUpdate, onAfterUpdate } = this.props;
-            if (onUpdate) {
-              onUpdate(val);
-            }
-            if (onAfterUpdate) {
-              onAfterUpdate(val);
-            }
-          }
-        );
-      };
-    };
-    this.handleOutsideClick = (event) => {
-      const { onOutsideClick } = this.props;
-      const { currentValue, focused } = this.state;
-      const wrapper = this.wrapperRef.current;
-      if (!onOutsideClick || !wrapper) {
-        return;
-      }
-      if (!wrapper.contains(event.target) && focused) {
-        this.setState(
-          {
-            focused: false
-          },
-          () => {
-            if (onOutsideClick) {
-              onOutsideClick(currentValue);
-            }
-          }
-        );
-      }
-    };
-    this.renderItem = (value) => _RangeInputPicker.getDisplayTextValue(this.props, value);
-    this.renderRangeItem = (value) => /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: b$d("range-info-item"),
-        onClick: this.handleInfoPointClick(value),
-        children: _RangeInputPicker.getDisplayTextValue(this.props, value)
-      },
-      value
-    );
-    this.renderRangeInfoItems = () => {
-      const { infoPointsCount = 2, minValue = 0, maxValue = 100 } = this.props;
-      const { values } = this.state;
-      if (infoPointsCount < 1) {
-        return [];
-      }
-      let infoItems = [];
-      if (infoPointsCount === 1) {
-        infoItems.push(minValue);
-      } else if (!values || !values.length) {
-        const step = Math.abs(maxValue - minValue) / (infoPointsCount - 1);
-        for (let i = 0; i < infoPointsCount; i++) {
-          const point = Math.round((minValue + step * i) * 100) / 100;
-          infoItems.push(point);
-        }
-      } else {
-        infoItems = values;
-      }
-      const pointsCount = infoItems.length;
-      const unit = 100 / (pointsCount - 1);
-      const pointWidth = unit * 0.9;
-      const pointsRange = maxValue - minValue;
-      return infoItems.map((point, i) => {
-        const style = {
-          width: pointWidth + "%",
-          marginLeft: -pointWidth / 2 + "%",
-          left: (point - minValue) / pointsRange * 100 + "%"
-        };
-        if (i === 0) {
-          Object.assign(style, LEFT_INFO_POINT_STYLE);
-        } else if (i === infoItems.length - 1) {
-          Object.assign(style, RIGHT_INFO_POINT_STYLE);
-        }
-        return /* @__PURE__ */ jsx("span", { className: b$d("range-info-item-container"), style, children: this.renderRangeItem(point) }, point);
-      });
-    };
-    this.renderInfoItems = () => {
-      const { infoPointsCount = 2 } = this.props;
-      const { values, min, max } = this.state;
-      const points = getInfoPoints({ infoPointsCount, min, max, values });
-      const infoItems = points.reduce(
-        (acc, point) => {
-          acc[point] = { label: this.renderItem(point), style: {} };
-          return acc;
-        },
-        {}
-      );
-      if (infoItems[min]) {
-        infoItems[min].style = LEFT_INFO_POINT_STYLE;
-      }
-      if (infoItems[max]) {
-        infoItems[max].style = RIGHT_INFO_POINT_STYLE;
-      }
-      return infoItems;
-    };
-    this.debouncedCallOnUpdate = debounce(this.callOnUpdate, props.debounceDelay);
-    this.debouncedHandleOnAfterUpdate = debounce(this.handleOnAfterUpdate, props.debounceDelay);
-    this.state = _RangeInputPicker.getPreparedState(props);
-  }
-  static getDisplayTextValue(props, value) {
-    const { displayFormat, format } = props;
-    const formatFunc = displayFormat || format || String;
-    return formatFunc(value);
-  }
-  static getPreparedState(props, currentState) {
-    const { availableValues, value, minValue = 0, maxValue = 100 } = props;
-    const { focused = false, textValue = "" } = currentState || {};
-    const values = prepareAvailableValues(availableValues);
-    const min = values ? values[0] : minValue;
-    const max = values ? values[values.length - 1] : maxValue;
-    const actualValue = prepareValue({ value, min, max });
-    return {
-      prevProps: props,
-      textValue: focused ? textValue : _RangeInputPicker.getDisplayTextValue(props, value),
-      currentValue: actualValue,
-      min,
-      max,
-      values,
-      focused
-    };
-  }
-  static getDerivedStateFromProps(nextProps, state) {
-    if (nextProps === state.prevProps) {
-      return null;
-    }
-    return _RangeInputPicker.getPreparedState(nextProps, state);
-  }
-  componentDidMount() {
-    const { onOutsideClick } = this.props;
-    if (onOutsideClick) {
-      document.addEventListener("touchstart", this.handleOutsideClick);
-      document.addEventListener("mousedown", this.handleOutsideClick);
-    }
-  }
-  componentWillUnmount() {
-    this.debouncedCallOnUpdate.cancel();
-    this.debouncedHandleOnAfterUpdate.cancel();
-    document.removeEventListener("touchstart", this.handleOutsideClick);
-    document.removeEventListener("mousedown", this.handleOutsideClick);
-  }
-  render() {
-    const { placeholder, autoFocus, disabled, readOnly, size, pattern, className } = this.props;
-    const { currentValue, textValue, min, max, values } = this.state;
-    let rangeInfoItems;
-    let rcSliderInfoItems;
-    if (!values || !values.length) {
-      rangeInfoItems = this.renderRangeInfoItems();
-    } else {
-      rcSliderInfoItems = this.renderInfoItems();
-    }
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref: this.wrapperRef,
-        className: b$d({ size }, className),
-        tabIndex: 0,
-        onKeyDown: this.handleKeyDown,
-        onMouseDown: this.handleWrapperClick,
-        children: [
-          /* @__PURE__ */ jsx(
-            TextInput,
-            {
-              controlRef: this.textInputInnerRef,
-              placeholder,
-              size,
-              disabled,
-              onUpdate: this.handleInputUpdate,
-              onFocus: this.handleInputFocus,
-              onBlur: this.handleInputBlur,
-              value: textValue,
-              autoFocus,
-              controlProps: { readOnly, pattern }
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            Slider,
-            {
-              ref: this.sliderRef,
-              tabIndex: 0,
-              min,
-              max,
-              value: currentValue,
-              disabled,
-              onChange: this.handleSliderChange,
-              step: this.step,
-              marks: rcSliderInfoItems,
-              onAfterChange: this.debouncedHandleOnAfterUpdate
-            }
-          ),
-          rangeInfoItems && /* @__PURE__ */ jsx("div", { className: b$d("range-info-items-list"), children: rangeInfoItems })
-        ]
-      }
-    );
-  }
-  get patternRegex() {
-    const { pattern } = this.props;
-    if (!pattern) {
-      return null;
-    }
-    return new RegExp(`^(?:${pattern})$`);
-  }
-  get step() {
-    const { step } = this.props;
-    const { values } = this.state;
-    return !values || !values.length ? step : void 0;
-  }
-};
-_RangeInputPicker.defaultProps = {
-  size: "m",
-  placeholder: "",
-  value: 0,
-  minValue: 0,
-  maxValue: 100,
-  debounceDelay: 200,
-  disabled: false,
-  readOnly: false,
-  autoFocus: false,
-  infoPointsCount: 2,
-  step: 1
-};
-let RangeInputPicker = _RangeInputPicker;
-const i18n$5 = I18n.keyset("components.common.Datepicker");
-const MINUTES_IN_HOUR = 60;
-const AVAILABLE_POPUP_PLACEMENT = ["bottom-start", "bottom-end", "top-start", "top-end"];
-const WEEKDAYS = {
-  MONDAY: 1,
-  THURSDAY: 4,
-  SATURDAY: 6,
-  SUNDAY: 7
-};
-const MONTHS = {
-  JANUARY: 1,
-  DECEMBER: 12
-};
-const TABS = {
-  DAY: "day",
-  WEEK: "week",
-  MONTH: "month",
-  QUARTER: "quarter",
-  YEAR: "year"
-};
-const DISPLAY_FORMAT = {
-  DATE: "dd.MM.yyyy",
-  DATETIME: "dd.MM.yyyy HH:mm:ss"
-};
-const OUTPUT_FORMAT = {
-  DATE: "date",
-  DATETIME: "datetime"
-};
-function getTabs() {
-  return [TABS.DAY, TABS.WEEK, TABS.MONTH, TABS.QUARTER, TABS.YEAR].map((tab) => ({
-    id: tab,
-    title: i18n$5(`tab_${tab}`)
-  }));
-}
-const i18n$4 = I18n.keyset("components.common.Datepicker");
-const b$c = block("dl-datepicker-month");
-const CELLS$2 = {
-  DAY: "day",
-  TITLE: "title"
-};
-const isDatesEqual = (d1, d2) => {
-  if (!d1 || !d2) {
-    return false;
-  }
-  return d1.hasSame(d2, "day") && d1.hasSame(d2, "month") && d1.hasSame(d2, "year");
-};
-class Month extends React__default.Component {
-  static propTypes = {
-    month: PropTypes.number.isRequired,
-    year: PropTypes.number.isRequired,
-    from: PropTypes.object,
-    to: PropTypes.object,
-    min: PropTypes.object,
-    max: PropTypes.object,
-    selectedInterval: PropTypes.object,
-    hovered: PropTypes.object,
-    zone: PropTypes.string,
-    isDefaultFrom: PropTypes.bool,
-    isNeedScroll: PropTypes.bool,
-    onDateClick: PropTypes.func,
-    onRangeDateClick: PropTypes.func
-  };
-  scrollRef = React__default.createRef();
-  firstMonthDate = DateTime.fromObject({
-    year: this.props.year,
-    month: this.props.month,
-    day: 1,
-    zone: this.props.zone
-  });
-  todayDateTime = DateTime.fromObject({ zone: this.props.zone });
-  titleCells = this.firstMonthDate.weekday < WEEKDAYS.THURSDAY ? WEEKDAYS.SUNDAY : this.firstMonthDate.weekday - 1;
-  isMonthIncludeToday = this.todayDateTime >= this.firstMonthDate && this.todayDateTime <= this.firstMonthDate.endOf("month");
-  getOnDateClick = ({ start, end }) => {
-    const { onDateClick, onRangeDateClick } = this.props;
-    if (onRangeDateClick) {
-      return () => onRangeDateClick({ start, end });
-    }
-    return () => onDateClick({ dateTime: start });
-  };
-  renderTitleCell = ({ titleCell, month, year }) => {
-    const { min, max } = this.props;
-    const startMonth = this.firstMonthDate;
-    const endMonth = this.firstMonthDate.set({ day: startMonth.daysInMonth });
-    const disabled = min && endMonth < min || max && startMonth > max;
-    let title = titleCell === 0 ? i18n$4(`month_long_${month}`) : null;
-    if (title && [MONTHS.DECEMBER, MONTHS.JANUARY].includes(month)) {
-      title += ` ${year}`;
-    }
-    return /* @__PURE__ */ React__default.createElement("div", { key: `title-${titleCell}-${month}-${year}`, className: b$c(CELLS$2.TITLE, { disabled }) }, title);
-  };
-  renderEmptyCell = ({ emptyCell, month, year }) => {
-    return /* @__PURE__ */ React__default.createElement("div", { key: `empty-${emptyCell}-${month}-${year}` });
-  };
-  // eslint-disable-next-line complexity
-  getMods = ({ currentDateTime, mergedIntervals, flags }) => {
-    const { min, max, selectedInterval, hovered, isDefaultFrom, onRangeDateClick } = this.props;
-    let isToday = false;
-    let isSelected = false;
-    if (this.isMonthIncludeToday && !flags.hasToday) {
-      isToday = isDatesEqual(currentDateTime, this.todayDateTime);
-      if (isToday) {
-        flags.hasToday = true;
-      }
-    }
-    if (hovered && onRangeDateClick) {
-      isSelected = selectedInterval.contains(currentDateTime) || hovered.contains(currentDateTime);
-    } else if (hovered) {
-      isSelected = mergedIntervals ? mergedIntervals.contains(currentDateTime) : hovered.contains(currentDateTime);
-    } else {
-      isSelected = selectedInterval.contains(currentDateTime) && !isDefaultFrom;
-    }
-    const disabled = min && currentDateTime < min || max && currentDateTime > max;
-    const isMonday = currentDateTime.weekday === WEEKDAYS.MONDAY;
-    const isSunday = currentDateTime.weekday === WEEKDAYS.SUNDAY;
-    const isFirsDay = currentDateTime.day === 1;
-    const isLastDay = currentDateTime.day === currentDateTime.daysInMonth;
-    const mods = {
-      disabled,
-      weekend: currentDateTime.weekday >= WEEKDAYS.SATURDAY,
-      today: isToday,
-      selected: isSelected,
-      "left-edge": isMonday || isFirsDay,
-      "right-edge": isSunday || isLastDay
-    };
-    return mods;
-  };
-  renderDayCell = ({ day, month, year, mergedIntervals }) => {
-    const { hovered, onRangeDateClick } = this.props;
-    const flags = {
-      hasToday: false
-    };
-    const currentDateTime = this.firstMonthDate.set({ day });
-    const mods = this.getMods({ currentDateTime, mergedIntervals, flags });
-    let start = currentDateTime;
-    let end;
-    if (hovered && onRangeDateClick) {
-      [start, end] = [hovered.start, hovered.end];
-    }
-    return /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        key: `${day}-${month}-${year}`,
-        className: b$c(CELLS$2.DAY, mods),
-        date: currentDateTime.toISODate(),
-        ...!mods.disabled && { onClick: this.getOnDateClick({ start, end }) }
-      },
-      day
-    );
-  };
-  renderMonth = () => {
-    const { month, year, selectedInterval, hovered, onRangeDateClick } = this.props;
-    const emptyCells = this.titleCells === WEEKDAYS.SUNDAY ? this.firstMonthDate.weekday - 1 : 0;
-    const mergedIntervals = !onRangeDateClick && selectedInterval && hovered && selectedInterval.union(hovered);
-    return _range(this.titleCells).map((titleCell) => this.renderTitleCell({ titleCell, month, year })).concat(
-      _range(emptyCells).map(
-        (emptyCell) => this.renderEmptyCell({ emptyCell, month, year })
-      )
-    ).concat(
-      _range(1, this.firstMonthDate.daysInMonth + 1).map(
-        (day) => this.renderDayCell({ day, month, year, mergedIntervals })
-      )
-    );
-  };
-  render() {
-    const { isNeedScroll } = this.props;
-    return /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        ...isNeedScroll && { ref: this.scrollRef },
-        style: {
-          gridTemplateAreas: `"${_repeat("title ", this.titleCells)}"`
-        },
-        className: b$c(),
-        year: this.firstMonthDate.year,
-        month: this.firstMonthDate.month
-      },
-      this.renderMonth()
-    );
-  }
-}
-const i18n$3 = I18n.keyset("components.common.Datepicker");
-const b$b = block("dl-datepicker-months");
-const CELLS_COUNT$1 = 17;
-const EMPTY_CELLS = [5, 9, 13];
-const CELLS$1 = {
-  MONTH: "month",
-  TITLE: "title"
-};
-const COLUMNS$2 = {
-  LEFT: 1,
-  RIGHT: 3
-};
-class Months extends React__default.PureComponent {
-  static propTypes = {
-    year: PropTypes.number.isRequired,
-    from: PropTypes.object,
-    to: PropTypes.object,
-    min: PropTypes.object,
-    max: PropTypes.object,
-    selectedInterval: PropTypes.object,
-    hovered: PropTypes.object,
-    zone: PropTypes.string,
-    isNeedScroll: PropTypes.bool,
-    onRangeDateClick: PropTypes.func
-  };
-  scrollRef = React__default.createRef();
-  dateTime = DateTime.fromObject({
-    year: this.props.year,
-    month: 1,
-    day: 1,
-    zone: this.props.zone
-  });
-  todayDateTime = DateTime.fromObject({ zone: this.props.zone });
-  getOnRangeDateClick = ({ start, end, isAllRangePicked }) => {
-    return () => this.props.onRangeDateClick({ start, end, isAllRangePicked });
-  };
-  renderMonthes() {
-    const { from, to, min, max, selectedInterval, hovered } = this.props;
-    let currentMonth = 0;
-    let currentColumn = 0;
-    return _range(1, CELLS_COUNT$1).map((cell) => {
-      const isTitle = cell === 1;
-      const isEmpty = EMPTY_CELLS.includes(cell);
-      if (isTitle || isEmpty) {
-        const startYear = this.dateTime;
-        let endYear = this.dateTime.set({ month: MONTHS.DECEMBER });
-        endYear = endYear.set({ day: endYear.daysInMonth });
-        const disabled2 = min && endYear < min || max && startYear > max;
-        return /* @__PURE__ */ React__default.createElement(
-          "div",
-          {
-            key: `title-${cell}-${this.dateTime.year}`,
-            ...isTitle && { className: b$b(CELLS$1.TITLE, { disabled: disabled2 }) },
-            ...isTitle && {
-              onClick: this.getOnRangeDateClick({
-                start: this.dateTime,
-                end: this.dateTime.set({ month: 12, day: 31 }),
-                isAllRangePicked: true
-              })
-            }
-          },
-          isTitle && this.dateTime.year
-        );
-      }
-      currentMonth += 1;
-      currentColumn += 1;
-      if (currentColumn > COLUMNS$2.RIGHT) {
-        currentColumn = COLUMNS$2.LEFT;
-      }
-      const startMonth = this.dateTime.set({
-        day: 1,
-        month: currentMonth
-      });
-      const endMonth = this.dateTime.set({
-        day: startMonth.daysInMonth,
-        month: currentMonth
-      }).endOf("month");
-      const disabled = min && endMonth < min || max && startMonth > max;
-      const monthInterval = Interval.fromDateTimes(startMonth, endMonth);
-      const isContainsFrom = from && monthInterval.contains(from);
-      const isContainsTo = to && monthInterval.end >= to;
-      const isSelected = Boolean(
-        selectedInterval && selectedInterval.intersection(monthInterval)
-      );
-      const isHovered = Boolean(hovered && hovered.intersection(monthInterval));
-      const isContainsHoverStart = isHovered && monthInterval.contains(hovered.start);
-      const isContainsHoverEnd = isHovered && monthInterval.end >= hovered.end;
-      const mods = {
-        disabled,
-        today: monthInterval.contains(this.todayDateTime),
-        selected: isSelected || isHovered
-      };
-      if (isHovered) {
-        mods["left-edge"] = currentColumn === COLUMNS$2.LEFT || isContainsHoverStart;
-        mods["right-edge"] = currentColumn === COLUMNS$2.RIGHT || isContainsHoverEnd;
-      } else {
-        mods["left-edge"] = currentColumn === COLUMNS$2.LEFT || isContainsFrom;
-        mods["right-edge"] = currentColumn === COLUMNS$2.RIGHT || isContainsTo;
-      }
-      return /* @__PURE__ */ React__default.createElement(
-        "div",
-        {
-          key: `${cell}-${this.dateTime.year}`,
-          className: b$b(CELLS$1.MONTH, mods),
-          range: `${startMonth.toISODate()}/${endMonth.toISODate()}`,
-          ...!disabled && {
-            onClick: this.getOnRangeDateClick({
-              start: startMonth,
-              end: endMonth
-            })
-          }
-        },
-        i18n$3(`month_short_${currentMonth}`)
-      );
-    });
-  }
-  render() {
-    const { isNeedScroll } = this.props;
-    return /* @__PURE__ */ React__default.createElement("div", { ...isNeedScroll && { ref: this.scrollRef }, className: b$b() }, this.renderMonthes());
-  }
-}
-const b$a = block("dl-datepicker-quarters");
-const CELLS_COUNT = 5;
-const CELLS = {
-  QUARTER: "quarter",
-  TITLE: "title"
-};
-const COLUMNS$1 = {
-  LEFT: 1,
-  RIGHT: 4
-};
-class Quarters extends React__default.PureComponent {
-  static propTypes = {
-    year: PropTypes.number.isRequired,
-    from: PropTypes.object,
-    to: PropTypes.object,
-    min: PropTypes.object,
-    max: PropTypes.object,
-    selectedInterval: PropTypes.object,
-    hovered: PropTypes.object,
-    zone: PropTypes.string,
-    isNeedScroll: PropTypes.bool,
-    onRangeDateClick: PropTypes.func
-  };
-  scrollRef = React__default.createRef();
-  dateTime = DateTime.fromObject({
-    year: this.props.year,
-    month: 1,
-    day: 1,
-    zone: this.props.zone
-  });
-  todayDateTime = DateTime.fromObject({ zone: this.props.zone });
-  getOnRangeDateClick = ({ start, end }) => {
-    return () => this.props.onRangeDateClick({ start, end });
-  };
-  renderQuarter() {
-    const { from, to, min, max, selectedInterval, hovered } = this.props;
-    return _range(0, CELLS_COUNT).map((cell) => {
-      if (cell === 0) {
-        const startYear = this.dateTime;
-        let endYear = this.dateTime.set({ month: MONTHS.DECEMBER });
-        endYear = endYear.set({ day: endYear.daysInMonth });
-        const disabled2 = min && endYear < min || max && startYear > max;
-        return /* @__PURE__ */ React__default.createElement(
-          "div",
-          {
-            key: `title-${cell}-${this.dateTime.year}`,
-            className: b$a(CELLS.TITLE, { disabled: disabled2 })
-          },
-          this.dateTime.year
-        );
-      }
-      const quarter = cell;
-      const startQuarter = this.dateTime.set({
-        day: 1,
-        month: quarter * 3 - 2
-      });
-      const endQuarter = this.dateTime.set({
-        day: 1,
-        month: quarter * 3
-      }).endOf("month");
-      const disabled = min && endQuarter < min || max && startQuarter > max;
-      const quarterInterval = Interval.fromDateTimes(startQuarter, endQuarter);
-      const isContainsFrom = from && quarterInterval.contains(from);
-      const isContainsTo = to && quarterInterval.end >= to;
-      const isSelected = Boolean(
-        selectedInterval && selectedInterval.intersection(quarterInterval)
-      );
-      const isHovered = Boolean(hovered && hovered.intersection(quarterInterval));
-      const isContainsHoverStart = isHovered && quarterInterval.contains(hovered.start);
-      const isContainsHoverEnd = isHovered && quarterInterval.end >= hovered.end;
-      const mods = {
-        disabled,
-        selected: isSelected || isHovered,
-        today: quarterInterval.contains(this.todayDateTime)
-      };
-      if (isHovered) {
-        mods["left-edge"] = cell === COLUMNS$1.LEFT || isContainsHoverStart;
-        mods["right-edge"] = cell === COLUMNS$1.RIGHT || isContainsHoverEnd;
-      } else {
-        mods["left-edge"] = cell === COLUMNS$1.LEFT || isContainsFrom;
-        mods["right-edge"] = cell === COLUMNS$1.RIGHT || isContainsTo;
-      }
-      return /* @__PURE__ */ React__default.createElement(
-        "div",
-        {
-          key: `${cell}-${this.dateTime.year}`,
-          className: b$a(CELLS.QUARTER, mods),
-          range: `${startQuarter.toISODate()}/${endQuarter.toISODate()}`,
-          ...!disabled && {
-            onClick: this.getOnRangeDateClick({
-              start: startQuarter,
-              end: endQuarter
-            })
-          }
-        },
-        `Q${quarter}`
-      );
-    });
-  }
-  render() {
-    const { isNeedScroll } = this.props;
-    return /* @__PURE__ */ React__default.createElement("div", { ...isNeedScroll && { ref: this.scrollRef }, className: b$a() }, this.renderQuarter());
-  }
-}
-const b$9 = block("dl-datepicker-year-switcher");
-class YearSwitcher extends React__default.Component {
-  static propTypes = {
-    switcherDate: PropTypes.object,
-    offsetTop: PropTypes.number,
-    visible: PropTypes.bool,
-    onShiftMonths: PropTypes.func
-  };
-  static getDerivedStateFromProps(props) {
-    const changedState = {};
-    if (props.switcherDate) {
-      changedState.switcherDate = props.switcherDate;
-    }
-    return changedState;
-  }
-  state = {
-    switcherDate: this.props.switcherDate
-  };
-  onLeftArrowClick = () => this.props.onShiftMonths(-12);
-  onRightArrowClick = () => this.props.onShiftMonths(12);
-  render() {
-    const { offsetTop, visible } = this.props;
-    const { switcherDate } = this.state;
-    if (!visible) {
-      return null;
-    }
-    return /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        className: b$9(),
-        style: {
-          top: offsetTop + 4
-        }
-      },
-      /* @__PURE__ */ React__default.createElement("div", { className: b$9("arrow", { left: true }), onClick: this.onLeftArrowClick }, /* @__PURE__ */ React__default.createElement(Icon, { data: ChevronRight })),
-      /* @__PURE__ */ React__default.createElement("div", { className: b$9("value") }, switcherDate.year),
-      /* @__PURE__ */ React__default.createElement("div", { className: b$9("arrow", { right: true }), onClick: this.onRightArrowClick }, /* @__PURE__ */ React__default.createElement(Icon, { data: ChevronRight }))
-    );
-  }
-}
-const b$8 = block("dl-datepicker-years");
-const COLUMNS = {
-  LEFT: 1,
-  RIGHT: 4
-};
-class Years extends React__default.PureComponent {
-  static propTypes = {
-    years: PropTypes.array.isRequired,
-    from: PropTypes.object,
-    to: PropTypes.object,
-    min: PropTypes.object,
-    max: PropTypes.object,
-    middle: PropTypes.object,
-    selectedInterval: PropTypes.object,
-    hovered: PropTypes.object,
-    zone: PropTypes.string,
-    onRangeDateClick: PropTypes.func
-  };
-  scrollRef = React__default.createRef();
-  todayDateTime = DateTime.fromObject({ zone: this.props.zone });
-  getOnRangeDateClick = ({ start, end }) => {
-    return () => this.props.onRangeDateClick({ start, end });
-  };
-  renderYears() {
-    const { from, to, min, max, middle, zone, years, selectedInterval, hovered } = this.props;
-    let currentColumn = 0;
-    return years.map((year) => {
-      currentColumn += 1;
-      if (currentColumn > COLUMNS.RIGHT) {
-        currentColumn = COLUMNS.LEFT;
-      }
-      const startYear = DateTime.fromObject({
-        year,
-        month: 1,
-        day: 1,
-        zone
-      });
-      const endYear = startYear.endOf("year");
-      const disabled = min && endYear < min || max && startYear > max;
-      const yearInterval = Interval.fromDateTimes(startYear, endYear);
-      const isContainsFrom = from && yearInterval.contains(from);
-      const isContainsTo = to && yearInterval.end >= to;
-      const isSelected = Boolean(
-        selectedInterval && selectedInterval.intersection(yearInterval)
-      );
-      const isHovered = Boolean(hovered && hovered.intersection(yearInterval));
-      const isContainsHoverStart = isHovered && yearInterval.contains(hovered.start);
-      const isContainsHoverEnd = isHovered && yearInterval.end >= hovered.end;
-      const isNeedScroll = middle.year === year;
-      const mods = {
-        disabled,
-        selected: isSelected || isHovered,
-        today: yearInterval.contains(this.todayDateTime)
-      };
-      if (isHovered) {
-        mods["left-edge"] = currentColumn === COLUMNS.LEFT || isContainsHoverStart;
-        mods["right-edge"] = currentColumn === COLUMNS.RIGHT || isContainsHoverEnd;
-      } else {
-        mods["left-edge"] = currentColumn === COLUMNS.LEFT || isContainsFrom;
-        mods["right-edge"] = currentColumn === COLUMNS.RIGHT || isContainsTo;
-      }
-      return /* @__PURE__ */ React__default.createElement(
-        "div",
-        {
-          ...isNeedScroll && { ref: this.scrollRef },
-          key: year,
-          className: b$8("year", mods),
-          range: `${startYear.toISODate()}/${endYear.toISODate()}`,
-          onClick: this.getOnRangeDateClick({
-            start: startYear,
-            end: endYear
-          })
-        },
-        year
-      );
-    });
-  }
-  render() {
-    return /* @__PURE__ */ React__default.createElement("div", { className: b$8() }, this.renderYears());
-  }
-}
-const i18n$2 = I18n.keyset("components.common.Datepicker");
-const FORMAT_LETTERS = ["y", "M", "d", "h", "H", "m", "s", "S"];
-function createDateTime({ date, zone }) {
-  if (!date) {
-    return void 0;
-  }
-  const type = typeof date;
-  let dateTime;
-  switch (type) {
-    case "string": {
-      dateTime = DateTime.fromISO(date, { zone });
-      break;
-    }
-    case "number": {
-      dateTime = DateTime.fromMillis(date, { zone });
-      break;
-    }
-  }
-  return dateTime;
-}
-function getPlaceholder(format) {
-  return format.split("").map((letter) => {
-    return FORMAT_LETTERS.includes(letter) ? i18n$2(`placeholder_letter_${letter}`) : letter;
-  }).join("");
-}
-function getSearchText({ from, to, format, emptyValueText, range, required }) {
-  switch (true) {
-    case Boolean(!range && from): {
-      return `${from.toFormat(format)}`;
-    }
-    case Boolean(from && !to): {
-      return `${from.toFormat(format)} - ${emptyValueText ? emptyValueText : ""}`;
-    }
-    case Boolean(from && to): {
-      return `${from.toFormat(format)} - ${to.toFormat(format)}`;
-    }
-    // return value_required text if value is required and is not fully filled
-    case (required && (range && !from && !to || !range && !from)): {
-      return i18n$2("value_required");
-    }
-    case Boolean(range): {
-      return emptyValueText ? `${emptyValueText} - ${emptyValueText}` : "";
-    }
-    default: {
-      return emptyValueText || "";
-    }
-  }
-}
-function getZone(offset) {
-  if (!offset && offset !== 0) {
-    return DateTime.local().zoneName;
-  }
-  const offsetHours = Math.round(offset / MINUTES_IN_HOUR);
-  if (offsetHours === 0) {
-    return "UTC";
-  }
-  return `UTC${offsetHours > 0 ? "+" : ""}${offsetHours}`;
-}
-function isValidDate(dateTime) {
-  if (!dateTime) {
-    return false;
-  }
-  return dateTime.isValid;
-}
-function getDefaultPreset({ zone, activeTab, range }) {
-  switch (activeTab) {
-    case "day": {
-      if (range) {
-        return [
-          {
-            title: () => i18n$2("preset_day_7"),
-            start: DateTime.fromObject({ zone }).plus({ day: -6 }).startOf("day"),
-            end: DateTime.fromObject({ zone })
-          },
-          {
-            title: () => i18n$2("preset_day_30"),
-            start: DateTime.fromObject({ zone }).plus({ day: -29 }).startOf("day"),
-            end: DateTime.fromObject({ zone })
-          },
-          {
-            title: () => i18n$2("preset_day_90"),
-            start: DateTime.fromObject({ zone }).plus({ day: -89 }).startOf("day"),
-            end: DateTime.fromObject({ zone })
-          },
-          {
-            title: () => i18n$2("preset_day_365"),
-            start: DateTime.fromObject({ zone }).plus({ day: -364 }).startOf("day"),
-            end: DateTime.fromObject({ zone })
-          }
-        ];
-      }
-      return [
-        {
-          title: () => i18n$2("preset_day_today"),
-          start: DateTime.fromObject({ zone }).startOf("day"),
-          end: DateTime.fromObject({ zone })
-        },
-        {
-          title: () => i18n$2("preset_day_yesterday"),
-          start: DateTime.fromObject({ zone }).plus({ day: -1 }).startOf("day"),
-          end: DateTime.fromObject({ zone }).plus({ day: -1 })
-        },
-        {
-          title: () => i18n$2("preset_day_two_days_ago"),
-          start: DateTime.fromObject({ zone }).plus({ day: -2 }).startOf("day"),
-          end: DateTime.fromObject({ zone }).plus({ day: -2 })
-        }
-      ];
-    }
-    case "week": {
-      return [
-        {
-          title: () => i18n$2("preset_week_current"),
-          start: DateTime.fromObject({ zone }).startOf("week"),
-          end: DateTime.fromObject({ zone }).endOf("week")
-        },
-        {
-          title: () => i18n$2("preset_week_past"),
-          start: DateTime.fromObject({ zone }).startOf("week").plus({ day: -7 }),
-          end: DateTime.fromObject({ zone }).startOf("week").plus({ day: -1 })
-        }
-      ];
-    }
-    case "month": {
-      return [
-        {
-          title: () => i18n$2("preset_current"),
-          start: DateTime.fromObject({ zone }).startOf("month"),
-          end: DateTime.fromObject({ zone }).endOf("month")
-        },
-        {
-          title: () => i18n$2("preset_past"),
-          start: DateTime.fromObject({ zone }).startOf("month").plus({ day: -1 }).startOf("month"),
-          end: DateTime.fromObject({ zone }).startOf("month").plus({ day: -1 })
-        }
-      ];
-    }
-    case "quarter": {
-      return [
-        {
-          title: () => i18n$2("preset_current"),
-          start: DateTime.fromObject({ zone }).startOf("quarter"),
-          end: DateTime.fromObject({ zone }).endOf("quarter")
-        },
-        {
-          title: () => i18n$2("preset_past"),
-          start: DateTime.fromObject({ zone }).startOf("quarter").plus({ day: -1 }).startOf("quarter"),
-          end: DateTime.fromObject({ zone }).startOf("quarter").plus({ day: -1 })
-        }
-      ];
-    }
-    case "year": {
-      return [
-        {
-          title: () => i18n$2("preset_current"),
-          start: DateTime.fromObject({ zone }).startOf("year"),
-          end: DateTime.fromObject({ zone }).endOf("year")
-        },
-        {
-          title: () => i18n$2("preset_past"),
-          start: DateTime.fromObject({ zone }).startOf("year").plus({ day: -1 }).startOf("year"),
-          end: DateTime.fromObject({ zone }).startOf("year").plus({ day: -1 })
-        }
-      ];
-    }
-  }
-}
-function getHashedData(data) {
-  return JSON.stringify(data);
-}
-function resolveDates({ from, to }) {
-  let resolveFrom = from;
-  let resolveTo = to;
-  const isFromValid = isValidDate(resolveFrom);
-  const isToValid = isValidDate(resolveTo);
-  if (isFromValid && isToValid && resolveTo < resolveFrom) {
-    [resolveFrom, resolveTo] = [resolveTo, resolveFrom];
-  }
-  if (!isFromValid && isToValid) {
-    [resolveFrom, resolveTo] = [resolveTo, resolveFrom];
-  }
-  resolveFrom = isValidDate(resolveFrom) ? resolveFrom : void 0;
-  resolveTo = isValidDate(resolveTo) ? resolveTo : void 0;
-  return [resolveFrom, resolveTo];
-}
-function checkBrowser$1() {
-  const agent = navigator.userAgent;
-  if (agent.indexOf("Firefox") !== -1 && parseFloat(agent.substring(agent.indexOf("Firefox") + 8)) >= 3.6) {
-    return "Firefox";
-  } else if (agent.indexOf("Safari") !== -1 && agent.indexOf("Version") !== -1 && parseFloat(agent.substring(agent.indexOf("Version") + 8).split(" ")[0]) >= 5) {
-    return "Safari";
-  }
-  return "Good Browser";
-}
-function getListWithoutNullableValues(...args) {
-  return args.filter(Boolean);
-}
-function hasTimeUnitsInFormat(format) {
-  return /H|h|m|s/.test(format);
-}
-const fillEmptyToDate = (from) => {
-  const diff = from.toUTC().startOf("day").diff(from).toMillis();
-  return diff === 0 ? from.toUTC().endOf("day") : from;
-};
-const b$7 = block("dl-datepicker-calendar");
-const MONTH_NARGIN_BOTTOM = 5;
-const MIN_YEAR = 1e3;
-const MAX_YEAR = 3e3;
-const THRESHOLD = {
-  [TABS.DAY]: 150,
-  [TABS.WEEK]: 150,
-  [TABS.MONTH]: 150,
-  [TABS.QUARTER]: 100,
-  [TABS.YEAR]: 50
-};
-const SHIFT = {
-  [TABS.DAY]: 4,
-  [TABS.WEEK]: 4,
-  [TABS.MONTH]: 48,
-  [TABS.QUARTER]: 344,
-  [TABS.YEAR]: 1008
-};
-const getWarningMessage = ({ from, min, max }) => {
-  const date = min ? min : max;
-  const dateType2 = min ? "min" : "max";
-  const adverb = min ? "less" : "more";
-  return `'from' date (${from.toString()}) is ${adverb} than '${dateType2}' date (${date.toString()})`;
-};
-const getMiddleDate = ({ zone, from, min, max }) => {
-  let middle = from ? from : DateTime.fromObject({ zone });
-  let warningMessage;
-  if (from) {
-    if (max && from > max) {
-      middle = max;
-      warningMessage = getWarningMessage({ from, max });
-    } else if (min && from < min) {
-      middle = min;
-      warningMessage = getWarningMessage({ from, min });
-    }
-  } else if (max) {
-    middle = max;
-  } else if (min) {
-    middle = min;
-  }
-  if (warningMessage) {
-    console.warn(warningMessage);
-  }
-  return middle;
-};
-const getInterval = ({ zone, activeTab, from, min, max, init }) => {
-  const middle = getMiddleDate({ zone, from, min, max });
-  const start = middle.plus({ month: -SHIFT[activeTab] });
-  const end = middle.plus({ month: SHIFT[activeTab] });
-  return {
-    middle,
-    interval: Interval.fromDateTimes(start, end)
-  };
-};
-const getOffsetTop = (calendarNode) => {
-  let offset = 0;
-  if (!calendarNode) {
-    return offset;
-  }
-  let sib = calendarNode.previousSibling;
-  while (sib) {
-    offset += sib.clientHeight;
-    sib = sib.previousSibling;
-  }
-  return offset;
-};
-const getSwitcherDate = ({ zone, nodes, currentScrollTop }) => {
-  let switcherDate = null;
-  nodes.forEach((node) => {
-    const year = node.getAttribute("year");
-    const month = node.getAttribute("month");
-    if (!year || !month) {
-      return;
-    }
-    if (currentScrollTop >= node.offsetTop - node.clientHeight && currentScrollTop < node.offsetTop) {
-      switcherDate = DateTime.fromObject({
-        zone,
-        year: Number(year),
-        month: Number(month)
-      });
-    }
-  });
-  return switcherDate;
-};
-class Calendar extends React__default.Component {
-  static propTypes = {
-    zone: PropTypes.string,
-    activeTab: PropTypes.string,
-    from: PropTypes.object,
-    to: PropTypes.object,
-    min: PropTypes.object,
-    max: PropTypes.object,
-    pick: PropTypes.number,
-    range: PropTypes.bool,
-    scrollCalendar: PropTypes.bool,
-    onDateClick: PropTypes.func,
-    onRangeDateClick: PropTypes.func
-  };
-  static getDerivedStateFromProps(props, state) {
-    const changedState = {
-      prevProps: props
-    };
-    if (props.activeTab !== state.prevProps.activeTab || props.from !== state.prevProps.from && props.scrollCalendar && !state.interval.contains(props.from) || props.max !== state.prevProps.max || props.min !== state.prevProps.min) {
-      const { interval, middle } = getInterval({
-        zone: props.zone,
-        activeTab: props.activeTab,
-        from: props.from,
-        min: props.min,
-        max: props.max
-      });
-      changedState.interval = interval;
-      changedState.middle = middle;
-      changedState.switcherDate = null;
-    }
-    if (props.from !== state.prevProps.from) {
-      changedState.switcherDate = null;
-    }
-    return changedState;
-  }
-  constructor(props) {
-    super(props);
-    const { zone, activeTab, from, min, max } = this.props;
-    this.containerRef = React__default.createRef();
-    this.contentRef = React__default.createRef();
-    const { interval, middle } = getInterval({ zone, activeTab, from, min, max });
-    this.state = {
-      interval,
-      middle,
-      prevProps: this.props,
-      hovered: void 0,
-      switcherDate: middle,
-      switcherOffset: 0
-    };
-  }
-  componentDidMount() {
-    const browser = checkBrowser$1();
-    this.isNeedScrollOffsetHandling = browser === "Safari" || browser === "Firefox";
-    this.containerRef.current.addEventListener("scroll", throttle(this.onScroll, 5));
-    this.scrollTo();
-    this.setState({
-      switcherOffset: getOffsetTop(this.containerRef.current)
-    });
-  }
-  componentDidUpdate(prevProps) {
-    if (this.state.switcherClicked || prevProps.activeTab !== this.props.activeTab || prevProps.from !== this.props.from && this.props.scrollCalendar || prevProps.max !== this.props.max || prevProps.min !== this.props.min) {
-      this.scrollTo();
-    }
-    const switcherOffset = getOffsetTop(this.containerRef.current);
-    if ((switcherOffset || switcherOffset === 0) && switcherOffset !== this.state.switcherOffset) {
-      this.setState({ switcherOffset });
-    }
-  }
-  componentWillUnmount() {
-    this.containerRef.current.removeEventListener("scroll", this.onScroll);
-  }
-  onScroll = (e) => {
-    const container = this.containerRef.current;
-    if (!container) {
-      return;
-    }
-    const { clientHeight, scrollHeight, scrollTop } = e.target;
-    const { zone, activeTab } = this.props;
-    const { interval } = this.state;
-    const changedState = {};
-    const threshold = THRESHOLD[activeTab];
-    let switcherDate = null;
-    let diff;
-    let scrollToTop;
-    if (activeTab === TABS.DAY || activeTab === TABS.WEEK) {
-      switcherDate = getSwitcherDate({
-        zone,
-        nodes: Array.from(e.target.children),
-        currentScrollTop: scrollTop
-      });
-    }
-    if (scrollTop < threshold && interval.start.year >= MIN_YEAR) {
-      scrollToTop = true;
-      container.scrollTop = threshold;
-      const start = interval.start.plus({ month: -SHIFT[activeTab] });
-      const end = interval.end.plus({ month: -SHIFT[activeTab] });
-      changedState.interval = Interval.fromDateTimes(start, end);
-      changedState.switcherDate = null;
-      diff = changedState.interval.difference(this.state.interval);
-    }
-    if (scrollTop + clientHeight > scrollHeight - threshold && interval.end.year <= MAX_YEAR) {
-      container.scrollTop = scrollHeight - threshold - clientHeight;
-      const start = interval.start.plus({ month: SHIFT[activeTab] });
-      const end = interval.end.plus({ month: SHIFT[activeTab] });
-      changedState.interval = Interval.fromDateTimes(start, end);
-      changedState.switcherDate = null;
-      diff = changedState.interval.difference(this.state.interval);
-    }
-    if (!this.state.switcherDate || switcherDate && this.state.switcherDate && switcherDate.year !== this.state.switcherDate.year) {
-      changedState.switcherDate = switcherDate;
-    }
-    if (Object.keys(changedState).length) {
-      this.setState(changedState, () => {
-        if (changedState.interval && this.isNeedScrollOffsetHandling) {
-          switch (activeTab) {
-            case TABS.DAY:
-            case TABS.WEEK: {
-              let browserOffset = 0;
-              Array.from(container.children).forEach((node) => {
-                const year = node.getAttribute("year");
-                const month = node.getAttribute("month");
-                const dateTime = DateTime.fromObject({
-                  zone,
-                  year: Number(year),
-                  month: Number(month)
-                });
-                if (diff[0].start.startOf("month") <= dateTime && diff[0].end >= dateTime) {
-                  browserOffset += node.offsetHeight + MONTH_NARGIN_BOTTOM;
-                }
-              });
-              if (scrollToTop) {
-                this.containerRef.current.scrollTop = browserOffset;
-              } else {
-                this.containerRef.current.scrollTop = this.containerRef.current.scrollHeight - clientHeight - browserOffset;
-              }
-              break;
-            }
-            case TABS.MONTH: {
-              if (scrollToTop) {
-                this.containerRef.current.scrollTop = 317 * 3 - 34;
-              } else {
-                this.containerRef.current.scrollTop = scrollHeight - 317 * 3 - 198;
-              }
-              break;
-            }
-            case TABS.QUARTER: {
-              if (scrollToTop) {
-                this.containerRef.current.scrollTop = this.containerRef.current.scrollHeight / 2 + 74;
-              } else {
-                this.containerRef.current.scrollTop = this.containerRef.current.scrollHeight / 2 - 312;
-              }
-              break;
-            }
-            case TABS.YEAR: {
-              if (scrollToTop) {
-                this.containerRef.current.scrollTop = this.containerRef.current.scrollHeight / 2 + 50;
-              } else {
-                this.containerRef.current.scrollTop = this.containerRef.current.scrollHeight / 2 - 284;
-              }
-            }
-          }
-        }
-      });
-    }
-  };
-  scrollTo = () => {
-    const container = this.containerRef.current;
-    const content = this.contentRef.current;
-    if (!content) {
-      return;
-    }
-    const nodeToScroll = content.scrollRef.current;
-    if (!nodeToScroll) {
-      return;
-    }
-    const offset = getOffsetTop(container);
-    container.scrollTop = nodeToScroll.offsetTop - offset;
-  };
-  onSwitcherClick = (middleShift) => {
-    const { zone, activeTab, from } = this.props;
-    let switcherDate = null;
-    if (this.state.switcherDate) {
-      switcherDate = this.state.switcherDate;
-    } else {
-      switcherDate = from ? from : DateTime.fromObject({ zone });
-    }
-    const middle = switcherDate.plus({ month: middleShift });
-    const start = middle.plus({ month: -SHIFT[activeTab] });
-    const end = middle.plus({ month: SHIFT[activeTab] });
-    this.setState(
-      {
-        interval: Interval.fromDateTimes(start, end),
-        switcherDate: middle,
-        switcherClicked: true
-      },
-      () => this.setState({ switcherClicked: false })
-    );
-  };
-  getMouseOverHandler() {
-    const { zone, activeTab, range } = this.props;
-    switch (activeTab) {
-      case TABS.DAY: {
-        return range ? this.onDayMouseOver : null;
-      }
-      case TABS.WEEK: {
-        return this.onWeekMouseOver;
-      }
-      default: {
-        return (e) => {
-          const { from, to, pick } = this.props;
-          const range2 = e.target.getAttribute("range");
-          if (!range2 || !from || !to || !pick) {
-            if (this.state.hovered && !pick) {
-              this.setState({ hovered: void 0 });
-            }
-            return;
-          }
-          const hovered = Interval.fromDateTimes(from, to).union(
-            Interval.fromISO(range2, { zone })
-          );
-          if (!this.state.hovered || !hovered.equals(this.state.hovered)) {
-            this.setState({ hovered });
-          }
-        };
-      }
-    }
-  }
-  onDayMouseOver = (e) => {
-    const { from, to, zone } = this.props;
-    const date = e.target.getAttribute("date");
-    if (!date || !from || to) {
-      if (this.state.hovered && to) {
-        this.setState({ hovered: void 0 });
-      }
-      return;
-    }
-    const dateTime = DateTime.fromISO(date, { zone });
-    let hovered;
-    if (from < dateTime) {
-      hovered = Interval.fromDateTimes(from, dateTime.endOf("day"));
-    } else {
-      hovered = Interval.fromDateTimes(dateTime, from.endOf("day"));
-    }
-    if (!this.state.hovered || !hovered.equals(this.state.hovered)) {
-      this.setState({ hovered });
-    }
-  };
-  onWeekMouseOver = (e) => {
-    const { zone } = this.props;
-    const date = e.target.getAttribute("date");
-    if (!date) {
-      return;
-    }
-    const dateTime = DateTime.fromISO(date, { zone });
-    const monday = dateTime.startOf("week");
-    const sunday = dateTime.endOf("week");
-    const hovered = Interval.fromDateTimes(monday, sunday);
-    if (!this.state.hovered || !hovered.equals(this.state.hovered)) {
-      this.setState({ hovered });
-    }
-  };
-  onMouseLeave = () => {
-    if (this.state.hovered) {
-      this.setState({ hovered: void 0 });
-    }
-  };
-  renderDayContent() {
-    const { zone, activeTab, to, min, max } = this.props;
-    const { switcherDate, hovered } = this.state;
-    const months = [];
-    const from = this.props.from ? this.props.from : DateTime.fromObject({ zone });
-    const isDefaultFrom = !this.props.from;
-    let interval = this.state.interval;
-    let start = interval.start;
-    const selectedInterval = to ? Interval.fromDateTimes(from.startOf("day"), to.endOf("day")) : Interval.fromDateTimes(from.startOf("day"), from.endOf("day"));
-    while (start) {
-      let isNeedScroll;
-      if (switcherDate) {
-        isNeedScroll = switcherDate.month === start.month && switcherDate.year === start.year;
-      } else if (isDefaultFrom && max) {
-        isNeedScroll = max.month === start.month && max.year === start.year;
-      } else {
-        isNeedScroll = from.month === start.month && from.year === start.year;
-      }
-      months.push(
-        /* @__PURE__ */ React__default.createElement(
-          Month,
-          {
-            ...isNeedScroll && { ref: this.contentRef },
-            key: `month-${start.month}-${start.year}`,
-            year: start.year,
-            month: start.month,
-            from,
-            to,
-            min: min && min.startOf("day"),
-            max,
-            zone,
-            selectedInterval,
-            hovered,
-            isDefaultFrom,
-            isNeedScroll,
-            onDateClick: this.props.onDateClick,
-            onRangeDateClick: activeTab === TABS.WEEK ? this.props.onRangeDateClick : void 0
-          }
-        )
-      );
-      interval = interval.set({ start: start.plus({ month: 1 }) });
-      start = interval.start;
-    }
-    return months;
-  }
-  renderMonthContent() {
-    const { to, min, max, zone } = this.props;
-    const { hovered, middle } = this.state;
-    const years = [];
-    const from = this.props.from ? this.props.from : DateTime.fromObject({ zone });
-    let interval = this.state.interval;
-    let start = interval.start;
-    const selectedInterval = from && to && Interval.fromDateTimes(from, to);
-    while (start) {
-      const isNeedScroll = middle.year === start.year;
-      years.push(
-        /* @__PURE__ */ React__default.createElement(
-          Months,
-          {
-            ...isNeedScroll && { ref: this.contentRef },
-            key: `year-${start.year}`,
-            year: start.year,
-            from,
-            to,
-            min,
-            max,
-            zone,
-            selectedInterval,
-            hovered,
-            isNeedScroll,
-            onRangeDateClick: this.props.onRangeDateClick
-          }
-        )
-      );
-      interval = interval.set({ start: start.plus({ month: 12 }) });
-      start = interval.start;
-    }
-    return years;
-  }
-  renderQuartersContent() {
-    const { to, min, max, zone } = this.props;
-    const { hovered, middle } = this.state;
-    const years = [];
-    const from = this.props.from ? this.props.from : DateTime.fromObject({ zone });
-    let interval = this.state.interval;
-    let start = interval.start;
-    const selectedInterval = from && to && Interval.fromDateTimes(from, to);
-    while (start) {
-      const isNeedScroll = middle.year === start.year;
-      years.push(
-        /* @__PURE__ */ React__default.createElement(
-          Quarters,
-          {
-            ...isNeedScroll && { ref: this.contentRef },
-            key: `quarter-year-${start.year}`,
-            year: start.year,
-            from,
-            to,
-            min,
-            max,
-            zone,
-            selectedInterval,
-            hovered,
-            isNeedScroll,
-            onRangeDateClick: this.props.onRangeDateClick
-          }
-        )
-      );
-      interval = interval.set({ start: start.plus({ month: 12 }) });
-      start = interval.start;
-    }
-    return years;
-  }
-  renderYearsContent() {
-    const { to, min, max, zone } = this.props;
-    const { hovered, middle } = this.state;
-    const from = this.props.from ? this.props.from : DateTime.fromObject({ zone });
-    const isDefaultFrom = !this.props.from;
-    const selectedInterval = from && to && Interval.fromDateTimes(from, to);
-    const yearsCount = this.state.interval.length("years");
-    const startYear = this.state.interval.start.year;
-    return /* @__PURE__ */ React__default.createElement(
-      Years,
-      {
-        ref: this.contentRef,
-        years: _range(startYear, startYear + yearsCount),
-        from,
-        to,
-        min,
-        max,
-        middle,
-        zone,
-        isDefaultFrom,
-        selectedInterval,
-        hovered,
-        onRangeDateClick: this.props.onRangeDateClick
-      }
-    );
-  }
-  // eslint-disable-next-line consistent-return
-  renderContent() {
-    const { activeTab } = this.props;
-    switch (activeTab) {
-      case TABS.DAY:
-      case TABS.WEEK: {
-        return this.renderDayContent();
-      }
-      case TABS.MONTH: {
-        return this.renderMonthContent();
-      }
-      case TABS.QUARTER: {
-        return this.renderQuartersContent();
-      }
-      case TABS.YEAR: {
-        return this.renderYearsContent();
-      }
-    }
-  }
-  render() {
-    const { activeTab } = this.props;
-    const { switcherDate, switcherOffset } = this.state;
-    return /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        ref: this.containerRef,
-        className: b$7(),
-        onMouseOver: this.getMouseOverHandler(),
-        onMouseLeave: this.onMouseLeave
-      },
-      /* @__PURE__ */ React__default.createElement(
-        YearSwitcher,
-        {
-          switcherDate,
-          offsetTop: switcherOffset,
-          onShiftMonths: this.onSwitcherClick,
-          visible: activeTab === TABS.DAY || activeTab === TABS.WEEK
-        }
-      ),
-      this.renderContent()
-    );
-  }
-}
-const b$6 = block("dl-datepicker-presets");
-class Presets extends React__default.PureComponent {
-  static propTypes = {
-    zone: PropTypes.string,
-    activeTab: PropTypes.string,
-    range: PropTypes.bool,
-    onRangeDateClick: PropTypes.func
-  };
-  renderPresetItem({ title, start, end }) {
-    const presetTitle = typeof title === "function" ? title() : title;
-    return /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        key: presetTitle,
-        className: b$6("item"),
-        onClick: () => this.props.onRangeDateClick({
-          start,
-          end,
-          isAllRangePicked: true,
-          scrollCalendar: true
-        })
-      },
-      presetTitle
-    );
-  }
-  render() {
-    const { zone, activeTab, range } = this.props;
-    return /* @__PURE__ */ React__default.createElement("div", { className: b$6() }, getDefaultPreset({ zone, activeTab, range }).map(
-      (preset) => this.renderPresetItem(preset)
-    ));
-  }
-}
-const i18n$1 = I18n.keyset("components.common.Datepicker");
-const b$5 = block("dl-datepicker-popup-content");
-class PopupContent extends React__default.PureComponent {
-  static propTypes = {
-    from: PropTypes.object,
-    to: PropTypes.object,
-    min: PropTypes.object,
-    max: PropTypes.object,
-    zone: PropTypes.string,
-    activeTab: PropTypes.string,
-    mod: PropTypes.string,
-    pick: PropTypes.number,
-    range: PropTypes.bool,
-    scrollCalendar: PropTypes.bool,
-    showTabs: PropTypes.bool,
-    showApply: PropTypes.bool,
-    onDateClick: PropTypes.func,
-    onRangeDateClick: PropTypes.func,
-    onSelectTab: PropTypes.func,
-    onSubmit: PropTypes.func
-  };
-  render() {
-    const {
-      from,
-      to,
-      min,
-      max,
-      zone,
-      activeTab,
-      mod,
-      pick,
-      range,
-      scrollCalendar,
-      showTabs,
-      showApply
-    } = this.props;
-    return /* @__PURE__ */ React__default.createElement("div", { className: b$5(null, mod) }, showTabs && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", { className: b$5("tabs") }, /* @__PURE__ */ React__default.createElement(TabProvider, { value: activeTab, onUpdate: this.props.onSelectTab }, /* @__PURE__ */ React__default.createElement(TabList, null, getTabs().map((item) => /* @__PURE__ */ React__default.createElement(Tab, { key: item.id, value: item.id }, item.title))))), range && /* @__PURE__ */ React__default.createElement(
-      Presets,
-      {
-        zone,
-        activeTab,
-        range,
-        onRangeDateClick: this.props.onRangeDateClick
-      }
-    )), /* @__PURE__ */ React__default.createElement(
-      Calendar,
-      {
-        from,
-        to,
-        min,
-        max,
-        zone,
-        activeTab,
-        pick,
-        range,
-        scrollCalendar,
-        onDateClick: this.props.onDateClick,
-        onRangeDateClick: this.props.onRangeDateClick
-      }
-    ), showApply && /* @__PURE__ */ React__default.createElement("div", { className: b$5("apply-btn") }, /* @__PURE__ */ React__default.createElement(Button, { view: "action", size: "l", width: "max", onClick: this.props.onSubmit }, i18n$1("apply_button_text"))));
-  }
-}
-const i18n = I18n.keyset("components.common.Datepicker");
-const b$4 = block("dl-datepicker");
-const dateType = PropTypes.oneOfType([PropTypes.string, PropTypes.number]);
-const getModifier$1 = (name) => b$4({ [name]: true }).split(" ")[1];
-const datepickerDefaultProps = {
-  format: DISPLAY_FORMAT.DATE,
-  outputFormat: OUTPUT_FORMAT.DATETIME,
-  range: true,
-  allowNullableValues: false,
-  showApply: false,
-  hasClear: true,
-  disabled: false,
-  controlSize: "m",
-  fillPartialInterval: false
-};
-class Datepicker extends React__default.PureComponent {
-  static propTypes = {
-    onUpdate: PropTypes.func.isRequired,
-    onError: PropTypes.func,
-    from: dateType,
-    to: dateType,
-    min: dateType,
-    max: dateType,
-    format: PropTypes.string,
-    emptyValueText: PropTypes.string,
-    placeholder: PropTypes.string,
-    timezoneOffset: PropTypes.number,
-    outputFormat: PropTypes.oneOf([OUTPUT_FORMAT.DATE, OUTPUT_FORMAT.DATETIME]),
-    scale: PropTypes.oneOf([TABS.DAY, TABS.WEEK, TABS.MONTH, TABS.QUARTER, TABS.YEAR]),
-    controlWidth: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-    range: PropTypes.bool,
-    allowNullableValues: PropTypes.bool,
-    showApply: PropTypes.bool,
-    hasClear: PropTypes.bool,
-    disabled: PropTypes.bool,
-    controlSize: PropTypes.oneOf(["s", "m", "l", "xl"]),
-    className: PropTypes.string,
-    popupClassName: PropTypes.string,
-    required: PropTypes.bool,
-    hasValidationError: PropTypes.bool,
-    fillPartialInterval: PropTypes.bool,
-    label: PropTypes.string
-  };
-  static defaultProps = datepickerDefaultProps;
-  static getDerivedStateFromProps(props, state) {
-    const changedState = {};
-    const zone = getZone(props.timezoneOffset);
-    if (props.from !== state.prevProps.from || props.to !== state.prevProps.to || props.timezoneOffset !== state.prevProps.timezoneOffset) {
-      changedState.from = createDateTime({ date: props.from, zone });
-      changedState.to = createDateTime({ date: props.to, zone });
-      [changedState.from, changedState.to] = resolveDates({
-        from: changedState.from,
-        to: changedState.to
-      });
-      changedState.searchText = getSearchText({
-        from: changedState.from,
-        to: changedState.to,
-        format: props.format,
-        emptyValueText: props.emptyValueText,
-        range: props.range,
-        required: props.required
-      });
-      changedState.zone = zone;
-      changedState.lastValidHash = getHashedData({
-        from: changedState.from,
-        to: changedState.to
-      });
-    }
-    if (props.min !== state.prevProps.min) {
-      const min = createDateTime({ date: props.min, zone });
-      changedState.min = isValidDate(min) ? min : void 0;
-    }
-    if (props.max !== state.prevProps.max) {
-      const max = createDateTime({ date: props.max, zone });
-      changedState.max = isValidDate(max) ? max : void 0;
-    }
-    if (props.disabled && !state.prevProps.disabled) {
-      changedState.error = "";
-    }
-    changedState.prevProps = props;
-    return changedState;
-  }
-  constructor(props) {
-    super(props);
-    const { format, timezoneOffset, emptyValueText, range, required } = this.props;
-    const zone = getZone(timezoneOffset);
-    let from = createDateTime({ date: this.props.from, zone });
-    let to = createDateTime({ date: this.props.to, zone });
-    const min = createDateTime({ date: this.props.min, zone });
-    const max = createDateTime({ date: this.props.max, zone });
-    [from, to] = resolveDates({ from, to });
-    const searchText = getSearchText({
-      from,
-      to,
-      format,
-      emptyValueText,
-      range,
-      required
-    });
-    this.ControlNodeRef = React__default.createRef();
-    this.state = {
-      searchText,
-      from,
-      to,
-      zone,
-      min: isValidDate(min) ? min : void 0,
-      max: isValidDate(max) ? max : void 0,
-      lastValidHash: getHashedData({ from, to }),
-      prevProps: this.props,
-      activeTab: "day",
-      pick: 0,
-      error: "",
-      active: false
-    };
-  }
-  static SCALE = TABS;
-  static DISPLAY_FORMAT = DISPLAY_FORMAT;
-  static OUTPUT_FORMAT = OUTPUT_FORMAT;
-  get placeholder() {
-    const { format, range, placeholder } = this.props;
-    if (placeholder) {
-      return placeholder;
-    }
-    const placeholderPart = getPlaceholder(format);
-    return `${placeholderPart}${range ? ` - ${placeholderPart}` : ""}`;
-  }
-  isInvalidState() {
-    const { range, allowNullableValues } = this.props;
-    const { invalidInput, from, to } = this.state;
-    if (allowNullableValues) {
-      return invalidInput;
-    }
-    if (range) {
-      return !from || !to || invalidInput;
-    }
-    return !from || invalidInput;
-  }
-  getErrorText() {
-    const { range, onError } = this.props;
-    if (!this.isInvalidState() || onError) {
-      return "";
-    }
-    return range ? i18n("error_dates_range") : i18n("error_date");
-  }
-  onSelectTab = (activeTab) => {
-    this.setState({
-      activeTab,
-      pick: 0
-    });
-  };
-  onDateClick = ({ dateTime }) => {
-    const state = {
-      pick: 0,
-      error: "",
-      invalidInput: false,
-      scrollCalendar: false
-    };
-    if (this.state.from && this.state.to || this.state.from && !this.props.range) {
-      state.from = dateTime;
-      state.to = void 0;
-    } else if (!this.state.from && !this.state.to) {
-      state.from = dateTime;
-    } else {
-      const isStartBeforeDateTime = this.state.from < dateTime;
-      if (isStartBeforeDateTime) {
-        state.from = this.state.from;
-        state.to = dateTime;
-      } else {
-        state.from = dateTime;
-        state.to = this.state.from;
-      }
-    }
-    if (state.to) {
-      state.to = state.to.endOf("day");
-    }
-    state.searchText = getSearchText({
-      from: state.from,
-      to: state.to,
-      format: this.props.format,
-      emptyValueText: this.props.emptyValueText,
-      range: this.props.range,
-      required: this.props.required
-    });
-    this.setState(state, () => {
-      const { range, showApply } = this.props;
-      const { from, to } = this.state;
-      if (!showApply && range && from && to || !showApply && !range && from) {
-        this.onUpdate();
-      }
-    });
-  };
-  onRangeDateClick = ({ start, end, isAllRangePicked, scrollCalendar }) => {
-    const { range } = this.props;
-    let pick = this.state.pick + 1;
-    let from, to;
-    switch (true) {
-      case (pick === 1 || isAllRangePicked || !range): {
-        from = start;
-        to = end;
-        if (isAllRangePicked || !range) {
-          pick = 0;
-        }
-        break;
-      }
-      case pick === 2: {
-        const dates = getListWithoutNullableValues(
-          start,
-          end,
-          this.state.from,
-          this.state.to
-        );
-        from = DateTime.min(...dates);
-        to = DateTime.max(...dates);
-        pick = 0;
-        break;
-      }
-    }
-    if (to) {
-      to = to.endOf("day");
-    }
-    const searchText = getSearchText({
-      from,
-      to,
-      format: this.props.format,
-      emptyValueText: this.props.emptyValueText,
-      range: this.props.range,
-      required: this.props.required
-    });
-    this.setState(
-      {
-        searchText,
-        pick,
-        from,
-        to,
-        scrollCalendar,
-        error: "",
-        invalidInput: false
-      },
-      () => {
-        const { showApply } = this.props;
-        const { from: from2, to: to2, pick: pick2 } = this.state;
-        if (!showApply && from2 && to2 && pick2 === 0) {
-          this.onUpdate();
-        }
-      }
-    );
-  };
-  onInputUpdate = (searchText) => {
-    const { format, range } = this.props;
-    const { zone } = this.state;
-    const dates = searchText.split(/\s-\s?/);
-    let from;
-    let to;
-    let isFromValid = true;
-    let isToValid = true;
-    if (dates[0]) {
-      from = DateTime.fromFormat(dates[0].trim(), format, { zone });
-      isFromValid = isValidDate(from);
-    }
-    if (dates[1] && dates[1] !== this.props.emptyValueText) {
-      to = DateTime.fromFormat(dates[1].trim(), format, { zone });
-      isToValid = isValidDate(to);
-    }
-    if (range) {
-      [from, to] = resolveDates({ from, to });
-      if (to && !hasTimeUnitsInFormat(format)) {
-        to = to.endOf("day");
-      }
-    }
-    if (!isFromValid || !isToValid) {
-      this.setState({
-        searchText,
-        invalidInput: true
-      });
-      return;
-    }
-    const resetPickCounter = !searchText || range && !to;
-    this.setState(
-      {
-        searchText,
-        from,
-        to: range ? to : void 0,
-        error: "",
-        invalidInput: false,
-        ...resetPickCounter ? { pick: 0 } : {}
-      },
-      () => {
-        if (!from && !to) {
-          this.ControlNodeRef.current.focus();
-        }
-      }
-    );
-  };
-  onInputKeyPress = (e) => {
-    switch (e.key) {
-      case "Enter": {
-        this.ControlNodeRef.current.blur();
-        this.onUpdate();
-        break;
-      }
-    }
-  };
-  onInputFocus = () => {
-    if (!this.state.active) {
-      this.setState({ active: true });
-    }
-  };
-  onClose = () => {
-    if (document.activeElement === this.ControlNodeRef.current) {
-      return;
-    }
-    const { format, emptyValueText, range, required } = this.props;
-    const { from, to, lastValidHash } = this.state;
-    const currentHash = getHashedData({ from, to });
-    if (lastValidHash === currentHash) {
-      const searchText = getSearchText({
-        from,
-        to,
-        format,
-        emptyValueText,
-        range,
-        required
-      });
-      this.setState({ searchText, active: false });
-    } else {
-      this.onUpdate();
-    }
-  };
-  onUpdate = () => {
-    const { allowNullableValues, onError, fillPartialInterval } = this.props;
-    const { min, max } = this.state;
-    if (this.isInvalidState()) {
-      this.setState(
-        {
-          error: this.getErrorText(),
-          active: false
-        },
-        () => onError && onError()
-      );
-      return;
-    }
-    let from = this.state.from;
-    let to = this.state.to;
-    if (min && from && from < min) {
-      from = min;
-    }
-    if (min && to && from < min) {
-      to = min;
-    }
-    if (max && from && from > max) {
-      from = max;
-    }
-    if (max && to && to > max) {
-      to = max;
-    }
-    [from, to] = resolveDates({ from, to });
-    if (fillPartialInterval && from && !to) {
-      to = fillEmptyToDate(from);
-    }
-    const searchText = getSearchText({
-      from,
-      to,
-      format: this.props.format,
-      emptyValueText: this.props.emptyValueText,
-      range: this.props.range,
-      required: this.props.required
-    });
-    this.ControlNodeRef.current.blur();
-    const showSearchText = Boolean(allowNullableValues || from && to);
-    this.setState(
-      {
-        from,
-        to,
-        active: false,
-        lastValidHash: getHashedData({ from, to }),
-        ...showSearchText ? { searchText } : {}
-      },
-      () => {
-        const { range, outputFormat } = this.props;
-        let outputFrom = null;
-        let outputTo = null;
-        if (from) {
-          outputFrom = outputFormat === OUTPUT_FORMAT.DATE ? from.toISODate() : from.toISO();
-        }
-        if (range && to) {
-          outputTo = outputFormat === OUTPUT_FORMAT.DATE ? to.toISODate() : to.toISO();
-        }
-        this.props.onUpdate({
-          from: outputFrom,
-          to: outputTo
-        });
-      }
-    );
-  };
-  renderContent(mobile) {
-    const { scale, range, showApply } = this.props;
-    const { from, to, min, max, zone, activeTab, pick, scrollCalendar } = this.state;
-    const mod = mobile ? getModifier$1("mobile") : getModifier$1("desktop");
-    return /* @__PURE__ */ React__default.createElement(
-      PopupContent,
-      {
-        from,
-        to,
-        min,
-        max,
-        zone,
-        activeTab: scale || activeTab,
-        mod,
-        pick,
-        range,
-        scrollCalendar,
-        showTabs: !scale,
-        showApply,
-        onDateClick: this.onDateClick,
-        onRangeDateClick: this.onRangeDateClick,
-        onSelectTab: this.onSelectTab,
-        onSubmit: this.onUpdate
-      }
-    );
-  }
-  render() {
-    const {
-      controlWidth,
-      hasClear,
-      disabled,
-      controlSize,
-      className,
-      popupClassName,
-      hasValidationError,
-      label
-    } = this.props;
-    const { searchText, active, error, from } = this.state;
-    const hasPlaceholderError = hasValidationError && !from;
-    return /* @__PURE__ */ React__default.createElement(MobileContext.Consumer, null, ({ mobile }) => /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        className: b$4("control", className),
-        ...controlWidth ? {
-          style: {
-            width: controlWidth
-          }
-        } : {}
-      },
-      /* @__PURE__ */ React__default.createElement(FieldWrapper, { error }, /* @__PURE__ */ React__default.createElement(
-        TextInput,
-        {
-          value: searchText,
-          size: controlSize,
-          placeholder: this.placeholder,
-          hasClear: hasClear && !mobile,
-          disabled,
-          onUpdate: this.onInputUpdate,
-          onFocus: this.onInputFocus,
-          onKeyDown: this.onInputKeyPress,
-          controlRef: this.ControlNodeRef,
-          error: hasValidationError,
-          controlProps: {
-            className: b$4("input", { error: hasPlaceholderError })
-          },
-          label
-        }
-      ), mobile && /* @__PURE__ */ React__default.createElement(
-        "div",
-        {
-          className: b$4("control-veil"),
-          onClick: this.onInputFocus
-        }
-      ))
-    ), mobile ? /* @__PURE__ */ React__default.createElement(
-      Sheet,
-      {
-        id: "datepicker",
-        visible: active && !disabled,
-        contentClassName: b$4("sheet"),
-        allowHideOnContentScroll: false,
-        onClose: this.onClose
-      },
-      this.renderContent(mobile)
-    ) : /* @__PURE__ */ React__default.createElement(
-      Popup,
-      {
-        contentClassName: b$4("popup", popupClassName),
-        open: active && !disabled,
-        anchorElement: this.ControlNodeRef.current,
-        placement: AVAILABLE_POPUP_PLACEMENT,
-        onOpenChange: (open) => {
-          if (!open) {
-            this.onClose();
-          }
-        },
-        returnFocus: false
-      },
-      /* @__PURE__ */ React__default.createElement("div", { className: b$4("popup-content") }, this.renderContent(mobile))
-    )));
-  }
-}
-const DatepickerControl = ({ widgetId: _id, ...otherProps }) => {
-  return /* @__PURE__ */ jsx(Datepicker, { ...otherProps });
-};
-const trans$4 = I18n.keyset("components.common.YCSelect");
-const MULTIPLE_MIN_WIDTH = 150;
-const WITH_SEARCH_MIN_WIDTH = 170;
-const WITH_SEARCH_MULTIPLE_MIN_WIDTH = 200;
-function checkBrowser() {
-  const agent = navigator.userAgent;
-  if (agent.indexOf("Firefox") !== -1 && parseFloat(agent.substring(agent.indexOf("Firefox") + 8)) >= 3.6) {
-    return "Firefox";
-  } else if (agent.indexOf("Safari") !== -1 && agent.indexOf("Version") !== -1 && parseFloat(agent.substring(agent.indexOf("Version") + 8).split(" ")[0]) >= 5) {
-    return "Safari";
-  }
-  return "Good Browser";
-}
-function getEscapedRegExp(string) {
-  return new RegExp(string.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&"), "i");
-}
-function getTitleValue(title) {
-  if (title === null) {
-    return trans$4("null");
-  }
-  if (title === "") {
-    return trans$4("empty_string");
-  }
-  return title;
-}
-function isFalsy(value) {
-  return !value && value !== 0;
-}
-function getPossiblePopupMinWidth({ withSearch, multiple }) {
-  let possibleMinWidth;
-  if (withSearch && multiple) {
-    possibleMinWidth = WITH_SEARCH_MULTIPLE_MIN_WIDTH;
-  } else if (withSearch) {
-    possibleMinWidth = WITH_SEARCH_MIN_WIDTH;
-  } else if (multiple) {
-    possibleMinWidth = MULTIPLE_MIN_WIDTH;
-  }
-  return possibleMinWidth;
-}
-const trans$3 = I18n.keyset("components.common.YCSelect");
-const b$3 = block("yc-select-item");
-const bWrap = block("yc-select-item-wrap");
-const ACTION_WIDTH = 80;
-const DESKTOP_TICK_ICON_SIZE = 16;
-const MOBILE_TICK_ICON_SIZE = 14;
-const SWIPE_DIR = {
-  LEFT: "left",
-  RIGHT: "right"
-};
-class Item extends React__default.PureComponent {
-  static propTypes = {
-    onItemClick: PropTypes.func,
-    selectOnlyCurrentItem: PropTypes.func,
-    getTouchedItem: PropTypes.func,
-    setTouchedItem: PropTypes.func,
-    selectType: PropTypes.string,
-    showItemIcon: PropTypes.bool,
-    showItemMeta: PropTypes.bool,
-    isSelected: PropTypes.bool,
-    mobile: PropTypes.bool,
-    item: PropTypes.object,
-    selectedCurrentItem: PropTypes.object,
-    style: PropTypes.object
-  };
-  state = {
-    startX: 0,
-    deltaX: 0,
-    actionNodes: [],
-    swipeDirection: null,
-    opening: false
-  };
-  componentDidMount() {
-    const actionNodes = [];
-    if (this._linkButtonRef.current) {
-      actionNodes.push(this._linkButtonRef.current);
-    }
-    if (this._onlyButtonRef.current) {
-      actionNodes.push(this._onlyButtonRef.current);
-    }
-    this.setState({ actionNodes });
-  }
-  _itemRef = React__default.createRef();
-  _onlyButtonRef = React__default.createRef();
-  _linkButtonRef = React__default.createRef();
-  _publishEvent = eventBroker.withEventPublisher("Select");
-  get height() {
-    if (this._itemRef.current) {
-      return this._itemRef.current.getBoundingClientRect().height;
-    }
-    return void 0;
-  }
-  get prevLeft() {
-    if (this._itemRef.current && this._itemRef.current.style.left) {
-      return parseFloat(this._itemRef.current.style.left);
-    }
-    return 0;
-  }
-  _handleTouchedItem = () => {
-    const { item, actions } = this.props.getTouchedItem();
-    if (item && item !== this._itemRef.current) {
-      item.style.left = "0px";
-      actions.forEach((node) => {
-        node.style.right = `${-ACTION_WIDTH}px`;
-      });
-    }
-    this.props.setTouchedItem({
-      item: this._itemRef.current,
-      actions: this.state.actionNodes
-    });
-  };
-  _handleItemMovement = (deltaX) => {
-    const { actionNodes, opening } = this.state;
-    const preparedDeltaX = deltaX * actionNodes.length;
-    let left;
-    if (opening) {
-      left = preparedDeltaX;
-      if (left > 0) {
-        left = 0;
-      } else if (Math.abs(left) > actionNodes.length * ACTION_WIDTH) {
-        left = -actionNodes.length * ACTION_WIDTH;
-      }
-    } else {
-      left = -actionNodes.length * ACTION_WIDTH + preparedDeltaX;
-      if (left > 0) {
-        left = 0;
-      } else if (left < -actionNodes.length * ACTION_WIDTH) {
-        left = -actionNodes.length * ACTION_WIDTH;
-      }
-    }
-    this._itemRef.current.style.left = `${left}px`;
-  };
-  _handleActionsMovement = (deltaX) => {
-    this.state.actionNodes.forEach((node, index) => {
-      const preparedDeltaX = deltaX * (index + 1);
-      const rightBound = ACTION_WIDTH * index;
-      let right;
-      if (this.state.opening) {
-        right = Math.abs(preparedDeltaX) - ACTION_WIDTH;
-      } else {
-        right = rightBound - preparedDeltaX;
-      }
-      if (right > rightBound) {
-        right = rightBound;
-      } else if (right < -ACTION_WIDTH) {
-        right = -ACTION_WIDTH;
-      }
-      node.style.right = `${right}px`;
-    });
-  };
-  _setItemToExtremePosition = () => {
-    const { actionNodes, swipeDirection } = this.state;
-    if (!this._itemRef.current) {
-      return;
-    }
-    const left = swipeDirection === SWIPE_DIR.LEFT ? -actionNodes.length * ACTION_WIDTH : 0;
-    this._itemRef.current.style.left = `${left}px`;
-  };
-  _setActionsToExtremePosition = () => {
-    const { actionNodes, swipeDirection } = this.state;
-    actionNodes.forEach((node, index) => {
-      const right = swipeDirection === SWIPE_DIR.LEFT ? ACTION_WIDTH * index : -ACTION_WIDTH;
-      node.style.right = `${right}px`;
-    });
-  };
-  _onOnlyButtonClick = (e) => {
-    const { item, selectOnlyCurrentItem } = this.props;
-    e.stopPropagation();
-    selectOnlyCurrentItem(item);
-  };
-  _onItemClick = () => this.props.onItemClick(this.props.item);
-  _onItemClickCapture = (e) => {
-    const {
-      item: { value }
-    } = this.props;
-    this._publishEvent({
-      eventId: "select",
-      domEvent: e,
-      meta: {
-        valueHash: md5(value)
-      }
-    });
-  };
-  _onTouchStart = (e) => {
-    this._handleTouchedItem();
-    this.setState({
-      startX: e.nativeEvent.touches[0].clientX,
-      opening: this.prevLeft === 0
-    });
-  };
-  _onTouchMove = (e) => {
-    const deltaX = e.nativeEvent.touches[0].clientX - this.state.startX;
-    const swipeDirection = this.state.deltaX > deltaX ? SWIPE_DIR.LEFT : SWIPE_DIR.RIGHT;
-    const handleMovement = !(this.state.opening && deltaX > 0);
-    if (handleMovement) {
-      this._handleItemMovement(deltaX);
-      this._handleActionsMovement(deltaX);
-    }
-    this.setState({ deltaX, swipeDirection });
-  };
-  _onTouchEnd = () => {
-    const endDeltaX = this.state.deltaX;
-    this.setState(
-      {
-        startX: 0,
-        deltaX: 0,
-        opening: false
-      },
-      () => {
-        if (endDeltaX === 0) {
-          return;
-        }
-        this._setItemToExtremePosition();
-        this._setActionsToExtremePosition();
-      }
-    );
-  };
-  _renderItemIcon() {
-    const {
-      showItemIcon,
-      showItemMeta,
-      item: { icon }
-    } = this.props;
-    if (!showItemIcon || !icon) {
-      return null;
-    }
-    const mods = {
-      small: !showItemMeta,
-      large: showItemMeta
-    };
-    return /* @__PURE__ */ React__default.createElement("div", { className: b$3("icon", mods) }, icon);
-  }
-  _renderItemInfo() {
-    const {
-      item: { title, meta, hint },
-      showItemMeta
-    } = this.props;
-    const titleValue = getTitleValue(title);
-    return /* @__PURE__ */ React__default.createElement("div", { className: b$3("info") }, /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        className: b$3("title", { secondary: title === "" || title === null }),
-        title: hint ?? (typeof titleValue === "string" && titleValue || "")
-      },
-      titleValue
-    ), showItemMeta && meta && /* @__PURE__ */ React__default.createElement("div", { className: b$3("meta"), title: meta }, meta));
-  }
-  _renderOnlyButton() {
-    const {
-      item: { value },
-      selectedCurrentItem: { value: selectedCurrentItemValue } = {},
-      selectType,
-      mobile,
-      style
-    } = this.props;
-    const { deltaX } = this.state;
-    if (selectType !== "multiple") {
-      return null;
-    }
-    const text = selectedCurrentItemValue === value ? trans$3("item_except") : trans$3("item_only");
-    if (mobile) {
-      const mods = {
-        mobile: true,
-        "with-transition": deltaX === 0
-      };
-      return /* @__PURE__ */ React__default.createElement(
-        "div",
-        {
-          ref: this._onlyButtonRef,
-          className: b$3("only-btn", mods),
-          style: {
-            top: style.top,
-            height: this.height
-          },
-          onClick: this._onOnlyButtonClick
-        },
-        text
-      );
-    }
-    return /* @__PURE__ */ React__default.createElement(
-      Button,
-      {
-        view: "flat-secondary",
-        size: "s",
-        className: b$3("only-btn"),
-        onClick: this._onOnlyButtonClick
-      },
-      text
-    );
-  }
-  _renderExternalUrl() {
-    const {
-      item: { url },
-      mobile,
-      style
-    } = this.props;
-    const { deltaX } = this.state;
-    if (!url) {
-      return null;
-    }
-    if (mobile) {
-      const mods = {
-        mobile: true,
-        "with-transition": deltaX === 0
-      };
-      return /* @__PURE__ */ React__default.createElement(
-        "div",
-        {
-          ref: this._linkButtonRef,
-          className: b$3("ext-link", mods),
-          style: {
-            top: style.top,
-            height: this.height
-          },
-          onClick: () => window.open(url, "_blank")
-        },
-        /* @__PURE__ */ React__default.createElement(Icon, { data: ArrowUpRightFromSquare })
-      );
-    }
-    return /* @__PURE__ */ React__default.createElement(
-      Button,
-      {
-        view: "flat-secondary",
-        size: "s",
-        href: url,
-        target: "_blank",
-        onClick: (e) => e.stopPropagation(),
-        className: b$3("ext-link")
-      },
-      /* @__PURE__ */ React__default.createElement(Icon, { data: ArrowUpRightFromSquare })
-    );
-  }
-  _renderTickIcon() {
-    const { mobile } = this.props;
-    const tickIconSize = mobile ? MOBILE_TICK_ICON_SIZE : DESKTOP_TICK_ICON_SIZE;
-    return /* @__PURE__ */ React__default.createElement("div", { className: b$3("tick-wrap") }, /* @__PURE__ */ React__default.createElement(
-      Icon,
-      {
-        data: Check,
-        className: b$3("tick"),
-        width: tickIconSize,
-        height: tickIconSize
-      }
-    ));
-  }
-  render() {
-    const {
-      item: { value, disabled, modifier, meta },
-      selectType,
-      showItemMeta,
-      isSelected,
-      mobile,
-      style
-    } = this.props;
-    const { actionNodes, deltaX } = this.state;
-    const isMultiple = selectType === "multiple";
-    const hasTouchHandlers = mobile && actionNodes.length;
-    const mods = {
-      disabled,
-      selected: isSelected,
-      multiple: isMultiple,
-      [modifier]: Boolean(modifier),
-      "show-meta": Boolean(showItemMeta && meta),
-      "with-transition": deltaX === 0
-    };
-    return /* @__PURE__ */ React__default.createElement("div", { className: bWrap() }, /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        ref: this._itemRef,
-        className: b$3(mods),
-        style,
-        "data-value": value,
-        onClick: this._onItemClick,
-        onClickCapture: this._onItemClickCapture,
-        onTouchStart: hasTouchHandlers ? this._onTouchStart : void 0,
-        onTouchMove: hasTouchHandlers ? this._onTouchMove : void 0,
-        onTouchEnd: hasTouchHandlers ? this._onTouchEnd : void 0
-      },
-      this._renderItemIcon(),
-      this._renderItemInfo(),
-      !mobile && this._renderOnlyButton(),
-      !mobile && this._renderExternalUrl(),
-      isSelected && isMultiple && this._renderTickIcon()
-    ), mobile && this._renderOnlyButton(), mobile && this._renderExternalUrl());
-  }
-}
-const trans$2 = I18n.keyset("components.common.YCSelect");
-const b$2 = block("yc-select-items");
-const ITEM_HEIGHT = 28;
-const MOBILE_ITEM_HEIGHT = 40;
-const ITEM_WITH_META_HEIGHT = 48;
-const MOBILE_ITEM_WITH_META_HEIGHT = 60;
-const GROUP_TITLE_HEIGHT = 21;
-const MARGIN_OFFSET = 4;
-class ItemsWrapper extends React__default.PureComponent {
-  static propTypes = {
-    virtualizeThreshold: PropTypes.number,
-    items: PropTypes.array,
-    inputValue: PropTypes.string,
-    innerValue: PropTypes.object,
-    isFetchingItems: PropTypes.bool,
-    isDynamic: PropTypes.bool,
-    isItemsGrouped: PropTypes.bool,
-    showItemMeta: PropTypes.bool,
-    showMoreItems: PropTypes.bool,
-    showSearch: PropTypes.bool,
-    showApply: PropTypes.bool,
-    selectedItemsPopup: PropTypes.bool,
-    mobile: PropTypes.bool,
-    fetchError: PropTypes.any,
-    onFetchErrorDetails: PropTypes.func,
-    fetchErrorDetailsTitle: PropTypes.string,
-    visible: PropTypes.bool,
-    fetchItems: PropTypes.func,
-    addNewItem: PropTypes.func,
-    setPopupWidth: PropTypes.func,
-    setAllowHideOnContentScroll: PropTypes.func,
-    errorContent: PropTypes.node
-  };
-  static defaultProps = {
-    showMoreItems: false
-  };
-  static getDerivedStateFromProps(props, state) {
-    const changedState = {};
-    if (props.visible) {
-      changedState.items = props.selectedItemsPopup ? props.items : props.items.filter(({ missing }) => !missing);
-      if (!state.hasItems) {
-        changedState.hasItems = true;
-      }
-    }
-    return Object.keys(changedState).length > 0 ? changedState : null;
-  }
-  state = {
-    items: [],
-    touchedItem: {},
-    minHeight: void 0,
-    isAddingUserItem: false,
-    isFetchingNextItems: false,
-    hasItems: false
-  };
-  componentDidMount() {
-    this.addedItemsCount = this.state.items.length;
-    this._setPopupWidth();
-  }
-  componentDidUpdate(prevProps, prevState) {
-    const { isDynamic } = this.props;
-    const { isFetchingNextItems } = this.state;
-    const listRef = this.listRef.current;
-    const isSelectedItemsChanged = prevProps.innerValue !== this.props.innerValue;
-    if (isSelectedItemsChanged && listRef || isFetchingNextItems && listRef) {
-      listRef.forceUpdate();
-    }
-    if (prevProps.inputValue && !this.props.inputValue && isDynamic && listRef) {
-      listRef.scrollTo(0);
-    }
-    if (prevState.items.length !== this.state.items.length) {
-      this.addedItemsCount = prevState.items.length > this.state.items.length ? this.state.items.length : this.state.items.length - prevState.items.length;
-    }
-    if (prevProps.showItemMeta !== this.props.showItemMeta && listRef) {
-      listRef.resetAfterIndex(0);
-    }
-    if (prevProps.errorContent && !this.props.errorContent) {
-      this._setPopupWidth();
-    }
-  }
-  componentWillUnmount() {
-    this._removeObserver();
-  }
-  addedItemsCount = 0;
-  ref = React__default.createRef();
-  listRef = React__default.createRef();
-  observer = null;
-  get items() {
-    const { isItemsGrouped } = this.props;
-    let items = this.state.items;
-    if (isItemsGrouped) {
-      items = [];
-      this.state.items.forEach((group) => {
-        items.push({ groupTitle: group.groupTitle });
-        items = items.concat(group.items);
-      });
-    }
-    return items;
-  }
-  getTouchedItem = () => {
-    return this.state.touchedItem;
-  };
-  setTouchedItem = (touchedItem) => {
-    this.setState({ touchedItem });
-  };
-  _onResize = () => {
-    if (!this.ref.current) {
-      return;
-    }
-    const { minHeight } = this.state;
-    const height = this.ref.current.getBoundingClientRect().height;
-    if (height > minHeight) {
-      this.setState({ minHeight: height });
-    }
-  };
-  _addObserver() {
-    const config = { subtree: true, childList: true };
-    this.observer = new MutationObserver(this._onResize);
-    this.observer.observe(this.ref.current, config);
-  }
-  _setPopupWidth() {
-    if (!this.ref.current) {
-      return;
-    }
-    const { width } = this.ref.current.getBoundingClientRect();
-    this.props.setPopupWidth(width + this._getScrollbarWidth());
-    if (this.props.mobile) {
-      this._addObserver();
-    }
-  }
-  _removeObserver() {
-    if (this.observer) {
-      this.observer.disconnect();
-    }
-  }
-  _getScrollbarWidth() {
-    if (!this.ref.current) {
-      return 0;
-    }
-    const browser = checkBrowser();
-    let offset = 0;
-    if (browser === "Firefox" || browser === "Safari") {
-      offset = this.ref.current.offsetWidth - this.ref.current.clientWidth;
-    }
-    return offset;
-  }
-  _getItemHeight = () => {
-    const { showItemMeta, mobile } = this.props;
-    if (mobile) {
-      return showItemMeta ? MOBILE_ITEM_WITH_META_HEIGHT : MOBILE_ITEM_HEIGHT;
-    }
-    return showItemMeta ? ITEM_WITH_META_HEIGHT : ITEM_HEIGHT;
-  };
-  _getItemSize = (index) => {
-    const items = this.items;
-    const itemHeight = this._getItemHeight();
-    if (!items[index]) {
-      return itemHeight;
-    }
-    return items[index].groupTitle ? GROUP_TITLE_HEIGHT : itemHeight;
-  };
-  _fetchNextItems = async () => {
-    const { fetchItems } = this.props;
-    this.setState({ isFetchingNextItems: true });
-    await fetchItems();
-    this.setState({ isFetchingNextItems: false });
-  };
-  _addUserItem = async () => {
-    const { inputValue, addNewItem } = this.props;
-    this.setState({ isAddingUserItem: true });
-    await addNewItem(inputValue);
-    this.setState({ isAddingUserItem: false });
-  };
-  _onAddButtonClick = (e) => {
-    e.stopPropagation();
-    this._addUserItem();
-  };
-  _renderItem = (item, style = {}) => {
-    const { innerValue } = this.props;
-    const isSelected = innerValue.has(item.value);
-    if (style.left) {
-      delete style.left;
-    }
-    return /* @__PURE__ */ React__default.createElement(
-      Item,
-      {
-        ...this.props,
-        key: item.key || item.value,
-        style,
-        item,
-        isSelected,
-        getTouchedItem: this.getTouchedItem,
-        setTouchedItem: this.setTouchedItem
-      }
-    );
-  };
-  _renderGroupTitle = (title, style = {}) => {
-    return /* @__PURE__ */ React__default.createElement("div", { style, key: title, className: b$2("group-title") }, title);
-  };
-  _itemRenderer = ({ index, style }) => {
-    const { isFetchingNextItems } = this.state;
-    const items = this.items;
-    const item = items[index];
-    if (index === items.length && isFetchingNextItems) {
-      return /* @__PURE__ */ React__default.createElement("div", { className: b$2("loader"), style }, /* @__PURE__ */ React__default.createElement(Loader, { size: "s" }));
-    }
-    if (!item) {
-      return null;
-    }
-    if (item.groupTitle) {
-      return this._renderGroupTitle(item.groupTitle, style);
-    }
-    return this._renderItem(item, style);
-  };
-  _onItemsRendered = ({ visibleStopIndex }) => {
-    const { showMoreItems } = this.props;
-    const { items, isFetchingNextItems } = this.state;
-    const threshold = Math.round(this.addedItemsCount / 3);
-    const needFetch = showMoreItems && !isFetchingNextItems && items.length - visibleStopIndex < threshold;
-    if (needFetch) {
-      this._fetchNextItems();
-    }
-  };
-  _renderItemsWithoutVirtualized() {
-    const { isItemsGrouped } = this.props;
-    const { items } = this.state;
-    if (isItemsGrouped) {
-      return items.map((item) => {
-        const { groupTitle, items: items2 } = item;
-        if (!groupTitle && !items2) {
-          return this._renderItem(item);
-        }
-        const groupTitleNode = this._renderGroupTitle(groupTitle);
-        const groupItems = items2.map((item2) => this._renderItem(item2));
-        return groupItems.length ? [groupTitleNode, ...groupItems] : null;
-      });
-    }
-    return items.map((item) => this._renderItem(item));
-  }
-  // eslint-disable-next-line complexity
-  render() {
-    const {
-      virtualizeThreshold,
-      inputValue,
-      showSearch,
-      showApply,
-      isDynamic,
-      showMoreItems,
-      selectedItemsPopup,
-      mobile,
-      addNewItem,
-      fetchItems,
-      isFetchingItems,
-      isItemsGrouped,
-      fetchError,
-      itemsListTestAnchor,
-      errorContent
-    } = this.props;
-    const { minHeight, hasItems, isAddingUserItem, isFetchingNextItems } = this.state;
-    const items = this.items;
-    if (!hasItems) {
-      return null;
-    }
-    if (isFetchingItems && !isFetchingNextItems) {
-      return /* @__PURE__ */ React__default.createElement("div", { ref: this.ref, className: b$2("loader"), style: { minHeight } }, /* @__PURE__ */ React__default.createElement(Loader, { size: "s" }));
-    }
-    if (fetchError || errorContent) {
-      const { onFetchErrorDetails, fetchErrorDetailsTitle } = this.props;
-      return /* @__PURE__ */ React__default.createElement("div", { ref: this.ref, className: b$2("prompt"), style: { minHeight } }, errorContent ? errorContent : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("span", null, trans$2("items_fetch_error")), /* @__PURE__ */ React__default.createElement("div", { className: b$2("buttons") }, /* @__PURE__ */ React__default.createElement(
-        Button,
-        {
-          disabled: isAddingUserItem,
-          className: b$2("prompt-button", { retry: true }),
-          onClick: fetchItems
-        },
-        trans$2("refresh_button_text")
-      ), onFetchErrorDetails && /* @__PURE__ */ React__default.createElement(
-        Button,
-        {
-          view: "flat",
-          className: b$2("prompt-button"),
-          onClick: () => onFetchErrorDetails(fetchError)
-        },
-        fetchErrorDetailsTitle || trans$2("error_details_button_text")
-      ))));
-    }
-    if (isDynamic && !inputValue && !items.length) {
-      return /* @__PURE__ */ React__default.createElement("div", { ref: this.ref, className: b$2("prompt"), style: { minHeight } }, /* @__PURE__ */ React__default.createElement("span", null, trans$2("items_prompt")));
-    }
-    const isNotFound = !items.length || isItemsGrouped && items.every((group) => group.items && !group.items.length);
-    if (isNotFound) {
-      return /* @__PURE__ */ React__default.createElement("div", { ref: this.ref, className: b$2("prompt"), style: { minHeight } }, /* @__PURE__ */ React__default.createElement("span", null, trans$2("items_not_found", { inputValue })), addNewItem && !isItemsGrouped && /* @__PURE__ */ React__default.createElement(
-        Button,
-        {
-          disabled: isAddingUserItem,
-          className: b$2("prompt-button"),
-          onClick: this._onAddButtonClick
-        },
-        trans$2("items_add_new")
-      ));
-    }
-    const wrapperMods = {
-      "with-search": !selectedItemsPopup && showSearch,
-      "with-selected-title": selectedItemsPopup,
-      "with-apply-button": showApply,
-      grouped: isItemsGrouped,
-      mobile
-    };
-    if (!isDynamic && items.length < virtualizeThreshold) {
-      wrapperMods["without-virtualized"] = true;
-      return /* @__PURE__ */ React__default.createElement(
-        "div",
-        {
-          ref: this.ref,
-          className: b$2(wrapperMods),
-          style: { minHeight },
-          "data-qa": itemsListTestAnchor
-        },
-        this._renderItemsWithoutVirtualized()
-      );
-    }
-    const itemHeight = this._getItemHeight();
-    const itemCount = showMoreItems ? items.length + 1 : items.length;
-    const marginOffset = items.length === 1 ? MARGIN_OFFSET * 2 : MARGIN_OFFSET;
-    return /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        ref: this.ref,
-        className: b$2(wrapperMods),
-        style: {
-          minHeight,
-          height: itemCount * itemHeight + marginOffset
-        },
-        "data-qa": itemsListTestAnchor
-      },
-      /* @__PURE__ */ React__default.createElement(AutoSizer, null, ({ width, height }) => /* @__PURE__ */ React__default.createElement(
-        VariableSizeList,
-        {
-          ref: this.listRef,
-          style: { overflowX: "hidden" },
-          width,
-          height,
-          itemSize: this._getItemSize,
-          itemData: items,
-          itemCount,
-          overscanCount: 5,
-          estimatedItemSize: itemHeight,
-          onItemsRendered: this._onItemsRendered
-        },
-        this._itemRenderer
-      ))
-    );
-  }
-}
-const trans$1 = I18n.keyset("components.common.YCSelect");
-const b$1 = block("yc-select-search");
-class Search extends React__default.PureComponent {
-  static propTypes = {
-    value: PropTypes.string,
-    width: PropTypes.number,
-    minWidth: PropTypes.number,
-    searchButtonSettings: PropTypes.object,
-    onInputUpdate: PropTypes.func,
-    selectAllItems: PropTypes.func,
-    onClick: PropTypes.func
-  };
-  focusInput = () => {
-    if (!this.inputNode) {
-      return;
-    }
-    this.inputNode.focus({ preventScroll: true });
-  };
-  _setInputNode = (ref) => {
-    if (!this.inputNode) {
-      this.inputNode = ref;
-    }
-  };
-  _handleOnClick = () => {
-    if (this.props.onClick) {
-      this.props.onClick();
-    }
-  };
-  render() {
-    const {
-      value,
-      width,
-      minWidth,
-      searchButtonSettings: { isCleaning, visible },
-      onInputUpdate,
-      selectAllItems
-    } = this.props;
-    return /* @__PURE__ */ React__default.createElement(MobileContext.Consumer, null, ({ mobile }) => {
-      const size = mobile ? "xl" : "m";
-      let style;
-      if (!mobile) {
-        style = {
-          width,
-          minWidth
-        };
-      }
-      return /* @__PURE__ */ React__default.createElement("div", { className: b$1(), style, onClick: this._handleOnClick }, /* @__PURE__ */ React__default.createElement("div", { className: b$1("input-wrap") }, /* @__PURE__ */ React__default.createElement(
-        TextInput,
-        {
-          controlRef: mobile ? void 0 : this._setInputNode,
-          view: "clear",
-          size,
-          value,
-          placeholder: trans$1("search_placeholder"),
-          onUpdate: onInputUpdate,
-          clear: true
-        }
-      )), visible && /* @__PURE__ */ React__default.createElement(Button, { view: "flat", size, onClick: selectAllItems }, isCleaning ? trans$1("search_clear") : trans$1("search_select_all")));
-    });
-  }
-}
-const MIN_VIRTUALIZED_POPUP_WIDTH = 170;
-const MAX_CONTROL_WIDTH_WITH_ANIMATION = 500;
-function isBothEmpty(valueA, valueB) {
-  if (Array.isArray(valueA) && Array.isArray(valueB)) {
-    return valueA.length === 0 && valueB.length === 0;
-  }
-  if (valueA instanceof Set && valueB instanceof Set) {
-    return valueA.size === 0 && valueB.size === 0;
-  }
-  return false;
-}
-const trans = I18n.keyset("components.common.YCSelect");
-const b = block("yc-select");
-const bControl = block("yc-select-control");
-const bAction = block("yc-select-action");
-const bPopup = block("yc-select-popup");
-const bSheet = block("yc-select-sheet");
-const DEBOUNCE_DELAY = 350;
-const THROTTLE_DELAY = 33;
-const EMPTY_VALUE = "—";
-const AVAILABLE_POPUP_DIRECTIONS = ["bottom-start", "bottom-end", "top-start", "top-end"];
-const getModifier = (name) => b({ [name]: true }).split(" ")[1];
-const ItemShape = PropTypes.shape({
-  value: PropTypes.string.isRequired,
-  title: PropTypes.string.isRequired,
-  key: PropTypes.string,
-  meta: PropTypes.string,
-  icon: PropTypes.node,
-  disabled: PropTypes.bool,
-  url: PropTypes.string
-});
-const ItemsGroupShape = PropTypes.shape({
-  groupTitle: PropTypes.string.isRequired,
-  items: PropTypes.arrayOf(ItemShape)
-});
-const ItemsShape = PropTypes.oneOfType([
-  PropTypes.array,
-  PropTypes.arrayOf(ItemShape),
-  PropTypes.arrayOf(ItemsGroupShape)
-]);
-const getFlattenItems = ({ items, isItemsGrouped, innerValue }) => {
-  return isItemsGrouped ? _flatMap(
-    items,
-    ({ items: groupedItems }) => groupedItems.filter((item) => innerValue.has(item.value))
-  ) : items.filter((item) => innerValue.has(item.value));
-};
-function getInnerValueLength(value) {
-  if (value === void 0 || value === null) {
-    return 0;
-  }
-  return Array.isArray(value) ? value.length : 1;
-}
-const arrayProps = ["items", "titles", "innerValue", "prevPropsItems", "shownItems"];
-function safeStateUpdater(currentState, nextPartialState) {
-  let nextState = currentState;
-  const entries = Object.entries(nextPartialState);
-  for (const [key, nextValue] of entries) {
-    const currentValue = nextState[key];
-    if (arrayProps.includes(key) && !isBothEmpty(currentValue, nextValue) || currentValue !== nextValue) {
-      nextState = { ...nextState, [key]: nextValue };
-    }
-  }
-  return nextState;
-}
-class YCSelect extends React__default.PureComponent {
-  static SINGLE = "single";
-  static MULTIPLE = "multiple";
-  static INIT_ITEMS_PLACEHOLDER = "Fetching initial items...";
-  static getInnerValue(value, allowNullableValues) {
-    const checkFunction = allowNullableValues ? isUndefined : isFalsy;
-    if (checkFunction(value)) {
-      return /* @__PURE__ */ new Set();
-    }
-    return Array.isArray(value) ? new Set(value.filter((val) => !checkFunction(val))) : /* @__PURE__ */ new Set([value]);
-  }
-  static getMissingItems(items = [], value, showMissingItems) {
-    if (!showMissingItems) {
-      return [];
-    }
-    const itemsSet = new Set(items.map((item) => item.value));
-    return (Array.isArray(value) ? value : [value]).filter((valueItem) => {
-      return !itemsSet.has(valueItem);
-    }).map((missingValue) => ({
-      value: missingValue,
-      title: missingValue,
-      missing: true
-    }));
-  }
-  static getDerivedStateFromProps(props, state) {
-    const changedState = {};
-    const isPropsItemsChange = props.items !== state.prevPropsItems && !props.getItems;
-    if (isPropsItemsChange) {
-      const missingItems = YCSelect.getMissingItems(
-        props.items,
-        props.value,
-        props.showMissingItems
-      );
-      const items = missingItems.concat(props.items);
-      changedState.prevPropsItems = props.items;
-      changedState.items = items;
-      changedState.isItemsGrouped = YCSelect.isItemsGrouped(props.items);
-      if (state.inputValue) {
-        const regExp = getEscapedRegExp(state.inputValue);
-        if (changedState.isItemsGrouped) {
-          changedState.shownItems = props.items.map((group) => {
-            const groupItems = group.items.filter(
-              (item) => regExp.test(item.title)
-            );
-            return {
-              groupTitle: group.groupTitle,
-              items: groupItems
-            };
-          }).filter((group) => group.items.length);
-        } else {
-          changedState.shownItems = items.filter((item) => regExp.test(item.title));
-        }
-      } else {
-        changedState.shownItems = items;
-      }
-    }
-    if (props.value !== state.prevPropsValue || isPropsItemsChange) {
-      const missingItems = YCSelect.getMissingItems(
-        props.getItems ? state.items.concat(state.selectItems) : props.items,
-        props.value,
-        props.showMissingItems
-      );
-      let items = YCSelect.isItemsGrouped(props.items) ? props.items : missingItems.concat(props.getItems ? state.items : props.items);
-      if (props.getItems) {
-        items = _uniqBy(items.concat(state.selectItems), "value");
-      }
-      changedState.prevPropsValue = props.value;
-      const { innerValue, singleSelectItem, titles } = YCSelect.getInnerValueState(
-        props,
-        items
-      );
-      Object.assign(changedState, { innerValue, singleSelectItem, titles });
-      if (props.getItems) {
-        const length = getInnerValueLength(props.value);
-        if (length !== 0 && titles.length !== length) {
-          changedState.isInitPending = true;
-        } else {
-          changedState.selectItems = _filter(
-            state.selectItems,
-            (item) => innerValue.has(item.value)
-          );
-        }
-      }
-      if (props.showMissingItems) {
-        changedState.items = items;
-      }
-    }
-    return Object.keys(changedState).length > 0 ? changedState : null;
-  }
-  static getInnerValueState(props, items) {
-    const { value, type, showItemIcon, allowNullableValues } = props;
-    const res = {};
-    res.innerValue = YCSelect.getInnerValue(value, allowNullableValues);
-    if (type === YCSelect.SINGLE && showItemIcon) {
-      res.singleSelectItem = YCSelect.getSingleSelectedItem(items, res.innerValue);
-    }
-    res.titles = YCSelect.getTitles(items, res.innerValue);
-    return res;
-  }
-  static getTitles(items, innerValue) {
-    if (!innerValue.size) {
-      return [];
-    }
-    const isItemsGrouped = YCSelect.isItemsGrouped(items);
-    if (isItemsGrouped) {
-      return _flatMap(
-        items,
-        ({ items: groupedItems }) => groupedItems.filter((item) => innerValue.has(item.value)).map((item) => item.title)
-      );
-    }
-    return items.filter((item) => innerValue.has(item.value)).map(({ title }) => getTitleValue(title));
-  }
-  static getSingleSelectedItem(items, innerValue) {
-    const isItemsGrouped = YCSelect.isItemsGrouped(items);
-    if (isItemsGrouped) {
-      const filteredList = items.map(
-        ({ items: groupedItems }) => groupedItems.find((item) => innerValue.has(item.value))
-      ).filter(Boolean);
-      return filteredList[0];
-    }
-    return items.find((item) => innerValue.has(item.value));
-  }
-  static isItemsGrouped(items) {
-    if (!items || !items.length) {
-      return false;
-    }
-    return Object.prototype.hasOwnProperty.call(items[0], "groupTitle");
-  }
-  static propTypes = {
-    onUpdate: PropTypes.func.isRequired,
-    getItems: PropTypes.func,
-    addItem: PropTypes.func,
-    renderSwitcher: PropTypes.func,
-    onOpenChange: PropTypes.func,
-    size: PropTypes.oneOf(["xs", "s", "m", "n", "promo"]),
-    type: PropTypes.oneOf([YCSelect.SINGLE, YCSelect.MULTIPLE]),
-    className: PropTypes.string,
-    popupClassName: PropTypes.string,
-    controlTestAnchor: PropTypes.string,
-    itemsListTestAnchor: PropTypes.string,
-    switcherClassName: PropTypes.string,
-    label: PropTypes.string,
-    limitLabel: PropTypes.bool,
-    itemsLoaderClassName: PropTypes.string,
-    controlWidth: PropTypes.number,
-    popupWidth: PropTypes.number,
-    itemsPageSize: PropTypes.number,
-    virtualizeThreshold: PropTypes.number,
-    showSearch: PropTypes.bool,
-    showArrow: PropTypes.bool,
-    showApply: PropTypes.bool,
-    showItemIcon: PropTypes.bool,
-    showItemMeta: PropTypes.bool,
-    showMissingItems: PropTypes.bool,
-    showSelectAll: PropTypes.bool,
-    allowEmptyValue: PropTypes.bool,
-    allowNullableValues: PropTypes.bool,
-    hiding: PropTypes.bool,
-    disabled: PropTypes.bool,
-    stretched: PropTypes.bool,
-    loading: PropTypes.bool,
-    loadingItems: PropTypes.bool,
-    applyOnOutsideClick: PropTypes.bool,
-    items: ItemsShape,
-    initialItems: ItemsShape,
-    value: (props, propName, componentName) => {
-      const propTypeSpec = props["type"] === YCSelect.SINGLE ? { [propName]: PropTypes.string } : { [propName]: PropTypes.arrayOf(PropTypes.string) };
-      PropTypes.checkPropTypes(propTypeSpec, props, propName, componentName);
-    },
-    placeholder: PropTypes.oneOfType([
-      PropTypes.string,
-      PropTypes.shape({
-        text: PropTypes.string.isRequired,
-        icon: PropTypes.node.isRequired
-      })
-    ]),
-    errorContent: PropTypes.node,
-    onFetchErrorDetails: PropTypes.func,
-    fetchErrorDetailsTitle: PropTypes.string,
-    hasValidationError: PropTypes.bool
-  };
-  constructor(props) {
-    super(props);
-    const {
-      type,
-      value,
-      showItemIcon,
-      showMissingItems,
-      allowNullableValues,
-      getItems,
-      initialItems,
-      controlTestAnchor
-    } = this.props;
-    this.controlRef = React__default.createRef();
-    this.badgeRef = React__default.createRef();
-    this.searchRef = React__default.createRef();
-    this.popupRef = React__default.createRef();
-    this.selectorRef = React__default.createRef();
-    this._publishEvent = eventBroker.withEventPublisher("Select", controlTestAnchor);
-    this.fetchCounter = 0;
-    let items = [];
-    let titles = [];
-    let isInitPending = false;
-    let innerValue = /* @__PURE__ */ new Set();
-    let singleSelectItem;
-    if (getItems && (!this.isEmpty() || initialItems)) {
-      const missingItems = YCSelect.getMissingItems(initialItems, value, showMissingItems);
-      items = missingItems.concat(initialItems || []);
-      isInitPending = true;
-      innerValue = YCSelect.getInnerValue(value, allowNullableValues);
-    } else if (!getItems) {
-      const missingItems = YCSelect.getMissingItems(
-        this.props.items,
-        value,
-        showMissingItems
-      );
-      items = missingItems.concat(this.props.items || []);
-      innerValue = YCSelect.getInnerValue(value, allowNullableValues);
-      titles = YCSelect.getTitles(items, innerValue);
-    }
-    if (type === YCSelect.SINGLE && showItemIcon) {
-      singleSelectItem = YCSelect.getSingleSelectedItem(items, innerValue);
-    }
-    this.state = {
-      items,
-      titles,
-      innerValue,
-      isInitPending,
-      singleSelectItem,
-      prevPropsItems: items,
-      prevPropsValue: value,
-      shownItems: items,
-      selectedPopupItems: [],
-      selectItems: [],
-      inputValue: "",
-      showMainPopup: false,
-      showSelectedPopup: false,
-      isFetchingItems: false,
-      isControlClicked: false,
-      isItemsGrouped: YCSelect.isItemsGrouped(items),
-      fetchError: null
-    };
-  }
-  _updateControlWidth = throttle(() => {
-    if (!this._isMounted) {
-      return;
-    }
-    const controlWidth = Math.ceil(this.controlRef.current.getBoundingClientRect().width);
-    if (this.state.controlWidth !== controlWidth) {
-      this.setState({ controlWidth });
-    }
-  }, THROTTLE_DELAY);
-  componentDidMount() {
-    this._isMounted = true;
-    setTimeout(() => {
-      this._updateControlWidth();
-    }, 0);
-    if (this.state.isInitPending) {
-      this._initItems();
-    }
-  }
-  componentDidUpdate(prevProps) {
-    const { controlWidth } = this.props;
-    if (!prevProps.getItems && this.props.getItems || prevProps.getItems && this.props.getItems && !isEqual(prevProps.initialItems, this.props.initialItems)) {
-      const { type, value, showItemIcon, showMissingItems, allowNullableValues, initialItems } = this.props;
-      this.fetchCounter = 0;
-      let items = [];
-      let isInitPending = false;
-      let innerValue = /* @__PURE__ */ new Set();
-      let singleSelectItem;
-      if (!this.isEmpty() || initialItems) {
-        const missingItems = YCSelect.getMissingItems(
-          initialItems,
-          value,
-          showMissingItems
-        );
-        items = missingItems.concat(initialItems);
-        isInitPending = true;
-        innerValue = YCSelect.getInnerValue(value, allowNullableValues);
-      }
-      const titles = YCSelect.getTitles(items, innerValue);
-      if (type === YCSelect.SINGLE && showItemIcon) {
-        singleSelectItem = YCSelect.getSingleSelectedItem(items, innerValue);
-      }
-      this.setState(
-        safeStateUpdater(this.state, {
-          items,
-          titles,
-          innerValue,
-          isInitPending,
-          singleSelectItem,
-          prevPropsItems: items,
-          prevPropsValue: value,
-          shownItems: items,
-          inputValue: ""
-        })
-      );
-      return;
-    }
-    if (this.state.isInitPending) {
-      this._initItems();
-    }
-    if (controlWidth) {
-      return;
-    }
-    this._updateControlWidth();
-    if (this.selectorRef.current) {
-      if (this.state.showMainPopup) {
-        this.selectorRef.current.addEventListener(
-          "scroll",
-          this._handleSelectorScroll,
-          true
-        );
-      } else {
-        this.selectorRef.current.removeEventListener(
-          "scroll",
-          this._handleSelectorScroll,
-          true
-        );
-      }
-    }
-  }
-  componentWillUnmount() {
-    this._isMounted = false;
-    if (this.selectorRef.current) {
-      this.selectorRef.current.removeEventListener(
-        "scroll",
-        this._handleSelectorScroll,
-        true
-      );
-    }
-  }
-  isEmpty() {
-    const { type, value } = this.props;
-    if (type === YCSelect.SINGLE) {
-      return isFalsy(value);
-    } else {
-      return (value || []).filter((value2) => !isFalsy(value2)).length === 0;
-    }
-  }
-  selectItem = (item) => {
-    const { allowEmptyValue } = this.props;
-    const prevInnerValue = new Set(this.state.innerValue);
-    const innerValue = allowEmptyValue && prevInnerValue.has(item.value) ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Set([item.value]);
-    const state = {
-      innerValue,
-      showMainPopup: false
-    };
-    this.setState(safeStateUpdater(this.state, state), () => {
-      this._onUpdate();
-      this._onOpenChange({ open: false });
-    });
-  };
-  selectItems = (item) => {
-    const { getItems } = this.props;
-    const { items } = this.state;
-    const innerValue = new Set(this.state.innerValue);
-    if (innerValue.has(item.value)) {
-      innerValue.delete(item.value);
-    } else {
-      innerValue.add(item.value);
-    }
-    const state = {
-      innerValue,
-      selectedCurrentItem: void 0
-    };
-    if (getItems) {
-      state.selectItems = [
-        .../* @__PURE__ */ new Set([...this.state.selectItems, ...this.state.selectedPopupItems, ...items])
-      ].filter((item2) => innerValue.has(item2.value));
-    }
-    this.setState(safeStateUpdater(this.state, state), this._beforeOnUpdate);
-  };
-  onSingleSearchButtonClick = () => {
-    this.setState(
-      safeStateUpdater(this.state, {
-        innerValue: /* @__PURE__ */ new Set(),
-        showMainPopup: false
-      }),
-      this._onUpdate
-    );
-  };
-  onMultipleSearchButtonClick = () => {
-    const { getItems } = this.props;
-    const { items, shownItems, isItemsGrouped } = this.state;
-    const state = {};
-    let shownItemsValue;
-    if (isItemsGrouped) {
-      shownItemsValue = new Set(
-        _flatMap(
-          shownItems,
-          ({ items: groupedItems }) => groupedItems.filter((item) => !item.disabled).map((item) => item.value)
-        )
-      );
-    } else {
-      shownItemsValue = new Set(
-        shownItems.filter((item) => !item.disabled && !item.missing).map((item) => item.value)
-      );
-    }
-    let innerValue = /* @__PURE__ */ new Set([...this.state.innerValue, ...shownItemsValue]);
-    if (innerValue.size === this.state.innerValue.size) {
-      innerValue = new Set(
-        [...this.state.innerValue].filter((innerVal) => !shownItemsValue.has(innerVal))
-      );
-    }
-    state.innerValue = innerValue;
-    if (getItems) {
-      const allItems = /* @__PURE__ */ new Set([
-        ...items,
-        ...this.state.selectedPopupItems,
-        ...this.state.selectItems || []
-      ]);
-      state.selectItems = [...allItems].filter((item) => innerValue.has(item.value));
-    }
-    this.setState(safeStateUpdater(this.state, state), this._beforeOnUpdate);
-  };
-  selectOnlyCurrentItem = (selectedItem) => {
-    const { getItems } = this.props;
-    const {
-      items,
-      selectedCurrentItem: { value: prevSelectedItemValue } = {},
-      shownItems,
-      selectedPopupItems,
-      showSelectedPopup,
-      isItemsGrouped
-    } = this.state;
-    const state = { selectedCurrentItem: void 0 };
-    if (selectedItem.value === prevSelectedItemValue) {
-      const itemsToFilter = showSelectedPopup ? selectedPopupItems : shownItems;
-      let innerValue;
-      if (isItemsGrouped) {
-        innerValue = new Set(
-          _flatMap(
-            itemsToFilter,
-            ({ items: groupedItems }) => groupedItems.filter((item) => !item.disabled && item.value !== selectedItem.value).map((item) => item.value)
-          )
-        );
-      } else {
-        innerValue = new Set(
-          itemsToFilter.filter((item) => !item.disabled && item.value !== selectedItem.value).map((item) => item.value)
-        );
-      }
-      state.innerValue = innerValue;
-      if (getItems) {
-        const allItems = /* @__PURE__ */ new Set([...items, ...this.state.selectedPopupItems]);
-        state.selectItems = [...allItems].filter((item) => innerValue.has(item.value));
-      }
-    } else {
-      state.innerValue = /* @__PURE__ */ new Set([selectedItem.value]);
-      state.selectedCurrentItem = selectedItem;
-      if (getItems) {
-        state.selectItems = [selectedItem];
-      }
-    }
-    this.setState(safeStateUpdater(this.state, state), this._beforeOnUpdate);
-  };
-  addNewItem = async (inputValue) => {
-    const { getItems, addItem } = this.props;
-    await addItem(inputValue);
-    if (getItems) {
-      this._onInputUpdateDynamic(inputValue);
-    } else {
-      this._onInputUpdateStatic(inputValue);
-    }
-  };
-  setPopupWidth = (width) => {
-    this.setState({ popupWidth: width });
-  };
-  _handleSelectorScroll = debounce$1((event) => {
-    const { scrollTop } = event.target || {};
-    this._publishEvent({ eventId: "selector-scroll", meta: { scrollTop } });
-  }, 200);
-  _initItems = async () => {
-    const { value, initialItems, showMissingItems } = this.props;
-    const { initialNextPageToken } = this.state;
-    const exactKeys = new Set(Array.isArray(value) ? value.filter(Boolean) : [value]);
-    const { items: fetchedItems, nextPageToken } = await this.props.getItems({
-      exactKeys: [...exactKeys.values()]
-    });
-    let items = fetchedItems;
-    let shownItems = fetchedItems;
-    if (initialItems && (nextPageToken === initialNextPageToken || !initialNextPageToken)) {
-      items = uniq(this.state.items, fetchedItems);
-      shownItems = items;
-    }
-    const missingItems = YCSelect.getMissingItems(fetchedItems, value, showMissingItems);
-    const { innerValue, singleSelectItem, titles } = YCSelect.getInnerValueState(
-      this.props,
-      missingItems.length ? _uniqBy(fetchedItems.concat(missingItems), "value") : fetchedItems
-    );
-    this.setState(
-      safeStateUpdater(this.state, {
-        items,
-        shownItems,
-        selectItems: fetchedItems,
-        innerValue,
-        titles,
-        singleSelectItem,
-        nextPageToken,
-        initialNextPageToken: nextPageToken,
-        isInitPending: false
-      })
-    );
-  };
-  _fetchItems = async () => {
-    const { getItems, itemsPageSize } = this.props;
-    if (getItems) {
-      const { inputValue, nextPageToken, selectItems = [] } = this.state;
-      this.setState(
-        { isFetchingItems: true },
-        this.popupRef.current && this.popupRef.current.forceUpdate
-      );
-      try {
-        this.fetchCounter += 1;
-        const fetchData = await getItems({
-          searchPattern: inputValue,
-          itemsPageSize,
-          nextPageToken
-        });
-        this.fetchCounter -= 1;
-        if (this.fetchCounter > 0) {
-          this.setState(
-            {
-              fetchError: null,
-              isFetchingItems: true
-            },
-            this.popupRef.current && this.popupRef.current.forceUpdate
-          );
-          return;
-        }
-        const items = uniq(
-          nextPageToken ? this.state.items.concat(fetchData.items) : fetchData.items,
-          selectItems
-        );
-        this.setState(
-          safeStateUpdater(this.state, {
-            items,
-            shownItems: items,
-            nextPageToken: fetchData.nextPageToken,
-            fetchError: null,
-            isFetchingItems: false
-          }),
-          this.popupRef.current && this.popupRef.current.forceUpdate
-        );
-      } catch (error) {
-        this.fetchCounter -= 1;
-        if (this.fetchCounter > 0) {
-          this.setState({
-            fetchError: null,
-            isFetchingItems: true
-          });
-          return;
-        }
-        this.setState({
-          fetchError: error,
-          isFetchingItems: false
-        });
-      }
-    }
-  };
-  _getSearchButtonSettings() {
-    const { type, allowEmptyValue, showSelectAll } = this.props;
-    const { shownItems = [], isItemsGrouped } = this.state;
-    const settings = {
-      isCleaning: true,
-      visible: showSelectAll
-    };
-    if (type === YCSelect.SINGLE) {
-      settings.visible = Boolean(
-        showSelectAll && this.state.innerValue.size && allowEmptyValue
-      );
-      return settings;
-    }
-    if (!shownItems.length) {
-      settings.visible = false;
-      return settings;
-    }
-    let shownItemsValue;
-    if (isItemsGrouped) {
-      shownItemsValue = new Set(
-        _flatMap(
-          shownItems,
-          ({ items: groupedItems }) => groupedItems.filter((item) => !item.disabled).map((item) => item.value)
-        )
-      );
-    } else {
-      shownItemsValue = new Set(
-        shownItems.filter((item) => !item.disabled).map((item) => item.value)
-      );
-    }
-    const innerValue = /* @__PURE__ */ new Set([...this.state.innerValue, ...shownItemsValue]);
-    settings.isCleaning = innerValue.size === this.state.innerValue.size;
-    return settings;
-  }
-  _getOutputItems() {
-    const {
-      innerValue,
-      items,
-      selectItems,
-      selectedPopupItems,
-      showSelectedPopup,
-      isItemsGrouped
-    } = this.state;
-    if (showSelectedPopup) {
-      return getFlattenItems({
-        innerValue,
-        isItemsGrouped,
-        items: selectedPopupItems
-      });
-    }
-    const knownItems = _uniqBy(items.concat(selectItems), "value");
-    return getFlattenItems({
-      innerValue,
-      isItemsGrouped,
-      items: knownItems
-    });
-  }
-  _getPreviousValue = () => {
-    const { value, allowNullableValues } = this.props;
-    const { items, selectItems } = this.state;
-    const knownItems = _uniqBy(items.concat(selectItems), "value");
-    const innerValue = YCSelect.getInnerValue(value, allowNullableValues);
-    const titles = YCSelect.getTitles(knownItems, innerValue);
-    return { innerValue, titles };
-  };
-  _onInputUpdateStatic = (inputValue) => {
-    const { showItemMeta } = this.props;
-    const { items, isItemsGrouped } = this.state;
-    let shownItems;
-    if (inputValue) {
-      const regExp = getEscapedRegExp(inputValue);
-      if (isItemsGrouped) {
-        shownItems = items.map((group) => {
-          const groupItems = group.items.filter(
-            (item) => regExp.test(item.title) || showItemMeta && regExp.test(item.meta)
-          );
-          return {
-            groupTitle: group.groupTitle,
-            items: groupItems
-          };
-        }).filter((group) => group.items.length);
-      } else {
-        shownItems = items.filter(
-          (item) => regExp.test(item.title) || showItemMeta && regExp.test(item.meta)
-        );
-      }
-    } else {
-      shownItems = [...items];
-    }
-    const state = {
-      shownItems,
-      inputValue
-    };
-    this.setState(safeStateUpdater(this.state, state));
-  };
-  _onInputUpdateDynamic = (inputValue) => {
-    const { initialItems } = this.props;
-    if (!inputValue) {
-      this.setState(
-        safeStateUpdater(this.state, {
-          items: initialItems || [],
-          shownItems: initialItems || [],
-          inputValue: "",
-          nextPageToken: this.state.initialNextPageToken,
-          fetchError: false,
-          isFetchingItems: false
-        }),
-        () => {
-          if (this.popupRef.current) {
-            this.popupRef.current.forceUpdate();
-          }
-          if (this.debouncedFetchItems) {
-            this.debouncedFetchItems.cancel();
-          }
-        }
-      );
-      return;
-    }
-    const { nextPageToken } = this.state;
-    this.setState(
-      safeStateUpdater(this.state, {
-        inputValue,
-        prevInputValue: this.state.inputValue,
-        nextPageToken: inputValue === this.state.inputValue ? nextPageToken : void 0,
-        isFetchingItems: true
-      }),
-      () => {
-        if (this.debouncedFetchItems) {
-          this.debouncedFetchItems.cancel();
-        }
-        this.debouncedFetchItems = debounce$1(this._fetchItems, DEBOUNCE_DELAY);
-        this.debouncedFetchItems();
-        if (this.popupRef.current) {
-          this.popupRef.current.forceUpdate();
-        }
-      }
-    );
-  };
-  _onBadgeClick = (e) => {
-    const { getItems, showApply, applyOnOutsideClick, loadingItems } = this.props;
-    const {
-      items,
-      innerValue,
-      showSelectedPopup,
-      selectItems,
-      isItemsGrouped,
-      isControlClicked,
-      showMainPopup
-    } = this.state;
-    if (e.target !== this.badgeRef.current) {
-      return;
-    }
-    let state = {
-      showSelectedPopup: !showSelectedPopup,
-      showMainPopup: false
-    };
-    if (loadingItems) {
-      state = {
-        showMainPopup: !showMainPopup,
-        showSelectedPopup: false
-      };
-      this.setState(state);
-      return;
-    }
-    if (showApply && !applyOnOutsideClick) {
-      state = {
-        ...state,
-        ...this._getPreviousValue()
-      };
-    }
-    if (getItems) {
-      state.selectedPopupItems = _uniqBy(
-        [
-          ...items.filter((item) => (state.innerValue || innerValue).has(item.value)),
-          ...selectItems
-        ],
-        "value"
-      );
-    } else if (isItemsGrouped) {
-      state.selectedPopupItems = items.map((group) => {
-        const groupItems = group.items.filter(
-          (item) => (state.innerValue || innerValue).has(item.value)
-        );
-        return {
-          groupTitle: group.groupTitle,
-          items: groupItems
-        };
-      });
-    } else {
-      state.selectedPopupItems = items.filter(
-        (item) => (state.innerValue || innerValue).has(item.value)
-      );
-    }
-    if (!isControlClicked) {
-      state.isControlClicked = true;
-    }
-    if (!showMainPopup) {
-      this._onOpenChange({ open: state.showSelectedPopup });
-    }
-    this.setState(safeStateUpdater(this.state, state));
-  };
-  _onControlClick = (e) => {
-    const { showMainPopup, isControlClicked, showSelectedPopup } = this.state;
-    const { showApply, applyOnOutsideClick, disabled } = this.props;
-    if (disabled || e.target === this.badgeRef.current) {
-      return;
-    }
-    let state = {
-      showMainPopup: !showMainPopup,
-      showSelectedPopup: false
-    };
-    if (showMainPopup && showApply) {
-      if (applyOnOutsideClick) {
-        this._onUpdate({ isOutsideClick: true });
-      } else {
-        state = {
-          ...state,
-          ...this._getPreviousValue()
-        };
-      }
-    }
-    if (!isControlClicked) {
-      state.isControlClicked = true;
-    }
-    if (!showSelectedPopup) {
-      this._onOpenChange({ open: state.showMainPopup });
-    }
-    this.setState(safeStateUpdater(this.state, state));
-  };
-  _onControlClickCapture = (e) => {
-    this._publishEvent({
-      eventId: "click",
-      domEvent: e
-    });
-  };
-  _onControlKeyPress = (e) => {
-    if (e.nativeEvent.code === "Enter" || e.nativeEvent.code === "Space") {
-      this._onControlClick(e);
-      e.preventDefault();
-    }
-  };
-  _onControlKeyPressCapture = (e) => {
-    if (e.nativeEvent.code === "Enter" || e.nativeEvent.code === "Space") {
-      this._onControlClickCapture(e);
-    }
-  };
-  _onApplyClick = () => {
-    this._onUpdate();
-    this.setState({
-      showMainPopup: false,
-      showSelectedPopup: false
-    });
-  };
-  _beforeOnUpdate() {
-    const { getItems, showApply } = this.props;
-    const { selectItems, innerValue } = this.state;
-    let items = this.state.items;
-    if (getItems) {
-      items = [...new Set(items.concat(selectItems || []))];
-    }
-    if (showApply) {
-      this.setState(
-        safeStateUpdater(this.state, {
-          titles: YCSelect.getTitles(items, innerValue)
-        })
-      );
-    } else {
-      this._onUpdate();
-    }
-  }
-  _onUpdate = ({ isOutsideClick } = {}) => {
-    const { type, allowNullableValues, onUpdate } = this.props;
-    const { innerValue } = this.state;
-    const values = [...innerValue];
-    let outputValues;
-    let outputItems;
-    if (onUpdate.length > 1) {
-      outputItems = this._getOutputItems();
-    }
-    if (type === YCSelect.SINGLE) {
-      const checkFunction = allowNullableValues ? isUndefined : isFalsy;
-      const nullableValue = allowNullableValues ? void 0 : null;
-      outputValues = checkFunction(values[0]) ? nullableValue : values[0];
-      outputItems = outputItems ? outputItems[0] : nullableValue;
-    } else {
-      outputValues = values;
-    }
-    onUpdate(outputValues, { items: outputItems, isOutsideClick });
-  };
-  _onOutsideMainPopupClick = () => {
-    const { showApply, applyOnOutsideClick } = this.props;
-    const { shownItems, isItemsGrouped } = this.state;
-    const isDisabled = isItemsGrouped ? shownItems.every((group) => group.items && !group.items.length) : !shownItems.length;
-    let state = { showMainPopup: false };
-    if (showApply && !isDisabled) {
-      if (applyOnOutsideClick) {
-        this._onUpdate({ isOutsideClick: true });
-      } else {
-        state = {
-          ...state,
-          ...this._getPreviousValue()
-        };
-      }
-    }
-    this.setState(safeStateUpdater(this.state, state));
-    this._onOpenChange({ open: state.showMainPopup });
-  };
-  _onOutsideSelectedItemsPopupClick = () => {
-    const { showApply, applyOnOutsideClick } = this.props;
-    const { selectedPopupItems, isItemsGrouped } = this.state;
-    const isDisabled = isItemsGrouped ? selectedPopupItems.every((group) => group.items && !group.items.length) : !selectedPopupItems.length;
-    let state = { showSelectedPopup: false };
-    if (showApply && !isDisabled) {
-      if (applyOnOutsideClick) {
-        this._onUpdate({ isOutsideClick: true });
-      } else {
-        state = {
-          ...state,
-          ...this._getPreviousValue()
-        };
-      }
-    }
-    this.setState(safeStateUpdater(this.state, state));
-    this._onOpenChange({ open: state.showSelectedPopup });
-  };
-  _onOpenChange = (popupState) => {
-    const { onOpenChange } = this.props;
-    if (onOpenChange && typeof onOpenChange === "function") {
-      onOpenChange(popupState);
-    }
-  };
-  _getPopupMinWidth() {
-    const { controlWidth, type, showSearch, onFetchErrorDetails } = this.props;
-    const { fetchError } = this.state;
-    const errorDetailsMinWidth = fetchError && onFetchErrorDetails ? 250 : void 0;
-    const possibleMinWidth = getPossiblePopupMinWidth({
-      withSearch: showSearch,
-      multiple: type === YCSelect.MULTIPLE
-    });
-    return _max([
-      errorDetailsMinWidth,
-      possibleMinWidth,
-      controlWidth || this.state.controlWidth
-    ]);
-  }
-  _getPopupClassNames() {
-    const { popupClassName, type, showSearch } = this.props;
-    const isMultiply = type === YCSelect.MULTIPLE;
-    const mods = {
-      search: showSearch,
-      multi: isMultiply
-    };
-    let mixins = getModifier("desktop");
-    if (popupClassName) {
-      mixins += " " + popupClassName;
-    }
-    return bPopup(mods, mixins);
-  }
-  _getPopupStyles() {
-    const { controlWidth, virtualizeThreshold, getItems, errorContent } = this.props;
-    const { shownItems = [] } = this.state;
-    const popupStyles = { minWidth: this._getPopupMinWidth() };
-    if (!errorContent) {
-      if (getItems || shownItems.length > virtualizeThreshold || this.props.popupWidth) {
-        const width = this.props.popupWidth || controlWidth || this.state.controlWidth;
-        popupStyles.width = width > MIN_VIRTUALIZED_POPUP_WIDTH ? width : MIN_VIRTUALIZED_POPUP_WIDTH;
-      } else if (this.state.popupWidth) {
-        popupStyles.width = this.state.popupWidth;
-      }
-    }
-    return popupStyles;
-  }
-  _renderTokens() {
-    const { placeholder } = this.props;
-    const { titles, isInitPending } = this.state;
-    let placeholderIcon;
-    let placeholderText;
-    if (placeholder && typeof placeholder === "object") {
-      placeholderIcon = placeholder.icon;
-      placeholderText = placeholder.text;
-    } else if (placeholder) {
-      placeholderText = placeholder;
-    }
-    placeholderText = isInitPending ? YCSelect.INIT_ITEMS_PLACEHOLDER : placeholderText || EMPTY_VALUE;
-    const empty = !titles.length;
-    return /* @__PURE__ */ React__default.createElement("div", { className: bControl("tokens") }, placeholderIcon && !titles.length && /* @__PURE__ */ React__default.createElement("div", { className: bControl("placeholder-icon") }, placeholderIcon), /* @__PURE__ */ React__default.createElement("span", { className: bControl("tokens-text", { empty }) }, empty ? placeholderText : this._renderTitles(titles)));
-  }
-  _renderTitles(titles) {
-    return titles.map((title, index) => {
-      return /* @__PURE__ */ React__default.createElement(React__default.Fragment, { key: index }, title, index === titles.length - 1 ? "" : ", ");
-    });
-  }
-  _renderControl() {
-    const {
-      controlWidth,
-      size,
-      type,
-      className,
-      label,
-      limitLabel,
-      showArrow,
-      showItemIcon,
-      stretched,
-      disabled,
-      loading,
-      renderSwitcher,
-      switcherClassName,
-      controlTestAnchor,
-      errorContent,
-      hasValidationError
-    } = this.props;
-    const {
-      showMainPopup,
-      showSelectedPopup,
-      innerValue,
-      isInitPending,
-      singleSelectItem: { icon } = {}
-    } = this.state;
-    if (renderSwitcher) {
-      return /* @__PURE__ */ React__default.createElement(
-        "div",
-        {
-          ref: this.controlRef,
-          className: b("switcher", switcherClassName),
-          onClick: this._onControlClick,
-          onClickCapture: this._onControlClickCapture,
-          "data-qa": controlTestAnchor
-        },
-        renderSwitcher()
-      );
-    }
-    const controlMods = {
-      size,
-      focused: showMainPopup || showSelectedPopup,
-      stretched,
-      disabled: disabled || isInitPending || loading,
-      "without-animation": (controlWidth || this.state.controlWidth) > MAX_CONTROL_WIDTH_WITH_ANIMATION,
-      error: Boolean(errorContent) || hasValidationError
-    };
-    const badgeMods = {
-      clicked: showSelectedPopup,
-      "without-arrow": !showArrow
-    };
-    const isMultiply = type === YCSelect.MULTIPLE;
-    const controlStyles = {};
-    if (controlWidth) {
-      controlStyles.width = controlWidth;
-    }
-    return /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        ref: this.controlRef,
-        tabIndex: disabled ? -1 : 0,
-        className: className ? bControl(controlMods, className) : bControl(controlMods),
-        style: controlStyles,
-        onClick: this._onControlClick,
-        onClickCapture: this._onControlClickCapture,
-        onKeyPressCapture: this._onControlKeyPressCapture,
-        onKeyPress: this._onControlKeyPress,
-        "data-qa": controlTestAnchor
-      },
-      loading ? /* @__PURE__ */ React__default.createElement("div", { className: bControl("loader") }, /* @__PURE__ */ React__default.createElement(Loader, { size: "s" })) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, label && /* @__PURE__ */ React__default.createElement("span", { className: bControl("label", { limited: limitLabel }) }, label), !isMultiply && showItemIcon && icon && /* @__PURE__ */ React__default.createElement("div", { className: bControl("selected-item-icon") }, icon), this._renderTokens(), isMultiply && Boolean(innerValue.size) && /* @__PURE__ */ React__default.createElement(
-        "div",
-        {
-          ref: this.badgeRef,
-          className: bControl("badge", badgeMods),
-          onClick: this._onBadgeClick
-        },
-        innerValue.size
-      )),
-      showArrow && /* @__PURE__ */ React__default.createElement("div", { className: bControl("arrow", { loading }) }, /* @__PURE__ */ React__default.createElement(Icon, { data: ChevronDown }))
-    );
-  }
-  _renderSearch() {
-    const { controlWidth, type, virtualizeThreshold, getItems } = this.props;
-    const { inputValue, shownItems } = this.state;
-    const inputUpdateHandler = getItems ? this._onInputUpdateDynamic : this._onInputUpdateStatic;
-    let searchWidth;
-    if (getItems || shownItems.length > virtualizeThreshold || this.props.popupWidth) {
-      const width = this.props.popupWidth || controlWidth || this.state.controlWidth;
-      searchWidth = width > MIN_VIRTUALIZED_POPUP_WIDTH ? width : MIN_VIRTUALIZED_POPUP_WIDTH;
-    } else if (this.state.popupWidth) {
-      searchWidth = this.state.popupWidth > this.state.controlWidth ? this.state.popupWidth : this.state.controlWidth;
-    }
-    return /* @__PURE__ */ React__default.createElement(
-      Search,
-      {
-        ref: this.searchRef,
-        value: inputValue,
-        width: this.props.popupWidth || searchWidth,
-        minWidth: _max([this._getPopupMinWidth(), controlWidth || this.state.controlWidth]),
-        searchButtonSettings: this._getSearchButtonSettings(),
-        onInputUpdate: inputUpdateHandler,
-        selectAllItems: type === YCSelect.MULTIPLE ? this.onMultipleSearchButtonClick : this.onSingleSearchButtonClick,
-        onClick: () => this._publishEvent({ eventId: "search-tap" })
-      }
-    );
-  }
-  _renderItems({ selectedPopup = false, mobile = false } = {}) {
-    const {
-      virtualizeThreshold,
-      type,
-      showSearch,
-      showApply,
-      showItemIcon,
-      showItemMeta,
-      getItems,
-      addItem,
-      onFetchErrorDetails,
-      fetchErrorDetailsTitle,
-      itemsListTestAnchor,
-      errorContent
-    } = this.props;
-    const {
-      shownItems,
-      selectedPopupItems,
-      showMainPopup,
-      showSelectedPopup,
-      selectedCurrentItem,
-      inputValue,
-      isFetchingItems,
-      isItemsGrouped,
-      innerValue,
-      nextPageToken,
-      fetchError
-    } = this.state;
-    let props = {
-      innerValue,
-      inputValue,
-      virtualizeThreshold,
-      selectedCurrentItem,
-      selectType: type,
-      showSearch,
-      showApply,
-      showItemIcon,
-      showItemMeta,
-      isItemsGrouped,
-      mobile,
-      itemsListTestAnchor,
-      onItemClick: type === YCSelect.MULTIPLE ? this.selectItems : this.selectItem,
-      selectOnlyCurrentItem: this.selectOnlyCurrentItem,
-      setPopupWidth: this.setPopupWidth,
-      errorContent
-    };
-    if (selectedPopup) {
-      props = {
-        ...props,
-        items: selectedPopupItems,
-        visible: showSelectedPopup,
-        selectedItemsPopup: true
-      };
-    } else {
-      props = {
-        ...props,
-        items: shownItems,
-        visible: showMainPopup,
-        showMoreItems: Boolean(nextPageToken),
-        isDynamic: Boolean(getItems),
-        isFetchingItems,
-        fetchError,
-        onFetchErrorDetails,
-        fetchErrorDetailsTitle,
-        fetchItems: this._fetchItems,
-        addNewItem: addItem ? this.addNewItem : void 0
-      };
-    }
-    return /* @__PURE__ */ React__default.createElement(ItemsWrapper, { ...props });
-  }
-  _renderApplyButton() {
-    const { type, showApply } = this.props;
-    const { shownItems, selectedPopupItems, isItemsGrouped, showMainPopup, showSelectedPopup } = this.state;
-    const isMultiply = type === YCSelect.MULTIPLE;
-    if (!isMultiply || !showApply) {
-      return null;
-    }
-    const isClosing = !showMainPopup && !showSelectedPopup;
-    let isDisabled;
-    if (showMainPopup) {
-      isDisabled = isItemsGrouped ? shownItems.every((group) => group.items && !group.items.length) : !shownItems.length;
-    } else {
-      isDisabled = isItemsGrouped ? selectedPopupItems.every((group) => group.items && !group.items.length) : !selectedPopupItems.length;
-    }
-    return /* @__PURE__ */ React__default.createElement("div", { className: bAction() }, /* @__PURE__ */ React__default.createElement(
-      Button,
-      {
-        view: "action",
-        size: "l",
-        width: "max",
-        onClick: this._onApplyClick,
-        disabled: isDisabled || isClosing
-      },
-      trans("apply_button_text")
-    ));
-  }
-  _renderPopupContent({ isMobile }) {
-    const { showSearch, errorContent, loadingItems, itemsLoaderClassName } = this.props;
-    const shouldRenderSearch = showSearch && !errorContent && (isMobile || this.state.popupWidth);
-    return loadingItems ? /* @__PURE__ */ React__default.createElement("div", { className: bPopup("loader", { mobile: isMobile }, itemsLoaderClassName) }, /* @__PURE__ */ React__default.createElement(Loader, { size: "s" })) : /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        style: isMobile ? {} : this._getPopupStyles(),
-        className: isMobile ? {} : this._getPopupClassNames()
-      },
-      shouldRenderSearch && this._renderSearch(),
-      /* @__PURE__ */ React__default.createElement("div", { ref: this.selectorRef }, this._renderItems({ mobile: isMobile })),
-      this._renderApplyButton()
-    );
-  }
-  _renderDesktopContent() {
-    const { showMainPopup, showSelectedPopup, isControlClicked } = this.state;
-    if (!isControlClicked) {
-      return null;
-    }
-    const popupStyles = this._getPopupStyles();
-    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
-      Popup,
-      {
-        open: showMainPopup,
-        anchorElement: this.controlRef.current,
-        placement: AVAILABLE_POPUP_DIRECTIONS,
-        onOpenChange: (open) => {
-          if (!open) {
-            this._onOutsideMainPopupClick();
-          }
-        },
-        initialFocus: 0
-      },
-      this._renderPopupContent({ isMobile: false })
-    ), /* @__PURE__ */ React__default.createElement(
-      Popup,
-      {
-        open: showSelectedPopup,
-        anchorElement: this.controlRef.current,
-        placement: AVAILABLE_POPUP_DIRECTIONS,
-        onOpenChange: (open) => {
-          if (!open) {
-            this._onOutsideSelectedItemsPopupClick();
-          }
-        }
-      },
-      /* @__PURE__ */ React__default.createElement("div", { style: popupStyles, className: this._getPopupClassNames() }, /* @__PURE__ */ React__default.createElement("div", { className: bPopup("select-title") }, trans("selected_popup_title")), this._renderItems({ selectedPopup: true }), this._renderApplyButton())
-    ));
-  }
-  _renderMobileContent() {
-    const { label } = this.props;
-    const { showMainPopup, showSelectedPopup } = this.state;
-    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
-      Sheet,
-      {
-        id: "yc-select-main",
-        title: label,
-        visible: showMainPopup,
-        contentClassName: bSheet(null, getModifier("mobile")),
-        allowHideOnContentScroll: false,
-        onClose: this._onOutsideMainPopupClick
-      },
-      this._renderPopupContent({ isMobile: true })
-    ), /* @__PURE__ */ React__default.createElement(
-      Sheet,
-      {
-        id: "yc-select-selected",
-        title: label,
-        visible: showSelectedPopup,
-        contentClassName: bSheet(null, getModifier("mobile")),
-        allowHideOnContentScroll: false,
-        onClose: this._onOutsideSelectedItemsPopupClick
-      },
-      /* @__PURE__ */ React__default.createElement("div", { className: bPopup("select-title") }, trans("selected_popup_title")),
-      this._renderItems({ selectedPopup: true, mobile: true }),
-      this._renderApplyButton()
-    ));
-  }
-  render() {
-    return /* @__PURE__ */ React__default.createElement(MobileContext.Consumer, null, ({ mobile }) => {
-      return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, this._renderControl(), mobile ? this._renderMobileContent() : this._renderDesktopContent());
-    });
-  }
-}
-const YCSelectDefaultProps = {
-  size: "s",
-  itemsPageSize: 100,
-  virtualizeThreshold: 100,
-  type: YCSelect.SINGLE,
-  items: [],
-  showSearch: true,
-  showArrow: true,
-  stretched: true,
-  showApply: false,
-  showItemIcon: false,
-  showItemMeta: false,
-  showMissingItems: false,
-  allowEmptyValue: false,
-  allowNullableValues: false,
-  showSelectAll: true,
-  hiding: false,
-  disabled: false,
-  loading: false,
-  applyOnOutsideClick: true,
-  loadingItems: false
-};
-YCSelect.defaultProps = YCSelectDefaultProps;
-export {
-  Datepicker as D,
-  RangeInputPicker as R,
-  YCSelect as Y,
-  DatepickerControl as a
-};