Merge branch 'develop' into dialog-a11y

This commit is contained in:
Peter Vágner 2018-02-06 23:04:15 +01:00
commit 14991afbe5
214 changed files with 8934 additions and 3589 deletions

View file

@ -16,6 +16,7 @@ limitations under the License.
import React from 'react';
import FocusTrap from 'focus-trap-react';
import PropTypes from 'prop-types';
import { KeyCode } from '../../../Keyboard';
import AccessibleButton from '../elements/AccessibleButton';
@ -32,17 +33,20 @@ export default React.createClass({
propTypes: {
// onFinished callback to call when Escape is pressed
onFinished: React.PropTypes.func.isRequired,
onFinished: PropTypes.func.isRequired,
// called when a key is pressed
onKeyDown: PropTypes.func,
// CSS class to apply to dialog div
className: React.PropTypes.string,
className: PropTypes.string,
// Title for the dialog.
// (could probably actually be something more complicated than a string if desired)
title: React.PropTypes.string.isRequired,
title: PropTypes.string.isRequired,
// children should be the content of the dialog
children: React.PropTypes.node,
children: PropTypes.node,
// Id of content element
// If provided, this is used to add a aria-describedby attribute
@ -50,6 +54,9 @@ export default React.createClass({
},
_onKeyDown: function(e) {
if (this.props.onKeyDown) {
this.props.onKeyDown(e);
}
if (e.keyCode === KeyCode.ESCAPE) {
e.stopPropagation();
e.preventDefault();
@ -76,7 +83,7 @@ export default React.createClass({
>
<TintableSvg src="img/icons-close-button.svg" width="35" height="35" />
</AccessibleButton>
<div className='mx_Dialog_title' id='mx_BaseDialog_title'>
<div className={'mx_Dialog_title ' + this.props.titleClass} id='mx_BaseDialog_title'>
{ this.props.title }
</div>
{ this.props.children }