@planningcenter/tapestry-react 2.5.1 → 2.5.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 (4) hide show
  1. package/dist/cjs/Tooltip/Tooltip.js +17 -17
  2. package/dist/esm/Tooltip/Tooltip.js +18 -18
  3. package/package.json +1 -1
  4. package/src/Tooltip/Tooltip.js +20 -18
package/dist/cjs/Tooltip/Tooltip.js CHANGED
@@ -60,8 +60,8 @@ function Tooltip(props, ref) {
60
60
  var isPageInView = true;
61
61
  var isFocused = false;
62
62
  var isMouseDown = false;
63
- var openTimeoutId = null;
64
- var closeTimeoutId = null; // prevents tooltips showing when focused and navigating back to a page after leaving
63
+ var openTimeoutId = (0, _react.useRef)(null);
64
+ var closeTimeoutId = (0, _react.useRef)(null); // prevents tooltips showing when focused and navigating back to a page after leaving
65
65
 
66
66
  var cleanupPageViewChange = (0, _react.useCallback)((0, _utils.pageViewChange)(function (inView) {
67
67
  return setTimeout(function () {
@@ -77,21 +77,21 @@ function Tooltip(props, ref) {
77
77
  emitter.on('CLOSE_OPEN_TOOLTIPS', close);
78
78
  return function () {
79
79
  emitter.off('CLOSE_OPEN_TOOLTIPS', close);
80
- clearTimeout(openTimeoutId);
81
- clearTimeout(closeTimeoutId);
80
+ clearTimeout(openTimeoutId.current);
81
+ clearTimeout(closeTimeoutId.current);
82
82
  cleanupPageViewChange();
83
83
  };
84
84
  }, []);
85
85
 
86
86
  var open = function open() {
87
- clearTimeout(closeTimeoutId);
88
- closeTimeoutId = null;
87
+ clearTimeout(closeTimeoutId.current);
88
+ closeTimeoutId.current = null;
89
89
  setIsPopoverOpen(true);
90
90
  };
91
91
 
92
92
  var close = function close() {
93
- clearTimeout(openTimeoutId);
94
- openTimeoutId = null;
93
+ clearTimeout(openTimeoutId.current);
94
+ openTimeoutId.current = null;
95
95
  setIsPopoverOpen(false);
96
96
  };
97
97
 
@@ -119,13 +119,13 @@ function Tooltip(props, ref) {
119
119
  var createOpenTimeout = (0, _react.useCallback)(function () {
120
120
  clearGlobalTimeout();
121
121
 
122
- if (openTimeoutId === null) {
123
- clearTimeout(closeTimeoutId);
124
- closeTimeoutId = null;
122
+ if (openTimeoutId.current === null) {
123
+ clearTimeout(closeTimeoutId.current);
124
+ closeTimeoutId.current = null;
125
125
 
126
126
  if (isPopoverOpen === false) {
127
127
  emitter.emit('CLOSE_OPEN_TOOLTIPS');
128
- openTimeoutId = setTimeout(function () {
128
+ openTimeoutId.current = setTimeout(function () {
129
129
  return open();
130
130
  }, instantDelay ? 0 : openDelay);
131
131
  }
@@ -134,11 +134,11 @@ function Tooltip(props, ref) {
134
134
  var createCloseTimeout = (0, _react.useCallback)(function () {
135
135
  startGlobalTimeout();
136
136
 
137
- if (closeTimeoutId === null) {
138
- clearTimeout(openTimeoutId);
139
- openTimeoutId = null;
140
- closeTimeoutId = setTimeout(function () {
141
- close();
137
+ if (closeTimeoutId.current === null) {
138
+ clearTimeout(openTimeoutId.current);
139
+ openTimeoutId.current = null;
140
+ closeTimeoutId.current = setTimeout(function () {
141
+ return close();
142
142
  }, closeDelay);
143
143
  }
144
144
  });
package/dist/esm/Tooltip/Tooltip.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
- import React, { Children, cloneElement, forwardRef, useState, useCallback, useImperativeHandle, useEffect } from 'react';
3
+ import React, { Children, cloneElement, forwardRef, useRef, useState, useCallback, useImperativeHandle, useEffect } from 'react';
4
4
  import mitt from 'mitt';
5
5
  import Popover from '../Popover';
6
6
  import { composeEvents, pageViewChange } from '../utils';
@@ -44,8 +44,8 @@ function Tooltip(props, ref) {
44
44
  var isPageInView = true;
45
45
  var isFocused = false;
46
46
  var isMouseDown = false;
47
- var openTimeoutId = null;
48
- var closeTimeoutId = null; // prevents tooltips showing when focused and navigating back to a page after leaving
47
+ var openTimeoutId = useRef(null);
48
+ var closeTimeoutId = useRef(null); // prevents tooltips showing when focused and navigating back to a page after leaving
49
49
 
50
50
  var cleanupPageViewChange = useCallback(pageViewChange(function (inView) {
51
51
  return setTimeout(function () {
@@ -61,21 +61,21 @@ function Tooltip(props, ref) {
61
61
  emitter.on('CLOSE_OPEN_TOOLTIPS', close);
62
62
  return function () {
63
63
  emitter.off('CLOSE_OPEN_TOOLTIPS', close);
64
- clearTimeout(openTimeoutId);
65
- clearTimeout(closeTimeoutId);
64
+ clearTimeout(openTimeoutId.current);
65
+ clearTimeout(closeTimeoutId.current);
66
66
  cleanupPageViewChange();
67
67
  };
68
68
  }, []);
69
69
 
70
70
  var open = function open() {
71
- clearTimeout(closeTimeoutId);
72
- closeTimeoutId = null;
71
+ clearTimeout(closeTimeoutId.current);
72
+ closeTimeoutId.current = null;
73
73
  setIsPopoverOpen(true);
74
74
  };
75
75
 
76
76
  var close = function close() {
77
- clearTimeout(openTimeoutId);
78
- openTimeoutId = null;
77
+ clearTimeout(openTimeoutId.current);
78
+ openTimeoutId.current = null;
79
79
  setIsPopoverOpen(false);
80
80
  };
81
81
 
@@ -103,13 +103,13 @@ function Tooltip(props, ref) {
103
103
  var createOpenTimeout = useCallback(function () {
104
104
  clearGlobalTimeout();
105
105
 
106
- if (openTimeoutId === null) {
107
- clearTimeout(closeTimeoutId);
108
- closeTimeoutId = null;
106
+ if (openTimeoutId.current === null) {
107
+ clearTimeout(closeTimeoutId.current);
108
+ closeTimeoutId.current = null;
109
109
 
110
110
  if (isPopoverOpen === false) {
111
111
  emitter.emit('CLOSE_OPEN_TOOLTIPS');
112
- openTimeoutId = setTimeout(function () {
112
+ openTimeoutId.current = setTimeout(function () {
113
113
  return open();
114
114
  }, instantDelay ? 0 : openDelay);
115
115
  }
@@ -118,11 +118,11 @@ function Tooltip(props, ref) {
118
118
  var createCloseTimeout = useCallback(function () {
119
119
  startGlobalTimeout();
120
120
 
121
- if (closeTimeoutId === null) {
122
- clearTimeout(openTimeoutId);
123
- openTimeoutId = null;
124
- closeTimeoutId = setTimeout(function () {
125
- close();
121
+ if (closeTimeoutId.current === null) {
122
+ clearTimeout(openTimeoutId.current);
123
+ openTimeoutId.current = null;
124
+ closeTimeoutId.current = setTimeout(function () {
125
+ return close();
126
126
  }, closeDelay);
127
127
  }
128
128
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@planningcenter/tapestry-react",
3
- "version": "2.5.1",
3
+ "version": "2.5.2",
4
4
  "description": "A collection of flexible React components to help you build resilient, accessible user interfaces quickly and effectively.",
5
5
  "author": "Front End Systems Engineering <frontend@pco.bz>",
6
6
  "main": "dist/cjs/index.js",
package/src/Tooltip/Tooltip.js CHANGED
@@ -3,6 +3,7 @@ import React, {
3
3
  Children,
4
4
  cloneElement,
5
5
  forwardRef,
6
+ useRef,
6
7
  useState,
7
8
  useCallback,
8
9
  useImperativeHandle,
@@ -124,8 +125,8 @@ function Tooltip(props: Props, ref) {
124
125
  let isPageInView = true
125
126
  let isFocused = false
126
127
  let isMouseDown = false
127
- let openTimeoutId = null
128
- let closeTimeoutId = null
128
+ let openTimeoutId = useRef(null)
129
+ let closeTimeoutId = useRef(null)
129
130
 
130
131
  // prevents tooltips showing when focused and navigating back to a page after leaving
131
132
  const cleanupPageViewChange = useCallback(
@@ -137,21 +138,21 @@ function Tooltip(props: Props, ref) {
137
138
  emitter.on('CLOSE_OPEN_TOOLTIPS', close)
138
139
  return () => {
139
140
  emitter.off('CLOSE_OPEN_TOOLTIPS', close)
140
- clearTimeout(openTimeoutId)
141
- clearTimeout(closeTimeoutId)
141
+ clearTimeout(openTimeoutId.current)
142
+ clearTimeout(closeTimeoutId.current)
142
143
  cleanupPageViewChange()
143
144
  }
144
145
  }, [])
145
146
 
146
147
  const open = () => {
147
- clearTimeout(closeTimeoutId)
148
- closeTimeoutId = null
148
+ clearTimeout(closeTimeoutId.current)
149
+ closeTimeoutId.current = null
149
150
  setIsPopoverOpen(true)
150
151
  }
151
152
 
152
153
  const close = () => {
153
- clearTimeout(openTimeoutId)
154
- openTimeoutId = null
154
+ clearTimeout(openTimeoutId.current)
155
+ openTimeoutId.current = null
155
156
  setIsPopoverOpen(false)
156
157
  }
157
158
 
@@ -179,24 +180,25 @@ function Tooltip(props: Props, ref) {
179
180
 
180
181
  const createOpenTimeout = useCallback(() => {
181
182
  clearGlobalTimeout()
182
- if (openTimeoutId === null) {
183
- clearTimeout(closeTimeoutId)
184
- closeTimeoutId = null
183
+ if (openTimeoutId.current === null) {
184
+ clearTimeout(closeTimeoutId.current)
185
+ closeTimeoutId.current = null
185
186
  if (isPopoverOpen === false) {
186
187
  emitter.emit('CLOSE_OPEN_TOOLTIPS')
187
- openTimeoutId = setTimeout(() => open(), instantDelay ? 0 : openDelay)
188
+ openTimeoutId.current = setTimeout(
189
+ () => open(),
190
+ instantDelay ? 0 : openDelay
191
+ )
188
192
  }
189
193
  }
190
194
  })
191
195
 
192
196
  const createCloseTimeout = useCallback(() => {
193
197
  startGlobalTimeout()
194
- if (closeTimeoutId === null) {
195
- clearTimeout(openTimeoutId)
196
- openTimeoutId = null
197
- closeTimeoutId = setTimeout(() => {
198
- close()
199
- }, closeDelay)
198
+ if (closeTimeoutId.current === null) {
199
+ clearTimeout(openTimeoutId.current)
200
+ openTimeoutId.current = null
201
+ closeTimeoutId.current = setTimeout(() => close(), closeDelay)
200
202
  }
201
203
  })
202
204