arbre icon indicating copy to clipboard operation
arbre copied to clipboard

Support for custom elements with hyphenated tag names

Open jaredcwhite opened this issue 3 years ago • 0 comments

Just started to play around with Arbre, and something I noticed right off the bat is it doesn't have out-of-the-box support for custom elements. Since that's part of the HTML spec, seems to me there should be a way to support it.

I wrote a little wrapper Arbre component which might help kick off discussion:

class CustomElement < Arbre::Component
  builder_method :custom

  def build(tag_name, *args, **kwargs)
    @tag_name = tag_name.to_s.tr("_", "-")

    super(*args, **kwargs)
  end

  attr_reader :tag_name
end

Then you could just use it in your template:

custom :my_custom_component, "Wow, it works!", class: "something" do
  para "Very nice!"
end
<my-custom-component class="something"><p>Very nice!</p></my-custom-component>

Obviously people could write their own Arbre components to handle individual custom elements, which is pretty cool actually, but I think an out-of-the-box wrapper would be helpful to start.

jaredcwhite avatar Apr 02 '21 16:04 jaredcwhite