Skip to content

Instantly share code, notes, and snippets.

@agorilla

agorilla/_map-get-next.scss

Last active March 7, 2020 11:01
Download ZIP

Revisions

  1. agorilla revised this gist Dec 19, 2018. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion _map-get-next.scss
    View file
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,7 @@
    /// Function to get next map item
    /// returns next map item or fallback value if map, key or next item does not exist
    /// https://github.com/elcheio/sass-map-get-next-prev
    /// Github Repo: https://github.com/elcheio/sass-map-get-next-prev
    /// Node Module: https://www.npmjs.com/package/sass-map-get-next-prev
    ///
    /// @author Simon Koch <[email protected]>
    ///
  2. agorilla revised this gist Sep 23, 2018. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions _map-get-next.scss
    View file
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,6 @@
    /// Function to get next map item
    /// returns next map item or fallback value if map, key or next item does not exist
    /// https://github.com/elcheio/sass-map-get-next-prev
    ///
    /// @author Simon Koch <[email protected]>
    ///
  3. agorilla revised this gist Sep 23, 2018. 1 changed file with 51 additions and 43 deletions.
    94 changes: 51 additions & 43 deletions _map-get-next.scss
    View file
    Original file line number Diff line number Diff line change
    @@ -1,80 +1,88 @@
    /// Function to get next map item
    /// returns next map item or fallback value if map, key or next item does not exist
    ///
    /// @author Simon Koch
    /// @author Simon Koch <[email protected]>
    ///
    /// Licensed under the MIT license.
    ///
    /// @access public
    ///
    /// @param {Map} $map - Sass list map
    /// @param {String} $key - List map key
    /// @param {String} $fallback (false) - Fallback value if map, key or next item does not exist
    /// @param {Boolean} $fallback (false) - Fallback value if map, key or previous item does not exist
    /// @param {String} $return (value) - Return value or key of previous list item
    /// @param {Boolean} $debug (false) - Debug option
    ///
    /// @example scss - Usage
    /// $map: (
    /// a: 100px,
    /// b: 200px
    ///$map: (
    /// s: 320px,
    /// m: 768px,
    /// );
    ///
    /// .foo {
    /// width: map-get-next($map, a);
    /// width: map-get-next($map, s);
    /// }
    ///
    /// .bar {
    /// width: map-get-next($map, b, auto);
    /// width: map-get-next($map, m, 1024px);
    /// }
    ///
    /// @example css - CSS output
    /// .foo {
    /// width: 200px;
    /// width: 768px;
    /// }
    ///
    /// .bar {
    /// width: auto;
    /// width: 1024px;
    /// }

    @function map-get-next($map, $key, $fallback: false) {
    @function map-get-next($map, $key, $fallback: false, $return: value) {

    // Check if map is valid
    @if type_of($map) == map {
    // Check if map is valid
    @if type-of($map) == map {

    // Check if key exists in map
    @if map_has_key($map, $key) {
    // Check if key exists in map
    @if map-has-key($map, $key) {

    // Init index counter variable
    $i: 0;
    // Init index counter variable
    $i: 0;

    // Init key index
    $key-index: false;
    // Init key index
    $key-index: false;

    // Traverse map for key
    @each $map-key, $map-value in $map {
    // Update index
    $i: $i + 1;
    // Traverse map for key
    @each $map-key, $map-value in $map {
    // Update index
    $i: $i + 1;

    // If map key found, set key index
    @if $map-key == $key {
    $key-index: $i;
    }
    // If map key found, set key index
    @if $map-key == $key {
    $key-index: $i;
    }

    // If next index return next value
    @if $i == $key-index + 1 {
    @return $map-value;
    }
    // If next index return next value or key based on $return
    @if $i == $key-index + 1 {
    @if $return == key {
    @return $map-key;
    } @else {
    @return $map-value;
    }
    }

    // If last entry return false
    @if $i == length($map) {
    @return $fallback;
    }
    }
    // If last entry return false
    @if $i == length($map) {
    @return $fallback;
    }
    }

    @warn 'No next map item for key #{$key}';
    @return $fallback;
    }
    @warn 'No next map item for key #{$key}';
    @return $fallback;
    }

    @warn 'No valid key #{$key} in map';
    @return $fallback;
    }
    @warn 'No valid key #{$key} in map';
    @return $fallback;
    }

    @warn 'No valid map';
    @return $fallback;
    @warn 'No valid map';
    @return $fallback;
    }
  4. agorilla revised this gist Jan 9, 2015. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion _map-get-next.scss
    View file
    Original file line number Diff line number Diff line change
    @@ -20,7 +20,7 @@
    /// }
    ///
    /// .bar {
    /// width: map-get-next($map, b, auto);
    /// width: map-get-next($map, b, auto);
    /// }
    ///
    /// @example css - CSS output
  5. agorilla renamed this gist Jan 9, 2015. 1 changed file with 0 additions and 0 deletions.
    0 gistfile1.sass → _map-get-next.scss
    View file
    File renamed without changes.
  6. agorilla created this gist Jan 9, 2015.
    80 changes: 80 additions & 0 deletions gistfile1.sass
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,80 @@
    /// Function to get next map item
    /// returns next map item or fallback value if map, key or next item does not exist
    ///
    /// @author Simon Koch
    ///
    /// @access public
    ///
    /// @param {Map} $map - Sass list map
    /// @param {String} $key - List map key
    /// @param {String} $fallback (false) - Fallback value if map, key or next item does not exist
    ///
    /// @example scss - Usage
    /// $map: (
    /// a: 100px,
    /// b: 200px
    /// );
    ///
    /// .foo {
    /// width: map-get-next($map, a);
    /// }
    ///
    /// .bar {
    /// width: map-get-next($map, b, auto);
    /// }
    ///
    /// @example css - CSS output
    /// .foo {
    /// width: 200px;
    /// }
    ///
    /// .bar {
    /// width: auto;
    /// }
    @function map-get-next($map, $key, $fallback: false) {

    // Check if map is valid
    @if type_of($map) == map {

    // Check if key exists in map
    @if map_has_key($map, $key) {

    // Init index counter variable
    $i: 0;

    // Init key index
    $key-index: false;

    // Traverse map for key
    @each $map-key, $map-value in $map {
    // Update index
    $i: $i + 1;

    // If map key found, set key index
    @if $map-key == $key {
    $key-index: $i;
    }

    // If next index return next value
    @if $i == $key-index + 1 {
    @return $map-value;
    }

    // If last entry return false
    @if $i == length($map) {
    @return $fallback;
    }
    }

    @warn 'No next map item for key #{$key}';
    @return $fallback;
    }

    @warn 'No valid key #{$key} in map';
    @return $fallback;
    }

    @warn 'No valid map';
    @return $fallback;
    }