Documentation

Class

AashModalDialog

AashModalDialog~AashModalDialog(props)

Generates a modal dialog.

Example:

<div class="aash-modal-dialog dialog__backdrop" showcancel="true">
  <div id="sampleDialog" role="dialog"
      aria-labelledby="sampleDialog-label" aria-modal="true">
    <header id="sampleDialog-label">
      <p>Sample Dialog</p>
      <button type="button" class="fa fa-times"></button>
    </header>
    <section class="">
      <i>Sample dialog content</i>
    </section>
    <footer>
      <button type="button">Okay</button>
    </footer>
  </div>
</div>

Once created, the component provides the externally invocable methods defined by module:AashModalDialog.Api through an object in a property of the DOM element with role="dialog" (see module:AashUtil.getApi). Note that this is not the mounted element but the mounted element's child. It is, however, the element with the provided id. Thus it makes more sense to use this element.

Constructor

# new AashModalDialog(props)

Parameters:
Name Type Description
props Object

the properties
is string

the dialog's id
title string

the dialog's title
showCancel boolean

wether to show a cancel button
content string

the dialog's content
contentClasses Array.string

classes to apply to the content
closeLabel string

the label for the close button
onClose function

the function to invoke on close

View Source components/modal-dialog/AashModalDialog.ts, line 9