daisy_components 0.1.0

data/app/components/daisy_ui/data_display/chat.rb

@@ -0,0 +1,92 @@
+# frozen_string_literal: true
+
+module DaisyUI
+  # Chat component for displaying a list of chat messages
+  #
+  # @example Basic usage
+  #   <%= render(ChatComponent.new(messages: [
+  #     { text: "Hello!", user_id: 1 },
+  #     { text: "Hi there!", user_id: 2 }
+  #   ], current_user_id: 1)) %>
+  #
+  # @example With specific positions (overriding automatic positioning)
+  #   <%= render(ChatComponent.new(messages: [
+  #     { text: "Hello!", position: :start },
+  #     { text: "Hi there!", position: :end }
+  #   ])) %>
+  #
+  # @example With avatar, header and footer
+  #   <%= render(ChatComponent.new(
+  #     messages: [
+  #       {
+  #         text: "Hello!",
+  #         user_id: 1,
+  #         avatar: { img_src: "user.jpg", img_alt: "User" },
+  #         header: { text: "John", time: "12:45" },
+  #         footer: { text: "Delivered", time: "12:46" }
+  #       }
+  #     ],
+  #     current_user_id: 2
+  #   )) %>
+  class Chat < BaseComponent
+    # Define a slot for multiple messages
+    renders_many :bubbles, DaisyUI::ChatBubble
+
+    include ActionView::Helpers::TagHelper
+
+    # @param messages [Array<Hash>] Array of message objects to display
+    # @param current_user_id [Any] ID of the current user to determine message positions
+    # @option messages [String] :text The message text
+    # @option messages [Any] :user_id ID of the user who sent the message
+    # @option messages [Symbol] :position Optional override for the position (:start or :end)
+    # @option messages [Symbol] :color The color of the message bubble
+    # @option messages [Hash] :avatar Avatar options
+    # @option messages [Hash] :header Header options
+    # @option messages [Hash] :footer Footer options
+    def initialize(messages: [], current_user_id: nil, **system_arguments)
+      @messages = messages
+      @current_user_id = current_user_id
+      super(**system_arguments)
+
+      # Pre-populate bubbles from messages array if provided
+      @messages.each { |message| add_bubble(message) }
+    end
+
+    def call
+      return unless bubbles.any?
+
+      content_tag(:div, class: 'w-full') do
+        safe_join(bubbles)
+      end
+    end
+
+    private
+
+    def add_bubble(message)
+      position = determine_position(message)
+
+      with_bubble(
+        message[:text],
+        position: position,
+        color: message[:color],
+        avatar: message[:avatar],
+        header: message[:header],
+        footer: message[:footer]
+      )
+    end
+
+    def determine_position(message)
+      return message[:position] if message[:position].present?
+
+      if @current_user_id.present? && message[:user_id].present?
+        message[:user_id] == @current_user_id ? :end : :start
+      else
+        :start # Default position if no positioning info is available
+      end
+    end
+
+    def html_attributes
+      system_arguments
+    end
+  end
+end

data/app/components/daisy_ui/data_display/chat_bubble/metadata.rb

@@ -0,0 +1,71 @@
+# frozen_string_literal: true
+
+module DaisyUI
+  class ChatBubble
+    # Component for chat bubble metadata (header/footer)
+    #
+    # @example Header usage
+    #   <%= render(MetadataComponent.new(text: "John Doe", time: "12:45", type: :header)) %>
+    #
+    # @example Footer usage
+    #   <%= render(MetadataComponent.new(text: "Delivered", time: "12:46", type: :footer)) %>
+    class Metadata < BaseComponent
+      TYPES = %i[header footer].freeze
+
+      TYPE_CLASSES = {
+        header: 'chat-header',
+        footer: 'chat-footer opacity-50'
+      }.freeze
+
+      # @param text [String] The main text content
+      # @param time [String, nil] Optional timestamp
+      # @param type [Symbol] Type of metadata (:header or :footer)
+      # @param system_arguments [Hash] Additional HTML attributes
+      def initialize(text:, type:, time: nil, **system_arguments)
+        @text = text
+        @time = time
+        @type = validate_type!(type)
+        super(**system_arguments)
+      end
+
+      def call
+        tag.div(**html_attributes) do
+          safe_join([
+            @text,
+            render_time
+          ].compact)
+        end
+      end
+
+      private
+
+      def render_time
+        return unless @time
+
+        tag.time(@time, class: time_classes)
+      end
+
+      def computed_classes
+        class_names(TYPE_CLASSES[@type], system_arguments[:class])
+      end
+
+      def html_attributes
+        system_arguments.merge(
+          class: computed_classes
+        )
+      end
+
+      def time_classes
+        modifiers = ['text-xs opacity-50']
+        class_names(modifiers)
+      end
+
+      def validate_type!(type)
+        type = type.to_sym
+        return type if TYPES.include?(type)
+
+        raise ArgumentError, "Invalid type: #{type}. Must be one of: #{TYPES.join(', ')}"
+      end
+    end
+  end
+end

data/app/components/daisy_ui/data_display/chat_bubble.rb

@@ -0,0 +1,166 @@
+# frozen_string_literal: true
+
+module DaisyUI
+  # Chat bubble component implementing DaisyUI's chat bubble styles
+  #
+  # @example Basic usage
+  #   <%= render(ChatBubbleComponent.new(text: "Hello!")) %>
+  #
+  # @example With avatar
+  #   <%= render(ChatBubbleComponent.new(text: "Hello!")) do |c|
+  #     <% c.with_avatar(img_src: "user.jpg", img_alt: "User") %>
+  #   <% end %>
+  #
+  # @example With header and footer
+  #   <%= render(ChatBubbleComponent.new(text: "Hello!")) do |c|
+  #     <% c.with_header(text: "John Doe", time: "12:45") %>
+  #     <% c.with_footer(text: "Delivered", time: "12:46") %>
+  #   <% end %>
+  #
+  # @example End position
+  #   <%= render(ChatBubbleComponent.new(text: "Hello!", position: :end)) %>
+  #
+  # @example With color
+  #   <%= render(ChatBubbleComponent.new(text: "Hello!", color: :primary)) %>
+  class ChatBubble < BaseComponent
+    # Available chat bubble colors from DaisyUI
+    COLORS = {
+      primary: 'chat-bubble-primary',
+      secondary: 'chat-bubble-secondary',
+      accent: 'chat-bubble-accent',
+      neutral: 'chat-bubble-neutral',
+      info: 'chat-bubble-info',
+      success: 'chat-bubble-success',
+      warning: 'chat-bubble-warning',
+      error: 'chat-bubble-error'
+    }.freeze
+
+    # Available positions
+    POSITIONS = {
+      start: 'chat-start',
+      end: 'chat-end'
+    }.freeze
+
+    renders_one :avatar, lambda { |**system_arguments|
+      size = system_arguments.delete(:size) || :w10
+      Avatar.new(**system_arguments, class: 'chat-image', size: size, shape: :circle)
+    }
+
+    renders_one :header, lambda { |**system_arguments|
+      Metadata.new(
+        **@header_options, **system_arguments,
+        type: :header,
+        class: @header_class
+      )
+    }
+
+    renders_one :footer, lambda { |**system_arguments|
+      Metadata.new(
+        **@footer_options, **system_arguments,
+        type: :footer,
+        class: @footer_class
+      )
+    }
+
+    # @param text [String] The text content to display inside the chat bubble
+    # @param position [Symbol] Position of the chat bubble (:start, :end)
+    # @param color [Symbol] Color variant of the chat bubble
+    # @param avatar [Hash] Options for the avatar component
+    # @param header [Hash] Options for the header metadata component
+    # @param footer [Hash] Options for the footer metadata component
+    def initialize(text = nil, position: :start, color: nil,
+                   text_class: nil, header_class: nil,
+                   footer_class: nil,
+                   avatar: {},
+                   header: {},
+                   footer: {},
+                   **system_arguments)
+      @text = text
+      @position = build_argument(position, POSITIONS, 'position')
+      @color = build_argument(color, COLORS, 'color')
+      @text_class = text_class
+      @header_class = header_class
+      @footer_class = footer_class
+      @avatar_options = avatar
+      @header_options = header
+      @footer_options = footer
+      @content_text = text
+      super(**system_arguments)
+
+      # Setup slots from provided options
+      with_avatar(**@avatar_options) if @avatar_options&.any?
+      with_header(**@header_options) if @header_options&.any?
+      with_footer(**@footer_options) if @footer_options&.any?
+    end
+
+    # Set the text content
+    def with_text(content = nil, &)
+      @content_text = if block_given?
+                        capture(&)
+                      else
+                        content
+                      end
+    end
+
+    def call
+      tag.div(**html_attributes) do
+        components = []
+        components << avatar if avatar?
+        components << header if header?
+        components << render_bubble if @content_text.present?
+        components << footer if footer?
+        safe_join(components)
+      end
+    end
+
+    private
+
+    def render_bubble
+      tag.div(class: bubble_classes) do
+        helpers.sanitize(markdown_renderer.render(@content_text),
+                         tags: %w[p br a ul ol li strong em del ins code pre blockquote h1 h2 h3 h4 h5 h6 img
+                                  span div],
+                         attributes: %w[href target rel src alt class])
+      end
+    end
+
+    def markdown_renderer
+      @markdown_renderer ||= Redcarpet::Markdown.new(
+        Redcarpet::Render::HTML.new(
+          hard_wrap: true,
+          link_attributes: { target: '_blank', rel: 'noopener' }
+        ),
+        {
+          autolink: true,
+          strikethrough: true,
+          no_intra_emphasis: true,
+          underline: true,
+          highlight: true,
+          fenced_code_blocks: true,
+          disable_indented_code_blocks: true
+        }
+      )
+    end
+
+    def bubble_classes
+      class_names(
+        'chat-bubble',
+        @color
+      )
+    end
+
+    def computed_classes
+      class_names(
+        'chat',
+        @position,
+        system_arguments[:class]
+      )
+    end
+
+    def html_attributes
+      system_arguments.merge(
+        class: computed_classes
+      )
+    end
+  end
+end

data/app/components/daisy_ui/divider.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module DaisyUI
+  class Divider < ViewComponent::Base
+    def call
+      tag.li(class: 'divider')
+    end
+  end
+end

data/app/components/daisy_ui/item.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+module DaisyUI
+  class Item < BaseComponent
+    def initialize(href: nil, **system_arguments)
+      @href = href
+      super(**system_arguments)
+    end
+
+    def call
+      tag.li do
+        if @href
+          tag.a(href: @href, class: system_arguments[:class]) { content }
+        else
+          content
+        end
+      end
+    end
+  end
+end

data/app/components/daisy_ui/title.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module DaisyUI
+  class Title < ViewComponent::Base
+    def call
+      tag.li(class: 'menu-title') { content }
+    end
+  end
+end

data/app/controllers/daisy_ui/application_controller.rb

@@ -0,0 +1,6 @@
+# frozen_string_literal: true
+
+module DaisyUI
+  class ApplicationController < ActionController::Base
+  end
+end

data/app/helpers/daisy_ui/application_helper.rb

@@ -0,0 +1,6 @@
+# frozen_string_literal: true
+
+module DaisyUI
+  module ApplicationHelper
+  end
+end