<div><ch5-button id="ref-top-left" label="top-left" sendEventOnClick="trigger_top-left"></ch5-button></div>
<div><ch5-button id="ref-top-center" label="top-center" sendEventOnClick="trigger_top-center"></ch5-button></div>
<div><ch5-button id="ref-top-right" label="top-right" sendEventOnClick="trigger_top-right"></ch5-button></div>
<div><ch5-button id="ref-bottom-left" label="bottom-left" sendEventOnClick="trigger_bottom-left"></ch5-button></div>
<div><ch5-button id="ref-bottom-center" label="bottom-center" sendEventOnClick="trigger_bottom-center"></ch5-button></div>
<div><ch5-button id="ref-bottom-right" label="bottom-right" sendEventOnClick="trigger_bottom-right"></ch5-button></div>
<div><ch5-button id="ref-left-center" label="left-center" sendEventOnClick="trigger_left-center"></ch5-button></div>
<div><ch5-button id="ref-right-center" label="right-center" sendEventOnClick="trigger_right-center"></ch5-button></div>

<ch5-overlay-panel
        receiveStateShowPulse="trigger_top-left"
        closable
        positionTo="ref-top-left"
        positionOffset="top-left">
    <p>Sample text</p>
    <ch5-image url="https://picsum.photos/200/300/?random">
    </ch5-image>
</ch5-overlay-panel>




<ch5-overlay-panel
        receiveStateShowPulse="trigger_top-center"
        closable
        positionTo="ref-top-center"
        positionOffset="top-center">
    <p>Sample text</p>
    <ch5-image url="https://picsum.photos/200/300/?random">
    </ch5-image>
</ch5-overlay-panel>




<ch5-overlay-panel
        receiveStateShowPulse="trigger_top-right"
        closable
        positionTo="ref-top-right"
        positionOffset="top-right">
    <p>Sample text</p>
    <ch5-image url="https://picsum.photos/200/300/?random">
    </ch5-image>
</ch5-overlay-panel>

<ch5-overlay-panel
        receiveStateShowPulse="trigger_bottom-left"
        closable
        positionTo="ref-bottom-left"
        positionOffset="bottom-left">
    <p>Sample text</p>
    <ch5-image url="https://picsum.photos/200/300/?random">
    </ch5-image>
</ch5-overlay-panel>




<ch5-overlay-panel
        receiveStateShowPulse="trigger_bottom-center"
        closable
        positionTo="ref-bottom-center"
        positionOffset="bottom-center">
    <p>Sample text</p>
    <ch5-image url="https://picsum.photos/200/300/?random">
    </ch5-image>
</ch5-overlay-panel>




<ch5-overlay-panel
        receiveStateShowPulse="trigger_bottom-right"
        closable
        positionTo="ref-bottom-right"
        positionOffset="bottom-right">
    <p>Sample text</p>
    <ch5-image url="https://picsum.photos/200/300/?random">
    </ch5-image>
</ch5-overlay-panel>



<ch5-overlay-panel
        receiveStateShowPulse="trigger_left-center"
        closable
        positionTo="ref-left-center"
        positionOffset="left-center">
    <p>Sample text</p>
    <ch5-image url="https://picsum.photos/200/300/?random">
    </ch5-image>
</ch5-overlay-panel>


<ch5-overlay-panel
        receiveStateShowPulse="trigger_right-center"
        closable
        positionTo="ref-right-center"
        positionOffset="right-center">
    <p>Sample text</p>
    <ch5-image url="https://picsum.photos/200/300/?random">
    </ch5-image>
</ch5-overlay-panel>