|
@@ -27,4 +27,23 @@ def auto_close():
|
|
|
ui.icon('', size='md').bind_name_from(toggle, 'value')
|
|
|
|
|
|
|
|
|
+@doc.demo('Menu with sub-menus', '''
|
|
|
+ You can use a `ui.menu` nested inside a `ui.menu_item` to created nested sub-menus.
|
|
|
+ The "anchor" and "self" props can be used to position the sub-menu.
|
|
|
+ Make sure to disable `auto-close` on the corresponding menu item to keep the menu open while navigating the sub-menu.
|
|
|
+''')
|
|
|
+def submenus():
|
|
|
+ with ui.button(icon='menu'):
|
|
|
+ with ui.menu():
|
|
|
+ ui.menu_item('Option 1')
|
|
|
+ ui.menu_item('Option 2')
|
|
|
+ with ui.menu_item('Option 3', auto_close=False):
|
|
|
+ with ui.item_section().props('side'):
|
|
|
+ ui.icon('keyboard_arrow_right')
|
|
|
+ with ui.menu().props('anchor="top end" self="top start" auto-close'):
|
|
|
+ ui.menu_item('Sub-option 1')
|
|
|
+ ui.menu_item('Sub-option 2')
|
|
|
+ ui.menu_item('Sub-option 3')
|
|
|
+
|
|
|
+
|
|
|
doc.reference(ui.menu)
|