Class: DocsUI::Callout

Inherits:
Phlex::HTML
  • Object
show all
Defined in:
app/components/docs_ui/callout.rb

Overview

A callout box (note / tip / warning) for the docs. daisyUI alert styling + a lucide icon per level.

render DocsUI::Callout.new(:warning) { "Restart the server after…" }

Constant Summary collapse

LEVELS =
{
  note: { klass: "alert-info", icon: "info" },
  tip: { klass: "alert-success", icon: "lightbulb" },
  warning: { klass: "alert-warning", icon: "triangle-alert" }
}.freeze

Instance Method Summary collapse

Constructor Details

#initialize(level = :note, title: nil) ⇒ Callout

Returns a new instance of Callout.



15
16
17
18
19
20
21
# File 'app/components/docs_ui/callout.rb', line 15

def initialize(level = :note, title: nil)
  # Normalize an unknown level to :note so both the styling and the
  # data-md-callout export hint agree (never a bogus level name leaking out).
  @level = LEVELS.key?(level) ? level : :note
  @config = LEVELS[@level]
  @title = title
end

Instance Method Details

#view_templateObject



23
24
25
26
27
28
29
30
31
32
33
34
35
# File 'app/components/docs_ui/callout.rb', line 23

def view_template(&)
  # data-md-callout carries the level (note/tip/warning) so
  # DocsKit::MarkdownExport renders `> **Tip:** …` without reverse-engineering
  # the level from the alert-* class.
  div(class: "not-prose alert #{@config[:klass]} my-4 items-start", role: "note",
      data: { md_callout: @level }) do
    render DocsUI::Icon.new(@config[:icon], class: "size-5 shrink-0")
    div do
      div(class: "font-semibold") { @title } if @title
      div(class: "text-sm", &)
    end
  end
end