@elliemae/ds-shuttle-v2 3.13.0-next.4 → 3.13.1-rc.0

package/dist/esm/config/itemMovementHelpers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/itemMovementHelpers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport React from 'react';\nimport { type DSButtonT } from '@elliemae/ds-button';\nimport { type DSShuttleV2T } from '../react-desc-prop-types';\nimport { usePropsStore, useInternalStore } from './useStore';\n\nexport const getNewDatasWithItemMoved = ({\n  item,\n  currData,\n  currWithSoftDelete,\n  otherData,\n}: {\n  item: DSShuttleV2T.Datum;\n  currData: DSShuttleV2T.Datum[];\n  currWithSoftDelete: boolean;\n  otherData: DSShuttleV2T.Datum[];\n}) => {\n  const { id, softDeleted } = item;\n  const newCurrData = [...currData];\n  const newOtherData = [...otherData];\n  const currListIndex = newCurrData.findIndex((datum) => datum.id === id);\n  const otherListIndex = newOtherData.findIndex((datum) => datum.id === id);\n  const isCurrDataItemOriginalList = otherListIndex === -1 || (otherListIndex !== -1 && softDeleted);\n  let currRemoveAtIndex = -1;\n  /**\n   * current data management\n   *    soft-deletion\n   *        if enabled\n   *    hard deletion\n   *        if not enabled\n   *            or\n   *        if we are \"moving back\" an item\n   */\n  if (currListIndex !== -1) {\n    if (isCurrDataItemOriginalList) {\n      // if curr data is the item's original list\n      //   soft-delete if users asks for soft-deletion\n      if (currWithSoftDelete) newCurrData[currListIndex].softDeleted = true;\n      //   else hard delete\n      else currRemoveAtIndex = currListIndex;\n    } else {\n      // else hard delete because we are moving back a soft-deleted element\n      currRemoveAtIndex = currListIndex;\n    }\n  }\n  // if hard-deletion was configured to be carried out -> hard delete in curr-data\n  if (currRemoveAtIndex !== -1) newCurrData.splice(currRemoveAtIndex, 1);\n\n  // we append to other data when it was not already present\n  const shouldAppendToOtherData = otherListIndex === -1;\n  //  in the new list we don't treat the item as soft-deleted\n  if (shouldAppendToOtherData) newOtherData.push({ ...item, softDeleted: false });\n  //   if it is already present we remove the soft-deleted status instead\n  else newOtherData[otherListIndex].softDeleted = false;\n\n  return {\n    newCurrData,\n    newOtherData,\n  };\n};\nexport const useHandleMoveSelection = ({ isDestinationPanel }: { isDestinationPanel: boolean }) => {\n  const currData = usePropsStore((state) => (isDestinationPanel ? state.destinationData : state.sourceData));\n  const currWithSoftDelete = usePropsStore((state) =>\n    isDestinationPanel ? state.destinationWithSoftDelete : state.sourceWithSoftDelete,\n  );\n  const currOnChange = usePropsStore((state) =>\n    isDestinationPanel ? state.onDestinationChange : state.onSourceChange,\n  );\n  const currOnRemove = usePropsStore((state) =>\n    isDestinationPanel ? state.onDestinationRemove : state.onSourceRemove,\n  );\n\n  const onSelectionChange = usePropsStore((state) =>\n    isDestinationPanel ? state.onDestinationSelectionChange : state.onSourceSelectionChange,\n  );\n\n  const otherData = usePropsStore((state) => (isDestinationPanel ? state.sourceData : state.destinationData));\n  const otherPanelOnChange = usePropsStore((state) =>\n    isDestinationPanel ? state.onSourceChange : state.onDestinationChange,\n  );\n  const otherPanelOnAdd = usePropsStore((state) => (isDestinationPanel ? state.onSourceAdd : state.onDestinationAdd));\n  const destinationSelectionArray = useInternalStore((store) => store.destinationSelectionItemArray);\n  const sourceSelectionArray = useInternalStore((store) => store.sourceSelectionItemArray);\n  const selectedItems = isDestinationPanel ? destinationSelectionArray : sourceSelectionArray;\n\n  const moveSelection = React.useCallback(\n    (event: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => {\n      event.preventDefault();\n      event.stopPropagation();\n      let iteratedNewCurrData = [...currData];\n      let iteratedNewOtherData = [...otherData];\n      selectedItems.forEach((datum) => {\n        const { newCurrData, newOtherData } = getNewDatasWithItemMoved({\n          item: datum,\n          currData: iteratedNewCurrData,\n          currWithSoftDelete,\n          otherData: iteratedNewOtherData,\n        });\n        iteratedNewCurrData = newCurrData;\n        iteratedNewOtherData = newOtherData;\n      });\n      currOnChange(iteratedNewCurrData, { event, selectedItems });\n      currOnRemove(selectedItems, { event });\n\n      otherPanelOnChange(iteratedNewOtherData, { event, selectedItems });\n      otherPanelOnAdd(selectedItems, { event });\n      onSelectionChange({}, { event });\n    },\n    [\n      currData,\n      otherData,\n      selectedItems,\n      currOnChange,\n      currOnRemove,\n      otherPanelOnChange,\n      otherPanelOnAdd,\n      onSelectionChange,\n      currWithSoftDelete,\n    ],\n  );\n  return React.useMemo(() => ({ moveSelection }), [moveSelection]);\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport React from 'react';\nimport { type DSButtonT } from '@elliemae/ds-button';\nimport { type DSShuttleV2T } from '../react-desc-prop-types';\nimport { usePropsStore, useInternalStore } from './useStore';\n\nexport const getNewDatasWithItemMoved = ({\n  item,\n  currData,\n  currWithSoftDelete,\n  otherData,\n}: {\n  item: DSShuttleV2T.Datum;\n  currData: DSShuttleV2T.Datum[];\n  currWithSoftDelete: boolean;\n  otherData: DSShuttleV2T.Datum[];\n}) => {\n  const { id, softDeleted } = item;\n  const newCurrData = [...currData];\n  const newOtherData = [...otherData];\n  const currListIndex = newCurrData.findIndex((datum) => datum.id === id);\n  const otherListIndex = newOtherData.findIndex((datum) => datum.id === id);\n  const isCurrDataItemOriginalList = otherListIndex === -1 || (otherListIndex !== -1 && softDeleted);\n  let currRemoveAtIndex = -1;\n  /**\n   * current data management\n   *    soft-deletion\n   *        if enabled\n   *    hard deletion\n   *        if not enabled\n   *            or\n   *        if we are \"moving back\" an item\n   */\n  if (currListIndex !== -1) {\n    if (isCurrDataItemOriginalList) {\n      // if curr data is the item's original list\n      //   soft-delete if users asks for soft-deletion\n      if (currWithSoftDelete) newCurrData[currListIndex].softDeleted = true;\n      //   else hard delete\n      else currRemoveAtIndex = currListIndex;\n    } else {\n      // else hard delete because we are moving back a soft-deleted element\n      currRemoveAtIndex = currListIndex;\n    }\n  }\n  // if hard-deletion was configured to be carried out -> hard delete in curr-data\n  if (currRemoveAtIndex !== -1) newCurrData.splice(currRemoveAtIndex, 1);\n\n  // we append to other data when it was not already present\n  const shouldAppendToOtherData = otherListIndex === -1;\n  //  in the new list we don't treat the item as soft-deleted\n  if (shouldAppendToOtherData) newOtherData.push({ ...item, softDeleted: false });\n  //   if it is already present we remove the soft-deleted status instead\n  else newOtherData[otherListIndex].softDeleted = false;\n\n  return {\n    newCurrData,\n    newOtherData,\n  };\n};\nexport const useHandleMoveSelection = ({ isDestinationPanel }: { isDestinationPanel: boolean }) => {\n  const currData = usePropsStore((state) => (isDestinationPanel ? state.destinationData : state.sourceData));\n  const currWithSoftDelete = usePropsStore((state) =>\n    isDestinationPanel ? state.destinationWithSoftDelete : state.sourceWithSoftDelete,\n  );\n  const currOnChange = usePropsStore((state) =>\n    isDestinationPanel ? state.onDestinationChange : state.onSourceChange,\n  );\n  const onSelectionChange = usePropsStore((state) =>\n    isDestinationPanel ? state.onDestinationSelectionChange : state.onSourceSelectionChange,\n  );\n\n  const otherData = usePropsStore((state) => (isDestinationPanel ? state.sourceData : state.destinationData));\n  const otherPanelOnChange = usePropsStore((state) =>\n    isDestinationPanel ? state.onSourceChange : state.onDestinationChange,\n  );\n  const destinationSelectionArray = useInternalStore((store) => store.destinationSelectionItemArray);\n  const sourceSelectionArray = useInternalStore((store) => store.sourceSelectionItemArray);\n  const selectedItems = isDestinationPanel ? destinationSelectionArray : sourceSelectionArray;\n\n  const moveSelection = React.useCallback(\n    (event: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => {\n      event.preventDefault();\n      event.stopPropagation();\n      let iteratedNewCurrData = [...currData];\n      let iteratedNewOtherData = [...otherData];\n      selectedItems.forEach((datum) => {\n        const { newCurrData, newOtherData } = getNewDatasWithItemMoved({\n          item: datum,\n          currData: iteratedNewCurrData,\n          currWithSoftDelete,\n          otherData: iteratedNewOtherData,\n        });\n        iteratedNewCurrData = newCurrData;\n        iteratedNewOtherData = newOtherData;\n      });\n      currOnChange(iteratedNewCurrData, { event, selectedItems });\n      otherPanelOnChange(iteratedNewOtherData, { event, selectedItems });\n      onSelectionChange({}, { event });\n    },\n    [currData, otherData, selectedItems, currOnChange, otherPanelOnChange, onSelectionChange, currWithSoftDelete],\n  );\n  return React.useMemo(() => ({ moveSelection }), [moveSelection]);\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACEvB,OAAOA,YAAW;AAGlB,SAAS,eAAe,wBAAwB;AAEzC,MAAM,2BAA2B,CAAC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAKM;AACJ,QAAM,EAAE,IAAI,YAAY,IAAI;AAC5B,QAAM,cAAc,CAAC,GAAG,QAAQ;AAChC,QAAM,eAAe,CAAC,GAAG,SAAS;AAClC,QAAM,gBAAgB,YAAY,UAAU,CAAC,UAAU,MAAM,OAAO,EAAE;AACtE,QAAM,iBAAiB,aAAa,UAAU,CAAC,UAAU,MAAM,OAAO,EAAE;AACxE,QAAM,6BAA6B,mBAAmB,MAAO,mBAAmB,MAAM;AACtF,MAAI,oBAAoB;AAUxB,MAAI,kBAAkB,IAAI;AACxB,QAAI,4BAA4B;AAG9B,UAAI;AAAoB,oBAAY,eAAe,cAAc;AAAA;AAE5D,4BAAoB;AAAA,IAC3B,OAAO;AAEL,0BAAoB;AAAA,IACtB;AAAA,EACF;AAEA,MAAI,sBAAsB;AAAI,gBAAY,OAAO,mBAAmB,CAAC;AAGrE,QAAM,0BAA0B,mBAAmB;AAEnD,MAAI;AAAyB,iBAAa,KAAK,EAAE,GAAG,MAAM,aAAa,MAAM,CAAC;AAAA;AAEzE,iBAAa,gBAAgB,cAAc;AAEhD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;AACO,MAAM,yBAAyB,CAAC,EAAE,mBAAmB,MAAuC;AACjG,QAAM,WAAW,cAAc,CAAC,UAAW,qBAAqB,MAAM,kBAAkB,MAAM,UAAW;AACzG,QAAM,qBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,eAAe;AAAA,IAAc,CAAC,UAClC,qBAAqB,MAAM,sBAAsB,MAAM;AAAA,EACzD;AACA,QAAM,oBAAoB;AAAA,IAAc,CAAC,UACvC,qBAAqB,MAAM,+BAA+B,MAAM;AAAA,EAClE;AAEA,QAAM,YAAY,cAAc,CAAC,UAAW,qBAAqB,MAAM,aAAa,MAAM,eAAgB;AAC1G,QAAM,qBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,iBAAiB,MAAM;AAAA,EACpD;AACA,QAAM,4BAA4B,iBAAiB,CAAC,UAAU,MAAM,6BAA6B;AACjG,QAAM,uBAAuB,iBAAiB,CAAC,UAAU,MAAM,wBAAwB;AACvF,QAAM,gBAAgB,qBAAqB,4BAA4B;AAEvE,QAAM,gBAAgBA,OAAM;AAAA,IAC1B,CAAC,UAA+D;AAC9D,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,UAAI,sBAAsB,CAAC,GAAG,QAAQ;AACtC,UAAI,uBAAuB,CAAC,GAAG,SAAS;AACxC,oBAAc,QAAQ,CAAC,UAAU;AAC/B,cAAM,EAAE,aAAa,aAAa,IAAI,yBAAyB;AAAA,UAC7D,MAAM;AAAA,UACN,UAAU;AAAA,UACV;AAAA,UACA,WAAW;AAAA,QACb,CAAC;AACD,8BAAsB;AACtB,+BAAuB;AAAA,MACzB,CAAC;AACD,mBAAa,qBAAqB,EAAE,OAAO,cAAc,CAAC;AAC1D,yBAAmB,sBAAsB,EAAE,OAAO,cAAc,CAAC;AACjE,wBAAkB,CAAC,GAAG,EAAE,MAAM,CAAC;AAAA,IACjC;AAAA,IACA,CAAC,UAAU,WAAW,eAAe,cAAc,oBAAoB,mBAAmB,kBAAkB;AAAA,EAC9G;AACA,SAAOA,OAAM,QAAQ,OAAO,EAAE,cAAc,IAAI,CAAC,aAAa,CAAC;AACjE;",
   "names": ["React"]
 }

package/dist/esm/config/useFocusTracker/useFocusActionTrackers.js

@@ -74,33 +74,33 @@ const useFocusActionTrackers = () => {
   const focusItemAction = useInternalStore((state) => state.focusItemAction);
   const mutableFocusItemAction = useMakeMutable(focusItemAction);
   const setFocusItemAction = useInternalStore((state) => state.setFocusItemAction);
-  const removeDragAndDropFromDestination = usePropsStore((state) => state.removeDragAndDropFromDestination);
-  const addDragAndDropFromSource = usePropsStore((state) => state.addDragAndDropFromSource);
+  const addDragAndDropToDestiantion = usePropsStore((state) => state.addDragAndDropToDestiantion);
+  const removeDragAndDropFromSource = usePropsStore((state) => state.removeDragAndDropFromSource);
   const trackFocusPrevAction = useCallback(
     ({ isDestinationPanel, item }) => {
       const preventMove = Boolean(item.original.preventMove);
       const preventDrilldown = Boolean(item.original.preventDrilldown);
-      const withDragAndDrop = isDestinationPanel && !removeDragAndDropFromDestination || !isDestinationPanel && addDragAndDropFromSource;
+      const withDragAndDrop = isDestinationPanel && addDragAndDropToDestiantion || !isDestinationPanel && !removeDragAndDropFromSource;
       const { prevAction } = getActionByProxymity({
         flags: { preventMove, preventDrilldown, withDragAndDrop },
         currentAction: mutableFocusItemAction.current
       });
       setFocusItemAction(prevAction);
     },
-    [addDragAndDropFromSource, mutableFocusItemAction, removeDragAndDropFromDestination, setFocusItemAction]
+    [addDragAndDropToDestiantion, mutableFocusItemAction, removeDragAndDropFromSource, setFocusItemAction]
   );
   const trackFocusNextAction = useCallback(
     ({ isDestinationPanel, item }) => {
       const preventMove = Boolean(item.original.preventMove);
       const preventDrilldown = Boolean(item.original.preventDrilldown);
-      const withDragAndDrop = isDestinationPanel && !removeDragAndDropFromDestination || !isDestinationPanel && addDragAndDropFromSource;
+      const withDragAndDrop = isDestinationPanel && addDragAndDropToDestiantion || !isDestinationPanel && !removeDragAndDropFromSource;
       const { nextAction } = getActionByProxymity({
         flags: { preventMove, preventDrilldown, withDragAndDrop },
         currentAction: mutableFocusItemAction.current
       });
       setFocusItemAction(nextAction);
     },
-    [addDragAndDropFromSource, mutableFocusItemAction, removeDragAndDropFromDestination, setFocusItemAction]
+    [addDragAndDropToDestiantion, mutableFocusItemAction, removeDragAndDropFromSource, setFocusItemAction]
   );
   return useMemo(
     () => ({

package/dist/esm/config/useFocusTracker/useFocusActionTrackers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/config/useFocusTracker/useFocusActionTrackers.ts"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo, useCallback } from 'react';\nimport { useMakeMutable } from '@elliemae/ds-utilities';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types';\nimport { ACTIONS_FOCUSES } from '../../constants';\nimport { useInternalStore, usePropsStore } from '../useStore';\n\ntype ActionFlags = {\n  preventDrilldown: boolean;\n  withDragAndDrop: boolean;\n  preventMove: boolean;\n};\ntype ActionByProxymity = {\n  prevAction: typeof ACTIONS_FOCUSES[keyof typeof ACTIONS_FOCUSES];\n  nextAction: typeof ACTIONS_FOCUSES[keyof typeof ACTIONS_FOCUSES];\n};\nconst getMoveBtnActionByProxymity = (flags: ActionFlags) => {\n  // move button\n  const { preventDrilldown, withDragAndDrop } = flags;\n  const actionMap = { prevAction: '', nextAction: '' } as ActionByProxymity;\n  // prev\n  //         drilldown     if it exist\n  //    else drag n drop   if it exist\n  //    else parent\n  if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n  else if (withDragAndDrop) actionMap.prevAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n  else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;\n  // next\n  //         drag n drop   if it exist\n  //    else parent\n  if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n  else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;\n  return actionMap;\n};\nconst getDragAndDropBtnActionByProxymity = (flags: ActionFlags) => {\n  // Drag and drop handler\n  const { preventMove, preventDrilldown } = flags;\n  // next\n  //     always parent\n  const actionMap = { prevAction: '', nextAction: ACTIONS_FOCUSES.PARENT } as ActionByProxymity;\n  // prev\n  //         move          if it exist\n  //    else drilldown     if it exist\n  //    else parent\n  if (!preventMove) actionMap.prevAction = ACTIONS_FOCUSES.MOVE_BTN;\n  else if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n  else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;\n  return actionMap;\n};\nconst getDrilldownBtnActionByProxymity = (flags: ActionFlags) => {\n  // Drilldown handler\n  const { withDragAndDrop, preventMove } = flags;\n  // prev\n  //     always parent\n  const actionMap = { prevAction: ACTIONS_FOCUSES.PARENT, nextAction: '' } as ActionByProxymity;\n  // next\n  //         move          if it exist\n  //    else drag n drop   if it exist\n  //    else parent\n  if (!preventMove) actionMap.nextAction = ACTIONS_FOCUSES.MOVE_BTN;\n  else if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n  else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;\n  return actionMap;\n};\nconst getParenBtnActionByProxymity = (flags: ActionFlags) => {\n  // Parent handler\n  const { preventDrilldown, withDragAndDrop, preventMove } = flags;\n  const actionMap = { prevAction: '', nextAction: '' } as ActionByProxymity;\n  // prev\n  //         drag n drop   if it exist\n  //    else move          if it exist\n  //    else drilldown     if it exist\n  //    else parent\n  if (withDragAndDrop) actionMap.prevAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n  else if (!preventMove) actionMap.prevAction = ACTIONS_FOCUSES.MOVE_BTN;\n  else if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n  else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;\n  // next\n  //         drilldown     if it exist\n  //    else move          if it exist\n  //    else drag n drop   if it exist\n  //    else parent\n  if (!preventDrilldown) actionMap.nextAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n  else if (!preventMove) actionMap.nextAction = ACTIONS_FOCUSES.MOVE_BTN;\n  else if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n  else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;\n  return actionMap;\n};\nconst getActionByProxymity = ({ flags, currentAction }: { flags: ActionFlags; currentAction: string }) => {\n  if (currentAction === ACTIONS_FOCUSES.MOVE_BTN) return getMoveBtnActionByProxymity(flags);\n  if (currentAction === ACTIONS_FOCUSES.DRAG_N_DROP) return getDragAndDropBtnActionByProxymity(flags);\n  if (currentAction === ACTIONS_FOCUSES.DRILLDOWN_BTN) return getDrilldownBtnActionByProxymity(flags);\n  return getParenBtnActionByProxymity(flags);\n};\nexport const useFocusActionTrackers = () => {\n  const focusItemAction = useInternalStore((state) => state.focusItemAction);\n  //  tracking actions are always triggered as user action callbacks\n  //    this means it should always be invoked after all the useEffect execute\n  //    since this is the case, we can avoid re-declaring the function with mutable pattern\n  //    this way we avoid useless re-renders\n  const mutableFocusItemAction = useMakeMutable(focusItemAction);\n  const setFocusItemAction = useInternalStore((state) => state.setFocusItemAction);\n  const removeDragAndDropFromDestination = usePropsStore((state) => state.removeDragAndDropFromDestination);\n  const addDragAndDropFromSource = usePropsStore((state) => state.addDragAndDropFromSource);\n  const trackFocusPrevAction = useCallback(\n    ({ isDestinationPanel, item }: DSShuttleV2T.ItemMeta) => {\n      const preventMove = Boolean(item.original.preventMove);\n      const preventDrilldown = Boolean(item.original.preventDrilldown);\n      const withDragAndDrop =\n        (isDestinationPanel && !removeDragAndDropFromDestination) || (!isDestinationPanel && addDragAndDropFromSource);\n      const { prevAction } = getActionByProxymity({\n        flags: { preventMove, preventDrilldown, withDragAndDrop },\n        currentAction: mutableFocusItemAction.current,\n      });\n      setFocusItemAction(prevAction);\n    },\n    [addDragAndDropFromSource, mutableFocusItemAction, removeDragAndDropFromDestination, setFocusItemAction],\n  );\n  const trackFocusNextAction = useCallback(\n    ({ isDestinationPanel, item }: DSShuttleV2T.ItemMeta) => {\n      const preventMove = Boolean(item.original.preventMove);\n      const preventDrilldown = Boolean(item.original.preventDrilldown);\n      const withDragAndDrop =\n        (isDestinationPanel && !removeDragAndDropFromDestination) || (!isDestinationPanel && addDragAndDropFromSource);\n      const { nextAction } = getActionByProxymity({\n        flags: { preventMove, preventDrilldown, withDragAndDrop },\n        currentAction: mutableFocusItemAction.current,\n      });\n      setFocusItemAction(nextAction);\n    },\n    [addDragAndDropFromSource, mutableFocusItemAction, removeDragAndDropFromDestination, setFocusItemAction],\n  );\n  return useMemo(\n    () => ({\n      mutableFocusItemAction,\n      trackFocusActionMove: () => setFocusItemAction('move-btn'),\n      trackFocusActionDrilldown: () => setFocusItemAction('drilldown-btn'),\n      trackFocusActionDragAndDrop: () => setFocusItemAction('drag-n-drop'),\n      trackFocusActionParent: () => setFocusItemAction('parent'),\n      trackFocusActionReset: () => setFocusItemAction(''),\n      trackFocusPrevAction,\n      trackFocusNextAction,\n    }),\n    [mutableFocusItemAction, setFocusItemAction, trackFocusNextAction, trackFocusPrevAction],\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,SAAS,mBAAmB;AACrC,SAAS,sBAAsB;AAE/B,SAAS,uBAAuB;AAChC,SAAS,kBAAkB,qBAAqB;AAWhD,MAAM,8BAA8B,CAAC,UAAuB;AAE1D,QAAM,EAAE,kBAAkB,gBAAgB,IAAI;AAC9C,QAAM,YAAY,EAAE,YAAY,IAAI,YAAY,GAAG;AAKnD,MAAI,CAAC;AAAkB,cAAU,aAAa,gBAAgB;AAAA,WACrD;AAAiB,cAAU,aAAa,gBAAgB;AAAA;AAC5D,cAAU,aAAa,gBAAgB;AAI5C,MAAI;AAAiB,cAAU,aAAa,gBAAgB;AAAA;AACvD,cAAU,aAAa,gBAAgB;AAC5C,SAAO;AACT;AACA,MAAM,qCAAqC,CAAC,UAAuB;AAEjE,QAAM,EAAE,aAAa,iBAAiB,IAAI;AAG1C,QAAM,YAAY,EAAE,YAAY,IAAI,YAAY,gBAAgB,OAAO;AAKvE,MAAI,CAAC;AAAa,cAAU,aAAa,gBAAgB;AAAA,WAChD,CAAC;AAAkB,cAAU,aAAa,gBAAgB;AAAA;AAC9D,cAAU,aAAa,gBAAgB;AAC5C,SAAO;AACT;AACA,MAAM,mCAAmC,CAAC,UAAuB;AAE/D,QAAM,EAAE,iBAAiB,YAAY,IAAI;AAGzC,QAAM,YAAY,EAAE,YAAY,gBAAgB,QAAQ,YAAY,GAAG;AAKvE,MAAI,CAAC;AAAa,cAAU,aAAa,gBAAgB;AAAA,WAChD;AAAiB,cAAU,aAAa,gBAAgB;AAAA;AAC5D,cAAU,aAAa,gBAAgB;AAC5C,SAAO;AACT;AACA,MAAM,+BAA+B,CAAC,UAAuB;AAE3D,QAAM,EAAE,kBAAkB,iBAAiB,YAAY,IAAI;AAC3D,QAAM,YAAY,EAAE,YAAY,IAAI,YAAY,GAAG;AAMnD,MAAI;AAAiB,cAAU,aAAa,gBAAgB;AAAA,WACnD,CAAC;AAAa,cAAU,aAAa,gBAAgB;AAAA,WACrD,CAAC;AAAkB,cAAU,aAAa,gBAAgB;AAAA;AAC9D,cAAU,aAAa,gBAAgB;AAM5C,MAAI,CAAC;AAAkB,cAAU,aAAa,gBAAgB;AAAA,WACrD,CAAC;AAAa,cAAU,aAAa,gBAAgB;AAAA,WACrD;AAAiB,cAAU,aAAa,gBAAgB;AAAA;AAC5D,cAAU,aAAa,gBAAgB;AAC5C,SAAO;AACT;AACA,MAAM,uBAAuB,CAAC,EAAE,OAAO,cAAc,MAAqD;AACxG,MAAI,kBAAkB,gBAAgB;AAAU,WAAO,4BAA4B,KAAK;AACxF,MAAI,kBAAkB,gBAAgB;AAAa,WAAO,mCAAmC,KAAK;AAClG,MAAI,kBAAkB,gBAAgB;AAAe,WAAO,iCAAiC,KAAK;AAClG,SAAO,6BAA6B,KAAK;AAC3C;AACO,MAAM,yBAAyB,MAAM;AAC1C,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AAKzE,QAAM,yBAAyB,eAAe,eAAe;AAC7D,QAAM,qBAAqB,iBAAiB,CAAC,UAAU,MAAM,kBAAkB;AAC/E,QAAM,mCAAmC,cAAc,CAAC,UAAU,MAAM,gCAAgC;AACxG,QAAM,2BAA2B,cAAc,CAAC,UAAU,MAAM,wBAAwB;AACxF,QAAM,uBAAuB;AAAA,IAC3B,CAAC,EAAE,oBAAoB,KAAK,MAA6B;AACvD,YAAM,cAAc,QAAQ,KAAK,SAAS,WAAW;AACrD,YAAM,mBAAmB,QAAQ,KAAK,SAAS,gBAAgB;AAC/D,YAAM,kBACH,sBAAsB,CAAC,oCAAsC,CAAC,sBAAsB;AACvF,YAAM,EAAE,WAAW,IAAI,qBAAqB;AAAA,QAC1C,OAAO,EAAE,aAAa,kBAAkB,gBAAgB;AAAA,QACxD,eAAe,uBAAuB;AAAA,MACxC,CAAC;AACD,yBAAmB,UAAU;AAAA,IAC/B;AAAA,IACA,CAAC,0BAA0B,wBAAwB,kCAAkC,kBAAkB;AAAA,EACzG;AACA,QAAM,uBAAuB;AAAA,IAC3B,CAAC,EAAE,oBAAoB,KAAK,MAA6B;AACvD,YAAM,cAAc,QAAQ,KAAK,SAAS,WAAW;AACrD,YAAM,mBAAmB,QAAQ,KAAK,SAAS,gBAAgB;AAC/D,YAAM,kBACH,sBAAsB,CAAC,oCAAsC,CAAC,sBAAsB;AACvF,YAAM,EAAE,WAAW,IAAI,qBAAqB;AAAA,QAC1C,OAAO,EAAE,aAAa,kBAAkB,gBAAgB;AAAA,QACxD,eAAe,uBAAuB;AAAA,MACxC,CAAC;AACD,yBAAmB,UAAU;AAAA,IAC/B;AAAA,IACA,CAAC,0BAA0B,wBAAwB,kCAAkC,kBAAkB;AAAA,EACzG;AACA,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA,sBAAsB,MAAM,mBAAmB,UAAU;AAAA,MACzD,2BAA2B,MAAM,mBAAmB,eAAe;AAAA,MACnE,6BAA6B,MAAM,mBAAmB,aAAa;AAAA,MACnE,wBAAwB,MAAM,mBAAmB,QAAQ;AAAA,MACzD,uBAAuB,MAAM,mBAAmB,EAAE;AAAA,MAClD;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,wBAAwB,oBAAoB,sBAAsB,oBAAoB;AAAA,EACzF;AACF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo, useCallback } from 'react';\nimport { useMakeMutable } from '@elliemae/ds-utilities';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types';\nimport { ACTIONS_FOCUSES } from '../../constants';\nimport { useInternalStore, usePropsStore } from '../useStore';\n\ntype ActionFlags = {\n  preventDrilldown: boolean;\n  withDragAndDrop: boolean;\n  preventMove: boolean;\n};\ntype ActionByProxymity = {\n  prevAction: typeof ACTIONS_FOCUSES[keyof typeof ACTIONS_FOCUSES];\n  nextAction: typeof ACTIONS_FOCUSES[keyof typeof ACTIONS_FOCUSES];\n};\nconst getMoveBtnActionByProxymity = (flags: ActionFlags) => {\n  // move button\n  const { preventDrilldown, withDragAndDrop } = flags;\n  const actionMap = { prevAction: '', nextAction: '' } as ActionByProxymity;\n  // prev\n  //         drilldown     if it exist\n  //    else drag n drop   if it exist\n  //    else parent\n  if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n  else if (withDragAndDrop) actionMap.prevAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n  else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;\n  // next\n  //         drag n drop   if it exist\n  //    else parent\n  if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n  else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;\n  return actionMap;\n};\nconst getDragAndDropBtnActionByProxymity = (flags: ActionFlags) => {\n  // Drag and drop handler\n  const { preventMove, preventDrilldown } = flags;\n  // next\n  //     always parent\n  const actionMap = { prevAction: '', nextAction: ACTIONS_FOCUSES.PARENT } as ActionByProxymity;\n  // prev\n  //         move          if it exist\n  //    else drilldown     if it exist\n  //    else parent\n  if (!preventMove) actionMap.prevAction = ACTIONS_FOCUSES.MOVE_BTN;\n  else if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n  else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;\n  return actionMap;\n};\nconst getDrilldownBtnActionByProxymity = (flags: ActionFlags) => {\n  // Drilldown handler\n  const { withDragAndDrop, preventMove } = flags;\n  // prev\n  //     always parent\n  const actionMap = { prevAction: ACTIONS_FOCUSES.PARENT, nextAction: '' } as ActionByProxymity;\n  // next\n  //         move          if it exist\n  //    else drag n drop   if it exist\n  //    else parent\n  if (!preventMove) actionMap.nextAction = ACTIONS_FOCUSES.MOVE_BTN;\n  else if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n  else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;\n  return actionMap;\n};\nconst getParenBtnActionByProxymity = (flags: ActionFlags) => {\n  // Parent handler\n  const { preventDrilldown, withDragAndDrop, preventMove } = flags;\n  const actionMap = { prevAction: '', nextAction: '' } as ActionByProxymity;\n  // prev\n  //         drag n drop   if it exist\n  //    else move          if it exist\n  //    else drilldown     if it exist\n  //    else parent\n  if (withDragAndDrop) actionMap.prevAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n  else if (!preventMove) actionMap.prevAction = ACTIONS_FOCUSES.MOVE_BTN;\n  else if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n  else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;\n  // next\n  //         drilldown     if it exist\n  //    else move          if it exist\n  //    else drag n drop   if it exist\n  //    else parent\n  if (!preventDrilldown) actionMap.nextAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n  else if (!preventMove) actionMap.nextAction = ACTIONS_FOCUSES.MOVE_BTN;\n  else if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n  else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;\n  return actionMap;\n};\nconst getActionByProxymity = ({ flags, currentAction }: { flags: ActionFlags; currentAction: string }) => {\n  if (currentAction === ACTIONS_FOCUSES.MOVE_BTN) return getMoveBtnActionByProxymity(flags);\n  if (currentAction === ACTIONS_FOCUSES.DRAG_N_DROP) return getDragAndDropBtnActionByProxymity(flags);\n  if (currentAction === ACTIONS_FOCUSES.DRILLDOWN_BTN) return getDrilldownBtnActionByProxymity(flags);\n  return getParenBtnActionByProxymity(flags);\n};\nexport const useFocusActionTrackers = () => {\n  const focusItemAction = useInternalStore((state) => state.focusItemAction);\n  //  tracking actions are always triggered as user action callbacks\n  //    this means it should always be invoked after all the useEffect execute\n  //    since this is the case, we can avoid re-declaring the function with mutable pattern\n  //    this way we avoid useless re-renders\n  const mutableFocusItemAction = useMakeMutable(focusItemAction);\n  const setFocusItemAction = useInternalStore((state) => state.setFocusItemAction);\n  const addDragAndDropToDestiantion = usePropsStore((state) => state.addDragAndDropToDestiantion);\n  const removeDragAndDropFromSource = usePropsStore((state) => state.removeDragAndDropFromSource);\n  const trackFocusPrevAction = useCallback(\n    ({ isDestinationPanel, item }: DSShuttleV2T.ItemMeta) => {\n      const preventMove = Boolean(item.original.preventMove);\n      const preventDrilldown = Boolean(item.original.preventDrilldown);\n      const withDragAndDrop =\n        (isDestinationPanel && addDragAndDropToDestiantion) || (!isDestinationPanel && !removeDragAndDropFromSource);\n      const { prevAction } = getActionByProxymity({\n        flags: { preventMove, preventDrilldown, withDragAndDrop },\n        currentAction: mutableFocusItemAction.current,\n      });\n      setFocusItemAction(prevAction);\n    },\n    [addDragAndDropToDestiantion, mutableFocusItemAction, removeDragAndDropFromSource, setFocusItemAction],\n  );\n  const trackFocusNextAction = useCallback(\n    ({ isDestinationPanel, item }: DSShuttleV2T.ItemMeta) => {\n      const preventMove = Boolean(item.original.preventMove);\n      const preventDrilldown = Boolean(item.original.preventDrilldown);\n      const withDragAndDrop =\n        (isDestinationPanel && addDragAndDropToDestiantion) || (!isDestinationPanel && !removeDragAndDropFromSource);\n      const { nextAction } = getActionByProxymity({\n        flags: { preventMove, preventDrilldown, withDragAndDrop },\n        currentAction: mutableFocusItemAction.current,\n      });\n      setFocusItemAction(nextAction);\n    },\n    [addDragAndDropToDestiantion, mutableFocusItemAction, removeDragAndDropFromSource, setFocusItemAction],\n  );\n  return useMemo(\n    () => ({\n      mutableFocusItemAction,\n      trackFocusActionMove: () => setFocusItemAction('move-btn'),\n      trackFocusActionDrilldown: () => setFocusItemAction('drilldown-btn'),\n      trackFocusActionDragAndDrop: () => setFocusItemAction('drag-n-drop'),\n      trackFocusActionParent: () => setFocusItemAction('parent'),\n      trackFocusActionReset: () => setFocusItemAction(''),\n      trackFocusPrevAction,\n      trackFocusNextAction,\n    }),\n    [mutableFocusItemAction, setFocusItemAction, trackFocusNextAction, trackFocusPrevAction],\n  );\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/esm/config/useShuttleV2.js

@@ -3,16 +3,17 @@ import { useEffect } from "react";
 import { useMemoMergePropsWithDefault } from "@elliemae/ds-utilities";
 import { defaultProps } from "../react-desc-prop-types";
 import { usePropsStore, useInternalStore } from "./useStore";
-import { useAutoCalculated } from "./useAutoCalculated";
+import { configureAutoCalculated } from "./configureAutoCalculated";
 const useShuttleV2 = (propsFromUser) => {
   const propsWithDefaults = useMemoMergePropsWithDefault(propsFromUser, defaultProps);
   const setProps = usePropsStore((state) => state.set);
   const setAutoCalculated = useInternalStore((state) => state.set);
-  const autoCalculatedConfig = useAutoCalculated(propsWithDefaults);
   useEffect(() => {
     setProps({ ...propsWithDefaults });
-    setAutoCalculated(autoCalculatedConfig);
-  }, [propsWithDefaults, setProps, setAutoCalculated, autoCalculatedConfig]);
+    setAutoCalculated({
+      ...configureAutoCalculated(propsWithDefaults)
+    });
+  }, [propsWithDefaults, setProps, setAutoCalculated]);
 };
 export {
   useShuttleV2

package/dist/esm/config/useShuttleV2.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useShuttleV2.ts"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect } from 'react';\nimport { useMemoMergePropsWithDefault } from '@elliemae/ds-utilities';\n\nimport { type DSShuttleV2T, defaultProps } from '../react-desc-prop-types';\nimport { usePropsStore, useInternalStore } from './useStore';\nimport { useAutoCalculated } from './useAutoCalculated';\nexport const useShuttleV2 = (propsFromUser: DSShuttleV2T.Props) => {\n  // auto-update props-store and auto-calculated when props changes\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSShuttleV2T.InternalProps>(propsFromUser, defaultProps);\n  const setProps = usePropsStore((state) => state.set);\n  const setAutoCalculated = useInternalStore((state) => state.set);\n\n  const autoCalculatedConfig = useAutoCalculated(propsWithDefaults);\n  useEffect(() => {\n    setProps({ ...propsWithDefaults });\n    setAutoCalculated(autoCalculatedConfig);\n  }, [propsWithDefaults, setProps, setAutoCalculated, autoCalculatedConfig]);\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,iBAAiB;AAC1B,SAAS,oCAAoC;AAE7C,SAA4B,oBAAoB;AAChD,SAAS,eAAe,wBAAwB;AAChD,SAAS,yBAAyB;AAC3B,MAAM,eAAe,CAAC,kBAAsC;AAEjE,QAAM,oBAAoB,6BAAyD,eAAe,YAAY;AAC9G,QAAM,WAAW,cAAc,CAAC,UAAU,MAAM,GAAG;AACnD,QAAM,oBAAoB,iBAAiB,CAAC,UAAU,MAAM,GAAG;AAE/D,QAAM,uBAAuB,kBAAkB,iBAAiB;AAChE,YAAU,MAAM;AACd,aAAS,EAAE,GAAG,kBAAkB,CAAC;AACjC,sBAAkB,oBAAoB;AAAA,EACxC,GAAG,CAAC,mBAAmB,UAAU,mBAAmB,oBAAoB,CAAC;AAC3E;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect } from 'react';\nimport { useMemoMergePropsWithDefault } from '@elliemae/ds-utilities';\nimport { type DSShuttleV2T, defaultProps } from '../react-desc-prop-types';\nimport { usePropsStore, useInternalStore } from './useStore';\nimport { configureAutoCalculated } from './configureAutoCalculated';\n\nexport const useShuttleV2 = (propsFromUser: DSShuttleV2T.Props) => {\n  // auto-update props-store and auto-calculated when props changes\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSShuttleV2T.InternalProps>(propsFromUser, defaultProps);\n  const setProps = usePropsStore((state) => state.set);\n  const setAutoCalculated = useInternalStore((state) => state.set);\n\n  useEffect(() => {\n    setProps({ ...propsWithDefaults });\n    setAutoCalculated({\n      ...configureAutoCalculated(propsWithDefaults),\n    });\n  }, [propsWithDefaults, setProps, setAutoCalculated]);\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,iBAAiB;AAC1B,SAAS,oCAAoC;AAC7C,SAA4B,oBAAoB;AAChD,SAAS,eAAe,wBAAwB;AAChD,SAAS,+BAA+B;AAEjC,MAAM,eAAe,CAAC,kBAAsC;AAEjE,QAAM,oBAAoB,6BAAyD,eAAe,YAAY;AAC9G,QAAM,WAAW,cAAc,CAAC,UAAU,MAAM,GAAG;AACnD,QAAM,oBAAoB,iBAAiB,CAAC,UAAU,MAAM,GAAG;AAE/D,YAAU,MAAM;AACd,aAAS,EAAE,GAAG,kBAAkB,CAAC;AACjC,sBAAkB;AAAA,MAChB,GAAG,wBAAwB,iBAAiB;AAAA,IAC9C,CAAC;AAAA,EACH,GAAG,CAAC,mBAAmB,UAAU,iBAAiB,CAAC;AACrD;",
   "names": []
 }

package/dist/esm/config/useStore/useStore.js

@@ -4,8 +4,8 @@ import create from "zustand";
 import createContext from "zustand/context";
 import { useMemoMergePropsWithDefault } from "@elliemae/ds-utilities";
 import { defaultProps } from "../../react-desc-prop-types";
-import { useAutoCalculated } from "../useAutoCalculated";
-const internalStoreCreatorFunc = (autoCalculatedData) => create((set, get) => {
+import { configureAutoCalculated } from "../configureAutoCalculated";
+const internalStoreCreatorFunc = (propsWithDefaults) => create((set, get) => {
   const constants = {
     set
   };
@@ -30,20 +30,12 @@ const internalStoreCreatorFunc = (autoCalculatedData) => create((set, get) => {
         set({ focusItemAction: focusItemAction(get().focusItemAction, get()) });
       else
         set({ focusItemAction });
-    },
-    dropIndicatorPosition: 0,
-    setDropIndicatorPosition: (dropIndicatorPosition) => set({ dropIndicatorPosition }),
-    overId: "",
-    setOverId: (overId) => set({ overId }),
-    lastActiveId: "",
-    setLastActiveId: (lastActiveId) => set({ lastActiveId }),
-    isDropValid: false,
-    setIsDropValid: (isDropValid) => set({ isDropValid })
+    }
   };
   return {
     ...constants,
     ...internalAtoms,
-    ...autoCalculatedData
+    ...configureAutoCalculated(propsWithDefaults)
   };
 });
 const propsStoreCreatorFunc = (propsWithDefaults) => create((set) => ({
@@ -62,8 +54,7 @@ const {
 } = createContext();
 const useShuttleV2InternalStoreConfig = (propsFromUser) => {
   const propsWithDefaults = useMemoMergePropsWithDefault(propsFromUser, defaultProps);
-  const autoCalculatedData = useAutoCalculated(propsWithDefaults);
-  return useCallback(() => internalStoreCreatorFunc(autoCalculatedData), [autoCalculatedData]);
+  return useCallback(() => internalStoreCreatorFunc(propsWithDefaults), [propsWithDefaults]);
 };
 const useShuttleV2PropsStoreConfig = (propsFromUser) => {
   const propsWithDefaults = useMemoMergePropsWithDefault(propsFromUser, defaultProps);

package/dist/esm/config/useStore/useStore.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/config/useStore/useStore.ts"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useCallback } from 'react';\nimport create, { type StoreApi } from 'zustand';\nimport createContext from 'zustand/context';\nimport { useMemoMergePropsWithDefault } from '@elliemae/ds-utilities';\nimport { type useShuttleVirtualized } from '../useAutoCalculated/useShuttleVirtualized';\nimport { type DSShuttleV2T, defaultProps } from '../../react-desc-prop-types';\nimport type { REGIONS_FOCUSES, ACTIONS_FOCUSES, ITEMS_FOCUSES } from '../../constants';\nimport { useAutoCalculated } from '../useAutoCalculated';\n\ntype FocusRegion = typeof REGIONS_FOCUSES[keyof typeof REGIONS_FOCUSES];\ntype FocusRegionSetter = (newVal: FocusRegion | ((arg: FocusRegion, store: InternalStore) => FocusRegion)) => void;\n\ntype FocusItem = Omit<typeof ITEMS_FOCUSES[keyof typeof ITEMS_FOCUSES], 'GET_SPECIFIC_ITEM'> & string;\ntype FocusItemSetter = (newVal: FocusItem | ((arg: FocusItem, store: InternalStore) => FocusItem)) => void;\n\ntype FocusItemAction = typeof ACTIONS_FOCUSES[keyof typeof ACTIONS_FOCUSES];\ntype FocusItemActionSetter = (\n  newVal: FocusItemAction | ((arg: FocusItemAction, store: InternalStore) => FocusItemAction),\n) => void;\n\ntype UseShuttleVirtualizedT = ReturnType<typeof useShuttleVirtualized>;\nexport interface InternalAtoms {\n  focusRegion: FocusRegion;\n  setFocusRegion: FocusRegionSetter;\n  focusItem: FocusItem;\n  setFocusItem: FocusItemSetter;\n  focusItemAction: FocusItemAction;\n  setFocusItemAction: FocusItemActionSetter;\n  dropIndicatorPosition: number;\n  setDropIndicatorPosition: (newVal: number) => void;\n  overId: string;\n  setOverId: (newVal: string) => void;\n  lastActiveId: string;\n  setLastActiveId: (newVal: string) => void;\n  isDropValid: boolean;\n  setIsDropValid: (newVal: boolean) => void;\n}\nexport interface StoreConstants {\n  set: StoreApi<InternalStore>['setState'];\n}\n\nexport interface InternalStore\n  extends InternalAtoms,\n    UseShuttleVirtualizedT,\n    StoreConstants,\n    ReturnType<typeof useAutoCalculated> {}\nexport interface PropsStore extends DSShuttleV2T.InternalProps {\n  set: StoreApi<PropsStore>['setState'];\n}\n\nconst internalStoreCreatorFunc = (autoCalculatedData: ReturnType<typeof useAutoCalculated>) =>\n  create<InternalStore>((set, get) => {\n    const constants: StoreConstants = {\n      set,\n    };\n    const internalAtoms: InternalAtoms = {\n      focusRegion: '',\n      setFocusRegion: (focusRegion) => {\n        if (typeof focusRegion === 'function') set({ focusRegion: focusRegion(get().focusRegion, get()) });\n        else set({ focusRegion });\n      },\n      focusItem: '',\n      setFocusItem: (focusItem) => {\n        if (typeof focusItem === 'function') set({ focusItem: focusItem(get().focusItem, get()) });\n        else set({ focusItem });\n      },\n      focusItemAction: '',\n      setFocusItemAction: (focusItemAction) => {\n        if (typeof focusItemAction === 'function')\n          set({ focusItemAction: focusItemAction(get().focusItemAction, get()) });\n        else set({ focusItemAction });\n      },\n      dropIndicatorPosition: 0,\n      setDropIndicatorPosition: (dropIndicatorPosition) => set({ dropIndicatorPosition }),\n      overId: '',\n      setOverId: (overId) => set({ overId }),\n      lastActiveId: '',\n      setLastActiveId: (lastActiveId) => set({ lastActiveId }),\n      isDropValid: false,\n      setIsDropValid: (isDropValid) => set({ isDropValid }),\n    };\n\n    return {\n      ...constants,\n      ...internalAtoms,\n      ...autoCalculatedData,\n    };\n  });\nconst propsStoreCreatorFunc = (propsWithDefaults: DSShuttleV2T.InternalProps) =>\n  create<PropsStore>((set) => ({\n    set,\n    ...propsWithDefaults,\n  }));\n\nconst {\n  Provider: InternalProvider,\n  useStore: useInternalStore,\n  useStoreApi: useInternalStoreApi,\n} = createContext<ReturnType<typeof internalStoreCreatorFunc>>();\nconst {\n  Provider: PropsProvider,\n  useStore: usePropsStore,\n  useStoreApi: usePropsStoreApi,\n} = createContext<ReturnType<typeof propsStoreCreatorFunc>>();\n\nconst useShuttleV2InternalStoreConfig = (propsFromUser: DSShuttleV2T.Props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSShuttleV2T.InternalProps>(propsFromUser, defaultProps);\n  const autoCalculatedData = useAutoCalculated(propsWithDefaults);\n  return useCallback(() => internalStoreCreatorFunc(autoCalculatedData), [autoCalculatedData]);\n};\nconst useShuttleV2PropsStoreConfig = (propsFromUser: DSShuttleV2T.Props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSShuttleV2T.InternalProps>(propsFromUser, defaultProps);\n\n  return useCallback(() => propsStoreCreatorFunc(propsWithDefaults), [propsWithDefaults]);\n};\n\nexport {\n  useInternalStore,\n  usePropsStore,\n  useInternalStoreApi,\n  usePropsStoreApi,\n  InternalProvider,\n  PropsProvider,\n  useShuttleV2InternalStoreConfig,\n  useShuttleV2PropsStoreConfig,\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,mBAAmB;AAC5B,OAAO,YAA+B;AACtC,OAAO,mBAAmB;AAC1B,SAAS,oCAAoC;AAE7C,SAA4B,oBAAoB;AAEhD,SAAS,yBAAyB;AA2ClC,MAAM,2BAA2B,CAAC,uBAChC,OAAsB,CAAC,KAAK,QAAQ;AAClC,QAAM,YAA4B;AAAA,IAChC;AAAA,EACF;AACA,QAAM,gBAA+B;AAAA,IACnC,aAAa;AAAA,IACb,gBAAgB,CAAC,gBAAgB;AAC/B,UAAI,OAAO,gBAAgB;AAAY,YAAI,EAAE,aAAa,YAAY,IAAI,EAAE,aAAa,IAAI,CAAC,EAAE,CAAC;AAAA;AAC5F,YAAI,EAAE,YAAY,CAAC;AAAA,IAC1B;AAAA,IACA,WAAW;AAAA,IACX,cAAc,CAAC,cAAc;AAC3B,UAAI,OAAO,cAAc;AAAY,YAAI,EAAE,WAAW,UAAU,IAAI,EAAE,WAAW,IAAI,CAAC,EAAE,CAAC;AAAA;AACpF,YAAI,EAAE,UAAU,CAAC;AAAA,IACxB;AAAA,IACA,iBAAiB;AAAA,IACjB,oBAAoB,CAAC,oBAAoB;AACvC,UAAI,OAAO,oBAAoB;AAC7B,YAAI,EAAE,iBAAiB,gBAAgB,IAAI,EAAE,iBAAiB,IAAI,CAAC,EAAE,CAAC;AAAA;AACnE,YAAI,EAAE,gBAAgB,CAAC;AAAA,IAC9B;AAAA,IACA,uBAAuB;AAAA,IACvB,0BAA0B,CAAC,0BAA0B,IAAI,EAAE,sBAAsB,CAAC;AAAA,IAClF,QAAQ;AAAA,IACR,WAAW,CAAC,WAAW,IAAI,EAAE,OAAO,CAAC;AAAA,IACrC,cAAc;AAAA,IACd,iBAAiB,CAAC,iBAAiB,IAAI,EAAE,aAAa,CAAC;AAAA,IACvD,aAAa;AAAA,IACb,gBAAgB,CAAC,gBAAgB,IAAI,EAAE,YAAY,CAAC;AAAA,EACtD;AAEA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AACF,CAAC;AACH,MAAM,wBAAwB,CAAC,sBAC7B,OAAmB,CAAC,SAAS;AAAA,EAC3B;AAAA,EACA,GAAG;AACL,EAAE;AAEJ,MAAM;AAAA,EACJ,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AACf,IAAI,cAA2D;AAC/D,MAAM;AAAA,EACJ,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AACf,IAAI,cAAwD;AAE5D,MAAM,kCAAkC,CAAC,kBAAsC;AAC7E,QAAM,oBAAoB,6BAAyD,eAAe,YAAY;AAC9G,QAAM,qBAAqB,kBAAkB,iBAAiB;AAC9D,SAAO,YAAY,MAAM,yBAAyB,kBAAkB,GAAG,CAAC,kBAAkB,CAAC;AAC7F;AACA,MAAM,+BAA+B,CAAC,kBAAsC;AAC1E,QAAM,oBAAoB,6BAAyD,eAAe,YAAY;AAE9G,SAAO,YAAY,MAAM,sBAAsB,iBAAiB,GAAG,CAAC,iBAAiB,CAAC;AACxF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useCallback } from 'react';\nimport create, { type StoreApi } from 'zustand';\nimport createContext from 'zustand/context';\n// import { subscribeWithSelector } from 'zustand/middleware';\nimport { useMemoMergePropsWithDefault } from '@elliemae/ds-utilities';\nimport { type DSShuttleV2T, defaultProps } from '../../react-desc-prop-types';\nimport type { REGIONS_FOCUSES, ACTIONS_FOCUSES, ITEMS_FOCUSES } from '../../constants';\nimport { configureAutoCalculated } from '../configureAutoCalculated';\n\ntype FocusRegion = typeof REGIONS_FOCUSES[keyof typeof REGIONS_FOCUSES];\ntype FocusRegionSetter = (newVal: FocusRegion | ((arg: FocusRegion, store: InternalStore) => FocusRegion)) => void;\n\ntype FocusItem = Omit<typeof ITEMS_FOCUSES[keyof typeof ITEMS_FOCUSES], 'GET_SPECIFIC_ITEM'> & string;\ntype FocusItemSetter = (newVal: FocusItem | ((arg: FocusItem, store: InternalStore) => FocusItem)) => void;\n\ntype FocusItemAction = typeof ACTIONS_FOCUSES[keyof typeof ACTIONS_FOCUSES];\ntype FocusItemActionSetter = (\n  newVal: FocusItemAction | ((arg: FocusItemAction, store: InternalStore) => FocusItemAction),\n) => void;\n\nexport interface InternalAtoms {\n  focusRegion: FocusRegion;\n  setFocusRegion: FocusRegionSetter;\n  focusItem: FocusItem;\n  setFocusItem: FocusItemSetter;\n  focusItemAction: FocusItemAction;\n  setFocusItemAction: FocusItemActionSetter;\n}\nexport interface StoreConstants {\n  set: StoreApi<InternalStore>['setState'];\n}\n\nexport interface InternalStore extends InternalAtoms, StoreConstants, ReturnType<typeof configureAutoCalculated> {}\nexport interface PropsStore extends DSShuttleV2T.InternalProps {\n  set: StoreApi<PropsStore>['setState'];\n}\n\nconst internalStoreCreatorFunc = (propsWithDefaults: DSShuttleV2T.InternalProps) =>\n  create<InternalStore>((set, get) => {\n    const constants: StoreConstants = {\n      set,\n    };\n    const internalAtoms: InternalAtoms = {\n      focusRegion: '',\n      setFocusRegion: (focusRegion) => {\n        if (typeof focusRegion === 'function') set({ focusRegion: focusRegion(get().focusRegion, get()) });\n        else set({ focusRegion });\n      },\n      focusItem: '',\n      setFocusItem: (focusItem) => {\n        if (typeof focusItem === 'function') set({ focusItem: focusItem(get().focusItem, get()) });\n        else set({ focusItem });\n      },\n      focusItemAction: '',\n      setFocusItemAction: (focusItemAction) => {\n        if (typeof focusItemAction === 'function')\n          set({ focusItemAction: focusItemAction(get().focusItemAction, get()) });\n        else set({ focusItemAction });\n      },\n    };\n\n    return {\n      ...constants,\n      ...internalAtoms,\n      ...configureAutoCalculated(propsWithDefaults),\n    };\n  });\nconst propsStoreCreatorFunc = (propsWithDefaults: DSShuttleV2T.InternalProps) =>\n  create<PropsStore>((set) => ({\n    set,\n    ...propsWithDefaults,\n  }));\n\nconst {\n  Provider: InternalProvider,\n  useStore: useInternalStore,\n  useStoreApi: useInternalStoreApi,\n} = createContext<ReturnType<typeof internalStoreCreatorFunc>>();\nconst {\n  Provider: PropsProvider,\n  useStore: usePropsStore,\n  useStoreApi: usePropsStoreApi,\n} = createContext<ReturnType<typeof propsStoreCreatorFunc>>();\n\nconst useShuttleV2InternalStoreConfig = (propsFromUser: DSShuttleV2T.Props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSShuttleV2T.InternalProps>(propsFromUser, defaultProps);\n\n  return useCallback(() => internalStoreCreatorFunc(propsWithDefaults), [propsWithDefaults]);\n};\nconst useShuttleV2PropsStoreConfig = (propsFromUser: DSShuttleV2T.Props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSShuttleV2T.InternalProps>(propsFromUser, defaultProps);\n\n  return useCallback(() => propsStoreCreatorFunc(propsWithDefaults), [propsWithDefaults]);\n};\n\nexport {\n  useInternalStore,\n  usePropsStore,\n  useInternalStoreApi,\n  usePropsStoreApi,\n  InternalProvider,\n  PropsProvider,\n  useShuttleV2InternalStoreConfig,\n  useShuttleV2PropsStoreConfig,\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,mBAAmB;AAC5B,OAAO,YAA+B;AACtC,OAAO,mBAAmB;AAE1B,SAAS,oCAAoC;AAC7C,SAA4B,oBAAoB;AAEhD,SAAS,+BAA+B;AA8BxC,MAAM,2BAA2B,CAAC,sBAChC,OAAsB,CAAC,KAAK,QAAQ;AAClC,QAAM,YAA4B;AAAA,IAChC;AAAA,EACF;AACA,QAAM,gBAA+B;AAAA,IACnC,aAAa;AAAA,IACb,gBAAgB,CAAC,gBAAgB;AAC/B,UAAI,OAAO,gBAAgB;AAAY,YAAI,EAAE,aAAa,YAAY,IAAI,EAAE,aAAa,IAAI,CAAC,EAAE,CAAC;AAAA;AAC5F,YAAI,EAAE,YAAY,CAAC;AAAA,IAC1B;AAAA,IACA,WAAW;AAAA,IACX,cAAc,CAAC,cAAc;AAC3B,UAAI,OAAO,cAAc;AAAY,YAAI,EAAE,WAAW,UAAU,IAAI,EAAE,WAAW,IAAI,CAAC,EAAE,CAAC;AAAA;AACpF,YAAI,EAAE,UAAU,CAAC;AAAA,IACxB;AAAA,IACA,iBAAiB;AAAA,IACjB,oBAAoB,CAAC,oBAAoB;AACvC,UAAI,OAAO,oBAAoB;AAC7B,YAAI,EAAE,iBAAiB,gBAAgB,IAAI,EAAE,iBAAiB,IAAI,CAAC,EAAE,CAAC;AAAA;AACnE,YAAI,EAAE,gBAAgB,CAAC;AAAA,IAC9B;AAAA,EACF;AAEA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG,wBAAwB,iBAAiB;AAAA,EAC9C;AACF,CAAC;AACH,MAAM,wBAAwB,CAAC,sBAC7B,OAAmB,CAAC,SAAS;AAAA,EAC3B;AAAA,EACA,GAAG;AACL,EAAE;AAEJ,MAAM;AAAA,EACJ,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AACf,IAAI,cAA2D;AAC/D,MAAM;AAAA,EACJ,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AACf,IAAI,cAAwD;AAE5D,MAAM,kCAAkC,CAAC,kBAAsC;AAC7E,QAAM,oBAAoB,6BAAyD,eAAe,YAAY;AAE9G,SAAO,YAAY,MAAM,yBAAyB,iBAAiB,GAAG,CAAC,iBAAiB,CAAC;AAC3F;AACA,MAAM,+BAA+B,CAAC,kBAAsC;AAC1E,QAAM,oBAAoB,6BAAyD,eAAe,YAAY;AAE9G,SAAO,YAAY,MAAM,sBAAsB,iBAAiB,GAAG,CAAC,iBAAiB,CAAC;AACxF;",
   "names": []
 }

package/dist/esm/constants/index.js

@@ -26,12 +26,8 @@ const ITEMS_FOCUSES = {
   GET_SPECIFIC_ITEM: ({ id }) => id,
   RESET: ""
 };
-const DATA_TESTID = {
-  SHUTTLE_DRAG_HANDLE: "shuttle-drag-handle"
-};
 export {
   ACTIONS_FOCUSES,
-  DATA_TESTID,
   ITEMS_FOCUSES,
   REGIONS_FOCUSES
 };

package/dist/esm/constants/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/constants/index.ts"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const REGIONS_FOCUSES = {\n  SOURCE_HEADER: 'source-header',\n  SOURCE_PANEL: 'source-panel',\n  SOURCE_PANEL_ITEM: 'source-panel-item',\n  SOURCE_PANEL_ITEM_MOVE_ALL: 'source-panel-move-all',\n  SOURCE_BOTTOM: 'source-bottom',\n  DESTINATION_HEADER: 'destination-header',\n  DESTINATION_PANEL: 'destination-panel',\n  DESTINATION_PANEL_ITEM: 'destination-panel-item',\n  DESTINATION_PANEL_ITEM_MOVE_ALL: 'destination-panel-move-all',\n  DESTINATION_BOTTOM: 'destination-bottom',\n  RESET: '',\n} as const;\n\nexport const ACTIONS_FOCUSES = {\n  MOVE_BTN: 'move-btn',\n  DRILLDOWN_BTN: 'drilldown-btn',\n  DRAG_N_DROP: 'drag-n-drop',\n  PARENT: 'parent',\n  RESET: '',\n} as const;\n\nexport const ITEMS_FOCUSES = {\n  FIRST: 'first',\n  LAST: 'last',\n  LOAD_MORE_BTN: 'load-more-btn',\n  GET_SPECIFIC_ITEM: ({ id }: { id: string }) => id,\n  RESET: '',\n} as const;\n\nexport const DATA_TESTID = {\n  SHUTTLE_DRAG_HANDLE: 'shuttle-drag-handle',\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,kBAAkB;AAAA,EAC7B,eAAe;AAAA,EACf,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,4BAA4B;AAAA,EAC5B,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,mBAAmB;AAAA,EACnB,wBAAwB;AAAA,EACxB,iCAAiC;AAAA,EACjC,oBAAoB;AAAA,EACpB,OAAO;AACT;AAEO,MAAM,kBAAkB;AAAA,EAC7B,UAAU;AAAA,EACV,eAAe;AAAA,EACf,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,OAAO;AACT;AAEO,MAAM,gBAAgB;AAAA,EAC3B,OAAO;AAAA,EACP,MAAM;AAAA,EACN,eAAe;AAAA,EACf,mBAAmB,CAAC,EAAE,GAAG,MAAsB;AAAA,EAC/C,OAAO;AACT;AAEO,MAAM,cAAc;AAAA,EACzB,qBAAqB;AACvB;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const REGIONS_FOCUSES = {\n  SOURCE_HEADER: 'source-header',\n  SOURCE_PANEL: 'source-panel',\n  SOURCE_PANEL_ITEM: 'source-panel-item',\n  SOURCE_PANEL_ITEM_MOVE_ALL: 'source-panel-move-all',\n  SOURCE_BOTTOM: 'source-bottom',\n  DESTINATION_HEADER: 'destination-header',\n  DESTINATION_PANEL: 'destination-panel',\n  DESTINATION_PANEL_ITEM: 'destination-panel-item',\n  DESTINATION_PANEL_ITEM_MOVE_ALL: 'destination-panel-move-all',\n  DESTINATION_BOTTOM: 'destination-bottom',\n  RESET: '',\n} as const;\n\nexport const ACTIONS_FOCUSES = {\n  MOVE_BTN: 'move-btn',\n  DRILLDOWN_BTN: 'drilldown-btn',\n  DRAG_N_DROP: 'drag-n-drop',\n  PARENT: 'parent',\n  RESET: '',\n} as const;\n\nexport const ITEMS_FOCUSES = {\n  FIRST: 'first',\n  LAST: 'last',\n  LOAD_MORE_BTN: 'load-more-btn',\n  GET_SPECIFIC_ITEM: ({ id }: { id: string }) => id,\n  RESET: '',\n} as const;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,kBAAkB;AAAA,EAC7B,eAAe;AAAA,EACf,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,4BAA4B;AAAA,EAC5B,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,mBAAmB;AAAA,EACnB,wBAAwB;AAAA,EACxB,iCAAiC;AAAA,EACjC,oBAAoB;AAAA,EACpB,OAAO;AACT;AAEO,MAAM,kBAAkB;AAAA,EAC7B,UAAU;AAAA,EACV,eAAe;AAAA,EACf,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,OAAO;AACT;AAEO,MAAM,gBAAgB;AAAA,EAC3B,OAAO;AAAA,EACP,MAAM;AAAA,EACN,eAAe;AAAA,EACf,mBAAmB,CAAC,EAAE,GAAG,MAAsB;AAAA,EAC/C,OAAO;AACT;",
   "names": []
 }

package/dist/esm/index.js

@@ -1,10 +1,6 @@
 import * as React from "react";
-import { DSShuttleV2Name, DSShuttleV2Slots, DSShuttleV2DataTestIds } from "./config/DSShuttleV2Definitions";
 import { DSShuttleV2 } from "./DSShuttleV2";
 export {
-  DSShuttleV2,
-  DSShuttleV2DataTestIds,
-  DSShuttleV2Name,
-  DSShuttleV2Slots
+  DSShuttleV2
 };
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.ts"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type {} from 'react-virtual';\nexport { DSShuttleV2Name, DSShuttleV2Slots, DSShuttleV2DataTestIds } from './config/DSShuttleV2Definitions';\nexport { DSShuttleV2 } from './DSShuttleV2';\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,iBAAiB,kBAAkB,8BAA8B;AAC1E,SAAS,mBAAmB;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { DSShuttleV2 } from './DSShuttleV2';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,mBAAmB;",
   "names": []
 }

package/dist/esm/parts/Header.js

@@ -7,10 +7,9 @@ import {
   DSButtonV2
 } from "@elliemae/ds-button";
 import { styled } from "@elliemae/ds-system";
-import { DSShuttleV2Name, DSShuttleV2Slots } from "../config/DSShuttleV2Definitions";
 import { usePropsStore } from "../config/useStore";
 import { useFocusTracker } from "../config/useFocusTracker";
-const StyledIconButton = styled(DSButtonV2, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.HEADER_SEARCH_ICON })`
+const StyledIconButton = styled(DSButtonV2, { name: "ds-shuttle-v2", slot: "header-search-icon" })`
   width: 16px;
   height: 16px;
 `;

package/dist/esm/parts/Header.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/Header.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { Search } from '@elliemae/ds-icons';\nimport {\n  DSButtonV2,\n  type DSButtonT,\n  // BUTTON_SIZES\n} from '@elliemae/ds-button';\nimport { styled } from '@elliemae/ds-system';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../config/DSShuttleV2Definitions';\nimport { usePropsStore } from '../config/useStore';\nimport { useFocusTracker } from '../config/useFocusTracker';\nimport { type DSShuttleV2T } from '../react-desc-prop-types';\n\nconst StyledIconButton = styled(DSButtonV2, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.HEADER_SEARCH_ICON })`\n  width: 16px;\n  height: 16px;\n`;\nexport const Header = React.memo(({ isDestinationPanel }: DSShuttleV2T.PanelMetaInfo) => {\n  const HeaderRenderer = usePropsStore((state) => (isDestinationPanel ? state.DestinationHeader : state.SourceHeader));\n  const onSearchBarOpen = usePropsStore((state) =>\n    isDestinationPanel ? state.onDesinationOpenSearchbar : state.onSourceOpenSearchbar,\n  );\n  const isSearchBarOpen = usePropsStore((state) =>\n    isDestinationPanel ? state.destinationShowSearchbar : state.sourceShowSearchbar,\n  );\n  const { trackFocusRegionHeader, trackFocusItemReset, trackFocusActionReset } = useFocusTracker();\n  const onHeaderFocus = React.useCallback(() => {\n    trackFocusRegionHeader(isDestinationPanel);\n    trackFocusItemReset();\n    trackFocusActionReset();\n  }, [isDestinationPanel, trackFocusActionReset, trackFocusItemReset, trackFocusRegionHeader]);\n\n  const handleFilterClick = React.useCallback(\n    (event: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => {\n      onSearchBarOpen?.(!isSearchBarOpen, { event });\n    },\n    [isSearchBarOpen, onSearchBarOpen],\n  );\n\n  const cols = React.useMemo(() => {\n    const finalCols = ['1fr'];\n    if (onSearchBarOpen) finalCols.push('auto');\n    return finalCols;\n  }, [onSearchBarOpen]);\n\n  return (\n    <Grid onFocus={onHeaderFocus} cols={cols}>\n      <HeaderRenderer />\n      {onSearchBarOpen ? (\n        <StyledIconButton buttonType=\"icon\" onClick={handleFilterClick}>\n          <Search width=\"14px\" height=\"14px\" />\n        </StyledIconButton>\n      ) : null}\n    </Grid>\n  );\n});\n"],
-  "mappings": "AAAA,YAAY,WAAW;AC+CnB,SACE,KADF;AA/CJ,OAAOA,YAAW;AAClB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,OAGK;AACP,SAAS,cAAc;AACvB,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;AAGhC,MAAM,mBAAmB,OAAO,YAAY,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,mBAAmB,CAAC;AAAA;AAAA;AAAA;AAIzG,MAAM,SAASA,OAAM,KAAK,CAAC,EAAE,mBAAmB,MAAkC;AACvF,QAAM,iBAAiB,cAAc,CAAC,UAAW,qBAAqB,MAAM,oBAAoB,MAAM,YAAa;AACnH,QAAM,kBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,kBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,2BAA2B,MAAM;AAAA,EAC9D;AACA,QAAM,EAAE,wBAAwB,qBAAqB,sBAAsB,IAAI,gBAAgB;AAC/F,QAAM,gBAAgBA,OAAM,YAAY,MAAM;AAC5C,2BAAuB,kBAAkB;AACzC,wBAAoB;AACpB,0BAAsB;AAAA,EACxB,GAAG,CAAC,oBAAoB,uBAAuB,qBAAqB,sBAAsB,CAAC;AAE3F,QAAM,oBAAoBA,OAAM;AAAA,IAC9B,CAAC,UAA+D;AAC9D,wBAAkB,CAAC,iBAAiB,EAAE,MAAM,CAAC;AAAA,IAC/C;AAAA,IACA,CAAC,iBAAiB,eAAe;AAAA,EACnC;AAEA,QAAM,OAAOA,OAAM,QAAQ,MAAM;AAC/B,UAAM,YAAY,CAAC,KAAK;AACxB,QAAI;AAAiB,gBAAU,KAAK,MAAM;AAC1C,WAAO;AAAA,EACT,GAAG,CAAC,eAAe,CAAC;AAEpB,SACE,qBAAC,QAAK,SAAS,eAAe,MAC5B;AAAA,wBAAC,kBAAe;AAAA,IACf,kBACC,oBAAC,oBAAiB,YAAW,QAAO,SAAS,mBAC3C,8BAAC,UAAO,OAAM,QAAO,QAAO,QAAO,GACrC,IACE;AAAA,KACN;AAEJ,CAAC;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { Search } from '@elliemae/ds-icons';\nimport {\n  DSButtonV2,\n  type DSButtonT,\n  // BUTTON_SIZES\n} from '@elliemae/ds-button';\nimport { styled } from '@elliemae/ds-system';\nimport { usePropsStore } from '../config/useStore';\nimport { useFocusTracker } from '../config/useFocusTracker';\nimport { type DSShuttleV2T } from '../react-desc-prop-types';\nconst StyledIconButton = styled(DSButtonV2, { name: 'ds-shuttle-v2', slot: 'header-search-icon' })`\n  width: 16px;\n  height: 16px;\n`;\nexport const Header = React.memo(({ isDestinationPanel }: DSShuttleV2T.PanelMetaInfo) => {\n  const HeaderRenderer = usePropsStore((state) => (isDestinationPanel ? state.DestinationHeader : state.SourceHeader));\n  const onSearchBarOpen = usePropsStore((state) =>\n    isDestinationPanel ? state.onDesinationOpenSearchbar : state.onSourceOpenSearchbar,\n  );\n  const isSearchBarOpen = usePropsStore((state) =>\n    isDestinationPanel ? state.destinationShowSearchbar : state.sourceShowSearchbar,\n  );\n  const { trackFocusRegionHeader, trackFocusItemReset, trackFocusActionReset } = useFocusTracker();\n  const onHeaderFocus = React.useCallback(() => {\n    trackFocusRegionHeader(isDestinationPanel);\n    trackFocusItemReset();\n    trackFocusActionReset();\n  }, [isDestinationPanel, trackFocusActionReset, trackFocusItemReset, trackFocusRegionHeader]);\n\n  const handleFilterClick = React.useCallback(\n    (event: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => {\n      onSearchBarOpen?.(!isSearchBarOpen, { event });\n    },\n    [isSearchBarOpen, onSearchBarOpen],\n  );\n\n  const cols = React.useMemo(() => {\n    const finalCols = ['1fr'];\n    if (onSearchBarOpen) finalCols.push('auto');\n    return finalCols;\n  }, [onSearchBarOpen]);\n\n  return (\n    <Grid onFocus={onHeaderFocus} cols={cols}>\n      <HeaderRenderer />\n      {onSearchBarOpen ? (\n        <StyledIconButton buttonType=\"icon\" onClick={handleFilterClick}>\n          <Search width=\"14px\" height=\"14px\" />\n        </StyledIconButton>\n      ) : null}\n    </Grid>\n  );\n});\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC6CnB,SACE,KADF;AA7CJ,OAAOA,YAAW;AAClB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,OAGK;AACP,SAAS,cAAc;AACvB,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;AAEhC,MAAM,mBAAmB,OAAO,YAAY,EAAE,MAAM,iBAAiB,MAAM,qBAAqB,CAAC;AAAA;AAAA;AAAA;AAI1F,MAAM,SAASA,OAAM,KAAK,CAAC,EAAE,mBAAmB,MAAkC;AACvF,QAAM,iBAAiB,cAAc,CAAC,UAAW,qBAAqB,MAAM,oBAAoB,MAAM,YAAa;AACnH,QAAM,kBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,kBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,2BAA2B,MAAM;AAAA,EAC9D;AACA,QAAM,EAAE,wBAAwB,qBAAqB,sBAAsB,IAAI,gBAAgB;AAC/F,QAAM,gBAAgBA,OAAM,YAAY,MAAM;AAC5C,2BAAuB,kBAAkB;AACzC,wBAAoB;AACpB,0BAAsB;AAAA,EACxB,GAAG,CAAC,oBAAoB,uBAAuB,qBAAqB,sBAAsB,CAAC;AAE3F,QAAM,oBAAoBA,OAAM;AAAA,IAC9B,CAAC,UAA+D;AAC9D,wBAAkB,CAAC,iBAAiB,EAAE,MAAM,CAAC;AAAA,IAC/C;AAAA,IACA,CAAC,iBAAiB,eAAe;AAAA,EACnC;AAEA,QAAM,OAAOA,OAAM,QAAQ,MAAM;AAC/B,UAAM,YAAY,CAAC,KAAK;AACxB,QAAI;AAAiB,gBAAU,KAAK,MAAM;AAC1C,WAAO;AAAA,EACT,GAAG,CAAC,eAAe,CAAC;AAEpB,SACE,qBAAC,QAAK,SAAS,eAAe,MAC5B;AAAA,wBAAC,kBAAe;AAAA,IACf,kBACC,oBAAC,oBAAiB,YAAW,QAAO,SAAS,mBAC3C,8BAAC,UAAO,OAAM,QAAO,QAAO,QAAO,GACrC,IACE;AAAA,KACN;AAEJ,CAAC;",
   "names": ["React"]
 }

package/dist/esm/parts/Item/Item.js

@@ -1,10 +1,8 @@
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import React2, { useMemo } from "react";
-import { styled, css } from "@elliemae/ds-system";
-import { mergeRefs } from "@elliemae/ds-utilities";
+import React2 from "react";
+import { styled } from "@elliemae/ds-system";
 import { Grid } from "@elliemae/ds-grid";
-import { DSShuttleV2Name, DSShuttleV2Slots } from "../../config/DSShuttleV2Definitions";
 import { useInternalStore } from "../../config/useStore";
 import { useFocusTracker } from "../../config/useFocusTracker";
 import { ItemSelection } from "./ItemSelection";
@@ -13,40 +11,21 @@ import { ItemMiddleSection } from "./ItemMiddleSection";
 import { useSelectionLogic } from "./useSelectionLogic";
 import { useItemArrowNavigation } from "./useItemArrowNavigation";
 import { REGIONS_FOCUSES } from "../../constants";
-import { DragHandle } from "../Dnd/DndHandle";
-import { DropIndicator } from "../Dnd/DropIndicator";
-import { withConditionalUseSortable } from "../HoC/withConditionalUseSortable";
-import { useInnerRefHandlers as useInnerRefActionHandlers } from "./ItemActions/useInnerRefHandlers";
-const cssDisabled = css`
-  background-color: ${({ theme }) => theme.colors.neutral["100"]};
-  color: ${({ theme }) => theme.colors.neutral["300"]};
-  .ds-shuttle-v2-item-action-btn-to-source-icon > svg,
-  .ds-shuttle-v2-item-action-btn-to-destination-icon > svg,
-  .ds-shuttle-v2-item-action-btn-drilldown-icon > svg {
-    fill: ${({ theme }) => theme.colors.neutral["300"]};
-  }
-`;
-const ItemWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_WRAPPER })`
+const ItemWrapper = styled(Grid, { name: "ds-shuttle-v2", slot: "item-wrapper" })`
   min-height: 36px;
-  position: relative;
-  background-color: white;
-  &:hover {
-    background-color: ${({ isDndActive, theme }) => !isDndActive ? theme.colors.brand["200"] : "white"};
+  :hover {
+    background-color: brand-200;
     .ds-shuttle-v2-item-action-btn-to-source-icon > svg,
     .ds-shuttle-v2-item-action-btn-to-destination-icon > svg,
     .ds-shuttle-v2-item-action-btn-drilldown-icon > svg {
       fill: brand-700;
     }
-    ${({ isDragging }) => isDragging && cssDisabled}
   }
-
-  &:focus {
+  :focus {
     outline: 2px solid brand-700;
     outline-offset: -2px;
   }
   border-bottom: 1px solid neutral-100;
-
-  ${({ isDragging }) => isDragging && cssDisabled}
 `;
 const useInnerRefHandlers = ({ item, isDestinationPanel }) => {
   const { isFirst, isLast } = item;
@@ -71,79 +50,47 @@ const useInnerRefHandlers = ({ item, isDestinationPanel }) => {
   );
   return React2.useMemo(() => ({ shouldFocus, innerRefHandlerParentItem }), [shouldFocus, innerRefHandlerParentItem]);
 };
+const cols = ["5px", "1fr", "auto"];
 const Item = React2.memo((itemMeta) => {
-  const { item, withDragNDrop, useSortableHelpers } = itemMeta;
+  const { item } = itemMeta;
   const { original, isSelected } = item;
   const { id } = original;
-  const cols = useMemo(() => {
-    if (withDragNDrop)
-      return ["5px", "auto", "1fr", "auto"];
-    return ["5px", "1fr", "auto"];
-  }, [withDragNDrop]);
-  const dndActiveId = useInternalStore((state) => state.lastActiveId);
-  const isActive = useMemo(() => dndActiveId !== "", [dndActiveId]);
   const selectItem = useSelectionLogic(itemMeta);
   const { onItemContainerKeyDown } = useItemArrowNavigation(itemMeta);
   const handleItemKeyDown = React2.useCallback(
     (event) => {
       const { key } = event;
       if (["Spacebar", " ", "Enter"].includes(key)) {
-        if (isActive || event.target.id === `${id}-drag-handle`) {
-          event.preventDefault();
-          return;
-        }
         event.preventDefault();
         event.stopPropagation();
         selectItem(event);
       }
       onItemContainerKeyDown(event);
     },
-    [isActive, id, onItemContainerKeyDown, selectItem]
+    [onItemContainerKeyDown, selectItem]
   );
   const { shouldFocus, innerRefHandlerParentItem } = useInnerRefHandlers(itemMeta);
-  const { innerRefHandlerDnd } = useInnerRefActionHandlers(itemMeta);
-  const overId = useInternalStore((state) => state.overId);
-  const isDropValid = useInternalStore((state) => state.isDropValid);
-  const dropIndicatorPosition = useInternalStore((state) => state.dropIndicatorPosition);
-  const showDropIndicatorPosition = id === overId && dropIndicatorPosition;
   return /* @__PURE__ */ jsxs(
     ItemWrapper,
     {
-      isDragging: dndActiveId === id,
-      isDndActive: isActive,
       cols,
       alignItems: "center",
       onClick: selectItem,
-      ref: mergeRefs(innerRefHandlerParentItem, useSortableHelpers?.setNodeRef),
       onKeyDown: handleItemKeyDown,
+      ref: innerRefHandlerParentItem,
       tabIndex: shouldFocus ? 0 : -1,
       role: "checkbox",
       "aria-checked": isSelected,
-      id: `${id}-wrapper`,
+      id,
       children: [
         /* @__PURE__ */ jsx(ItemSelection, { ...itemMeta }),
-        withDragNDrop ? /* @__PURE__ */ jsx(
-          DragHandle,
-          {
-            id,
-            useSortableHelpers,
-            isDndActive: !!isActive,
-            isDragging: dndActiveId === id,
-            innerRef: innerRefHandlerDnd
-          }
-        ) : null,
         /* @__PURE__ */ jsx(ItemMiddleSection, { ...itemMeta }),
-        /* @__PURE__ */ jsx(ItemActions, { ...itemMeta }),
-        /* @__PURE__ */ jsx(DropIndicator, { vertical: false, dropIndicatorPosition: showDropIndicatorPosition, isDropValid })
+        /* @__PURE__ */ jsx(ItemActions, { ...itemMeta })
       ]
     }
   );
 });
-const ItemSortable = withConditionalUseSortable(Item);
-var Item_default = ItemSortable;
 export {
-  Item,
-  ItemSortable,
-  Item_default as default
+  Item
 };
 //# sourceMappingURL=Item.js.map

package/dist/esm/parts/Item/Item.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Item/Item.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport { styled, css } from '@elliemae/ds-system';\nimport { mergeRefs } from '@elliemae/ds-utilities';\n\nimport { Grid } from '@elliemae/ds-grid';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../config/DSShuttleV2Definitions';\nimport { useInternalStore } from '../../config/useStore';\nimport { useFocusTracker } from '../../config/useFocusTracker';\nimport { ItemSelection } from './ItemSelection';\nimport { ItemActions } from './ItemActions';\nimport { ItemMiddleSection } from './ItemMiddleSection';\nimport { useSelectionLogic } from './useSelectionLogic';\nimport { useItemArrowNavigation } from './useItemArrowNavigation';\nimport { REGIONS_FOCUSES } from '../../constants';\nimport { DragHandle } from '../Dnd/DndHandle';\nimport { DropIndicator } from '../Dnd/DropIndicator';\nimport { withConditionalUseSortable } from '../HoC/withConditionalUseSortable';\nimport { useInnerRefHandlers as useInnerRefActionHandlers } from './ItemActions/useInnerRefHandlers';\n// we are using the class-name added via slot for the children `:hover` styling of icon colors\n\nconst cssDisabled = css`\n  background-color: ${({ theme }) => theme.colors.neutral['100']};\n  color: ${({ theme }) => theme.colors.neutral['300']};\n  .ds-shuttle-v2-item-action-btn-to-source-icon > svg,\n  .ds-shuttle-v2-item-action-btn-to-destination-icon > svg,\n  .ds-shuttle-v2-item-action-btn-drilldown-icon > svg {\n    fill: ${({ theme }) => theme.colors.neutral['300']};\n  }\n`;\n\ninterface ItemWrapperT {\n  isDragging: boolean;\n  isDndActive: boolean;\n}\n\nconst ItemWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_WRAPPER })<ItemWrapperT>`\n  min-height: 36px;\n  position: relative;\n  background-color: white;\n  &:hover {\n    background-color: ${({ isDndActive, theme }) => (!isDndActive ? theme.colors.brand['200'] : 'white')};\n    .ds-shuttle-v2-item-action-btn-to-source-icon > svg,\n    .ds-shuttle-v2-item-action-btn-to-destination-icon > svg,\n    .ds-shuttle-v2-item-action-btn-drilldown-icon > svg {\n      fill: brand-700;\n    }\n    ${({ isDragging }) => isDragging && cssDisabled}\n  }\n\n  &:focus {\n    outline: 2px solid brand-700;\n    outline-offset: -2px;\n  }\n  border-bottom: 1px solid neutral-100;\n\n  ${({ isDragging }) => isDragging && cssDisabled}\n`;\n\nconst useInnerRefHandlers = ({ item, isDestinationPanel }: DSShuttleV2T.ItemMeta) => {\n  const { isFirst, isLast } = item;\n  const { trackFocusItem } = useFocusTracker();\n  const focusRegion = useInternalStore((state) => state.focusRegion);\n  const focusItem = useInternalStore((state) => state.focusItem);\n  const focusItemAction = useInternalStore((state) => state.focusItemAction);\n  const currRegion = isDestinationPanel ? REGIONS_FOCUSES.DESTINATION_PANEL_ITEM : REGIONS_FOCUSES.SOURCE_PANEL_ITEM;\n  const currItemId = item.original.id;\n\n  const shouldFocus = React.useMemo(\n    () =>\n      focusRegion === currRegion &&\n      focusItemAction === 'parent' &&\n      (focusItem === currItemId || (isFirst && focusItem === 'first') || (isLast && focusItem === 'last')),\n    [currItemId, currRegion, focusItem, focusItemAction, focusRegion, isFirst, isLast],\n  );\n  const innerRefHandlerParentItem = React.useCallback(\n    (node: HTMLDivElement | null) => {\n      if (shouldFocus) {\n        node?.focus();\n        trackFocusItem(item); // this converts 'first'/'last' to actual id -> prevents 'last' to focus \"new last\" if new items are added\n      }\n    },\n    [item, shouldFocus, trackFocusItem],\n  );\n  return React.useMemo(() => ({ shouldFocus, innerRefHandlerParentItem }), [shouldFocus, innerRefHandlerParentItem]);\n};\n\nexport const Item = React.memo((itemMeta: DSShuttleV2T.ItemMeta) => {\n  const { item, withDragNDrop, useSortableHelpers } = itemMeta;\n  const { original, isSelected } = item;\n  const { id } = original;\n\n  const cols = useMemo(() => {\n    if (withDragNDrop) return ['5px', 'auto', '1fr', 'auto'];\n    return ['5px', '1fr', 'auto'];\n  }, [withDragNDrop]);\n\n  const dndActiveId = useInternalStore((state) => state.lastActiveId);\n  const isActive = useMemo(() => dndActiveId !== '', [dndActiveId]);\n\n  const selectItem = useSelectionLogic(itemMeta);\n  const { onItemContainerKeyDown } = useItemArrowNavigation(itemMeta);\n  const handleItemKeyDown: React.KeyboardEventHandler<HTMLDivElement> = React.useCallback(\n    (event) => {\n      const { key } = event;\n\n      // Spacebar AND ' ' are cross-browser compatibility thing\n      if (['Spacebar', ' ', 'Enter'].includes(key)) {\n        if (isActive || (event.target as HTMLElement).id === `${id}-drag-handle`) {\n          event.preventDefault();\n          return;\n        }\n        event.preventDefault();\n        event.stopPropagation();\n        selectItem(event);\n      }\n      onItemContainerKeyDown(event);\n    },\n    [isActive, id, onItemContainerKeyDown, selectItem],\n  );\n  const { shouldFocus, innerRefHandlerParentItem } = useInnerRefHandlers(itemMeta);\n  const { innerRefHandlerDnd } = useInnerRefActionHandlers(itemMeta);\n  const overId = useInternalStore((state) => state.overId);\n  const isDropValid = useInternalStore((state) => state.isDropValid);\n  const dropIndicatorPosition = useInternalStore((state) => state.dropIndicatorPosition);\n\n  const showDropIndicatorPosition = id === overId && dropIndicatorPosition;\n\n  return (\n    <ItemWrapper\n      isDragging={dndActiveId === id}\n      isDndActive={isActive}\n      cols={cols}\n      alignItems=\"center\"\n      onClick={selectItem}\n      ref={mergeRefs(innerRefHandlerParentItem, useSortableHelpers?.setNodeRef)}\n      onKeyDown={handleItemKeyDown}\n      tabIndex={shouldFocus ? 0 : -1}\n      role=\"checkbox\"\n      aria-checked={isSelected}\n      id={`${id}-wrapper`}\n    >\n      <ItemSelection {...itemMeta} />\n      {withDragNDrop ? (\n        <DragHandle\n          id={id}\n          useSortableHelpers={useSortableHelpers}\n          isDndActive={!!isActive}\n          isDragging={dndActiveId === id}\n          innerRef={innerRefHandlerDnd}\n        />\n      ) : null}\n      <ItemMiddleSection {...itemMeta} />\n      <ItemActions {...itemMeta} />\n      <DropIndicator vertical={false} dropIndicatorPosition={showDropIndicatorPosition} isDropValid={isDropValid} />\n    </ItemWrapper>\n  );\n});\n\nconst ItemSortable = withConditionalUseSortable(Item);\nexport { ItemSortable };\nexport default ItemSortable;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types';\nimport { useInternalStore } from '../../config/useStore';\nimport { useFocusTracker } from '../../config/useFocusTracker';\nimport { ItemSelection } from './ItemSelection';\nimport { ItemActions } from './ItemActions';\nimport { ItemMiddleSection } from './ItemMiddleSection';\nimport { useSelectionLogic } from './useSelectionLogic';\nimport { useItemArrowNavigation } from './useItemArrowNavigation';\nimport { REGIONS_FOCUSES } from '../../constants';\n\n// we are using the class-name added via slot for the children `:hover` styling of icon colors\nconst ItemWrapper = styled(Grid, { name: 'ds-shuttle-v2', slot: 'item-wrapper' })`\n  min-height: 36px;\n  :hover {\n    background-color: brand-200;\n    .ds-shuttle-v2-item-action-btn-to-source-icon > svg,\n    .ds-shuttle-v2-item-action-btn-to-destination-icon > svg,\n    .ds-shuttle-v2-item-action-btn-drilldown-icon > svg {\n      fill: brand-700;\n    }\n  }\n  :focus {\n    outline: 2px solid brand-700;\n    outline-offset: -2px;\n  }\n  border-bottom: 1px solid neutral-100;\n`;\n\nconst useInnerRefHandlers = ({ item, isDestinationPanel }: DSShuttleV2T.ItemMeta) => {\n  const { isFirst, isLast } = item;\n  const { trackFocusItem } = useFocusTracker();\n  const focusRegion = useInternalStore((state) => state.focusRegion);\n  const focusItem = useInternalStore((state) => state.focusItem);\n  const focusItemAction = useInternalStore((state) => state.focusItemAction);\n  const currRegion = isDestinationPanel ? REGIONS_FOCUSES.DESTINATION_PANEL_ITEM : REGIONS_FOCUSES.SOURCE_PANEL_ITEM;\n  const currItemId = item.original.id;\n\n  const shouldFocus = React.useMemo(\n    () =>\n      focusRegion === currRegion &&\n      focusItemAction === 'parent' &&\n      (focusItem === currItemId || (isFirst && focusItem === 'first') || (isLast && focusItem === 'last')),\n    [currItemId, currRegion, focusItem, focusItemAction, focusRegion, isFirst, isLast],\n  );\n  const innerRefHandlerParentItem = React.useCallback(\n    (node: HTMLDivElement) => {\n      if (shouldFocus) {\n        node?.focus();\n        trackFocusItem(item); // this converts 'first'/'last' to actual id -> prevents 'last' to focus \"new last\" if new items are added\n      }\n    },\n    [item, shouldFocus, trackFocusItem],\n  );\n  return React.useMemo(() => ({ shouldFocus, innerRefHandlerParentItem }), [shouldFocus, innerRefHandlerParentItem]);\n};\n\nconst cols = ['5px', '1fr', 'auto'];\nexport const Item = React.memo((itemMeta: DSShuttleV2T.ItemMeta) => {\n  const { item } = itemMeta;\n  const { original, isSelected } = item;\n  const { id } = original;\n\n  const selectItem = useSelectionLogic(itemMeta);\n  const { onItemContainerKeyDown } = useItemArrowNavigation(itemMeta);\n  const handleItemKeyDown: React.KeyboardEventHandler<HTMLDivElement> = React.useCallback(\n    (event) => {\n      const { key } = event;\n      // Spacebar AND ' ' are cross-browser compatibility thing\n      if (['Spacebar', ' ', 'Enter'].includes(key)) {\n        event.preventDefault();\n        event.stopPropagation();\n        selectItem(event);\n      }\n      onItemContainerKeyDown(event);\n    },\n    [onItemContainerKeyDown, selectItem],\n  );\n  const { shouldFocus, innerRefHandlerParentItem } = useInnerRefHandlers(itemMeta);\n\n  return (\n    <ItemWrapper\n      cols={cols}\n      alignItems=\"center\"\n      onClick={selectItem}\n      onKeyDown={handleItemKeyDown}\n      ref={innerRefHandlerParentItem}\n      tabIndex={shouldFocus ? 0 : -1}\n      role=\"checkbox\"\n      aria-checked={isSelected}\n      id={id}\n    >\n      <ItemSelection {...itemMeta} />\n      <ItemMiddleSection {...itemMeta} />\n      <ItemActions {...itemMeta} />\n    </ItemWrapper>\n  );\n});\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACmFnB,SAWE,KAXF;AAnFJ,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,qBAAqB;AAC9B,SAAS,mBAAmB;AAC5B,SAAS,yBAAyB;AAClC,SAAS,yBAAyB;AAClC,SAAS,8BAA8B;AACvC,SAAS,uBAAuB;AAGhC,MAAM,cAAc,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,eAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBhF,MAAM,sBAAsB,CAAC,EAAE,MAAM,mBAAmB,MAA6B;AACnF,QAAM,EAAE,SAAS,OAAO,IAAI;AAC5B,QAAM,EAAE,eAAe,IAAI,gBAAgB;AAC3C,QAAM,cAAc,iBAAiB,CAAC,UAAU,MAAM,WAAW;AACjE,QAAM,YAAY,iBAAiB,CAAC,UAAU,MAAM,SAAS;AAC7D,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AACzE,QAAM,aAAa,qBAAqB,gBAAgB,yBAAyB,gBAAgB;AACjG,QAAM,aAAa,KAAK,SAAS;AAEjC,QAAM,cAAcA,OAAM;AAAA,IACxB,MACE,gBAAgB,cAChB,oBAAoB,aACnB,cAAc,cAAe,WAAW,cAAc,WAAa,UAAU,cAAc;AAAA,IAC9F,CAAC,YAAY,YAAY,WAAW,iBAAiB,aAAa,SAAS,MAAM;AAAA,EACnF;AACA,QAAM,4BAA4BA,OAAM;AAAA,IACtC,CAAC,SAAyB;AACxB,UAAI,aAAa;AACf,cAAM,MAAM;AACZ,uBAAe,IAAI;AAAA,MACrB;AAAA,IACF;AAAA,IACA,CAAC,MAAM,aAAa,cAAc;AAAA,EACpC;AACA,SAAOA,OAAM,QAAQ,OAAO,EAAE,aAAa,0BAA0B,IAAI,CAAC,aAAa,yBAAyB,CAAC;AACnH;AAEA,MAAM,OAAO,CAAC,OAAO,OAAO,MAAM;AAC3B,MAAM,OAAOA,OAAM,KAAK,CAAC,aAAoC;AAClE,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,EAAE,UAAU,WAAW,IAAI;AACjC,QAAM,EAAE,GAAG,IAAI;AAEf,QAAM,aAAa,kBAAkB,QAAQ;AAC7C,QAAM,EAAE,uBAAuB,IAAI,uBAAuB,QAAQ;AAClE,QAAM,oBAAgEA,OAAM;AAAA,IAC1E,CAAC,UAAU;AACT,YAAM,EAAE,IAAI,IAAI;AAEhB,UAAI,CAAC,YAAY,KAAK,OAAO,EAAE,SAAS,GAAG,GAAG;AAC5C,cAAM,eAAe;AACrB,cAAM,gBAAgB;AACtB,mBAAW,KAAK;AAAA,MAClB;AACA,6BAAuB,KAAK;AAAA,IAC9B;AAAA,IACA,CAAC,wBAAwB,UAAU;AAAA,EACrC;AACA,QAAM,EAAE,aAAa,0BAA0B,IAAI,oBAAoB,QAAQ;AAE/E,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,YAAW;AAAA,MACX,SAAS;AAAA,MACT,WAAW;AAAA,MACX,KAAK;AAAA,MACL,UAAU,cAAc,IAAI;AAAA,MAC5B,MAAK;AAAA,MACL,gBAAc;AAAA,MACd;AAAA,MAEA;AAAA,4BAAC,iBAAe,GAAG,UAAU;AAAA,QAC7B,oBAAC,qBAAmB,GAAG,UAAU;AAAA,QACjC,oBAAC,eAAa,GAAG,UAAU;AAAA;AAAA;AAAA,EAC7B;AAEJ,CAAC;",
   "names": ["React"]
 }

package/dist/esm/parts/Item/ItemActions/ItemActions.js

@@ -7,10 +7,9 @@ import { DSButtonV2, BUTTON_SIZES } from "@elliemae/ds-button";
 import { ArrowShortReturn, ArrowShortRight, CloseMedium } from "@elliemae/ds-icons";
 import { useActionsHandlers } from "./useActionsHandlers";
 import { useInnerRefHandlers } from "./useInnerRefHandlers";
-import { DSShuttleV2Name, DSShuttleV2Slots } from "../../../config/DSShuttleV2Definitions";
-const StyledItemActions = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_ACTIONS_WRAPPER })``;
-const StyledItemActionWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_ACTION_WRAPPER })``;
-const StyledButton = styled(DSButtonV2, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_ACTION_BTN })`
+const StyledItemActions = styled(Grid, { name: "ds-shuttle-v2", slot: "item-actions-wrapper" })``;
+const StyledItemActionWrapper = styled(Grid, { name: "ds-shuttle-v2", slot: "item-action-wrapper" })``;
+const StyledButton = styled(DSButtonV2, { name: "ds-shuttle-v2", slot: "item-action-btn" })`
   height: 22px !important;
   svg {
     fill: brand-600;
@@ -20,16 +19,16 @@ const StyledButton = styled(DSButtonV2, { name: DSShuttleV2Name, slot: DSShuttle
   }
 `;
 const StyledDrilldownIcon = styled(ArrowShortReturn, {
-  name: DSShuttleV2Name,
-  slot: DSShuttleV2Slots.ITEM_ACTION_BTN_DRILLDOWN_ICON
+  name: "ds-shuttle-v2",
+  slot: "item-action-btn-drilldown-icon"
 })``;
 const StyledCloseMediumIcon = styled(CloseMedium, {
-  name: DSShuttleV2Name,
-  slot: DSShuttleV2Slots.ITEM_ACTION_BTN_TO_SOURCE_ICON
+  name: "ds-shuttle-v2",
+  slot: "item-action-btn-to-source-icon"
 })``;
 const StyledArrowShortRightIcon = styled(ArrowShortRight, {
-  name: DSShuttleV2Name,
-  slot: DSShuttleV2Slots.ITEM_ACTION_BTN_TO_DESTINATION_ICON
+  name: "ds-shuttle-v2",
+  slot: "item-action-btn-to-destination-icon"
 })``;
 const actionsCols = ["20px", "20px"];
 const ItemActions = React2.memo((itemMeta) => {