How to add a class on Ember-bootstrap Modal?

I am using ember-bootstrap modal in which attribute "size" is "xl". xl takes my customized modal size class ".modal-xl". But I have another class ".modal-full" which adds more size to my modal-xl. How can I add this class="modal-full" on my {{#bs-modal-simple}}

.modal-xl {
    @media screen and (min-width: $modal-xl) {
        max-width: calc(#{$modal-xl} - 2rem);
    }
}
// add option to bootstrap modal for full-width option
.modal-full {
    @include media-breakpoint-up(xl) {
        max-width: calc(100% - 4rem);
    }
}

Template file:

{{#bs-modal-simple open=abc size="xl" title="Pricing Details" onHidden=(action (mut abc))}}
<table></table>
{{/bs-modal-simple}}

Anyone please help me with this. Thank you in Advance.

Oh Wow!! This is cool I guess. I just have to pass my ".modal-full in the attribute-size = "xl modal-full"

{{#bs-modal-simple open=abc size="xl modal-full" title="Pricing Details" onHidden=(action (mut abc))}}
<table></table>
{{/bs-modal-simple}}

Please feel free to give any other suggestions.