mirror of https://github.com/logseq/logseq
[refactor] change editor input as uncontrolled component & try composition input for UX .
charlie
parent
54ef3aa574
commit
9ff67bba53
|
|
@ -676,7 +676,7 @@
|
|||
(not (string/blank? value))
|
||||
(not= (string/trim value) (string/trim content)))
|
||||
(let [old-page-name (db/get-file-page path false)]
|
||||
(page-handler/rename-when-alter-title-propertiy! old-page-name path format content value)
|
||||
(page-handler/rename-when-alter-title-property! old-page-name path format content value)
|
||||
(file/alter-file (state/get-current-repo) path (string/trim value)
|
||||
{:re-render-root? true}))))
|
||||
(when-not (contains? #{:insert :indent-outdent} (state/get-editor-op))
|
||||
|
|
@ -685,24 +685,22 @@
|
|||
[state {:keys [on-hide dummy? node format block block-parent-id]
|
||||
:or {dummy? false}
|
||||
:as option} id config]
|
||||
(let [content (state/sub [:editor/content id])]
|
||||
[:div.editor {:style {:position "relative"
|
||||
:display "flex"
|
||||
:flex "1 1 0%"}
|
||||
:class (if block "block-editor" "non-block-editor")}
|
||||
(let [content (state/get-edit-content)]
|
||||
[:div.editor-inner {:class (if block "block-editor" "non-block-editor")}
|
||||
(when config/mobile? (mobile-bar state id))
|
||||
(ui/textarea
|
||||
(ui/ls-textarea
|
||||
{:id id
|
||||
:value (or content "")
|
||||
:cacheMeasurements true
|
||||
:default-value (or content "")
|
||||
:minRows (if (state/enable-grammarly?) 2 1)
|
||||
:on-click (fn [_e]
|
||||
(let [input (gdom/getElement id)
|
||||
current-pos (:pos (util/get-caret-pos input))]
|
||||
(state/set-edit-pos! current-pos)
|
||||
(editor-handler/close-autocomplete-if-outside input)))
|
||||
:on-key-down (fn [_e]
|
||||
(let [current-pos (:pos (util/get-caret-pos (gdom/getElement id)))]
|
||||
(state/set-edit-pos! current-pos)))
|
||||
;:on-key-down (fn [_e]
|
||||
; (let [current-pos (:pos (util/get-caret-pos (gdom/getElement id)))]
|
||||
; (state/set-edit-pos! current-pos)))
|
||||
:on-change (fn [e]
|
||||
(let [value (util/evalue e)
|
||||
current-pos (:pos (util/get-caret-pos (gdom/getElement id)))]
|
||||
|
|
@ -716,8 +714,8 @@
|
|||
;; TODO: is it cross-browser compatible?
|
||||
(when (not= (gobj/get native-e "inputType") "insertFromPaste")
|
||||
(when-let [matched-commands (seq (editor-handler/get-matched-commands input))]
|
||||
(reset! *slash-caret-pos (util/get-caret-pos input))
|
||||
(reset! *show-commands true)))
|
||||
(reset! *slash-caret-pos (util/get-caret-pos input))
|
||||
(reset! *show-commands true)))
|
||||
"<"
|
||||
(when-let [matched-commands (seq (editor-handler/get-matched-block-commands input))]
|
||||
(reset! *angle-bracket-caret-pos (util/get-caret-pos input))
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@
|
|||
(defn set-save-before-unload! []
|
||||
(.addEventListener js/window "beforeunload"
|
||||
(fn [e]
|
||||
(when (state/repos-need-to-be-stored?)
|
||||
(when (and (not config/dev?) (state/repos-need-to-be-stored?))
|
||||
(let [notification-id (atom nil)]
|
||||
(let [id (notification/show!
|
||||
[:div
|
||||
|
|
|
|||
|
|
@ -357,7 +357,7 @@
|
|||
|
||||
(ui-handler/re-render-root!))))))
|
||||
|
||||
(defn rename-when-alter-title-propertiy!
|
||||
(defn rename-when-alter-title-property!
|
||||
[page path format original-content content]
|
||||
(when (and page (contains? config/mldoc-support-formats format))
|
||||
(let [old-name page
|
||||
|
|
|
|||
|
|
@ -17,6 +17,22 @@
|
|||
(defonce transition-group (r/adapt-class TransitionGroup))
|
||||
(defonce css-transition (r/adapt-class CSSTransition))
|
||||
(defonce textarea (r/adapt-class (gobj/get TextareaAutosize "default")))
|
||||
|
||||
(rum/defc ls-textarea [{:keys [on-change] :as -props}]
|
||||
(let [composition? (atom false)
|
||||
set-composition? #(reset! composition? %)
|
||||
on-composition (fn [e]
|
||||
(case e.type
|
||||
"compositionend" (do (set-composition? false))
|
||||
(set-composition? true)))
|
||||
props (assoc -props
|
||||
:on-change (fn [e] (when (not @composition?)
|
||||
(on-change e)))
|
||||
:on-composition-start on-composition
|
||||
:on-composition-update on-composition
|
||||
:on-composition-end on-composition)]
|
||||
(textarea props)))
|
||||
|
||||
(rum/defc dropdown-content-wrapper [state content class]
|
||||
(let [class (or class
|
||||
(util/hiccup->class "origin-top-right.absolute.right-0.mt-2.rounded-md.shadow-lg"))]
|
||||
|
|
@ -292,7 +308,7 @@
|
|||
:else
|
||||
nil)
|
||||
(when-let [element (gdom/getElement (str "ac-" @current-idx))]
|
||||
(let [ac-inner (gdom/getElement "ac-inner")
|
||||
(let [ac-inner (gdom/getElement "ui__ac-inner")
|
||||
element-top (gobj/get element "offsetTop")
|
||||
scroll-top (- (gobj/get element "offsetTop") 360)]
|
||||
(set! (.-scrollTop ac-inner) scroll-top)))))
|
||||
|
|
@ -306,7 +322,7 @@
|
|||
(reset! current-idx 0)
|
||||
(swap! current-idx inc)))
|
||||
(when-let [element (gdom/getElement (str "ac-" @current-idx))]
|
||||
(let [ac-inner (gdom/getElement "ac-inner")
|
||||
(let [ac-inner (gdom/getElement "ui__ac-inner")
|
||||
element-top (gobj/get element "offsetTop")
|
||||
scroll-top (- (gobj/get element "offsetTop") 360)]
|
||||
(set! (.-scrollTop ac-inner) scroll-top)))))
|
||||
|
|
@ -329,24 +345,16 @@
|
|||
item-render
|
||||
class]}]
|
||||
(let [current-idx (get state ::current-idx)]
|
||||
[:div.py-1.rounded-md.shadow-xs.bg-base-3 {:class class}
|
||||
[:div#ui__ac {:class class}
|
||||
(if (seq matched)
|
||||
[:div#ac-inner
|
||||
{:style {:max-height 400
|
||||
:overflow "hidden"
|
||||
:overflow-x "hidden"
|
||||
:overflow-y "auto"
|
||||
:position "relative"
|
||||
"-webkit-overflow-scrolling" "touch"}}
|
||||
[:div#ui__ac-inner
|
||||
(for [[idx item] (medley/indexed matched)]
|
||||
(rum/with-key
|
||||
(menu-link
|
||||
{:id (str "ac-" idx)
|
||||
:style {:padding-top 6
|
||||
:padding-bottom 6}
|
||||
:class (when (= @current-idx idx)
|
||||
"chosen")
|
||||
;; :tab-index -1
|
||||
{:id (str "ac-" idx)
|
||||
:class (when (= @current-idx idx)
|
||||
"chosen")
|
||||
;; :tab-index -1
|
||||
:on-click (fn [e]
|
||||
(util/stop e)
|
||||
(if (and (gobj/get e "shiftKey") on-shift-chosen)
|
||||
|
|
|
|||
Loading…
Reference in New Issue