Class: DocsUI::Table

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

Overview

A generic reference table — headers + rows — in the kit's daisyUI look (a table table-sm table-zebra inside a rounded-box border, not-prose so the surrounding Prose typography doesn't restyle it). This is the piece every docs site was hand-rolling; compose it, don't write raw table/tr/td markup.

render DocsUI::Table.new(
["Option", "Type", "Default", "Description"],
[
  ["brand", "String", '"Docs"', "Topbar + sidebar heading."],
  ["themes", [:code, "%w[dark light]"], "—", "ThemeSwitcher options."],
]
)

Cell values (the same convention the dogfood PropTable proved):

* String        → plain text (Phlex-escaped; HTML in it is inert, never live)
* [:code, "x"]  → inline <code> (for a type, a default literal, an identifier)
* [:md, "…"]    → inline GFM through DocsUI::Markdown (bold/links/inline code),
                opt-in so a plain String that merely *looks* like markdown
                is never surprise-parsed.

PropTable is a thin preset over this (name/type/default/description, first column auto-code-styled).

Constant Summary collapse

WRAPPER = 
"not-prose my-4 overflow-x-auto rounded-box border border-base-300"
TABLE = 
"table table-sm table-zebra"

Instance Method Summary collapse

Constructor Details

#initialize(headers, rows) ⇒ Table

Returns a new instance of Table.



31
32
33
34
 
# File 'app/components/docs_ui/table.rb', line 31

def initialize(headers, rows)
  @headers = headers
  @rows = rows
end

Instance Method Details

#view_template ⇒ Object 



36
37
38
39
40
41
42
43
44
45
46
47
 
# File 'app/components/docs_ui/table.rb', line 36

def view_template
  div(class: WRAPPER) do
    table(class: TABLE) do
      thead do
        tr { @headers.each { |header| th(class: "whitespace-nowrap") { plain header.to_s } } }
      end
      tbody do
        @rows.each { |cells| tr { cells.each { |cell| td { render_cell(cell) } } } }
      end
    end
  end
end