Crestron Components Lib - Showcase App

ch5-modal-dialog (inherited from ch5-overlay-panel): dismissable

ch5-modal-dialog: dismissable

Defaults to true. When true, if a click/touch is done outside of it, it will change the show attribute to false and hide the modal

Click the above button to make the modal visible. Clicking outside the modal will dismiss it by changing its show attribute to false.

Sample text

 
<ch5-button label="Trigger show pulse" sendEventOnClick="trigger_1"></ch5-button>

<p>
    Click the above button to make the modal visible. Clicking outside the modal will dismiss it by changing its show
    attribute to false.
</p>

<ch5-modal-dialog receiveStateShowPulse="trigger_1">
    <p>Sample text</p>
    <ch5-image
            id="ex1-img"
            url="https://picsum.photos/200/300/?random">
    </ch5-image>
</ch5-modal-dialog>

ch5-modal-panel: dismissable

Defaults to true. If false the panel will not hide automatically when a click/touch is done outside of it.

Click the above buttons to show/hide the modal. Clicking outside the modal will not dismiss it.

Sample text

<ch5-button label="Trigger show pulse"
             sendEventOnClick="trigger_2"></ch5-button>
<ch5-button label="Trigger hide pulse"
             sendEventOnClick="trigger_3"
             ></ch5-button>
<p>
    Click the above buttons to show/hide the modal. Clicking outside the modal will not dismiss it.
</p>

<ch5-modal-dialog
        dismissable="false"
        receiveStateShowPulse="trigger_2"
        receiveStateHidePulse="trigger_3">
    <p>Sample text</p>
    <ch5-image
            id="ex2-img"
            url="https://picsum.photos/200/300/?random">
    </ch5-image>
</ch5-modal-dialog>