This commit is contained in:
alexander.akait 2023-05-04 19:18:13 +03:00
parent 4e8f8144fd
commit 65bf52de87
5 changed files with 61 additions and 31 deletions

View File

@ -187,8 +187,6 @@ class CssParser extends Parser {
let modeData = undefined; let modeData = undefined;
/** @type {[number, number] | undefined} */ /** @type {[number, number] | undefined} */
let lastIdentifier = undefined; let lastIdentifier = undefined;
/** @type {boolean} */
let awaitRightParenthesis = false;
/** @type [string, number, number][] */ /** @type [string, number, number][] */
let balanced = []; let balanced = [];
const modeStack = []; const modeStack = [];
@ -779,15 +777,15 @@ class CssParser extends Parser {
switch (mode) { switch (mode) {
case CSS_MODE_TOP_LEVEL: { case CSS_MODE_TOP_LEVEL: {
if (awaitRightParenthesis) { if (modeStack.length > 0) {
awaitRightParenthesis = false;
}
const newModeData = modeStack.pop(); const newModeData = modeStack.pop();
if (newModeData !== false) { if (newModeData !== false) {
modeData = newModeData; modeData = newModeData;
const dep = new ConstDependency("", [start, end]); const dep = new ConstDependency("", [start, end]);
module.addPresentationalDependency(dep); module.addPresentationalDependency(dep);
} }
}
break; break;
} }
case CSS_MODE_AT_IMPORT_EXPECT_URL: { case CSS_MODE_AT_IMPORT_EXPECT_URL: {
@ -816,6 +814,7 @@ class CssParser extends Parser {
switch (mode) { switch (mode) {
case CSS_MODE_TOP_LEVEL: { case CSS_MODE_TOP_LEVEL: {
const name = input.slice(start, end).toLowerCase(); const name = input.slice(start, end).toLowerCase();
if (name === ":global") { if (name === ":global") {
modeData = "global"; modeData = "global";
const dep = new ConstDependency("", [start, end]); const dep = new ConstDependency("", [start, end]);
@ -841,36 +840,34 @@ class CssParser extends Parser {
balanced.push([name, start, end]); balanced.push([name, start, end]);
if (this.allowModeSwitch) {
switch (mode) { switch (mode) {
case CSS_MODE_TOP_LEVEL: { case CSS_MODE_TOP_LEVEL: {
name = name.toLowerCase(); name = name.toLowerCase();
if (this.allowModeSwitch && name === ":global") { if (name === ":global") {
modeStack.push(modeData); modeStack.push(modeData);
modeData = "global"; modeData = "global";
const dep = new ConstDependency("", [start, end]); const dep = new ConstDependency("", [start, end]);
module.addPresentationalDependency(dep); module.addPresentationalDependency(dep);
} else if (this.allowModeSwitch && name === ":local") { } else if (name === ":local") {
modeStack.push(modeData); modeStack.push(modeData);
modeData = "local"; modeData = "local";
const dep = new ConstDependency("", [start, end]); const dep = new ConstDependency("", [start, end]);
module.addPresentationalDependency(dep); module.addPresentationalDependency(dep);
} else {
awaitRightParenthesis = true;
modeStack.push(false);
} }
break; break;
} }
} }
}
return end; return end;
}, },
comma: (input, start, end) => { comma: (input, start, end) => {
switch (mode) { switch (mode) {
case CSS_MODE_TOP_LEVEL: case CSS_MODE_TOP_LEVEL:
if (!awaitRightParenthesis) { // Reset stack for `:global .class :local .class-other` selector after `,`
modeData = undefined; modeData = undefined;
modeStack.length = 0; modeStack.length = 0;
}
break; break;
case CSS_MODE_IN_LOCAL_RULE: case CSS_MODE_IN_LOCAL_RULE:
processDeclarationValueDone(input, start); processDeclarationValueDone(input, start);

View File

@ -83,6 +83,12 @@ it("should allow to create css modules", done => {
paddingSm: prod paddingSm: prod
? "my-app-491-zE" ? "my-app-491-zE"
: "./style.module.css-padding-sm", : "./style.module.css-padding-sm",
classLocalScope: prod
? "my-app-491-gz"
: "./style.module.css-class-local-scope",
inLocalGlobalScope: prod
? "my-app-491-Zv"
: "./style.module.css-in-local-global-scope",
}); });
} catch (e) { } catch (e) {
return done(e); return done(e);

View File

@ -98,6 +98,12 @@ it("should allow to create css modules", done => {
paddingSm: prod paddingSm: prod
? "my-app-491-zE" ? "my-app-491-zE"
: "./style.module.css-padding-sm", : "./style.module.css-padding-sm",
classLocalScope: prod
? "my-app-491-gz"
: "./style.module.css-class-local-scope",
inLocalGlobalScope: prod
? "my-app-491-Zv"
: "./style.module.css-in-local-global-scope",
}); });
} catch (e) { } catch (e) {
return done(e); return done(e);

View File

@ -71,6 +71,15 @@
background-color: aquamarine; background-color: aquamarine;
} }
.local9 :matches(div.parent1.child1.vertical-tiny,
div.parent1.child1.vertical-small,
div.otherDiv.horizontal-tiny,
div.otherDiv.horizontal-small div.description) {
max-height: 0;
margin: 0;
overflow: hidden;
}
:global(:global(:local(.nested1)).nested2).nested3 { :global(:global(:local(.nested1)).nested2).nested3 {
color: pink; color: pink;
} }
@ -397,6 +406,16 @@
@unknown .class { @unknown .class {
color: red; color: red;
.class {
color: red;
}
}
:global .class :local .in-local-global-scope,
:global .class :local .in-local-global-scope,
:local .class-local-scope :global .in-local-global-scope {
color: red;
} }
:scope { :scope {

View File

@ -37,4 +37,6 @@ export default {
myColor: style['my-color'], myColor: style['my-color'],
paddingSm: style['padding-sm'], paddingSm: style['padding-sm'],
paddingLg: style['padding-lg'], paddingLg: style['padding-lg'],
inLocalGlobalScope: style['in-local-global-scope'],
classLocalScope: style['class-local-scope'],
}; };