refactor: move "-zf-each-breakpoint()" mixin iteration logics to "-zf-each-breakpoint()"

Changes:
* Add mixin `-zf-each-breakpoint-in()`
* Add function `-zf-bool()` to convert values to Booleans
* Refactor mixin `-zf-each-breakpoint()`  to rely on `-zf-each-breakpoint-in()`

There should be no change in the `-zf-each-breakpoint` API

diff --git a/scss/util/_mixins.scss b/scss/util/_mixins.scss
index 89ef0c3ff16b7e386d539af77e15845b32c7283e..90a00bae37f48f416892064209de5fbfe416c012 100644 (file)
--- a/scss/util/_mixins.scss
+++ b/scss/util/_mixins.scss
@@ -268,22 +268,64 @@
 ///
 /// @param {Boolean} $small [true] - If `false`, the mixin will skip the `small` breakpoint. Use this with components that don't prefix classes with `small-`, only `medium-` and up.
 /// @param {Boolean} $auto-insert-breakpoints [true] - If `false`, the mixin will iterate over breakpoints without doing the media query itself. Useful for more complex media query generation as in the margin grid.
-@mixin -zf-each-breakpoint($small: true, $auto-insert-breakpoints: true) {
-  $list: $breakpoint-classes;
+@mixin -zf-each-breakpoint(
+  $small: true,
+  $auto-insert-breakpoints: true
+) {
+  @include -zf-each-breakpoint-in(auto, -zf-bool($small), -zf-bool($auto-insert-breakpoints)) {
+    @content
+  };
+}
 
-  @if not $small {
-    $list: sl-remove($list, $-zf-zero-breakpoint);
+/// Iterates with `@content` through the given list of breakpoints `$breakpoints`.
+///
+/// @access private
+///
+/// @param {Keyword|List} $breakpoints [auto] - Breakpoints to iterates on. It can be a breakpoint name, list of breakpoints or `auto` for all breakpoints.
+/// @param {Boolean|Null} $zero-breakpoint [null] - Whether the zero-breakpoint (often `small`) must be included. If `true`, it will always be added to the list if not already there. If `false`, it will always be removed. Does nothing by default.
+/// @param {Boolean|Keyword} $media-queries [true] - Whether media-queries must be generated. If `for-lists`, only generate media-queries when `$breakpoints` is a list.
+@mixin -zf-each-breakpoint-in(
+  $breakpoints: auto,
+  $zero-breakpoint: null,
+  $media-queries: true
+) {
+  $-list: ();
+  $-breakpoints-is-a-list: true;
+
+  // Retrieve the list of breakpoint(s) to iterate on.
+  @if $breakpoints == auto {
+    $-list: $breakpoint-classes;
+  }
+  @else if type-of($breakpoints) == 'list' {
+    $-list: $breakpoints;
+  }
+  @else if type-of($breakpoints) == 'string' {
+    $-list: ($breakpoints);
+    $-breakpoints-is-a-list: false;
+  }
+  @else {
+    @error 'Wrong syntax for "$breakpoints" in "-zf-each-breakpoint-in()". Got "#{$breakpoints}" (#{type-of($breakpoints)}). Expected a breakpoint name, a list of breakpoints or "auto"';
+  }
+
+  // Add or remove the zero breakpoint according to `$zero-breakpoint`
+  @if $zero-breakpoint == true {
+    $-list: join(($-zf-zero-breakpoint), sl-remove($-list, $-zf-zero-breakpoint));
+  }
+  @else if $zero-breakpoint == false {
+    $-list: sl-remove($-list, $-zf-zero-breakpoint);
   }
 
-  @each $name in $list {
+  // Iterate on breakpoint(s)
+  @each $bp in $-list {
     $old-zf-size: null;
     @if global-variable-exists(-zf-size) {
       $old-zf-size: $-zf-size;
     }
-    $-zf-size: $name !global;
+    $-zf-size: $bp !global;
 
-    @if $auto-insert-breakpoints {
-      @include breakpoint($name) {
+    @if ($media-queries == true
+      or ($media-queries == 'for-lists' and $-breakpoints-is-a-list)) {
+      @include breakpoint($bp) {
         @content;
       }
     }

diff --git a/scss/util/_value.scss b/scss/util/_value.scss
index a063a82af603421d716c90c74a4a6c1a7b23ae58..cde5d37f89e38f355f397ac7c51124863a7323ef 100644 (file)
--- a/scss/util/_value.scss
+++ b/scss/util/_value.scss
@@ -158,3 +158,14 @@
     @error '`#{$map}` is not a valid map';
   }
 }
+
+/// Convert the given `$val` to a Boolean. Empty values are considered as false.
+////
+/// @access private
+///
+/// @param {*} $val - Value to convert.
+///
+/// @returns {Boolean} Converted Boolean value.
+@function -zf-bool($val) {
+  @return $val != false and has-value($val);
+}