1 2<!--- 3 4This README is automatically generated from the comments in these files: 5paper-dialog-behavior.html 6 7Edit those files, and our readme bot will duplicate them over here! 8Edit this file, and the bot will squash your changes :) 9 10The bot does some handling of markdown. Please file a bug if it does the wrong 11thing! https://github.com/PolymerLabs/tedium/issues 12 13--> 14 15[](https://travis-ci.org/PolymerElements/paper-dialog-behavior) 16 17_[Demo and API docs](https://elements.polymer-project.org/elements/paper-dialog-behavior)_ 18 19 20##Polymer.PaperDialogBehavior 21 22Use `Polymer.PaperDialogBehavior` and `paper-dialog-shared-styles.html` to implement a Material Design 23dialog. 24 25For example, if `<paper-dialog-impl>` implements this behavior: 26 27```html 28<paper-dialog-impl> 29 <h2>Header</h2> 30 <div>Dialog body</div> 31 <div class="buttons"> 32 <paper-button dialog-dismiss>Cancel</paper-button> 33 <paper-button dialog-confirm>Accept</paper-button> 34 </div> 35</paper-dialog-impl> 36``` 37 38`paper-dialog-shared-styles.html` provide styles for a header, content area, and an action area for buttons. 39Use the `<h2>` tag for the header and the `buttons` class for the action area. You can use the 40`paper-dialog-scrollable` element (in its own repository) if you need a scrolling content area. 41 42Use the `dialog-dismiss` and `dialog-confirm` attributes on interactive controls to close the 43dialog. If the user dismisses the dialog with `dialog-confirm`, the `closingReason` will update 44to include `confirmed: true`. 45 46### Accessibility 47 48This element has `role="dialog"` by default. Depending on the context, it may be more appropriate 49to override this attribute with `role="alertdialog"`. 50 51If `modal` is set, the element will prevent the focus from exiting the element. 52It will also ensure that focus remains in the dialog. 53 54 55