-
-
Notifications
You must be signed in to change notification settings - Fork 41
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix(CSS): override
doesn't work
#304
Fix(CSS): override
doesn't work
#304
Conversation
@lesha1201 is attempting to deploy a commit to the Aoyue Team on Vercel. A member of the Team first needs to authorize it. |
packages/css/src/core.ts
Outdated
eachRuleOptions.layer === Layer.NativeShorthand || | ||
eachRuleOptions.layer === CoreLayer.Native || | ||
eachRuleOptions.layer === CoreLayer.NativeShorthand | ||
) { | ||
eachRuleOptions.resolvedPropName = id | ||
.replace(/(?!^)[A-Z]/g, (m) => '-' + m) | ||
.toLowerCase() | ||
} | ||
} | ||
// 2. custom `config.variables` | ||
addResolvedVariables(id) | ||
|
||
if (match) { | ||
if (Array.isArray(match)) { | ||
const [key, values = []] = match | ||
const valueMatches = [] | ||
if (values.length) { | ||
valueMatches.push(`(?:${values.join('|')})(?![a-zA-Z0-9-])`) | ||
} | ||
if (Object.keys(eachRuleOptions.resolvedVariables).length) { | ||
valueMatches.push(`(?:${Object.keys(eachRuleOptions.resolvedVariables).join('|')})(?![a-zA-Z0-9-])`) | ||
eachRuleOptions.resolvedVariables = {} | ||
const addResolvedVariables = (prefix: string) => { | ||
Object.assign( | ||
eachRuleOptions.resolvedVariables, | ||
Object.keys(this.variables) | ||
.filter( | ||
(eachVariableName) => | ||
eachVariableName.startsWith(prefix + '-') || | ||
eachVariableName.startsWith('-' + prefix + '-'), | ||
) | ||
.reduce((newResolvedVariables, eachVariableName) => { | ||
newResolvedVariables[ | ||
eachVariableName.slice( | ||
prefix.length + (prefix.startsWith('-') ? 0 : 1), | ||
) | ||
] = { | ||
...this.variables[eachVariableName], | ||
name: eachVariableName, | ||
} | ||
return newResolvedVariables | ||
}, {}), | ||
) | ||
} | ||
// 1. custom `config.rules[id].variableGroups` | ||
if (eachRuleOptions.variableGroups) { | ||
for (const eachVariableGroup of eachRuleOptions.variableGroups) { | ||
addResolvedVariables(eachVariableGroup) | ||
} | ||
if (eachRuleOptions.colored) { | ||
valueMatches.push( | ||
'#', | ||
'(?:color|color-contrast|color-mix|hwb|lab|lch|oklab|oklch|rgb|rgba|hsl|hsla)\\(.*\\)', | ||
`(?:${colorNames.join('|')})(?![a-zA-Z0-9-])` | ||
} | ||
// 2. custom `config.variables` | ||
addResolvedVariables(id) | ||
|
||
if (match) { | ||
if (Array.isArray(match)) { | ||
const [key, values = []] = match | ||
const valueMatches = [] | ||
if (values.length) { | ||
valueMatches.push(`(?:${values.join('|')})(?![a-zA-Z0-9-])`) | ||
} | ||
if (Object.keys(eachRuleOptions.resolvedVariables).length) { | ||
valueMatches.push( | ||
`(?:${Object.keys(eachRuleOptions.resolvedVariables).join( | ||
'|', | ||
)})(?![a-zA-Z0-9-])`, | ||
) | ||
} | ||
if (eachRuleOptions.colored) { | ||
valueMatches.push( | ||
'#', | ||
'(?:color|color-contrast|color-mix|hwb|lab|lch|oklab|oklch|rgb|rgba|hsl|hsla)\\(.*\\)', | ||
`(?:${colorNames.join('|')})(?![a-zA-Z0-9-])`, | ||
) | ||
} | ||
if (eachRuleOptions.numeric) { | ||
valueMatches.push('[\\d\\.]', '(?:max|min|calc|clamp)\\(.*\\)') | ||
} | ||
eachRuleOptions.resolvedMatch = new RegExp( | ||
`^${key}:(?:${valueMatches.join('|')})[^|]*?(?:@|$)`, | ||
) | ||
} else { | ||
eachRuleOptions.resolvedMatch = match as RegExp | ||
} | ||
if (eachRuleOptions.numeric) { | ||
valueMatches.push('[\\d\\.]', '(?:max|min|calc|clamp)\\(.*\\)') | ||
} | ||
eachRuleOptions.resolvedMatch = new RegExp(`^${key}:(?:${valueMatches.join('|')})[^|]*?(?:@|$)`) | ||
} else { | ||
eachRuleOptions.resolvedMatch = match as RegExp | ||
} | ||
} | ||
}) | ||
}, | ||
) | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Here, I just added if
statement and indented the code. I'm not sure how it actually should look like, I just did the same way as the code above.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Not sure if it's the right place for the tests.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Correct!
@1aron How do you format the code? What do you think about adding Prettier? |
We now use https://editorconfig.org. The reasons for not using Prettier: https://antfu.me/posts/why-not-prettier |
@1aron Formatted the code. |
@lesha1201 Released. Great job 👍🏻 |
Noticed in the code that config doesn't work with
override: true
because it passesundefined
instead ofcustomConfig
. This PR makes it possible to useoverride: true
.