0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-13 02:28:18 -05:00

🐛 Fix problems with drag/drop in layers

This commit is contained in:
alonso.torres 2024-01-08 18:10:18 +01:00
parent 9007371ab5
commit 2705876c56
2 changed files with 23 additions and 10 deletions

View file

@ -261,16 +261,29 @@
on-drop on-drop
(mf/use-fn (mf/use-fn
(mf/deps id index objects) (mf/deps id index objects expanded?)
(fn [side _data] (fn [side _data]
(let [to-index (cond (let [shape (get objects id)
(= side :center) 0
(= side :top) (inc index) parent-id
:else index) (cond
parent-id (if (= side :center) (= side :center)
id id
(and expanded? (= side :bot) (d/not-empty? (:shapes shape)))
id
:else
(cfh/get-parent-id objects id)) (cfh/get-parent-id objects id))
parent (get objects parent-id)]
parent (get objects parent-id)
to-index (cond
(= side :center) 0
(and expanded? (= side :bot) (d/not-empty? (:shapes shape))) (count (:shapes parent))
(= side :top) (inc index)
:else index)]
(when-not (ctk/in-component-copy? parent) ;; We don't want to change the structure of component copies (when-not (ctk/in-component-copy? parent) ;; We don't want to change the structure of component copies
(st/emit! (dw/relocate-selected-shapes parent-id to-index)))))) (st/emit! (dw/relocate-selected-shapes parent-id to-index))))))
@ -308,8 +321,8 @@
depth (+ depth 1) depth (+ depth 1)
component-tree? (or component-child? (:component-root item)) component-tree? (or component-child? (:component-root item))
enable-drag (mf/use-fn #(reset! drag-disabled* true)) enable-drag (mf/use-fn #(reset! drag-disabled* false))
disable-drag (mf/use-fn #(reset! drag-disabled* false))] disable-drag (mf/use-fn #(reset! drag-disabled* true))]
(mf/with-effect [selected? selected] (mf/with-effect [selected? selected]
(let [single? (= (count selected) 1) (let [single? (= (count selected) 1)

View file

@ -51,7 +51,7 @@
border-bottom: $s-2 solid var(--layer-row-foreground-color-hover); border-bottom: $s-2 solid var(--layer-row-foreground-color-hover);
} }
&.dnd-over-top { &.dnd-over-top {
border-bottom: $s-2 solid var(--layer-row-foreground-color-hover); border-top: $s-2 solid var(--layer-row-foreground-color-hover);
} }
&.dnd-over { &.dnd-over {
border: $s-2 solid var(--layer-row-foreground-color-hover); border: $s-2 solid var(--layer-row-foreground-color-hover);