8000 refactor(AsideToggler): extract `toggle` method, add missing `default… · bilwifi/coreui-react@aca561b · GitHub
[go: up one dir, main page]
Skip to content

Commit aca561b

Browse files
xidedixxidedix
committed
refactor(AsideToggler): extract toggle method, add missing defaultOpen prop
1 parent 1b90415 commit aca561b

File tree

2 files changed

+21
-15
lines changed

2 files changed

+21
-15
lines changed

‎src/AsideToggler.js

Lines changed: 20 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,21 @@
11
import React, { Component } from 'react';
22
import PropTypes from 'prop-types';
33
import classNames from 'classnames';
4-
import { asideMenuCssClasses } from './Shared/index';
4+
import { asideMenuCssClasses, validBreakpoints, checkBreakpoint } from './Shared/index';
55
import toggleClasses from './Shared/toggle-classes';
66

77
const propTypes = {
88
children: PropTypes.node,
99
className: PropTypes.string,
10+
defaultOpen: PropTypes.bool,
1011
display: PropTypes.any,
1112
mobile: PropTypes.bool,
1213
tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
1314
type: PropTypes.string
1415
};
1516

1617
const defaultProps = {
18+
defaultOpen: false,
1719
display: 'lg',
1820
mobile: false,
1921
tag: 'button',
@@ -28,27 +30,30 @@ class AppAsideToggler extends Component {
2830
this.state = {};
2931
}
3032

31-
asideToggle(e) {
32-
e.preventDefault();
33+
componentDidMount() {
34+
this.toggle(this.props.defaultOpen)
35+
}
3336

34-
if (this.props.mobile) {
35-
document.body.classList.toggle('aside-menu-show');
36-
} else {
37-
const display = this.props.display;
38-
const cssTemplate = `aside-menu-${display}-show`;
39-
let [cssClass] = asideMenuCssClasses[0];
40-
if (display && asideMenuCssClasses.indexOf(cssTemplate) > -1) {
41-
cssClass = cssTemplate;
42-
}
43-
toggleClasses(cssClass, asideMenuCssClasses);
37+
toggle (force) {
38+
const [display, mobile] = [this.props.display, this.props.mobile];
39+
let cssClass = asideMenuCssClasses[0];
40+
if (!mobile && display && checkBreakpoint(display, validBreakpoints)) {
41+
cssClass = `aside-menu-${display}-show`
4442
}
43+
toggleClasses(cssClass, asideMenuCssClasses, force)
44+
}
45+
46+
asideToggle(e) {
47+
e.preventDefault();
48+
this.toggle()
4549
}
4650

4751
render() {
4852
const { className, children, type, tag: Tag, ...attributes } = this.props;
4953

50-
delete attributes.display
51-
delete attributes.mobile
54+
delete attributes.defaultOpen;
55+
delete attributes.display;
56+
delete attributes.mobile;
5257

5358
const classes = classNames(className, 'navbar-toggler');
5459

‎src/AsideToggler.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ prop | default
55
--- | ---
66
children | `<span className="navbar-toggler-icon" />`
77
className | `navbar-toggler`
8+
defaultOpen| `false`
89
display | `lg`
910
mobile | `false`
1011
tag | `button`

0 commit comments

Comments
 (0)
0