@splunk/react-ui 4.29.0 → 4.31.0

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.state.open ? this.activeItemId : undefined,
+                    "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(), {

package/Date.js

@@ -62,7 +62,7 @@
     // EXPORTS
         e.d(t, {
         DateWithoutTheme: () => /* reexport */ Y,
-        default: () => /* reexport */ Z
+        default: () => /* reexport */ N
     });
     // CONCATENATED MODULE: external "react"
     const n = require("react");
@@ -562,7 +562,7 @@
                     value: this.getTextInputValue(),
                     startAdornment: p,
                     $disabled: n
-                }, d, s()(this.props, "className", "defaultValue", "elementRef", "inputOnly", "multiline", "locale", "onChange", "onClick", "onFocus", "onKeyDown", "onSelect", "spellCheck", "value")), f);
+                }, d, s()(this.props, "defaultValue", "elementRef", "inputOnly", "multiline", "locale", "onChange", "onClick", "onFocus", "onKeyDown", "onSelect", "spellCheck", "value")), f);
             }
         } ]);
         return n;
@@ -577,10 +577,10 @@
         }
     }));
     var $ = (0, b.withSplunkTheme)(Y);
-    var N = $;
-    N.propTypes = Y.propTypes;
-    N.momentFormat = Y.momentFormat;
-    /* harmony default export */    const Z = N;
+    var Z = $;
+    Z.propTypes = Y.propTypes;
+    Z.momentFormat = Y.momentFormat;
+    /* harmony default export */    const N = Z;
     // CONCATENATED MODULE: ./src/Date/index.ts
     module.exports = t;
     /******/})();

package/Divider.js

@@ -24,11 +24,11 @@
     /******/    (() => {
         /******/ // define getter functions for harmony exports
         /******/ e.d = (r, t) => {
-            /******/ for (var o in t) {
-                /******/ if (e.o(t, o) && !e.o(r, o)) {
-                    /******/ Object.defineProperty(r, o, {
+            /******/ for (var n in t) {
+                /******/ if (e.o(t, n) && !e.o(r, n)) {
+                    /******/ Object.defineProperty(r, n, {
                         enumerable: true,
-                        get: t[o]
+                        get: t[n]
                     });
                     /******/                }
                 /******/            }
@@ -61,89 +61,140 @@
         e.r(r);
     // EXPORTS
         e.d(r, {
-        default: () => /* reexport */ v
+        default: () => /* reexport */ j
     });
     // CONCATENATED MODULE: external "react"
     const t = require("react");
-    var o =  e.n(t);
+    var n =  e.n(t);
     // CONCATENATED MODULE: external "prop-types"
-    const n = require("prop-types");
-    var i =  e.n(n);
+    const o = require("prop-types");
+    var i =  e.n(o);
     // CONCATENATED MODULE: external "styled-components"
     const a = require("styled-components");
     var l =  e.n(a);
     // CONCATENATED MODULE: external "@splunk/themes"
-    const s = require("@splunk/themes");
+    const c = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/Divider/DividerStyles.ts
-    var c = l().hr.withConfig({
+    var u = l().hr.withConfig({
         displayName: "DividerStyles__StyledRule",
         componentId: "gl6kyz-0"
-    })([ "", ";", ";border-color:", ";" ], s.mixins.reset("block"), (0, s.pickVariant)("$orientation", {
+    })([ "", ";", ";border-color:", ";" ], c.mixins.reset("block"), (0, c.pickVariant)("$orientation", {
         horizontal: (0, a.css)([ "border-top-style:solid;border-width:1px;" ]),
         vertical: (0, a.css)([ "display:inline;border-left-style:solid;border-width:1px;" ])
-    }), (0, s.pick)({
-        enterprise: s.variables.borderColor,
-        prisma: s.variables.neutral200
+    }), (0, c.pick)({
+        enterprise: c.variables.borderColor,
+        prisma: c.variables.neutral200
     }));
     // CONCATENATED MODULE: ./src/Divider/Divider.tsx
-    function u() {
-        u = Object.assign || function(e) {
+    function s() {
+        s = Object.assign || function(e) {
             for (var r = 1; r < arguments.length; r++) {
                 var t = arguments[r];
-                for (var o in t) {
-                    if (Object.prototype.hasOwnProperty.call(t, o)) {
-                        e[o] = t[o];
+                for (var n in t) {
+                    if (Object.prototype.hasOwnProperty.call(t, n)) {
+                        e[n] = t[n];
                     }
                 }
             }
             return e;
         };
-        return u.apply(this, arguments);
+        return s.apply(this, arguments);
     }
-    function p(e, r) {
+    function f(e, r) {
+        var t = Object.keys(e);
+        if (Object.getOwnPropertySymbols) {
+            var n = Object.getOwnPropertySymbols(e);
+            if (r) n = n.filter((function(r) {
+                return Object.getOwnPropertyDescriptor(e, r).enumerable;
+            }));
+            t.push.apply(t, n);
+        }
+        return t;
+    }
+    function p(e) {
+        for (var r = 1; r < arguments.length; r++) {
+            var t = arguments[r] != null ? arguments[r] : {};
+            if (r % 2) {
+                f(Object(t), true).forEach((function(r) {
+                    b(e, r, t[r]);
+                }));
+            } else if (Object.getOwnPropertyDescriptors) {
+                Object.defineProperties(e, Object.getOwnPropertyDescriptors(t));
+            } else {
+                f(Object(t)).forEach((function(r) {
+                    Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+                }));
+            }
+        }
+        return e;
+    }
+    function b(e, r, t) {
+        if (r in e) {
+            Object.defineProperty(e, r, {
+                value: t,
+                enumerable: true,
+                configurable: true,
+                writable: true
+            });
+        } else {
+            e[r] = t;
+        }
+        return e;
+    }
+    function d(e, r) {
         if (e == null) return {};
-        var t = f(e, r);
-        var o, n;
+        var t = y(e, r);
+        var n, o;
         if (Object.getOwnPropertySymbols) {
             var i = Object.getOwnPropertySymbols(e);
-            for (n = 0; n < i.length; n++) {
-                o = i[n];
-                if (r.indexOf(o) >= 0) continue;
-                if (!Object.prototype.propertyIsEnumerable.call(e, o)) continue;
-                t[o] = e[o];
+            for (o = 0; o < i.length; o++) {
+                n = i[o];
+                if (r.indexOf(n) >= 0) continue;
+                if (!Object.prototype.propertyIsEnumerable.call(e, n)) continue;
+                t[n] = e[n];
             }
         }
         return t;
     }
-    function f(e, r) {
+    function y(e, r) {
         if (e == null) return {};
         var t = {};
-        var o = Object.keys(e);
-        var n, i;
-        for (i = 0; i < o.length; i++) {
-            n = o[i];
-            if (r.indexOf(n) >= 0) continue;
-            t[n] = e[n];
+        var n = Object.keys(e);
+        var o, i;
+        for (i = 0; i < n.length; i++) {
+            o = n[i];
+            if (r.indexOf(o) >= 0) continue;
+            t[o] = e[o];
         }
         return t;
     }
-    var d = {
+    var v = {
         elementRef: i().oneOfType([ i().func, i().object ]),
+        decorative: i().bool,
         orientation: i().oneOf([ "horizontal", "vertical" ])
     };
-    function y(e) {
-        var r = e.elementRef, t = e.orientation, n = t === void 0 ? "horizontal" : t, i = p(e, [ "elementRef", "orientation" ]);
+    function O(e) {
+        var r = e.elementRef, t = e.decorative, o = t === void 0 ? false : t, i = e.orientation, a = i === void 0 ? "horizontal" : i, l = d(e, [ "elementRef", "decorative", "orientation" ]);
         // @docs-props-type DividerPropsBase
-                
-        return o().createElement(c, u({
+                var c = p({
             "data-test": "divider",
             ref: r,
-            "aria-orientation": n,
-            $orientation: n
-        }, i));
+            $orientation: a
+        }, l);
+ // aria-orientation is not needed when decorative and div is used to have no semantics
+                if (o) {
+            
+            return n().createElement(u, s({
+                as: "div"
+            }, c));
+        }
+        
+        return n().createElement(u, s({
+            "aria-orientation": a
+        }, c));
     }
-    y.propTypes = d;
-    /* harmony default export */    const v = y;
+    O.propTypes = v;
+    /* harmony default export */    const j = O;
     // CONCATENATED MODULE: ./src/Divider/index.ts
     module.exports = r;
     /******/})();

package/DualListbox.js

@@ -414,7 +414,7 @@
         enterprise: (0, _.css)([ "&:hover{background:", ";}" ], N.variables.backgroundColorHover)
     }));
     var X = D()(U()).withConfig({
-        displayName: "OptionStyles__StyledSwtich",
+        displayName: "OptionStyles__StyledSwitch",
         componentId: "q275d9-1"
     })([ "padding-left:", ";" ], N.variables.spacingSmall);
     var G = D().div.withConfig({