refactor(variant): update module to create rows of variant as map typ…

…e prepared for `class.content()`.

variant/_index.scss

@@ -1,5 +1,11 @@
+@forward 'class' as class-*;
 @forward 'indicator' as indicator-*;
-@forward 'update' as update-*;
+@forward 'item' as item-*;
+@forward 'property' as property-*;
+@forward 'variant.append.function';
+@forward 'variant.class-property.mixin';
+@forward 'variant.combine-get.function';
 @forward 'variant.create.function';
 @forward 'variant.modify.function';
+@forward 'variant.transform.mixin';
 @forward 'variant.update.function';

variant/_variant.append.function.scss

@@ -0,0 +1,16 @@
+// Modules.
+@use '../list';
+
+// Status: TODO:
+// The `variant.append()` function.
+// @param `$list`
+// @param `$class`
+// @param `$property`
+// @returns
+@function append($list, $class, $property, $format: map) {
+  @return list.append(
+    if(list.length($list) == 0, list.join((), (), $bracketed: true), $list),
+    (class: $class, property: $property),
+    comma
+  );
+}

variant/_variant.class-property.mixin.scss

@@ -0,0 +1,36 @@
+// Modules.
+@use '../list';
+
+// Status:
+// The `variant.class-property()` mixin.
+// @param `$class-property-name`
+// @param `$combine`
+@mixin class-property($class-property-name, $combine: false) {
+  @if type-of($class-property-name) == map {
+    @each $class, $property-name in $class-property-name {
+      @if list.has-bool($class) {
+        $combine: list.bool($class);
+        $class: list.remove-value($class, true, false);
+      }
+      @if $combine {
+        @content($class, $property-name);
+      } @else {
+        @include list.each($class) using($class) {
+          @content($class, $property-name);
+        }
+      }
+    }
+  } @else {
+    @if list.has-bool($class-property-name) {
+      $combine: list.bool($class-property-name);
+      $class-property-name: list.remove-value($class-property-name, true, false);
+    }
+    @if $combine {
+      @content($class-property-name, null);
+    } @else {
+      @include list.each($class-property-name) using($class-property-name) {
+        @content($class-property-name, null);
+      }
+    }
+  }
+}

variant/_variant.combine-get.function.scss

@@ -0,0 +1,27 @@
+// Modules.
+@use '../map';
+
+// Functions.
+@use '../list/list.nth.function';
+@use '../meta/meta.of-type.function';
+
+// Status: TODO:
+// The `variant.combine-switch()` function switches between variant combine levels 1 - 3 (`false`/`true`) if `$combine` is `list` or `map`.
+// @param `$combine`
+// @param `$level`
+// @returns
+@function combine-get($combine, $level) {
+  @if meta.of-type(list map, $combine) {
+    @return if(
+      type-of($combine) == map,
+      map.get($combine, $level),
+      list.nth($combine, $level)
+    );
+  }
+  @return $combine;
+}
+
+// Examples.
+// @debug combine-get(true true true, 1); // true
+// @debug combine-get(false true false, 3); // false
+// @debug combine-get((1: false, 2: true, 3: false), 3); // false

variant/_variant.create.function.scss

@@ -10,6 +10,7 @@
 @function create($value, $modifier: null) {
   $result: ();
   @if type-of($value) == map {
+
     @each $name, $side-variant in $value {
       @if type-of($side-variant) == map {
         @each $side, $variant in $side-variant {
@@ -21,6 +22,9 @@
         $result: map.merge($result, (), (), ($name: $side-variant));
       }
     }
+
+
+
   } @else if not (type-of($value) == map) {
     @each $value in if(list.separator($value) == comma, $value, ($value,)) {
       // Remove !important.
@@ -33,6 +37,18 @@
   @return $result;
 }
 
+// Variant
+// (class+property: property-value)
+// ((class: property-name): property-value)
+
+// (class+property-name: (class: property-value))
+// ((class: property-name): (class: property-value))
+
+// (class+property-name: (class+property-name: (class: property-value)))
+// ((class: property-name): ((class+property-name: class+property-name): (class: property-value)))
+// ((class: property-name): ((class+property-name: class+property-name): (class: (property-name: property-value))))
+
+
 // Examples.
 // string
 // @debug create(right); // (right: right)

variant/_variant.transform.mixin.scss

@@ -0,0 +1,139 @@
+// Modules.
+@use '../class';
+@use '../list';
+@use '../map';
+@use '../property';
+@use '../selector';
+@use '../values';
+@use 'class' as v-class;
+@use 'indicator';
+@use 'property' as v-property;
+
+// Functions.
+@use 'variant.append.function' as *;
+@use 'variant.combine-get.function' as *;
+
+// Mixins.
+@use 'variant.class-property.mixin' as *;
+
+// Status: TODO:
+// The `variant.transform()` mixin transforms variant from level 1 - 3 to map and append to rows.
+// @param `$variant`
+// @param `$combine`
+@mixin transform($variant, $combine: false) {
+  $rows: ();
+  @each $class-property, $middle_attribute_variant in $variant {
+    @include class-property($class-property, combine-get($combine, 1)) using($class_property, $property-name) {
+      @if type-of($middle_attribute_variant) == map { // FEATURE: Variant 2
+        @each $middle, $attribute-variant in $middle_attribute_variant {
+          @include class-property($middle, combine-get($combine, 2)) using($class_property1, $property-name1) {
+            @if type-of($attribute-variant) == map { // FEATURE: Variant 3
+              @each $attribute, $variant in $attribute-variant {
+                @include class-property($attribute, combine-get($combine, 3)) using($class_property2, $property-name2) {
+                  @if type-of($variant) == map { // FEATURE: Variant 4.
+                    // FEATURE: Variant 4.
+                    @debug "Variant 4.";
+
+                    @each $value-class, $value in $variant {
+                      $rows: append(
+                        $rows,
+                        v-class.set(
+                          $class_property,
+                          $class_property1,
+                          $class_property2,
+                          $property-name2,
+                          $value-class,
+                        ),
+                        v-property.set(
+                          if($property-name, $property-name, $class_property),
+                          property.name(
+                            if($property-name1, $property-name1, $class_property1),
+                            if($property-name2, $property-name2, $class_property2),
+                          ),
+                          $value
+                        ),
+                      );
+                    }
+                  } @else {
+                    // FEATURE: Variant 3.
+                    @debug "Variant 3: (prop: (middle: variant)) (prop: middle: (class: value))";
+                    // @debug "$class-property: " $class_property;
+                    // @debug "$class-property1: " $class_property1;
+                    // @debug "$property-name: " $property-name;
+                    // @debug "$property-name1: " $property-name1;
+                    // @debug "class: " $class_property, $class_property1;
+                    // @debug "property name: " if($property-name, $property-name, $class_property), if($property-name1, $property-name1, $class_property1);
+
+                    $value: $variant;
+                    $rows: append(
+                      $rows,
+                      v-class.set(
+                        $class_property,
+                        $class_property1,
+                        $class_property2,
+                      ),
+                      v-property.set(
+                        if($property-name, $property-name, $class_property),
+                        property.name(
+                          if($property-name1, $property-name1, $class_property1),
+                          $property-name2,
+                        ),
+                        $value
+                      ),
+                    );
+
+
+                  }
+                }
+              }
+            } @else {
+              // FEATURE: Variant 2.
+              @debug "Variant 2: (middle: variant) (middle: (class: value)";
+              // @debug "$class-property: " $class_property;
+              // @debug "$class-property1: " $class_property1;
+              // @debug "$property-name: " $property-name;
+              // @debug "$property-name1: " $property-name1;
+              // @debug "class: " $class_property, $class_property1;
+              // @debug "property name: " if($property-name, $property-name, $class_property), if($property-name1, $property-name1, $class_property1);
+
+              $value: $attribute-variant;
+              $rows: append(
+                $rows,
+                v-class.set(
+                  $class_property,
+                  $class_property1
+                ),
+                v-property.set(
+                  if($property-name, $property-name, $class_property),
+                  if($property-name1, $property-name1, $class_property1),
+                  $value,
+                ),
+              );
+            }
+
+
+          }
+        }
+      } @else {
+        // FEATURE: Variant 1.
+        @debug "Variant 1: (variant) (class: value)";
+        // @debug "$property-name: #{$property-name}";
+        // @debug "$class_property: #{$class_property}";
+
+        $value: $middle_attribute_variant;
+        $rows: append(
+          $rows,
+          v-class.set($class_property),
+          v-property.set(
+            if($property-name, $property-name, $class_property),
+            null,
+            $value,
+          )
+        );
+
+      }
+    }
+  }
+
+  @content($rows);
+}