enhance(ui): export popup APIs to ui ns

deps/shui/src/logseq/shui/demo2.cljs

@@ -1,7 +1,7 @@
 (ns logseq.shui.demo2
   (:require [rum.core :as rum]
             [logseq.shui.ui :as ui]
-            [logseq.shui.popup.core :refer [get-popup] :as popup-core]
+            [logseq.shui.popup.core :refer [install-popups update-popup! get-popup]]
             [frontend.components.icon :refer [emojis-cp emojis]]))
 
 (rum/defc page []
@@ -9,7 +9,7 @@
    [:h1.text-3xl.font-bold.border-b.pb-4 "UI X Popup"]
 
    (rum/portal
-     (popup-core/install-popups)
+     (install-popups)
      js/document.body)
 
    (let [[emoji set-emoji!] (rum/use-state nil)
@@ -22,14 +22,14 @@
             "Choose a inline "
             [:a.underline
              {:on-click
-              #(popup-core/show! %
+              #(ui/popup-show! %
                  (fn [_config]
                    [:div.max-h-72.overflow-auto.p-1
                     (emojis-cp (take 80 emojis)
                       {:on-chosen
                        (fn [_ t]
                          (set-emoji! t)
-                         (popup-core/hide-all!))})])
+                         (ui/popup-hide-all!))})])
                  {:content-props {:class "w-72 p-0"}
                   :as-menu?      true})}
              (if emoji [:strong.px-1.text-6xl [:em-emoji emoji]] "emoji :O")] "."])]
@@ -39,7 +39,7 @@
       [:p.py-4
        (ui/button
          {:variant  :secondary
-          :on-click #(popup-core/show! %
+          :on-click #(ui/popup-show! %
                        (fn []
                          [:p.p-4
                           (emoji-picker true)]))}
@@ -59,13 +59,13 @@
             :on-change   (fn [^js e]
                            (let [val (.-value (.-target e))]
                              (set-q! val)
-                             (popup-core/update-popup! :select-a-fruit-input [:content] (gen-content val))))
+                             (update-popup! :select-a-fruit-input [:content] (gen-content val))))
             :class       "w-1/5"
             :on-focus    (fn [^js e]
                            (let [id :select-a-fruit-input
                                  [_ popup] (get-popup id)]
                              (if (not popup)
-                               (popup-core/show! (.-target e)
+                               (ui/popup-show! (.-target e)
                                  (gen-content q)
                                  {:id id
                                   :content-props
@@ -80,11 +80,11 @@
                                          (when (and
                                                  (not (.contains q-ref target))
                                                  (not (.closest target ".x-input-popup-content")))
-                                           (popup-core/hide! id)))))
+                                           (ui/popup-hide! id)))))
                                    :onOpenAutoFocus #(.preventDefault %)}})
 
                                ;; update content
-                               (popup-core/update-popup! id [:content]
+                               (update-popup! id [:content]
                                  (gen-content q)))))
             ;:on-blur     (fn [^js e]
             ;               (let [^js target (.-relatedTarget e)]
@@ -94,15 +94,15 @@
             }))]
 
       [:div.w-full.p-4.border.rounded.dotted.h-48.mt-8.bg-gray-02
-       {:on-click        #(popup-core/show! %
+       {:on-click        #(ui/popup-show! %
                             (->> (range 8)
                               (map (fn [it]
                                      (ui/dropdown-menu-item
                                        {:on-select (fn []
                                                      (ui/toast! it)
-                                                     (popup-core/hide-all!))}
+                                                     (ui/popup-hide-all!))}
                                        [:strong it]))))
                             {:as-menu?      true
                              :content-props {:class "w-48"}})
-        :on-context-menu #(popup-core/show! %
+        :on-context-menu #(ui/popup-show! %
                             [:h1.text-3xl.font-bold "hi x popup for custom context menu!"])}]])])

deps/shui/src/logseq/shui/popup/core.cljs

@@ -1,9 +1,30 @@
 (ns logseq.shui.popup.core
   (:require [rum.core :as rum]
-            [logseq.shui.ui :as ui]
+            [logseq.shui.util :as util]
             [medley.core :as medley]
             [logseq.shui.util :refer [use-atom]]))
 
+;; ui
+(def button (util/lsui-wrap "Button"))
+(def popover (util/lsui-wrap "Popover"))
+(def popover-trigger (util/lsui-wrap "PopoverTrigger"))
+(def popover-content (util/lsui-wrap "PopoverContent"))
+(def dropdown-menu (util/lsui-wrap "DropdownMenu"))
+(def dropdown-menu-trigger (util/lsui-wrap "DropdownMenuTrigger"))
+(def dropdown-menu-content (util/lsui-wrap "DropdownMenuContent"))
+(def dropdown-menu-group (util/lsui-wrap "DropdownMenuGroup"))
+(def dropdown-menu-item (util/lsui-wrap "DropdownMenuItem"))
+(def dropdown-menu-checkbox-item (util/lsui-wrap "DropdownMenuCheckboxItem"))
+(def dropdown-menu-radio-group (util/lsui-wrap "DropdownMenuRadioGroup"))
+(def dropdown-menu-radio-item (util/lsui-wrap "DropdownMenuRadioItem"))
+(def dropdown-menu-label (util/lsui-wrap "DropdownMenuLabel"))
+(def dropdown-menu-separator (util/lsui-wrap "DropdownMenuSeparator"))
+(def dropdown-menu-shortcut (util/lsui-wrap "DropdownMenuShortcut"))
+(def dropdown-menu-portal (util/lsui-wrap "DropdownMenuPortal"))
+(def dropdown-menu-sub (util/lsui-wrap "DropdownMenuSub"))
+(def dropdown-menu-sub-content (util/lsui-wrap "DropdownMenuSubContent"))
+(def dropdown-menu-sub-trigger (util/lsui-wrap "DropdownMenuSubTrigger"))
+
 ;; {:id :open? false :content nil :position [0 0] :root-props nil :content-props nil}
 (defonce ^:private *popups (atom []))
 (defonce ^:private *id (atom 0))
@@ -77,15 +98,15 @@
     [open?])
 
   (when-let [[x y] position]
-    (let [popup-root (if as-menu? ui/dropdown-menu ui/popover)
-          popup-trigger (if as-menu? ui/dropdown-menu-trigger ui/popover-trigger)
-          popup-content (if as-menu? ui/dropdown-menu-content ui/popover-content)]
+    (let [popup-root (if as-menu? dropdown-menu popover)
+          popup-trigger (if as-menu? dropdown-menu-trigger popover-trigger)
+          popup-content (if as-menu? dropdown-menu-content popover-content)]
       (popup-root
         (merge root-props {:open open?})
         (popup-trigger
           {:as-child true}
-          (ui/button {:class "w-1 h-1 overflow-hidden fixed p-0 opacity-0"
-                      :style {:top y :left x}} ""))
+          (button {:class "w-1 h-1 overflow-hidden fixed p-0 opacity-0"
+                   :style {:top y :left x}} ""))
         (popup-content
           (merge {:onEscapeKeyDown      #(hide! id)
                   :onPointerDownOutside #(hide! id)} content-props)

deps/shui/src/logseq/shui/ui.cljs

@@ -4,6 +4,7 @@
             [logseq.shui.toaster.core :as toaster-core]
             [logseq.shui.select.core :as select-core]
             [logseq.shui.dialog.core :as dialog-core]
+            [logseq.shui.popup.core :as popup-core]
             [logseq.shui.form.core :as form-core]))
 
 (def button (util/lsui-wrap "Button" {:static? false}))
@@ -23,9 +24,9 @@
 (def radio-group-item (util/lsui-wrap "RadioGroupItem"))
 (def skeleton (util/lsui-wrap "Skeleton"))
 (def calendar (util/lsui-wrap "Calendar"))
-(def popover (util/lsui-wrap "Popover"))
-(def popover-trigger (util/lsui-wrap "PopoverTrigger"))
-(def popover-content (util/lsui-wrap "PopoverContent"))
+(def popover popup-core/popover)
+(def popover-trigger popup-core/popover-trigger)
+(def popover-content popup-core/popover-content)
 
 (def tooltip (util/lsui-wrap "Tooltip"))
 (def tooltip-trigger (util/lsui-wrap "TooltipTrigger"))
@@ -58,21 +59,21 @@
 (def select-scroll-up-button select-core/select-scroll-up-button)
 (def select-scroll-down-button select-core/select-scroll-down-button)
 
-(def dropdown-menu (util/lsui-wrap "DropdownMenu"))
-(def dropdown-menu-trigger (util/lsui-wrap "DropdownMenuTrigger"))
-(def dropdown-menu-content (util/lsui-wrap "DropdownMenuContent"))
-(def dropdown-menu-group (util/lsui-wrap "DropdownMenuGroup"))
-(def dropdown-menu-item (util/lsui-wrap "DropdownMenuItem"))
-(def dropdown-menu-checkbox-item (util/lsui-wrap "DropdownMenuCheckboxItem"))
-(def dropdown-menu-radio-group (util/lsui-wrap "DropdownMenuRadioGroup"))
-(def dropdown-menu-radio-item (util/lsui-wrap "DropdownMenuRadioItem"))
-(def dropdown-menu-label (util/lsui-wrap "DropdownMenuLabel"))
-(def dropdown-menu-separator (util/lsui-wrap "DropdownMenuSeparator"))
-(def dropdown-menu-shortcut (util/lsui-wrap "DropdownMenuShortcut"))
-(def dropdown-menu-portal (util/lsui-wrap "DropdownMenuPortal"))
-(def dropdown-menu-sub (util/lsui-wrap "DropdownMenuSub"))
-(def dropdown-menu-sub-content (util/lsui-wrap "DropdownMenuSubContent"))
-(def dropdown-menu-sub-trigger (util/lsui-wrap "DropdownMenuSubTrigger"))
+(def dropdown-menu popup-core/dropdown-menu)
+(def dropdown-menu-trigger popup-core/dropdown-menu-trigger)
+(def dropdown-menu-content popup-core/dropdown-menu-content)
+(def dropdown-menu-group popup-core/dropdown-menu-group)
+(def dropdown-menu-item popup-core/dropdown-menu-item)
+(def dropdown-menu-checkbox-item popup-core/dropdown-menu-checkbox-item)
+(def dropdown-menu-radio-group popup-core/dropdown-menu-radio-group)
+(def dropdown-menu-radio-item popup-core/dropdown-menu-radio-item)
+(def dropdown-menu-label popup-core/dropdown-menu-label)
+(def dropdown-menu-separator popup-core/dropdown-menu-separator)
+(def dropdown-menu-shortcut popup-core/dropdown-menu-shortcut)
+(def dropdown-menu-portal popup-core/dropdown-menu-portal)
+(def dropdown-menu-sub popup-core/dropdown-menu-sub)
+(def dropdown-menu-sub-content popup-core/dropdown-menu-sub-content)
+(def dropdown-menu-sub-trigger popup-core/dropdown-menu-sub-trigger)
 
 (def context-menu (util/lsui-wrap "ContextMenu"))
 (def context-menu-trigger (util/lsui-wrap "ContextMenuTrigger"))
@@ -103,3 +104,11 @@
 
 (def toast! toaster-core/toast!)
 (def toast-dismiss! toaster-core/dismiss!)
+(def dialog-open! dialog-core/open!)
+(def dialog-alert! dialog-core/alert!)
+(def dialog-confirm! dialog-core/confirm!)
+(def dialog-close! dialog-core/close!)
+(def dialog-close-all! dialog-core/close-all!)
+(def popup-show! popup-core/show!)
+(def popup-hide! popup-core/hide!)
+(def popup-hide-all! popup-core/hide-all!)