diff --git a/app/controllers/cfa/styleguide/pages_controller.rb b/app/controllers/cfa/styleguide/pages_controller.rb
index 14560b14..5d739718 100644
--- a/app/controllers/cfa/styleguide/pages_controller.rb
+++ b/app/controllers/cfa/styleguide/pages_controller.rb
@@ -3,7 +3,12 @@ module Styleguide
class PagesController < ApplicationController
layout "main"
- def form_builder
+ def form_builder_v1
+ @form = Cfa::Styleguide::FormExample.new
+ @form.valid?
+ end
+
+ def form_builder_v2
@form = Cfa::Styleguide::FormExample.new
@form.valid?
end
diff --git a/app/views/cfa/styleguide/pages/form_builder.html.erb b/app/views/cfa/styleguide/pages/form_builder_v1.html.erb
similarity index 70%
rename from app/views/cfa/styleguide/pages/form_builder.html.erb
rename to app/views/cfa/styleguide/pages/form_builder_v1.html.erb
index b0a550fd..8bfed7fc 100644
--- a/app/views/cfa/styleguide/pages/form_builder.html.erb
+++ b/app/views/cfa/styleguide/pages/form_builder_v1.html.erb
@@ -8,13 +8,14 @@
-<%= render 'section', title: 'Input Field', example: 'form_builder/cfa_input_field' %>
-<%= render 'section', title: 'Range Field', example: 'form_builder/cfa_range_field' %>
-<%= render 'section', title: 'Text area', example: 'form_builder/cfa_textarea' %>
-<%= render 'section', title: 'Date select', example: 'form_builder/cfa_date_select' %>
-<%= render 'section', title: 'Checkbox set', example: 'form_builder/cfa_checkbox_set' %>
-<%= render 'section', title: 'Checkbox set with none', example: 'form_builder/cfa_checkbox_set_with_none' %>
-<%= render 'section', title: 'Radio set', example: 'form_builder/cfa_radio_set' %>
-<%= render 'section', title: 'Radio set with follow up', example: 'form_builder/cfa_radio_set_with_follow_up' %>
-<%= render 'section', title: 'Single tap button', example: 'form_builder/cfa_single_tap_button' %>
-<%= render 'section', title: 'Select', example: 'form_builder/cfa_select' %>
+
+<%= render 'section', title: 'Input Field', example: 'form_builder/v1/cfa_input_field' %>
+<%= render 'section', title: 'Range Field', example: 'form_builder/v1/cfa_range_field' %>
+<%= render 'section', title: 'Text area', example: 'form_builder/v1/cfa_textarea' %>
+<%= render 'section', title: 'Date select', example: 'form_builder/v1/cfa_date_select' %>
+<%= render 'section', title: 'Checkbox set', example: 'form_builder/v1/cfa_checkbox_set' %>
+<%= render 'section', title: 'Checkbox set with none', example: 'form_builder/v1/cfa_checkbox_set_with_none' %>
+<%= render 'section', title: 'Radio set', example: 'form_builder/v1/cfa_radio_set' %>
+<%= render 'section', title: 'Radio set with follow up', example: 'form_builder/v1/cfa_radio_set_with_follow_up' %>
+<%= render 'section', title: 'Single tap button', example: 'form_builder/v1/cfa_single_tap_button' %>
+<%= render 'section', title: 'Select', example: 'form_builder/v1/cfa_select' %>
diff --git a/app/views/cfa/styleguide/pages/form_builder_v2.html.erb b/app/views/cfa/styleguide/pages/form_builder_v2.html.erb
new file mode 100644
index 00000000..ac7e0183
--- /dev/null
+++ b/app/views/cfa/styleguide/pages/form_builder_v2.html.erb
@@ -0,0 +1,17 @@
+<% content_for(:template_name) { "styleguide" } %>
+
+
+
+
+
CfaV2FormBuilder
+
CfAV2FormBuilder is a helper that generates accessible form fields for the styleguide.
+
+
+
+
+<%= render 'section', title: 'Text Input', example: 'form_builder/v2/cfa_text_input' %>
+<%#= render 'section', title: 'Radio Button', example: 'form_builder/v2/cfa_radio' %>
+<%#= render 'section', title: 'Radiogroup', example: 'form_builder/v2/cfa_radiogroup' %>
+<%#= render 'section', title: 'Select', example: 'form_builder/v2/cfa_select' %>
+<%#= render 'section', title: 'Date Input', example: 'form_builder/v2/cfa_date_input' %>
+<%#= render 'section', title: 'Checkbox', example: 'form_builder/v2/cfa_checkbox' %>
diff --git a/app/views/examples/form_builder/_cfa_checkbox_set.html.erb b/app/views/examples/form_builder/v1/_cfa_checkbox_set.html.erb
similarity index 100%
rename from app/views/examples/form_builder/_cfa_checkbox_set.html.erb
rename to app/views/examples/form_builder/v1/_cfa_checkbox_set.html.erb
diff --git a/app/views/examples/form_builder/_cfa_checkbox_set_with_none.html.erb b/app/views/examples/form_builder/v1/_cfa_checkbox_set_with_none.html.erb
similarity index 100%
rename from app/views/examples/form_builder/_cfa_checkbox_set_with_none.html.erb
rename to app/views/examples/form_builder/v1/_cfa_checkbox_set_with_none.html.erb
diff --git a/app/views/examples/form_builder/_cfa_date_select.html.erb b/app/views/examples/form_builder/v1/_cfa_date_select.html.erb
similarity index 100%
rename from app/views/examples/form_builder/_cfa_date_select.html.erb
rename to app/views/examples/form_builder/v1/_cfa_date_select.html.erb
diff --git a/app/views/examples/form_builder/_cfa_input_field.html.erb b/app/views/examples/form_builder/v1/_cfa_input_field.html.erb
similarity index 100%
rename from app/views/examples/form_builder/_cfa_input_field.html.erb
rename to app/views/examples/form_builder/v1/_cfa_input_field.html.erb
diff --git a/app/views/examples/form_builder/_cfa_radio_set.html.erb b/app/views/examples/form_builder/v1/_cfa_radio_set.html.erb
similarity index 100%
rename from app/views/examples/form_builder/_cfa_radio_set.html.erb
rename to app/views/examples/form_builder/v1/_cfa_radio_set.html.erb
diff --git a/app/views/examples/form_builder/_cfa_radio_set_with_follow_up.html.erb b/app/views/examples/form_builder/v1/_cfa_radio_set_with_follow_up.html.erb
similarity index 100%
rename from app/views/examples/form_builder/_cfa_radio_set_with_follow_up.html.erb
rename to app/views/examples/form_builder/v1/_cfa_radio_set_with_follow_up.html.erb
diff --git a/app/views/examples/form_builder/_cfa_range_field.html.erb b/app/views/examples/form_builder/v1/_cfa_range_field.html.erb
similarity index 100%
rename from app/views/examples/form_builder/_cfa_range_field.html.erb
rename to app/views/examples/form_builder/v1/_cfa_range_field.html.erb
diff --git a/app/views/examples/form_builder/_cfa_select.html.erb b/app/views/examples/form_builder/v1/_cfa_select.html.erb
similarity index 100%
rename from app/views/examples/form_builder/_cfa_select.html.erb
rename to app/views/examples/form_builder/v1/_cfa_select.html.erb
diff --git a/app/views/examples/form_builder/_cfa_single_tap_button.html.erb b/app/views/examples/form_builder/v1/_cfa_single_tap_button.html.erb
similarity index 100%
rename from app/views/examples/form_builder/_cfa_single_tap_button.html.erb
rename to app/views/examples/form_builder/v1/_cfa_single_tap_button.html.erb
diff --git a/app/views/examples/form_builder/_cfa_textarea.html.erb b/app/views/examples/form_builder/v1/_cfa_textarea.html.erb
similarity index 100%
rename from app/views/examples/form_builder/_cfa_textarea.html.erb
rename to app/views/examples/form_builder/v1/_cfa_textarea.html.erb
diff --git a/app/views/examples/form_builder/v2/_cfa_text_input.html.erb b/app/views/examples/form_builder/v2/_cfa_text_input.html.erb
new file mode 100644
index 00000000..17204c53
--- /dev/null
+++ b/app/views/examples/form_builder/v2/_cfa_text_input.html.erb
@@ -0,0 +1,9 @@
+<%= fields_for(:form, @form, builder: Cfa::Styleguide::CfaV2FormBuilder) do |f| %>
+ <%= f.cfa_text_input(:example_method_name, 'Example input') %>
+ <%= f.cfa_text_input(:example_method_name, 'Example input (required)', required: true) %>
+ <%= f.cfa_text_input(:example_method_name, 'Example input with help text', help_text: "You could answer this any way you like.") %>
+ <%= f.cfa_text_input(:example_method_name, 'Example input with wrapper class', wrapper_classes: ['blue']) %>
+ <%= f.cfa_text_input(:example_method_name, 'Example input with options', options: { placeholder: 'Enter text here.' }) %>
+
+ <%= f.cfa_text_input(:example_method_with_validation, 'Example input with error') %>
+<% end %>
\ No newline at end of file
diff --git a/app/views/layouts/_sidebar_nav.html.erb b/app/views/layouts/_sidebar_nav.html.erb
index 0e3aaa23..0043c0cc 100644
--- a/app/views/layouts/_sidebar_nav.html.erb
+++ b/app/views/layouts/_sidebar_nav.html.erb
@@ -44,7 +44,8 @@
diff --git a/config/routes.rb b/config/routes.rb
index d4c27762..69b1f067 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -1,6 +1,7 @@
Cfa::Styleguide::Engine.routes.draw do
get "/styleguide" => "pages#index", as: :styleguide_main
- get "/styleguide/form-builder" => "pages#form_builder", as: :styleguide_form_builder
+ get "/styleguide/form-builder/v1" => "pages#form_builder_v1", as: :styleguide_form_builder_v1
+ get "/styleguide/form-builder/v2" => "pages#form_builder_v2", as: :styleguide_form_builder_v2
get "/styleguide/examples/*example_path" => "examples#show", as: :styleguide_example
get "/styleguide/emojis" => "pages#emojis", as: :styleguide_emojis
end
diff --git a/spec/system/pages_spec.rb b/spec/system/pages_spec.rb
index 7ab0f854..b538bf84 100644
--- a/spec/system/pages_spec.rb
+++ b/spec/system/pages_spec.rb
@@ -24,7 +24,7 @@
it "can use the CfaFormBuilder" do
visit "/cfa/styleguide"
- click_link "Form Builder"
+ click_link "Form Builder V1"
expect(page).to have_content("Example input")
expect(page).to have_content("Example textarea")
@@ -37,4 +37,20 @@
expect(page).to have_content("Example radio set with follow up")
expect(page).to have_content("Example select")
end
+
+ it "can use the CfaFormV2Builder" do
+ visit "/cfa/styleguide"
+ click_link "Form Builder V2"
+
+ expect(page).to have_content("CfAV2FormBuilder")
+ # expect(page).to have_content("Example textarea")
+ # expect(page).to have_content("Example range")
+ # expect(page).to have_content("Example date select")
+ #
+ # expect(page).to have_content("Example choice 1")
+ # expect(page).to have_content("Example choice 2")
+ # expect(page).to have_content("Example radio set (regular)")
+ # expect(page).to have_content("Example radio set with follow up")
+ # expect(page).to have_content("Example select")
+ end
end