@instructure/ui-tooltip 11.7.3-snapshot-25 → 11.7.3-snapshot-27

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
@@ -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-25](https://github.com/instructure/instructure-ui/compare/v11.7.2...v11.7.3-snapshot-25) (2026-04-30)
6
+ ## [11.7.3-snapshot-27](https://github.com/instructure/instructure-ui/compare/v11.7.2...v11.7.3-snapshot-27) (2026-05-05)
7
7
 
8
- **Note:** Version bump only for package @instructure/ui-tooltip
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
 
@@ -1,6 +1,4 @@
1
- import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
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 = (_Tooltip = class Tooltip extends Component {
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
- var _this$props$makeStyle, _this$props;
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
- var _this$props$makeStyle2, _this$props2;
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 _ref = this.props,
77
- children = _ref.children,
78
- as = _ref.as;
79
- const hasFocus = this.state.hasFocus;
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 _this$props3 = this.props,
105
- renderTip = _this$props3.renderTip,
106
- isShowingContent = _this$props3.isShowingContent,
107
- defaultIsShowingContent = _this$props3.defaultIsShowingContent,
108
- on = _this$props3.on,
109
- color = _this$props3.color,
110
- placement = _this$props3.placement,
111
- mountNode = _this$props3.mountNode,
112
- constrain = _this$props3.constrain,
113
- offsetX = _this$props3.offsetX,
114
- offsetY = _this$props3.offsetY,
115
- positionTarget = _this$props3.positionTarget,
116
- onShowContent = _this$props3.onShowContent,
117
- onHideContent = _this$props3.onHideContent,
118
- preventTooltip = _this$props3.preventTooltip,
119
- styles = _this$props3.styles,
120
- rest = _objectWithoutProperties(_this$props3, _excluded);
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 === null || styles === void 0 ? void 0 : styles.tooltip,
160
+ css: styles?.tooltip,
149
161
  role: "tooltip",
150
162
  children: callRenderProp(renderTip)
151
163
  }) : null
152
164
  });
153
165
  }
154
- }, _Tooltip.displayName = "Tooltip", _Tooltip.componentId = 'Tooltip', _Tooltip.allowedProps = allowedProps, _Tooltip.defaultProps = {
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 };
@@ -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 typography = theme.typography,
32
- spacing = theme.spacing;
31
+ const {
32
+ typography,
33
+ spacing
34
+ } = theme;
33
35
  const componentVariables = {
34
- fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
35
- fontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
36
- fontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
37
- padding: spacing === null || spacing === void 0 ? void 0 : spacing.small
36
+ fontFamily: typography?.fontFamily,
37
+ fontWeight: typography?.fontWeightNormal,
38
+ fontSize: typography?.fontSizeSmall,
39
+ padding: spacing?.small
38
40
  };
39
41
  return {
40
42
  ...componentVariables
@@ -1,6 +1,4 @@
1
- import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
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 = (_Tooltip = class Tooltip extends Component {
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
- var _this$props$makeStyle, _this$props;
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
- var _this$props$makeStyle2, _this$props2;
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 _ref = this.props,
76
- children = _ref.children,
77
- as = _ref.as;
78
- const hasFocus = this.state.hasFocus;
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 _this$props3 = this.props,
104
- renderTip = _this$props3.renderTip,
105
- isShowingContent = _this$props3.isShowingContent,
106
- defaultIsShowingContent = _this$props3.defaultIsShowingContent,
107
- on = _this$props3.on,
108
- color = _this$props3.color,
109
- placement = _this$props3.placement,
110
- mountNode = _this$props3.mountNode,
111
- constrain = _this$props3.constrain,
112
- offsetX = _this$props3.offsetX,
113
- offsetY = _this$props3.offsetY,
114
- positionTarget = _this$props3.positionTarget,
115
- onShowContent = _this$props3.onShowContent,
116
- onHideContent = _this$props3.onHideContent,
117
- preventTooltip = _this$props3.preventTooltip,
118
- styles = _this$props3.styles,
119
- rest = _objectWithoutProperties(_this$props3, _excluded);
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 === null || styles === void 0 ? void 0 : styles.tooltip,
159
+ css: styles?.tooltip,
148
160
  role: "tooltip",
149
161
  children: callRenderProp(renderTip)
150
162
  }) : null
151
163
  });
152
164
  }
153
- }, _Tooltip.displayName = "Tooltip", _Tooltip.componentId = 'Tooltip', _Tooltip.allowedProps = allowedProps, _Tooltip.defaultProps = {
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 };
@@ -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
- const _excluded = ["renderTip", "isShowingContent", "defaultIsShowingContent", "on", "color", "placement", "mountNode", "constrain", "offsetX", "offsetY", "positionTarget", "onShowContent", "onHideContent", "preventTooltip", "styles"];
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 = (_Tooltip = class Tooltip extends _react.Component {
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
- var _this$props$makeStyle, _this$props;
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
- var _this$props$makeStyle2, _this$props2;
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 _ref = this.props,
88
- children = _ref.children,
89
- as = _ref.as;
90
- const hasFocus = this.state.hasFocus;
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 _this$props3 = this.props,
116
- renderTip = _this$props3.renderTip,
117
- isShowingContent = _this$props3.isShowingContent,
118
- defaultIsShowingContent = _this$props3.defaultIsShowingContent,
119
- on = _this$props3.on,
120
- color = _this$props3.color,
121
- placement = _this$props3.placement,
122
- mountNode = _this$props3.mountNode,
123
- constrain = _this$props3.constrain,
124
- offsetX = _this$props3.offsetX,
125
- offsetY = _this$props3.offsetY,
126
- positionTarget = _this$props3.positionTarget,
127
- onShowContent = _this$props3.onShowContent,
128
- onHideContent = _this$props3.onHideContent,
129
- preventTooltip = _this$props3.preventTooltip,
130
- styles = _this$props3.styles,
131
- rest = (0, _objectWithoutProperties2.default)(_this$props3, _excluded);
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 === null || styles === void 0 ? void 0 : styles.tooltip,
171
+ css: styles?.tooltip,
160
172
  role: "tooltip",
161
173
  children: (0, _callRenderProp.callRenderProp)(renderTip)
162
174
  }) : null
163
175
  });
164
176
  }
165
- }, _Tooltip.displayName = "Tooltip", _Tooltip.componentId = 'Tooltip', _Tooltip.allowedProps = _props.allowedProps, _Tooltip.defaultProps = {
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;
@@ -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 typography = theme.typography,
38
- spacing = theme.spacing;
37
+ const {
38
+ typography,
39
+ spacing
40
+ } = theme;
39
41
  const componentVariables = {
40
- fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
41
- fontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
42
- fontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
43
- padding: spacing === null || spacing === void 0 ? void 0 : spacing.small
42
+ fontFamily: typography?.fontFamily,
43
+ fontWeight: typography?.fontWeightNormal,
44
+ fontSize: typography?.fontSizeSmall,
45
+ padding: spacing?.small
44
46
  };
45
47
  return {
46
48
  ...componentVariables