@master/css 2.0.0-rc.66 → 2.0.0-rc.68
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/config/rules.cjs +7 -0
- package/dist/config/rules.d.ts +1469 -278
- package/dist/config/rules.mjs +7 -0
- package/dist/config/utilities.cjs +11 -3
- package/dist/config/utilities.d.ts +10 -2
- package/dist/config/utilities.mjs +11 -3
- package/dist/config/variables.cjs +179 -179
- package/dist/config/variables.mjs +179 -179
- package/dist/core.cjs +61 -88
- package/dist/core.mjs +61 -88
- package/dist/syntax-rule.cjs +9 -4
- package/dist/syntax-rule.mjs +9 -4
- package/dist/utils/generate-selector.cjs +2 -1
- package/dist/utils/generate-selector.mjs +2 -1
- package/dist/utils/parse-selector.cjs +4 -2
- package/dist/utils/parse-selector.d.ts +1 -1
- package/dist/utils/parse-selector.mjs +4 -2
- package/package.json +1 -1
- package/dist/config/styles.cjs +0 -2
- package/dist/config/styles.d.ts +0 -3
- package/dist/config/styles.mjs +0 -1
package/dist/core.cjs
CHANGED
|
@@ -224,61 +224,31 @@ class MasterCSS {
|
|
|
224
224
|
resolveComponents() {
|
|
225
225
|
const { components } = this.config;
|
|
226
226
|
const flatComps = components ? flattenObject.flattenObject(components) : {};
|
|
227
|
-
const
|
|
228
|
-
const
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
227
|
+
const flatNames = Object.keys(flatComps);
|
|
228
|
+
const resolve = (name, currentClasses = [])=>{
|
|
229
|
+
const compClasses = this.components.get(name);
|
|
230
|
+
if (compClasses) {
|
|
231
|
+
currentClasses.push(...compClasses);
|
|
232
|
+
return;
|
|
233
|
+
}
|
|
234
234
|
const className = flatComps[name];
|
|
235
|
-
if (!className)
|
|
236
|
-
const
|
|
237
|
-
const
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
seen.add(cls);
|
|
241
|
-
currentClass.push(cls);
|
|
242
|
-
}
|
|
243
|
-
};
|
|
244
|
-
for (const eachClassName of classNames){
|
|
245
|
-
if (nameSet.has(eachClassName)) {
|
|
246
|
-
addClass(eachClassName);
|
|
247
|
-
// Lazy expand dependencies if not processed
|
|
248
|
-
if (!this.components.has(eachClassName)) {
|
|
249
|
-
const componentClass = flatComps[eachClassName];
|
|
250
|
-
if (componentClass) {
|
|
251
|
-
this.components.set(eachClassName, []) // placeholder to prevent infinite loop
|
|
252
|
-
;
|
|
253
|
-
// Recursively resolve
|
|
254
|
-
const depClassNames = componentClass.replace(/(?:\n\s*)+/g, ' ').trim().split(' ');
|
|
255
|
-
depClassNames.forEach(addClass);
|
|
256
|
-
}
|
|
257
|
-
}
|
|
258
|
-
const componentClasses = this.components.get(eachClassName);
|
|
259
|
-
componentClasses?.forEach(addClass);
|
|
235
|
+
if (!className) return;
|
|
236
|
+
const classes = className.replace(/(?:\n\s*)+/g, ' ').trim().split(' ');
|
|
237
|
+
for (const cls of classes){
|
|
238
|
+
if (flatNames.includes(cls)) {
|
|
239
|
+
resolve(cls, currentClasses);
|
|
260
240
|
} else {
|
|
261
|
-
|
|
241
|
+
currentClasses.push(cls);
|
|
262
242
|
}
|
|
263
243
|
}
|
|
244
|
+
this.components.set(name, [
|
|
245
|
+
...currentClasses
|
|
246
|
+
]);
|
|
247
|
+
};
|
|
248
|
+
// First pass: expand class names recursively
|
|
249
|
+
for (const name of flatNames){
|
|
250
|
+
resolve(name);
|
|
264
251
|
}
|
|
265
|
-
// Second pass: convert to grouped syntax rule strings
|
|
266
|
-
this.components.forEach((componentClasses, componentName)=>{
|
|
267
|
-
const syntaxRulesByStateToken = {};
|
|
268
|
-
for (const syntax of componentClasses){
|
|
269
|
-
const parsed = this.create(syntax);
|
|
270
|
-
if (parsed?.text) {
|
|
271
|
-
const group = syntaxRulesByStateToken[parsed.stateToken] ||= [];
|
|
272
|
-
group.push(parsed);
|
|
273
|
-
}
|
|
274
|
-
}
|
|
275
|
-
const result = Object.entries(syntaxRulesByStateToken).map(([stateToken, syntaxRules])=>{
|
|
276
|
-
if (syntaxRules.length === 1) return syntaxRules[0].name;
|
|
277
|
-
const namesWithoutToken = syntaxRules.map((s)=>s.name.slice(0, s.name.length - s.stateToken.length));
|
|
278
|
-
return `{${namesWithoutToken.join(';')}}${stateToken}`;
|
|
279
|
-
});
|
|
280
|
-
this.components.set(componentName, result);
|
|
281
|
-
});
|
|
282
252
|
}
|
|
283
253
|
resolveSelectors() {
|
|
284
254
|
const { selectors } = this.config;
|
|
@@ -416,46 +386,47 @@ class MasterCSS {
|
|
|
416
386
|
value: variableDefinition * -1
|
|
417
387
|
});
|
|
418
388
|
} else if (typeof variableDefinition === 'string') {
|
|
419
|
-
const aliasResult = /^\$\((.*?)\)(?: ?\/ ?(.+?))?$/.exec(variableDefinition);
|
|
389
|
+
const aliasResult = /^\$\((.*?)\)(?: ?\/ ?(.+?))?$|^\$([a-zA-Z0-9-]+)(?: ?\/ ?(.+?))?$/.exec(variableDefinition);
|
|
420
390
|
const flatName = name.join('-');
|
|
421
391
|
if (aliasResult) {
|
|
392
|
+
const alias = aliasResult[1] ?? aliasResult[3];
|
|
393
|
+
const modeSuffix = aliasResult[2] ?? aliasResult[4];
|
|
422
394
|
let aliasVariableModeResolver = aliasVariableModeResolvers.get(flatName);
|
|
423
395
|
if (!aliasVariableModeResolver) {
|
|
424
396
|
aliasVariableModeResolvers.set(flatName, aliasVariableModeResolver = {});
|
|
425
397
|
}
|
|
426
398
|
aliasVariableModeResolver[mode] = ()=>{
|
|
427
399
|
delete aliasVariableModeResolver[mode];
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
}
|
|
400
|
+
if (!alias) return;
|
|
401
|
+
const [baseAlias, aliasMode] = alias.split('@');
|
|
402
|
+
const eachAliasModeVariableResolver = aliasVariableModeResolvers.get(baseAlias);
|
|
403
|
+
if (eachAliasModeVariableResolver) {
|
|
404
|
+
for (const mode of Object.keys(eachAliasModeVariableResolver)){
|
|
405
|
+
eachAliasModeVariableResolver[mode]?.();
|
|
435
406
|
}
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
}
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
}
|
|
457
|
-
|
|
458
|
-
|
|
407
|
+
}
|
|
408
|
+
const aliasVariable = this.variables.get(baseAlias);
|
|
409
|
+
if (aliasVariable) {
|
|
410
|
+
if (aliasMode === undefined && aliasVariable.modes) {
|
|
411
|
+
addVariable(name, {
|
|
412
|
+
type: aliasVariable.type,
|
|
413
|
+
value: aliasVariable.value,
|
|
414
|
+
space: aliasVariable.space
|
|
415
|
+
}, '', modeSuffix);
|
|
416
|
+
for(const mode in aliasVariable.modes){
|
|
417
|
+
addVariable(name, aliasVariable.modes[mode], mode, modeSuffix);
|
|
418
|
+
}
|
|
419
|
+
} else {
|
|
420
|
+
const variable = aliasMode !== undefined ? aliasVariable.modes?.[aliasMode] : aliasVariable;
|
|
421
|
+
if (variable) {
|
|
422
|
+
const newVariable = {
|
|
423
|
+
type: variable.type,
|
|
424
|
+
value: variable.value,
|
|
425
|
+
...variable.type === 'color' ? {
|
|
426
|
+
space: variable.space
|
|
427
|
+
} : {}
|
|
428
|
+
};
|
|
429
|
+
addVariable(name, newVariable, undefined, modeSuffix);
|
|
459
430
|
}
|
|
460
431
|
}
|
|
461
432
|
}
|
|
@@ -554,22 +525,24 @@ class MasterCSS {
|
|
|
554
525
|
* @returns SyntaxRule[]
|
|
555
526
|
*/ generate(className, mode) {
|
|
556
527
|
let syntaxRules = [];
|
|
557
|
-
const
|
|
558
|
-
if (
|
|
559
|
-
|
|
560
|
-
const syntaxRule = this.create(
|
|
528
|
+
const compClasses = this.components.get(className);
|
|
529
|
+
if (compClasses) {
|
|
530
|
+
compClasses.forEach((cls)=>{
|
|
531
|
+
const syntaxRule = this.create(cls, className, mode);
|
|
561
532
|
if (syntaxRule && syntaxRule.valid) {
|
|
562
533
|
syntaxRules.push(syntaxRule);
|
|
534
|
+
} else {
|
|
535
|
+
console.error(`Invalid class "${cls}" found in ${className} component.`);
|
|
563
536
|
}
|
|
564
537
|
});
|
|
565
538
|
} else {
|
|
566
539
|
const atIndex = className.indexOf('@');
|
|
567
540
|
if (atIndex !== -1) {
|
|
568
541
|
const name = className.slice(0, atIndex);
|
|
569
|
-
const
|
|
570
|
-
if (
|
|
542
|
+
const compClasses = this.components.get(name);
|
|
543
|
+
if (compClasses) {
|
|
571
544
|
const atToken = className.slice(atIndex);
|
|
572
|
-
|
|
545
|
+
compClasses.forEach((eachSyntax)=>{
|
|
573
546
|
const syntaxRule = this.create(eachSyntax + atToken, className, mode);
|
|
574
547
|
if (syntaxRule && syntaxRule.valid) {
|
|
575
548
|
syntaxRules.push(syntaxRule);
|
package/dist/core.mjs
CHANGED
|
@@ -222,61 +222,31 @@ class MasterCSS {
|
|
|
222
222
|
resolveComponents() {
|
|
223
223
|
const { components } = this.config;
|
|
224
224
|
const flatComps = components ? flattenObject(components) : {};
|
|
225
|
-
const
|
|
226
|
-
const
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
225
|
+
const flatNames = Object.keys(flatComps);
|
|
226
|
+
const resolve = (name, currentClasses = [])=>{
|
|
227
|
+
const compClasses = this.components.get(name);
|
|
228
|
+
if (compClasses) {
|
|
229
|
+
currentClasses.push(...compClasses);
|
|
230
|
+
return;
|
|
231
|
+
}
|
|
232
232
|
const className = flatComps[name];
|
|
233
|
-
if (!className)
|
|
234
|
-
const
|
|
235
|
-
const
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
seen.add(cls);
|
|
239
|
-
currentClass.push(cls);
|
|
240
|
-
}
|
|
241
|
-
};
|
|
242
|
-
for (const eachClassName of classNames){
|
|
243
|
-
if (nameSet.has(eachClassName)) {
|
|
244
|
-
addClass(eachClassName);
|
|
245
|
-
// Lazy expand dependencies if not processed
|
|
246
|
-
if (!this.components.has(eachClassName)) {
|
|
247
|
-
const componentClass = flatComps[eachClassName];
|
|
248
|
-
if (componentClass) {
|
|
249
|
-
this.components.set(eachClassName, []) // placeholder to prevent infinite loop
|
|
250
|
-
;
|
|
251
|
-
// Recursively resolve
|
|
252
|
-
const depClassNames = componentClass.replace(/(?:\n\s*)+/g, ' ').trim().split(' ');
|
|
253
|
-
depClassNames.forEach(addClass);
|
|
254
|
-
}
|
|
255
|
-
}
|
|
256
|
-
const componentClasses = this.components.get(eachClassName);
|
|
257
|
-
componentClasses?.forEach(addClass);
|
|
233
|
+
if (!className) return;
|
|
234
|
+
const classes = className.replace(/(?:\n\s*)+/g, ' ').trim().split(' ');
|
|
235
|
+
for (const cls of classes){
|
|
236
|
+
if (flatNames.includes(cls)) {
|
|
237
|
+
resolve(cls, currentClasses);
|
|
258
238
|
} else {
|
|
259
|
-
|
|
239
|
+
currentClasses.push(cls);
|
|
260
240
|
}
|
|
261
241
|
}
|
|
242
|
+
this.components.set(name, [
|
|
243
|
+
...currentClasses
|
|
244
|
+
]);
|
|
245
|
+
};
|
|
246
|
+
// First pass: expand class names recursively
|
|
247
|
+
for (const name of flatNames){
|
|
248
|
+
resolve(name);
|
|
262
249
|
}
|
|
263
|
-
// Second pass: convert to grouped syntax rule strings
|
|
264
|
-
this.components.forEach((componentClasses, componentName)=>{
|
|
265
|
-
const syntaxRulesByStateToken = {};
|
|
266
|
-
for (const syntax of componentClasses){
|
|
267
|
-
const parsed = this.create(syntax);
|
|
268
|
-
if (parsed?.text) {
|
|
269
|
-
const group = syntaxRulesByStateToken[parsed.stateToken] ||= [];
|
|
270
|
-
group.push(parsed);
|
|
271
|
-
}
|
|
272
|
-
}
|
|
273
|
-
const result = Object.entries(syntaxRulesByStateToken).map(([stateToken, syntaxRules])=>{
|
|
274
|
-
if (syntaxRules.length === 1) return syntaxRules[0].name;
|
|
275
|
-
const namesWithoutToken = syntaxRules.map((s)=>s.name.slice(0, s.name.length - s.stateToken.length));
|
|
276
|
-
return `{${namesWithoutToken.join(';')}}${stateToken}`;
|
|
277
|
-
});
|
|
278
|
-
this.components.set(componentName, result);
|
|
279
|
-
});
|
|
280
250
|
}
|
|
281
251
|
resolveSelectors() {
|
|
282
252
|
const { selectors } = this.config;
|
|
@@ -414,46 +384,47 @@ class MasterCSS {
|
|
|
414
384
|
value: variableDefinition * -1
|
|
415
385
|
});
|
|
416
386
|
} else if (typeof variableDefinition === 'string') {
|
|
417
|
-
const aliasResult = /^\$\((.*?)\)(?: ?\/ ?(.+?))?$/.exec(variableDefinition);
|
|
387
|
+
const aliasResult = /^\$\((.*?)\)(?: ?\/ ?(.+?))?$|^\$([a-zA-Z0-9-]+)(?: ?\/ ?(.+?))?$/.exec(variableDefinition);
|
|
418
388
|
const flatName = name.join('-');
|
|
419
389
|
if (aliasResult) {
|
|
390
|
+
const alias = aliasResult[1] ?? aliasResult[3];
|
|
391
|
+
const modeSuffix = aliasResult[2] ?? aliasResult[4];
|
|
420
392
|
let aliasVariableModeResolver = aliasVariableModeResolvers.get(flatName);
|
|
421
393
|
if (!aliasVariableModeResolver) {
|
|
422
394
|
aliasVariableModeResolvers.set(flatName, aliasVariableModeResolver = {});
|
|
423
395
|
}
|
|
424
396
|
aliasVariableModeResolver[mode] = ()=>{
|
|
425
397
|
delete aliasVariableModeResolver[mode];
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
}
|
|
398
|
+
if (!alias) return;
|
|
399
|
+
const [baseAlias, aliasMode] = alias.split('@');
|
|
400
|
+
const eachAliasModeVariableResolver = aliasVariableModeResolvers.get(baseAlias);
|
|
401
|
+
if (eachAliasModeVariableResolver) {
|
|
402
|
+
for (const mode of Object.keys(eachAliasModeVariableResolver)){
|
|
403
|
+
eachAliasModeVariableResolver[mode]?.();
|
|
433
404
|
}
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
}
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
}
|
|
455
|
-
|
|
456
|
-
|
|
405
|
+
}
|
|
406
|
+
const aliasVariable = this.variables.get(baseAlias);
|
|
407
|
+
if (aliasVariable) {
|
|
408
|
+
if (aliasMode === undefined && aliasVariable.modes) {
|
|
409
|
+
addVariable(name, {
|
|
410
|
+
type: aliasVariable.type,
|
|
411
|
+
value: aliasVariable.value,
|
|
412
|
+
space: aliasVariable.space
|
|
413
|
+
}, '', modeSuffix);
|
|
414
|
+
for(const mode in aliasVariable.modes){
|
|
415
|
+
addVariable(name, aliasVariable.modes[mode], mode, modeSuffix);
|
|
416
|
+
}
|
|
417
|
+
} else {
|
|
418
|
+
const variable = aliasMode !== undefined ? aliasVariable.modes?.[aliasMode] : aliasVariable;
|
|
419
|
+
if (variable) {
|
|
420
|
+
const newVariable = {
|
|
421
|
+
type: variable.type,
|
|
422
|
+
value: variable.value,
|
|
423
|
+
...variable.type === 'color' ? {
|
|
424
|
+
space: variable.space
|
|
425
|
+
} : {}
|
|
426
|
+
};
|
|
427
|
+
addVariable(name, newVariable, undefined, modeSuffix);
|
|
457
428
|
}
|
|
458
429
|
}
|
|
459
430
|
}
|
|
@@ -552,22 +523,24 @@ class MasterCSS {
|
|
|
552
523
|
* @returns SyntaxRule[]
|
|
553
524
|
*/ generate(className, mode) {
|
|
554
525
|
let syntaxRules = [];
|
|
555
|
-
const
|
|
556
|
-
if (
|
|
557
|
-
|
|
558
|
-
const syntaxRule = this.create(
|
|
526
|
+
const compClasses = this.components.get(className);
|
|
527
|
+
if (compClasses) {
|
|
528
|
+
compClasses.forEach((cls)=>{
|
|
529
|
+
const syntaxRule = this.create(cls, className, mode);
|
|
559
530
|
if (syntaxRule && syntaxRule.valid) {
|
|
560
531
|
syntaxRules.push(syntaxRule);
|
|
532
|
+
} else {
|
|
533
|
+
console.error(`Invalid class "${cls}" found in ${className} component.`);
|
|
561
534
|
}
|
|
562
535
|
});
|
|
563
536
|
} else {
|
|
564
537
|
const atIndex = className.indexOf('@');
|
|
565
538
|
if (atIndex !== -1) {
|
|
566
539
|
const name = className.slice(0, atIndex);
|
|
567
|
-
const
|
|
568
|
-
if (
|
|
540
|
+
const compClasses = this.components.get(name);
|
|
541
|
+
if (compClasses) {
|
|
569
542
|
const atToken = className.slice(atIndex);
|
|
570
|
-
|
|
543
|
+
compClasses.forEach((eachSyntax)=>{
|
|
571
544
|
const syntaxRule = this.create(eachSyntax + atToken, className, mode);
|
|
572
545
|
if (syntaxRule && syntaxRule.valid) {
|
|
573
546
|
syntaxRules.push(syntaxRule);
|
package/dist/syntax-rule.cjs
CHANGED
|
@@ -158,10 +158,15 @@ class SyntaxRule {
|
|
|
158
158
|
}
|
|
159
159
|
}
|
|
160
160
|
};
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
161
|
+
if (/^\$[a-zA-Z0-9-]+(?:\/[^\/]+)?$/.test(currentValue)) {
|
|
162
|
+
const [raw, alpha] = currentValue.slice(1).split('/');
|
|
163
|
+
handleVariable(raw, alpha);
|
|
164
|
+
} else {
|
|
165
|
+
handleVariable(currentValue);
|
|
166
|
+
if (!handled) {
|
|
167
|
+
const [colorName, alpha] = currentValue.split('/');
|
|
168
|
+
handleVariable(colorName, alpha);
|
|
169
|
+
}
|
|
165
170
|
}
|
|
166
171
|
}
|
|
167
172
|
if (!handled) {
|
package/dist/syntax-rule.mjs
CHANGED
|
@@ -156,10 +156,15 @@ class SyntaxRule {
|
|
|
156
156
|
}
|
|
157
157
|
}
|
|
158
158
|
};
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
159
|
+
if (/^\$[a-zA-Z0-9-]+(?:\/[^\/]+)?$/.test(currentValue)) {
|
|
160
|
+
const [raw, alpha] = currentValue.slice(1).split('/');
|
|
161
|
+
handleVariable(raw, alpha);
|
|
162
|
+
} else {
|
|
163
|
+
handleVariable(currentValue);
|
|
164
|
+
if (!handled) {
|
|
165
|
+
const [colorName, alpha] = currentValue.split('/');
|
|
166
|
+
handleVariable(colorName, alpha);
|
|
167
|
+
}
|
|
163
168
|
}
|
|
164
169
|
}
|
|
165
170
|
if (!handled) {
|
|
@@ -4,7 +4,7 @@ var common = require('../common.cjs');
|
|
|
4
4
|
var core = require('../core.cjs');
|
|
5
5
|
var parsePair = require('./parse-pair.cjs');
|
|
6
6
|
|
|
7
|
-
const SELECTOR_REGEX = new RegExp(`(?:[a-zA-Z0-9-]+)|([${common.SELECTOR_COMBINATORS.join('')}
|
|
7
|
+
const SELECTOR_REGEX = new RegExp(`(?:[a-zA-Z0-9-]+)|([${common.SELECTOR_COMBINATORS.join('')}#.:,*])|(a-zA-Z0-9-)`, 'g');
|
|
8
8
|
function parseSelector(token, css = new core(), isRaw = true) {
|
|
9
9
|
const resolve = (eachToken)=>{
|
|
10
10
|
const nodes = [];
|
|
@@ -13,7 +13,7 @@ function parseSelector(token, css = new core(), isRaw = true) {
|
|
|
13
13
|
for (const match of eachToken.matchAll(SELECTOR_REGEX)){
|
|
14
14
|
const raw = match[0];
|
|
15
15
|
tokenIndex += raw.length;
|
|
16
|
-
if (raw === ':' || raw === '.') {
|
|
16
|
+
if (raw === ':' || raw === '.' || raw === '#') {
|
|
17
17
|
currentPrefix += raw;
|
|
18
18
|
continue;
|
|
19
19
|
}
|
|
@@ -52,6 +52,8 @@ function parseSelector(token, css = new core(), isRaw = true) {
|
|
|
52
52
|
type = 'pseudo-element';
|
|
53
53
|
} else if (currentPrefix === '.') {
|
|
54
54
|
type = 'class';
|
|
55
|
+
} else if (currentPrefix === '#') {
|
|
56
|
+
type = 'id';
|
|
55
57
|
}
|
|
56
58
|
nodes.push({
|
|
57
59
|
value,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import MasterCSS from '../core';
|
|
2
2
|
export declare type SelectorLiteralNode = {
|
|
3
|
-
type?: 'attribute' | 'pseudo-class' | 'pseudo-element' | 'class' | 'universal';
|
|
3
|
+
type?: 'attribute' | 'pseudo-class' | 'pseudo-element' | 'class' | 'universal' | 'id';
|
|
4
4
|
raw?: string;
|
|
5
5
|
value?: string;
|
|
6
6
|
children?: SelectorNode[];
|
|
@@ -2,7 +2,7 @@ import { SELECTOR_COMBINATORS } from '../common.mjs';
|
|
|
2
2
|
import MasterCSS from '../core.mjs';
|
|
3
3
|
import parsePair from './parse-pair.mjs';
|
|
4
4
|
|
|
5
|
-
const SELECTOR_REGEX = new RegExp(`(?:[a-zA-Z0-9-]+)|([${SELECTOR_COMBINATORS.join('')}
|
|
5
|
+
const SELECTOR_REGEX = new RegExp(`(?:[a-zA-Z0-9-]+)|([${SELECTOR_COMBINATORS.join('')}#.:,*])|(a-zA-Z0-9-)`, 'g');
|
|
6
6
|
function parseSelector(token, css = new MasterCSS(), isRaw = true) {
|
|
7
7
|
const resolve = (eachToken)=>{
|
|
8
8
|
const nodes = [];
|
|
@@ -11,7 +11,7 @@ function parseSelector(token, css = new MasterCSS(), isRaw = true) {
|
|
|
11
11
|
for (const match of eachToken.matchAll(SELECTOR_REGEX)){
|
|
12
12
|
const raw = match[0];
|
|
13
13
|
tokenIndex += raw.length;
|
|
14
|
-
if (raw === ':' || raw === '.') {
|
|
14
|
+
if (raw === ':' || raw === '.' || raw === '#') {
|
|
15
15
|
currentPrefix += raw;
|
|
16
16
|
continue;
|
|
17
17
|
}
|
|
@@ -50,6 +50,8 @@ function parseSelector(token, css = new MasterCSS(), isRaw = true) {
|
|
|
50
50
|
type = 'pseudo-element';
|
|
51
51
|
} else if (currentPrefix === '.') {
|
|
52
52
|
type = 'class';
|
|
53
|
+
} else if (currentPrefix === '#') {
|
|
54
|
+
type = 'id';
|
|
53
55
|
}
|
|
54
56
|
nodes.push({
|
|
55
57
|
value,
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@master/css","type":"module","scripts":{"build":"techor build \"src/**/*.ts\"","dev":"pnpm build --watch","test":"vitest","type-check":"tsc --noEmit","lint":"eslint"},"license":"MIT","description":"The CSS language and framework for rapidly building modern and high-performance websites","author":"Aoyue Design LLC.","funding":"https://rc.css.master.co/sponsor","homepage":"https://css.master.co","bugs":{"url":"https://github.com/master-co/css/issues"},"repository":{"type":"git","url":"https://github.com/master-co/css.git","directory":"packages/core"},"keywords":["style","styles","html","variants","virtual","virtual-css","utility","css","ui","lightweight","class","webpack","plugin","integration","vite","parcel","build-tools","mastercss"],"sideEffects":false,"main":"./dist/index.cjs","jsnext:main":"./dist/index.mjs","esnext":"./dist/index.mjs","module":"./dist/index.mjs","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","require":"./dist/index.cjs","import":"./dist/index.mjs"}},"bin":"./dist/bin/index.mjs","files":["dist"],"publishConfig":{"access":"public","provenance":true},"dependencies":{"@master/colors":"^2.1.1","@master/normal.css":"^3.2.0","@techor/extend":"^3.2.0","csstype":"^3.1.3"},"devDependencies":{"shared":"^2.0.0-rc.
|
|
1
|
+
{"name":"@master/css","type":"module","scripts":{"build":"techor build \"src/**/*.ts\"","dev":"pnpm build --watch","test":"vitest","type-check":"tsc --noEmit","lint":"eslint"},"license":"MIT","description":"The CSS language and framework for rapidly building modern and high-performance websites","author":"Aoyue Design LLC.","funding":"https://rc.css.master.co/sponsor","homepage":"https://css.master.co","bugs":{"url":"https://github.com/master-co/css/issues"},"repository":{"type":"git","url":"https://github.com/master-co/css.git","directory":"packages/core"},"keywords":["style","styles","html","variants","virtual","virtual-css","utility","css","ui","lightweight","class","webpack","plugin","integration","vite","parcel","build-tools","mastercss"],"sideEffects":false,"main":"./dist/index.cjs","jsnext:main":"./dist/index.mjs","esnext":"./dist/index.mjs","module":"./dist/index.mjs","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","require":"./dist/index.cjs","import":"./dist/index.mjs"}},"bin":"./dist/bin/index.mjs","files":["dist"],"publishConfig":{"access":"public","provenance":true},"dependencies":{"@master/colors":"^2.1.1","@master/normal.css":"^3.2.0","@techor/extend":"^3.2.0","csstype":"^3.1.3"},"devDependencies":{"shared":"^2.0.0-rc.68"},"version":"2.0.0-rc.68"}
|
package/dist/config/styles.cjs
DELETED
package/dist/config/styles.d.ts
DELETED
package/dist/config/styles.mjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
|