@splunk/react-ui 5.4.0 → 5.6.0

package/Multiselect.js

@@ -63,8 +63,8 @@
         e.d(n, {
         Divider: () => /* reexport */ u.Divider,
         Heading: () => /* reexport */ u.Heading,
-        Option: () => /* reexport */ M,
-        default: () => /* reexport */ et
+        Option: () => /* reexport */ h,
+        default: () => /* reexport */ an
     });
     // CONCATENATED MODULE: external "react"
     const r = require("react");
@@ -78,1715 +78,128 @@
     // CONCATENATED MODULE: external "@splunk/react-ui/Menu"
     const u = require("@splunk/react-ui/Menu");
     // CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
-    const c = require("@splunk/react-ui/useControlled");
-    var s =  e.n(c);
+    const s = require("@splunk/react-ui/useControlled");
+    var c =  e.n(s);
     // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
     const d = require("@splunk/ui-utils/i18n");
-    // CONCATENATED MODULE: ./src/Select/OptionBase.tsx
-    function f(e) {
-        "@babel/helpers - typeof";
-        return f = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
-            return typeof e;
-        } : function(e) {
-            return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
-        }, f(e);
-    }
-    function p() {
-        return p = Object.assign ? Object.assign.bind() : function(e) {
-            for (var n = 1; n < arguments.length; n++) {
-                var r = arguments[n];
-                for (var t in r) {
-                    ({}).hasOwnProperty.call(r, t) && (e[t] = r[t]);
-                }
-            }
-            return e;
-        }, p.apply(null, arguments);
-    }
-    function v(e, n) {
-        var r = Object.keys(e);
-        if (Object.getOwnPropertySymbols) {
-            var t = Object.getOwnPropertySymbols(e);
-            n && (t = t.filter((function(n) {
-                return Object.getOwnPropertyDescriptor(e, n).enumerable;
-            }))), r.push.apply(r, t);
-        }
-        return r;
-    }
-    function b(e) {
-        for (var n = 1; n < arguments.length; n++) {
-            var r = null != arguments[n] ? arguments[n] : {};
-            n % 2 ? v(Object(r), !0).forEach((function(n) {
-                m(e, n, r[n]);
-            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : v(Object(r)).forEach((function(n) {
-                Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
-            }));
-        }
-        return e;
-    }
-    function m(e, n, r) {
-        return (n = y(n)) in e ? Object.defineProperty(e, n, {
-            value: r,
-            enumerable: !0,
-            configurable: !0,
-            writable: !0
-        }) : e[n] = r, e;
-    }
-    function y(e) {
-        var n = g(e, "string");
-        return "symbol" == f(n) ? n : n + "";
-    }
-    function g(e, n) {
-        if ("object" != f(e) || !e) return e;
-        var r = e[Symbol.toPrimitive];
-        if (void 0 !== r) {
-            var t = r.call(e, n || "default");
-            if ("object" != f(t)) return t;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return ("string" === n ? String : Number)(e);
-    }
-    function h(e, n) {
-        if (null == e) return {};
-        var r, t, o = O(e, n);
-        if (Object.getOwnPropertySymbols) {
-            var a = Object.getOwnPropertySymbols(e);
-            for (t = 0; t < a.length; t++) {
-                r = a[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
-            }
-        }
-        return o;
-    }
-    function O(e, n) {
-        if (null == e) return {};
-        var r = {};
-        for (var t in e) {
-            if ({}.hasOwnProperty.call(e, t)) {
-                if (-1 !== n.indexOf(t)) continue;
-                r[t] = e[t];
-            }
-        }
-        return r;
-    }
-    var S = {
-        /** @private */
-        active: i().bool,
-        children: i().node,
-        description: i().string,
-        descriptionPosition: i().oneOf([ "right", "bottom" ]),
-        disabled: i().bool,
-        elementRef: i().oneOfType([ i().func, i().object ]),
-        hidden: i().bool,
-        icon: i().node,
-        label: i().string.isRequired,
-        /**
-   * @private Passed down from <BaseSelect>
-   */
-        multiple: i().bool,
-        matchRanges: i().arrayOf(i().shape({
-            start: i().number.isRequired,
-            end: i().number.isRequired
-        })),
-        /** @private */
-        onClick: i().func,
-        /** @private */
-        role: i().oneOf([ "menuitemcheckbox", "option" ]),
-        /** @private */
-        selected: i().oneOfType([ i().bool, i().oneOf([ "some" ]) ]),
-        truncate: i().bool,
-        value: i().oneOfType([ i().string, i().number, i().bool ]).isRequired
-    };
-    /**
- * An option within a `Multiselect`.
- */    function w(e) {
-        var n = e.children, o = e.descriptionPosition, a = o === void 0 ? "bottom" : o, l = e.disabled, i = e.elementRef, c = e.icon, s = e.label, d = e.multiple, f = e.onClick, v = e.role, m = v === void 0 ? "option" : v, y = e.value, g = h(e, [ "children", "descriptionPosition", "disabled", "elementRef", "icon", "label", "multiple", "onClick", "role", "value" ]);
-        // @docs-props-type OptionPropsBase
-                var O = (0, r.useCallback)((function(e) {
-            if (!l) {
-                f === null || f === void 0 ? void 0 : f(e, {
-                    value: y
-                });
-            }
-        }), [ l, f, y ]);
-        var S = y.toString();
-        var w = b({
-            descriptionPosition: a,
-            disabled: l ? "disabled" : undefined
-        }, g);
-        
-        return t().createElement(u.Item, p({
-            "data-test-value": y,
-            "data-test": "option",
-            elementRef: i
-        }, w, {
-            selectable: true,
-            selectableAppearance: d ? "checkbox" : "checkmark",
-            startAdornment: c,
-            onClick: O,
-            role: m,
-            value: S
-        }), n || s);
-    }
-    w.propTypes = S;
-    w.type = u.Item;
- // For components to distinguish if their children are Options or Headings/Dividers
-    /* harmony default export */    const C = w;
-    // CONCATENATED MODULE: ./src/Multiselect/Option.tsx
-    function k() {
-        return k = Object.assign ? Object.assign.bind() : function(e) {
-            for (var n = 1; n < arguments.length; n++) {
-                var r = arguments[n];
-                for (var t in r) {
-                    ({}).hasOwnProperty.call(r, t) && (e[t] = r[t]);
-                }
-            }
-            return e;
-        }, k.apply(null, arguments);
-    }
-    function j(e, n) {
-        if (null == e) return {};
-        var r, t, o = x(e, n);
-        if (Object.getOwnPropertySymbols) {
-            var a = Object.getOwnPropertySymbols(e);
-            for (t = 0; t < a.length; t++) {
-                r = a[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
-            }
-        }
-        return o;
-    }
-    function x(e, n) {
-        if (null == e) return {};
-        var r = {};
-        for (var t in e) {
-            if ({}.hasOwnProperty.call(e, t)) {
-                if (-1 !== n.indexOf(t)) continue;
-                r[t] = e[t];
-            }
-        }
-        return r;
-    }
-    // eslint-disable-next-line no-relative-imports-of-published -- TODO(SUI-8264): Ordinarily we do not want to cross component boundaries relatively like this but OptionBase is unpublished therefore can't be imported externally/aliased with @splunk... which prevents risk of mixed relative/external imports in bundles.
-        var P = {
-        /** @private */
-        active: i().bool,
-        children: i().node,
-        /**
-   * @private this is passed down from Multiselect.
-   */
-        compact: i().bool,
-        description: i().string,
-        descriptionPosition: i().oneOf([ "right", "bottom" ]),
-        disabled: i().bool,
-        elementRef: i().oneOfType([ i().func, i().object ]),
-        hidden: i().bool,
-        icon: i().node,
-        label: i().string.isRequired,
-        matchRanges: i().arrayOf(i().shape({
-            start: i().number.isRequired,
-            end: i().number.isRequired
-        })),
-        /** @private */
-        onClick: i().func,
-        /** @private */
-        role: i().oneOf([ "menuitemcheckbox", "option" ]),
-        /** @private */
-        selected: i().bool,
-        selectedAppearance: i().oneOf([ "info", "success", "warning", "error" ]),
-        selectedBackgroundColor: i().string,
-        selectedForegroundColor: i().string,
-        truncate: i().bool,
-        value: i().oneOfType([ i().string, i().number, i().bool ]).isRequired
-    };
-    /**
- * An option within a `Multiselect`.
- */    function E(e) {
-        var n = e.compact, r = e.children, o = e.description, a = e.descriptionPosition, l = a === void 0 ? "bottom" : a, i = e.disabled, u = e.elementRef, c = e.hidden, s = e.icon, d = e.label, f = e.matchRanges, p = e.role, v = e.selected, b = e.truncate, m = e.value, y = j(e, [ "compact", "children", "description", "descriptionPosition", "disabled", "elementRef", "hidden", "icon", "label", "matchRanges", "role", "selected", "truncate", "value" ]);
-        // @docs-props-type OptionPropsBase
-        // selectedAppearance, selectedBackgroundColor, and selectedForegroundColor are not used directly by the Option component.
-        // They are consumed by the parent component (Multiselect-Normal) to render the Chip, so they are not included in the above prop list.
-                
-        return t().createElement(C, k({
-            description: o,
-            descriptionPosition: l,
-            disabled: i,
-            elementRef: u,
-            hidden: c,
-            icon: s,
-            label: d,
-            matchRanges: f,
-            role: p,
-            selected: v,
-            truncate: b,
-            value: m
-        }, y, {
-            multiple: n
-        }), r || d);
-    }
-    E.propTypes = P;
-    /* harmony default export */    const M = E;
-    // CONCATENATED MODULE: external "lodash/castArray"
-    const R = require("lodash/castArray");
-    var A =  e.n(R);
-    // CONCATENATED MODULE: external "lodash/find"
-    const I = require("lodash/find");
-    var B =  e.n(I);
-    // CONCATENATED MODULE: external "lodash/forEachRight"
-    const N = require("lodash/forEachRight");
-    var V =  e.n(N);
-    // CONCATENATED MODULE: external "lodash/includes"
-    const D = require("lodash/includes");
-    var L =  e.n(D);
-    // CONCATENATED MODULE: external "lodash/memoize"
-    const q = require("lodash/memoize");
-    var T =  e.n(q);
-    // CONCATENATED MODULE: external "lodash/pick"
-    const F = require("lodash/pick");
-    var _ =  e.n(F);
-    // CONCATENATED MODULE: external "lodash/uniq"
-    const K = require("lodash/uniq");
-    var H =  e.n(K);
-    // CONCATENATED MODULE: external "lodash/without"
-    const $ = require("lodash/without");
-    var z =  e.n($);
-    // CONCATENATED MODULE: external "@splunk/react-icons/CaretSmallDown"
-    const W = require("@splunk/react-icons/CaretSmallDown");
-    var U =  e.n(W);
-    // CONCATENATED MODULE: external "@splunk/react-icons/Magnifier"
-    const X = require("@splunk/react-icons/Magnifier");
-    var G =  e.n(X);
-    // CONCATENATED MODULE: external "@splunk/react-ui/Dropdown"
-    const J = require("@splunk/react-ui/Dropdown");
-    var Q =  e.n(J);
-    // CONCATENATED MODULE: external "@splunk/react-ui/Link"
-    const Y = require("@splunk/react-ui/Link");
-    var Z =  e.n(Y);
-    // CONCATENATED MODULE: external "@splunk/react-ui/ResultsMenu"
-    const ee = require("@splunk/react-ui/ResultsMenu");
-    var ne =  e.n(ee);
-    // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
-    const re = require("@splunk/react-ui/ScreenReaderContent");
-    var te =  e.n(re);
-    // CONCATENATED MODULE: external "@splunk/react-ui/Text"
-    const oe = require("@splunk/react-ui/Text");
-    var ae =  e.n(oe);
-    // CONCATENATED MODULE: external "@splunk/react-ui/usePrevious"
-    const le = require("@splunk/react-ui/usePrevious");
-    var ie =  e.n(le);
-    // CONCATENATED MODULE: external "@splunk/ui-utils/filter"
-    const ue = require("@splunk/ui-utils/filter");
-    // CONCATENATED MODULE: external "@splunk/ui-utils/id"
-    const ce = require("@splunk/ui-utils/id");
-    // CONCATENATED MODULE: external "@splunk/ui-utils/scroll"
-    const se = require("@splunk/ui-utils/scroll");
-    // CONCATENATED MODULE: ./src/Select/SelectAllOption.tsx
-    function de(e) {
-        "@babel/helpers - typeof";
-        return de = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
-            return typeof e;
-        } : function(e) {
-            return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
-        }, de(e);
-    }
-    function fe() {
-        return fe = Object.assign ? Object.assign.bind() : function(e) {
-            for (var n = 1; n < arguments.length; n++) {
-                var r = arguments[n];
-                for (var t in r) {
-                    ({}).hasOwnProperty.call(r, t) && (e[t] = r[t]);
-                }
-            }
-            return e;
-        }, fe.apply(null, arguments);
-    }
-    function pe(e, n) {
-        if (null == e) return {};
-        var r, t, o = ve(e, n);
-        if (Object.getOwnPropertySymbols) {
-            var a = Object.getOwnPropertySymbols(e);
-            for (t = 0; t < a.length; t++) {
-                r = a[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
-            }
-        }
-        return o;
-    }
-    function ve(e, n) {
-        if (null == e) return {};
-        var r = {};
-        for (var t in e) {
-            if ({}.hasOwnProperty.call(e, t)) {
-                if (-1 !== n.indexOf(t)) continue;
-                r[t] = e[t];
-            }
-        }
-        return r;
-    }
-    function be(e, n) {
-        var r = Object.keys(e);
-        if (Object.getOwnPropertySymbols) {
-            var t = Object.getOwnPropertySymbols(e);
-            n && (t = t.filter((function(n) {
-                return Object.getOwnPropertyDescriptor(e, n).enumerable;
-            }))), r.push.apply(r, t);
-        }
-        return r;
-    }
-    function me(e) {
-        for (var n = 1; n < arguments.length; n++) {
-            var r = null != arguments[n] ? arguments[n] : {};
-            n % 2 ? be(Object(r), !0).forEach((function(n) {
-                ye(e, n, r[n]);
-            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : be(Object(r)).forEach((function(n) {
-                Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
-            }));
-        }
-        return e;
-    }
-    function ye(e, n, r) {
-        return (n = ge(n)) in e ? Object.defineProperty(e, n, {
-            value: r,
-            enumerable: !0,
-            configurable: !0,
-            writable: !0
-        }) : e[n] = r, e;
-    }
-    function ge(e) {
-        var n = he(e, "string");
-        return "symbol" == de(n) ? n : n + "";
-    }
-    function he(e, n) {
-        if ("object" != de(e) || !e) return e;
-        var r = e[Symbol.toPrimitive];
-        if (void 0 !== r) {
-            var t = r.call(e, n || "default");
-            if ("object" != de(t)) return t;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return ("string" === n ? String : Number)(e);
-    }
-    var Oe = me(me({}, C.propTypes), {}, {
-        totalCount: i().number,
-        // unlike OptionBase, there's a default value for this prop
-        value: i().string
-    });
-    function Se(e) {
-        var n = e.active, r = e.elementRef, o = e.id, a = e.label, l = e.onClick, i = e.selected, u = e.totalCount, c = e.value, s = c === void 0 ? "selectAll" : c, d = pe(e, [ "active", "elementRef", "id", "label", "onClick", "selected", "totalCount", "value" ]);
-        // @docs-props-type SelectAllOptionPropsBase
-        // When toggle is changed the total count is not displayed anymore so the count is now shown in the Select all menu item
-                var f = u != null ? " (".concat(u === null || u === void 0 ? void 0 : u.toString(), ")") : "";
-        
-        return t().createElement(C, fe({
-            active: n,
-            elementRef: r,
-            "aria-keyshortcuts": "Control+A",
-            "data-test": "select-all",
-            description: "".concat(f, " Ctrl-a"),
-            descriptionPosition: "right",
-            id: o,
-            key: "selectAll",
-            multiple: true,
-            label: a,
-            onClick: l,
-            selected: i,
-            role: "menuitemcheckbox",
-            value: s
-        }, d));
-    }
-    Se.propTypes = Oe;
-    /* harmony default export */    const we = Se;
-    // CONCATENATED MODULE: external "styled-components"
-    const Ce = require("styled-components");
-    var ke =  e.n(Ce);
-    // CONCATENATED MODULE: external "@splunk/react-ui/Button"
-    const je = require("@splunk/react-ui/Button");
-    var xe =  e.n(je);
-    // CONCATENATED MODULE: external "@splunk/react-ui/Divider"
-    const Pe = require("@splunk/react-ui/Divider");
-    var Ee =  e.n(Pe);
-    // CONCATENATED MODULE: external "@splunk/themes"
-    const Me = require("@splunk/themes");
-    // CONCATENATED MODULE: ./src/Select/SelectBaseStyles.ts
-    var Re = ke()(xe()).withConfig({
-        displayName: "SelectBaseStyles__StyledButton",
-        componentId: "sc-16cj7sk-0"
-    })([ "&[data-inline]{width:", ";}", "" ], (function(e) {
-        var n = e.$multiple;
-        return n ? "400px" : "auto";
-    }), (function(e) {
-        var n = e.$multiple;
-        return !n && "flex-grow: 0;";
-    }));
-    var Ae = ke().span.withConfig({
-        displayName: "SelectBaseStyles__StyledLinkIcon",
-        componentId: "sc-16cj7sk-1"
-    })([ "padding-right:", ";" ], Me.variables.spacingXSmall);
-    var Ie = ke().span.withConfig({
-        displayName: "SelectBaseStyles__StyledLinkCaret",
-        componentId: "sc-16cj7sk-2"
-    })([ "padding-left:", ";" ], Me.variables.spacingXSmall);
-    var Be = ke().div.withConfig({
-        displayName: "SelectBaseStyles__StyledFilter",
-        componentId: "sc-16cj7sk-3"
-    })([ "padding:", " ", " ", ";min-width:160px;" ], Me.variables.spacingLarge, Me.variables.spacingLarge, Me.variables.spacingSmall);
-    var Ne = ke().span.withConfig({
-        displayName: "SelectBaseStyles__StyledCount",
-        componentId: "sc-16cj7sk-4"
-    })([ "padding-right:", ";" ], Me.variables.spacingXSmall);
-    var Ve = ke()(Z()).withConfig({
-        displayName: "SelectBaseStyles__StyledControlsLink",
-        componentId: "sc-16cj7sk-5"
-    })([ "", ";" ], (function(e) {
-        var n = e.$disabled;
-        return n && (0, Ce.css)([ "color:", ";" ], Me.variables.contentColorDisabled);
-    }));
-    var De = ke().div.withConfig({
-        displayName: "SelectBaseStyles__StyledToggleAllControls",
-        componentId: "sc-16cj7sk-6"
-    })([ "", ";gap:", ";padding:", " ", " ", ";" ], Me.mixins.reset("flex"), Me.variables.spacingMedium, Me.variables.spacingXSmall, Me.variables.spacingLarge, Me.variables.spacingSmall);
-    var Le = ke()(Ee()).withConfig({
-        displayName: "SelectBaseStyles__StyledControlsDivider",
-        componentId: "sc-16cj7sk-7"
-    })([ "border-color:", ";" ], Me.variables.borderColor);
-    // CONCATENATED MODULE: ./src/utils/fuzzyMatch.ts
-    // A utility for matching keyboard characters to list values
-    var qe = function e(n, r) {
-        return n ? n.label.charAt(r).toLowerCase() : "";
-    };
-    var Te = function e(n, r) {
-        if (!n.length) {
-            return n;
-        }
-        var t = null;
-        var o = false;
-        var a = n.filter((function(e) {
-            var n = qe(e, r.index);
-            if (n === r.value) {
-                o = true;
-                return true;
-            }
-            // If we haven't found a match yet, keep track of the next closest match.
-            // Secondary matching looks for the closest character of a higher value, and failing that, closest of a lower value.
-                        if (!o) {
-                var a = qe(t, r.index);
-                if (!a) {
-                    t = e;
-                } else if (n > r.value) {
-                    if (a < r.value) {
-                        t = e;
-                    } else if (a > n) {
-                        t = e;
-                    }
-                } else if (n > a) {
-                    t = e;
-                }
-            }
-            return false;
-        }));
-        return a.length === 0 && t ? [ t ] : a;
-    };
-    // CONCATENATED MODULE: ./src/utils/ssrDocument.ts
-    /* eslint-disable @typescript-eslint/no-empty-function */
-    var Fe = {
-        body: {
-            appendChild: function e() {
-                return [];
-            }
-        },
-        addEventListener: function e() {},
-        removeEventListener: function e() {},
-        activeElement: {
-            blur: function e() {},
-            nodeName: ""
-        },
-        querySelector: function e() {
-            return null;
-        },
-        querySelectorAll: function e() {
-            return [];
-        },
-        getElementById: function e() {
-            return null;
-        },
-        createEvent: function e() {
-            return {
-                initEvent: function e() {}
-            };
-        },
-        createElement: function e() {
-            return {
-                children: [],
-                childNodes: [],
-                style: {},
-                setAttribute: function e() {},
-                getElementsByTagName: function e() {
-                    return [];
-                }
-            };
-        },
-        createElementNS: function e() {
-            return {};
-        },
-        importNode: function e() {
-            return null;
-        },
-        location: {
-            hash: "",
-            host: "",
-            hostname: "",
-            href: "",
-            origin: "",
-            pathname: "",
-            protocol: "",
-            search: ""
-        }
-    };
-    function _e() {
-        var e = typeof document !== "undefined" ? document : Fe;
-        return e;
-    }
-    var Ke = _e();
-    /* harmony default export */    const He = /* unused pure expression or super */ null && Ke;
-    // CONCATENATED MODULE: ./src/utils/ssrWindow.ts
-    /* eslint-disable @typescript-eslint/no-empty-function */
-    var $e = {
-        document: Fe,
-        navigator: {
-            userAgent: ""
-        },
-        location: {
-            hash: "",
-            host: "",
-            hostname: "",
-            href: "",
-            origin: "",
-            pathname: "",
-            protocol: "",
-            search: ""
-        },
-        history: {
-            replaceState: function e() {},
-            pushState: function e() {},
-            go: function e() {},
-            back: function e() {}
-        },
-        CustomEvent: function e() {
-            return this;
-        },
-        addEventListener: function e() {},
-        removeEventListener: function e() {},
-        getComputedStyle: function e() {
-            return {
-                getPropertyValue: function e() {
-                    return "";
-                }
-            };
-        },
-        Image: function e() {},
-        Date: function e() {},
-        screen: {},
-        setTimeout: function e() {},
-        clearTimeout: function e() {},
-        matchMedia: function e() {
-            return {};
-        },
-        requestAnimationFrame: function e(n) {
-            if (typeof setTimeout === "undefined") {
-                n();
-                return null;
-            }
-            return setTimeout(n, 0);
-        },
-        cancelAnimationFrame: function e(n) {
-            if (typeof setTimeout === "undefined") {
-                return;
-            }
-            clearTimeout(n);
-        }
-    };
-    function ze() {
-        var e = typeof window !== "undefined" ? window : $e;
-        return e;
-    }
-    var We = ze();
-    /* harmony default export */    const Ue = /* unused pure expression or super */ null && We;
-    // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
-    /**
- * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
- *
- * @param ref - The React callback or object ref. Can be `null` or `undefined`.
- * @param current - The new value of the ref.
- */
-    function Xe(e, n) {
-        if (e) {
-            if (typeof e === "function") {
-                e(n);
-            } else {
-                // the public signature of this util uses React.Ref<T> to mirror the way React types refs.
-                // the intention here is to signal "we will take care of setting 'current', not you".
-                e.current = n;
- // eslint-disable-line no-param-reassign
-                        }
-        }
-    }
-    // CONCATENATED MODULE: ./src/Select/SelectBase.tsx
-    function Ge(e) {
-        return Ye(e) || Qe(e) || rn(e) || Je();
-    }
-    function Je() {
-        throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-    }
-    function Qe(e) {
-        if ("undefined" != typeof Symbol && null != e[Symbol.iterator] || null != e["@@iterator"]) return Array.from(e);
-    }
-    function Ye(e) {
-        if (Array.isArray(e)) return tn(e);
-    }
-    function Ze() {
-        return Ze = Object.assign ? Object.assign.bind() : function(e) {
-            for (var n = 1; n < arguments.length; n++) {
-                var r = arguments[n];
-                for (var t in r) {
-                    ({}).hasOwnProperty.call(r, t) && (e[t] = r[t]);
-                }
-            }
-            return e;
-        }, Ze.apply(null, arguments);
-    }
-    function en(e, n) {
-        return an(e) || on(e, n) || rn(e, n) || nn();
-    }
-    function nn() {
-        throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-    }
-    function rn(e, n) {
-        if (e) {
-            if ("string" == typeof e) return tn(e, n);
-            var r = {}.toString.call(e).slice(8, -1);
-            return "Object" === r && e.constructor && (r = e.constructor.name), "Map" === r || "Set" === r ? Array.from(e) : "Arguments" === r || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? tn(e, n) : void 0;
-        }
-    }
-    function tn(e, n) {
-        (null == n || n > e.length) && (n = e.length);
-        for (var r = 0, t = Array(n); r < n; r++) {
-            t[r] = e[r];
-        }
-        return t;
-    }
-    function on(e, n) {
-        var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-        if (null != r) {
-            var t, o, a, l, i = [], u = !0, c = !1;
-            try {
-                if (a = (r = r.call(e)).next, 0 === n) {
-                    if (Object(r) !== r) return;
-                    u = !1;
-                } else for (;!(u = (t = a.call(r)).done) && (i.push(t.value), i.length !== n); u = !0) {
-                }
-            } catch (e) {
-                c = !0, o = e;
-            } finally {
-                try {
-                    if (!u && null != r["return"] && (l = r["return"](), Object(l) !== l)) return;
-                } finally {
-                    if (c) throw o;
-                }
-            }
-            return i;
-        }
-    }
-    function an(e) {
-        if (Array.isArray(e)) return e;
-    }
-    function ln(e, n) {
-        if (null == e) return {};
-        var r, t, o = un(e, n);
-        if (Object.getOwnPropertySymbols) {
-            var a = Object.getOwnPropertySymbols(e);
-            for (t = 0; t < a.length; t++) {
-                r = a[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
-            }
-        }
-        return o;
-    }
-    function un(e, n) {
-        if (null == e) return {};
-        var r = {};
-        for (var t in e) {
-            if ({}.hasOwnProperty.call(e, t)) {
-                if (-1 !== n.indexOf(t)) continue;
-                r[t] = e[t];
-            }
-        }
-        return r;
-    }
-    function cn(e) {
-        "@babel/helpers - typeof";
-        return cn = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
-            return typeof e;
-        } : function(e) {
-            return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
-        }, cn(e);
-    }
-    function sn(e, n) {
-        var r = Object.keys(e);
-        if (Object.getOwnPropertySymbols) {
-            var t = Object.getOwnPropertySymbols(e);
-            n && (t = t.filter((function(n) {
-                return Object.getOwnPropertyDescriptor(e, n).enumerable;
-            }))), r.push.apply(r, t);
-        }
-        return r;
-    }
-    function dn(e) {
-        for (var n = 1; n < arguments.length; n++) {
-            var r = null != arguments[n] ? arguments[n] : {};
-            n % 2 ? sn(Object(r), !0).forEach((function(n) {
-                fn(e, n, r[n]);
-            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : sn(Object(r)).forEach((function(n) {
-                Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
-            }));
-        }
-        return e;
-    }
-    function fn(e, n, r) {
-        return (n = pn(n)) in e ? Object.defineProperty(e, n, {
-            value: r,
-            enumerable: !0,
-            configurable: !0,
-            writable: !0
-        }) : e[n] = r, e;
-    }
-    function pn(e) {
-        var n = vn(e, "string");
-        return "symbol" == cn(n) ? n : n + "";
-    }
-    function vn(e, n) {
-        if ("object" != cn(e) || !e) return e;
-        var r = e[Symbol.toPrimitive];
-        if (void 0 !== r) {
-            var t = r.call(e, n || "default");
-            if ("object" != cn(t)) return t;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return ("string" === n ? String : Number)(e);
-    }
-    var bn = {
-        allowKeyMatching: i().bool,
-        allowNewValues: i().bool,
-        animateLoading: i().bool,
-        appearance: i().oneOf([ "default", "link", "subtle" ]),
-        append: i().bool,
-        children: i().node,
-        defaultPlacement: i().oneOf([ "above", "below", "vertical" ]),
-        defaultValues: i().array,
-        describedBy: i().string,
-        disabled: i().bool,
-        elementRef: i().oneOfType([ i().func, i().object ]),
-        error: i().bool,
-        filter: i().oneOf([ false, true, "controlled" ]),
-        footerMessage: i().node,
-        inline: i().bool,
-        inputId: i().string,
-        inputRef: i().oneOfType([ i().func, i().object ]),
-        isLoadingOptions: i().bool,
-        labelledBy: i().string,
-        labelText: i().string,
-        loadingMessage: i().node,
-        menuStyle: i().object,
-        multiple: i().bool,
-        name: i().string,
-        noOptionsMessage: i().node,
-        onChange: i().func,
-        onClick: i().func,
-        onClose: i().func,
-        onFilterChange: i().func,
-        onOpen: i().func,
-        onScroll: i().func,
-        onScrollBottom: i().func,
-        /** @private. */
-        required: i().bool,
-        placeholder: i().string,
-        prefixLabel: i().string,
-        prepend: i().bool,
-        repositionMode: i().oneOf([ "none", "flip" ]),
-        selectAllAppearance: i().oneOf([ "buttongroup", "checkbox", "none" ]),
-        showSelectedValuesFirst: i().oneOf([ "nextOpen", "immediately", "never" ]),
-        suffixLabel: i().string,
-        tabConfirmsNewValue: i().bool,
-        toggle: i().node,
-        toggleContent: i().oneOf([ "optionChildren", "optionLabel" ]),
-        values: i().array,
-        /** @private. */
-        virtualization: i().number
-    };
-    var mn = T()((function(e) {
-        return [ e ];
-    }));
-    // preserve separate widths for single vs. multi mode
-        var yn = T()((function(e) {
-        var n = e.anchorWidth, r = e.isMultiple, t = e.maxHeight, o = e.menuStyle;
-        return r ? dn({
-            width: Math.max(n !== null && n !== void 0 ? n : 0, 200),
-            maxHeight: t
-        }, o) : dn({
-            minWidth: n !== null && n !== void 0 ? n : undefined,
-            maxWidth: Math.max(n !== null && n !== void 0 ? n : 0, 300),
-            maxHeight: t
-        }, o);
-    }));
-    var gn = [ "clickAway", "escapeKey", "offScreen", "tabKey", "toggleClick" ];
-    function hn(e) {
-        return e && a()(e.props, "value");
-    }
-    function On(e, n) {
-        return "".concat(cn(e), "-").concat(e, "-").concat(n);
-    }
-    var Sn = [ "append", "error", "prepend" ];
-    var wn = (0, d._)("No matches");
-    var Cn = (0, d._)("Select...");
-    var kn =  t().createElement(G(), null);
-    var jn = function e(n) {
-        var r = n.activeItemId, o = n.filterA11yId, a = n.filterKeyword, l = n.hasChildren, i = n.inputId, u = n.inputRef, c = n.menuListboxId, s = n.multiple, f = n.onClearAll, p = n.onSelectAll, v = n.onTextBlur, b = n.onTextChange, m = n.onTextFocus, y = n.onTextKeyDown, g = n.optionSelection, h = n.placement, O = n.selectAllAppearance, S = n.textHasFocus;
-        var w = (0, d._)("Select all options".concat(g.current === "all" ? " disabled" : ""));
-        var C = (0, d._)("Clear all options".concat(g.current === "none" ? " disabled" : ""));
-        // only visually disable these as opposed to fully disabling to avoid losing keyboard focus - see SUI-2731
-                var k =  t().createElement(De, {
-            key: "selectAll"
-        },  t().createElement(Ve, {
-            disabled: g.current === "all",
-            appearance: "standalone",
-            "aria-label": w,
-            onClick: p,
-            "data-test": "select-all",
-            tag: "button"
-        }, a ? (0, d._)("Select all Matches") : (0, d._)("Select all")),  t().createElement(Ve, {
-            disabled: g.current === "none",
-            appearance: "standalone",
-            "aria-label": C,
-            onClick: f,
-            "data-test": "clear-all",
-            tag: "button"
-        }, a ? (0, d._)("Clear all Matches") : (0, d._)("Clear all")));
-        
-        return t().createElement("div", {
-            key: "controls"
-        }, o &&  t().createElement(te(), {
-            id: o
-        }, (0, d._)("Type to filter")), h === "above" &&  t().createElement(Le, null),  t().createElement(Be, {
-            key: "filter",
-            "data-test": "filter"
-        },  t().createElement(ae(), {
-            value: a,
-            autoCapitalize: "off",
-            autoComplete: "off",
-            autoCorrect: "off",
-            spellCheck: false,
-            onChange: b,
-            onKeyDown: y,
-            onFocus: m,
-            onBlur: v,
-            placeholder: (0, d._)("filter"),
-            role: "combobox",
-            "aria-expanded": "true",
-            "aria-controls": c,
-            "aria-owns": S && l ? r : undefined,
-            "aria-label": (0, d._)("Filter"),
-            "aria-autocomplete": "list",
-            "aria-activedescendant": S && l ? r : undefined,
-            inputRef: u,
-            inputId: i,
-            canClear: true,
-            startAdornment: kn
-        })), s && l && O === "buttongroup" && k, h === "below" &&  t().createElement(Le, null));
-    };
-    var xn = function e(n) {
-        var r = n.prefixLabel, t = n.label, o = n.suffixLabel;
-        var a = t;
-        if (r) {
-            a = [ "".concat(r, ": ") ].concat(a);
-        }
-        if (o) {
-            a = A()(a).concat(" ".concat(o));
-        }
-        return a;
-    };
-    var Pn =  t().forwardRef((function(e, n) {
-        var o = e.appearance, a = o === void 0 ? "default" : o, l = e.append, i = e.children, u = e.currentValues, c = u === void 0 ? [] : u, s = e.describedBy, f = e.disabled, p = e.elementRef, v = e.error, b = e.inline, m = e.labelText, y = e.labelledBy, g = e.multiple, h = e.onClick, O = e.placeholder, S = e.prefixLabel, w = e.prepend, C = e.required, k = e.suffixLabel, j = e.toggle, x = e.toggleContent, P = ln(e, [ "appearance", "append", "children", "currentValues", "describedBy", "disabled", "elementRef", "error", "inline", "labelText", "labelledBy", "multiple", "onClick", "placeholder", "prefixLabel", "prepend", "required", "suffixLabel", "toggle", "toggleContent" ]);
-        var E;
-        var M;
-        var R = [];
-        // Generate buttonLabels
-                var A = r.Children.toArray(i);
-        var I = c.reduce((function(e, n, r, t) {
-            var o = B()(A, (function(e) {
-                return hn(e) && e.props.value === n;
-            }));
-            if (o) {
-                var a = o.props, l = a.children, i = a.icon, u = a.label;
-                var s = x !== "optionLabel" && l ? l : u;
-                e.push(s);
-                R.push(u);
-                // if not in multiple mode, add the icon
-                                if (!g && c.length === 1) {
-                    E = i;
-                }
-            } else if (g) {
-                // only add values that don't match an option in "multiple" mode to preserve old behaviour
-                e.push(n);
-                R.push(n.toString());
-            }
-            if (r < t.length - 1) {
-                e.push((0, d._)(", "));
-                R.push((0, d._)(", "));
-            }
-            return e;
-        }), []);
-        M = I;
-        // only apply prefix / suffix if the label is not empty
-                if (M.length > 0) {
-            // If there's more than one item selected, read out the selected total
-            // rather than reading out each selected item
-            R = xn({
-                prefixLabel: S,
-                label: M.length > 1 ? [ "".concat(c.length, " items selected") ] : R,
-                suffixLabel: k
-            });
-            M = xn({
-                prefixLabel: S,
-                label: M,
-                suffixLabel: k
-            });
-        }
-        // single <Select> behaviour is to show the placeholder if all parts of the label
-        // are empty strings so we replicate this behaviour here
-                if (M.length === 0 || !g && M.every((function(e) {
-            return e === "";
-        }))) {
-            M = mn(O);
-            R = M;
-        }
-        var N = Object.keys(P).includes("aria-labelledby");
-        var V = dn({
-            "aria-describedby": s,
-            "aria-label": y || N ? undefined : "".concat(m ? "".concat(m, ", ") : "").concat(R.join("")),
-            // aria-labelledby takes precedence over aria-label, so existence of both is redundant
-            "aria-labelledby": y,
-            "aria-required": C,
-            "data-select-appearance": a,
-            append: l,
-            prepend: w,
-            onClick: h,
-            role: "combobox",
-            disabled: f ? "disabled" : undefined,
-            elementRef: p,
-            error: v,
-            ref: n
-        }, P);
-        if (g) {
-            V["data-test-values"] = JSON.stringify(c);
-        } else {
-            var D = en(c, 1), L = D[0];
-            V["data-test-value"] = L;
-        }
-        if (j) {
-            
-            return (0, r.cloneElement)(j, V);
-        }
-        if (a === "link") {
-            
-            return t().createElement(Z(), Ze({
-                tag: "button",
-                appearance: "standalone"
-            }, V, {
-                "data-select-appearance": "link"
-            }), !!E &&  t().createElement(Ae, null, E), M || O,  t().createElement(Ie, null,  t().createElement(U(), null)));
-        }
-        // Using Button's secondary appearance as Select's default appearance.
-                var q = a === "default" ? "secondary" : a;
-        
-        return t().createElement(Re, Ze({}, V, {
-            $multiple: g,
-            appearance: q,
-            label: M,
-            error: v,
-            icon: E,
-            inline: b,
-            isMenu: true,
-            onClick: h
-        }, _()(P, Sn)), !!c.length && g &&  t().createElement(Ne, {
-            "data-role": "count"
-        }, "(", c.length, ")"));
-    }));
-    function En(e) {
-        var n = e.allowKeyMatching, o = n === void 0 ? true : n, a = e.animateLoading, l = e.appearance, i = l === void 0 ? "default" : l, c = e.append, f = e.allowNewValues, p = e.children, v = e.defaultPlacement, b = v === void 0 ? "vertical" : v, m = e.defaultValues, y = e.describedBy, g = e.disabled, h = e.elementRef, O = e.error, S = e.filter, w = e.footerMessage, k = e.inline, j = e.inputId, x = e.inputRef, P = e.isLoadingOptions, E = e.labelledBy, M = e.labelText, R = e.loadingMessage, A = e.menuStyle, I = A === void 0 ? {} : A, N = e.multiple, D = e.name, q = e.noOptionsMessage, T = q === void 0 ? wn : q, F = e.onChange, _ = e.onScroll, K = e.onScrollBottom, $ = e.onFilterChange, W = e.onClick, U = e.onClose, X = e.onOpen, G = e.required, J = e.placeholder, Y = J === void 0 ? Cn : J, Z = e.prefixLabel, re = e.prepend, te = e.repositionMode, oe = te === void 0 ? "flip" : te, ae = e.selectAllAppearance, le = ae === void 0 ? "buttongroup" : ae, de = e.showSelectedValuesFirst, fe = e.suffixLabel, pe = e.tabConfirmsNewValue, ve = e.values, be = e.virtualization, me = e.toggle, ye = e.toggleContent, ge = ye === void 0 ? "optionChildren" : ye, he = ln(e, [ "allowKeyMatching", "animateLoading", "appearance", "append", "allowNewValues", "children", "defaultPlacement", "defaultValues", "describedBy", "disabled", "elementRef", "error", "filter", "footerMessage", "inline", "inputId", "inputRef", "isLoadingOptions", "labelledBy", "labelText", "loadingMessage", "menuStyle", "multiple", "name", "noOptionsMessage", "onChange", "onScroll", "onScrollBottom", "onFilterChange", "onClick", "onClose", "onOpen", "required", "placeholder", "prefixLabel", "prepend", "repositionMode", "selectAllAppearance", "showSelectedValuesFirst", "suffixLabel", "tabConfirmsNewValue", "values", "virtualization", "toggle", "toggleContent" ]);
-        // @docs-props-type SelectBasePropsBase
-                var Oe = s()({
-            componentName: "SelectBase",
-            /* eslint-disable-next-line prefer-rest-params */
-            componentProps: arguments[0],
-            // see SUI-7028
-            defaultValuePropName: "defaultValues",
-            valuePropName: "values"
-        });
-        // states
-                var Se = (0, r.useState)((function() {
-            return {
-                activeItemId: (0, ce.createDOMID)("active-item"),
-                menuListboxId: (0, ce.createDOMID)("menu-listbox")
-            };
-        })), Ce = en(Se, 1), ke = Ce[0], je = ke.activeItemId, xe = ke.menuListboxId;
-        var Pe = (0, r.useState)(0), Ee = en(Pe, 2), Me = Ee[0], Re = Ee[1];
-        var Ae = (0, r.useState)(""), Ie = en(Ae, 2), Be = Ie[0], Ne = Ie[1];
-        var Ve = (0, r.useState)(false), De = en(Ve, 2), Le = De[0], qe = De[1];
-        var Fe = (0, r.useState)(false), _e = en(Fe, 2), Ke = _e[0], He = _e[1];
-        var $e = (0, r.useState)([]), We = en($e, 2), Ue = We[0], Je = We[1];
-        var Qe = (0, r.useState)(m || []), Ye = en(Qe, 2), nn = Ye[0], rn = Ye[1];
- // previous state
-                var tn = ie()(Me);
-        // refs
-                var on = (0, r.useRef)(null);
-        var an = (0, r.useRef)(null);
-        var un = (0, r.useRef)(null);
-        var cn = (0, r.useRef)([]);
-        var sn = (0, r.useRef)([]);
-        var dn = (0, r.useRef)(tn);
-        var fn = (0, r.useRef)();
-        var pn = (0, r.useRef)({});
-        var vn = (0, r.useRef)(0);
-        var bn = (0, r.useRef)([]);
-        var mn = (0, r.useRef)(null);
-        var Sn = (0, r.useRef)();
-        var kn = (0, r.useRef)(0);
-        var xn = (0, r.useRef)("none");
-        var En = (0, r.useState)(S ? (0, ce.createDOMID)("filter") : undefined), Mn = en(En, 1), Rn = Mn[0];
-        (0, r.useEffect)((function() {
-            if (false) {}
-        }), [ i, c, O, re ]);
-        var An = (0, r.useCallback)((function() {
-            var e = Oe ? ve : nn;
-            return N || e == null ? e : e.slice(0, 1);
-        }), [ Oe, N, ve, nn ]);
-        var In = (0, r.useCallback)((function() {
-            var e;
-            // in non-multiple mode, don't move values to the top of the list
-                        return N && de !== "never" ? (e = An()) !== null && e !== void 0 ? e : [] : [];
-        }), [ An, N, de ]);
-        var Bn = (0, r.useCallback)((function(e) {
-            var n = Be;
-            qe(true);
-            Je(In());
-            // SUI-3234: preserve existing behavior difference between <Select> and <Multiselect.Compact>
-                        if (N) {
-                Ne("");
-            }
-            if (n !== Be) {
-                $ === null || $ === void 0 ? void 0 : $(e, {
-                    keyword: Be
-                });
-            }
-        }), [ Be, In, N, $ ]);
-        (0, r.useEffect)((function() {
-            if (Le) {
-                X === null || X === void 0 ? void 0 : X();
-                if (mn.current && !S) {
-                    mn.current.focus();
-                } else {
-                    var e;
-                    Re((e = Sn.current) !== null && e !== void 0 ? e : 0);
-                }
-            }
-        }), [ X, Le, Ue, Be, S ]);
-        var Nn = (0, r.useCallback)((function() {
-            qe(false);
-            Re(0);
-            dn.current = null;
-            U === null || U === void 0 ? void 0 : U();
-        }), [ U ]);
-        var Vn = (0, r.useCallback)((function(e, n) {
-            var r;
-            var t = (r = An()) !== null && r !== void 0 ? r : [];
-            var o = t.indexOf(n);
-            var a;
-            if (N) {
-                if (o >= 0) {
-                    a = [].concat(Ge(t.slice(0, o)), Ge(t.slice(o + 1)));
-                } else {
-                    a = t.concat([ n ]);
-                }
-            } else {
-                // non-multiple mode must always have a value
-                a = [ n ];
-            }
-            var l = !Oe;
-            if (l) {
-                rn(a);
-            }
-            if (N) {
-                // in uncontrolled multiple mode, keep the menu open
-                if (l) {
-                    qe(true);
-                }
-            } else {
-                var i;
-                // non-multiple mode only supports a single selection
-                // so close the menu once a selection is made
-                                Nn({
-                    reason: "contentClick"
-                });
-                (i = on.current) === null || i === void 0 ? void 0 : i.focus();
-            }
-            F === null || F === void 0 ? void 0 : F(e, {
-                values: a,
-                name: D,
-                reason: "valueToggle"
-            });
-        }), [ An, Nn, Oe, N, D, F ]);
-        var Dn = function e() {
-            an.current = null;
-            cn.current = [];
-            if (un.current) {
-                clearTimeout(un.current);
-            }
-        };
-        var Ln = (0, r.useCallback)((function(e) {
-            var n;
-            // this doesn't make sense if we can't select multiple values
-                        if (!N) {
-                return;
-            }
-            var r = (n = An()) !== null && n !== void 0 ? n : [];
-            var o = H()(r.concat(bn.current));
-            o = t().Children.toArray(p).filter((function(e) {
-                return hn(e) && L()(o, e.props.value) && (!e.props.disabled || L()(r, e.props.value));
-            })).map((function(e) {
-                return e.props.value;
-            }));
-            if (!Oe) {
-                rn(o);
-            }
-            F === null || F === void 0 ? void 0 : F(e, {
-                values: o,
-                name: D,
-                reason: "selectAll"
-            });
-        }), [ p, An, Oe, N, D, F ]);
-        var qn = (0, r.useCallback)((function(e) {
-            var n;
-            // this doesn't make sense if we can't select multiple values
-                        if (!N) {
-                return;
-            }
-            var r = (n = An()) !== null && n !== void 0 ? n : [];
-            var o = z().apply(void 0, [ r ].concat(Ge(bn.current)));
-            // this will unselect all selected values unless those values are disabled or hidden by the filter
-                        var a = t().Children.toArray(p).filter((function(e) {
-                return hn(e) && (L()(r, e.props.value) && e.props.disabled || L()(o, e.props.value));
-            })).map((function(e) {
-                return e.props.value;
-            }));
-            if (!Oe) {
-                rn(a);
-            }
-            F === null || F === void 0 ? void 0 : F(e, {
-                values: a,
-                name: D,
-                reason: "clearAll"
-            });
-        }), [ p, An, Oe, N, D, F ]);
-        var Tn = (0, r.useCallback)((function(e) {
-            if (Le && !P) {
-                K === null || K === void 0 ? void 0 : K(e);
-            }
-        }), [ Le, P, K ]);
-        var Fn = (0, r.useCallback)((function(e) {
-            var n = e.key;
-            if (n === "Tab") {
-                if (pe && fn.current && vn.current <= 1) {
-                    e.preventDefault();
-                    Vn(e, fn.current);
-                }
-            }
-            if (e.shiftKey || e.metaKey || e.ctrlKey) {
-                if (n === "a" && (e.ctrlKey || e.metaKey)) {
-                    // handle control + A
-                    if (xn.current === "all") {
-                        qn(e);
-                    } else {
-                        Ln(e);
-                    }
-                }
-                return;
-            }
-            if (n === "ArrowDown") {
-                e.preventDefault();
-                Re(Math.min(Me + 1, le === "checkbox" ? vn.current : vn.current - 1));
-                if (p && K) {
-                    var t;
-                    var o = r.Children.toArray(p).length - (2 + ((t = An()) !== null && t !== void 0 ? t : []).length);
-                    if (Me === o) {
-                        Tn(e);
-                    }
-                }
-            }
-            if (n === "ArrowUp") {
-                e.preventDefault();
-                Re(Math.max(Me - 1, 0));
-            }
-            if (n === "Enter" && fn.current && Le) {
-                if (fn.current === "selectAll") {
-                    if (xn.current === "all") {
-                        qn(e);
-                    } else {
-                        Ln(e);
-                    }
-                } else {
-                    e.preventDefault();
-                    Vn(e, fn.current);
-                }
-            }
-        }), [ Me, p, An, qn, Tn, Ln, K, Le, le, pe, Vn ]);
-        var _n = (0, r.useCallback)((function(e, n) {
-            var r = n.value;
-            e.preventDefault();
-            if (!Le) {
-                return;
-            }
-            Vn(e, r);
-        }), [ Le, Vn ]);
-        var Kn = (0, r.useCallback)((function(e, n) {
-            var r = e.nativeEvent.key;
-            // Checking for a single character to avoid complications from double-byte languages and emojis.
-                        if (r.length === 1) {
-                var t = [];
-                var o = {
-                    index: 0,
-                    value: r
-                };
-                if (!an.current) {
-                    if (r === " ") {
-                        Dn();
-                        return;
-                    }
-                    t = Te(sn.current, o);
-                } else if (cn.current.length > 1) {
-                    o.index = an.current.index + 1;
-                    t = Te(cn.current, o);
-                }
-                if (t.length) {
-                    var a;
-                    var l = 0;
-                    // If the active option is a first character match, cycle to the next matching option.
-                                        if (o.index === 0 && t.length > 1) {
-                        var i = t.indexOf(sn.current[n]);
-                        if (i >= 0) {
-                            l = i === t.length - 1 ? 0 : i + 1;
-                        }
-                    }
-                    var u = t[l];
-                    var c = u.value, s = u.label;
-                    var d = pn.current[On(c, s)];
-                    d === null || d === void 0 ? void 0 : (a = d.focus) === null || a === void 0 ? void 0 : a.call(d);
-                }
-                cn.current = t;
-                an.current = o;
-                if (un.current) {
-                    clearTimeout(un.current);
-                }
-                un.current = setTimeout(Dn, 500);
-                e.preventDefault();
-                e.stopPropagation();
-            }
-        }), []);
-        var Hn = (0, r.useCallback)((function(e, n) {
-            var r = n.value;
-            Ne(r);
-            qe(true);
-            Re(0);
-            $ === null || $ === void 0 ? void 0 : $(e, {
-                keyword: r
-            });
-        }), [ $ ]);
-        var $n = (0, r.useCallback)((function() {
-            He(true);
-        }), []);
-        var zn = (0, r.useCallback)((function() {
-            He(false);
-        }), []);
-        var Wn = (0, r.useCallback)((function(e) {
-            if (dn.current !== Me) {
-                (0, se.scrollIntoViewIfNeeded)(e);
-            }
-        }), [ Me ]);
-        var Un = (0, r.useCallback)((function(e, n, r) {
-            if (r) {
-                mn.current = e;
-            }
-            if (e == null) {
-                delete pn.current[n];
-            } else {
-                pn.current[n] = e;
-            }
-        }), [ pn ]);
-        var Xn = (0, r.useCallback)((function(e) {
-            on.current = e;
-            Xe(h, e);
-        }), [ h, on ]);
-        var Gn = (0, r.useMemo)((function() {
-            var e;
-            return (e = An()) !== null && e !== void 0 ? e : [];
-        }), [ An ]);
-        var Jn = r.Children.toArray(p);
-        var Qn = Gn.some((function(e) {
-            var n = B()(Jn, (function(n) {
-                return hn(n) && n.props.value === e;
-            }));
-            return n && !n.props.disabled;
-        }));
-        var Yn = de === "immediately" ? In() : Ue;
-        var Zn = (0, r.useMemo)((function() {
-            vn.current = 0;
-            Sn.current = undefined;
-            kn.current = 0;
-            fn.current = undefined;
-            sn.current = [];
-            var e = function e(n, r) {
-                return function(e) {
-                    return Un(e, n, r);
-                };
-            };
-            var n;
-            var a = 0;
-            var l = false;
-            // used to avoid overwriting the selected item ref in multiple mode
-                        var i;
-            var c = r.Children.toArray(p).reduce((function(c, s, d) {
-                // ignore Headings and Dividers
-                if (!hn(s)) {
-                    c.push(s);
-                    return c;
-                }
-                var f = s.props, p = f.disabled, v = f.hidden, b = f.label, m = f.value;
- // Find out if the search string exactly matches a value
-                                if (m === Be) {
-                    n = true;
-                }
-                var y = Gn && Gn.indexOf(m) >= 0;
-                var g = !!y && !p && !i;
-                var h = o && !N && !S && !P && !K;
-                var O = On(m, b);
-                var w = -1;
-                if (h && !p && !v) {
-                    sn.current.push({
-                        label: b,
-                        value: m
-                    });
-                    w = sn.current.length - 1;
-                }
-                // Format the Menu.Item
-                                var C =  (0, r.cloneElement)(s, {
-                    elementRef: e(O, g),
-                    key: s.key || d,
-                    onClick: _n,
-                    onKeyDown: h ? function(e) {
-                        return Kn(e, w);
-                    } : undefined,
-                    selected: y,
-                    multiple: N,
-                    role: "option"
-                });
-                if (g) {
-                    i = true;
-                }
-                if (Yn && Yn.indexOf(m) >= 0) {
-                    if (a === 0) {
-                        c.splice(a, 0,  t().createElement(u.Divider, {
-                            key: "topDivider"
-                        }));
-                        l = true;
-                    }
-                    c.splice(a, 0, C);
-                    a += 1;
-                } else {
-                    c.push(C);
+    // CONCATENATED MODULE: external "@splunk/react-ui/SelectBase"
+    const f = require("@splunk/react-ui/SelectBase");
+    var p =  e.n(f);
+    // CONCATENATED MODULE: ./src/Multiselect/Option.tsx
+    function v() {
+        return v = Object.assign ? Object.assign.bind() : function(e) {
+            for (var n = 1; n < arguments.length; n++) {
+                var r = arguments[n];
+                for (var t in r) {
+                    ({}).hasOwnProperty.call(r, t) && (e[t] = r[t]);
                 }
-                return c;
-            }), []);
-            // In multiple mode, add missing items
-                        if (N) {
-                V()(Gn, (function(r) {
-                    var o = B()(c, (function(e) {
-                        return hn(e) && e.props && e.props.value === r;
-                    }));
-                    if (!o) {
-                        if (r === Be) {
-                            n = true;
-                        }
-                        var i = Yn && Yn.indexOf(r) >= 0;
-                        var s = Yn.length;
-                        if (a === 0) {
-                            c.splice(0, 0,  t().createElement(u.Divider, {
-                                key: "topDivider"
-                            }));
-                            a += 1;
-                            l = true;
-                        }
-                        var d = String(r);
-                        var f = On(r, d);
-                        c.splice(i ? 0 : s + 1, 0,  t().createElement(C, {
-                            elementRef: e(f),
-                            label: d,
-                            value: r,
-                            key: "missing-value-".concat(r),
-                            onClick: _n,
-                            multiple: N,
-                            selected: true
-                        }));
-                        if (i) {
-                            a += 1;
-                        }
-                    }
-                }));
             }
-            var s = S === "controlled";
-            // Filter the items
-                        var v = (0, ue.stringToKeywords)(Be);
-            c = s ? c : c.filter((function(e) {
-                if (hn(e)) {
-                    return (0, ue.testPhrase)(e.props.label, v);
-                }
-                return true;
- // Keep all headers and non-interactive options
-                        })).map((function(e) {
-                if (!hn(e)) {
-                    return e;
-                }
-                // highlight matched text
-                                var n = v && (0, ue.keywordLocations)(e.props.label, v);
-                
-                return (0, r.cloneElement)(e, {
-                    matchRanges: n || undefined
-                });
-            }));
-            // Add the option to add the new value
-                        if (f && !n && Be) {
-                var b = l ? a + 1 : a;
-                var m = "".concat(Be, " (new value)");
-                var y = On(Be, m);
-                c.splice(b, 0,  t().createElement(C, {
-                    elementRef: e(y),
-                    label: m,
-                    value: Be,
-                    key: "newValue",
-                    multiple: N,
-                    onClick: _n
-                }));
+            return e;
+        }, v.apply(null, arguments);
+    }
+    function b(e, n) {
+        if (null == e) return {};
+        var r, t, o = m(e, n);
+        if (Object.getOwnPropertySymbols) {
+            var a = Object.getOwnPropertySymbols(e);
+            for (t = 0; t < a.length; t++) {
+                r = a[t], -1 === n.indexOf(r) && {}.propertyIsEnumerable.call(e, r) && (o[r] = e[r]);
             }
-            // When selectAll is a menu item, add an offset so that activeItem accounts for the extra selectAll option.
-                        var g = le === "checkbox" && N && c.length > 1 ? 1 : 0;
-            var h = true;
-            // Highlight the selected Items and remove hidden
-                        c = c.reduce((function(e, n) {
-                // ignore Dividers & Headings
-                if (!hn(n)) {
-                    e.push(n);
-                    return e;
-                }
-                // Ignore any hidden items
-                                if (n.props && n.props.hidden) {
-                    return e;
-                }
-                if (n.props.selected && !n.props.disabled && Sn.current == null) {
-                    Sn.current = vn.current;
-                }
-                var t = g === Me;
-                g += 1;
-                vn.current += 1;
-                kn.current += n.props.selected ? 1 : 0;
-                if (n.key !== "newValue" && !n.props.disabled && !n.props.selected) {
-                    h = false;
-                }
-                if (!t || !Ke) {
-                    e.push(n);
-                    return e;
-                }
-                if (!n.props.disabled) {
-                    fn.current = n.props.value;
-                }
-                var o =  (0, r.cloneElement)(n, {
-                    active: t,
-                    elementRef: Wn,
-                    id: je
-                });
-                e.push(o);
-                return e;
-            }), []);
-            xn.current = kn.current === 0 && "none" || h && "all" || "some";
-            // add select all option
-                        if (le === "checkbox" && N && vn.current > 0) {
-                var O = Me === 0 && !!S;
-                var w;
-                if (xn.current === "all") {
-                    if (Be === "") {
-                        w = (0, d._)("Clear all");
-                    } else {
-                        w = (0, d._)("Clear all matches");
-                    }
-                } else if (Be === "") {
-                    w = (0, d._)("Select all");
-                } else {
-                    w = (0, d._)("Select all matches");
-                }
-                if (O) {
-                    fn.current = "selectAll";
-                }
-                c.unshift( t().createElement(we, {
-                    key: "select-all-option",
-                    active: O,
-                    elementRef: Wn,
-                    id: O ? je : undefined,
-                    onClick: xn.current === "all" ? qn : Ln,
-                    label: w,
-                    selected: xn.current === "all" || xn.current !== "none" && "some",
-                    totalCount: !!me && Gn.length || undefined,
-                    tabIndex: S ? -1 : undefined
-                }),  t().createElement(u.Divider, {
-                    key: "selectAllDivider"
-                }));
+        }
+        return o;
+    }
+    function m(e, n) {
+        if (null == e) return {};
+        var r = {};
+        for (var t in e) {
+            if ({}.hasOwnProperty.call(e, t)) {
+                if (-1 !== n.indexOf(t)) continue;
+                r[t] = e[t];
             }
-            bn.current = c.reduce((function(e, n) {
-                if (hn(n)) {
-                    e.push(n.props.value);
-                }
-                return e;
-            }), []);
-            return c;
-        }), [ Me, je, o, f, p, Gn, S, Be, Wn, qn, _n, Kn, Un, Ln, P, N, Yn, K, le, Ke, me ]);
-        var er = function e(n) {
-            var r = n.anchorWidth, o = n.maxHeight, l = n.placement, i = n.toggleId;
-            var u = yn({
-                anchorWidth: r,
-                isMultiple: N,
-                maxHeight: o,
-                menuStyle: I
-            });
-            var c = Gn.length > 0 && !Qn && !S ? 0 : undefined;
-            var s = {
-                "aria-multiselectable": N || undefined,
-                childrenStart: !!S &&  t().createElement(jn, {
-                    activeItemId: je,
-                    filterA11yId: Rn,
-                    filterKeyword: Be,
-                    hasChildren: Zn.some((function(e) {
-                        return hn(e);
-                    })),
-                    inputId: j,
-                    inputRef: x,
-                    menuListboxId: xe,
-                    multiple: N,
-                    onClearAll: qn,
-                    onSelectAll: Ln,
-                    onTextBlur: zn,
-                    onTextChange: Hn,
-                    onTextFocus: $n,
-                    onTextKeyDown: Fn,
-                    optionSelection: xn,
-                    placement: l,
-                    selectAllAppearance: le,
-                    textHasFocus: Ke
-                }),
-                focusMode: S ? "never" : undefined,
-                isLoading: P,
-                labelledBy: "".concat(Rn !== null && Rn !== void 0 ? Rn : "", " ").concat(i !== null && i !== void 0 ? i : "").trim(),
-                // NVDA ignores aria-labelledby attribute on popover, but reads it on menu
-                menuId: xe,
-                onScrollBottom: K ? Tn : undefined,
-                placement: l !== null && l !== void 0 ? l : undefined,
-                noOptionsMessage: T,
-                footerMessage: w,
-                animateLoading: a,
-                loadingMessage: R,
-                onScroll: _,
-                style: u,
-                tabIndex: c
-            };
-            if (be) {
+        }
+        return r;
+    }
+    var g = {
+        /** @private */
+        active: i().bool,
+        children: i().node,
+        /**
+   * @private this is passed down from Multiselect.
+   */
+        compact: i().bool,
+        description: i().string,
+        descriptionPosition: i().oneOf([ "right", "bottom" ]),
+        disabled: i().bool,
+        elementRef: i().oneOfType([ i().func, i().object ]),
+        hidden: i().bool,
+        icon: i().node,
+        label: i().string.isRequired,
+        matchRanges: i().arrayOf(i().shape({
+            start: i().number.isRequired,
+            end: i().number.isRequired
+        })),
+        /** @private */
+        onClick: i().func,
+        /** @private */
+        role: i().oneOf([ "menuitemcheckbox", "option" ]),
+        /** @private */
+        selected: i().bool,
+        selectedAppearance: i().oneOf([ "info", "success", "warning", "error" ]),
+        selectedBackgroundColor: i().string,
+        selectedForegroundColor: i().string,
+        truncate: i().bool,
+        value: i().oneOfType([ i().string, i().number, i().bool ]).isRequired
+    };
+    /**
+ * An option within a `Multiselect`.
+ */    function y(e) {
+        var n = e.compact, r = e.children, o = e.description, a = e.descriptionPosition, l = a === void 0 ? "bottom" : a, i = e.disabled, u = e.elementRef, s = e.hidden, c = e.icon, d = e.label, p = e.matchRanges, m = e.role, g = e.selected, y = e.truncate, h = e.value, O = b(e, [ "compact", "children", "description", "descriptionPosition", "disabled", "elementRef", "hidden", "icon", "label", "matchRanges", "role", "selected", "truncate", "value" ]);
+        // @docs-props-type OptionPropsBase
+        // selectedAppearance, selectedBackgroundColor, and selectedForegroundColor are not used directly by the Option component.
+        // They are consumed by the parent component (Multiselect-Normal) to render the Chip, so they are not included in the above prop list.
                 
-                return t().createElement(ee.VirtualizedResultsMenu, Ze({
-                    virtualization: be
-                }, s), Zn);
-            }
-            
-            return t().createElement(ne(), s, Zn);
-        };
-        var nr = (0, r.useMemo)((function() {
-            
-            return t().createElement(Pn, Ze({
-                appearance: i,
-                append: c,
-                currentValues: An(),
-                "data-test": N ? "multiselect" : "select",
-                describedBy: y,
-                disabled: g,
-                elementRef: Xn,
-                error: O,
-                inline: k,
-                labelText: M,
-                labelledBy: E,
-                multiple: N,
-                onClick: W,
-                placeholder: Y,
-                prefixLabel: Z,
-                prepend: re,
-                required: G,
-                suffixLabel: fe,
-                toggle: me,
-                toggleContent: ge
-            }, he), p);
-        }), [ i, c, An, N, y, g, O, Xn, k, M, E, W, Y, Z, re, G, fe, me, ge, he, p ]);
-        
-        return t().createElement(Q(), {
-            closeReasons: gn,
-            inputId: j,
-            "aria-labelledby": Rn,
-            toggle: nr,
-            onRequestOpen: Bn,
-            onRequestClose: Nn,
-            open: Le,
-            openWithArrowKeys: true,
-            repositionMode: oe,
-            defaultPlacement: b,
-            canCoverAnchor: ze().innerHeight < 500,
-            retainFocus: false,
-            takeFocus: Gn.length === 0 || Gn.length > 0 && !Qn || !!S
-        }, er);
+        return t().createElement(f.Option, v({
+            description: o,
+            descriptionPosition: l,
+            disabled: i,
+            elementRef: u,
+            hidden: s,
+            icon: c,
+            label: d,
+            matchRanges: p,
+            role: m,
+            selected: g,
+            truncate: y,
+            value: h
+        }, O, {
+            multiple: n
+        }), r || d);
     }
-    En.propTypes = bn;
-    En.componentType = "SelectBase";
-    En.Option = C;
-    En.Divider = u.Divider;
-    En.Heading = u.Heading;
-    /* harmony default export */    const Mn = En;
+    y.propTypes = g;
+    /* harmony default export */    const h = y;
     // CONCATENATED MODULE: ./src/utils/useDeprecate.tsx
-    var Rn = "is deprecated and will be removed in the next major version.";
-    var An = function e(n) {
+    var O = "is deprecated and will be removed in the next major version.";
+    var w = function e(n) {
         var r = n.additionalMessage, t = r === void 0 ? "" : r, o = n.componentName;
         useEffect((function() {
             if (false) {}
         }), [ t, o ]);
     };
-    var In = function e(n) {
+    var S = function e(n) {
         var r = n.additionalMessage, t = r === void 0 ? "" : r, o = n.componentName, a = n.propName, l = n.propValue;
         useEffect((function() {
             if (false) {}
         }), [ t, o, a, l ]);
     };
-    var Bn = function e(n) {
+    var C = function e(n) {
         var t = n.additionalMessage, o = t === void 0 ? "" : t, a = n.componentName, l = n.deprecatedPropValue, i = n.propName, u = n.propValue;
         (0, r.useEffect)((function() {
             if (false) {}
         }), [ o, a, i, u, l ]);
     };
     // CONCATENATED MODULE: ./src/Multiselect/Compact.tsx
-    function Nn() {
-        return Nn = Object.assign ? Object.assign.bind() : function(e) {
+    function M() {
+        return M = Object.assign ? Object.assign.bind() : function(e) {
             for (var n = 1; n < arguments.length; n++) {
                 var r = arguments[n];
                 for (var t in r) {
@@ -1794,11 +207,11 @@
                 }
             }
             return e;
-        }, Nn.apply(null, arguments);
+        }, M.apply(null, arguments);
     }
-    function Vn(e, n) {
+    function P(e, n) {
         if (null == e) return {};
-        var r, t, o = Dn(e, n);
+        var r, t, o = k(e, n);
         if (Object.getOwnPropertySymbols) {
             var a = Object.getOwnPropertySymbols(e);
             for (t = 0; t < a.length; t++) {
@@ -1807,7 +220,7 @@
         }
         return o;
     }
-    function Dn(e, n) {
+    function k(e, n) {
         if (null == e) return {};
         var r = {};
         for (var t in e) {
@@ -1818,9 +231,7 @@
         }
         return r;
     }
-    // eslint-disable-next-line no-relative-imports-of-published -- TODO(SUI-8264): Ordinarily we do not want to cross component boundaries relatively like this but OptionBase is unpublished therefore can't be imported externally/aliased with @splunk... which prevents risk of mixed relative/external imports in bundles.
-    // eslint-disable-next-line no-relative-imports-of-published -- TODO(SUI-8264): Ordinarily we do not want to cross component boundaries relatively like this but SelectBase is unpublished therefore can't be imported externally/aliased with @splunk... which prevents risk of mixed relative/external imports in bundles.
-        var Ln = {
+    var j = {
         allowNewValues: i().bool,
         animateLoading: i().bool,
         append: i().bool,
@@ -1840,6 +251,8 @@
         isLoadingOptions: i().bool,
         labelledBy: i().string,
         loadingMessage: i().node,
+        /** @private. */
+        maxLabelItems: i().number,
         menuStyle: i().object,
         name: i().string,
         noOptionsMessage: i().node,
@@ -1860,173 +273,217 @@
         virtualization: i().number
     };
     // TS: not typed controlled/uncontrolled, handled by Multiselect wrapper component
-        var qn = {};
-    var Tn = (0, d._)("No matches");
-    var Fn = (0, d._)("Select...");
-    function _n(e) {
-        var n = e.allowNewValues, o = e.animateLoading, a = e.append, l = e.children, i = e.controlledFilter, u = e.defaultPlacement, c = u === void 0 ? "vertical" : u, s = e.defaultValues, d = e.describedBy, f = e.disabled, p = e.elementRef, v = e.error, b = e.filter, m = e.footerMessage, y = e.inline, g = e.inputId, h = e.inputRef, O = e.isLoadingOptions, S = e.labelledBy, w = e.loadingMessage, k = e.menuStyle, j = k === void 0 ? qn : k, x = e.name, P = e.noOptionsMessage, E = P === void 0 ? Tn : P, M = e.onChange, R = e.onClose, A = e.onFilterChange, I = e.onOpen, B = e.onScroll, N = e.onScrollBottom, V = e.placeholder, D = V === void 0 ? Fn : V, L = e.prepend, q = e.repositionMode, T = e.selectAllAppearance, F = e.showSelectedValuesFirst, _ = F === void 0 ? "nextOpen" : F, K = e.tabConfirmsNewValue, H = e.values, $ = e.virtualization, z = Vn(e, [ "allowNewValues", "animateLoading", "append", "children", "controlledFilter", "defaultPlacement", "defaultValues", "describedBy", "disabled", "elementRef", "error", "filter", "footerMessage", "inline", "inputId", "inputRef", "isLoadingOptions", "labelledBy", "loadingMessage", "menuStyle", "name", "noOptionsMessage", "onChange", "onClose", "onFilterChange", "onOpen", "onScroll", "onScrollBottom", "placeholder", "prepend", "repositionMode", "selectAllAppearance", "showSelectedValuesFirst", "tabConfirmsNewValue", "values", "virtualization" ]);
+        var x = {};
+    var V = (0, d._)("No matches");
+    var N = (0, d._)("Select...");
+    function B(e) {
+        var n = e.allowNewValues, o = e.animateLoading, a = e.append, l = e.children, i = e.controlledFilter, u = e.defaultPlacement, s = u === void 0 ? "vertical" : u, c = e.defaultValues, d = e.describedBy, v = e.disabled, b = e.elementRef, m = e.error, g = e.filter, y = e.footerMessage, h = e.inline, O = e.inputId, w = e.inputRef, S = e.isLoadingOptions, k = e.labelledBy, j = e.loadingMessage, B = e.menuStyle, R = B === void 0 ? x : B, E = e.name, F = e.noOptionsMessage, I = F === void 0 ? V : F, A = e.onChange, q = e.onClose, D = e.onFilterChange, L = e.onOpen, T = e.onScroll, _ = e.onScrollBottom, H = e.placeholder, $ = H === void 0 ? N : H, z = e.prepend, K = e.repositionMode, W = e.selectAllAppearance, U = e.showSelectedValuesFirst, G = U === void 0 ? "nextOpen" : U, X = e.tabConfirmsNewValue, J = e.values, Q = e.virtualization, Y = P(e, [ "allowNewValues", "animateLoading", "append", "children", "controlledFilter", "defaultPlacement", "defaultValues", "describedBy", "disabled", "elementRef", "error", "filter", "footerMessage", "inline", "inputId", "inputRef", "isLoadingOptions", "labelledBy", "loadingMessage", "menuStyle", "name", "noOptionsMessage", "onChange", "onClose", "onFilterChange", "onOpen", "onScroll", "onScrollBottom", "placeholder", "prepend", "repositionMode", "selectAllAppearance", "showSelectedValuesFirst", "tabConfirmsNewValue", "values", "virtualization" ]);
         // @docs-props-type CompactPropsBase
-                Bn({
+                C({
             componentName: "Multiselect",
             deprecatedPropValue: "buttongroup",
             propName: "selectAllAppearance",
-            propValue: T
+            propValue: W
         });
-        var W = true;
-        if (b != null) {
-            W = b;
+        var Z = true;
+        if (g != null) {
+            Z = g;
             if (false) {}
         } else {
-            W = i ? "controlled" : true;
+            Z = i ? "controlled" : true;
         }
-        var U = {
-            children: r.Children.toArray(l).map((function(e) {
-                if (hn(e)) {
-                    var n;
-                    var r = (n = e.key) !== null && n !== void 0 ? n : "".concat(e.props.label, "-").concat(e.props.value);
-                    
-                    return t().createElement(C, Nn({
-                        key: r
-                    }, e.props, {
-                        multiple: true
-                    }));
-                }
-                return e;
-            })),
-            filter: W
-        };
-        if (s != null) {
-            U.defaultValues = s;
+        var ee = (0, r.useMemo)((function() {
+            return {
+                children: r.Children.toArray(l).map((function(e) {
+                    if ((0, f.isOption)(e)) {
+                        var n;
+                        var r = (n = e.key) !== null && n !== void 0 ? n : "".concat(e.props.label, "-").concat(e.props.value);
+                        
+                        return t().createElement(f.Option, M({
+                            key: r
+                        }, e.props, {
+                            multiple: true
+                        }));
+                    }
+                    return e;
+                })),
+                filter: Z
+            };
+        }), [ l, Z ]);
+        if (c != null) {
+            ee.defaultValues = c;
         }
-        if (H != null) {
-            U.values = H;
+        if (J != null) {
+            ee.values = J;
         }
         
-        return t().createElement(Mn, Nn({
+        return t().createElement(p(), M({
             allowNewValues: n,
             animateLoading: o,
             append: a,
             describedBy: d,
-            disabled: f,
-            defaultPlacement: c,
-            elementRef: p,
-            error: v,
-            footerMessage: m,
-            inline: y,
-            inputId: g,
-            inputRef: h,
-            isLoadingOptions: O,
-            labelledBy: S,
-            loadingMessage: w,
-            menuStyle: j,
-            name: x,
-            noOptionsMessage: E,
-            onChange: M,
-            onClose: R,
-            onFilterChange: A,
-            onOpen: I,
-            onScroll: B,
-            onScrollBottom: N,
-            placeholder: D,
-            prepend: L,
-            repositionMode: q,
-            selectAllAppearance: T,
-            showSelectedValuesFirst: _,
-            tabConfirmsNewValue: K,
-            virtualization: $
-        }, z, U, {
+            disabled: v,
+            defaultPlacement: s,
+            elementRef: b,
+            error: m,
+            footerMessage: y,
+            inline: h,
+            inputId: O,
+            inputRef: w,
+            isLoadingOptions: S,
+            labelledBy: k,
+            loadingMessage: j,
+            menuStyle: R,
+            name: E,
+            noOptionsMessage: I,
+            onChange: A,
+            onClose: q,
+            onFilterChange: D,
+            onOpen: L,
+            onScroll: T,
+            onScrollBottom: _,
+            placeholder: $,
+            prepend: z,
+            repositionMode: K,
+            selectAllAppearance: W,
+            showSelectedValuesFirst: G,
+            tabConfirmsNewValue: X,
+            virtualization: Q
+        }, Y, ee, {
             multiple: true
         }));
     }
-    _n.propTypes = Ln;
-    _n.Option = M;
-    _n.Divider = u.Divider;
-    _n.Heading = u.Heading;
-    /* harmony default export */    const Kn = _n;
+    B.propTypes = j;
+    B.Option = h;
+    B.Divider = u.Divider;
+    B.Heading = u.Heading;
+    /* harmony default export */    const R = B;
     // CONCATENATED MODULE: external "lodash/defer"
-    const Hn = require("lodash/defer");
-    var $n =  e.n(Hn);
+    const E = require("lodash/defer");
+    var F =  e.n(E);
     // CONCATENATED MODULE: external "lodash/get"
-    const zn = require("lodash/get");
-    var Wn =  e.n(zn);
+    const I = require("lodash/get");
+    var A =  e.n(I);
     // CONCATENATED MODULE: external "lodash/isString"
-    const Un = require("lodash/isString");
-    var Xn =  e.n(Un);
+    const q = require("lodash/isString");
+    var D =  e.n(q);
     // CONCATENATED MODULE: external "lodash/keys"
-    const Gn = require("lodash/keys");
-    var Jn =  e.n(Gn);
+    const L = require("lodash/keys");
+    var T =  e.n(L);
     // CONCATENATED MODULE: external "lodash/last"
-    const Qn = require("lodash/last");
-    var Yn =  e.n(Qn);
+    const _ = require("lodash/last");
+    var H =  e.n(_);
+    // CONCATENATED MODULE: external "lodash/memoize"
+    const $ = require("lodash/memoize");
+    var z =  e.n($);
     // CONCATENATED MODULE: external "lodash/omit"
-    const Zn = require("lodash/omit");
-    var er =  e.n(Zn);
+    const K = require("lodash/omit");
+    var W =  e.n(K);
     // CONCATENATED MODULE: external "lodash/pickBy"
-    const nr = require("lodash/pickBy");
-    var rr =  e.n(nr);
+    const U = require("lodash/pickBy");
+    var G =  e.n(U);
+    // CONCATENATED MODULE: external "lodash/without"
+    const X = require("lodash/without");
+    var J =  e.n(X);
     // CONCATENATED MODULE: external "@splunk/react-ui/Popover"
-    const tr = require("@splunk/react-ui/Popover");
-    var or =  e.n(tr);
+    const Q = require("@splunk/react-ui/Popover");
+    var Y =  e.n(Q);
+    // CONCATENATED MODULE: external "@splunk/react-ui/ResultsMenu"
+    const Z = require("@splunk/react-ui/ResultsMenu");
+    var ee =  e.n(Z);
+    // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
+    const ne = require("@splunk/react-ui/ScreenReaderContent");
+    var re =  e.n(ne);
+    // CONCATENATED MODULE: external "@splunk/ui-utils/filter"
+    const te = require("@splunk/ui-utils/filter");
     // CONCATENATED MODULE: external "@splunk/ui-utils/format"
-    const ar = require("@splunk/ui-utils/format");
+    const oe = require("@splunk/ui-utils/format");
+    // CONCATENATED MODULE: external "@splunk/ui-utils/id"
+    const ae = require("@splunk/ui-utils/id");
+    // CONCATENATED MODULE: external "@splunk/ui-utils/scroll"
+    const le = require("@splunk/ui-utils/scroll");
+    // CONCATENATED MODULE: external "styled-components"
+    const ie = require("styled-components");
+    var ue =  e.n(ie);
     // CONCATENATED MODULE: external "@splunk/react-ui/Box"
-    const lr = require("@splunk/react-ui/Box");
-    var ir =  e.n(lr);
+    const se = require("@splunk/react-ui/Box");
+    var ce =  e.n(se);
     // CONCATENATED MODULE: external "@splunk/react-ui/Chip"
-    const ur = require("@splunk/react-ui/Chip");
-    var cr =  e.n(ur);
+    const de = require("@splunk/react-ui/Chip");
+    var fe =  e.n(de);
+    // CONCATENATED MODULE: external "@splunk/themes"
+    const pe = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/Multiselect/NormalStyles.ts
-    var sr = ke()(ir()).withConfig({
+    var ve = ue()(ce()).withConfig({
         displayName: "NormalStyles__StyledBox",
         componentId: "sc-1uwwpco-0"
-    })([ "display:flex;align-items:center;flex-wrap:wrap;gap:", ";border-radius:", ";min-width:200px;min-height:", ";max-height:300px;overflow-y:auto;border:", " solid ", ";padding-inline:", ";background-color:", ";", " ", " ", " ", " ", " ", " ", " &[data-inline]{width:400px;}" ], Me.variables.spacingXSmall, Me.variables.borderRadius, Me.variables.inputHeight, Me.variables.inputBorderWidth, Me.variables.interactiveColorBorder, Me.variables.spacingXSmall, Me.variables.interactiveColorBackground, (function(e) {
+    })([ "display:flex;align-items:center;flex-wrap:wrap;gap:", ";border-radius:", ";min-width:200px;min-height:", ";max-height:300px;overflow-y:auto;border:", " solid ", ";padding-inline:", ";background-color:", ";", " ", " ", " ", " ", " ", " ", " &[data-inline]{width:400px;}" ], pe.variables.spacingXSmall, pe.variables.borderRadius, pe.variables.inputHeight, pe.variables.inputBorderWidth, pe.variables.interactiveColorBorder, pe.variables.spacingXSmall, pe.variables.interactiveColorBackground, (function(e) {
         var n = e.$append;
-        return n && (0, Ce.css)([ "border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none;" ]);
+        return n && (0, ie.css)([ "border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none;" ]);
     }), (function(e) {
         var n = e.$prepend;
-        return n && (0, Ce.css)([ "border-start-start-radius:0;border-end-start-radius:0;" ]);
+        return n && (0, ie.css)([ "border-start-start-radius:0;border-end-start-radius:0;" ]);
     }), (function(e) {
         var n = e.$hasFocus;
-        return n && (0, Ce.css)([ "box-shadow:", ";" ], Me.variables.focusShadow);
+        return n && (0, ie.css)([ "box-shadow:", ";" ], pe.variables.focusShadow);
     }), (function(e) {
         var n = e.$error;
-        return n && (0, Ce.css)([ "border-color:", ";&:hover:not([disabled]){border-color:", ";}" ], Me.variables.interactiveColorAccentError, Me.variables.interactiveColorAccentErrorStrong);
+        return n && (0, ie.css)([ "border-color:", ";&:hover:not([disabled]){border-color:", ";}" ], pe.variables.interactiveColorAccentError, pe.variables.interactiveColorAccentErrorStrong);
     }), (function(e) {
         var n = e.$disabled;
-        return n && (0, Ce.css)([ "border-color:", ";background-color:", ";cursor:not-allowed;" ], Me.variables.interactiveColorBorderDisabled, Me.variables.interactiveColorBackgroundDisabled);
+        return n && (0, ie.css)([ "border-color:", ";background-color:", ";cursor:not-allowed;" ], pe.variables.interactiveColorBorderDisabled, pe.variables.interactiveColorBackgroundDisabled);
     }), (function(e) {
         var n = e.$disabled, r = e.$hasFocus;
-        return !n && !r && (0, Ce.css)([ "&:hover{border-color:", ";}" ], Me.variables.interactiveColorBorderHover);
+        return !n && !r && (0, ie.css)([ "&:hover{border-color:", ";}" ], pe.variables.interactiveColorBorderHover);
     }), (function(e) {
         var n = e.$popoverOpen;
-        return n && (0, Ce.css)([ "position:relative;z-index:calc(", " - 2);" ], Me.variables.zindexFixedNavbar);
+        return n && (0, ie.css)([ "position:relative;z-index:calc(", " - 2);" ], pe.variables.zindexFixedNavbar);
     }));
-    var dr = ke().span.withConfig({
+    var be = ue().span.withConfig({
         displayName: "NormalStyles__StyledButtonsWrapper",
         componentId: "sc-1uwwpco-1"
     })([ "display:contents;" ]);
-    var fr = ke().input.withConfig({
+    var me = ue().input.withConfig({
         displayName: "NormalStyles__StyledInput",
         componentId: "sc-1uwwpco-2"
-    })([ "", ";flex:1 0 auto;max-width:100%;" ], Me.mixins.reset("block"));
-    var pr = ke()(cr()).withConfig({
+    })([ "", ";flex:1 0 auto;max-width:100%;" ], pe.mixins.reset("block"));
+    var ge = ue()(fe()).withConfig({
         displayName: "NormalStyles__StyledChip",
         componentId: "sc-1uwwpco-3"
     })([ "line-height:1.1429;height:auto;", ";&:not([disabled]):focus{box-shadow:", ";}" ], (0, 
-    Me.pick)({
-        compact: (0, Ce.css)([ "padding-block:2px;" ])
-    }), Me.variables.focusShadowInset);
+    pe.pick)({
+        compact: (0, ie.css)([ "padding-block:2px;" ])
+    }), pe.variables.focusShadowInset);
+    // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
+    /**
+ * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
+ *
+ * @param ref - The React callback or object ref. Can be `null` or `undefined`.
+ * @param current - The new value of the ref.
+ */
+    function ye(e, n) {
+        if (e) {
+            if (typeof e === "function") {
+                e(n);
+            } else {
+                // the public signature of this util uses React.Ref<T> to mirror the way React types refs.
+                // the intention here is to signal "we will take care of setting 'current', not you".
+                e.current = n;
+ // eslint-disable-line no-param-reassign
+                        }
+        }
+    }
     // CONCATENATED MODULE: ./src/Multiselect/Normal.tsx
-    function vr(e) {
+    function he(e) {
         "@babel/helpers - typeof";
-        return vr = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
+        return he = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
             return typeof e;
         } : function(e) {
             return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
-        }, vr(e);
+        }, he(e);
     }
-    function br() {
-        return br = Object.assign ? Object.assign.bind() : function(e) {
+    function Oe() {
+        return Oe = Object.assign ? Object.assign.bind() : function(e) {
             for (var n = 1; n < arguments.length; n++) {
                 var r = arguments[n];
                 for (var t in r) {
@@ -2034,44 +491,44 @@
                 }
             }
             return e;
-        }, br.apply(null, arguments);
+        }, Oe.apply(null, arguments);
     }
-    function mr(e) {
-        return hr(e) || gr(e) || wr(e) || yr();
+    function we(e) {
+        return Me(e) || Ce(e) || je(e) || Se();
     }
-    function yr() {
+    function Se() {
         throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
     }
-    function gr(e) {
+    function Ce(e) {
         if ("undefined" != typeof Symbol && null != e[Symbol.iterator] || null != e["@@iterator"]) return Array.from(e);
     }
-    function hr(e) {
-        if (Array.isArray(e)) return Cr(e);
+    function Me(e) {
+        if (Array.isArray(e)) return xe(e);
     }
-    function Or(e, n) {
-        return jr(e) || kr(e, n) || wr(e, n) || Sr();
+    function Pe(e, n) {
+        return Ne(e) || Ve(e, n) || je(e, n) || ke();
     }
-    function Sr() {
+    function ke() {
         throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
     }
-    function wr(e, n) {
+    function je(e, n) {
         if (e) {
-            if ("string" == typeof e) return Cr(e, n);
+            if ("string" == typeof e) return xe(e, n);
             var r = {}.toString.call(e).slice(8, -1);
-            return "Object" === r && e.constructor && (r = e.constructor.name), "Map" === r || "Set" === r ? Array.from(e) : "Arguments" === r || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? Cr(e, n) : void 0;
+            return "Object" === r && e.constructor && (r = e.constructor.name), "Map" === r || "Set" === r ? Array.from(e) : "Arguments" === r || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? xe(e, n) : void 0;
         }
     }
-    function Cr(e, n) {
+    function xe(e, n) {
         (null == n || n > e.length) && (n = e.length);
         for (var r = 0, t = Array(n); r < n; r++) {
             t[r] = e[r];
         }
         return t;
     }
-    function kr(e, n) {
+    function Ve(e, n) {
         var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
         if (null != r) {
-            var t, o, a, l, i = [], u = !0, c = !1;
+            var t, o, a, l, i = [], u = !0, s = !1;
             try {
                 if (a = (r = r.call(e)).next, 0 === n) {
                     if (Object(r) !== r) return;
@@ -2079,23 +536,23 @@
                 } else for (;!(u = (t = a.call(r)).done) && (i.push(t.value), i.length !== n); u = !0) {
                 }
             } catch (e) {
-                c = !0, o = e;
+                s = !0, o = e;
             } finally {
                 try {
                     if (!u && null != r["return"] && (l = r["return"](), Object(l) !== l)) return;
                 } finally {
-                    if (c) throw o;
+                    if (s) throw o;
                 }
             }
             return i;
         }
     }
-    function jr(e) {
+    function Ne(e) {
         if (Array.isArray(e)) return e;
     }
-    function xr(e, n) {
+    function Be(e, n) {
         if (null == e) return {};
-        var r, t, o = Pr(e, n);
+        var r, t, o = Re(e, n);
         if (Object.getOwnPropertySymbols) {
             var a = Object.getOwnPropertySymbols(e);
             for (t = 0; t < a.length; t++) {
@@ -2104,7 +561,7 @@
         }
         return o;
     }
-    function Pr(e, n) {
+    function Re(e, n) {
         if (null == e) return {};
         var r = {};
         for (var t in e) {
@@ -2115,7 +572,7 @@
         }
         return r;
     }
-    function Er(e, n) {
+    function Ee(e, n) {
         var r = Object.keys(e);
         if (Object.getOwnPropertySymbols) {
             var t = Object.getOwnPropertySymbols(e);
@@ -2125,40 +582,40 @@
         }
         return r;
     }
-    function Mr(e) {
+    function Fe(e) {
         for (var n = 1; n < arguments.length; n++) {
             var r = null != arguments[n] ? arguments[n] : {};
-            n % 2 ? Er(Object(r), !0).forEach((function(n) {
-                Rr(e, n, r[n]);
-            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : Er(Object(r)).forEach((function(n) {
+            n % 2 ? Ee(Object(r), !0).forEach((function(n) {
+                Ie(e, n, r[n]);
+            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : Ee(Object(r)).forEach((function(n) {
                 Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
             }));
         }
         return e;
     }
-    function Rr(e, n, r) {
-        return (n = Ar(n)) in e ? Object.defineProperty(e, n, {
+    function Ie(e, n, r) {
+        return (n = Ae(n)) in e ? Object.defineProperty(e, n, {
             value: r,
             enumerable: !0,
             configurable: !0,
             writable: !0
         }) : e[n] = r, e;
     }
-    function Ar(e) {
-        var n = Ir(e, "string");
-        return "symbol" == vr(n) ? n : n + "";
+    function Ae(e) {
+        var n = qe(e, "string");
+        return "symbol" == he(n) ? n : n + "";
     }
-    function Ir(e, n) {
-        if ("object" != vr(e) || !e) return e;
+    function qe(e, n) {
+        if ("object" != he(e) || !e) return e;
         var r = e[Symbol.toPrimitive];
         if (void 0 !== r) {
             var t = r.call(e, n || "default");
-            if ("object" != vr(t)) return t;
+            if ("object" != he(t)) return t;
             throw new TypeError("@@toPrimitive must return a primitive value.");
         }
         return ("string" === n ? String : Number)(e);
     }
-    var Br = {
+    var De = {
         allowNewValues: i().bool,
         animateLoading: i().bool,
         append: i().bool,
@@ -2194,29 +651,29 @@
         tabConfirmsNewValue: i().bool,
         values: i().array
     };
-    var Nr = T()((function(e) {
+    var Le = z()((function(e) {
         return {
             flexBasis: e,
             width: e
         };
     }));
     // export for testing purpose
-        var Vr = T()((function(e) {
+        var Te = z()((function(e) {
         var n = e.anchorWidth, r = n === void 0 ? 0 : n, t = e.maxHeight, o = e.menuStyle;
-        return Mr({
+        return Fe({
             maxHeight: t,
             overflow: "auto",
             width: Math.max(r, 200)
         }, o || {});
     }));
     // TS: not typed controlled/uncontrolled, handled by Multiselect wrapper component
-        var Dr = {};
-    var Lr = (0, d._)("No matches");
-    var qr = (0, d._)("Select...");
-    function Tr(e) {
-        var n = e.allowNewValues, o = e.animateLoading, l = e.append, i = e.children, u = e.controlledFilter, c = e.defaultPlacement, f = c === void 0 ? "vertical" : c, p = e.defaultValues, v = e.describedBy, b = e.disabled, m = e.elementRef, y = e.error, g = e.footerMessage, h = e.inline, O = e.inputId, S = e.inputRef, w = e.isLoadingOptions, C = e.labelledBy, k = e.loadingMessage, j = e.menuStyle, x = j === void 0 ? Dr : j, P = e.name, E = e.noOptionsMessage, R = E === void 0 ? Lr : E, A = e.onChange, I = e.onClose, B = e.onFilterChange, N = e.onScroll, V = e.onScrollBottom, D = e.onOpen, L = e.placeholder, q = L === void 0 ? qr : L, T = e.prepend, F = e.required, _ = e.repositionMode, K = e.tabConfirmsNewValue, H = e.values, $ = xr(e, [ "allowNewValues", "animateLoading", "append", "children", "controlledFilter", "defaultPlacement", "defaultValues", "describedBy", "disabled", "elementRef", "error", "footerMessage", "inline", "inputId", "inputRef", "isLoadingOptions", "labelledBy", "loadingMessage", "menuStyle", "name", "noOptionsMessage", "onChange", "onClose", "onFilterChange", "onScroll", "onScrollBottom", "onOpen", "placeholder", "prepend", "required", "repositionMode", "tabConfirmsNewValue", "values" ]);
+        var _e = {};
+    var He = (0, d._)("No matches");
+    var $e = (0, d._)("Select...");
+    function ze(e) {
+        var n = e.allowNewValues, o = e.animateLoading, l = e.append, i = e.children, u = e.controlledFilter, s = e.defaultPlacement, f = s === void 0 ? "vertical" : s, p = e.defaultValues, v = e.describedBy, b = e.disabled, m = e.elementRef, g = e.error, y = e.footerMessage, O = e.inline, w = e.inputId, S = e.inputRef, C = e.isLoadingOptions, M = e.labelledBy, P = e.loadingMessage, k = e.menuStyle, j = k === void 0 ? _e : k, x = e.name, V = e.noOptionsMessage, N = V === void 0 ? He : V, B = e.onChange, R = e.onClose, E = e.onFilterChange, I = e.onScroll, q = e.onScrollBottom, L = e.onOpen, _ = e.placeholder, $ = _ === void 0 ? $e : _, z = e.prepend, K = e.required, U = e.repositionMode, X = e.tabConfirmsNewValue, Q = e.values, Z = Be(e, [ "allowNewValues", "animateLoading", "append", "children", "controlledFilter", "defaultPlacement", "defaultValues", "describedBy", "disabled", "elementRef", "error", "footerMessage", "inline", "inputId", "inputRef", "isLoadingOptions", "labelledBy", "loadingMessage", "menuStyle", "name", "noOptionsMessage", "onChange", "onClose", "onFilterChange", "onScroll", "onScrollBottom", "onOpen", "placeholder", "prepend", "required", "repositionMode", "tabConfirmsNewValue", "values" ]);
         // @docs-props-type NormalPropsBase
-                var W = s()({
+                var ne = c()({
             componentName: "Multiselect",
             /* eslint-disable-next-line prefer-rest-params */
             componentProps: arguments[0],
@@ -2225,254 +682,254 @@
             valuePropName: "values"
         });
         if (false) {}
-        var U = (0, r.useState)(0), X = Or(U, 2), G = X[0], J = X[1];
-        var Q = (0, r.useState)(null), Y = Or(Q, 2), Z = Y[0], ee = Y[1];
-        var re = (0, r.useState)(""), oe = Or(re, 2), ae = oe[0], le = oe[1];
-        var ie = (0, r.useState)(false), de = Or(ie, 2), fe = de[0], pe = de[1];
-        var ve = (0, r.useState)(false), be = Or(ve, 2), me = be[0], ye = be[1];
-        var ge = (0, r.useState)(p || []), he = Or(ge, 2), Oe = he[0], Se = he[1];
-        var we = (0, r.useState)(""), Ce = Or(we, 2), ke = Ce[0], je = Ce[1];
-        var xe = W && H ? H : Oe;
-        var Pe = xe.slice(0);
-        var Ee = xe.indexOf(ae) >= 0;
-        var Me = (0, r.useRef)(null);
-        var Re = (0, r.useRef)(null);
-        var Ae = (0, r.useRef)(undefined);
-        var Ie = (0, r.useRef)(0);
-        var Be = (0, r.useState)((function() {
+        var ie = (0, r.useState)(0), ue = Pe(ie, 2), se = ue[0], ce = ue[1];
+        var de = (0, r.useState)(null), fe = Pe(de, 2), pe = fe[0], he = fe[1];
+        var Se = (0, r.useState)(""), Ce = Pe(Se, 2), Me = Ce[0], ke = Ce[1];
+        var je = (0, r.useState)(false), xe = Pe(je, 2), Ve = xe[0], Ne = xe[1];
+        var Re = (0, r.useState)(false), Ee = Pe(Re, 2), Ie = Ee[0], Ae = Ee[1];
+        var qe = (0, r.useState)(p || []), De = Pe(qe, 2), ze = De[0], Ke = De[1];
+        var We = (0, r.useState)(""), Ue = Pe(We, 2), Ge = Ue[0], Xe = Ue[1];
+        var Je = ne && Q ? Q : ze;
+        var Qe = Je.slice(0);
+        var Ye = Je.indexOf(Me) >= 0;
+        var Ze = (0, r.useRef)(null);
+        var en = (0, r.useRef)(null);
+        var nn = (0, r.useRef)(undefined);
+        var rn = (0, r.useRef)(0);
+        var tn = (0, r.useState)((function() {
             return {
-                activeItemId: (0, ce.createDOMID)("active-item"),
-                popoverId: (0, ce.createDOMID)("popover")
+                activeItemId: (0, ae.createDOMID)("active-item"),
+                popoverId: (0, ae.createDOMID)("popover")
             };
-        })), Ne = Or(Be, 1), Ve = Ne[0], De = Ve.activeItemId, Le = Ve.popoverId;
+        })), on = Pe(tn, 1), an = on[0], ln = an.activeItemId, un = an.popoverId;
         (0, r.useEffect)((function() {
-            if (W) {
-                le("");
-                J(0);
+            if (ne) {
+                ke("");
+                ce(0);
             }
-        }), [ H, W ]);
+        }), [ Q, ne ]);
         // Tracks the prev activeIndex so its known if scrolling is needed in handleActiveOptionMount - can't use usePrevious b/c the value needs wiped on Menu close
                 (0, r.useEffect)((function() {
-            Re.current = G;
-        }), [ G ]);
-        var qe = (0, r.useCallback)((function(e) {
+            en.current = se;
+        }), [ se ]);
+        var sn = (0, r.useCallback)((function(e) {
             var n = e.resetFilterKeyword;
-            if (!me) {
-                le((function(e) {
+            if (!Ie) {
+                ke((function(e) {
                     return n ? "" : e;
                 }));
-                pe(true);
-                ye(true);
-                D === null || D === void 0 ? void 0 : D();
-            }
-        }), [ me, D ]);
-        var Te = (0, r.useCallback)((function() {
-            if (fe) {
-                qe({
+                Ne(true);
+                Ae(true);
+                L === null || L === void 0 ? void 0 : L();
+            }
+        }), [ Ie, L ]);
+        var cn = (0, r.useCallback)((function() {
+            if (Ve) {
+                sn({
                     resetFilterKeyword: false
                 });
             } else {
                 var e;
-                (e = Me.current) === null || e === void 0 ? void 0 : e.focus();
+                (e = Ze.current) === null || e === void 0 ? void 0 : e.focus();
             }
-        }), [ fe, qe ]);
-        var Fe = (0, r.useCallback)((function(e, n) {
-            if (!me) {
+        }), [ Ve, sn ]);
+        var dn = (0, r.useCallback)((function(e, n) {
+            if (!Ie) {
                 return;
             }
-            var r = (xe || []).concat([ n ]);
-            if (!W) {
-                Se(r);
-                J(0);
-                ye(true);
-                le("");
+            var r = (Je || []).concat([ n ]);
+            if (!ne) {
+                Ke(r);
+                ce(0);
+                Ae(true);
+                ke("");
             }
-            A === null || A === void 0 ? void 0 : A(e, {
+            B === null || B === void 0 ? void 0 : B(e, {
                 values: r,
-                name: P
+                name: x
             });
-        }), [ me, xe, W, A, P ]);
-        var _e = (0, r.useCallback)((function(e, n) {
-            var r = z()(xe, n);
-            if (!W) {
-                Se(r);
+        }), [ Ie, Je, ne, B, x ]);
+        var fn = (0, r.useCallback)((function(e, n) {
+            var r = J()(Je, n);
+            if (!ne) {
+                Ke(r);
             }
-            A === null || A === void 0 ? void 0 : A(e, {
+            B === null || B === void 0 ? void 0 : B(e, {
                 values: r,
-                name: P
+                name: x
             });
-        }), [ xe, W, P, A ]);
-        var Ke = (0, r.useCallback)((function(e) {
-            if (me && !w) {
-                V === null || V === void 0 ? void 0 : V(e);
-                je("".concat(Ie.current, " options, loading more options"));
-            }
-        }), [ me, w, V ]);
-        var He = (0, r.useCallback)((function(e, n) {
+        }), [ Je, ne, x, B ]);
+        var pn = (0, r.useCallback)((function(e) {
+            if (Ie && !C) {
+                q === null || q === void 0 ? void 0 : q(e);
+                Xe("".concat(rn.current, " options, loading more options"));
+            }
+        }), [ Ie, C, q ]);
+        var vn = (0, r.useCallback)((function(e, n) {
             var r = n.value;
-            $n()((function() {
-                return _e(e, r);
+            F()((function() {
+                return fn(e, r);
             }));
-        }), [ _e ]);
-        var $e = (0, r.useCallback)((function(e) {
-            if (ae !== "") {
-                B === null || B === void 0 ? void 0 : B(e, {
+        }), [ fn ]);
+        var bn = (0, r.useCallback)((function(e) {
+            if (Me !== "") {
+                E === null || E === void 0 ? void 0 : E(e, {
                     keyword: ""
                 });
             }
-            qe({
+            sn({
                 resetFilterKeyword: true
             });
-        }), [ ae, B, qe ]);
-        var ze = (0, r.useCallback)((function(e) {
+        }), [ Me, E, sn ]);
+        var mn = (0, r.useCallback)((function(e) {
             var n;
             var t = e.key;
-            if (t === "Tab" && me) {
-                if (K && Ae.current !== undefined && Ie.current <= 1) {
+            if (t === "Tab" && Ie) {
+                if (X && nn.current !== undefined && rn.current <= 1) {
                     var o;
                     e.preventDefault();
-                    Fe(e, Ae.current);
-                    (o = Me.current) === null || o === void 0 ? void 0 : o.focus();
+                    dn(e, nn.current);
+                    (o = Ze.current) === null || o === void 0 ? void 0 : o.focus();
                 } else {
-                    ye(false);
+                    Ae(false);
                 }
             }
             if (e.shiftKey || e.metaKey || e.ctrlKey) {
                 return;
             }
-            if (t === "End" && me) {
+            if (t === "End" && Ie) {
                 e.preventDefault();
-                J(Ie.current - 1);
+                ce(rn.current - 1);
             }
-            if (t === "Home" && me) {
+            if (t === "Home" && Ie) {
                 e.preventDefault();
-                J(0);
+                ce(0);
             }
             if (t === "ArrowDown") {
                 e.preventDefault();
-                if (me) {
-                    J((function(e) {
-                        return Math.min(e + 1, Ie.current - 1);
+                if (Ie) {
+                    ce((function(e) {
+                        return Math.min(e + 1, rn.current - 1);
                     }));
                 } else {
-                    J(0);
-                    ye(true);
+                    ce(0);
+                    Ae(true);
                 }
-                if (i && V) {
-                    var a = r.Children.toArray(i).length - (2 + ((xe === null || xe === void 0 ? void 0 : xe.length) || 0));
-                    if (G === a) {
-                        Ke(e);
+                if (i && q) {
+                    var a = r.Children.toArray(i).length - (2 + ((Je === null || Je === void 0 ? void 0 : Je.length) || 0));
+                    if (se === a) {
+                        pn(e);
                     }
                 }
             }
             if (t === "ArrowUp") {
                 e.preventDefault();
-                if (me) {
-                    J((function(e) {
+                if (Ie) {
+                    ce((function(e) {
                         return Math.max(e - 1, 0);
                     }));
                 } else {
-                    J(0);
-                    ye(true);
+                    ce(0);
+                    Ae(true);
                 }
             }
-            if (t === "Enter" && Ae.current !== undefined && me) {
-                Fe(e, Ae.current);
+            if (t === "Enter" && nn.current !== undefined && Ie) {
+                dn(e, nn.current);
             }
-            if (t === "Backspace" && ((n = Me.current) === null || n === void 0 ? void 0 : n.value) === "" && xe.length) {
-                _e(e, Yn()(xe));
+            if (t === "Backspace" && ((n = Ze.current) === null || n === void 0 ? void 0 : n.value) === "" && Je.length) {
+                fn(e, H()(Je));
             }
-        }), [ me, xe, K, Fe, i, V, G, Ke, _e ]);
-        var We = (0, r.useCallback)((function(e) {
-            le(e.target.value);
-            ye(true);
-            J(0);
-            B === null || B === void 0 ? void 0 : B(e, {
+        }), [ Ie, Je, X, dn, i, q, se, pn, fn ]);
+        var gn = (0, r.useCallback)((function(e) {
+            ke(e.target.value);
+            Ae(true);
+            ce(0);
+            E === null || E === void 0 ? void 0 : E(e, {
                 keyword: e.target.value
             });
-        }), [ B ]);
-        var Ue = (0, r.useCallback)((function(e, n) {
+        }), [ E ]);
+        var yn = (0, r.useCallback)((function(e, n) {
             var r;
             var t = n.value;
             e.stopPropagation();
-            Fe(e, t);
-            (r = Me.current) === null || r === void 0 ? void 0 : r.focus();
-        }), [ Fe ]);
-        var Ge = (0, r.useCallback)((function(e) {
-            var n = document.getElementById(Le);
+            dn(e, t);
+            (r = Ze.current) === null || r === void 0 ? void 0 : r.focus();
+        }), [ dn ]);
+        var hn = (0, r.useCallback)((function(e) {
+            var n = document.getElementById(un);
             var r = e.relatedTarget || document.activeElement;
  // IE11 doesn't support relatedTarget but sets activeElement
                         var t = n && r && n.contains(r);
  // TS: target as Node is an unsafe assumption
-                        le(t ? ae : "");
-            pe(false);
+                        ke(t ? Me : "");
+            Ne(false);
             if (!t) {
-                B === null || B === void 0 ? void 0 : B(e, {
+                E === null || E === void 0 ? void 0 : E(e, {
                     keyword: ""
                 });
             }
-        }), [ ae, B, Le ]);
-        var Je = (0, r.useCallback)((function(e) {
+        }), [ Me, E, un ]);
+        var On = (0, r.useCallback)((function(e) {
             var n = e.reason, r = e.event;
-            if (n === "escapeKey" || n === "offScreen" || n === "clickAway" && r !== undefined && !(Z === null || Z === void 0 ? void 0 : Z.contains(r.target))) {
-                ye(false);
-                Re.current = null;
-                I === null || I === void 0 ? void 0 : I();
+            if (n === "escapeKey" || n === "offScreen" || n === "clickAway" && r !== undefined && !(pe === null || pe === void 0 ? void 0 : pe.contains(r.target))) {
+                Ae(false);
+                en.current = null;
+                R === null || R === void 0 ? void 0 : R();
             }
             if (n === "escapeKey") {
                 var t;
-                (t = Me.current) === null || t === void 0 ? void 0 : t.focus();
+                (t = Ze.current) === null || t === void 0 ? void 0 : t.focus();
             }
-        }), [ Z, I ]);
-        var Qe = (0, r.useCallback)((function(e) {
-            ee(e);
-            Xe(m, e);
+        }), [ pe, R ]);
+        var wn = (0, r.useCallback)((function(e) {
+            he(e);
+            ye(m, e);
         }), [ m ]);
-        var Ye = (0, r.useCallback)((function(e) {
-            Me.current = e;
-            Xe(S, e);
+        var Sn = (0, r.useCallback)((function(e) {
+            Ze.current = e;
+            ye(S, e);
         }), [ S ]);
-        var Ze = (0, r.useCallback)((function(e) {
-            if (Re.current !== G) {
-                (0, se.scrollIntoViewIfNeeded)(e);
+        var Cn = (0, r.useCallback)((function(e) {
+            if (en.current !== se) {
+                (0, le.scrollIntoViewIfNeeded)(e);
             }
-        }), [ G ]);
-        var en = (0, r.useCallback)((function(e) {
+        }), [ se ]);
+        var Mn = (0, r.useCallback)((function(e) {
             // selectedOptions may contain items or unmatched values at this point
             return e.map((function(e) {
                 var n = e;
  // TS: faking props here
                                 var r = n.props;
                 if (r != null) {
-                    var o = r.children, a = r.icon, l = r.label, i = r.selectedAppearance, u = r.selectedBackgroundColor, c = r.selectedForegroundColor, s = r.value;
+                    var o = r.children, a = r.icon, l = r.label, i = r.selectedAppearance, u = r.selectedBackgroundColor, s = r.selectedForegroundColor, c = r.value;
                     
-                    return t().createElement(pr, {
+                    return t().createElement(ge, {
                         "aria-selected": true,
                         disabled: b,
                         icon: a,
-                        key: s.toString(),
+                        key: c.toString(),
                         "data-test": "selected-option",
-                        onRequestRemove: He,
+                        onRequestRemove: vn,
                         role: "option",
-                        value: s,
+                        value: c,
                         appearance: i,
                         backgroundColor: u,
-                        foregroundColor: c
+                        foregroundColor: s
                     }, o || l);
                 }
                 
-                return t().createElement(pr, {
+                return t().createElement(ge, {
                     "aria-selected": true,
                     disabled: b,
-                    key: (0, ce.createGUID)(),
+                    key: (0, ae.createGUID)(),
                     "data-test": "selected-option",
-                    onRequestRemove: He,
+                    onRequestRemove: vn,
                     role: "option",
                     value: n
                 }, n);
             }));
-        }), [ b, He ]);
-        var nn = function e(n) {
+        }), [ b, vn ]);
+        var Pn = function e(n) {
             return n.map((function(e) {
                 var n = e;
  // TS: faking props here
@@ -2481,82 +938,82 @@
                     
                     return t().createElement("span", {
                         key: r.value.toString()
-                    }, r.children || r.label, (0, ar.sprintf)((0, d._)(" selected")));
+                    }, r.children || r.label, (0, oe.sprintf)((0, d._)(" selected")));
                 }
                 
                 return t().createElement("span", {
-                    key: (0, ce.createGUID)()
-                },  t().createElement(t().Fragment, null, n, (0, ar.sprintf)((0, d._)(" selected"))));
+                    key: (0, ae.createGUID)()
+                },  t().createElement(t().Fragment, null, n, (0, oe.sprintf)((0, d._)(" selected"))));
             }));
         };
         // Map Options to selected values
-                if (xe && xe.length) {
+                if (Je && Je.length) {
             r.Children.toArray(i).filter(r.isValidElement).filter((function(e) {
-                return e.type === M;
+                return e.type === h;
             })).forEach((function(e) {
-                if (e.type === M) {
-                    var n = xe.indexOf(e.props.value);
+                if (e.type === h) {
+                    var n = Je.indexOf(e.props.value);
                     if (n !== -1) {
-                        Pe[n] = e;
+                        Qe[n] = e;
                     }
                 }
             }));
         }
         // Filter the items
-                var rn = (0, ue.stringToKeywords)(ae);
-        var tn = u ? r.Children.toArray(i) : r.Children.toArray(i).filter((function(e) {
-            if (Wn()(e, [ "props", "label" ], false)) {
-                return (0, ue.testPhrase)(e.props.label, rn);
+                var kn = (0, te.stringToKeywords)(Me);
+        var jn = u ? r.Children.toArray(i) : r.Children.toArray(i).filter((function(e) {
+            if (A()(e, [ "props", "label" ], false)) {
+                return (0, te.testPhrase)(e.props.label, kn);
             }
             return true;
  // Keep all headers and non-interactive options
                 }));
-        Ie.current = 0;
-        Ae.current = undefined;
-        var on = r.Children.map(tn, (function(e, n) {
+        rn.current = 0;
+        nn.current = undefined;
+        var xn = r.Children.map(jn, (function(e, n) {
             var t = e.props;
             if (!t || !a()(t, "value")) {
                 // ignore Headings and Dividers
                 return e;
             }
             var o = e;
-            var l = o.props, i = l.children, c = l.label, s = l.matchRanges, d = l.value;
+            var l = o.props, i = l.children, s = l.label, c = l.matchRanges, d = l.value;
  // find out if the search string exactly matches a value
-                        if (d === ae) {
-                Ee = true;
+                        if (d === Me) {
+                Ye = true;
             }
             // remove items that are already selected
-                        var f = xe.indexOf(d);
+                        var f = Je.indexOf(d);
             if (f >= 0) {
                 return null;
             }
             // highlight matched text
-                        var p = i === undefined || Xn()(i);
-            var v = p && !u && !s && rn && (0, ue.keywordLocations)(c, rn);
+                        var p = i === undefined || D()(i);
+            var v = p && !u && !c && kn && (0, te.keywordLocations)(s, kn);
             // clone item
                         var b =  (0, r.cloneElement)(o, {
                 // eslint-disable-next-line react/no-array-index-key
                 key: n,
-                onClick: Ue,
-                matchRanges: p && (s || v) || undefined
+                onClick: yn,
+                matchRanges: p && (c || v) || undefined
             });
             return b;
         })).filter((function(e) {
             return e !== null;
         })) || [];
         // Add the option to add the new value
-                if (n && !Ee && ae) {
-            on.unshift( t().createElement(M, {
-                label: "".concat(ae),
+                if (n && !Ye && Me) {
+            xn.unshift( t().createElement(h, {
+                label: "".concat(Me),
                 description: (0, d._)("(New value)"),
                 descriptionPosition: "right",
-                value: ae,
+                value: Me,
                 key: "newValue",
-                onClick: Ue
+                onClick: yn
             }));
         }
         // highlight the selected Item
-                var an = r.Children.map(on, (function(e) {
+                var Vn = r.Children.map(xn, (function(e) {
             var n = e.props;
             if (!n || !a()(n, "value")) {
                 // ignore Headings and Dividers
@@ -2564,136 +1021,136 @@
             }
             var t = e;
             var o = t.props, l = o.disabled, i = o.value;
-            var u = Ie.current === G;
-            Ie.current += 1;
+            var u = rn.current === se;
+            rn.current += 1;
             if (!u) {
                 return t;
             }
             if (!l) {
-                Ae.current = i;
+                nn.current = i;
             }
-            var c =  (0, r.cloneElement)(t, {
+            var s =  (0, r.cloneElement)(t, {
                 active: u,
-                id: De,
+                id: ln,
                 elementRef: function e(n) {
-                    Ze(n);
-                    Xe(t.props.elementRef, n);
+                    Cn(n);
+                    ye(t.props.elementRef, n);
                 }
             });
-            return c;
+            return s;
         }));
-        var ln = function e(n) {
+        var Nn = function e(n) {
             var r = n.anchorWidth, a = n.maxHeight, l = n.placement;
-            var i = Vr({
+            var i = Te({
                 anchorWidth: r,
                 maxHeight: a,
-                menuStyle: x
+                menuStyle: j
             });
             
-            return t().createElement(ne(), {
+            return t().createElement(ee(), {
                 focusMode: "never",
                 placement: l !== null && l !== void 0 ? l : undefined,
-                isLoading: w,
-                onScrollBottom: V ? Ke : undefined,
-                noOptionsMessage: R,
-                footerMessage: g,
+                isLoading: C,
+                onScrollBottom: q ? pn : undefined,
+                noOptionsMessage: N,
+                footerMessage: y,
                 animateLoading: o,
-                loadingMessage: k,
-                onScroll: N,
+                loadingMessage: P,
+                onScroll: I,
                 style: i
-            }, an);
+            }, Vn);
         };
-        var un = Nr("".concat(ae.length * .8, "em"));
-        var cn = Mr(Mr({}, rr()($, (function(e, n) {
+        var Bn = Le("".concat(Me.length * .8, "em"));
+        var Rn = Fe(Fe({}, G()(Z, (function(e, n) {
             return n === "role" || n.indexOf("aria-") === 0;
         }))), {}, {
             "aria-describedby": v,
-            "aria-labelledby": C,
-            "aria-invalid": y || undefined
+            "aria-labelledby": M,
+            "aria-invalid": g || undefined
         });
-        var sn = Mr({}, rr()($, (function(e, n) {
+        var En = Fe({}, G()(Z, (function(e, n) {
             return n === "aria-label" || n === "aria-describedby";
         })));
         
-        return t().createElement(t().Fragment, null,  t().createElement(sr, br({
+        return t().createElement(t().Fragment, null,  t().createElement(ve, Oe({
             key: "control",
             $append: l,
-            "data-test-values": JSON.stringify(xe),
+            "data-test-values": JSON.stringify(Je),
             "data-test-disabled": b ? "disabled" : undefined,
-            inline: h,
-            $hasFocus: fe
-        }, er().apply(void 0, [ $ ].concat(mr(Jn()(cn)))), {
-            onClick: b ? undefined : Te,
+            inline: O,
+            $hasFocus: Ve
+        }, W().apply(void 0, [ Z ].concat(we(T()(Rn)))), {
+            onClick: b ? undefined : cn,
             $disabled: b,
-            $error: y,
-            "data-test-popover-id": Le,
-            $popoverOpen: me,
-            $prepend: T,
+            $error: g,
+            "data-test-popover-id": un,
+            $popoverOpen: Ie,
+            $prepend: z,
             flex: true,
-            elementRef: Qe,
+            elementRef: wn,
             role: "group",
             "aria-disabled": b || undefined,
-            "aria-labelledby": C
-        }, sn),  t().createElement(dr, {
+            "aria-labelledby": M
+        }, En),  t().createElement(be, {
             role: "listbox",
-            "aria-invalid": y,
+            "aria-invalid": g,
             "aria-multiselectable": "true"
-        }, en(Pe)), !b &&  t().createElement(fr, br({
+        }, Mn(Qe)), !b &&  t().createElement(me, Oe({
             role: "combobox",
             "data-test": "textbox",
-            id: O,
-            ref: Ye,
-            onBlur: Ge,
-            onFocus: $e,
-            onChange: We,
-            onKeyDown: ze,
-            value: ae,
+            id: w,
+            ref: Sn,
+            onBlur: hn,
+            onFocus: bn,
+            onChange: gn,
+            onKeyDown: mn,
+            value: Me,
             autoCapitalize: "off",
             autoComplete: "off",
             autoCorrect: "off",
             spellCheck: false,
-            style: un,
-            placeholder: xe.length ? "" : q,
-            required: F,
-            "aria-activedescendant": me && Ie.current > 0 ? De : undefined,
+            style: Bn,
+            placeholder: Je.length ? "" : $,
+            required: K,
+            "aria-activedescendant": Ie && rn.current > 0 ? ln : undefined,
             "aria-autocomplete": "list",
-            "aria-controls": me ? Le : undefined,
-            "aria-owns": me ? Le : undefined,
-            "aria-expanded": me,
+            "aria-controls": Ie ? un : undefined,
+            "aria-owns": Ie ? un : undefined,
+            "aria-expanded": Ie,
             "aria-haspopup": true
-        }, cn)),  t().createElement(or(), {
-            open: me && !!Z,
+        }, Rn)),  t().createElement(Y(), {
+            open: Ie && !!pe,
             autoCloseWhenOffScreen: true,
-            anchor: Z,
-            onRequestClose: Je,
+            anchor: pe,
+            onRequestClose: On,
             canCoverAnchor: false,
             defaultPlacement: f,
-            repositionMode: _,
-            id: Le
-        }, ln)),  t().createElement(te(), {
+            repositionMode: U,
+            id: un
+        }, Nn)),  t().createElement(re(), {
             role: "status",
             "aria-relevant": "text"
-        }, ke),  t().createElement(te(), {
+        }, Ge),  t().createElement(re(), {
             role: "alert",
             "aria-relevant": "additions"
-        }, nn(Pe)));
+        }, Pn(Qe)));
     }
-    Tr.propTypes = Br;
-    Tr.Option = M;
-    Tr.Divider = u.Divider;
-    Tr.Heading = u.Heading;
-    /* harmony default export */    const Fr = Tr;
+    ze.propTypes = De;
+    ze.Option = h;
+    ze.Divider = u.Divider;
+    ze.Heading = u.Heading;
+    /* harmony default export */    const Ke = ze;
     // CONCATENATED MODULE: ./src/Multiselect/Multiselect.tsx
-    function _r(e) {
+    function We(e) {
         "@babel/helpers - typeof";
-        return _r = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
+        return We = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
             return typeof e;
         } : function(e) {
             return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
-        }, _r(e);
+        }, We(e);
     }
-    function Kr() {
-        return Kr = Object.assign ? Object.assign.bind() : function(e) {
+    function Ue() {
+        return Ue = Object.assign ? Object.assign.bind() : function(e) {
             for (var n = 1; n < arguments.length; n++) {
                 var r = arguments[n];
                 for (var t in r) {
@@ -2701,9 +1158,9 @@
                 }
             }
             return e;
-        }, Kr.apply(null, arguments);
+        }, Ue.apply(null, arguments);
     }
-    function Hr(e, n) {
+    function Ge(e, n) {
         var r = Object.keys(e);
         if (Object.getOwnPropertySymbols) {
             var t = Object.getOwnPropertySymbols(e);
@@ -2713,42 +1170,42 @@
         }
         return r;
     }
-    function $r(e) {
+    function Xe(e) {
         for (var n = 1; n < arguments.length; n++) {
             var r = null != arguments[n] ? arguments[n] : {};
-            n % 2 ? Hr(Object(r), !0).forEach((function(n) {
-                zr(e, n, r[n]);
-            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : Hr(Object(r)).forEach((function(n) {
+            n % 2 ? Ge(Object(r), !0).forEach((function(n) {
+                Je(e, n, r[n]);
+            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : Ge(Object(r)).forEach((function(n) {
                 Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
             }));
         }
         return e;
     }
-    function zr(e, n, r) {
-        return (n = Wr(n)) in e ? Object.defineProperty(e, n, {
+    function Je(e, n, r) {
+        return (n = Qe(n)) in e ? Object.defineProperty(e, n, {
             value: r,
             enumerable: !0,
             configurable: !0,
             writable: !0
         }) : e[n] = r, e;
     }
-    function Wr(e) {
-        var n = Ur(e, "string");
-        return "symbol" == _r(n) ? n : n + "";
+    function Qe(e) {
+        var n = Ye(e, "string");
+        return "symbol" == We(n) ? n : n + "";
     }
-    function Ur(e, n) {
-        if ("object" != _r(e) || !e) return e;
+    function Ye(e, n) {
+        if ("object" != We(e) || !e) return e;
         var r = e[Symbol.toPrimitive];
         if (void 0 !== r) {
             var t = r.call(e, n || "default");
-            if ("object" != _r(t)) return t;
+            if ("object" != We(t)) return t;
             throw new TypeError("@@toPrimitive must return a primitive value.");
         }
         return ("string" === n ? String : Number)(e);
     }
-    function Xr(e, n) {
+    function Ze(e, n) {
         if (null == e) return {};
-        var r, t, o = Gr(e, n);
+        var r, t, o = en(e, n);
         if (Object.getOwnPropertySymbols) {
             var a = Object.getOwnPropertySymbols(e);
             for (t = 0; t < a.length; t++) {
@@ -2757,7 +1214,7 @@
         }
         return o;
     }
-    function Gr(e, n) {
+    function en(e, n) {
         if (null == e) return {};
         var r = {};
         for (var t in e) {
@@ -2770,7 +1227,7 @@
     }
     /** @public */
     /** @public */
-    /** @public */    var Jr = {
+    /** @public */    var nn = {
         allowNewValues: i().bool,
         animateLoading: i().bool,
         append: i().bool,
@@ -2791,6 +1248,8 @@
         isLoadingOptions: i().bool,
         labelledBy: i().string,
         loadingMessage: i().node,
+        /** @private. */
+        maxLabelItems: i().number,
         menuStyle: i().object,
         name: i().string,
         noOptionsMessage: i().node,
@@ -2810,12 +1269,12 @@
         /** @private */
         virtualization: i().number
     };
-    var Qr = (0, d._)("No matches");
-    var Yr = (0, d._)("Select...");
-    function Zr(e) {
-        var n = e.allowNewValues, o = e.animateLoading, a = e.append, l = e.compact, i = e.children, u = e.controlledFilter, c = e.defaultPlacement, d = c === void 0 ? "vertical" : c, f = e.defaultValues, p = e.describedBy, v = e.disabled, b = e.elementRef, m = e.error, y = e.filter, g = e.footerMessage, h = e.inline, O = e.inputId, S = e.inputRef, w = e.isLoadingOptions, C = e.labelledBy, k = e.loadingMessage, j = e.menuStyle, x = e.name, P = e.noOptionsMessage, E = P === void 0 ? Qr : P, M = e.onChange, R = e.onClose, A = e.onFilterChange, I = e.onOpen, B = e.onScroll, N = e.onScrollBottom, V = e.placeholder, D = V === void 0 ? Yr : V, L = e.prepend, q = e.repositionMode, T = q === void 0 ? "flip" : q, F = e.selectAllAppearance, _ = e.showSelectedValuesFirst, K = e.tabConfirmsNewValue, H = e.values, $ = e.virtualization, z = Xr(e, [ "allowNewValues", "animateLoading", "append", "compact", "children", "controlledFilter", "defaultPlacement", "defaultValues", "describedBy", "disabled", "elementRef", "error", "filter", "footerMessage", "inline", "inputId", "inputRef", "isLoadingOptions", "labelledBy", "loadingMessage", "menuStyle", "name", "noOptionsMessage", "onChange", "onClose", "onFilterChange", "onOpen", "onScroll", "onScrollBottom", "placeholder", "prepend", "repositionMode", "selectAllAppearance", "showSelectedValuesFirst", "tabConfirmsNewValue", "values", "virtualization" ]);
+    var rn = (0, d._)("No matches");
+    var tn = (0, d._)("Select...");
+    function on(e) {
+        var n = e.allowNewValues, o = e.animateLoading, a = e.append, l = e.compact, i = e.children, u = e.controlledFilter, s = e.defaultPlacement, d = s === void 0 ? "vertical" : s, f = e.defaultValues, p = e.describedBy, v = e.disabled, b = e.elementRef, m = e.error, g = e.filter, y = e.footerMessage, h = e.inline, O = e.inputId, w = e.inputRef, S = e.isLoadingOptions, C = e.labelledBy, M = e.loadingMessage, P = e.menuStyle, k = e.name, j = e.noOptionsMessage, x = j === void 0 ? rn : j, V = e.onChange, N = e.onClose, B = e.onFilterChange, E = e.onOpen, F = e.onScroll, I = e.onScrollBottom, A = e.placeholder, q = A === void 0 ? tn : A, D = e.prepend, L = e.repositionMode, T = L === void 0 ? "flip" : L, _ = e.selectAllAppearance, H = e.showSelectedValuesFirst, $ = e.tabConfirmsNewValue, z = e.values, K = e.virtualization, W = Ze(e, [ "allowNewValues", "animateLoading", "append", "compact", "children", "controlledFilter", "defaultPlacement", "defaultValues", "describedBy", "disabled", "elementRef", "error", "filter", "footerMessage", "inline", "inputId", "inputRef", "isLoadingOptions", "labelledBy", "loadingMessage", "menuStyle", "name", "noOptionsMessage", "onChange", "onClose", "onFilterChange", "onOpen", "onScroll", "onScrollBottom", "placeholder", "prepend", "repositionMode", "selectAllAppearance", "showSelectedValuesFirst", "tabConfirmsNewValue", "values", "virtualization" ]);
         // @docs-props-type MultiselectPropsBase
-                var W = s()({
+                var U = c()({
             componentName: "Multiselect",
             /* eslint-disable-next-line prefer-rest-params */
             componentProps: arguments[0],
@@ -2823,16 +1282,16 @@
             defaultValuePropName: "defaultValues",
             valuePropName: "values"
         });
-        /* eslint-disable-next-line prefer-rest-params */        var U = arguments[0];
+        /* eslint-disable-next-line prefer-rest-params */        var G = arguments[0];
         (0, r.useEffect)((function() {
             if (l !== true) {
                 if (false) {}
                 if (false) {}
             }
-        }), [ l, U ]);
+        }), [ l, G ]);
         // Compact uses Button, which defaults `inline` to true, explicitly pass a boolean to prevent the underlying Button from applying its default.
                 var X = !!h;
-        var G = $r({
+        var J = Xe({
             allowNewValues: n,
             animateLoading: o,
             append: a,
@@ -2843,66 +1302,66 @@
             disabled: v,
             elementRef: b,
             error: m,
-            footerMessage: g,
+            footerMessage: y,
             inline: X,
             inputId: O,
-            inputRef: S,
-            isLoadingOptions: w,
+            inputRef: w,
+            isLoadingOptions: S,
             labelledBy: C,
-            loadingMessage: k,
-            menuStyle: j,
-            name: x,
-            noOptionsMessage: E,
-            onClose: R,
-            onChange: M,
-            onFilterChange: A,
-            onOpen: I,
-            onScroll: B,
-            onScrollBottom: N,
-            placeholder: D,
-            prepend: L,
+            loadingMessage: M,
+            menuStyle: P,
+            name: k,
+            noOptionsMessage: x,
+            onClose: N,
+            onChange: V,
+            onFilterChange: B,
+            onOpen: E,
+            onScroll: F,
+            onScrollBottom: I,
+            placeholder: q,
+            prepend: D,
             repositionMode: T,
-            showSelectedValuesFirst: _,
-            tabConfirmsNewValue: K,
-            virtualization: $
-        }, z);
-        var J = (0, r.useMemo)((function() {
+            showSelectedValuesFirst: H,
+            tabConfirmsNewValue: $,
+            virtualization: K
+        }, W);
+        var Q = (0, r.useMemo)((function() {
             return {
                 defaultValues: f
             };
         }), [ f ]);
-        var Q = (0, r.useMemo)((function() {
+        var Y = (0, r.useMemo)((function() {
             return {
-                values: H
+                values: z
             };
-        }), [ H ]);
-        var Y = (0, r.useMemo)((function() {
-            return W ? Q : J;
-        }), [ J, W, Q ]);
-        var Z = {
-            filter: y,
-            selectAllAppearance: F,
-            showSelectedValuesFirst: _,
-            virtualization: $
+        }), [ z ]);
+        var Z = (0, r.useMemo)((function() {
+            return U ? Y : Q;
+        }), [ Q, U, Y ]);
+        var ee = {
+            filter: g,
+            selectAllAppearance: _,
+            showSelectedValuesFirst: H,
+            virtualization: K
         };
         if (l) {
             
-            return t().createElement(Kn, Kr({
+            return t().createElement(R, Ue({
                 "data-test": "multiselect"
-            }, Y, Z, G));
+            }, Z, ee, J));
         }
         
-        return t().createElement(Fr, Kr({
+        return t().createElement(Ke, Ue({
             "data-test": "multiselect"
-        }, Y, G));
+        }, Z, J));
     }
     // TODO: SUI-3402, this can be removed when ControlGroup no longer needs to inspect componentType
-        Zr.componentType = "Multiselect";
-    Zr.Option = M;
-    Zr.Heading = u.Heading;
-    Zr.Divider = u.Divider;
-    Zr.propTypes = Jr;
-    /* harmony default export */    const et = Zr;
+        on.componentType = "Multiselect";
+    on.Option = h;
+    on.Heading = u.Heading;
+    on.Divider = u.Divider;
+    on.propTypes = nn;
+    /* harmony default export */    const an = on;
     // CONCATENATED MODULE: ./src/Multiselect/index.ts
     module.exports = n;
     /******/})();