Skip to content

Commit 0d3f745

Browse files
author
bootstrap-vue-bot
committed
v0.8.0
1 parent 66a5ab5 commit 0d3f745

20 files changed

+606
-342
lines changed

README.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ Please head to [Official Docs Website](https://bootstrap-vue.github.io) for setu
1818

1919
# Current included stable components
2020

21-
- [Alerts](https://bootstrap-vue.github.io/docs/components/alerts)
21+
- [Alerts](https://bootstrap-vue.github.io/docs/components/alerts) **New features**
2222
- [Breadcrumb](https://bootstrap-vue.github.io/docs/components/breadcrumb)
2323
- [Buttons](https://bootstrap-vue.github.io/docs/components/buttons)
2424
- [Button group](https://bootstrap-vue.github.io/docs/components/button-group)
@@ -28,10 +28,10 @@ Please head to [Official Docs Website](https://bootstrap-vue.github.io) for setu
2828
- [Form Checkbox](https://bootstrap-vue.github.io/docs/components/form-checkbox)
2929
- [Form Select](https://bootstrap-vue.github.io/docs/components/form-select)
3030
- [Nav](https://bootstrap-vue.github.io/docs/components/nav)
31-
- [NavBar](https://bootstrap-vue.github.io/docs/components/navbar)
31+
- [NavBar](https://bootstrap-vue.github.io/docs/components/navbar) **New features**
3232
- [Pagination](https://bootstrap-vue.github.io/docs/components/pagination)
33-
- [Popover](https://bootstrap-vue.github.io/docs/components/popover)
34-
- [Tables](https://bootstrap-vue.github.io/docs/components/tables) (with pagination and custom rendering support)
33+
- [Popover](https://bootstrap-vue.github.io/docs/components/popover) **New features**
34+
- [Tables](https://bootstrap-vue.github.io/docs/components/tables) **New features**
3535

3636
Additionally, [many more components](https://github.com/bootstrap-vue/bootstrap-vue/tree/master/components) are available, but they are still under development. If you really need to use them, feel free to experiment and submit pull requests to benefit other users of this package.
3737

components/alert.vue

Lines changed: 20 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
return !this.state || this.state === `default` ? `alert-success` : `alert-${this.state}`;
3030
},
3131
localShow() {
32-
return !this.dismissed && (this.show || this.countDownTimerId);
32+
return !this.dismissed && (this.countDownTimerId || this.show);
3333
}
3434
},
3535
props: {
@@ -41,46 +41,44 @@
4141
type: Boolean,
4242
default: false
4343
},
44-
dismissAfterSeconds: {
45-
type: Number,
46-
default: null
47-
},
4844
show: {
49-
type: Boolean,
45+
type: [Boolean, Number],
5046
default: false
5147
}
5248
},
5349
watch: {
5450
show() {
55-
this.dismissed = false;
56-
},
57-
dismissAfterSeconds() {
58-
this.dismissed = false;
59-
this.dismissCounter();
51+
this.showChanged();
6052
}
6153
},
6254
mounted() {
63-
if (this.dismissAfterSeconds) {
64-
this.dismissCounter();
65-
}
55+
this.showChanged();
6656
},
6757
methods: {
68-
clearCounter() {
69-
if (this.countDownTimerId) {
70-
clearInterval(this.countDownTimerId);
71-
}
72-
},
7358
dismiss() {
7459
this.dismissed = true;
7560
this.$emit('dismissed');
7661
this.clearCounter();
7762
},
78-
dismissCounter() {
79-
this.clearCounter();
63+
clearCounter() {
64+
if (this.countDownTimerId) {
65+
clearInterval(this.countDownTimerId);
66+
}
67+
},
68+
showChanged() {
69+
// Reset dismiss status
70+
this.dismissed = false;
8071
81-
let dismissCountDown = this.dismissAfterSeconds;
72+
// No timer for boolean values
73+
if (this.show === true || this.show === false || this.show === null) {
74+
return;
75+
}
76+
77+
let dismissCountDown = this.show;
8278
this.$emit('dismiss-count-down', dismissCountDown);
8379
80+
// Start counter
81+
this.clearCounter();
8482
this.countDownTimerId = setInterval(() => {
8583
if (dismissCountDown < 2) {
8684
return this.dismiss();

components/button.vue

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<template>
22
<button :class="classObject"
33
@click.stop.prevent="click"
4-
:href="to"
4+
:href="href || to"
55
:is="componentType"
6-
:to="to"
6+
:to="to || href"
77
:exact="exact"
88
>
99
<slot></slot>
@@ -25,7 +25,7 @@
2525
];
2626
},
2727
componentType() {
28-
return this.to ? 'router-link' : 'a';
28+
return this.href ? (this.$route ? 'router-link' : 'a') : 'button';
2929
},
3030
btnBlock() {
3131
return this.block ? `btn-block` : '';
@@ -69,6 +69,9 @@
6969
type: [String, Object],
7070
default: ''
7171
},
72+
href: {
73+
type: String
74+
},
7275
exact: {
7376
type: Boolean,
7477
default: false

components/form-fieldset.vue

Lines changed: 51 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,59 +1,65 @@
11
<template>
2-
<fieldset :class="['form-group','row',inputState]" v-if="enabled">
3-
<label :for="id" v-if="label" :class="['col-form-label',labelLayout]" v-html="label"/>
2+
<div :class="['form-group','row',inputState]" v-if="enabled">
3+
<label :for="for_id" v-if="label" :class="['col-form-label',labelLayout]" v-html="label"/>
44
<div :class="inputLayout">
5-
<slot :state="state"></slot>
5+
<slot></slot>
66
<div class="form-text text-muted" v-if="feedback" v-html="feedback"></div>
77
<small class="form-text text-muted" v-if="description" v-html="description"></small>
88
</div>
9-
</fieldset>
9+
</div>
1010
<div v-else>
1111
<slot></slot>
1212
</div>
1313
</template>
1414

1515
<script>
16-
export default {
17-
computed: {
18-
inputState() {
19-
return this.state ? `has-${this.state}` : '';
20-
},
21-
labelLayout() {
22-
return this.horizontal ? 'col-xs-2' : 'col-xs-12';
23-
},
24-
inputLayout() {
25-
return this.horizontal ? 'col-xs-10' : 'col-xs-12';
26-
}
27-
},
28-
props: {
29-
id: {
30-
type: String,
31-
default: null
32-
},
33-
state: {
34-
type: String,
35-
default: null
36-
},
37-
horizontal: {
38-
type: Boolean,
39-
default: false
40-
},
41-
enabled: {
42-
type: Boolean,
43-
default: true
44-
},
45-
label: {
46-
type: String,
47-
default: null
48-
},
49-
description: {
50-
type: String,
51-
default: null
16+
import {uniqueId} from '../utils/helpers';
17+
18+
export default {
19+
computed: {
20+
inputState() {
21+
return this.state ? `has-${this.state}` : '';
22+
},
23+
labelLayout() {
24+
return this.horizontal ? 'col-sm-' + this.labelSize : 'col-sm-12' + (12 - this.labelSize);
25+
},
26+
inputLayout() {
27+
return this.horizontal ? 'col-sm-' + (12 - this.labelSize) : 'col-sm-' + this.labelSize;
28+
},
5229
},
53-
feedback: {
54-
type: String,
55-
default: null
30+
props: {
31+
for_id: {
32+
type: String,
33+
default: uniqueId
34+
},
35+
state: {
36+
type: String,
37+
default: null
38+
},
39+
horizontal: {
40+
type: Boolean,
41+
default: false
42+
},
43+
labelSize: {
44+
type: Number,
45+
default: 3
46+
},
47+
enabled: {
48+
type: Boolean,
49+
default: true
50+
},
51+
label: {
52+
type: String,
53+
default: null
54+
},
55+
description: {
56+
type: String,
57+
default: null
58+
},
59+
feedback: {
60+
type: String,
61+
default: null
62+
}
5663
}
57-
}
58-
};
64+
};
5965
</script>

components/form-input.vue

Lines changed: 10 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@
22
<input
33
v-if="!textarea"
44
:type="type"
5-
:class="['form-control',stateIconType,inputSize]"
6-
:id="id"
5+
:class="['form-control',inputState,inputSize]"
76
:name="name"
7+
:id="$parent.for_id"
88
:placeholder="placeholder"
99
:value="value"
1010
@input="onInput($event.target.value)"
@@ -14,9 +14,9 @@
1414
<textarea
1515
v-else
1616
:type="type"
17-
:class="['form-control',stateIconType,inputSize]"
18-
:id="id"
17+
:class="['form-control',inputState,inputSize]"
1918
:name="name"
19+
:id="$parent.for_id"
2020
:placeholder="placeholder"
2121
:value="value"
2222
:rows="rows"
@@ -26,12 +26,11 @@
2626
</template>
2727

2828
<script>
29-
import {uniqueId} from '../utils/helpers';
30-
3129
export default {
3230
computed: {
33-
stateIconType() {
34-
return this.stateIcon ? `form-control-${this.state}` : '';
31+
inputState() {
32+
const state = this.state || this.$parent.state;
33+
return state ? `form-control-${state}` : '';
3534
},
3635
inputSize() {
3736
return this.size ? `form-control-${this.size}` : '';
@@ -68,10 +67,6 @@
6867
type: String,
6968
default: 'text'
7069
},
71-
id: {
72-
type: String,
73-
default: uniqueId
74-
},
7570
7671
name: {
7772
type: String,
@@ -97,9 +92,9 @@
9792
default: false
9893
},
9994
100-
stateIcon: {
101-
type: Boolean,
102-
default: true
95+
state: {
96+
type: String,
97+
default: null
10398
},
10499
formatter: {
105100
type: Function

components/form-radio.vue

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,11 @@
77
type="radio"
88
:id="item.id"
99
:name="name"
10-
:value="item.value"
10+
:value="item[valueKey]"
1111
:disabled="item.disabled"
1212
>
1313
<span class="custom-control-indicator"></span>
14-
<span class="custom-control-description">{{item.text}}</span>
14+
<span class="custom-control-description">{{item[textKey]}}</span>
1515
</label>
1616
</fieldset>
1717
</template>
@@ -35,6 +35,14 @@
3535
value: {
3636
default: null
3737
},
38+
valueKey: {
39+
type: String,
40+
default: 'value'
41+
},
42+
textKey: {
43+
type: String,
44+
default: 'text'
45+
},
3846
name: {
3947
type: String,
4048
default: uniqueId

components/form-select.vue

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<select :class="['custom-select',inputSize]"
2+
<select :class="['form-control','custom-select',inputSize]"
33
v-model="selected"
44
:options="allOptions"
55
:disabled="disabled"
@@ -36,9 +36,6 @@
3636
}
3737
return this.options;
3838
},
39-
inputState() {
40-
return this.state ? `has-${this.state}` : null;
41-
},
4239
inputSize() {
4340
return this.size ? `form-control-${this.size}` : null;
4441
}

0 commit comments

Comments
 (0)