@vkontakte/vkui 4.20.0 → 4.22.1

package/dist/components/SimpleCell/SimpleCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SimpleCell/SimpleCell.tsx"],"names":["classNames","getClassName","Tappable","Icon24Chevron","IOS","usePlatform","hasReactNode","useAdaptivity","withAdaptivity","SizeType","Title","Text","Subhead","SimpleCellTypography","props","sizeY","COMPACT","SimpleCell","badge","before","indicator","children","after","description","expandable","multiline","restProps","platform","hasAfter"],"mappings":";;;;AACA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,aAAT,QAA8B,kBAA9B;AACA,SAASC,GAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,aAAT;AACA,SAASC,cAAT,EAAyBC,QAAzB;AACA,OAAOC,KAAP;AACA,OAAOC,IAAP;AACA,OAAOC,OAAP;;AA0CA,IAAMC,oBAAyD,GAAG,SAA5DA,oBAA4D,CAACC,KAAD,EAAsC;AACtG,uBAAkBP,aAAa,EAA/B;AAAA,MAAQQ,KAAR,kBAAQA,KAAR;;AAEA,SAAOA,KAAK,KAAKN,QAAQ,CAACO,OAAnB,GACH,oBAAC,IAAD;AAAM,IAAA,SAAS,EAAC,MAAhB;AAAuB,IAAA,MAAM,EAAC;AAA9B,KAA4CF,KAA5C,EADG,GAEH,oBAAC,KAAD;AAAO,IAAA,SAAS,EAAC,MAAjB;AAAwB,IAAA,KAAK,EAAC,GAA9B;AAAkC,IAAA,MAAM,EAAC;AAAzC,KAAuDA,KAAvD,EAFJ;AAGD,CAND;;AAQA,IAAMG,UAAqC,GAAG,SAAxCA,UAAwC,OAWvB;AAAA,MAVrBC,KAUqB,QAVrBA,KAUqB;AAAA,MATrBC,MASqB,QATrBA,MASqB;AAAA,MARrBC,SAQqB,QARrBA,SAQqB;AAAA,MAPrBC,QAOqB,QAPrBA,QAOqB;AAAA,MANrBC,KAMqB,QANrBA,KAMqB;AAAA,MALrBC,WAKqB,QALrBA,WAKqB;AAAA,MAJrBC,UAIqB,QAJrBA,UAIqB;AAAA,MAHrBC,SAGqB,QAHrBA,SAGqB;AAAA,MAFrBV,KAEqB,QAFrBA,KAEqB;AAAA,MADlBW,SACkB;;AACrB,MAAMC,QAAQ,GAAGtB,WAAW,EAA5B;AACA,MAAMuB,QAAQ,GAAGtB,YAAY,CAACgB,KAAD,CAAZ,IAAuBE,UAAU,IAAIG,QAAQ,KAAKvB,GAAnE;AAEA,SACE,oBAAC,QAAD,eACMsB,SADN;AAEE,IAAA,SAAS,EACP1B,UAAU,CACRC,YAAY,CAAC,YAAD,EAAe0B,QAAf,CADJ,EAER;AACE,yBAAmBH,UADrB;AAEE,0BAAoBC;AAFtB,KAFQ,8BAMaV,KANb;AAHd,MAaGI,MAbH,EAcE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC;AAAhC,KAAwDE,QAAxD,CADF,EAEGf,YAAY,CAACY,KAAD,CAAZ,IACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KACGA,KADH,CAHJ,CADF,EASGK,WAAW,IAAI,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC,MAAnB;AAA0B,IAAA,MAAM,EAAC,SAAjC;AAA2C,IAAA,SAAS,EAAC;AAArD,KAAgFA,WAAhF,CATlB,CAdF,EAyBGjB,YAAY,CAACc,SAAD,CAAZ,IACC,oBAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC,MAAhC;AAAuC,IAAA,SAAS,EAAC;AAAjD,KAA0EA,SAA1E,CA1BJ,EA4BGQ,QAAQ,IACP;AAAK,IAAA,SAAS,EAAC;AAAf,KACGN,KADH,EAEGE,UAAU,IAAIG,QAAQ,KAAKvB,GAA3B,IAAkC,oBAAC,aAAD,OAFrC,CA7BJ,CADF;AAqCD,CApDD;;AAsDA,eAAeI,cAAc,CAACS,UAAD,EAAa;AAAEF,EAAAA,KAAK,EAAE;AAAT,CAAb,CAA7B","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport Tappable, { TappableProps } from '../Tappable/Tappable';\nimport { Icon24Chevron } from '@vkontakte/icons';\nimport { IOS } from '../../lib/platform';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasReactNode } from '../../lib/utils';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { withAdaptivity, SizeType } from '../../hoc/withAdaptivity';\nimport Title from '../Typography/Title/Title';\nimport Text from '../Typography/Text/Text';\nimport Subhead from '../Typography/Subhead/Subhead';\nimport './SimpleCell.css';\n\nexport interface SimpleCellOwnProps {\n  /**\n   * Иконка 28 или `<Avatar size={28|32|40|48|72} />`\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится справа от текста `children`.\n   */\n  badge?: React.ReactNode;\n  /**\n   * Контейнер для текста справа от `children`.\n   */\n  indicator?: React.ReactNode;\n  /**\n   * Иконка 24|28 или `<Switch />`. Располагается справа от `indicator`.\n   */\n  after?: React.ReactNode;\n  /**\n   * Контейнер для текста под `children`.\n   */\n  description?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия\n   */\n  disabled?: boolean;\n  /**\n   * В iOS добавляет chevron справа. Передавать `true`, если предполагается переход при клике по ячейке.\n   */\n  expandable?: boolean;\n  multiline?: boolean;\n  Component?: React.ElementType;\n}\n\nexport interface SimpleCellProps extends SimpleCellOwnProps, TappableProps {}\n\ninterface SimpleCellTypographyProps extends React.HTMLAttributes<HTMLDivElement> {\n  Component?: React.ElementType;\n}\n\nconst SimpleCellTypography: React.FC<SimpleCellTypographyProps> = (props: SimpleCellTypographyProps) => {\n  const { sizeY } = useAdaptivity();\n\n  return sizeY === SizeType.COMPACT\n    ? <Text Component=\"span\" weight=\"regular\" {...props} />\n    : <Title Component=\"span\" level=\"3\" weight=\"regular\" {...props} />;\n};\n\nconst SimpleCell: React.FC<SimpleCellProps> = ({\n  badge,\n  before,\n  indicator,\n  children,\n  after,\n  description,\n  expandable,\n  multiline,\n  sizeY,\n  ...restProps\n}: SimpleCellProps) => {\n  const platform = usePlatform();\n  const hasAfter = hasReactNode(after) || expandable && platform === IOS;\n\n  return (\n    <Tappable\n      {...restProps}\n      vkuiClass={\n        classNames(\n          getClassName('SimpleCell', platform),\n          {\n            'SimpleCell--exp': expandable,\n            'SimpleCell--mult': multiline,\n          },\n          `SimpleCell--sizeY-${sizeY}`,\n        )\n      }\n    >\n      {before}\n      <div vkuiClass=\"SimpleCell__main\">\n        <div vkuiClass=\"SimpleCell__content\">\n          <SimpleCellTypography vkuiClass=\"SimpleCell__children\">{children}</SimpleCellTypography>\n          {hasReactNode(badge) &&\n            <span vkuiClass=\"SimpleCell__badge\">\n              {badge}\n            </span>\n          }\n        </div>\n        {description && <Subhead Component=\"span\" weight=\"regular\" vkuiClass=\"SimpleCell__description\">{description}</Subhead>}\n      </div>\n      {hasReactNode(indicator) &&\n        <SimpleCellTypography Component=\"span\" vkuiClass=\"SimpleCell__indicator\">{indicator}</SimpleCellTypography>\n      }\n      {hasAfter &&\n        <div vkuiClass=\"SimpleCell__after\">\n          {after}\n          {expandable && platform === IOS && <Icon24Chevron />}\n        </div>\n      }\n    </Tappable>\n  );\n};\n\nexport default withAdaptivity(SimpleCell, { sizeY: true });\n"],"file":"SimpleCell.js"}
+{"version":3,"sources":["../../../src/components/SimpleCell/SimpleCell.tsx"],"names":["classNames","getClassName","Tappable","Icon24Chevron","IOS","usePlatform","hasReactNode","useAdaptivity","withAdaptivity","SizeType","Title","Text","Subhead","SimpleCellTypography","props","sizeY","COMPACT","SimpleCell","badge","before","indicator","children","after","description","expandable","multiline","restProps","platform","hasAfter"],"mappings":";;;;AAEA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,aAAT,QAA8B,kBAA9B;AACA,SAASC,GAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,aAAT;AACA,SAASC,cAAT,EAAyBC,QAAzB;AACA,OAAOC,KAAP;AACA,OAAOC,IAAP;AACA,OAAOC,OAAP;;AAuCA,IAAMC,oBAAyD,GAAG,SAA5DA,oBAA4D,CAACC,KAAD,EAAsC;AACtG,uBAAkBP,aAAa,EAA/B;AAAA,MAAQQ,KAAR,kBAAQA,KAAR;;AAEA,SAAOA,KAAK,KAAKN,QAAQ,CAACO,OAAnB,GACH,oBAAC,IAAD;AAAM,IAAA,SAAS,EAAC,MAAhB;AAAuB,IAAA,MAAM,EAAC;AAA9B,KAA4CF,KAA5C,EADG,GAEH,oBAAC,KAAD;AAAO,IAAA,SAAS,EAAC,MAAjB;AAAwB,IAAA,KAAK,EAAC,GAA9B;AAAkC,IAAA,MAAM,EAAC;AAAzC,KAAuDA,KAAvD,EAFJ;AAGD,CAND;;AAQA,IAAMG,UAAqC,GAAG,SAAxCA,UAAwC,OAWvB;AAAA,MAVrBC,KAUqB,QAVrBA,KAUqB;AAAA,MATrBC,MASqB,QATrBA,MASqB;AAAA,MARrBC,SAQqB,QARrBA,SAQqB;AAAA,MAPrBC,QAOqB,QAPrBA,QAOqB;AAAA,MANrBC,KAMqB,QANrBA,KAMqB;AAAA,MALrBC,WAKqB,QALrBA,WAKqB;AAAA,MAJrBC,UAIqB,QAJrBA,UAIqB;AAAA,MAHrBC,SAGqB,QAHrBA,SAGqB;AAAA,MAFrBV,KAEqB,QAFrBA,KAEqB;AAAA,MADlBW,SACkB;;AACrB,MAAMC,QAAQ,GAAGtB,WAAW,EAA5B;AACA,MAAMuB,QAAQ,GAAGtB,YAAY,CAACgB,KAAD,CAAZ,IAAuBE,UAAU,IAAIG,QAAQ,KAAKvB,GAAnE;AAEA,SACE,oBAAC,QAAD,eACMsB,SADN;AAEE,IAAA,SAAS,EACP1B,UAAU,CACRC,YAAY,CAAC,YAAD,EAAe0B,QAAf,CADJ,EAER;AACE,yBAAmBH,UADrB;AAEE,0BAAoBC;AAFtB,KAFQ,8BAMaV,KANb;AAHd,MAaGI,MAbH,EAcE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC;AAAhC,KAAwDE,QAAxD,CADF,EAEGf,YAAY,CAACY,KAAD,CAAZ,IACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KACGA,KADH,CAHJ,CADF,EASGK,WAAW,IAAI,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC,MAAnB;AAA0B,IAAA,MAAM,EAAC,SAAjC;AAA2C,IAAA,SAAS,EAAC;AAArD,KAAgFA,WAAhF,CATlB,CAdF,EAyBGjB,YAAY,CAACc,SAAD,CAAZ,IACC,oBAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC,MAAhC;AAAuC,IAAA,SAAS,EAAC;AAAjD,KAA0EA,SAA1E,CA1BJ,EA4BGQ,QAAQ,IACP;AAAK,IAAA,SAAS,EAAC;AAAf,KACGN,KADH,EAEGE,UAAU,IAAIG,QAAQ,KAAKvB,GAA3B,IAAkC,oBAAC,aAAD,OAFrC,CA7BJ,CADF;AAqCD,CApDD;;AAsDA,eAAeI,cAAc,CAACS,UAAD,EAAa;AAAEF,EAAAA,KAAK,EAAE;AAAT,CAAb,CAA7B","sourcesContent":["import * as React from 'react';\nimport { HasComponent } from '../../types';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport Tappable, { TappableProps } from '../Tappable/Tappable';\nimport { Icon24Chevron } from '@vkontakte/icons';\nimport { IOS } from '../../lib/platform';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasReactNode } from '../../lib/utils';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { withAdaptivity, SizeType } from '../../hoc/withAdaptivity';\nimport Title from '../Typography/Title/Title';\nimport Text from '../Typography/Text/Text';\nimport Subhead from '../Typography/Subhead/Subhead';\nimport './SimpleCell.css';\n\nexport interface SimpleCellOwnProps extends HasComponent {\n  /**\n   * Иконка 28 или `<Avatar size={28|32|40|48|72} />`\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится справа от текста `children`.\n   */\n  badge?: React.ReactNode;\n  /**\n   * Контейнер для текста справа от `children`.\n   */\n  indicator?: React.ReactNode;\n  /**\n   * Иконка 24|28 или `<Switch />`. Располагается справа от `indicator`.\n   */\n  after?: React.ReactNode;\n  /**\n   * Контейнер для текста под `children`.\n   */\n  description?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия\n   */\n  disabled?: boolean;\n  /**\n   * В iOS добавляет chevron справа. Передавать `true`, если предполагается переход при клике по ячейке.\n   */\n  expandable?: boolean;\n  multiline?: boolean;\n}\n\nexport interface SimpleCellProps extends SimpleCellOwnProps, TappableProps {}\n\ntype SimpleCellTypographyProps = React.HTMLAttributes<HTMLDivElement> & HasComponent;\n\nconst SimpleCellTypography: React.FC<SimpleCellTypographyProps> = (props: SimpleCellTypographyProps) => {\n  const { sizeY } = useAdaptivity();\n\n  return sizeY === SizeType.COMPACT\n    ? <Text Component=\"span\" weight=\"regular\" {...props} />\n    : <Title Component=\"span\" level=\"3\" weight=\"regular\" {...props} />;\n};\n\nconst SimpleCell: React.FC<SimpleCellProps> = ({\n  badge,\n  before,\n  indicator,\n  children,\n  after,\n  description,\n  expandable,\n  multiline,\n  sizeY,\n  ...restProps\n}: SimpleCellProps) => {\n  const platform = usePlatform();\n  const hasAfter = hasReactNode(after) || expandable && platform === IOS;\n\n  return (\n    <Tappable\n      {...restProps}\n      vkuiClass={\n        classNames(\n          getClassName('SimpleCell', platform),\n          {\n            'SimpleCell--exp': expandable,\n            'SimpleCell--mult': multiline,\n          },\n          `SimpleCell--sizeY-${sizeY}`,\n        )\n      }\n    >\n      {before}\n      <div vkuiClass=\"SimpleCell__main\">\n        <div vkuiClass=\"SimpleCell__content\">\n          <SimpleCellTypography vkuiClass=\"SimpleCell__children\">{children}</SimpleCellTypography>\n          {hasReactNode(badge) &&\n            <span vkuiClass=\"SimpleCell__badge\">\n              {badge}\n            </span>\n          }\n        </div>\n        {description && <Subhead Component=\"span\" weight=\"regular\" vkuiClass=\"SimpleCell__description\">{description}</Subhead>}\n      </div>\n      {hasReactNode(indicator) &&\n        <SimpleCellTypography Component=\"span\" vkuiClass=\"SimpleCell__indicator\">{indicator}</SimpleCellTypography>\n      }\n      {hasAfter &&\n        <div vkuiClass=\"SimpleCell__after\">\n          {after}\n          {expandable && platform === IOS && <Icon24Chevron />}\n        </div>\n      }\n    </Tappable>\n  );\n};\n\nexport default withAdaptivity(SimpleCell, { sizeY: true });\n"],"file":"SimpleCell.js"}

package/dist/components/SplitCol/SplitCol.d.ts

@@ -6,9 +6,9 @@ export interface SplitColContextProps {
 }
 export declare const SplitColContext: React.Context<SplitColContextProps>;
 export interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {
-    width?: string;
-    maxWidth?: string;
-    minWidth?: string;
+    width?: number | string;
+    maxWidth?: number | string;
+    minWidth?: number | string;
     /**
      * Если false, то переходы между Panel происходят без анимации
      */

package/dist/components/SplitCol/SplitCol.js

@@ -15,7 +15,8 @@ export var SplitCol = function SplitCol(props) {
       maxWidth = props.maxWidth,
       minWidth = props.minWidth,
       spaced = props.spaced,
-      animate = props.animate,
+      _props$animate = props.animate,
+      animate = _props$animate === void 0 ? false : _props$animate,
       fixed = props.fixed,
       style = props.style,
       restProps = _objectWithoutProperties(props, _excluded);
@@ -44,7 +45,4 @@ export var SplitCol = function SplitCol(props) {
     vkuiClass: "SplitCol__fixedInner"
   }, children) : children));
 };
-SplitCol.defaultProps = {
-  animate: false
-};
 //# sourceMappingURL=SplitCol.js.map

package/dist/components/SplitCol/SplitCol.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SplitCol/SplitCol.tsx"],"names":["React","classNames","SplitColContext","createContext","colRef","animate","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","restProps","baseRef","useRef","contextValue","useMemo","defaultProps"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AAQA,OAAO,IAAMC,eAAe,gBAAGF,KAAK,CAACG,aAAN,CAA0C;AACvEC,EAAAA,MAAM,EAAE,IAD+D;AAEvEC,EAAAA,OAAO,EAAE;AAF8D,CAA1C,CAAxB;AAoBP,OAAO,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,CAACC,KAAD,EAA0B;AACzE,MAAQC,QAAR,GAA6FD,KAA7F,CAAQC,QAAR;AAAA,MAAkBC,KAAlB,GAA6FF,KAA7F,CAAkBE,KAAlB;AAAA,MAAyBC,QAAzB,GAA6FH,KAA7F,CAAyBG,QAAzB;AAAA,MAAmCC,QAAnC,GAA6FJ,KAA7F,CAAmCI,QAAnC;AAAA,MAA6CC,MAA7C,GAA6FL,KAA7F,CAA6CK,MAA7C;AAAA,MAAqDP,OAArD,GAA6FE,KAA7F,CAAqDF,OAArD;AAAA,MAA8DQ,KAA9D,GAA6FN,KAA7F,CAA8DM,KAA9D;AAAA,MAAqEC,KAArE,GAA6FP,KAA7F,CAAqEO,KAArE;AAAA,MAA+EC,SAA/E,4BAA6FR,KAA7F;;AACA,MAAMS,OAAO,GAAGhB,KAAK,CAACiB,MAAN,EAAhB;AAEA,MAAMC,YAAY,GAAGlB,KAAK,CAACmB,OAAN,CAAc,YAAM;AACvC,WAAO;AACLf,MAAAA,MAAM,EAAEY,OADH;AAELX,MAAAA,OAAO,EAAPA;AAFK,KAAP;AAID,GALoB,EAKlB,CAACW,OAAD,EAAUX,OAAV,CALkB,CAArB;AAOA,SACE,wCACMU,SADN;AAEE,IAAA,KAAK,kCACAD,KADA;AAEHL,MAAAA,KAAK,EAAEA,KAFJ;AAGHC,MAAAA,QAAQ,EAAEA,QAHP;AAIHC,MAAAA,QAAQ,EAAEA;AAJP,MAFP;AAQE,IAAA,GAAG,EAAEK,OARP;AASE,IAAA,SAAS,EAAEf,UAAU,CAAC,UAAD,EAAa;AAChC,0BAAoBW,MADY;AAEhC,yBAAmBC;AAFa,KAAb;AATvB,MAcE,oBAAC,eAAD,CAAiB,QAAjB;AAA0B,IAAA,KAAK,EAAEK;AAAjC,KACGL,KAAK,GAAG;AAAK,IAAA,SAAS,EAAC;AAAf,KAAuCL,QAAvC,CAAH,GAA4DA,QADpE,CAdF,CADF;AAoBD,CA/BM;AAiCPF,QAAQ,CAACc,YAAT,GAAwB;AACtBf,EAAAA,OAAO,EAAE;AADa,CAAxB","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport './SplitCol.css';\n\nexport interface SplitColContextProps {\n  colRef: React.RefObject<HTMLDivElement>;\n  animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n  colRef: null,\n  animate: true,\n});\n\nexport interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {\n  width?: string;\n  maxWidth?: string;\n  minWidth?: string;\n  /**\n   * Если false, то переходы между Panel происходят без анимации\n   */\n  animate?: boolean;\n  /**\n   * Если true, то добавляются боковые отступы фиксированной величины\n   */\n  spaced?: boolean;\n  fixed?: boolean;\n}\n\nexport const SplitCol: React.FC<SplitColProps> = (props: SplitColProps) => {\n  const { children, width, maxWidth, minWidth, spaced, animate, fixed, style, ...restProps } = props;\n  const baseRef = React.useRef<HTMLDivElement>();\n\n  const contextValue = React.useMemo(() => {\n    return {\n      colRef: baseRef,\n      animate,\n    };\n  }, [baseRef, animate]);\n\n  return (\n    <div\n      {...restProps}\n      style={{\n        ...style,\n        width: width,\n        maxWidth: maxWidth,\n        minWidth: minWidth,\n      }}\n      ref={baseRef}\n      vkuiClass={classNames('SplitCol', {\n        'SplitCol--spaced': spaced,\n        'SplitCol--fixed': fixed,\n      })}\n    >\n      <SplitColContext.Provider value={contextValue}>\n        {fixed ? <div vkuiClass=\"SplitCol__fixedInner\">{children}</div> : children}\n      </SplitColContext.Provider>\n    </div>\n  );\n};\n\nSplitCol.defaultProps = {\n  animate: false,\n};\n"],"file":"SplitCol.js"}
+{"version":3,"sources":["../../../src/components/SplitCol/SplitCol.tsx"],"names":["React","classNames","SplitColContext","createContext","colRef","animate","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","restProps","baseRef","useRef","contextValue","useMemo"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT;AAQA,OAAO,IAAMC,eAAe,gBAAGF,KAAK,CAACG,aAAN,CAA0C;AACvEC,EAAAA,MAAM,EAAE,IAD+D;AAEvEC,EAAAA,OAAO,EAAE;AAF8D,CAA1C,CAAxB;AAoBP,OAAO,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,CAACC,KAAD,EAA0B;AACzE,MAAQC,QAAR,GAAqGD,KAArG,CAAQC,QAAR;AAAA,MAAkBC,KAAlB,GAAqGF,KAArG,CAAkBE,KAAlB;AAAA,MAAyBC,QAAzB,GAAqGH,KAArG,CAAyBG,QAAzB;AAAA,MAAmCC,QAAnC,GAAqGJ,KAArG,CAAmCI,QAAnC;AAAA,MAA6CC,MAA7C,GAAqGL,KAArG,CAA6CK,MAA7C;AAAA,uBAAqGL,KAArG,CAAqDF,OAArD;AAAA,MAAqDA,OAArD,+BAA+D,KAA/D;AAAA,MAAsEQ,KAAtE,GAAqGN,KAArG,CAAsEM,KAAtE;AAAA,MAA6EC,KAA7E,GAAqGP,KAArG,CAA6EO,KAA7E;AAAA,MAAuFC,SAAvF,4BAAqGR,KAArG;;AACA,MAAMS,OAAO,GAAGhB,KAAK,CAACiB,MAAN,EAAhB;AAEA,MAAMC,YAAY,GAAGlB,KAAK,CAACmB,OAAN,CAAc,YAAM;AACvC,WAAO;AACLf,MAAAA,MAAM,EAAEY,OADH;AAELX,MAAAA,OAAO,EAAPA;AAFK,KAAP;AAID,GALoB,EAKlB,CAACW,OAAD,EAAUX,OAAV,CALkB,CAArB;AAOA,SACE,wCACMU,SADN;AAEE,IAAA,KAAK,kCACAD,KADA;AAEHL,MAAAA,KAAK,EAAEA,KAFJ;AAGHC,MAAAA,QAAQ,EAAEA,QAHP;AAIHC,MAAAA,QAAQ,EAAEA;AAJP,MAFP;AAQE,IAAA,GAAG,EAAEK,OARP;AASE,IAAA,SAAS,EAAEf,UAAU,CAAC,UAAD,EAAa;AAChC,0BAAoBW,MADY;AAEhC,yBAAmBC;AAFa,KAAb;AATvB,MAcE,oBAAC,eAAD,CAAiB,QAAjB;AAA0B,IAAA,KAAK,EAAEK;AAAjC,KACGL,KAAK,GAAG;AAAK,IAAA,SAAS,EAAC;AAAf,KAAuCL,QAAvC,CAAH,GAA4DA,QADpE,CAdF,CADF;AAoBD,CA/BM","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport './SplitCol.css';\n\nexport interface SplitColContextProps {\n  colRef: React.RefObject<HTMLDivElement>;\n  animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n  colRef: null,\n  animate: true,\n});\n\nexport interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {\n  width?: number | string;\n  maxWidth?: number | string;\n  minWidth?: number | string;\n  /**\n   * Если false, то переходы между Panel происходят без анимации\n   */\n  animate?: boolean;\n  /**\n   * Если true, то добавляются боковые отступы фиксированной величины\n   */\n  spaced?: boolean;\n  fixed?: boolean;\n}\n\nexport const SplitCol: React.FC<SplitColProps> = (props: SplitColProps) => {\n  const { children, width, maxWidth, minWidth, spaced, animate = false, fixed, style, ...restProps } = props;\n  const baseRef = React.useRef<HTMLDivElement>();\n\n  const contextValue = React.useMemo(() => {\n    return {\n      colRef: baseRef,\n      animate,\n    };\n  }, [baseRef, animate]);\n\n  return (\n    <div\n      {...restProps}\n      style={{\n        ...style,\n        width: width,\n        maxWidth: maxWidth,\n        minWidth: minWidth,\n      }}\n      ref={baseRef}\n      vkuiClass={classNames('SplitCol', {\n        'SplitCol--spaced': spaced,\n        'SplitCol--fixed': fixed,\n      })}\n    >\n      <SplitColContext.Provider value={contextValue}>\n        {fixed ? <div vkuiClass=\"SplitCol__fixedInner\">{children}</div> : children}\n      </SplitColContext.Provider>\n    </div>\n  );\n};\n"],"file":"SplitCol.js"}

package/dist/components/SubnavigationBar/SubnavigationBar.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
+import { HorizontalScrollProps } from '../HorizontalScroll/HorizontalScroll';
 import './SubnavigationBar.css';
-export interface SubnavigationBarProps extends React.HTMLAttributes<HTMLDivElement> {
+export interface SubnavigationBarProps extends React.HTMLAttributes<HTMLDivElement>, Pick<HorizontalScrollProps, 'showArrows' | 'getScrollToLeft' | 'getScrollToRight' | 'scrollAnimationDuration'> {
     mode?: 'fixed' | 'overflow';
 }
 export declare const SubnavigationBar: React.FC<SubnavigationBarProps>;

package/dist/components/SubnavigationBar/SubnavigationBar.js

@@ -1,28 +1,55 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["mode", "children"];
+var _excluded = ["mode", "children", "showArrows", "getScrollToLeft", "getScrollToRight", "scrollAnimationDuration"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import { usePlatform } from "../../hooks/usePlatform";
 import { classNames } from "../../lib/classNames";
 import { getClassName } from "../../helpers/getClassName";
 import HorizontalScroll from "../HorizontalScroll/HorizontalScroll";
-export var SubnavigationBar = function SubnavigationBar(props) {
+
+var defaultScrollToLeft = function defaultScrollToLeft(x) {
+  return x - 240;
+};
+
+var defaultScrollToRight = function defaultScrollToRight(x) {
+  return x + 240;
+};
+
+export var SubnavigationBar = function SubnavigationBar(_ref) {
+  var _ref$mode = _ref.mode,
+      mode = _ref$mode === void 0 ? 'overflow' : _ref$mode,
+      children = _ref.children,
+      _ref$showArrows = _ref.showArrows,
+      showArrows = _ref$showArrows === void 0 ? true : _ref$showArrows,
+      _ref$getScrollToLeft = _ref.getScrollToLeft,
+      getScrollToLeft = _ref$getScrollToLeft === void 0 ? defaultScrollToLeft : _ref$getScrollToLeft,
+      _ref$getScrollToRight = _ref.getScrollToRight,
+      getScrollToRight = _ref$getScrollToRight === void 0 ? defaultScrollToRight : _ref$getScrollToRight,
+      scrollAnimationDuration = _ref.scrollAnimationDuration,
+      restProps = _objectWithoutProperties(_ref, _excluded);
+
   var platform = usePlatform();
+  var ScrollWrapper;
+  var scrollWrapperProps = {};
 
-  var mode = props.mode,
-      children = props.children,
-      restProps = _objectWithoutProperties(props, _excluded);
+  if (mode === 'fixed') {
+    ScrollWrapper = 'div';
+  } else {
+    ScrollWrapper = HorizontalScroll;
+    scrollWrapperProps = {
+      showArrows: showArrows,
+      getScrollToLeft: getScrollToLeft,
+      getScrollToRight: getScrollToRight,
+      scrollAnimationDuration: scrollAnimationDuration
+    };
+  }
 
-  var ScrollWrapper = mode === 'fixed' ? 'div' : HorizontalScroll;
   return createScopedElement("div", _extends({}, restProps, {
     vkuiClass: classNames(getClassName('SubnavigationBar', platform), "SubnavigationBar--".concat(mode))
-  }), createScopedElement(ScrollWrapper, {
+  }), createScopedElement(ScrollWrapper, _extends({
     vkuiClass: "SubnavigationBar__in"
-  }, createScopedElement("div", {
+  }, scrollWrapperProps), createScopedElement("div", {
     vkuiClass: "SubnavigationBar__scrollIn"
   }, children)));
 };
-SubnavigationBar.defaultProps = {
-  mode: 'overflow'
-};
 //# sourceMappingURL=SubnavigationBar.js.map

package/dist/components/SubnavigationBar/SubnavigationBar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SubnavigationBar/SubnavigationBar.tsx"],"names":["usePlatform","classNames","getClassName","HorizontalScroll","SubnavigationBar","props","platform","mode","children","restProps","ScrollWrapper","defaultProps"],"mappings":";;;;AACA,SAASA,WAAT;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,gBAAP;AAOA,OAAO,IAAMC,gBAAiD,GAAG,SAApDA,gBAAoD,CAACC,KAAD,EAAkC;AACjG,MAAMC,QAAQ,GAAGN,WAAW,EAA5B;;AACA,MACEO,IADF,GAIIF,KAJJ,CACEE,IADF;AAAA,MAEEC,QAFF,GAIIH,KAJJ,CAEEG,QAFF;AAAA,MAGKC,SAHL,4BAIIJ,KAJJ;;AAMA,MAAMK,aAAa,GAAGH,IAAI,KAAK,OAAT,GAAmB,KAAnB,GAA2BJ,gBAAjD;AAEA,SACE,wCACMM,SADN;AAEE,IAAA,SAAS,EAAER,UAAU,CAACC,YAAY,CAAC,kBAAD,EAAqBI,QAArB,CAAb,8BAAkEC,IAAlE;AAFvB,MAIE,oBAAC,aAAD;AAAe,IAAA,SAAS,EAAC;AAAzB,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGC,QADH,CADF,CAJF,CADF;AAYD,CAtBM;AAwBPJ,gBAAgB,CAACO,YAAjB,GAAgC;AAC9BJ,EAAAA,IAAI,EAAE;AADwB,CAAhC","sourcesContent":["import * as React from 'react';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport HorizontalScroll from '../HorizontalScroll/HorizontalScroll';\nimport './SubnavigationBar.css';\n\nexport interface SubnavigationBarProps extends React.HTMLAttributes<HTMLDivElement> {\n  mode?: 'fixed' | 'overflow';\n}\n\nexport const SubnavigationBar: React.FC<SubnavigationBarProps> = (props: SubnavigationBarProps) => {\n  const platform = usePlatform();\n  const {\n    mode,\n    children,\n    ...restProps\n  } = props;\n\n  const ScrollWrapper = mode === 'fixed' ? 'div' : HorizontalScroll;\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(getClassName('SubnavigationBar', platform), `SubnavigationBar--${mode}`)}\n    >\n      <ScrollWrapper vkuiClass=\"SubnavigationBar__in\">\n        <div vkuiClass=\"SubnavigationBar__scrollIn\">\n          {children}\n        </div>\n      </ScrollWrapper>\n    </div>\n  );\n};\n\nSubnavigationBar.defaultProps = {\n  mode: 'overflow',\n};\n"],"file":"SubnavigationBar.js"}
+{"version":3,"sources":["../../../src/components/SubnavigationBar/SubnavigationBar.tsx"],"names":["usePlatform","classNames","getClassName","HorizontalScroll","defaultScrollToLeft","x","defaultScrollToRight","SubnavigationBar","mode","children","showArrows","getScrollToLeft","getScrollToRight","scrollAnimationDuration","restProps","platform","ScrollWrapper","scrollWrapperProps"],"mappings":";;;;AACA,SAASA,WAAT;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,gBAAP;;AASA,IAAMC,mBAA0C,GAAG,SAA7CA,mBAA6C,CAACC,CAAD;AAAA,SAAOA,CAAC,GAAG,GAAX;AAAA,CAAnD;;AAEA,IAAMC,oBAA2C,GAAG,SAA9CA,oBAA8C,CAACD,CAAD;AAAA,SAAOA,CAAC,GAAG,GAAX;AAAA,CAApD;;AAEA,OAAO,IAAME,gBAAiD,GAAG,SAApDA,gBAAoD,OAQpC;AAAA,uBAP3BC,IAO2B;AAAA,MAP3BA,IAO2B,0BAPpB,UAOoB;AAAA,MAN3BC,QAM2B,QAN3BA,QAM2B;AAAA,6BAL3BC,UAK2B;AAAA,MAL3BA,UAK2B,gCALd,IAKc;AAAA,kCAJ3BC,eAI2B;AAAA,MAJ3BA,eAI2B,qCAJTP,mBAIS;AAAA,mCAH3BQ,gBAG2B;AAAA,MAH3BA,gBAG2B,sCAHRN,oBAGQ;AAAA,MAF3BO,uBAE2B,QAF3BA,uBAE2B;AAAA,MADxBC,SACwB;;AAC3B,MAAMC,QAAQ,GAAGf,WAAW,EAA5B;AAEA,MAAIgB,aAAJ;AACA,MAAIC,kBAAkB,GAAG,EAAzB;;AAEA,MAAIT,IAAI,KAAK,OAAb,EAAsB;AACpBQ,IAAAA,aAAa,GAAG,KAAhB;AACD,GAFD,MAEO;AACLA,IAAAA,aAAa,GAAGb,gBAAhB;AACAc,IAAAA,kBAAkB,GAAG;AACnBP,MAAAA,UAAU,EAAVA,UADmB;AAEnBC,MAAAA,eAAe,EAAfA,eAFmB;AAGnBC,MAAAA,gBAAgB,EAAhBA,gBAHmB;AAInBC,MAAAA,uBAAuB,EAAvBA;AAJmB,KAArB;AAMD;;AAED,SACE,wCACMC,SADN;AAEE,IAAA,SAAS,EAAEb,UAAU,CAACC,YAAY,CAAC,kBAAD,EAAqBa,QAArB,CAAb,8BAAkEP,IAAlE;AAFvB,MAIE,oBAAC,aAAD;AAAe,IAAA,SAAS,EAAC;AAAzB,KAAoDS,kBAApD,GACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGR,QADH,CADF,CAJF,CADF;AAYD,CAtCM","sourcesContent":["import * as React from 'react';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport HorizontalScroll, { HorizontalScrollProps, ScrollPositionHandler } from '../HorizontalScroll/HorizontalScroll';\nimport './SubnavigationBar.css';\n\nexport interface SubnavigationBarProps extends\n  React.HTMLAttributes<HTMLDivElement>,\n  Pick<HorizontalScrollProps, 'showArrows' | 'getScrollToLeft' | 'getScrollToRight' | 'scrollAnimationDuration'> {\n  mode?: 'fixed' | 'overflow';\n}\n\nconst defaultScrollToLeft: ScrollPositionHandler = (x) => x - 240;\n\nconst defaultScrollToRight: ScrollPositionHandler = (x) => x + 240;\n\nexport const SubnavigationBar: React.FC<SubnavigationBarProps> = ({\n  mode = 'overflow',\n  children,\n  showArrows = true,\n  getScrollToLeft = defaultScrollToLeft,\n  getScrollToRight = defaultScrollToRight,\n  scrollAnimationDuration,\n  ...restProps\n}: SubnavigationBarProps) => {\n  const platform = usePlatform();\n\n  let ScrollWrapper: React.ElementType;\n  let scrollWrapperProps = {};\n\n  if (mode === 'fixed') {\n    ScrollWrapper = 'div';\n  } else {\n    ScrollWrapper = HorizontalScroll;\n    scrollWrapperProps = {\n      showArrows,\n      getScrollToLeft,\n      getScrollToRight,\n      scrollAnimationDuration,\n    };\n  }\n\n  return (\n    <div\n      {...restProps}\n      vkuiClass={classNames(getClassName('SubnavigationBar', platform), `SubnavigationBar--${mode}`)}\n    >\n      <ScrollWrapper vkuiClass=\"SubnavigationBar__in\" {...scrollWrapperProps}>\n        <div vkuiClass=\"SubnavigationBar__scrollIn\">\n          {children}\n        </div>\n      </ScrollWrapper>\n    </div>\n  );\n};\n"],"file":"SubnavigationBar.js"}

package/dist/components/SubnavigationButton/SubnavigationButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SubnavigationButton/SubnavigationButton.tsx"],"names":["classNames","getClassName","getTitleFromChildren","hasReactNode","Tappable","Icon16Dropdown","usePlatform","Caption","Subhead","SubnavigationButtonTypography","textLevel","restProps","SubnavigationButton","props","platform","size","selected","before","after","expandable","children","defaultProps"],"mappings":";;;;;AACA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,SAASC,oBAAT,EAA+BC,YAA/B;AACA,OAAOC,QAAP;AACA,SAASC,cAAT,QAA+B,kBAA/B;AACA,SAASC,WAAT;AACA,OAAOC,OAAP;AACA,OAAOC,OAAP;;AAyBA,IAAMC,6BAAoE,GAAG,SAAvEA,6BAAuE,OAA8D;AAAA,MAA3DC,SAA2D,QAA3DA,SAA2D;AAAA,MAA7CC,SAA6C;;AACzI,MAAID,SAAS,KAAK,CAAlB,EAAqB;AACnB,WAAO,oBAAC,OAAD;AAAS,MAAA,MAAM,EAAC;AAAhB,OAA8BC,SAA9B,EAAP;AACD;;AAED,SACE,oBAAC,OAAD;AACE,IAAA,KAAK,EAAED,SAAS,KAAK,CAAd,GAAkB,GAAlB,GAAwB,GADjC;AAEE,IAAA,MAAM,EAAC;AAFT,KAGMC,SAHN,EADF;AAOD,CAZD;;AAcA,OAAO,IAAMC,mBAAuD,GAAG,SAA1DA,mBAA0D,CAACC,KAAD,EAAqC;AAC1G,MAAMC,QAAQ,GAAGR,WAAW,EAA5B;;AACA,MACES,IADF,GASIF,KATJ,CACEE,IADF;AAAA,MAEEC,QAFF,GASIH,KATJ,CAEEG,QAFF;AAAA,MAGEN,SAHF,GASIG,KATJ,CAGEH,SAHF;AAAA,MAIEO,MAJF,GASIJ,KATJ,CAIEI,MAJF;AAAA,MAKEC,KALF,GASIL,KATJ,CAKEK,KALF;AAAA,MAMEC,UANF,GASIN,KATJ,CAMEM,UANF;AAAA,MAOEC,QAPF,GASIP,KATJ,CAOEO,QAPF;AAAA,MAQKT,SARL,4BASIE,KATJ;;AAWA,SACE,oBAAC,QAAD,eACMF,SADN;AAEE,IAAA,SAAS,EAAE,KAFb;AAGE,IAAA,gBAAgB,EAAC,SAHnB;AAIE,IAAA,SAAS,EAAEX,UAAU,CACnBC,YAAY,CAAC,qBAAD,EAAwBa,QAAxB,CADO,iCAEKC,IAFL,GAGnB;AACE,uCAAiCC;AADnC,KAHmB,CAJvB;AAWE,kBAAYd,oBAAoB,CAACkB,QAAD;AAXlC,MAaE;AAAM,IAAA,SAAS,EAAC;AAAhB,KACGjB,YAAY,CAACc,MAAD,CAAZ,IAAwB;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA+CA,MAA/C,CAD3B,EAEE,oBAAC,6BAAD;AACE,IAAA,SAAS,EAAEP,SADb;AAEE,IAAA,SAAS,EAAC,4BAFZ;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGU,QALH,CAFF,EASGjB,YAAY,CAACe,KAAD,CAAZ,IAAuB;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA8CA,KAA9C,CAT1B,EAUGC,UAAU,IAAI,oBAAC,cAAD;AAAgB,IAAA,SAAS,EAAC;AAA1B,IAVjB,CAbF,CADF;AA4BD,CAzCM;AA2CPP,mBAAmB,CAACS,YAApB,GAAmC;AACjCN,EAAAA,IAAI,EAAE,GAD2B;AAEjCL,EAAAA,SAAS,EAAE;AAFsB,CAAnC","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { getTitleFromChildren, hasReactNode } from '../../lib/utils';\nimport Tappable, { TappableProps } from '../Tappable/Tappable';\nimport { Icon16Dropdown } from '@vkontakte/icons';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport Caption from '../Typography/Caption/Caption';\nimport Subhead from '../Typography/Subhead/Subhead';\nimport './SubnavigationButton.css';\n\nexport interface SubnavigationButtonProps extends Omit<TappableProps, 'size'> {\n  size?: 'm' | 'l';\n  selected?: boolean;\n  /**\n   * Размер шрифта. Этим свойством рекомендуется пользоваться, чтобы отрегулировать размер шрифта у кнопок в `<SubnavigationBar mode=\"fixed\" />`\n   */\n  textLevel?: 1 | 2 | 3;\n  /**\n   * Рекомендуется использовать только иконки с размером 24\n   */\n  before?: React.ReactNode;\n  /**\n   * Рекомендуется использовать только `<Counter size=\"s\" />` или `<Badge />`\n   */\n  after?: React.ReactNode;\n  expandable?: boolean;\n}\n\ninterface SubnavButtonTypographyProps extends Pick<SubnavigationButtonProps, 'textLevel'> {\n  Component?: React.ElementType;\n}\n\nconst SubnavigationButtonTypography: React.FC<SubnavButtonTypographyProps> = ({ textLevel, ...restProps }: SubnavButtonTypographyProps) => {\n  if (textLevel === 1) {\n    return <Subhead weight=\"regular\" {...restProps} />;\n  }\n\n  return (\n    <Caption\n      level={textLevel === 2 ? '1' : '2'}\n      weight=\"regular\"\n      {...restProps}\n    />\n  );\n};\n\nexport const SubnavigationButton: React.FC<SubnavigationButtonProps> = (props: SubnavigationButtonProps) => {\n  const platform = usePlatform();\n  const {\n    size,\n    selected,\n    textLevel,\n    before,\n    after,\n    expandable,\n    children,\n    ...restProps\n  } = props;\n\n  return (\n    <Tappable\n      {...restProps}\n      hasActive={false}\n      focusVisibleMode=\"outside\"\n      vkuiClass={classNames(\n        getClassName('SubnavigationButton', platform),\n        `SubnavigationButton--${size}`,\n        {\n          'SubnavigationButton--selected': selected,\n        },\n      )}\n      aria-label={getTitleFromChildren(children)}\n    >\n      <span vkuiClass=\"SubnavigationButton__in\">\n        {hasReactNode(before) && <span vkuiClass=\"SubnavigationButton__before\">{before}</span>}\n        <SubnavigationButtonTypography\n          textLevel={textLevel}\n          vkuiClass=\"SubnavigationButton__label\"\n          Component=\"span\"\n        >\n          {children}\n        </SubnavigationButtonTypography>\n        {hasReactNode(after) && <span vkuiClass=\"SubnavigationButton__after\">{after}</span>}\n        {expandable && <Icon16Dropdown vkuiClass=\"SubnavigationButton__expandableIcon\" />}\n      </span>\n    </Tappable>\n  );\n};\n\nSubnavigationButton.defaultProps = {\n  size: 'm',\n  textLevel: 1,\n};\n"],"file":"SubnavigationButton.js"}
+{"version":3,"sources":["../../../src/components/SubnavigationButton/SubnavigationButton.tsx"],"names":["classNames","getClassName","getTitleFromChildren","hasReactNode","Tappable","Icon16Dropdown","usePlatform","Caption","Subhead","SubnavigationButtonTypography","textLevel","restProps","SubnavigationButton","props","platform","size","selected","before","after","expandable","children","defaultProps"],"mappings":";;;;;AAEA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,SAASC,oBAAT,EAA+BC,YAA/B;AACA,OAAOC,QAAP;AACA,SAASC,cAAT,QAA+B,kBAA/B;AACA,SAASC,WAAT;AACA,OAAOC,OAAP;AACA,OAAOC,OAAP;;AAuBA,IAAMC,6BAAoE,GAAG,SAAvEA,6BAAuE,OAA8D;AAAA,MAA3DC,SAA2D,QAA3DA,SAA2D;AAAA,MAA7CC,SAA6C;;AACzI,MAAID,SAAS,KAAK,CAAlB,EAAqB;AACnB,WAAO,oBAAC,OAAD;AAAS,MAAA,MAAM,EAAC;AAAhB,OAA8BC,SAA9B,EAAP;AACD;;AAED,SACE,oBAAC,OAAD;AACE,IAAA,KAAK,EAAED,SAAS,KAAK,CAAd,GAAkB,GAAlB,GAAwB,GADjC;AAEE,IAAA,MAAM,EAAC;AAFT,KAGMC,SAHN,EADF;AAOD,CAZD;;AAcA,OAAO,IAAMC,mBAAuD,GAAG,SAA1DA,mBAA0D,CAACC,KAAD,EAAqC;AAC1G,MAAMC,QAAQ,GAAGR,WAAW,EAA5B;;AACA,MACES,IADF,GASIF,KATJ,CACEE,IADF;AAAA,MAEEC,QAFF,GASIH,KATJ,CAEEG,QAFF;AAAA,MAGEN,SAHF,GASIG,KATJ,CAGEH,SAHF;AAAA,MAIEO,MAJF,GASIJ,KATJ,CAIEI,MAJF;AAAA,MAKEC,KALF,GASIL,KATJ,CAKEK,KALF;AAAA,MAMEC,UANF,GASIN,KATJ,CAMEM,UANF;AAAA,MAOEC,QAPF,GASIP,KATJ,CAOEO,QAPF;AAAA,MAQKT,SARL,4BASIE,KATJ;;AAWA,SACE,oBAAC,QAAD,eACMF,SADN;AAEE,IAAA,SAAS,EAAE,KAFb;AAGE,IAAA,gBAAgB,EAAC,SAHnB;AAIE,IAAA,SAAS,EAAEX,UAAU,CACnBC,YAAY,CAAC,qBAAD,EAAwBa,QAAxB,CADO,iCAEKC,IAFL,GAGnB;AACE,uCAAiCC;AADnC,KAHmB,CAJvB;AAWE,kBAAYd,oBAAoB,CAACkB,QAAD;AAXlC,MAaE;AAAM,IAAA,SAAS,EAAC;AAAhB,KACGjB,YAAY,CAACc,MAAD,CAAZ,IAAwB;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA+CA,MAA/C,CAD3B,EAEE,oBAAC,6BAAD;AACE,IAAA,SAAS,EAAEP,SADb;AAEE,IAAA,SAAS,EAAC,4BAFZ;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGU,QALH,CAFF,EASGjB,YAAY,CAACe,KAAD,CAAZ,IAAuB;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA8CA,KAA9C,CAT1B,EAUGC,UAAU,IAAI,oBAAC,cAAD;AAAgB,IAAA,SAAS,EAAC;AAA1B,IAVjB,CAbF,CADF;AA4BD,CAzCM;AA2CPP,mBAAmB,CAACS,YAApB,GAAmC;AACjCN,EAAAA,IAAI,EAAE,GAD2B;AAEjCL,EAAAA,SAAS,EAAE;AAFsB,CAAnC","sourcesContent":["import * as React from 'react';\nimport { HasComponent } from '../../types';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { getTitleFromChildren, hasReactNode } from '../../lib/utils';\nimport Tappable, { TappableProps } from '../Tappable/Tappable';\nimport { Icon16Dropdown } from '@vkontakte/icons';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport Caption from '../Typography/Caption/Caption';\nimport Subhead from '../Typography/Subhead/Subhead';\nimport './SubnavigationButton.css';\n\nexport interface SubnavigationButtonProps extends Omit<TappableProps, 'size'> {\n  size?: 'm' | 'l';\n  selected?: boolean;\n  /**\n   * Размер шрифта. Этим свойством рекомендуется пользоваться, чтобы отрегулировать размер шрифта у кнопок в `<SubnavigationBar mode=\"fixed\" />`\n   */\n  textLevel?: 1 | 2 | 3;\n  /**\n   * Рекомендуется использовать только иконки с размером 24\n   */\n  before?: React.ReactNode;\n  /**\n   * Рекомендуется использовать только `<Counter size=\"s\" />` или `<Badge />`\n   */\n  after?: React.ReactNode;\n  expandable?: boolean;\n}\n\ntype SubnavButtonTypographyProps = Pick<SubnavigationButtonProps, 'textLevel'> & HasComponent;\n\nconst SubnavigationButtonTypography: React.FC<SubnavButtonTypographyProps> = ({ textLevel, ...restProps }: SubnavButtonTypographyProps) => {\n  if (textLevel === 1) {\n    return <Subhead weight=\"regular\" {...restProps} />;\n  }\n\n  return (\n    <Caption\n      level={textLevel === 2 ? '1' : '2'}\n      weight=\"regular\"\n      {...restProps}\n    />\n  );\n};\n\nexport const SubnavigationButton: React.FC<SubnavigationButtonProps> = (props: SubnavigationButtonProps) => {\n  const platform = usePlatform();\n  const {\n    size,\n    selected,\n    textLevel,\n    before,\n    after,\n    expandable,\n    children,\n    ...restProps\n  } = props;\n\n  return (\n    <Tappable\n      {...restProps}\n      hasActive={false}\n      focusVisibleMode=\"outside\"\n      vkuiClass={classNames(\n        getClassName('SubnavigationButton', platform),\n        `SubnavigationButton--${size}`,\n        {\n          'SubnavigationButton--selected': selected,\n        },\n      )}\n      aria-label={getTitleFromChildren(children)}\n    >\n      <span vkuiClass=\"SubnavigationButton__in\">\n        {hasReactNode(before) && <span vkuiClass=\"SubnavigationButton__before\">{before}</span>}\n        <SubnavigationButtonTypography\n          textLevel={textLevel}\n          vkuiClass=\"SubnavigationButton__label\"\n          Component=\"span\"\n        >\n          {children}\n        </SubnavigationButtonTypography>\n        {hasReactNode(after) && <span vkuiClass=\"SubnavigationButton__after\">{after}</span>}\n        {expandable && <Icon16Dropdown vkuiClass=\"SubnavigationButton__expandableIcon\" />}\n      </span>\n    </Tappable>\n  );\n};\n\nSubnavigationButton.defaultProps = {\n  size: 'm',\n  textLevel: 1,\n};\n"],"file":"SubnavigationButton.js"}

package/dist/components/Switch/Switch.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { HasRef, HasRootRef } from '../../types';
-import { AdaptivityProps } from '../../hoc/withAdaptivity';
 import './Switch.css';
-export interface SwitchProps extends React.InputHTMLAttributes<HTMLInputElement>, HasRootRef<HTMLLabelElement>, HasRef<HTMLInputElement>, AdaptivityProps {
+export interface SwitchProps extends React.InputHTMLAttributes<HTMLInputElement>, HasRootRef<HTMLLabelElement>, HasRef<HTMLInputElement> {
 }
-export declare const Switch: React.FunctionComponent<SwitchProps>;
+export declare const Switch: React.FC<SwitchProps>;

package/dist/components/Switch/Switch.js

@@ -1,35 +1,42 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["style", "className", "getRef", "getRootRef", "sizeY"];
+var _excluded = ["style", "className", "getRef", "getRootRef"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import { getClassName } from "../../helpers/getClassName";
 import { classNames } from "../../lib/classNames";
 import { usePlatform } from "../../hooks/usePlatform";
-import { withAdaptivity } from "../../hoc/withAdaptivity";
+import { useAdaptivity } from "../../hooks/useAdaptivity";
 import { useExternRef } from "../../hooks/useExternRef";
-export var Switch = withAdaptivity(function (_ref) {
+import { FocusVisible } from "../FocusVisible/FocusVisible";
+;
+export var Switch = function Switch(_ref) {
   var style = _ref.style,
       className = _ref.className,
       getRef = _ref.getRef,
       getRootRef = _ref.getRootRef,
-      sizeY = _ref.sizeY,
       restProps = _objectWithoutProperties(_ref, _excluded);
 
   var platform = usePlatform();
+
+  var _useAdaptivity = useAdaptivity(),
+      sizeY = _useAdaptivity.sizeY;
+
   var inputRef = useExternRef(getRef);
   return createScopedElement("label", {
     vkuiClass: classNames(getClassName('Switch', platform), "Switch--sizeY-".concat(sizeY)),
     className: className,
     style: style,
-    ref: getRootRef
+    ref: getRootRef,
+    role: "presentation"
   }, createScopedElement("input", _extends({}, restProps, {
     type: "checkbox",
     vkuiClass: "Switch__self",
     ref: inputRef
   })), createScopedElement("span", {
+    role: "presentation",
     vkuiClass: "Switch__pseudo"
+  }), createScopedElement(FocusVisible, {
+    mode: "outside"
   }));
-}, {
-  sizeY: true
-});
+};
 //# sourceMappingURL=Switch.js.map

package/dist/components/Switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Switch/Switch.tsx"],"names":["getClassName","classNames","usePlatform","withAdaptivity","useExternRef","Switch","style","className","getRef","getRootRef","sizeY","restProps","platform","inputRef"],"mappings":";;;;AACA,SAASA,YAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AAEA,SAASC,cAAT;AACA,SAASC,YAAT;AASA,OAAO,IAAMC,MAA4C,GAAGF,cAAc,CAAC,gBAOxD;AAAA,MANjBG,KAMiB,QANjBA,KAMiB;AAAA,MALjBC,SAKiB,QALjBA,SAKiB;AAAA,MAJjBC,MAIiB,QAJjBA,MAIiB;AAAA,MAHjBC,UAGiB,QAHjBA,UAGiB;AAAA,MAFjBC,KAEiB,QAFjBA,KAEiB;AAAA,MADdC,SACc;;AACjB,MAAMC,QAAQ,GAAGV,WAAW,EAA5B;AACA,MAAMW,QAAQ,GAAGT,YAAY,CAACI,MAAD,CAA7B;AAEA,SACE;AAAO,IAAA,SAAS,EAAEP,UAAU,CAACD,YAAY,CAAC,QAAD,EAAWY,QAAX,CAAb,0BAAoDF,KAApD,EAA5B;AAA0F,IAAA,SAAS,EAAEH,SAArG;AAAgH,IAAA,KAAK,EAAED,KAAvH;AAA8H,IAAA,GAAG,EAAEG;AAAnI,KACE,0CAAWE,SAAX;AAAsB,IAAA,IAAI,EAAC,UAA3B;AAAsC,IAAA,SAAS,EAAC,cAAhD;AAA+D,IAAA,GAAG,EAAEE;AAApE,KADF,EAEE;AAAM,IAAA,SAAS,EAAC;AAAhB,IAFF,CADF;AAMD,CAjByE,EAiBvE;AAAEH,EAAAA,KAAK,EAAE;AAAT,CAjBuE,CAAnE","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { withAdaptivity, AdaptivityProps } from '../../hoc/withAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport './Switch.css';\n\nexport interface SwitchProps extends\n  React.InputHTMLAttributes<HTMLInputElement>,\n  HasRootRef<HTMLLabelElement>,\n  HasRef<HTMLInputElement>,\n  AdaptivityProps { }\n\nexport const Switch: React.FunctionComponent<SwitchProps> = withAdaptivity(({\n  style,\n  className,\n  getRef,\n  getRootRef,\n  sizeY,\n  ...restProps\n}: SwitchProps) => {\n  const platform = usePlatform();\n  const inputRef = useExternRef(getRef);\n\n  return (\n    <label vkuiClass={classNames(getClassName('Switch', platform), `Switch--sizeY-${sizeY}`)} className={className} style={style} ref={getRootRef}>\n      <input {...restProps} type=\"checkbox\" vkuiClass=\"Switch__self\" ref={inputRef} />\n      <span vkuiClass=\"Switch__pseudo\" />\n    </label>\n  );\n}, { sizeY: true });\n"],"file":"Switch.js"}
+{"version":3,"sources":["../../../src/components/Switch/Switch.tsx"],"names":["getClassName","classNames","usePlatform","useAdaptivity","useExternRef","FocusVisible","Switch","style","className","getRef","getRootRef","restProps","platform","sizeY","inputRef"],"mappings":";;;;AACA,SAASA,YAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AAEA,SAASC,aAAT;AACA,SAASC,YAAT;AACA,SAASC,YAAT;AAM6B;AAE7B,OAAO,IAAMC,MAA6B,GAAG,SAAhCA,MAAgC,OAM1B;AAAA,MALjBC,KAKiB,QALjBA,KAKiB;AAAA,MAJjBC,SAIiB,QAJjBA,SAIiB;AAAA,MAHjBC,MAGiB,QAHjBA,MAGiB;AAAA,MAFjBC,UAEiB,QAFjBA,UAEiB;AAAA,MADdC,SACc;;AACjB,MAAMC,QAAQ,GAAGV,WAAW,EAA5B;;AACA,uBAAkBC,aAAa,EAA/B;AAAA,MAAQU,KAAR,kBAAQA,KAAR;;AAEA,MAAMC,QAAQ,GAAGV,YAAY,CAACK,MAAD,CAA7B;AAEA,SACE;AACE,IAAA,SAAS,EAAER,UAAU,CAACD,YAAY,CAAC,QAAD,EAAWY,QAAX,CAAb,0BAAoDC,KAApD,EADvB;AAEE,IAAA,SAAS,EAAEL,SAFb;AAGE,IAAA,KAAK,EAAED,KAHT;AAIE,IAAA,GAAG,EAAEG,UAJP;AAKE,IAAA,IAAI,EAAC;AALP,KAOE,0CAAWC,SAAX;AAAsB,IAAA,IAAI,EAAC,UAA3B;AAAsC,IAAA,SAAS,EAAC,cAAhD;AAA+D,IAAA,GAAG,EAAEG;AAApE,KAPF,EAQE;AAAM,IAAA,IAAI,EAAC,cAAX;AAA0B,IAAA,SAAS,EAAC;AAApC,IARF,EASE,oBAAC,YAAD;AAAc,IAAA,IAAI,EAAC;AAAnB,IATF,CADF;AAaD,CAzBM","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { FocusVisible } from '../FocusVisible/FocusVisible';\nimport './Switch.css';\n\nexport interface SwitchProps extends\n  React.InputHTMLAttributes<HTMLInputElement>,\n  HasRootRef<HTMLLabelElement>,\n  HasRef<HTMLInputElement> {};\n\nexport const Switch: React.FC<SwitchProps> = ({\n  style,\n  className,\n  getRef,\n  getRootRef,\n  ...restProps\n}: SwitchProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n\n  const inputRef = useExternRef(getRef);\n\n  return (\n    <label\n      vkuiClass={classNames(getClassName('Switch', platform), `Switch--sizeY-${sizeY}`)}\n      className={className}\n      style={style}\n      ref={getRootRef}\n      role=\"presentation\"\n    >\n      <input {...restProps} type=\"checkbox\" vkuiClass=\"Switch__self\" ref={inputRef} />\n      <span role=\"presentation\" vkuiClass=\"Switch__pseudo\" />\n      <FocusVisible mode=\"outside\" />\n    </label>\n  );\n};\n"],"file":"Switch.js"}

package/dist/components/Tabbar/Tabbar.js

@@ -30,7 +30,9 @@ var Tabbar = function Tabbar(props) {
     vkuiClass: classNames(getClassName('Tabbar', platform), "Tabbar--l-".concat(getItemsLayout()), {
       'Tabbar--shadow': shadow
     })
-  }, restProps), children);
+  }, restProps), createScopedElement("div", {
+    vkuiClass: "Tabbar__in"
+  }, children));
 };
 
 Tabbar.defaultProps = {

package/dist/components/Tabbar/Tabbar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Tabbar/Tabbar.tsx"],"names":["React","getClassName","classNames","usePlatform","Tabbar","props","children","shadow","itemsLayout","restProps","platform","getItemsLayout","Children","count","defaultProps"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;;AAWA,IAAMC,MAA4C,GAAG,SAA/CA,MAA+C,CAACC,KAAD,EAAwB;AAC3E,MAAQC,QAAR,GAAwDD,KAAxD,CAAQC,QAAR;AAAA,MAAkBC,MAAlB,GAAwDF,KAAxD,CAAkBE,MAAlB;AAAA,MAA0BC,WAA1B,GAAwDH,KAAxD,CAA0BG,WAA1B;AAAA,MAA0CC,SAA1C,4BAAwDJ,KAAxD;;AACA,MAAMK,QAAQ,GAAGP,WAAW,EAA5B;;AAEA,MAAMQ,cAAc,GAAG,SAAjBA,cAAiB,GAAM;AAC3B,YAAQH,WAAR;AACE,WAAK,YAAL;AACA,WAAK,UAAL;AACE,eAAOA,WAAP;;AACF;AACE,eAAOR,KAAK,CAACY,QAAN,CAAeC,KAAf,CAAqBP,QAArB,IAAiC,CAAjC,GAAqC,UAArC,GAAkD,YAAzD;AALJ;AAOD,GARD;;AAUA,SACE;AACE,IAAA,SAAS,EAAEJ,UAAU,CAACD,YAAY,CAAC,QAAD,EAAWS,QAAX,CAAb,sBAAgDC,cAAc,EAA9D,GAAoE;AACvF,wBAAkBJ;AADqE,KAApE;AADvB,KAIME,SAJN,GAMGH,QANH,CADF;AAUD,CAxBD;;AA0BAF,MAAM,CAACU,YAAP,GAAsB;AACpBP,EAAAA,MAAM,EAAE;AADY,CAAtB;AAIA,eAAeH,MAAf","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './Tabbar.css';\n\nexport interface TabbarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Флаг для показа/скрытия верхней тени (Android) или границы (iOS)\n   */\n  shadow?: boolean;\n  itemsLayout?: 'vertical' | 'horizontal' | 'auto';\n}\n\nconst Tabbar: React.FunctionComponent<TabbarProps> = (props: TabbarProps) => {\n  const { children, shadow, itemsLayout, ...restProps } = props;\n  const platform = usePlatform();\n\n  const getItemsLayout = () => {\n    switch (itemsLayout) {\n      case 'horizontal':\n      case 'vertical':\n        return itemsLayout;\n      default:\n        return React.Children.count(children) > 2 ? 'vertical' : 'horizontal';\n    }\n  };\n\n  return (\n    <div\n      vkuiClass={classNames(getClassName('Tabbar', platform), `Tabbar--l-${getItemsLayout()}`, {\n        'Tabbar--shadow': shadow,\n      })}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n};\n\nTabbar.defaultProps = {\n  shadow: true,\n};\n\nexport default Tabbar;\n"],"file":"Tabbar.js"}
+{"version":3,"sources":["../../../src/components/Tabbar/Tabbar.tsx"],"names":["React","getClassName","classNames","usePlatform","Tabbar","props","children","shadow","itemsLayout","restProps","platform","getItemsLayout","Children","count","defaultProps"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;;AAWA,IAAMC,MAA4C,GAAG,SAA/CA,MAA+C,CAACC,KAAD,EAAwB;AAC3E,MAAQC,QAAR,GAAwDD,KAAxD,CAAQC,QAAR;AAAA,MAAkBC,MAAlB,GAAwDF,KAAxD,CAAkBE,MAAlB;AAAA,MAA0BC,WAA1B,GAAwDH,KAAxD,CAA0BG,WAA1B;AAAA,MAA0CC,SAA1C,4BAAwDJ,KAAxD;;AACA,MAAMK,QAAQ,GAAGP,WAAW,EAA5B;;AAEA,MAAMQ,cAAc,GAAG,SAAjBA,cAAiB,GAAM;AAC3B,YAAQH,WAAR;AACE,WAAK,YAAL;AACA,WAAK,UAAL;AACE,eAAOA,WAAP;;AACF;AACE,eAAOR,KAAK,CAACY,QAAN,CAAeC,KAAf,CAAqBP,QAArB,IAAiC,CAAjC,GAAqC,UAArC,GAAkD,YAAzD;AALJ;AAOD,GARD;;AAUA,SACE;AACE,IAAA,SAAS,EAAEJ,UAAU,CAACD,YAAY,CAAC,QAAD,EAAWS,QAAX,CAAb,sBAAgDC,cAAc,EAA9D,GAAoE;AACvF,wBAAkBJ;AADqE,KAApE;AADvB,KAIME,SAJN,GAME;AAAK,IAAA,SAAS,EAAC;AAAf,KACGH,QADH,CANF,CADF;AAYD,CA1BD;;AA4BAF,MAAM,CAACU,YAAP,GAAsB;AACpBP,EAAAA,MAAM,EAAE;AADY,CAAtB;AAIA,eAAeH,MAAf","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './Tabbar.css';\n\nexport interface TabbarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Флаг для показа/скрытия верхней тени (Android) или границы (iOS)\n   */\n  shadow?: boolean;\n  itemsLayout?: 'vertical' | 'horizontal' | 'auto';\n}\n\nconst Tabbar: React.FunctionComponent<TabbarProps> = (props: TabbarProps) => {\n  const { children, shadow, itemsLayout, ...restProps } = props;\n  const platform = usePlatform();\n\n  const getItemsLayout = () => {\n    switch (itemsLayout) {\n      case 'horizontal':\n      case 'vertical':\n        return itemsLayout;\n      default:\n        return React.Children.count(children) > 2 ? 'vertical' : 'horizontal';\n    }\n  };\n\n  return (\n    <div\n      vkuiClass={classNames(getClassName('Tabbar', platform), `Tabbar--l-${getItemsLayout()}`, {\n        'Tabbar--shadow': shadow,\n      })}\n      {...restProps}\n    >\n      <div vkuiClass=\"Tabbar__in\">\n        {children}\n      </div>\n    </div>\n  );\n};\n\nTabbar.defaultProps = {\n  shadow: true,\n};\n\nexport default Tabbar;\n"],"file":"Tabbar.js"}

package/dist/components/TabbarItem/TabbarItem.d.ts

@@ -1,6 +1,8 @@
 import * as React from 'react';
+import { HasComponent, HasRootRef } from '../../types';
 import './TabbarItem.css';
-export interface TabbarItemProps extends React.HTMLAttributes<HTMLElement>, React.AnchorHTMLAttributes<HTMLElement> {
+export interface TabbarItemProps extends Omit<React.AllHTMLAttributes<HTMLElement>, 'label'>, // TODO убрать Omit после удаления свойства label
+HasRootRef<HTMLElement>, HasComponent {
     selected?: boolean;
     /**
      * Тест рядом с иконкой

package/dist/components/TabbarItem/TabbarItem.js

@@ -1,28 +1,44 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["children", "selected", "label", "indicator", "text"];
+var _excluded = ["children", "selected", "label", "indicator", "text", "href", "Component", "disabled"];
 import { createScopedElement } from "../../lib/jsxRuntime";
 import { getClassName } from "../../helpers/getClassName";
 import Counter from "../Counter/Counter";
 import { classNames } from "../../lib/classNames";
 import { usePlatform } from "../../hooks/usePlatform";
 import { hasReactNode } from "../../lib/utils";
+import Tappable from "../Tappable/Tappable";
+import { Platform } from "../../lib/platform";
 
-var TabbarItem = function TabbarItem(props) {
-  var children = props.children,
-      selected = props.selected,
-      label = props.label,
-      indicator = props.indicator,
-      text = props.text,
-      restProps = _objectWithoutProperties(props, _excluded);
+var TabbarItem = function TabbarItem(_ref) {
+  var children = _ref.children,
+      selected = _ref.selected,
+      label = _ref.label,
+      indicator = _ref.indicator,
+      text = _ref.text,
+      href = _ref.href,
+      _ref$Component = _ref.Component,
+      Component = _ref$Component === void 0 ? href ? 'a' : 'button' : _ref$Component,
+      disabled = _ref.disabled,
+      restProps = _objectWithoutProperties(_ref, _excluded);
+
+  var platform = usePlatform(); // @ts-ignore ругается на то, что у AllHTMLAttributes type это строка, а button не любую строку считает валидным значением
 
-  var platform = usePlatform();
-  var Component = restProps.href ? 'a' : 'div';
   return createScopedElement(Component, _extends({}, restProps, {
+    disabled: disabled,
+    href: href,
     vkuiClass: classNames(getClassName('TabbarItem', platform), {
       'TabbarItem--selected': selected,
       'TabbarItem--text': !!text
     })
+  }), createScopedElement(Tappable, {
+    role: "presentation",
+    Component: "div",
+    disabled: disabled,
+    activeMode: platform === Platform.IOS ? 'TabbarItem__tappable--active' : 'background',
+    activeEffectDelay: platform === Platform.IOS ? 0 : 300,
+    hasHover: false,
+    vkuiClass: "TabbarItem__tappable"
   }), createScopedElement("div", {
     vkuiClass: "TabbarItem__in"
   }, createScopedElement("div", {

package/dist/components/TabbarItem/TabbarItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/TabbarItem/TabbarItem.tsx"],"names":["getClassName","Counter","classNames","usePlatform","hasReactNode","TabbarItem","props","children","selected","label","indicator","text","restProps","platform","Component","href"],"mappings":";;;;AACA,SAASA,YAAT;AACA,OAAOC,OAAP;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;;AAmBA,IAAMC,UAAoD,GAAG,SAAvDA,UAAuD,CAACC,KAAD,EAA4B;AACvF,MAAQC,QAAR,GAAqED,KAArE,CAAQC,QAAR;AAAA,MAAkBC,QAAlB,GAAqEF,KAArE,CAAkBE,QAAlB;AAAA,MAA4BC,KAA5B,GAAqEH,KAArE,CAA4BG,KAA5B;AAAA,MAAmCC,SAAnC,GAAqEJ,KAArE,CAAmCI,SAAnC;AAAA,MAA8CC,IAA9C,GAAqEL,KAArE,CAA8CK,IAA9C;AAAA,MAAuDC,SAAvD,4BAAqEN,KAArE;;AACA,MAAMO,QAAQ,GAAGV,WAAW,EAA5B;AACA,MAAMW,SAA4B,GAAGF,SAAS,CAACG,IAAV,GAAiB,GAAjB,GAAuB,KAA5D;AAEA,SACE,oBAAC,SAAD,eACMH,SADN;AAEE,IAAA,SAAS,EAAEV,UAAU,CAACF,YAAY,CAAC,YAAD,EAAea,QAAf,CAAb,EAAuC;AAC1D,8BAAwBL,QADkC;AAE1D,0BAAoB,CAAC,CAACG;AAFoC,KAAvC;AAFvB,MAOE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGJ,QADH,EAEE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGH,YAAY,CAACM,SAAD,CAAZ,IAA2BA,SAD9B,EAEG,CAACA,SAAD,IAAcD,KAAd,IAAuB,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAC,GAAd;AAAkB,IAAA,IAAI,EAAC;AAAvB,KAAoCA,KAApC,CAF1B,CAFF,CADF,EAQGE,IAAI,IAAI;AAAK,IAAA,SAAS,EAAC;AAAf,KAAmCA,IAAnC,CARX,CAPF,CADF;AAoBD,CAzBD;;AA2BA,eAAeN,UAAf","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport Counter from '../Counter/Counter';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasReactNode } from '../../lib/utils';\nimport './TabbarItem.css';\n\nexport interface TabbarItemProps extends React.HTMLAttributes<HTMLElement>, React.AnchorHTMLAttributes<HTMLElement> {\n  selected?: boolean;\n  /**\n   * Тест рядом с иконкой\n   */\n  text?: React.ReactNode;\n  /**\n   * Индикатор над иконкой. Принимает `<Badge mode=\"prominent\" />` или `<Counter size=\"s\" mode=\"prominent\" />`\n   */\n  indicator?: React.ReactNode;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте `indicator`\n   */\n  label?: React.ReactNode;\n}\n\nconst TabbarItem: React.FunctionComponent<TabbarItemProps> = (props: TabbarItemProps) => {\n  const { children, selected, label, indicator, text, ...restProps } = props;\n  const platform = usePlatform();\n  const Component: React.ElementType = restProps.href ? 'a' : 'div';\n\n  return (\n    <Component\n      {...restProps}\n      vkuiClass={classNames(getClassName('TabbarItem', platform), {\n        'TabbarItem--selected': selected,\n        'TabbarItem--text': !!text,\n      })}\n    >\n      <div vkuiClass=\"TabbarItem__in\">\n        <div vkuiClass=\"TabbarItem__icon\">\n          {children}\n          <div vkuiClass=\"TabbarItem__label\">\n            {hasReactNode(indicator) && indicator}\n            {!indicator && label && <Counter size=\"s\" mode=\"prominent\">{label}</Counter>}\n          </div>\n        </div>\n        {text && <div vkuiClass=\"TabbarItem__text\">{text}</div>}\n      </div>\n    </Component>\n  );\n};\n\nexport default TabbarItem;\n"],"file":"TabbarItem.js"}
+{"version":3,"sources":["../../../src/components/TabbarItem/TabbarItem.tsx"],"names":["getClassName","Counter","classNames","usePlatform","hasReactNode","Tappable","Platform","TabbarItem","children","selected","label","indicator","text","href","Component","disabled","restProps","platform","IOS"],"mappings":";;;;AACA,SAASA,YAAT;AACA,OAAOC,OAAP;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,QAAT;;AAuBA,IAAMC,UAAoD,GAAG,SAAvDA,UAAuD,OAUtC;AAAA,MATrBC,QASqB,QATrBA,QASqB;AAAA,MARrBC,QAQqB,QARrBA,QAQqB;AAAA,MAPrBC,KAOqB,QAPrBA,KAOqB;AAAA,MANrBC,SAMqB,QANrBA,SAMqB;AAAA,MALrBC,IAKqB,QALrBA,IAKqB;AAAA,MAJrBC,IAIqB,QAJrBA,IAIqB;AAAA,4BAHrBC,SAGqB;AAAA,MAHrBA,SAGqB,+BAHTD,IAAI,GAAG,GAAH,GAAS,QAGJ;AAAA,MAFrBE,QAEqB,QAFrBA,QAEqB;AAAA,MADlBC,SACkB;;AACrB,MAAMC,QAAQ,GAAGd,WAAW,EAA5B,CADqB,CAGrB;;AACA,SAAQ,oBAAC,SAAD,eACFa,SADE;AAEN,IAAA,QAAQ,EAAED,QAFJ;AAGN,IAAA,IAAI,EAAEF,IAHA;AAIN,IAAA,SAAS,EAAEX,UAAU,CAACF,YAAY,CAAC,YAAD,EAAeiB,QAAf,CAAb,EAAuC;AAC1D,8BAAwBR,QADkC;AAE1D,0BAAoB,CAAC,CAACG;AAFoC,KAAvC;AAJf,MASN,oBAAC,QAAD;AACE,IAAA,IAAI,EAAC,cADP;AAEE,IAAA,SAAS,EAAC,KAFZ;AAGE,IAAA,QAAQ,EAAEG,QAHZ;AAIE,IAAA,UAAU,EAAEE,QAAQ,KAAKX,QAAQ,CAACY,GAAtB,GAA4B,8BAA5B,GAA6D,YAJ3E;AAKE,IAAA,iBAAiB,EAAED,QAAQ,KAAKX,QAAQ,CAACY,GAAtB,GAA4B,CAA5B,GAAgC,GALrD;AAME,IAAA,QAAQ,EAAE,KANZ;AAOE,IAAA,SAAS,EAAC;AAPZ,IATM,EAkBN;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGV,QADH,EAEE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGJ,YAAY,CAACO,SAAD,CAAZ,IAA2BA,SAD9B,EAEG,CAACA,SAAD,IAAcD,KAAd,IAAuB,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAC,GAAd;AAAkB,IAAA,IAAI,EAAC;AAAvB,KAAoCA,KAApC,CAF1B,CAFF,CADF,EAQGE,IAAI,IAAI;AAAK,IAAA,SAAS,EAAC;AAAf,KAAmCA,IAAnC,CARX,CAlBM,CAAR;AA6BD,CA3CD;;AA6CA,eAAeL,UAAf","sourcesContent":["import * as React from 'react';\nimport { getClassName } from '../../helpers/getClassName';\nimport Counter from '../Counter/Counter';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasReactNode } from '../../lib/utils';\nimport Tappable from '../Tappable/Tappable';\nimport { Platform } from '../../lib/platform';\nimport { HasComponent, HasRootRef } from '../../types';\nimport './TabbarItem.css';\n\nexport interface TabbarItemProps extends\n  Omit<React.AllHTMLAttributes<HTMLElement>, 'label'>, // TODO убрать Omit после удаления свойства label\n  HasRootRef<HTMLElement>,\n  HasComponent {\n  selected?: boolean;\n  /**\n   * Тест рядом с иконкой\n   */\n  text?: React.ReactNode;\n  /**\n   * Индикатор над иконкой. Принимает `<Badge mode=\"prominent\" />` или `<Counter size=\"s\" mode=\"prominent\" />`\n   */\n  indicator?: React.ReactNode;\n  /**\n   * @deprecated будет удалено в 5.0.0. Используйте `indicator`\n   */\n  label?: React.ReactNode;\n}\n\nconst TabbarItem: React.FunctionComponent<TabbarItemProps> = ({\n  children,\n  selected,\n  label,\n  indicator,\n  text,\n  href,\n  Component = href ? 'a' : 'button',\n  disabled,\n  ...restProps\n}: TabbarItemProps) => {\n  const platform = usePlatform();\n\n  // @ts-ignore ругается на то, что у AllHTMLAttributes type это строка, а button не любую строку считает валидным значением\n  return (<Component\n    {...restProps}\n    disabled={disabled}\n    href={href}\n    vkuiClass={classNames(getClassName('TabbarItem', platform), {\n      'TabbarItem--selected': selected,\n      'TabbarItem--text': !!text,\n    })}\n  >\n    <Tappable\n      role=\"presentation\"\n      Component=\"div\"\n      disabled={disabled}\n      activeMode={platform === Platform.IOS ? 'TabbarItem__tappable--active' : 'background'}\n      activeEffectDelay={platform === Platform.IOS ? 0 : 300}\n      hasHover={false}\n      vkuiClass=\"TabbarItem__tappable\"\n    />\n    <div vkuiClass=\"TabbarItem__in\">\n      <div vkuiClass=\"TabbarItem__icon\">\n        {children}\n        <div vkuiClass=\"TabbarItem__label\">\n          {hasReactNode(indicator) && indicator}\n          {!indicator && label && <Counter size=\"s\" mode=\"prominent\">{label}</Counter>}\n        </div>\n      </div>\n      {text && <div vkuiClass=\"TabbarItem__text\">{text}</div>}\n    </div>\n  </Component>);\n};\n\nexport default TabbarItem;\n"],"file":"TabbarItem.js"}

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

@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { TouchProps } from '../Touch/Touch';
-import { HasRootRef } from '../../types';
+import { HasComponent, HasRootRef } from '../../types';
 import { AdaptivityProps } from '../../hoc/withAdaptivity';
 import { FocusVisibleMode } from '../FocusVisible/FocusVisible';
 import './Tappable.css';
-export interface TappableProps extends React.AllHTMLAttributes<HTMLElement>, HasRootRef<HTMLElement>, AdaptivityProps {
-    Component?: React.ElementType;
+export interface TappableProps extends React.AllHTMLAttributes<HTMLElement>, HasRootRef<HTMLElement>, AdaptivityProps, HasComponent {
     /**
      * Длительность показа active-состояния
      */

package/dist/components/Tappable/Tappable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Tappable/Tappable.tsx"],"names":["React","mitt","hasHover","deviceHasHover","noop","Touch","TouchRootContext","classNames","getClassName","ANDROID","getOffsetRect","coordX","coordY","withAdaptivity","shouldTriggerClickOnEnterOrSpace","useIsomorphicLayoutEffect","FocusVisible","useTimeout","useExternRef","usePlatform","ACTIVE_DELAY","ACTIVE_EFFECT_DELAY","activeBus","TapState","none","pending","active","exiting","TappableContext","createContext","onHoverChange","useActivity","hasActive","stopDelay","id","useMemo","Math","round","random","toString","useState","activity","setActivity","_stop","start","delayStart","activeTimeout","stopTimeout","set","clear","emit","onActiveChange","activeId","on","off","stop","delay","Tappable","children","Component","onClick","_onKeyDown","onKeyDown","activeEffectDelay","stopPropagation","getRootRef","sizeX","hasMouse","_hasHover","hoverMode","_hasActive","activeMode","focusVisibleMode","props","href","useContext","insideTouchRoot","platform","clicks","setClicks","childHover","setChildHover","_hovered","setHovered","hovered","disabled","isCustomElement","contentEditable","isPresetHoverMode","includes","isPresetActiveMode","containerRef","childContext","useRef","current","e","preventDefault","click","onStart","originalEvent","touches","length","top","left","x","y","Date","now","onMove","isSlide","onEnd","duration","activeDuraion","classes","handlers","role","undefined","map","wave","filter","c","Wave","onClear","timeout","useEffect"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport mitt from 'mitt';\nimport { hasHover as deviceHasHover, noop } from '@vkontakte/vkjs';\nimport { Touch, TouchEvent, TouchProps } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { ANDROID } from '../../lib/platform';\nimport { getOffsetRect } from '../../lib/offset';\nimport { coordX, coordY } from '../../lib/touch';\nimport { HasRootRef } from '../../types';\nimport { withAdaptivity, AdaptivityProps } from '../../hoc/withAdaptivity';\nimport { shouldTriggerClickOnEnterOrSpace } from '../../lib/accessibility';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { FocusVisible, FocusVisibleMode } from '../FocusVisible/FocusVisible';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './Tappable.css';\n\nexport interface TappableProps extends React.AllHTMLAttributes<HTMLElement>, HasRootRef<HTMLElement>, AdaptivityProps {\n  Component?: React.ElementType;\n  /**\n   * Длительность показа active-состояния\n   */\n  activeEffectDelay?: number;\n  stopPropagation?: boolean;\n  /**\n   * Указывает, должен ли компонент реагировать на hover-состояние\n   */\n  hasHover?: boolean;\n  /**\n   * Указывает, должен ли компонент реагировать на active-состояние\n   */\n  hasActive?: boolean;\n  /**\n   * Стиль подсветки active-состояния. Если передать произвольную строку, она добавится как css-класс во время active\n   */\n  activeMode?: 'opacity' | 'background' | string;\n  /**\n   * Стиль подсветки hover-состояния. Если передать произвольную строку, она добавится как css-класс во время hover\n   */\n  hoverMode?: 'opacity' | 'background' | string;\n  /**\n   * Стиль аутлайна focus visible.\n   */\n  focusVisibleMode?: FocusVisibleMode;\n}\n\ninterface Wave {\n  x: number;\n  y: number;\n  id: string;\n}\n\nexport interface RootComponentProps extends TouchProps {\n  ref?: React.Ref<HTMLElement>;\n}\n\nexport const ACTIVE_DELAY = 70;\nexport const ACTIVE_EFFECT_DELAY = 600;\n\nconst activeBus = mitt<{ active: string }>();\nconst TapState = { none: 0, pending: 1, active: 2, exiting: 3 } as const;\n\ntype TappableContextInterface = { onHoverChange: (s: boolean) => void };\nconst TappableContext = React.createContext<TappableContextInterface>({ onHoverChange: noop });\n\nfunction useActivity(hasActive: boolean, stopDelay: number) {\n  const id = React.useMemo(() => Math.round(Math.random() * 1e8).toString(16), []);\n\n  const [activity, setActivity] = React.useState<typeof TapState[keyof typeof TapState]>(TapState.none);\n  const _stop = () => setActivity(TapState.none);\n  const start = () => hasActive && setActivity(TapState.active);\n  const delayStart = () => {\n    hasActive && setActivity(TapState.pending);\n  };\n\n  const activeTimeout = useTimeout(start, ACTIVE_DELAY);\n  const stopTimeout = useTimeout(_stop, stopDelay);\n\n  useIsomorphicLayoutEffect(() => {\n    if (activity === TapState.pending) {\n      activeTimeout.set();\n      return activeTimeout.clear;\n    }\n    if (activity === TapState.exiting) {\n      return stopTimeout.clear;\n    }\n    if (activity === TapState.active) {\n      activeBus.emit('active', id);\n    }\n    return noop;\n  }, [activity]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (activity === TapState.none) {\n      return noop;\n    }\n    const onActiveChange = (activeId: string) => {\n      activeId !== id && _stop();\n    };\n    activeBus.on('active', onActiveChange);\n    return () => activeBus.off('active', onActiveChange);\n  }, [activity === TapState.none]);\n\n  useIsomorphicLayoutEffect(() => {\n    !hasActive && _stop();\n  }, [hasActive]);\n\n  const stop = (delay?: number) => {\n    if (delay) {\n      setActivity(TapState.exiting);\n      return stopTimeout.set(delay);\n    }\n    _stop();\n  };\n\n  return [activity, { delayStart, start, stop }] as const;\n}\n\nconst Tappable: React.FC<TappableProps> = ({\n  children,\n  Component,\n  onClick,\n  onKeyDown: _onKeyDown,\n  activeEffectDelay = ACTIVE_EFFECT_DELAY,\n  stopPropagation = false,\n  getRootRef,\n  sizeX,\n  hasMouse,\n  hasHover: _hasHover = deviceHasHover,\n  hoverMode = 'background',\n  hasActive: _hasActive = true,\n  activeMode = 'background',\n  focusVisibleMode = 'inside',\n  ...props\n}: TappableProps) => {\n  Component = Component || (props.href ? 'a' : 'div') as React.ElementType;\n\n  const { onHoverChange } = React.useContext(TappableContext);\n  const insideTouchRoot = React.useContext(TouchRootContext);\n  const platform = usePlatform();\n\n  const [clicks, setClicks] = React.useState<Wave[]>([]);\n  const [childHover, setChildHover] = React.useState(false);\n  const [_hovered, setHovered] = React.useState(false);\n\n  const hovered = _hovered && !props.disabled;\n  const hasActive = _hasActive && !childHover && !props.disabled;\n  const hasHover = _hasHover && !childHover;\n  const isCustomElement = Component !== 'a' && Component !== 'button' && !props.contentEditable;\n  const isPresetHoverMode = ['opacity', 'background'].includes(hoverMode);\n  const isPresetActiveMode = ['opacity', 'background'].includes(activeMode);\n\n  const [activity, { start, stop, delayStart }] = useActivity(hasActive, activeEffectDelay);\n  const active = activity === TapState.active || activity === TapState.exiting;\n\n  const containerRef = useExternRef(getRootRef);\n\n  // hover propagation\n  const childContext = React.useRef({ onHoverChange: setChildHover }).current;\n  useIsomorphicLayoutEffect(() => {\n    if (!hovered) {\n      return noop;\n    }\n    onHoverChange(true);\n    return () => onHoverChange(false);\n  }, [hovered]);\n\n  /*\n   * [a11y]\n   * Обрабатывает событие onkeydown\n   * для кастомных доступных элементов:\n   * - role=\"link\" (активация по Enter)\n   * - role=\"button\" (активация по Space и Enter)\n   */\n  function onKeyDown(e: React.KeyboardEvent<HTMLElement>) {\n    if (isCustomElement && shouldTriggerClickOnEnterOrSpace(e)) {\n      e.preventDefault();\n      containerRef.current.click();\n    }\n\n    if (typeof _onKeyDown === 'function') {\n      return _onKeyDown(e);\n    }\n  }\n\n  function onStart({ originalEvent }: TouchEvent) {\n    if (hasActive) {\n      if (originalEvent.touches && originalEvent.touches.length > 1) {\n        // r сожалению я так и не понял, что это делает и можно ли упихнуть его в Touch\n        return stop();\n      }\n\n      if (platform === ANDROID) {\n        const { top, left } = getOffsetRect(containerRef.current);\n        const x = coordX(originalEvent) - left;\n        const y = coordY(originalEvent) - top;\n        setClicks([...clicks, { x, y, id: Date.now().toString() }]);\n      }\n\n      delayStart();\n    }\n  }\n\n  function onMove({ isSlide }: TouchEvent) {\n    if (isSlide) {\n      stop();\n    }\n  }\n\n  function onEnd({ duration }: TouchEvent) {\n    if (activity === TapState.none) {\n      return;\n    }\n    if (activity === TapState.pending) {\n      // активировать при коротком тапе\n      start();\n    }\n\n    // отключить без задержки при длинном тапе\n    const activeDuraion = duration - ACTIVE_DELAY;\n    stop(activeDuraion >= 100 ? 0 : activeEffectDelay - activeDuraion);\n  }\n\n  const classes = classNames(\n    getClassName('Tappable', platform),\n    `Tappable--sizeX-${sizeX}`,\n    {\n      'Tappable--active': hasActive && active,\n      'Tappable--mouse': hasMouse,\n      [`Tappable--hover-${hoverMode}`]: hasHover && hovered && isPresetHoverMode,\n      [`Tappable--active-${activeMode}`]: hasActive && active && isPresetActiveMode,\n      [hoverMode]: hasHover && hovered && !isPresetHoverMode,\n      [activeMode]: hasActive && active && !isPresetActiveMode,\n    });\n\n  const handlers: RootComponentProps = { onStart, onMove, onEnd, onClick, onKeyDown };\n  const role = props.href ? 'link' : 'button';\n\n  return (\n    <Touch\n      onEnter={() => setHovered(true)}\n      onLeave={() => setHovered(false)}\n      type={Component === 'button' ? 'button' : undefined}\n      tabIndex={isCustomElement && !props.disabled ? 0 : undefined}\n      role={isCustomElement ? role : undefined}\n      aria-disabled={isCustomElement ? props.disabled : null}\n      stopPropagation={stopPropagation && !insideTouchRoot && !props.disabled}\n      {...props}\n      slideThreshold={20}\n      usePointerHover\n      vkuiClass={classes}\n      Component={Component}\n      getRootRef={containerRef}\n      {...(props.disabled ? {} : handlers)}>\n      <TappableContext.Provider value={childContext}>\n        {children}\n      </TappableContext.Provider>\n      {platform === ANDROID && !hasMouse && hasActive && activeMode === 'background' && (\n        <span aria-hidden=\"true\" vkuiClass=\"Tappable__waves\">\n          {clicks.map((wave) => (\n            <Wave {...wave} key={wave.id} onClear={() => setClicks(clicks.filter((c) => c.id !== wave.id))} />\n          ))}\n        </span>\n      )}\n      {hasHover && hoverMode === 'background' && <span aria-hidden=\"true\" vkuiClass=\"Tappable__hoverShadow\" />}\n      {!props.disabled && <FocusVisible mode={focusVisibleMode} />}\n    </Touch>\n  );\n};\n\nexport default withAdaptivity(Tappable, { sizeX: true, hasMouse: true });\n\nfunction Wave({ x, y, onClear }: Wave & { onClear: VoidFunction }) {\n  const timeout = useTimeout(onClear, 225);\n  React.useEffect(() => timeout.set(), []);\n  return <span vkuiClass=\"Tappable__wave\" style={{ top: y, left: x }} />;\n}\n"],"file":"Tappable.js"}
+{"version":3,"sources":["../../../src/components/Tappable/Tappable.tsx"],"names":["React","mitt","hasHover","deviceHasHover","noop","Touch","TouchRootContext","classNames","getClassName","ANDROID","getOffsetRect","coordX","coordY","withAdaptivity","shouldTriggerClickOnEnterOrSpace","useIsomorphicLayoutEffect","FocusVisible","useTimeout","useExternRef","usePlatform","ACTIVE_DELAY","ACTIVE_EFFECT_DELAY","activeBus","TapState","none","pending","active","exiting","TappableContext","createContext","onHoverChange","useActivity","hasActive","stopDelay","id","useMemo","Math","round","random","toString","useState","activity","setActivity","_stop","start","delayStart","activeTimeout","stopTimeout","set","clear","emit","onActiveChange","activeId","on","off","stop","delay","Tappable","children","Component","onClick","_onKeyDown","onKeyDown","activeEffectDelay","stopPropagation","getRootRef","sizeX","hasMouse","_hasHover","hoverMode","_hasActive","activeMode","focusVisibleMode","props","href","useContext","insideTouchRoot","platform","clicks","setClicks","childHover","setChildHover","_hovered","setHovered","hovered","disabled","isCustomElement","contentEditable","isPresetHoverMode","includes","isPresetActiveMode","containerRef","childContext","useRef","current","e","preventDefault","click","onStart","originalEvent","touches","length","top","left","x","y","Date","now","onMove","isSlide","onEnd","duration","activeDuraion","classes","handlers","role","undefined","map","wave","filter","c","Wave","onClear","timeout","useEffect"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport mitt from 'mitt';\nimport { hasHover as deviceHasHover, noop } from '@vkontakte/vkjs';\nimport { Touch, TouchEvent, TouchProps } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { ANDROID } from '../../lib/platform';\nimport { getOffsetRect } from '../../lib/offset';\nimport { coordX, coordY } from '../../lib/touch';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { withAdaptivity, AdaptivityProps } from '../../hoc/withAdaptivity';\nimport { shouldTriggerClickOnEnterOrSpace } from '../../lib/accessibility';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { FocusVisible, FocusVisibleMode } from '../FocusVisible/FocusVisible';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './Tappable.css';\n\nexport interface TappableProps extends React.AllHTMLAttributes<HTMLElement>, HasRootRef<HTMLElement>, AdaptivityProps, HasComponent {\n  /**\n   * Длительность показа active-состояния\n   */\n  activeEffectDelay?: number;\n  stopPropagation?: boolean;\n  /**\n   * Указывает, должен ли компонент реагировать на hover-состояние\n   */\n  hasHover?: boolean;\n  /**\n   * Указывает, должен ли компонент реагировать на active-состояние\n   */\n  hasActive?: boolean;\n  /**\n   * Стиль подсветки active-состояния. Если передать произвольную строку, она добавится как css-класс во время active\n   */\n  activeMode?: 'opacity' | 'background' | string;\n  /**\n   * Стиль подсветки hover-состояния. Если передать произвольную строку, она добавится как css-класс во время hover\n   */\n  hoverMode?: 'opacity' | 'background' | string;\n  /**\n   * Стиль аутлайна focus visible.\n   */\n  focusVisibleMode?: FocusVisibleMode;\n}\n\ninterface Wave {\n  x: number;\n  y: number;\n  id: string;\n}\n\nexport interface RootComponentProps extends TouchProps {\n  ref?: React.Ref<HTMLElement>;\n}\n\nexport const ACTIVE_DELAY = 70;\nexport const ACTIVE_EFFECT_DELAY = 600;\n\nconst activeBus = mitt<{ active: string }>();\nconst TapState = { none: 0, pending: 1, active: 2, exiting: 3 } as const;\n\ntype TappableContextInterface = { onHoverChange: (s: boolean) => void };\nconst TappableContext = React.createContext<TappableContextInterface>({ onHoverChange: noop });\n\nfunction useActivity(hasActive: boolean, stopDelay: number) {\n  const id = React.useMemo(() => Math.round(Math.random() * 1e8).toString(16), []);\n\n  const [activity, setActivity] = React.useState<typeof TapState[keyof typeof TapState]>(TapState.none);\n  const _stop = () => setActivity(TapState.none);\n  const start = () => hasActive && setActivity(TapState.active);\n  const delayStart = () => {\n    hasActive && setActivity(TapState.pending);\n  };\n\n  const activeTimeout = useTimeout(start, ACTIVE_DELAY);\n  const stopTimeout = useTimeout(_stop, stopDelay);\n\n  useIsomorphicLayoutEffect(() => {\n    if (activity === TapState.pending) {\n      activeTimeout.set();\n      return activeTimeout.clear;\n    }\n    if (activity === TapState.exiting) {\n      return stopTimeout.clear;\n    }\n    if (activity === TapState.active) {\n      activeBus.emit('active', id);\n    }\n    return noop;\n  }, [activity]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (activity === TapState.none) {\n      return noop;\n    }\n    const onActiveChange = (activeId: string) => {\n      activeId !== id && _stop();\n    };\n    activeBus.on('active', onActiveChange);\n    return () => activeBus.off('active', onActiveChange);\n  }, [activity === TapState.none]);\n\n  useIsomorphicLayoutEffect(() => {\n    !hasActive && _stop();\n  }, [hasActive]);\n\n  const stop = (delay?: number) => {\n    if (delay) {\n      setActivity(TapState.exiting);\n      return stopTimeout.set(delay);\n    }\n    _stop();\n  };\n\n  return [activity, { delayStart, start, stop }] as const;\n}\n\nconst Tappable: React.FC<TappableProps> = ({\n  children,\n  Component,\n  onClick,\n  onKeyDown: _onKeyDown,\n  activeEffectDelay = ACTIVE_EFFECT_DELAY,\n  stopPropagation = false,\n  getRootRef,\n  sizeX,\n  hasMouse,\n  hasHover: _hasHover = deviceHasHover,\n  hoverMode = 'background',\n  hasActive: _hasActive = true,\n  activeMode = 'background',\n  focusVisibleMode = 'inside',\n  ...props\n}: TappableProps) => {\n  Component = Component || (props.href ? 'a' : 'div') as React.ElementType;\n\n  const { onHoverChange } = React.useContext(TappableContext);\n  const insideTouchRoot = React.useContext(TouchRootContext);\n  const platform = usePlatform();\n\n  const [clicks, setClicks] = React.useState<Wave[]>([]);\n  const [childHover, setChildHover] = React.useState(false);\n  const [_hovered, setHovered] = React.useState(false);\n\n  const hovered = _hovered && !props.disabled;\n  const hasActive = _hasActive && !childHover && !props.disabled;\n  const hasHover = _hasHover && !childHover;\n  const isCustomElement = Component !== 'a' && Component !== 'button' && !props.contentEditable;\n  const isPresetHoverMode = ['opacity', 'background'].includes(hoverMode);\n  const isPresetActiveMode = ['opacity', 'background'].includes(activeMode);\n\n  const [activity, { start, stop, delayStart }] = useActivity(hasActive, activeEffectDelay);\n  const active = activity === TapState.active || activity === TapState.exiting;\n\n  const containerRef = useExternRef(getRootRef);\n\n  // hover propagation\n  const childContext = React.useRef({ onHoverChange: setChildHover }).current;\n  useIsomorphicLayoutEffect(() => {\n    if (!hovered) {\n      return noop;\n    }\n    onHoverChange(true);\n    return () => onHoverChange(false);\n  }, [hovered]);\n\n  /*\n   * [a11y]\n   * Обрабатывает событие onkeydown\n   * для кастомных доступных элементов:\n   * - role=\"link\" (активация по Enter)\n   * - role=\"button\" (активация по Space и Enter)\n   */\n  function onKeyDown(e: React.KeyboardEvent<HTMLElement>) {\n    if (isCustomElement && shouldTriggerClickOnEnterOrSpace(e)) {\n      e.preventDefault();\n      containerRef.current.click();\n    }\n\n    if (typeof _onKeyDown === 'function') {\n      return _onKeyDown(e);\n    }\n  }\n\n  function onStart({ originalEvent }: TouchEvent) {\n    if (hasActive) {\n      if (originalEvent.touches && originalEvent.touches.length > 1) {\n        // r сожалению я так и не понял, что это делает и можно ли упихнуть его в Touch\n        return stop();\n      }\n\n      if (platform === ANDROID) {\n        const { top, left } = getOffsetRect(containerRef.current);\n        const x = coordX(originalEvent) - left;\n        const y = coordY(originalEvent) - top;\n        setClicks([...clicks, { x, y, id: Date.now().toString() }]);\n      }\n\n      delayStart();\n    }\n  }\n\n  function onMove({ isSlide }: TouchEvent) {\n    if (isSlide) {\n      stop();\n    }\n  }\n\n  function onEnd({ duration }: TouchEvent) {\n    if (activity === TapState.none) {\n      return;\n    }\n    if (activity === TapState.pending) {\n      // активировать при коротком тапе\n      start();\n    }\n\n    // отключить без задержки при длинном тапе\n    const activeDuraion = duration - ACTIVE_DELAY;\n    stop(activeDuraion >= 100 ? 0 : activeEffectDelay - activeDuraion);\n  }\n\n  const classes = classNames(\n    getClassName('Tappable', platform),\n    `Tappable--sizeX-${sizeX}`,\n    {\n      'Tappable--active': hasActive && active,\n      'Tappable--mouse': hasMouse,\n      [`Tappable--hover-${hoverMode}`]: hasHover && hovered && isPresetHoverMode,\n      [`Tappable--active-${activeMode}`]: hasActive && active && isPresetActiveMode,\n      [hoverMode]: hasHover && hovered && !isPresetHoverMode,\n      [activeMode]: hasActive && active && !isPresetActiveMode,\n    });\n\n  const handlers: RootComponentProps = { onStart, onMove, onEnd, onClick, onKeyDown };\n  const role = props.href ? 'link' : 'button';\n\n  return (\n    <Touch\n      onEnter={() => setHovered(true)}\n      onLeave={() => setHovered(false)}\n      type={Component === 'button' ? 'button' : undefined}\n      tabIndex={isCustomElement && !props.disabled ? 0 : undefined}\n      role={isCustomElement ? role : undefined}\n      aria-disabled={isCustomElement ? props.disabled : null}\n      stopPropagation={stopPropagation && !insideTouchRoot && !props.disabled}\n      {...props}\n      slideThreshold={20}\n      usePointerHover\n      vkuiClass={classes}\n      Component={Component}\n      getRootRef={containerRef}\n      {...(props.disabled ? {} : handlers)}>\n      <TappableContext.Provider value={childContext}>\n        {children}\n      </TappableContext.Provider>\n      {platform === ANDROID && !hasMouse && hasActive && activeMode === 'background' && (\n        <span aria-hidden=\"true\" vkuiClass=\"Tappable__waves\">\n          {clicks.map((wave) => (\n            <Wave {...wave} key={wave.id} onClear={() => setClicks(clicks.filter((c) => c.id !== wave.id))} />\n          ))}\n        </span>\n      )}\n      {hasHover && hoverMode === 'background' && <span aria-hidden=\"true\" vkuiClass=\"Tappable__hoverShadow\" />}\n      {!props.disabled && <FocusVisible mode={focusVisibleMode} />}\n    </Touch>\n  );\n};\n\nexport default withAdaptivity(Tappable, { sizeX: true, hasMouse: true });\n\nfunction Wave({ x, y, onClear }: Wave & { onClear: VoidFunction }) {\n  const timeout = useTimeout(onClear, 225);\n  React.useEffect(() => timeout.set(), []);\n  return <span vkuiClass=\"Tappable__wave\" style={{ top: y, left: x }} />;\n}\n"],"file":"Tappable.js"}

package/dist/components/Textarea/Textarea.js

@@ -11,7 +11,6 @@ import { getClassName } from "../../helpers/getClassName";
 import { useEnsuredControl } from "../../hooks/useEnsuredControl";
 import { useExternRef } from "../../hooks/useExternRef";
 import { usePlatform } from "../../hooks/usePlatform";
-import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
 var Textarea = /*#__PURE__*/React.memo(function (_ref) {
   var _ref$defaultValue = _ref.defaultValue,
       defaultValue = _ref$defaultValue === void 0 ? '' : _ref$defaultValue,
@@ -34,19 +33,23 @@ var Textarea = /*#__PURE__*/React.memo(function (_ref) {
       value = _useEnsuredControl2[0],
       onChange = _useEnsuredControl2[1];
 
+  var currentScrollHeight = React.useRef();
   var elementRef = useExternRef(getRef);
   var platform = usePlatform(); // autosize input
 
-  useIsomorphicLayoutEffect(function () {
+  React.useEffect(function () {
     var el = elementRef.current;
 
-    if (grow) {
+    if (grow && el.offsetParent) {
       el.style.height = null;
-      el.style.height = "".concat(el.scrollHeight, "px"); // TODO: call only when height changed?
+      el.style.height = "".concat(el.scrollHeight, "px");
 
-      onResize && onResize(el);
+      if (el.scrollHeight !== currentScrollHeight.current && onResize) {
+        onResize(el);
+        currentScrollHeight.current = el.scrollHeight;
+      }
     }
-  }, [grow, value]);
+  }, [grow, value, sizeY]);
   return createScopedElement(FormField, {
     vkuiClass: classNames(getClassName('Textarea', platform), "Textarea--sizeY-".concat(sizeY)),
     className: className,