@zendeskgarden/react-tooltips 8.62.1 → 8.62.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.
- package/dist/index.cjs.js +33 -35
- package/dist/index.esm.js +3 -3
- package/package.json +3 -3
package/dist/index.cjs.js
CHANGED
|
@@ -7,8 +7,6 @@
|
|
|
7
7
|
|
|
8
8
|
'use strict';
|
|
9
9
|
|
|
10
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
11
|
-
|
|
12
10
|
var React = require('react');
|
|
13
11
|
var reactDom = require('react-dom');
|
|
14
12
|
var PropTypes = require('prop-types');
|
|
@@ -19,12 +17,12 @@ var containerUtilities = require('@zendeskgarden/container-utilities');
|
|
|
19
17
|
var reactPopper = require('react-popper');
|
|
20
18
|
var reactTheming = require('@zendeskgarden/react-theming');
|
|
21
19
|
|
|
22
|
-
function
|
|
20
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
23
21
|
|
|
24
|
-
var React__default = /*#__PURE__*/
|
|
25
|
-
var PropTypes__default = /*#__PURE__*/
|
|
26
|
-
var styled__default = /*#__PURE__*/
|
|
27
|
-
var mergeRefs__default = /*#__PURE__*/
|
|
22
|
+
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
23
|
+
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
|
|
24
|
+
var styled__default = /*#__PURE__*/_interopDefault(styled);
|
|
25
|
+
var mergeRefs__default = /*#__PURE__*/_interopDefault(mergeRefs);
|
|
28
26
|
|
|
29
27
|
function getPopperPlacement(gardenPlacement) {
|
|
30
28
|
const gardenToPopperMapping = {
|
|
@@ -79,9 +77,9 @@ function getArrowPosition(popperPlacement) {
|
|
|
79
77
|
}
|
|
80
78
|
|
|
81
79
|
const COMPONENT_ID$2 = 'tooltip.paragraph';
|
|
82
|
-
const StyledParagraph = styled__default
|
|
80
|
+
const StyledParagraph = styled__default.default.p.attrs({
|
|
83
81
|
'data-garden-id': COMPONENT_ID$2,
|
|
84
|
-
'data-garden-version': '8.62.
|
|
82
|
+
'data-garden-version': '8.62.2'
|
|
85
83
|
}).withConfig({
|
|
86
84
|
displayName: "StyledParagraph",
|
|
87
85
|
componentId: "sc-wuqkfc-0"
|
|
@@ -91,9 +89,9 @@ StyledParagraph.defaultProps = {
|
|
|
91
89
|
};
|
|
92
90
|
|
|
93
91
|
const COMPONENT_ID$1 = 'tooltip.title';
|
|
94
|
-
const StyledTitle = styled__default
|
|
92
|
+
const StyledTitle = styled__default.default.strong.attrs({
|
|
95
93
|
'data-garden-id': COMPONENT_ID$1,
|
|
96
|
-
'data-garden-version': '8.62.
|
|
94
|
+
'data-garden-version': '8.62.2'
|
|
97
95
|
}).withConfig({
|
|
98
96
|
displayName: "StyledTitle",
|
|
99
97
|
componentId: "sc-vnjcvz-0"
|
|
@@ -188,9 +186,9 @@ const colorStyles = _ref2 => {
|
|
|
188
186
|
}
|
|
189
187
|
return styled.css(["border:", ";box-shadow:", ";background-color:", ";color:", ";", "{color:", ";}"], border, boxShadow, backgroundColor, color, StyledTitle, titleColor);
|
|
190
188
|
};
|
|
191
|
-
const StyledTooltip = styled__default
|
|
189
|
+
const StyledTooltip = styled__default.default.div.attrs({
|
|
192
190
|
'data-garden-id': COMPONENT_ID,
|
|
193
|
-
'data-garden-version': '8.62.
|
|
191
|
+
'data-garden-version': '8.62.2'
|
|
194
192
|
}).withConfig({
|
|
195
193
|
displayName: "StyledTooltip",
|
|
196
194
|
componentId: "sc-gzzjq4-0"
|
|
@@ -199,7 +197,7 @@ StyledTooltip.defaultProps = {
|
|
|
199
197
|
theme: reactTheming.DEFAULT_THEME
|
|
200
198
|
};
|
|
201
199
|
|
|
202
|
-
const StyledTooltipWrapper = styled__default
|
|
200
|
+
const StyledTooltipWrapper = styled__default.default.div.withConfig({
|
|
203
201
|
displayName: "StyledTooltipWrapper",
|
|
204
202
|
componentId: "sc-1b7q9q6-0"
|
|
205
203
|
})(["transition:opacity 10ms;opacity:1;z-index:", ";&[aria-hidden='true']{visibility:hidden;opacity:0;}"], props => props.zIndex);
|
|
@@ -251,22 +249,22 @@ const Tooltip = _ref => {
|
|
|
251
249
|
}
|
|
252
250
|
}, [controlledIsVisible, content]);
|
|
253
251
|
const popperPlacement = theme.rtl ? getRtlPopperPlacement(placement) : getPopperPlacement(placement);
|
|
254
|
-
const singleChild = React__default
|
|
252
|
+
const singleChild = React__default.default.Children.only(children);
|
|
255
253
|
const modifiers = {
|
|
256
254
|
preventOverflow: {
|
|
257
255
|
boundariesElement: 'window'
|
|
258
256
|
},
|
|
259
257
|
...popperModifiers
|
|
260
258
|
};
|
|
261
|
-
return React__default
|
|
259
|
+
return React__default.default.createElement(reactPopper.Manager, null, React__default.default.createElement(reactPopper.Reference, null, _ref2 => {
|
|
262
260
|
let {
|
|
263
261
|
ref
|
|
264
262
|
} = _ref2;
|
|
265
263
|
return React.cloneElement(singleChild, getTriggerProps({
|
|
266
264
|
...singleChild.props,
|
|
267
|
-
[refKey]: mergeRefs__default
|
|
265
|
+
[refKey]: mergeRefs__default.default([ref, singleChild.ref ? singleChild.ref : null])
|
|
268
266
|
}));
|
|
269
|
-
}), React__default
|
|
267
|
+
}), React__default.default.createElement(reactPopper.Popper, {
|
|
270
268
|
placement: popperPlacement,
|
|
271
269
|
eventsEnabled: controlledIsVisible && eventsEnabled,
|
|
272
270
|
modifiers: modifiers
|
|
@@ -305,12 +303,12 @@ const Tooltip = _ref => {
|
|
|
305
303
|
type,
|
|
306
304
|
...otherTooltipProps
|
|
307
305
|
};
|
|
308
|
-
const tooltip = React__default
|
|
306
|
+
const tooltip = React__default.default.createElement(StyledTooltipWrapper, {
|
|
309
307
|
ref: controlledIsVisible ? ref : null,
|
|
310
308
|
style: style,
|
|
311
309
|
zIndex: zIndex,
|
|
312
310
|
"aria-hidden": !controlledIsVisible
|
|
313
|
-
}, React__default
|
|
311
|
+
}, React__default.default.createElement(StyledTooltip, getTooltipProps(tooltipProps), content));
|
|
314
312
|
if (appendToNode) {
|
|
315
313
|
return reactDom.createPortal(tooltip, appendToNode);
|
|
316
314
|
}
|
|
@@ -319,19 +317,19 @@ const Tooltip = _ref => {
|
|
|
319
317
|
};
|
|
320
318
|
Tooltip.displayName = 'Tooltip';
|
|
321
319
|
Tooltip.propTypes = {
|
|
322
|
-
appendToNode: PropTypes__default
|
|
323
|
-
hasArrow: PropTypes__default
|
|
324
|
-
delayMS: PropTypes__default
|
|
325
|
-
eventsEnabled: PropTypes__default
|
|
326
|
-
id: PropTypes__default
|
|
327
|
-
content: PropTypes__default
|
|
328
|
-
placement: PropTypes__default
|
|
329
|
-
popperModifiers: PropTypes__default
|
|
330
|
-
size: PropTypes__default
|
|
331
|
-
type: PropTypes__default
|
|
332
|
-
zIndex: PropTypes__default
|
|
333
|
-
isInitialVisible: PropTypes__default
|
|
334
|
-
refKey: PropTypes__default
|
|
320
|
+
appendToNode: PropTypes__default.default.any,
|
|
321
|
+
hasArrow: PropTypes__default.default.bool,
|
|
322
|
+
delayMS: PropTypes__default.default.number,
|
|
323
|
+
eventsEnabled: PropTypes__default.default.bool,
|
|
324
|
+
id: PropTypes__default.default.string,
|
|
325
|
+
content: PropTypes__default.default.node.isRequired,
|
|
326
|
+
placement: PropTypes__default.default.oneOf(PLACEMENT),
|
|
327
|
+
popperModifiers: PropTypes__default.default.any,
|
|
328
|
+
size: PropTypes__default.default.oneOf(SIZE),
|
|
329
|
+
type: PropTypes__default.default.oneOf(TYPE),
|
|
330
|
+
zIndex: PropTypes__default.default.oneOfType([PropTypes__default.default.number, PropTypes__default.default.string]),
|
|
331
|
+
isInitialVisible: PropTypes__default.default.bool,
|
|
332
|
+
refKey: PropTypes__default.default.string
|
|
335
333
|
};
|
|
336
334
|
Tooltip.defaultProps = {
|
|
337
335
|
hasArrow: true,
|
|
@@ -357,12 +355,12 @@ function _extends() {
|
|
|
357
355
|
return _extends.apply(this, arguments);
|
|
358
356
|
}
|
|
359
357
|
|
|
360
|
-
const Paragraph = React.forwardRef((props, ref) => React__default
|
|
358
|
+
const Paragraph = React.forwardRef((props, ref) => React__default.default.createElement(StyledParagraph, _extends({
|
|
361
359
|
ref: ref
|
|
362
360
|
}, props)));
|
|
363
361
|
Paragraph.displayName = 'Paragraph';
|
|
364
362
|
|
|
365
|
-
const Title = React.forwardRef((props, ref) => React__default
|
|
363
|
+
const Title = React.forwardRef((props, ref) => React__default.default.createElement(StyledTitle, _extends({
|
|
366
364
|
ref: ref
|
|
367
365
|
}, props)));
|
|
368
366
|
Title.displayName = 'Title';
|
package/dist/index.esm.js
CHANGED
|
@@ -70,7 +70,7 @@ function getArrowPosition(popperPlacement) {
|
|
|
70
70
|
const COMPONENT_ID$2 = 'tooltip.paragraph';
|
|
71
71
|
const StyledParagraph = styled.p.attrs({
|
|
72
72
|
'data-garden-id': COMPONENT_ID$2,
|
|
73
|
-
'data-garden-version': '8.62.
|
|
73
|
+
'data-garden-version': '8.62.2'
|
|
74
74
|
}).withConfig({
|
|
75
75
|
displayName: "StyledParagraph",
|
|
76
76
|
componentId: "sc-wuqkfc-0"
|
|
@@ -82,7 +82,7 @@ StyledParagraph.defaultProps = {
|
|
|
82
82
|
const COMPONENT_ID$1 = 'tooltip.title';
|
|
83
83
|
const StyledTitle = styled.strong.attrs({
|
|
84
84
|
'data-garden-id': COMPONENT_ID$1,
|
|
85
|
-
'data-garden-version': '8.62.
|
|
85
|
+
'data-garden-version': '8.62.2'
|
|
86
86
|
}).withConfig({
|
|
87
87
|
displayName: "StyledTitle",
|
|
88
88
|
componentId: "sc-vnjcvz-0"
|
|
@@ -179,7 +179,7 @@ const colorStyles = _ref2 => {
|
|
|
179
179
|
};
|
|
180
180
|
const StyledTooltip = styled.div.attrs({
|
|
181
181
|
'data-garden-id': COMPONENT_ID,
|
|
182
|
-
'data-garden-version': '8.62.
|
|
182
|
+
'data-garden-version': '8.62.2'
|
|
183
183
|
}).withConfig({
|
|
184
184
|
displayName: "StyledTooltip",
|
|
185
185
|
componentId: "sc-gzzjq4-0"
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zendeskgarden/react-tooltips",
|
|
3
|
-
"version": "8.62.
|
|
3
|
+
"version": "8.62.2",
|
|
4
4
|
"description": "Collection of components and render prop containers relating to Tooltips in the Garden Design System",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "Zendesk Garden <garden@zendesk.com>",
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"styled-components": "^4.2.0 || ^5.0.0"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
|
-
"@zendeskgarden/react-theming": "^8.62.
|
|
38
|
+
"@zendeskgarden/react-theming": "^8.62.2"
|
|
39
39
|
},
|
|
40
40
|
"keywords": [
|
|
41
41
|
"components",
|
|
@@ -47,5 +47,5 @@
|
|
|
47
47
|
"access": "public"
|
|
48
48
|
},
|
|
49
49
|
"zendeskgarden:src": "src/index.ts",
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "27a7d6c021f3360396af60d51ecbf66e9076a405"
|
|
51
51
|
}
|