diff options
Diffstat (limited to 'catapult/third_party/polymer/components/paper-dialog-behavior/README.md')
| -rw-r--r-- | catapult/third_party/polymer/components/paper-dialog-behavior/README.md | 54 |
1 files changed, 54 insertions, 0 deletions
diff --git a/catapult/third_party/polymer/components/paper-dialog-behavior/README.md b/catapult/third_party/polymer/components/paper-dialog-behavior/README.md new file mode 100644 index 00000000..c3c52980 --- /dev/null +++ b/catapult/third_party/polymer/components/paper-dialog-behavior/README.md @@ -0,0 +1,54 @@ + +<!--- + +This README is automatically generated from the comments in these files: +paper-dialog-behavior.html + +Edit those files, and our readme bot will duplicate them over here! +Edit this file, and the bot will squash your changes :) + +The bot does some handling of markdown. Please file a bug if it does the wrong +thing! https://github.com/PolymerLabs/tedium/issues + +--> + +[](https://travis-ci.org/PolymerElements/paper-dialog-behavior) + +_[Demo and API docs](https://elements.polymer-project.org/elements/paper-dialog-behavior)_ + + +##Polymer.PaperDialogBehavior + +Use `Polymer.PaperDialogBehavior` and `paper-dialog-shared-styles.html` to implement a Material Design +dialog. + +For example, if `<paper-dialog-impl>` implements this behavior: + +```html +<paper-dialog-impl> + <h2>Header</h2> + <div>Dialog body</div> + <div class="buttons"> + <paper-button dialog-dismiss>Cancel</paper-button> + <paper-button dialog-confirm>Accept</paper-button> + </div> +</paper-dialog-impl> +``` + +`paper-dialog-shared-styles.html` provide styles for a header, content area, and an action area for buttons. +Use the `<h2>` tag for the header and the `buttons` class for the action area. You can use the +`paper-dialog-scrollable` element (in its own repository) if you need a scrolling content area. + +Use the `dialog-dismiss` and `dialog-confirm` attributes on interactive controls to close the +dialog. If the user dismisses the dialog with `dialog-confirm`, the `closingReason` will update +to include `confirmed: true`. + +### Accessibility + +This element has `role="dialog"` by default. Depending on the context, it may be more appropriate +to override this attribute with `role="alertdialog"`. + +If `modal` is set, the element will prevent the focus from exiting the element. +It will also ensure that focus remains in the dialog. + + |