solara-ui 1.31.0__py2.py3-none-any.whl

solara/website/pages/apps/authorization/__init__.py

@@ -0,0 +1,119 @@
+"""# Authorization
+
+Authorization is a common requirement for web applications. This example shows how to implement a simple login form and
+how to use `use_route` to implement authorization.
+
+The `Layout` component checks if the current route requires authorization and if the user is logged in. If not, it
+redirects to the login form.
+"""
+
+import dataclasses
+from typing import Optional, cast
+
+import solara
+import solara.lab
+
+github_url = solara.util.github_url(__file__)
+
+route_order = ["/", "users", "admin"]
+
+
+def check_auth(route, children):
+    # This can be replaced by a custom function that checks if the user is
+    # logged in and has the required permissions.
+
+    # routes that are public or only for admin
+    # the rest only requires login
+    public_paths = ["/"]
+    admin_paths = ["admin"]
+
+    if route.path in public_paths:
+        children_auth = children
+    else:
+        if user.value is None:
+            children_auth = [LoginForm()]
+        else:
+            if route.path in admin_paths and not user.value.admin:
+                children_auth = [solara.Error("You are not an admin")]
+            else:
+                children_auth = children
+    return children_auth
+
+
+@dataclasses.dataclass
+class User:
+    username: str
+    admin: bool = False
+
+
+user = solara.reactive(cast(Optional[User], None))
+login_failed = solara.reactive(False)
+
+
+def login(username: str, password: str):
+    # this function can be replace by a custom username/password check
+    if username == "test" and password == "test":
+        user.value = User(username, admin=False)
+        login_failed.value = False
+    elif username == "admin" and password == "admin":
+        user.value = User(username, admin=True)
+        login_failed.value = False
+    else:
+        login_failed.value = True
+
+
+@solara.component
+def Page():
+    solara.Markdown("This page is visible for everyone")
+
+    solara.Markdown(__doc__)
+    solara.Button(label="View source", icon_name="mdi-github-circle", attributes={"href": github_url, "target": "_blank"}, text=True, outlined=True)
+
+
+@solara.component
+def LoginForm():
+    username = solara.use_reactive("")
+    password = solara.use_reactive("")
+    with solara.Card("Login"):
+        solara.Markdown(
+            """
+        This is an example login form.
+
+          * use admin/admin to login as admin.
+          * use test/test to login as a normal user.
+        """
+        )
+        solara.InputText(label="Username", value=username)
+        solara.InputText(label="Password", password=True, value=password)
+        solara.Button(label="Login", on_click=lambda: login(username.value, password.value))
+        if login_failed.value:
+            solara.Error("Wrong username or password")
+
+
+@solara.component
+def Layout(children=[]):
+    route, routes = solara.use_route(peek=True)
+    if route is None:
+        return solara.Error("Route not found")
+
+    children = check_auth(route, children)
+
+    with solara.AppLayout(children=children, navigation=True):
+        with solara.AppBar():
+            with solara.lab.Tabs(align="center"):
+                for route in routes:
+                    name = route.path if route.path != "/" else "Home"
+                    is_admin = user.value and user.value.admin
+                    # we could skip the admin tab if the user is not an admin
+                    # if route.path == "admin" and not is_admin:
+                    #     continue
+                    # in this case we disable the tab
+                    disabled = route.path == "admin" and not is_admin
+                    solara.lab.Tab(name, path_or_route=route, disabled=disabled)
+            if user.value:
+                solara.Text(f"Logged in as {user.value.username} as {'admin' if user.value.admin else 'user'}")
+                with solara.Tooltip("Logout"):
+                    solara.Button(icon_name="mdi-logout", icon=True, on_click=lambda: user.set(None))
+            else:
+                with solara.AppBar():
+                    solara.Text("Not logged in")

solara/website/pages/apps/authorization/admin.py

@@ -0,0 +1,12 @@
+import solara
+
+from . import user
+
+github_url = solara.util.github_url(__file__)
+
+
+@solara.component
+def Page():
+    assert user.value is not None
+    solara.Markdown(f"Hi {user.value.username}, you are an admin")
+    solara.Button(label="View source", icon_name="mdi-github-circle", attributes={"href": github_url, "target": "_blank"}, text=True, outlined=True)

solara/website/pages/apps/authorization/users.py

@@ -0,0 +1,12 @@
+import solara
+
+from . import user
+
+github_url = solara.util.github_url(__file__)
+
+
+@solara.component
+def Page():
+    assert user.value is not None
+    solara.Markdown(f"Hi {user.value.username}!")
+    solara.Button(label="View source", icon_name="mdi-github-circle", attributes={"href": github_url, "target": "_blank"}, text=True, outlined=True)

solara/website/pages/apps/jupyter-dashboard-1.py

@@ -0,0 +1,116 @@
+from pathlib import Path
+
+import folium
+import folium.plugins
+import matplotlib.pyplot as plt
+import pandas as pd
+
+import solara
+
+districts = solara.reactive(
+    ["Bayview", "Northern"],
+)
+categories = solara.reactive(["Vandalism", "Assault", "Robbery"])
+limit = solara.reactive(100)
+
+
+ROOT = Path(solara.__file__).parent / "website" / "pages" / "documentation" / "getting_started" / "content" / "04-tutorials"
+path = ROOT / Path("SF_crime_sample.csv.gz")
+url = "https://raw.githubusercontent.com/widgetti/solara/master/solara/website/pages/docs/content/04-tutorial/SF_crime_sample.csv"
+
+if path.exists():
+    df_crime = pd.read_csv(path)
+else:
+    df_crime = pd.read_csv(url)
+
+df_crime
+
+
+df_crime["Category"] = df_crime["Category"].str.title()
+df_crime["PdDistrict"] = df_crime["PdDistrict"].str.title()
+
+
+def crime_filter(df, district_values, category_values):
+    df_dist = df.loc[df["PdDistrict"].isin(district_values)]
+    df_category = df_dist.loc[df_dist["Category"].isin(category_values)]
+    return df_category
+
+
+def crime_charts(df):
+    cat_unique = df["Category"].value_counts()
+    cat_unique = cat_unique.reset_index()
+
+    dist_unique = df["PdDistrict"].value_counts()
+    dist_unique = dist_unique.reset_index()
+
+    fig, (ax1, ax2) = plt.subplots(1, 2, figsize=(20, 10))
+
+    ax1.bar(cat_unique["Category"], cat_unique["count"])
+    ax1.set_title("Amount of Criminal Case Based on Category")
+    ax2.bar(dist_unique["PdDistrict"], dist_unique["count"])
+    ax2.set_title("Amount of Criminal Case in Selected District")
+
+    # this does not work on solara yet: https://github.com/widgetti/solara/issues/399
+    # display(fig)
+    # plt.close(fig)
+    solara.FigureMatplotlib(fig)
+
+
+def crime_map(df):
+    latitude = 37.77
+    longitude = -122.42
+
+    sanfran_map = folium.Map(height=400, location=[latitude, longitude], zoom_start=12)
+
+    incidents = folium.plugins.MarkerCluster().add_to(sanfran_map)
+
+    # loop through the dataframe and add each data point to the mark cluster
+    for (
+        lat,
+        lng,
+        label,
+    ) in zip(df.Y, df.X, df.Category):
+        folium.Marker(
+            location=[lat, lng],
+            icon=None,
+            popup=label,
+        ).add_to(incidents)
+
+    # show map
+    solara.display(sanfran_map)
+
+
+@solara.component
+def View():
+    dff = crime_filter(df_crime, districts.value, categories.value)
+    row_count = len(dff)
+    if row_count > limit.value:
+        solara.Warning(f"Only showing the first {limit.value} of {row_count:,} crimes on map")
+    with solara.Column(style={"max-height": "400px"}):
+        crime_map(dff.iloc[: limit.value])
+    if row_count > 0:
+        crime_charts(dff)
+    else:
+        solara.Warning("You filtered out all the data, no charts shown")
+
+
+@solara.component
+def Controls():
+    solara.SelectMultiple("District", all_values=[str(k) for k in df_crime["PdDistrict"].unique().tolist()], values=districts)  # type: ignore
+    solara.SelectMultiple("Category", all_values=[str(k) for k in df_crime["Category"].unique().tolist()], values=categories)  # type: ignore
+    solara.Text("Maximum number of rows to show on map")
+    solara.SliderInt("", value=limit, min=1, max=1000)
+
+
+@solara.component
+def Page():
+    with solara.Sidebar():
+        Controls()
+    View()
+
+
+# only needed on the solara website itself
+@solara.component
+def Layout(children):
+    route, routes = solara.use_route()
+    return solara.AppLayout(children=children)

solara/website/pages/apps/layout-demo.py

@@ -0,0 +1,40 @@
+import solara
+import solara.lab
+
+github_url = solara.util.github_url(__file__)
+
+
+@solara.component
+def Page():
+    with solara.Column():
+        solara.Title("I'm in the browser tab and the toolbar bar")
+        with solara.Sidebar():
+            with solara.Card("I am in the sidebar"):
+                with solara.Column():
+                    solara.SliderInt(label="Ideal for placing controls")
+                    solara.Button(
+                        label="View source", icon_name="mdi-github-circle", attributes={"href": github_url, "target": "_blank"}, text=True, outlined=True
+                    )
+
+        solara.Info("I'm in the main content area, put your main content here")
+        with solara.Card("Use solara.Columns to create relatively sized columns"):
+            with solara.Columns([1, 2]):
+                solara.Success("I'm in the first column")
+                solara.Warning("I'm in the second column, I am twice as wide")
+
+        with solara.Card("Use solara.Column to create a full width column"):
+            with solara.Column():
+                solara.Success("I'm first in this full with column")
+                solara.Warning("I'm second in this full with column")
+                solara.Error("I'm third in this full with column")
+
+        with solara.Card("Use solara.ColumnsResponsive to response to screen size"):
+            with solara.ColumnsResponsive(6, large=4):
+                for i in range(6):
+                    solara.Info("two per column on small screens, three per column on large screens")
+
+
+@solara.component
+def Layout(children):
+    route, routes = solara.use_route()
+    return solara.AppLayout(children=children)

solara/website/pages/apps/multipage/__init__.py

@@ -0,0 +1,38 @@
+import solara
+
+github_url = solara.util.github_url(__file__)
+# some app state that outlives a single page
+app_state = solara.reactive(0)
+
+
+@solara.component
+def SharedComponent():
+    with solara.Card("Shown on each page", style={"max-width": "500px"}, margin=0, classes=["my-2"]):
+        solara.Markdown(
+            f"""
+            This component will be used on each page.
+
+            It uses the `app_state` [reactive variable](https://solara.dev/documentation/api/utilities/reactive)
+            so that the state outlives each page
+
+
+            app_state: {app_state.value}
+            """
+        )
+        solara.Button(label="Increment app_state", icon_name="mdi-plus", on_click=lambda: app_state.set(app_state.value + 1), outlined=True)
+
+
+@solara.component
+def Page():
+    with solara.Sidebar():
+        solara.Markdown("This is the sidebar at the home page!")
+    with solara.Card("Home"):
+        solara.Markdown("This is the home page")
+        solara.Button(label="View source", icon_name="mdi-github-circle", attributes={"href": github_url, "target": "_blank"}, text=True, outlined=True)
+
+        SharedComponent()
+
+
+@solara.component
+def Layout(children):
+    return solara.AppLayout(children=children)

solara/website/pages/apps/multipage/page1.py

@@ -0,0 +1,26 @@
+import solara
+
+from . import SharedComponent
+
+github_url = solara.util.github_url(__file__)
+
+
+@solara.component
+def Sub():
+    with solara.Card("Sub component", margin=0, classes=["my-2"]):
+        solara.Markdown("This sub component is the best")
+        with solara.Sidebar():
+            with solara.Card("Sidebar of sub component", margin=0, elevation=0):
+                solara.Markdown("*Markdown* **is** 👍")
+            SharedComponent()
+
+
+@solara.component
+def Page():
+    with solara.Sidebar():
+        with solara.Card("Sidebar of page 1", margin=0, elevation=0):
+            solara.Markdown("Hi there 👋!")
+            solara.Button(label="View source", icon_name="mdi-github-circle", attributes={"href": github_url, "target": "_blank"}, text=True, outlined=True)
+    with solara.Card("Page 1"):
+        Sub()
+        solara.Markdown("Page 1 is the best")

solara/website/pages/apps/multipage/page2.py

@@ -0,0 +1,34 @@
+import solara
+
+from . import SharedComponent
+
+github_url = solara.util.github_url(__file__)
+
+
+@solara.component
+def Page():
+    component_state = solara.use_reactive(0)
+    solara.Title("Page 2 set with title")
+    with solara.Card("Page 2"):
+        solara.Markdown("Page 2 is even better, even though it has no sidebar.")
+        solara.Button(label="View source", icon_name="mdi-github-circle", attributes={"href": github_url, "target": "_blank"}, text=True, outlined=True)
+        SharedComponent()
+
+        with solara.Card("Shown only on page2", style={"max-width": "500px"}, margin=0, classes=["my-2"]):
+            solara.Markdown(
+                f"""
+                The lifetime of `component_state` if bound to this page. If you navigate away from it,
+                the state will be reset.
+
+                It creates the `component_state` [using the use_reactive hook](https://solara.dev/api/use_reactive)
+                so that the state is bound to the component.
+
+                See also [about state management](https://solara.dev/documentation/getting_started/fundamentals/state-management) for more information.
+
+
+                component_state: {component_state.value}
+                """
+            )
+            solara.Button(
+                label="Increment component_state", icon_name="mdi-plus", on_click=lambda: component_state.set(component_state.value + 1), outlined=True
+            )

solara/website/pages/apps/scatter.py

@@ -0,0 +1,136 @@
+import pathlib
+import sys
+from typing import Optional, cast
+
+import pandas as pd
+
+import solara
+import solara.express as solara_px  # similar to plotly express, but comes with cross filters
+import solara.lab
+from solara.components.columns import Columns
+from solara.components.file_drop import FileDrop
+
+github_url = solara.util.github_url(__file__)
+if sys.platform != "emscripten":
+    pycafe_url = solara.util.pycafe_url(path=pathlib.Path(__file__), requirements=["solara", "pandas", "plotly"])
+else:
+    pycafe_url = None
+df_sample = pd.read_csv("https://raw.githubusercontent.com/plotly/datasets/master/gapminderDataFiveYear.csv")
+
+
+class State:
+    size_max = solara.reactive(40.0)
+    size = solara.reactive(cast(Optional[str], None))
+    color = solara.reactive(cast(Optional[str], None))
+    x = solara.reactive(cast(Optional[str], None))
+    y = solara.reactive(cast(Optional[str], None))
+    logx = solara.reactive(False)
+    logy = solara.reactive(False)
+    df = solara.reactive(cast(Optional[pd.DataFrame], None))
+
+    @staticmethod
+    def load_sample():
+        State.x.value = "gdpPercap"
+        State.y.value = "lifeExp"
+        State.size.value = "pop"
+        State.color.value = "continent"
+        State.logx.value = True
+        State.df.value = df_sample
+
+    @staticmethod
+    def load_from_file(file):
+        df = pd.read_csv(file["file_obj"])
+        State.x.value = str(df.columns[0])
+        State.y.value = str(df.columns[1])
+        State.size.value = str(df.columns[2])
+        State.color.value = str(df.columns[3])
+        State.df.value = df
+
+    @staticmethod
+    def reset():
+        State.df.value = None
+
+
+@solara.component
+def Page():
+    df = State.df.value
+    dark_effective = solara.lab.use_dark_effective()
+
+    # the .scatter will set this cross filter
+    filter, _set_filter = solara.use_cross_filter(id(df))
+
+    # only apply the filter if the filter or dataframe changes
+    def filter_df():
+        if filter is not None and df is not None:
+            return df.loc[filter]
+
+    dff = solara.use_memo(filter_df, dependencies=[df, filter])
+
+    with solara.AppBar():
+        solara.lab.ThemeToggle()
+    with solara.Sidebar():
+        with solara.Card("Controls", margin=0, elevation=0):
+            with solara.Column():
+                with solara.Row():
+                    solara.Button("Sample dataset", color="primary", text=True, outlined=True, on_click=State.load_sample, disabled=df is not None)
+                    solara.Button("Clear dataset", color="primary", text=True, outlined=True, on_click=State.reset)
+                if sys.platform != "emscripten":
+                    FileDrop(on_file=State.load_from_file, on_total_progress=lambda *args: None, label="Drag file here")
+                else:
+                    solara.Info("File upload not supported in this environment")
+
+                if df is not None:
+                    solara.SliderFloat(label="Size", value=State.size_max, min=1, max=100)
+                    solara.Checkbox(label="Log x", value=State.logx)
+                    solara.Checkbox(label="Log y", value=State.logy)
+                    columns = list(map(str, df.columns))
+                    solara.Select("Column x", values=columns, value=State.x)
+                    solara.Select("Column y", values=columns, value=State.y)
+                    solara.Select("Size", values=columns, value=State.size)
+                    solara.Select("Color", values=columns, value=State.color)
+                    if filter is None:
+                        solara.Info("If you select points in the scatter plot, you can download the points here.")
+                    else:
+
+                        def get_data():
+                            return dff.to_csv(index=False)
+
+                        solara.FileDownload(get_data, label=f"Download {len(dff):,} selected points", filename="selected.csv")
+
+    if df is not None:
+        with Columns(widths=[2, 4]):
+            if State.x.value and State.y.value:
+                solara_px.scatter(
+                    df,
+                    State.x.value,
+                    State.y.value,
+                    size=State.size.value,
+                    color=State.color.value,
+                    size_max=State.size_max.value,
+                    log_x=State.logx.value,
+                    log_y=State.logy.value,
+                    template="plotly_dark" if dark_effective else "plotly_white",
+                )
+            else:
+                solara.Warning("Select x and y columns")
+
+    else:
+        solara.Info("No data loaded, click on the sample dataset button to load a sample dataset, or upload a file.")
+
+    with solara.Column(style={"max-width": "400px"}):
+        solara.Button(label="View source", icon_name="mdi-github-circle", attributes={"href": github_url, "target": "_blank"}, text=True, outlined=True)
+        if sys.platform != "emscripten":
+            solara.Button(
+                label="Edit this example live on py.cafe",
+                icon_name="mdi-coffee-to-go-outline",
+                attributes={"href": pycafe_url, "target": "_blank"},
+                text=True,
+                outlined=True,
+            )
+
+
+@solara.component
+def Layout(children):
+    route, routes = solara.use_route()
+    dark_effective = solara.lab.use_dark_effective()
+    return solara.AppLayout(children=children, toolbar_dark=dark_effective, color=None)  # if dark_effective else "primary")

solara/website/pages/apps/scrolling.py

@@ -0,0 +1,63 @@
+import solara
+
+github_url = solara.util.github_url(__file__)
+
+# list of nice soft colors
+colors = [
+    "#e6194b",
+    "#3cb44b",
+    "#ffe119",
+    "#4363d8",
+    "#f58231",
+    "#911eb4",
+]
+
+
+@solara.component
+def Page1():
+    with solara.Sidebar():
+        solara.Button(label="View source", icon_name="mdi-github-circle", attributes={"href": github_url, "target": "_blank"}, text=True, outlined=True)
+        solara.Markdown("The sidebar will get scrollbars automatically, independently of the main content.")
+        for i in range(10):
+            with solara.Card(f"Card {i}"):
+                solara.Info(f"Text {i}", color=colors[i % len(colors)])
+
+    solara.Markdown("The main content will get scrollbars automatically, independently of the sidebar.")
+    for i in range(10):
+        with solara.Card(f"Card {i}"):
+            solara.Info(f"Text {i}", color=colors[i % len(colors)])
+
+
+@solara.component
+def Page2():
+    # it is important we do not interrupt the height 100% chain
+    limit_content_height = solara.use_reactive(True)
+    # warning: if we add "margin": "10px" to the style, we will trigger
+    # scrollbars in the parent div, if you really need to add margins,
+    # you should correct for that in the height using "calc(100% - 20px)"
+    with solara.Column(style={"height": "100%"}):
+        with solara.Sidebar():
+            solara.Button(label="View source", icon_name="mdi-github-circle", attributes={"href": github_url, "target": "_blank"}, text=True, outlined=True)
+            solara.Markdown("Main content columns will scroll together, or independently if we limit height to 100%")
+            solara.Checkbox(label="Limit content height", value=limit_content_height)
+
+        # if we do not limit height to 100%, solara's AppLayout will add a scroll bar
+        # to the main content, which will be independent of the sidebar's scroll bar
+        # but both columns will scroll together
+        with solara.Columns([2, 4], style={"height": "100%"} if limit_content_height.value else {}):
+            with solara.Card("I have my own scroll bar"):
+                solara.Markdown("")
+                for i in range(10):
+                    with solara.Card(f"Card {i}"):
+                        solara.Info(f"Text {i}", color=colors[i % len(colors)])
+            with solara.Card("I also have my own scroll bar"):
+                solara.Markdown("")
+                for i in range(20):
+                    with solara.Card(f"Card {i}"):
+                        solara.Info(f"Text {i}", color=colors[i % len(colors)])
+
+
+routes = [
+    solara.Route(path="/", component=Page1, label="Scrolling"),
+    solara.Route(path="custom", component=Page2, label="Custom scrolling"),
+]

solara/website/pages/apps/tutorial-streamlit.py

@@ -0,0 +1,18 @@
+import solara
+
+
+@solara.component
+def Page():
+    x, set_x = solara.use_state(2)
+    x_squared = x**2
+
+    with solara.Sidebar():
+        solara.Markdown("## My First Solara app ☀️")
+        solara.SliderInt(label="x", value=x, on_value=set_x)
+    solara.Markdown(f"{x} squared = {x_squared}")
+
+
+@solara.component
+def Layout(children):
+    route, routes = solara.use_route()
+    return solara.AppLayout(children=children)

solara/website/pages/changelog/__init__.py

@@ -0,0 +1,8 @@
+from pathlib import Path
+
+import solara
+
+title = "Changelog"
+HERE = Path(__file__)
+
+Page = solara.Markdown(Path(HERE.parent / "changelog.md").read_text())