diff --git a/shiny/api-examples/accordion/app-express.py b/shiny/api-examples/accordion/app-express.py new file mode 100644 index 000000000..10aeb7c00 --- /dev/null +++ b/shiny/api-examples/accordion/app-express.py @@ -0,0 +1,30 @@ +from shiny.express import input, render, ui + +with ui.card(): + ui.card_header("Single selction accordion") + with ui.accordion(multiple=False, id="acc_single"): + with ui.accordion_panel("Section 1"): + "Some text for Section 1" + with ui.accordion_panel("Section 2"): + "More things on Section 2" + with ui.accordion_panel("Section 3"): + "Another great section" + + @render.text + def acc_single_val(): + return "Selected accordion: " + str(input.acc_single()) + + +with ui.card(): + ui.card_header("Multiple selction accordion") + with ui.accordion(multiple=True, id="acc_multiple"): + with ui.accordion_panel("Section 1"): + "Some text for Section 1" + with ui.accordion_panel("Section 2"): + "More things on Section 2" + with ui.accordion_panel("Section 3"): + "Another great section" + + @render.text + def acc_multiple_val(): + return "Selected accordions: " + str(input.acc_multiple()) diff --git a/shiny/api-examples/accordion/app.py b/shiny/api-examples/accordion/app.py index 5f278f6d6..6f1a95c83 100644 --- a/shiny/api-examples/accordion/app.py +++ b/shiny/api-examples/accordion/app.py @@ -22,14 +22,16 @@ def make_items(): app_ui = ui.page_fluid( - ui.markdown("#### Accordion: (`multiple=False`)"), - # Provide an id to create a shiny input binding - ui.accordion(*make_items(), id="acc_single", multiple=False), - ui.output_text_verbatim("acc_single_val", placeholder=True), - ui.tags.br(), - ui.markdown("#### Accordion: (`multiple=True`)"), - ui.accordion(*make_items(), id="acc_multiple"), - ui.output_text_verbatim("acc_multiple_val", placeholder=True), + ui.card( + ui.card_header("Single selection accordion"), + ui.accordion(*make_items(), id="acc_single", multiple=False), + ui.output_text_verbatim("acc_single_val", placeholder=True), + ), + ui.card( + ui.card_header("Multiple selection accordion"), + ui.accordion(*make_items(), id="acc_multiple"), + ui.output_text_verbatim("acc_multiple_val", placeholder=True), + ), ) diff --git a/shiny/api-examples/accordion_panel/app-express.py b/shiny/api-examples/accordion_panel/app-express.py new file mode 100644 index 000000000..c01659714 --- /dev/null +++ b/shiny/api-examples/accordion_panel/app-express.py @@ -0,0 +1,12 @@ +from shiny.express import input, render, ui + +ui.card_header("Single selection accordion") +with ui.accordion(multiple=False, id="acc"): + for letter in "ABCDE": + with ui.accordion_panel(f"Section {letter}"): + f"Some narrative for section {letter}" + + +@render.text +def acc_val(): + return "input.acc(): " + str(input.acc()) diff --git a/shiny/api-examples/card/app-express.py b/shiny/api-examples/card/app-express.py new file mode 100644 index 000000000..fb8eb3e70 --- /dev/null +++ b/shiny/api-examples/card/app-express.py @@ -0,0 +1,7 @@ +from shiny.express import ui + +with ui.card(full_screen=True): + ui.card_header("This is the header") + ui.p("This is the body") + ui.p("This is still the body.") + ui.card_footer("This is the footer") diff --git a/shiny/api-examples/card_footer/app-express.py b/shiny/api-examples/card_footer/app-express.py new file mode 100644 index 000000000..fb8eb3e70 --- /dev/null +++ b/shiny/api-examples/card_footer/app-express.py @@ -0,0 +1,7 @@ +from shiny.express import ui + +with ui.card(full_screen=True): + ui.card_header("This is the header") + ui.p("This is the body") + ui.p("This is still the body.") + ui.card_footer("This is the footer") diff --git a/shiny/api-examples/card_header/app-express.py b/shiny/api-examples/card_header/app-express.py new file mode 100644 index 000000000..fb8eb3e70 --- /dev/null +++ b/shiny/api-examples/card_header/app-express.py @@ -0,0 +1,7 @@ +from shiny.express import ui + +with ui.card(full_screen=True): + ui.card_header("This is the header") + ui.p("This is the body") + ui.p("This is still the body.") + ui.card_footer("This is the footer") diff --git a/shiny/api-examples/insert_accordion_panel/app-express.py b/shiny/api-examples/insert_accordion_panel/app-express.py new file mode 100644 index 000000000..fcad947f0 --- /dev/null +++ b/shiny/api-examples/insert_accordion_panel/app-express.py @@ -0,0 +1,26 @@ +import random + +from shiny import reactive +from shiny.express import expressify, input, ui + +with ui.sidebar(): + ui.input_action_button("add_panel", "Add random panel", class_="mt-3 mb-3") + +with ui.accordion(id="acc", multiple=True): + for letter in "ABCDE": + with ui.accordion_panel(f"Section {letter}"): + f"Some narrative for section {letter} " + "more narrative" + + +@reactive.effect +@reactive.event(input.add_panel) +@expressify +def _(): + letter = str(random.randint(0, 10000)) + with ui.hold() as panel: + with ui.accordion_panel(f"Section {letter}"): + f"Some narrative for section {letter} " + "more narrative" + + ui.insert_accordion_panel("acc", panel[0]) diff --git a/shiny/api-examples/nav_panel/app-express.py b/shiny/api-examples/nav_panel/app-express.py new file mode 100644 index 000000000..7342ff279 --- /dev/null +++ b/shiny/api-examples/nav_panel/app-express.py @@ -0,0 +1,10 @@ +from shiny.express import ui + +ui.page_opts(title="Basic Nav Examples") + + +with ui.navset_tab(): + with ui.nav_panel("One"): + "First tab content" + with ui.nav_panel("Two"): + "Second tab content" diff --git a/shiny/api-examples/navset_hidden/app-express.py b/shiny/api-examples/navset_hidden/app-express.py new file mode 100644 index 000000000..5fc22bd2a --- /dev/null +++ b/shiny/api-examples/navset_hidden/app-express.py @@ -0,0 +1,22 @@ +from shiny import reactive +from shiny.express import input, ui + +with ui.sidebar(): + ui.input_radio_buttons("controller", "Controller", ["1", "2", "3"], selected="1") + + +with ui.navset_hidden(id="hidden_tabs"): + with ui.nav_panel(None, value="panel1"): + "Panel 1 content" + with ui.nav_panel(None, value="panel2"): + "Panel 2 content" + with ui.nav_panel(None, value="panel3"): + "Panel 3 content" + with ui.nav_panel(None, value="panel4"): + "Panel 4 content" + + +@reactive.Effect +@reactive.event(input.controller) +def update_navs(): + ui.update_navs("hidden_tabs", selected="panel" + str(input.controller())) diff --git a/shiny/api-examples/showcase_bottom/app-express.py b/shiny/api-examples/showcase_bottom/app-express.py new file mode 100644 index 000000000..9b2e644bc --- /dev/null +++ b/shiny/api-examples/showcase_bottom/app-express.py @@ -0,0 +1,28 @@ +from icons import piggy_bank + +from shiny.express import ui + +with ui.layout_columns(): + with ui.value_box( + showcase=piggy_bank, theme="bg-gradient-orange-cyan", full_screen=True + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" + + with ui.value_box( + showcase=piggy_bank, + theme="text-green", + showcase_layout="top right", + full_screen=True, + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" + + with ui.value_box( + showcase=piggy_bank, theme="purple", showcase_layout="bottom", full_screen=True + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" diff --git a/shiny/api-examples/showcase_left_center/app-express.py b/shiny/api-examples/showcase_left_center/app-express.py new file mode 100644 index 000000000..9b2e644bc --- /dev/null +++ b/shiny/api-examples/showcase_left_center/app-express.py @@ -0,0 +1,28 @@ +from icons import piggy_bank + +from shiny.express import ui + +with ui.layout_columns(): + with ui.value_box( + showcase=piggy_bank, theme="bg-gradient-orange-cyan", full_screen=True + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" + + with ui.value_box( + showcase=piggy_bank, + theme="text-green", + showcase_layout="top right", + full_screen=True, + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" + + with ui.value_box( + showcase=piggy_bank, theme="purple", showcase_layout="bottom", full_screen=True + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" diff --git a/shiny/api-examples/showcase_top_right/app-express.py b/shiny/api-examples/showcase_top_right/app-express.py new file mode 100644 index 000000000..9b2e644bc --- /dev/null +++ b/shiny/api-examples/showcase_top_right/app-express.py @@ -0,0 +1,28 @@ +from icons import piggy_bank + +from shiny.express import ui + +with ui.layout_columns(): + with ui.value_box( + showcase=piggy_bank, theme="bg-gradient-orange-cyan", full_screen=True + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" + + with ui.value_box( + showcase=piggy_bank, + theme="text-green", + showcase_layout="top right", + full_screen=True, + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" + + with ui.value_box( + showcase=piggy_bank, theme="purple", showcase_layout="bottom", full_screen=True + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" diff --git a/shiny/api-examples/value_box/app-express.py b/shiny/api-examples/value_box/app-express.py new file mode 100644 index 000000000..9b2e644bc --- /dev/null +++ b/shiny/api-examples/value_box/app-express.py @@ -0,0 +1,28 @@ +from icons import piggy_bank + +from shiny.express import ui + +with ui.layout_columns(): + with ui.value_box( + showcase=piggy_bank, theme="bg-gradient-orange-cyan", full_screen=True + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" + + with ui.value_box( + showcase=piggy_bank, + theme="text-green", + showcase_layout="top right", + full_screen=True, + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" + + with ui.value_box( + showcase=piggy_bank, theme="purple", showcase_layout="bottom", full_screen=True + ): + "KPI Title" + "$1 Billion Dollars" + "Up 30% VS PREVIOUS 30 DAYS" diff --git a/shiny/api-examples/value_box/app.py b/shiny/api-examples/value_box/app.py index 1d5416ba7..804e0f957 100644 --- a/shiny/api-examples/value_box/app.py +++ b/shiny/api-examples/value_box/app.py @@ -3,7 +3,7 @@ from shiny import App, ui app_ui = ui.page_fluid( - ui.layout_column_wrap( + ui.layout_columns( ui.value_box( "KPI Title", "$1 Billion Dollars",