Skip to content

Commit

Permalink
fix(styles): prevent utility API from creating unwanted classes
Browse files Browse the repository at this point in the history
  • Loading branch information
alizedebray committed Oct 4, 2024
1 parent 4c9a491 commit 3106f15
Show file tree
Hide file tree
Showing 3 changed files with 27 additions and 8 deletions.
9 changes: 7 additions & 2 deletions packages/styles/src/functions/_string.scss
Original file line number Diff line number Diff line change
@@ -1,12 +1,17 @@
@use 'sass:string';

@function replace($string, $term, $replacement: '') {
@function contains($string, $term) {
$index: string.index($string, $term);
@return if($index == null, false, true);
}

@function replace($string, $term, $replacement) {
$index: string.index($string, $term);

@if $index {
$before: string.slice($string, 1, $index - 1);
$after: string.slice($string, $index + string.length($term));
@return $before + $replacement + replace($after, $term, $replacement);
@return $before + $replacement + $after;
}

@return $string;
Expand Down
14 changes: 8 additions & 6 deletions packages/styles/src/utilities/index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -16,13 +16,15 @@
$prefixes: map.get($classesConfig, prefixes);

@each $key, $value in $tokens {
$suffix: string.replace($key, 'post-utility-#{$group}');
@if (string.contains($key, 'post-utility-#{$group}')) {
$suffix: string.replace($key, 'post-utility-#{$group}', '');

@each $prefix, $properties in $prefixes {
@if $responsive {
@include generate-responsive-utilities($properties, $value, $prefix, $suffix);
} @else {
@include generate-utilities($properties, $value, $prefix, $suffix);
@each $prefix, $properties in $prefixes {
@if $responsive {
@include generate-responsive-utilities($properties, $value, $prefix, $suffix);
} @else {
@include generate-utilities($properties, $value, $prefix, $suffix);
}
}
}
}
Expand Down
12 changes: 12 additions & 0 deletions packages/styles/tests/functions/string.test.scss
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,18 @@

$paragraph: "I think Ruth's dog is cuter than your dog!";

// it should return true if the term is found
@include jest.equal(
true,
string.contains($paragraph, 'dog')
);

// it should return false if the term is not found
@include jest.equal(
false,
string.contains($paragraph, 'cat')
);

// it should replace a term by another
@include jest.equal(
'I think my dog is cuter than your dog!',
Expand Down

0 comments on commit 3106f15

Please sign in to comment.