Hello everyone, I’ve just released a new library called SurfaceFormatter.
A special thanks to @msaraiva for his help and collaboration!
What is it?
SurfaceFormatter is a code formatter (like mix format) for Surface code.
If you’re not familiar with Surface, you can find it on Hex, GitHub, or the original ElixirForum post.
Why did I create it?
So that Surface developers can focus on building things without sacrificing valuable time and attention to make the code nicely formatted.
How does it work?
Add it to a Surface project, and run mix surface.format. That’s it!
Where can I find it?
A short example
Surface code that looks like this:
<RootComponent with_many_attributes={{ true }} causing_this_line_to_wrap={{ true}} because_it_is_too_long={{ "yes" }}>
<!-- An HTML comment -->
{{#An Elixir comment}}
<div :if={{@show_div}}
class="container">
<p> Text inside paragraph </p>
<span>Text touching parent tags</span>
</div>
<Child items={{[%{name: "Option 1", key: 1}, %{name: "Option 2", key: 2}, %{name: "Option 3", key: 3}, %{name: "Option 4", key: 4}]}}>
Contents
</Child>
</RootComponent>
will be formatted like this:
<RootComponent
with_many_attributes
causing_this_line_to_wrap
because_it_is_too_long="yes, this line is long enough to wrap"
>
{{ # An Elixir comment }}
<div :if={{ @show_div }} class="container">
<p>
Text inside paragraph
</p>
<span>Text touching parent tags</span>
</div>
<Child items={{[
%{name: "Option 1", key: 1},
%{name: "Option 2", key: 2},
%{name: "Option 3", key: 3},
%{name: "Option 4", key: 4}
]}}>
Contents
</Child>
</RootComponent>
in your example …
