@splunk/react-ui 4.41.0 → 4.43.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 (91) hide show
  1. package/ButtonGroup.js +1 -3
  2. package/CHANGELOG.md +47 -0
  3. package/Code.js +611 -426
  4. package/ComboBox.js +25 -32
  5. package/Date.js +21 -26
  6. package/Dropdown.js +33 -32
  7. package/JSONTree.js +30 -24
  8. package/Layer.js +115 -97
  9. package/Link.js +19 -21
  10. package/MIGRATION.mdx +48 -53
  11. package/Menu.js +7 -2
  12. package/MessageBar.js +54 -56
  13. package/Multiselect.js +1051 -1035
  14. package/Number.js +424 -395
  15. package/Paginator.js +269 -251
  16. package/Popover.js +595 -526
  17. package/RadioList.js +44 -43
  18. package/Resize.js +61 -61
  19. package/ResultsMenu.d.ts +2 -0
  20. package/ResultsMenu.js +4 -4
  21. package/Scroll.js +482 -475
  22. package/Search.js +56 -65
  23. package/Select.js +532 -513
  24. package/TabBar.js +4 -0
  25. package/Table.js +1519 -1437
  26. package/Text.js +29 -17
  27. package/TextArea.js +37 -37
  28. package/Tooltip.js +300 -207
  29. package/TransitionOpen.js +16 -14
  30. package/Tree.js +20 -14
  31. package/package.json +7 -7
  32. package/types/src/Button/Button.d.ts +1 -0
  33. package/types/src/ButtonGroup/ButtonGroup.d.ts +0 -4
  34. package/types/src/Code/Code.d.ts +1 -1
  35. package/types/src/ComboBox/ComboBox.d.ts +6 -3
  36. package/types/src/Date/Date.d.ts +0 -1
  37. package/types/src/Dropdown/Dropdown.d.ts +2 -1
  38. package/types/src/Dropdown/docs/examples/TooltipButtonToggle.d.ts +2 -0
  39. package/types/src/Layer/Layer.d.ts +2 -1
  40. package/types/src/Link/Link.d.ts +0 -2
  41. package/types/src/Multiselect/Multiselect.d.ts +2 -0
  42. package/types/src/Number/Number.d.ts +11 -10
  43. package/types/src/Number/utils.d.ts +29 -0
  44. package/types/src/Paginator/Paginator.d.ts +15 -2
  45. package/types/src/Paginator/docs/examples/CustomPages.d.ts +2 -0
  46. package/types/src/Popover/Popover.d.ts +18 -12
  47. package/types/src/Popover/PopoverMenuContext.d.ts +6 -0
  48. package/types/src/Popover/PopoverProvider.d.ts +23 -0
  49. package/types/src/Popover/index.d.ts +2 -1
  50. package/types/src/RadioList/RadioList.d.ts +1 -1
  51. package/types/src/Resize/Resize.d.ts +0 -11
  52. package/types/src/Scroll/Inner.d.ts +17 -19
  53. package/types/src/Select/SelectBase.d.ts +7 -5
  54. package/types/src/Select/docs/examples/Appearance.d.ts +1 -11
  55. package/types/src/Select/docs/examples/Basic.d.ts +1 -9
  56. package/types/src/Select/docs/examples/Children.d.ts +1 -9
  57. package/types/src/Select/docs/examples/Descriptions.d.ts +1 -9
  58. package/types/src/Select/docs/examples/Fetching.d.ts +1 -22
  59. package/types/src/Select/docs/examples/Filter.d.ts +1 -9
  60. package/types/src/Select/docs/examples/Headings.d.ts +1 -9
  61. package/types/src/Select/docs/examples/LoadMoreOnScrollBottom.d.ts +1 -24
  62. package/types/src/Select/docs/examples/Prefix.d.ts +1 -9
  63. package/types/src/Select/docs/examples/Truncate.d.ts +1 -9
  64. package/types/src/Table/ExpandButton.d.ts +8 -0
  65. package/types/src/Table/HeadDropdownCell.d.ts +2 -0
  66. package/types/src/Table/HeadInner.d.ts +5 -1
  67. package/types/src/Table/Row.d.ts +8 -2
  68. package/types/src/Table/docs/examples/Click.d.ts +2 -16
  69. package/types/src/Table/docs/examples/ClickRows.d.ts +2 -16
  70. package/types/src/Table/docs/examples/Complex.d.ts +2 -50
  71. package/types/src/Table/docs/examples/FilterColumnValues.d.ts +1 -13
  72. package/types/src/Table/docs/examples/HeadDropdownCell.d.ts +1 -17
  73. package/types/src/Table/docs/examples/ReorderColumns.d.ts +2 -21
  74. package/types/src/Table/docs/examples/ReorderRows.d.ts +2 -21
  75. package/types/src/Table/docs/examples/Resizable.d.ts +2 -23
  76. package/types/src/Table/docs/examples/ResizableFill.d.ts +2 -23
  77. package/types/src/Table/docs/examples/RowActions.d.ts +2 -39
  78. package/types/src/Table/docs/examples/Selectable.d.ts +2 -18
  79. package/types/src/Table/docs/examples/SortableColumns.d.ts +1 -11
  80. package/types/src/Tooltip/Tooltip.d.ts +38 -5
  81. package/types/src/Tooltip/docs/examples/CustomProps.d.ts +2 -0
  82. package/types/src/Tooltip/docs/examples/Toggletip.d.ts +2 -0
  83. package/types/src/useControlled/useControlled.d.ts +5 -4
  84. package/useControlled.js +37 -15
  85. package/usePrevious.js +62 -30
  86. package/useResizeObserver.js +122 -90
  87. package/useRovingFocus.js +5 -4
  88. package/types/src/Dropdown/docs/examples/OtherToggles.d.ts +0 -2
  89. package/types/src/Popover/PopoverContext.d.ts +0 -6
  90. package/types/src/Table/icons/ExpansionRow.d.ts +0 -6
  91. package/types/src/Tooltip/docs/examples/CustomContent.d.ts +0 -2
package/Tooltip.js CHANGED
@@ -24,11 +24,11 @@
24
24
  /******/ (() => {
25
25
  /******/ // define getter functions for harmony exports
26
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, {
27
+ /******/ for (var r in n) {
28
+ /******/ if (e.o(n, r) && !e.o(t, r)) {
29
+ /******/ Object.defineProperty(t, r, {
30
30
  enumerable: true,
31
- get: n[o]
31
+ get: n[r]
32
32
  });
33
33
  /******/ }
34
34
  /******/ }
@@ -61,62 +61,84 @@
61
61
  e.r(t);
62
62
  // EXPORTS
63
63
  e.d(t, {
64
- default: () => /* reexport */ ee
64
+ default: () => /* reexport */ ae
65
65
  });
66
66
  // CONCATENATED MODULE: external "react"
67
67
  const n = require("react");
68
- var o = e.n(n);
68
+ var r = e.n(n);
69
69
  // CONCATENATED MODULE: external "prop-types"
70
- const r = require("prop-types");
71
- var a = e.n(r);
70
+ const o = require("prop-types");
71
+ var a = e.n(o);
72
72
  // CONCATENATED MODULE: external "lodash/has"
73
73
  const i = require("lodash/has");
74
74
  var l = e.n(i);
75
- // CONCATENATED MODULE: external "lodash/throttle"
76
- const s = require("lodash/throttle");
75
+ // CONCATENATED MODULE: external "lodash/omit"
76
+ const s = require("lodash/omit");
77
77
  var u = e.n(s);
78
- // CONCATENATED MODULE: external "@splunk/react-ui/Popover"
79
- const c = require("@splunk/react-ui/Popover");
78
+ // CONCATENATED MODULE: external "lodash/throttle"
79
+ const c = require("lodash/throttle");
80
80
  var p = e.n(c);
81
- // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
82
- const d = require("@splunk/react-ui/ScreenReaderContent");
81
+ // CONCATENATED MODULE: external "@splunk/react-ui/Popover"
82
+ const d = require("@splunk/react-ui/Popover");
83
83
  var f = e.n(d);
84
+ // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
85
+ const v = require("@splunk/react-ui/ScreenReaderContent");
86
+ var h = e.n(v);
84
87
  // CONCATENATED MODULE: external "@splunk/themes"
85
- const v = require("@splunk/themes");
88
+ const m = require("@splunk/themes");
86
89
  // CONCATENATED MODULE: external "@splunk/ui-utils/id"
87
- const h = require("@splunk/ui-utils/id");
90
+ const y = require("@splunk/ui-utils/id");
88
91
  // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
89
- const m = require("@splunk/ui-utils/i18n");
92
+ const b = require("@splunk/ui-utils/i18n");
93
+ // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
94
+ /**
95
+ * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
96
+ *
97
+ * @param ref - The React callback or object ref. Can be `null` or `undefined`.
98
+ * @param current - The new value of the ref.
99
+ */
100
+ function g(e, t) {
101
+ if (e) {
102
+ if (typeof e === "function") {
103
+ e(t);
104
+ } else {
105
+ // the public signature of this util uses React.Ref<T> to mirror the way React types refs.
106
+ // the intention here is to signal "we will take care of setting 'current', not you".
107
+ e.current = t;
108
+ // eslint-disable-line no-param-reassign
109
+ }
110
+ }
111
+ }
90
112
  // CONCATENATED MODULE: external "@splunk/react-icons/SVGEnterprise"
91
- const y = require("@splunk/react-icons/SVGEnterprise");
92
- var b = e.n(y);
113
+ const E = require("@splunk/react-icons/SVGEnterprise");
114
+ var O = e.n(E);
93
115
  // CONCATENATED MODULE: ./src/Tooltip/InfoIcon.tsx
94
- function g() {
95
- return g = Object.assign ? Object.assign.bind() : function(e) {
116
+ function C() {
117
+ return C = Object.assign ? Object.assign.bind() : function(e) {
96
118
  for (var t = 1; t < arguments.length; t++) {
97
119
  var n = arguments[t];
98
- for (var o in n) {
99
- ({}).hasOwnProperty.call(n, o) && (e[o] = n[o]);
120
+ for (var r in n) {
121
+ ({}).hasOwnProperty.call(n, r) && (e[r] = n[r]);
100
122
  }
101
123
  }
102
124
  return e;
103
- }, g.apply(null, arguments);
125
+ }, C.apply(null, arguments);
104
126
  }
105
- function C(e) {
106
- var t = (0, v.useSplunkTheme)(), n = t.family, r = t.density;
127
+ function M(e) {
128
+ var t = (0, m.useSplunkTheme)(), n = t.family, o = t.density;
107
129
  if (n === "enterprise") {
108
130
 
109
- return o().createElement(b(), g({
110
- screenReaderText: (0, m._)("Info Circle"),
131
+ return r().createElement(O(), C({
132
+ screenReaderText: (0, b._)("Info Circle"),
111
133
  viewBox: "0 0 24 24"
112
- }, e), o().createElement("path", {
134
+ }, e), r().createElement("path", {
113
135
  fill: "currentColor",
114
136
  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"
115
137
  }));
116
138
  }
117
- var a = r === "compact" ? "20" : "24";
139
+ var a = o === "compact" ? "20" : "24";
118
140
 
119
- return o().createElement("svg", {
141
+ return r().createElement("svg", {
120
142
  width: a,
121
143
  height: a,
122
144
  viewBox: "0 0 24 24",
@@ -124,68 +146,68 @@
124
146
  style: {
125
147
  display: "block"
126
148
  }
127
- }, o().createElement("path", {
149
+ }, r().createElement("path", {
128
150
  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",
129
151
  fill: "currentColor",
130
152
  fillRule: "evenodd"
131
153
  }));
132
154
  }
133
- /* harmony default export */ const E = C;
155
+ /* harmony default export */ const P = M;
134
156
  // CONCATENATED MODULE: external "styled-components"
135
- const O = require("styled-components");
136
- var M = e.n(O);
157
+ const w = require("styled-components");
158
+ var S = e.n(w);
137
159
  // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
138
- const S = require("@splunk/react-ui/Clickable");
139
- var k = e.n(S);
160
+ const k = require("@splunk/react-ui/Clickable");
161
+ var R = e.n(k);
140
162
  // CONCATENATED MODULE: ./src/Tooltip/TooltipStyles.ts
141
- var w = "16px";
142
- var P = M().span.withConfig({
163
+ var T = "16px";
164
+ var j = S().span.withConfig({
143
165
  displayName: "TooltipStyles__Styled",
144
166
  componentId: "sc-67fvgm-0"
145
- })([ "", ";position:relative;" ], v.mixins.reset("block"));
146
- var R = M().span.withConfig({
167
+ })([ "", ";position:relative;" ], m.mixins.reset("block"));
168
+ var q = S().span.withConfig({
147
169
  displayName: "TooltipStyles__StyledInline",
148
170
  componentId: "sc-67fvgm-1"
149
- })([ "", ";position:relative;" ], v.mixins.reset("inline-block"));
150
- var T = M().span.withConfig({
171
+ })([ "", ";position:relative;" ], m.mixins.reset("inline-block"));
172
+ var A = S().span.withConfig({
151
173
  displayName: "TooltipStyles__StyledToggle",
152
174
  componentId: "sc-67fvgm-2"
153
175
  })([ "display:block;" ]);
154
- var q = M().span.withConfig({
176
+ var L = S().span.withConfig({
155
177
  displayName: "TooltipStyles__StyledToggleInline",
156
178
  componentId: "sc-67fvgm-3"
157
179
  })([ "display:inline-block;" ]);
158
- var L = M().div.withConfig({
180
+ var I = S().div.withConfig({
159
181
  displayName: "TooltipStyles__StyledContent",
160
182
  componentId: "sc-67fvgm-4"
161
- })([ "padding:", ";font-size:", ";line-height:", ";user-select:none;" ], (0, v.pick)({
162
- enterprise: v.variables.spacingSmall,
163
- prisma: (0, v.pickVariant)("$isLabel", {
183
+ })([ "padding:", ";font-size:", ";line-height:", ";user-select:none;" ], (0, m.pick)({
184
+ enterprise: m.variables.spacingSmall,
185
+ prisma: (0, m.pickVariant)("$isLabel", {
164
186
  false: "12px 16px",
165
187
  true: "4px 8px"
166
188
  })
167
- }), (0, v.pick)({
168
- enterprise: v.variables.fontSizeSmall,
189
+ }), (0, m.pick)({
190
+ enterprise: m.variables.fontSizeSmall,
169
191
  prisma: "inherit"
170
- }), (0, v.pick)({
192
+ }), (0, m.pick)({
171
193
  enterprise: "18px",
172
- prisma: (0, v.pickVariant)("$isLabel", {
194
+ prisma: (0, m.pickVariant)("$isLabel", {
173
195
  false: "inherit",
174
196
  true: "18px"
175
197
  })
176
198
  }));
177
- var x = M()(k()).withConfig({
199
+ var x = S()(R()).withConfig({
178
200
  displayName: "TooltipStyles__StyledButton",
179
201
  componentId: "sc-67fvgm-5"
180
- })([ "cursor:default;", " ", " &:focus{box-shadow:", ";}" ], (0, v.pick)({
181
- 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;}}" ], w, w, v.variables.linkColor, w, v.variables.fontSizeSmall, v.variables.fontWeightSemiBold, w, v.variables.linkColor),
182
- 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)
183
- }), (0, v.pick)({
202
+ })([ "cursor:default;", " ", " &:focus{box-shadow:", ";}" ], (0, m.pick)({
203
+ enterprise: (0, w.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;}}" ], T, T, m.variables.linkColor, T, m.variables.fontSizeSmall, m.variables.fontWeightSemiBold, T, m.variables.linkColor),
204
+ prisma: (0, w.css)([ "color:", ";border-radius:50%;display:inline-block;vertical-align:middle;&:hover,&:focus{color:", ";background:", ";}" ], m.variables.contentColorMuted, m.variables.contentColorActive, m.variables.interactiveColorOverlayHover)
205
+ }), (0, m.pick)({
184
206
  prisma: {
185
- comfortable: (0, O.css)([ "padding:8px;" ]),
186
- compact: (0, O.css)([ "padding:6px;" ])
207
+ comfortable: (0, w.css)([ "padding:8px;" ]),
208
+ compact: (0, w.css)([ "padding:6px;" ])
187
209
  }
188
- }), v.variables.focusShadow);
210
+ }), m.variables.focusShadow);
189
211
  // CONCATENATED MODULE: ./src/Tooltip/Tooltip.tsx
190
212
  function _(e) {
191
213
  "@babel/helpers - typeof";
@@ -195,55 +217,76 @@
195
217
  return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
196
218
  }, _(e);
197
219
  }
198
- function j() {
199
- return j = Object.assign ? Object.assign.bind() : function(e) {
220
+ function B() {
221
+ return B = Object.assign ? Object.assign.bind() : function(e) {
200
222
  for (var t = 1; t < arguments.length; t++) {
201
223
  var n = arguments[t];
202
- for (var o in n) {
203
- ({}).hasOwnProperty.call(n, o) && (e[o] = n[o]);
224
+ for (var r in n) {
225
+ ({}).hasOwnProperty.call(n, r) && (e[r] = n[r]);
204
226
  }
205
227
  }
206
228
  return e;
207
- }, j.apply(null, arguments);
229
+ }, B.apply(null, arguments);
208
230
  }
209
- function I(e, t) {
231
+ function D(e, t) {
210
232
  if (null == e) return {};
211
- var n, o, r = A(e, t);
233
+ var n, r, o = H(e, t);
212
234
  if (Object.getOwnPropertySymbols) {
213
235
  var a = Object.getOwnPropertySymbols(e);
214
- for (o = 0; o < a.length; o++) {
215
- n = a[o], t.includes(n) || {}.propertyIsEnumerable.call(e, n) && (r[n] = e[n]);
236
+ for (r = 0; r < a.length; r++) {
237
+ n = a[r], t.includes(n) || {}.propertyIsEnumerable.call(e, n) && (o[n] = e[n]);
216
238
  }
217
239
  }
218
- return r;
240
+ return o;
219
241
  }
220
- function A(e, t) {
242
+ function H(e, t) {
221
243
  if (null == e) return {};
222
244
  var n = {};
223
- for (var o in e) {
224
- if ({}.hasOwnProperty.call(e, o)) {
225
- if (t.includes(o)) continue;
226
- n[o] = e[o];
245
+ for (var r in e) {
246
+ if ({}.hasOwnProperty.call(e, r)) {
247
+ if (t.includes(r)) continue;
248
+ n[r] = e[r];
227
249
  }
228
250
  }
229
251
  return n;
230
252
  }
231
- function H(e, t) {
253
+ function V(e, t) {
254
+ var n = Object.keys(e);
255
+ if (Object.getOwnPropertySymbols) {
256
+ var r = Object.getOwnPropertySymbols(e);
257
+ t && (r = r.filter((function(t) {
258
+ return Object.getOwnPropertyDescriptor(e, t).enumerable;
259
+ }))), n.push.apply(n, r);
260
+ }
261
+ return n;
262
+ }
263
+ function Z(e) {
264
+ for (var t = 1; t < arguments.length; t++) {
265
+ var n = null != arguments[t] ? arguments[t] : {};
266
+ t % 2 ? V(Object(n), !0).forEach((function(t) {
267
+ X(e, t, n[t]);
268
+ })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : V(Object(n)).forEach((function(t) {
269
+ Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(n, t));
270
+ }));
271
+ }
272
+ return e;
273
+ }
274
+ function F(e, t) {
232
275
  if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function");
233
276
  }
234
- function D(e, t) {
277
+ function N(e, t) {
235
278
  for (var n = 0; n < t.length; n++) {
236
- var o = t[n];
237
- o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0),
238
- Object.defineProperty(e, G(o.key), o);
279
+ var r = t[n];
280
+ r.enumerable = r.enumerable || !1, r.configurable = !0, "value" in r && (r.writable = !0),
281
+ Object.defineProperty(e, Y(r.key), r);
239
282
  }
240
283
  }
241
- function B(e, t, n) {
242
- return t && D(e.prototype, t), n && D(e, n), Object.defineProperty(e, "prototype", {
284
+ function W(e, t, n) {
285
+ return t && N(e.prototype, t), n && N(e, n), Object.defineProperty(e, "prototype", {
243
286
  writable: !1
244
287
  }), e;
245
288
  }
246
- function V(e, t) {
289
+ function z(e, t) {
247
290
  if ("function" != typeof t && null !== t) throw new TypeError("Super expression must either be null or a function");
248
291
  e.prototype = Object.create(t && t.prototype, {
249
292
  constructor: {
@@ -253,64 +296,64 @@
253
296
  }
254
297
  }), Object.defineProperty(e, "prototype", {
255
298
  writable: !1
256
- }), t && Z(e, t);
299
+ }), t && $(e, t);
257
300
  }
258
- function Z(e, t) {
259
- return Z = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(e, t) {
301
+ function $(e, t) {
302
+ return $ = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(e, t) {
260
303
  return e.__proto__ = t, e;
261
- }, Z(e, t);
304
+ }, $(e, t);
262
305
  }
263
- function N(e) {
264
- var t = F();
306
+ function U(e) {
307
+ var t = J();
265
308
  return function() {
266
- var n, o = $(e);
309
+ var n, r = Q(e);
267
310
  if (t) {
268
- var r = $(this).constructor;
269
- n = Reflect.construct(o, arguments, r);
270
- } else n = o.apply(this, arguments);
271
- return W(this, n);
311
+ var o = Q(this).constructor;
312
+ n = Reflect.construct(r, arguments, o);
313
+ } else n = r.apply(this, arguments);
314
+ return G(this, n);
272
315
  };
273
316
  }
274
- function W(e, t) {
317
+ function G(e, t) {
275
318
  if (t && ("object" == _(t) || "function" == typeof t)) return t;
276
319
  if (void 0 !== t) throw new TypeError("Derived constructors may only return object or undefined");
277
- return z(e);
320
+ return K(e);
278
321
  }
279
- function z(e) {
322
+ function K(e) {
280
323
  if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
281
324
  return e;
282
325
  }
283
- function F() {
326
+ function J() {
284
327
  try {
285
328
  var e = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], (function() {})));
286
329
  } catch (e) {}
287
- return (F = function t() {
330
+ return (J = function t() {
288
331
  return !!e;
289
332
  })();
290
333
  }
291
- function $(e) {
292
- return $ = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(e) {
334
+ function Q(e) {
335
+ return Q = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(e) {
293
336
  return e.__proto__ || Object.getPrototypeOf(e);
294
- }, $(e);
337
+ }, Q(e);
295
338
  }
296
- function U(e, t, n) {
297
- return (t = G(t)) in e ? Object.defineProperty(e, t, {
339
+ function X(e, t, n) {
340
+ return (t = Y(t)) in e ? Object.defineProperty(e, t, {
298
341
  value: n,
299
342
  enumerable: !0,
300
343
  configurable: !0,
301
344
  writable: !0
302
345
  }) : e[t] = n, e;
303
346
  }
304
- function G(e) {
305
- var t = K(e, "string");
347
+ function Y(e) {
348
+ var t = ee(e, "string");
306
349
  return "symbol" == _(t) ? t : t + "";
307
350
  }
308
- function K(e, t) {
351
+ function ee(e, t) {
309
352
  if ("object" != _(e) || !e) return e;
310
353
  var n = e[Symbol.toPrimitive];
311
354
  if (void 0 !== n) {
312
- var o = n.call(e, t || "default");
313
- if ("object" != _(o)) return o;
355
+ var r = n.call(e, t || "default");
356
+ if ("object" != _(r)) return r;
314
357
  throw new TypeError("@@toPrimitive must return a primitive value.");
315
358
  }
316
359
  return ("string" === t ? String : Number)(e);
@@ -318,7 +361,7 @@
318
361
  /** @public */
319
362
  /** @public */
320
363
  /** @public */
321
- /** @public */ var J = {
364
+ /** @public */ var te = {
322
365
  /** @private */
323
366
  appearance: a().string,
324
367
  children: a().node,
@@ -334,13 +377,13 @@
334
377
  onRequestOpen: a().func,
335
378
  open: a().bool,
336
379
  openDelay: a().oneOfType([ a().oneOf([ "primary", "secondary" ]), a().number ]),
380
+ renderAnchor: a().func,
337
381
  /** @private */
338
382
  splunkTheme: a().object
339
383
  };
340
- var Q = {
384
+ var ne = {
341
385
  closeDelay: 300,
342
386
  closeWhen: "default",
343
- contentRelationship: "description",
344
387
  defaultPlacement: "theme",
345
388
  inline: true,
346
389
  openDelay: "primary"
@@ -348,19 +391,19 @@
348
391
  /**
349
392
  * The Tooltip component wraps arbitrary content to be displayed when the target element is hovered
350
393
  * or focused.
351
- */ var X = function(e) {
352
- V(r, e);
353
- var t = N(r);
394
+ */ var re = function(e) {
395
+ z(o, e);
396
+ var t = U(o);
354
397
  // @docs-props-type TooltipPropsBase
355
- function r(e) {
398
+ function o(e) {
356
399
  var n;
357
- H(this, r);
400
+ F(this, o);
358
401
  n = t.call(this, e);
359
- U(z(n), "ariaId", void 0);
360
- U(z(n), "controlledExternally", void 0);
361
- U(z(n), "popoverId", void 0);
362
- U(z(n), "timeout", void 0);
363
- U(z(n), "handleMount", (function(e) {
402
+ X(K(n), "ariaId", void 0);
403
+ X(K(n), "controlledExternally", void 0);
404
+ X(K(n), "popoverId", void 0);
405
+ X(K(n), "timeout", void 0);
406
+ X(K(n), "handleMount", (function(e) {
364
407
  // Handle mouse events with native events due to current issues with how they
365
408
  // are handled by react. See https://github.com/facebook/react/issues/4251,
366
409
  // https://github.com/facebook/react/issues/19419, and SUI-1232.
@@ -375,7 +418,7 @@
375
418
  anchorEl: e
376
419
  });
377
420
  }));
378
- U(z(n), "handlePopoverMount", (function(e) {
421
+ X(K(n), "handlePopoverMount", (function(e) {
379
422
  if (e) {
380
423
  e.addEventListener("mouseenter", n.handleMouseEnterPopover);
381
424
  e.addEventListener("mouseleave", n.handleMouseLeavePopover);
@@ -387,12 +430,12 @@
387
430
  popoverEl: e
388
431
  });
389
432
  }));
390
- U(z(n), "handlePopoverOuterMount", (function(e) {
433
+ X(K(n), "handlePopoverOuterMount", (function(e) {
391
434
  n.setState({
392
435
  popoverOuterEl: e
393
436
  });
394
437
  }));
395
- U(z(n), "handleHitAreaMount", (function(e) {
438
+ X(K(n), "handleHitAreaMount", (function(e) {
396
439
  // Handle mouse events with native events due to current issues with how they
397
440
  // are handled by react. See https://github.com/facebook/react/issues/4251,
398
441
  // https://github.com/facebook/react/issues/19419, and SUI-1232.
@@ -409,22 +452,22 @@
409
452
  hitAreaEl: e
410
453
  });
411
454
  }));
412
- U(z(n), "handleMouseEnter", (function(e) {
455
+ X(K(n), "handleMouseEnter", (function(e) {
413
456
  n.handleRequestOpen(e, {
414
457
  reason: "mouseEnterToggle"
415
458
  });
416
459
  }));
417
- U(z(n), "handleMouseEnterPopover", (function(e) {
460
+ X(K(n), "handleMouseEnterPopover", (function(e) {
418
461
  n.handleRequestOpen(e, {
419
462
  reason: "mouseEnterPopover"
420
463
  });
421
464
  }));
422
- U(z(n), "handleMouseEnterHitArea", (function(e) {
465
+ X(K(n), "handleMouseEnterHitArea", (function(e) {
423
466
  n.handleRequestOpen(e, {
424
467
  reason: "mouseEnterHitArea"
425
468
  });
426
469
  }));
427
- U(z(n), "handleMouseLeave", (function(e) {
470
+ X(K(n), "handleMouseLeave", (function(e) {
428
471
  var t = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "mouseLeaveToggle";
429
472
  if (e.relatedTarget == null || e.relatedTarget !== n.state.popoverEl && e.relatedTarget !== n.state.popoverOuterEl) {
430
473
  n.handleRequestClose(e, {
@@ -432,76 +475,81 @@
432
475
  });
433
476
  }
434
477
  }));
435
- U(z(n), "handleMouseLeavePopover", (function(e) {
478
+ X(K(n), "handleMouseLeavePopover", (function(e) {
436
479
  n.handleMouseLeave(e, "mouseLeavePopover");
437
480
  }));
438
- U(z(n), "handleMouseLeaveHitArea", (function(e) {
481
+ X(K(n), "handleMouseLeaveHitArea", (function(e) {
439
482
  n.handleMouseLeave(e, "mouseLeaveHitArea");
440
483
  }));
441
- U(z(n), "handleMouseMoveHitAreaImpl", (function(e) {
484
+ X(K(n), "handleMouseMoveHitAreaImpl", (function(e) {
442
485
  n.handleRequestClose(e, {
443
486
  reason: "mouseStopHitArea"
444
487
  });
445
488
  }));
446
- U(z(n), "handleMouseMoveHitArea", u()(n.handleMouseMoveHitAreaImpl, 10));
447
- U(z(n), "handleClick", (function(e) {
489
+ X(K(n), "handleMouseMoveHitArea", p()(n.handleMouseMoveHitAreaImpl, 10));
490
+ X(K(n), "handleClick", (function(e) {
448
491
  if (n.props.closeWhen !== "notOnClick") {
449
492
  n.handleRequestClose(e, {
450
493
  reason: "toggleClick"
451
494
  });
452
495
  }
453
496
  }));
454
- U(z(n), "handleFocus", (function(e) {
497
+ X(K(n), "handleFocus", (function(e) {
455
498
  n.handleRequestOpen(e, {
456
499
  reason: "focusToggle"
457
500
  });
458
501
  }));
459
- U(z(n), "handleBlur", (function(e) {
502
+ X(K(n), "handleBlur", (function(e) {
460
503
  n.handleRequestClose(e, {
461
504
  reason: "blurToggle"
462
505
  });
463
506
  }));
464
- U(z(n), "handlePopoverOnRequestClose", (function(e) {
507
+ X(K(n), "handlePopoverOnRequestClose", (function(e) {
465
508
  n.handleRequestClose(null, e);
466
509
  }));
467
- U(z(n), "handleRequestClose", (function(e, t) {
468
- var o = n.props.closeDelay;
510
+ X(K(n), "handleRequestClose", (function(e, t) {
511
+ var r = n.props.closeDelay;
469
512
  if (n.timeout !== undefined) {
470
513
  clearTimeout(n.timeout);
471
514
  }
472
515
  n.timeout = setTimeout((function() {
473
- var o, r;
516
+ var r, o;
474
517
  if (!n.isControlled()) {
475
518
  n.setState({
476
519
  open: false
477
520
  });
478
521
  }
479
- (o = (r = n.props).onRequestClose) === null || o === void 0 ? void 0 : o.call(r, e, t);
480
- }), o);
522
+ (r = (o = n.props).onRequestClose) === null || r === void 0 ? void 0 : r.call(o, e, t);
523
+ }), r);
481
524
  }));
482
- U(z(n), "handleRequestOpen", (function(e, t) {
483
- var o = n.props.openDelay;
484
- var r = o === "primary" ? 300 : 750;
485
- var a = typeof o === "number" ? o : r;
525
+ X(K(n), "handleRequestOpen", (function(e, t) {
526
+ var r = n.props.openDelay;
527
+ var o = r === "primary" ? 300 : 750;
528
+ var a = typeof r === "number" ? r : o;
486
529
  if (n.timeout !== undefined) {
487
530
  clearTimeout(n.timeout);
488
531
  }
489
532
  n.timeout = setTimeout((function() {
490
- var o = n.isOpen();
533
+ var r = n.isOpen();
491
534
  if (!n.isControlled()) {
492
535
  n.setState({
493
536
  open: true
494
537
  });
495
538
  }
496
- if (!o) {
497
- var r, a;
498
- (r = (a = n.props).onRequestOpen) === null || r === void 0 ? void 0 : r.call(a, e, t);
539
+ if (!r) {
540
+ var o, a;
541
+ (o = (a = n.props).onRequestOpen) === null || o === void 0 ? void 0 : o.call(a, e, t);
499
542
  }
500
543
  }), a);
501
544
  }));
545
+ X(K(n), "handleRenderPropAnchorMount", (function(e) {
546
+ var t = n.props.elementRef;
547
+ n.handleMount(e);
548
+ g(t, e);
549
+ }));
502
550
  n.controlledExternally = l()(e, "open");
503
- n.popoverId = (0, h.createDOMID)("popover");
504
- n.ariaId = (0, h.createDOMID)("aria-id");
551
+ n.popoverId = (0, y.createDOMID)("popover");
552
+ n.ariaId = (0, y.createDOMID)("aria-id");
505
553
  n.state = {
506
554
  anchorEl: null,
507
555
  open: false,
@@ -511,7 +559,7 @@
511
559
  };
512
560
  return n;
513
561
  }
514
- B(r, [ {
562
+ W(o, [ {
515
563
  key: "componentDidUpdate",
516
564
  value: function e() {
517
565
  if (false) {}
@@ -535,86 +583,131 @@
535
583
  return !!this.state.anchorEl && this.isControlled() ? this.props.open : t && this.state.open;
536
584
  }
537
585
  }, {
538
- key: "render",
586
+ key: "createAnchor",
539
587
  value: function e() {
540
- 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 = I(t, [ "appearance", "children", "content", "defaultPlacement", "elementRef", "inline", "onRequestClose", "onRequestOpen", "splunkTheme", "contentRelationship" ]);
541
- var b = this.state.anchorEl;
542
- var g = !!i;
543
- var C = this.isOpen();
544
- var O = u ? R : P;
545
- var M = u ? q : T;
546
- var S = v.isEnterprise;
547
- var k = S ? "above" : "below";
548
- var w = r;
549
- if (r === undefined) {
550
- w = S ? "inverted" : "normal";
551
- }
552
- var _;
553
- if (h === "label") {
554
- _ = {
555
- labelledBy: this.ariaId,
556
- "aria-labelledby": this.ariaId
588
+ var t = this.props, o = t.children, a = t.inline, i = t.renderAnchor, l = t.splunkTheme;
589
+ if (i) {
590
+ var s, c;
591
+ if (false) {}
592
+ var p = {
593
+ onBlur: this.handleBlur,
594
+ onFocus: this.handleFocus,
595
+ onClick: this.handleClick,
596
+ elementRef: this.handleRenderPropAnchorMount,
597
+ "data-test": "toggle"
557
598
  };
558
- } else if (h === "description") {
559
- _ = {
560
- describedBy: this.ariaId,
599
+ if (this.props.contentRelationship === "label") {
600
+ var d, f;
601
+ return (d = (f = this.props).renderAnchor) === null || d === void 0 ? void 0 : d.call(f, Z(Z({}, u()(p, "describedBy", "aria-describedby")), {}, {
602
+ "aria-labelledby": this.ariaId,
603
+ labelledBy: this.ariaId
604
+ }));
605
+ }
606
+ return (s = (c = this.props).renderAnchor) === null || s === void 0 ? void 0 : s.call(c, Z(Z({}, u()(p, "labelledBy", "aria-labelledBy")), {}, {
607
+ "aria-describedby": this.ariaId,
608
+ describedBy: this.ariaId
609
+ }));
610
+ }
611
+ var v = a ? L : A;
612
+ var m;
613
+ if ( (0, n.isValidElement)(o)) {
614
+ var y;
615
+ if (this.props.contentRelationship === "label") {
616
+ y = {
617
+ labelledBy: this.ariaId,
618
+ "aria-labelledby": this.ariaId
619
+ };
620
+ } else {
621
+ y = {
622
+ describedBy: this.ariaId,
623
+ "aria-describedby": this.ariaId
624
+ };
625
+ }
626
+ m = (0, n.cloneElement)(o, y);
627
+ } else if (o) {
628
+ m = o;
629
+ } else {
630
+ var g = l.isEnterprise;
631
+ m = r().createElement(x, {
561
632
  "aria-describedby": this.ariaId
562
- };
633
+ }, g ? r().createElement(r().Fragment, null, r().createElement("span", {
634
+ "aria-hidden": "true"
635
+ }, "?"), r().createElement(h(), null, (0, b._)("More info"))) : r().createElement(P, {
636
+ hideDefaultTooltip: true,
637
+ screenReaderText: (0, b._)("More info"),
638
+ style: {
639
+ height: "22px",
640
+ width: "22px"
641
+ }
642
+ }));
563
643
  }
564
644
 
565
- return o().createElement(O, j({
566
- "data-test": "tooltip",
567
- "data-test-open": C,
568
- "data-test-popover-id": this.popoverId,
569
- ref: s
570
- }, y), o().createElement(M, {
645
+ return r().createElement(v, {
571
646
  onClick: this.handleClick,
572
647
  onFocus: this.handleFocus,
573
648
  onBlur: this.handleBlur,
574
649
  ref: this.handleMount,
575
650
  "data-test": "toggle"
576
- }, g && (0, n.isValidElement)(a) ? (0, n.cloneElement)(a, _) : a, g && !a && o().createElement(x, {
577
- "aria-describedby": this.ariaId
578
- }, S ? o().createElement(o().Fragment, null, o().createElement("span", {
579
- "aria-hidden": "true"
580
- }, "?"), o().createElement(f(), null, (0, m._)("More info"))) : o().createElement(E, {
581
- hideDefaultTooltip: true,
582
- screenReaderText: (0, m._)("More info"),
583
- style: {
584
- height: "22px",
585
- width: "22px"
586
- }
587
- })), g && o().createElement(f(), {
651
+ }, m);
652
+ }
653
+ }, {
654
+ key: "render",
655
+ value: function e() {
656
+ var t = this.props, n = t.appearance, o = t.content, a = t.defaultPlacement, i = t.elementRef, l = t.inline, s = t.onRequestClose, u = t.onRequestOpen, c = t.splunkTheme, p = t.contentRelationship, d = t.renderAnchor, v = D(t, [ "appearance", "content", "defaultPlacement", "elementRef", "inline", "onRequestClose", "onRequestOpen", "splunkTheme", "contentRelationship", "renderAnchor" ]);
657
+ var m = this.state.anchorEl;
658
+ var y = !!o;
659
+ var b = this.isOpen();
660
+ var g = l ? q : j;
661
+ var E = c.isEnterprise;
662
+ var O = E ? "above" : "below";
663
+ var C = n;
664
+ if (n === undefined) {
665
+ C = E ? "inverted" : "normal";
666
+ }
667
+ var M = this.createAnchor();
668
+ var P = y && r().createElement(h(), {
588
669
  "aria-hidden": "true",
589
670
  id: this.ariaId
590
- }, i)), o().createElement(p(), {
671
+ }, o);
672
+ var w = r().createElement(f(), {
591
673
  role: "tooltip",
592
674
  align: "center",
593
- anchor: b,
675
+ anchor: m,
594
676
  animationConfig: {
595
677
  tension: 400
596
678
  },
597
- appearance: w,
679
+ appearance: C,
598
680
  closeReasons: [ "offScreen", "escapeKey" ],
599
- defaultPlacement: l === "theme" ? k : l,
681
+ defaultPlacement: a === "theme" ? O : a,
600
682
  id: this.popoverId,
601
- open: C,
683
+ open: b,
602
684
  onRequestClose: this.handlePopoverOnRequestClose,
603
685
  elementRef: this.handlePopoverMount,
604
686
  hitAreaRef: this.handleHitAreaMount,
605
687
  outerRef: this.handlePopoverOuterMount
606
- }, o().createElement(L, {
607
- $isLabel: h === "label"
608
- }, i)));
688
+ }, r().createElement(I, {
689
+ $isLabel: p === "label"
690
+ }, o));
691
+ if (d) {
692
+
693
+ return r().createElement(r().Fragment, null, M, P, w);
694
+ }
695
+
696
+ return r().createElement(g, B({
697
+ "data-test": "tooltip",
698
+ "data-test-open": b,
699
+ "data-test-popover-id": this.popoverId,
700
+ ref: i
701
+ }, v), M, P, w);
609
702
  }
610
703
  } ]);
611
- return r;
704
+ return o;
612
705
  }(n.Component);
613
- U(X, "propTypes", J);
614
- U(X, "defaultProps", Q);
615
- var Y = (0, v.withSplunkTheme)(X);
616
- Y.propTypes = X.propTypes;
617
- /* harmony default export */ const ee = Y;
706
+ X(re, "propTypes", te);
707
+ X(re, "defaultProps", ne);
708
+ var oe = (0, m.withSplunkTheme)(re);
709
+ oe.propTypes = re.propTypes;
710
+ /* harmony default export */ const ae = oe;
618
711
  // only for styled components using Tooltip
619
712
  // CONCATENATED MODULE: ./src/Tooltip/index.ts
620
713
  module.exports = t;