@gitlab/ui 115.5.0 → 115.6.1

package/src/components/dashboards/dashboard_panel/dashboard_panel.vue

@@ -178,25 +178,40 @@ export default {
           </template>
         </div>
 
-        <gl-disclosure-dropdown
-          v-if="shouldShowActions"
-          :items="actions"
-          icon="ellipsis_v"
-          :toggle-text="actionsToggleText"
-          text-sr-only
-          no-caret
-          placement="bottom-end"
-          fluid-width
-          toggle-class="gl-ml-1"
-          category="tertiary"
-          positioning-strategy="fixed"
-          @shown="$emit('dropdownOpen')"
-          @hidden="$emit('dropdownClosed')"
+        <div
+          v-if="shouldShowActions || $scopedSlots.filters"
+          data-testid="panel-actions-filters-container"
+          class="gl-flex gl-flex-col gl-items-end gl-gap-2"
         >
-          <template #list-item="{ item }">
-            <span> <gl-icon :name="item.icon" /> {{ item.text }}</span>
-          </template>
-        </gl-disclosure-dropdown>
+          <gl-disclosure-dropdown
+            v-if="shouldShowActions"
+            :items="actions"
+            icon="ellipsis_v"
+            :toggle-text="actionsToggleText"
+            text-sr-only
+            no-caret
+            placement="bottom-end"
+            fluid-width
+            toggle-class="gl-ml-1"
+            category="tertiary"
+            positioning-strategy="fixed"
+            @shown="$emit('dropdownOpen')"
+            @hidden="$emit('dropdownClosed')"
+          >
+            <template #list-item="{ item }">
+              <span> <gl-icon :name="item.icon" /> {{ item.text }}</span>
+            </template>
+          </gl-disclosure-dropdown>
+
+          <div
+            v-if="$scopedSlots.filters"
+            class="gl-flex gl-items-center gl-justify-end gl-pb-2"
+            data-testid="panel-filters-container"
+          >
+            <!-- @slot  The filter section to add additional UI elements for filtering, grouping, etc. -->
+            <slot name="filters"></slot>
+          </div>
+        </div>
       </div>
       <div :class="bodyClasses">
         <template v-if="loading">

package/src/vendor/bootstrap-vue/src/components/toast/_toast.scss

@@ -19,10 +19,6 @@
     background-color: rgba($toast-background-color, $b-toast-background-opacity);
   }
 
-  &:not(:last-child) {
-    margin-bottom: $toast-padding-x;
-  }
-
   &.b-toast-solid {
     .toast {
       background-color: rgba($toast-background-color, 1);

package/src/vendor/bootstrap-vue/src/components/toast/helpers/bv-toast.js

@@ -133,9 +133,19 @@ const plugin = Vue => {
       }
     })
     // Create a mount point (a DIV) and mount it (which triggers the show)
-    const div = document.createElement('div')
-    document.body.appendChild(div)
-    toast.$mount(div)
+    function createMountPoint() {
+      const div = document.createElement('div')
+      document.body.appendChild(div)
+      toast.$mount(div)
+    }
+
+    // ViewTransition fallback
+    if (!document.startViewTransition) {
+      createMountPoint()
+      return
+    }
+
+    document.startViewTransition(createMountPoint)
   }
 
   // Declare BvToast instance property class

package/src/vendor/bootstrap-vue/src/components/toast/index.scss

@@ -1,3 +1,2 @@
 @import "toast";
 @import "toaster";
-@import "toaster-transition";

package/src/vendor/bootstrap-vue/src/components/toast/_toaster-transition.scss

@@ -1,45 +0,0 @@
-// --- <b-toast> custom transition SCSS ---
-
-// PortalVue appears to have issues with transition classes on portaled items
-
-.b-toaster {
-  &.b-toaster-top-right,
-  &.b-toaster-top-left,
-  &.b-toaster-bottom-right,
-  &.b-toaster-bottom-left {
-    .b-toast {
-      &.b-toaster-enter-active,
-      &.b-toaster-leave-active,
-      &.b-toaster-move {
-        transition: transform 0.175s;
-      }
-
-      &.b-toaster-enter {
-      }
-
-      &.b-toaster-enter-to,
-      &.b-toaster-enter-active {
-        .toast.fade {
-          // Delay the appearance of the toast until
-          // the move transition has completed
-          transition-delay: 0.175s;
-        }
-      }
-
-      &.b-toaster-enter-to {
-      }
-
-      &.b-toaster-leave-active {
-        position: absolute;
-        transition-delay: 0.175s;
-
-        .toast.fade {
-          transition-delay: 0s;
-        }
-      }
-
-      &.b-toaster-leave-to {
-      }
-    }
-  }
-}