Merge branch 'master' into feat/snackbar-queue

vuetifyjs · Apr 21, 2024 · 24064d6 · 24064d6
2 parents 07b5b8f + b9a7d69
commit 24064d6
Show file tree

Hide file tree

Showing 5 changed files with 44 additions and 10 deletions.
diff --git a/packages/vuetify/src/components/VSelect/VSelect.tsx b/packages/vuetify/src/components/VSelect/VSelect.tsx
@@ -250,6 +250,10 @@ export const VSelect = genericComponent<new <
       const item = items.value.find(item => item.title.toLowerCase().startsWith(keyboardLookupPrefix))
       if (item !== undefined) {
         model.value = [item]
+        const index = displayItems.value.indexOf(item)
+        IN_BROWSER && window.requestAnimationFrame(() => {
+          index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index)
+        })
       }
     }
 
@@ -302,9 +306,9 @@ export const VSelect = genericComponent<new <
       }
     }
 
-    watch([menu, model], () => {
+    watch(menu, () => {
       if (!props.hideSelected && menu.value && model.value.length) {
-        const index = displayItems.value.findLastIndex(
+        const index = displayItems.value.findIndex(
           item => model.value.some(s => props.valueComparator(s.value, item.value))
         )
         IN_BROWSER && window.requestAnimationFrame(() => {

diff --git a/packages/vuetify/src/components/VSnackbar/VSnackbar.sass b/packages/vuetify/src/components/VSnackbar/VSnackbar.sass
@@ -8,9 +8,6 @@
   margin: $snackbar-wrapper-margin
   margin-inline-end: calc(#{$snackbar-wrapper-margin} + var(--v-scrollbar-offset))
 
-  &:not(.v-snackbar--centered):not(.v-snackbar--top)
-    align-items: flex-end
-
   &__wrapper
     align-items: center
     display: flex
@@ -67,6 +64,24 @@
       align-self: flex-end
       margin-bottom: $snackbar-vertical-action-margin-bottom
 
+  &--center
+    align-items: center
+    justify-content: center
+
+  &--top
+    align-items: flex-start
+
+  &--bottom
+    align-items: flex-end
+
+  &--left,
+  &--start
+    justify-content: flex-start
+
+  &--right,
+  &--end
+    justify-content: flex-end
+
 .v-snackbar-transition
   &-enter-active,
   &-leave-active

diff --git a/packages/vuetify/src/components/VSnackbar/VSnackbar.tsx b/packages/vuetify/src/components/VSnackbar/VSnackbar.tsx
@@ -9,7 +9,7 @@ import { VProgressLinear } from '@/components/VProgressLinear'
 
 // Composables
 import { forwardRefs } from '@/composables/forwardRefs'
-import { makeLocationProps, useLocation } from '@/composables/location'
+import { makeLocationProps } from '@/composables/location'
 import { makePositionProps, usePosition } from '@/composables/position'
 import { useProxiedModel } from '@/composables/proxiedModel'
 import { makeRoundedProps, useRounded } from '@/composables/rounded'
@@ -18,7 +18,7 @@ import { makeThemeProps, provideTheme } from '@/composables/theme'
 import { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'
 
 // Utilities
-import { mergeProps, nextTick, onMounted, onScopeDispose, ref, shallowRef, watch } from 'vue'
+import { computed, mergeProps, nextTick, onMounted, onScopeDispose, ref, shallowRef, watch } from 'vue'
 import { genericComponent, omit, propsFactory, refElement, useRender } from '@/util'
 
 type VSnackbarSlots = {
@@ -95,7 +95,6 @@ export const VSnackbar = genericComponent<VSnackbarSlots>()({
 
   setup (props, { slots }) {
     const isActive = useProxiedModel(props, 'modelValue')
-    const { locationStyles } = useLocation(props)
     const { positionClasses } = usePosition(props)
     const { scopeId } = useScopeId()
     const { themeClasses } = provideTheme(props)
@@ -146,6 +145,14 @@ export const VSnackbar = genericComponent<VSnackbarSlots>()({
       startTimeout()
     }
 
+    const locationClasses = computed(() => {
+      return props.location.split(' ').reduce((acc, loc) => {
+        acc[`v-snackbar--${loc}`] = true
+
+        return acc
+      }, {} as Record<string, any>)
+    })
+
     useRender(() => {
       const overlayProps = VOverlay.filterProps(props)
       const hasContent = !!(slots.default || slots.text || props.text)
@@ -161,6 +168,7 @@ export const VSnackbar = genericComponent<VSnackbarSlots>()({
               'v-snackbar--timer': !!props.timer,
               'v-snackbar--vertical': props.vertical,
             },
+            locationClasses.value,
             positionClasses.value,
             props.class,
           ]}
@@ -176,7 +184,6 @@ export const VSnackbar = genericComponent<VSnackbarSlots>()({
               variantClasses.value,
             ],
             style: [
-              locationStyles.value,
               colorStyles.value,
             ],
             onPointerenter,

diff --git a/packages/vuetify/src/labs/VFab/VFab.sass b/packages/vuetify/src/labs/VFab/VFab.sass
@@ -52,6 +52,7 @@
 .v-fab__container
   align-self: center
   display: inline-flex
+  position: absolute
   vertical-align: middle
 
   .v-fab--app &

diff --git a/packages/vuetify/src/styles/settings/_variables.scss b/packages/vuetify/src/styles/settings/_variables.scss
@@ -289,7 +289,14 @@ $flat-typography: () !default;
 @each $type, $values in $typography {
   $flat-typography: map-deep-merge(
     $flat-typography,
-    (#{$type}: map.values($values))
+    (#{$type}: (
+      map.get($values, 'size'),
+      map.get($values, 'weight'),
+      map.get($values, 'line-height'),
+      map.get($values, 'letter-spacing'),
+      map.get($values, 'font-family'),
+      map.get($values, 'text-transform'),
+    ))
   );
 }