From f7cf829c63ad74c8313eecf0c7605c5cea6badea Mon Sep 17 00:00:00 2001 From: xidedix Date: Fri, 24 May 2019 17:02:48 +0200 Subject: [PATCH 1/5] fix(SidebarNav): missing class and attribs to navDropdown item --- CHANGELOG.md | 9 +++++ src/SidebarNav.js | 13 ++++--- src/SidebarNav.md | 2 ++ src/SidebarNav2.js | 87 ++++++++++++++++++++++++---------------------- 4 files changed, 66 insertions(+), 45 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index e368b640..9c9753a7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,14 @@ ### [@coreui/react](https://coreui.io/) changelog +##### `v2.5.1` + +- fix(SidebarNav): add missing `class` and `attributes` to navDropdown item + +###### dependencies update +- update `core-js` to `^2.6.8` +- update `enzyme-adapter-react-16` to `^1.13.1` +- update `webpack-dev-server` to `^3.4.1` + ##### `v2.5.0` - BREAKING CHANGE release for use with `react-router-dom v5` - feat(Breadcrumb2): mandatory prop `router` :boom: see: [Breadcrumb](./src/Breadcrumb.md) diff --git a/src/SidebarNav.js b/src/SidebarNav.js index 549c01b2..25229ebc 100644 --- a/src/SidebarNav.js +++ b/src/SidebarNav.js @@ -109,9 +109,14 @@ class AppSidebarNav extends Component { // nav dropdown navDropdown(item, key) { const classIcon = classNames('nav-icon', item.icon); + const attributes = JSON.parse(JSON.stringify(item.attributes || {})); + const classes = classNames('nav-link', 'nav-dropdown-toggle', item.class, attributes.class); + delete attributes.class; return (
  • - {item.name}{this.navBadge(item.badge)} + + {item.name}{this.navBadge(item.badge)} +
      {this.navList(item.children)}
    @@ -132,14 +137,14 @@ class AppSidebarNav extends Component { // nav link navLink(item, key, classes) { - const url = item.url ? item.url : ''; + const url = item.url || ''; const itemIcon = const itemBadge = this.navBadge(item.badge) const attributes = item.attributes || {} return ( { attributes.disabled ? - + {itemIcon}{item.name}{itemBadge} : @@ -181,7 +186,7 @@ class AppSidebarNav extends Component { const navClasses = classNames(className, 'sidebar-nav'); // ToDo: find better rtl fix - const isRtl = getComputedStyle(document.querySelector('html')).direction === 'rtl' + const isRtl = getComputedStyle(document.documentElement).direction === 'rtl' // sidebar-nav root return ( diff --git a/src/SidebarNav.md b/src/SidebarNav.md index dfc96e40..665aa018 100644 --- a/src/SidebarNav.md +++ b/src/SidebarNav.md @@ -58,6 +58,8 @@ router | inject `react-router-dom@5` object | _mandatory for @coreui/react ^2.5. name: 'Icons', url: '/icons', icon: 'icon-star', + class: 'text-uppercase', // (v2.5.1 up) optional + attributes: { class: 'bg-success' }, // (v2.5.1 up) optional valid JS object with JS API naming, children: [ { name: 'Flags', // item options apply diff --git a/src/SidebarNav2.js b/src/SidebarNav2.js index 2ab4b7fa..2951bc1e 100644 --- a/src/SidebarNav2.js +++ b/src/SidebarNav2.js @@ -47,8 +47,8 @@ class AppSidebarNav2 extends Component { activeRoute(routeName, props) { return props.location.pathname.indexOf(routeName) > -1 - ? 'nav-item nav-dropdown open' - : 'nav-item nav-dropdown'; + ? 'nav-item nav-dropdown open' + : 'nav-item nav-dropdown'; } hideMobile() { @@ -65,11 +65,11 @@ class AppSidebarNav2 extends Component { // nav type navType(item, idx) { return ( - item.title ? this.navTitle(item, idx) - : item.divider ? this.navDivider(item, idx) - : item.label ? this.navLabel(item, idx) - : item.children ? this.navDropdown(item, idx) - : this.navItem(item, idx) + item.title ? this.navTitle(item, idx) + : item.divider ? this.navDivider(item, idx) + : item.label ? this.navLabel(item, idx) + : item.children ? this.navDropdown(item, idx) + : this.navItem(item, idx) ); } @@ -96,27 +96,32 @@ class AppSidebarNav2 extends Component { item: classNames('hidden-cn', item.class), link: classNames('nav-label', item.class ? item.class : ''), icon: classNames( - 'nav-icon', - !item.icon ? 'fa fa-circle' : item.icon, - item.label.variant ? `text-${item.label.variant}` : '', - item.label.class ? item.label.class : '', + 'nav-icon', + !item.icon ? 'fa fa-circle' : item.icon, + item.label.variant ? `text-${item.label.variant}` : '', + item.label.class ? item.label.class : '', ) }; return ( - this.navLink(item, key, classes) + this.navLink(item, key, classes) ); } // nav dropdown navDropdown(item, key) { const classIcon = classNames('nav-icon', item.icon); + const attributes = JSON.parse(JSON.stringify(item.attributes || {})); + const classes = classNames('nav-link', 'nav-dropdown-toggle', item.class, attributes.class); + delete attributes.class; return ( -
  • - {item.name}{this.navBadge(item.badge)} -
      - {this.navList(item.children)} -
    -
    • ); +
  • + + {item.name}{this.navBadge(item.badge)} + +
      + {this.navList(item.children)} +
    +
    • ); } // nav item with nav link @@ -127,7 +132,7 @@ class AppSidebarNav2 extends Component { icon: classNames('nav-icon', item.icon) }; return ( - this.navLink(item, key, classes) + this.navLink(item, key, classes) ); } @@ -139,21 +144,21 @@ class AppSidebarNav2 extends Component { const attributes = item.attributes || {} const NavLink = this.props.router.NavLink || RsNavLink return ( - - { attributes.disabled ? - - {itemIcon}{item.name}{itemBadge} - - : - this.isExternal(url) || NavLink === RsNavLink ? - - {itemIcon}{item.name}{itemBadge} - : - - {itemIcon}{item.name}{itemBadge} - - } - + + { attributes.disabled ? + + {itemIcon}{item.name}{itemBadge} + + : + this.isExternal(url) || NavLink === RsNavLink ? + + {itemIcon}{item.name}{itemBadge} + : + + {itemIcon}{item.name}{itemBadge} + + } + ); } @@ -162,7 +167,7 @@ class AppSidebarNav2 extends Component { if (badge) { const classes = classNames(badge.class); return ( - {badge.text} + {badge.text} ); } return null; @@ -184,15 +189,15 @@ class AppSidebarNav2 extends Component { const navClasses = classNames(className, 'sidebar-nav'); // ToDo: find better rtl fix - const isRtl = getComputedStyle(document.querySelector('html')).direction === 'rtl' + const isRtl = getComputedStyle(document.documentElement).direction === 'rtl' // sidebar-nav root return ( - - - + + + ); } } From f7eef6c2d89890c369c621202e15fa95e27e8e07 Mon Sep 17 00:00:00 2001 From: xidedix Date: Fri, 24 May 2019 17:11:37 +0200 Subject: [PATCH 2/5] fix(HeaderDropdown): add missing Dropdown.propTypes --- CHANGELOG.md | 1 + src/HeaderDropdown.js | 3 ++- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 9c9753a7..1547f48b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,7 @@ ##### `v2.5.1` - fix(SidebarNav): add missing `class` and `attributes` to navDropdown item +- fix(HeaderDropdown): add missing Dropdown.propTypes ###### dependencies update - update `core-js` to `^2.6.8` diff --git a/src/HeaderDropdown.js b/src/HeaderDropdown.js index cd23cb29..7fc33be3 100644 --- a/src/HeaderDropdown.js +++ b/src/HeaderDropdown.js @@ -4,7 +4,8 @@ import PropTypes from 'prop-types'; const propTypes = { children: PropTypes.node, - direction: PropTypes.string + direction: PropTypes.string, + ...Dropdown.propTypes }; const defaultProps = { From 8893d3fc5b9d32aa20b89a1d4c514312c24034fe Mon Sep 17 00:00:00 2001 From: xidedix Date: Fri, 24 May 2019 17:16:03 +0200 Subject: [PATCH 3/5] refactor(demo): AppHeaderDropdown remove style right auto --- CHANGELOG.md | 1 + demo/src/containers/DefaultLayout/DefaultLayout.js | 5 +++-- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1547f48b..3c7ac10d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,7 @@ - fix(SidebarNav): add missing `class` and `attributes` to navDropdown item - fix(HeaderDropdown): add missing Dropdown.propTypes +- refactor(demo): AppHeaderDropdown remove style right auto ###### dependencies update - update `core-js` to `^2.6.8` diff --git a/demo/src/containers/DefaultLayout/DefaultLayout.js b/demo/src/containers/DefaultLayout/DefaultLayout.js index 2fce1fb0..6e66ad3d 100644 --- a/demo/src/containers/DefaultLayout/DefaultLayout.js +++ b/demo/src/containers/DefaultLayout/DefaultLayout.js @@ -16,6 +16,7 @@ import { AppSidebarForm, AppSidebarHeader, AppSidebarMinimizer, + // AppSidebarNav as AppSidebarNav, AppSidebarNav2 as AppSidebarNav, AppSidebarToggler, } from '../../../../src'; @@ -53,7 +54,7 @@ class DefaultLayout extends Component { admin@bootstrapmaster.com - + AppHeaderDropdown @@ -91,7 +92,7 @@ class DefaultLayout extends Component { - CoreUI © 2018 creativeLabs + CoreUI © 2019 creativeLabs Powered by CoreUI for React From 49adbff8dd745608686ac2423e3de9b2ab21023b Mon Sep 17 00:00:00 2001 From: xidedix Date: Fri, 24 May 2019 17:16:34 +0200 Subject: [PATCH 4/5] chore: dependencies update - update `core-js` to `^2.6.8` - update `enzyme-adapter-react-16` to `^1.13.1` - update `webpack-dev-server` to `^3.4.1` --- .eslintrc | 2 +- package.json | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/.eslintrc b/.eslintrc index 8c2d9f43..4bfd9014 100644 --- a/.eslintrc +++ b/.eslintrc @@ -40,7 +40,7 @@ "createClass": "createReactClass", // Regex for Component Factory to use, // default to "createReactClass" "pragma": "React", // Pragma to use, default to "React" - "version": "16.5", // React version, default to the latest React stable release + "version": "16.8", // React version, default to the latest React stable release "flowVersion": "0.81" // Flow version }, "propWrapperFunctions": [ "forbidExtraProps" ] // The names of any functions used to wrap the diff --git a/package.json b/package.json index ea0e0966..daa0e102 100644 --- a/package.json +++ b/package.json @@ -37,7 +37,7 @@ "dependencies": { "@coreui/icons": "0.3.0", "classnames": "^2.2.6", - "core-js": "^2.6.5", + "core-js": "^2.6.8", "prop-types": "^15.7.2", "react-onclickout": "^2.0.8", "react-perfect-scrollbar": "^1.5.2", @@ -51,7 +51,7 @@ "devDependencies": { "babel-eslint": "^10.0.1", "enzyme": "^3.9.0", - "enzyme-adapter-react-16": "^1.13.0", + "enzyme-adapter-react-16": "^1.13.1", "eslint": "^5.16.0", "eslint-plugin-import": "^2.17.2", "eslint-plugin-react": "^7.13.0", @@ -60,7 +60,7 @@ "react-dom": "^16.8.6", "react-router-dom": "^5.0.0", "sinon": "^5.1.1", - "webpack-dev-server": "~3.3.1" + "webpack-dev-server": "^3.4.1" }, "repository": { "type": "git", From 3d4a2b85e5f7cf21852a246cdc90ad61b8b92171 Mon Sep 17 00:00:00 2001 From: xidedix Date: Fri, 24 May 2019 17:17:15 +0200 Subject: [PATCH 5/5] Ship: v2.5.1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index daa0e102..f723f247 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@coreui/react", - "version": "2.5.0", + "version": "2.5.1", "description": "CoreUI React Bootstrap 4 components", "license": "MIT", "author": {