Add support for express mode apps

examples/express/accordion_app.py

@@ -0,0 +1,22 @@
+import matplotlib.pyplot as plt
+import numpy as np
+
+from shiny import render, ui
+from shiny.express import input, layout
+
+with layout.accordion(open=["Panel 1", "Panel 2"]):
+    with layout.accordion_panel("Panel 1"):
+        ui.input_slider("n", "N", 1, 100, 50)
+
+    with layout.accordion_panel("Panel 2"):
+
+        @render.text
+        def txt():
+            return f"n = {input.n()}"
+
+
+@render.plot
+def histogram():
+    np.random.seed(19680801)
+    x = 100 + 15 * np.random.randn(437)
+    plt.hist(x, input.n(), density=True)

examples/express/basic_app.py

@@ -0,0 +1,9 @@
+from shiny import render, ui
+from shiny.express import input
+
+ui.input_slider("n", "N", 1, 100, 50)
+
+
+@render.text()
+def txt():
+    return f"n = {input.n()}"

examples/express/column_wrap_app.py

@@ -0,0 +1,25 @@
+import matplotlib.pyplot as plt
+import numpy as np
+
+from shiny import render, ui
+from shiny.express import input, layout
+
+with layout.layout_column_wrap(width=1 / 2):
+    with layout.card():
+        ui.input_slider("n", "N", 1, 100, 50)
+
+    with layout.card():
+
+        @render.plot
+        def histogram():
+            np.random.seed(19680801)
+            x = 100 + 15 * np.random.randn(437)
+            plt.hist(x, input.n(), density=True)
+
+    with layout.card():
+
+        @render.plot
+        def histogram2():
+            np.random.seed(19680801)
+            x = 100 + 15 * np.random.randn(437)
+            plt.hist(x, input.n(), density=True, color="red")

examples/express/nav_app.py

@@ -0,0 +1,32 @@
+import matplotlib.pyplot as plt
+import numpy as np
+
+from shiny import render, ui
+from shiny.express import input, layout
+
+with layout.column(width=6):
+    with layout.navset_tab():
+        with layout.nav(title="One"):
+            ui.input_slider("n", "N", 1, 100, 50)
+
+        with layout.nav(title="Two"):
+
+            @render.plot
+            def histogram():
+                np.random.seed(19680801)
+                x = 100 + 15 * np.random.randn(437)
+                plt.hist(x, input.n(), density=True)
+
+
+with layout.column(width=6):
+    with layout.navset_card_tab():
+        with layout.nav(title="One"):
+            ui.input_slider("n2", "N", 1, 100, 50)
+
+        with layout.nav(title="Two"):
+
+            @render.plot
+            def histogram2():
+                np.random.seed(19680801)
+                x = 100 + 15 * np.random.randn(437)
+                plt.hist(x, input.n2(), density=True)

examples/express/plot_app.py

@@ -0,0 +1,14 @@
+import matplotlib.pyplot as plt
+import numpy as np
+
+from shiny import render, ui
+from shiny.express import input
+
+ui.input_slider("n", "N", 1, 100, 50)
+
+
+@render.plot
+def histogram():
+    np.random.seed(19680801)
+    x = 100 + 15 * np.random.randn(437)
+    plt.hist(x, input.n(), density=True)

examples/express/shared.py

@@ -0,0 +1,19 @@
+# This is not a Shiny application; it is meant to be imported by shared_app.py.
+
+from shiny import reactive, session
+
+# Print this at the console to make it clear that shared.py is loaded just once per run
+# of the app; each additional session does not result in this file loading again.
+print("Loading shared.py!")
+
+# This is a variable that can be used and shared across multiple sessions. This can be
+# useful for large data, or values that are expensive to compute. It can also be useful
+# for mutable objects that you want to share across sessions.
+data = ["This", "is", "a", "list", "of", "words"]
+
+# Any reactive objects should be created without a session context.
+with session.session_context(None):
+    # This reactive value can be used by multiple sessions; if it is invalidated (in
+    # other words, if the value is changed), it will trigger invalidations in all of
+    # those sessions.
+    rv = reactive.Value(-1)

examples/express/shared_app.py

@@ -0,0 +1,35 @@
+# This app demonstrates how to use "global" variables that are shared across sessions.
+# This is useful if you want to load data just once and use it in multiple apps, or if
+# you want to share data or reactives among apps.
+
+import matplotlib.pyplot as plt
+import numpy as np
+import shared
+
+from shiny import reactive, render, ui
+from shiny.express import input
+
+
+@render.plot
+def histogram():
+    np.random.seed(19680801)
+    x = 100 + 15 * np.random.randn(437)
+    plt.hist(x, shared.rv(), density=True)
+
+
+ui.input_slider("n", "N", 1, 100, 50)
+
+
+@reactive.Effect
+def _():
+    shared.rv.set(input.n())
+
+
+@render.text
+def rv_value():
+    return f"shared.rv() = {shared.rv()}"
+
+
+@render.text
+def text_data():
+    return "shared.data = " + str(shared.data)

examples/express/sidebar_app.py

@@ -0,0 +1,15 @@
+import matplotlib.pyplot as plt
+import numpy as np
+
+from shiny import render, ui
+from shiny.express import input, layout
+
+with layout.sidebar():
+    ui.input_slider("n", "N", 1, 100, 50)
+
+
+@render.plot
+def histogram():
+    np.random.seed(19680801)
+    x = 100 + 15 * np.random.randn(437)
+    plt.hist(x, input.n(), density=True)

js/build.ts

@@ -54,6 +54,13 @@ const opts: Array<BuildOptions> = [
     minify: false,
     sourcemap: false,
   },
+  {
+    entryPoints: {
+      "page-output/page-output": "page-output/page-output.ts",
+    },
+    minify: false,
+    sourcemap: false,
+  },
 ];
 
 // Run function to avoid top level await

js/page-output/page-output.ts

@@ -0,0 +1,78 @@
+import type { ErrorsMessageValue } from "rstudio-shiny/srcts/types/src/shiny/shinyapp";
+
+class PageOutputBinding extends Shiny.OutputBinding {
+  originalBodyTagAttrs: Array<Attr> | null = null;
+
+  find(scope: HTMLElement | JQuery<HTMLElement>): JQuery<HTMLElement> {
+    return $(scope).find(".shiny-page-output");
+  }
+
+  onValueError(el: HTMLElement, err: ErrorsMessageValue): void {
+    Shiny.unbindAll(el);
+    this.renderError(el, err);
+  }
+
+  async renderValue(
+    el: HTMLElement,
+    data: Parameters<typeof Shiny.renderContent>[1]
+  ): Promise<void> {
+    if (el !== document.body) {
+      throw new Error(
+        'Output with class "shiny-page-output" must be a <body> tag.'
+      );
+    }
+
+    if (this.originalBodyTagAttrs === null) {
+      // On the first run, store el's attributes so that on later runs we can clear
+      // any added attributes and reset this element to its original state.
+      this.originalBodyTagAttrs = Array.from(el.attributes);
+    } else {
+      // This is a later run. Reset attributes to their inital state.
+      for (const attr of this.originalBodyTagAttrs) {
+        el.setAttribute(attr.name, attr.value);
+      }
+    }
+
+    let content = typeof data === "string" ? data : data.html;
+
+    // Parse the HTML
+    const parser = new DOMParser();
+    const doc = parser.parseFromString(content, "text/html");
+
+    // Copy the <html> tag's lang attribute, if present.
+    if (doc.documentElement.lang) {
+      document.documentElement.lang = doc.documentElement.lang;
+    }
+
+    // Copy the <title>, if present.
+    if (doc.title) {
+      document.title = doc.title;
+    }
+
+    // Copy attributes from parsed <body> to the output element (which should be a
+    // <body>)
+    for (const attr of Array.from(doc.body.attributes)) {
+      if (attr.name === "class") el.classList.add(...attr.value.split(" "));
+      else el.setAttribute(attr.name, attr.value);
+    }
+
+    content = content
+      .replace(/<html>.*<body[^>]*>/gis, "")
+      .replace(/<\/body>.*<\/html>/gis, "");
+
+    if (typeof data === "string") {
+      data = content;
+    } else {
+      data.html = content;
+    }
+
+    await Shiny.renderContent(el, data);
+  }
+}
+
+Shiny.outputBindings.register(
+  new PageOutputBinding(),
+  "shinyPageOutputBinding"
+);
+
+export { PageOutputBinding };

shiny/__init__.py

@@ -1,6 +1,6 @@
 """A package for building reactive web applications."""
 
-__version__ = "0.6.0.9000"
+__version__ = "0.6.0.9001"
 
 from ._shinyenv import is_pyodide as _is_pyodide
 

shiny/_main.py

@@ -18,6 +18,7 @@
 import uvicorn.config
 
 import shiny
+from shiny.express import is_express_app
 
 from . import _autoreload, _hostenv, _static, _utils
 from ._typing_extensions import NotRequired, TypedDict
@@ -275,7 +276,18 @@ def run_app(
     os.environ["SHINY_PORT"] = str(port)
 
     if isinstance(app, str):
-        app, app_dir = resolve_app(app, app_dir)
+        # Remove ":app" suffix if present. Normally users would just pass in the
+        # filename without the trailing ":app", as in `shiny run app.py`, but the
+        # default value for `shiny run` is "app.py:app", so we need to handle it.
+        app_no_suffix = re.sub(r":app$", "", app)
+        if is_express_app(app_no_suffix, app_dir):
+            app_path = Path(app_no_suffix).resolve()
+            # Set this so shiny.express.app.wrap_express_app() can find the app file.
+            os.environ["SHINY_EXPRESS_APP_FILE"] = str(app_path)
+            app = "shiny.express.app:app"
+            app_dir = str(app_path.parent)
+        else:
+            app, app_dir = resolve_app(app, app_dir)
 
     if app_dir:
         app_dir = os.path.realpath(app_dir)
@@ -381,7 +393,7 @@ def is_file(app: str) -> bool:
     return "/" in app or app.endswith(".py")
 
 
-def resolve_app(app: str, app_dir: Optional[str]) -> tuple[str, Optional[str]]:
+def resolve_app(app: str, app_dir: str | None) -> tuple[str, str | None]:
     # The `app` parameter can be:
     #
     # - A module:attribute name

shiny/express/__init__.py

@@ -1,8 +1,74 @@
 from __future__ import annotations
 
+from ..session import Inputs, Outputs, Session
+from ..session import _utils as _session_utils
+from . import app, layout
 from ._output import output_args, suspend_display
+from ._run import is_express_app, wrap_express_app
+from .display_decorator import display_body
 
 __all__ = (
+    "input",
+    "output",
+    "session",
+    "is_express_app",
     "output_args",
     "suspend_display",
+    "wrap_express_app",
+    "app",
+    "layout",
+    "display_body",
 )
+
+# Add types to help type checkers
+input: Inputs
+output: Outputs
+session: Session
+
+
+# Note that users should use `from shiny.express import input` instead of `from shiny
+# import express` and acces via `express.input`. The former provides a static value for
+# `input`, but the latter is dynamic -- every time `express.input` is accessed, it
+# returns the input for the current session. This will work in the vast majority of
+# cases, but when it fails, it will be very confusing.
+def __getattr__(name: str) -> object:
+    if name == "input":
+        return _get_current_session_or_mock().input
+    elif name == "output":
+        return _get_current_session_or_mock().output
+    elif name == "session":
+        return _get_current_session_or_mock()
+
+    raise AttributeError(f"Module 'shiny.express' has no attribute '{name}'")
+
+
+# A very bare-bones mock session class that is used only in shiny.express.
+class _MockSession:
+    def __init__(self):
+        from typing import cast
+
+        from .._namespaces import Root
+
+        self.input = Inputs({})
+        self.output = Outputs(cast(Session, self), Root, {}, {})
+
+    # This is needed so that Outputs don't throw an error.
+    def _is_hidden(self, name: str) -> bool:
+        return False
+
+
+_current_mock_session: _MockSession | None = None
+
+
+def _get_current_session_or_mock() -> Session:
+    from typing import cast
+
+    session = _session_utils.get_current_session()
+    if session is None:
+        global _current_mock_session
+        if _current_mock_session is None:
+            _current_mock_session = _MockSession()
+        return cast(Session, _current_mock_session)
+
+    else:
+        return session