keystone_ui 0.37.0 → 0.39.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f1534a3f721376c82b75b22a653e8bcee3a0509bcd3b09cd137c93c78e15110f
-  data.tar.gz: 0df6e2e29387563688ba68bc53d8c29dc69aa322aa86c84b6416c0e3af36f703
+  metadata.gz: b11fa4104f5668547e8efeff23c90f69f4c3d1b7374103c33d7dc2c208363acb
+  data.tar.gz: 719716203afcd39869e402674d72a6bf8f1e5f4e7fce163a76c3429ae2bc77e2
 SHA512:
-  metadata.gz: 1869494c71af590cd1fa49fcd1062b024df02950f571e5dcbd7deaaa508574ad0f0aa2bfc8e23b0dc10d35ca440a50bc12e5d18063c62888de9eb29c42c09b45
-  data.tar.gz: 45563016cb89280c2e97cca008236c9fc50ba4681486a53f0d82fc4066e7db68368ad412c43b512cb2ca4ccd4f359dd29339890e24854eae2ead04ed9db7f6db
+  metadata.gz: b4849b26d1df9c8a45c7721fa966569e6d0f556780b5139a479a73e08c0602ce1db0eab5d4f8bfedcf5a30301cc4d1bba3cffdb0bf82e91a65a3d87c9fdb575c
+  data.tar.gz: 8fdb709bfbf187d4792a76c5057ebec69651fb5d4ba2e5b7a6b527b5e0ae68f437689896a492ec390f46ddc7d330fd3e00e2946588f41932d85bf82e790104e3

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

@@ -0,0 +1,48 @@
+<% if !anything_to_show? %>
+<%= content %>
+<% elsif sidebar? %>
+<% sidebar = capture do %>
+  <nav class="<%= SIDEBAR_CLASSES %>">
+    <% if logo? %>
+      <div><%= logo %></div>
+    <% end %>
+    <% groups.each do |group| %>
+      <div class="<%= SIDEBAR_GROUP_CLASSES %>">
+        <p class="<%= sidebar_group_label_classes(group) %>"><%= group.label %></p>
+        <% group.tabs.each do |tab| %>
+          <a class="<%= sidebar_tab_classes(tab) %>" href="<%= tab.href %>"><%= tab.label %></a>
+        <% end %>
+      </div>
+    <% end %>
+    <% if menus? %>
+      <div class="<%= SIDEBAR_MENUS_CLASSES %>"><%= menus %></div>
+    <% end %>
+  </nav>
+<% end %>
+<div class="<%= SIDEBAR_ROW_CLASSES %>">
+  <%= sidebar if sidebar_first? %>
+  <div class="<%= SIDEBAR_CONTENT_CLASSES %>"><%= content %></div>
+  <%= sidebar unless sidebar_first? %>
+</div>
+<% else %>
+<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| %>
+      <%= 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 %>
+  <% end %>
+  <% if menus? %>
+    <% navbar.with_desktop_right do %><%= menus %><% end %>
+  <% end %>
+<% end %>
+</div>
+<%= content %>
+<% end %>

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

@@ -0,0 +1,65 @@
+# frozen_string_literal: true
+
+require "keystone_ui/visible_navigation"
+
+module Keystone
+  module Ui
+    class NavigationComponent < ViewComponent::Base
+      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_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_CONTENT_CLASSES = "min-w-0 flex-1"
+      SIDEBAR_PLACEMENTS = %w[left right].freeze
+
+      renders_one :logo
+      renders_one :menus
+
+      attr_reader :groups
+
+      def before_render
+        @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 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 tab.active) ].compact.join(" ")
+      end
+
+      def anything_to_show?
+        groups.any? || logo? || menus?
+      end
+
+      def sidebar?
+        SIDEBAR_PLACEMENTS.include?(placement)
+      end
+
+      def sidebar_first?
+        placement == "left"
+      end
+
+      private
+
+      def placement
+        saved_navigation["placement"]
+      end
+
+      def saved_navigation
+        value = KeystoneUi.configuration.supplied_preference(helpers, :navigation)&.dig(:value)
+        value.is_a?(Hash) ? value : {}
+      end
+    end
+  end
+end

data/app/helpers/keystone_ui_helper.rb

@@ -141,6 +141,10 @@ module KeystoneUiHelper
     render Keystone::Ui::NavbarComponent.new(**args), &block
   end
 
+  def ui_navigation(&block)
+    render Keystone::Ui::NavigationComponent.new, &block
+  end
+
   def ui_nav_item(**args)
     render Keystone::Ui::NavItemComponent.new(**args)
   end

data/lib/keystone_ui/configuration.rb

@@ -1,9 +1,11 @@
 # frozen_string_literal: true
 
+require "keystone_ui/navigation_group"
+
 module KeystoneUi
   class Configuration
-    attr_accessor :accent, :surface, :theme_mode_supplier, :look_supplier, :trail_supplier, :preference_supplier
-    attr_reader :tailwind_imports, :tailwind_sources, :looks, :default_look
+    attr_accessor :accent, :surface, :theme_mode_supplier, :look_supplier, :trail_supplier, :preference_supplier, :current_tab_supplier
+    attr_reader :tailwind_imports, :tailwind_sources, :looks, :default_look, :navigation_groups
 
     def initialize
       @accent = :blue
@@ -11,6 +13,7 @@ module KeystoneUi
       @tailwind_imports = []
       @tailwind_sources = []
       @looks = {}
+      @navigation_groups = []
     end
 
     def default_look=(name)
@@ -22,6 +25,12 @@ module KeystoneUi
       @tailwind_imports << path.to_s
     end
 
+    def navigation_group(label)
+      group = NavigationGroup.new(label)
+      yield(group)
+      @navigation_groups << group
+    end
+
     def supplied_look(view)
       look_supplier&.call(view)&.to_s
     end
@@ -37,6 +46,10 @@ module KeystoneUi
     def supplied_preference(view, key)
       preference_supplier&.call(view, key)
     end
+
+    def supplied_current_tab(view)
+      current_tab_supplier&.call(view)
+    end
   end
 
   def self.configuration

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/navigation_group.rb

@@ -0,0 +1,26 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  class NavigationGroup
+    Tab = Struct.new(:key, :label, :href, :permitted, keyword_init: true) do
+      def href_for(view)
+        href.respond_to?(:call) ? href.call(view) : href
+      end
+    end
+
+    attr_reader :label, :tabs
+
+    def initialize(label)
+      @label = label
+      @tabs = []
+    end
+
+    def tabs_permitted_for(view)
+      tabs.select { |tab| tab.permitted.call(view) }
+    end
+
+    def tab(key, label:, href:, permitted:)
+      @tabs << Tab.new(key: key, label: label, href: href, permitted: permitted)
+    end
+  end
+end

data/lib/keystone_ui/navigation_order.rb

@@ -0,0 +1,35 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  class NavigationOrder
+    def initialize(saved)
+      @saved = saved.is_a?(Array) ? saved.grep(Hash) : []
+    end
+
+    def arrange(groups)
+      in_saved_order(groups, group_labels) { |group, _tabs| group.label }
+        .map { |group, tabs| [ group, arrange_tabs(group, tabs) ] }
+    end
+
+    private
+
+    def in_saved_order(items, saved_names)
+      items.each_with_index
+        .sort_by { |item, declared| [ saved_names.index(yield(item)) || saved_names.size, declared ] }
+        .map(&:first)
+    end
+
+    def group_labels
+      @saved.map { |entry| entry["group"] }
+    end
+
+    def arrange_tabs(group, tabs)
+      in_saved_order(tabs, saved_tab_keys(group)) { |tab| tab.key.to_s }
+    end
+
+    def saved_tab_keys(group)
+      tabs = @saved.find { |entry| entry["group"] == group.label }&.fetch("tabs", nil)
+      tabs.is_a?(Array) ? tabs : []
+    end
+  end
+end

data/lib/keystone_ui/safelist.rb

@@ -37,6 +37,7 @@ module Keystone
       Keystone::Ui::NavItemComponent,
       Keystone::Ui::BottomNavItemComponent,
       Keystone::Ui::NavbarComponent,
+      Keystone::Ui::NavigationComponent,
       Keystone::Ui::BottomNavComponent,
       Keystone::Ui::SettingsLinkComponent,
       Keystone::Ui::FormPageComponent,

data/lib/keystone_ui/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module KeystoneUi
-  VERSION = "0.37.0"
+  VERSION = "0.39.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