@vkontakte/vkui 5.1.0 → 5.2.0

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

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { CalendarRangeProps } from '../CalendarRange/CalendarRange';
-import { Placement } from '../Popper/Popper';
 import { HasRootRef } from '../../types';
+import type { PlacementWithAuto } from '../../lib/floating';
 import { FormFieldProps } from '../FormField/FormField';
 export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'onChange'>, Pick<CalendarRangeProps, 'disablePast' | 'disableFuture' | 'shouldDisableDate' | 'onChange' | 'value' | 'weekStartsOn' | 'disablePickers' | 'prevMonthAriaLabel' | 'nextMonthAriaLabel' | 'changeMonthAriaLabel' | 'changeYearAriaLabel' | 'changeDayAriaLabel' | 'prevMonthIcon' | 'nextMonthIcon'>, HasRootRef<HTMLDivElement>, FormFieldProps {
-    calendarPlacement?: Placement;
+    calendarPlacement?: PlacementWithAuto;
     closeOnChange?: boolean;
     clearFieldAriaLabel?: string;
     showCalendarAriaLabel?: string;

package/dist/cssm/components/DateRangeInput/DateRangeInput.js

@@ -9,8 +9,8 @@ import { Popper } from '../Popper/Popper';
 import { IconButton } from '../IconButton/IconButton';
 import { useDateInput } from '../../hooks/useDateInput';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
+import { useExternRef } from '../../hooks/useExternRef';
 import { classNames } from '@vkontakte/vkjs';
-import { multiRef } from '../../lib/utils';
 import { FormField } from '../FormField/FormField';
 import { InputLike } from '../InputLike/InputLike';
 import { InputLikeDivider } from '../InputLike/InputLikeDivider';
@@ -173,6 +173,7 @@ export var DateRangeInput = function DateRangeInput(_ref) {
     removeFocusFromField = _useDateInput.removeFocusFromField;
   var _useAdaptivity = useAdaptivity(),
     sizeY = _useAdaptivity.sizeY;
+  var handleRootRef = useExternRef(rootRef, getRootRef);
   var onCalendarChange = React.useCallback(function (newValue) {
     onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
     if (closeOnChange && newValue !== null && newValue !== void 0 && newValue[1] && newValue[1] !== (value === null || value === void 0 ? void 0 : value[1])) {
@@ -182,7 +183,7 @@ export var DateRangeInput = function DateRangeInput(_ref) {
   return /*#__PURE__*/React.createElement(FormField, _extends({
     style: style,
     className: classNames("vkuiDateRangeInput", getSizeYClassName("vkuiDateRangeInput", sizeY), className),
-    getRootRef: multiRef(rootRef, getRootRef),
+    getRootRef: handleRootRef,
     after: value ? /*#__PURE__*/React.createElement(IconButton, {
       hoverMode: "opacity",
       "aria-label": clearFieldAriaLabel,

package/dist/cssm/components/DateRangeInput/DateRangeInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateRangeInput.js","names":["React","format","isMatch","parse","isAfter","Icon16Clear","Icon20CalendarOutline","CalendarRange","Popper","IconButton","useDateInput","useAdaptivity","classNames","multiRef","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","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, Placement } from '../Popper/Popper';\nimport { IconButton } from '../IconButton/IconButton';\nimport { HasRootRef } from '../../types';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { classNames } from '@vkontakte/vkjs';\nimport { multiRef } from '../../lib/utils';\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?: Placement;\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 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={multiRef(rootRef, getRootRef)}\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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"}
+{"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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"}

package/dist/cssm/components/DateRangeInput/DateRangeInput.module.css

@@ -1 +1 @@
-.vkuiDateRangeInput__input{cursor:text;flex-grow:1;font-size:16px;font-variant-numeric:tabular-nums;margin-left:10px;margin-right:14px;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;white-space:nowrap;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiDateRangeInput--sizeY-compact .vkuiDateRangeInput__input{font-size:15px;margin-right:22px}@media (max-height:414px),(pointer:fine) and (min-width:768px){.vkuiDateRangeInput--sizeY-none .vkuiDateRangeInput__input{font-size:15px;margin-right:22px}}
+.vkuiDateRangeInput__input{cursor:text;flex-grow:1;font-size:16px;font-variant-numeric:tabular-nums;margin-left:10px;margin-right:14px;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;white-space:nowrap;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiDateRangeInput--sizeY-compact .vkuiDateRangeInput__input{font-size:15px;margin-right:22px}@media (pointer:fine) and (min-width:768px),not (min-height:415px){.vkuiDateRangeInput--sizeY-none .vkuiDateRangeInput__input{font-size:15px;margin-right:22px}}

package/dist/cssm/components/Div/Div.module.css

@@ -1 +1 @@
-.vkuiDiv{padding:var(--vkui--size_base_padding_vertical--regular) var(--vkui--size_base_padding_horizontal--regular)}
+.vkuiDiv{padding:12px 16px;padding:var(--vkui--size_base_padding_vertical--regular) var(--vkui--size_base_padding_horizontal--regular)}

package/dist/cssm/components/Epic/Epic.js

@@ -24,7 +24,7 @@ export var Epic = function Epic(props) {
     return /*#__PURE__*/React.isValidElement(story) && getNavId(story.props, warn) === activeStory;
   })) !== null && _ref !== void 0 ? _ref : null;
   return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
-    className: classNames("vkuiEpic", className)
+    className: classNames("vkuiEpic", tabbar && "vkuiEpic--hasTabbar", className)
   }), /*#__PURE__*/React.createElement(ScrollSaver, {
     key: activeStory,
     initialScroll: scroll[activeStory] || 0,

package/dist/cssm/components/Epic/Epic.js.map

@@ -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 {...restProps} className={classNames(styles['Epic'], className)}>\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;AAAC;AAQ9C,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,wCAASI,SAAS;IAAE,SAAS,EAAEd,UAAU,aAAiBa,SAAS;EAAE,iBACnE,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"}
+{"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;AAAC;AAQ9C,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"}

package/dist/cssm/components/FixedLayout/FixedLayout.js

@@ -6,7 +6,7 @@ var _excluded = ["children", "style", "vertical", "getRootRef", "getRef", "fille
 import * as React from 'react';
 import { Platform } from '../../lib/platform';
 import { classNames } from '@vkontakte/vkjs';
-import { SplitColContext } from '../SplitCol/SplitCol';
+import { SplitColContext } from '../SplitCol/SplitColContext';
 import { TooltipContainer } from '../Tooltip/TooltipContainer';
 import { useDOM } from '../../lib/dom';
 import { useGlobalEventListener } from '../../hooks/useGlobalEventListener';

package/dist/cssm/components/FixedLayout/FixedLayout.js.map

@@ -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/SplitCol';\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,sBAAsB;AACtD,SAASC,gBAAgB,QAAQ,6BAA6B;AAC9D,SAASC,MAAM,QAAQ,eAAe;AACtC,SAASC,sBAAsB,QAAQ,oCAAoC;AAC3E,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,YAAY,QAAQ,0BAA0B;AAAC;AAsBxD;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"}
+{"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;AAAC;AAsBxD;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"}

package/dist/cssm/components/FixedLayout/FixedLayout.module.css

@@ -1 +1 @@
-.vkuiFixedLayout{box-sizing:border-box;left:auto;padding-left:0;padding-left:var(--vkui_internal--safe_area_inset_left);padding-right:0;padding-right:var(--vkui_internal--safe_area_inset_right);position:fixed;z-index:3;z-index:var(--vkui_internal--z_index_fixed_layout)}.vkuiFixedLayout--filled{background:var(--vkui--color_background_content)}.vkuiFixedLayout--vertical-top{top:0;width:100%}.vkuiFixedLayout--vertical-bottom{bottom:0;padding-bottom:0;padding-bottom:var(--vkui_internal--safe_area_inset_bottom);width:100%}.vkuiEpic .vkuiFixedLayout--vertical-bottom{padding-bottom:calc(48px + 0px);padding-bottom:calc(var(--vkui_internal--tabbar_height) + var(--vkui_internal--safe_area_inset_bottom))}.vkuiPanelHeader~* .vkuiFixedLayout--vertical-top:not(.vkuiPanelHeader__fixed),.vkuiPanelHeader~.vkuiFixedLayout--vertical-top{top:calc(var(--vkui--size_panel_header_height--regular) + 0px);top:calc(var(--vkui--size_panel_header_height--regular) + var(--vkui_internal--safe_area_inset_top))}.vkuiFixedLayout.vkuiPanelHeaderContext{z-index:4;z-index:var(--vkui_internal--z_index_panel_header_context)}
+.vkuiFixedLayout{box-sizing:border-box;left:auto;padding-left:0;padding-left:var(--vkui_internal--safe_area_inset_left);padding-right:0;padding-right:var(--vkui_internal--safe_area_inset_right);position:fixed;z-index:3;z-index:var(--vkui_internal--z_index_fixed_layout)}.vkuiFixedLayout--filled{background:#fff;background:var(--vkui--color_background_content)}.vkuiFixedLayout--vertical-top{top:0;width:100%}.vkuiFixedLayout--vertical-bottom{bottom:0;padding-bottom:0;padding-bottom:var(--vkui_internal--safe_area_inset_bottom);width:100%}.vkuiEpic--hasTabbar .vkuiFixedLayout--vertical-bottom{padding-bottom:calc(48px + 0px);padding-bottom:calc(var(--vkui_internal--tabbar_height) + var(--vkui_internal--safe_area_inset_bottom))}.vkuiPanelHeader~* .vkuiFixedLayout--vertical-top:not(.vkuiPanelHeader__fixed),.vkuiPanelHeader~.vkuiFixedLayout--vertical-top{top:calc(56px + 0px);top:calc(var(--vkui--size_panel_header_height--regular) + var(--vkui_internal--safe_area_inset_top))}.vkuiFixedLayout.vkuiPanelHeaderContext{z-index:4;z-index:var(--vkui_internal--z_index_panel_header_context)}

package/dist/cssm/components/FocusVisible/FocusVisible.module.css

@@ -1 +1 @@
-[class$="--focus-visible"]>.vkuiFocusVisible{border-radius:inherit;overflow:hidden;pointer-events:none;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[class$="--focus-visible"]>.vkuiFocusVisible--mode-inside{border-color:var(--vkui--color_stroke_accent);border-style:solid;border-width:2px;bottom:2px;box-sizing:border-box;left:2px;right:2px;top:2px}[class$="--focus-visible"]>.vkuiFocusVisible--mode-outside{bottom:-2px;box-shadow:0 0 0 2px var(--vkui--color_stroke_accent);left:-2px;right:-2px;top:-2px}@media (prefers-reduced-motion:no-preference){[class$="--focus-visible"]>.vkuiFocusVisible{animation:vkui-animation-focus-visible .15s ease-in-out forwards;animation-delay:.01ms;bottom:4px;left:4px;right:4px;top:4px;will-change:top,left,bottom,right}[class$="--focus-visible"]>.vkuiFocusVisible--mode-outside{animation-name:vkui-animation-focus-visible-outside;bottom:0;left:0;right:0;top:0}@keyframes vkui-animation-focus-visible{to{bottom:0;left:0;right:0;top:0;will-change:auto}}@keyframes vkui-animation-focus-visible-outside{to{bottom:-2px;left:-2px;right:-2px;top:-2px;will-change:auto}}}
+[class$="--focus-visible"]>.vkuiFocusVisible{border-radius:inherit;overflow:hidden;pointer-events:none;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[class$="--focus-visible"]>.vkuiFocusVisible--mode-inside{border-color:#2688eb;border-color:var(--vkui--color_stroke_accent);border-style:solid;border-width:2px;bottom:2px;box-sizing:border-box;left:2px;right:2px;top:2px}[class$="--focus-visible"]>.vkuiFocusVisible--mode-outside{bottom:-2px;box-shadow:0 0 0 2px #2688eb;box-shadow:0 0 0 2px var(--vkui--color_stroke_accent);left:-2px;right:-2px;top:-2px}@media (prefers-reduced-motion:no-preference){[class$="--focus-visible"]>.vkuiFocusVisible{animation:vkui-animation-focus-visible .15s ease-in-out forwards;animation-delay:.01ms;bottom:4px;left:4px;right:4px;top:4px;will-change:top,left,bottom,right}[class$="--focus-visible"]>.vkuiFocusVisible--mode-outside{animation-name:vkui-animation-focus-visible-outside;bottom:0;left:0;right:0;top:0}@keyframes vkui-animation-focus-visible{to{bottom:0;left:0;right:0;top:0;will-change:auto}}@keyframes vkui-animation-focus-visible-outside{to{bottom:-2px;left:-2px;right:-2px;top:-2px;will-change:auto}}}

package/dist/cssm/components/Footer/Footer.module.css

@@ -1 +1 @@
-.vkuiFooter{color:var(--vkui--color_text_secondary);display:block;margin:24px var(--vkui--size_base_padding_horizontal--regular);padding-bottom:0;padding-top:0;text-align:center}
+.vkuiFooter{color:#818c99;color:var(--vkui--color_text_secondary);display:block;margin:24px 16px;margin:24px var(--vkui--size_base_padding_horizontal--regular);padding-bottom:0;padding-top:0;text-align:center}

package/dist/cssm/components/FormField/FormField.js

@@ -12,7 +12,7 @@ import "./FormField.module.css";
  */
 export var FormField = function FormField(_ref) {
   var _ref$Component = _ref.Component,
-    Component = _ref$Component === void 0 ? 'div' : _ref$Component,
+    Component = _ref$Component === void 0 ? 'span' : _ref$Component,
     _ref$status = _ref.status,
     status = _ref$status === void 0 ? 'default' : _ref$status,
     children = _ref.children,
@@ -38,21 +38,17 @@ export var FormField = function FormField(_ref) {
     e.stopPropagation();
     setHover(false);
   };
-  return /*#__PURE__*/React.createElement(Component, _extends({
-    role: "presentation"
-  }, restProps, {
+  return /*#__PURE__*/React.createElement(Component, _extends({}, restProps, {
     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)
-  }), before && /*#__PURE__*/React.createElement("div", {
-    role: "presentation",
+  }), before && /*#__PURE__*/React.createElement("span", {
     className: "vkuiFormField__before"
-  }, before), children, after && /*#__PURE__*/React.createElement("div", {
-    role: "presentation",
+  }, before), children, after && /*#__PURE__*/React.createElement("span", {
     className: "vkuiFormField__after"
-  }, after), /*#__PURE__*/React.createElement("div", {
-    role: "presentation",
+  }, after), /*#__PURE__*/React.createElement("span", {
+    "aria-hidden": true,
     className: "vkuiFormField__border"
   }));
 };

package/dist/cssm/components/FormField/FormField.js.map

@@ -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 = 'div',\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      role=\"presentation\"\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 && (\n        <div role=\"presentation\" className={styles['FormField__before']}>\n          {before}\n        </div>\n      )}\n      {children}\n      {after && (\n        <div role=\"presentation\" className={styles['FormField__after']}>\n          {after}\n        </div>\n      )}\n      <div role=\"presentation\" 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;AAAC;AAkCpE;AACA;AACA;AACA,OAAO,IAAMC,SAAS,GAAG,SAAZA,SAAS,OAWG;EAAA,0BAVvBC,SAAS;IAATA,SAAS,+BAAG,KAAK;IAAA,mBACjBC,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;IACR,IAAI,EAAC;EAAc,GACfJ,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,iBACL;IAAK,IAAI,EAAC,cAAc;IAAC,SAAS;EAA8B,GAC7DA,MAAM,CAEV,EACAF,QAAQ,EACRG,KAAK,iBACJ;IAAK,IAAI,EAAC,cAAc;IAAC,SAAS;EAA6B,GAC5DA,KAAK,CAET,eACD;IAAK,IAAI,EAAC,cAAc;IAAC,SAAS;EAA8B,EAAG,CACzD;AAEhB,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}
+{"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;AAAC;AAkCpE;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"}

package/dist/cssm/components/FormField/FormField.module.css

@@ -1 +1 @@
-.vkuiFormField{-webkit-tap-highlight-color:transparent;align-items:center;border-radius:var(--vkui--size_border_radius--regular);box-sizing:border-box;display:flex;font-family:var(--vkui--font_family_base);isolation:isolate;min-height:var(--vkui--size_field_height--regular);position:relative}.vkuiFormField--sizeY-compact{min-height:var(--vkui--size_field_height--compact)}@media (max-height:414px),(pointer:fine) and (min-width:768px){.vkuiFormField--sizeY-none{min-height:var(--vkui--size_field_height--compact)}}.vkuiFormField>*{border-radius:inherit;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiFormField__after,.vkuiFormField__before{align-content:center;align-items:center;color:var(--vkui--color_icon_secondary);display:flex;flex-shrink:0;height:100%;justify-content:center;min-width:var(--vkui--size_field_height--regular);position:relative;z-index:6;z-index:var(--vkui_internal--z_index_form_field_side)}.vkuiFormField--sizeY-compact .vkuiFormField__after,.vkuiFormField--sizeY-compact .vkuiFormField__before{height:var(--vkui--size_field_height--compact);min-width:var(--vkui--size_field_height--compact)}@media (max-height:414px),(pointer:fine) and (min-width:768px){.vkuiFormField--sizeY-none .vkuiFormField__after,.vkuiFormField--sizeY-none .vkuiFormField__before{height:var(--vkui--size_field_height--compact);min-width:var(--vkui--size_field_height--compact)}}.vkuiFormField__before{color:var(--vkui--color_icon_accent)}.vkuiFormField__after{color:var(--vkui--color_icon_secondary)}.vkuiFormField__border{border:1px solid transparent;border:var(--vkui_internal--thin_border) solid transparent;border-radius:inherit;box-sizing:border-box;height:100%;left:0;pointer-events:none;position:absolute;top:0;transform-origin:left top;width:100%;z-index:2;z-index:var(--vkui_internal--z_index_form_field_border)}.vkuiFormField--mode-default .vkuiFormField__border{border-color:var(--vkui--color_field_border_alpha)}.vkuiFormField--mode-default{background-color:var(--vkui--color_field_background)}.vkuiFormField--status-error .vkuiFormField__border,.vkuiFormItem--status-error .vkuiFormField__border{border-color:var(--vkui--color_stroke_negative);z-index:3;z-index:var(--vkui_internal--z_index_form_field_status)}.vkuiFormField--status-error,.vkuiFormItem--status-error .vkuiFormField{background-color:var(--vkui--color_background_negative_tint)}.vkuiFormField--status-valid .vkuiFormField__border,.vkuiFormItem--status-valid .vkuiFormField__border{border-color:var(--vkui--color_stroke_positive);z-index:3;z-index:var(--vkui_internal--z_index_form_field_status)}.vkuiFormField--disabled{cursor:default;opacity:var(--vkui--opacity_disable_accessibility);pointer-events:none}.vkuiFormField--hover{background-color:var(--vkui--color_field_background)}.vkuiFormField--mode-default.vkuiFormField--hover .vkuiFormField__border{border-color:var(--vkui--color_field_border_alpha--hover);z-index:4;z-index:var(--vkui_internal--z_index_form_field_border_hover)}.vkuiFormField :focus{outline:none}.vkuiFormField :focus~.vkuiFormField__border,.vkuiFormField:focus-within .vkuiFormField__border{border-color:var(--vkui--color_stroke_accent);z-index:5;z-index:var(--vkui_internal--z_index_form_field_focus)}.vkuiModalCardBase__header+.vkuiFormField,.vkuiModalCardBase__subheader+.vkuiFormField{margin-top:16px}.vkuiSelect .vkuiFormField__after{pointer-events:none}.vkuiCalendarHeader__picker .vkuiFormField__after{min-width:12px;padding-right:8px}.vkuiChipsInput .vkuiFormField__after{z-index:6;z-index:var(--vkui_internal--z_index_form_field_side)}.vkuiFormLayoutGroup--segmented .vkuiFormField{isolation:auto;z-index:auto}.vkuiFormLayoutGroup--segmented .vkuiRemovable__content>.vkuiFormItem:not(:first-of-type):not(:last-of-type) .vkuiFormField,.vkuiFormLayoutGroup--segmented>.vkuiFormItem:not(:first-of-type):not(:last-of-type) .vkuiFormField{border-radius:0}.vkuiFormLayoutGroup--segmented .vkuiRemovable__content>:first-of-type:not(:last-of-type) .vkuiFormField,.vkuiFormLayoutGroup--segmented>:first-of-type:not(:last-of-type) .vkuiFormField{border-bottom-right-radius:0;border-top-right-radius:0}.vkuiFormLayoutGroup--segmented .vkuiRemovable__content>.vkuiFormItem:not(:first-of-type):last-of-type .vkuiFormField,.vkuiFormLayoutGroup--segmented>.vkuiFormItem:not(:first-of-type):last-of-type .vkuiFormField{border-bottom-left-radius:0;border-top-left-radius:0}
+.vkuiFormField{-webkit-tap-highlight-color:transparent;align-items:center;border-radius:8px;border-radius:var(--vkui--size_border_radius--regular);box-sizing:border-box;display:flex;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);isolation:isolate;min-height:44px;min-height:var(--vkui--size_field_height--regular);position:relative}.vkuiFormField--sizeY-compact{min-height:36px;min-height:var(--vkui--size_field_height--compact)}@media (pointer:fine) and (min-width:768px),not (min-height:415px){.vkuiFormField--sizeY-none{min-height:36px;min-height:var(--vkui--size_field_height--compact)}}.vkuiFormField>*{border-radius:inherit;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiFormField__after,.vkuiFormField__before{align-content:center;align-items:center;color:#99a2ad;color:var(--vkui--color_icon_secondary);display:flex;flex-shrink:0;height:100%;justify-content:center;min-width:44px;min-width:var(--vkui--size_field_height--regular);position:relative;z-index:6;z-index:var(--vkui_internal--z_index_form_field_side)}.vkuiFormField--sizeY-compact .vkuiFormField__after,.vkuiFormField--sizeY-compact .vkuiFormField__before{height:36px;height:var(--vkui--size_field_height--compact);min-width:36px;min-width:var(--vkui--size_field_height--compact)}@media (pointer:fine) and (min-width:768px),not (min-height:415px){.vkuiFormField--sizeY-none .vkuiFormField__after,.vkuiFormField--sizeY-none .vkuiFormField__before{height:36px;height:var(--vkui--size_field_height--compact);min-width:36px;min-width:var(--vkui--size_field_height--compact)}}.vkuiFormField__before{color:#2688eb;color:var(--vkui--color_icon_accent)}.vkuiFormField__after{color:#99a2ad;color:var(--vkui--color_icon_secondary)}.vkuiFormField__border{border:1px solid transparent;border:var(--vkui_internal--thin_border) solid transparent;border-radius:inherit;box-sizing:border-box;height:100%;left:0;pointer-events:none;position:absolute;top:0;transform-origin:left top;width:100%;z-index:2;z-index:var(--vkui_internal--z_index_form_field_border)}.vkuiFormField--mode-default .vkuiFormField__border{border-color:rgba(0,0,0,.12);border-color:var(--vkui--color_field_border_alpha)}.vkuiFormField--mode-default{background-color:#f2f3f5;background-color:var(--vkui--color_field_background)}.vkuiFormField--status-error .vkuiFormField__border,.vkuiFormItem--status-error .vkuiFormField__border{border-color:#e64646;border-color:var(--vkui--color_stroke_negative);z-index:3;z-index:var(--vkui_internal--z_index_form_field_status)}.vkuiFormField--status-error,.vkuiFormItem--status-error .vkuiFormField{background-color:#faebeb;background-color:var(--vkui--color_background_negative_tint)}.vkuiFormField--status-valid .vkuiFormField__border,.vkuiFormItem--status-valid .vkuiFormField__border{border-color:#4bb34b;border-color:var(--vkui--color_stroke_positive);z-index:3;z-index:var(--vkui_internal--z_index_form_field_status)}.vkuiFormField--disabled{cursor:default;opacity:.64;opacity:var(--vkui--opacity_disable_accessibility);pointer-events:none}.vkuiFormField--hover{background-color:#f2f3f5;background-color:var(--vkui--color_field_background)}.vkuiFormField--mode-default.vkuiFormField--hover .vkuiFormField__border{border-color:rgba(0,0,0,.24);border-color:var(--vkui--color_field_border_alpha--hover);z-index:4;z-index:var(--vkui_internal--z_index_form_field_border_hover)}.vkuiFormField :focus{outline:none}.vkuiFormField :focus~.vkuiFormField__border,.vkuiFormField:focus-within .vkuiFormField__border{border-color:#2688eb;border-color:var(--vkui--color_stroke_accent);z-index:5;z-index:var(--vkui_internal--z_index_form_field_focus)}.vkuiModalCardBase__header+.vkuiFormField,.vkuiModalCardBase__subheader+.vkuiFormField{margin-top:16px}.vkuiSelect .vkuiFormField__after{pointer-events:none}.vkuiCalendarHeader__picker .vkuiFormField__after{min-width:12px;padding-right:8px}.vkuiChipsInput .vkuiFormField__after{z-index:6;z-index:var(--vkui_internal--z_index_form_field_side)}.vkuiFormLayoutGroup--segmented .vkuiFormField{isolation:auto;z-index:auto}.vkuiFormLayoutGroup--segmented .vkuiRemovable__content>.vkuiFormItem:not(:first-of-type):not(:last-of-type) .vkuiFormField,.vkuiFormLayoutGroup--segmented>.vkuiFormItem:not(:first-of-type):not(:last-of-type) .vkuiFormField{border-radius:0}.vkuiFormLayoutGroup--segmented .vkuiRemovable__content>:first-of-type:not(:last-of-type) .vkuiFormField,.vkuiFormLayoutGroup--segmented>:first-of-type:not(:last-of-type) .vkuiFormField{border-bottom-right-radius:0;border-top-right-radius:0}.vkuiFormLayoutGroup--segmented .vkuiRemovable__content>.vkuiFormItem:not(:first-of-type):last-of-type .vkuiFormField,.vkuiFormLayoutGroup--segmented>.vkuiFormItem:not(:first-of-type):last-of-type .vkuiFormField{border-bottom-left-radius:0;border-top-left-radius:0}

package/dist/cssm/components/FormItem/FormItem.module.css

@@ -1 +1 @@
-.vkuiFormItem{display:block;padding:var(--vkui--size_form_item_padding_vertical--regular) var(--vkui--size_base_padding_horizontal--regular)}.vkuiFormItem--removable{padding-left:0;padding-right:0}.vkuiFormItem__removable{flex-basis:0;flex-grow:1;flex-shrink:0;max-width:100%;min-width:1px;overflow:hidden;padding:0}.vkuiFormItem__top{color:var(--vkui--color_text_subhead);overflow:hidden;padding-bottom:8px;padding-top:2px;text-overflow:ellipsis;white-space:nowrap}.vkuiFormItem__bottom{color:var(--vkui--color_text_secondary);padding-top:8px}.vkuiFormItem--status-error .vkuiFormItem__bottom{color:var(--vkui--color_text_negative)}.vkuiFormItem--status-valid .vkuiFormItem__bottom,.vkuiFormItem--verified .vkuiFormItem__bottom{color:var(--vkui--color_text_positive)}.vkuiFormItem--sizeY-compact .vkuiFormItem__top{padding-bottom:6px}.vkuiFormItem--sizeY-compact .vkuiFormItem__bottom{padding-top:6px}@media (max-height:414px),(pointer:fine) and (min-width:768px){.vkuiFormItem--sizeY-none .vkuiFormItem__top{padding-bottom:6px}.vkuiFormItem--sizeY-none .vkuiFormItem__bottom{padding-top:6px}}.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem{flex-basis:0;flex-grow:1;flex-shrink:0;max-width:100%;min-width:1px;padding:0}.vkuiFormLayoutGroup--mode-horizontal:not(.vkuiFormLayoutGroup--segmented) .vkuiFormItem+.vkuiFormItem{margin-left:24px}.vkuiFormItem--withTop .vkuiFormItem__removable,.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--withTop{margin-top:calc(-2px - var(--vkui--font_subhead--line_height--regular) - 8px)}.vkuiFormItem--sizeY-compact.vkuiFormItem--withTop .vkuiFormItem__removable,.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--sizeY-compact.vkuiFormItem--withTop{margin-top:calc(-2px - var(--vkui--font_subhead--line_height--compact) - 6px)}@media (max-height:414px),(pointer:fine) and (min-width:768px){.vkuiFormItem--sizeY-none.vkuiFormItem--withTop .vkuiFormItem__removable,.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--sizeY-none.vkuiFormItem--withTop{margin-top:calc(-2px - var(--vkui--font_subhead--line_height--compact) - 6px)}}
+.vkuiFormItem{display:block;padding:12px 16px;padding:var(--vkui--size_form_item_padding_vertical--regular) var(--vkui--size_base_padding_horizontal--regular)}.vkuiFormItem--removable{padding-left:0;padding-right:0}.vkuiFormItem__removable{flex-basis:0;flex-grow:1;flex-shrink:0;max-width:100%;min-width:1px;overflow:hidden;padding:0}.vkuiFormItem__top{color:#6d7885;color:var(--vkui--color_text_subhead);overflow:hidden;padding-bottom:8px;padding-top:2px;text-overflow:ellipsis;white-space:nowrap}.vkuiFormItem__bottom{color:#818c99;color:var(--vkui--color_text_secondary);padding-top:8px}.vkuiFormItem--status-error .vkuiFormItem__bottom{color:#e64646;color:var(--vkui--color_text_negative)}.vkuiFormItem--status-valid .vkuiFormItem__bottom,.vkuiFormItem--verified .vkuiFormItem__bottom{color:#4bb34b;color:var(--vkui--color_text_positive)}.vkuiFormItem--sizeY-compact .vkuiFormItem__top{padding-bottom:6px}.vkuiFormItem--sizeY-compact .vkuiFormItem__bottom{padding-top:6px}@media (pointer:fine) and (min-width:768px),not (min-height:415px){.vkuiFormItem--sizeY-none .vkuiFormItem__top{padding-bottom:6px}.vkuiFormItem--sizeY-none .vkuiFormItem__bottom{padding-top:6px}}.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem{flex-basis:0;flex-grow:1;flex-shrink:0;max-width:100%;min-width:1px;padding:0}.vkuiFormLayoutGroup--mode-horizontal:not(.vkuiFormLayoutGroup--segmented) .vkuiFormItem+.vkuiFormItem{margin-left:24px}.vkuiFormItem--withTop .vkuiFormItem__removable,.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--withTop{margin-top:calc(-2px - 18px - 8px);margin-top:calc(-2px - var(--vkui--font_subhead--line_height--regular) - 8px)}.vkuiFormItem--sizeY-compact.vkuiFormItem--withTop .vkuiFormItem__removable,.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--sizeY-compact.vkuiFormItem--withTop{margin-top:calc(-2px - 16px - 6px);margin-top:calc(-2px - var(--vkui--font_subhead--line_height--compact) - 6px)}@media (pointer:fine) and (min-width:768px),not (min-height:415px){.vkuiFormItem--sizeY-none.vkuiFormItem--withTop .vkuiFormItem__removable,.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--sizeY-none.vkuiFormItem--withTop{margin-top:calc(-2px - 16px - 6px);margin-top:calc(-2px - var(--vkui--font_subhead--line_height--compact) - 6px)}}

package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.module.css

@@ -1 +1 @@
-.vkuiFormLayoutGroup--mode-horizontal{align-items:flex-start;display:flex;flex-wrap:wrap;isolation:isolate;padding:var(--vkui--size_form_item_padding_vertical--regular) var(--vkui--size_base_padding_horizontal--regular)}.vkuiFormLayoutGroup__removable{flex-grow:1;max-width:100%;min-width:0}.vkuiFormLayoutGroup__offset{display:none}.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--withTop~.vkuiFormLayoutGroup__offset{display:block;height:calc(2px + var(--vkui--font_subhead--line_height--regular) + 8px);min-width:100%;order:-1}.vkuiFormLayoutGroup--sizeY-compact.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--withTop~.vkuiFormLayoutGroup__offset{height:calc(2px + var(--vkui--font_subhead--line_height--compact) + 6px)}@media (max-height:414px),(pointer:fine) and (min-width:768px){.vkuiFormLayoutGroup--sizeY-none.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--withTop~.vkuiFormLayoutGroup__offset{height:calc(2px + var(--vkui--font_subhead--line_height--compact) + 6px)}}.vkuiFormLayoutGroup--removable{padding-left:0;padding-right:0}.vkuiFormLayoutGroup--segmented{position:relative}.vkuiFormLayoutGroup--segmented>*{flex:1;min-width:0}.vkuiFormLayoutGroup--segmented>:not(:first-child):not(.vkuiFormLayoutGroup__offset){margin-left:calc(-1 * 1px);margin-left:calc(-1 * var(--vkui_internal--thin_border))}
+.vkuiFormLayoutGroup--mode-horizontal{align-items:flex-start;display:flex;flex-wrap:wrap;isolation:isolate;padding:12px 16px;padding:var(--vkui--size_form_item_padding_vertical--regular) var(--vkui--size_base_padding_horizontal--regular)}.vkuiFormLayoutGroup__removable{flex-grow:1;max-width:100%;min-width:0}.vkuiFormLayoutGroup__offset{display:none}.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--withTop~.vkuiFormLayoutGroup__offset{display:block;height:calc(2px + 18px + 8px);height:calc(2px + var(--vkui--font_subhead--line_height--regular) + 8px);min-width:100%;order:-1}.vkuiFormLayoutGroup--sizeY-compact.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--withTop~.vkuiFormLayoutGroup__offset{height:calc(2px + 16px + 6px);height:calc(2px + var(--vkui--font_subhead--line_height--compact) + 6px)}@media (pointer:fine) and (min-width:768px),not (min-height:415px){.vkuiFormLayoutGroup--sizeY-none.vkuiFormLayoutGroup--mode-horizontal .vkuiFormItem--withTop~.vkuiFormLayoutGroup__offset{height:calc(2px + 16px + 6px);height:calc(2px + var(--vkui--font_subhead--line_height--compact) + 6px)}}.vkuiFormLayoutGroup--removable{padding-left:0;padding-right:0}.vkuiFormLayoutGroup--segmented{position:relative}.vkuiFormLayoutGroup--segmented>*{flex:1;min-width:0}.vkuiFormLayoutGroup--segmented>:not(:first-child):not(.vkuiFormLayoutGroup__offset){margin-left:calc(-1 * 1px);margin-left:calc(-1 * var(--vkui_internal--thin_border))}

package/dist/cssm/components/FormStatus/FormStatus.module.css

@@ -1 +1 @@
-.vkuiFormStatus--mode-error{color:var(--vkui--color_background_negative)}
+.vkuiFormStatus--mode-error{color:#e64646;color:var(--vkui--color_background_negative)}

package/dist/cssm/components/Gradient/Gradient.module.css

@@ -1 +1 @@
-.vkuiGradient--mode-tint.vkuiGradient--to-top{background:linear-gradient(to bottom,var(--vkui--gradient_tint))}.vkuiGradient--mode-tint.vkuiGradient--to-bottom{background:linear-gradient(to top,var(--vkui--gradient_tint))}.vkuiGradient--mode-white.vkuiGradient--to-top{background:linear-gradient(to bottom,var(--vkui--gradient_white))}.vkuiGradient--mode-white.vkuiGradient--to-bottom{background:linear-gradient(to top,var(--vkui--gradient_white))}.vkuiGradient--mode-black.vkuiGradient--to-top{background:linear-gradient(to bottom,var(--vkui--gradient_black))}.vkuiGradient--mode-black.vkuiGradient--to-bottom{background:linear-gradient(to top,var(--vkui--gradient_black))}
+.vkuiGradient--mode-tint.vkuiGradient--to-top{background:linear-gradient(180deg,hsla(0,0%,98%,0) 0,hsla(0,0%,98%,.036) 13%,hsla(0,0%,98%,.15) 27%,hsla(0,0%,98%,.79) 68%,hsla(0,0%,98%,.95) 84%,#f9f9f9);background:linear-gradient(to bottom,var(--vkui--gradient_tint))}.vkuiGradient--mode-tint.vkuiGradient--to-bottom{background:linear-gradient(0deg,hsla(0,0%,98%,0) 0,hsla(0,0%,98%,.036) 13%,hsla(0,0%,98%,.15) 27%,hsla(0,0%,98%,.79) 68%,hsla(0,0%,98%,.95) 84%,#f9f9f9);background:linear-gradient(to top,var(--vkui--gradient_tint))}.vkuiGradient--mode-white.vkuiGradient--to-top{background:linear-gradient(180deg,hsla(0,0%,100%,0) 0,hsla(0,0%,100%,.036) 13%,hsla(0,0%,100%,.15) 27%,hsla(0,0%,100%,.79) 68%,hsla(0,0%,100%,.95) 84%,#fff);background:linear-gradient(to bottom,var(--vkui--gradient_white))}.vkuiGradient--mode-white.vkuiGradient--to-bottom{background:linear-gradient(0deg,hsla(0,0%,100%,0) 0,hsla(0,0%,100%,.036) 13%,hsla(0,0%,100%,.15) 27%,hsla(0,0%,100%,.79) 68%,hsla(0,0%,100%,.95) 84%,#fff);background:linear-gradient(to top,var(--vkui--gradient_white))}.vkuiGradient--mode-black.vkuiGradient--to-top{background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.014) 13%,rgba(0,0,0,.06) 27%,rgba(0,0,0,.316) 68%,rgba(0,0,0,.38) 84%,rgba(0,0,0,.4));background:linear-gradient(to bottom,var(--vkui--gradient_black))}.vkuiGradient--mode-black.vkuiGradient--to-bottom{background:linear-gradient(0deg,transparent 0,rgba(0,0,0,.014) 13%,rgba(0,0,0,.06) 27%,rgba(0,0,0,.316) 68%,rgba(0,0,0,.38) 84%,rgba(0,0,0,.4));background:linear-gradient(to top,var(--vkui--gradient_black))}

package/dist/cssm/components/Group/Group.module.css

@@ -1 +1 @@
-.vkuiGroup{color:var(--vkui--color_text_primary)}.vkuiGroup__separator--separator,.vkuiGroup__separator--spacing{display:none}.vkuiGroup--mode-plain>.vkuiGroup__separator--separator,.vkuiGroup--sizeX-compact>.vkuiGroup__separator--separator{display:block}@media (max-width:767px){.vkuiGroup--sizeX-none>.vkuiGroup__separator--separator{display:block}}.vkuiGroup--sizeX-regular.vkuiGroup--mode-none>.vkuiGroup__separator--spacing{display:block}@media (min-width:768px){.vkuiGroup--sizeX-none.vkuiGroup--mode-none>.vkuiGroup__separator--spacing{display:block}}.vkuiGroup__inner{padding-bottom:8px;padding-top:8px}.vkuiGroup--mode-card.vkuiGroup--padding-s>.vkuiGroup__inner{padding:4px}.vkuiGroup--mode-card.vkuiGroup--padding-m>.vkuiGroup__inner{padding:8px}.vkuiGroup--sizeX-compact>.vkuiGroup__inner{padding-left:0;padding-right:0}@media (min-width:768px){.vkuiGroup--sizeX-none.vkuiGroup--padding-s>.vkuiGroup__inner{padding:4px}.vkuiGroup--sizeX-none.vkuiGroup--padding-m>.vkuiGroup__inner{padding:8px}}.vkuiGroup--mode-card>.vkuiGroup__inner{background:var(--vkui--color_background_content);border-radius:var(--vkui--size_border_radius_paper--regular);position:relative}@media (min-width:768px){.vkuiGroup--mode-none.vkuiGroup--sizeX-none>.vkuiGroup__inner{background:var(--vkui--color_background_content);border-radius:var(--vkui--size_border_radius_paper--regular);position:relative}}.vkuiGroup--mode-card>.vkuiGroup__inner:after{border-radius:inherit;box-shadow:inset 0 0 0 1px var(--vkui--color_separator_primary);box-shadow:inset 0 0 0 var(--vkui_internal--thin_border) var(--vkui--color_separator_primary);content:"";height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}@media (min-width:768px){.vkuiGroup--mode-none>.vkuiGroup__inner:after{border-radius:inherit;box-shadow:inset 0 0 0 1px var(--vkui--color_field_border_alpha);box-shadow:inset 0 0 0 var(--vkui_internal--thin_border) var(--vkui--color_field_border_alpha);content:"";height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}}.vkuiGroup--mode-plain>.vkuiGroup__separator{padding-bottom:8px;padding-top:8px}@media (max-width:767px){.vkuiGroup--sizeX-none.vkuiGroup--mode-none>.vkuiGroup__separator{padding-bottom:8px;padding-top:8px}}.vkuiGroup:last-of-type>.vkuiGroup__separator{display:none}.vkuiGroup--sizeX-regular.vkuiGroup--mode-card:last-of-type>.vkuiGroup__separator--spacing,.vkuiGroup--sizeX-regular.vkuiGroup--mode-none:last-of-type>.vkuiGroup__separator--spacing,.vkuiGroup:last-of-type>.vkuiGroup__separator--force{display:block}@media (min-width:768px){.vkuiGroup--sizeX-none.vkuiGroup--mode-card:last-of-type>.vkuiGroup__separator--spacing,.vkuiGroup--sizeX-none.vkuiGroup--mode-none:last-of-type>.vkuiGroup__separator--spacing{display:block}}.vkuiGroup__description{color:var(--vkui--color_text_secondary);display:block;padding:4px 16px 16px}.vkuiGroup .vkuiGroup>.vkuiGroup__inner,.vkuiGroup .vkuiGroup>.vkuiGroup__separator{padding-left:0;padding-right:0}.vkuiGroup .vkuiGroup:first-of-type>.vkuiGroup__inner{padding-top:0}.vkuiGroup .vkuiGroup:last-of-type>.vkuiGroup__inner{padding-bottom:0}.vkuiGroup--ios .vkuiGroup__description{padding:4px 12px 16px}.vkuiPanelHeader--vkcom+* .vkuiGroup:first-of-type,.vkuiPanelHeader--vkcom~.vkuiGroup:first-of-type{position:relative;top:-1px}.vkuiPanelHeader--vkcom+* .vkuiGroup:first-of-type .vkuiGroup__inner,.vkuiPanelHeader--vkcom~.vkuiGroup:first-of-type .vkuiGroup__inner{border-top-left-radius:0;border-top-right-radius:0}
+.vkuiGroup{color:#000;color:var(--vkui--color_text_primary)}.vkuiGroup__separator--separator,.vkuiGroup__separator--spacing{display:none}.vkuiGroup--mode-plain>.vkuiGroup__separator--separator,.vkuiGroup--sizeX-compact>.vkuiGroup__separator--separator{display:block}@media not (min-width:768px){.vkuiGroup--sizeX-none>.vkuiGroup__separator--separator{display:block}}.vkuiGroup--sizeX-regular.vkuiGroup--mode-none>.vkuiGroup__separator--spacing{display:block}@media (min-width:768px){.vkuiGroup--sizeX-none.vkuiGroup--mode-none>.vkuiGroup__separator--spacing{display:block}}.vkuiGroup__inner{padding-bottom:8px;padding-top:8px}.vkuiGroup--mode-card.vkuiGroup--padding-s>.vkuiGroup__inner{padding:4px}.vkuiGroup--mode-card.vkuiGroup--padding-m>.vkuiGroup__inner{padding:8px}.vkuiGroup--sizeX-compact>.vkuiGroup__inner{padding-left:0;padding-right:0}@media (min-width:768px){.vkuiGroup--sizeX-none.vkuiGroup--padding-s>.vkuiGroup__inner{padding:4px}.vkuiGroup--sizeX-none.vkuiGroup--padding-m>.vkuiGroup__inner{padding:8px}}.vkuiGroup--mode-card>.vkuiGroup__inner{background:#fff;background:var(--vkui--color_background_content);border-radius:12px;border-radius:var(--vkui--size_border_radius_paper--regular);position:relative}@media (min-width:768px){.vkuiGroup--mode-none.vkuiGroup--sizeX-none>.vkuiGroup__inner{background:#fff;background:var(--vkui--color_background_content);border-radius:12px;border-radius:var(--vkui--size_border_radius_paper--regular);position:relative}}.vkuiGroup--mode-card>.vkuiGroup__inner:after{border-radius:inherit;box-shadow:inset 0 0 0 1px #d7d8d9;box-shadow:inset 0 0 0 var(--vkui_internal--thin_border) var(--vkui--color_separator_primary);content:"";height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}@media (min-width:768px){.vkuiGroup--mode-none>.vkuiGroup__inner:after{border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);box-shadow:inset 0 0 0 var(--vkui_internal--thin_border) var(--vkui--color_field_border_alpha);content:"";height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}}.vkuiGroup--mode-plain>.vkuiGroup__separator{padding-bottom:8px;padding-top:8px}@media not (min-width:768px){.vkuiGroup--sizeX-none.vkuiGroup--mode-none>.vkuiGroup__separator{padding-bottom:8px;padding-top:8px}}.vkuiGroup:last-of-type>.vkuiGroup__separator{display:none}.vkuiGroup--sizeX-regular.vkuiGroup--mode-card:last-of-type>.vkuiGroup__separator--spacing,.vkuiGroup--sizeX-regular.vkuiGroup--mode-none:last-of-type>.vkuiGroup__separator--spacing,.vkuiGroup:last-of-type>.vkuiGroup__separator--force{display:block}@media (min-width:768px){.vkuiGroup--sizeX-none.vkuiGroup--mode-card:last-of-type>.vkuiGroup__separator--spacing,.vkuiGroup--sizeX-none.vkuiGroup--mode-none:last-of-type>.vkuiGroup__separator--spacing{display:block}}.vkuiGroup__description{color:#818c99;color:var(--vkui--color_text_secondary);display:block;padding:4px 16px 16px}.vkuiGroup .vkuiGroup>.vkuiGroup__inner,.vkuiGroup .vkuiGroup>.vkuiGroup__separator{padding-left:0;padding-right:0}.vkuiGroup .vkuiGroup:first-of-type>.vkuiGroup__inner{padding-top:0}.vkuiGroup .vkuiGroup:last-of-type>.vkuiGroup__inner{padding-bottom:0}.vkuiGroup--ios .vkuiGroup__description{padding:4px 12px 16px}.vkuiPanelHeader--vkcom+* .vkuiGroup:first-of-type,.vkuiPanelHeader--vkcom~.vkuiGroup:first-of-type{position:relative;top:-1px}.vkuiPanelHeader--vkcom+* .vkuiGroup:first-of-type .vkuiGroup__inner,.vkuiPanelHeader--vkcom~.vkuiGroup:first-of-type .vkuiGroup__inner{border-top-left-radius:0;border-top-right-radius:0}

package/dist/cssm/components/Header/Header.module.css

@@ -1 +1 @@
-.vkuiHeader{align-items:baseline;display:flex;font-family:var(--vkui--font_family_base);justify-content:space-between;padding:0;padding-left:var(--vkui--size_base_padding_horizontal--regular);padding-right:var(--vkui--size_base_padding_horizontal--regular);-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.vkuiHeader__main{color:var(--vkui--color_text_primary);min-width:0;overflow:hidden;text-overflow:ellipsis}.vkuiHeader__content{align-items:baseline;display:flex}.vkuiHeader__content-in{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiHeader__content-in--multiline{white-space:normal;word-break:break-word}.vkuiHeader--multiline{white-space:normal}.vkuiHeader__subtitle{color:var(--vkui--color_text_secondary)}.vkuiHeader--mode-primary .vkuiHeader__content:not(:last-child){margin-top:-1px}.vkuiHeader--mode-secondary:not(.vkuiHeader--pi) .vkuiHeader__main,.vkuiHeader--mode-tertiary .vkuiHeader__main,.vkuiHeader__indicator{color:var(--vkui--color_text_secondary)}.vkuiHeader__indicator{flex-shrink:0;margin-left:6px}.vkuiHeader--mode-primary .vkuiHeader__indicator{color:var(--vkui--color_text_subhead)}.vkuiHeader:not(.vkuiHeader--pi) .vkuiHeader__indicator{align-self:center}.vkuiHeader--mode-secondary .vkuiHeader__indicator{margin-left:8px}.vkuiHeader__aside{margin-left:12px;white-space:nowrap}.vkuiHeader__aside>.vkuiIcon{color:var(--vkui--color_icon_secondary);position:relative}.vkuiHeader__aside>.vkuiIcon--24{top:3px}.vkuiHeader__aside>.vkuiIcon--16{top:1px}.vkuiHeader--android .vkuiHeader__main{margin:15px 0 9px}.vkuiHeader--android.vkuiHeader--mode-tertiary .vkuiHeader__main{margin-top:11px}.vkuiHeader--ios .vkuiHeader__main{margin:13px 0 9px}.vkuiHeader--ios.vkuiHeader--mode-secondary .vkuiHeader__main{margin:14px 0 10px}.vkuiHeader--ios.vkuiHeader--mode-tertiary .vkuiHeader__main{margin-top:9px}.vkuiHeader--vkcom{align-items:center;height:64px}.vkuiHeader--vkcom .vkuiHeader__main{color:var(--vkui--color_text_primary)}.vkuiHeader--vkcom.vkuiHeader--mode-primary .vkuiHeader__content:not(:last-child){margin-top:0}.vkuiHeader--vkcom.vkuiHeader--mode-secondary{height:56px}.vkuiHeader--vkcom.vkuiHeader--mode-tertiary{height:40px}.vkuiGroup--mode-plain:not(:first-of-type) .vkuiGroup__inner>.vkuiHeader:first-child{margin-top:-16px}@media (max-width:767px){.vkuiGroup--mode-none:not(:first-of-type) .vkuiGroup__inner>.vkuiHeader:first-child{margin-top:-16px}}.vkuiGroup--mode-card>.vkuiGroup__inner>.vkuiHeader:not(.vkuiHeader--mode-tertiary):first-child{margin-top:-4px}@media (min-width:768px){.vkuiGroup--mode-none>.vkuiGroup__inner>.vkuiHeader:not(.vkuiHeader--mode-tertiary):first-child{margin-top:-4px}}
+.vkuiHeader{align-items:baseline;display:flex;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);justify-content:space-between;padding:0 0 0 16px;padding-left:var(--vkui--size_base_padding_horizontal--regular);padding-right:16px;padding-right:var(--vkui--size_base_padding_horizontal--regular);-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.vkuiHeader__main{color:#000;color:var(--vkui--color_text_primary);min-width:0;overflow:hidden;text-overflow:ellipsis}.vkuiHeader__content{align-items:baseline;display:flex}.vkuiHeader__content-in{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiHeader__content-in--multiline{white-space:normal;word-break:break-word}.vkuiHeader--multiline{white-space:normal}.vkuiHeader__subtitle{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiHeader--mode-primary .vkuiHeader__content:not(:last-child){margin-top:-1px}.vkuiHeader--mode-secondary:not(.vkuiHeader--pi) .vkuiHeader__main,.vkuiHeader--mode-tertiary .vkuiHeader__main,.vkuiHeader__indicator{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiHeader__indicator{flex-shrink:0;margin-left:6px}.vkuiHeader--mode-primary .vkuiHeader__indicator{color:#6d7885;color:var(--vkui--color_text_subhead)}.vkuiHeader:not(.vkuiHeader--pi) .vkuiHeader__indicator{align-self:center}.vkuiHeader--mode-secondary .vkuiHeader__indicator{margin-left:8px}.vkuiHeader__aside{margin-left:12px;white-space:nowrap}.vkuiHeader__aside>.vkuiIcon{color:#99a2ad;color:var(--vkui--color_icon_secondary);position:relative}.vkuiHeader__aside>.vkuiIcon--24{top:3px}.vkuiHeader__aside>.vkuiIcon--16{top:1px}.vkuiHeader--android .vkuiHeader__main{margin:15px 0 9px}.vkuiHeader--android.vkuiHeader--mode-tertiary .vkuiHeader__main{margin-top:11px}.vkuiHeader--ios .vkuiHeader__main{margin:13px 0 9px}.vkuiHeader--ios.vkuiHeader--mode-secondary .vkuiHeader__main{margin:14px 0 10px}.vkuiHeader--ios.vkuiHeader--mode-tertiary .vkuiHeader__main{margin-top:9px}.vkuiHeader--vkcom{align-items:center;height:64px}.vkuiHeader--vkcom .vkuiHeader__main{color:#000;color:var(--vkui--color_text_primary)}.vkuiHeader--vkcom.vkuiHeader--mode-primary .vkuiHeader__content:not(:last-child){margin-top:0}.vkuiHeader--vkcom.vkuiHeader--mode-secondary{height:56px}.vkuiHeader--vkcom.vkuiHeader--mode-tertiary{height:40px}.vkuiGroup--mode-plain:not(:first-of-type) .vkuiGroup__inner>.vkuiHeader:first-child{margin-top:-16px}@media not (min-width:768px){.vkuiGroup--mode-none:not(:first-of-type) .vkuiGroup__inner>.vkuiHeader:first-child{margin-top:-16px}}.vkuiGroup--mode-card>.vkuiGroup__inner>.vkuiHeader:not(.vkuiHeader--mode-tertiary):first-child{margin-top:-4px}@media (min-width:768px){.vkuiGroup--mode-none>.vkuiGroup__inner>.vkuiHeader:not(.vkuiHeader--mode-tertiary):first-child{margin-top:-4px}}

package/dist/cssm/components/HorizontalCell/HorizontalCell.module.css

@@ -1 +1 @@
-.vkuiHorizontalCell{display:flex;font-family:var(--vkui--font_family_base)}.vkuiHorizontalCell__image{display:flex;justify-content:center}.vkuiHorizontalCell__body{font-family:inherit;text-decoration:none}.vkuiHorizontalCell__content{color:var(--vkui--color_text_primary);text-overflow:ellipsis;word-break:break-all}.vkuiHorizontalCell__subtitle{color:var(--vkui--color_text_secondary)}.vkuiHorizontalCell__content .vkuiHorizontalCell__subtitle{margin-top:2px}.vkuiHorizontalCell--size-s{max-width:80px}.vkuiHorizontalCell__image{padding:4px 6px}.vkuiHorizontalCell__content{padding:2px 6px 8px;text-align:left}.vkuiHorizontalCell--size-s .vkuiHorizontalCell__image{padding:4px 8px}.vkuiHorizontalCell--size-s .vkuiHorizontalCell__content{padding:2px 4px 8px;text-align:center}.vkuiHorizontalCell--size-m{width:100px}.vkuiHorizontalCell--size-l{width:auto}.vkuiHorizontalCell:first-child:before,.vkuiHorizontalCell:last-child:after{content:"";min-width:10px}.vkuiHorizontalCell--size-s:first-child:before,.vkuiHorizontalCell--size-s:last-child:after{min-width:8px}.vkuiHorizontalCell--size-s:first-child,.vkuiHorizontalCell--size-s:last-child{max-width:88px}.vkuiHorizontalCell--size-m:first-child,.vkuiHorizontalCell--size-m:last-child{width:110px}
+.vkuiHorizontalCell{display:flex;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base)}.vkuiHorizontalCell__image{display:flex;justify-content:center}.vkuiHorizontalCell__body{font-family:inherit;text-decoration:none}.vkuiHorizontalCell__content{color:#000;color:var(--vkui--color_text_primary);text-overflow:ellipsis;word-break:break-all}.vkuiHorizontalCell__subtitle{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiHorizontalCell__content .vkuiHorizontalCell__subtitle{margin-top:2px}.vkuiHorizontalCell--size-s{max-width:80px}.vkuiHorizontalCell__image{padding:4px 6px}.vkuiHorizontalCell__content{padding:2px 6px 8px;text-align:left}.vkuiHorizontalCell--size-s .vkuiHorizontalCell__image{padding:4px 8px}.vkuiHorizontalCell--size-s .vkuiHorizontalCell__content{padding:2px 4px 8px;text-align:center}.vkuiHorizontalCell--size-m{width:100px}.vkuiHorizontalCell--size-l{width:auto}.vkuiHorizontalCell:first-child:before,.vkuiHorizontalCell:last-child:after{content:"";min-width:10px}.vkuiHorizontalCell--size-s:first-child:before,.vkuiHorizontalCell--size-s:last-child:after{min-width:8px}.vkuiHorizontalCell--size-s:first-child,.vkuiHorizontalCell--size-s:last-child{max-width:88px}.vkuiHorizontalCell--size-m:first-child,.vkuiHorizontalCell--size-m:last-child{width:110px}

package/dist/cssm/components/HorizontalScroll/HorizontalScroll.module.css

@@ -1 +1 @@
-.vkuiHorizontalScroll{overflow-x:hidden;position:relative}.vkuiHorizontalScroll__in{-webkit-overflow-scrolling:touch;overflow-x:auto;scrollbar-width:none}.vkuiHorizontalScroll__in::-webkit-scrollbar{display:none}.vkuiHorizontalScroll__in-wrapper{transition:transform .2s}.vkuiHorizontalScroll__arrowLeft:hover~.vkuiHorizontalScroll__in .vkuiHorizontalScroll__in-wrapper{transform:translateX(8px)}.vkuiHorizontalScroll__arrowRight:hover~.vkuiHorizontalScroll__in .vkuiHorizontalScroll__in-wrapper{transform:translateX(-8px)}.vkuiTabs .vkuiHorizontalScroll{min-width:100%}.vkuiTabs__in .vkuiHorizontalScroll__in-wrapper{align-items:stretch;display:flex}.vkuiTabs--sizeX-compact.vkuiTabs--withGaps .vkuiHorizontalScroll__in-wrapper:after,.vkuiTabs--sizeX-compact.vkuiTabs--withGaps .vkuiHorizontalScroll__in-wrapper:before{content:"";display:block;flex-shrink:0;height:1px;width:8px}@media (max-width:767px){.vkuiTabs--sizeX-none.vkuiTabs--withGaps .vkuiHorizontalScroll__in-wrapper:after,.vkuiTabs--sizeX-none.vkuiTabs--withGaps .vkuiHorizontalScroll__in-wrapper:before{content:"";display:block;flex-shrink:0;height:1px;width:8px}}
+.vkuiHorizontalScroll{overflow-x:hidden;position:relative}.vkuiHorizontalScroll__in{-webkit-overflow-scrolling:touch;overflow-x:auto;scrollbar-width:none}.vkuiHorizontalScroll__in::-webkit-scrollbar{display:none}.vkuiHorizontalScroll__in-wrapper{transition:transform .2s}.vkuiHorizontalScroll__arrowLeft:hover~.vkuiHorizontalScroll__in .vkuiHorizontalScroll__in-wrapper{transform:translateX(8px)}.vkuiHorizontalScroll__arrowRight:hover~.vkuiHorizontalScroll__in .vkuiHorizontalScroll__in-wrapper{transform:translateX(-8px)}.vkuiTabs .vkuiHorizontalScroll{min-width:100%}.vkuiTabs__in .vkuiHorizontalScroll__in-wrapper{align-items:stretch;display:flex}.vkuiTabs--withGaps .vkuiHorizontalScroll__in-wrapper:after,.vkuiTabs--withGaps .vkuiHorizontalScroll__in-wrapper:before{content:"";display:block;flex-shrink:0;height:1px;width:16px;width:var(--vkui--size_base_padding_horizontal--regular)}

package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.module.css

@@ -1 +1 @@
-.vkuiHorizontalScrollArrow{background-color:initial;border:none;cursor:pointer;display:flex;flex-direction:column;height:100%;justify-content:center;opacity:0;padding:0;position:absolute;top:0;transition:opacity .15s;transition-timing-function:var(--vkui--animation_easing_platform);-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.vkuiHorizontalScrollArrow__icon{align-items:center;background-color:var(--vkui--color_background_modal);box-shadow:var(--vkui--elevation3);color:var(--vkui--color_icon_secondary);display:flex;justify-content:center}.vkuiHorizontalScrollArrow--size-m .vkuiHorizontalScrollArrow__icon{border-radius:14px;height:28px;width:28px}.vkuiHorizontalScrollArrow--size-l .vkuiHorizontalScrollArrow__icon{border-radius:24px;height:40px;width:40px}.vkuiHorizontalScrollArrow--direction-left{left:0;padding-left:16px;padding-left:var(--vkui--size_base_padding_horizontal--regular,16px)}.vkuiHorizontalScrollArrow--direction-right{padding-right:16px;padding-right:var(--vkui--size_base_padding_horizontal--regular,16px);right:0}.vkuiBaseGallery:hover .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll:hover .vkuiHorizontalScrollArrow{opacity:var(--vkui--opacity_disable_accessibility)}.vkuiBaseGallery:hover .vkuiHorizontalScrollArrow:hover,.vkuiHorizontalScroll--withConstArrows .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll--withConstArrows:hover .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll:hover .vkuiHorizontalScrollArrow:hover{opacity:1}
+.vkuiHorizontalScrollArrow{background-color:initial;border:none;cursor:pointer;display:flex;flex-direction:column;height:100%;justify-content:center;opacity:0;padding:0;position:absolute;top:0;transition:opacity .15s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:var(--vkui--animation_easing_platform);-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.vkuiHorizontalScrollArrow__icon{align-items:center;background-color:#fff;background-color:var(--vkui--color_background_modal);box-shadow:0 0 2px rgba(0,0,0,.08),0 4px 16px rgba(0,0,0,.08);box-shadow:var(--vkui--elevation3);color:#99a2ad;color:var(--vkui--color_icon_secondary);display:flex;justify-content:center}.vkuiHorizontalScrollArrow--size-m .vkuiHorizontalScrollArrow__icon{border-radius:14px;height:28px;width:28px}.vkuiHorizontalScrollArrow--size-l .vkuiHorizontalScrollArrow__icon{border-radius:24px;height:40px;width:40px}.vkuiHorizontalScrollArrow--direction-left{left:0;padding-left:16px;padding-left:var(--vkui--size_base_padding_horizontal--regular,16px)}.vkuiHorizontalScrollArrow--direction-right{padding-right:16px;padding-right:var(--vkui--size_base_padding_horizontal--regular,16px);right:0}.vkuiBaseGallery:hover .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll:hover .vkuiHorizontalScrollArrow{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiBaseGallery:hover .vkuiHorizontalScrollArrow:hover,.vkuiHorizontalScroll--withConstArrows .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll--withConstArrows:hover .vkuiHorizontalScrollArrow,.vkuiHorizontalScroll:hover .vkuiHorizontalScrollArrow:hover{opacity:1}

package/dist/cssm/components/IconButton/IconButton.js

@@ -8,7 +8,10 @@ import { usePlatform } from '../../hooks/usePlatform';
 import { Platform } from '../../lib/platform';
 import { getSizeYClassName } from '../../helpers/getSizeYClassName';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
+import { COMMON_WARNINGS, warnOnce } from '../../lib/warnOnce';
 import "./IconButton.module.css";
+var warn = warnOnce('IconButton');
+
 /**
  * @see https://vkcom.github.io/VKUI/#/IconButton
  */
@@ -21,6 +24,12 @@ export var IconButton = function IconButton(_ref) {
   var platform = usePlatform();
   var _useAdaptivity = useAdaptivity(),
     sizeY = _useAdaptivity.sizeY;
+  if (process.env.NODE_ENV === 'development') {
+    var isAccessible = restProps['aria-label'] || restProps['aria-labelledby'];
+    if (!isAccessible) {
+      warn(COMMON_WARNINGS.a11y[restProps.href ? 'link-name' : 'button-name'], 'error');
+    }
+  }
   return /*#__PURE__*/React.createElement(Tappable, _extends({
     activeEffectDelay: 200,
     activeMode: "background"

package/dist/cssm/components/IconButton/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.js","names":["React","Tappable","classNames","usePlatform","Platform","getSizeYClassName","useAdaptivity","IconButton","children","Component","className","restProps","platform","sizeY","href","IOS"],"sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { TappableProps, Tappable } from '../Tappable/Tappable';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { getSizeYClassName } from '../../helpers/getSizeYClassName';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport styles from './IconButton.module.css';\n\nexport interface IconButtonProps extends TappableProps {\n  children?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/IconButton\n */\nexport const IconButton = ({\n  children,\n  Component = 'button',\n  className,\n  ...restProps\n}: IconButtonProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n\n  return (\n    <Tappable\n      activeEffectDelay={200}\n      activeMode=\"background\"\n      {...restProps}\n      Component={restProps.href ? 'a' : Component}\n      className={classNames(\n        styles['IconButton'],\n        getSizeYClassName(styles['IconButton'], sizeY),\n        platform === Platform.IOS && styles['IconButton--ios'],\n        className,\n      )}\n    >\n      {children}\n    </Tappable>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAAwBC,QAAQ,QAAQ,sBAAsB;AAC9D,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,iBAAiB,QAAQ,iCAAiC;AACnE,SAASC,aAAa,QAAQ,2BAA2B;AAAC;AAO1D;AACA;AACA;AACA,OAAO,IAAMC,UAAU,GAAG,SAAbA,UAAU,OAKA;EAAA,IAJrBC,QAAQ,QAARA,QAAQ;IAAA,sBACRC,SAAS;IAATA,SAAS,+BAAG,QAAQ;IACpBC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAGT,WAAW,EAAE;EAC9B,qBAAkBG,aAAa,EAAE;IAAzBO,KAAK,kBAALA,KAAK;EAEb,oBACE,oBAAC,QAAQ;IACP,iBAAiB,EAAE,GAAI;IACvB,UAAU,EAAC;EAAY,GACnBF,SAAS;IACb,SAAS,EAAEA,SAAS,CAACG,IAAI,GAAG,GAAG,GAAGL,SAAU;IAC5C,SAAS,EAAEP,UAAU,mBAEnBG,iBAAiB,mBAAuBQ,KAAK,CAAC,EAC9CD,QAAQ,KAAKR,QAAQ,CAACW,GAAG,yBAA6B,EACtDL,SAAS;EACT,IAEDF,QAAQ,CACA;AAEf,CAAC"}
+{"version":3,"file":"IconButton.js","names":["React","Tappable","classNames","usePlatform","Platform","getSizeYClassName","useAdaptivity","COMMON_WARNINGS","warnOnce","warn","IconButton","children","Component","className","restProps","platform","sizeY","process","env","NODE_ENV","isAccessible","a11y","href","IOS"],"sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { TappableProps, Tappable } from '../Tappable/Tappable';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { getSizeYClassName } from '../../helpers/getSizeYClassName';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { COMMON_WARNINGS, warnOnce } from '../../lib/warnOnce';\nimport styles from './IconButton.module.css';\n\nexport interface IconButtonProps extends TappableProps {\n  children?: React.ReactNode;\n}\n\nconst warn = warnOnce('IconButton');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/IconButton\n */\nexport const IconButton = ({\n  children,\n  Component = 'button',\n  className,\n  ...restProps\n}: IconButtonProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n\n  if (process.env.NODE_ENV === 'development') {\n    const isAccessible = restProps['aria-label'] || restProps['aria-labelledby'];\n\n    if (!isAccessible) {\n      warn(COMMON_WARNINGS.a11y[restProps.href ? 'link-name' : 'button-name'], 'error');\n    }\n  }\n\n  return (\n    <Tappable\n      activeEffectDelay={200}\n      activeMode=\"background\"\n      {...restProps}\n      Component={restProps.href ? 'a' : Component}\n      className={classNames(\n        styles['IconButton'],\n        getSizeYClassName(styles['IconButton'], sizeY),\n        platform === Platform.IOS && styles['IconButton--ios'],\n        className,\n      )}\n    >\n      {children}\n    </Tappable>\n  );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAAwBC,QAAQ,QAAQ,sBAAsB;AAC9D,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,iBAAiB,QAAQ,iCAAiC;AACnE,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,eAAe,EAAEC,QAAQ,QAAQ,oBAAoB;AAAC;AAO/D,IAAMC,IAAI,GAAGD,QAAQ,CAAC,YAAY,CAAC;;AAEnC;AACA;AACA;AACA,OAAO,IAAME,UAAU,GAAG,SAAbA,UAAU,OAKA;EAAA,IAJrBC,QAAQ,QAARA,QAAQ;IAAA,sBACRC,SAAS;IAATA,SAAS,+BAAG,QAAQ;IACpBC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAGZ,WAAW,EAAE;EAC9B,qBAAkBG,aAAa,EAAE;IAAzBU,KAAK,kBAALA,KAAK;EAEb,IAAIC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,aAAa,EAAE;IAC1C,IAAMC,YAAY,GAAGN,SAAS,CAAC,YAAY,CAAC,IAAIA,SAAS,CAAC,iBAAiB,CAAC;IAE5E,IAAI,CAACM,YAAY,EAAE;MACjBX,IAAI,CAACF,eAAe,CAACc,IAAI,CAACP,SAAS,CAACQ,IAAI,GAAG,WAAW,GAAG,aAAa,CAAC,EAAE,OAAO,CAAC;IACnF;EACF;EAEA,oBACE,oBAAC,QAAQ;IACP,iBAAiB,EAAE,GAAI;IACvB,UAAU,EAAC;EAAY,GACnBR,SAAS;IACb,SAAS,EAAEA,SAAS,CAACQ,IAAI,GAAG,GAAG,GAAGV,SAAU;IAC5C,SAAS,EAAEV,UAAU,mBAEnBG,iBAAiB,mBAAuBW,KAAK,CAAC,EAC9CD,QAAQ,KAAKX,QAAQ,CAACmB,GAAG,yBAA6B,EACtDV,SAAS;EACT,IAEDF,QAAQ,CACA;AAEf,CAAC"}

package/dist/cssm/components/IconButton/IconButton.module.css

@@ -1 +1 @@
-.vkuiIconButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;border-radius:9999px;box-shadow:none;color:currentColor;display:block;height:48px;margin:0;padding:0;position:relative}.vkuiIconButton--sizeY-compact{height:44px}.vkuiIconButton[disabled]{opacity:var(--vkui--opacity_disable_accessibility)}.vkuiIconButton--ios{border-radius:var(--vkui--size_border_radius--regular)}.vkuiIconButton .vkuiIcon--16{padding:16px}.vkuiIconButton .vkuiIcon--16.vkuiIcon--w-8{padding:16px 14px}.vkuiIconButton--sizeY-compact .vkuiIcon--16,.vkuiIconButton--sizeY-compact .vkuiIcon--16.vkuiIcon--w-8{padding:14px}.vkuiIconButton .vkuiIcon--24{padding:12px}.vkuiIconButton .vkuiIcon--28,.vkuiIconButton--sizeY-compact .vkuiIcon--24{padding:10px}.vkuiIconButton--sizeY-compact .vkuiIcon--28{padding:8px}@media (max-height:414px),(pointer:fine) and (min-width:768px){.vkuiIconButton--sizeY-none{height:44px}.vkuiIconButton--sizeY-none .vkuiIcon--16,.vkuiIconButton--sizeY-none .vkuiIcon--16.vkuiIcon--w-8{padding:14px}.vkuiIconButton--sizeY-none .vkuiIcon--24{padding:10px}.vkuiIconButton--sizeY-none .vkuiIcon--28{padding:8px}}.vkuiFormField__after .vkuiIconButton,.vkuiFormItem--removable .vkuiRemovable__content>.vkuiIconButton,.vkuiFormLayoutGroup--removable .vkuiRemovable__content>.vkuiIconButton{align-content:center;align-items:center;border-radius:var(--vkui--size_border_radius--regular);display:flex;height:var(--vkui--size_field_height--regular);justify-content:center;width:var(--vkui--size_field_height--regular)}.vkuiFormField__after .vkuiIconButton .vkuiIcon.vkuiIcon.vkuiIcon{padding:0}.vkuiFormField__after .vkuiIconButton--sizeY-compact{height:var(--vkui--size_field_height--compact);width:var(--vkui--size_field_height--compact)}.vkuiFormItem--removable .vkuiRemovable__content>.vkuiIconButton--sizeY-compact,.vkuiFormLayoutGroup--removable .vkuiRemovable__content>.vkuiIconButton--sizeY-compact{height:var(--vkui--size_field_height--compact)}@media (max-height:414px),(pointer:fine) and (min-width:768px){.vkuiFormField__after .vkuiIconButton--sizeY-none{height:var(--vkui--size_field_height--compact);width:var(--vkui--size_field_height--compact)}.vkuiFormItem--removable .vkuiRemovable__content>.vkuiIconButton--sizeY-none,.vkuiFormLayoutGroup--removable .vkuiRemovable__content>.vkuiIconButton--sizeY-none{height:var(--vkui--size_field_height--compact)}}
+.vkuiIconButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;border-radius:9999px;box-shadow:none;color:currentColor;display:block;height:48px;margin:0;padding:0;position:relative}.vkuiIconButton--sizeY-compact{height:44px}.vkuiIconButton[disabled]{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiIconButton--ios{border-radius:8px;border-radius:var(--vkui--size_border_radius--regular)}.vkuiIconButton .vkuiIcon--16{padding:16px}.vkuiIconButton .vkuiIcon--16.vkuiIcon--w-8{padding:16px 14px}.vkuiIconButton--sizeY-compact .vkuiIcon--16,.vkuiIconButton--sizeY-compact .vkuiIcon--16.vkuiIcon--w-8{padding:14px}.vkuiIconButton .vkuiIcon--24{padding:12px}.vkuiIconButton .vkuiIcon--28,.vkuiIconButton--sizeY-compact .vkuiIcon--24{padding:10px}.vkuiIconButton--sizeY-compact .vkuiIcon--28{padding:8px}@media (pointer:fine) and (min-width:768px),not (min-height:415px){.vkuiIconButton--sizeY-none{height:44px}.vkuiIconButton--sizeY-none .vkuiIcon--16,.vkuiIconButton--sizeY-none .vkuiIcon--16.vkuiIcon--w-8{padding:14px}.vkuiIconButton--sizeY-none .vkuiIcon--24{padding:10px}.vkuiIconButton--sizeY-none .vkuiIcon--28{padding:8px}}.vkuiFormField__after .vkuiIconButton,.vkuiFormItem--removable .vkuiRemovable__content>.vkuiIconButton,.vkuiFormLayoutGroup--removable .vkuiRemovable__content>.vkuiIconButton{align-content:center;align-items:center;border-radius:8px;border-radius:var(--vkui--size_border_radius--regular);display:flex;height:44px;height:var(--vkui--size_field_height--regular);justify-content:center;width:44px;width:var(--vkui--size_field_height--regular)}.vkuiFormField__after .vkuiIconButton .vkuiIcon.vkuiIcon.vkuiIcon{padding:0}.vkuiFormField__after .vkuiIconButton--sizeY-compact{width:36px;width:var(--vkui--size_field_height--compact)}.vkuiFormField__after .vkuiIconButton--sizeY-compact,.vkuiFormItem--removable .vkuiRemovable__content>.vkuiIconButton--sizeY-compact,.vkuiFormLayoutGroup--removable .vkuiRemovable__content>.vkuiIconButton--sizeY-compact{height:36px;height:var(--vkui--size_field_height--compact)}@media (pointer:fine) and (min-width:768px),not (min-height:415px){.vkuiFormField__after .vkuiIconButton--sizeY-none{width:36px;width:var(--vkui--size_field_height--compact)}.vkuiFormField__after .vkuiIconButton--sizeY-none,.vkuiFormItem--removable .vkuiRemovable__content>.vkuiIconButton--sizeY-none,.vkuiFormLayoutGroup--removable .vkuiRemovable__content>.vkuiIconButton--sizeY-none{height:36px;height:var(--vkui--size_field_height--compact)}}

package/dist/cssm/components/ImageBase/ImageBase.module.css

@@ -1 +1 @@
-.vkuiImageBase{align-items:center;background-color:var(--vkui--color_background_secondary);background-size:cover;box-sizing:border-box;color:var(--vkui--color_icon_secondary);display:flex;flex-shrink:0;justify-content:center;position:relative}.vkuiImageBase--withBorder{box-shadow:inset 0 0 0 1px var(--vkui--color_image_border_alpha);box-shadow:inset 0 0 0 var(--vkui_internal--thin_border) var(--vkui--color_image_border_alpha)}.vkuiImageBase__img{border:none;border-radius:inherit;display:block;height:100%;left:0;object-fit:cover;position:absolute;top:0;visibility:hidden;width:100%}.vkuiImageBase--loaded .vkuiImageBase__img{visibility:visible}.vkuiImageBase__fallback{left:auto;position:absolute;top:auto}.vkuiCellButton>.vkuiImageBase .vkuiIcon{color:var(--vkui--color_icon_accent)}.vkuiCellButton--mode-danger>.vkuiImageBase .vkuiIcon{color:var(--vkui--color_icon_negative)}.vkuiPanelHeader__before .vkuiImageBase{margin-left:8px}.vkuiPanelHeader__after .vkuiImageBase{margin-right:8px}.vkuiSimpleCell>.vkuiImageBase{margin-right:12px}.vkuiSimpleCell>.vkuiImageBase--size-28,.vkuiSimpleCell>.vkuiImageBase--size-32{margin-bottom:10px;margin-top:10px}.vkuiSimpleCell>.vkuiImageBase--size-40{margin-bottom:4px;margin-top:4px}.vkuiSimpleCell>.vkuiImageBase--size-48,.vkuiSimpleCell>.vkuiImageBase--size-72{margin-bottom:6px;margin-top:6px}.vkuiSimpleCell--ios>.vkuiImageBase--size-28,.vkuiSimpleCell--ios>.vkuiImageBase--size-32{margin-left:4px}.vkuiSimpleCell--sizeY-compact>.vkuiImageBase--size-28,.vkuiSimpleCell--sizeY-compact>.vkuiImageBase--size-32{margin-bottom:8px;margin-top:8px}.vkuiSimpleCell--sizeY-compact>.vkuiImageBase--size-40{margin-bottom:2px;margin-top:2px}.vkuiSimpleCell--sizeY-compact>.vkuiImageBase--size-48{margin-bottom:4px;margin-top:4px}@media (max-height:414px),(pointer:fine) and (min-width:768px){.vkuiSimpleCell--sizeY-none>.vkuiImageBase--size-28,.vkuiSimpleCell--sizeY-none>.vkuiImageBase--size-32{margin-bottom:8px;margin-top:8px}.vkuiSimpleCell--sizeY-none>.vkuiImageBase--size-40{margin-bottom:2px;margin-top:2px}.vkuiSimpleCell--sizeY-none>.vkuiImageBase--size-48{margin-bottom:4px;margin-top:4px}}
+.vkuiImageBase{align-items:center;background-color:#f5f5f5;background-color:var(--vkui--color_background_secondary);background-size:cover;box-sizing:border-box;color:#99a2ad;color:var(--vkui--color_icon_secondary);display:flex;flex-shrink:0;justify-content:center;position:relative}.vkuiImageBase--withBorder{box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);box-shadow:inset 0 0 0 var(--vkui_internal--thin_border) var(--vkui--color_image_border_alpha)}.vkuiImageBase__img{border:none;border-radius:inherit;display:block;height:100%;left:0;object-fit:cover;position:absolute;top:0;visibility:hidden;width:100%}.vkuiImageBase--loaded .vkuiImageBase__img{visibility:visible}.vkuiImageBase__fallback{left:auto;position:absolute;top:auto}.vkuiCellButton>.vkuiImageBase .vkuiIcon{color:#2688eb;color:var(--vkui--color_icon_accent)}.vkuiCellButton--mode-danger>.vkuiImageBase .vkuiIcon{color:#e64646;color:var(--vkui--color_icon_negative)}.vkuiPanelHeader__before .vkuiImageBase{margin-left:8px}.vkuiPanelHeader__after .vkuiImageBase{margin-right:8px}.vkuiSimpleCell>.vkuiImageBase{margin-right:12px}.vkuiSimpleCell>.vkuiImageBase--size-28,.vkuiSimpleCell>.vkuiImageBase--size-32{margin-bottom:10px;margin-top:10px}.vkuiSimpleCell>.vkuiImageBase--size-40{margin-bottom:4px;margin-top:4px}.vkuiSimpleCell>.vkuiImageBase--size-48,.vkuiSimpleCell>.vkuiImageBase--size-72{margin-bottom:6px;margin-top:6px}.vkuiSimpleCell--ios>.vkuiImageBase--size-28,.vkuiSimpleCell--ios>.vkuiImageBase--size-32{margin-left:4px}.vkuiSimpleCell--sizeY-compact>.vkuiImageBase--size-28,.vkuiSimpleCell--sizeY-compact>.vkuiImageBase--size-32{margin-bottom:8px;margin-top:8px}.vkuiSimpleCell--sizeY-compact>.vkuiImageBase--size-40{margin-bottom:2px;margin-top:2px}.vkuiSimpleCell--sizeY-compact>.vkuiImageBase--size-48{margin-bottom:4px;margin-top:4px}@media (pointer:fine) and (min-width:768px),not (min-height:415px){.vkuiSimpleCell--sizeY-none>.vkuiImageBase--size-28,.vkuiSimpleCell--sizeY-none>.vkuiImageBase--size-32{margin-bottom:8px;margin-top:8px}.vkuiSimpleCell--sizeY-none>.vkuiImageBase--size-40{margin-bottom:2px;margin-top:2px}.vkuiSimpleCell--sizeY-none>.vkuiImageBase--size-48{margin-bottom:4px;margin-top:4px}}

package/dist/cssm/components/ImageBase/ImageBaseBadge/ImageBaseBadge.module.css

@@ -1 +1 @@
-.vkuiImageBaseBadge{border-radius:50%;bottom:0;padding:2px;position:absolute;right:0;transform:translate(2px,2px);z-index:1;z-index:var(--vkui_internal--z_index_image_base_badge)}.vkuiImageBaseBadge--background-stroke{background-color:var(--vkui--color_background_content)}.vkuiImageBaseBadge--background-shadow:before{border-radius:inherit;bottom:2px;box-shadow:var(--vkui--elevation1);content:"";left:2px;margin:auto;position:absolute;right:2px;top:2px}
+.vkuiImageBaseBadge{border-radius:50%;bottom:0;padding:2px;position:absolute;right:0;transform:translate(2px,2px);z-index:1;z-index:var(--vkui_internal--z_index_image_base_badge)}.vkuiImageBaseBadge--background-stroke{background-color:#fff;background-color:var(--vkui--color_background_content)}.vkuiImageBaseBadge--background-shadow:before{border-radius:inherit;bottom:2px;box-shadow:0 0 2px rgba(0,0,0,.03),0 2px 2px rgba(0,0,0,.06);box-shadow:var(--vkui--elevation1);content:"";left:2px;margin:auto;position:absolute;right:2px;top:2px}

package/dist/cssm/components/ImageBase/ImageBaseOverlay/ImageBaseOverlay.module.css

@@ -1 +1 @@
-.vkuiImageBaseOverlay{align-items:center;border:none;border-radius:inherit;box-shadow:inherit;box-sizing:border-box;display:flex;height:100%;justify-content:center;left:0;opacity:0;position:absolute;top:0;transition:opacity .3s ease-in-out;width:100%;z-index:0;z-index:var(--vkui_internal--z_index_image_base_overlay)}.vkuiImageBaseOverlay--visible{opacity:1}.vkuiImageBaseOverlay--focus-visible{box-shadow:inset 0 0 0 2px var(--vkui--color_stroke_accent);opacity:1}.vkuiImageBaseOverlay--theme-light{background-color:var(--vkui--color_avatar_overlay_inverse_alpha);color:var(--vkui--color_icon_accent)}.vkuiImageBaseOverlay--theme-dark{background-color:var(--vkui--color_avatar_overlay);color:var(--vkui--color_icon_contrast)}
+.vkuiImageBaseOverlay{align-items:center;border:none;border-radius:inherit;box-shadow:inherit;box-sizing:border-box;display:flex;height:100%;justify-content:center;left:0;opacity:0;position:absolute;top:0;transition:opacity .3s ease-in-out;width:100%;z-index:0;z-index:var(--vkui_internal--z_index_image_base_overlay)}.vkuiImageBaseOverlay--visible{opacity:1}.vkuiImageBaseOverlay--focus-visible{box-shadow:inset 0 0 0 2px #2688eb;box-shadow:inset 0 0 0 2px var(--vkui--color_stroke_accent);opacity:1}.vkuiImageBaseOverlay--theme-light{background-color:hsla(0,0%,100%,.85);background-color:var(--vkui--color_avatar_overlay_inverse_alpha);color:#2688eb;color:var(--vkui--color_icon_accent)}.vkuiImageBaseOverlay--theme-dark{background-color:rgba(0,0,0,.6);background-color:var(--vkui--color_avatar_overlay);color:#fff;color:var(--vkui--color_icon_contrast)}

package/dist/cssm/components/InfoRow/InfoRow.module.css

@@ -1 +1 @@
-.vkuiInfoRow{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.vkuiInfoRow,.vkuiInfoRow__header{overflow:hidden;text-overflow:ellipsis}.vkuiInfoRow__header{color:var(--vkui--color_text_subhead);display:block;margin-bottom:2px;white-space:nowrap}
+.vkuiInfoRow{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.vkuiInfoRow,.vkuiInfoRow__header{overflow:hidden;text-overflow:ellipsis}.vkuiInfoRow__header{color:#6d7885;color:var(--vkui--color_text_subhead);display:block;margin-bottom:2px;white-space:nowrap}

package/dist/cssm/components/Input/Input.module.css

@@ -1 +1 @@
-.vkuiInput{font-size:16px;line-height:20px;position:relative}.vkuiInput--align-center .vkuiInput__el{text-align:center}.vkuiInput--align-right .vkuiInput__el{text-align:right}.vkuiInput__el{align-self:stretch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:inherit;box-shadow:none;box-sizing:border-box;color:var(--vkui--color_text_primary);display:block;font-family:inherit;font-size:var(--vkui--font_text--font_size--regular);font-weight:var(--vkui--font_text--font_weight--regular);line-height:var(--vkui--font_text--line_height--regular);margin:0;padding:0 12px;position:relative;text-overflow:ellipsis;width:100%;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiInput--sizeY-compact .vkuiInput__el{font-size:var(--vkui--font_text--font_size--compact);line-height:var(--vkui--font_text--line_height--compact)}.vkuiInput--hasBefore .vkuiInput__el{padding-left:0}.vkuiInput--hasAfter .vkuiInput__el{padding-right:0}@media (max-height:414px),(pointer:fine) and (min-width:768px){.vkuiInput--sizeY-none .vkuiInput__el{font-size:var(--vkui--font_text--font_size--compact);line-height:var(--vkui--font_text--line_height--compact)}}.vkuiInput__el:disabled{opacity:var(--vkui--opacity_disable_accessibility)}.vkuiInput__el::-webkit-input-placeholder{color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::-moz-placeholder{color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::-ms-input-placeholder{color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::placeholder{color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el:disabled::-webkit-input-placeholder{color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::-moz-placeholder{color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::-ms-input-placeholder{color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::placeholder{color:var(--vkui--color_text_secondary)}
+.vkuiInput{font-size:16px;line-height:20px;position:relative}.vkuiInput--align-center .vkuiInput__el{text-align:center}.vkuiInput--align-right .vkuiInput__el{text-align:right}.vkuiInput__el{align-self:stretch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:inherit;box-shadow:none;box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);display:block;font-family:inherit;font-size:16px;font-size:var(--vkui--font_text--font_size--regular);font-weight:400;font-weight:var(--vkui--font_text--font_weight--regular);line-height:20px;line-height:var(--vkui--font_text--line_height--regular);margin:0;padding:0 12px;position:relative;text-overflow:ellipsis;width:100%;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiInput--sizeY-compact .vkuiInput__el{font-size:15px;font-size:var(--vkui--font_text--font_size--compact);line-height:20px;line-height:var(--vkui--font_text--line_height--compact)}.vkuiInput--hasBefore .vkuiInput__el{padding-left:0}.vkuiInput--hasAfter .vkuiInput__el{padding-right:0}@media (pointer:fine) and (min-width:768px),not (min-height:415px){.vkuiInput--sizeY-none .vkuiInput__el{font-size:15px;font-size:var(--vkui--font_text--font_size--compact);line-height:20px;line-height:var(--vkui--font_text--line_height--compact)}}.vkuiInput__el:disabled{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiInput__el::-webkit-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::-moz-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::-ms-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el::placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiInput__el:disabled::-webkit-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::-moz-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::-ms-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiInput__el:disabled::placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}

package/dist/cssm/components/InputLike/InputLike.module.css

@@ -1 +1 @@
-.vkuiInputLike__mask{font-family:var(--vkui--font_family_base);position:relative}.vkuiInputLike__mask:after{border-bottom:1px solid var(--vkui--color_text_secondary);bottom:0;content:"";height:1px;left:0;position:absolute;width:calc(100% - .1em)}.vkuiInputLike__mask:last-child{margin-right:1px}.vkuiInputLike__last_character{letter-spacing:1px!important}.vkuiInputLike--full+.vkuiInputLikeDivider{color:var(--vkui--color_text_primary)}
+.vkuiInputLike__mask{font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);position:relative}.vkuiInputLike__mask:after{border-bottom:1px solid #818c99;border-bottom:1px solid var(--vkui--color_text_secondary);bottom:0;content:"";height:1px;left:0;position:absolute;width:calc(100% - .1em)}.vkuiInputLike__mask:last-child{margin-right:1px}.vkuiInputLike__last_character{letter-spacing:1px!important}.vkuiInputLike--full+.vkuiInputLikeDivider{color:#000;color:var(--vkui--color_text_primary)}

package/dist/cssm/components/InputLike/InputLikeDivider.module.css

@@ -1 +1 @@
-.vkuiInputLikeDivider{color:var(--vkui--color_text_secondary);letter-spacing:1px!important}
+.vkuiInputLikeDivider{color:#818c99;color:var(--vkui--color_text_secondary);letter-spacing:1px!important}

package/dist/cssm/components/Link/Link.module.css

@@ -1 +1 @@
-.vkuiLink{background:none;border:0;border-radius:0;color:var(--vkui--color_text_link);cursor:pointer;display:inline;font-family:inherit;font-size:inherit;margin:0;padding:0;text-decoration:none}@media (hover:hover) and (pointer:fine){.vkuiLink:hover{text-decoration:underline}}.vkuiLink--focus-visible{outline:2px solid var(--vkui--color_stroke_accent)!important}.vkuiLink--has-visited:visited{color:var(--vkui--color_text_link_visited)}.vkuiLink .vkuiIcon{display:inline-block;margin-left:4px;vertical-align:middle}
+.vkuiLink{background:none;border:0;border-radius:0;color:#2d81e0;color:var(--vkui--color_text_link);cursor:pointer;display:inline;font-family:inherit;font-size:inherit;margin:0;padding:0;text-decoration:none}@media (hover:hover) and (pointer:fine){.vkuiLink:hover{text-decoration:underline}}.vkuiLink--focus-visible{outline:2px solid #2688eb!important;outline:2px solid var(--vkui--color_stroke_accent)!important}.vkuiLink--has-visited:visited{color:#4986cc;color:var(--vkui--color_text_link_visited)}.vkuiLink .vkuiIcon{display:inline-block;margin-left:4px;vertical-align:middle}