Skip to content

Commit 7807197

Browse files
authored
Merge pull request #7 from coreui/dev-beta-1
ship: v2.0.0-beta.1
2 parents 97a493e + 8bf613a commit 7807197

23 files changed

+197
-63
lines changed

CONTRIBUTING.md NWB.md

File renamed without changes.

demo/src/index.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import ReactDOM, { render } from 'react-dom';
2+
import ReactDOM from 'react-dom';
33
import App from './App';
44
// import registerServiceWorker from './registerServiceWorker';
55

package.json

+7-3
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@
88
"css/",
99
"es/",
1010
"lib/",
11-
"umd/"
11+
"umd/",
12+
"README.md"
1213
],
1314
"scripts": {
1415
"build": "nwb build-react-component",
@@ -20,7 +21,7 @@
2021
"lint": "eslint src"
2122
},
2223
"dependencies": {
23-
"@coreui/coreui": "^2.0.0-beta.9",
24+
"@coreui/coreui": "^2.0.0-beta.10",
2425
"bootstrap": "^4.1.0",
2526
"classnames": "^2.2.5",
2627
"prop-types": "^15.6.1",
@@ -61,6 +62,9 @@
6162
"react",
6263
"bootstrap",
6364
"framework",
64-
"responsive"
65+
"responsive",
66+
"layout",
67+
"component",
68+
"components"
6569
]
6670
}

src/Aside.js

+7-1
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,13 @@ class AppAside extends Component {
6262
}
6363

6464
render() {
65-
const { className, children, display, fixed, hidden, offCanvas, isOpen, tag: Tag, ...attributes } = this.props;
65+
const { className, children, tag: Tag, ...attributes } = this.props;
66+
67+
delete attributes.display
68+
delete attributes.fixed
69+
delete attributes.hidden
70+
delete attributes.offCanvas
71+
delete attributes.isOpen
6672

6773
const classes = classNames(className, 'aside-menu');
6874

src/AsideToggler.js

+8-4
Original file line numberDiff line numberDiff line change
@@ -45,19 +45,23 @@ class AppAsideToggler extends Component {
4545
}
4646

4747
render() {
48-
const { className, children, mobile, tag: Tag, display, ...attributes } = this.props;
48+
const { className, children, type, tag: Tag, ...attributes } = this.props;
49+
50+
delete attributes.display
51+
delete attributes.mobile
52+
delete attributes.display
4953

5054
const classes = classNames(className, 'navbar-toggler');
5155

5256
return (
53-
<button
54-
type="button"
57+
<Tag
58+
type={type}
5559
className={classes}
5660
{...attributes}
5761
onClick={(event)=>this.asideToggle(event)}
5862
>
5963
{children || <span className="navbar-toggler-icon" />}
60-
</button>
64+
</Tag>
6165
);
6266
}
6367
}

src/Breadcrumb.js

+5-1
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,11 @@ class AppBreadcrumb extends Component {
8282
}
8383

8484
render() {
85-
const { className, children, appRoutes, tag: Tag, ...attributes } = this.props;
85+
const { className, tag: Tag, ...attributes } = this.props;
86+
87+
delete attributes.children
88+
delete attributes.appRoutes
89+
8690
const classes = classNames(className);
8791

8892
return (

src/Footer.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,9 @@ class AppFooter extends Component {
3030
}
3131

3232
render() {
33-
const { className, children, fixed, tag: Tag, ...attributes } = this.props;
33+
const { className, children, tag: Tag, ...attributes } = this.props;
34+
35+
delete attributes.fixed
3436

3537
const classes = classNames(className, 'app-footer');
3638

src/Header.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,9 @@ class AppHeader extends Component {
2828
// }
2929

3030
render() {
31-
const { className, children, fixed, tag: Tag, ...attributes } = this.props;
31+
const { className, children, tag: Tag, ...attributes } = this.props;
32+
33+
delete attributes.fixed
3234

3335
const classes = classNames(className, 'app-header', 'navbar');
3436

src/Shared/layout/layout.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { ToggleClasses } from '../toggle-classes';
1+
// import { toggleClasses } from '../toggle-classes';
22

33
class Layout {
44
static sidebarToggle() {

src/Sidebar.js

+9-1
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,15 @@ class AppSidebar extends Component {
7171
}
7272

7373
render() {
74-
const { className, children, compact, display, fixed, minimized, offCanvas, isOpen, tag: Tag, staticContext, ...attributes } = this.props;
74+
const { className, children, tag: Tag, ...attributes } = this.props;
75+
76+
delete attributes.compact
77+
delete attributes.display
78+
delete attributes.fixed
79+
delete attributes.minimized
80+
delete attributes.offCanvas
81+
delete attributes.isOpen
82+
delete attributes.staticContext
7583

7684
const classes = classNames(className, 'sidebar');
7785

src/SidebarMinimizer.js

+2-6
Original file line numberDiff line numberDiff line change
@@ -20,9 +20,7 @@ class AppSidebarMinimizer extends Component {
2020

2121
this.handleClick = this.handleClick.bind(this);
2222
}
23-
sidebarMinimize(e) {
24-
// e.preventDefault();
25-
23+
sidebarMinimize() {
2624
document.body.classList.toggle('sidebar-minimized');
2725
const sidebar = document.querySelector('.sidebar-nav')
2826
if (sidebar) {
@@ -31,9 +29,7 @@ class AppSidebarMinimizer extends Component {
3129
}
3230
}
3331

34-
brandMinimize(e) {
35-
// e.preventDefault();
36-
32+
brandMinimize() {
3733
document.body.classList.toggle('brand-minimized');
3834
}
3935

src/SidebarNav.js

+5-1
Original file line numberDiff line numberDiff line change
@@ -165,7 +165,11 @@ class AppSidebarNav extends Component {
165165
}
166166

167167
render() {
168-
const { className, children, isOpen, tag: Tag, navConfig, staticContext, ...attributes } = this.props;
168+
const { className, children, navConfig, ...attributes } = this.props;
169+
170+
delete attributes.isOpen
171+
delete attributes.staticContext
172+
delete attributes.Tag
169173

170174
const navClasses = classNames(className, 'sidebar-nav');
171175

src/SidebarToggler.js

+4-1
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,10 @@ class AppSidebarToggler extends Component {
4343
}
4444

4545
render() {
46-
const { className, children, mobile, tag: Tag, display, ...attributes } = this.props;
46+
const { className, children, tag: Tag, ...attributes } = this.props;
47+
48+
delete attributes.mobile
49+
delete attributes.display
4750

4851
const classes = classNames(className, 'navbar-toggler');
4952

src/Switch.js

+26-19
Original file line numberDiff line numberDiff line change
@@ -5,20 +5,23 @@ import classNames from 'classnames';
55
const propTypes = {
66
color: PropTypes.string,
77
label: PropTypes.bool,
8-
outline: PropTypes.bool,
9-
outlineAlt: PropTypes.bool,
10-
pill: PropTypes.bool,
11-
size: PropTypes.string,
8+
outline: PropTypes.oneOfType([
9+
PropTypes.bool,
10+
PropTypes.string,
11+
PropTypes.oneOf(['', 'alt'])
12+
]),
13+
size: PropTypes.oneOf(['', 'lg', 'sm']),
1214
checked: PropTypes.bool,
1315
defaultChecked: PropTypes.bool,
1416
defaultValue: PropTypes.any,
17+
value: PropTypes.string,
1518
disabled: PropTypes.bool,
1619
form: PropTypes.any,
17-
indeterminate: PropTypes.any,
1820
name: PropTypes.string,
1921
required: PropTypes.bool,
20-
type: PropTypes.string,
21-
value: PropTypes.string,
22+
onChange: PropTypes.func,
23+
type: PropTypes.oneOf(['checkbox', 'radio']),
24+
variant: PropTypes.oneOf(['', '3d', 'pill']),
2225
className: PropTypes.string,
2326
dataOn: PropTypes.string,
2427
dataOff: PropTypes.string,
@@ -28,48 +31,52 @@ const defaultProps = {
2831
color: 'secondary',
2932
label: false,
3033
outline: false,
31-
outlineAlt: false,
32-
pill: false,
3334
size: '',
3435
checked: false,
3536
defaultChecked: false,
3637
disabled: false,
3738
required: false,
3839
type: 'checkbox',
40+
variant: '',
3941
dataOn: 'On',
4042
dataOff: 'Off',
4143
};
4244

4345
class AppSwitch extends Component {
4446
constructor(props) {
4547
super(props);
46-
this.toggle = this.toggle.bind(this);
48+
this.onChange = this.onChange.bind(this);
4749
this.state = {
4850
checked: this.props.defaultChecked || this.props.checked,
51+
selected: []
4952
};
5053
}
5154

52-
toggle(event) {
55+
onChange(event) {
5356
const target = event.target;
5457
this.setState({
5558
checked: target.checked,
56-
});
59+
})
60+
61+
if (this.props.onChange) {
62+
this.props.onChange(event);
63+
}
5764
}
5865

5966
render() {
60-
const { className, checked, disabled, color, defaultChecked, name, label, outline, outlineAlt, pill, size, required, type, value, dataOn, dataOff, ...attributes } = this.props;
61-
62-
const outlined = outline || outlineAlt;
67+
const { className, disabled, color, name, label, outline, size, required, type, value, dataOn, dataOff, variant, ...attributes } = this.props;
6368

64-
const variant = `switch${outlined ? '-outline' : ''}-${color}${outlineAlt ? '-alt' : ''}`;
69+
delete attributes.checked
70+
delete attributes.defaultChecked
71+
delete attributes.onChange
6572

6673
const classes = classNames(
6774
className,
6875
'switch',
6976
label ? 'switch-label' : false,
70-
pill ? 'switch-pill' : false,
7177
size ? `switch-${size}` : false,
72-
variant,
78+
variant ? `switch-${variant}` : false,
79+
`switch${outline ? '-outline' : ''}-${color}${outline==='alt' ? '-alt' : ''}`,
7380
'form-check-label',
7481
);
7582

@@ -84,7 +91,7 @@ class AppSwitch extends Component {
8491

8592
return (
8693
<label className={classes}>
87-
<input type={type} className={inputClasses} onChange={this.toggle} checked={this.state.checked} name={name} required={required} disabled={disabled} value={value} />
94+
<input type={type} className={inputClasses} onChange={this.onChange} checked={this.state.checked} name={name} required={required} disabled={disabled} value={value} {...attributes} />
8895
<span className={sliderClasses} data-checked={dataOn} data-unchecked={dataOff}></span>
8996
</label>
9097
);

tests/Aside.test.js

+13-3
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import expect from 'expect'
22
import React from 'react'
33
import {renderToStaticMarkup as render} from 'react-dom/server'
44

5-
import { configure, mount } from 'enzyme'
5+
import { configure, mount, shallow } from 'enzyme'
66
import Adapter from 'enzyme-adapter-react-16'
77
import { spy } from 'sinon'
88

@@ -12,7 +12,7 @@ configure({ adapter: new Adapter() });
1212

1313
describe('AppAside', () => {
1414
it('renders aside with class="aside-menu"', () => {
15-
expect(render(<AppAside fixed hidden display="lg">aside</AppAside>))
15+
expect(render(<AppAside fixed hidden offCanvas display="lg">aside</AppAside>))
1616
.toContain('<aside class="aside-menu">aside</aside>')
1717
});
1818
it('calls componentDidMount', () => {
@@ -21,4 +21,14 @@ describe('AppAside', () => {
2121
const wrapper = mount(<AppAside fixed hidden display="lg" />);
2222
expect(AppAside.prototype.componentDidMount.calledOnce).toEqual(true);
2323
});
24-
})
24+
it('should call isHidden()', () => {
25+
const isHidden = spy(AppAside.prototype, 'isHidden');
26+
shallow(<AppAside />);
27+
expect(isHidden.called).toBe(true);
28+
});
29+
it('should call isOffCanvas()', () => {
30+
const isOffCanvas = spy(AppAside.prototype, 'isOffCanvas');
31+
shallow(<AppAside offCanvas={false}/>);
32+
expect(isOffCanvas.called).toBe(true);
33+
});
34+
})

tests/Footer.test.js

+8-2
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import expect from 'expect'
22
import React from 'react'
33
import {renderToStaticMarkup as render} from 'react-dom/server'
44

5-
import { configure, mount } from 'enzyme'
5+
import { configure, mount, shallow } from 'enzyme'
66
import Adapter from 'enzyme-adapter-react-16'
77
import { spy } from 'sinon'
88

@@ -21,4 +21,10 @@ describe('AppFooter', () => {
2121
const wrapper = mount(<AppFooter fixed display="lg" />);
2222
expect(AppFooter.prototype.componentDidMount.calledOnce).toEqual(true);
2323
});
24-
})
24+
it('should call isFixed()', () => {
25+
const isFixed = spy(AppFooter.prototype, 'isFixed');
26+
shallow(<AppFooter />);
27+
expect(isFixed.called).toBe(true);
28+
});
29+
30+
})

tests/Header.test.js

+8-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,12 @@ import expect from 'expect'
22
import React from 'react'
33
import {renderToStaticMarkup as render} from 'react-dom/server'
44

5-
import { configure, mount } from 'enzyme'
5+
import { configure, mount, shallow } from 'enzyme'
66
import Adapter from 'enzyme-adapter-react-16'
77
import { spy } from 'sinon'
88

99
import AppHeader from 'src/Header'
10+
import AppFooter from '../src/Footer';
1011

1112
configure({ adapter: new Adapter() });
1213

@@ -21,4 +22,9 @@ describe('AppHeader', () => {
2122
const wrapper = mount(<AppHeader fixed/>);
2223
expect(AppHeader.prototype.componentDidMount.calledOnce).toEqual(true);
2324
});
24-
})
25+
it('should call isFixed()', () => {
26+
const isFixed = spy(AppHeader.prototype, 'isFixed');
27+
shallow(<AppHeader />);
28+
expect(isFixed.called).toBe(true);
29+
});
30+
})

tests/NavbarBrand.test.js

+9
Original file line numberDiff line numberDiff line change
@@ -15,4 +15,13 @@ describe('AppNavbarBrand', () => {
1515
minimized={{ src: sygnet, width: 30, height: 30, alt: 'CoreUI Minimized' }}
1616
/>)).toContain('class="navbar-brand"');
1717
});
18+
it('renders anchor with class="navbar-brand"', () => {
19+
expect(render(<AppNavbarBrand
20+
brand={{ }}
21+
/>)).toContain('class="navbar-brand"');
22+
});
23+
it('renders anchor with class="navbar-brand"', () => {
24+
expect(render(<AppNavbarBrand />)).toContain('class="navbar-brand"');
25+
});
26+
1827
});

0 commit comments

Comments
 (0)