From 2adf1f8e3596c75d0690f5d7eaeea5034d3b6dd2 Mon Sep 17 00:00:00 2001 From: xidedix Date: Fri, 26 Jul 2019 17:21:36 +0200 Subject: [PATCH 1/4] chore: dependencies update - update `core-js` to `^2.6.9` - update `react-perfect-scrollbar` to `^1.5.3` - update `reactstrap` to `^8.0.1" - update `babel-eslint` to `^10.0.2` - update `enzyme` to `^3.10.0` - update `enzyme-adapter-react-16` to `^1.14.0` - update `eslint-plugin-import` to `^2.18.2` - update `eslint-plugin-react` to `^7.14.3` - update `react-router-dom` to `^5.0.1` - update `webpack-dev-server` to `^3.7.2` --- package.json | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/package.json b/package.json index f723f247..a63b04f1 100644 --- a/package.json +++ b/package.json @@ -37,30 +37,30 @@ "dependencies": { "@coreui/icons": "0.3.0", "classnames": "^2.2.6", - "core-js": "^2.6.8", + "core-js": "^2.6.9", "prop-types": "^15.7.2", "react-onclickout": "^2.0.8", - "react-perfect-scrollbar": "^1.5.2", - "reactstrap": "^7.1.0" + "react-perfect-scrollbar": "^1.5.3", + "reactstrap": "^8.0.1" }, "peerDependencies": { - "@coreui/coreui": "^2.1.9", + "@coreui/coreui": "^2.1.12", "react": "^16.8.6", - "react-router-dom": "^5.0.0" + "react-router-dom": "^5.0.1" }, "devDependencies": { - "babel-eslint": "^10.0.1", - "enzyme": "^3.9.0", - "enzyme-adapter-react-16": "^1.13.1", + "babel-eslint": "^10.0.2", + "enzyme": "^3.10.0", + "enzyme-adapter-react-16": "^1.14.0", "eslint": "^5.16.0", - "eslint-plugin-import": "^2.17.2", - "eslint-plugin-react": "^7.13.0", + "eslint-plugin-import": "^2.18.2", + "eslint-plugin-react": "^7.14.3", "nwb": "^0.23.0", "react": "^16.8.6", "react-dom": "^16.8.6", - "react-router-dom": "^5.0.0", + "react-router-dom": "^5.0.1", "sinon": "^5.1.1", - "webpack-dev-server": "^3.4.1" + "webpack-dev-server": "^3.7.2" }, "repository": { "type": "git", From de80629a5f408af3a6f4dc71fc7717e4cd744101 Mon Sep 17 00:00:00 2001 From: xidedix Date: Fri, 26 Jul 2019 17:36:15 +0200 Subject: [PATCH 2/4] fix(Switch): checked derived state, keyboard accessibility - fix(Switch): checked props and state out of sync - thanks @gravitymedianet @jinixx - fix(Switch): does not provide any keyboard accessibility - thanks @roastery-zz close #44 --- src/Switch.js | 51 ++++++++++++++++++++++++++++++++++---------- tests/Switch.test.js | 4 ++-- 2 files changed, 42 insertions(+), 13 deletions(-) diff --git a/src/Switch.js b/src/Switch.js index a24f6e67..23ca6f26 100644 --- a/src/Switch.js +++ b/src/Switch.js @@ -45,35 +45,53 @@ const defaultProps = { class AppSwitch extends Component { constructor(props) { super(props); - this.onChange = this.onChange.bind(this); + this.handleChange = this.handleChange.bind(this); + this.handleKeyDown = this.handleKeyDown.bind(this); + this.handleKeyUp = this.handleKeyUp.bind(this); this.state = { checked: this.props.defaultChecked || this.props.checked, selected: [] }; } - onChange(event) { - const target = event.target; + toggleState(check) { this.setState({ - checked: target.checked, + checked: check }) + } + + handleChange(event) { + const target = event.target; + this.toggleState(target.checked) if (this.props.onChange) { this.props.onChange(event); } } - componentDidUpdate(prevProps) { - if (this.props.checked !== prevProps.checked) { - this.setState({ - checked: this.props.checked - }) + handleKeyDown(event) { + if (event.key === ' ') { + event.preventDefault(); + } + } + + handleKeyUp(event) { + if (event.key === 'Enter' || event.key === ' ') { + this.toggleState(!this.state.checked); + } + } + + componentDidUpdate(prevProps, prevState) { + if (this.props.checked !== prevState.checked) { + this.toggleState(this.props.checked) } } render() { const { className, disabled, color, name, label, outline, size, required, type, value, dataOn, dataOff, variant, ...attributes } = this.props; + const tabindex = attributes.tabIndex + delete attributes.tabIndex delete attributes.checked delete attributes.defaultChecked delete attributes.onChange @@ -98,8 +116,19 @@ class AppSwitch extends Component { ); return ( -