ariadne_view_components 0.0.96.6 → 0.0.96.7

data/app/components/ariadne/{ui → layout}/sidebar/group/component.rb

@@ -2,7 +2,7 @@
 # frozen_string_literal: true
 
 module Ariadne
-  module UI
+  module Layout
     module Sidebar
       module Group
         # Group component for the sidebar.
@@ -18,7 +18,7 @@ module Ariadne
           option :default_open, default: -> { true }
 
           # Individual items in the group
-          renders_many :items, Ariadne::UI::Sidebar::Item::Component
+          renders_many :items, Ariadne::Layout::Sidebar::Group::Item::Component
 
           # Custom content for the group
           renders_one :custom_content, BaseComponent::ACCEPT_ANYTHING

data/app/components/ariadne/layout/sidebar/group/item/component.html.erb

@@ -0,0 +1,21 @@
+<%= content_tag(href.present? ? "a" : "div", data: { collapsed: false }, **html_attrs) do %>
+  <% if custom_content %>
+    <div class="ariadne:flex-1 ariadne:data-[sidebar-collapsed=true]:hidden"><%= custom_content %></div>
+  <% else %>
+    <div class="ariadne:flex ariadne:items-center ariadne:w-full">
+      <% if icon %>
+        <span class="ariadne:flex mr-2 ariadne:items-center ariadne:justify-center ariadne:w-5 ariadne:h-5 ariadne:flex-shrink-0">
+          <%= icon %>
+        </span>
+      <% end %>
+      <% if label.present? %>
+        <span class="ariadne:truncate ariadne:data-[sidebar-collapsed=true]:hidden"><%= label %></span>
+        <% if badge %>
+          <span class="ariadne:ml-auto ariadne:inline-flex ariadne:items-center ariadne:py-0 ariadne:h-5 ariadne:data-[sidebar-collapsed=true]:hidden">
+            <%= badge %>
+          </span>
+        <% end %>
+      <% end %>
+    </div>
+  <% end %>
+<% end %>

data/app/components/ariadne/layout/sidebar/group/item/component.rb

@@ -0,0 +1,76 @@
+# typed: false
+# frozen_string_literal: true
+
+module Ariadne
+  module Layout
+    module Sidebar
+      module Group
+        module Item
+          # Item component for the sidebar.
+          # Used for navigation links or actions.
+          class Component < Ariadne::BaseComponent
+            # @param [String] href The URL the item links to
+            option :href, default: -> { nil }
+
+            # @param [Boolean] current Whether this item represents the current page
+            option :current, default: -> { false }
+
+            # @param [String] label Text label for the item
+            option :label, default: -> { nil }
+
+            # Icon for the item
+            renders_one :icon, Ariadne::UI::Heroicon::Component
+            # Generic icon slot for custom icons
+            renders_one :icon_slot, BaseComponent::ACCEPT_ANYTHING
+
+            # Badge for the item (e.g., notification count)
+            renders_one :badge, BaseComponent::ACCEPT_ANYTHING
+
+            # Content for the item if not using label/link
+            renders_one :custom_content, BaseComponent::ACCEPT_ANYTHING
+
+            accepts_html_attributes do |html_attrs|
+              html_attrs[:class] = merge_tailwind_classes([style(current: current), html_attrs[:class]].join(" "))
+
+              if href.present?
+                html_attrs[:href] = href
+              end
+            end
+
+            style do
+              base do
+                [
+                  "ariadne:flex",
+                  "ariadne:items-center",
+                  "ariadne:gap-3",
+                  "ariadne:p-2",
+                  "ariadne:rounded-md",
+                  "ariadne:text-sm",
+                  "ariadne:font-medium",
+                  "ariadne:transition-colors",
+                  "ariadne:duration-200",
+                  "ariadne:outline-none",
+                  "ariadne:focus-visible:ring-2",
+                  "ariadne:focus-visible:ring-offset-2",
+                  "ariadne:relative",
+                  "ariadne:dark:hover:bg-purple-700/20",
+                ]
+              end
+
+              variants do
+                current do
+                  yes do
+                    [
+                      "ariadne:bg-purple-700/20",
+                      "ariadne:dark:bg-purple-300/20",
+                    ]
+                  end
+                end
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/app/components/ariadne/{ui → layout}/sidebar/header/component.rb

@@ -2,7 +2,7 @@
 # frozen_string_literal: true
 
 module Ariadne
-  module UI
+  module Layout
     module Sidebar
       module Header
         # Header component for the sidebar.
@@ -21,6 +21,7 @@ module Ariadne
             base do
               [
                 "ariadne:flex",
+                "ariadne:flex-col",
                 "ariadne:items-center",
                 "ariadne:justify-between",
                 "ariadne:px-4",

data/app/components/ariadne/ui/button/component.rb

@@ -26,7 +26,7 @@ module Ariadne
         option :type, default: proc { "button" }
 
         DEFAULT_SCHEME = :primary
-        SCHEME_OPTIONS = [DEFAULT_SCHEME, :outline, :secondary, :nude, :danger].freeze
+        SCHEME_OPTIONS = [DEFAULT_SCHEME, :outline, :secondary, :nude, :danger, :none].freeze
 
         # @param [Symbol] scheme (:primary) Indicates the button's scheme. <%= one_of(Ariadne::UI::Button::Component::SCHEME_OPTIONS) %>
         option :scheme, default: proc { DEFAULT_SCHEME }

data/app/components/ariadne/ui/dialog/component.ts

@@ -5,7 +5,6 @@ export default class DialogController extends controllerFactory()({
   targets: {dialog: HTMLDialogElement},
 }) {
   close(e?:MouseEvent) {
-    if (e) e.preventDefault()
     if (!this.dialogTarget.open) return
     this.dialogTarget.close()
     enableBodyScroll(this.dialogTarget)

data/lib/ariadne/view_components/version.rb

@@ -3,6 +3,6 @@
 # :nocov:
 module Ariadne
   module ViewComponents
-    VERSION = "0.0.96.6"
+    VERSION = "0.0.96.7"
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: ariadne_view_components
 version: !ruby/object:Gem::Version
-  version: 0.0.96.6
+  version: 0.0.96.7
 platform: ruby
 authors:
 - Garen J. Torikian
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-04-01 00:00:00.000000000 Z
+date: 2025-04-03 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: tailwind_merge
@@ -182,6 +182,15 @@ files:
 - app/components/ariadne/layout/section_block/header/component.rb
 - app/components/ariadne/layout/sidebar/component.html.erb
 - app/components/ariadne/layout/sidebar/component.rb
+- app/components/ariadne/layout/sidebar/footer/component.html.erb
+- app/components/ariadne/layout/sidebar/footer/component.rb
+- app/components/ariadne/layout/sidebar/group/component.html.erb
+- app/components/ariadne/layout/sidebar/group/component.rb
+- app/components/ariadne/layout/sidebar/group/component.ts
+- app/components/ariadne/layout/sidebar/group/item/component.html.erb
+- app/components/ariadne/layout/sidebar/group/item/component.rb
+- app/components/ariadne/layout/sidebar/header/component.html.erb
+- app/components/ariadne/layout/sidebar/header/component.rb
 - app/components/ariadne/layout/two_panel/component.html.erb
 - app/components/ariadne/layout/two_panel/component.rb
 - app/components/ariadne/layout/wide/component.html.erb
@@ -245,19 +254,6 @@ files:
 - app/components/ariadne/ui/shortcut/component.html.erb
 - app/components/ariadne/ui/shortcut/component.rb
 - app/components/ariadne/ui/shortcut/component.ts
-- app/components/ariadne/ui/sidebar/component.html.erb
-- app/components/ariadne/ui/sidebar/component.rb
-- app/components/ariadne/ui/sidebar/content/component.html.erb
-- app/components/ariadne/ui/sidebar/content/component.rb
-- app/components/ariadne/ui/sidebar/footer/component.html.erb
-- app/components/ariadne/ui/sidebar/footer/component.rb
-- app/components/ariadne/ui/sidebar/group/component.html.erb
-- app/components/ariadne/ui/sidebar/group/component.rb
-- app/components/ariadne/ui/sidebar/group/component.ts
-- app/components/ariadne/ui/sidebar/header/component.html.erb
-- app/components/ariadne/ui/sidebar/header/component.rb
-- app/components/ariadne/ui/sidebar/item/component.html.erb
-- app/components/ariadne/ui/sidebar/item/component.rb
 - app/components/ariadne/ui/skeleton/component.html.erb
 - app/components/ariadne/ui/skeleton/component.rb
 - app/components/ariadne/ui/stats_panel/component.html.erb

data/app/components/ariadne/ui/sidebar/component.html.erb

@@ -1,24 +0,0 @@
-<%# Sidebar container with data attributes for JavaScript interactions %>
-<%= tag.aside(
-  id: "sidebar-#{object_id}",
-  class: style,
-  data: {
-    controller: "ariadne--ui--sidebar",
-    ariadne__ui__sidebar_target: "sidebar",
-    collapsed: !default_open,
-    collapsible: collapsible,
-  }
-) do %>
-  <%# Render the header if provided %>
-  <% if header_component %>
-    <%= header_component %>
-  <% end %>
-  <%# Render the content if provided %>
-  <% if content_component %>
-    <%= content_component %>
-  <% end %>
-  <%# Render the footer if provided %>
-  <% if footer_component %>
-    <%= footer_component %>
-  <% end %>
-<% end %>

data/app/components/ariadne/ui/sidebar/component.rb

@@ -1,72 +0,0 @@
-# typed: false
-# frozen_string_literal: true
-
-module Ariadne
-  module UI
-    module Sidebar
-      # A sidebar component for navigation and application structure.
-      #
-      # The sidebar can be collapsible, with configurable breakpoints for responsive behavior.
-      # It supports header, footer, and content sections with nested groups and items.
-      class Component < Ariadne::BaseComponent
-        # @param [Symbol] collapsible (:icon) Indicates how the sidebar collapses. Can be `:icon` (collapses to icons), `:hidden` (hides completely), or `:none` (doesn't collapse).
-        option :collapsible, default: -> { :icon }
-
-        # @param [Boolean] default_open (true) Whether the sidebar is open by default.
-        option :default_open, default: -> { true }
-
-        # @param [Symbol] variant (:default) The visual variant of the sidebar.
-        option :variant, default: -> { :default }
-
-        # @param [Symbol] size (:md) Size of the sidebar. Can be :sm, :md, or :lg.
-        option :size, default: -> { :md }
-
-        # @param [String] width (null) The width of the sidebar. If provided, overrides the size option.
-        option :width, default: -> { nil }
-
-        # @param [String] collapsed_width (null) The width of the collapsed sidebar. If provided, overrides the default.
-        option :collapsed_width, default: -> { nil }
-
-        # Header component for the sidebar
-        renders_one :header_component, Ariadne::UI::Sidebar::Header::Component
-
-        # Footer component for the sidebar
-        renders_one :footer_component, Ariadne::UI::Sidebar::Footer::Component
-
-        # Content component for the sidebar
-        renders_one :content_component, Ariadne::UI::Sidebar::Content::Component
-        # Define style variants for the sidebar
-        style do
-          base do
-            [
-              "ariadne:flex",
-              "ariadne:flex-col",
-              "ariadne:h-screen",
-              "ariadne:overflow-hidden",
-              "ariadne:transition-all",
-              "ariadne:duration-300",
-              "ariadne:ease-in-out",
-              "ariadne:z-20",
-            ]
-          end
-
-          variants do
-            size do
-              sm do
-                ["ariadne:w-64 ariadne:data-[collapsed=true]:w-16"]
-              end
-
-              md do
-                ["ariadne:w-72 ariadne:data-[collapsed=true]:w-20"]
-              end
-
-              lg do
-                ["ariadne:w-80 ariadne:data-[collapsed=true]:w-24"]
-              end
-            end
-          end
-        end
-      end
-    end
-  end
-end

data/app/components/ariadne/ui/sidebar/content/component.html.erb

@@ -1,13 +0,0 @@
-<div class="<%= style %>">
-  <% if custom_content %>
-    <%= custom_content %>
-  <% end %>
-  <% if search %>
-    <%= search %>
-  <% end %>
-  <% if groups.any? %>
-    <% groups.each do |group| %>
-      <%= group %>
-    <% end %>
-  <% end %>
-</div>

data/app/components/ariadne/ui/sidebar/content/component.rb

@@ -1,37 +0,0 @@
-# typed: false
-# frozen_string_literal: true
-
-module Ariadne
-  module UI
-    module Sidebar
-      module Content
-        # Content component for the sidebar.
-        # Container for sidebar groups and items.
-        class Component < Ariadne::BaseComponent
-          # Accepts any content for the sidebar
-          renders_many :groups, Ariadne::UI::Sidebar::Group::Component
-
-          # Custom content can be placed anywhere within the sidebar content
-          renders_one :custom_content, BaseComponent::ACCEPT_ANYTHING
-
-          # Search box for the sidebar
-          renders_one :search, BaseComponent::ACCEPT_ANYTHING
-
-          style do
-            base do
-              [
-                "ariadne:flex",
-                "ariadne:flex-col",
-                "ariadne:gap-4",
-                "ariadne:flex-1",
-                "ariadne:overflow-y-auto",
-                "ariadne:p-4",
-                "ariadne:rounded-md",
-              ]
-            end
-          end
-        end
-      end
-    end
-  end
-end

data/app/components/ariadne/ui/sidebar/item/component.html.erb

@@ -1,20 +0,0 @@
-<%= content_tag(href.present? ? "a" : "div", data: { collapsed: false }, **html_attrs) do %>
-  <% if custom_content %>
-    <div class="ariadne:flex-1 ariadne:data-[sidebar-collapsed=true]:hidden"><%= custom_content %></div>
-  <% end %>
-  <div class="ariadne:flex ariadne:items-center ariadne:w-full">
-    <% if icon %>
-      <span class="ariadne:flex mr-2 ariadne:items-center ariadne:justify-center ariadne:w-5 ariadne:h-5 ariadne:flex-shrink-0">
-        <%= icon %>
-      </span>
-    <% end %>
-    <% if label.present? %>
-      <span class="ariadne:truncate ariadne:data-[sidebar-collapsed=true]:hidden"><%= label %></span>
-      <% if badge %>
-        <span class="ariadne:ml-auto ariadne:inline-flex ariadne:items-center ariadne:py-0 ariadne:h-5 ariadne:data-[sidebar-collapsed=true]:hidden">
-          <%= badge %>
-        </span>
-      <% end %>
-    <% end %>
-  </div>
-<% end %>

data/app/components/ariadne/ui/sidebar/item/component.rb

@@ -1,75 +0,0 @@
-# typed: false
-# frozen_string_literal: true
-
-module Ariadne
-  module UI
-    module Sidebar
-      module Item
-        # Item component for the sidebar.
-        # Used for navigation links or actions.
-        class Component < Ariadne::BaseComponent
-          # @param [String] href The URL the item links to
-          option :href, default: -> { nil }
-
-          # @param [Boolean] current Whether this item represents the current page
-          option :current, default: -> { false }
-
-          # @param [String] label Text label for the item
-          option :label, default: -> { nil }
-          option :html_attrs, default: -> { {} }
-
-          # Icon for the item
-          renders_one :icon, Ariadne::UI::Heroicon::Component
-          # Generic icon slot for custom icons
-          renders_one :icon_slot, BaseComponent::ACCEPT_ANYTHING
-
-          # Badge for the item (e.g., notification count)
-          renders_one :badge, BaseComponent::ACCEPT_ANYTHING
-
-          # Content for the item if not using label
-          renders_one :custom_content, BaseComponent::ACCEPT_ANYTHING
-
-          accepts_html_attributes do |html_attrs|
-            html_attrs[:class] = merge_tailwind_classes([style(current: current), html_attrs[:class]].join(" "))
-
-            if href.present?
-              html_attrs[:href] = href
-            end
-          end
-
-          style do
-            base do
-              [
-                "ariadne:flex",
-                "ariadne:items-center",
-                "ariadne:gap-3",
-                "ariadne:p-2",
-                "ariadne:rounded-md",
-                "ariadne:text-sm",
-                "ariadne:font-medium",
-                "ariadne:transition-colors",
-                "ariadne:duration-200",
-                "ariadne:outline-none",
-                "ariadne:focus-visible:ring-2",
-                "ariadne:focus-visible:ring-offset-2",
-                "ariadne:relative",
-                "ariadne:dark:hover:bg-purple-700/20",
-              ]
-            end
-
-            variants do
-              current do
-                yes do
-                  [
-                    "ariadne:bg-purple-700/20",
-                    "ariadne:dark:bg-purple-300/20",
-                  ]
-                end
-              end
-            end
-          end
-        end
-      end
-    end
-  end
-end