mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-18 03:26:36 +00:00
fix(tab): do not trigger focus when mounting
This commit is contained in:
parent
73ac8b23c8
commit
7a70c1d608
1 changed files with 15 additions and 4 deletions
|
@ -20,16 +20,27 @@
|
||||||
/** Obtain a reference to the anchor HTML element */
|
/** Obtain a reference to the anchor HTML element */
|
||||||
export let ref = null;
|
export let ref = null;
|
||||||
|
|
||||||
import { getContext } from "svelte";
|
import { onMount, afterUpdate, getContext, tick } from "svelte";
|
||||||
|
|
||||||
const { selectedTab, add, update, change } = getContext("Tabs");
|
const { selectedTab, add, update, change } = getContext("Tabs");
|
||||||
|
|
||||||
add({ id, label, disabled });
|
add({ id, label, disabled });
|
||||||
|
|
||||||
|
let didMount = false;
|
||||||
|
|
||||||
$: selected = $selectedTab === id;
|
$: selected = $selectedTab === id;
|
||||||
$: if (selected && ref) {
|
|
||||||
ref.focus();
|
onMount(() => {
|
||||||
}
|
tick().then(() => {
|
||||||
|
didMount = true;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
afterUpdate(() => {
|
||||||
|
if (didMount && selected && ref) {
|
||||||
|
ref.focus();
|
||||||
|
}
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<li
|
<li
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue