diff --git a/package.json b/package.json index d87fb534..187fe42f 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@coreui/vue", "description": "CoreUI Vue Bootstrap 4 layout components", - "version": "2.0.0-beta.2", + "version": "2.0.0-rc.0", "license": "MIT", "main": "dist/coreui-vue.common.js", "module": "dist/coreui-vue.esm.js", @@ -100,7 +100,9 @@ "vue": "^2.5.16", "vue-jest": "^2.6.0", "vue-loader": "^14.2.2", - "vue-template-compiler": "^2.5.16" + "vue-server-renderer": "^2.5.16", + "vue-template-compiler": "^2.5.16", + "vue-test-utils": "^1.0.0-beta.11" }, "lint-staged": { "*.{js,vue}": [ diff --git a/src/components/Aside/AsideToggler.vue b/src/components/Aside/AsideToggler.vue index 9558ad77..7ab3e4dd 100644 --- a/src/components/Aside/AsideToggler.vue +++ b/src/components/Aside/AsideToggler.vue @@ -16,35 +16,34 @@ import toggleClasses from '../../shared/toggle-classes' export default { name: 'AsideToggler', props: { - mobile: { + defaultOpen: { type: Boolean, default: false }, display: { type: String, default: '' - } + }, + mobile: { + type: Boolean, + default: false + }, }, computed: { classList () { return [ 'navbar-toggler' - // 'd-none', - // 'd-lg-inline-block' ] } }, - mounted: function () { - // this.toggle() - }, methods: { - toggle () { + toggle (force) { const [display, mobile] = [this.display, this.mobile] let cssClass = asideMenuCssClasses[0] if (!mobile && display && checkBreakpoint(display, validBreakpoints)) { cssClass = `aside-menu-${display}-show` } - toggleClasses(cssClass, asideMenuCssClasses) + toggleClasses(cssClass, asideMenuCssClasses, force) }, asideToggle (e) { e.preventDefault() diff --git a/src/components/Breadcrumb/Breadcrumb.vue b/src/components/Breadcrumb/Breadcrumb.vue index 1864b859..b751c286 100644 --- a/src/components/Breadcrumb/Breadcrumb.vue +++ b/src/components/Breadcrumb/Breadcrumb.vue @@ -1,8 +1,8 @@ @@ -17,17 +17,16 @@ export default { } }, methods: { + getName (item) { + return item.meta && item.meta.label ? item.meta.label : item.name || null + }, isLast (index) { return index === this.list.length - 1 - }, - showName (item) { - if (item.meta && item.meta.label) { - item = item.meta && item.meta.label - } - if (item.name) { - item = item.name - } - return item + } + }, + computed: { + routeRecords: function () { + return this.list.filter((route) => route.name || route.meta.label) } } } diff --git a/src/components/Sidebar/SidebarToggler.vue b/src/components/Sidebar/SidebarToggler.vue index 88e93031..ba9f37f2 100644 --- a/src/components/Sidebar/SidebarToggler.vue +++ b/src/components/Sidebar/SidebarToggler.vue @@ -16,35 +16,37 @@ import toggleClasses from '../../shared/toggle-classes' export default { name: 'SidebarToggler', props: { - mobile: { + defaultOpen: { type: Boolean, - default: false + default: true }, display: { type: String, default: 'lg' + }, + mobile: { + type: Boolean, + default: false } }, computed: { classList () { return [ 'navbar-toggler' - // 'd-none', - // 'd-lg-inline-block' ] } }, mounted: function () { - this.toggle() + this.toggle(this.defaultOpen) }, methods: { - toggle () { + toggle (force) { const [display, mobile] = [this.display, this.mobile] let cssClass = sidebarCssClasses[0] if (!mobile && display && checkBreakpoint(display, validBreakpoints)) { cssClass = `sidebar-${display}-show` } - toggleClasses(cssClass, sidebarCssClasses) + toggleClasses(cssClass, sidebarCssClasses, force) }, sidebarToggle (e) { e.preventDefault() diff --git a/src/shared/toggle-classes.js b/src/shared/toggle-classes.js index 6f6205f7..feac9832 100644 --- a/src/shared/toggle-classes.js +++ b/src/shared/toggle-classes.js @@ -1,6 +1,6 @@ -export default function toggleClasses (toggleClass, classList) { +export default function toggleClasses (toggleClass, classList, force) { const level = classList.indexOf(toggleClass) const removeClassList = classList.slice(0, level) removeClassList.map((className) => document.body.classList.remove(className)) - document.body.classList.toggle(toggleClass) + document.body.classList.toggle(toggleClass, force) }