feat(ToolbarBatchActions): Override cancel button

Fixes #1438.

Give the user the ability to override the functionality of the cancel button by passing in their own function. If no override is provided, the existing functionality of reseting selected row ids is preserved.

Example implementation:

```
<ToolbarBatchActions cancel={()=>{console.log("User clicked cancel!")}}>
 ...
</ToolbarBatchActions>
```
This commit is contained in:
naegelin 2022-08-11 14:07:28 -04:00 committed by Naegelin
commit 5e630d2873

View file

@ -6,6 +6,12 @@
export let formatTotalSelected = (totalSelected) =>
`${totalSelected} item${totalSelected === 1 ? "" : "s"} selected`;
/**
* Override the default behavior of the cancel button
* @type {function}
*/
export let cancel ;
import { onMount, getContext } from "svelte";
import Button from "../Button/Button.svelte";
@ -14,6 +20,15 @@
$: showActions = batchSelectedIds.length > 0;
const ctx = getContext("DataTable");
$: cancelClick = () => {
if (typeof cancel === "function") {
cancel();
} else {
ctx.resetSelectedRowIds()
}
};
const unsubscribe = ctx.batchSelectedIds.subscribe((value) => {
batchSelectedIds = value;
});
@ -49,7 +64,7 @@
<Button
class="bx--batch-summary__cancel"
tabindex="{showActions ? '0' : '-1'}"
on:click="{ctx.resetSelectedRowIds}"
on:click="{cancelClick}"
>
<slot name="cancel">Cancel</slot>
</Button>