Style guiding example

_component.html.haml

%section.component{class: defined?(main_classes) && main_classes, id: defined?(id) && id}
  %h1.component-header{class: defined?(header_classes) && header_classes, id: defined?(header_id) && header_id}= header
  .component-content{class: defined?(content_classes) && content_classes, id: defined?(content_id) && content_id}
    =body

helper.rb

module StyleGuideHelper  
  # Only need this helper once, it will provide an interface to convert a block into a partial.
  # 1. Capture is a Rails helper which will 'capture' the output of a block into a variable
  # 2. Merge the 'body' variable into our options hash
  # 3. Render the partial with the given options hash. Just like calling the partial directly.
  def block_to_partial(partial_name, options = {}, &block)
	  options.merge!(:body => capture(&block))
	  render(:partial => partial_name, :locals => options)
	end

	def component(options = {}, &block)
		# Check the ids here somehow?
		options.merge!(:body => capture(&block))
		#render(:partial => 'style_guide/box2', :locals => options)
	  	block_to_partial('style_guide/component', options, &block)
	end

	def box2(options = {}, &block)
		options.merge!(:body => capture(&block))
		#render(:partial => 'style_guide/box2', :locals => options)
	  block_to_partial('style_guide/box2', options, &block)
	end

end

styles.html.haml

%h1 Style Guide

= component({header: 'hi', main_classes2: "one two", main_id: "iddd", header_class: "header-class", header_id: "head", content_id: "content-id", content_class: "classer"}) do
  %ul 
    %li one 
    %li two
  =image_tag  "logo-cerner.gif"

A comment from IRC:

if you want to clean it up you could separate the attributes by context - header: {id: 'blah', class: 'blah blah2'}, content: {id: …}