Class: Bulmacomp::MessageComponent

Inherits:
ViewComponent::Base
  • Object
show all
Defined in:
app/components/bulmacomp/message_component.rb

Overview

Make an html structure for a bulma message

Examples:

Empty message

render Bulmacomp::MessageComponent.new()

<article class="message"></article>

Message with title

render Bulmacomp::MessageComponent.new(title: 'test')

<article class="message">
  <div class="message-header"><p>test</p></div>
</article>

Message with close button and option

render Bulmacomp::MessageComponent.new(close: true, close_option: {id: 'close'})

<article class="message">
  <div class="message-header"><button id="close" class="delete" aria-label="delete"></button></div>
</article>

Message with yield content


<article class="message">
  <div class="message-body">test</div>
</article>

Instance Method Summary collapse

Constructor Details

#initialize(title: nil, close: false, close_option: {}, **opts) {|optional| ... } ⇒ MessageComponent

Returns a new instance of MessageComponent.

Parameters:

  • opts (Hash)

    options to generate content

Options Hash (**opts):

  • title (String)

    Title test, is added in ‘article .message-header p’ tag if present

  • close (Boolean)

    if TRUE add close button in title

  • close_option (Hash)

    parameters to close button tag

  • :* (String)

    each key going as article tag option, default is class: ‘message’

Yields:

  • (optional)

    message content



42
43
44
45
46
47
48
# File 'app/components/bulmacomp/message_component.rb', line 42

def initialize(title: nil, close: false, close_option: {}, **opts)
  super
  @title = title
  @close = close
  @close_option = close_option
  @opts = { class: 'message' }.merge opts
end

Instance Method Details

#callObject

return [String] generated bulma message



51
52
53
# File 'app/components/bulmacomp/message_component.rb', line 51

def call
  tag.article safe_join([header, tag.div(content, class: 'message-body')]), **@opts
end

#headerObject

return [String] div.message-header if @title or @close is present



56
57
58
59
60
61
# File 'app/components/bulmacomp/message_component.rb', line 56

def header
  ret = []
  ret << tag.p(@title) if @title.present?
  ret << tag.button(**{ class: 'delete', aria: { label: 'delete' } }.merge(@close_option)) if @close
  tag.div safe_join(ret), class: 'message-header' if ret.present?
end