Skip to main content

Type Functions

Type functions test the kind of a value and return a boolean. Import the ones you need from @jesscss/fns. Each mirrors the equivalent Less built-in.

@-from '@jesscss/fns' import (isnumber, isstring, iscolor, iskeyword, isurl);

isnumber(value)

Returns true when the value is a number (a Dimension, with or without a unit), false otherwise.

isnumber(#ff0);     // false
isnumber("string"); // false
isnumber(1234); // true
isnumber(56px); // true
isnumber(7.8%); // true

isstring(value)

Returns true when the value is a quoted string, false otherwise.

isstring("string"); // true
isstring(blue); // false
isstring(1234); // false

iscolor(value)

Returns true when the value is a color, false otherwise.

iscolor(#ff0);     // true
iscolor(blue); // true
iscolor("string"); // false

iskeyword(value)

Returns true when the value is an unquoted keyword/identifier, false otherwise.

iskeyword(keyword); // true
iskeyword(blue); // false
iskeyword(1234); // false

isurl(value)

Returns true when the value is a url(…), false otherwise.

isurl(url(...));  // true
isurl("string"); // false

ispixel(value)

Returns true when the value is a number in pixels, false otherwise.

ispixel(56px);  // true
ispixel(7.8%); // false

isem(value)

Returns true when the value is a number in em, false otherwise.

isem(7.8em);  // true
isem(56px); // false

ispercentage(value)

Returns true when the value is a percentage, false otherwise.

ispercentage(7.8%);  // true
ispercentage(56px); // false

isunit(value, unit)

Returns true when the value is a number in the specified unit (matched case-insensitively), false otherwise.

isunit(11px, px);  // true
isunit(4rem, rem); // true
isunit(2.2%, px); // false
isunit(7.8%, '%'); // true

isruleset(value)

Returns true when the value is an anonymous mixin or a collection (in Less source, a detached ruleset), false otherwise. The argument is evaluated lazily.

@-from '@jesscss/fns' import (isruleset);
$rules: {
color: red;
};
.box {
a: isruleset($rules); // true
b: isruleset(#ff0); // false
}

isdefined(value)

Returns true when the referenced variable is defined, false otherwise. The argument is evaluated lazily, so an undefined reference yields false rather than erroring.

@-from '@jesscss/fns' import (isdefined);
$foo: 1;
.box {
a: isdefined($foo); // true
b: isdefined($bar); // false
}