Skip to content

fix(nav_panel): Add .bslib-gap-spacing if nav panel is fillable #1154

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Feb 23, 2024
Merged

fix(nav_panel): Add .bslib-gap-spacing if nav panel is fillable #1154

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
7330b79
fix(tab-panel): Clone before modifying
gadenbuie Feb 23, 2024
769cd5c
fix(tab-pane): Add `.bslib-gap-spacing` to fillable `.tab-pane`
gadenbuie Feb 23, 2024
609e92b
docs(changelog): Add item
gadenbuie Feb 23, 2024
131b54a
chore(tests): Split test_navs into individual test cases
gadenbuie Feb 23, 2024
d286bd8
tests(navs): Update markup snapshot
gadenbuie Feb 23, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
* Fixed `input_task_button` not working in a Shiny module. (#1108)
* Fixed several issues with `page_navbar()` styling. (#1124)
* Fixed `Renderer.output_id` to not contain the module namespace prefix, only the output id. (#1130)
* Fixed gap-driven spacing between children in fillable `nav_panel()` containers. (#1152)

### Other changes

Expand Down
3 changes: 2 additions & 1 deletion shiny/ui/_navs.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1140,8 +1140,9 @@ def _make_tabs_fillable(
padding=as_css_padding(padding),
__bslib_navbar_margin="0;" if navbar else None,
)
child.add_style(cast(str, styles))
child = as_fillable_container(as_fill_item(child))
child.add_style(cast(str, styles))
child.add_class("bslib-gap-spacing")

content.children[i] = child

Expand Down
39 changes: 23 additions & 16 deletions tests/pytest/test_navs.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,19 +19,20 @@ def private_seed_n(n: int = 0) -> Generator[None, None, None]:
yield


def test_nav_markup():
a = ui.nav_panel("a", "a")
b = ui.nav_panel("b", "b")
c = ui.nav_panel("c", "c")
menu = ui.nav_menu(
"Menu",
c,
"----",
"Plain text",
"----",
ui.nav_control("Other item"),
)
a = ui.nav_panel("a", "a")
b = ui.nav_panel("b", "b")
c = ui.nav_panel("c", "c")
menu = ui.nav_menu(
"Menu",
c,
"----",
"Plain text",
"----",
ui.nav_control("Other item"),
)


def test_navset_tab_markup():
with private_seed_n():
x = ui.navset_tab(a, b, ui.nav_control("Some item"), menu)

Expand Down Expand Up @@ -65,6 +66,8 @@ def test_nav_markup():
</div>"""
)


def test_navset_pill_markup():
with private_seed_n():
x = ui.navset_pill(menu, a, id="navset_pill_id")

Expand Down Expand Up @@ -93,6 +96,8 @@ def test_nav_markup():
</div>"""
)


def test_navset_card_pill_markup():
with private_seed_n():
x = ui.navset_card_pill(
a,
Expand Down Expand Up @@ -124,15 +129,17 @@ def test_nav_markup():
</div>
<div class="card-body bslib-gap-spacing html-fill-item html-fill-container" style="margin-top:auto;margin-bottom:auto;flex:1 1 auto;">
<div class="tab-content html-fill-item html-fill-container" data-tabsetid="7311">
<div class="tab-pane html-fill-item html-fill-container" role="tabpanel" data-value="a" id="tab-7311-0" style="gap:0;padding:0;">a</div>
<div class="tab-pane active html-fill-item html-fill-container" role="tabpanel" data-value="c" id="tab-7890-0" style="gap:0;padding:0;">c</div>
<div class="tab-pane html-fill-item html-fill-container" role="tabpanel" data-value="b" id="tab-7311-2" style="gap:0;padding:0;">b</div>
<div class="tab-pane html-fill-item html-fill-container bslib-gap-spacing" role="tabpanel" data-value="a" id="tab-7311-0" style="gap:0;padding:0;">a</div>
<div class="tab-pane active html-fill-item html-fill-container bslib-gap-spacing" role="tabpanel" data-value="c" id="tab-7890-0" style="gap:0;padding:0;">c</div>
<div class="tab-pane html-fill-item html-fill-container bslib-gap-spacing" role="tabpanel" data-value="b" id="tab-7311-2" style="gap:0;padding:0;">b</div>
</div>
</div>
<script data-bslib-card-init="">window.bslib.Card.initializeAllCards();</script>
</div>"""
)


def test_navset_bar_markup():
with private_seed_n():
x = ui.navset_bar(
ui.nav_menu("Menu", "Plain text", c),
Expand Down Expand Up @@ -164,7 +171,7 @@ def test_nav_markup():
<div class="container-fluid html-fill-item html-fill-container">
Page header
<div class="tab-content html-fill-item html-fill-container" data-tabsetid="7311">
<div class="tab-pane active html-fill-item html-fill-container" role="tabpanel" data-value="c" id="tab-7890-1" style="--bslib-navbar-margin:0;;">c</div>
<div class="tab-pane active html-fill-item html-fill-container bslib-gap-spacing" role="tabpanel" data-value="c" id="tab-7890-1" style="--bslib-navbar-margin:0;;">c</div>
</div>
Page footer
</div>"""
Expand Down