update sass usage

KurtGokhan · KurtGokhan · commit 33a9046c646e · 2024-11-17T14:29:50.000+03:00
diff --git a/package.json b/package.json
@@ -52,17 +52,17 @@
     "pack": "yarn pack"
   },
   "dependencies": {
-    "clsx": "^2.1.0",
+    "clsx": "^2.1.1",
     "memoize-one": "^6.0.0"
   },
   "devDependencies": {
-    "@reactunity/renderer": "^0.18.0",
-    "@reactunity/scripts": "^0.18.3",
-    "concurrently": "^8.2.2",
+    "@reactunity/renderer": "^0.19.1",
+    "@reactunity/scripts": "^0.19.2",
+    "concurrently": "^9.1.0",
     "copyfiles": "^2.4.1",
     "onchange": "^7.1.0",
-    "rimraf": "^5.0.5",
-    "typescript": "^5.4.4"
+    "rimraf": "^6.0.1",
+    "typescript": "^5.6.3"
   },
   "peerDependencies": {
     "@reactunity/renderer": "*",
diff --git a/src/alert/index.module.scss b/src/alert/index.module.scss
@@ -1,2 +1,2 @@
-@import "../styles/variables";
-@import "../styles/common/dialog";
+@use "../styles/variables";
+@use "../styles/common/dialog";
diff --git a/src/confirm/index.module.scss b/src/confirm/index.module.scss
@@ -1,2 +1,2 @@
-@import "../styles/variables";
-@import "../styles/common/dialog";
+@use "../styles/variables";
+@use "../styles/common/dialog";
diff --git a/src/input/index.module.scss b/src/input/index.module.scss
@@ -1,4 +1,4 @@
-@import "../styles";
+@use "../styles";
 
 $textColor: black;
 $focusedColor: black;
diff --git a/src/modal/index.module.scss b/src/modal/index.module.scss
@@ -1,4 +1,4 @@
-@import "../styles";
+@use "../styles" as helpers;
 
 .host {
   z-index: 1000;
@@ -11,7 +11,7 @@
   overflow: auto;
   overscroll-behavior: contain;
 
-  @include fullCover();
+  @include helpers.fullCover();
 
   &.opened {
     animation: appearAnim 400ms both;
@@ -54,7 +54,7 @@
 }
 
 .content {
-  @include elevation(5);
+  @include helpers.elevation(5);
 
   font-size: 1rem;
   box-sizing: border-box;
@@ -70,7 +70,7 @@
   border-radius: 50%;
   background-color: #bfbcbc;
   color: black;
-  @include elevation(2);
+  @include helpers.elevation(2);
 
   position: absolute;
   transform: translate(50%, -50%) scale(0.8);
diff --git a/src/prompt/index.module.scss b/src/prompt/index.module.scss
@@ -1,5 +1,5 @@
-@import "../styles/variables";
-@import "../styles/common/dialog";
+@use "../styles/variables";
+@use "../styles/common/dialog";
 
 .input {
   font-size: 1em;
diff --git a/src/styles/common/dialog.scss b/src/styles/common/dialog.scss
@@ -1,4 +1,4 @@
-@import "..";
+@use "../index.scss" as index;
 
 .host :global(.mat-modal-content) {
   padding: 18px;
@@ -24,7 +24,7 @@
 .error {
   font-size: 1em;
   margin-top: 8px;
-  color: $error;
+  color: index.$error;
 }
 
 .buttons {
diff --git a/src/styles/globals.scss b/src/styles/globals.scss
@@ -1,12 +1,12 @@
-@import "./elevation";
+@use "./elevation" as el;
 
 .mat-elevation-0 {
   box-shadow: none;
 }
 
 @for $var from 1 to 24 {
   .mat-elevation-#{$var} {
-    @include elevation($var);
+    @include el.elevation($var);
     transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
   }
 }
diff --git a/src/styles/index.scss b/src/styles/index.scss
@@ -1,3 +1,3 @@
-@import "./helpers";
-@import "./elevation";
-@import "./variables";
+@forward "./helpers";
+@forward "./elevation";
+@forward "./variables";
diff --git a/src/text/index.module.scss b/src/text/index.module.scss
@@ -1,4 +1,4 @@
-@import "../styles";
+@use "../styles";
 
 .host {
   .input {

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-@import "../styles";`
	`1`	`+@use "../styles";`
`2`	`2`
`3`	`3`	`$textColor: black;`
`4`	`4`	`$focusedColor: black;`
Original file line number	Diff line number	Diff line change
`@@ -1,12 +1,12 @@`
`1`		`-@import "./elevation";`
	`1`	`+@use "./elevation" as el;`
`2`	`2`
`3`	`3`	`.mat-elevation-0 {`
`4`	`4`	`box-shadow: none;`
`5`	`5`	`}`
`6`	`6`
`7`	`7`	`@for $var from 1 to 24 {`
`8`	`8`	`.mat-elevation-#{$var} {`
`9`		`- @include elevation($var);`
	`9`	`+ @include el.elevation($var);`
`10`	`10`	`transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;`
`11`	`11`	`}`
`12`	`12`	`}`