vitalif
/
react-toolbox
1
0
Fork 0
Code Issues Pull Requests Releases 12 Wiki Activity

Merge branch 'dev' of https://github.com/laucheukhim/react-toolbox into laucheukhim-dev 

* 'dev' of https://github.com/laucheukhim/react-toolbox:
  Add onClick propType
  Replace onMouseDown wth onClick in Dropdown
old
Javi Velasco 2016-09-03 12:32:17 +02:00
parent a0ab5a3815 f7604477a0
commit 25d7ad4127
2 changed files with 12 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/dropdown/Dropdown.js
View File

@ -18,6 +18,7 @@ const factory = (Input) => {
name: PropTypes.string,
onBlur: PropTypes.func,
onChange: PropTypes.func,
onClick: PropTypes.func,
onFocus: PropTypes.func,
source: PropTypes.array.isRequired,
template: PropTypes.func,
@ -83,11 +84,12 @@ const factory = (Input) => {
}
};
handleMouseDown = (event) => {
handleClick = (event) => {
events.pauseEvent(event);
const client = event.target.getBoundingClientRect();
const screen_height = window.innerHeight || document.documentElement.offsetHeight;
const up = this.props.auto ? client.top > ((screen_height / 2) + client.height) : false;
if (this.props.onClick) this.props.onClick(event);
if (this.props.onFocus) this.props.onFocus(event);
this.setState({active: true, up});
};
@ -120,7 +122,7 @@ const factory = (Input) => {
});
return (
<div className={className} onMouseDown={this.handleMouseDown}>
<div className={className} onClick={this.handleClick}>
<div className={`${theme.templateValue} ${theme.value}`}>
{this.props.template(selected)}
</div>
@ -134,7 +136,7 @@ const factory = (Input) => {
const { theme } = this.props;
const className = item.value === this.props.value ? theme.selected : null;
return (
<li key={idx} className={className} onMouseDown={this.handleSelect.bind(this, item.value)}>
<li key={idx} className={className} onClick={this.handleSelect.bind(this, item.value)}>
{this.props.template ? this.props.template(item) : item.label}
</li>
);
@ -154,7 +156,7 @@ const factory = (Input) => {
<Input
{...others}
className={theme.value}
onMouseDown={this.handleMouseDown}
onClick={this.handleClick}
readOnly
type={template && selected ? 'hidden' : null}
value={selected && selected.label ? selected.label : ''}

10
lib/dropdown/Dropdown.js
View File

@ -71,11 +71,12 @@ var factory = function factory(Input) {
if (_this.state.active && !_events2.default.targetIsDescendant(event, _reactDom2.default.findDOMNode(_this))) {
_this.setState({ active: false });
}
}, _this.handleMouseDown = function (event) {
}, _this.handleClick = function (event) {
_events2.default.pauseEvent(event);
var client = event.target.getBoundingClientRect();
var screen_height = window.innerHeight || document.documentElement.offsetHeight;
var up = _this.props.auto ? client.top > screen_height / 2 + client.height : false;
if (_this.props.onClick) _this.props.onClick(event);
if (_this.props.onFocus) _this.props.onFocus(event);
_this.setState({ active: true, up: up });
}, _this.handleSelect = function (item, event) {
@ -122,7 +123,7 @@ var factory = function factory(Input) {
var className = item.value === _this.props.value ? theme.selected : null;
return _react2.default.createElement(
'li',
{ key: idx, className: className, onMouseDown: _this.handleSelect.bind(_this, item.value) },
{ key: idx, className: className, onClick: _this.handleSelect.bind(_this, item.value) },
_this.props.template ? _this.props.template(item) : item.label
);
}, _temp), _possibleConstructorReturn(_this, _ret);
@ -160,7 +161,7 @@ var factory = function factory(Input) {
return _react2.default.createElement(
'div',
{ className: className, onMouseDown: this.handleMouseDown },
{ className: className, onClick: this.handleClick },
_react2.default.createElement(
'div',
{ className: theme.templateValue + ' ' + theme.value },
@ -201,7 +202,7 @@ var factory = function factory(Input) {
{ 'data-react-toolbox': 'dropdown', className: className },
_react2.default.createElement(Input, _extends({}, others, {
className: theme.value,
onMouseDown: this.handleMouseDown,
onClick: this.handleClick,
readOnly: true,
type: template && selected ? 'hidden' : null,
value: selected && selected.label ? selected.label : ''
@ -229,6 +230,7 @@ var factory = function factory(Input) {
name: _react.PropTypes.string,
onBlur: _react.PropTypes.func,
onChange: _react.PropTypes.func,
onClick: _react.PropTypes.func,
onFocus: _react.PropTypes.func,
source: _react.PropTypes.array.isRequired,
template: _react.PropTypes.func,