Sfoglia il codice sorgente

Update tooltip documentation: clarify method limitations and add upload component example (#3338)

* Update tooltip_documentation.py

Added some information to the Tooltip method
Added a demo for ui.upload

* review

* tiny cleanup

---------

Co-authored-by: Falko Schindler <falko@zauberzeug.com>
FSchmidt-FUNKE 10 mesi fa
parent
commit
b76c2d44e2
1 ha cambiato i file con 14 aggiunte e 1 eliminazioni
  1. 14 1
      website/documentation/content/tooltip_documentation.py

+ 14 - 1
website/documentation/content/tooltip_documentation.py

@@ -11,6 +11,9 @@ def tooltips_demo():
 
 @doc.demo('Tooltip method', '''
     Instead of nesting a tooltip element inside another element, you can also use the `tooltip` method.
+
+    Note that with this method you cannot apply additional properties (props) or styling directly to the tooltip.
+    If you need custom styling or properties, nest a `ui.tooltip` element instead.
 ''')
 def tooltip_method_demo():
     ui.label('Tooltips...').tooltip('...are shown on mouse over')
@@ -26,7 +29,7 @@ def tooltip_html_demo():
 
 
 @doc.demo('Tooltip with other content', '''
-    You can use HTML in tooltips.
+    Other elements like `ui.images` can also be nested inside a tooltip.
 ''')
 def tooltip_with_other_content():
     with ui.label('Mountains...'):
@@ -43,4 +46,14 @@ def tooltip_on_html_and_markdown():
         ui.html('This is <u>HTML</u>...')
 
 
+@doc.demo('Tooltip for the upload element', '''
+    Components like `ui.upload` do not support tooltips directly.
+    You can wrap them in a `ui.element` to add tooltips and props.
+''')
+def simple_upload_with_tooltip_demo():
+    with ui.element():
+        ui.upload(on_upload=lambda e: ui.notify(f'Uploaded {e.name}')).classes('w-72')
+        ui.tooltip('Upload files').props('delay=1000 transition-show=rotate')
+
+
 doc.reference(ui.tooltip)