aboutsummaryrefslogtreecommitdiffstats
path: root/src/bem/_block.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/bem/_block.scss')
-rw-r--r--src/bem/_block.scss222
1 files changed, 113 insertions, 109 deletions
diff --git a/src/bem/_block.scss b/src/bem/_block.scss
index cfa9f33..a4b2a47 100644
--- a/src/bem/_block.scss
+++ b/src/bem/_block.scss
@@ -4,6 +4,10 @@
4/// @access public 4/// @access public
5//// 5////
6 6
7@use 'sass:list';
8@use 'sass:map';
9@use 'sass:meta';
10@use 'sass:selector';
7@use './validators'; 11@use './validators';
8@use './vars'; 12@use './vars';
9@use './functions' as bemfunctions; 13@use './functions' as bemfunctions;
@@ -37,34 +41,34 @@
37/// } 41/// }
38/// 42///
39@mixin block($name, $type: null) { 43@mixin block($name, $type: null) {
40 $result: block($name, $type); 44 $result: block($name, $type);
41 $selector: nth($result, 1); 45 $selector: list.nth($result, 1);
42 $context: nth($result, 2); 46 $context: list.nth($result, 2);
43 47
44 @include validators.validate( 48 @include validators.validate(
45 'block', 49 'block',
46 (name: $name, type: $type), 50 (name: $name, type: $type),
47 $selector, 51 $selector,
48 $context 52 $context
49 ); 53 );
50 54
51 @if $type != null { 55 @if $type != null {
52 vars.$blocks: append(vars.$blocks, $name + '_' + $type); 56 vars.$blocks: list.append(vars.$blocks, $name + '_' + $type);
53 } @else { 57 } @else {
54 vars.$blocks: append(vars.$blocks, $name); 58 vars.$blocks: list.append(vars.$blocks, $name);
55 } 59 }
56 60
57 @include contexts.push(vars.$context-id, $context...); 61 @include contexts.push(vars.$context-id, $context...);
58 @at-root #{$selector} { 62 @at-root #{$selector} {
59 @if $type != null { 63 @if $type != null {
60 @layer #{$type} { 64 @layer #{$type} {
61 @content; 65 @content;
62 } 66 }
63 } @else { 67 } @else {
64 @content; 68 @content;
65 } 69 }
66 } 70 }
67 @include contexts.pop(vars.$context-id); 71 @include contexts.pop(vars.$context-id);
68} 72}
69 73
70/// 74///
@@ -75,47 +79,47 @@
75/// @see {mixin} block 79/// @see {mixin} block
76/// 80///
77@function block($name, $type: null) { 81@function block($name, $type: null) {
78 // 82 //
79 // Possible outcomes: 83 // Possible outcomes:
80 // - ({b,e,m,s}) block 84 // - ({b,e,m,s}) block
81 // 85 //
82 86
83 $noop: contexts.assert-stack-count(vars.$context-id, vars.$max-depth); 87 $noop: contexts.assert-stack-count(vars.$context-id, vars.$max-depth);
84 88
85 $selector: null; 89 $selector: null;
86 $base-selector: null; 90 $base-selector: null;
87 91
88 @if $type != null { 92 @if $type != null {
89 $namespace: map-get(vars.$namespaces, $type); 93 $namespace: map.get(vars.$namespaces, $type);
90 94
91 @if not $namespace { 95 @if not $namespace {
92 @error '"#{$type}" is not a valid type.'; 96 @error '"#{$type}" is not a valid type.';
93 } 97 }
94 98
95 $base-selector: selector-parse('.' + $namespace + '-' + $name); 99 $base-selector: selector.parse('.' + $namespace + '-' + $name);
96 100
97 @if $type != 'theme' or & { 101 @if $type != 'theme' or & {
98 $selector: $base-selector; 102 $selector: $base-selector;
99 } @else if not & { 103 } @else if not & {
100 $selector: bemfunctions.theme-selector($name); 104 $selector: bemfunctions.theme-selector($name);
101 } 105 }
102 } @else { 106 } @else {
103 $base-selector: selector-parse('.' + $name); 107 $base-selector: selector.parse('.' + $name);
104 $selector: $base-selector; 108 $selector: $base-selector;
105 } 109 }
106 110
107 @if & { 111 @if & {
108 $selector: selector-nest(&, $selector); 112 $selector: selector.nest(&, $selector);
109 } 113 }
110 114
111 $context: 'block', ( 115 $context: 'block', (
112 'name': $name, 116 'name': $name,
113 'type': $type, 117 'type': $type,
114 'selector': $selector, 118 'selector': $selector,
115 'base-selector': $base-selector 119 'base-selector': $base-selector
116 ); 120 );
117 121
118 @return $selector $context; 122 @return $selector $context;
119} 123}
120 124
121/// 125///
@@ -126,9 +130,9 @@
126/// @content 130/// @content
127/// 131///
128@mixin object($name) { 132@mixin object($name) {
129 @include block($name, 'object') { 133 @include block($name, 'object') {
130 @content; 134 @content;
131 } 135 }
132} 136}
133 137
134/// 138///
@@ -139,7 +143,7 @@
139/// @see {mixin} object 143/// @see {mixin} object
140/// 144///
141@function object($name) { 145@function object($name) {
142 @return block($name, 'object'); 146 @return block($name, 'object');
143} 147}
144 148
145/// 149///
@@ -150,9 +154,9 @@
150/// @content 154/// @content
151/// 155///
152@mixin component($name) { 156@mixin component($name) {
153 @include block($name, 'component') { 157 @include block($name, 'component') {
154 @content; 158 @content;
155 } 159 }
156} 160}
157 161
158/// 162///
@@ -163,7 +167,7 @@
163/// @see {mixin} component 167/// @see {mixin} component
164/// 168///
165@function component($name) { 169@function component($name) {
166 @return block($name, 'component'); 170 @return block($name, 'component');
167} 171}
168 172
169/// 173///
@@ -174,9 +178,9 @@
174/// @content 178/// @content
175/// 179///
176@mixin layout($name) { 180@mixin layout($name) {
177 @include block($name, 'layout') { 181 @include block($name, 'layout') {
178 @content; 182 @content;
179 } 183 }
180} 184}
181 185
182/// 186///
@@ -187,7 +191,7 @@
187/// @see {mixin} layout 191/// @see {mixin} layout
188/// 192///
189@function layout($name) { 193@function layout($name) {
190 @return block($name, 'layout'); 194 @return block($name, 'layout');
191} 195}
192 196
193/// 197///
@@ -198,9 +202,9 @@
198/// @content 202/// @content
199/// 203///
200@mixin utility($name) { 204@mixin utility($name) {
201 @include block($name, 'utility') { 205 @include block($name, 'utility') {
202 @content; 206 @content;
203 } 207 }
204} 208}
205 209
206/// 210///
@@ -211,7 +215,7 @@
211/// @see {mixin} utility 215/// @see {mixin} utility
212/// 216///
213@function utility($name) { 217@function utility($name) {
214 @return block($name, 'utility'); 218 @return block($name, 'utility');
215} 219}
216 220
217/// 221///
@@ -222,9 +226,9 @@
222/// @content 226/// @content
223/// 227///
224@mixin scope($name) { 228@mixin scope($name) {
225 @include block($name, 'scope') { 229 @include block($name, 'scope') {
226 @content; 230 @content;
227 } 231 }
228} 232}
229 233
230/// 234///
@@ -235,7 +239,7 @@
235/// @see {mixin} scope 239/// @see {mixin} scope
236/// 240///
237@function scope($name) { 241@function scope($name) {
238 @return block($name, 'scope'); 242 @return block($name, 'scope');
239} 243}
240 244
241/// 245///
@@ -246,9 +250,9 @@
246/// @content 250/// @content
247/// 251///
248@mixin theme($name) { 252@mixin theme($name) {
249 @include block($name, 'theme') { 253 @include block($name, 'theme') {
250 @content; 254 @content;
251 } 255 }
252} 256}
253 257
254/// 258///
@@ -259,7 +263,7 @@
259/// @see {mixin} theme 263/// @see {mixin} theme
260/// 264///
261@function theme($name) { 265@function theme($name) {
262 @return block($name, 'theme'); 266 @return block($name, 'theme');
263} 267}
264 268
265/// 269///
@@ -270,9 +274,9 @@
270/// @content 274/// @content
271/// 275///
272@mixin js($name) { 276@mixin js($name) {
273 @include block($name, 'js') { 277 @include block($name, 'js') {
274 @content; 278 @content;
275 } 279 }
276} 280}
277 281
278/// 282///
@@ -283,7 +287,7 @@
283/// @see {mixin} js 287/// @see {mixin} js
284/// 288///
285@function js($name) { 289@function js($name) {
286 @return block($name, 'js'); 290 @return block($name, 'js');
287} 291}
288 292
289/// 293///
@@ -294,9 +298,9 @@
294/// @content 298/// @content
295/// 299///
296@mixin qa($name) { 300@mixin qa($name) {
297 @include block($name, 'qa') { 301 @include block($name, 'qa') {
298 @content; 302 @content;
299 } 303 }
300} 304}
301 305
302/// 306///
@@ -307,7 +311,7 @@
307/// @see {mixin} qa 311/// @see {mixin} qa
308/// 312///
309@function qa($name) { 313@function qa($name) {
310 @return block($name, 'qa'); 314 @return block($name, 'qa');
311} 315}
312 316
313/// 317///
@@ -318,9 +322,9 @@
318/// @content 322/// @content
319/// 323///
320@mixin hack($name) { 324@mixin hack($name) {
321 @include block($name, 'hack') { 325 @include block($name, 'hack') {
322 @content; 326 @content;
323 } 327 }
324} 328}
325 329
326/// 330///
@@ -331,7 +335,7 @@
331/// @see {mixin} hack 335/// @see {mixin} hack
332/// 336///
333@function hack($name) { 337@function hack($name) {
334 @return block($name, 'hack'); 338 @return block($name, 'hack');
335} 339}
336 340
337/// 341///
@@ -383,22 +387,22 @@
383/// // Compilation will fail because c-someBlock is defined after c-anotherBlock__elem 387/// // Compilation will fail because c-someBlock is defined after c-anotherBlock__elem
384/// 388///
385@mixin composed-of($block, $blocks...) { 389@mixin composed-of($block, $blocks...) {
386 @each $block in functions.list-prepend($blocks, $block) { 390 @each $block in functions.list-prepend($blocks, $block) {
387 @if type-of($block) == string { 391 @if meta.type-of($block) == string {
388 @if not index(vars.$blocks, $block) { 392 @if not list.index(vars.$blocks, $block) {
389 @error 'Block "#{$block}" does not exist.'; 393 @error 'Block "#{$block}" does not exist.';
390 } 394 }
391 } @else { 395 } @else {
392 $name: nth($block, 1); 396 $name: list.nth($block, 1);
393 $type: nth($block, 2); 397 $type: list.nth($block, 2);
394 398
395 @if not map-get(vars.$namespaces, $type) { 399 @if not map.get(vars.$namespaces, $type) {
396 @error '"#{$type}" is not a valid type.'; 400 @error '"#{$type}" is not a valid type.';
397 } 401 }
398 402
399 @if not index(vars.$blocks, $name + '_' + $type) { 403 @if not list.index(vars.$blocks, $name + '_' + $type) {
400 @error 'Block "#{$name}" does not exist.'; 404 @error 'Block "#{$name}" does not exist.';
401 } 405 }
402 } 406 }
403 } 407 }
404} 408}
generated by cgit v1.2.3-70-g09d2 (git 2.50.0) at 2025-08-22 18:52:11 +0000