@splunk/react-ui 4.28.2 → 4.30.0

package/Clickable.js

@@ -63,8 +63,9 @@
         e.d(t, {
         NavigationContext: () => /* reexport */ h,
         NavigationProvider: () => /* reexport */ m,
-        default: () => /* reexport */ G,
-        isInternalLink: () => /* reexport */ z
+        default: () => /* reexport */ F,
+        isInternalLink: () => /* reexport */ z,
+        isRootRelativeLink: () => /* reexport */ L
     });
     // CONCATENATED MODULE: external "react"
     const n = require("react");
@@ -76,10 +77,10 @@
     const l = require("lodash/has");
     // CONCATENATED MODULE: external "lodash/isString"
     const a = require("lodash/isString");
-    var c =  e.n(a);
+    var u =  e.n(a);
     // CONCATENATED MODULE: external "lodash/omit"
-    const u = require("lodash/omit");
-    var f =  e.n(u);
+    const c = require("lodash/omit");
+    var f =  e.n(c);
     // CONCATENATED MODULE: external "@splunk/react-ui/Dropdown"
     const s = require("@splunk/react-ui/Dropdown");
     // CONCATENATED MODULE: external "styled-components"
@@ -88,33 +89,49 @@
     // CONCATENATED MODULE: external "@splunk/themes"
     const b = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/Clickable/ClickableStyles.ts
-    var y = d().a.withConfig({
+    var v = d().a.withConfig({
         displayName: "ClickableStyles__StyledA",
         componentId: "sc-7al1vw-0"
     })([ "", " cursor:pointer;&[disabled],&[aria-disabled='true']{color:", ";}&::-moz-focus-inner{border:0;padding:0;}" ], b.mixins.reset("inline"), b.variables.contentColorDisabled);
     // CONCATENATED MODULE: ./src/Clickable/NavigationProvider.tsx
     /** @public */
-    var v = {
+    var y = {
         children: i().node,
         onClick: i().func,
-        prefix: i().string
+        prefix: i().string,
+        transformUrl: i().func
     };
     var h =  r().createContext({});
     /**
  * Used to provide an override for the `onClick` for links for single page applications so that
  * internal links can navigate without a page reload.
  */    function m(e) {
-        var t = e.children, n = e.onClick, o = e.prefix;
+        var t = e.children, o = e.onClick, i = e.prefix, l = e.transformUrl;
         // @docs-props-type NavigationProviderProps
-                
-        return r().createElement(h.Provider, {
-            value: {
-                onClick: n,
-                prefix: o
+                var a = (0, n.useMemo)((function() {
+            var e;
+            if (l != null) {
+                if (false) {}
+                e = l;
+            } else if (i != null) {
+                if (false) {}
+                e = function e() {
+                    var t = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
+                    var n = arguments.length > 1 ? arguments[1] : undefined, r = n.isInternal, o = n.isRootRelative;
+                    return i != null && r && o ? "".concat(i).concat(t) : t;
+                };
             }
+            return {
+                onClick: o,
+                transformUrl: e
+            };
+        }), [ o, i, l ]);
+        
+        return r().createElement(h.Provider, {
+            value: a
         }, t);
     }
-    m.propTypes = v;
+    m.propTypes = y;
     // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
     /**
  * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
@@ -135,21 +152,21 @@
         }
     }
     // CONCATENATED MODULE: ./src/Clickable/Clickable.tsx
-    function O(e) {
+    function k(e) {
         "@babel/helpers - typeof";
         if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-            O = function e(t) {
+            k = function e(t) {
                 return typeof t;
             };
         } else {
-            O = function e(t) {
+            k = function e(t) {
                 return t && typeof Symbol === "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
             };
         }
-        return O(e);
+        return k(e);
     }
-    function k() {
-        k = Object.assign || function(e) {
+    function O() {
+        O = Object.assign || function(e) {
             for (var t = 1; t < arguments.length; t++) {
                 var n = arguments[t];
                 for (var r in n) {
@@ -160,7 +177,7 @@
             }
             return e;
         };
-        return k.apply(this, arguments);
+        return O.apply(this, arguments);
     }
     function C(e, t) {
         if (e == null) return {};
@@ -203,12 +220,12 @@
             Object.defineProperty(e, r.key, r);
         }
     }
-    function P(e, t, n) {
+    function R(e, t, n) {
         if (t) j(e.prototype, t);
         if (n) j(e, n);
         return e;
     }
-    function S(e, t) {
+    function P(e, t) {
         if (typeof t !== "function" && t !== null) {
             throw new TypeError("Super expression must either be null or a function");
         }
@@ -219,21 +236,21 @@
                 configurable: true
             }
         });
-        if (t) _(e, t);
+        if (t) S(e, t);
     }
-    function _(e, t) {
-        _ = Object.setPrototypeOf || function e(t, n) {
+    function S(e, t) {
+        S = Object.setPrototypeOf || function e(t, n) {
             t.__proto__ = n;
             return t;
         };
-        return _(e, t);
+        return S(e, t);
     }
-    function R(e) {
-        var t = T();
+    function _(e) {
+        var t = N();
         return function n() {
-            var r = q(e), o;
+            var r = M(e), o;
             if (t) {
-                var i = q(this).constructor;
+                var i = M(this).constructor;
                 o = Reflect.construct(r, arguments, i);
             } else {
                 o = r.apply(this, arguments);
@@ -242,18 +259,18 @@
         };
     }
     function I(e, t) {
-        if (t && (O(t) === "object" || typeof t === "function")) {
+        if (t && (k(t) === "object" || typeof t === "function")) {
             return t;
         }
-        return N(e);
+        return T(e);
     }
-    function N(e) {
+    function T(e) {
         if (e === void 0) {
             throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
         }
         return e;
     }
-    function T() {
+    function N() {
         if (typeof Reflect === "undefined" || !Reflect.construct) return false;
         if (Reflect.construct.sham) return false;
         if (typeof Proxy === "function") return true;
@@ -264,13 +281,13 @@
             return false;
         }
     }
-    function q(e) {
-        q = Object.setPrototypeOf ? Object.getPrototypeOf : function e(t) {
+    function M(e) {
+        M = Object.setPrototypeOf ? Object.getPrototypeOf : function e(t) {
             return t.__proto__ || Object.getPrototypeOf(t);
         };
-        return q(e);
+        return M(e);
     }
-    function E(e, t, n) {
+    function q(e, t, n) {
         if (t in e) {
             Object.defineProperty(e, t, {
                 value: n,
@@ -283,11 +300,14 @@
         }
         return e;
     }
-    var M = /^[a-z0-9]+:/;
-    var D = /^\/\//;
-    var L = /^\//;
+    var E = /^[a-z0-9]+:/;
+    var U = /^\/\//;
+    var D = /^\//;
+    var L = function e(t) {
+        return t != null && D.test(t);
+    };
     var z = function e(t) {
-        return t != null && !M.test(t) && !D.test(t);
+        return t != null && !E.test(t) && !U.test(t);
     };
     var H = {
         /** @private */
@@ -307,30 +327,24 @@
     function A(e) {
         return !!e.to && !e.disabled;
     }
-    function B(e, t) {
-        if (t != null && z(e) && L.test(e)) {
-            return "".concat(t).concat(e);
-        }
-        return e;
-    }
     /**
  * `Clickable` renders as a `button` element, or as an `a` element if the `to` prop is set
  * and the `disabled` prop is `false`. This is called link mode.
- */    var F =  function(e) {
-        S(n, e);
-        var t = R(n);
+ */    var B =  function(e) {
+        P(n, e);
+        var t = _(n);
         // @docs-props-type ClickablePropsBase
         // should use ClickablePropsBase but fails on refs - observe
                 function n(e) {
             var r;
             x(this, n);
             r = t.call(this, e);
-            E(N(r), "el", null);
-            E(N(r), "handleMount", (function(e) {
+            q(T(r), "el", null);
+            q(T(r), "handleMount", (function(e) {
                 r.el = e;
                 g(r.props.elementRef, e);
             }));
-            E(N(r), "createHandleOnClick", (function(e) {
+            q(T(r), "createHandleOnClick", (function(e) {
                 return function(t) {
                     if (A(r.props)) {
                         // when user command-click on mac or ctrl-click on other platforms, and
@@ -346,24 +360,30 @@
                     if (r.props.onClick) {
                         r.props.onClick(t);
                     } else if (A(r.props) && e) {
-                        var n = r.context.prefix;
-                        var o = r.props.navigationLabel;
-                        if (!o && c()(r.props.children)) {
-                            o = r.props.children;
+                        var n = r.props.navigationLabel;
+                        if (!n && u()(r.props.children)) {
+                            n = r.props.children;
                         }
                         e(t, {
-                            to: B(r.props.to, n),
+                            to: r.getTransformedUrl(r.props.to),
                             originalTo: r.props.to,
                             openInNewContext: r.props.openInNewContext,
-                            label: o
+                            label: n
                         });
                     }
                 };
             }));
+            q(T(r), "getTransformedUrl", (function(e) {
+                var t = r.context.transformUrl;
+                return t != null ? t(e, {
+                    isInternal: z(e),
+                    isRootRelative: L(e)
+                }) : e;
+            }));
             if (false) {}
             return r;
         }
-        P(n, [ {
+        R(n, [ {
             key: "focus",
             /**
      * Place focus on the element.
@@ -375,54 +395,54 @@
         }, {
             key: "render",
             value: function e() {
-                var t = this.context, n = t.onClick, o = t.prefix;
-                var i = this.createHandleOnClick(n);
+                var t = this.context.onClick;
+                var n = this.createHandleOnClick(t);
  // Only set the href attribute when enabled, and therefore using an <a> tag
                                 if (A(this.props)) {
-                    var l = this.props, a = l.children, c = l.openInNewContext, u = l.to, s = C(l, [ "children", "openInNewContext", "to" ]);
-                    var p = c ? "_blank" : undefined;
-                    var d = c && z(u) ? "noopener noreferrer" : undefined;
+                    var o = this.props, i = o.children, l = o.openInNewContext, a = o.to, u = C(o, [ "children", "openInNewContext", "to" ]);
+                    var c = l ? "_blank" : undefined;
+                    var s = l && z(a) ? "noopener noreferrer" : undefined;
                     
-                    return r().createElement(y, k({
+                    return r().createElement(v, O({
                         "data-test": "clickable",
                         ref: this.handleMount,
-                        href: B(this.props.to, o),
-                        target: p,
-                        rel: d,
-                        onClick: i
-                    }, f()(s, "disabled", "elementRef", "onClick")), a);
+                        href: this.getTransformedUrl(this.props.to),
+                        target: c,
+                        rel: s,
+                        onClick: n
+                    }, f()(u, "disabled", "elementRef", "onClick")), i);
                 }
                 if (this.props.allowDisabledLink) {
-                    var b = this.props, v = b.children, h = C(b, [ "children" ]);
+                    var p = this.props, d = p.children, b = C(p, [ "children" ]);
                     if (this.props.disabled && this.props.to != null) {
                         
-                        return r().createElement(y, k({
+                        return r().createElement(v, O({
                             "data-test": "clickable",
                             ref: this.handleMount,
                             role: "link",
                             "aria-disabled": "true"
-                        }, f()(h, "href", "to", "elementRef", "onClick", "disabled")), v);
+                        }, f()(b, "href", "to", "elementRef", "onClick", "disabled")), d);
                     }
                 }
  // button variant
-                                var m = this.props, g = m.children, O = m.type, w = C(m, [ "children", "type" ]);
+                                var y = this.props, h = y.children, m = y.type, g = C(y, [ "children", "type" ]);
                 
-                return r().createElement(y, k({
+                return r().createElement(v, O({
                     as: "button",
                     "data-test": "clickable",
                     ref: this.handleMount,
-                    type: O || "button",
-                    onClick: i
-                }, f()(w, "elementRef", "onClick", "openInNewContext", "to")), g);
+                    type: m || "button",
+                    onClick: n
+                }, f()(g, "elementRef", "onClick", "openInNewContext", "to")), h);
             }
         } ]);
         return n;
     }(n.Component);
-    E(F, "contextType", h);
-    E(F, "propTypes", H);
-    E(F, "defaultProps", K);
-    E(F, s.legacyRefMode, true);
-    /* harmony default export */    const G = F;
+    q(B, "contextType", h);
+    q(B, "propTypes", H);
+    q(B, "defaultProps", K);
+    q(B, s.legacyRefMode, true);
+    /* harmony default export */    const F = B;
     // CONCATENATED MODULE: ./src/Clickable/index.ts
     module.exports = t;
     /******/})();

package/Code.js

@@ -920,14 +920,14 @@
                                         // at least one Token object was removed, so we have to do some rematching
                                         // this can only happen if the current pattern is greedy
                                         /** @type {RematchOptions} */
-                                        var L = {
+                                        var j = {
                                             cause: d + "," + f,
                                             reach: N
                                         };
-                                        l(e, t, a, S.prev, A, L);
+                                        l(e, t, a, S.prev, A, j);
                                         // the reach might have been extended because of the rematching
-                                                                                if (u && L.reach > u.reach) {
-                                            u.reach = L.reach;
+                                                                                if (u && j.reach > u.reach) {
+                                            u.reach = j.reach;
                                         }
                                     }
                                 }
@@ -2114,7 +2114,7 @@
                 a.r(n);
         // EXPORTS
                 a.d(n, {
-            default: () => /* reexport */ j
+            default: () => /* reexport */ L
         });
         // CONCATENATED MODULE: external "react"
         const e = require("react");
@@ -2187,20 +2187,8 @@
                 light: k.variables.syntaxGreen
             }
         });
-        var _ = (0, k.pick)({
-            prisma: k.variables.syntaxBlue,
-            enterprise: {
-                dark: k.variables.syntaxBlueLight,
-                light: k.variables.syntaxBlue
-            }
-        });
-        var O = (0, k.pick)({
-            prisma: k.variables.syntaxRed,
-            enterprise: {
-                dark: k.variables.syntaxRedLight,
-                light: k.variables.syntaxRed
-            }
-        });
+        var _ = k.variables.syntaxBlue;
+        var O = k.variables.syntaxRed;
         var T = {
             comment: F,
             prolog: F,
@@ -2309,7 +2297,7 @@
             showIndentGuide: s().bool,
             value: s().string
         };
-        function L(e) {
+        function j(e) {
             var a = e.elementRef, n = e.indentChars, r = n === void 0 ? 4 : n, s = e.language, i = e.languageFallback, l = i === void 0 ? "javascript" : i, c = e.showIndentGuide, d = c === void 0 ? true : c, f = e.value, h = f === void 0 ? "" : f, v = R(e, [ "elementRef", "indentChars", "language", "languageFallback", "showIndentGuide", "value" ]);
             // @docs-props-type CodePropsBase
                         var b = g()(" ", r);
@@ -2374,8 +2362,8 @@
                 className: "language-".concat(F)
             }, _));
         }
-        L.propTypes = D;
-        /* harmony default export */        const j = L;
+        j.propTypes = D;
+        /* harmony default export */        const L = j;
     }) // CONCATENATED MODULE: ./src/Code/index.ts
     ();
     module.exports = n;

package/CollapsiblePanel.js

@@ -721,10 +721,15 @@
                 if (false) {}
                 if (false) {}
             }
-        }, {
+            /**
+     * SingleOpenPanelGroup already takes into account if it is controlled or not in determining openPanelId
+     * so this.context.openPanelId is used for both the controlled and uncontrolled case.
+     */        }, {
             key: "isOpen",
             value: function e() {
-                return this.isControlled() ? this.props.open : this.state.open;
+                var e = this.isControlled() ? this.props.open : this.state.open;
+                var t = this.context.openPanelId !== undefined ? this.context.openPanelId === this.props.panelId : e;
+                return t;
             }
  // Using all three handlers: `handleRequestClose` and `handleRequestOpen` and `handleChange` to test interoperability and maintain backwards compatibility until the open/close handlers are removed in SUI-5
                 }, {
@@ -737,12 +742,7 @@
             value: function e() {
                 var t = this.props, o = t.innerBodyStyles, a = t.children, i = t.description, s = t.disabled, p = t.elementRef, u = t.headingLevel, f = t.overflow, b = t.renderChildrenWhenCollapsed, v = t.title, m = t.titleWithActions, y = t.inset;
                 var h = this.state.animating;
-                var g = this.context.openPanelId !== undefined ? 
-                /**
-       * SingleOpenPanelGroup already takes into account if it is controlled or not in determining openPanelId
-       * so this.context.openPanelId is used for both the controlled and uncontrolled case.
-       */
-                this.context.openPanelId === this.props.panelId : this.isOpen();
+                var g = this.isOpen();
                 var k = {
                     disabled: s,
                     onClick: this.handleChange,

package/ComboBox.js

@@ -527,6 +527,7 @@
         menuStyle: i().object,
         name: i().string,
         noOptionsMessage: i().node,
+        onBlur: i().func,
         onChange: i().func,
         onClose: i().func,
         onFocus: i().func,
@@ -534,6 +535,7 @@
         onOpen: i().func,
         onScroll: i().func,
         onScrollBottom: i().func,
+        onSelect: i().func,
         placeholder: i().string,
         prepend: i().bool,
         size: i().oneOf([ "small", "medium", "large" ]),
@@ -714,43 +716,42 @@
                     (t = (n = i.props).onScrollBottom) === null || t === void 0 ? void 0 : t.call(n, e);
                 }
             }));
-            ce(ae(i), "renderMenu", (function(e) {
-                var t = e.anchorWidth, r = e.maxHeight;
-                var a = i.props, l = a.children, u = a.controlledFilter, s = a.isLoadingOptions, f = a.menuStyle, p = a.onScrollBottom, d = a.virtualization;
-                var v = i.state, y = v.activeIndex, g = v.typedValue;
-                var S = i.getValue();
-                var C = n.Children.toArray(l).filter(n.isValidElement);
-                var w = b()(C, (function(e) {
+            ce(ae(i), "prepareOptions", (function() {
+                var e = i.props, t = e.children, r = e.controlledFilter;
+                var a = i.state, l = a.activeIndex, u = a.typedValue;
+                var s = i.getValue();
+                var f = n.Children.toArray(t).filter(n.isValidElement);
+                var p = b()(f, (function(e) {
                     if (e.type === I.Heading) {
                         return false;
                     }
                     if (e.props.label === undefined) {
-                        return e.props.value === S;
+                        return e.props.value === s;
                     }
-                    if (e.props.label !== undefined && g !== undefined) {
-                        return e.props.label === S;
+                    if (e.props.label !== undefined && u !== undefined) {
+                        return e.props.label === s;
                     }
-                    return e.props.value === S;
+                    return e.props.value === s;
                 }));
-                if (!w && S) {
-                    C.unshift( o().createElement(X, {
+                if (!p && s) {
+                    f.unshift( o().createElement(X, {
                         description: (0, O._)("(New value)"),
                         descriptionPosition: "right",
                         key: "currentValueOption",
-                        value: S,
-                        "data-test-current-value-option": S
+                        value: s,
+                        "data-test-current-value-option": s
                     }));
                 }
  // Highlight Active
                                 i.availableOptionCount = 0;
                 i.activeValue = undefined;
-                var j = (0, m.stringToKeywords)(g ? S : i.getDisplayValue());
-                i.options = (u ? C : C.filter((function(e) {
+                var d = (0, m.stringToKeywords)(u ? s : i.getDisplayValue());
+                i.options = (r ? f : f.filter((function(e) {
                     if (e.props.label !== undefined) {
-                        return (0, m.testPhrase)(e.props.label, j);
+                        return (0, m.testPhrase)(e.props.label, d);
                     }
                     if (e.props.value !== undefined) {
-                        return (0, m.testPhrase)(e.props.value, j);
+                        return (0, m.testPhrase)(e.props.value, d);
                     }
                     return true;
  // Keep all headers and non-interactive options
@@ -759,11 +760,11 @@
                         // ignore Headings and Dividers
                         return e;
                     }
-                    var o = i.availableOptionCount === y;
+                    var o = i.availableOptionCount === l;
                     i.availableOptionCount += 1;
-                    var r = e.props.label !== undefined ? e.props.label : e.props.value;
-                    var a = e.props.matchRanges;
-                    var l = !u && S && (w || t > 0) ? (0, m.keywordLocations)(r, j) || undefined : undefined;
+                    var a = e.props.label !== undefined ? e.props.label : e.props.value;
+                    var u = e.props.matchRanges;
+                    var f = !r && s && (p || t > 0) ? (0, m.keywordLocations)(a, d) || undefined : undefined;
                     if (o) {
                         if (!e.props.disabled) {
                             i.activeValue = e.props.value;
@@ -773,35 +774,39 @@
                             ref: i.handleActiveOptionMount,
                             id: i.activeItemId,
                             onClick: i.handleSelectOption,
-                            matchRanges: a || l,
+                            matchRanges: u || f,
                             active: true
                         });
                     }
                     
                     return (0, n.cloneElement)(e, {
                         onClick: i.handleSelectOption,
-                        matchRanges: a || l
+                        matchRanges: u || f
                     });
                 }));
-                var x = de({
+            }));
+            ce(ae(i), "renderMenu", (function(e) {
+                var t = e.anchorWidth, n = e.maxHeight;
+                var r = i.props, a = r.isLoadingOptions, l = r.menuStyle, u = r.onScrollBottom, c = r.virtualization;
+                var s = de({
                     anchorWidth: t,
-                    maxHeight: r,
-                    menuStyle: f
+                    maxHeight: n,
+                    menuStyle: l
                 });
-                var R = Z({
-                    style: x,
+                var f = Z({
+                    style: s,
                     controlledExternally: true,
-                    onScrollBottom: p ? i.handleScrollBottom : undefined,
-                    isLoading: s
+                    onScrollBottom: u ? i.handleScrollBottom : undefined,
+                    isLoading: a
                 }, h()(i.props, "className", "noOptionsMessage", "footerMessage", "animateLoading", "loadingMessage", "onScroll"));
-                if (d) {
+                if (c) {
                     
                     return o().createElement(k.VirtualizedResultsMenu, J({
-                        virtualization: d
-                    }, R), i.options);
+                        virtualization: c
+                    }, f), i.options);
                 }
                 
-                return o().createElement(P(), R, i.options);
+                return o().createElement(P(), f, i.options);
             }));
             i.state = {
                 activeIndex: 0,
@@ -886,6 +891,7 @@
                 var n = this.state, r = n.anchor, i = n.open;
                 var a = this.getValue();
                 var l = this.getDisplayValue();
+                this.prepareOptions();
                 
                 return o().createElement(x(), J({
                     autoCapitalize: "off",
@@ -907,9 +913,8 @@
                     elementRef: this.handleAnchorMount,
                     role: "combobox",
                     value: l,
-                    "aria-activedescendant": this.activeItemId,
+                    "aria-activedescendant": this.state.open && Array.isArray(this.options) && this.options.length > 0 ? this.activeItemId : undefined,
                     "aria-expanded": i,
-                    "aria-haspopup": true,
                     "aria-label": (0, O._)("Value input"),
                     "aria-controls": i ? this.popoverId : undefined
                 }),  o().createElement(w(), {