ruby_cms 0.2.1.1 → 1.0.1

data/lib/generators/ruby_cms/templates/components/ruby_ui/aspect_ratio/aspect_ratio.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module RubyUI
+  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
+
+    def view_template(&block)
+      div(
+        class: "relative w-full",
+        style: "padding-bottom: #{padding_bottom}%;"
+      ) do
+        div(**attrs, &block)
+      end
+    end
+
+    private
+
+    def padding_bottom
+      @aspect_ratio.split("/").map(&:to_i).reverse.reduce(&:fdiv) * 100
+    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

data/lib/generators/ruby_cms/templates/components/ruby_ui/avatar/avatar.rb

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+module RubyUI
+  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, **attrs)
+      @size = size
+      @size_classes = SIZES[@size]
+      super(**attrs)
+    end
+
+    def view_template(&)
+      span(**attrs, &)
+    end
+
+    private
+
+    def default_attrs
+      {
+        class: [ "relative flex shrink-0 overflow-hidden rounded-full", @size_classes ]
+      }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/avatar/avatar_fallback.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class AvatarFallback < Base
+    def view_template(&)
+      span(**attrs, &)
+    end
+
+    private
+
+    def default_attrs
+      {
+        class: "flex h-full w-full items-center justify-center rounded-full bg-muted"
+      }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/avatar/avatar_image.rb

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

data/lib/generators/ruby_cms/templates/components/ruby_ui/badge/badge.rb

@@ -0,0 +1,60 @@
+# frozen_string_literal: true
+
+module RubyUI
+  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/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 view_template(&)
+      span(**attrs, &)
+    end
+
+    private
+
+    def default_attrs
+      {
+        class: [ "inline-flex items-center rounded-md font-medium ring-1 ring-inset", SIZES[@size], COLORS[@variant] ]
+      }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/base.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+require "tailwind_merge"
+
+module RubyUI
+  class Base < Phlex::HTML
+    include Phlex::Rails::Helpers::Translate
+    include Phlex::Rails::Helpers::Routes
+    include Phlex::Rails::Helpers::LinkTo
+    include Phlex::Rails::Helpers::ButtonTo
+    include Phlex::Rails::Helpers::FormWith
+    include Phlex::Rails::Helpers::TurboFrameTag
+
+    TAILWIND_MERGER = ::TailwindMerge::Merger.new.freeze unless defined?(TAILWIND_MERGER)
+
+    attr_reader :attrs
+
+    def initialize(**user_attrs)
+      @attrs = mix(default_attrs, user_attrs)
+      @attrs[:class] = TAILWIND_MERGER.merge(@attrs[:class]) if @attrs[:class]
+    end
+
+    private
+
+    def default_attrs
+      {}
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/box/box.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class Box < Base
+    def view_template(&)
+      div(**attrs, &)
+    end
+
+    private
+
+    def default_attrs
+      { class: "md:bg-white md:rounded-lg md:shadow-xs md:border md:border-gray-200 md:p-8 md:mt-0 md:pt-8" }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/breadcrumb/breadcrumb.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class Breadcrumb < Base
+    def view_template(&)
+      nav(**attrs, &)
+    end
+
+    private
+
+    def default_attrs
+      {
+        aria: { label: "breadcrumb" }
+      }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/breadcrumb/breadcrumb_ellipsis.rb

@@ -0,0 +1,39 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class BreadcrumbEllipsis < Base
+    def view_template(&)
+      span(**attrs) do
+        icon
+        span(class: "sr-only") { "More" }
+      end
+    end
+
+    private
+
+    def icon
+      svg(
+        xmlns: "http://www.w3.org/2000/svg",
+        class: "w-4 h-4",
+        viewbox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        stroke_width: "2",
+        stroke_linecap: "round",
+        stroke_linejoin: "round"
+      ) do |s|
+        s.circle(cx: "12", cy: "12", r: "1")
+        s.circle(cx: "19", cy: "12", r: "1")
+        s.circle(cx: "5", cy: "12", r: "1")
+      end
+    end
+
+    def default_attrs
+      {
+        aria: { hidden: true },
+        class: "flex h-9 w-9 items-center justify-center",
+        role: "presentation"
+      }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/breadcrumb/breadcrumb_item.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class BreadcrumbItem < Base
+    def view_template(&)
+      li(**attrs, &)
+    end
+
+    private
+
+    def default_attrs
+      {
+        class: "inline-flex items-center gap-1.5"
+      }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/breadcrumb/breadcrumb_link.rb

@@ -0,0 +1,22 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class BreadcrumbLink < Base
+    def initialize(href: "#", **attrs)
+      @href = href
+      super(**attrs)
+    end
+
+    def view_template(&)
+      a(href: @href, **attrs, &)
+    end
+
+    private
+
+    def default_attrs
+      {
+        class: "transition-colors hover:text-foreground"
+      }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/breadcrumb/breadcrumb_list.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class BreadcrumbList < Base
+    def view_template(&)
+      ol(**attrs, &)
+    end
+
+    private
+
+    def default_attrs
+      {
+        class: "flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5"
+      }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/breadcrumb/breadcrumb_page.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class BreadcrumbPage < Base
+    def view_template(&)
+      span(**attrs, &)
+    end
+
+    private
+
+    def default_attrs
+      {
+        aria: { disabled: true, current: "page" },
+        class: "font-normal text-foreground",
+        role: "link"
+      }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/breadcrumb/breadcrumb_separator.rb

@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class BreadcrumbSeparator < Base
+    def view_template(&block)
+      li(**attrs) do
+        if block
+          block.call
+        else
+          icon
+        end
+      end
+    end
+
+    private
+
+    def icon
+      svg(
+        xmlns: "http://www.w3.org/2000/svg",
+        class: "w-4 h-4",
+        viewbox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        stroke_width: "2",
+        stroke_linecap: "round",
+        stroke_linejoin: "round"
+      ) { |s| s.path(d: "m9 18 6-6-6-6") }
+    end
+
+    def default_attrs
+      {
+        aria: { hidden: true },
+        class: "[&>svg]:w-3.5 [&>svg]:h-3.5",
+        role: "presentation"
+      }
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/bulk_action_table/bulk_action_button.rb

@@ -0,0 +1,82 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class BulkActionButton < Base
+    def initialize(button_config:, controller_name:, require_confirm: true, **user_attrs)
+      @button_config = button_config
+      @controller_name = controller_name
+      @require_confirm = require_confirm
+      super(**user_attrs)
+    end
+
+    def view_template
+      Button(
+        variant: :outline,
+        type: "button",
+        data: build_button_data,
+        **(@button_config[:class] ? { class: @button_config[:class] } : {})
+      ) do
+        plain label
+      end
+    end
+
+    private
+
+    def label
+      @button_config[:label] || @button_config[:text] || @button_config[:name]&.humanize || "Button"
+    end
+
+    def build_button_data
+      data = {}
+      action_name = @button_config[:name] || @button_config[:action_name]
+
+      if delete_button?
+        data.merge!(
+          action: "click->#{@controller_name}#showActionModal",
+          action_name: "delete",
+          action_label: label,
+          action_confirm: @button_config[:confirm] || "Are you sure you want to delete the selected items? This action cannot be undone.",
+          action_url: @button_config[:url]&.to_s
+        )
+      elsif redirect_action?
+        data.merge!(
+          action: "click->#{@controller_name}#showActionModal",
+          action_name: action_name,
+          action_url: @button_config[:url]&.to_s,
+          action_type: "redirect"
+        )
+      elsif action_name && has_confirmation?
+        data.merge!(
+          action: "click->#{@controller_name}#showActionModal",
+          action_name: action_name,
+          action_label: label,
+          action_confirm: @button_config[:confirm],
+          action_url: @button_config[:url]&.to_s
+        )
+      elsif action_name
+        data.merge!(
+          action: "click->#{@controller_name}#performBulkAction",
+          action_name: action_name,
+          action_url: @button_config[:url]&.to_s
+        )
+      elsif @button_config[:action] || @button_config[:data_action]
+        data[:action] = @button_config[:action] || @button_config[:data_action]
+      end
+
+      data["#{@controller_name}_target"] = @button_config[:target] if @button_config[:target]
+      data
+    end
+
+    def delete_button?
+      @button_config[:type] == :delete || @button_config[:delete] == true
+    end
+
+    def redirect_action?
+      @button_config[:action] == "redirect" || @button_config[:action_type] == "redirect"
+    end
+
+    def has_confirmation?
+      @button_config[:confirm].present? && @button_config.fetch(:require_confirm, @require_confirm)
+    end
+  end
+end

data/lib/generators/ruby_cms/templates/components/ruby_ui/bulk_action_table/bulk_action_table.rb

@@ -0,0 +1,133 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class BulkActionTable < Base
+    include Phlex::Rails::Helpers::FormAuthenticityToken
+    include Phlex::Rails::Helpers::TurboFrameTag
+
+    thread_mattr_accessor :current_context
+
+    Context = Struct.new(:checkbox, :controller_name, keyword_init: true)
+
+    def initialize(
+      controller_name: "ruby-ui--bulk-action-table",
+      turbo_frame: nil,
+      pagination: nil,
+      pagination_path: nil,
+      bulk_actions_url: nil,
+      bulk_actions_buttons: [],
+      item_name: "item",
+      active_color: nil,
+      **user_attrs
+    )
+      @controller_name = controller_name
+      @turbo_frame = turbo_frame
+      @pagination = pagination
+      @pagination_path = pagination_path
+      @bulk_actions_url = bulk_actions_url
+      @bulk_actions_buttons = Array(bulk_actions_buttons)
+      @item_name = item_name
+      @active_color = active_color
+      @has_bulk_actions = bulk_actions_url.present?
+      super(**user_attrs)
+    end
+
+    def view_template(&)
+      self.class.current_context = Context.new(
+        checkbox: @has_bulk_actions,
+        controller_name: @controller_name
+      )
+
+      render_with_turbo_frame do
+        div(**component_attrs) do
+          render_table_wrapper(&)
+          render_delete_modal if @has_bulk_actions
+          div(class: "flex flex-col sticky bottom-0") do
+            render_bulk_actions if @has_bulk_actions
+            render_pagination if @pagination
+          end
+        end
+      end
+    ensure
+      self.class.current_context = nil
+    end
+
+    private
+
+    def default_attrs
+      {
+        class: "flex flex-col h-full min-h-0 w-full relative bg-white rounded-xl border border-border/60 shadow-sm ring-1 ring-black/[0.03]"
+      }
+    end
+
+    def render_with_turbo_frame(&block)
+      return yield unless @turbo_frame
+
+      turbo_frame_tag(
+        @turbo_frame,
+        class: "flex-1 flex flex-col min-h-0",
+        data: { turbo_action: "advance" },
+        &block
+      )
+    end
+
+    def render_table_wrapper(&)
+      div(**build_wrapper_attrs) do
+        div(class: "flex-1 min-h-0 w-full relative overflow-y-auto overflow-x-hidden") do
+          div(class: "relative w-full overflow-x-auto overscroll-x-contain [&_caption]:hidden") do
+            table(class: "w-full text-sm caption-bottom", &)
+          end
+        end
+      end
+    end
+
+    def build_wrapper_attrs
+      { class: "flex flex-col h-full min-h-0" }
+    end
+
+    def component_attrs
+      controller_data = build_data_attributes
+      base_data = attrs[:data] || {}
+
+      # Merge controller data on top of any user-provided data so the controller
+      # always has the values it needs.
+      attrs.merge(data: base_data.merge(controller_data))
+    end
+
+    def build_data_attributes
+      {
+        controller: @controller_name,
+        "#{@controller_name}_csrf_token_value": form_authenticity_token,
+        "#{@controller_name}_item_name_value": @item_name
+      }.tap do |data|
+        if @bulk_actions_url.present?
+          data["#{@controller_name}_bulk_action_url_value"] = @bulk_actions_url.to_s
+        end
+        if @active_color.present?
+          data["#{@controller_name}_active_color_value"] = @active_color.to_s
+        end
+      end
+    end
+
+    def render_bulk_actions
+      BulkActions(
+        url: @bulk_actions_url,
+        item_name: @item_name,
+        buttons: @bulk_actions_buttons,
+        controller_name: @controller_name
+      )
+    end
+
+    def render_pagination
+      BulkActionTablePagination(
+        pagination: @pagination,
+        path: @pagination_path,
+        turbo_frame: @turbo_frame
+      )
+    end
+
+    def render_delete_modal
+      BulkActionTableDeleteModal(controller_name: @controller_name)
+    end
+  end
+end