feat: refactor `xy-cell-base()` mixin and add corresponding function

Changes:
- Add function `xy-cell-base()`: Returns the appropriate CSS flex value for a cell base.
- Refactor mixin `xy-cell-base()` to use its corresponding function.

diff --git a/scss/xy-grid/_cell.scss b/scss/xy-grid/_cell.scss
index adcd7e67d870987a19381254a0a89a8bdc4e9f80..768d94a35051bee447ecd433457b2995c319d9b2 100644 (file)
--- a/scss/xy-grid/_cell.scss
+++ b/scss/xy-grid/_cell.scss
@@ -6,6 +6,24 @@
 /// @group xy-grid
 ////
 
+/// Returns the appropriate CSS flex value for a cell base.
+///
+/// @param {Keyword} $size [full] - The size of your cell. Accepts `full`, `auto`, `shrink` or `grow`.
+///
+/// @returns {List} The cell flex property value.
+@function xy-cell-base($size: full) {
+  @if ($size == 'auto') {
+    @return 1 1 0px;
+  }
+  @else if ($size == 'grow') {
+    @return 1 0 auto;
+  }
+  @else if ($size == 'shrink' or $size == 'full') {
+    @return 0 0 auto;
+  }
+  @return null;
+}
+
 /// Calculate the size of a cell gutters.
 ///
 /// @param {Number|Map} $gutters [$grid-margin-gutters] - Map or single value for gutters.
@@ -79,21 +97,15 @@
 ///
 /// @param {Keyword} $size [full] - The size of your cell. Accepts `full`, `auto`, `shrink` or `grow`.
 @mixin xy-cell-base($size: full) {
+  $base: xy-cell-base($size);
+
+  flex: #{$base};
+
+  // Set base styles for "full" only
   @if($size == 'full') {
-    // This is the base style, all others inherit from it
-    flex: 0 0 auto;
     min-height: 0px;
     min-width: 0px;
   }
-  @else if ($size == 'auto') {
-    flex: 1 1 0px; // sass-lint:disable-line zero-unit
-  }
-  @else if ($size == 'shrink') {
-    flex: 0 0 auto;
-  }
-  @else if ($size == 'grow') {
-    flex: 1 0 auto;
-  }
 }
 
 /// Resets a cells width (or height if vertical is true) as well as strips its gutters.