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

solara/website/pages/changelog/changelog.md

@@ -0,0 +1,204 @@
+# Solara Changelog
+
+## Version 1.30.1
+
+### Details
+
+   * Bug Fix: Serialization error from attempt to serialize default event handles in `component_vue`. [793cbb1](https://github.com/widgetti/solara/commit/793cbb19d8c361490b7e0b1e436a3e9ef3acea71)
+   * Bug Fix: `on_kernel_start` callback cleanups could have been triggered multiple times. [4b75ca9](https://github.com/widgetti/solara/commit/4b75ca934f4e905a3592911bfca6657e491d1425)
+   * Bug Fix: Autorender did not render child routes. [#575](https://github.com/widgetti/solara/pull/575)
+
+
+## Version 1.30.0
+
+### Details
+
+   * Feature: Multiple file support for `FileDrop`. [#562](https://github.com/widgetti/solara/pull/562)
+   * Feature: Solara server is now compatible with Pyodide (threads are combined if they cannot be used). [#569](https://github.com/widgetti/solara/pull/569)
+   * Bug Fix: Nested Vuetify apps were not displayed correctly. [#570](https://github.com/widgetti/solara/pull/570)
+   * Bug Fix: `on_kernel_start` callbacks were accumulating on hot reload. [#556](https://github.com/widgetti/solara/pull/556)
+   * Bug Fix: ES Modules were being loaded multiple times on hot reload. [#559](https://github.com/widgetti/solara/pull/559)
+   * Bug Fix: Theme CSS was not loaded when `rootPath` was non-trivial. [829946c](https://github.com/widgetti/solara/commit/829946c4bf47a2ea78d783bb500faaab93b2549b)
+   * Fix: `Route.component` is now rendered, instead of the internal `RenderPage` component. [#555](https://github.com/widgetti/solara/pull/555)
+   * Fix: `Route.layout` now allows for layouts to be used when defining routes manually. [#554](https://github.com/widgetti/solara/pull/554)
+   * Fix: Allow custom command like arguments that can be parsed by the application. [#558](https://github.com/widgetti/solara/pull/558)
+
+
+## Version 1.29.1
+
+### Details
+
+   * Bug Fix: Solara installation failing when using [pixi](https://pixi.sh/latest/). [#553](https://github.com/widgetti/solara/pull/553)
+
+## Version 1.29.0
+
+<video width="80%" controls>
+   <source src="https://solara-assets.s3.us-east-2.amazonaws.com/videos/solara-1.29-drawdata-na.mp4" type="video/mp4" >
+</video>
+
+
+### Highlights
+
+  * Feature: Improved matplotlib support (pylab interface, display support) making it work more similar as in Jupyter. [#540](https://github.com/widgetti/solara/pull/540)
+  * Feature: [use_dark_effective](https://solara.dev/api/use_dark_effective) to get the effective dark mode of the app, making it easier to support dark mode on the Python side [#551](https://github.com/widgetti/solara/pull/551).
+
+
+### Details
+
+   * Feature: [`/resourcez` endpoint](https://solara.dev/docs/understanding/solara-server) to get server resource statistics [#547](https://github.com/widgetti/solara/pull/547).
+   * Bug fix: router.push to external links should not use history, allowing navigation to external links [11c6094](https://github.com/widgetti/solara/commit/11c6094f3c47528d40f8be951c1d322e454f98ea).
+   * Bug fix: After upgrading widgets, solara server would still use the previous version due to browser cache [#523](https://github.com/widgetti/solara/pull/523).
+   * Bug fix: [The example todo app](https://solara.dev/examples/utilities/todo) would not work because Ref(..) did not work in combination with use_reactive [#544](https://github.com/widgetti/solara/pull/544).
+
+## Version 1.28.0
+
+<video width="80%" controls>
+   <source src="https://dxhl76zpt6fap.cloudfront.net/videos/solara-theme.mp4"  type="video/mp4" >
+</video>
+
+### Highlight
+
+   * Feature: [Theming support](https://solara.dev/api/theming), including dark theme and auto-detection of device preference [#494](https://github.com/widgetti/solara/pull/494).
+
+### Details
+
+   * Feature: Support for [ES modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) using [ipyReact](https://github.com/widgetti/ipyreact)
+      [#516](https://github.com/widgetti/solara/pull/516).
+   * Feature: Support for [Polars](https://pola.rs/) dataframes in `solara.DataFrame` [#195](https://github.com/widgetti/solara/pull/195)
+   * Bug Fix: User reactive variables sometimes taking on the value of a solara builtin one (issue [#510](https://github.com/widgetti/solara/issues/510))
+      [#514](https://github.com/widgetti/solara/pull/514)
+   * Bug Fix: An extra scrollbar sometimes appearing when no `AppBar` or `SideBar` was present on the page [#477](https://github.com/widgetti/solara/pull/477)
+   * Bug Fix: The browser main scrollbar being present on pages with no scrolling enabled [#518](https://github.com/widgetti/solara/pull/518)
+
+## Version 1.27.0
+
+
+<video width="80%" controls>
+   <source src=https://dxhl76zpt6fap.cloudfront.net/videos/solara-tasks.mp4  type="video/mp4" >
+</video>
+
+### Highlight
+
+   * Feature: [Task support](https://solara.dev/api/task). Lets you run code in the background, with the UI available to the user. This is useful for long running tasks, like downloading data or processing data [#461](https://github.com/widgetti/solara/pull/461).
+   * Feature: Provide access to [cookies and request headers](https://solara.dev/api/cookies_headers) [#501](https://github.com/widgetti/solara/pull/501)
+   * Refactor: Replace MathJax with KaTeX for faster math rendering and a lighter package [#483](https://github.com/widgetti/solara/pull/483)
+
+## Version 1.26.0
+
+### Demo of @solara.lab.computed with
+
+<video width="80%" controls>
+   <source src="https://github.com/widgetti/solara/assets/5592797/daf21bb0-ce94-4d5e-9ebb-339ea768b3ac" type="video/mp4" >
+</video>
+
+### Highlight
+
+   * Feature: [computed reactive variables](https://solara.dev/api/computed) which use the return value of the function. The value will be updated when any of the reactive variables used in the function [#455](https://github.com/widgetti/solara/pull/455).
+
+### Details
+
+   * Feature: on_kernel_start triggers callback on virtual kernel start [#471](https://github.com/widgetti/solara/pull/471).
+   * Bug fix: Altair works in VSCode and Google Colab [#488](https://github.com/widgetti/solara/pull/488).
+   * Feature: get_kernel_id and get_session_id for custom storage [#452](https://github.com/widgetti/solara/pull/452).
+   * Bug fix: Mermaid and Math rendering in Jupyter Lab and VSCode [#480](https://github.com/widgetti/solara/pull/480).
+
+## Version 1.25.1
+
+### Details
+
+* Performance: Removed unnecessary CSS and JS.
+* Performance: Quality of Life - JS and CSS resources automatically reloaded on version change.
+* Bug fix: overlay disabling navigation for display width < 960px.
+
+
+## Version 1.25.0
+
+
+### Demo of a Chat GPT interface with medical 3d visualization
+
+<video width="80%" controls>
+   <source src="https://github.com/widgetti/solara/assets/1765949/ca149ab5-0bd3-4eea-9736-08e1e0b06771" type="video/mp4" >
+</video>
+
+
+
+
+### Highlight
+
+ * Feature: Chat interface components for chatbots, chatrooms or conversational elements in your dashboards or apps [#384](https://github.com/widgetti/solara/pull/384)
+
+### Details
+
+ * Performance: Under starlette, we throttle sending websocket messages to get better performance, this is experimental and can be enabled by setting the
+   environment variable `SOLARA_EXPERIMENTAL_PERFORMANCE=1` [#400](https://github.com/widgetti/solara/pull/400)
+ * Performance: Reuse the jinja environment when rendering templates (this also saves memory).
+
+## Version 1.24.0
+
+### Demo of CSS hot reloading
+
+<video width="80%" controls>
+   <source src="https://github.com/widgetti/solara/assets/1765949/3a15b8fa-f38e-4376-ad05-330593d98de8" type="video/mp4" >
+</video>
+
+
+### Highlight
+
+ * Feature: Hot reloading of css file used with Style components [#396](https://github.com/widgetti/solara/pull/396)
+ * Bug fix: display() did not work in threads [#398](https://github.com/widgetti/solara/pull/398)
+ * Bug fix: Support home directory on Windows.
+
+
+### Details
+
+ * Bug fix: Do not trigger re-render due to unneeded state in context [#386](https://github.com/widgetti/solara/pull/386)
+ * Feature: Show number of widgets created and close when using --timing [#387](https://github.com/widgetti/solara/pull/387)
+
+
+## Version 1.23.0
+
+### Demo app 'TimeTrekker'
+
+<video width="80%" controls>
+   <source src="https://github.com/widgetti/solara/assets/1765949/17598728-0678-495b-955a-965ce9283200" type="video/mp4" >
+</video>
+
+### Demo app 'Wanderlust'
+
+<video width="80%" controls>
+   <source src="https://github.com/widgetti/wanderlust/assets/1765949/fe3db611-4f46-4ca3-b4c2-ace6d2b1493b" type="video/mp4" >
+</video>
+
+
+### Highlights
+
+ * Feature: Solara now has a production mode (enabled by passing in `--production`) which will load optimized CSS and JS and disable hot reloading.
+    Our [Solara server](https://solara.dev/documentation/advanced/understanding/solara-server) page contains more information about it. If you used `--reload` or
+    `--dev` before you can now use the `-a/--auto-restart` flat. The `--dev` and `--reload` flags are kept for backwards compatibility.
+ * Feature: All `Input` components expose the `style` and `classes` arguments for custom styling.
+ * Feature: New component: [`InputDate` and `InputDateRange`](https://solara.dev/api/input_date) which use a datepicker in a menu. (#326)
+ * Feature: The AppLayout component exposes the `style` and `classes` argument for custom styling: [#367](https://github.com/widgetti/solara/pull/367)
+ * Feature: Initial support for ipyvue and ipyvuetify v3: [#364](https://github.com/widgetti/solara/pull/364)
+ * Feature: The `InputText` now takes an `update_events` on argument for custom key combination. This also allows to opt-out of the 'blur' event triggering an on_value: [#376](https://github.com/widgetti/solara/pull/376)
+ * Bug fix: When using a Sidebar or AppBar we would previously render the main `Page` component twice, this does not happen anymore: [#366](https://github.com/widgetti/solara/pull/366)
+ * Documentation: Added a "Jupyter dashboard tutorial" part 1.
+ * Documentation: Added documentation for [`use_effect`](https://solara.dev/api/use_effect), [`use_memo`](https://solara.dev/api/use_effect), and improved the documentation of [`use_thread`](https://solara.dev/api/use_thread).
+ * Example: Added an [AI tokenizer app example](https://solara.dev/examples/ai/tokenizer)
+ * Showcase: Added a reproduction of the [OpenAI Wanderlust app](https://solara.dev/showcase) to our showcases.
+
+
+### Details
+
+ * Feature: Menu supports use_activator_width argument, which can be set to false to not have the menu popup be the same with as the activator which is useful for fixed width components such as a date picker.
+ * Feature:
+ * Bug fix: Menu component avoids an extra div around the activator to not interfere with the layout: [#345](https://github.com/widgetti/solara/pull/345)
+ * Bug fix: Menu could be closed or opened on a re-render.
+ * Bug fix: Solara server failed to start in Docker when $HOME is not set or not writable.
+ * Bug fix: Solara server should only try to watch files that exists for hot reloading: [#356](https://github.com/widgetti/solara/pull/356)
+ * Bug fix: A ToggleButtons component using Buttons with `value=None` would cast it to a string (i.e. `value="None"`) : [#369](https://github.com/widgetti/solara/pull/369)
+ * Bug fix: PyTest based tests using vue_component_registry would fail outside of solara context, tests should run normally now.
+ * Bug fix: Our monkeypatched Output widget would raise an exception when `get_ipython` returns None such as in pytest based testing.
+ * Bug fix: A custom `Layout` component was ignored when running solara as a module: [#368](https://github.com/widgetti/solara/pull/368)
+ * Bug fix: A custom title was ignored when running solara as a script.
+ * Bug fix: When a child component would overrwrite a meta tags, it now overwrites it.
+ * Bug fix: do not use excessive memory when rendering markdown: [#382](https://github.com/widgetti/solara/pull/382)

solara/website/pages/contact/__init__.py

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

solara/website/pages/contact/contact.md

@@ -0,0 +1,17 @@
+# Contact
+
+## Business
+
+Solara is developed mostly by Maarten Breddels and Mario Buikhuizen, Founders
+of [Widgetti](https://widgetti.io/).
+
+For business inquiries, please contact us at [contact@solara.dev](mailto:contact@solara.dev) regarding Solara, or [info@widgetti.io](mailto:info@widgetti.io) regarding more general Jupyter related matters.
+
+## Community
+
+If you want to share your thoughts, share your experiences, or just want to talk
+to other people using and developing on Solara, consider using [GitHub discussions](https://github.com/widgetti/solara/discussions) for asynchronous discussions
+or consider joining discord for more synchronous discussions.
+
+
+[![Discord Shield](https://discordapp.com/api/guilds/1106593685241614489/widget.png?style=banner2)](https://discord.gg/dm4GKNDjXN)

solara/website/pages/doc_use_download.py

@@ -0,0 +1,85 @@
+# flake8: noqa
+import solara
+import solara as sol
+from solara.alias import rv, rw
+
+from .docutils import IncludeComponent
+
+file_path = "yolov3.weights"
+url = "https://pjreddie.com/media/files/yolov3.weights"
+expected_size = 248007048
+
+
+@solara.component
+def DownloadFile(file_path=file_path, url=url, expected_size=expected_size, on_done=None):
+    download = solara.hooks.use_download(file_path, url, expected_size=expected_size)
+    downloaded_size = download.progress * expected_size
+    if on_done:
+        on_done(download.progress == 1)
+    if download.value:
+        status = "Done 🎉"
+    else:
+        MEGABYTES = 2.0**20.0
+        status = "Downloading {}... ({:6.2f}/{:6.2f} MB)".format(file_path, downloaded_size / MEGABYTES, expected_size / MEGABYTES)
+    # status = "hi"
+    # return MarkdownIt(f'{status}')
+    assert download.progress is not None
+    with rv.Container() as main:
+        # with w.VBox() as main:
+        with rv.Row():
+            with rv.Col(cols=1):
+                progressbar = rv.ProgressLinear(value=download.progress * 100, color="primary", striped=True, height=20)
+            # with rv.Col(cols=1):
+            #     MarkdownIt(f'{status}')
+    return main
+
+
+@solara.component
+def DocUseDownload():
+    with rv.Container() as main:
+        with rw.VBox(layout={"padding": "20px", "max_width": "1024px"}):
+            solara.MarkdownIt(
+                """
+# use_download
+
+```python
+def use_state(initial: T, key: str = None) -> Tuple[T, Callable[[T], T]]:
+    ...
+```
+
+use_state can be used to create a variable that is local to this component, and will be preserved during rerenders.
+
+It returns a tuple with the current value, and a setter function that should be called to change the variable. A call to this setter
+will trigger a rerender, and will cause the `use_state` function to return the new value on the next render.
+
+## Simple examples
+
+### Click button
+
+Lets start with a Button, that renders how many times it is clicked.
+        """
+            )
+            IncludeComponent(
+                DownloadFile,
+                """
+import reacton
+import solara.ipywidgets as w
+
+""",
+                highlight=[6],
+            )
+    #             MarkdownIt("""
+    # ### Markdown editor
+    # Lets continue with a more typical pattern, and create new new markdown component
+    #         """)
+    #             IncludeComponent(MarkdownIt, md_text="# This is a custom\nMark-*down* **component**")
+
+    #             MarkdownIt("""This component does not have state itself, the markdown text can only be set via its argument.
+    # A common pattern is then to have its parent component manage the state, and pass it down:
+    # """)
+    #             # IncludeComponent(MarkdownEditor, md="# Edit me\nand the markdown component **will** *update*", highlight=[3,5,6])
+    #             MarkdownIt("""Here we see the `MarkdownEditor` component using the `use_state` function to store the markdown text, while letting the `Textarea` component change its value""")
+    return main
+
+
+DownloadFile("yolov3.weights", "https://pjreddie.com/media/files/yolov3.weights", expected_size=248007048)

solara/website/pages/documentation/__init__.py

@@ -0,0 +1,184 @@
+from pathlib import Path
+
+import solara
+
+_title = "Documentation"
+
+HERE = Path(__file__).parent
+
+route_order = ["/", "getting_started", "examples", "components", "api", "advanced", "faq"]
+
+
+@solara.component_vue(str(HERE.parent.parent / "components" / "algolia_api.vue"))
+def Algolia():
+    pass
+
+
+@solara.component
+def Page(children=[]):
+    # show a gallery of all the api pages
+    router = solara.use_router()
+    route_current = router.path_routes[-2]
+
+    with solara.Column(style={"width": "100%"}, gap="75px"):
+        if route_current.path == "documentation":
+            with solara.Column(classes=["api-search-container"], gap="50px", style={"justify-content": "center"}, align="center"):
+                solara.Markdown("# Search the Solara Documentation", style={"text-align": "center"})
+                with solara.Row(style={"width": "100%", "min-width": "20rem", "justify-content": "center", "background-color": "transparent"}):
+                    Algolia()
+            with solara.Row(gap="20px", classes=["docs-card-container"]):
+                for route in route_current.children:
+                    if route.path in ["/", "advanced", "faq"]:
+                        continue
+                    with solara.Link("/documentation/" + route.path):
+                        with solara.Row(
+                            classes=["docs-card"],
+                            style={
+                                "background-color": f"var({'--docs-color-grey' if route.path != 'getting_started' else '--color-primary'})",
+                            },
+                        ):
+                            with solara.Column(style={"height": "100%", "flex-grow": "1", "background-color": "transparent"}):
+                                solara.HTML(tag="h2", unsafe_innerHTML=route.label, style={"color": "white", "padding": "1.5rem"})
+                            with solara.Column(style={"justify-content": "center", "height": "100%", "background-color": "transparent"}):
+                                solara.v.Icon(children=["mdi-arrow-right"], color="var(--color-grey-light)", x_large=True, class_="docs-card-icon")
+            with solara.Row(gap="75px", style={"flex-wrap": "wrap", "row-gap": "75px", "padding-bottom": "75px"}):
+                with solara.Column(style={"padding-left": "10%"}):
+                    solara.HTML(tag="h2", unsafe_innerHTML="How to use our documentation:", style={"padding": "1.5rem"})
+                    solara.Markdown(
+                        """
+* [Getting Started](/documentation/getting_started) - Learn how to install Solara and get started with building your app.
+    Also includes tutorials for you to get a hang of Solara workflow.
+* [Examples](/documentation/examples) - More complex and real world applicable examples of Solara apps.
+    For even more complexity you can see the [Showcase](/showcase) page.
+* [Components](/documentation/components) - All the components that are available in Solara.
+* [API](/documentation/api) - All the API functions that are available in Solara. Importantly, this includes routing and hooks.
+* [Advanced](/documentation/advanced) - Advanced topics like associated and underlying libraries.
+    If a component you would like to use is not available in Solara, you can use the underlying library directly.
+                    """
+                    )
+                with solara.Column(style={"justify-content": "center", "height": "100%"}):
+                    solara.HTML(tag="h2", unsafe_innerHTML="Also Check Out", style={"padding": "1.5rem"})
+                    with solara.Row(gap="20px", style={"flex-wrap": "wrap", "row-gap": "20px", "align-items": "center"}):
+                        with solara.v.Html(tag="a", attributes={"href": "https://discord.solara.dev", "target": "_blank"}):
+                            with solara.Div(classes=["social-logo-container"], style={"background-color": "var(--docs-social-discord)"}):
+                                solara.v.Html(tag="img", attributes={"src": "/static/public/social/discord.svg"}, style_="height: 1.5rem; width: auto;")
+                        solara.Text("We use discord to provide support and answer questions there actively.")
+                    with solara.Row(gap="20px", style={"flex-wrap": "wrap", "row-gap": "20px", "align-items": "center"}):
+                        with solara.v.Html(tag="a", attributes={"href": "https://github.com/widgetti/solara", "target": "_blank"}):
+                            with solara.Div(classes=["social-logo-container"], style={"background-color": "var(--docs-social-github)"}):
+                                solara.v.Html(tag="img", attributes={"src": "/static/public/social/github.svg"}, style_="height: 1.5rem; width: auto;")
+                        solara.Text("Search for solutions on Github issues, or report bugs.")
+                    with solara.Row(gap="20px", style={"flex-wrap": "wrap", "row-gap": "20px", "align-items": "center"}):
+                        with solara.v.Html(tag="a", attributes={"href": "https://twitter.com/solara_dev", "target": "_blank"}):
+                            with solara.Div(classes=["social-logo-container"], style={"background-color": "var(--docs-social-twitter)"}):
+                                solara.v.Html(tag="img", attributes={"src": "/static/public/social/twitter.svg"}, style_="height: 1.5rem; width: auto;")
+                        solara.Text("Get announcements about Solara features, showcases, and events!.")
+
+        else:
+            with solara.Column(align="center", children=children, style={"padding": "0"}):
+                pass
+
+
+@solara.component
+def Sidebar():
+    route_current, all_routes = solara.use_route()
+    router = solara.use_router()
+    if route_current is None:
+        return solara.Error("Page not found")
+
+    with solara.v.NavigationDrawer(
+        clipped=True, width="20rem", height="unset", style_="min-height: calc(100vh - 215.5px);", class_="d-none d-md-block"
+    ) as main:
+        with solara.v.List(expand=True, nav=True, style_="height: calc(100vh - 215.5px); display: flex; flex-direction: column;"):
+            with solara.v.ListItemGroup(v_model=router.path):
+                for route in all_routes:
+                    if len(route.children) == 1 or route.path == "/":
+                        with solara.Link("/documentation/" + route.path if route.path != "/" else "/documentation"):
+                            with solara.v.ListItem(value="/documentation/" + route.path if route.path != "/" else "/documentation"):
+                                if route.path == "/":
+                                    solara.v.ListItemIcon(children=[solara.v.Icon(children=["mdi-home"])])
+                                solara.v.ListItemTitle(style_="padding: 0 20px;", children=[route.label])
+                    else:
+                        with solara.v.ListGroup(
+                            v_slots=[
+                                {
+                                    "name": "activator",
+                                    "children": solara.v.ListItemTitle(
+                                        children=[route.label],
+                                        style_="padding: 0 20px;",
+                                    ),
+                                }
+                            ],
+                            value=router.path.startswith("/documentation/" + route.path),
+                        ):
+                            for item in route.children:
+                                if item.path == "/":
+                                    continue
+                                if item.children != [] and any([c.label is not None and c.path != "/" for c in item.children]):
+                                    with solara.v.ListGroup(
+                                        v_slots=[
+                                            {
+                                                "name": "activator",
+                                                "children": solara.v.ListItemTitle(
+                                                    children=[item.label],
+                                                ),
+                                            }
+                                        ],
+                                        sub_group=True,
+                                        no_action=True,
+                                        value=router.path.startswith("/documentation/" + route.path + "/" + item.path),
+                                    ):
+                                        for subitem in item.children:
+                                            # skip pages that are only used to demonstrate Link or Router usage
+                                            if subitem.path == "/" or subitem.label is None:
+                                                continue
+                                            path = (
+                                                "/documentation/" + route.path + "/" + item.path + "/" + subitem.path
+                                                if item.path != "fullscreen"
+                                                else "/apps/" + subitem.path
+                                            )
+                                            with solara.Link(
+                                                path,
+                                            ):
+                                                with solara.v.ListItem(dense=True, style_="padding: 0 20px;", value=path):
+                                                    solara.v.ListItemContent(
+                                                        children=[subitem.label],
+                                                    )
+                                else:
+                                    with solara.v.ListItemGroup(value="/documentation/" + route.path + "/" + item.path):
+                                        with solara.Link(
+                                            "/documentation/" + route.path + "/" + item.path,
+                                        ):
+                                            with solara.v.ListItem(dense=True, style_="padding: 0 20px;"):
+                                                solara.v.ListItemContent(
+                                                    children=[item.label],
+                                                )
+            solara.v.Spacer(style_="flex-grow: 1;")
+            with solara.v.ListItemGroup():
+                with solara.Link("/contact"):
+                    with solara.v.ListItem():
+                        solara.v.ListItemIcon(children=[solara.v.Icon(children=["mdi-email"])])
+                        solara.v.ListItemTitle(style_="padding: 0 20px;", children=["Contact"])
+                with solara.Link("/changelog"):
+                    with solara.v.ListItem():
+                        solara.v.ListItemIcon(children=[solara.v.Icon(children=["mdi-history"])])
+                        solara.v.ListItemTitle(style_="padding: 0 20px;", children=["Changelog"])
+
+    return main
+
+
+@solara.component
+def Layout(children=[]):
+    route_current, all_routes = solara.use_route()
+    if route_current is None:
+        return solara.Error("Page not found")
+
+    if route_current.path == "/":
+        return Page()
+    else:
+        return Page(children=children)
+
+
+@solara.component
+def Overview():
+    pass

solara/website/pages/documentation/advanced/__init__.py

@@ -0,0 +1,9 @@
+from pathlib import Path
+
+from solara.autorouting import generate_routes_directory
+from solara.website.components.markdown import MarkdownWithMetadata
+
+HERE = Path(__file__)
+# if we didn't put the content in the subdirectory, but pointed to the current file
+# we would include the current file recursively, causing an infinite loop
+routes = generate_routes_directory(HERE.parent / "content", MarkdownWithMetadata)

solara/website/pages/documentation/advanced/content/00-overview.md

@@ -0,0 +1 @@
+The entries are meant as deeper dives into specific topics. Although we try to write each as a standalone document, some parts may build on previous ones.

solara/website/pages/documentation/advanced/content/10-howto/00-overview.md

@@ -0,0 +1,6 @@
+---
+title: Overview of how-to articles
+description: The how-tos are meant as deeper dives into specific topics from various perspectives
+---
+
+The how-tos are meant as deeper dives into specific topics. Although we try to write each how-to as a standalone document, some parts of a how-to may build on top of a previous one.