Home

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.