浏览代码

fix: auto focus after typing /link

Tienson Qin 4 年之前
父节点
当前提交
593c48cd51
共有 2 个文件被更改,包括 6 次插入14 次删除
  1. 2 1
      src/main/frontend/commands.cljs
  2. 4 13
      src/main/frontend/components/editor.cljs

+ 2 - 1
src/main/frontend/commands.cljs

@@ -31,7 +31,8 @@
 (def link-steps [[:editor/input (str slash "link")]
 (def link-steps [[:editor/input (str slash "link")]
                  [:editor/show-input [{:command :link
                  [:editor/show-input [{:command :link
                                        :id :link
                                        :id :link
-                                       :placeholder "Link"}
+                                       :placeholder "Link"
+                                       :autoFocus true}
                                       {:command :link
                                       {:command :link
                                        :id :label
                                        :id :label
                                        :placeholder "Label"}]]])
                                        :placeholder "Label"}]]])

+ 4 - 13
src/main/frontend/components/editor.cljs

@@ -249,17 +249,6 @@
                       command (:command (first input-option))]
                       command (:command (first input-option))]
                   (on-submit command @input-value pos))
                   (on-submit command @input-value pos))
                 (reset! input-value nil))))})))
                 (reset! input-value nil))))})))
-  {:did-update
-   (fn [state]
-     (when-let [show-input (state/get-editor-show-input)]
-       (let [id (str "modal-input-"
-                     (name (:id (first show-input))))
-             first-input (gdom/getElement id)]
-         (when (and first-input
-                    (not (d/has-class? first-input "focused")))
-           (.focus first-input)
-           (d/add-class! first-input "focused"))))
-     state)}
   [state id on-submit]
   [state id on-submit]
   (when-let [input-option (state/sub :editor/show-input)]
   (when-let [input-option (state/sub :editor/show-input)]
     (let [{:keys [pos]} (util/react *slash-caret-pos)
     (let [{:keys [pos]} (util/react *slash-caret-pos)
@@ -267,7 +256,7 @@
       (when (seq input-option)
       (when (seq input-option)
         (let [command (:command (first input-option))]
         (let [command (:command (first input-option))]
           [:div.p-2.mt-2.rounded-md.shadow-sm.bg-base-2
           [:div.p-2.mt-2.rounded-md.shadow-sm.bg-base-2
-           (for [{:keys [id placeholder type] :as input-item} input-option]
+           (for [{:keys [id placeholder type autoFocus] :as input-item} input-option]
              [:div.my-3
              [:div.my-3
               [:input.form-input.block.w-full.pl-2.sm:text-sm.sm:leading-5
               [:input.form-input.block.w-full.pl-2.sm:text-sm.sm:leading-5
                (merge
                (merge
@@ -279,7 +268,9 @@
                                    (swap! input-value assoc id (util/evalue e)))
                                    (swap! input-value assoc id (util/evalue e)))
                   :auto-complete (if (util/chrome?) "chrome-off" "off")}
                   :auto-complete (if (util/chrome?) "chrome-off" "off")}
                   placeholder
                   placeholder
-                  (assoc :placeholder placeholder))
+                  (assoc :placeholder placeholder)
+                  autoFocus
+                  (assoc :auto-focus true))
                 (dissoc input-item :id))]])
                 (dissoc input-item :id))]])
            (ui/button
            (ui/button
             "Submit"
             "Submit"