view_component 2.16.0 → 2.18.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 9ccdcdb195fbc49953c3663294a7345eb012f88344d1375456a07c6ef781b1d8
-  data.tar.gz: b2cf7cb1139e318f2ca7712242e610c31a42c78448a5d3151db1550a41e00355
+  metadata.gz: a2198b33fb53185423a45c6f13023650604e7dacc2f5b44c2455f44b684ffdbc
+  data.tar.gz: f9eaffd030eb7bef12b243cfdf42333e4f5b28bf6a975f6b4720b65ef0d6aedc
 SHA512:
-  metadata.gz: 72657816a14d62166791f37d2f83cfd81efe8f186678bcf21e40c50d38d64663fbc4e2b9fe881820ba26f2a7ea258d5d6c0cb47a73132d5443f66db3489d1921
-  data.tar.gz: e7abe1071862dfb3208e2615176fd352b0f6cd6e7ef947b1dfb4528e435682908cd01ab8091b33612b234eebf7121a7dd00e5cb8890bc6ae1160fdf5bcbdcd3f
+  metadata.gz: 9ab6f420e32b85e912b4407ab3679e3fd696800547aecaa13c15c7833c82564f7ba8bc7db4fad8dbd7aa201250db156901486ee3c12b13f37ffedca3e5cbacf1
+  data.tar.gz: 22103cb47921ba57712808c6a3130f48926a40179a3564fab9b2235dc892edde3ed81df28e6c23535685d13121b4be1f232836612e7132d4be04143595eebb6d

data/CHANGELOG.md

@@ -1,5 +1,47 @@
 # master
 
+# 2.18.2
+
+* Raise an error if controller or view context is accessed during initialize as they are only available in render.
+
+    *Julian Nadeau*
+
+* Collate test coverage across CI builds, ensuring 100% test coverage.
+
+    *Joel Hawksley*
+
+# 2.18.1
+
+* Fix bug where previews didn't work when monkey patch was disabled.
+
+    *Mixer Gutierrez*
+
+# 2.18.0
+
+* Fix auto-loading of previews (changes no longer require a server restart)
+
+    *Matt Brictson*
+
+* Add `default_preview_layout` configuration option to load custom app/views/layouts.
+
+    *Jared White, Juan Manuel Ramallo*
+
+* Calculate virtual_path once for all instances of a component class to improve performance.
+
+    *Brad Parker*
+
+# 2.17.1
+
+* Fix bug where rendering Slot with empty block resulted in error.
+
+    *Joel Hawksley*
+
+# 2.17.0
+
+* Slots return stripped HTML, removing leading and trailing whitespace.
+
+    *Jason Long, Joel Hawksley*
+
 # 2.16.0
 
 * Add `--sidecar` option to the erb, haml and slim generators. Places the generated template in the sidecar directory.

data/README.md

@@ -47,6 +47,10 @@ Traditional Rails views have an implicit interface, making it hard to reason abo
 
 ViewComponents use a standard Ruby initializer that clearly defines what is needed to render, making them easier (and safer) to reuse than partials.
 
+#### Performance
+
+Based on our [benchmarks](performance/benchmark.rb), ViewComponents are ~10x faster than partials.
+
 #### Standards
 
 Views often fail basic Ruby code quality standards: long methods, deep conditional nesting, and mystery guests abound.
@@ -164,19 +168,17 @@ Returning:
 
 _Slots are currently under development as a successor to Content Areas. The Slot APIs should be considered unfinished and subject to breaking changes in non-major releases of ViewComponent._
 
-Slots enable multiple blocks of content to be passed to a single ViewComponent.
+Slots enable multiple blocks of content to be passed to a single ViewComponent, reducing the need for sub-components (e.g. ModalHeader, ModalBody).
 
-Slots exist in two forms: normal slots and collection slots.
+By default, slots can be rendered once per component. They provide an accessor with the name of the slot (`#header`) that returns an instance of `ViewComponent::Slot`, etc.
 
-Normal slots can be rendered once per component. They expose an accessor with the name of the slot that returns an instance of `ViewComponent::Slot`, etc.
+Slots declared with `collection: true` can be rendered multiple times. They provide an accessor with the pluralized name of the slot (`#rows`), which is an Array of `ViewComponent::Slot` instances.
 
-Collection slots can be rendered multiple times. They expose an accessor with the pluralized name of the slot (`#rows`), which is an Array of `ViewComponent::Slot` instances.
-
-To learn more about the design of the Slots API, see https://github.com/github/view_component/pull/348.
+To learn more about the design of the Slots API, see https://github.com/github/view_component/pull/348 and https://github.com/github/view_component/discussions/325.
 
 ##### Defining Slots
 
-Slots are defined by the `with_slot` macro:
+Slots are defined by `with_slot`:
 
 `with_slot :header`
 
@@ -184,11 +186,11 @@ To define a collection slot, add `collection: true`:
 
 `with_slot :row, collection: true`
 
-To define a slot with a custom class, pass `class_name`:
+To define a slot with a custom Ruby class, pass `class_name`:
 
 `with_slot :body, class_name: 'BodySlot`
 
-Slot classes should be subclasses of `ViewComponent::Slot`.
+_Note: Slot classes must be subclasses of `ViewComponent::Slot`._
 
 ##### Example ViewComponent with Slots
 
@@ -202,12 +204,12 @@ class BoxComponent < ViewComponent::Base
   with_slot :row, collection: true, class_name: "Row"
 
   class Header < ViewComponent::Slot
-    def initialize(class_names: "")
-      @class_names = class_names
+    def initialize(classes: "")
+      @classes = classes
     end
 
-    def class_names
-      "Box-header #{@class_names}"
+    def classes
+      "Box-header #{@classes}"
     end
   end
 
@@ -240,7 +242,7 @@ end
 ```erb
 <div class="Box">
   <% if header %>
-    <div class="<%= header.class_names %>">
+    <div class="<%= header.classes %>">
       <%= header.content %>
     </div>
   <% end %>
@@ -260,7 +262,7 @@ end
   <% end %>
   <% if footer %>
     <div class="Box-footer">
-      <%= footer %>
+      <%= footer.content %>
     </div>
   <% end %>
 </div>
@@ -269,7 +271,7 @@ end
 `# index.html.erb`
 ```erb
 <%= render(BoxComponent.new) do |component| %>
-  <% component.slot(:header, class_names: "my-class-name") do %>
+  <% component.slot(:header, classes: "my-class-name") do %>
     This is my header!
   <% end %>
   <% component.slot(:body) do %>
@@ -360,6 +362,32 @@ bin/rails generate component Example title content --sidecar
       create  app/components/example_component/example_component.html.erb
 ```
 
+#### Component file inside Sidecar directory
+
+It's also possible to place the Ruby component file inside the sidecar directory, grouping all related files in the same folder:
+
+_Note: Avoid giving your containing folder the same name as your `.rb` file or there will be a conflict between Module and Class definitions_
+
+```
+app/components
+├── ...
+├── example
+|   ├── component.rb
+|   ├── component.css
+|   ├── component.html.erb
+|   └── component.js
+├── ...
+
+```
+
+The component can then be rendered using the folder name as a namespace:
+
+```erb
+<%= render(Example::Component.new(title: "my title")) do %>
+  Hello, World!
+<% end %>
+```
+
 ### Conditional Rendering
 
 Components can implement a `#render?` method to be called after initialization to determine if the component should render.
@@ -674,6 +702,14 @@ class TestComponentPreview < ViewComponent::Preview
 end
 ```
 
+You can also set a custom layout to be used by default for previews as well as the preview index pages via the `default_preview_layout` configuration option:
+
+`config/application.rb`
+```ruby
+# Set the default layout to app/views/layouts/component_preview.html.erb
+config.view_component.default_preview_layout = "component_preview"
+```
+
 Preview classes live in `test/components/previews`, which can be configured using the `preview_paths` option:
 
 `config/application.rb`
@@ -990,10 +1026,15 @@ ViewComponent is built by:
 |@maxbeizer|@franco|@tbroad-ramsey|@jensljungblad|@bbugh|
 |Nashville, TN|Switzerland|Spring Hill, TN|New York, NY|Austin, TX|
 
-|<img src="https://avatars.githubusercontent.com/johannesengl?s=256" alt="johannesengl" width="128" />|<img src="https://avatars.githubusercontent.com/czj?s=256" alt="czj" width="128" />|<img src="https://avatars.githubusercontent.com/mrrooijen?s=256" alt="mrrooijen" width="128" />|
-|:---:|:---:|:---:|
-|@johannesengl|@czj|@mrrooijen|
-|Berlin, Germany|Paris, France|The Netherlands|
+|<img src="https://avatars.githubusercontent.com/johannesengl?s=256" alt="johannesengl" width="128" />|<img src="https://avatars.githubusercontent.com/czj?s=256" alt="czj" width="128" />|<img src="https://avatars.githubusercontent.com/mrrooijen?s=256" alt="mrrooijen" width="128" />|<img src="https://avatars.githubusercontent.com/bradparker?s=256" alt="bradparker" width="128" />|<img src="https://avatars.githubusercontent.com/mattbrictson?s=256" alt="mattbrictson" width="128" />|
+|:---:|:---:|:---:|:---:|:---:|
+|@johannesengl|@czj|@mrrooijen|@bradparker|@mattbrictson|
+|Berlin, Germany|Paris, France|The Netherlands|Brisbane, Australia|San Francisco|
+
+|<img src="https://avatars.githubusercontent.com/mixergtz?s=256" alt="mixergtz" width="128" />|<img src="https://avatars.githubusercontent.com/jules2689?s=256" alt="jules2689" width="128" />|
+|:---:|:---:|
+|@mixergtz|@jules2689|
+|Medellin, Colombia|Toronto, Canada|
 
 ## License
 

data/app/controllers/view_components_controller.rb

@@ -16,22 +16,23 @@ class ViewComponentsController < Rails::ApplicationController # :nodoc:
   def index
     @previews = ViewComponent::Preview.all
     @page_title = "Component Previews"
+    render "view_components/index", **determine_layout
   end
 
   def previews
     if params[:path] == @preview.preview_name
       @page_title = "Component Previews for #{@preview.preview_name}"
-      render "view_components/previews"
+      render "view_components/previews", **determine_layout
     else
       prepend_application_view_paths
       prepend_preview_examples_view_path
       @example_name = File.basename(params[:path])
       @render_args = @preview.render_args(@example_name, params: params.permit!)
-      layout = @render_args[:layout]
+      layout = determine_layout(@render_args[:layout], prepend_views: false)[:layout]
       template = @render_args[:template]
       locals = @render_args[:locals]
       opts = {}
-      opts[:layout] = layout if layout.present?
+      opts[:layout] = layout if layout.present? || layout == false
       opts[:locals] = locals if locals.present?
       render template, opts # rubocop:disable GitHub/RailsControllerRenderLiteral
     end
@@ -39,6 +40,10 @@ class ViewComponentsController < Rails::ApplicationController # :nodoc:
 
   private
 
+  def default_preview_layout # :doc:
+    ViewComponent::Base.default_preview_layout
+  end
+
   def show_previews? # :doc:
     ViewComponent::Base.show_previews
   end
@@ -61,6 +66,24 @@ class ViewComponentsController < Rails::ApplicationController # :nodoc:
     end
   end
 
+  # Returns either {} or {layout: value} depending on configuration
+  def determine_layout(layout_override = nil, prepend_views: true)
+    return {} unless defined?(Rails.root)
+
+    layout_declaration = {}
+
+    if !layout_override.nil?
+      # Allow component-level override, even if false (thus no layout rendered)
+      layout_declaration[:layout] = layout_override
+    elsif default_preview_layout.present?
+      layout_declaration[:layout] = default_preview_layout
+    end
+
+    prepend_application_view_paths if layout_declaration[:layout].present? && prepend_views
+
+    layout_declaration
+  end
+
   def prepend_application_view_paths
     prepend_view_path Rails.root.join("app/views") if defined?(Rails.root)
   end

data/app/views/view_components/preview.html.erb

@@ -1 +1,5 @@
-<%= render(@render_args[:component], @render_args[:args], &@render_args[:block])%>
+<% if ViewComponent::Base.render_monkey_patch_enabled || Rails.version.to_f >= 6.1 %>
+  <%= render(@render_args[:component], @render_args[:args], &@render_args[:block])%>
+<% else %>
+  <%= render_component(@render_args[:component], &@render_args[:block])%>
+<% end %>

data/lib/view_component/base.rb

@@ -12,6 +12,8 @@ module ViewComponent
     include ActiveSupport::Configurable
     include ViewComponent::Previewable
 
+    ViewContextCalledBeforeRenderError = Class.new(StandardError)
+
     # For CSRF authenticity tokens in forms
     delegate :form_authenticity_token, :protect_against_forgery?, :config, to: :helpers
 
@@ -108,17 +110,19 @@ module ViewComponent
     end
 
     def controller
+      raise ViewContextCalledBeforeRenderError, "`controller` can only be called at render time." if view_context.nil?
       @controller ||= view_context.controller
     end
 
     # Provides a proxy to access helper methods from the context of the current controller
     def helpers
+      raise ViewContextCalledBeforeRenderError, "`helpers` can only be called at render time." if view_context.nil?
       @helpers ||= controller.view_context
     end
 
-    # Removes the first part of the path and the extension.
+    # Exposes .virutal_path as an instance method
     def virtual_path
-      self.class.source_location.gsub(%r{(.*app/components)|(\.rb)}, "")
+      self.class.virtual_path
     end
 
     # For caching, such as #cache_if
@@ -166,7 +170,7 @@ module ViewComponent
     mattr_accessor :render_monkey_patch_enabled, instance_writer: false, default: true
 
     class << self
-      attr_accessor :source_location
+      attr_accessor :source_location, :virtual_path
 
       # Render a component collection.
       def with_collection(collection, **args)
@@ -189,6 +193,9 @@ module ViewComponent
         # has been re-defined by the consuming application, likely in ApplicationComponent.
         child.source_location = caller_locations(1, 10).reject { |l| l.label == "inherited" }[0].absolute_path
 
+        # Removes the first part of the path and the extension.
+        child.virtual_path = child.source_location.gsub(%r{(.*app/components)|(\.rb)}, "")
+
         # Clone slot configuration into child class
         # see #test_slots_pollution
         child.slots = self.slots.clone
@@ -378,17 +385,17 @@ module ViewComponent
 
         location_without_extension = source_location.chomp(File.extname(source_location))
 
-        extenstions = ActionView::Template.template_handler_extensions.join(",")
+        extensions = ActionView::Template.template_handler_extensions.join(",")
 
-        # view files in the same directory as te component
-        sidecar_files = Dir["#{location_without_extension}.*{#{extenstions}}"]
+        # view files in the same directory as the component
+        sidecar_files = Dir["#{location_without_extension}.*{#{extensions}}"]
 
         # view files in a directory named like the component
         directory = File.dirname(source_location)
         filename = File.basename(source_location, ".rb")
         component_name = name.demodulize.underscore
 
-        sidecar_directory_files = Dir["#{directory}/#{component_name}/#{filename}.*{#{extenstions}}"]
+        sidecar_directory_files = Dir["#{directory}/#{component_name}/#{filename}.*{#{extensions}}"]
 
         (sidecar_files - [source_location] + sidecar_directory_files)
       end

data/lib/view_component/engine.rb

@@ -34,8 +34,8 @@ module ViewComponent
     initializer "view_component.set_autoload_paths" do |app|
       options = app.config.view_component
 
-      if options.show_previews && options.preview_path
-        ActiveSupport::Dependencies.autoload_paths << options.preview_path
+      if options.show_previews && !options.preview_paths.empty?
+        ActiveSupport::Dependencies.autoload_paths.concat(options.preview_paths)
       end
     end
 

data/lib/view_component/preview.rb

@@ -24,6 +24,8 @@ module ViewComponent # :nodoc:
       }
     end
 
+    alias_method :render_component, :render
+
     class << self
       # Returns all component preview classes.
       def all
@@ -42,21 +44,11 @@ module ViewComponent # :nodoc:
         result.merge(layout: @layout)
       end
 
-      # Returns the component object class associated to the preview.
-      def component
-        name.chomp("Preview").constantize
-      end
-
       # Returns all of the available examples for the component preview.
       def examples
         public_instance_methods(false).map(&:to_s).sort
       end
 
-      # Returns +true+ if the example of the component preview exists.
-      def example_exists?(example)
-        examples.include?(example)
-      end
-
       # Returns +true+ if the preview exists.
       def exists?(preview)
         all.any? { |p| p.preview_name == preview }
@@ -102,10 +94,6 @@ module ViewComponent # :nodoc:
       def preview_paths
         Base.preview_paths
       end
-
-      def show_previews
-        Base.show_previews
-      end
     end
   end
 end

data/lib/view_component/previewable.rb

@@ -7,6 +7,14 @@ module ViewComponent # :nodoc:
     extend ActiveSupport::Concern
 
     included do
+      # Set a custom default preview layout through app configuration:
+      #
+      #     config.view_component.default_preview_layout = "component_preview"
+      #
+      # This affects preview index pages as well as individual component previews
+      #
+      mattr_accessor :default_preview_layout, instance_writer: false
+
       # Set the location of component previews through app configuration:
       #
       #     config.view_component.preview_paths << "#{Rails.root}/lib/component_previews"

data/lib/view_component/slotable.rb

@@ -98,7 +98,7 @@ module ViewComponent
       slot_instance = args.present? ? slot_class.new(**args) : slot_class.new
 
       # Capture block and assign to slot_instance#content
-      slot_instance.content = view_context.capture(&block) if block_given?
+      slot_instance.content = view_context.capture(&block).to_s.strip.html_safe if block_given?
 
       if slot[:collection]
         # Initialize instance variable as an empty array

data/lib/view_component/test_helpers.rb

@@ -14,7 +14,11 @@ module ViewComponent
         assert_no_selector("body")
       end
     rescue LoadError
+      # We don't have a test case for running an application without capybara installed.
+      # It's probably fine to leave this without coverage.
+      # :nocov:
       warn "WARNING in `ViewComponent::TestHelpers`: You must add `capybara` to your Gemfile to use Capybara assertions." if ENV["DEBUG"]
+      # :nocov:
     end
 
     attr_reader :rendered_component

data/lib/view_component/version.rb

@@ -3,8 +3,8 @@
 module ViewComponent
   module VERSION
     MAJOR = 2
-    MINOR = 16
-    PATCH = 0
+    MINOR = 18
+    PATCH = 2
 
     STRING = [MAJOR, MINOR, PATCH].join(".")
   end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: view_component
 version: !ruby/object:Gem::Version
-  version: 2.16.0
+  version: 2.18.2
 platform: ruby
 authors:
 - GitHub Open Source
-autorequire: 
+autorequire:
 bindir: bin
 cert_chain: []
-date: 2020-07-15 00:00:00.000000000 Z
+date: 2020-09-09 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: activesupport
@@ -30,6 +30,20 @@ dependencies:
     - - "<"
       - !ruby/object:Gem::Version
         version: '7.0'
+- !ruby/object:Gem::Dependency
+  name: benchmark-ips
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 2.8.2
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 2.8.2
 - !ruby/object:Gem::Dependency
   name: bundler
   requirement: !ruby/object:Gem::Requirement
@@ -157,20 +171,20 @@ dependencies:
       - !ruby/object:Gem::Version
         version: 0.18.0
 - !ruby/object:Gem::Dependency
-  name: simplecov-erb
+  name: simplecov-console
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '0.1'
+        version: 0.7.2
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '0.1'
-description: 
+        version: 0.7.2
+description:
 email:
 - opensource+view_component@github.com
 executables: []
@@ -222,7 +236,7 @@ licenses:
 - MIT
 metadata:
   allowed_push_host: https://rubygems.org
-post_install_message: 
+post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -238,7 +252,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubygems_version: 3.1.2
-signing_key: 
+signing_key:
 specification_version: 4
 summary: View components for Rails
 test_files: []