Skip to content
Permalink
Browse files
fix(grid): update column count when content szie changes
  • Loading branch information
Akryum committed Oct 17, 2022
1 parent 091da7b commit 0786a57ea2019d6bee9285d4d18f54b67e5cd1dc
Show file tree
Hide file tree
Showing 2 changed files with 14 additions and 4 deletions.
@@ -8,9 +8,15 @@ import { logEvent } from 'histoire/client'
title="events/EventButtonGrid"
:layout="{ type: 'grid', width: 500 }"
>
<EventButton @myEvent="logEvent('My event', $event)" /><br>
<button @click="logEvent('Click', $event)">
Click
</button>
<Variant
v-for="n in 9"
:key="n"
:title="`Variant ${n}`"
>
<EventButton @myEvent="logEvent('My event', $event)" /><br>
<button @click="logEvent('Click', $event)">
Click
</button>
</Variant>
</Story>
</template>
@@ -107,6 +107,10 @@ onMounted(() => {
updateSize()
})
useResizeObserver(gridEl, () => {
updateSize()
})
const columnCount = computed(() => Math.min(storyStore.currentStory.variants.length, Math.floor((viewWidth.value + gap) / (gridColumnWidth.value + gap))))
</script>

0 comments on commit 0786a57

Please sign in to comment.