mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-18 11:36:36 +00:00
refactor: use shorthand unsubscribe
This commit is contained in:
parent
ab21c89ab9
commit
b756f84b65
4 changed files with 19 additions and 54 deletions
|
@ -17,25 +17,19 @@
|
|||
/** Obtain a reference to the button HTML element */
|
||||
export let ref = null;
|
||||
|
||||
import { afterUpdate, getContext, onMount } from "svelte";
|
||||
import { afterUpdate, getContext } from "svelte";
|
||||
|
||||
const ctx = getContext("ContentSwitcher");
|
||||
const { add, update, change, currentId } = getContext("ContentSwitcher");
|
||||
|
||||
ctx.add({ id, text, selected });
|
||||
add({ id, text, selected });
|
||||
|
||||
const unsubscribe = ctx.currentId.subscribe(($) => {
|
||||
selected = $ === id;
|
||||
});
|
||||
$: selected = $currentId === id;
|
||||
|
||||
afterUpdate(() => {
|
||||
if (selected) {
|
||||
ref.focus();
|
||||
}
|
||||
});
|
||||
|
||||
onMount(() => {
|
||||
return () => unsubscribe();
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- svelte-ignore a11y-mouse-events-have-key-events -->
|
||||
|
@ -52,7 +46,7 @@
|
|||
{...$$restProps}
|
||||
on:click
|
||||
on:click|preventDefault="{() => {
|
||||
ctx.update(id);
|
||||
update(id);
|
||||
}}"
|
||||
on:mouseover
|
||||
on:mouseenter
|
||||
|
@ -60,9 +54,9 @@
|
|||
on:keydown
|
||||
on:keydown="{({ key }) => {
|
||||
if (key === 'ArrowRight') {
|
||||
ctx.change(1);
|
||||
change(1);
|
||||
} else if (key === 'ArrowLeft') {
|
||||
ctx.change(-1);
|
||||
change(-1);
|
||||
}
|
||||
}}"
|
||||
>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue