Skip to content

SelectionList is not properly displayed inside Collapsible #5690

Closed
@matkudela

Description

@matkudela

I found a situation where SelectionList is being cut when its mounted inside Collapsible. After toggling Collapsible last Selection from SelectionList is not displayed at all. Tested on textual 3.0.0
Simple MRE:

from __future__ import annotations

from textual.app import App, ComposeResult
from textual.containers import Horizontal
from textual.widgets import Footer, SelectionList, Input, Collapsible
from textual.widgets._selection_list import Selection


class CustomWidget(Horizontal):
    DEFAULT_CSS = """
    CustomWidget {
        height: auto;
        border: $primary outer;
        Input {
          width: 2fr;
        }
        SelectionList {
          width: 1fr;
        }
    }
    """

    def compose(self) -> ComposeResult:
        yield Input()
        with Collapsible(title="Toggle for options"):
            yield SelectionList[int](
                Selection("first selection", 1),
                Selection("second selection", 1),
                Selection("third selection", 1), # not visible after toggling collapsible
            )


class MyApp(App):
    def compose(self) -> ComposeResult:
        yield CustomWidget()
        yield Footer()


MyApp().run()

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions