@innovaccer/design-system 2.24.0 → 2.25.0

package/dist/index.esm.js

@@ -1,8 +1,8 @@
 
   /**
-   * Generated on: 1699361774915 
+   * Generated on: 1699952738463 
    *      Package: @innovaccer/design-system
-   *      Version: v2.24.0
+   *      Version: v2.25.0
    *      License: MIT
    *         Docs: https://innovaccer.github.io/design-system
    */
@@ -1227,7 +1227,7 @@ var Breadcrumbs = function Breadcrumbs(props) {
   })));
 };
 
-var _excluded$E = ["size", "appearance", "iconAlign", "tabIndex", "largeIcon", "type", "children", "icon", "expanded", "selected", "loading", "disabled", "className", "tooltip", "iconType"];
+var _excluded$G = ["size", "appearance", "iconAlign", "tabIndex", "largeIcon", "type", "children", "icon", "expanded", "selected", "loading", "disabled", "className", "tooltip", "iconType"];
 var sizeMapping$3 = {
   tiny: 12,
   regular: 16,
@@ -1256,7 +1256,7 @@ var ButtonElement = /*#__PURE__*/React.forwardRef(function (props, ref) {
       className = props.className;
       props.tooltip;
       var iconType = props.iconType,
-      rest = _objectWithoutProperties(props, _excluded$E);
+      rest = _objectWithoutProperties(props, _excluded$G);
 
   var buttonClass = classnames((_classNames = {}, _defineProperty$1(_classNames, 'Button', true), _defineProperty$1(_classNames, 'Button--expanded', expanded), _defineProperty$1(_classNames, "Button--".concat(size), size), _defineProperty$1(_classNames, "Button--".concat(size, "Square"), !children), _defineProperty$1(_classNames, "Button--".concat(appearance), appearance), _defineProperty$1(_classNames, 'Button--selected', selected && (appearance === 'basic' || appearance === 'transparent')), _defineProperty$1(_classNames, "Button--iconAlign-".concat(iconAlign), children && iconAlign), _defineProperty$1(_classNames, "".concat(className), className), _classNames));
   var iconClass = classnames((_classNames2 = {}, _defineProperty$1(_classNames2, 'Button-icon', true), _defineProperty$1(_classNames2, "Button-icon--".concat(iconAlign), children && iconAlign), _classNames2));
@@ -2565,7 +2565,7 @@ _defineProperty$1(Calendar, "defaultProps", {
   jumpView: true
 });
 
-var _excluded$D = ["shadow", "children", "className"];
+var _excluded$F = ["shadow", "children", "className"];
 var Card = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _classNames;
 
@@ -2573,7 +2573,7 @@ var Card = /*#__PURE__*/React.forwardRef(function (props, ref) {
       shadow = _props$shadow === void 0 ? 'shadow10' : _props$shadow,
       children = props.children,
       className = props.className,
-      rest = _objectWithoutProperties(props, _excluded$D);
+      rest = _objectWithoutProperties(props, _excluded$F);
 
   var classes = classnames((_classNames = {
     Card: true
@@ -2590,12 +2590,12 @@ Card.defaultProps = {
   shadow: 'shadow10'
 };
 
-var _excluded$C = ["border", "children", "className"];
+var _excluded$E = ["border", "children", "className"];
 var CardSubdued = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var border = props.border,
       children = props.children,
       className = props.className,
-      rest = _objectWithoutProperties(props, _excluded$C);
+      rest = _objectWithoutProperties(props, _excluded$E);
 
   var classes = classnames(_defineProperty$1({
     CardSubdued: true
@@ -2662,7 +2662,7 @@ var isSpaceKey = function isSpaceKey(e) {
   return e.key === 'Space';
 };
 
-var _excluded$B = ["onClick", "onKeyDown", "role", "tabIndex"];
+var _excluded$D = ["onClick", "onKeyDown", "role", "tabIndex"];
 var allowed = {
   button: new Set(['Enter', 'Space', 'Spacebar', ' ']),
   link: new Set(['Enter']),
@@ -2686,7 +2686,7 @@ var useAccessibilityProps = function useAccessibilityProps(_ref) {
       _ref$role = _ref.role,
       role = _ref$role === void 0 ? 'button' : _ref$role,
       tabIndex = _ref.tabIndex,
-      rest = _objectWithoutProperties(_ref, _excluded$B);
+      rest = _objectWithoutProperties(_ref, _excluded$D);
 
   return _objectSpread2({}, onClick ? {
     onClick: onClick,
@@ -2804,21 +2804,21 @@ Icon.defaultProps = {
   size: 16
 };
 
-var _excluded$A = ["children", "componentType", "className"];
+var _excluded$C = ["children", "componentType", "className"];
 
 var GenericText = function GenericText(_ref) {
   var children = _ref.children,
       _ref$componentType = _ref.componentType,
       componentType = _ref$componentType === void 0 ? 'span' : _ref$componentType,
       className = _ref.className,
-      props = _objectWithoutProperties(_ref, _excluded$A);
+      props = _objectWithoutProperties(_ref, _excluded$C);
 
   return /*#__PURE__*/React.createElement(componentType, _objectSpread2(_objectSpread2({}, props), {}, {
     className: className
   }), children);
 };
 
-var _excluded$z = ["appearance", "size", "children", "weight", "small", "className", "color"];
+var _excluded$B = ["appearance", "size", "children", "weight", "small", "className", "color"];
 var Text = function Text(props) {
   var _classNames;
 
@@ -2829,7 +2829,7 @@ var Text = function Text(props) {
       small = props.small,
       className = props.className,
       color = props.color,
-      rest = _objectWithoutProperties(props, _excluded$z);
+      rest = _objectWithoutProperties(props, _excluded$B);
 
   var classes = classnames((_classNames = {
     Text: true
@@ -3116,7 +3116,7 @@ var CheckboxIcon = function CheckboxIcon(props) {
   }
 };
 
-var _excluded$y = ["size", "tabIndex", "defaultChecked", "indeterminate", "label", "error", "disabled", "onChange", "name", "value", "className", "checked", "helpText", "id"];
+var _excluded$A = ["size", "tabIndex", "defaultChecked", "indeterminate", "label", "error", "disabled", "onChange", "name", "value", "className", "checked", "helpText", "id"];
 var Checkbox = /*#__PURE__*/React.forwardRef(function (props, forwardedRef) {
   var _classNames, _classNames2, _classNames3, _classNames4, _classNames5, _classNames6;
 
@@ -3137,7 +3137,7 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (props, forwardedRef) {
       helpText = props.helpText,
       _props$id = props.id,
       id = _props$id === void 0 ? "".concat(name, "-").concat(label, "-").concat(uidGenerator()) : _props$id,
-      rest = _objectWithoutProperties(props, _excluded$y);
+      rest = _objectWithoutProperties(props, _excluded$A);
 
   var ref = React.useRef(null);
   React.useImperativeHandle(forwardedRef, function () {
@@ -3218,7 +3218,7 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (props, forwardedRef) {
 });
 Checkbox.displayName = 'Checkbox';
 
-var _excluded$x = ["size", "sizeXS", "sizeS", "sizeM", "sizeL", "sizeXL", "className", "children"];
+var _excluded$z = ["size", "sizeXS", "sizeS", "sizeM", "sizeL", "sizeXL", "className", "children"];
 var Column = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _classNames;
 
@@ -3230,7 +3230,7 @@ var Column = /*#__PURE__*/React.forwardRef(function (props, ref) {
       sizeXL = props.sizeXL,
       className = props.className,
       children = props.children,
-      rest = _objectWithoutProperties(props, _excluded$x);
+      rest = _objectWithoutProperties(props, _excluded$z);
 
   var classes = classnames((_classNames = {}, _defineProperty$1(_classNames, 'Col', true), _defineProperty$1(_classNames, "Col--".concat(size), size), _defineProperty$1(_classNames, "Col--xs-".concat(sizeXS), sizeXS), _defineProperty$1(_classNames, "Col--s-".concat(sizeS), sizeS), _defineProperty$1(_classNames, "Col--m-".concat(sizeM), sizeM), _defineProperty$1(_classNames, "Col--l-".concat(sizeL), sizeL), _defineProperty$1(_classNames, "Col--xl-".concat(sizeXL), sizeXL), _defineProperty$1(_classNames, "".concat(className), className), _classNames));
   return /*#__PURE__*/React.createElement("div", _extends$2({
@@ -3341,7 +3341,7 @@ var Trigger$1 = function Trigger(props) {
   }));
 };
 
-var _excluded$w = ["date", "open", "position", "inputFormat", "outputFormat", "inputOptions", "validators", "withInput", "disabledBefore", "disabledAfter", "onDateChange", "closeOnSelect", "size", "showTodayDate", "children", "view"];
+var _excluded$y = ["date", "open", "position", "inputFormat", "outputFormat", "inputOptions", "validators", "withInput", "disabledBefore", "disabledAfter", "onDateChange", "closeOnSelect", "size", "showTodayDate", "children", "view"];
 var DatePicker = /*#__PURE__*/function (_React$Component) {
   _inherits(DatePicker, _React$Component);
 
@@ -3484,7 +3484,7 @@ var DatePicker = /*#__PURE__*/function (_React$Component) {
           _this$props4$children = _this$props4.children,
           children = _this$props4$children === void 0 ? /*#__PURE__*/React.createElement(React.Fragment, null) : _this$props4$children,
           view = _this$props4.view,
-          rest = _objectWithoutProperties(_this$props4, _excluded$w);
+          rest = _objectWithoutProperties(_this$props4, _excluded$y);
 
       var date = this.state.date;
       var months = config.months;
@@ -4548,7 +4548,7 @@ function debounce$1 (delay, atBegin, callback) {
   return callback === undefined ? throttle(delay, atBegin, false) : throttle(delay, callback, atBegin !== false);
 }
 
-var _excluded$v = ["triggerSize", "placeholder", "menu", "children", "icon", "disabled", "open", "inlineLabel", "error", "iconType"];
+var _excluded$x = ["triggerSize", "placeholder", "menu", "children", "icon", "disabled", "open", "inlineLabel", "error", "iconType"];
 var DropdownButton = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _classNames, _classNames2;
 
@@ -4565,7 +4565,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (props, ref) {
       inlineLabel = props.inlineLabel,
       error = props.error,
       iconType = props.iconType,
-      rest = _objectWithoutProperties(props, _excluded$v);
+      rest = _objectWithoutProperties(props, _excluded$x);
 
   var buttonDisabled = disabled ? 'disabled' : 'default';
   var trimmedPlaceholder = placeholder.trim();
@@ -5638,7 +5638,7 @@ var DropdownList = function DropdownList(props) {
 
 DropdownList.displayName = 'DropdownList';
 
-var _excluded$u = ["triggerOptions", "selected", "tabIndex"];
+var _excluded$w = ["triggerOptions", "selected", "tabIndex"];
 var inputRef = /*#__PURE__*/React.createRef();
 
 /**
@@ -6330,7 +6330,7 @@ var Dropdown = /*#__PURE__*/function (_React$Component) {
           triggerOptions = _this$props14$trigger === void 0 ? {} : _this$props14$trigger;
           _this$props14.selected;
           var tabIndex = _this$props14.tabIndex,
-          rest = _objectWithoutProperties(_this$props14, _excluded$u);
+          rest = _objectWithoutProperties(_this$props14, _excluded$w);
 
       var remainingOptionsLen = searchedOptionsLength - options.length;
       var firstEnabledOption = tabIndex ? tabIndex : _isSelectAllPresent(searchTerm, remainingOptionsLen, withSelectAll, withCheckbox) ? 0 : options.findIndex(function (option) {
@@ -6378,7 +6378,7 @@ _defineProperty$1(Dropdown, "defaultProps", {
   searchDebounceDuration: 300
 });
 
-var _excluded$t = ["appearance", "size", "children", "className", "color"];
+var _excluded$v = ["appearance", "size", "children", "className", "color"];
 var sizeMap = {
   s: 'h5',
   m: 'h4',
@@ -6394,7 +6394,7 @@ var Heading = function Heading(props) {
       children = props.children,
       className = props.className,
       color = props.color,
-      rest = _objectWithoutProperties(props, _excluded$t);
+      rest = _objectWithoutProperties(props, _excluded$v);
 
   var classes = classnames((_classNames = {
     Heading: true
@@ -6412,13 +6412,13 @@ Heading.defaultProps = {
   size: 'm'
 };
 
-var _excluded$s = ["className", "iconType"];
+var _excluded$u = ["className", "iconType"];
 var ActionButton$1 = function ActionButton(props) {
   var _classNames;
 
   var className = props.className,
       iconType = props.iconType,
-      rest = _objectWithoutProperties(props, _excluded$s);
+      rest = _objectWithoutProperties(props, _excluded$u);
 
   var iconClass = classnames((_classNames = {}, _defineProperty$1(_classNames, 'ActionButton', true), _defineProperty$1(_classNames, "".concat(className), className), _classNames));
   return /*#__PURE__*/React.createElement(Icon, _extends$2({
@@ -6433,7 +6433,7 @@ ActionButton$1.defaultProps = {
   type: 'rounded'
 };
 
-var _excluded$r = ["size", "type", "minWidth", "defaultValue", "name", "placeholder", "value", "icon", "inlineLabel", "required", "error", "info", "onChange", "onClick", "onClear", "onBlur", "onFocus", "onPaste", "actionIcon", "className", "autoFocus", "disabled", "readOnly", "iconType"];
+var _excluded$t = ["size", "type", "minWidth", "defaultValue", "name", "placeholder", "value", "icon", "inlineLabel", "required", "error", "info", "onChange", "onClick", "onClear", "onBlur", "onFocus", "onPaste", "actionIcon", "className", "autoFocus", "disabled", "readOnly", "iconType"];
 var sizeMapping$2 = {
   tiny: 12,
   regular: 16,
@@ -6475,7 +6475,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (props, forwardedRef) {
       disabled = props.disabled,
       readOnly = props.readOnly,
       iconType = props.iconType,
-      rest = _objectWithoutProperties(props, _excluded$r);
+      rest = _objectWithoutProperties(props, _excluded$t);
 
   var ref = React.useRef(null);
 
@@ -6584,7 +6584,7 @@ Object.assign(Input, {
   ActionButton: ActionButton$1
 });
 
-var _excluded$q = ["size", "defaultValue", "name", "placeholder", "icon", "prefix", "suffix", "error", "min", "max", "onChange", "onClick", "onBlur", "onFocus", "className", "autoFocus", "disabled", "readOnly", "value", "showActionButton", "onKeyDown", "iconType"];
+var _excluded$s = ["size", "defaultValue", "name", "placeholder", "icon", "prefix", "suffix", "error", "min", "max", "onChange", "onClick", "onBlur", "onFocus", "className", "autoFocus", "disabled", "readOnly", "value", "showActionButton", "onKeyDown", "iconType"];
 var sizeMapping$1 = {
   regular: 16,
   large: 20
@@ -6635,7 +6635,7 @@ var MetricInput = /*#__PURE__*/React.forwardRef(function (props, forwardedRef) {
       showActionButton = _props$showActionButt === void 0 ? true : _props$showActionButt,
       onKeyDown = props.onKeyDown,
       iconType = props.iconType,
-      rest = _objectWithoutProperties(props, _excluded$q);
+      rest = _objectWithoutProperties(props, _excluded$s);
 
   var ref = React.useRef(null);
   var isUncontrolled = valueProp === undefined;
@@ -6799,7 +6799,7 @@ var getDefaultValue = function getDefaultValue(mask, placeholderChar) {
   return val;
 };
 
-var _excluded$p = ["mask", "value", "placeholderChar", "validators", "clearOnEmptyBlur", "defaultValue", "mask", "error", "caption", "required", "onChange", "onPaste", "onBlur", "onFocus", "onClear", "className", "id", "helpText"];
+var _excluded$r = ["mask", "value", "placeholderChar", "validators", "clearOnEmptyBlur", "defaultValue", "mask", "error", "caption", "required", "onChange", "onPaste", "onBlur", "onFocus", "onClear", "className", "id", "helpText"];
 
 /**
  * It works as Uncontrolled Input
@@ -6828,7 +6828,7 @@ var InputMask = /*#__PURE__*/React.forwardRef(function (props, forwardRef) {
       className = props.className,
       id = props.id,
       helpText = props.helpText,
-      rest = _objectWithoutProperties(props, _excluded$p);
+      rest = _objectWithoutProperties(props, _excluded$r);
 
   var isEditable = React.useCallback(function (pos) {
     return _typeof(mask[pos]) === 'object';
@@ -7132,7 +7132,7 @@ InputMask.utils = {
 };
 var X = InputMask;
 
-var _excluded$o = ["required", "optional", "withInput", "disabled", "children", "className", "info"];
+var _excluded$q = ["required", "optional", "withInput", "disabled", "children", "className", "info"];
 
 /**
  * *NOTE: Extends props with HTMLProps<HTMLLabelElement>*
@@ -7147,7 +7147,7 @@ var Label = function Label(props) {
       children = props.children,
       className = props.className,
       info = props.info,
-      rest = _objectWithoutProperties(props, _excluded$o);
+      rest = _objectWithoutProperties(props, _excluded$q);
 
   var baseProps = extractBaseProps(props);
   var LabelClass = classnames((_classNames = {
@@ -7305,7 +7305,7 @@ var Editable = function Editable(props) {
 };
 Editable.displayName = 'Editable';
 
-var _excluded$n = ["onChange", "onClose"];
+var _excluded$p = ["onChange", "onClose"];
 var EditableDropdown = function EditableDropdown(props) {
   var _classNames2;
 
@@ -7316,7 +7316,7 @@ var EditableDropdown = function EditableDropdown(props) {
 
   var onDropdownChange = dropdownOptions.onChange,
       onDropdownClose = dropdownOptions.onClose,
-      rest = _objectWithoutProperties(dropdownOptions, _excluded$n);
+      rest = _objectWithoutProperties(dropdownOptions, _excluded$p);
 
   var _React$useState = React.useState(placeholder),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -7398,7 +7398,7 @@ EditableDropdown.defaultProps = {
   dropdownOptions: {}
 };
 
-var _excluded$m = ["children", "className", "appearance", "size", "disabled"];
+var _excluded$o = ["children", "className", "appearance", "size", "disabled"];
 var Link = function Link(props) {
   var _classNames;
 
@@ -7407,7 +7407,7 @@ var Link = function Link(props) {
       appearance = props.appearance,
       size = props.size,
       disabled = props.disabled,
-      rest = _objectWithoutProperties(props, _excluded$m);
+      rest = _objectWithoutProperties(props, _excluded$o);
 
   var classes = classnames((_classNames = {
     Link: true
@@ -8303,12 +8303,12 @@ _defineProperty$1(MultiSlider, "defaultProps", {
 
 _defineProperty$1(MultiSlider, "Handle", MultiSliderHandle);
 
-var _excluded$l = ["children", "className", "onOutsideClick"];
+var _excluded$n = ["children", "className", "onOutsideClick"];
 var OutsideClick = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var children = props.children,
       className = props.className,
       onOutsideClick = props.onOutsideClick,
-      rest = _objectWithoutProperties(props, _excluded$l);
+      rest = _objectWithoutProperties(props, _excluded$n);
 
   var innerRef = React.useRef(null);
   React.useImperativeHandle(ref, function () {
@@ -8340,7 +8340,7 @@ var OutsideClick = /*#__PURE__*/React.forwardRef(function (props, ref) {
 });
 OutsideClick.displayName = 'OutsideClick';
 
-var _excluded$k = ["appearance", "children", "className", "color"];
+var _excluded$m = ["appearance", "children", "className", "color"];
 var Paragraph = function Paragraph(props) {
   var _classNames;
 
@@ -8348,7 +8348,7 @@ var Paragraph = function Paragraph(props) {
       children = props.children,
       className = props.className,
       color = props.color,
-      rest = _objectWithoutProperties(props, _excluded$k);
+      rest = _objectWithoutProperties(props, _excluded$m);
 
   var classes = classnames((_classNames = {
     Text: true
@@ -8396,7 +8396,7 @@ ProgressBar.defaultProps = {
   size: 'regular'
 };
 
-var _excluded$j = ["size", "label", "disabled", "onChange", "name", "value", "checked", "defaultChecked", "className", "helpText", "error"];
+var _excluded$l = ["size", "label", "disabled", "onChange", "name", "value", "checked", "defaultChecked", "className", "helpText", "error"];
 var Radio = /*#__PURE__*/React.forwardRef(function (props, forwardedRef) {
   var _classNames, _classNames2, _classNames3;
 
@@ -8412,7 +8412,7 @@ var Radio = /*#__PURE__*/React.forwardRef(function (props, forwardedRef) {
       className = props.className,
       helpText = props.helpText,
       error = props.error,
-      rest = _objectWithoutProperties(props, _excluded$j);
+      rest = _objectWithoutProperties(props, _excluded$l);
 
   var ref = React.useRef(null);
   React.useImperativeHandle(forwardedRef, function () {
@@ -8463,11 +8463,11 @@ var Radio = /*#__PURE__*/React.forwardRef(function (props, forwardedRef) {
 });
 Radio.displayName = 'Radio';
 
-var _excluded$i = ["className", "children"];
+var _excluded$k = ["className", "children"];
 var Row = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var className = props.className,
       children = props.children,
-      rest = _objectWithoutProperties(props, _excluded$i);
+      rest = _objectWithoutProperties(props, _excluded$k);
 
   var classes = classnames(_defineProperty$1({
     Row: true
@@ -8584,13 +8584,13 @@ Spinner.defaultProps = {
   size: 'medium'
 };
 
-var _excluded$h = ["value", "defaultValue", "onRelease", "onChange"];
+var _excluded$j = ["value", "defaultValue", "onRelease", "onChange"];
 var Slider = function Slider(props) {
   var valueProp = props.value,
       defaultValue = props.defaultValue,
       onRelease = props.onRelease,
       onChange = props.onChange,
-      rest = _objectWithoutProperties(props, _excluded$h);
+      rest = _objectWithoutProperties(props, _excluded$j);
 
   var _React$useState = React.useState(valueProp === undefined ? defaultValue : valueProp),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -8623,7 +8623,7 @@ Slider.defaultProps = _objectSpread2(_objectSpread2({}, MultiSlider.defaultProps
   defaultValue: 0
 });
 
-var _excluded$g = ["value", "defaultValue", "onChange", "onRelease"];
+var _excluded$i = ["value", "defaultValue", "onChange", "onRelease"];
 var RangeIndex;
 
 (function (RangeIndex) {
@@ -8636,7 +8636,7 @@ var RangeSlider = function RangeSlider(props) {
       defaultValue = props.defaultValue,
       onChange = props.onChange,
       onRelease = props.onRelease,
-      rest = _objectWithoutProperties(props, _excluded$g);
+      rest = _objectWithoutProperties(props, _excluded$i);
 
   var _React$useState = React.useState(valueProp === undefined ? defaultValue : valueProp),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -8672,7 +8672,7 @@ RangeSlider.defaultProps = _objectSpread2(_objectSpread2({}, MultiSlider.default
   defaultValue: [0, 10]
 });
 
-var _excluded$f = ["appearance", "children", "className", "color"];
+var _excluded$h = ["appearance", "children", "className", "color"];
 var Subheading = function Subheading(props) {
   var _classNames;
 
@@ -8680,7 +8680,7 @@ var Subheading = function Subheading(props) {
       children = props.children,
       className = props.className,
       color = props.color,
-      rest = _objectWithoutProperties(props, _excluded$f);
+      rest = _objectWithoutProperties(props, _excluded$h);
 
   var classes = classnames((_classNames = {
     Subheading: true
@@ -8697,7 +8697,7 @@ Subheading.defaultProps = {
   appearance: 'default'
 };
 
-var _excluded$e = ["size", "defaultChecked", "disabled", "onChange", "name", "value", "className", "appearance", "checked"];
+var _excluded$g = ["size", "defaultChecked", "disabled", "onChange", "name", "value", "className", "appearance", "checked"];
 
 /**
  * ######Switch has two types:
@@ -8717,7 +8717,7 @@ var Switch = /*#__PURE__*/React.forwardRef(function (props, ref) {
       className = props.className;
       props.appearance;
       var checkedProp = props.checked,
-      rest = _objectWithoutProperties(props, _excluded$e);
+      rest = _objectWithoutProperties(props, _excluded$g);
 
   var _React$useState = React.useState(checkedProp === undefined ? defaultChecked : checkedProp),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -8756,7 +8756,7 @@ var Switch = /*#__PURE__*/React.forwardRef(function (props, ref) {
 });
 Switch.displayName = 'Switch';
 
-var _excluded$d = ["rows", "resize", "disabled", "name", "placeholder", "value", "defaultValue", "required", "error", "onChange", "onClick", "onBlur", "onFocus", "className"];
+var _excluded$f = ["rows", "resize", "disabled", "name", "placeholder", "value", "defaultValue", "required", "error", "onChange", "onClick", "onBlur", "onFocus", "className"];
 var Textarea = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _classNames;
 
@@ -8776,7 +8776,7 @@ var Textarea = /*#__PURE__*/React.forwardRef(function (props, ref) {
       onBlur = props.onBlur,
       onFocus = props.onFocus,
       className = props.className,
-      rest = _objectWithoutProperties(props, _excluded$d);
+      rest = _objectWithoutProperties(props, _excluded$f);
 
   var classes = classnames((_classNames = {}, _defineProperty$1(_classNames, 'Textarea', true), _defineProperty$1(_classNames, 'Textarea--resize', resize), _defineProperty$1(_classNames, 'Textarea--error', error), _classNames), className);
   return /*#__PURE__*/React.createElement("textarea", _extends$2({
@@ -13905,7 +13905,7 @@ _defineProperty$1(PopperWrapper, "defaultProps", {
   style: {}
 });
 
-var _excluded$c = ["position", "customStyle", "dark", "children", "onToggle", "className", "hideOnReferenceEscape", "boundaryElement"];
+var _excluded$e = ["position", "customStyle", "dark", "children", "onToggle", "className", "hideOnReferenceEscape", "boundaryElement"];
 var propsList = ['appendToBody', 'trigger', 'hoverable', 'on', 'open', 'closeOnBackdropClick', 'offset', 'closeOnScroll'];
 var Popover = function Popover(props) {
   var position = props.position,
@@ -13917,7 +13917,7 @@ var Popover = function Popover(props) {
       hideOnReferenceEscape = props.hideOnReferenceEscape,
       _props$boundaryElemen = props.boundaryElement,
       boundaryElement = _props$boundaryElemen === void 0 ? document.body : _props$boundaryElemen,
-      rest = _objectWithoutProperties(props, _excluded$c);
+      rest = _objectWithoutProperties(props, _excluded$e);
 
   var _React$useState = React.useState(!!props.open),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -13969,7 +13969,7 @@ Popover.defaultProps = Object.assign({}, filterProps(PopperWrapper.defaultProps,
   customStyle: {}
 });
 
-var _excluded$b = ["type", "onClick"];
+var _excluded$d = ["type", "onClick"];
 var keyCodes = {
   BACKSPACE: 'Backspace',
   DELETE: 'Delete',
@@ -14088,7 +14088,7 @@ var ChipInput = function ChipInput(props) {
     var _chipOptions$type = chipOptions.type,
         type = _chipOptions$type === void 0 ? 'input' : _chipOptions$type,
         _onClick = chipOptions.onClick,
-        rest = _objectWithoutProperties(chipOptions, _excluded$b);
+        rest = _objectWithoutProperties(chipOptions, _excluded$d);
 
     return /*#__PURE__*/React.createElement(Chip, _extends$2({
       "data-test": "DesignSystem-ChipInput--Chip",
@@ -14562,7 +14562,7 @@ var HorizontalNav = function HorizontalNav(props) {
   }), list);
 };
 
-var _excluded$a = ["children", "tooltip"];
+var _excluded$c = ["children", "tooltip"];
 var tooltipPropsList = ['trigger', 'on', 'open', 'offset', 'onToggle', 'dark', 'customStyle', 'closeOnBackdropClick', 'hideOnReferenceEscape', 'closeOnScroll'];
 var positionValue = {
   bottom: 'bottom',
@@ -14577,7 +14577,7 @@ var positionValue = {
 var Tooltip = function Tooltip(props) {
   var children = props.children,
       tooltip = props.tooltip,
-      rest = _objectWithoutProperties(props, _excluded$a);
+      rest = _objectWithoutProperties(props, _excluded$c);
 
   var tooltipWrapper = /*#__PURE__*/React.createElement("div", {
     className: "Tooltip"
@@ -14653,7 +14653,7 @@ Dialog.defaultProps = {
   secondaryButtonAppearance: 'basic'
 };
 
-var _excluded$9 = ["label"];
+var _excluded$b = ["label"];
 var OverlayFooter = function OverlayFooter(props) {
   var open = props.open,
       className = props.className,
@@ -14690,7 +14690,7 @@ var OverlayFooter = function OverlayFooter(props) {
       className: classes
     }), actions.map(function (_ref, index) {
       _ref.label;
-          var options = _objectWithoutProperties(_ref, _excluded$9);
+          var options = _objectWithoutProperties(_ref, _excluded$b);
 
       return /*#__PURE__*/React.createElement(Button, _extends$2({
         type: "button"
@@ -16051,7 +16051,7 @@ Pagination.defaultProps = {
   pageJumpDebounceDuration: 750
 };
 
-var _excluded$8 = ["onChange"];
+var _excluded$a = ["onChange"];
 var EditableInput = function EditableInput(props) {
   var _classNames2, _classNames4;
 
@@ -16065,7 +16065,7 @@ var EditableInput = function EditableInput(props) {
       className = props.className;
 
   var onInputChange = inputOptions.onChange,
-      rest = _objectWithoutProperties(inputOptions, _excluded$8);
+      rest = _objectWithoutProperties(inputOptions, _excluded$a);
 
   var _React$useState = React.useState(props.value),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -16228,7 +16228,7 @@ EditableInput.defaultProps = {
   inputOptions: {}
 };
 
-var _excluded$7 = ["onChange", "chipOptions"],
+var _excluded$9 = ["onChange", "chipOptions"],
     _excluded2$1 = ["onClick"];
 var EditableChipInput = function EditableChipInput(props) {
   var _classNames3;
@@ -16242,7 +16242,7 @@ var EditableChipInput = function EditableChipInput(props) {
   var onChipInputChange = chipInputOptions.onChange,
       _chipInputOptions$chi = chipInputOptions.chipOptions,
       chipOptions = _chipInputOptions$chi === void 0 ? {} : _chipInputOptions$chi,
-      rest = _objectWithoutProperties(chipInputOptions, _excluded$7);
+      rest = _objectWithoutProperties(chipInputOptions, _excluded$9);
 
   var _onClick = chipOptions.onClick,
       chipObject = _objectWithoutProperties(chipOptions, _excluded2$1);
@@ -17058,7 +17058,7 @@ var getCustomDates = function getCustomDates() {
   };
 };
 
-var _excluded$6 = ["startDate", "endDate", "yearNav", "monthNav", "open", "inputFormat", "outputFormat", "startInputOptions", "endInputOptions", "validators", "withInput", "position", "disabledBefore", "disabledAfter", "onRangeChange", "rangeLimit"];
+var _excluded$8 = ["startDate", "endDate", "yearNav", "monthNav", "open", "inputFormat", "outputFormat", "startInputOptions", "endInputOptions", "validators", "withInput", "position", "disabledBefore", "disabledAfter", "onRangeChange", "rangeLimit"];
 var DateRangePicker = /*#__PURE__*/function (_React$Component) {
   _inherits(DateRangePicker, _React$Component);
 
@@ -17328,7 +17328,7 @@ var DateRangePicker = /*#__PURE__*/function (_React$Component) {
           disabledAfter = _this$props6.disabledAfter;
           _this$props6.onRangeChange;
           var rangeLimit = _this$props6.rangeLimit,
-          rest = _objectWithoutProperties(_this$props6, _excluded$6);
+          rest = _objectWithoutProperties(_this$props6, _excluded$8);
 
       var _this$state3 = this.state,
           startDate = _this$state3.startDate,
@@ -18232,7 +18232,7 @@ function _fromFileEntry() {
   return _fromFileEntry.apply(this, arguments);
 }
 
-var _excluded$5 = ["refKey", "onKeyDown", "onFocus", "onBlur", "onClick", "onDragEnterCallback", "onDragOverCallback", "onDragLeaveCallback", "onDropCallback"],
+var _excluded$7 = ["refKey", "onKeyDown", "onFocus", "onBlur", "onClick", "onDragEnterCallback", "onDragOverCallback", "onDragLeaveCallback", "onDropCallback"],
     _excluded2 = ["refKey", "onChange", "onClick"];
 var initialState = {
   isFocused: false,
@@ -18510,7 +18510,7 @@ var DropzoneBase = function DropzoneBase(props) {
           onDragOverCallback = _ref.onDragOverCallback,
           onDragLeaveCallback = _ref.onDragLeaveCallback,
           onDropCallback = _ref.onDropCallback,
-          rest = _objectWithoutProperties(_ref, _excluded$5);
+          rest = _objectWithoutProperties(_ref, _excluded$7);
 
       return _objectSpread2(_defineProperty$1({
         onDragEnter: composeDragHandler(composeEventHandlers(onDragEnterCallback, onDragEnterCb)),
@@ -20708,7 +20708,7 @@ Header.defaultProps = {
   showFilters: true
 };
 
-var _excluded$4 = ["children"];
+var _excluded$6 = ["children"];
 
 var defaultErrorTemplate = function defaultErrorTemplate(props) {
   var _props$errorType = props.errorType,
@@ -21093,7 +21093,7 @@ var Table = /*#__PURE__*/function (_React$Component) {
 
       var _ref = headerOptions,
           headerChildren = _ref.children,
-          headerAttr = _objectWithoutProperties(_ref, _excluded$4);
+          headerAttr = _objectWithoutProperties(_ref, _excluded$6);
 
       var classes = className ? " ".concat(className) : '';
       var totalRecords = this.state.totalRecords;
@@ -21657,7 +21657,7 @@ FileList.defaultProps = {
 };
 FileList.displayName = 'FileList';
 
-var _excluded$3 = ["type", "fields", "placeholder", "autoFocus", "onComplete", "onFocus", "onBlur", "className", "value"];
+var _excluded$5 = ["type", "fields", "placeholder", "autoFocus", "onComplete", "onFocus", "onBlur", "className", "value"];
 var KEY_CODE = {
   backspace: 'Backspace',
   left: 'ArrowLeft',
@@ -21682,7 +21682,7 @@ var VerificationCodeInput = function VerificationCodeInput(props) {
       onBlur = props.onBlur,
       className = props.className;
       props.value;
-      var rest = _objectWithoutProperties(props, _excluded$3);
+      var rest = _objectWithoutProperties(props, _excluded$5);
 
   var initialValues = useMemo(function () {
     if (props.value && props.value.length) {
@@ -22088,7 +22088,7 @@ var HelpText = function HelpText(props) {
 };
 HelpText.displayName = 'HelpText';
 
-var _excluded$2 = ["children", "type", "className", "disabled", "tabIndex", "icon", "subtle", "size", "iconAlign", "iconType"];
+var _excluded$4 = ["children", "type", "className", "disabled", "tabIndex", "icon", "subtle", "size", "iconAlign", "iconType"];
 var sizeMapping = {
   tiny: 12,
   regular: 16
@@ -22106,7 +22106,7 @@ var LinkButton = /*#__PURE__*/React.forwardRef(function (props, ref) {
       size = props.size,
       iconAlign = props.iconAlign,
       iconType = props.iconType,
-      rest = _objectWithoutProperties(props, _excluded$2);
+      rest = _objectWithoutProperties(props, _excluded$4);
 
   var buttonClass = classnames((_classNames = {}, _defineProperty$1(_classNames, 'LinkButton', true), _defineProperty$1(_classNames, "LinkButton--".concat(size), size), _defineProperty$1(_classNames, 'LinkButton--default', !subtle), _defineProperty$1(_classNames, 'LinkButton--subtle', subtle), _defineProperty$1(_classNames, "LinkButton--iconAlign-".concat(iconAlign), children && iconAlign), _defineProperty$1(_classNames, "".concat(className), className), _classNames));
   var iconClass = classnames((_classNames2 = {}, _defineProperty$1(_classNames2, 'LinkButton-icon', true), _defineProperty$1(_classNames2, "LinkButton-icon--".concat(iconAlign), children && iconAlign), _classNames2));
@@ -22133,7 +22133,7 @@ LinkButton.defaultProps = {
   iconAlign: 'left'
 };
 
-var _excluded$1 = ["children", "disabled", "className", "zIndex", "onClick"];
+var _excluded$3 = ["children", "disabled", "className", "zIndex", "onClick"];
 var ActionCard = function ActionCard(props) {
   var _classNames;
 
@@ -22142,7 +22142,7 @@ var ActionCard = function ActionCard(props) {
       className = props.className,
       zIndex = props.zIndex,
       onClick = props.onClick,
-      rest = _objectWithoutProperties(props, _excluded$1);
+      rest = _objectWithoutProperties(props, _excluded$3);
 
   var classes = classnames((_classNames = {}, _defineProperty$1(_classNames, 'ActionCard', true), _defineProperty$1(_classNames, 'ActionCard--disabled', disabled), _classNames), className);
 
@@ -22244,7 +22244,7 @@ function useSingleSelect() {
   };
 }
 
-var _excluded = ["children", "onClick", "disabled", "id", "cardValue", "overlayZIndex", "selected", "className"];
+var _excluded$2 = ["children", "onClick", "disabled", "id", "cardValue", "overlayZIndex", "selected", "className"];
 var SelectionCard = function SelectionCard(props) {
   var _classNames;
 
@@ -22256,7 +22256,7 @@ var SelectionCard = function SelectionCard(props) {
       overlayZIndex = props.overlayZIndex,
       selected = props.selected,
       className = props.className,
-      rest = _objectWithoutProperties(props, _excluded);
+      rest = _objectWithoutProperties(props, _excluded$2);
 
   var classes = classnames((_classNames = {}, _defineProperty$1(_classNames, 'Selection-card', true), _defineProperty$1(_classNames, 'Selection-card--selected', selected), _defineProperty$1(_classNames, 'Selection-card--disabled', disabled && !selected), _defineProperty$1(_classNames, 'Selection-card--selected-disabled', disabled && selected), _classNames), className);
 
@@ -22295,6 +22295,963 @@ SelectionCard.defaultProps = {
 SelectionCard.useMultiSelect = useMultiSelect;
 SelectionCard.useSingleSelect = useSingleSelect;
 
-var version = "2.24.0";
+function arrayMove(array, from, to) {
+  array = array.slice();
+  array.splice(to < 0 ? array.length + to : to, 0, array.splice(from, 1)[0]);
+  return array;
+}
+function getTranslateOffset(element) {
+  var style = window.getComputedStyle(element);
+  return Math.max(parseInt(style['margin-top'], 10), parseInt(style['margin-bottom'], 10)) + element.getBoundingClientRect().height;
+}
+function isTouchEvent(event) {
+  return event.touches && event.touches.length || event.changedTouches && event.changedTouches.length;
+}
+function transformItem(element) {
+  var offsetY = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  var offsetX = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+  if (!element) return;
+
+  if (offsetY === null || offsetX === null) {
+    element.style.removeProperty('transform');
+    return;
+  }
+
+  element.style.transform = "translate(".concat(offsetX, "px, ").concat(offsetY, "px)");
+}
+function setItemTransition(element, duration, timing) {
+  if (element) {
+    element.style['transition'] = "transform ".concat(duration, "ms").concat(timing ? " ".concat(timing) : '');
+  }
+} // returns the "slot" for the targetValue, aka where it should go
+// in an ordered "array", it starts with -1 index
+
+function binarySearch(array, targetValue) {
+  var min = 0;
+  var max = array.length - 1;
+  var guess;
+
+  while (min <= max) {
+    guess = Math.floor((max + min) / 2);
+
+    if (!array[guess + 1] || array[guess] <= targetValue && array[guess + 1] >= targetValue) {
+      return guess;
+    } else if (array[guess] < targetValue && array[guess + 1] < targetValue) {
+      min = guess + 1;
+    } else {
+      max = guess - 1;
+    }
+  }
+
+  return -1;
+} // A throttle function that uses requestAnimationFrame to rate limit
+
+var schd = function schd(fn) {
+  var lastArgs = [];
+  var frameId = null;
+
+  var wrapperFn = function wrapperFn() {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    lastArgs = args;
+
+    if (frameId) {
+      return;
+    }
+
+    frameId = requestAnimationFrame(function () {
+      frameId = null;
+      fn.apply(void 0, _toConsumableArray(lastArgs));
+    });
+  };
+
+  wrapperFn.cancel = function () {
+    if (frameId) {
+      cancelAnimationFrame(frameId);
+    }
+  };
+
+  return wrapperFn;
+};
+
+var AUTOSCROLL_ACTIVE_OFFSET = 200;
+var AUTOSCROLL_SPEED_RATIO = 10;
+
+var Draggable = /*#__PURE__*/function (_React$Component) {
+  _inherits(Draggable, _React$Component);
+
+  var _super = _createSuper(Draggable);
+
+  function Draggable(props) {
+    var _this;
+
+    _classCallCheck(this, Draggable);
+
+    _this = _super.call(this, props);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "listRef", /*#__PURE__*/React.createRef());
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "ghostRef", /*#__PURE__*/React.createRef());
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "topOffsets", []);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "itemTranslateOffsets", []);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "initialYOffset", 0);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "lastScroll", 0);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "lastYOffset", 0);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "lastListYOffset", 0);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "dropTimeout", void 0);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "needle", -1);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "afterIndex", -2);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "state", {
+      itemDragged: -1,
+      itemDraggedOutOfBounds: -1,
+      selectedItem: -1,
+      initialX: 0,
+      initialY: 0,
+      targetX: 0,
+      targetY: 0,
+      targetHeight: 0,
+      targetWidth: 0,
+      scrollingSpeed: 0,
+      scrollWindow: false
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "schdOnMouseMove", void 0);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "schdOnTouchMove", void 0);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "schdOnEnd", void 0);
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "doScrolling", function () {
+      var _this$state = _this.state,
+          scrollingSpeed = _this$state.scrollingSpeed,
+          scrollWindow = _this$state.scrollWindow;
+      var listEl = _this.listRef.current;
+      window.requestAnimationFrame(function () {
+        if (scrollWindow) {
+          window.scrollTo(window.pageXOffset, window.pageYOffset + scrollingSpeed * 1.5);
+        } else {
+          listEl.scrollTop += scrollingSpeed;
+        }
+
+        if (scrollingSpeed !== 0) {
+          _this.doScrolling();
+        }
+      });
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "getChildren", function () {
+      if (_this.listRef && _this.listRef.current) {
+        return Array.from(_this.listRef.current.children);
+      }
+
+      return [];
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "calculateOffsets", function () {
+      _this.topOffsets = _this.getChildren().map(function (item) {
+        return item.getBoundingClientRect().top;
+      });
+      _this.itemTranslateOffsets = _this.getChildren().map(function (item) {
+        return getTranslateOffset(item);
+      });
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "getTargetIndex", function (e) {
+      return _this.getChildren().findIndex(function (child) {
+        return child === e.target || child.contains(e.target);
+      });
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "onMouseOrTouchStart", function (e) {
+      var _e$target;
+
+      if (_this.dropTimeout && _this.state.itemDragged > -1) {
+        window.clearTimeout(_this.dropTimeout);
+
+        _this.finishDrop();
+      }
+
+      var isTouch = isTouchEvent(e);
+      if (!isTouch && e.button !== 0) return;
+
+      var index = _this.getTargetIndex(e);
+
+      var listItemTouched = _this.getChildren()[index];
+
+      var isValidDragHandle = (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.classList.contains('Listbox-item--drag-icon');
+      if (!isValidDragHandle) return;
+      e.preventDefault();
+
+      if (isTouch) {
+        var opts = {
+          passive: false
+        };
+        listItemTouched.style.touchAction = 'none';
+        document.addEventListener('touchend', _this.schdOnEnd, opts);
+        document.addEventListener('touchmove', _this.schdOnTouchMove, opts);
+        document.addEventListener('touchcancel', _this.schdOnEnd, opts);
+      } else {
+        document.addEventListener('mousemove', _this.schdOnMouseMove);
+        document.addEventListener('mouseup', _this.schdOnEnd);
+
+        var listItemDragged = _this.getChildren()[_this.state.itemDragged];
+
+        if (listItemDragged && listItemDragged.style) {
+          listItemDragged.style.touchAction = '';
+        }
+      }
+
+      _this.onStart(listItemTouched, isTouch ? e.touches[0].clientX : e.clientX, isTouch ? e.touches[0].clientY : e.clientY, index);
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "getYOffset", function () {
+      var listScroll = _this.listRef.current ? _this.listRef.current.scrollTop : 0;
+      return window.pageYOffset + listScroll;
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "onStart", function (target, clientX, clientY, index) {
+      if (_this.state.selectedItem > -1) {
+        _this.setState({
+          selectedItem: -1
+        });
+
+        _this.needle = -1;
+      }
+
+      var targetRect = target.getBoundingClientRect();
+      var targetStyles = window.getComputedStyle(target);
+
+      _this.calculateOffsets();
+
+      _this.initialYOffset = _this.getYOffset();
+      _this.lastYOffset = window.pageYOffset;
+      _this.lastListYOffset = _this.listRef.current.scrollTop;
+
+      _this.setState({
+        itemDragged: index,
+        targetX: targetRect.left - parseInt(targetStyles['margin-left'], 10),
+        targetY: targetRect.top - parseInt(targetStyles['margin-top'], 10),
+        targetHeight: targetRect.height,
+        targetWidth: targetRect.width,
+        initialX: clientX,
+        initialY: clientY
+      });
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "onMouseMove", function (e) {
+      e.cancelable && e.preventDefault();
+
+      _this.onMove(e.clientX, e.clientY);
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "onTouchMove", function (e) {
+      e.cancelable && e.preventDefault();
+
+      _this.onMove(e.touches[0].clientX, e.touches[0].clientY);
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "onWheel", function (e) {
+      if (_this.state.itemDragged < 0) return;
+      _this.lastScroll = _this.listRef.current.scrollTop += e.deltaY;
+
+      _this.moveOtherItems();
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "onMove", function (clientX, clientY) {
+      if (_this.state.itemDragged === -1) return null;
+      transformItem(_this.ghostRef.current, clientY - _this.state.initialY, _this.props.lockVertically ? 0 : clientX - _this.state.initialX);
+
+      _this.autoScrolling(clientY);
+
+      _this.moveOtherItems();
+
+      return;
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "moveOtherItems", function () {
+      var targetRect = _this.ghostRef.current.getBoundingClientRect();
+
+      var itemVerticalCenter = targetRect.top + targetRect.height / 2;
+      var offset = getTranslateOffset(_this.getChildren()[_this.state.itemDragged]);
+
+      var currentYOffset = _this.getYOffset(); // adjust offsets if scrolling happens during the item movement
+
+
+      if (_this.initialYOffset !== currentYOffset) {
+        _this.topOffsets = _this.topOffsets.map(function (offset) {
+          return offset - (currentYOffset - _this.initialYOffset);
+        });
+        _this.initialYOffset = currentYOffset;
+      }
+
+      if (_this.isDraggedItemOutOfBounds() && _this.props.removableByMove) {
+        _this.afterIndex = _this.topOffsets.length + 1;
+      } else {
+        _this.afterIndex = binarySearch(_this.topOffsets, itemVerticalCenter);
+      }
+
+      _this.animateItems(_this.afterIndex === -1 ? 0 : _this.afterIndex, _this.state.itemDragged, offset);
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "autoScrolling", function (clientY) {
+      var _getBoundingClientRec = _this.listRef.current.getBoundingClientRect(),
+          top = _getBoundingClientRec.top,
+          bottom = _getBoundingClientRec.bottom,
+          height = _getBoundingClientRec.height;
+
+      var viewportHeight = window.innerHeight || document.documentElement.clientHeight; // auto scrolling for the window (down)
+
+      if (bottom > viewportHeight && viewportHeight - clientY < AUTOSCROLL_ACTIVE_OFFSET) {
+        _this.setState({
+          scrollingSpeed: Math.round((AUTOSCROLL_ACTIVE_OFFSET - (viewportHeight - clientY)) / AUTOSCROLL_SPEED_RATIO),
+          scrollWindow: true
+        }); // auto scrolling for the window (up)
+
+      } else if (top < 0 && clientY < AUTOSCROLL_ACTIVE_OFFSET) {
+        _this.setState({
+          scrollingSpeed: Math.round((AUTOSCROLL_ACTIVE_OFFSET - clientY) / -AUTOSCROLL_SPEED_RATIO),
+          scrollWindow: true
+        });
+      } else {
+        if (_this.state.scrollWindow && _this.state.scrollingSpeed !== 0) {
+          _this.setState({
+            scrollingSpeed: 0,
+            scrollWindow: false
+          });
+        } // auto scrolling for containers with overflow
+
+
+        if (height + 20 < _this.listRef.current.scrollHeight) {
+          var scrollingSpeed = 0;
+
+          if (clientY - top < AUTOSCROLL_ACTIVE_OFFSET) {
+            scrollingSpeed = Math.round((AUTOSCROLL_ACTIVE_OFFSET - (clientY - top)) / -AUTOSCROLL_SPEED_RATIO);
+          } else if (bottom - clientY < AUTOSCROLL_ACTIVE_OFFSET) {
+            scrollingSpeed = Math.round((AUTOSCROLL_ACTIVE_OFFSET - (bottom - clientY)) / AUTOSCROLL_SPEED_RATIO);
+          }
+
+          if (_this.state.scrollingSpeed !== scrollingSpeed) {
+            _this.setState({
+              scrollingSpeed: scrollingSpeed
+            });
+          }
+        }
+      }
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "animateItems", function (needle, movedItem, offset) {
+      var animateMovedItem = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+
+      _this.getChildren().forEach(function (item, i) {
+        setItemTransition(item, _this.props.transitionDuration);
+
+        if (movedItem === i && animateMovedItem) {
+          if (movedItem === needle) {
+            return transformItem(item, null);
+          }
+
+          transformItem(item, movedItem < needle ? _this.itemTranslateOffsets.slice(movedItem + 1, needle + 1).reduce(function (a, b) {
+            return a + b;
+          }, 0) : _this.itemTranslateOffsets.slice(needle, movedItem).reduce(function (a, b) {
+            return a + b;
+          }, 0) * -1);
+        } else if (movedItem < needle && i > movedItem && i <= needle) {
+          transformItem(item, -offset);
+        } else if (i < movedItem && movedItem > needle && i >= needle) {
+          transformItem(item, offset);
+        } else {
+          transformItem(item, null);
+        }
+      });
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "isDraggedItemOutOfBounds", function () {
+      var initialRect = _this.getChildren()[_this.state.itemDragged].getBoundingClientRect();
+
+      var targetRect = _this.ghostRef.current.getBoundingClientRect();
+
+      if (Math.abs(initialRect.left - targetRect.left) > targetRect.width) {
+        if (_this.state.itemDraggedOutOfBounds === -1) {
+          _this.setState({
+            itemDraggedOutOfBounds: _this.state.itemDragged
+          });
+        }
+
+        return true;
+      }
+
+      if (_this.state.itemDraggedOutOfBounds > -1) {
+        _this.setState({
+          itemDraggedOutOfBounds: -1
+        });
+      }
+
+      return false;
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "onEnd", function (e) {
+      e.cancelable && e.preventDefault();
+      document.removeEventListener('mousemove', _this.schdOnMouseMove);
+      document.removeEventListener('touchmove', _this.schdOnTouchMove);
+      document.removeEventListener('mouseup', _this.schdOnEnd);
+      document.removeEventListener('touchup', _this.schdOnEnd);
+      document.removeEventListener('touchcancel', _this.schdOnEnd);
+
+      var removeItem = _this.props.removableByMove && _this.isDraggedItemOutOfBounds();
+
+      if (!removeItem && _this.props.transitionDuration > 0 && _this.afterIndex !== -2) {
+        // animate drop
+        schd(function () {
+          setItemTransition(_this.ghostRef.current, _this.props.transitionDuration, 'cubic-bezier(0.2, 0, 0.38, 0.9)');
+
+          if (_this.afterIndex < 1 && _this.state.itemDragged === 0) {
+            transformItem(_this.ghostRef.current, 0, 0);
+          } else {
+            transformItem(_this.ghostRef.current, // compensate window scroll
+            -(window.pageYOffset - _this.lastYOffset) + // compensate container scroll
+            -(_this.listRef.current.scrollTop - _this.lastListYOffset) + (_this.state.itemDragged < _this.afterIndex ? _this.itemTranslateOffsets.slice(_this.state.itemDragged + 1, _this.afterIndex + 1).reduce(function (a, b) {
+              return a + b;
+            }, 0) : _this.itemTranslateOffsets.slice(_this.afterIndex < 0 ? 0 : _this.afterIndex, _this.state.itemDragged).reduce(function (a, b) {
+              return a + b;
+            }, 0) * -1), 0);
+          }
+        })();
+      }
+
+      _this.dropTimeout = window.setTimeout(_this.finishDrop, removeItem || _this.afterIndex === -2 ? 0 : _this.props.transitionDuration);
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "finishDrop", function () {
+      var removeItem = _this.props.removableByMove && _this.isDraggedItemOutOfBounds();
+
+      if (removeItem || _this.afterIndex > -2 && _this.state.itemDragged !== _this.afterIndex) {
+        _this.props.onChange({
+          oldIndex: _this.state.itemDragged,
+          newIndex: removeItem ? -1 : Math.max(_this.afterIndex, 0),
+          targetRect: _this.ghostRef.current.getBoundingClientRect()
+        });
+      }
+
+      _this.getChildren().forEach(function (item) {
+        setItemTransition(item, 0);
+        transformItem(item, null);
+        item.style.touchAction = '';
+      });
+
+      _this.setState({
+        itemDragged: -1,
+        scrollingSpeed: 0
+      });
+
+      _this.afterIndex = -2; // sometimes the scroll gets messed up after the drop, fix:
+
+      if (_this.lastScroll > 0) {
+        _this.listRef.current.scrollTop = _this.lastScroll;
+        _this.lastScroll = 0;
+      }
+    });
+
+    _defineProperty$1(_assertThisInitialized$1(_this), "onKeyDown", function (e) {
+      var selectedItem = _this.state.selectedItem;
+
+      var index = _this.getTargetIndex(e);
+
+      if (index === -1 || _this.props.values[index] && _this.props.values[index].props.disabled) {
+        return;
+      }
+
+      if (e.key === ' ') {
+        e.preventDefault();
+
+        if (selectedItem === index) {
+          if (selectedItem !== _this.needle) {
+            _this.getChildren().forEach(function (item) {
+              setItemTransition(item, 0);
+              transformItem(item, null);
+            });
+
+            _this.props.onChange({
+              oldIndex: selectedItem,
+              newIndex: _this.needle,
+              targetRect: _this.getChildren()[_this.needle].getBoundingClientRect()
+            });
+
+            _this.getChildren()[_this.needle].focus();
+          }
+
+          _this.setState({
+            selectedItem: -1
+          });
+
+          _this.needle = -1;
+        } else {
+          _this.setState({
+            selectedItem: index
+          });
+
+          _this.needle = index;
+
+          _this.calculateOffsets();
+        }
+      }
+
+      if ((e.key === 'ArrowDown' || e.key === 'j') && selectedItem > -1 && _this.needle < _this.props.values.length - 1) {
+        e.preventDefault();
+        var offset = getTranslateOffset(_this.getChildren()[selectedItem]);
+        _this.needle++;
+
+        _this.animateItems(_this.needle, selectedItem, offset, true);
+      }
+
+      if ((e.key === 'ArrowUp' || e.key === 'k') && selectedItem > -1 && _this.needle > 0) {
+        e.preventDefault();
+
+        var _offset = getTranslateOffset(_this.getChildren()[selectedItem]);
+
+        _this.needle--;
+
+        _this.animateItems(_this.needle, selectedItem, _offset, true);
+      }
+
+      if (e.key === 'Escape' && selectedItem > -1) {
+        _this.getChildren().forEach(function (item) {
+          setItemTransition(item, 0);
+          transformItem(item, null);
+        });
+
+        _this.setState({
+          selectedItem: -1
+        });
+
+        _this.needle = -1;
+      }
+
+      if ((e.key === 'Tab' || e.key === 'Enter') && selectedItem > -1) {
+        e.preventDefault();
+      }
+    });
+
+    _this.schdOnMouseMove = schd(_this.onMouseMove);
+    _this.schdOnTouchMove = schd(_this.onTouchMove);
+    _this.schdOnEnd = schd(_this.onEnd);
+    return _this;
+  }
+
+  _createClass(Draggable, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.calculateOffsets();
+      document.addEventListener('touchstart', this.onMouseOrTouchStart, {
+        passive: false,
+        capture: false
+      });
+      document.addEventListener('mousedown', this.onMouseOrTouchStart);
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(_prevProps, prevState) {
+      if (prevState.scrollingSpeed !== this.state.scrollingSpeed && prevState.scrollingSpeed === 0) {
+        this.doScrolling();
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      document.removeEventListener('touchstart', this.onMouseOrTouchStart);
+      document.removeEventListener('mousedown', this.onMouseOrTouchStart);
+
+      if (this.dropTimeout) {
+        window.clearTimeout(this.dropTimeout);
+      }
+
+      this.schdOnMouseMove.cancel();
+      this.schdOnTouchMove.cancel();
+      this.schdOnEnd.cancel();
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var baseStyle = {
+        userSelect: 'none',
+        WebkitUserSelect: 'none',
+        MozUserSelect: 'none',
+        msUserSelect: 'none',
+        boxSizing: 'border-box',
+        position: 'relative'
+      };
+
+      var ghostStyle = _objectSpread2(_objectSpread2({}, baseStyle), {}, {
+        top: this.state.targetY,
+        left: this.state.targetX,
+        width: this.state.targetWidth,
+        height: this.state.targetHeight,
+        backgroundColor: '#ffffff',
+        listStyleType: 'none',
+        margin: 0,
+        position: 'fixed',
+        boxShadow: '0 4px 16px 0 rgba(0, 0, 0, 0.16)'
+      });
+
+      return /*#__PURE__*/React.createElement(React.Fragment, null, this.props.renderList({
+        children: this.props.values.map(function (value, index) {
+          var isHidden = index === _this2.state.itemDragged;
+          var isSelected = index === _this2.state.selectedItem;
+          var isDisabled = _this2.props.values[index] && _this2.props.values[index].props.disabled;
+          var props = {
+            key: index,
+            tabIndex: isDisabled ? -1 : 0,
+            onKeyDown: _this2.onKeyDown,
+            style: _objectSpread2(_objectSpread2({}, baseStyle), {}, {
+              visibility: isHidden ? 'hidden' : undefined,
+              zIndex: isSelected ? 5000 : 0
+            })
+          };
+          return _this2.props.renderItem({
+            value: value,
+            props: props,
+            index: index,
+            isDragged: false,
+            isSelected: isSelected,
+            isOutOfBounds: false
+          });
+        }),
+        isDragged: this.state.itemDragged > -1,
+        props: {
+          ref: this.listRef
+        }
+      }), this.state.itemDragged > -1 && /*#__PURE__*/ReactDOM.createPortal(this.props.renderItem({
+        value: this.props.values[this.state.itemDragged],
+        props: {
+          ref: this.ghostRef,
+          style: ghostStyle,
+          onWheel: this.onWheel
+        },
+        index: this.state.itemDragged,
+        isDragged: true,
+        isSelected: false,
+        isOutOfBounds: this.state.itemDraggedOutOfBounds > -1
+      }), document.body));
+    }
+  }]);
+
+  return Draggable;
+}(React.Component);
+
+_defineProperty$1(Draggable, "defaultProps", {
+  transitionDuration: 240,
+  lockVertically: false,
+  removableByMove: false
+});
+
+var DraggableList = function DraggableList(props) {
+  var children = props.children,
+      className = props.className,
+      Tag = props.tagName;
+  var baseProps = extractBaseProps(props);
+  var classes = classnames({
+    Listbox: true
+  }, className);
+  var renderChildren = React__default.Children.toArray(children).map(function (child) {
+    var element = /*#__PURE__*/React__default.cloneElement(child, {
+      parentProps: _objectSpread2({}, props)
+    });
+    return element;
+  });
+
+  var _React$useState = React__default.useState(renderChildren),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      childList = _React$useState2[0],
+      setChildList = _React$useState2[1];
+
+  var onChangeHandler = function onChangeHandler(props) {
+    var oldIndex = props.oldIndex,
+        newIndex = props.newIndex;
+    var updatedList = arrayMove(childList, oldIndex, newIndex);
+    setChildList(updatedList);
+  };
+
+  return /*#__PURE__*/React__default.createElement(Draggable, {
+    values: childList,
+    onChange: onChangeHandler,
+    renderItem: function renderItem(_ref) {
+      var value = _ref.value,
+          props = _ref.props;
+      return /*#__PURE__*/React__default.createElement("div", _extends$2({}, props, {
+        className: "Listbox-item--draggable"
+      }), value);
+    },
+    renderList: function renderList(_ref2) {
+      var children = _ref2.children,
+          props = _ref2.props;
+      return /*#__PURE__*/React__default.createElement(Tag, _extends$2({
+        "data-test": "DesignSystem-Listbox"
+      }, baseProps, {
+        className: classes
+      }, props), children);
+    }
+  });
+};
+
+var isDisabledElement = function isDisabledElement(element) {
+  return element && element.getAttribute('data-disabled') === 'true';
+};
+
+var getNextSibling = function getNextSibling(element) {
+  var _element$parentNode, _element$parentNode$n;
+
+  return element === null || element === void 0 ? void 0 : (_element$parentNode = element.parentNode) === null || _element$parentNode === void 0 ? void 0 : (_element$parentNode$n = _element$parentNode.nextSibling) === null || _element$parentNode$n === void 0 ? void 0 : _element$parentNode$n.firstChild;
+};
+
+var getPrevSibling = function getPrevSibling(element) {
+  var _element$parentNode2, _element$parentNode2$;
+
+  return element === null || element === void 0 ? void 0 : (_element$parentNode2 = element.parentNode) === null || _element$parentNode2 === void 0 ? void 0 : (_element$parentNode2$ = _element$parentNode2.previousSibling) === null || _element$parentNode2$ === void 0 ? void 0 : _element$parentNode2$.firstChild;
+};
+
+var focusOption = function focusOption(element, direction) {
+  var iterateElement = element;
+
+  while (iterateElement) {
+    if (!isDisabledElement(iterateElement)) {
+      iterateElement.focus();
+      break;
+    }
+
+    if (direction === 'down') {
+      iterateElement = getNextSibling(iterateElement);
+    } else {
+      iterateElement = getPrevSibling(iterateElement);
+    }
+  }
+};
+
+var onKeyDown = function onKeyDown(event) {
+  var sourceElement = event.target;
+  var nextElement = getNextSibling(sourceElement);
+  var prevElement = getPrevSibling(sourceElement);
+
+  switch (event.key) {
+    case 'ArrowDown':
+      event.preventDefault();
+      focusOption(nextElement, 'down');
+      break;
+
+    case 'ArrowUp':
+      event.preventDefault();
+      focusOption(prevElement, 'up');
+      break;
+  }
+};
+
+var ListBody = function ListBody(props) {
+  var _classNames;
+
+  var children = props.children,
+      className = props.className,
+      disabled = props.disabled,
+      selected = props.selected,
+      activated = props.activated;
+  var contextProp = React.useContext(ListboxContext);
+  var size = contextProp.size,
+      type = contextProp.type,
+      draggable = contextProp.draggable;
+  var itemClass = classnames((_classNames = {
+    'Listbox-item': true
+  }, _defineProperty$1(_classNames, "Listbox-item--".concat(size), size), _defineProperty$1(_classNames, "Listbox-item--".concat(type), type), _defineProperty$1(_classNames, 'Listbox-item--disabled', disabled), _defineProperty$1(_classNames, 'Listbox-item--selected', selected && type === 'option'), _defineProperty$1(_classNames, 'Listbox-item--activated', activated && type === 'resource'), _classNames), className);
+  return /*#__PURE__*/React.createElement("div", {
+    "data-disabled": disabled,
+    "data-test": "DesignSystem-Listbox-ItemWrapper",
+    tabIndex: draggable ? -1 : 0,
+    className: itemClass,
+    onKeyDown: onKeyDown,
+    role: "tablist"
+  }, draggable && /*#__PURE__*/React.createElement(Icon, {
+    size: 16,
+    appearance: "subtle",
+    name: "drag_indicator",
+    className: "Listbox-item--drag-icon",
+    "data-test": "DesignSystem-Listbox-DragIcon"
+  }), children);
+};
+
+var getAnimationClass = function getAnimationClass(uniqueKey, expanded) {
+  if (expanded) return "nestedList-open-".concat(uniqueKey, " 240ms cubic-bezier(0, 0, 0.38, 0.9)");else if (!expanded) return "nestedList-close-".concat(uniqueKey, " 160ms cubic-bezier(0.2, 0, 1, 0.9)");
+  return '';
+};
+
+var getHeight = function getHeight(listItemRef) {
+  var _listItemRef$current;
+
+  var scrollHeight = (_listItemRef$current = listItemRef.current) === null || _listItemRef$current === void 0 ? void 0 : _listItemRef$current.scrollHeight;
+  return scrollHeight;
+};
+
+var menuItemAnimation = function menuItemAnimation(listItemRef, uniqueKey) {
+  return "\n      @keyframes nestedList-open-".concat(uniqueKey, " {\n      from {\n        height: 0px;\n      }\n      to {\n        height: ").concat(getHeight(listItemRef), "px;\n      }\n    }\n\n    @keyframes nestedList-close-").concat(uniqueKey, " {\n      from {\n        height: ").concat(getHeight(listItemRef), "px;\n      }\n      to {\n        height: 0px;\n      }\n    }\n  ");
+};
+
+function usePrevious(value) {
+  var ref = React.useRef();
+  React.useEffect(function () {
+    if (value != undefined) {
+      ref.current = value;
+    }
+  }, [value]);
+  return ref.current;
+}
+
+var NestedList = function NestedList(props) {
+  var nestedBody = props.nestedBody,
+      expanded = props.expanded;
+  var prevState = usePrevious(expanded);
+
+  var _React$useState = React.useState(expanded),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      open = _React$useState2[0],
+      setOpen = _React$useState2[1];
+
+  var _React$useState3 = React.useState(''),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      keyframe = _React$useState4[0],
+      setKeyframe = _React$useState4[1];
+
+  var listItemRef = React.useRef(null);
+  var uniqueKey = Math.random().toString(36).substring(2, 6);
+
+  var _React$useState5 = React.useState(getAnimationClass(uniqueKey, expanded)),
+      _React$useState6 = _slicedToArray(_React$useState5, 2),
+      animation = _React$useState6[0],
+      setAnimation = _React$useState6[1];
+
+  React.useEffect(function () {
+    if (prevState != undefined && prevState !== expanded) {
+      setOpen(true);
+    }
+
+    requestAnimationFrame(function () {
+      var result = menuItemAnimation(listItemRef, uniqueKey);
+      setKeyframe(result);
+    });
+    var animationClass = getAnimationClass(uniqueKey, expanded);
+    setAnimation(animationClass);
+  }, [expanded]);
+
+  var handleAnimationEnd = function handleAnimationEnd() {
+    !expanded && setOpen(false);
+  };
+
+  var styles = {
+    animation: animation,
+    overflow: 'hidden',
+    animationFillMode: 'forwards'
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("style", null, keyframe), nestedBody && open && /*#__PURE__*/React.createElement("div", {
+    style: styles,
+    onAnimationEnd: handleAnimationEnd,
+    "data-test": "DesignSystem-Listbox--Nested-Item",
+    ref: listItemRef
+  }, nestedBody));
+};
+
+var _excluded$1 = ["nestedBody", "expanded", "id", "onClick", "value", "tagName"];
+var ListboxItem = function ListboxItem(props) {
+  var nestedBody = props.nestedBody,
+      expanded = props.expanded,
+      id = props.id,
+      onClick = props.onClick,
+      value = props.value,
+      Tag = props.tagName,
+      rest = _objectWithoutProperties(props, _excluded$1);
+
+  var contextProp = React.useContext(ListboxContext);
+  var showDivider = contextProp.showDivider,
+      draggable = contextProp.draggable;
+
+  var onClickHandler = function onClickHandler(e) {
+    onClick && onClick(e, id, value);
+  };
+
+  var tagClass = classnames(_defineProperty$1({}, 'Listbox-item-wrapper', !draggable));
+  return /*#__PURE__*/React.createElement(Tag, _extends$2({
+    id: id,
+    key: id
+  }, rest, {
+    "data-test": "DesignSystem-Listbox-Item",
+    onClick: onClickHandler,
+    "data-value": value,
+    className: tagClass
+  }), /*#__PURE__*/React.createElement(ListBody, props), nestedBody && /*#__PURE__*/React.createElement(NestedList, {
+    expanded: expanded,
+    nestedBody: nestedBody
+  }), showDivider && /*#__PURE__*/React.createElement(Divider, {
+    className: "Listbox-divider"
+  }));
+};
+ListboxItem.displayName = 'ListboxItem';
+ListboxItem.defaultProps = {
+  tagName: 'li'
+};
+
+var _excluded = ["children", "className", "draggable", "size", "type", "showDivider", "tagName"];
+var ListboxContext = /*#__PURE__*/React.createContext({
+  size: 'standard',
+  type: 'resource',
+  draggable: false,
+  showDivider: true
+});
+var Provider = ListboxContext.Provider;
+var Listbox = function Listbox(props) {
+  var children = props.children,
+      className = props.className,
+      draggable = props.draggable,
+      size = props.size,
+      type = props.type,
+      showDivider = props.showDivider,
+      Tag = props.tagName,
+      rest = _objectWithoutProperties(props, _excluded);
+
+  var baseProps = extractBaseProps(props);
+  var classes = classnames({
+    Listbox: true
+  }, className);
+  var sharedProp = {
+    size: size,
+    type: type,
+    draggable: draggable,
+    showDivider: showDivider
+  };
+  return /*#__PURE__*/React.createElement(Provider, {
+    value: sharedProp
+  }, draggable ? /*#__PURE__*/React.createElement(DraggableList, props) : /*#__PURE__*/React.createElement(Tag, _extends$2({
+    "data-test": "DesignSystem-Listbox"
+  }, baseProps, {
+    className: classes
+  }, rest), children));
+};
+Listbox.displayName = 'Listbox';
+Listbox.defaultProps = {
+  tagName: 'ul',
+  size: 'standard',
+  type: 'resource',
+  draggable: false,
+  showDivider: true
+};
+Listbox.Item = ListboxItem;
+
+var version = "2.25.0";
 
-export { ActionCard, Avatar, AvatarGroup, Backdrop, Badge, Breadcrumbs, Button, Calendar, Caption, Card, CardBody, CardFooter, CardHeader, CardSubdued, ChatMessage, Checkbox, Chip, ChipGroup, ChipInput, ChoiceList, Collapsible, Column, DatePicker, DateRangePicker, Dialog, Divider, Dropdown, Dropzone, EditableChipInput, EditableDropdown, EditableInput, EmptyState, FileList, FileUploader, FileUploaderList, FullscreenModal, Grid, GridCell, Heading, HelpText, HorizontalNav, Icon, InlineMessage, Input, X as InputMask, Label, Legend, Link, LinkButton, List, Message, MetaList, MetricInput, Modal, ModalBody, ModalDescription, ModalFooter, ModalHeader, MultiSlider, Navigation, OutsideClick, PageHeader, Pagination, Paragraph, Pills, Placeholder, PlaceholderImage, PlaceholderParagraph, Popover, ProgressBar, ProgressRing, Radio, RangeSlider, Row, SelectionCard, Sidesheet, Slider, Spinner, StatusHint, Stepper, Subheading, Switch, Tab, Table, Tabs, TabsWrapper, Text, Textarea, TimePicker, Toast, Tooltip, index as Utils, VerificationCodeInput, VerticalNav, version };
+export { ActionCard, Avatar, AvatarGroup, Backdrop, Badge, Breadcrumbs, Button, Calendar, Caption, Card, CardBody, CardFooter, CardHeader, CardSubdued, ChatMessage, Checkbox, Chip, ChipGroup, ChipInput, ChoiceList, Collapsible, Column, DatePicker, DateRangePicker, Dialog, Divider, Dropdown, Dropzone, EditableChipInput, EditableDropdown, EditableInput, EmptyState, FileList, FileUploader, FileUploaderList, FullscreenModal, Grid, GridCell, Heading, HelpText, HorizontalNav, Icon, InlineMessage, Input, X as InputMask, Label, Legend, Link, LinkButton, List, Listbox, Message, MetaList, MetricInput, Modal, ModalBody, ModalDescription, ModalFooter, ModalHeader, MultiSlider, Navigation, OutsideClick, PageHeader, Pagination, Paragraph, Pills, Placeholder, PlaceholderImage, PlaceholderParagraph, Popover, ProgressBar, ProgressRing, Radio, RangeSlider, Row, SelectionCard, Sidesheet, Slider, Spinner, StatusHint, Stepper, Subheading, Switch, Tab, Table, Tabs, TabsWrapper, Text, Textarea, TimePicker, Toast, Tooltip, index as Utils, VerificationCodeInput, VerticalNav, version };