@elliemae/ds-shuttle 2.2.0-alpha.4 → 3.0.0-next.2

package/esm/components/ShuttleSearchBox.js

@@ -1,10 +1,18 @@
-import * as React from "react";
-import React2, { Component } from "react";
-import { aggregatedClasses } from "@elliemae/ds-classnames";
-import { debounce } from "@elliemae/ds-utilities";
-import { DSTextBox } from "@elliemae/ds-form";
-const blockName = "shuttle-search-box";
-const SearchBoxContainer = aggregatedClasses("div")(blockName, null, ({ isOpen }) => ({ opened: isOpen }));
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import { Component } from 'react';
+import { aggregatedClasses } from '@elliemae/ds-classnames';
+import { debounce } from '@elliemae/ds-utilities';
+import { DSTextBox } from '@elliemae/ds-form';
+
+const blockName = 'shuttle-search-box';
+const SearchBoxContainer = aggregatedClasses('div')(blockName, null, _ref => {
+  let {
+    isOpen
+  } = _ref;
+  return {
+    opened: isOpen
+  };
+});
 const filterList = debounce((term, onFilterCallback) => {
   onFilterCallback(term);
 }, 200);
@@ -15,56 +23,82 @@ class ShuttleSearchBox extends Component {
       value: props.value,
       prevProps: {}
     };
-    this.handleKeyPress = this.handleKeyPress.bind(this);
     this.handleChange = this.handleChange.bind(this);
+    this.handleKeyPress = this.handleKeyPress.bind(this);
   }
-  static getDerivedStateFromProps(nextProps, { prevProps }) {
-    const { value } = nextProps;
+
+  static getDerivedStateFromProps(nextProps, _ref2) {
+    let {
+      prevProps
+    } = _ref2;
+    const {
+      value
+    } = nextProps;
+
     if (value !== prevProps.value) {
       return {
         value,
-        prevProps: { value }
+        prevProps: {
+          value
+        }
       };
     }
+
     return null;
   }
+
   handleChange(e) {
-    const { onChange, filterOnKeyStroke, onFilter } = this.props;
-    const { value } = e.target;
+    const {
+      onChange,
+      filterOnKeyStroke,
+      onFilter
+    } = this.props;
+    const {
+      value
+    } = e.target;
     onChange(value);
-    if (filterOnKeyStroke)
-      filterList(value, onFilter);
-    this.setState({ value });
+    if (filterOnKeyStroke) filterList(value, onFilter);
+    this.setState({
+      value
+    });
   }
+
   handleKeyPress(e) {
-    const { onFilter } = this.props;
-    if (e.keyCode === 13)
-      onFilter(e.target.value);
+    const {
+      onFilter
+    } = this.props;
+    if (e.keyCode === 13) onFilter(e.target.value);
   }
+
   render() {
-    const { value } = this.state;
-    const { isOpen, onClose, placeholder } = this.props;
-    return /* @__PURE__ */ React2.createElement(SearchBoxContainer, {
-      classProps: { isOpen }
-    }, /* @__PURE__ */ React2.createElement(DSTextBox, {
+    const {
+      value
+    } = this.state;
+    const {
+      isOpen,
+      onClose,
+      placeholder
+    } = this.props;
+    return /*#__PURE__*/_jsx(SearchBoxContainer, {
+      classProps: {
+        isOpen
+      }
+    }, void 0, /*#__PURE__*/_jsx(DSTextBox, {
       autoFocus: true,
       clearable: true,
       onChange: this.handleChange,
       onClear: onClose,
       onKeyDown: this.handleKeyPress,
-      placeholder,
-      value
+      placeholder: placeholder,
+      value: value
     }));
   }
+
 }
 ShuttleSearchBox.defaultProps = {
   filterOnKeyStroke: false,
   onChange: () => null,
   onFilter: () => null
 };
-var ShuttleSearchBox_default = ShuttleSearchBox;
-export {
-  ShuttleSearchBox,
-  ShuttleSearchBox_default as default
-};
-//# sourceMappingURL=ShuttleSearchBox.js.map
+
+export { ShuttleSearchBox as default };

package/esm/components/ShuttleSource.js

@@ -1,75 +1,91 @@
-import * as React from "react";
-import React2, { useCallback, useContext, useMemo } from "react";
-import PropTypes from "prop-types";
-import { ArrowShortRight, Search } from "@elliemae/ds-icons";
-import { DSButton } from "@elliemae/ds-button";
-import { runAll } from "@elliemae/ds-utilities";
-import { ShuttleSearchBox } from "./ShuttleSearchBox";
-import { ShuttleInfiniteScrollIndicator } from "./ShuttleInfiniteScrollIndicator";
-import { ShuttleSourceListItem } from "./ShuttleListItem/ShuttleSourceListItem";
-import {
-  ShuttleFooterCounter,
-  Overflow,
-  ShuttleFooter,
-  ShuttleHeader,
-  ShuttleHeaderBreadcrumb,
-  ShuttleHeaderSearchToggle,
-  ShuttleList,
-  ShuttleWrapper,
-  ShuttleFooterActions,
-  EmptyMessage,
-  LoadingList
-} from "../classedComponents";
-import { ShuttleListPanel } from "./ShuttleListPanel";
-import { VirtualizedList } from "./VirtualizedList";
-import { getActiveIdFromHierarchy } from "../helper";
-import { AnimationState } from "../AnimationState";
-import { SearchState } from "../SearchState";
-import { VirtualizedSortableList } from "./VirtualizedSortableList";
-import { LoadingIndicator } from "./LoadingIndicator";
-const noop = () => {
-};
-function ShuttleSource({
-  items = [],
-  checkedItems = [],
-  hierarchy = [],
-  onMoveItem = noop,
-  onCheckItem = noop,
-  onMoveCheckedItems = noop,
-  onNavigateTo = noop,
-  onClearCheckedItems = noop,
-  emptyMessage = "No items found",
-  composeSourceItemProps = noop,
-  loading = false,
-  onSearch = noop,
-  onSearchClose = noop,
-  onSearchOpen = noop,
-  sourceSortable = false,
-  onSortEnd = noop,
-  sourceClearItemsText = "CLEAR ALL",
-  searchPlaceholder,
-  renderSourceCounter = (amount) => `${amount} items`,
-  onGetMoreItems = () => {
-  },
-  moreItemsLoading = false,
-  hasNextPage = false
-}) {
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/esnext.async-iterator.reduce.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.reduce.js';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import { useContext, useMemo, useCallback } from 'react';
+import { Search, ArrowShortRight } from '@elliemae/ds-icons';
+import DSButton from '@elliemae/ds-button';
+import { runAll } from '@elliemae/ds-utilities';
+import ShuttleSearchBox from './ShuttleSearchBox.js';
+import ShuttleInfiniteScrollIndicator from './ShuttleInfiniteScrollIndicator.js';
+import ShuttleSourceListItem from './ShuttleListItem/ShuttleSourceListItem.js';
+import { ShuttleWrapper, ShuttleHeader, ShuttleHeaderBreadcrumb, ShuttleHeaderSearchToggle, ShuttleList, Overflow, LoadingList, EmptyMessage, ShuttleFooter, ShuttleFooterActions, ShuttleFooterCounter } from '../classedComponents.js';
+import ShuttleListPanel from './ShuttleListPanel.js';
+import VirtualizedList from './VirtualizedList.js';
+import { getActiveIdFromHierarchy } from '../helper.js';
+import AnimationContext from '../AnimationState.js';
+import SearchState from '../SearchState.js';
+import VirtualizedSortableList from './VirtualizedSortableList.js';
+import LoadingIndicator from './LoadingIndicator.js';
+import { jsx } from 'react/jsx-runtime';
+
+const _excluded = ["item"];
+
+var _Search, _LoadingList, _ArrowShortRight, _ShuttleInfiniteScrol;
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+const noop = () => {};
+
+function ShuttleSource(_ref) {
+  let {
+    items = [],
+    checkedItems = [],
+    // build Map() and memoize it for better performance
+    hierarchy = [],
+    onMoveItem = noop,
+    onCheckItem = noop,
+    onMoveCheckedItems = noop,
+    onNavigateTo = noop,
+    onClearCheckedItems = noop,
+    emptyMessage = 'No items found',
+    composeSourceItemProps = noop,
+    loading = false,
+    onSearch = noop,
+    onSearchClose = noop,
+    onSearchOpen = noop,
+    sourceSortable = false,
+    onSortEnd = noop,
+    sourceClearItemsText = 'CLEAR ALL',
+    searchPlaceholder,
+    renderSourceCounter = amount => "".concat(amount, " items"),
+    onGetMoreItems = () => {},
+    moreItemsLoading = false,
+    hasNextPage = false
+  } = _ref;
   const {
-    state: { isMovingBack = false, isMoving }
-  } = useContext(AnimationState.Context);
+    state: {
+      isMovingBack = false,
+      isMoving
+    }
+  } = useContext(AnimationContext.Context);
   const {
-    state: { searching, searchTerm },
+    state: {
+      searching,
+      searchTerm
+    },
     setSearchTerm,
     reset: resetSearch,
     toggleSearchBox
   } = useContext(SearchState.Context);
-  const hashedCheckedItems = useMemo(() => checkedItems.reduce((result, item) => ({ ...result, [item]: true }), {}), [checkedItems]);
+  const hashedCheckedItems = useMemo(() => checkedItems.reduce((result, item) => _objectSpread(_objectSpread({}, result), {}, {
+    [item]: true
+  }), {}), [checkedItems]);
   const handleCloseSearch = useCallback(() => {
-    setSearchTerm("");
+    setSearchTerm('');
     runAll(resetSearch, onSearchClose)();
   }, [searching]);
   const handleToggleSearch = useCallback(() => {
     toggleSearchBox(!searching);
+
     if (searching) {
       handleCloseSearch();
     } else {
@@ -77,99 +93,87 @@ function ShuttleSource({
     }
   }, [searching]);
   const ComponentList = useMemo(() => sourceSortable ? VirtualizedSortableList : VirtualizedList, [sourceSortable]);
-  const handleSortEnd = ({ oldIndex, newIndex }) => {
+
+  const handleSortEnd = _ref2 => {
+    let {
+      oldIndex,
+      newIndex
+    } = _ref2;
     onSortEnd({
       sourceItem: items[oldIndex],
       targetItem: items[newIndex]
     });
   };
+
   const isEmpty = !items.length;
   const hasContent = !loading && !isEmpty;
   const contentIsEmpty = !loading && isEmpty;
-  return /* @__PURE__ */ React2.createElement(ShuttleWrapper, null, /* @__PURE__ */ React2.createElement(ShuttleHeader, null, /* @__PURE__ */ React2.createElement(ShuttleHeaderBreadcrumb, {
-    hierarchy,
-    onNavigateTo
-  }), /* @__PURE__ */ React2.createElement(ShuttleHeaderSearchToggle, {
+  return /*#__PURE__*/_jsx(ShuttleWrapper, {}, void 0, /*#__PURE__*/_jsx(ShuttleHeader, {}, void 0, /*#__PURE__*/_jsx(ShuttleHeaderBreadcrumb, {
+    hierarchy: hierarchy,
+    onNavigateTo: onNavigateTo
+  }), /*#__PURE__*/_jsx(ShuttleHeaderSearchToggle, {
     buttonType: "text",
-    icon: /* @__PURE__ */ React2.createElement(Search, null),
+    icon: _Search || (_Search = /*#__PURE__*/_jsx(Search, {})),
     onClick: handleToggleSearch,
-    containerProps: { "data-testid": "shuttle-header-search-toggle" }
-  })), /* @__PURE__ */ React2.createElement(ShuttleList, {
-    classProps: { showPulse: isMovingBack },
-    style: { pointerEvents: isMoving ? "none" : null }
-  }, /* @__PURE__ */ React2.createElement(ShuttleSearchBox, {
-    key: searching,
+    containerProps: {
+      'data-testid': 'shuttle-header-search-toggle'
+    }
+  })), /*#__PURE__*/_jsx(ShuttleList, {
+    classProps: {
+      showPulse: isMovingBack
+    },
+    style: {
+      pointerEvents: isMoving ? 'none' : null
+    }
+  }, void 0, /*#__PURE__*/_jsx(ShuttleSearchBox, {
     isOpen: searching,
     onClose: runAll(() => toggleSearchBox(false), handleCloseSearch),
     onFilter: runAll(setSearchTerm, onSearch),
     placeholder: searchPlaceholder,
     value: searchTerm
-  }), hasContent ? /* @__PURE__ */ React2.createElement(Overflow, {
+  }, searching), hasContent ? /*#__PURE__*/_jsx(Overflow, {
     activeHierarchy: getActiveIdFromHierarchy(hierarchy).id,
     classProps: {
       searching,
       empty: isEmpty
     }
-  }, /* @__PURE__ */ React2.createElement(ComponentList, {
-    key: searchTerm,
+  }, void 0, /*#__PURE__*/_jsx(ComponentList, {
     helperClass: "drag-helper",
-    itemRenderer: ({ item, ...rest }) => /* @__PURE__ */ React2.createElement(ShuttleSourceListItem, {
-      "data-testid": "source-list-item",
-      ...rest,
-      ...composeSourceItemProps(item, rest),
-      isChecked: !!hashedCheckedItems[item.id],
-      item,
-      onItemCheck: onCheckItem,
-      onMoveToTarget: onMoveItem,
-      onNavigateOnSourceTo: onNavigateTo,
-      showSortHandler: sourceSortable
-    }),
-    items,
+    itemRenderer: _ref3 => {
+      let {
+        item
+      } = _ref3,
+          rest = _objectWithoutProperties(_ref3, _excluded);
+
+      return /*#__PURE__*/jsx(ShuttleSourceListItem, _objectSpread(_objectSpread(_objectSpread({
+        "data-testid": "source-list-item"
+      }, rest), composeSourceItemProps(item, rest)), {}, {
+        isChecked: !!hashedCheckedItems[item.id],
+        item: item,
+        onItemCheck: onCheckItem,
+        onMoveToTarget: onMoveItem,
+        onNavigateOnSourceTo: onNavigateTo,
+        showSortHandler: sourceSortable
+      }));
+    },
+    items: items,
     onSortEnd: handleSortEnd,
     getMoreItems: onGetMoreItems,
-    hasNextPage
-  })) : null, contentIsEmpty ? /* @__PURE__ */ React2.createElement(LoadingList, {
+    hasNextPage: hasNextPage
+  }, searchTerm)) : null, contentIsEmpty ? /*#__PURE__*/_jsx(LoadingList, {
     "data-testid": "shuttle__loading-list"
-  }, /* @__PURE__ */ React2.createElement(EmptyMessage, null, emptyMessage)) : null, loading ? /* @__PURE__ */ React2.createElement(LoadingList, {
+  }, void 0, /*#__PURE__*/_jsx(EmptyMessage, {}, void 0, emptyMessage)) : null, loading ? _LoadingList || (_LoadingList = /*#__PURE__*/_jsx(LoadingList, {
     "data-testid": "shuttle__loading-list"
-  }, /* @__PURE__ */ React2.createElement(LoadingIndicator, null)) : null, /* @__PURE__ */ React2.createElement(ShuttleListPanel, {
+  }, void 0, /*#__PURE__*/_jsx(LoadingIndicator, {}))) : null, /*#__PURE__*/_jsx(ShuttleListPanel, {
     onClick: onMoveCheckedItems,
     open: checkedItems.length > 1
-  }, /* @__PURE__ */ React2.createElement(ArrowShortRight, null)), moreItemsLoading ? /* @__PURE__ */ React2.createElement(ShuttleInfiniteScrollIndicator, {
+  }, void 0, _ArrowShortRight || (_ArrowShortRight = /*#__PURE__*/_jsx(ArrowShortRight, {}))), moreItemsLoading ? _ShuttleInfiniteScrol || (_ShuttleInfiniteScrol = /*#__PURE__*/_jsx(ShuttleInfiniteScrollIndicator, {
     isOpen: true
-  }) : null), /* @__PURE__ */ React2.createElement(ShuttleFooter, null, /* @__PURE__ */ React2.createElement(ShuttleFooterActions, null, !!checkedItems.length && /* @__PURE__ */ React2.createElement(DSButton, {
+  })) : null), /*#__PURE__*/_jsx(ShuttleFooter, {}, void 0, /*#__PURE__*/_jsx(ShuttleFooterActions, {}, void 0, !!checkedItems.length && /*#__PURE__*/_jsx(DSButton, {
     buttonType: "link",
     labelText: sourceClearItemsText,
     onClick: onClearCheckedItems
-  })), /* @__PURE__ */ React2.createElement(ShuttleFooterCounter, null, renderSourceCounter(checkedItems.length))));
+  })), /*#__PURE__*/_jsx(ShuttleFooterCounter, {}, void 0, renderSourceCounter(checkedItems.length))));
 }
-ShuttleSource.propTypes = {
-  items: PropTypes.arrayOf(PropTypes.shape({})),
-  checkedItems: PropTypes.arrayOf(PropTypes.shape({})),
-  hierarchy: PropTypes.arrayOf(PropTypes.shape({})),
-  onMoveItem: PropTypes.func,
-  onCheckItem: PropTypes.func,
-  onMoveCheckedItems: PropTypes.func,
-  onNavigateTo: PropTypes.func,
-  onClearCheckedItems: PropTypes.func,
-  emptyMessage: PropTypes.string,
-  composeSourceItemProps: PropTypes.func,
-  loading: PropTypes.bool,
-  onSearch: PropTypes.func,
-  onSearchClose: PropTypes.func,
-  onSearchOpen: PropTypes.func,
-  sourceSortable: PropTypes.bool,
-  onSortEnd: PropTypes.func,
-  sourceClearItemsText: PropTypes.string,
-  searchPlaceholder: PropTypes.string,
-  renderSourceCounter: PropTypes.func,
-  onGetMoreItems: PropTypes.func,
-  moreItemsLoading: PropTypes.bool,
-  hasNextPage: PropTypes.bool
-};
-var ShuttleSource_default = ShuttleSource;
-export {
-  ShuttleSource,
-  ShuttleSource_default as default
-};
-//# sourceMappingURL=ShuttleSource.js.map
+
+export { ShuttleSource as default };

package/esm/components/ShuttleTarget.js

@@ -1,86 +1,107 @@
-import * as React from "react";
-import React2, { useContext } from "react";
-import { DSButton } from "@elliemae/ds-button";
-import {
-  EmptyMessage,
-  Overflow,
-  ShuttleFooter,
-  ShuttleFooterActions,
-  ShuttleFooterCounter,
-  ShuttleHeader,
-  ShuttleHeaderBreadcrumb,
-  ShuttleList,
-  ShuttleWrapper,
-  LoadingList
-} from "../classedComponents";
-import { getActiveIdFromHierarchy } from "../helper";
-import { AnimationState } from "../AnimationState";
-import { VirtualizedList } from "./VirtualizedList";
-import { ShuttleTargetListItem } from "./ShuttleListItem/ShuttleTargetListItem";
-import { VirtualizedSortableList } from "./VirtualizedSortableList";
-import { LoadingIndicator } from "./LoadingIndicator";
-const noop = () => {
-};
-function ShuttleTarget({
-  items = [],
-  hierarchy = [],
-  onNavigateTo = noop,
-  onMoveItem = noop,
-  onClearMovedItems = noop,
-  emptyMessage = "No items selected",
-  composeTargetItemProps = () => ({}),
-  targetSortable = false,
-  onSortEnd = noop,
-  targetClearItemsText = "CLEAR ALL",
-  renderTargetCounter = (amount) => `${amount} items`,
-  loading = false
-}) {
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import { useContext } from 'react';
+import DSButton from '@elliemae/ds-button';
+import { ShuttleWrapper, ShuttleHeader, ShuttleHeaderBreadcrumb, ShuttleList, Overflow, LoadingList, ShuttleFooter, ShuttleFooterActions, ShuttleFooterCounter, EmptyMessage } from '../classedComponents.js';
+import { getActiveIdFromHierarchy } from '../helper.js';
+import AnimationContext from '../AnimationState.js';
+import VirtualizedList from './VirtualizedList.js';
+import ShuttleTargetListItem from './ShuttleListItem/ShuttleTargetListItem.js';
+import VirtualizedSortableList from './VirtualizedSortableList.js';
+import LoadingIndicator from './LoadingIndicator.js';
+import { jsx } from 'react/jsx-runtime';
+
+const _excluded = ["item"];
+
+var _LoadingIndicator;
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+const noop = () => {};
+
+function ShuttleTarget(_ref) {
+  let {
+    items = [],
+    hierarchy = [],
+    onNavigateTo = noop,
+    onMoveItem = noop,
+    onClearMovedItems = noop,
+    emptyMessage = 'No items selected',
+    composeTargetItemProps = () => ({}),
+    targetSortable = false,
+    onSortEnd = noop,
+    targetClearItemsText = 'CLEAR ALL',
+    renderTargetCounter = amount => "".concat(amount, " items"),
+    loading = false
+  } = _ref;
   const {
-    state: { isMoving = false }
-  } = useContext(AnimationState.Context);
+    state: {
+      isMoving = false
+    }
+  } = useContext(AnimationContext.Context);
   const isEmpty = !items.length;
-  const emptyContent = loading ? /* @__PURE__ */ React2.createElement(LoadingIndicator, null) : /* @__PURE__ */ React2.createElement(EmptyMessage, null, emptyMessage);
+  const emptyContent = loading ? _LoadingIndicator || (_LoadingIndicator = /*#__PURE__*/_jsx(LoadingIndicator, {})) : /*#__PURE__*/_jsx(EmptyMessage, {}, void 0, emptyMessage);
   const ComponentList = targetSortable ? VirtualizedSortableList : VirtualizedList;
-  const handleSortEnd = ({ oldIndex, newIndex }) => {
+
+  const handleSortEnd = _ref2 => {
+    let {
+      oldIndex,
+      newIndex
+    } = _ref2;
     onSortEnd({
       sourceItem: items[oldIndex],
       targetItem: items[newIndex]
     });
   };
-  return /* @__PURE__ */ React2.createElement(ShuttleWrapper, null, /* @__PURE__ */ React2.createElement(ShuttleHeader, null, /* @__PURE__ */ React2.createElement(ShuttleHeaderBreadcrumb, {
-    hierarchy,
-    onNavigateTo
-  })), /* @__PURE__ */ React2.createElement(ShuttleList, {
-    classProps: { showPulse: isMoving }
-  }, !loading && !isEmpty ? /* @__PURE__ */ React2.createElement(Overflow, {
+
+  return /*#__PURE__*/_jsx(ShuttleWrapper, {}, void 0, /*#__PURE__*/_jsx(ShuttleHeader, {}, void 0, /*#__PURE__*/_jsx(ShuttleHeaderBreadcrumb, {
+    hierarchy: hierarchy,
+    onNavigateTo: onNavigateTo
+  })), /*#__PURE__*/_jsx(ShuttleList, {
+    classProps: {
+      showPulse: isMoving
+    }
+  }, void 0, !loading && !isEmpty ? /*#__PURE__*/_jsx(Overflow, {
     activeHierarchy: getActiveIdFromHierarchy(hierarchy).id,
     classProps: {
       empty: !items.length
     }
-  }, /* @__PURE__ */ React2.createElement(ComponentList, {
-    itemRenderer: ({ item, ...rest }) => /* @__PURE__ */ React2.createElement(ShuttleTargetListItem, {
-      "data-testid": "target-list-item",
-      ...rest,
-      ...composeTargetItemProps(item, rest),
-      isRoot: !getActiveIdFromHierarchy(hierarchy).id,
-      item,
-      onMoveToSource: onMoveItem,
-      onNavigateOnTargetTo: onNavigateTo,
-      showSortHandler: targetSortable
-    }),
-    items,
+  }, void 0, /*#__PURE__*/_jsx(ComponentList, {
+    itemRenderer: _ref3 => {
+      let {
+        item
+      } = _ref3,
+          rest = _objectWithoutProperties(_ref3, _excluded);
+
+      return /*#__PURE__*/jsx(ShuttleTargetListItem, _objectSpread(_objectSpread(_objectSpread({
+        "data-testid": "target-list-item"
+      }, rest), composeTargetItemProps(item, rest)), {}, {
+        isRoot: !getActiveIdFromHierarchy(hierarchy).id,
+        item: item,
+        onMoveToSource: onMoveItem,
+        onNavigateOnTargetTo: onNavigateTo,
+        showSortHandler: targetSortable
+      }));
+    },
+    items: items,
     onSortEnd: handleSortEnd,
     target: true
-  })) : /* @__PURE__ */ React2.createElement(LoadingList, null, emptyContent)), /* @__PURE__ */ React2.createElement(ShuttleFooter, null, /* @__PURE__ */ React2.createElement(ShuttleFooterActions, null, !!items.length && /* @__PURE__ */ React2.createElement(DSButton, {
-    containerProps: { "data-testid": "shuttle-clear-all-target" },
+  })) : /*#__PURE__*/_jsx(LoadingList, {}, void 0, emptyContent)), /*#__PURE__*/_jsx(ShuttleFooter, {}, void 0, /*#__PURE__*/_jsx(ShuttleFooterActions, {}, void 0, !!items.length && /*#__PURE__*/_jsx(DSButton, {
+    containerProps: {
+      'data-testid': 'shuttle-clear-all-target'
+    },
     buttonType: "link",
     labelText: targetClearItemsText,
     onClick: onClearMovedItems
-  })), /* @__PURE__ */ React2.createElement(ShuttleFooterCounter, null, renderTargetCounter(items.length))));
+  })), /*#__PURE__*/_jsx(ShuttleFooterCounter, {}, void 0, renderTargetCounter(items.length))));
 }
-var ShuttleTarget_default = ShuttleTarget;
-export {
-  ShuttleTarget,
-  ShuttleTarget_default as default
-};
-//# sourceMappingURL=ShuttleTarget.js.map
+
+export { ShuttleTarget as default };