@vkontakte/vkui 5.0.1 → 5.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (150) hide show
  1. package/dist/cjs/components/Alert/Alert.d.ts +3 -3
  2. package/dist/cjs/components/Alert/Alert.js +13 -9
  3. package/dist/cjs/components/Alert/Alert.js.map +1 -1
  4. package/dist/cjs/components/ChipsSelect/ChipsSelect.js +2 -2
  5. package/dist/cjs/components/ChipsSelect/ChipsSelect.js.map +1 -1
  6. package/dist/cjs/components/CustomScrollView/CustomScrollView.js +3 -1
  7. package/dist/cjs/components/CustomScrollView/CustomScrollView.js.map +1 -1
  8. package/dist/cjs/components/CustomSelect/CustomSelect.d.ts +4 -0
  9. package/dist/cjs/components/CustomSelect/CustomSelect.js +11 -6
  10. package/dist/cjs/components/CustomSelect/CustomSelect.js.map +1 -1
  11. package/dist/cjs/components/CustomSelectOption/CustomSelectOption.d.ts +1 -0
  12. package/dist/cjs/components/CustomSelectOption/CustomSelectOption.js +2 -1
  13. package/dist/cjs/components/CustomSelectOption/CustomSelectOption.js.map +1 -1
  14. package/dist/cjs/components/FocusVisible/FocusVisible.js +2 -2
  15. package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js +3 -4
  16. package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  17. package/dist/cjs/components/Popover/Popover.js +10 -1
  18. package/dist/cjs/components/Popover/Popover.js.map +1 -1
  19. package/dist/cjs/components/SegmentedControl/SegmentedControl.js +3 -2
  20. package/dist/cjs/components/SegmentedControl/SegmentedControl.js.map +1 -1
  21. package/dist/cjs/components/SplitCol/SplitCol.js +43 -26
  22. package/dist/cjs/components/SplitCol/SplitCol.js.map +1 -1
  23. package/dist/cjs/components/Tappable/Tappable.d.ts +2 -2
  24. package/dist/cjs/components/Tappable/Tappable.js.map +1 -1
  25. package/dist/cjs/components/Tooltip/Tooltip.d.ts +4 -0
  26. package/dist/cjs/components/Tooltip/Tooltip.js +3 -2
  27. package/dist/cjs/components/Tooltip/Tooltip.js.map +1 -1
  28. package/dist/cjs/hooks/useEventListener.js +6 -4
  29. package/dist/cjs/hooks/useEventListener.js.map +1 -1
  30. package/dist/cjs/hooks/useMediaQueries.js +1 -0
  31. package/dist/cjs/hooks/useMediaQueries.js.map +1 -1
  32. package/dist/cjs/lib/adaptivity/types.d.ts +1 -1
  33. package/dist/cjs/lib/adaptivity/types.js.map +1 -1
  34. package/dist/cjs/lib/browser.js +0 -1
  35. package/dist/cjs/lib/browser.js.map +1 -1
  36. package/dist/cjs/lib/utils.d.ts +0 -1
  37. package/dist/cjs/lib/utils.js +0 -5
  38. package/dist/cjs/lib/utils.js.map +1 -1
  39. package/dist/cjs/shared/breakpoints.d.ts +1 -0
  40. package/dist/cjs/shared/breakpoints.js +1 -0
  41. package/dist/cjs/shared/breakpoints.js.map +1 -1
  42. package/dist/cjs/types.d.ts +6 -0
  43. package/dist/cjs/types.js.map +1 -1
  44. package/dist/components/Alert/Alert.d.ts +3 -3
  45. package/dist/components/Alert/Alert.js +13 -9
  46. package/dist/components/Alert/Alert.js.map +1 -1
  47. package/dist/components/ChipsSelect/ChipsSelect.js +2 -2
  48. package/dist/components/ChipsSelect/ChipsSelect.js.map +1 -1
  49. package/dist/components/CustomScrollView/CustomScrollView.js +3 -1
  50. package/dist/components/CustomScrollView/CustomScrollView.js.map +1 -1
  51. package/dist/components/CustomSelect/CustomSelect.d.ts +4 -0
  52. package/dist/components/CustomSelect/CustomSelect.js +11 -6
  53. package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
  54. package/dist/components/CustomSelectOption/CustomSelectOption.d.ts +1 -0
  55. package/dist/components/CustomSelectOption/CustomSelectOption.js +2 -1
  56. package/dist/components/CustomSelectOption/CustomSelectOption.js.map +1 -1
  57. package/dist/components/FocusVisible/FocusVisible.js +2 -2
  58. package/dist/components/PanelHeaderButton/PanelHeaderButton.js +3 -4
  59. package/dist/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  60. package/dist/components/Popover/Popover.js +10 -1
  61. package/dist/components/Popover/Popover.js.map +1 -1
  62. package/dist/components/SegmentedControl/SegmentedControl.js +4 -3
  63. package/dist/components/SegmentedControl/SegmentedControl.js.map +1 -1
  64. package/dist/components/SplitCol/SplitCol.js +43 -26
  65. package/dist/components/SplitCol/SplitCol.js.map +1 -1
  66. package/dist/components/Tappable/Tappable.d.ts +2 -2
  67. package/dist/components/Tappable/Tappable.js.map +1 -1
  68. package/dist/components/Tooltip/Tooltip.d.ts +4 -0
  69. package/dist/components/Tooltip/Tooltip.js +3 -2
  70. package/dist/components/Tooltip/Tooltip.js.map +1 -1
  71. package/dist/components.css +4 -4
  72. package/dist/components.css.map +1 -1
  73. package/dist/cssm/components/Alert/Alert.d.ts +3 -3
  74. package/dist/cssm/components/Alert/Alert.js +13 -9
  75. package/dist/cssm/components/Alert/Alert.js.map +1 -1
  76. package/dist/cssm/components/Alert/Alert.module.css +1 -1
  77. package/dist/cssm/components/Banner/Banner.module.css +1 -1
  78. package/dist/cssm/components/ChipsSelect/ChipsSelect.js +2 -2
  79. package/dist/cssm/components/ChipsSelect/ChipsSelect.js.map +1 -1
  80. package/dist/cssm/components/ChipsSelect/ChipsSelect.module.css +1 -1
  81. package/dist/cssm/components/CustomScrollView/CustomScrollView.js +3 -1
  82. package/dist/cssm/components/CustomScrollView/CustomScrollView.js.map +1 -1
  83. package/dist/cssm/components/CustomSelect/CustomSelect.d.ts +4 -0
  84. package/dist/cssm/components/CustomSelect/CustomSelect.js +11 -6
  85. package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
  86. package/dist/cssm/components/CustomSelect/CustomSelect.module.css +1 -1
  87. package/dist/cssm/components/CustomSelectOption/CustomSelectOption.d.ts +1 -0
  88. package/dist/cssm/components/CustomSelectOption/CustomSelectOption.js +2 -1
  89. package/dist/cssm/components/CustomSelectOption/CustomSelectOption.js.map +1 -1
  90. package/dist/cssm/components/FocusVisible/FocusVisible.js +2 -2
  91. package/dist/cssm/components/FocusVisible/FocusVisible.module.css +1 -1
  92. package/dist/cssm/components/FormField/FormField.module.css +1 -1
  93. package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.module.css +1 -1
  94. package/dist/cssm/components/Input/Input.module.css +1 -1
  95. package/dist/cssm/components/PanelHeader/PanelHeader.module.css +1 -1
  96. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js +3 -4
  97. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
  98. package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.module.css +1 -1
  99. package/dist/cssm/components/Popover/Popover.js +10 -1
  100. package/dist/cssm/components/Popover/Popover.js.map +1 -1
  101. package/dist/cssm/components/SegmentedControl/SegmentedControl.js +4 -3
  102. package/dist/cssm/components/SegmentedControl/SegmentedControl.js.map +1 -1
  103. package/dist/cssm/components/SimpleCell/SimpleCell.module.css +1 -1
  104. package/dist/cssm/components/SplitCol/SplitCol.js +43 -26
  105. package/dist/cssm/components/SplitCol/SplitCol.js.map +1 -1
  106. package/dist/cssm/components/SubnavigationButton/SubnavigationButton.module.css +1 -1
  107. package/dist/cssm/components/Tappable/Tappable.d.ts +2 -2
  108. package/dist/cssm/components/Tappable/Tappable.js.map +1 -1
  109. package/dist/cssm/components/Tappable/Tappable.module.css +1 -1
  110. package/dist/cssm/components/Textarea/Textarea.module.css +1 -1
  111. package/dist/cssm/components/Tooltip/Tooltip.d.ts +4 -0
  112. package/dist/cssm/components/Tooltip/Tooltip.js +3 -2
  113. package/dist/cssm/components/Tooltip/Tooltip.js.map +1 -1
  114. package/dist/cssm/components/WriteBar/WriteBar.module.css +1 -1
  115. package/dist/cssm/hooks/useEventListener.js +6 -4
  116. package/dist/cssm/hooks/useEventListener.js.map +1 -1
  117. package/dist/cssm/hooks/useMediaQueries.js +1 -0
  118. package/dist/cssm/hooks/useMediaQueries.js.map +1 -1
  119. package/dist/cssm/lib/adaptivity/types.d.ts +1 -1
  120. package/dist/cssm/lib/adaptivity/types.js.map +1 -1
  121. package/dist/cssm/lib/browser.js +0 -1
  122. package/dist/cssm/lib/browser.js.map +1 -1
  123. package/dist/cssm/lib/utils.d.ts +0 -1
  124. package/dist/cssm/lib/utils.js +0 -3
  125. package/dist/cssm/lib/utils.js.map +1 -1
  126. package/dist/cssm/shared/breakpoints.d.ts +1 -0
  127. package/dist/cssm/shared/breakpoints.js +1 -0
  128. package/dist/cssm/shared/breakpoints.js.map +1 -1
  129. package/dist/cssm/styles/components.css +4 -4
  130. package/dist/cssm/types.d.ts +6 -0
  131. package/dist/cssm/types.js.map +1 -1
  132. package/dist/hooks/useEventListener.js +6 -4
  133. package/dist/hooks/useEventListener.js.map +1 -1
  134. package/dist/hooks/useMediaQueries.js +1 -0
  135. package/dist/hooks/useMediaQueries.js.map +1 -1
  136. package/dist/lib/adaptivity/types.d.ts +1 -1
  137. package/dist/lib/adaptivity/types.js.map +1 -1
  138. package/dist/lib/browser.js +0 -1
  139. package/dist/lib/browser.js.map +1 -1
  140. package/dist/lib/utils.d.ts +0 -1
  141. package/dist/lib/utils.js +0 -3
  142. package/dist/lib/utils.js.map +1 -1
  143. package/dist/shared/breakpoints.d.ts +1 -0
  144. package/dist/shared/breakpoints.js +1 -0
  145. package/dist/shared/breakpoints.js.map +1 -1
  146. package/dist/types.d.ts +6 -0
  147. package/dist/types.js.map +1 -1
  148. package/dist/vkui.css +4 -4
  149. package/dist/vkui.css.map +1 -1
  150. package/package.json +3 -3
@@ -1,15 +1,46 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectSpread from "@babel/runtime/helpers/objectSpread2";
3
- import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
4
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
+ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
5
5
  var _excluded = ["children", "width", "maxWidth", "minWidth", "spaced", "animate", "fixed", "style", "autoSpaced", "stretchedOnMobile", "className"];
6
6
  import * as React from "react";
7
7
  import { classNamesString } from "../../lib/classNames";
8
8
  import { getSizeXClassName } from "../../helpers/getSizeXClassName";
9
9
  import { getViewWidthClassName } from "../../helpers/getViewWidthClassName";
10
10
  import { useAdaptivity } from "../../hooks/useAdaptivity";
11
- import { BREAKPOINTS, ViewWidth } from "../../lib/adaptivity";
12
- import { useDOM } from "../../lib/dom";
11
+ import { ViewWidth } from "../../lib/adaptivity";
12
+ import { useObjectMemo } from "../../hooks/useObjectMemo";
13
+ import { useMediaQueries } from "../../hooks/useMediaQueries";
14
+ function useTransitionAnimate(animateProp) {
15
+ var _useAdaptivity = useAdaptivity(),
16
+ viewWidth = _useAdaptivity.viewWidth;
17
+ var _React$useState = React.useState(Boolean(animateProp)),
18
+ _React$useState2 = _slicedToArray(_React$useState, 2),
19
+ animate = _React$useState2[0],
20
+ setAnimate = _React$useState2[1];
21
+ var mediaQueries = useMediaQueries();
22
+ React.useEffect(function () {
23
+ if (animateProp !== undefined) {
24
+ setAnimate(animateProp);
25
+ return;
26
+ }
27
+ if (viewWidth !== undefined) {
28
+ setAnimate(viewWidth < ViewWidth.TABLET);
29
+ return;
30
+ }
31
+
32
+ // eslint-disable-next-line no-restricted-properties
33
+ var listener = function listener() {
34
+ return setAnimate(!mediaQueries.smallTabletPlus.matches);
35
+ };
36
+ listener();
37
+ mediaQueries.smallTabletPlus.addEventListener("change", listener);
38
+ return function () {
39
+ mediaQueries.smallTabletPlus.removeEventListener("change", listener);
40
+ };
41
+ }, [animateProp, viewWidth, mediaQueries]);
42
+ return animate;
43
+ }
13
44
  export var SplitColContext = /*#__PURE__*/React.createContext({
14
45
  colRef: null,
15
46
  animate: true
@@ -26,7 +57,7 @@ export var SplitCol = function SplitCol(props) {
26
57
  maxWidth = props.maxWidth,
27
58
  minWidth = props.minWidth,
28
59
  spaced = props.spaced,
29
- _animate = props.animate,
60
+ animateProp = props.animate,
30
61
  fixed = props.fixed,
31
62
  style = props.style,
32
63
  autoSpaced = props.autoSpaced,
@@ -34,28 +65,14 @@ export var SplitCol = function SplitCol(props) {
34
65
  className = props.className,
35
66
  restProps = _objectWithoutProperties(props, _excluded);
36
67
  var baseRef = React.useRef(null);
37
- var _useAdaptivity = useAdaptivity(),
38
- viewWidth = _useAdaptivity.viewWidth,
39
- sizeX = _useAdaptivity.sizeX;
40
- var _React$useState = React.useState(Boolean(_animate)),
41
- _React$useState2 = _slicedToArray(_React$useState, 2),
42
- animate = _React$useState2[0],
43
- setAnimate = _React$useState2[1];
44
- var _useDOM = useDOM(),
45
- window = _useDOM.window;
46
- React.useEffect(function () {
47
- if (_animate === undefined) {
48
- setAnimate(viewWidth !== undefined ? viewWidth < ViewWidth.TABLET : window.innerWidth < BREAKPOINTS.SMALL_TABLET);
49
- } else {
50
- setAnimate(_animate);
51
- }
52
- }, [_animate, viewWidth, window]);
53
- var contextValue = React.useMemo(function () {
54
- return {
55
- colRef: baseRef,
56
- animate: animate
57
- };
58
- }, [baseRef, animate]);
68
+ var _useAdaptivity2 = useAdaptivity(),
69
+ viewWidth = _useAdaptivity2.viewWidth,
70
+ sizeX = _useAdaptivity2.sizeX;
71
+ var animate = useTransitionAnimate(animateProp);
72
+ var contextValue = useObjectMemo({
73
+ colRef: baseRef,
74
+ animate: animate
75
+ });
59
76
  return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
60
77
  style: _objectSpread(_objectSpread({}, style), {}, {
61
78
  width: width,
@@ -1 +1 @@
1
- {"version":3,"file":"SplitCol.js","names":["React","classNamesString","getSizeXClassName","getViewWidthClassName","useAdaptivity","BREAKPOINTS","ViewWidth","useDOM","SplitColContext","createContext","colRef","animate","useSplitCol","useContext","SplitCol","props","children","width","maxWidth","minWidth","spaced","_animate","fixed","style","autoSpaced","stretchedOnMobile","className","restProps","baseRef","useRef","viewWidth","sizeX","useState","Boolean","setAnimate","window","useEffect","undefined","TABLET","innerWidth","SMALL_TABLET","contextValue","useMemo"],"sources":["../../../src/components/SplitCol/SplitCol.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { getViewWidthClassName } from \"../../helpers/getViewWidthClassName\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { BREAKPOINTS, ViewWidth } from \"../../lib/adaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport styles from \"./SplitCol.module.css\";\n\nexport interface SplitColContextProps {\n colRef: React.RefObject<HTMLDivElement> | null;\n animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n colRef: null,\n animate: true,\n});\n\nexport const useSplitCol = () => React.useContext(SplitColContext);\n\nexport interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {\n width?: number | string;\n maxWidth?: number | string;\n minWidth?: number | string;\n /**\n * Если false, то переходы между Panel происходят без анимации\n */\n animate?: boolean;\n /**\n * Если true, то добавляются боковые отступы фиксированной величины\n */\n spaced?: boolean;\n /**\n * Если true, то добавляются боковые отступы фиксированной величины при ширине больше чем `smallTablet`\n */\n autoSpaced?: boolean;\n fixed?: boolean;\n /**\n * Если true, то ширина контейнера становится 100% при ширине меньше чем `tablet`\n */\n stretchedOnMobile?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SplitCol\n */\nexport const SplitCol = (props: SplitColProps) => {\n const {\n children,\n width,\n maxWidth,\n minWidth,\n spaced,\n animate: _animate,\n fixed,\n style,\n autoSpaced,\n stretchedOnMobile,\n className,\n ...restProps\n } = props;\n const baseRef = React.useRef<HTMLDivElement>(null);\n const { viewWidth, sizeX } = useAdaptivity();\n const [animate, setAnimate] = React.useState(Boolean(_animate));\n const { window } = useDOM();\n\n React.useEffect(() => {\n if (_animate === undefined) {\n setAnimate(\n viewWidth !== undefined\n ? viewWidth < ViewWidth.TABLET\n : window!.innerWidth < BREAKPOINTS.SMALL_TABLET\n );\n } else {\n setAnimate(_animate);\n }\n }, [_animate, viewWidth, window]);\n\n const contextValue = React.useMemo(() => {\n return {\n colRef: baseRef,\n animate,\n };\n }, [baseRef, animate]);\n\n return (\n <div\n {...restProps}\n style={{\n ...style,\n width: width,\n maxWidth: maxWidth,\n minWidth: minWidth,\n }}\n ref={baseRef}\n className={classNamesString(\n styles[\"SplitCol\"],\n getSizeXClassName(styles[\"SplitCol\"], sizeX),\n getViewWidthClassName(styles[\"SplitCol\"], viewWidth),\n spaced && styles[\"SplitCol--spaced\"],\n spaced === undefined && styles[\"SplitCol--spaced-none\"],\n autoSpaced && styles[\"SplitCol--spaced-auto\"],\n fixed && styles[\"SplitCol--fixed\"],\n stretchedOnMobile && styles[\"SplitCol--stretched-on-mobile\"],\n className\n )}\n >\n <SplitColContext.Provider value={contextValue}>\n {fixed ? (\n <div className={styles[\"SplitCol__fixedInner\"]}>{children}</div>\n ) : (\n children\n )}\n </SplitColContext.Provider>\n </div>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"SplitCol.js","names":["React","classNamesString","getSizeXClassName","getViewWidthClassName","useAdaptivity","ViewWidth","useObjectMemo","useMediaQueries","useTransitionAnimate","animateProp","viewWidth","useState","Boolean","animate","setAnimate","mediaQueries","useEffect","undefined","TABLET","listener","smallTabletPlus","matches","addEventListener","removeEventListener","SplitColContext","createContext","colRef","useSplitCol","useContext","SplitCol","props","children","width","maxWidth","minWidth","spaced","fixed","style","autoSpaced","stretchedOnMobile","className","restProps","baseRef","useRef","sizeX","contextValue"],"sources":["../../../src/components/SplitCol/SplitCol.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { getViewWidthClassName } from \"../../helpers/getViewWidthClassName\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { ViewWidth } from \"../../lib/adaptivity\";\nimport { useObjectMemo } from \"../../hooks/useObjectMemo\";\nimport { useMediaQueries } from \"../../hooks/useMediaQueries\";\nimport styles from \"./SplitCol.module.css\";\n\nfunction useTransitionAnimate(animateProp?: boolean) {\n const { viewWidth } = useAdaptivity();\n const [animate, setAnimate] = React.useState(Boolean(animateProp));\n const mediaQueries = useMediaQueries();\n\n React.useEffect(() => {\n if (animateProp !== undefined) {\n setAnimate(animateProp);\n return;\n }\n\n if (viewWidth !== undefined) {\n setAnimate(viewWidth < ViewWidth.TABLET);\n return;\n }\n\n // eslint-disable-next-line no-restricted-properties\n const listener = () => setAnimate(!mediaQueries.smallTabletPlus.matches);\n listener();\n\n mediaQueries.smallTabletPlus.addEventListener(\"change\", listener);\n return () => {\n mediaQueries.smallTabletPlus.removeEventListener(\"change\", listener);\n };\n }, [animateProp, viewWidth, mediaQueries]);\n\n return animate;\n}\n\nexport interface SplitColContextProps {\n colRef: React.RefObject<HTMLDivElement> | null;\n animate: boolean;\n}\n\nexport const SplitColContext = React.createContext<SplitColContextProps>({\n colRef: null,\n animate: true,\n});\n\nexport const useSplitCol = () => React.useContext(SplitColContext);\n\nexport interface SplitColProps extends React.HTMLAttributes<HTMLDivElement> {\n width?: number | string;\n maxWidth?: number | string;\n minWidth?: number | string;\n /**\n * Если false, то переходы между Panel происходят без анимации\n */\n animate?: boolean;\n /**\n * Если true, то добавляются боковые отступы фиксированной величины\n */\n spaced?: boolean;\n /**\n * Если true, то добавляются боковые отступы фиксированной величины при ширине больше чем `smallTablet`\n */\n autoSpaced?: boolean;\n fixed?: boolean;\n /**\n * Если true, то ширина контейнера становится 100% при ширине меньше чем `tablet`\n */\n stretchedOnMobile?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SplitCol\n */\nexport const SplitCol = (props: SplitColProps) => {\n const {\n children,\n width,\n maxWidth,\n minWidth,\n spaced,\n animate: animateProp,\n fixed,\n style,\n autoSpaced,\n stretchedOnMobile,\n className,\n ...restProps\n } = props;\n const baseRef = React.useRef<HTMLDivElement>(null);\n const { viewWidth, sizeX } = useAdaptivity();\n const animate = useTransitionAnimate(animateProp);\n\n const contextValue = useObjectMemo({\n colRef: baseRef,\n animate,\n });\n\n return (\n <div\n {...restProps}\n style={{\n ...style,\n width: width,\n maxWidth: maxWidth,\n minWidth: minWidth,\n }}\n ref={baseRef}\n className={classNamesString(\n styles[\"SplitCol\"],\n getSizeXClassName(styles[\"SplitCol\"], sizeX),\n getViewWidthClassName(styles[\"SplitCol\"], viewWidth),\n spaced && styles[\"SplitCol--spaced\"],\n spaced === undefined && styles[\"SplitCol--spaced-none\"],\n autoSpaced && styles[\"SplitCol--spaced-auto\"],\n fixed && styles[\"SplitCol--fixed\"],\n stretchedOnMobile && styles[\"SplitCol--stretched-on-mobile\"],\n className\n )}\n >\n <SplitColContext.Provider value={contextValue}>\n {fixed ? (\n <div className={styles[\"SplitCol__fixedInner\"]}>{children}</div>\n ) : (\n children\n )}\n </SplitColContext.Provider>\n </div>\n );\n};\n"],"mappings":"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"}
@@ -1,9 +1,9 @@
1
1
  import * as React from "react";
2
2
  import { TouchProps } from "../Touch/Touch";
3
- import { HasComponent, HasRootRef } from "../../types";
3
+ import { AnchorHTMLAttributesOnly, HasComponent, HasRootRef } from "../../types";
4
4
  import { FocusVisibleMode } from "../FocusVisible/FocusVisible";
5
5
  declare type StateMode = "opacity" | "background";
6
- export declare type TappableElementProps = Omit<React.AllHTMLAttributes<HTMLElement>, "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onMouseDown" | "onMouseMove" | "onMouseUp" | "onMouseLeave">;
6
+ export declare type TappableElementProps = Omit<React.AllHTMLAttributes<HTMLElement>, "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onMouseDown" | "onMouseMove" | "onMouseUp" | "onMouseLeave"> & AnchorHTMLAttributesOnly;
7
7
  export interface TappableProps extends TappableElementProps, HasRootRef<HTMLElement>, HasComponent, Pick<TouchProps, "onStart" | "onEnd" | "onMove"> {
8
8
  /**
9
9
  * Длительность показа active-состояния
@@ -1 +1 @@
1
- {"version":3,"file":"Tappable.js","names":["React","mitt","noop","Touch","TouchRootContext","classNamesString","Platform","getOffsetRect","coordX","coordY","shouldTriggerClickOnEnterOrSpace","useIsomorphicLayoutEffect","FocusVisible","useTimeout","useExternRef","usePlatform","useFocusVisible","callMultiple","useBooleanState","useAdaptivity","useAdaptivityHasHover","useAdaptivityHasPointer","sizeXClassNames","none","compact","regular","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","children","Component","onClick","_onKeyDown","onKeyDown","activeEffectDelay","stopPropagation","getRootRef","hasHover","_hasHover","hoverMode","_hasActive","activeMode","focusVisibleMode","onEnter","onLeave","className","props","href","useContext","insideTouchRoot","platform","focusVisible","onBlur","onFocus","sizeX","hasPointerContext","hasHoverContext","clicks","setClicks","childHover","setChildHover","_hovered","value","setHoveredTrue","setTrue","setHoveredFalse","setFalse","hovered","disabled","isCustomElement","contentEditable","isPresetHoverMode","isPresetActiveMode","isPresetFocusVisibleMode","includes","containerRef","childContext","useRef","current","e","preventDefault","click","needWaves","ANDROID","clearClicks","addClick","x","y","dateNow","Date","now","filteredClicks","filter","onStart","originalEvent","touches","length","top","left","onMove","isSlide","onEnd","duration","activeDuration","classes","IOS","styles","handlers","role","undefined","map","wave"],"sources":["../../../src/components/Tappable/Tappable.tsx"],"sourcesContent":["import * as React from \"react\";\nimport mitt from \"mitt\";\nimport { noop } from \"../../lib/utils\";\nimport { Touch, TouchEvent, TouchProps } from \"../Touch/Touch\";\nimport TouchRootContext from \"../Touch/TouchContext\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { Platform } from \"../../lib/platform\";\nimport { getOffsetRect } from \"../../lib/offset\";\nimport { coordX, coordY } from \"../../lib/touch\";\nimport { HasComponent, HasRootRef } from \"../../types\";\nimport { shouldTriggerClickOnEnterOrSpace } from \"../../lib/accessibility\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { FocusVisible, FocusVisibleMode } from \"../FocusVisible/FocusVisible\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useFocusVisible } from \"../../hooks/useFocusVisible\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport { useBooleanState } from \"../../hooks/useBooleanState\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useAdaptivityHasHover } from \"../../hooks/useAdaptivityHasHover\";\nimport { useAdaptivityHasPointer } from \"../../hooks/useAdaptivityHasPointer\";\nimport styles from \"./Tappable.module.css\";\n\nconst sizeXClassNames = {\n none: styles[\"Tappable--sizeX-none\"],\n compact: styles[\"Tappable--sizeX-compact\"],\n regular: styles[\"Tappable--sizeX-regular\"],\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\nexport interface TappableProps\n extends TappableElementProps,\n HasRootRef<HTMLElement>,\n HasComponent,\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 * Указывает, должен ли компонент реагировать на active-состояние\n */\n hasActive?: boolean;\n /**\n * Стиль подсветки active-состояния. Если передать произвольную строку, она добавится как css-класс во время active\n */\n activeMode?: StateMode | string;\n /**\n * Стиль подсветки hover-состояния. Если передать произвольную строку, она добавится как css-класс во время hover\n */\n hoverMode?: StateMode | string;\n /**\n * Стиль аутлайна focus visible. Если передать произвольную строку, она добавится как css-класс во время focus-visible\n */\n focusVisibleMode?: FocusVisibleMode | string;\n children?: React.ReactNode;\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(\n stateMode: StateMode | string\n): 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(\n () => Math.round(Math.random() * 1e8).toString(16),\n []\n );\n\n const [activity, setActivity] = React.useState<\n typeof TapState[keyof typeof TapState]\n >(TapState.none);\n const _stop = () => setActivity(TapState.none);\n const start = () => hasActive && setActivity(TapState.active);\n const delayStart = () => {\n hasActive && setActivity(TapState.pending);\n };\n\n const activeTimeout = useTimeout(start, ACTIVE_DELAY);\n const stopTimeout = useTimeout(_stop, stopDelay);\n\n useIsomorphicLayoutEffect(() => {\n if (activity === TapState.pending) {\n activeTimeout.set();\n return activeTimeout.clear;\n }\n if (activity === TapState.exiting) {\n return stopTimeout.clear;\n }\n if (activity === TapState.active) {\n activeBus.emit(\"active\", id);\n }\n return noop;\n }, [activity]);\n\n useIsomorphicLayoutEffect(() => {\n if (activity === TapState.none) {\n return noop;\n }\n const onActiveChange = (activeId: string) => {\n activeId !== id && _stop();\n };\n activeBus.on(\"active\", onActiveChange);\n return () => activeBus.off(\"active\", onActiveChange);\n }, [activity === TapState.none]);\n\n useIsomorphicLayoutEffect(() => {\n !hasActive && _stop();\n }, [hasActive]);\n\n const stop = (delay?: number) => {\n if (delay) {\n setActivity(TapState.exiting);\n return stopTimeout.set(delay);\n }\n _stop();\n };\n\n return [activity, { delayStart, start, stop }] as const;\n}\n\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 ...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 && !props.disabled;\n const hasActive = _hasActive && !childHover && !props.disabled;\n const hasHover = hasHoverContext === true && _hasHover && !childHover;\n const isCustomElement =\n Component !== \"a\" &&\n Component !== \"button\" &&\n Component !== \"label\" &&\n !props.contentEditable;\n const isPresetHoverMode = isPresetStateMode(hoverMode);\n const isPresetActiveMode = isPresetStateMode(activeMode);\n const isPresetFocusVisibleMode = [\"inside\", \"outside\"].includes(\n focusVisibleMode\n );\n\n const [activity, { start, stop, delayStart }] = useActivity(\n hasActive,\n activeEffectDelay\n );\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 &&\n !hasPointerContext &&\n hasActive &&\n 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(\n (click) => click.id + WAVE_LIVE > dateNow\n );\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 = classNamesString(\n className,\n styles[\"Tappable\"],\n platform === Platform.IOS && styles[\"Tappable--ios\"],\n sizeXClassNames[sizeX],\n hasHoverContext && styles[\"Tappable--hover-has\"],\n hasActive && styles[\"Tappable--hasActive\"],\n hasHover && hovered && !isPresetHoverMode && hoverMode,\n hasActive && active && !isPresetActiveMode && activeMode,\n focusVisible && !isPresetFocusVisibleMode && focusVisibleMode,\n hasActive && active && styles[\"Tappable--active\"],\n hasHover &&\n hovered &&\n isPresetHoverMode &&\n styles[`Tappable--hover-${hoverMode}`],\n hasActive &&\n active &&\n isPresetActiveMode &&\n styles[`Tappable--active-${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}>\n {children}\n </TappableContext.Provider>\n {needWaves && (\n <span aria-hidden=\"true\" 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\") ||\n (hasActive && activeMode === \"background\")) && (\n <span aria-hidden=\"true\" className={styles.Tappable__stateLayer} />\n )}\n {!props.disabled && isPresetFocusVisibleMode && (\n <FocusVisible mode={focusVisibleMode as FocusVisibleMode} />\n )}\n </Touch>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"Tappable.js","names":["React","mitt","noop","Touch","TouchRootContext","classNamesString","Platform","getOffsetRect","coordX","coordY","shouldTriggerClickOnEnterOrSpace","useIsomorphicLayoutEffect","FocusVisible","useTimeout","useExternRef","usePlatform","useFocusVisible","callMultiple","useBooleanState","useAdaptivity","useAdaptivityHasHover","useAdaptivityHasPointer","sizeXClassNames","none","compact","regular","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","children","Component","onClick","_onKeyDown","onKeyDown","activeEffectDelay","stopPropagation","getRootRef","hasHover","_hasHover","hoverMode","_hasActive","activeMode","focusVisibleMode","onEnter","onLeave","className","props","href","useContext","insideTouchRoot","platform","focusVisible","onBlur","onFocus","sizeX","hasPointerContext","hasHoverContext","clicks","setClicks","childHover","setChildHover","_hovered","value","setHoveredTrue","setTrue","setHoveredFalse","setFalse","hovered","disabled","isCustomElement","contentEditable","isPresetHoverMode","isPresetActiveMode","isPresetFocusVisibleMode","includes","containerRef","childContext","useRef","current","e","preventDefault","click","needWaves","ANDROID","clearClicks","addClick","x","y","dateNow","Date","now","filteredClicks","filter","onStart","originalEvent","touches","length","top","left","onMove","isSlide","onEnd","duration","activeDuration","classes","IOS","styles","handlers","role","undefined","map","wave"],"sources":["../../../src/components/Tappable/Tappable.tsx"],"sourcesContent":["import * as React from \"react\";\nimport mitt from \"mitt\";\nimport { noop } from \"../../lib/utils\";\nimport { Touch, TouchEvent, TouchProps } from \"../Touch/Touch\";\nimport TouchRootContext from \"../Touch/TouchContext\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { Platform } from \"../../lib/platform\";\nimport { getOffsetRect } from \"../../lib/offset\";\nimport { coordX, coordY } from \"../../lib/touch\";\nimport {\n AnchorHTMLAttributesOnly,\n HasComponent,\n HasRootRef,\n} from \"../../types\";\nimport { shouldTriggerClickOnEnterOrSpace } from \"../../lib/accessibility\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { FocusVisible, FocusVisibleMode } from \"../FocusVisible/FocusVisible\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useFocusVisible } from \"../../hooks/useFocusVisible\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport { useBooleanState } from \"../../hooks/useBooleanState\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useAdaptivityHasHover } from \"../../hooks/useAdaptivityHasHover\";\nimport { useAdaptivityHasPointer } from \"../../hooks/useAdaptivityHasPointer\";\nimport styles from \"./Tappable.module.css\";\n\nconst sizeXClassNames = {\n none: styles[\"Tappable--sizeX-none\"],\n compact: styles[\"Tappable--sizeX-compact\"],\n regular: styles[\"Tappable--sizeX-regular\"],\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 Pick<TouchProps, \"onStart\" | \"onEnd\" | \"onMove\"> {\n /**\n * Длительность показа active-состояния\n */\n activeEffectDelay?: number;\n stopPropagation?: boolean;\n /**\n * Указывает, должен ли компонент реагировать на hover-состояние\n */\n hasHover?: boolean;\n /**\n * Указывает, должен ли компонент реагировать на active-состояние\n */\n hasActive?: boolean;\n /**\n * Стиль подсветки active-состояния. Если передать произвольную строку, она добавится как css-класс во время active\n */\n activeMode?: StateMode | string;\n /**\n * Стиль подсветки hover-состояния. Если передать произвольную строку, она добавится как css-класс во время hover\n */\n hoverMode?: StateMode | string;\n /**\n * Стиль аутлайна focus visible. Если передать произвольную строку, она добавится как css-класс во время focus-visible\n */\n focusVisibleMode?: FocusVisibleMode | string;\n children?: React.ReactNode;\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(\n stateMode: StateMode | string\n): 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(\n () => Math.round(Math.random() * 1e8).toString(16),\n []\n );\n\n const [activity, setActivity] = React.useState<\n typeof TapState[keyof typeof TapState]\n >(TapState.none);\n const _stop = () => setActivity(TapState.none);\n const start = () => hasActive && setActivity(TapState.active);\n const delayStart = () => {\n hasActive && setActivity(TapState.pending);\n };\n\n const activeTimeout = useTimeout(start, ACTIVE_DELAY);\n const stopTimeout = useTimeout(_stop, stopDelay);\n\n useIsomorphicLayoutEffect(() => {\n if (activity === TapState.pending) {\n activeTimeout.set();\n return activeTimeout.clear;\n }\n if (activity === TapState.exiting) {\n return stopTimeout.clear;\n }\n if (activity === TapState.active) {\n activeBus.emit(\"active\", id);\n }\n return noop;\n }, [activity]);\n\n useIsomorphicLayoutEffect(() => {\n if (activity === TapState.none) {\n return noop;\n }\n const onActiveChange = (activeId: string) => {\n activeId !== id && _stop();\n };\n activeBus.on(\"active\", onActiveChange);\n return () => activeBus.off(\"active\", onActiveChange);\n }, [activity === TapState.none]);\n\n useIsomorphicLayoutEffect(() => {\n !hasActive && _stop();\n }, [hasActive]);\n\n const stop = (delay?: number) => {\n if (delay) {\n setActivity(TapState.exiting);\n return stopTimeout.set(delay);\n }\n _stop();\n };\n\n return [activity, { delayStart, start, stop }] as const;\n}\n\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 ...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 && !props.disabled;\n const hasActive = _hasActive && !childHover && !props.disabled;\n const hasHover = hasHoverContext === true && _hasHover && !childHover;\n const isCustomElement =\n Component !== \"a\" &&\n Component !== \"button\" &&\n Component !== \"label\" &&\n !props.contentEditable;\n const isPresetHoverMode = isPresetStateMode(hoverMode);\n const isPresetActiveMode = isPresetStateMode(activeMode);\n const isPresetFocusVisibleMode = [\"inside\", \"outside\"].includes(\n focusVisibleMode\n );\n\n const [activity, { start, stop, delayStart }] = useActivity(\n hasActive,\n activeEffectDelay\n );\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 &&\n !hasPointerContext &&\n hasActive &&\n 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(\n (click) => click.id + WAVE_LIVE > dateNow\n );\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 = classNamesString(\n className,\n styles[\"Tappable\"],\n platform === Platform.IOS && styles[\"Tappable--ios\"],\n sizeXClassNames[sizeX],\n hasHoverContext && styles[\"Tappable--hover-has\"],\n hasActive && styles[\"Tappable--hasActive\"],\n hasHover && hovered && !isPresetHoverMode && hoverMode,\n hasActive && active && !isPresetActiveMode && activeMode,\n focusVisible && !isPresetFocusVisibleMode && focusVisibleMode,\n hasActive && active && styles[\"Tappable--active\"],\n hasHover &&\n hovered &&\n isPresetHoverMode &&\n styles[`Tappable--hover-${hoverMode}`],\n hasActive &&\n active &&\n isPresetActiveMode &&\n styles[`Tappable--active-${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}>\n {children}\n </TappableContext.Provider>\n {needWaves && (\n <span aria-hidden=\"true\" 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\") ||\n (hasActive && activeMode === \"background\")) && (\n <span aria-hidden=\"true\" className={styles.Tappable__stateLayer} />\n )}\n {!props.disabled && isPresetFocusVisibleMode && (\n <FocusVisible mode={focusVisibleMode as FocusVisibleMode} />\n )}\n </Touch>\n );\n};\n"],"mappings":"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"}
@@ -62,6 +62,10 @@ export interface TooltipProps {
62
62
  * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства
63
63
  */
64
64
  placement?: Placement;
65
+ /**
66
+ * Пользовательские css-классы, будут добавлены на root-элемент
67
+ */
68
+ className?: string;
65
69
  }
66
70
  /**
67
71
  * @see https://vkcom.github.io/VKUI/#/Tooltip
@@ -32,12 +32,13 @@ var SimpleTooltip = /*#__PURE__*/React.forwardRef(function SimpleTooltip(_ref, r
32
32
  arrow = _ref.arrow,
33
33
  _ref$style = _ref.style,
34
34
  popperStyles = _ref$style === void 0 ? {} : _ref$style,
35
- attributes = _ref.attributes;
35
+ attributes = _ref.attributes,
36
+ className = _ref.className;
36
37
  var _ref2 = (_attributes$container = attributes === null || attributes === void 0 ? void 0 : attributes.container) !== null && _attributes$container !== void 0 ? _attributes$container : {},
37
38
  containerClassName = _ref2.className,
38
39
  restContainerAttributes = _objectWithoutProperties(_ref2, _excluded);
39
40
  return /*#__PURE__*/React.createElement("div", {
40
- className: classNamesString("vkuiTooltip", styles["Tooltip--appearance-".concat(appearance)])
41
+ className: classNamesString("vkuiTooltip", styles["Tooltip--appearance-".concat(appearance)], className)
41
42
  }, /*#__PURE__*/React.createElement("div", _extends({
42
43
  className: classNamesString("vkuiTooltip__container", containerClassName),
43
44
  ref: ref,
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","names":["React","ReactDOM","classNamesString","Subhead","useNavTransition","PopperArrow","usePopper","tooltipContainerAttr","useExternRef","useDOM","warnOnce","hasReactNode","useGlobalEventListener","isDOMTypeElement","element","isValidElement","type","warn","IS_DEV","process","env","NODE_ENV","SimpleTooltip","forwardRef","ref","appearance","header","text","arrow","style","popperStyles","attributes","container","containerClassName","className","restContainerAttributes","styles","mapAlignX","x","getPlacement","alignX","alignY","filter","p","join","isVerticalPlacement","placement","startsWith","Tooltip","children","isShown","_isShown","offsetX","offsetY","onClose","cornerOffset","cornerAbsoluteOffset","restProps","entering","useState","tooltipRef","setTooltipRef","target","setTarget","multiChildren","Children","count","primitiveChild","JSON","stringify","Boolean","tooltipContainer","useMemo","closest","strategy","position","Error","modifiers","name","options","offset","push","padding","enabled","phase","fn","state","modifiersData","undefined","y","_placement","document","passive","childRef","props","getRootRef","patchedRef","child","cloneElement","createPortal","el","popper"],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { useNavTransition } from \"../NavTransitionContext/NavTransitionContext\";\nimport { PopperArrow } from \"../PopperArrow/PopperArrow\";\nimport { Modifier, usePopper } from \"react-popper\";\nimport { Placement } from \"@popperjs/core\";\nimport { tooltipContainerAttr } from \"./TooltipContainer\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useDOM } from \"../../lib/dom\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { HasRootRef } from \"../../types\";\nimport styles from \"./Tooltip.module.css\";\n\ninterface SimpleTooltipProps extends Partial<TooltipProps> {\n target?: HTMLDivElement;\n style?: {\n arrow: React.CSSProperties;\n container: React.CSSProperties;\n };\n attributes?: {\n arrow: React.HTMLAttributes<HTMLDivElement> | null;\n container: React.HTMLAttributes<HTMLDivElement> | null;\n };\n}\n\n/**\n * Перебиваем `ref`.\n *\n * В оригинальном `React.DOMElement` задаётся `React.LegacyRef<T>`, в котором есть `string`.\n * Когда как `{ ref: \"string\" }` уже давно депрекейтнут.\n */\ninterface DOMElement<\n P extends React.HTMLAttributes<T> | React.SVGAttributes<T>,\n 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\");\nconst IS_DEV = process.env.NODE_ENV === \"development\";\n\nconst SimpleTooltip = React.forwardRef<HTMLDivElement, SimpleTooltipProps>(\n function SimpleTooltip(\n {\n appearance = \"accent\",\n header,\n text,\n arrow,\n style: popperStyles = {},\n attributes,\n },\n ref\n ) {\n const { className: containerClassName, ...restContainerAttributes } =\n attributes?.container ?? {};\n\n return (\n <div\n className={classNamesString(\n styles[\"Tooltip\"],\n styles[`Tooltip--appearance-${appearance}`]\n )}\n >\n <div\n className={classNamesString(\n styles[\"Tooltip__container\"],\n containerClassName\n )}\n ref={ref}\n style={popperStyles.container}\n {...restContainerAttributes}\n >\n {arrow && (\n <PopperArrow\n style={popperStyles.arrow}\n attributes={attributes?.arrow}\n arrowClassName={styles[\"Tooltip__arrow\"]}\n />\n )}\n <div className={styles[\"Tooltip__content\"]}>\n {header && (\n <Subhead weight=\"2\" className={styles[\"Tooltip__title\"]}>\n {header}\n </Subhead>\n )}\n {text && (\n <Subhead className={styles[\"Tooltip__text\"]}>{text}</Subhead>\n )}\n </div>\n </div>\n </div>\n );\n }\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 cornerOffset?: number;\n /**\n * Сдвиг стрелочки относительно ширины тултипа\n */\n cornerAbsoluteOffset?: number;\n /**\n * Callback, который вызывается при клике по любому месту в пределах экрана.\n */\n onClose?: () => void;\n /**\n * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n */\n placement?: Placement;\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 getPlacement(\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: Placement) {\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: _isShown = true,\n offsetX = 0,\n offsetY = 15,\n alignX,\n alignY,\n onClose,\n cornerOffset = 0,\n cornerAbsoluteOffset,\n appearance,\n arrow = true,\n placement,\n ...restProps\n}: TooltipProps) => {\n const { entering } = useNavTransition();\n const isShown = _isShown && !entering;\n const [tooltipRef, setTooltipRef] = React.useState<HTMLElement | null>(null);\n const [target, setTarget] = React.useState<HTMLElement>();\n\n if (IS_DEV) {\n const multiChildren = React.Children.count(children) > 1;\n // Empty children is a noop\n const primitiveChild =\n 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 /* eslint-disable no-restricted-properties */\n /* eslint-disable @typescript-eslint/no-unnecessary-type-assertion*/\n const tooltipContainer = React.useMemo(\n () => target?.closest(`[${tooltipContainerAttr}]`) as HTMLDivElement,\n [target]\n );\n const strategy = React.useMemo(\n () => (target?.style.position === \"fixed\" ? \"fixed\" : \"absolute\"),\n [target]\n );\n /* eslint-enable @typescript-eslint/no-unnecessary-type-assertion*/\n /* eslint-enable no-restricted-properties */\n\n if (IS_DEV && target && !tooltipContainer) {\n throw new Error(\n \"Use TooltipContainer for Tooltip outside Panel (see docs)\"\n );\n }\n\n const modifiers = React.useMemo(() => {\n const modifiers: Array<Modifier<string>> = [\n {\n name: \"offset\",\n options: {\n offset: [offsetX, offsetY],\n },\n },\n {\n name: \"preventOverflow\",\n },\n {\n name: \"flip\",\n },\n ];\n\n if (arrow) {\n modifiers.push({\n name: \"arrow\",\n options: {\n padding: 14,\n },\n });\n modifiers.push({\n name: \"arrowOffset\",\n enabled: true,\n phase: \"main\",\n fn({ state }) {\n if (!state.modifiersData.arrow) {\n return;\n }\n if (isVerticalPlacement(state.placement)) {\n if (cornerAbsoluteOffset !== undefined) {\n state.modifiersData.arrow.x = cornerAbsoluteOffset;\n } else {\n if (state.modifiersData.arrow?.x !== undefined) {\n state.modifiersData.arrow.x += cornerOffset;\n }\n }\n } else {\n if (cornerAbsoluteOffset !== undefined) {\n state.modifiersData.arrow.y = cornerAbsoluteOffset;\n } else {\n if (state.modifiersData.arrow?.y !== undefined) {\n state.modifiersData.arrow.y += cornerOffset;\n }\n }\n }\n },\n });\n }\n\n return modifiers;\n }, [arrow, cornerAbsoluteOffset, cornerOffset, offsetX, offsetY]);\n\n const _placement = placement ?? getPlacement(alignX, alignY);\n const { styles: popperStyles, attributes } = usePopper(target, tooltipRef, {\n strategy,\n placement: _placement,\n modifiers,\n });\n\n const { document } = useDOM();\n useGlobalEventListener(document, \"click\", isShown && onClose, {\n passive: true,\n });\n // NOTE: setting isShown to true used to trigger usePopper().forceUpdate()\n\n const childRef = isDOMTypeElement<\n React.HTMLAttributes<HTMLElement>,\n HTMLElement\n >(children)\n ? children.ref\n : React.isValidElement<HasRootRef<HTMLElement>>(children)\n ? children.props.getRootRef\n : null;\n const patchedRef = useExternRef(setTarget, 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 <SimpleTooltip\n {...restProps}\n appearance={appearance}\n arrow={arrow}\n ref={(el) => setTooltipRef(el)}\n style={{\n arrow: popperStyles.arrow,\n container: popperStyles.popper,\n }}\n attributes={{\n arrow: attributes.arrow ?? null,\n container: attributes.popper ?? null,\n }}\n />,\n tooltipContainer\n )}\n </React.Fragment>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"Tooltip.js","names":["React","ReactDOM","classNamesString","Subhead","useNavTransition","PopperArrow","usePopper","tooltipContainerAttr","useExternRef","useDOM","warnOnce","hasReactNode","useGlobalEventListener","isDOMTypeElement","element","isValidElement","type","warn","IS_DEV","process","env","NODE_ENV","SimpleTooltip","forwardRef","ref","appearance","header","text","arrow","style","popperStyles","attributes","className","container","containerClassName","restContainerAttributes","styles","mapAlignX","x","getPlacement","alignX","alignY","filter","p","join","isVerticalPlacement","placement","startsWith","Tooltip","children","isShown","_isShown","offsetX","offsetY","onClose","cornerOffset","cornerAbsoluteOffset","restProps","entering","useState","tooltipRef","setTooltipRef","target","setTarget","multiChildren","Children","count","primitiveChild","JSON","stringify","Boolean","tooltipContainer","useMemo","closest","strategy","position","Error","modifiers","name","options","offset","push","padding","enabled","phase","fn","state","modifiersData","undefined","y","_placement","document","passive","childRef","props","getRootRef","patchedRef","child","cloneElement","createPortal","el","popper"],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { useNavTransition } from \"../NavTransitionContext/NavTransitionContext\";\nimport { PopperArrow } from \"../PopperArrow/PopperArrow\";\nimport { Modifier, usePopper } from \"react-popper\";\nimport { Placement } from \"@popperjs/core\";\nimport { tooltipContainerAttr } from \"./TooltipContainer\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { useDOM } from \"../../lib/dom\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport { HasRootRef } from \"../../types\";\nimport styles from \"./Tooltip.module.css\";\n\ninterface SimpleTooltipProps extends Partial<TooltipProps> {\n target?: HTMLDivElement;\n style?: {\n arrow: React.CSSProperties;\n container: React.CSSProperties;\n };\n attributes?: {\n arrow: React.HTMLAttributes<HTMLDivElement> | null;\n container: React.HTMLAttributes<HTMLDivElement> | null;\n };\n className?: string;\n}\n\n/**\n * Перебиваем `ref`.\n *\n * В оригинальном `React.DOMElement` задаётся `React.LegacyRef<T>`, в котором есть `string`.\n * Когда как `{ ref: \"string\" }` уже давно депрекейтнут.\n */\ninterface DOMElement<\n P extends React.HTMLAttributes<T> | React.SVGAttributes<T>,\n 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\");\nconst IS_DEV = process.env.NODE_ENV === \"development\";\n\nconst SimpleTooltip = React.forwardRef<HTMLDivElement, SimpleTooltipProps>(\n function SimpleTooltip(\n {\n appearance = \"accent\",\n header,\n text,\n arrow,\n style: popperStyles = {},\n attributes,\n className,\n },\n ref\n ) {\n const { className: containerClassName, ...restContainerAttributes } =\n attributes?.container ?? {};\n\n return (\n <div\n className={classNamesString(\n styles[\"Tooltip\"],\n styles[`Tooltip--appearance-${appearance}`],\n className\n )}\n >\n <div\n className={classNamesString(\n styles[\"Tooltip__container\"],\n containerClassName\n )}\n ref={ref}\n style={popperStyles.container}\n {...restContainerAttributes}\n >\n {arrow && (\n <PopperArrow\n style={popperStyles.arrow}\n attributes={attributes?.arrow}\n arrowClassName={styles[\"Tooltip__arrow\"]}\n />\n )}\n <div className={styles[\"Tooltip__content\"]}>\n {header && (\n <Subhead weight=\"2\" className={styles[\"Tooltip__title\"]}>\n {header}\n </Subhead>\n )}\n {text && (\n <Subhead className={styles[\"Tooltip__text\"]}>{text}</Subhead>\n )}\n </div>\n </div>\n </div>\n );\n }\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 cornerOffset?: number;\n /**\n * Сдвиг стрелочки относительно ширины тултипа\n */\n cornerAbsoluteOffset?: number;\n /**\n * Callback, который вызывается при клике по любому месту в пределах экрана.\n */\n onClose?: () => void;\n /**\n * По умолчанию компонент выберет наилучшее расположение сам. Но его можно задать извне с помощью этого свойства\n */\n placement?: Placement;\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 getPlacement(\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: Placement) {\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: _isShown = true,\n offsetX = 0,\n offsetY = 15,\n alignX,\n alignY,\n onClose,\n cornerOffset = 0,\n cornerAbsoluteOffset,\n appearance,\n arrow = true,\n placement,\n ...restProps\n}: TooltipProps) => {\n const { entering } = useNavTransition();\n const isShown = _isShown && !entering;\n const [tooltipRef, setTooltipRef] = React.useState<HTMLElement | null>(null);\n const [target, setTarget] = React.useState<HTMLElement>();\n\n if (IS_DEV) {\n const multiChildren = React.Children.count(children) > 1;\n // Empty children is a noop\n const primitiveChild =\n 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 /* eslint-disable no-restricted-properties */\n /* eslint-disable @typescript-eslint/no-unnecessary-type-assertion*/\n const tooltipContainer = React.useMemo(\n () => target?.closest(`[${tooltipContainerAttr}]`) as HTMLDivElement,\n [target]\n );\n const strategy = React.useMemo(\n () => (target?.style.position === \"fixed\" ? \"fixed\" : \"absolute\"),\n [target]\n );\n /* eslint-enable @typescript-eslint/no-unnecessary-type-assertion*/\n /* eslint-enable no-restricted-properties */\n\n if (IS_DEV && target && !tooltipContainer) {\n throw new Error(\n \"Use TooltipContainer for Tooltip outside Panel (see docs)\"\n );\n }\n\n const modifiers = React.useMemo(() => {\n const modifiers: Array<Modifier<string>> = [\n {\n name: \"offset\",\n options: {\n offset: [offsetX, offsetY],\n },\n },\n {\n name: \"preventOverflow\",\n },\n {\n name: \"flip\",\n },\n ];\n\n if (arrow) {\n modifiers.push({\n name: \"arrow\",\n options: {\n padding: 14,\n },\n });\n modifiers.push({\n name: \"arrowOffset\",\n enabled: true,\n phase: \"main\",\n fn({ state }) {\n if (!state.modifiersData.arrow) {\n return;\n }\n if (isVerticalPlacement(state.placement)) {\n if (cornerAbsoluteOffset !== undefined) {\n state.modifiersData.arrow.x = cornerAbsoluteOffset;\n } else {\n if (state.modifiersData.arrow?.x !== undefined) {\n state.modifiersData.arrow.x += cornerOffset;\n }\n }\n } else {\n if (cornerAbsoluteOffset !== undefined) {\n state.modifiersData.arrow.y = cornerAbsoluteOffset;\n } else {\n if (state.modifiersData.arrow?.y !== undefined) {\n state.modifiersData.arrow.y += cornerOffset;\n }\n }\n }\n },\n });\n }\n\n return modifiers;\n }, [arrow, cornerAbsoluteOffset, cornerOffset, offsetX, offsetY]);\n\n const _placement = placement ?? getPlacement(alignX, alignY);\n const { styles: popperStyles, attributes } = usePopper(target, tooltipRef, {\n strategy,\n placement: _placement,\n modifiers,\n });\n\n const { document } = useDOM();\n useGlobalEventListener(document, \"click\", isShown && onClose, {\n passive: true,\n });\n // NOTE: setting isShown to true used to trigger usePopper().forceUpdate()\n\n const childRef = isDOMTypeElement<\n React.HTMLAttributes<HTMLElement>,\n HTMLElement\n >(children)\n ? children.ref\n : React.isValidElement<HasRootRef<HTMLElement>>(children)\n ? children.props.getRootRef\n : null;\n const patchedRef = useExternRef(setTarget, 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 <SimpleTooltip\n {...restProps}\n appearance={appearance}\n arrow={arrow}\n ref={(el) => setTooltipRef(el)}\n style={{\n arrow: popperStyles.arrow,\n container: popperStyles.popper,\n }}\n attributes={{\n arrow: attributes.arrow ?? null,\n container: attributes.popper ?? null,\n }}\n />,\n tooltipContainer\n )}\n </React.Fragment>\n );\n};\n"],"mappings":"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"}