lambda-fairy / maud

:pencil: Compile-time HTML templates for Rust
https://maud.lambda.xyz
Apache License 2.0
1.98k stars 132 forks source link

Accept literals in attribute names #396

Closed RedPhoenixQ closed 7 months ago

RedPhoenixQ commented 8 months ago

The parser now accepts TokenTree::Literal as names for attributes.

To prevent the name_to_string function from showing and escaping the surrounding " of a string literal the string representation is trimmed first. This should not affect how other literals work which means that both "name"="true" and 123="true" would be valid.

This also addresses the PR request in #194

fraschm1998 commented 8 months ago

Tried this, I seem to get:

"x-on:click"="toggle" type="button" aria-controls="mobile-menu" aria-expanded ="false" { ■ element body must be wrapped in braces = help: see https://github.com/lambda-fairy/maud/pull/137 for details

RedPhoenixQ commented 8 months ago

Could you send more context like the macro where this element is created. This looks like and issue with missing {} for the element body or ; for a self closing element

fraschm1998 commented 8 months ago

Could you send more context like the macro where this element is created. This looks like and issue with missing {} for the element body or ; for a self closing element

div."absolute inset-y-0 left-0 flex items-center sm:hidden" {                                                                                                                                                                                                                        
    1                                             // Mobile menu button                                                                                                                                                                                                                                                            
💥  2                                             button."relative inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-100 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500" "@click"="toggle" type="button" aria-controls="mobile-menu" aria-expanded="fa      lse" {     ■ element body must be wrapped in braces      = help: see https://github.com/lambda-fairy/maud/pull/137 for details                    
    3                                                 span."absolute -inset-0.5" {}                                                                                                                                                                                                                  
    4                                                 span."sr-only" { "Open main menu" }                                                                                                                                                                                                            
    5                                                 // Icon when menu is closed.                                                                                                                                                                                                                   
    6                                                 @for (item, path) in [("block", "M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"), ("hidden", "M6 18L18 6M6 6l12 12")] {                                                                                                                         
    7                                                     svg.{ (item) " h-6 w-6" } fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" {                                                                                                                                                  
    8                                                         path stroke-linecap="round" stroke-linejoin="round" d=(path) {}                                                                                                                                                                                                      
    9                                                     }                                                                                                                                                                                                                                                                        
   10                                                 }                                                                                                                                                                                                                                                                            
   11                                             }                                                                                                                                                                                                                                                                                
   12                                         } 
RedPhoenixQ commented 8 months ago

I'm unable to reproduce the issue when copying the elements you sent. On the code that includes this PR it compiles for me and seemingly give the correct html.

This is the html string your code produces: "<div class=\"absolute inset-y-0 left-0 flex items-center sm:hidden\"><button class=\"relative inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-100 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500\" @click=\"toggle\" type=\"button\" aria-controls=\"mobile-menu\" aria-expanded=\"false\"><span class=\"absolute -inset-0.5\"></span><span class=\"sr-only\">Open main menu</span><svg class=\"block h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" aria-hidden=\"true\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5\"></path></svg><svg class=\"hidden h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" aria-hidden=\"true\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\"></path></svg></button></div><h1 class=\"pinkie-123 asdf asdf asdf asdf asdf\">Pinkie Pie<button class=\"asdf\">test</button></h1>"

fraschm1998 commented 8 months ago

Nvm. Seems to be working now. I think I may have just forgotten to clear the build cache.

Thanks!

RedPhoenixQ commented 7 months ago

I found a bug. Literals are now parsed and the try_name() function doesn't see literals, leading to code like html! { div test-123="true" {} } to be generated as <div test- 123="true"></div>