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

package/lib/styles/tools/_absolute.sass

@@ -1,8 +1,9 @@
 @mixin absolute($pseudo: false)
-  @if ($pseudo)
-    content: ''
-  position: absolute
-  top: 0
-  left: 0
-  width: 100%
-  height: 100%
+  &
+    @if ($pseudo)
+      content: ''
+    position: absolute
+    top: 0
+    left: 0
+    width: 100%
+    height: 100%

package/lib/styles/tools/_border.sass

@@ -1,7 +1,8 @@
 @mixin border($color: null, $style: null, $width: null, $thin-width: false, $important: false)
-  border-color: $color if($important, !important, null)
-  border-style: $style if($important, !important, null)
-  border-width: $width if($important, !important, null)
+  &
+    border-color: $color if($important, !important, null)
+    border-style: $style if($important, !important, null)
+    border-width: $width if($important, !important, null)
 
   @if $thin-width
     &--border

package/lib/styles/tools/_display.sass

@@ -2,13 +2,14 @@
 @use '../settings' as *
 
 @mixin visually-hidden
-  position: absolute !important
-  height: 1px
-  width: 1px
-  overflow: hidden
-  clip: rect(1px, 1px, 1px, 1px)
-  white-space: nowrap
-  display: initial
+  &
+    position: absolute !important
+    height: 1px
+    width: 1px
+    overflow: hidden
+    clip: rect(1px, 1px, 1px, 1px)
+    white-space: nowrap
+    display: initial
 
 =media-breakpoint-up($name, $breakpoints: $grid-breakpoints)
   $min: breakpoint-min($name, $breakpoints)

package/lib/styles/tools/_elevation.sass

@@ -2,7 +2,9 @@
 @use '../settings'
 
 @mixin elevation($z, $important: false)
-  box-shadow: map.get(settings.$shadow-key-umbra, $z), map.get(settings.$shadow-key-penumbra, $z), map.get(settings.$shadow-key-ambient, $z) if($important, !important, null)
+  &
+    box-shadow: map.get(settings.$shadow-key-umbra, $z), map.get(settings.$shadow-key-penumbra, $z), map.get(settings.$shadow-key-ambient, $z) if($important, !important, null)
 
 @mixin elevationTransition($duration: 280ms, $easing: cubic-bezier(0.4, 0, 0.2, 1))
-  transition: box-shadow $duration $easing
+  &
+    transition: box-shadow $duration $easing

package/lib/styles/tools/_index.sass

@@ -9,7 +9,6 @@
 @forward '_radius'
 @forward '_rounded'
 @forward '_rtl'
-@forward '_sheet'
 @forward '_states'
 @forward '_theme'
 @forward '_typography'

package/lib/styles/tools/_radius.sass

@@ -2,8 +2,9 @@
 @use '../settings'
 
 @mixin radius($r, $important: false)
-  // Key exists within the $rounded variable
-  @if (map.has-key(settings.$rounded, $r))
-    border-radius: map.get(settings.$rounded, $r) if($important, !important, null)
-  @else
-    border-radius: $r if($important, !important, null)
+  &
+    // Key exists within the $rounded variable
+    @if (map.has-key(settings.$rounded, $r))
+      border-radius: map.get(settings.$rounded, $r) if($important, !important, null)
+    @else
+      border-radius: $r if($important, !important, null)

package/lib/styles/tools/_rounded.sass

@@ -1,2 +1,3 @@
 @mixin rounded($radius: null, $important: false)
-  border-radius: $radius if($important, !important, null)
+  &
+    border-radius: $radius if($important, !important, null)

package/lib/styles/tools/_theme.sass

@@ -1,3 +1,4 @@
 @mixin theme ($background, $color)
-  background: $background
-  color: $color
+  &
+    background: $background
+    color: $color

package/lib/styles/tools/_typography.sass

@@ -1,6 +1,7 @@
 @mixin typography ($font-size, $font-weight, $letter-spacing, $line-height, $text-transform)
-  font-size: $font-size
-  font-weight: $font-weight
-  letter-spacing: $letter-spacing
-  line-height: $line-height
-  text-transform: $text-transform
+  &
+    font-size: $font-size
+    font-weight: $font-weight
+    letter-spacing: $letter-spacing
+    line-height: $line-height
+    text-transform: $text-transform

package/lib/styles/tools/_utilities.sass

@@ -24,21 +24,21 @@
         // https://github.com/sass/sass/issues/626
         @if $mixin == 'ltr'
           .v-locale--is-ltr
-            +generate-utility-body($utility, list.nth($dir, 2), $value, $infix)
+            @include generate-utility-body($utility, list.nth($dir, 2), $value, $infix)
         @else if $mixin == 'rtl'
           .v-locale--is-rtl
-            +generate-utility-body($utility, list.nth($dir, 2), $value, $infix)
+            @include generate-utility-body($utility, list.nth($dir, 2), $value, $infix)
         @else
           @error 'Only RTL and LTR are supported'
     @else
       @if $forceDir == 'ltr'
         .v-locale--is-ltr
-          +generate-utility-body($utility, $properties, $value, $infix)
+          @include generate-utility-body($utility, $properties, $value, $infix)
       @else if $forceDir == 'rtl'
         .v-locale--is-rtl
-          +generate-utility-body($utility, $properties, $value, $infix)
+          @include generate-utility-body($utility, $properties, $value, $infix)
       @else
-        +generate-utility-body($utility, $properties, $value, $infix)
+        @include generate-utility-body($utility, $properties, $value, $infix)
 
 =generate-utility-body($utility, $properties, $value, $infix)
   // Use custom class if present

package/lib/styles/utilities/_index.sass

@@ -10,7 +10,7 @@
 @include tools.layer('utilities')
   @each $breakpoint in map.keys(settings.$grid-breakpoints)
     // Generate media query if needed
-    +tools.media-breakpoint-up($breakpoint)
+    @include tools.media-breakpoint-up($breakpoint)
       $infix: tools.breakpoint-infix($breakpoint, settings.$grid-breakpoints)
 
       // Loop over each utility property
@@ -19,13 +19,13 @@
         // Only proceed if responsive media queries are enabled or if it's the base media query
         @if string.slice($key, -4) == ':ltr'
           @if meta.type-of($utility) == "map" and (map.get($utility, responsive) or $infix == "")
-            +tools.generate-utility($utility, $infix, 'ltr')
+            @include tools.generate-utility($utility, $infix, 'ltr')
         @else if string.slice($key, -4) == ':rtl'
           @if meta.type-of($utility) == "map" and (map.get($utility, responsive) or $infix == "")
-            +tools.generate-utility($utility, $infix, 'rtl')
+            @include tools.generate-utility($utility, $infix, 'rtl')
         @else
           @if meta.type-of($utility) == "map" and (map.get($utility, responsive) or $infix == "")
-            +tools.generate-utility($utility, $infix, 'bidi')
+            @include tools.generate-utility($utility, $infix, 'bidi')
 
   // Print utilities
   @media print
@@ -34,10 +34,10 @@
       // Then check if the utility needs print styles
       @if string.slice($key, -4) == ':ltr'
         @if meta.type-of($utility) == "map" and map.get($utility, print) == true
-          +tools.generate-utility($utility, "-print", 'ltr')
+          @include tools.generate-utility($utility, "-print", 'ltr')
       @else if string.slice($key, -4) == ':rtl'
         @if meta.type-of($utility) == "map" and map.get($utility, print) == true
-          +tools.generate-utility($utility, "-print", 'rtl')
+          @include tools.generate-utility($utility, "-print", 'rtl')
       @else
         @if meta.type-of($utility) == "map" and map.get($utility, print) == true
-          +tools.generate-utility($utility, "-print", 'bidi')
+          @include tools.generate-utility($utility, "-print", 'bidi')

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vuetify/nightly",
   "description": "Vue Material Component Framework",
-  "version": "3.7.0-beta.1-dev.2024-07-30",
+  "version": "3.7.0-beta.1-dev.2024-08-01",
   "author": {
     "name": "John Leider",
     "email": "john@vuetifyjs.com"

package/lib/styles/tools/_sheet.sass

@@ -1,14 +0,0 @@
-@mixin paper ($elevation, $radius, $shaped-radius)
-  @include tools.radius($radius)
-
-  &:not(.v-sheet--outlined)
-    @include tools.elevation($elevation)
-
-  @if ($shaped-radius)
-    &.v-sheet--shaped
-      @include tools.radius($shaped-radius)
-
-
-@mixin sheet ($component, $elevation, $radius, $shaped-radius)
-  .v-sheet.#{$component}
-    @include paper($elevation, $radius, $shaped-radius)