docs: fit view on features flows on wrapper resize
This commit is contained in:
@@ -4,6 +4,7 @@ import type { VueFlowStore } from '@braks/vue-flow'
|
||||
|
||||
const breakpoints = useBreakpoints(breakpointsTailwind)
|
||||
|
||||
const el = ref()
|
||||
const instances: VueFlowStore[] = []
|
||||
|
||||
const onLoad = (instance: VueFlowStore) => {
|
||||
@@ -15,13 +16,15 @@ const fitViews = () => {
|
||||
instances.forEach((i) => i.fitView())
|
||||
}
|
||||
|
||||
watchDebounced([breakpoints.sm, breakpoints.md, breakpoints.lg, breakpoints.xl, breakpoints['2xl']], () => fitViews(), {
|
||||
debounce: 50,
|
||||
})
|
||||
const { stop } = useResizeObserver(
|
||||
el,
|
||||
useDebounceFn(() => fitViews(), 5),
|
||||
)
|
||||
onBeforeUnmount(stop)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="w-full dark:(bg-black text-white)">
|
||||
<div ref="el" class="w-full dark:(bg-black text-white)">
|
||||
<div
|
||||
class="flex flex-col divide-y divide-gray-500 md:divide-y-0 gap-12 md:gap-24 lg:gap-36 max-w-9/12 md:max-w-11/12 lg:max-w-9/12 m-auto py-12 md:py-24 text-center md:text-left"
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user