Module: HTMLComponent

Included in:
DropdownComponent, OrderedListComponent, RadioGroupComponent, TableComponent, TableRowComponent, UnorderedListComponent
Defined in:
lib/html-native.rb,
lib/html-native/logic.rb,
lib/html-native/builder.rb,
lib/html-native/constants.rb

Defined Under Namespace

Classes: Builder

Constant Summary collapse

TAG_LIST =

A list of all valid HTML5 elements. These are used to generate generator methods within HTMLComponent contexts.

[
  :html, 
  :base, :head, :link, :meta, :style, :title,
  :body,
  :address, :article, :aside, :footer, :h1, :h2, :h3, :h4, :h5, :h6, :header, 
      :hgroup, :main, :nav, :section,
  :blockquote, :dd, :div, :dl, :dt, :figcaption, :figure, :hr, :li, :ol, :p, :pre, :ul,
  :a, :abbr, :b, :bdi, :bdo, :br, :cite, :code, :data, :dfn, :em, :i, :kbd, :mark, :q,
      :rb, :rp, :rt, :rtc, :ruby, :s, :samp, :small, :span, :strong, :sub, :sup, :time, 
      :u, :var, :wbr,
  :area, :audio, :img, :map, :track, :video,
  :embed, :iframe, :object, :param, :picture, :portal, :source,
  :svg, :math,
  :canvas, :noscript, :script,
  :del, :ins,
  :caption, :col, :colgroup, :table, :tbody, :td, :tfoot, :th, :thead, :tr,
  :button, :datalist, :fieldset, :form, :input, :legend, :meter, :optgroup,
      :option, :output, :progress, :select, :textarea,
  :details, :dialog, :menu, :summary,
  :slot, :template
]
LIMITED_ATTRIBUTES =

A list of all limited attributes in HTML5. Any attribute not listed here are free to use in any element, as long as it is not in FORBIDDEN_ATTRIBUTES.

Any attributes listed here will only be allowed in the associated elements.

{
  accept: [:form, :input],
  "accept-charset": [:form],
  action: [:form],
  align: [:caption, :col, :colgroup, :hr, :iframe, :img, :table, 
          :tbody, :td, :tfoot, :th, :thead, :tr],
  allow: [:iframe],
  alt: [:area, :img, :input],
  async: [:script],
  autocomplete: [:form, :input, :select, :textarea],
  autofocus: [:button, :input, :select, :textarea],
  autoplay: [:audio, :video],
  buffered: [:audio, :video],
  capture: [:input],
  charset: [:meta, :script],
  checked: [:input],
  cite: [:blockquote, :del, :ins, :q],
  cols: [:textarea],
  colspan: [:td, :th],
  content: [:meta],
  controls: [:audio, :video],
  coords: [:area],
  crossorigin: [:audio, :img, :link, :script, :video],
  csp: [:iframe],
  data: [:object],
  datatime: [:del, :ins, :time],
  decoding: [:img],
  default: [:track],
  defer: [:script],
  dirname: [:input, :textarea],
  disabled: [:button, :fieldset, :input, :optgroup, 
             :option, :select, :textarea],
  download: [:a, :area],
  enctype: [:form],
  enterkeyhint: [:textarea],
  "for": [:label, :output],
  form: [:button, :fieldset, :input, :label, :meter, :object, 
         :output, :progress, :select, :textarea],
  formaction: [:input, :button],
  formentype: [:button, :input],
  formmethod: [:button, :input],
  formnovalidate: [:button, :input],
  formtarget: [:button, :input],
  headers: [:td, :th],
  height: [:canvas, :embed, :iframe, :img, :input, :object, :video],
  high: [:meter],
  href: [:a, :area, :base, :link],
  hreflang: [:a, :area, :link],
  "http-equiv": [:meta],
  importance: [:iframe, :img, :link, :script],
  integrity: [:link, :script],
  inputmode: [:textarea],
  ismap: [:img],
  kind: [:track],
  label: [:optgroup, :option, :track],
  language: [:script],
  loading: [:img, :iframe],
  list: [:input],
  loop: [:audio, :video],
  low: [:meter],
  max: [:input, :meter, :progress],
  maxlength: [:input, :textarea],
  minlength: [:input, :textarea],
  media: [:a, :area, :link, :source, :style],
  method: [:form],
  min: [:input, :select],
  multiple: [:input, :select],
  muted: [:audio, :video],
  name: [:button, :form, :fieldset, :iframe, :input, :object, 
         :output, :select, :textarea, :map, :meta, :param],
  novalidate: [:form],
  open: [:details],
  optimum: [:meter],
  pattern: [:input],
  ping: [:a, :area],
  placeholder: [:input, :textarea],
  poster: [:video],
  preload: [:audio, :video],
  readonly: [:input, :textarea],
  referrerpolicy: [:a, :area, :iframe, :img, :link, :script],
  rel: [:a, :area, :link],
  required: [:input, :select, :textarea],
  reversed: [:ol],
  rows: [:textarea],
  rowspan: [:td, :th],
  sandbox: [:iframe],
  scope: [:th],
  scoped: [:style],
  selected: [:option],
  shape: [:a, :area],
  size: [:input, :select],
  sizes: [:link, :img, :source],
  span: [:col, :colgroup],
  src: [:audio, :embed, :iframe, :img, :input, :script, :source, :track, :video],
  srcdoc: [:iframe],
  srclang: [:track],
  srcset: [:img, :source],
  start: [:ol],
  step: [:input],
  summary: [:table],
  target: [:a, :area, :base, :form],
  type: [:button, :input, :embed, :object, :script, :source, :style, :menu],
  usemap: [:img, :input, :object],
  value: [:button, :data, :input, :li, :meter, :option, :progress, :param],
  width: [:canvas, :embed, :iframe, :img, :input, :object, :video],
  wrap: [:textarea]
}
FORBIDDEN_ATTRIBUTES =

These attributes are deprecated or outright forbidden. However, some people might still try to use them. These attributes are expressly disallowed during generation, and won’t be included, even if provided.

[:background, :bgcolor, :border, :color, :manifest]

Class Method Summary collapse

Instance Method Summary collapse

Class Method Details

.singleton(&block) ⇒ Object

Creates a module that encompasses the given block in an HTMLComponent context. This gives access to methods in the block as though the block was declared as the ‘render` function in a module extending HTMLComponent (pretty much because it is).



39
40
41
42
43
44
 
# File 'lib/html-native.rb', line 39

def self.singleton(&block)
  Module.new do
    extend HTMLComponent
    define_singleton_method :render, &block
  end
end

Instance Method Details

#_if(bool, &block) ⇒ Object 



20
21
22
23
24
25
26
 
# File 'lib/html-native/logic.rb', line 20

def _if(bool, &block)
  if bool
    Builder.new(block.call)
  else
    Builder.new
  end
end

#_label(attrs = {}, &block) ⇒ Object 



25
26
27
28
29
30
31
32
33
 
# File 'lib/html-native.rb', line 25

def _label(attrs = {}, &block)
  attrs ||= {}
  if block
    body = block.call
    Builder.new("<label#{attributes_list(:label, attrs)}>") + body + "</label>"
  else
    Builder.new("<label#{attributes_list(:label, attrs)}/>") 
  end
end

#_unless(bool, &block) ⇒ Object 



28
29
30
31
32
33
34
 
# File 'lib/html-native/logic.rb', line 28

def _unless(bool, &block)
  unless bool
    Builder.new(block.call)
  else
    Builder.new
  end
end

#doctype(type) ⇒ Object 



21
22
23
 
# File 'lib/html-native.rb', line 21

def doctype(type)
  Builder.new("<!DOCTYPE #{type}>")
end

#valid_attribute?(tag, attribute) ⇒ Boolean

Checks if the attribute is valid for a given tag.

For example, ‘class` and `hidden` are valid for everything, but `autoplay` is valid for only `video` and `audio` tags, and invalid for all other tags.

Returns:

  • (Boolean) 


50
51
52
53
54
55
 
# File 'lib/html-native.rb', line 50

def valid_attribute?(tag, attribute)
  if LIMITED_ATTRIBUTES.key?(attribute.to_sym)
    return LIMITED_ATTRIBUTES[attribute.to_sym].include?(tag.to_sym)
  end
  return !FORBIDDEN_ATTRIBUTES.include?(attribute)
end