#439 move intro into table_reference.py

main.py

@@ -19,7 +19,7 @@ from nicegui import Client, app
 from nicegui import globals as nicegui_globals
 from nicegui import ui
 from website import demo_card, reference, svg
-from website.example import bash_window, browser_window, python_window
+from website.example import bash_window, browser_window, create_anchor_name, python_window
 from website.star import add_star
 from website.style import example_link, features, heading, link_target, section_heading, side_menu, subtitle, title
 
@@ -307,11 +307,12 @@ def reference_page_more(name: str):
     add_head_html()
     add_header()
     with side_menu():
-        ui.markdown('[← back](/reference)').classes('bold-links')
+        ui.markdown(f'[← back](/reference#{create_anchor_name(name)})').classes('bold-links')
     with ui.column().classes('w-full p-8 lg:p-16 max-w-[1250px] mx-auto'):
-        section_heading('More Examples', f'ui.*{name}*')
+        section_heading('Reference', f'ui.*{name}*')
         module = importlib.import_module(f'website.more_reference.{name}_reference')
-        getattr(module, 'more_examples')()
+        getattr(module, 'intro')()
+        getattr(module, 'more')()
 
 
 ui.run(uvicorn_reload_includes='*.py, *.css, *.html')

website/example.py

@@ -25,10 +25,14 @@ def remove_prefix(text: str, prefix: str) -> str:
     return text[len(prefix):] if text.startswith(prefix) else text
 
 
+def create_anchor_name(text: str) -> str:
+    return SPECIAL_CHARACTERS.sub('_', text).lower()
+
+
 def add_html_with_anchor_link(html: str, menu: Optional[ui.drawer]) -> str:
     match = REGEX_H4.search(html)
     headline = match.groups()[0].strip()
-    headline_id = SPECIAL_CHARACTERS.sub('_', headline).lower()
+    headline_id = create_anchor_name(headline)
     icon = '<span class="material-icons">link</span>'
     link = f'<a href="#{headline_id}" class="hover:text-black auto-link" style="color: #ddd">{icon}</a>'
     target = f'<div id="{headline_id}" style="position: relative; top: -90px"></div>'
@@ -91,11 +95,11 @@ class example:
 
             def pascal_to_snake(name: str) -> str:
                 return re.sub(r'(?<!^)(?=[A-Z])', '_', name).lower()
-            if isinstance(self.content, type):
+            if isinstance(self.content, type) and self.menu:
                 name = pascal_to_snake(self.content.__name__)
                 path = Path(__file__).parent / 'more_reference' / f'{name}_reference.py'
                 if path.exists():
-                    ui.markdown(f'[More examples...](reference/{name})').classes('bold-links')
+                    ui.markdown(f'[More...](reference/{name})').classes('bold-links')
 
         return f
 

website/more_reference/__init__.py

@@ -0,0 +1 @@
+from . import table_reference

website/more_reference/table_reference.py

@@ -1,9 +1,26 @@
+from typing import Optional
+
 from nicegui import ui
 
 from ..example import example
 
 
-def more_examples():
+def intro(menu: Optional[ui.element] = None) -> None:
+    @example(ui.table, menu)
+    def table_example():
+        columns = [
+            {'name': 'name', 'label': 'Name', 'field': 'name', 'required': True, 'align': 'left'},
+            {'name': 'age', 'label': 'Age', 'field': 'age', 'sortable': True},
+        ]
+        rows = [
+            {'name': 'Alice', 'age': 18},
+            {'name': 'Bob', 'age': 21},
+            {'name': 'Carol'},
+        ]
+        ui.table(columns=columns, rows=rows, row_key='name')
+
+
+def more() -> None:
     @example('''#### Table with expandable rows
 
 Scoped slots can be used to insert buttons that toggle the expand state of a table row.

website/reference.py

@@ -4,6 +4,7 @@ from typing import Dict
 from nicegui import app, ui
 from nicegui.elements.markdown import prepare_content
 
+from . import more_reference
 from .example import add_html_with_anchor_link, bash_window, example, python_window
 
 CONSTANT_UUID = str(uuid.uuid4())
@@ -292,18 +293,7 @@ To overlay an SVG, make the `viewBox` exactly the size of the image and provide
         ui.button('Update', on_click=update)
         ui.button('Select all', on_click=lambda: grid.call_api_method('selectAll'))
 
-    @example(ui.table, menu)
-    def table_example():
-        columns = [
-            {'name': 'name', 'label': 'Name', 'field': 'name', 'required': True, 'align': 'left'},
-            {'name': 'age', 'label': 'Age', 'field': 'age', 'sortable': True},
-        ]
-        rows = [
-            {'name': 'Alice', 'age': 18},
-            {'name': 'Bob', 'age': 21},
-            {'name': 'Carol'},
-        ]
-        ui.table(columns=columns, rows=rows, row_key='name')
+    more_reference.table_reference.intro(menu)
 
     @example(ui.chart, menu)
     def chart_example():