@vuetify/nightly 3.7.0-beta.1-dev.2024-07-30 → 3.7.0-beta.1-dev.2024-08-08

package/lib/components/VAlert/VAlert.css

@@ -7,7 +7,6 @@
   padding: 16px;
   overflow: hidden;
   --v-border-color: currentColor;
-  border-radius: 4px;
 }
 .v-alert--absolute {
   position: absolute;
@@ -18,6 +17,9 @@
 .v-alert--sticky {
   position: sticky;
 }
+.v-alert {
+  border-radius: 4px;
+}
 .v-alert--variant-plain, .v-alert--variant-outlined, .v-alert--variant-text, .v-alert--variant-tonal {
   background: transparent;
   color: inherit;
@@ -118,6 +120,8 @@
   right: 0;
   top: 0;
   width: 100%;
+}
+.v-alert__border {
   border-color: currentColor;
   border-style: solid;
   border-width: 0;

package/lib/components/VAutocomplete/VAutocomplete.css

@@ -23,7 +23,11 @@
 
 .v-autocomplete__content {
   overflow: hidden;
+}
+.v-autocomplete__content {
   box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-autocomplete__content {
   border-radius: 4px;
 }
 .v-autocomplete__mask {

package/lib/components/VAvatar/VAvatar.css

@@ -10,10 +10,6 @@
   transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
   transition-property: width, height;
   vertical-align: middle;
-  border-color: rgba(var(--v-border-color), var(--v-border-opacity));
-  border-style: solid;
-  border-width: thin;
-  border-radius: 50%;
 }
 .v-avatar.v-avatar--size-x-small {
   --v-avatar-height: 24px;
@@ -42,10 +38,18 @@
   height: calc(var(--v-avatar-height) + -8px);
   width: calc(var(--v-avatar-height) + -8px);
 }
+.v-avatar {
+  border-color: rgba(var(--v-border-color), var(--v-border-opacity));
+  border-style: solid;
+  border-width: thin;
+}
 .v-avatar--border {
   border-width: thin;
   box-shadow: none;
 }
+.v-avatar {
+  border-radius: 50%;
+}
 .v-avatar--variant-plain, .v-avatar--variant-outlined, .v-avatar--variant-text, .v-avatar--variant-tonal {
   background: transparent;
   color: inherit;

package/lib/components/VAvatar/VAvatar.mjs

@@ -81,7 +81,7 @@ export const VAvatar = genericComponent()({
         "defaults": {
           VImg: {
             cover: true,
-            image: props.image
+            src: props.image
           },
           VIcon: {
             icon: props.icon

package/lib/components/VAvatar/VAvatar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VAvatar.mjs","names":["VDefaultsProvider","VIcon","VImg","makeBorderProps","useBorder","makeComponentProps","makeDensityProps","useDensity","IconValue","makeRoundedProps","useRounded","makeSizeProps","useSize","makeTagProps","makeThemeProps","provideTheme","genOverlays","makeVariantProps","useVariant","genericComponent","propsFactory","useRender","makeVAvatarProps","start","Boolean","end","icon","image","String","text","variant","VAvatar","name","props","setup","_ref","slots","themeClasses","borderClasses","colorClasses","colorStyles","variantClasses","densityClasses","roundedClasses","sizeClasses","sizeStyles","_createVNode","tag","value","class","style","default","cover"],"sources":["../../../src/components/VAvatar/VAvatar.tsx"],"sourcesContent":["// Styles\nimport './VAvatar.sass'\n\n// Components\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { VImg } from '@/components/VImg'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { IconValue } from '@/composables/icons'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeSizeProps, useSize } from '@/composables/size'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Utilities\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport const makeVAvatarProps = propsFactory({\n  start: Boolean,\n  end: Boolean,\n  icon: IconValue,\n  image: String,\n  text: String,\n\n  ...makeBorderProps(),\n  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeRoundedProps(),\n  ...makeSizeProps(),\n  ...makeTagProps(),\n  ...makeThemeProps(),\n  ...makeVariantProps({ variant: 'flat' } as const),\n}, 'VAvatar')\n\nexport const VAvatar = genericComponent()({\n  name: 'VAvatar',\n\n  props: makeVAvatarProps(),\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { borderClasses } = useBorder(props)\n    const { colorClasses, colorStyles, variantClasses } = useVariant(props)\n    const { densityClasses } = useDensity(props)\n    const { roundedClasses } = useRounded(props)\n    const { sizeClasses, sizeStyles } = useSize(props)\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-avatar',\n          {\n            'v-avatar--start': props.start,\n            'v-avatar--end': props.end,\n          },\n          themeClasses.value,\n          borderClasses.value,\n          colorClasses.value,\n          densityClasses.value,\n          roundedClasses.value,\n          sizeClasses.value,\n          variantClasses.value,\n          props.class,\n        ]}\n        style={[\n          colorStyles.value,\n          sizeStyles.value,\n          props.style,\n        ]}\n      >\n        { !slots.default ? (\n          props.image\n            ? (<VImg key=\"image\" src={ props.image } alt=\"\" cover />)\n            : props.icon\n              ? (<VIcon key=\"icon\" icon={ props.icon } />)\n              : props.text\n        ) : (\n          <VDefaultsProvider\n            key=\"content-defaults\"\n            defaults={{\n              VImg: {\n                cover: true,\n                image: props.image,\n              },\n              VIcon: {\n                icon: props.icon,\n              },\n            }}\n          >\n            { slots.default() }\n          </VDefaultsProvider>\n        )}\n\n        { genOverlays(false, 'v-avatar') }\n      </props.tag>\n    ))\n\n    return {}\n  },\n})\n\nexport type VAvatar = InstanceType<typeof VAvatar>\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"VAvatar.mjs","names":["VDefaultsProvider","VIcon","VImg","makeBorderProps","useBorder","makeComponentProps","makeDensityProps","useDensity","IconValue","makeRoundedProps","useRounded","makeSizeProps","useSize","makeTagProps","makeThemeProps","provideTheme","genOverlays","makeVariantProps","useVariant","genericComponent","propsFactory","useRender","makeVAvatarProps","start","Boolean","end","icon","image","String","text","variant","VAvatar","name","props","setup","_ref","slots","themeClasses","borderClasses","colorClasses","colorStyles","variantClasses","densityClasses","roundedClasses","sizeClasses","sizeStyles","_createVNode","tag","value","class","style","default","cover","src"],"sources":["../../../src/components/VAvatar/VAvatar.tsx"],"sourcesContent":["// Styles\nimport './VAvatar.sass'\n\n// Components\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { VImg } from '@/components/VImg'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { IconValue } from '@/composables/icons'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeSizeProps, useSize } from '@/composables/size'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Utilities\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport const makeVAvatarProps = propsFactory({\n  start: Boolean,\n  end: Boolean,\n  icon: IconValue,\n  image: String,\n  text: String,\n\n  ...makeBorderProps(),\n  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeRoundedProps(),\n  ...makeSizeProps(),\n  ...makeTagProps(),\n  ...makeThemeProps(),\n  ...makeVariantProps({ variant: 'flat' } as const),\n}, 'VAvatar')\n\nexport const VAvatar = genericComponent()({\n  name: 'VAvatar',\n\n  props: makeVAvatarProps(),\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { borderClasses } = useBorder(props)\n    const { colorClasses, colorStyles, variantClasses } = useVariant(props)\n    const { densityClasses } = useDensity(props)\n    const { roundedClasses } = useRounded(props)\n    const { sizeClasses, sizeStyles } = useSize(props)\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-avatar',\n          {\n            'v-avatar--start': props.start,\n            'v-avatar--end': props.end,\n          },\n          themeClasses.value,\n          borderClasses.value,\n          colorClasses.value,\n          densityClasses.value,\n          roundedClasses.value,\n          sizeClasses.value,\n          variantClasses.value,\n          props.class,\n        ]}\n        style={[\n          colorStyles.value,\n          sizeStyles.value,\n          props.style,\n        ]}\n      >\n        { !slots.default ? (\n          props.image\n            ? (<VImg key=\"image\" src={ props.image } alt=\"\" cover />)\n            : props.icon\n              ? (<VIcon key=\"icon\" icon={ props.icon } />)\n              : props.text\n        ) : (\n          <VDefaultsProvider\n            key=\"content-defaults\"\n            defaults={{\n              VImg: {\n                cover: true,\n                src: props.image,\n              },\n              VIcon: {\n                icon: props.icon,\n              },\n            }}\n          >\n            { slots.default() }\n          </VDefaultsProvider>\n        )}\n\n        { genOverlays(false, 'v-avatar') }\n      </props.tag>\n    ))\n\n    return {}\n  },\n})\n\nexport type VAvatar = InstanceType<typeof VAvatar>\n"],"mappings":"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","ignoreList":[]}

package/lib/components/VBadge/VBadge.css

@@ -19,6 +19,8 @@
   text-indent: 0;
   transition: 0.225s cubic-bezier(0.4, 0, 0.2, 1);
   white-space: nowrap;
+}
+.v-badge__badge {
   background: rgb(var(--v-theme-surface-variant));
   color: rgba(var(--v-theme-on-surface-variant), var(--v-high-emphasis-opacity));
 }

package/lib/components/VBanner/VBanner.css

@@ -12,18 +12,19 @@
   padding-bottom: 16px;
   position: relative;
   width: 100%;
+}
+.v-banner {
   border-color: rgba(var(--v-border-color), var(--v-border-opacity));
   border-style: solid;
   border-width: 0 0 thin 0;
-  box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
-  border-radius: 0;
-  background: rgb(var(--v-theme-surface));
-  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
 }
 .v-banner--border {
   border-width: thin;
   box-shadow: none;
 }
+.v-banner {
+  box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
 .v-banner--absolute {
   position: absolute;
 }
@@ -33,6 +34,13 @@
 .v-banner--sticky {
   position: sticky;
 }
+.v-banner {
+  border-radius: 0;
+}
+.v-banner {
+  background: rgb(var(--v-theme-surface));
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
+}
 .v-banner--rounded {
   border-radius: 4px;
 }

package/lib/components/VBottomNavigation/VBottomNavigation.css

@@ -4,17 +4,23 @@
   overflow: hidden;
   position: absolute;
   transition: transform, color, 0.2s, 0.1s cubic-bezier(0.4, 0, 0.2, 1);
+}
+.v-bottom-navigation {
   border-color: rgba(var(--v-border-color), var(--v-border-opacity));
   border-style: solid;
   border-width: 0;
-  border-radius: 0;
-  background: rgb(var(--v-theme-surface));
-  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
 }
 .v-bottom-navigation--border {
   border-width: thin;
   box-shadow: none;
 }
+.v-bottom-navigation {
+  border-radius: 0;
+}
+.v-bottom-navigation {
+  background: rgb(var(--v-theme-surface));
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
+}
 .v-bottom-navigation--active {
   box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
 }
@@ -35,6 +41,8 @@
   text-transform: none;
   transition: inherit;
   width: auto;
+}
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn {
   border-radius: 0;
 }
 .v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__content,

package/lib/components/VBottomSheet/VBottomSheet.css

@@ -17,6 +17,8 @@
   width: 100%;
   max-width: 100%;
   overflow: visible;
+}
+.v-bottom-sheet > .v-bottom-sheet__content.v-overlay__content {
   box-shadow: 0px 7px 8px -4px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 12px 17px 2px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 5px 22px 4px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
 }
 .v-bottom-sheet > .v-bottom-sheet__content.v-overlay__content > .v-card,

package/lib/components/VBtn/VBtn.css

@@ -20,9 +20,6 @@
   user-select: none;
   vertical-align: middle;
   flex-shrink: 0;
-  border-color: rgba(var(--v-border-color), var(--v-border-opacity));
-  border-style: solid;
-  border-width: 0;
 }
 .v-btn--size-x-small {
   --v-btn-size: 0.625rem;
@@ -76,6 +73,11 @@
   height: calc(var(--v-btn-height) + -12px);
 }
 
+.v-btn {
+  border-color: rgba(var(--v-border-color), var(--v-border-opacity));
+  border-style: solid;
+  border-width: 0;
+}
 .v-btn--border {
   border-width: thin;
   box-shadow: none;
@@ -154,6 +156,13 @@
   position: absolute;
 }
 @supports selector(:focus-visible) {
+  .v-btn::after {
+    pointer-events: none;
+    border: 2px solid currentColor;
+    border-radius: inherit;
+    opacity: 0;
+    transition: opacity 0.2s ease-in-out;
+  }
   .v-btn::after {
     content: "";
     position: absolute;
@@ -161,11 +170,6 @@
     left: 0;
     width: 100%;
     height: 100%;
-    pointer-events: none;
-    border: 2px solid currentColor;
-    border-radius: inherit;
-    opacity: 0;
-    transition: opacity 0.2s ease-in-out;
   }
   .v-btn:focus-visible::after {
     opacity: calc(0.25 * var(--v-theme-overlay-multiplier));
@@ -393,6 +397,10 @@
   transition: opacity 0.2s ease-in-out;
 }
 
+.v-btn__overlay,
+.v-btn__underlay {
+  pointer-events: none;
+}
 .v-btn__overlay,
 .v-btn__underlay {
   position: absolute;
@@ -400,7 +408,6 @@
   left: 0;
   width: 100%;
   height: 100%;
-  pointer-events: none;
 }
 
 .v-card-actions .v-btn ~ .v-btn:not(.v-btn-toggle .v-btn) {

package/lib/components/VBtn/VBtn.mjs

@@ -230,7 +230,7 @@ export const VBtn = genericComponent()({
           "indeterminate": true,
           "width": "2"
         }, null)])]
-      }), [[Ripple, !isDisabled.value && !!props.ripple, '', {
+      }), [[Ripple, !isDisabled.value && props.ripple, '', {
         center: !!props.icon
       }]]);
     });

package/lib/components/VBtn/VBtn.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VBtn.mjs","names":["VBtnToggleSymbol","VDefaultsProvider","VIcon","VProgressCircular","makeBorderProps","useBorder","makeComponentProps","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeGroupItemProps","useGroupItem","IconValue","makeLoaderProps","useLoader","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeRouterProps","useLink","useSelectLink","makeSizeProps","useSize","makeTagProps","makeThemeProps","provideTheme","genOverlays","makeVariantProps","useVariant","Ripple","computed","withDirectives","genericComponent","propsFactory","useRender","makeVBtnProps","active","type","Boolean","default","undefined","activeColor","String","baseColor","symbol","flat","icon","Function","Object","prependIcon","appendIcon","block","readonly","slim","stacked","ripple","text","tag","variant","VBtn","name","props","emits","val","setup","_ref","attrs","slots","themeClasses","borderClasses","densityClasses","dimensionStyles","elevationClasses","loaderClasses","locationStyles","positionClasses","roundedClasses","sizeClasses","sizeStyles","group","link","isActive","isLink","value","isSelected","color","variantProps","showColor","colorClasses","colorStyles","variantClasses","isDisabled","disabled","isElevated","border","valueAttr","JSON","stringify","onClick","e","metaKey","ctrlKey","shiftKey","button","target","navigate","toggle","select","Tag","hasPrepend","prepend","hasAppend","append","hasIcon","_createVNode","selectedClass","loading","class","style","href","loader","center"],"sources":["../../../src/components/VBtn/VBtn.tsx"],"sourcesContent":["// Styles\nimport './VBtn.sass'\n\n// Components\nimport { VBtnToggleSymbol } from '@/components/VBtnToggle/VBtnToggle'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { VProgressCircular } from '@/components/VProgressCircular'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeGroupItemProps, useGroupItem } from '@/composables/group'\nimport { IconValue } from '@/composables/icons'\nimport { makeLoaderProps, useLoader } from '@/composables/loader'\nimport { makeLocationProps, useLocation } from '@/composables/location'\nimport { makePositionProps, usePosition } from '@/composables/position'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeRouterProps, useLink } from '@/composables/router'\nimport { useSelectLink } from '@/composables/selectLink'\nimport { makeSizeProps, useSize } from '@/composables/size'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Utilities\nimport { computed, withDirectives } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { RippleDirectiveBinding } from '@/directives/ripple'\n\nexport type VBtnSlots = {\n  default: never\n  prepend: never\n  append: never\n  loader: never\n}\n\nexport const makeVBtnProps = propsFactory({\n  active: {\n    type: Boolean,\n    default: undefined,\n  },\n  activeColor: String,\n  baseColor: String,\n  symbol: {\n    type: null,\n    default: VBtnToggleSymbol,\n  },\n  flat: Boolean,\n  icon: [Boolean, String, Function, Object] as PropType<boolean | IconValue>,\n  prependIcon: IconValue,\n  appendIcon: IconValue,\n\n  block: Boolean,\n  readonly: Boolean,\n  slim: Boolean,\n  stacked: Boolean,\n\n  ripple: {\n    type: [Boolean, Object] as PropType<RippleDirectiveBinding['value']>,\n    default: true,\n  },\n\n  text: String,\n\n  ...makeBorderProps(),\n  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeDimensionProps(),\n  ...makeElevationProps(),\n  ...makeGroupItemProps(),\n  ...makeLoaderProps(),\n  ...makeLocationProps(),\n  ...makePositionProps(),\n  ...makeRoundedProps(),\n  ...makeRouterProps(),\n  ...makeSizeProps(),\n  ...makeTagProps({ tag: 'button' }),\n  ...makeThemeProps(),\n  ...makeVariantProps({ variant: 'elevated' } as const),\n}, 'VBtn')\n\nexport const VBtn = genericComponent<VBtnSlots>()({\n  name: 'VBtn',\n\n  props: makeVBtnProps(),\n\n  emits: {\n    'group:selected': (val: { value: boolean }) => true,\n  },\n\n  setup (props, { attrs, slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { borderClasses } = useBorder(props)\n    const { densityClasses } = useDensity(props)\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { loaderClasses } = useLoader(props)\n    const { locationStyles } = useLocation(props)\n    const { positionClasses } = usePosition(props)\n    const { roundedClasses } = useRounded(props)\n    const { sizeClasses, sizeStyles } = useSize(props)\n    const group = useGroupItem(props, props.symbol, false)\n    const link = useLink(props, attrs)\n\n    const isActive = computed(() => {\n      if (props.active !== undefined) {\n        return props.active\n      }\n\n      if (link.isLink.value) {\n        return link.isActive?.value\n      }\n\n      return group?.isSelected.value\n    })\n\n    const color = computed(() => isActive.value ? props.activeColor ?? props.color : props.color)\n    const variantProps = computed(() => {\n      const showColor = (\n        (group?.isSelected.value && (!link.isLink.value || link.isActive?.value)) ||\n        (!group || link.isActive?.value)\n      )\n      return ({\n        color: showColor ? color.value ?? props.baseColor : props.baseColor,\n        variant: props.variant,\n      })\n    })\n    const { colorClasses, colorStyles, variantClasses } = useVariant(variantProps)\n\n    const isDisabled = computed(() => group?.disabled.value || props.disabled)\n    const isElevated = computed(() => {\n      return props.variant === 'elevated' && !(props.disabled || props.flat || props.border)\n    })\n    const valueAttr = computed(() => {\n      if (props.value === undefined || typeof props.value === 'symbol') return undefined\n\n      return Object(props.value) === props.value\n        ? JSON.stringify(props.value, null, 0)\n        : props.value\n    })\n\n    function onClick (e: MouseEvent) {\n      if (\n        isDisabled.value ||\n        (link.isLink.value && (\n          e.metaKey ||\n          e.ctrlKey ||\n          e.shiftKey ||\n          (e.button !== 0) ||\n          attrs.target === '_blank'\n        ))\n      ) return\n\n      link.navigate?.(e)\n      group?.toggle()\n    }\n\n    useSelectLink(link, group?.select)\n\n    useRender(() => {\n      const Tag = (link.isLink.value) ? 'a' : props.tag\n      const hasPrepend = !!(props.prependIcon || slots.prepend)\n      const hasAppend = !!(props.appendIcon || slots.append)\n      const hasIcon = !!(props.icon && props.icon !== true)\n\n      return withDirectives(\n        <Tag\n          type={ Tag === 'a' ? undefined : 'button' }\n          class={[\n            'v-btn',\n            group?.selectedClass.value,\n            {\n              'v-btn--active': isActive.value,\n              'v-btn--block': props.block,\n              'v-btn--disabled': isDisabled.value,\n              'v-btn--elevated': isElevated.value,\n              'v-btn--flat': props.flat,\n              'v-btn--icon': !!props.icon,\n              'v-btn--loading': props.loading,\n              'v-btn--readonly': props.readonly,\n              'v-btn--slim': props.slim,\n              'v-btn--stacked': props.stacked,\n            },\n            themeClasses.value,\n            borderClasses.value,\n            colorClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            loaderClasses.value,\n            positionClasses.value,\n            roundedClasses.value,\n            sizeClasses.value,\n            variantClasses.value,\n            props.class,\n          ]}\n          style={[\n            colorStyles.value,\n            dimensionStyles.value,\n            locationStyles.value,\n            sizeStyles.value,\n            props.style,\n          ]}\n          aria-busy={ props.loading ? true : undefined }\n          disabled={ isDisabled.value || undefined }\n          href={ link.href.value }\n          tabindex={ props.loading || props.readonly ? -1 : undefined }\n          onClick={ onClick }\n          value={ valueAttr.value }\n        >\n          { genOverlays(true, 'v-btn') }\n\n          { !props.icon && hasPrepend && (\n            <span key=\"prepend\" class=\"v-btn__prepend\">\n              { !slots.prepend ? (\n                <VIcon\n                  key=\"prepend-icon\"\n                  icon={ props.prependIcon }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"prepend-defaults\"\n                  disabled={ !props.prependIcon }\n                  defaults={{\n                    VIcon: {\n                      icon: props.prependIcon,\n                    },\n                  }}\n                  v-slots:default={ slots.prepend }\n                />\n              )}\n            </span>\n          )}\n\n          <span class=\"v-btn__content\" data-no-activator=\"\">\n            { (!slots.default && hasIcon) ? (\n              <VIcon\n                key=\"content-icon\"\n                icon={ props.icon }\n              />\n            ) : (\n              <VDefaultsProvider\n                key=\"content-defaults\"\n                disabled={ !hasIcon }\n                defaults={{\n                  VIcon: {\n                    icon: props.icon,\n                  },\n                }}\n              >\n                { slots.default?.() ?? props.text }\n              </VDefaultsProvider>\n            )}\n          </span>\n\n          { !props.icon && hasAppend && (\n            <span key=\"append\" class=\"v-btn__append\">\n              { !slots.append ? (\n                <VIcon\n                  key=\"append-icon\"\n                  icon={ props.appendIcon }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"append-defaults\"\n                  disabled={ !props.appendIcon }\n                  defaults={{\n                    VIcon: {\n                      icon: props.appendIcon,\n                    },\n                  }}\n                  v-slots:default={ slots.append }\n                />\n              )}\n            </span>\n          )}\n\n          { !!props.loading && (\n            <span key=\"loader\" class=\"v-btn__loader\">\n              { slots.loader?.() ?? (\n                <VProgressCircular\n                  color={ typeof props.loading === 'boolean' ? undefined : props.loading }\n                  indeterminate\n                  width=\"2\"\n                />\n              )}\n            </span>\n          )}\n        </Tag>,\n        [[\n          Ripple,\n          !isDisabled.value && !!props.ripple,\n          '',\n          { center: !!props.icon },\n        ]]\n      )\n    })\n\n    return { group }\n  },\n})\n\nexport type VBtn = InstanceType<typeof VBtn>\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"VBtn.mjs","names":["VBtnToggleSymbol","VDefaultsProvider","VIcon","VProgressCircular","makeBorderProps","useBorder","makeComponentProps","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeGroupItemProps","useGroupItem","IconValue","makeLoaderProps","useLoader","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeRouterProps","useLink","useSelectLink","makeSizeProps","useSize","makeTagProps","makeThemeProps","provideTheme","genOverlays","makeVariantProps","useVariant","Ripple","computed","withDirectives","genericComponent","propsFactory","useRender","makeVBtnProps","active","type","Boolean","default","undefined","activeColor","String","baseColor","symbol","flat","icon","Function","Object","prependIcon","appendIcon","block","readonly","slim","stacked","ripple","text","tag","variant","VBtn","name","props","emits","val","setup","_ref","attrs","slots","themeClasses","borderClasses","densityClasses","dimensionStyles","elevationClasses","loaderClasses","locationStyles","positionClasses","roundedClasses","sizeClasses","sizeStyles","group","link","isActive","isLink","value","isSelected","color","variantProps","showColor","colorClasses","colorStyles","variantClasses","isDisabled","disabled","isElevated","border","valueAttr","JSON","stringify","onClick","e","metaKey","ctrlKey","shiftKey","button","target","navigate","toggle","select","Tag","hasPrepend","prepend","hasAppend","append","hasIcon","_createVNode","selectedClass","loading","class","style","href","loader","center"],"sources":["../../../src/components/VBtn/VBtn.tsx"],"sourcesContent":["// Styles\nimport './VBtn.sass'\n\n// Components\nimport { VBtnToggleSymbol } from '@/components/VBtnToggle/VBtnToggle'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { VProgressCircular } from '@/components/VProgressCircular'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeGroupItemProps, useGroupItem } from '@/composables/group'\nimport { IconValue } from '@/composables/icons'\nimport { makeLoaderProps, useLoader } from '@/composables/loader'\nimport { makeLocationProps, useLocation } from '@/composables/location'\nimport { makePositionProps, usePosition } from '@/composables/position'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeRouterProps, useLink } from '@/composables/router'\nimport { useSelectLink } from '@/composables/selectLink'\nimport { makeSizeProps, useSize } from '@/composables/size'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Utilities\nimport { computed, withDirectives } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { RippleDirectiveBinding } from '@/directives/ripple'\n\nexport type VBtnSlots = {\n  default: never\n  prepend: never\n  append: never\n  loader: never\n}\n\nexport const makeVBtnProps = propsFactory({\n  active: {\n    type: Boolean,\n    default: undefined,\n  },\n  activeColor: String,\n  baseColor: String,\n  symbol: {\n    type: null,\n    default: VBtnToggleSymbol,\n  },\n  flat: Boolean,\n  icon: [Boolean, String, Function, Object] as PropType<boolean | IconValue>,\n  prependIcon: IconValue,\n  appendIcon: IconValue,\n\n  block: Boolean,\n  readonly: Boolean,\n  slim: Boolean,\n  stacked: Boolean,\n\n  ripple: {\n    type: [Boolean, Object] as PropType<RippleDirectiveBinding['value']>,\n    default: true,\n  },\n\n  text: String,\n\n  ...makeBorderProps(),\n  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeDimensionProps(),\n  ...makeElevationProps(),\n  ...makeGroupItemProps(),\n  ...makeLoaderProps(),\n  ...makeLocationProps(),\n  ...makePositionProps(),\n  ...makeRoundedProps(),\n  ...makeRouterProps(),\n  ...makeSizeProps(),\n  ...makeTagProps({ tag: 'button' }),\n  ...makeThemeProps(),\n  ...makeVariantProps({ variant: 'elevated' } as const),\n}, 'VBtn')\n\nexport const VBtn = genericComponent<VBtnSlots>()({\n  name: 'VBtn',\n\n  props: makeVBtnProps(),\n\n  emits: {\n    'group:selected': (val: { value: boolean }) => true,\n  },\n\n  setup (props, { attrs, slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { borderClasses } = useBorder(props)\n    const { densityClasses } = useDensity(props)\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { loaderClasses } = useLoader(props)\n    const { locationStyles } = useLocation(props)\n    const { positionClasses } = usePosition(props)\n    const { roundedClasses } = useRounded(props)\n    const { sizeClasses, sizeStyles } = useSize(props)\n    const group = useGroupItem(props, props.symbol, false)\n    const link = useLink(props, attrs)\n\n    const isActive = computed(() => {\n      if (props.active !== undefined) {\n        return props.active\n      }\n\n      if (link.isLink.value) {\n        return link.isActive?.value\n      }\n\n      return group?.isSelected.value\n    })\n\n    const color = computed(() => isActive.value ? props.activeColor ?? props.color : props.color)\n    const variantProps = computed(() => {\n      const showColor = (\n        (group?.isSelected.value && (!link.isLink.value || link.isActive?.value)) ||\n        (!group || link.isActive?.value)\n      )\n      return ({\n        color: showColor ? color.value ?? props.baseColor : props.baseColor,\n        variant: props.variant,\n      })\n    })\n    const { colorClasses, colorStyles, variantClasses } = useVariant(variantProps)\n\n    const isDisabled = computed(() => group?.disabled.value || props.disabled)\n    const isElevated = computed(() => {\n      return props.variant === 'elevated' && !(props.disabled || props.flat || props.border)\n    })\n    const valueAttr = computed(() => {\n      if (props.value === undefined || typeof props.value === 'symbol') return undefined\n\n      return Object(props.value) === props.value\n        ? JSON.stringify(props.value, null, 0)\n        : props.value\n    })\n\n    function onClick (e: MouseEvent) {\n      if (\n        isDisabled.value ||\n        (link.isLink.value && (\n          e.metaKey ||\n          e.ctrlKey ||\n          e.shiftKey ||\n          (e.button !== 0) ||\n          attrs.target === '_blank'\n        ))\n      ) return\n\n      link.navigate?.(e)\n      group?.toggle()\n    }\n\n    useSelectLink(link, group?.select)\n\n    useRender(() => {\n      const Tag = (link.isLink.value) ? 'a' : props.tag\n      const hasPrepend = !!(props.prependIcon || slots.prepend)\n      const hasAppend = !!(props.appendIcon || slots.append)\n      const hasIcon = !!(props.icon && props.icon !== true)\n\n      return withDirectives(\n        <Tag\n          type={ Tag === 'a' ? undefined : 'button' }\n          class={[\n            'v-btn',\n            group?.selectedClass.value,\n            {\n              'v-btn--active': isActive.value,\n              'v-btn--block': props.block,\n              'v-btn--disabled': isDisabled.value,\n              'v-btn--elevated': isElevated.value,\n              'v-btn--flat': props.flat,\n              'v-btn--icon': !!props.icon,\n              'v-btn--loading': props.loading,\n              'v-btn--readonly': props.readonly,\n              'v-btn--slim': props.slim,\n              'v-btn--stacked': props.stacked,\n            },\n            themeClasses.value,\n            borderClasses.value,\n            colorClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            loaderClasses.value,\n            positionClasses.value,\n            roundedClasses.value,\n            sizeClasses.value,\n            variantClasses.value,\n            props.class,\n          ]}\n          style={[\n            colorStyles.value,\n            dimensionStyles.value,\n            locationStyles.value,\n            sizeStyles.value,\n            props.style,\n          ]}\n          aria-busy={ props.loading ? true : undefined }\n          disabled={ isDisabled.value || undefined }\n          href={ link.href.value }\n          tabindex={ props.loading || props.readonly ? -1 : undefined }\n          onClick={ onClick }\n          value={ valueAttr.value }\n        >\n          { genOverlays(true, 'v-btn') }\n\n          { !props.icon && hasPrepend && (\n            <span key=\"prepend\" class=\"v-btn__prepend\">\n              { !slots.prepend ? (\n                <VIcon\n                  key=\"prepend-icon\"\n                  icon={ props.prependIcon }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"prepend-defaults\"\n                  disabled={ !props.prependIcon }\n                  defaults={{\n                    VIcon: {\n                      icon: props.prependIcon,\n                    },\n                  }}\n                  v-slots:default={ slots.prepend }\n                />\n              )}\n            </span>\n          )}\n\n          <span class=\"v-btn__content\" data-no-activator=\"\">\n            { (!slots.default && hasIcon) ? (\n              <VIcon\n                key=\"content-icon\"\n                icon={ props.icon }\n              />\n            ) : (\n              <VDefaultsProvider\n                key=\"content-defaults\"\n                disabled={ !hasIcon }\n                defaults={{\n                  VIcon: {\n                    icon: props.icon,\n                  },\n                }}\n              >\n                { slots.default?.() ?? props.text }\n              </VDefaultsProvider>\n            )}\n          </span>\n\n          { !props.icon && hasAppend && (\n            <span key=\"append\" class=\"v-btn__append\">\n              { !slots.append ? (\n                <VIcon\n                  key=\"append-icon\"\n                  icon={ props.appendIcon }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"append-defaults\"\n                  disabled={ !props.appendIcon }\n                  defaults={{\n                    VIcon: {\n                      icon: props.appendIcon,\n                    },\n                  }}\n                  v-slots:default={ slots.append }\n                />\n              )}\n            </span>\n          )}\n\n          { !!props.loading && (\n            <span key=\"loader\" class=\"v-btn__loader\">\n              { slots.loader?.() ?? (\n                <VProgressCircular\n                  color={ typeof props.loading === 'boolean' ? undefined : props.loading }\n                  indeterminate\n                  width=\"2\"\n                />\n              )}\n            </span>\n          )}\n        </Tag>,\n        [[\n          Ripple,\n          !isDisabled.value && props.ripple,\n          '',\n          { center: !!props.icon },\n        ]]\n      )\n    })\n\n    return { group }\n  },\n})\n\nexport type VBtn = InstanceType<typeof VBtn>\n"],"mappings":"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","ignoreList":[]}

package/lib/components/VBtn/VBtn.sass

@@ -40,12 +40,12 @@
 
     @supports selector(:focus-visible)
       &::after
-        @include tools.absolute(true)
         pointer-events: none
         border: 2px solid currentColor
         border-radius: inherit
         opacity: 0
         transition: opacity .2s ease-in-out
+        @include tools.absolute(true)
 
       &:focus-visible::after
         opacity: calc(.25 * var(--v-theme-overlay-multiplier))
@@ -66,10 +66,10 @@
     &--elevated
       &:hover,
       &:focus
-        +tools.elevation(map.get($button-elevation, 'hover'))
+        @include tools.elevation(map.get($button-elevation, 'hover'))
 
       &:active
-        +tools.elevation(map.get($button-elevation, 'active'))
+        @include tools.elevation(map.get($button-elevation, 'active'))
 
     &--flat
       box-shadow: none
@@ -228,8 +228,8 @@
 
   .v-btn__overlay,
   .v-btn__underlay
-    @include tools.absolute()
     pointer-events: none
+    @include tools.absolute()
 
   // VCard
   .v-btn

package/lib/components/VBtnGroup/VBtnGroup.css

@@ -5,18 +5,26 @@
   min-width: 0;
   overflow: hidden;
   vertical-align: middle;
+}
+.v-btn-group {
   border-color: rgba(var(--v-border-color), var(--v-border-opacity));
   border-style: solid;
   border-width: 0;
-  box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
-  border-radius: 4px;
-  background: transparent;
-  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
 }
 .v-btn-group--border {
   border-width: thin;
   box-shadow: none;
 }
+.v-btn-group {
+  box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-btn-group {
+  border-radius: 4px;
+}
+.v-btn-group {
+  background: transparent;
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
+}
 .v-btn-group--density-default.v-btn-group {
   height: 48px;
 }

package/lib/components/VCard/VCard.css

@@ -9,10 +9,11 @@
   transition-property: box-shadow, opacity, background;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   z-index: 0;
+}
+.v-card {
   border-color: rgba(var(--v-border-color), var(--v-border-opacity));
   border-style: solid;
   border-width: 0;
-  border-radius: 4px;
 }
 .v-card--border {
   border-width: thin;
@@ -24,6 +25,9 @@
 .v-card--fixed {
   position: fixed;
 }
+.v-card {
+  border-radius: 4px;
+}
 .v-card:hover > .v-card__overlay {
   opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
 }
@@ -119,11 +123,15 @@
 .v-card--hover::before {
   opacity: 1;
   z-index: -1;
+}
+.v-card--hover::before {
   box-shadow: 0px 2px 1px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 1px 1px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 3px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
 }
 .v-card--hover::after {
   z-index: 1;
   opacity: 0;
+}
+.v-card--hover::after {
   box-shadow: 0px 5px 5px -3px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 8px 10px 1px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 3px 14px 2px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
 }
 .v-card--hover:hover::after {

package/lib/components/VCarousel/VCarousel.css

@@ -13,6 +13,8 @@
   position: absolute;
   width: 100%;
   z-index: 1;
+}
+.v-carousel__controls {
   background: rgba(var(--v-theme-surface-variant), 0.3);
   color: rgb(var(--v-theme-on-surface-variant));
 }

package/lib/components/VChip/VChip.css

@@ -9,10 +9,6 @@
   text-decoration: none;
   white-space: nowrap;
   vertical-align: middle;
-  border-color: rgba(var(--v-border-color), var(--v-border-opacity));
-  border-style: solid;
-  border-width: 0;
-  border-radius: 9999px;
 }
 .v-chip .v-icon {
   --v-icon-size-multiplier: 0.8571428571;
@@ -274,6 +270,11 @@
   height: calc(var(--v-chip-height) + -8px);
 }
 
+.v-chip {
+  border-color: rgba(var(--v-border-color), var(--v-border-opacity));
+  border-style: solid;
+  border-width: 0;
+}
 .v-chip:hover > .v-chip__overlay {
   opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
 }
@@ -299,6 +300,9 @@
     opacity: calc((var(--v-activated-opacity) + var(--v-focus-opacity)) * var(--v-theme-overlay-multiplier));
   }
 }
+.v-chip {
+  border-radius: 9999px;
+}
 .v-chip--variant-plain, .v-chip--variant-outlined, .v-chip--variant-text, .v-chip--variant-tonal {
   background: transparent;
   color: inherit;
@@ -387,17 +391,19 @@
 }
 
 .v-chip__overlay {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
   background-color: currentColor;
   border-radius: inherit;
   pointer-events: none;
   opacity: 0;
   transition: opacity 0.2s ease-in-out;
 }
+.v-chip__overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
 
 .v-chip--disabled {
   opacity: 0.3;

package/lib/components/VChip/VChip.sass

@@ -72,12 +72,12 @@
     transition: $chip-filter-transition
 
   .v-chip__overlay
-    @include tools.absolute()
     background-color: currentColor
     border-radius: inherit
     pointer-events: none
     opacity: 0
     transition: opacity .2s ease-in-out
+    @include tools.absolute()
 
   .v-chip--disabled
     opacity: $chip-disabled-opacity

package/lib/components/VColorPicker/VColorPicker.css

@@ -4,6 +4,8 @@
 }
 .v-color-picker.v-sheet {
   box-shadow: 0px 3px 1px -2px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 2px 2px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 5px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-color-picker.v-sheet {
   border-radius: 4px;
 }
 

package/lib/components/VColorPicker/VColorPicker.sass

@@ -8,8 +8,8 @@
     contain: content
 
     &.v-sheet
-      +tools.elevation($color-picker-elevation)
-      +tools.rounded($color-picker-border-radius)
+      @include tools.elevation($color-picker-elevation)
+      @include tools.rounded($color-picker-border-radius)
 
   // Element
   .v-color-picker__controls
@@ -19,7 +19,7 @@
 
   // Modifier
   .v-color-picker--flat
-    +tools.elevation(0)
+    @include tools.elevation(0)
 
     .v-color-picker__track:not(.v-input--is-disabled) .v-slider__thumb // High specificity
-      +tools.elevation(0)
+      @include tools.elevation(0)

package/lib/components/VColorPicker/VColorPickerPreview.sass

@@ -6,9 +6,9 @@
     .v-slider-track__background
       background-color: transparent !important
 
-      +tools.ltr()
+      @include tools.ltr()
         background-image: linear-gradient(to right, transparent, var(--v-color-picker-color-hsv))
-      +tools.rtl()
+      @include tools.rtl()
         background-image: linear-gradient(to left, transparent, var(--v-color-picker-color-hsv))
 
       &::after
@@ -44,10 +44,10 @@
   .v-color-picker-preview__hue
     &:not(.v-input--is-disabled)
       .v-slider-track__background
-        +tools.ltr()
+        @include tools.ltr()
           background: linear-gradient(to right, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%, #00F 66.66%, #F0F 83.33%, #F00 100%)
 
-        +tools.rtl()
+        @include tools.rtl()
           background: linear-gradient(to left, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%, #00F 66.66%, #F0F 83.33%, #F00 100%)
 
   .v-color-picker-preview__track

package/lib/components/VCombobox/VCombobox.css

@@ -23,7 +23,11 @@
 
 .v-combobox__content {
   overflow: hidden;
+}
+.v-combobox__content {
   box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-combobox__content {
   border-radius: 4px;
 }
 .v-combobox__mask {