README

Sass modules (Sasses) provide more advanced variables, mixins and functions for Sass.

Getting Started

Require

Dart Sass: >= 1.23.0

Installation

Node Package Manager (NPM)

npm i sasses

Packagist

composer require officialxviid/sasses

How to Use

For example, we use the parameter-type() function in the throw package.

throw.parameter-type($context, $name, $value, $catch: false, $types...);
// or
parameter-type-exception($context, $name, $value, $catch: false, $types...);

If you use a specific package, then:

@use "sass:meta";
@use "sass:color";
@use "@sasses/throw";

@function tint-color($color, $amount) {
  @if meta.type-of($color) != "color" {
    @return throw.parameter-type("tint-color", "color", $color, false, "color");
  }

  @if meta.type-of($amount) != "number" {
    @return throw.parameter-type(
      "tint-color",
      "amount",
      $amount,
      false,
      "number"
    );
  }

  @return color.mix(#fff, $color, $amount);
}

// ❌ Try the result with Invalid input
@debug tint-color(true, "one");

// ✅ Try the result with Valid input
@debug tint-color(#c69, 90%);

Otherwise,

@use "sass:meta";
@use "sass:color";

@function tint-color($color, $amount) {
  @if meta.type-of($color) != "color" {
    @return parameter-type-exception(
      "tint-color",
      "color",
      $color,
      false,
      "color"
    );
  }

  @if meta.type-of($amount) != "number" {
    @return parameter-type-exception(
      "tint-color",
      "amount",
      $amount,
      false,
      "number"
    );
  }

  @return color.mix(#fff, $color, $amount);
}

// ❌ Try the result with Invalid input
@debug tint-color(true, "one");

// ✅ Try the result with Valid input
@debug tint-color(#c69, 90%);

Packages

Throw Package

Provides Sass mixins and functions to standardize exception messages.

Mixins

Exception: Use in place of @error statements inside mixins or other control structures with CSS output (not functions).
Variable: Use in place of variable @error statements inside mixins or other control structures with CSS output (not functions).
Variable Type: Use in place of variable type @error statements inside mixins or other control structures with CSS output (not functions).
Parameter: Use in place of parameter @error statements inside mixins or other control structures with CSS output (not functions).
Parameter Type: Use in place of parameter type @error statements inside mixins or other control structures with CSS output (not functions).

Function

Exception: Use in place of @error statements inside functions.
Variable: Returns an error message stating an issue with one or more variables.
Variable Type: Returns an error message stating a variable received the wrong type.
Parameter: Returns an error message stating an issue with one or more parameters.
Parameter Type: Returns an error message stating a parameter received the wrong type.

officialxviid / sasses

Maintainers

Details