|
|
@@ -522,6 +522,97 @@
|
|
|
(p/do!
|
|
|
(reset! *show-new-property-config? false))))))))
|
|
|
|
|
|
+(rum/defcs property-key-cp <
|
|
|
+ (rum/local false ::hover?)
|
|
|
+ [state block property {:keys [class-schema? page-cp inline-text other-position?]}]
|
|
|
+ (let [*hover? (::hover? state)
|
|
|
+ icon (:logseq.property/icon property)]
|
|
|
+ [:div.flex.flex-row.items-center.gap-1
|
|
|
+ {:on-mouse-over #(reset! *hover? true)
|
|
|
+ :on-mouse-leave #(reset! *hover? false)}
|
|
|
+ ;; icon picker
|
|
|
+ (when-not other-position?
|
|
|
+ (let [content-fn (fn [{:keys [id]}]
|
|
|
+ (icon-component/icon-search
|
|
|
+ {:on-chosen
|
|
|
+ (fn [_e icon]
|
|
|
+ (when icon
|
|
|
+ (p/let [_ (db-property-handler/upsert-property! (:db/ident property)
|
|
|
+ (:block/schema property)
|
|
|
+ {:properties {:logseq.property/icon icon}})]
|
|
|
+ (shui/popup-hide! id))))}))]
|
|
|
+
|
|
|
+ (shui/trigger-as
|
|
|
+ :button
|
|
|
+ (-> (when-not config/publishing?
|
|
|
+ {:on-click (fn [^js e]
|
|
|
+ (shui/popup-show! (.-target e) content-fn
|
|
|
+ {:as-dropdown? true :auto-focus? true
|
|
|
+ :content-props {:onEscapeKeyDown #(.preventDefault %)}}))})
|
|
|
+ (assoc :class "flex items-center"))
|
|
|
+ (if icon
|
|
|
+ [:span.flex.items-center {:style {:color (or (some-> icon :color) "inherit")}}
|
|
|
+ (icon-component/icon icon {:size 15})]
|
|
|
+ (property-icon property nil)))))
|
|
|
+
|
|
|
+ (if config/publishing?
|
|
|
+ [:a.property-k.flex.select-none.jtrigger
|
|
|
+ {:on-click #(route-handler/redirect-to-page! (:block/uuid property))}
|
|
|
+ (:block/title property)]
|
|
|
+
|
|
|
+ (shui/trigger-as :a
|
|
|
+ {:tabIndex 0
|
|
|
+ :title (:block/title property)
|
|
|
+ :class "property-k flex select-none jtrigger w-full"
|
|
|
+ :on-pointer-down (fn [^js e]
|
|
|
+ (when (util/meta-key? e)
|
|
|
+ (route-handler/redirect-to-page! (:block/uuid property))
|
|
|
+ (.preventDefault e)))
|
|
|
+ :on-context-menu (fn [^js/MouseEvent e]
|
|
|
+ (util/stop e)
|
|
|
+ (shui/popup-show! (.-target e)
|
|
|
+ (fn [{:keys [id]}]
|
|
|
+ (property-v2/dropdown-editor id property block
|
|
|
+ {:debug? (.-altKey e)}))
|
|
|
+ {:content-props
|
|
|
+ {:class "ls-property-dropdown-editor as-root"}
|
|
|
+ :align "start"
|
|
|
+ :as-dropdown? true}))
|
|
|
+ :on-click (fn [^js e]
|
|
|
+ (shui/popup-show!
|
|
|
+ (.-target e)
|
|
|
+ (fn [{:keys [id]}]
|
|
|
+ [:div.p-2
|
|
|
+ [:h2.text-lg.font-medium.mb-2.p-1 "Configure property"]
|
|
|
+ [:span.close.absolute.right-2.top-2
|
|
|
+ (shui/button
|
|
|
+ {:variant :ghost :size :sm :class "!w-4 !h-6"
|
|
|
+ :on-click #(shui/popup-hide! id)}
|
|
|
+ (shui/tabler-icon "x" {:size 16}))]
|
|
|
+
|
|
|
+ (property-config property
|
|
|
+ {:inline-text inline-text
|
|
|
+ :page-cp page-cp})
|
|
|
+
|
|
|
+ (when-not (ldb/built-in-class-property? block property)
|
|
|
+ [:div.mt-4.border-t.pt-3.px-3.-mx-4.-mb-1
|
|
|
+ (shui/button
|
|
|
+ {:variant :ghost
|
|
|
+ :class "!text-red-rx-09 opacity-50 hover:opacity-100"
|
|
|
+ :size :sm
|
|
|
+ :on-click (fn []
|
|
|
+ (handle-delete-property! block property {:class-schema? class-schema?})
|
|
|
+ (shui/popup-hide!))}
|
|
|
+ "Delete property from this node")])])
|
|
|
+ {:content-props {:class "property-configure-popup-content"
|
|
|
+ :collisionPadding {:bottom 10 :top 10}
|
|
|
+ :avoidCollisions true
|
|
|
+ :align "start"}
|
|
|
+ :align "start"
|
|
|
+ :auto-side? true
|
|
|
+ :auto-focus? true}))}
|
|
|
+ (:block/title property)))]))
|
|
|
+
|
|
|
(rum/defcs property-input < rum/reactive
|
|
|
(rum/local nil ::ref)
|
|
|
(rum/local false ::show-new-property-config?)
|
|
|
@@ -575,8 +666,10 @@
|
|
|
(if property-key
|
|
|
[:div.ls-property-add.grid.grid-cols-5.gap-1.flex.flex-1.flex-row.items-center
|
|
|
[:div.flex.flex-row.items-center.col-span-2.property-key.gap-1
|
|
|
- (property-icon property (:type @*property-schema))
|
|
|
- [:div property-key]]
|
|
|
+ (when-not (:db/id property) (property-icon property (:type @*property-schema)))
|
|
|
+ (if (:db/id property) ; property exists already
|
|
|
+ (property-key-cp block property opts)
|
|
|
+ [:div property-key])]
|
|
|
[:div.col-span-3.flex.flex-row {:on-pointer-down (fn [e] (util/stop-propagation e))}
|
|
|
(when (not= @*show-new-property-config? :adding-property)
|
|
|
(cond
|
|
|
@@ -623,97 +716,6 @@
|
|
|
(ui/icon "plus" {:size 15})
|
|
|
[:div.ml-1.text-sm "Add property"]]]]))
|
|
|
|
|
|
-(rum/defcs property-key <
|
|
|
- (rum/local false ::hover?)
|
|
|
- [state block property {:keys [class-schema? page-cp inline-text other-position?]}]
|
|
|
- (let [*hover? (::hover? state)
|
|
|
- icon (:logseq.property/icon property)]
|
|
|
- [:div.flex.flex-row.items-center.gap-1
|
|
|
- {:on-mouse-over #(reset! *hover? true)
|
|
|
- :on-mouse-leave #(reset! *hover? false)}
|
|
|
- ;; icon picker
|
|
|
- (when-not other-position?
|
|
|
- (let [content-fn (fn [{:keys [id]}]
|
|
|
- (icon-component/icon-search
|
|
|
- {:on-chosen
|
|
|
- (fn [_e icon]
|
|
|
- (when icon
|
|
|
- (p/let [_ (db-property-handler/upsert-property! (:db/ident property)
|
|
|
- (:block/schema property)
|
|
|
- {:properties {:logseq.property/icon icon}})]
|
|
|
- (shui/popup-hide! id))))}))]
|
|
|
-
|
|
|
- (shui/trigger-as
|
|
|
- :button
|
|
|
- (-> (when-not config/publishing?
|
|
|
- {:on-click (fn [^js e]
|
|
|
- (shui/popup-show! (.-target e) content-fn
|
|
|
- {:as-dropdown? true :auto-focus? true
|
|
|
- :content-props {:onEscapeKeyDown #(.preventDefault %)}}))})
|
|
|
- (assoc :class "flex items-center"))
|
|
|
- (if icon
|
|
|
- [:span.flex.items-center {:style {:color (or (some-> icon :color) "inherit")}}
|
|
|
- (icon-component/icon icon {:size 15})]
|
|
|
- (property-icon property nil)))))
|
|
|
-
|
|
|
- (if config/publishing?
|
|
|
- [:a.property-k.flex.select-none.jtrigger
|
|
|
- {:on-click #(route-handler/redirect-to-page! (:block/uuid property))}
|
|
|
- (:block/title property)]
|
|
|
-
|
|
|
- (shui/trigger-as :a
|
|
|
- {:tabIndex 0
|
|
|
- :title (:block/title property)
|
|
|
- :class "property-k flex select-none jtrigger w-full"
|
|
|
- :on-pointer-down (fn [^js e]
|
|
|
- (when (util/meta-key? e)
|
|
|
- (route-handler/redirect-to-page! (:block/uuid property))
|
|
|
- (.preventDefault e)))
|
|
|
- :on-context-menu (fn [^js/MouseEvent e]
|
|
|
- (util/stop e)
|
|
|
- (shui/popup-show! (.-target e)
|
|
|
- (fn [{:keys [id]}]
|
|
|
- (property-v2/dropdown-editor id property block
|
|
|
- {:debug? (.-altKey e)}))
|
|
|
- {:content-props
|
|
|
- {:class "ls-property-dropdown-editor as-root"}
|
|
|
- :align "start"
|
|
|
- :as-dropdown? true}))
|
|
|
- :on-click (fn [^js e]
|
|
|
- (shui/popup-show!
|
|
|
- (.-target e)
|
|
|
- (fn [{:keys [id]}]
|
|
|
- [:div.p-2
|
|
|
- [:h2.text-lg.font-medium.mb-2.p-1 "Configure property"]
|
|
|
- [:span.close.absolute.right-2.top-2
|
|
|
- (shui/button
|
|
|
- {:variant :ghost :size :sm :class "!w-4 !h-6"
|
|
|
- :on-click #(shui/popup-hide! id)}
|
|
|
- (shui/tabler-icon "x" {:size 16}))]
|
|
|
-
|
|
|
- (property-config property
|
|
|
- {:inline-text inline-text
|
|
|
- :page-cp page-cp})
|
|
|
-
|
|
|
- (when-not (ldb/built-in-class-property? block property)
|
|
|
- [:div.mt-4.border-t.pt-3.px-3.-mx-4.-mb-1
|
|
|
- (shui/button
|
|
|
- {:variant :ghost
|
|
|
- :class "!text-red-rx-09 opacity-50 hover:opacity-100"
|
|
|
- :size :sm
|
|
|
- :on-click (fn []
|
|
|
- (handle-delete-property! block property {:class-schema? class-schema?})
|
|
|
- (shui/popup-hide!))}
|
|
|
- "Delete property from this node")])])
|
|
|
- {:content-props {:class "property-configure-popup-content"
|
|
|
- :collisionPadding {:bottom 10 :top 10}
|
|
|
- :avoidCollisions true
|
|
|
- :align "start"}
|
|
|
- :align "start"
|
|
|
- :auto-side? true
|
|
|
- :auto-focus? true}))}
|
|
|
- (:block/title property)))]))
|
|
|
-
|
|
|
(defn- resolve-linked-block-if-exists
|
|
|
"Properties will be updated for the linked page instead of the refed block.
|
|
|
For example, the block below has a reference to the page \"How to solve it\",
|
|
|
@@ -745,7 +747,7 @@
|
|
|
(contains? #{:default} type))
|
|
|
date? (= type :date)
|
|
|
checkbox? (= type :checkbox)
|
|
|
- property-key-cp (property-key block property (assoc (select-keys opts [:class-schema?])
|
|
|
+ property-key-cp (property-key-cp block property (assoc (select-keys opts [:class-schema?])
|
|
|
:block? block?
|
|
|
:inline-text inline-text
|
|
|
:page-cp page-cp))]
|