keystone_ui 0.24.0 → 0.25.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 0ebdae8cec6c4c1ac5a5d9e0ba2c2f81af46ac2bcd2d1537dce3ac039287a895
-  data.tar.gz: 3729bc3f9486e0adca2a21482bf493c832506d36c0e5bb9e98a50bba7a70e49a
+  metadata.gz: 0dcc3e30b080deb833cdbbcde6a946930de28fa541cb24fbdef2d83087eaca7c
+  data.tar.gz: 4c623f38dcbdd1f43371359af97b06fafd59796570267479db951236ac7daf85
 SHA512:
-  metadata.gz: 1091cd7bb197a64a0ceb327906932e191e11e19bbcdc2559283cfde82573a7ad36adc4a6b1c2e430fef41eeb421642e6d3779ca1879a172d009098e98a4cfbba
-  data.tar.gz: 2d532adcf2a254df72de1e82383f4f373a520c03503adbf31c9c45b881c2a0f8296348bb0f581b3360e8b7ff505fd22431a41f7fef6042fc15681cbf97242833
+  metadata.gz: 38add779239157bad1402f79b96cd66bf3219c39dac2e90b8d3b27eda892137bc1b2b5a0f5ed5df175e92b3963a90996fbc861d81b82667f87f711b37e08b7af
+  data.tar.gz: 4838c78a35737a4bdea3d3d847ddc7b60276a9630543990510a9ef0c2e67a52a34d0b87cf939b4d14a8213a9a0d52fe528615e232626c8b84de24d89158bc79f

data/app/assets/javascripts/keystone_ui/action_menu_controller.js

@@ -0,0 +1,31 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  static targets = ["menu", "button"]
+
+  toggle(event) {
+    event.stopPropagation()
+    this.menuTarget.classList.toggle("hidden")
+    if (!this.menuTarget.classList.contains("hidden")) this.place()
+  }
+
+  hide(event) {
+    if (!this.element.contains(event.target)) {
+      this.menuTarget.classList.add("hidden")
+    }
+  }
+
+  close() {
+    this.menuTarget.classList.add("hidden")
+  }
+
+  place() {
+    const button = this.buttonTarget.getBoundingClientRect()
+    Object.assign(this.menuTarget.style, {
+      position: "fixed",
+      top: `${button.bottom}px`,
+      left: `${button.right - this.menuTarget.offsetWidth}px`,
+      right: "auto"
+    })
+  }
+}

data/app/assets/javascripts/keystone_ui/index.js

@@ -4,6 +4,7 @@ import SwipeDeckController from "keystone_ui/swipe_deck_controller"
 import ColumnPickerController from "keystone_ui/column_picker_controller"
 import FileUploadController from "keystone_ui/file_upload_controller"
 import DropdownController from "keystone_ui/dropdown_controller"
+import ActionMenuController from "keystone_ui/action_menu_controller"
 import DismissController from "keystone_ui/dismiss_controller"
 import ModalController from "keystone_ui/modal_controller"
 import ClipboardController from "keystone_ui/clipboard_controller"
@@ -22,6 +23,7 @@ export function registerControllers(application) {
   application.register("column-picker", ColumnPickerController)
   application.register("file-upload", FileUploadController)
   application.register("dropdown", DropdownController)
+  application.register("action-menu", ActionMenuController)
   application.register("dismiss", DismissController)
   application.register("modal", ModalController)
   application.register("clipboard", ClipboardController)

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

@@ -1,11 +1,12 @@
-<div class="<%= WRAPPER_CLASSES %>" data-controller="dropdown">
+<div class="<%= WRAPPER_CLASSES %>" data-controller="action-menu" data-action="scroll@window->action-menu#close resize@window->action-menu#close">
   <button type="button"
-          data-action="click->dropdown#toggle click@window->dropdown#hide"
+          data-action="click->action-menu#toggle click@window->action-menu#hide"
+          data-action-menu-target="button"
           class="<%= BUTTON_CLASSES %>"
           aria-label="Actions">
     <%= ELLIPSIS_ICON.html_safe %>
   </button>
-  <div data-dropdown-target="menu" class="<%= DROPDOWN_CLASSES %>">
+  <div data-action-menu-target="menu" class="<%= DROPDOWN_CLASSES %>">
     <%= content %>
   </div>
 </div>

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

@@ -43,8 +43,11 @@
             <% end %>
             <% if actions? %>
               <td class="<%= Keystone::Ui::DataTableComponent::ROW_CLASSES_LAST %>">
-                <%= render Keystone::Ui::ActionMenuComponent.new do %>
-                  <%= capture(item, &@actions_block) %>
+                <% row_actions = capture(item, &@actions_block) %>
+                <% if row_actions.present? %>
+                  <%= render Keystone::Ui::ActionMenuComponent.new do %>
+                    <%= row_actions %>
+                  <% end %>
                 <% end %>
               </td>
             <% end %>

data/config/importmap.rb

@@ -5,6 +5,7 @@ pin "keystone_ui/swipe_deck_controller", to: "keystone_ui/swipe_deck_controller.
 pin "keystone_ui/column_picker_controller", to: "keystone_ui/column_picker_controller.js"
 pin "keystone_ui/file_upload_controller", to: "keystone_ui/file_upload_controller.js"
 pin "keystone_ui/dropdown_controller", to: "keystone_ui/dropdown_controller.js"
+pin "keystone_ui/action_menu_controller", to: "keystone_ui/action_menu_controller.js"
 pin "keystone_ui/dismiss_controller", to: "keystone_ui/dismiss_controller.js"
 pin "keystone_ui/modal_controller", to: "keystone_ui/modal_controller.js"
 pin "keystone_ui/clipboard_controller", to: "keystone_ui/clipboard_controller.js"

data/lib/keystone_ui/version.rb

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

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: keystone_ui
 version: !ruby/object:Gem::Version
-  version: 0.24.0
+  version: 0.25.0
 platform: ruby
 authors:
 - Tyler Schneider
@@ -52,6 +52,7 @@ extra_rdoc_files: []
 files:
 - MIT-LICENSE
 - app/assets/javascripts/keystone_ui/accordion_controller.js
+- app/assets/javascripts/keystone_ui/action_menu_controller.js
 - app/assets/javascripts/keystone_ui/auto_submit_controller.js
 - app/assets/javascripts/keystone_ui/chartjs.js
 - app/assets/javascripts/keystone_ui/clipboard_controller.js