@vkontakte/vkui 5.4.3 → 5.5.1

package/dist/components/Spinner/Spinner.d.ts

@@ -5,4 +5,4 @@ export interface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {
 /**
  * @see https://vkcom.github.io/VKUI/#/Spinner
  */
-export declare const Spinner: React.MemoExoticComponent<({ size, "aria-label": ariaLabel, className, ...restProps }: SpinnerProps) => JSX.Element>;
+export declare const Spinner: React.MemoExoticComponent<({ size, "aria-label": ariaLabel, className, ...restProps }: SpinnerProps) => React.JSX.Element>;

package/dist/components/Spinner/Spinner.js

@@ -1,6 +1,6 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { Icon16Spinner, Icon24Spinner, Icon32Spinner, Icon44Spinner } from "@vkontakte/icons";
 import { classNames } from "@vkontakte/vkjs";

package/dist/components/Spinner/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Spinner, Icon24Spinner, Icon32Spinner, Icon44Spinner } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './Spinner.module.css';\n\nexport interface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {\n  size?: 'small' | 'regular' | 'medium' | 'large';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Spinner\n */\nexport const Spinner = React.memo(\n  ({\n    size = 'regular',\n    'aria-label': ariaLabel = 'Загружается...',\n    className,\n    ...restProps\n  }: SpinnerProps) => {\n    const SpinnerIcon = {\n      small: Icon16Spinner,\n      regular: Icon24Spinner,\n      medium: Icon32Spinner,\n      large: Icon44Spinner,\n    }[size];\n\n    return (\n      <span\n        role=\"status\"\n        aria-label={ariaLabel}\n        {...restProps}\n        className={classNames(styles['Spinner'], className)}\n      >\n        <SpinnerIcon className={styles['Spinner__self']} />\n      </span>\n    );\n  },\n);\n\nSpinner.displayName = 'Spinner';\n"],"names":["React","Icon16Spinner","Icon24Spinner","Icon32Spinner","Icon44Spinner","classNames","Spinner","memo","size","ariaLabel","className","restProps","SpinnerIcon","small","regular","medium","large","span","role","aria-label","displayName"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,aAAa,EAAEC,aAAa,EAAEC,aAAa,QAAQ,mBAAmB;AAC9F,SAASC,UAAU,QAAQ,kBAAkB;AAO7C;;CAEC,GACD,OAAO,IAAMC,wBAAUN,MAAMO,IAAI,CAC/B,iBAKoB;6BAJlBC,MAAAA,gCAAO,yBACOC,aAAd,eAAcA,YAAAA,iBAAY,mBAAZA,KACdC,mBAAAA,WACGC;QAHHH;QACA;QACAE;;IAGA,IAAME,cAAc;QAClBC,OAAOZ;QACPa,SAASZ;QACTa,QAAQZ;QACRa,OAAOZ;IACT,CAAC,CAACI,KAAK;IAEP,qBACE,oBAACS;QACCC,MAAK;QACLC,cAAYV;OACRE;QACJD,WAAWL,0BAA8BK;sBAEzC,oBAACE;QAAYF,SAAS;;AAG5B,GACA;AAEFJ,QAAQc,WAAW,GAAG"}
+{"version":3,"sources":["../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Spinner, Icon24Spinner, Icon32Spinner, Icon44Spinner } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './Spinner.module.css';\n\nexport interface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {\n  size?: 'small' | 'regular' | 'medium' | 'large';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Spinner\n */\nexport const Spinner = React.memo(\n  ({\n    size = 'regular',\n    'aria-label': ariaLabel = 'Загружается...',\n    className,\n    ...restProps\n  }: SpinnerProps) => {\n    const SpinnerIcon = {\n      small: Icon16Spinner,\n      regular: Icon24Spinner,\n      medium: Icon32Spinner,\n      large: Icon44Spinner,\n    }[size];\n\n    return (\n      <span\n        role=\"status\"\n        aria-label={ariaLabel}\n        {...restProps}\n        className={classNames(styles['Spinner'], className)}\n      >\n        <SpinnerIcon className={styles['Spinner__self']} />\n      </span>\n    );\n  },\n);\n\nSpinner.displayName = 'Spinner';\n"],"names":["React","Icon16Spinner","Icon24Spinner","Icon32Spinner","Icon44Spinner","classNames","Spinner","memo","size","ariaLabel","className","restProps","SpinnerIcon","small","regular","medium","large","span","role","aria-label","displayName"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,aAAa,EAAEC,aAAa,EAAEC,aAAa,QAAQ,mBAAmB;AAC9F,SAASC,UAAU,QAAQ,kBAAkB;AAO7C;;CAEC,GACD,OAAO,IAAMC,wBAAUN,MAAMO,KAC3B;6BACEC,MAAAA,gCAAO,yBACOC,aAAd,eAAcA,YAAAA,iBAAY,mBAAZA,KACdC,mBAAAA,WACGC;QAHHH;QACA;QACAE;;IAGA,IAAME,cAAc;QAClBC,OAAOZ;QACPa,SAASZ;QACTa,QAAQZ;QACRa,OAAOZ;IACT,CAAC,CAACI,KAAK;IAEP,qBACE,oBAACS;QACCC,MAAK;QACLC,cAAYV;OACRE;QACJD,WAAWL,0BAA8BK;sBAEzC,oBAACE;QAAYF,SAAS;;AAG5B,GACA;AAEFJ,QAAQc,cAAc"}

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

@@ -26,4 +26,4 @@ export interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {
 /**
  * @see https://vkcom.github.io/VKUI/#/SplitCol
  */
-export declare const SplitCol: (props: SplitColProps) => JSX.Element;
+export declare const SplitCol: (props: SplitColProps) => React.JSX.Element;

package/dist/components/SplitCol/SplitCol.js

@@ -1,7 +1,7 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
-import _sliced_to_array from "@swc/helpers/src/_sliced_to_array.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
+import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { useAdaptivity } from "../../hooks/useAdaptivity";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SplitCol/SplitCol.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useMediaQueries } from '../../hooks/useMediaQueries';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { ViewWidth, viewWidthToClassName } from '../../lib/adaptivity';\nimport { matchMediaListAddListener, matchMediaListRemoveListener } from '../../lib/matchMedia';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { SplitColContext } from './SplitColContext';\nimport styles from './SplitCol.module.css';\n\nconst breakpointClassNames = {\n  none: classNames(styles['SplitCol--viewWidth-none'], 'vkuiInternalSplitCol--viewWidth-none'),\n  tabletMinus: styles['SplitCol--viewWidth-tabletMinus'],\n  smallTabletPlus: styles['SplitCol--viewWidth-smallTabletPlus'],\n  tabletPlus: 'vkuiInternalSplitCol--viewWidth-tabletPlus',\n};\n\nfunction useTransitionAnimate(animateProp?: boolean) {\n  const { viewWidth } = useAdaptivity();\n  const [animate, setAnimate] = React.useState(Boolean(animateProp));\n  const mediaQueries = useMediaQueries();\n\n  React.useEffect(() => {\n    if (animateProp !== undefined) {\n      setAnimate(animateProp);\n      return;\n    }\n\n    if (viewWidth !== undefined) {\n      setAnimate(viewWidth < ViewWidth.TABLET);\n      return;\n    }\n\n    // eslint-disable-next-line no-restricted-properties\n    const listener = () => setAnimate(!mediaQueries.smallTabletPlus.matches);\n    listener();\n\n    matchMediaListAddListener(mediaQueries.smallTabletPlus, listener);\n    return () => {\n      matchMediaListRemoveListener(mediaQueries.smallTabletPlus, listener);\n    };\n  }, [animateProp, viewWidth, mediaQueries]);\n\n  return animate;\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   * @deprecated используйте autoSpaced\n   */\n  spaced?: boolean;\n  /**\n   * Если true, то добавляются боковые отступы фиксированной величины при ширине больше чем `smallTablet`\n   */\n  autoSpaced?: boolean;\n  fixed?: boolean;\n  /**\n   * Если true, то ширина контейнера становится 100% при ширине меньше чем `tablet`\n   */\n  stretchedOnMobile?: boolean;\n}\n\nconst warn = warnOnce('SplitCol');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SplitCol\n */\nexport const SplitCol = (props: SplitColProps) => {\n  const {\n    children,\n    width,\n    maxWidth,\n    minWidth,\n    spaced,\n    animate: animateProp,\n    fixed,\n    style,\n    autoSpaced,\n    stretchedOnMobile,\n    className,\n    ...restProps\n  } = props;\n  const baseRef = React.useRef<HTMLDivElement>(null);\n  const { viewWidth } = useAdaptivity();\n  const animate = useTransitionAnimate(animateProp);\n\n  const contextValue = useObjectMemo({\n    colRef: baseRef,\n    animate,\n  });\n\n  if (process.env.NODE_ENV === 'development' && spaced !== undefined) {\n    // TODO [>=6]: Удалить spaced\n    warn('Свойство spaced устарело и будет удалено в v6. Используйте autoSpaced');\n  }\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      className={classNames(\n        styles['SplitCol'],\n        viewWidthToClassName(breakpointClassNames, viewWidth),\n        spaced && classNames(styles['SplitCol--spaced'], 'vkuiInternalSplitCol--spaced'),\n        spaced === undefined &&\n          classNames(styles['SplitCol--spaced-none'], 'vkuiInternalSplitCol--spaced-none'),\n        autoSpaced &&\n          classNames(styles['SplitCol--spaced-auto'], 'vkuiInternalSplitCol--spaced-auto'),\n        fixed && styles['SplitCol--fixed'],\n        stretchedOnMobile && styles['SplitCol--stretched-on-mobile'],\n        className,\n      )}\n    >\n      <SplitColContext.Provider value={contextValue}>\n        {fixed ? <div className={styles['SplitCol__fixedInner']}>{children}</div> : children}\n      </SplitColContext.Provider>\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useMediaQueries","useObjectMemo","ViewWidth","viewWidthToClassName","matchMediaListAddListener","matchMediaListRemoveListener","warnOnce","SplitColContext","breakpointClassNames","none","tabletMinus","smallTabletPlus","tabletPlus","useTransitionAnimate","animateProp","viewWidth","useState","Boolean","animate","setAnimate","mediaQueries","useEffect","undefined","TABLET","listener","matches","warn","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","autoSpaced","stretchedOnMobile","className","restProps","baseRef","useRef","contextValue","colRef","process","env","NODE_ENV","div","ref","Provider","value"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,eAAe,QAAQ,8BAA8B;AAC9D,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,SAAS,EAAEC,oBAAoB,QAAQ,uBAAuB;AACvE,SAASC,yBAAyB,EAAEC,4BAA4B,QAAQ,uBAAuB;AAC/F,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,eAAe,QAAQ,oBAAoB;AAGpD,IAAMC,uBAAuB;IAC3BC,MAAMX,2CAA+C;IACrDY,WAAW;IACXC,eAAe;IACfC,YAAY;AACd;AAEA,SAASC,qBAAqBC,WAAqB,EAAE;IACnD,IAAM,AAAEC,YAAchB,gBAAdgB;IACR,IAA8BlB,mCAAAA,MAAMmB,QAAQ,CAACC,QAAQH,mBAA9CI,UAAuBrB,oBAAdsB,aAActB;IAC9B,IAAMuB,eAAepB;IAErBH,MAAMwB,SAAS,CAAC,WAAM;QACpB,IAAIP,gBAAgBQ,WAAW;YAC7BH,WAAWL;YACX;QACF,CAAC;QAED,IAAIC,cAAcO,WAAW;YAC3BH,WAAWJ,YAAYb,UAAUqB,MAAM;YACvC;QACF,CAAC;QAED,oDAAoD;QACpD,IAAMC,WAAW;mBAAML,WAAW,CAACC,aAAaT,eAAe,CAACc,OAAO;;QACvED;QAEApB,0BAA0BgB,aAAaT,eAAe,EAAEa;QACxD,OAAO,WAAM;YACXnB,6BAA6Be,aAAaT,eAAe,EAAEa;QAC7D;IACF,GAAG;QAACV;QAAaC;QAAWK;KAAa;IAEzC,OAAOF;AACT;AA2BA,IAAMQ,OAAOpB,SAAS;AAEtB;;CAEC,GACD,OAAO,IAAMqB,WAAW,SAACC,OAAyB;IAChD,IACEC,WAYED,MAZFC,UACAC,QAWEF,MAXFE,OACAC,WAUEH,MAVFG,UACAC,WASEJ,MATFI,UACAC,SAQEL,MARFK,QACAf,AAASJ,cAOPc,MAPFV,SACAgB,QAMEN,MANFM,OACAC,QAKEP,MALFO,OACAC,aAIER,MAJFQ,YACAC,oBAGET,MAHFS,mBACAC,YAEEV,MAFFU,WACGC,uCACDX;QAZFC;QACAC;QACAC;QACAC;QACAC;QACAf;QACAgB;QACAC;QACAC;QACAC;QACAC;;IAGF,IAAME,UAAU3C,MAAM4C,MAAM,CAAiB,IAAI;IACjD,IAAM,AAAE1B,YAAchB,gBAAdgB;IACR,IAAMG,UAAUL,qBAAqBC;IAErC,IAAM4B,eAAezC,cAAc;QACjC0C,QAAQH;QACRtB,SAAAA;IACF;IAEA,IAAI0B,QAAQC,GAAG,CAACC,QAAQ,KAAK,iBAAiBb,WAAWX,WAAW;QAClE,6BAA6B;QAC7BI,KAAK;IACP,CAAC;IAED,qBACE,oBAACqB,+CACKR;QACJJ,OAAO,wCACFA;YACHL,OAAOA;YACPC,UAAUA;YACVC,UAAUA;;QAEZgB,KAAKR;QACLF,WAAWxC,2BAETK,qBAAqBK,sBAAsBO,YAC3CkB,UAAUnC,mCAAuC,iCACjDmC,WAAWX,aACTxB,wCAA4C,sCAC9CsC,cACEtC,wCAA4C,sCAC9CoC,gCACAG,0DACAC;sBAGF,oBAAC/B,gBAAgB0C,QAAQ;QAACC,OAAOR;OAC9BR,sBAAQ,oBAACa;QAAIT,SAAS;OAAmCT,YAAkBA,QAAQ;AAI5F,EAAE"}
+{"version":3,"sources":["../../../src/components/SplitCol/SplitCol.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useMediaQueries } from '../../hooks/useMediaQueries';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { ViewWidth, viewWidthToClassName } from '../../lib/adaptivity';\nimport { matchMediaListAddListener, matchMediaListRemoveListener } from '../../lib/matchMedia';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { SplitColContext } from './SplitColContext';\nimport styles from './SplitCol.module.css';\n\nconst breakpointClassNames = {\n  none: classNames(styles['SplitCol--viewWidth-none'], 'vkuiInternalSplitCol--viewWidth-none'),\n  tabletMinus: styles['SplitCol--viewWidth-tabletMinus'],\n  smallTabletPlus: styles['SplitCol--viewWidth-smallTabletPlus'],\n  tabletPlus: 'vkuiInternalSplitCol--viewWidth-tabletPlus',\n};\n\nfunction useTransitionAnimate(animateProp?: boolean) {\n  const { viewWidth } = useAdaptivity();\n  const [animate, setAnimate] = React.useState(Boolean(animateProp));\n  const mediaQueries = useMediaQueries();\n\n  React.useEffect(() => {\n    if (animateProp !== undefined) {\n      setAnimate(animateProp);\n      return;\n    }\n\n    if (viewWidth !== undefined) {\n      setAnimate(viewWidth < ViewWidth.TABLET);\n      return;\n    }\n\n    // eslint-disable-next-line no-restricted-properties\n    const listener = () => setAnimate(!mediaQueries.smallTabletPlus.matches);\n    listener();\n\n    matchMediaListAddListener(mediaQueries.smallTabletPlus, listener);\n    return () => {\n      matchMediaListRemoveListener(mediaQueries.smallTabletPlus, listener);\n    };\n  }, [animateProp, viewWidth, mediaQueries]);\n\n  return animate;\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   * @deprecated используйте autoSpaced\n   */\n  spaced?: boolean;\n  /**\n   * Если true, то добавляются боковые отступы фиксированной величины при ширине больше чем `smallTablet`\n   */\n  autoSpaced?: boolean;\n  fixed?: boolean;\n  /**\n   * Если true, то ширина контейнера становится 100% при ширине меньше чем `tablet`\n   */\n  stretchedOnMobile?: boolean;\n}\n\nconst warn = warnOnce('SplitCol');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SplitCol\n */\nexport const SplitCol = (props: SplitColProps) => {\n  const {\n    children,\n    width,\n    maxWidth,\n    minWidth,\n    spaced,\n    animate: animateProp,\n    fixed,\n    style,\n    autoSpaced,\n    stretchedOnMobile,\n    className,\n    ...restProps\n  } = props;\n  const baseRef = React.useRef<HTMLDivElement>(null);\n  const { viewWidth } = useAdaptivity();\n  const animate = useTransitionAnimate(animateProp);\n\n  const contextValue = useObjectMemo({\n    colRef: baseRef,\n    animate,\n  });\n\n  if (process.env.NODE_ENV === 'development' && spaced !== undefined) {\n    // TODO [>=6]: Удалить spaced\n    warn('Свойство spaced устарело и будет удалено в v6. Используйте autoSpaced');\n  }\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      className={classNames(\n        styles['SplitCol'],\n        viewWidthToClassName(breakpointClassNames, viewWidth),\n        spaced && classNames(styles['SplitCol--spaced'], 'vkuiInternalSplitCol--spaced'),\n        spaced === undefined &&\n          classNames(styles['SplitCol--spaced-none'], 'vkuiInternalSplitCol--spaced-none'),\n        autoSpaced &&\n          classNames(styles['SplitCol--spaced-auto'], 'vkuiInternalSplitCol--spaced-auto'),\n        fixed && styles['SplitCol--fixed'],\n        stretchedOnMobile && styles['SplitCol--stretched-on-mobile'],\n        className,\n      )}\n    >\n      <SplitColContext.Provider value={contextValue}>\n        {fixed ? <div className={styles['SplitCol__fixedInner']}>{children}</div> : children}\n      </SplitColContext.Provider>\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useMediaQueries","useObjectMemo","ViewWidth","viewWidthToClassName","matchMediaListAddListener","matchMediaListRemoveListener","warnOnce","SplitColContext","breakpointClassNames","none","tabletMinus","smallTabletPlus","tabletPlus","useTransitionAnimate","animateProp","viewWidth","useState","Boolean","animate","setAnimate","mediaQueries","useEffect","undefined","TABLET","listener","matches","warn","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","autoSpaced","stretchedOnMobile","className","restProps","baseRef","useRef","contextValue","colRef","process","env","NODE_ENV","div","ref","Provider","value"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,eAAe,QAAQ,8BAA8B;AAC9D,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,SAAS,EAAEC,oBAAoB,QAAQ,uBAAuB;AACvE,SAASC,yBAAyB,EAAEC,4BAA4B,QAAQ,uBAAuB;AAC/F,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,eAAe,QAAQ,oBAAoB;AAGpD,IAAMC,uBAAuB;IAC3BC,MAAMX,2CAA+C;IACrDY,WAAW;IACXC,eAAe;IACfC,YAAY;AACd;AAEA,SAASC,qBAAqBC,WAAqB;IACjD,IAAM,AAAEC,YAAchB,gBAAdgB;IACR,IAA8BlB,mCAAAA,MAAMmB,SAASC,QAAQH,mBAA9CI,UAAuBrB,oBAAdsB,aAActB;IAC9B,IAAMuB,eAAepB;IAErBH,MAAMwB,UAAU;QACd,IAAIP,gBAAgBQ,WAAW;YAC7BH,WAAWL;YACX;QACF;QAEA,IAAIC,cAAcO,WAAW;YAC3BH,WAAWJ,YAAYb,UAAUqB;YACjC;QACF;QAEA,oDAAoD;QACpD,IAAMC,WAAW;mBAAML,WAAW,CAACC,aAAaT,gBAAgBc;;QAChED;QAEApB,0BAA0BgB,aAAaT,iBAAiBa;QACxD,OAAO;YACLnB,6BAA6Be,aAAaT,iBAAiBa;QAC7D;IACF,GAAG;QAACV;QAAaC;QAAWK;KAAa;IAEzC,OAAOF;AACT;AA2BA,IAAMQ,OAAOpB,SAAS;AAEtB;;CAEC,GACD,OAAO,IAAMqB,WAAW,SAACC;IACvB,IACEC,WAYED,MAZFC,UACAC,QAWEF,MAXFE,OACAC,WAUEH,MAVFG,UACAC,WASEJ,MATFI,UACAC,SAQEL,MARFK,QACAf,AAASJ,cAOPc,MAPFV,SACAgB,QAMEN,MANFM,OACAC,QAKEP,MALFO,OACAC,aAIER,MAJFQ,YACAC,oBAGET,MAHFS,mBACAC,YAEEV,MAFFU,WACGC,uCACDX;QAZFC;QACAC;QACAC;QACAC;QACAC;QACAf;QACAgB;QACAC;QACAC;QACAC;QACAC;;IAGF,IAAME,UAAU3C,MAAM4C,OAAuB;IAC7C,IAAM,AAAE1B,YAAchB,gBAAdgB;IACR,IAAMG,UAAUL,qBAAqBC;IAErC,IAAM4B,eAAezC,cAAc;QACjC0C,QAAQH;QACRtB,SAAAA;IACF;IAEA,IAAI0B,QAAQC,IAAIC,aAAa,iBAAiBb,WAAWX,WAAW;QAClE,6BAA6B;QAC7BI,KAAK;IACP;IAEA,qBACE,oBAACqB,+CACKR;QACJJ,OAAO,wCACFA;YACHL,OAAOA;YACPC,UAAUA;YACVC,UAAUA;;QAEZgB,KAAKR;QACLF,WAAWxC,2BAETK,qBAAqBK,sBAAsBO,YAC3CkB,UAAUnC,mCAAuC,iCACjDmC,WAAWX,aACTxB,wCAA4C,sCAC9CsC,cACEtC,wCAA4C,sCAC9CoC,gCACAG,0DACAC;sBAGF,oBAAC/B,gBAAgB0C;QAASC,OAAOR;OAC9BR,sBAAQ,oBAACa;QAAIT,SAAS;OAAmCT,YAAkBA;AAIpF,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SplitCol/SplitColContext.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport interface SplitColContextProps {\n  colRef: React.RefObject<HTMLDivElement> | null;\n  animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n  colRef: null,\n  animate: true,\n});\n\nexport const useSplitCol = () => React.useContext(SplitColContext);\n"],"names":["React","SplitColContext","createContext","colRef","animate","useSplitCol","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAO/B,OAAO,IAAMC,gCAAkBD,MAAME,aAAa,CAAuB;IACvEC,QAAQ,IAAI;IACZC,SAAS,IAAI;AACf,GAAG;AAEH,OAAO,IAAMC,cAAc;WAAML,MAAMM,UAAU,CAACL;EAAiB"}
+{"version":3,"sources":["../../../src/components/SplitCol/SplitColContext.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport interface SplitColContextProps {\n  colRef: React.RefObject<HTMLDivElement> | null;\n  animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n  colRef: null,\n  animate: true,\n});\n\nexport const useSplitCol = () => React.useContext(SplitColContext);\n"],"names":["React","SplitColContext","createContext","colRef","animate","useSplitCol","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAO/B,OAAO,IAAMC,gCAAkBD,MAAME,cAAoC;IACvEC,QAAQ;IACRC,SAAS;AACX,GAAG;AAEH,OAAO,IAAMC,cAAc;WAAML,MAAMM,WAAWL;EAAiB"}

package/dist/components/SplitLayout/SplitLayout.d.ts

@@ -14,4 +14,4 @@ export interface SplitLayoutProps extends React.HTMLAttributes<HTMLDivElement>,
 /**
  * @see https://vkcom.github.io/VKUI/#/SplitLayout
  */
-export declare const SplitLayout: ({ popout, modal, header, children, getRootRef, getRef, className, ...restProps }: SplitLayoutProps) => JSX.Element;
+export declare const SplitLayout: ({ popout, modal, header, children, getRootRef, getRef, className, ...restProps }: SplitLayoutProps) => React.JSX.Element;

package/dist/components/SplitLayout/SplitLayout.js

@@ -1,6 +1,6 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { usePlatform } from "../../hooks/usePlatform";

package/dist/components/SplitLayout/SplitLayout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SplitLayout/SplitLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { PopoutRoot } from '../PopoutRoot/PopoutRoot';\nimport styles from './SplitLayout.module.css';\n\nexport interface SplitLayoutProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n   */\n  popout?: React.ReactNode;\n  /**\n   * Свойство для отрисовки `ModalRoot`.\n   */\n  modal?: React.ReactNode;\n  header?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SplitLayout\n */\nexport const SplitLayout = ({\n  popout,\n  modal,\n  header,\n  children,\n  getRootRef,\n  getRef,\n  className,\n  ...restProps\n}: SplitLayoutProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PopoutRoot\n      className={classNames(\n        styles['SplitLayout'],\n        platform === Platform.IOS && styles['SplitLayout--ios'],\n      )}\n      popout={popout}\n      modal={modal}\n      getRootRef={getRootRef}\n    >\n      {header}\n      <div\n        {...restProps}\n        ref={getRef}\n        className={classNames(\n          styles['SplitLayout__inner'],\n          !!header && styles['SplitLayout__inner--header'],\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </PopoutRoot>\n  );\n};\n"],"names":["React","classNames","usePlatform","Platform","PopoutRoot","SplitLayout","popout","modal","header","children","getRootRef","getRef","className","restProps","platform","IOS","div","ref"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,UAAU,QAAQ,2BAA2B;AAkBtD;;CAEC,GACD,OAAO,IAAMC,cAAc,iBASH;QARtBC,gBAAAA,QACAC,eAAAA,OACAC,gBAAAA,QACAC,kBAAAA,UACAC,oBAAAA,YACAC,gBAAAA,QACAC,mBAAAA,WACGC;QAPHP;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWZ;IAEjB,qBACE,oBAACE;QACCQ,WAAWX,8BAETa,aAAaX,SAASY,GAAG;QAE3BT,QAAQA;QACRC,OAAOA;QACPG,YAAYA;OAEXF,sBACD,oBAACQ,+CACKH;QACJI,KAAKN;QACLC,WAAWX,qCAET,CAAC,CAACO,4CACFI;QAGDH;AAIT,EAAE"}
+{"version":3,"sources":["../../../src/components/SplitLayout/SplitLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { PopoutRoot } from '../PopoutRoot/PopoutRoot';\nimport styles from './SplitLayout.module.css';\n\nexport interface SplitLayoutProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n   */\n  popout?: React.ReactNode;\n  /**\n   * Свойство для отрисовки `ModalRoot`.\n   */\n  modal?: React.ReactNode;\n  header?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SplitLayout\n */\nexport const SplitLayout = ({\n  popout,\n  modal,\n  header,\n  children,\n  getRootRef,\n  getRef,\n  className,\n  ...restProps\n}: SplitLayoutProps) => {\n  const platform = usePlatform();\n\n  return (\n    <PopoutRoot\n      className={classNames(\n        styles['SplitLayout'],\n        platform === Platform.IOS && styles['SplitLayout--ios'],\n      )}\n      popout={popout}\n      modal={modal}\n      getRootRef={getRootRef}\n    >\n      {header}\n      <div\n        {...restProps}\n        ref={getRef}\n        className={classNames(\n          styles['SplitLayout__inner'],\n          !!header && styles['SplitLayout__inner--header'],\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </PopoutRoot>\n  );\n};\n"],"names":["React","classNames","usePlatform","Platform","PopoutRoot","SplitLayout","popout","modal","header","children","getRootRef","getRef","className","restProps","platform","IOS","div","ref"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,UAAU,QAAQ,2BAA2B;AAkBtD;;CAEC,GACD,OAAO,IAAMC,cAAc;QACzBC,gBAAAA,QACAC,eAAAA,OACAC,gBAAAA,QACAC,kBAAAA,UACAC,oBAAAA,YACAC,gBAAAA,QACAC,mBAAAA,WACGC;QAPHP;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWZ;IAEjB,qBACE,oBAACE;QACCQ,WAAWX,8BAETa,aAAaX,SAASY;QAExBT,QAAQA;QACRC,OAAOA;QACPG,YAAYA;OAEXF,sBACD,oBAACQ,+CACKH;QACJI,KAAKN;QACLC,WAAWX,qCAET,CAAC,CAACO,4CACFI;QAGDH;AAIT,EAAE"}

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

@@ -6,4 +6,4 @@ export interface SubnavigationBarProps extends React.HTMLAttributes<HTMLDivEleme
 /**
  * @see https://vkcom.github.io/VKUI/#/SubnavigationBar
  */
-export declare const SubnavigationBar: ({ mode, children, showArrows, getScrollToLeft, getScrollToRight, scrollAnimationDuration, className, ...restProps }: SubnavigationBarProps) => JSX.Element;
+export declare const SubnavigationBar: ({ mode, children, showArrows, getScrollToLeft, getScrollToRight, scrollAnimationDuration, className, ...restProps }: SubnavigationBarProps) => React.JSX.Element;

package/dist/components/SubnavigationBar/SubnavigationBar.js

@@ -1,6 +1,6 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { HorizontalScroll } from "../HorizontalScroll/HorizontalScroll";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SubnavigationBar/SubnavigationBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport {\n  HorizontalScroll,\n  HorizontalScrollProps,\n  ScrollPositionHandler,\n} from '../HorizontalScroll/HorizontalScroll';\nimport styles from './SubnavigationBar.module.css';\n\nexport interface SubnavigationBarProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    Pick<\n      HorizontalScrollProps,\n      'showArrows' | 'getScrollToLeft' | 'getScrollToRight' | 'scrollAnimationDuration'\n    > {\n  mode?: 'fixed' | 'overflow';\n}\n\nconst defaultScrollToLeft: ScrollPositionHandler = (x) => x - 240;\n\nconst defaultScrollToRight: ScrollPositionHandler = (x) => x + 240;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SubnavigationBar\n */\nexport const SubnavigationBar = ({\n  mode = 'overflow',\n  children,\n  showArrows = true,\n  getScrollToLeft = defaultScrollToLeft,\n  getScrollToRight = defaultScrollToRight,\n  scrollAnimationDuration,\n  className,\n  ...restProps\n}: SubnavigationBarProps) => {\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      className={classNames(\n        'vkuiInternalSubnavigationBar',\n        mode === 'fixed' && classNames('vkuiInternalSubnavigationBar--mode-fixed'),\n        className,\n      )}\n    >\n      <ScrollWrapper className={styles['SubnavigationBar__in']} {...scrollWrapperProps}>\n        <div className={styles['SubnavigationBar__scrollIn']}>{children}</div>\n      </ScrollWrapper>\n    </div>\n  );\n};\n"],"names":["React","classNames","HorizontalScroll","defaultScrollToLeft","x","defaultScrollToRight","SubnavigationBar","mode","children","showArrows","getScrollToLeft","getScrollToRight","scrollAnimationDuration","className","restProps","ScrollWrapper","scrollWrapperProps","div"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SACEC,gBAAgB,QAGX,uCAAuC;AAY9C,IAAMC,sBAA6C,SAACC;WAAMA,IAAI;;AAE9D,IAAMC,uBAA8C,SAACD;WAAMA,IAAI;;AAE/D;;CAEC,GACD,OAAO,IAAME,mBAAmB,iBASH;6BAR3BC,MAAAA,gCAAO,0BACPC,kBAAAA,qCACAC,YAAAA,4CAAa,IAAI,sDACjBC,iBAAAA,sDAAkBP,+EAClBQ,kBAAAA,wDAAmBN,gDACnBO,iCAAAA,yBACAC,mBAAAA,WACGC;QAPHP;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAIE;IACJ,IAAIC,qBAAqB,CAAC;IAE1B,IAAIT,SAAS,SAAS;QACpBQ,gBAAgB;IAClB,OAAO;QACLA,gBAAgBb;QAChBc,qBAAqB;YACnBP,YAAAA;YACAC,iBAAAA;YACAC,kBAAAA;YACAC,yBAAAA;QACF;IACF,CAAC;IAED,qBACE,oBAACK,+CACKH;QACJD,WAAWZ,WACT,gCACAM,SAAS,WAAWN,WAAW,6CAC/BY;sBAGF,oBAACE;QAAcF,SAAS;OAAsCG,mCAC5D,oBAACC;QAAIJ,SAAS;OAAyCL;AAI/D,EAAE"}
+{"version":3,"sources":["../../../src/components/SubnavigationBar/SubnavigationBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport {\n  HorizontalScroll,\n  HorizontalScrollProps,\n  ScrollPositionHandler,\n} from '../HorizontalScroll/HorizontalScroll';\nimport styles from './SubnavigationBar.module.css';\n\nexport interface SubnavigationBarProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    Pick<\n      HorizontalScrollProps,\n      'showArrows' | 'getScrollToLeft' | 'getScrollToRight' | 'scrollAnimationDuration'\n    > {\n  mode?: 'fixed' | 'overflow';\n}\n\nconst defaultScrollToLeft: ScrollPositionHandler = (x) => x - 240;\n\nconst defaultScrollToRight: ScrollPositionHandler = (x) => x + 240;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SubnavigationBar\n */\nexport const SubnavigationBar = ({\n  mode = 'overflow',\n  children,\n  showArrows = true,\n  getScrollToLeft = defaultScrollToLeft,\n  getScrollToRight = defaultScrollToRight,\n  scrollAnimationDuration,\n  className,\n  ...restProps\n}: SubnavigationBarProps) => {\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      className={classNames(\n        'vkuiInternalSubnavigationBar',\n        mode === 'fixed' && classNames('vkuiInternalSubnavigationBar--mode-fixed'),\n        className,\n      )}\n    >\n      <ScrollWrapper className={styles['SubnavigationBar__in']} {...scrollWrapperProps}>\n        <div className={styles['SubnavigationBar__scrollIn']}>{children}</div>\n      </ScrollWrapper>\n    </div>\n  );\n};\n"],"names":["React","classNames","HorizontalScroll","defaultScrollToLeft","x","defaultScrollToRight","SubnavigationBar","mode","children","showArrows","getScrollToLeft","getScrollToRight","scrollAnimationDuration","className","restProps","ScrollWrapper","scrollWrapperProps","div"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SACEC,gBAAgB,QAGX,uCAAuC;AAY9C,IAAMC,sBAA6C,SAACC;WAAMA,IAAI;;AAE9D,IAAMC,uBAA8C,SAACD;WAAMA,IAAI;;AAE/D;;CAEC,GACD,OAAO,IAAME,mBAAmB;6BAC9BC,MAAAA,gCAAO,0BACPC,kBAAAA,qCACAC,YAAAA,4CAAa,0DACbC,iBAAAA,sDAAkBP,+EAClBQ,kBAAAA,wDAAmBN,gDACnBO,iCAAAA,yBACAC,mBAAAA,WACGC;QAPHP;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAIE;IACJ,IAAIC,qBAAqB,CAAC;IAE1B,IAAIT,SAAS,SAAS;QACpBQ,gBAAgB;IAClB,OAAO;QACLA,gBAAgBb;QAChBc,qBAAqB;YACnBP,YAAAA;YACAC,iBAAAA;YACAC,kBAAAA;YACAC,yBAAAA;QACF;IACF;IAEA,qBACE,oBAACK,+CACKH;QACJD,WAAWZ,WACT,gCACAM,SAAS,WAAWN,WAAW,6CAC/BY;sBAGF,oBAACE;QAAcF,SAAS;OAAsCG,mCAC5D,oBAACC;QAAIJ,SAAS;OAAyCL;AAI/D,EAAE"}

package/dist/components/SubnavigationButton/SubnavigationButton.d.ts

@@ -21,4 +21,4 @@ export interface SubnavigationButtonProps extends Omit<TappableProps, 'size'> {
 /**
  * @see https://vkcom.github.io/VKUI/#/SubnavigationButton
  */
-export declare const SubnavigationButton: ({ mode, size, selected, textLevel, before, after, expandable, children, className, ...restProps }: SubnavigationButtonProps) => JSX.Element;
+export declare const SubnavigationButton: ({ mode, size, selected, textLevel, before, after, expandable, children, className, ...restProps }: SubnavigationButtonProps) => React.JSX.Element;

package/dist/components/SubnavigationButton/SubnavigationButton.js

@@ -1,7 +1,7 @@
-import _define_property from "@swc/helpers/src/_define_property.mjs";
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _define_property } from "@swc/helpers/_/_define_property";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { Icon16Dropdown } from "@vkontakte/icons";
 import { classNames } from "@vkontakte/vkjs";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SubnavigationButton/SubnavigationButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Dropdown } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasChildren, HasComponent } from '../../types';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './SubnavigationButton.module.css';\n\nconst sizeYClassNames = {\n  none: styles['SubnavigationButton--sizeY-none'],\n  [SizeType.COMPACT]: styles['SubnavigationButton--sizeY-compact'],\n};\n\nexport interface SubnavigationButtonProps extends Omit<TappableProps, 'size'> {\n  mode?: 'primary' | 'outline' | 'tertiary';\n  size?: 's' | '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 SubnavigationButtonTypographyProps = Pick<\n  SubnavigationButtonProps,\n  'textLevel' | 'className'\n> &\n  HasComponent &\n  HasChildren;\n\nconst SubnavigationButtonTypography = ({\n  textLevel,\n  ...restProps\n}: SubnavigationButtonTypographyProps) => {\n  if (textLevel === '1') {\n    return <Subhead {...restProps} />;\n  }\n\n  return <Caption level={textLevel === '2' ? '1' : '2'} {...restProps} />;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SubnavigationButton\n */\nexport const SubnavigationButton = ({\n  mode = 'primary',\n  size = 'm',\n  selected,\n  textLevel = '1',\n  before,\n  after,\n  expandable,\n  children,\n  className,\n  ...restProps\n}: SubnavigationButtonProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Tappable\n      {...restProps}\n      hasActive={false}\n      focusVisibleMode=\"outside\"\n      className={classNames(\n        styles['SubnavigationButton'],\n        {\n          s: styles['SubnavigationButton--size-s'],\n          m: styles['SubnavigationButton--size-m'],\n          l: styles['SubnavigationButton--size-l'],\n        }[size],\n        {\n          primary: styles['SubnavigationButton--mode-primary'],\n          outline: styles['SubnavigationButton--mode-outline'],\n          tertiary: styles['SubnavigationButton--mode-tertiary'],\n        }[mode],\n        selected && styles['SubnavigationButton--selected'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        className,\n      )}\n    >\n      <span className={styles['SubnavigationButton__in']}>\n        {before && <span className={styles['SubnavigationButton__before']}>{before}</span>}\n        <SubnavigationButtonTypography\n          textLevel={textLevel}\n          className={styles['SubnavigationButton__label']}\n          Component=\"span\"\n        >\n          {children}\n        </SubnavigationButtonTypography>\n        {after && <span className={styles['SubnavigationButton__after']}>{after}</span>}\n        {expandable && <Icon16Dropdown className={styles['SubnavigationButton__expandableIcon']} />}\n      </span>\n    </Tappable>\n  );\n};\n"],"names":["React","Icon16Dropdown","classNames","useAdaptivity","SizeType","Tappable","Caption","Subhead","sizeYClassNames","none","COMPACT","SubnavigationButtonTypography","textLevel","restProps","level","SubnavigationButton","mode","size","selected","before","after","expandable","children","className","sizeY","hasActive","focusVisibleMode","s","m","l","primary","outline","tertiary","REGULAR","span","Component"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,QAAQ,QAAQ,uBAAuB;AAEhD,SAASC,QAAQ,QAAuB,uBAAuB;AAC/D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,OAAO,QAAQ,gCAAgC;AAGxD,IAAMC;IACJC,IAAI;GACHL,SAASM,OAAO;AA6BnB,IAAMC,gCAAgC,iBAGI;QAFxCC,mBAAAA,WACGC;QADHD;;IAGA,IAAIA,cAAc,KAAK;QACrB,qBAAO,oBAACL,SAAYM;IACtB,CAAC;IAED,qBAAO,oBAACP;QAAQQ,OAAOF,cAAc,MAAM,MAAM,GAAG;OAAMC;AAC5D;AAEA;;CAEC,GACD,OAAO,IAAME,sBAAsB,iBAWH;6BAV9BC,MAAAA,gCAAO,8CACPC,MAAAA,gCAAO,mBACPC,kBAAAA,oCACAN,WAAAA,0CAAY,wBACZO,gBAAAA,QACAC,eAAAA,OACAC,oBAAAA,YACAC,kBAAAA,UACAC,mBAAAA,WACGV;QATHG;QACAC;QACAC;QACAN;QACAO;QACAC;QACAC;QACAC;QACAC;;IAGA,IAA2BpB,iBAAAA,wCAAAA,eAAnBqB,OAAAA,0CAAQ;IAEhB,qBACE,oBAACnB,kDACKQ;QACJY,WAAW,KAAK;QAChBC,kBAAiB;QACjBH,WAAWrB,sCAET;YACEyB,CAAC;YACDC,CAAC;YACDC,CAAC;QACH,CAAC,CAACZ,KAAK,EACP;YACEa,OAAO;YACPC,OAAO;YACPC,QAAQ;QACV,CAAC,CAAChB,KAAK,EACPE,iDACAM,UAAUpB,SAAS6B,OAAO,IAAIzB,eAAe,CAACgB,MAAM,EACpDD;sBAGF,oBAACW;QAAKX,SAAS;OACZJ,wBAAU,oBAACe;QAAKX,SAAS;OAA0CJ,uBACpE,oBAACR;QACCC,WAAWA;QACXW,SAAS;QACTY,WAAU;OAETb,WAEFF,uBAAS,oBAACc;QAAKX,SAAS;OAAyCH,QACjEC,4BAAc,oBAACpB;QAAesB,SAAS;;AAIhD,EAAE"}
+{"version":3,"sources":["../../../src/components/SubnavigationButton/SubnavigationButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Dropdown } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasChildren, HasComponent } from '../../types';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './SubnavigationButton.module.css';\n\nconst sizeYClassNames = {\n  none: styles['SubnavigationButton--sizeY-none'],\n  [SizeType.COMPACT]: styles['SubnavigationButton--sizeY-compact'],\n};\n\nexport interface SubnavigationButtonProps extends Omit<TappableProps, 'size'> {\n  mode?: 'primary' | 'outline' | 'tertiary';\n  size?: 's' | '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 SubnavigationButtonTypographyProps = Pick<\n  SubnavigationButtonProps,\n  'textLevel' | 'className'\n> &\n  HasComponent &\n  HasChildren;\n\nconst SubnavigationButtonTypography = ({\n  textLevel,\n  ...restProps\n}: SubnavigationButtonTypographyProps) => {\n  if (textLevel === '1') {\n    return <Subhead {...restProps} />;\n  }\n\n  return <Caption level={textLevel === '2' ? '1' : '2'} {...restProps} />;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SubnavigationButton\n */\nexport const SubnavigationButton = ({\n  mode = 'primary',\n  size = 'm',\n  selected,\n  textLevel = '1',\n  before,\n  after,\n  expandable,\n  children,\n  className,\n  ...restProps\n}: SubnavigationButtonProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Tappable\n      {...restProps}\n      hasActive={false}\n      focusVisibleMode=\"outside\"\n      className={classNames(\n        styles['SubnavigationButton'],\n        {\n          s: styles['SubnavigationButton--size-s'],\n          m: styles['SubnavigationButton--size-m'],\n          l: styles['SubnavigationButton--size-l'],\n        }[size],\n        {\n          primary: styles['SubnavigationButton--mode-primary'],\n          outline: styles['SubnavigationButton--mode-outline'],\n          tertiary: styles['SubnavigationButton--mode-tertiary'],\n        }[mode],\n        selected && styles['SubnavigationButton--selected'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        className,\n      )}\n    >\n      <span className={styles['SubnavigationButton__in']}>\n        {before && <span className={styles['SubnavigationButton__before']}>{before}</span>}\n        <SubnavigationButtonTypography\n          textLevel={textLevel}\n          className={styles['SubnavigationButton__label']}\n          Component=\"span\"\n        >\n          {children}\n        </SubnavigationButtonTypography>\n        {after && <span className={styles['SubnavigationButton__after']}>{after}</span>}\n        {expandable && <Icon16Dropdown className={styles['SubnavigationButton__expandableIcon']} />}\n      </span>\n    </Tappable>\n  );\n};\n"],"names":["React","Icon16Dropdown","classNames","useAdaptivity","SizeType","Tappable","Caption","Subhead","sizeYClassNames","none","COMPACT","SubnavigationButtonTypography","textLevel","restProps","level","SubnavigationButton","mode","size","selected","before","after","expandable","children","className","sizeY","hasActive","focusVisibleMode","s","m","l","primary","outline","tertiary","REGULAR","span","Component"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,QAAQ,QAAQ,uBAAuB;AAEhD,SAASC,QAAQ,QAAuB,uBAAuB;AAC/D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,OAAO,QAAQ,gCAAgC;AAGxD,IAAMC;IACJC,IAAI;GACHL,SAASM;AA6BZ,IAAMC,gCAAgC;QACpCC,mBAAAA,WACGC;QADHD;;IAGA,IAAIA,cAAc,KAAK;QACrB,qBAAO,oBAACL,SAAYM;IACtB;IAEA,qBAAO,oBAACP;QAAQQ,OAAOF,cAAc,MAAM,MAAM;OAASC;AAC5D;AAEA;;CAEC,GACD,OAAO,IAAME,sBAAsB;6BACjCC,MAAAA,gCAAO,8CACPC,MAAAA,gCAAO,mBACPC,kBAAAA,oCACAN,WAAAA,0CAAY,wBACZO,gBAAAA,QACAC,eAAAA,OACAC,oBAAAA,YACAC,kBAAAA,UACAC,mBAAAA,WACGV;QATHG;QACAC;QACAC;QACAN;QACAO;QACAC;QACAC;QACAC;QACAC;;IAGA,IAA2BpB,iBAAAA,wCAAAA,eAAnBqB,OAAAA,0CAAQ;IAEhB,qBACE,oBAACnB,kDACKQ;QACJY,WAAW;QACXC,kBAAiB;QACjBH,WAAWrB,sCAET;YACEyB,CAAC;YACDC,CAAC;YACDC,CAAC;QACH,CAAC,CAACZ,KAAK,EACP;YACEa,OAAO;YACPC,OAAO;YACPC,QAAQ;QACV,CAAC,CAAChB,KAAK,EACPE,iDACAM,UAAUpB,SAAS6B,WAAWzB,eAAe,CAACgB,MAAM,EACpDD;sBAGF,oBAACW;QAAKX,SAAS;OACZJ,wBAAU,oBAACe;QAAKX,SAAS;OAA0CJ,uBACpE,oBAACR;QACCC,WAAWA;QACXW,SAAS;QACTY,WAAU;OAETb,WAEFF,uBAAS,oBAACc;QAAKX,SAAS;OAAyCH,QACjEC,4BAAc,oBAACpB;QAAesB,SAAS;;AAIhD,EAAE"}

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

@@ -5,4 +5,4 @@ export interface SwitchProps extends React.InputHTMLAttributes<HTMLInputElement>
 /**
  * @see https://vkcom.github.io/VKUI/#/Switch
  */
-export declare const Switch: ({ style, className, getRootRef, getRef, ...restProps }: SwitchProps) => JSX.Element;
+export declare const Switch: ({ style, className, getRootRef, getRef, ...restProps }: SwitchProps) => React.JSX.Element;

package/dist/components/Switch/Switch.js

@@ -1,7 +1,7 @@
-import _define_property from "@swc/helpers/src/_define_property.mjs";
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _define_property } from "@swc/helpers/_/_define_property";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { useAdaptivity } from "../../hooks/useAdaptivity";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useFocusVisible } from '../../hooks/useFocusVisible';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { FocusVisible } from '../FocusVisible/FocusVisible';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './Switch.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Switch--sizeY-none'],\n  [SizeType.COMPACT]: styles['Switch--sizeY-compact'],\n};\n\nexport interface SwitchProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLLabelElement>,\n    HasRef<HTMLInputElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Switch\n */\nexport const Switch = ({ style, className, getRootRef, getRef, ...restProps }: SwitchProps) => {\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n\n  return (\n    <label\n      className={classNames(\n        styles['Switch'],\n        platform === Platform.IOS && styles['Switch--ios'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        restProps.disabled && styles['Switch--disabled'],\n        className,\n      )}\n      style={style}\n      ref={getRootRef}\n      onBlur={callMultiple(onBlur, restProps.onBlur)}\n      onFocus={callMultiple(onFocus, restProps.onFocus)}\n    >\n      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        getRootRef={getRef}\n        type=\"checkbox\"\n        className={styles['Switch__self']}\n      />\n      <span aria-hidden className={styles['Switch__pseudo']} />\n      <FocusVisible visible={focusVisible} mode=\"outside\" />\n    </label>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useFocusVisible","usePlatform","SizeType","callMultiple","Platform","FocusVisible","VisuallyHidden","sizeYClassNames","none","COMPACT","Switch","style","className","getRootRef","getRef","restProps","platform","sizeY","focusVisible","onBlur","onFocus","label","IOS","REGULAR","disabled","ref","Component","type","span","aria-hidden","visible","mode"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,eAAe,QAAQ,8BAA8B;AAC9D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,YAAY,QAAQ,yBAAyB;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,YAAY,QAAQ,+BAA+B;AAC5D,SAASC,cAAc,QAAQ,mCAAmC;AAGlE,IAAMC;IACJC,IAAI;GACHN,SAASO,OAAO;AAQnB;;CAEC,GACD,OAAO,IAAMC,SAAS,iBAAyE;QAAtEC,eAAAA,OAAOC,mBAAAA,WAAWC,oBAAAA,YAAYC,gBAAAA,QAAWC;QAAzCJ;QAAOC;QAAWC;QAAYC;;IACrD,IAAME,WAAWf;IACjB,IAA2BF,iBAAAA,wCAAAA,eAAnBkB,OAAAA,0CAAQ;IAChB,IAA0CjB,mBAAAA,mBAAlCkB,eAAkClB,iBAAlCkB,cAAcC,SAAoBnB,iBAApBmB,QAAQC,UAAYpB,iBAAZoB;IAE9B,qBACE,oBAACC;QACCT,WAAWd,yBAETkB,aAAaZ,SAASkB,GAAG,uBACzBL,UAAUf,SAASqB,OAAO,IAAIhB,eAAe,CAACU,MAAM,EACpDF,UAAUS,QAAQ,4BAClBZ;QAEFD,OAAOA;QACPc,KAAKZ;QACLM,QAAQhB,aAAagB,QAAQJ,UAAUI,MAAM;QAC7CC,SAASjB,aAAaiB,SAASL,UAAUK,OAAO;qBAEhD,oBAACd,wDACKS;QACJW,WAAU;QACVb,YAAYC;QACZa,MAAK;QACLf,SAAS;uBAEX,oBAACgB;QAAKC,eAAAA,IAAW;QAACjB,SAAS;sBAC3B,oBAACP;QAAayB,SAASZ;QAAca,MAAK;;AAGhD,EAAE"}
+{"version":3,"sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useFocusVisible } from '../../hooks/useFocusVisible';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { FocusVisible } from '../FocusVisible/FocusVisible';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './Switch.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Switch--sizeY-none'],\n  [SizeType.COMPACT]: styles['Switch--sizeY-compact'],\n};\n\nexport interface SwitchProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRootRef<HTMLLabelElement>,\n    HasRef<HTMLInputElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Switch\n */\nexport const Switch = ({ style, className, getRootRef, getRef, ...restProps }: SwitchProps) => {\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n\n  return (\n    <label\n      className={classNames(\n        styles['Switch'],\n        platform === Platform.IOS && styles['Switch--ios'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        restProps.disabled && styles['Switch--disabled'],\n        className,\n      )}\n      style={style}\n      ref={getRootRef}\n      onBlur={callMultiple(onBlur, restProps.onBlur)}\n      onFocus={callMultiple(onFocus, restProps.onFocus)}\n    >\n      <VisuallyHidden\n        {...restProps}\n        Component=\"input\"\n        getRootRef={getRef}\n        type=\"checkbox\"\n        className={styles['Switch__self']}\n      />\n      <span aria-hidden className={styles['Switch__pseudo']} />\n      <FocusVisible visible={focusVisible} mode=\"outside\" />\n    </label>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useFocusVisible","usePlatform","SizeType","callMultiple","Platform","FocusVisible","VisuallyHidden","sizeYClassNames","none","COMPACT","Switch","style","className","getRootRef","getRef","restProps","platform","sizeY","focusVisible","onBlur","onFocus","label","IOS","REGULAR","disabled","ref","Component","type","span","aria-hidden","visible","mode"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,eAAe,QAAQ,8BAA8B;AAC9D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,YAAY,QAAQ,yBAAyB;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,YAAY,QAAQ,+BAA+B;AAC5D,SAASC,cAAc,QAAQ,mCAAmC;AAGlE,IAAMC;IACJC,IAAI;GACHN,SAASO;AAQZ;;CAEC,GACD,OAAO,IAAMC,SAAS;QAAGC,eAAAA,OAAOC,mBAAAA,WAAWC,oBAAAA,YAAYC,gBAAAA,QAAWC;QAAzCJ;QAAOC;QAAWC;QAAYC;;IACrD,IAAME,WAAWf;IACjB,IAA2BF,iBAAAA,wCAAAA,eAAnBkB,OAAAA,0CAAQ;IAChB,IAA0CjB,mBAAAA,mBAAlCkB,eAAkClB,iBAAlCkB,cAAcC,SAAoBnB,iBAApBmB,QAAQC,UAAYpB,iBAAZoB;IAE9B,qBACE,oBAACC;QACCT,WAAWd,yBAETkB,aAAaZ,SAASkB,0BACtBL,UAAUf,SAASqB,WAAWhB,eAAe,CAACU,MAAM,EACpDF,UAAUS,oCACVZ;QAEFD,OAAOA;QACPc,KAAKZ;QACLM,QAAQhB,aAAagB,QAAQJ,UAAUI;QACvCC,SAASjB,aAAaiB,SAASL,UAAUK;qBAEzC,oBAACd,wDACKS;QACJW,WAAU;QACVb,YAAYC;QACZa,MAAK;QACLf,SAAS;uBAEX,oBAACgB;QAAKC,eAAAA;QAAYjB,SAAS;sBAC3B,oBAACP;QAAayB,SAASZ;QAAca,MAAK;;AAGhD,EAAE"}

package/dist/components/Tabbar/Tabbar.d.ts

@@ -12,4 +12,4 @@ export interface TabbarProps extends React.HTMLAttributes<HTMLDivElement> {
 /**
  * @see https://vkcom.github.io/VKUI/#/Tabbar
  */
-export declare const Tabbar: ({ children, shadow, mode, className, ...restProps }: TabbarProps) => JSX.Element;
+export declare const Tabbar: ({ children, shadow, mode, className, ...restProps }: TabbarProps) => React.JSX.Element;

package/dist/components/Tabbar/Tabbar.js

@@ -1,5 +1,5 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { usePlatform } from "../../hooks/usePlatform";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Tabbar/Tabbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport styles from './Tabbar.module.css';\n\nexport interface TabbarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Флаг для показа/скрытия верхней тени (Android) или границы (iOS)\n   */\n  shadow?: boolean;\n  /**\n   * Задает расположение элементов (вертикальное/горизонтальное)\n   */\n  mode?: 'vertical' | 'horizontal' | 'auto';\n}\n\nconst getItemsLayoutClassName = (\n  itemsLayout: TabbarProps['mode'],\n  children: TabbarProps['children'],\n): string => {\n  switch (itemsLayout) {\n    case 'horizontal':\n      return 'vkuiInternalTabbar--layout-horizontal';\n    case 'vertical':\n      return 'vkuiInternalTabbar--layout-vertical';\n    default:\n      return React.Children.count(children) > 2\n        ? getItemsLayoutClassName('vertical', [])\n        : getItemsLayoutClassName('horizontal', []);\n  }\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Tabbar\n */\nexport const Tabbar = ({ children, shadow = true, mode, className, ...restProps }: TabbarProps) => {\n  const platform = usePlatform();\n\n  return (\n    <div\n      className={classNames(\n        'vkuiInternalTabbar',\n        styles['Tabbar'],\n        platform === Platform.IOS && styles['Tabbar--ios'],\n        getItemsLayoutClassName(mode, children),\n        shadow && styles['Tabbar--shadow'],\n        className,\n      )}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["React","classNames","usePlatform","Platform","getItemsLayoutClassName","itemsLayout","children","Children","count","Tabbar","shadow","mode","className","restProps","platform","div","IOS"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAc9C,IAAMC,0BAA0B,SAC9BC,aACAC,UACW;IACX,OAAQD;QACN,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT;YACE,OAAOL,MAAMO,QAAQ,CAACC,KAAK,CAACF,YAAY,IACpCF,wBAAwB,YAAY,EAAE,IACtCA,wBAAwB,cAAc,EAAE,CAAC;IACjD;AACF;AAEA;;CAEC,GACD,OAAO,IAAMK,SAAS,iBAA6E;QAA1EH,kBAAAA,iCAAUI,QAAAA,oCAAS,IAAI,kBAAEC,cAAAA,MAAMC,mBAAAA,WAAcC;QAA7CP;QAAUI;QAAeC;QAAMC;;IACtD,IAAME,WAAWZ;IAEjB,qBACE,oBAACa;QACCH,WAAWX,WACT,oCAEAa,aAAaX,SAASa,GAAG,uBACzBZ,wBAAwBO,MAAML,WAC9BI,gCACAE;OAEEC,YAEHP;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/Tabbar/Tabbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport styles from './Tabbar.module.css';\n\nexport interface TabbarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Флаг для показа/скрытия верхней тени (Android) или границы (iOS)\n   */\n  shadow?: boolean;\n  /**\n   * Задает расположение элементов (вертикальное/горизонтальное)\n   */\n  mode?: 'vertical' | 'horizontal' | 'auto';\n}\n\nconst getItemsLayoutClassName = (\n  itemsLayout: TabbarProps['mode'],\n  children: TabbarProps['children'],\n): string => {\n  switch (itemsLayout) {\n    case 'horizontal':\n      return 'vkuiInternalTabbar--layout-horizontal';\n    case 'vertical':\n      return 'vkuiInternalTabbar--layout-vertical';\n    default:\n      return React.Children.count(children) > 2\n        ? getItemsLayoutClassName('vertical', [])\n        : getItemsLayoutClassName('horizontal', []);\n  }\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Tabbar\n */\nexport const Tabbar = ({ children, shadow = true, mode, className, ...restProps }: TabbarProps) => {\n  const platform = usePlatform();\n\n  return (\n    <div\n      className={classNames(\n        'vkuiInternalTabbar',\n        styles['Tabbar'],\n        platform === Platform.IOS && styles['Tabbar--ios'],\n        getItemsLayoutClassName(mode, children),\n        shadow && styles['Tabbar--shadow'],\n        className,\n      )}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["React","classNames","usePlatform","Platform","getItemsLayoutClassName","itemsLayout","children","Children","count","Tabbar","shadow","mode","className","restProps","platform","div","IOS"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAc9C,IAAMC,0BAA0B,SAC9BC,aACAC;IAEA,OAAQD;QACN,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT;YACE,OAAOL,MAAMO,SAASC,MAAMF,YAAY,IACpCF,wBAAwB,YAAY,EAAE,IACtCA,wBAAwB,cAAc,EAAE;IAChD;AACF;AAEA;;CAEC,GACD,OAAO,IAAMK,SAAS;QAAGH,kBAAAA,iCAAUI,QAAAA,oCAAS,sBAAMC,cAAAA,MAAMC,mBAAAA,WAAcC;QAA7CP;QAAUI;QAAeC;QAAMC;;IACtD,IAAME,WAAWZ;IAEjB,qBACE,oBAACa;QACCH,WAAWX,WACT,oCAEAa,aAAaX,SAASa,0BACtBZ,wBAAwBO,MAAML,WAC9BI,gCACAE;OAEEC,YAEHP;AAGP,EAAE"}

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

@@ -14,4 +14,4 @@ export interface TabbarItemProps extends React.AllHTMLAttributes<HTMLElement>, H
 /**
  * @see https://vkcom.github.io/VKUI/#/TabbarItem
  */
-export declare const TabbarItem: ({ children, selected, indicator, text, href, Component, disabled, className, ...restProps }: TabbarItemProps) => JSX.Element;
+export declare const TabbarItem: ({ children, selected, indicator, text, href, Component, disabled, className, ...restProps }: TabbarItemProps) => React.JSX.Element;

package/dist/components/TabbarItem/TabbarItem.js

@@ -1,6 +1,6 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { classNames, hasReactNode } from "@vkontakte/vkjs";
 import { usePlatform } from "../../hooks/usePlatform";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/TabbarItem/TabbarItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { COMMON_WARNINGS, warnOnce } from '../../lib/warnOnce';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './TabbarItem.module.css';\n\nexport interface TabbarItemProps\n  extends React.AllHTMLAttributes<HTMLElement>,\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\nconst warn = warnOnce('TabbarItem');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/TabbarItem\n */\nexport const TabbarItem = ({\n  children,\n  selected,\n  indicator,\n  text,\n  href,\n  Component = href ? 'a' : 'button',\n  disabled,\n  className,\n  ...restProps\n}: TabbarItemProps) => {\n  const platform = usePlatform();\n\n  if (process.env.NODE_ENV === 'development') {\n    const hasAccessibleName = text || restProps['aria-label'] || restProps['aria-labelledby'];\n\n    if (!hasAccessibleName) {\n      warn(COMMON_WARNINGS.a11y[Component === 'a' ? 'link-name' : 'button-name'], 'error');\n    }\n  }\n\n  return (\n    <Component\n      {...restProps}\n      disabled={disabled}\n      href={href}\n      className={classNames(\n        styles['TabbarItem'],\n        platform === Platform.IOS && styles['TabbarItem--ios'],\n        platform === Platform.ANDROID && styles['TabbarItem--android'],\n        selected && styles['TabbarItem--selected'],\n        !!text && styles['TabbarItem--text'],\n        className,\n      )}\n    >\n      <Tappable\n        role=\"presentation\"\n        Component=\"div\"\n        disabled={disabled}\n        activeMode={\n          platform === Platform.IOS ? styles['TabbarItem__tappable--active'] : 'background'\n        }\n        activeEffectDelay={platform === Platform.IOS ? 0 : 300}\n        hasHover={false}\n        className={styles['TabbarItem__tappable']}\n      />\n      <div className={styles['TabbarItem__in']}>\n        <div className={styles['TabbarItem__icon']}>\n          {children}\n          <div className=\"vkuiInternalTabbarItem__label\">\n            {hasReactNode(indicator) && indicator}\n          </div>\n        </div>\n        {text && (\n          <Footnote Component=\"div\" className={styles['TabbarItem__text']} weight=\"2\">\n            {text}\n          </Footnote>\n        )}\n      </div>\n    </Component>\n  );\n};\n"],"names":["React","classNames","hasReactNode","usePlatform","Platform","COMMON_WARNINGS","warnOnce","Tappable","Footnote","warn","TabbarItem","children","selected","indicator","text","href","Component","disabled","className","restProps","platform","process","env","NODE_ENV","hasAccessibleName","a11y","IOS","ANDROID","role","activeMode","activeEffectDelay","hasHover","div","weight"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,eAAe,EAAEC,QAAQ,QAAQ,qBAAqB;AAE/D,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,kCAAkC;AAkB3D,IAAMC,OAAOH,SAAS;AAEtB;;CAEC,GACD,OAAO,IAAMI,aAAa,iBAUH;QATrBC,kBAAAA,UACAC,kBAAAA,UACAC,mBAAAA,WACAC,cAAAA,MACAC,cAAAA,gCACAC,WAAAA,0CAAYD,OAAO,MAAM,QAAQ,qBACjCE,kBAAAA,UACAC,mBAAAA,WACGC;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWjB;IAEjB,IAAIkB,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAMC,oBAAoBV,QAAQK,SAAS,CAAC,aAAa,IAAIA,SAAS,CAAC,kBAAkB;QAEzF,IAAI,CAACK,mBAAmB;YACtBf,KAAKJ,gBAAgBoB,IAAI,CAACT,cAAc,MAAM,cAAc,aAAa,CAAC,EAAE;QAC9E,CAAC;IACH,CAAC;IAED,qBACE,oBAACA,mDACKG;QACJF,UAAUA;QACVF,MAAMA;QACNG,WAAWjB,6BAETmB,aAAahB,SAASsB,GAAG,2BACzBN,aAAahB,SAASuB,OAAO,+BAC7Bf,wCACA,CAAC,CAACE,gCACFI;sBAGF,oBAACX;QACCqB,MAAK;QACLZ,WAAU;QACVC,UAAUA;QACVY,YACET,aAAahB,SAASsB,GAAG,wCAA4C,YAAY;QAEnFI,mBAAmBV,aAAahB,SAASsB,GAAG,GAAG,IAAI,GAAG;QACtDK,UAAU,KAAK;QACfb,SAAS;sBAEX,oBAACc;QAAId,SAAS;qBACZ,oBAACc;QAAId,SAAS;OACXP,wBACD,oBAACqB;QAAId,WAAU;OACZhB,aAAaW,cAAcA,aAG/BC,sBACC,oBAACN;QAASQ,WAAU;QAAME,SAAS;QAA8Be,QAAO;OACrEnB;AAMb,EAAE"}
+{"version":3,"sources":["../../../src/components/TabbarItem/TabbarItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { Platform } from '../../lib/platform';\nimport { COMMON_WARNINGS, warnOnce } from '../../lib/warnOnce';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './TabbarItem.module.css';\n\nexport interface TabbarItemProps\n  extends React.AllHTMLAttributes<HTMLElement>,\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\nconst warn = warnOnce('TabbarItem');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/TabbarItem\n */\nexport const TabbarItem = ({\n  children,\n  selected,\n  indicator,\n  text,\n  href,\n  Component = href ? 'a' : 'button',\n  disabled,\n  className,\n  ...restProps\n}: TabbarItemProps) => {\n  const platform = usePlatform();\n\n  if (process.env.NODE_ENV === 'development') {\n    const hasAccessibleName = text || restProps['aria-label'] || restProps['aria-labelledby'];\n\n    if (!hasAccessibleName) {\n      warn(COMMON_WARNINGS.a11y[Component === 'a' ? 'link-name' : 'button-name'], 'error');\n    }\n  }\n\n  return (\n    <Component\n      {...restProps}\n      disabled={disabled}\n      href={href}\n      className={classNames(\n        styles['TabbarItem'],\n        platform === Platform.IOS && styles['TabbarItem--ios'],\n        platform === Platform.ANDROID && styles['TabbarItem--android'],\n        selected && styles['TabbarItem--selected'],\n        !!text && styles['TabbarItem--text'],\n        className,\n      )}\n    >\n      <Tappable\n        role=\"presentation\"\n        Component=\"div\"\n        disabled={disabled}\n        activeMode={\n          platform === Platform.IOS ? styles['TabbarItem__tappable--active'] : 'background'\n        }\n        activeEffectDelay={platform === Platform.IOS ? 0 : 300}\n        hasHover={false}\n        className={styles['TabbarItem__tappable']}\n      />\n      <div className={styles['TabbarItem__in']}>\n        <div className={styles['TabbarItem__icon']}>\n          {children}\n          <div className=\"vkuiInternalTabbarItem__label\">\n            {hasReactNode(indicator) && indicator}\n          </div>\n        </div>\n        {text && (\n          <Footnote Component=\"div\" className={styles['TabbarItem__text']} weight=\"2\">\n            {text}\n          </Footnote>\n        )}\n      </div>\n    </Component>\n  );\n};\n"],"names":["React","classNames","hasReactNode","usePlatform","Platform","COMMON_WARNINGS","warnOnce","Tappable","Footnote","warn","TabbarItem","children","selected","indicator","text","href","Component","disabled","className","restProps","platform","process","env","NODE_ENV","hasAccessibleName","a11y","IOS","ANDROID","role","activeMode","activeEffectDelay","hasHover","div","weight"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,eAAe,EAAEC,QAAQ,QAAQ,qBAAqB;AAE/D,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,kCAAkC;AAkB3D,IAAMC,OAAOH,SAAS;AAEtB;;CAEC,GACD,OAAO,IAAMI,aAAa;QACxBC,kBAAAA,UACAC,kBAAAA,UACAC,mBAAAA,WACAC,cAAAA,MACAC,cAAAA,gCACAC,WAAAA,0CAAYD,OAAO,MAAM,6BACzBE,kBAAAA,UACAC,mBAAAA,WACGC;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWjB;IAEjB,IAAIkB,QAAQC,IAAIC,aAAa,eAAe;QAC1C,IAAMC,oBAAoBV,QAAQK,SAAS,CAAC,aAAa,IAAIA,SAAS,CAAC,kBAAkB;QAEzF,IAAI,CAACK,mBAAmB;YACtBf,KAAKJ,gBAAgBoB,IAAI,CAACT,cAAc,MAAM,cAAc,cAAc,EAAE;QAC9E;IACF;IAEA,qBACE,oBAACA,mDACKG;QACJF,UAAUA;QACVF,MAAMA;QACNG,WAAWjB,6BAETmB,aAAahB,SAASsB,8BACtBN,aAAahB,SAASuB,sCACtBf,wCACA,CAAC,CAACE,gCACFI;sBAGF,oBAACX;QACCqB,MAAK;QACLZ,WAAU;QACVC,UAAUA;QACVY,YACET,aAAahB,SAASsB,2CAA+C;QAEvEI,mBAAmBV,aAAahB,SAASsB,MAAM,IAAI;QACnDK,UAAU;QACVb,SAAS;sBAEX,oBAACc;QAAId,SAAS;qBACZ,oBAACc;QAAId,SAAS;OACXP,wBACD,oBAACqB;QAAId,WAAU;OACZhB,aAAaW,cAAcA,aAG/BC,sBACC,oBAACN;QAASQ,WAAU;QAAME,SAAS;QAA8Be,QAAO;OACrEnB;AAMb,EAAE"}

package/dist/components/Tabs/Tabs.d.ts

@@ -11,4 +11,4 @@ export declare const TabsModeContext: React.Context<TabsContextProps>;
 /**
  * @see https://vkcom.github.io/VKUI/#/Tabs
  */
-export declare const Tabs: ({ children, mode, getRootRef, className, role, ...restProps }: TabsProps) => JSX.Element;
+export declare const Tabs: ({ children, mode, getRootRef, className, role, ...restProps }: TabsProps) => React.JSX.Element;

package/dist/components/Tabs/Tabs.js

@@ -1,6 +1,6 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { pressedKey } from '../../lib/accessibility';\nimport { useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport { HasRootRef } from '../../types';\nimport styles from './Tabs.module.css';\n\nexport interface TabsProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  mode?: 'default' | 'accent' | 'secondary';\n}\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\n/**\n * @see https://vkcom.github.io/VKUI/#/Tabs\n */\nexport const Tabs = ({\n  children,\n  mode = 'default',\n  getRootRef,\n  className,\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  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>('[role=tab]:not([disabled])'),\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((el) => document.activeElement === el);\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((el) => document.activeElement === el);\n\n        if (!currentFocusedEl || currentFocusedEl.getAttribute('aria-selected') !== 'true') {\n          return;\n        }\n\n        const relatedContentElId = 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((el) => document.activeElement === el);\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      className={classNames(\n        styles['Tabs'],\n        'vkuiInternalTabs',\n        platform === Platform.VKCOM && 'vkuiInternalTabs--vkcom',\n        withGaps && classNames(styles['Tabs--withGaps'], 'vkuiInternalTabs--withGaps'),\n        mode === 'default' && styles['Tabs--mode-default'],\n        className,\n      )}\n      role={role}\n    >\n      <div className={styles['Tabs__in']} ref={tabsRef}>\n        <TabsModeContext.Provider value={{ mode, withGaps }}>{children}</TabsModeContext.Provider>\n      </div>\n    </div>\n  );\n};\n"],"names":["React","classNames","useGlobalEventListener","usePlatform","pressedKey","useDOM","Platform","TabsModeContext","createContext","mode","withGaps","Tabs","children","getRootRef","className","role","restProps","platform","document","isTabFlow","tabsRef","useRef","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","div","ref","VKCOM","Provider","value"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { pressedKey } from '../../lib/accessibility';\nimport { useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport { HasRootRef } from '../../types';\nimport styles from './Tabs.module.css';\n\nexport interface TabsProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  mode?: 'default' | 'accent' | 'secondary';\n}\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\n/**\n * @see https://vkcom.github.io/VKUI/#/Tabs\n */\nexport const Tabs = ({\n  children,\n  mode = 'default',\n  getRootRef,\n  className,\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  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>('[role=tab]:not([disabled])'),\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((el) => document.activeElement === el);\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((el) => document.activeElement === el);\n\n        if (!currentFocusedEl || currentFocusedEl.getAttribute('aria-selected') !== 'true') {\n          return;\n        }\n\n        const relatedContentElId = 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((el) => document.activeElement === el);\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      className={classNames(\n        styles['Tabs'],\n        'vkuiInternalTabs',\n        platform === Platform.VKCOM && 'vkuiInternalTabs--vkcom',\n        withGaps && classNames(styles['Tabs--withGaps'], 'vkuiInternalTabs--withGaps'),\n        mode === 'default' && styles['Tabs--mode-default'],\n        className,\n      )}\n      role={role}\n    >\n      <div className={styles['Tabs__in']} ref={tabsRef}>\n        <TabsModeContext.Provider value={{ mode, withGaps }}>{children}</TabsModeContext.Provider>\n      </div>\n    </div>\n  );\n};\n"],"names":["React","classNames","useGlobalEventListener","usePlatform","pressedKey","useDOM","Platform","TabsModeContext","createContext","mode","withGaps","Tabs","children","getRootRef","className","role","restProps","platform","document","isTabFlow","tabsRef","useRef","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","div","ref","VKCOM","Provider","value"],"mappings":"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"}

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

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

package/dist/components/TabsItem/TabsItem.js

@@ -1,7 +1,7 @@
-import _define_property from "@swc/helpers/src/_define_property.mjs";
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _define_property } from "@swc/helpers/_/_define_property";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { useAdaptivity } from "../../hooks/useAdaptivity";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/TabsItem/TabsItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { TabsContextProps, TabsModeContext } from '../Tabs/Tabs';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './TabsItem.module.css';\n\nconst sizeYClassNames = {\n  none: styles['TabsItem--sizeY-none'],\n  [SizeType.COMPACT]: styles['TabsItem--sizeY-compact'],\n};\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  className,\n  role = 'tab',\n  tabIndex: tabIndexProp,\n  ...restProps\n}: TabsItemProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const { mode, withGaps }: TabsContextProps = 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          className={classNames(styles['TabsItem__status'], styles['TabsItem__status--count'])}\n          weight=\"2\"\n        >\n          <VisuallyHidden>&nbsp;</VisuallyHidden>\n          {status}\n        </Subhead>\n      ) : (\n        <span className={styles['TabsItem__status']}>\n          <VisuallyHidden>&nbsp;</VisuallyHidden>\n          {status}\n        </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      className={classNames(\n        styles['TabsItem'],\n        mode &&\n          {\n            default: styles['TabsItem--mode-default'],\n            accent: styles['TabsItem--mode-accent'],\n            secondary: styles['TabsItem--mode-secondary'],\n          }[mode],\n        selected && styles['TabsItem--selected'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        withGaps && styles['TabsItem--withGaps'],\n        className,\n      )}\n      hoverMode={styles['TabsItem--hover']}\n      activeMode=\"\"\n      focusVisibleMode=\"inside\"\n      hasActive={false}\n      role={role}\n      aria-selected={selected}\n      tabIndex={tabIndex}\n    >\n      {before && <div className={styles['TabsItem__before']}>{before}</div>}\n      <Headline\n        Component=\"span\"\n        className={styles['TabsItem__label']}\n        level={mode === 'default' ? '1' : '2'}\n        weight=\"2\"\n      >\n        {children}\n      </Headline>\n      {statusComponent}\n      {after && <div className={styles['TabsItem__after']}>{after}</div>}\n      {mode === 'default' && (\n        <div className={styles['TabsItem__underline']} aria-hidden data-selected={selected} />\n      )}\n    </Tappable>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","SizeType","warnOnce","TabsModeContext","Tappable","Headline","Subhead","VisuallyHidden","sizeYClassNames","none","COMPACT","warn","TabsItem","before","children","status","after","selected","className","role","tabIndex","tabIndexProp","restProps","sizeY","useContext","mode","withGaps","statusComponent","isTabFlow","Component","weight","span","process","env","NODE_ENV","undefined","default","accent","secondary","REGULAR","hoverMode","activeMode","focusVisibleMode","hasActive","aria-selected","div","level","aria-hidden","data-selected"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAA2BC,eAAe,QAAQ,eAAe;AACjE,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,cAAc,QAAQ,mCAAmC;AAGlE,IAAMC;IACJC,IAAI;GACHR,SAASS,OAAO;AA6BnB,IAAMC,OAAOT,SAAS;AAEtB;;CAEC,GACD,OAAO,IAAMU,WAAW,iBAUH;QATnBC,gBAAAA,QACAC,kBAAAA,UACAC,gBAAAA,QACAC,eAAAA,gCACAC,UAAAA,wCAAW,KAAK,oBAChBC,mBAAAA,gCACAC,MAAAA,gCAAO,qBACPC,AAAUC,sBAAVD,UACGE;QARHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAA2BpB,iBAAAA,wCAAAA,eAAnBuB,OAAAA,0CAAQ;IAChB,IAA6CzB,oBAAAA,MAAM0B,UAAU,CAACrB,kBAAtDsB,OAAqC3B,kBAArC2B,MAAMC,WAA+B5B,kBAA/B4B;IACd,IAAIC,kBAAkB,IAAI;IAE1B,IAAMC,YAAYT,SAAS;IAE3B,IAAIJ,QAAQ;QACVY,kBACE,OAAOZ,WAAW,yBAChB,oBAACT;YACCuB,WAAU;YACVX,WAAWnB;YACX+B,QAAO;yBAEP,oBAACvB,sBAAe,SACfQ,wBAGH,oBAACgB;YAAKb,SAAS;yBACb,oBAACX,sBAAe,SACfQ,OAEJ;IACL,CAAC;IAED,IAAIiB,QAAQC,GAAG,CAACC,QAAQ,KAAK,iBAAiBN,WAAW;QACvD,IAAI,CAACN,SAAS,CAAC,gBAAgB,EAAE;YAC/BX,KAAM,wDAAuD;QAC/D,OAAO,IAAI,CAACW,SAAS,CAAC,KAAK,EAAE;YAC3BX,KACG,yFACD;QAEJ,CAAC;IACH,CAAC;IAED,IAAIS,WAAWC;IACf,IAAIO,aAAaR,aAAae,WAAW;QACvCf,WAAWH,WAAW,IAAI,CAAC,CAAC;IAC9B,CAAC;IAED,qBACE,oBAACb,kDACKkB;QACJJ,WAAWnB,2BAET0B,QACE,CAAA;YACEW,OAAO;YACPC,MAAM;YACNC,SAAS;QACX,CAAA,CAAC,CAACb,KAAK,EACTR,sCACAM,UAAUtB,SAASsC,OAAO,IAAI/B,eAAe,CAACe,MAAM,EACpDG,sCACAR;QAEFsB,SAAS;QACTC,YAAW;QACXC,kBAAiB;QACjBC,WAAW,KAAK;QAChBxB,MAAMA;QACNyB,iBAAe3B;QACfG,UAAUA;QAETP,wBAAU,oBAACgC;QAAI3B,SAAS;OAA+BL,uBACxD,oBAACR;QACCwB,WAAU;QACVX,SAAS;QACT4B,OAAOrB,SAAS,YAAY,MAAM,GAAG;QACrCK,QAAO;OAENhB,WAEFa,iBACAX,uBAAS,oBAAC6B;QAAI3B,SAAS;OAA8BF,QACrDS,SAAS,2BACR,oBAACoB;QAAI3B,SAAS;QAAiC6B,eAAAA,IAAW;QAACC,iBAAe/B;;AAIlF,EAAE"}
+{"version":3,"sources":["../../../src/components/TabsItem/TabsItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { TabsContextProps, TabsModeContext } from '../Tabs/Tabs';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './TabsItem.module.css';\n\nconst sizeYClassNames = {\n  none: styles['TabsItem--sizeY-none'],\n  [SizeType.COMPACT]: styles['TabsItem--sizeY-compact'],\n};\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  className,\n  role = 'tab',\n  tabIndex: tabIndexProp,\n  ...restProps\n}: TabsItemProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n  const { mode, withGaps }: TabsContextProps = 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          className={classNames(styles['TabsItem__status'], styles['TabsItem__status--count'])}\n          weight=\"2\"\n        >\n          <VisuallyHidden>&nbsp;</VisuallyHidden>\n          {status}\n        </Subhead>\n      ) : (\n        <span className={styles['TabsItem__status']}>\n          <VisuallyHidden>&nbsp;</VisuallyHidden>\n          {status}\n        </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      className={classNames(\n        styles['TabsItem'],\n        mode &&\n          {\n            default: styles['TabsItem--mode-default'],\n            accent: styles['TabsItem--mode-accent'],\n            secondary: styles['TabsItem--mode-secondary'],\n          }[mode],\n        selected && styles['TabsItem--selected'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        withGaps && styles['TabsItem--withGaps'],\n        className,\n      )}\n      hoverMode={styles['TabsItem--hover']}\n      activeMode=\"\"\n      focusVisibleMode=\"inside\"\n      hasActive={false}\n      role={role}\n      aria-selected={selected}\n      tabIndex={tabIndex}\n    >\n      {before && <div className={styles['TabsItem__before']}>{before}</div>}\n      <Headline\n        Component=\"span\"\n        className={styles['TabsItem__label']}\n        level={mode === 'default' ? '1' : '2'}\n        weight=\"2\"\n      >\n        {children}\n      </Headline>\n      {statusComponent}\n      {after && <div className={styles['TabsItem__after']}>{after}</div>}\n      {mode === 'default' && (\n        <div className={styles['TabsItem__underline']} aria-hidden data-selected={selected} />\n      )}\n    </Tappable>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","SizeType","warnOnce","TabsModeContext","Tappable","Headline","Subhead","VisuallyHidden","sizeYClassNames","none","COMPACT","warn","TabsItem","before","children","status","after","selected","className","role","tabIndex","tabIndexProp","restProps","sizeY","useContext","mode","withGaps","statusComponent","isTabFlow","Component","weight","span","process","env","NODE_ENV","undefined","default","accent","secondary","REGULAR","hoverMode","activeMode","focusVisibleMode","hasActive","aria-selected","div","level","aria-hidden","data-selected"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAA2BC,eAAe,QAAQ,eAAe;AACjE,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,cAAc,QAAQ,mCAAmC;AAGlE,IAAMC;IACJC,IAAI;GACHR,SAASS;AA6BZ,IAAMC,OAAOT,SAAS;AAEtB;;CAEC,GACD,OAAO,IAAMU,WAAW;QACtBC,gBAAAA,QACAC,kBAAAA,UACAC,gBAAAA,QACAC,eAAAA,gCACAC,UAAAA,wCAAW,yBACXC,mBAAAA,gCACAC,MAAAA,gCAAO,qBACPC,AAAUC,sBAAVD,UACGE;QARHT;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAA2BpB,iBAAAA,wCAAAA,eAAnBuB,OAAAA,0CAAQ;IAChB,IAA6CzB,oBAAAA,MAAM0B,WAAWrB,kBAAtDsB,OAAqC3B,kBAArC2B,MAAMC,WAA+B5B,kBAA/B4B;IACd,IAAIC,kBAAkB;IAEtB,IAAMC,YAAYT,SAAS;IAE3B,IAAIJ,QAAQ;QACVY,kBACE,OAAOZ,WAAW,yBAChB,oBAACT;YACCuB,WAAU;YACVX,WAAWnB;YACX+B,QAAO;yBAEP,oBAACvB,sBAAe,SACfQ,wBAGH,oBAACgB;YAAKb,SAAS;yBACb,oBAACX,sBAAe,SACfQ;IAGT;IAEA,IAAIiB,QAAQC,IAAIC,aAAa,iBAAiBN,WAAW;QACvD,IAAI,CAACN,SAAS,CAAC,gBAAgB,EAAE;YAC/BX,KAAM,wDAAuD;QAC/D,OAAO,IAAI,CAACW,SAAS,CAAC,KAAK,EAAE;YAC3BX,KACG,yFACD;QAEJ;IACF;IAEA,IAAIS,WAAWC;IACf,IAAIO,aAAaR,aAAae,WAAW;QACvCf,WAAWH,WAAW,IAAI,CAAC;IAC7B;IAEA,qBACE,oBAACb,kDACKkB;QACJJ,WAAWnB,2BAET0B,QACE,CAAA;YACEW,OAAO;YACPC,MAAM;YACNC,SAAS;QACX,CAAA,CAAC,CAACb,KAAK,EACTR,sCACAM,UAAUtB,SAASsC,WAAW/B,eAAe,CAACe,MAAM,EACpDG,sCACAR;QAEFsB,SAAS;QACTC,YAAW;QACXC,kBAAiB;QACjBC,WAAW;QACXxB,MAAMA;QACNyB,iBAAe3B;QACfG,UAAUA;QAETP,wBAAU,oBAACgC;QAAI3B,SAAS;OAA+BL,uBACxD,oBAACR;QACCwB,WAAU;QACVX,SAAS;QACT4B,OAAOrB,SAAS,YAAY,MAAM;QAClCK,QAAO;OAENhB,WAEFa,iBACAX,uBAAS,oBAAC6B;QAAI3B,SAAS;OAA8BF,QACrDS,SAAS,2BACR,oBAACoB;QAAI3B,SAAS;QAAiC6B,eAAAA;QAAYC,iBAAe/B;;AAIlF,EAAE"}

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

@@ -14,6 +14,10 @@ export interface TappableProps extends TappableElementProps, HasRootRef<HTMLElem
      * Указывает, должен ли компонент реагировать на hover-состояние
      */
     hasHover?: boolean;
+    /**
+     * Позволяет управлять hovered-состоянием извне
+     */
+    hovered?: boolean;
     /**
      * Указывает, должен ли компонент реагировать на active-состояние
      */
@@ -41,5 +45,5 @@ export declare const ACTIVE_EFFECT_DELAY = 600;
 /**
  * @see https://vkcom.github.io/VKUI/#/Tappable
  */
-export declare const Tappable: ({ children, Component, onClick, onKeyDown: _onKeyDown, activeEffectDelay, stopPropagation, getRootRef, hasHover: _hasHover, hoverMode, hasActive: _hasActive, activeMode, focusVisibleMode, onEnter, onLeave, className, ...props }: TappableProps) => JSX.Element;
+export declare const Tappable: ({ children, Component, onClick, onKeyDown: _onKeyDown, activeEffectDelay, stopPropagation, getRootRef, hasHover: _hasHover, hoverMode, hasActive: _hasActive, activeMode, focusVisibleMode, onEnter, onLeave, className, hovered: hoveredProp, ...props }: TappableProps) => React.JSX.Element;
 export {};

package/dist/components/Tappable/Tappable.js

@@ -1,8 +1,8 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
-import _sliced_to_array from "@swc/helpers/src/_sliced_to_array.mjs";
-import _to_consumable_array from "@swc/helpers/src/_to_consumable_array.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
+import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
+import { _ as _to_consumable_array } from "@swc/helpers/_/_to_consumable_array";
 import * as React from "react";
 import { classNames, noop } from "@vkontakte/vkjs";
 import mitt from "mitt";
@@ -181,7 +181,7 @@ function useActivity(hasActive, stopDelay) {
         var activeDuration = duration - ACTIVE_DELAY;
         stop(activeDuration >= 100 ? 0 : activeEffectDelay - activeDuration);
     };
-    var children = _param.children, Component = _param.Component, onClick = _param.onClick, _onKeyDown = _param.onKeyDown, _param_activeEffectDelay = _param.activeEffectDelay, activeEffectDelay = _param_activeEffectDelay === void 0 ? ACTIVE_EFFECT_DELAY : _param_activeEffectDelay, _param_stopPropagation = _param.stopPropagation, stopPropagation = _param_stopPropagation === void 0 ? false : _param_stopPropagation, getRootRef = _param.getRootRef, tmp = _param.hasHover, _hasHover = tmp === void 0 ? true : tmp, _param_hoverMode = _param.hoverMode, hoverMode = _param_hoverMode === void 0 ? "background" : _param_hoverMode, tmp1 = _param.hasActive, _hasActive = tmp1 === void 0 ? true : tmp1, _param_activeMode = _param.activeMode, activeMode = _param_activeMode === void 0 ? "background" : _param_activeMode, _param_focusVisibleMode = _param.focusVisibleMode, focusVisibleMode = _param_focusVisibleMode === void 0 ? "inside" : _param_focusVisibleMode, onEnter = _param.onEnter, onLeave = _param.onLeave, className = _param.className, props = _object_without_properties(_param, [
+    var children = _param.children, Component = _param.Component, onClick = _param.onClick, _onKeyDown = _param.onKeyDown, _param_activeEffectDelay = _param.activeEffectDelay, activeEffectDelay = _param_activeEffectDelay === void 0 ? ACTIVE_EFFECT_DELAY : _param_activeEffectDelay, _param_stopPropagation = _param.stopPropagation, stopPropagation = _param_stopPropagation === void 0 ? false : _param_stopPropagation, getRootRef = _param.getRootRef, tmp = _param.hasHover, _hasHover = tmp === void 0 ? true : tmp, _param_hoverMode = _param.hoverMode, hoverMode = _param_hoverMode === void 0 ? "background" : _param_hoverMode, tmp1 = _param.hasActive, _hasActive = tmp1 === void 0 ? true : tmp1, _param_activeMode = _param.activeMode, activeMode = _param_activeMode === void 0 ? "background" : _param_activeMode, _param_focusVisibleMode = _param.focusVisibleMode, focusVisibleMode = _param_focusVisibleMode === void 0 ? "inside" : _param_focusVisibleMode, onEnter = _param.onEnter, onLeave = _param.onLeave, className = _param.className, hoveredProp = _param.hovered, props = _object_without_properties(_param, [
         "children",
         "Component",
         "onClick",
@@ -196,7 +196,8 @@ function useActivity(hasActive, stopDelay) {
         "focusVisibleMode",
         "onEnter",
         "onLeave",
-        "className"
+        "className",
+        "hovered"
     ]);
     Component = Component || (props.href ? "a" : "div");
     var onHoverChange = React.useContext(TappableContext).onHoverChange;
@@ -209,7 +210,7 @@ function useActivity(hasActive, stopDelay) {
     var _React_useState = _sliced_to_array(React.useState([]), 2), clicks = _React_useState[0], setClicks = _React_useState[1];
     var _React_useState1 = _sliced_to_array(React.useState(false), 2), childHover = _React_useState1[0], setChildHover = _React_useState1[1];
     var _useBooleanState = useBooleanState(false), _hovered = _useBooleanState.value, setHoveredTrue = _useBooleanState.setTrue, setHoveredFalse = _useBooleanState.setFalse;
-    var hovered = _hovered && !props.disabled;
+    var hovered = (_hovered || hoveredProp) && !props.disabled;
     var hasActive = _hasActive && !childHover && !props.disabled;
     var hasHover = hasHoverContext && _hasHover && !childHover;
     var isCustomElement = Component !== "a" && Component !== "button" && Component !== "label" && !props.contentEditable;