@vkontakte/vkui 5.0.0 → 5.0.1

package/dist/cjs/components/DateInput/DateInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateInput.js","names":["elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","getHours","getMinutes","DateInput","enableTime","shouldDisableDate","disableFuture","disablePast","onChange","calendarPlacement","style","className","doneButtonText","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthAriaLabel","nextMonthAriaLabel","showNeighboringMonth","size","changeMonthAriaLabel","changeYearAriaLabel","changeDayAriaLabel","changeHoursAriaLabel","changeMinutesAriaLabel","clearFieldAriaLabel","showCalendarAriaLabel","viewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","disableCalendar","props","daysRef","React","useRef","monthsRef","yearsRef","hoursRef","minutesRef","maxElement","onInternalValueChange","useCallback","internalValue","i","formattedValue","mask","isMatch","parse","Date","refs","useMemo","useDateInput","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","useAdaptivity","sizeY","onCalendarChange","classNames","getSizeYClassName","multiRef","callMultiple","format"],"sources":["../../../../src/components/DateInput/DateInput.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { format, isMatch, parse } from \"../../lib/date\";\nimport { Icon16Clear, Icon20CalendarOutline } from \"@vkontakte/icons\";\nimport { Calendar, CalendarProps } from \"../Calendar/Calendar\";\nimport { Popper, Placement } from \"../Popper/Popper\";\nimport { multiRef } from \"../../lib/utils\";\nimport { IconButton } from \"../IconButton/IconButton\";\nimport { classNames } from \"../../lib/classNames\";\nimport { FormField, FormFieldProps } from \"../FormField/FormField\";\nimport { HasRootRef } from \"../../types\";\nimport { useDateInput } from \"../../hooks/useDateInput\";\nimport { InputLike } from \"../InputLike/InputLike\";\nimport { InputLikeDivider } from \"../InputLike/InputLikeDivider\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport { getSizeYClassName } from \"../../helpers/getSizeYClassName\";\nimport \"./DateInput.css\";\n\nexport interface DateInputProps\n  extends Omit<\n      React.InputHTMLAttributes<HTMLDivElement>,\n      \"value\" | \"onChange\" | \"size\"\n    >,\n    Pick<\n      CalendarProps,\n      | \"disablePast\"\n      | \"disableFuture\"\n      | \"enableTime\"\n      | \"shouldDisableDate\"\n      | \"onChange\"\n      | \"value\"\n      | \"doneButtonText\"\n      | \"weekStartsOn\"\n      | \"disablePickers\"\n      | \"changeHoursAriaLabel\"\n      | \"changeMinutesAriaLabel\"\n      | \"prevMonthAriaLabel\"\n      | \"nextMonthAriaLabel\"\n      | \"changeMonthAriaLabel\"\n      | \"changeYearAriaLabel\"\n      | \"changeDayAriaLabel\"\n      | \"showNeighboringMonth\"\n      | \"size\"\n      | \"viewDate\"\n      | \"onHeaderChange\"\n      | \"onNextMonth\"\n      | \"onPrevMonth\"\n      | \"prevMonthIcon\"\n      | \"nextMonthIcon\"\n    >,\n    HasRootRef<HTMLDivElement>,\n    FormFieldProps {\n  calendarPlacement?: Placement;\n  closeOnChange?: boolean;\n  clearFieldAriaLabel?: string;\n  showCalendarAriaLabel?: string;\n  disableCalendar?: boolean;\n}\n\nconst elementsConfig = (index: number) => {\n  let length = 2;\n  let min = 1;\n  let max = 0;\n\n  switch (index) {\n    case 0:\n      max = 31;\n      break;\n    case 1:\n      max = 12;\n      break;\n    case 2:\n      max = 2100;\n      min = 1900;\n      length = 4;\n      break;\n    case 3:\n      max = 23;\n      break;\n    case 4:\n      max = 59;\n      break;\n  }\n\n  return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarProps[\"value\"]) => {\n  const newValue = [\"\", \"\", \"\", \"\", \"\"];\n  if (value) {\n    newValue[0] = String(value.getDate()).padStart(2, \"0\");\n    newValue[1] = String(value.getMonth() + 1).padStart(2, \"0\");\n    newValue[2] = String(value.getFullYear()).padStart(4, \"0\");\n    newValue[3] = String(value.getHours()).padStart(2, \"0\");\n    newValue[4] = String(value.getMinutes()).padStart(2, \"0\");\n  }\n  return newValue;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/DateInput\n */\nexport const DateInput = ({\n  enableTime,\n  shouldDisableDate,\n  disableFuture,\n  disablePast,\n  value,\n  onChange,\n  calendarPlacement = \"bottom-start\",\n  style,\n  className,\n  doneButtonText,\n  closeOnChange = true,\n  disablePickers,\n  getRootRef,\n  name,\n  autoFocus,\n  disabled,\n  onClick,\n  onFocus,\n  prevMonthAriaLabel,\n  nextMonthAriaLabel,\n  showNeighboringMonth,\n  size,\n  changeMonthAriaLabel = \"Изменить месяц\",\n  changeYearAriaLabel = \"Изменить год\",\n  changeDayAriaLabel = \"Изменить день\",\n  changeHoursAriaLabel = \"Изменить час\",\n  changeMinutesAriaLabel = \"Изменить минуту\",\n  clearFieldAriaLabel = \"Очистить поле\",\n  showCalendarAriaLabel = \"Показать календарь\",\n  viewDate,\n  onHeaderChange,\n  onNextMonth,\n  onPrevMonth,\n  prevMonthIcon,\n  nextMonthIcon,\n  disableCalendar = false,\n  ...props\n}: DateInputProps) => {\n  const daysRef = React.useRef<HTMLSpanElement>(null);\n  const monthsRef = React.useRef<HTMLSpanElement>(null);\n  const yearsRef = React.useRef<HTMLSpanElement>(null);\n  const hoursRef = React.useRef<HTMLSpanElement>(null);\n  const minutesRef = React.useRef<HTMLSpanElement>(null);\n\n  const maxElement = enableTime ? 4 : 2;\n\n  const onInternalValueChange = React.useCallback(\n    (internalValue: string[]) => {\n      for (let i = 0; i <= maxElement; i += 1) {\n        if (internalValue[i].length < elementsConfig(i).length) {\n          return;\n        }\n      }\n\n      let formattedValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n      let mask = \"DD.MM.YYYY\";\n      if (enableTime) {\n        formattedValue += ` ${internalValue[3]}:${internalValue[4]}`;\n        mask += \" HH:mm\";\n      }\n\n      if (isMatch(formattedValue, mask)) {\n        onChange?.(parse(formattedValue, mask, value ?? new Date()));\n      }\n    },\n    [enableTime, maxElement, onChange, value]\n  );\n\n  const refs = React.useMemo(\n    () => [daysRef, monthsRef, yearsRef, hoursRef, minutesRef],\n    [daysRef, monthsRef, yearsRef, hoursRef, minutesRef]\n  );\n\n  const {\n    rootRef,\n    calendarRef,\n    open,\n    openCalendar,\n    closeCalendar,\n    internalValue,\n    handleKeyDown,\n    setFocusedElement,\n    handleFieldEnter,\n    clear,\n    removeFocusFromField,\n  } = useDateInput({\n    maxElement,\n    refs,\n    autoFocus,\n    disabled,\n    elementsConfig,\n    onChange,\n    onInternalValueChange,\n    getInternalValue,\n    value,\n  });\n\n  const { sizeY } = useAdaptivity();\n\n  const onCalendarChange = React.useCallback(\n    (value?: Date | undefined) => {\n      onChange?.(value);\n      if (closeOnChange && !enableTime) {\n        removeFocusFromField();\n      }\n    },\n    [onChange, removeFocusFromField, closeOnChange, enableTime]\n  );\n\n  return (\n    <FormField\n      vkuiClass={classNames(\"DateInput\", getSizeYClassName(\"DateInput\", sizeY))}\n      style={style}\n      className={className}\n      getRootRef={multiRef(rootRef, getRootRef)}\n      after={\n        value ? (\n          <IconButton\n            hoverMode=\"opacity\"\n            aria-label={clearFieldAriaLabel}\n            onClick={clear}\n          >\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton\n            hoverMode=\"opacity\"\n            aria-label={showCalendarAriaLabel}\n            onClick={openCalendar}\n          >\n            <Icon20CalendarOutline />\n          </IconButton>\n        )\n      }\n      disabled={disabled}\n      onClick={callMultiple(handleFieldEnter, onClick)}\n      onFocus={callMultiple(handleFieldEnter, onFocus)}\n      {...props}\n    >\n      <input\n        type=\"hidden\"\n        name={name}\n        value={\n          value\n            ? format(value, enableTime ? \"DD.MM.YYYYTHH:mm\" : \"DD.MM.YYYY\")\n            : \"\"\n        }\n      />\n      <span vkuiClass=\"DateInput__input\" onKeyDown={handleKeyDown}>\n        <InputLike\n          tabIndex={1}\n          length={2}\n          getRootRef={daysRef}\n          index={0}\n          onElementSelect={setFocusedElement}\n          value={internalValue[0]}\n          aria-label={changeDayAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsRef}\n          index={1}\n          onElementSelect={setFocusedElement}\n          value={internalValue[1]}\n          aria-label={changeMonthAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsRef}\n          index={2}\n          onElementSelect={setFocusedElement}\n          value={internalValue[2]}\n          aria-label={changeYearAriaLabel}\n        />\n        {enableTime && (\n          <React.Fragment>\n            <InputLikeDivider vkuiClass=\"DateInput__input-time-divider\">\n              {\" \"}\n            </InputLikeDivider>\n            <InputLike\n              length={2}\n              getRootRef={hoursRef}\n              index={3}\n              onElementSelect={setFocusedElement}\n              value={internalValue[3]}\n              aria-label={changeHoursAriaLabel}\n            />\n            <InputLikeDivider>:</InputLikeDivider>\n            <InputLike\n              length={2}\n              getRootRef={minutesRef}\n              index={4}\n              onElementSelect={setFocusedElement}\n              value={internalValue[4]}\n              aria-label={changeMinutesAriaLabel}\n            />\n          </React.Fragment>\n        )}\n      </span>\n      {open && !disableCalendar && (\n        <Popper\n          targetRef={rootRef}\n          offsetDistance={8}\n          placement={calendarPlacement}\n        >\n          <Calendar\n            value={value}\n            onChange={onCalendarChange}\n            enableTime={enableTime}\n            disablePast={disablePast}\n            disableFuture={disableFuture}\n            shouldDisableDate={shouldDisableDate}\n            onClose={closeCalendar}\n            getRootRef={calendarRef}\n            doneButtonText={doneButtonText}\n            disablePickers={disablePickers}\n            changeHoursAriaLabel={changeHoursAriaLabel}\n            changeMinutesAriaLabel={changeMinutesAriaLabel}\n            prevMonthAriaLabel={prevMonthAriaLabel}\n            nextMonthAriaLabel={nextMonthAriaLabel}\n            changeMonthAriaLabel={changeMonthAriaLabel}\n            changeYearAriaLabel={changeYearAriaLabel}\n            changeDayAriaLabel={changeDayAriaLabel}\n            showNeighboringMonth={showNeighboringMonth}\n            size={size}\n            viewDate={viewDate}\n            onHeaderChange={onHeaderChange}\n            onNextMonth={onNextMonth}\n            onPrevMonth={onPrevMonth}\n            prevMonthIcon={prevMonthIcon}\n            nextMonthIcon={nextMonthIcon}\n          />\n        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"DateInput.js","names":["elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","getHours","getMinutes","DateInput","enableTime","shouldDisableDate","disableFuture","disablePast","onChange","calendarPlacement","style","className","doneButtonText","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthAriaLabel","nextMonthAriaLabel","showNeighboringMonth","size","changeMonthAriaLabel","changeYearAriaLabel","changeDayAriaLabel","changeHoursAriaLabel","changeMinutesAriaLabel","clearFieldAriaLabel","showCalendarAriaLabel","viewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","disableCalendar","props","daysRef","React","useRef","monthsRef","yearsRef","hoursRef","minutesRef","maxElement","onInternalValueChange","useCallback","internalValue","i","formattedValue","mask","isMatch","parse","Date","refs","useMemo","useDateInput","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","useAdaptivity","sizeY","onCalendarChange","classNamesString","getSizeYClassName","multiRef","callMultiple","format"],"sources":["../../../../src/components/DateInput/DateInput.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { format, isMatch, parse } from \"../../lib/date\";\nimport { Icon16Clear, Icon20CalendarOutline } from \"@vkontakte/icons\";\nimport { Calendar, CalendarProps } from \"../Calendar/Calendar\";\nimport { Popper, Placement } from \"../Popper/Popper\";\nimport { multiRef } from \"../../lib/utils\";\nimport { IconButton } from \"../IconButton/IconButton\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { FormField, FormFieldProps } from \"../FormField/FormField\";\nimport { HasRootRef } from \"../../types\";\nimport { useDateInput } from \"../../hooks/useDateInput\";\nimport { InputLike } from \"../InputLike/InputLike\";\nimport { InputLikeDivider } from \"../InputLike/InputLikeDivider\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport { getSizeYClassName } from \"../../helpers/getSizeYClassName\";\nimport styles from \"./DateInput.module.css\";\n\nexport interface DateInputProps\n  extends Omit<\n      React.InputHTMLAttributes<HTMLDivElement>,\n      \"value\" | \"onChange\" | \"size\"\n    >,\n    Pick<\n      CalendarProps,\n      | \"disablePast\"\n      | \"disableFuture\"\n      | \"enableTime\"\n      | \"shouldDisableDate\"\n      | \"onChange\"\n      | \"value\"\n      | \"doneButtonText\"\n      | \"weekStartsOn\"\n      | \"disablePickers\"\n      | \"changeHoursAriaLabel\"\n      | \"changeMinutesAriaLabel\"\n      | \"prevMonthAriaLabel\"\n      | \"nextMonthAriaLabel\"\n      | \"changeMonthAriaLabel\"\n      | \"changeYearAriaLabel\"\n      | \"changeDayAriaLabel\"\n      | \"showNeighboringMonth\"\n      | \"size\"\n      | \"viewDate\"\n      | \"onHeaderChange\"\n      | \"onNextMonth\"\n      | \"onPrevMonth\"\n      | \"prevMonthIcon\"\n      | \"nextMonthIcon\"\n    >,\n    HasRootRef<HTMLDivElement>,\n    FormFieldProps {\n  calendarPlacement?: Placement;\n  closeOnChange?: boolean;\n  clearFieldAriaLabel?: string;\n  showCalendarAriaLabel?: string;\n  disableCalendar?: boolean;\n}\n\nconst elementsConfig = (index: number) => {\n  let length = 2;\n  let min = 1;\n  let max = 0;\n\n  switch (index) {\n    case 0:\n      max = 31;\n      break;\n    case 1:\n      max = 12;\n      break;\n    case 2:\n      max = 2100;\n      min = 1900;\n      length = 4;\n      break;\n    case 3:\n      max = 23;\n      break;\n    case 4:\n      max = 59;\n      break;\n  }\n\n  return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarProps[\"value\"]) => {\n  const newValue = [\"\", \"\", \"\", \"\", \"\"];\n  if (value) {\n    newValue[0] = String(value.getDate()).padStart(2, \"0\");\n    newValue[1] = String(value.getMonth() + 1).padStart(2, \"0\");\n    newValue[2] = String(value.getFullYear()).padStart(4, \"0\");\n    newValue[3] = String(value.getHours()).padStart(2, \"0\");\n    newValue[4] = String(value.getMinutes()).padStart(2, \"0\");\n  }\n  return newValue;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/DateInput\n */\nexport const DateInput = ({\n  enableTime,\n  shouldDisableDate,\n  disableFuture,\n  disablePast,\n  value,\n  onChange,\n  calendarPlacement = \"bottom-start\",\n  style,\n  className,\n  doneButtonText,\n  closeOnChange = true,\n  disablePickers,\n  getRootRef,\n  name,\n  autoFocus,\n  disabled,\n  onClick,\n  onFocus,\n  prevMonthAriaLabel,\n  nextMonthAriaLabel,\n  showNeighboringMonth,\n  size,\n  changeMonthAriaLabel = \"Изменить месяц\",\n  changeYearAriaLabel = \"Изменить год\",\n  changeDayAriaLabel = \"Изменить день\",\n  changeHoursAriaLabel = \"Изменить час\",\n  changeMinutesAriaLabel = \"Изменить минуту\",\n  clearFieldAriaLabel = \"Очистить поле\",\n  showCalendarAriaLabel = \"Показать календарь\",\n  viewDate,\n  onHeaderChange,\n  onNextMonth,\n  onPrevMonth,\n  prevMonthIcon,\n  nextMonthIcon,\n  disableCalendar = false,\n  ...props\n}: DateInputProps) => {\n  const daysRef = React.useRef<HTMLSpanElement>(null);\n  const monthsRef = React.useRef<HTMLSpanElement>(null);\n  const yearsRef = React.useRef<HTMLSpanElement>(null);\n  const hoursRef = React.useRef<HTMLSpanElement>(null);\n  const minutesRef = React.useRef<HTMLSpanElement>(null);\n\n  const maxElement = enableTime ? 4 : 2;\n\n  const onInternalValueChange = React.useCallback(\n    (internalValue: string[]) => {\n      for (let i = 0; i <= maxElement; i += 1) {\n        if (internalValue[i].length < elementsConfig(i).length) {\n          return;\n        }\n      }\n\n      let formattedValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n      let mask = \"DD.MM.YYYY\";\n      if (enableTime) {\n        formattedValue += ` ${internalValue[3]}:${internalValue[4]}`;\n        mask += \" HH:mm\";\n      }\n\n      if (isMatch(formattedValue, mask)) {\n        onChange?.(parse(formattedValue, mask, value ?? new Date()));\n      }\n    },\n    [enableTime, maxElement, onChange, value]\n  );\n\n  const refs = React.useMemo(\n    () => [daysRef, monthsRef, yearsRef, hoursRef, minutesRef],\n    [daysRef, monthsRef, yearsRef, hoursRef, minutesRef]\n  );\n\n  const {\n    rootRef,\n    calendarRef,\n    open,\n    openCalendar,\n    closeCalendar,\n    internalValue,\n    handleKeyDown,\n    setFocusedElement,\n    handleFieldEnter,\n    clear,\n    removeFocusFromField,\n  } = useDateInput({\n    maxElement,\n    refs,\n    autoFocus,\n    disabled,\n    elementsConfig,\n    onChange,\n    onInternalValueChange,\n    getInternalValue,\n    value,\n  });\n\n  const { sizeY } = useAdaptivity();\n\n  const onCalendarChange = React.useCallback(\n    (value?: Date | undefined) => {\n      onChange?.(value);\n      if (closeOnChange && !enableTime) {\n        removeFocusFromField();\n      }\n    },\n    [onChange, removeFocusFromField, closeOnChange, enableTime]\n  );\n\n  return (\n    <FormField\n      style={style}\n      className={classNamesString(\n        styles[\"DateInput\"],\n        getSizeYClassName(styles[\"DateInput\"], sizeY),\n        className\n      )}\n      getRootRef={multiRef(rootRef, getRootRef)}\n      after={\n        value ? (\n          <IconButton\n            hoverMode=\"opacity\"\n            aria-label={clearFieldAriaLabel}\n            onClick={clear}\n          >\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton\n            hoverMode=\"opacity\"\n            aria-label={showCalendarAriaLabel}\n            onClick={openCalendar}\n          >\n            <Icon20CalendarOutline />\n          </IconButton>\n        )\n      }\n      disabled={disabled}\n      onClick={callMultiple(handleFieldEnter, onClick)}\n      onFocus={callMultiple(handleFieldEnter, onFocus)}\n      {...props}\n    >\n      <input\n        type=\"hidden\"\n        name={name}\n        value={\n          value\n            ? format(value, enableTime ? \"DD.MM.YYYYTHH:mm\" : \"DD.MM.YYYY\")\n            : \"\"\n        }\n      />\n      <span className={styles[\"DateInput__input\"]} onKeyDown={handleKeyDown}>\n        <InputLike\n          tabIndex={1}\n          length={2}\n          getRootRef={daysRef}\n          index={0}\n          onElementSelect={setFocusedElement}\n          value={internalValue[0]}\n          aria-label={changeDayAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsRef}\n          index={1}\n          onElementSelect={setFocusedElement}\n          value={internalValue[1]}\n          aria-label={changeMonthAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsRef}\n          index={2}\n          onElementSelect={setFocusedElement}\n          value={internalValue[2]}\n          aria-label={changeYearAriaLabel}\n        />\n        {enableTime && (\n          <React.Fragment>\n            <InputLikeDivider\n              className={styles[\"DateInput__input--time-divider\"]}\n            >\n              {\" \"}\n            </InputLikeDivider>\n            <InputLike\n              length={2}\n              getRootRef={hoursRef}\n              index={3}\n              onElementSelect={setFocusedElement}\n              value={internalValue[3]}\n              aria-label={changeHoursAriaLabel}\n            />\n            <InputLikeDivider>:</InputLikeDivider>\n            <InputLike\n              length={2}\n              getRootRef={minutesRef}\n              index={4}\n              onElementSelect={setFocusedElement}\n              value={internalValue[4]}\n              aria-label={changeMinutesAriaLabel}\n            />\n          </React.Fragment>\n        )}\n      </span>\n      {open && !disableCalendar && (\n        <Popper\n          targetRef={rootRef}\n          offsetDistance={8}\n          placement={calendarPlacement}\n        >\n          <Calendar\n            value={value}\n            onChange={onCalendarChange}\n            enableTime={enableTime}\n            disablePast={disablePast}\n            disableFuture={disableFuture}\n            shouldDisableDate={shouldDisableDate}\n            onClose={closeCalendar}\n            getRootRef={calendarRef}\n            doneButtonText={doneButtonText}\n            disablePickers={disablePickers}\n            changeHoursAriaLabel={changeHoursAriaLabel}\n            changeMinutesAriaLabel={changeMinutesAriaLabel}\n            prevMonthAriaLabel={prevMonthAriaLabel}\n            nextMonthAriaLabel={nextMonthAriaLabel}\n            changeMonthAriaLabel={changeMonthAriaLabel}\n            changeYearAriaLabel={changeYearAriaLabel}\n            changeDayAriaLabel={changeDayAriaLabel}\n            showNeighboringMonth={showNeighboringMonth}\n            size={size}\n            viewDate={viewDate}\n            onHeaderChange={onHeaderChange}\n            onNextMonth={onNextMonth}\n            onPrevMonth={onPrevMonth}\n            prevMonthIcon={prevMonthIcon}\n            nextMonthIcon={nextMonthIcon}\n          />\n        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"mappings":"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"}

package/dist/cjs/components/DatePicker/DatePicker.d.ts

@@ -0,0 +1,23 @@
+import * as React from "react";
+export declare type DatePickerDateFormat = {
+    day: number;
+    month: number;
+    year: number;
+};
+export interface DatePickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "defaultValue" | "min" | "max"> {
+    min?: DatePickerDateFormat;
+    max?: DatePickerDateFormat;
+    name?: string;
+    defaultValue?: DatePickerDateFormat;
+    popupDirection?: "top" | "bottom";
+    monthNames?: string[];
+    dayPlaceholder?: string;
+    monthPlaceholder?: string;
+    yearPlaceholder?: string;
+    onDateChange?: (value: DatePickerDateFormat) => void;
+    disabled?: boolean;
+}
+/**
+ * @see https://vkcom.github.io/VKUI/#/DatePicker
+ */
+export declare const DatePicker: ({ defaultValue, ...props }: DatePickerProps) => JSX.Element;

package/dist/cjs/components/DatePicker/DatePicker.js

@@ -1,53 +1,39 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DatePicker = void 0;
-
-var _jsxRuntime = require("../../lib/jsxRuntime");
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var React = _interopRequireWildcard(require("react"));
-
+var _classNames = require("../../lib/classNames");
 var _Input = require("../Input/Input");
-
-var _useAdaptivity2 = require("../../hooks/useAdaptivity");
-
+var _useAdaptivityHasPointer = require("../../hooks/useAdaptivityHasPointer");
 var _utils = require("../../lib/utils");
-
 var _CustomSelect = require("../CustomSelect/CustomSelect");
-
-var _excluded = ["name", "min", "max", "dayPlaceholder", "monthPlaceholder", "yearPlaceholder", "popupDirection", "defaultValue", "monthNames", "day", "month", "year", "onDateChange", "disabled"],
-    _excluded2 = ["min", "max", "dayPlaceholder", "monthPlaceholder", "yearPlaceholder", "popupDirection", "defaultValue", "day", "month", "year", "onDateChange"],
-    _excluded3 = ["defaultValue"];
+var _range = require("../../helpers/range");
+var _excluded = ["name", "min", "max", "dayPlaceholder", "monthPlaceholder", "yearPlaceholder", "popupDirection", "defaultValue", "monthNames", "day", "month", "year", "onDateChange", "disabled", "className"],
+  _excluded2 = ["min", "max", "dayPlaceholder", "monthPlaceholder", "yearPlaceholder", "popupDirection", "defaultValue", "day", "month", "year", "onDateChange"],
+  _excluded3 = ["defaultValue"];
 var DefaultMonths = ["Января", "Февраля", "Марта", "Апреля", "Мая", "Июня", "Июля", "Августа", "Сентября", "Октября", "Ноября", "Декабря"];
-
 // Переводим state к формату гг-мм-дд
 function convertToInputFormat(_ref) {
   var _ref$day = _ref.day,
-      day = _ref$day === void 0 ? 0 : _ref$day,
-      _ref$month = _ref.month,
-      month = _ref$month === void 0 ? 0 : _ref$month,
-      _ref$year = _ref.year,
-      year = _ref$year === void 0 ? 0 : _ref$year;
+    day = _ref$day === void 0 ? 0 : _ref$day,
+    _ref$month = _ref.month,
+    month = _ref$month === void 0 ? 0 : _ref$month,
+    _ref$year = _ref.year,
+    year = _ref$year === void 0 ? 0 : _ref$year;
   return "".concat(year, "-").concat((0, _utils.leadingZero)(month), "-").concat((0, _utils.leadingZero)(day));
-} // Переводим дату формата гг-мм-дд к объекту
-
+}
 
+// Переводим дату формата гг-мм-дд к объекту
 function parseInputDate(date) {
   var splited = date.split("-");
   return {
@@ -56,52 +42,39 @@ function parseInputDate(date) {
     year: Number(splited[0])
   };
 }
-
 function getMonthMaxDay(month, year) {
   return month ? new Date(year || 2016, month, 0).getDate() : 31;
 }
-
-var range = function range(start, end) {
-  var swap = start > end;
-  var arr = [];
-
-  for (var i = Math.min(start, end); i <= Math.max(start, end); i++) {
-    arr.push(i);
-  }
-
-  return swap ? arr.reverse() : arr;
-};
-
 var DatePickerCustom = function DatePickerCustom(_ref2) {
   var name = _ref2.name,
-      _ref2$min = _ref2.min,
-      min = _ref2$min === void 0 ? {
-    day: 0,
-    month: 0,
-    year: 0
-  } : _ref2$min,
-      _ref2$max = _ref2.max,
-      max = _ref2$max === void 0 ? {
-    day: 31,
-    month: 12,
-    year: 2100
-  } : _ref2$max,
-      dayPlaceholder = _ref2.dayPlaceholder,
-      monthPlaceholder = _ref2.monthPlaceholder,
-      yearPlaceholder = _ref2.yearPlaceholder,
-      popupDirection = _ref2.popupDirection,
-      defaultValue = _ref2.defaultValue,
-      monthNames = _ref2.monthNames,
-      _ref2$day = _ref2.day,
-      day = _ref2$day === void 0 ? 0 : _ref2$day,
-      _ref2$month = _ref2.month,
-      month = _ref2$month === void 0 ? 0 : _ref2$month,
-      _ref2$year = _ref2.year,
-      year = _ref2$year === void 0 ? 0 : _ref2$year,
-      onDateChange = _ref2.onDateChange,
-      disabled = _ref2.disabled,
-      restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
-
+    _ref2$min = _ref2.min,
+    min = _ref2$min === void 0 ? {
+      day: 0,
+      month: 0,
+      year: 0
+    } : _ref2$min,
+    _ref2$max = _ref2.max,
+    max = _ref2$max === void 0 ? {
+      day: 31,
+      month: 12,
+      year: 2100
+    } : _ref2$max,
+    dayPlaceholder = _ref2.dayPlaceholder,
+    monthPlaceholder = _ref2.monthPlaceholder,
+    yearPlaceholder = _ref2.yearPlaceholder,
+    popupDirection = _ref2.popupDirection,
+    defaultValue = _ref2.defaultValue,
+    monthNames = _ref2.monthNames,
+    _ref2$day = _ref2.day,
+    day = _ref2$day === void 0 ? 0 : _ref2$day,
+    _ref2$month = _ref2.month,
+    month = _ref2$month === void 0 ? 0 : _ref2$month,
+    _ref2$year = _ref2.year,
+    year = _ref2$year === void 0 ? 0 : _ref2$year,
+    onDateChange = _ref2.onDateChange,
+    disabled = _ref2.disabled,
+    className = _ref2.className,
+    restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
   var onSelectChange = function onSelectChange(e) {
     onDateChange === null || onDateChange === void 0 ? void 0 : onDateChange((0, _defineProperty2.default)({
       day: day,
@@ -109,8 +82,7 @@ var DatePickerCustom = function DatePickerCustom(_ref2) {
       year: year
     }, e.target.name, Number(e.target.value)));
   };
-
-  var dayOptions = range(1, getMonthMaxDay(month, year)).map(function (value) {
+  var dayOptions = (0, _range.range)(1, getMonthMaxDay(month, year)).map(function (value) {
     return {
       label: String(value),
       value: value
@@ -122,19 +94,19 @@ var DatePickerCustom = function DatePickerCustom(_ref2) {
       value: index + 1
     };
   });
-  var yearOptions = range(max.year, min.year).map(function (value) {
+  var yearOptions = (0, _range.range)(max.year, min.year).map(function (value) {
     return {
       label: String(value),
       value: value
     };
   });
-  return (0, _jsxRuntime.createScopedElement)("div", (0, _extends2.default)({
-    vkuiClass: "DatePicker"
-  }, restProps), (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "DatePicker__container"
-  }, (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "DatePicker__day"
-  }, (0, _jsxRuntime.createScopedElement)(_CustomSelect.CustomSelect, {
+  return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
+    className: (0, _classNames.classNamesString)("vkuiDatePicker", className)
+  }, restProps), /*#__PURE__*/React.createElement("div", {
+    className: "vkuiDatePicker__container"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "vkuiDatePicker__day"
+  }, /*#__PURE__*/React.createElement(_CustomSelect.CustomSelect, {
     name: "day",
     value: day,
     options: dayOptions,
@@ -142,10 +114,10 @@ var DatePickerCustom = function DatePickerCustom(_ref2) {
     popupDirection: popupDirection,
     onChange: onSelectChange,
     disabled: disabled
-  })), (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "DatePicker__month"
-  }, (0, _jsxRuntime.createScopedElement)(_CustomSelect.CustomSelect, {
-    vkuiClass: "DatePicker__monthSelect",
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "vkuiDatePicker__month"
+  }, /*#__PURE__*/React.createElement(_CustomSelect.CustomSelect, {
+    className: "vkuiDatePicker__monthSelect",
     name: "month",
     value: month,
     options: monthOptions,
@@ -153,9 +125,9 @@ var DatePickerCustom = function DatePickerCustom(_ref2) {
     popupDirection: popupDirection,
     onChange: onSelectChange,
     disabled: disabled
-  })), (0, _jsxRuntime.createScopedElement)("div", {
-    vkuiClass: "DatePicker__year"
-  }, (0, _jsxRuntime.createScopedElement)(_CustomSelect.CustomSelect, {
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "vkuiDatePicker__year"
+  }, /*#__PURE__*/React.createElement(_CustomSelect.CustomSelect, {
     name: "year",
     value: year,
     options: yearOptions,
@@ -163,7 +135,7 @@ var DatePickerCustom = function DatePickerCustom(_ref2) {
     popupDirection: popupDirection,
     onChange: onSelectChange,
     disabled: disabled
-  }))), (0, _jsxRuntime.createScopedElement)("input", {
+  }))), /*#__PURE__*/React.createElement("input", {
     type: "hidden",
     name: name,
     value: convertToInputFormat({
@@ -173,30 +145,29 @@ var DatePickerCustom = function DatePickerCustom(_ref2) {
     })
   }));
 };
-
 var DatePickerNative = function DatePickerNative(_ref3) {
   var _ref3$min = _ref3.min,
-      min = _ref3$min === void 0 ? {
-    day: 0,
-    month: 0,
-    year: 0
-  } : _ref3$min,
-      _ref3$max = _ref3.max,
-      max = _ref3$max === void 0 ? {
-    day: 31,
-    month: 12,
-    year: 2100
-  } : _ref3$max,
-      dayPlaceholder = _ref3.dayPlaceholder,
-      monthPlaceholder = _ref3.monthPlaceholder,
-      yearPlaceholder = _ref3.yearPlaceholder,
-      popupDirection = _ref3.popupDirection,
-      defaultValue = _ref3.defaultValue,
-      day = _ref3.day,
-      month = _ref3.month,
-      year = _ref3.year,
-      onDateChange = _ref3.onDateChange,
-      restProps = (0, _objectWithoutProperties2.default)(_ref3, _excluded2);
+    min = _ref3$min === void 0 ? {
+      day: 0,
+      month: 0,
+      year: 0
+    } : _ref3$min,
+    _ref3$max = _ref3.max,
+    max = _ref3$max === void 0 ? {
+      day: 31,
+      month: 12,
+      year: 2100
+    } : _ref3$max,
+    dayPlaceholder = _ref3.dayPlaceholder,
+    monthPlaceholder = _ref3.monthPlaceholder,
+    yearPlaceholder = _ref3.yearPlaceholder,
+    popupDirection = _ref3.popupDirection,
+    defaultValue = _ref3.defaultValue,
+    day = _ref3.day,
+    month = _ref3.month,
+    year = _ref3.year,
+    onDateChange = _ref3.onDateChange,
+    restProps = (0, _objectWithoutProperties2.default)(_ref3, _excluded2);
   var defProps = day && month && year ? {
     defaultValue: convertToInputFormat({
       day: day,
@@ -207,45 +178,39 @@ var DatePickerNative = function DatePickerNative(_ref3) {
   var onStringChange = React.useCallback(function (e) {
     onDateChange === null || onDateChange === void 0 ? void 0 : onDateChange(parseInputDate(e.currentTarget.value));
   }, [onDateChange]);
-  return (0, _jsxRuntime.createScopedElement)(_Input.Input, (0, _extends2.default)({}, restProps, {
+  return /*#__PURE__*/React.createElement(_Input.Input, (0, _extends2.default)({}, restProps, {
     type: "date",
     onChange: onStringChange,
     min: convertToInputFormat(min),
     max: convertToInputFormat(max)
   }, defProps));
 };
+
 /**
  * @see https://vkcom.github.io/VKUI/#/DatePicker
  */
-
-
 var DatePicker = function DatePicker(_ref4) {
   var defaultValue = _ref4.defaultValue,
-      props = (0, _objectWithoutProperties2.default)(_ref4, _excluded3);
-
-  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-      hasMouse = _useAdaptivity.hasMouse;
-
+    props = (0, _objectWithoutProperties2.default)(_ref4, _excluded3);
+  var hasPointer = (0, _useAdaptivityHasPointer.useAdaptivityHasPointer)();
   var _React$useState = React.useState(function () {
-    return {
-      day: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.day) || 0,
-      month: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.month) || 0,
-      year: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.year) || 0
-    };
-  }),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      value = _React$useState2[0],
-      setValue = _React$useState2[1];
-
+      return {
+        day: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.day) || 0,
+        month: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.month) || 0,
+        year: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.year) || 0
+      };
+    }),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    value = _React$useState2[0],
+    setValue = _React$useState2[1];
   var onDateChange = React.useCallback(function (update) {
     setValue(update);
     props.onDateChange && props.onDateChange((0, _objectSpread2.default)({}, update));
   }, [props]);
-  var Cmp = hasMouse ? DatePickerCustom : DatePickerNative;
-  return (0, _jsxRuntime.createScopedElement)(Cmp, (0, _extends2.default)({}, props, value, {
+  var Cmp = hasPointer ? DatePickerCustom : DatePickerNative;
+  return /*#__PURE__*/React.createElement(Cmp, (0, _extends2.default)({}, props, value, {
     onDateChange: onDateChange
   }));
 };
-
 exports.DatePicker = DatePicker;
 //# sourceMappingURL=DatePicker.js.map

package/dist/cjs/components/DatePicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","names":["DefaultMonths","convertToInputFormat","day","month","year","leadingZero","parseInputDate","date","splited","split","Number","getMonthMaxDay","Date","getDate","range","start","end","swap","arr","i","Math","min","max","push","reverse","DatePickerCustom","name","dayPlaceholder","monthPlaceholder","yearPlaceholder","popupDirection","defaultValue","monthNames","onDateChange","disabled","restProps","onSelectChange","e","target","value","dayOptions","map","label","String","monthOptions","index","yearOptions","DatePickerNative","defProps","onStringChange","React","useCallback","currentTarget","DatePicker","props","useAdaptivity","hasMouse","useState","setValue","update","Cmp"],"sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Input } from \"../Input/Input\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { HasPlatform } from \"../../types\";\nimport { leadingZero } from \"../../lib/utils\";\nimport { CustomSelect } from \"../CustomSelect/CustomSelect\";\nimport \"./DatePicker.css\";\n\nconst DefaultMonths: string[] = [\n  \"Января\",\n  \"Февраля\",\n  \"Марта\",\n  \"Апреля\",\n  \"Мая\",\n  \"Июня\",\n  \"Июля\",\n  \"Августа\",\n  \"Сентября\",\n  \"Октября\",\n  \"Ноября\",\n  \"Декабря\",\n];\n\nexport type DatePickerDateFormat = {\n  day: number;\n  month: number;\n  year: number;\n};\n\nexport interface DatePickerProps\n  extends Omit<\n      React.HTMLAttributes<HTMLDivElement>,\n      \"defaultValue\" | \"min\" | \"max\"\n    >,\n    HasPlatform {\n  min?: DatePickerDateFormat;\n  max?: DatePickerDateFormat;\n  name?: string;\n  defaultValue?: DatePickerDateFormat;\n  popupDirection?: \"top\" | \"bottom\";\n  monthNames?: string[];\n  dayPlaceholder?: string;\n  monthPlaceholder?: string;\n  yearPlaceholder?: string;\n  onDateChange?: (value: DatePickerDateFormat) => void;\n  disabled?: boolean;\n}\n\n// Переводим state к формату гг-мм-дд\nfunction convertToInputFormat({\n  day = 0,\n  month = 0,\n  year = 0,\n}: Partial<DatePickerDateFormat>) {\n  return `${year}-${leadingZero(month)}-${leadingZero(day)}`;\n}\n\n// Переводим дату формата гг-мм-дд к объекту\nfunction parseInputDate(date: string): DatePickerDateFormat {\n  const splited = date.split(\"-\");\n\n  return {\n    day: Number(splited[2]),\n    month: Number(splited[1]),\n    year: Number(splited[0]),\n  };\n}\n\nfunction getMonthMaxDay(month?: number, year?: number) {\n  return month ? new Date(year || 2016, month, 0).getDate() : 31;\n}\n\nconst range = (start: number, end: number) => {\n  const swap = start > end;\n  const arr = [];\n  for (let i = Math.min(start, end); i <= Math.max(start, end); i++) {\n    arr.push(i);\n  }\n  return swap ? arr.reverse() : arr;\n};\n\nconst DatePickerCustom = ({\n  name,\n  min = { day: 0, month: 0, year: 0 },\n  max = { day: 31, month: 12, year: 2100 },\n  dayPlaceholder,\n  monthPlaceholder,\n  yearPlaceholder,\n  popupDirection,\n  defaultValue,\n  monthNames,\n  day = 0,\n  month = 0,\n  year = 0,\n  onDateChange,\n  disabled,\n  ...restProps\n}: DatePickerProps & Partial<DatePickerDateFormat>) => {\n  const onSelectChange: React.ChangeEventHandler<HTMLSelectElement> = (e) => {\n    onDateChange?.({\n      day,\n      month,\n      year,\n      [e.target.name]: Number(e.target.value),\n    });\n  };\n  const dayOptions = range(1, getMonthMaxDay(month, year)).map((value) => ({\n    label: String(value),\n    value,\n  }));\n  const monthOptions = (monthNames || DefaultMonths).map((name, index) => ({\n    label: name,\n    value: index + 1,\n  }));\n  const yearOptions = range(max.year, min.year).map((value) => ({\n    label: String(value),\n    value: value,\n  }));\n  return (\n    <div vkuiClass=\"DatePicker\" {...restProps}>\n      <div vkuiClass=\"DatePicker__container\">\n        <div vkuiClass=\"DatePicker__day\">\n          <CustomSelect\n            name=\"day\"\n            value={day}\n            options={dayOptions}\n            placeholder={dayPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n        <div vkuiClass=\"DatePicker__month\">\n          <CustomSelect\n            vkuiClass=\"DatePicker__monthSelect\"\n            name=\"month\"\n            value={month}\n            options={monthOptions}\n            placeholder={monthPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n        <div vkuiClass=\"DatePicker__year\">\n          <CustomSelect\n            name=\"year\"\n            value={year}\n            options={yearOptions}\n            placeholder={yearPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n      </div>\n      <input\n        type=\"hidden\"\n        name={name}\n        value={convertToInputFormat({ day, month, year })}\n      />\n    </div>\n  );\n};\n\nconst DatePickerNative = ({\n  min = { day: 0, month: 0, year: 0 },\n  max = { day: 31, month: 12, year: 2100 },\n  dayPlaceholder,\n  monthPlaceholder,\n  yearPlaceholder,\n  popupDirection,\n  defaultValue,\n  day,\n  month,\n  year,\n  onDateChange,\n  ...restProps\n}: DatePickerProps & Partial<DatePickerDateFormat>) => {\n  const defProps =\n    day && month && year\n      ? { defaultValue: convertToInputFormat({ day, month, year }) }\n      : {};\n  const onStringChange: React.ChangeEventHandler<HTMLInputElement> =\n    React.useCallback(\n      (e) => {\n        onDateChange?.(parseInputDate(e.currentTarget.value));\n      },\n      [onDateChange]\n    );\n  return (\n    <Input\n      {...restProps}\n      type=\"date\"\n      onChange={onStringChange}\n      min={convertToInputFormat(min)}\n      max={convertToInputFormat(max)}\n      {...defProps}\n    />\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/DatePicker\n */\nexport const DatePicker = ({ defaultValue, ...props }: DatePickerProps) => {\n  const { hasMouse } = useAdaptivity();\n  const [value, setValue] = React.useState<Partial<DatePickerDateFormat>>(\n    () => ({\n      day: defaultValue?.day || 0,\n      month: defaultValue?.month || 0,\n      year: defaultValue?.year || 0,\n    })\n  );\n\n  const onDateChange = React.useCallback(\n    (update: DatePickerDateFormat) => {\n      setValue(update);\n      props.onDateChange && props.onDateChange({ ...update });\n    },\n    [props]\n  );\n\n  const Cmp = hasMouse ? DatePickerCustom : DatePickerNative;\n  return <Cmp {...props} {...value} onDateChange={onDateChange} />;\n};\n"],"mappings":"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"}
+{"version":3,"file":"DatePicker.js","names":["DefaultMonths","convertToInputFormat","day","month","year","leadingZero","parseInputDate","date","splited","split","Number","getMonthMaxDay","Date","getDate","DatePickerCustom","name","min","max","dayPlaceholder","monthPlaceholder","yearPlaceholder","popupDirection","defaultValue","monthNames","onDateChange","disabled","className","restProps","onSelectChange","e","target","value","dayOptions","range","map","label","String","monthOptions","index","yearOptions","classNamesString","DatePickerNative","defProps","onStringChange","React","useCallback","currentTarget","DatePicker","props","hasPointer","useAdaptivityHasPointer","useState","setValue","update","Cmp"],"sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { Input } from \"../Input/Input\";\nimport { useAdaptivityHasPointer } from \"../../hooks/useAdaptivityHasPointer\";\nimport { leadingZero } from \"../../lib/utils\";\nimport { CustomSelect } from \"../CustomSelect/CustomSelect\";\nimport { range } from \"../../helpers/range\";\nimport styles from \"./DatePicker.module.css\";\n\nconst DefaultMonths: string[] = [\n  \"Января\",\n  \"Февраля\",\n  \"Марта\",\n  \"Апреля\",\n  \"Мая\",\n  \"Июня\",\n  \"Июля\",\n  \"Августа\",\n  \"Сентября\",\n  \"Октября\",\n  \"Ноября\",\n  \"Декабря\",\n];\n\nexport type DatePickerDateFormat = {\n  day: number;\n  month: number;\n  year: number;\n};\n\nexport interface DatePickerProps\n  extends Omit<\n    React.HTMLAttributes<HTMLDivElement>,\n    \"defaultValue\" | \"min\" | \"max\"\n  > {\n  min?: DatePickerDateFormat;\n  max?: DatePickerDateFormat;\n  name?: string;\n  defaultValue?: DatePickerDateFormat;\n  popupDirection?: \"top\" | \"bottom\";\n  monthNames?: string[];\n  dayPlaceholder?: string;\n  monthPlaceholder?: string;\n  yearPlaceholder?: string;\n  onDateChange?: (value: DatePickerDateFormat) => void;\n  disabled?: boolean;\n}\n\n// Переводим state к формату гг-мм-дд\nfunction convertToInputFormat({\n  day = 0,\n  month = 0,\n  year = 0,\n}: Partial<DatePickerDateFormat>) {\n  return `${year}-${leadingZero(month)}-${leadingZero(day)}`;\n}\n\n// Переводим дату формата гг-мм-дд к объекту\nfunction parseInputDate(date: string): DatePickerDateFormat {\n  const splited = date.split(\"-\");\n\n  return {\n    day: Number(splited[2]),\n    month: Number(splited[1]),\n    year: Number(splited[0]),\n  };\n}\n\nfunction getMonthMaxDay(month?: number, year?: number) {\n  return month ? new Date(year || 2016, month, 0).getDate() : 31;\n}\n\nconst DatePickerCustom = ({\n  name,\n  min = { day: 0, month: 0, year: 0 },\n  max = { day: 31, month: 12, year: 2100 },\n  dayPlaceholder,\n  monthPlaceholder,\n  yearPlaceholder,\n  popupDirection,\n  defaultValue,\n  monthNames,\n  day = 0,\n  month = 0,\n  year = 0,\n  onDateChange,\n  disabled,\n  className,\n  ...restProps\n}: DatePickerProps & Partial<DatePickerDateFormat>) => {\n  const onSelectChange: React.ChangeEventHandler<HTMLSelectElement> = (e) => {\n    onDateChange?.({\n      day,\n      month,\n      year,\n      [e.target.name]: Number(e.target.value),\n    });\n  };\n  const dayOptions = range(1, getMonthMaxDay(month, year)).map((value) => ({\n    label: String(value),\n    value,\n  }));\n  const monthOptions = (monthNames || DefaultMonths).map((name, index) => ({\n    label: name,\n    value: index + 1,\n  }));\n  const yearOptions = range(max.year, min.year).map((value) => ({\n    label: String(value),\n    value: value,\n  }));\n  return (\n    <div\n      className={classNamesString(styles[\"DatePicker\"], className)}\n      {...restProps}\n    >\n      <div className={styles[\"DatePicker__container\"]}>\n        <div className={styles[\"DatePicker__day\"]}>\n          <CustomSelect\n            name=\"day\"\n            value={day}\n            options={dayOptions}\n            placeholder={dayPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n        <div className={styles[\"DatePicker__month\"]}>\n          <CustomSelect\n            className={styles[\"DatePicker__monthSelect\"]}\n            name=\"month\"\n            value={month}\n            options={monthOptions}\n            placeholder={monthPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n        <div className={styles[\"DatePicker__year\"]}>\n          <CustomSelect\n            name=\"year\"\n            value={year}\n            options={yearOptions}\n            placeholder={yearPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n      </div>\n      <input\n        type=\"hidden\"\n        name={name}\n        value={convertToInputFormat({ day, month, year })}\n      />\n    </div>\n  );\n};\n\nconst DatePickerNative = ({\n  min = { day: 0, month: 0, year: 0 },\n  max = { day: 31, month: 12, year: 2100 },\n  dayPlaceholder,\n  monthPlaceholder,\n  yearPlaceholder,\n  popupDirection,\n  defaultValue,\n  day,\n  month,\n  year,\n  onDateChange,\n  ...restProps\n}: DatePickerProps & Partial<DatePickerDateFormat>) => {\n  const defProps =\n    day && month && year\n      ? { defaultValue: convertToInputFormat({ day, month, year }) }\n      : {};\n  const onStringChange: React.ChangeEventHandler<HTMLInputElement> =\n    React.useCallback(\n      (e) => {\n        onDateChange?.(parseInputDate(e.currentTarget.value));\n      },\n      [onDateChange]\n    );\n  return (\n    <Input\n      {...restProps}\n      type=\"date\"\n      onChange={onStringChange}\n      min={convertToInputFormat(min)}\n      max={convertToInputFormat(max)}\n      {...defProps}\n    />\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/DatePicker\n */\nexport const DatePicker = ({ defaultValue, ...props }: DatePickerProps) => {\n  const hasPointer = useAdaptivityHasPointer();\n  const [value, setValue] = React.useState<Partial<DatePickerDateFormat>>(\n    () => ({\n      day: defaultValue?.day || 0,\n      month: defaultValue?.month || 0,\n      year: defaultValue?.year || 0,\n    })\n  );\n\n  const onDateChange = React.useCallback(\n    (update: DatePickerDateFormat) => {\n      setValue(update);\n      props.onDateChange && props.onDateChange({ ...update });\n    },\n    [props]\n  );\n\n  const Cmp = hasPointer ? DatePickerCustom : DatePickerNative;\n  return <Cmp {...props} {...value} onDateChange={onDateChange} />;\n};\n"],"mappings":"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"}

package/dist/cjs/components/DateRangeInput/DateRangeInput.d.ts

@@ -0,0 +1,22 @@
+import * as React from "react";
+import { CalendarRangeProps } from "../CalendarRange/CalendarRange";
+import { Placement } from "../Popper/Popper";
+import { HasRootRef } from "../../types";
+import { FormFieldProps } from "../FormField/FormField";
+export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTMLDivElement>, "value" | "onChange">, Pick<CalendarRangeProps, "disablePast" | "disableFuture" | "shouldDisableDate" | "onChange" | "value" | "weekStartsOn" | "disablePickers" | "prevMonthAriaLabel" | "nextMonthAriaLabel" | "changeMonthAriaLabel" | "changeYearAriaLabel" | "changeDayAriaLabel" | "prevMonthIcon" | "nextMonthIcon">, HasRootRef<HTMLDivElement>, FormFieldProps {
+    calendarPlacement?: Placement;
+    closeOnChange?: boolean;
+    clearFieldAriaLabel?: string;
+    showCalendarAriaLabel?: string;
+    changeStartDayAriaLabel?: string;
+    changeStartMonthAriaLabel?: string;
+    changeStartYearAriaLabel?: string;
+    changeEndDayAriaLabel?: string;
+    changeEndMonthAriaLabel?: string;
+    changeEndYearAriaLabel?: string;
+    disableCalendar?: boolean;
+}
+/**
+ * @see https://vkcom.github.io/VKUI/#/DateRangeInput
+ */
+export declare const DateRangeInput: ({ shouldDisableDate, disableFuture, disablePast, value, onChange, calendarPlacement, style, className, closeOnChange, disablePickers, getRootRef, name, autoFocus, disabled, onClick, onFocus, prevMonthAriaLabel, nextMonthAriaLabel, changeDayAriaLabel, changeMonthAriaLabel, changeYearAriaLabel, changeStartDayAriaLabel, changeStartMonthAriaLabel, changeStartYearAriaLabel, changeEndDayAriaLabel, changeEndMonthAriaLabel, changeEndYearAriaLabel, clearFieldAriaLabel, showCalendarAriaLabel, prevMonthIcon, nextMonthIcon, disableCalendar, ...props }: DateRangeInputProps) => JSX.Element;