Odd behaviour with Tabs and ListSelector

Consider the following example:

πŸͺ· tree ./                            
β”œβ”€β”€ app.py
└── item_list
    β”œβ”€β”€ __init__.py
    β”œβ”€β”€ item_list.py
    β”œβ”€β”€ item.py


import hvplot.pandas
import numpy as np
import pandas as pd
import panel as pn
import param as pm

class Item(pm.Parameterized):
    value = pm.Integer(default=0, bounds=(0, 1000), instantiate=True)
    data = pm.DataFrame(instantiate=True)

    def get_data(self, x):
        data = pd.DataFrame({'x': list(range(x)), 'y': np.ones((x))})
        return data

    @pn.depends('value', watch=True, on_init=True)
    def update_data(self):
        self.data = self.get_data(self.value)

    def view_data_chart(self):
        return self.data.hvplot.line(x='x', y='y')

    def view(self):
        return pn.Row(self, self.view_data_chart())


import panel as pn
import param as pm

class ItemList(pm.Parameterized):
    items = pm.ListSelector()

    def view_items(self):
        return pn.Column(*[item.view() for item in self.items])

    def view(self):
        return pn.Column(self, self.view_items())


import panel as pn
from item_list.item import Item
from item_list.item_list import ItemList

item1 = Item(value=5)
item2 = Item(value=10)

item_list = ItemList(items=[item1, item2])

tabs = pn.Tabs(
    ('Item 1', item1.view()),
    ('Item 2', item2.view()),
    ('Item list', item_list.view()),


Served with:

panel serve app.py

Then this app gives really weird unexpected behavior!

Item 1 looks normal upon opening:

But Item 2 not working:

Item list not working:

Then going back to Item 1. Broken…

But if I refresh and then check out Item list…

What’s happening?

What’s the proper way to create a series of tabs that define interactive parameterized objects, and then a class with a ListSelector that contains those items?


Ahhh I’ve updated my packages and things seem to be working now.

Old versions:


Successfully installed bokeh-3.3.2 holoviews-1.18.1 hvplot-0.9.0 panel-1.3.4 param-2.0.1

1 Like