gerillass 1.5.0 → 1.6.1

package/package.json

@@ -16,7 +16,7 @@
     }
   },
   "license": "Apache-2.0",
-  "version": "1.5.0",
+  "version": "1.6.1",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/selfishprimate/gerillass.git"
@@ -47,6 +47,7 @@
     "needs": "^3.0.0"
   },
   "scripts": {
+    "manifest": "node tools/build-manifest.js && node tools/build-skill.js",
     "test": "jest"
   },
   "devDependencies": {

package/scss/_gerillass-prefix.scss

@@ -17,7 +17,9 @@
   &::after {
     @if $content == null {
       @content;
-    } @else if $content != null {
+    } @else if type-of($content) != "string" {
+      @error "`#{$content}` is not a valid $content for `after`. Pass a string to use as the content value, a data- attribute name such as `\"data-label\"` to render it with attr(), or no argument at all and write the content yourself.";
+    } @else {
       $data: str-slice($content, 1, 5);
       @if $data == "data-" {
         content: attr(#{$content});
@@ -43,7 +45,7 @@
       @content;
     }
   } @else {
-    @error "The argument must be `null` or one of the followings: #{quote($list)}.";
+    @error "The argument must be `null` or one of the followings: #{$list}.";
   }
 }
 
@@ -60,7 +62,7 @@
       @content;
     }
   } @else {
-    @error "The argument must be `null` or one of the followings: #{quote($list)}";
+    @error "The argument must be `null` or one of the followings: #{$list}";
   }
 }
 
@@ -91,6 +93,10 @@
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
     }
+  } @else if not & and $value == "only" {
+    @error "`only` has no meaning at the root of a stylesheet, because there is no selector to limit the effect to. Call `antialias(\"only\")` inside a selector, or pass no argument at all.";
+  } @else {
+    @error "`#{$value}` is not a valid argument for `antialias`. Pass `\"only\"` inside a selector to affect just that element, or pass no argument at all.";
   }
 }
 
@@ -103,6 +109,12 @@
   $diagonal: true,
   $image: null
 ) {
+  @if $image != null and type-of($image) != "string" {
+    @error "`#{$image}` is not a valid $image for `background-dots`. Pass an image path as a string.";
+  }
+  @if $diagonal != true and $diagonal != false {
+    @error "`#{$diagonal}` is not a valid $diagonal for `background-dots`. Pass `true` or `false`.";
+  }
   @if not $color {
     $color: rgba(0, 0, 0, 0.1);
     @if $diagonal == true {
@@ -174,11 +186,11 @@
               ),
               url($image-url);
           } @else {
-            @if index("deg", unit($filter-direction)) {
+            @if type-of($filter-direction) == "number" and index("deg", unit($filter-direction)) {
               background-image: linear-gradient($filter-direction, $color-list),
                 url($image-url);
             } @else {
-              @error "#{$filter-direction} is a wrong value for the $filter-direction parameter. The value must be either a number followed by the 'deg' unit or one of the following pre-defined values: #{quote(map-keys($map-for-directions))}.";
+              @error "`#{$filter-direction}` is not a valid $filter-direction. Pass an angle such as `45deg`, or one of: #{map-keys($map-for-directions)}.";
             }
           }
         } @else {
@@ -226,6 +238,12 @@
   $rotation: -45deg,
   $image: null
 ) {
+  @if type-of($rotation) != "number" {
+    @error "`#{$rotation}` is not a valid $rotation for `background-stripes`. Pass an angle such as `-45deg`, or a unitless number which is treated as degrees.";
+  }
+  @if $image != null and type-of($image) != "string" {
+    @error "`#{$image}` is not a valid $image for `background-stripes`. Pass an image path as a string.";
+  }
   $validate-unit: if(not index("deg", unit($rotation)), $rotation + deg, $rotation);
   $get-image: if($image, unquote(", ") + url(unquote($image)), unquote(""));
   @if not $color {
@@ -277,7 +295,9 @@
   &::before {
     @if $content == null {
       @content;
-    } @else if $content != null {
+    } @else if type-of($content) != "string" {
+      @error "`#{$content}` is not a valid $content for `before`. Pass a string to use as the content value, a data- attribute name such as `\"data-label\"` to render it with attr(), or no argument at all and write the content yourself.";
+    } @else {
       $data: str-slice($content, 1, 5);
       @if $data == "data-" {
         content: attr(#{$content});
@@ -314,6 +334,10 @@
     *::after {
       box-sizing: border-box;
     }
+  } @else if not & and $value == "only" {
+    @error "`only` has no meaning at the root of a stylesheet, because there is no selector to limit the effect to. Call `border-box(\"only\")` inside a selector, or pass no argument at all.";
+  } @else {
+    @error "`#{$value}` is not a valid argument for `border-box`. Pass `\"only\"` inside a selector to affect just that element, or pass no argument at all.";
   }
 }
 
@@ -358,7 +382,7 @@
         border-bottom-left-radius: $value;
       }
     } @else {
-      @error "Corner value must be one of the followings: #{quote($list)}.";
+      @error "Corner value must be one of the followings: #{$list}.";
     }
   } @else if length($args) == 4 {
     $args: __null($args, space, true);
@@ -366,6 +390,8 @@
     border-top-right-radius: nth($args, 2);
     border-bottom-right-radius: nth($args, 3);
     border-bottom-left-radius: nth($args, 4);
+  } @else {
+    @error "`border-radius` takes 1, 2 or 4 arguments; you passed #{length($args)}. Use one radius for every corner, a corner name plus a radius, or four radii in top-left, top-right, bottom-right, bottom-left order.";
   }
 }
 
@@ -460,6 +486,9 @@
 
 
 @mixin gls-breakpointer($selector: null) {
+  @if $selector != null and type-of($selector) != "string" {
+    @error "`#{$selector}` is not a valid $selector for `breakpointer`. Pass a selector as a string, such as `\".debug\"`, or no argument at all to attach it to body.";
+  }
   @if & {
     &::before {
       @content;
@@ -495,6 +524,9 @@
 
 
 @mixin gls-center($axis: "both") {
+  @if not index("both" "horizontal" "vertical", $axis) {
+    @error "`#{$axis}` is not a valid $axis for `center`. Pass one of: both, horizontal, vertical.";
+  }
   @if $axis == "both" or $axis == "vertical" {
     top: 50%;
   }
@@ -529,6 +561,9 @@
 
 
 @mixin gls-columnizer($params...) {
+  @if length($params) < 1 or length($params) > 3 {
+    @error "`columnizer` takes 1 to 3 arguments; you passed #{length($params)}. Pass the column count, optionally a gutter length, and optionally a boolean telling the last row whether to fill.";
+  }
   $columns: nth($params, 1);
   $gutter: null;
   $fill: false;
@@ -564,6 +599,8 @@
         &:nth-child(#{$columns}n) {
           margin-right: 0;
         }
+      } @else {
+        @error "`#{nth($params, 2)}` is not a valid second argument for `columnizer`. Pass a gutter length such as `20px`, or a boolean telling the last row whether to fill.";
       }
     } @else if length($params) == 3 {
       $gutter: nth($params, 2);
@@ -642,6 +679,9 @@
 
 
 @mixin gls-escape-to-parent($selector: null) {
+  @if $selector != null and type-of($selector) != "string" {
+    @error "`#{$selector}` is not a valid $selector for `escape-to-parent`. Pass a selector as a string, such as `\".theme-dark\"`.";
+  }
   @at-root #{$selector}#{&} {
     @content;
   }
@@ -686,6 +726,8 @@
           @content;
         }
       }
+    } @else {
+      @error "`#{$value}` is not a valid argument for `except`. Pass a positive or negative number, one of `first`, `last`, `odd`, `even`, or a selector such as `.foo`.";
     }
   } @else if length($params) > 1 {
     $items: "";
@@ -709,6 +751,10 @@
 ) {
   @if & {
     @error "You must call the mixin at the root level of your style sheet, not in the `#{&+'{'+'}'}` selector.";
+  } @else if type-of($font-family) != "string" {
+    @error "`#{$font-family}` is not a valid $font-family for `font-face`. Pass the family name as a string, such as `\"Inter\"`.";
+  } @else if type-of($file-path) != "string" {
+    @error "`#{$file-path}` is not a valid $file-path for `font-face`. Pass the path to the font files without an extension, as a string.";
   } @else {
     
     $list: ();
@@ -788,8 +834,8 @@
       $list
     );
   } @else if not map-has-key($map-for-directions, $direction) {
-    @if not index("deg", unit($direction)) {
-      @error "#{$direction} is a wrong value for the $direction parameter. The value must be eighter a number followed by the 'deg' unit or one of the followings: #{map-keys($map-for-directions)}.";
+    @if type-of($direction) != "number" or not index("deg", unit($direction)) {
+      @error "`#{$direction}` is not a valid $direction for `linear-gradient`. Pass an angle such as `45deg`, or one of: #{map-keys($map-for-directions)}.";
     } @else {
       background: linear-gradient($direction, $list);
     }
@@ -877,6 +923,8 @@
           @content;
         }
       }
+    } @else {
+      @error "`#{$value}` is not a valid argument for `only`. Pass a positive or negative number, one of `first`, `last`, `odd`, `even`, or a selector such as `.foo`.";
     }
   } @else if length($params) > 1 {
     $list: ();
@@ -938,6 +986,12 @@
 
 
 @mixin gls-radial-gradient($shape, $position, $colors) {
+  @if type-of($shape) != "string" {
+    @error "`#{$shape}` is not a valid $shape for `radial-gradient`. Pass `circle` or `ellipse`.";
+  }
+  @if type-of($position) != "string" {
+    @error "`#{$position}` is not a valid $position for `radial-gradient`. Pass a position name such as `center` or `top-left`, or a raw CSS position as a string.";
+  }
   $list: ();
   $shape: unquote($shape);
   $position: unquote($position);
@@ -1005,7 +1059,7 @@
       }
     }
   } @else {
-    @error "Error!";
+    @error "`remove` takes at most 2 arguments; you passed #{length($params)}. Pass nothing to hide the element outright, one breakpoint, `min`/`max` plus a breakpoint, or a start and an end breakpoint.";
   }
 }
 
@@ -1135,6 +1189,8 @@
       #{nth($corners, 4)} 100%,
       0 calc(100% - #{nth($corners, 4)})
     );
+  } @else {
+    @error "`scissors` takes either 1 corner size or 4; you passed #{length($corners)}. Pass one length to cut every corner equally, or four lengths in top-left, top-right, bottom-right, bottom-left order.";
   }
 }
 
@@ -1185,9 +1241,11 @@
       and (orientation: landscape) {
         @content;
       }
+    } @else {
+      @error "`#{$orientation}` is not a valid $orientation for `smartphone`. Pass `portrait`, `landscape`, or no orientation at all.";
     }
   } @else {
-    @warn "#{$device} is a wrong device name! The argument must be one of the followings: #{map-keys($map-for-smartphones)}";
+    @error "`#{$device}` is not a device known to `smartphone`. Pass one of: #{map-keys($map-for-smartphones)}.";
   }
 }
 
@@ -1203,6 +1261,8 @@
         display: inline-block;
         background-image: url($image-url);
         background-repeat: no-repeat;
+      } @else {
+        @error "`#{nth($params, 1)}` is not a valid image path for `sprite`. The path must end in .png, .jpg or .svg.";
       }
     } @else {
       $position: nth($params, 1);
@@ -1215,6 +1275,8 @@
     background-image: url($image-url);
     background-position: $position;
     background-repeat: no-repeat;
+  } @else {
+    @error "`sprite` takes 1 or 2 arguments; you passed #{length($params)}. Pass an image path, a background position, or both in that order.";
   }
   @content;
 }
@@ -1257,9 +1319,11 @@
       and (orientation: landscape) {
         @content;
       }
+    } @else {
+      @error "`#{$orientation}` is not a valid $orientation for `tablet`. Pass `portrait`, `landscape`, or no orientation at all.";
     }
   } @else {
-    @warn "#{$device} is a wrong device name! The argument must be one of the followings: #{map-keys($map-for-tablets)}";
+    @error "`#{$device}` is not a device known to `tablet`. Pass one of: #{map-keys($map-for-tablets)}.";
   }
 }
 
@@ -1276,8 +1340,8 @@
       $list
     );
   } @else if not map-has-key($map-for-directions, $direction) {
-    @if not index("deg", unit($direction)) {
-      @error "#{$direction} is a wrong value for the $direction parameter. The value must be eighter a number followed by the 'deg' unit or one of the followings: #{map-keys($map-for-directions)}.";
+    @if type-of($direction) != "number" or not index("deg", unit($direction)) {
+      @error "`#{$direction}` is not a valid $direction for `text-gradient`. Pass an angle such as `45deg`, or one of: #{map-keys($map-for-directions)}.";
     } @else {
       background: linear-gradient($direction, $list);
     }
@@ -1318,6 +1382,10 @@
     *::selection {
       @content;
     }
+  } @else if not & and $value == "only" {
+    @error "`only` has no meaning at the root of a stylesheet, because there is no selector to limit the effect to. Call `text-selection(\"only\")` inside a selector, or pass no argument at all.";
+  } @else {
+    @error "`#{$value}` is not a valid argument for `text-selection`. Pass `\"only\"` inside a selector to affect just that element, or pass no argument at all.";
   }
 }
 
@@ -1330,6 +1398,13 @@
     // Takes each items come from $params.
     $item: nth($params, $i);
 
+    // Each group must carry at least a direction, a colour and a size. Without
+    // this the nth() calls below fail with "Invalid index", which says nothing
+    // about what the mixin wanted.
+    @if length($item) < 3 {
+      @error "`#{$item}` is not a valid shadow for `text-shadow`. Each group needs a direction, a colour and a size, such as `bottom-right red 5px`. An optional blur and a fill flag may follow.";
+    }
+
     // The first value comes from the $item is direction.
     // This will be used in the @if, @else statements with $size to control the offset of the shadows.
     $direction: nth($item, 1);
@@ -1506,6 +1581,6 @@
       @content;
     }
   } @else {
-    @error "The argument for direction must be one of the followings: #{quote($list-of-directions)}";
+    @error "The argument for direction must be one of the followings: #{$list-of-directions}";
   }
 }

package/scss/library/_after.scss

@@ -4,7 +4,9 @@
   &::after {
     @if $content == null {
       @content;
-    } @else if $content != null {
+    } @else if type-of($content) != "string" {
+      @error "`#{$content}` is not a valid $content for `after`. Pass a string to use as the content value, a data- attribute name such as `\"data-label\"` to render it with attr(), or no argument at all and write the content yourself.";
+    } @else {
       $data: str-slice($content, 1, 5);
       @if $data == "data-" {
         content: attr(#{$content});

package/scss/library/_all-buttons.scss

@@ -12,6 +12,6 @@
       @content;
     }
   } @else {
-    @error "The argument must be `null` or one of the followings: #{quote($list)}.";
+    @error "The argument must be `null` or one of the followings: #{$list}.";
   }
 }

package/scss/library/_all-text-inputs.scss

@@ -12,6 +12,6 @@
       @content;
     }
   } @else {
-    @error "The argument must be `null` or one of the followings: #{quote($list)}";
+    @error "The argument must be `null` or one of the followings: #{$list}";
   }
 }

package/scss/library/_antialias.scss

@@ -25,5 +25,9 @@
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
     }
+  } @else if not & and $value == "only" {
+    @error "`only` has no meaning at the root of a stylesheet, because there is no selector to limit the effect to. Call `antialias(\"only\")` inside a selector, or pass no argument at all.";
+  } @else {
+    @error "`#{$value}` is not a valid argument for `antialias`. Pass `\"only\"` inside a selector to affect just that element, or pass no argument at all.";
   }
 }

package/scss/library/_background-dots.scss

@@ -7,6 +7,12 @@
   $diagonal: true,
   $image: null
 ) {
+  @if $image != null and type-of($image) != "string" {
+    @error "`#{$image}` is not a valid $image for `background-dots`. Pass an image path as a string.";
+  }
+  @if $diagonal != true and $diagonal != false {
+    @error "`#{$diagonal}` is not a valid $diagonal for `background-dots`. Pass `true` or `false`.";
+  }
   @if not $color {
     $color: rgba(0, 0, 0, 0.1);
     @if $diagonal == true {

package/scss/library/_background-image.scss

@@ -23,11 +23,11 @@
               ),
               url($image-url);
           } @else {
-            @if index("deg", unit($filter-direction)) {
+            @if type-of($filter-direction) == "number" and index("deg", unit($filter-direction)) {
               background-image: linear-gradient($filter-direction, $color-list),
                 url($image-url);
             } @else {
-              @error "#{$filter-direction} is a wrong value for the $filter-direction parameter. The value must be either a number followed by the 'deg' unit or one of the following pre-defined values: #{quote(map-keys($map-for-directions))}.";
+              @error "`#{$filter-direction}` is not a valid $filter-direction. Pass an angle such as `45deg`, or one of: #{map-keys($map-for-directions)}.";
             }
           }
         } @else {

package/scss/library/_background-stripes.scss

@@ -6,6 +6,12 @@
   $rotation: -45deg,
   $image: null
 ) {
+  @if type-of($rotation) != "number" {
+    @error "`#{$rotation}` is not a valid $rotation for `background-stripes`. Pass an angle such as `-45deg`, or a unitless number which is treated as degrees.";
+  }
+  @if $image != null and type-of($image) != "string" {
+    @error "`#{$image}` is not a valid $image for `background-stripes`. Pass an image path as a string.";
+  }
   $validate-unit: if(not index("deg", unit($rotation)), $rotation + deg, $rotation);
   $get-image: if($image, unquote(", ") + url(unquote($image)), unquote(""));
   @if not $color {

package/scss/library/_before.scss

@@ -4,7 +4,9 @@
   &::before {
     @if $content == null {
       @content;
-    } @else if $content != null {
+    } @else if type-of($content) != "string" {
+      @error "`#{$content}` is not a valid $content for `before`. Pass a string to use as the content value, a data- attribute name such as `\"data-label\"` to render it with attr(), or no argument at all and write the content yourself.";
+    } @else {
       $data: str-slice($content, 1, 5);
       @if $data == "data-" {
         content: attr(#{$content});

package/scss/library/_border-box.scss

@@ -22,5 +22,9 @@
     *::after {
       box-sizing: border-box;
     }
+  } @else if not & and $value == "only" {
+    @error "`only` has no meaning at the root of a stylesheet, because there is no selector to limit the effect to. Call `border-box(\"only\")` inside a selector, or pass no argument at all.";
+  } @else {
+    @error "`#{$value}` is not a valid argument for `border-box`. Pass `\"only\"` inside a selector to affect just that element, or pass no argument at all.";
   }
 }

package/scss/library/_border-radius.scss

@@ -39,7 +39,7 @@
         border-bottom-left-radius: $value;
       }
     } @else {
-      @error "Corner value must be one of the followings: #{quote($list)}.";
+      @error "Corner value must be one of the followings: #{$list}.";
     }
   } @else if length($args) == 4 {
     $args: __null($args, space, true);
@@ -47,5 +47,7 @@
     border-top-right-radius: nth($args, 2);
     border-bottom-right-radius: nth($args, 3);
     border-bottom-left-radius: nth($args, 4);
+  } @else {
+    @error "`border-radius` takes 1, 2 or 4 arguments; you passed #{length($args)}. Use one radius for every corner, a corner name plus a radius, or four radii in top-left, top-right, bottom-right, bottom-left order.";
   }
 }

package/scss/library/_breakpointer.scss

@@ -1,6 +1,9 @@
 @charset "UTF-8";
 
 @mixin breakpointer($selector: null) {
+  @if $selector != null and type-of($selector) != "string" {
+    @error "`#{$selector}` is not a valid $selector for `breakpointer`. Pass a selector as a string, such as `\".debug\"`, or no argument at all to attach it to body.";
+  }
   @if & {
     &::before {
       @content;

package/scss/library/_center.scss

@@ -1,6 +1,9 @@
 @charset "UTF-8";
 
 @mixin center($axis: "both") {
+  @if not index("both" "horizontal" "vertical", $axis) {
+    @error "`#{$axis}` is not a valid $axis for `center`. Pass one of: both, horizontal, vertical.";
+  }
   @if $axis == "both" or $axis == "vertical" {
     top: 50%;
   }

package/scss/library/_columnizer.scss

@@ -1,6 +1,9 @@
 @charset "UTF-8";
 
 @mixin columnizer($params...) {
+  @if length($params) < 1 or length($params) > 3 {
+    @error "`columnizer` takes 1 to 3 arguments; you passed #{length($params)}. Pass the column count, optionally a gutter length, and optionally a boolean telling the last row whether to fill.";
+  }
   $columns: nth($params, 1);
   $gutter: null;
   $fill: false;
@@ -36,6 +39,8 @@
         &:nth-child(#{$columns}n) {
           margin-right: 0;
         }
+      } @else {
+        @error "`#{nth($params, 2)}` is not a valid second argument for `columnizer`. Pass a gutter length such as `20px`, or a boolean telling the last row whether to fill.";
       }
     } @else if length($params) == 3 {
       $gutter: nth($params, 2);

package/scss/library/_escape-to-parent.scss

@@ -1,6 +1,9 @@
 @charset "UTF-8";
 
 @mixin escape-to-parent($selector: null) {
+  @if $selector != null and type-of($selector) != "string" {
+    @error "`#{$selector}` is not a valid $selector for `escape-to-parent`. Pass a selector as a string, such as `\".theme-dark\"`.";
+  }
   @at-root #{$selector}#{&} {
     @content;
   }

package/scss/library/_except.scss

@@ -37,6 +37,8 @@
           @content;
         }
       }
+    } @else {
+      @error "`#{$value}` is not a valid argument for `except`. Pass a positive or negative number, one of `first`, `last`, `odd`, `even`, or a selector such as `.foo`.";
     }
   } @else if length($params) > 1 {
     $items: "";

package/scss/library/_font-face.scss

@@ -9,6 +9,10 @@
 ) {
   @if & {
     @error "You must call the mixin at the root level of your style sheet, not in the `#{&+'{'+'}'}` selector.";
+  } @else if type-of($font-family) != "string" {
+    @error "`#{$font-family}` is not a valid $font-family for `font-face`. Pass the family name as a string, such as `\"Inter\"`.";
+  } @else if type-of($file-path) != "string" {
+    @error "`#{$file-path}` is not a valid $file-path for `font-face`. Pass the path to the font files without an extension, as a string.";
   } @else {
     
     $list: ();

package/scss/library/_linear-gradient.scss

@@ -11,8 +11,8 @@
       $list
     );
   } @else if not map-has-key($map-for-directions, $direction) {
-    @if not index("deg", unit($direction)) {
-      @error "#{$direction} is a wrong value for the $direction parameter. The value must be eighter a number followed by the 'deg' unit or one of the followings: #{map-keys($map-for-directions)}.";
+    @if type-of($direction) != "number" or not index("deg", unit($direction)) {
+      @error "`#{$direction}` is not a valid $direction for `linear-gradient`. Pass an angle such as `45deg`, or one of: #{map-keys($map-for-directions)}.";
     } @else {
       background: linear-gradient($direction, $list);
     }

package/scss/library/_only.scss

@@ -38,6 +38,8 @@
           @content;
         }
       }
+    } @else {
+      @error "`#{$value}` is not a valid argument for `only`. Pass a positive or negative number, one of `first`, `last`, `odd`, `even`, or a selector such as `.foo`.";
     }
   } @else if length($params) > 1 {
     $list: ();

package/scss/library/_radial-gradient.scss

@@ -1,6 +1,12 @@
 @charset "UTF-8";
 
 @mixin radial-gradient($shape, $position, $colors) {
+  @if type-of($shape) != "string" {
+    @error "`#{$shape}` is not a valid $shape for `radial-gradient`. Pass `circle` or `ellipse`.";
+  }
+  @if type-of($position) != "string" {
+    @error "`#{$position}` is not a valid $position for `radial-gradient`. Pass a position name such as `center` or `top-left`, or a raw CSS position as a string.";
+  }
   $list: ();
   $shape: unquote($shape);
   $position: unquote($position);

package/scss/library/_remove.scss

@@ -29,6 +29,6 @@
       }
     }
   } @else {
-    @error "Error!";
+    @error "`remove` takes at most 2 arguments; you passed #{length($params)}. Pass nothing to hide the element outright, one breakpoint, `min`/`max` plus a breakpoint, or a start and an end breakpoint.";
   }
 }

package/scss/library/_scissors.scss

@@ -25,5 +25,7 @@
       #{nth($corners, 4)} 100%,
       0 calc(100% - #{nth($corners, 4)})
     );
+  } @else {
+    @error "`scissors` takes either 1 corner size or 4; you passed #{length($corners)}. Pass one length to cut every corner equally, or four lengths in top-left, top-right, bottom-right, bottom-left order.";
   }
 }

package/scss/library/_smartphone.scss

@@ -16,8 +16,10 @@
       and (orientation: landscape) {
         @content;
       }
+    } @else {
+      @error "`#{$orientation}` is not a valid $orientation for `smartphone`. Pass `portrait`, `landscape`, or no orientation at all.";
     }
   } @else {
-    @warn "#{$device} is a wrong device name! The argument must be one of the followings: #{map-keys($map-for-smartphones)}";
+    @error "`#{$device}` is not a device known to `smartphone`. Pass one of: #{map-keys($map-for-smartphones)}.";
   }
 }

package/scss/library/_sprite.scss

@@ -10,6 +10,8 @@
         display: inline-block;
         background-image: url($image-url);
         background-repeat: no-repeat;
+      } @else {
+        @error "`#{nth($params, 1)}` is not a valid image path for `sprite`. The path must end in .png, .jpg or .svg.";
       }
     } @else {
       $position: nth($params, 1);
@@ -22,6 +24,8 @@
     background-image: url($image-url);
     background-position: $position;
     background-repeat: no-repeat;
+  } @else {
+    @error "`sprite` takes 1 or 2 arguments; you passed #{length($params)}. Pass an image path, a background position, or both in that order.";
   }
   @content;
 }

package/scss/library/_tablet.scss

@@ -16,8 +16,10 @@
       and (orientation: landscape) {
         @content;
       }
+    } @else {
+      @error "`#{$orientation}` is not a valid $orientation for `tablet`. Pass `portrait`, `landscape`, or no orientation at all.";
     }
   } @else {
-    @warn "#{$device} is a wrong device name! The argument must be one of the followings: #{map-keys($map-for-tablets)}";
+    @error "`#{$device}` is not a device known to `tablet`. Pass one of: #{map-keys($map-for-tablets)}.";
   }
 }

package/scss/library/_text-gradient.scss

@@ -11,8 +11,8 @@
       $list
     );
   } @else if not map-has-key($map-for-directions, $direction) {
-    @if not index("deg", unit($direction)) {
-      @error "#{$direction} is a wrong value for the $direction parameter. The value must be eighter a number followed by the 'deg' unit or one of the followings: #{map-keys($map-for-directions)}.";
+    @if type-of($direction) != "number" or not index("deg", unit($direction)) {
+      @error "`#{$direction}` is not a valid $direction for `text-gradient`. Pass an angle such as `45deg`, or one of: #{map-keys($map-for-directions)}.";
     } @else {
       background: linear-gradient($direction, $list);
     }