diff --git a/README.md b/README.md
index c71a2d6..6cd91c5 100644
--- a/README.md
+++ b/README.md
@@ -123,6 +123,7 @@ The `` component accepts a few optional props:
- `duringSelection` (Function) Callback fired rapidly during selection (while the selector is being dragged). Passes an array containing selectable items currently under the selector to the callback function.
- `onSelectionFinish` (Function) Callback.
+- `onUnselectedFinish` (Function) Callback. Called at the same time as `onSelectionFinish`, this returns all the unselected values.
- `onSelectionClear` (Function) Callback.
- `onSelectedItemUnmount` (Function) Callback.
- `enableDeselect` (Boolean) Enables deselect with selectbox.
diff --git a/src/SelectableGroup.tsx b/src/SelectableGroup.tsx
index de4dabe..1090d8d 100644
--- a/src/SelectableGroup.tsx
+++ b/src/SelectableGroup.tsx
@@ -46,6 +46,7 @@ export type TSelectableGroupProps = {
selectionModeClass?: string
// Event that will fire when items are selected. Passes an array of keys.
onSelectionFinish?: Function
+ onUnselectedFinish?: (items: TSelectableItem[]) => void
onSelectionClear?: Function
onSelectedItemUnmount?: Function
enableDeselect?: boolean
@@ -168,6 +169,15 @@ export class SelectableGroup extends Component {
scrollLeft: 0,
}
+ onUnselectedFinish() {
+ if (!this.props.onUnselectedFinish) return
+ const a = this.registry
+ const b = this.selectedItems
+ const unselected = new Set(
+ [...a].filter(x => !b.has(x)));
+ this.props.onUnselectedFinish([...unselected])
+ }
+
componentDidMount() {
if (this.props.scrollContainer) {
this.scrollContainer = document.querySelector(this.props.scrollContainer)
@@ -459,6 +469,7 @@ export class SelectableGroup extends Component {
this.setState({ selectionMode: false })
this.props.onSelectionFinish!([...this.selectedItems])
+ this.onUnselectedFinish()
this.props.onSelectionClear!()
}
@@ -474,6 +485,7 @@ export class SelectableGroup extends Component {
this.setState({ selectionMode: true })
this.props.onSelectionFinish!([...this.selectedItems])
+ this.onUnselectedFinish()
}
isInIgnoreList(target: HTMLElement | null) {
@@ -619,6 +631,7 @@ export class SelectableGroup extends Component {
height: 0,
})
this.props.onSelectionFinish!([...this.selectedItems])
+ this.onUnselectedFinish()
}
this.toggleSelectionMode()
@@ -695,6 +708,7 @@ export class SelectableGroup extends Component {
)
onSelectionFinish!([...this.selectedItems], this.clickedItem)
+ this.onUnselectedFinish()
if (evt.which === 1) {
this.preventEvent(evt.target, 'click')