@atlaskit/emoji 71.6.1 → 71.6.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,19 @@
1
1
  # @atlaskit/emoji
2
2
 
3
+ ## 71.6.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [`25f3fd2950876`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/25f3fd2950876) -
8
+ Position emoji popups correctly when the page is scrolled
9
+ - Updated dependencies
10
+
11
+ ## 71.6.2
12
+
13
+ ### Patch Changes
14
+
15
+ - Updated dependencies
16
+
3
17
  ## 71.6.1
4
18
 
5
19
  ### Patch Changes
@@ -17,6 +17,12 @@ var getTargetNode = function getTargetNode(target) {
17
17
  // Expect to be an element
18
18
  return target;
19
19
  };
20
+ var getWindowScroll = function getWindowScroll() {
21
+ return {
22
+ x: window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0,
23
+ y: window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
24
+ };
25
+ };
20
26
  var Popup = function Popup(props) {
21
27
  var _props$relativePositi = props.relativePosition,
22
28
  relativePosition = _props$relativePositi === void 0 ? 'auto' : _props$relativePositi,
@@ -49,8 +55,9 @@ var Popup = function Popup(props) {
49
55
  var targetNode = getTargetNode(target);
50
56
  if (targetNode && popup.current) {
51
57
  var box = targetNode.getBoundingClientRect();
52
- var top = box.bottom + (offsetY || 0);
53
- var left = getLeftPosition(box);
58
+ var scroll = getWindowScroll();
59
+ var top = box.bottom + scroll.y + (offsetY || 0);
60
+ var left = getLeftPosition(box) + scroll.x;
54
61
  popup.current.style.top = "".concat(top, "px");
55
62
  popup.current.style.bottom = '';
56
63
  popup.current.style.left = "".concat(left, "px");
@@ -63,8 +70,9 @@ var Popup = function Popup(props) {
63
70
  var targetNode = getTargetNode(target);
64
71
  if (targetNode && popup.current) {
65
72
  var box = targetNode.getBoundingClientRect();
66
- var bottom = window.innerHeight - box.top + (offsetY || 0);
67
- var left = getLeftPosition(box);
73
+ var scroll = getWindowScroll();
74
+ var bottom = window.innerHeight - box.top - scroll.y + (offsetY || 0);
75
+ var left = getLeftPosition(box) + scroll.x;
68
76
  popup.current.style.top = '';
69
77
  popup.current.style.bottom = "".concat(bottom, "px");
70
78
  popup.current.style.left = "".concat(left, "px");
@@ -20,7 +20,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
20
20
  actionSubjectId: actionSubjectId,
21
21
  attributes: _objectSpread({
22
22
  packageName: "@atlaskit/emoji",
23
- packageVersion: "71.6.0"
23
+ packageVersion: "71.6.2"
24
24
  }, attributes)
25
25
  };
26
26
  };
@@ -7,6 +7,10 @@ const getTargetNode = target => {
7
7
  // Expect to be an element
8
8
  return target;
9
9
  };
10
+ const getWindowScroll = () => ({
11
+ x: window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0,
12
+ y: window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
13
+ });
10
14
  const Popup = props => {
11
15
  const {
12
16
  relativePosition = 'auto',
@@ -33,8 +37,9 @@ const Popup = props => {
33
37
  const targetNode = getTargetNode(target);
34
38
  if (targetNode && popup.current) {
35
39
  const box = targetNode.getBoundingClientRect();
36
- const top = box.bottom + (offsetY || 0);
37
- const left = getLeftPosition(box);
40
+ const scroll = getWindowScroll();
41
+ const top = box.bottom + scroll.y + (offsetY || 0);
42
+ const left = getLeftPosition(box) + scroll.x;
38
43
  popup.current.style.top = `${top}px`;
39
44
  popup.current.style.bottom = '';
40
45
  popup.current.style.left = `${left}px`;
@@ -47,8 +52,9 @@ const Popup = props => {
47
52
  const targetNode = getTargetNode(target);
48
53
  if (targetNode && popup.current) {
49
54
  const box = targetNode.getBoundingClientRect();
50
- const bottom = window.innerHeight - box.top + (offsetY || 0);
51
- const left = getLeftPosition(box);
55
+ const scroll = getWindowScroll();
56
+ const bottom = window.innerHeight - box.top - scroll.y + (offsetY || 0);
57
+ const left = getLeftPosition(box) + scroll.x;
52
58
  popup.current.style.top = '';
53
59
  popup.current.style.bottom = `${bottom}px`;
54
60
  popup.current.style.left = `${left}px`;
@@ -9,7 +9,7 @@ const createEvent = (eventType, action, actionSubject, actionSubjectId, attribut
9
9
  actionSubjectId,
10
10
  attributes: {
11
11
  packageName: "@atlaskit/emoji",
12
- packageVersion: "71.6.0",
12
+ packageVersion: "71.6.2",
13
13
  ...attributes
14
14
  }
15
15
  });
@@ -8,6 +8,12 @@ var getTargetNode = function getTargetNode(target) {
8
8
  // Expect to be an element
9
9
  return target;
10
10
  };
11
+ var getWindowScroll = function getWindowScroll() {
12
+ return {
13
+ x: window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0,
14
+ y: window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
15
+ };
16
+ };
11
17
  var Popup = function Popup(props) {
12
18
  var _props$relativePositi = props.relativePosition,
13
19
  relativePosition = _props$relativePositi === void 0 ? 'auto' : _props$relativePositi,
@@ -40,8 +46,9 @@ var Popup = function Popup(props) {
40
46
  var targetNode = getTargetNode(target);
41
47
  if (targetNode && popup.current) {
42
48
  var box = targetNode.getBoundingClientRect();
43
- var top = box.bottom + (offsetY || 0);
44
- var left = getLeftPosition(box);
49
+ var scroll = getWindowScroll();
50
+ var top = box.bottom + scroll.y + (offsetY || 0);
51
+ var left = getLeftPosition(box) + scroll.x;
45
52
  popup.current.style.top = "".concat(top, "px");
46
53
  popup.current.style.bottom = '';
47
54
  popup.current.style.left = "".concat(left, "px");
@@ -54,8 +61,9 @@ var Popup = function Popup(props) {
54
61
  var targetNode = getTargetNode(target);
55
62
  if (targetNode && popup.current) {
56
63
  var box = targetNode.getBoundingClientRect();
57
- var bottom = window.innerHeight - box.top + (offsetY || 0);
58
- var left = getLeftPosition(box);
64
+ var scroll = getWindowScroll();
65
+ var bottom = window.innerHeight - box.top - scroll.y + (offsetY || 0);
66
+ var left = getLeftPosition(box) + scroll.x;
59
67
  popup.current.style.top = '';
60
68
  popup.current.style.bottom = "".concat(bottom, "px");
61
69
  popup.current.style.left = "".concat(left, "px");
@@ -14,7 +14,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
14
14
  actionSubjectId: actionSubjectId,
15
15
  attributes: _objectSpread({
16
16
  packageName: "@atlaskit/emoji",
17
- packageVersion: "71.6.0"
17
+ packageVersion: "71.6.2"
18
18
  }, attributes)
19
19
  };
20
20
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/emoji",
3
- "version": "71.6.1",
3
+ "version": "71.6.3",
4
4
  "description": "Fabric emoji React components",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -49,7 +49,7 @@
49
49
  "@atlaskit/spinner": "^20.1.0",
50
50
  "@atlaskit/textfield": "^9.1.0",
51
51
  "@atlaskit/theme": "^26.1.0",
52
- "@atlaskit/tmp-editor-statsig": "^114.6.0",
52
+ "@atlaskit/tmp-editor-statsig": "^116.0.0",
53
53
  "@atlaskit/tokens": "^15.2.0",
54
54
  "@atlaskit/tooltip": "^23.1.0",
55
55
  "@atlaskit/ufo": "^1.0.0",