Escape character "\" doesn't work for whole code block when parameter value ends with ">" symbol to denote end of parameters

[mikeysouthwell]

As an example, if I have the following:

<frame justifyContent=center height=48 width=48 >

And I put an escape character "\" after "width=48 >", and I then change the width to "hug" instead of fixed and the width line is conditional on there being a css.width value, then it disappears along with the ">" which ends the frame parameters. The only way I have seen around this is to put an escape character after each line, but that ends up with everything on one line and I want to keep the more readable code format of one parameter per line. Alternatively I could put the ">" character on its own line below the last parameter (width in this example), but then the code is using more lines than it needs to and isn't as neat.

Does this make sense? Is there a better way of doing this?

[jake-figma]

the problem here is that width is not defined when you switch to hug, so the whole line is invalidated. you basically want the width statement on its own line, so if it doesnt render, only that part goes unrendered.

eg.

<whatever-you-want\
width={{css.width}}\
everything-else>

becomes <whatever-you-want width=48 everything-else> when width is defined and <whatever-you-want everything-else> when it isnt.

[mikeysouthwell]

Thanks Jake, this should work as long as the object has more than just height and width defined. So even if height and width are set to hug it will still keep the same structure.

For example:

<Frame\ width=“{{css.width}}”\ height=“{{css.height}}”\ background=“{{css.background-color}}”/>

Assuming of course that the frame will always have a background value, even if it’s transparent. This wouldn’t work if I’d just given it height and width and then set them to hug though.

Do you happen to know how to use FlexLayout when the width and height values are set to hug and not explicitly defined? I know that question is a little off topic.

Kind Regards,

Mike.

On Fri, 9 Feb 2024 at 11:35 pm, Jake @.***> wrote:

the problem here is that width is not defined when you switch to hug, so the whole line is invalidated. you basically want the width statement on its own line, so if it doesnt render, only that part goes unrendered.

eg.

<whatever-you-want\ width={{css.width}}\ everything-else>

becomes when width is defined and when it isnt.

— Reply to this email directly, view it on GitHub https://github.com/figma/code-snippet-editor-plugin/issues/27#issuecomment-1936143494, or unsubscribe https://github.com/notifications/unsubscribe-auth/AHWLFBB5LRIXVYT3EWQHXCLYSY65XAVCNFSM6AAAAABDAUVVZWVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTSMZWGE2DGNBZGQ . You are receiving this because you authored the thread.Message ID: @.***>