phlex_ui 0.0.5 → 0.1.6

data/lib/phlex_ui/alert_dialog/header.rb

@@ -1,17 +1,17 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class AlertDialog::Header < Base
-        def template(&)
-            div(**attrs, &)
-        end
+  class AlertDialog::Header < Base
+    def template(&block)
+      div(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                class: "flex flex-col space-y-2 text-center sm:text-left"
-            }
-        end
+    def default_attrs
+      {
+        class: "flex flex-col space-y-2 text-center sm:text-left"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/alert_dialog/title.rb

@@ -1,17 +1,17 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class AlertDialog::Title < Base
-        def template(&)
-            h2(**attrs, &)
-        end
+  class AlertDialog::Title < Base
+    def template(&block)
+      h2(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                class: "text-lg font-semibold"
-            }
-        end
+    def default_attrs
+      {
+        class: "text-lg font-semibold"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/alert_dialog/trigger.rb

@@ -1,18 +1,18 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class AlertDialog::Trigger < Base
-        def template(&)
-            div(**attrs, &)
-        end
+  class AlertDialog::Trigger < Base
+    def template(&block)
+      div(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                data: { action: "click->alert-dialog#open" },
-                class: 'inline-block'
-            }
-        end
+    def default_attrs
+      {
+        data: {action: "click->alert-dialog#open"},
+        class: "inline-block"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/alert_dialog.rb

@@ -1,26 +1,26 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class AlertDialog < Base
-        def initialize(open: false, **attrs)
-            @open = open
-            super(**attrs)
-        end
+  class AlertDialog < Base
+    def initialize(open: false, **attrs)
+      @open = open
+      super(**attrs)
+    end
 
-        def template(&)
-            div(**attrs, &)
-        end
+    def template(&block)
+      div(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                data: {
-                    controller: 'alert-dialog',
-                    alert_dialog_open_value: @open 
-                },
-                class: 'inline-block'
-            }
-        end
+    def default_attrs
+      {
+        data: {
+          controller: "alert-dialog",
+          alert_dialog_open_value: @open
+        },
+        class: "inline-block"
+      }
     end
+  end
 end

data/lib/phlex_ui/aspect_ratio.rb

@@ -1,33 +1,33 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class AspectRatio < Base
-        def initialize(aspect_ratio: "16/9", **attrs)
-            raise "aspect_ratio must be in the format of a string with a slash in the middle (eg. '16/9', '1/1')" unless aspect_ratio.is_a?(String) && aspect_ratio.include?("/")
+  class AspectRatio < Base
+    def initialize(aspect_ratio: "16/9", **attrs)
+      raise "aspect_ratio must be in the format of a string with a slash in the middle (eg. '16/9', '1/1')" unless aspect_ratio.is_a?(String) && aspect_ratio.include?("/")
 
-            @aspect_ratio = aspect_ratio
-            super(**attrs)
-        end
+      @aspect_ratio = aspect_ratio
+      super(**attrs)
+    end
 
-        def template(&)
-            div(
-                class: "relative w-full",
-                style: "padding-bottom: #{padding_bottom}%;",
-            ) do
-                div(**attrs, &)
-            end
-        end
+    def template(&block)
+      div(
+        class: "relative w-full",
+        style: "padding-bottom: #{padding_bottom}%;"
+      ) do
+        div(**attrs, &block)
+      end
+    end
 
-        private
+    private
 
-        def padding_bottom
-            @aspect_ratio.split("/").map(&:to_i).reverse.reduce(&:fdiv) * 100
-        end
+    def padding_bottom
+      @aspect_ratio.split("/").map(&:to_i).reverse.reduce(&:fdiv) * 100
+    end
 
-        def default_attrs
-            {
-                class: "bg-muted-background absolute inset-0 [&>img]:object-cover [&>img]:absolute [&>img]:h-full [&>img]:w-full [&>img]:inset-0 [&>img]:text-transparent"
-            }
-        end
+    def default_attrs
+      {
+        class: "bg-muted absolute inset-0 [&>img]:object-cover [&>img]:absolute [&>img]:h-full [&>img]:w-full [&>img]:inset-0 [&>img]:text-transparent"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/attribute_merger.rb

@@ -1,75 +1,73 @@
 module PhlexUI
-    class AttributeMerger
-        attr_reader :default_attrs, :user_attrs
-        OVERRIDE_KEY = '!'.freeze
+  class AttributeMerger
+    attr_reader :default_attrs, :user_attrs
+    OVERRIDE_KEY = "!".freeze
 
-        def initialize(default_attrs, user_attrs)
-            @default_attrs = flatten_hash(default_attrs)
-            @user_attrs = flatten_hash(user_attrs)
-        end
-
-        def call
-            merged_attrs = merge_hashes(default_attrs, non_override_attrs)
-            mix(merged_attrs, override_attrs)
-        end
+    def initialize(default_attrs, user_attrs)
+      @default_attrs = flatten_hash(default_attrs)
+      @user_attrs = flatten_hash(user_attrs)
+    end
 
-        private
+    def call
+      merged_attrs = merge_hashes(default_attrs, non_override_attrs)
+      mix(merged_attrs, override_attrs)
+    end
 
-        # @return [Hash]
-        def mix(*args)
-            args.each_with_object({}) do |object, result|
-                result.merge!(object) do |_key, old, new|
-                    case new
-                    when Hash
-                        old.is_a?(Hash) ? mix(old, new) : new
-                    when Array
-                        old.is_a?(Array) ? (old + new) : new
-                    when String
-                        old.is_a?(String) ? "#{old} #{new}" : new
-                    else
-                        new
-                    end
-                end
+    private
 
-                result.transform_keys! do |key|
-                    key.end_with?("!") ? key.name.chop.to_sym : key
-                end
-            end
+    # @return [Hash]
+    def mix(*args)
+      args.each_with_object({}) do |object, result|
+        result.merge!(object) do |_key, old, new|
+          case new
+          when Hash
+            old.is_a?(Hash) ? mix(old, new) : new
+          when Array
+            old.is_a?(Array) ? (old + new) : new
+          when String
+            old.is_a?(String) ? "#{old} #{new}" : new
+          else
+            new
+          end
         end
 
-        def override_attrs
-            user_attrs.select do |key, value|
-                key.to_s.include?(OVERRIDE_KEY)
-            end
+        result.transform_keys! do |key|
+          key.end_with?("!") ? key.name.chop.to_sym : key
         end
+      end
+    end
 
-        def non_override_attrs
-            user_attrs.reject do |key, value|
-                key.to_s.include?(OVERRIDE_KEY)
-            end
-        end
+    def override_attrs
+      user_attrs.select do |key, value|
+        key.to_s.include?(OVERRIDE_KEY)
+      end
+    end
 
-        def flatten_hash(hash, parent_key = '', result_hash = {})
-            hash.each do |key, value|
-                new_key = parent_key.empty? ? key : "#{parent_key}_#{key}".to_sym
-                if value.is_a? Hash
-                flatten_hash(value, new_key, result_hash)
-                else
-                result_hash[new_key] = value
-                end
-            end
-            result_hash
-        end
+    def non_override_attrs
+      user_attrs.reject do |key, value|
+        key.to_s.include?(OVERRIDE_KEY)
+      end
+    end
 
-        def merge_hashes(hash1, hash2)
-            flat_hash1 = flatten_hash(hash1)
-            flat_hash2 = flatten_hash(hash2)
+    def flatten_hash(hash, parent_key = "", result_hash = {})
+      hash.each do |key, value|
+        new_key = parent_key.empty? ? key : :"#{parent_key}_#{key}"
+        if value.is_a? Hash
+          flatten_hash(value, new_key, result_hash)
+        else
+          result_hash[new_key] = value
+        end
+      end
+      result_hash
+    end
 
-            merged = flat_hash1.merge(flat_hash2) do |key, oldval, newval|
-                "#{oldval} #{newval}"
-            end
+    def merge_hashes(hash1, hash2)
+      flat_hash1 = flatten_hash(hash1)
+      flat_hash2 = flatten_hash(hash2)
 
-            merged
-        end
+      flat_hash1.merge(flat_hash2) do |key, oldval, newval|
+        "#{oldval} #{newval}"
+      end
     end
-end
+  end
+end

data/lib/phlex_ui/avatar/builder.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+module PhlexUI
+  class Avatar::Builder < Base
+    def initialize(size: :md, src: nil, alt: nil, initials: nil, **attrs)
+      @size = size
+      @src = src
+      @alt = alt
+      @initials = initials
+      super(**attrs)
+    end
+
+    def template
+      render PhlexUI::Avatar.new(size: @size, **attrs) do
+        render_image if @src
+        render_initials if @initials
+      end
+    end
+
+    private
+
+    def render_image
+      render ::PhlexUI::Avatar::Image.new(src: @src, alt: @alt)
+    end
+
+    def render_initials
+      render ::PhlexUI::Avatar::Fallback.new { @initials }
+    end
+
+    def default_attrs
+      {
+        class: tokens("relative flex shrink-0 overflow-hidden rounded-full", @size_classes)
+      }
+    end
+  end
+end

data/lib/phlex_ui/avatar/fallback.rb

@@ -1,17 +1,17 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Avatar::Fallback < Base
-        def template(&)
-            span(**attrs, &)
-        end
+  class Avatar::Fallback < Base
+    def template(&block)
+      span(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                class: "flex h-full w-full items-center justify-center rounded-full bg-muted-background"
-            }
-        end
+    def default_attrs
+      {
+        class: "flex h-full w-full items-center justify-center rounded-full bg-muted"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/avatar/image.rb

@@ -1,26 +1,26 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Avatar::Image < Base
-        def initialize(src:, alt: '', **attrs)
-            @src = src
-            @alt = alt
-            super(**attrs)
-        end
+  class Avatar::Image < Base
+    def initialize(src:, alt: "", **attrs)
+      @src = src
+      @alt = alt
+      super(**attrs)
+    end
 
-        def template
-            img(**attrs)
-        end
+    def template
+      img(**attrs)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                loading: "lazy",
-                class: "aspect-square h-full w-full",
-                alt: @alt,
-                src: @src
-            }
-        end
+    def default_attrs
+      {
+        loading: "lazy",
+        class: "aspect-square h-full w-full",
+        alt: @alt,
+        src: @src
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/avatar.rb

@@ -1,49 +1,31 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Avatar < Base
-        SIZES = {
-            xs: "h-4 w-4 text-[0.5rem]",
-            sm: "h-6 w-6 text-xs",
-            md: "h-10 w-10 text-base",
-            lg: "h-14 w-14 text-xl",
-            xl: "h-20 w-20 text-3xl"
-        }
+  class Avatar < Base
+    SIZES = {
+      xs: "h-4 w-4 text-[0.5rem]",
+      sm: "h-6 w-6 text-xs",
+      md: "h-10 w-10 text-base",
+      lg: "h-14 w-14 text-xl",
+      xl: "h-20 w-20 text-3xl"
+    }
 
-        def initialize(size: :md, src: nil, alt: nil, initials: nil, **attrs)
-            @size = size
-            @src = src
-            @alt = alt
-            @initials = initials
-            @size_classes = SIZES[@size]
-            super(**attrs)
-        end
-
-        def template(&block)
-            if block_given?
-                span(**attrs, &block)
-            else
-                span(**attrs) do
-                    render_image if @src
-                    render_initials
-                end
-            end
-        end
-
-        private
+    def initialize(size: :md, **attrs)
+      @size = size
+      @size_classes = SIZES[@size]
+      super(**attrs)
+    end
 
-        def render_image
-            render ::PhlexUI::Avatar::Image.new(src: @src, alt: @alt)
-        end
+    def template(&block)
+      span(**attrs, &block)
+    end
 
-        def render_initials
-            render ::PhlexUI::Avatar::Fallback.new { @initials }
-        end
+    private
 
-        def default_attrs
-            {
-                class: tokens("relative flex shrink-0 overflow-hidden rounded-full", @size_classes)
-            }
-        end
+    def default_attrs
+      {
+        class: tokens("relative flex shrink-0 overflow-hidden rounded-full", @size_classes)
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/badge.rb

@@ -1,60 +1,60 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Badge < Base
-        SIZES = {
-            sm: "px-1.5 py-0.5 text-xs",
-            md: "px-2 py-1 text-xs",
-            lg: "px-3 py-1 text-sm"
-        }
+  class Badge < Base
+    SIZES = {
+      sm: "px-1.5 py-0.5 text-xs",
+      md: "px-2 py-1 text-xs",
+      lg: "px-3 py-1 text-sm"
+    }
 
-        COLORS = {
-            primary: "text-primary bg-primary-50 dark:bg-primary-400/20 ring-primary-600/20",
-            secondary: "text-text bg-muted-background ring-border",
-            outline: "text-text bg-background ring-border",
-            destructive: "text-destructive-600 bg-destructive-50 dark:bg-destructive-400/20 dark:text-destructive-400 ring-destructive-600/20",
-            success: "text-success-600 bg-success-50 dark:bg-success-400/20 dark:text-success-400 ring-success-600/20",
-            warning: "text-warning-600 bg-warning-50 dark:bg-warning-400/20 dark:text-warning-400 ring-warning-600/20",
-            slate: "text-slate-600 bg-slate-50 dark:bg-slate-400/20 dark:text-slate-400 ring-slate-600/20",
-            gray: "text-gray-600 bg-gray-50 dark:bg-gray-400/20 dark:text-gray-400 ring-gray-600/20",
-            zinc: "text-zinc-600 bg-zinc-50 dark:bg-zinc-400/20 dark:text-zinc-400 ring-zinc-600/20",
-            neutral: "text-neutral-600 bg-neutral-50 dark:bg-neutral-400/20 dark:text-neutral-400 ring-neutral-600/20",
-            stone: "text-stone-600 bg-stone-50 dark:bg-stone-400/20 dark:text-stone-400 ring-stone-600/20",
-            red: "text-red-600 bg-red-50 dark:bg-red-400/20 dark:text-red-400 ring-red-600/20",
-            orange: "text-orange-600 bg-orange-50 dark:bg-orange-400/20 dark:text-orange-400 ring-orange-600/20",
-            amber: "text-amber-600 bg-amber-50 dark:bg-amber-400/20 dark:text-amber-400 ring-amber-600/20",
-            yellow: "text-yellow-600 bg-yellow-50 dark:bg-yellow-400/20 dark:text-yellow-400 ring-yellow-600/20",
-            lime: "text-lime-600 bg-lime-50 dark:bg-lime-400/20 dark:text-lime-400 ring-lime-600/20",
-            green: "text-green-600 bg-green-50 dark:bg-green-400/20 dark:text-green-400 ring-green-600/20",
-            emerald: "text-emerald-600 bg-emerald-50 dark:bg-emerald-400/20 dark:text-emerald-400 ring-emerald-600/20",
-            teal: "text-teal-600 bg-teal-50 dark:bg-teal-400/20 dark:text-teal-400 ring-teal-600/20",
-            cyan: "text-cyan-600 bg-cyan-50 dark:bg-cyan-400/20 dark:text-cyan-400 ring-cyan-600/20",
-            sky: "text-sky-600 bg-sky-50 dark:bg-sky-400/20 dark:text-sky-400 ring-sky-600/20",
-            blue: "text-blue-600 bg-blue-50 dark:bg-blue-400/20 dark:text-blue-400 ring-blue-600/20",
-            indigo: "text-indigo-600 bg-indigo-50 dark:bg-indigo-400/20 dark:text-indigo-400 ring-indigo-600/20",
-            violet: "text-violet-600 bg-violet-50 dark:bg-violet-400/20 dark:text-violet-400 ring-violet-600/20",
-            purple: "text-purple-600 bg-purple-50 dark:bg-purple-400/20 dark:text-purple-400 ring-purple-600/20",
-            fuchsia: "text-fuchsia-600 bg-fuchsia-50 dark:bg-fuchsia-400/20 dark:text-fuchsia-400 ring-fuchsia-600/20",
-            pink: "text-pink-600 bg-pink-50 dark:bg-pink-400/20 dark:text-pink-400 ring-pink-600/20",
-            rose: "text-rose-600 bg-rose-50 dark:bg-rose-400/20 dark:text-rose-400 ring-rose-600/20"
-        }
+    COLORS = {
+      primary: "text-primary bg-primary/5 ring-primary/20",
+      secondary: "text-secondary bg-secondary/10 ring-secondary/20",
+      outline: "text-foreground bg-background ring-border",
+      destructive: "text-destructive bg-destructive/10 ring-destructive/20",
+      success: "text-success bg-success/10 ring-success/20",
+      warning: "text-warning bg-warning/10 ring-warning/20",
+      slate: "text-slate-500 bg-slate-500/10 ring-slate-500/20",
+      gray: "text-gray-500 bg-gray-500/10 ring-gray-500/20",
+      zinc: "text-zinc-500 bg-zinc-500/10 ring-zinc-500/20",
+      neutral: "text-neutral-500 bg-neutral-500/10 ring-neutral-500/20",
+      stone: "text-stone-500 bg-stone-500/10 ring-stone-500/20",
+      red: "text-red-500 bg-red-500/10 ring-red-500/20",
+      orange: "text-orange-500 bg-orange-500/10 ring-orange-500/20",
+      amber: "text-amber-500 bg-amber-500/10 ring-amber-500/20",
+      yellow: "text-yellow-500 bg-yellow-500/10 ring-yellow-500/20",
+      lime: "text-lime-500 bg-lime-500/10 ring-lime-500/20",
+      green: "text-green-500 bg-green-500/10 ring-green-500/20",
+      emerald: "text-emerald-500 bg-emerald-500/10 ring-emerald-500/20",
+      teal: "text-teal-500 bg-teal-500/10 ring-teal-500/20",
+      cyan: "text-cyan-500 bg-cyan-500/10 ring-cyan-500/20",
+      sky: "text-sky-500 bg-sky-500/10 ring-sky-500/20",
+      blue: "text-blue-500 bg-blue-500/10 ring-blue-500/20",
+      indigo: "text-indigo-500 bg-indigo-500/10 ring-indigo-500/20",
+      violet: "text-violet-500 bg-violet-500/10 ring-violet-500/20",
+      purple: "text-purple-500 bg-purple-500/10 ring-purple-500/20",
+      fuchsia: "text-fuchsia-500 bg-fuchsia-500/10 ring-fuchsia-500/20",
+      pink: "text-pink-500 bg-pink-500/10 ring-pink-500/20",
+      rose: "text-rose-500 bg-rose-500/10 ring-rose-500/20"
+    }
 
-        def initialize(variant: :primary, size: :md, **args)
-            @variant = variant
-            @size = size
-            super(**args)
-        end
+    def initialize(variant: :primary, size: :md, **args)
+      @variant = variant
+      @size = size
+      super(**args)
+    end
 
-        def template(&)
-            span(**attrs, &)
-        end
+    def template(&block)
+      span(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                class: tokens("inline-flex items-center rounded-md font-medium ring-1 ring-inset", SIZES[@size], COLORS[@variant]),
-            }
-        end
+    def default_attrs
+      {
+        class: tokens("inline-flex items-center rounded-md font-medium ring-1 ring-inset", SIZES[@size], COLORS[@variant])
+      }
     end
+  end
 end