mirror of
https://github.com/penpot/penpot.git
synced 2025-02-08 16:18:11 -05:00
🐛 Fix color indicators from unlinked libraries
This commit is contained in:
Eva
parent
09a3cf4b58
commit
2c0725a9d2
6 changed files with 100 additions and 51 deletions
|
|
@ -4,6 +4,7 @@
|
|||
|
||||
### :bug: Bugs fixed
|
||||
|
||||
- Fix colors from unlinked libs in color selected widget [Taiga #3712](https://tree.taiga.io/project/penpot/issue/3712)
|
||||
- Fix fill information not complete when paste plain text [Taiga #3680](https://tree.taiga.io/project/penpot/issue/3680)
|
||||
- Fix problem when resizing groups [Taiga #3702](https://tree.taiga.io/project/penpot/issue/3702)
|
||||
|
||||
|
|
|
|||
|
|
@ -36,12 +36,12 @@
|
|||
|
||||
(mf/defc shape-options
|
||||
{::mf/wrap [#(mf/throttle % 60)]}
|
||||
[{:keys [shape shapes-with-children page-id file-id]}]
|
||||
[{:keys [shape shapes-with-children page-id file-id shared-libs]}]
|
||||
[:*
|
||||
(case (:type shape)
|
||||
:frame [:& frame/options {:shape shape}]
|
||||
:group [:& group/options {:shape shape :shape-with-children shapes-with-children}]
|
||||
:text [:& text/options {:shape shape}]
|
||||
:group [:& group/options {:shape shape :shape-with-children shapes-with-children :file-id file-id :shared-libs shared-libs}]
|
||||
:text [:& text/options {:shape shape :file-id file-id :shared-libs shared-libs}]
|
||||
:rect [:& rect/options {:shape shape}]
|
||||
:circle [:& circle/options {:shape shape}]
|
||||
:path [:& path/options {:shape shape}]
|
||||
|
|
@ -61,6 +61,7 @@
|
|||
[{:keys [selected section shapes shapes-with-children page-id file-id]}]
|
||||
(let [drawing (mf/deref refs/workspace-drawing)
|
||||
base-objects (-> (mf/deref refs/workspace-page-objects))
|
||||
shared-libs (mf/deref refs/workspace-libraries)
|
||||
modifiers (mf/deref refs/workspace-modifiers)
|
||||
objects-modified (mf/with-memo [base-objects modifiers]
|
||||
(gsh/merge-modifiers base-objects modifiers))
|
||||
|
|
@ -77,16 +78,19 @@
|
|||
(cond
|
||||
(d/not-empty? drawing) [:& shape-options {:shape (:object drawing)
|
||||
:page-id page-id
|
||||
:file-id file-id}]
|
||||
:file-id file-id
|
||||
:shared-libs shared-libs}]
|
||||
(= 0 (count selected)) [:& page/options]
|
||||
(= 1 (count selected)) [:& shape-options {:shape (first selected-shapes)
|
||||
:page-id page-id
|
||||
:file-id file-id
|
||||
:shared-libs shared-libs
|
||||
:shapes-with-children shapes-with-children}]
|
||||
:else [:& multiple/options {:shapes-with-children shapes-with-children
|
||||
:shapes selected-shapes
|
||||
:page-id page-id
|
||||
:file-id file-id}])]]
|
||||
:file-id file-id
|
||||
:shared-libs shared-libs}])]]
|
||||
|
||||
[:& tab-element {:id :prototype
|
||||
:title (tr "workspace.options.prototype")}
|
||||
|
|
|
|||
|
|
@ -15,51 +15,88 @@
|
|||
[app.main.ui.icons :as i]
|
||||
[app.main.ui.workspace.sidebar.options.rows.color-row :refer [color-row]]
|
||||
[app.util.i18n :as i18n :refer [tr]]
|
||||
[cuerdas.core :as str]
|
||||
[rumext.alpha :as mf]))
|
||||
|
||||
(defn fill->color-att
|
||||
[fill]
|
||||
(let [attrs (d/without-nils {:color (:fill-color fill)
|
||||
[fill file-id shared-libs]
|
||||
(let [color-file-id (:fill-color-ref-file fill)
|
||||
color-id (:fill-color-ref-id fill)
|
||||
shared-libs-colors (dm/get-in shared-libs [color-file-id :data :colors])
|
||||
is-shared? (contains? shared-libs-colors color-id)
|
||||
attrs (if (or is-shared? (= color-file-id file-id))
|
||||
(d/without-nils {:color (str/lower (:fill-color fill))
|
||||
:opacity (:fill-opacity fill)
|
||||
:id (:fill-color-ref-id fill)
|
||||
:file-id (:fill-color-ref-file fill)
|
||||
:gradient (:fill-color-gradient fill)})]
|
||||
:id color-id
|
||||
:file-id color-file-id
|
||||
:gradient (:fill-color-gradient fill)})
|
||||
(d/without-nils {:color (str/lower (:fill-color fill))
|
||||
:opacity (:fill-opacity fill)
|
||||
:gradient (:fill-color-gradient fill)}))]
|
||||
{:attrs attrs
|
||||
:prop :fill
|
||||
:shape-id (:shape-id fill)
|
||||
:index (:index fill)}))
|
||||
|
||||
(defn stroke->color-att
|
||||
[stroke]
|
||||
(let [attrs (d/without-nils {:color (:stroke-color stroke)
|
||||
[stroke file-id shared-libs]
|
||||
(let [color-file-id (:stroke-color-ref-file stroke)
|
||||
color-id (:stroke-color-ref-id stroke)
|
||||
shared-libs-colors (dm/get-in shared-libs [color-file-id :data :colors])
|
||||
is-shared? (contains? shared-libs-colors color-id)
|
||||
has-color? (not (nil? (:stroke-color stroke)))
|
||||
attrs (if (or is-shared? (= color-file-id file-id))
|
||||
(d/without-nils {:color (str/lower (:stroke-color stroke))
|
||||
:opacity (:stroke-opacity stroke)
|
||||
:id (:stroke-color-ref-id stroke)
|
||||
:file-id (:stroke-color-ref-file stroke)
|
||||
:gradient (:stroke-color-gradient stroke)})]
|
||||
:id color-id
|
||||
:file-id color-file-id
|
||||
:gradient (:stroke-color-gradient stroke)})
|
||||
(d/without-nils {:color (str/lower (:stroke-color stroke))
|
||||
:opacity (:stroke-opacity stroke)
|
||||
:gradient (:stroke-color-gradient stroke)}))]
|
||||
(when has-color?
|
||||
{:attrs attrs
|
||||
:prop :stroke
|
||||
:shape-id (:shape-id stroke)
|
||||
:index (:index stroke)}))
|
||||
:index (:index stroke)})))
|
||||
|
||||
(defn shadow->color-att
|
||||
[shadow]
|
||||
(let [attrs (d/without-nils {:color (get-in shadow [:color :color])
|
||||
:opacity (get-in shadow [:color :opacity])
|
||||
:id (get-in shadow [:color :id])
|
||||
:file-id (get-in shadow [:color :file-id])
|
||||
:gradient (get-in shadow [:color :gradient])})]
|
||||
[shadow file-id shared-libs]
|
||||
(let [color-file-id (dm/get-in shadow [:color :file-id])
|
||||
color-id (dm/get-in shadow [:color :id])
|
||||
shared-libs-colors (dm/get-in shared-libs [color-file-id :data :colors])
|
||||
is-shared? (contains? shared-libs-colors color-id)
|
||||
attrs (if (or is-shared? (= color-file-id file-id))
|
||||
(d/without-nils {:color (str/lower (dm/get-in shadow [:color :color]))
|
||||
:opacity (dm/get-in shadow [:color :opacity])
|
||||
:id color-id
|
||||
:file-id (dm/get-in shadow [:color :file-id])
|
||||
:gradient (dm/get-in shadow [:color :gradient])})
|
||||
(d/without-nils {:color (str/lower (dm/get-in shadow [:color :color]))
|
||||
:opacity (dm/get-in shadow [:color :opacity])
|
||||
:gradient (dm/get-in shadow [:color :gradient])}))]
|
||||
|
||||
|
||||
{:attrs attrs
|
||||
:prop :shadow
|
||||
:shape-id (:shape-id shadow)
|
||||
:index (:index shadow)}))
|
||||
|
||||
(defn text->color-att
|
||||
[fill]
|
||||
(let [attrs (d/without-nils {:color (:fill-color fill)
|
||||
[fill file-id shared-libs]
|
||||
(let [color-file-id (:fill-color-ref-file fill)
|
||||
color-id (:fill-color-ref-id fill)
|
||||
shared-libs-colors (dm/get-in shared-libs [color-file-id :data :colors])
|
||||
is-shared? (contains? shared-libs-colors color-id)
|
||||
attrs (if (or is-shared? (= color-file-id file-id))
|
||||
(d/without-nils {:color (str/lower (:fill-color fill))
|
||||
:opacity (:fill-opacity fill)
|
||||
:id (:fill-color-ref-id fill)
|
||||
:file-id (:fill-color-ref-file fill)
|
||||
:gradient (:fill-color-gradient fill)})]
|
||||
:id color-id
|
||||
:file-id color-file-id
|
||||
:gradient (:fill-color-gradient fill)})
|
||||
(d/without-nils {:color (str/lower (:fill-color fill))
|
||||
:opacity (:fill-opacity fill)
|
||||
:gradient (:fill-color-gradient fill)}))]
|
||||
{:attrs attrs
|
||||
:prop :content
|
||||
:shape-id (:shape-id fill)
|
||||
|
|
@ -70,14 +107,14 @@
|
|||
(map-indexed #(assoc %2 :shape-id shape-id :index %1) node))
|
||||
|
||||
(defn extract-text-colors
|
||||
[text]
|
||||
[text file-id shared-libs]
|
||||
(let [content (txt/node-seq txt/is-text-node? (:content text))
|
||||
content-filtered (map :fills content)
|
||||
indexed (mapcat #(treat-node % (:id text)) content-filtered)]
|
||||
(map text->color-att indexed)))
|
||||
(map #(text->color-att % file-id shared-libs) indexed)))
|
||||
|
||||
(defn- extract-all-colors
|
||||
[shapes]
|
||||
[shapes file-id shared-libs]
|
||||
(reduce
|
||||
(fn [list shape]
|
||||
(let [fill-obj (map-indexed #(assoc %2 :shape-id (:id shape) :index %1) (:fills shape))
|
||||
|
|
@ -85,20 +122,20 @@
|
|||
shadow-obj (map-indexed #(assoc %2 :shape-id (:id shape) :index %1) (:shadow shape))]
|
||||
(if (= :text (:type shape))
|
||||
(-> list
|
||||
(into (map stroke->color-att) stroke-obj)
|
||||
(into (map shadow->color-att) shadow-obj)
|
||||
(into (extract-text-colors shape)))
|
||||
(into (map #(stroke->color-att % file-id shared-libs)) stroke-obj)
|
||||
(into (map #(shadow->color-att % file-id shared-libs)) shadow-obj)
|
||||
(into (extract-text-colors shape file-id shared-libs)))
|
||||
|
||||
(-> list
|
||||
(into (map fill->color-att) fill-obj)
|
||||
(into (map stroke->color-att) stroke-obj)
|
||||
(into (map shadow->color-att) shadow-obj)))))
|
||||
(into (map #(fill->color-att % file-id shared-libs)) fill-obj)
|
||||
(into (map #(stroke->color-att % file-id shared-libs)) stroke-obj)
|
||||
(into (map #(shadow->color-att % file-id shared-libs)) shadow-obj)))))
|
||||
[]
|
||||
shapes))
|
||||
|
||||
(defn- prepare-colors
|
||||
[shapes]
|
||||
(let [data (extract-all-colors shapes)
|
||||
[shapes file-id shared-libs]
|
||||
(let [data (into [] (remove nil? (extract-all-colors shapes file-id shared-libs)))
|
||||
grouped-colors (group-by :attrs data)
|
||||
all-colors (distinct (mapv :attrs data))
|
||||
|
||||
|
|
@ -113,9 +150,9 @@
|
|||
|
||||
(mf/defc color-selection-menu
|
||||
{::mf/wrap [#(mf/memo' % (mf/check-props ["shapes"]))]}
|
||||
[{:keys [shapes] :as props}]
|
||||
(let [{:keys [all-colors grouped-colors library-colors colors]} (mf/with-memo [shapes]
|
||||
(prepare-colors shapes))
|
||||
[{:keys [shapes file-id shared-libs] :as props}]
|
||||
(let [{:keys [all-colors grouped-colors library-colors colors]} (mf/with-memo [shapes file-id shared-libs]
|
||||
(prepare-colors shapes file-id shared-libs))
|
||||
expand-lib-color (mf/use-state false)
|
||||
expand-color (mf/use-state false)
|
||||
|
||||
|
|
|
|||
|
|
@ -27,7 +27,9 @@
|
|||
[props]
|
||||
(let [shape (unchecked-get props "shape")
|
||||
shape-with-children (unchecked-get props "shape-with-children")
|
||||
shared-libs (unchecked-get props "shared-libs")
|
||||
objects (->> shape-with-children (group-by :id) (d/mapm (fn [_ v] (first v))))
|
||||
file-id (unchecked-get props "file-id")
|
||||
|
||||
type :group
|
||||
[measure-ids measure-values] (get-attrs [shape] objects :measure)
|
||||
|
|
@ -55,7 +57,9 @@
|
|||
|
||||
(when (> (count objects) 2)
|
||||
[:& color-selection-menu {:type type
|
||||
:shapes (vals objects)}])
|
||||
:shapes (vals objects)
|
||||
:file-id file-id
|
||||
:shared-libs shared-libs}])
|
||||
|
||||
(when-not (empty? shadow-ids)
|
||||
[:& shadow-menu {:type type :ids shadow-ids :values shadow-values}])
|
||||
|
|
|
|||
|
|
@ -230,6 +230,7 @@
|
|||
shapes-with-children (unchecked-get props "shapes-with-children")
|
||||
page-id (unchecked-get props "page-id")
|
||||
file-id (unchecked-get props "file-id")
|
||||
shared-libs (unchecked-get props "shared-libs")
|
||||
objects (->> shapes-with-children (group-by :id) (d/mapm (fn [_ v] (first v))))
|
||||
show-caps (some #(and (= :path (:type %)) (gsh/open-path? %)) shapes)
|
||||
|
||||
|
|
@ -286,7 +287,7 @@
|
|||
:disable-stroke-style has-text?}])
|
||||
|
||||
(when-not (empty? shapes)
|
||||
[:& color-selection-menu {:type type :shapes (vals objects-no-measures)}])
|
||||
[:& color-selection-menu {:file-id file-id :type type :shapes (vals objects-no-measures) :shared-libs shared-libs}])
|
||||
|
||||
(when-not (empty? shadow-ids)
|
||||
[:& shadow-menu {:type type :ids shadow-ids :values shadow-values}])
|
||||
|
|
|
|||
|
|
@ -21,11 +21,13 @@
|
|||
[rumext.alpha :as mf]))
|
||||
|
||||
(mf/defc options
|
||||
[{:keys [shape] :as props}]
|
||||
[{:keys [shape file-id] :as props}]
|
||||
(let [ids [(:id shape)]
|
||||
type (:type shape)
|
||||
|
||||
state-map (mf/deref refs/workspace-editor-state)
|
||||
shared-libs (mf/deref refs/workspace-libraries)
|
||||
|
||||
editor-state (get state-map (:id shape))
|
||||
|
||||
layer-values (select-keys shape layer-attrs)
|
||||
|
|
@ -89,7 +91,7 @@
|
|||
:disable-stroke-style true}]
|
||||
|
||||
(when (= :multiple (:fills fill-values))
|
||||
[:& color-selection-menu {:type type :shapes [shape]}])
|
||||
[:& color-selection-menu {:type type :shapes [shape] :file-id file-id :shared-libs shared-libs}])
|
||||
|
||||
[:& shadow-menu
|
||||
{:ids ids
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue