@vkontakte/vkui 4.36.0 → 4.36.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vkontakte/vkui",
-  "version": "4.36.0",
+  "version": "4.36.1",
   "main": "dist/cjs/index.js",
   "module": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/FormStatus/Readme.md

@@ -1,3 +1,7 @@
+> **Deprecated:** этот компонент устарел и будет удален в 5.0.0.
+>
+> Используйте [`Banner`](https://vkcom.github.io/VKUI/#/Banner).
+
 Компонент используется для отображения статуса формы. Например, когда в форме допущена ошибка, и нет возможности
 указать на конкретное поле. Заголовок и текст опциональны.
 

package/src/components/Link/Link.css

@@ -1,5 +1,5 @@
 .Link {
-  color: var(--accent, var(--vkui--color_text_link));
+  color: var(--text_link, var(--vkui--color_text_link));
   text-decoration: none;
   border: 0;
   background: none;
@@ -31,6 +31,7 @@
   color: var(--vkui--color_text_link_visited);
 }
 
+/* stylelint-disable-next-line vkui/atomic */
 .Link .Icon {
   margin-left: 4px;
   display: inline-block;

package/src/components/View/Readme.md

@@ -44,12 +44,12 @@ const [activePanel, setActivePanel] = useState("panel1");
 ### <a id="/View?id=iosswipeback"></a>[iOS Swipe Back](https://vkcom.github.io/VKUI/#/View?id=iosswipeback)
 
 В iOS есть возможность свайпнуть от левого края назад, чтобы перейти на предыдущую панель. Для того, чтобы
-повторить такое поведение в VKUI нужно:
+повторить такое поведение в VKUI, нужно:
 
 - Передать во `View` коллбек `onSwipeBack` — он сработает при завершении анимации свайпа. Поменяйте в нем `activePanel` и обновите `history`.
 - Передать во `View` проп `history` — массив из id панелей в порядке открытия. Например, если пользователь из `main` перешел в `profile`, а оттуда попал в `education`, то `history=['main', 'profile', 'education']`.
 - Обернуть ваше приложение в `ConfigProvider` — он определит, открыто приложение в webview клиента VK или в браузере (там есть свой swipe back, который будет конфликтовать с нашим). Для проверки в браузере форсируйте определение webview: `<ConfigProvider isWebView>`.
-- На первой панели должен включаться свайпбек нативного клиента, чтобы пользователь смог выйти из приложения — для этого используют `vk-bridge`. **Если вы не из ВК,** при переходах отправляйте [событие `VKWebAppSetSwipeSettings`](https://dev.vk.com/bridge/VKWebAppSetSwipeSettings) с `history: true` на первой панели или `history: false` на других. **Если вы из ВК,** при переходе на первую панель отправляйте событие `VKWebAppEnableSwipeBack`, на любую другую — `VKWebAppDisableSwipeBack`.
+- На первой панели должен включаться свайпбек нативного клиента, чтобы пользователь смог выйти из приложения — для этого используют `vk-bridge`. **Если вы делаете стандартное мини-приложение ВКонтакте,** при переходах отправляйте [событие `VKWebAppSetSwipeSettings`](https://dev.vk.com/bridge/VKWebAppSetSwipeSettings) с `history: true` на первой панели или `history: false` на других. **Если тип вашего мини-приложения — `WebviewType.INTERNAL`,** отправляйте событие `VKWebAppEnableSwipeBack` при переходе на первую панель и событие `VKWebAppDisableSwipeBack` при переходе на любую другух.
 - Компоненты, которые сами обрабатывают жесты (например, карта), могут конфликтовать со свайпбеком — повесьте на них свойство `data-vkui-swipe-back={false}`
 
 ```jsx
@@ -60,12 +60,12 @@ const activePanel = history[history.length - 1];
 const isFirst = history.length === 1;
 
 React.useEffect(() => {
-  // Если вы из ВК, делайте так
+  // В стандартных мини-приложениях делайте так:
+  vkBridge.send("VKWebAppSetSwipeSettings", { history: isFirst });
+  // В мини-приложениях `WebviewType.INTERNAL` делайте так:
   vkBridge.send(
     isFirst ? "VKWebAppEnableSwipeBack" : "VKWebAppDisableSwipeBack"
   );
-  // Если вы не из ВК, то так:
-  vkBridge.send("VKWebAppSetSwipeSettings", { history: isFirst });
 }, [isFirst]);
 
 const goBack = () => setHistory(history.slice(0, -1));

package/src/components/View/View.tsx

@@ -167,9 +167,6 @@ export const View = ({
   const prevSwipeBackPrevPanel = usePrevious(swipeBackPrevPanel);
   const prevOnTransition = usePrevious(onTransition);
 
-  const hasPopout = !!popout;
-  const hasModal = !!modal;
-
   const panels = (
     React.Children.toArray(children) as React.ReactElement[]
   ).filter((panel: React.ReactElement) => {
@@ -402,10 +399,6 @@ export const View = ({
     popout && blurActiveElement(document);
   }, [document, popout]);
 
-  React.useEffect(() => {
-    modal && blurActiveElement(document);
-  }, [document, modal]);
-
   React.useEffect(() => {
     // Нужен переход
     if (
@@ -606,8 +599,8 @@ export const View = ({
         })}
       </div>
       <AppRootPortal>
-        {hasPopout && <div vkuiClass="View__popout">{popout}</div>}
-        {hasModal && <div vkuiClass="View__modal">{modal}</div>}
+        {!!popout && <div vkuiClass="View__popout">{popout}</div>}
+        {!!modal && <div vkuiClass="View__modal">{modal}</div>}
       </AppRootPortal>
     </Touch>
   );