/**
 * Flexlay Visibility
 *
 * These classes allow to show or hide elements between layout breakpoints.
 * Note: show is prioritized over hide.
 */

@import '../variables';

/** Given a specified breakpoint, provide all hide rules that target it */
@mixin flex-visibility($break: null) {
  @if ($break != null and str-slice($break, 1, 2) != 'gt') {

    // Generate list of all 'show' suffixes that override the 'hide'
    // for the provided $break
    $names: map-keys($break-bounds);
    $index: index($names, $break);

    $show-suffixes: ('');
    @for $i from 1 through $index {
      $suffix: nth($names, $i);
      $show-suffixes: append($show-suffixes, if($i != $index, gt-#{$suffix}, $suffix));
    }

    // Transform the $show-suffixes in a negation selector
    $negation-selector: '';
    @each $show-suffix in $show-suffixes {
      $dashed-suffix: if($show-suffix != '', '-#{$show-suffix}', '');
      $selector: '[#{$lib-prefix}show#{$dashed-suffix}]';
      $negation-selector: '#{$negation-selector}:not(#{$selector})';
    }

    // Generate list of all hide suffixes that should be generated
    // for the provided break
    $hide-suffixes: ('');
    @for $i from 1 through $index {
      $suffix: nth($names, $i);
      $hide-suffixes: append($hide-suffixes, if($i != $index, gt-#{$suffix}, $suffix));
    }

    // Generate rules
    @each $hide-suffix in $hide-suffixes {
      $dashed-suffix: if($hide-suffix != '', '-#{$hide-suffix}', '');
      [#{$lib-prefix}hide#{$dashed-suffix}]#{$negation-selector} { display: none; }
    }
  }
}