open-vault/ui/lib/core/addon/components/confirmation-modal.hbs
claire bontempo 5cd4fe23b0
UI/Glimmerize modal & confirmation modal component (#16032)
* remove commented out import from info-table-row

* glimmerize

* update docs

* glimmerize confirmation modal

* update modal usage

* remove keyboard action

* Revert "remove keyboard action"

This reverts commit 42b7f5950b244b5a728f94a1fbb8cd836f646ae8.

* remove keyboard actions

* address comments

* update tests
2022-06-21 12:43:34 -07:00

34 lines
1.1 KiB
Handlebars

<Modal @title={{@title}} @onClose={{@onClose}} @isActive={{@isActive}} @type={{this.type}} @showCloseButton={{true}}>
<section class="modal-card-body">
{{yield}}
<div class="modal-confirm-section">
<p class="has-text-weight-semibold is-size-6">
Confirm
</p>
<p class="is-help">Type <strong>{{this.confirmText}}</strong> to confirm {{this.toConfirmMsg}}</p>
<Input
@type="text"
@value={{this.confirmationInput}}
name="confirmationInput"
class="input has-margin-top"
autocomplete="off"
spellcheck="false"
data-test-confirmation-modal-input={{or @title true}}
/>
</div>
</section>
<footer class="modal-card-foot modal-card-foot-outlined">
<button
type="button"
class="button {{this.buttonClass}}"
disabled={{not-eq this.confirmationInput this.confirmText}}
{{on "click" @onConfirm}}
data-test-confirm-button={{or @title true}}
>
{{this.buttonText}}
</button>
<button type="button" class="button is-secondary" {{on "click" @onClose}} data-test-cancel-button>
Cancel
</button>
</footer>
</Modal>