diff --git a/frontend/src/uxbox/main/ui/components/context_menu.cljs b/frontend/src/uxbox/main/ui/components/context_menu.cljs index 928baebba..ffab4be4d 100644 --- a/frontend/src/uxbox/main/ui/components/context_menu.cljs +++ b/frontend/src/uxbox/main/ui/components/context_menu.cljs @@ -2,7 +2,7 @@ (:require [rumext.alpha :as mf] [goog.object :as gobj] - [uxbox.main.ui.components.dropdown :refer [dropdown-container]] + [uxbox.main.ui.components.dropdown :refer [dropdown']] [uxbox.util.uuid :as uuid] [uxbox.util.data :refer [classnames]])) @@ -18,7 +18,7 @@ is-selectable (gobj/get props "selectable") selected (gobj/get props "selected")] (when open? - [:> dropdown-container props + [:> dropdown' props [:div.context-menu {:class (classnames :is-open open? :is-selectable is-selectable)} [:ul.context-menu-items diff --git a/frontend/src/uxbox/main/ui/components/dropdown.cljs b/frontend/src/uxbox/main/ui/components/dropdown.cljs index d592faa8a..abe796e55 100644 --- a/frontend/src/uxbox/main/ui/components/dropdown.cljs +++ b/frontend/src/uxbox/main/ui/components/dropdown.cljs @@ -2,20 +2,27 @@ (:require [rumext.alpha :as mf] [uxbox.util.uuid :as uuid] + [uxbox.util.dom :as dom] [goog.events :as events] [goog.object :as gobj]) (:import goog.events.EventType goog.events.KeyCodes)) -(mf/defc dropdown-container +(mf/defc dropdown' {::mf/wrap-props false} [props] (let [children (gobj/get props "children") on-close (gobj/get props "on-close") + ref (gobj/get props "container") on-click (fn [event] - (on-close)) + (if ref + (let [target (dom/get-target event) + parent (mf/ref-val ref)] + (when-not (.contains parent target) + (on-close))) + (on-close))) on-keyup (fn [event] @@ -40,4 +47,4 @@ (assert (boolean? (gobj/get props "show")) "missing `show` prop") (when (gobj/get props "show") - (mf/element dropdown-container props))) + (mf/element dropdown' props)))