add documentation about dynamic prop

website/documentation.py

@@ -207,6 +207,7 @@ def tooltips_demo():
         NiceGUI uses the [Quasar Framework](https://quasar.dev/) version 1.0 and hence has its full design power.
         Each NiceGUI element provides a `props` method whose content is passed [to the Quasar component](https://justpy.io/quasar_tutorial/introduction/#props-of-quasar-components):
         Have a look at [the Quasar documentation](https://quasar.dev/vue-components/button#design) for all styling props.
+        Props with a leading `:` can contain JavaScript expressions that are evaluated on the client.
         You can also apply [Tailwind CSS](https://tailwindcss.com/) utility classes with the `classes` method.
 
         If you really need to apply CSS, you can use the `styles` method. Here the delimiter is `;` instead of a blank space.

website/more_documentation/date_documentation.py

@@ -23,3 +23,11 @@ def date():
                 ui.icon('edit_calendar').on('click', lambda: menu.open()).classes('cursor-pointer')
             with ui.menu() as menu:
                 ui.date().bind_value(date)
+
+    @text_demo('Date filter', '''
+        This demo shows how to filter the dates in a date picker.
+        In order to pass a function to the date picker, we use the `:options` property.
+        The leading `:` tells NiceGUI that the value is a JavaScript expression.
+    ''')
+    def date_filter():
+        ui.date().props('''default-year-month=2023/01 :options="date => date <= '2023/01/15'"''')