imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Adhered to code review

Browse source
This commit is contained in:
Jani Mustonen 2017-01-13 19:34:53 +02:00
parent 5e013860ee
commit b323551f22
1 changed files with 12 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/components/views/elements/AccessibleButton.js
View file

@ -1,5 +1,5 @@
/* /*
Copyright 2016 Aviral Dasgupta Copyright 2016 Jani Mustonen
Licensed under the Apache License, Version 2.0 (the "License"); Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License. you may not use this file except in compliance with the License.
@ -16,6 +16,10 @@
import React from 'react'; import React from 'react';
/**
* AccessibleButton is a generic wrapper for any element that should be treated as a button.
* Identifies the element as a button, setting proper tab indexing and keyboard activation behavior.
*/
export default function AccessibleButton(props) { export default function AccessibleButton(props) {
const {element, onClick, children, ...restProps} = props; const {element, onClick, children, ...restProps} = props;
restProps.onClick = onClick; restProps.onClick = onClick;
@ -24,13 +28,15 @@ export default function AccessibleButton(props) {
}; };
restProps.tabIndex = restProps.tabIndex || "0"; restProps.tabIndex = restProps.tabIndex || "0";
restProps.role = "button"; restProps.role = "button";
if (Array.isArray(children)) { return React.createElement(element, restProps, children);
return React.createElement(element, restProps, ...children);
} else {
return React.createElement(element, restProps, children);
}
} }
/**
* children: React's magic prop. Represents all children given to the element.
* element: (optional) The base element type. "div" by default.
* onClick: (required) Event handler for button activation. Should be
* implemented exactly like a normal onClick handler.
*/
AccessibleButton.propTypes = { AccessibleButton.propTypes = {
children: React.PropTypes.node, children: React.PropTypes.node,
element: React.PropTypes.string, element: React.PropTypes.string,