@atlaskit/smart-card 21.0.1 → 21.0.2

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 (8) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/cjs/version.json +1 -1
  3. package/dist/cjs/view/HoverCard/components/HoverCardComponent.js +20 -20
  4. package/dist/es2019/version.json +1 -1
  5. package/dist/es2019/view/HoverCard/components/HoverCardComponent.js +20 -20
  6. package/dist/esm/version.json +1 -1
  7. package/dist/esm/view/HoverCard/components/HoverCardComponent.js +20 -20
  8. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @atlaskit/smart-card
2
2
 
3
+ ## 21.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`0a08e95af20`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0a08e95af20) - fix bug where scrolling onto an inline link opens hover card in unexpected locations
8
+
3
9
  ## 21.0.1
4
10
 
5
11
  ### Patch Changes
package/dist/cjs/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "21.0.1",
3
+ "version": "21.0.2",
4
4
  "sideEffects": false
5
5
  }
package/dist/cjs/view/HoverCard/components/HoverCardComponent.js CHANGED
@@ -54,16 +54,23 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
54
54
  var fadeOutTimeoutId = (0, _react.useRef)();
55
55
  var fadeInTimeoutId = (0, _react.useRef)();
56
56
  var cardOpenTime = (0, _react.useRef)();
57
- var mousePos = (0, _react.useRef)({
58
- x: 0,
59
- y: 0
60
- });
57
+ var mousePos = (0, _react.useRef)();
61
58
  var popupOffset = (0, _react.useRef)();
62
59
  var parentSpan = (0, _react.useRef)(null);
63
60
  var renderers = (0, _renderers.useSmartLinkRenderers)();
64
61
  var linkState = (0, _store.useSmartCardState)(url);
65
62
  var hoverDisplay = 'card';
66
63
  var invokeMethod = 'mouse_hover';
64
+ var setMousePosition = (0, _react.useCallback)(function (event) {
65
+ if (isOpen) {
66
+ return;
67
+ }
68
+
69
+ mousePos.current = {
70
+ x: event.clientX,
71
+ y: event.clientY
72
+ };
73
+ }, [isOpen]);
67
74
  var hideCard = (0, _react.useCallback)(function () {
68
75
  //Check its previously open to avoid firing events when moving between the child and hover card components
69
76
  if (isOpen === true && cardOpenTime.current) {
@@ -82,19 +89,22 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
82
89
  return hideCard();
83
90
  }, delay);
84
91
  }, [hideCard]);
85
- var initShowCard = (0, _react.useCallback)(function () {
92
+ var initShowCard = (0, _react.useCallback)(function (event) {
86
93
  if (fadeOutTimeoutId.current) {
87
94
  clearTimeout(fadeOutTimeoutId.current);
88
- }
95
+ } //Set mouse position in the case it's not already set by onMouseMove, as in the case of scrolling
96
+
89
97
 
98
+ setMousePosition(event);
90
99
  fadeInTimeoutId.current = setTimeout(function () {
91
100
  //Check if its previously closed to avoid firing events when moving between the child and hover card components
92
101
  if (isOpen === false) {
93
102
  cardOpenTime.current = Date.now();
94
103
  analytics.ui.hoverCardViewedEvent(hoverDisplay, invokeMethod);
95
- }
104
+ } //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
105
+
96
106
 
97
- if (parentSpan.current) {
107
+ if (parentSpan.current && mousePos.current) {
98
108
  var _parentSpan$current$g = parentSpan.current.getBoundingClientRect(),
99
109
  bottom = _parentSpan$current$g.bottom,
100
110
  left = _parentSpan$current$g.left;
@@ -104,7 +114,7 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
104
114
 
105
115
  setIsOpen(true);
106
116
  }, delay);
107
- }, [delay, isOpen, analytics.ui]);
117
+ }, [isOpen, setMousePosition, analytics.ui]);
108
118
  var linkActions = (0, _useSmartLinkActions.useSmartLinkActions)({
109
119
  url: url,
110
120
  appearance: _utils.SMART_CARD_ANALYTICS_DISPLAY,
@@ -114,17 +124,7 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
114
124
  if (actionId === 'preview-content') {
115
125
  hideCard();
116
126
  }
117
- }, [hideCard]);
118
- var setMousePosition = (0, _react.useCallback)(function (event) {
119
- if (isOpen) {
120
- return;
121
- }
122
-
123
- mousePos.current = {
124
- x: event.clientX,
125
- y: event.clientY
126
- };
127
- }, [isOpen]); // Stop hover preview content to propagate event to parent.
127
+ }, [hideCard]); // Stop hover preview content to propagate event to parent.
128
128
 
129
129
  var onClick = (0, _react.useCallback)(function (e) {
130
130
  return e.stopPropagation();
package/dist/es2019/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "21.0.1",
3
+ "version": "21.0.2",
4
4
  "sideEffects": false
5
5
  }
package/dist/es2019/view/HoverCard/components/HoverCardComponent.js CHANGED
@@ -22,16 +22,23 @@ export const HoverCardComponent = ({
22
22
  const fadeOutTimeoutId = useRef();
23
23
  const fadeInTimeoutId = useRef();
24
24
  const cardOpenTime = useRef();
25
- const mousePos = useRef({
26
- x: 0,
27
- y: 0
28
- });
25
+ const mousePos = useRef();
29
26
  const popupOffset = useRef();
30
27
  const parentSpan = useRef(null);
31
28
  const renderers = useSmartLinkRenderers();
32
29
  const linkState = useLinkState(url);
33
30
  const hoverDisplay = 'card';
34
31
  const invokeMethod = 'mouse_hover';
32
+ const setMousePosition = useCallback(event => {
33
+ if (isOpen) {
34
+ return;
35
+ }
36
+
37
+ mousePos.current = {
38
+ x: event.clientX,
39
+ y: event.clientY
40
+ };
41
+ }, [isOpen]);
35
42
  const hideCard = useCallback(() => {
36
43
  //Check its previously open to avoid firing events when moving between the child and hover card components
37
44
  if (isOpen === true && cardOpenTime.current) {
@@ -48,19 +55,22 @@ export const HoverCardComponent = ({
48
55
 
49
56
  fadeOutTimeoutId.current = setTimeout(() => hideCard(), delay);
50
57
  }, [hideCard]);
51
- const initShowCard = useCallback(() => {
58
+ const initShowCard = useCallback(event => {
52
59
  if (fadeOutTimeoutId.current) {
53
60
  clearTimeout(fadeOutTimeoutId.current);
54
- }
61
+ } //Set mouse position in the case it's not already set by onMouseMove, as in the case of scrolling
62
+
55
63
 
64
+ setMousePosition(event);
56
65
  fadeInTimeoutId.current = setTimeout(() => {
57
66
  //Check if its previously closed to avoid firing events when moving between the child and hover card components
58
67
  if (isOpen === false) {
59
68
  cardOpenTime.current = Date.now();
60
69
  analytics.ui.hoverCardViewedEvent(hoverDisplay, invokeMethod);
61
- }
70
+ } //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
71
+
62
72
 
63
- if (parentSpan.current) {
73
+ if (parentSpan.current && mousePos.current) {
64
74
  const {
65
75
  bottom,
66
76
  left
@@ -70,7 +80,7 @@ export const HoverCardComponent = ({
70
80
 
71
81
  setIsOpen(true);
72
82
  }, delay);
73
- }, [delay, isOpen, analytics.ui]);
83
+ }, [isOpen, setMousePosition, analytics.ui]);
74
84
  const linkActions = useSmartLinkActions({
75
85
  url,
76
86
  appearance: SMART_CARD_ANALYTICS_DISPLAY,
@@ -80,17 +90,7 @@ export const HoverCardComponent = ({
80
90
  if (actionId === 'preview-content') {
81
91
  hideCard();
82
92
  }
83
- }, [hideCard]);
84
- const setMousePosition = useCallback(event => {
85
- if (isOpen) {
86
- return;
87
- }
88
-
89
- mousePos.current = {
90
- x: event.clientX,
91
- y: event.clientY
92
- };
93
- }, [isOpen]); // Stop hover preview content to propagate event to parent.
93
+ }, [hideCard]); // Stop hover preview content to propagate event to parent.
94
94
 
95
95
  const onClick = useCallback(e => e.stopPropagation(), []);
96
96
  return jsx(Popup, {
package/dist/esm/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "21.0.1",
3
+ "version": "21.0.2",
4
4
  "sideEffects": false
5
5
  }
package/dist/esm/view/HoverCard/components/HoverCardComponent.js CHANGED
@@ -27,16 +27,23 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
27
27
  var fadeOutTimeoutId = useRef();
28
28
  var fadeInTimeoutId = useRef();
29
29
  var cardOpenTime = useRef();
30
- var mousePos = useRef({
31
- x: 0,
32
- y: 0
33
- });
30
+ var mousePos = useRef();
34
31
  var popupOffset = useRef();
35
32
  var parentSpan = useRef(null);
36
33
  var renderers = useSmartLinkRenderers();
37
34
  var linkState = useLinkState(url);
38
35
  var hoverDisplay = 'card';
39
36
  var invokeMethod = 'mouse_hover';
37
+ var setMousePosition = useCallback(function (event) {
38
+ if (isOpen) {
39
+ return;
40
+ }
41
+
42
+ mousePos.current = {
43
+ x: event.clientX,
44
+ y: event.clientY
45
+ };
46
+ }, [isOpen]);
40
47
  var hideCard = useCallback(function () {
41
48
  //Check its previously open to avoid firing events when moving between the child and hover card components
42
49
  if (isOpen === true && cardOpenTime.current) {
@@ -55,19 +62,22 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
55
62
  return hideCard();
56
63
  }, delay);
57
64
  }, [hideCard]);
58
- var initShowCard = useCallback(function () {
65
+ var initShowCard = useCallback(function (event) {
59
66
  if (fadeOutTimeoutId.current) {
60
67
  clearTimeout(fadeOutTimeoutId.current);
61
- }
68
+ } //Set mouse position in the case it's not already set by onMouseMove, as in the case of scrolling
69
+
62
70
 
71
+ setMousePosition(event);
63
72
  fadeInTimeoutId.current = setTimeout(function () {
64
73
  //Check if its previously closed to avoid firing events when moving between the child and hover card components
65
74
  if (isOpen === false) {
66
75
  cardOpenTime.current = Date.now();
67
76
  analytics.ui.hoverCardViewedEvent(hoverDisplay, invokeMethod);
68
- }
77
+ } //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
78
+
69
79
 
70
- if (parentSpan.current) {
80
+ if (parentSpan.current && mousePos.current) {
71
81
  var _parentSpan$current$g = parentSpan.current.getBoundingClientRect(),
72
82
  bottom = _parentSpan$current$g.bottom,
73
83
  left = _parentSpan$current$g.left;
@@ -77,7 +87,7 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
77
87
 
78
88
  setIsOpen(true);
79
89
  }, delay);
80
- }, [delay, isOpen, analytics.ui]);
90
+ }, [isOpen, setMousePosition, analytics.ui]);
81
91
  var linkActions = useSmartLinkActions({
82
92
  url: url,
83
93
  appearance: SMART_CARD_ANALYTICS_DISPLAY,
@@ -87,17 +97,7 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
87
97
  if (actionId === 'preview-content') {
88
98
  hideCard();
89
99
  }
90
- }, [hideCard]);
91
- var setMousePosition = useCallback(function (event) {
92
- if (isOpen) {
93
- return;
94
- }
95
-
96
- mousePos.current = {
97
- x: event.clientX,
98
- y: event.clientY
99
- };
100
- }, [isOpen]); // Stop hover preview content to propagate event to parent.
100
+ }, [hideCard]); // Stop hover preview content to propagate event to parent.
101
101
 
102
102
  var onClick = useCallback(function (e) {
103
103
  return e.stopPropagation();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "21.0.1",
3
+ "version": "21.0.2",
4
4
  "description": "Smart card component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"