fix(navbar): Support always expanded navbar (fixes #2209) (#2210)

* fix(navbar): Support always expanded navbar (fixes #2209)

Support always expanded navbar by setting prop `toggleable` to `false`

To set a breakpoint where collapsing happens, set `toggleable` to the breakpoint (`sm|md|lg|xl`)

Fixes #2209

* Update README.md

* Rename navbar.spec.js to navbar-dropdown.spec.js

Author: tmorehouse

src/components/navbar/README.md

@@ -260,7 +260,7 @@ Input groups work as well:
 ```
 
 ### `<b-navbar-toggle>` and `<b-collapse is-nav>`
-Navbars are responsive by default, but you can easily modify them to change that. Responsive
+Navbars are not responsive by default, but you can easily modify them to change that. Responsive
 behavior depends on our `<b-collapse>` component.
 
 Wrap `<b-navbar-nav>` components in a `<b-collapse is-nav>` (**remember to set the `is-nav`
@@ -271,9 +271,9 @@ Use the `<b-navbar-toggle>` component to control the collapse component, and set
 `target` prop of `<b-navbar-toggle>` to the `id` of `<b-collapse>`.
 
 Set the `toggleable` prop on `<b-navbar>` to the desired breakpoint you would like content
-to automatically collapse at. Possible `toggleable`values are `sm`, `md`, and `lg`. Setting
-`toggleable` to `true` (or with no explicit value) will set the breakpoint to `sm`, while
-setting it to `false` will disable collapsing.
+to automatically expand at. Possible `toggleable` values are `sm`, `md`, `lg` and `xl`. Setting
+`toggleable` to `true` (or with no explicit value) will set the navbar to be always collapsed, while
+setting it to `false` (the default) will disable collapsing (always expanded).
 
 `<b-navbar-toggle>` components are left-aligned by default, but should they follow a sibling
 element like `<b-navbar-brand>`, they’ll automatically be aligned to the far right. Reversing
@@ -283,6 +283,10 @@ See the first example on this page for reference, and also refer to
 [`<b-collapse>`](/docs/components/collapse) for details on the collapse component.
 
 
+## Printing
+Navbars are hidden by deafult when printing. Force them to be printed by setting the `print` prop.
+
+
 ## See also
 Also see [`<b-nav>`](/docs/components/nav) for additional components and sub-component aliases.
 

src/components/navbar/navbar.spec.js renamed to src/components/navbar/navbar-dropdown.spec.js

@@ -16,35 +16,43 @@ export const props = {
     type: [Boolean, String],
     default: false
   },
-  toggleBreakpoint: {
-    // Deprecated.  Set toggleable to a string breakpoint
-    type: String,
-    default: null
-  },
   fixed: {
     type: String
   },
   sticky: {
     type: Boolean,
     default: false
+  },
+  print: {
+    type: Boolean,
+    default: false
   }
 }
 
 export default {
   functional: true,
   props,
   render (h, { props, data, children }) {
-    let breakpoint = props.toggleBreakpoint || (props.toggleable === true ? 'sm' : props.toggleable) || 'sm'
+    let breakpoint = ''
+    if (props.toggleable && typeof props.toggleable === 'string' && props.toggleable !== 'xs') {
+      breakpoint = `navbar-expand-${props.toggleable}`
+    } else if (props.toggleable === false) {
+      breakpoint = 'navbar-expand'
+    }
     return h(
       props.tag,
       mergeData(data, {
         staticClass: 'navbar',
         class: {
+          'd-print': props.print,
+          'sticky-top': props.sticky,
           [`navbar-${props.type}`]: Boolean(props.type),
           [`bg-${props.variant}`]: Boolean(props.variant),
           [`fixed-${props.fixed}`]: Boolean(props.fixed),
-          'sticky-top': props.sticky,
-          [`navbar-expand-${breakpoint}`]: props.toggleable !== false
+          [`${breakpoint}`]: Boolean(breakpoint)
+        },
+        attrs: {
+          role: props.tag === 'nav' ? null : 'navigation'
         }
       }),
       children