8000 chore: release 2.11.0 · bootstrap-vue/bootstrap-vue@cef3878 · GitHub
[go: up one dir, main page]

Skip to content

Commit cef3878

Browse files
authored
chore: release 2.11.0
2 parents 78dc146 + d30c8b0 commit cef3878

File tree

40 files changed

+1318
-630
lines changed

40 files changed

+1318
-630
lines changed

CHANGELOG.md

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

33
> All notable changes to this project will be documented in this file.
44
5+
<a name="2.11.0"></a>
6+
7+
## [v2.11.0](https://github.com/bootstrap-vue/bootstrap-vue/compare/v2.10.1...v2.11.0)
8+
9+
Released: 2020-04-07
10+
11+
### Features v2.11.0
12+
13+
- **b-avatar:** if image `src` fails to load, then show icon, text or fallback icon
14+
([#5079](https://github.com/bootstrap-vue/bootstrap-vue/issues/5079))
15+
([ed6704d](https://github.com/bootstrap-vue/bootstrap-vue/commit/ed6704d0971ade485393b7f711f05d93ca42ebc3))
16+
- **b-calendar, b-form-datepicker:** add optional decade navigation buttons (addresses
17+
[#4976](https://github.com/bootstrap-vue/bootstrap-vue/issues/4976))
18+
([#5112](https://github.com/bootstrap-vue/bootstrap-vue/issues/5112))
19+
([b1f74a8](https://github.com/bootstrap-vue/bootstrap-vue/commit/b1f74a84f4021022e606360ee6824c6645b6fbd0))
20+
21+
### Bug Fixes v2.11.0
22+
23+
- **b-calendar, b-form-datepicker:** handle keyboard navigation when selected date is out of range
24+
(fixes [#5057](https://github.com/bootstrap-vue/bootstrap-vue/issues/5057))
25+
([#5108](https://github.com/bootstrap-vue/bootstrap-vue/issues/5108))
26+
([6ed09f4](https://github.com/bootstrap-vue/bootstrap-vue/commit/6ed09f40ae1594c7ad96dedc8c3d7c2a54d4d9c7))
27+
- **b-link:** don't render `target` or `rel` attrs when `router-tag` other than `a` or `area`
28+
provided ([#5107](https://github.com/bootstrap-vue/bootstrap-vue/issues/5107))
29+
([33c6cef](https://github.com/bootstrap-vue/bootstrap-vue/commit/33c6cefc2f46ab8110e39f110d984f230d525c86))
30+
- **tooltip, popover:** handle `'click blur'` trigger on iOS webkit browsers (fixes
31+
[#5099](https://github.com/bootstrap-vue/bootstrap-vue/issues/5099))
32+
([#5103](https://github.com/bootstrap-vue/bootstrap-vue/issues/5103))
33+
([27da76c](https://github.com/bootstrap-vue/bootstrap-vue/commit/27da76cdc70449b0564e31f5733df97d758652ea))
34+
35+
### Other v2.11.0
36+
37+
- additional unit testing
38+
- dev dependencies updates
39+
- minor documentation updates
40+
541
<a name="2.10.1"></a>
642

743
## [v2.10.1](https://github.com/bootstrap-vue/bootstrap-vue/compare/v2.10.0...v2.10.1)

docs/components/header.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
</b-navbar-brand>
3030

3131
<div class="navbar-nav-scroll">
32-
<b-navbar-nav is-nav class="bd-navbar-nav flex-row">
32+
<b-navbar-nav class="bd-navbar-nav flex-row">
3333
<b-nav-item to="/docs" active-class="active" exact>Docs</b-nav-item>
3434
<b-nav-item to="/docs/components" active-class="active">Components</b-nav-item>
3535
<b-nav-item to="/docs/directives" active-class="active">Directives</b-nav-item>

package.json

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "bootstrap-vue",
3-
"version": "2.10.1",
3+
"version": "2.11.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",
@@ -100,12 +100,12 @@
100100
"@babel/core": "^7.9.0",
101101
"@babel/plugin-transform-modules-commonjs": "^7.9.0",
102102
"@babel/plugin-transform-runtime": "^7.9.0",
103-
"@babel/preset-env": "^7.9.0",
104-
"@babel/standalone": "^7.9.4",
103+
"@babel/preset-env": "^7.9.5",
104+
"@babel/standalone": "^7.9.5",
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.5",
108+
"autoprefixer": "^9.7.6",
109109
"babel-core": "^7.0.0-bridge.0",
110110
"babel-eslint": "^10.1.0",
111111
"babel-jest": "^25.2.6",
@@ -134,9 +134,9 @@
134134
"highlight.js": "^9.18.1",
135135
"html-loader": "^1.1.0",
136136
"husky": "^4.2.3",
137-
"jest": "^25.2.6",
137+
"jest": "^25.2.7",
138138
"jest-environment-jsdom-fourteen": "^1.0.1",
139-
"lint-staged": "^10.1.1",
139+
"lint-staged": "^10.1.2",
140140
"loader-utils": "^2.0.0",
141141
"lodash": "^4.17.15",
142142
"marked": "^0.8.2",
@@ -145,7 +145,7 @@
145145
"postcss-cli": "^7.1.0",
146146
"prettier": "1.14.3",
147147
"require-context": "^1.1.0",
148-
"rollup": "^2.3.2",
148+
"rollup": "^2.3.4",
149149
"rollup-plugin-babel": "^4.4.0",
150150
"rollup-plugin-commonjs": "^10.1.0",
15 F438 1151
"rollup-plugin-node-resolve": "^5.2.0",

src/components/avatar/README.md

Lines changed: 28 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -52,27 +52,11 @@ components.
5252

5353
## Avatar types
5454

55-
The avatar content can be either a short text string, an image, or an icon. Avatar content defaults
55+
The avatar content can be either a an image, an icon, or short text string. Avatar content defaults
5656
to the [`'person-fill'` icon](/docs/icons) when no other content is specified.
5757

58-
### Text content
59-
60-
You can specify a short string as the content of an avatar via the `text` prop. The string should be
61-
short (1 to 3 characters), and will be transformed via CSS to be all uppercase. The font size will
62-
be scaled relative to the [`size` prop setting](#sizing).
63-
64-
```html
65-
<template>
66-
<div class="mb-2">
67-
<b-avatar text="BV"></b-avatar>
68-
<b-avatar text="a"></b-avatar>
69-
<b-avatar text="Foo"></b-avatar>
70-
<b-avatar text="BV" size="4rem"></b-avatar>
71-
</div>
72-
</template>
73-
74-
<!-- b-avatar-text.vue -->
75-
```
58+
You can also supply custom content via the default slot, although you may need to apply additional
59+
styling on the content.
7660

7761
### Image content
7862

@@ -96,7 +80,11 @@ and will be sized to show the avatar's [variant background](#variants) around th
9680

9781
- When using a module bundler and project relative image URLs, please refer to the
9882
[Component img src resolving](/docs/reference/images) reference section for additional details.
99-
- The `src` prop takes precedence over the `text` prop.
83+
- The `src` prop takes precedence over the `icon` and `text` props.
84+
- <span class="badge badge-secondary">2.11.0+</span> If the image fails to load, the avatar will
85+
fallback to the value of the `icon` or `text` props. If neither the `icon` or `text` props are
86+
provided, then the default avatar icon will be shown. Also, when the image fails to load, the
87+
`img-error` event will be emitted.
10088

10189
### Icon content
10290

@@ -121,10 +109,29 @@ prop should be set to a valid icon name. Icons will scale respective to the [`si
121109
- When providing a BootstrapVue icon name, you _must_ ensure that you have registered the
122110
corresponding icon component (either locally to your component/page, or globally), if not using
123111
the full [`BootstrapVueIcons` plugin](/docs/icons).
124-
- The `icon` prop takes precedence over the `text` and `src` props.
112+
- The `icon` prop takes precedence over the `text` prop.
125113
- If the `text`, `src`, or `icon` props are not provided _and_ the [default slot](#custom-content)
126114
has no content, then the `person-fill` icon will be used.
127115

116+
### Text content
117+
118+
You can specify a short string as the content of an avatar via the `text` prop. The string should be
119+
short (1 to 3 characters), and will be transformed via CSS to be all uppercase. The font size will
120+
be scaled relative to the [`size` prop setting](#sizing).
121+
122+
```html
123+
<template>
124+
<div class="mb-2">
125+
<b-avatar text="BV"></b-avatar>
126+
<b-avatar text="a"></b-avatar>
127+
<b-avatar text="Foo"></b-avatar>
128+
<b-avatar text="BV" size="4rem"></b-avatar>
129+
</div>
130+
</template>
131+
132+
<!-- b-avatar-text.vue -->
133+
```
134+
128135
### Custom content
129136

130137
Use the `default` slot to render custom content in the avatar, for finer grained control of its

src/components/avatar/avatar.js

Lines changed: 56 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { mergeData } from 'vue-functional-data-merge'
21
import Vue from '../../utils/vue'
32
import pluckProps from '../../utils/pluck-props'
43
import { getComponentConfig } from '../../utils/config'
@@ -8,6 +7,7 @@ import { BButton } from '../button/button'
87
import { BLink } from '../link/link'
98
import { BIcon } from '../../icons/icon'
109
import { BIconPersonFill } from '../../icons/icons'
10+
import normalizeSlotMixin from '../../mixins/normalize-slot'
1111

1212
// --- Constants ---
1313
const NAME = 'BAvatar'
@@ -135,30 +135,69 @@ const computeSize = value => {
135135
// @vue/component
136136
export const BAvatar = /*#__PURE__*/ Vue.extend({
137137
name: NAME,
138-
functional: true,
138+
mixins: [normalizeSlotMixin],
139139
props,
140-
render(h, { props, data, children }) {
141-
const { variant, disabled, square, icon, src, text, button: isButton, buttonType: type } = props
142-
const isBLink = !isButton && (props.href || props.to)
140+
data() {
141+
return {
142+
localSrc: this.src || null
143+
}
144+
},
145+
computed: {
146+
computedSize() {
147+
return computeSize(this.size)
148+
},
149+
fontSize() {
150+
const size = this.computedSize
151+
return size ? `calc(${size} * ${FONT_SIZE_SCALE})` : null
152+
}
153+
},
154+
watch: {
155+
src(newSrc, oldSrc) {
156+
if (newSrc !== oldSrc) {
157+
this.localSrc = newSrc || null
158+
}
159+
}
160+
},
161+
methods: {
162+
onImgError(evt) {
163+
this.localSrc = null
164+
this.$emit('img-error', evt)
165+
},
166+
onClick(evt) {
167+
this.$emit('click', evt)
168+
}
169+
},
170+
render(h) {
171+
const {
172+
variant,
173+
disabled,
174+
square,
175+
icon,
176+
localSrc: src,
177+
text,
178+
fontSize,
179+
computedSize: size,
180+
button: isButton,
181+
buttonType: type
182+
} = this
183+
const isBLink = !isButton && (this.href || this.to)
143184
const tag = isButton ? BButton : isBLink ? BLink : 'span'
144-
const rounded = square ? false : props.rounded === '' ? true : props.rounded || 'circle'
145-
const size = computeSize(props.size)
146-
const alt = props.alt || null
147-
const ariaLabel = props.ariaLabel || null
185+
const rounded = square ? false : this.rounded === '' ? true : this.rounded || 'circle'
186+
const alt = this.alt || null
187+
const ariaLabel = this.ariaLabel || null
148188

149189
let $content = null
150-
if (children) {
190+
if (this.hasNormalizedSlot('default')) {
151191
// Default slot overrides props
152-
$content = children
192+
$content = this.normalizeSlot('default')
193+
} else if (src) {
194+
$content = h('img', { attrs: { src, alt }, on: { error: this.onImgError } })
153195
} else if (icon) {
154196
$content = h(BIcon, {
155197
props: { icon },
156198
attrs: { 'aria-hidden': 'true', alt }
157199
})
158-
} else if (src) {
159-
$content = h('img', { attrs: { src, alt } })
160200
} else if (text) {
161-
const fontSize = size ? `calc(${size} * ${FONT_SIZE_SCALE})` : null
162201
$content = h('span', { style: { fontSize } }, text)
163202
} else {
164203
// Fallback default avatar content
@@ -179,9 +218,10 @@ export const BAvatar = /*#__PURE__*/ Vue.extend({
179218
},
180219
style: { width: size, height: size },
181220
attrs: { 'aria-label': ariaLabel },
182-
props: isButton ? { variant, disabled, type } : isBLink ? pluckProps(linkProps, props) : {}
221+
props: isButton ? { variant, disabled, type } : isBLink ? pluckProps(linkProps, this) : {},
222+
on: isBLink || isButton ? { click: this.onClick } : {}
183223
}
184224

185-
return h(tag, mergeData(data, componentData), [$content])
225+
return h(tag, componentData, [$content])
186226
}
187227
})

0 commit comments

Comments
 (0)
0