keystone_ui 0.38.0 → 0.40.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: ba03a37368cf5e1f7e0b18721a1eca9a04aae5dea7a5b3d8887e3db9956f9e8f
-  data.tar.gz: 6c0eb35d049ec308a68984f32cd787d8fa1c183057a975322844187f294c31fc
+  metadata.gz: 50be7dcd619f5461a74ec4c8b7d2d6e09deb955af9b17817b1ef690f842f5a07
+  data.tar.gz: 1148f6cf6bba00291658cec6c0672eeae3500093ebbffec67bbbc412fabe72eb
 SHA512:
-  metadata.gz: 36f95ca64410c3d39cae7355a0f1f7673a66e963ecf78a67d82a5559c74eef5ea02de3dc4668aef26fdab81b7b330d8d30dbb1a0aea658f13a188fdfdf296e27
-  data.tar.gz: 41c5aff5beccf97a8fac694a8cb6e4250e9b6c4456efb78dc1335df8c5a3be086bacae0b5a28292520666bfae44f7df5b8d6cc9c2fbe36f88f619c0a61e33cc1
+  metadata.gz: 884b4a4d0b72cf66bc76d5e94af4322a65f1b82aa81a5fba5b6b3f3fbad865524d6dd7fb75dce0a33d1fec8e88e41691a4a57b045e5d920751b3c6fe1453e545
+  data.tar.gz: ca9f20d6ef81510e165a8c6a938e6a2cc0cb37dfc1c426b97f17e1695686521727d5e0336809084761d8c0e59f90aef425fe912878d79661e44fa89e4d12137b

data/app/components/keystone/ui/navigation_component.html.erb

@@ -4,15 +4,15 @@
 <% sidebar = capture do %>
   <nav class="<%= SIDEBAR_CLASSES %>">
     <% if logo? %>
-      <div><%= logo %></div>
+      <div class="<%= SIDEBAR_LOGO_CLASSES %>"><%= logo %></div>
     <% end %>
-    <% groups.each do |group, tabs| %>
-      <div class="<%= SIDEBAR_GROUP_CLASSES %>">
-        <p class="<%= sidebar_group_label_classes(tabs) %>"><%= group.label %></p>
-        <% tabs.each do |tab| %>
-          <a class="<%= sidebar_tab_classes(tab) %>" href="<%= tab.href_for(helpers) %>"><%= tab.label %></a>
+    <% groups.each do |group| %>
+      <details class="<%= SIDEBAR_GROUP_CLASSES %>"<%= " open" if group.active %>>
+        <summary class="<%= sidebar_group_label_classes(group) %>"><%= group.label %></summary>
+        <% group.tabs.each do |tab| %>
+          <a class="<%= sidebar_tab_classes(tab) %>" href="<%= tab.href %>"><%= tab.label %></a>
         <% end %>
-      </div>
+      </details>
     <% end %>
     <% if menus? %>
       <div class="<%= SIDEBAR_MENUS_CLASSES %>"><%= menus %></div>
@@ -25,16 +25,17 @@
   <%= sidebar unless sidebar_first? %>
 </div>
 <% else %>
+<div>
 <div class="<%= TOP_BAR_CLASSES %>">
 <%= render Keystone::Ui::NavbarComponent.new(sticky: false) do |navbar| %>
   <% if logo? %>
     <% navbar.with_logo do %><%= logo %><% end %>
   <% end %>
   <% navbar.with_desktop_links do %>
-    <% groups.each do |group, tabs| %>
-      <%= render Keystone::Ui::NavDropdownComponent.new(title: group.label, area: group.label, active: holds_current?(tabs)) do %>
-        <% tabs.each do |tab| %>
-          <%= render Keystone::Ui::NavItemComponent.new(label: tab.label, href: tab.href_for(helpers), active: current?(tab)) %>
+    <% groups.each do |group| %>
+      <%= render Keystone::Ui::NavDropdownComponent.new(title: group.label, area: group.label, active: group.active) do %>
+        <% group.tabs.each do |tab| %>
+          <%= render Keystone::Ui::NavItemComponent.new(label: tab.label, href: tab.href, active: tab.active) %>
         <% end %>
       <% end %>
     <% end %>
@@ -45,4 +46,5 @@
 <% end %>
 </div>
 <%= content %>
+</div>
 <% end %>

data/app/components/keystone/ui/navigation_component.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
-require "keystone_ui/navigation_order"
+require "keystone_ui/visible_navigation"
 
 module Keystone
   module Ui
@@ -8,11 +8,16 @@ module Keystone
       TOP_BAR_CLASSES = "hidden lg:block sticky top-0 z-40"
       SIDEBAR_ROW_CLASSES = "lg:flex"
       SIDEBAR_CLASSES = "ks-sidebar hidden lg:flex lg:sticky lg:top-0 lg:h-screen shrink-0 overflow-y-auto"
+      SIDEBAR_LOGO_CLASSES = "ks-sidebar-logo"
       SIDEBAR_GROUP_CLASSES = "flex flex-col"
       SIDEBAR_GROUP_LABEL_CLASSES = "ks-sidebar-group-label"
       SIDEBAR_TAB_CLASSES = "ks-sidebar-tab"
       ACTIVE_CLASS = "active"
-      SIDEBAR_MENUS_CLASSES = "mt-auto"
+      SIDEBAR_MENUS_CLASSES = [
+        "mt-auto [&_[data-dropdown-target=menu]]:static [&_[data-controller~=dropdown]]:flex-wrap [&_[data-dropdown-target=menu]]:basis-full",
+        "[&_[data-dropdown-target=menu].hidden]:block [&_[data-dropdown-target=menu].hidden]:h-0 [&_[data-dropdown-target=menu].hidden]:overflow-hidden",
+        "[&_[data-dropdown-target=menu].hidden]:my-0 [&_[data-dropdown-target=menu].hidden]:py-0 [&_[data-dropdown-target=menu].hidden]:invisible"
+      ].join(" ")
       SIDEBAR_CONTENT_CLASSES = "min-w-0 flex-1"
       SIDEBAR_PLACEMENTS = %w[left right].freeze
 
@@ -22,27 +27,20 @@ module Keystone
       attr_reader :groups
 
       def before_render
-        permitted = KeystoneUi.configuration.navigation_groups
-          .map { |group| [ group, group.tabs_permitted_for(helpers) ] }
-          .reject { |_group, tabs| tabs.empty? }
-        @groups = KeystoneUi::NavigationOrder.new(saved_navigation["order"] || []).arrange(permitted)
-        @current_tab = KeystoneUi.configuration.supplied_current_tab(helpers)
+        @groups = KeystoneUi::VisibleNavigation.new(
+          KeystoneUi.configuration.navigation_groups,
+          view: helpers,
+          saved_order: saved_navigation["order"] || [],
+          current_tab: KeystoneUi.configuration.supplied_current_tab(helpers)
+        ).groups
       end
 
-      def current?(tab)
-        tab.key == @current_tab
-      end
-
-      def holds_current?(tabs)
-        tabs.any? { |tab| current?(tab) }
-      end
-
-      def sidebar_group_label_classes(tabs)
-        [ SIDEBAR_GROUP_LABEL_CLASSES, (ACTIVE_CLASS if holds_current?(tabs)) ].compact.join(" ")
+      def sidebar_group_label_classes(group)
+        [ SIDEBAR_GROUP_LABEL_CLASSES, (ACTIVE_CLASS if group.active) ].compact.join(" ")
       end
 
       def sidebar_tab_classes(tab)
-        [ SIDEBAR_TAB_CLASSES, (ACTIVE_CLASS if current?(tab)) ].compact.join(" ")
+        [ SIDEBAR_TAB_CLASSES, (ACTIVE_CLASS if tab.active) ].compact.join(" ")
       end
 
       def anything_to_show?

data/lib/keystone_ui/engine.rb

@@ -3,6 +3,7 @@
 require "keystone_ui/source_css"
 require "keystone_ui/leftover_stylesheet"
 require "keystone_ui/look_check"
+require "keystone_ui/navigation_check"
 
 module KeystoneUi
   class Engine < ::Rails::Engine
@@ -32,8 +33,13 @@ module KeystoneUi
       KeystoneUi::LookCheck.new(looks: config.looks, default: config.default_look).call
     end
 
+    def self.check_navigation
+      KeystoneUi::NavigationCheck.new(groups: KeystoneUi.configuration.navigation_groups).call
+    end
+
     config.after_initialize do
       KeystoneUi::Engine.check_looks
+      KeystoneUi::Engine.check_navigation
 
       tailwind_dir = Rails.root.join("app/assets/tailwind")
       css_path = tailwind_dir.join("application.css")

data/lib/keystone_ui/navigation_check.rb

@@ -0,0 +1,37 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  class NavigationCheck
+    class Error < StandardError; end
+
+    def initialize(groups:)
+      @groups = groups
+    end
+
+    def call
+      @groups.each do |group|
+        raise Error, "The #{group.label} navigation group has no tabs." if group.tabs.empty?
+      end
+      tabs.each do |tab|
+        raise Error, "The #{tab.key} tab has no label." if blank?(tab.label)
+        raise Error, "The #{tab.key} tab has no link." if blank?(tab.href)
+      end
+      raise Error, "More than one navigation tab has the key #{shared_key}." if shared_key
+      nil
+    end
+
+    private
+
+    def tabs
+      @groups.flat_map(&:tabs)
+    end
+
+    def shared_key
+      tabs.map(&:key).tally.find { |_key, count| count > 1 }&.first
+    end
+
+    def blank?(value)
+      value.nil? || value.to_s.strip.empty?
+    end
+  end
+end

data/lib/keystone_ui/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module KeystoneUi
-  VERSION = "0.38.0"
+  VERSION = "0.40.0"
 end

data/lib/keystone_ui/visible_navigation.rb

@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+
+require "keystone_ui/navigation_order"
+
+module KeystoneUi
+  class VisibleNavigation
+    Group = Struct.new(:label, :tabs, :active, keyword_init: true)
+    Tab = Struct.new(:label, :href, :active, keyword_init: true)
+
+    def initialize(declared_groups, view:, saved_order:, current_tab:)
+      @declared_groups = declared_groups
+      @view = view
+      @saved_order = saved_order
+      @current_tab = current_tab
+    end
+
+    def groups
+      NavigationOrder.new(@saved_order).arrange(permitted).map { |group, tabs| visible_group(group, tabs) }
+    end
+
+    private
+
+    def permitted
+      @declared_groups
+        .map { |group| [ group, group.tabs_permitted_for(@view) ] }
+        .reject { |_group, tabs| tabs.empty? }
+    end
+
+    def visible_group(group, tabs)
+      visible_tabs = tabs.map { |tab| visible_tab(tab) }
+      Group.new(label: group.label, tabs: visible_tabs, active: visible_tabs.any?(&:active))
+    end
+
+    def visible_tab(tab)
+      Tab.new(label: tab.label, href: tab.href_for(@view), active: tab.key == @current_tab)
+    end
+  end
+end