Browse Source

Fix bug rendering tabs inside a component which uses a svelte transition

master
Andrew Kingston 5 years ago
parent
commit
98ca5da073
  1. 16
      packages/bbui/src/Tabs/Tab.svelte

16
packages/bbui/src/Tabs/Tab.svelte

@ -8,11 +8,19 @@
const selected = getContext("tab") const selected = getContext("tab")
let tab let tab
let tabInfo let tabInfo
const setTabInfo = () => { const setTabInfo = () => {
tabInfo = tab.getBoundingClientRect() // If the tabs are being rendered inside a component which uses
if ($selected.title === title) { // a svelte transition to enter, then this initial getBoundingClientRect
$selected.info = tabInfo // will return an incorrect position.
} // We just need to get this off the main thread to fix this, by using
// a 0ms timeout.
setTimeout(() => {
tabInfo = tab.getBoundingClientRect()
if ($selected.title === title) {
$selected.info = tabInfo
}
}, 0)
} }
onMount(() => { onMount(() => {

Loading…
Cancel
Save