Permalink
Browse files

feat(dropdown): Add auto ID generation (#888)

* [dropdown] Auto ID client side

* Update dropdown.vue

* Update nav-item-dropdown.vue

* Update nav-item-dropdown.vue
  • Loading branch information...
tmorehouse committed Aug 20, 2017
1 parent fcff25d commit 25a20f2949a620bc7d2a062846a6d579eff8171b
Showing with 13 additions and 13 deletions.
  1. +8 −8 lib/components/dropdown.vue
  2. +5 −5 lib/components/nav-item-dropdown.vue
@@ -1,9 +1,9 @@
<template>
<div :id="id || null" :class="dropdownClasses">
<div :id="safeId()" :class="dropdownClasses">
<b-button :class="{'dropdown-toggle': !split}"
<b-button :id="safeId('_BV_button_')"
:class="{'dropdown-toggle': !split}"
ref="button"
:id="id ? (id + '__BV_button_') : null"
:aria-haspopup="split ? null : 'true'"
:aria-expanded="split ? null : (visible ? 'true' : 'false')"
:variant="variant"
@@ -14,10 +14,10 @@
<slot name="button-content"><slot name="text">{{text}}</slot></slot>
</b-button>
<b-button :class="['dropdown-toggle','dropdown-toggle-split']"
<b-button :id="safeId('_BV_toggle_')"
:class="['dropdown-toggle','dropdown-toggle-split']"
v-if="split"
ref="toggle"
:id="id ? (id + '__BV_toggle_') : null"
:aria-haspopup="split ? 'true' : null"
:aria-expanded="split ? (visible ? 'true' : 'false') : null"
:variant="variant"
@@ -31,7 +31,7 @@
<div :class="menuClasses"
ref="menu"
role="menu"
:aria-labelledby="id ? (id + (split ? '__BV_toggle_' : '__BV_button_')) : null"
:aria-labelledby="safeId(split ? '_BV_toggle_' : '_BV_button_')"
@mouseover="onMouseOver"
@keyup.esc="onEsc"
@keydown.tab="onTab"
@@ -45,11 +45,11 @@
</template>
<script>
import { dropdownMixin } from '../mixins';
import { idMixin, dropdownMixin } from '../mixins';
import bButton from './button';
export default {
mixins: [dropdownMixin],
mixins: [idMixin, dropdownMixin],
components: {bButton},
props: {
split: {
@@ -1,10 +1,10 @@
<template>
<li :id="id || null" :class="dropdownClasses">
<li :id="safewId()" :class="dropdownClasses">
<a :class="['nav-link', dropdownToggle, {disabled}]"
href="#"
ref="button"
:id="id ? (id + '__BV_button_') : null"
:id="safeId('_BV_button_')"
aria-haspopup="true"
:aria-expanded="visible ? 'true' : 'false'"
:disabled="disabled"
@@ -18,7 +18,7 @@
<div :class="menuClasses"
role="menu"
ref="menu"
:aria-labelledby="id ? (id + '__BV_button_') : null"
:aria-labelledby="safeId('_BV_button_')"
@mouseover="onMouseOver"
@keyup.esc="onEsc"
@keydown.tab="onTab"
@@ -32,10 +32,10 @@
</template>
<script>
import { dropdownMixin } from '../mixins';
import { idMixin, dropdownMixin } from '../mixins';
export default {
mixins: [dropdownMixin],
mixins: [idMixin, dropdownMixin],
computed: {
dropdownToggle() {
return this.noCaret ? '' : 'dropdown-toggle';

0 comments on commit 25a20f2

Please sign in to comment.