@vkontakte/vkui 4.37.4 → 4.38.0

package/dist/cssm/components/Tabs/Tabs.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["children", "mode", "getRootRef", "sizeX"];
+var _excluded = ["children", "mode", "getRootRef", "sizeX", "role"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from "react";
 import { classNames } from "../../lib/classNames";
@@ -8,6 +8,9 @@ import { usePlatform } from "../../hooks/usePlatform";
 import { IOS, VKCOM } from "../../lib/platform";
 import { withAdaptivity } from "../../hoc/withAdaptivity";
 import { warnOnce } from "../../lib/warnOnce";
+import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
+import { useDOM } from "../../lib/dom";
+import { pressedKey } from "../../lib/accessibility";
 import "./Tabs.css";
 var warn = warnOnce("Tabs");
 export var TabsModeContext = /*#__PURE__*/React.createContext({
@@ -21,10 +24,18 @@ var TabsComponent = function TabsComponent(_ref) {
       mode = _ref$mode === void 0 ? "default" : _ref$mode,
       getRootRef = _ref.getRootRef,
       sizeX = _ref.sizeX,
+      _ref$role = _ref.role,
+      role = _ref$role === void 0 ? "tablist" : _ref$role,
       restProps = _objectWithoutProperties(_ref, _excluded);
 
   var platform = usePlatform();
 
+  var _useDOM = useDOM(),
+      document = _useDOM.document;
+
+  var isTabFlow = role === "tablist";
+  var tabsRef = React.useRef(null);
+
   if ((mode === "buttons" || mode === "segmented") && process.env.NODE_ENV === "development") {
     var expectedValueText = mode === "buttons" ? "\u0437\u043D\u0430\u0447\u0435\u043D\u0438\u044F \"secondary\"" : "компонент SegmentedControl";
     warn("mode=\"".concat(mode, "\" \u0443\u0441\u0442\u0430\u0440\u0435\u043B\u043E \u0438 \u0431\u0443\u0434\u0435\u0442 \u0443\u0434\u0430\u043B\u0435\u043D\u043E \u0432 5.0.0. \u0418\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0439\u0442\u0435 ").concat(expectedValueText));
@@ -39,12 +50,122 @@ var TabsComponent = function TabsComponent(_ref) {
   }
 
   var withGaps = mode === "accent" || mode === "secondary";
+
+  var getTabEls = function getTabEls() {
+    if (!tabsRef.current) {
+      return [];
+    }
+
+    return Array.from( // eslint-disable-next-line no-restricted-properties
+    tabsRef.current.querySelectorAll("[role=tab]:not([disabled])"));
+  };
+
+  var handleDocumentKeydown = function handleDocumentKeydown(event) {
+    if (!document || !tabsRef.current || !isTabFlow) {
+      return;
+    }
+
+    var key = pressedKey(event);
+
+    switch (key) {
+      case "ArrowLeft":
+      case "ArrowRight":
+      case "End":
+      case "Home":
+        {
+          var tabEls = getTabEls();
+          var currentFocusedElIndex = tabEls.findIndex(function (el) {
+            return document.activeElement === el;
+          });
+
+          if (currentFocusedElIndex === -1) {
+            return;
+          }
+
+          var nextIndex = 0;
+
+          if (key === "Home") {
+            nextIndex = 0;
+          } else if (key === "End") {
+            nextIndex = tabEls.length - 1;
+          } else {
+            var offset = key === "ArrowRight" ? 1 : -1;
+            nextIndex = currentFocusedElIndex + offset;
+          }
+
+          var nextTabEl = tabEls[nextIndex];
+
+          if (nextTabEl) {
+            event.preventDefault();
+            nextTabEl.focus();
+          }
+
+          break;
+        }
+
+      /*
+       В JAWS и NVDA стрелка вниз активирует контент.
+       Это не прописано в стандартах, но по ссылке ниже это рекомендуется делать.
+       https://inclusive-components.design/tabbed-interfaces/
+      */
+
+      case "ArrowDown":
+        {
+          var _tabEls = getTabEls();
+
+          var currentFocusedEl = _tabEls.find(function (el) {
+            return document.activeElement === el;
+          });
+
+          if (!currentFocusedEl || currentFocusedEl.getAttribute("aria-selected") !== "true") {
+            return;
+          }
+
+          var relatedContentElId = currentFocusedEl.getAttribute("aria-controls");
+
+          if (!relatedContentElId) {
+            return;
+          } // eslint-disable-next-line no-restricted-properties
+
+
+          var relatedContentEl = document.getElementById(relatedContentElId);
+
+          if (!relatedContentEl) {
+            return;
+          }
+
+          event.preventDefault();
+          relatedContentEl.focus();
+          break;
+        }
+
+      case "Space":
+      case "Enter":
+        {
+          var _tabEls2 = getTabEls();
+
+          var _currentFocusedEl = _tabEls2.find(function (el) {
+            return document.activeElement === el;
+          });
+
+          if (_currentFocusedEl) {
+            _currentFocusedEl.click();
+          }
+        }
+    }
+  };
+
+  useGlobalEventListener(document, "keydown", handleDocumentKeydown, {
+    capture: true
+  });
   return createScopedElement("div", _extends({}, restProps, {
     ref: getRootRef,
     vkuiClass: classNames("Tabs", (platform === IOS || platform === VKCOM) && "Tabs--".concat(platform), "Tabs--".concat(mode), withGaps && "Tabs--withGaps", // TODO v5.0.0 новая адаптивность
-    "Tabs--sizeX-".concat(sizeX))
+    "Tabs--sizeX-".concat(sizeX)),
+    role: role
   }), createScopedElement("div", {
-    vkuiClass: "Tabs__in"
+    vkuiClass: "Tabs__in",
+    ref: tabsRef
   }, createScopedElement(TabsModeContext.Provider, {
     value: {
       mode: mode,

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

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","names":["React","classNames","usePlatform","IOS","VKCOM","withAdaptivity","warnOnce","warn","TabsModeContext","createContext","mode","withGaps","TabsComponent","children","getRootRef","sizeX","restProps","platform","process","env","NODE_ENV","expectedValueText","Tabs","displayName"],"sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasRootRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { IOS, VKCOM } from \"../../lib/platform\";\nimport { withAdaptivity, AdaptivityProps } from \"../../hoc/withAdaptivity\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport \"./Tabs.css\";\n\nexport interface TabsProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    AdaptivityProps {\n  /**\n   * Задаёт вид кнопок.\n   *\n   * > ⚠️ Значения `\"buttons\"`, `\"segmented\"` устарели и будут удалены в 5.0.0. Вместо `\"buttons\"` используйте `\"secondary\"`.\n   * > Режим `\"segmented\"` переехал в отдельный компонент [`SegmentedControl`](https://vkcom.github.io/VKUI#/SegmentedControl),\n   * > поэтому используйте его вместо `Tabs`.\n   */\n  mode?: \"buttons\" | \"segmented\" | \"default\" | \"accent\" | \"secondary\";\n}\n\nconst warn = warnOnce(\"Tabs\");\n\nexport interface TabsContextProps {\n  mode: TabsProps[\"mode\"];\n  withGaps: boolean;\n}\n\nexport const TabsModeContext = React.createContext<TabsContextProps>({\n  mode: \"default\",\n  withGaps: false,\n});\n\nconst TabsComponent = ({\n  children,\n  mode = \"default\",\n  getRootRef,\n  sizeX,\n  ...restProps\n}: TabsProps) => {\n  const platform = usePlatform();\n\n  if (\n    (mode === \"buttons\" || mode === \"segmented\") &&\n    process.env.NODE_ENV === \"development\"\n  ) {\n    const expectedValueText =\n      mode === \"buttons\"\n        ? `значения \"secondary\"`\n        : \"компонент SegmentedControl\";\n    warn(\n      `mode=\"${mode}\" устарело и будет удалено в 5.0.0. Используйте ${expectedValueText}`\n    );\n  }\n\n  if (platform !== IOS && mode === \"segmented\") {\n    mode = \"default\";\n  }\n\n  if (mode === \"buttons\") {\n    mode = \"secondary\";\n  }\n\n  const withGaps = mode === \"accent\" || mode === \"secondary\";\n\n  return (\n    <div\n      {...restProps}\n      ref={getRootRef}\n      vkuiClass={classNames(\n        \"Tabs\",\n        (platform === IOS || platform === VKCOM) && `Tabs--${platform}`,\n        `Tabs--${mode}`,\n        withGaps && \"Tabs--withGaps\",\n        // TODO v5.0.0 новая адаптивность\n        `Tabs--sizeX-${sizeX}`\n      )}\n    >\n      <div vkuiClass=\"Tabs__in\">\n        <TabsModeContext.Provider value={{ mode, withGaps }}>\n          {children}\n        </TabsModeContext.Provider>\n      </div>\n    </div>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Tabs\n */\nexport const Tabs = withAdaptivity(TabsComponent, { sizeX: true });\n\nTabs.displayName = \"Tabs\";\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AAEA,SAASC,WAAT;AACA,SAASC,GAAT,EAAcC,KAAd;AACA,SAASC,cAAT;AACA,SAASC,QAAT;AACA;AAgBA,IAAMC,IAAI,GAAGD,QAAQ,CAAC,MAAD,CAArB;AAOA,OAAO,IAAME,eAAe,gBAAGR,KAAK,CAACS,aAAN,CAAsC;EACnEC,IAAI,EAAE,SAD6D;EAEnEC,QAAQ,EAAE;AAFyD,CAAtC,CAAxB;;AAKP,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,OAML;EAAA,IALfC,QAKe,QALfA,QAKe;EAAA,qBAJfH,IAIe;EAAA,IAJfA,IAIe,0BAJR,SAIQ;EAAA,IAHfI,UAGe,QAHfA,UAGe;EAAA,IAFfC,KAEe,QAFfA,KAEe;EAAA,IADZC,SACY;;EACf,IAAMC,QAAQ,GAAGf,WAAW,EAA5B;;EAEA,IACE,CAACQ,IAAI,KAAK,SAAT,IAAsBA,IAAI,KAAK,WAAhC,KACAQ,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAF3B,EAGE;IACA,IAAMC,iBAAiB,GACrBX,IAAI,KAAK,SAAT,sEAEI,4BAHN;IAIAH,IAAI,kBACOG,IADP,mOAC8DW,iBAD9D,EAAJ;EAGD;;EAED,IAAIJ,QAAQ,KAAKd,GAAb,IAAoBO,IAAI,KAAK,WAAjC,EAA8C;IAC5CA,IAAI,GAAG,SAAP;EACD;;EAED,IAAIA,IAAI,KAAK,SAAb,EAAwB;IACtBA,IAAI,GAAG,WAAP;EACD;;EAED,IAAMC,QAAQ,GAAGD,IAAI,KAAK,QAAT,IAAqBA,IAAI,KAAK,WAA/C;EAEA,OACE,wCACMM,SADN;IAEE,GAAG,EAAEF,UAFP;IAGE,SAAS,EAAEb,UAAU,CACnB,MADmB,EAEnB,CAACgB,QAAQ,KAAKd,GAAb,IAAoBc,QAAQ,KAAKb,KAAlC,qBAAqDa,QAArD,CAFmB,kBAGVP,IAHU,GAInBC,QAAQ,IAAI,gBAJO,EAKnB;IALmB,sBAMJI,KANI;EAHvB,IAYE;IAAK,SAAS,EAAC;EAAf,GACE,oBAAC,eAAD,CAAiB,QAAjB;IAA0B,KAAK,EAAE;MAAEL,IAAI,EAAJA,IAAF;MAAQC,QAAQ,EAARA;IAAR;EAAjC,GACGE,QADH,CADF,CAZF,CADF;AAoBD,CApDD;AAsDA;AACA;AACA;;;AACA,OAAO,IAAMS,IAAI,GAAGjB,cAAc,CAACO,aAAD,EAAgB;EAAEG,KAAK,EAAE;AAAT,CAAhB,CAA3B;AAEPO,IAAI,CAACC,WAAL,GAAmB,MAAnB"}
+{"version":3,"file":"Tabs.js","names":["React","classNames","usePlatform","IOS","VKCOM","withAdaptivity","warnOnce","useGlobalEventListener","useDOM","pressedKey","warn","TabsModeContext","createContext","mode","withGaps","TabsComponent","children","getRootRef","sizeX","role","restProps","platform","document","isTabFlow","tabsRef","useRef","process","env","NODE_ENV","expectedValueText","getTabEls","current","Array","from","querySelectorAll","handleDocumentKeydown","event","key","tabEls","currentFocusedElIndex","findIndex","el","activeElement","nextIndex","length","offset","nextTabEl","preventDefault","focus","currentFocusedEl","find","getAttribute","relatedContentElId","relatedContentEl","getElementById","click","capture","Tabs","displayName"],"sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasRootRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { IOS, VKCOM } from \"../../lib/platform\";\nimport { withAdaptivity, AdaptivityProps } from \"../../hoc/withAdaptivity\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { useDOM } from \"../../lib/dom\";\nimport { pressedKey } from \"../../lib/accessibility\";\nimport \"./Tabs.css\";\n\nexport interface TabsProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    AdaptivityProps {\n  /**\n   * Задаёт вид кнопок.\n   *\n   * > ⚠️ Значения `\"buttons\"`, `\"segmented\"` устарели и будут удалены в 5.0.0. Вместо `\"buttons\"` используйте `\"secondary\"`.\n   * > Режим `\"segmented\"` переехал в отдельный компонент [`SegmentedControl`](https://vkcom.github.io/VKUI#/SegmentedControl),\n   * > поэтому используйте его вместо `Tabs`.\n   */\n  mode?: \"buttons\" | \"segmented\" | \"default\" | \"accent\" | \"secondary\";\n}\n\nconst warn = warnOnce(\"Tabs\");\n\nexport interface TabsContextProps {\n  mode: TabsProps[\"mode\"];\n  withGaps: boolean;\n}\n\nexport const TabsModeContext = React.createContext<TabsContextProps>({\n  mode: \"default\",\n  withGaps: false,\n});\n\nconst TabsComponent = ({\n  children,\n  mode = \"default\",\n  getRootRef,\n  sizeX,\n  role = \"tablist\",\n  ...restProps\n}: TabsProps) => {\n  const platform = usePlatform();\n  const { document } = useDOM();\n\n  const isTabFlow = role === \"tablist\";\n\n  const tabsRef = React.useRef<HTMLDivElement>(null);\n\n  if (\n    (mode === \"buttons\" || mode === \"segmented\") &&\n    process.env.NODE_ENV === \"development\"\n  ) {\n    const expectedValueText =\n      mode === \"buttons\"\n        ? `значения \"secondary\"`\n        : \"компонент SegmentedControl\";\n    warn(\n      `mode=\"${mode}\" устарело и будет удалено в 5.0.0. Используйте ${expectedValueText}`\n    );\n  }\n\n  if (platform !== IOS && mode === \"segmented\") {\n    mode = \"default\";\n  }\n\n  if (mode === \"buttons\") {\n    mode = \"secondary\";\n  }\n\n  const withGaps = mode === \"accent\" || mode === \"secondary\";\n\n  const getTabEls = () => {\n    if (!tabsRef.current) {\n      return [];\n    }\n\n    return Array.from(\n      // eslint-disable-next-line no-restricted-properties\n      tabsRef.current.querySelectorAll<HTMLDivElement>(\n        \"[role=tab]:not([disabled])\"\n      )\n    );\n  };\n\n  const handleDocumentKeydown = (event: KeyboardEvent) => {\n    if (!document || !tabsRef.current || !isTabFlow) {\n      return;\n    }\n\n    const key = pressedKey(event);\n\n    switch (key) {\n      case \"ArrowLeft\":\n      case \"ArrowRight\":\n      case \"End\":\n      case \"Home\": {\n        const tabEls = getTabEls();\n        const currentFocusedElIndex = tabEls.findIndex(\n          (el) => document.activeElement === el\n        );\n        if (currentFocusedElIndex === -1) {\n          return;\n        }\n\n        let nextIndex = 0;\n        if (key === \"Home\") {\n          nextIndex = 0;\n        } else if (key === \"End\") {\n          nextIndex = tabEls.length - 1;\n        } else {\n          const offset = key === \"ArrowRight\" ? 1 : -1;\n          nextIndex = currentFocusedElIndex + offset;\n        }\n\n        const nextTabEl = tabEls[nextIndex];\n\n        if (nextTabEl) {\n          event.preventDefault();\n          nextTabEl.focus();\n        }\n\n        break;\n      }\n      /*\n       В JAWS и NVDA стрелка вниз активирует контент.\n       Это не прописано в стандартах, но по ссылке ниже это рекомендуется делать.\n       https://inclusive-components.design/tabbed-interfaces/\n      */\n      case \"ArrowDown\": {\n        const tabEls = getTabEls();\n        const currentFocusedEl = tabEls.find(\n          (el) => document.activeElement === el\n        );\n\n        if (\n          !currentFocusedEl ||\n          currentFocusedEl.getAttribute(\"aria-selected\") !== \"true\"\n        ) {\n          return;\n        }\n\n        const relatedContentElId =\n          currentFocusedEl.getAttribute(\"aria-controls\");\n        if (!relatedContentElId) {\n          return;\n        }\n\n        // eslint-disable-next-line no-restricted-properties\n        const relatedContentEl = document.getElementById(relatedContentElId);\n        if (!relatedContentEl) {\n          return;\n        }\n\n        event.preventDefault();\n        relatedContentEl.focus();\n\n        break;\n      }\n      case \"Space\":\n      case \"Enter\": {\n        const tabEls = getTabEls();\n        const currentFocusedEl = tabEls.find(\n          (el) => document.activeElement === el\n        );\n        if (currentFocusedEl) {\n          currentFocusedEl.click();\n        }\n      }\n    }\n  };\n\n  useGlobalEventListener(document, \"keydown\", handleDocumentKeydown, {\n    capture: true,\n  });\n\n  return (\n    <div\n      {...restProps}\n      ref={getRootRef}\n      vkuiClass={classNames(\n        \"Tabs\",\n        (platform === IOS || platform === VKCOM) && `Tabs--${platform}`,\n        `Tabs--${mode}`,\n        withGaps && \"Tabs--withGaps\",\n        // TODO v5.0.0 новая адаптивность\n        `Tabs--sizeX-${sizeX}`\n      )}\n      role={role}\n    >\n      <div vkuiClass=\"Tabs__in\" ref={tabsRef}>\n        <TabsModeContext.Provider value={{ mode, withGaps }}>\n          {children}\n        </TabsModeContext.Provider>\n      </div>\n    </div>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Tabs\n */\nexport const Tabs = withAdaptivity(TabsComponent, { sizeX: true });\n\nTabs.displayName = \"Tabs\";\n"],"mappings":"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"}

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

@@ -28,4 +28,4 @@ export interface TabsItemProps extends React.HTMLAttributes<HTMLElement> {
 /**
  * @see https://vkcom.github.io/VKUI/#/TabsItem
  */
-export declare const TabsItem: ({ before, children, status, after, selected, ...restProps }: TabsItemProps) => JSX.Element;
+export declare const TabsItem: ({ before, children, status, after, selected, role, tabIndex: tabIndexProp, ...restProps }: TabsItemProps) => JSX.Element;

package/dist/cssm/components/TabsItem/TabsItem.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["before", "children", "status", "after", "selected"];
+var _excluded = ["before", "children", "status", "after", "selected", "role", "tabIndex"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import * as React from "react";
 import { Tappable } from "../Tappable/Tappable";
@@ -11,11 +11,13 @@ import { useAdaptivity } from "../../hooks/useAdaptivity";
 import { TabsModeContext } from "../Tabs/Tabs";
 import { Headline } from "../Typography/Headline/Headline";
 import { Subhead } from "../Typography/Subhead/Subhead";
+import { warnOnce } from "../../lib/warnOnce";
 import "./TabsItem.css";
-
+var warn = warnOnce("TabsItem");
 /**
  * @see https://vkcom.github.io/VKUI/#/TabsItem
  */
+
 export var TabsItem = function TabsItem(_ref) {
   var before = _ref.before,
       children = _ref.children,
@@ -23,6 +25,9 @@ export var TabsItem = function TabsItem(_ref) {
       after = _ref.after,
       _ref$selected = _ref.selected,
       selected = _ref$selected === void 0 ? false : _ref$selected,
+      _ref$role = _ref.role,
+      role = _ref$role === void 0 ? "tab" : _ref$role,
+      tabIndexProp = _ref.tabIndex,
       restProps = _objectWithoutProperties(_ref, _excluded);
 
   var platform = usePlatform();
@@ -35,6 +40,7 @@ export var TabsItem = function TabsItem(_ref) {
       withGaps = _React$useContext.withGaps;
 
   var statusComponent = null;
+  var isTabFlow = role === "tab";
 
   if (status) {
     statusComponent = typeof status === "number" ? createScopedElement(Subhead, {
@@ -46,13 +52,30 @@ export var TabsItem = function TabsItem(_ref) {
     }, status);
   }
 
+  if (process.env.NODE_ENV === "development" && isTabFlow) {
+    if (!restProps["aria-controls"]) {
+      warn("\u041F\u0435\u0440\u0435\u0434\u0430\u0439\u0442\u0435 \u0432 \"aria-controls\" id \u043A\u043E\u043D\u0442\u0440\u043E\u043B\u0438\u0440\u0443\u0435\u043C\u043E\u0433\u043E \u0431\u043B\u043E\u043A\u0430", "warn");
+    } else if (!restProps["id"]) {
+      warn("\u041F\u0435\u0440\u0435\u0434\u0430\u0439\u0442\u0435 \"id\" \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442\u0443 \u0434\u043B\u044F \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u043D\u0438\u044F \u0432 \"aria-labelledby\" \u043A\u043E\u043D\u0442\u0440\u043E\u043B\u0438\u0440\u0443\u0435\u043C\u043E\u0433\u043E \u0431\u043B\u043E\u043A\u0430", "warn");
+    }
+  }
+
+  var tabIndex = tabIndexProp;
+
+  if (isTabFlow && tabIndex === undefined) {
+    tabIndex = selected ? 0 : -1;
+  }
+
   return createScopedElement(Tappable, _extends({}, restProps, {
     vkuiClass: classNames("TabsItem", (platform === IOS || platform === VKCOM) && "TabsItem--".concat(platform), mode && "TabsItem--".concat(mode), selected && "TabsItem--selected", // TODO v5.0.0 новая адаптивность
     sizeY && "TabsItem--sizeY-".concat(sizeY), withGaps && "TabsItem--withGaps"),
     hoverMode: "TabsItem--hover",
     activeMode: "TabsItem--active",
     focusVisibleMode: mode === "segmented" ? "outside" : "inside",
-    hasActive: mode === "segmented"
+    hasActive: mode === "segmented",
+    role: role,
+    "aria-selected": selected,
+    tabIndex: tabIndex
   }), before && createScopedElement("div", {
     vkuiClass: "TabsItem__before"
   }, before), createScopedElement(Headline, {

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

@@ -1 +1 @@
-{"version":3,"file":"TabsItem.js","names":["React","Tappable","classNames","IOS","VKCOM","usePlatform","useAdaptivity","TabsModeContext","Headline","Subhead","TabsItem","before","children","status","after","selected","restProps","platform","sizeY","useContext","mode","withGaps","statusComponent"],"sources":["../../../../src/components/TabsItem/TabsItem.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Tappable } from \"../Tappable/Tappable\";\nimport { classNames } from \"../../lib/classNames\";\nimport { IOS, VKCOM } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { TabsModeContext, TabsContextProps } from \"../Tabs/Tabs\";\nimport { Headline } from \"../Typography/Headline/Headline\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport \"./TabsItem.css\";\n\nexport interface TabsItemProps extends React.HTMLAttributes<HTMLElement> {\n  /**\n   * Добавляет иконку слева.\n   *\n   * - Для `mode=\"default\"` используйте иконки размером 24.\n   * - Для всех остальных `mode` используйте иконки размером 20.\n   */\n  before?: React.ReactNode;\n  /**\n   * Добавляет элемент слева от `after`.\n   *\n   * - `React.ReactElement` – либо [`Badge`](https://vkcom.github.io/VKUI/#/Badge) с параметром `mode=\"prominent\"`.\n   *   либо [`Counter`](https://vkcom.github.io/VKUI/#/Counter) с параметрами `mode=\"prominent\" size=\"s\"`.\n   * - `number` – для показа текстового блока с переданным числом.\n   */\n  status?: React.ReactElement | number;\n  /**\n   * Добавляет иконку справа.\n   *\n   * Например, `<Icon16Dropdown />`\n   */\n  after?: React.ReactNode;\n  selected?: boolean;\n  disabled?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/TabsItem\n */\nexport const TabsItem = ({\n  before,\n  children,\n  status,\n  after,\n  selected = false,\n  ...restProps\n}: TabsItemProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n  const { mode, withGaps }: TabsContextProps =\n    React.useContext(TabsModeContext);\n  let statusComponent = null;\n\n  if (status) {\n    statusComponent =\n      typeof status === \"number\" ? (\n        <Subhead\n          Component=\"span\"\n          vkuiClass=\"TabsItem__status TabsItem__status--count\"\n          weight=\"2\"\n        >\n          {status}\n        </Subhead>\n      ) : (\n        <span vkuiClass=\"TabsItem__status\">{status}</span>\n      );\n  }\n\n  return (\n    <Tappable\n      {...restProps}\n      vkuiClass={classNames(\n        \"TabsItem\",\n        (platform === IOS || platform === VKCOM) && `TabsItem--${platform}`,\n        mode && `TabsItem--${mode}`,\n        selected && \"TabsItem--selected\",\n        // TODO v5.0.0 новая адаптивность\n        sizeY && `TabsItem--sizeY-${sizeY}`,\n        withGaps && \"TabsItem--withGaps\"\n      )}\n      hoverMode=\"TabsItem--hover\"\n      activeMode=\"TabsItem--active\"\n      focusVisibleMode={mode === \"segmented\" ? \"outside\" : \"inside\"}\n      hasActive={mode === \"segmented\"}\n    >\n      {before && <div vkuiClass=\"TabsItem__before\">{before}</div>}\n      <Headline\n        Component=\"span\"\n        vkuiClass=\"TabsItem__label\"\n        level={mode === \"default\" ? \"1\" : \"2\"}\n        weight=\"2\"\n      >\n        {children}\n      </Headline>\n      {statusComponent}\n      {after && <div vkuiClass=\"TabsItem__after\">{after}</div>}\n      {mode === \"default\" && (\n        <div\n          vkuiClass=\"TabsItem__underline\"\n          aria-hidden\n          data-selected={selected}\n        />\n      )}\n    </Tappable>\n  );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,QAAT;AACA,SAASC,UAAT;AACA,SAASC,GAAT,EAAcC,KAAd;AACA,SAASC,WAAT;AACA,SAASC,aAAT;AACA,SAASC,eAAT;AACA,SAASC,QAAT;AACA,SAASC,OAAT;AACA;;AA4BA;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAW,OAOH;EAAA,IANnBC,MAMmB,QANnBA,MAMmB;EAAA,IALnBC,QAKmB,QALnBA,QAKmB;EAAA,IAJnBC,MAImB,QAJnBA,MAImB;EAAA,IAHnBC,KAGmB,QAHnBA,KAGmB;EAAA,yBAFnBC,QAEmB;EAAA,IAFnBA,QAEmB,8BAFR,KAEQ;EAAA,IADhBC,SACgB;;EACnB,IAAMC,QAAQ,GAAGZ,WAAW,EAA5B;;EACA,qBAAkBC,aAAa,EAA/B;EAAA,IAAQY,KAAR,kBAAQA,KAAR;;EACA,wBACElB,KAAK,CAACmB,UAAN,CAAiBZ,eAAjB,CADF;EAAA,IAAQa,IAAR,qBAAQA,IAAR;EAAA,IAAcC,QAAd,qBAAcA,QAAd;;EAEA,IAAIC,eAAe,GAAG,IAAtB;;EAEA,IAAIT,MAAJ,EAAY;IACVS,eAAe,GACb,OAAOT,MAAP,KAAkB,QAAlB,GACE,oBAAC,OAAD;MACE,SAAS,EAAC,MADZ;MAEE,SAAS,EAAC,0CAFZ;MAGE,MAAM,EAAC;IAHT,GAKGA,MALH,CADF,GASE;MAAM,SAAS,EAAC;IAAhB,GAAoCA,MAApC,CAVJ;EAYD;;EAED,OACE,oBAAC,QAAD,eACMG,SADN;IAEE,SAAS,EAAEd,UAAU,CACnB,UADmB,EAEnB,CAACe,QAAQ,KAAKd,GAAb,IAAoBc,QAAQ,KAAKb,KAAlC,yBAAyDa,QAAzD,CAFmB,EAGnBG,IAAI,wBAAiBA,IAAjB,CAHe,EAInBL,QAAQ,IAAI,oBAJO,EAKnB;IACAG,KAAK,8BAAuBA,KAAvB,CANc,EAOnBG,QAAQ,IAAI,oBAPO,CAFvB;IAWE,SAAS,EAAC,iBAXZ;IAYE,UAAU,EAAC,kBAZb;IAaE,gBAAgB,EAAED,IAAI,KAAK,WAAT,GAAuB,SAAvB,GAAmC,QAbvD;IAcE,SAAS,EAAEA,IAAI,KAAK;EAdtB,IAgBGT,MAAM,IAAI;IAAK,SAAS,EAAC;EAAf,GAAmCA,MAAnC,CAhBb,EAiBE,oBAAC,QAAD;IACE,SAAS,EAAC,MADZ;IAEE,SAAS,EAAC,iBAFZ;IAGE,KAAK,EAAES,IAAI,KAAK,SAAT,GAAqB,GAArB,GAA2B,GAHpC;IAIE,MAAM,EAAC;EAJT,GAMGR,QANH,CAjBF,EAyBGU,eAzBH,EA0BGR,KAAK,IAAI;IAAK,SAAS,EAAC;EAAf,GAAkCA,KAAlC,CA1BZ,EA2BGM,IAAI,KAAK,SAAT,IACC;IACE,SAAS,EAAC,qBADZ;IAEE,mBAFF;IAGE,iBAAeL;EAHjB,EA5BJ,CADF;AAqCD,CAlEM"}
+{"version":3,"file":"TabsItem.js","names":["React","Tappable","classNames","IOS","VKCOM","usePlatform","useAdaptivity","TabsModeContext","Headline","Subhead","warnOnce","warn","TabsItem","before","children","status","after","selected","role","tabIndexProp","tabIndex","restProps","platform","sizeY","useContext","mode","withGaps","statusComponent","isTabFlow","process","env","NODE_ENV","undefined"],"sources":["../../../../src/components/TabsItem/TabsItem.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Tappable } from \"../Tappable/Tappable\";\nimport { classNames } from \"../../lib/classNames\";\nimport { IOS, VKCOM } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { TabsModeContext, TabsContextProps } from \"../Tabs/Tabs\";\nimport { Headline } from \"../Typography/Headline/Headline\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport \"./TabsItem.css\";\n\nexport interface TabsItemProps extends React.HTMLAttributes<HTMLElement> {\n  /**\n   * Добавляет иконку слева.\n   *\n   * - Для `mode=\"default\"` используйте иконки размером 24.\n   * - Для всех остальных `mode` используйте иконки размером 20.\n   */\n  before?: React.ReactNode;\n  /**\n   * Добавляет элемент слева от `after`.\n   *\n   * - `React.ReactElement` – либо [`Badge`](https://vkcom.github.io/VKUI/#/Badge) с параметром `mode=\"prominent\"`.\n   *   либо [`Counter`](https://vkcom.github.io/VKUI/#/Counter) с параметрами `mode=\"prominent\" size=\"s\"`.\n   * - `number` – для показа текстового блока с переданным числом.\n   */\n  status?: React.ReactElement | number;\n  /**\n   * Добавляет иконку справа.\n   *\n   * Например, `<Icon16Dropdown />`\n   */\n  after?: React.ReactNode;\n  selected?: boolean;\n  disabled?: boolean;\n}\n\nconst warn = warnOnce(\"TabsItem\");\n\n/**\n * @see https://vkcom.github.io/VKUI/#/TabsItem\n */\nexport const TabsItem = ({\n  before,\n  children,\n  status,\n  after,\n  selected = false,\n  role = \"tab\",\n  tabIndex: tabIndexProp,\n  ...restProps\n}: TabsItemProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n  const { mode, withGaps }: TabsContextProps =\n    React.useContext(TabsModeContext);\n  let statusComponent = null;\n\n  const isTabFlow = role === \"tab\";\n\n  if (status) {\n    statusComponent =\n      typeof status === \"number\" ? (\n        <Subhead\n          Component=\"span\"\n          vkuiClass=\"TabsItem__status TabsItem__status--count\"\n          weight=\"2\"\n        >\n          {status}\n        </Subhead>\n      ) : (\n        <span vkuiClass=\"TabsItem__status\">{status}</span>\n      );\n  }\n\n  if (process.env.NODE_ENV === \"development\" && isTabFlow) {\n    if (!restProps[\"aria-controls\"]) {\n      warn(`Передайте в \"aria-controls\" id контролируемого блока`, \"warn\");\n    } else if (!restProps[\"id\"]) {\n      warn(\n        `Передайте \"id\" компоненту для использования в \"aria-labelledby\" контролируемого блока`,\n        \"warn\"\n      );\n    }\n  }\n\n  let tabIndex = tabIndexProp;\n  if (isTabFlow && tabIndex === undefined) {\n    tabIndex = selected ? 0 : -1;\n  }\n\n  return (\n    <Tappable\n      {...restProps}\n      vkuiClass={classNames(\n        \"TabsItem\",\n        (platform === IOS || platform === VKCOM) && `TabsItem--${platform}`,\n        mode && `TabsItem--${mode}`,\n        selected && \"TabsItem--selected\",\n        // TODO v5.0.0 новая адаптивность\n        sizeY && `TabsItem--sizeY-${sizeY}`,\n        withGaps && \"TabsItem--withGaps\"\n      )}\n      hoverMode=\"TabsItem--hover\"\n      activeMode=\"TabsItem--active\"\n      focusVisibleMode={mode === \"segmented\" ? \"outside\" : \"inside\"}\n      hasActive={mode === \"segmented\"}\n      role={role}\n      aria-selected={selected}\n      tabIndex={tabIndex}\n    >\n      {before && <div vkuiClass=\"TabsItem__before\">{before}</div>}\n      <Headline\n        Component=\"span\"\n        vkuiClass=\"TabsItem__label\"\n        level={mode === \"default\" ? \"1\" : \"2\"}\n        weight=\"2\"\n      >\n        {children}\n      </Headline>\n      {statusComponent}\n      {after && <div vkuiClass=\"TabsItem__after\">{after}</div>}\n      {mode === \"default\" && (\n        <div\n          vkuiClass=\"TabsItem__underline\"\n          aria-hidden\n          data-selected={selected}\n        />\n      )}\n    </Tappable>\n  );\n};\n"],"mappings":"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"}

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

@@ -43,4 +43,4 @@ export declare const ACTIVE_EFFECT_DELAY = 600;
 /**
  * @see https://vkcom.github.io/VKUI/#/Tappable
  */
-export declare const Tappable: React.FC<Pick<TappableProps, "max" | "required" | "high" | "low" | "disabled" | "default" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "size" | "wrap" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "method" | "min" | "name" | "target" | "type" | "role" | "tabIndex" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "classID" | "useMap" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "as" | "hrefLang" | "integrity" | "rel" | "sizes" | "charSet" | "kind" | "srcLang" | "value" | "download" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "htmlFor" | "httpEquiv" | "optimum" | "reversed" | "selected" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "poster" | "challenge" | "keyType" | "keyParams" | "onStart" | "onMove" | "onLeave" | "onEnter" | "onEnd" | "Component" | "getRootRef" | "stopPropagation" | "activeEffectDelay" | "hasHover" | "hoverMode" | "hasActive" | "activeMode" | "focusVisibleMode"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
+export declare const Tappable: React.FC<Pick<TappableProps, "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "value" | "children" | "alt" | "crossOrigin" | "height" | "sizes" | "src" | "srcSet" | "useMap" | "width" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "start" | "content" | "size" | "default" | "wrap" | "open" | "multiple" | "disabled" | "list" | "step" | "onStart" | "onMove" | "onLeave" | "onEnter" | "onEnd" | "Component" | "getRootRef" | "stopPropagation" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "as" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "name" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "srcDoc" | "srcLang" | "target" | "type" | "wmode" | "activeEffectDelay" | "hasHover" | "hoverMode" | "hasActive" | "activeMode" | "focusVisibleMode"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;

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

@@ -11,4 +11,4 @@ export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextArea
 /**
  * @see https://vkcom.github.io/VKUI/#/Textarea
  */
-export declare const Textarea: React.FC<Pick<TextareaProps, "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "color" | "wrap" | "maxHeight" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "name" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "status" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "value" | "autoFocus" | "autoComplete" | "maxLength" | "minLength" | "readOnly" | "cols" | "dirName" | "rows" | "getRootRef" | "getRef" | "grow" | "onResize"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
+export declare const Textarea: React.FC<Pick<TextareaProps, "form" | "slot" | "style" | "title" | "value" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "wrap" | "disabled" | "status" | "getRootRef" | "autoComplete" | "autoFocus" | "cols" | "maxLength" | "minLength" | "name" | "readOnly" | "required" | "rows" | "getRef" | "maxHeight" | "dirName" | "grow" | "onResize"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;

package/dist/cssm/components/View/ViewInfinite.d.ts

@@ -62,5 +62,5 @@ export interface ViewInfiniteState {
     swipeBackResult: SwipeBackResults | null;
     browserSwipe: boolean;
 }
-export declare const ViewInfinite: React.FC<Pick<ViewInfiniteProps, "hidden" | "dir" | "nav" | "slot" | "style" | "title" | "scroll" | "color" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "popout" | "modal" | "onTransition" | "activePanel" | "history" | "onSwipeBack" | "onSwipeBackStart" | "onSwipeBackCancel" | "configProvider" | "isBackCheck" | "splitCol">>;
+export declare const ViewInfinite: React.FC<Pick<ViewInfiniteProps, "nav" | "slot" | "style" | "title" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "scroll" | "popout" | "modal" | "onTransition" | "activePanel" | "history" | "onSwipeBack" | "onSwipeBackStart" | "onSwipeBackCancel" | "configProvider" | "isBackCheck" | "splitCol">>;
 export {};

package/dist/cssm/hooks/useWaitTransitionFinish.js

@@ -1,5 +1,6 @@
 import * as React from "react";
 import { useDOM } from "../lib/dom";
+import { noop } from "../lib/utils";
 import { transitionEvent } from "../lib/supportEvents";
 export var useWaitTransitionFinish = function useWaitTransitionFinish() {
   var timeoutRef = React.useRef(null);
@@ -7,11 +8,22 @@ export var useWaitTransitionFinish = function useWaitTransitionFinish() {
   var _useDOM = useDOM(),
       document = _useDOM.document;
 
+  var detach = React.useRef(noop);
+  var remove = React.useCallback(function () {
+    detach.current();
+    detach.current = noop;
+  }, []);
   var waitTransitionFinish = React.useCallback(function (element, eventHandler, durationFallback) {
     if (element) {
       if (!(document !== null && document !== void 0 && document.hidden) && transitionEvent.supported && transitionEvent.name) {
-        element.removeEventListener(transitionEvent.name, eventHandler);
+        remove();
         element.addEventListener(transitionEvent.name, eventHandler);
+
+        detach.current = function () {
+          if (transitionEvent.name) {
+            element.removeEventListener(transitionEvent.name, eventHandler);
+          }
+        };
       } else {
         if (timeoutRef !== null && timeoutRef !== void 0 && timeoutRef.current) {
           clearTimeout(timeoutRef.current);
@@ -20,7 +32,7 @@ export var useWaitTransitionFinish = function useWaitTransitionFinish() {
         timeoutRef.current = setTimeout(eventHandler, durationFallback);
       }
     }
-  }, [document, timeoutRef]);
+  }, [document, remove, timeoutRef]);
   return {
     waitTransitionFinish: waitTransitionFinish
   };

package/dist/cssm/hooks/useWaitTransitionFinish.js.map

@@ -1 +1 @@
-{"version":3,"file":"useWaitTransitionFinish.js","names":["React","useDOM","transitionEvent","useWaitTransitionFinish","timeoutRef","useRef","document","waitTransitionFinish","useCallback","element","eventHandler","durationFallback","hidden","supported","name","removeEventListener","addEventListener","current","clearTimeout","setTimeout"],"sources":["../../../src/hooks/useWaitTransitionFinish.ts"],"sourcesContent":["import * as React from \"react\";\nimport { useDOM } from \"../lib/dom\";\nimport { transitionEvent } from \"../lib/supportEvents\";\n\nexport const useWaitTransitionFinish = () => {\n  const timeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(null);\n  const { document } = useDOM();\n\n  const waitTransitionFinish = React.useCallback(\n    (\n      element: HTMLElement | null,\n      eventHandler: VoidFunction,\n      durationFallback: number\n    ) => {\n      if (element) {\n        if (\n          !document?.hidden &&\n          transitionEvent.supported &&\n          transitionEvent.name\n        ) {\n          element.removeEventListener(transitionEvent.name, eventHandler);\n          element.addEventListener(transitionEvent.name, eventHandler);\n        } else {\n          if (timeoutRef?.current) {\n            clearTimeout(timeoutRef.current);\n          }\n          timeoutRef.current = setTimeout(eventHandler, durationFallback);\n        }\n      }\n    },\n    [document, timeoutRef]\n  );\n\n  return {\n    waitTransitionFinish,\n  };\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,MAAT;AACA,SAASC,eAAT;AAEA,OAAO,IAAMC,uBAAuB,GAAG,SAA1BA,uBAA0B,GAAM;EAC3C,IAAMC,UAAU,GAAGJ,KAAK,CAACK,MAAN,CAAmD,IAAnD,CAAnB;;EACA,cAAqBJ,MAAM,EAA3B;EAAA,IAAQK,QAAR,WAAQA,QAAR;;EAEA,IAAMC,oBAAoB,GAAGP,KAAK,CAACQ,WAAN,CAC3B,UACEC,OADF,EAEEC,YAFF,EAGEC,gBAHF,EAIK;IACH,IAAIF,OAAJ,EAAa;MACX,IACE,EAACH,QAAD,aAACA,QAAD,eAACA,QAAQ,CAAEM,MAAX,KACAV,eAAe,CAACW,SADhB,IAEAX,eAAe,CAACY,IAHlB,EAIE;QACAL,OAAO,CAACM,mBAAR,CAA4Bb,eAAe,CAACY,IAA5C,EAAkDJ,YAAlD;QACAD,OAAO,CAACO,gBAAR,CAAyBd,eAAe,CAACY,IAAzC,EAA+CJ,YAA/C;MACD,CAPD,MAOO;QACL,IAAIN,UAAJ,aAAIA,UAAJ,eAAIA,UAAU,CAAEa,OAAhB,EAAyB;UACvBC,YAAY,CAACd,UAAU,CAACa,OAAZ,CAAZ;QACD;;QACDb,UAAU,CAACa,OAAX,GAAqBE,UAAU,CAACT,YAAD,EAAeC,gBAAf,CAA/B;MACD;IACF;EACF,CArB0B,EAsB3B,CAACL,QAAD,EAAWF,UAAX,CAtB2B,CAA7B;EAyBA,OAAO;IACLG,oBAAoB,EAApBA;EADK,CAAP;AAGD,CAhCM"}
+{"version":3,"file":"useWaitTransitionFinish.js","names":["React","useDOM","noop","transitionEvent","useWaitTransitionFinish","timeoutRef","useRef","document","detach","remove","useCallback","current","waitTransitionFinish","element","eventHandler","durationFallback","hidden","supported","name","addEventListener","removeEventListener","clearTimeout","setTimeout"],"sources":["../../../src/hooks/useWaitTransitionFinish.ts"],"sourcesContent":["import * as React from \"react\";\nimport { useDOM } from \"../lib/dom\";\nimport { noop } from \"../lib/utils\";\nimport { transitionEvent } from \"../lib/supportEvents\";\n\nexport const useWaitTransitionFinish = () => {\n  const timeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(null);\n  const { document } = useDOM();\n  const detach = React.useRef(noop);\n\n  const remove = React.useCallback(() => {\n    detach.current();\n    detach.current = noop;\n  }, []);\n\n  const waitTransitionFinish = React.useCallback(\n    (\n      element: HTMLElement | null,\n      eventHandler: VoidFunction,\n      durationFallback: number\n    ) => {\n      if (element) {\n        if (\n          !document?.hidden &&\n          transitionEvent.supported &&\n          transitionEvent.name\n        ) {\n          remove();\n          element.addEventListener(transitionEvent.name, eventHandler);\n          detach.current = () => {\n            if (transitionEvent.name) {\n              element.removeEventListener(transitionEvent.name, eventHandler);\n            }\n          };\n        } else {\n          if (timeoutRef?.current) {\n            clearTimeout(timeoutRef.current);\n          }\n          timeoutRef.current = setTimeout(eventHandler, durationFallback);\n        }\n      }\n    },\n    [document, remove, timeoutRef]\n  );\n\n  return {\n    waitTransitionFinish,\n  };\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,MAAT;AACA,SAASC,IAAT;AACA,SAASC,eAAT;AAEA,OAAO,IAAMC,uBAAuB,GAAG,SAA1BA,uBAA0B,GAAM;EAC3C,IAAMC,UAAU,GAAGL,KAAK,CAACM,MAAN,CAAmD,IAAnD,CAAnB;;EACA,cAAqBL,MAAM,EAA3B;EAAA,IAAQM,QAAR,WAAQA,QAAR;;EACA,IAAMC,MAAM,GAAGR,KAAK,CAACM,MAAN,CAAaJ,IAAb,CAAf;EAEA,IAAMO,MAAM,GAAGT,KAAK,CAACU,WAAN,CAAkB,YAAM;IACrCF,MAAM,CAACG,OAAP;IACAH,MAAM,CAACG,OAAP,GAAiBT,IAAjB;EACD,CAHc,EAGZ,EAHY,CAAf;EAKA,IAAMU,oBAAoB,GAAGZ,KAAK,CAACU,WAAN,CAC3B,UACEG,OADF,EAEEC,YAFF,EAGEC,gBAHF,EAIK;IACH,IAAIF,OAAJ,EAAa;MACX,IACE,EAACN,QAAD,aAACA,QAAD,eAACA,QAAQ,CAAES,MAAX,KACAb,eAAe,CAACc,SADhB,IAEAd,eAAe,CAACe,IAHlB,EAIE;QACAT,MAAM;QACNI,OAAO,CAACM,gBAAR,CAAyBhB,eAAe,CAACe,IAAzC,EAA+CJ,YAA/C;;QACAN,MAAM,CAACG,OAAP,GAAiB,YAAM;UACrB,IAAIR,eAAe,CAACe,IAApB,EAA0B;YACxBL,OAAO,CAACO,mBAAR,CAA4BjB,eAAe,CAACe,IAA5C,EAAkDJ,YAAlD;UACD;QACF,CAJD;MAKD,CAZD,MAYO;QACL,IAAIT,UAAJ,aAAIA,UAAJ,eAAIA,UAAU,CAAEM,OAAhB,EAAyB;UACvBU,YAAY,CAAChB,UAAU,CAACM,OAAZ,CAAZ;QACD;;QACDN,UAAU,CAACM,OAAX,GAAqBW,UAAU,CAACR,YAAD,EAAeC,gBAAf,CAA/B;MACD;IACF;EACF,CA1B0B,EA2B3B,CAACR,QAAD,EAAWE,MAAX,EAAmBJ,UAAnB,CA3B2B,CAA7B;EA8BA,OAAO;IACLO,oBAAoB,EAApBA;EADK,CAAP;AAGD,CA3CM"}

package/dist/cssm/index.d.ts

@@ -300,6 +300,7 @@ export { ViewWidth, ViewHeight, SizeType, } from "./components/AdaptivityProvide
 export { calcInitialsAvatarColor } from "./helpers/avatar";
 export { Popper } from "./components/Popper/Popper";
 export type { PopperProps } from "./components/Popper/Popper";
+export { CustomScrollView } from "./components/CustomScrollView/CustomScrollView";
 /**
  * Types
  */

package/dist/cssm/index.js

@@ -194,4 +194,8 @@ export { getClassName } from "./helpers/getClassName";
 export { ViewWidth, ViewHeight, SizeType } from "./components/AdaptivityProvider/AdaptivityContext";
 export { calcInitialsAvatarColor } from "./helpers/avatar";
 export { Popper } from "./components/Popper/Popper";
+export { CustomScrollView } from "./components/CustomScrollView/CustomScrollView";
+/**
+ * Types
+ */
 //# sourceMappingURL=index.js.map