view_component 2.20.0 → 2.23.1

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

@@ -1,3 +1,5 @@
+# frozen_string_literal: true
+
 class <%= class_name %>Component < <%= parent_class %>
 <%- if initialize_signature -%>
   def initialize(<%= initialize_signature %>)

data/lib/view_component/base.rb

@@ -6,6 +6,7 @@ require "view_component/collection"
 require "view_component/compile_cache"
 require "view_component/previewable"
 require "view_component/slotable"
+require "view_component/slotable_v2"
 
 module ViewComponent
   class Base < ActionView::Base
@@ -20,10 +21,6 @@ module ViewComponent
     class_attribute :content_areas
     self.content_areas = [] # class_attribute:default doesn't work until Rails 5.2
 
-    # Hash of registered Slots
-    class_attribute :slots
-    self.slots = {}
-
     # Entrypoint for rendering components.
     #
     # view_context: ActionView context from calling view
@@ -64,7 +61,7 @@ module ViewComponent
       @virtual_path ||= virtual_path
 
       # For template variants (+phone, +desktop, etc.)
-      @variant = @lookup_context.variants.first
+      @variant ||= @lookup_context.variants.first
 
       # For caching, such as #cache_if
       @current_template = nil unless defined?(@current_template)
@@ -99,13 +96,16 @@ module ViewComponent
 
     def initialize(*); end
 
-    # If trying to render a partial or template inside a component,
-    # pass the render call to the parent view_context.
+    # Re-use original view_context if we're not rendering a component.
+    #
+    # This prevents an exception when rendering a partial inside of a component that has also been rendered outside
+    # of the component. This is due to the partials compiled template method existing in the parent `view_context`,
+    #  and not the component's `view_context`.
     def render(options = {}, args = {}, &block)
-      if options.is_a?(String) || (options.is_a?(Hash) && options.has_key?(:partial))
-        view_context.render(options, args, &block)
-      else
+      if options.is_a? ViewComponent::Base
         super
+      else
+        view_context.render(options, args, &block)
       end
     end
 
@@ -132,7 +132,10 @@ module ViewComponent
 
     # For caching, such as #cache_if
     def format
-      @variant
+      # Ruby 2.6 throws a warning without checking `defined?`, 2.7 does not
+      if defined?(@variant)
+        @variant
+      end
     end
 
     # Assign the provided content to the content area accessor
@@ -149,6 +152,12 @@ module ViewComponent
       nil
     end
 
+    def with_variant(variant)
+      @variant = variant
+
+      self
+    end
+
     private
 
     # Exposes the current request to the component.
@@ -201,10 +210,6 @@ module ViewComponent
         # 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
-
         super
       end
 
@@ -285,7 +290,6 @@ module ViewComponent
       def provided_collection_parameter
         @provided_collection_parameter ||= nil
       end
-
     end
 
     ActiveSupport.run_load_hooks(:view_component, self)

data/lib/view_component/compiler.rb

@@ -146,21 +146,36 @@ module ViewComponent
       source_location = component_class.source_location
       return [] unless source_location
 
-      location_without_extension = source_location.chomp(File.extname(source_location))
-
       extensions = ActionView::Template.template_handler_extensions.join(",")
 
-      # 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 = component_class.name.demodulize.underscore
 
+      # Add support for nested components defined in the same file.
+      #
+      # e.g.
+      #
+      # class MyComponent < ViewComponent::Base
+      #   class MyOtherComponent < ViewComponent::Base
+      #   end
+      # end
+      #
+      # Without this, `MyOtherComponent` will not look for `my_component/my_other_component.html.erb`
+      nested_component_files = if component_class.name.include?("::")
+        nested_component_path = component_class.name.deconstantize.underscore
+        Dir["#{directory}/#{nested_component_path}/#{component_name}.*{#{extensions}}"]
+      else
+        []
+      end
+
+      # view files in the same directory as the component
+      sidecar_files = Dir["#{directory}/#{component_name}.*{#{extensions}}"]
+
       sidecar_directory_files = Dir["#{directory}/#{component_name}/#{filename}.*{#{extensions}}"]
 
-      (sidecar_files - [source_location] + sidecar_directory_files)
+      (sidecar_files - [source_location] + sidecar_directory_files + nested_component_files)
     end
 
     def inline_calls

data/lib/view_component/engine.rb

@@ -44,7 +44,7 @@ module ViewComponent
 
     initializer "view_component.eager_load_actions" do
       ActiveSupport.on_load(:after_initialize) do
-        ViewComponent::Base.descendants.each(&:compile)
+        ViewComponent::Base.descendants.each(&:compile) if Rails.application.config.eager_load
       end
     end
 

data/lib/view_component/slot_v2.rb

@@ -0,0 +1,65 @@
+# frozen_string_literal: true
+
+module ViewComponent
+  class SlotV2
+    attr_writer :_component_instance, :_content_block, :_content
+
+    def initialize(parent)
+      @parent = parent
+    end
+
+    # Used to render the slot content in the template
+    #
+    # There's currently 3 different values that may be set, that we can render.
+    #
+    # If the slot renderable is a component, the string class name of a
+    # component, or a function that returns a component, we render that
+    # component instance, returning the string.
+    #
+    # If the slot renderable is a function and returns a string, it is
+    # set as `@_content` and is returned directly.
+    #
+    # If there is no slot renderable, we evaluate the block passed to
+    # the slot and return it.
+    def to_s
+      view_context = @parent.send(:view_context)
+      view_context.capture do
+        if defined?(@_component_instance)
+          # render_in is faster than `parent.render`
+          @_component_instance.render_in(view_context, &@_content_block)
+        elsif defined?(@_content)
+          @_content
+        elsif defined?(@_content_block)
+          @_content_block.call
+        end
+      end
+    end
+
+    # Allow access to public component methods via the wrapper
+    #
+    # e.g.
+    #
+    # calling `header.name` (where `header` is a slot) will call `name`
+    # on the `HeaderComponent` instance.
+    #
+    # Where the component may look like:
+    #
+    # class MyComponent < ViewComponent::Base
+    #   has_one :header, HeaderComponent
+    #
+    #   class HeaderComponent < ViewComponent::Base
+    #     def name
+    #       @name
+    #     end
+    #   end
+    # end
+    #
+    def method_missing(symbol, *args, &block)
+      @_component_instance.public_send(symbol, *args, &block)
+    end
+
+    def respond_to_missing?(symbol, include_all = false)
+      defined?(@_component_instance) && @_component_instance.respond_to?(symbol, include_all)
+    end
+  end
+end

data/lib/view_component/slotable.rb

@@ -8,6 +8,12 @@ module ViewComponent
   module Slotable
     extend ActiveSupport::Concern
 
+    included do
+      # Hash of registered Slots
+      class_attribute :slots
+      self.slots = {}
+    end
+
     class_methods do
       # support initializing slots as:
       #
@@ -63,6 +69,14 @@ module ViewComponent
           }
         end
       end
+
+      def inherited(child)
+        # Clone slot configuration into child class
+        # see #test_slots_pollution
+        child.slots = self.slots.clone
+
+        super
+      end
     end
 
     # Build a Slot instance on a component,

data/lib/view_component/slotable_v2.rb

@@ -0,0 +1,249 @@
+# frozen_string_literal: true
+
+require "active_support/concern"
+
+require "view_component/slot_v2"
+
+module ViewComponent
+  module SlotableV2
+    extend ActiveSupport::Concern
+
+    # Setup component slot state
+    included do
+      # Hash of registered Slots
+      class_attribute :registered_slots
+      self.registered_slots = {}
+    end
+
+    class_methods do
+      ##
+      # Registers a sub-component
+      #
+      # = Example
+      #
+      #   renders_one :header -> (classes:) do
+      #     HeaderComponent.new(classes: classes)
+      #   end
+      #
+      #   # OR
+      #
+      #   renders_one :header, HeaderComponent
+      #
+      #   where `HeaderComponent` is defined as:
+      #
+      #   class HeaderComponent < ViewComponent::Base
+      #     def initialize(classes:)
+      #       @classes = classes
+      #     end
+      #   end
+      #
+      #   and has the following template:
+      #
+      #   <header class="<%= @classes %>">
+      #     <%= content %>
+      #   </header>
+      #
+      # = Rendering sub-component content
+      #
+      # The component's sidecar template can access the sub-component by calling a
+      # helper method with the same name as the sub-component.
+      #
+      #   <h1>
+      #     <%= header do %>
+      #       My header title
+      #     <% end %>
+      #   </h1>
+      #
+      # = Setting sub-component content
+      #
+      # Consumers of the component can render a sub-component by calling a
+      # helper method with the same name as the slot.
+      #
+      #   <%= render_inline(MyComponent.new) do |component| %>
+      #     <%= component.header(classes: "Foo") do %>
+      #       <p>Bar</p>
+      #     <% end %>
+      #   <% end %>
+      def renders_one(slot_name, callable = nil)
+        validate_slot_name(slot_name)
+
+        define_method slot_name do |*args, **kwargs, &block|
+          if args.empty? && kwargs.empty? && block.nil?
+            get_slot(slot_name)
+          else
+            set_slot(slot_name, *args, **kwargs, &block)
+          end
+        end
+
+        register_slot(slot_name, collection: false, callable: callable)
+      end
+
+      ##
+      # Registers a collection sub-component
+      #
+      # = Example
+      #
+      #   render_many :items, -> (name:) { ItemComponent.new(name: name }
+      #
+      #   # OR
+      #
+      #   render_many :items, ItemComponent
+      #
+      # = Rendering sub-components
+      #
+      # The component's sidecar template can access the slot by calling a
+      # helper method with the same name as the slot.
+      #
+      #   <h1>
+      #     <%= items.each do |item| %>
+      #       <%= item %>
+      #     <% end %>
+      #   </h1>
+      #
+      # = Setting sub-component content
+      #
+      # Consumers of the component can set the content of a slot by calling a
+      # helper method with the same name as the slot. The method can be
+      # called multiple times to append to the slot.
+      #
+      #   <%= render_inline(MyComponent.new) do |component| %>
+      #     <%= component.item(name: "Foo") do %>
+      #       <p>One</p>
+      #     <% end %>
+      #
+      #     <%= component.item(name: "Bar") do %>
+      #       <p>two</p>
+      #     <% end %>
+      #   <% end %>
+      def renders_many(slot_name, callable = nil)
+        validate_slot_name(slot_name)
+
+        singular_name = ActiveSupport::Inflector.singularize(slot_name)
+
+        # Define setter for singular names
+        # e.g. `renders_many :items` allows fetching all tabs with
+        # `component.tabs` and setting a tab with `component.tab`
+        define_method singular_name do |*args, **kwargs, &block|
+          set_slot(slot_name, *args, **kwargs, &block)
+        end
+
+        # Instantiates and and adds multiple slots forwarding the first
+        # argument to each slot constructor
+        define_method slot_name do |collection_args = nil, &block|
+          if collection_args.nil? && block.nil?
+            get_slot(slot_name)
+          else
+            collection_args.each do |args|
+              set_slot(slot_name, **args, &block)
+            end
+          end
+        end
+
+        register_slot(slot_name, collection: true, callable: callable)
+      end
+
+      # Clone slot configuration into child class
+      # see #test_slots_pollution
+      def inherited(child)
+        child.registered_slots = self.registered_slots.clone
+        super
+      end
+
+      private
+
+      def register_slot(slot_name, collection:, callable:)
+        # Setup basic slot data
+        slot = {
+          collection: collection,
+        }
+        # If callable responds to `render_in`, we set it on the slot as a renderable
+        if callable && callable.respond_to?(:method_defined?) && callable.method_defined?(:render_in)
+          slot[:renderable] = callable
+        elsif callable.is_a?(String)
+          # If callable is a string, we assume it's referencing an internal class
+          slot[:renderable_class_name] = callable
+        elsif callable
+          # If slot does not respond to `render_in`, we assume it's a proc,
+          # define a method, and save a reference to it to call when setting
+          method_name = :"_call_#{slot_name}"
+          define_method method_name, &callable
+          slot[:renderable_function] = instance_method(method_name)
+        end
+
+        # Register the slot on the component
+        self.registered_slots[slot_name] = slot
+      end
+
+      def validate_slot_name(slot_name)
+        if self.registered_slots.key?(slot_name)
+          # TODO remove? This breaks overriding slots when slots are inherited
+          raise ArgumentError.new("#{slot_name} slot declared multiple times")
+        end
+      end
+    end
+
+    def get_slot(slot_name)
+      slot = self.class.registered_slots[slot_name]
+      @_set_slots ||= {}
+
+      if @_set_slots[slot_name]
+        return @_set_slots[slot_name]
+      end
+
+      if slot[:collection]
+        []
+      else
+        nil
+      end
+    end
+
+    def set_slot(slot_name, *args, **kwargs, &block)
+      slot_definition = self.class.registered_slots[slot_name]
+
+      slot = SlotV2.new(self)
+
+      # Passing the block to the sub-component wrapper like this has two
+      # benefits:
+      #
+      # 1. If this is a `content_area` style sub-component, we will render the
+      # block via the `slot`
+      #
+      # 2. Since we have to pass block content to components when calling
+      # `render`, evaluating the block here would require us to call
+      # `view_context.capture` twice, which is slower
+      slot._content_block = block if block_given?
+
+      # If class
+      if slot_definition[:renderable]
+        slot._component_instance = slot_definition[:renderable].new(*args, **kwargs)
+      # If class name as a string
+      elsif slot_definition[:renderable_class_name]
+        slot._component_instance = self.class.const_get(slot_definition[:renderable_class_name]).new(*args, **kwargs)
+      # If passed a lambda
+      elsif slot_definition[:renderable_function]
+        # Use `bind(self)` to ensure lambda is executed in the context of the
+        # current component. This is necessary to allow the lambda to access helper
+        # methods like `content_tag` as well as parent component state.
+        renderable_value = slot_definition[:renderable_function].bind(self).call(*args, **kwargs, &block)
+
+        # Function calls can return components, so if it's a component handle it specially
+        if renderable_value.respond_to?(:render_in)
+          slot._component_instance = renderable_value
+        else
+          slot._content = renderable_value
+        end
+      end
+
+      @_set_slots ||= {}
+
+      if slot_definition[:collection]
+        @_set_slots[slot_name] ||= []
+        @_set_slots[slot_name].push(slot)
+      else
+        @_set_slots[slot_name] = slot
+      end
+
+      nil
+    end
+  end
+end