phlexy_ui 0.1.8 → 0.1.10

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 3e6545417ad6baf0ab1e8b33c1c23ab3513089c787ad274f08fb3094a43d9a44
-  data.tar.gz: 13c7469dac369c048a1f78cebda90e9035457326b072b7ae2d3f6fb4bca8c35f
+  metadata.gz: f59d7f461c2ebf91b2bf3646cc33fa8122c9df39449f3a59879766c2230406d8
+  data.tar.gz: 6972f8cb458ccfdd10af9212c840f62e02ef1a8050f014c7438cc58c923fb1e9
 SHA512:
-  metadata.gz: 870e25f3780ed7cadf59047cfe78330a429ee0f4b0e27c5f635be30df4792165304b0acd9343f341efdd22bcde9aeae5d420ce67b467c16a8bad5613efd2aa17
-  data.tar.gz: 4a3dbfa5b575f9aaa408e216ee635fd9d23a5eae619acf5be7c92e8438683f964ba72cbc94b767e1f32375d2e791bf804916cf33320666da76e2b1ba30faf40e
+  metadata.gz: c4fbcc5a531c1b5c5cdb1a0eeb49bcd59a3dcf4ddd0562cd3fa297a909ea673d5b05493bb429548f5336966c668d07ea5e118b3aa7abfa8feba0ce2408a27f18
+  data.tar.gz: 5ecf6460831ce0047b4a1162aa5870f2adf01b2113927e9baa4f7573a82ce6494f8b4e416f1815657119e94dbdba1bad975cdd9250060ff9ec2e2ba5a3eb1d9c

data/lib/phlexy_ui/button.rb

@@ -16,52 +16,10 @@ module PhlexyUI
         options:
       ).then do |classes|
         if modal
-          # TODO: Remove this abomination once Phlex 2.0 is released.
-          #
-          # The cleanest way to do this is with a single:
-          #
-          # onclick: "#{modal}.showModal()"
-          #
-          # However, currently, Phlex does not allow you to use the "onclick"
-          # attribute.
-          #
-          # Once Phlex 2.0 is released, it will add a #safe method
-          # that will allow us to replace this with a single line:
-          #
-          # onclick: safe("#{modal}.showModal()")
-          #
-          # For now, at least this only runs once and uses event delegation
-          # so that it only adds a single event listener to the document.body.
-          #
-          # The downside is a bigger HTML payload.
-          options[:data] ||= {}
-          options[:data][:modal] = modal
-          script do
-            unsafe_raw <<~JS
-              // Will be replaced with a single line on the <button> once Phlex 2.0 is released.
-              (() => {
-                if (window.PhlexyUI && window.PhlexyUI.modalInitialized) {
-                  return;
-                }
-                
-                document.body.addEventListener("click", (event) => {
-                  if (event.target.tagName === 'BUTTON' && 
-                      event.target.dataset.modal) {
-                    const modal = document.getElementById(event.target.dataset.modal);
-                    if (modal) {
-                      modal.showModal();
-                    }
-                  }
-                });
-                
-                if (!window.PhlexyUI) window.PhlexyUI = {};
-                window.PhlexyUI.modalInitialized = true;
-              })();
-            JS
-          end
+          build_button_via_unsafe_raw(classes, &)
+        else
+          public_send(as, class: classes, **options, &)
         end
-
-        public_send(as, class: classes, **options, &)
       end
     end
 
@@ -69,6 +27,41 @@ module PhlexyUI
 
     attr_reader :modal
 
+    # TODO: Remove this once Phlex 2.0 is released.
+    #
+    # The cleanest way to do this is with a single:
+    #
+    # onclick: "#{Phlex::Escape.html_escape(modal)}.showModal()"
+    #
+    # However, currently, Phlex does not allow you to use the "onclick"
+    # attribute.
+    #
+    # Once Phlex 2.0 is released, it will add a #safe method
+    # that will allow us to replace this with a single line:
+    #
+    # onclick: safe("#{Phlex::Escape.html_escape(modal)}.showModal()")
+    def build_button_via_unsafe_raw(classes, &)
+      classes = Phlex::Escape.html_escape(classes.join(" "))
+      @options = options
+        .merge(onclick: "#{modal}.showModal()")
+        .reduce("") do |acc, (k, v)|
+        if k == :data
+          v.each do |k, v|
+            k = Phlex::Escape.html_escape(k)
+            v = Phlex::Escape.html_escape(v)
+            acc += " data-#{k}=\"#{v}\""
+          end
+          acc
+        else
+          k = Phlex::Escape.html_escape(k)
+          v = Phlex::Escape.html_escape(v)
+          "#{acc} #{k}=\"#{v}\""
+        end
+      end.strip
+
+      unsafe_raw %(<button class="#{classes}" #{options}>#{capture(&)}</button>)
+    end
+
     register_modifiers(
       # "sm:no-animation"
       # "md:no-animation"

data/lib/phlexy_ui/navbar.rb

@@ -10,6 +10,7 @@ module PhlexyUI
     def view_template(&)
       generate_classes!(
         component_html_class: :navbar,
+        modifiers_map: modifiers,
         base_modifiers:,
         options:
       ).then do |classes|
@@ -28,5 +29,52 @@ module PhlexyUI
     def end(&)
       div(class: :"navbar-end", &)
     end
+
+    register_modifiers(
+      # "sm:bg-primary sm:text-primary-content"
+      # "md:bg-primary md:text-primary-content"
+      # "lg:bg-primary lg:text-primary-content"
+      primary: "bg-primary text-primary-content",
+      # "sm:bg-secondary sm:text-secondary-content"
+      # "md:bg-secondary md:text-secondary-content"
+      # "lg:bg-secondary lg:text-secondary-content"
+      secondary: "bg-secondary text-secondary-content",
+      # "sm:bg-accent sm:text-accent-content"
+      # "md:bg-accent md:text-accent-content"
+      # "lg:bg-accent lg:text-accent-content"
+      accent: "bg-accent text-accent-content",
+      # "sm:bg-neutral sm:text-neutral-content"
+      # "md:bg-neutral md:text-neutral-content"
+      # "lg:bg-neutral lg:text-neutral-content"
+      neutral: "bg-neutral text-neutral-content",
+      # "sm:bg-base-100 sm:text-base-content"
+      # "md:bg-base-100 md:text-base-content"
+      # "lg:bg-base-100 lg:text-base-content"
+      base_100: "bg-base-100 text-base-content",
+      # "sm:bg-base-200 sm:text-base-content"
+      # "md:bg-base-200 md:text-base-content"
+      # "lg:bg-base-200 lg:text-base-content"
+      base_200: "bg-base-200 text-base-content",
+      # "sm:bg-base-300 sm:text-base-content"
+      # "md:bg-base-300 md:text-base-content"
+      # "lg:bg-base-300 lg:text-base-content"
+      base_300: "bg-base-300 text-base-content",
+      # "sm:bg-info sm:text-info-content"
+      # "md:bg-info sm:text-info-content"
+      # "lg:bg-info sm:text-info-content"
+      info: "bg-info text-info-content",
+      # "sm:bg-success sm:text-success-content"
+      # "md:bg-success md:text-success-content"
+      # "lg:bg-success lg:text-success-content"
+      success: "bg-success text-success-content",
+      # "sm:bg-warning sm:text-warning-content"
+      # "md:bg-warning md:text-warning-content"
+      # "lg:bg-warning lg:text-warning-content"
+      warning: "bg-warning text-warning-content",
+      # "sm:bg-error sm:text-error-content"
+      # "md:bg-error md:text-error-content"
+      # "lg:bg-error lg:text-error-content"
+      error: "bg-error text-error-content"
+    )
   end
 end

data/lib/phlexy_ui/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module PhlexyUI
-  VERSION = "0.1.8"
+  VERSION = "0.1.10"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: phlexy_ui
 version: !ruby/object:Gem::Version
-  version: 0.1.8
+  version: 0.1.10
 platform: ruby
 authors:
 - David Alejandro Aguilar Ramos
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2024-09-27 00:00:00.000000000 Z
+date: 2024-09-29 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: phlex
@@ -144,7 +144,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.5.10
+rubygems_version: 3.5.20
 signing_key:
 specification_version: 4
 summary: PhlexyUI is a Ruby UI component library for DaisyUI using Phlex