view_component 1.16.0

data/Rakefile

@@ -0,0 +1,12 @@
+# frozen_string_literal: true
+
+require "bundler/gem_tasks"
+require "rake/testtask"
+
+Rake::TestTask.new(:test) do |t|
+  t.libs << "test"
+  t.libs << "lib"
+  t.test_files = FileList["test/**/*_test.rb"]
+end
+
+task default: :test

data/app/controllers/rails/components_controller.rb

@@ -0,0 +1,65 @@
+# frozen_string_literal: true
+
+require "rails/application_controller"
+
+class Rails::ComponentsController < Rails::ApplicationController # :nodoc:
+  prepend_view_path File.expand_path("../../../lib/railties/lib/rails/templates/rails", __dir__)
+  prepend_view_path "#{Rails.root}/app/views/" if defined?(Rails.root)
+
+  around_action :set_locale, only: :previews
+  before_action :find_preview, only: :previews
+  before_action :require_local!, unless: :show_previews?
+
+  if respond_to?(:content_security_policy)
+    content_security_policy(false)
+  end
+
+  def index
+    @previews = ViewComponent::Preview.all
+    @page_title = "Component Previews"
+    # rubocop:disable GitHub/RailsControllerRenderPathsExist
+    render "components/index"
+    # rubocop:enable GitHub/RailsControllerRenderPathsExist
+  end
+
+  def previews
+    if params[:path] == @preview.preview_name
+      @page_title = "Component Previews for #{@preview.preview_name}"
+      # rubocop:disable GitHub/RailsControllerRenderPathsExist
+      render "components/previews"
+      # rubocop:enable GitHub/RailsControllerRenderPathsExist
+    else
+      @example_name = File.basename(params[:path])
+      @render_args = @preview.render_args(@example_name)
+      layout = @render_args[:layout]
+      opts = layout.nil? ? {} : { layout: layout }
+      # rubocop:disable GitHub/RailsControllerRenderPathsExist
+      render "components/preview", **opts
+      # rubocop:enable GitHub/RailsControllerRenderPathsExist
+    end
+  end
+
+  private
+
+  def show_previews? # :doc:
+    ViewComponent::Base.show_previews
+  end
+
+  def find_preview # :doc:
+    candidates = []
+    params[:path].to_s.scan(%r{/|$}) { candidates << $` }
+    preview = candidates.detect { |candidate| ViewComponent::Preview.exists?(candidate) }
+
+    if preview
+      @preview = ViewComponent::Preview.find(preview)
+    else
+      raise AbstractController::ActionNotFound, "Component preview '#{params[:path]}' not found"
+    end
+  end
+
+  def set_locale
+    I18n.with_locale(params[:locale] || I18n.default_locale) do
+      yield
+    end
+  end
+end

data/docs/case-studies/jellyswitch.md

@@ -0,0 +1,76 @@
+Name: Dave Paola
+
+Github Handle: [@dpaola2](https://github.com/dpaola2)
+
+[Jellyswitch](https://www.jellyswitch.com) is a coworking space management platform
+
+In response to [this tweet](https://twitter.com/joelhawksley/status/1232674647327547394):
+
+I recently began refactoring many of my partials into components. Along the way I discovered an interesting use case, which was to componentize the various bootstrap components I was already using.
+
+Some examples:
+
+- I've componentized the specific layout that I've designed using the grid system. I have defined a `FullWidthLayout` component that wraps its contents in the correct classes to give my layout a good design on both mobile and desktop. (On desktop, there is a sidebar, and on mobile, the sidebar floats on top in a collapsed fashion.)
+- [Modals](https://getbootstrap.com/docs/4.4/components/modal/) are now componentized and accept arguments. I had them as partials before, but having ruby classes is an upgrade.
+- [Breadcrumbs](https://getbootstrap.com/docs/4.4/components/breadcrumb/) same as above.
+
+Here's one that I use a LOT: `OnOffSwitch`:
+
+```ruby
+class OnOffSwitch < ApplicationComponent
+  def initialize(predicate:, path:, disabled: false, label: nil)
+    @predicate = predicate
+    @path = path
+    @disabled = disabled
+    @label = label
+  end
+
+  private
+
+  attr_reader :predicate, :path, :disabled, :label
+  
+  def icon_class
+    if predicate
+      "fas fa-toggle-on"
+    else
+      "fas fa-toggle-off"
+    end
+  end
+end
+```
+
+```erb
+<div class="d-flex align-items-center">
+  <% if !disabled %>
+    <%= link_to path, class: "text-body", remote: true do %>
+      <span style="font-size: 20pt">
+        <% if predicate %>
+          <span class="text-success">
+            <i class="<%= icon_class %>"></i>
+          </span>
+        <% else %>
+          <span class="text-danger">
+            <i class="<%= icon_class %>"></i>
+          </span>
+        <% end %>
+      </span>
+    <% end %>
+  <% else %>
+    <span style="font-size: 20pt">
+      <span class="text-muted">
+        <i class="<%= icon_class %>"></i>
+      </span>
+    </span>
+  <% end %>
+  &nbsp;
+  <%= content %>
+</div>
+```
+
+Here is an example of how this looks:
+
+<img width="653" alt="Screenshot 2020-02-26 08 34 07" src="https://user-images.githubusercontent.com/150509/75365920-cbfb9500-5872-11ea-8234-f1343629a462.png">
+
+I have found that refactoring complex views is made easier and faster by first putting them into a component, extracting the conditionals and other logic into private methods and proceeding from there. And I wind up with a very nice set of well-factored components and sub-components, with argument lists and validations and so on. I think the rails community is really going to benefit from this library, and I'm hugely appreciative of y'all's efforts on it!
+
+I plan to release an early version of the bootstrap components we've developed at some point in the near future. I would love to collaborate and learn the most appropriate way to structure that contribution.

data/lib/action_view/component.rb

@@ -0,0 +1,4 @@
+# frozen_string_literal: true
+
+require "active_model"
+require "view_component"

data/lib/action_view/component/base.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+module ActionView
+  module Component
+    class Base < ViewComponent::Base
+      include ActiveModel::Validations
+
+      def before_render_check
+        validate!
+      end
+    end
+  end
+end

data/lib/action_view/component/preview.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+module ActionView
+  module Component # :nodoc:
+    class Preview < ViewComponent::Preview
+    end
+  end
+end

data/lib/action_view/component/railtie.rb

@@ -0,0 +1,3 @@
+# frozen_string_literal: true
+
+require "view_component/engine"

data/lib/action_view/component/test_case.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module ActionView
+  module Component
+    class TestCase
+      include ActionView::Component::TestHelpers
+    end
+  end
+end

data/lib/action_view/component/test_helpers.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+module ActionView
+  module Component
+    module TestHelpers
+      include ViewComponent::TestHelpers
+
+      def render_component(component, **args, &block)
+        ActiveSupport::Deprecation.warn(
+          "`render_component` has been deprecated in favor of `render_inline`, and will be removed in v2.0.0."
+        )
+
+        render_inline(component, args, &block)
+      end
+    end
+  end
+end

data/lib/rails/generators/component/USAGE

@@ -0,0 +1,13 @@
+Description:
+============
+    Creates a new component and test.
+    Pass the component name, either CamelCased or under_scored, and an optional list of attributes as arguments.
+
+Example:
+========
+    bin/rails generate component Profile name age
+
+    creates a Profile component and test:
+        Component:    app/components/profile_component.rb
+        Template:     app/components/profile_component.html.erb
+        Test:         test/components/profile_component_test.rb

data/lib/rails/generators/component/component_generator.rb

@@ -0,0 +1,44 @@
+# frozen_string_literal: true
+
+module Rails
+  module Generators
+    class ComponentGenerator < Rails::Generators::NamedBase
+      source_root File.expand_path("templates", __dir__)
+
+      argument :attributes, type: :array, default: [], banner: "attribute"
+      check_class_collision suffix: "Component"
+
+      def create_component_file
+        template "component.rb", File.join("app/components", class_path, "#{file_name}_component.rb")
+      end
+
+      hook_for :test_framework
+
+      hook_for :template_engine do |instance, template_engine|
+        instance.invoke template_engine, [instance.name]
+      end
+
+      private
+
+      def file_name
+        @_file_name ||= super.sub(/_component\z/i, "")
+      end
+
+      def parent_class
+        defined?(ApplicationComponent) ? "ApplicationComponent" : "ViewComponent::Base"
+      end
+
+      def initialize_signature
+        if attributes.present?
+          attributes.map { |attr| "#{attr.name}:" }.join(", ")
+        else
+          "*"
+        end
+      end
+
+      def initialize_body
+        attributes.map { |attr| "@#{attr.name} = #{attr.name}" }.join("\n    ")
+      end
+    end
+  end
+end

data/lib/rails/generators/component/templates/component.rb.tt

@@ -0,0 +1,5 @@
+class <%= class_name %>Component < <%= parent_class %>
+  def initialize(<%= initialize_signature %>)
+    <%= initialize_body %>
+  end
+end

data/lib/rails/generators/erb/component_generator.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+require "rails/generators/erb"
+
+module Erb
+  module Generators
+    class ComponentGenerator < Base
+      source_root File.expand_path("templates", __dir__)
+
+      def copy_view_file
+        template "component.html.erb", File.join("app/components", class_path, "#{file_name}_component.html.erb")
+      end
+
+      private
+
+      def file_name
+        @_file_name ||= super.sub(/_component\z/i, "")
+      end
+    end
+  end
+end

data/lib/rails/generators/erb/templates/component.html.erb.tt

@@ -0,0 +1 @@
+<div>Add <%= class_name %> template here</div>

data/lib/rails/generators/haml/component_generator.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+require "rails/generators/erb/component_generator"
+
+module Haml
+  module Generators
+    class ComponentGenerator < Erb::Generators::ComponentGenerator
+      source_root File.expand_path("templates", __dir__)
+
+      def copy_view_file
+        template "component.html.haml", File.join("app/components", class_path, "#{file_name}_component.html.haml")
+      end
+
+      private
+
+      def file_name
+        @_file_name ||= super.sub(/_component\z/i, "")
+      end
+    end
+  end
+end

data/lib/rails/generators/haml/templates/component.html.haml.tt

@@ -0,0 +1 @@
+%div Add <%= class_name %> template here

data/lib/rails/generators/rspec/component_generator.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+module Rspec
+  module Generators
+    class ComponentGenerator < ::Rails::Generators::NamedBase
+      source_root File.expand_path("templates", __dir__)
+
+      def create_test_file
+        template "component_spec.rb", File.join("spec/components", class_path, "#{file_name}_component_spec.rb")
+      end
+
+      private
+
+      def file_name
+        @_file_name ||= super.sub(/_component\z/i, "")
+      end
+    end
+  end
+end

data/lib/rails/generators/rspec/templates/component_spec.rb.tt

@@ -0,0 +1,13 @@
+require "rails_helper"
+
+RSpec.describe <%= class_name %>Component, type: :component do
+  pending "add some examples to (or delete) #{__FILE__}"
+
+  # it "renders something useful" do
+  #   expect(
+  #     render_inline(described_class.new(attr: "value")) { "Hello, components!" }.css("p").to_html
+  #   ).to include(
+  #     "Hello, components!"
+  #   )
+  # end
+end

data/lib/rails/generators/slim/component_generator.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+require "rails/generators/erb/component_generator"
+
+module Slim
+  module Generators
+    class ComponentGenerator < Erb::Generators::ComponentGenerator
+      source_root File.expand_path("templates", __dir__)
+
+      def copy_view_file
+        template "component.html.slim", File.join("app/components", class_path, "#{file_name}_component.html.slim")
+      end
+
+      private
+
+      def file_name
+        @_file_name ||= super.sub(/_component\z/i, "")
+      end
+    end
+  end
+end

data/lib/rails/generators/slim/templates/component.html.slim.tt

@@ -0,0 +1 @@
+div Add <%= class_name %> template here

data/lib/rails/generators/test_unit/component_generator.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+module TestUnit
+  module Generators
+    class ComponentGenerator < ::Rails::Generators::NamedBase
+      source_root File.expand_path("templates", __dir__)
+      check_class_collision suffix: "ComponentTest"
+
+      def create_test_file
+        template "component_test.rb", File.join("test/components", class_path, "#{file_name}_component_test.rb")
+      end
+
+      private
+
+      def file_name
+        @_file_name ||= super.sub(/_component\z/i, "")
+      end
+    end
+  end
+end

data/lib/rails/generators/test_unit/templates/component_test.rb.tt

@@ -0,0 +1,10 @@
+require "test_helper"
+
+class <%= class_name %>ComponentTest < ViewComponent::TestCase
+  test "component renders something useful" do
+    # assert_equal(
+    #   %(<span>Hello, components!</span>),
+    #   render_inline(<%= class_name %>Component.new(message: "Hello, components!")).css("span").to_html
+    # )
+  end
+end

data/lib/railties/lib/rails.rb

@@ -0,0 +1,5 @@
+# frozen_string_literal: true
+
+module Rails
+  autoload :ComponentsController
+end