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.

Sign up for GitHub

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

Jump to bottom

switch() alternate syntax is not supported #81

Open
1 of 4 tasks
godismyjudge95 opened this issue Jan 19, 2024 · 4 comments
Open
1 of 4 tasks

switch() alternate syntax is not supported #81

godismyjudge95 opened this issue Jan 19, 2024 · 4 comments

Comments

@godismyjudge95
Copy link

Describe the bug
It formats the alternate switch() syntax in a very funky manner

Impacted Products
Which Antlers Toolbox products does this bug apply to?

  • Antlers Toolbox for VS Code
  • Formatter CLI
  • Antlers Prettier Plugin
  • Antlers Syntax Highlighting (external systems - not VS Code)

Versions and Other Plugins/Extensions
prettier-plugin-antlers - 2.0.1

To Reproduce
Paste in the template code and format.

Expected behavior
It formats properly

If submitting a formatting bug, please include the template contents below as well as an attachment

<div>
    <div>
        <div
            class="{{ '' | tw_merge('flex-initial flex flex-col items-start justify-center', switch(
                                                                           (content_width === '75') => 'md:basis-3/4',
                                                                           (content_width === '25') => 'md:basis-full max-w-5xl items-center',
                                                                           ), switch(
                                                                               (background_color === 'white' || background_color === 'gray') => 'text-black',
                                                                               (background_color === 'charcoal') => 'text-white antialiased',
                                                                               ), switch(
                                                                                   (padding === 'left' && image_position === 'right') => 'content:ml-breakout pl-5',
                                                                                   (padding === 'right' && image_position === 'left') => 'content:mr-breakout pr-5',
                                                                                   ), ) }}"
        >
        </div>
    </div>
</div>
@JohnathonKoster
Copy link
Contributor

The original intent was to have it indent below where it was used initially (but can see that first relative indentation is misaligned correctly). Opened to others ideas, but otherwise would just be looking to fix that first round of indentation

@godismyjudge95
Copy link
Author

I was expecting it to format something like so:

<div>
    <div>
        <div
            class="{{ '' | tw_merge(
                      'flex-initial flex flex-col items-start justify-center',
                      switch(
                          (content_width === '75') => 'md:basis-3/4',
                          (content_width === '25') => 'md:basis-full max-w-5xl items-center',
                      ),
                      switch(
                          (background_color === 'white' || background_color === 'gray') => 'text-black',
                          (background_color === 'charcoal') => 'text-white antialiased',
                      ),
                      switch(
                          (padding === 'left' && image_position === 'right') => 'content:ml-breakout pl-5',
                          (padding === 'right' && image_position === 'left') => 'content:mr-breakout pr-5',
                      ),
                  ) }}"
        >
        </div>
    </div>
</div>

I realize this is purely a matter of opinion, but the way it formats it right now means any time I use a switch call I am having to disable prettier for that file (not ideal).

@JohnathonKoster
Copy link
Contributor

I'll do some thinking and experimenting to see what I can come up with 🤝

@stefankempf
Copy link

stefankempf commented May 7, 2024 •
edited
Loading

Maybe another short addition: In my case, I often have a negative indentation which makes the code hard to read.

<html>
    <body>
        <main
            data-transition-namespace="{{ switch(
    (current_template == 'projekte/index') => 'projectIndex',
    () => 'default') }}">
    </body>
</html>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@godismyjudge95 @JohnathonKoster @stefankempf