Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-28 15:41:25 -05:00
Code Issues Activity

🐛 Fix drag-select when renaming layer text

Browse source
This commit is contained in:
alonso.torres 2021-03-29 12:56:51 +02:00 • committed by Andrey Antukh
parent 0f6ce233bd
commit cd7ad03cf0
3 changed files with 23 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
CHANGES.md
View file

@ -64,6 +64,7 @@
- Fix cannot click on blocked elements in viewer [Taiga #1430](https://tree.taiga.io/project/penpot/issue/1430)
- Fix SVG not showing properties at code [Taiga #1437](https://tree.taiga.io/project/penpot/issue/1437)
- Fix shadows when exporting groups [Taiga #1495](https://tree.taiga.io/project/penpot/issue/1495)
- Fix drag-select when renaming layer text [Taiga #1307](https://tree.taiga.io/project/penpot/issue/1307)
### :arrow_up: Deps updates

20
frontend/src/app/main/ui/hooks.cljs
View file

@ -14,6 +14,7 @@
[app.common.spec :as us]
[app.main.data.shortcuts :refer [bind-shortcuts]]
[app.util.dom :as dom]
[app.util.object :as obj]
[app.util.dom.dnd :as dnd]
[app.util.logging :as log]
[app.util.timers :as ts]
@ -97,7 +98,7 @@
;; things go weird.
(defn use-sortable
[& {:keys [data-type data on-drop on-drag on-hold detect-center?] :as opts}]
[& {:keys [data-type data on-drop on-drag on-hold disabled detect-center?] :as opts}]
(let [ref (mf/use-ref)
state (mf/use-state {:over nil
:timer nil
@ -125,13 +126,16 @@
on-drag-start
(fn [event]
(dom/stop-propagation event)
;; (dnd/trace event data "drag-start")
(dnd/set-data! event data-type data)
(dnd/set-drag-image! event (invisible-image))
(dnd/set-allowed-effect! event "move")
(when (fn? on-drag)
(on-drag data)))
(if disabled
(dom/prevent-default event)
(let [target (dom/get-target event)]
(dom/stop-propagation event)
;; (dnd/trace event data "drag-start")
(dnd/set-data! event data-type data)
(dnd/set-drag-image! event (invisible-image))
(dnd/set-allowed-effect! event "move")
(when (fn? on-drag)
(on-drag data)))))
on-drag-enter
(fn [event]

21
frontend/src/app/main/ui/workspace/sidebar/layers.cljs
View file

@ -54,31 +54,25 @@
(l/derived (l/in [:workspace-local :shape-for-rename]) st/state))
(mf/defc layer-name
[{:keys [shape] :as props}]
[{:keys [shape on-start-edit on-stop-edit] :as props}]
(let [local (mf/use-state {})
shape-for-rename (mf/deref shape-for-rename-ref)
name-ref (mf/use-ref)
set-draggable (fn [value]
(let [parent (.. (mf/ref-val name-ref)
-parentNode
-parentNode)]
(set! (.-draggable parent) value)))
start-edit (fn []
(set-draggable false)
(on-start-edit)
(swap! local assoc :edition true))
accept-edit (fn []
(let [name-input (mf/ref-val name-ref)
name (dom/get-value name-input)]
(set-draggable true)
(on-stop-edit)
(swap! local assoc :edition false)
(st/emit! (dw/end-rename-shape)
(dw/update-shape (:id shape) {:name name}))))
cancel-edit (fn []
(set-draggable true)
(on-stop-edit)
(swap! local assoc :edition false)
(st/emit! (dw/end-rename-shape)))
@ -124,6 +118,8 @@
selected? (contains? selected id)
container? (or (= (:type item) :frame) (= (:type item) :group))
disable-drag (mf/use-state false)
expanded-iref (mf/use-memo
(mf/deps id)
(make-collapsed-iref id))
@ -203,6 +199,7 @@
:on-drop on-drop
:on-drag on-drag
:on-hold on-hold
:disabled @disable-drag
:detect-center? container?
:data {:id (:id item)
:index index
@ -229,7 +226,9 @@
:on-click select-shape
:on-double-click #(dom/stop-propagation %)}
[:& element-icon {:shape item}]
[:& layer-name {:shape item}]
[:& layer-name {:shape item
:on-start-edit #(reset! disable-drag true)
:on-stop-edit #(reset! disable-drag false)}]
[:div.element-actions
[:div.toggle-element {:class (when (:hidden item) "selected")