fernandes-ui 0.1.0

data/app/view_components/ui/carousel_next_component.rb

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+    class UI::CarouselNextComponent < ViewComponent::Base
+      def initialize(classes: nil, **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        extend UI::CarouselNextBehavior
+        render UI::ButtonComponent.new(**carousel_next_html_attributes, classes: carousel_next_classes, variant: :ghost, size: :icon) do
+          safe_join([
+            tag.svg(
+              xmlns: "http://www.w3.org/2000/svg",
+              width: "24",
+              height: "24",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              stroke_width: "2",
+              stroke_linecap: "round",
+              stroke_linejoin: "round",
+              class: "size-4"
+            ) do
+              tag.path(d: "m9 18 6-6-6-6")
+            end,
+            content_tag(:span, "Next slide", class: "sr-only")
+          ])
+        end
+      end
+    end

data/app/view_components/ui/carousel_previous_component.rb

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+    class UI::CarouselPreviousComponent < ViewComponent::Base
+      def initialize(classes: nil, **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        extend UI::CarouselPreviousBehavior
+        render UI::ButtonComponent.new(**carousel_previous_html_attributes, classes: carousel_previous_classes, variant: :ghost, size: :icon) do
+          safe_join([
+            tag.svg(
+              xmlns: "http://www.w3.org/2000/svg",
+              width: "24",
+              height: "24",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              stroke_width: "2",
+              stroke_linecap: "round",
+              stroke_linejoin: "round",
+              class: "size-4"
+            ) do
+              tag.path(d: "m15 18-6-6 6-6")
+            end,
+            content_tag(:span, "Previous slide", class: "sr-only")
+          ])
+        end
+      end
+    end

data/app/view_components/ui/checkbox_component.rb

@@ -0,0 +1,55 @@
+# frozen_string_literal: true
+
+    class UI::CheckboxComponent < ViewComponent::Base
+      include UI::CheckboxBehavior
+
+      def initialize(
+        name: nil,
+        id: nil,
+        value: nil,
+        checked: false,
+        disabled: false,
+        required: false,
+        classes: "",
+        **attributes
+      )
+        @name = name
+        @id = id
+        @value = value
+        @checked = checked
+        @disabled = disabled
+        @required = required
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag :div, class: "relative inline-flex items-center justify-center" do
+          safe_join([
+            content_tag(:input, nil, checkbox_html_attributes),
+            checkmark_icon
+          ])
+        end
+      end
+
+      private
+
+      attr_reader :classes, :attributes
+
+      def checkmark_icon
+        content_tag(
+          :svg,
+          content_tag(:path, nil, d: "M20 6 9 17l-5-5"),
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "24",
+          height: "24",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round",
+          class: "size-3.5 pointer-events-none absolute text-primary-foreground opacity-0 peer-checked:opacity-100 transition-opacity"
+        )
+      end
+    end

data/app/view_components/ui/collapsible_component.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+    class UI::CollapsibleComponent < ViewComponent::Base
+      include UI::CollapsibleBehavior
+
+      def initialize(open: false, disabled: false, as_child: false, classes: "", **attributes)
+        @open = open
+        @disabled = disabled
+        @as_child = as_child
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        collapsible_attrs = collapsible_html_attributes.deep_merge(@attributes)
+
+        if @as_child
+          content
+        else
+          content_tag(:div, content, **collapsible_attrs)
+        end
+      end
+    end

data/app/view_components/ui/collapsible_content_component.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+    class UI::CollapsibleContentComponent < ViewComponent::Base
+      include UI::CollapsibleContentBehavior
+
+      def initialize(force_mount: false, classes: "", **attributes)
+        @force_mount = force_mount
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag(:div, content, **collapsible_content_html_attributes.deep_merge(@attributes))
+      end
+    end

data/app/view_components/ui/collapsible_trigger_component.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+    class UI::CollapsibleTriggerComponent < ViewComponent::Base
+      include UI::CollapsibleTriggerBehavior
+
+      def initialize(as_child: false, classes: "", **attributes)
+        @as_child = as_child
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        trigger_attrs = collapsible_trigger_html_attributes.deep_merge(@attributes)
+
+        if @as_child
+          content
+        else
+          content_tag(:button, content, type: "button", **trigger_attrs)
+        end
+      end
+    end

data/app/view_components/ui/combobox_wrapper_component.rb

@@ -0,0 +1,56 @@
+# frozen_string_literal: true
+
+    # WrapperComponent - ViewComponent implementation
+    #
+    # Wrapper component that yields combobox attributes to be spread into a container component.
+    # Used to wrap Popover/Drawer/DropdownMenu with combobox selection functionality.
+    # Uses ComboboxBehavior concern for shared attribute generation logic.
+    #
+    # The combobox pattern provides:
+    # - Selection state management via Stimulus controller
+    # - Automatic text update when item is selected
+    # - Check icon visibility control (opacity-0/100)
+    # - Container closing after selection
+    #
+    # @example With Popover
+    #   <%= render UI::WrapperComponent.new(value: "") do |combobox_attrs| %>
+    #     <%= render UI::PopoverComponent.new(**combobox_attrs, placement: "bottom-start") do %>
+    #       <%= render UI::PopoverTriggerComponent.new(as_child: true) do %>
+    #         <%= render UI::ButtonComponent.new do %>
+    #           <span data-ui--combobox-target="text">Select framework...</span>
+    #         <% end %>
+    #       <% end %>
+    #
+    #       <%= render UI::PopoverContentComponent.new do %>
+    #         <%= render UI::CommandComponent.new do %>
+    #           <%= render UI::CommandItemComponent.new(
+    #             value: "next",
+    #             data: { ui__combobox_target: "item" }
+    #           ) do %>
+    #             <span>Next.js</span>
+    #             <svg class="ml-auto h-4 w-4 opacity-0">
+    #               <path d="M20 6 9 17l-5-5"/>
+    #             </svg>
+    #           <% end %>
+    #         <% end %>
+    #       <% end %>
+    #     <% end %>
+    #   <% end %>
+    #
+    # @example With Drawer (responsive)
+    #   <%= render UI::WrapperComponent.new(value: "done") do |combobox_attrs| %>
+    #     <%= render UI::DrawerComponent.new(**combobox_attrs) do %>
+    #       ...
+    #     <% end %>
+    #   <% end %>
+    class UI::ComboboxWrapperComponent < ViewComponent::Base
+      include ComboboxBehavior
+
+      # @param value [String] Initial selected value (empty string for no selection)
+      # @param attributes [Hash] Additional HTML attributes to merge
+      def initialize(value: "", **attributes)
+        @value = value
+        @attributes = attributes
+        @combobox_html_attrs = combobox_html_attributes.deep_merge(@attributes)
+      end
+    end

data/app/view_components/ui/command_component.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+    class UI::CommandComponent < ViewComponent::Base
+      include UI::CommandBehavior
+
+      def initialize(loop: true, classes: "", **attributes)
+        @loop = loop
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag(:div, content, **command_html_attributes.deep_merge(@attributes))
+      end
+    end

data/app/view_components/ui/command_dialog_component.rb

@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+    class UI::CommandDialogComponent < ViewComponent::Base
+      include UI::CommandDialogBehavior
+
+      def initialize(shortcut: "meta+j", classes: "", **attributes)
+        @shortcut = shortcut
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag :div, **command_dialog_html_attributes.deep_merge(@attributes) do
+          render UI::DialogComponent.new(close_on_escape: true, close_on_overlay_click: true) do
+            render UI::DialogOverlayComponent.new do
+              render UI::DialogContentComponent.new(classes: command_dialog_content_classes) do
+                render UI::CommandComponent.new do
+                  content
+                end
+              end
+            end
+          end
+        end
+      end
+    end

data/app/view_components/ui/command_empty_component.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+    class UI::CommandEmptyComponent < ViewComponent::Base
+      include UI::CommandEmptyBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag(:div, content, **command_empty_html_attributes.deep_merge(@attributes))
+      end
+    end

data/app/view_components/ui/command_group_component.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+    class UI::CommandGroupComponent < ViewComponent::Base
+      include UI::CommandGroupBehavior
+
+      def initialize(heading: nil, classes: "", **attributes)
+        @heading = heading
+        @heading_id = "command-group-#{SecureRandom.hex(4)}" if heading
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag(:div, **command_group_html_attributes.deep_merge(@attributes)) do
+          safe_join([
+            (@heading ? content_tag(:div, @heading, class: command_group_heading_classes, id: @heading_id) : nil),
+            content
+          ].compact)
+        end
+      end
+    end

data/app/view_components/ui/command_input_component.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+    class UI::CommandInputComponent < ViewComponent::Base
+      include UI::CommandInputBehavior
+
+      def initialize(placeholder: "Type a command or search...", classes: "", **attributes)
+        @placeholder = placeholder
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag(:div, class: command_input_wrapper_classes) do
+          safe_join([
+            helpers.lucide_icon("search", class: "mr-2 h-4 w-4 shrink-0 opacity-50"),
+            tag.input(**command_input_html_attributes.deep_merge(@attributes))
+          ])
+        end
+      end
+    end

data/app/view_components/ui/command_item_component.rb

@@ -0,0 +1,16 @@
+# frozen_string_literal: true
+
+    class UI::CommandItemComponent < ViewComponent::Base
+      include UI::CommandItemBehavior
+
+      def initialize(value: nil, disabled: false, classes: "", **attributes)
+        @value = value
+        @disabled = disabled
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag(:div, content, **command_item_html_attributes.deep_merge(@attributes))
+      end
+    end

data/app/view_components/ui/command_list_component.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+    class UI::CommandListComponent < ViewComponent::Base
+      include UI::CommandListBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag(:div, content, **command_list_html_attributes.deep_merge(@attributes))
+      end
+    end

data/app/view_components/ui/command_separator_component.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+    class UI::CommandSeparatorComponent < ViewComponent::Base
+      include UI::CommandSeparatorBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag(:div, nil, **command_separator_html_attributes.deep_merge(@attributes))
+      end
+    end

data/app/view_components/ui/command_shortcut_component.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+    class UI::CommandShortcutComponent < ViewComponent::Base
+      include UI::CommandShortcutBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag(:span, content, **command_shortcut_html_attributes.deep_merge(@attributes))
+      end
+    end

data/app/view_components/ui/context_menu_checkbox_item_component.rb

@@ -0,0 +1,45 @@
+# frozen_string_literal: true
+
+    # CheckboxItemComponent - ViewComponent implementation
+    class UI::ContextMenuCheckboxItemComponent < ViewComponent::Base
+      include UI::ContextMenuCheckboxItemBehavior
+
+      def initialize(checked: false, classes: "", **attributes)
+        @checked = checked
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        attrs = context_menu_checkbox_item_html_attributes
+        attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
+
+        content_tag :div, **attrs.merge(@attributes.except(:data)) do
+          safe_join([
+            content_tag(:span, class: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center") do
+              render_check_icon if @checked
+            end,
+            content
+          ])
+        end
+      end
+
+      private
+
+      def render_check_icon
+        content_tag(:svg,
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "24",
+          height: "24",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round",
+          class: "size-4"
+        ) do
+          content_tag(:path, nil, d: "M20 6 9 17l-5-5")
+        end
+      end
+    end

data/app/view_components/ui/context_menu_component.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+    # ContextMenuComponent - ViewComponent implementation
+    class UI::ContextMenuComponent < ViewComponent::Base
+      include UI::ContextMenuBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        attrs = context_menu_html_attributes
+        attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
+
+        content_tag :div, **attrs.merge(@attributes.except(:data)) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/context_menu_content_component.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+    # ContentComponent - ViewComponent implementation
+    class UI::ContextMenuContentComponent < ViewComponent::Base
+      include UI::ContextMenuContentBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        attrs = context_menu_content_html_attributes
+        attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
+
+        content_tag :div, **attrs.merge(@attributes.except(:data)) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/context_menu_item_component.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+    # ItemComponent - ViewComponent implementation
+    class UI::ContextMenuItemComponent < ViewComponent::Base
+      include UI::ContextMenuItemBehavior
+
+      def initialize(href: nil, inset: false, variant: "default", classes: "", **attributes)
+        @href = href
+        @inset = inset
+        @variant = variant
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        attrs = context_menu_item_html_attributes
+        attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
+
+        if @href
+          content_tag :a, **attrs.merge(@attributes.except(:data)) do
+            content
+          end
+        else
+          content_tag :div, **attrs.merge(@attributes.except(:data)) do
+            content
+          end
+        end
+      end
+    end

data/app/view_components/ui/context_menu_label_component.rb

@@ -0,0 +1,22 @@
+# frozen_string_literal: true
+
+    # LabelComponent - ViewComponent implementation
+    class UI::ContextMenuLabelComponent < ViewComponent::Base
+      include UI::ContextMenuLabelBehavior
+
+      def initialize(inset: false, classes: "", **attributes)
+        @inset = inset
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        attrs = context_menu_label_html_attributes
+        data_attrs = attrs.delete(:data) || {}
+        data_attrs = data_attrs.merge(@attributes.fetch(:data, {}))
+
+        content_tag :div, **attrs.merge(@attributes.except(:data)).merge(data: data_attrs) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/context_menu_radio_group_component.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+    # RadioGroupComponent - ViewComponent implementation
+    class UI::ContextMenuRadioGroupComponent < ViewComponent::Base
+      include UI::ContextMenuRadioGroupBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        attrs = context_menu_radio_group_html_attributes
+
+        content_tag :div, **attrs.merge(@attributes) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/context_menu_radio_item_component.rb

@@ -0,0 +1,45 @@
+# frozen_string_literal: true
+
+    # RadioItemComponent - ViewComponent implementation
+    class UI::ContextMenuRadioItemComponent < ViewComponent::Base
+      include UI::ContextMenuRadioItemBehavior
+
+      def initialize(checked: false, classes: "", **attributes)
+        @checked = checked
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        attrs = context_menu_radio_item_html_attributes
+        attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
+
+        content_tag :div, **attrs.merge(@attributes.except(:data)) do
+          safe_join([
+            content_tag(:span, class: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center") do
+              render_circle_icon if @checked
+            end,
+            content
+          ])
+        end
+      end
+
+      private
+
+      def render_circle_icon
+        content_tag(:svg,
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "24",
+          height: "24",
+          viewBox: "0 0 24 24",
+          fill: "currentColor",
+          stroke: "currentColor",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round",
+          class: "size-2"
+        ) do
+          content_tag(:circle, nil, cx: "12", cy: "12", r: "10")
+        end
+      end
+    end

data/app/view_components/ui/context_menu_separator_component.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+    # SeparatorComponent - ViewComponent implementation
+    class UI::ContextMenuSeparatorComponent < ViewComponent::Base
+      include UI::ContextMenuSeparatorBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag :div, "", **context_menu_separator_html_attributes.merge(@attributes)
+      end
+    end

data/app/view_components/ui/context_menu_shortcut_component.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+    # ShortcutComponent - ViewComponent implementation
+    class UI::ContextMenuShortcutComponent < ViewComponent::Base
+      include UI::ContextMenuShortcutBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        attrs = context_menu_shortcut_html_attributes
+
+        content_tag :span, **attrs.merge(@attributes) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/context_menu_trigger_component.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+    # TriggerComponent - ViewComponent implementation
+    class UI::ContextMenuTriggerComponent < ViewComponent::Base
+      include UI::ContextMenuTriggerBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        attrs = context_menu_trigger_html_attributes
+        attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
+
+        content_tag :div, **attrs.merge(@attributes.except(:data)) do
+          content
+        end
+      end
+    end