fix(styles): update outdated SASS functions (#3083)

swisspost · May 14, 2024 · ad02b5b · ad02b5b
1 parent 4415fcd
commit ad02b5b
Show file tree

Hide file tree

Showing 6 changed files with 11 additions and 10 deletions.
diff --git a/packages/documentation/src/stories/foundation/layout/shared.module.scss b/packages/documentation/src/stories/foundation/layout/shared.module.scss
@@ -13,7 +13,7 @@ $breakpointNames: (
 );
 
 :export {
-  breakpoint-count: length(post.$grid-breakpoints);
+  breakpoint-count: list.length(post.$grid-breakpoints);
 
   @each $breakpoint, $value in post.$grid-breakpoints {
     $i: list.index(post.$grid-breakpoints, $breakpoint $value);

diff --git a/packages/styles/src/components/sizing.scss b/packages/styles/src/components/sizing.scss
@@ -7,7 +7,7 @@
 @use './../mixins/utilities';
 
 // Post margins, paddings and sizes
-@each $breakpoint in map-keys(breakpoints.$grid-breakpoints) {
+@each $breakpoint in map.keys(breakpoints.$grid-breakpoints) {
   @include media-breakpoint-up($breakpoint) {
     $infix: if($breakpoint == 'xs', '', '-#{$breakpoint}');
 
@@ -56,7 +56,7 @@
 }
 
 // Post breakpoints width - e.g. w-sm-100
-@each $breakpoint in map-keys(breakpoints.$grid-breakpoints) {
+@each $breakpoint in map.keys(breakpoints.$grid-breakpoints) {
   @include media-breakpoint-up($breakpoint) {
     @if $breakpoint != 'xs' {
       @each $prop, $abbrev in (width: w) {

diff --git a/packages/styles/src/functions/_color.scss b/packages/styles/src/functions/_color.scss
@@ -36,7 +36,7 @@
 
 // Source: https://gist.github.com/certainlyakey/e9c0d8f5c87ff47e3d5b
 @function encode-uri-color($string) {
-  @if type-of($string) == 'color' and str-index(#{$string}, '#') == 1 {
+  @if meta.type-of($string) == 'color' and string.index(#{$string}, '#') == 1 {
     $hex: string.slice(color.ie-hex-str($string), 4);
     $string: string.unquote('#{$hex}');
 

diff --git a/packages/styles/src/functions/_list.scss b/packages/styles/src/functions/_list.scss
@@ -1,11 +1,12 @@
 @use 'sass:list';
 @use 'sass:math';
+@use 'sass:meta';
 @use 'sass:string';
 
 @function remove-nth($list, $index) {
   $result: null;
 
-  @if type-of($index) != number {
+  @if meta.type-of($index) != number {
     @warn '$index: #{string.quote($index)} is not a number for `remove-nth`.';
   } @else if $index == 0 {
     @warn 'List index 0 must be a non-zero integer for `remove-nth`.';

diff --git a/packages/styles/src/functions/_sizing.scss b/packages/styles/src/functions/_sizing.scss
@@ -73,7 +73,7 @@
     $box-shadow: list-fn.remove-nth($box-shadow, 1);
   }
 
-  @if (utilities.starts-with-any(nth($box-shadow, -1), 'hsl', 'rgb', '#')) {
+  @if (utilities.starts-with-any(list.nth($box-shadow, -1), 'hsl', 'rgb', '#')) {
     $box-shadow: list-fn.remove-nth($box-shadow, -1);
   }
 
@@ -97,7 +97,7 @@
     $box-shadow-size: $box-shadow-size + list.nth($box-shadow, 4);
   }
 
-  @if (unit($box-shadow-size) == 'px') {
+  @if (math.unit($box-shadow-size) == 'px') {
     $box-shadow-size: math.ceil($box-shadow-size);
   }
 

diff --git a/packages/styles/src/functions/_utilities.scss b/packages/styles/src/functions/_utilities.scss
@@ -17,7 +17,7 @@
     $found-index: -2;
   }
 
-  @if (map-has-key($map, $key1)) {
+  @if (map.has-key($map, $key1)) {
     $found-index: list.index(map.keys($map), $key1);
 
     @if ($key2) {
@@ -36,12 +36,12 @@
     $sum-of-arguments: $sum-of-arguments + $value;
   }
 
-  @return math.div($sum-of-arguments, length($argList));
+  @return math.div($sum-of-arguments, list.length($argList));
 }
 
 @function starts-with-any($value, $comparable...) {
   @each $c in $comparable {
-    @if (str-index('#{$value}', $c) == 1) {
+    @if (string.index('#{$value}', $c) == 1) {
       @return true;
     }
   }