Py.Cafe

fomightez/

add-HTML-updating-to-markdown-and-HTML-in-ipywidgets

Add HTML updating to using markdown and HTML in ipywidgets

DocsPricing
  • app.py
  • requirements.txt
app.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
import solara
import ipywidgets as widgets 
import markdown 
from ipywidgets import HTML

html = markdown.markdown("""# Markdown""")
the_HTML = HTML(html) # markdown as widget based on https://github.com/jupyter-widgets/ipywidgets/issues/2428#issuecomment-500084610
# reactive variables will trigger a component rerender
# when changed.
# When you change the default (now 0), hit the embedded browser
# refresh button to reset the state
clicks = solara.reactive(0)

but1 = widgets.RadioButtons(options=["foo", "bar"])
check1 = widgets.Checkbox(description="Toggle this checkbox & watch text above", indent=False)
check2 = widgets.Checkbox(description="verylongstringherethisislong", indent=False)

box_layout = widgets.Layout(
    align_items='flex-start',
    width='1300px',
    justify_content='flex-start'
)
#the_HTML.value = ("<p>Go away!</p>") # change value based on https://stackoverflow.com/a/55550657/8508004

def update_html(change):
    if change['new']:
        # Update the HTML content when the checkbox is checked
        new_html = "<h2>Checkbox checked!</h2>"
        the_HTML.value = new_html
    else:
        # Reset the HTML content when the checkbox is unchecked
        the_HTML.value = html

# Bind the update_html function to the check1 checkbox
check1.observe(update_html, names='value')

# Solara also supports ipywidgets
# remove the Page component and assign an ipywidget to
# the page variable, e.g.
vbox = widgets.VBox(
    children=[
        widgets.HBox(children=[but1,], layout=box_layout),
        the_HTML,
        #solara.Markdown(f"**Button color**:{clicks} "), # based on https://github.com/paddymul/buckaroo/blob/main/example-notebooks/Solara-Buckaroo.ipynb
        widgets.HBox(children=[check1], layout=box_layout)
    ]
)

page = vbox