Skip to content

Commit e71acd8

Browse files
committed
[refactor]: Move nesting to bem-extend()
1 parent e3198ca commit e71acd8

2 files changed

Lines changed: 43 additions & 53 deletions

File tree

src/mixins/function.scss

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
/// See [Combinators](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors#Combinators "CSS selectors")
77
$_selector-combinators: ("+", "~", ">", "||");
88

9-
@function bem-extend($selectors, $extendee, $extender) {
9+
@function bem-extend($selectors, $extendees, $extender) {
1010
$returns: ();
1111

1212
@if null == $selectors {
@@ -16,15 +16,13 @@ $_selector-combinators: ("+", "~", ">", "||");
1616
@each $selector in $selectors {
1717
$len: length($selector);
1818

19-
@if nth($selector, $len) == $extendee {
20-
@if $len >= 2 {
21-
@if index($_selector-combinators, nth($selector, $len - 1)) == null {
22-
$returns: append($returns, set-nth($selector, $len, $extender), "comma");
23-
} @else {
24-
$returns: append($returns, append($selector, $extender), "comma");
25-
}
26-
} @else {
19+
@if index($extendees, nth($selector, $len)) != null {
20+
@if $len < 2 {
2721
$returns: append($returns, ($extender), "comma");
22+
} @else if index($_selector-combinators, nth($selector, $len - 1)) == null {
23+
$returns: append($returns, set-nth($selector, $len, $extender), "comma");
24+
} @else {
25+
$returns: append($returns, append($selector, $extender), "comma");
2826
}
2927
} @else {
3028
$returns: append($returns, append($selector, $extender), "comma");

src/mixins/mixins.scss

Lines changed: 36 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -83,42 +83,34 @@ $_BEM: (null, null, null);
8383

8484
@mixin e($elements) {
8585
$block: nth($_BEM, 1);
86+
$old-elements: nth($_BEM, 2);
8687

8788
@if null == $block {
8889
@error "Base-level rules cannot contain an element mixin";
8990
} @else {
90-
$selects: &;
91-
$old-elems: nth($_BEM, 2);
92-
93-
@if (null != $old-elems) {
94-
$selects: ();
95-
96-
@each $old-select in & {
97-
@each $old-element in $old-elems {
98-
$old-bem: ".#{$namespace}-#{$block}#{$element-separator}#{$old-element}";
99-
$old-len: length($old-select);
100-
101-
@if nth($old-select, $old-len) == $old-bem {
102-
$selects: append($selects, set-nth($old-select, $old-len, ".#{$namespace}-#{$block}"), "comma", );
103-
} @else {
104-
$selects: append($selects, $old-select, "comma", );
105-
}
106-
}
107-
}
108-
}
109-
11091
$lastBEM: $_BEM;
11192
$_BEM: ($block, $elements, null) !global;
11293

113-
$parent: ".#{$namespace}-#{$block}";
94+
$parents: ();
95+
96+
@if (null == $old-elements) {
97+
$parents: append($parents, ".#{$namespace}-#{$block}");
98+
} @else {
99+
@each $element in $old-elements {
100+
$parents: append($parents, ".#{$namespace}-#{$block}#{$element-separator}#{$element}");
101+
}
102+
}
103+
114104
$current: ();
115105

116106
@each $element in $elements {
117-
$current: append(
118-
$current,
119-
bem-extend($selects, $parent, "#{$parent}#{$element-separator}#{$element}"),
120-
"comma",
121-
);
107+
@each $parent in $parents {
108+
$current: append(
109+
$current,
110+
bem-extend(&, $parent, ".#{$namespace}-#{$block}#{$element-separator}#{$element}"),
111+
"comma",
112+
);
113+
}
122114
}
123115

124116
@at-root {
@@ -133,42 +125,42 @@ $_BEM: (null, null, null);
133125

134126
@mixin m($modifiers) {
135127
$block: nth($_BEM, 1);
128+
$elements: nth($_BEM, 2);
129+
$old-modifiers: nth($_BEM, 3);
136130

137131
@if null == $block {
138132
@error "Base-level rules cannot contain a modifier mixin";
139-
} @else if null != nth($_BEM, 3) {
133+
} @else if null != $old-modifiers {
140134
@error "Modifier-level rules cannot contain another modifier mixin";
141135
} @else {
142-
$elements: nth($_BEM, 2);
143-
144-
@if (null == $elements) {
145-
$elements: (null);
146-
}
147-
148136
$lastBEM: $_BEM;
149137
$_BEM: ($block, $elements, $modifiers) !global;
150138

151-
@each $element in $elements {
152-
$parent: ".#{$namespace}-#{$block}";
139+
$parents: ();
153140

154-
@if (null != $element) {
155-
$parent: "#{$parent}#{$element-separator}#{$element}";
141+
@if (null == $elements) {
142+
$parents: append($parents, ".#{$namespace}-#{$block}");
143+
} @else {
144+
@each $element in $elements {
145+
$parents: append($parents, ".#{$namespace}-#{$block}#{$element-separator}#{$element}");
156146
}
147+
}
157148

158-
$current: ();
149+
$current: ();
159150

160-
@each $modifier in $modifiers {
151+
@each $modifier in $modifiers {
152+
@each $parent in $parents {
161153
$current: append(
162154
$current,
163-
bem-extend(&, $parent, "#{$parent}#{$modifier-separator}#{$modifier}"),
155+
bem-extend(&, $parents, "#{$parent}#{$modifier-separator}#{$modifier}"),
164156
"comma",
165157
);
166158
}
159+
}
167160

168-
@at-root {
169-
#{$current} {
170-
@content;
171-
}
161+
@at-root {
162+
#{$current} {
163+
@content;
172164
}
173165
}
174166

0 commit comments

Comments
 (0)