Autoselect all text on enter edition mode.

This commit is contained in:
Andrey Antukh 2020-05-05 08:43:05 +02:00 committed by Alonso Torres
parent cf05980dae
commit 6b9ed0c5a3
2 changed files with 18 additions and 4 deletions

View file

@ -17,7 +17,7 @@
[uxbox.main.fonts :as fonts] [uxbox.main.fonts :as fonts]
[uxbox.main.data.workspace.common :as dwc] [uxbox.main.data.workspace.common :as dwc]
["slate-react" :as rslate] ["slate-react" :as rslate]
["slate" :as slate :refer [Editor Transforms Text]])) ["slate" :as slate :refer [Editor Node Transforms Text]]))
(defn create-editor (defn create-editor
[] []
@ -37,11 +37,20 @@
(defn- calculate-full-selection (defn- calculate-full-selection
[editor] [editor]
(let [children (obj/get editor "children") (let [children (obj/get editor "children")
paragraphs (obj/get-in children [0 "children" 0 "children"])] paragraphs (obj/get-in children [0 "children" 0 "children"])
lastp (aget paragraphs (dec (alength paragraphs)))
lastptxt (.string Node lastp)]
#js {:anchor #js {:path #js [0 0 0] #js {:anchor #js {:path #js [0 0 0]
:offset 0} :offset 0}
:focus #js {:path #js [0 0 (dec (alength paragraphs))] :focus #js {:path #js [0 0 (dec (alength paragraphs))]
:offset 1}})) :offset (alength lastptxt)}}))
(defn- editor-select-all!
[editor]
(let [children (obj/get editor "children")
paragraphs (obj/get-in children [0 "children" 0 "children"])
range (calculate-full-selection editor)]
(.select Transforms editor range)))
(defn- editor-set! (defn- editor-set!
([editor props] ([editor props]

View file

@ -273,6 +273,10 @@
(events/unlistenByKey lkey1) (events/unlistenByKey lkey1)
(events/unlistenByKey lkey2)))) (events/unlistenByKey lkey2))))
on-focus
(fn [event]
(dwt/editor-select-all! editor))
on-change on-change
(mf/use-callback (mf/use-callback
(fn [val] (fn [val]
@ -291,6 +295,7 @@
[:> rslate/Editable [:> rslate/Editable
{:auto-focus "true" {:auto-focus "true"
:spell-check "false" :spell-check "false"
:on-focus on-focus
:class "rich-text" :class "rich-text"
:render-element render-element :render-element render-element
:render-leaf render-text :render-leaf render-text