Merge branch 'develop' into release/v2.0.0

src/motion-ui.scss

@@ -6,6 +6,7 @@
 
 @import 'util/animation';
 @import 'util/args';
+@import 'util/function';
 @import 'util/keyframe';
 @import 'util/selector';
 @import 'util/series';

src/util/_animation.scss

@@ -1,5 +1,5 @@
 /// Creates a keyframe from one or more effect functions and assigns it to the element by adding the `animation-name` property.
-/// @param {Function} $effects... - One or more effect functions to build the keyframe with.
+/// @param {Arglist} $effects... - One or more effect functions to build the keyframe with.
 @mixin mui-animation($args...) {
   $name: map-get(-mui-process-args($args...), name);
   @include mui-keyframes($name, $args...);

src/util/_args.scss

@@ -4,8 +4,8 @@
   @if length($args) == 1 {
     $arg: nth($args, 1);
 
-    @if type-of($arg) == 'string' {
-      @return call(get-function($arg));
+    @if -mui-is-function($arg) {
+      @return -mui-safe-call($arg);
     } @else if type-of($arg) == 'map' {
       @return $arg;
     }

src/util/_function.scss

@@ -0,0 +1,94 @@
+////
+/// In order to improve modular namespacing, LibSass 4 only accepts first-class
+/// functions as argument so functions are called in their own context.
+/// In most case, `get-function()` must only be used by the user in its own
+/// context. It is used in this library to keep a maximum compatibility.
+/// End developer must be encouraged to use first-class functions.
+///
+/// @link http://oddbird.net/2017/03/30/safe-get
+/// @link http://sass.logdown.com/posts/809572-sass-35-release-candidate
+////
+
+///
+/// Return if a given value is a function or a function name string.
+///
+/// @access private
+///
+/// @param {*} $value - Value to test
+/// @return {Boolean}
+///
+@function -mui-is-function($value) {
+  @return type-of($value) == 'function' or type-of($value) == 'string';
+}
+
+///
+/// Return if a given value is callable.
+///
+/// @access private
+///
+/// @param {*} $value - Value to test
+/// @return {Boolean}
+///
+@function -mui-is-callable($value) {
+  @return type-of($value) == 'function' or (type-of($value) == 'string' and function-exists($value));
+}
+
+///
+/// Check if a given value is callable and throw the appropriate error otherwise
+///
+/// @access private
+///
+/// @param {*} $value - Value to check
+/// @return {Boolean}
+///
+@function -mui-assert-function($value) {
+  @if -mui-is-callable($value) {
+    @return true;
+  } @else if (type-of($value) == 'string' and function-exists('get-function') == true) {
+    @error 'Assertion Error: function name string "#{$value}" cannot be found. You may need to use `get-function()` and first-class functions instead. See http://oddbird.net/2017/03/30/safe-get';
+  } @else if (type-of($value) == 'string' and function-exists('get-function') == false) {
+    @error 'Assertion Error: function name string "#{$value}" cannot be found.';
+  } @else {
+    @error 'Assertion Error: #{$value} (#{type-of($value)}) is not a function.';
+  }
+}
+
+///
+/// Return a reference to the given function or function name string compatible
+/// with the current Sass version.
+///
+/// * For Sass < 3.5, return the passed argument
+/// * For Sass >= 3.5, return a first-class function if a function name string
+///   was passed
+///
+/// @access private
+///
+/// @param {Function|String} -  $func - Function or name of the function
+/// @return {Function|String}   Function or name of the function following
+///                             the support of first-class functions.
+///
+@function -mui-safe-get-function($func) {
+  @if -mui-assert-function($func) {
+    @if function-exists('get-function') and type-of($func) == 'string' {
+      @return get-function($func);
+    } @else {
+      @return $func;
+    }
+  }
+}
+
+///
+/// Polyfill for the `call` function supporting both functions and strings.
+///
+/// @access private
+///
+/// @param {Function|String} $func - Function or name of the function to call
+/// @param {Arglist} $args... - Arguments to call the function with
+///
+/// @return {*}
+///
+@function -mui-safe-call($func, $args...) {
+  @if -mui-assert-function($func) {
+    @return call(-mui-safe-get-function($func), $args...);
+  }
+}

src/util/_keyframe.scss

@@ -3,7 +3,7 @@ $-mui-custom: 0;
 
 /// Creates a keyframe from one or more effect functions. Use this function instead of `mui-animation` if you want to create a keyframe animation *without* automatically assigning it to the element.
 /// @param {String} $name - Name of the keyframe.
-/// @param {Function} $effects... - One or more effect functions to build the keyframe with.
+/// @param {Arglist} $effects... - One or more effect functions to build the keyframe with.
 @mixin mui-keyframes($name, $effects...) {
   $obj: -mui-process-args($effects...);
   $obj: map-remove($obj, name);
@@ -79,16 +79,16 @@ $-mui-custom: 0;
 }
 
 /// Combines a series of keyframe objects into one.
-/// @param {Map} $maps... - A series of maps to merge, as individual parameters.
+/// @param {Arglist} $maps... - A series of maps to merge, as individual parameters.
 /// @return {Map} A combined keyframe object.
 /// @access private
 @function -mui-keyframe-combine($maps...) {
   $new-map: ();
 
   // Iterate through each map passed in
   @each $map in $maps {
-    @if type-of($map) == 'string' {
-      $map: call(get-function($map));
+    @if -mui-is-function($map) {
+      $map: -mui-safe-call($map);
     }
 
     $map: -mui-keyframe-split($map);

src/util/_series.scss

@@ -16,7 +16,7 @@ $-mui-queue: ();
 /// Adds an animation to an animation queue. Only use this mixin inside of `mui-series()`.
 /// @param {Duration} $duration [1s] - Length of the animation.
 /// @param {Duration} $gap [0s] - Amount of time to pause before playing the animation after this one. Use a negative value to make the next effect overlap with the current one.
-/// @param {Function} $keyframes... - One or more effect functions to build the keyframe with.
+/// @param {Arglist} $keyframes... - One or more effect functions to build the keyframe with.
 @mixin mui-queue(
   $duration: 1s,
   $gap: 0s,