From 22d28d6e8bfd4eaef18098d778071b29dfecb963 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jan=20Kry=C5=A1p=C3=ADn?= <crishpeen@gmail.com>
Date: Thu, 9 May 2024 11:42:43 +0200
Subject: [PATCH] fixup! Refactor(web): Refactor placement transformation to
 allow input of logical placements

---
 .../scss/tools/__tests__/_placement.test.scss  |  4 ++--
 packages/web/src/scss/tools/_placement.scss    | 18 +++++++-----------
 2 files changed, 9 insertions(+), 13 deletions(-)

diff --git a/packages/web/src/scss/tools/__tests__/_placement.test.scss b/packages/web/src/scss/tools/__tests__/_placement.test.scss
index 13d9e903e0..6162a28d89 100644
--- a/packages/web/src/scss/tools/__tests__/_placement.test.scss
+++ b/packages/web/src/scss/tools/__tests__/_placement.test.scss
@@ -93,7 +93,7 @@
                             $cross-axis-inverse: true,
                             $cross-axis-physical: true
                         )};
-                    --transform-left-top-spaces: #{placement.transform('left-top', $hyphenate: false)};
+                    --transform-left-top-spaces: #{placement.transform('left-top', $join-with: ' ')};
                 }
                 @include true.expect {
                     --transform-left: left;
@@ -130,7 +130,7 @@
                             $cross-axis-inverse: true,
                             $cross-axis-physical: true
                         )};
-                    --transform-top-start-spaces: #{placement.transform('top-start', $hyphenate: false)};
+                    --transform-top-start-spaces: #{placement.transform('top-start', $join-with: ' ')};
                 }
                 @include true.expect {
                     --transform-top-start: top-start;
diff --git a/packages/web/src/scss/tools/_placement.scss b/packages/web/src/scss/tools/_placement.scss
index b4c5b72ff3..cbf3a97707 100644
--- a/packages/web/src/scss/tools/_placement.scss
+++ b/packages/web/src/scss/tools/_placement.scss
@@ -73,6 +73,8 @@ $_logical-to-physical-placement-map: (
     ),
 );
 
+$_hyphen: '-';
+
 @function -get-arrow-translate-map($prefix) {
     @return (
         top: -50% 0%,
@@ -122,11 +124,7 @@ $_logical-to-physical-placement-map: (
 // Example: get-cross-axis-direction('left') will return 'vertical'
 // Example: get-cross-axis-direction('bottom') will return 'horizontal'
 @function get-cross-axis-direction($main-axis) {
-    @if $main-axis == 'left' or $main-axis == 'right' {
-        @return 'vertical';
-    }
-
-    @return 'horizontal';
+    @return if(string.index($main-axis, 'left') or string.index($main-axis, 'right'), 'vertical', 'horizontal');
 }
 
 // Function to check if a placement is logical
@@ -170,22 +168,20 @@ $_logical-to-physical-placement-map: (
 // Example: transform('top-start', $main-axis-inverse: true) will return 'bottom-start'
 // Example: transform('top-start', $main-axis-inverse: true, $cross-axis-inverse: true) will return 'bottom-end'
 // Example: transform('top-start', $main-axis-inverse: true, $cross-axis-inverse: true, $cross-axis-physical: true) will return 'bottom-right'
-// Example: transform('top-start', $hyphenate: false) will return 'top start'
+// Example: transform('top-start', $join-with: ' ') will return 'top start'
 @function transform(
     $placement,
     $main-axis-inverse: false,
     $cross-axis-inverse: false,
     $cross-axis-physical: false,
-    $hyphenate: true
+    $join-with: $_hyphen
 ) {
-    $hyphen: '-';
-    $placement-chunks: string.split($placement, $hyphen);
+    $placement-chunks: string.split($placement, $_hyphen);
     $main-axis: list.nth($placement-chunks, 1);
     $main-axis-transformed: transform-axis(
         $axis: $main-axis,
         $inverse: $main-axis-inverse,
     );
-    $join-with: if($hyphenate, $hyphen, ' ');
 
     @if list.length($placement-chunks) > 1 {
         $cross-axis: list.nth($placement-chunks, 2);
@@ -217,7 +213,7 @@ $_logical-to-physical-placement-map: (
     inset: map.get($_inset-map, $placement); // 1.2
     translate: map.get(-get-child-translate-map($prefix), $placement); // 1.3
     transform-origin: string.unquote(
-        transform($placement, $main-axis-inverse: true, $cross-axis-physical: true, $hyphenate: false)
+        transform($placement, $main-axis-inverse: true, $cross-axis-physical: true, $join-with: ' ')
     );
 }