@instructure/ui-tooltip 11.7.3-snapshot-25 → 11.7.3-snapshot-26
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 +5 -2
- package/es/Tooltip/v1/index.js +61 -57
- package/es/Tooltip/v1/theme.js +8 -6
- package/es/Tooltip/v2/index.js +61 -57
- package/lib/Tooltip/v1/index.js +61 -57
- package/lib/Tooltip/v1/theme.js +8 -6
- package/lib/Tooltip/v2/index.js +61 -57
- package/package.json +12 -12
- package/tsconfig.build.tsbuildinfo +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,9 +3,12 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
-
## [11.7.3-snapshot-
|
|
6
|
+
## [11.7.3-snapshot-26](https://github.com/instructure/instructure-ui/compare/v11.7.2...v11.7.3-snapshot-26) (2026-05-05)
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* **many:** update dependencies, remove lots of Babel plugins, remove Webpack 4 support ([f916fca](https://github.com/instructure/instructure-ui/commit/f916fcafdddcb2d7de401f93e8ff92cfdfa47bba))
|
|
9
12
|
|
|
10
13
|
|
|
11
14
|
|
package/es/Tooltip/v1/index.js
CHANGED
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
const _excluded = ["renderTip", "isShowingContent", "defaultIsShowingContent", "on", "color", "placement", "mountNode", "constrain", "offsetX", "offsetY", "positionTarget", "onShowContent", "onHideContent", "preventTooltip", "styles"];
|
|
3
|
-
var _dec, _dec2, _class, _Tooltip;
|
|
1
|
+
var _dec, _dec2, _class;
|
|
4
2
|
/*
|
|
5
3
|
* The MIT License (MIT)
|
|
6
4
|
*
|
|
@@ -38,45 +36,58 @@ category: components
|
|
|
38
36
|
---
|
|
39
37
|
**/
|
|
40
38
|
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
41
|
-
let Tooltip = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, generateComponentTheme), _dec(_class = _dec2(_class =
|
|
39
|
+
let Tooltip = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, generateComponentTheme), _dec(_class = _dec2(_class = class Tooltip extends Component {
|
|
40
|
+
static displayName = "Tooltip";
|
|
41
|
+
static componentId = 'Tooltip';
|
|
42
|
+
static allowedProps = allowedProps;
|
|
43
|
+
static defaultProps = {
|
|
44
|
+
defaultIsShowingContent: false,
|
|
45
|
+
color: 'primary',
|
|
46
|
+
placement: 'top',
|
|
47
|
+
constrain: 'window',
|
|
48
|
+
offsetX: 0,
|
|
49
|
+
offsetY: 0,
|
|
50
|
+
preventTooltip: false
|
|
51
|
+
};
|
|
52
|
+
_id;
|
|
53
|
+
ref = null;
|
|
54
|
+
handleRef = el => {
|
|
55
|
+
this.ref = el;
|
|
56
|
+
if (typeof this.props.elementRef === 'function') {
|
|
57
|
+
this.props.elementRef(el);
|
|
58
|
+
}
|
|
59
|
+
};
|
|
42
60
|
constructor(props) {
|
|
43
61
|
super(props);
|
|
44
|
-
this._id = void 0;
|
|
45
|
-
this.ref = null;
|
|
46
|
-
this.handleRef = el => {
|
|
47
|
-
this.ref = el;
|
|
48
|
-
if (typeof this.props.elementRef === 'function') {
|
|
49
|
-
this.props.elementRef(el);
|
|
50
|
-
}
|
|
51
|
-
};
|
|
52
|
-
this.handleFocus = () => {
|
|
53
|
-
this.setState({
|
|
54
|
-
hasFocus: true
|
|
55
|
-
});
|
|
56
|
-
};
|
|
57
|
-
this.handleBlur = () => {
|
|
58
|
-
this.setState({
|
|
59
|
-
hasFocus: false
|
|
60
|
-
});
|
|
61
|
-
};
|
|
62
62
|
this._id = props.deterministicId();
|
|
63
63
|
this.state = {
|
|
64
64
|
hasFocus: false
|
|
65
65
|
};
|
|
66
66
|
}
|
|
67
67
|
componentDidMount() {
|
|
68
|
-
|
|
69
|
-
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
|
|
68
|
+
this.props.makeStyles?.();
|
|
70
69
|
}
|
|
71
70
|
componentDidUpdate() {
|
|
72
|
-
|
|
73
|
-
(_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
|
|
71
|
+
this.props.makeStyles?.();
|
|
74
72
|
}
|
|
73
|
+
handleFocus = () => {
|
|
74
|
+
this.setState({
|
|
75
|
+
hasFocus: true
|
|
76
|
+
});
|
|
77
|
+
};
|
|
78
|
+
handleBlur = () => {
|
|
79
|
+
this.setState({
|
|
80
|
+
hasFocus: false
|
|
81
|
+
});
|
|
82
|
+
};
|
|
75
83
|
renderTrigger() {
|
|
76
|
-
const
|
|
77
|
-
children
|
|
78
|
-
as
|
|
79
|
-
|
|
84
|
+
const {
|
|
85
|
+
children,
|
|
86
|
+
as
|
|
87
|
+
} = this.props;
|
|
88
|
+
const {
|
|
89
|
+
hasFocus
|
|
90
|
+
} = this.state;
|
|
80
91
|
const triggerProps = {
|
|
81
92
|
'aria-describedby': this._id
|
|
82
93
|
};
|
|
@@ -101,23 +112,24 @@ let Tooltip = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, ge
|
|
|
101
112
|
}
|
|
102
113
|
}
|
|
103
114
|
render() {
|
|
104
|
-
const
|
|
105
|
-
renderTip
|
|
106
|
-
isShowingContent
|
|
107
|
-
defaultIsShowingContent
|
|
108
|
-
on
|
|
109
|
-
color
|
|
110
|
-
placement
|
|
111
|
-
mountNode
|
|
112
|
-
constrain
|
|
113
|
-
offsetX
|
|
114
|
-
offsetY
|
|
115
|
-
positionTarget
|
|
116
|
-
onShowContent
|
|
117
|
-
onHideContent
|
|
118
|
-
preventTooltip
|
|
119
|
-
styles
|
|
120
|
-
rest
|
|
115
|
+
const {
|
|
116
|
+
renderTip,
|
|
117
|
+
isShowingContent,
|
|
118
|
+
defaultIsShowingContent,
|
|
119
|
+
on,
|
|
120
|
+
color,
|
|
121
|
+
placement,
|
|
122
|
+
mountNode,
|
|
123
|
+
constrain,
|
|
124
|
+
offsetX,
|
|
125
|
+
offsetY,
|
|
126
|
+
positionTarget,
|
|
127
|
+
onShowContent,
|
|
128
|
+
onHideContent,
|
|
129
|
+
preventTooltip,
|
|
130
|
+
styles,
|
|
131
|
+
...rest
|
|
132
|
+
} = this.props;
|
|
121
133
|
return _jsx(Popover, {
|
|
122
134
|
...passthroughProps(rest),
|
|
123
135
|
isShowingContent: !preventTooltip && isShowingContent,
|
|
@@ -145,20 +157,12 @@ let Tooltip = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, ge
|
|
|
145
157
|
"data-cid": "Tooltip",
|
|
146
158
|
children: !preventTooltip ? _jsx("span", {
|
|
147
159
|
id: this._id,
|
|
148
|
-
css: styles
|
|
160
|
+
css: styles?.tooltip,
|
|
149
161
|
role: "tooltip",
|
|
150
162
|
children: callRenderProp(renderTip)
|
|
151
163
|
}) : null
|
|
152
164
|
});
|
|
153
165
|
}
|
|
154
|
-
}
|
|
155
|
-
defaultIsShowingContent: false,
|
|
156
|
-
color: 'primary',
|
|
157
|
-
placement: 'top',
|
|
158
|
-
constrain: 'window',
|
|
159
|
-
offsetX: 0,
|
|
160
|
-
offsetY: 0,
|
|
161
|
-
preventTooltip: false
|
|
162
|
-
}, _Tooltip)) || _class) || _class);
|
|
166
|
+
}) || _class) || _class);
|
|
163
167
|
export default Tooltip;
|
|
164
168
|
export { Tooltip };
|
package/es/Tooltip/v1/theme.js
CHANGED
|
@@ -28,13 +28,15 @@
|
|
|
28
28
|
* @return {Object} The final theme object with the overrides and component variables
|
|
29
29
|
*/
|
|
30
30
|
const generateComponentTheme = theme => {
|
|
31
|
-
const
|
|
32
|
-
|
|
31
|
+
const {
|
|
32
|
+
typography,
|
|
33
|
+
spacing
|
|
34
|
+
} = theme;
|
|
33
35
|
const componentVariables = {
|
|
34
|
-
fontFamily: typography
|
|
35
|
-
fontWeight: typography
|
|
36
|
-
fontSize: typography
|
|
37
|
-
padding: spacing
|
|
36
|
+
fontFamily: typography?.fontFamily,
|
|
37
|
+
fontWeight: typography?.fontWeightNormal,
|
|
38
|
+
fontSize: typography?.fontSizeSmall,
|
|
39
|
+
padding: spacing?.small
|
|
38
40
|
};
|
|
39
41
|
return {
|
|
40
42
|
...componentVariables
|
package/es/Tooltip/v2/index.js
CHANGED
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
const _excluded = ["renderTip", "isShowingContent", "defaultIsShowingContent", "on", "color", "placement", "mountNode", "constrain", "offsetX", "offsetY", "positionTarget", "onShowContent", "onHideContent", "preventTooltip", "styles"];
|
|
3
|
-
var _dec, _dec2, _class, _Tooltip;
|
|
1
|
+
var _dec, _dec2, _class;
|
|
4
2
|
/*
|
|
5
3
|
* The MIT License (MIT)
|
|
6
4
|
*
|
|
@@ -37,45 +35,58 @@ category: components
|
|
|
37
35
|
---
|
|
38
36
|
**/
|
|
39
37
|
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
40
|
-
let Tooltip = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle), _dec(_class = _dec2(_class =
|
|
38
|
+
let Tooltip = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle), _dec(_class = _dec2(_class = class Tooltip extends Component {
|
|
39
|
+
static displayName = "Tooltip";
|
|
40
|
+
static componentId = 'Tooltip';
|
|
41
|
+
static allowedProps = allowedProps;
|
|
42
|
+
static defaultProps = {
|
|
43
|
+
defaultIsShowingContent: false,
|
|
44
|
+
color: 'primary',
|
|
45
|
+
placement: 'top',
|
|
46
|
+
constrain: 'window',
|
|
47
|
+
offsetX: 0,
|
|
48
|
+
offsetY: 0,
|
|
49
|
+
preventTooltip: false
|
|
50
|
+
};
|
|
51
|
+
_id;
|
|
52
|
+
ref = null;
|
|
53
|
+
handleRef = el => {
|
|
54
|
+
this.ref = el;
|
|
55
|
+
if (typeof this.props.elementRef === 'function') {
|
|
56
|
+
this.props.elementRef(el);
|
|
57
|
+
}
|
|
58
|
+
};
|
|
41
59
|
constructor(props) {
|
|
42
60
|
super(props);
|
|
43
|
-
this._id = void 0;
|
|
44
|
-
this.ref = null;
|
|
45
|
-
this.handleRef = el => {
|
|
46
|
-
this.ref = el;
|
|
47
|
-
if (typeof this.props.elementRef === 'function') {
|
|
48
|
-
this.props.elementRef(el);
|
|
49
|
-
}
|
|
50
|
-
};
|
|
51
|
-
this.handleFocus = () => {
|
|
52
|
-
this.setState({
|
|
53
|
-
hasFocus: true
|
|
54
|
-
});
|
|
55
|
-
};
|
|
56
|
-
this.handleBlur = () => {
|
|
57
|
-
this.setState({
|
|
58
|
-
hasFocus: false
|
|
59
|
-
});
|
|
60
|
-
};
|
|
61
61
|
this._id = props.deterministicId();
|
|
62
62
|
this.state = {
|
|
63
63
|
hasFocus: false
|
|
64
64
|
};
|
|
65
65
|
}
|
|
66
66
|
componentDidMount() {
|
|
67
|
-
|
|
68
|
-
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
|
|
67
|
+
this.props.makeStyles?.();
|
|
69
68
|
}
|
|
70
69
|
componentDidUpdate() {
|
|
71
|
-
|
|
72
|
-
(_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
|
|
70
|
+
this.props.makeStyles?.();
|
|
73
71
|
}
|
|
72
|
+
handleFocus = () => {
|
|
73
|
+
this.setState({
|
|
74
|
+
hasFocus: true
|
|
75
|
+
});
|
|
76
|
+
};
|
|
77
|
+
handleBlur = () => {
|
|
78
|
+
this.setState({
|
|
79
|
+
hasFocus: false
|
|
80
|
+
});
|
|
81
|
+
};
|
|
74
82
|
renderTrigger() {
|
|
75
|
-
const
|
|
76
|
-
children
|
|
77
|
-
as
|
|
78
|
-
|
|
83
|
+
const {
|
|
84
|
+
children,
|
|
85
|
+
as
|
|
86
|
+
} = this.props;
|
|
87
|
+
const {
|
|
88
|
+
hasFocus
|
|
89
|
+
} = this.state;
|
|
79
90
|
const triggerProps = {
|
|
80
91
|
'aria-describedby': this._id
|
|
81
92
|
};
|
|
@@ -100,23 +111,24 @@ let Tooltip = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle), _
|
|
|
100
111
|
}
|
|
101
112
|
}
|
|
102
113
|
render() {
|
|
103
|
-
const
|
|
104
|
-
renderTip
|
|
105
|
-
isShowingContent
|
|
106
|
-
defaultIsShowingContent
|
|
107
|
-
on
|
|
108
|
-
color
|
|
109
|
-
placement
|
|
110
|
-
mountNode
|
|
111
|
-
constrain
|
|
112
|
-
offsetX
|
|
113
|
-
offsetY
|
|
114
|
-
positionTarget
|
|
115
|
-
onShowContent
|
|
116
|
-
onHideContent
|
|
117
|
-
preventTooltip
|
|
118
|
-
styles
|
|
119
|
-
rest
|
|
114
|
+
const {
|
|
115
|
+
renderTip,
|
|
116
|
+
isShowingContent,
|
|
117
|
+
defaultIsShowingContent,
|
|
118
|
+
on,
|
|
119
|
+
color,
|
|
120
|
+
placement,
|
|
121
|
+
mountNode,
|
|
122
|
+
constrain,
|
|
123
|
+
offsetX,
|
|
124
|
+
offsetY,
|
|
125
|
+
positionTarget,
|
|
126
|
+
onShowContent,
|
|
127
|
+
onHideContent,
|
|
128
|
+
preventTooltip,
|
|
129
|
+
styles,
|
|
130
|
+
...rest
|
|
131
|
+
} = this.props;
|
|
120
132
|
return _jsx(Popover, {
|
|
121
133
|
...passthroughProps(rest),
|
|
122
134
|
isShowingContent: !preventTooltip && isShowingContent,
|
|
@@ -144,20 +156,12 @@ let Tooltip = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle), _
|
|
|
144
156
|
"data-cid": "Tooltip",
|
|
145
157
|
children: !preventTooltip ? _jsx("span", {
|
|
146
158
|
id: this._id,
|
|
147
|
-
css: styles
|
|
159
|
+
css: styles?.tooltip,
|
|
148
160
|
role: "tooltip",
|
|
149
161
|
children: callRenderProp(renderTip)
|
|
150
162
|
}) : null
|
|
151
163
|
});
|
|
152
164
|
}
|
|
153
|
-
}
|
|
154
|
-
defaultIsShowingContent: false,
|
|
155
|
-
color: 'primary',
|
|
156
|
-
placement: 'top',
|
|
157
|
-
constrain: 'window',
|
|
158
|
-
offsetX: 0,
|
|
159
|
-
offsetY: 0,
|
|
160
|
-
preventTooltip: false
|
|
161
|
-
}, _Tooltip)) || _class) || _class);
|
|
165
|
+
}) || _class) || _class);
|
|
162
166
|
export default Tooltip;
|
|
163
167
|
export { Tooltip };
|
package/lib/Tooltip/v1/index.js
CHANGED
|
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.default = exports.Tooltip = void 0;
|
|
8
|
-
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
9
8
|
var _react = require("react");
|
|
10
9
|
var _getElementType = require("@instructure/ui-react-utils/lib/getElementType.js");
|
|
11
10
|
var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
|
|
@@ -19,8 +18,7 @@ var _styles = _interopRequireDefault(require("./styles"));
|
|
|
19
18
|
var _theme = _interopRequireDefault(require("./theme"));
|
|
20
19
|
var _props = require("./props");
|
|
21
20
|
var _jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
22
|
-
|
|
23
|
-
var _dec, _dec2, _class, _Tooltip;
|
|
21
|
+
var _dec, _dec2, _class;
|
|
24
22
|
/*
|
|
25
23
|
* The MIT License (MIT)
|
|
26
24
|
*
|
|
@@ -49,45 +47,58 @@ var _dec, _dec2, _class, _Tooltip;
|
|
|
49
47
|
category: components
|
|
50
48
|
---
|
|
51
49
|
**/
|
|
52
|
-
let Tooltip = exports.Tooltip = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyleLegacy)(_styles.default, _theme.default), _dec(_class = _dec2(_class =
|
|
50
|
+
let Tooltip = exports.Tooltip = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyleLegacy)(_styles.default, _theme.default), _dec(_class = _dec2(_class = class Tooltip extends _react.Component {
|
|
51
|
+
static displayName = "Tooltip";
|
|
52
|
+
static componentId = 'Tooltip';
|
|
53
|
+
static allowedProps = _props.allowedProps;
|
|
54
|
+
static defaultProps = {
|
|
55
|
+
defaultIsShowingContent: false,
|
|
56
|
+
color: 'primary',
|
|
57
|
+
placement: 'top',
|
|
58
|
+
constrain: 'window',
|
|
59
|
+
offsetX: 0,
|
|
60
|
+
offsetY: 0,
|
|
61
|
+
preventTooltip: false
|
|
62
|
+
};
|
|
63
|
+
_id;
|
|
64
|
+
ref = null;
|
|
65
|
+
handleRef = el => {
|
|
66
|
+
this.ref = el;
|
|
67
|
+
if (typeof this.props.elementRef === 'function') {
|
|
68
|
+
this.props.elementRef(el);
|
|
69
|
+
}
|
|
70
|
+
};
|
|
53
71
|
constructor(props) {
|
|
54
72
|
super(props);
|
|
55
|
-
this._id = void 0;
|
|
56
|
-
this.ref = null;
|
|
57
|
-
this.handleRef = el => {
|
|
58
|
-
this.ref = el;
|
|
59
|
-
if (typeof this.props.elementRef === 'function') {
|
|
60
|
-
this.props.elementRef(el);
|
|
61
|
-
}
|
|
62
|
-
};
|
|
63
|
-
this.handleFocus = () => {
|
|
64
|
-
this.setState({
|
|
65
|
-
hasFocus: true
|
|
66
|
-
});
|
|
67
|
-
};
|
|
68
|
-
this.handleBlur = () => {
|
|
69
|
-
this.setState({
|
|
70
|
-
hasFocus: false
|
|
71
|
-
});
|
|
72
|
-
};
|
|
73
73
|
this._id = props.deterministicId();
|
|
74
74
|
this.state = {
|
|
75
75
|
hasFocus: false
|
|
76
76
|
};
|
|
77
77
|
}
|
|
78
78
|
componentDidMount() {
|
|
79
|
-
|
|
80
|
-
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
|
|
79
|
+
this.props.makeStyles?.();
|
|
81
80
|
}
|
|
82
81
|
componentDidUpdate() {
|
|
83
|
-
|
|
84
|
-
(_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
|
|
82
|
+
this.props.makeStyles?.();
|
|
85
83
|
}
|
|
84
|
+
handleFocus = () => {
|
|
85
|
+
this.setState({
|
|
86
|
+
hasFocus: true
|
|
87
|
+
});
|
|
88
|
+
};
|
|
89
|
+
handleBlur = () => {
|
|
90
|
+
this.setState({
|
|
91
|
+
hasFocus: false
|
|
92
|
+
});
|
|
93
|
+
};
|
|
86
94
|
renderTrigger() {
|
|
87
|
-
const
|
|
88
|
-
children
|
|
89
|
-
as
|
|
90
|
-
|
|
95
|
+
const {
|
|
96
|
+
children,
|
|
97
|
+
as
|
|
98
|
+
} = this.props;
|
|
99
|
+
const {
|
|
100
|
+
hasFocus
|
|
101
|
+
} = this.state;
|
|
91
102
|
const triggerProps = {
|
|
92
103
|
'aria-describedby': this._id
|
|
93
104
|
};
|
|
@@ -112,23 +123,24 @@ let Tooltip = exports.Tooltip = (_dec = (0, _withDeterministicId.withDeterminist
|
|
|
112
123
|
}
|
|
113
124
|
}
|
|
114
125
|
render() {
|
|
115
|
-
const
|
|
116
|
-
renderTip
|
|
117
|
-
isShowingContent
|
|
118
|
-
defaultIsShowingContent
|
|
119
|
-
on
|
|
120
|
-
color
|
|
121
|
-
placement
|
|
122
|
-
mountNode
|
|
123
|
-
constrain
|
|
124
|
-
offsetX
|
|
125
|
-
offsetY
|
|
126
|
-
positionTarget
|
|
127
|
-
onShowContent
|
|
128
|
-
onHideContent
|
|
129
|
-
preventTooltip
|
|
130
|
-
styles
|
|
131
|
-
rest
|
|
126
|
+
const {
|
|
127
|
+
renderTip,
|
|
128
|
+
isShowingContent,
|
|
129
|
+
defaultIsShowingContent,
|
|
130
|
+
on,
|
|
131
|
+
color,
|
|
132
|
+
placement,
|
|
133
|
+
mountNode,
|
|
134
|
+
constrain,
|
|
135
|
+
offsetX,
|
|
136
|
+
offsetY,
|
|
137
|
+
positionTarget,
|
|
138
|
+
onShowContent,
|
|
139
|
+
onHideContent,
|
|
140
|
+
preventTooltip,
|
|
141
|
+
styles,
|
|
142
|
+
...rest
|
|
143
|
+
} = this.props;
|
|
132
144
|
return (0, _jsxRuntime.jsx)(_v11_.Popover, {
|
|
133
145
|
...(0, _passthroughProps.passthroughProps)(rest),
|
|
134
146
|
isShowingContent: !preventTooltip && isShowingContent,
|
|
@@ -156,19 +168,11 @@ let Tooltip = exports.Tooltip = (_dec = (0, _withDeterministicId.withDeterminist
|
|
|
156
168
|
"data-cid": "Tooltip",
|
|
157
169
|
children: !preventTooltip ? (0, _jsxRuntime.jsx)("span", {
|
|
158
170
|
id: this._id,
|
|
159
|
-
css: styles
|
|
171
|
+
css: styles?.tooltip,
|
|
160
172
|
role: "tooltip",
|
|
161
173
|
children: (0, _callRenderProp.callRenderProp)(renderTip)
|
|
162
174
|
}) : null
|
|
163
175
|
});
|
|
164
176
|
}
|
|
165
|
-
}
|
|
166
|
-
defaultIsShowingContent: false,
|
|
167
|
-
color: 'primary',
|
|
168
|
-
placement: 'top',
|
|
169
|
-
constrain: 'window',
|
|
170
|
-
offsetX: 0,
|
|
171
|
-
offsetY: 0,
|
|
172
|
-
preventTooltip: false
|
|
173
|
-
}, _Tooltip)) || _class) || _class);
|
|
177
|
+
}) || _class) || _class);
|
|
174
178
|
var _default = exports.default = Tooltip;
|
package/lib/Tooltip/v1/theme.js
CHANGED
|
@@ -34,13 +34,15 @@ exports.default = void 0;
|
|
|
34
34
|
* @return {Object} The final theme object with the overrides and component variables
|
|
35
35
|
*/
|
|
36
36
|
const generateComponentTheme = theme => {
|
|
37
|
-
const
|
|
38
|
-
|
|
37
|
+
const {
|
|
38
|
+
typography,
|
|
39
|
+
spacing
|
|
40
|
+
} = theme;
|
|
39
41
|
const componentVariables = {
|
|
40
|
-
fontFamily: typography
|
|
41
|
-
fontWeight: typography
|
|
42
|
-
fontSize: typography
|
|
43
|
-
padding: spacing
|
|
42
|
+
fontFamily: typography?.fontFamily,
|
|
43
|
+
fontWeight: typography?.fontWeightNormal,
|
|
44
|
+
fontSize: typography?.fontSizeSmall,
|
|
45
|
+
padding: spacing?.small
|
|
44
46
|
};
|
|
45
47
|
return {
|
|
46
48
|
...componentVariables
|