Merge branch 'dev'

JDurman · Mar 29, 2021 · 321d737 · 321d737
2 parents 836c974 + 5ab5996
commit 321d737
Show file tree

Hide file tree

Showing 192 changed files with 2,066 additions and 1,032 deletions.
diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml
@@ -1,5 +1,4 @@
 # These are supported funding model platforms
 
 github: jtommy
-patreon: jtommy
-liberapay: jtommy
+custom: https://www.paypal.me/wtommasi
diff --git a/.github/ISSUE_TEMPLATE/BUG_REPORT.md b/.github/ISSUE_TEMPLATE/BUG_REPORT.md
@@ -1,7 +1,7 @@
 ---
 name: Bug report
 about: Create a report to help us improve Buefy
-labels: 
+labels:
 ---
 
 <!-- PLEASE READ THE FOLLOWING INSTRUCTIONS -->
@@ -10,7 +10,7 @@ labels:
 - Try to search for your issue, it may have already been answered or even fixed in the development version.
 - Check if the issue is reproducible with the latest stable version of Buefy.
 - It is **required** that you clearly describe the steps necessary to reproduce the issue.
-- It is recommended that you make a screenshots/animated GIFs/JSFiddle/JSBin/Codepen to demonstrate your issue. If possible, please use this [CodeSandbox template](https://codesandbox.io/s/buefy-template-1hmvy?file=/src/App.vue) to reproduce the problem.
+- It is recommended that you make a screenshots/animated GIFs/JSFiddle/JSBin/Codepen to demonstrate your issue. If possible, please use this [CodePen template](https://codepen.io/service-paradis/pen/KKgJZOK) to reproduce the problem.
 - If your issue is resolved but still open, don’t hesitate to close it. In case you found a solution by yourself, it could be helpful to explain how you fixed it.
 - Use English for communication
 -->
@@ -40,4 +40,4 @@ labels:
 ### Actual behavior
 
 <!--What actually happened-->
-<!--If possible, please use this [CodeSandbox template](https://codesandbox.io/s/buefy-template-1hmvy?file=/src/App.vue) to reproduce the problem.-->
+<!--If possible, please use this [CodePen template](https://codepen.io/service-paradis/pen/KKgJZOK) to reproduce the problem.-->
diff --git a/BACKERS.md b/BACKERS.md
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,57 @@
 # Buefy Changelog
 
+## 0.9.5
+
+### New features
+
+* Shipped with Bulma 0.9.2
+* Add ``rounded`` prop to Upload (thanks @major-mayer)
+* Add ``icon-right-type`` prop to Input (thanks @Propaganistas)
+* Add ``icon-right`` prop to Datepicker (thanks @darotar)
+* Add ``cancel-text`` prop to Snackbar (thanks @adamgreenhall)
+* Add ``indefinite`` prop to Toast (thanks @service-paradis)
+* Automatically select hovered option on blur for Autocomplete (thanks @fabiofdsantos)
+* Add ``aria-label`` prop to Modal (thanks @crowdcow-shae)
+* Add ``alt`` attribute to placeholder image (thanks @chazmcgarvey )
+* Add ``caption`` slot to Image (thanks @chazmcgarvey )
+* Add ``defaultSwitchRounded`` default configuration option (thanks @service-paradis)
+* Add ``detail-transition`` prop to Table (thanks @service-paradis)
+* Accept Date as values for Select (thanks @service-paradis)
+* Display events on unselectable Datepicker cell (thanks @service-paradis)
+* Add ``aria-minus-label`` and ``aria-plus-label`` functions for ``b-numberinput`` (thanks @service-paradis)
+* Add ``th-attrs`` and ``td-attrs`` functions for ``b-table``
+* Improve a11y on tab component (thanks @service-paradis)
+
+### Fixes
+
+* Fix #2678: tab navigation with ``boxed`` navbar dropdown (thanks @yuwu9145)
+* Fix #2848: incorrect inset shadow for ``b-radio-button`` (thanks @service-paradis)
+* Fix #2879: open DatetimePicker using the enter key (thanks @service-paradis)
+* Fix #2990: table sorting on multiple column (thanks @yuwu9145)
+* Fix #2994: table striped style with sticky columns (thanks @service-paradis)
+* Fix #3011: blur events for ClockPicker (thanks @yuwu9145)
+* Fix #3022: use aria labels on table pagination buttons (thanks @service-paradis)
+* Fix #3028: use aria labels on pagination next/previous buttons (thanks @service-paradis)
+* Fix #3035: autocomplete default content width in modal
+* Fix #3040: fix mutation of value in multiple dropdown (thanks @VictorCazanave)
+* Fix #3056: reset time on carousel when using arrows (thanks @harryJst)
+* Fix #3104: ``defaultDialogConfirmText`` not working
+* Fix #3107: keyboard usage with Datepicker date range (thanks @service-paradis)
+* Fix #3109: handle number values as expected for NumberInput (thanks @yuwu9145)
+* Fix #3113: dropdown with ``append-to-body`` ``z-index`` when inactive (thanks @Dragoncall)
+* Fix #3119: duplicated ``hovered`` event with Autocomplete (thanks @fabiofdsantos)
+* Fix #3124: restore tree shaking functionnality with default config (thanks @MartinodF)
+* Fix #3135: multiple ``fixed`` Navbar on the same page (thanks @fabiofdsantos)
+* Fix #3161: display close button when Modal is displayed at start (thanks @aglio)
+* Fix #3168: wrong DatetimePicker behavior with empty value
+* Fix #3177: navigate to Datepicker footer using Tab (thanks @service-paradis)
+* Fix #3195: Tooltip ``auto-close`` with ``inside`` and ``outside`` (thanks @elC0mpa)
+* Fix #3216: unexpected form submit on enter in Autocomplete
+* Fix #3226: reactive Datepicker dates when using ``multiple`` (thanks @service-paradis)
+* Fix #3235: emit event on Table listeners (thanks @service-paradis)
+* Fix #3247: Remove extraneous a element in tag (thanks @service-paradis)
+
+
 ## 0.9.4
 
 ### New features

diff --git a/README.md b/README.md
@@ -65,7 +65,7 @@ Vue.use(Input)
 ### 3 Include Material Design Icons
 
 ```html
-<link rel="stylesheet" href="//cdn.materialdesignicons.com/2.0.46/css/materialdesignicons.min.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/[email protected]/css/materialdesignicons.min.css">
 ```
 
 If you want to customize the icons or the theme, refer to the [customization section on the documentation](https://buefy.org/documentation/customization).

diff --git a/docs/assets/expo/foe-tools.png b/docs/assets/expo/foe-tools.png
diff --git a/docs/assets/scss/_variables.scss b/docs/assets/scss/_variables.scss
@@ -5,7 +5,6 @@ $primary-dark: findLightColor(#7957d5);
 $primary-light: findDarkColor(#7957d5);
 $twitter: #4099FF;
 $discord: #7289DA;
-$patreon: #f96854;
 $bulma: #00D1B2;
 $vuetelemetry: #0bdca0;
 
@@ -23,7 +22,6 @@ $colors: (
     "link": ($link, $link-invert, $link-light, $link-dark),
     "twitter": ($twitter, $white, findLightColor($twitter), findDarkColor($twitter)),
     "discord": ($discord, $white, findLightColor($discord), findDarkColor($discord)),
-    "patreon": ($patreon, $white, findLightColor($patreon), findDarkColor($patreon)),
     "bulma": ($bulma, $white, findLightColor($bulma), findDarkColor($bulma)),
     "vuetelemetry": ($vuetelemetry, $white, findLightColor($vuetelemetry), findDarkColor($vuetelemetry))
 );

diff --git a/docs/components/CodeView.vue b/docs/components/CodeView.vue
@@ -3,13 +3,17 @@
         <div v-if="title" class="codeview-title">{{ title }}</div>
         <figure class="highlight" :class="figureClasses">
             <div class="button-container">
-                <button class="button is-text is-small copy-code">Copy</button>
-                <button
+                <b-button
+                    type="is-text"
+                    size="is-small"
+                    class="copy-code"
+                    label="Copy" />
+                <b-button
                     v-if="!expanded"
-                    class="button is-text is-small"
-                    @click="isExpanded = false">
-                    Hide
-                </button>
+                    type="is-text"
+                    size="is-small"
+                    label="Hide"
+                    @click="isExpanded = false" />
             </div>
             <pre v-highlight><code :class="lang">{{ code }}</code></pre>
             <button

diff --git a/docs/components/CodepenEdit.vue b/docs/components/CodepenEdit.vue
@@ -5,10 +5,12 @@
         action="https://codepen.io/pen/define/"
         target="_blank"
         rel="noopener">
-        <button class="button is-text is-small">
-            <span>CodePen</span>
-            <b-icon icon="open-in-new" size="is-small"/>
-        </button>
+        <b-button
+            label="CodePen"
+            type="is-text"
+            size="is-small"
+            icon-right="open-in-new"
+            native-type="submit"/>
 
         <input
             type="hidden"
@@ -34,7 +36,7 @@ export default {
             ],
             externalStyles: [
                 'https://unpkg.com/buefy/dist/buefy.min.css',
-                'https://cdn.materialdesignicons.com/2.0.46/css/materialdesignicons.min.css'
+                'https://cdn.jsdelivr.net/npm/@mdi/[email protected]/css/materialdesignicons.min.css'
             ]
         }
     },

diff --git a/docs/components/TheFooter.vue b/docs/components/TheFooter.vue
@@ -21,15 +21,6 @@
                                     <span>GitHub</span>
                                 </a>
                             </p>
-                            <p class="control">
-                                <a
-                                    class="button is-patreon"
-                                    href="https://www.patreon.com/jtommy"
-                                    target="_blank">
-                                    <b-icon icon="patreon"/>
-                                    <span>Patreon</span>
-                                </a>
-                            </p>
                             <p class="control">
                                 <a
                                     class="button is-twitter"

diff --git a/docs/data/expo.json b/docs/data/expo.json
@@ -163,12 +163,6 @@
         "url": "https://travelstop.com",
         "featured": true
     },
-    {
-        "title": "FOE Tools",
-        "date": "2019-05-24",
-        "img": "foe-tools.png",
-        "url": "https://foe-tools.github.io"
-    },
     {
         "title": "Brand Finance",
         "date": "2019-05-24",

diff --git a/docs/pages/components/autocomplete/examples/ExFooter.vue b/docs/pages/components/autocomplete/examples/ExFooter.vue
@@ -8,12 +8,12 @@
                 :data="filteredDataArray"
                 placeholder="e.g. Orange"
                 @select="option => selected = option">
-                <template slot="footer">
+                <template #footer>
                     <a @click="showAddFruit">
                         <span> Add new... </span>
-                    </a> 
+                    </a>
                 </template>
-                <template slot="empty">No results for {{name}}</template>
+                <template #empty>No results for {{name}}</template>
             </b-autocomplete>
         </b-field>
     </section>

diff --git a/docs/pages/components/autocomplete/examples/ExHeader.vue b/docs/pages/components/autocomplete/examples/ExHeader.vue
@@ -8,12 +8,12 @@
                 :data="filteredDataArray"
                 placeholder="e.g. Orange"
                 @select="option => selected = option">
-                <template slot="header">
+                <template #header>
                     <a @click="showAddFruit">
                         <span> Add new... </span>
-                    </a> 
+                    </a>
                 </template>
-                <template slot="empty">No results for {{name}}</template>
+                <template #empty>No results for {{name}}</template>
             </b-autocomplete>
         </b-field>
     </section>

diff --git a/docs/pages/components/autocomplete/examples/ExInfiniteScroll.vue b/docs/pages/components/autocomplete/examples/ExInfiniteScroll.vue
@@ -27,7 +27,7 @@
                         </div>
                     </div>
                 </template>
-                <template slot="footer">
+                <template #footer>
                     <span v-show="page > totalPages" class="has-text-grey"> Thats it! No more movies found. </span>
                 </template>
             </b-autocomplete>
@@ -75,7 +75,7 @@
                 this.$http.get(`https://api.themoviedb.org/3/search/movie?api_key=bb6f51bef07465653c3e553d6ab161a8&query=${name}&page=${this.page}`)
                     .then(({ data }) => {
                         data.results.forEach((item) => this.data.push(item))
-                        
+
                         this.page++
                         this.totalPages = data.total_pages
                     })

diff --git a/docs/pages/components/autocomplete/examples/ExSimple.vue b/docs/pages/components/autocomplete/examples/ExSimple.vue
@@ -10,7 +10,7 @@
                 icon="magnify"
                 clearable
                 @select="option => selected = option">
-                <template slot="empty">No results found</template>
+                <template #empty>No results found</template>
             </b-autocomplete>
         </b-field>
     </section>

diff --git a/docs/pages/components/button/examples/ExTypesStates.vue b/docs/pages/components/button/examples/ExTypesStates.vue
@@ -23,6 +23,7 @@
             <b-button type="is-light">Light</b-button>
             <b-button type="is-dark">Dark</b-button>
             <b-button type="is-text">Text</b-button>
+            <b-button type="is-ghost">Ghost</b-button>
         </div>
 
         <div class="buttons">

diff --git a/docs/pages/components/carousel/examples/ExCustomIndicator.vue b/docs/pages/components/carousel/examples/ExCustomIndicator.vue
@@ -5,9 +5,9 @@
               <img :src="getImgUrl(i)">
             </span>
         </b-carousel-item>
-        <template slot="indicators" slot-scope="props">
+        <template #indicators="props">
             <span class="al image">
-                <img :src="getImgUrl(props.i)" :title="props.i">
+               <img :src="getImgUrl(props.i)" :title="props.i">
             </span>
         </template>
     </b-carousel>

diff --git a/docs/pages/components/carousel/examples/ExGallery.vue b/docs/pages/components/carousel/examples/ExGallery.vue
@@ -6,7 +6,7 @@
             </a>
         </b-carousel-item>
         <span v-if="gallery" @click="switchGallery(false)" class="modal-close is-large"/>
-        <template slot="indicators" slot-scope="props">
+        <template #indicators="props">
             <figure class="al image" :draggable="false">
                 <img :draggable="false" :src="getImgUrl(props.i)" :title="props.i">
             </figure>

diff --git a/docs/pages/components/carousel/examples/ExWithCard.vue b/docs/pages/components/carousel/examples/ExWithCard.vue
@@ -1,6 +1,6 @@
 <template>
     <b-carousel-list v-model="test" :data="items" :items-to-show="2">
-        <template slot="item" slot-scope="list">
+        <template #item="list">
             <div class="card">
                 <div class="card-image">
                     <figure class="image is-5by4">
@@ -12,14 +12,14 @@
                     <div class="content">
                         <p class="title is-6">{{ list.title }}</p>
                         <p class="subtitle is-7">@johnsmith</p>
-                        <div class="field is-grouped" >
+                        <b-field grouped >
                             <p class="control" v-if="list.rating">
                                 <b-rate :value="list.rating" show-score disabled/>
                             </p>
                             <p class="control" style="margin-left: auto">
-                                <button class="button is-small is-danger is-outlined"><b-icon size="is-small" icon="heart"/></button>
+                                <b-button size="is-small" type="is-danger" icon-left="heart" outlined />
                             </p>
-                        </div>
+                        </b-field>
                     </div>
                 </div>
             </div>

diff --git a/docs/pages/components/carousel/examples/ExWithList.vue b/docs/pages/components/carousel/examples/ExWithList.vue
@@ -11,15 +11,15 @@
             </figure>
         </b-carousel-item>
         <span v-if="gallery" @click="switchGallery(false)" class="modal-close is-large"/>
-        <template slot="list" slot-scope="props">
+        <template #list="props">
             <b-carousel-list
                 v-model="props.active"
                 :data="items"
                 v-bind="al"
                 @switch="props.switch($event, false)"
                 as-indicator />
         </template>
-        <template slot="overlay">
+        <template #overlay>
             <div class="has-text-centered has-text-white">
                 Hello i'am overlay!
             </div>

diff --git a/docs/pages/components/carousel/variables/carousel.js b/docs/pages/components/carousel/variables/carousel.js
@@ -29,20 +29,15 @@ export default [
         description: 'The carousel indicator background',
         default: '<code>rgba($scheme-invert, 0.45)</code>'
     },
-    {
-        name: '<code>$carousel-indicator-color</code>',
-        description: 'The carousel indicator color',
-        default: '<code>$scheme-main</code>'
-    },
     {
         name: '<code>$carousel-indicator-border</code>',
         description: 'The carousel indicator color border',
-        default: '<code>$primary</code>'
+        default: '<code>$scheme-main</code>'
     },
     {
         name: '<code>$carousel-indicator-color</code>',
-        description: 'The carousel indicator background',
-        default: '<code>$white</code>'
+        description: 'The carousel indicator color',
+        default: '<code>$primary</code>'
     },
     {
         name: '<code>$carousel-indicator-spaced</code>',

diff --git a/docs/pages/components/checkbox/api/checkbox.js b/docs/pages/components/checkbox/api/checkbox.js
@@ -84,7 +84,7 @@ export default [
             },
             {
                 name: '<code>[any].native</code>',
-                description: 'Listen to any event using this syntax, e.g <code>click.native</code>',
+                description: 'Listen to any event using this syntax, e.g <code>@click.native</code>',
                 parameters: '<code>event: $event</code>'
             }
         ]