solara-ui 1.45.0__py3-none-any.whl

solara/website/pages/documentation/components/input/select.py

@@ -0,0 +1,22 @@
+"""
+# Select components
+
+Select comes in two flavours:
+
+   * `Select` for a singular selection
+   * `SelectMultiple` which allows for multiple selections
+
+
+"""
+
+import solara
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+Page = NoPage
+
+
+__doc__ += "# Select"
+__doc__ += apidoc(solara.Select.f)  # type: ignore
+__doc__ += "# SelectMultiple"
+__doc__ += apidoc(solara.SelectMultiple.f)  # type: ignore

solara/website/pages/documentation/components/input/slider.py

@@ -0,0 +1,29 @@
+"""
+# Sliders
+
+To support proper typechecks, we have multiple slider (all wrapping the ipyvuetify sliders).
+
+
+"""
+
+import solara
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+Page = NoPage
+
+__doc__ += "# SliderInt"
+__doc__ += apidoc(solara.SliderInt.f)  # type: ignore
+__doc__ += "# SliderRangeInt"
+__doc__ += apidoc(solara.SliderRangeInt.f)  # type: ignore
+
+__doc__ += "# SliderFloat"
+__doc__ += apidoc(solara.SliderFloat.f)  # type: ignore
+__doc__ += "# SliderRangeFloat"
+__doc__ += apidoc(solara.SliderRangeFloat.f)  # type: ignore
+
+__doc__ += "# SliderValue"
+__doc__ += apidoc(solara.SliderValue.f)  # type: ignore
+
+__doc__ += "# SliderDate"
+__doc__ += apidoc(solara.SliderDate.f)  # type: ignore

solara/website/pages/documentation/components/input/switch.py

@@ -0,0 +1,10 @@
+"""# Switch"""
+
+import solara
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+Page = NoPage
+
+
+__doc__ += apidoc(solara.Switch.f)  # type: ignore

solara/website/pages/documentation/components/input/togglebuttons.py

@@ -0,0 +1,21 @@
+"""
+# ToggleButtons
+
+ToggleButtons are in two flavours, for single, and for multiple selections.
+
+
+"""
+
+import solara
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "ToggleButtons"
+
+Page = NoPage
+
+
+__doc__ += "# ToggleButtonsSingle"
+__doc__ += apidoc(solara.ToggleButtonsSingle.f)  # type: ignore
+__doc__ += "# ToggleButtonsMultiple"
+__doc__ += apidoc(solara.ToggleButtonsMultiple.f)  # type: ignore

solara/website/pages/documentation/components/lab/__init__.py

@@ -0,0 +1,9 @@
+import solara
+from solara.website.components import NoPage, SubCategoryLayout
+
+Page = NoPage
+
+
+@solara.component
+def Layout(children=[]):
+    SubCategoryLayout(children=children)

solara/website/pages/documentation/components/lab/chat.py

@@ -0,0 +1,109 @@
+"""
+# Chat Components
+
+These are the components available in Solara to build chat interfaces.
+Although they can be used together to create a pre-built chat interface, inserting custom components is also possible.
+For an example of how to use a custom message component, see the bottom of the page.
+
+Also check out the [Chatbot](/documentation/examples/ai/chatbot) example.
+
+# ChatBox
+"""
+
+import solara
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "Chat Components"
+
+
+__doc__ += apidoc(solara.lab.components.chat.ChatBox.f)  # type: ignore
+__doc__ += "# ChatInput"
+__doc__ += apidoc(solara.lab.components.chat.ChatInput.f)  # type: ignore
+__doc__ += "# ChatMessage"
+__doc__ += apidoc(solara.lab.components.chat.ChatMessage.f)  # type: ignore
+__doc__ += """## Different Message Styles
+
+The `ChatMessage` component has a few different styles available. These are shown below.
+
+```solara
+import solara
+
+@solara.component
+def Page():
+    with solara.Column():
+        solara.lab.ChatMessage(["Default"])
+        solara.lab.ChatMessage(["`color`"], color="#ff991f")
+        solara.lab.ChatMessage(["`avatar_background_color`"], avatar_background_color="success")
+        solara.lab.ChatMessage(["`border_radius='20px'`"], border_radius="20px")
+        solara.lab.ChatMessage(["`notch=True`"], notch=True)
+```
+"""
+
+__doc__ += """
+# A Basic Example
+
+
+```solara
+import solara
+
+messages = solara.reactive([])
+name = solara.reactive("User")
+
+def send(new_message):
+    messages.set([
+        *messages.value,
+        {"user": True, "name": name.value, "message": new_message,},
+    ])
+
+@solara.component
+def Page():
+    solara.InputText("username", value=name)
+    with solara.Column(style={"min-height": "50vh"}):
+        with solara.lab.ChatBox():
+            for item in messages.value:
+                with solara.lab.ChatMessage(
+                    user=item["user"],
+                    name=item["name"],
+                ):
+                    solara.Markdown(item["message"])
+        solara.lab.ChatInput(send_callback=send)
+```
+
+# A Custom Message Component
+
+```solara
+import solara
+
+messages = solara.reactive([])
+
+def send(new_message):
+    messages.set([
+        *messages.value,
+        {"name": "User", "message": new_message},
+    ])
+
+@solara.component
+def CustomMessage(
+    message,
+    name = "User",
+):
+    with solara.Column(gap=0):
+        with solara.Row():
+            solara.Markdown(f"**{name}**: {message}")
+        solara.v.Divider(style_="margin: 0;")
+
+@solara.component
+def Page():
+    with solara.Column(style={"min-height": "50vh"}):
+        with solara.lab.ChatBox():
+            for item in messages.value:
+                CustomMessage(
+                    message=item["message"],
+                    name=item["name"],
+                )
+        solara.lab.ChatInput(send_callback=send)
+```
+"""
+
+Page = NoPage

solara/website/pages/documentation/components/lab/confirmation_dialog.py

@@ -0,0 +1,55 @@
+"""
+# ConfirmationDialog
+
+"""
+
+from typing import Union
+
+import solara
+from solara.lab.components.confirmation_dialog import ConfirmationDialog
+from solara.website.utils import apidoc
+
+title = "ConfirmationDialog"
+users = solara.reactive("Alice Bob Cindy Dirk Eve Fred".split())
+user_to_be_deleted: solara.Reactive[Union[str, None]] = solara.reactive(None)
+
+
+def ask_to_delete_user(user):
+    user_to_be_deleted.value = user
+
+
+def clear_user_to_be_deleted():
+    user_to_be_deleted.value = None
+
+
+def delete_user():
+    users.set([u for u in users.value if u != user_to_be_deleted.value])
+    clear_user_to_be_deleted()
+
+
+@solara.component
+def Page():
+    """Create a list of users with a button to delete them.
+
+    A confirmation dialog will pop up first before deletion."""
+    solara.Markdown("#### Users:")
+    with solara.Column(style={"max-width": "300px"}):
+        for user in users.value:
+            with solara.Row(style={"align-items": "center"}):
+                solara.Text(user)
+                solara.v.Spacer()
+                solara.Button(icon_name="mdi-delete", on_click=lambda user=user: ask_to_delete_user(user), icon=True)
+        if not users.value:
+            solara.Text("(no users left)")
+
+    with ConfirmationDialog(
+        user_to_be_deleted.value is not None,
+        on_ok=delete_user,
+        on_close=clear_user_to_be_deleted,
+        ok="Ok, Delete",
+        title="Delete user",
+    ):
+        solara.Markdown(f"Are you sure you want to delete user **{user_to_be_deleted.value}**?")
+
+
+__doc__ += apidoc(solara.lab.components.confirmation_dialog.ConfirmationDialog.f)  # type: ignore

solara/website/pages/documentation/components/lab/cookies_headers.py

@@ -0,0 +1,48 @@
+"""
+# Cookies and Headers
+
+## Cookies
+
+Solara provides access to cookies through `solara.lab.cookies`.
+
+```python
+cookies: Reactive[Optional[Dict[str, str]]] = reactive(cast(Optional[Dict[str, str]], None))
+```
+
+This is a reactive object that can be used to read the cookies transferred with the the initial request sent to the server by the client.
+Thus it is possible to access also HTTPOnly cookies. The cookies will be updated whenever the client sends a new request to the server,
+i.e. only when the client connects to a kernel.
+
+The cookies are read into a dictionary with the cookie names as keys and the cookie values as values.
+
+## Headers
+
+Solara provides access to headers in the form of `solara.lab.headers`.
+
+```python
+headers: Reactive[Optional[Dict[str, List[str]]]] = reactive(cast(Optional[Dict[str, List[str]]], None))
+```
+
+`headers` concatenates the values of multiple header fields with the same name into a list of strings. However, it is still possible that multiple
+values are present in one field already in the request, in which case one string will contain multiple values. Unfortunately reversing this is
+highly non-trivial.
+
+Note that the header field names are all lower-case.
+
+```solara
+import solara
+from solara.lab import headers
+
+
+@solara.component
+def Page():
+    solara.Markdown(f"Your 'user-agent' is: {headers.value['user-agent']}")
+
+```
+
+"""
+
+from solara.website.components import NoPage
+
+title = "Cookies and Headers"
+Page = NoPage

solara/website/pages/documentation/components/lab/input_date.py

@@ -0,0 +1,20 @@
+"""
+# InputDate
+
+This page contains the two variants of datepickers available in solara
+
+# InputDate
+"""
+
+import solara
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "InputDate"
+
+
+__doc__ += apidoc(solara.lab.components.input_date.InputDate.f)  # type: ignore
+__doc__ += "# InputDateRange"
+__doc__ += apidoc(solara.lab.components.input_date.InputDateRange.f)  # type: ignore
+
+Page = NoPage

solara/website/pages/documentation/components/lab/input_time.py

@@ -0,0 +1,15 @@
+"""
+# InputTime
+"""
+
+import solara
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "InputTime"
+
+
+__doc__ += apidoc(solara.lab.components.input_time.InputTime.f)  # type: ignore
+
+
+Page = NoPage

solara/website/pages/documentation/components/lab/menu.py

@@ -0,0 +1,22 @@
+"""
+# Menus
+
+This page contains the various kinds of menu elements available to use in solara
+
+# Menu
+"""
+
+import solara
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "Menus"
+
+
+__doc__ += apidoc(solara.lab.components.menu.Menu.f)  # type: ignore
+__doc__ += "# ClickMenu"
+__doc__ += apidoc(solara.lab.components.menu.ClickMenu.f)  # type: ignore
+__doc__ += "# ContextMenu"
+__doc__ += apidoc(solara.lab.components.menu.ContextMenu.f)  # type: ignore
+
+Page = NoPage

solara/website/pages/documentation/components/lab/tab.py

@@ -0,0 +1,25 @@
+"""
+# Tab
+
+"""
+
+import solara
+import solara.lab
+from solara.website.utils import apidoc
+
+disabled = solara.reactive(False)
+icon = solara.reactive(True)
+
+
+@solara.component
+def Page():
+    solara.Checkbox(label="Disable Tab 2", value=disabled)
+    solara.Checkbox(label="Show icon", value=icon)
+    with solara.lab.Tabs():
+        with solara.lab.Tab("Tab 1"):
+            solara.Markdown("Hello")
+        with solara.lab.Tab("Tab 2", disabled=disabled.value, icon_name="mdi-home" if icon.value else None):
+            solara.Markdown("World")
+
+
+__doc__ += apidoc(solara.lab.Tab.f)  # type: ignore

solara/website/pages/documentation/components/lab/tabs.py

@@ -0,0 +1,45 @@
+"""
+# Tabs
+
+"""
+
+import solara
+import solara.lab
+from solara.website.utils import apidoc
+
+disabled = solara.reactive(False)
+align = solara.reactive("center")
+grow = solara.reactive(False)
+vertical = solara.reactive(False)
+dark = solara.reactive(False)
+
+
+@solara.component
+def Page():
+    with solara.Card("Controls"):
+        with solara.Row():
+            solara.Checkbox(label="Grow", value=grow)
+            solara.Checkbox(label="Vertical", value=vertical)
+            solara.Checkbox(label="Dark", value=dark)
+        if vertical.value:
+            align.value = "start"
+        else:
+            if not grow.value:
+                with solara.Row(style={"align-items": "center"}):
+                    solara.Text("Align:")
+                    solara.ToggleButtonsSingle(value=align, values=["start", "center", "end"], dense=True)
+    with solara.lab.Tabs(
+        vertical=vertical.value,
+        grow=grow.value,
+        align=align.value,
+        dark=dark.value,
+        background_color="primary" if dark.value else None,
+        slider_color="secondary" if dark.value else None,
+    ):
+        with solara.lab.Tab("Tab 1"):
+            solara.Markdown("Hello")
+        with solara.lab.Tab("Tab 2"):
+            solara.Markdown("World")
+
+
+__doc__ += apidoc(solara.lab.Tabs.f)  # type: ignore

solara/website/pages/documentation/components/lab/task.py

@@ -0,0 +1,11 @@
+"""# Task"""
+
+import solara
+import solara.autorouting
+import solara.lab
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "Task"
+Page = NoPage
+__doc__ += apidoc(solara.lab.task)  # type: ignore

solara/website/pages/documentation/components/lab/theming.py

@@ -0,0 +1,74 @@
+"""
+# Themes in Solara
+
+Theming is provided to Solara through the [`ipyvuetify`](https://solara.dev/docs/understanding/ipyvuetify) package.
+Two themes are provided by default: light and dark.
+Control over the theme variant (light, dark, or auto) can be provided to the user through the `ThemeToggle` component. Developers can
+control theming through the `solara.lab.theme` object.
+
+## Themes
+
+The default themes can be customized through altering `solara.lab.theme`. The
+[theme options of vuetify](https://v2.vuetifyjs.com/en/features/theme/#customizing)
+are available as `solara.lab.theme.themes.light` and `solara.lab.theme.themes.dark`. The different properties of the theme can be set through, for example
+
+```python
+solara.lab.theme.themes.light.primary = "#3f51b5"
+```
+
+Dark theme can be enabled/disabled through `solara.lab.theme.dark = True` / `False` / `None`. When set to `None`, the theme is set to auto,
+which will follow the system theme if the user's browser supports detecting it.
+
+When using solara server, the default theme variant can be set in the server settings through the command line interface. See
+[here](https://solara.dev/docs/understanding/solara-server) for more information.
+
+The active theme can be detected through `solara.lab.theme.dark_effective`, which is set to `True` or `False` depending on
+whether dark theme is enabled or not.
+
+## Example
+
+**Note**: Light and dark theme colors have to be set separately.
+
+```solara
+import solara
+import solara.lab
+from solara.lab import theme as theme
+
+
+def change_color(colors):
+    if "purple" in colors:
+        theme.themes.light.info = theme.themes.dark.info = "#8617c2"
+    else:
+        theme.themes.light.info = theme.themes.dark.info = "#2196f3"
+
+    if "green" in colors:
+        theme.themes.light.error = theme.themes.dark.error = "#33bd65"
+    else:
+        theme.themes.light.error = theme.themes.dark.error = "#ff5252"
+
+
+@solara.component
+def Page():
+    solara.Info("Info message")
+    solara.Error("Error message")
+
+    with solara.ToggleButtonsMultiple(on_value=change_color):
+        solara.Button("Change Info", value="purple")
+        solara.Button("Change Error", value="green")
+```
+
+A more advanced example can be found at [the scatter app demo](https://solara.dev/apps/scatter) where
+we set a plotly theme based on dark/light theme, and also set the app bar color to its default so it
+responds to the theme variant change.
+
+## ThemeToggle
+
+"""
+
+import solara
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "Themes"
+Page = NoPage
+__doc__ += apidoc(solara.lab.ThemeToggle)  # type: ignore

solara/website/pages/documentation/components/lab/use_task.py

@@ -0,0 +1,11 @@
+"""# use_task"""
+
+import solara
+import solara.autorouting
+import solara.lab
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "use_task"
+Page = NoPage
+__doc__ += apidoc(solara.lab.use_task)  # type: ignore

solara/website/pages/documentation/components/layout/__init__.py

@@ -0,0 +1,9 @@
+import solara
+from solara.website.components import NoPage, SubCategoryLayout
+
+Page = NoPage
+
+
+@solara.component
+def Layout(children=[]):
+    SubCategoryLayout(children=children)

solara/website/pages/documentation/components/layout/app_bar.py

@@ -0,0 +1,16 @@
+"""
+# AppBar
+
+"""
+
+import solara
+import solara.lab
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "AppBar"
+
+Page = NoPage
+
+
+__doc__ += apidoc(solara.AppBar.f)  # type: ignore

solara/website/pages/documentation/components/layout/app_bar_title.py

@@ -0,0 +1,16 @@
+"""
+# AppBarTitle
+
+"""
+
+import solara
+import solara.lab
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "AppBarTitle"
+
+Page = NoPage
+
+
+__doc__ += apidoc(solara.AppBarTitle.f)  # type: ignore

solara/website/pages/documentation/components/layout/app_layout.py

@@ -0,0 +1,24 @@
+"""
+# AppLayout
+
+"""
+
+import solara
+import solara.lab
+from solara.website.utils import apidoc
+
+title = "AppLayout"
+
+
+@solara.component
+def Page():
+    return solara.Markdown(
+        """
+    An example cannot be shown embedded in this page, Visit the [AppLayout page](/apps/scatter) to see an example.
+
+    [![AppLayout screenshot](https://dxhl76zpt6fap.cloudfront.net/public/docs/app-layout.webp)](/apps/scatter)
+    """
+    )
+
+
+__doc__ += apidoc(solara.AppLayout.f)  # type: ignore

solara/website/pages/documentation/components/layout/card.py

@@ -0,0 +1,15 @@
+"""
+# Card
+
+"""
+
+import solara
+import solara.lab
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "Card"
+
+Page = NoPage
+
+__doc__ += apidoc(solara.Card.f)  # type: ignore

solara/website/pages/documentation/components/layout/card_actions.py

@@ -0,0 +1,16 @@
+"""
+# CardActions
+
+"""
+
+import solara
+import solara.lab
+from solara.website.components import NoPage
+from solara.website.utils import apidoc
+
+title = "CardActions"
+
+Page = NoPage
+
+
+__doc__ += apidoc(solara.CardActions.f)  # type: ignore

solara/website/pages/documentation/components/layout/column.py

@@ -0,0 +1,30 @@
+"""
+# Column
+"""
+
+import solara
+import solara.lab
+from solara.website.utils import apidoc
+
+gap_size = solara.reactive("12px")
+align = solara.reactive("stretch")
+
+
+@solara.component
+def Page():
+    with solara.Card("Column demo") as main:
+        with solara.Column():
+            solara.Text("Align:")
+            solara.ToggleButtonsSingle(align, values=["start", "center", "end", "stretch"])
+            solara.Select(
+                label="Gap size",
+                values=["0px", "4px", "8px", "12px", "16px", "20px", "24px"],
+            ).connect(gap_size)
+        with solara.Column(gap=gap_size.value, align=align.value):
+            colors = "green red orange brown yellow pink".split()
+            for color in colors:
+                solara.Button("Solara", color=color)
+    return main
+
+
+__doc__ += apidoc(solara.Column.f)  # type: ignore