gerillass 1.6.2 → 2.0.1

package/scss/library/_sprite.scss

@@ -1,31 +1,35 @@
 @charset "UTF-8";
 
+@use "sass:list";
+@use "sass:meta";
+@use "sass:string";
+
 @mixin sprite($params...) {
-  @if length($params) == 1 {
-    @if type-of(nth($params, 1)) == "string" {
-      $str-length: str-length(nth($params, 1));
-      $str-end: str-slice(nth($params, 1), $str-length - 3);
-      @if index(".png" ".jpg" ".svg", $str-end) {
-        $image-url: nth($params, 1);
+  @if list.length($params) == 1 {
+    @if meta.type-of(list.nth($params, 1)) == "string" {
+      $str-length: string.length(list.nth($params, 1));
+      $str-end: string.slice(list.nth($params, 1), $str-length - 3);
+      @if list.index(".png" ".jpg" ".svg", $str-end) {
+        $image-url: list.nth($params, 1);
         display: inline-block;
         background-image: url($image-url);
         background-repeat: no-repeat;
       } @else {
-        @error "`#{nth($params, 1)}` is not a valid image path for `sprite`. The path must end in .png, .jpg or .svg.";
+        @error "`#{list.nth($params, 1)}` is not a valid image path for `sprite`. The path must end in .png, .jpg or .svg.";
       }
     } @else {
-      $position: nth($params, 1);
+      $position: list.nth($params, 1);
       background-position: $position;
     }
-  } @else if length($params) == 2 {
-    $image-url: nth($params, 1);
-    $position: nth($params, 2);
+  } @else if list.length($params) == 2 {
+    $image-url: list.nth($params, 1);
+    $position: list.nth($params, 2);
     display: inline-block;
     background-image: url($image-url);
     background-position: $position;
     background-repeat: no-repeat;
   } @else {
-    @error "`sprite` takes 1 or 2 arguments; you passed #{length($params)}. Pass an image path, a background position, or both in that order.";
+    @error "`sprite` takes 1 or 2 arguments; you passed #{list.length($params)}. Pass an image path, a background position, or both in that order.";
   }
   @content;
 }

package/scss/library/_stretched-link.scss

@@ -1,7 +1,9 @@
 @charset "UTF-8";
 
+@use "sass:list";
+
 @mixin stretched-link($value: "before") {
-  @if index("before" "after", $value) {
+  @if list.index("before" "after", $value) {
     &#{"::" + $value} {
       content: "";
       position: absolute;

package/scss/library/_tablet.scss

@@ -1,18 +1,22 @@
 @charset "UTF-8";
 
+@use "sass:map";
+@use "../maps/map-for-tablets" as *;
+@use "../utilities/map-deep-get" as *;
+
 @mixin tablet($device, $orientation: null) {
-  @if map-has-key($map-for-tablets, $device) {
+  @if map.has-key($map-for-tablets, $device) {
     @if $orientation == portrait or $orientation == null {
       @media only screen 
-      and (device-width: __mapDeepGet($map-for-tablets, $device, 'width')) 
-      and (device-height: __mapDeepGet($map-for-tablets, $device, 'height'))
+      and (device-width: mapDeepGet($map-for-tablets, $device, 'width')) 
+      and (device-height: mapDeepGet($map-for-tablets, $device, 'height'))
       and (orientation: portrait) {
         @content;
       }
     } @else if $orientation == landscape {
       @media only screen 
-      and (device-width: __mapDeepGet($map-for-tablets, $device, 'height')) 
-      and (device-height: __mapDeepGet($map-for-tablets, $device, 'width'))
+      and (device-width: mapDeepGet($map-for-tablets, $device, 'height')) 
+      and (device-height: mapDeepGet($map-for-tablets, $device, 'width'))
       and (orientation: landscape) {
         @content;
       }
@@ -20,6 +24,6 @@
       @error "`#{$orientation}` is not a valid $orientation for `tablet`. Pass `portrait`, `landscape`, or no orientation at all.";
     }
   } @else {
-    @error "`#{$device}` is not a device known to `tablet`. Pass one of: #{map-keys($map-for-tablets)}.";
+    @error "`#{$device}` is not a device known to `tablet`. Pass one of: #{map.keys($map-for-tablets)}.";
   }
 }

package/scss/library/_text-gradient.scss

@@ -1,18 +1,24 @@
 @charset "UTF-8";
 
+@use "sass:list";
+@use "sass:map";
+@use "sass:math";
+@use "sass:meta";
+@use "../maps/map-for-directions" as *;
+
 @mixin text-gradient($direction, $colors) {
   $list: ();
-  @for $i from 1 through length($colors) {
-    $list: append($list, nth($colors, $i), comma);
+  @for $i from 1 through list.length($colors) {
+    $list: list.append($list, list.nth($colors, $i), comma);
   }
-  @if map-has-key($map-for-directions, $direction) {
+  @if map.has-key($map-for-directions, $direction) {
     background: linear-gradient(
-      map-get($map-for-directions, $direction),
+      map.get($map-for-directions, $direction),
       $list
     );
-  } @else if not map-has-key($map-for-directions, $direction) {
-    @if type-of($direction) != "number" or not index("deg", unit($direction)) {
-      @error "`#{$direction}` is not a valid $direction for `text-gradient`. Pass an angle such as `45deg`, or one of: #{map-keys($map-for-directions)}.";
+  } @else if not map.has-key($map-for-directions, $direction) {
+    @if meta.type-of($direction) != "number" or not list.index("deg", math.unit($direction)) {
+      @error "`#{$direction}` is not a valid $direction for `text-gradient`. Pass an angle such as `45deg`, or one of: #{map.keys($map-for-directions)}.";
     } @else {
       background: linear-gradient($direction, $list);
     }

package/scss/library/_text-shadow.scss

@@ -1,31 +1,37 @@
 @charset "UTF-8";
 
+@use "sass:color";
+@use "sass:list";
+@use "sass:math";
+@use "sass:meta";
+@use "../utilities/clear-unit" as *;
+
 @mixin text-shadow($params...) {
   $value: ();
 
-  @for $i from 1 through length($params) {
+  @for $i from 1 through list.length($params) {
     // Takes each items come from $params.
-    $item: nth($params, $i);
+    $item: list.nth($params, $i);
 
     // Each group must carry at least a direction, a colour and a size. Without
-    // this the nth() calls below fail with "Invalid index", which says nothing
+    // this the list.nth() calls below fail with "Invalid index", which says nothing
     // about what the mixin wanted.
-    @if length($item) < 3 {
+    @if list.length($item) < 3 {
       @error "`#{$item}` is not a valid shadow for `text-shadow`. Each group needs a direction, a colour and a size, such as `bottom-right red 5px`. An optional blur and a fill flag may follow.";
     }
 
     // The first value comes from the $item is direction.
     // This will be used in the @if, @else statements with $size to control the offset of the shadows.
-    $direction: nth($item, 1);
+    $direction: list.nth($item, 1);
 
     // Second value is the color.
-    $color: nth($item, 2);
+    $color: list.nth($item, 2);
 
     // The third value is the actual offset value of the shadows.
-    $size: nth($item, 3);
+    $size: list.nth($item, 3);
 
     // Takes the unit of the $size value to use it later to increment the amount of shadow based on the unit.
-    $sizeUnit: unit($size);
+    $sizeUnit: math.unit($size);
 
     // The $blur argument is optional. It controls the size of the blur.
     $blur: null;
@@ -34,104 +40,104 @@
     $fill: null;
 
     // Assigns the optional sub-arguments to the actual argument.
-    @if length($item) == 4 and type-of(nth($item, 4)) == number {
-      $blur: nth($item, length($item));
-    } @else if length($item) == 4 and type-of(nth($item, 4)) == bool {
-      $fill: nth($item, length($item));
-    } @else if length($item) == 5 {
-      $blur: nth($item, 4);
-      $fill: nth($item, length($item));
+    @if list.length($item) == 4 and meta.type-of(list.nth($item, 4)) == number {
+      $blur: list.nth($item, list.length($item));
+    } @else if list.length($item) == 4 and meta.type-of(list.nth($item, 4)) == bool {
+      $fill: list.nth($item, list.length($item));
+    } @else if list.length($item) == 5 {
+      $blur: list.nth($item, 4);
+      $fill: list.nth($item, list.length($item));
     }
 
     // The code below changes the angle of $direction of the shadow based on the predefined values.
     @if $direction == "top" {
       @if $fill == true {
-        // The __clearUnit(); function is used here due to it is not possible to count $size with a unit. First, it clears the unit from the $size argument and then adds it back again in the @for loop.
-        @for $i from 1 through __clearUnit($size) {
+        // The clearUnit(); function is used here due to it is not possible to count $size with a unit. First, it clears the unit from the $size argument and then adds it back again in the @for loop.
+        @for $i from 1 through clearUnit($size) {
           $increase: $i * 1 + $sizeUnit;
           $shadow: 0 -#{$increase} $blur $color;
-          $value: append($value, $shadow, comma);
+          $value: list.append($value, $shadow, comma);
         }
       } @else {
         $shadow: 0 -#{$size} $blur $color;
-        $value: append($value, $shadow, comma);
+        $value: list.append($value, $shadow, comma);
       }
     } @else if $direction == "top-left" {
       @if $fill == true {
-        @for $i from 1 through __clearUnit($size) {
+        @for $i from 1 through clearUnit($size) {
           $increase: $i * 1 + $sizeUnit;
           $shadow: -#{$increase} -#{$increase} $blur $color;
-          $value: append($value, $shadow, comma);
+          $value: list.append($value, $shadow, comma);
         }
       } @else {
         $shadow: -#{$size} -#{$size} $blur $color;
-        $value: append($value, $shadow, comma);
+        $value: list.append($value, $shadow, comma);
       }
     } @else if $direction == "top-right" {
       @if $fill == true {
-        @for $i from 1 through __clearUnit($size) {
+        @for $i from 1 through clearUnit($size) {
           $increase: $i * 1 + $sizeUnit;
           $shadow: #{$increase} -#{$increase} $blur $color;
-          $value: append($value, $shadow, comma);
+          $value: list.append($value, $shadow, comma);
         }
       } @else {
         $shadow: #{$size} -#{$size} $blur $color;
-        $value: append($value, $shadow, comma);
+        $value: list.append($value, $shadow, comma);
       }
     } @else if $direction == "bottom" {
       @if $fill == true {
-        @for $i from 1 through __clearUnit($size) {
+        @for $i from 1 through clearUnit($size) {
           $increase: $i * 1 + $sizeUnit;
           $shadow: 0 #{$increase} $blur $color;
-          $value: append($value, $shadow, comma);
+          $value: list.append($value, $shadow, comma);
         }
       } @else {
         $shadow: 0 #{$size} $blur $color;
-        $value: append($value, $shadow, comma);
+        $value: list.append($value, $shadow, comma);
       }
     } @else if $direction == "bottom-left" {
       @if $fill == true {
-        @for $i from 1 through __clearUnit($size) {
+        @for $i from 1 through clearUnit($size) {
           $increase: $i * 1 + $sizeUnit;
           $shadow: -#{$increase} #{$increase} $blur $color;
-          $value: append($value, $shadow, comma);
+          $value: list.append($value, $shadow, comma);
         }
       } @else {
         $shadow: -#{$size} #{$size} $blur $color;
-        $value: append($value, $shadow, comma);
+        $value: list.append($value, $shadow, comma);
       }
     } @else if $direction == "bottom-right" {
       @if $fill == true {
-        @for $i from 1 through __clearUnit($size) {
+        @for $i from 1 through clearUnit($size) {
           $increase: $i * 1 + $sizeUnit;
           $shadow: #{$increase} #{$increase} $blur $color;
-          $value: append($value, $shadow, comma);
+          $value: list.append($value, $shadow, comma);
         }
       } @else {
         $shadow: #{$size} #{$size} $blur $color;
-        $value: append($value, $shadow, comma);
+        $value: list.append($value, $shadow, comma);
       }
     } @else if $direction == "left" {
       @if $fill == true {
-        @for $i from 1 through __clearUnit($size) {
+        @for $i from 1 through clearUnit($size) {
           $increase: $i * 1 + $sizeUnit;
           $shadow: -#{$increase} 0 $blur $color;
-          $value: append($value, $shadow, comma);
+          $value: list.append($value, $shadow, comma);
         }
       } @else {
         $shadow: -#{$size} 0 $blur $color;
-        $value: append($value, $shadow, comma);
+        $value: list.append($value, $shadow, comma);
       }
     } @else if $direction == "right" {
       @if $fill == true {
-        @for $i from 1 through __clearUnit($size) {
+        @for $i from 1 through clearUnit($size) {
           $increase: $i * 1 + $sizeUnit;
           $shadow: #{$increase} 0 $blur $color;
-          $value: append($value, $shadow, comma);
+          $value: list.append($value, $shadow, comma);
         }
       } @else {
         $shadow: #{$size} 0 $blur $color;
-        $value: append($value, $shadow, comma);
+        $value: list.append($value, $shadow, comma);
       }
     }
   }

package/scss/library/_triangle.scss

@@ -1,8 +1,13 @@
 @charset "UTF-8";
 
+@use "sass:list";
+@use "sass:math";
+@use "../lists/list-of-directions" as *;
+@use "../utilities/is-color" as *;
+
 @mixin triangle($direction: "bottom", $color: black, $size: 10px 8px) {
-  @if index($list-of-directions, $direction) {
-    @if __isColor($color){
+  @if list.index($list-of-directions, $direction) {
+    @if isColor($color){
       content: "";
       height: 0;
       width: 0;
@@ -10,28 +15,28 @@
       border-style: solid;
       @if $direction == "top"{
         border-color: transparent transparent $color;
-        border-width: 0 math.div(nth($size, 1), 2) if(length($size) == 2, nth($size, 2), nth($size, 1));
+        border-width: 0 math.div(list.nth($size, 1), 2) if(list.length($size) == 2, list.nth($size, 2), list.nth($size, 1));
       } @else if $direction == "top-right" {
         border-color: transparent $color transparent transparent;
-        border-width: 0 nth($size, 1) nth($size, 1) 0;
+        border-width: 0 list.nth($size, 1) list.nth($size, 1) 0;
       } @else if $direction == "right" {
         border-color: transparent transparent transparent $color;
-        border-width: math.div(if(length($size) == 2, nth($size, 2), nth($size, 1)),  2) 0 math.div(if(length($size) == 2, nth($size, 2), nth($size, 1)), 2) nth($size, 1);
+        border-width: math.div(if(list.length($size) == 2, list.nth($size, 2), list.nth($size, 1)),  2) 0 math.div(if(list.length($size) == 2, list.nth($size, 2), list.nth($size, 1)), 2) list.nth($size, 1);
       } @else if $direction == "bottom-right" {
         border-color: transparent transparent $color;
-        border-width: 0 0 nth($size, 1) nth($size, 1);
+        border-width: 0 0 list.nth($size, 1) list.nth($size, 1);
       } @else if $direction == "bottom" {
         border-color: $color transparent transparent;
-        border-width: if(length($size) == 2, nth($size, 2), nth($size, 1)) math.div(nth($size, 1), 2) 0;
+        border-width: if(list.length($size) == 2, list.nth($size, 2), list.nth($size, 1)) math.div(list.nth($size, 1), 2) 0;
       } @else if $direction == "bottom-left" {
         border-color: transparent transparent transparent $color;
-        border-width: nth($size, 1) 0 0 nth($size, 1);
+        border-width: list.nth($size, 1) 0 0 list.nth($size, 1);
       } @else if $direction == "left" {
         border-color: transparent $color transparent transparent;
-        border-width: math.div(if(length($size) == 2, nth($size, 2), nth($size, 1)), 2) nth($size, 1) math.div(if(length($size) == 2, nth($size, 2), nth($size, 1)), 2) 0;
+        border-width: math.div(if(list.length($size) == 2, list.nth($size, 2), list.nth($size, 1)), 2) list.nth($size, 1) math.div(if(list.length($size) == 2, list.nth($size, 2), list.nth($size, 1)), 2) 0;
       } @else if $direction == "top-left" {
         border-color: $color transparent transparent;
-        border-width: nth($size, 1) nth($size, 1) 0 0;
+        border-width: list.nth($size, 1) list.nth($size, 1) 0 0;
       }
       @content;
     }

package/scss/lists/_index.scss

@@ -0,0 +1,8 @@
+@charset "UTF-8";
+
+@forward "list-of-anchor-pseudo-classes";
+@forward "list-of-buttons";
+@forward "list-of-counter-styles";
+@forward "list-of-directions";
+@forward "list-of-length-units";
+@forward "list-of-text-inputs";

package/scss/maps/_index.scss

@@ -0,0 +1,8 @@
+@charset "UTF-8";
+
+@forward "map-for-breakpoints";
+@forward "map-for-directions";
+@forward "map-for-font-formats";
+@forward "map-for-positions";
+@forward "map-for-smartphones";
+@forward "map-for-tablets";

package/scss/utilities/_clear-unit.scss

@@ -1,5 +1,7 @@
 @charset "UTF-8";
 
-@function __clearUnit($value) {
+@use "sass:math";
+
+@function clearUnit($value) {
   @return math.div($value, ($value * 0 + 1));
 }

package/scss/utilities/_clear-whitespace.scss

@@ -1,12 +1,15 @@
 @charset "UTF-8";
 
-@function __clearWhitespace($string) {
-  @if type-of($string) != "string" {
-    @error "`#{$string}` is not a valid $string for `__clearWhitespace`. Pass a string.";
+@use "sass:meta";
+@use "sass:string";
+
+@function clearWhitespace($string) {
+  @if meta.type-of($string) != "string" {
+    @error "`#{$string}` is not a valid $string for `clearWhitespace`. Pass a string.";
   }
-  @while (str-index($string, " ") != null) {
-    $index: str-index($string, " ");
-    $string: "#{str-slice($string, 0, $index - 1)}#{str-slice($string, $index + 1)}";
+  @while (string.index($string, " ") != null) {
+    $index: string.index($string, " ");
+    $string: "#{string.slice($string, 0, $index - 1)}#{string.slice($string, $index + 1)}";
   }
   @return $string;
 }

package/scss/utilities/_convert-to-em.scss

@@ -1,7 +1,10 @@
 @charset "UTF-8";
 
-@function __convertToEm($value) {
+@use "sass:string";
+@use "sass:math";
+
+@function convertToEm($value) {
   $base-value: 16px;
   $rem-value: math.div($value, $base-value);
-  @return $rem-value + unquote("em");
+  @return $rem-value + string.unquote("em");
 }

package/scss/utilities/_convert-to-number.scss

@@ -1,20 +1,24 @@
 @charset "UTF-8";
 
-@function __convertToNumber($value) {
+@use "sass:list";
+@use "sass:meta";
+@use "sass:string";
 
-  @if type-of($value) != "string" {
-    @error "`#{$value}` is not a valid $value for `__convertToNumber`. Pass a string made only of digits, such as `\"42\"`.";
+@function convertToNumber($value) {
+
+  @if meta.type-of($value) != "string" {
+    @error "`#{$value}` is not a valid $value for `convertToNumber`. Pass a string made only of digits, such as `\"42\"`.";
   }
 
   $string-numerals: "0" "1" "2" "3" "4" "5" "6" "7" "8" "9";
   $calc: 0;
 
-  @for $i from 1 through str-length($value) {
+  @for $i from 1 through string.length($value) {
     //Takes every digits in the $value
-    $digit: str-slice($value, $i, $i);
+    $digit: string.slice($value, $i, $i);
 
     //Finds the index position of $digit in the $value
-    $index-of-digit: index($string-numerals, $digit);
+    $index-of-digit: list.index($string-numerals, $digit);
 
     // That is because SASS strings are not "0" based but "1", the index position of every digits will be more by one. Here is the simple calculation to find the actual number.
     $actual-digit: $index-of-digit - 1;

package/scss/utilities/_fill-nulls.scss

@@ -0,0 +1,18 @@
+@charset "UTF-8";
+
+@use "sass:list";
+
+@function fillNulls($value, $seperation: comma, $skip: false) {
+  @if not list.index("comma" "space" "slash", $seperation) {
+    @error "`#{$seperation}` is not a valid $seperation for `fillNulls`. Pass `comma`, `space` or `slash`.";
+  }
+  $list: ();
+  @for $i from 1 through list.length($value) {
+    @if list.nth($value, $i) == null {
+      $list: list.append($list, if($skip, null, 0), $seperation);
+    } @else {
+      $list: list.append($list, list.nth($value, $i), $seperation);
+    }
+  }
+  @return $list;
+}

package/scss/utilities/_font-sizer.scss

@@ -1,5 +1,5 @@
 @charset "UTF-8";
 
-@function __fontSizer($size, $time) {
+@function fontSizer($size, $time) {
   @return $size * $time;
 }

package/scss/utilities/_font-source.scss

@@ -1,17 +1,22 @@
 @charset "UTF-8";
 
-@function __fontSource($font-family, $file-path, $file-formats) {
+@use "sass:list";
+@use "sass:map";
+@use "../maps/map-for-font-formats" as *;
+@use "../utilities/clear-whitespace" as *;
+
+@function fontSource($font-family, $file-path, $file-formats) {
   $list: ();
-  @if map-has-key($map-for-font-formats, $file-formats) {
-    @if index(eot woff2 woff ttf, $file-formats) {
-      $src-value: url('#{$file-path}.#{if(not index(eot, $file-formats), $file-formats, $file-formats+"?#iefix")}')
-        #{map-get($map-for-font-formats, $file-formats)};
-      $list: append($list, $src-value, comma);
-    } @else if index(svg, $file-formats) {
-      $font-family: __clearWhitespace($font-family);
+  @if map.has-key($map-for-font-formats, $file-formats) {
+    @if list.index(eot woff2 woff ttf, $file-formats) {
+      $src-value: url('#{$file-path}.#{if(not list.index(eot, $file-formats), $file-formats, $file-formats+"?#iefix")}')
+        #{map.get($map-for-font-formats, $file-formats)};
+      $list: list.append($list, $src-value, comma);
+    } @else if list.index(svg, $file-formats) {
+      $font-family: clearWhitespace($font-family);
       $src-value: url('#{$file-path}.#{$file-formats + "#" + $font-family}')
-        #{map-get($map-for-font-formats, $file-formats)};
-      $list: append($list, $src-value, comma);
+        #{map.get($map-for-font-formats, $file-formats)};
+      $list: list.append($list, $src-value, comma);
     }
   }
   @return $list;

package/scss/utilities/_index.scss

@@ -0,0 +1,24 @@
+@charset "UTF-8";
+
+@forward "clear-unit";
+@forward "clear-whitespace";
+@forward "convert-to-em";
+@forward "convert-to-number";
+@forward "fill-nulls";
+@forward "font-sizer";
+@forward "font-source";
+@forward "is-color";
+@forward "is-gutter";
+@forward "is-number";
+@forward "is-time";
+@forward "map-deep-get";
+@forward "pixelify";
+@forward "pseudo-selector";
+@forward "remify";
+@forward "shade";
+@forward "shorthand-property";
+@forward "tint";
+@forward "validate-breakpoint";
+@forward "validate-length";
+@forward "validate-ratio";
+@forward "validate-scissors";

package/scss/utilities/_is-color.scss

@@ -1,12 +1,15 @@
 @charset "UTF-8";
 
-@function __isColor($value) {
+@use "sass:list";
+@use "sass:meta";
+
+@function isColor($value) {
   $list: ();
-  @for $i from 1 through length($value) {
-    @if type-of(nth($value, $i)) == "color" {
-      $list: append($list, nth($value, $i), comma);
+  @for $i from 1 through list.length($value) {
+    @if meta.type-of(list.nth($value, $i)) == "color" {
+      $list: list.append($list, list.nth($value, $i), comma);
     } @else {
-      @error "'#{nth($value, $i)}' is not a color value, please replace it with a valid one.";
+      @error "'#{list.nth($value, $i)}' is not a color value, please replace it with a valid one.";
     }
   }
   @return $list;

package/scss/utilities/_is-gutter.scss

@@ -1,20 +1,23 @@
 @charset "UTF-8";
 
+@use "sass:meta";
+@use "sass:string";
+
 // True for anything that can legally sit where a CSS length is expected: a
 // number, a Sass calculation such as calc() or clamp(), or an unquoted string
 // holding a parenthesis, which is how var() and env() arrive.
 //
-// Written because `type-of($value) == number` rejects `var(--gap)`, and a
+// Written because `meta.type-of($value) == number` rejects `var(--gap)`, and a
 // gutter expressed as a custom property is perfectly reasonable CSS.
 
-@function __isGutter($value) {
-  @if type-of($value) == "number" {
+@function isGutter($value) {
+  @if meta.type-of($value) == "number" {
     @return true;
   }
-  @if type-of($value) == "calculation" {
+  @if meta.type-of($value) == "calculation" {
     @return true;
   }
-  @if type-of($value) == "string" and str-index(quote($value), "(") {
+  @if meta.type-of($value) == "string" and string.index(string.quote($value), "(") {
     @return true;
   }
   @return false;

package/scss/utilities/_is-number.scss

@@ -1,7 +1,9 @@
 @charset "UTF-8";
 
-@function __isNumber($value) {
-  @if type-of($value) == "number" {
+@use "sass:meta";
+
+@function isNumber($value) {
+  @if meta.type-of($value) == "number" {
     @return $value;
   } @else {
     @warn "Please make sure you pass a valid number!";

package/scss/utilities/_is-time.scss

@@ -1,6 +1,11 @@
-@function __isTime($value) {
-  @for $i from 1 through length($value) {
-    @if (type-of($value) == "number" and index("ms" "s", unit($value)) != null) or $value == 0 {
+
+@use "sass:list";
+@use "sass:math";
+@use "sass:meta";
+
+@function isTime($value) {
+  @for $i from 1 through list.length($value) {
+    @if (meta.type-of($value) == "number" and list.index("ms" "s", math.unit($value)) != null) or $value == 0 {
       @return $value;
     } @else {
       @error "'#{$value}' is not a valid time value. Time values must be specified in either seconds (s) or milliseconds (ms). Please try one of the following forms: '1s', '0.2s', or '3ms'";

package/scss/utilities/_map-deep-get.scss

@@ -1,8 +1,10 @@
 @charset "UTF-8";
 
-@function __mapDeepGet($map, $keys...) {
+@use "sass:map";
+
+@function mapDeepGet($map, $keys...) {
   @each $key in $keys {
-    $map: map-get($map, $key);
+    $map: map.get($map, $key);
   }
   @return $map;
 }