Consider PacemPanelElement as a general purpose <div>. It has the basic characteristics of a PacemElement (abstract visual class that allows css classes and inline css bindings)
plus dynamic HTML content, just in case.
<pacem-panel><!-- content goes here --></pacem-panel>
Fairly sanitized HTML content can be injected via content property/attribute:
<pacem-data model="{{ '<script>alert(\'Nasty!\')</script><code>some content</code>' }}" id="htmlData"></pacem-data>
<!-- sanitized content pulled from outside -->
<pacem-panel content="{{ #htmlData.model }}"></pacem-panel>
Otherwise, just render plain text via text property/attribute:
<pacem-data model="{ foo: 'bar', baz: 200 }" id="someData"></pacem-data>
<!-- plain text pulled from outside -->
<pacem-panel text="{{ JSON.stringify(#someData.model) }}"></pacem-panel>
To provide the best experiences, we use technologies like cookies to store and/or access device information. Consenting to these technologies will allow us to process data such as browsing behavior or unique IDs on this site. Not consenting or withdrawing consent, may adversely affect certain features and functions.