expressify-input-examples (#1057)

shiny/api-examples/input_action_link/app-express.py

@@ -0,0 +1,20 @@
+import matplotlib.pyplot as plt
+import numpy as np
+
+from shiny import reactive
+from shiny.express import input, render, ui
+
+ui.input_slider("n", "Number of observations", min=0, max=1000, value=500)
+ui.input_action_link("go", "Go!")
+
+
+@render.plot(alt="A histogram")
+# reactive.event() to invalidate the plot when the button is pressed but not when
+# the slider is changed
+@reactive.event(input.go, ignore_none=False)
+def plot():
+    np.random.seed(19680801)
+    x = 100 + 15 * np.random.randn(input.n())
+    fig, ax = plt.subplots()
+    ax.hist(x, bins=30, density=True)
+    return fig

shiny/api-examples/input_checkbox/app-express.py

@@ -0,0 +1,8 @@
+from shiny.express import input, render, ui
+
+ui.input_checkbox("somevalue", "Some value", False)
+
+
+@render.ui
+def value():
+    return input.somevalue()

shiny/api-examples/input_checkbox_group/app-express.py

@@ -0,0 +1,18 @@
+from shiny import req
+from shiny.express import input, render, ui
+
+ui.input_checkbox_group(
+    "colors",
+    "Choose color(s):",
+    {
+        "red": ui.span("Red", style="color: #FF0000;"),
+        "green": ui.span("Green", style="color: #00AA00;"),
+        "blue": ui.span("Blue", style="color: #0000AA;"),
+    },
+)
+
+
+@render.ui
+def val():
+    req(input.colors())
+    return "You chose " + ", ".join(input.colors())

shiny/api-examples/input_date/app-express.py

@@ -0,0 +1,24 @@
+from datetime import date
+
+from shiny.express import ui
+
+ui.input_date("date1", "Date:", value="2016-02-29")
+# Default value is the date in client's time zone
+ui.input_date("date2", "Date:")
+# value is always yyyy-mm-dd, even if the display format is different
+ui.input_date("date3", "Date:", value="2016-02-29", format="mm/dd/yy")
+# Pass in a Date object
+ui.input_date("date4", "Date:", value=date(2016, 2, 29))
+# Use different language and different first day of week
+ui.input_date("date5", "Date:", language="ru", weekstart=1)
+# Start with decade view instead of default month view
+ui.input_date("date6", "Date:", startview="decade")
+# Disable Mondays and Tuesdays.
+ui.input_date("date7", "Date:", daysofweekdisabled=[1, 2])
+# Disable specific dates.
+ui.input_date(
+    "date8",
+    "Date:",
+    value="2016-02-29",
+    datesdisabled=["2016-03-01", "2016-03-02"],
+)

shiny/api-examples/input_date_range/app-express.py

@@ -0,0 +1,27 @@
+from datetime import date
+
+from shiny.express import ui
+
+ui.input_date_range("daterange1", "Date range:", start="2001-01-01", end="2010-12-31")
+# Default start and end is the current date in the client's time zone
+ui.input_date_range("daterange2", "Date range:")
+# start and end are always specified in yyyy-mm-dd, even if the display
+# format is different
+ui.input_date_range(
+    "daterange3",
+    "Date range:",
+    start="2001-01-01",
+    end="2010-12-31",
+    min="2001-01-01",
+    max="2012-12-21",
+    format="mm/dd/yy",
+    separator=" - ",
+)
+# Pass in Date objects
+ui.input_date_range(
+    "daterange4", "Date range:", start=date(2001, 1, 1), end=date(2010, 12, 31)
+)
+# Use different language and different first day of week
+ui.input_date_range("daterange5", "Date range:", language="de", weekstart=1)
+# Start with decade view instead of default month view
+ui.input_date_range("daterange6", "Date range:", startview="decade")

shiny/api-examples/input_file/app-express.py

@@ -0,0 +1,48 @@
+import pandas as pd
+
+from shiny import reactive
+from shiny.express import input, render, ui
+from shiny.types import FileInfo
+
+ui.input_file("file1", "Choose CSV File", accept=[".csv"], multiple=False)
+ui.input_checkbox_group(
+    "stats",
+    "Summary Stats",
+    choices=["Row Count", "Column Count", "Column Names"],
+    selected=["Row Count", "Column Count", "Column Names"],
+)
+
+
+@reactive.Calc
+def parsed_file():
+    file: list[FileInfo] | None = input.file1()
+    if file is None:
+        return pd.DataFrame()
+    return pd.read_csv(file[0]["datapath"])  # pyright: ignore[reportUnknownMemberType]
+
+
+@render.table
+def summary():
+    df = parsed_file()
+
+    if df.empty:
+        return pd.DataFrame()
+
+    # Get the row count, column count, and column names of the DataFrame
+    row_count = df.shape[0]
+    column_count = df.shape[1]
+    names = df.columns.tolist()
+    column_names = ", ".join(str(name) for name in names)
+
+    # Create a new DataFrame to display the information
+    info_df = pd.DataFrame(
+        {
+            "Row Count": [row_count],
+            "Column Count": [column_count],
+            "Column Names": [column_names],
+        }
+    )
+
+    # input.stats() is a list of strings; subset the columns based on the selected
+    # checkboxes
+    return info_df.loc[:, input.stats()]

shiny/api-examples/input_numeric/app-express.py

@@ -0,0 +1,8 @@
+from shiny.express import input, render, ui
+
+ui.input_numeric("obs", "Observations:", 10, min=1, max=100)
+
+
+@render.code
+def value():
+    return input.obs()

shiny/api-examples/input_password/app-express.py

@@ -0,0 +1,11 @@
+from shiny import reactive
+from shiny.express import input, render, ui
+
+ui.input_password("password", "Password:")
+ui.input_action_button("go", "Go")
+
+
+@render.code
+@reactive.event(input.go)
+def value():
+    return input.password()

shiny/api-examples/input_radio_buttons/app-express.py

@@ -0,0 +1,15 @@
+from shiny.express import input, render, ui
+
+ui.input_radio_buttons(
+    "rb",
+    "Choose one:",
+    {
+        "html": ui.HTML("<span style='color:red;'>Red Text</span>"),
+        "text": "Normal text",
+    },
+)
+
+
+@render.express
+def val():
+    "You chose " + input.rb()

shiny/api-examples/input_select/app-express.py

@@ -0,0 +1,16 @@
+from shiny.express import input, render, ui
+
+ui.input_select(
+    "state",
+    "Choose a state:",
+    {
+        "East Coast": {"NY": "New York", "NJ": "New Jersey", "CT": "Connecticut"},
+        "West Coast": {"WA": "Washington", "OR": "Oregon", "CA": "California"},
+        "Midwest": {"MN": "Minnesota", "WI": "Wisconsin", "IA": "Iowa"},
+    },
+)
+
+
+@render.text
+def value():
+    return "You choose: " + str(input.state())

shiny/api-examples/input_selectize/app-express.py

@@ -0,0 +1,45 @@
+from html import escape  # noqa: F401
+
+from shiny.express import input, render, ui
+
+states = {
+    "East Coast": {"NY": "New York", "NJ": "New Jersey", "CT": "Connecticut"},
+    "West Coast": {"WA": "Washington", "OR": "Oregon", "CA": "California"},
+    "Midwest": {"MN": "Minnesota", "WI": "Wisconsin", "IA": "Iowa"},
+}
+
+ui.input_selectize(
+    "state",
+    "Choose a state:",
+    states,
+    multiple=True,
+)
+
+
+@render.text
+def value():
+    return "You choose: " + str(input.state())
+
+
+ui.input_selectize(
+    "state2",
+    "Selectize Options",
+    states,
+    multiple=True,
+    options=(
+        {
+            "placeholder": "Enter text",
+            "render": ui.js_eval(
+                '{option: function(item, escape) {return "<div><strong>Select " + escape(item.label) + "</strong></div>";}}'
+            ),
+            "create": True,
+        }
+    ),
+)
+ui.input_selectize(
+    "state3",
+    "Selectize plugins",
+    states,
+    multiple=True,
+    options={"plugins": ["clear_button"]},
+)

shiny/api-examples/input_selectize/app.py

@@ -17,7 +17,7 @@
     ),
     ui.output_text("value"),
     ui.input_selectize(
-        "state",
+        "state2",
         "Selectize Options",
         states,
         multiple=True,
@@ -32,7 +32,7 @@
         ),
     ),
     ui.input_selectize(
-        "state",
+        "state3",
         "Selectize plugins",
         states,
         multiple=True,

shiny/api-examples/input_slider/app-express.py

@@ -0,0 +1,16 @@
+import matplotlib.pyplot as plt
+import numpy as np
+
+from shiny.express import input, render, ui
+
+ui.input_slider("obs", "Number of bins:", min=10, max=100, value=30)
+
+
+@render.plot
+def distPlot():
+    np.random.seed(19680801)
+    x = 100 + 15 * np.random.randn(437)
+
+    fig, ax = plt.subplots()
+    ax.hist(x, input.obs(), density=True)
+    return fig

shiny/api-examples/input_switch/app-express.py

@@ -0,0 +1,8 @@
+from shiny.express import input, render, ui
+
+ui.input_switch("somevalue", "Some value", False)
+
+
+@render.text
+def value():
+    return input.somevalue()

shiny/api-examples/input_switch/app.py

@@ -2,12 +2,12 @@
 
 app_ui = ui.page_fluid(
     ui.input_switch("somevalue", "Some value", False),
-    ui.output_ui("value"),
+    ui.output_text("value"),
 )
 
 
 def server(input: Inputs, output: Outputs, session: Session):
-    @render.ui
+    @render.text
     def value():
         return input.somevalue()
 

shiny/api-examples/input_text/app-express.py

@@ -0,0 +1,8 @@
+from shiny.express import input, render, ui
+
+ui.input_text("caption", "Caption:", "Data summary")
+
+
+@render.code
+def value():
+    return input.caption()

shiny/api-examples/input_text_area/app-express.py

@@ -0,0 +1,25 @@
+from shiny.express import input, render, ui
+
+ui.input_text_area(
+    "caption_regular",
+    "Caption:",
+    "Data summary\nwith\nmultiple\nlines",
+)
+
+
+@render.text
+def value_regular():
+    return input.caption_regular()
+
+
+ui.input_text_area(
+    "caption_autoresize",
+    ui.markdown("Caption (w/ `autoresize=True`):"),
+    "Data summary\nwith\nmultiple\nlines",
+    autoresize=True,
+)
+
+
+@render.text
+def value_autoresize():
+    return input.caption_autoresize()