-
Notifications
You must be signed in to change notification settings - Fork 4.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add support for colored box shadows (#5979)
* WIP * add box shadow parser * use box shadow parser * Update default shadows, add boxShadowColor key, add shadow datatype * Update tests * add `valid` flag to `boxShadow` parser Co-authored-by: Robin Malfait <[email protected]>
- Loading branch information
1 parent
c25fbc7
commit d1f066d
Showing
17 changed files
with
426 additions
and
136 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,71 @@ | ||
let KEYWORDS = new Set(['inset', 'inherit', 'initial', 'revert', 'unset']) | ||
let COMMA = /\,(?![^(]*\))/g // Comma separator that is not located between brackets. E.g.: `cubiz-bezier(a, b, c)` these don't count. | ||
let SPACE = /\ +(?![^(]*\))/g // Similar to the one above, but with spaces instead. | ||
let LENGTH = /^-?(\d+)(.*?)$/g | ||
|
||
export function parseBoxShadowValue(input) { | ||
let shadows = input.split(COMMA) | ||
return shadows.map((shadow) => { | ||
let value = shadow.trim() | ||
let result = { raw: value } | ||
let parts = value.split(SPACE) | ||
let seen = new Set() | ||
|
||
for (let part of parts) { | ||
// Reset index, since the regex is stateful. | ||
LENGTH.lastIndex = 0 | ||
|
||
// Keyword | ||
if (!seen.has('KEYWORD') && KEYWORDS.has(part)) { | ||
result.keyword = part | ||
seen.add('KEYWORD') | ||
} | ||
|
||
// Length value | ||
else if (LENGTH.test(part)) { | ||
if (!seen.has('X')) { | ||
result.x = part | ||
seen.add('X') | ||
} else if (!seen.has('Y')) { | ||
result.y = part | ||
seen.add('Y') | ||
} else if (!seen.has('BLUR')) { | ||
result.blur = part | ||
seen.add('BLUR') | ||
} else if (!seen.has('SPREAD')) { | ||
result.spread = part | ||
seen.add('SPREAD') | ||
} | ||
} | ||
|
||
// Color or unknown | ||
else { | ||
if (!result.color) { | ||
result.color = part | ||
} else { | ||
if (!result.unknown) result.unknown = [] | ||
result.unknown.push(part) | ||
} | ||
} | ||
} | ||
|
||
// Check if valid | ||
result.valid = result.x !== undefined && result.y !== undefined | ||
|
||
return result | ||
}) | ||
} | ||
|
||
export function formatBoxShadowValue(shadows) { | ||
return shadows | ||
.map((shadow) => { | ||
if (!shadow.valid) { | ||
return shadow.raw | ||
} | ||
|
||
return [shadow.keyword, shadow.x, shadow.y, shadow.blur, shadow.spread, shadow.color] | ||
.filter(Boolean) | ||
.join(' ') | ||
}) | ||
.join(', ') | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.