Skip to content

Commit 041be77

Browse files
tmorehousetmorehouse
authored
chore: release v2.9.0
2 parents d3a538a + 567061a commit 041be77

38 files changed

+1328
-898
lines changed

‎.github/ISSUE_TEMPLATE/DOCS_ISSUE_TEMPLATE.md

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
---
2+
name: 📖 Documentation issue
3+
about: Help improve our docs.
4+
---
5+
6+
### Documentation issue
7+
8+
<!-- (Update "[ ]" to "[x]" to check a box) -->
9+
10+
- [ ] Reporting a typo
11+
- [ ] Reporting a documentation bug
12+
- [ ] Documentation improvement
13+
- [ ] Documentation feedback
14+
15+
<!--
16+
If your issue is not regarding the documentation, please choose an issue type:
17+
https://github.com/bootstrap-vue/bootstrap-vue/issues/new/choose
18+
-->
19+
20+
### Is there a specific documentation page you are reporting?
21+
22+
Enter the URL or documentation section here.
23+
24+
### Additional context or description
25+
26+
Provide any additional details here as needed.

‎CHANGELOG.md

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,40 @@
22

33
> All notable changes to this project will be documented in this file.
44
5+
<a name="2.9.0"></a>
6+
7+
## [v2.9.0](https://github.com/bootstrap-vue/bootstrap-vue/compare/v2.8.0...v2.9.0)
8+
9+
Released: 2020-03-25
10+
11+
### Features v2.9.0
12+
13+
- **b-aspect:** new custom component `<b-aspect>`
14+
([#5008](https://github.com/bootstrap-vue/bootstrap-vue/issues/5008))
15+
([662c8e0](https://github.com/bootstrap-vue/bootstrap-vue/commit/662c8e0709c8c73fb2119976d1906943cfe6daad))
16+
- **b-avatar:** add `alt` prop for adding alt attribute to image and icon avatars (closes
17+
[#4990](https://github.com/bootstrap-vue/bootstrap-vue/issues/4990))
18+
([#4991](https://github.com/bootstrap-vue/bootstrap-vue/issues/4991))
19+
([d1474f2](https://github.com/bootstrap-vue/bootstrap-vue/commit/d1474f28729e4e13ad97b75a87d56f85543d4c96))
20+
- **b-drodpown-item-button, b-drodpown-item-button:** add `button-class` and `link-class` prop
21+
([#5014](https://github.com/bootstrap-vue/bootstrap-vue/issues/5014))
22+
([b39d31c](https://github.com/bootstrap-vue/bootstrap-vue/commit/b39d31cede76b594b5608fa472d53e3dac525e2b))
23+
- **b-form-datepicker, b-form-timepicker:** emit `shown` and `hidden` events
24+
([#5004](https://github.com/bootstrap-vue/bootstrap-vue/issues/5004))
25+
([eb259b9](https://github.com/bootstrap-vue/bootstrap-vue/commit/eb259b998dfd3e88a1b04ed8d3f4c97560f69dbb))
26+
- **b-navbar-toggle:** make default slot scoped
27+
([#4995](https://github.com/bootstrap-vue/bootstrap-vue/issues/4995))
28+
([144d45f](https://github.com/bootstrap-vue/bootstrap-vue/commit/144d45fb0e4d66bbf243b4a4df39d7f3b9b5c7cc))
29+
30+
### Docs v2.9.0
31+
32+
- Ensure that the `IconsPlugin` is imported when exporting from playground to CodePen, CodeSandbox,
33+
and JsFiddle ([#5003](https://github.com/bootstrap-vue/bootstrap-vue/issues/5003))
34+
35+
### Other v2.9.0
36+
37+
- dev dependency updates
38+
539
<a name="2.8.0"></a>
640

741
## [v2.8.0](https://github.com/bootstrap-vue/bootstrap-vue/compare/v2.7.0...v2.8.0)

‎docs/components/feedback.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,8 @@ export default {
1212
return slug || name === 'docs' || name === 'docs-icons'
1313
},
1414
reportIssueUrl() {
15-
// Add appreciate query params for proper issue title
16-
return `${this.baseUrl}/issues/new?title=Docs`
15+
// Select issue template
16+
return `${this.baseUrl}/issues/new?template=DOCS_ISSUE_TEMPLATE.md`
1717
},
1818
editPageUrl() {
1919
const name = this.$route.name

‎docs/pages/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -208,7 +208,7 @@
208208

209209
<b-card tag="article" body-text-variant="muted" class="rounded-0 border-0">
210210
<b-card-text text-tag="h3" class="h5 text-center bd-text-purple-bright mb-2">
211-
<b-icon icon="columns-gap" width="2.5em" height="2.5em" class="mx-auto d-block mb-3"></b-icon>
211+
<b-icon icon="puzzle" width="2.5em" height="2.5em" class="mx-auto d-block mb-3"></b-icon>
212212
<span>Modular</span>
213213
</b-card-text>
214214
<b-card-text class="text-center">

‎docs/pages/play.vue

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -436,7 +436,8 @@ export default {
436436
externalJs: [
437437
'//unpkg.com/babel-polyfill/dist/polyfill.min.js',
438438
`//unpkg.com/vue@${vueVersion}/dist/vue.min.js`,
439-
`//unpkg.com/bootstrap-vue@${bootstrapVueVersion}/dist/bootstrap-vue.js`
439+
`//unpkg.com/bootstrap-vue@${bootstrapVueVersion}/dist/bootstrap-vue.js`,
440+
`//unpkg.com/bootstrap-vue@${bootstrapVueVersion}/dist/bootstrap-vue-icons.js`
440441
]
441442
}
442443
},
@@ -479,13 +480,14 @@ export default {
479480
const htmlContent = '<div id="app"></div>'
480481
const jsContent = [
481482
"import Vue from 'vue'",
482-
"import BootstrapVue from 'bootstrap-vue'",
483+
"import { BootstrapVue, BootstrapVueIcons } from 'bootstrap-vue'",
483484
"import App from './App'",
484485
'',
485486
"import 'bootstrap/dist/css/bootstrap.css'",
486487
"import 'bootstrap-vue/dist/bootstrap-vue.css'",
487488
'',
488489
'Vue.use(BootstrapVue)',
490+
'Vue.use(BootstrapVueIcons)',
489491
'',
490492
"new Vue({ el: '#app', render: h => h(App) })"
491493
].join('\r\n')

‎package.json

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "bootstrap-vue",
3-
"version": "2.8.0",
3+
"version": "2.9.0",
44
"description": "BootstrapVue, with more than 85 custom components, over 45 plugins, several custom directives, and over 300 icons, provides one of the most comprehensive implementations of Bootstrap v4 components and grid system for Vue.js. With extensive and automated WAI-ARIA accessibility markup.",
55
"main": "dist/bootstrap-vue.common.js",
66
"web": "dist/bootstrap-vue.js",
@@ -101,14 +101,14 @@
101101
"@babel/plugin-transform-modules-commonjs": "^7.9.0",
102102
"@babel/plugin-transform-runtime": "^7.9.0",
103103
"@babel/preset-env": "^7.9.0",
104-
"@babel/standalone": "^7.9.3",
104+
"@babel/standalone": "^7.9.4",
105105
"@nuxtjs/google-analytics": "^2.2.3",
106106
"@nuxtjs/pwa": "^3.0.0-beta.20",
107107
"@vue/test-utils": "1.0.0-beta.29",
108-
"autoprefixer": "^9.7.4",
108+
"autoprefixer": "^9.7.5",
109109
"babel-core": "^7.0.0-bridge.0",
110110
"babel-eslint": "^10.1.0",
111-
"babel-jest": "^25.1.0",
111+
"babel-jest": "^25.2.0",
112112
"babel-plugin-istanbul": "^6.0.0",
113113
"bootstrap-icons": "^1.0.0-alpha3",
114114
"clean-css-cli": "^4.3.0",
@@ -134,18 +134,18 @@
134134
"highlight.js": "^9.18.1",
135135
"html-loader": "^1.0.0",
136136
"husky": "^4.2.3",
137-
"jest": "^25.1.0",
137+
"jest": "^25.2.0",
138138
"jest-environment-jsdom-fourteen": "^1.0.1",
139-
"lint-staged": "^10.0.8",
139+
"lint-staged": "^10.0.9",
140140
"loader-utils": "^2.0.0",
141141
"lodash": "^4.17.15",
142142
"marked": "^0.8.2",
143143
"node-sass": "^4.13.1",
144-
"nuxt": "^2.12.0",
144+
"nuxt": "^2.12.1",
145145
"postcss-cli": "^7.1.0",
146146
"prettier": "1.14.3",
147147
"require-context": "^1.1.0",
148-
"rollup": "^2.1.0",
148+
"rollup": "^2.2.0",
149149
"rollup-plugin-babel": "^4.4.0",
150150
"rollup-plugin-commonjs": "^10.1.0",
151151
"rollup-plugin-node-resolve": "^5.2.0",

‎src/components/aspect/README.md

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
# Aspect
2+
3+
> The `<b-aspect>` component can be used to maintain a minimum responsive aspect ratio for content.
4+
> When the content is longer than the available height, then the component will expand vertically to
5+
> fit all content. If the content is shorter than the computed aspect height, the component will
6+
> ensure a minimum height is maintained.
7+
8+
## Overview
9+
10+
The `<b-aspect>` component was introduced in BootstrapVue `v2.9.0`.
11+
12+
The default [aspect](<https://en.wikipedia.org/wiki/Aspect_ratio_(image)>) ratio is `1:1` (ratio of
13+
`1`), which makes the height always be at least the same as the width. The `aspect` prop can be used
14+
to specify an arbitrary aspect ratio (i.e. `1.5`) or a ratio as a string such as `'16:9'` or
15+
`'4:3'`.
16+
17+
The width will always be 100% of the available width in the parent element/component.
18+
19+
```html
20+
<template>
21+
<div>
22+
<b-form-group label="Aspect ratio" label-for="ratio" label-cols-md="auto" class="mb-3">
23+
<b-form-select id="ratio" v-model="aspect" :options="aspects"></b-form-input>
24+
</b-form-group>
25+
<b-card>
26+
<b-aspect :aspect="aspect">
27+
This will always be an aspect of "{{ aspect }}",
28+
except when the content is too tall.
29+
</b-aspect>
30+
</b-card>
31+
</div>
32+
</template>
33+
34+
<script>
35+
export default {
36+
data() {
37+
return {
38+
aspect: '16:9',
39+
aspects: [
40+
{ text: '4:3 (SD)', value: '4:3' },
41+
{ text: '1:1 (Square)', value: '1:1' },
42+
{ text: '16:9 (HD)', value: '16:9' },
43+
{ text: '1.85:1 (Widescreen)', value: '1.85:1' },
44+
{ text: '2:1 (Univisium/Superscope)', value: '2:1' },
45+
{ text: '21:9 (Anamorphic)', value: '21:9' },
46+
{ text: '1.43:1 (IMAX)', value: '1.43:1' },
47+
{ text: '3:2 (35mm Film)', value: '3:2' },
48+
{ text: '3:1 (APS-P)', value: '3:1' },
49+
{ text: '4/3 (Same as 4:3)', value: 4 / 3 },
50+
{ text: '16/9 (Same as 16:9)', value: 16 / 9 },
51+
{ text: '3 (Same as 3:1)', value: 3 },
52+
{ text: '2 (Same as 2:1)', value: 2 },
53+
{ text: '1.85 (Same as 1.85:1)', value: 1.85 },
54+
{ text: '1.5', value: 1.5 },
55+
{ text: '1 (Same as 1:1)', value: 1 }
56+
]
57+
}
58+
}
59+
}
60+
</script>
61+
62+
<!-- b-aspect.vue -->
63+
```
64+
65+
## See also
66+
67+
- [`<b-embed>` component](/docs/components/embed) for responsive embeds (videos, iframes, etc)

‎src/components/aspect/aspect.js

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
import Vue from '../../utils/vue'
2+
import { toFloat } from '../../utils/number'
3+
import normalizeSlotMixin from '../../mixins/normalize-slot'
4+
5+
// --- Constants ---
6+
const NAME = 'BAspect'
7+
const CLASS_NAME = 'b-aspect'
8+
9+
const RX_ASPECT = /^\d+(\.\d*)?[/:]\d+(\.\d*)?$/
10+
const RX_SEPARATOR = /[/:]/
11+
12+
// --- Main Component ---
13+
export const BAspect = /*#__PURE__*/ Vue.extend({
14+
name: NAME,
15+
mixins: [normalizeSlotMixin],
16+
props: {
17+
aspect: {
18+
// Accepts a number (i.e. `16 / 9`, `1`, `4 / 3`)
19+
// Or a string (i.e. '16/9', '16:9', '4:3' '1:1')
20+
type: [Number, String],
21+
default: '1:1'
22+
},
23+
tag: {
24+
type: String,
25+
default: 'div'
26+
}
27+
},
28+
computed: {
29+
padding() {
30+
const aspect = this.aspect
31+
let ratio = 1
32+
if (RX_ASPECT.test(aspect)) {
33+
const [width, height] = aspect.split(RX_SEPARATOR).map(v => toFloat(v) || 1)
34+
ratio = width / height
35+
} else {
36+
ratio = toFloat(aspect) || 1
37+
}
38+
return `${100 / Math.abs(ratio)}%`
39+
}
40+
},
41+
render(h) {
42+
const $sizer = h('div', {
43+
staticClass: `${CLASS_NAME}-sizer flex-grow-1`,
44+
style: { paddingBottom: this.padding, height: 0 }
45+
})
46+
const $content = h(
47+
'div',
48+
{
49+
staticClass: `${CLASS_NAME}-content flex-grow-1 w-100 mw-100`,
50+
style: { marginLeft: '-100%' }
51+
},
52+
[this.normalizeSlot('default')]
53+
)
54+
return h(this.tag, { staticClass: `${CLASS_NAME} d-flex` }, [$sizer, $content])
55+
}
56+
})

0 commit comments

Comments
 (0)