Skip to content

Commit

Permalink
fix: improve support for each
Browse files Browse the repository at this point in the history
  • Loading branch information
Pawel Szewczyk authored and Pawel Szewczyk committed Sep 20, 2023
1 parent 085a559 commit f561999
Show file tree
Hide file tree
Showing 4 changed files with 105 additions and 2 deletions.
2 changes: 1 addition & 1 deletion src/lib/get-value-as-object.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ export default function getValueAsObject(value) {
const matchWrappingParens = /^\(([\W\w]*)\)$/g;

// match a property name (any-possible_name)
const matchDeclaration = /^([\w-]+)\s*:\s*([\W\w]+)\s*$/;
const matchDeclaration = /^["']?([\w-]+)["']?\s*:\s*([\W\w]+)\s*$/;

// match a trailing comma
const matchTrailingComma = /\s*,\s*$/;
7 changes: 6 additions & 1 deletion src/lib/transform-each-atrule.js
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ export default function transformEachAtrule(rule, opts) {
// return the @each statement options (@each NAME in LIST, @each NAME ITERATOR in LIST)
const getEachOpts = (node, opts) => {
const params = node.params.split(matchInOperator);
const args = (params[0] || '').trim().split(' ');
const args = (params[0] || '').trim().split(/[\s,]+/);
const varname = args[0].trim().slice(1);
const incname = args.length > 1 && args[1].trim().slice(1);
const rawlist = getValueAsObject(
Expand All @@ -67,6 +67,11 @@ const getEachOpts = (node, opts) => {
);
const list = 'string' === typeof rawlist ? [rawlist] : rawlist;

const reverseParams = incname && !Array.isArray(list)
if (reverseParams) {
return { incname: varname, varname: incname, list };
}

return { varname, incname, list };
};

Expand Down
47 changes: 47 additions & 0 deletions test/each.expect.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
/* arrayTest: $value */
.one-arrayTest {
content: one;
}
.two-arrayTest {
content: two;
}

/* arrayTest: $value, $key */
.0-arrayTest {
content: one;
}
.1-arrayTest {
content: two;
}

/* objectTest: $value */
."1"-arrayTest {
content: "1";
}
."2"-arrayTest {
content: "2";
}

/* objectTest: $key, $value */
.one-arrayTest {
content: "1";
}
.two-arrayTest {
content: "2";
}

/* objectStringTest: $key, $value */
.one-arrayTest {
content: "1";
}
.two-arrayTest {
content: "2";
}

/* objectStringTestMultiLine: $key, $value */
.one-arrayTest {
content: "1";
}
.two-arrayTest {
content: "2";
}
51 changes: 51 additions & 0 deletions test/each.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
$arrayTest: (one, two);

$objectTest: (one: "1", two: "2");
$objectStringTest: ("one": "1", "two": "2");

$objectStringTestMultiLine: (
"one": "1",
"two": "2"
);

/* arrayTest: $value */
@each $value in $arrayTest {
.#{$value}-arrayTest {
content: #{$value};
}
}

/* arrayTest: $value, $key */
@each $value, $key in $arrayTest {
.#{$key}-arrayTest {
content: #{$value};
}
}

/* objectTest: $value */
@each $value in $objectTest {
.#{$value}-arrayTest {
content: #{$value};
}
}

/* objectTest: $key, $value */
@each $key, $value in $objectTest {
.#{$key}-arrayTest {
content: #{$value};
}
}

/* objectStringTest: $key, $value */
@each $key, $value in $objectStringTest {
.#{$key}-arrayTest {
content: #{$value};
}
}

/* objectStringTestMultiLine: $key, $value */
@each $key, $value in $objectStringTestMultiLine {
.#{$key}-arrayTest {
content: #{$value};
}
}

0 comments on commit f561999

Please sign in to comment.