phlex-slotable 0.1.0 → 0.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a1aa68f30783948c69ae6e3a9018e3e0fe828b8d1e3392208bbd926dead27761
-  data.tar.gz: f60047a296679c099258024d72e23d13a252bd4f5fd38576769716218785d962
+  metadata.gz: '09e928c0d1e4cec5220e01d3e6b06ebc5fef4b50ed8f43bdf3634e89f91d201f'
+  data.tar.gz: 726cadd0901159f4cdb083d80300658b44b00da06515946f38fc3701b2ea019b
 SHA512:
-  metadata.gz: cf5b19581bab8cb2ba50e91e44f9489b40cbdae7c0873310a98637be51cbac6212e8621a95f67bd8d5d1ad1286533b66023847c4ac4eacbe2a7f867635b2bfaa
-  data.tar.gz: d1e6a2cb591541105802d4338b857baf99ef5817aacbdd644f5a6ad3e77a4ac60669c8b5f0d9f7bdae63565e05f6fe7cbe6852e29aac88aa31366def63a5ac01
+  metadata.gz: 42f10716289705dd92edc63b31637781f490eb02348a6f17911229a5798a31e7a7bc905c990c6b3770cbf5b1bd31110279c509649ac25f16c1b449bc757a4cdf
+  data.tar.gz: 9c050854b88de83f4a4edbbf2ea8c05cf34938d89c5bb0a8b9c4a056c84363c93582091afa3b6f2a91f393dffcf262a6f8f81a936d229c4edfff2ad779724533

data/CHANGELOG.md

@@ -1,5 +1,24 @@
 ## [Unreleased]
 
+## [0.2.0] - 2024-02-13
+
+- Allow view slots using string as class name
+
+  *stephannv*
+
+- Allow lambda slots
+
+  *stephannv*
+
 ## [0.1.0] - 2024-02-12
+- Add single and multi slots
+
+  *stephannv*
+
+- Add generic slots
+
+  *stephannv*
+
+- Add view slots
 
-- Initial release
+  *stephannv*

data/README.md

@@ -1,25 +1,28 @@
+> [!WARNING]
+> Please note that Phlex::Slotable is currently under development and may undergo changes to its API before reaching the stable release (1.0.0). As a result, there may be breaking changes that affect its usage.
+
 # Phlex::Slotable
 
-Phlex::Slotable enables slots feature to Phlex views. Inspired by ViewComponent.
+Phlex::Slotable enables slots feature to [Phlex](https://www.phlex.fun/) views. Inspired by ViewComponent.
 
 ## Installation
 
 Install the gem and add to the application's Gemfile by executing:
 
-    $ bundle add UPDATE_WITH_YOUR_GEM_NAME_IMMEDIATELY_AFTER_RELEASE_TO_RUBYGEMS_ORG
+    $ bundle add phlex-slotable
 
 If bundler is not being used to manage dependencies, install the gem by executing:
 
-    $ gem install UPDATE_WITH_YOUR_GEM_NAME_IMMEDIATELY_AFTER_RELEASE_TO_RUBYGEMS_ORG
+    $ gem install phlex-slotable
 
 ## Usage
 
 #### Basic
 
-Include `Phlex::Slotable` to your Phlex view and use `slot` class method to define slots.
+To incorportate slots into your Phlex views, include `Phlex::Slotable` and utilize `slot` class method to define them.
 
-- `slot :slot_name` defines a single slot that will be rendered at most once per component
-- `slot :slot_name, many: true` defines a slot that can be rendered multiple times per component
+- `slot :slot_name` declaration establishes a single slot intended for rendering once within a view
+- `slot :slot_name, many: true` denotes a slot capable of being rendered multiple times within a view
 
 ```ruby
 class BlogComponent < Phlex::HTML
@@ -32,9 +35,9 @@ class BlogComponent < Phlex::HTML
 end
 ```
 
-To render a single slot, render `{slot_name}_slot`, eg. `render header_slot`.
+To render a single slot, utilize the  `{slot_name}_slot` method. For example, you can render the `header_slot` using `render header_slot`.
 
-To render a multi slot, iterate over `{slot_name}_slots` and render each element, eg. `post_slots.each { |s| render s }`
+For multi-slot rendering, iterate over the `{slot_name}_slots` collection and and render each slot individually, eg. `post_slots.each { |s| render s }`.
 
 ```ruby
 class BlogComponent < Phlex::HTML
@@ -44,11 +47,11 @@ class BlogComponent < Phlex::HTML
   slot :post, many: true
 
   def template
-  	div id: "header" do
+    div id: "header" do
       render header_slot
     end
 
-		div id: "main" do
+    div id: "main" do
       post_slots.each do |slot|
         p { render slot }
       end
@@ -59,7 +62,7 @@ class BlogComponent < Phlex::HTML
 end
 ```
 
-To set slot content, you need to use `with_{slot_name}` when rendering the view:
+When setting slot content, ensure to utilize the  `with_{slot_name}` method while rendering the view:
 
 ```ruby
 class MyPage < Phlex::HTML
@@ -96,7 +99,7 @@ This will output:
 
 #### Predicate methods
 
-You can check if a slot has been passed to the component using `{slot_name}_slot?` when it is a single slot, or `{slot_name}_slots?` when it is a multi slot.
+You can verify whether a slot has been provided to the view using `{slot_name}_slot?` for single slots or `{slot_name}_slots?` when for multi-slots.
 
 ```ruby
 class BlogComponent < Phlex::HTML
@@ -106,13 +109,13 @@ class BlogComponent < Phlex::HTML
   slot :post, many: true
 
   def template
-  	if header_slot?
+    if header_slot?
       div id: "header" do
         render header_slot
       end
     end
 
-		div id: "main" do
+    div id: "main" do
       if post_slots?
         post_slots.each do |slot|
           p { render slot }
@@ -129,11 +132,11 @@ end
 
 #### View slot
 
-Slots can render other views, you just need to pass the view class name to `slot` method.
+Slots have the capability to render other views, Simply pass the view class name to the `slot` method.
 
 ```ruby
 class HeaderComponent < Phlex::HTML
-	def initialize(size:)
+  def initialize(size:)
     @size = size
   end
 
@@ -143,7 +146,7 @@ class HeaderComponent < Phlex::HTML
 end
 
 class PostComponent < Phlex::HTML
-	def initialize(featured:)
+  def initialize(featured:)
     @featured = featured
   end
 
@@ -159,13 +162,13 @@ class BlogComponent < Phlex::HTML
   slot :post, PostComponent, many: true
 
   def template
-  	if header_slot?
+    if header_slot?
       div id: "header" do
         render header_slot
       end
     end
 
-		div id: "main" do
+    div id: "main" do
       if post_slots?
         post_slots.each { render slot }
 
@@ -207,11 +210,73 @@ The output:
 </div>
 ```
 
-## Roadmap
+You can pass the class name as a string for cases where the class isn't evaluated yet, such as with inner classes. For example:
+```ruby
+class BlogComponent < Phlex::HTML
+  include Phlex::Slotable
+
+  # This will not work
+  slot :header, HeaderComponent #  uninitialized constant BlogComponent::HeaderComponent
+  # You should do this
+  slot :header, "HeaderComponent"
+
+  private
+
+  class HeaderComponent < Phlex::HTML
+    # ...
+  end
+end
+```
+
+#### Lambda slots
+Lambda slots are valuable when you prefer not to create another component for straightforward structures or when you need to render another view with specific parameters
+```ruby
+
+class BlogComponent < Phlex::HTML
+  include Phlex::Slotable
+
+  slot :header, ->(size:, &content) { render HeaderComponent.new(size: size, color: "blue"), &content }
+  slot :post, ->(featured:, &content) { span(class: featured ? "featured" : nil, &content) }, many: true
+end
+
+class MyPage < Phlex::HTML
+  def template
+    render BlogComponent.new do |blog|
+      blog.with_header(size: :lg) { "Hello World!" }
+
+      blog.with_post(featured: true) { "Post A" }
+      blog.with_post { "Post B" }
+      blog.with_post { "Post C" }
+    end
+  end
+end
+```
+
+You can access the internal view state within lambda slots.For example:
+```ruby
+class BlogComponent < Phlex::HTML
+  include Phlex::Slotable
+
+  slot :header, ->(size:, &content) { render HeaderComponent.new(size: size, color: @header_color), &content }
 
-[] Accepts Strings as view class name
-[] Allow lambda slots
-[] Allow polymorphic slots
+  def initialize(header_color:)
+    @header_color = header_color
+  end
+end
+
+class MyPage < Phlex::HTML
+  def template
+    render BlogComponent.new(header_color: "red") do |blog|
+      blog.with_header(size: :lg) { "Hello World!" }
+    end
+  end
+end
+```
+
+## Roadmap
+- ✅ ~~Accept Strings as view class name~~
+- ✅ ~~Allow lambda slots~~
+- 🕐 Allow polymorphic slots
 
 ## Development
 

data/lib/phlex/slotable/version.rb

@@ -2,6 +2,6 @@
 
 module Phlex
   module Slotable
-    VERSION = "0.1.0"
+    VERSION = "0.2.0"
   end
 end

data/lib/phlex/slotable.rb

@@ -12,6 +12,11 @@ module Phlex
       def slot(slot_name, callable = nil, many: false)
         include Phlex::DeferredRender
 
+        if callable.is_a?(Proc)
+          define_method :"__call_#{slot_name}__", &callable
+          private :"__call_#{slot_name}__"
+        end
+
         if many
           define_method :"with_#{slot_name}" do |*args, **kwargs, &block|
             instance_variable_set(:"@#{slot_name}_slots", []) unless instance_variable_defined?(:"@#{slot_name}_slots")
@@ -19,6 +24,10 @@ module Phlex
             value = case callable
             when nil
               block
+            when String
+              self.class.const_get(callable).new(*args, **kwargs, &block)
+            when Proc
+              -> { self.class.instance_method(:"__call_#{slot_name}__").bind_call(self, *args, **kwargs, &block) }
             else
               callable.new(*args, **kwargs, &block)
             end
@@ -40,6 +49,10 @@ module Phlex
             value = case callable
             when nil
               block
+            when String
+              self.class.const_get(callable).new(*args, **kwargs, &block)
+            when Proc
+              -> { self.class.instance_method(:"__call_#{slot_name}__").bind_call(self, *args, **kwargs, &block) }
             else
               callable.new(*args, **kwargs, &block)
             end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: phlex-slotable
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.2.0
 platform: ruby
 authors:
 - stephann
 autorequire:
 bindir: exe
 cert_chain: []
-date: 2024-02-12 00:00:00.000000000 Z
+date: 2024-02-13 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: phlex