npm - @vkontakte/vkui - Versions diffs - 5.2.0 → 5.2.1 - Mend

@vkontakte/vkui 5.2.0 → 5.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1151) hide show

package/dist/components/DatePicker/DatePicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DatePicker.js","names":["React","classNames","leadingZero","Input","useAdaptivityHasPointer","CustomSelect","range","DefaultMonths","convertToInputFormat","day","month","year","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","map","label","String","monthOptions","index","yearOptions","DatePickerNative","defProps","onStringChange","useCallback","currentTarget","DatePicker","props","hasPointer","useState","setValue","update","Cmp"],"sources":["../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, leadingZero } from '@vkontakte/vkjs';\nimport { Input } from '../Input/Input';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\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<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' \| 'min' \| 'max'> {\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({ day = 0, month = 0, year = 0 }: 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 className={classNames(styles['DatePicker'], className)} {...restProps}>\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 type=\"hidden\" name={name} value={convertToInputFormat({ day, month, year })} />\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 ? { defaultValue: convertToInputFormat({ day, month, year }) } : {};\n const onStringChange: React.ChangeEventHandler<HTMLInputElement> = 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 day: defaultValue?.day \|\| 0,\n month: defaultValue?.month \|\| 0,\n year: defaultValue?.year \|\| 0,\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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"}
1	+ {"version":3,"file":"DatePicker.js","names":["React","classNames","leadingZero","range","useAdaptivityHasPointer","CustomSelect","Input","DefaultMonths","convertToInputFormat","day","month","year","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","map","label","String","monthOptions","index","yearOptions","DatePickerNative","defProps","onStringChange","useCallback","currentTarget","DatePicker","props","hasPointer","useState","setValue","update","Cmp"],"sources":["../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, leadingZero } from '@vkontakte/vkjs';\nimport { range } from '../../helpers/range';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport { Input } from '../Input/Input';\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<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' \| 'min' \| 'max'> {\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({ day = 0, month = 0, year = 0 }: 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 className={classNames(styles['DatePicker'], className)} {...restProps}>\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 type=\"hidden\" name={name} value={convertToInputFormat({ day, month, year })} />\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 ? { defaultValue: convertToInputFormat({ day, month, year }) } : {};\n const onStringChange: React.ChangeEventHandler<HTMLInputElement> = 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 day: defaultValue?.day \|\| 0,\n month: defaultValue?.month \|\| 0,\n year: defaultValue?.year \|\| 0,\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/components/DateRangeInput/DateRangeInput.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { CalendarRangeProps } from '../CalendarRange/CalendarRange';
-import { HasRootRef } from '../../types';
 import type { PlacementWithAuto } from '../../lib/floating';
+import { HasRootRef } from '../../types';
+import { CalendarRangeProps } from '../CalendarRange/CalendarRange';
 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?: PlacementWithAuto;

package/dist/components/DateRangeInput/DateRangeInput.js CHANGED Viewed

@@ -1,21 +1,25 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["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"];
 import * as React from 'react';
-import { format, isMatch, parse, isAfter } from '../../lib/date';
 import { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';
-import { CalendarRange } from '../CalendarRange/CalendarRange';
-import { Popper } from '../Popper/Popper';
-import { IconButton } from '../IconButton/IconButton';
-import { useDateInput } from '../../hooks/useDateInput';
+import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
+import { useDateInput } from '../../hooks/useDateInput';
 import { useExternRef } from '../../hooks/useExternRef';
-import { classNames } from '@vkontakte/vkjs';
+import { SizeType } from '../../lib/adaptivity';
+import { callMultiple } from '../../lib/callMultiple';
+import { format, isAfter, isMatch, parse } from '../../lib/date';
+import { CalendarRange } from '../CalendarRange/CalendarRange';
 import { FormField } from '../FormField/FormField';
+import { IconButton } from '../IconButton/IconButton';
 import { InputLike } from '../InputLike/InputLike';
 import { InputLikeDivider } from '../InputLike/InputLikeDivider';
-import { callMultiple } from '../../lib/callMultiple';
-import { getSizeYClassName } from '../../helpers/getSizeYClassName';
+import { Popper } from '../Popper/Popper';
+var sizeYClassNames = _defineProperty({
+  none: "vkuiDateRangeInput--sizeY-none"
+}, SizeType.COMPACT, "vkuiDateRangeInput--sizeY-compact");
 var elementsConfig = function elementsConfig(index) {
   var length = 2;
   var min = 1;
@@ -170,7 +174,8 @@ export var DateRangeInput = function DateRangeInput(_ref) {
     clear = _useDateInput.clear,
     removeFocusFromField = _useDateInput.removeFocusFromField;
   var _useAdaptivity = useAdaptivity(),
-    sizeY = _useAdaptivity.sizeY;
+    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
+    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
   var handleRootRef = useExternRef(rootRef, getRootRef);
   var onCalendarChange = React.useCallback(function (newValue) {
     onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
@@ -180,7 +185,7 @@ export var DateRangeInput = function DateRangeInput(_ref) {
   }, [onChange, closeOnChange, value, removeFocusFromField]);
   return /*#__PURE__*/React.createElement(FormField, _extends({
     style: style,
-    className: classNames("vkuiDateRangeInput", getSizeYClassName("vkuiDateRangeInput", sizeY), className),
+    className: classNames("vkuiDateRangeInput", sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], className),
     getRootRef: handleRootRef,
     after: value ? /*#__PURE__*/React.createElement(IconButton, {
       hoverMode: "opacity",

package/dist/components/DateRangeInput/DateRangeInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRangeInput.js","names":["React","format","isMatch","parse","isAfter","Icon16Clear","Icon20CalendarOutline","CalendarRange","Popper","IconButton","useDateInput","useAdaptivity","useExternRef","classNames","FormField","InputLike","InputLikeDivider","callMultiple","getSizeYClassName","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","DateRangeInput","shouldDisableDate","disableFuture","disablePast","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","daysStartRef","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","onInternalValueChange","useCallback","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","valueExists","Array","isArray","now","Date","start","end","refs","useMemo","maxElement","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","sizeY","handleRootRef","onCalendarChange"],"sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { format, isMatch, parse, isAfter } from '../../lib/date';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { CalendarRange, CalendarRangeProps } from '../CalendarRange/CalendarRange';\nimport { Popper } from '../Popper/Popper';\nimport { IconButton } from '../IconButton/IconButton';\nimport { HasRootRef } from '../../types';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { classNames } from '@vkontakte/vkjs';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { InputLike } from '../InputLike/InputLike';\nimport { InputLikeDivider } from '../InputLike/InputLikeDivider';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { getSizeYClassName } from '../../helpers/getSizeYClassName';\nimport styles from './DateRangeInput.module.css';\nimport dateInputStyles from '../DateInput/DateInput.module.css';\n\nexport interface DateRangeInputProps\n extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' \| 'onChange'>,\n Pick<\n CalendarRangeProps,\n \| 'disablePast'\n \| 'disableFuture'\n \| 'shouldDisableDate'\n \| 'onChange'\n \| 'value'\n \| 'weekStartsOn'\n \| 'disablePickers'\n \| 'prevMonthAriaLabel'\n \| 'nextMonthAriaLabel'\n \| 'changeMonthAriaLabel'\n \| 'changeYearAriaLabel'\n \| 'changeDayAriaLabel'\n \| 'prevMonthIcon'\n \| 'nextMonthIcon'\n >,\n HasRootRef<HTMLDivElement>,\n FormFieldProps {\n calendarPlacement?: PlacementWithAuto;\n closeOnChange?: boolean;\n clearFieldAriaLabel?: string;\n showCalendarAriaLabel?: string;\n changeStartDayAriaLabel?: string;\n changeStartMonthAriaLabel?: string;\n changeStartYearAriaLabel?: string;\n changeEndDayAriaLabel?: string;\n changeEndMonthAriaLabel?: string;\n changeEndYearAriaLabel?: 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 case 3:\n max = 31;\n break;\n case 1:\n case 4:\n max = 12;\n break;\n case 2:\n case 5:\n max = 2100;\n min = 1900;\n length = 4;\n break;\n }\n\n return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarRangeProps['value']) => {\n const newValue = ['', '', '', '', '', ''];\n if (value?.[0]) {\n newValue[0] = String(value[0].getDate()).padStart(2, '0');\n newValue[1] = String(value[0].getMonth() + 1).padStart(2, '0');\n newValue[2] = String(value[0].getFullYear()).padStart(4, '0');\n }\n if (value?.[1]) {\n newValue[3] = String(value[1].getDate()).padStart(2, '0');\n newValue[4] = String(value[1].getMonth() + 1).padStart(2, '0');\n newValue[5] = String(value[1].getFullYear()).padStart(4, '0');\n }\n return newValue;\n};\n\n/*\n @see https://vkcom.github.io/VKUI/#/DateRangeInput\n */\nexport const DateRangeInput = ({\n shouldDisableDate,\n disableFuture,\n disablePast,\n value,\n onChange,\n calendarPlacement = 'bottom-start',\n style,\n className,\n closeOnChange = true,\n disablePickers,\n getRootRef,\n name,\n autoFocus,\n disabled,\n onClick,\n onFocus,\n prevMonthAriaLabel,\n nextMonthAriaLabel,\n changeDayAriaLabel,\n changeMonthAriaLabel,\n changeYearAriaLabel,\n changeStartDayAriaLabel = 'Изменить день начала',\n changeStartMonthAriaLabel = 'Изменить месяц начала',\n changeStartYearAriaLabel = 'Изменить год начала',\n changeEndDayAriaLabel = 'Изменить день окончания',\n changeEndMonthAriaLabel = 'Изменить месяц окончания',\n changeEndYearAriaLabel = 'Изменить год окончания',\n clearFieldAriaLabel = 'Очистить поле',\n showCalendarAriaLabel = 'Показать календарь',\n prevMonthIcon,\n nextMonthIcon,\n disableCalendar = false,\n ...props\n}: DateRangeInputProps) => {\n const daysStartRef = React.useRef<HTMLSpanElement>(null);\n const monthsStartRef = React.useRef<HTMLSpanElement>(null);\n const yearsStartRef = React.useRef<HTMLSpanElement>(null);\n const daysEndRef = React.useRef<HTMLSpanElement>(null);\n const monthsEndRef = React.useRef<HTMLSpanElement>(null);\n const yearsEndRef = React.useRef<HTMLSpanElement>(null);\n\n const onInternalValueChange = React.useCallback(\n (internalValue: string[]) => {\n let isStartValid = true;\n let isEndValid = true;\n for (let i = 0; i <= 2; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n isStartValid = false;\n }\n }\n for (let i = 3; i <= 5; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n isEndValid = false;\n }\n }\n const formattedStartValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n const formattedEndValue = `${internalValue[3]}.${internalValue[4]}.${internalValue[5]}`;\n const mask = 'dd.MM.yyyy';\n\n if (!isMatch(formattedStartValue, mask)) {\n isStartValid = false;\n }\n if (!isMatch(formattedEndValue, mask)) {\n isEndValid = false;\n }\n\n if (!isStartValid && !isEndValid) {\n return;\n }\n\n const valueExists = Array.isArray(value);\n const now = new Date();\n const start = isStartValid\n ? parse(formattedStartValue, mask, (valueExists && value?.[0]) \|\| now)\n : null;\n const end = isEndValid\n ? parse(formattedEndValue, mask, (valueExists && value?.[1]) \|\| now)\n : null;\n if (start && end && isAfter(end, start)) {\n onChange?.([start, end]);\n }\n },\n [onChange, value],\n );\n\n const refs = React.useMemo(\n () => [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\n [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\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: 5,\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 handleRootRef = useExternRef(rootRef, getRootRef);\n\n const onCalendarChange = React.useCallback(\n (newValue?: Array<Date \| null> \| undefined) => {\n onChange?.(newValue);\n if (closeOnChange && newValue?.[1] && newValue[1] !== value?.[1]) {\n removeFocusFromField();\n }\n },\n [onChange, closeOnChange, value, removeFocusFromField],\n );\n\n return (\n <FormField\n style={style}\n className={classNames(\n styles['DateRangeInput'],\n getSizeYClassName(styles['DateRangeInput'], sizeY),\n className,\n )}\n getRootRef={handleRootRef}\n after={\n value ? (\n <IconButton hoverMode=\"opacity\" aria-label={clearFieldAriaLabel} onClick={clear}>\n <Icon16Clear />\n </IconButton>\n ) : (\n <IconButton hoverMode=\"opacity\" aria-label={showCalendarAriaLabel} onClick={openCalendar}>\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 ? `${value[0] ? format(value[0], 'DD.MM.YYYY') : ''} - ${\n value[1] ? format(value[1], 'DD.MM.YYYY') : ''\n }`\n : ''\n }\n />\n <span className={dateInputStyles['DateInput__input']} onKeyDown={handleKeyDown}>\n <InputLike\n length={2}\n getRootRef={daysStartRef}\n index={0}\n onElementSelect={setFocusedElement}\n value={internalValue[0]}\n aria-label={changeStartDayAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsStartRef}\n index={1}\n onElementSelect={setFocusedElement}\n value={internalValue[1]}\n aria-label={changeStartMonthAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsStartRef}\n index={2}\n onElementSelect={setFocusedElement}\n value={internalValue[2]}\n aria-label={changeStartYearAriaLabel}\n />\n <InputLikeDivider>{' — '}</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={daysEndRef}\n index={3}\n onElementSelect={setFocusedElement}\n value={internalValue[3]}\n aria-label={changeEndDayAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsEndRef}\n index={4}\n onElementSelect={setFocusedElement}\n value={internalValue[4]}\n aria-label={changeEndMonthAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsEndRef}\n index={5}\n onElementSelect={setFocusedElement}\n value={internalValue[5]}\n aria-label={changeEndYearAriaLabel}\n />\n </span>\n {open && !disableCalendar && (\n <Popper targetRef={rootRef} offsetDistance={8} placement={calendarPlacement}>\n <CalendarRange\n value={value}\n onChange={onCalendarChange}\n disablePast={disablePast}\n disableFuture={disableFuture}\n shouldDisableDate={shouldDisableDate}\n onClose={closeCalendar}\n getRootRef={calendarRef}\n disablePickers={disablePickers}\n prevMonthAriaLabel={prevMonthAriaLabel}\n nextMonthAriaLabel={nextMonthAriaLabel}\n changeMonthAriaLabel={changeMonthAriaLabel}\n changeYearAriaLabel={changeYearAriaLabel}\n changeDayAriaLabel={changeDayAriaLabel}\n prevMonthIcon={prevMonthIcon}\n nextMonthIcon={nextMonthIcon}\n />\n </Popper>\n )}\n </FormField>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"DateRangeInput.js","names":["React","Icon16Clear","Icon20CalendarOutline","classNames","useAdaptivity","useDateInput","useExternRef","SizeType","callMultiple","format","isAfter","isMatch","parse","CalendarRange","FormField","IconButton","InputLike","InputLikeDivider","Popper","sizeYClassNames","none","COMPACT","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","DateRangeInput","shouldDisableDate","disableFuture","disablePast","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","daysStartRef","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","onInternalValueChange","useCallback","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","valueExists","Array","isArray","now","Date","start","end","refs","useMemo","maxElement","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","sizeY","handleRootRef","onCalendarChange","REGULAR"],"sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { format, isAfter, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport { HasRootRef } from '../../types';\nimport { CalendarRange, CalendarRangeProps } from '../CalendarRange/CalendarRange';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { InputLike } from '../InputLike/InputLike';\nimport { InputLikeDivider } from '../InputLike/InputLikeDivider';\nimport { Popper } from '../Popper/Popper';\nimport styles from './DateRangeInput.module.css';\nimport dateInputStyles from '../DateInput/DateInput.module.css';\n\nconst sizeYClassNames = {\n none: styles['DateRangeInput--sizeY-none'],\n [SizeType.COMPACT]: styles['DateRangeInput--sizeY-compact'],\n};\n\nexport interface DateRangeInputProps\n extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' \| 'onChange'>,\n Pick<\n CalendarRangeProps,\n \| 'disablePast'\n \| 'disableFuture'\n \| 'shouldDisableDate'\n \| 'onChange'\n \| 'value'\n \| 'weekStartsOn'\n \| 'disablePickers'\n \| 'prevMonthAriaLabel'\n \| 'nextMonthAriaLabel'\n \| 'changeMonthAriaLabel'\n \| 'changeYearAriaLabel'\n \| 'changeDayAriaLabel'\n \| 'prevMonthIcon'\n \| 'nextMonthIcon'\n >,\n HasRootRef<HTMLDivElement>,\n FormFieldProps {\n calendarPlacement?: PlacementWithAuto;\n closeOnChange?: boolean;\n clearFieldAriaLabel?: string;\n showCalendarAriaLabel?: string;\n changeStartDayAriaLabel?: string;\n changeStartMonthAriaLabel?: string;\n changeStartYearAriaLabel?: string;\n changeEndDayAriaLabel?: string;\n changeEndMonthAriaLabel?: string;\n changeEndYearAriaLabel?: 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 case 3:\n max = 31;\n break;\n case 1:\n case 4:\n max = 12;\n break;\n case 2:\n case 5:\n max = 2100;\n min = 1900;\n length = 4;\n break;\n }\n\n return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarRangeProps['value']) => {\n const newValue = ['', '', '', '', '', ''];\n if (value?.[0]) {\n newValue[0] = String(value[0].getDate()).padStart(2, '0');\n newValue[1] = String(value[0].getMonth() + 1).padStart(2, '0');\n newValue[2] = String(value[0].getFullYear()).padStart(4, '0');\n }\n if (value?.[1]) {\n newValue[3] = String(value[1].getDate()).padStart(2, '0');\n newValue[4] = String(value[1].getMonth() + 1).padStart(2, '0');\n newValue[5] = String(value[1].getFullYear()).padStart(4, '0');\n }\n return newValue;\n};\n\n/*\n @see https://vkcom.github.io/VKUI/#/DateRangeInput\n */\nexport const DateRangeInput = ({\n shouldDisableDate,\n disableFuture,\n disablePast,\n value,\n onChange,\n calendarPlacement = 'bottom-start',\n style,\n className,\n closeOnChange = true,\n disablePickers,\n getRootRef,\n name,\n autoFocus,\n disabled,\n onClick,\n onFocus,\n prevMonthAriaLabel,\n nextMonthAriaLabel,\n changeDayAriaLabel,\n changeMonthAriaLabel,\n changeYearAriaLabel,\n changeStartDayAriaLabel = 'Изменить день начала',\n changeStartMonthAriaLabel = 'Изменить месяц начала',\n changeStartYearAriaLabel = 'Изменить год начала',\n changeEndDayAriaLabel = 'Изменить день окончания',\n changeEndMonthAriaLabel = 'Изменить месяц окончания',\n changeEndYearAriaLabel = 'Изменить год окончания',\n clearFieldAriaLabel = 'Очистить поле',\n showCalendarAriaLabel = 'Показать календарь',\n prevMonthIcon,\n nextMonthIcon,\n disableCalendar = false,\n ...props\n}: DateRangeInputProps) => {\n const daysStartRef = React.useRef<HTMLSpanElement>(null);\n const monthsStartRef = React.useRef<HTMLSpanElement>(null);\n const yearsStartRef = React.useRef<HTMLSpanElement>(null);\n const daysEndRef = React.useRef<HTMLSpanElement>(null);\n const monthsEndRef = React.useRef<HTMLSpanElement>(null);\n const yearsEndRef = React.useRef<HTMLSpanElement>(null);\n\n const onInternalValueChange = React.useCallback(\n (internalValue: string[]) => {\n let isStartValid = true;\n let isEndValid = true;\n for (let i = 0; i <= 2; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n isStartValid = false;\n }\n }\n for (let i = 3; i <= 5; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n isEndValid = false;\n }\n }\n const formattedStartValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n const formattedEndValue = `${internalValue[3]}.${internalValue[4]}.${internalValue[5]}`;\n const mask = 'dd.MM.yyyy';\n\n if (!isMatch(formattedStartValue, mask)) {\n isStartValid = false;\n }\n if (!isMatch(formattedEndValue, mask)) {\n isEndValid = false;\n }\n\n if (!isStartValid && !isEndValid) {\n return;\n }\n\n const valueExists = Array.isArray(value);\n const now = new Date();\n const start = isStartValid\n ? parse(formattedStartValue, mask, (valueExists && value?.[0]) \|\| now)\n : null;\n const end = isEndValid\n ? parse(formattedEndValue, mask, (valueExists && value?.[1]) \|\| now)\n : null;\n if (start && end && isAfter(end, start)) {\n onChange?.([start, end]);\n }\n },\n [onChange, value],\n );\n\n const refs = React.useMemo(\n () => [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\n [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\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: 5,\n refs,\n autoFocus,\n disabled,\n elementsConfig,\n onChange,\n onInternalValueChange,\n getInternalValue,\n value,\n });\n\n const { sizeY = 'none' } = useAdaptivity();\n\n const handleRootRef = useExternRef(rootRef, getRootRef);\n\n const onCalendarChange = React.useCallback(\n (newValue?: Array<Date \| null> \| undefined) => {\n onChange?.(newValue);\n if (closeOnChange && newValue?.[1] && newValue[1] !== value?.[1]) {\n removeFocusFromField();\n }\n },\n [onChange, closeOnChange, value, removeFocusFromField],\n );\n\n return (\n <FormField\n style={style}\n className={classNames(\n styles['DateRangeInput'],\n sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n className,\n )}\n getRootRef={handleRootRef}\n after={\n value ? (\n <IconButton hoverMode=\"opacity\" aria-label={clearFieldAriaLabel} onClick={clear}>\n <Icon16Clear />\n </IconButton>\n ) : (\n <IconButton hoverMode=\"opacity\" aria-label={showCalendarAriaLabel} onClick={openCalendar}>\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 ? `${value[0] ? format(value[0], 'DD.MM.YYYY') : ''} - ${\n value[1] ? format(value[1], 'DD.MM.YYYY') : ''\n }`\n : ''\n }\n />\n <span className={dateInputStyles['DateInput__input']} onKeyDown={handleKeyDown}>\n <InputLike\n length={2}\n getRootRef={daysStartRef}\n index={0}\n onElementSelect={setFocusedElement}\n value={internalValue[0]}\n aria-label={changeStartDayAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsStartRef}\n index={1}\n onElementSelect={setFocusedElement}\n value={internalValue[1]}\n aria-label={changeStartMonthAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsStartRef}\n index={2}\n onElementSelect={setFocusedElement}\n value={internalValue[2]}\n aria-label={changeStartYearAriaLabel}\n />\n <InputLikeDivider>{' — '}</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={daysEndRef}\n index={3}\n onElementSelect={setFocusedElement}\n value={internalValue[3]}\n aria-label={changeEndDayAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsEndRef}\n index={4}\n onElementSelect={setFocusedElement}\n value={internalValue[4]}\n aria-label={changeEndMonthAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsEndRef}\n index={5}\n onElementSelect={setFocusedElement}\n value={internalValue[5]}\n aria-label={changeEndYearAriaLabel}\n />\n </span>\n {open && !disableCalendar && (\n <Popper targetRef={rootRef} offsetDistance={8} placement={calendarPlacement}>\n <CalendarRange\n value={value}\n onChange={onCalendarChange}\n disablePast={disablePast}\n disableFuture={disableFuture}\n shouldDisableDate={shouldDisableDate}\n onClose={closeCalendar}\n getRootRef={calendarRef}\n disablePickers={disablePickers}\n prevMonthAriaLabel={prevMonthAriaLabel}\n nextMonthAriaLabel={nextMonthAriaLabel}\n changeMonthAriaLabel={changeMonthAriaLabel}\n changeYearAriaLabel={changeYearAriaLabel}\n changeDayAriaLabel={changeDayAriaLabel}\n prevMonthIcon={prevMonthIcon}\n nextMonthIcon={nextMonthIcon}\n />\n </Popper>\n )}\n </FormField>\n );\n};\n"],"mappings":"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"}

package/dist/components/DropdownIcon/DropdownIcon.js CHANGED Viewed

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["opened", "className"];
 import * as React from 'react';
-import { Icon20Dropdown, Icon24ChevronDown, Icon24ChevronUp, Icon20ChevronUp } from '@vkontakte/icons';
+import { Icon20ChevronUp, Icon20Dropdown, Icon24ChevronDown, Icon24ChevronUp } from '@vkontakte/icons';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';
 export var DropdownIcon = function DropdownIcon(_ref) {

package/dist/components/DropdownIcon/DropdownIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DropdownIcon.js","names":["React","Icon20Dropdown","Icon24ChevronDown","Icon24ChevronUp","~~Icon20ChevronUp","~~classNames","useAdaptivityConditionalRender","DropdownIcon","opened","className","restProps","sizeY","IconCompact","IconRegular","compact","regular"],"sources":["../../../src/components/DropdownIcon/DropdownIcon.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Icon20Dropdown,\n Icon24ChevronDown,\n Icon24ChevronUp,\n ~~Icon20ChevronUp,\n~~} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport styles from './DropdownIcon.module.css';\n\nexport interface DropdownIconProps extends React.HTMLAttributes<SVGSVGElement> {\n opened?: boolean;\n}\n\nexport const DropdownIcon = ({ opened = false, className, ...restProps }: DropdownIconProps) => {\n const { sizeY } = useAdaptivityConditionalRender();\n const IconCompact = opened ? Icon20ChevronUp : Icon20Dropdown;\n const IconRegular = opened ? Icon24ChevronUp : Icon24ChevronDown;\n\n return (\n <React.Fragment>\n {sizeY.compact && (\n <IconCompact\n className={classNames(styles['DropdownIcon'], sizeY.compact.className, className)}\n {...restProps}\n />\n )}\n {sizeY.regular && (\n <IconRegular\n className={classNames(styles['DropdownIcon'], sizeY.regular.className, className)}\n {...restProps}\n />\n )}\n </React.Fragment>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SACEC,cAAc,EACdC,iBAAiB,EACjBC,eAAe,~~EACfC,eAAe,~~QACV,kBAAkB;AACzB,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,8BAA8B,QAAQ,4CAA4C;AAO3F,OAAO,IAAMC,YAAY,GAAG,SAAfA,YAAY,OAAuE;EAAA,uBAAjEC,MAAM;IAANA,MAAM,4BAAG,KAAK;IAAEC,SAAS,QAATA,SAAS;IAAKC,SAAS;EACpE,4BAAkBJ,8BAA8B,EAAE;IAA1CK,KAAK,yBAALA,KAAK;EACb,IAAMC,WAAW,GAAGJ,MAAM,~~GAAGJ~~,eAAe,~~GAAGH~~,cAAc;EAC7D,~~IAAMY~~,WAAW,GAAGL,MAAM,~~GAAGL~~,eAAe,GAAGD,iBAAiB;EAEhE,oBACE,oBAAC,KAAK,CAAC,QAAQ,~~QACZS~~,KAAK,CAACG,OAAO,iBACZ,oBAAC,WAAW;IACV,SAAS,EAAET,UAAU,qBAAyBM,KAAK,CAACG,OAAO,CAACL,SAAS,EAAEA,SAAS;EAAE,GAC9EC,SAAS,EAEhB,EACAC,KAAK,CAACI,OAAO,iBACZ,oBAAC,WAAW;IACV,SAAS,EAAEV,UAAU,qBAAyBM,KAAK,CAACI,OAAO,CAACN,SAAS,EAAEA,SAAS;EAAE,GAC9EC,SAAS,EAEhB,CACc;AAErB,CAAC"}
1	+ {"version":3,"file":"DropdownIcon.js","names":["React","Icon20ChevronUp","Icon20Dropdown","Icon24ChevronDown","Icon24ChevronUp","classNames","useAdaptivityConditionalRender","DropdownIcon","opened","className","restProps","sizeY","IconCompact","IconRegular","compact","regular"],"sources":["../../../src/components/DropdownIcon/DropdownIcon.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Icon20ChevronUp,\n Icon20Dropdown,\n Icon24ChevronDown,\n Icon24ChevronUp,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport styles from './DropdownIcon.module.css';\n\nexport interface DropdownIconProps extends React.HTMLAttributes<SVGSVGElement> {\n opened?: boolean;\n}\n\nexport const DropdownIcon = ({ opened = false, className, ...restProps }: DropdownIconProps) => {\n const { sizeY } = useAdaptivityConditionalRender();\n const IconCompact = opened ? Icon20ChevronUp : Icon20Dropdown;\n const IconRegular = opened ? Icon24ChevronUp : Icon24ChevronDown;\n\n return (\n <React.Fragment>\n {sizeY.compact && (\n <IconCompact\n className={classNames(styles['DropdownIcon'], sizeY.compact.className, className)}\n {...restProps}\n />\n )}\n {sizeY.regular && (\n <IconRegular\n className={classNames(styles['DropdownIcon'], sizeY.regular.className, className)}\n {...restProps}\n />\n )}\n </React.Fragment>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SACEC,eAAe,EACfC,cAAc,EACdC,iBAAiB,EACjBC,eAAe,QACV,kBAAkB;AACzB,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,8BAA8B,QAAQ,4CAA4C;AAO3F,OAAO,IAAMC,YAAY,GAAG,SAAfA,YAAY,OAAuE;EAAA,uBAAjEC,MAAM;IAANA,MAAM,4BAAG,KAAK;IAAEC,SAAS,QAATA,SAAS;IAAKC,SAAS;EACpE,4BAAkBJ,8BAA8B,EAAE;IAA1CK,KAAK,yBAALA,KAAK;EACb,IAAMC,WAAW,GAAGJ,MAAM,GAAGP,eAAe,GAAGC,cAAc;EAC7D,IAAMW,WAAW,GAAGL,MAAM,GAAGJ,eAAe,GAAGD,iBAAiB;EAEhE,oBACE,oBAAC,KAAK,CAAC,QAAQ,QACZQ,KAAK,CAACG,OAAO,iBACZ,oBAAC,WAAW;IACV,SAAS,EAAET,UAAU,qBAAyBM,KAAK,CAACG,OAAO,CAACL,SAAS,EAAEA,SAAS;EAAE,GAC9EC,SAAS,EAEhB,EACAC,KAAK,CAACI,OAAO,iBACZ,oBAAC,WAAW;IACV,SAAS,EAAEV,UAAU,qBAAyBM,KAAK,CAACI,OAAO,CAACN,SAAS,EAAEA,SAAS;EAAE,GAC9EC,SAAS,EAEhB,CACc;AAErB,CAAC"}

package/dist/components/Epic/Epic.js CHANGED Viewed

@@ -3,9 +3,9 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["activeStory", "tabbar", "children", "className"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
-import { ScrollSaver } from './ScrollSaver';
 import { getNavId } from '../../lib/getNavId';
 import { warnOnce } from '../../lib/warnOnce';
+import { ScrollSaver } from './ScrollSaver';
 var warn = warnOnce('Epic');
 /**

package/dist/components/Epic/Epic.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Epic.js","names":["React","classNames","~~ScrollSaver~~","~~getNavId~~","~~warnOnce~~","warn","Epic","props","scroll","useRef","current","activeStory","tabbar","children","className","restProps","story","Children","toArray","find","isValidElement","value"],"sources":["../../../src/components/Epic/Epic.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ~~ScrollSaver~~ } from '~~./ScrollSaver~~';\nimport { ~~getNavId~~ } from '../../lib/~~getNavId~~';\nimport { ~~warnOnce~~ } from '~~../../lib/warnOnce~~';\nimport styles from './Epic.module.css';\n\nexport interface EpicProps extends React.HTMLAttributes<HTMLDivElement> {\n tabbar?: React.ReactNode;\n activeStory: string;\n}\n\nconst warn = warnOnce('Epic');\n\n/*\n @see https://vkcom.github.io/VKUI/#/Epic\n */\nexport const Epic = (props: EpicProps) => {\n const scroll = React.useRef<{ [key: string]: number }>({}).current;\n const { activeStory, tabbar, children, className, ...restProps } = props;\n\n const story =\n (React.Children.toArray(children).find(\n (story) => React.isValidElement(story) && getNavId(story.props, warn) === activeStory,\n ) as React.ReactElement \| undefined) ?? null;\n\n return (\n <div\n {...restProps}\n className={classNames(styles['Epic'], tabbar && styles['Epic--hasTabbar'], className)}\n >\n <ScrollSaver\n key={activeStory}\n initialScroll={scroll[activeStory] \|\| 0}\n saveScroll={(value) => (scroll[activeStory] = value)}\n >\n {story}\n </ScrollSaver>\n {tabbar}\n </div>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,~~WAAW~~,QAAQ,~~eAAe~~;~~AAC3C~~,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,~~QAAQ~~,QAAQ,~~oBAAoB~~;~~AAQ7C~~,IAAMC,IAAI,~~GAAGD~~,QAAQ,CAAC,MAAM,CAAC;;AAE7B;AACA;AACA;AACA,OAAO,~~IAAME~~,IAAI,GAAG,SAAPA,IAAI,CAAIC,KAAgB,EAAK;EAAA;EACxC,IAAMC,MAAM,GAAGR,KAAK,CAACS,MAAM,CAA4B,CAAC,CAAC,CAAC,CAACC,OAAO;EAClE,IAAQC,WAAW,GAAgDJ,KAAK,CAAhEI,WAAW;IAAEC,MAAM,GAAwCL,KAAK,CAAnDK,MAAM;IAAEC,QAAQ,GAA8BN,KAAK,CAA3CM,QAAQ;IAAEC,SAAS,GAAmBP,KAAK,CAAjCO,SAAS;IAAKC,SAAS,4BAAKR,KAAK;EAExE,IAAMS,KAAK,WACRhB,KAAK,CAACiB,QAAQ,CAACC,OAAO,CAACL,QAAQ,CAAC,CAACM,IAAI,CACpC,UAACH,KAAK;IAAA,OAAK,aAAAhB,KAAK,CAACoB,cAAc,CAACJ,KAAK,CAAC,~~IAAIb~~,QAAQ,~~CAACa~~,KAAK,CAACT,KAAK,EAAEF,IAAI,CAAC,KAAKM,WAAW;EAAA,EACtF,uCAAuC,IAAI;EAE9C,oBACE,wCACMI,SAAS;IACb,SAAS,EAAEd,UAAU,aAAiBW,MAAM,yBAA6B,EAAEE,SAAS;EAAE,iBAEtF,oBAAC,WAAW;IACV,GAAG,EAAEH,WAAY;IACjB,aAAa,EAAEH,MAAM,CAACG,WAAW,CAAC,IAAI,CAAE;IACxC,UAAU,EAAE,oBAACU,KAAK;MAAA,OAAMb,MAAM,CAACG,WAAW,CAAC,GAAGU,KAAK;IAAA;EAAE,GAEpDL,KAAK,CACM,EACbJ,MAAM,CACH;AAEV,CAAC"}
1	+ {"version":3,"file":"Epic.js","names":["React","classNames","getNavId","warnOnce","ScrollSaver","warn","Epic","props","scroll","useRef","current","activeStory","tabbar","children","className","restProps","story","Children","toArray","find","isValidElement","value"],"sources":["../../../src/components/Epic/Epic.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getNavId } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ScrollSaver } from './ScrollSaver';\nimport styles from './Epic.module.css';\n\nexport interface EpicProps extends React.HTMLAttributes<HTMLDivElement> {\n tabbar?: React.ReactNode;\n activeStory: string;\n}\n\nconst warn = warnOnce('Epic');\n\n/*\n @see https://vkcom.github.io/VKUI/#/Epic\n */\nexport const Epic = (props: EpicProps) => {\n const scroll = React.useRef<{ [key: string]: number }>({}).current;\n const { activeStory, tabbar, children, className, ...restProps } = props;\n\n const story =\n (React.Children.toArray(children).find(\n (story) => React.isValidElement(story) && getNavId(story.props, warn) === activeStory,\n ) as React.ReactElement \| undefined) ?? null;\n\n return (\n <div\n {...restProps}\n className={classNames(styles['Epic'], tabbar && styles['Epic--hasTabbar'], className)}\n >\n <ScrollSaver\n key={activeStory}\n initialScroll={scroll[activeStory] \|\| 0}\n saveScroll={(value) => (scroll[activeStory] = value)}\n >\n {story}\n </ScrollSaver>\n {tabbar}\n </div>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,WAAW,QAAQ,eAAe;AAQ3C,IAAMC,IAAI,GAAGF,QAAQ,CAAC,MAAM,CAAC;;AAE7B;AACA;AACA;AACA,OAAO,IAAMG,IAAI,GAAG,SAAPA,IAAI,CAAIC,KAAgB,EAAK;EAAA;EACxC,IAAMC,MAAM,GAAGR,KAAK,CAACS,MAAM,CAA4B,CAAC,CAAC,CAAC,CAACC,OAAO;EAClE,IAAQC,WAAW,GAAgDJ,KAAK,CAAhEI,WAAW;IAAEC,MAAM,GAAwCL,KAAK,CAAnDK,MAAM;IAAEC,QAAQ,GAA8BN,KAAK,CAA3CM,QAAQ;IAAEC,SAAS,GAAmBP,KAAK,CAAjCO,SAAS;IAAKC,SAAS,4BAAKR,KAAK;EAExE,IAAMS,KAAK,WACRhB,KAAK,CAACiB,QAAQ,CAACC,OAAO,CAACL,QAAQ,CAAC,CAACM,IAAI,CACpC,UAACH,KAAK;IAAA,OAAK,aAAAhB,KAAK,CAACoB,cAAc,CAACJ,KAAK,CAAC,IAAId,QAAQ,CAACc,KAAK,CAACT,KAAK,EAAEF,IAAI,CAAC,KAAKM,WAAW;EAAA,EACtF,uCAAuC,IAAI;EAE9C,oBACE,wCACMI,SAAS;IACb,SAAS,EAAEd,UAAU,aAAiBW,MAAM,yBAA6B,EAAEE,SAAS;EAAE,iBAEtF,oBAAC,WAAW;IACV,GAAG,EAAEH,WAAY;IACjB,aAAa,EAAEH,MAAM,CAACG,WAAW,CAAC,IAAI,CAAE;IACxC,UAAU,EAAE,oBAACU,KAAK;MAAA,OAAMb,MAAM,CAACG,WAAW,CAAC,GAAGU,KAAK;IAAA;EAAE,GAEpDL,KAAK,CACM,EACbJ,MAAM,CACH;AAEV,CAAC"}

package/dist/components/Epic/ScrollSaver.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { ScrollContext } from '../AppRoot/ScrollContext';
 import { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';
+import { ScrollContext } from '../AppRoot/ScrollContext';
 /**
  * @see https://vkcom.github.io/VKUI/#/ScrollSaver
  */

package/dist/components/Epic/ScrollSaver.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ScrollSaver.js","names":["React","~~ScrollContext~~","~~useIsomorphicLayoutEffect~~","ScrollSaver","children","initialScroll","saveScroll","useContext","getScroll","scrollTo","y"],"sources":["../../../src/components/Epic/ScrollSaver.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ~~ScrollContext~~ } from '~~../AppRoot~~/~~ScrollContext~~';\nimport { ~~useIsomorphicLayoutEffect~~ } from '~~../../lib~~/~~useIsomorphicLayoutEffect~~';\n\nexport interface ScrollSaverProps {\n initialScroll?: number;\n saveScroll: (this: void, scroll: number) => any;\n children?: React.ReactNode;\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/ScrollSaver\n */\nexport const ScrollSaver = ({ children, initialScroll, saveScroll }: ScrollSaverProps) => {\n const { getScroll, scrollTo } = React.useContext(ScrollContext);\n useIsomorphicLayoutEffect(() => {\n if (typeof initialScroll === 'number') {\n scrollTo(0, initialScroll);\n }\n return () => saveScroll(getScroll().y);\n }, []);\n return <React.Fragment>{children}</React.Fragment>;\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,~~aAAa~~,QAAQ,~~0BAA0B~~;~~AACxD~~,SAASC,~~yBAAyB~~,QAAQ,~~qCAAqC~~;~~AAQ/E~~;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAAkE;EAAA,IAA5DC,QAAQ,QAARA,QAAQ;IAAEC,aAAa,QAAbA,aAAa;IAAEC,UAAU,QAAVA,UAAU;EAC/D,wBAAgCN,KAAK,CAACO,UAAU,~~CAACN~~,aAAa,CAAC;~~IAAvDO~~,SAAS,qBAATA,SAAS;IAAEC,QAAQ,qBAARA,QAAQ;~~EAC3BP~~,yBAAyB,CAAC,YAAM;IAC9B,IAAI,~~OAAOG~~,aAAa,KAAK,QAAQ,EAAE;MACrCI,QAAQ,CAAC,CAAC,EAAEJ,aAAa,CAAC;IAC5B;IACA,OAAO;MAAA,OAAMC,UAAU,CAACE,SAAS,EAAE,CAACE,CAAC,CAAC;IAAA;EACxC,CAAC,EAAE,EAAE,CAAC;EACN,oBAAO,oBAAC,KAAK,CAAC,QAAQ,QAAEN,QAAQ,CAAkB;AACpD,CAAC"}
1	+ {"version":3,"file":"ScrollSaver.js","names":["React","useIsomorphicLayoutEffect","ScrollContext","ScrollSaver","children","initialScroll","saveScroll","useContext","getScroll","scrollTo","y"],"sources":["../../../src/components/Epic/ScrollSaver.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\n\nexport interface ScrollSaverProps {\n initialScroll?: number;\n saveScroll: (this: void, scroll: number) => any;\n children?: React.ReactNode;\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/ScrollSaver\n */\nexport const ScrollSaver = ({ children, initialScroll, saveScroll }: ScrollSaverProps) => {\n const { getScroll, scrollTo } = React.useContext(ScrollContext);\n useIsomorphicLayoutEffect(() => {\n if (typeof initialScroll === 'number') {\n scrollTo(0, initialScroll);\n }\n return () => saveScroll(getScroll().y);\n }, []);\n return <React.Fragment>{children}</React.Fragment>;\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,yBAAyB,QAAQ,qCAAqC;AAC/E,SAASC,aAAa,QAAQ,0BAA0B;AAQxD;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAAkE;EAAA,IAA5DC,QAAQ,QAARA,QAAQ;IAAEC,aAAa,QAAbA,aAAa;IAAEC,UAAU,QAAVA,UAAU;EAC/D,wBAAgCN,KAAK,CAACO,UAAU,CAACL,aAAa,CAAC;IAAvDM,SAAS,qBAATA,SAAS;IAAEC,QAAQ,qBAARA,QAAQ;EAC3BR,yBAAyB,CAAC,YAAM;IAC9B,IAAI,OAAOI,aAAa,KAAK,QAAQ,EAAE;MACrCI,QAAQ,CAAC,CAAC,EAAEJ,aAAa,CAAC;IAC5B;IACA,OAAO;MAAA,OAAMC,UAAU,CAACE,SAAS,EAAE,CAACE,CAAC,CAAC;IAAA;EACxC,CAAC,EAAE,EAAE,CAAC;EACN,oBAAO,oBAAC,KAAK,CAAC,QAAQ,QAAEN,QAAQ,CAAkB;AACpD,CAAC"}

package/dist/components/File/File.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { VKUIButtonProps } from '../Button/Button';
 import { HasRef, HasRootRef } from '../../types';
+import { VKUIButtonProps } from '../Button/Button';
 export interface FileProps extends Omit<VKUIButtonProps, 'type'>, Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'>, HasRef<HTMLInputElement>, HasRootRef<HTMLElement> {
 }
 /**

package/dist/components/File/File.js CHANGED Viewed

@@ -2,11 +2,11 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "align", "size", "mode", "stretched", "before", "after", "loading", "className", "style", "getRef", "getRootRef", "appearance"];
 import * as React from 'react';
+import { classNames } from '@vkontakte/vkjs';
 import { getPlatformClassName } from '../../helpers/getPlatformClassName';
-import { Button } from '../Button/Button';
 import { usePlatform } from '../../hooks/usePlatform';
+import { Button } from '../Button/Button';
 import { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';
-import { classNames } from '@vkontakte/vkjs';
 /**
  * @see https://vkcom.github.io/VKUI/#/File
  */

package/dist/components/File/File.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"File.js","names":["React","~~getPlatformClassName~~","~~Button~~","usePlatform","~~VisuallyHiddenInput~~","~~classNames~~","File","children","align","size","mode","stretched","before","after","loading","className","style","getRef","getRootRef","appearance","restProps","platform","disabled"],"sources":["../../../src/components/File/File.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ~~getPlatformClassName~~ } from '~~../../helpers~~/~~getPlatformClassName~~';\nimport { ~~Button,~~ ~~VKUIButtonProps~~ } from '~~../Button~~/~~Button~~';\nimport { ~~HasRef,~~ ~~HasRootRef~~ } from '../../~~types~~';\nimport { ~~usePlatform~~ } from '../../~~hooks/usePlatform~~';\nimport { ~~VisuallyHiddenInput~~ } from '../~~VisuallyHiddenInput~~/~~VisuallyHiddenInput~~';\nimport { ~~classNames~~ } from '~~@vkontakte~~/~~vkjs~~';\nimport styles from './File.module.css';\n\nexport interface FileProps\n extends Omit<VKUIButtonProps, 'type'>,\n Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' \| 'size'>,\n HasRef<HTMLInputElement>,\n HasRootRef<HTMLElement> {}\n\n/*\n @see https://vkcom.github.io/VKUI/#/File\n */\nexport const File = ({\n children = 'Выберите файл',\n align = 'left',\n size,\n mode,\n stretched,\n before,\n after,\n loading,\n className,\n style,\n getRef,\n getRootRef,\n appearance,\n ...restProps\n}: FileProps) => {\n const platform = usePlatform();\n\n return (\n <Button\n Component=\"label\"\n align={align}\n className={classNames(\n styles['File'],\n getPlatformClassName(styles['File'], platform),\n className,\n )}\n stretched={stretched}\n mode={mode}\n appearance={appearance}\n size={size}\n before={before}\n after={after}\n loading={loading}\n style={style}\n getRootRef={getRootRef}\n disabled={restProps.disabled}\n >\n <VisuallyHiddenInput\n {...restProps}\n className={styles['File__input']}\n type=\"file\"\n getRef={getRef}\n />\n {children}\n </Button>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,~~oBAAoB~~,QAAQ,~~oCAAoC~~;~~AACzE~~,SAASC,~~MAAM~~,~~QAAyB~~,~~kBAAkB~~;~~AAE1D~~,SAASC,WAAW,QAAQ,yBAAyB;~~AACrD~~,SAASC,~~mBAAmB~~,~~QAAQ~~,~~4CAA4C~~;~~AAChF~~,SAASC,~~UAAU~~,QAAQ,~~iBAAiB~~;~~AAS5C~~;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAG,SAAPA,IAAI,OAeA;EAAA,yBAdfC,QAAQ;IAARA,QAAQ,8BAAG,eAAe;IAAA,kBAC1BC,KAAK;IAALA,KAAK,2BAAG,MAAM;IACdC,IAAI,QAAJA,IAAI;IACJC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,UAAU,QAAVA,UAAU;IACVC,UAAU,QAAVA,UAAU;IACPC,SAAS;EAEZ,IAAMC,QAAQ,GAAGlB,WAAW,EAAE;EAE9B,oBACE,oBAAC,MAAM;IACL,SAAS,EAAC,OAAO;IACjB,KAAK,EAAEK,KAAM;IACb,SAAS,~~EAAEH~~,UAAU,~~aAEnBJ~~,oBAAoB,~~aAAiBoB~~,QAAQ,CAAC,EAC9CN,SAAS,CACT;IACF,SAAS,EAAEJ,SAAU;IACrB,IAAI,EAAED,IAAK;IACX,UAAU,EAAES,UAAW;IACvB,IAAI,EAAEV,IAAK;IACX,MAAM,EAAEG,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,OAAO,EAAEC,OAAQ;IACjB,KAAK,EAAEE,KAAM;IACb,UAAU,EAAEE,UAAW;IACvB,QAAQ,EAAEE,SAAS,CAACE;EAAS,gBAE7B,oBAAC,mBAAmB,eACdF,SAAS;IACb,SAAS,mBAAwB;IACjC,IAAI,EAAC,MAAM;IACX,MAAM,EAAEH;EAAO,GACf,EACDV,QAAQ,CACF;AAEb,CAAC"}
1	+ {"version":3,"file":"File.js","names":["React","classNames","getPlatformClassName","usePlatform","Button","VisuallyHiddenInput","File","children","align","size","mode","stretched","before","after","loading","className","style","getRef","getRootRef","appearance","restProps","platform","disabled"],"sources":["../../../src/components/File/File.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getPlatformClassName } from '../../helpers/getPlatformClassName';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { Button, VKUIButtonProps } from '../Button/Button';\nimport { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';\nimport styles from './File.module.css';\n\nexport interface FileProps\n extends Omit<VKUIButtonProps, 'type'>,\n Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' \| 'size'>,\n HasRef<HTMLInputElement>,\n HasRootRef<HTMLElement> {}\n\n/*\n @see https://vkcom.github.io/VKUI/#/File\n */\nexport const File = ({\n children = 'Выберите файл',\n align = 'left',\n size,\n mode,\n stretched,\n before,\n after,\n loading,\n className,\n style,\n getRef,\n getRootRef,\n appearance,\n ...restProps\n}: FileProps) => {\n const platform = usePlatform();\n\n return (\n <Button\n Component=\"label\"\n align={align}\n className={classNames(\n styles['File'],\n getPlatformClassName(styles['File'], platform),\n className,\n )}\n stretched={stretched}\n mode={mode}\n appearance={appearance}\n size={size}\n before={before}\n after={after}\n loading={loading}\n style={style}\n getRootRef={getRootRef}\n disabled={restProps.disabled}\n >\n <VisuallyHiddenInput\n {...restProps}\n className={styles['File__input']}\n type=\"file\"\n getRef={getRef}\n />\n {children}\n </Button>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,oBAAoB,QAAQ,oCAAoC;AACzE,SAASC,WAAW,QAAQ,yBAAyB;AAErD,SAASC,MAAM,QAAyB,kBAAkB;AAC1D,SAASC,mBAAmB,QAAQ,4CAA4C;AAShF;AACA;AACA;AACA,OAAO,IAAMC,IAAI,GAAG,SAAPA,IAAI,OAeA;EAAA,yBAdfC,QAAQ;IAARA,QAAQ,8BAAG,eAAe;IAAA,kBAC1BC,KAAK;IAALA,KAAK,2BAAG,MAAM;IACdC,IAAI,QAAJA,IAAI;IACJC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,UAAU,QAAVA,UAAU;IACVC,UAAU,QAAVA,UAAU;IACPC,SAAS;EAEZ,IAAMC,QAAQ,GAAGlB,WAAW,EAAE;EAE9B,oBACE,oBAAC,MAAM;IACL,SAAS,EAAC,OAAO;IACjB,KAAK,EAAEK,KAAM;IACb,SAAS,EAAEP,UAAU,aAEnBC,oBAAoB,aAAiBmB,QAAQ,CAAC,EAC9CN,SAAS,CACT;IACF,SAAS,EAAEJ,SAAU;IACrB,IAAI,EAAED,IAAK;IACX,UAAU,EAAES,UAAW;IACvB,IAAI,EAAEV,IAAK;IACX,MAAM,EAAEG,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,OAAO,EAAEC,OAAQ;IACjB,KAAK,EAAEE,KAAM;IACb,UAAU,EAAEE,UAAW;IACvB,QAAQ,EAAEE,SAAS,CAACE;EAAS,gBAE7B,oBAAC,mBAAmB,eACdF,SAAS;IACb,SAAS,mBAAwB;IACjC,IAAI,EAAC,MAAM;IACX,MAAM,EAAEH;EAAO,GACf,EACDV,QAAQ,CACF;AAEb,CAAC"}

package/dist/components/FixedLayout/FixedLayout.js CHANGED Viewed

@@ -4,14 +4,14 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "style", "vertical", "getRootRef", "getRef", "filled", "className"];
 import * as React from 'react';
-import { Platform } from '../../lib/platform';
 import { classNames } from '@vkontakte/vkjs';
-import { SplitColContext } from '../SplitCol/SplitColContext';
-import { TooltipContainer } from '../Tooltip/TooltipContainer';
-import { useDOM } from '../../lib/dom';
+import { useExternRef } from '../../hooks/useExternRef';
 import { useGlobalEventListener } from '../../hooks/useGlobalEventListener';
 import { usePlatform } from '../../hooks/usePlatform';
-import { useExternRef } from '../../hooks/useExternRef';
+import { useDOM } from '../../lib/dom';
+import { Platform } from '../../lib/platform';
+import { SplitColContext } from '../SplitCol/SplitColContext';
+import { TooltipContainer } from '../Tooltip/TooltipContainer';
 /**
  * @see https://vkcom.github.io/VKUI/#/FixedLayout
  */

package/dist/components/FixedLayout/FixedLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FixedLayout.js","names":["React","~~Platform~~","~~classNames~~","~~SplitColContext~~","~~TooltipContainer~~","useDOM","~~useGlobalEventListener~~","~~usePlatform~~","~~useExternRef~~","FixedLayout","children","style","vertical","getRootRef","getRef","filled","className","restProps","platform","ref","useState","undefined","width","setWidth","window","useContext","colRef","doResize","current","computedStyle","getComputedStyle","clientWidth","parseFloat","paddingLeft","paddingRight","useEffect","IOS","styles"],"sources":["../../../src/components/FixedLayout/FixedLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ~~Platform~~ } from '~~../../lib~~/~~platform~~';\nimport { ~~classNames~~ } from '~~@vkontakte~~/~~vkjs~~';\nimport { ~~HasRef,~~ ~~HasRootRef~~ } from '../../~~types~~';\nimport { ~~SplitColContext~~ } from '~~../SplitCol~~/~~SplitColContext~~';\nimport { ~~TooltipContainer~~ } from '~~../Tooltip~~/~~TooltipContainer~~';\nimport { ~~useDOM~~ } from '../../lib/~~dom~~';\nimport { ~~useGlobalEventListener~~ } from '../../~~hooks/useGlobalEventListener~~';\nimport { ~~usePlatform~~ } from '~~../../hooks~~/~~usePlatform~~';\nimport { ~~useExternRef~~ } from '~~../../hooks~~/~~useExternRef~~';\nimport styles from './FixedLayout.module.css';\n\nexport interface FixedLayoutProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement>,\n HasRef<HTMLDivElement> {\n vertical?: 'top' \| 'bottom';\n /*\n Это свойство определяет, будет ли фон компонента окрашен в цвет фона контента.\n * Это часто необходимо для фиксированных кнопок в нижней части экрана.\n /\n filled?: boolean;\n}\n\nexport interface FixedLayoutState {\n position: 'absolute' \| null;\n top: number;\n bottom: number;\n width: string;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/FixedLayout\n */\nexport const FixedLayout = ({\n children,\n style,\n vertical,\n getRootRef,\n getRef,\n filled,\n className,\n ...restProps\n}: FixedLayoutProps) => {\n const platform = usePlatform();\n const ref = useExternRef(getRootRef, getRef); // TODO: v6 удалить getRef\n const [width, setWidth] = React.useState<string \| undefined>(undefined);\n const { window } = useDOM();\n const { colRef } = React.useContext(SplitColContext);\n const doResize = () => {\n if (colRef?.current) {\n const computedStyle = getComputedStyle(colRef.current);\n\n setWidth(\n `${\n colRef.current.clientWidth -\n parseFloat(computedStyle.paddingLeft) -\n parseFloat(computedStyle.paddingRight)\n }px`,\n );\n } else {\n setWidth(undefined);\n }\n };\n React.useEffect(doResize, [colRef, platform]);\n useGlobalEventListener(window, 'resize', doResize);\n\n return (\n <TooltipContainer\n {...restProps}\n fixed\n ref={ref}\n className={classNames(\n styles['FixedLayout'],\n platform === Platform.IOS && styles['FixedLayout--ios'],\n filled && styles['FixedLayout--filled'],\n vertical && styles[`FixedLayout--vertical-${vertical}`],\n className,\n )}\n style={{ ...style, width }}\n >\n {children}\n </TooltipContainer>\n );\n};\n"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,~~QAAQ~~,QAAQ,~~oBAAoB~~;~~AAC7C~~,SAASC,~~UAAU~~,QAAQ,~~iBAAiB~~;~~AAE5C~~,SAASC,~~eAAe~~,QAAQ,~~6BAA6B~~;~~AAC7D~~,SAASC,~~gBAAgB~~,QAAQ,~~6BAA6B~~;~~AAC9D~~,SAASC,MAAM,QAAQ,eAAe;AACtC,SAASC,~~sBAAsB~~,QAAQ,~~oCAAoC~~;~~AAC3E~~,SAASC,~~WAAW~~,QAAQ,~~yBAAyB~~;~~AACrD~~,SAASC,~~YAAY~~,QAAQ,~~0BAA0B~~;~~AAsBvD~~;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OASA;EAAA,IARtBC,QAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,MAAM,QAANA,MAAM;IACNC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,~~GAAGX~~,WAAW,EAAE;EAC9B,~~IAAMY~~,GAAG,~~GAAGX~~,YAAY,~~CAACK~~,UAAU,EAAEC,MAAM,CAAC,CAAC,CAAC;EAC9C,sBAA0Bd,KAAK,CAACoB,QAAQ,CAAqBC,SAAS,CAAC;IAAA;IAAhEC,KAAK;IAAEC,QAAQ;EACtB,cAAmBlB,MAAM,EAAE;IAAnBmB,MAAM,WAANA,MAAM;EACd,wBAAmBxB,KAAK,CAACyB,UAAU,~~CAACtB~~,eAAe,CAAC;~~IAA5CuB~~,MAAM,qBAANA,MAAM;EACd,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,GAAS;IACrB,IAAID,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEE,OAAO,EAAE;MACnB,IAAMC,aAAa,GAAGC,gBAAgB,CAACJ,MAAM,CAACE,OAAO,CAAC;MAEtDL,QAAQ,WAEJG,MAAM,CAACE,OAAO,CAACG,WAAW,GAC1BC,UAAU,CAACH,aAAa,CAACI,WAAW,CAAC,GACrCD,UAAU,CAACH,aAAa,CAACK,YAAY,CAAC,QAEzC;IACH,CAAC,MAAM;MACLX,QAAQ,CAACF,SAAS,CAAC;IACrB;EACF,CAAC;EACDrB,KAAK,CAACmC,SAAS,CAACR,QAAQ,EAAE,CAACD,MAAM,EAAER,QAAQ,CAAC,CAAC;~~EAC7CZ~~,sBAAsB,~~CAACkB~~,MAAM,EAAE,QAAQ,EAAEG,QAAQ,CAAC;EAElD,oBACE,oBAAC,gBAAgB,eACXV,SAAS;IACb,KAAK;IACL,GAAG,EAAEE,GAAI;IACT,SAAS,~~EAAEjB~~,UAAU,~~oBAEnBgB~~,QAAQ,~~KAAKjB~~,QAAQ,~~CAACmC~~,GAAG,0BAA8B,EACvDrB,MAAM,6BAAiC,EACvCH,QAAQ,IAAIyB,MAAM,iCAA0BzB,QAAQ,EAAG,EACvDI,SAAS,CACT;IACF,KAAK,kCAAOL,KAAK;MAAEW,KAAK,EAALA;IAAK;EAAG,IAE1BZ,QAAQ,CACQ;AAEvB,CAAC;AAAC;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"FixedLayout.js","names":["React","classNames","useExternRef","useGlobalEventListener","usePlatform","useDOM","Platform","SplitColContext","TooltipContainer","FixedLayout","children","style","vertical","getRootRef","getRef","filled","className","restProps","platform","ref","useState","undefined","width","setWidth","window","useContext","colRef","doResize","current","computedStyle","getComputedStyle","clientWidth","parseFloat","paddingLeft","paddingRight","useEffect","IOS","styles"],"sources":["../../../src/components/FixedLayout/FixedLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { SplitColContext } from '../SplitCol/SplitColContext';\nimport { TooltipContainer } from '../Tooltip/TooltipContainer';\nimport styles from './FixedLayout.module.css';\n\nexport interface FixedLayoutProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement>,\n HasRef<HTMLDivElement> {\n vertical?: 'top' \| 'bottom';\n /*\n Это свойство определяет, будет ли фон компонента окрашен в цвет фона контента.\n * Это часто необходимо для фиксированных кнопок в нижней части экрана.\n /\n filled?: boolean;\n}\n\nexport interface FixedLayoutState {\n position: 'absolute' \| null;\n top: number;\n bottom: number;\n width: string;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/FixedLayout\n */\nexport const FixedLayout = ({\n children,\n style,\n vertical,\n getRootRef,\n getRef,\n filled,\n className,\n ...restProps\n}: FixedLayoutProps) => {\n const platform = usePlatform();\n const ref = useExternRef(getRootRef, getRef); // TODO: v6 удалить getRef\n const [width, setWidth] = React.useState<string \| undefined>(undefined);\n const { window } = useDOM();\n const { colRef } = React.useContext(SplitColContext);\n const doResize = () => {\n if (colRef?.current) {\n const computedStyle = getComputedStyle(colRef.current);\n\n setWidth(\n `${\n colRef.current.clientWidth -\n parseFloat(computedStyle.paddingLeft) -\n parseFloat(computedStyle.paddingRight)\n }px`,\n );\n } else {\n setWidth(undefined);\n }\n };\n React.useEffect(doResize, [colRef, platform]);\n useGlobalEventListener(window, 'resize', doResize);\n\n return (\n <TooltipContainer\n {...restProps}\n fixed\n ref={ref}\n className={classNames(\n styles['FixedLayout'],\n platform === Platform.IOS && styles['FixedLayout--ios'],\n filled && styles['FixedLayout--filled'],\n vertical && styles[`FixedLayout--vertical-${vertical}`],\n className,\n )}\n style={{ ...style, width }}\n >\n {children}\n </TooltipContainer>\n );\n};\n"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,sBAAsB,QAAQ,oCAAoC;AAC3E,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,MAAM,QAAQ,eAAe;AACtC,SAASC,QAAQ,QAAQ,oBAAoB;AAE7C,SAASC,eAAe,QAAQ,6BAA6B;AAC7D,SAASC,gBAAgB,QAAQ,6BAA6B;AAsB9D;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OASA;EAAA,IARtBC,QAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,MAAM,QAANA,MAAM;IACNC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAGd,WAAW,EAAE;EAC9B,IAAMe,GAAG,GAAGjB,YAAY,CAACW,UAAU,EAAEC,MAAM,CAAC,CAAC,CAAC;EAC9C,sBAA0Bd,KAAK,CAACoB,QAAQ,CAAqBC,SAAS,CAAC;IAAA;IAAhEC,KAAK;IAAEC,QAAQ;EACtB,cAAmBlB,MAAM,EAAE;IAAnBmB,MAAM,WAANA,MAAM;EACd,wBAAmBxB,KAAK,CAACyB,UAAU,CAAClB,eAAe,CAAC;IAA5CmB,MAAM,qBAANA,MAAM;EACd,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,GAAS;IACrB,IAAID,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEE,OAAO,EAAE;MACnB,IAAMC,aAAa,GAAGC,gBAAgB,CAACJ,MAAM,CAACE,OAAO,CAAC;MAEtDL,QAAQ,WAEJG,MAAM,CAACE,OAAO,CAACG,WAAW,GAC1BC,UAAU,CAACH,aAAa,CAACI,WAAW,CAAC,GACrCD,UAAU,CAACH,aAAa,CAACK,YAAY,CAAC,QAEzC;IACH,CAAC,MAAM;MACLX,QAAQ,CAACF,SAAS,CAAC;IACrB;EACF,CAAC;EACDrB,KAAK,CAACmC,SAAS,CAACR,QAAQ,EAAE,CAACD,MAAM,EAAER,QAAQ,CAAC,CAAC;EAC7Cf,sBAAsB,CAACqB,MAAM,EAAE,QAAQ,EAAEG,QAAQ,CAAC;EAElD,oBACE,oBAAC,gBAAgB,eACXV,SAAS;IACb,KAAK;IACL,GAAG,EAAEE,GAAI;IACT,SAAS,EAAElB,UAAU,oBAEnBiB,QAAQ,KAAKZ,QAAQ,CAAC8B,GAAG,0BAA8B,EACvDrB,MAAM,6BAAiC,EACvCH,QAAQ,IAAIyB,MAAM,iCAA0BzB,QAAQ,EAAG,EACvDI,SAAS,CACT;IACF,KAAK,kCAAOL,KAAK;MAAEW,KAAK,EAALA;IAAK;EAAG,IAE1BZ,QAAQ,CACQ;AAEvB,CAAC;AAAC;EAAA;EAAA;AAAA"}

package/dist/components/FormField/FormField.js CHANGED Viewed

@@ -1,11 +1,15 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["Component", "status", "children", "getRootRef", "before", "after", "disabled", "mode", "className"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
-import { getSizeYClassName } from '../../helpers/getSizeYClassName';
+import { SizeType } from '../../lib/adaptivity';
+var sizeYClassNames = _defineProperty({
+  none: "vkuiFormField--sizeY-none"
+}, SizeType.COMPACT, "vkuiFormField--sizeY-compact");
 /**
  * @see https://vkcom.github.io/VKUI/#/FormField
  */
@@ -24,7 +28,8 @@ export var FormField = function FormField(_ref) {
     className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded);
   var _useAdaptivity = useAdaptivity(),
-    sizeY = _useAdaptivity.sizeY;
+    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
+    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
   var _React$useState = React.useState(false),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     hover = _React$useState2[0],
@@ -41,7 +46,7 @@ export var FormField = function FormField(_ref) {
     ref: getRootRef,
     onMouseEnter: handleMouseEnter,
     onMouseLeave: handleMouseLeave,
-    className: classNames("vkuiFormField", styles["FormField--mode-".concat(mode)], styles["FormField--status-".concat(status)], getSizeYClassName("vkuiFormField", sizeY), disabled && "vkuiFormField--disabled", !disabled && hover && "vkuiFormField--hover", className)
+    className: classNames("vkuiFormField", styles["FormField--mode-".concat(mode)], styles["FormField--status-".concat(status)], sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], disabled && "vkuiFormField--disabled", !disabled && hover && "vkuiFormField--hover", className)
   }), before && /*#__PURE__*/React.createElement("span", {
     className: "vkuiFormField__before"
   }, before), children, after && /*#__PURE__*/React.createElement("span", {

package/dist/components/FormField/FormField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormField.js","names":["React","classNames","useAdaptivity","~~getSizeYClassName~~","FormField","Component","status","children","getRootRef","before","after","disabled","mode","className","restProps","sizeY","useState","hover","setHover","handleMouseEnter","e","stopPropagation","handleMouseLeave","styles"],"sources":["../../../src/components/FormField/FormField.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ~~HasComponent,~~ ~~HasRootRef~~ } from '../../~~types~~';\nimport { ~~useAdaptivity~~ } from '../../~~hooks~~/~~useAdaptivity~~';\nimport { ~~getSizeYClassName~~ } from '../../~~helpers/getSizeYClassName~~';\nimport styles from './FormField.module.css';\n\nexport interface FormFieldProps {\n status?: 'default' \| 'error' \| 'valid';\n /*\n Добавляет иконку слева.\n \n Рекомендации:\n \n - Используйте следующие размеры иконок `12` \| `16` \| `20` \| `24` \| `28`.\n * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n /\n before?: React.ReactNode;\n /\n Добавляет иконку справа.\n \n Рекомендации:\n \n - Используйте следующие размеры иконок `12` \| `16` \| `20` \| `24` \| `28`.\n * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n /\n after?: React.ReactNode;\n mode?: 'default' \| 'plain';\n}\n\ninterface FormFieldOwnProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent,\n FormFieldProps {\n disabled?: boolean;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/FormField\n */\nexport const FormField = ({\n Component = 'span',\n status = 'default',\n children,\n getRootRef,\n before,\n after,\n disabled,\n mode = 'default',\n className,\n ...restProps\n}: FormFieldOwnProps) => {\n const { sizeY } = useAdaptivity();\n const [hover, setHover] = React.useState(false);\n\n const handleMouseEnter = (e: MouseEvent) => {\n e.stopPropagation();\n setHover(true);\n };\n\n const handleMouseLeave = (e: MouseEvent) => {\n e.stopPropagation();\n setHover(false);\n };\n\n return (\n <Component\n {...restProps}\n ref={getRootRef}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n className={classNames(\n styles['FormField'],\n styles[`FormField--mode-${mode}`],\n styles[`FormField--status-${status}`],\n ~~getSizeYClassName(styles~~[~~'FormField'~~]~~, sizeY)~~,\n disabled && styles['FormField--disabled'],\n !disabled && hover && styles['FormField--hover'],\n className,\n )}\n >\n {before && <span className={styles['FormField__before']}>{before}</span>}\n {children}\n {after && <span className={styles['FormField__after']}>{after}</span>}\n <span aria-hidden className={styles['FormField__border']} />\n </Component>\n );\n};\n"],"mappings":"~~;;;;~~AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;~~AAE5C~~,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,~~iBAAiB~~,QAAQ,~~iCAAiC~~;~~AAkCnE~~;AACA;AACA;AACA,OAAO,IAAMC,SAAS,GAAG,SAAZA,SAAS,OAWG;EAAA,0BAVvBC,SAAS;IAATA,SAAS,+BAAG,MAAM;IAAA,mBAClBC,MAAM;IAANA,MAAM,4BAAG,SAAS;IAClBC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAG,SAAS;IAChBC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,~~qBAAkBZ~~,aAAa,EAAE;~~IAAzBa~~,KAAK,~~kBAALA~~,~~KAAK~~;~~EACb~~,~~sBAA0Bf~~,KAAK,~~CAACgB~~,QAAQ,CAAC,KAAK,CAAC;IAAA;IAAxCC,KAAK;IAAEC,QAAQ;EAEtB,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIC,CAAa,EAAK;IAC1CA,CAAC,CAACC,eAAe,EAAE;IACnBH,QAAQ,CAAC,IAAI,CAAC;EAChB,CAAC;EAED,IAAMI,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIF,CAAa,EAAK;IAC1CA,CAAC,CAACC,eAAe,EAAE;IACnBH,QAAQ,CAAC,KAAK,CAAC;EACjB,CAAC;EAED,oBACE,oBAAC,SAAS,eACJJ,SAAS;IACb,GAAG,EAAEN,UAAW;IAChB,YAAY,EAAEW,gBAAiB;IAC/B,YAAY,EAAEG,gBAAiB;IAC/B,SAAS,~~EAAErB~~,UAAU,~~kBAEnBsB~~,MAAM,2BAAoBX,IAAI,EAAG,EACjCW,MAAM,6BAAsBjB,MAAM,EAAG,~~EACrCH~~,~~iBAAiB~~,~~kBAAsBY~~,KAAK,CAAC,~~EAC7CJ~~,QAAQ,6BAAiC,EACzC,CAACA,QAAQ,IAAIM,KAAK,0BAA8B,EAChDJ,SAAS;EACT,IAEDJ,MAAM,iBAAI;IAAM,SAAS;EAA8B,GAAEA,MAAM,CAAQ,EACvEF,QAAQ,EACRG,KAAK,iBAAI;IAAM,SAAS;EAA6B,GAAEA,KAAK,CAAQ,eACrE;IAAM,mBAAW;IAAC,SAAS;EAA8B,EAAG,CAClD;AAEhB,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"FormField.js","names":["React","classNames","useAdaptivity","SizeType","sizeYClassNames","none","COMPACT","FormField","Component","status","children","getRootRef","before","after","disabled","mode","className","restProps","sizeY","useState","hover","setHover","handleMouseEnter","e","stopPropagation","handleMouseLeave","styles","REGULAR"],"sources":["../../../src/components/FormField/FormField.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\nimport styles from './FormField.module.css';\n\nconst sizeYClassNames = {\n none: styles['FormField--sizeY-none'],\n [SizeType.COMPACT]: styles['FormField--sizeY-compact'],\n};\n\nexport interface FormFieldProps {\n status?: 'default' \| 'error' \| 'valid';\n /*\n Добавляет иконку слева.\n \n Рекомендации:\n \n - Используйте следующие размеры иконок `12` \| `16` \| `20` \| `24` \| `28`.\n * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n /\n before?: React.ReactNode;\n /\n Добавляет иконку справа.\n \n Рекомендации:\n \n - Используйте следующие размеры иконок `12` \| `16` \| `20` \| `24` \| `28`.\n * - Используйте [IconButton](https://vkcom.github.io/VKUI/#/IconButton), если вам нужна кликабельная иконка.\n /\n after?: React.ReactNode;\n mode?: 'default' \| 'plain';\n}\n\ninterface FormFieldOwnProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent,\n FormFieldProps {\n disabled?: boolean;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/FormField\n */\nexport const FormField = ({\n Component = 'span',\n status = 'default',\n children,\n getRootRef,\n before,\n after,\n disabled,\n mode = 'default',\n className,\n ...restProps\n}: FormFieldOwnProps) => {\n const { sizeY = 'none' } = useAdaptivity();\n const [hover, setHover] = React.useState(false);\n\n const handleMouseEnter = (e: MouseEvent) => {\n e.stopPropagation();\n setHover(true);\n };\n\n const handleMouseLeave = (e: MouseEvent) => {\n e.stopPropagation();\n setHover(false);\n };\n\n return (\n <Component\n {...restProps}\n ref={getRootRef}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n className={classNames(\n styles['FormField'],\n styles[`FormField--mode-${mode}`],\n styles[`FormField--status-${status}`],\n sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n disabled && styles['FormField--disabled'],\n !disabled && hover && styles['FormField--hover'],\n className,\n )}\n >\n {before && <span className={styles['FormField__before']}>{before}</span>}\n {children}\n {after && <span className={styles['FormField__after']}>{after}</span>}\n <span aria-hidden className={styles['FormField__border']} />\n </Component>\n );\n};\n"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,QAAQ,QAAQ,sBAAsB;AAI/C,IAAMC,eAAe;EACnBC,IAAI;AAAiC,GACpCF,QAAQ,CAACG,OAAO,iCAClB;AAiCD;AACA;AACA;AACA,OAAO,IAAMC,SAAS,GAAG,SAAZA,SAAS,OAWG;EAAA,0BAVvBC,SAAS;IAATA,SAAS,+BAAG,MAAM;IAAA,mBAClBC,MAAM;IAANA,MAAM,4BAAG,SAAS;IAClBC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAG,SAAS;IAChBC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,qBAA2Bf,aAAa,EAAE;IAAA,sCAAlCgB,KAAK;IAALA,KAAK,qCAAG,MAAM;EACtB,sBAA0BlB,KAAK,CAACmB,QAAQ,CAAC,KAAK,CAAC;IAAA;IAAxCC,KAAK;IAAEC,QAAQ;EAEtB,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIC,CAAa,EAAK;IAC1CA,CAAC,CAACC,eAAe,EAAE;IACnBH,QAAQ,CAAC,IAAI,CAAC;EAChB,CAAC;EAED,IAAMI,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIF,CAAa,EAAK;IAC1CA,CAAC,CAACC,eAAe,EAAE;IACnBH,QAAQ,CAAC,KAAK,CAAC;EACjB,CAAC;EAED,oBACE,oBAAC,SAAS,eACJJ,SAAS;IACb,GAAG,EAAEN,UAAW;IAChB,YAAY,EAAEW,gBAAiB;IAC/B,YAAY,EAAEG,gBAAiB;IAC/B,SAAS,EAAExB,UAAU,kBAEnByB,MAAM,2BAAoBX,IAAI,EAAG,EACjCW,MAAM,6BAAsBjB,MAAM,EAAG,EACrCS,KAAK,KAAKf,QAAQ,CAACwB,OAAO,IAAIvB,eAAe,CAACc,KAAK,CAAC,EACpDJ,QAAQ,6BAAiC,EACzC,CAACA,QAAQ,IAAIM,KAAK,0BAA8B,EAChDJ,SAAS;EACT,IAEDJ,MAAM,iBAAI;IAAM,SAAS;EAA8B,GAAEA,MAAM,CAAQ,EACvEF,QAAQ,EACRG,KAAK,iBAAI;IAAM,SAAS;EAA6B,GAAEA,KAAK,CAAQ,eACrE;IAAM,mBAAW;IAAC,SAAS;EAA8B,EAAG,CAClD;AAEhB,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}

package/dist/components/FormItem/FormItem.js CHANGED Viewed

@@ -1,14 +1,18 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["children", "top", "bottom", "status", "Component", "removable", "onRemove", "removePlaceholder", "getRootRef", "className"];
 import * as React from 'react';
 import { classNames, hasReactNode, noop } from '@vkontakte/vkjs';
-import { useExternRef } from '../../hooks/useExternRef';
-import { Subhead } from '../Typography/Subhead/Subhead';
-import { Footnote } from '../Typography/Footnote/Footnote';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
+import { useExternRef } from '../../hooks/useExternRef';
+import { SizeType } from '../../lib/adaptivity';
 import { Removable } from '../Removable/Removable';
-import { getSizeYClassName } from '../../helpers/getSizeYClassName';
+import { Footnote } from '../Typography/Footnote/Footnote';
+import { Subhead } from '../Typography/Subhead/Subhead';
+var sizeYClassNames = _defineProperty({
+  none: "vkuiFormItem--sizeY-none"
+}, SizeType.COMPACT, "vkuiFormItem--sizeY-compact");
 /**
  * @see https://vkcom.github.io/VKUI/#/FormItem
  */
@@ -30,7 +34,8 @@ export var FormItem = function FormItem(_ref) {
     restProps = _objectWithoutProperties(_ref, _excluded);
   var rootEl = useExternRef(getRootRef);
   var _useAdaptivity = useAdaptivity(),
-    sizeY = _useAdaptivity.sizeY;
+    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
+    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
   var wrappedChildren = /*#__PURE__*/React.createElement(React.Fragment, null, hasReactNode(top) && /*#__PURE__*/React.createElement(Subhead, {
     className: "vkuiFormItem__top"
   }, top), children, hasReactNode(bottom) && /*#__PURE__*/React.createElement(Footnote, {
@@ -38,7 +43,7 @@ export var FormItem = function FormItem(_ref) {
   }, bottom));
   return /*#__PURE__*/React.createElement(Component, _extends({}, restProps, {
     ref: rootEl,
-    className: classNames("vkuiFormItem", status !== 'default' && styles["FormItem--status-".concat(status)], getSizeYClassName("vkuiFormItem", sizeY), hasReactNode(top) && "vkuiFormItem--withTop", removable && "vkuiFormItem--removable", className)
+    className: classNames("vkuiFormItem", status !== 'default' && styles["FormItem--status-".concat(status)], sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], hasReactNode(top) && "vkuiFormItem--withTop", removable && "vkuiFormItem--removable", className)
   }), removable ? /*#__PURE__*/React.createElement(Removable, {
     align: "start",
     onRemove: function onRemove(e) {

package/dist/components/FormItem/FormItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormItem.js","names":["React","classNames","hasReactNode","noop","useExternRef","~~Subhead~~","Footnote","~~useAdaptivity~~","~~Removable~~","~~getSizeYClassName~~","FormItem","children","top","bottom","status","Component","removable","onRemove","removePlaceholder","getRootRef","className","restProps","rootEl","sizeY","wrappedChildren","styles","e","current"],"sources":["../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ~~HasComponent, HasRootRef } from '../../types';\nimport {~~ classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { ~~useExternRef~~ } from '../../hooks/~~useExternRef~~';\nimport { ~~Subhead~~ } from '~~../Typography~~/~~Subhead/Subhead~~';\nimport { ~~Footnote~~ } from '~~../Typography~~/~~Footnote/Footnote~~';\nimport { ~~useAdaptivity~~ } from '../../~~hooks/useAdaptivity~~';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { ~~getSizeYClassName~~ } from '~~../../helpers~~/~~getSizeYClassName~~';\nimport styles from './FormItem.module.css';\n\nexport interface FormItemProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent,\n RemovableProps {\n top?: React.ReactNode;\n bottom?: React.ReactNode;\n status?: 'default' \| 'error' \| 'valid';\n /*\n Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n /\n removable?: boolean;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/FormItem\n */\nexport const FormItem = ({\n children,\n top,\n bottom,\n status = 'default',\n Component = 'div',\n removable,\n onRemove = noop,\n removePlaceholder = 'Удалить',\n getRootRef,\n className,\n ...restProps\n}: FormItemProps) => {\n const rootEl = useExternRef(getRootRef);\n const { sizeY } = useAdaptivity();\n\n const wrappedChildren = (\n <React.Fragment>\n {hasReactNode(top) && <Subhead className={styles['FormItem__top']}>{top}</Subhead>}\n {children}\n {hasReactNode(bottom) && <Footnote className={styles['FormItem__bottom']}>{bottom}</Footnote>}\n </React.Fragment>\n );\n\n return (\n <Component\n {...restProps}\n ref={rootEl}\n className={classNames(\n styles['FormItem'],\n status !== 'default' && styles[`FormItem--status-${status}`],\n ~~getSizeYClassName(styles~~[~~'FormItem'~~]~~, sizeY)~~,\n hasReactNode(top) && styles['FormItem--withTop'],\n removable && styles['FormItem--removable'],\n className,\n )}\n >\n {removable ? (\n <Removable\n align=\"start\"\n onRemove={(e) => {\n if (rootEl?.current) {\n onRemove(e, rootEl.current);\n }\n }}\n removePlaceholder={removePlaceholder}\n >\n <div className={styles['FormItem__removable']}>{wrappedChildren}</div>\n </Removable>\n ) : (\n wrappedChildren\n )}\n </Component>\n );\n};\n"],"mappings":"~~;;;~~AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;~~AAE9B~~,SAASC,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,iBAAiB;AAChE,SAASC,~~YAAY~~,QAAQ,~~0BAA0B~~;~~AACvD~~,SAASC,~~OAAO~~,QAAQ~~,+BAA+B~~;AACvD,SAASC,QAAQ,QAAQ,~~iCAAiC~~;~~AAC1D~~,SAASC,~~aAAa~~,~~QAAQ~~,~~2BAA2B~~;~~AACzD~~,SAASC,~~SAAS~~,~~QAAwB~~,~~wBAAwB~~;~~AAClE~~,SAASC,~~iBAAiB~~,QAAQ,~~iCAAiC~~;~~AAiBnE~~;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAYA;EAAA,IAXnBC,QAAQ,QAARA,QAAQ;IACRC,GAAG,QAAHA,GAAG;IACHC,MAAM,QAANA,MAAM;IAAA,mBACNC,MAAM;IAANA,MAAM,4BAAG,SAAS;IAAA,sBAClBC,SAAS;IAATA,SAAS,+BAAG,KAAK;IACjBC,SAAS,QAATA,SAAS;IAAA,qBACTC,QAAQ;IAARA,SAAQ,~~8BAAGd~~,IAAI;IAAA,~~6BACfe~~,iBAAiB;IAAjBA,iBAAiB,sCAAG,SAAS;IAC7BC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,MAAM,~~GAAGlB~~,YAAY,~~CAACe~~,UAAU,CAAC;EACvC,~~qBAAkBZ~~,aAAa,EAAE;~~IAAzBgB~~,KAAK,~~kBAALA~~,~~KAAK~~;~~EAEb~~,IAAMC,eAAe,gBACnB,oBAAC,KAAK,CAAC,QAAQ,~~QACZtB~~,YAAY,~~CAACU~~,GAAG,CAAC,iBAAI,oBAAC,OAAO;IAAC,SAAS;EAA0B,GAAEA,GAAG,CAAW,EACjFD,QAAQ,~~EACRT~~,YAAY,~~CAACW~~,MAAM,CAAC,iBAAI,oBAAC,QAAQ;IAAC,SAAS;EAA6B,GAAEA,MAAM,CAAY,CAEhG;EAED,oBACE,oBAAC,SAAS,eACJQ,SAAS;IACb,GAAG,EAAEC,MAAO;IACZ,SAAS,~~EAAErB~~,UAAU,~~iBAEnBa~~,MAAM,KAAK,SAAS,IAAIW,MAAM,4BAAqBX,MAAM,EAAG,~~EAC5DL~~,~~iBAAiB~~,~~iBAAqBc~~,KAAK,CAAC,~~EAC5CrB~~,YAAY,~~CAACU~~,GAAG,CAAC,2BAA+B,EAChDI,SAAS,6BAAiC,EAC1CI,SAAS;EACT,IAEDJ,SAAS,gBACR,oBAAC,SAAS;IACR,KAAK,EAAC,OAAO;IACb,QAAQ,EAAE,~~kBAACU~~,CAAC,EAAK;MACf,~~IAAIJ~~,MAAM,aAANA,MAAM,eAANA,MAAM,~~CAAEK~~,OAAO,EAAE;~~QACnBV~~,SAAQ,~~CAACS~~,CAAC,~~EAAEJ~~,MAAM,~~CAACK~~,OAAO,CAAC;MAC7B;IACF,CAAE;IACF,iBAAiB,~~EAAET~~;EAAkB,gBAErC;IAAK,SAAS;EAAgC,GAAEM,eAAe,CAAO,CAC5D,GAEZA,eACD,CACS;AAEhB,CAAC;AAAC;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"FormItem.js","names":["React","classNames","hasReactNode","noop","useAdaptivity","useExternRef","SizeType","Removable","Footnote","Subhead","sizeYClassNames","none","COMPACT","FormItem","children","top","bottom","status","Component","removable","onRemove","removePlaceholder","getRootRef","className","restProps","rootEl","sizeY","wrappedChildren","styles","REGULAR","e","current"],"sources":["../../../src/components/FormItem/FormItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { Removable, RemovableProps } from '../Removable/Removable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './FormItem.module.css';\n\nconst sizeYClassNames = {\n none: styles['FormItem--sizeY-none'],\n [SizeType.COMPACT]: styles['FormItem--sizeY-compact'],\n};\n\nexport interface FormItemProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent,\n RemovableProps {\n top?: React.ReactNode;\n bottom?: React.ReactNode;\n status?: 'default' \| 'error' \| 'valid';\n /*\n Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n /\n removable?: boolean;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/FormItem\n */\nexport const FormItem = ({\n children,\n top,\n bottom,\n status = 'default',\n Component = 'div',\n removable,\n onRemove = noop,\n removePlaceholder = 'Удалить',\n getRootRef,\n className,\n ...restProps\n}: FormItemProps) => {\n const rootEl = useExternRef(getRootRef);\n const { sizeY = 'none' } = useAdaptivity();\n\n const wrappedChildren = (\n <React.Fragment>\n {hasReactNode(top) && <Subhead className={styles['FormItem__top']}>{top}</Subhead>}\n {children}\n {hasReactNode(bottom) && <Footnote className={styles['FormItem__bottom']}>{bottom}</Footnote>}\n </React.Fragment>\n );\n\n return (\n <Component\n {...restProps}\n ref={rootEl}\n className={classNames(\n styles['FormItem'],\n status !== 'default' && styles[`FormItem--status-${status}`],\n sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n hasReactNode(top) && styles['FormItem--withTop'],\n removable && styles['FormItem--removable'],\n className,\n )}\n >\n {removable ? (\n <Removable\n align=\"start\"\n onRemove={(e) => {\n if (rootEl?.current) {\n onRemove(e, rootEl.current);\n }\n }}\n removePlaceholder={removePlaceholder}\n >\n <div className={styles['FormItem__removable']}>{wrappedChildren}</div>\n </Removable>\n ) : (\n wrappedChildren\n )}\n </Component>\n );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,iBAAiB;AAChE,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,QAAQ,QAAQ,sBAAsB;AAE/C,SAASC,SAAS,QAAwB,wBAAwB;AAClE,SAASC,QAAQ,QAAQ,iCAAiC;AAC1D,SAASC,OAAO,QAAQ,+BAA+B;AAGvD,IAAMC,eAAe;EACnBC,IAAI;AAAgC,GACnCL,QAAQ,CAACM,OAAO,gCAClB;AAgBD;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAYA;EAAA,IAXnBC,QAAQ,QAARA,QAAQ;IACRC,GAAG,QAAHA,GAAG;IACHC,MAAM,QAANA,MAAM;IAAA,mBACNC,MAAM;IAANA,MAAM,4BAAG,SAAS;IAAA,sBAClBC,SAAS;IAATA,SAAS,+BAAG,KAAK;IACjBC,SAAS,QAATA,SAAS;IAAA,qBACTC,QAAQ;IAARA,SAAQ,8BAAGjB,IAAI;IAAA,6BACfkB,iBAAiB;IAAjBA,iBAAiB,sCAAG,SAAS;IAC7BC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,MAAM,GAAGpB,YAAY,CAACiB,UAAU,CAAC;EACvC,qBAA2BlB,aAAa,EAAE;IAAA,sCAAlCsB,KAAK;IAALA,KAAK,qCAAG,MAAM;EAEtB,IAAMC,eAAe,gBACnB,oBAAC,KAAK,CAAC,QAAQ,QACZzB,YAAY,CAACa,GAAG,CAAC,iBAAI,oBAAC,OAAO;IAAC,SAAS;EAA0B,GAAEA,GAAG,CAAW,EACjFD,QAAQ,EACRZ,YAAY,CAACc,MAAM,CAAC,iBAAI,oBAAC,QAAQ;IAAC,SAAS;EAA6B,GAAEA,MAAM,CAAY,CAEhG;EAED,oBACE,oBAAC,SAAS,eACJQ,SAAS;IACb,GAAG,EAAEC,MAAO;IACZ,SAAS,EAAExB,UAAU,iBAEnBgB,MAAM,KAAK,SAAS,IAAIW,MAAM,4BAAqBX,MAAM,EAAG,EAC5DS,KAAK,KAAKpB,QAAQ,CAACuB,OAAO,IAAInB,eAAe,CAACgB,KAAK,CAAC,EACpDxB,YAAY,CAACa,GAAG,CAAC,2BAA+B,EAChDI,SAAS,6BAAiC,EAC1CI,SAAS;EACT,IAEDJ,SAAS,gBACR,oBAAC,SAAS;IACR,KAAK,EAAC,OAAO;IACb,QAAQ,EAAE,kBAACW,CAAC,EAAK;MACf,IAAIL,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEM,OAAO,EAAE;QACnBX,SAAQ,CAACU,CAAC,EAAEL,MAAM,CAACM,OAAO,CAAC;MAC7B;IACF,CAAE;IACF,iBAAiB,EAAEV;EAAkB,gBAErC;IAAK,SAAS;EAAgC,GAAEM,eAAe,CAAO,CAC5D,GAEZA,eACD,CACS;AAEhB,CAAC;AAAC;EAAA;EAAA;AAAA"}