Changing the Nested Select Width

I’m using the Nested Select widget, but no matter what I do it’s always the same width (too wide).

Example code shown below, with various attempts. What can I do to change the width?

Cheers!

import panel as pn

pn.extension()

# Define your nested options
options = {
    "Category A": {
        "Sub-Category A1": ["Item 1", "Item 2"],
        "Sub-Category A2": ["Item 3", "Item 4"],
    },
    "Category B": {
        "Sub-Category B1": ["Item 5", "Item 6"],
    },
}

# Create NestedSelect
nested_select = pn.widgets.NestedSelect(
    name="My Nested Select",
    options=options,
    sizing_mode='fixed',
    width=50)

# Create NestedSelect
#nested_select = pn.widgets.NestedSelect(
#    name="My Nested Select",
#    options=options,
#    width=50,
#)

#nested_select = pn.widgets.NestedSelect(
#    name="My Nested Select",
#    options=options,
#    layout={"type": pn.Column, "width": 50},  # Set the width of the internal layout
#)

nested_select.servable()

Thanks @grantgl, looking at it I can’t see a clean way to do it either. That seems like a big oversight. Could you file an issue requesting this?

Done, Nested Select widget does not change width · Issue #8298 · holoviz/panel · GitHub

1 Like