maquina-components 0.1.1 → 0.2.0

data/app/helpers/maquina_components/icons_helper.rb

@@ -0,0 +1,161 @@
+module MaquinaComponents
+  module IconsHelper
+    def icon_for(name, options = {})
+      return nil unless name
+
+      svg = icon_svg_for(name.to_sym) || main_icon_svg_for(name.to_sym)
+      return nil unless svg
+
+      css_classes = options[:class]
+      svg = svg.gsub('class="', "class=\"#{css_classes} ")
+
+      if options[:stroke_width]
+        svg = svg.gsub('stroke-width="2"', "stroke-width=\"#{options[:stroke_width]}\"")
+      end
+
+      svg.html_safe
+    end
+
+    def main_icon_svg_for(name)
+    end
+
+    def icon_svg_for(name)
+      case name
+      when :dollar
+        <<~SVG.freeze
+          <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="">
+            <line x1="12" y1="2" x2="12" y2="22"></line>
+            <path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"></path>
+          </svg>
+        SVG
+      when :users
+        <<~SVG.freeze
+          <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">
+            <path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"></path>
+            <circle cx="9" cy="7" r="4"></circle>
+            <path d="M22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75"></path>
+          </svg>
+        SVG
+      when :credit_card
+        <<~SVG.freeze
+          <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">
+            <rect width="20" height="14" x="2" y="5" rx="2"></rect>
+            <line x1="2" y1="10" x2="22" y2="10"></line>
+          </svg>
+        SVG
+      when :activity
+        <<~SVG.freeze
+          <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">
+            <path d="M22 12h-4l-3 9L9 3l-3 9H2"></path>
+          </svg>
+        SVG
+      when :trend_up
+        <<~SVG.freeze
+          <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="">
+            <polyline points="22 7 13.5 15.5 8.5 10.5 2 17"></polyline>
+            <polyline points="16 7 22 7 22 13"></polyline>
+          </svg>
+        SVG
+      when :trend_down
+        <<~SVG.freeze
+          <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="">
+            <polyline points="22 17 13.5 8.5 8.5 13.5 2 7"></polyline>
+            <polyline points="16 17 22 17 22 11"></polyline>
+          </svg>
+        SVG
+      when :clock
+        <<~SVG.freeze
+          <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="">
+            <circle cx="12" cy="12" r="10"></circle>
+            <polyline points="12 6 12 12 16 14"></polyline>
+          </svg>
+        SVG
+      when :money
+        <<~SVG.freeze
+          <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="">
+            <rect width="20" height="12" x="2" y="6" rx="2"></rect>
+            <circle cx="12" cy="12" r="2"></circle>
+            <path d="M6 12h.01M18 12h.01"></path>
+          </svg>
+        SVG
+      when :line_chart
+        <<~SVG.freeze
+          <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="">
+            <path d="M3 3v18h18"/><path d="m19 9-5 5-4-4-3 3"/>
+          </svg>
+        SVG
+      when :piggy_bank
+        <<~SVG.freeze
+          <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="">
+            <path d="M19 5c-1.5 0-2.8 1.4-3 2-3.5-1.5-11-.3-11 5 0 1.8 0 3 2 4.5V20h4v-2h3v2h4v-4c1-.5 1.7-1 2-2h2v-4h-2c0-1-.5-1.5-1-2h0V5z"/>
+            <path d="M2 9v1c0 1.1.9 2 2 2h1"/>
+            <path d="M16 11h0"/>
+          </svg>
+        SVG
+      when :arrow_left
+        <<~SVG.freeze
+          <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="">
+            <line x1="19" y1="12" x2="5" y2="12"></line>
+            <polyline points="12 19 5 12 12 5"></polyline>
+          </svg>
+        SVG
+      when :select_chevron
+        <<~SVG.freeze
+          <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="" aria-hidden="true">
+            <path d="m6 9 6 6 6-6"></path>
+          </svg>
+        SVG
+      when :check
+        <<~SVG.freeze
+          <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="">
+            <path d="M20 6 9 17l-5-5"/>
+          </svg>
+        SVG
+      when :circle_alert
+        <<~SVG.freeze
+          <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="">
+            <circle cx="12" cy="12" r="10"/>
+            <line x1="12" x2="12" y1="8" y2="12"/>
+            <line x1="12" x2="12.01" y1="16" y2="16"/>
+          </svg>
+        SVG
+      when :logout
+        <<~SVG.freeze
+          <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="">
+            <path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path>
+            <polyline points="16 17 21 12 16 7"></polyline>
+            <line x1="21" x2="9" y1="12" y2="12"></line>
+          </svg>
+        SVG
+      when :chevron_up_down
+        <<~SVG.freeze
+          <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="">
+            <path d="m7 15 5 5 5-5"></path>
+            <path d="m7 9 5-5 5 5"></path>
+          </svg>
+        SVG
+      when :chevron_right
+        <<~SVG
+          <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="">
+            <path d="m9 18 6-6-6-6"/>
+          </svg>
+        SVG
+      when :left_panel
+        <<~SVG.freeze
+          <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="">
+            <rect width="18" height="18" x="3" y="3" rx="2"></rect>
+            <path d="M9 3v18"></path>
+          </svg>
+        SVG
+      when :ellipsis
+        <<~SVG.freeze
+          <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">
+            <circle cx="12" cy="12" r="1"/>
+            <circle cx="19" cy="12" r="1"/>
+            <circle cx="5" cy="12" r="1"/>
+          </svg>
+        SVG
+      end
+    end
+  end
+end

data/app/helpers/maquina_components/pagination_helper.rb

@@ -0,0 +1,153 @@
+# frozen_string_literal: true
+
+module MaquinaComponents
+  # Pagination Helper
+  #
+  # Provides convenient methods for creating pagination components with Pagy integration.
+  #
+  # @example Using the helper with Pagy
+  #   <%%= pagination_nav(@pagy, :users_path) %>
+  #
+  # @example With additional params
+  #   <%%= pagination_nav(@pagy, :search_users_path, params: { q: params[:q] }) %>
+  #
+  # @example With Turbo options
+  #   <%%= pagination_nav(@pagy, :users_path, turbo: { action: :replace, frame: "users" }) %>
+  #
+  # @example Using partials directly
+  #   <%%= render "components/pagination" do %>
+  #     <%%= render "components/pagination/content" do %>
+  #       <%%= render "components/pagination/item" do %>
+  #         <%%= render "components/pagination/previous", href: prev_path %>
+  #       <%% end %>
+  #       ...
+  #     <%% end %>
+  #   <%% end %>
+  #
+  module PaginationHelper
+    # Renders a complete pagination navigation from a Pagy object
+    #
+    # @param pagy [Pagy] The Pagy pagination object
+    # @param route_helper [Symbol] Route helper method name (e.g., :users_path)
+    # @param params [Hash] Additional params to pass to route helper
+    # @param turbo [Hash] Turbo-specific data attributes
+    # @param show_labels [Boolean] Whether to show Previous/Next text labels
+    # @param css_classes [String] Additional CSS classes for the nav
+    # @return [String] Rendered HTML
+    def pagination_nav(pagy, route_helper, params: {}, turbo: {action: :replace}, show_labels: true, css_classes: "", **html_options)
+      return if pagy.pages <= 1
+
+      render "components/pagination", css_classes: css_classes, **html_options do
+        render "components/pagination/content" do
+          safe_join([
+            pagination_previous_item(pagy, route_helper, params, turbo, show_labels),
+            pagination_page_items(pagy, route_helper, params, turbo),
+            pagination_next_item(pagy, route_helper, params, turbo, show_labels)
+          ])
+        end
+      end
+    end
+
+    # Simpler pagination with just Previous/Next (no page numbers)
+    #
+    # @param pagy [Pagy] The Pagy pagination object
+    # @param route_helper [Symbol] Route helper method name
+    # @param params [Hash] Additional params to pass to route helper
+    # @param turbo [Hash] Turbo-specific data attributes
+    # @return [String] Rendered HTML
+    def pagination_simple(pagy, route_helper, params: {}, turbo: {action: :replace}, css_classes: "", **html_options)
+      return if pagy.pages <= 1
+
+      render "components/pagination", css_classes: css_classes, **html_options do
+        render "components/pagination/content" do
+          safe_join([
+            pagination_previous_item(pagy, route_helper, params, turbo, true),
+            pagination_next_item(pagy, route_helper, params, turbo, true)
+          ])
+        end
+      end
+    end
+
+    # Build paginated path with page param
+    #
+    # @param route_helper [Symbol] Route helper method name
+    # @param pagy [Pagy] The Pagy pagination object
+    # @param page [Integer] Page number
+    # @param extra_params [Hash] Additional params
+    # @return [String] URL path
+    def paginated_path(route_helper, pagy, page, extra_params = {})
+      page_param = pagy.vars[:page_param] || Pagy::DEFAULT[:page_param]
+      query_params = request.query_parameters.except(page_param.to_s).merge(extra_params)
+      query_params[page_param] = page
+
+      send(route_helper, query_params)
+    end
+
+    private
+
+    def pagination_previous_item(pagy, route_helper, params, turbo, show_label)
+      render "components/pagination/item" do
+        if pagy.prev
+          render "components/pagination/previous",
+            href: paginated_path(route_helper, pagy, pagy.prev, params),
+            show_label: show_label,
+            data: turbo_data(turbo)
+        else
+          render "components/pagination/previous",
+            disabled: true,
+            show_label: show_label
+        end
+      end
+    end
+
+    def pagination_next_item(pagy, route_helper, params, turbo, show_label)
+      render "components/pagination/item" do
+        if pagy.next
+          render "components/pagination/next",
+            href: paginated_path(route_helper, pagy, pagy.next, params),
+            show_label: show_label,
+            data: turbo_data(turbo)
+        else
+          render "components/pagination/next",
+            disabled: true,
+            show_label: show_label
+        end
+      end
+    end
+
+    def pagination_page_items(pagy, route_helper, params, turbo)
+      pagy.series.map do |item|
+        render "components/pagination/item" do
+          case item
+          when Integer
+            render "components/pagination/link",
+              href: paginated_path(route_helper, pagy, item, params),
+              active: item == pagy.page,
+              data: turbo_data(turbo) do
+              item.to_s
+            end
+          when String
+            # Current page (string representation)
+            render "components/pagination/link",
+              href: paginated_path(route_helper, pagy, item.to_i, params),
+              active: true,
+              data: turbo_data(turbo) do
+              item
+            end
+          when :gap
+            render "components/pagination/ellipsis"
+          end
+        end
+      end
+    end
+
+    def turbo_data(turbo)
+      return {} if turbo.blank?
+
+      data = {}
+      data[:turbo_action] = turbo[:action] if turbo[:action]
+      data[:turbo_frame] = turbo[:frame] if turbo[:frame]
+      data
+    end
+  end
+end

data/app/helpers/maquina_components/sidebar_helper.rb

@@ -0,0 +1,63 @@
+module MaquinaComponents
+  module SidebarHelper
+    # Get sidebar state from cookie
+    #
+    # Reads the sidebar state cookie and returns a String.
+    # Use this to set the state value in the sidebar
+    # to ensure server-rendered state matches client state.
+    #
+    # @param cookie_name [String] The cookie name (default: "sidebar_state")
+    # @return [String] expanded if sidebar should be open, collapsed otherwise
+    #
+    # @example In layout
+    #   <%= render "components/sidebar",
+    #     state: sidebar_state do %>
+    #     <!-- content -->
+    #   <% end %>
+    #
+    # @example With custom cookie name
+    #   <%= render "components/sidebar",
+    #     state: sidebar_state("custom_sidebar_cookie") do %>
+    #     <!-- content -->
+    #   <% end %>
+    #
+    def sidebar_state(cookie_name = "sidebar_state")
+      # Read cookie value
+      cookie_value = cookies[cookie_name]
+
+      # Default to expanded when no cookie exists
+      return :expanded if cookie_value.nil?
+
+      # Return expanded if cookie says "true", otherwise collapsed
+      (cookie_value == "true") ? :expanded : :collapsed
+    end
+
+    # Check if sidebar is currently open
+    #
+    # @param cookie_name [String] The cookie name (default: "sidebar_state")
+    # @return [Boolean] true if sidebar is open
+    #
+    # @example
+    #   <% if sidebar_open? %>
+    #     <!-- Show sidebar-specific content -->
+    #   <% end %>
+    #
+    def sidebar_open?(cookie_name = "sidebar_state")
+      sidebar_state(cookie_name) == :expanded
+    end
+
+    # Check if sidebar is currently closed
+    #
+    # @param cookie_name [String] The cookie name (default: "sidebar_state")
+    # @return [Boolean] true if sidebar is closed
+    #
+    # @example
+    #   <% if sidebar_closed? %>
+    #     <!-- Show expanded content when sidebar is closed -->
+    #   <% end %>
+    #
+    def sidebar_closed?(cookie_name = "sidebar_state")
+      sidebar_state(cookie_name) == :collapsed
+    end
+  end
+end

data/app/helpers/maquina_components/table_helper.rb

@@ -0,0 +1,144 @@
+# frozen_string_literal: true
+
+module MaquinaComponents
+  # Table Component Helper
+  #
+  # Provides a simple helper for rendering basic tables from collections.
+  # For complex tables, use the partials directly for full control.
+  #
+  # @example Basic usage with collection
+  #   <%= simple_table @invoices,
+  #         columns: [
+  #           { key: :number, label: "Invoice" },
+  #           { key: :status, label: "Status" },
+  #           { key: :amount, label: "Amount", align: :right }
+  #         ] %>
+  #
+  # @example With caption and bordered variant
+  #   <%= simple_table @users,
+  #         columns: [
+  #           { key: :name, label: "Name" },
+  #           { key: :email, label: "Email" },
+  #           { key: :role, label: "Role" }
+  #         ],
+  #         caption: "Active users",
+  #         variant: :bordered %>
+  #
+  module TableHelper
+    # Render a simple table from a collection
+    #
+    # @param collection [Array, ActiveRecord::Relation] The collection to render
+    # @param columns [Array<Hash>] Column definitions with :key, :label, and optional :align
+    # @param caption [String, nil] Optional table caption
+    # @param variant [Symbol, nil] Container variant (:bordered)
+    # @param table_variant [Symbol, nil] Table variant (:striped)
+    # @param empty_message [String] Message to show when collection is empty
+    # @param row_id [Symbol, nil] Method to call for row ID (e.g., :id)
+    # @param html_options [Hash] Additional HTML options for the table
+    # @return [String] Rendered HTML
+    def simple_table(collection, columns:, caption: nil, variant: nil, table_variant: nil, empty_message: "No data available", row_id: nil, **html_options)
+      render partial: "components/simple_table", locals: {
+        collection: collection,
+        columns: columns,
+        caption: caption,
+        variant: variant,
+        table_variant: table_variant,
+        empty_message: empty_message,
+        row_id: row_id,
+        html_options: html_options
+      }
+    end
+
+    # Generate data attributes for table elements
+    # Useful when composing tables with other Rails helpers
+    #
+    # @example Using with content_tag
+    #   <%= content_tag :table, **table_data_attrs do %>
+    #     ...
+    #   <% end %>
+    #
+    # @param variant [Symbol, nil] Table variant (:striped)
+    # @return [Hash] Data attributes hash
+    def table_data_attrs(variant: nil)
+      attrs = { data: { component: "table" } }
+      attrs[:data][:variant] = variant.to_s if variant
+      attrs
+    end
+
+    # Generate data attributes for table container
+    #
+    # @param variant [Symbol, nil] Container variant (:bordered)
+    # @return [Hash] Data attributes hash
+    def table_container_data_attrs(variant: nil)
+      attrs = { data: { table_part: "container" } }
+      attrs[:data][:variant] = variant.to_s if variant
+      attrs
+    end
+
+    # Generate data attributes for table row
+    #
+    # @param selected [Boolean] Whether the row is selected
+    # @return [Hash] Data attributes hash
+    def table_row_data_attrs(selected: false)
+      attrs = { data: { table_part: "row" } }
+      attrs[:data][:state] = "selected" if selected
+      attrs
+    end
+
+    # Generate data attributes for table header
+    #
+    # @param sticky [Boolean] Whether the header is sticky
+    # @return [Hash] Data attributes hash
+    def table_header_data_attrs(sticky: false)
+      attrs = { data: { table_part: "header" } }
+      attrs[:data][:sticky] = "true" if sticky
+      attrs
+    end
+
+    # Generate data attributes for table head cell
+    # @return [Hash] Data attributes hash
+    def table_head_data_attrs
+      { data: { table_part: "head" } }
+    end
+
+    # Generate data attributes for table cell
+    #
+    # @param empty [Boolean] Whether this is an empty state cell
+    # @return [Hash] Data attributes hash
+    def table_cell_data_attrs(empty: false)
+      attrs = { data: { table_part: "cell" } }
+      attrs[:data][:empty] = "true" if empty
+      attrs
+    end
+
+    # Generate data attributes for table body
+    # @return [Hash] Data attributes hash
+    def table_body_data_attrs
+      { data: { table_part: "body" } }
+    end
+
+    # Generate data attributes for table footer
+    # @return [Hash] Data attributes hash
+    def table_footer_data_attrs
+      { data: { table_part: "footer" } }
+    end
+
+    # Generate data attributes for table caption
+    # @return [Hash] Data attributes hash
+    def table_caption_data_attrs
+      { data: { table_part: "caption" } }
+    end
+
+    # Convert alignment symbol to CSS class
+    #
+    # @param align [Symbol, nil] Alignment (:left, :center, :right)
+    # @return [String, nil] CSS class name
+    def table_alignment_class(align)
+      case align&.to_sym
+      when :right then "text-right"
+      when :center then "text-center"
+      else nil
+      end
+    end
+  end
+end