@skbkontur/react-ui 0.0.0-044e274f2c → 0.0.0-07d08325b0

package/cjs/components/DateRangePicker/__docs__/DateRangePicker.mdx

@@ -0,0 +1,127 @@
+import * as DateRangePickerStories from './DateRangePicker.docs.stories.tsx';
+import { Primary, ArgTypes, Stories, Description } from '@storybook/blocks';
+import { Meta } from '../../../.storybook/Meta';
+
+<Meta of={DateRangePickerStories} />
+
+# DateRangePicker
+
+[Компонент в Контур.Гайдах](https://guides.kontur.ru/components/input-fields/calendar/)
+
+[Компонент в Figma](https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=281%3A18389)
+
+<Description />
+
+<br />
+<br />
+
+## Базовый пример
+
+Компонент выбора периода состоит из 3-х дочерних компонентов:
+
+- `<DateRangePicker.Start>` — начало периода с настройками как у `DateInput`
+- `<DateRangePicker.End>` — окончание периода с настройками как у `DateInput`
+- `<DateRangePicker.Separator>` — разделитель между полями
+
+Значения задается через пропы у компонентов `Start` и `End`:
+
+- 2 значения указываются в пропах `value={'dd.mm.yyyy'}` (формат настраивается)
+- Пустыми значениями считаются `""`, `null` и `undefined`
+- Минимальная дата задаётся в `Start` через `minDate`, максимальная — в `End` через `maxDate`
+
+<Primary />
+
+## Пропы
+
+<details>
+  <summary>Открыть таблицу с пропами</summary>
+  <ArgTypes />
+</details>
+
+<Stories title="" includePrimary={false} />
+
+## Адаптивность
+
+На мобильных устройствах доступны 2 варианта отображения:
+
+- Адаптивная версия в попапе (по умолчанию)
+
+- 2 нативных календаря через `useMobileNativeDatePicker`. <br /> Ограничение: [календарь в iOS не поддерживает параметры min и max](https://bugs.webkit.org/show_bug.cgi?id=225639)
+
+## Локали по умолчанию
+
+```typescript static
+interface DateRangePickerLocale {
+  today?: string;
+  months?: string[];
+  order?: DateOrder;
+  separator?: DateSeparator;
+  todayAriaLabel?: string;
+  selectMonthAriaLabel?: string;
+  selectYearAriaLabel?: string;
+  selectChosenAriaLabel?: string;
+  dayCellChooseDateAriaLabel?: string;
+  startDateLabel?: string;
+  endDateLabel?: string;
+  startDateEmpty?: string;
+  endDateEmpty?: string;
+}
+
+const ru_RU = {
+  today: 'Сегодня',
+  months: [
+    'Январь',
+    'Февраль',
+    'Март',
+    'Апрель',
+    'Май',
+    'Июнь',
+    'Июль',
+    'Август',
+    'Сентябрь',
+    'Октябрь',
+    'Ноябрь',
+    'Декабрь',
+  ],
+  order: DateOrder.DMY,
+  separator: DateSeparator.Dot,
+  todayAriaLabel: 'Перейти к сегодняшней дате',
+  selectMonthAriaLabel: 'месяц',
+  selectYearAriaLabel: 'год',
+  selectChosenAriaLabel: 'Выбранный',
+  dayCellChooseDateAriaLabel: 'Выбрать дату',
+  startDateLabel: 'Дата начала',
+  endDateLabel: 'Дата окончания',
+  startDateEmpty: 'Без первой даты',
+  endDateEmpty: 'Без второй даты',
+};
+
+const en_GB = {
+  today: 'Endday',
+  months: [
+    'January',
+    'February',
+    'March',
+    'April',
+    'May',
+    'June',
+    'July',
+    'August',
+    'September',
+    'October',
+    'November',
+    'December',
+  ],
+  order: DateOrder.MDY,
+  separator: DateSeparator.Slash,
+  todayAriaLabel: "Go end today's date",
+  selectMonthAriaLabel: 'month',
+  selectYearAriaLabel: 'year',
+  selectChosenAriaLabel: 'Chosen',
+  dayCellChooseDateAriaLabel: 'Choose date',
+  startDateLabel: 'Start date',
+  endDateLabel: 'End date',
+  startDateEmpty: 'No start date',
+  endDateEmpty: 'No end date',
+};
+```

package/cjs/components/DateRangePicker/helpers/getStateForValue.d.ts

@@ -0,0 +1,9 @@
+import { DateRangePickerInputType } from '../DateRangePickerInput';
+interface DateRangeState {
+    start: string;
+    end: string;
+    focus: DateRangePickerInputType | null;
+    isOpen: true;
+}
+export declare function getStateForValue(currentFocus: DateRangePickerInputType | null, value?: string, contextOptions?: {}): DateRangeState;
+export {};

package/cjs/components/DateRangePicker/helpers/getStateForValue.js

@@ -0,0 +1,122 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStateForValue = getStateForValue;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _comparison = require("../../../lib/date/comparison");
+var _constants = require("../../../lib/date/constants");
+
+
+
+
+
+
+
+
+var defaultContextOptions = {
+  currentStart: '',
+  currentEnd: '',
+  minDate: _constants.MIN_FULLDATE,
+  maxDate: _constants.MAX_FULLDATE
+};
+
+function getStateForValue(
+currentFocus,
+value,
+contextOptions)
+{if (value === void 0) {value = '';}if (contextOptions === void 0) {contextOptions = {};}
+  var _defaultContextOption = (0, _extends2.default)({}, defaultContextOptions, contextOptions),currentStart = _defaultContextOption.currentStart,currentEnd = _defaultContextOption.currentEnd,minDate = _defaultContextOption.minDate,maxDate = _defaultContextOption.maxDate;
+
+  var start = currentStart;
+  var end = currentEnd;
+  var focus = currentFocus;
+  var isOpen = true;
+
+  if (minDate && (0, _comparison.isLess)(value, minDate) || maxDate && (0, _comparison.isGreater)(value, maxDate)) {
+    return {
+      start: start,
+      end: end,
+      focus: focus,
+      isOpen: isOpen
+    };
+  }
+
+  var handleInitialPeriod = function handleInitialPeriod(date) {
+    if (currentFocus === 'start') {
+      start = date;
+      focus = 'end';
+    } else {
+      end = date;
+      focus = 'start';
+    }
+  };
+
+  var handlePartialPeriod = function handlePartialPeriod(date) {
+    if (currentFocus === 'start') {
+      if (currentStart) {
+        start = date;
+        focus = 'end';
+        return;
+      }
+
+      if (currentEnd && (0, _comparison.isGreater)(date, currentEnd)) {
+        start = date;
+        end = '';
+        focus = 'end';
+        return;
+      }
+
+      start = date;
+      isOpen = false;
+    } else if (currentFocus === 'end') {
+      if (currentEnd) {
+        end = date;
+        focus = 'start';
+        return;
+      }
+
+      if (currentStart && (0, _comparison.isLess)(date, currentStart)) {
+        start = date;
+        end = '';
+        focus = 'end';
+        return;
+      }
+
+      end = date;
+      isOpen = false;
+    }
+  };
+
+  var handleFullPeriod = function handleFullPeriod(date) {
+    if (currentFocus === 'start') {
+      if (currentEnd && (0, _comparison.isLessOrEqual)(date, currentEnd)) {
+        start = date;
+        isOpen = false;
+      } else {
+        start = date;
+        end = '';
+        focus = 'end';
+      }
+    } else if (currentFocus === 'end') {
+      if (currentStart && (0, _comparison.isGreaterOrEqual)(date, currentStart)) {
+        end = date;
+        isOpen = false;
+      } else {
+        start = date;
+        end = '';
+        focus = 'end';
+      }
+    }
+  };
+
+  if (!currentStart && !currentEnd) {
+    handleInitialPeriod(value);
+  } else if (currentStart && !currentEnd || !currentStart && currentEnd) {
+    handlePartialPeriod(value);
+  } else {
+    handleFullPeriod(value);
+  }
+
+  return {
+    start: start,
+    end: end,
+    focus: focus,
+    isOpen: isOpen
+  };
+}

package/cjs/components/DateRangePicker/helpers/getStateForValue.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_comparison","require","_constants","defaultContextOptions","currentStart","currentEnd","minDate","MIN_FULLDATE","maxDate","MAX_FULLDATE","getStateForValue","currentFocus","value","contextOptions","_defaultContextOption","_extends2","default","start","end","focus","isOpen","isLess","isGreater","handleInitialPeriod","date","handlePartialPeriod","handleFullPeriod","isLessOrEqual","isGreaterOrEqual"],"sources":["getStateForValue.ts"],"sourcesContent":["import { DateRangePickerInputType } from '../DateRangePickerInput';\nimport { isLess, isGreater, isLessOrEqual, isGreaterOrEqual } from '../../../lib/date/comparison';\nimport { MIN_FULLDATE, MAX_FULLDATE } from '../../../lib/date/constants';\n\ninterface DateRangeState {\n  start: string;\n  end: string;\n  focus: DateRangePickerInputType | null;\n  isOpen: true;\n}\n\nconst defaultContextOptions = {\n  currentStart: '',\n  currentEnd: '',\n  minDate: MIN_FULLDATE,\n  maxDate: MAX_FULLDATE,\n};\n\nexport function getStateForValue(\n  currentFocus: DateRangePickerInputType | null,\n  value = '',\n  contextOptions = {},\n): DateRangeState {\n  const { currentStart, currentEnd, minDate, maxDate } = { ...defaultContextOptions, ...contextOptions };\n\n  let start = currentStart;\n  let end = currentEnd;\n  let focus = currentFocus;\n  let isOpen = true;\n\n  if ((minDate && isLess(value, minDate)) || (maxDate && isGreater(value, maxDate))) {\n    return {\n      start,\n      end,\n      focus,\n      isOpen,\n    };\n  }\n\n  const handleInitialPeriod = (date: string) => {\n    if (currentFocus === 'start') {\n      start = date;\n      focus = 'end';\n    } else {\n      end = date;\n      focus = 'start';\n    }\n  };\n\n  const handlePartialPeriod = (date: string) => {\n    if (currentFocus === 'start') {\n      if (currentStart) {\n        start = date;\n        focus = 'end';\n        return;\n      }\n\n      if (currentEnd && isGreater(date, currentEnd)) {\n        start = date;\n        end = '';\n        focus = 'end';\n        return;\n      }\n\n      start = date;\n      isOpen = false;\n    } else if (currentFocus === 'end') {\n      if (currentEnd) {\n        end = date;\n        focus = 'start';\n        return;\n      }\n\n      if (currentStart && isLess(date, currentStart)) {\n        start = date;\n        end = '';\n        focus = 'end';\n        return;\n      }\n\n      end = date;\n      isOpen = false;\n    }\n  };\n\n  const handleFullPeriod = (date: string) => {\n    if (currentFocus === 'start') {\n      if (currentEnd && isLessOrEqual(date, currentEnd)) {\n        start = date;\n        isOpen = false;\n      } else {\n        start = date;\n        end = '';\n        focus = 'end';\n      }\n    } else if (currentFocus === 'end') {\n      if (currentStart && isGreaterOrEqual(date, currentStart)) {\n        end = date;\n        isOpen = false;\n      } else {\n        start = date;\n        end = '';\n        focus = 'end';\n      }\n    }\n  };\n\n  if (!currentStart && !currentEnd) {\n    handleInitialPeriod(value);\n  } else if ((currentStart && !currentEnd) || (!currentStart && currentEnd)) {\n    handlePartialPeriod(value);\n  } else {\n    handleFullPeriod(value);\n  }\n\n  return {\n    start,\n    end,\n    focus,\n    isOpen,\n  };\n}\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/DateRangePicker/helpers/validateDateRangePicker.d.ts

@@ -0,0 +1,9 @@
+import { Nullable } from '../../../typings/utility-types';
+interface ValidationOptions {
+    startOptional?: boolean;
+    endOptional?: boolean;
+    minDate?: string;
+    maxDate?: string;
+}
+export declare function validateDateRangePicker(startValue: Nullable<string>, endValue: Nullable<string>, options?: ValidationOptions): boolean[];
+export {};

package/cjs/components/DateRangePicker/helpers/validateDateRangePicker.js

@@ -0,0 +1,67 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.validateDateRangePicker = validateDateRangePicker;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _types = require("../../../lib/date/types");
+var _InternalDate = require("../../../lib/date/InternalDate");
+var _constants = require("../../../lib/date/constants");
+var _comparison = require("../../../lib/date/comparison");
+
+
+
+
+
+
+
+
+
+var defaultOptions = {
+  startOptional: false,
+  endOptional: false,
+  minDate: _constants.MIN_FULLDATE,
+  maxDate: _constants.MAX_FULLDATE
+};
+
+function validateDateRangePicker(
+startValue,
+endValue,
+options)
+{if (options === void 0) {options = defaultOptions;}
+  var _defaultOptions$optio = (0, _extends2.default)({}, defaultOptions, options),startOptional = _defaultOptions$optio.startOptional,endOptional = _defaultOptions$optio.endOptional,minDate = _defaultOptions$optio.minDate,maxDate = _defaultOptions$optio.maxDate;
+
+  if (startOptional && !startValue && endOptional && !endValue) {
+    return [true, true];
+  }
+
+  var isStartRequiredAndEmpty = !startOptional && !startValue;
+  var isEndRequiredAndEmpty = !endOptional && !endValue;
+
+  if (isStartRequiredAndEmpty || isEndRequiredAndEmpty) {
+    return [!isStartRequiredAndEmpty, !isEndRequiredAndEmpty];
+  }
+
+  var isValuesRequired = !startOptional && !endOptional;
+  if (isValuesRequired && (0, _comparison.isGreater)(startValue || '', endValue || '')) {
+    return [false, false];
+  }
+
+  var internalDate = new _InternalDate.InternalDate({
+    order: _types.InternalDateOrder.DMY,
+    separator: _types.InternalDateSeparator.Dot
+  }).
+  setRangeStart(new _InternalDate.InternalDate({ value: minDate })).
+  setRangeEnd(new _InternalDate.InternalDate({ value: maxDate }));
+
+  var isStartValid = startValue ? checkDate(internalDate.parseValue(startValue)) : true;
+  var isEndValid = endValue ? checkDate(internalDate.parseValue(endValue)) : true;
+
+  return [isStartValid, isEndValid];
+}
+
+function checkDate(internalDate) {
+  return internalDate.validate({
+    checks: [
+    _types.InternalDateValidateCheck.NotNull,
+    _types.InternalDateValidateCheck.Number,
+    _types.InternalDateValidateCheck.Native,
+    _types.InternalDateValidateCheck.Limits,
+    _types.InternalDateValidateCheck.Range]
+
+  });
+}

package/cjs/components/DateRangePicker/helpers/validateDateRangePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_types","require","_InternalDate","_constants","_comparison","defaultOptions","startOptional","endOptional","minDate","MIN_FULLDATE","maxDate","MAX_FULLDATE","validateDateRangePicker","startValue","endValue","options","_defaultOptions$optio","_extends2","default","isStartRequiredAndEmpty","isEndRequiredAndEmpty","isValuesRequired","isGreater","internalDate","InternalDate","order","InternalDateOrder","DMY","separator","InternalDateSeparator","Dot","setRangeStart","value","setRangeEnd","isStartValid","checkDate","parseValue","isEndValid","validate","checks","InternalDateValidateCheck","NotNull","Number","Native","Limits","Range"],"sources":["validateDateRangePicker.ts"],"sourcesContent":["import { InternalDateOrder, InternalDateSeparator, InternalDateValidateCheck } from '../../../lib/date/types';\nimport { InternalDate } from '../../../lib/date/InternalDate';\nimport { MAX_FULLDATE, MIN_FULLDATE } from '../../../lib/date/constants';\nimport { isGreater } from '../../../lib/date/comparison';\nimport { Nullable } from '../../../typings/utility-types';\n\ninterface ValidationOptions {\n  startOptional?: boolean;\n  endOptional?: boolean;\n  minDate?: string;\n  maxDate?: string;\n}\n\nconst defaultOptions: ValidationOptions = {\n  startOptional: false,\n  endOptional: false,\n  minDate: MIN_FULLDATE,\n  maxDate: MAX_FULLDATE,\n};\n\nexport function validateDateRangePicker(\n  startValue: Nullable<string>,\n  endValue: Nullable<string>,\n  options: ValidationOptions = defaultOptions,\n) {\n  const { startOptional, endOptional, minDate, maxDate } = { ...defaultOptions, ...options };\n\n  if (startOptional && !startValue && endOptional && !endValue) {\n    return [true, true];\n  }\n\n  const isStartRequiredAndEmpty = !startOptional && !startValue;\n  const isEndRequiredAndEmpty = !endOptional && !endValue;\n\n  if (isStartRequiredAndEmpty || isEndRequiredAndEmpty) {\n    return [!isStartRequiredAndEmpty, !isEndRequiredAndEmpty];\n  }\n\n  const isValuesRequired = !startOptional && !endOptional;\n  if (isValuesRequired && isGreater(startValue || '', endValue || '')) {\n    return [false, false];\n  }\n\n  const internalDate = new InternalDate({\n    order: InternalDateOrder.DMY,\n    separator: InternalDateSeparator.Dot,\n  })\n    .setRangeStart(new InternalDate({ value: minDate }))\n    .setRangeEnd(new InternalDate({ value: maxDate }));\n\n  const isStartValid = startValue ? checkDate(internalDate.parseValue(startValue)) : true;\n  const isEndValid = endValue ? checkDate(internalDate.parseValue(endValue)) : true;\n\n  return [isStartValid, isEndValid];\n}\n\nfunction checkDate(internalDate: InternalDate) {\n  return internalDate.validate({\n    checks: [\n      InternalDateValidateCheck.NotNull,\n      InternalDateValidateCheck.Number,\n      InternalDateValidateCheck.Native,\n      InternalDateValidateCheck.Limits,\n      InternalDateValidateCheck.Range,\n    ],\n  });\n}\n"],"mappings":"gRAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;;;;;;;;;;AAUA,IAAMI,cAAiC,GAAG;EACxCC,aAAa,EAAE,KAAK;EACpBC,WAAW,EAAE,KAAK;EAClBC,OAAO,EAAEC,uBAAY;EACrBC,OAAO,EAAEC;AACX,CAAC;;AAEM,SAASC,uBAAuBA;AACrCC,UAA4B;AAC5BC,QAA0B;AAC1BC,OAA0B;AAC1B,KADAA,OAA0B,cAA1BA,OAA0B,GAAGV,cAAc;EAE3C,IAAAW,qBAAA,OAAAC,SAAA,CAAAC,OAAA,MAA8Db,cAAc,EAAKU,OAAO,EAAhFT,aAAa,GAAAU,qBAAA,CAAbV,aAAa,CAAEC,WAAW,GAAAS,qBAAA,CAAXT,WAAW,CAAEC,OAAO,GAAAQ,qBAAA,CAAPR,OAAO,CAAEE,OAAO,GAAAM,qBAAA,CAAPN,OAAO;;EAEpD,IAAIJ,aAAa,IAAI,CAACO,UAAU,IAAIN,WAAW,IAAI,CAACO,QAAQ,EAAE;IAC5D,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC;EACrB;;EAEA,IAAMK,uBAAuB,GAAG,CAACb,aAAa,IAAI,CAACO,UAAU;EAC7D,IAAMO,qBAAqB,GAAG,CAACb,WAAW,IAAI,CAACO,QAAQ;;EAEvD,IAAIK,uBAAuB,IAAIC,qBAAqB,EAAE;IACpD,OAAO,CAAC,CAACD,uBAAuB,EAAE,CAACC,qBAAqB,CAAC;EAC3D;;EAEA,IAAMC,gBAAgB,GAAG,CAACf,aAAa,IAAI,CAACC,WAAW;EACvD,IAAIc,gBAAgB,IAAI,IAAAC,qBAAS,EAACT,UAAU,IAAI,EAAE,EAAEC,QAAQ,IAAI,EAAE,CAAC,EAAE;IACnE,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC;EACvB;;EAEA,IAAMS,YAAY,GAAG,IAAIC,0BAAY,CAAC;IACpCC,KAAK,EAAEC,wBAAiB,CAACC,GAAG;IAC5BC,SAAS,EAAEC,4BAAqB,CAACC;EACnC,CAAC,CAAC;EACCC,aAAa,CAAC,IAAIP,0BAAY,CAAC,EAAEQ,KAAK,EAAExB,OAAO,CAAC,CAAC,CAAC,CAAC;EACnDyB,WAAW,CAAC,IAAIT,0BAAY,CAAC,EAAEQ,KAAK,EAAEtB,OAAO,CAAC,CAAC,CAAC,CAAC;;EAEpD,IAAMwB,YAAY,GAAGrB,UAAU,GAAGsB,SAAS,CAACZ,YAAY,CAACa,UAAU,CAACvB,UAAU,CAAC,CAAC,GAAG,IAAI;EACvF,IAAMwB,UAAU,GAAGvB,QAAQ,GAAGqB,SAAS,CAACZ,YAAY,CAACa,UAAU,CAACtB,QAAQ,CAAC,CAAC,GAAG,IAAI;;EAEjF,OAAO,CAACoB,YAAY,EAAEG,UAAU,CAAC;AACnC;;AAEA,SAASF,SAASA,CAACZ,YAA0B,EAAE;EAC7C,OAAOA,YAAY,CAACe,QAAQ,CAAC;IAC3BC,MAAM,EAAE;IACNC,gCAAyB,CAACC,OAAO;IACjCD,gCAAyB,CAACE,MAAM;IAChCF,gCAAyB,CAACG,MAAM;IAChCH,gCAAyB,CAACI,MAAM;IAChCJ,gCAAyB,CAACK,KAAK;;EAEnC,CAAC,CAAC;AACJ","ignoreList":[]}

package/cjs/components/DateRangePicker/index.d.ts

@@ -0,0 +1 @@
+export * from './DateRangePicker';

package/cjs/components/DateRangePicker/index.js

@@ -0,0 +1 @@
+"use strict";exports.__esModule = true;var _DateRangePicker = require("./DateRangePicker");Object.keys(_DateRangePicker).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _DateRangePicker[key]) return;exports[key] = _DateRangePicker[key];});

package/cjs/components/DateRangePicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_DateRangePicker","require","Object","keys","forEach","key","exports"],"sources":["index.tsx"],"sourcesContent":["export * from './DateRangePicker';\n"],"mappings":"uCAAA,IAAAA,gBAAA,GAAAC,OAAA,sBAAAC,MAAA,CAAAC,IAAA,CAAAH,gBAAA,EAAAI,OAAA,WAAAC,GAAA,OAAAA,GAAA,kBAAAA,GAAA,8BAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,gBAAA,CAAAK,GAAA,UAAAC,OAAA,CAAAD,GAAA,IAAAL,gBAAA,CAAAK,GAAA","ignoreList":[]}

package/cjs/components/DateRangePicker/locale/index.d.ts

@@ -0,0 +1,4 @@
+import { LocaleHelper } from '../../../lib/locale/LocaleHelper';
+import { DateRangePickerLocale } from './types';
+export * from './types';
+export declare const DateRangePickerLocaleHelper: LocaleHelper<DateRangePickerLocale>;

package/cjs/components/DateRangePicker/locale/index.js

@@ -0,0 +1,12 @@
+"use strict";exports.__esModule = true;var _exportNames = { DateRangePickerLocaleHelper: true };exports.DateRangePickerLocaleHelper = void 0;var _LocaleHelper = require("../../../lib/locale/LocaleHelper");
+
+var _en = require("./locales/en");
+var _ru = require("./locales/ru");
+
+
+var _types = require("./types");Object.keys(_types).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _types[key]) return;exports[key] = _types[key];});
+
+var DateRangePickerLocaleHelper = exports.DateRangePickerLocaleHelper = new _LocaleHelper.LocaleHelper({
+  ru_RU: _ru.componentsLocales,
+  en_GB: _en.componentsLocales
+});

package/cjs/components/DateRangePicker/locale/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_LocaleHelper","require","_en","_ru","_types","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","DateRangePickerLocaleHelper","LocaleHelper","ru_RU","en_GB"],"sources":["index.ts"],"sourcesContent":["import { LocaleHelper } from '../../../lib/locale/LocaleHelper';\n\nimport { componentsLocales as en_GB } from './locales/en';\nimport { componentsLocales as ru_RU } from './locales/ru';\nimport { DateRangePickerLocale } from './types';\n\nexport * from './types';\n\nexport const DateRangePickerLocaleHelper = new LocaleHelper<DateRangePickerLocale>({\n  ru_RU,\n  en_GB,\n});\n"],"mappings":"6IAAA,IAAAA,aAAA,GAAAC,OAAA;;AAEA,IAAAC,GAAA,GAAAD,OAAA;AACA,IAAAE,GAAA,GAAAF,OAAA;;;AAGA,IAAAG,MAAA,GAAAH,OAAA,YAAAI,MAAA,CAAAC,IAAA,CAAAF,MAAA,EAAAG,OAAA,WAAAC,GAAA,OAAAA,GAAA,kBAAAA,GAAA,8BAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA,cAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAJ,MAAA,CAAAI,GAAA,UAAAK,OAAA,CAAAL,GAAA,IAAAJ,MAAA,CAAAI,GAAA;;AAEO,IAAMM,2BAA2B,GAAAD,OAAA,CAAAC,2BAAA,GAAG,IAAIC,0BAAY,CAAwB;EACjFC,KAAK,EAALA,qBAAK;EACLC,KAAK,EAALA;AACF,CAAC,CAAC","ignoreList":[]}

package/cjs/components/DateRangePicker/locale/locales/en.d.ts

@@ -0,0 +1,2 @@
+import { DateRangePickerLocale } from '../types';
+export declare const componentsLocales: DateRangePickerLocale;

package/cjs/components/DateRangePicker/locale/locales/en.js

@@ -0,0 +1,9 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.componentsLocales = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _en = require("../../../DatePicker/locale/locales/en");
+
+var componentsLocales = exports.componentsLocales = (0, _extends2.default)({
+  startDateLabel: 'Start date',
+  endDateLabel: 'End date',
+  startDateEmpty: 'No start date',
+  endDateEmpty: 'No end date' },
+_en.componentsLocales);

package/cjs/components/DateRangePicker/locale/locales/en.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_en","require","componentsLocales","exports","_extends2","default","startDateLabel","endDateLabel","startDateEmpty","endDateEmpty","DatePickerLocale"],"sources":["en.ts"],"sourcesContent":["import { DateRangePickerLocale } from '../types';\nimport { componentsLocales as DatePickerLocale } from '../../../DatePicker/locale/locales/en';\n\nexport const componentsLocales: DateRangePickerLocale = {\n  startDateLabel: 'Start date',\n  endDateLabel: 'End date',\n  startDateEmpty: 'No start date',\n  endDateEmpty: 'No end date',\n  ...DatePickerLocale,\n};\n"],"mappings":";AACA,IAAAA,GAAA,GAAAC,OAAA;;AAEO,IAAMC,iBAAwC,GAAAC,OAAA,CAAAD,iBAAA,OAAAE,SAAA,CAAAC,OAAA;EACnDC,cAAc,EAAE,YAAY;EAC5BC,YAAY,EAAE,UAAU;EACxBC,cAAc,EAAE,eAAe;EAC/BC,YAAY,EAAE,aAAa;AACxBC,qBAAgB,CACpB","ignoreList":[]}

package/cjs/components/DateRangePicker/locale/locales/ru.d.ts

@@ -0,0 +1,2 @@
+import { DateRangePickerLocale } from '../types';
+export declare const componentsLocales: DateRangePickerLocale;

package/cjs/components/DateRangePicker/locale/locales/ru.js

@@ -0,0 +1,9 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.componentsLocales = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _ru = require("../../../DatePicker/locale/locales/ru");
+
+var componentsLocales = exports.componentsLocales = (0, _extends2.default)({
+  startDateLabel: 'Дата начала',
+  endDateLabel: 'Дата окончания',
+  startDateEmpty: 'Без первой даты',
+  endDateEmpty: 'Без второй даты' },
+_ru.componentsLocales);

package/cjs/components/DateRangePicker/locale/locales/ru.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_ru","require","componentsLocales","exports","_extends2","default","startDateLabel","endDateLabel","startDateEmpty","endDateEmpty","DatePickerLocale"],"sources":["ru.ts"],"sourcesContent":["import { DateRangePickerLocale } from '../types';\nimport { componentsLocales as DatePickerLocale } from '../../../DatePicker/locale/locales/ru';\n\nexport const componentsLocales: DateRangePickerLocale = {\n  startDateLabel: 'Дата начала',\n  endDateLabel: 'Дата окончания',\n  startDateEmpty: 'Без первой даты',\n  endDateEmpty: 'Без второй даты',\n  ...DatePickerLocale,\n};\n"],"mappings":";AACA,IAAAA,GAAA,GAAAC,OAAA;;AAEO,IAAMC,iBAAwC,GAAAC,OAAA,CAAAD,iBAAA,OAAAE,SAAA,CAAAC,OAAA;EACnDC,cAAc,EAAE,aAAa;EAC7BC,YAAY,EAAE,gBAAgB;EAC9BC,cAAc,EAAE,iBAAiB;EACjCC,YAAY,EAAE,iBAAiB;AAC5BC,qBAAgB,CACpB","ignoreList":[]}

package/cjs/components/DateRangePicker/locale/types.d.ts

@@ -0,0 +1,7 @@
+import { DatePickerLocale } from '../../DatePicker/locale';
+export interface DateRangePickerLocale extends DatePickerLocale {
+    startDateLabel: string;
+    endDateLabel: string;
+    startDateEmpty: string;
+    endDateEmpty: string;
+}

package/cjs/components/DateRangePicker/locale/types.js

@@ -0,0 +1 @@
+"use strict";exports.__esModule = true;

package/cjs/components/DateRangePicker/locale/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import { DatePickerLocale } from '../../DatePicker/locale';\n\nexport interface DateRangePickerLocale extends DatePickerLocale {\n  startDateLabel: string;\n  endDateLabel: string;\n  startDateEmpty: string;\n  endDateEmpty: string;\n}\n"],"mappings":"","ignoreList":[]}

package/cjs/components/Dropdown/Dropdown.d.ts

@@ -4,66 +4,63 @@ import { MenuHeader } from '../MenuHeader';
 import { MenuItem } from '../MenuItem';
 import { MenuSeparator } from '../MenuSeparator';
 import { ButtonUse } from '../Button';
-import { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';
+import { CommonProps } from '../../internal/CommonWrapper';
 import { SizeProp } from '../../lib/types/props';
 export interface DropdownProps extends Pick<AriaAttributes, 'aria-label' | 'aria-describedby'>, Pick<HTMLAttributes<HTMLElement>, 'id'>, CommonProps {
-    /**
-     * Подпись на кнопке.
-     */
+    /** Задает подпись на кнопке. */
     caption: React.ReactNode;
-    /**
-     * Иконка слева от текста кнопки
-     */
+    /** Добавляет иконку слева от текста кнопки. */
     icon?: React.ReactElement<any>;
+    /** Задает ширину выпадающего меню. */
     width?: React.CSSProperties['width'];
     /** @ignore */
     _renderButton?: (params: any) => JSX.Element;
-    /**
-     * Отключает использование портала
-     */
+    /** Отключает использование портала. */
     disablePortal?: boolean;
-    /**
-     * Визуально отключает Dropdown
-     */
+    /** Делает компонент недоступным.*/
     disabled?: boolean;
-    /**
-     * Состояние валидации при ошибке.
-     */
+    /** Переводит контрол в состояние валидации "ошибка". */
     error?: boolean;
-    /**
-     * Состояние валидации при предупреждении.
-     */
+    /** Переводит контрол в состояние валидации "предупреждение". */
     warning?: boolean;
+    /** Задает максимальную высоту меню. */
     maxMenuHeight?: number;
-    /**
-     * Позволяет вручную задать текущую позицию выпадающего окна
+    /** Задает текущую позицию выпадающего окна вручную.
      */
     menuPos?: 'top' | 'bottom';
+    /** Задает выравнивание выпадающего меню. */
     menuAlign?: 'left' | 'right';
+    /** Задает длину меню. */
     menuWidth?: number | string;
+    /** Задает размер контрола. */
     size?: SizeProp;
-    /**
-     * Смотри Button.
-     */
+    /** Задаёт стиль кнопки. */
     use?: ButtonUse;
-    /**
-     * Вызывается при закрытии меню.
-     */
+    /** @ignore */
+    corners?: React.CSSProperties;
+    /** Задает функцию, которая вызывается при закрытии меню. */
     onClose?: () => void;
-    /**
-     * Вызывается при открытии меню.
-     */
+    /** Задает функцию, которая вызывается при открытии меню. */
     onOpen?: () => void;
+    /** Задает функцию, которая вызывается при наведении мышкой (событие `onmouseenter`). См разницу с onMouseOver в [документации](https://learn.javascript.ru/mousemove-mouseover-mouseout-mouseenter-mouseleave)  */
     onMouseEnter?: (event: React.MouseEvent<HTMLElement>) => void;
+    /** Задает функцию, которая вызывается при уходе мышки с объекта (событие `onmouseleave`). */
     onMouseLeave?: (event: React.MouseEvent<HTMLElement>) => void;
+    /** Задает функцию, которая вызывается при наведении мышкой (событие `onmouseover`). */
     onMouseOver?: (event: React.MouseEvent<HTMLElement>) => void;
 }
 export declare const DropdownDataTids: {
     readonly root: "Dropdown__root";
 };
 /**
- * Выпадающее меню.
+ * Выпадающее меню `Dropdown`. Содержит несколько команд, объединенных по смыслу.
+ *
+ * Используйте кнопку-меню:
+ * * когда не хватает места для нескольких кнопок.
+ * * когда названия действий очень длинные.
+ * * когда действия редко используются или объединены по смыслу.
  *
+ * Не используйте `Dropdown` для выбора значения из набора вариантов. В таком случае воспользуйтесь компонентом Select.
  */
 export declare class Dropdown extends React.Component<DropdownProps> {
     static __KONTUR_REACT_UI__: string;
@@ -121,7 +118,7 @@ export declare class Dropdown extends React.Component<DropdownProps> {
     private setRootNode;
     private theme;
     render(): React.JSX.Element;
-    renderMain: ({ caption, icon, ...props }: CommonWrapperRestProps<DropdownProps>) => React.JSX.Element;
+    renderMain: () => React.JSX.Element;
     /**
      * @public
      */

package/cjs/components/Dropdown/Dropdown.js

@@ -10,9 +10,9 @@ var _Select = require("../Select");
 
 var _CommonWrapper = require("../../internal/CommonWrapper");
 var _rootNode = require("../../lib/rootNode");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 
-var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _getDropdownTheme = require("./getDropdownTheme");var _excluded = ["caption", "icon"];var _class, _Dropdown;
 
@@ -34,8 +34,10 @@ var PASS_PROPS = {
   onMouseLeave: true,
   onMouseOver: true,
   menuPos: true,
+  corners: true,
   id: true,
-  'aria-describedby': true
+  'aria-describedby': true,
+  'aria-label': true
 };
 
 
@@ -97,6 +99,10 @@ var PASS_PROPS = {
 
 
 
+
+
+
+
 
 
 
@@ -107,8 +113,14 @@ var DropdownDataTids = exports.DropdownDataTids = {
 };
 
 /**
- * Выпадающее меню.
+ * Выпадающее меню `Dropdown`. Содержит несколько команд, объединенных по смыслу.
+ *
+ * Используйте кнопку-меню:
+ * * когда не хватает места для нескольких кнопок.
+ * * когда названия действий очень длинные.
+ * * когда действия редко используются или объединены по смыслу.
  *
+ * Не используйте `Dropdown` для выбора значения из набора вариантов. В таком случае воспользуйтесь компонентом Select.
  */var
 
 Dropdown = exports.Dropdown = (0, _rootNode.rootNode)(_class = (_Dropdown = /*#__PURE__*/function (_React$Component) {function Dropdown() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
@@ -197,21 +209,20 @@ Dropdown = exports.Dropdown = (0, _rootNode.rootNode)(_class = (_Dropdown = /*#_
 
 
 
-    renderMain = function (_ref) {var caption = _ref.caption,icon = _ref.icon,props = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
+    renderMain = function () {
+      var _this$props = _this.props,caption = _this$props.caption,icon = _this$props.icon,rest = (0, _objectWithoutPropertiesLoose2.default)(_this$props, _excluded);
       var items = _react.default.Children.map(_this.props.children, function (item) {return item;}) || [];
 
       return /*#__PURE__*/(
-        _react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this.setRootNode }, _this.props), /*#__PURE__*/
+        _react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this.setRootNode }, rest), /*#__PURE__*/
         _react.default.createElement(_Select.Select, (0, _extends2.default)({
           "data-tid": DropdownDataTids.root,
           ref: _this._refSelect },
-        (0, _filterProps.filterProps)(props, PASS_PROPS), {
+        (0, _filterProps.filterProps)(rest, PASS_PROPS), {
           value: caption,
           items: items,
           _icon: icon,
-          renderValue: renderValue,
-          size: _this.props.size,
-          "aria-label": _this.props['aria-label'] })
+          renderValue: renderValue })
         )
         ));
 
@@ -237,7 +248,7 @@ Dropdown = exports.Dropdown = (0, _rootNode.rootNode)(_class = (_Dropdown = /*#_
 
     _refSelect = function (element) {
       _this._select = element;
-    };return _this;}(0, _inheritsLoose2.default)(Dropdown, _React$Component);var _proto = Dropdown.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = (0, _getDropdownTheme.getDropdownTheme)(theme);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _this2.theme }, _this2.renderMain(_this2.props));});}; /**
+    };return _this;}(0, _inheritsLoose2.default)(Dropdown, _React$Component);var _proto = Dropdown.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = (0, _getDropdownTheme.getDropdownTheme)(theme);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _this2.theme }, _this2.renderMain());});}; /**
    * @public
    */_proto.open = function open() {if (this._select) {this._select.open();}} /**
    * @public