|  | @@ -77,12 +77,12 @@
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  (rum/defc root [{:keys [icon icon-theme query text info shortcut value-label value
 | 
	
		
			
				|  |  |                          title highlighted on-highlight on-highlight-dep header on-click
 | 
	
		
			
				|  |  | -                        hoverable compact rounded on-mouse-enter component-opts
 | 
	
		
			
				|  |  | -                        display-shortcut-on-highlight?] :as _props
 | 
	
		
			
				|  |  | +                        hoverable compact rounded on-mouse-enter component-opts] :as _props
 | 
	
		
			
				|  |  |                   :or {hoverable true rounded true}}
 | 
	
		
			
				|  |  |                  {:keys [app-config] :as context}]
 | 
	
		
			
				|  |  |    (let [ref (rum/create-ref)
 | 
	
		
			
				|  |  | -        highlight-query (partial highlight-query* app-config query)]
 | 
	
		
			
				|  |  | +        highlight-query (partial highlight-query* app-config query)
 | 
	
		
			
				|  |  | +        [hover? set-hover?] (rum/use-state false)]
 | 
	
		
			
				|  |  |      (rum/use-effect!
 | 
	
		
			
				|  |  |       (fn []
 | 
	
		
			
				|  |  |         (when (and highlighted on-highlight)
 | 
	
	
		
			
				|  | @@ -99,6 +99,8 @@
 | 
	
		
			
				|  |  |                       (not highlighted) (str " "))
 | 
	
		
			
				|  |  |              :ref ref
 | 
	
		
			
				|  |  |              :on-click (when on-click on-click)
 | 
	
		
			
				|  |  | +            :on-mouse-over #(set-hover? true)
 | 
	
		
			
				|  |  | +            :on-mouse-out #(set-hover? false)
 | 
	
		
			
				|  |  |              :on-mouse-enter (when on-mouse-enter on-mouse-enter)}
 | 
	
		
			
				|  |  |             component-opts)
 | 
	
		
			
				|  |  |       ;; header
 | 
	
	
		
			
				|  | @@ -133,10 +135,7 @@
 | 
	
		
			
				|  |  |             [:span.text-gray-11 (str (to-string value-label))])
 | 
	
		
			
				|  |  |           (when value
 | 
	
		
			
				|  |  |             [:span.text-gray-11 (to-string value)])])
 | 
	
		
			
				|  |  | -      (when (and shortcut
 | 
	
		
			
				|  |  | -                 (or (and display-shortcut-on-highlight? highlighted)
 | 
	
		
			
				|  |  | -                     (not display-shortcut-on-highlight?)))
 | 
	
		
			
				|  |  | -        [:div {:class (str "flex gap-1"
 | 
	
		
			
				|  |  | -                           (when display-shortcut-on-highlight? " fade-in"))
 | 
	
		
			
				|  |  | -               :style {:opacity (if highlighted 1 0.5)}}
 | 
	
		
			
				|  |  | +      (when shortcut
 | 
	
		
			
				|  |  | +        [:div {:class "flex gap-1"
 | 
	
		
			
				|  |  | +               :style {:opacity (if (or highlighted hover?) 1 0.5)}}
 | 
	
		
			
				|  |  |           (shortcut/root shortcut context)])]]))
 |