8000 feat(b-navbar-toggle): add `disabled` prop (#5397) · bootstrap-vue/bootstrap-vue@0b7082b · GitHub
[go: up one dir, main page]
Skip to content

Commit 0b7082b

Browse files
tmorehousetmorehouse
authored
feat(b-navbar-toggle): add disabled prop (#5397)
Co-authored-by: Jacob Müller
1 parent a1543b2 commit 0b7082b

File tree

3 files changed

+40
-5
lines changed

3 files changed

+40
-5
lines changed

‎src/components/navbar/navbar-toggle.js

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,10 @@ export const BNavbarToggle = /*#__PURE__*/ Vue.extend({
2323
target: {
2424
type: String,
2525
required: true
26+
},
27+
disabled: {
28+
type: Boolean,
29+
default: false
2630
}
2731
},
2832
data() {
@@ -36,8 +40,10 @@ export const BNavbarToggle = /*#__PURE__*/ Vue.extend({
3640
},
3741
methods: {
3842
onClick(evt) {
39-
// Emit courtesy `click` event
40-
this.$emit('click', evt)
43+
if (!this.disabled) {
44+
// Emit courtesy `click` event
45+
this.$emit('click', evt)
46+
}
4147
},
4248
handleStateEvt(id, state) {
4349
// We listen for state events so that we can pass the
@@ -48,17 +54,23 @@ export const BNavbarToggle = /*#__PURE__*/ Vue.extend({
4854
}
4955
},
5056
render(h) {
51-
const expanded = this.toggleState
57+
const { disabled } = this
58+
5259
return h(
5360
'button',
5461
{
5562
staticClass: CLASS_NAME,
63+
class: { disabled },
5664
directives: [{ name: 'BToggle', value: this.target }],
57-
attrs: { type: 'button', 'aria-label': this.label },
65+
attrs: {
66+
type: 'button',
67+
disabled,
68+
'aria-label': this.label
69+
},
5870
on: { click: this.onClick }
5971
},
6072
[
61-
this.normalizeSlot('default', { expanded }) ||
73+
this.normalizeSlot('default', { expanded: this.toggleState }) ||
6274
h('span', { staticClass: `${CLASS_NAME}-icon` })
6375
]
6476
)

‎src/components/navbar/navbar-toggle.spec.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -159,4 +159,22 @@ describe('navbar-toggle', () => {
159159

160160
wrapper.destroy()
161161
})
162+
163+
it('disabled prop works', async () => {
164+
const wrapper = mount(BNavbarToggle, {
165+
propsData: {
166+
target: 'target-9',
167+
disabled: true
168+
}
169+
})
170+
171+
expect(wrapper.emitted('click')).not.toBeDefined()
172+
expect(wrapper.element.hasAttribute('disabled')).toBe(true)
173+
expect(wrapper.classes()).toContain('disabled')
174+
175+
await wrapper.trigger('click')
176+
expect(wrapper.emitted('click')).not.toBeDefined()
177+
178+
wrapper.destroy()
179+
})
162180
})

‎src/components/navbar/package.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,11 @@
7878
"prop": "label",
7979
"settings": true,
8080
"description": "String to place in the toggle's 'aria-label' attribute"
81+
},
82+
{
83+
"prop": "disabled",
84+
"version": "2.15.0",
85+
"description": "When `true`, disables the navbar toggle button, and adds class `disabled` to the button"
8186
}
8287
],
8388
"events": [

0 commit comments

Comments
 (0)
0