@vkontakte/vkui 5.5.4 → 5.6.0

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.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;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"}
+{"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;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,UAAU,CAACrB,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,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;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,OAAO,IAAI/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.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Tappable/Tappable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport mitt from 'mitt';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useAdaptivityHasHover } from '../../hooks/useAdaptivityHasHover';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useBooleanState } from '../../hooks/useBooleanState';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusVisible } from '../../hooks/useFocusVisible';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { shouldTriggerClickOnEnterOrSpace } from '../../lib/accessibility';\nimport { SizeType } from '../../lib/adaptivity';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { getOffsetRect } from '../../lib/offset';\nimport { Platform } from '../../lib/platform';\nimport { coordX, coordY } from '../../lib/touch';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport {\n  AnchorHTMLAttributesOnly,\n  HasChildren,\n  HasComponent,\n  HasRootRef,\n  LiteralUnion,\n} from '../../types';\nimport { FocusVisible, FocusVisibleMode } from '../FocusVisible/FocusVisible';\nimport { Touch, TouchEvent, TouchProps } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport styles from './Tappable.module.css';\n\nconst sizeXClassNames = {\n  none: styles['Tappable--sizeX-none'],\n  compact: styles['Tappable--sizeX-compact'],\n};\n\ntype StateMode = 'opacity' | 'background';\n\nconst WAVE_LIVE = 225;\n\nexport type TappableElementProps = Omit<\n  React.AllHTMLAttributes<HTMLElement>,\n  | 'onTouchStart'\n  | 'onTouchMove'\n  | 'onTouchEnd'\n  | 'onTouchCancel'\n  | 'onMouseDown'\n  | 'onMouseMove'\n  | 'onMouseUp'\n  | 'onMouseLeave'\n> &\n  AnchorHTMLAttributesOnly; // В AllHTMLAttributes не хватает типов для ссылок\n\nexport interface TappableProps\n  extends TappableElementProps,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    HasChildren,\n    Pick<TouchProps, 'onStart' | 'onEnd' | 'onMove'> {\n  /**\n   * Длительность показа active-состояния\n   */\n  activeEffectDelay?: number;\n  stopPropagation?: boolean;\n  /**\n   * Указывает, должен ли компонент реагировать на hover-состояние\n   */\n  hasHover?: boolean;\n  /**\n   * Позволяет управлять hovered-состоянием извне\n   */\n  hovered?: boolean;\n  /**\n   * Указывает, должен ли компонент реагировать на active-состояние\n   */\n  hasActive?: boolean;\n  /**\n   * Стиль подсветки active-состояния. Если передать произвольную строку, она добавится как css-класс во время active\n   */\n  activeMode?: LiteralUnion<StateMode, string>;\n  /**\n   * Стиль подсветки hover-состояния. Если передать произвольную строку, она добавится как css-класс во время hover\n   */\n  hoverMode?: LiteralUnion<StateMode, string>;\n  /**\n   * Стиль аутлайна focus visible. Если передать произвольную строку, она добавится как css-класс во время focus-visible\n   */\n  focusVisibleMode?: LiteralUnion<FocusVisibleMode, string>;\n  onEnter?(outputEvent: MouseEvent): void;\n  onLeave?(outputEvent: MouseEvent): void;\n}\n\ninterface Wave {\n  x: number;\n  y: number;\n  id: number;\n}\n\nexport interface RootComponentProps extends TouchProps {\n  ref?: React.Ref<HTMLElement>;\n}\n\nexport const ACTIVE_DELAY = 70;\nexport const ACTIVE_EFFECT_DELAY = 600;\n\nconst activeBus = mitt<{ active: string }>();\nconst TapState = { none: 0, pending: 1, active: 2, exiting: 3 } as const;\n\ntype TappableContextInterface = { onHoverChange: (s: boolean) => void };\nconst TappableContext = React.createContext<TappableContextInterface>({\n  onHoverChange: noop,\n});\n\nfunction isPresetStateMode(stateMode: LiteralUnion<StateMode, string>): stateMode is StateMode {\n  switch (stateMode) {\n    case 'opacity':\n    case 'background':\n      return true;\n    default:\n      return false;\n  }\n}\n\nfunction useActivity(hasActive: boolean, stopDelay: number) {\n  const id = React.useMemo(() => Math.round(Math.random() * 1e8).toString(16), []);\n\n  const [activity, setActivity] = React.useState<(typeof TapState)[keyof typeof TapState]>(\n    TapState.none,\n  );\n  const _stop = () => setActivity(TapState.none);\n  const start = () => hasActive && setActivity(TapState.active);\n  const delayStart = () => {\n    hasActive && setActivity(TapState.pending);\n  };\n\n  const activeTimeout = useTimeout(start, ACTIVE_DELAY);\n  const stopTimeout = useTimeout(_stop, stopDelay);\n\n  useIsomorphicLayoutEffect(() => {\n    if (activity === TapState.pending) {\n      activeTimeout.set();\n      return activeTimeout.clear;\n    }\n    if (activity === TapState.exiting) {\n      return stopTimeout.clear;\n    }\n    if (activity === TapState.active) {\n      activeBus.emit('active', id);\n    }\n    return noop;\n  }, [activity]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (activity === TapState.none) {\n      return noop;\n    }\n    const onActiveChange = (activeId: string) => {\n      activeId !== id && _stop();\n    };\n    activeBus.on('active', onActiveChange);\n    return () => activeBus.off('active', onActiveChange);\n  }, [activity === TapState.none]);\n\n  useIsomorphicLayoutEffect(() => {\n    !hasActive && _stop();\n  }, [hasActive]);\n\n  const stop = (delay?: number) => {\n    if (delay) {\n      setActivity(TapState.exiting);\n      return stopTimeout.set(delay);\n    }\n    _stop();\n  };\n\n  return [activity, { delayStart, start, stop }] as const;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Tappable\n */\nexport const Tappable = ({\n  children,\n  Component,\n  onClick,\n  onKeyDown: _onKeyDown,\n  activeEffectDelay = ACTIVE_EFFECT_DELAY,\n  stopPropagation = false,\n  getRootRef,\n  hasHover: _hasHover = true,\n  hoverMode = 'background',\n  hasActive: _hasActive = true,\n  activeMode = 'background',\n  focusVisibleMode = 'inside',\n  onEnter,\n  onLeave,\n  className,\n  hovered: hoveredProp,\n  ...props\n}: TappableProps) => {\n  Component = Component || ((props.href ? 'a' : 'div') as React.ElementType);\n\n  const { onHoverChange } = React.useContext(TappableContext);\n  const insideTouchRoot = React.useContext(TouchRootContext);\n  const platform = usePlatform();\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n  const { sizeX = 'none' } = useAdaptivity();\n  const hasPointerContext = useAdaptivityHasPointer();\n  const hasHoverContext = useAdaptivityHasHover();\n\n  const [clicks, setClicks] = React.useState<Wave[]>([]);\n  const [childHover, setChildHover] = React.useState(false);\n  const {\n    value: _hovered,\n    setTrue: setHoveredTrue,\n    setFalse: setHoveredFalse,\n  } = useBooleanState(false);\n\n  const hovered = (_hovered || hoveredProp) && !props.disabled;\n  const hasActive = _hasActive && !childHover && !props.disabled;\n  const hasHover = hasHoverContext && _hasHover && !childHover;\n  const isCustomElement =\n    Component !== 'a' && Component !== 'button' && Component !== 'label' && !props.contentEditable;\n  const isPresetHoverMode = isPresetStateMode(hoverMode);\n  const isPresetActiveMode = isPresetStateMode(activeMode);\n  const isPresetFocusVisibleMode = ['inside', 'outside'].includes(focusVisibleMode);\n\n  const [activity, { start, stop, delayStart }] = useActivity(hasActive, activeEffectDelay);\n  const active = activity === TapState.active || activity === TapState.exiting;\n\n  const containerRef = useExternRef(getRootRef);\n\n  // hover propagation\n  const childContext = React.useRef({ onHoverChange: setChildHover }).current;\n  useIsomorphicLayoutEffect(() => {\n    if (!hovered) {\n      return noop;\n    }\n    onHoverChange(true);\n    return () => onHoverChange(false);\n  }, [hovered]);\n\n  /*\n   * [a11y]\n   * Обрабатывает событие onkeydown\n   * для кастомных доступных элементов:\n   * - role=\"link\" (активация по Enter)\n   * - role=\"button\" (активация по Space и Enter)\n   */\n  function onKeyDown(e: React.KeyboardEvent<HTMLElement>) {\n    if (isCustomElement && shouldTriggerClickOnEnterOrSpace(e)) {\n      e.preventDefault();\n      containerRef.current?.click();\n    }\n  }\n\n  const needWaves =\n    platform === Platform.ANDROID && !hasPointerContext && hasActive && activeMode === 'background';\n\n  const clearClicks = useTimeout(() => setClicks([]), WAVE_LIVE);\n\n  function addClick(x: number, y: number) {\n    const dateNow = Date.now();\n    const filteredClicks = clicks.filter((click) => click.id + WAVE_LIVE > dateNow);\n\n    setClicks([...filteredClicks, { x, y, id: dateNow }]);\n    clearClicks.set();\n  }\n\n  function onStart({ originalEvent }: TouchEvent) {\n    if (hasActive) {\n      if (originalEvent.touches && originalEvent.touches.length > 1) {\n        // r сожалению я так и не понял, что это делает и можно ли упихнуть его в Touch\n        return stop();\n      }\n\n      if (needWaves) {\n        const { top, left } = getOffsetRect(containerRef.current);\n        const x = coordX(originalEvent) - (left ?? 0);\n        const y = coordY(originalEvent) - (top ?? 0);\n        addClick(x, y);\n      }\n\n      delayStart();\n    }\n  }\n\n  function onMove({ isSlide }: TouchEvent) {\n    if (isSlide) {\n      stop();\n    }\n  }\n\n  function onEnd({ duration }: TouchEvent) {\n    if (activity === TapState.none) {\n      return;\n    }\n    if (activity === TapState.pending) {\n      // активировать при коротком тапе\n      start();\n    }\n\n    // отключить без задержки при длинном тапе\n    const activeDuration = duration - ACTIVE_DELAY;\n    stop(activeDuration >= 100 ? 0 : activeEffectDelay - activeDuration);\n  }\n\n  const classes = classNames(\n    className,\n    styles['Tappable'],\n    'vkuiInternalTappable',\n    platform === Platform.IOS && styles['Tappable--ios'],\n    sizeX !== SizeType.REGULAR && sizeXClassNames[sizeX],\n    hasHover && styles['Tappable--hasHover'],\n    hasActive && styles['Tappable--hasActive'],\n    hasHover && hovered && !isPresetHoverMode && hoverMode,\n    hasActive && active && !isPresetActiveMode && activeMode,\n    focusVisible && !isPresetFocusVisibleMode && focusVisibleMode,\n    hasHover &&\n      hovered &&\n      isPresetHoverMode &&\n      {\n        background: styles['Tappable--hover-background'],\n        opacity: styles['Tappable--hover-opacity'],\n      }[hoverMode],\n    hasActive &&\n      active &&\n      isPresetActiveMode &&\n      {\n        background: styles['Tappable--active-background'],\n        opacity: styles['Tappable--active-opacity'],\n      }[activeMode],\n    focusVisible && styles['Tappable--focus-visible'],\n  );\n\n  const handlers: RootComponentProps = {\n    onStart: callMultiple(onStart, props.onStart),\n    onMove: callMultiple(onMove, props.onMove),\n    onEnd: callMultiple(onEnd, props.onEnd),\n    onClick,\n    onKeyDown: callMultiple(onKeyDown, _onKeyDown),\n  };\n  const role = props.href ? 'link' : 'button';\n\n  return (\n    <Touch\n      onEnter={callMultiple(setHoveredTrue, onEnter)}\n      onLeave={callMultiple(setHoveredFalse, onLeave)}\n      type={Component === 'button' ? 'button' : undefined}\n      tabIndex={isCustomElement && !props.disabled ? 0 : undefined}\n      role={isCustomElement ? role : undefined}\n      aria-disabled={isCustomElement ? props.disabled : undefined}\n      stopPropagation={stopPropagation && !insideTouchRoot && !props.disabled}\n      {...props}\n      slideThreshold={20}\n      usePointerHover\n      className={classes}\n      Component={Component}\n      getRootRef={containerRef}\n      onBlur={callMultiple(onBlur, props.onBlur)}\n      onFocus={callMultiple(onFocus, props.onFocus)}\n      {...(props.disabled ? {} : handlers)}\n    >\n      <TappableContext.Provider value={childContext}>{children}</TappableContext.Provider>\n      {needWaves && (\n        <span aria-hidden className={styles.Tappable__waves}>\n          {clicks.map((wave) => (\n            <span\n              key={wave.id}\n              className={styles.Tappable__wave}\n              style={{ top: wave.y, left: wave.x }}\n            />\n          ))}\n        </span>\n      )}\n      {((hasHover && hoverMode === 'background') || (hasActive && activeMode === 'background')) && (\n        <span aria-hidden className={styles.Tappable__stateLayer} />\n      )}\n      {!props.disabled && isPresetFocusVisibleMode && (\n        <FocusVisible visible={focusVisible} mode={focusVisibleMode as FocusVisibleMode} />\n      )}\n    </Touch>\n  );\n};\n"],"names":["React","classNames","noop","mitt","useAdaptivity","useAdaptivityHasHover","useAdaptivityHasPointer","useBooleanState","useExternRef","useFocusVisible","usePlatform","useTimeout","shouldTriggerClickOnEnterOrSpace","SizeType","callMultiple","getOffsetRect","Platform","coordX","coordY","useIsomorphicLayoutEffect","FocusVisible","Touch","TouchRootContext","sizeXClassNames","none","compact","WAVE_LIVE","ACTIVE_DELAY","ACTIVE_EFFECT_DELAY","activeBus","TapState","pending","active","exiting","TappableContext","createContext","onHoverChange","isPresetStateMode","stateMode","useActivity","hasActive","stopDelay","id","useMemo","Math","round","random","toString","useState","activity","setActivity","_stop","start","delayStart","activeTimeout","stopTimeout","set","clear","emit","onActiveChange","activeId","on","off","stop","delay","Tappable","onKeyDown","e","isCustomElement","containerRef","preventDefault","current","click","addClick","x","y","dateNow","Date","now","filteredClicks","clicks","filter","setClicks","clearClicks","onStart","originalEvent","touches","length","needWaves","top","left","onMove","isSlide","onEnd","duration","activeDuration","activeEffectDelay","children","Component","onClick","_onKeyDown","stopPropagation","getRootRef","_hasHover","hasHover","hoverMode","_hasActive","activeMode","focusVisibleMode","onEnter","onLeave","className","hovered","hoveredProp","props","href","useContext","insideTouchRoot","platform","focusVisible","onBlur","onFocus","sizeX","hasPointerContext","hasHoverContext","childHover","setChildHover","value","_hovered","setTrue","setHoveredTrue","setFalse","setHoveredFalse","disabled","contentEditable","isPresetHoverMode","isPresetActiveMode","isPresetFocusVisibleMode","includes","childContext","useRef","ANDROID","classes","IOS","REGULAR","background","opacity","handlers","role","type","undefined","tabIndex","aria-disabled","slideThreshold","usePointerHover","Provider","span","aria-hidden","map","wave","key","style","visible","mode"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Tappable/Tappable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport mitt from 'mitt';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useAdaptivityHasHover } from '../../hooks/useAdaptivityHasHover';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useBooleanState } from '../../hooks/useBooleanState';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusVisible } from '../../hooks/useFocusVisible';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { shouldTriggerClickOnEnterOrSpace } from '../../lib/accessibility';\nimport { SizeType } from '../../lib/adaptivity';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { getOffsetRect } from '../../lib/offset';\nimport { Platform } from '../../lib/platform';\nimport { coordX, coordY } from '../../lib/touch';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport {\n  AnchorHTMLAttributesOnly,\n  HasChildren,\n  HasComponent,\n  HasRootRef,\n  LiteralUnion,\n} from '../../types';\nimport { FocusVisible, FocusVisibleMode } from '../FocusVisible/FocusVisible';\nimport { Touch, TouchEvent, TouchProps } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport styles from './Tappable.module.css';\n\nconst sizeXClassNames = {\n  none: styles['Tappable--sizeX-none'],\n  compact: styles['Tappable--sizeX-compact'],\n};\n\ntype StateMode = 'opacity' | 'background';\n\nconst WAVE_LIVE = 225;\n\nexport type TappableElementProps = Omit<\n  React.AllHTMLAttributes<HTMLElement>,\n  | 'onTouchStart'\n  | 'onTouchMove'\n  | 'onTouchEnd'\n  | 'onTouchCancel'\n  | 'onMouseDown'\n  | 'onMouseMove'\n  | 'onMouseUp'\n  | 'onMouseLeave'\n> &\n  AnchorHTMLAttributesOnly; // В AllHTMLAttributes не хватает типов для ссылок\n\nexport interface TappableProps\n  extends TappableElementProps,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    HasChildren,\n    Pick<TouchProps, 'onStart' | 'onEnd' | 'onMove'> {\n  /**\n   * Длительность показа active-состояния\n   */\n  activeEffectDelay?: number;\n  stopPropagation?: boolean;\n  /**\n   * Указывает, должен ли компонент реагировать на hover-состояние\n   */\n  hasHover?: boolean;\n  /**\n   * Позволяет управлять hovered-состоянием извне\n   */\n  hovered?: boolean;\n  /**\n   * Указывает, должен ли компонент реагировать на active-состояние\n   */\n  hasActive?: boolean;\n  /**\n   * Стиль подсветки active-состояния. Если передать произвольную строку, она добавится как css-класс во время active\n   */\n  activeMode?: LiteralUnion<StateMode, string>;\n  /**\n   * Стиль подсветки hover-состояния. Если передать произвольную строку, она добавится как css-класс во время hover\n   */\n  hoverMode?: LiteralUnion<StateMode, string>;\n  /**\n   * Стиль аутлайна focus visible. Если передать произвольную строку, она добавится как css-класс во время focus-visible\n   */\n  focusVisibleMode?: LiteralUnion<FocusVisibleMode, string>;\n  onEnter?(outputEvent: MouseEvent): void;\n  onLeave?(outputEvent: MouseEvent): void;\n}\n\ninterface Wave {\n  x: number;\n  y: number;\n  id: number;\n}\n\nexport interface RootComponentProps extends TouchProps {\n  ref?: React.Ref<HTMLElement>;\n}\n\nexport const ACTIVE_DELAY = 70;\nexport const ACTIVE_EFFECT_DELAY = 600;\n\nconst activeBus = mitt<{ active: string }>();\nconst TapState = { none: 0, pending: 1, active: 2, exiting: 3 } as const;\n\ntype TappableContextInterface = { onHoverChange: (s: boolean) => void };\nconst TappableContext = React.createContext<TappableContextInterface>({\n  onHoverChange: noop,\n});\n\nfunction isPresetStateMode(stateMode: LiteralUnion<StateMode, string>): stateMode is StateMode {\n  switch (stateMode) {\n    case 'opacity':\n    case 'background':\n      return true;\n    default:\n      return false;\n  }\n}\n\nfunction useActivity(hasActive: boolean, stopDelay: number) {\n  const id = React.useMemo(() => Math.round(Math.random() * 1e8).toString(16), []);\n\n  const [activity, setActivity] = React.useState<(typeof TapState)[keyof typeof TapState]>(\n    TapState.none,\n  );\n  const _stop = () => setActivity(TapState.none);\n  const start = () => hasActive && setActivity(TapState.active);\n  const delayStart = () => {\n    hasActive && setActivity(TapState.pending);\n  };\n\n  const activeTimeout = useTimeout(start, ACTIVE_DELAY);\n  const stopTimeout = useTimeout(_stop, stopDelay);\n\n  useIsomorphicLayoutEffect(() => {\n    if (activity === TapState.pending) {\n      activeTimeout.set();\n      return activeTimeout.clear;\n    }\n    if (activity === TapState.exiting) {\n      return stopTimeout.clear;\n    }\n    if (activity === TapState.active) {\n      activeBus.emit('active', id);\n    }\n    return noop;\n  }, [activity]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (activity === TapState.none) {\n      return noop;\n    }\n    const onActiveChange = (activeId: string) => {\n      activeId !== id && _stop();\n    };\n    activeBus.on('active', onActiveChange);\n    return () => activeBus.off('active', onActiveChange);\n  }, [activity === TapState.none]);\n\n  useIsomorphicLayoutEffect(() => {\n    !hasActive && _stop();\n  }, [hasActive]);\n\n  const stop = (delay?: number) => {\n    if (delay) {\n      setActivity(TapState.exiting);\n      return stopTimeout.set(delay);\n    }\n    _stop();\n  };\n\n  return [activity, { delayStart, start, stop }] as const;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Tappable\n */\nexport const Tappable = ({\n  children,\n  Component,\n  onClick,\n  onKeyDown: _onKeyDown,\n  activeEffectDelay = ACTIVE_EFFECT_DELAY,\n  stopPropagation = false,\n  getRootRef,\n  hasHover: _hasHover = true,\n  hoverMode = 'background',\n  hasActive: _hasActive = true,\n  activeMode = 'background',\n  focusVisibleMode = 'inside',\n  onEnter,\n  onLeave,\n  className,\n  hovered: hoveredProp,\n  ...props\n}: TappableProps) => {\n  Component = Component || ((props.href ? 'a' : 'div') as React.ElementType);\n\n  const { onHoverChange } = React.useContext(TappableContext);\n  const insideTouchRoot = React.useContext(TouchRootContext);\n  const platform = usePlatform();\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n  const { sizeX = 'none' } = useAdaptivity();\n  const hasPointerContext = useAdaptivityHasPointer();\n  const hasHoverContext = useAdaptivityHasHover();\n\n  const [clicks, setClicks] = React.useState<Wave[]>([]);\n  const [childHover, setChildHover] = React.useState(false);\n  const {\n    value: _hovered,\n    setTrue: setHoveredTrue,\n    setFalse: setHoveredFalse,\n  } = useBooleanState(false);\n\n  const hovered = (_hovered || hoveredProp) && !props.disabled;\n  const hasActive = _hasActive && !childHover && !props.disabled;\n  const hasHover = hasHoverContext && _hasHover && !childHover;\n  const isCustomElement =\n    Component !== 'a' && Component !== 'button' && Component !== 'label' && !props.contentEditable;\n  const isPresetHoverMode = isPresetStateMode(hoverMode);\n  const isPresetActiveMode = isPresetStateMode(activeMode);\n  const isPresetFocusVisibleMode = ['inside', 'outside'].includes(focusVisibleMode);\n\n  const [activity, { start, stop, delayStart }] = useActivity(hasActive, activeEffectDelay);\n  const active = activity === TapState.active || activity === TapState.exiting;\n\n  const containerRef = useExternRef(getRootRef);\n\n  // hover propagation\n  const childContext = React.useRef({ onHoverChange: setChildHover }).current;\n  useIsomorphicLayoutEffect(() => {\n    if (!hovered) {\n      return noop;\n    }\n    onHoverChange(true);\n    return () => onHoverChange(false);\n  }, [hovered]);\n\n  /*\n   * [a11y]\n   * Обрабатывает событие onkeydown\n   * для кастомных доступных элементов:\n   * - role=\"link\" (активация по Enter)\n   * - role=\"button\" (активация по Space и Enter)\n   */\n  function onKeyDown(e: React.KeyboardEvent<HTMLElement>) {\n    if (isCustomElement && shouldTriggerClickOnEnterOrSpace(e)) {\n      e.preventDefault();\n      containerRef.current?.click();\n    }\n  }\n\n  const needWaves =\n    platform === Platform.ANDROID && !hasPointerContext && hasActive && activeMode === 'background';\n\n  const clearClicks = useTimeout(() => setClicks([]), WAVE_LIVE);\n\n  function addClick(x: number, y: number) {\n    const dateNow = Date.now();\n    const filteredClicks = clicks.filter((click) => click.id + WAVE_LIVE > dateNow);\n\n    setClicks([...filteredClicks, { x, y, id: dateNow }]);\n    clearClicks.set();\n  }\n\n  function onStart({ originalEvent }: TouchEvent) {\n    if (hasActive) {\n      if (originalEvent.touches && originalEvent.touches.length > 1) {\n        // r сожалению я так и не понял, что это делает и можно ли упихнуть его в Touch\n        return stop();\n      }\n\n      if (needWaves) {\n        const { top, left } = getOffsetRect(containerRef.current);\n        const x = coordX(originalEvent) - (left ?? 0);\n        const y = coordY(originalEvent) - (top ?? 0);\n        addClick(x, y);\n      }\n\n      delayStart();\n    }\n  }\n\n  function onMove({ isSlide }: TouchEvent) {\n    if (isSlide) {\n      stop();\n    }\n  }\n\n  function onEnd({ duration }: TouchEvent) {\n    if (activity === TapState.none) {\n      return;\n    }\n    if (activity === TapState.pending) {\n      // активировать при коротком тапе\n      start();\n    }\n\n    // отключить без задержки при длинном тапе\n    const activeDuration = duration - ACTIVE_DELAY;\n    stop(activeDuration >= 100 ? 0 : activeEffectDelay - activeDuration);\n  }\n\n  const classes = classNames(\n    className,\n    styles['Tappable'],\n    'vkuiInternalTappable',\n    platform === Platform.IOS && styles['Tappable--ios'],\n    sizeX !== SizeType.REGULAR && sizeXClassNames[sizeX],\n    hasHover && styles['Tappable--hasHover'],\n    hasActive && styles['Tappable--hasActive'],\n    hasHover && hovered && !isPresetHoverMode && hoverMode,\n    hasActive && active && !isPresetActiveMode && activeMode,\n    focusVisible && !isPresetFocusVisibleMode && focusVisibleMode,\n    hasHover &&\n      hovered &&\n      isPresetHoverMode &&\n      {\n        background: styles['Tappable--hover-background'],\n        opacity: styles['Tappable--hover-opacity'],\n      }[hoverMode],\n    hasActive &&\n      active &&\n      isPresetActiveMode &&\n      {\n        background: styles['Tappable--active-background'],\n        opacity: styles['Tappable--active-opacity'],\n      }[activeMode],\n    focusVisible && styles['Tappable--focus-visible'],\n  );\n\n  const handlers: RootComponentProps = {\n    onStart: callMultiple(onStart, props.onStart),\n    onMove: callMultiple(onMove, props.onMove),\n    onEnd: callMultiple(onEnd, props.onEnd),\n    onClick,\n    onKeyDown: callMultiple(onKeyDown, _onKeyDown),\n  };\n  const role = props.href ? 'link' : 'button';\n\n  return (\n    <Touch\n      onEnter={callMultiple(setHoveredTrue, onEnter)}\n      onLeave={callMultiple(setHoveredFalse, onLeave)}\n      type={Component === 'button' ? 'button' : undefined}\n      tabIndex={isCustomElement && !props.disabled ? 0 : undefined}\n      role={isCustomElement ? role : undefined}\n      aria-disabled={isCustomElement ? props.disabled : undefined}\n      stopPropagation={stopPropagation && !insideTouchRoot && !props.disabled}\n      {...props}\n      slideThreshold={20}\n      usePointerHover\n      className={classes}\n      Component={Component}\n      getRootRef={containerRef}\n      onBlur={callMultiple(onBlur, props.onBlur)}\n      onFocus={callMultiple(onFocus, props.onFocus)}\n      {...(props.disabled ? {} : handlers)}\n    >\n      <TappableContext.Provider value={childContext}>{children}</TappableContext.Provider>\n      {needWaves && (\n        <span aria-hidden className={styles.Tappable__waves}>\n          {clicks.map((wave) => (\n            <span\n              key={wave.id}\n              className={styles.Tappable__wave}\n              style={{ top: wave.y, left: wave.x }}\n            />\n          ))}\n        </span>\n      )}\n      {((hasHover && hoverMode === 'background') || (hasActive && activeMode === 'background')) && (\n        <span aria-hidden className={styles.Tappable__stateLayer} />\n      )}\n      {!props.disabled && isPresetFocusVisibleMode && (\n        <FocusVisible visible={focusVisible} mode={focusVisibleMode as FocusVisibleMode} />\n      )}\n    </Touch>\n  );\n};\n"],"names":["React","classNames","noop","mitt","useAdaptivity","useAdaptivityHasHover","useAdaptivityHasPointer","useBooleanState","useExternRef","useFocusVisible","usePlatform","useTimeout","shouldTriggerClickOnEnterOrSpace","SizeType","callMultiple","getOffsetRect","Platform","coordX","coordY","useIsomorphicLayoutEffect","FocusVisible","Touch","TouchRootContext","sizeXClassNames","none","compact","WAVE_LIVE","ACTIVE_DELAY","ACTIVE_EFFECT_DELAY","activeBus","TapState","pending","active","exiting","TappableContext","createContext","onHoverChange","isPresetStateMode","stateMode","useActivity","hasActive","stopDelay","id","useMemo","Math","round","random","toString","useState","activity","setActivity","_stop","start","delayStart","activeTimeout","stopTimeout","set","clear","emit","onActiveChange","activeId","on","off","stop","delay","Tappable","onKeyDown","e","isCustomElement","containerRef","preventDefault","current","click","addClick","x","y","dateNow","Date","now","filteredClicks","clicks","filter","setClicks","clearClicks","onStart","originalEvent","touches","length","needWaves","top","left","onMove","isSlide","onEnd","duration","activeDuration","activeEffectDelay","children","Component","onClick","_onKeyDown","stopPropagation","getRootRef","_hasHover","hasHover","hoverMode","_hasActive","activeMode","focusVisibleMode","onEnter","onLeave","className","hovered","hoveredProp","props","href","useContext","insideTouchRoot","platform","focusVisible","onBlur","onFocus","sizeX","hasPointerContext","hasHoverContext","childHover","setChildHover","value","_hovered","setTrue","setHoveredTrue","setFalse","setHoveredFalse","disabled","contentEditable","isPresetHoverMode","isPresetActiveMode","isPresetFocusVisibleMode","includes","childContext","useRef","ANDROID","classes","IOS","REGULAR","background","opacity","handlers","role","type","undefined","tabIndex","aria-disabled","slideThreshold","usePointerHover","Provider","span","aria-hidden","map","wave","key","style","visible","mode"],"mappings":"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"}

package/dist/components/TextTooltip/TextTooltip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/TextTooltip/TextTooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { HoverPopper, HoverPopperProps } from '../HoverPopper/HoverPopper';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './TextTooltip.module.css';\n\nexport interface TextTooltipProps\n  extends Omit<HoverPopperProps, 'arrow' | 'arrowClassName' | 'content'> {\n  /**\n   * Текст тултипа\n   */\n  text?: React.ReactNode;\n  /**\n   * Заголовок тултипа\n   */\n  header?: React.ReactNode;\n  /**\n   * Стиль отображения подсказки\n   */\n  appearance?: 'accent' | 'neutral' | 'white' | 'black' | 'inversion';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/TextTooltip\n */\nexport const TextTooltip = ({\n  children,\n  text,\n  header,\n  appearance = 'neutral',\n  className,\n  ...popperProps\n}: TextTooltipProps) => {\n  return (\n    <HoverPopper\n      className={classNames(\n        styles['TextTooltip'],\n        appearance !== 'neutral' &&\n          {\n            accent: styles['TextTooltip--appearance-accent'],\n            white: styles['TextTooltip--appearance-white'],\n            black: styles['TextTooltip--appearance-black'],\n            inversion: styles['TextTooltip--appearance-inversion'],\n          }[appearance],\n        className,\n      )}\n      arrow\n      arrowClassName={styles['TextTooltip__arrow']}\n      content={\n        <React.Fragment>\n          {hasReactNode(header) && <Subhead weight=\"2\">{header}</Subhead>}\n          {hasReactNode(text) && <Subhead>{text}</Subhead>}\n        </React.Fragment>\n      }\n      {...popperProps}\n    >\n      {children}\n    </HoverPopper>\n  );\n};\n"],"names":["React","classNames","hasReactNode","HoverPopper","Subhead","TextTooltip","children","text","header","appearance","className","popperProps","accent","white","black","inversion","arrow","arrowClassName","content","Fragment","weight"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,WAAW,QAA0B,6BAA6B;AAC3E,SAASC,OAAO,QAAQ,gCAAgC;AAmBxD;;CAEC,GACD,OAAO,IAAMC,cAAc;QACzBC,kBAAAA,UACAC,cAAAA,MACAC,gBAAAA,mCACAC,YAAAA,4CAAa,+BACbC,mBAAAA,WACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,oBAACP;QACCO,WAAWT,8BAETQ,eAAe,aACb,CAAA;YACEG,MAAM;YACNC,KAAK;YACLC,KAAK;YACLC,SAAS;QACX,CAAA,CAAC,CAACN,WAAW,EACfC;QAEFM,OAAAA;QACAC,cAAc;QACdC,uBACE,oBAAClB,MAAMmB,gBACJjB,aAAaM,yBAAW,oBAACJ;YAAQgB,QAAO;WAAKZ,SAC7CN,aAAaK,uBAAS,oBAACH,eAASG;OAGjCI,cAEHL;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/TextTooltip/TextTooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { HoverPopper, HoverPopperProps } from '../HoverPopper/HoverPopper';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './TextTooltip.module.css';\n\nexport interface TextTooltipProps\n  extends Omit<HoverPopperProps, 'arrow' | 'arrowClassName' | 'content'> {\n  /**\n   * Текст тултипа\n   */\n  text?: React.ReactNode;\n  /**\n   * Заголовок тултипа\n   */\n  header?: React.ReactNode;\n  /**\n   * Стиль отображения подсказки\n   */\n  appearance?: 'accent' | 'neutral' | 'white' | 'black' | 'inversion';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/TextTooltip\n */\nexport const TextTooltip = ({\n  children,\n  text,\n  header,\n  appearance = 'neutral',\n  className,\n  ...popperProps\n}: TextTooltipProps) => {\n  return (\n    <HoverPopper\n      className={classNames(\n        styles['TextTooltip'],\n        appearance !== 'neutral' &&\n          {\n            accent: styles['TextTooltip--appearance-accent'],\n            white: styles['TextTooltip--appearance-white'],\n            black: styles['TextTooltip--appearance-black'],\n            inversion: styles['TextTooltip--appearance-inversion'],\n          }[appearance],\n        className,\n      )}\n      arrow\n      arrowClassName={styles['TextTooltip__arrow']}\n      content={\n        <React.Fragment>\n          {hasReactNode(header) && <Subhead weight=\"2\">{header}</Subhead>}\n          {hasReactNode(text) && <Subhead>{text}</Subhead>}\n        </React.Fragment>\n      }\n      {...popperProps}\n    >\n      {children}\n    </HoverPopper>\n  );\n};\n"],"names":["React","classNames","hasReactNode","HoverPopper","Subhead","TextTooltip","children","text","header","appearance","className","popperProps","accent","white","black","inversion","arrow","arrowClassName","content","Fragment","weight"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,WAAW,QAA0B,6BAA6B;AAC3E,SAASC,OAAO,QAAQ,gCAAgC;AAmBxD;;CAEC,GACD,OAAO,IAAMC,cAAc;QACzBC,kBAAAA,UACAC,cAAAA,MACAC,gBAAAA,mCACAC,YAAAA,4CAAa,+BACbC,mBAAAA,WACGC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,oBAACP;QACCO,WAAWT,8BAETQ,eAAe,aACb,CAAA;YACEG,MAAM;YACNC,KAAK;YACLC,KAAK;YACLC,SAAS;QACX,CAAA,CAAC,CAACN,WAAW,EACfC;QAEFM,OAAAA;QACAC,cAAc;QACdC,uBACE,oBAAClB,MAAMmB,QAAQ,QACZjB,aAAaM,yBAAW,oBAACJ;YAAQgB,QAAO;WAAKZ,SAC7CN,aAAaK,uBAAS,oBAACH,eAASG;OAGjCI,cAEHL;AAGP,EAAE"}

package/dist/components/Textarea/Textarea.js

@@ -41,8 +41,9 @@ var sizeYClassNames = _define_property({
     var _useAdaptivity = useAdaptivity(), _useAdaptivity_sizeY = _useAdaptivity.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? "none" : _useAdaptivity_sizeY;
     // autosize input
     React.useEffect(function() {
+        var _el;
         var el = elementRef.current;
-        if (grow && (el === null || el === void 0 ? void 0 : el.offsetParent)) {
+        if (grow && ((_el = el) === null || _el === void 0 ? void 0 : _el.offsetParent)) {
             el.style.height = "";
             el.style.height = "".concat(el.scrollHeight, "px");
             if (el.scrollHeight !== currentScrollHeight.current && onResize) {

package/dist/components/Textarea/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasRef, HasRootRef } from '../../types';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './Textarea.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Textarea--sizeY-none'],\n  [SizeType.COMPACT]: styles['Textarea--sizeY-compact'],\n};\n\nexport interface TextareaProps\n  extends React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n    HasRef<HTMLTextAreaElement>,\n    HasRootRef<HTMLElement>,\n    Pick<React.CSSProperties, 'maxHeight'>,\n    Pick<FormFieldProps, 'status'> {\n  grow?: boolean;\n  onResize?(el: HTMLTextAreaElement): void;\n  defaultValue?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Textarea\n */\nexport const Textarea = ({\n  defaultValue = '',\n  grow = true,\n  style,\n  onResize,\n  className,\n  getRootRef,\n  getRef,\n  rows = 2,\n  maxHeight,\n  status,\n  onChange: onChangeProp,\n  value: valueProp,\n  ...restProps\n}: TextareaProps) => {\n  const [value, onChange] = useEnsuredControl({\n    defaultValue,\n    onChange: onChangeProp,\n    value: valueProp,\n  });\n  const currentScrollHeight = React.useRef<number>();\n  const elementRef = useExternRef(getRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  // autosize input\n  React.useEffect(() => {\n    const el = elementRef.current;\n\n    if (grow && el?.offsetParent) {\n      el.style.height = '';\n      el.style.height = `${el.scrollHeight}px`;\n\n      if (el.scrollHeight !== currentScrollHeight.current && onResize) {\n        onResize(el);\n        currentScrollHeight.current = el.scrollHeight;\n      }\n    }\n  }, [grow, value, sizeY, elementRef, onResize]);\n\n  return (\n    <FormField\n      className={classNames(\n        styles['Textarea'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        className,\n      )}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={restProps.disabled}\n      status={status}\n    >\n      <Text\n        {...restProps}\n        Component=\"textarea\"\n        normalize={false}\n        style={{ maxHeight }}\n        rows={rows}\n        className={styles['Textarea__el']}\n        value={value}\n        onChange={onChange}\n        getRootRef={elementRef}\n      />\n    </FormField>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useEnsuredControl","useExternRef","SizeType","FormField","Text","sizeYClassNames","none","COMPACT","Textarea","defaultValue","grow","style","onResize","className","getRootRef","getRef","rows","maxHeight","status","onChange","onChangeProp","value","valueProp","restProps","currentScrollHeight","useRef","elementRef","sizeY","useEffect","el","current","offsetParent","height","scrollHeight","REGULAR","disabled","Component","normalize"],"mappings":";;;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,iBAAiB,QAAQ,gCAAgC;AAClE,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,QAAQ,QAAQ,uBAAuB;AAEhD,SAASC,SAAS,QAAwB,yBAAyB;AACnE,SAASC,IAAI,QAAQ,0BAA0B;AAG/C,IAAMC;IACJC,IAAI;GACHJ,SAASK;AAcZ;;CAEC,GACD,OAAO,IAAMC,WAAW;qCACtBC,cAAAA,gDAAe,+CACfC,MAAAA,gCAAO,oBACPC,eAAAA,OACAC,kBAAAA,UACAC,mBAAAA,WACAC,oBAAAA,YACAC,gBAAAA,6BACAC,MAAAA,gCAAO,iBACPC,mBAAAA,WACAC,gBAAAA,QACAC,AAAUC,sBAAVD,UACAE,AAAOC,mBAAPD,OACGE;QAZHd;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;;IAGA,IAA0BrB,sCAAAA,kBAAkB;QAC1CS,cAAAA;QACAU,UAAUC;QACVC,OAAOC;IACT,QAJOD,QAAmBrB,uBAAZmB,WAAYnB;IAK1B,IAAMwB,sBAAsB3B,MAAM4B;IAClC,IAAMC,aAAazB,aAAac;IAChC,IAA2BhB,iBAAAA,wCAAAA,eAAnB4B,OAAAA,0CAAQ;IAEhB,iBAAiB;IACjB9B,MAAM+B,UAAU;QACd,IAAMC,KAAKH,WAAWI;QAEtB,IAAIpB,QAAQmB,CAAAA,eAAAA,gBAAAA,KAAAA,IAAAA,GAAIE,YAAW,GAAG;YAC5BF,GAAGlB,MAAMqB,SAAS;YAClBH,GAAGlB,MAAMqB,SAAS,AAAC,GAAkB,OAAhBH,GAAGI,cAAa;YAErC,IAAIJ,GAAGI,iBAAiBT,oBAAoBM,WAAWlB,UAAU;gBAC/DA,SAASiB;gBACTL,oBAAoBM,UAAUD,GAAGI;YACnC;QACF;IACF,GAAG;QAACvB;QAAMW;QAAOM;QAAOD;QAAYd;KAAS;IAE7C,qBACE,oBAACT;QACCU,WAAWf,2BAET6B,UAAUzB,SAASgC,WAAW7B,eAAe,CAACsB,MAAM,EACpDd;QAEFF,OAAOA;QACPG,YAAYA;QACZqB,UAAUZ,UAAUY;QACpBjB,QAAQA;qBAER,oBAACd,8CACKmB;QACJa,WAAU;QACVC,WAAW;QACX1B,OAAO;YAAEM,WAAAA;QAAU;QACnBD,MAAMA;QACNH,SAAS;QACTQ,OAAOA;QACPF,UAAUA;QACVL,YAAYY;;AAIpB,EAAE"}
+{"version":3,"sources":["../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasRef, HasRootRef } from '../../types';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './Textarea.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Textarea--sizeY-none'],\n  [SizeType.COMPACT]: styles['Textarea--sizeY-compact'],\n};\n\nexport interface TextareaProps\n  extends React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n    HasRef<HTMLTextAreaElement>,\n    HasRootRef<HTMLElement>,\n    Pick<React.CSSProperties, 'maxHeight'>,\n    Pick<FormFieldProps, 'status'> {\n  grow?: boolean;\n  onResize?(el: HTMLTextAreaElement): void;\n  defaultValue?: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Textarea\n */\nexport const Textarea = ({\n  defaultValue = '',\n  grow = true,\n  style,\n  onResize,\n  className,\n  getRootRef,\n  getRef,\n  rows = 2,\n  maxHeight,\n  status,\n  onChange: onChangeProp,\n  value: valueProp,\n  ...restProps\n}: TextareaProps) => {\n  const [value, onChange] = useEnsuredControl({\n    defaultValue,\n    onChange: onChangeProp,\n    value: valueProp,\n  });\n  const currentScrollHeight = React.useRef<number>();\n  const elementRef = useExternRef(getRef);\n  const { sizeY = 'none' } = useAdaptivity();\n\n  // autosize input\n  React.useEffect(() => {\n    const el = elementRef.current;\n\n    if (grow && el?.offsetParent) {\n      el.style.height = '';\n      el.style.height = `${el.scrollHeight}px`;\n\n      if (el.scrollHeight !== currentScrollHeight.current && onResize) {\n        onResize(el);\n        currentScrollHeight.current = el.scrollHeight;\n      }\n    }\n  }, [grow, value, sizeY, elementRef, onResize]);\n\n  return (\n    <FormField\n      className={classNames(\n        styles['Textarea'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        className,\n      )}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={restProps.disabled}\n      status={status}\n    >\n      <Text\n        {...restProps}\n        Component=\"textarea\"\n        normalize={false}\n        style={{ maxHeight }}\n        rows={rows}\n        className={styles['Textarea__el']}\n        value={value}\n        onChange={onChange}\n        getRootRef={elementRef}\n      />\n    </FormField>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useEnsuredControl","useExternRef","SizeType","FormField","Text","sizeYClassNames","none","COMPACT","Textarea","defaultValue","grow","style","onResize","className","getRootRef","getRef","rows","maxHeight","status","onChange","onChangeProp","value","valueProp","restProps","currentScrollHeight","useRef","elementRef","sizeY","useEffect","el","current","offsetParent","height","scrollHeight","REGULAR","disabled","Component","normalize"],"mappings":";;;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,iBAAiB,QAAQ,gCAAgC;AAClE,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,QAAQ,QAAQ,uBAAuB;AAEhD,SAASC,SAAS,QAAwB,yBAAyB;AACnE,SAASC,IAAI,QAAQ,0BAA0B;AAG/C,IAAMC;IACJC,IAAI;GACHJ,SAASK,OAAO;AAcnB;;CAEC,GACD,OAAO,IAAMC,WAAW;qCACtBC,cAAAA,gDAAe,+CACfC,MAAAA,gCAAO,oBACPC,eAAAA,OACAC,kBAAAA,UACAC,mBAAAA,WACAC,oBAAAA,YACAC,gBAAAA,6BACAC,MAAAA,gCAAO,iBACPC,mBAAAA,WACAC,gBAAAA,QACAC,AAAUC,sBAAVD,UACAE,AAAOC,mBAAPD,OACGE;QAZHd;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;;IAGA,IAA0BrB,sCAAAA,kBAAkB;QAC1CS,cAAAA;QACAU,UAAUC;QACVC,OAAOC;IACT,QAJOD,QAAmBrB,uBAAZmB,WAAYnB;IAK1B,IAAMwB,sBAAsB3B,MAAM4B,MAAM;IACxC,IAAMC,aAAazB,aAAac;IAChC,IAA2BhB,iBAAAA,wCAAAA,eAAnB4B,OAAAA,0CAAQ;IAEhB,iBAAiB;IACjB9B,MAAM+B,SAAS,CAAC;YAGFC;QAFZ,IAAMA,KAAKH,WAAWI,OAAO;QAE7B,IAAIpB,UAAQmB,MAAAA,gBAAAA,0BAAAA,IAAIE,YAAY,GAAE;YAC5BF,GAAGlB,KAAK,CAACqB,MAAM,GAAG;YAClBH,GAAGlB,KAAK,CAACqB,MAAM,GAAG,AAAC,GAAkB,OAAhBH,GAAGI,YAAY,EAAC;YAErC,IAAIJ,GAAGI,YAAY,KAAKT,oBAAoBM,OAAO,IAAIlB,UAAU;gBAC/DA,SAASiB;gBACTL,oBAAoBM,OAAO,GAAGD,GAAGI,YAAY;YAC/C;QACF;IACF,GAAG;QAACvB;QAAMW;QAAOM;QAAOD;QAAYd;KAAS;IAE7C,qBACE,oBAACT;QACCU,WAAWf,2BAET6B,UAAUzB,SAASgC,OAAO,IAAI7B,eAAe,CAACsB,MAAM,EACpDd;QAEFF,OAAOA;QACPG,YAAYA;QACZqB,UAAUZ,UAAUY,QAAQ;QAC5BjB,QAAQA;qBAER,oBAACd,8CACKmB;QACJa,WAAU;QACVC,WAAW;QACX1B,OAAO;YAAEM,WAAAA;QAAU;QACnBD,MAAMA;QACNH,SAAS;QACTQ,OAAOA;QACPF,UAAUA;QACVL,YAAYY;;AAIpB,EAAE"}

package/dist/components/Tooltip/Tooltip.js

@@ -72,7 +72,8 @@ function isVerticalPlacement(placement) {
     var _React_useState = _sliced_to_array(React.useState(null), 2), arrowRef = _React_useState[0], setArrowRef = _React_useState[1];
     var _React_useState1 = _sliced_to_array(React.useState(null), 2), target = _React_useState1[0], setTarget = _React_useState1[1];
     /* eslint-disable no-restricted-properties */ var tooltipContainer = React.useMemo(function() {
-        return target === null || target === void 0 ? void 0 : target.closest("[".concat(tooltipContainerAttr, "]"));
+        var _target;
+        return (_target = target) === null || _target === void 0 ? void 0 : _target.closest("[".concat(tooltipContainerAttr, "]"));
     }, [
         target
     ]);
@@ -91,7 +92,8 @@ function isVerticalPlacement(placement) {
         ].filter(Boolean).join(" "), "error");
     }
     var floatingPositionStrategy = React.useMemo(function() {
-        return (target === null || target === void 0 ? void 0 : target.style.position) === "fixed" ? "fixed" : "absolute";
+        var _target;
+        return ((_target = target) === null || _target === void 0 ? void 0 : _target.style.position) === "fixed" ? "fixed" : "absolute";
     }, [
         target
     ]);

package/dist/components/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport ReactDOM from 'react-dom';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport {\n  arrowMiddleware,\n  autoPlacementMiddleware,\n  autoUpdateFloatingElement,\n  checkIsNotAutoPlacement,\n  convertFloatingDataToReactCSSProperties,\n  flipMiddleware,\n  getAutoPlacementAlign,\n  offsetMiddleware,\n  type Placement,\n  type PlacementWithAuto,\n  shiftMiddleware,\n  useFloating,\n  type UseFloatingMiddleware,\n} from '../../lib/floating';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasRootRef } from '../../types';\nimport { useNavTransition } from '../NavTransitionContext/NavTransitionContext';\nimport { DefaultIcon } from '../PopperArrow/DefaultIcon';\nimport { PopperArrow, type PopperArrowProps } from '../PopperArrow/PopperArrow';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { tooltipContainerAttr } from './TooltipContainer';\nimport styles from './Tooltip.module.css';\n\n/**\n * Перебиваем `ref`.\n *\n * В оригинальном `React.DOMElement` задаётся `React.LegacyRef<T>`, в котором есть `string`.\n * Когда как `{ ref: \"string\" }` уже давно депрекейтнут.\n */\ninterface DOMElement<P extends React.HTMLAttributes<T> | React.SVGAttributes<T>, T extends Element>\n  extends React.DOMElement<P, T> {\n  ref: React.Ref<T>;\n}\n\nconst isDOMTypeElement = <\n  P extends React.HTMLAttributes<T> | React.SVGAttributes<T>,\n  T extends Element,\n>(\n  element: React.ReactElement,\n): element is DOMElement<P, T> => {\n  return React.isValidElement(element) && typeof element.type === 'string';\n};\n\nconst warn = warnOnce('Tooltip');\n\nconst stylesAppearance = {\n  accent: styles['Tooltip--appearance-accent'],\n  white: styles['Tooltip--appearance-white'],\n  black: styles['Tooltip--appearance-black'],\n  inversion: styles['Tooltip--appearance-inversion'],\n};\n\nexport interface TooltipProps {\n  /**\n   * **Важно**: если в `children` передан React-компонент, то необходимо убедиться в том, что он поддерживает\n   * свойство `getRootRef`, которое должно возвращаться ссылку на корневой DOM-элемент компонента,\n   * иначе тултип показан не будет. Если передан React-element, то такой проблемы нет.\n   */\n  children: React.ReactElement<HasRootRef<any>> | React.ReactElement;\n  /**\n   * Стиль отображения подсказки\n   */\n  appearance?: 'accent' | 'neutral' | 'white' | 'black' | 'inversion';\n  /**\n   * Если передан `false`, то рисуется просто `children`.\n   */\n  isShown?: boolean;\n  /**\n   * Текст тултипа.\n   */\n  text?: React.ReactNode;\n  /**\n   * Заголовок тултипа.\n   */\n  header?: React.ReactNode;\n  /**\n   * Положение по горизонтали (прижатие к левому или правому краю `children`).\n   * Если не задано, позиция по горизонтали определятся автоматически\n   */\n  alignX?: 'center' | 'left' | 'right';\n  /**\n   * Положение по вертикали (расположение над или под `children`).\n   * Если не задано, позиция по вертикали определятся автоматически\n   */\n  alignY?: 'top' | 'bottom';\n  /**\n   * Сдвиг по горизонтали (относительно портала, в котором рисуется тултип).\n   */\n  offsetX?: number;\n  /**\n   * Сдвиг по вертикали (относительно портала, в котором рисуется тултип).\n   */\n  offsetY?: number;\n  /**\n   * Отображать ли стрелку, указывающую на якорный элемент\n   */\n  arrow?: boolean;\n  /**\n   * Безопасная зона вокруг стрелки, чтобы та не выходила за края контента.\n   */\n  arrowPadding?: number;\n  /**\n   * Пользовательская SVG иконка.\n   *\n   * Требования:\n   *\n   * 1. Иконка по умолчанию должна быть направлена вверх (a.k.a `IconUp`).\n   * 2. Чтобы избежать проблемы с пространством между стрелкой и контентом на некоторых экранах,\n   *    растяните кривую по высоте на `1px` и увеличьте на этот размер `height` и `viewBox` SVG.\n   *    (см. https://github.com/VKCOM/VKUI/pull/4496).\n   * 3. Убедитесь, что компонент принимает все валидные для SVG параметры.\n   * 4. Убедитесь, что SVG и её элементы наследует цвет через `fill=\"currentColor\"`.\n   * 5. Если стрелка наезжает на якорный элемент, то увеличьте значение параметра `offsetY`.\n   */\n  ArrowIcon?: PopperArrowProps['Icon'];\n  /**\n   * Сдвиг стрелочки относительно центра дочернего элемента.\n   */\n  cornerOffset?: number;\n  /**\n   * Сдвиг стрелочки относительно ширины тултипа\n   */\n  cornerAbsoluteOffset?: number;\n  /**\n   * Callback, который вызывается при клике по любому месту в пределах экрана.\n   */\n  onClose?: () => void;\n  /**\n   * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n   */\n  placement?: PlacementWithAuto;\n  /**\n   * Пользовательские css-классы, будут добавлены на root-элемент\n   */\n  className?: string;\n}\n\nfunction mapAlignX(x: TooltipProps['alignX']) {\n  switch (x) {\n    case 'left':\n      return 'start';\n    case 'right':\n      return 'end';\n    default:\n      return '';\n  }\n}\nfunction getDefaultPlacement(\n  alignX: TooltipProps['alignX'],\n  alignY: TooltipProps['alignY'],\n): Placement {\n  return [alignY || 'bottom', mapAlignX(alignX || 'left')]\n    .filter((p) => !!p)\n    .join('-') as Placement;\n}\nfunction isVerticalPlacement(placement: PlacementWithAuto) {\n  return placement.startsWith('top') || placement.startsWith('bottom');\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Tooltip\n */\nexport const Tooltip = ({\n  children,\n  isShown: isShownProp = true,\n  offsetX = 0,\n  offsetY = 15,\n  alignX,\n  alignY,\n  onClose,\n  cornerOffset = 0,\n  cornerAbsoluteOffset,\n  appearance = 'accent',\n  arrow = true,\n  arrowPadding = 14,\n  ArrowIcon = DefaultIcon,\n  placement: placementProp,\n  text,\n  header,\n  className,\n  ...restProps\n}: TooltipProps) => {\n  const [arrowRef, setArrowRef] = React.useState<HTMLDivElement | null>(null);\n  const [target, setTarget] = React.useState<HTMLElement | null>(null);\n  /* eslint-disable no-restricted-properties */\n  const tooltipContainer = React.useMemo(\n    () => target?.closest<HTMLDivElement>(`[${tooltipContainerAttr}]`),\n    [target],\n  );\n  const { entering } = useNavTransition();\n  const isShown = isShownProp && tooltipContainer && !entering;\n\n  const placement = placementProp || getDefaultPlacement(alignX, alignY);\n  const isNotAutoPlacement = checkIsNotAutoPlacement(placement);\n\n  if (process.env.NODE_ENV === 'development') {\n    const multiChildren = React.Children.count(children) > 1;\n    // Empty children is a noop\n    const primitiveChild = hasReactNode(children) && typeof children !== 'object';\n    (multiChildren || primitiveChild) &&\n      warn(\n        [\n          'children должен быть одним React элементом, получено',\n          multiChildren && 'несколько',\n          primitiveChild && JSON.stringify(children),\n        ]\n          .filter(Boolean)\n          .join(' '),\n        'error',\n      );\n  }\n\n  const floatingPositionStrategy = React.useMemo(\n    () => (target?.style.position === 'fixed' ? 'fixed' : 'absolute'),\n    [target],\n  );\n\n  if (process.env.NODE_ENV === 'development' && target && !tooltipContainer) {\n    throw new Error('Use TooltipContainer for Tooltip outside Panel (see docs)');\n  }\n\n  const memoizedMiddlewares = React.useMemo(() => {\n    const middlewares: UseFloatingMiddleware[] = [\n      offsetMiddleware({\n        crossAxis: offsetX,\n        mainAxis: offsetY,\n      }),\n    ];\n\n    // см. https://floating-ui.com/docs/flip#conflict-with-autoplacement\n    if (isNotAutoPlacement) {\n      middlewares.push(flipMiddleware());\n    } else {\n      middlewares.push(\n        autoPlacementMiddleware({\n          alignment: placement ? getAutoPlacementAlign(placement) : null,\n        }),\n      );\n    }\n\n    middlewares.push(shiftMiddleware());\n\n    // см. https://floating-ui.com/docs/arrow#order\n    if (arrow) {\n      middlewares.push(\n        arrowMiddleware({\n          element: arrowRef,\n          padding: arrowPadding,\n        }),\n      );\n      middlewares.push({\n        name: 'arrowOffset',\n        fn({ placement, middlewareData }) {\n          if (!middlewareData.arrow) {\n            return Promise.resolve({});\n          }\n          if (isVerticalPlacement(placement)) {\n            if (cornerAbsoluteOffset !== undefined) {\n              middlewareData.arrow.x = cornerAbsoluteOffset;\n            } else if (middlewareData.arrow.x !== undefined) {\n              middlewareData.arrow.x += cornerOffset;\n            }\n          } else {\n            if (cornerAbsoluteOffset !== undefined) {\n              middlewareData.arrow.y = cornerAbsoluteOffset;\n            } else if (middlewareData.arrow.y !== undefined) {\n              middlewareData.arrow.y += cornerOffset;\n            }\n          }\n          return Promise.resolve({});\n        },\n      });\n    }\n\n    return middlewares;\n  }, [\n    arrow,\n    arrowRef,\n    arrowPadding,\n    cornerAbsoluteOffset,\n    cornerOffset,\n    offsetX,\n    offsetY,\n    placement,\n    isNotAutoPlacement,\n  ]);\n\n  const {\n    x: floatingDataX,\n    y: floatingDataY,\n    placement: resolvedPlacement,\n    refs,\n    middlewareData: { arrow: arrowCoords },\n  } = useFloating({\n    strategy: floatingPositionStrategy,\n    placement: isNotAutoPlacement ? placement : undefined,\n    middleware: memoizedMiddlewares,\n    whileElementsMounted: autoUpdateFloatingElement,\n  });\n\n  const { document } = useDOM();\n  useGlobalEventListener(document, 'click', isShown && onClose, {\n    capture: true,\n    passive: true,\n  });\n\n  const childRef = isDOMTypeElement<React.HTMLAttributes<HTMLElement>, HTMLElement>(children)\n    ? children.ref\n    : React.isValidElement<HasRootRef<HTMLElement>>(children)\n    ? children.props.getRootRef\n    : null;\n  const patchedRef = useExternRef<HTMLElement>(setTarget, refs.setReference, childRef);\n  const child = React.isValidElement(children)\n    ? React.cloneElement(children, {\n        [isDOMTypeElement(children) ? 'ref' : 'getRootRef']: patchedRef,\n      })\n    : children;\n\n  return (\n    <React.Fragment>\n      {child}\n      {isShown &&\n        target != null &&\n        ReactDOM.createPortal(\n          <div\n            {...restProps}\n            className={classNames(\n              styles['Tooltip'],\n              appearance !== 'neutral' && stylesAppearance[appearance],\n              className,\n            )}\n          >\n            <div\n              ref={refs.setFloating}\n              style={convertFloatingDataToReactCSSProperties(\n                floatingPositionStrategy,\n                floatingDataX,\n                floatingDataY,\n              )}\n            >\n              {arrow && (\n                <PopperArrow\n                  coords={arrowCoords}\n                  placement={resolvedPlacement}\n                  arrowClassName={styles['Tooltip__arrow']}\n                  getRootRef={setArrowRef}\n                  Icon={ArrowIcon}\n                />\n              )}\n              <div className={styles['Tooltip__content']}>\n                {header && <Subhead weight=\"2\">{header}</Subhead>}\n                {text && <Subhead>{text}</Subhead>}\n              </div>\n            </div>\n          </div>,\n          tooltipContainer,\n        )}\n    </React.Fragment>\n  );\n};\n"],"names":["React","ReactDOM","classNames","hasReactNode","useExternRef","useGlobalEventListener","useDOM","arrowMiddleware","autoPlacementMiddleware","autoUpdateFloatingElement","checkIsNotAutoPlacement","convertFloatingDataToReactCSSProperties","flipMiddleware","getAutoPlacementAlign","offsetMiddleware","shiftMiddleware","useFloating","warnOnce","useNavTransition","DefaultIcon","PopperArrow","Subhead","tooltipContainerAttr","isDOMTypeElement","element","isValidElement","type","warn","stylesAppearance","accent","white","black","inversion","mapAlignX","x","getDefaultPlacement","alignX","alignY","filter","p","join","isVerticalPlacement","placement","startsWith","Tooltip","children","isShownProp","isShown","offsetX","offsetY","onClose","cornerOffset","cornerAbsoluteOffset","appearance","arrow","arrowPadding","ArrowIcon","placementProp","text","header","className","restProps","useState","arrowRef","setArrowRef","target","setTarget","tooltipContainer","useMemo","closest","entering","isNotAutoPlacement","process","env","NODE_ENV","multiChildren","Children","count","primitiveChild","JSON","stringify","Boolean","floatingPositionStrategy","style","position","Error","memoizedMiddlewares","middlewares","crossAxis","mainAxis","push","alignment","padding","name","fn","middlewareData","Promise","resolve","undefined","y","strategy","middleware","whileElementsMounted","floatingDataX","floatingDataY","resolvedPlacement","refs","arrowCoords","document","capture","passive","childRef","ref","props","getRootRef","patchedRef","setReference","child","cloneElement","Fragment","createPortal","div","setFloating","coords","arrowClassName","Icon","weight"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport ReactDOM from 'react-dom';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport {\n  arrowMiddleware,\n  autoPlacementMiddleware,\n  autoUpdateFloatingElement,\n  checkIsNotAutoPlacement,\n  convertFloatingDataToReactCSSProperties,\n  flipMiddleware,\n  getAutoPlacementAlign,\n  offsetMiddleware,\n  type Placement,\n  type PlacementWithAuto,\n  shiftMiddleware,\n  useFloating,\n  type UseFloatingMiddleware,\n} from '../../lib/floating';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasRootRef } from '../../types';\nimport { useNavTransition } from '../NavTransitionContext/NavTransitionContext';\nimport { DefaultIcon } from '../PopperArrow/DefaultIcon';\nimport { PopperArrow, type PopperArrowProps } from '../PopperArrow/PopperArrow';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { tooltipContainerAttr } from './TooltipContainer';\nimport styles from './Tooltip.module.css';\n\n/**\n * Перебиваем `ref`.\n *\n * В оригинальном `React.DOMElement` задаётся `React.LegacyRef<T>`, в котором есть `string`.\n * Когда как `{ ref: \"string\" }` уже давно депрекейтнут.\n */\ninterface DOMElement<P extends React.HTMLAttributes<T> | React.SVGAttributes<T>, T extends Element>\n  extends React.DOMElement<P, T> {\n  ref: React.Ref<T>;\n}\n\nconst isDOMTypeElement = <\n  P extends React.HTMLAttributes<T> | React.SVGAttributes<T>,\n  T extends Element,\n>(\n  element: React.ReactElement,\n): element is DOMElement<P, T> => {\n  return React.isValidElement(element) && typeof element.type === 'string';\n};\n\nconst warn = warnOnce('Tooltip');\n\nconst stylesAppearance = {\n  accent: styles['Tooltip--appearance-accent'],\n  white: styles['Tooltip--appearance-white'],\n  black: styles['Tooltip--appearance-black'],\n  inversion: styles['Tooltip--appearance-inversion'],\n};\n\nexport interface TooltipProps {\n  /**\n   * **Важно**: если в `children` передан React-компонент, то необходимо убедиться в том, что он поддерживает\n   * свойство `getRootRef`, которое должно возвращаться ссылку на корневой DOM-элемент компонента,\n   * иначе тултип показан не будет. Если передан React-element, то такой проблемы нет.\n   */\n  children: React.ReactElement<HasRootRef<any>> | React.ReactElement;\n  /**\n   * Стиль отображения подсказки\n   */\n  appearance?: 'accent' | 'neutral' | 'white' | 'black' | 'inversion';\n  /**\n   * Если передан `false`, то рисуется просто `children`.\n   */\n  isShown?: boolean;\n  /**\n   * Текст тултипа.\n   */\n  text?: React.ReactNode;\n  /**\n   * Заголовок тултипа.\n   */\n  header?: React.ReactNode;\n  /**\n   * Положение по горизонтали (прижатие к левому или правому краю `children`).\n   * Если не задано, позиция по горизонтали определятся автоматически\n   */\n  alignX?: 'center' | 'left' | 'right';\n  /**\n   * Положение по вертикали (расположение над или под `children`).\n   * Если не задано, позиция по вертикали определятся автоматически\n   */\n  alignY?: 'top' | 'bottom';\n  /**\n   * Сдвиг по горизонтали (относительно портала, в котором рисуется тултип).\n   */\n  offsetX?: number;\n  /**\n   * Сдвиг по вертикали (относительно портала, в котором рисуется тултип).\n   */\n  offsetY?: number;\n  /**\n   * Отображать ли стрелку, указывающую на якорный элемент\n   */\n  arrow?: boolean;\n  /**\n   * Безопасная зона вокруг стрелки, чтобы та не выходила за края контента.\n   */\n  arrowPadding?: number;\n  /**\n   * Пользовательская SVG иконка.\n   *\n   * Требования:\n   *\n   * 1. Иконка по умолчанию должна быть направлена вверх (a.k.a `IconUp`).\n   * 2. Чтобы избежать проблемы с пространством между стрелкой и контентом на некоторых экранах,\n   *    растяните кривую по высоте на `1px` и увеличьте на этот размер `height` и `viewBox` SVG.\n   *    (см. https://github.com/VKCOM/VKUI/pull/4496).\n   * 3. Убедитесь, что компонент принимает все валидные для SVG параметры.\n   * 4. Убедитесь, что SVG и её элементы наследует цвет через `fill=\"currentColor\"`.\n   * 5. Если стрелка наезжает на якорный элемент, то увеличьте значение параметра `offsetY`.\n   */\n  ArrowIcon?: PopperArrowProps['Icon'];\n  /**\n   * Сдвиг стрелочки относительно центра дочернего элемента.\n   */\n  cornerOffset?: number;\n  /**\n   * Сдвиг стрелочки относительно ширины тултипа\n   */\n  cornerAbsoluteOffset?: number;\n  /**\n   * Callback, который вызывается при клике по любому месту в пределах экрана.\n   */\n  onClose?: () => void;\n  /**\n   * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n   */\n  placement?: PlacementWithAuto;\n  /**\n   * Пользовательские css-классы, будут добавлены на root-элемент\n   */\n  className?: string;\n}\n\nfunction mapAlignX(x: TooltipProps['alignX']) {\n  switch (x) {\n    case 'left':\n      return 'start';\n    case 'right':\n      return 'end';\n    default:\n      return '';\n  }\n}\nfunction getDefaultPlacement(\n  alignX: TooltipProps['alignX'],\n  alignY: TooltipProps['alignY'],\n): Placement {\n  return [alignY || 'bottom', mapAlignX(alignX || 'left')]\n    .filter((p) => !!p)\n    .join('-') as Placement;\n}\nfunction isVerticalPlacement(placement: PlacementWithAuto) {\n  return placement.startsWith('top') || placement.startsWith('bottom');\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Tooltip\n */\nexport const Tooltip = ({\n  children,\n  isShown: isShownProp = true,\n  offsetX = 0,\n  offsetY = 15,\n  alignX,\n  alignY,\n  onClose,\n  cornerOffset = 0,\n  cornerAbsoluteOffset,\n  appearance = 'accent',\n  arrow = true,\n  arrowPadding = 14,\n  ArrowIcon = DefaultIcon,\n  placement: placementProp,\n  text,\n  header,\n  className,\n  ...restProps\n}: TooltipProps) => {\n  const [arrowRef, setArrowRef] = React.useState<HTMLDivElement | null>(null);\n  const [target, setTarget] = React.useState<HTMLElement | null>(null);\n  /* eslint-disable no-restricted-properties */\n  const tooltipContainer = React.useMemo(\n    () => target?.closest<HTMLDivElement>(`[${tooltipContainerAttr}]`),\n    [target],\n  );\n  const { entering } = useNavTransition();\n  const isShown = isShownProp && tooltipContainer && !entering;\n\n  const placement = placementProp || getDefaultPlacement(alignX, alignY);\n  const isNotAutoPlacement = checkIsNotAutoPlacement(placement);\n\n  if (process.env.NODE_ENV === 'development') {\n    const multiChildren = React.Children.count(children) > 1;\n    // Empty children is a noop\n    const primitiveChild = hasReactNode(children) && typeof children !== 'object';\n    (multiChildren || primitiveChild) &&\n      warn(\n        [\n          'children должен быть одним React элементом, получено',\n          multiChildren && 'несколько',\n          primitiveChild && JSON.stringify(children),\n        ]\n          .filter(Boolean)\n          .join(' '),\n        'error',\n      );\n  }\n\n  const floatingPositionStrategy = React.useMemo(\n    () => (target?.style.position === 'fixed' ? 'fixed' : 'absolute'),\n    [target],\n  );\n\n  if (process.env.NODE_ENV === 'development' && target && !tooltipContainer) {\n    throw new Error('Use TooltipContainer for Tooltip outside Panel (see docs)');\n  }\n\n  const memoizedMiddlewares = React.useMemo(() => {\n    const middlewares: UseFloatingMiddleware[] = [\n      offsetMiddleware({\n        crossAxis: offsetX,\n        mainAxis: offsetY,\n      }),\n    ];\n\n    // см. https://floating-ui.com/docs/flip#conflict-with-autoplacement\n    if (isNotAutoPlacement) {\n      middlewares.push(flipMiddleware());\n    } else {\n      middlewares.push(\n        autoPlacementMiddleware({\n          alignment: placement ? getAutoPlacementAlign(placement) : null,\n        }),\n      );\n    }\n\n    middlewares.push(shiftMiddleware());\n\n    // см. https://floating-ui.com/docs/arrow#order\n    if (arrow) {\n      middlewares.push(\n        arrowMiddleware({\n          element: arrowRef,\n          padding: arrowPadding,\n        }),\n      );\n      middlewares.push({\n        name: 'arrowOffset',\n        fn({ placement, middlewareData }) {\n          if (!middlewareData.arrow) {\n            return Promise.resolve({});\n          }\n          if (isVerticalPlacement(placement)) {\n            if (cornerAbsoluteOffset !== undefined) {\n              middlewareData.arrow.x = cornerAbsoluteOffset;\n            } else if (middlewareData.arrow.x !== undefined) {\n              middlewareData.arrow.x += cornerOffset;\n            }\n          } else {\n            if (cornerAbsoluteOffset !== undefined) {\n              middlewareData.arrow.y = cornerAbsoluteOffset;\n            } else if (middlewareData.arrow.y !== undefined) {\n              middlewareData.arrow.y += cornerOffset;\n            }\n          }\n          return Promise.resolve({});\n        },\n      });\n    }\n\n    return middlewares;\n  }, [\n    arrow,\n    arrowRef,\n    arrowPadding,\n    cornerAbsoluteOffset,\n    cornerOffset,\n    offsetX,\n    offsetY,\n    placement,\n    isNotAutoPlacement,\n  ]);\n\n  const {\n    x: floatingDataX,\n    y: floatingDataY,\n    placement: resolvedPlacement,\n    refs,\n    middlewareData: { arrow: arrowCoords },\n  } = useFloating({\n    strategy: floatingPositionStrategy,\n    placement: isNotAutoPlacement ? placement : undefined,\n    middleware: memoizedMiddlewares,\n    whileElementsMounted: autoUpdateFloatingElement,\n  });\n\n  const { document } = useDOM();\n  useGlobalEventListener(document, 'click', isShown && onClose, {\n    capture: true,\n    passive: true,\n  });\n\n  const childRef = isDOMTypeElement<React.HTMLAttributes<HTMLElement>, HTMLElement>(children)\n    ? children.ref\n    : React.isValidElement<HasRootRef<HTMLElement>>(children)\n    ? children.props.getRootRef\n    : null;\n  const patchedRef = useExternRef<HTMLElement>(setTarget, refs.setReference, childRef);\n  const child = React.isValidElement(children)\n    ? React.cloneElement(children, {\n        [isDOMTypeElement(children) ? 'ref' : 'getRootRef']: patchedRef,\n      })\n    : children;\n\n  return (\n    <React.Fragment>\n      {child}\n      {isShown &&\n        target != null &&\n        ReactDOM.createPortal(\n          <div\n            {...restProps}\n            className={classNames(\n              styles['Tooltip'],\n              appearance !== 'neutral' && stylesAppearance[appearance],\n              className,\n            )}\n          >\n            <div\n              ref={refs.setFloating}\n              style={convertFloatingDataToReactCSSProperties(\n                floatingPositionStrategy,\n                floatingDataX,\n                floatingDataY,\n              )}\n            >\n              {arrow && (\n                <PopperArrow\n                  coords={arrowCoords}\n                  placement={resolvedPlacement}\n                  arrowClassName={styles['Tooltip__arrow']}\n                  getRootRef={setArrowRef}\n                  Icon={ArrowIcon}\n                />\n              )}\n              <div className={styles['Tooltip__content']}>\n                {header && <Subhead weight=\"2\">{header}</Subhead>}\n                {text && <Subhead>{text}</Subhead>}\n              </div>\n            </div>\n          </div>,\n          tooltipContainer,\n        )}\n    </React.Fragment>\n  );\n};\n"],"names":["React","ReactDOM","classNames","hasReactNode","useExternRef","useGlobalEventListener","useDOM","arrowMiddleware","autoPlacementMiddleware","autoUpdateFloatingElement","checkIsNotAutoPlacement","convertFloatingDataToReactCSSProperties","flipMiddleware","getAutoPlacementAlign","offsetMiddleware","shiftMiddleware","useFloating","warnOnce","useNavTransition","DefaultIcon","PopperArrow","Subhead","tooltipContainerAttr","isDOMTypeElement","element","isValidElement","type","warn","stylesAppearance","accent","white","black","inversion","mapAlignX","x","getDefaultPlacement","alignX","alignY","filter","p","join","isVerticalPlacement","placement","startsWith","Tooltip","children","isShownProp","isShown","offsetX","offsetY","onClose","cornerOffset","cornerAbsoluteOffset","appearance","arrow","arrowPadding","ArrowIcon","placementProp","text","header","className","restProps","useState","arrowRef","setArrowRef","target","setTarget","tooltipContainer","useMemo","closest","entering","isNotAutoPlacement","process","env","NODE_ENV","multiChildren","Children","count","primitiveChild","JSON","stringify","Boolean","floatingPositionStrategy","style","position","Error","memoizedMiddlewares","middlewares","crossAxis","mainAxis","push","alignment","padding","name","fn","middlewareData","Promise","resolve","undefined","y","strategy","middleware","whileElementsMounted","floatingDataX","floatingDataY","resolvedPlacement","refs","arrowCoords","document","capture","passive","childRef","ref","props","getRootRef","patchedRef","setReference","child","cloneElement","Fragment","createPortal","div","setFloating","coords","arrowClassName","Icon","weight"],"mappings":"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"}

package/dist/components/Tooltip/TooltipContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Tooltip/TooltipContainer.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const tooltipContainerAttr = 'data-tooltip-container';\nexport const TooltipContainer = React.forwardRef<\n  HTMLDivElement,\n  React.HtmlHTMLAttributes<HTMLDivElement> & { fixed?: boolean }\n>(function TooltipContainer({ fixed = false, ...props }, ref) {\n  (props as any)[tooltipContainerAttr] = fixed ? 'fixed' : 'true';\n  return <div {...props} ref={ref} />;\n});\n"],"names":["React","tooltipContainerAttr","TooltipContainer","forwardRef","ref","fixed","props","div"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAE/B,OAAO,IAAMC,uBAAuB,yBAAyB;AAC7D,OAAO,IAAMC,iCAAmBF,MAAMG,WAGpC,SAASD,iBAAiB,QAA6BE,GAAG;uBAAhC,OAAEC,OAAAA,kCAAQ,sBAAUC,mCAApB;QAAED;;IAC3BC,KAAa,CAACL,qBAAqB,GAAGI,QAAQ,UAAU;IACzD,qBAAO,oBAACE,+CAAQD;QAAOF,KAAKA;;AAC9B,GAAG"}
+{"version":3,"sources":["../../../src/components/Tooltip/TooltipContainer.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const tooltipContainerAttr = 'data-tooltip-container';\nexport const TooltipContainer = React.forwardRef<\n  HTMLDivElement,\n  React.HtmlHTMLAttributes<HTMLDivElement> & { fixed?: boolean }\n>(function TooltipContainer({ fixed = false, ...props }, ref) {\n  (props as any)[tooltipContainerAttr] = fixed ? 'fixed' : 'true';\n  return <div {...props} ref={ref} />;\n});\n"],"names":["React","tooltipContainerAttr","TooltipContainer","forwardRef","ref","fixed","props","div"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAE/B,OAAO,IAAMC,uBAAuB,yBAAyB;AAC7D,OAAO,IAAMC,iCAAmBF,MAAMG,UAAU,CAG9C,SAASD,iBAAiB,QAA6BE,GAAG;uBAAhC,OAAEC,OAAAA,kCAAQ,sBAAUC,mCAApB;QAAED;;IAC3BC,KAAa,CAACL,qBAAqB,GAAGI,QAAQ,UAAU;IACzD,qBAAO,oBAACE,+CAAQD;QAAOF,KAAKA;;AAC9B,GAAG"}

package/dist/components/Touch/Touch.js

@@ -122,7 +122,7 @@ import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
     var handle = function(e, handlers) {
         stopPropagation && e.stopPropagation();
         handlers.forEach(function(cb) {
-            var _gesture_current, _gesture_current_startT;
+            var _gesture_current_startT, _gesture_current;
             var _gesture_current_startT_getTime;
             var duration = Date.now() - ((_gesture_current_startT_getTime = (_gesture_current = gesture.current) === null || _gesture_current === void 0 ? void 0 : (_gesture_current_startT = _gesture_current.startT) === null || _gesture_current_startT === void 0 ? void 0 : _gesture_current_startT.getTime()) !== null && _gesture_current_startT_getTime !== void 0 ? _gesture_current_startT_getTime : 0);
             cb && cb(_object_spread_props(_object_spread({}, gesture.current), {

package/dist/components/Touch/Touch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Touch/Touch.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useDOM } from '../../lib/dom';\nimport { coordX, coordY, getSupportedEvents, touchEnabled, VKUITouchEvent } from '../../lib/touch';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HasComponent, HasRootRef } from '../../types';\n\nexport interface TouchProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent {\n  /**\n   * Привязать onEnter и onLeave через pointer-events - работает на disabled-инпутах\n   */\n  usePointerHover?: boolean;\n  useCapture?: boolean;\n  slideThreshold?: number;\n  noSlideClick?: boolean;\n  onEnter?: HoverHandler;\n  onLeave?: HoverHandler;\n  onStart?: TouchEventHandler;\n  onStartX?: TouchEventHandler;\n  onStartY?: TouchEventHandler;\n  onMove?: TouchEventHandler;\n  onMoveX?: TouchEventHandler;\n  onMoveY?: TouchEventHandler;\n  onEnd?: TouchEventHandler;\n  onEndX?: TouchEventHandler;\n  onEndY?: TouchEventHandler;\n  stopPropagation?: boolean;\n}\n\nexport interface Gesture {\n  startX: number;\n  startY: number;\n  startT: Date;\n  duration: number;\n  isPressed: boolean;\n  isY: boolean;\n  isX: boolean;\n  isSlideX: boolean;\n  isSlideY: boolean;\n  isSlide: boolean;\n  shiftX: number;\n  shiftY: number;\n  shiftXAbs: number;\n  shiftYAbs: number;\n}\n\nexport interface TouchEvent extends Gesture {\n  originalEvent: VKUITouchEvent;\n}\n\ntype HoverHandler = (outputEvent: MouseEvent) => void;\nexport type TouchEventHandler = (e: TouchEvent) => void;\nexport type ClickHandler = (e: React.MouseEvent<HTMLElement>) => void;\nexport type DragHandler = (e: React.DragEvent<HTMLElement>) => void;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Touch\n */\nexport const Touch = ({\n  onStart,\n  onStartX,\n  onStartY,\n  onMove: _onMove,\n  onMoveX,\n  onMoveY,\n  onLeave,\n  onEnter,\n  onEnd: _onEnd,\n  onEndX,\n  onEndY,\n  onClickCapture,\n  usePointerHover,\n  slideThreshold = 5,\n  useCapture = false,\n  Component = 'div',\n  getRootRef,\n  noSlideClick = false,\n  stopPropagation = false,\n  ...restProps\n}: TouchProps) => {\n  const { document } = useDOM();\n  const events = React.useMemo(getSupportedEvents, []);\n  const didSlide = React.useRef(false);\n  const gesture = React.useRef<Partial<Gesture> | null>(null);\n  const handle = (e: VKUITouchEvent, handlers: Array<TouchEventHandler | undefined | false>) => {\n    stopPropagation && e.stopPropagation();\n    handlers.forEach((cb) => {\n      const duration = Date.now() - (gesture.current?.startT?.getTime() ?? 0);\n      cb && cb({ ...(gesture.current as Gesture), duration, originalEvent: e });\n    });\n  };\n\n  const enterHandler = useEventListener(usePointerHover ? 'pointerenter' : 'mouseenter', onEnter);\n  const leaveHandler = useEventListener(usePointerHover ? 'pointerleave' : 'mouseleave', onLeave);\n  const startHandler = useEventListener(\n    events[0],\n    (e: VKUITouchEvent) => {\n      gesture.current = initGesture(coordX(e), coordY(e));\n\n      handle(e, [onStart, onStartX, onStartY]);\n      // 1 line, 2 bad specs, 2 workarounds:\n      subscribe(\n        touchEnabled()\n          ? // Touch events fire on initial target, and won't bubble if its removed\n            // see: #235, #1968, https://stackoverflow.com/a/45760014\n            (e.target as HTMLElement)\n          : // Mouse events fire on the element under pointer, so we lose move / end\n            // if pointer goes outside container.\n            // Can be fixed by PointerEvents' setPointerCapture later\n            document,\n      );\n    },\n    { capture: useCapture, passive: false },\n  );\n  const containerRef = useExternRef(getRootRef);\n\n  useIsomorphicLayoutEffect(() => {\n    const el = containerRef.current;\n    if (el) {\n      enterHandler.add(el);\n      leaveHandler.add(el);\n      startHandler.add(el);\n    }\n  }, [Component]);\n\n  function onMove(e: VKUITouchEvent) {\n    const { isPressed, isX, isY, startX = 0, startY = 0 } = gesture.current ?? {};\n\n    if (isPressed) {\n      // смещения\n      const shiftX = coordX(e) - startX;\n      const shiftY = coordY(e) - startY;\n\n      // абсолютные значения смещений\n      const shiftXAbs = Math.abs(shiftX);\n      const shiftYAbs = Math.abs(shiftY);\n\n      // Если определяем мультитач, то прерываем жест\n      if (!!e.touches && e.touches.length > 1) {\n        return onEnd(e);\n      }\n\n      // если мы ещё не определились\n      if (!isX && !isY) {\n        const willBeX = shiftXAbs >= slideThreshold && shiftXAbs > shiftYAbs;\n        const willBeY = shiftYAbs >= slideThreshold && shiftYAbs > shiftXAbs;\n        const willBeSlidedX = willBeX && (!!onMoveX || !!_onMove);\n        const willBeSlidedY = willBeY && (!!onMoveY || !!_onMove);\n\n        if (gesture.current) {\n          Object.assign(gesture.current, {\n            isY: willBeY,\n            isX: willBeX,\n            isSlideX: willBeSlidedX,\n            isSlideY: willBeSlidedY,\n            isSlide: willBeSlidedX || willBeSlidedY,\n          });\n        }\n      }\n\n      if (gesture.current?.isSlide) {\n        Object.assign(gesture.current, {\n          shiftX,\n          shiftY,\n          shiftXAbs,\n          shiftYAbs,\n        });\n\n        handle(e, [\n          _onMove,\n          gesture.current.isSlideX && onMoveX,\n          gesture.current.isSlideY && onMoveY,\n        ]);\n      }\n    }\n  }\n\n  function onEnd(e: VKUITouchEvent) {\n    const { isPressed, isSlide, isSlideX, isSlideY } = gesture.current ?? {};\n\n    if (isPressed) {\n      handle(e, [_onEnd, isSlideY && onEndY, isSlideX && onEndX]);\n    }\n\n    const isTouchEnabled = touchEnabled();\n\n    if (isTouchEnabled && isSlide) {\n      // https://github.com/VKCOM/VKUI/issues/4414\n      // если тач-устройство и был зафиксирован touchmove,\n      // то событие клика не вызывается\n      didSlide.current = false;\n    } else {\n      didSlide.current = Boolean(isSlide);\n    }\n    gesture.current = {};\n\n    // Если это был тач-евент, симулируем отмену hover\n    if (isTouchEnabled) {\n      onLeave && onLeave(e);\n    }\n    unsubscribe();\n  }\n\n  const listenerParams = { capture: useCapture, passive: false };\n  const listeners = [\n    useEventListener(events[1], onMove, listenerParams),\n    useEventListener(events[2], onEnd, listenerParams),\n    useEventListener(events[3], onEnd, listenerParams),\n  ];\n  function subscribe(el: HTMLElement | Document | null | undefined) {\n    if (el) {\n      listeners.forEach((l) => l.add(el));\n    }\n  }\n  function unsubscribe() {\n    listeners.forEach((l) => l.remove());\n  }\n\n  /**\n   * Обработчик событий dragstart\n   * Отменяет нативное браузерное поведение для вложенных ссылок и изображений\n   */\n  const onDragStart = (e: React.DragEvent<HTMLElement>) => {\n    const target = e.target as HTMLElement;\n    if (target.tagName === 'A' || target.tagName === 'IMG') {\n      e.preventDefault();\n    }\n  };\n\n  /**\n   * Обработчик клика по компоненту\n   * Отменяет переход по вложенной ссылке, если был зафиксирован свайп\n   */\n  const postGestureClick: typeof onClickCapture = (e) => {\n    if (!didSlide.current) {\n      return onClickCapture && onClickCapture(e);\n    }\n\n    if (noSlideClick) {\n      e.stopPropagation();\n\n      // https://github.com/VKCOM/VKUI/issues/1977\n      // https://github.com/VKCOM/VKUI/issues/3892\n      e.preventDefault();\n    } else {\n      onClickCapture && onClickCapture(e);\n    }\n\n    didSlide.current = false;\n  };\n\n  return (\n    <Component\n      {...restProps}\n      onDragStart={onDragStart}\n      onClickCapture={postGestureClick}\n      ref={containerRef}\n    />\n  );\n};\n\nfunction initGesture(startX: number, startY: number): Gesture {\n  return {\n    startX,\n    startY,\n    startT: new Date(),\n    duration: 0,\n    isPressed: true,\n    isY: false,\n    isX: false,\n    isSlideX: false,\n    isSlideY: false,\n    isSlide: false,\n    shiftX: 0,\n    shiftY: 0,\n    shiftXAbs: 0,\n    shiftYAbs: 0,\n  };\n}\n"],"names":["React","useEventListener","useExternRef","useDOM","coordX","coordY","getSupportedEvents","touchEnabled","useIsomorphicLayoutEffect","Touch","onMove","e","gesture","current","isPressed","isX","isY","startX","startY","shiftX","shiftY","shiftXAbs","Math","abs","shiftYAbs","touches","length","onEnd","willBeX","slideThreshold","willBeY","willBeSlidedX","onMoveX","_onMove","willBeSlidedY","onMoveY","Object","assign","isSlideX","isSlideY","isSlide","handle","_onEnd","onEndY","onEndX","isTouchEnabled","didSlide","Boolean","onLeave","unsubscribe","subscribe","el","listeners","forEach","l","add","remove","onStart","onStartX","onStartY","onEnter","onClickCapture","usePointerHover","useCapture","Component","getRootRef","noSlideClick","stopPropagation","restProps","document","events","useMemo","useRef","handlers","cb","duration","Date","now","startT","getTime","originalEvent","enterHandler","leaveHandler","startHandler","initGesture","target","capture","passive","containerRef","listenerParams","onDragStart","tagName","preventDefault","postGestureClick","ref"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Touch/Touch.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useDOM } from '../../lib/dom';\nimport { coordX, coordY, getSupportedEvents, touchEnabled, VKUITouchEvent } from '../../lib/touch';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HasComponent, HasRootRef } from '../../types';\n\nexport interface TouchProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent {\n  /**\n   * Привязать onEnter и onLeave через pointer-events - работает на disabled-инпутах\n   */\n  usePointerHover?: boolean;\n  useCapture?: boolean;\n  slideThreshold?: number;\n  noSlideClick?: boolean;\n  onEnter?: HoverHandler;\n  onLeave?: HoverHandler;\n  onStart?: TouchEventHandler;\n  onStartX?: TouchEventHandler;\n  onStartY?: TouchEventHandler;\n  onMove?: TouchEventHandler;\n  onMoveX?: TouchEventHandler;\n  onMoveY?: TouchEventHandler;\n  onEnd?: TouchEventHandler;\n  onEndX?: TouchEventHandler;\n  onEndY?: TouchEventHandler;\n  stopPropagation?: boolean;\n}\n\nexport interface Gesture {\n  startX: number;\n  startY: number;\n  startT: Date;\n  duration: number;\n  isPressed: boolean;\n  isY: boolean;\n  isX: boolean;\n  isSlideX: boolean;\n  isSlideY: boolean;\n  isSlide: boolean;\n  shiftX: number;\n  shiftY: number;\n  shiftXAbs: number;\n  shiftYAbs: number;\n}\n\nexport interface TouchEvent extends Gesture {\n  originalEvent: VKUITouchEvent;\n}\n\ntype HoverHandler = (outputEvent: MouseEvent) => void;\nexport type TouchEventHandler = (e: TouchEvent) => void;\nexport type ClickHandler = (e: React.MouseEvent<HTMLElement>) => void;\nexport type DragHandler = (e: React.DragEvent<HTMLElement>) => void;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Touch\n */\nexport const Touch = ({\n  onStart,\n  onStartX,\n  onStartY,\n  onMove: _onMove,\n  onMoveX,\n  onMoveY,\n  onLeave,\n  onEnter,\n  onEnd: _onEnd,\n  onEndX,\n  onEndY,\n  onClickCapture,\n  usePointerHover,\n  slideThreshold = 5,\n  useCapture = false,\n  Component = 'div',\n  getRootRef,\n  noSlideClick = false,\n  stopPropagation = false,\n  ...restProps\n}: TouchProps) => {\n  const { document } = useDOM();\n  const events = React.useMemo(getSupportedEvents, []);\n  const didSlide = React.useRef(false);\n  const gesture = React.useRef<Partial<Gesture> | null>(null);\n  const handle = (e: VKUITouchEvent, handlers: Array<TouchEventHandler | undefined | false>) => {\n    stopPropagation && e.stopPropagation();\n    handlers.forEach((cb) => {\n      const duration = Date.now() - (gesture.current?.startT?.getTime() ?? 0);\n      cb && cb({ ...(gesture.current as Gesture), duration, originalEvent: e });\n    });\n  };\n\n  const enterHandler = useEventListener(usePointerHover ? 'pointerenter' : 'mouseenter', onEnter);\n  const leaveHandler = useEventListener(usePointerHover ? 'pointerleave' : 'mouseleave', onLeave);\n  const startHandler = useEventListener(\n    events[0],\n    (e: VKUITouchEvent) => {\n      gesture.current = initGesture(coordX(e), coordY(e));\n\n      handle(e, [onStart, onStartX, onStartY]);\n      // 1 line, 2 bad specs, 2 workarounds:\n      subscribe(\n        touchEnabled()\n          ? // Touch events fire on initial target, and won't bubble if its removed\n            // see: #235, #1968, https://stackoverflow.com/a/45760014\n            (e.target as HTMLElement)\n          : // Mouse events fire on the element under pointer, so we lose move / end\n            // if pointer goes outside container.\n            // Can be fixed by PointerEvents' setPointerCapture later\n            document,\n      );\n    },\n    { capture: useCapture, passive: false },\n  );\n  const containerRef = useExternRef(getRootRef);\n\n  useIsomorphicLayoutEffect(() => {\n    const el = containerRef.current;\n    if (el) {\n      enterHandler.add(el);\n      leaveHandler.add(el);\n      startHandler.add(el);\n    }\n  }, [Component]);\n\n  function onMove(e: VKUITouchEvent) {\n    const { isPressed, isX, isY, startX = 0, startY = 0 } = gesture.current ?? {};\n\n    if (isPressed) {\n      // смещения\n      const shiftX = coordX(e) - startX;\n      const shiftY = coordY(e) - startY;\n\n      // абсолютные значения смещений\n      const shiftXAbs = Math.abs(shiftX);\n      const shiftYAbs = Math.abs(shiftY);\n\n      // Если определяем мультитач, то прерываем жест\n      if (!!e.touches && e.touches.length > 1) {\n        return onEnd(e);\n      }\n\n      // если мы ещё не определились\n      if (!isX && !isY) {\n        const willBeX = shiftXAbs >= slideThreshold && shiftXAbs > shiftYAbs;\n        const willBeY = shiftYAbs >= slideThreshold && shiftYAbs > shiftXAbs;\n        const willBeSlidedX = willBeX && (!!onMoveX || !!_onMove);\n        const willBeSlidedY = willBeY && (!!onMoveY || !!_onMove);\n\n        if (gesture.current) {\n          Object.assign(gesture.current, {\n            isY: willBeY,\n            isX: willBeX,\n            isSlideX: willBeSlidedX,\n            isSlideY: willBeSlidedY,\n            isSlide: willBeSlidedX || willBeSlidedY,\n          });\n        }\n      }\n\n      if (gesture.current?.isSlide) {\n        Object.assign(gesture.current, {\n          shiftX,\n          shiftY,\n          shiftXAbs,\n          shiftYAbs,\n        });\n\n        handle(e, [\n          _onMove,\n          gesture.current.isSlideX && onMoveX,\n          gesture.current.isSlideY && onMoveY,\n        ]);\n      }\n    }\n  }\n\n  function onEnd(e: VKUITouchEvent) {\n    const { isPressed, isSlide, isSlideX, isSlideY } = gesture.current ?? {};\n\n    if (isPressed) {\n      handle(e, [_onEnd, isSlideY && onEndY, isSlideX && onEndX]);\n    }\n\n    const isTouchEnabled = touchEnabled();\n\n    if (isTouchEnabled && isSlide) {\n      // https://github.com/VKCOM/VKUI/issues/4414\n      // если тач-устройство и был зафиксирован touchmove,\n      // то событие клика не вызывается\n      didSlide.current = false;\n    } else {\n      didSlide.current = Boolean(isSlide);\n    }\n    gesture.current = {};\n\n    // Если это был тач-евент, симулируем отмену hover\n    if (isTouchEnabled) {\n      onLeave && onLeave(e);\n    }\n    unsubscribe();\n  }\n\n  const listenerParams = { capture: useCapture, passive: false };\n  const listeners = [\n    useEventListener(events[1], onMove, listenerParams),\n    useEventListener(events[2], onEnd, listenerParams),\n    useEventListener(events[3], onEnd, listenerParams),\n  ];\n  function subscribe(el: HTMLElement | Document | null | undefined) {\n    if (el) {\n      listeners.forEach((l) => l.add(el));\n    }\n  }\n  function unsubscribe() {\n    listeners.forEach((l) => l.remove());\n  }\n\n  /**\n   * Обработчик событий dragstart\n   * Отменяет нативное браузерное поведение для вложенных ссылок и изображений\n   */\n  const onDragStart = (e: React.DragEvent<HTMLElement>) => {\n    const target = e.target as HTMLElement;\n    if (target.tagName === 'A' || target.tagName === 'IMG') {\n      e.preventDefault();\n    }\n  };\n\n  /**\n   * Обработчик клика по компоненту\n   * Отменяет переход по вложенной ссылке, если был зафиксирован свайп\n   */\n  const postGestureClick: typeof onClickCapture = (e) => {\n    if (!didSlide.current) {\n      return onClickCapture && onClickCapture(e);\n    }\n\n    if (noSlideClick) {\n      e.stopPropagation();\n\n      // https://github.com/VKCOM/VKUI/issues/1977\n      // https://github.com/VKCOM/VKUI/issues/3892\n      e.preventDefault();\n    } else {\n      onClickCapture && onClickCapture(e);\n    }\n\n    didSlide.current = false;\n  };\n\n  return (\n    <Component\n      {...restProps}\n      onDragStart={onDragStart}\n      onClickCapture={postGestureClick}\n      ref={containerRef}\n    />\n  );\n};\n\nfunction initGesture(startX: number, startY: number): Gesture {\n  return {\n    startX,\n    startY,\n    startT: new Date(),\n    duration: 0,\n    isPressed: true,\n    isY: false,\n    isX: false,\n    isSlideX: false,\n    isSlideY: false,\n    isSlide: false,\n    shiftX: 0,\n    shiftY: 0,\n    shiftXAbs: 0,\n    shiftYAbs: 0,\n  };\n}\n"],"names":["React","useEventListener","useExternRef","useDOM","coordX","coordY","getSupportedEvents","touchEnabled","useIsomorphicLayoutEffect","Touch","onMove","e","gesture","current","isPressed","isX","isY","startX","startY","shiftX","shiftY","shiftXAbs","Math","abs","shiftYAbs","touches","length","onEnd","willBeX","slideThreshold","willBeY","willBeSlidedX","onMoveX","_onMove","willBeSlidedY","onMoveY","Object","assign","isSlideX","isSlideY","isSlide","handle","_onEnd","onEndY","onEndX","isTouchEnabled","didSlide","Boolean","onLeave","unsubscribe","subscribe","el","listeners","forEach","l","add","remove","onStart","onStartX","onStartY","onEnter","onClickCapture","usePointerHover","useCapture","Component","getRootRef","noSlideClick","stopPropagation","restProps","document","events","useMemo","useRef","handlers","cb","duration","Date","now","startT","getTime","originalEvent","enterHandler","leaveHandler","startHandler","initGesture","target","capture","passive","containerRef","listenerParams","onDragStart","tagName","preventDefault","postGestureClick","ref"],"mappings":"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"}

package/dist/components/Touch/TouchContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Touch/TouchContext.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Контекст для компонентов, использующих Touch в качестве корневой обёртки,\n * и для которых важно не предотвращать всплытие тач-событий от дочерних компонентов\n */\nconst TouchRootContext: React.Context<boolean> = React.createContext<boolean>(false);\n\n// eslint-disable-next-line import/no-default-export\nexport default TouchRootContext;\n"],"names":["React","TouchRootContext","createContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B;;;CAGC,GACD,IAAMC,mBAA2CD,MAAME,cAAuB;AAE9E,oDAAoD;AACpD,eAAeD,iBAAiB"}
+{"version":3,"sources":["../../../src/components/Touch/TouchContext.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Контекст для компонентов, использующих Touch в качестве корневой обёртки,\n * и для которых важно не предотвращать всплытие тач-событий от дочерних компонентов\n */\nconst TouchRootContext: React.Context<boolean> = React.createContext<boolean>(false);\n\n// eslint-disable-next-line import/no-default-export\nexport default TouchRootContext;\n"],"names":["React","TouchRootContext","createContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B;;;CAGC,GACD,IAAMC,mBAA2CD,MAAME,aAAa,CAAU;AAE9E,oDAAoD;AACpD,eAAeD,iBAAiB"}

package/dist/components/Typography/Headline/Headline.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Typography/Headline/Headline.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { SizeType } from '../../../lib/adaptivity';\nimport { Typography, TypographyProps } from '../Typography';\nimport styles from './Headline.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Headline--sizeY-none'],\n  [SizeType.COMPACT]: styles['Headline--sizeY-compact'],\n};\n\nexport interface HeadlineProps extends TypographyProps {\n  level?: '1' | '2';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Headline\n */\nexport const Headline = ({\n  className,\n  weight = '3',\n  level = '1',\n  Component = 'h4',\n  normalize = true,\n  ...restProps\n}: HeadlineProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Typography\n      Component={Component}\n      normalize={normalize}\n      weight={weight}\n      className={classNames(\n        className,\n        styles['Headline'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        {\n          '1': styles['Headline--level-1'],\n          '2': styles['Headline--level-2'],\n        }[level],\n      )}\n      {...restProps}\n    />\n  );\n};\n"],"names":["React","classNames","useAdaptivity","SizeType","Typography","sizeYClassNames","none","COMPACT","Headline","className","weight","level","Component","normalize","restProps","sizeY","REGULAR"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA+B;AAC7D,SAASC,QAAQ,QAAQ,0BAA0B;AACnD,SAASC,UAAU,QAAyB,gBAAgB;AAG5D,IAAMC;IACJC,IAAI;GACHH,SAASI;AAOZ;;CAEC,GACD,OAAO,IAAMC,WAAW;QACtBC,mBAAAA,kCACAC,QAAAA,oCAAS,2CACTC,OAAAA,kCAAQ,8CACRC,WAAAA,0CAAY,mDACZC,WAAAA,0CAAY,yBACTC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,IAA2BX,iBAAAA,wCAAAA,eAAnBa,OAAAA,0CAAQ;IAEhB,qBACE,oBAACX;QACCQ,WAAWA;QACXC,WAAWA;QACXH,QAAQA;QACRD,WAAWR,WACTQ,2BAEAM,UAAUZ,SAASa,WAAWX,eAAe,CAACU,MAAM,EACpD;YACE,GAAG;YACH,GAAG;QACL,CAAC,CAACJ,MAAM;OAENG;AAGV,EAAE"}
+{"version":3,"sources":["../../../../src/components/Typography/Headline/Headline.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { SizeType } from '../../../lib/adaptivity';\nimport { Typography, TypographyProps } from '../Typography';\nimport styles from './Headline.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Headline--sizeY-none'],\n  [SizeType.COMPACT]: styles['Headline--sizeY-compact'],\n};\n\nexport interface HeadlineProps extends TypographyProps {\n  level?: '1' | '2';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Headline\n */\nexport const Headline = ({\n  className,\n  weight = '3',\n  level = '1',\n  Component = 'h4',\n  normalize = true,\n  ...restProps\n}: HeadlineProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Typography\n      Component={Component}\n      normalize={normalize}\n      weight={weight}\n      className={classNames(\n        className,\n        styles['Headline'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        {\n          '1': styles['Headline--level-1'],\n          '2': styles['Headline--level-2'],\n        }[level],\n      )}\n      {...restProps}\n    />\n  );\n};\n"],"names":["React","classNames","useAdaptivity","SizeType","Typography","sizeYClassNames","none","COMPACT","Headline","className","weight","level","Component","normalize","restProps","sizeY","REGULAR"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA+B;AAC7D,SAASC,QAAQ,QAAQ,0BAA0B;AACnD,SAASC,UAAU,QAAyB,gBAAgB;AAG5D,IAAMC;IACJC,IAAI;GACHH,SAASI,OAAO;AAOnB;;CAEC,GACD,OAAO,IAAMC,WAAW;QACtBC,mBAAAA,kCACAC,QAAAA,oCAAS,2CACTC,OAAAA,kCAAQ,8CACRC,WAAAA,0CAAY,mDACZC,WAAAA,0CAAY,yBACTC;QALHL;QACAC;QACAC;QACAC;QACAC;;IAGA,IAA2BX,iBAAAA,wCAAAA,eAAnBa,OAAAA,0CAAQ;IAEhB,qBACE,oBAACX;QACCQ,WAAWA;QACXC,WAAWA;QACXH,QAAQA;QACRD,WAAWR,WACTQ,2BAEAM,UAAUZ,SAASa,OAAO,IAAIX,eAAe,CAACU,MAAM,EACpD;YACE,GAAG;YACH,GAAG;QACL,CAAC,CAACJ,MAAM;OAENG;AAGV,EAAE"}

package/dist/components/Typography/Subhead/Subhead.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Typography/Subhead/Subhead.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { SizeType } from '../../../lib/adaptivity';\nimport { Typography, TypographyProps } from '../Typography';\nimport styles from './Subhead.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Subhead--sizeY-none'],\n  [SizeType.COMPACT]: styles['Subhead--sizeY-compact'],\n};\n\nexport type SubheadProps = TypographyProps;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Subhead\n */\nexport const Subhead = ({\n  className,\n  Component = 'h5',\n  normalize = true,\n  ...restProps\n}: SubheadProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Typography\n      Component={Component}\n      normalize={normalize}\n      className={classNames(\n        className,\n        styles['Subhead'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n      )}\n      {...restProps}\n    />\n  );\n};\n"],"names":["React","classNames","useAdaptivity","SizeType","Typography","sizeYClassNames","none","COMPACT","Subhead","className","Component","normalize","restProps","sizeY","REGULAR"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA+B;AAC7D,SAASC,QAAQ,QAAQ,0BAA0B;AACnD,SAASC,UAAU,QAAyB,gBAAgB;AAG5D,IAAMC;IACJC,IAAI;GACHH,SAASI;AAKZ;;CAEC,GACD,OAAO,IAAMC,UAAU;QACrBC,mBAAAA,qCACAC,WAAAA,0CAAY,mDACZC,WAAAA,0CAAY,yBACTC;QAHHH;QACAC;QACAC;;IAGA,IAA2BT,iBAAAA,wCAAAA,eAAnBW,OAAAA,0CAAQ;IAEhB,qBACE,oBAACT;QACCM,WAAWA;QACXC,WAAWA;QACXF,WAAWR,WACTQ,0BAEAI,UAAUV,SAASW,WAAWT,eAAe,CAACQ,MAAM;OAElDD;AAGV,EAAE"}
+{"version":3,"sources":["../../../../src/components/Typography/Subhead/Subhead.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { SizeType } from '../../../lib/adaptivity';\nimport { Typography, TypographyProps } from '../Typography';\nimport styles from './Subhead.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Subhead--sizeY-none'],\n  [SizeType.COMPACT]: styles['Subhead--sizeY-compact'],\n};\n\nexport type SubheadProps = TypographyProps;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Subhead\n */\nexport const Subhead = ({\n  className,\n  Component = 'h5',\n  normalize = true,\n  ...restProps\n}: SubheadProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Typography\n      Component={Component}\n      normalize={normalize}\n      className={classNames(\n        className,\n        styles['Subhead'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n      )}\n      {...restProps}\n    />\n  );\n};\n"],"names":["React","classNames","useAdaptivity","SizeType","Typography","sizeYClassNames","none","COMPACT","Subhead","className","Component","normalize","restProps","sizeY","REGULAR"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA+B;AAC7D,SAASC,QAAQ,QAAQ,0BAA0B;AACnD,SAASC,UAAU,QAAyB,gBAAgB;AAG5D,IAAMC;IACJC,IAAI;GACHH,SAASI,OAAO;AAKnB;;CAEC,GACD,OAAO,IAAMC,UAAU;QACrBC,mBAAAA,qCACAC,WAAAA,0CAAY,mDACZC,WAAAA,0CAAY,yBACTC;QAHHH;QACAC;QACAC;;IAGA,IAA2BT,iBAAAA,wCAAAA,eAAnBW,OAAAA,0CAAQ;IAEhB,qBACE,oBAACT;QACCM,WAAWA;QACXC,WAAWA;QACXF,WAAWR,WACTQ,0BAEAI,UAAUV,SAASW,OAAO,IAAIT,eAAe,CAACQ,MAAM;OAElDD;AAGV,EAAE"}

package/dist/components/Typography/Text/Text.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Typography/Text/Text.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { SizeType } from '../../../lib/adaptivity';\nimport { Typography, TypographyProps } from '../Typography';\nimport styles from './Text.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Text--sizeY-none'],\n  [SizeType.COMPACT]: styles['Text--sizeY-compact'],\n};\n\nexport type TextProps = TypographyProps;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Text\n */\nexport const Text = ({\n  className,\n  Component = 'span',\n  normalize = true,\n  ...restProps\n}: TextProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Typography\n      Component={Component}\n      normalize={normalize}\n      className={classNames(\n        className,\n        styles['Text'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n      )}\n      {...restProps}\n    />\n  );\n};\n"],"names":["React","classNames","useAdaptivity","SizeType","Typography","sizeYClassNames","none","COMPACT","Text","className","Component","normalize","restProps","sizeY","REGULAR"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA+B;AAC7D,SAASC,QAAQ,QAAQ,0BAA0B;AACnD,SAASC,UAAU,QAAyB,gBAAgB;AAG5D,IAAMC;IACJC,IAAI;GACHH,SAASI;AAKZ;;CAEC,GACD,OAAO,IAAMC,OAAO;QAClBC,mBAAAA,qCACAC,WAAAA,0CAAY,qDACZC,WAAAA,0CAAY,yBACTC;QAHHH;QACAC;QACAC;;IAGA,IAA2BT,iBAAAA,wCAAAA,eAAnBW,OAAAA,0CAAQ;IAEhB,qBACE,oBAACT;QACCM,WAAWA;QACXC,WAAWA;QACXF,WAAWR,WACTQ,uBAEAI,UAAUV,SAASW,WAAWT,eAAe,CAACQ,MAAM;OAElDD;AAGV,EAAE"}
+{"version":3,"sources":["../../../../src/components/Typography/Text/Text.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { SizeType } from '../../../lib/adaptivity';\nimport { Typography, TypographyProps } from '../Typography';\nimport styles from './Text.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Text--sizeY-none'],\n  [SizeType.COMPACT]: styles['Text--sizeY-compact'],\n};\n\nexport type TextProps = TypographyProps;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Text\n */\nexport const Text = ({\n  className,\n  Component = 'span',\n  normalize = true,\n  ...restProps\n}: TextProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <Typography\n      Component={Component}\n      normalize={normalize}\n      className={classNames(\n        className,\n        styles['Text'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n      )}\n      {...restProps}\n    />\n  );\n};\n"],"names":["React","classNames","useAdaptivity","SizeType","Typography","sizeYClassNames","none","COMPACT","Text","className","Component","normalize","restProps","sizeY","REGULAR"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA+B;AAC7D,SAASC,QAAQ,QAAQ,0BAA0B;AACnD,SAASC,UAAU,QAAyB,gBAAgB;AAG5D,IAAMC;IACJC,IAAI;GACHH,SAASI,OAAO;AAKnB;;CAEC,GACD,OAAO,IAAMC,OAAO;QAClBC,mBAAAA,qCACAC,WAAAA,0CAAY,qDACZC,WAAAA,0CAAY,yBACTC;QAHHH;QACAC;QACAC;;IAGA,IAA2BT,iBAAAA,wCAAAA,eAAnBW,OAAAA,0CAAQ;IAEhB,qBACE,oBAACT;QACCM,WAAWA;QACXC,WAAWA;QACXF,WAAWR,WACTQ,uBAEAI,UAAUV,SAASW,OAAO,IAAIT,eAAe,CAACQ,MAAM;OAElDD;AAGV,EAAE"}