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 GitHub
commit 87ed2b4782
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

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>