phlex_ui 0.0.5 → 0.1.6

data/lib/phlex_ui/form/item.rb

@@ -1,17 +1,17 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Form::Item < Base
-        def template(&)
-            div(**attrs, &)
-        end
+  class Form::Item < Base
+    def template(&block)
+      div(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                class: "space-y-2"
-            }
-        end
+    def default_attrs
+      {
+        class: "space-y-2"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/form/spacer.rb

@@ -1,17 +1,17 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Form::Spacer < Base
-        def template(&)
-            div(**attrs, &)
-        end
+  class Form::Spacer < Base
+    def template(&block)
+      div(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                class: "space-y-4"
-            }
-        end
+    def default_attrs
+      {
+        class: "space-y-4"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/form.rb

@@ -1,34 +1,15 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Form < Base
-        def template(&)
-            form(**attrs, &)
-        end
-
-        def input(name, label: nil, hint: false, error: nil, **input_attrs)
-            name = name.to_s
-            label ||= convert_name_to_label(name)
-
-            render PhlexUI::Form::Item.new do
-                render PhlexUI::Label.new(for: name) { label } if label
-                render PhlexUI::Input.new(name: name, id: name, **input_attrs)
-                render PhlexUI::Hint.new { hint } if hint
-            end
-        end
-
-        def button(**button_attrs, &)
-            render PhlexUI::Button.new(**button_attrs, &)
-        end
-
-        private
+  class Form < Base
+    def template(&block)
+      form(**attrs, &block)
+    end
 
-        def convert_name_to_label(name)
-            name.to_s.split("_").map(&:capitalize).join(" ")
-        end
+    private
 
-        def default_attrs
-            {}
-        end
+    def default_attrs
+      {}
     end
-end
+  end
+end

data/lib/phlex_ui/hint.rb

@@ -1,17 +1,17 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Hint < Base
-        def template(&)
-            p(**attrs, &)
-        end
+  class Hint < Base
+    def template(&block)
+      p(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                class: "text-[0.8rem] text-muted-text"
-            }
-        end
+    def default_attrs
+      {
+        class: "text-[0.8rem] text-muted-foreground"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/hover_card/content.rb

@@ -1,22 +1,22 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class HoverCard::Content < Base
-        def template(&)
-            template_tag(data: { popover_target: "content" }) do
-                div(**attrs, &)
-            end
-        end
+  class HoverCard::Content < Base
+    def template(&block)
+      template_tag(data: {popover_target: "content"}) do
+        div(**attrs, &block)
+      end
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                data: {
-                    state: :open
-                },
-                class: "z-50 rounded-md border bg-background p-4 text-text shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
-            }
-        end
+    def default_attrs
+      {
+        data: {
+          state: :open
+        },
+        class: "z-50 rounded-md border bg-background p-4 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/hover_card/trigger.rb

@@ -1,19 +1,20 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class HoverCard::Trigger < Base
-        def template(&)
-            div(**attrs, &)
-        end
+  class HoverCard::Trigger < Base
+    def template(&block)
+      div(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                data: {
-                    popover_target: 'trigger'
-                }
-            }
-        end
+    def default_attrs
+      {
+        data: {
+          popover_target: "trigger"
+        },
+        class: "inline-block"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/hover_card.rb

@@ -1,27 +1,27 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class HoverCard < Base
-        def initialize(option: {}, **attrs)
-            @options = option
-            @options[:delay] ||= [500, 250]
-            @options[:trigger] ||= 'mouseenter focus click'
-            super(**attrs)
-        end
+  class HoverCard < Base
+    def initialize(option: {}, **attrs)
+      @options = option
+      @options[:delay] ||= [500, 250]
+      @options[:trigger] ||= "mouseenter focus click"
+      super(**attrs)
+    end
 
-        def template(&)
-            div(**attrs, &)
-        end
+    def template(&block)
+      div(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                data: {
-                    controller: "popover",
-                    popover_options_value: @options.to_json
-                }
-            }
-        end
+    def default_attrs
+      {
+        data: {
+          controller: "popover",
+          popover_options_value: @options.to_json
+        }
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/input.rb

@@ -1,29 +1,29 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Input < Base
-        def initialize(type: :string, error: nil, **attrs)
-            @type = type.to_sym
-            @error = error
-            super(**attrs)
-        end
+  class Input < Base
+    def initialize(type: :string, error: nil, **attrs)
+      @type = type.to_sym
+      @error = error
+      super(**attrs)
+    end
 
-        def template
-            input(type: @type, **attrs)
-            render PhlexUI::InputError.new { @error } if @error
-        end
+    def template
+      input(type: @type, **attrs)
+      render PhlexUI::InputError.new { @error } if @error
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                class: tokens(
-                    "flex h-9 w-full rounded-md border bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50",
-                    -> { @error.nil? } => "border-border focus-visible:ring-ring placeholder:text-muted-text",
-                    -> { @error.present? } => "placeholder:text-destructive-900/50 dark:placeholder:text-destructive-200/50 text-destructive-900 dark:text-destructive-300 border-destructive-300 dark:border-destructive focus-visible:ring-destructive dark:focus-visible:ring-destructive-300",
-                    -> { @type == :file } => "pt-1.5 dark:file:text-white"
-                ),
-            }
-        end
+    def default_attrs
+      {
+        class: tokens(
+          "flex h-9 w-full rounded-md border bg-background px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50",
+          -> { @error.nil? } => "border-border focus-visible:ring-ring placeholder:text-muted-foreground",
+          -> { @error.present? } => "placeholder:text-destructive/60 text-destructive dark:text-destructive border-destructive focus-visible:ring-destructive",
+          -> { @type == :file } => "pt-1.5 dark:file:text-white"
+        )
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/input_error.rb

@@ -1,17 +1,17 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class InputError < Base
-        def template(&)
-            p(**attrs, &)
-        end
+  class InputError < Base
+    def template(&block)
+      p(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                class: "mt-2 text-sm text-destructive"
-            }
-        end
+    def default_attrs
+      {
+        class: "mt-2 text-sm text-destructive"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/label.rb

@@ -1,17 +1,17 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Label < Base
-        def template(&)
-            label(**attrs, &)
-        end
+  class Label < Base
+    def template(&block)
+      label(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                class: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-            }
-        end
+    def default_attrs
+      {
+        class: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/link.rb

@@ -1,97 +1,97 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Link < Base
-        def initialize(href: "#", variant: :link, size: :md, icon: false, **attrs)
-            @href = href
-            @variant = variant.to_sym
-            @size = size.to_sym
-            @icon = icon
-            super(**attrs)
-        end
+  class Link < Base
+    def initialize(href: "#", variant: :link, size: :md, icon: false, **attrs)
+      @href = href
+      @variant = variant.to_sym
+      @size = size.to_sym
+      @icon = icon
+      super(**attrs)
+    end
 
-        def template(&)
-            a(href: @href, **attrs, &)
-        end
+    def template(&block)
+      a(href: @href, **attrs, &block)
+    end
 
-        private
+    private
 
-        def size_classes
-            if @icon
-                case @size
-                when :sm then "h-6 w-6"
-                when :md then "h-9 w-9"
-                when :lg then "h-10 w-10"
-                when :xl then "h-12 w-12"
-                end
-            else
-                case @size
-                when :sm then "px-3 py-1.5 h-8 text-xs"
-                when :md then "px-4 py-2 h-9 text-sm"
-                when :lg then "px-4 py-2 h-10 text-base"
-                when :xl then "px-6 py-3 h-12 text-base"
-                end
-            end
+    def size_classes
+      if @icon
+        case @size
+        when :sm then "h-6 w-6"
+        when :md then "h-9 w-9"
+        when :lg then "h-10 w-10"
+        when :xl then "h-12 w-12"
         end
-
-        def primary_classes
-            tokens(
-                "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-text shadow hover:bg-primary/90",
-                size_classes
-            )
+      else
+        case @size
+        when :sm then "px-3 py-1.5 h-8 text-xs"
+        when :md then "px-4 py-2 h-9 text-sm"
+        when :lg then "px-4 py-2 h-10 text-base"
+        when :xl then "px-6 py-3 h-12 text-base"
         end
+      end
+    end
 
-        def link_classes
-            tokens(
-                "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 text-primary underline-offset-4 hover:underline",
-                size_classes
-            )
-        end
+    def primary_classes
+      tokens(
+        "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        size_classes
+      )
+    end
 
-        def secondary_classes
-            tokens(
-                "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-muted-background text-text shadow-sm hover:bg-opacity-80",
-                size_classes
-            )
-        end
+    def link_classes
+      tokens(
+        "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 text-primary underline-offset-4 hover:underline",
+        size_classes
+      )
+    end
 
-        def destructive_classes
-            tokens(
-                "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-destructive text-white shadow-sm hover:bg-destructive/90",
-                size_classes
-            )
-        end
+    def secondary_classes
+      tokens(
+        "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-opacity-80",
+        size_classes
+      )
+    end
 
-        def outline_classes
-            tokens(
-                "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-sm hover:bg-accent-background hover:text-accent-text",
-                size_classes
-            )
-        end
+    def destructive_classes
+      tokens(
+        "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+        size_classes
+      )
+    end
 
-        def ghost_classes
-            tokens(
-                "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent-background hover:text-accent-text",
-                size_classes
-            )
-        end
+    def outline_classes
+      tokens(
+        "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+        size_classes
+      )
+    end
 
-        def default_classes
-            case @variant
-            when :primary then primary_classes
-            when :link then link_classes
-            when :secondary then secondary_classes
-            when :destructive then destructive_classes
-            when :outline then outline_classes
-            when :ghost then ghost_classes
-            end
-        end
+    def ghost_classes
+      tokens(
+        "whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground",
+        size_classes
+      )
+    end
 
-        def default_attrs
-            {
-                type: "button",
-                class: default_classes,
-            }
-        end
+    def default_classes
+      case @variant
+      when :primary then primary_classes
+      when :link then link_classes
+      when :secondary then secondary_classes
+      when :destructive then destructive_classes
+      when :outline then outline_classes
+      when :ghost then ghost_classes
+      end
+    end
+
+    def default_attrs
+      {
+        type: "button",
+        class: default_classes
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/popover/content.rb

@@ -1,22 +1,22 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Popover::Content < Base
-        def template(&)
-            template_tag(data: { popover_target: "content" }) do
-                div(**attrs, &)
-            end
-        end
+  class Popover::Content < Base
+    def template(&block)
+      template_tag(data: {popover_target: "content"}) do
+        div(**attrs, &block)
+      end
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                data: {
-                    state: :open
-                },
-                class: "z-50 rounded-md border bg-background p-2 text-text shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
-            }
-        end
+    def default_attrs
+      {
+        data: {
+          state: :open
+        },
+        class: "z-50 rounded-md border bg-background p-2 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
+      }
     end
-end
+  end
+end

data/lib/phlex_ui/popover/trigger.rb

@@ -1,19 +1,20 @@
 # frozen_string_literal: true
 
 module PhlexUI
-    class Popover::Trigger < Base
-        def template(&)
-            div(**attrs, &)
-        end
+  class Popover::Trigger < Base
+    def template(&block)
+      div(**attrs, &block)
+    end
 
-        private
+    private
 
-        def default_attrs
-            {
-                data: {
-                    popover_target: 'trigger'
-                }
-            }
-        end
+    def default_attrs
+      {
+        data: {
+          popover_target: "trigger"
+        },
+        class: "inline-block"
+      }
     end
-end
+  end
+end