protos 0.3.0 → 0.4.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5fe048d407665dc19039444171da359495565d7b94d1787c444c4e8e8c5fe191
-  data.tar.gz: fda1eea822602572a8a28be104b8e60b533d429745d4ef616be8c7f14bf9e53e
+  metadata.gz: 0233ed8699bbfd2a557d575c4d42418599a5b896121fb1ed42d68ff8dbb3b3e8
+  data.tar.gz: d0954355d624b87b91efe120ee06c94556b3ca437990f00a842d1c4965f9aff5
 SHA512:
-  metadata.gz: e4859a4076a79386043b18ad71735b9b372c9120a0f3a8a816d1020174152b19ed2a030172ef01e7240ec26d28dce73070ce478ed440e15526eabde03f500067
-  data.tar.gz: 2ac30388a8534552f10cb32bc68b9f7786bd14caf1eab69d8f15c6a310a08d92b27eeb1a97896a60df18cd6e489c30f179706fd72ac0eca7072f435d05ebad9e
+  metadata.gz: c5108530ce8e03b05d4574af5185c6a8cdff6cf0473b126bb16748a5d62a2e2c1b4a7a1183e7b186409def11d8dce75d377f5b757ece431845084ec26dc20351
+  data.tar.gz: 6a2b70254dd788a7ad3b547e9379de1555964f697e4dbf3a417a5e935a0e327dd80c9eb9eb97cfc9e38c5bdc0c0669f441fc16b46bbd9b1bdabd5e4bd4842bf2

data/.rubocop.yml

@@ -1,12 +1,12 @@
 require:
   - rubocop-inhouse
 
-AllCops:
-  TargetRubyVersion: 3.1
-
 inherit_gem:
   rubocop-inhouse:
     - config/default.yml
 
-Style/ConstantVisibility:
-  Enabled: false
+AllCops:
+  TargetRubyVersion: 3.2
+
+Naming/BlockForwarding:
+  EnforcedStyle: anonymous

data/CHANGELOG.md

@@ -9,3 +9,14 @@
 - Chose to move away from daisyUI dropdown defaults as they have problems
   displaying properly in too many situations
 - Opted for using a protos-stimulus controller that uses tippy.js
+
+## [0.3.0] - 2024-04-06
+
+- Updates to phlex v0.10 by changing all `template` methods to `view_template`
+- Improvements to README
+
+## [0.4.0] - ???
+
+- Phlex discord didn't like all the calls to `render`
+- Apparently `render` is called differently within ERB
+- Suggested to change all calls to immediately render, would improve ergonomics

data/README.md

@@ -49,7 +49,7 @@ depending on their context.
 
 ```ruby
 class List < Protos::Component
-  def template
+  def view_template
     ul(class: css[:list]) do
       li(class: css[:item]) { "Item 1" }
       li(class: css[:item]) { "Item 2" }
@@ -152,7 +152,7 @@ By doing this we enable 2 main conveniences:
 
 ```ruby
 class List < Protos::Component
-  def template
+  def view_template
     ul(**attrs) do
       # ...
     end
@@ -238,7 +238,7 @@ Here is an example of a small navbar component:
 require "protos"
 
 class Navbar < Protos::Component
-  def template
+  def view_template
     # **attrs will add:
     # - Any html options defined on the component initialization such as data,
     #   role, for, etc..
@@ -375,11 +375,11 @@ import "protos-stimulus"
 Then you can use the components in your apps.
 
 ```ruby
-render Protos::Card.new(class: "bg-base-100") do |card|
-  render card.body(class: "gap-sm") do
-    render card.title(class: "font-bold") { "Hello world" }
+Protos::Card.new(class: "bg-base-100") do |card|
+  card.body(class: "gap-sm") do
+    card.title(class: "font-bold") { "Hello world" }
     span { "This is some more content" }
-    render card.actions do
+    card.actions do
       button(class: "btn btn-primary") { "Action 1" }
     end
   end
@@ -657,6 +657,25 @@ git commits and the created tag, and push the `.gem` file to
 Bug reports and pull requests are welcome on GitHub at
 https://github.com/inhouse-work/protos.
 
+## Benchmarks
+
+You can run the benchmarks using the raketasks, e.g:
+
+- `bin/rake benchmark:ips:table`
+- `bin/rake benchmark:memory:table`
+- `bin/rake benchmark:ips:theme`
+- `bin/rake benchmark:ips:attributes`
+
+There are also tasks for profiling and exploring memory consumption.
+
+You can find the latest benchmarks in `benchmarks/`.
+
+Currently this library is 30x slower than plain Phlex components. This is due to
+the overhead of themes, attributes and other quality of life improvements.
+
+This may seem like a lot but Phlex is so fast that rendering a large table can
+still be done 4000 times per second with this lib.
+
 ## License
 
 The gem is available as open source under the terms of the

data/benchmarks/table.txt

@@ -0,0 +1,12 @@
+ruby 3.3.0 (2023-12-25 revision 5124f9ac75) [arm64-darwin23]
+Warming up --------------------------------------
+       Protos::Table    41.000 i/100ms
+        Phlex::Table     1.239k i/100ms
+Calculating -------------------------------------
+       Protos::Table    417.028 (± 0.2%) i/s -      2.091k in   5.014103s
+        Phlex::Table     12.785k (± 0.6%) i/s -     64.428k in   5.039702s
+
+Comparison:
+        Phlex::Table:    12784.6 i/s
+       Protos::Table:      417.0 i/s - 30.66x  slower
+

data/examples/list.rb

@@ -1,3 +1,5 @@
+# frozen_string_literal: true
+
 require "protos"
 
 class List < Protos::Component

data/lib/protos/accordion/item.rb

@@ -9,7 +9,7 @@ module Protos
 
       def view_template(&block)
         li(**attrs) do
-          render collapse_component do
+          render Collapse.new(theme: collapse_theme) do
             # form: "" prevents the radio button from being submitted if its
             # within a form
             input(type: :radio, name: id, form: "", autocomplete: :off)
@@ -20,11 +20,10 @@ module Protos
 
       private
 
-      def collapse_component
-        collapse_theme = { "!container": tokens("bg-base-100") }
-        collapse_theme[:container!] = css[:collapse] if css[:collapse]
-
-        Collapse.new(theme: collapse_theme)
+      def collapse_theme
+        { "!container": tokens("bg-base-100") }.tap do |theme|
+          theme[:container!] = css[:collapse] if css[:collapse]
+        end
       end
 
       def theme

data/lib/protos/accordion.rb

@@ -10,20 +10,16 @@ module Protos
     option :id,
            default: -> { "collapse-#{SecureRandom.hex(4)}" }
 
-    def view_template(&block)
-      ul(**attrs, &block)
+    def view_template(&)
+      ul(**attrs, &)
     end
 
-    def item(**kwargs)
-      Item.new(id:, **kwargs)
-    end
+    def item(*, **, &) = render Item.new(*, id:, **, &)
 
-    def title(*args, **kwargs, &block)
-      Collapse::Title.new(*args, id:, **kwargs, &block)
-    end
+    def content(...) = render Collapse::Content.new(...)
 
-    def content(...)
-      Collapse::Content.new(...)
+    def title(*, **, &)
+      render Collapse::Title.new(*, id:, **, &)
     end
 
     private

data/lib/protos/alert/actions.rb

@@ -5,8 +5,8 @@ module Protos
     class Actions < Component
       # DOCS: Area for actions (e.g buttons) within an alert
 
-      def view_template(&block)
-        nav(**attrs, &block)
+      def view_template(&)
+        nav(**attrs, &)
       end
 
       private

data/lib/protos/alert/icon.rb

@@ -6,8 +6,8 @@ module Protos
       # DOCS: Icon for the alert, usually showing at the top left corner aligned
       # to the text
 
-      def view_template(&block)
-        div(**attrs, &block)
+      def view_template(&)
+        div(**attrs, &)
       end
 
       private

data/lib/protos/alert.rb

@@ -15,17 +15,13 @@ module Protos
 
     option :type, type: AlertTypes, default: -> { :info }, reader: :private
 
-    def view_template(&block)
-      div(**attrs, &block)
+    def view_template(&)
+      div(**attrs, &)
     end
 
-    def icon(...)
-      Icon.new(...)
-    end
+    def icon(...) = render Icon.new(...)
 
-    def actions(...)
-      Actions.new(...)
-    end
+    def actions(...) = render Actions.new(...)
 
     private
 

data/lib/protos/attributes.rb

@@ -11,7 +11,7 @@ module Protos
     # controllers do not get overridden.
 
     def initialize(attrs = {}, **kwargs)
-      @attrs = attrs.merge(kwargs)
+      @attrs = attrs.merge!(kwargs)
     end
 
     def [](key)
@@ -19,9 +19,10 @@ module Protos
     end
 
     def merge(hash)
-      tap do
-        @attrs = mix(@attrs, hash)
-      end
+      return self unless hash
+
+      @attrs = mix(@attrs, hash)
+      self
     end
 
     # Allows for the use of the `**` operator to pass the attributes to
@@ -32,10 +33,8 @@ module Protos
 
     private
 
-    def mix(*hashes)
-      hashes.each_with_object({}).each do |hash, result|
-        hash ||= {}
-
+    def mix(hash, *hashes)
+      hashes.each_with_object(hash) do |hash, result|
         result.merge!(hash) do |_key, a, b| # rubocop:disable Metrics/ParameterLists
           case [a, b]
           in String, String then "#{a} #{b}"

data/lib/protos/breadcrumbs/crumb.rb

@@ -5,8 +5,8 @@ module Protos
     class Crumb < Component
       # DOCS: A crumb is a single item within a breadcrumb
 
-      def view_template(&block)
-        li(**attrs, &block)
+      def view_template(&)
+        li(**attrs, &)
       end
     end
   end

data/lib/protos/breadcrumbs.rb

@@ -11,9 +11,7 @@ module Protos
       end
     end
 
-    def crumb(...)
-      Crumb.new(...)
-    end
+    def crumb(...) = render Crumb.new(...)
 
     private
 

data/lib/protos/card/actions.rb

@@ -5,8 +5,8 @@ module Protos
     class Actions < Component
       # DOCS: Area for actions (e.g buttons) within a card
 
-      def view_template(&block)
-        nav(**attrs, &block)
+      def view_template(&)
+        nav(**attrs, &)
       end
 
       private

data/lib/protos/card/body.rb

@@ -5,8 +5,8 @@ module Protos
     class Body < Component
       # DOCS: The main content area of a card
 
-      def view_template(&block)
-        div(**attrs, &block)
+      def view_template(&)
+        div(**attrs, &)
       end
 
       private

data/lib/protos/card/image.rb

@@ -7,8 +7,8 @@ module Protos
       # on daisyui which will style the <figure> tag depending on whether
       # image-overlay is present on the card.
 
-      def view_template(&block)
-        figure(**attrs, &block)
+      def view_template(&)
+        figure(**attrs, &)
       end
     end
   end

data/lib/protos/card/title.rb

@@ -5,8 +5,8 @@ module Protos
     class Title < Component
       # DOCS: The title of a card
 
-      def view_template(&block)
-        div(**attrs, &block)
+      def view_template(&)
+        div(**attrs, &)
       end
 
       private

data/lib/protos/card.rb

@@ -14,25 +14,17 @@ module Protos
            default: -> { :default },
            reader: false
 
-    def view_template(&block)
-      article(**attrs, &block)
+    def view_template(&)
+      article(**attrs, &)
     end
 
-    def body(...)
-      Body.new(...)
-    end
+    def body(...) = render Body.new(...)
 
-    def image(...)
-      Image.new(...)
-    end
+    def image(...) = render Image.new(...)
 
-    def title(...)
-      Title.new(...)
-    end
+    def title(...) = render Title.new(...)
 
-    def actions(...)
-      Actions.new(...)
-    end
+    def actions(...) = render Actions.new(...)
 
     private
 

data/lib/protos/carousel/actions.rb

@@ -5,8 +5,8 @@ module Protos
     class Actions < Component
       # DOCS: Area for actions (e.g buttons) within a carousel
 
-      def view_template(&block)
-        div(**attrs, &block)
+      def view_template(&)
+        div(**attrs, &)
       end
 
       private

data/lib/protos/carousel/item.rb

@@ -5,8 +5,8 @@ module Protos
     class Item < Component
       # DOCS: A single item within a carousel
 
-      def view_template(&block)
-        div(**attrs, &block)
+      def view_template(&)
+        div(**attrs, &)
       end
 
       private

data/lib/protos/carousel.rb

@@ -16,17 +16,13 @@ module Protos
              :end
            )
 
-    def view_template(&block)
-      div(**attrs, &block)
+    def view_template(&)
+      div(**attrs, &)
     end
 
-    def item(...)
-      Item.new(...)
-    end
+    def item(...) = render Item.new(...)
 
-    def actions(...)
-      Actions.new(...)
-    end
+    def actions(...) = render Actions.new(...)
 
     private
 

data/lib/protos/chat_bubble/content.rb

@@ -20,8 +20,8 @@ module Protos
                :error
              )
 
-      def view_template(&block)
-        div(**attrs, &block)
+      def view_template(&)
+        div(**attrs, &)
       end
 
       private

data/lib/protos/chat_bubble/footer.rb

@@ -5,8 +5,8 @@ module Protos
     class Footer < Component
       # DOCS: The footer of a chat bubble
 
-      def view_template(&block)
-        div(**attrs, &block)
+      def view_template(&)
+        div(**attrs, &)
       end
 
       private

data/lib/protos/chat_bubble/header.rb

@@ -6,8 +6,8 @@ module Protos
       # DOCS: The header of a chat bubble. This is typically used to display the
       # name of the user who sent the message.
 
-      def view_template(&block)
-        div(**attrs, &block)
+      def view_template(&)
+        div(**attrs, &)
       end
 
       private

data/lib/protos/chat_bubble/image.rb

@@ -6,8 +6,8 @@ module Protos
       # DOCS: An image within a chat bubble. This would typically be an avatar
       # component.
 
-      def view_template(&block)
-        div(**attrs, &block)
+      def view_template(&)
+        div(**attrs, &)
       end
 
       private

data/lib/protos/chat_bubble.rb

@@ -15,25 +15,17 @@ module Protos
              :end
            )
 
-    def view_template(&block)
-      div(**attrs, &block)
+    def view_template(&)
+      div(**attrs, &)
     end
 
-    def content(...)
-      Content.new(...)
-    end
+    def content(...) = render Content.new(...)
 
-    def footer(...)
-      Footer.new(...)
-    end
+    def footer(...) = render Footer.new(...)
 
-    def header(...)
-      Header.new(...)
-    end
+    def header(...) = render Header.new(...)
 
-    def image(...)
-      Image.new(...)
-    end
+    def image(...) = render Image.new(...)
 
     private
 

data/lib/protos/collapse/content.rb

@@ -6,8 +6,8 @@ module Protos
       # DOCS: The content of a collapse. This would be hidden until the collapse
       # is opened.
 
-      def view_template(&block)
-        div(**attrs, &block)
+      def view_template(&)
+        div(**attrs, &)
       end
 
       private

data/lib/protos/collapse/title.rb

@@ -10,11 +10,11 @@ module Protos
              reader: false,
              default: -> { "" }
 
-      def view_template(&block)
+      def view_template(&)
         if @id.size.positive?
-          label(for: @id, **attrs, &block)
+          label(for: @id, **attrs, &)
         else
-          div(**attrs, &block)
+          div(**attrs, &)
         end
       end
 

data/lib/protos/collapse.rb

@@ -18,13 +18,9 @@ module Protos
       end
     end
 
-    def title(*args, **kwargs, &block)
-      Title.new(*args, id:, **kwargs, &block)
-    end
+    def title(*, **, &) = render Title.new(*, id:, **, &)
 
-    def content(...)
-      Content.new(...)
-    end
+    def content(...) = render Content.new(...)
 
     private
 

data/lib/protos/combobox.rb

@@ -11,37 +11,21 @@ module Protos
            reader: false,
            type: TriggerTypes | Types::Array.of(TriggerTypes)
 
-    def trigger(...)
-      Popover::Trigger.new(...)
-    end
+    def trigger(...) = render Popover::Trigger.new(...)
 
-    def content(...)
-      Popover::Content.new(...)
-    end
+    def content(...) = render Popover::Content.new(...)
 
-    def input(...)
-      Command::Input.new(...)
-    end
+    def input(...) = render Command::Input.new(...)
 
-    def group(...)
-      Command::Group.new(...)
-    end
+    def group(...) = render Command::Group.new(...)
 
-    def item(...)
-      Command::Item.new(...)
-    end
+    def item(...) = render Command::Item.new(...)
 
-    def list(...)
-      Command::List.new(...)
-    end
+    def list(...) = render Command::List.new(...)
 
-    def title(...)
-      Command::Title.new(...)
-    end
+    def title(...) = render Command::Title.new(...)
 
-    def empty(...)
-      Command::Empty.new(...)
-    end
+    def empty(...) = render Command::Empty.new(...)
 
     private
 

data/lib/protos/command/empty.rb

@@ -6,8 +6,8 @@ module Protos
       # DOCS: The empty component is displayed in the list when there are no
       # matches in an input.
 
-      def view_template(&block)
-        li(**attrs, &block)
+      def view_template(&)
+        li(**attrs, &)
       end
 
       private

data/lib/protos/command/item.rb

@@ -5,8 +5,8 @@ module Protos
     class Item < Component
       # DOCS: A single option within a command
 
-      def view_template(&block)
-        li(**attrs, &block)
+      def view_template(&)
+        li(**attrs, &)
       end
 
       private

data/lib/protos/command/list.rb

@@ -5,8 +5,8 @@ module Protos
     class List < Component
       # DOCS: A list of commands. This can contain either items or groups.
 
-      def view_template(&block)
-        ul(**attrs, &block)
+      def view_template(&)
+        ul(**attrs, &)
       end
 
       private

data/lib/protos/command/title.rb

@@ -6,8 +6,8 @@ module Protos
       # DOCS: The title for a group of commands. This is expected to be used
       # inside a Protos::Command::Group component.
 
-      def view_template(&block)
-        h2(**attrs, &block)
+      def view_template(&)
+        h2(**attrs, &)
       end
 
       private

data/lib/protos/command/trigger.rb

@@ -5,8 +5,8 @@ module Protos
     class Trigger < Component
       # DOCS: A trigger is a button that opens a command palette modal
 
-      def view_template(&block)
-        button(**attrs, &block)
+      def view_template(&)
+        button(**attrs, &)
       end
 
       private