From 813851b67c18b20eed93c01e7578e8ce1b7040a0 Mon Sep 17 00:00:00 2001
From: Emil Petrov <epetrov@progress.com>
Date: Mon, 4 Nov 2024 14:02:05 +0200
Subject: [PATCH] feat: migrate kendo-icons to dart-sass module system

BREAKING CHANGE

Starting with the R4 2024 release the Kendo Font and SVG icons are now
migrated to the SASS module system. This breaking change is due to the
`node-sass` package reaching its official end of life.

For more information, please refer to the following links:

* https://sass-lang.com/blog/the-module-system-is-launched/
* https://github.com/sass/node-sass/commit/107ded9434cfca43dbd9dfbaeb5c349228bf5cee
---
 packages/font-icons/scss/_variables.scss | 2 ++
 packages/font-icons/scss/all.scss        | 3 ++-
 packages/font-icons/scss/index.scss      | 8 +++++---
 packages/svg-icons/scss/all.scss         | 3 ++-
 packages/svg-icons/scss/index.scss       | 5 +++--
 5 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/packages/font-icons/scss/_variables.scss b/packages/font-icons/scss/_variables.scss
index c26369a6..fc9b3818 100644
--- a/packages/font-icons/scss/_variables.scss
+++ b/packages/font-icons/scss/_variables.scss
@@ -1,3 +1,5 @@
+@use "./_font.scss" as *;
+
 $ki-font-family: "WebComponentsIcons" !default;
 $ki-icon-size: 16px !default;
 
diff --git a/packages/font-icons/scss/all.scss b/packages/font-icons/scss/all.scss
index 23d1f1f8..6bf13d40 100644
--- a/packages/font-icons/scss/all.scss
+++ b/packages/font-icons/scss/all.scss
@@ -1,3 +1,4 @@
-@import "index.scss";
+@forward "index.scss";
+@use "index.scss" as *;
 
 @include kendo-font-icon-styles();
diff --git a/packages/font-icons/scss/index.scss b/packages/font-icons/scss/index.scss
index ae6a2dfa..5d705c25 100644
--- a/packages/font-icons/scss/index.scss
+++ b/packages/font-icons/scss/index.scss
@@ -1,6 +1,8 @@
-@import "_font.scss";
-@import "_variables.scss";
-@import "_icon-list.scss";
+@forward "_variables.scss";
+
+@use "_font.scss" as *;
+@use "_variables.scss" as *;
+@use "_icon-list.scss" as *;
 
 @mixin kendo-font-icon-styles() {
 
diff --git a/packages/svg-icons/scss/all.scss b/packages/svg-icons/scss/all.scss
index 58125da6..1e9ca84e 100644
--- a/packages/svg-icons/scss/all.scss
+++ b/packages/svg-icons/scss/all.scss
@@ -1,3 +1,4 @@
-@import "index.scss";
+@forward "index.scss";
+@use "index.scss" as *;
 
 @include kendo-svg-icon-styles();
diff --git a/packages/svg-icons/scss/index.scss b/packages/svg-icons/scss/index.scss
index d1ff30c5..a1714515 100644
--- a/packages/svg-icons/scss/index.scss
+++ b/packages/svg-icons/scss/index.scss
@@ -1,4 +1,5 @@
-@import "_variables.scss";
+@forward "_variables.scss";
+@use "_variables.scss" as *;
 
 @mixin kendo-svg-icon-styles() {
 
@@ -51,7 +52,7 @@
             height: $ki-icon-size-xxxl;
         }
     }
-    
+
 
     // Flip
     .k-flip-h,