Skip to content

Simpler modal/confirm api

Choose a tag to compare

@green3g green3g released this 08 Feb 21:44
· 30 commits to master since this release

Confirming and displaying modal data is much easier now. Methods have been removed from modal in favor of stateful properties for controlling display of modals.

simple confirm function using modal dialog:

import ConfirmDialog from 'spectre-canjs/sp-confirm/sp-confirm';

function confirm(content, viewModel = {}, scope = {}) {
    viewModel.active = true;
    const confirm = new ConfirmDialog({
        content,
        viewModel,
        scope: {
        },
    });
    document.body.appendChild(confirm.element);
    return confirm.viewModel.promise.then((outcome) => {
        document.body.removeChild(confirm.element);
        return confirm.viewModel;
    });
}

Usage:

const {outcome} = await confirm('<h1>Are you sure about this????</h1>', {
// viewmodel properties
    title: 'A dangerous action'
});
if(outcome.state === 'accepted'){
    // do dangerous things
} else if(outcome.state === 'rejected'){
    // user cancelled or closed the dialog
}