Components

Mayu components are written in a dialect of Haml. Mayu uses Klenod to parse Haml code and transform it into Ruby.

To see how these transformations are made, see the Klenod Haml-plugin test examples.

Component structure

This is the basic structure of a component:

:ruby
  # optional ruby block
%p
  Haml goes here
:css
  /* optional css block */

In the :ruby block, which has to come first, you can import other components and define methods.

A basic component

Here is the most basic component

%p Hello world

It compiles into:

Mayu::Runtime::H[:p, "Hello world"]

Multiple children

Only the last child is returned, so if you want to return more than one element you need to group them.

%div
  %p Hello world
  %button Click me

Interpolation

You can perform string interpolation in a lot of places:

:ruby
  text = "hello world"
%div
  %p Contents of text: #{text.inspect}
  %button(title=text) Button with a title
  %button{title: "text: #{text}"} Button with a title