@splunk/react-ui 4.21.0 → 4.22.0

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 (92) hide show
  1. package/Accordion.js +425 -325
  2. package/Anchor.js +147 -117
  3. package/Animation.js +142 -94
  4. package/AnimationToggle.js +197 -193
  5. package/Box.js +145 -118
  6. package/Breadcrumbs.js +288 -206
  7. package/Button.js +488 -465
  8. package/ButtonGroup.js +160 -128
  9. package/ButtonSimple.js +543 -462
  10. package/CHANGELOG.md +24 -3
  11. package/Calendar.js +1111 -1001
  12. package/Card.js +771 -598
  13. package/CardLayout.js +205 -147
  14. package/Chip.js +509 -488
  15. package/Clickable.js +414 -352
  16. package/CloseButton.js +165 -142
  17. package/Code.js +1807 -2084
  18. package/CollapsiblePanel.js +586 -519
  19. package/Color.js +1068 -1068
  20. package/ColumnLayout.js +402 -363
  21. package/ComboBox.js +903 -794
  22. package/Concertina.js +997 -802
  23. package/ControlGroup.js +687 -594
  24. package/Date.js +567 -547
  25. package/DefinitionList.js +308 -234
  26. package/Divider.js +149 -118
  27. package/Dropdown.js +459 -416
  28. package/DualListbox.js +1479 -1541
  29. package/EventListener.js +94 -97
  30. package/File.js +1051 -969
  31. package/FormRows.js +883 -696
  32. package/Heading.js +216 -193
  33. package/Image.js +446 -402
  34. package/JSONTree.js +690 -551
  35. package/Layer.js +437 -410
  36. package/Link.js +336 -255
  37. package/List.js +213 -161
  38. package/Markdown.js +509 -487
  39. package/Menu.js +1104 -1056
  40. package/Message.js +475 -441
  41. package/MessageBar.js +387 -373
  42. package/Modal.js +810 -634
  43. package/ModalLayer.js +326 -243
  44. package/Monogram.js +308 -276
  45. package/Multiselect.js +3564 -3364
  46. package/Number.js +729 -687
  47. package/Paginator.js +510 -449
  48. package/Paragraph.js +145 -112
  49. package/Popover.js +1459 -1432
  50. package/Progress.js +301 -246
  51. package/RadioBar.js +634 -527
  52. package/RadioList.js +483 -444
  53. package/Resize.js +530 -489
  54. package/ResultsMenu.js +479 -455
  55. package/ScreenReaderContent.js +142 -111
  56. package/Scroll.js +595 -456
  57. package/ScrollContainerContext.js +197 -206
  58. package/Search.js +756 -650
  59. package/Select.js +2446 -2345
  60. package/SidePanel.js +390 -284
  61. package/Slider.js +680 -676
  62. package/SlidingPanels.js +639 -503
  63. package/SplitButton.js +464 -367
  64. package/StaticContent.js +161 -133
  65. package/StepBar.js +386 -358
  66. package/Switch.js +710 -640
  67. package/TabBar.js +741 -680
  68. package/TabLayout.js +406 -322
  69. package/Table.js +4974 -4616
  70. package/Text.js +1170 -1138
  71. package/TextArea.js +1102 -1090
  72. package/Tooltip.js +624 -581
  73. package/TransitionOpen.js +489 -422
  74. package/Typography.js +176 -153
  75. package/WaitSpinner.js +230 -206
  76. package/package.json +7 -7
  77. package/types/src/Color/Color.d.ts +0 -1
  78. package/types/src/JSONTree/JSONTreeContext.d.ts +7 -0
  79. package/types/src/JSONTree/TreeNode.d.ts +5 -0
  80. package/types/src/RadioBar/RadioBar.d.ts +1 -0
  81. package/types/src/ResultsMenu/ResultsMenu.d.ts +0 -2
  82. package/types/src/Select/docs/examples/Icons.d.ts +1 -9
  83. package/types/src/Slider/Slider.d.ts +1 -0
  84. package/types/src/TabBar/Tab.d.ts +10 -1
  85. package/types/src/TabBar/TabBar.d.ts +4 -2
  86. package/types/src/Table/Head.d.ts +7 -3
  87. package/types/src/Table/Table.d.ts +3 -2
  88. package/types/src/Table/TableContext.d.ts +2 -0
  89. package/useForceUpdate.js +112 -82
  90. package/useKeyPress.js +74 -71
  91. package/usePrevious.js +65 -65
  92. package/useRovingFocus.js +122 -138
package/Tooltip.js CHANGED
@@ -1,594 +1,637 @@
1
- /******/ (() => { // webpackBootstrap
2
- /******/ "use strict";
3
- /******/ // The require scope
4
- /******/ var __webpack_require__ = {};
5
- /******/
6
- /************************************************************************/
7
- /******/ /* webpack/runtime/compat get default export */
8
- /******/ (() => {
9
- /******/ // getDefaultExport function for compatibility with non-harmony modules
10
- /******/ __webpack_require__.n = (module) => {
11
- /******/ var getter = module && module.__esModule ?
12
- /******/ () => (module['default']) :
13
- /******/ () => (module);
14
- /******/ __webpack_require__.d(getter, { a: getter });
15
- /******/ return getter;
16
- /******/ };
17
- /******/ })();
18
- /******/
19
- /******/ /* webpack/runtime/define property getters */
20
- /******/ (() => {
21
- /******/ // define getter functions for harmony exports
22
- /******/ __webpack_require__.d = (exports, definition) => {
23
- /******/ for(var key in definition) {
24
- /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
25
- /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
26
- /******/ }
27
- /******/ }
28
- /******/ };
29
- /******/ })();
30
- /******/
31
- /******/ /* webpack/runtime/hasOwnProperty shorthand */
32
- /******/ (() => {
33
- /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
34
- /******/ })();
35
- /******/
36
- /******/ /* webpack/runtime/make namespace object */
37
- /******/ (() => {
38
- /******/ // define __esModule on exports
39
- /******/ __webpack_require__.r = (exports) => {
40
- /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
41
- /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
42
- /******/ }
43
- /******/ Object.defineProperty(exports, '__esModule', { value: true });
44
- /******/ };
45
- /******/ })();
46
- /******/
47
- /************************************************************************/
48
- var __webpack_exports__ = {};
49
- // ESM COMPAT FLAG
50
- __webpack_require__.r(__webpack_exports__);
51
-
52
- // EXPORTS
53
- __webpack_require__.d(__webpack_exports__, {
54
- "default": () => (/* reexport */ Tooltip_Tooltip)
55
- });
56
-
57
- ;// CONCATENATED MODULE: external "react"
58
- const external_react_namespaceObject = require("react");
59
- var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
60
- ;// CONCATENATED MODULE: external "prop-types"
61
- const external_prop_types_namespaceObject = require("prop-types");
62
- var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_namespaceObject);
63
- ;// CONCATENATED MODULE: external "lodash/has"
64
- const has_namespaceObject = require("lodash/has");
65
- var has_default = /*#__PURE__*/__webpack_require__.n(has_namespaceObject);
66
- ;// CONCATENATED MODULE: external "lodash/throttle"
67
- const throttle_namespaceObject = require("lodash/throttle");
68
- var throttle_default = /*#__PURE__*/__webpack_require__.n(throttle_namespaceObject);
69
- ;// CONCATENATED MODULE: external "@splunk/react-ui/Popover"
70
- const Popover_namespaceObject = require("@splunk/react-ui/Popover");
71
- var Popover_default = /*#__PURE__*/__webpack_require__.n(Popover_namespaceObject);
72
- ;// CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
73
- const ScreenReaderContent_namespaceObject = require("@splunk/react-ui/ScreenReaderContent");
74
- var ScreenReaderContent_default = /*#__PURE__*/__webpack_require__.n(ScreenReaderContent_namespaceObject);
75
- ;// CONCATENATED MODULE: external "@splunk/themes"
76
- const themes_namespaceObject = require("@splunk/themes");
77
- ;// CONCATENATED MODULE: external "@splunk/ui-utils/id"
78
- const id_namespaceObject = require("@splunk/ui-utils/id");
79
- ;// CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
80
- const i18n_namespaceObject = require("@splunk/ui-utils/i18n");
81
- ;// CONCATENATED MODULE: external "@splunk/react-icons/SVGEnterprise"
82
- const SVGEnterprise_namespaceObject = require("@splunk/react-icons/SVGEnterprise");
83
- var SVGEnterprise_default = /*#__PURE__*/__webpack_require__.n(SVGEnterprise_namespaceObject);
84
- ;// CONCATENATED MODULE: ./src/Tooltip/InfoIcon.tsx
85
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
86
-
87
-
88
-
89
-
90
-
91
-
92
- function InfoCircle(props) {
93
- var _useSplunkTheme = (0,themes_namespaceObject.useSplunkTheme)(),
94
- family = _useSplunkTheme.family,
95
- density = _useSplunkTheme.density;
96
-
97
- if (family === 'enterprise') {
98
- return /*#__PURE__*/external_react_default().createElement((SVGEnterprise_default()), _extends({
99
- screenReaderText: (0,i18n_namespaceObject._)('Info Circle'),
100
- viewBox: "0 0 24 24"
101
- }, props), /*#__PURE__*/external_react_default().createElement("path", {
102
- fill: "currentColor",
103
- d: "M12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22ZM13.2001 8.1999C13.2001 7.53716 12.6628 6.9999 12.0001 6.9999C11.3373 6.9999 10.8001 7.53716 10.8001 8.1999C10.8001 8.86264 11.3373 9.3999 12.0001 9.3999C12.6628 9.3999 13.2001 8.86264 13.2001 8.1999ZM11.0001 16.0094V11.9999C11.0001 11.4476 11.4478 10.9999 12.0001 10.9999C12.5524 10.9999 13.0001 11.4476 13.0001 11.9999V16.0094C13.0001 16.5617 12.5524 17.0094 12.0001 17.0094C11.4478 17.0094 11.0001 16.5617 11.0001 16.0094Z"
1
+ /******/ (() => {
2
+ // webpackBootstrap
3
+ /******/ "use strict";
4
+ /******/ // The require scope
5
+ /******/ var e = {};
6
+ /******/
7
+ /************************************************************************/
8
+ /******/ /* webpack/runtime/compat get default export */
9
+ /******/ (() => {
10
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
11
+ /******/ e.n = t => {
12
+ /******/ var n = t && t.__esModule ?
13
+ /******/ () => t["default"]
14
+ /******/ : () => t
15
+ /******/;
16
+ e.d(n, {
17
+ a: n
18
+ });
19
+ /******/ return n;
20
+ /******/ };
21
+ /******/ })();
22
+ /******/
23
+ /******/ /* webpack/runtime/define property getters */
24
+ /******/ (() => {
25
+ /******/ // define getter functions for harmony exports
26
+ /******/ e.d = (t, n) => {
27
+ /******/ for (var o in n) {
28
+ /******/ if (e.o(n, o) && !e.o(t, o)) {
29
+ /******/ Object.defineProperty(t, o, {
30
+ enumerable: true,
31
+ get: n[o]
32
+ });
33
+ /******/ }
34
+ /******/ }
35
+ /******/ };
36
+ /******/ })();
37
+ /******/
38
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
39
+ /******/ (() => {
40
+ /******/ e.o = (e, t) => Object.prototype.hasOwnProperty.call(e, t)
41
+ /******/;
42
+ })();
43
+ /******/
44
+ /******/ /* webpack/runtime/make namespace object */
45
+ /******/ (() => {
46
+ /******/ // define __esModule on exports
47
+ /******/ e.r = e => {
48
+ /******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
49
+ /******/ Object.defineProperty(e, Symbol.toStringTag, {
50
+ value: "Module"
51
+ });
52
+ /******/ }
53
+ /******/ Object.defineProperty(e, "__esModule", {
54
+ value: true
55
+ });
56
+ /******/ };
57
+ /******/ })();
58
+ /******/
59
+ /************************************************************************/ var t = {};
60
+ // ESM COMPAT FLAG
61
+ e.r(t);
62
+ // EXPORTS
63
+ e.d(t, {
64
+ default: () => /* reexport */ X
65
+ });
66
+ // CONCATENATED MODULE: external "react"
67
+ const n = require("react");
68
+ var o = e.n(n);
69
+ // CONCATENATED MODULE: external "prop-types"
70
+ const r = require("prop-types");
71
+ var a = e.n(r);
72
+ // CONCATENATED MODULE: external "lodash/has"
73
+ const i = require("lodash/has");
74
+ var l = e.n(i);
75
+ // CONCATENATED MODULE: external "lodash/throttle"
76
+ const s = require("lodash/throttle");
77
+ var u = e.n(s);
78
+ // CONCATENATED MODULE: external "@splunk/react-ui/Popover"
79
+ const c = require("@splunk/react-ui/Popover");
80
+ var p = e.n(c);
81
+ // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
82
+ const d = require("@splunk/react-ui/ScreenReaderContent");
83
+ var f = e.n(d);
84
+ // CONCATENATED MODULE: external "@splunk/themes"
85
+ const v = require("@splunk/themes");
86
+ // CONCATENATED MODULE: external "@splunk/ui-utils/id"
87
+ const h = require("@splunk/ui-utils/id");
88
+ // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
89
+ const m = require("@splunk/ui-utils/i18n");
90
+ // CONCATENATED MODULE: external "@splunk/react-icons/SVGEnterprise"
91
+ const y = require("@splunk/react-icons/SVGEnterprise");
92
+ var b = e.n(y);
93
+ // CONCATENATED MODULE: ./src/Tooltip/InfoIcon.tsx
94
+ function g() {
95
+ g = Object.assign || function(e) {
96
+ for (var t = 1; t < arguments.length; t++) {
97
+ var n = arguments[t];
98
+ for (var o in n) {
99
+ if (Object.prototype.hasOwnProperty.call(n, o)) {
100
+ e[o] = n[o];
101
+ }
102
+ }
103
+ }
104
+ return e;
105
+ };
106
+ return g.apply(this, arguments);
107
+ }
108
+ function C(e) {
109
+ var t = (0, v.useSplunkTheme)(), n = t.family, r = t.density;
110
+ if (n === "enterprise") {
111
+
112
+ return o().createElement(b(), g({
113
+ screenReaderText: (0, m._)("Info Circle"),
114
+ viewBox: "0 0 24 24"
115
+ }, e), o().createElement("path", {
116
+ fill: "currentColor",
117
+ d: "M12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22ZM13.2001 8.1999C13.2001 7.53716 12.6628 6.9999 12.0001 6.9999C11.3373 6.9999 10.8001 7.53716 10.8001 8.1999C10.8001 8.86264 11.3373 9.3999 12.0001 9.3999C12.6628 9.3999 13.2001 8.86264 13.2001 8.1999ZM11.0001 16.0094V11.9999C11.0001 11.4476 11.4478 10.9999 12.0001 10.9999C12.5524 10.9999 13.0001 11.4476 13.0001 11.9999V16.0094C13.0001 16.5617 12.5524 17.0094 12.0001 17.0094C11.4478 17.0094 11.0001 16.5617 11.0001 16.0094Z"
118
+ }));
119
+ }
120
+ var a = r === "compact" ? "20" : "24";
121
+
122
+ return o().createElement("svg", {
123
+ width: a,
124
+ height: a,
125
+ viewBox: "0 0 24 24",
126
+ xmlns: "http://www.w3.org/2000/svg",
127
+ style: {
128
+ display: "block"
129
+ }
130
+ }, o().createElement("path", {
131
+ d: "M12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22ZM13.2003 8.1999C13.2003 7.53716 12.663 6.9999 12.0003 6.9999C11.3376 6.9999 10.8003 7.53716 10.8003 8.1999C10.8003 8.86264 11.3376 9.3999 12.0003 9.3999C12.663 9.3999 13.2003 8.86264 13.2003 8.1999ZM11.0005 16.0094V11.9999C11.0005 11.4476 11.4482 10.9999 12.0005 10.9999C12.5528 10.9999 13.0005 11.4476 13.0005 11.9999V16.0094C13.0005 16.5617 12.5528 17.0094 12.0005 17.0094C11.4482 17.0094 11.0005 16.5617 11.0005 16.0094Z",
132
+ fill: "currentColor",
133
+ fillRule: "evenodd"
134
+ }));
135
+ }
136
+ /* harmony default export */ const E = C;
137
+ // CONCATENATED MODULE: external "styled-components"
138
+ const O = require("styled-components");
139
+ var M = e.n(O);
140
+ // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
141
+ const S = require("@splunk/react-ui/Clickable");
142
+ var k = e.n(S);
143
+ // CONCATENATED MODULE: ./src/Tooltip/TooltipStyles.ts
144
+ var R = "16px";
145
+ var P = M().span.withConfig({
146
+ displayName: "TooltipStyles__Styled",
147
+ componentId: "sc-67fvgm-0"
148
+ })([ "", ";position:relative;" ], v.mixins.reset("block"));
149
+ var T = M().span.withConfig({
150
+ displayName: "TooltipStyles__StyledInline",
151
+ componentId: "sc-67fvgm-1"
152
+ })([ "", ";position:relative;" ], v.mixins.reset("inline-block"));
153
+ var w = M().span.withConfig({
154
+ displayName: "TooltipStyles__StyledToggle",
155
+ componentId: "sc-67fvgm-2"
156
+ })([ "display:block;" ]);
157
+ var q = M().span.withConfig({
158
+ displayName: "TooltipStyles__StyledToggleInline",
159
+ componentId: "sc-67fvgm-3"
160
+ })([ "display:inline-block;" ]);
161
+ var x = M().div.withConfig({
162
+ displayName: "TooltipStyles__StyledContent",
163
+ componentId: "sc-67fvgm-4"
164
+ })([ "padding:", ";font-size:", ";line-height:", ";user-select:none;" ], (0, v.pick)({
165
+ enterprise: v.variables.spacingHalf,
166
+ prisma: (0, v.pickVariant)("$isLabel", {
167
+ false: "12px 16px",
168
+ true: "4px 8px"
169
+ })
170
+ }), (0, v.pick)({
171
+ enterprise: v.variables.fontSizeSmall,
172
+ prisma: "inherit"
173
+ }), (0, v.pick)({
174
+ enterprise: "18px",
175
+ prisma: (0, v.pickVariant)("$isLabel", {
176
+ false: "inherit",
177
+ true: "18px"
178
+ })
104
179
  }));
105
- }
106
-
107
- var size = density === 'compact' ? '20' : '24';
108
- return /*#__PURE__*/external_react_default().createElement("svg", {
109
- width: size,
110
- height: size,
111
- viewBox: "0 0 24 24",
112
- xmlns: "http://www.w3.org/2000/svg",
113
- style: {
114
- display: 'block'
180
+ var L = M()(k()).withConfig({
181
+ displayName: "TooltipStyles__StyledButton",
182
+ componentId: "sc-67fvgm-5"
183
+ })([ "cursor:default;", " ", " &:focus{box-shadow:", ";}" ], (0, v.pick)({
184
+ enterprise: (0, O.css)([ "display:inline-block;width:", ";height:", ";border:2px solid ", ";border-radius:", ";font-size:", ";font-weight:", ";line-height:calc(", " - 2px);text-align:center;color:", ";vertical-align:baseline;&:not([disabled]){&:hover{text-decoration:none;}}" ], R, R, v.variables.linkColor, R, v.variables.fontSizeSmall, v.variables.fontWeightSemiBold, R, v.variables.linkColor),
185
+ prisma: (0, O.css)([ "color:", ";border-radius:50%;display:inline-block;vertical-align:middle;&:hover,&:focus{color:", ";background:", ";}" ], v.variables.contentColorMuted, v.variables.contentColorActive, v.variables.interactiveColorOverlayHover)
186
+ }), (0, v.pick)({
187
+ prisma: {
188
+ comfortable: (0, O.css)([ "padding:8px;" ]),
189
+ compact: (0, O.css)([ "padding:6px;" ])
190
+ }
191
+ }), v.variables.focusShadow);
192
+ // CONCATENATED MODULE: ./src/Tooltip/Tooltip.tsx
193
+ function _(e) {
194
+ "@babel/helpers - typeof";
195
+ if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
196
+ _ = function e(t) {
197
+ return typeof t;
198
+ };
199
+ } else {
200
+ _ = function e(t) {
201
+ return t && typeof Symbol === "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
202
+ };
203
+ }
204
+ return _(e);
115
205
  }
116
- }, /*#__PURE__*/external_react_default().createElement("path", {
117
- d: "M12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22ZM13.2003 8.1999C13.2003 7.53716 12.663 6.9999 12.0003 6.9999C11.3376 6.9999 10.8003 7.53716 10.8003 8.1999C10.8003 8.86264 11.3376 9.3999 12.0003 9.3999C12.663 9.3999 13.2003 8.86264 13.2003 8.1999ZM11.0005 16.0094V11.9999C11.0005 11.4476 11.4482 10.9999 12.0005 10.9999C12.5528 10.9999 13.0005 11.4476 13.0005 11.9999V16.0094C13.0005 16.5617 12.5528 17.0094 12.0005 17.0094C11.4482 17.0094 11.0005 16.5617 11.0005 16.0094Z",
118
- fill: "currentColor",
119
- fillRule: "evenodd"
120
- }));
121
- }
122
-
123
- /* harmony default export */ const InfoIcon = (InfoCircle);
124
- ;// CONCATENATED MODULE: external "styled-components"
125
- const external_styled_components_namespaceObject = require("styled-components");
126
- var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_namespaceObject);
127
- ;// CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
128
- const Clickable_namespaceObject = require("@splunk/react-ui/Clickable");
129
- var Clickable_default = /*#__PURE__*/__webpack_require__.n(Clickable_namespaceObject);
130
- ;// CONCATENATED MODULE: ./src/Tooltip/TooltipStyles.ts
131
-
132
-
133
-
134
- var size = '16px';
135
- var Styled = external_styled_components_default().span.withConfig({
136
- displayName: "TooltipStyles__Styled",
137
- componentId: "sc-67fvgm-0"
138
- })(["", ";position:relative;"], themes_namespaceObject.mixins.reset('block'));
139
- var StyledInline = external_styled_components_default().span.withConfig({
140
- displayName: "TooltipStyles__StyledInline",
141
- componentId: "sc-67fvgm-1"
142
- })(["", ";position:relative;"], themes_namespaceObject.mixins.reset('inline-block'));
143
- var StyledToggle = external_styled_components_default().span.withConfig({
144
- displayName: "TooltipStyles__StyledToggle",
145
- componentId: "sc-67fvgm-2"
146
- })(["display:block;"]);
147
- var StyledToggleInline = external_styled_components_default().span.withConfig({
148
- displayName: "TooltipStyles__StyledToggleInline",
149
- componentId: "sc-67fvgm-3"
150
- })(["display:inline-block;"]);
151
- var StyledContent = external_styled_components_default().div.withConfig({
152
- displayName: "TooltipStyles__StyledContent",
153
- componentId: "sc-67fvgm-4"
154
- })(["padding:", ";font-size:", ";line-height:", ";user-select:none;"], (0,themes_namespaceObject.pick)({
155
- enterprise: themes_namespaceObject.variables.spacingHalf,
156
- prisma: (0,themes_namespaceObject.pickVariant)('$isLabel', {
157
- "false": '12px 16px',
158
- "true": '4px 8px'
159
- })
160
- }), (0,themes_namespaceObject.pick)({
161
- enterprise: themes_namespaceObject.variables.fontSizeSmall,
162
- prisma: 'inherit'
163
- }), (0,themes_namespaceObject.pick)({
164
- enterprise: '18px',
165
- prisma: (0,themes_namespaceObject.pickVariant)('$isLabel', {
166
- "false": 'inherit',
167
- "true": '18px'
168
- })
169
- }));
170
- var StyledButton = external_styled_components_default()((Clickable_default())).withConfig({
171
- displayName: "TooltipStyles__StyledButton",
172
- componentId: "sc-67fvgm-5"
173
- })(["cursor:default;", " ", " &:focus{box-shadow:", ";}"], (0,themes_namespaceObject.pick)({
174
- enterprise: (0,external_styled_components_namespaceObject.css)(["display:inline-block;width:", ";height:", ";border:2px solid ", ";border-radius:", ";font-size:", ";font-weight:", ";line-height:calc(", " - 2px);text-align:center;color:", ";vertical-align:baseline;&:not([disabled]){&:hover{text-decoration:none;}}"], size, size, themes_namespaceObject.variables.linkColor, size, themes_namespaceObject.variables.fontSizeSmall, themes_namespaceObject.variables.fontWeightSemiBold, size, themes_namespaceObject.variables.linkColor),
175
- prisma: (0,external_styled_components_namespaceObject.css)(["color:", ";border-radius:50%;display:inline-block;vertical-align:middle;&:hover,&:focus{color:", ";background:", ";}"], themes_namespaceObject.variables.contentColorMuted, themes_namespaceObject.variables.contentColorActive, themes_namespaceObject.variables.interactiveColorOverlayHover)
176
- }), (0,themes_namespaceObject.pick)({
177
- prisma: {
178
- comfortable: (0,external_styled_components_namespaceObject.css)(["padding:8px;"]),
179
- compact: (0,external_styled_components_namespaceObject.css)(["padding:6px;"])
180
- }
181
- }), themes_namespaceObject.variables.focusShadow);
182
-
183
- ;// CONCATENATED MODULE: ./src/Tooltip/Tooltip.tsx
184
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
185
-
186
- function Tooltip_extends() { Tooltip_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return Tooltip_extends.apply(this, arguments); }
187
-
188
- function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
189
-
190
- function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
191
-
192
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
193
-
194
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
195
-
196
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
197
-
198
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
199
-
200
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
201
-
202
- function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
203
-
204
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
205
-
206
- function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
207
-
208
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
209
-
210
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
211
-
212
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
213
-
214
-
215
-
216
-
217
-
218
-
219
-
220
-
221
-
222
-
223
-
224
-
225
- var propTypes = {
226
- /** @private */
227
- appearance: (external_prop_types_default()).string,
228
- children: (external_prop_types_default()).node,
229
- closeDelay: (external_prop_types_default()).number,
230
-
231
- /** @private */
232
- closeWhen: external_prop_types_default().oneOf(['default', 'notOnClick']),
233
- content: (external_prop_types_default()).node,
234
- contentRelationship: external_prop_types_default().oneOf(['label', 'description']),
235
- defaultPlacement: external_prop_types_default().oneOf(['above', 'below', 'left', 'right', 'theme']),
236
- elementRef: external_prop_types_default().oneOfType([(external_prop_types_default()).func, (external_prop_types_default()).object]),
237
- inline: (external_prop_types_default()).bool,
238
- onRequestClose: (external_prop_types_default()).func,
239
- onRequestOpen: (external_prop_types_default()).func,
240
- open: (external_prop_types_default()).bool,
241
- openDelay: external_prop_types_default().oneOfType([external_prop_types_default().oneOf(['primary', 'secondary']), (external_prop_types_default()).number]),
242
-
243
- /** @private */
244
- splunkTheme: (external_prop_types_default()).object
245
- };
246
- var defaultProps = {
247
- appearance: 'inverted',
248
- closeDelay: 300,
249
- closeWhen: 'default',
250
- contentRelationship: 'description',
251
- defaultPlacement: 'theme',
252
- inline: true,
253
- openDelay: 'primary'
254
- };
255
-
256
- /**
257
- * The Tooltip component wraps arbitrary content to be displayed when the target element is hovered
258
- * or focused.
259
- */
260
- var Tooltip = /*#__PURE__*/function (_Component) {
261
- _inherits(Tooltip, _Component);
262
-
263
- var _super = _createSuper(Tooltip);
264
-
265
- // @docs-props-type TooltipPropsBase
266
- function Tooltip(props) {
267
- var _this;
268
-
269
- _classCallCheck(this, Tooltip);
270
-
271
- _this = _super.call(this, props);
272
-
273
- _defineProperty(_assertThisInitialized(_this), "ariaId", void 0);
274
-
275
- _defineProperty(_assertThisInitialized(_this), "controlledExternally", void 0);
276
-
277
- _defineProperty(_assertThisInitialized(_this), "popoverId", void 0);
278
-
279
- _defineProperty(_assertThisInitialized(_this), "timeout", void 0);
280
-
281
- _defineProperty(_assertThisInitialized(_this), "handleMount", function (el) {
282
- // Handle mouse events with native events due to current issues with how they
283
- // are handled by react. See https://github.com/facebook/react/issues/4251,
284
- // https://github.com/facebook/react/issues/19419, and SUI-1232.
285
- if (el) {
286
- el.addEventListener('mouseenter', _this.handleMouseEnter);
287
- el.addEventListener('mouseleave', _this.handleMouseLeave);
288
- } else if (_this.state.anchorEl) {
289
- _this.state.anchorEl.removeEventListener('mouseenter', _this.handleMouseEnter);
290
-
291
- _this.state.anchorEl.removeEventListener('mouseleave', _this.handleMouseLeave);
292
- }
293
-
294
- _this.setState({
295
- anchorEl: el
296
- });
297
- });
298
-
299
- _defineProperty(_assertThisInitialized(_this), "handlePopoverMount", function (el) {
300
- if (el) {
301
- el.addEventListener('mouseenter', _this.handleMouseEnterPopover);
302
- el.addEventListener('mouseleave', _this.handleMouseLeavePopover);
303
- } else if (_this.state.popoverEl) {
304
- _this.state.popoverEl.removeEventListener('mouseenter', _this.handleMouseEnterPopover);
305
-
306
- _this.state.popoverEl.removeEventListener('mouseleave', _this.handleMouseLeavePopover);
307
- }
308
-
309
- _this.setState({
310
- popoverEl: el
311
- });
312
- });
313
-
314
- _defineProperty(_assertThisInitialized(_this), "handlePopoverOuterMount", function (el) {
315
- _this.setState({
316
- popoverOuterEl: el
317
- });
318
- });
319
-
320
- _defineProperty(_assertThisInitialized(_this), "handleHitAreaMount", function (el) {
321
- // Handle mouse events with native events due to current issues with how they
322
- // are handled by react. See https://github.com/facebook/react/issues/4251,
323
- // https://github.com/facebook/react/issues/19419, and SUI-1232.
324
- if (el) {
325
- el.addEventListener('mouseenter', _this.handleMouseEnterHitArea);
326
- el.addEventListener('mousemove', _this.handleMouseMoveHitArea);
327
- el.addEventListener('mouseleave', _this.handleMouseLeaveHitArea);
328
- } else if (_this.state.hitAreaEl) {
329
- _this.state.hitAreaEl.removeEventListener('mouseenter', _this.handleMouseEnterHitArea);
330
-
331
- _this.state.hitAreaEl.removeEventListener('mousemove', _this.handleMouseMoveHitArea);
332
-
333
- _this.state.hitAreaEl.removeEventListener('mouseleave', _this.handleMouseLeaveHitArea);
334
- }
335
-
336
- _this.setState({
337
- hitAreaEl: el
338
- });
339
- });
340
-
341
- _defineProperty(_assertThisInitialized(_this), "handleMouseEnter", function (e) {
342
- _this.handleRequestOpen(e, {
343
- reason: 'mouseEnterToggle'
344
- });
345
- });
346
-
347
- _defineProperty(_assertThisInitialized(_this), "handleMouseEnterPopover", function (e) {
348
- _this.handleRequestOpen(e, {
349
- reason: 'mouseEnterPopover'
350
- });
351
- });
352
-
353
- _defineProperty(_assertThisInitialized(_this), "handleMouseEnterHitArea", function (e) {
354
- _this.handleRequestOpen(e, {
355
- reason: 'mouseEnterHitArea'
356
- });
357
- });
358
-
359
- _defineProperty(_assertThisInitialized(_this), "handleMouseLeave", function (e) {
360
- var reason = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'mouseLeaveToggle';
361
-
362
- if (e.relatedTarget == null || e.relatedTarget !== _this.state.popoverEl && e.relatedTarget !== _this.state.popoverOuterEl) {
363
- _this.handleRequestClose(e, {
364
- reason: reason
365
- });
366
- }
367
- });
368
-
369
- _defineProperty(_assertThisInitialized(_this), "handleMouseLeavePopover", function (e) {
370
- _this.handleMouseLeave(e, 'mouseLeavePopover');
371
- });
372
-
373
- _defineProperty(_assertThisInitialized(_this), "handleMouseLeaveHitArea", function (e) {
374
- _this.handleMouseLeave(e, 'mouseLeaveHitArea');
375
- });
376
-
377
- _defineProperty(_assertThisInitialized(_this), "handleMouseMoveHitAreaImpl", function (e) {
378
- _this.handleRequestClose(e, {
379
- reason: 'mouseStopHitArea'
380
- });
381
- });
382
-
383
- _defineProperty(_assertThisInitialized(_this), "handleMouseMoveHitArea", throttle_default()(_this.handleMouseMoveHitAreaImpl, 10));
384
-
385
- _defineProperty(_assertThisInitialized(_this), "handleClick", function (e) {
386
- if (_this.props.closeWhen !== 'notOnClick') {
387
- _this.handleRequestClose(e, {
388
- reason: 'toggleClick'
389
- });
390
- }
391
- });
392
-
393
- _defineProperty(_assertThisInitialized(_this), "handleFocus", function (e) {
394
- _this.handleRequestOpen(e, {
395
- reason: 'focusToggle'
396
- });
397
- });
398
-
399
- _defineProperty(_assertThisInitialized(_this), "handleBlur", function (e) {
400
- _this.handleRequestClose(e, {
401
- reason: 'blurToggle'
402
- });
403
- });
404
-
405
- _defineProperty(_assertThisInitialized(_this), "handlePopoverOnRequestClose", function (data) {
406
- _this.handleRequestClose(null, data);
407
- });
408
-
409
- _defineProperty(_assertThisInitialized(_this), "handleRequestClose", function (e, data) {
410
- var closeDelay = _this.props.closeDelay;
411
-
412
- if (_this.timeout !== undefined) {
413
- clearTimeout(_this.timeout);
414
- }
415
-
416
- _this.timeout = setTimeout(function () {
417
- var _this$props$onRequest, _this$props;
418
-
419
- if (!_this.isControlled()) {
420
- _this.setState({
421
- open: false
422
- });
206
+ function I() {
207
+ I = Object.assign || function(e) {
208
+ for (var t = 1; t < arguments.length; t++) {
209
+ var n = arguments[t];
210
+ for (var o in n) {
211
+ if (Object.prototype.hasOwnProperty.call(n, o)) {
212
+ e[o] = n[o];
213
+ }
214
+ }
215
+ }
216
+ return e;
217
+ };
218
+ return I.apply(this, arguments);
219
+ }
220
+ function A(e, t) {
221
+ if (e == null) return {};
222
+ var n = j(e, t);
223
+ var o, r;
224
+ if (Object.getOwnPropertySymbols) {
225
+ var a = Object.getOwnPropertySymbols(e);
226
+ for (r = 0; r < a.length; r++) {
227
+ o = a[r];
228
+ if (t.indexOf(o) >= 0) continue;
229
+ if (!Object.prototype.propertyIsEnumerable.call(e, o)) continue;
230
+ n[o] = e[o];
231
+ }
423
232
  }
424
-
425
- (_this$props$onRequest = (_this$props = _this.props).onRequestClose) === null || _this$props$onRequest === void 0 ? void 0 : _this$props$onRequest.call(_this$props, e, data);
426
- }, closeDelay);
427
- });
428
-
429
- _defineProperty(_assertThisInitialized(_this), "handleRequestOpen", function (e, data) {
430
- var openDelay = _this.props.openDelay;
431
- var normalDelay = openDelay === 'primary' ? 300 : 750;
432
- var finalDelay = typeof openDelay === 'number' ? openDelay : normalDelay;
433
-
434
- if (_this.timeout !== undefined) {
435
- clearTimeout(_this.timeout);
436
- }
437
-
438
- _this.timeout = setTimeout(function () {
439
- var wasOpen = _this.isOpen();
440
-
441
- if (!_this.isControlled()) {
442
- _this.setState({
443
- open: true
444
- });
233
+ return n;
234
+ }
235
+ function j(e, t) {
236
+ if (e == null) return {};
237
+ var n = {};
238
+ var o = Object.keys(e);
239
+ var r, a;
240
+ for (a = 0; a < o.length; a++) {
241
+ r = o[a];
242
+ if (t.indexOf(r) >= 0) continue;
243
+ n[r] = e[r];
445
244
  }
446
-
447
- if (!wasOpen) {
448
- var _this$props$onRequest2, _this$props2;
449
-
450
- (_this$props$onRequest2 = (_this$props2 = _this.props).onRequestOpen) === null || _this$props$onRequest2 === void 0 ? void 0 : _this$props$onRequest2.call(_this$props2, e, data);
245
+ return n;
246
+ }
247
+ function H(e, t) {
248
+ if (!(e instanceof t)) {
249
+ throw new TypeError("Cannot call a class as a function");
451
250
  }
452
- }, finalDelay);
453
- });
454
-
455
- _this.controlledExternally = has_default()(props, 'open');
456
- _this.popoverId = (0,id_namespaceObject.createDOMID)('popover');
457
- _this.ariaId = (0,id_namespaceObject.createDOMID)('aria-id');
458
- _this.state = {
459
- anchorEl: null,
460
- open: false,
461
- popoverEl: null,
462
- popoverOuterEl: null,
463
- hitAreaEl: null
464
- };
465
- return _this;
466
- }
467
-
468
- _createClass(Tooltip, [{
469
- key: "componentDidUpdate",
470
- value: function componentDidUpdate() {
471
- if (false) {}
472
251
  }
473
- }, {
474
- key: "componentWillUnmount",
475
- value: function componentWillUnmount() {
476
- if (this.timeout !== undefined) {
477
- clearTimeout(this.timeout);
478
- }
252
+ function D(e, t) {
253
+ for (var n = 0; n < t.length; n++) {
254
+ var o = t[n];
255
+ o.enumerable = o.enumerable || false;
256
+ o.configurable = true;
257
+ if ("value" in o) o.writable = true;
258
+ Object.defineProperty(e, o.key, o);
259
+ }
479
260
  }
480
- }, {
481
- key: "isControlled",
482
- value: function isControlled() {
483
- return this.controlledExternally;
261
+ function B(e, t, n) {
262
+ if (t) D(e.prototype, t);
263
+ if (n) D(e, n);
264
+ return e;
484
265
  }
485
- }, {
486
- key: "isOpen",
487
- value: function isOpen() {
488
- var hasContent = !!this.props.content;
489
- return !!this.state.anchorEl && this.isControlled() ? this.props.open : hasContent && this.state.open;
266
+ function V(e, t) {
267
+ if (typeof t !== "function" && t !== null) {
268
+ throw new TypeError("Super expression must either be null or a function");
269
+ }
270
+ e.prototype = Object.create(t && t.prototype, {
271
+ constructor: {
272
+ value: e,
273
+ writable: true,
274
+ configurable: true
275
+ }
276
+ });
277
+ if (t) Z(e, t);
490
278
  }
491
- }, {
492
- key: "render",
493
- value: function render() {
494
- var _this$props3 = this.props,
495
- appearance = _this$props3.appearance,
496
- children = _this$props3.children,
497
- content = _this$props3.content,
498
- defaultPlacement = _this$props3.defaultPlacement,
499
- elementRef = _this$props3.elementRef,
500
- inline = _this$props3.inline,
501
- onRequestClose = _this$props3.onRequestClose,
502
- onRequestOpen = _this$props3.onRequestOpen,
503
- splunkTheme = _this$props3.splunkTheme,
504
- contentRelationship = _this$props3.contentRelationship,
505
- otherProps = _objectWithoutProperties(_this$props3, ["appearance", "children", "content", "defaultPlacement", "elementRef", "inline", "onRequestClose", "onRequestOpen", "splunkTheme", "contentRelationship"]);
506
-
507
- var anchorEl = this.state.anchorEl;
508
- var hasContent = !!content;
509
- var openRender = this.isOpen();
510
- var StyledComp = inline ? StyledInline : Styled;
511
- var StyledToggleComp = inline ? StyledToggleInline : StyledToggle;
512
- var isPrisma = splunkTheme.isPrisma;
513
- var placement = isPrisma ? 'below' : 'above';
514
- var cloneProps;
515
-
516
- if (contentRelationship === 'label') {
517
- cloneProps = {
518
- labelledBy: this.ariaId,
519
- 'aria-labelledby': this.ariaId // not all components support the `labelledBy` prop.
520
-
279
+ function Z(e, t) {
280
+ Z = Object.setPrototypeOf || function e(t, n) {
281
+ t.__proto__ = n;
282
+ return t;
521
283
  };
522
- } else if (contentRelationship === 'description') {
523
- cloneProps = {
524
- describedBy: this.ariaId,
525
- 'aria-describedby': this.ariaId
284
+ return Z(e, t);
285
+ }
286
+ function N(e) {
287
+ var t = F();
288
+ return function n() {
289
+ var o = $(e), r;
290
+ if (t) {
291
+ var a = $(this).constructor;
292
+ r = Reflect.construct(o, arguments, a);
293
+ } else {
294
+ r = o.apply(this, arguments);
295
+ }
296
+ return W(this, r);
526
297
  };
527
- }
528
-
529
- return /*#__PURE__*/external_react_default().createElement(StyledComp, Tooltip_extends({
530
- "data-test": "tooltip",
531
- "data-test-open": openRender,
532
- "data-test-popover-id": this.popoverId,
533
- ref: elementRef
534
- }, otherProps), /*#__PURE__*/external_react_default().createElement(StyledToggleComp, {
535
- onClick: this.handleClick,
536
- onFocus: this.handleFocus,
537
- onBlur: this.handleBlur,
538
- ref: this.handleMount,
539
- "data-test": "toggle"
540
- }, hasContent && /*#__PURE__*/(0,external_react_namespaceObject.isValidElement)(children) ? /*#__PURE__*/(0,external_react_namespaceObject.cloneElement)(children, cloneProps) : children, hasContent && !children && /*#__PURE__*/external_react_default().createElement(StyledButton, {
541
- "aria-describedby": this.ariaId
542
- }, isPrisma ? /*#__PURE__*/external_react_default().createElement(InfoIcon, {
543
- hideDefaultTooltip: true,
544
- screenReaderText: (0,i18n_namespaceObject._)('More info'),
545
- style: {
546
- height: '22px',
547
- width: '22px'
298
+ }
299
+ function W(e, t) {
300
+ if (t && (_(t) === "object" || typeof t === "function")) {
301
+ return t;
548
302
  }
549
- }) : /*#__PURE__*/external_react_default().createElement((external_react_default()).Fragment, null, /*#__PURE__*/external_react_default().createElement("span", {
550
- "aria-hidden": "true"
551
- }, "?"), /*#__PURE__*/external_react_default().createElement((ScreenReaderContent_default()), null, (0,i18n_namespaceObject._)('More info')))), hasContent && /*#__PURE__*/external_react_default().createElement((ScreenReaderContent_default()), {
552
- "aria-hidden": "true",
553
- id: this.ariaId
554
- }, content)), /*#__PURE__*/external_react_default().createElement((Popover_default()), {
555
- role: "tooltip",
556
- align: "center",
557
- anchor: anchorEl // override Popver's default animation to make it faster
558
- // this keeps the overall amount of time the Tooltip is on-screen the same
559
- // even with the increased default closeDelay to address SUI-5116
560
- ,
561
- animationConfig: {
562
- tension: 400
563
- },
564
- appearance: appearance,
565
- closeReasons: ['offScreen', 'escapeKey'],
566
- defaultPlacement: defaultPlacement === 'theme' ? placement : defaultPlacement,
567
- id: this.popoverId,
568
- open: openRender,
569
- onRequestClose: this.handlePopoverOnRequestClose,
570
- elementRef: this.handlePopoverMount,
571
- hitAreaRef: this.handleHitAreaMount,
572
- outerRef: this.handlePopoverOuterMount
573
- }, /*#__PURE__*/external_react_default().createElement(StyledContent, {
574
- $isLabel: contentRelationship === 'label'
575
- }, content)));
303
+ return z(e);
576
304
  }
577
- }]);
578
-
579
- return Tooltip;
580
- }(external_react_namespaceObject.Component);
581
-
582
- _defineProperty(Tooltip, "propTypes", propTypes);
583
-
584
- _defineProperty(Tooltip, "defaultProps", defaultProps);
585
-
586
- var TooltipWithTheme = (0,themes_namespaceObject.withSplunkTheme)(Tooltip);
587
- TooltipWithTheme.propTypes = Tooltip.propTypes;
588
- /* harmony default export */ const Tooltip_Tooltip = (TooltipWithTheme);
589
- ;// CONCATENATED MODULE: ./src/Tooltip/index.ts
590
-
591
-
592
- module.exports = __webpack_exports__;
593
- /******/ })()
594
- ;
305
+ function z(e) {
306
+ if (e === void 0) {
307
+ throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
308
+ }
309
+ return e;
310
+ }
311
+ function F() {
312
+ if (typeof Reflect === "undefined" || !Reflect.construct) return false;
313
+ if (Reflect.construct.sham) return false;
314
+ if (typeof Proxy === "function") return true;
315
+ try {
316
+ Date.prototype.toString.call(Reflect.construct(Date, [], (function() {})));
317
+ return true;
318
+ } catch (e) {
319
+ return false;
320
+ }
321
+ }
322
+ function $(e) {
323
+ $ = Object.setPrototypeOf ? Object.getPrototypeOf : function e(t) {
324
+ return t.__proto__ || Object.getPrototypeOf(t);
325
+ };
326
+ return $(e);
327
+ }
328
+ function U(e, t, n) {
329
+ if (t in e) {
330
+ Object.defineProperty(e, t, {
331
+ value: n,
332
+ enumerable: true,
333
+ configurable: true,
334
+ writable: true
335
+ });
336
+ } else {
337
+ e[t] = n;
338
+ }
339
+ return e;
340
+ }
341
+ var G = {
342
+ /** @private */
343
+ appearance: a().string,
344
+ children: a().node,
345
+ closeDelay: a().number,
346
+ /** @private */
347
+ closeWhen: a().oneOf([ "default", "notOnClick" ]),
348
+ content: a().node,
349
+ contentRelationship: a().oneOf([ "label", "description" ]),
350
+ defaultPlacement: a().oneOf([ "above", "below", "left", "right", "theme" ]),
351
+ elementRef: a().oneOfType([ a().func, a().object ]),
352
+ inline: a().bool,
353
+ onRequestClose: a().func,
354
+ onRequestOpen: a().func,
355
+ open: a().bool,
356
+ openDelay: a().oneOfType([ a().oneOf([ "primary", "secondary" ]), a().number ]),
357
+ /** @private */
358
+ splunkTheme: a().object
359
+ };
360
+ var K = {
361
+ appearance: "inverted",
362
+ closeDelay: 300,
363
+ closeWhen: "default",
364
+ contentRelationship: "description",
365
+ defaultPlacement: "theme",
366
+ inline: true,
367
+ openDelay: "primary"
368
+ };
369
+ /**
370
+ * The Tooltip component wraps arbitrary content to be displayed when the target element is hovered
371
+ * or focused.
372
+ */ var J = function(e) {
373
+ V(r, e);
374
+ var t = N(r);
375
+ // @docs-props-type TooltipPropsBase
376
+ function r(e) {
377
+ var n;
378
+ H(this, r);
379
+ n = t.call(this, e);
380
+ U(z(n), "ariaId", void 0);
381
+ U(z(n), "controlledExternally", void 0);
382
+ U(z(n), "popoverId", void 0);
383
+ U(z(n), "timeout", void 0);
384
+ U(z(n), "handleMount", (function(e) {
385
+ // Handle mouse events with native events due to current issues with how they
386
+ // are handled by react. See https://github.com/facebook/react/issues/4251,
387
+ // https://github.com/facebook/react/issues/19419, and SUI-1232.
388
+ if (e) {
389
+ e.addEventListener("mouseenter", n.handleMouseEnter);
390
+ e.addEventListener("mouseleave", n.handleMouseLeave);
391
+ } else if (n.state.anchorEl) {
392
+ n.state.anchorEl.removeEventListener("mouseenter", n.handleMouseEnter);
393
+ n.state.anchorEl.removeEventListener("mouseleave", n.handleMouseLeave);
394
+ }
395
+ n.setState({
396
+ anchorEl: e
397
+ });
398
+ }));
399
+ U(z(n), "handlePopoverMount", (function(e) {
400
+ if (e) {
401
+ e.addEventListener("mouseenter", n.handleMouseEnterPopover);
402
+ e.addEventListener("mouseleave", n.handleMouseLeavePopover);
403
+ } else if (n.state.popoverEl) {
404
+ n.state.popoverEl.removeEventListener("mouseenter", n.handleMouseEnterPopover);
405
+ n.state.popoverEl.removeEventListener("mouseleave", n.handleMouseLeavePopover);
406
+ }
407
+ n.setState({
408
+ popoverEl: e
409
+ });
410
+ }));
411
+ U(z(n), "handlePopoverOuterMount", (function(e) {
412
+ n.setState({
413
+ popoverOuterEl: e
414
+ });
415
+ }));
416
+ U(z(n), "handleHitAreaMount", (function(e) {
417
+ // Handle mouse events with native events due to current issues with how they
418
+ // are handled by react. See https://github.com/facebook/react/issues/4251,
419
+ // https://github.com/facebook/react/issues/19419, and SUI-1232.
420
+ if (e) {
421
+ e.addEventListener("mouseenter", n.handleMouseEnterHitArea);
422
+ e.addEventListener("mousemove", n.handleMouseMoveHitArea);
423
+ e.addEventListener("mouseleave", n.handleMouseLeaveHitArea);
424
+ } else if (n.state.hitAreaEl) {
425
+ n.state.hitAreaEl.removeEventListener("mouseenter", n.handleMouseEnterHitArea);
426
+ n.state.hitAreaEl.removeEventListener("mousemove", n.handleMouseMoveHitArea);
427
+ n.state.hitAreaEl.removeEventListener("mouseleave", n.handleMouseLeaveHitArea);
428
+ }
429
+ n.setState({
430
+ hitAreaEl: e
431
+ });
432
+ }));
433
+ U(z(n), "handleMouseEnter", (function(e) {
434
+ n.handleRequestOpen(e, {
435
+ reason: "mouseEnterToggle"
436
+ });
437
+ }));
438
+ U(z(n), "handleMouseEnterPopover", (function(e) {
439
+ n.handleRequestOpen(e, {
440
+ reason: "mouseEnterPopover"
441
+ });
442
+ }));
443
+ U(z(n), "handleMouseEnterHitArea", (function(e) {
444
+ n.handleRequestOpen(e, {
445
+ reason: "mouseEnterHitArea"
446
+ });
447
+ }));
448
+ U(z(n), "handleMouseLeave", (function(e) {
449
+ var t = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "mouseLeaveToggle";
450
+ if (e.relatedTarget == null || e.relatedTarget !== n.state.popoverEl && e.relatedTarget !== n.state.popoverOuterEl) {
451
+ n.handleRequestClose(e, {
452
+ reason: t
453
+ });
454
+ }
455
+ }));
456
+ U(z(n), "handleMouseLeavePopover", (function(e) {
457
+ n.handleMouseLeave(e, "mouseLeavePopover");
458
+ }));
459
+ U(z(n), "handleMouseLeaveHitArea", (function(e) {
460
+ n.handleMouseLeave(e, "mouseLeaveHitArea");
461
+ }));
462
+ U(z(n), "handleMouseMoveHitAreaImpl", (function(e) {
463
+ n.handleRequestClose(e, {
464
+ reason: "mouseStopHitArea"
465
+ });
466
+ }));
467
+ U(z(n), "handleMouseMoveHitArea", u()(n.handleMouseMoveHitAreaImpl, 10));
468
+ U(z(n), "handleClick", (function(e) {
469
+ if (n.props.closeWhen !== "notOnClick") {
470
+ n.handleRequestClose(e, {
471
+ reason: "toggleClick"
472
+ });
473
+ }
474
+ }));
475
+ U(z(n), "handleFocus", (function(e) {
476
+ n.handleRequestOpen(e, {
477
+ reason: "focusToggle"
478
+ });
479
+ }));
480
+ U(z(n), "handleBlur", (function(e) {
481
+ n.handleRequestClose(e, {
482
+ reason: "blurToggle"
483
+ });
484
+ }));
485
+ U(z(n), "handlePopoverOnRequestClose", (function(e) {
486
+ n.handleRequestClose(null, e);
487
+ }));
488
+ U(z(n), "handleRequestClose", (function(e, t) {
489
+ var o = n.props.closeDelay;
490
+ if (n.timeout !== undefined) {
491
+ clearTimeout(n.timeout);
492
+ }
493
+ n.timeout = setTimeout((function() {
494
+ var o, r;
495
+ if (!n.isControlled()) {
496
+ n.setState({
497
+ open: false
498
+ });
499
+ }
500
+ (o = (r = n.props).onRequestClose) === null || o === void 0 ? void 0 : o.call(r, e, t);
501
+ }), o);
502
+ }));
503
+ U(z(n), "handleRequestOpen", (function(e, t) {
504
+ var o = n.props.openDelay;
505
+ var r = o === "primary" ? 300 : 750;
506
+ var a = typeof o === "number" ? o : r;
507
+ if (n.timeout !== undefined) {
508
+ clearTimeout(n.timeout);
509
+ }
510
+ n.timeout = setTimeout((function() {
511
+ var o = n.isOpen();
512
+ if (!n.isControlled()) {
513
+ n.setState({
514
+ open: true
515
+ });
516
+ }
517
+ if (!o) {
518
+ var r, a;
519
+ (r = (a = n.props).onRequestOpen) === null || r === void 0 ? void 0 : r.call(a, e, t);
520
+ }
521
+ }), a);
522
+ }));
523
+ n.controlledExternally = l()(e, "open");
524
+ n.popoverId = (0, h.createDOMID)("popover");
525
+ n.ariaId = (0, h.createDOMID)("aria-id");
526
+ n.state = {
527
+ anchorEl: null,
528
+ open: false,
529
+ popoverEl: null,
530
+ popoverOuterEl: null,
531
+ hitAreaEl: null
532
+ };
533
+ return n;
534
+ }
535
+ B(r, [ {
536
+ key: "componentDidUpdate",
537
+ value: function e() {
538
+ if (false) {}
539
+ }
540
+ }, {
541
+ key: "componentWillUnmount",
542
+ value: function e() {
543
+ if (this.timeout !== undefined) {
544
+ clearTimeout(this.timeout);
545
+ }
546
+ }
547
+ }, {
548
+ key: "isControlled",
549
+ value: function e() {
550
+ return this.controlledExternally;
551
+ }
552
+ }, {
553
+ key: "isOpen",
554
+ value: function e() {
555
+ var t = !!this.props.content;
556
+ return !!this.state.anchorEl && this.isControlled() ? this.props.open : t && this.state.open;
557
+ }
558
+ }, {
559
+ key: "render",
560
+ value: function e() {
561
+ var t = this.props, r = t.appearance, a = t.children, i = t.content, l = t.defaultPlacement, s = t.elementRef, u = t.inline, c = t.onRequestClose, d = t.onRequestOpen, v = t.splunkTheme, h = t.contentRelationship, y = A(t, [ "appearance", "children", "content", "defaultPlacement", "elementRef", "inline", "onRequestClose", "onRequestOpen", "splunkTheme", "contentRelationship" ]);
562
+ var b = this.state.anchorEl;
563
+ var g = !!i;
564
+ var C = this.isOpen();
565
+ var O = u ? T : P;
566
+ var M = u ? q : w;
567
+ var S = v.isPrisma;
568
+ var k = S ? "below" : "above";
569
+ var R;
570
+ if (h === "label") {
571
+ R = {
572
+ labelledBy: this.ariaId,
573
+ "aria-labelledby": this.ariaId
574
+ };
575
+ } else if (h === "description") {
576
+ R = {
577
+ describedBy: this.ariaId,
578
+ "aria-describedby": this.ariaId
579
+ };
580
+ }
581
+
582
+ return o().createElement(O, I({
583
+ "data-test": "tooltip",
584
+ "data-test-open": C,
585
+ "data-test-popover-id": this.popoverId,
586
+ ref: s
587
+ }, y), o().createElement(M, {
588
+ onClick: this.handleClick,
589
+ onFocus: this.handleFocus,
590
+ onBlur: this.handleBlur,
591
+ ref: this.handleMount,
592
+ "data-test": "toggle"
593
+ }, g && (0, n.isValidElement)(a) ? (0, n.cloneElement)(a, R) : a, g && !a && o().createElement(L, {
594
+ "aria-describedby": this.ariaId
595
+ }, S ? o().createElement(E, {
596
+ hideDefaultTooltip: true,
597
+ screenReaderText: (0, m._)("More info"),
598
+ style: {
599
+ height: "22px",
600
+ width: "22px"
601
+ }
602
+ }) : o().createElement(o().Fragment, null, o().createElement("span", {
603
+ "aria-hidden": "true"
604
+ }, "?"), o().createElement(f(), null, (0, m._)("More info")))), g && o().createElement(f(), {
605
+ "aria-hidden": "true",
606
+ id: this.ariaId
607
+ }, i)), o().createElement(p(), {
608
+ role: "tooltip",
609
+ align: "center",
610
+ anchor: b,
611
+ animationConfig: {
612
+ tension: 400
613
+ },
614
+ appearance: r,
615
+ closeReasons: [ "offScreen", "escapeKey" ],
616
+ defaultPlacement: l === "theme" ? k : l,
617
+ id: this.popoverId,
618
+ open: C,
619
+ onRequestClose: this.handlePopoverOnRequestClose,
620
+ elementRef: this.handlePopoverMount,
621
+ hitAreaRef: this.handleHitAreaMount,
622
+ outerRef: this.handlePopoverOuterMount
623
+ }, o().createElement(x, {
624
+ $isLabel: h === "label"
625
+ }, i)));
626
+ }
627
+ } ]);
628
+ return r;
629
+ }(n.Component);
630
+ U(J, "propTypes", G);
631
+ U(J, "defaultProps", K);
632
+ var Q = (0, v.withSplunkTheme)(J);
633
+ Q.propTypes = J.propTypes;
634
+ /* harmony default export */ const X = Q;
635
+ // CONCATENATED MODULE: ./src/Tooltip/index.ts
636
+ module.exports = t;
637
+ /******/})();