$wh-types: ( w: 'width', h: 'height' );

$wh-increments: ( 20, 25, 40, 50, 60, 75, 80, 100 );
$wh-viewports: ( 25, 50, 75, 100 );
$wh-other: ( a: auto, i: inherit, 0: 0 );

$wh-object: (
    nil: $wh-other,
    pc: $wh-increments,
    vp: $wh-viewports,
);

@each $type, $declaration in $wh-types {
    .#{$type}\: {
        @include isProp($wh-object) using ($func, $values) {
            @if $func != 'vp' {
                @if type-of($values) == 'map' {
                    @include isMap($values) using ($key, $size) {
                        #{$declaration}: call(get-function($func), $size);
                    }
                } @else {
                    @include isList($values) using ($size) {
                        #{$declaration}: call(get-function($func), $size);
                    }
                }
            } @else {
                @include isList($values) using ($size) {
                    &v {
                        #{$declaration}: call(get-function($func), $size, $type);
                    }
                }
            }
        }
    }
    .mx-#{$type}\: {
        @include isList($wh-viewports) using ($size) {
            max-#{$declaration}: pc($size);
        }
    }
}
