Skip to content

Commit dd41147

Browse files
committed
Meta tweaks
1 parent 4ee6cad commit dd41147

File tree

7 files changed

+109
-82
lines changed

7 files changed

+109
-82
lines changed

.github/funding.yml

Lines changed: 0 additions & 4 deletions
This file was deleted.

.github/workflows/main.yml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,8 @@ jobs:
1212
node-version:
1313
- 14
1414
steps:
15-
- uses: actions/checkout@v2
16-
- uses: actions/setup-node@v1
15+
- uses: actions/checkout@v4
16+
- uses: actions/setup-node@v4
1717
with:
1818
node-version: ${{ matrix.node-version }}
1919
- run: npm install

index.scss

Lines changed: 25 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,10 @@
1+
@use 'sass:color';
2+
@use 'sass:list';
3+
@use 'sass:meta';
4+
@use 'sass:selector';
5+
@use 'sass:string';
6+
@use 'sass:math';
7+
18
/// Strip the unit from a number.
29
///
310
/// @group number
@@ -9,7 +16,7 @@
916
/// @debug strip-unit(5px);
1017
/// //=> 5
1118
@function strip-unit($number) {
12-
@return $number / ($number * 0 + 1);
19+
@return math.div($number, $number * 0 + 1);
1320
}
1421

1522
/// Clamp `$number` between `$min` and `$max`.
@@ -54,7 +61,7 @@
5461
/// @debug string-contains('foo bar baz', $substring: 'bar');
5562
/// //=> true
5663
@function string-contains($string, $substring) {
57-
@return str-index($string, $substring) != null;
64+
@return string.index($string, $substring) != null;
5865
}
5966

6067
/// Check if `$string` starts with the given `$substring`.
@@ -69,7 +76,7 @@
6976
/// @debug string-starts-with('foo bar', $substring: 'foo');
7077
/// //=> true
7178
@function string-starts-with($string, $substring) {
72-
@return str-index($string, $substring) == 1;
79+
@return string.index($string, $substring) == 1;
7380
}
7481

7582
/// Check if `$string` ends with the given `$substring`.
@@ -86,7 +93,7 @@
8693
@function string-ends-with($string, $substring) {
8794
// This crashes libsass…
8895
// @return str-slice($string, str-length($substring) * -1) == $substring;
89-
@return str-slice($string, (str-length($string) - str-length($substring) + 1)) == $substring;
96+
@return string.slice($string, (string.length($string) - string.length($substring) + 1)) == $substring;
9097
}
9198

9299
/// Replace substring `$search` in `$string` with `$replacement`.
@@ -102,13 +109,13 @@
102109
/// @debug string-replace('foo bar baz', $search: 'bar', $replacement: 'unicorn');
103110
/// //=> 'foo unicorn baz'
104111
@function string-replace($string, $search, $replacement: '') {
105-
$index: str-index($string: $string, $substring: $search);
112+
$index: string.index($string: $string, $substring: $search);
106113

107114
@if $index {
108115
@return
109-
str-slice($string, $start-at: 1, $end-at: $index - 1)
116+
string.slice($string, $start-at: 1, $end-at: $index - 1)
110117
+ $replacement
111-
+ string-replace(str-slice($string, $start-at: $index + str-length($search)), $search, $replacement);
118+
+ string-replace(string.slice($string, $start-at: $index + string.length($search)), $search, $replacement);
112119
}
113120

114121
@return $string;
@@ -125,7 +132,7 @@
125132
/// @debug list-first((1, 2, 3));
126133
/// //=> 1
127134
@function list-first($list) {
128-
@return nth($list, 1);
135+
@return list.nth($list, 1);
129136
}
130137

131138
/// Get the last element of `$list`.
@@ -139,7 +146,7 @@
139146
/// @debug list-last((1, 2, 3));
140147
/// //=> 3
141148
@function list-last($list) {
142-
@return nth($list, -1);
149+
@return list.nth($list, -1);
143150
}
144151

145152
/// Generate a pseudorandom integer.
@@ -181,7 +188,7 @@
181188
@function seed-random-float($seed) {
182189
$max-int32: 2147483647;
183190
$integer: seed-random-integer($seed);
184-
@return ($integer - 1) / ($max-int32 - 1);
191+
@return math.div($integer - 1, $max-int32 - 1);
185192
}
186193

187194
/// Generate a pseudorandom boolean.
@@ -219,8 +226,8 @@
219226
@function random-color($saturation: 0.5, $lightness: 0.5) {
220227
/* stylelint-disable-next-line number-max-precision */
221228
$golden-ratio-conjugate: 0.618033988749895;
222-
$hue: (random() + $golden-ratio-conjugate) % 1;
223-
@return hsl($hue * 360, $saturation * 100, $lightness * 100);
229+
$hue: (math.random() + $golden-ratio-conjugate) % 1;
230+
@return hsl($hue * 360, $saturation * 100%, $lightness * 100%);
224231
}
225232

226233
/// Encode URL-unsafe characters in `$string`.
@@ -282,7 +289,7 @@
282289
/// color: #ffc6d0;
283290
/// }
284291
@function tint($color, $percentage) {
285-
@return mix(#fff, $color, $percentage);
292+
@return color.mix(#fff, $color, $percentage);
286293
}
287294

288295
/// Darken a color by mixing it with black.
@@ -303,7 +310,7 @@
303310
/// color: #e6adb7;
304311
/// }
305312
@function shade($color, $percentage) {
306-
@return mix(#000, $color, $percentage);
313+
@return color.mix(#000, $color, $percentage);
307314
}
308315

309316
/// Get the color black with a given `$opacity`.
@@ -323,7 +330,7 @@
323330
/// color: rgba(0, 0, 0, 0.1);
324331
/// }
325332
@function black($opacity) {
326-
@return rgba(0, 0, 0, $opacity / 100%);
333+
@return rgba(0, 0, 0, math.div($opacity, 100%));
327334
}
328335

329336
/// Get the color white with a given `$opacity`.
@@ -343,7 +350,7 @@
343350
/// color: rgba(255, 255, 255, 0.1);
344351
/// }
345352
@function white($opacity) {
346-
@return rgba(255, 255, 255, $opacity / 100%);
353+
@return rgba(255, 255, 255, math.div($opacity, 100%));
347354
}
348355

349356
/// Use SVG anywhere a `url()` is accepted, like in a `background` property.
@@ -357,7 +364,7 @@
357364
@function svg-url($svg) {
358365
// Add missing namespace
359366
$namespace: 'xmlns="http://www.w3.org/2000/svg"';
360-
@if not str-index($string: $svg, $substring: $namespace) {
367+
@if not string.index($string: $svg, $substring: $namespace) {
361368
$svg: string-replace($string: $svg, $search: '<svg', $replacement: '<svg #{$namespace}');
362369
}
363370

@@ -407,7 +414,7 @@
407414
/// color: blue;
408415
/// }
409416
@mixin context($changed, $to) {
410-
@at-root #{selector-replace(&, $changed, $to)} {
417+
@at-root #{selector.replace(&, $changed, $to)} {
411418
@content;
412419
}
413420
}

package.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,8 @@
1616
"node": "^12.20.0 || ^14.13.1 || >=16.0.0"
1717
},
1818
"scripts": {
19-
"test": "xo && stylelint index.scss && ava",
19+
"//test": "xo && stylelint index.scss && ava",
20+
"test": "stylelint index.scss && ava",
2021
"docs": "sassdoc index.scss",
2122
"version": "npm run docs && git add docs"
2223
},
@@ -36,7 +37,7 @@
3637
],
3738
"devDependencies": {
3839
"ava": "^3.15.0",
39-
"node-sass": "^6.0.1",
40+
"sass": "^1.77.8",
4041
"sassdoc": "^2.7.3",
4142
"stylelint": "^13.6.1",
4243
"stylelint-config-xo-scss": "^0.14.0",

test.js

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,12 @@
11
import test from 'ava';
2-
import sass from 'node-sass';
2+
import * as sass from 'sass';
33

44
const render = data => {
5-
const result = sass.renderSync({
6-
data: `@import './index';\n${data}`,
7-
indentType: 'tab',
8-
outputStyle: 'compact',
9-
precision: 10,
5+
const result = sass.compileString(`@use './index' as *;\n${data}`, {
6+
style: 'expanded',
7+
loadPaths: ['.'],
108
});
11-
return result.css.toString();
9+
return result.css;
1210
};
1311

1412
const snapshot = (t, data) => {
@@ -24,7 +22,9 @@ const snapshotFunction = (t, data) => {
2422
};
2523

2624
const functionResultsAreEqual = (t, a, b) => {
27-
t.is(render(`a { top: ${a} }`).slice(9, -4), b);
25+
const css = render(`a { top: ${a} }`);
26+
const match = css.match(/top:\s*([^;]+);/);
27+
t.is(match ? match[1] : '', b);
2828
};
2929

3030
test('strip-unit()', t => {
@@ -89,8 +89,8 @@ test('seed-random-boolean()', t => {
8989
});
9090

9191
test('random-color()', t => {
92-
t.regex(render('a { width: random-color() }'), /a { width: #[a-z\d]+; }/);
93-
t.regex(render('a { width: random-color($saturation: 0.8, $lightness: 0.3) }'), /a { width: #[a-z\d]+; }/);
92+
t.regex(render('a { width: random-color() }'), /a\s*{\s*width:\s*(#[a-f\d]+|hsl\([^)]+\));?\s*}/i);
93+
t.regex(render('a { width: random-color($saturation: 0.8, $lightness: 0.3) }'), /a\s*{\s*width:\s*(#[a-f\d]+|hsl\([^)]+\));?\s*}/i);
9494
});
9595

9696
test('url-encode()', t => {

0 commit comments

Comments
 (0)