@elliemae/ds-shuttle-v2 3.13.0-next.1 → 3.13.0-next.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/dist/cjs/config/itemMovementHelpers.js +17 -1
  2. package/dist/cjs/config/itemMovementHelpers.js.map +2 -2
  3. package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js +3 -6
  4. package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js.map +3 -3
  5. package/dist/cjs/parts/Item/ItemActions/useActionsLogicHandlers.js +16 -1
  6. package/dist/cjs/parts/Item/ItemActions/useActionsLogicHandlers.js.map +2 -2
  7. package/dist/cjs/react-desc-prop-types.js +12 -0
  8. package/dist/cjs/react-desc-prop-types.js.map +2 -2
  9. package/dist/esm/config/itemMovementHelpers.js +17 -1
  10. package/dist/esm/config/itemMovementHelpers.js.map +2 -2
  11. package/dist/esm/parts/HoC/withConditionalDnDRowContext.js +3 -6
  12. package/dist/esm/parts/HoC/withConditionalDnDRowContext.js.map +3 -3
  13. package/dist/esm/parts/Item/ItemActions/useActionsLogicHandlers.js +16 -1
  14. package/dist/esm/parts/Item/ItemActions/useActionsLogicHandlers.js.map +2 -2
  15. package/dist/esm/react-desc-prop-types.js +12 -0
  16. package/dist/esm/react-desc-prop-types.js.map +2 -2
  17. package/package.json +12 -13
package/dist/cjs/config/itemMovementHelpers.js CHANGED
@@ -74,6 +74,9 @@ const useHandleMoveSelection = ({ isDestinationPanel }) => {
74
74
  const currOnChange = (0, import_useStore.usePropsStore)(
75
75
  (state) => isDestinationPanel ? state.onDestinationChange : state.onSourceChange
76
76
  );
77
+ const currOnRemove = (0, import_useStore.usePropsStore)(
78
+ (state) => isDestinationPanel ? state.onDestinationRemove : state.onSourceRemove
79
+ );
77
80
  const onSelectionChange = (0, import_useStore.usePropsStore)(
78
81
  (state) => isDestinationPanel ? state.onDestinationSelectionChange : state.onSourceSelectionChange
79
82
  );
@@ -81,6 +84,7 @@ const useHandleMoveSelection = ({ isDestinationPanel }) => {
81
84
  const otherPanelOnChange = (0, import_useStore.usePropsStore)(
82
85
  (state) => isDestinationPanel ? state.onSourceChange : state.onDestinationChange
83
86
  );
87
+ const otherPanelOnAdd = (0, import_useStore.usePropsStore)((state) => isDestinationPanel ? state.onSourceAdd : state.onDestinationAdd);
84
88
  const destinationSelectionArray = (0, import_useStore.useInternalStore)((store) => store.destinationSelectionItemArray);
85
89
  const sourceSelectionArray = (0, import_useStore.useInternalStore)((store) => store.sourceSelectionItemArray);
86
90
  const selectedItems = isDestinationPanel ? destinationSelectionArray : sourceSelectionArray;
@@ -101,10 +105,22 @@ const useHandleMoveSelection = ({ isDestinationPanel }) => {
101
105
  iteratedNewOtherData = newOtherData;
102
106
  });
103
107
  currOnChange(iteratedNewCurrData, { event, selectedItems });
108
+ currOnRemove(selectedItems, { event });
104
109
  otherPanelOnChange(iteratedNewOtherData, { event, selectedItems });
110
+ otherPanelOnAdd(selectedItems, { event });
105
111
  onSelectionChange({}, { event });
106
112
  },
107
- [currData, otherData, selectedItems, currOnChange, otherPanelOnChange, onSelectionChange, currWithSoftDelete]
113
+ [
114
+ currData,
115
+ otherData,
116
+ selectedItems,
117
+ currOnChange,
118
+ currOnRemove,
119
+ otherPanelOnChange,
120
+ otherPanelOnAdd,
121
+ onSelectionChange,
122
+ currWithSoftDelete
123
+ ]
108
124
  );
109
125
  return import_react.default.useMemo(() => ({ moveSelection }), [moveSelection]);
110
126
  };
package/dist/cjs/config/itemMovementHelpers.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/config/itemMovementHelpers.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAkB;AAGlB,sBAAgD;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,eAAW,+BAAc,CAAC,UAAW,qBAAqB,MAAM,kBAAkB,MAAM,UAAW;AACzG,QAAM,yBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,mBAAe;AAAA,IAAc,CAAC,UAClC,qBAAqB,MAAM,sBAAsB,MAAM;AAAA,EACzD;AACA,QAAM,wBAAoB;AAAA,IAAc,CAAC,UACvC,qBAAqB,MAAM,+BAA+B,MAAM;AAAA,EAClE;AAEA,QAAM,gBAAY,+BAAc,CAAC,UAAW,qBAAqB,MAAM,aAAa,MAAM,eAAgB;AAC1G,QAAM,yBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,iBAAiB,MAAM;AAAA,EACpD;AACA,QAAM,gCAA4B,kCAAiB,CAAC,UAAU,MAAM,6BAA6B;AACjG,QAAM,2BAAuB,kCAAiB,CAAC,UAAU,MAAM,wBAAwB;AACvF,QAAM,gBAAgB,qBAAqB,4BAA4B;AAEvE,QAAM,gBAAgB,aAAAA,QAAM;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,SAAO,aAAAA,QAAM,QAAQ,OAAO,EAAE,cAAc,IAAI,CAAC,aAAa,CAAC;AACjE;",
4
+ "sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": ["React"]
7
7
  }
package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js CHANGED
@@ -47,14 +47,11 @@ const withConditionalDnDRowContext = (Component) => (props) => {
47
47
  const setLastActiveId = (0, import_useStore.useInternalStore)((state) => state.setLastActiveId);
48
48
  const setDropIndicatorPosition = (0, import_useStore.useInternalStore)((state) => state.setDropIndicatorPosition);
49
49
  const onItemsReorder = (0, import_useStore.usePropsStore)(
50
- (state) => isDestinationPanel ? state.onDestinationChange : state.onSourceChange
50
+ (state) => isDestinationPanel ? state.onDestinationReorder : state.onSourceReorder
51
51
  );
52
52
  const onReorder = (0, import_react.useCallback)(
53
- (newData, indexes) => {
54
- onItemsReorder(
55
- newData.map((item2) => item2.original),
56
- indexes
57
- );
53
+ (newData, metadata) => {
54
+ onItemsReorder(newData, { active: metadata.active.original, targetIndex: metadata.targetIndex });
58
55
  },
59
56
  [onItemsReorder]
60
57
  );
package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/HoC/withConditionalDnDRowContext.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable react/function-component-definition */\nimport React, { useCallback, useEffect } from 'react';\nimport { DndContext, DragOverlay, SortableContext, useTreeDndkitConfig } from '@elliemae/ds-drag-and-drop';\nimport { createPortal } from 'react-dom';\nimport { useInternalStore, usePropsStore } from '../../config/useStore';\nimport { ItemOverlay } from '../Item/ItemOverlay';\n\ntype FunctionalHOC = <T = any>(Component: React.ComponentType<T>, ...other: any[]) => (props: T) => JSX.Element;\n\n// only wraps in \"DnDContext\" and \"DnDTreeContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDRowContext: FunctionalHOC = (Component) => (props) => {\n const { isDestinationPanel } = props;\n const itemList = useInternalStore((state) =>\n isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData,\n );\n\n const withDragNDrop = usePropsStore((state) =>\n isDestinationPanel ? !state.removeDragAndDropFromDestination : state.addDragAndDropFromSource,\n );\n\n const setOverId = useInternalStore((state) => state.setOverId);\n const setIsDropValid = useInternalStore((state) => state.setIsDropValid);\n const setLastActiveId = useInternalStore((state) => state.setLastActiveId);\n const setDropIndicatorPosition = useInternalStore((state) => state.setDropIndicatorPosition);\n\n const onItemsReorder = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationChange : state.onSourceChange,\n );\n\n const onReorder = useCallback(\n (newData: unknown, indexes: { targetIndex: number; fromIndex: number }) => {\n onItemsReorder(\n newData.map((item) => item.original),\n indexes,\n );\n },\n [onItemsReorder],\n );\n\n const { dndContextProps, sortableContextProps, activeId, overId, dropIndicatorPosition, isDropValid } =\n useTreeDndkitConfig({\n flattenedItems: itemList,\n visibleItems: itemList,\n isHorizontalDnD: false,\n isExpandable: false,\n onReorder,\n maxDragAndDropLevel: 0,\n getIsDropValid: () => true,\n });\n\n useEffect(() => {\n setLastActiveId(activeId);\n }, [activeId, setLastActiveId]);\n\n useEffect(() => {\n setOverId(overId);\n }, [overId, setOverId]);\n\n useEffect(() => {\n setIsDropValid(isDropValid);\n }, [isDropValid, setIsDropValid]);\n\n useEffect(() => {\n setDropIndicatorPosition(dropIndicatorPosition);\n }, [dropIndicatorPosition, setDropIndicatorPosition]);\n\n const item = itemList.find((currentItem) => currentItem.original.id === activeId);\n if (withDragNDrop)\n return (\n <DndContext {...dndContextProps}>\n <SortableContext {...sortableContextProps}>\n <Component {...props} />\n </SortableContext>\n {createPortal(\n <DragOverlay style={{ width: 'auto' }}>\n {activeId ? <ItemOverlay item={item} {...props} /> : null}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n );\n return <Component {...props} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqEjB;AApEN,mBAA8C;AAC9C,8BAA8E;AAC9E,uBAA6B;AAC7B,sBAAgD;AAChD,yBAA4B;AAKrB,MAAM,+BAA8C,CAAC,cAAc,CAAC,UAAU;AACnF,QAAM,EAAE,mBAAmB,IAAI;AAC/B,QAAM,eAAW;AAAA,IAAiB,CAAC,UACjC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AAEA,QAAM,oBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,CAAC,MAAM,mCAAmC,MAAM;AAAA,EACvE;AAEA,QAAM,gBAAY,kCAAiB,CAAC,UAAU,MAAM,SAAS;AAC7D,QAAM,qBAAiB,kCAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,QAAM,sBAAkB,kCAAiB,CAAC,UAAU,MAAM,eAAe;AACzE,QAAM,+BAA2B,kCAAiB,CAAC,UAAU,MAAM,wBAAwB;AAE3F,QAAM,qBAAiB;AAAA,IAAc,CAAC,UACpC,qBAAqB,MAAM,sBAAsB,MAAM;AAAA,EACzD;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,SAAkB,YAAwD;AACzE;AAAA,QACE,QAAQ,IAAI,CAACA,UAASA,MAAK,QAAQ;AAAA,QACnC;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,QAAM,EAAE,iBAAiB,sBAAsB,UAAU,QAAQ,uBAAuB,YAAY,QAClG,6CAAoB;AAAA,IAClB,gBAAgB;AAAA,IAChB,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,cAAc;AAAA,IACd;AAAA,IACA,qBAAqB;AAAA,IACrB,gBAAgB,MAAM;AAAA,EACxB,CAAC;AAEH,8BAAU,MAAM;AACd,oBAAgB,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,eAAe,CAAC;AAE9B,8BAAU,MAAM;AACd,cAAU,MAAM;AAAA,EAClB,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,8BAAU,MAAM;AACd,mBAAe,WAAW;AAAA,EAC5B,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,8BAAU,MAAM;AACd,6BAAyB,qBAAqB;AAAA,EAChD,GAAG,CAAC,uBAAuB,wBAAwB,CAAC;AAEpD,QAAM,OAAO,SAAS,KAAK,CAAC,gBAAgB,YAAY,SAAS,OAAO,QAAQ;AAChF,MAAI;AACF,WACE,6CAAC,sCAAY,GAAG,iBACd;AAAA,kDAAC,2CAAiB,GAAG,sBACnB,sDAAC,aAAW,GAAG,OAAO,GACxB;AAAA,UACC;AAAA,QACC,4CAAC,uCAAY,OAAO,EAAE,OAAO,OAAO,GACjC,qBAAW,4CAAC,kCAAY,MAAa,GAAG,OAAO,IAAK,MACvD;AAAA,QACA,SAAS;AAAA,MACX;AAAA,OACF;AAEJ,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
6
- "names": ["item"]
4
+ "sourcesContent": ["/* eslint-disable max-params */\n/* eslint-disable react/function-component-definition */\nimport React, { useCallback, useEffect } from 'react';\nimport { DndContext, DragOverlay, SortableContext, useTreeDndkitConfig } from '@elliemae/ds-drag-and-drop';\nimport { createPortal } from 'react-dom';\nimport { useInternalStore, usePropsStore } from '../../config/useStore';\nimport { ItemOverlay } from '../Item/ItemOverlay';\n\ntype FunctionalHOC = <T = any>(Component: React.ComponentType<T>, ...other: any[]) => (props: T) => JSX.Element;\n\n// only wraps in \"DnDContext\" and \"DnDTreeContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDRowContext: FunctionalHOC = (Component) => (props) => {\n const { isDestinationPanel } = props;\n const itemList = useInternalStore((state) =>\n isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData,\n );\n\n const withDragNDrop = usePropsStore((state) =>\n isDestinationPanel ? !state.removeDragAndDropFromDestination : state.addDragAndDropFromSource,\n );\n\n const setOverId = useInternalStore((state) => state.setOverId);\n const setIsDropValid = useInternalStore((state) => state.setIsDropValid);\n const setLastActiveId = useInternalStore((state) => state.setLastActiveId);\n const setDropIndicatorPosition = useInternalStore((state) => state.setDropIndicatorPosition);\n\n const onItemsReorder = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationReorder : state.onSourceReorder,\n );\n\n const onReorder = useCallback(\n (newData: unknown, metadata: { targetIndex: number; active: unknown }) => {\n onItemsReorder(newData, { active: metadata.active.original, targetIndex: metadata.targetIndex });\n },\n [onItemsReorder],\n );\n\n const { dndContextProps, sortableContextProps, activeId, overId, dropIndicatorPosition, isDropValid } =\n useTreeDndkitConfig({\n flattenedItems: itemList,\n visibleItems: itemList,\n isHorizontalDnD: false,\n isExpandable: false,\n onReorder,\n maxDragAndDropLevel: 0,\n getIsDropValid: () => true,\n });\n\n useEffect(() => {\n setLastActiveId(activeId);\n }, [activeId, setLastActiveId]);\n\n useEffect(() => {\n setOverId(overId);\n }, [overId, setOverId]);\n\n useEffect(() => {\n setIsDropValid(isDropValid);\n }, [isDropValid, setIsDropValid]);\n\n useEffect(() => {\n setDropIndicatorPosition(dropIndicatorPosition);\n }, [dropIndicatorPosition, setDropIndicatorPosition]);\n\n const item = itemList.find((currentItem) => currentItem.original.id === activeId);\n if (withDragNDrop)\n return (\n <DndContext {...dndContextProps}>\n <SortableContext {...sortableContextProps}>\n <Component {...props} />\n </SortableContext>\n {createPortal(\n <DragOverlay style={{ width: 'auto' }}>\n {activeId ? <ItemOverlay item={item} {...props} /> : null}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n );\n return <Component {...props} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmEjB;AAjEN,mBAA8C;AAC9C,8BAA8E;AAC9E,uBAA6B;AAC7B,sBAAgD;AAChD,yBAA4B;AAKrB,MAAM,+BAA8C,CAAC,cAAc,CAAC,UAAU;AACnF,QAAM,EAAE,mBAAmB,IAAI;AAC/B,QAAM,eAAW;AAAA,IAAiB,CAAC,UACjC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AAEA,QAAM,oBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,CAAC,MAAM,mCAAmC,MAAM;AAAA,EACvE;AAEA,QAAM,gBAAY,kCAAiB,CAAC,UAAU,MAAM,SAAS;AAC7D,QAAM,qBAAiB,kCAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,QAAM,sBAAkB,kCAAiB,CAAC,UAAU,MAAM,eAAe;AACzE,QAAM,+BAA2B,kCAAiB,CAAC,UAAU,MAAM,wBAAwB;AAE3F,QAAM,qBAAiB;AAAA,IAAc,CAAC,UACpC,qBAAqB,MAAM,uBAAuB,MAAM;AAAA,EAC1D;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,SAAkB,aAAuD;AACxE,qBAAe,SAAS,EAAE,QAAQ,SAAS,OAAO,UAAU,aAAa,SAAS,YAAY,CAAC;AAAA,IACjG;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,QAAM,EAAE,iBAAiB,sBAAsB,UAAU,QAAQ,uBAAuB,YAAY,QAClG,6CAAoB;AAAA,IAClB,gBAAgB;AAAA,IAChB,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,cAAc;AAAA,IACd;AAAA,IACA,qBAAqB;AAAA,IACrB,gBAAgB,MAAM;AAAA,EACxB,CAAC;AAEH,8BAAU,MAAM;AACd,oBAAgB,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,eAAe,CAAC;AAE9B,8BAAU,MAAM;AACd,cAAU,MAAM;AAAA,EAClB,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,8BAAU,MAAM;AACd,mBAAe,WAAW;AAAA,EAC5B,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,8BAAU,MAAM;AACd,6BAAyB,qBAAqB;AAAA,EAChD,GAAG,CAAC,uBAAuB,wBAAwB,CAAC;AAEpD,QAAM,OAAO,SAAS,KAAK,CAAC,gBAAgB,YAAY,SAAS,OAAO,QAAQ;AAChF,MAAI;AACF,WACE,6CAAC,sCAAY,GAAG,iBACd;AAAA,kDAAC,2CAAiB,GAAG,sBACnB,sDAAC,aAAW,GAAG,OAAO,GACxB;AAAA,UACC;AAAA,QACC,4CAAC,uCAAY,OAAO,EAAE,OAAO,OAAO,GACjC,qBAAW,4CAAC,kCAAY,MAAa,GAAG,OAAO,IAAK,MACvD;AAAA,QACA,SAAS;AAAA,MACX;AAAA,OACF;AAEJ,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
6
+ "names": []
7
7
  }
package/dist/cjs/parts/Item/ItemActions/useActionsLogicHandlers.js CHANGED
@@ -40,6 +40,9 @@ const useActionsLogicHandlers = (itemMeta) => {
40
40
  const currOnChange = (0, import_useStore.usePropsStore)(
41
41
  (state) => isDestinationPanel ? state.onDestinationChange : state.onSourceChange
42
42
  );
43
+ const currOnRemove = (0, import_useStore.usePropsStore)(
44
+ (state) => isDestinationPanel ? state.onDestinationRemove : state.onSourceRemove
45
+ );
43
46
  const currDrilldown = (0, import_useStore.usePropsStore)(
44
47
  (state) => isDestinationPanel ? state.onDestinationDrilldown : state.onSourceDrilldown
45
48
  );
@@ -47,6 +50,7 @@ const useActionsLogicHandlers = (itemMeta) => {
47
50
  const otherPanelOnChange = (0, import_useStore.usePropsStore)(
48
51
  (state) => isDestinationPanel ? state.onSourceChange : state.onDestinationChange
49
52
  );
53
+ const otherPanelOnAdd = (0, import_useStore.usePropsStore)((state) => isDestinationPanel ? state.onSourceAdd : state.onDestinationAdd);
50
54
  const handleDrilldown = import_react.default.useCallback(
51
55
  (event) => {
52
56
  event.preventDefault();
@@ -65,10 +69,21 @@ const useActionsLogicHandlers = (itemMeta) => {
65
69
  currWithSoftDelete,
66
70
  otherData
67
71
  });
72
+ currOnRemove([item.original], { event });
73
+ otherPanelOnAdd([item.original], { event });
68
74
  currOnChange(newCurrData, { item: item.original, event });
69
75
  otherPanelOnChange(newOtherData, { item: item.original, event });
70
76
  },
71
- [currData, currOnChange, currWithSoftDelete, item, otherData, otherPanelOnChange]
77
+ [
78
+ currData,
79
+ currOnChange,
80
+ currOnRemove,
81
+ currWithSoftDelete,
82
+ item.original,
83
+ otherData,
84
+ otherPanelOnAdd,
85
+ otherPanelOnChange
86
+ ]
72
87
  );
73
88
  return import_react.default.useMemo(() => ({ handleDrilldown, handleSingleMove }), [handleDrilldown, handleSingleMove]);
74
89
  };
package/dist/cjs/parts/Item/ItemActions/useActionsLogicHandlers.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/parts/Item/ItemActions/useActionsLogicHandlers.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React from 'react';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types';\nimport { usePropsStore } from '../../../config/useStore';\nimport { getNewDatasWithItemMoved } from '../../../config/itemMovementHelpers';\n\nexport const useActionsLogicHandlers = (itemMeta: DSShuttleV2T.ItemMeta) => {\n const { item, isDestinationPanel } = itemMeta;\n\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 currDrilldown = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationDrilldown : state.onSourceDrilldown,\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\n const handleDrilldown = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n currDrilldown(item.original, { event });\n },\n [currDrilldown, item],\n );\n\n const handleSingleMove = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n const { newCurrData, newOtherData } = getNewDatasWithItemMoved({\n item: item.original,\n currData,\n currWithSoftDelete,\n otherData,\n });\n\n currOnChange(newCurrData, { item: item.original, event });\n otherPanelOnChange(newOtherData, { item: item.original, event });\n },\n [currData, currOnChange, currWithSoftDelete, item, otherData, otherPanelOnChange],\n );\n return React.useMemo(() => ({ handleDrilldown, handleSingleMove }), [handleDrilldown, handleSingleMove]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAElB,sBAA8B;AAC9B,iCAAyC;AAElC,MAAM,0BAA0B,CAAC,aAAoC;AAC1E,QAAM,EAAE,MAAM,mBAAmB,IAAI;AAErC,QAAM,eAAW,+BAAc,CAAC,UAAW,qBAAqB,MAAM,kBAAkB,MAAM,UAAW;AACzG,QAAM,yBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,mBAAe;AAAA,IAAc,CAAC,UAClC,qBAAqB,MAAM,sBAAsB,MAAM;AAAA,EACzD;AACA,QAAM,oBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,MAAM,yBAAyB,MAAM;AAAA,EAC5D;AAEA,QAAM,gBAAY,+BAAc,CAAC,UAAW,qBAAqB,MAAM,aAAa,MAAM,eAAgB;AAC1G,QAAM,yBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,iBAAiB,MAAM;AAAA,EACpD;AAEA,QAAM,kBAAkB,aAAAA,QAAM;AAAA,IAC5B,CAAC,UAAwF;AACvF,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,oBAAc,KAAK,UAAU,EAAE,MAAM,CAAC;AAAA,IACxC;AAAA,IACA,CAAC,eAAe,IAAI;AAAA,EACtB;AAEA,QAAM,mBAAmB,aAAAA,QAAM;AAAA,IAC7B,CAAC,UAAwF;AACvF,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,YAAM,EAAE,aAAa,aAAa,QAAI,qDAAyB;AAAA,QAC7D,MAAM,KAAK;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAED,mBAAa,aAAa,EAAE,MAAM,KAAK,UAAU,MAAM,CAAC;AACxD,yBAAmB,cAAc,EAAE,MAAM,KAAK,UAAU,MAAM,CAAC;AAAA,IACjE;AAAA,IACA,CAAC,UAAU,cAAc,oBAAoB,MAAM,WAAW,kBAAkB;AAAA,EAClF;AACA,SAAO,aAAAA,QAAM,QAAQ,OAAO,EAAE,iBAAiB,iBAAiB,IAAI,CAAC,iBAAiB,gBAAgB,CAAC;AACzG;",
4
+ "sourcesContent": ["import React from 'react';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types';\nimport { usePropsStore } from '../../../config/useStore';\nimport { getNewDatasWithItemMoved } from '../../../config/itemMovementHelpers';\n\nexport const useActionsLogicHandlers = (itemMeta: DSShuttleV2T.ItemMeta) => {\n const { item, isDestinationPanel } = itemMeta;\n\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 currDrilldown = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationDrilldown : state.onSourceDrilldown,\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\n const handleDrilldown = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n currDrilldown(item.original, { event });\n },\n [currDrilldown, item],\n );\n\n const handleSingleMove = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n const { newCurrData, newOtherData } = getNewDatasWithItemMoved({\n item: item.original,\n currData,\n currWithSoftDelete,\n otherData,\n });\n currOnRemove([item.original], { event });\n otherPanelOnAdd([item.original], { event });\n\n currOnChange(newCurrData, { item: item.original, event });\n otherPanelOnChange(newOtherData, { item: item.original, event });\n },\n [\n currData,\n currOnChange,\n currOnRemove,\n currWithSoftDelete,\n item.original,\n otherData,\n otherPanelOnAdd,\n otherPanelOnChange,\n ],\n );\n return React.useMemo(() => ({ handleDrilldown, handleSingleMove }), [handleDrilldown, handleSingleMove]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAElB,sBAA8B;AAC9B,iCAAyC;AAElC,MAAM,0BAA0B,CAAC,aAAoC;AAC1E,QAAM,EAAE,MAAM,mBAAmB,IAAI;AAErC,QAAM,eAAW,+BAAc,CAAC,UAAW,qBAAqB,MAAM,kBAAkB,MAAM,UAAW;AACzG,QAAM,yBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,mBAAe;AAAA,IAAc,CAAC,UAClC,qBAAqB,MAAM,sBAAsB,MAAM;AAAA,EACzD;AACA,QAAM,mBAAe;AAAA,IAAc,CAAC,UAClC,qBAAqB,MAAM,sBAAsB,MAAM;AAAA,EACzD;AAEA,QAAM,oBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,MAAM,yBAAyB,MAAM;AAAA,EAC5D;AAEA,QAAM,gBAAY,+BAAc,CAAC,UAAW,qBAAqB,MAAM,aAAa,MAAM,eAAgB;AAC1G,QAAM,yBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,iBAAiB,MAAM;AAAA,EACpD;AACA,QAAM,sBAAkB,+BAAc,CAAC,UAAW,qBAAqB,MAAM,cAAc,MAAM,gBAAiB;AAElH,QAAM,kBAAkB,aAAAA,QAAM;AAAA,IAC5B,CAAC,UAAwF;AACvF,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,oBAAc,KAAK,UAAU,EAAE,MAAM,CAAC;AAAA,IACxC;AAAA,IACA,CAAC,eAAe,IAAI;AAAA,EACtB;AAEA,QAAM,mBAAmB,aAAAA,QAAM;AAAA,IAC7B,CAAC,UAAwF;AACvF,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,YAAM,EAAE,aAAa,aAAa,QAAI,qDAAyB;AAAA,QAC7D,MAAM,KAAK;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AACD,mBAAa,CAAC,KAAK,QAAQ,GAAG,EAAE,MAAM,CAAC;AACvC,sBAAgB,CAAC,KAAK,QAAQ,GAAG,EAAE,MAAM,CAAC;AAE1C,mBAAa,aAAa,EAAE,MAAM,KAAK,UAAU,MAAM,CAAC;AACxD,yBAAmB,cAAc,EAAE,MAAM,KAAK,UAAU,MAAM,CAAC;AAAA,IACjE;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,KAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACA,SAAO,aAAAA,QAAM,QAAQ,OAAO,EAAE,iBAAiB,iBAAiB,IAAI,CAAC,iBAAiB,gBAAgB,CAAC;AACzG;",
6
6
  "names": ["React"]
7
7
  }
package/dist/cjs/react-desc-prop-types.js CHANGED
@@ -38,12 +38,24 @@ const defaultProps = {
38
38
  sourceIsLoadingMore: false,
39
39
  onSourceLoadMore: () => {
40
40
  },
41
+ onSourceChange: () => {
42
+ },
43
+ onSourceAdd: () => {
44
+ },
45
+ onSourceRemove: () => {
46
+ },
41
47
  destinationWithSoftDelete: false,
42
48
  removeDragAndDropFromDestination: false,
43
49
  destinationIsLoading: false,
44
50
  destinationWithLoadMore: false,
45
51
  destinationIsLoadingMore: false,
46
52
  onDestinationLoadMore: () => {
53
+ },
54
+ onDestinationChange: () => {
55
+ },
56
+ onDestinationAdd: () => {
57
+ },
58
+ onDestinationRemove: () => {
47
59
  }
48
60
  };
49
61
  const DSSkeletonPropTypes = {
package/dist/cjs/react-desc-prop-types.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/react-desc-prop-types.ts", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import type { WeakValidationMap } from 'react';\nimport type React from 'react';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-utilities';\nimport { globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-utilities';\nimport { type DSControlledCheckboxT } from '@elliemae/ds-form-checkbox';\nimport { type DSButtonT } from '@elliemae/ds-button';\nimport { type useSortable } from '@elliemae/ds-drag-and-drop';\n\nexport declare namespace DSShuttleV2T {\n export type PanelMetaInfo = { isDestinationPanel: boolean };\n export interface ItemMeta extends PanelMetaInfo {\n item: DSShuttleV2T.ConfiguredDatum;\n withDragNDrop: boolean;\n useSortableHelpers?: ReturnType<typeof useSortable>;\n }\n\n export interface Datum extends Record<string, unknown> {\n id: string;\n label: string;\n subtitle?: string;\n Icon?: React.ComponentType<ItemMeta>;\n CustomRenderer?: React.ComponentType<ItemMeta>;\n softDeleted?: boolean;\n preventDrilldown?: boolean;\n preventMove?: boolean;\n }\n export interface ConfiguredDatum {\n isFirst: boolean;\n isLast: boolean;\n isSelected: boolean;\n selectionPrevented: boolean;\n withActions: boolean;\n withMoveBtn: boolean;\n withDrilldownBtn: boolean;\n original: Datum;\n localIndex: number;\n }\n\n type SelectionMap = Record<string, boolean>;\n type OnDataChange = (\n newData: Datum[],\n metainfo: {\n event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>;\n item?: Datum;\n selectedItems?: Datum[];\n },\n ) => void;\n type OnSelectionChange = (\n newSelection: SelectionMap,\n metainfo: {\n event:\n | Parameters<Required<DSButtonT.Props>['onClick']>[0]\n | Parameters<DSControlledCheckboxT.InternalProps['onChange']>[1]\n | React.MouseEvent<HTMLButtonElement | HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>\n | React.ChangeEvent<HTMLInputElement>;\n item?: Datum;\n },\n ) => void;\n type OnSelectionDrilldown = (\n item: Datum,\n metainfo: { event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement> },\n ) => void;\n\n type OnLoadMore = (e: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => void;\n\n export interface RequiredProps {\n sourceData: Datum[];\n onSourceChange: OnDataChange;\n sourceSelectedItems: SelectionMap;\n onSourceSelectionChange: OnSelectionChange;\n SourceHeader: React.ComponentType<unknown>;\n onSourceDrilldown: OnSelectionDrilldown;\n\n destinationData: Datum[];\n onDestinationChange: OnDataChange;\n destinationSelectedItems: SelectionMap;\n onDestinationSelectionChange: OnSelectionChange;\n DestinationHeader: React.ComponentType<unknown>;\n onDestinationDrilldown: OnSelectionDrilldown;\n }\n\n export interface DefaultProps {\n sourceIsLoading: boolean;\n sourceWithSoftDelete: boolean;\n sourceWithLoadMore: boolean;\n sourceIsLoadingMore: boolean;\n onSourceLoadMore: OnLoadMore;\n addDragAndDropFromSource: boolean;\n removeDragAndDropFromDestination: boolean;\n destinationIsLoading: boolean;\n destinationWithSoftDelete: boolean;\n destinationWithLoadMore: boolean;\n destinationIsLoadingMore: boolean;\n onDestinationLoadMore: OnLoadMore;\n }\n\n type OnFilterChange = (\n newfilter: string | null,\n metainfo: { event: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<HTMLButtonElement> },\n ) => void;\n type OnSearchbarOpen = (\n newfilter: boolean,\n metainfo: { event: Parameters<Required<DSButtonT.Props>['onClick']>[0] },\n ) => void;\n export interface OptionalProps {\n sourceItemProps?: Record<string, unknown>;\n destinationItemProps?: Record<string, unknown>;\n sourceFilterValue?: string;\n onSourceFilterChange?: OnFilterChange;\n onSourceOpenSearchbar?: OnSearchbarOpen;\n sourceShowSearchbar?: boolean;\n destinationFilterValue?: string;\n onDestinationFilterChange?: OnFilterChange;\n onDesinationOpenSearchbar?: OnSearchbarOpen;\n destinationShowSearchbar?: boolean;\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSShuttleV2T.DefaultProps = {\n sourceWithSoftDelete: false,\n addDragAndDropFromSource: false,\n sourceIsLoading: false,\n sourceWithLoadMore: false,\n sourceIsLoadingMore: false,\n onSourceLoadMore: () => {},\n\n destinationWithSoftDelete: false,\n removeDragAndDropFromDestination: false,\n destinationIsLoading: false,\n destinationWithLoadMore: false,\n destinationIsLoadingMore: false,\n onDestinationLoadMore: () => {},\n};\n\nexport const DSSkeletonPropTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,0BAA4D;AAkIrD,MAAM,eAA0C;AAAA,EACrD,sBAAsB;AAAA,EACtB,0BAA0B;AAAA,EAC1B,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB,qBAAqB;AAAA,EACrB,kBAAkB,MAAM;AAAA,EAAC;AAAA,EAEzB,2BAA2B;AAAA,EAC3B,kCAAkC;AAAA,EAClC,sBAAsB;AAAA,EACtB,yBAAyB;AAAA,EACzB,0BAA0B;AAAA,EAC1B,uBAAuB,MAAM;AAAA,EAAC;AAChC;AAEO,MAAM,sBAAsB;AAAA,EACjC,GAAG;AAAA,EACH,GAAG;AACL;",
4
+ "sourcesContent": ["import type { WeakValidationMap } from 'react';\nimport type React from 'react';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-utilities';\nimport { globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-utilities';\nimport { type DSControlledCheckboxT } from '@elliemae/ds-form-checkbox';\nimport { type DSButtonT } from '@elliemae/ds-button';\nimport { type useSortable } from '@elliemae/ds-drag-and-drop';\n\nexport declare namespace DSShuttleV2T {\n export type PanelMetaInfo = { isDestinationPanel: boolean };\n export interface ItemMeta extends PanelMetaInfo {\n item: DSShuttleV2T.ConfiguredDatum;\n withDragNDrop: boolean;\n useSortableHelpers?: ReturnType<typeof useSortable>;\n }\n\n export interface Datum extends Record<string, unknown> {\n id: string;\n label: string;\n subtitle?: string;\n Icon?: React.ComponentType<ItemMeta>;\n CustomRenderer?: React.ComponentType<ItemMeta>;\n softDeleted?: boolean;\n preventDrilldown?: boolean;\n preventMove?: boolean;\n }\n export interface ConfiguredDatum {\n isFirst: boolean;\n isLast: boolean;\n isSelected: boolean;\n selectionPrevented: boolean;\n withActions: boolean;\n withMoveBtn: boolean;\n withDrilldownBtn: boolean;\n original: Datum;\n localIndex: number;\n }\n\n type SelectionMap = Record<string, boolean>;\n type OnDataChange = (\n newData: Datum[],\n metainfo: {\n event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>;\n item?: Datum;\n selectedItems?: Datum[];\n },\n ) => void;\n\n type OnChangeEvent = (\n items: Datum[],\n metainfo: {\n event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>;\n },\n ) => void;\n\n type OnReorderEvent = (newData: Datum[], metadata: { active: Datum; targetIndex: number }) => void;\n\n type OnSelectionChange = (\n newSelection: SelectionMap,\n metainfo: {\n event:\n | Parameters<Required<DSButtonT.Props>['onClick']>[0]\n | Parameters<DSControlledCheckboxT.InternalProps['onChange']>[1]\n | React.MouseEvent<HTMLButtonElement | HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>\n | React.ChangeEvent<HTMLInputElement>;\n item?: Datum;\n },\n ) => void;\n type OnSelectionDrilldown = (\n item: Datum,\n metainfo: { event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement> },\n ) => void;\n\n type OnLoadMore = (e: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => void;\n\n export interface RequiredProps {\n sourceData: Datum[];\n sourceSelectedItems: SelectionMap;\n onSourceSelectionChange: OnSelectionChange;\n SourceHeader: React.ComponentType<unknown>;\n onSourceDrilldown: OnSelectionDrilldown;\n\n destinationData: Datum[];\n destinationSelectedItems: SelectionMap;\n onDestinationSelectionChange: OnSelectionChange;\n DestinationHeader: React.ComponentType<unknown>;\n onDestinationDrilldown: OnSelectionDrilldown;\n }\n\n export interface DefaultProps {\n sourceIsLoading: boolean;\n sourceWithSoftDelete: boolean;\n sourceWithLoadMore: boolean;\n sourceIsLoadingMore: boolean;\n onSourceChange: OnDataChange;\n onSourceAdd: OnChangeEvent;\n onSourceRemove: OnChangeEvent;\n onSourceReorder: OnReorderEvent;\n onSourceLoadMore: OnLoadMore;\n addDragAndDropFromSource: boolean;\n removeDragAndDropFromDestination: boolean;\n destinationIsLoading: boolean;\n destinationWithSoftDelete: boolean;\n destinationWithLoadMore: boolean;\n destinationIsLoadingMore: boolean;\n onDestinationLoadMore: OnLoadMore;\n onDestinationChange: OnDataChange;\n onDestinationAdd: OnChangeEvent;\n onDestinationRemove: OnChangeEvent;\n onDestinationReorder: OnReorderEvent;\n }\n\n type OnFilterChange = (\n newfilter: string | null,\n metainfo: { event: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<HTMLButtonElement> },\n ) => void;\n type OnSearchbarOpen = (\n newfilter: boolean,\n metainfo: { event: Parameters<Required<DSButtonT.Props>['onClick']>[0] },\n ) => void;\n export interface OptionalProps {\n sourceItemProps?: Record<string, unknown>;\n destinationItemProps?: Record<string, unknown>;\n sourceFilterValue?: string;\n\n onSourceFilterChange?: OnFilterChange;\n onSourceOpenSearchbar?: OnSearchbarOpen;\n sourceShowSearchbar?: boolean;\n destinationFilterValue?: string;\n onDestinationFilterChange?: OnFilterChange;\n onDesinationOpenSearchbar?: OnSearchbarOpen;\n destinationShowSearchbar?: boolean;\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSShuttleV2T.DefaultProps = {\n sourceWithSoftDelete: false,\n addDragAndDropFromSource: false,\n sourceIsLoading: false,\n sourceWithLoadMore: false,\n sourceIsLoadingMore: false,\n onSourceLoadMore: () => {},\n onSourceChange: () => {},\n onSourceAdd: () => {},\n onSourceRemove: () => {},\n\n destinationWithSoftDelete: false,\n removeDragAndDropFromDestination: false,\n destinationIsLoading: false,\n destinationWithLoadMore: false,\n destinationIsLoadingMore: false,\n onDestinationLoadMore: () => {},\n onDestinationChange: () => {},\n onDestinationAdd: () => {},\n onDestinationRemove: () => {},\n};\n\nexport const DSSkeletonPropTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,0BAA4D;AAmJrD,MAAM,eAA0C;AAAA,EACrD,sBAAsB;AAAA,EACtB,0BAA0B;AAAA,EAC1B,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB,qBAAqB;AAAA,EACrB,kBAAkB,MAAM;AAAA,EAAC;AAAA,EACzB,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,gBAAgB,MAAM;AAAA,EAAC;AAAA,EAEvB,2BAA2B;AAAA,EAC3B,kCAAkC;AAAA,EAClC,sBAAsB;AAAA,EACtB,yBAAyB;AAAA,EACzB,0BAA0B;AAAA,EAC1B,uBAAuB,MAAM;AAAA,EAAC;AAAA,EAC9B,qBAAqB,MAAM;AAAA,EAAC;AAAA,EAC5B,kBAAkB,MAAM;AAAA,EAAC;AAAA,EACzB,qBAAqB,MAAM;AAAA,EAAC;AAC9B;AAEO,MAAM,sBAAsB;AAAA,EACjC,GAAG;AAAA,EACH,GAAG;AACL;",
6
6
  "names": []
7
7
  }
package/dist/esm/config/itemMovementHelpers.js CHANGED
@@ -44,6 +44,9 @@ const useHandleMoveSelection = ({ isDestinationPanel }) => {
44
44
  const currOnChange = usePropsStore(
45
45
  (state) => isDestinationPanel ? state.onDestinationChange : state.onSourceChange
46
46
  );
47
+ const currOnRemove = usePropsStore(
48
+ (state) => isDestinationPanel ? state.onDestinationRemove : state.onSourceRemove
49
+ );
47
50
  const onSelectionChange = usePropsStore(
48
51
  (state) => isDestinationPanel ? state.onDestinationSelectionChange : state.onSourceSelectionChange
49
52
  );
@@ -51,6 +54,7 @@ const useHandleMoveSelection = ({ isDestinationPanel }) => {
51
54
  const otherPanelOnChange = usePropsStore(
52
55
  (state) => isDestinationPanel ? state.onSourceChange : state.onDestinationChange
53
56
  );
57
+ const otherPanelOnAdd = usePropsStore((state) => isDestinationPanel ? state.onSourceAdd : state.onDestinationAdd);
54
58
  const destinationSelectionArray = useInternalStore((store) => store.destinationSelectionItemArray);
55
59
  const sourceSelectionArray = useInternalStore((store) => store.sourceSelectionItemArray);
56
60
  const selectedItems = isDestinationPanel ? destinationSelectionArray : sourceSelectionArray;
@@ -71,10 +75,22 @@ const useHandleMoveSelection = ({ isDestinationPanel }) => {
71
75
  iteratedNewOtherData = newOtherData;
72
76
  });
73
77
  currOnChange(iteratedNewCurrData, { event, selectedItems });
78
+ currOnRemove(selectedItems, { event });
74
79
  otherPanelOnChange(iteratedNewOtherData, { event, selectedItems });
80
+ otherPanelOnAdd(selectedItems, { event });
75
81
  onSelectionChange({}, { event });
76
82
  },
77
- [currData, otherData, selectedItems, currOnChange, otherPanelOnChange, onSelectionChange, currWithSoftDelete]
83
+ [
84
+ currData,
85
+ otherData,
86
+ selectedItems,
87
+ currOnChange,
88
+ currOnRemove,
89
+ otherPanelOnChange,
90
+ otherPanelOnAdd,
91
+ onSelectionChange,
92
+ currWithSoftDelete
93
+ ]
78
94
  );
79
95
  return React2.useMemo(() => ({ moveSelection }), [moveSelection]);
80
96
  };
package/dist/esm/config/itemMovementHelpers.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/itemMovementHelpers.tsx"],
4
- "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"],
5
- "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;",
4
+ "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"],
5
+ "mappings": "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",
6
6
  "names": ["React"]
7
7
  }
package/dist/esm/parts/HoC/withConditionalDnDRowContext.js CHANGED
@@ -18,14 +18,11 @@ const withConditionalDnDRowContext = (Component) => (props) => {
18
18
  const setLastActiveId = useInternalStore((state) => state.setLastActiveId);
19
19
  const setDropIndicatorPosition = useInternalStore((state) => state.setDropIndicatorPosition);
20
20
  const onItemsReorder = usePropsStore(
21
- (state) => isDestinationPanel ? state.onDestinationChange : state.onSourceChange
21
+ (state) => isDestinationPanel ? state.onDestinationReorder : state.onSourceReorder
22
22
  );
23
23
  const onReorder = useCallback(
24
- (newData, indexes) => {
25
- onItemsReorder(
26
- newData.map((item2) => item2.original),
27
- indexes
28
- );
24
+ (newData, metadata) => {
25
+ onItemsReorder(newData, { active: metadata.active.original, targetIndex: metadata.targetIndex });
29
26
  },
30
27
  [onItemsReorder]
31
28
  );
package/dist/esm/parts/HoC/withConditionalDnDRowContext.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/HoC/withConditionalDnDRowContext.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/function-component-definition */\nimport React, { useCallback, useEffect } from 'react';\nimport { DndContext, DragOverlay, SortableContext, useTreeDndkitConfig } from '@elliemae/ds-drag-and-drop';\nimport { createPortal } from 'react-dom';\nimport { useInternalStore, usePropsStore } from '../../config/useStore';\nimport { ItemOverlay } from '../Item/ItemOverlay';\n\ntype FunctionalHOC = <T = any>(Component: React.ComponentType<T>, ...other: any[]) => (props: T) => JSX.Element;\n\n// only wraps in \"DnDContext\" and \"DnDTreeContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDRowContext: FunctionalHOC = (Component) => (props) => {\n const { isDestinationPanel } = props;\n const itemList = useInternalStore((state) =>\n isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData,\n );\n\n const withDragNDrop = usePropsStore((state) =>\n isDestinationPanel ? !state.removeDragAndDropFromDestination : state.addDragAndDropFromSource,\n );\n\n const setOverId = useInternalStore((state) => state.setOverId);\n const setIsDropValid = useInternalStore((state) => state.setIsDropValid);\n const setLastActiveId = useInternalStore((state) => state.setLastActiveId);\n const setDropIndicatorPosition = useInternalStore((state) => state.setDropIndicatorPosition);\n\n const onItemsReorder = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationChange : state.onSourceChange,\n );\n\n const onReorder = useCallback(\n (newData: unknown, indexes: { targetIndex: number; fromIndex: number }) => {\n onItemsReorder(\n newData.map((item) => item.original),\n indexes,\n );\n },\n [onItemsReorder],\n );\n\n const { dndContextProps, sortableContextProps, activeId, overId, dropIndicatorPosition, isDropValid } =\n useTreeDndkitConfig({\n flattenedItems: itemList,\n visibleItems: itemList,\n isHorizontalDnD: false,\n isExpandable: false,\n onReorder,\n maxDragAndDropLevel: 0,\n getIsDropValid: () => true,\n });\n\n useEffect(() => {\n setLastActiveId(activeId);\n }, [activeId, setLastActiveId]);\n\n useEffect(() => {\n setOverId(overId);\n }, [overId, setOverId]);\n\n useEffect(() => {\n setIsDropValid(isDropValid);\n }, [isDropValid, setIsDropValid]);\n\n useEffect(() => {\n setDropIndicatorPosition(dropIndicatorPosition);\n }, [dropIndicatorPosition, setDropIndicatorPosition]);\n\n const item = itemList.find((currentItem) => currentItem.original.id === activeId);\n if (withDragNDrop)\n return (\n <DndContext {...dndContextProps}>\n <SortableContext {...sortableContextProps}>\n <Component {...props} />\n </SortableContext>\n {createPortal(\n <DragOverlay style={{ width: 'auto' }}>\n {activeId ? <ItemOverlay item={item} {...props} /> : null}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n );\n return <Component {...props} />;\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACqEjB,SAEI,KAFJ;AApEN,SAAgB,aAAa,iBAAiB;AAC9C,SAAS,YAAY,aAAa,iBAAiB,2BAA2B;AAC9E,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB,qBAAqB;AAChD,SAAS,mBAAmB;AAKrB,MAAM,+BAA8C,CAAC,cAAc,CAAC,UAAU;AACnF,QAAM,EAAE,mBAAmB,IAAI;AAC/B,QAAM,WAAW;AAAA,IAAiB,CAAC,UACjC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AAEA,QAAM,gBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,CAAC,MAAM,mCAAmC,MAAM;AAAA,EACvE;AAEA,QAAM,YAAY,iBAAiB,CAAC,UAAU,MAAM,SAAS;AAC7D,QAAM,iBAAiB,iBAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AACzE,QAAM,2BAA2B,iBAAiB,CAAC,UAAU,MAAM,wBAAwB;AAE3F,QAAM,iBAAiB;AAAA,IAAc,CAAC,UACpC,qBAAqB,MAAM,sBAAsB,MAAM;AAAA,EACzD;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,SAAkB,YAAwD;AACzE;AAAA,QACE,QAAQ,IAAI,CAACA,UAASA,MAAK,QAAQ;AAAA,QACnC;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,QAAM,EAAE,iBAAiB,sBAAsB,UAAU,QAAQ,uBAAuB,YAAY,IAClG,oBAAoB;AAAA,IAClB,gBAAgB;AAAA,IAChB,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,cAAc;AAAA,IACd;AAAA,IACA,qBAAqB;AAAA,IACrB,gBAAgB,MAAM;AAAA,EACxB,CAAC;AAEH,YAAU,MAAM;AACd,oBAAgB,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,eAAe,CAAC;AAE9B,YAAU,MAAM;AACd,cAAU,MAAM;AAAA,EAClB,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,YAAU,MAAM;AACd,mBAAe,WAAW;AAAA,EAC5B,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,YAAU,MAAM;AACd,6BAAyB,qBAAqB;AAAA,EAChD,GAAG,CAAC,uBAAuB,wBAAwB,CAAC;AAEpD,QAAM,OAAO,SAAS,KAAK,CAAC,gBAAgB,YAAY,SAAS,OAAO,QAAQ;AAChF,MAAI;AACF,WACE,qBAAC,cAAY,GAAG,iBACd;AAAA,0BAAC,mBAAiB,GAAG,sBACnB,8BAAC,aAAW,GAAG,OAAO,GACxB;AAAA,MACC;AAAA,QACC,oBAAC,eAAY,OAAO,EAAE,OAAO,OAAO,GACjC,qBAAW,oBAAC,eAAY,MAAa,GAAG,OAAO,IAAK,MACvD;AAAA,QACA,SAAS;AAAA,MACX;AAAA,OACF;AAEJ,SAAO,oBAAC,aAAW,GAAG,OAAO;AAC/B;",
6
- "names": ["item"]
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\n/* eslint-disable react/function-component-definition */\nimport React, { useCallback, useEffect } from 'react';\nimport { DndContext, DragOverlay, SortableContext, useTreeDndkitConfig } from '@elliemae/ds-drag-and-drop';\nimport { createPortal } from 'react-dom';\nimport { useInternalStore, usePropsStore } from '../../config/useStore';\nimport { ItemOverlay } from '../Item/ItemOverlay';\n\ntype FunctionalHOC = <T = any>(Component: React.ComponentType<T>, ...other: any[]) => (props: T) => JSX.Element;\n\n// only wraps in \"DnDContext\" and \"DnDTreeContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDRowContext: FunctionalHOC = (Component) => (props) => {\n const { isDestinationPanel } = props;\n const itemList = useInternalStore((state) =>\n isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData,\n );\n\n const withDragNDrop = usePropsStore((state) =>\n isDestinationPanel ? !state.removeDragAndDropFromDestination : state.addDragAndDropFromSource,\n );\n\n const setOverId = useInternalStore((state) => state.setOverId);\n const setIsDropValid = useInternalStore((state) => state.setIsDropValid);\n const setLastActiveId = useInternalStore((state) => state.setLastActiveId);\n const setDropIndicatorPosition = useInternalStore((state) => state.setDropIndicatorPosition);\n\n const onItemsReorder = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationReorder : state.onSourceReorder,\n );\n\n const onReorder = useCallback(\n (newData: unknown, metadata: { targetIndex: number; active: unknown }) => {\n onItemsReorder(newData, { active: metadata.active.original, targetIndex: metadata.targetIndex });\n },\n [onItemsReorder],\n );\n\n const { dndContextProps, sortableContextProps, activeId, overId, dropIndicatorPosition, isDropValid } =\n useTreeDndkitConfig({\n flattenedItems: itemList,\n visibleItems: itemList,\n isHorizontalDnD: false,\n isExpandable: false,\n onReorder,\n maxDragAndDropLevel: 0,\n getIsDropValid: () => true,\n });\n\n useEffect(() => {\n setLastActiveId(activeId);\n }, [activeId, setLastActiveId]);\n\n useEffect(() => {\n setOverId(overId);\n }, [overId, setOverId]);\n\n useEffect(() => {\n setIsDropValid(isDropValid);\n }, [isDropValid, setIsDropValid]);\n\n useEffect(() => {\n setDropIndicatorPosition(dropIndicatorPosition);\n }, [dropIndicatorPosition, setDropIndicatorPosition]);\n\n const item = itemList.find((currentItem) => currentItem.original.id === activeId);\n if (withDragNDrop)\n return (\n <DndContext {...dndContextProps}>\n <SortableContext {...sortableContextProps}>\n <Component {...props} />\n </SortableContext>\n {createPortal(\n <DragOverlay style={{ width: 'auto' }}>\n {activeId ? <ItemOverlay item={item} {...props} /> : null}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n );\n return <Component {...props} />;\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACmEjB,SAEI,KAFJ;AAjEN,SAAgB,aAAa,iBAAiB;AAC9C,SAAS,YAAY,aAAa,iBAAiB,2BAA2B;AAC9E,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB,qBAAqB;AAChD,SAAS,mBAAmB;AAKrB,MAAM,+BAA8C,CAAC,cAAc,CAAC,UAAU;AACnF,QAAM,EAAE,mBAAmB,IAAI;AAC/B,QAAM,WAAW;AAAA,IAAiB,CAAC,UACjC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AAEA,QAAM,gBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,CAAC,MAAM,mCAAmC,MAAM;AAAA,EACvE;AAEA,QAAM,YAAY,iBAAiB,CAAC,UAAU,MAAM,SAAS;AAC7D,QAAM,iBAAiB,iBAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AACzE,QAAM,2BAA2B,iBAAiB,CAAC,UAAU,MAAM,wBAAwB;AAE3F,QAAM,iBAAiB;AAAA,IAAc,CAAC,UACpC,qBAAqB,MAAM,uBAAuB,MAAM;AAAA,EAC1D;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,SAAkB,aAAuD;AACxE,qBAAe,SAAS,EAAE,QAAQ,SAAS,OAAO,UAAU,aAAa,SAAS,YAAY,CAAC;AAAA,IACjG;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,QAAM,EAAE,iBAAiB,sBAAsB,UAAU,QAAQ,uBAAuB,YAAY,IAClG,oBAAoB;AAAA,IAClB,gBAAgB;AAAA,IAChB,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,cAAc;AAAA,IACd;AAAA,IACA,qBAAqB;AAAA,IACrB,gBAAgB,MAAM;AAAA,EACxB,CAAC;AAEH,YAAU,MAAM;AACd,oBAAgB,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,eAAe,CAAC;AAE9B,YAAU,MAAM;AACd,cAAU,MAAM;AAAA,EAClB,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,YAAU,MAAM;AACd,mBAAe,WAAW;AAAA,EAC5B,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,YAAU,MAAM;AACd,6BAAyB,qBAAqB;AAAA,EAChD,GAAG,CAAC,uBAAuB,wBAAwB,CAAC;AAEpD,QAAM,OAAO,SAAS,KAAK,CAAC,gBAAgB,YAAY,SAAS,OAAO,QAAQ;AAChF,MAAI;AACF,WACE,qBAAC,cAAY,GAAG,iBACd;AAAA,0BAAC,mBAAiB,GAAG,sBACnB,8BAAC,aAAW,GAAG,OAAO,GACxB;AAAA,MACC;AAAA,QACC,oBAAC,eAAY,OAAO,EAAE,OAAO,OAAO,GACjC,qBAAW,oBAAC,eAAY,MAAa,GAAG,OAAO,IAAK,MACvD;AAAA,QACA,SAAS;AAAA,MACX;AAAA,OACF;AAEJ,SAAO,oBAAC,aAAW,GAAG,OAAO;AAC/B;",
6
+ "names": []
7
7
  }
package/dist/esm/parts/Item/ItemActions/useActionsLogicHandlers.js CHANGED
@@ -11,6 +11,9 @@ const useActionsLogicHandlers = (itemMeta) => {
11
11
  const currOnChange = usePropsStore(
12
12
  (state) => isDestinationPanel ? state.onDestinationChange : state.onSourceChange
13
13
  );
14
+ const currOnRemove = usePropsStore(
15
+ (state) => isDestinationPanel ? state.onDestinationRemove : state.onSourceRemove
16
+ );
14
17
  const currDrilldown = usePropsStore(
15
18
  (state) => isDestinationPanel ? state.onDestinationDrilldown : state.onSourceDrilldown
16
19
  );
@@ -18,6 +21,7 @@ const useActionsLogicHandlers = (itemMeta) => {
18
21
  const otherPanelOnChange = usePropsStore(
19
22
  (state) => isDestinationPanel ? state.onSourceChange : state.onDestinationChange
20
23
  );
24
+ const otherPanelOnAdd = usePropsStore((state) => isDestinationPanel ? state.onSourceAdd : state.onDestinationAdd);
21
25
  const handleDrilldown = React2.useCallback(
22
26
  (event) => {
23
27
  event.preventDefault();
@@ -36,10 +40,21 @@ const useActionsLogicHandlers = (itemMeta) => {
36
40
  currWithSoftDelete,
37
41
  otherData
38
42
  });
43
+ currOnRemove([item.original], { event });
44
+ otherPanelOnAdd([item.original], { event });
39
45
  currOnChange(newCurrData, { item: item.original, event });
40
46
  otherPanelOnChange(newOtherData, { item: item.original, event });
41
47
  },
42
- [currData, currOnChange, currWithSoftDelete, item, otherData, otherPanelOnChange]
48
+ [
49
+ currData,
50
+ currOnChange,
51
+ currOnRemove,
52
+ currWithSoftDelete,
53
+ item.original,
54
+ otherData,
55
+ otherPanelOnAdd,
56
+ otherPanelOnChange
57
+ ]
43
58
  );
44
59
  return React2.useMemo(() => ({ handleDrilldown, handleSingleMove }), [handleDrilldown, handleSingleMove]);
45
60
  };
package/dist/esm/parts/Item/ItemActions/useActionsLogicHandlers.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Item/ItemActions/useActionsLogicHandlers.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types';\nimport { usePropsStore } from '../../../config/useStore';\nimport { getNewDatasWithItemMoved } from '../../../config/itemMovementHelpers';\n\nexport const useActionsLogicHandlers = (itemMeta: DSShuttleV2T.ItemMeta) => {\n const { item, isDestinationPanel } = itemMeta;\n\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 currDrilldown = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationDrilldown : state.onSourceDrilldown,\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\n const handleDrilldown = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n currDrilldown(item.original, { event });\n },\n [currDrilldown, item],\n );\n\n const handleSingleMove = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n const { newCurrData, newOtherData } = getNewDatasWithItemMoved({\n item: item.original,\n currData,\n currWithSoftDelete,\n otherData,\n });\n\n currOnChange(newCurrData, { item: item.original, event });\n otherPanelOnChange(newOtherData, { item: item.original, event });\n },\n [currData, currOnChange, currWithSoftDelete, item, otherData, otherPanelOnChange],\n );\n return React.useMemo(() => ({ handleDrilldown, handleSingleMove }), [handleDrilldown, handleSingleMove]);\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAElB,SAAS,qBAAqB;AAC9B,SAAS,gCAAgC;AAElC,MAAM,0BAA0B,CAAC,aAAoC;AAC1E,QAAM,EAAE,MAAM,mBAAmB,IAAI;AAErC,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,gBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,MAAM,yBAAyB,MAAM;AAAA,EAC5D;AAEA,QAAM,YAAY,cAAc,CAAC,UAAW,qBAAqB,MAAM,aAAa,MAAM,eAAgB;AAC1G,QAAM,qBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,iBAAiB,MAAM;AAAA,EACpD;AAEA,QAAM,kBAAkBA,OAAM;AAAA,IAC5B,CAAC,UAAwF;AACvF,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,oBAAc,KAAK,UAAU,EAAE,MAAM,CAAC;AAAA,IACxC;AAAA,IACA,CAAC,eAAe,IAAI;AAAA,EACtB;AAEA,QAAM,mBAAmBA,OAAM;AAAA,IAC7B,CAAC,UAAwF;AACvF,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,YAAM,EAAE,aAAa,aAAa,IAAI,yBAAyB;AAAA,QAC7D,MAAM,KAAK;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAED,mBAAa,aAAa,EAAE,MAAM,KAAK,UAAU,MAAM,CAAC;AACxD,yBAAmB,cAAc,EAAE,MAAM,KAAK,UAAU,MAAM,CAAC;AAAA,IACjE;AAAA,IACA,CAAC,UAAU,cAAc,oBAAoB,MAAM,WAAW,kBAAkB;AAAA,EAClF;AACA,SAAOA,OAAM,QAAQ,OAAO,EAAE,iBAAiB,iBAAiB,IAAI,CAAC,iBAAiB,gBAAgB,CAAC;AACzG;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types';\nimport { usePropsStore } from '../../../config/useStore';\nimport { getNewDatasWithItemMoved } from '../../../config/itemMovementHelpers';\n\nexport const useActionsLogicHandlers = (itemMeta: DSShuttleV2T.ItemMeta) => {\n const { item, isDestinationPanel } = itemMeta;\n\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 currDrilldown = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationDrilldown : state.onSourceDrilldown,\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\n const handleDrilldown = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n currDrilldown(item.original, { event });\n },\n [currDrilldown, item],\n );\n\n const handleSingleMove = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n const { newCurrData, newOtherData } = getNewDatasWithItemMoved({\n item: item.original,\n currData,\n currWithSoftDelete,\n otherData,\n });\n currOnRemove([item.original], { event });\n otherPanelOnAdd([item.original], { event });\n\n currOnChange(newCurrData, { item: item.original, event });\n otherPanelOnChange(newOtherData, { item: item.original, event });\n },\n [\n currData,\n currOnChange,\n currOnRemove,\n currWithSoftDelete,\n item.original,\n otherData,\n otherPanelOnAdd,\n otherPanelOnChange,\n ],\n );\n return React.useMemo(() => ({ handleDrilldown, handleSingleMove }), [handleDrilldown, handleSingleMove]);\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAElB,SAAS,qBAAqB;AAC9B,SAAS,gCAAgC;AAElC,MAAM,0BAA0B,CAAC,aAAoC;AAC1E,QAAM,EAAE,MAAM,mBAAmB,IAAI;AAErC,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,eAAe;AAAA,IAAc,CAAC,UAClC,qBAAqB,MAAM,sBAAsB,MAAM;AAAA,EACzD;AAEA,QAAM,gBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,MAAM,yBAAyB,MAAM;AAAA,EAC5D;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,kBAAkB,cAAc,CAAC,UAAW,qBAAqB,MAAM,cAAc,MAAM,gBAAiB;AAElH,QAAM,kBAAkBA,OAAM;AAAA,IAC5B,CAAC,UAAwF;AACvF,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,oBAAc,KAAK,UAAU,EAAE,MAAM,CAAC;AAAA,IACxC;AAAA,IACA,CAAC,eAAe,IAAI;AAAA,EACtB;AAEA,QAAM,mBAAmBA,OAAM;AAAA,IAC7B,CAAC,UAAwF;AACvF,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,YAAM,EAAE,aAAa,aAAa,IAAI,yBAAyB;AAAA,QAC7D,MAAM,KAAK;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AACD,mBAAa,CAAC,KAAK,QAAQ,GAAG,EAAE,MAAM,CAAC;AACvC,sBAAgB,CAAC,KAAK,QAAQ,GAAG,EAAE,MAAM,CAAC;AAE1C,mBAAa,aAAa,EAAE,MAAM,KAAK,UAAU,MAAM,CAAC;AACxD,yBAAmB,cAAc,EAAE,MAAM,KAAK,UAAU,MAAM,CAAC;AAAA,IACjE;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,KAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACA,SAAOA,OAAM,QAAQ,OAAO,EAAE,iBAAiB,iBAAiB,IAAI,CAAC,iBAAiB,gBAAgB,CAAC;AACzG;",
6
6
  "names": ["React"]
7
7
  }
package/dist/esm/react-desc-prop-types.js CHANGED
@@ -8,12 +8,24 @@ const defaultProps = {
8
8
  sourceIsLoadingMore: false,
9
9
  onSourceLoadMore: () => {
10
10
  },
11
+ onSourceChange: () => {
12
+ },
13
+ onSourceAdd: () => {
14
+ },
15
+ onSourceRemove: () => {
16
+ },
11
17
  destinationWithSoftDelete: false,
12
18
  removeDragAndDropFromDestination: false,
13
19
  destinationIsLoading: false,
14
20
  destinationWithLoadMore: false,
15
21
  destinationIsLoadingMore: false,
16
22
  onDestinationLoadMore: () => {
23
+ },
24
+ onDestinationChange: () => {
25
+ },
26
+ onDestinationAdd: () => {
27
+ },
28
+ onDestinationRemove: () => {
17
29
  }
18
30
  };
19
31
  const DSSkeletonPropTypes = {
package/dist/esm/react-desc-prop-types.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.ts"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { WeakValidationMap } from 'react';\nimport type React from 'react';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-utilities';\nimport { globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-utilities';\nimport { type DSControlledCheckboxT } from '@elliemae/ds-form-checkbox';\nimport { type DSButtonT } from '@elliemae/ds-button';\nimport { type useSortable } from '@elliemae/ds-drag-and-drop';\n\nexport declare namespace DSShuttleV2T {\n export type PanelMetaInfo = { isDestinationPanel: boolean };\n export interface ItemMeta extends PanelMetaInfo {\n item: DSShuttleV2T.ConfiguredDatum;\n withDragNDrop: boolean;\n useSortableHelpers?: ReturnType<typeof useSortable>;\n }\n\n export interface Datum extends Record<string, unknown> {\n id: string;\n label: string;\n subtitle?: string;\n Icon?: React.ComponentType<ItemMeta>;\n CustomRenderer?: React.ComponentType<ItemMeta>;\n softDeleted?: boolean;\n preventDrilldown?: boolean;\n preventMove?: boolean;\n }\n export interface ConfiguredDatum {\n isFirst: boolean;\n isLast: boolean;\n isSelected: boolean;\n selectionPrevented: boolean;\n withActions: boolean;\n withMoveBtn: boolean;\n withDrilldownBtn: boolean;\n original: Datum;\n localIndex: number;\n }\n\n type SelectionMap = Record<string, boolean>;\n type OnDataChange = (\n newData: Datum[],\n metainfo: {\n event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>;\n item?: Datum;\n selectedItems?: Datum[];\n },\n ) => void;\n type OnSelectionChange = (\n newSelection: SelectionMap,\n metainfo: {\n event:\n | Parameters<Required<DSButtonT.Props>['onClick']>[0]\n | Parameters<DSControlledCheckboxT.InternalProps['onChange']>[1]\n | React.MouseEvent<HTMLButtonElement | HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>\n | React.ChangeEvent<HTMLInputElement>;\n item?: Datum;\n },\n ) => void;\n type OnSelectionDrilldown = (\n item: Datum,\n metainfo: { event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement> },\n ) => void;\n\n type OnLoadMore = (e: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => void;\n\n export interface RequiredProps {\n sourceData: Datum[];\n onSourceChange: OnDataChange;\n sourceSelectedItems: SelectionMap;\n onSourceSelectionChange: OnSelectionChange;\n SourceHeader: React.ComponentType<unknown>;\n onSourceDrilldown: OnSelectionDrilldown;\n\n destinationData: Datum[];\n onDestinationChange: OnDataChange;\n destinationSelectedItems: SelectionMap;\n onDestinationSelectionChange: OnSelectionChange;\n DestinationHeader: React.ComponentType<unknown>;\n onDestinationDrilldown: OnSelectionDrilldown;\n }\n\n export interface DefaultProps {\n sourceIsLoading: boolean;\n sourceWithSoftDelete: boolean;\n sourceWithLoadMore: boolean;\n sourceIsLoadingMore: boolean;\n onSourceLoadMore: OnLoadMore;\n addDragAndDropFromSource: boolean;\n removeDragAndDropFromDestination: boolean;\n destinationIsLoading: boolean;\n destinationWithSoftDelete: boolean;\n destinationWithLoadMore: boolean;\n destinationIsLoadingMore: boolean;\n onDestinationLoadMore: OnLoadMore;\n }\n\n type OnFilterChange = (\n newfilter: string | null,\n metainfo: { event: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<HTMLButtonElement> },\n ) => void;\n type OnSearchbarOpen = (\n newfilter: boolean,\n metainfo: { event: Parameters<Required<DSButtonT.Props>['onClick']>[0] },\n ) => void;\n export interface OptionalProps {\n sourceItemProps?: Record<string, unknown>;\n destinationItemProps?: Record<string, unknown>;\n sourceFilterValue?: string;\n onSourceFilterChange?: OnFilterChange;\n onSourceOpenSearchbar?: OnSearchbarOpen;\n sourceShowSearchbar?: boolean;\n destinationFilterValue?: string;\n onDestinationFilterChange?: OnFilterChange;\n onDesinationOpenSearchbar?: OnSearchbarOpen;\n destinationShowSearchbar?: boolean;\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSShuttleV2T.DefaultProps = {\n sourceWithSoftDelete: false,\n addDragAndDropFromSource: false,\n sourceIsLoading: false,\n sourceWithLoadMore: false,\n sourceIsLoadingMore: false,\n onSourceLoadMore: () => {},\n\n destinationWithSoftDelete: false,\n removeDragAndDropFromDestination: false,\n destinationIsLoading: false,\n destinationWithLoadMore: false,\n destinationIsLoadingMore: false,\n onDestinationLoadMore: () => {},\n};\n\nexport const DSSkeletonPropTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n} as WeakValidationMap<unknown>;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACGvB,SAAS,2BAA2B,wBAAwB;AAkIrD,MAAM,eAA0C;AAAA,EACrD,sBAAsB;AAAA,EACtB,0BAA0B;AAAA,EAC1B,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB,qBAAqB;AAAA,EACrB,kBAAkB,MAAM;AAAA,EAAC;AAAA,EAEzB,2BAA2B;AAAA,EAC3B,kCAAkC;AAAA,EAClC,sBAAsB;AAAA,EACtB,yBAAyB;AAAA,EACzB,0BAA0B;AAAA,EAC1B,uBAAuB,MAAM;AAAA,EAAC;AAChC;AAEO,MAAM,sBAAsB;AAAA,EACjC,GAAG;AAAA,EACH,GAAG;AACL;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { WeakValidationMap } from 'react';\nimport type React from 'react';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-utilities';\nimport { globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-utilities';\nimport { type DSControlledCheckboxT } from '@elliemae/ds-form-checkbox';\nimport { type DSButtonT } from '@elliemae/ds-button';\nimport { type useSortable } from '@elliemae/ds-drag-and-drop';\n\nexport declare namespace DSShuttleV2T {\n export type PanelMetaInfo = { isDestinationPanel: boolean };\n export interface ItemMeta extends PanelMetaInfo {\n item: DSShuttleV2T.ConfiguredDatum;\n withDragNDrop: boolean;\n useSortableHelpers?: ReturnType<typeof useSortable>;\n }\n\n export interface Datum extends Record<string, unknown> {\n id: string;\n label: string;\n subtitle?: string;\n Icon?: React.ComponentType<ItemMeta>;\n CustomRenderer?: React.ComponentType<ItemMeta>;\n softDeleted?: boolean;\n preventDrilldown?: boolean;\n preventMove?: boolean;\n }\n export interface ConfiguredDatum {\n isFirst: boolean;\n isLast: boolean;\n isSelected: boolean;\n selectionPrevented: boolean;\n withActions: boolean;\n withMoveBtn: boolean;\n withDrilldownBtn: boolean;\n original: Datum;\n localIndex: number;\n }\n\n type SelectionMap = Record<string, boolean>;\n type OnDataChange = (\n newData: Datum[],\n metainfo: {\n event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>;\n item?: Datum;\n selectedItems?: Datum[];\n },\n ) => void;\n\n type OnChangeEvent = (\n items: Datum[],\n metainfo: {\n event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>;\n },\n ) => void;\n\n type OnReorderEvent = (newData: Datum[], metadata: { active: Datum; targetIndex: number }) => void;\n\n type OnSelectionChange = (\n newSelection: SelectionMap,\n metainfo: {\n event:\n | Parameters<Required<DSButtonT.Props>['onClick']>[0]\n | Parameters<DSControlledCheckboxT.InternalProps['onChange']>[1]\n | React.MouseEvent<HTMLButtonElement | HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>\n | React.ChangeEvent<HTMLInputElement>;\n item?: Datum;\n },\n ) => void;\n type OnSelectionDrilldown = (\n item: Datum,\n metainfo: { event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement> },\n ) => void;\n\n type OnLoadMore = (e: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => void;\n\n export interface RequiredProps {\n sourceData: Datum[];\n sourceSelectedItems: SelectionMap;\n onSourceSelectionChange: OnSelectionChange;\n SourceHeader: React.ComponentType<unknown>;\n onSourceDrilldown: OnSelectionDrilldown;\n\n destinationData: Datum[];\n destinationSelectedItems: SelectionMap;\n onDestinationSelectionChange: OnSelectionChange;\n DestinationHeader: React.ComponentType<unknown>;\n onDestinationDrilldown: OnSelectionDrilldown;\n }\n\n export interface DefaultProps {\n sourceIsLoading: boolean;\n sourceWithSoftDelete: boolean;\n sourceWithLoadMore: boolean;\n sourceIsLoadingMore: boolean;\n onSourceChange: OnDataChange;\n onSourceAdd: OnChangeEvent;\n onSourceRemove: OnChangeEvent;\n onSourceReorder: OnReorderEvent;\n onSourceLoadMore: OnLoadMore;\n addDragAndDropFromSource: boolean;\n removeDragAndDropFromDestination: boolean;\n destinationIsLoading: boolean;\n destinationWithSoftDelete: boolean;\n destinationWithLoadMore: boolean;\n destinationIsLoadingMore: boolean;\n onDestinationLoadMore: OnLoadMore;\n onDestinationChange: OnDataChange;\n onDestinationAdd: OnChangeEvent;\n onDestinationRemove: OnChangeEvent;\n onDestinationReorder: OnReorderEvent;\n }\n\n type OnFilterChange = (\n newfilter: string | null,\n metainfo: { event: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<HTMLButtonElement> },\n ) => void;\n type OnSearchbarOpen = (\n newfilter: boolean,\n metainfo: { event: Parameters<Required<DSButtonT.Props>['onClick']>[0] },\n ) => void;\n export interface OptionalProps {\n sourceItemProps?: Record<string, unknown>;\n destinationItemProps?: Record<string, unknown>;\n sourceFilterValue?: string;\n\n onSourceFilterChange?: OnFilterChange;\n onSourceOpenSearchbar?: OnSearchbarOpen;\n sourceShowSearchbar?: boolean;\n destinationFilterValue?: string;\n onDestinationFilterChange?: OnFilterChange;\n onDesinationOpenSearchbar?: OnSearchbarOpen;\n destinationShowSearchbar?: boolean;\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSShuttleV2T.DefaultProps = {\n sourceWithSoftDelete: false,\n addDragAndDropFromSource: false,\n sourceIsLoading: false,\n sourceWithLoadMore: false,\n sourceIsLoadingMore: false,\n onSourceLoadMore: () => {},\n onSourceChange: () => {},\n onSourceAdd: () => {},\n onSourceRemove: () => {},\n\n destinationWithSoftDelete: false,\n removeDragAndDropFromDestination: false,\n destinationIsLoading: false,\n destinationWithLoadMore: false,\n destinationIsLoadingMore: false,\n onDestinationLoadMore: () => {},\n onDestinationChange: () => {},\n onDestinationAdd: () => {},\n onDestinationRemove: () => {},\n};\n\nexport const DSSkeletonPropTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n} as WeakValidationMap<unknown>;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACGvB,SAAS,2BAA2B,wBAAwB;AAmJrD,MAAM,eAA0C;AAAA,EACrD,sBAAsB;AAAA,EACtB,0BAA0B;AAAA,EAC1B,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB,qBAAqB;AAAA,EACrB,kBAAkB,MAAM;AAAA,EAAC;AAAA,EACzB,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,gBAAgB,MAAM;AAAA,EAAC;AAAA,EAEvB,2BAA2B;AAAA,EAC3B,kCAAkC;AAAA,EAClC,sBAAsB;AAAA,EACtB,yBAAyB;AAAA,EACzB,0BAA0B;AAAA,EAC1B,uBAAuB,MAAM;AAAA,EAAC;AAAA,EAC9B,qBAAqB,MAAM;AAAA,EAAC;AAAA,EAC5B,kBAAkB,MAAM;AAAA,EAAC;AAAA,EACzB,qBAAqB,MAAM;AAAA,EAAC;AAC9B;AAEO,MAAM,sBAAsB;AAAA,EACjC,GAAG;AAAA,EACH,GAAG;AACL;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-shuttle-v2",
3
- "version": "3.13.0-next.1",
3
+ "version": "3.13.0-next.2",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Shuttle v2",
6
6
  "files": [
@@ -36,17 +36,17 @@
36
36
  },
37
37
  "dependencies": {
38
38
  "zustand": "4.1.4",
39
- "@elliemae/ds-button": "3.13.0-next.1",
40
- "@elliemae/ds-circular-progress-indicator": "3.13.0-next.1",
41
- "@elliemae/ds-drag-and-drop": "3.13.0-next.1",
42
- "@elliemae/ds-form-checkbox": "3.13.0-next.1",
43
- "@elliemae/ds-form-input-text": "3.13.0-next.1",
44
- "@elliemae/ds-grid": "3.13.0-next.1",
45
- "@elliemae/ds-icons": "3.13.0-next.1",
46
- "@elliemae/ds-indeterminate-progress-indicator": "3.13.0-next.1",
47
- "@elliemae/ds-system": "3.13.0-next.1",
48
- "@elliemae/ds-typography": "3.13.0-next.1",
49
- "@elliemae/ds-utilities": "3.13.0-next.1"
39
+ "@elliemae/ds-button": "3.13.0-next.2",
40
+ "@elliemae/ds-circular-progress-indicator": "3.13.0-next.2",
41
+ "@elliemae/ds-drag-and-drop": "3.13.0-next.2",
42
+ "@elliemae/ds-form-checkbox": "3.13.0-next.2",
43
+ "@elliemae/ds-form-input-text": "3.13.0-next.2",
44
+ "@elliemae/ds-grid": "3.13.0-next.2",
45
+ "@elliemae/ds-icons": "3.13.0-next.2",
46
+ "@elliemae/ds-indeterminate-progress-indicator": "3.13.0-next.2",
47
+ "@elliemae/ds-system": "3.13.0-next.2",
48
+ "@elliemae/ds-typography": "3.13.0-next.2",
49
+ "@elliemae/ds-utilities": "3.13.0-next.2"
50
50
  },
51
51
  "devDependencies": {
52
52
  "lodash": "^4.17.21",
@@ -56,7 +56,6 @@
56
56
  "lodash": "^4.17.21",
57
57
  "react": "^17.0.2",
58
58
  "react-dom": "^17.0.2",
59
- "react-virtual": "~2.10.4",
60
59
  "styled-components": "~5.3.6"
61
60
  },
62
61
  "publishConfig": {