@elliemae/ds-shuttle 2.0.0-alpha.10 → 2.0.0-alpha.14

package/cjs/AnimationState.js

@@ -1,5 +1,6 @@
 'use strict';
 
+require('core-js/modules/web.dom-collections.iterator.js');
 var react = require('react');
 var createContainer = require('constate');
 

package/cjs/DSShuttle.js

@@ -3,10 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/web.dom-collections.iterator.js');
 require('react');
 var lodash = require('lodash');
 var reactDesc = require('react-desc');
-var TruncatedTooltipText = require('@elliemae/ds-basic/TruncatedTooltipText');
+var dsTruncatedTooltipText = require('@elliemae/ds-truncated-tooltip-text');
 var ShuttleImpl = require('./ShuttleImpl.js');
 var utils = require('./utils.js');
 
@@ -16,85 +17,88 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
 const noop = () => {};
 
-const DSShuttle = ({
-  containerProps = {},
-  idField = 'id',
-  parentIdField = 'parent',
-  showIcons = true,
-  items = [],
-  selectedItems = undefined,
-  // if defined it becomes controlled (v1)
-  // TODO make `nonSelectedItems` the default controlled behavior (v2)
-  nonSelectedItems = undefined,
-  onSearch = noop,
-  onSearchOpen = noop,
-  onSearchClose = noop,
-  onDrillDown = noop,
-  onDrillDownTarget = noop,
-  onTargetSortEnd = noop,
-  setGetStatus = noop,
-  targetSortable = true,
-  sourceEmptyMessage = 'No Items Found',
-  sourceRootTitle = 'Category',
-  targetEmptyMessage = 'No Items Selected',
-  targetRootTitle = 'Selected Items',
-  composeSourceItemProps = () => ({}),
-  composeTargetItemProps = () => ({}),
-  onAddToTarget = noop,
-  onAddCheckedItems = noop,
-  onRemoveFromTarget = noop,
-  onRemoveAllFromTarget = noop,
-  onChange = noop,
-  renderSourceCounter = noop,
-  renderTargetCounter = noop,
-  sourceClearItemsText = 'CLEAR ALL',
-  targetClearItemsText = 'CLEAR ALL',
-  searchPlaceholder = 'Search field ID, name, etc.',
-  loadingSource = false,
-  loadingTarget = false,
-  onGetMoreItems = () => null,
-  hasNextPage = false,
-  moreItemsLoading
-}) => /*#__PURE__*/_jsx__default["default"](TruncatedTooltipText.TooltipTextProvider, {}, void 0, /*#__PURE__*/_jsx__default["default"](ShuttleImpl, {
-  composeSourceItemProps: composeSourceItemProps,
-  composeTargetItemProps: composeTargetItemProps,
-  containerProps: containerProps,
-  idField: idField,
-  items: items,
-  onAddCheckedItems: onAddCheckedItems,
-  onAddToTarget: onAddToTarget,
-  onChange: onChange,
-  onDrillDown: onDrillDown,
-  nonSelectedItems: nonSelectedItems,
-  onDrillDownTarget: onDrillDownTarget,
-  onRemoveAllFromTarget: onRemoveAllFromTarget,
-  onRemoveFromTarget: onRemoveFromTarget,
-  onSearch: onSearch,
-  onSearchClose: onSearchClose,
-  onSearchOpen: onSearchOpen,
-  onTargetSortEnd: onTargetSortEnd,
-  parentIdField: parentIdField,
-  renderSourceCounter: renderSourceCounter,
-  renderTargetCounter: renderTargetCounter,
-  searchPlaceholder: searchPlaceholder,
-  selectedItems: selectedItems,
-  setGetStatus: setGetStatus,
-  showIcons: showIcons,
-  sourceClearItemsText: sourceClearItemsText,
-  sourceEmptyMessage: sourceEmptyMessage,
-  sourceRootTitle: sourceRootTitle,
-  targetClearItemsText: targetClearItemsText,
-  targetEmptyMessage: targetEmptyMessage,
-  targetRootTitle: targetRootTitle,
-  targetSortable: targetSortable,
-  loadingSource: loadingSource,
-  loadingTarget: loadingTarget,
-  onGetMoreItems: lodash.debounce((...args) => {
-    onGetMoreItems(...args);
-  }, 500),
-  moreItemsLoading: moreItemsLoading,
-  hasNextPage: hasNextPage
-}));
+const DSShuttle = _ref => {
+  let {
+    containerProps = {},
+    idField = 'id',
+    parentIdField = 'parent',
+    showIcons = true,
+    items = [],
+    selectedItems = undefined,
+    // if defined it becomes controlled (v1)
+    // TODO make `nonSelectedItems` the default controlled behavior (v2)
+    nonSelectedItems = undefined,
+    onSearch = noop,
+    onSearchOpen = noop,
+    onSearchClose = noop,
+    onDrillDown = noop,
+    onDrillDownTarget = noop,
+    onTargetSortEnd = noop,
+    setGetStatus = noop,
+    targetSortable = true,
+    sourceEmptyMessage = 'No Items Found',
+    sourceRootTitle = 'Category',
+    targetEmptyMessage = 'No Items Selected',
+    targetRootTitle = 'Selected Items',
+    composeSourceItemProps = () => ({}),
+    composeTargetItemProps = () => ({}),
+    onAddToTarget = noop,
+    onAddCheckedItems = noop,
+    onRemoveFromTarget = noop,
+    onRemoveAllFromTarget = noop,
+    onChange = noop,
+    renderSourceCounter = noop,
+    renderTargetCounter = noop,
+    sourceClearItemsText = 'CLEAR ALL',
+    targetClearItemsText = 'CLEAR ALL',
+    searchPlaceholder = 'Search field ID, name, etc.',
+    loadingSource = false,
+    loadingTarget = false,
+    onGetMoreItems = () => null,
+    hasNextPage = false,
+    moreItemsLoading
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"](dsTruncatedTooltipText.TooltipTextProvider, {}, void 0, /*#__PURE__*/_jsx__default["default"](ShuttleImpl, {
+    composeSourceItemProps: composeSourceItemProps,
+    composeTargetItemProps: composeTargetItemProps,
+    containerProps: containerProps,
+    idField: idField,
+    items: items,
+    onAddCheckedItems: onAddCheckedItems,
+    onAddToTarget: onAddToTarget,
+    onChange: onChange,
+    onDrillDown: onDrillDown,
+    nonSelectedItems: nonSelectedItems,
+    onDrillDownTarget: onDrillDownTarget,
+    onRemoveAllFromTarget: onRemoveAllFromTarget,
+    onRemoveFromTarget: onRemoveFromTarget,
+    onSearch: onSearch,
+    onSearchClose: onSearchClose,
+    onSearchOpen: onSearchOpen,
+    onTargetSortEnd: onTargetSortEnd,
+    parentIdField: parentIdField,
+    renderSourceCounter: renderSourceCounter,
+    renderTargetCounter: renderTargetCounter,
+    searchPlaceholder: searchPlaceholder,
+    selectedItems: selectedItems,
+    setGetStatus: setGetStatus,
+    showIcons: showIcons,
+    sourceClearItemsText: sourceClearItemsText,
+    sourceEmptyMessage: sourceEmptyMessage,
+    sourceRootTitle: sourceRootTitle,
+    targetClearItemsText: targetClearItemsText,
+    targetEmptyMessage: targetEmptyMessage,
+    targetRootTitle: targetRootTitle,
+    targetSortable: targetSortable,
+    loadingSource: loadingSource,
+    loadingTarget: loadingTarget,
+    onGetMoreItems: lodash.debounce(function () {
+      onGetMoreItems(...arguments);
+    }, 500),
+    moreItemsLoading: moreItemsLoading,
+    hasNextPage: hasNextPage
+  }));
+};
 
 const props = {
   /** inject props to shuttle wrapper */

package/cjs/SearchState.js

@@ -1,5 +1,6 @@
 'use strict';
 
+require('core-js/modules/web.dom-collections.iterator.js');
 var react = require('react');
 var createContainer = require('constate');
 

package/cjs/Shuttle.actions.js

@@ -3,9 +3,15 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var utils = require('@elliemae/ds-utilities/utils');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var dsUtilities = require('@elliemae/ds-utilities');
 var helper = require('./helper.js');
-var utils$1 = require('./utils.js');
+var utils = require('./utils.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -16,7 +22,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 function toggleItemSelection(itemId) {
   return state => _objectSpread(_objectSpread({}, state), {}, {
-    checkedItems: utils.addOrRemove(state.checkedItems, itemId)
+    checkedItems: dsUtilities.addOrRemove(state.checkedItems, itemId)
   });
 }
 function navigateTo(item, dest) {
@@ -43,11 +49,13 @@ const defaultOptions = {
   op: hasMoved => !hasMoved
 }; // todo: optimize this
 
-function getItemDeep({
-  collection,
-  id,
-  options
-}) {
+function getItemDeep(_ref) {
+  let {
+    collection,
+    id,
+    options
+  } = _ref;
+
   const {
     idField
   } = _objectSpread(_objectSpread({}, defaultOptions), options);
@@ -55,7 +63,7 @@ function getItemDeep({
   const itemIndex = collection.findIndex(fItem => fItem[idField] === id); // get item with nested children
 
   const item = collection[itemIndex];
-  const children = item !== null && item !== void 0 && item.hasChildren ? utils.compose(utils$1.getChildren({
+  const children = item !== null && item !== void 0 && item.hasChildren ? dsUtilities.compose(utils.getChildren({
     index: itemIndex
   }))(collection) || [] : [];
   return {
@@ -65,9 +73,10 @@ function getItemDeep({
 }
 
 function addToTarget(itemToAdd, collection) {
-  return (state, {
-    idField
-  }) => {
+  return (state, _ref2) => {
+    let {
+      idField
+    } = _ref2;
     const items = collection || state.preparedItems;
     const {
       item,
@@ -84,19 +93,20 @@ function addToTarget(itemToAdd, collection) {
 } // todo: optimize this
 
 function removeFromTarget(itemToRemove) {
-  return (state, {
-    idField
-  }) => {
-    let targetItems = utils.cloneDeep(state.targetItems);
+  return (state, _ref3) => {
+    let {
+      idField
+    } = _ref3;
+    let targetItems = dsUtilities.cloneDeep(state.targetItems);
     const itemIndex = targetItems.findIndex(fItem => fItem.id === itemToRemove.id);
     const item = targetItems[itemIndex];
-    const children = item !== null && item !== void 0 && item.hasChildren ? utils.compose(helper.filterMovedItems(state.movedItems), utils$1.getChildren({
+    const children = item !== null && item !== void 0 && item.hasChildren ? dsUtilities.compose(helper.filterMovedItems(state.movedItems), utils.getChildren({
       index: itemIndex
     }))(targetItems) || [] : [];
     targetItems.splice(itemIndex, 1);
 
     if (item !== null && item !== void 0 && item.hasChildren && children.length) {
-      const childrenHash = utils.hashArray(children, 'id');
+      const childrenHash = dsUtilities.hashArray(children, 'id');
       targetItems = targetItems.filter(i => !childrenHash[i.id]);
     }
 

package/cjs/ShuttleContainer.js

@@ -2,8 +2,13 @@
 
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var react = require('react');
-var utils = require('@elliemae/ds-utilities/utils');
+var dsUtilities = require('@elliemae/ds-utilities');
 var withProviders = require('./withProviders.js');
 var helper = require('./helper.js');
 var SearchState = require('./SearchState.js');
@@ -24,10 +29,12 @@ function filterItemsByTerm(items, term) {
   return items.filter(item => item.name.toLowerCase().indexOf(String(term).toLowerCase()) !== -1 || String(item.id).indexOf(String(term).toLowerCase()) !== -1);
 }
 
-function ShuttleContainer({
-  items = [],
-  children
-}) {
+function ShuttleContainer(_ref) {
+  let {
+    items = [],
+    children
+  } = _ref;
+
   const _useContext = react.useContext(ShuttleState.Context),
         {
     state: shuttleState
@@ -53,12 +60,12 @@ function ShuttleContainer({
     navigate
   } = _objectSpread(_objectSpread(_objectSpread({}, shuttleState), searchState), handlers);
 
-  const sourceItems = react.useMemo(() => utils.compose(items => items.filter(item => !movedItems[item.id]), items => searchTerm && searching ? filterItemsByTerm(items, searchTerm) : items, items => helper.filterItemsByHierarchy(items, helper.getActiveIdFromHierarchy(hierarchy).id), items => helper.prepareItems(items))(items), [items, searchTerm, searching, hierarchy, movedItems]);
+  const sourceItems = react.useMemo(() => dsUtilities.compose(items => items.filter(item => !movedItems[item.id]), items => searchTerm && searching ? filterItemsByTerm(items, searchTerm) : items, items => helper.filterItemsByHierarchy(items, helper.getActiveIdFromHierarchy(hierarchy).id), items => helper.prepareItems(items))(items), [items, searchTerm, searching, hierarchy, movedItems]);
   const targetItems = react.useMemo(() => {
     const hierarchyId = helper.getActiveIdFromHierarchy(hierarchyDest).id;
-    return utils.compose(items => utils.sortBy(items, ['name']), items => hierarchyId ? helper.filterItemsByHierarchy(items, hierarchyId).filter(item => !movedItems[item.id]) : utils.uniqBy(utils.values(movedItems), 'id'))(items);
+    return dsUtilities.compose(items => dsUtilities.sortBy(items, ['name']), items => hierarchyId ? helper.filterItemsByHierarchy(items, hierarchyId).filter(item => !movedItems[item.id]) : dsUtilities.uniqBy(dsUtilities.values(movedItems), 'id'))(items);
   }, [items, searching, hierarchyDest, movedItems]);
-  return utils.isFunction(children) && children({
+  return dsUtilities.isFunction(children) && children({
     checkedItems,
     hierarchy,
     hierarchyDest,

package/cjs/ShuttleImpl.js

@@ -1,9 +1,21 @@
 'use strict';
 
-var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.some.js');
+require('core-js/modules/esnext.iterator.some.js');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.find.js');
+require('core-js/modules/esnext.iterator.find.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var react = require('react');
-var utils = require('@elliemae/ds-utilities/utils');
+var dsUtilities = require('@elliemae/ds-utilities');
 var withProviders = require('./withProviders.js');
 var Shuttle_actions = require('./Shuttle.actions.js');
 var helper = require('./helper.js');
@@ -14,8 +26,8 @@ var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 
 const _excluded = ["idField", "nonSelectedItems", "moreItemsLoading"];
 
@@ -27,12 +39,12 @@ class ShuttleImpl extends react.Component {
   constructor(props) {
     super(props);
 
-    _defineProperty__default["default"](this, "getState", () => {
+    this.getState = () => {
       const {
         movedItems
       } = this.state;
       return Object.keys(movedItems);
-    });
+    };
 
     this.state = {
       prevProps: {},
@@ -173,10 +185,11 @@ class ShuttleImpl extends react.Component {
     onAddCheckedItems(items);
   }
 
-  handleTargetSortEnd({
-    sourceItem,
-    targetItem
-  }) {
+  handleTargetSortEnd(_ref) {
+    let {
+      sourceItem,
+      targetItem
+    } = _ref;
     const {
       idField,
       onTargetSortEnd
@@ -190,8 +203,8 @@ class ShuttleImpl extends react.Component {
     const collection = !hierarchyId ? movedItems : targetItems;
     const oldIndex = collection.findIndex(tItem => tItem[idField] === sourceItem[idField]);
     const newIndex = collection.findIndex(tItem => tItem[idField] === targetItem[idField]);
-    const sortedMovedItems = !hierarchyId ? utils.arrayMove(movedItems, oldIndex, newIndex) : movedItems;
-    const sortedItems = hierarchyId ? utils.arrayMove(targetItems, oldIndex, newIndex) : targetItems;
+    const sortedMovedItems = !hierarchyId ? dsUtilities.arrayMove(movedItems, oldIndex, newIndex) : movedItems;
+    const sortedItems = hierarchyId ? dsUtilities.arrayMove(targetItems, oldIndex, newIndex) : targetItems;
     this.setState({
       targetItems: sortedItems,
       movedItems: sortedMovedItems
@@ -243,7 +256,7 @@ class ShuttleImpl extends react.Component {
     if (nonSelectedItems) {
       composedSourceItems = handleControlledSourceItms();
     } else {
-      composedSourceItems = utils.compose(helper.filterBySearch(searchTerm, searching), helper.filterMovedItems(movedItems), helper.getChildrenFromParent(helper.getActiveIdFromHierarchy(hierarchy).id))(items);
+      composedSourceItems = dsUtilities.compose(helper.filterBySearch(searchTerm, searching), helper.filterMovedItems(movedItems), helper.getChildrenFromParent(helper.getActiveIdFromHierarchy(hierarchy).id))(items);
     }
 
     const handleControlledTargetItms = () => {
@@ -263,9 +276,9 @@ class ShuttleImpl extends react.Component {
     if (nonSelectedItems) {
       composedTargetItems = handleControlledTargetItms();
     } else {
-      composedTargetItems = utils.compose(tItems => {
+      composedTargetItems = dsUtilities.compose(tItems => {
         const hierarchyId = helper.getActiveIdFromHierarchy(hierarchyDest).id;
-        return hierarchyId ? utils.compose(helper.filterMovedItems(movedItems), helper.getChildrenFromParent(hierarchyId))(tItems) : movedItems;
+        return hierarchyId ? dsUtilities.compose(helper.filterMovedItems(movedItems), helper.getChildrenFromParent(hierarchyId))(tItems) : movedItems;
       })(targetItems);
     }
 
@@ -292,8 +305,7 @@ class ShuttleImpl extends react.Component {
 
 }
 
-_defineProperty__default["default"](ShuttleImpl, "contextType", SearchState.Context);
-
+ShuttleImpl.contextType = SearchState.Context;
 var ShuttleImpl$1 = withProviders(ShuttleImpl);
 
 module.exports = ShuttleImpl$1;

package/cjs/ShuttleRenderer.js

@@ -1,5 +1,10 @@
 'use strict';
 
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var react = require('react');
@@ -86,7 +91,8 @@ function ShuttleRenderer(_ref) {
         onMoveItemToTarget(item);
         removeAnimationState();
       },
-      onNavigateTo: (item, direction = 'down') => {
+      onNavigateTo: function (item) {
+        let direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'down';
         const indexInHierarchy = hierarchy.findIndex(hItem => hItem.id === item.id);
         setIsDrillingDown(indexInHierarchy === -1);
         onNavigateOnSourceTo(item, direction);
@@ -117,7 +123,8 @@ function ShuttleRenderer(_ref) {
         removeAnimationState();
         onMoveItemToSource(item);
       },
-      onNavigateTo: (item, direction = 'down') => {
+      onNavigateTo: function (item) {
+        let direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'down';
         const indexInHierarchy = hierarchyDest.findIndex(hItem => hItem.id === item.id);
         setIsDrillingDown(indexInHierarchy === -1);
         onNavigateOnTargetTo(item, direction);

package/cjs/ShuttleState.js

@@ -1,5 +1,8 @@
 'use strict';
 
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
 var react = require('react');
 var createContainer = require('constate');
 var helper = require('./helper.js');
@@ -25,7 +28,9 @@ function useShuttleState() {
 
   const setState = state => setShuttleState(state(shuttleState));
 
-  function setMovedItems(itemsIds = [], items = []) {
+  function setMovedItems() {
+    let itemsIds = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+    let items = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
     const itemsToMove = helper.getItemsById(itemsIds, items);
     const pipeActions = itemsToMove.map(item => Shuttle_actions.moveItem(item));
     setState(helper.pipe([Shuttle_actions.resetMovedItems(), ...pipeActions]));
@@ -53,7 +58,7 @@ function useShuttleState() {
     setState(Shuttle_actions.toggleItemSelection(item.id));
   }
 
-  function moveCheckedItems(items, dest = true) {
+  function moveCheckedItems(items) {
     const pipeActions = items.map(item => moveItem(item));
     setState(helper.pipe([...pipeActions, resetCheckedItems()]));
   }

package/cjs/animation/animationConfig.js

@@ -15,7 +15,7 @@ const animationConfig = {
       transform: 'translate3d(0,0,0)'
     },
     to: {
-      transform: `translate3d(${xPosMovement}px,0,0)`
+      transform: "translate3d(".concat(xPosMovement, "px,0,0)")
     }
   },
   slideLeft: {
@@ -23,7 +23,7 @@ const animationConfig = {
       transform: 'translate3d(0,0,0)'
     },
     to: {
-      transform: `translate3d(${-xPosMovement}px,0,0)`
+      transform: "translate3d(".concat(-xPosMovement, "px,0,0)")
     }
   },
   moveItem: isMovingLeft => ({
@@ -32,14 +32,14 @@ const animationConfig = {
     },
     enter: {
       opacity: 1,
-      transform: `translate3d(${0}px,0,0)`
+      transform: "translate3d(".concat(0, "px,0,0)")
     },
     from: {
       opacity: 1,
-      transform: `translate3d(${isMovingLeft ? -xPosMovement : xPosMovement}px,0,0)`
+      transform: "translate3d(".concat(isMovingLeft ? -xPosMovement : xPosMovement, "px,0,0)")
     },
     leave: {
-      transform: `translate3d(${isMovingLeft ? -xPosMovement : xPosMovement}px,0,0)`
+      transform: "translate3d(".concat(isMovingLeft ? -xPosMovement : xPosMovement, "px,0,0)")
     }
   }),
   moveList: isDrillingDown => ({
@@ -52,11 +52,11 @@ const animationConfig = {
     },
     from: {
       opacity: 0,
-      transform: `translate3d(0px,${isDrillingDown ? xPosMovement : -xPosMovement}px,0)`
+      transform: "translate3d(0px,".concat(isDrillingDown ? xPosMovement : -xPosMovement, "px,0)")
     },
     leave: {
       opacity: 0,
-      transform: `translate3d(0,${isDrillingDown ? -xPosMovement : xPosMovement}px,0)`
+      transform: "translate3d(0,".concat(isDrillingDown ? -xPosMovement : xPosMovement, "px,0)")
     }
   }),
   breadcrumb: () => ({
@@ -65,15 +65,15 @@ const animationConfig = {
     },
     enter: {
       opacity: 1,
-      transform: `translate3d(${0}px,0,0)`
+      transform: "translate3d(".concat(0, "px,0,0)")
     },
     from: {
       opacity: 0,
-      transform: `translate3d(${xBreadcrumbPos}px,0px,0)`
+      transform: "translate3d(".concat(xBreadcrumbPos, "px,0px,0)")
     },
     leave: {
       opacity: 0,
-      transform: `translate3d(${xBreadcrumbPos}px,0,0)`
+      transform: "translate3d(".concat(xBreadcrumbPos, "px,0,0)")
     }
   })
 };

package/cjs/classedComponents.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var DSButton = require('@elliemae/ds-basic/Button');
+var DSButton = require('@elliemae/ds-button');
 var dsClassnames = require('@elliemae/ds-classnames');
 var ShuttleBreadcrumb = require('./components/ShuttleBreadcrumb.js');
 var OverflowList = require('./components/OverflowList.js');
@@ -12,34 +12,43 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
 
 const blockName = 'shuttle';
-const headerBlockName = `${blockName}-header`;
-const listBlockName = `${blockName}-list`;
-const footerBlockName = `${blockName}-footer`;
+const headerBlockName = "".concat(blockName, "-header");
+const listBlockName = "".concat(blockName, "-list");
+const footerBlockName = "".concat(blockName, "-footer");
 const ShuttleContainer = dsClassnames.aggregatedClasses('div')(blockName); // wrapper
 
-const ShuttleWrapper = dsClassnames.aggregatedClasses('div')(`${blockName}-wrapper`); // header
+const ShuttleWrapper = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-wrapper")); // header
 
 const ShuttleHeader = dsClassnames.aggregatedClasses('div')(headerBlockName);
 const ShuttleHeaderBreadcrumb = dsClassnames.aggregatedClasses(ShuttleBreadcrumb)(headerBlockName, 'breadcrumb');
 const ShuttleHeaderSearchToggle = dsClassnames.aggregatedClasses(DSButton__default["default"])(headerBlockName, 'search-toggle'); // list
 
-const ShuttleList = dsClassnames.aggregatedClasses('div')(listBlockName, null, ({
-  showPulse
-}) => ({
-  'show-pulse': showPulse
-}));
-const ShuttleListPanel = dsClassnames.aggregatedClasses('div')(listBlockName, 'panel', ({
-  open
-}) => ({
-  open
-}));
-const Overflow = dsClassnames.aggregatedClasses(OverflowList)(listBlockName, 'overflow', ({
-  empty,
-  searching
-}) => ({
-  empty,
-  searching
-}));
+const ShuttleList = dsClassnames.aggregatedClasses('div')(listBlockName, null, _ref => {
+  let {
+    showPulse
+  } = _ref;
+  return {
+    'show-pulse': showPulse
+  };
+});
+const ShuttleListPanel = dsClassnames.aggregatedClasses('div')(listBlockName, 'panel', _ref2 => {
+  let {
+    open
+  } = _ref2;
+  return {
+    open
+  };
+});
+const Overflow = dsClassnames.aggregatedClasses(OverflowList)(listBlockName, 'overflow', _ref3 => {
+  let {
+    empty,
+    searching
+  } = _ref3;
+  return {
+    empty,
+    searching
+  };
+});
 const EmptyMessage = dsClassnames.aggregatedClasses('span')(listBlockName, 'empty-message');
 const LoadingList = dsClassnames.aggregatedClasses('div')(listBlockName, 'loading-list'); // footer