Новый подход к работе с цветами

Все цвета, используемые в библиотеке, занесены в css-custom-properties.
Чтобы использовать цвета в своем CSS коде, достаточно посмотреть на список доступных цветов и применить их, используя синтаксис css-custom-properties:

.MyBlock {
  background: var(--background_content);
  color: var(--text-primary)
}

Доступные цвета находятся в тут

v2.13.0

В Cell появился режим draggable – перетаскивание ячеек. За подробностями сюда.

v2.12.5

• Во View и Root добавлена информация о переходе при вызове onTransition({ to, from, isBack }).
• Поменялся способ определения окружения (webview или браузер). Теперь для этих целей используется @vkontakte/vkui-connect.

v2.12.4

v2.12.4

v2.12.3

• Spinner – возможность использования внутри HeaderButton #134.
• Линтеры и .browserslist удалены из .npmignore.
• Лоадеры перемещены из devDependencies в dependencies.

v2.12.2

• Spinner добавлен в документацию.
• Пофикшена стилизация <TabsItem theme="header"/> на iOS #131.
• В HeaderButton теперь можно добавлять href, делая из кнопки ссылку #132.
• Небольшие дизайнерские улучшения в List, Cell и Group.

v2.12.1

• Из CSS убраны vh, теперь везде используются проценты. Это фиксит проблему лишнего скролла в браузерах.
• В TabbarItem теперь можно класть иконки любых размеров. Но все еще крайне рекомендуется по-возможности использовать 28 размер.
• Фиксы бордеров и заливок в Tabs.

v2.12.0: прокачиваем навигацию

Epic, Tabbar и TabbarItem

<Epic /> – это новый слой навигации. Чтобы понять, что он себя представляет, достаточно открыть VK на iOS или на Android. Внизу располагается панель с иконками, с помощью которой пользователь может переключаться между ключевыми разделами.

<Epic /> неразрывно связан с новыми компонентами для отрисовки нижнего меню – <Tabbar /> и <TabbarItem />. Более подробно концепция описана тут.

Фиксы и улучшения

• Изменена подсветка тапа у <HeaderButton /> в Android версии.
• Пофикшен баг с заливкой фона в <Panel />.
• Изменена стилизация <Tabs />, расположенных в <FixedLayout vertical="bottom"/>
• <ConfigProvider />: пофикшен баг с неверным нижним инсетом при скрытии клавиатуры.

v2.11.0: поддержка тем

Поддержка тем

Эпичный темной темы. Все подробности тут. Изменения обратно совместимы. По-умолчанию используется текущая светлая тема.

Разъехались кнопки-ячейки и обычные кнопки

Обычные кнопки – это по-прежнему <Button />. Кнопки-ячейки (<Button type="cell" />) переехали в отдельный компонент <CellButton />. Изменения обратно совместимы, свойство type все еще поддерживается, но помечено устаревшим.

v2.10.0

• <FormLayoutGroup /> – новый компонент для группировки полей в <FormLayout />.
• Фиксы выравнивания элементов в <PanelHeader />.
• Фиксы позиционирования элементов внутри <FormLayout />.
• Разрешено выделение текста в <InfoRow />, <Header /> и <Div />.