Add form examples and a preview server for forms

Author: bradgessler

.gitignore

@@ -9,3 +9,7 @@
 
 # rspec failure tracking
 .rspec_status
+
+# Log files
+log/
+*.log

README.md

@@ -508,6 +508,12 @@ https://www.ruby-toolbox.com/projects/formtastic
 
 After checking out the repo, run `bin/setup` to install dependencies. Then, run `rake spec` to run the tests. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
 
+To preview example forms in your browser, run:
+
+    $ bin/preview
+
+This boots a local Rails server at http://localhost:3000 that displays all forms in the `examples/` directory. The server supports hot-reloading, so you can edit forms and refresh the page to see changes.
+
 To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and the created tag, and push the `.gem` file to [rubygems.org](https://rubygems.org).
 
 ## Contributing

bin/preview

@@ -0,0 +1,8 @@
+#!/usr/bin/env ruby
+# frozen_string_literal: true
+
+# Boot the Superform examples server
+# Run with: bin/superform
+
+require_relative "../server/rails"
+start

examples/basic_form.rb

@@ -0,0 +1,21 @@
+class BasicForm < ExampleForm
+  def self.description = <<~HTML
+    <p>Common input types: <code>text</code>, <code>email</code>, <code>password</code>, and <code>number</code>.</p>
+  HTML
+
+  def view_template
+    render field(:name).label
+    render field(:name).text(placeholder: "Your name")
+
+    render field(:email).label
+    render field(:email).email(placeholder: "you@example.com")
+
+    render field(:password).label
+    render field(:password).password
+
+    render field(:age).label
+    render field(:age).number(min: 0, max: 150)
+
+    render submit("Save")
+  end
+end

examples/checkbox_form.rb

@@ -0,0 +1,28 @@
+class CheckboxForm < ExampleForm
+  def self.description = <<~HTML
+    <p><code>checkbox</code> inputs with labels inside a fieldset.</p>
+  HTML
+
+  def view_template
+    fieldset do
+      legend { "Preferences" }
+
+      label do
+        render field(:terms_accepted).checkbox
+        plain " I accept the terms"
+      end
+
+      label do
+        render field(:subscribe).checkbox
+        plain " Subscribe to newsletter"
+      end
+
+      label do
+        render field(:featured).checkbox
+        plain " Feature this item"
+      end
+    end
+
+    render submit("Continue")
+  end
+end

examples/date_time_form.rb

@@ -0,0 +1,18 @@
+class DateTimeForm < ExampleForm
+  def self.description = <<~HTML
+    <p><code>date</code>, <code>time</code>, and <code>datetime</code> input types.</p>
+  HTML
+
+  def view_template
+    render field(:birth_date).label
+    render field(:birth_date).date
+
+    render field(:appointment_time).label
+    render field(:appointment_time).time
+
+    render field(:event_datetime).label
+    render field(:event_datetime).datetime
+
+    render submit("Schedule")
+  end
+end

examples/example_form.rb

@@ -0,0 +1,10 @@
+# Base class for example forms
+class ExampleForm < Superform::Rails::Form
+  def self.name_text
+    name.gsub(/Form$/, "").gsub(/([a-z])([A-Z])/, '\1 \2')
+  end
+
+  def self.description
+    ""
+  end
+end

examples/select_form.rb

@@ -0,0 +1,26 @@
+class SelectForm < ExampleForm
+  def self.description = <<~HTML
+    <p><code>select</code> dropdowns with various option formats.</p>
+  HTML
+
+  COUNTRIES = [
+    ["United States", "us"],
+    ["Canada", "ca"],
+    ["United Kingdom", "uk"],
+    ["Germany", "de"],
+    ["Japan", "jp"]
+  ].freeze
+
+  def view_template
+    render field(:country).label
+    render field(:country).select(options: COUNTRIES, include_blank: "Choose...")
+
+    render field(:priority).label
+    render field(:priority).select(options: %w[Low Medium High])
+
+    render field(:quantity).label
+    render field(:quantity).select(options: (1..10).to_a)
+
+    render submit("Submit")
+  end
+end

examples/special_inputs_form.rb

@@ -0,0 +1,23 @@
+class SpecialInputsForm < ExampleForm
+  def self.name_text = "Special Inputs"
+
+  def self.description = <<~HTML
+    <p>HTML5 input types: <code>color</code>, <code>range</code>, <code>search</code>, and <code>file</code>.</p>
+  HTML
+
+  def view_template
+    render field(:favorite_color).label
+    render field(:favorite_color).color
+
+    render field(:volume).label
+    render field(:volume).range(min: 0, max: 100, step: 10)
+
+    render field(:search_query).label
+    render field(:search_query).search(placeholder: "Search...")
+
+    render field(:avatar).label
+    render field(:avatar).file(accept: "image/*")
+
+    render submit("Apply")
+  end
+end

examples/textarea_form.rb

@@ -0,0 +1,15 @@
+class TextareaForm < ExampleForm
+  def self.description = <<~HTML
+    <p>Text input and <code>textarea</code> for longer content.</p>
+  HTML
+
+  def view_template
+    render field(:title).label
+    render field(:title).text(placeholder: "Post title")
+
+    render field(:body).label
+    render field(:body).textarea(rows: 6, placeholder: "Write your content...")
+
+    render submit("Publish")
+  end
+end