atomic_view 0.1.15 → 0.1.16

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: bada6883ff0ebcfb57bb0cf9f153c8c978bd32601b3371d0a5db2db02a57fab3
-  data.tar.gz: 59a99dd072921000d4dc906eafcc2d51b4638a7f78b625fd53e8c82dfe1017e6
+  metadata.gz: 815b41e5c66fe63cac96239f8d90cfdfa137da236e27f0d8577bdee068e35ce7
+  data.tar.gz: f4e735119fefc770222c595c49dd4031b43a64b2dcec004417bae2a610b9524e
 SHA512:
-  metadata.gz: 2bd3d154f20a387d44c6fd2fbf30c6c00ca790ae8a4531d92c69291ed0a1f1c0cad1313a0807c9d576bec552e4faa297d3acab6be83feb7c14e4227440a228c6
-  data.tar.gz: 77657284d3f55f498dda813f30542b65077c979804ef0d64fed520162ab0e154c6b58a7719ef345d516e4d58f66e013adc6b839ec5b180570a74b9c1658f1bfd
+  metadata.gz: d013eb53df0f79b51f6be0d0fcb167f52f2621a5dde41bad2385df742d426e44d68f7422bc4b697ff43db623797fe350c4cdf3f8549872492804c488c9cdcf3e
+  data.tar.gz: 0efc941867d3a932de3de2f98ef8318260a5c9df7b100406e5e4074dff38da2fe6cdbb55360a82b89b89ea350c205e52761bffd8f6483f280970a11c045491be

data/app/assets/javascripts/atomic_view/controllers/command_palette_controller.js

@@ -1,18 +1,24 @@
 import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
-  static targets = ["input", "row"]
+  static targets = ["input", "row", "section"]
 
   highlightedIndex = null
 
   connect() {
     document.addEventListener("keydown", this.onGlobalKeydown)
     this.element.addEventListener("close", this.onClose)
+    this.element.addEventListener("click", this.closeOnBackdrop)
   }
 
   disconnect() {
     document.removeEventListener("keydown", this.onGlobalKeydown)
     this.element.removeEventListener("close", this.onClose)
+    this.element.removeEventListener("click", this.closeOnBackdrop)
+  }
+
+  closeOnBackdrop = (event) => {
+    if (event.target === this.element) this.element.close()
   }
 
   onGlobalKeydown = (event) => {
@@ -25,6 +31,7 @@ export default class extends Controller {
   onClose = () => {
     this.inputTarget.value = ""
     this.rowTargets.forEach((row) => row.classList.remove("hidden"))
+    this.sectionTargets.forEach((section) => section.classList.remove("hidden"))
     this.clearHighlight()
   }
 
@@ -36,6 +43,14 @@ export default class extends Controller {
       row.classList.toggle("hidden", !matches)
     })
 
+    // Hide a section immediately once every one of its rows is filtered
+    // out, rather than leaving its (now empty) label dangling until the
+    // server-side Turbo Stream search catches up.
+    this.sectionTargets.forEach((section) => {
+      const hasVisibleRow = this.rowTargets.some((row) => section.contains(row) && !row.classList.contains("hidden"))
+      section.classList.toggle("hidden", !hasVisibleRow)
+    })
+
     this.clearHighlight()
   }
 

data/lib/atomic_view/components/command_palette_component/section_component.html.erb

@@ -1,7 +1,7 @@
-<div role="group">
+<%= tag.div(role: "group", data: data_attributes) do %>
   <p class="px-3 pb-1 pt-2 text-xs font-semibold uppercase text-muted-foreground select-none"><%= label %></p>
 
   <% rows.each do |row| %>
     <%= row %>
   <% end %>
-</div>
+<% end %>

data/lib/atomic_view/components/command_palette_component/section_component.rb

@@ -18,6 +18,10 @@ module AtomicView
           @options = options
           results.each { |result| with_row(**result) }
         end
+
+        def data_attributes
+          (@options[:data] || {}).merge("atomic-view--command-palette-target" => "section")
+        end
       end
     end
   end

data/lib/atomic_view/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module AtomicView
-  VERSION = "0.1.15"
+  VERSION = "0.1.16"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: atomic_view
 version: !ruby/object:Gem::Version
-  version: 0.1.15
+  version: 0.1.16
 platform: ruby
 authors:
 - Joel Warrington