Skip to content

Commit a005e13

Browse files
xidedixxidedix
authored
Merge pull request #16 from coreui/dev-vnext
v2.0.1
2 parents 3f5fa9c + 91aec6a commit a005e13

File tree

6 files changed

+118
-63
lines changed

6 files changed

+118
-63
lines changed

Diff for: ‎CHANGELOG.md

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
### [@coreui/vue](https://coreui.io/) changelog
2+
3+
##### v2.0.1
4+
- fix(SidebarNav): dirty fix for `rtl` ps scrolling issue
5+
- refactor(SidebarMinimizer): extract `togglePs` mixin
6+
- update `@vue/test-utils` to `^1.0.0-beta.25`
7+
- update `babel-eslint` to `^10.0.1`
8+
- update `babel-jest` to `^23.6.0`
9+
- update `eslint` to `^5.6.1`
10+
- update `eslint-config-prettier` to `^3.1.0`
11+
- update `eslint-plugin-html` to `^4.0.6`
12+
- update `eslint-plugin-jest` to `^21.24.1`
13+
- update `eslint-plugin-prettier` to `^3.0.0`
14+
- update `husky` to `^1.1.0`
15+
- update `jest` to `^23.6.0`
16+
- update `lint-staged` to `^7.3.0`
17+
- update `lodash` to `^4.17.11`
18+
- update `prettier` to `^1.14.3`
19+
- update `rollup-plugin-filesize` to `^4.0.1`
20+
- update `rollup-plugin-json` to `^3.1.0`
21+
- update `rollup-plugin-node-resolve` to `^3.4.0`
22+
- update `vue-loader` to `^15.4.2`

Diff for: ‎README.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@
33
[![Npm badge](https://img.shields.io/npm/v/@coreui/vue.svg)][npm]
44
[![NPM downloads][npm-download]][npm]
55
![Rollup badge](https://img.shields.io/badge/Rollup-^0.59.4-ff69b4.svg)
6-
![Jest](https://img.shields.io/badge/Jest-^22.4.4-blue.svg)
7-
![Vue](https://img.shields.io/badge/Vue-^2.5.16-brightgreen.svg)
6+
![Jest](https://img.shields.io/badge/Jest-^23.6.0-blue.svg)
7+
![Vue](https://img.shields.io/badge/Vue-^2.5.17-brightgreen.svg)
88

99
[npm]: https://www.npmjs.com/package/@coreui/vue
1010
[npm-download]: https://img.shields.io/npm/dm/@coreui/vue.svg?style=flat-square

Diff for: ‎package.json

+22-19
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "@coreui/vue",
33
"description": "CoreUI Vue Bootstrap 4 layout components",
4-
"version": "2.0.0",
4+
"version": "2.0.1",
55
"license": "MIT",
66
"main": "dist/coreui-vue.common.js",
77
"module": "dist/coreui-vue.esm.js",
@@ -63,49 +63,52 @@
6363
"vue-perfect-scrollbar": "^0.1.0"
6464
},
6565
"devDependencies": {
66-
"@vue/test-utils": "^1.0.0-beta.24",
66+
"@vue/test-utils": "^1.0.0-beta.25",
6767
"babel-core": "^6.26.3",
68-
"babel-eslint": "^9.0.0",
69-
"babel-jest": "^23.4.2",
68+
"babel-eslint": "^10.0.1",
69+
"babel-jest": "^23.6.0",
7070
"babel-plugin-dynamic-import-node": "^2.1.0",
7171
"babel-plugin-module-resolver": "^3.1.1",
7272
"babel-preset-vue-app": "^2.0.0",
73-
"eslint": "^5.4.0",
74-
"eslint-config-prettier": "^3.0.1",
73+
"eslint": "^5.6.1",
74+
"eslint-config-prettier": "^3.1.0",
7575
"eslint-import-resolver-babel-module": "^4.0.0",
76-
"eslint-plugin-html": "^4.0.5",
76+
"eslint-plugin-html": "^4.0.6",
7777
"eslint-plugin-import": "^2.14.0",
78-
"eslint-plugin-jest": "^21.22.0",
79-
"eslint-plugin-prettier": "^2.6.2",
78+
"eslint-plugin-jest": "^21.24.1",
79+
"eslint-plugin-prettier": "^3.0.0",
8080
"eslint-plugin-vue": "^5.0.0-beta.3",
81-
"husky": "^0.14.3",
82-
"jest": "^23.5.0",
81+
"husky": "^1.1.0",
82+
"jest": "^23.6.0",
8383
"jest-serializer-html": "^5.0.0",
8484
"jest-serializer-vue": "^2.0.2",
8585
"jest-vue-preprocessor": "^1.4.0",
86-
"lint-staged": "^7.2.2",
87-
"lodash": "^4.17.10",
86+
"lint-staged": "^7.3.0",
87+
"lodash": "^4.17.11",
8888
"node-sass": "^4.9.3",
89-
"prettier": "^1.14.2",
89+
"prettier": "^1.14.3",
9090
"rollup": "^0.59.4",
9191
"rollup-plugin-babel": "^3.0.7",
92-
"rollup-plugin-commonjs": "^9.1.3",
93-
"rollup-plugin-filesize": "^1.5.0",
94-
"rollup-plugin-json": "^3.0.0",
92+
"rollup-plugin-commonjs": "^9.1.8",
93+
"rollup-plugin-filesize": "^4.0.1",
94+
"rollup-plugin-json": "^3.1.0",
9595
"rollup-plugin-license": "^0.7.0",
96-
"rollup-plugin-node-resolve": "^3.3.0",
96+
"rollup-plugin-node-resolve": "^3.4.0",
9797
"rollup-plugin-replace": "^2.0.0",
9898
"rollup-plugin-uglify": "^3.0.0",
9999
"rollup-plugin-vue": "^4.3.2",
100100
"sass-loader": "^7.1.0",
101101
"uglify-es": "^3.3.9",
102102
"vue": "^2.5.17",
103103
"vue-jest": "^2.6.0",
104-
"vue-loader": "^15.4.1",
104+
"vue-loader": "^15.4.2",
105105
"vue-router": "^3.0.1",
106106
"vue-server-renderer": "^2.5.17",
107107
"vue-template-compiler": "^2.5.17"
108108
},
109+
"peerDependencies": {
110+
"@coreui/coreui": "^2.0.14"
111+
},
109112
"lint-staged": {
110113
"*.{js,vue}": [
111114
"eslint --fix",

Diff for: ‎src/components/Sidebar/SidebarMinimizer.vue

+9-2
Original file line numberDiff line numberDiff line change
@@ -2,17 +2,24 @@
22
<button class="sidebar-minimizer" type="button" @click="onClick()"></button>
33
</template>
44
<script>
5+
import { togglePs } from '../../mixins/togglePs'
56
67
export default {
78
name: 'sidebar-minimizer',
9+
mixins: [ togglePs ],
10+
mounted: function () {
11+
const isMinimized = document.body.classList.contains('sidebar-minimized')
12+
this.togglePs(!isMinimized)
13+
},
814
methods: {
915
onClick () {
1016
this.sidebarMinimize()
1117
this.brandMinimize()
1218
},
1319
sidebarMinimize () {
14-
document.body.classList.toggle('sidebar-minimized')
15-
document.querySelector('.sidebar-nav section').classList.toggle('ps')
20+
const isMinimized = document.body.classList.toggle('sidebar-minimized')
21+
this.$emit('cui-sidebar-minimize', isMinimized)
22+
this.togglePs(!isMinimized)
1623
},
1724
brandMinimize () {
1825
document.body.classList.toggle('brand-minimized')

Diff for: ‎src/components/Sidebar/SidebarNav.vue

+44-40
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,47 @@
11
<template>
22
<nav class="sidebar-nav">
33
<VuePerfectScrollbar class="scroll-area" :settings="psSettings" @ps-scroll-y="scrollHandle">
4-
<ul class="nav">
5-
<template v-for="(item, index) in navItems">
6-
<template v-if="item.title">
7-
<SidebarNavTitle :key="index" :name="item.name" :classes="item.class" :wrapper="item.wrapper"/>
8-
</template>
9-
<template v-else-if="item.divider">
10-
<SidebarNavDivider :key="index" :classes="item.class"/>
11-
</template>
12-
<template v-else-if="item.label">
13-
<SidebarNavLabel :key="index" :name="item.name" :url="item.url" :icon="item.icon" :label="item.label" :classes="item.class"/>
14-
</template>
15-
<template v-else>
16-
<template v-if="item.children">
17-
<!-- First level dropdown -->
18-
<SidebarNavDropdown :key="index" :name="item.name" :url="item.url" :icon="item.icon">
19-
<template v-for="(childL1, index1) in item.children">
20-
<template v-if="childL1.children">
21-
<!-- Second level dropdown -->
22-
<SidebarNavDropdown :key="index1" :name="childL1.name" :url="childL1.url" :icon="childL1.icon">
23-
<li :key="index2" class="nav-item" v-for="(childL2, index2) in childL1.children">
24-
<SidebarNavLink :name="childL2.name" :url="childL2.url" :icon="childL2.icon" :badge="childL2.badge" :variant="item.variant"/>
25-
</li>
26-
</SidebarNavDropdown>
27-
</template>
28-
<template v-else>
29-
<SidebarNavItem :key="index1" :classes="item.class">
30-
<SidebarNavLink :name="childL1.name" :url="childL1.url" :icon="childL1.icon" :badge="childL1.badge" :variant="item.variant"/>
31-
</SidebarNavItem>
32-
</template>
33-
</template>
34-
</SidebarNavDropdown>
4+
<ul class="nav">
5+
<template v-for="(item, index) in navItems">
6+
<template v-if="item.title">
7+
<SidebarNavTitle :key="index" :name="item.name" :classes="item.class" :wrapper="item.wrapper"/>
8+
</template>
9+
<template v-else-if="item.divider">
10+
<SidebarNavDivider :key="index" :classes="item.class"/>
11+
</template>
12+
<template v-else-if="item.label">
13+
<SidebarNavLabel :key="index" :name="item.name" :url="item.url" :icon="item.icon" :label="item.label" :classes="item.class"/>
3514
</template>
3615
<template v-else>
37-
<SidebarNavItem :key="index" :classes="item.class">
38-
<SidebarNavLink :name="item.name" :url="item.url" :icon="item.icon" :badge="item.badge" :variant="item.variant"/>
39-
</SidebarNavItem>
16+
<template v-if="item.children">
17+
<!-- First level dropdown -->
18+
<SidebarNavDropdown :key="index" :name="item.name" :url="item.url" :icon="item.icon">
19+
<template v-for="(childL1, index1) in item.children">
20+
<template v-if="childL1.children">
21+
<!-- Second level dropdown -->
22+
<SidebarNavDropdown :key="index1" :name="childL1.name" :url="childL1.url" :icon="childL1.icon">
23+
<li :key="index2" class="nav-item" v-for="(childL2, index2) in childL1.children">
24+
<SidebarNavLink :name="childL2.name" :url="childL2.url" :icon="childL2.icon" :badge="childL2.badge" :variant="item.variant"/>
25+
</li>
26+
</SidebarNavDropdown>
27+
</template>
28+
<template v-else>
29+
<SidebarNavItem :key="index1" :classes="item.class">
30+
<SidebarNavLink :name="childL1.name" :url="childL1.url" :icon="childL1.icon" :badge="childL1.badge" :variant="item.variant"/>
31+
</SidebarNavItem>
32+
</template>
33+
</template>
34+
</SidebarNavDropdown>
35+
</template>
36+
<template v-else>
37+
<SidebarNavItem :key="index" :classes="item.class">
38+
<SidebarNavLink :name="item.name" :url="item.url" :icon="item.icon" :badge="item.badge" :variant="item.variant"/>
39+
</SidebarNavItem>
40+
</template>
4041
</template>
4142
</template>
42-
</template>
43-
</ul>
44-
<slot></slot>
43+
</ul>
44+
<slot></slot>
4545
</VuePerfectScrollbar>
4646
</nav>
4747
</template>
@@ -74,11 +74,15 @@ export default {
7474
VuePerfectScrollbar
7575
},
7676
data () {
77-
return {
78-
psSettings: {
77+
return {}
78+
},
79+
computed: {
80+
psSettings: () => {
81+
// ToDo: find better rtl fix
82+
return {
7983
maxScrollbarLength: 200,
8084
minScrollbarLength: 40,
81-
suppressScrollX: true,
85+
suppressScrollX: getComputedStyle(document.querySelector('html')).direction !== 'rtl',
8286
wheelPropagation: false,
8387
interceptRailY: styles => ({ ...styles, height: 0 })
8488
}

Diff for: ‎src/mixins/togglePs.js

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
const togglePs = {
2+
methods: {
3+
togglePs(toggle) {
4+
const sidebar = document.querySelector('.sidebar-nav section')
5+
if (sidebar) {
6+
// sidebar.classList.toggle('ps', toggle);
7+
// sidebar.classList.toggle('ps-container', toggle);
8+
// sidebar.classList.toggle('ps--active-y', toggle);
9+
if (toggle) {
10+
sidebar.classList.add('ps', 'ps-container', 'ps--active-y')
11+
} else {
12+
sidebar.classList.remove('ps', 'ps-container', 'ps--active-y')
13+
}
14+
}
15+
}
16+
}
17+
}
18+
19+
export { togglePs }

0 commit comments

Comments
 (0)