consul/ui/packages/consul-ui/app/components/modal-dialog/index.hbs

69 lines
1.8 KiB
Handlebars

{{!
Copyright (c) HashiCorp, Inc.
SPDX-License-Identifier: BUSL-1.1
}}
{{#let (hash
labelledby=(unique-id)
) as |aria|}}
<Portal @target="modal">
{{yield}}
<div
class="modal-dialog"
aria-hidden="true"
...attributes
{{did-insert (action "connect")}}
{{will-destroy (action "disconnect")}}
>
<div tabindex="-1" data-a11y-dialog-hide></div>
<div
class="modal-dialog-modal"
role="dialog"
aria-label={{@aria.label}}
>
<div
role="document"
>
<header class="modal-dialog-header">
<Hds::Button
data-a11y-dialog-hide
@text='Close dialog'
@color='secondary'
@icon='x'
@size='small'
@isIconOnly={{true}}
/>
<YieldSlot @name="header">
{{yield (hash
open=(action "open")
close=(action "close")
opened=this.isOpen
aria=aria
)}}
</YieldSlot>
</header>
<div class="modal-dialog-body">
<YieldSlot @name="body">
{{yield (hash
open=(action "open")
close=(action "close")
opened=this.isOpen
aria=aria
)}}
</YieldSlot>
</div>
<footer class="modal-dialog-footer">
<YieldSlot @name="actions" @params={{block-params (action "close")}}>
{{yield (hash
open=(action "open")
close=(action "close")
opened=this.isOpen
aria=aria
)}}
</YieldSlot>
</footer>
</div>
</div>
</div>
</Portal>
{{/let}}