fix: remove waiting for node dimensions in transformation pane
* Fixes node dimensions having 0 values when paneReady is fired
This commit is contained in:
@@ -8,7 +8,7 @@ const DEFAULT_PADDING = 0.1
|
|||||||
|
|
||||||
const transition = (selection: D3Selection, ms = 0) => selection.transition().duration(ms)
|
const transition = (selection: D3Selection, ms = 0) => selection.transition().duration(ms)
|
||||||
|
|
||||||
export const untilDimensions = async (store: Store) => {
|
const untilDimensions = async (store: Store) => {
|
||||||
// if ssr we can't wait for dimensions, they'll never really exist
|
// if ssr we can't wait for dimensions, they'll never really exist
|
||||||
const window = useWindow()
|
const window = useWindow()
|
||||||
if ('screen' in window) {
|
if ('screen' in window) {
|
||||||
|
|||||||
@@ -1,12 +1,23 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import NodeRenderer from '../NodeRenderer/NodeRenderer.vue'
|
import NodeRenderer from '../NodeRenderer/NodeRenderer.vue'
|
||||||
import EdgeRenderer from '../EdgeRenderer/EdgeRenderer.vue'
|
import EdgeRenderer from '../EdgeRenderer/EdgeRenderer.vue'
|
||||||
import { useVueFlow, useZoomPanHelper, untilDimensions } from '../../composables'
|
import { useVueFlow, useZoomPanHelper, useWindow } from '../../composables'
|
||||||
import { FlowInstance } from '../../types'
|
import { FlowInstance, Store } from '../../types'
|
||||||
import { onLoadGetEdges, onLoadGetElements, onLoadGetNodes, onLoadProject, onLoadToObject } from '../../utils'
|
import { onLoadGetEdges, onLoadGetElements, onLoadGetNodes, onLoadProject, onLoadToObject } from '../../utils'
|
||||||
|
|
||||||
const { id, store } = useVueFlow()
|
const { id, store } = useVueFlow()
|
||||||
|
|
||||||
|
const untilDimensions = async (store: Store) => {
|
||||||
|
// if ssr we can't wait for dimensions, they'll never really exist
|
||||||
|
const window = useWindow()
|
||||||
|
if ('screen' in window) {
|
||||||
|
// wait until viewport dimensions has been established
|
||||||
|
await until(store.dimensions).toMatch(({ height, width }) => !isNaN(width) && width > 0 && !isNaN(height) && height > 0)
|
||||||
|
}
|
||||||
|
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
|
||||||
const ready = ref(false)
|
const ready = ref(false)
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const { zoomIn, zoomOut, zoomTo, setTransform, getTransform, fitView, fitBounds, setCenter } = useZoomPanHelper(store)
|
const { zoomIn, zoomOut, zoomTo, setTransform, getTransform, fitView, fitBounds, setCenter } = useZoomPanHelper(store)
|
||||||
|
|||||||
Reference in New Issue
Block a user