-
Notifications
You must be signed in to change notification settings - Fork 34
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: handle uppercase units and functions #71
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,27 +1,27 @@ | ||
import convertUnits from 'css-unit-converter'; | ||
function convertNodes(left, right, precision) { | ||
switch (left.type) { | ||
case 'LengthValue': | ||
case 'AngleValue': | ||
case 'TimeValue': | ||
case 'FrequencyValue': | ||
case 'ResolutionValue': | ||
return convertAbsoluteLength(left, right, precision); | ||
default: | ||
return { left, right }; | ||
} | ||
} | ||
function convertAbsoluteLength(left, right, precision) { | ||
if (right.type === left.type) { | ||
right = { | ||
type: left.type, | ||
value: convertUnits(right.value, right.unit, left.unit, precision), | ||
unit: left.unit, | ||
}; | ||
} | ||
return { left, right }; | ||
} | ||
export default convertNodes; | ||
import convertUnits from 'css-unit-converter'; | ||
|
||
function convertNodes(left, right, precision) { | ||
switch (left.type) { | ||
case 'LengthValue': | ||
case 'AngleValue': | ||
case 'TimeValue': | ||
case 'FrequencyValue': | ||
case 'ResolutionValue': | ||
return convertAbsoluteLength(left, right, precision); | ||
default: | ||
return { left, right }; | ||
} | ||
} | ||
|
||
function convertAbsoluteLength(left, right, precision) { | ||
if (right.type === left.type) { | ||
right = { | ||
type: left.type, | ||
value: convertUnits(right.value, right.unit.toLowerCase(), left.unit.toLowerCase(), precision), | ||
unit: left.unit, | ||
}; | ||
} | ||
return { left, right }; | ||
} | ||
|
||
export default convertNodes; | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Already |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,102 +1,105 @@ | ||
/* description: Parses expressions. */ | ||
|
||
/* lexical grammar */ | ||
%lex | ||
%% | ||
\s+ /* skip whitespace */ | ||
|
||
(\-(webkit|moz)\-)?calc\b return 'CALC'; | ||
|
||
[a-z][a-z0-9-]*\s*\((?:(?:\"(?:\\.|[^\"\\])*\"|\'(?:\\.|[^\'\\])*\')|\([^)]*\)|[^\(\)]*)*\) return 'FUNCTION'; | ||
|
||
"*" return 'MUL'; | ||
"/" return 'DIV'; | ||
"+" return 'ADD'; | ||
"-" return 'SUB'; | ||
|
||
([0-9]+("."[0-9]+)?|"."[0-9]+)px\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)cm\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)mm\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)in\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)pt\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)pc\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)deg\b return 'ANGLE'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)grad\b return 'ANGLE'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)rad\b return 'ANGLE'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)turn\b return 'ANGLE'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)s\b return 'TIME'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)ms\b return 'TIME'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)Hz\b return 'FREQ'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)kHz\b return 'FREQ'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)dpi\b return 'RES'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)dpcm\b return 'RES'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)dppx\b return 'RES'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)em\b return 'EMS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)ex\b return 'EXS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)ch\b return 'CHS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)rem\b return 'REMS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)vw\b return 'VWS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)vh\b return 'VHS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)vmin\b return 'VMINS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)vmax\b return 'VMAXS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)\% return 'PERCENTAGE'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)\b return 'NUMBER'; | ||
|
||
"(" return 'LPAREN'; | ||
")" return 'RPAREN'; | ||
|
||
<<EOF>> return 'EOF'; | ||
|
||
/lex | ||
|
||
%left ADD SUB | ||
%left MUL DIV | ||
%left UPREC | ||
|
||
|
||
%start expression | ||
|
||
%% | ||
|
||
expression | ||
: math_expression EOF { return $1; } | ||
; | ||
|
||
math_expression | ||
: CALC LPAREN math_expression RPAREN { $$ = $3; } | ||
| math_expression ADD math_expression { $$ = { type: 'MathExpression', operator: $2, left: $1, right: $3 }; } | ||
| math_expression SUB math_expression { $$ = { type: 'MathExpression', operator: $2, left: $1, right: $3 }; } | ||
| math_expression MUL math_expression { $$ = { type: 'MathExpression', operator: $2, left: $1, right: $3 }; } | ||
| math_expression DIV math_expression { $$ = { type: 'MathExpression', operator: $2, left: $1, right: $3 }; } | ||
| LPAREN math_expression RPAREN { $$ = $2; } | ||
| function { $$ = $1; } | ||
| css_value { $$ = $1; } | ||
| value { $$ = $1; } | ||
; | ||
|
||
value | ||
: NUMBER { $$ = { type: 'Value', value: parseFloat($1) }; } | ||
| SUB NUMBER { $$ = { type: 'Value', value: parseFloat($2) * -1 }; } | ||
; | ||
|
||
function | ||
: FUNCTION { $$ = { type: 'Function', value: $1 }; } | ||
; | ||
|
||
css_value | ||
: LENGTH { $$ = { type: 'LengthValue', value: parseFloat($1), unit: /[a-z]+/.exec($1)[0] }; } | ||
| ANGLE { $$ = { type: 'AngleValue', value: parseFloat($1), unit: /[a-z]+/.exec($1)[0] }; } | ||
| TIME { $$ = { type: 'TimeValue', value: parseFloat($1), unit: /[a-z]+/.exec($1)[0] }; } | ||
| FREQ { $$ = { type: 'FrequencyValue', value: parseFloat($1), unit: /[a-z]+/.exec($1)[0] }; } | ||
| RES { $$ = { type: 'ResolutionValue', value: parseFloat($1), unit: /[a-z]+/.exec($1)[0] }; } | ||
| EMS { $$ = { type: 'EmValue', value: parseFloat($1), unit: 'em' }; } | ||
| EXS { $$ = { type: 'ExValue', value: parseFloat($1), unit: 'ex' }; } | ||
| CHS { $$ = { type: 'ChValue', value: parseFloat($1), unit: 'ch' }; } | ||
| REMS { $$ = { type: 'RemValue', value: parseFloat($1), unit: 'rem' }; } | ||
| VHS { $$ = { type: 'VhValue', value: parseFloat($1), unit: 'vh' }; } | ||
| VWS { $$ = { type: 'VwValue', value: parseFloat($1), unit: 'vw' }; } | ||
| VMINS { $$ = { type: 'VminValue', value: parseFloat($1), unit: 'vmin' }; } | ||
| VMAXS { $$ = { type: 'VmaxValue', value: parseFloat($1), unit: 'vmax' }; } | ||
| PERCENTAGE { $$ = { type: 'PercentageValue', value: parseFloat($1), unit: '%' }; } | ||
| SUB css_value { var prev = $2; prev.value *= -1; $$ = prev; } | ||
; | ||
/* description: Parses expressions. */ | ||
|
||
/* lexical grammar */ | ||
%lex | ||
|
||
%options case-insensitive | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Added this |
||
|
||
%% | ||
\s+ /* skip whitespace */ | ||
|
||
(\-(webkit|moz)\-)?calc\b return 'CALC'; | ||
|
||
[a-z][a-z0-9-]*\s*\((?:(?:\"(?:\\.|[^\"\\])*\"|\'(?:\\.|[^\'\\])*\')|\([^)]*\)|[^\(\)]*)*\) return 'FUNCTION'; | ||
|
||
"*" return 'MUL'; | ||
"/" return 'DIV'; | ||
"+" return 'ADD'; | ||
"-" return 'SUB'; | ||
|
||
([0-9]+("."[0-9]+)?|"."[0-9]+)px\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)cm\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)mm\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)in\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)pt\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)pc\b return 'LENGTH'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)deg\b return 'ANGLE'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)grad\b return 'ANGLE'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)rad\b return 'ANGLE'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)turn\b return 'ANGLE'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)s\b return 'TIME'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)ms\b return 'TIME'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)Hz\b return 'FREQ'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)kHz\b return 'FREQ'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)dpi\b return 'RES'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)dpcm\b return 'RES'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)dppx\b return 'RES'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)em\b return 'EMS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)ex\b return 'EXS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)ch\b return 'CHS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)rem\b return 'REMS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)vw\b return 'VWS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)vh\b return 'VHS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)vmin\b return 'VMINS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)vmax\b return 'VMAXS'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)\% return 'PERCENTAGE'; | ||
([0-9]+("."[0-9]+)?|"."[0-9]+)\b return 'NUMBER'; | ||
|
||
"(" return 'LPAREN'; | ||
")" return 'RPAREN'; | ||
|
||
<<EOF>> return 'EOF'; | ||
|
||
/lex | ||
|
||
%left ADD SUB | ||
%left MUL DIV | ||
%left UPREC | ||
|
||
|
||
%start expression | ||
|
||
%% | ||
|
||
expression | ||
: math_expression EOF { return $1; } | ||
; | ||
|
||
math_expression | ||
: CALC LPAREN math_expression RPAREN { $$ = $3; } | ||
| math_expression ADD math_expression { $$ = { type: 'MathExpression', operator: $2, left: $1, right: $3 }; } | ||
| math_expression SUB math_expression { $$ = { type: 'MathExpression', operator: $2, left: $1, right: $3 }; } | ||
| math_expression MUL math_expression { $$ = { type: 'MathExpression', operator: $2, left: $1, right: $3 }; } | ||
| math_expression DIV math_expression { $$ = { type: 'MathExpression', operator: $2, left: $1, right: $3 }; } | ||
| LPAREN math_expression RPAREN { $$ = $2; } | ||
| function { $$ = $1; } | ||
| css_value { $$ = $1; } | ||
| value { $$ = $1; } | ||
; | ||
|
||
value | ||
: NUMBER { $$ = { type: 'Value', value: parseFloat($1) }; } | ||
| SUB NUMBER { $$ = { type: 'Value', value: parseFloat($2) * -1 }; } | ||
; | ||
|
||
function | ||
: FUNCTION { $$ = { type: 'Function', value: $1 }; } | ||
; | ||
|
||
css_value | ||
: LENGTH { $$ = { type: 'LengthValue', value: parseFloat($1), unit: /[a-z]+/i.exec($1)[0] }; } | ||
| ANGLE { $$ = { type: 'AngleValue', value: parseFloat($1), unit: /[a-z]+/i.exec($1)[0] }; } | ||
| TIME { $$ = { type: 'TimeValue', value: parseFloat($1), unit: /[a-z]+/i.exec($1)[0] }; } | ||
| FREQ { $$ = { type: 'FrequencyValue', value: parseFloat($1), unit: /[a-z]+/i.exec($1)[0] }; } | ||
| RES { $$ = { type: 'ResolutionValue', value: parseFloat($1), unit: /[a-z]+/i.exec($1)[0] }; } | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Added |
||
| EMS { $$ = { type: 'EmValue', value: parseFloat($1), unit: 'em' }; } | ||
| EXS { $$ = { type: 'ExValue', value: parseFloat($1), unit: 'ex' }; } | ||
| CHS { $$ = { type: 'ChValue', value: parseFloat($1), unit: 'ch' }; } | ||
| REMS { $$ = { type: 'RemValue', value: parseFloat($1), unit: 'rem' }; } | ||
| VHS { $$ = { type: 'VhValue', value: parseFloat($1), unit: 'vh' }; } | ||
| VWS { $$ = { type: 'VwValue', value: parseFloat($1), unit: 'vw' }; } | ||
| VMINS { $$ = { type: 'VminValue', value: parseFloat($1), unit: 'vmin' }; } | ||
| VMAXS { $$ = { type: 'VmaxValue', value: parseFloat($1), unit: 'vmax' }; } | ||
| PERCENTAGE { $$ = { type: 'PercentageValue', value: parseFloat($1), unit: '%' }; } | ||
| SUB css_value { var prev = $2; prev.value *= -1; $$ = prev; } | ||
; | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Already |
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.
Only add
.toLowerCase()
because original module doesn't support uppercase notation