proscenium 0.10.0-x86_64-linux → 0.11.0.pre.2-x86_64-linux

data/lib/proscenium/react_componentable.rb

@@ -0,0 +1,94 @@
+# frozen_string_literal: true
+
+module Proscenium
+  module ReactComponentable
+    extend ActiveSupport::Concern
+
+    included do
+      # @return [Hash] the props to pass to the React component.
+      attr_writer :props
+
+      # The HTML tag to use as the wrapping element for the component. You can reassign this in your
+      # component class to use a different tag:
+      #
+      #   class MyComponent < Proscenium::ViewComponent::ReactComponent
+      #     self.root_tag = :span
+      #   end
+      #
+      # @return [Symbol]
+      class_attribute :root_tag, instance_predicate: false, default: :div
+
+      # By default, the template block (content) of the component will be server rendered as normal.
+      # However, when React hydrates and takes control of the component, it's content will be
+      # replaced by React with the JavaScript rendered content. Enabling this option will forward
+      # the server rendered content as the `children` prop passed to the React component.
+      #
+      # @example
+      #
+      #   const Component = ({ children }) => {
+      #     return <div dangerouslySetInnerHTML={{ __html: children }} />
+      #   }
+      #
+      # @return [Boolean]
+      class_attribute :forward_children, default: false
+
+      # Lazy load the component using IntersectionObserver?
+      #
+      # @return [Boolean]
+      class_attribute :lazy, default: false
+
+      class_attribute :loader
+    end
+
+    class_methods do
+      # Import only the component manager. The component itself is side loaded in the initializer,
+      # so that it can be lazy loaded based on the value of the `lazy` instance variable.
+      def sideload
+        Importer.import resolve: '@proscenium/react-manager/index.jsx'
+        Importer.sideload source_path, lazy: true
+      end
+    end
+
+    # @param props: [Hash]
+    def initialize(lazy: self.class.lazy, loader: self.class.loader, props: {})
+      self.lazy = lazy
+      self.loader = loader
+      @props = props
+    end
+
+    # The absolute URL path to the javascript component.
+    def virtual_path
+      @virtual_path ||= Resolver.resolve self.class.source_path.sub_ext('.jsx').to_s
+    end
+
+    def props
+      @props ||= {}
+    end
+
+    private
+
+    def data_attributes
+      {
+        proscenium_component_path: Pathname.new(virtual_path).to_s,
+        proscenium_component_props: prepared_props,
+        proscenium_component_lazy: lazy
+      }.tap do |x|
+        x[:proscenium_component_forward_children] = true if forward_children?
+      end
+    end
+
+    def prepared_props
+      props.deep_transform_keys do |term|
+        # This ensures that the first letter after a slash is not capitalized.
+        string = term.to_s.split('/').map { |str| str.camelize :lower }.join('/')
+
+        # Reverses the effect of ActiveSupport::Inflector.camelize converting slashes into `::`.
+        string.gsub '::', '/'
+      end.to_json
+    end
+
+    def loader_component
+      render Loader::Component.new(loader, @html_class, data_attributes, tag: @html_tag)
+    end
+  end
+end

data/lib/proscenium/resolver.rb

@@ -0,0 +1,41 @@
+# frozen_string_literal: true
+
+require 'active_support/current_attributes'
+
+module Proscenium
+  class Resolver < ActiveSupport::CurrentAttributes
+    # TODO: cache this across requests in production.
+    attribute :resolved
+
+    # Resolve the given `path` to a URL path.
+    #
+    # @param path [String] Can be URL path, file system path, or bare specifier (ie. NPM package).
+    # @return [String] URL path.
+    def self.resolve(path) # rubocop:disable Metrics/AbcSize, Metrics/PerceivedComplexity
+      self.resolved ||= {}
+
+      self.resolved[path] ||= begin
+        if path.start_with?('./', '../')
+          raise ArgumentError, 'path must be an absolute file system or URL path'
+        end
+
+        if path.start_with?('@proscenium/')
+          "/#{path}"
+        elsif (gem = Proscenium.config.side_load_gems.find do |_, x|
+                 path.start_with? "#{x[:root]}/"
+               end)
+          unless (package_name = gem[1][:package_name] || gem[0])
+            # TODO: manually resolve the path without esbuild
+            raise PathResolutionFailed, path
+          end
+
+          Builder.resolve "#{package_name}/#{path.delete_prefix("#{gem[1][:root]}/")}"
+        elsif path.start_with?("#{Rails.root}/")
+          path.delete_prefix Rails.root.to_s
+        else
+          Builder.resolve path
+        end
+      end
+    end
+  end
+end

data/lib/proscenium/side_load.rb

@@ -2,84 +2,24 @@
 
 module Proscenium
   class SideLoad
-    extend ActiveSupport::Autoload
-
-    NotIncludedError = Class.new(StandardError)
-
-    autoload :Monkey
-    autoload :Helper
-    autoload :EnsureLoaded
-
-    EXTENSIONS = %i[js css].freeze
-    EXTENSION_MAP = {
-      '.module.css' => :css,
-      '.css' => :css,
-      '.tsx' => :js,
-      '.ts' => :js,
-      '.jsx' => :js,
-      '.js' => :js
-    }.freeze
-
-    attr_reader :path
-
     class << self
-      # Side load the given asset `path`, by appending it to `Proscenium::Current.loaded`, which is
-      # a Set of 'js' and 'css' asset paths. This is idempotent, so side loading will never include
-      # duplicates.
+      # Side loads the class, and its super classes that respond to `.source_path`.
       #
-      # @return [Array] appended URL paths
-      def append(path, extension_map = EXTENSION_MAP)
-        new(path, extension_map).append
-      end
-
-      # Side load the given `path` at `type`, without first resolving the path. This still respects
-      # idempotency of `Proscenium::Current.loaded`.
+      # Assign the `abstract_class` class variable to any abstract class, and it will not be side
+      # loaded. Additionally, if the class responds to `#sideload?`, and it returns false, it will
+      # not be side loaded.
       #
-      # @param path [String]
-      # @param type [Symbol] :js or :css
-      def append!(path, type)
-        return if Proscenium::Current.loaded[type].include?(path)
-
-        Proscenium::Current.loaded[type] << log(path)
-      end
-
-      def log(value)
-        ActiveSupport::Notifications.instrument('sideload.proscenium', identifier: value)
-
-        value
-      end
-    end
-
-    # @param path [Pathname, String] The path of the file to be side loaded.
-    # @param extension_map [Hash] File extensions to side load.
-    def initialize(path, extension_map = EXTENSION_MAP)
-      @path = (path.is_a?(Pathname) ? path : Rails.root.join(path)).sub_ext('')
-      @extension_map = extension_map
-
-      Proscenium::Current.loaded ||= EXTENSIONS.index_with { |_e| Set.new }
-    end
-
-    def append
-      @extension_map.filter_map do |ext, type|
-        next unless (resolved_path = resolve_path(path.sub_ext(ext)))
-
-        # Make sure path is not already side loaded.
-        unless Proscenium::Current.loaded[type].include?(resolved_path)
-          Proscenium::Current.loaded[type] << log(resolved_path)
+      # If the class responds to `.sideload`, it will be called instead of the regular side loading.
+      # You can use this to customise what is side loaded.
+      def sideload_inheritance_chain(obj)
+        return if !Proscenium.config.side_load || (obj.respond_to?(:sideload?) && !obj.sideload?)
+
+        klass = obj.class
+        while klass.respond_to?(:source_path) && klass.source_path && !klass.abstract_class
+          klass.respond_to?(:sideload) ? klass.sideload : Importer.sideload(klass.source_path)
+          klass = klass.superclass
         end
-
-        resolved_path
       end
     end
-
-    private
-
-    def log(...)
-      self.class.log(...)
-    end
-
-    def resolve_path(path)
-      path.exist? ? Utils.resolve_path(path.to_s) : nil
-    end
   end
 end

data/lib/proscenium/source_path.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+# Include this into any class to expose a `source_path` class and instance method, which will return
+# the absolute file system path to the current object.
+module Proscenium::SourcePath
+  def self.included(base)
+    base.extend ClassMethods
+  end
+
+  module ClassMethods
+    def source_path
+      @source_path ||= name.nil? ? nil : Pathname.new(const_source_location(name).first)
+    end
+  end
+end

data/lib/proscenium/utils.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+module Proscenium
+  module Utils
+    module_function
+
+    # @param value [#to_s] The value to create the digest from. This will usually be a `Pathname`.
+    # @return [String] digest of the given value.
+    def digest(value)
+      Digest::SHA1.hexdigest(value.to_s)[..7]
+    end
+  end
+end

data/lib/proscenium/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Proscenium
-  VERSION = '0.10.0'
+  VERSION = '0.11.0.pre.2'
 end

data/lib/proscenium/view_component/css_modules.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module Proscenium
+  module ViewComponent::CssModules
+    include Proscenium::CssModule
+
+    def self.included(base)
+      base.extend CssModule::Path
+    end
+  end
+end

data/lib/proscenium/view_component/react_component.rb

@@ -1,22 +1,22 @@
 # frozen_string_literal: true
 
-#
-# Renders a <div> for use with React components, with data attributes specifying the component path
-# and props.
-#
-# If a content block is given, that content will be rendered inside the component, allowing for a
-# "loading" UI. If no block is given, then a "loading..." text will be rendered. It is intended that
-# the component is mounted to this div, and the loading UI will then be replaced with the
-# component's rendered output.
-#
-class Proscenium::ViewComponent::ReactComponent < Proscenium::ViewComponent
-  self.abstract_class = true
+module Proscenium
+  # Renders a <div> for use with React components, with data attributes specifying the component
+  # path and props.
+  #
+  # If a content block is given, that content will be rendered inside the component, allowing for a
+  # "loading" UI. If no block is given, then a "loading..." text will be rendered. It is intended
+  # that the component is mounted to this div, and the loading UI will then be replaced with the
+  # component's rendered output.
+  class ViewComponent::ReactComponent < ViewComponent
+    self.abstract_class = true
 
-  include Proscenium::Componentable
+    include ReactComponentable
 
-  def call
-    tag.send root_tag, data: data_attributes do
-      tag.div content || 'loading...'
+    def call
+      tag.send root_tag, data: data_attributes do
+        tag.div content || 'loading...'
+      end
     end
   end
 end

data/lib/proscenium/view_component/sideload.rb

@@ -0,0 +1,4 @@
+# frozen_string_literal: true
+
+module Proscenium::ViewComponent::Sideload
+end

data/lib/proscenium/view_component.rb

@@ -4,59 +4,29 @@ require 'view_component'
 
 class Proscenium::ViewComponent < ViewComponent::Base
   extend ActiveSupport::Autoload
-  include Proscenium::CssModule
 
-  autoload :TagBuilder
+  autoload :Sideload
   autoload :ReactComponent
+  autoload :CssModules
+
+  include Proscenium::SourcePath
+  include CssModules
 
-  # Side loads the class, and its super classes that respond to `.path`. Assign the `abstract_class`
-  # class variable to any abstract class, and it will not be side loaded. Additionally, if the class
-  # responds to `side_load`, then that method is called.
   module Sideload
     def before_render
-      klass = self.class
-
-      if !klass.abstract_class && respond_to?(:side_load, true)
-        side_load
-        klass = klass.superclass
-      end
-
-      while !klass.abstract_class && klass.respond_to?(:path) && klass.path
-        Proscenium::SideLoad.append klass.path
-        klass = klass.superclass
-      end
+      Proscenium::SideLoad.sideload_inheritance_chain self
 
       super
     end
   end
 
   class << self
-    attr_accessor :path, :abstract_class
+    attr_accessor :abstract_class
 
     def inherited(child)
-      child.path = if caller_locations(1, 1).first.label == 'inherited'
-                     Pathname.new caller_locations(2, 1).first.path
-                   else
-                     Pathname.new caller_locations(1, 1).first.path
-                   end
-
-      child.prepend Sideload if Rails.application.config.proscenium.side_load
+      child.prepend Sideload
 
       super
     end
   end
-
-  # @override Auto compilation of class names to css modules.
-  def render_in(...)
-    cssm.compile_class_names(super(...))
-  end
-
-  private
-
-  # Overrides ActionView::Helpers::TagHelper::TagBuilder, allowing us to intercept the
-  # `css_module` option from the HTML options argument of the `tag` and `content_tag` helpers, and
-  # prepend it to the HTML `class` attribute.
-  def tag_builder
-    @tag_builder ||= Proscenium::ViewComponent::TagBuilder.new(self)
-  end
 end

data/lib/proscenium.rb

@@ -5,19 +5,36 @@ require 'active_support/dependencies/autoload'
 module Proscenium
   extend ActiveSupport::Autoload
 
-  autoload :Current
+  FILE_EXTENSIONS = ['js', 'mjs', 'ts', 'jsx', 'tsx', 'css', 'js.map', 'mjs.map', 'jsx.map',
+                     'ts.map', 'tsx.map', 'css.map'].freeze
+
+  APPLICATION_INCLUDE_PATHS = ['config', 'app/assets', 'app/views', 'app/components', 'lib',
+                               'node_modules'].freeze
+
+  # Environment variables that should always be passed to the builder.
+  DEFAULT_ENV_VARS = Set['RAILS_ENV', 'NODE_ENV'].freeze
+
+  autoload :SourcePath
+  autoload :Utils
+  autoload :Monkey
   autoload :Middleware
+  autoload :EnsureLoaded
   autoload :SideLoad
   autoload :CssModule
-  autoload :Componentable
+  autoload :ReactComponentable
   autoload :ViewComponent
   autoload :Phlex
   autoload :Helper
   autoload :Builder
-
-  def self.reset_current_side_loaded
-    Current.reset
-    Current.loaded = SideLoad::EXTENSIONS.to_h { |e| [e, Set.new] }
+  autoload :Importer
+  autoload :Resolver
+
+  class Deprecator
+    def deprecation_warning(name, message, _caller_backtrace = nil)
+      msg = "`#{name}` is deprecated and will be removed in a near future release of Proscenium"
+      msg << " (#{message})" if message
+      Kernel.warn msg
+    end
   end
 
   class PathResolutionFailed < StandardError
@@ -30,68 +47,6 @@ module Proscenium
       "Path #{@path.inspect} cannot be resolved"
     end
   end
-
-  module Utils
-    module_function
-
-    # @param value [#to_s] The value to create the digest from. This will usually be a `Pathname`.
-    # @return [String] string digest of the given value.
-    def digest(value)
-      Digest::SHA1.hexdigest(value.to_s)[..7]
-    end
-
-    # Resolve the given `path` to a URL path.
-    #
-    # @param path [String] Can be URL path, file system path, or bare specifier (ie. NPM package).
-    # @return [String] URL path.
-    def resolve_path(path) # rubocop:disable Metrics/AbcSize
-      raise ArgumentError, 'path must be a string' unless path.is_a?(String)
-
-      if path.starts_with?('./', '../')
-        raise ArgumentError, 'path must be an absolute file system or URL path'
-      end
-
-      matched_gem = Proscenium.config.side_load_gems.find do |_, opts|
-        path.starts_with?("#{opts[:root]}/")
-      end
-
-      if matched_gem
-        sroot = "#{matched_gem[1][:root]}/"
-        relpath = path.delete_prefix(sroot)
-
-        if (package_name = matched_gem[1][:package_name] || matched_gem[0])
-          return Builder.resolve("#{package_name}/#{relpath}")
-        end
-
-        # TODO: manually resolve the path without esbuild
-        raise PathResolutionFailed, path
-      end
-
-      return path.delete_prefix(Rails.root.to_s) if path.starts_with?("#{Rails.root}/")
-
-      Builder.resolve(path)
-    end
-
-    # Resolves CSS class `names` to CSS module names. Each name will be converted to a CSS module
-    # name, consisting of the camelCased name (lower case first character), and suffixed with the
-    # given `digest`.
-    #
-    # @param names [String, Array]
-    # @param digest: [String]
-    # @returns [Array] of class names generated from the given CSS module `names` and `digest`.
-    def css_modularise_class_names(*names, digest: nil)
-      names.flatten.compact.map { |name| css_modularise_class_name name, digest: digest }
-    end
-
-    def css_modularise_class_name(name, digest: nil)
-      sname = name.to_s
-      if sname.starts_with?('_')
-        "_#{sname[1..].camelize(:lower)}#{digest}"
-      else
-        "#{sname.camelize(:lower)}#{digest}"
-      end
-    end
-  end
 end
 
 require 'proscenium/railtie'

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: proscenium
 version: !ruby/object:Gem::Version
-  version: 0.10.0
+  version: 0.11.0.pre.2
 platform: x86_64-linux
 authors:
 - Joel Moss
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2023-07-15 00:00:00.000000000 Z
+date: 2023-09-12 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: activesupport
@@ -44,20 +44,6 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: 1.15.5
-- !ruby/object:Gem::Dependency
-  name: nokogiri
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - "~>"
-      - !ruby/object:Gem::Version
-        version: '1.13'
-  type: :runtime
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - "~>"
-      - !ruby/object:Gem::Version
-        version: '1.13'
 - !ruby/object:Gem::Dependency
   name: oj
   requirement: !ruby/object:Gem::Requirement
@@ -104,34 +90,40 @@ files:
 - README.md
 - lib/proscenium.rb
 - lib/proscenium/builder.rb
-- lib/proscenium/componentable.rb
 - lib/proscenium/css_module.rb
-- lib/proscenium/css_module/class_names_resolver.rb
-- lib/proscenium/css_module/resolver.rb
-- lib/proscenium/current.rb
+- lib/proscenium/css_module/path.rb
+- lib/proscenium/css_module/transformer.rb
+- lib/proscenium/ensure_loaded.rb
 - lib/proscenium/ext/proscenium
 - lib/proscenium/ext/proscenium.h
 - lib/proscenium/helper.rb
+- lib/proscenium/importer.rb
+- lib/proscenium/libs/react-manager/index.jsx
+- lib/proscenium/libs/react-manager/react.js
 - lib/proscenium/libs/stimulus-loading.js
+- lib/proscenium/libs/test.js
 - lib/proscenium/log_subscriber.rb
 - lib/proscenium/middleware.rb
 - lib/proscenium/middleware/base.rb
 - lib/proscenium/middleware/esbuild.rb
+- lib/proscenium/middleware/runtime.rb
 - lib/proscenium/middleware/url.rb
+- lib/proscenium/monkey.rb
 - lib/proscenium/phlex.rb
-- lib/proscenium/phlex/component_concerns.rb
+- lib/proscenium/phlex/css_modules.rb
 - lib/proscenium/phlex/page.rb
 - lib/proscenium/phlex/react_component.rb
-- lib/proscenium/phlex/resolve_css_modules.rb
 - lib/proscenium/railtie.rb
+- lib/proscenium/react_componentable.rb
+- lib/proscenium/resolver.rb
 - lib/proscenium/side_load.rb
-- lib/proscenium/side_load/ensure_loaded.rb
-- lib/proscenium/side_load/helper.rb
-- lib/proscenium/side_load/monkey.rb
+- lib/proscenium/source_path.rb
+- lib/proscenium/utils.rb
 - lib/proscenium/version.rb
 - lib/proscenium/view_component.rb
+- lib/proscenium/view_component/css_modules.rb
 - lib/proscenium/view_component/react_component.rb
-- lib/proscenium/view_component/tag_builder.rb
+- lib/proscenium/view_component/sideload.rb
 homepage: https://github.com/joelmoss/proscenium
 licenses:
 - MIT
@@ -151,11 +143,11 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: 2.7.0
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
-  - - ">="
+  - - ">"
     - !ruby/object:Gem::Version
-      version: '0'
+      version: 1.3.1
 requirements: []
-rubygems_version: 3.4.13
+rubygems_version: 3.4.19
 signing_key:
 specification_version: 4
 summary: The engine powering your Rails frontend

data/lib/proscenium/componentable.rb

@@ -1,63 +0,0 @@
-# frozen_string_literal: true
-
-module Proscenium::Componentable
-  extend ActiveSupport::Concern
-
-  included do
-    # @return [Hash] the props to pass to the React component.
-    attr_writer :props
-
-    # The HTML tag to use as the wrapping element for the component. You can reassign this in your
-    # component class to use a different tag:
-    #
-    #   class MyComponent < Proscenium::ViewComponent::ReactComponent
-    #     self.root_tag = :span
-    #   end
-    #
-    # @return [Symbol]
-    class_attribute :root_tag, instance_predicate: false, default: :div
-
-    # Should the template block be forwarded as children to the React component?
-    #
-    # @return [Boolean]
-    class_attribute :forward_children, default: false
-  end
-
-  # @param props: [Hash]
-  def initialize(props: {})
-    @props = props
-
-    super()
-  end
-
-  def virtual_path
-    Proscenium::Utils.resolve_path path.sub_ext('.jsx').to_s
-  end
-
-  private
-
-  def data_attributes
-    d = {
-      proscenium_component_path: virtual_path,
-      proscenium_component_props: prepared_props
-    }
-
-    d[:proscenium_component_forward_children] = true if forward_children?
-
-    d
-  end
-
-  def props
-    @props ||= {}
-  end
-
-  def prepared_props
-    props.deep_transform_keys do |term|
-      # This ensures that the first letter after a slash is not capitalized.
-      string = term.to_s.split('/').map { |str| str.camelize :lower }.join('/')
-
-      # Reverses the effect of ActiveSupport::Inflector.camelize converting slashes into `::`.
-      string.gsub '::', '/'
-    end.to_json
-  end
-end