@vkontakte/vkui 4.30.0 → 4.33.0

package/src/index.ts

@@ -7,17 +7,17 @@ import "./styles/common.css";
 /**
  * Layout
  */
-export { default as Root } from "./components/Root/Root";
+export { Root } from "./components/Root/Root";
 export type { RootProps } from "./components/Root/Root";
-export { default as View } from "./components/View/View";
+export { View } from "./components/View/View";
 export type { ViewProps } from "./components/View/View";
 export { Panel } from "./components/Panel/Panel";
 export type { PanelProps } from "./components/Panel/Panel";
 export { PanelHeaderButton } from "./components/PanelHeaderButton/PanelHeaderButton";
 export type { PanelHeaderButtonProps } from "./components/PanelHeaderButton/PanelHeaderButton";
-export { default as PanelHeader } from "./components/PanelHeader/PanelHeader";
+export { PanelHeader } from "./components/PanelHeader/PanelHeader";
 export type { PanelHeaderProps } from "./components/PanelHeader/PanelHeader";
-export { default as PanelHeaderContent } from "./components/PanelHeaderContent/PanelHeaderContent";
+export { PanelHeaderContent } from "./components/PanelHeaderContent/PanelHeaderContent";
 export type { PanelHeaderContentProps } from "./components/PanelHeaderContent/PanelHeaderContent";
 export { PanelHeaderContext } from "./components/PanelHeaderContext/PanelHeaderContext";
 export type { PanelHeaderContextProps } from "./components/PanelHeaderContext/PanelHeaderContext";
@@ -25,15 +25,15 @@ export { SplitLayout } from "./components/SplitLayout/SplitLayout";
 export type { SplitLayoutProps } from "./components/SplitLayout/SplitLayout";
 export { SplitCol } from "./components/SplitCol/SplitCol";
 export type { SplitColProps } from "./components/SplitCol/SplitCol";
-export { default as Epic } from "./components/Epic/Epic";
+export { Epic } from "./components/Epic/Epic";
 export type { EpicProps } from "./components/Epic/Epic";
-export { default as Tabbar } from "./components/Tabbar/Tabbar";
+export { Tabbar } from "./components/Tabbar/Tabbar";
 export type { TabbarProps } from "./components/Tabbar/Tabbar";
-export { default as TabbarItem } from "./components/TabbarItem/TabbarItem";
+export { TabbarItem } from "./components/TabbarItem/TabbarItem";
 export type { TabbarItemProps } from "./components/TabbarItem/TabbarItem";
 export { HorizontalScroll } from "./components/HorizontalScroll/HorizontalScroll";
 export type { HorizontalScrollProps } from "./components/HorizontalScroll/HorizontalScroll";
-export { default as FixedLayout } from "./components/FixedLayout/FixedLayout";
+export { FixedLayout } from "./components/FixedLayout/FixedLayout";
 export type { FixedLayoutProps } from "./components/FixedLayout/FixedLayout";
 
 /**
@@ -50,7 +50,7 @@ export { ActionSheet } from "./components/ActionSheet/ActionSheet";
 export type { ActionSheetProps } from "./components/ActionSheet/ActionSheet";
 export { ActionSheetItem } from "./components/ActionSheetItem/ActionSheetItem";
 export type { ActionSheetItemProps } from "./components/ActionSheetItem/ActionSheetItem";
-export { default as ScreenSpinner } from "./components/ScreenSpinner/ScreenSpinner";
+export { ScreenSpinner } from "./components/ScreenSpinner/ScreenSpinner";
 export type { ScreenSpinnerProps } from "./components/ScreenSpinner/ScreenSpinner";
 export { Snackbar } from "./components/Snackbar/Snackbar";
 export type { SnackbarProps } from "./components/Snackbar/Snackbar";
@@ -61,14 +61,14 @@ export type { SnackbarProps } from "./components/Snackbar/Snackbar";
 export { ModalRoot } from "./components/ModalRoot/ModalRootAdaptive";
 export type { ModalRootProps } from "./components/ModalRoot/ModalRootAdaptive";
 export { withModalRootContext } from "./components/ModalRoot/withModalRootContext";
-export { default as ModalRootContext } from "./components/ModalRoot/ModalRootContext";
-export { default as ModalPage } from "./components/ModalPage/ModalPage";
+export { ModalRootContext } from "./components/ModalRoot/ModalRootContext";
+export { ModalPage } from "./components/ModalPage/ModalPage";
 export type { ModalPageProps } from "./components/ModalPage/ModalPage";
-export { default as ModalPageHeader } from "./components/ModalPageHeader/ModalPageHeader";
+export { ModalPageHeader } from "./components/ModalPageHeader/ModalPageHeader";
 export type { ModalPageHeaderProps } from "./components/ModalPageHeader/ModalPageHeader";
-export { default as ModalCard } from "./components/ModalCard/ModalCard";
+export { ModalCard } from "./components/ModalCard/ModalCard";
 export type { ModalCardProps } from "./components/ModalCard/ModalCard";
-export { default as ModalDismissButton } from "./components/ModalDismissButton/ModalDismissButton";
+export { ModalDismissButton } from "./components/ModalDismissButton/ModalDismissButton";
 export type { ModalDismissButtonProps } from "./components/ModalDismissButton/ModalDismissButton";
 
 /**
@@ -80,7 +80,7 @@ export { ButtonGroup } from "./components/ButtonGroup/ButtonGroup";
 export type { ButtonGroupProps } from "./components/ButtonGroup/ButtonGroup";
 export { Button } from "./components/Button/Button";
 export type { ButtonProps } from "./components/Button/Button";
-export { default as IconButton } from "./components/IconButton/IconButton";
+export { IconButton } from "./components/IconButton/IconButton";
 export type { IconButtonProps } from "./components/IconButton/IconButton";
 export { Card } from "./components/Card/Card";
 export type { CardProps } from "./components/Card/Card";
@@ -88,65 +88,65 @@ export { default as CardGrid } from "./components/CardGrid/CardGrid";
 export type { CardGridProps } from "./components/CardGrid/CardGrid";
 export { CardScroll } from "./components/CardScroll/CardScroll";
 export type { CardScrollProps } from "./components/CardScroll/CardScroll";
-export { default as ContentCard } from "./components/ContentCard/ContentCard";
+export { ContentCard } from "./components/ContentCard/ContentCard";
 export type { ContentCardProps } from "./components/ContentCard/ContentCard";
 export { CellButton } from "./components/CellButton/CellButton";
 export type { CellButtonProps } from "./components/CellButton/CellButton";
-export { default as Header } from "./components/Header/Header";
+export { Header } from "./components/Header/Header";
 export type { HeaderProps } from "./components/Header/Header";
-export { default as Group } from "./components/Group/Group";
+export { Group } from "./components/Group/Group";
 export type { GroupProps } from "./components/Group/Group";
 export { Gradient } from "./components/Gradient/Gradient";
 export type { GradientProps } from "./components/Gradient/Gradient";
-export { default as List } from "./components/List/List";
+export { List } from "./components/List/List";
 export { Cell } from "./components/Cell/Cell";
 export type { CellProps } from "./components/Cell/Cell";
-export { default as RichCell } from "./components/RichCell/RichCell";
+export { RichCell } from "./components/RichCell/RichCell";
 export type { RichCellProps } from "./components/RichCell/RichCell";
-export { default as SimpleCell } from "./components/SimpleCell/SimpleCell";
+export { SimpleCell } from "./components/SimpleCell/SimpleCell";
 export type { SimpleCellProps } from "./components/SimpleCell/SimpleCell";
 export { HorizontalCell } from "./components/HorizontalCell/HorizontalCell";
 export type { HorizontalCellProps } from "./components/HorizontalCell/HorizontalCell";
 export { Footer } from "./components/Footer/Footer";
 export type { FooterProps } from "./components/Footer/Footer";
-export { default as InfoRow } from "./components/InfoRow/InfoRow";
+export { InfoRow } from "./components/InfoRow/InfoRow";
 export type { InfoRowProps } from "./components/InfoRow/InfoRow";
-export { default as Gallery } from "./components/Gallery/Gallery";
+export { Gallery } from "./components/Gallery/Gallery";
 export type { GalleryProps } from "./components/Gallery/Gallery";
-export { default as Avatar } from "./components/Avatar/Avatar";
+export { Avatar } from "./components/Avatar/Avatar";
 export type { AvatarProps } from "./components/Avatar/Avatar";
 export { GridAvatar } from "./components/GridAvatar/GridAvatar";
 export type { GridAvatarProps } from "./components/GridAvatar/GridAvatar";
 export { InitialsAvatar } from "./components/InitialsAvatar/InitialsAvatar";
 export type { InitialsAvatarProps } from "./components/InitialsAvatar/InitialsAvatar";
-export { default as Progress } from "./components/Progress/Progress";
+export { Progress } from "./components/Progress/Progress";
 export type { ProgressProps } from "./components/Progress/Progress";
-export { default as Search } from "./components/Search/Search";
+export { Search } from "./components/Search/Search";
 export type { SearchProps } from "./components/Search/Search";
-export { default as Tabs } from "./components/Tabs/Tabs";
+export { Tabs } from "./components/Tabs/Tabs";
 export type { TabsProps } from "./components/Tabs/Tabs";
-export { default as TabsItem } from "./components/TabsItem/TabsItem";
+export { TabsItem } from "./components/TabsItem/TabsItem";
 export type { TabsItemProps } from "./components/TabsItem/TabsItem";
-export { default as Spinner } from "./components/Spinner/Spinner";
+export { Spinner } from "./components/Spinner/Spinner";
 export type { SpinnerProps } from "./components/Spinner/Spinner";
-export { default as PullToRefresh } from "./components/PullToRefresh/PullToRefresh";
+export { PullToRefresh } from "./components/PullToRefresh/PullToRefresh";
 export type { PullToRefreshProps } from "./components/PullToRefresh/PullToRefresh";
-export { default as Link } from "./components/Link/Link";
+export { Link } from "./components/Link/Link";
 export type { LinkProps } from "./components/Link/Link";
-export { default as Tooltip } from "./components/Tooltip/Tooltip";
+export { Tooltip } from "./components/Tooltip/Tooltip";
 export type { TooltipProps } from "./components/Tooltip/Tooltip";
 export { TooltipContainer } from "./components/Tooltip/TooltipContainer";
-export { default as Counter } from "./components/Counter/Counter";
+export { Counter } from "./components/Counter/Counter";
 export type { CounterProps } from "./components/Counter/Counter";
-export { default as UsersStack } from "./components/UsersStack/UsersStack";
+export { UsersStack } from "./components/UsersStack/UsersStack";
 export type { UsersStackProps } from "./components/UsersStack/UsersStack";
-export { default as Separator } from "./components/Separator/Separator";
+export { Separator } from "./components/Separator/Separator";
 export type { SeparatorProps } from "./components/Separator/Separator";
 export { Spacing } from "./components/Spacing/Spacing";
 export type { SpacingProps } from "./components/Spacing/Spacing";
-export { default as Placeholder } from "./components/Placeholder/Placeholder";
+export { Placeholder } from "./components/Placeholder/Placeholder";
 export type { PlaceholderProps } from "./components/Placeholder/Placeholder";
-export { default as Banner } from "./components/Banner/Banner";
+export { Banner } from "./components/Banner/Banner";
 export type { BannerProps } from "./components/Banner/Banner";
 export { MiniInfoCell } from "./components/MiniInfoCell/MiniInfoCell";
 export type { MiniInfoCellProps } from "./components/MiniInfoCell/MiniInfoCell";
@@ -164,19 +164,19 @@ export type { PaginationProps } from "./components/Pagination/Pagination";
 /**
  * Forms
  */
-export { default as FormLayout } from "./components/FormLayout/FormLayout";
+export { FormLayout } from "./components/FormLayout/FormLayout";
 export type { FormLayoutProps } from "./components/FormLayout/FormLayout";
 export { FormItem } from "./components/FormItem/FormItem";
 export type { FormItemProps } from "./components/FormItem/FormItem";
 export { FormField } from "./components/FormField/FormField";
 export type { FormFieldProps } from "./components/FormField/FormField";
-export { default as FormLayoutGroup } from "./components/FormLayoutGroup/FormLayoutGroup";
+export { FormLayoutGroup } from "./components/FormLayoutGroup/FormLayoutGroup";
 export type { FormLayoutGroupProps } from "./components/FormLayoutGroup/FormLayoutGroup";
 export { FormStatus } from "./components/FormStatus/FormStatus";
 export type { FormStatusProps } from "./components/FormStatus/FormStatus";
 export { Switch } from "./components/Switch/Switch";
 export type { SwitchProps } from "./components/Switch/Switch";
-export { default as File } from "./components/File/File";
+export { File } from "./components/File/File";
 export type { FileProps } from "./components/File/File";
 export { Input } from "./components/Input/Input";
 export type { InputProps } from "./components/Input/Input";
@@ -184,21 +184,21 @@ export { Chip } from "./components/Chip/Chip";
 export type { ChipProps } from "./components/Chip/Chip";
 export { ChipsInput } from "./components/ChipsInput/ChipsInput";
 export type { ChipsInputProps } from "./components/ChipsInput/ChipsInput";
-export { default as Slider } from "./components/Slider/Slider";
+export { Slider } from "./components/Slider/Slider";
 export type { SliderProps } from "./components/Slider/Slider";
-export { default as RangeSlider } from "./components/RangeSlider/RangeSlider";
+export { RangeSlider } from "./components/RangeSlider/RangeSlider";
 export type { RangeSliderProps } from "./components/RangeSlider/RangeSlider";
-export { default as Textarea } from "./components/Textarea/Textarea";
+export { Textarea } from "./components/Textarea/Textarea";
 export type { TextareaProps } from "./components/Textarea/Textarea";
-export { default as Radio } from "./components/Radio/Radio";
+export { Radio } from "./components/Radio/Radio";
 export type { RadioProps } from "./components/Radio/Radio";
 export { RadioGroup } from "./components/RadioGroup/RadioGroup";
 export type { RadioGroupProps } from "./components/RadioGroup/RadioGroup";
-export { default as Checkbox } from "./components/Checkbox/Checkbox";
+export { Checkbox } from "./components/Checkbox/Checkbox";
 export type { CheckboxProps } from "./components/Checkbox/Checkbox";
 export { Select } from "./components/Select/Select";
 export type { SelectProps } from "./components/Select/Select";
-export { default as SelectMimicry } from "./components/SelectMimicry/SelectMimicry";
+export { SelectMimicry } from "./components/SelectMimicry/SelectMimicry";
 export type { SelectMimicryProps } from "./components/SelectMimicry/SelectMimicry";
 export { NativeSelect } from "./components/NativeSelect/NativeSelect";
 export type { NativeSelectProps } from "./components/NativeSelect/NativeSelect";
@@ -209,7 +209,7 @@ export type {
 } from "./components/CustomSelect/CustomSelect";
 export { CustomSelectOption } from "./components/CustomSelectOption/CustomSelectOption";
 export type { CustomSelectOptionProps } from "./components/CustomSelectOption/CustomSelectOption";
-export { default as DatePicker } from "./components/DatePicker/DatePicker";
+export { DatePicker } from "./components/DatePicker/DatePicker";
 export type {
   DatePickerProps,
   DatePickerDateFormat,
@@ -239,17 +239,17 @@ export type { DateRangeInputProps } from "./components/DateRangeInput/DateRangeI
  */
 export { Div } from "./components/Div/Div";
 export type { DivProps } from "./components/Div/Div";
-export { default as Tappable } from "./components/Tappable/Tappable";
+export { Tappable } from "./components/Tappable/Tappable";
 export type { TappableProps } from "./components/Tappable/Tappable";
 export { Touch } from "./components/Touch/Touch";
 export type { TouchProps } from "./components/Touch/Touch";
-export { default as PanelSpinner } from "./components/PanelSpinner/PanelSpinner";
+export { PanelSpinner } from "./components/PanelSpinner/PanelSpinner";
 export type { PanelSpinnerProps } from "./components/PanelSpinner/PanelSpinner";
-export { default as PanelHeaderClose } from "./components/PanelHeaderClose/PanelHeaderClose";
-export { default as PanelHeaderBack } from "./components/PanelHeaderBack/PanelHeaderBack";
+export { PanelHeaderClose } from "./components/PanelHeaderClose/PanelHeaderClose";
+export { PanelHeaderBack } from "./components/PanelHeaderBack/PanelHeaderBack";
 export type { PanelHeaderBackProps } from "./components/PanelHeaderBack/PanelHeaderBack";
-export { default as PanelHeaderSubmit } from "./components/PanelHeaderSubmit/PanelHeaderSubmit";
-export { default as PanelHeaderEdit } from "./components/PanelHeaderEdit/PanelHeaderEdit";
+export { PanelHeaderSubmit } from "./components/PanelHeaderSubmit/PanelHeaderSubmit";
+export { PanelHeaderEdit } from "./components/PanelHeaderEdit/PanelHeaderEdit";
 export type { PanelHeaderEditProps } from "./components/PanelHeaderEdit/PanelHeaderEdit";
 export { ModalCardBase } from "./components/ModalCardBase/ModalCardBase";
 export type { ModalCardBaseProps } from "./components/ModalCardBase/ModalCardBase";
@@ -260,7 +260,7 @@ export type { ModalCardBaseProps } from "./components/ModalCardBase/ModalCardBas
 export { AppRoot } from "./components/AppRoot/AppRoot";
 export type { AppRootProps } from "./components/AppRoot/AppRoot";
 export { AdaptivityProvider } from "./components/AdaptivityProvider/AdaptivityProvider";
-export { default as ConfigProvider } from "./components/ConfigProvider/ConfigProvider";
+export { ConfigProvider } from "./components/ConfigProvider/ConfigProvider";
 export type { ConfigProviderProps } from "./components/ConfigProvider/ConfigProvider";
 export {
   ConfigProviderContext,
@@ -274,7 +274,7 @@ export { LocaleProviderContext } from "./components/LocaleProviderContext/Locale
 /**
  * Advertisement
  */
-export { default as PromoBanner } from "./components/PromoBanner/PromoBanner";
+export { PromoBanner } from "./components/PromoBanner/PromoBanner";
 export type { PromoBannerProps } from "./components/PromoBanner/PromoBanner";
 
 /**
@@ -282,16 +282,18 @@ export type { PromoBannerProps } from "./components/PromoBanner/PromoBanner";
  */
 export { Title } from "./components/Typography/Title/Title";
 export type { TitleProps } from "./components/Typography/Title/Title";
-export { default as Headline } from "./components/Typography/Headline/Headline";
+export { Headline } from "./components/Typography/Headline/Headline";
 export type { HeadlineProps } from "./components/Typography/Headline/Headline";
-export { default as Text } from "./components/Typography/Text/Text";
+export { Text } from "./components/Typography/Text/Text";
 export type { TextProps } from "./components/Typography/Text/Text";
-export { Caption } from "./components/Typography/Caption/Caption";
-export type { CaptionProps } from "./components/Typography/Caption/Caption";
-export { Subhead } from "./components/Typography/Subhead/Subhead";
-export type { SubheadProps } from "./components/Typography/Subhead/Subhead";
 export { Paragraph } from "./components/Typography/Paragraph/Paragraph";
 export type { ParagraphProps } from "./components/Typography/Paragraph/Paragraph";
+export { Subhead } from "./components/Typography/Subhead/Subhead";
+export type { SubheadProps } from "./components/Typography/Subhead/Subhead";
+export { Footnote } from "./components/Typography/Footnote/Footnote";
+export type { FootnoteProps } from "./components/Typography/Footnote/Footnote";
+export { Caption } from "./components/Typography/Caption/Caption";
+export type { CaptionProps } from "./components/Typography/Caption/Caption";
 
 /**
  * HOCs
@@ -308,12 +310,14 @@ export { usePlatform } from "./hooks/usePlatform";
 export { useAdaptivity } from "./hooks/useAdaptivity";
 export { useAppearance } from "./hooks/useAppearance";
 export { usePagination } from "./hooks/usePagination";
+export { useScrollLock } from "./components/AppRoot/ScrollContext";
+export { useNavTransition } from "./components/NavTransitionContext/NavTransitionContext";
 
 /**
  * Utils
  */
 export { classNamesString as classNames } from "./lib/classNames";
-export { default as animate } from "./lib/animate";
+export { animate } from "./lib/animate";
 export { removeObjectKeys } from "./lib/removeObjectKeys";
 export { SSRWrapper } from "./lib/SSR";
 export type { SSRWrapperProps } from "./lib/SSR";
@@ -343,3 +347,4 @@ export type { AlignType, HasPlatform, HasInsets } from "./types";
 export type { NavIdProps } from "./lib/getNavId";
 export type { PlatformType } from "./lib/platform";
 export type { AdaptivityProps } from "./hoc/withAdaptivity";
+export type { TransitionContextProps } from "./components/NavTransitionContext/NavTransitionContext";

package/src/lib/SSR.tsx

@@ -20,6 +20,9 @@ export interface SSRWrapperProps {
   browserInfo?: BrowserInfo;
 }
 
+/**
+ * @see https://vkcom.github.io/VKUI/#/SSR
+ */
 export const SSRWrapper: React.FC<SSRWrapperProps> = (props) => {
   let { userAgent, browserInfo, children } = props;
 

package/src/lib/animate.ts

@@ -17,8 +17,7 @@ export interface AnimateArgumentsInterface {
   draw: DrawInterface;
 }
 
-// eslint-disable-next-line import/no-default-export
-export default function animate({
+export function animate({
   duration,
   timing,
   draw,

package/src/lib/select.ts

@@ -1,10 +1,13 @@
+import * as React from "react";
+import { getTitleFromChildren } from "./utils";
+import { FormFieldMode } from "../components/FormField/FormField";
+import { SelectType } from "../components/Select/Select";
+
 type Option = {
-  label?: string;
+  label?: React.ReactElement | string;
   [index: string]: any;
 };
 
-type GetOptionLabel = (option: Option) => string | undefined;
-
 const findAllIncludes = (target = "", search = "") => {
   const includes = [];
 
@@ -24,10 +27,15 @@ try {
   letterRegexp = new RegExp("\\p{L}", "u");
 } catch (e) {}
 
+type GetOptionLabel = (option: Option) => string | undefined;
+
+const _getOptionLabel: GetOptionLabel = (option) =>
+  getTitleFromChildren(option.label);
+
 export const defaultFilterFn = (
   query = "",
   option: Option,
-  getOptionLabel: GetOptionLabel = (option) => option.label
+  getOptionLabel: GetOptionLabel = _getOptionLabel
 ) => {
   query = query.toLocaleLowerCase();
   let label = getOptionLabel(option)?.toLocaleLowerCase();
@@ -52,3 +60,11 @@ export const defaultFilterFn = (
 
   return false;
 };
+
+export const getFormFieldModeFromSelectType = (
+  selectType: keyof typeof SelectType = SelectType.default
+) => {
+  return selectType === SelectType.default
+    ? FormFieldMode.default
+    : FormFieldMode.plain;
+};

package/src/styles/components.css

@@ -10,10 +10,11 @@
 /* Typography */
 @import "../components/Typography/Title/Title.css";
 @import "../components/Typography/Headline/Headline.css";
-@import "../components/Typography/Subhead/Subhead.css";
-@import "../components/Typography/Caption/Caption.css";
 @import "../components/Typography/Text/Text.css";
 @import "../components/Typography/Paragraph/Paragraph.css";
+@import "../components/Typography/Subhead/Subhead.css";
+@import "../components/Typography/Footnote/Footnote.css";
+@import "../components/Typography/Caption/Caption.css";
 
 /* Service */
 @import "../components/Tappable/Tappable.css";
@@ -86,7 +87,7 @@
 @import "../components/Avatar/Avatar.css";
 @import "../components/InitialsAvatar/InitialsAvatar.css";
 @import "../components/GridAvatar/GridAvatar.css";
-@import "../components/Gallery/Gallery.css";
+@import "../components/BaseGallery/BaseGallery.css";
 @import "../components/Progress/Progress.css";
 @import "../components/Search/Search.css";
 @import "../components/Tabs/Tabs.css";
@@ -121,10 +122,8 @@
 @import "../components/Chip/Chip.css";
 @import "../components/Select/Select.css";
 @import "../components/Textarea/Textarea.css";
-@import "../components/File/File.css";
 @import "../components/CustomScrollView/CustomScrollView.css";
 @import "../components/CustomSelect/CustomSelect.css";
-@import "../components/SelectMimicry/SelectMimicry.css";
 @import "../components/CustomSelectOption/CustomSelectOption.css";
 @import "../components/DatePicker/DatePicker.css";
 @import "../components/SliderSwitch/SliderSwitch.css";

package/src/styles/constants.css

@@ -23,15 +23,14 @@
 
   /* sizes */
   --tabbar_height: 48px;
+  --panelheader_height: 56px;
   --panelheader_height_ios: 52px;
-  --panelheader_height_android: 56px;
   --panelheader_height_vkcom: 48px;
-  --modalheader_height_ios: 52px;
-  --modalheader_height_android: 56px;
   --search_default_height: 36px;
   --thin-border: 1px;
 
   /* paddings */
+  /* TODO: v5 удалить */
   --formitem_padding: 16px;
 
   /* colors */

package/src/styles/themes.css

@@ -3,6 +3,7 @@
 @import "./vkcom_light.css";
 @import "./vkcom_dark.css";
 @import "../../node_modules/@vkontakte/vkui-tokens/themes/vkBase/cssVars/declarations/onlyVariables.css";
+@import "../../node_modules/@vkontakte/vkui-tokens/themes/vkBase/cssVars/declarations/onlyVariablesLocal.css";
 @import "../../node_modules/@vkontakte/vkui-tokens/themes/vkBaseDark/cssVars/declarations/onlyVariablesLocal.css";
 @import "../../node_modules/@vkontakte/vkui-tokens/themes/vkIOS/cssVars/declarations/onlyVariablesLocal.css";
 @import "../../node_modules/@vkontakte/vkui-tokens/themes/vkIOSDark/cssVars/declarations/onlyVariablesLocal.css";

package/src/testing/utils.tsx

@@ -142,12 +142,19 @@ export const mockScrollContext = (
 ): [React.FC, jest.Mock] => {
   const getScroll = () => ({ x: 0, y: getY() });
   const scrollTo = jest.fn();
+  const isScrollLock = false;
   const enableScrollLock = jest.fn();
   const disableScrollLock = jest.fn();
   return [
     (props) => (
       <ScrollContext.Provider
-        value={{ getScroll, scrollTo, enableScrollLock, disableScrollLock }}
+        value={{
+          getScroll,
+          scrollTo,
+          isScrollLock,
+          enableScrollLock,
+          disableScrollLock,
+        }}
       >
         {props.children}
       </ScrollContext.Provider>