import param
from panel.reactive import ReactiveHTML
import panel as pn
pn.extension()
# nested reactive html
class NestedReactiveHTML(ReactiveHTML):
value = param.Integer(default=0)
_template = """
<div style="border: 1px solid black; padding: 10px;">
<div id="value">Value: ${value}</div>
</div>
"""
_scripts = {
"increment": """
data.value += 1;
"""
}
class OuterReactiveHTML(ReactiveHTML):
nested_value = param.ClassSelector(class_=NestedReactiveHTML)
_template = """
<div style="border: 1px solid black; padding: 10px;">
${nested_value}
</div>
"""
OuterReactiveHTML(nested_value=NestedReactiveHTML()).servable()
Traceback:
bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:226 Error: attempted to redefine property 'NestedReactiveHTML00109.tags'
at o.define (bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:179:886)
at r.decode_def (bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:216:1506)
at p._decode (bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:211:1131)
at bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:211:2249
at f (bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:178:450)
at p._decode_plain_array (bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:211:2237)
at p._decode (bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:211:928)
at bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:211:614
at p.decode (bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:211:730)
at S.from_json (bokeh.min.js?v=c8d721b75531cff043feef626ae0d6e29a26031fae26bba93c1baa962ecfb1b43f211027df3a0cf7772f30afed8c38198d70677b8967e581ca7e605358c68465:165:6011)