CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-08-05 13:21:26 +12:00
Code Issues Projects Releases Wiki Activity

Fix grid block having incorrect toolbar position in builder preview

Browse source
This commit is contained in:
Andrew Kingston 2024-05-17 11:24:51 +01:00
parent a705fbd497
commit 28e91959e5
1 changed files with 39 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

76
packages/client/src/components/app/GridBlock.svelte
View file

@ -44,6 +44,7 @@
$: schemaOverrides = getSchemaOverrides(parsedColumns)
$: enrichedButtons = enrichButtons(buttons)
$: selectedRows = deriveSelectedRows(gridContext)
$: styles = patchStyles($component.styles, minHeight)
$: data = { selectedRows: $selectedRows }
$: actions = [
{
@ -128,52 +129,54 @@
)
}
const patchStyles = (styles, minHeight) => {
return {
...styles,
normal: {
...styles?.normal,
"min-height": `${minHeight}px`,
},
}
}
onMount(() => {
gridContext = grid.getContext()
gridContext.minHeight.subscribe($height => (minHeight = $height))
})
</script>
<span style="--min-height:{minHeight}px">
<div
use:styleable={$component.styles}
class:in-builder={$builderStore.inBuilder}
>
<Grid
bind:this={grid}
datasource={table}
{API}
{stripeRows}
{quiet}
{initialFilter}
{initialSortColumn}
{initialSortOrder}
{fixedRowHeight}
{columnWhitelist}
{schemaOverrides}
canAddRows={allowAddRows}
canEditRows={allowEditRows}
canDeleteRows={allowDeleteRows}
canEditColumns={false}
canExpandRows={false}
canSaveSchema={false}
canSelectRows={true}
showControls={false}
notifySuccess={notificationStore.actions.success}
notifyError={notificationStore.actions.error}
buttons={enrichedButtons}
isCloud={$environmentStore.cloud}
on:rowclick={e => onRowClick?.({ row: e.detail })}
/>
</div>
</span>
<div use:styleable={styles} class:in-builder={$builderStore.inBuilder}>
<Grid
bind:this={grid}
datasource={table}
{API}
{stripeRows}
{quiet}
{initialFilter}
{initialSortColumn}
{initialSortOrder}
{fixedRowHeight}
{columnWhitelist}
{schemaOverrides}
canAddRows={allowAddRows}
canEditRows={allowEditRows}
canDeleteRows={allowDeleteRows}
canEditColumns={false}
canExpandRows={false}
canSaveSchema={false}
canSelectRows={true}
showControls={false}
notifySuccess={notificationStore.actions.success}
notifyError={notificationStore.actions.error}
buttons={enrichedButtons}
isCloud={$environmentStore.cloud}
on:rowclick={e => onRowClick?.({ row: e.detail })}
/>
</div>
<Provider {data} {actions} />
<style>
span {
display: contents;
}
div {
display: flex;
flex-direction: column;
@ -182,7 +185,6 @@
border-radius: 4px;
overflow: hidden;
height: 410px;
min-height: var(--min-height);
}
div.in-builder :global(*) {
pointer-events: none;