@splunk/react-ui 4.20.0 → 4.21.1

package/DualListbox.js

@@ -1,1783 +1,1528 @@
-module.exports =
-/******/ (function(modules) { // webpackBootstrap
-/******/ 	// The module cache
-/******/ 	var installedModules = {};
-/******/
-/******/ 	// The require function
-/******/ 	function __webpack_require__(moduleId) {
-/******/
-/******/ 		// Check if module is in cache
-/******/ 		if(installedModules[moduleId]) {
-/******/ 			return installedModules[moduleId].exports;
-/******/ 		}
-/******/ 		// Create a new module (and put it into the cache)
-/******/ 		var module = installedModules[moduleId] = {
-/******/ 			i: moduleId,
-/******/ 			l: false,
-/******/ 			exports: {}
-/******/ 		};
-/******/
-/******/ 		// Execute the module function
-/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
-/******/
-/******/ 		// Flag the module as loaded
-/******/ 		module.l = true;
-/******/
-/******/ 		// Return the exports of the module
-/******/ 		return module.exports;
-/******/ 	}
-/******/
-/******/
-/******/ 	// expose the modules object (__webpack_modules__)
-/******/ 	__webpack_require__.m = modules;
-/******/
-/******/ 	// expose the module cache
-/******/ 	__webpack_require__.c = installedModules;
-/******/
-/******/ 	// define getter function for harmony exports
-/******/ 	__webpack_require__.d = function(exports, name, getter) {
-/******/ 		if(!__webpack_require__.o(exports, name)) {
-/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
-/******/ 		}
-/******/ 	};
-/******/
-/******/ 	// define __esModule on exports
-/******/ 	__webpack_require__.r = function(exports) {
-/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
-/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-/******/ 		}
-/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
-/******/ 	};
-/******/
-/******/ 	// create a fake namespace object
-/******/ 	// mode & 1: value is a module id, require it
-/******/ 	// mode & 2: merge all properties of value into the ns
-/******/ 	// mode & 4: return value when already ns object
-/******/ 	// mode & 8|1: behave like require
-/******/ 	__webpack_require__.t = function(value, mode) {
-/******/ 		if(mode & 1) value = __webpack_require__(value);
-/******/ 		if(mode & 8) return value;
-/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
-/******/ 		var ns = Object.create(null);
-/******/ 		__webpack_require__.r(ns);
-/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
-/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
-/******/ 		return ns;
-/******/ 	};
-/******/
-/******/ 	// getDefaultExport function for compatibility with non-harmony modules
-/******/ 	__webpack_require__.n = function(module) {
-/******/ 		var getter = module && module.__esModule ?
-/******/ 			function getDefault() { return module['default']; } :
-/******/ 			function getModuleExports() { return module; };
-/******/ 		__webpack_require__.d(getter, 'a', getter);
-/******/ 		return getter;
-/******/ 	};
-/******/
-/******/ 	// Object.prototype.hasOwnProperty.call
-/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
-/******/
-/******/ 	// __webpack_public_path__
-/******/ 	__webpack_require__.p = "";
-/******/
-/******/
-/******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 171);
-/******/ })
-/************************************************************************/
-/******/ ({
-
-/***/ 0:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/themes");
-
-/***/ }),
-
-/***/ 1:
-/***/ (function(module, exports) {
-
-module.exports = require("prop-types");
-
-/***/ }),
-
-/***/ 12:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/Clickable");
-
-/***/ }),
-
-/***/ 14:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/ScreenReaderContent");
-
-/***/ }),
-
-/***/ 171:
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-// ESM COMPAT FLAG
-__webpack_require__.r(__webpack_exports__);
-
-// EXPORTS
-__webpack_require__.d(__webpack_exports__, "default", function() { return /* reexport */ DualListbox_DualListbox; });
-__webpack_require__.d(__webpack_exports__, "Option", function() { return /* reexport */ DualListbox_Option; });
-
-// EXTERNAL MODULE: external "react"
-var external_react_ = __webpack_require__(2);
-var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
-
-// EXTERNAL MODULE: external "prop-types"
-var external_prop_types_ = __webpack_require__(1);
-var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
-
-// EXTERNAL MODULE: external "@splunk/ui-utils/i18n"
-var i18n_ = __webpack_require__(4);
-
-// EXTERNAL MODULE: external "@splunk/ui-utils/keyboard"
-var keyboard_ = __webpack_require__(7);
-
-// EXTERNAL MODULE: external "@splunk/react-icons/enterprise/ChevronLeft"
-var ChevronLeft_ = __webpack_require__(66);
-var ChevronLeft_default = /*#__PURE__*/__webpack_require__.n(ChevronLeft_);
-
-// EXTERNAL MODULE: external "@splunk/react-icons/enterprise/ChevronRight"
-var ChevronRight_ = __webpack_require__(38);
-var ChevronRight_default = /*#__PURE__*/__webpack_require__.n(ChevronRight_);
-
-// EXTERNAL MODULE: external "@splunk/ui-utils/format"
-var format_ = __webpack_require__(29);
-
-// EXTERNAL MODULE: external "@splunk/react-ui/useForceUpdate"
-var useForceUpdate_ = __webpack_require__(48);
-var useForceUpdate_default = /*#__PURE__*/__webpack_require__.n(useForceUpdate_);
-
-// EXTERNAL MODULE: external "@splunk/react-ui/ScreenReaderContent"
-var ScreenReaderContent_ = __webpack_require__(14);
-var ScreenReaderContent_default = /*#__PURE__*/__webpack_require__.n(ScreenReaderContent_);
-
-// CONCATENATED MODULE: ./src/DualListbox/DualListboxContext.tsx
-
-
-/**
+/******/ (() => {
+    // webpackBootstrap
+    /******/ "use strict";
+    /******/ // The require scope
+    /******/    var e = {};
+    /******/
+    /************************************************************************/
+    /******/ /* webpack/runtime/compat get default export */
+    /******/    (() => {
+        /******/ // getDefaultExport function for compatibility with non-harmony modules
+        /******/ e.n = r => {
+            /******/ var t = r && r.__esModule ? 
+            /******/ () => r["default"]
+            /******/ : () => r
+            /******/;
+            e.d(t, {
+                a: t
+            });
+            /******/            return t;
+            /******/        };
+        /******/    })();
+    /******/
+    /******/ /* webpack/runtime/define property getters */
+    /******/    (() => {
+        /******/ // define getter functions for harmony exports
+        /******/ e.d = (r, t) => {
+            /******/ for (var n in t) {
+                /******/ if (e.o(t, n) && !e.o(r, n)) {
+                    /******/ Object.defineProperty(r, n, {
+                        enumerable: true,
+                        get: t[n]
+                    });
+                    /******/                }
+                /******/            }
+            /******/        };
+        /******/    })();
+    /******/
+    /******/ /* webpack/runtime/hasOwnProperty shorthand */
+    /******/    (() => {
+        /******/ e.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
+        /******/;
+    })();
+    /******/
+    /******/ /* webpack/runtime/make namespace object */
+    /******/    (() => {
+        /******/ // define __esModule on exports
+        /******/ e.r = e => {
+            /******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
+                /******/ Object.defineProperty(e, Symbol.toStringTag, {
+                    value: "Module"
+                });
+                /******/            }
+            /******/            Object.defineProperty(e, "__esModule", {
+                value: true
+            });
+            /******/        };
+        /******/    })();
+    /******/
+    /************************************************************************/    var r = {};
+    // ESM COMPAT FLAG
+        e.r(r);
+    // EXPORTS
+        e.d(r, {
+        Option: () => /* reexport */ ne,
+        default: () => /* reexport */ De
+    });
+    // CONCATENATED MODULE: external "react"
+    const t = require("react");
+    var n =  e.n(t);
+    // CONCATENATED MODULE: external "prop-types"
+    const a = require("prop-types");
+    var i =  e.n(a);
+    // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
+    const l = require("@splunk/ui-utils/i18n");
+    // CONCATENATED MODULE: external "@splunk/ui-utils/keyboard"
+    const o = require("@splunk/ui-utils/keyboard");
+    // CONCATENATED MODULE: external "@splunk/react-icons/enterprise/ChevronLeft"
+    const u = require("@splunk/react-icons/enterprise/ChevronLeft");
+    var c =  e.n(u);
+    // CONCATENATED MODULE: external "@splunk/react-icons/enterprise/ChevronRight"
+    const s = require("@splunk/react-icons/enterprise/ChevronRight");
+    var v =  e.n(s);
+    // CONCATENATED MODULE: external "@splunk/ui-utils/format"
+    const d = require("@splunk/ui-utils/format");
+    // CONCATENATED MODULE: external "@splunk/react-ui/useForceUpdate"
+    const f = require("@splunk/react-ui/useForceUpdate");
+    var p =  e.n(f);
+    // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
+    const b = require("@splunk/react-ui/ScreenReaderContent");
+    var m =  e.n(b);
+    // CONCATENATED MODULE: ./src/DualListbox/DualListboxContext.tsx
+    /**
  * A React context used to inform subcomponets of DualListbox of parent component values.
  * The context interface is `DualListboxContextValue`.
  * Defaults to `'{}'`.
  * @public
  */
-var DualListboxContext = /*#__PURE__*/external_react_default.a.createContext({});
-/* harmony default export */ var DualListbox_DualListboxContext = (DualListboxContext);
-// CONCATENATED MODULE: ./src/DualListbox/ScreenReaderWrapper.tsx
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-
-
-
-
-
-function ScreenReaderWrapper(_ref) {
-  var otherProps = _extends({}, _ref);
-
-  var forceUpdate = useForceUpdate_default()();
-  var contextValue = Object(external_react_["useContext"])(DualListbox_DualListboxContext);
-  var getScreenReaderMessage = contextValue.getScreenReaderMessage,
-      updateScreenReaderRefreshHook = contextValue.updateScreenReaderRefreshHook;
-  Object(external_react_["useEffect"])(function () {
-    updateScreenReaderRefreshHook === null || updateScreenReaderRefreshHook === void 0 ? void 0 : updateScreenReaderRefreshHook(forceUpdate);
-    return function () {
-      return updateScreenReaderRefreshHook === null || updateScreenReaderRefreshHook === void 0 ? void 0 : updateScreenReaderRefreshHook();
-    };
-  }, [updateScreenReaderRefreshHook, forceUpdate]);
-
-  if (!getScreenReaderMessage) {
-    return null;
-  }
-
-  return /*#__PURE__*/external_react_default.a.createElement(ScreenReaderContent_default.a, _extends({
-    "aria-live": "assertive"
-  }, otherProps), getScreenReaderMessage() || '');
-}
-
-/* harmony default export */ var DualListbox_ScreenReaderWrapper = (ScreenReaderWrapper);
-// CONCATENATED MODULE: ./src/DualListbox/listboxUtils.ts
-var arrayWithToggledValue = function arrayWithToggledValue(valueArr, toggleValue) {
-  var newArray = valueArr.filter(function (value) {
-    return value !== toggleValue;
-  });
-
-  if (valueArr.length === newArray.length) {
-    newArray.push(toggleValue);
-  }
-
-  return newArray;
-};
-
-var arrayWithRemovedValues = function arrayWithRemovedValues(valueArr, removedValues) {
-  var removedSet = new Set(removedValues);
-  return valueArr.filter(function (value) {
-    return !removedSet.has(value);
-  });
-};
-
-var findNextValue = function findNextValue(index, originalValues, removedValues) {
-  if (index < 0) {
-    return undefined;
-  }
-
-  var currentValue = originalValues[index];
-  var removedSet = new Set(removedValues);
-
-  if (!removedSet.has(currentValue)) {
-    return currentValue;
-  }
-
-  for (var i = index + 1; i < originalValues.length; i += 1) {
-    var tempValue = originalValues[i];
-
-    if (!removedSet.has(tempValue)) {
-      return tempValue;
+    var h =  n().createContext({});
+    /* harmony default export */    const g = h;
+    // CONCATENATED MODULE: ./src/DualListbox/ScreenReaderWrapper.tsx
+    function y() {
+        y = Object.assign || function(e) {
+            for (var r = 1; r < arguments.length; r++) {
+                var t = arguments[r];
+                for (var n in t) {
+                    if (Object.prototype.hasOwnProperty.call(t, n)) {
+                        e[n] = t[n];
+                    }
+                }
+            }
+            return e;
+        };
+        return y.apply(this, arguments);
     }
-  }
-
-  for (var _i = index - 1; _i > 0; _i -= 1) {
-    var _tempValue = originalValues[_i];
-
-    if (!removedSet.has(_tempValue)) {
-      return _tempValue;
+    function k(e) {
+        var r = y({}, e);
+        var a = p()();
+        var i = (0, t.useContext)(g);
+        var l = i.getScreenReaderMessage, o = i.updateScreenReaderRefreshHook;
+        (0, t.useEffect)((function() {
+            o === null || o === void 0 ? void 0 : o(a);
+            return function() {
+                return o === null || o === void 0 ? void 0 : o();
+            };
+        }), [ o, a ]);
+        if (!l) {
+            return null;
+        }
+        
+        return n().createElement(m(), y({
+            "aria-live": "assertive"
+        }, r), l() || "");
     }
-  }
-
-  return undefined;
-};
-
-
-// EXTERNAL MODULE: ./src/utils/scrollIntoViewIfNeeded.ts
-var scrollIntoViewIfNeeded = __webpack_require__(91);
-
-// EXTERNAL MODULE: ./src/utils/fuzzyMatch.ts
-var fuzzyMatch = __webpack_require__(59);
-
-// CONCATENATED MODULE: ./src/DualListbox/ToolbarContext.tsx
-
-
-/**
+    /* harmony default export */    const C = k;
+    // CONCATENATED MODULE: ./src/DualListbox/listboxUtils.ts
+    var x = function e(r, t) {
+        var n = r.filter((function(e) {
+            return e !== t;
+        }));
+        if (r.length === n.length) {
+            n.push(t);
+        }
+        return n;
+    };
+    var S = function e(r, t) {
+        var n = new Set(t);
+        return r.filter((function(e) {
+            return !n.has(e);
+        }));
+    };
+    var w = function e(r, t, n) {
+        if (r < 0) {
+            return undefined;
+        }
+        var a = t[r];
+        var i = new Set(n);
+        if (!i.has(a)) {
+            return a;
+        }
+        for (var l = r + 1; l < t.length; l += 1) {
+            var o = t[l];
+            if (!i.has(o)) {
+                return o;
+            }
+        }
+        for (var u = r - 1; u > 0; u -= 1) {
+            var c = t[u];
+            if (!i.has(c)) {
+                return c;
+            }
+        }
+        return undefined;
+    };
+    // CONCATENATED MODULE: ./src/utils/scrollIntoViewIfNeeded.ts
+    // A utility that attempts to move an element into view by scrolling it's derived parent.
+    var O = function e(r) {
+        if (!r) {
+            return;
+        }
+        var t = r.offsetParent;
+        if (!t) {
+            return;
+        }
+ // Below the bottom of the container.
+                if (t.scrollTop + t.clientHeight < r.offsetTop + r.clientHeight) {
+            t.scrollTop = r.offsetTop + r.clientHeight - t.clientHeight;
+ // Above the top of the container.
+                } else if (t.scrollTop > r.offsetTop) {
+            t.scrollTop = r.offsetTop;
+        }
+    };
+    // CONCATENATED MODULE: ./src/utils/fuzzyMatch.ts
+    // A utility for matching keyboard characters to list values
+    var R = function e(r, t) {
+        return r ? r.label.charAt(t).toLowerCase() : "";
+    };
+    var E = function e(r, t) {
+        if (!r.length) {
+            return r;
+        }
+        var n = null;
+        var a = false;
+        var i = r.filter((function(e) {
+            var r = R(e, t.index);
+            if (r === t.value) {
+                a = 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 (!a) {
+                var i = R(n, t.index);
+                if (!i) {
+                    n = e;
+                } else if (r > t.value) {
+                    if (i < t.value) {
+                        n = e;
+                    } else if (i > r) {
+                        n = e;
+                    }
+                } else if (r > i) {
+                    n = e;
+                }
+            }
+            return false;
+        }));
+        return i.length === 0 && n ? [ n ] : i;
+    };
+    // CONCATENATED MODULE: ./src/DualListbox/ToolbarContext.tsx
+    /**
  * A React context used to inform subcomponets of Toolbar of parent component values.
  * The context interface is `ToolbarContextValue`.
  * Defaults to `'{}'`.
  * @public
  */
-var ToolbarContext = /*#__PURE__*/external_react_default.a.createContext({});
-/* harmony default export */ var DualListbox_ToolbarContext = (ToolbarContext);
-// EXTERNAL MODULE: external "@splunk/react-ui/Tooltip"
-var Tooltip_ = __webpack_require__(45);
-var Tooltip_default = /*#__PURE__*/__webpack_require__.n(Tooltip_);
-
-// EXTERNAL MODULE: external "styled-components"
-var external_styled_components_ = __webpack_require__(3);
-var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
-
-// EXTERNAL MODULE: external "@splunk/themes"
-var themes_ = __webpack_require__(0);
-
-// EXTERNAL MODULE: external "@splunk/react-ui/Clickable"
-var Clickable_ = __webpack_require__(12);
-var Clickable_default = /*#__PURE__*/__webpack_require__.n(Clickable_);
-
-// CONCATENATED MODULE: ./src/DualListbox/ToolbarButtonStyles.ts
-
-
-
-var StyledClickable = external_styled_components_default()(Clickable_default.a).withConfig({
-  displayName: "ToolbarButtonStyles__StyledClickable",
-  componentId: "k7zksz-0"
-})(["", " border:", ";border-radius:", ";box-sizing:border-box;cursor:pointer;flex-grow:1;font-weight:", ";line-height:", ";min-height:", ";min-width:", ";max-width:100%;padding:", ";position:relative;text-align:center;text-decoration:none;vertical-align:middle;white-space:nowrap;width:", ";&:active{transition:none;}&:focus{box-shadow:", ";}&:focus,&:hover{z-index:3;}", ";"], themes_["mixins"].reset('block'), Object(themes_["pick"])({
-  enterprise: '1px solid transparent'
-}), themes_["variables"].borderRadius, Object(themes_["pick"])({
-  enterprise: themes_["variables"].fontWeightSemiBold,
-  prisma: themes_["variables"].fontWeightSemiBold
-}), themes_["variables"].lineHeight, themes_["variables"].inputHeight, themes_["variables"].inputHeight, Object(themes_["pick"])({
-  enterprise: {
-    comfortable: '0 5px',
-    compact: '0 2px'
-  },
-  prisma: {
-    comfortable: Object(external_styled_components_["css"])(["0px calc(", " / 2 - 1px)"], themes_["variables"].inputHeight),
-    compact: Object(external_styled_components_["css"])(["0px calc(", " / 2 - 1px)"], themes_["variables"].inputHeight)
-  }
-}), themes_["variables"].inputHeight, themes_["variables"].focusShadow, Object(themes_["pickVariant"])('$disabled', {
-  "false": Object(themes_["pick"])({
-    enterprise: Object(external_styled_components_["css"])(["color:", ";transition:background-color 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;&:hover{background-color:", ";border-color:", ";color:", ";}&:active{background-color:", ";transition:none;}&:focus{color:", ";}"], Object(themes_["pick"])({
-      light: themes_["variables"].gray45,
-      dark: themes_["variables"].white
-    }), themes_["variables"].backgroundColorHover, Object(themes_["pick"])({
-      light: themes_["variables"].gray60,
-      dark: themes_["variables"].borderColor
-    }), Object(themes_["pick"])({
-      light: themes_["variables"].linkColor,
-      dark: themes_["variables"].white
-    }), Object(themes_["pick"])({
-      light: themes_["variables"].gray92,
-      dark: themes_["variables"].gray22
-    }), Object(themes_["pick"])({
-      light: themes_["variables"].linkColor,
-      dark: themes_["variables"].white
-    })),
-    prisma: Object(external_styled_components_["css"])(["color:", ";transition:background-image 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;&:hover{background-color:", ";border-color:", ";box-shadow:", ";}&:active{background-color:", ";transition:none;}&:focus{&:active{background-color:", ";}}"], themes_["variables"].contentColorActive, themes_["variables"].interactiveColorOverlayHover, themes_["variables"].interactiveColorBorderHover, themes_["variables"].hoverShadow, themes_["variables"].interactiveColorOverlayActive, themes_["variables"].interactiveColorOverlayActive)
-  }),
-  "true": Object(external_styled_components_["css"])(["border-color:", ";color:", ";cursor:not-allowed;"], Object(themes_["pick"])({
-    prisma: themes_["variables"].interactiveColorBorderDisabled
-  }), Object(themes_["pick"])({
-    enterprise: themes_["variables"].textDisabledColor,
-    prisma: themes_["variables"].contentColorDisabled
-  }))
-}));
-var StyledIcon = external_styled_components_default.a.span.withConfig({
-  displayName: "ToolbarButtonStyles__StyledIcon",
-  componentId: "k7zksz-1"
-})(["align-items:center;display:flex;flex-direction:row;flex-shrink:0;font-size:", ";justify-content:center;max-width:100%;"], Object(themes_["pick"])({
-  enterprise: 'inherit',
-  prisma: {
-    comfortable: '21px',
-    compact: '16px'
-  }
-}));
-
-// CONCATENATED MODULE: ./src/DualListbox/ToolbarButton.tsx
-function ToolbarButton_extends() { ToolbarButton_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return ToolbarButton_extends.apply(this, arguments); }
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-
-
-
-
-
-
-var propTypes = {
-  icon: external_prop_types_default.a.node.isRequired,
-  name: external_prop_types_default.a.string.isRequired,
-  tooltipLabel: external_prop_types_default.a.string.isRequired,
-  tooltipPlacement: external_prop_types_default.a.oneOf(['above', 'below', 'left', 'right'])
-};
-
-function ToolbarButton(_ref) {
-  var ariaLabel = _ref.ariaLabel,
-      ariaKeyShortcuts = _ref.ariaKeyShortcuts,
-      icon = _ref.icon,
-      name = _ref.name,
-      tooltipLabel = _ref.tooltipLabel,
-      tooltipPlacement = _ref.tooltipPlacement,
-      otherProps = _objectWithoutProperties(_ref, ["ariaLabel", "ariaKeyShortcuts", "icon", "name", "tooltipLabel", "tooltipPlacement"]);
-
-  var contextValue = Object(external_react_["useContext"])(DualListbox_ToolbarContext);
-  var forceUpdate = useForceUpdate_default()();
-  var getButtonState = contextValue.getButtonState,
-      onButtonClick = contextValue.onButtonClick,
-      updateButtonRefreshHookByName = contextValue.updateButtonRefreshHookByName;
-  Object(external_react_["useEffect"])(function () {
-    updateButtonRefreshHookByName === null || updateButtonRefreshHookByName === void 0 ? void 0 : updateButtonRefreshHookByName(name, forceUpdate);
-    return function () {
-      return updateButtonRefreshHookByName === null || updateButtonRefreshHookByName === void 0 ? void 0 : updateButtonRefreshHookByName(name);
+    var I =  n().createContext({});
+    /* harmony default export */    const L = I;
+    // CONCATENATED MODULE: external "@splunk/react-ui/Tooltip"
+    const q = require("@splunk/react-ui/Tooltip");
+    var j =  e.n(q);
+    // CONCATENATED MODULE: external "styled-components"
+    const _ = require("styled-components");
+    var D =  e.n(_);
+    // CONCATENATED MODULE: external "@splunk/themes"
+    const N = require("@splunk/themes");
+    // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
+    const V = require("@splunk/react-ui/Clickable");
+    var P =  e.n(V);
+    // CONCATENATED MODULE: ./src/DualListbox/ToolbarButtonStyles.ts
+    var H = D()(P()).withConfig({
+        displayName: "ToolbarButtonStyles__StyledClickable",
+        componentId: "k7zksz-0"
+    })([ "", " border:", ";border-radius:", ";box-sizing:border-box;cursor:pointer;flex-grow:1;font-weight:", ";line-height:", ";min-height:", ";min-width:", ";max-width:100%;padding:", ";position:relative;text-align:center;text-decoration:none;vertical-align:middle;white-space:nowrap;width:", ";&:active{transition:none;}&:focus{box-shadow:", ";}&:focus,&:hover{z-index:3;}", ";" ], N.mixins.reset("block"), (0, 
+    N.pick)({
+        enterprise: "1px solid transparent"
+    }), N.variables.borderRadius, (0, N.pick)({
+        enterprise: N.variables.fontWeightSemiBold,
+        prisma: N.variables.fontWeightSemiBold
+    }), N.variables.lineHeight, N.variables.inputHeight, N.variables.inputHeight, (0, 
+    N.pick)({
+        enterprise: {
+            comfortable: "0 5px",
+            compact: "0 2px"
+        },
+        prisma: {
+            comfortable: (0, _.css)([ "0px calc(", " / 2 - 1px)" ], N.variables.inputHeight),
+            compact: (0, _.css)([ "0px calc(", " / 2 - 1px)" ], N.variables.inputHeight)
+        }
+    }), N.variables.inputHeight, N.variables.focusShadow, (0, N.pickVariant)("$disabled", {
+        false: (0, N.pick)({
+            enterprise: (0, _.css)([ "color:", ";transition:background-color 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;&:hover{background-color:", ";border-color:", ";color:", ";}&:active{background-color:", ";transition:none;}&:focus{color:", ";}" ], (0, 
+            N.pick)({
+                light: N.variables.gray45,
+                dark: N.variables.white
+            }), N.variables.backgroundColorHover, (0, N.pick)({
+                light: N.variables.gray60,
+                dark: N.variables.borderColor
+            }), (0, N.pick)({
+                light: N.variables.linkColor,
+                dark: N.variables.white
+            }), (0, N.pick)({
+                light: N.variables.gray92,
+                dark: N.variables.gray22
+            }), (0, N.pick)({
+                light: N.variables.linkColor,
+                dark: N.variables.white
+            })),
+            prisma: (0, _.css)([ "color:", ";transition:background-image 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;&:hover{background-color:", ";border-color:", ";box-shadow:", ";}&:active{background-color:", ";transition:none;}&:focus{&:active{background-color:", ";}}" ], N.variables.contentColorActive, N.variables.interactiveColorOverlayHover, N.variables.interactiveColorBorderHover, N.variables.hoverShadow, N.variables.interactiveColorOverlayActive, N.variables.interactiveColorOverlayActive)
+        }),
+        true: (0, _.css)([ "border-color:", ";color:", ";cursor:not-allowed;" ], (0, N.pick)({
+            prisma: N.variables.interactiveColorBorderDisabled
+        }), (0, N.pick)({
+            enterprise: N.variables.textDisabledColor,
+            prisma: N.variables.contentColorDisabled
+        }))
+    }));
+    var T = D().span.withConfig({
+        displayName: "ToolbarButtonStyles__StyledIcon",
+        componentId: "k7zksz-1"
+    })([ "align-items:center;display:flex;flex-direction:row;flex-shrink:0;font-size:", ";justify-content:center;max-width:100%;" ], (0, 
+    N.pick)({
+        enterprise: "inherit",
+        prisma: {
+            comfortable: "21px",
+            compact: "16px"
+        }
+    }));
+    // CONCATENATED MODULE: ./src/DualListbox/ToolbarButton.tsx
+    function B() {
+        B = Object.assign || function(e) {
+            for (var r = 1; r < arguments.length; r++) {
+                var t = arguments[r];
+                for (var n in t) {
+                    if (Object.prototype.hasOwnProperty.call(t, n)) {
+                        e[n] = t[n];
+                    }
+                }
+            }
+            return e;
+        };
+        return B.apply(this, arguments);
+    }
+    function M(e, r) {
+        if (e == null) return {};
+        var t = A(e, r);
+        var n, a;
+        if (Object.getOwnPropertySymbols) {
+            var i = Object.getOwnPropertySymbols(e);
+            for (a = 0; a < i.length; a++) {
+                n = i[a];
+                if (r.indexOf(n) >= 0) continue;
+                if (!Object.prototype.propertyIsEnumerable.call(e, n)) continue;
+                t[n] = e[n];
+            }
+        }
+        return t;
+    }
+    function A(e, r) {
+        if (e == null) return {};
+        var t = {};
+        var n = Object.keys(e);
+        var a, i;
+        for (i = 0; i < n.length; i++) {
+            a = n[i];
+            if (r.indexOf(a) >= 0) continue;
+            t[a] = e[a];
+        }
+        return t;
+    }
+    var K = {
+        icon: i().node.isRequired,
+        name: i().string.isRequired,
+        tooltipLabel: i().string.isRequired,
+        tooltipPlacement: i().oneOf([ "above", "below", "left", "right" ])
     };
-  }, [name, updateButtonRefreshHookByName, forceUpdate]);
-  var handleClick = Object(external_react_["useCallback"])(function (event) {
-    onButtonClick === null || onButtonClick === void 0 ? void 0 : onButtonClick(event, {
-      name: name
-    });
-  }, [onButtonClick, name]);
-
-  if (!getButtonState) {
-    return null;
-  }
-
-  var _getButtonState = getButtonState(name),
-      disabled = _getButtonState.disabled;
-
-  return /*#__PURE__*/external_react_default.a.createElement(Tooltip_default.a, {
-    defaultPlacement: tooltipPlacement,
-    content: /*#__PURE__*/external_react_default.a.createElement("span", {
-      "aria-hidden": true
-    }, tooltipLabel)
-  }, /*#__PURE__*/external_react_default.a.createElement(StyledClickable, ToolbarButton_extends({
-    "aria-label": ariaLabel,
-    "aria-keyshortcuts": ariaKeyShortcuts,
-    "aria-disabled": disabled || undefined,
-    "data-test": "toolbar-button",
-    $disabled: disabled,
-    onClick: !disabled ? handleClick : undefined
-  }, otherProps), /*#__PURE__*/external_react_default.a.createElement(StyledIcon, null, icon)));
-}
-
-ToolbarButton.propsTypes = propTypes;
-/* harmony default export */ var DualListbox_ToolbarButton = (ToolbarButton);
-// EXTERNAL MODULE: external "@splunk/react-ui/Switch"
-var Switch_ = __webpack_require__(39);
-var Switch_default = /*#__PURE__*/__webpack_require__.n(Switch_);
-
-// CONCATENATED MODULE: ./src/DualListbox/OptionStyles.ts
-
-
-
-var StyledListItem = external_styled_components_default.a.li.withConfig({
-  displayName: "OptionStyles__StyledListItem",
-  componentId: "q275d9-0"
-})(["align-items:center;color:", ";cursor:pointer;display:flex;overflow:hidden;width:100%;word-wrap:break-word;", " ", ""], themes_["variables"].contentColorActive, Object(themes_["pickVariant"])('$active', {
-  "true": Object(external_styled_components_["css"])(["", ""], Object(themes_["pick"])({
-    prisma: Object(external_styled_components_["css"])(["background:", ";"], themes_["variables"].interactiveColorOverlaySelected),
-    enterprise: {
-      light: Object(external_styled_components_["css"])(["background:", ";"], themes_["variables"].accentColorL50),
-      dark: Object(external_styled_components_["css"])(["background:", ";"], themes_["variables"].accentColorD50)
+    function $(e) {
+        var r = e.ariaLabel, a = e.ariaKeyShortcuts, i = e.icon, l = e.name, o = e.tooltipLabel, u = e.tooltipPlacement, c = M(e, [ "ariaLabel", "ariaKeyShortcuts", "icon", "name", "tooltipLabel", "tooltipPlacement" ]);
+        var s = (0, t.useContext)(L);
+        var v = p()();
+        var d = s.getButtonState, f = s.onButtonClick, b = s.updateButtonRefreshHookByName;
+        (0, t.useEffect)((function() {
+            b === null || b === void 0 ? void 0 : b(l, v);
+            return function() {
+                return b === null || b === void 0 ? void 0 : b(l);
+            };
+        }), [ l, b, v ]);
+        var m = (0, t.useCallback)((function(e) {
+            f === null || f === void 0 ? void 0 : f(e, {
+                name: l
+            });
+        }), [ f, l ]);
+        if (!d) {
+            return null;
+        }
+        var h = d(l), g = h.disabled;
+        
+        return n().createElement(j(), {
+            defaultPlacement: u,
+            content:  n().createElement("span", {
+                "aria-hidden": true
+            }, o)
+        },  n().createElement(H, B({
+            "aria-label": r,
+            "aria-keyshortcuts": a,
+            "aria-disabled": g || undefined,
+            "data-test": "toolbar-button",
+            $disabled: g,
+            onClick: !g ? m : undefined
+        }, c),  n().createElement(T, null, i)));
     }
-  }))
-}), Object(themes_["pick"])({
-  prisma: Object(themes_["pickVariant"])('$selected', {
-    "true": Object(external_styled_components_["css"])(["&:hover{background:", ";}"], themes_["mixins"].overlayColors(themes_["variables"].interactiveColorOverlaySelected, themes_["variables"].interactiveColorOverlayHover)),
-    "false": Object(external_styled_components_["css"])(["&:hover{background:", ";}"], themes_["variables"].interactiveColorOverlayHover)
-  }),
-  enterprise: Object(external_styled_components_["css"])(["&:hover{background:", ";}"], themes_["variables"].backgroundColorHover)
-}));
-var StyledSwtich = external_styled_components_default()(Switch_default.a).withConfig({
-  displayName: "OptionStyles__StyledSwtich",
-  componentId: "q275d9-1"
-})(["padding-left:", ";"], themes_["variables"].spacingSmall);
-var StyledDiv = external_styled_components_default.a.div.withConfig({
-  displayName: "OptionStyles__StyledDiv",
-  componentId: "q275d9-2"
-})(["padding:", ";word-break:break-word;word-wrap:break-word;"], Object(themes_["pick"])({
-  prisma: {
-    compact: Object(external_styled_components_["css"])(["6px ", ""], themes_["variables"].spacingSmall),
-    comfortable: Object(external_styled_components_["css"])(["10px ", ""], themes_["variables"].spacingSmall)
-  },
-  enterprise: Object(external_styled_components_["css"])(["6px ", ""], themes_["variables"].spacingSmall)
-}));
-
-// CONCATENATED MODULE: ./src/DualListbox/ListboxContext.tsx
-
-
-/**
+    $.propsTypes = K;
+    /* harmony default export */    const F = $;
+    // CONCATENATED MODULE: external "@splunk/react-ui/Switch"
+    const z = require("@splunk/react-ui/Switch");
+    var U =  e.n(z);
+    // CONCATENATED MODULE: ./src/DualListbox/OptionStyles.ts
+    var W = D().li.withConfig({
+        displayName: "OptionStyles__StyledListItem",
+        componentId: "q275d9-0"
+    })([ "align-items:center;color:", ";cursor:pointer;display:flex;overflow:hidden;width:100%;word-wrap:break-word;", " ", "" ], N.variables.contentColorActive, (0, 
+    N.pickVariant)("$active", {
+        true: (0, _.css)([ "", "" ], (0, N.pick)({
+            prisma: (0, _.css)([ "background:", ";" ], N.variables.interactiveColorOverlaySelected),
+            enterprise: {
+                light: (0, _.css)([ "background:", ";" ], N.variables.accentColorL50),
+                dark: (0, _.css)([ "background:", ";" ], N.variables.accentColorD50)
+            }
+        }))
+    }), (0, N.pick)({
+        prisma: (0, N.pickVariant)("$selected", {
+            true: (0, _.css)([ "&:hover{background:", ";}" ], N.mixins.overlayColors(N.variables.interactiveColorOverlaySelected, N.variables.interactiveColorOverlayHover)),
+            false: (0, _.css)([ "&:hover{background:", ";}" ], N.variables.interactiveColorOverlayHover)
+        }),
+        enterprise: (0, _.css)([ "&:hover{background:", ";}" ], N.variables.backgroundColorHover)
+    }));
+    var X = D()(U()).withConfig({
+        displayName: "OptionStyles__StyledSwtich",
+        componentId: "q275d9-1"
+    })([ "padding-left:", ";" ], N.variables.spacingSmall);
+    var G = D().div.withConfig({
+        displayName: "OptionStyles__StyledDiv",
+        componentId: "q275d9-2"
+    })([ "padding:", ";word-break:break-word;word-wrap:break-word;" ], (0, N.pick)({
+        prisma: {
+            compact: (0, _.css)([ "6px ", "" ], N.variables.spacingSmall),
+            comfortable: (0, _.css)([ "10px ", "" ], N.variables.spacingSmall)
+        },
+        enterprise: (0, _.css)([ "6px ", "" ], N.variables.spacingSmall)
+    }));
+    // CONCATENATED MODULE: ./src/DualListbox/ListboxContext.tsx
+    /**
  * A React context used to inform subcomponets of Listbox of parent component values.
  * The context interface is `ListboxContextValue`.
  * Defaults to `'{}'`.
  * @public
  */
-var ListboxContext = /*#__PURE__*/external_react_default.a.createContext({});
-/* harmony default export */ var DualListbox_ListboxContext = (ListboxContext);
-// CONCATENATED MODULE: ./src/DualListbox/Option.tsx
-function Option_extends() { Option_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return Option_extends.apply(this, arguments); }
-
-function Option_objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = Option_objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function Option_objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-
-
-
-
-
-var Option_propTypes = {
-  id: external_prop_types_default.a.string.isRequired,
-  label: external_prop_types_default.a.string.isRequired,
-  listName: external_prop_types_default.a.string,
-  selected: external_prop_types_default.a.bool,
-  value: external_prop_types_default.a.string.isRequired
-};
-
-function Option(_ref) {
-  var id = _ref.id,
-      label = _ref.label,
-      selectedProp = _ref.selected,
-      value = _ref.value,
-      otherProps = Option_objectWithoutProperties(_ref, ["id", "label", "selected", "value"]);
-
-  var contextValue = Object(external_react_["useContext"])(DualListbox_ListboxContext);
-  var forceUpdate = useForceUpdate_default()();
-  var onOptionClick = contextValue.onOptionClick,
-      getOptionStateForValue = contextValue.getOptionStateForValue,
-      updateOptionRefreshHookByValue = contextValue.updateOptionRefreshHookByValue,
-      controlled = contextValue.controlled;
-  Object(external_react_["useEffect"])(function () {
-    updateOptionRefreshHookByValue === null || updateOptionRefreshHookByValue === void 0 ? void 0 : updateOptionRefreshHookByValue(value, forceUpdate);
-    return function () {
-      return updateOptionRefreshHookByValue === null || updateOptionRefreshHookByValue === void 0 ? void 0 : updateOptionRefreshHookByValue(value);
-    };
-  }, [value, updateOptionRefreshHookByValue, forceUpdate]);
-  var handleClick = Object(external_react_["useCallback"])(function (event) {
-    onOptionClick === null || onOptionClick === void 0 ? void 0 : onOptionClick(event, {
-      value: value
-    });
-  }, [onOptionClick, value]);
-
-  if (!getOptionStateForValue) {
-    return null;
-  }
-
-  var _getOptionStateForVal = getOptionStateForValue(value),
-      active = _getOptionStateForVal.active,
-      selectedContext = _getOptionStateForVal.selected;
-
-  var selected = !!(controlled ? selectedProp : selectedContext);
-  return /*#__PURE__*/external_react_default.a.createElement(StyledListItem, Option_extends({
-    "aria-selected": selected,
-    "data-test": "option",
-    "data-test-value": value,
-    "data-test-active": active,
-    id: id,
-    onClick: handleClick,
-    role: "option",
-    $active: active,
-    $selected: selected
-  }, otherProps), /*#__PURE__*/external_react_default.a.createElement(StyledSwtich, {
-    interactive: false,
-    selected: selected,
-    appearance: "checkbox"
-  }), /*#__PURE__*/external_react_default.a.createElement(StyledDiv, null, label));
-}
-
-Option.propTypes = Option_propTypes;
-/* harmony default export */ var DualListbox_Option = (Option);
-// EXTERNAL MODULE: external "@splunk/ui-utils/id"
-var id_ = __webpack_require__(8);
-
-// CONCATENATED MODULE: ./src/DualListbox/LabelStyles.ts
-
-
-var StyledLabel = external_styled_components_default.a.label.withConfig({
-  displayName: "LabelStyles__StyledLabel",
-  componentId: "unwplx-0"
-})(["color:", ";flex:0 0 auto;"], themes_["variables"].contentColorActive);
-var StyledLabelContainer = external_styled_components_default.a.div.withConfig({
-  displayName: "LabelStyles__StyledLabelContainer",
-  componentId: "unwplx-1"
-})(["display:flex;flex-direction:column;"]);
-var StyledSwitchContainer = external_styled_components_default.a.div.withConfig({
-  displayName: "LabelStyles__StyledSwitchContainer",
-  componentId: "unwplx-2"
-})(["align-items:center;border:1px solid transparent;display:flex;gap:", ";grid-row:headers;padding:0 ", ";", ""], themes_["variables"].spacingSmall, themes_["variables"].spacingSmall, function (_ref) {
-  var $columnNumber = _ref.$columnNumber;
-  return Object(external_styled_components_["css"])(["grid-column:", ";"], "list".concat($columnNumber));
-});
-
-// CONCATENATED MODULE: ./src/DualListbox/Label.tsx
-
-
-
-
-
-
-
-
-
-
-var Label_propTypes = {
-  id: external_prop_types_default.a.string.isRequired,
-  index: external_prop_types_default.a.number.isRequired,
-  listId: external_prop_types_default.a.string.isRequired,
-  name: external_prop_types_default.a.string.isRequired,
-  onSwitchClick: external_prop_types_default.a.func,
-  value: external_prop_types_default.a.string.isRequired
-};
-
-function ListboxLabel(_ref) {
-  var id = _ref.id,
-      index = _ref.index,
-      listId = _ref.listId,
-      name = _ref.name,
-      onSwitchClick = _ref.onSwitchClick,
-      value = _ref.value;
-  var contextValue = Object(external_react_["useContext"])(DualListbox_ListboxContext);
-  var forceUpdate = useForceUpdate_default()();
-  var switchIdRef = Object(external_react_["useRef"])(Object(id_["createDOMID"])('switch'));
-  var updateLabelRefreshHookByName = contextValue.updateLabelRefreshHookByName,
-      getLabelState = contextValue.getLabelState;
-  Object(external_react_["useEffect"])(function () {
-    updateLabelRefreshHookByName === null || updateLabelRefreshHookByName === void 0 ? void 0 : updateLabelRefreshHookByName(name, forceUpdate);
-    return function () {
-      return updateLabelRefreshHookByName === null || updateLabelRefreshHookByName === void 0 ? void 0 : updateLabelRefreshHookByName(name);
-    };
-  }, [name, updateLabelRefreshHookByName, forceUpdate]);
-
-  if (!getLabelState) {
-    return null;
-  }
-
-  var _getLabelState = getLabelState(),
-      disabled = _getLabelState.disabled,
-      selected = _getLabelState.selected,
-      selectedValueCount = _getLabelState.selectedValueCount,
-      valueCount = _getLabelState.valueCount;
-
-  return /*#__PURE__*/external_react_default.a.createElement(StyledSwitchContainer, {
-    $columnNumber: index
-  }, /*#__PURE__*/external_react_default.a.createElement(ScreenReaderContent_default.a, {
-    "aria-hidden": true,
-    id: switchIdRef.current
-  }, Object(format_["sprintf"])(Object(i18n_["_"])('Select All %(listName)s Options'), {
-    listName: value
-  })), /*#__PURE__*/external_react_default.a.createElement(Switch_default.a, {
-    appearance: "checkbox",
-    "data-test": "select-all",
-    disabled: disabled,
-    labelledBy: switchIdRef.current,
-    onClick: onSwitchClick,
-    selected: selected,
-    value: value
-  }), /*#__PURE__*/external_react_default.a.createElement(StyledLabelContainer, null, /*#__PURE__*/external_react_default.a.createElement(StyledLabel, {
-    id: id,
-    htmlFor: listId
-  }, value), /*#__PURE__*/external_react_default.a.createElement("span", {
-    "aria-hidden": true
-  }, "".concat(selectedValueCount, "/").concat(valueCount, " Selected"))));
-}
-
-ListboxLabel.propTypes = Label_propTypes;
-/* harmony default export */ var Label = (ListboxLabel);
-// CONCATENATED MODULE: ./src/DualListbox/ListboxStyles.ts
-
-
-var StyledListbox = external_styled_components_default.a.ul.withConfig({
-  displayName: "ListboxStyles__StyledListbox",
-  componentId: "sc-11oqtd-0"
-})(["background-color:", ";border:1px solid ", ";border-radius:", ";grid-row:lists;list-style:none;margin:0;min-height:0;min-width:0;overflow:auto;padding:0;position:relative;&:focus{box-shadow:", ";outline:none;}", ""], themes_["variables"].transparent, Object(themes_["pick"])({
-  enterprise: themes_["variables"].gray60,
-  prisma: themes_["variables"].interactiveColorBorder
-}), themes_["variables"].borderRadius, themes_["variables"].focusShadow, function (_ref) {
-  var $columnNumber = _ref.$columnNumber;
-  return Object(external_styled_components_["css"])(["grid-column:", ";"], "list".concat($columnNumber));
-});
-
-// CONCATENATED MODULE: ./src/DualListbox/Listbox.tsx
-function Listbox_extends() { Listbox_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return Listbox_extends.apply(this, arguments); }
-
-function Listbox_objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = Listbox_objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function Listbox_objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-
-
-
-
-
-
-
-var Listbox_propTypes = {
-  children: external_prop_types_default.a.node,
-  index: external_prop_types_default.a.number.isRequired,
-  label: external_prop_types_default.a.string.isRequired,
-  multiSelect: external_prop_types_default.a.bool,
-  name: external_prop_types_default.a.string.isRequired,
-  onClick: external_prop_types_default.a.func,
-  onKeyDown: external_prop_types_default.a.func,
-  onSelectAllClick: external_prop_types_default.a.func
-};
-
-function Listbox(_ref) {
-  var children = _ref.children,
-      elementRef = _ref.elementRef,
-      index = _ref.index,
-      label = _ref.label,
-      name = _ref.name,
-      onClick = _ref.onClick,
-      onKeyDown = _ref.onKeyDown,
-      onSelectAllClick = _ref.onSelectAllClick,
-      otherProps = Listbox_objectWithoutProperties(_ref, ["children", "elementRef", "index", "label", "name", "onClick", "onKeyDown", "onSelectAllClick"]);
-
-  var labelIdRef = Object(external_react_["useRef"])(Object(id_["createDOMID"])('label'));
-  var idRef = Object(external_react_["useRef"])(Object(id_["createDOMID"])('listbox'));
-
-  var _useContext = Object(external_react_["useContext"])(DualListbox_DualListboxContext),
-      controlled = _useContext.controlled,
-      getSelectedStateForValue = _useContext.getSelectedStateForValue,
-      getActiveValue = _useContext.getActiveValue,
-      getSelectedValueCount = _useContext.getSelectedValueCount,
-      getValueCount = _useContext.getValueCount,
-      updateLabelRefreshHookByName = _useContext.updateLabelRefreshHookByName,
-      updateOptionRefreshHookByValue = _useContext.updateOptionRefreshHookByValue;
-
-  var handleClick = Object(external_react_["useCallback"])(function (event, _ref2) {
-    var value = _ref2.value;
-    onClick === null || onClick === void 0 ? void 0 : onClick(event, {
-      name: name,
-      value: value
-    });
-  }, [name, onClick]);
-  var getOptionStateForValue = Object(external_react_["useCallback"])(function (value) {
-    return {
-      active: (getActiveValue === null || getActiveValue === void 0 ? void 0 : getActiveValue(name)) === value,
-      selected: !!(getSelectedStateForValue === null || getSelectedStateForValue === void 0 ? void 0 : getSelectedStateForValue(value))
-    };
-  }, [name, getActiveValue, getSelectedStateForValue]);
-  var getLabelState = Object(external_react_["useCallback"])(function () {
-    var valueCount = (getValueCount === null || getValueCount === void 0 ? void 0 : getValueCount(name)) || 0;
-    var selectedValueCount = (getSelectedValueCount === null || getSelectedValueCount === void 0 ? void 0 : getSelectedValueCount(name)) || 0;
-    var switchSelected = false;
-
-    if (selectedValueCount > 0) {
-      switchSelected = selectedValueCount === valueCount ? true : 'some';
-    }
-
-    return {
-      disabled: valueCount < 1,
-      selected: switchSelected,
-      selectedValueCount: selectedValueCount,
-      valueCount: valueCount
-    };
-  }, [name, getSelectedValueCount, getValueCount]);
-
-  var handleKeyDown = function handleKeyDown(event) {
-    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event, {
-      name: name
-    });
-  };
-
-  var handleSwitchClick = function handleSwitchClick(event, _ref3) {
-    var selected = _ref3.selected;
-    onSelectAllClick === null || onSelectAllClick === void 0 ? void 0 : onSelectAllClick(event, {
-      name: name,
-      selected: selected
-    });
-  };
-
-  var handleMouseDown = function handleMouseDown(event) {
-    // this prevents default text selection when using shift + click
-    if (event.shiftKey && event.target !== event.currentTarget) {
-      event.preventDefault();
-    }
-  };
-
-  var contextValue = Object(external_react_["useMemo"])(function () {
-    return {
-      onOptionClick: handleClick,
-      updateLabelRefreshHookByName: updateLabelRefreshHookByName,
-      updateOptionRefreshHookByValue: updateOptionRefreshHookByValue,
-      getOptionStateForValue: getOptionStateForValue,
-      getLabelState: getLabelState,
-      controlled: controlled
-    };
-  }, [handleClick, updateLabelRefreshHookByName, updateOptionRefreshHookByValue, getOptionStateForValue, getLabelState, controlled]);
-  return /*#__PURE__*/external_react_default.a.createElement(DualListbox_ListboxContext.Provider, {
-    value: contextValue
-  }, /*#__PURE__*/external_react_default.a.createElement(Label, {
-    id: labelIdRef.current,
-    index: index,
-    listId: idRef.current,
-    name: name,
-    onSwitchClick: handleSwitchClick,
-    value: label
-  }), /*#__PURE__*/external_react_default.a.createElement(StyledListbox, Listbox_extends({
-    "aria-activedescendant": "" // Important this value stays static, only updated via DOM maniupulation
-    ,
-    "aria-labelledby": labelIdRef.current,
-    "aria-multiselectable": true,
-    "data-test": "listbox",
-    id: idRef.current,
-    onKeyDown: handleKeyDown,
-    onMouseDown: handleMouseDown,
-    ref: elementRef,
-    role: "listbox",
-    tabIndex: 0,
-    $columnNumber: index
-  }, otherProps), children));
-}
-
-Listbox.propTypes = Listbox_propTypes;
-/* harmony default export */ var DualListbox_Listbox = (Listbox);
-// EXTERNAL MODULE: external "@splunk/react-ui/Box"
-var Box_ = __webpack_require__(6);
-var Box_default = /*#__PURE__*/__webpack_require__.n(Box_);
-
-// CONCATENATED MODULE: ./src/DualListbox/DualListboxStyles.ts
-
-
-
-var StyledBox = external_styled_components_default()(Box_default.a).withConfig({
-  displayName: "DualListboxStyles__StyledBox",
-  componentId: "sc-1te6bz0-0"
-})(["display:grid;grid-template-columns:[list0] 180px [actions] min-content [list1] 180px;grid-template-rows:[headers] min-content [lists] 160px;gap:", " ", ";", " ", ""], themes_["variables"].spacingXSmall, themes_["variables"].spacingSmall, function (_ref) {
-  var $inline = _ref.$inline;
-  return $inline && Object(external_styled_components_["css"])(["display:inline-grid;"]);
-}, function (_ref2) {
-  var $fill = _ref2.$fill;
-  return $fill && Object(external_styled_components_["css"])(["height:100%;grid-template-columns:[list0] 1fr [actions] min-content [list1] 1fr;grid-template-rows:[headers] min-content [lists] 1fr;position:relative;width:100%;"]);
-});
-var StyledFlexColumn = external_styled_components_default.a.div.withConfig({
-  displayName: "DualListboxStyles__StyledFlexColumn",
-  componentId: "sc-1te6bz0-1"
-})(["&::before{content:'';grid-column:headers;grid-row:lists;}align-items:center;display:flex;flex-direction:column;gap:", ";grid-column:actions;grid-row:lists;justify-content:center;"], themes_["variables"].spacingSmall);
-
-// CONCATENATED MODULE: ./src/DualListbox/DualListbox.tsx
-function DualListbox_extends() { DualListbox_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return DualListbox_extends.apply(this, arguments); }
-
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { 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 _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
-function DualListbox_objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = DualListbox_objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function DualListbox_objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-/** @public */
-
-var DualListbox_propTypes = {
-  children: external_prop_types_default.a.node,
-  controlled: external_prop_types_default.a.bool,
-  fill: external_prop_types_default.a.bool,
-  inline: external_prop_types_default.a.bool,
-  onChange: external_prop_types_default.a.func,
-  onSelect: external_prop_types_default.a.func,
-  lists: external_prop_types_default.a.arrayOf(external_prop_types_default.a.shape({
-    name: external_prop_types_default.a.string.isRequired,
-    label: external_prop_types_default.a.string.isRequired
-  })).isRequired
-};
-
-function DualListbox(_ref) {
-  var _lists$, _lists$2, _lists$3, _lists$4;
-
-  var children = _ref.children,
-      _ref$controlled = _ref.controlled,
-      controlled = _ref$controlled === void 0 ? false : _ref$controlled,
-      _ref$fill = _ref.fill,
-      fill = _ref$fill === void 0 ? false : _ref$fill,
-      _ref$inline = _ref.inline,
-      inline = _ref$inline === void 0 ? false : _ref$inline,
-      onChange = _ref.onChange,
-      onSelect = _ref.onSelect,
-      lists = _ref.lists,
-      otherProps = DualListbox_objectWithoutProperties(_ref, ["children", "controlled", "fill", "inline", "onChange", "onSelect", "lists"]);
-
-  // @docs-props-type DualListboxPropsBase
-  var forceUpdate = useForceUpdate_default()();
-  var mountedRef = Object(external_react_["useRef"])(false);
-  Object(external_react_["useEffect"])(function () {
-    mountedRef.current = true;
-  }, []); // TODO: Implement shared isControlled hook (SUI-5283).
-
-  var isControlledRef = Object(external_react_["useRef"])(controlled); // List One "Available" Refs
-
-  var listOneValues = Object(external_react_["useRef"])([]);
-  var listOneSelectedValues = Object(external_react_["useRef"])([]);
-  var listOneActiveValue = Object(external_react_["useRef"])();
-  var listOneNodeRef = Object(external_react_["useRef"])(null);
-  var listOneMatchOptions = Object(external_react_["useRef"])([]); // List Two "Selected" Refs
-
-  var listTwoValues = Object(external_react_["useRef"])([]);
-  var listTwoSelectedValues = Object(external_react_["useRef"])([]);
-  var listTwoActiveValue = Object(external_react_["useRef"])();
-  var listTwoNodeRef = Object(external_react_["useRef"])(null);
-  var listTwoMatchOptions = Object(external_react_["useRef"])([]); // Refresh Hook Stores, used to render indivual elements when uncontrolled
-
-  var buttonRefreshHookByName = Object(external_react_["useRef"])({});
-  var labelRefreshHookByName = Object(external_react_["useRef"])({});
-  var optionRefreshHookByValue = Object(external_react_["useRef"])({});
-  var screenReaderRefreshHook = Object(external_react_["useRef"])(); // Activity Values Refs
-
-  var screenReaderValueRef = Object(external_react_["useRef"])();
-  var selectedByValue = Object(external_react_["useRef"])({});
-  var idByValue = Object(external_react_["useRef"])({});
-  var indexByValue = Object(external_react_["useRef"])({});
-  var initialRangeIndex = Object(external_react_["useRef"])(0); // Key Match Refs
-
-  var matchCharacter = Object(external_react_["useRef"])();
-  var matchTimeout = Object(external_react_["useRef"])();
-  var matchOptions = Object(external_react_["useRef"])([]);
-
-  if (false) {}
-
-  if (false) {}
-
-  if (false) {} // Unpack names and labels instead of relying on `lists` being a consistent reference
-
-
-  var listOneName = (_lists$ = lists[0]) === null || _lists$ === void 0 ? void 0 : _lists$.name;
-  var listTwoName = (_lists$2 = lists[1]) === null || _lists$2 === void 0 ? void 0 : _lists$2.name;
-  var listOneLabel = (_lists$3 = lists[0]) === null || _lists$3 === void 0 ? void 0 : _lists$3.label;
-  var listTwoLabel = (_lists$4 = lists[1]) === null || _lists$4 === void 0 ? void 0 : _lists$4.label; // Copy previous state for uncontrolled render so it's not voided by following value reset
-
-  var internalValueSet = new Set(listTwoValues.current); // This ensures we recapture the indexes after batch moves, but will be refactored when sorting is implemented (SUI-5270).
-
-  listOneValues.current = [];
-  listTwoValues.current = [];
-  listOneMatchOptions.current = [];
-  listTwoMatchOptions.current = []; // Clean the data stores before we copy the references into listData
-
-  if (!mountedRef.current || isControlledRef.current) {
-    listOneSelectedValues.current = [];
-    listTwoSelectedValues.current = [];
-    selectedByValue.current = {};
-    indexByValue.current = {};
-    idByValue.current = {};
-  }
-
-  var listData = [{
-    options: [],
-    matchOptions: listOneMatchOptions.current,
-    values: listOneValues.current,
-    selectedValues: listOneSelectedValues.current,
-    activeValue: listOneActiveValue.current,
-    activeFound: !listOneActiveValue.current
-  }, {
-    options: [],
-    matchOptions: listTwoMatchOptions.current,
-    values: listTwoValues.current,
-    selectedValues: listTwoSelectedValues.current,
-    activeValue: listTwoActiveValue.current,
-    activeFound: !listTwoActiveValue.current
-  }];
-
-  if (!mountedRef.current || isControlledRef.current) {
-    external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]).forEach(function (child) {
-      var _child$props = child.props,
-          value = _child$props.value,
-          label = _child$props.label;
-      var isListTwo = child.props.listName === listTwoName;
-      var data = listData[isListTwo ? 1 : 0]; // Ensure the active value is found on controlled renders
-
-      if (!data.activeFound && data.activeValue === value) {
-        data.activeFound = true;
-      }
-
-      data.values.push(value);
-      data.options.push(child);
-      data.matchOptions.push({
-        value: value,
-        label: label
-      });
-      var isSelected = !!child.props.selected;
-
-      if (isSelected) {
-        data.selectedValues.push(value);
-      }
-
-      selectedByValue.current[value] = isSelected;
-      indexByValue.current[value] = data.values.length - 1;
-      idByValue.current[value] = child.props.id;
-    });
-  } else {
-    external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]).forEach(function (child) {
-      var _child$props2 = child.props,
-          value = _child$props2.value,
-          label = _child$props2.label;
-      var isListTwo = internalValueSet.has(value);
-      var data = listData[isListTwo ? 1 : 0];
-      data.values.push(value);
-      data.options.push(child);
-      data.matchOptions.push({
-        value: value,
-        label: label
-      });
-      indexByValue.current[value] = data.values.length - 1;
-    });
-  }
-
-  var setActiveValue = Object(external_react_["useCallback"])(function (name, value) {
-    if (name === listOneName) {
-      listOneActiveValue.current = value;
-    } else {
-      listTwoActiveValue.current = value;
+    var J =  n().createContext({});
+    /* harmony default export */    const Q = J;
+    // CONCATENATED MODULE: ./src/DualListbox/Option.tsx
+    function Y() {
+        Y = Object.assign || function(e) {
+            for (var r = 1; r < arguments.length; r++) {
+                var t = arguments[r];
+                for (var n in t) {
+                    if (Object.prototype.hasOwnProperty.call(t, n)) {
+                        e[n] = t[n];
+                    }
+                }
+            }
+            return e;
+        };
+        return Y.apply(this, arguments);
     }
-  }, [listOneName]);
-  var getActiveValue = Object(external_react_["useCallback"])(function (name) {
-    return name === listOneName ? listOneActiveValue.current : listTwoActiveValue.current;
-  }, [listOneName]);
-  var setSelectedValues = Object(external_react_["useCallback"])(function (name, values) {
-    if (name === listOneName) {
-      listOneSelectedValues.current = values;
-    } else {
-      listTwoSelectedValues.current = values;
+    function Z(e, r) {
+        if (e == null) return {};
+        var t = ee(e, r);
+        var n, a;
+        if (Object.getOwnPropertySymbols) {
+            var i = Object.getOwnPropertySymbols(e);
+            for (a = 0; a < i.length; a++) {
+                n = i[a];
+                if (r.indexOf(n) >= 0) continue;
+                if (!Object.prototype.propertyIsEnumerable.call(e, n)) continue;
+                t[n] = e[n];
+            }
+        }
+        return t;
     }
-  }, [listOneName]);
-  var getSelectedValues = Object(external_react_["useCallback"])(function (name) {
-    return name === listOneName ? listOneSelectedValues.current : listTwoSelectedValues.current;
-  }, [listOneName]);
-  var getSelectedValueCount = Object(external_react_["useCallback"])(function (name) {
-    return getSelectedValues(name).length;
-  }, [getSelectedValues]);
-  var getScreenReaderMessage = Object(external_react_["useCallback"])(function () {
-    return screenReaderValueRef.current;
-  }, []);
-  var getSelectedStateForValue = Object(external_react_["useCallback"])(function (value) {
-    return selectedByValue.current[value];
-  }, []);
-  var setValues = Object(external_react_["useCallback"])(function (name, values) {
-    if (name === listOneName) {
-      listOneValues.current = values;
-    } else {
-      listTwoValues.current = values;
+    function ee(e, r) {
+        if (e == null) return {};
+        var t = {};
+        var n = Object.keys(e);
+        var a, i;
+        for (i = 0; i < n.length; i++) {
+            a = n[i];
+            if (r.indexOf(a) >= 0) continue;
+            t[a] = e[a];
+        }
+        return t;
     }
-  }, [listOneName]);
-  var getValues = Object(external_react_["useCallback"])(function (name) {
-    return name === listOneName ? listOneValues.current : listTwoValues.current;
-  }, [listOneName]);
-  var getValueCount = Object(external_react_["useCallback"])(function (name) {
-    return getValues(name).length;
-  }, [getValues]);
-  var getIsAllSelected = Object(external_react_["useCallback"])(function (name) {
-    var valueCount = getValueCount(name);
-    return valueCount > 0 && valueCount === getSelectedValueCount(name);
-  }, [getValueCount, getSelectedValueCount]);
-  var getAvailableMatchOptions = Object(external_react_["useCallback"])(function (name) {
-    return name === listOneName ? listOneMatchOptions.current : listTwoMatchOptions.current;
-  }, [listOneName]);
-  var getButtonState = Object(external_react_["useCallback"])(function (name) {
-    var valueCount = getValueCount(name);
-    var selectedValueCount = getSelectedValueCount(name);
-    return {
-      disabled: valueCount < 1 || selectedValueCount < 1
+    var re = {
+        id: i().string.isRequired,
+        label: i().string.isRequired,
+        listName: i().string,
+        selected: i().bool,
+        value: i().string.isRequired
     };
-  }, [getValueCount, getSelectedValueCount]);
-  var clearScreenReaderText = Object(external_react_["useCallback"])(function () {
-    if (screenReaderValueRef.current && screenReaderValueRef.current.length > 0) {
-      var _screenReaderRefreshH;
-
-      screenReaderValueRef.current = '';
-      (_screenReaderRefreshH = screenReaderRefreshHook.current) === null || _screenReaderRefreshH === void 0 ? void 0 : _screenReaderRefreshH.call(screenReaderRefreshHook);
-    }
-  }, []);
-  var resetMatches = Object(external_react_["useCallback"])(function () {
-    matchCharacter.current = undefined;
-    matchOptions.current = [];
-
-    if (matchTimeout.current) {
-      clearTimeout(matchTimeout.current);
-    }
-  }, []);
-  var updateScreenReaderRefreshHook = Object(external_react_["useCallback"])(function (callback) {
-    screenReaderRefreshHook.current = callback;
-  }, []);
-  var updateOptionRefreshHookByValue = Object(external_react_["useCallback"])(function (value, callback) {
-    if (callback) {
-      optionRefreshHookByValue.current[value] = callback;
-    } else {
-      delete optionRefreshHookByValue.current[value];
-    }
-  }, []);
-  var updateLabelRefreshHookByName = Object(external_react_["useCallback"])(function (name, callback) {
-    if (callback) {
-      labelRefreshHookByName.current[name] = callback;
-    } else {
-      delete labelRefreshHookByName.current[name];
-    }
-  }, []);
-  var updateButtonRefreshHookByName = Object(external_react_["useCallback"])(function (name, callback) {
-    if (callback) {
-      buttonRefreshHookByName.current[name] = callback;
-    } else {
-      delete buttonRefreshHookByName.current[name];
-    }
-  }, []);
-  var updateOption = Object(external_react_["useCallback"])(function (value) {
-    if (value) {
-      var _optionRefreshHookByV, _optionRefreshHookByV2;
-
-      (_optionRefreshHookByV = (_optionRefreshHookByV2 = optionRefreshHookByValue.current)[value]) === null || _optionRefreshHookByV === void 0 ? void 0 : _optionRefreshHookByV.call(_optionRefreshHookByV2);
-    }
-  }, []);
-  var updateLabel = Object(external_react_["useCallback"])(function (name) {
-    if (name) {
-      var _labelRefreshHookByNa, _labelRefreshHookByNa2;
-
-      (_labelRefreshHookByNa = (_labelRefreshHookByNa2 = labelRefreshHookByName.current)[name]) === null || _labelRefreshHookByNa === void 0 ? void 0 : _labelRefreshHookByNa.call(_labelRefreshHookByNa2);
-    }
-  }, []);
-  var updateButton = Object(external_react_["useCallback"])(function (name) {
-    if (name) {
-      var _buttonRefreshHookByN, _buttonRefreshHookByN2;
-
-      (_buttonRefreshHookByN = (_buttonRefreshHookByN2 = buttonRefreshHookByName.current)[name]) === null || _buttonRefreshHookByN === void 0 ? void 0 : _buttonRefreshHookByN.call(_buttonRefreshHookByN2);
-    }
-  }, []);
-  var updateInternalDisplay = Object(external_react_["useCallback"])(function (name) {
-    clearScreenReaderText();
-    updateLabel(name);
-    updateButton(listOneName);
-    updateButton(listTwoName);
-  }, [clearScreenReaderText, updateButton, updateLabel, listOneName, listTwoName]);
-  var updateActiveOption = Object(external_react_["useCallback"])(function (name, value) {
-    var skipRender = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
-    var listbox = name === listOneName ? listOneNodeRef.current : listTwoNodeRef.current;
-
-    if (!listbox) {
-      return;
-    }
-
-    var previousValue = getActiveValue(name);
-    setActiveValue(name, value);
-
-    if (!skipRender) {
-      // render new
-      updateOption(value);
+    function te(e) {
+        var r = e.id, a = e.label, i = e.selected, l = e.value, o = Z(e, [ "id", "label", "selected", "value" ]);
+        var u = (0, t.useContext)(Q);
+        var c = p()();
+        var s = u.onOptionClick, v = u.getOptionStateForValue, d = u.updateOptionRefreshHookByValue, f = u.controlled;
+        (0, t.useEffect)((function() {
+            d === null || d === void 0 ? void 0 : d(l, c);
+            return function() {
+                return d === null || d === void 0 ? void 0 : d(l);
+            };
+        }), [ l, d, c ]);
+        var b = (0, t.useCallback)((function(e) {
+            s === null || s === void 0 ? void 0 : s(e, {
+                value: l
+            });
+        }), [ s, l ]);
+        if (!v) {
+            return null;
+        }
+        var m = v(l), h = m.active, g = m.selected;
+        var y = !!(f ? i : g);
+        
+        return n().createElement(W, Y({
+            "aria-selected": y,
+            "data-test": "option",
+            "data-test-value": l,
+            "data-test-active": h,
+            id: r,
+            onClick: b,
+            role: "option",
+            $active: h,
+            $selected: y
+        }, o),  n().createElement(X, {
+            interactive: false,
+            selected: y,
+            appearance: "checkbox"
+        }),  n().createElement(G, null, a));
     }
-
-    if (value !== previousValue) {
-      if (!skipRender) {
-        // render previous
-        updateOption(previousValue);
-      }
-
-      var id = value ? idByValue.current[value] : ''; // update listbox via dom to avoid render + child render
-
-      listbox.setAttribute('aria-activedescendant', id);
-
-      if (!skipRender && id.length > 0) {
-        var element = listbox.querySelector("#".concat(id));
-        Object(scrollIntoViewIfNeeded["a" /* scrollIntoViewIfNeeded */])(element);
-      }
+    te.propTypes = re;
+    /* harmony default export */    const ne = te;
+    // CONCATENATED MODULE: external "@splunk/ui-utils/id"
+    const ae = require("@splunk/ui-utils/id");
+    // CONCATENATED MODULE: ./src/DualListbox/LabelStyles.ts
+    var ie = D().label.withConfig({
+        displayName: "LabelStyles__StyledLabel",
+        componentId: "unwplx-0"
+    })([ "color:", ";flex:0 0 auto;" ], N.variables.contentColorActive);
+    var le = D().div.withConfig({
+        displayName: "LabelStyles__StyledLabelContainer",
+        componentId: "unwplx-1"
+    })([ "display:flex;flex-direction:column;" ]);
+    var oe = D().div.withConfig({
+        displayName: "LabelStyles__StyledSwitchContainer",
+        componentId: "unwplx-2"
+    })([ "align-items:center;border:1px solid transparent;display:flex;gap:", ";grid-row:headers;padding:0 ", ";", "" ], N.variables.spacingSmall, N.variables.spacingSmall, (function(e) {
+        var r = e.$columnNumber;
+        return (0, _.css)([ "grid-column:", ";" ], "list".concat(r));
+    }));
+    // CONCATENATED MODULE: ./src/DualListbox/Label.tsx
+    var ue = {
+        id: i().string.isRequired,
+        index: i().number.isRequired,
+        listId: i().string.isRequired,
+        name: i().string.isRequired,
+        onSwitchClick: i().func,
+        value: i().string.isRequired
+    };
+    function ce(e) {
+        var r = e.id, a = e.index, i = e.listId, o = e.name, u = e.onSwitchClick, c = e.value;
+        var s = (0, t.useContext)(Q);
+        var v = p()();
+        var f = (0, t.useRef)((0, ae.createDOMID)("switch"));
+        var b = s.updateLabelRefreshHookByName, h = s.getLabelState;
+        (0, t.useEffect)((function() {
+            b === null || b === void 0 ? void 0 : b(o, v);
+            return function() {
+                return b === null || b === void 0 ? void 0 : b(o);
+            };
+        }), [ o, b, v ]);
+        if (!h) {
+            return null;
+        }
+        var g = h(), y = g.disabled, k = g.selected, C = g.selectedValueCount, x = g.valueCount;
+        
+        return n().createElement(oe, {
+            $columnNumber: a
+        },  n().createElement(m(), {
+            "aria-hidden": true,
+            id: f.current
+        }, (0, d.sprintf)((0, l._)("Select All %(listName)s Options"), {
+            listName: c
+        })),  n().createElement(U(), {
+            appearance: "checkbox",
+            "data-test": "select-all",
+            disabled: y,
+            labelledBy: f.current,
+            onClick: u,
+            selected: k,
+            value: c
+        }),  n().createElement(le, null,  n().createElement(ie, {
+            id: r,
+            htmlFor: i
+        }, c),  n().createElement("span", {
+            "aria-hidden": true
+        }, "".concat(C, "/").concat(x, " Selected"))));
     }
-  }, [getActiveValue, setActiveValue, updateOption, listOneName]);
-  var handleSingleSelection = Object(external_react_["useCallback"])(function (event, _ref2) {
-    var value = _ref2.value,
-        name = _ref2.name;
-    var sourceValues = getIsAllSelected(name) ? getValues(name) : getSelectedValues(name);
-    var newValues = arrayWithToggledValue(sourceValues, value);
-
-    if (!isControlledRef.current) {
-      selectedByValue.current[value] = !selectedByValue.current[value];
-      setSelectedValues(name, newValues);
-      updateInternalDisplay(name);
+    ce.propTypes = ue;
+    /* harmony default export */    const se = ce;
+    // CONCATENATED MODULE: ./src/DualListbox/ListboxStyles.ts
+    var ve = D().ul.withConfig({
+        displayName: "ListboxStyles__StyledListbox",
+        componentId: "sc-11oqtd-0"
+    })([ "background-color:", ";border:1px solid ", ";border-radius:", ";grid-row:lists;list-style:none;margin:0;min-height:0;min-width:0;overflow:auto;padding:0;position:relative;&:focus{box-shadow:", ";outline:none;}", "" ], N.variables.transparent, (0, 
+    N.pick)({
+        enterprise: N.variables.gray60,
+        prisma: N.variables.interactiveColorBorder
+    }), N.variables.borderRadius, N.variables.focusShadow, (function(e) {
+        var r = e.$columnNumber;
+        return (0, _.css)([ "grid-column:", ";" ], "list".concat(r));
+    }));
+    // CONCATENATED MODULE: ./src/DualListbox/Listbox.tsx
+    function de() {
+        de = Object.assign || function(e) {
+            for (var r = 1; r < arguments.length; r++) {
+                var t = arguments[r];
+                for (var n in t) {
+                    if (Object.prototype.hasOwnProperty.call(t, n)) {
+                        e[n] = t[n];
+                    }
+                }
+            }
+            return e;
+        };
+        return de.apply(this, arguments);
     }
-
-    updateActiveOption(name, value);
-    event.preventDefault();
-    onSelect === null || onSelect === void 0 ? void 0 : onSelect(event, {
-      values: newValues,
-      listName: name
-    });
-  }, [getIsAllSelected, getSelectedValues, getValues, setSelectedValues, updateActiveOption, updateInternalDisplay, onSelect]);
-  var handleRangeSelection = Object(external_react_["useCallback"])(function (event, _ref3) {
-    var initialIndex = _ref3.initialIndex,
-        name = _ref3.name,
-        targetIndex = _ref3.targetIndex;
-    var valuesArr = getValues(name);
-    var startIndex = Math.min(initialIndex, targetIndex);
-    var endIndex = Math.max(initialIndex, targetIndex);
-    var newValues = [];
-
-    if (isControlledRef.current) {
-      newValues = valuesArr.slice(startIndex, endIndex + 1);
-    } else {
-      valuesArr.forEach(function (value, index) {
-        var newSelectedState = false;
-
-        if (index >= startIndex && index <= endIndex) {
-          newSelectedState = true;
-          newValues.push(value);
-        } else {
-          newSelectedState = false;
-        }
-
-        if (selectedByValue.current[value] !== newSelectedState) {
-          selectedByValue.current[value] = newSelectedState;
-          updateOption(value);
+    function fe(e, r) {
+        if (e == null) return {};
+        var t = pe(e, r);
+        var n, a;
+        if (Object.getOwnPropertySymbols) {
+            var i = Object.getOwnPropertySymbols(e);
+            for (a = 0; a < i.length; a++) {
+                n = i[a];
+                if (r.indexOf(n) >= 0) continue;
+                if (!Object.prototype.propertyIsEnumerable.call(e, n)) continue;
+                t[n] = e[n];
+            }
         }
-      });
-      setSelectedValues(name, newValues);
-      updateInternalDisplay(name);
+        return t;
     }
-
-    updateActiveOption(name, valuesArr[targetIndex]);
-    event.preventDefault();
-    event.stopPropagation();
-    onSelect === null || onSelect === void 0 ? void 0 : onSelect(event, {
-      values: newValues,
-      listName: name
-    });
-  }, [getValues, onSelect, setSelectedValues, updateActiveOption, updateInternalDisplay, updateOption]);
-  var handleSelectAll = Object(external_react_["useCallback"])(function (event, _ref4) {
-    var name = _ref4.name,
-        selected = _ref4.selected;
-    var listValues = getValues(name);
-    var newValues = selected === true ? [] : listValues;
-    var newState = selected !== true;
-
-    if (!isControlledRef.current) {
-      listValues === null || listValues === void 0 ? void 0 : listValues.forEach(function (value) {
-        if (selectedByValue.current[value] !== newState) {
-          selectedByValue.current[value] = newState;
-          updateOption(value);
+    function pe(e, r) {
+        if (e == null) return {};
+        var t = {};
+        var n = Object.keys(e);
+        var a, i;
+        for (i = 0; i < n.length; i++) {
+            a = n[i];
+            if (r.indexOf(a) >= 0) continue;
+            t[a] = e[a];
         }
-      });
-      setSelectedValues(name, newValues);
-      updateInternalDisplay(name);
+        return t;
     }
-
-    event.preventDefault();
-    onSelect === null || onSelect === void 0 ? void 0 : onSelect(event, {
-      values: newValues,
-      listName: name
-    });
-  }, [getValues, onSelect, setSelectedValues, updateInternalDisplay, updateOption]); // handleMoveValues does not update the active value of the source, keyboard and mouse differ, only the target active value is updated
-
-  var handleMoveValues = Object(external_react_["useCallback"])(function (event, sourceName, targetName) {
-    var sourceValues = getValues(sourceName);
-    var sourceSelectedValues = getSelectedValues(sourceName);
-    var sourceIsAllSelected = getIsAllSelected(sourceName);
-    var targetValues = getValues(targetName);
-    var targetActiveValue = getActiveValue(targetName);
-
-    if (sourceValues.length === 0 || !sourceIsAllSelected && sourceSelectedValues.length === 0) {
-      return;
+    var be = {
+        children: i().node,
+        index: i().number.isRequired,
+        label: i().string.isRequired,
+        multiSelect: i().bool,
+        name: i().string.isRequired,
+        onClick: i().func,
+        onKeyDown: i().func,
+        onSelectAllClick: i().func
+    };
+    function me(e) {
+        var r = e.children, a = e.elementRef, i = e.index, l = e.label, o = e.name, u = e.onClick, c = e.onKeyDown, s = e.onSelectAllClick, v = fe(e, [ "children", "elementRef", "index", "label", "name", "onClick", "onKeyDown", "onSelectAllClick" ]);
+        var d = (0, t.useRef)((0, ae.createDOMID)("label"));
+        var f = (0, t.useRef)((0, ae.createDOMID)("listbox"));
+        var p = (0, t.useContext)(g), b = p.controlled, m = p.getSelectedStateForValue, h = p.getActiveValue, y = p.getSelectedValueCount, k = p.getValueCount, C = p.updateLabelRefreshHookByName, x = p.updateOptionRefreshHookByValue;
+        var S = (0, t.useCallback)((function(e, r) {
+            var t = r.value;
+            u === null || u === void 0 ? void 0 : u(e, {
+                name: o,
+                value: t
+            });
+        }), [ o, u ]);
+        var w = (0, t.useCallback)((function(e) {
+            return {
+                active: (h === null || h === void 0 ? void 0 : h(o)) === e,
+                selected: !!(m === null || m === void 0 ? void 0 : m(e))
+            };
+        }), [ o, h, m ]);
+        var O = (0, t.useCallback)((function() {
+            var e = (k === null || k === void 0 ? void 0 : k(o)) || 0;
+            var r = (y === null || y === void 0 ? void 0 : y(o)) || 0;
+            var t = false;
+            if (r > 0) {
+                t = r === e ? true : "some";
+            }
+            return {
+                disabled: e < 1,
+                selected: t,
+                selectedValueCount: r,
+                valueCount: e
+            };
+        }), [ o, y, k ]);
+        var R = function e(r) {
+            c === null || c === void 0 ? void 0 : c(r, {
+                name: o
+            });
+        };
+        var E = function e(r, t) {
+            var n = t.selected;
+            s === null || s === void 0 ? void 0 : s(r, {
+                name: o,
+                selected: n
+            });
+        };
+        var I = function e(r) {
+            // this prevents default text selection when using shift + click
+            if (r.shiftKey && r.target !== r.currentTarget) {
+                r.preventDefault();
+            }
+        };
+        var L = (0, t.useMemo)((function() {
+            return {
+                onOptionClick: S,
+                updateLabelRefreshHookByName: C,
+                updateOptionRefreshHookByValue: x,
+                getOptionStateForValue: w,
+                getLabelState: O,
+                controlled: b
+            };
+        }), [ S, C, x, w, O, b ]);
+        
+        return n().createElement(Q.Provider, {
+            value: L
+        },  n().createElement(se, {
+            id: d.current,
+            index: i,
+            listId: f.current,
+            name: o,
+            onSwitchClick: E,
+            value: l
+        }),  n().createElement(ve, de({
+            "aria-activedescendant": "",
+            "aria-labelledby": d.current,
+            "aria-multiselectable": true,
+            "data-test": "listbox",
+            id: f.current,
+            onKeyDown: R,
+            onMouseDown: I,
+            ref: a,
+            role: "listbox",
+            tabIndex: 0,
+            $columnNumber: i
+        }, v), r));
     }
-
-    if (!targetActiveValue && sourceSelectedValues.length > 0) {
-      // target lacks an active value, default to the first
-      // skip the render it will be catch in batch
-      updateActiveOption(targetName, sourceSelectedValues[0], true);
+    me.propTypes = be;
+    /* harmony default export */    const he = me;
+    // CONCATENATED MODULE: external "@splunk/react-ui/Box"
+    const ge = require("@splunk/react-ui/Box");
+    var ye =  e.n(ge);
+    // CONCATENATED MODULE: ./src/DualListbox/DualListboxStyles.ts
+    var ke = D()(ye()).withConfig({
+        displayName: "DualListboxStyles__StyledBox",
+        componentId: "sc-1te6bz0-0"
+    })([ "display:grid;grid-template-columns:[list0] 180px [actions] min-content [list1] 180px;grid-template-rows:[headers] min-content [lists] 160px;gap:", " ", ";", " ", "" ], N.variables.spacingXSmall, N.variables.spacingSmall, (function(e) {
+        var r = e.$inline;
+        return r && (0, _.css)([ "display:inline-grid;" ]);
+    }), (function(e) {
+        var r = e.$fill;
+        return r && (0, _.css)([ "height:100%;grid-template-columns:[list0] 1fr [actions] min-content [list1] 1fr;grid-template-rows:[headers] min-content [lists] 1fr;position:relative;width:100%;" ]);
+    }));
+    var Ce = D().div.withConfig({
+        displayName: "DualListboxStyles__StyledFlexColumn",
+        componentId: "sc-1te6bz0-1"
+    })([ "&::before{content:'';grid-column:headers;grid-row:lists;}align-items:center;display:flex;flex-direction:column;gap:", ";grid-column:actions;grid-row:lists;justify-content:center;" ], N.variables.spacingSmall);
+    // CONCATENATED MODULE: ./src/DualListbox/DualListbox.tsx
+    function xe() {
+        xe = Object.assign || function(e) {
+            for (var r = 1; r < arguments.length; r++) {
+                var t = arguments[r];
+                for (var n in t) {
+                    if (Object.prototype.hasOwnProperty.call(t, n)) {
+                        e[n] = t[n];
+                    }
+                }
+            }
+            return e;
+        };
+        return xe.apply(this, arguments);
     }
-
-    var message = Object(format_["sprintf"])(Object(i18n_["_"])('Moved %(count)d items to %(listLabel)s list'), {
-      count: sourceSelectedValues.length,
-      listLabel: targetName === listOneName ? listOneLabel : listTwoLabel
-    }); // These new values do not perserve sort position, may need to be refactored with sort logic (SUI-5270).
-
-    var newSourceValues = sourceIsAllSelected ? [] : arrayWithRemovedValues(sourceValues, sourceSelectedValues);
-    var newTargetValues = targetValues.concat(sourceSelectedValues);
-
-    if (!isControlledRef.current) {
-      sourceSelectedValues.forEach(function (value) {
-        selectedByValue.current[value] = false;
-      });
-      setValues(targetName, newTargetValues);
-      setValues(sourceName, newSourceValues);
-      setSelectedValues(sourceName, []);
-      screenReaderValueRef.current = message; // move is a batch update, force a full render, no internal update needed
-
-      forceUpdate();
+    function Se(e, r) {
+        return Ie(e) || Ee(e, r) || Oe(e, r) || we();
     }
-
-    var data = {
-      affectedValues: sourceSelectedValues,
-      sourceListName: sourceName || '',
-      sourceValues: newSourceValues,
-      targetListName: targetName || '',
-      targetValues: newTargetValues,
-      screenReaderMessage: message || '',
-      values: sourceSelectedValues.slice()
-    };
-    event.preventDefault();
-    onChange === null || onChange === void 0 ? void 0 : onChange(event, data);
-  }, [forceUpdate, getActiveValue, getIsAllSelected, getSelectedValues, getValues, onChange, setSelectedValues, setValues, updateActiveOption, listOneName, listOneLabel, listTwoLabel]);
-  var handleToolbarButtonClick = Object(external_react_["useCallback"])(function (event, _ref5) {
-    var name = _ref5.name;
-    var isAllSelected = getIsAllSelected(name);
-    var activeValue = getActiveValue(name);
-    var targetName = name === listOneName ? listTwoName : listOneName;
-
-    if (activeValue && (isAllSelected || !!selectedByValue.current[activeValue])) {
-      // active option was present in items to be removed, clear the active option
-      updateActiveOption(name);
+    function we() {
+        throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
     }
-
-    handleMoveValues(event, name, targetName);
-  }, [getActiveValue, getIsAllSelected, handleMoveValues, updateActiveOption, listOneName, listTwoName]);
-  var handleOptionClick = Object(external_react_["useCallback"])(function (event, _ref6) {
-    var name = _ref6.name,
-        value = _ref6.value;
-
-    if (event.nativeEvent.shiftKey) {
-      handleRangeSelection(event, {
-        targetIndex: indexByValue.current[value],
-        initialIndex: initialRangeIndex.current,
-        name: name
-      });
-    } else {
-      handleSingleSelection(event, {
-        name: name,
-        value: value
-      });
+    function Oe(e, r) {
+        if (!e) return;
+        if (typeof e === "string") return Re(e, r);
+        var t = Object.prototype.toString.call(e).slice(8, -1);
+        if (t === "Object" && e.constructor) t = e.constructor.name;
+        if (t === "Map" || t === "Set") return Array.from(e);
+        if (t === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)) return Re(e, r);
     }
-  }, [handleRangeSelection, handleSingleSelection]);
-  var handleSelectAllClick = Object(external_react_["useCallback"])(function (event, data) {
-    handleSelectAll(event, data);
-  }, [handleSelectAll]);
-  var handleKeyMatch = Object(external_react_["useCallback"])(function (e, name) {
-    var currentKey = e.nativeEvent.key;
-    var availableOptions = getAvailableMatchOptions(name); // Checking for a single character to avoid complications from double-byte languages and emojis.
-
-    if (currentKey.length === 1) {
-      var matches = [];
-      var character = {
-        index: 0,
-        value: currentKey
-      };
-
-      if (!matchCharacter.current) {
-        if (currentKey === ' ') {
-          resetMatches();
-          return;
+    function Re(e, r) {
+        if (r == null || r > e.length) r = e.length;
+        for (var t = 0, n = new Array(r); t < r; t++) {
+            n[t] = e[t];
         }
-
-        matches = Object(fuzzyMatch["a" /* fuzzyMatch */])(availableOptions, character);
-      } else if (matchOptions.current.length > 1) {
-        character.index = matchCharacter.current.index + 1;
-        matches = Object(fuzzyMatch["a" /* fuzzyMatch */])(matchOptions.current, character);
-      }
-
-      if (matches.length) {
-        var matchIndex = 0; // If the active option is a first character match, cycle to the next matching option.
-
-        if (character.index === 0 && matches.length > 1) {
-          var activeValue = getActiveValue(name);
-
-          if (activeValue) {
-            var activeMatchIndex = matches.findIndex(function (match) {
-              return match.value === activeValue;
-            });
-
-            if (activeMatchIndex >= 0) {
-              matchIndex = activeMatchIndex === matches.length - 1 ? 0 : activeMatchIndex + 1;
+        return n;
+    }
+    function Ee(e, r) {
+        if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(e))) return;
+        var t = [];
+        var n = true;
+        var a = false;
+        var i = undefined;
+        try {
+            for (var l = e[Symbol.iterator](), o; !(n = (o = l.next()).done); n = true) {
+                t.push(o.value);
+                if (r && t.length === r) break;
+            }
+        } catch (e) {
+            a = true;
+            i = e;
+        } finally {
+            try {
+                if (!n && l["return"] != null) l["return"]();
+            } finally {
+                if (a) throw i;
             }
-          }
         }
-
-        updateActiveOption(name, matches[matchIndex].value);
-      }
-
-      matchOptions.current = matches;
-      matchCharacter.current = character;
-
-      if (matchTimeout.current) {
-        clearTimeout(matchTimeout.current);
-      }
-
-      matchTimeout.current = setTimeout(resetMatches, 500);
-      e.preventDefault();
-      e.stopPropagation();
+        return t;
     }
-  }, [getActiveValue, getAvailableMatchOptions, resetMatches, updateActiveOption]);
-  var handleListboxKeyDown = Object(external_react_["useCallback"])(function (event, _ref7) {
-    var name = _ref7.name;
-    var eventKeyCode = Object(keyboard_["keycode"])(event.nativeEvent);
-    var listboxValues = getValues(name);
-    var listboxSelectedValues = getSelectedValues(name);
-    var isAllSelected = getIsAllSelected(name);
-    var activeValue = getActiveValue(name);
-    var activeIndex = activeValue ? indexByValue.current[activeValue] : -1;
-    var initialIndex = initialRangeIndex.current >= 0 ? initialRangeIndex.current : 0;
-
-    if (screenReaderValueRef.current && screenReaderValueRef.current.length > 0) {
-      clearScreenReaderText();
+    function Ie(e) {
+        if (Array.isArray(e)) return e;
     }
-
-    var nextActiveValue = activeValue;
-
-    switch (eventKeyCode) {
-      case 'shift':
-        initialRangeIndex.current = activeIndex;
-        break;
-
-      case 'home':
-        if (event.nativeEvent.ctrlKey && event.nativeEvent.shiftKey) {
-          // handle select until start
-          handleRangeSelection(event, {
-            targetIndex: 0,
-            initialIndex: initialIndex,
-            name: name
-          });
-        } else {
-          var _listboxValues = _slicedToArray(listboxValues, 1);
-
-          nextActiveValue = _listboxValues[0];
+    function Le(e, r) {
+        if (e == null) return {};
+        var t = qe(e, r);
+        var n, a;
+        if (Object.getOwnPropertySymbols) {
+            var i = Object.getOwnPropertySymbols(e);
+            for (a = 0; a < i.length; a++) {
+                n = i[a];
+                if (r.indexOf(n) >= 0) continue;
+                if (!Object.prototype.propertyIsEnumerable.call(e, n)) continue;
+                t[n] = e[n];
+            }
         }
-
-        break;
-
-      case 'end':
-        if (event.nativeEvent.ctrlKey && event.nativeEvent.shiftKey) {
-          // handle select until end
-          handleRangeSelection(event, {
-            targetIndex: listboxValues.length - 1,
-            initialIndex: initialIndex,
-            name: name
-          });
-        } else {
-          nextActiveValue = listboxValues[listboxValues.length - 1];
+        return t;
+    }
+    function qe(e, r) {
+        if (e == null) return {};
+        var t = {};
+        var n = Object.keys(e);
+        var a, i;
+        for (i = 0; i < n.length; i++) {
+            a = n[i];
+            if (r.indexOf(a) >= 0) continue;
+            t[a] = e[a];
         }
-
-        break;
-
-      case 'up':
-        if (event.nativeEvent.shiftKey) {
-          // handle select until previous
-          handleRangeSelection(event, {
-            targetIndex: Math.max(activeIndex - 1, 0),
-            initialIndex: initialIndex,
-            name: name
-          });
-        } else {
-          nextActiveValue = listboxValues[Math.max(activeIndex - 1, 0)];
+        return t;
+    }
+    /** @public */    var je = {
+        children: i().node,
+        controlled: i().bool,
+        fill: i().bool,
+        inline: i().bool,
+        onChange: i().func,
+        onSelect: i().func,
+        lists: i().arrayOf(i().shape({
+            name: i().string.isRequired,
+            label: i().string.isRequired
+        })).isRequired
+    };
+    function _e(e) {
+        var r, a, i, u;
+        var s = e.children, f = e.controlled, b = f === void 0 ? false : f, m = e.fill, h = m === void 0 ? false : m, y = e.inline, k = y === void 0 ? false : y, R = e.onChange, I = e.onSelect, q = e.lists, j = Le(e, [ "children", "controlled", "fill", "inline", "onChange", "onSelect", "lists" ]);
+        // @docs-props-type DualListboxPropsBase
+                var _ = p()();
+        var D = (0, t.useRef)(false);
+        (0, t.useEffect)((function() {
+            D.current = true;
+        }), []);
+ // TODO: Implement shared isControlled hook (SUI-5283).
+                var N = (0, t.useRef)(b);
+ // List One "Available" Refs
+                var V = (0, t.useRef)([]);
+        var P = (0, t.useRef)([]);
+        var H = (0, t.useRef)();
+        var T = (0, t.useRef)(null);
+        var B = (0, t.useRef)([]);
+ // List Two "Selected" Refs
+                var M = (0, t.useRef)([]);
+        var A = (0, t.useRef)([]);
+        var K = (0, t.useRef)();
+        var $ = (0, t.useRef)(null);
+        var z = (0, t.useRef)([]);
+ // Refresh Hook Stores, used to render indivual elements when uncontrolled
+                var U = (0, t.useRef)({});
+        var W = (0, t.useRef)({});
+        var X = (0, t.useRef)({});
+        var G = (0, t.useRef)();
+ // Activity Values Refs
+                var J = (0, t.useRef)();
+        var Q = (0, t.useRef)({});
+        var Y = (0, t.useRef)({});
+        var Z = (0, t.useRef)({});
+        var ee = (0, t.useRef)(0);
+ // Key Match Refs
+                var re = (0, t.useRef)();
+        var te = (0, t.useRef)();
+        var ne = (0, t.useRef)([]);
+        if (false) {}
+        if (false) {}
+        if (false) {}
+ // Unpack names and labels instead of relying on `lists` being a consistent reference
+                var ae = (r = q[0]) === null || r === void 0 ? void 0 : r.name;
+        var ie = (a = q[1]) === null || a === void 0 ? void 0 : a.name;
+        var le = (i = q[0]) === null || i === void 0 ? void 0 : i.label;
+        var oe = (u = q[1]) === null || u === void 0 ? void 0 : u.label;
+ // Copy previous state for uncontrolled render so it's not voided by following value reset
+                var ue = new Set(M.current);
+ // This ensures we recapture the indexes after batch moves, but will be refactored when sorting is implemented (SUI-5270).
+                V.current = [];
+        M.current = [];
+        B.current = [];
+        z.current = [];
+ // Clean the data stores before we copy the references into listData
+                if (!D.current || N.current) {
+            P.current = [];
+            A.current = [];
+            Q.current = {};
+            Z.current = {};
+            Y.current = {};
         }
-
-        break;
-
-      case 'down':
-        if (event.nativeEvent.shiftKey) {
-          // handle select until next
-          handleRangeSelection(event, {
-            targetIndex: Math.min(activeIndex + 1, listboxValues.length - 1),
-            initialIndex: initialIndex,
-            name: name
-          });
+        var ce = [ {
+            options: [],
+            matchOptions: B.current,
+            values: V.current,
+            selectedValues: P.current,
+            activeValue: H.current,
+            activeFound: !H.current
+        }, {
+            options: [],
+            matchOptions: z.current,
+            values: M.current,
+            selectedValues: A.current,
+            activeValue: K.current,
+            activeFound: !K.current
+        } ];
+        if (!D.current || N.current) {
+            t.Children.toArray(s).filter(t.isValidElement).forEach((function(e) {
+                var r = e.props, t = r.value, n = r.label;
+                var a = e.props.listName === ie;
+                var i = ce[a ? 1 : 0];
+ // Ensure the active value is found on controlled renders
+                                if (!i.activeFound && i.activeValue === t) {
+                    i.activeFound = true;
+                }
+                i.values.push(t);
+                i.options.push(e);
+                i.matchOptions.push({
+                    value: t,
+                    label: n
+                });
+                var l = !!e.props.selected;
+                if (l) {
+                    i.selectedValues.push(t);
+                }
+                Q.current[t] = l;
+                Z.current[t] = i.values.length - 1;
+                Y.current[t] = e.props.id;
+            }));
         } else {
-          nextActiveValue = listboxValues[Math.min(activeIndex + 1, listboxValues.length - 1)];
-        }
-
-        break;
-
-      case 'space':
-        if (activeValue != null) {
-          handleSingleSelection(event, {
-            name: name,
-            value: activeValue
-          });
-        }
-
-        break;
-
-      case 'enter':
-        if (name === listOneName) {
-          if (isAllSelected) {
-            // all values moved, no longer an active value
-            nextActiveValue = undefined;
-          } else if (listboxSelectedValues.length > 0) {
-            // somes values moved, determine next active value
-            nextActiveValue = findNextValue(activeIndex, listboxValues, listboxSelectedValues);
-          }
-
-          handleMoveValues(event, listOneName, listTwoName);
+            t.Children.toArray(s).filter(t.isValidElement).forEach((function(e) {
+                var r = e.props, t = r.value, n = r.label;
+                var a = ue.has(t);
+                var i = ce[a ? 1 : 0];
+                i.values.push(t);
+                i.options.push(e);
+                i.matchOptions.push({
+                    value: t,
+                    label: n
+                });
+                Z.current[t] = i.values.length - 1;
+            }));
         }
-
-        break;
-
-      case 'delete':
-        if (name === listTwoName) {
-          if (isAllSelected) {
-            // all values moved, no longer an active value
-            nextActiveValue = undefined;
-          } else if (listboxSelectedValues.length > 0) {
-            // somes values moved, determine next active value
-            nextActiveValue = findNextValue(activeIndex, listboxValues, listboxSelectedValues);
-          }
-
-          handleMoveValues(event, listTwoName, listOneName);
+        var se = (0, t.useCallback)((function(e, r) {
+            if (e === ae) {
+                H.current = r;
+            } else {
+                K.current = r;
+            }
+        }), [ ae ]);
+        var ve = (0, t.useCallback)((function(e) {
+            return e === ae ? H.current : K.current;
+        }), [ ae ]);
+        var de = (0, t.useCallback)((function(e, r) {
+            if (e === ae) {
+                P.current = r;
+            } else {
+                A.current = r;
+            }
+        }), [ ae ]);
+        var fe = (0, t.useCallback)((function(e) {
+            return e === ae ? P.current : A.current;
+        }), [ ae ]);
+        var pe = (0, t.useCallback)((function(e) {
+            return fe(e).length;
+        }), [ fe ]);
+        var be = (0, t.useCallback)((function() {
+            return J.current;
+        }), []);
+        var me = (0, t.useCallback)((function(e) {
+            return Q.current[e];
+        }), []);
+        var ge = (0, t.useCallback)((function(e, r) {
+            if (e === ae) {
+                V.current = r;
+            } else {
+                M.current = r;
+            }
+        }), [ ae ]);
+        var ye = (0, t.useCallback)((function(e) {
+            return e === ae ? V.current : M.current;
+        }), [ ae ]);
+        var we = (0, t.useCallback)((function(e) {
+            return ye(e).length;
+        }), [ ye ]);
+        var Oe = (0, t.useCallback)((function(e) {
+            var r = we(e);
+            return r > 0 && r === pe(e);
+        }), [ we, pe ]);
+        var Re = (0, t.useCallback)((function(e) {
+            return e === ae ? B.current : z.current;
+        }), [ ae ]);
+        var Ee = (0, t.useCallback)((function(e) {
+            var r = we(e);
+            var t = pe(e);
+            return {
+                disabled: r < 1 || t < 1
+            };
+        }), [ we, pe ]);
+        var Ie = (0, t.useCallback)((function() {
+            if (J.current && J.current.length > 0) {
+                var e;
+                J.current = "";
+                (e = G.current) === null || e === void 0 ? void 0 : e.call(G);
+            }
+        }), []);
+        var qe = (0, t.useCallback)((function() {
+            re.current = undefined;
+            ne.current = [];
+            if (te.current) {
+                clearTimeout(te.current);
+            }
+        }), []);
+        var je = (0, t.useCallback)((function(e) {
+            G.current = e;
+        }), []);
+        var _e = (0, t.useCallback)((function(e, r) {
+            if (r) {
+                X.current[e] = r;
+            } else {
+                delete X.current[e];
+            }
+        }), []);
+        var De = (0, t.useCallback)((function(e, r) {
+            if (r) {
+                W.current[e] = r;
+            } else {
+                delete W.current[e];
+            }
+        }), []);
+        var Ne = (0, t.useCallback)((function(e, r) {
+            if (r) {
+                U.current[e] = r;
+            } else {
+                delete U.current[e];
+            }
+        }), []);
+        var Ve = (0, t.useCallback)((function(e) {
+            if (e) {
+                var r, t;
+                (r = (t = X.current)[e]) === null || r === void 0 ? void 0 : r.call(t);
+            }
+        }), []);
+        var Pe = (0, t.useCallback)((function(e) {
+            if (e) {
+                var r, t;
+                (r = (t = W.current)[e]) === null || r === void 0 ? void 0 : r.call(t);
+            }
+        }), []);
+        var He = (0, t.useCallback)((function(e) {
+            if (e) {
+                var r, t;
+                (r = (t = U.current)[e]) === null || r === void 0 ? void 0 : r.call(t);
+            }
+        }), []);
+        var Te = (0, t.useCallback)((function(e) {
+            Ie();
+            Pe(e);
+            He(ae);
+            He(ie);
+        }), [ Ie, He, Pe, ae, ie ]);
+        var Be = (0, t.useCallback)((function(e, r) {
+            var t = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+            var n = e === ae ? T.current : $.current;
+            if (!n) {
+                return;
+            }
+            var a = ve(e);
+            se(e, r);
+            if (!t) {
+                // render new
+                Ve(r);
+            }
+            if (r !== a) {
+                if (!t) {
+                    // render previous
+                    Ve(a);
+                }
+                var i = r ? Y.current[r] : "";
+ // update listbox via dom to avoid render + child render
+                                n.setAttribute("aria-activedescendant", i);
+                if (!t && i.length > 0) {
+                    var l = n.querySelector("#".concat(i));
+                    O(l);
+                }
+            }
+        }), [ ve, se, Ve, ae ]);
+        var Me = (0, t.useCallback)((function(e, r) {
+            var t = r.value, n = r.name;
+            var a = Oe(n) ? ye(n) : fe(n);
+            var i = x(a, t);
+            if (!N.current) {
+                Q.current[t] = !Q.current[t];
+                de(n, i);
+                Te(n);
+            }
+            Be(n, t);
+            e.preventDefault();
+            I === null || I === void 0 ? void 0 : I(e, {
+                values: i,
+                listName: n
+            });
+        }), [ Oe, fe, ye, de, Be, Te, I ]);
+        var Ae = (0, t.useCallback)((function(e, r) {
+            var t = r.initialIndex, n = r.name, a = r.targetIndex;
+            var i = ye(n);
+            var l = Math.min(t, a);
+            var o = Math.max(t, a);
+            var u = [];
+            if (N.current) {
+                u = i.slice(l, o + 1);
+            } else {
+                i.forEach((function(e, r) {
+                    var t = false;
+                    if (r >= l && r <= o) {
+                        t = true;
+                        u.push(e);
+                    } else {
+                        t = false;
+                    }
+                    if (Q.current[e] !== t) {
+                        Q.current[e] = t;
+                        Ve(e);
+                    }
+                }));
+                de(n, u);
+                Te(n);
+            }
+            Be(n, i[a]);
+            e.preventDefault();
+            e.stopPropagation();
+            I === null || I === void 0 ? void 0 : I(e, {
+                values: u,
+                listName: n
+            });
+        }), [ ye, I, de, Be, Te, Ve ]);
+        var Ke = (0, t.useCallback)((function(e, r) {
+            var t = r.name, n = r.selected;
+            var a = ye(t);
+            var i = n === true ? [] : a;
+            var l = n !== true;
+            if (!N.current) {
+                a === null || a === void 0 ? void 0 : a.forEach((function(e) {
+                    if (Q.current[e] !== l) {
+                        Q.current[e] = l;
+                        Ve(e);
+                    }
+                }));
+                de(t, i);
+                Te(t);
+            }
+            e.preventDefault();
+            I === null || I === void 0 ? void 0 : I(e, {
+                values: i,
+                listName: t
+            });
+        }), [ ye, I, de, Te, Ve ]);
+ // handleMoveValues does not update the active value of the source, keyboard and mouse differ, only the target active value is updated
+                var $e = (0, t.useCallback)((function(e, r, t) {
+            var n = ye(r);
+            var a = fe(r);
+            var i = Oe(r);
+            var o = ye(t);
+            var u = ve(t);
+            if (n.length === 0 || !i && a.length === 0) {
+                return;
+            }
+            if (!u && a.length > 0) {
+                // target lacks an active value, default to the first
+                // skip the render it will be catch in batch
+                Be(t, a[0], true);
+            }
+            var c = (0, d.sprintf)((0, l._)("Moved %(count)d items to %(listLabel)s list"), {
+                count: a.length,
+                listLabel: t === ae ? le : oe
+            });
+ // These new values do not perserve sort position, may need to be refactored with sort logic (SUI-5270).
+                        var s = i ? [] : S(n, a);
+            var v = o.concat(a);
+            if (!N.current) {
+                a.forEach((function(e) {
+                    Q.current[e] = false;
+                }));
+                ge(t, v);
+                ge(r, s);
+                de(r, []);
+                J.current = c;
+ // move is a batch update, force a full render, no internal update needed
+                                _();
+            }
+            var f = {
+                affectedValues: a,
+                sourceListName: r || "",
+                sourceValues: s,
+                targetListName: t || "",
+                targetValues: v,
+                screenReaderMessage: c || "",
+                values: a.slice()
+            };
+            e.preventDefault();
+            R === null || R === void 0 ? void 0 : R(e, f);
+        }), [ _, ve, Oe, fe, ye, R, de, ge, Be, ae, le, oe ]);
+        var Fe = (0, t.useCallback)((function(e, r) {
+            var t = r.name;
+            var n = Oe(t);
+            var a = ve(t);
+            var i = t === ae ? ie : ae;
+            if (a && (n || !!Q.current[a])) {
+                // active option was present in items to be removed, clear the active option
+                Be(t);
+            }
+            $e(e, t, i);
+        }), [ ve, Oe, $e, Be, ae, ie ]);
+        var ze = (0, t.useCallback)((function(e, r) {
+            var t = r.name, n = r.value;
+            if (e.nativeEvent.shiftKey) {
+                Ae(e, {
+                    targetIndex: Z.current[n],
+                    initialIndex: ee.current,
+                    name: t
+                });
+            } else {
+                Me(e, {
+                    name: t,
+                    value: n
+                });
+            }
+        }), [ Ae, Me ]);
+        var Ue = (0, t.useCallback)((function(e, r) {
+            Ke(e, r);
+        }), [ Ke ]);
+        var We = (0, t.useCallback)((function(e, r) {
+            var t = e.nativeEvent.key;
+            var n = Re(r);
+ // Checking for a single character to avoid complications from double-byte languages and emojis.
+                        if (t.length === 1) {
+                var a = [];
+                var i = {
+                    index: 0,
+                    value: t
+                };
+                if (!re.current) {
+                    if (t === " ") {
+                        qe();
+                        return;
+                    }
+                    a = E(n, i);
+                } else if (ne.current.length > 1) {
+                    i.index = re.current.index + 1;
+                    a = E(ne.current, i);
+                }
+                if (a.length) {
+                    var l = 0;
+ // If the active option is a first character match, cycle to the next matching option.
+                                        if (i.index === 0 && a.length > 1) {
+                        var o = ve(r);
+                        if (o) {
+                            var u = a.findIndex((function(e) {
+                                return e.value === o;
+                            }));
+                            if (u >= 0) {
+                                l = u === a.length - 1 ? 0 : u + 1;
+                            }
+                        }
+                    }
+                    Be(r, a[l].value);
+                }
+                ne.current = a;
+                re.current = i;
+                if (te.current) {
+                    clearTimeout(te.current);
+                }
+                te.current = setTimeout(qe, 500);
+                e.preventDefault();
+                e.stopPropagation();
+            }
+        }), [ ve, Re, qe, Be ]);
+        var Xe = (0, t.useCallback)((function(e, r) {
+            var t = r.name;
+            var n = (0, o.keycode)(e.nativeEvent);
+            var a = ye(t);
+            var i = fe(t);
+            var l = Oe(t);
+            var u = ve(t);
+            var c = u ? Z.current[u] : -1;
+            var s = ee.current >= 0 ? ee.current : 0;
+            if (J.current && J.current.length > 0) {
+                Ie();
+            }
+            var v = u;
+            switch (n) {
+              case "shift":
+                ee.current = c;
+                break;
+
+              case "home":
+                if (e.nativeEvent.ctrlKey && e.nativeEvent.shiftKey) {
+                    // handle select until start
+                    Ae(e, {
+                        targetIndex: 0,
+                        initialIndex: s,
+                        name: t
+                    });
+                } else {
+                    var d = Se(a, 1);
+                    v = d[0];
+                }
+                break;
+
+              case "end":
+                if (e.nativeEvent.ctrlKey && e.nativeEvent.shiftKey) {
+                    // handle select until end
+                    Ae(e, {
+                        targetIndex: a.length - 1,
+                        initialIndex: s,
+                        name: t
+                    });
+                } else {
+                    v = a[a.length - 1];
+                }
+                break;
+
+              case "up":
+                if (e.nativeEvent.shiftKey) {
+                    // handle select until previous
+                    Ae(e, {
+                        targetIndex: Math.max(c - 1, 0),
+                        initialIndex: s,
+                        name: t
+                    });
+                } else {
+                    v = a[Math.max(c - 1, 0)];
+                }
+                break;
+
+              case "down":
+                if (e.nativeEvent.shiftKey) {
+                    // handle select until next
+                    Ae(e, {
+                        targetIndex: Math.min(c + 1, a.length - 1),
+                        initialIndex: s,
+                        name: t
+                    });
+                } else {
+                    v = a[Math.min(c + 1, a.length - 1)];
+                }
+                break;
+
+              case "space":
+                if (u != null) {
+                    Me(e, {
+                        name: t,
+                        value: u
+                    });
+                }
+                break;
+
+              case "enter":
+                if (t === ae) {
+                    if (l) {
+                        // all values moved, no longer an active value
+                        v = undefined;
+                    } else if (i.length > 0) {
+                        // somes values moved, determine next active value
+                        v = w(c, a, i);
+                    }
+                    $e(e, ae, ie);
+                }
+                break;
+
+              case "delete":
+                if (t === ie) {
+                    if (l) {
+                        // all values moved, no longer an active value
+                        v = undefined;
+                    } else if (i.length > 0) {
+                        // somes values moved, determine next active value
+                        v = w(c, a, i);
+                    }
+                    $e(e, ie, ae);
+                }
+                break;
+
+              default:
+                if (n === "a" && (e.nativeEvent.ctrlKey || e.nativeEvent.metaKey)) {
+                    // handle control + A, otherwise let 'a' passthrough
+                    Ke(e, {
+                        name: t,
+                        selected: l
+                    });
+                } else {
+                    // do fuzzy match
+                    We(e, t);
+                }
+                break;
+            }
+            if (v !== u) {
+                e.preventDefault();
+                Be(t, v);
+            }
+        }), [ Ie, ve, Oe, fe, ye, We, $e, Ae, Me, Ke, Be, ae, ie ]);
+        var Ge = (0, t.useMemo)((function() {
+            return {
+                onButtonClick: Fe,
+                updateButtonRefreshHookByName: Ne,
+                getButtonState: Ee
+            };
+        }), [ Fe, Ne, Ee ]);
+        var Je = (0, t.useMemo)((function() {
+            return {
+                controlled: N.current,
+                getActiveValue: ve,
+                getScreenReaderMessage: be,
+                getSelectedStateForValue: me,
+                getSelectedValueCount: pe,
+                getValueCount: we,
+                updateLabelRefreshHookByName: De,
+                updateOptionRefreshHookByValue: _e,
+                updateScreenReaderRefreshHook: je
+            };
+        }), [ ve, be, me, pe, we, De, _e, je ]);
+        if (N.current && !ce[0].activeFound) {
+            // listOne active value wasn't found, likely the result of a controlled state reset
+            // update interal values, skip the render it will be caught in batch
+            Be(ae, undefined, true);
         }
-
-        break;
-
-      default:
-        if (eventKeyCode === 'a' && (event.nativeEvent.ctrlKey || event.nativeEvent.metaKey)) {
-          // handle control + A, otherwise let 'a' passthrough
-          handleSelectAll(event, {
-            name: name,
-            selected: isAllSelected
-          });
-        } else {
-          // do fuzzy match
-          handleKeyMatch(event, name);
+        if (N.current && !ce[1].activeFound) {
+            // listTwo active value wasn't found, likely the result of a controlled state reset
+            // update interal values, skip the render it will be caught in batch
+            Be(ie, undefined, true);
         }
-
-        break;
+        
+        return n().createElement(ke, xe({
+            "data-test": "dual-listbox",
+            $inline: h ? false : k,
+            $fill: h
+        }, j),  n().createElement(g.Provider, {
+            value: Je
+        },  n().createElement(he, {
+            index: 0,
+            elementRef: T,
+            label: le,
+            name: ae,
+            onClick: ze,
+            onKeyDown: Xe,
+            onSelectAllClick: Ue
+        }, ce[0].options),  n().createElement(Ce, null,  n().createElement(L.Provider, {
+            value: Ge
+        },  n().createElement(F, {
+            ariaLabel: (0, d.sprintf)((0, l._)("Move selected options to %(listLabel)s list"), {
+                listLabel: oe
+            }),
+            ariaKeyShortcuts: "Enter",
+            "data-test": "move-to-secondary",
+            icon:  n().createElement(v(), {
+                hideDefaultTooltip: true,
+                screenReaderText: null
+            }),
+            name: ae,
+            tooltipLabel: (0, d.sprintf)((0, l._)("Move to %(listLabel)s"), {
+                listLabel: oe
+            }),
+            tooltipPlacement: "left"
+        }),  n().createElement(F, {
+            ariaLabel: (0, d.sprintf)((0, l._)("Move selected options to %(listLabel)s list"), {
+                listLabel: le
+            }),
+            ariaKeyShortcuts: "Delete",
+            "data-test": "move-to-primary",
+            icon:  n().createElement(c(), {
+                hideDefaultTooltip: true,
+                screenReaderText: null
+            }),
+            name: ie,
+            tooltipLabel: (0, d.sprintf)((0, l._)("Move to %(listLabel)s"), {
+                listLabel: le
+            }),
+            tooltipPlacement: "right"
+        }))),  n().createElement(he, {
+            index: 1,
+            elementRef: $,
+            label: oe,
+            name: ie,
+            onClick: ze,
+            onKeyDown: Xe,
+            onSelectAllClick: Ue
+        }, ce[1].options),  n().createElement(C, null)));
     }
-
-    if (nextActiveValue !== activeValue) {
-      event.preventDefault();
-      updateActiveOption(name, nextActiveValue);
-    }
-  }, [clearScreenReaderText, getActiveValue, getIsAllSelected, getSelectedValues, getValues, handleKeyMatch, handleMoveValues, handleRangeSelection, handleSingleSelection, handleSelectAll, updateActiveOption, listOneName, listTwoName]);
-  var toolbarContextValue = Object(external_react_["useMemo"])(function () {
-    return {
-      onButtonClick: handleToolbarButtonClick,
-      updateButtonRefreshHookByName: updateButtonRefreshHookByName,
-      getButtonState: getButtonState
-    };
-  }, [handleToolbarButtonClick, updateButtonRefreshHookByName, getButtonState]);
-  var dualContextValue = Object(external_react_["useMemo"])(function () {
-    return {
-      controlled: isControlledRef.current,
-      getActiveValue: getActiveValue,
-      getScreenReaderMessage: getScreenReaderMessage,
-      getSelectedStateForValue: getSelectedStateForValue,
-      getSelectedValueCount: getSelectedValueCount,
-      getValueCount: getValueCount,
-      updateLabelRefreshHookByName: updateLabelRefreshHookByName,
-      updateOptionRefreshHookByValue: updateOptionRefreshHookByValue,
-      updateScreenReaderRefreshHook: updateScreenReaderRefreshHook
-    };
-  }, [getActiveValue, getScreenReaderMessage, getSelectedStateForValue, getSelectedValueCount, getValueCount, updateLabelRefreshHookByName, updateOptionRefreshHookByValue, updateScreenReaderRefreshHook]);
-
-  if (isControlledRef.current && !listData[0].activeFound) {
-    // listOne active value wasn't found, likely the result of a controlled state reset
-    // update interal values, skip the render it will be caught in batch
-    updateActiveOption(listOneName, undefined, true);
-  }
-
-  if (isControlledRef.current && !listData[1].activeFound) {
-    // listTwo active value wasn't found, likely the result of a controlled state reset
-    // update interal values, skip the render it will be caught in batch
-    updateActiveOption(listTwoName, undefined, true);
-  }
-
-  return /*#__PURE__*/external_react_default.a.createElement(StyledBox, DualListbox_extends({
-    "data-test": "dual-listbox",
-    $inline: fill ? false : inline,
-    $fill: fill
-  }, otherProps), /*#__PURE__*/external_react_default.a.createElement(DualListbox_DualListboxContext.Provider, {
-    value: dualContextValue
-  }, /*#__PURE__*/external_react_default.a.createElement(DualListbox_Listbox, {
-    index: 0,
-    elementRef: listOneNodeRef,
-    label: listOneLabel,
-    name: listOneName,
-    onClick: handleOptionClick,
-    onKeyDown: handleListboxKeyDown,
-    onSelectAllClick: handleSelectAllClick
-  }, listData[0].options), /*#__PURE__*/external_react_default.a.createElement(StyledFlexColumn, null, /*#__PURE__*/external_react_default.a.createElement(DualListbox_ToolbarContext.Provider, {
-    value: toolbarContextValue
-  }, /*#__PURE__*/external_react_default.a.createElement(DualListbox_ToolbarButton, {
-    ariaLabel: Object(format_["sprintf"])(Object(i18n_["_"])('Move selected options to %(listLabel)s list'), {
-      listLabel: listTwoLabel
-    }),
-    ariaKeyShortcuts: "Enter",
-    "data-test": "move-to-secondary",
-    icon: /*#__PURE__*/external_react_default.a.createElement(ChevronRight_default.a, {
-      hideDefaultTooltip: true,
-      screenReaderText: null
-    }),
-    name: listOneName,
-    tooltipLabel: Object(format_["sprintf"])(Object(i18n_["_"])('Move to %(listLabel)s'), {
-      listLabel: listTwoLabel
-    }),
-    tooltipPlacement: "left"
-  }), /*#__PURE__*/external_react_default.a.createElement(DualListbox_ToolbarButton, {
-    ariaLabel: Object(format_["sprintf"])(Object(i18n_["_"])('Move selected options to %(listLabel)s list'), {
-      listLabel: listOneLabel
-    }),
-    ariaKeyShortcuts: "Delete",
-    "data-test": "move-to-primary",
-    icon: /*#__PURE__*/external_react_default.a.createElement(ChevronLeft_default.a, {
-      hideDefaultTooltip: true,
-      screenReaderText: null
-    }),
-    name: listTwoName,
-    tooltipLabel: Object(format_["sprintf"])(Object(i18n_["_"])('Move to %(listLabel)s'), {
-      listLabel: listOneLabel
-    }),
-    tooltipPlacement: "right"
-  }))), /*#__PURE__*/external_react_default.a.createElement(DualListbox_Listbox, {
-    index: 1,
-    elementRef: listTwoNodeRef,
-    label: listTwoLabel,
-    name: listTwoName,
-    onClick: handleOptionClick,
-    onKeyDown: handleListboxKeyDown,
-    onSelectAllClick: handleSelectAllClick
-  }, listData[1].options), /*#__PURE__*/external_react_default.a.createElement(DualListbox_ScreenReaderWrapper, null)));
-}
-
-DualListbox.propTypes = DualListbox_propTypes;
-DualListbox.Option = DualListbox_Option;
-/* harmony default export */ var DualListbox_DualListbox = (DualListbox);
-
-// CONCATENATED MODULE: ./src/DualListbox/index.ts
-
-
-
-/***/ }),
-
-/***/ 2:
-/***/ (function(module, exports) {
-
-module.exports = require("react");
-
-/***/ }),
-
-/***/ 29:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/ui-utils/format");
-
-/***/ }),
-
-/***/ 3:
-/***/ (function(module, exports) {
-
-module.exports = require("styled-components");
-
-/***/ }),
-
-/***/ 38:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-icons/enterprise/ChevronRight");
-
-/***/ }),
-
-/***/ 39:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/Switch");
-
-/***/ }),
-
-/***/ 4:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/ui-utils/i18n");
-
-/***/ }),
-
-/***/ 45:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/Tooltip");
-
-/***/ }),
-
-/***/ 48:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/useForceUpdate");
-
-/***/ }),
-
-/***/ 59:
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* unused harmony export charFromMatchOption */
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return fuzzyMatch; });
-// A utility for matching keyboard characters to list values
-var charFromMatchOption = function charFromMatchOption(option, charIndex) {
-  return option ? option.label.charAt(charIndex).toLowerCase() : '';
-};
-
-var fuzzyMatch = function fuzzyMatch(options, matchChar) {
-  if (!options.length) {
-    return options;
-  }
-
-  var defaultMatch = null;
-  var hasMatch = false;
-  var matches = options.filter(function (option) {
-    var characterValue = charFromMatchOption(option, matchChar.index);
-
-    if (characterValue === matchChar.value) {
-      hasMatch = 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 (!hasMatch) {
-      var defaultValue = charFromMatchOption(defaultMatch, matchChar.index);
-
-      if (!defaultValue) {
-        defaultMatch = option;
-      } else if (characterValue > matchChar.value) {
-        if (defaultValue < matchChar.value) {
-          defaultMatch = option;
-        } else if (defaultValue > characterValue) {
-          defaultMatch = option;
-        }
-      } else if (characterValue > defaultValue) {
-        defaultMatch = option;
-      }
-    }
-
-    return false;
-  });
-  return matches.length === 0 && defaultMatch ? [defaultMatch] : matches;
-};
-
-
-
-/***/ }),
-
-/***/ 6:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/Box");
-
-/***/ }),
-
-/***/ 66:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-icons/enterprise/ChevronLeft");
-
-/***/ }),
-
-/***/ 7:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/ui-utils/keyboard");
-
-/***/ }),
-
-/***/ 8:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/ui-utils/id");
-
-/***/ }),
-
-/***/ 91:
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return scrollIntoViewIfNeeded; });
-// A utility that attempts to move an element into view by scrolling it's derived parent.
-var scrollIntoViewIfNeeded = function scrollIntoViewIfNeeded(el) {
-  if (!el) {
-    return;
-  }
-
-  var parentEl = el.offsetParent;
-
-  if (!parentEl) {
-    return;
-  } // Below the bottom of the container.
-
-
-  if (parentEl.scrollTop + parentEl.clientHeight < el.offsetTop + el.clientHeight) {
-    parentEl.scrollTop = el.offsetTop + el.clientHeight - parentEl.clientHeight; // Above the top of the container.
-  } else if (parentEl.scrollTop > el.offsetTop) {
-    parentEl.scrollTop = el.offsetTop;
-  }
-};
-
-
-
-/***/ })
-
-/******/ });
+    _e.propTypes = je;
+    _e.Option = ne;
+    /* harmony default export */    const De = _e;
+    // CONCATENATED MODULE: ./src/DualListbox/index.ts
+    module.exports = r;
+    /******/})();