chore: release 2.0.0 stable

docs/assets/scss/styles.scss

@@ -103,6 +103,15 @@
     margin-top: 1rem;
   }
 
+  > h2,
+  > h3,
+  > h4 {
+    &[id]:before {
+      height: 1rem;
+      margin-top: -1rem;
+    }
+  }
+
   > h4,
   > h5 {
     margin-top: 1rem;

docs/components/componentdoc.vue

@@ -50,16 +50,16 @@
         bordered
         striped
       >
-        <template slot="[prop]" slot-scope="{ value, item }">
+        <template v-slot:cell(prop)="{ value, item }">
           <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
           <b-badge v-if="item.required" variant="info">Required</b-badge>
           <b-badge v-else-if="item.deprecated" variant="danger">Deprecated</b-badge>
           <b-badge v-else-if="item.deprecation" variant="warning">Deprecation</b-badge>
         </template>
-        <template slot="[defaultValue]" slot-scope="{ value }">
+        <template v-slot:cell(defaultValue)="{ value }">
           <code v-if="value" class="notranslate" translate="no">{{ value }}</code>
         </template>
-        <template slot="row-details" slot-scope="{ item }">
+        <template v-slot:row-details="{ item }">
           <p v-if="typeof item.deprecated === 'string'" class="mb-1 small">
             {{ item.deprecated }}
           </p>
@@ -82,10 +82,10 @@
           bordered
           striped
         >
-          <template slot="[prop]" slot-scope="{ value }">
+          <template v-slot:cell(prop)="{ value }">
             <code class="notranslate" translate="no">{{ kebabCase(value) }}</code>
           </template>
-          <template slot="[event]" slot-scope="{ value }">
+          <template v-slot:cell(event)="{ value }">
             <code class="notranslate" translate="no">{{ value }}</code>
           </template>
         </b-table>
@@ -105,7 +105,7 @@
         bordered
         striped
       >
-        <template slot="[name]" slot-scope="{ value }">
+        <template v-slot:cell(name)="{ value }">
           <code class="text-nowrap nostranslate" translate="no">{{ value }}</code>
         </template>
       </b-table>
@@ -124,10 +124,10 @@
         bordered
         striped
       >
-        <template slot="[event]" slot-scope="{ value }">
+        <template v-slot:cell(event)="{ value }">
           <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
         </template>
-        <template slot="[args]" slot-scope="{ value, item }">
+        <template v-slot:cell(args)="{ value, item }">
           <p
             v-for="arg in value"
             :key="`event-${item.event}-${arg.arg ? arg.arg : 'none'}`"
@@ -159,10 +159,10 @@
         bordered
         striped
       >
-        <template slot="[event]" slot-scope="{ value }">
+        <template v-slot:cell(event)="{ value }">
           <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
         </template>
-        <template slot="[args]" slot-scope="{ value, item }">
+        <template v-slot:cell(args)="{ value, item }">
           <p
             v-for="arg in value"
             :key="`event-${item.event}-${arg.arg ? arg.arg : 'none'}`"

docs/components/importdoc.vue

@@ -10,8 +10,8 @@
         </anchored-heading>
 
         <p>
-          <b-badge variant="info" class="small">CHANGED in 2.0.0-rc.22</b-badge> You can
-          import individual components into your project via the following named exports:
+          You can import individual components into your project via the following named
+          exports:
         </p>
 
         <b-table
@@ -22,13 +22,13 @@
           bordered
           striped
         >
-          <template slot="[component]" slot-scope="{ value }">
+          <template v-slot:cell(component)="{ value }">
             <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
           </template>
-          <template slot="[namedExport]" slot-scope="{ value }">
+          <template v-slot:cell(namedExport)="{ value }">
             <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
           </template>
-          <template slot="[importPath]" slot-scope="{ value }">
+          <template v-slot:cell(importPath)="{ value }">
             <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
           </template>
         </b-table>
@@ -45,8 +45,8 @@
         </anchored-heading>
 
         <p>
-          <b-badge variant="info" class="small">CHANGED in 2.0.0-rc.22 </b-badge> You can
-          import individual directives into your project via the following named exports:
+          You can import individual directives into your project via the following named
+          exports:
         </p>
 
         <b-table
@@ -57,13 +57,13 @@
           bordered
           striped
         >
-          <template slot="[directive]" slot-scope="{ value }">
+          <template v-slot:cell(directive)="{ value }">
             <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
           </template>
-          <template slot="[namedExport]" slot-scope="{ value }">
+          <template v-slot:cell(namedExport)="{ value }">
             <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
           </template>
-          <template slot="[importPath]" slot-scope="{ value }">
+          <template v-slot:cell(importPath)="{ value }">
             <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
           </template>
         </b-table>
@@ -78,11 +78,6 @@
         Importing as a Vue.js plugin
       </anchored-heading>
 
-      <p>
-        <b-badge variant="info" class="small">CHANGED in 2.0.0-rc.22</b-badge> Importing plugins
-        has been simplified.
-      </p>
-
       <p v-if="isComponentRoute">
         This plugin includes all of the above listed individual
         components<span v-if="directives.length"> and directives</span>.
@@ -102,10 +97,10 @@
         bordered
         striped
       >
-        <template slot="[namedExport]" slot-scope="{ value }">
+        <template v-slot:cell(namedExport)="{ value }">
           <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
         </template>
-        <template slot="[importPath]" slot-scope="{ value }">
+        <template v-slot:cell(importPath)="{ value }">
           <code class="text-nowrap notranslate" translate="no">{{ value }}</code>
         </template>
       </b-table>
@@ -122,19 +117,6 @@
       <p><strong>Example:</strong></p>
       <pre class="hljs language-js text-monospace p-2 notranslate" translate="no">{{ pluginImportCode }}</pre>
     </article>
-
-    <aside class="alert alert-warning my-4">
-      <p class="mb-0">
-        <b-badge variant="warning" tag="strong">Deprecation Warning as of v2.0.0-rc.22:</b-badge>
-        Importing components, directives and plugins from
-        <code class="notranslate" translate="no">bootstrap-vue/es/*</code>
-        has been deprecated. All components, directives and plugins are now available as top-level named
-        exports in the <code class="notranslate" translate="no">ESM</code> and
-        <code class="notranslate" translate="no">CommonJS</code> builds. The
-        <code class="notranslate" translate="no">es/</code> directory build will be removed in a future
-        release.
-      </p>
-    </aside>
   </section>
 </template>
 
@@ -144,6 +126,8 @@ import kebabCase from 'lodash/kebabCase'
 import startCase from 'lodash/startCase'
 import AnchoredHeading from './anchored-heading'
 
+const importPath = 'bootstrap-vue'
+
 export default {
   name: 'BDVImportdoc',
   components: { AnchoredHeading },
@@ -212,9 +196,8 @@ export default {
     },
     directiveImportCode() {
       const firstDirective = this.directives[0]
-      const firstDirectiveImport = this.directiveImports[0]
       return [
-        `import { ${firstDirective} } from '${firstDirectiveImport.importPath}'`,
+        `import { ${firstDirective} } from '${importPath}'`,
         "// Note: Vue automatically prefixes the directive name with 'v-'",
         `Vue.directive('${this.directiveName(firstDirective)}', ${firstDirective})`
       ].join('\n')

docs/markdown/intro/README.md

@@ -193,8 +193,6 @@ Guide for full details on setting up aliases for [webpack](https://webpack.js.or
 
 ## Tree shaking with module bundlers
 
-<span class="badge badge-info small">SIMPLIFIED in 2.0.0-rc.20</span>
-
 When using a module bundler you can optionally import only specific components groups (plugins),
 components and/or directives.
 
@@ -208,8 +206,6 @@ components and/or directives.
 
 ### Component groups and directives as Vue plugins
 
-<span class="badge badge-info small">CHANGED in 2.0.0-rc.22</span>
-
 You can import component groups and directives as Vue plugins by importing from the `bootstrap-vue`:
 
 <!-- eslint-disable import/first, import/no-duplicates -->
@@ -256,8 +252,6 @@ single `import` statement for optimal tree shaking.
 
 ### Individual components and directives
 
-<span class="badge badge-info small">CHANGED in 2.0.0-rc.22</span>
-
 If you would like to only pull in a specific component or set of components, you can do this by
 directly importing those components.
 
@@ -304,8 +298,6 @@ object property shorthand (components only).
 
 ### Using BootstrapVue source code for smaller bundles
 
-<span class="badge badge-info small">For advanced users</span>
-
 When using module bundlers, they will usually default to using the `esm/` modular build, which has
 been pre-transpiled by Babel for our
 [supported browsers](https://github.com/bootstrap-vue/bootstrap-vue/blob/master/.browserslistrc).
@@ -439,14 +431,11 @@ import 'custom.scss'
 
 ### `transformAssetUrls` with Nuxt.js
 
-<span class="badge badge-info small">NEW in v2.0.0-rc.22</span> The BootstrapVue Nuxt plugin module
-will automatically add in the BootstrapVue specific [`transformAssetUrls`](/docs/reference/images)
-image `src` prop configuration for you.
+The BootstrapVue Nuxt plugin module will automatically add in the BootstrapVue specific
+[`transformAssetUrls`](/docs/reference/images) image `src` prop configuration for you.
 
 ### Tree shaking with Nuxt.js
 
-<span class="badge badge-info small">ENHANCED in 2.0.0-rc.20</span>
-
 If you wish to reduce your production bundle size because you only use a subset of the available
 BootstrapVue plugins, you can configure the list of BootstrapVue `componentPlugins` or
 `directivePlugins` you want to globally install in your Nuxt.js project.
@@ -469,18 +458,17 @@ module.exports = {
 }
 ```
 
-<span class="badge badge-info small">NEW in 2.0.0-rc.20</span> There are two additional helper
-plugins for providing the `$bvModal` and `$bvToast` injections (if you are not using the
-`ModalPlugin` or `ToastPlugin` plugins) that are available in the `componentPlugins` option:
+There are two additional helper plugins for providing the `$bvModal` and `$bvToast` injections (if
+you are not using the `ModalPlugin` or `ToastPlugin` plugins) that are available in the
+`componentPlugins` option:
 
 - `BVModalPlugin` - provides the injection `$bvModal` for generating
   [message boxes](/docs/components/modal#modal-message-boxes).
 - `BVToastPlugin` - provides the injection `$bvToast` for generating
   [on demand toasts](/docs/components/toast#toasts-on-demand).
 
-<span class="badge badge-info small">NEW in 2.0.0-rc.20</span> You can also optionally import
-individual components and/or directives, by configuring the list of BootstrapVue `components` or
-`directives` you want to globally install in your Nuxt.js project.
+You can also optionally import individual components and/or directives, by configuring the list of
+BootstrapVue `components` or `directives` you want to globally install in your Nuxt.js project.
 
 ```js
 module.exports = {
@@ -540,37 +528,6 @@ pre-transpiled versions, while setting it to `false` will always use `src/`. By
 `usePretranspiled` is enabled in development mode only. You should not need to use this option as
 the default is most optimal for performance.
 
-## Vue CLI 2
-
-<span class="badge badge-warning small">DEPRECATED</span> Use [Vue CLI 3](#vue-cli-3) instead.
-
-BootstrapVue has two Vue CLI templates available:
-
-- [webpack-simple](https://github.com/bootstrap-vue/webpack-simple): Quick scaffold for a proof of
-  concept or small app
-- [webpack](https://github.com/bootstrap-vue/webpack): Larger, production ready template with more
-  options
-
-```bash
-# Ensure Vue CLI is installed and up to date
-npm install -g vue-cli
-
-# Initialize a BootstrapVue project in the directory 'my-project'
-vue init bootstrap-vue/webpack-simple my-project
-
-# Change into the directory
-cd my-project
-
-# Install dependencies
-npm install
-
-# Fire up the dev server with HMR
-npm run dev
-```
-
-You can repeat the commands above replacing `bootstrap-vue/webpack-simple` with
-`bootstrap-vue/webpack` for the webpack template.
-
 ## Vue CLI 3
 
 Unlike V2, Vue CLI 3 doesn't use templates.
@@ -748,5 +705,3 @@ above for an example.
 If you are using [VS Code](https://code.visualstudio.com/) as your text editor, BootstrapVue has
 intellisense autocompletion for component attributes available when using the
 [Vetur extension](https://marketplace.visualstudio.com/items?itemName=octref.vetur).
-
-[Twitter: Vetur + BootstrapVue](https://twitter.com/AlexSashaRegan/status/912769997776158723)

docs/markdown/misc/settings/README.md

@@ -1,7 +1,5 @@
 # Settings
 
-<span class="badge badge-info small">NEW in 2.0.0-rc.16</span>
-
 > BootstrapVue provides a few options for customizing component default values, and more.
 
 ## Configuring defaults
@@ -22,16 +20,12 @@ stored under the `formControls` property, while component specific defaults are
 defined in the default configuration can be overridden. Attempting to set a config property that is
 not defined in the default will generate a console warning.
 
-The `formControls` entry was introduced in <span class="badge badge-info small">v2.0.0-rc.28</span>.
-
 ```json
 {{ defaultConfig }}
 ```
 
 ### Setting new configuration values
 
-<span class="badge badge-info small">ENHANCED in v2.0.0-rc.22</span>
-
 When you `Vue.use(BootstrapVue)`, you can optionally pass a configuration object which specifies new
 values to replace the default values. For example if you wish to define new breakpoint names (which
 will generate appropriate properties on components such as `<b-col>` and `<b-form-group>`), so that

docs/markdown/reference/accessibility/meta.json

@@ -1,5 +1,4 @@
 {
   "title": "Accessibility",
-  "description": "A brief overview of BootstrapVue's features and limitations for the creation of accessible content.",
-  "new": true
+  "description": "A brief overview of BootstrapVue's features and limitations for the creation of accessible content."
 }

docs/markdown/reference/images/README.md

@@ -72,7 +72,7 @@ module.exports = {
       .use('vue-loader')
       .loader('vue-loader')
       .tap(options => {
-        options['transformAssetUrls'] = {
+        options.transformAssetUrls = {
           img: 'src',
           image: 'xlink:href',
           'b-img': 'src',
@@ -117,9 +117,8 @@ module.exports = {
 }
 ```
 
-<span class="badge badge-info small">NEW in v2.0.0-rc.22</span> If using the
-[BootstrapVue Nuxt](/docs#nuxtjs-module) module with Nuxt.js, the plugin module will automatically
-add in the BootstrapVue specific `transformAssetUrls` configuration for you.
+If using the [BootstrapVue Nuxt](/docs#nuxtjs-module) module with Nuxt.js, the plugin module will
+automatically add in the BootstrapVue specific `transformAssetUrls` configuration for you.
 
 ## Using `require` to resolve image paths