@vkontakte/vkui 5.6.1 → 5.6.2

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Search/Search.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Clear, Icon16SearchOutline, Icon24Cancel } from '@vkontakte/icons';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useBooleanState } from '../../hooks/useBooleanState';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { VKUITouchEvent } from '../../lib/touch';\nimport { HasRef } from '../../types';\nimport { Button } from '../Button/Button';\nimport { IconButton } from '../IconButton/IconButton';\nimport { TouchEvent } from '../Touch/Touch';\nimport { Headline } from '../Typography/Headline/Headline';\nimport styles from './Search.module.css';\n\nexport interface SearchProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRef<HTMLInputElement> {\n  /**\n   * iOS only. Текст кнопки \"отмена\", которая чистит текстовое поле и убирает фокус.\n   */\n  after?: React.ReactNode;\n  before?: React.ReactNode;\n  icon?: React.ReactNode;\n  onIconClick?: (e: VKUITouchEvent) => void;\n  defaultValue?: string;\n  iconAriaLabel?: string;\n  clearAriaLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Search\n */\nexport const Search = ({\n  before = <Icon16SearchOutline />,\n  className,\n  defaultValue = '',\n  placeholder = 'Поиск',\n  after = 'Отмена',\n  getRef,\n  icon,\n  onIconClick = noop,\n  style,\n  autoComplete = 'off',\n  onChange: onChangeProp,\n  value: valueProp,\n  iconAriaLabel,\n  clearAriaLabel = 'Очистить',\n  ...inputProps\n}: SearchProps) => {\n  const inputRef = useExternRef(getRef);\n  const {\n    value: isFocused,\n    setTrue: setFocusedTrue,\n    setFalse: setFocusedFalse,\n  } = useBooleanState(false);\n\n  const [value, onChange] = useEnsuredControl({\n    defaultValue,\n    onChange: onChangeProp,\n    value: valueProp,\n  });\n  const { sizeY = 'none' } = useAdaptivity();\n  const platform = usePlatform();\n\n  const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedTrue();\n    inputProps.onFocus && inputProps.onFocus(e);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedFalse();\n    inputProps.onBlur && inputProps.onBlur(e);\n  };\n\n  const onCancel = React.useCallback(() => {\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n      HTMLInputElement.prototype,\n      'value',\n    )?.set;\n    nativeInputValueSetter?.call(inputRef.current, '');\n\n    const ev2 = new Event('input', { bubbles: true });\n    inputRef.current?.dispatchEvent(ev2);\n  }, [inputRef]);\n\n  const onIconClickStart = React.useCallback(\n    (e: TouchEvent) => onIconClick(e.originalEvent),\n    [onIconClick],\n  );\n\n  const onIconCancelClickStart = React.useCallback(\n    (e: TouchEvent) => {\n      e.originalEvent.preventDefault();\n      inputRef.current?.focus();\n    },\n    [inputRef],\n  );\n\n  return (\n    <div\n      className={classNames(\n        'vkuiInternalSearch',\n        styles['Search'],\n        sizeY === 'none' && styles['Search--sizeY-none'],\n        sizeY === SizeType.COMPACT && styles['Search--sizeY-compact'],\n        isFocused && styles['Search--focused'],\n        value && styles['Search--has-value'],\n        after && styles['Search--has-after'],\n        icon && styles['Search--has-icon'],\n        className,\n      )}\n      style={style}\n    >\n      <div className={styles['Search__field']}>\n        <label className={styles['Search__control']}>\n          {before}\n          <Headline\n            Component=\"input\"\n            type=\"search\"\n            level=\"1\"\n            weight=\"3\"\n            {...inputProps}\n            placeholder={placeholder}\n            autoComplete={autoComplete}\n            getRootRef={inputRef}\n            className={styles['Search__input']}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            onChange={onChange}\n            value={value}\n          />\n        </label>\n        <div className={styles['Search__icons']}>\n          {icon && (\n            <IconButton\n              hoverMode=\"opacity\"\n              onStart={onIconClickStart}\n              className={styles['Search__icon']}\n              onFocus={setFocusedTrue}\n              onBlur={setFocusedFalse}\n              aria-label={iconAriaLabel}\n            >\n              {icon}\n            </IconButton>\n          )}\n          {!!value && (\n            <IconButton\n              hoverMode=\"opacity\"\n              onStart={onIconCancelClickStart}\n              onClick={onCancel}\n              className={styles['Search__icon']}\n              aria-label={clearAriaLabel}\n            >\n              {platform === Platform.IOS ? <Icon16Clear /> : <Icon24Cancel />}\n            </IconButton>\n          )}\n        </div>\n      </div>\n      {platform === Platform.IOS && after && (\n        <Button\n          mode=\"tertiary\"\n          size=\"m\"\n          className={styles['Search__after']}\n          focusVisibleMode=\"inside\"\n          onClick={onCancel}\n          onFocus={setFocusedTrue}\n          onBlur={setFocusedFalse}\n        >\n          <span className={styles['Search__afterText']}>{after}</span>\n        </Button>\n      )}\n    </div>\n  );\n};\n"],"names":["React","Icon16Clear","Icon16SearchOutline","Icon24Cancel","classNames","noop","useAdaptivity","useBooleanState","useEnsuredControl","useExternRef","usePlatform","SizeType","Platform","Button","IconButton","Headline","styles","Search","before","className","defaultValue","placeholder","after","getRef","icon","onIconClick","style","autoComplete","onChange","onChangeProp","value","valueProp","iconAriaLabel","clearAriaLabel","inputProps","inputRef","isFocused","setTrue","setFocusedTrue","setFalse","setFocusedFalse","sizeY","platform","onFocus","e","onBlur","onCancel","useCallback","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","originalEvent","onIconCancelClickStart","preventDefault","focus","div","COMPACT","label","Component","type","level","weight","getRootRef","hoverMode","onStart","aria-label","onClick","IOS","mode","size","focusVisibleMode","span"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Search/Search.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Clear, Icon16SearchOutline, Icon24Cancel } from '@vkontakte/icons';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useBooleanState } from '../../hooks/useBooleanState';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { VKUITouchEvent } from '../../lib/touch';\nimport { HasRef } from '../../types';\nimport { Button } from '../Button/Button';\nimport { IconButton } from '../IconButton/IconButton';\nimport { TouchEvent } from '../Touch/Touch';\nimport { Headline } from '../Typography/Headline/Headline';\nimport styles from './Search.module.css';\n\nexport interface SearchProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRef<HTMLInputElement> {\n  /**\n   * iOS only. Текст кнопки \"отмена\", которая чистит текстовое поле и убирает фокус.\n   */\n  after?: React.ReactNode;\n  before?: React.ReactNode;\n  icon?: React.ReactNode;\n  onIconClick?: (e: VKUITouchEvent) => void;\n  defaultValue?: string;\n  iconAriaLabel?: string;\n  clearAriaLabel?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Search\n */\nexport const Search = ({\n  before = <Icon16SearchOutline />,\n  className,\n  defaultValue = '',\n  placeholder = 'Поиск',\n  after = 'Отмена',\n  getRef,\n  icon,\n  onIconClick = noop,\n  style,\n  autoComplete = 'off',\n  onChange: onChangeProp,\n  value: valueProp,\n  iconAriaLabel,\n  clearAriaLabel = 'Очистить',\n  ...inputProps\n}: SearchProps) => {\n  const inputRef = useExternRef(getRef);\n  const {\n    value: isFocused,\n    setTrue: setFocusedTrue,\n    setFalse: setFocusedFalse,\n  } = useBooleanState(false);\n\n  const [value, onChange] = useEnsuredControl({\n    defaultValue,\n    onChange: onChangeProp,\n    value: valueProp,\n  });\n  const { sizeY = 'none' } = useAdaptivity();\n  const platform = usePlatform();\n\n  const onFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedTrue();\n    inputProps.onFocus && inputProps.onFocus(e);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setFocusedFalse();\n    inputProps.onBlur && inputProps.onBlur(e);\n  };\n\n  const onCancel = React.useCallback(() => {\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n      HTMLInputElement.prototype,\n      'value',\n    )?.set;\n    nativeInputValueSetter?.call(inputRef.current, '');\n\n    const ev2 = new Event('input', { bubbles: true });\n    inputRef.current?.dispatchEvent(ev2);\n  }, [inputRef]);\n\n  const onIconClickStart = React.useCallback(\n    (e: TouchEvent) => onIconClick(e.originalEvent),\n    [onIconClick],\n  );\n\n  const onIconCancelClickStart = React.useCallback(\n    (e: TouchEvent) => {\n      e.originalEvent.preventDefault();\n      inputRef.current?.focus();\n    },\n    [inputRef],\n  );\n\n  return (\n    <div\n      className={classNames(\n        'vkuiInternalSearch',\n        styles['Search'],\n        sizeY === 'none' && styles['Search--sizeY-none'],\n        sizeY === SizeType.COMPACT && styles['Search--sizeY-compact'],\n        isFocused && styles['Search--focused'],\n        value && styles['Search--has-value'],\n        after && styles['Search--has-after'],\n        icon && styles['Search--has-icon'],\n        inputProps.disabled && styles['Search--disabled'],\n        className,\n      )}\n      style={style}\n    >\n      <div className={styles['Search__field']}>\n        <label className={styles['Search__control']}>\n          {before}\n          <Headline\n            Component=\"input\"\n            type=\"search\"\n            level=\"1\"\n            weight=\"3\"\n            {...inputProps}\n            placeholder={placeholder}\n            autoComplete={autoComplete}\n            getRootRef={inputRef}\n            className={styles['Search__input']}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            onChange={onChange}\n            value={value}\n          />\n        </label>\n        <div className={styles['Search__icons']}>\n          {icon && (\n            <IconButton\n              hoverMode=\"opacity\"\n              onStart={onIconClickStart}\n              className={styles['Search__icon']}\n              onFocus={setFocusedTrue}\n              onBlur={setFocusedFalse}\n              aria-label={iconAriaLabel}\n            >\n              {icon}\n            </IconButton>\n          )}\n          {!!value && (\n            <IconButton\n              hoverMode=\"opacity\"\n              onStart={onIconCancelClickStart}\n              onClick={onCancel}\n              className={styles['Search__icon']}\n              aria-label={clearAriaLabel}\n            >\n              {platform === Platform.IOS ? <Icon16Clear /> : <Icon24Cancel />}\n            </IconButton>\n          )}\n        </div>\n      </div>\n      {platform === Platform.IOS && after && (\n        <Button\n          mode=\"tertiary\"\n          size=\"m\"\n          className={styles['Search__after']}\n          focusVisibleMode=\"inside\"\n          onClick={onCancel}\n          onFocus={setFocusedTrue}\n          onBlur={setFocusedFalse}\n        >\n          <span className={styles['Search__afterText']}>{after}</span>\n        </Button>\n      )}\n    </div>\n  );\n};\n"],"names":["React","Icon16Clear","Icon16SearchOutline","Icon24Cancel","classNames","noop","useAdaptivity","useBooleanState","useEnsuredControl","useExternRef","usePlatform","SizeType","Platform","Button","IconButton","Headline","styles","Search","before","className","defaultValue","placeholder","after","getRef","icon","onIconClick","style","autoComplete","onChange","onChangeProp","value","valueProp","iconAriaLabel","clearAriaLabel","inputProps","inputRef","isFocused","setTrue","setFocusedTrue","setFalse","setFocusedFalse","sizeY","platform","onFocus","e","onBlur","onCancel","useCallback","nativeInputValueSetter","Object","getOwnPropertyDescriptor","HTMLInputElement","prototype","set","call","current","ev2","Event","bubbles","dispatchEvent","onIconClickStart","originalEvent","onIconCancelClickStart","preventDefault","focus","div","COMPACT","disabled","label","Component","type","level","weight","getRootRef","hoverMode","onStart","aria-label","onClick","IOS","mode","size","focusVisibleMode","span"],"mappings":"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"}

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

@@ -102,6 +102,56 @@
   margin-right: calc((var(--vkui_internal--search_height) + 4px) * 2);
 }
 
+.Search--disabled {
+  opacity: var(--vkui--opacity_disable_accessibility);
+  pointer-events: none;
+  cursor: default;
+}
+
+.Search__input:disabled {
+  opacity: var(--vkui--opacity_disable_accessibility);
+}
+
+.Search__input::-webkit-input-placeholder {
+  color: var(--vkui--color_text_secondary);
+  /* Для Firefox */
+  opacity: 1;
+}
+
+.Search__input::-moz-placeholder {
+  color: var(--vkui--color_text_secondary);
+  /* Для Firefox */
+  opacity: 1;
+}
+
+.Search__input::-ms-input-placeholder {
+  color: var(--vkui--color_text_secondary);
+  /* Для Firefox */
+  opacity: 1;
+}
+
+.Search__input::placeholder {
+  color: var(--vkui--color_text_secondary);
+  /* Для Firefox */
+  opacity: 1;
+}
+
+.Search__input:disabled::-webkit-input-placeholder {
+  color: var(--vkui--color_text_secondary);
+}
+
+.Search__input:disabled::-moz-placeholder {
+  color: var(--vkui--color_text_secondary);
+}
+
+.Search__input:disabled::-ms-input-placeholder {
+  color: var(--vkui--color_text_secondary);
+}
+
+.Search__input:disabled::placeholder {
+  color: var(--vkui--color_text_secondary);
+}
+
 .Search__icons {
   display: flex;
   align-items: center;

package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js

@@ -1,21 +1,15 @@
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
-import { useAdaptivity } from '../../../hooks/useAdaptivity';
 import { useFocusVisible } from '../../../hooks/useFocusVisible';
-import { SizeType } from '../../../lib/adaptivity';
 import { callMultiple } from '../../../lib/callMultiple';
 import { FocusVisible } from '../../FocusVisible/FocusVisible';
+import { Headline } from '../../Typography/Headline/Headline';
 import { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';
 import styles from './SegmentedControlOption.module.css';
-const sizeYClassNames = {
-    none: styles['SegmentedControlOption__content--sizeY-none'],
-    [SizeType.COMPACT]: styles['SegmentedControlOption__content--sizeY-compact']
-};
 /**
  * @see https://vkcom.github.io/VKUI/#/SegmentedControl
  */ export const SegmentedControlOption = ({ getRef, className, style, children, ...restProps })=>{
     const { focusVisible, onBlur, onFocus } = useFocusVisible();
-    const { sizeY = 'none' } = useAdaptivity();
     return /*#__PURE__*/ React.createElement("label", {
         className: classNames(styles['SegmentedControlOption'], restProps.checked && styles['SegmentedControlOption--checked'], className),
         style: style
@@ -26,8 +20,10 @@ const sizeYClassNames = {
         type: "radio",
         onBlur: callMultiple(onBlur, restProps.onBlur),
         onFocus: callMultiple(onFocus, restProps.onFocus)
-    }), /*#__PURE__*/ React.createElement("span", {
-        className: classNames(styles['SegmentedControlOption__content'], sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY])
+    }), /*#__PURE__*/ React.createElement(Headline, {
+        className: styles['SegmentedControlOption__content'],
+        level: "2",
+        weight: "2"
     }, children), /*#__PURE__*/ React.createElement(FocusVisible, {
         visible: focusVisible,
         mode: "inside"

package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { useFocusVisible } from '../../../hooks/useFocusVisible';\nimport { SizeType } from '../../../lib/adaptivity';\nimport { callMultiple } from '../../../lib/callMultiple';\nimport { HasRef } from '../../../types';\nimport { FocusVisible } from '../../FocusVisible/FocusVisible';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport styles from './SegmentedControlOption.module.css';\n\nconst sizeYClassNames = {\n  none: styles['SegmentedControlOption__content--sizeY-none'],\n  [SizeType.COMPACT]: styles['SegmentedControlOption__content--sizeY-compact'],\n};\n\nexport interface SegmentedControlOptionProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRef<HTMLInputElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SegmentedControl\n */\nexport const SegmentedControlOption = ({\n  getRef,\n  className,\n  style,\n  children,\n  ...restProps\n}: SegmentedControlOptionProps) => {\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <label\n      className={classNames(\n        styles['SegmentedControlOption'],\n        restProps.checked && styles['SegmentedControlOption--checked'],\n        className,\n      )}\n      style={style}\n    >\n      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        getRootRef={getRef}\n        type=\"radio\"\n        onBlur={callMultiple(onBlur, restProps.onBlur)}\n        onFocus={callMultiple(onFocus, restProps.onFocus)}\n      />\n      <span\n        className={classNames(\n          styles['SegmentedControlOption__content'],\n          sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        )}\n      >\n        {children}\n      </span>\n      <FocusVisible visible={focusVisible} mode=\"inside\" />\n    </label>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useFocusVisible","SizeType","callMultiple","FocusVisible","VisuallyHidden","styles","sizeYClassNames","none","COMPACT","SegmentedControlOption","getRef","className","style","children","restProps","focusVisible","onBlur","onFocus","sizeY","label","checked","Component","getRootRef","type","span","REGULAR","visible","mode"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA+B;AAC7D,SAASC,eAAe,QAAQ,iCAAiC;AACjE,SAASC,QAAQ,QAAQ,0BAA0B;AACnD,SAASC,YAAY,QAAQ,4BAA4B;AAEzD,SAASC,YAAY,QAAQ,kCAAkC;AAC/D,SAASC,cAAc,QAAQ,sCAAsC;AACrE,OAAOC,YAAY,sCAAsC;AAEzD,MAAMC,kBAAkB;IACtBC,MAAMF,MAAM,CAAC,8CAA8C;IAC3D,CAACJ,SAASO,OAAO,CAAC,EAAEH,MAAM,CAAC,iDAAiD;AAC9E;AAMA;;CAEC,GACD,OAAO,MAAMI,yBAAyB,CAAC,EACrCC,MAAM,EACNC,SAAS,EACTC,KAAK,EACLC,QAAQ,EACR,GAAGC,WACyB;IAC5B,MAAM,EAAEC,YAAY,EAAEC,MAAM,EAAEC,OAAO,EAAE,GAAGjB;IAC1C,MAAM,EAAEkB,QAAQ,MAAM,EAAE,GAAGnB;IAE3B,qBACE,oBAACoB;QACCR,WAAWb,WACTO,MAAM,CAAC,yBAAyB,EAChCS,UAAUM,OAAO,IAAIf,MAAM,CAAC,kCAAkC,EAC9DM;QAEFC,OAAOA;qBAEP,oBAACR;QACE,GAAGU,SAAS;QACbO,WAAU;QACVC,YAAYZ;QACZa,MAAK;QACLP,QAAQd,aAAac,QAAQF,UAAUE,MAAM;QAC7CC,SAASf,aAAae,SAASH,UAAUG,OAAO;sBAElD,oBAACO;QACCb,WAAWb,WACTO,MAAM,CAAC,kCAAkC,EACzCa,UAAUjB,SAASwB,OAAO,IAAInB,eAAe,CAACY,MAAM;OAGrDL,yBAEH,oBAACV;QAAauB,SAASX;QAAcY,MAAK;;AAGhD,EAAE"}
+{"version":3,"sources":["../../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useFocusVisible } from '../../../hooks/useFocusVisible';\nimport { callMultiple } from '../../../lib/callMultiple';\nimport { HasRef } from '../../../types';\nimport { FocusVisible } from '../../FocusVisible/FocusVisible';\nimport { Headline } from '../../Typography/Headline/Headline';\nimport { VisuallyHidden } from '../../VisuallyHidden/VisuallyHidden';\nimport styles from './SegmentedControlOption.module.css';\n\nexport interface SegmentedControlOptionProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRef<HTMLInputElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SegmentedControl\n */\nexport const SegmentedControlOption = ({\n  getRef,\n  className,\n  style,\n  children,\n  ...restProps\n}: SegmentedControlOptionProps) => {\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n\n  return (\n    <label\n      className={classNames(\n        styles['SegmentedControlOption'],\n        restProps.checked && styles['SegmentedControlOption--checked'],\n        className,\n      )}\n      style={style}\n    >\n      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        getRootRef={getRef}\n        type=\"radio\"\n        onBlur={callMultiple(onBlur, restProps.onBlur)}\n        onFocus={callMultiple(onFocus, restProps.onFocus)}\n      />\n      <Headline className={styles['SegmentedControlOption__content']} level=\"2\" weight=\"2\">\n        {children}\n      </Headline>\n      <FocusVisible visible={focusVisible} mode=\"inside\" />\n    </label>\n  );\n};\n"],"names":["React","classNames","useFocusVisible","callMultiple","FocusVisible","Headline","VisuallyHidden","styles","SegmentedControlOption","getRef","className","style","children","restProps","focusVisible","onBlur","onFocus","label","checked","Component","getRootRef","type","level","weight","visible","mode"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,eAAe,QAAQ,iCAAiC;AACjE,SAASC,YAAY,QAAQ,4BAA4B;AAEzD,SAASC,YAAY,QAAQ,kCAAkC;AAC/D,SAASC,QAAQ,QAAQ,qCAAqC;AAC9D,SAASC,cAAc,QAAQ,sCAAsC;AACrE,OAAOC,YAAY,sCAAsC;AAMzD;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAAC,EACrCC,MAAM,EACNC,SAAS,EACTC,KAAK,EACLC,QAAQ,EACR,GAAGC,WACyB;IAC5B,MAAM,EAAEC,YAAY,EAAEC,MAAM,EAAEC,OAAO,EAAE,GAAGd;IAE1C,qBACE,oBAACe;QACCP,WAAWT,WACTM,MAAM,CAAC,yBAAyB,EAChCM,UAAUK,OAAO,IAAIX,MAAM,CAAC,kCAAkC,EAC9DG;QAEFC,OAAOA;qBAEP,oBAACL;QACE,GAAGO,SAAS;QACbM,WAAU;QACVC,YAAYX;QACZY,MAAK;QACLN,QAAQZ,aAAaY,QAAQF,UAAUE,MAAM;QAC7CC,SAASb,aAAaa,SAASH,UAAUG,OAAO;sBAElD,oBAACX;QAASK,WAAWH,MAAM,CAAC,kCAAkC;QAAEe,OAAM;QAAIC,QAAO;OAC9EX,yBAEH,oBAACR;QAAaoB,SAASV;QAAcW,MAAK;;AAGhD,EAAE"}

package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.module.css

@@ -32,21 +32,4 @@
   height: 100%;
   width: 100%;
   border-radius: inherit;
-  font-size: var(--vkui--font_text--font_size--regular);
-  line-height: var(--vkui--font_text--line_height--regular);
-  font-weight: var(--vkui--font_weight_accent2);
-}
-
-.SegmentedControlOption__content--sizeY-compact.SegmentedControlOption__content {
-  font-size: var(--vkui--font_footnote--font_size--regular);
-  line-height: var(--vkui--font_footnote--line_height--regular);
-  font-weight: var(--vkui--font_weight_accent3);
-}
-
-@media (pointer: fine) and (min-width: 768px),(max-height: 414.9px) {
-  .SegmentedControlOption__content--sizeY-none.SegmentedControlOption__content {
-    font-size: var(--vkui--font_footnote--font_size--regular);
-    line-height: var(--vkui--font_footnote--line_height--regular);
-    font-weight: var(--vkui--font_weight_accent3);
-  }
 }

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

@@ -18,7 +18,7 @@
   height: 100%;
   opacity: 0;
   z-index: var(--vkui_internal--z_index_form_field_side);
-  font-size: 16px;
+  font-size: var(--vkui--font_paragraph--font_size--regular);
   font-family: inherit;
 }
 

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

@@ -7,4 +7,4 @@ export interface SelectTypographyProps extends React.HTMLAttributes<HTMLSpanElem
 /**
  * @private
  */
-export declare const SelectTypography: ({ selectType, children, className, ...restProps }: SelectTypographyProps) => React.JSX.Element;
+export declare const SelectTypography: ({ selectType, children, ...restProps }: SelectTypographyProps) => React.JSX.Element;

package/dist/cssm/components/SelectTypography/SelectTypography.js

@@ -1,24 +1,10 @@
 import * as React from 'react';
-import { classNames } from '@vkontakte/vkjs';
-import { useAdaptivity } from '../../hooks/useAdaptivity';
-import { usePlatform } from '../../hooks/usePlatform';
-import { SizeType } from '../../lib/adaptivity';
-import styles from './SelectTypography.module.css';
-const sizeYClassNames = {
-    none: styles['SelectTypography--sizeY-none'],
-    compact: styles['SelectTypography--sizeY-compact']
-};
-const platformClassNames = {
-    vkcom: styles['SelectTypography--vkcom'],
-    android: styles['SelectTypography--android']
-};
+import { Text } from '../Typography/Text/Text';
 /**
  * @private
- */ export const SelectTypography = ({ selectType = 'default', children, className, ...restProps })=>{
-    const platform = usePlatform();
-    const { sizeY = 'none' } = useAdaptivity();
-    return /*#__PURE__*/ React.createElement("span", {
-        className: classNames(styles['SelectTypography'], platformClassNames.hasOwnProperty(platform) && platformClassNames[platform], sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], selectType === 'accent' && styles['SelectTypography--selectType-accent'], className),
+ */ export const SelectTypography = ({ selectType = 'default', children, ...restProps })=>{
+    return /*#__PURE__*/ React.createElement(Text, {
+        weight: selectType === 'accent' ? '2' : '3',
         ...restProps
     }, children);
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/SelectTypography/SelectTypography.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasChildren } from '../../types';\nimport type { SelectType } from '../Select/Select';\nimport styles from './SelectTypography.module.css';\n\nconst sizeYClassNames = {\n  none: styles['SelectTypography--sizeY-none'],\n  compact: styles['SelectTypography--sizeY-compact'],\n};\n\nconst platformClassNames = {\n  vkcom: styles['SelectTypography--vkcom'],\n  android: styles['SelectTypography--android'],\n};\n\nexport interface SelectTypographyProps extends React.HTMLAttributes<HTMLSpanElement>, HasChildren {\n  selectType?: SelectType;\n}\n\n/**\n * @private\n */\nexport const SelectTypography = ({\n  selectType = 'default',\n  children,\n  className,\n  ...restProps\n}: SelectTypographyProps) => {\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <span\n      className={classNames(\n        styles['SelectTypography'],\n        platformClassNames.hasOwnProperty(platform) && platformClassNames[platform],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        selectType === 'accent' && styles['SelectTypography--selectType-accent'],\n        className,\n      )}\n      {...restProps}\n    >\n      {children}\n    </span>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","usePlatform","SizeType","styles","sizeYClassNames","none","compact","platformClassNames","vkcom","android","SelectTypography","selectType","children","className","restProps","platform","sizeY","span","hasOwnProperty","REGULAR"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAGhD,OAAOC,YAAY,gCAAgC;AAEnD,MAAMC,kBAAkB;IACtBC,MAAMF,MAAM,CAAC,+BAA+B;IAC5CG,SAASH,MAAM,CAAC,kCAAkC;AACpD;AAEA,MAAMI,qBAAqB;IACzBC,OAAOL,MAAM,CAAC,0BAA0B;IACxCM,SAASN,MAAM,CAAC,4BAA4B;AAC9C;AAMA;;CAEC,GACD,OAAO,MAAMO,mBAAmB,CAAC,EAC/BC,aAAa,SAAS,EACtBC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACmB;IACtB,MAAMC,WAAWd;IACjB,MAAM,EAAEe,QAAQ,MAAM,EAAE,GAAGhB;IAE3B,qBACE,oBAACiB;QACCJ,WAAWd,WACTI,MAAM,CAAC,mBAAmB,EAC1BI,mBAAmBW,cAAc,CAACH,aAAaR,kBAAkB,CAACQ,SAAS,EAC3EC,UAAUd,SAASiB,OAAO,IAAIf,eAAe,CAACY,MAAM,EACpDL,eAAe,YAAYR,MAAM,CAAC,sCAAsC,EACxEU;QAED,GAAGC,SAAS;OAEZF;AAGP,EAAE"}
+{"version":3,"sources":["../../../../src/components/SelectTypography/SelectTypography.tsx"],"sourcesContent":["import * as React from 'react';\nimport { HasChildren } from '../../types';\nimport type { SelectType } from '../Select/Select';\nimport { Text } from '../Typography/Text/Text';\n\nexport interface SelectTypographyProps extends React.HTMLAttributes<HTMLSpanElement>, HasChildren {\n  selectType?: SelectType;\n}\n\n/**\n * @private\n */\nexport const SelectTypography = ({\n  selectType = 'default',\n  children,\n  ...restProps\n}: SelectTypographyProps) => {\n  return (\n    <Text weight={selectType === 'accent' ? '2' : '3'} {...restProps}>\n      {children}\n    </Text>\n  );\n};\n"],"names":["React","Text","SelectTypography","selectType","children","restProps","weight"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,IAAI,QAAQ,0BAA0B;AAM/C;;CAEC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,aAAa,SAAS,EACtBC,QAAQ,EACR,GAAGC,WACmB;IACtB,qBACE,oBAACJ;QAAKK,QAAQH,eAAe,WAAW,MAAM;QAAM,GAAGE,SAAS;OAC7DD;AAGP,EAAE"}

package/dist/vkui.css

@@ -82,7 +82,7 @@
 .vkuiGridAvatarBadge{bottom:0;right:0}.vkuiGridAvatarBadge--shifted{bottom:-2px;right:-2px}
 .vkuiImageBadge{bottom:-4px;position:absolute;right:-4px}.vkuiImageBadge--shifted{bottom:-3px;right:-3px}
 .vkuiProgress{background:#e1e3e6;background:var(--vkui--color_track_background);border-radius:1px;height:2px}.vkuiProgress__in{border-radius:inherit;height:100%;transition:width .2s ease}.vkuiProgress--appearance-accent .vkuiProgress__in{background:#2688eb;background:var(--vkui--color_stroke_accent)}.vkuiProgress--appearance-positive .vkuiProgress__in{background:#4bb34b;background:var(--vkui--color_stroke_positive)}.vkuiProgress--appearance-negative .vkuiProgress__in{background:#e64646;background:var(--vkui--color_stroke_negative)}
-.vkuiSearch{-webkit-tap-highlight-color:transparent;--vkui_internal--search_height:var(--vkui--size_search_height--regular);display:flex;overflow:hidden;padding:8px 16px;padding:8px var(--vkui--size_base_padding_horizontal--regular)}.vkuiSearch--sizeY-compact{--vkui_internal--search_height:var(--vkui--size_search_height--compact)}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiSearch--sizeY-none{--vkui_internal--search_height:var(--vkui--size_search_height--compact)}}.vkuiSearch__field{background-color:#ebedf0;background-color:var(--vkui--color_search_field_background);border-radius:8px;border-radius:var(--vkui--size_border_radius--regular);display:flex;flex:2;height:var(--vkui_internal--search_height);position:relative;width:10000px}.vkuiSearch__field:hover{background-color:#e2e4e9;background-color:var(--vkui--color_search_field_background--hover)}.vkuiSearch__field:active{background-color:#d8dbe2;background-color:var(--vkui--color_search_field_background--active)}.vkuiSearch__control{align-items:center;border-radius:inherit;color:#818c99;color:var(--vkui--color_icon_medium);display:flex;height:100%;justify-content:flex-start;padding-left:12px;width:calc(100% - 1px)}.vkuiSearch__input{-webkit-appearance:none;background-color:initial;border:0;border-radius:inherit;bottom:0;box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);flex-grow:1;height:100%;left:0;margin:0;max-width:100%;min-width:0;padding:0 0 0 36px;position:absolute;right:0;top:0;width:-webkit-fill-available;width:-moz-available;width:stretch}.vkuiSearch__input::-webkit-search-cancel-button,.vkuiSearch__input::-webkit-search-decoration,.vkuiSearch__input::-webkit-search-results-button,.vkuiSearch__input::-webkit-search-results-decoration{display:none}.vkuiSearch__input:focus{outline:none}.vkuiSearch--has-after .vkuiSearch__input{border-bottom-right-radius:0;border-top-right-radius:0}.vkuiSearch--has-icon .vkuiSearch__input,.vkuiSearch--has-value .vkuiSearch__input{margin-right:calc(var(--vkui_internal--search_height) + 4px)}.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__input{margin-right:calc((var(--vkui_internal--search_height) + 4px) * 2)}.vkuiSearch__icons{color:#99a2ad;color:var(--vkui--color_icon_secondary)}.vkuiSearch__icon,.vkuiSearch__icons{align-items:center;display:flex;justify-content:center}.vkuiSearch__icon{border-radius:8px;border-radius:var(--vkui--size_border_radius--regular);height:100%;width:calc(var(--vkui_internal--search_height) + 4px)}.vkuiSearch__icon .vkuiIcon{padding:0}.vkuiSearch__after{flex:0;margin-left:4px;margin-right:calc(4px - 16px);margin-right:calc(4px - var(--vkui--size_base_padding_horizontal--regular));max-width:-webkit-min-content;max-width:-moz-min-content;max-width:min-content;min-width:auto;overflow:hidden;pointer-events:none;transform:translate(50%);transform-origin:left;transition:flex .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1);transition:flex .3s var(--vkui--animation_easing_platform),transform .3s var(--vkui--animation_easing_platform)}.vkuiSearch--focused .vkuiSearch__after,.vkuiSearch--has-value .vkuiSearch__after{flex:1;pointer-events:auto;transform:translate(0)}.vkuiSearch__afterText{display:block;overflow:hidden;text-overflow:clip;white-space:nowrap}.vkuiGroup--mode-plain .vkuiSearch{padding-top:4px}
+.vkuiSearch{-webkit-tap-highlight-color:transparent;--vkui_internal--search_height:var(--vkui--size_search_height--regular);display:flex;overflow:hidden;padding:8px 16px;padding:8px var(--vkui--size_base_padding_horizontal--regular)}.vkuiSearch--sizeY-compact{--vkui_internal--search_height:var(--vkui--size_search_height--compact)}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiSearch--sizeY-none{--vkui_internal--search_height:var(--vkui--size_search_height--compact)}}.vkuiSearch__field{background-color:#ebedf0;background-color:var(--vkui--color_search_field_background);border-radius:8px;border-radius:var(--vkui--size_border_radius--regular);display:flex;flex:2;height:var(--vkui_internal--search_height);position:relative;width:10000px}.vkuiSearch__field:hover{background-color:#e2e4e9;background-color:var(--vkui--color_search_field_background--hover)}.vkuiSearch__field:active{background-color:#d8dbe2;background-color:var(--vkui--color_search_field_background--active)}.vkuiSearch__control{align-items:center;border-radius:inherit;color:#818c99;color:var(--vkui--color_icon_medium);display:flex;height:100%;justify-content:flex-start;padding-left:12px;width:calc(100% - 1px)}.vkuiSearch__input{-webkit-appearance:none;background-color:initial;border:0;border-radius:inherit;bottom:0;box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);flex-grow:1;height:100%;left:0;margin:0;max-width:100%;min-width:0;padding:0 0 0 36px;position:absolute;right:0;top:0;width:-webkit-fill-available;width:-moz-available;width:stretch}.vkuiSearch__input::-webkit-search-cancel-button,.vkuiSearch__input::-webkit-search-decoration,.vkuiSearch__input::-webkit-search-results-button,.vkuiSearch__input::-webkit-search-results-decoration{display:none}.vkuiSearch__input:focus{outline:none}.vkuiSearch--has-after .vkuiSearch__input{border-bottom-right-radius:0;border-top-right-radius:0}.vkuiSearch--has-icon .vkuiSearch__input,.vkuiSearch--has-value .vkuiSearch__input{margin-right:calc(var(--vkui_internal--search_height) + 4px)}.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__input{margin-right:calc((var(--vkui_internal--search_height) + 4px) * 2)}.vkuiSearch--disabled{cursor:default;pointer-events:none}.vkuiSearch--disabled,.vkuiSearch__input:disabled{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiSearch__input::-webkit-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiSearch__input::-moz-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiSearch__input::-ms-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiSearch__input::placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiSearch__input:disabled::-webkit-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiSearch__input:disabled::-moz-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiSearch__input:disabled::-ms-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiSearch__input:disabled::placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiSearch__icons{color:#99a2ad;color:var(--vkui--color_icon_secondary)}.vkuiSearch__icon,.vkuiSearch__icons{align-items:center;display:flex;justify-content:center}.vkuiSearch__icon{border-radius:8px;border-radius:var(--vkui--size_border_radius--regular);height:100%;width:calc(var(--vkui_internal--search_height) + 4px)}.vkuiSearch__icon .vkuiIcon{padding:0}.vkuiSearch__after{flex:0;margin-left:4px;margin-right:calc(4px - 16px);margin-right:calc(4px - var(--vkui--size_base_padding_horizontal--regular));max-width:-webkit-min-content;max-width:-moz-min-content;max-width:min-content;min-width:auto;overflow:hidden;pointer-events:none;transform:translate(50%);transform-origin:left;transition:flex .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1);transition:flex .3s var(--vkui--animation_easing_platform),transform .3s var(--vkui--animation_easing_platform)}.vkuiSearch--focused .vkuiSearch__after,.vkuiSearch--has-value .vkuiSearch__after{flex:1;pointer-events:auto;transform:translate(0)}.vkuiSearch__afterText{display:block;overflow:hidden;text-overflow:clip;white-space:nowrap}.vkuiGroup--mode-plain .vkuiSearch{padding-top:4px}
 .vkuiTabs__in{align-items:stretch;display:flex}.vkuiTabs--withGaps{justify-content:flex-start}.vkuiInternalPanelHeader .vkuiTabs{font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);overflow:hidden}.vkuiInternalPanelHeader .vkuiTabs:after{content:"";display:block;width:1000px}.vkuiInternalGroup--mode-plain>.vkuiTabs--mode-default:first-child{margin-top:-8px}.vkuiInternalGroup--mode-card>.vkuiTabs--mode-default:first-child{margin-top:-4px}.vkuiInternalFixedLayout--ios.vkuiInternalFixedLayout--vertical-bottom .vkuiTabs:after{background:#fff;background:var(--vkui--color_background_content);content:"";height:100%;left:0;position:absolute;top:0;width:100%}.vkuiInternalFixedLayout--ios.vkuiInternalFixedLayout--vertical-bottom .vkuiSeparator,.vkuiInternalFixedLayout--ios.vkuiInternalFixedLayout--vertical-bottom .vkuiTabs__in{position:relative;z-index:2;z-index:var(--vkui_internal--z_index_tabs)}
 .vkuiTabsItem{align-items:center;border-radius:8px;border-radius:var(--vkui--size_border_radius--regular);box-sizing:border-box;display:flex;justify-content:center;max-width:100%;min-height:32px;min-width:0;padding:4px 8px;transition:background-color .15s ease-out}.vkuiTabsItem--withGaps{margin-bottom:8px;margin-top:8px}.vkuiTabsItem--withGaps:not(:first-of-type){margin-left:6px}.vkuiTabsItem--sizeY-compact{min-height:28px;padding-bottom:2px;padding-top:2px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiTabsItem--sizeY-none{min-height:28px;padding-bottom:2px;padding-top:2px}}.vkuiTabsItem[disabled]{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiTabsItem--mode-default{flex-basis:0;flex-grow:1;flex-shrink:0;min-height:48px;padding:12px 16px;position:relative}.vkuiTabsItem--sizeY-compact.vkuiTabsItem--mode-default{min-height:44px;padding-bottom:10px;padding-top:10px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiTabsItem--sizeY-none.vkuiTabsItem--mode-default{min-height:44px;padding-bottom:10px;padding-top:10px}}.vkuiTabsItem--hover.vkuiTabsItem--mode-default{background-color:rgba(0,16,61,.04);background-color:var(--vkui--color_transparent--hover)}.vkuiTabsItem--mode-accent{transition:background-color .15s ease-out,box-shadow .15s ease-out}.vkuiTabsItem--selected.vkuiTabsItem--mode-accent{background-color:#fff;background-color:var(--vkui--color_background_modal);box-shadow:0 4px 8px rgba(0,0,0,.04),0 0 4px rgba(0,0,0,.06);box-shadow:var(--vkui--elevation2)}.vkuiTabsItem--hover.vkuiTabsItem--mode-accent{background-color:#f5f5f5;background-color:var(--vkui--color_background_secondary)}.vkuiTabsItem--mode-accent:before{border:1px solid transparent;border:var(--vkui_internal--thin_border) solid transparent;border-radius:inherit;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.vkuiTabsItem--selected.vkuiTabsItem--mode-accent:before{border-color:#d7d8d9;border-color:var(--vkui--color_separator_primary)}.vkuiTabsItem--selected.vkuiTabsItem--mode-secondary{background-color:rgba(0,0,0,.04);background-color:var(--vkui--color_background_secondary_alpha)}.vkuiTabsItem--hover.vkuiTabsItem--mode-secondary{background-color:rgba(0,0,0,.08);background-color:var(--vkui--color_background_secondary_alpha--hover)}.vkuiTabsItem__before{color:#818c99;color:var(--vkui--color_icon_medium);margin-right:6px;transition:color .15s ease-out}.vkuiTabsItem--selected .vkuiTabsItem__before{color:#2c2d2e;color:var(--vkui--color_icon_primary)}.vkuiTabsItem--selected.vkuiTabsItem--mode-accent .vkuiTabsItem__before{color:#2688eb;color:var(--vkui--color_icon_accent_themed)}.vkuiTabsItem--selected.vkuiTabsItem--mode-secondary .vkuiTabsItem__before{opacity:.72}.vkuiTabsItem__label{color:#818c99;color:var(--vkui--color_text_secondary);max-width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;transition:color .15s ease-out;white-space:nowrap}.vkuiTabsItem--selected .vkuiTabsItem__label{color:#000;color:var(--vkui--color_text_primary)}.vkuiTabsItem--selected.vkuiTabsItem--mode-accent .vkuiTabsItem__label{color:#2688eb;color:var(--vkui--color_text_accent_themed)}.vkuiTabsItem--selected.vkuiTabsItem--mode-secondary .vkuiTabsItem__label{opacity:.72}.vkuiTabsItem__status{margin-left:6px}.vkuiTabsItem__status--count{color:#99a2ad;color:var(--vkui--color_text_tertiary)}.vkuiTabsItem__after{color:#2688eb;color:var(--vkui--color_icon_accent_themed);margin-left:6px}.vkuiTabsItem__underline{background-color:#2688eb;background-color:var(--vkui--color_background_accent);border-radius:2px;bottom:5px;height:2px;left:16px;opacity:0;pointer-events:none;position:absolute;right:16px;transition:opacity .15s ease-out}.vkuiTabsItem--sizeY-compact .vkuiTabsItem__underline{bottom:3px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiTabsItem--sizeY-none .vkuiTabsItem__underline{bottom:3px}}.vkuiTabsItem__underline[data-selected=true]{opacity:1}.vkuiInternalTabs--vkcom .vkuiTabsItem{flex-grow:0;min-width:auto;padding-left:10px;padding-right:10px}.vkuiInternalTabs--vkcom .vkuiTabsItem__underline{bottom:0;left:2px;right:2px}.vkuiInternalHorizontalScroll .vkuiTabsItem{flex-basis:auto;flex-grow:1;flex-shrink:0;min-width:64px}
 .vkuiPullToRefresh{flex-grow:1}.vkuiPullToRefresh--refreshing{pointer-events:none;touch-action:none}.vkuiPullToRefresh__controls{pointer-events:none;width:100%}.vkuiPullToRefresh:not(.vkuiPullToRefresh--ios) .vkuiPullToRefresh__controls{z-index:9;z-index:var(--vkui_internal--z_index_pull_to_refresh)}.vkuiPullToRefresh__spinner{align-items:center;background:#fff;background:var(--vkui--color_background_modal);border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.2);box-sizing:border-box;color:#2688eb;color:var(--vkui--color_icon_accent);display:flex;height:40px;justify-content:center;margin:auto;opacity:0;transition:transform .3s cubic-bezier(.1,0,.25,1),opacity .22s ease-out;width:40px}.vkuiPullToRefresh--ios .vkuiPullToRefresh__spinner{background:none;border-radius:0;box-shadow:none;color:#818c99;color:var(--vkui--color_icon_medium)}.vkuiPullToRefresh--watching .vkuiPullToRefresh__spinner{transition:opacity .22s ease-out}.vkuiPullToRefresh__spinner-self{stroke:currentColor}.vkuiPullToRefresh--ios.vkuiPullToRefresh--refreshing .vkuiPullToRefresh__spinner-self{animation:vkui-PullToRefreshToRefreshing .38s ease-out}.vkuiPullToRefresh__spinner-path{transform:rotate(-90deg);transform-origin:center center;transition:stroke-dashoffset 167ms ease-out}.vkuiPullToRefresh--refreshing .vkuiPullToRefresh__spinner-path,.vkuiPullToRefresh--watching .vkuiPullToRefresh__spinner-path{transition:none}.vkuiPullToRefresh__spinner--on .vkuiPullToRefresh__spinner-path{animation:vkui-ptr-rotator .7s linear infinite;animation:vkui-ptr-rotator var(--vkui_internal--duration) linear infinite}.vkuiPullToRefresh__content{overflow:hidden;transition:transform .4s cubic-bezier(.4,0,.2,1);transition:transform .4s var(--vkui--animation_easing_platform)}.vkuiPullToRefresh--watching .vkuiPullToRefresh__content{transition:none}@keyframes vkui-PullToRefreshToRefreshing{0%{transform:scale(1)}30%{transform:scale(.6)}90%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes vkui-ptr-rotator{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
@@ -116,16 +116,15 @@
 .vkuiTextarea{position:relative}.vkuiTextarea__el{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);display:block;margin:0;max-height:204px;padding:12px;position:relative;resize:none;width:100%;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiTextarea__el[cols]{width:auto}.vkuiTextarea--sizeY-compact .vkuiTextarea__el{max-height:196px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiTextarea--sizeY-none .vkuiTextarea__el{max-height:196px}}.vkuiTextarea__el::-webkit-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiTextarea__el::-moz-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiTextarea__el::-ms-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiTextarea__el::placeholder{color:#818c99;color:var(--vkui--color_text_secondary);opacity:1}.vkuiTextarea__el:disabled{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiTextarea__el:disabled::-webkit-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiTextarea__el:disabled::-moz-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiTextarea__el:disabled::-ms-input-placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiTextarea__el:disabled::placeholder{color:#818c99;color:var(--vkui--color_text_secondary)}
 .vkuiRadio{display:block;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);padding:0 16px;padding:0 var(--vkui--size_base_padding_horizontal--regular)}.vkuiInternalFormItem .vkuiRadio{box-sizing:initial;margin:0 calc(-1 * 16px);margin:0 calc(-1 * var(--vkui--size_base_padding_horizontal--regular));width:100%}.vkuiRadio__container{align-items:center;display:flex;justify-content:flex-start}.vkuiRadio__input:disabled~.vkuiRadio__container{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiRadio__icon{color:#b8c1cc;color:var(--vkui--color_icon_tertiary);flex-shrink:0;height:22px;margin-right:14px;transition:color .15s cubic-bezier(.4,0,.2,1);transition:color .15s var(--vkui--animation_easing_platform);width:22px}.vkuiRadio__input:checked~.vkuiRadio__container .vkuiRadio__icon{color:#2688eb;color:var(--vkui--color_icon_accent)}.vkuiRadio__icon .vkuiRadio__pin{transform:scale(0);transform-origin:12px 12px;transition:transform .15s cubic-bezier(.4,0,.2,1);transition:transform .15s var(--vkui--animation_easing_platform)}.vkuiRadio__input:checked~.vkuiRadio__container .vkuiRadio__icon .vkuiRadio__pin{transform:none}.vkuiRadio__content{color:#000;color:var(--vkui--color_text_primary);display:block;flex-grow:1;max-width:100%}.vkuiRadio__description{color:#818c99;color:var(--vkui--color_text_secondary);display:block;margin-bottom:12px;margin-top:2px}.vkuiRadio__title{align-items:center;display:flex;justify-content:space-between;margin-top:12px}.vkuiRadio__title:last-child{margin-bottom:12px}.vkuiRadio__titleAfter{color:#b8c1cc;color:var(--vkui--color_icon_tertiary);margin-left:4px}.vkuiRadio--sizeY-compact .vkuiRadio__title{margin-top:8px}.vkuiRadio--sizeY-compact .vkuiRadio__title:last-child{margin-bottom:8px}.vkuiRadio--sizeY-compact .vkuiRadio__description{margin-bottom:7px}.vkuiRadio--sizeY-compact .vkuiRadio__icon{height:18px;width:18px}.vkuiRadio--sizeY-compact .vkuiRadio__icon:after{height:12px;width:12px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiRadio--sizeY-none .vkuiRadio__title{margin-top:8px}.vkuiRadio--sizeY-none .vkuiRadio__title:last-child{margin-bottom:8px}.vkuiRadio--sizeY-none .vkuiRadio__description{margin-bottom:7px}.vkuiRadio--sizeY-none .vkuiRadio__icon{height:18px;width:18px}.vkuiRadio--sizeY-none .vkuiRadio__icon:after{height:12px;width:12px}}.vkuiInternalRadioGroup .vkuiRadio{box-sizing:border-box;flex:1;margin:0}
 .vkuiRadioGroup--mode-horizontal{display:flex}.vkuiInternalFormItem .vkuiRadioGroup{box-sizing:initial;margin:0 calc(-1 * 16px);margin:0 calc(-1 * var(--vkui--size_base_padding_horizontal--regular))}
-.vkuiCheckbox{align-items:center;display:flex;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);justify-content:flex-start;min-height:44px;min-height:var(--vkui--size_field_height--regular);min-width:44px;min-width:var(--vkui--size_field_height--regular);padding:0 16px;padding:0 var(--vkui--size_base_padding_horizontal--regular)}.vkuiInternalFormItem .vkuiCheckbox{box-sizing:initial;margin:0 calc(-1 * 16px);margin:0 calc(-1 * var(--vkui--size_base_padding_horizontal--regular));width:100%}.vkuiCheckbox__icon{flex-shrink:0;margin-right:12px}.vkuiCheckbox__icon--indeterminate,.vkuiCheckbox__icon--on{color:#2688eb;color:var(--vkui--color_icon_accent);display:none}.vkuiCheckbox__icon--off{color:#b8c1cc;color:var(--vkui--color_icon_tertiary)}.vkuiCheckbox__content{color:#000;color:var(--vkui--color_text_primary);flex-grow:1;font-weight:400;font-weight:var(--vkui--font_weight_accent3);word-break:break-word}.vkuiCheckbox--sizeY-regular:not(.vkuiCheckbox--vkcom) .vkuiCheckbox__content{font-size:16px;font-size:var(--vkui--font_headline1--font_size--regular);line-height:20px;line-height:var(--vkui--font_headline1--line_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiCheckbox--sizeY-none:not(.vkuiCheckbox--vkcom) .vkuiCheckbox__content{font-size:16px;font-size:var(--vkui--font_headline1--font_size--regular);line-height:20px;line-height:var(--vkui--font_headline1--line_height--regular)}}.vkuiCheckbox--sizeY-compact .vkuiCheckbox__content,.vkuiCheckbox--vkcom .vkuiCheckbox__content{font-size:15px;font-size:var(--vkui--font_text--font_size--compact);line-height:20px;line-height:var(--vkui--font_text--line_height--compact)}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiCheckbox--sizeY-none .vkuiCheckbox__content{font-size:15px;font-size:var(--vkui--font_text--font_size--compact);line-height:20px;line-height:var(--vkui--font_text--line_height--compact)}}.vkuiCheckbox__description{color:#818c99;color:var(--vkui--color_text_secondary);display:block;margin-bottom:12px;margin-top:2px}.vkuiCheckbox__title{align-items:center;display:flex;justify-content:space-between;margin-top:12px}.vkuiCheckbox__title:last-child{margin-bottom:12px}.vkuiCheckbox__titleAfter{color:#b8c1cc;color:var(--vkui--color_icon_tertiary);margin-left:4px}.vkuiCheckbox__input:checked~.vkuiCheckbox__icon--on{display:flex}.vkuiCheckbox__input:checked~.vkuiCheckbox__icon--off,.vkuiCheckbox__input:indeterminate~.vkuiCheckbox__icon--indeterminate{display:none}.vkuiCheckbox__input:indeterminate~.vkuiCheckbox__icon--indeterminate{display:flex}.vkuiCheckbox__input:indeterminate~.vkuiCheckbox__icon--off,.vkuiCheckbox__input:indeterminate~.vkuiCheckbox__icon--on{display:none}.vkuiCheckbox__input[disabled]~*{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiCheckbox--sizeY-compact{min-height:36px;min-height:var(--vkui--size_field_height--compact);min-width:36px;min-width:var(--vkui--size_field_height--compact)}.vkuiCheckbox--sizeY-compact .vkuiCheckbox__title{margin-top:8px}.vkuiCheckbox--sizeY-compact .vkuiCheckbox__description,.vkuiCheckbox--sizeY-compact .vkuiCheckbox__title:last-child{margin-bottom:8px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiCheckbox--sizeY-none{min-height:36px;min-height:var(--vkui--size_field_height--compact);min-width:36px;min-width:var(--vkui--size_field_height--compact)}.vkuiCheckbox--sizeY-none .vkuiCheckbox__title{margin-top:8px}.vkuiCheckbox--sizeY-none .vkuiCheckbox__description,.vkuiCheckbox--sizeY-none .vkuiCheckbox__title:last-child{margin-bottom:8px}}.vkuiCheckbox--simple{align-items:center;border-radius:50%;display:flex;justify-content:center;padding:0}.vkuiCheckbox--simple .vkuiCheckbox__content{display:none}.vkuiCheckbox--simple .vkuiCheckbox__icon{margin:0}
+.vkuiCheckbox{align-items:center;display:flex;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);justify-content:flex-start;min-height:44px;min-height:var(--vkui--size_field_height--regular);min-width:44px;min-width:var(--vkui--size_field_height--regular);padding:0 16px;padding:0 var(--vkui--size_base_padding_horizontal--regular)}.vkuiInternalFormItem .vkuiCheckbox{box-sizing:initial;margin:0 calc(-1 * 16px);margin:0 calc(-1 * var(--vkui--size_base_padding_horizontal--regular));width:100%}.vkuiCheckbox__icon{flex-shrink:0;margin-right:12px}.vkuiCheckbox__icon--indeterminate,.vkuiCheckbox__icon--on{color:#2688eb;color:var(--vkui--color_icon_accent);display:none}.vkuiCheckbox__icon--off{color:#b8c1cc;color:var(--vkui--color_icon_tertiary)}.vkuiCheckbox__content{color:#000;color:var(--vkui--color_text_primary);flex-grow:1;word-break:break-word}.vkuiCheckbox__description{color:#818c99;color:var(--vkui--color_text_secondary);display:block;margin-bottom:12px;margin-top:2px}.vkuiCheckbox__title{align-items:center;display:flex;justify-content:space-between;margin-top:12px}.vkuiCheckbox__title:last-child{margin-bottom:12px}.vkuiCheckbox__titleAfter{color:#b8c1cc;color:var(--vkui--color_icon_tertiary);margin-left:4px}.vkuiCheckbox__input:checked~.vkuiCheckbox__icon--on{display:flex}.vkuiCheckbox__input:checked~.vkuiCheckbox__icon--off,.vkuiCheckbox__input:indeterminate~.vkuiCheckbox__icon--indeterminate{display:none}.vkuiCheckbox__input:indeterminate~.vkuiCheckbox__icon--indeterminate{display:flex}.vkuiCheckbox__input:indeterminate~.vkuiCheckbox__icon--off,.vkuiCheckbox__input:indeterminate~.vkuiCheckbox__icon--on{display:none}.vkuiCheckbox__input[disabled]~*{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiCheckbox--sizeY-compact{min-height:36px;min-height:var(--vkui--size_field_height--compact);min-width:36px;min-width:var(--vkui--size_field_height--compact)}.vkuiCheckbox--sizeY-compact .vkuiCheckbox__title{margin-top:8px}.vkuiCheckbox--sizeY-compact .vkuiCheckbox__description,.vkuiCheckbox--sizeY-compact .vkuiCheckbox__title:last-child{margin-bottom:8px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiCheckbox--sizeY-none{min-height:36px;min-height:var(--vkui--size_field_height--compact);min-width:36px;min-width:var(--vkui--size_field_height--compact)}.vkuiCheckbox--sizeY-none .vkuiCheckbox__title{margin-top:8px}.vkuiCheckbox--sizeY-none .vkuiCheckbox__description,.vkuiCheckbox--sizeY-none .vkuiCheckbox__title:last-child{margin-bottom:8px}}.vkuiCheckbox--simple{align-items:center;border-radius:50%;display:flex;justify-content:center;padding:0}.vkuiCheckbox--simple .vkuiCheckbox__content{display:none}.vkuiCheckbox--simple .vkuiCheckbox__icon{margin:0}
 .vkuiCustomSelect{cursor:pointer;display:block;position:relative;width:100%}.vkuiCustomSelect--pop-down{border-bottom-left-radius:0;border-bottom-right-radius:0}.vkuiCustomSelect--pop-up{border-top-left-radius:0;border-top-right-radius:0}.vkuiCustomSelect__control{display:none}.vkuiCustomSelect__empty{color:#818c99;color:var(--vkui--color_text_secondary);padding:12px 0;text-align:center}.vkuiCustomSelect__fetching{align-items:center;display:flex;justify-content:center}.vkuiCustomSelect__dropdown-icon{margin-right:10px}.vkuiCustomSelect--clear-icon{margin-right:-6px}.vkuiCustomSelect--sizeY-compact .vkuiCustomSelect__dropdown-icon{margin-right:8px}.vkuiCustomSelect--sizeY-compact .vkuiCustomSelect--clear-icon{margin-right:-2px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiCustomSelect--sizeY-none .vkuiCustomSelect__dropdown-icon{margin-right:8px}.vkuiCustomSelect--sizeY-none .vkuiCustomSelect--clear-icon{margin-right:-2px}}
 .vkuiCustomSelectOption{align-items:center;box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);cursor:pointer;display:flex;padding:8px 12px;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;width:100%}.vkuiCustomSelectOption--hierarchy{--vkui_internal--custom_select_option_hierarchy_level:0;padding-left:calc(0 * 32px);padding-left:calc(var(--vkui_internal--custom_select_option_hierarchy_level) * var(--vkui--size_option_hierarchy--regular))}.vkuiCustomSelectOption--sizeY-regular{min-height:44px}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiCustomSelectOption--sizeY-none{min-height:44px}}.vkuiCustomSelectOption--disabled{cursor:default;opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiCustomSelectOption--hover{background-color:rgba(0,16,61,.04);background-color:var(--vkui--color_transparent--hover)}.vkuiCustomSelectOption__before{flex-shrink:0;margin-right:7px}.vkuiCustomSelectOption__main{flex-grow:1;max-width:100%;min-width:0}.vkuiCustomSelectOption__children{min-width:0;overflow:hidden;text-overflow:ellipsis}.vkuiCustomSelectOption__after{align-items:center;display:flex;flex-shrink:0;margin-left:8px}.vkuiCustomSelectOption__description{color:#818c99;color:var(--vkui--color_text_secondary);overflow:hidden;text-overflow:ellipsis}.vkuiCustomSelectOption__selectedIcon{color:#2688eb;color:var(--vkui--color_icon_accent)}.vkuiCustomSelectOption__selectedIcon:not(:first-child){margin-left:8px}
-.vkuiSelect{box-sizing:border-box;cursor:pointer;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);position:relative}.vkuiSelect__el{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;display:block;font-family:inherit;font-size:16px;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%;z-index:6;z-index:var(--vkui_internal--z_index_form_field_side)}.vkuiSelect__container{box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);flex-grow:1;flex-shrink:1;overflow:hidden;padding-left:12px;padding-right:0;position:relative;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiSelect--hasBefore .vkuiSelect__container{padding-left:0}.vkuiSelect--multiline .vkuiSelect__container{padding-bottom:12px;padding-top:12px}.vkuiSelect--sizeY-compact.vkuiSelect--multiline .vkuiSelect__container{padding-bottom:8px;padding-top:8px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiSelect--sizeY-none.vkuiSelect--multiline .vkuiSelect__container{padding-bottom:8px;padding-top:8px}}.vkuiSelect__title{display:block}.vkuiSelect:not(.vkuiSelect--multiline) .vkuiSelect__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiSelect--empty .vkuiSelect__title{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiSelect--align-right .vkuiSelect__title{text-align:right}.vkuiSelect--align-center .vkuiSelect__title{text-align:center}.vkuiInternalCalendarHeader__picker .vkuiSelect__container{padding-right:4px}
-.vkuiSelectTypography--selectType-accent{font-size:15px;font-size:var(--vkui--font_paragraph--font_size--regular);font-weight:600;font-weight:var(--vkui--font_weight_accent1);line-height:20px;line-height:var(--vkui--font_paragraph--line_height--regular)}:not(.vkuiSelectTypography--selectType-accent).vkuiSelectTypography{font-size:16px;font-size:var(--vkui--font_headline1--font_size--regular);font-weight:400;font-weight:var(--vkui--font_weight_accent3);line-height:20px;line-height:var(--vkui--font_headline1--line_height--regular)}.vkuiSelectTypography--selectType-accent.vkuiSelectTypography--android{font-weight:500;font-weight:var(--vkui--font_weight_accent2)}.vkuiSelectTypography--sizeY-compact:not(.vkuiSelectTypography--selectType-accent),.vkuiSelectTypography--vkcom:not(.vkuiSelectTypography--selectType-accent){font-size:15px;font-size:var(--vkui--font_text--font_size--compact);font-weight:400;font-weight:var(--vkui--font_weight_accent3);line-height:20px;line-height:var(--vkui--font_text--line_height--compact)}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiSelectTypography--sizeY-none:not(.vkuiSelectTypography--selectType-accent){font-size:15px;font-size:var(--vkui--font_text--font_size--compact);font-weight:400;font-weight:var(--vkui--font_weight_accent3);line-height:20px;line-height:var(--vkui--font_text--line_height--compact)}}
+.vkuiSelect{box-sizing:border-box;cursor:pointer;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);position:relative}.vkuiSelect__el{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;display:block;font-family:inherit;font-size:15px;font-size:var(--vkui--font_paragraph--font_size--regular);height:100%;left:0;opacity:0;position:absolute;top:0;width:100%;z-index:6;z-index:var(--vkui_internal--z_index_form_field_side)}.vkuiSelect__container{box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);flex-grow:1;flex-shrink:1;overflow:hidden;padding-left:12px;padding-right:0;position:relative;z-index:1;z-index:var(--vkui_internal--z_index_form_field_element)}.vkuiSelect--hasBefore .vkuiSelect__container{padding-left:0}.vkuiSelect--multiline .vkuiSelect__container{padding-bottom:12px;padding-top:12px}.vkuiSelect--sizeY-compact.vkuiSelect--multiline .vkuiSelect__container{padding-bottom:8px;padding-top:8px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiSelect--sizeY-none.vkuiSelect--multiline .vkuiSelect__container{padding-bottom:8px;padding-top:8px}}.vkuiSelect__title{display:block}.vkuiSelect:not(.vkuiSelect--multiline) .vkuiSelect__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiSelect--empty .vkuiSelect__title{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiSelect--align-right .vkuiSelect__title{text-align:right}.vkuiSelect--align-center .vkuiSelect__title{text-align:center}.vkuiInternalCalendarHeader__picker .vkuiSelect__container{padding-right:4px}
 .vkuiCustomSelectDropdown{background-color:#fff;background-color:var(--vkui--color_background_modal);border:1px solid rgba(0,0,0,.12);border:var(--vkui_internal--thin_border) solid var(--vkui--color_field_border_alpha);border-radius:8px;box-shadow:0 0 2px rgba(0,0,0,.03),0 2px 2px rgba(0,0,0,.06);box-shadow:var(--vkui--elevation1);box-sizing:border-box;overflow:hidden}.vkuiCustomSelectDropdown--wide{width:100%}.vkuiCustomSelectDropdown--bottom{border-top:0;border-top-left-radius:0;border-top-right-radius:0}.vkuiCustomSelectDropdown--top{border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0;bottom:100%;box-shadow:0 0 2px rgba(0,0,0,.03),0 -2px 2px rgba(0,0,0,.06);box-shadow:var(--vkui--elevation1_invert_y)}.vkuiCustomSelectDropdown__fetching{padding:12px 0}.vkuiCustomSelectDropdown__in{max-height:160px}.vkuiInternalCalendarHeader__pickers .vkuiCustomSelectDropdown__in{max-height:184px}
 .vkuiCustomScrollView{height:100%;overflow:hidden;position:relative;width:100%}.vkuiCustomScrollView__box{height:100%;max-height:inherit;overflow-x:hidden;overflow-y:scroll;padding-right:100px;position:relative;scrollbar-width:none;width:100%}.vkuiCustomScrollView__box::-webkit-scrollbar{display:none}.vkuiCustomScrollView__barY:active+.vkuiCustomScrollView__box{pointer-events:none}.vkuiCustomScrollView__barY{height:100%;position:absolute;right:0;top:0;width:10px}.vkuiCustomScrollView__trackerY{box-sizing:border-box;left:0;padding:4px 4px 4px 0;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:10px}.vkuiCustomScrollView__trackerY--hidden{opacity:0;transition:opacity .2s}.vkuiCustomScrollView__trackerY:before{background-color:#818c99;background-color:var(--vkui--color_icon_medium);border-radius:12px;content:"";display:block;height:100%;opacity:.48;transition:transform .2s,opacity .2s;width:100%}.vkuiCustomScrollView__trackerY:active:before,.vkuiCustomScrollView__trackerY:hover:before{opacity:.8;transform:scaleX(1.3333)}.vkuiInternalCustomSelectDropdown .vkuiCustomScrollView__box{padding-right:8px}.vkuiInternalCustomSelectDropdown--wide .vkuiCustomScrollView__box{padding-right:0}
 .vkuiDatePicker{border:0;margin:0;padding:0}.vkuiDatePicker__container{display:flex;flex-direction:row;width:100%}.vkuiDatePicker__day{min-width:72px}.vkuiDatePicker__month{display:flex;flex:1 0 0;min-width:0;padding:0 8px}.vkuiDatePicker__year{min-width:92px}.vkuiDatePicker__monthSelect{width:100%}
 .vkuiSegmentedControl{background-color:#f5f5f5;background-color:var(--vkui--color_background_secondary);border-radius:8px;border-radius:var(--vkui--size_border_radius--regular);box-sizing:border-box;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);height:30px;padding:2px}.vkuiSegmentedControl--size-l{height:36px}.vkuiSegmentedControl__in{border-radius:inherit;display:flex;height:100%;position:relative;transition:all .1s ease-out;width:100%}.vkuiSegmentedControl__slider{background-color:#fff;background-color:var(--vkui--color_segmented_control);border-radius:inherit;bottom:0;box-shadow:inset 0 0 0 .5px rgba(0,0,0,.08),0 3px 8px rgba(0,0,0,.12),0 3px 1px rgba(0,0,0,.04);box-shadow:inset 0 0 0 .5px var(--vkui--color_image_border_alpha),0 3px 8px rgba(0,0,0,.12),0 3px 1px rgba(0,0,0,.04);left:0;position:absolute;top:0;transform-origin:0 0;transition:transform .15s}.vkuiSegmentedControl__option{display:block;flex:1;margin:0;padding:0;position:relative}.vkuiSegmentedControl--sizeY-regular{height:36px}.vkuiSegmentedControl--sizeY-regular.vkuiSegmentedControl--size-l{height:44px}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiSegmentedControl--sizeY-none{height:36px}.vkuiSegmentedControl--sizeY-none.vkuiSegmentedControl--size-l{height:44px}}
-.vkuiSegmentedControlOption{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:inherit;box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);cursor:pointer;height:100%;transition:color .1s ease-out;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vkuiSegmentedControlOption .vkuiIcon{color:#2c2d2e;color:var(--vkui--color_icon_primary)}.vkuiSegmentedControlOption:not(.vkuiSegmentedControlOption--checked):hover{opacity:.5}.vkuiSegmentedControlOption__content{align-content:center;align-items:center;border-radius:inherit;display:flex;font-size:16px;font-size:var(--vkui--font_text--font_size--regular);font-weight:500;font-weight:var(--vkui--font_weight_accent2);height:100%;justify-content:center;line-height:20px;line-height:var(--vkui--font_text--line_height--regular);width:100%}.vkuiSegmentedControlOption__content--sizeY-compact.vkuiSegmentedControlOption__content{font-size:13px;font-size:var(--vkui--font_footnote--font_size--regular);font-weight:400;font-weight:var(--vkui--font_weight_accent3);line-height:16px;line-height:var(--vkui--font_footnote--line_height--regular)}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiSegmentedControlOption__content--sizeY-none.vkuiSegmentedControlOption__content{font-size:13px;font-size:var(--vkui--font_footnote--font_size--regular);font-weight:400;font-weight:var(--vkui--font_weight_accent3);line-height:16px;line-height:var(--vkui--font_footnote--line_height--regular)}}
+.vkuiSegmentedControlOption{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:inherit;box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);cursor:pointer;height:100%;transition:color .1s ease-out;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vkuiSegmentedControlOption .vkuiIcon{color:#2c2d2e;color:var(--vkui--color_icon_primary)}.vkuiSegmentedControlOption:not(.vkuiSegmentedControlOption--checked):hover{opacity:.5}.vkuiSegmentedControlOption__content{align-content:center;align-items:center;border-radius:inherit;display:flex;height:100%;justify-content:center;width:100%}
 .vkuiCalendar{background:#fff;background:var(--vkui--color_background_modal);border:.5px solid #d7d8d9;border:.5px solid var(--vkui--color_separator_primary);border-radius:8px;box-shadow:0 0 2px rgba(0,0,0,.03),0 2px 2px rgba(0,0,0,.06);box-shadow:var(--vkui--elevation1);box-sizing:border-box;display:flex;flex-direction:column;padding:12px;width:305px}.vkuiCalendar__time{border-top:1px solid #d7d8d9;border-top:1px solid var(--vkui--color_separator_primary);margin:12px -12px 0;padding:12px 12px 0}.vkuiCalendar__header{margin-bottom:4px}.vkuiCalendar--size-s{padding:8px;width:220px}.vkuiCalendar--size-s .vkuiCalendar__header{margin-bottom:0}
 .vkuiCalendarHeader{align-items:center;display:flex;justify-content:center;min-height:36px;position:relative}.vkuiCalendarHeader__pickers{color:#000;color:var(--vkui--color_text_primary);display:flex;position:absolute}.vkuiCalendarHeader__picker+.vkuiCalendarHeader__picker{margin-left:4px}.vkuiCalendarHeader__nav-icon{align-items:center;display:flex;justify-content:center;padding:3px;position:absolute}.vkuiCalendarHeader__nav-icon--accent{color:#2688eb;color:var(--vkui--color_icon_accent)}.vkuiCalendarHeader__nav-icon-next{right:0}.vkuiCalendarHeader__nav-icon-prev{left:0}.vkuiCalendarHeader__month{text-transform:capitalize}
 .vkuiCalendarDays{display:flex;flex-direction:column;flex-grow:1;justify-content:space-around}.vkuiCalendarDays__row{display:flex;flex-grow:1;justify-content:center}.vkuiCalendarDays__row:not(:last-child){margin-bottom:4px}.vkuiCalendarDays__row--size-s:not(:last-child){margin-bottom:0}.vkuiCalendarDays__weekday{align-items:center;color:#6d7885;color:var(--vkui--color_text_subhead);display:flex;flex-basis:calc(100% / 7);flex-grow:0;height:32px;justify-content:center;text-transform:capitalize}
@@ -133,8 +132,8 @@
 .vkuiCalendarTime{align-items:center;display:flex}.vkuiCalendarTime__picker{width:77px}.vkuiCalendarTime__divider{color:#000;color:var(--vkui--color_text_primary);font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);margin-left:6px;margin-right:6px}.vkuiCalendarTime__button{margin-left:auto}
 .vkuiCalendarRange{background:#fff;background:var(--vkui--color_background_modal);border:.5px solid #d7d8d9;border:.5px solid var(--vkui--color_separator_primary);border-radius:8px;box-shadow:0 0 2px rgba(0,0,0,.03),0 2px 2px rgba(0,0,0,.06);box-shadow:var(--vkui--elevation1);box-sizing:border-box;display:flex;flex-wrap:wrap;justify-content:space-around;padding:12px;width:610px}.vkuiCalendarRange__inner{display:flex;flex-direction:column;flex-grow:1}.vkuiCalendarRange__inner:not(:last-child){margin-right:24px}.vkuiCalendarRange__header{margin-bottom:4px}
 .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__divider,.vkuiInputLike__last_character{letter-spacing:1px!important}.vkuiInputLike__divider{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiInputLike--full+.vkuiInputLike__divider{color:#000;color:var(--vkui--color_text_primary)}
-.vkuiDateInput__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)}.vkuiDateInput__input--time-divider{letter-spacing:6px!important}.vkuiDateInput--sizeY-compact .vkuiDateInput__input{font-size:15px;margin-right:22px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiDateInput--sizeY-none .vkuiDateInput__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 (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiDateRangeInput--sizeY-none .vkuiDateRangeInput__input{font-size:15px;margin-right:22px}}
+.vkuiDateInput__input{cursor:text;flex-grow:1;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)}.vkuiDateInput__input--time-divider{letter-spacing:6px!important}.vkuiDateInput--sizeY-compact .vkuiDateInput__input{margin-right:22px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiDateInput--sizeY-none .vkuiDateInput__input{margin-right:22px}}
+.vkuiDateRangeInput__input{cursor:text;flex-grow:1;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{margin-right:22px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiDateRangeInput--sizeY-none .vkuiDateRangeInput__input{margin-right:22px}}
 .vkuiDiv{padding:12px 16px;padding:var(--vkui--size_base_padding_vertical--regular) var(--vkui--size_base_padding_horizontal--regular)}
 .vkuiVisuallyHiddenInput{clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;opacity:0;overflow:hidden;position:absolute;white-space:nowrap}
 .vkuiPromoBanner{background:#fff;background:var(--vkui--color_background_content);box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);outline:1px solid rgba(0,0,0,.12);outline:var(--vkui_internal--thin_border) solid var(--vkui--color_separator_primary_alpha);padding-bottom:10px;position:relative;width:100%}.vkuiPromoBanner__head{color:#818c99;color:var(--vkui--color_text_secondary);display:flex;padding:14px 16px 10px;padding:14px var(--vkui--size_base_padding_horizontal--regular) 10px}.vkuiPromoBanner__age{margin-left:6px}.vkuiPromoBanner__close{align-items:center;color:#99a2ad;color:var(--vkui--color_icon_secondary);display:flex;height:48px;justify-content:center;position:absolute;right:0;top:0;width:48px}.vkuiPromoBanner__close:active{opacity:.7}.vkuiPromoBanner__pixels{display:none}