Fix bug where button columns couldn't observe dimensions when no rows exist
This commit is contained in:
parent
1a83b746b5
commit
35842525c5
|
@ -19,7 +19,7 @@
|
||||||
showVScrollbar,
|
showVScrollbar,
|
||||||
} = getContext("grid")
|
} = getContext("grid")
|
||||||
|
|
||||||
let measureContainer
|
let container
|
||||||
|
|
||||||
$: buttons = $props.buttons?.slice(0, 3) || []
|
$: buttons = $props.buttons?.slice(0, 3) || []
|
||||||
$: columnsWidth = $visibleColumns.reduce(
|
$: columnsWidth = $visibleColumns.reduce(
|
||||||
|
@ -40,7 +40,7 @@
|
||||||
const width = entries?.[0]?.contentRect?.width ?? 0
|
const width = entries?.[0]?.contentRect?.width ?? 0
|
||||||
buttonColumnWidth.set(width)
|
buttonColumnWidth.set(width)
|
||||||
})
|
})
|
||||||
observer.observe(measureContainer)
|
observer.observe(container)
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -51,7 +51,7 @@
|
||||||
class:hidden={$buttonColumnWidth === 0}
|
class:hidden={$buttonColumnWidth === 0}
|
||||||
>
|
>
|
||||||
<div class="content" on:mouseleave={() => ($hoveredRowId = null)}>
|
<div class="content" on:mouseleave={() => ($hoveredRowId = null)}>
|
||||||
<GridScrollWrapper scrollVertically attachHandlers>
|
<GridScrollWrapper scrollVertically attachHandlers bind:ref={container}>
|
||||||
{#each $renderedRows as row}
|
{#each $renderedRows as row}
|
||||||
{@const rowSelected = !!$selectedRows[row._id]}
|
{@const rowSelected = !!$selectedRows[row._id]}
|
||||||
{@const rowHovered = $hoveredRowId === row._id}
|
{@const rowHovered = $hoveredRowId === row._id}
|
||||||
|
@ -60,7 +60,6 @@
|
||||||
class="row"
|
class="row"
|
||||||
on:mouseenter={$isDragging ? null : () => ($hoveredRowId = row._id)}
|
on:mouseenter={$isDragging ? null : () => ($hoveredRowId = row._id)}
|
||||||
on:mouseleave={$isDragging ? null : () => ($hoveredRowId = null)}
|
on:mouseleave={$isDragging ? null : () => ($hoveredRowId = null)}
|
||||||
bind:this={measureContainer}
|
|
||||||
>
|
>
|
||||||
<GridCell
|
<GridCell
|
||||||
width="auto"
|
width="auto"
|
||||||
|
|
|
@ -18,6 +18,7 @@
|
||||||
export let scrollVertically = false
|
export let scrollVertically = false
|
||||||
export let scrollHorizontally = false
|
export let scrollHorizontally = false
|
||||||
export let attachHandlers = false
|
export let attachHandlers = false
|
||||||
|
export let ref
|
||||||
|
|
||||||
// Used for tracking touch events
|
// Used for tracking touch events
|
||||||
let initialTouchX
|
let initialTouchX
|
||||||
|
@ -109,7 +110,7 @@
|
||||||
on:touchmove={attachHandlers ? handleTouchMove : null}
|
on:touchmove={attachHandlers ? handleTouchMove : null}
|
||||||
on:click|self={() => ($focusedCellId = null)}
|
on:click|self={() => ($focusedCellId = null)}
|
||||||
>
|
>
|
||||||
<div {style} class="inner">
|
<div {style} class="inner" bind:this={ref}>
|
||||||
<slot />
|
<slot />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue