Tabulator in FloatPanel height size is not correct (MRE) when the floatpanel is dynamically added

I have what looks like a bug that has been challenging for me involving Tabulator and FloatPanel.

If you have a Tabulator in a FloatPanel it sizes correctly if it is loaded into the page directly (and contained is the default True); but if you load it dynamically into a Row with contained as either True or False then it does not size the height correctly of the FloatPanel. (It looks to me like there is something in the async calls that causes this problem–but I have reach the extent of my knowledge)

This code duplicates the problem.

import panel as pn
import pandas as pd

# Define your Panel layout here
layout = pn.Column('# Hello, World!')

pn.extension('tabulator')
pn.extension('floatpanel')

floating_panels_column = pn.Row(background='red')

df = pd.DataFrame({
    'int': [1, 2, 3,4, 5, 6],
    'float': [3.14, 6.28, 9.42, 10.56, 12.70, 15.84],
    'str': ['A', 'B', 'C', 'D', 'E', 'F'],
    'bool': [True, False, True, False, True, False]
}, index=[1, 2, 3, 4, 5, 6])

df_widget = pn.widgets.Tabulator(df, buttons={'Print': "<i class='fa fa-print'></i>"})

def process_click(event):
    print('process_click')
    floatpanel = pn.layout.FloatPanel(w1, df_widget, w2, name='Basic FloatPanel', margin=20)
    floatpanel.param.watch(floatpanel_close_callback, 'status')    
    floating_panels_column.append(floatpanel)

def floatpanel_close_callback(event):
    print('in callback')
    print(event)
    if event.obj.status == 'closed':
        print('closed')
        floating_panels_column.remove(event.obj)

w1 = pn.widgets.TextInput(name='Text:')
w2 = pn.widgets.FloatSlider(name='Slider')
floatpanel = pn.layout.FloatPanel(w1, df_widget, w2, name='Basic FloatPanel', margin=20)
floatpanel.param.watch(floatpanel_close_callback, 'status')    
floating_panels_column.append(floatpanel)

floatpanel = pn.layout.FloatPanel(w1, df_widget, w2, name='Basic FloatPanel', margin=20, contained=False)
floatpanel.param.watch(floatpanel_close_callback, 'status')    
floating_panels_column.append(floatpanel)


button = pn.widgets.Button(name='Click me')
button.on_click(process_click)
layout.append(button)
layout.append(floating_panels_column)
layout.append(pn.Column("This is a basic Panel layout."))
layout.servable()
1 Like

Just one more detail to add. It looks to be present when Tabulator is not used in FloatPanel, but no where near as obvious. Just slightly seen.

1 Like

Looks like a bug to me. Try posting this on Github as a bug.

Thanks. I finally opened a Github issue related to this, after some javascript step through debugging wasn’t very fruitful for me. Tabulator in FloatPanel height size is not correct (MRE) when the floatpanel is dynamically added · Issue #6196 · holoviz/panel · GitHub

1 Like