Skip to content
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

JSX parsing fails with large attributes #178

Open
brekk opened this issue Jun 13, 2024 · 1 comment
Open

JSX parsing fails with large attributes #178

brekk opened this issue Jun 13, 2024 · 1 comment

Comments

@brekk
Copy link
Contributor

brekk commented Jun 13, 2024

When writing JSX style elements, parsing fails on large attributes, as in this <path> component:

(click to expand)

import { d, fill, height, viewBox, width, xmlns } from "@/Attribute"
import { path, svg } from "@/Element"

export Logo = (props) => (
  <svg width={571} height={96} viewBox="0 0 571 96" fill="none" xmlns="http://www.w3.org/2000/svg">
    <path
      d="M523.715 96H458.763C462.727 82.304 466.307 68.352 471.293 48C476.407 27.648 479.86 13.44 482.673 0H544.045C563.991 0 574.348 10.24 569.873 27.392C567.443 37.12 563.352 41.728 553.762 44.8C551.205 45.696 548.137 46.208 544.684 46.592L544.429 47.232C546.858 47.488 548.904 47.872 550.438 48.384C560.795 51.584 562.84 60.16 559.9 72.064C555.552 89.728 545.835 96 523.715 96ZM516.427 54.912C513.615 54.912 510.29 55.04 506.71 55.168C505.048 61.824 503.514 68.352 502.235 73.984C505.815 74.24 508.884 74.24 511.824 74.24C517.834 74.24 521.158 72.192 522.692 65.792C524.738 57.6 522.309 54.912 516.427 54.912ZM510.674 39.168C513.742 39.296 516.683 39.296 519.24 39.296C519.752 39.296 520.135 39.296 520.391 39.296C526.145 39.168 529.469 36.736 531.131 30.08C533.049 22.4 530.364 19.84 525.25 19.84C522.181 19.84 518.985 19.84 515.532 19.968C514.126 25.344 512.464 32.128 510.674 39.168Z"
      fill="white"
    />
  </svg>
)

This is likely due to the decideTokenLeftChevron function here which tops out at 800 characters. (For reference the d attribute above is 880 characters long):

decideTokenLeftChevron :: AlexInput -> Int -> Alex Token
decideTokenLeftChevron (posn, prevChar, pending, input) len = do
sourceTarget <- getCurrentSourceTarget
let next = BLU.fromString $ take 800 input
matchedOpen = match jsxTagOpen next :: Bool
matchedClose = match jsxTagClose next :: Bool
matchedSingle = match jsxTagSingle next :: Bool
token <-
if matchedSingle then do
pushStartCode jsxAutoClosed
return TokenJsxTagOpenSingle
else if matchedOpen then do
jsxTagOpened
return TokenJsxTagOpenStart
else if matchedClose then do
jsxTagClosed
return TokenJsxTagOpenEnd
else
return TokenLeftChevron
return $ Token (makeArea posn (take len input)) sourceTarget token

@brekk
Copy link
Contributor Author

brekk commented Jun 13, 2024

This can currently be worked around by simply defining the value as a standalone variable and then inlining it within the JSX, e.g.

myLongAttribute = "..."

// [...]

return <path d={myLongAttribute} />

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant