VKUI

Epic, Tabbar и TabbarItem

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

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

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

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

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

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

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

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

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

• Поправлен баг с прозрачной полоской под <Tabs /> в <FixedLayout vertical="bottom" />. fixes #120
• Поправлен баг с двойным отступом снизу у <FixedLayout /> на iOS 11+.
• <Cell />: теперь при removable={true}, обработчик onClick не будет вызываться при клике на ячейку. fixes #125

• Уменьшен activeEffectDelay для <PanelHeaderContent /> и <HeaderButton />.
• Небольшой css-рефакторинг для <Search />.
• Поправлены вертикальные отступы у элементов <Cell />.

FormLayout

У .FormLayout__row тег сменился с label на div.

Cell

• Поправлены стили для .Cell__remove (iOS). Теперь текст центрируется по вертикали вне зависимости от высоты ячейки.
• В onRemove теперь есть доступ к событию и корневому DOM-элементу ячейки.

• Поправлен placeholder в <Seach theme="default" /> для Android.
• Упрощен компонент <Input />. Теперь он stateless.

Багфикс

• Переделки в Search для VK Apps. Добавлен дизайн для Android для расположения поиска в теле Panel.
• Переделки в PanelHeader для VK Apps. Теперь в шапку нельзя добавить right. Так же поправлены стили для того, чтобы содержимое шапки не залезало под системные кнопки. Функционал реализован таким образом, что разработчикам ничего делать не надо. Только обновиться :)
• Мелкие правки документации и рефакторинг.

Slider: фикс для отображения внутри popout.

• Фиксы багов в Firefox.
• Tooltip – новый компонент для подсказок.

• Cell: фикс бага с вертикальным выравниванием before при size="l".
• PopoutWrapper теперь доступен разработчикам для создания своих всплывающих окон.
• Добавлен font-family для body, html и #root.

Entity

Компонент устарел. Он во многом повторял поведение ListItem, но с более корявым API. Пока он доступен, но в следующей мажорной версии будет удален.

ListItem

• Переименован в Cell. Семантически это название лучше описывает предназначение компонента. Старое название так же доступно для импорта. Возможность импортировать ListItem пропадет в следующей мажорной версии, останется только Cell.
• Добавлены новые свойства: bottomContent и size. Они нужны для отрисовки Entity силами Cell. Чем меньше компонентов – тем проще :)

Обновленная документация

Инфраструктура и документация

• Добавлена ссылка на репозиторий и на документацию в package.json.
• Теперь можно переключать платформу прямо на странице компонента. Пример.
• Обновлена документация некоторых компонентов. Добавлено описание новых кейсов.
• Добавлен раздел Intro.
• Добавлены ссылки на исходники, чат и npm.

Поправлены баги в связке <HorizontalScroll /> и <Tabs />. Поменялся порядок вложенности этих компонентов.

Было:

<HorizontalScroll>
  <Tabs>
    <TabsItem />
  </Tabs>
</HorizontalScroll>

Стало:

<Tabs>
  <HorizontalScroll>
    <TabsItem />
  </HorizontalScroll>
</Tabs>

Tabs

• Свойство theme теперь по-умолчанию имеет значение light.
• Поддержаны все типы и темы <Tabs /> для Android.

Документация

Гайд по миграции с 1.x.x на 2.x.x убран из документации. Найти его можно тут.

• FormLayout: поддержка ListItem
• Button: увеличен z-index при тапе
• Link: добавлена документация

• PanelHeader & View: убраны лишние правила в стилях.
• Panel: починен блок, отвечающий за нижний отступ у содержимого панели.